:root{--c-ink:#25231f;--c-paper:#f3e6c6;--c-canvas:#fff9e8;--c-quest-red:#c94c3c;--c-journey-blue:#397c8c;--c-reward-gold:#dca83a;--c-success:#507a5a;--c-danger:#a93432;--c-neutral:#837b6d;--c-ink-70:color-mix(in srgb, var(--c-ink) 70%, transparent);--c-ink-65:color-mix(in srgb, var(--c-ink) 65%, transparent);--c-line:color-mix(in srgb, var(--c-ink) 18%, transparent);--c-line-strong:color-mix(in srgb, var(--c-ink) 55%, transparent);--c-quest-red-tint:color-mix(in srgb, var(--c-quest-red) 10%, var(--c-canvas));--c-blue-tint:color-mix(in srgb, var(--c-journey-blue) 10%, var(--c-canvas));--c-gold-tint:color-mix(in srgb, var(--c-reward-gold) 16%, var(--c-canvas));--c-success-tint:color-mix(in srgb, var(--c-success) 12%, var(--c-canvas));--c-danger-tint:color-mix(in srgb, var(--c-danger) 10%, var(--c-canvas));--c-neutral-tint:color-mix(in srgb, var(--c-neutral) 12%, var(--c-canvas));--bg-app:var(--c-paper);--bg-surface:var(--c-canvas);--text-primary:var(--c-ink);--text-secondary:var(--c-ink-70);--text-muted:var(--c-ink-65);--text-on-accent:var(--c-canvas);--action:var(--c-quest-red);--info:var(--c-journey-blue);--reward:var(--c-reward-gold);--done:var(--c-success);--risk:var(--c-danger);--locked:var(--c-neutral);--font-base:"Noto Sans", "Noto Sans KR", system-ui, -apple-system, sans-serif;--font-ko:"Noto Sans KR", "Noto Sans", system-ui, sans-serif;--font-en:"Noto Sans", system-ui, sans-serif;--font-vi:"Noto Sans", system-ui, sans-serif;--font-zh:"Noto Sans SC", "Noto Sans", system-ui, sans-serif;--fs-display:clamp(1.875rem, 2.2vw + 1.5rem, 2rem);--lh-display:1.15;--fw-display:800;--fs-h1:clamp(1.5rem, 1.6vw + 1.25rem, 1.625rem);--lh-h1:1.2;--fw-h1:800;--fs-h2:clamp(1.25rem, 1vw + 1.125rem, 1.3125rem);--lh-h2:1.3;--fw-h2:700;--fs-card-title:1.125rem;--lh-card-title:1.35;--fw-card-title:700;--fs-body:1rem;--lh-body:1.55;--fw-body:400;--fw-body-strong:500;--fs-button:1rem;--lh-button:1.2;--fw-button:700;--fs-caption:.875rem;--lh-caption:1.4;--fw-caption:500;--fs-meta:.8125rem;--lh-meta:1.4;--fw-meta:500;--sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:20px;--sp-6:24px;--sp-7:32px;--sp-8:40px;--gutter:16px;--content-max:448px;--readable-max:720px;--bottom-nav-h:64px;--header-h:56px;--r-control:12px;--r-card:16px;--r-hero:20px;--r-sheet:24px;--r-chip:999px;--pad-compact:14px;--pad-standard:18px;--pad-hero:22px;--bw-standard:1px;--bw-alert:1.5px;--bw-quest:2px;--shadow-none:none;--shadow-shallow:0 1px 2px color-mix(in srgb, var(--c-ink) 8%, transparent);--shadow-raised:0 2px 8px color-mix(in srgb, var(--c-ink) 10%, transparent);--btn-h-primary:52px;--btn-h-secondary:48px;--tap-min:44px;--g-btn-bg:#fff;--g-btn-border:#747775;--g-btn-text:#1f1f1f;--character-size:240px;--dur-fast:.12s;--dur-base:.2s;--dur-reveal:.6s;--ease:cubic-bezier(.2, 0, .2, 1);--z-nav:40;--z-sheet:60;--z-toast:80}@media (width>=768px){:root{--gutter:24px;--content-max:720px;--character-size:310px}}@media (width>=1024px){:root{--gutter:32px;--content-max:960px;--character-size:350px}}@media (width>=1280px){:root{--content-max:1080px}}html[lang=ko]{--font-base:var(--font-ko)}html[lang=en]{--font-base:var(--font-en)}html[lang=vi]{--font-base:var(--font-vi)}html[lang=zh-CN]{--font-base:var(--font-zh)}@media (prefers-reduced-motion:reduce){:root{--dur-fast:0s;--dur-base:0s;--dur-reveal:0s}}*,:before,:after{box-sizing:border-box}html,body,#root{height:100%}body{background:var(--bg-app);color:var(--text-primary);font-family:var(--font-base);font-size:var(--fs-body);line-height:var(--lh-body);font-weight:var(--fw-body);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;margin:0;overflow-x:hidden}h1,h2,h3,h4,p,figure,ul,ol{margin:0}:lang(ko),:lang(zh-CN){word-break:keep-all;overflow-wrap:anywhere}:lang(vi){line-height:1.62}ul,ol{padding:0;list-style:none}img,video,svg{max-width:100%;display:block}button{font:inherit;color:inherit;cursor:pointer}a{color:var(--info);text-underline-offset:2px;text-decoration-thickness:1px}:focus-visible{outline:3px solid var(--info);outline-offset:2px;border-radius:var(--r-control)}.t-display{font-size:var(--fs-display);line-height:var(--lh-display);font-weight:var(--fw-display);letter-spacing:-.02em}.t-h1{font-size:var(--fs-h1);line-height:var(--lh-h1);font-weight:var(--fw-h1);letter-spacing:-.015em}.t-h2{font-size:var(--fs-h2);line-height:var(--lh-h2);font-weight:var(--fw-h2);letter-spacing:-.01em}.t-title{font-size:var(--fs-card-title);line-height:var(--lh-card-title);font-weight:var(--fw-card-title)}.t-body{font-size:var(--fs-body);line-height:var(--lh-body);font-weight:var(--fw-body)}.t-body-s{font-size:var(--fs-body);line-height:var(--lh-body);font-weight:var(--fw-body-strong)}.t-caption{font-size:var(--fs-caption);line-height:var(--lh-caption);font-weight:var(--fw-caption)}.t-meta{font-size:var(--fs-meta);line-height:var(--lh-meta);font-weight:var(--fw-meta)}.t-secondary{color:var(--text-secondary)}.t-muted{color:var(--text-muted)}.sr-only{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.btn{justify-content:center;align-items:center;gap:var(--sp-2);border:var(--bw-standard) solid transparent;border-radius:var(--r-control);padding-inline:var(--sp-6);font-size:var(--fs-button);font-weight:var(--fw-button);line-height:var(--lh-button);text-align:center;text-wrap:balance;transition:background var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);min-height:var(--tap-min);display:inline-flex}.btn:disabled{cursor:not-allowed;opacity:.55}.btn--primary{min-height:var(--btn-h-primary);background:var(--action);color:var(--text-on-accent);border-color:var(--action)}.btn--primary:hover:not(:disabled){background:color-mix(in srgb, var(--action) 88%, var(--c-ink))}.btn--secondary{min-height:var(--btn-h-secondary);background:var(--bg-surface);color:var(--info);border-color:var(--info)}.btn--secondary:hover:not(:disabled){background:var(--c-blue-tint)}.btn--ghost{min-height:var(--tap-min);color:var(--text-secondary);padding-inline:var(--sp-4);background:0 0;border-color:#0000}.btn--ghost:hover:not(:disabled){background:color-mix(in srgb, var(--c-ink) 6%, transparent)}.btn--danger{min-height:var(--btn-h-primary);background:var(--risk);color:var(--text-on-accent);border-color:var(--risk)}.btn--google{min-height:var(--btn-h-primary);background:var(--g-btn-bg);color:var(--g-btn-text);border-color:var(--g-btn-border)}.btn--google:hover:not(:disabled){background:color-mix(in srgb, var(--g-btn-bg) 96%, var(--g-btn-text))}.btn--block{width:100%}.btn-group{gap:var(--sp-3);flex-direction:column;display:flex}@media (width>=480px){.btn-group{flex-direction:row}.btn-group>.btn{flex:auto}}.box{gap:var(--sp-3);background:var(--bg-surface);border:var(--bw-standard) solid var(--c-line);border-radius:var(--r-card);padding:var(--pad-standard);box-shadow:var(--shadow-none);flex-direction:column;display:flex;container-type:inline-size}.box--action{border-width:var(--bw-quest);border-color:var(--c-ink);border-radius:var(--r-hero);padding:var(--pad-hero);background:var(--bg-surface)}.box--info{border-color:color-mix(in srgb, var(--info) 40%, transparent);background:var(--c-blue-tint)}.box--status{border-color:var(--c-line);background:var(--bg-surface)}.box--alert{border-width:var(--bw-alert);border-color:var(--risk);background:var(--c-danger-tint)}.box--alert[data-severity=warn]{border-color:var(--reward);background:var(--c-gold-tint)}.box--alert[data-severity=info]{border-color:color-mix(in srgb, var(--info) 40%, transparent);background:var(--c-blue-tint)}.box--selection{padding:var(--pad-compact);cursor:pointer;transition:border-color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease)}.box--selection[aria-pressed=true],.box--selection[data-selected=true]{border-width:var(--bw-alert);border-color:var(--action);background:var(--c-quest-red-tint)}.box--container{gap:var(--sp-3);background:0 0;border:0;padding:0}.inset{border-radius:var(--r-control);padding:var(--pad-compact);background:color-mix(in srgb, var(--c-ink) 4%, transparent);border:var(--bw-standard) solid var(--c-line)}.box__eyebrow{align-items:center;gap:var(--sp-2);font-size:var(--fs-meta);font-weight:700;line-height:var(--lh-meta);letter-spacing:.04em;text-transform:uppercase;color:var(--text-muted);display:flex}.box__title{font-size:var(--fs-card-title);line-height:var(--lh-card-title);font-weight:var(--fw-card-title)}.box__desc{font-size:var(--fs-body);line-height:var(--lh-body);color:var(--text-secondary)}.box__meta{font-size:var(--fs-meta);line-height:var(--lh-meta);color:var(--text-muted)}.box__actions{gap:var(--sp-2);margin-top:var(--sp-1);flex-direction:column;display:flex}@container (width>=560px){.box__actions{flex-direction:row}.box__actions>.btn{flex:0 auto}}.chip{align-items:center;gap:var(--sp-1);border-radius:var(--r-chip);font-size:var(--fs-meta);font-weight:700;line-height:var(--lh-meta);border:var(--bw-standard) solid var(--c-line-strong);color:var(--text-secondary);white-space:nowrap;background:0 0;padding:4px 10px;display:inline-flex}.chip--action{color:var(--action);border-color:var(--action);background:var(--c-quest-red-tint)}.chip--info{color:var(--info);border-color:var(--info);background:var(--c-blue-tint)}.chip--reward{color:color-mix(in srgb, var(--reward) 75%, var(--c-ink));border-color:var(--reward);background:var(--c-gold-tint)}.chip--done{color:var(--done);border-color:var(--done);background:var(--c-success-tint)}.chip--risk{color:var(--risk);border-color:var(--risk);background:var(--c-danger-tint)}.chip--locked{color:var(--locked);border-color:var(--locked);background:var(--c-neutral-tint)}.progress{border-radius:var(--r-chip);background:color-mix(in srgb, var(--c-ink) 10%, transparent);height:8px;overflow:hidden}.progress__fill{border-radius:var(--r-chip);background:var(--info);height:100%;transition:width var(--dur-base) var(--ease)}.progress__fill[data-tone=action]{background:var(--action)}.progress__fill[data-tone=reward]{background:var(--reward)}.progress__fill[data-tone=done]{background:var(--done)}.grid-auto{gap:var(--sp-3);grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr));display:grid}.stack{gap:var(--sp-3);flex-direction:column;display:flex}.stack-4{gap:var(--sp-4);flex-direction:column;display:flex}.row{align-items:center;gap:var(--sp-2);flex-wrap:wrap;display:flex}.spacer{flex:auto}.app-shell{background:var(--bg-app);flex-direction:column;min-height:100dvh;display:flex}.app-main{width:100%;max-width:var(--content-max);padding-inline:var(--gutter);padding-block:var(--sp-4) calc(var(--bottom-nav-h) + var(--sp-8));flex:auto;margin-inline:auto}.app-main--nonav{padding-block-end:var(--sp-8)}@media (width>=1024px){.app-main{padding-block-end:var(--sp-8)}}.compact-header{z-index:var(--z-nav);align-items:center;gap:var(--sp-2);min-height:var(--header-h);padding-inline:var(--gutter);background:color-mix(in srgb, var(--bg-app) 92%, transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:var(--bw-standard) solid var(--c-line);display:flex;position:sticky;top:0}.compact-header__inner{width:100%;max-width:var(--content-max);align-items:center;gap:var(--sp-2);margin-inline:auto;display:flex}.compact-header__title{font-size:var(--fs-card-title);font-weight:700;line-height:var(--lh-card-title);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.compact-header__back{min-width:var(--tap-min);min-height:var(--tap-min);border-radius:var(--r-control);background:0 0;border:0;justify-content:center;align-items:center;margin-inline-start:calc(var(--sp-3) * -1);display:inline-flex}.bottom-nav{inset-inline:0;z-index:var(--z-nav);background:var(--bg-surface);border-top:var(--bw-standard) solid var(--c-line);padding-bottom:env(safe-area-inset-bottom,0);position:fixed;bottom:0}.bottom-nav__inner{max-width:var(--content-max);grid-template-columns:repeat(5,1fr);margin-inline:auto;display:grid}.bottom-nav__item{min-height:var(--bottom-nav-h);padding:var(--sp-1) 2px;color:var(--text-muted);font-size:var(--fs-meta);text-align:center;overflow-wrap:anywhere;background:0 0;border:0;flex-direction:column;justify-content:center;align-items:center;gap:2px;font-weight:700;line-height:1.2;text-decoration:none;display:flex}.bottom-nav__item[aria-current=page]{color:var(--action)}.bottom-nav__icon{font-size:20px;line-height:1}.character{padding-block:var(--sp-2);justify-content:center;display:flex}.character__media{width:var(--character-size);aspect-ratio:1;object-fit:contain;background:var(--bg-app);border-radius:var(--r-hero);max-width:100%}.screen-head{gap:var(--sp-1);padding-block:var(--sp-3) var(--sp-4);flex-direction:column;display:flex}.section{gap:var(--sp-3);flex-direction:column;margin-block-start:var(--sp-6);display:flex}.section__title{font-size:var(--fs-h2);line-height:var(--lh-h2);font-weight:var(--fw-h2)}.hero-headline{white-space:pre-line}.google-mark{inline-size:var(--sp-5);block-size:var(--sp-5);flex:none}.auth-divider{align-items:center;gap:var(--sp-3);color:var(--text-muted);font-size:var(--fs-meta);line-height:var(--lh-meta);display:flex}.auth-divider:before,.auth-divider:after{content:"";border-block-start:var(--bw-standard) solid var(--c-line);flex:auto}.preset-list{gap:var(--sp-2);flex-direction:column;display:flex}.preset-option{text-align:start;align-items:flex-start}.reveal-overlay{z-index:var(--z-sheet);padding:var(--gutter);background:color-mix(in srgb, var(--c-ink) 45%, transparent);place-items:center;display:grid;position:fixed;inset:0}.reveal-card{align-items:center;gap:var(--sp-3);text-align:center;background:var(--bg-surface);border:var(--bw-quest) solid var(--c-ink);border-radius:var(--r-hero);max-block-size:100%;inline-size:100%;max-inline-size:26rem;padding:var(--pad-hero);animation:reveal-pop var(--dur-reveal) var(--ease) both;flex-direction:column;display:flex;overflow-y:auto}.reveal-img{inline-size:min(var(--character-size), 100%);object-fit:contain;max-block-size:40vh}.reveal-stagger{animation:reveal-rise var(--dur-reveal) var(--ease) both;animation-delay:calc(var(--dur-reveal) / 2)}@keyframes reveal-pop{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}@keyframes reveal-rise{0%{opacity:0;transform:translateY(var(--sp-3))}to{opacity:1;transform:translateY(0)}}.hero-bullets{gap:var(--sp-2);flex-direction:column;display:flex}.hero-bullet{gap:var(--sp-2);font-size:var(--fs-body);line-height:var(--lh-body);align-items:flex-start;display:flex}.hero-bullet__mark{color:var(--action);flex:none;font-weight:800}.lang-switch{gap:var(--sp-2);flex-wrap:wrap;display:flex}.lang-switch__btn{border-radius:var(--r-chip);border:var(--bw-standard) solid var(--c-line-strong);color:var(--text-secondary);min-height:var(--tap-min);font-size:var(--fs-caption);background:0 0;padding:8px 14px;font-weight:700}.lang-switch__btn[aria-pressed=true]{border-color:var(--action);color:var(--action);background:var(--c-quest-red-tint)}.lang-switch--compact .lang-switch__btn{min-height:32px;font-size:var(--fs-meta);padding:4px 10px}.field{gap:var(--sp-2);flex-direction:column;display:flex}.field__label{font-size:var(--fs-caption);font-weight:700}.field__hint{font-size:var(--fs-meta);color:var(--text-muted)}.field__control{width:100%;min-height:var(--btn-h-secondary);padding:0 var(--sp-3);border-radius:var(--r-control);border:var(--bw-standard) solid var(--c-line-strong);background:var(--bg-surface);color:var(--text-primary);font-size:var(--fs-body);font-family:inherit}textarea.field__control{min-height:160px;padding-block:var(--sp-3);line-height:var(--lh-body);resize:vertical}.option-grid{gap:var(--sp-2);grid-template-columns:repeat(auto-fit,minmax(min(100%,8rem),1fr));display:grid}.timeline{gap:var(--sp-3);flex-direction:column;display:flex;position:relative}.timeline__chapter{align-items:center;gap:var(--sp-2);font-size:var(--fs-meta);letter-spacing:.08em;color:var(--text-muted);margin-block-start:var(--sp-5);font-weight:700;display:flex}.timeline__chapter:after{content:"";background:var(--c-line);flex:auto;height:1px}.timeline__row{gap:var(--sp-3);grid-template-columns:28px 1fr;align-items:stretch;display:grid}.timeline__rail{justify-content:center;display:flex;position:relative}.timeline__rail:before{content:"";background:var(--c-line);width:2px;position:absolute;top:0;bottom:-12px}.timeline__row:last-child .timeline__rail:before{bottom:50%}.timeline__dot{z-index:1;border:2px solid var(--c-line-strong);background:var(--bg-app);border-radius:50%;width:16px;height:16px;margin-top:20px;position:relative}.timeline__dot[data-status=done]{border-color:var(--done);background:var(--done)}.timeline__dot[data-status=in_progress]{border-color:var(--action);background:var(--bg-app)}.timeline__dot[data-status=available]{border-color:var(--action);background:var(--action)}.timeline__dot[data-status=locked]{border-color:var(--locked);background:var(--bg-app)}.card-link{color:inherit;text-decoration:none;display:block}.card-link[aria-disabled=true]{cursor:not-allowed;opacity:.7}.stat-grid{gap:var(--sp-3);grid-template-columns:repeat(2,1fr);display:grid}.stat{gap:var(--sp-2);padding:var(--pad-compact);border-radius:var(--r-card);border:var(--bw-standard) solid var(--c-line);background:var(--bg-surface);flex-direction:column;display:flex}.stat__value{font-size:var(--fs-h2);font-weight:800;line-height:1.1}.check-item{gap:var(--sp-3);width:100%;padding:var(--sp-3);border-radius:var(--r-control);border:var(--bw-standard) solid var(--c-line);background:var(--bg-surface);text-align:start;min-height:var(--tap-min);align-items:flex-start;display:flex}.check-item[aria-pressed=true]{border-color:var(--done);background:var(--c-success-tint)}.check-item__mark{border:2px solid var(--c-line-strong);color:#0000;border-radius:6px;flex:none;place-items:center;width:22px;height:22px;margin-top:2px;font-size:13px;font-weight:800;display:grid}.check-item[aria-pressed=true] .check-item__mark{border-color:var(--done);background:var(--done);color:var(--text-on-accent)}.check-item[data-quiz-state=correct]{border-color:var(--done);background:var(--c-success-tint)}.check-item[data-quiz-state=correct] .check-item__mark{border-color:var(--done);background:var(--done);color:var(--text-on-accent)}.check-item[data-quiz-state=wrong]{border-color:var(--risk);background:var(--c-danger-tint)}.check-item[data-quiz-state=wrong] .check-item__mark{border-color:var(--risk);background:var(--risk);color:var(--text-on-accent)}.check-item:disabled{cursor:default;opacity:1}.notice{gap:var(--sp-2);padding:var(--pad-compact);border-radius:var(--r-control);border:var(--bw-standard) solid var(--c-line);background:color-mix(in srgb, var(--c-ink) 4%, transparent);font-size:var(--fs-meta);line-height:var(--lh-caption);color:var(--text-secondary);display:flex}.bullet-list{gap:var(--sp-2);flex-direction:column;display:flex}.bullet-list__item{gap:var(--sp-2);font-size:var(--fs-body);line-height:var(--lh-body);align-items:flex-start;display:flex}.bullet-list__mark{color:var(--info);flex:none;font-weight:800}.bullet-list--risk .bullet-list__mark{color:var(--risk)}.bullet-list--action .bullet-list__mark{color:var(--action)}.source-link{padding:var(--sp-2) 0;font-size:var(--fs-meta);color:var(--text-secondary);border-bottom:var(--bw-standard) solid var(--c-line);flex-direction:column;gap:2px;text-decoration:none;display:flex}.source-link:last-child{border-bottom:0}.masked-preview{font-size:var(--fs-caption);line-height:var(--lh-body);color:var(--text-secondary);word-break:break-word;white-space:pre-wrap}.center-state{align-items:center;gap:var(--sp-3);padding-block:var(--sp-8);text-align:center;flex-direction:column;display:flex}