:root{color-scheme:light;--bg: #fbf6ec;--surface: #ffffff;--surface-2: #f4eddf;--surface-3: #ece2cf;--ink: #1e2a24;--ink-2: #4b5850;--ink-3: #6b766f;--line: #e4d9c3;--line-strong: #d3c4a6;--primary: #137a4d;--primary-deep: #0c5636;--primary-soft: #dff1e6;--on-primary: #ffffff;--danger: #c8264b;--danger-deep: #8f1733;--danger-soft: #fde3e8;--on-danger: #ffffff;--xp: #f2a60c;--xp-deep: #b97c00;--xp-soft: #fff0cc;--xp-ink: #7a4f00;--on-xp: #2a1c00;--pending: #1c6e8c;--pending-deep: #114e65;--pending-soft: #dcf0f7;--on-pending: #ffffff;--review: #6a4c93;--review-deep: #4a3268;--review-soft: #ece4f6;--on-review: #ffffff;--bloom: #e0284f;--bloom-heart: #ffc23d;--shadow-1: 0 1px 2px rgb(60 40 10 / .06), 0 2px 8px rgb(60 40 10 / .05);--shadow-2: 0 6px 24px rgb(60 40 10 / .12), 0 2px 6px rgb(60 40 10 / .06);--shadow-sheet: 0 -8px 32px rgb(30 42 36 / .16);--scrim: rgb(30 42 36 / .42);--batik-dot: rgb(19 122 77 / .07);--font: ui-rounded, "SF Pro Rounded", "Nunito", "Varela Round", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-mono: ui-monospace, "SF Mono", "Cascadia Code", "Fira Code", Menlo, Consolas, monospace;--text-xs: .75rem;--text-sm: .875rem;--text-md: 1rem;--text-lg: 1.125rem;--text-xl: 1.375rem;--text-2xl: 1.75rem;--text-3xl: 2.25rem;--text-4xl: 3rem;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-7: 32px;--space-8: 48px;--space-9: 64px;--radius-sm: 8px;--radius-md: 14px;--radius-lg: 20px;--radius-xl: 28px;--radius-pill: 999px;--press: 4px;--dur-fast: .12s;--dur: .2s;--dur-slow: .36s;--ease: cubic-bezier(.2, 0, 0, 1);--ease-pop: cubic-bezier(.34, 1.56, .64, 1);--content-max: 720px;--rail-w: 232px;--tabbar-h: 64px;--focus: 0 0 0 2px var(--bg), 0 0 0 5px var(--primary)}@media (prefers-color-scheme: dark){:root:not([data-theme=light]){color-scheme:dark;--bg: #0f1814;--surface: #17231d;--surface-2: #1f2e27;--surface-3: #283a31;--ink: #eef3ec;--ink-2: #b3c0b7;--ink-3: #93a299;--line: #2b3b33;--line-strong: #3a4e44;--primary: #3cc488;--primary-deep: #1f8a5b;--primary-soft: #173a2a;--on-primary: #08140e;--danger: #ff7a92;--danger-deep: #c43f5a;--danger-soft: #3d1a23;--on-danger: #2a0710;--xp: #ffc23d;--xp-deep: #c98d07;--xp-soft: #3a2e12;--xp-ink: #ffd36e;--on-xp: #2a1c00;--pending: #6cc3e0;--pending-deep: #3a8eaa;--pending-soft: #15313b;--on-pending: #06222c;--review: #b79ce0;--review-deep: #7f63a8;--review-soft: #2a2238;--on-review: #1b1029;--bloom: #ff5f80;--shadow-1: 0 1px 2px rgb(0 0 0 / .3);--shadow-2: 0 8px 28px rgb(0 0 0 / .45);--shadow-sheet: 0 -8px 32px rgb(0 0 0 / .5);--scrim: rgb(0 0 0 / .6);--batik-dot: rgb(60 196 136 / .07)}}:root[data-theme=dark]{color-scheme:dark;--bg: #0f1814;--surface: #17231d;--surface-2: #1f2e27;--surface-3: #283a31;--ink: #eef3ec;--ink-2: #b3c0b7;--ink-3: #93a299;--line: #2b3b33;--line-strong: #3a4e44;--primary: #3cc488;--primary-deep: #1f8a5b;--primary-soft: #173a2a;--on-primary: #08140e;--danger: #ff7a92;--danger-deep: #c43f5a;--danger-soft: #3d1a23;--on-danger: #2a0710;--xp: #ffc23d;--xp-deep: #c98d07;--xp-soft: #3a2e12;--xp-ink: #ffd36e;--on-xp: #2a1c00;--pending: #6cc3e0;--pending-deep: #3a8eaa;--pending-soft: #15313b;--on-pending: #06222c;--review: #b79ce0;--review-deep: #7f63a8;--review-soft: #2a2238;--on-review: #1b1029;--bloom: #ff5f80;--shadow-1: 0 1px 2px rgb(0 0 0 / .3);--shadow-2: 0 8px 28px rgb(0 0 0 / .45);--shadow-sheet: 0 -8px 32px rgb(0 0 0 / .5);--scrim: rgb(0 0 0 / .6);--batik-dot: rgb(60 196 136 / .07)}@media (prefers-reduced-motion: reduce){:root{--dur-fast: 1ms;--dur: 1ms;--dur-slow: 1ms}}*,*:before,*:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;text-size-adjust:100%}body{margin:0;min-height:100dvh;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:var(--text-md);line-height:1.5;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}#root{min-height:100dvh}h1,h2,h3,h4,p{margin:0}h1,h2,h3{line-height:1.2;letter-spacing:-.01em;font-weight:800}a{color:var(--primary);font-weight:700;text-underline-offset:3px}button,input,textarea,select{font:inherit;color:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}img,svg{display:block}code,kbd{font-family:var(--font-mono);font-size:.9em}code{background:var(--surface-2);border-radius:6px;padding:.1em .35em}kbd{display:inline-block;min-width:1.6em;padding:0 .4em;border:1px solid var(--line-strong);border-bottom-width:2px;border-radius:6px;background:var(--surface);color:var(--ink-2);font-size:var(--text-xs);line-height:1.6;text-align:center}:focus{outline:none}:focus-visible{outline:3px solid var(--primary);outline-offset:2px;border-radius:inherit}::selection{background:var(--xp-soft);color:var(--ink)}.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:absolute;left:var(--space-4);top:-100px;z-index:100;padding:var(--space-2) var(--space-4);border-radius:var(--radius-pill);background:var(--primary);color:var(--on-primary)}.skip-link:focus-visible{top:var(--space-3)}.muted{color:var(--ink-2)}.small{font-size:var(--text-sm)}.ms{font-weight:700}.batik{background-image:radial-gradient(var(--batik-dot) 2.5px,transparent 3px),radial-gradient(var(--batik-dot) 2.5px,transparent 3px);background-size:28px 28px;background-position:0 0,14px 14px}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-iteration-count:1!important;scroll-behavior:auto!important}}.btn{--btn-bg: var(--surface);--btn-fg: var(--ink);--btn-base: var(--line-strong);--btn-border: var(--line-strong);position:relative;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:48px;padding:0 var(--space-5);border:2px solid var(--btn-border);border-radius:var(--radius-md);background:var(--btn-bg);color:var(--btn-fg);font-weight:800;font-size:var(--text-md);letter-spacing:.01em;text-decoration:none;box-shadow:0 var(--press) 0 var(--btn-base);transform:translateY(0);transition:transform var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease),background-color var(--dur) var(--ease),opacity var(--dur) var(--ease);-webkit-user-select:none;user-select:none;white-space:nowrap}.btn:hover:not(:disabled){filter:brightness(1.04)}.btn:active:not(:disabled),.btn[data-pressed=true]{transform:translateY(var(--press));box-shadow:0 0 0 var(--btn-base)}.btn:disabled{--btn-bg: var(--surface-2);--btn-fg: var(--ink-3);--btn-base: var(--line);--btn-border: var(--line)}.btn:focus-visible{outline:3px solid var(--primary);outline-offset:3px}.btn-primary{--btn-bg: var(--primary);--btn-fg: var(--on-primary);--btn-base: var(--primary-deep);--btn-border: var(--primary)}.btn-danger{--btn-bg: var(--danger);--btn-fg: var(--on-danger);--btn-base: var(--danger-deep);--btn-border: var(--danger)}.btn-pending{--btn-bg: var(--pending);--btn-fg: var(--on-pending);--btn-base: var(--pending-deep);--btn-border: var(--pending)}.btn-review{--btn-bg: var(--review);--btn-fg: var(--on-review);--btn-base: var(--review-deep);--btn-border: var(--review)}.btn-xp{--btn-bg: var(--xp);--btn-fg: var(--on-xp);--btn-base: var(--xp-deep);--btn-border: var(--xp)}.btn-ghost{--btn-bg: transparent;--btn-border: transparent;--btn-base: transparent;--btn-fg: var(--primary);box-shadow:none}.btn-ghost:hover:not(:disabled){--btn-bg: var(--primary-soft)}.btn-ghost:active:not(:disabled){transform:none}.btn-quiet{--btn-fg: var(--ink-2)}.btn-lg{min-height:56px;font-size:var(--text-lg);border-radius:var(--radius-lg)}.btn-sm{min-height:36px;padding:0 var(--space-3);font-size:var(--text-sm);border-radius:var(--radius-sm);--press: 3px}.btn-block{width:100%}.btn-icon{width:44px;min-height:44px;padding:0;border-radius:var(--radius-pill)}.link-btn{display:inline-flex;align-items:center;gap:var(--space-1);justify-self:start;padding:var(--space-1) 0;border:0;background:none;color:var(--primary);font-weight:700;text-decoration:underline;text-underline-offset:3px}.card{background:var(--surface);border:2px solid var(--line);border-radius:var(--radius-lg);padding:var(--space-5)}.card-raised{border-color:transparent;box-shadow:var(--shadow-1)}.chip{display:inline-flex;align-items:center;gap:var(--space-1);min-height:36px;padding:0 var(--space-3);border:2px solid var(--line);border-radius:var(--radius-pill);background:var(--surface);color:var(--ink-2);font-weight:700;font-size:var(--text-sm);white-space:nowrap;transition:background-color var(--dur) var(--ease),border-color var(--dur) var(--ease),color var(--dur) var(--ease)}button.chip:hover{border-color:var(--line-strong)}.chip[aria-pressed=true],.chip[aria-checked=true]{background:var(--primary);border-color:var(--primary);color:var(--on-primary)}.chip .count{opacity:.75;font-weight:600}.badge{display:inline-flex;align-items:center;gap:4px;padding:2px var(--space-2);border-radius:var(--radius-pill);font-size:var(--text-xs);font-weight:800;letter-spacing:.02em;background:var(--surface-2);color:var(--ink-2)}.badge-primary{background:var(--primary-soft);color:var(--primary)}.badge-danger{background:var(--danger-soft);color:var(--danger)}.badge-pending{background:var(--pending-soft);color:var(--pending)}.badge-review{background:var(--review-soft);color:var(--review)}.badge-xp{background:var(--xp-soft);color:var(--xp-ink)}.count-bubble{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:var(--radius-pill);background:var(--danger);color:var(--on-danger);font-size:11px;font-weight:800;line-height:1}.field{display:grid;gap:var(--space-2)}.field>label,.field-label{font-weight:800;font-size:var(--text-sm);color:var(--ink)}.field-hint{font-size:var(--text-sm);color:var(--ink-2)}.input,.textarea,.select{width:100%;min-height:48px;padding:var(--space-3) var(--space-4);border:2px solid var(--line);border-radius:var(--radius-md);background:var(--surface-2);color:var(--ink);transition:border-color var(--dur) var(--ease),background-color var(--dur) var(--ease)}.textarea{min-height:112px;resize:vertical;line-height:1.45}.input::placeholder,.textarea::placeholder{color:var(--ink-3)}.input:hover,.textarea:hover{border-color:var(--line-strong)}.input:focus-visible,.textarea:focus-visible,.select:focus-visible{outline:none;border-color:var(--primary);background:var(--surface);box-shadow:0 0 0 3px var(--primary-soft)}.input-mono{font-family:var(--font-mono);font-size:var(--text-sm)}.search{position:relative}.search .input{padding-left:44px;border-radius:var(--radius-pill)}.search>svg{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:var(--ink-3);pointer-events:none}.switch{-webkit-appearance:none;-moz-appearance:none;appearance:none;position:relative;flex:none;width:52px;height:32px;margin:0;border-radius:var(--radius-pill);background:var(--line-strong);transition:background-color var(--dur) var(--ease);cursor:pointer}.switch:after{content:"";position:absolute;top:4px;left:4px;width:24px;height:24px;border-radius:50%;background:var(--surface);box-shadow:0 1px 3px #00000040;transition:transform var(--dur) var(--ease-pop)}.switch:checked{background:var(--primary)}.switch:checked:after{transform:translate(20px)}.switch:focus-visible{outline:3px solid var(--primary);outline-offset:3px}.segmented{display:grid;grid-auto-columns:1fr;grid-auto-flow:column;gap:var(--space-1);padding:var(--space-1);border-radius:var(--radius-md);background:var(--surface-2);border:2px solid var(--line)}.segmented label{position:relative;display:grid;place-items:center;gap:0;min-height:48px;padding:var(--space-1) var(--space-2);border-radius:10px;color:var(--ink-2);font-weight:800;text-align:center;line-height:1.15;cursor:pointer;transition:background-color var(--dur) var(--ease),color var(--dur) var(--ease)}.segmented label small{font-weight:600;font-size:var(--text-xs);opacity:.85}.segmented input{position:absolute;opacity:0;pointer-events:none}.segmented label:has(input:checked){background:var(--surface);color:var(--primary);box-shadow:var(--shadow-1)}.segmented label:has(input:focus-visible){outline:3px solid var(--primary);outline-offset:1px}.dialog{width:min(560px,calc(100vw - 32px));max-height:min(90dvh,820px);padding:0;border:0;border-radius:var(--radius-xl);background:var(--surface);color:var(--ink);box-shadow:var(--shadow-2)}.dialog::backdrop{background:var(--scrim);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.dialog[open]{animation:dialog-in var(--dur-slow) var(--ease-pop)}.dialog-inner{display:grid;gap:var(--space-5);padding:var(--space-6)}.dialog-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-3)}.dialog-head h2{font-size:var(--text-xl)}.dialog-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:var(--space-3)}@keyframes dialog-in{0%{opacity:0;transform:translateY(16px) scale(.97)}}@media (max-width: 599px){.dialog{width:100vw;max-width:100vw;margin:auto 0 0;border-radius:var(--radius-xl) var(--radius-xl) 0 0;max-height:92dvh}.dialog[open]{animation:sheet-in var(--dur-slow) var(--ease)}.dialog-inner{padding-bottom:calc(var(--space-6) + env(safe-area-inset-bottom))}}@keyframes sheet-in{0%{transform:translateY(100%)}}.toasts{position:fixed;left:50%;bottom:calc(var(--tabbar-h) + var(--space-4) + env(safe-area-inset-bottom));z-index:60;display:grid;gap:var(--space-2);width:min(440px,calc(100vw - 32px));transform:translate(-50%);pointer-events:none}@media (min-width: 900px){.toasts{bottom:var(--space-6);left:calc(50% + var(--rail-w) / 2)}}.toast{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);background:var(--ink);color:var(--bg);font-weight:700;box-shadow:var(--shadow-2);animation:toast-in var(--dur-slow) var(--ease-pop);pointer-events:auto}.toast-success svg{color:var(--primary)}.toast-error svg{color:var(--danger)}.toast-info svg{color:var(--pending)}@keyframes toast-in{0%{opacity:0;transform:translateY(12px) scale(.96)}}.skeleton{border-radius:var(--radius-md);background:linear-gradient(90deg,var(--surface-2) 0%,var(--surface-3) 50%,var(--surface-2) 100%);background-size:200% 100%;animation:shimmer 1.4s linear infinite}@keyframes shimmer{to{background-position:-200% 0}}.spinner{width:20px;height:20px;border:3px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion: reduce){.skeleton{animation:none}.spinner{animation-duration:2.4s;animation-iteration-count:infinite!important}}.empty{display:grid;justify-items:center;gap:var(--space-3);padding:var(--space-8) var(--space-5);text-align:center;color:var(--ink-2)}.empty h2,.empty h3{color:var(--ink);font-size:var(--text-xl)}.empty .actions{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-3);margin-top:var(--space-2)}.notice{display:flex;gap:var(--space-3);align-items:flex-start;padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);background:var(--pending-soft);color:var(--ink)}.notice>svg{flex:none;margin-top:2px;color:var(--pending)}.notice-danger{background:var(--danger-soft)}.notice-danger>svg{color:var(--danger)}.notice-warn{background:var(--xp-soft)}.notice-warn>svg{color:var(--xp-ink)}.notice-ok{background:var(--primary-soft)}.notice-ok>svg{color:var(--primary)}.blooms{display:inline-flex;gap:2px}.bloom-off{opacity:.28;filter:grayscale(1)}.copy-row{display:flex;align-items:stretch;gap:var(--space-2)}.copy-row code,.code-block{flex:1;min-width:0;display:block;padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);background:var(--surface-2);border:1px solid var(--line);font-size:var(--text-sm);overflow-x:auto;white-space:pre}.code-block{white-space:pre-wrap;word-break:break-all}.pips{display:inline-flex;gap:3px}.pips i{width:8px;height:8px;border-radius:50%;background:var(--line-strong)}.pips i.on{background:var(--primary)}.shell{min-height:100dvh}.main{width:100%;max-width:calc(var(--content-max) + 2 * var(--space-4));margin:0 auto;padding:var(--space-4) var(--space-4) calc(var(--tabbar-h) + var(--space-8) + env(safe-area-inset-bottom))}.nav{position:fixed;z-index:40;inset:auto 0 0 0;display:flex;height:calc(var(--tabbar-h) + env(safe-area-inset-bottom));padding:0 var(--space-1) env(safe-area-inset-bottom);background:color-mix(in srgb,var(--surface) 92%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-top:2px solid var(--line)}.nav-brand{display:none}.nav-list{display:flex;flex:1;margin:0;padding:0;list-style:none}.nav-list li{flex:1;display:flex}.nav-link{position:relative;flex:1;display:grid;place-items:center;align-content:center;gap:2px;min-height:48px;margin:var(--space-1) 2px;border-radius:var(--radius-md);color:var(--ink-2);font-size:11px;font-weight:800;letter-spacing:.02em;text-decoration:none;transition:color var(--dur) var(--ease),background-color var(--dur) var(--ease)}.nav-link svg{transition:transform var(--dur) var(--ease-pop)}.nav-link:hover{color:var(--ink)}.nav-link[aria-current=page]{color:var(--primary)}.nav-link[aria-current=page] svg{transform:translateY(-1px) scale(1.08)}.nav-link .count-bubble{position:absolute;top:2px;left:calc(50% + 6px)}.nav-link.is-review[aria-current=page]{color:var(--review)}@media (min-width: 900px){.shell{display:grid;grid-template-columns:var(--rail-w) 1fr}.main{padding:var(--space-7) var(--space-6) var(--space-9)}.nav{position:sticky;inset:0 auto auto 0;flex-direction:column;gap:var(--space-6);width:var(--rail-w);height:100dvh;padding:var(--space-6) var(--space-4);border-top:0;border-right:2px solid var(--line);background:var(--surface);-webkit-backdrop-filter:none;backdrop-filter:none}.nav-brand{display:flex;align-items:center;gap:var(--space-3);padding:0 var(--space-2);color:var(--ink);font-size:var(--text-2xl);font-weight:900;letter-spacing:-.03em;text-decoration:none}.nav-brand small{display:block;color:var(--ink-2);font-size:var(--text-xs);font-weight:700;letter-spacing:0}.nav-list{flex-direction:column;flex:none;gap:var(--space-1)}.nav-link{display:flex;justify-content:flex-start;gap:var(--space-3);min-height:52px;margin:0;padding:0 var(--space-4);border:2px solid transparent;font-size:var(--text-md)}.nav-link:hover{background:var(--surface-2)}.nav-link[aria-current=page]{background:var(--primary-soft);border-color:color-mix(in srgb,var(--primary) 35%,transparent)}.nav-link.is-review[aria-current=page]{background:var(--review-soft);border-color:color-mix(in srgb,var(--review) 35%,transparent)}.nav-link .count-bubble{position:static;margin-left:auto}.nav-foot{margin-top:auto;padding:0 var(--space-2);color:var(--ink-3);font-size:var(--text-xs)}}@media (max-width: 899px){.nav-foot{display:none}}.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--space-3);margin-bottom:var(--space-5)}.page-head h1{font-size:var(--text-2xl)}.page-head p{color:var(--ink-2)}.stack{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-4)}.stack-lg{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-6)}.row{display:flex;align-items:center;gap:var(--space-3)}.row-wrap{flex-wrap:wrap}.spacer{flex:1}.section-title{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-3);margin:var(--space-2) 0 var(--space-3);font-size:var(--text-lg);font-weight:800}.fullscreen{overflow-x:clip;overflow-wrap:anywhere;min-height:100dvh;display:flex;flex-direction:column;background:var(--bg)}.eyebrow{font-size:var(--text-xs);font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2)}.back-link{display:inline-flex;align-items:center;gap:2px;margin-bottom:var(--space-2);color:var(--ink-2);font-size:var(--text-sm);text-decoration:none}.md p+p{margin-top:var(--space-2)}.md strong{font-weight:800}.splash{display:grid;place-items:center;min-height:100dvh;padding:var(--space-4)}.splash-moo,.bob{animation:bob 1.6s var(--ease) infinite alternate}@keyframes bob{to{transform:translateY(-8px) rotate(-3deg)}}.mascot .mascot-ear-l,.mascot .mascot-ear-r{transform-box:fill-box;transform-origin:80% 50%}.mascot .mascot-ear-r{transform-origin:20% 50%}.mascot:hover .mascot-ear-l{animation:ear-l .6s var(--ease) 1}.mascot:hover .mascot-ear-r{animation:ear-r .6s var(--ease) 1}@keyframes ear-l{50%{transform:rotate(-14deg)}}@keyframes ear-r{50%{transform:rotate(14deg)}}@media (prefers-reduced-motion: reduce){.splash-moo,.bob{animation:none}}.signin{display:grid;place-items:center;min-height:100dvh;padding:var(--space-6) var(--space-4)}.signin-card{display:grid;justify-items:center;gap:var(--space-3);width:min(400px,100%);padding:var(--space-8) var(--space-6) var(--space-6);border-radius:var(--radius-xl);background:var(--surface);box-shadow:var(--shadow-2);text-align:center}.signin-moo{margin-top:-110px;filter:drop-shadow(0 10px 18px rgb(19 122 77 / .25));animation:signin-pop var(--dur-slow) var(--ease-pop) both}@keyframes signin-pop{0%{transform:translateY(20px) scale(.85);opacity:0}}.signin-title{font-size:var(--text-4xl);font-weight:900;letter-spacing:-.04em;color:var(--primary)}.signin-tag{font-size:var(--text-xl);font-weight:800}.signin-gloss{margin-bottom:var(--space-4);color:var(--ink-2)}.signin-foot{color:var(--ink-3);font-size:var(--text-sm)}.hero{display:grid;grid-template-columns:1fr auto;grid-template-areas:"greet ring" "streak ring";align-items:center;gap:var(--space-3) var(--space-4);padding:var(--space-6) var(--space-5);border-radius:var(--radius-xl);background-color:var(--surface);border:2px solid var(--line)}.hero-greet{grid-area:greet}.hero .streak{grid-area:streak;justify-self:start;margin-top:0}.hero-ring{grid-area:ring}.hero h1{font-size:var(--text-2xl)}.greet{padding:0;border:0;background:none;font-weight:900;color:var(--primary);text-decoration:underline dotted color-mix(in srgb,var(--primary) 45%,transparent);text-underline-offset:6px;text-decoration-thickness:2px}.greet-en{height:0;overflow:hidden;color:var(--ink-2);font-size:var(--text-sm);opacity:0;transition:opacity var(--dur) var(--ease),height var(--dur) var(--ease)}.greet-en.show,.hero h1:hover+.greet-en{height:1.5em;opacity:1}.streak{display:inline-flex;align-items:center;gap:var(--space-3);margin-top:var(--space-4);padding:var(--space-2) var(--space-4) var(--space-2) var(--space-3);border-radius:var(--radius-lg);background:var(--surface-2)}.streak div{display:grid;line-height:1.25}.streak strong{font-size:var(--text-lg);font-weight:900}.streak span{font-size:var(--text-sm);color:var(--ink-2)}.streak small{font-size:var(--text-xs);color:var(--ink-3)}.streak.lit{background:var(--xp-soft)}.streak.lit strong{color:var(--xp-ink)}.streak .flame.lit{animation:flicker 2.4s ease-in-out infinite;transform-origin:50% 90%}@keyframes flicker{0%,to{transform:scale(1) rotate(0)}30%{transform:scale(1.06,.96) rotate(-3deg)}60%{transform:scale(.97,1.05) rotate(2deg)}}.hero-ring{display:grid;justify-items:center;gap:var(--space-2)}.ring{position:relative}.ring-arc{transition:stroke-dashoffset 1s var(--ease)}.ring-label{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-content:center;justify-items:center;line-height:1.1}.ring-label strong{font-size:var(--text-3xl);font-weight:900;color:var(--xp-ink)}.ring-label span{font-size:var(--text-xs);font-weight:800;color:var(--ink-2)}.ring-full .ring-bloom{animation:bloom-in .7s var(--ease-pop) both}@keyframes bloom-in{0%{transform:scale(.2) rotate(-90deg);opacity:0}}.ring-caption{display:grid;text-align:center;font-weight:800;font-size:var(--text-sm)}.ring-caption small{font-weight:600;color:var(--ink-2)}@media (max-width: 520px){.hero{grid-template-areas:"greet greet" "streak ring";padding:var(--space-5) var(--space-4)}.hero .streak{align-self:stretch;padding:var(--space-3)}.hero .ring,.hero .ring svg{width:96px!important;height:96px!important}.hero .ring-label strong{font-size:var(--text-2xl)}.ring-caption{display:none}}.continue{position:relative;display:grid;gap:var(--space-5);padding:var(--space-6);border-radius:var(--radius-xl);background:var(--primary);color:var(--on-primary);box-shadow:0 6px 0 var(--primary-deep);overflow:hidden}.continue:after{content:"";position:absolute;right:-40px;top:-40px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgb(255 255 255 / .16),transparent 70%);pointer-events:none}.continue .eyebrow{color:inherit;opacity:.85}.continue h2{margin:var(--space-1) 0 var(--space-2);font-size:var(--text-2xl)}.continue-goal{opacity:.92}.continue-meta{display:inline-flex;align-items:center;gap:var(--space-1);margin-top:var(--space-3);padding:2px var(--space-3);border-radius:var(--radius-pill);background:#ffffff29;font-size:var(--text-sm);font-weight:700}.continue-cta.btn-primary{--btn-bg: var(--surface);--btn-fg: var(--primary);--btn-base: rgb(0 0 0 / .22);--btn-border: var(--surface)}.continue-cta:not(.btn-primary){--btn-base: rgb(0 0 0 / .22)}@media (min-width: 600px){.continue{grid-template-columns:1fr auto;align-items:center}}.continue-done{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:var(--space-4);background:var(--surface);color:var(--ink);box-shadow:none}.continue-done .btn{grid-column:1 / -1}.tiles{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:var(--space-3)}@media (max-width: 520px){.tiles{gap:var(--space-2)}.tiles .tile{padding:var(--space-3)}.tiles .tile-num{font-size:var(--text-2xl)}.tiles .tile-label,.tiles .tile-cta{font-size:var(--text-xs)}}.tile{--tile: var(--primary);--tile-soft: var(--primary-soft);display:grid;gap:2px;padding:var(--space-4);border:2px solid var(--line);border-radius:var(--radius-lg);background:var(--surface);color:var(--ink);text-decoration:none;box-shadow:0 4px 0 var(--line);transition:transform var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease),border-color var(--dur) var(--ease)}.tile:hover{border-color:var(--tile)}.tile:active{transform:translateY(4px);box-shadow:0 0 0 var(--line)}.tile-notes{--tile: var(--pending);--tile-soft: var(--pending-soft)}.tile-review{--tile: var(--review);--tile-soft: var(--review-soft)}.tile-icon{display:grid;place-items:center;width:40px;height:40px;margin-bottom:var(--space-2);border-radius:var(--radius-md);background:var(--tile-soft);color:var(--tile)}.tile-num{font-size:var(--text-3xl);font-weight:900;line-height:1}.tile-label{color:var(--ink-2);font-size:var(--text-sm);font-weight:700}.tile-cta{margin-top:var(--space-2);color:var(--tile);font-size:var(--text-sm);font-weight:800}.notes-empty{display:flex;align-items:center;gap:var(--space-4);color:var(--ink-2)}.note-list{display:grid;gap:var(--space-3);margin:0;padding:0;list-style:none}.note{display:grid;gap:var(--space-2);padding:var(--space-4) var(--space-5);border-radius:var(--radius-lg);background:var(--surface);border:2px solid var(--line);border-left-width:6px}.note-pending{border-left-color:var(--pending)}.note-correct{border-left-color:var(--primary)}.note-incorrect{border-left-color:var(--danger)}.note-head{display:flex;gap:var(--space-2)}.note-prompt{font-weight:800;font-size:var(--text-lg)}.note-answer{padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);background:var(--surface-2)}.note-incorrect .note-answer{text-decoration:line-through;text-decoration-color:color-mix(in srgb,var(--danger) 60%,transparent)}p.note-fix{font-weight:700;display:flex;align-items:center;gap:var(--space-2);color:var(--primary)}.note-feedback,.note-wait{color:var(--ink-2);font-size:var(--text-sm)}.unit{--hue: var(--primary);--hue-deep: var(--primary-deep);--hue-soft: var(--primary-soft);--on-hue: var(--on-primary);margin-bottom:var(--space-8)}.unit-laut{--hue: var(--pending);--hue-deep: var(--pending-deep);--hue-soft: var(--pending-soft);--on-hue: var(--on-pending)}.unit-ube{--hue: var(--review);--hue-deep: var(--review-deep);--hue-soft: var(--review-soft);--on-hue: var(--on-review)}.unit-kunyit{--hue: var(--xp);--hue-deep: var(--xp-deep);--hue-soft: var(--xp-soft);--on-hue: var(--on-xp)}.unit-band{position:sticky;top:var(--space-2);z-index:5;display:grid;gap:var(--space-1);padding:var(--space-5);border-radius:var(--radius-xl);background-color:var(--hue);color:var(--on-hue);box-shadow:0 5px 0 var(--hue-deep);--batik-dot: rgb(255 255 255 / .12)}.unit-band .eyebrow{color:inherit;opacity:.85}.unit-band h2{font-size:var(--text-xl)}.unit-band p:not(.eyebrow){opacity:.92;font-size:var(--text-sm)}.unit-progress{height:8px;margin-top:var(--space-2);border-radius:var(--radius-pill);background:#0000002e;overflow:hidden}.unit-progress span{display:block;height:100%;border-radius:inherit;background:currentColor;opacity:.9}.path{display:grid;justify-items:center;gap:var(--space-6);margin:var(--space-9) 0 0;padding:0;list-style:none}.node{--size: 76px;position:relative;display:grid;justify-items:center;gap:var(--space-1);width:180px;transform:translate(calc(var(--x) * var(--size)))}.node-btn{display:grid;place-items:center;width:var(--size);height:calc(var(--size) - 6px);border:0;border-radius:50%;background:var(--surface-3);color:var(--ink-3);box-shadow:0 6px 0 var(--line-strong);transition:transform var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease)}.node-btn:active{transform:translateY(6px);box-shadow:0 0 0 var(--line-strong)}.node-btn:focus-visible{outline-offset:6px;border-radius:50%}.node-title{max-width:180px;margin-top:var(--space-2);font-weight:800;font-size:var(--text-sm);text-align:center;line-height:1.25}.node-locked .node-title{color:var(--ink-3)}.node-available .node-btn,.node-completed .node-btn{background:var(--hue);color:var(--on-hue);box-shadow:0 6px 0 var(--hue-deep)}.node-available .node-btn{position:relative}.node-available .node-btn:before{content:"";position:absolute;top:-10px;right:-10px;bottom:-10px;left:-10px;border-radius:50%;border:4px solid var(--hue);opacity:.35;animation:halo 2s var(--ease) infinite}@keyframes halo{0%{transform:scale(.9);opacity:.5}to{transform:scale(1.25);opacity:0}}.node-bubble{position:absolute;top:-38px;padding:var(--space-1) var(--space-3);border-radius:var(--radius-md);background:var(--surface);border:2px solid var(--line);color:var(--hue);font-weight:900;font-size:var(--text-sm);letter-spacing:.04em;text-transform:uppercase;animation:bubble-bob 1.4s var(--ease) infinite alternate}.node-bubble:after{content:"";position:absolute;left:50%;bottom:-8px;width:12px;height:12px;background:var(--surface);border-right:2px solid var(--line);border-bottom:2px solid var(--line);transform:translate(-50%) rotate(45deg)}@keyframes bubble-bob{to{transform:translateY(-4px)}}.node-building .node-btn{position:relative;overflow:hidden;background:var(--surface);color:var(--hue);box-shadow:0 6px 0 var(--line);outline:3px dashed color-mix(in srgb,var(--hue) 60%,transparent);outline-offset:-3px}.node-building .node-btn:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(110deg,transparent 30%,color-mix(in srgb,var(--hue) 22%,transparent) 50%,transparent 70%);background-size:250% 100%;animation:node-shimmer 1.8s linear infinite}@keyframes node-shimmer{0%{background-position:150% 0}to{background-position:-100% 0}}.node.is-open{z-index:20}.node-pop{position:absolute;top:calc(100% + 14px);z-index:10;width:min(300px,calc(100vw - 48px));display:grid;gap:var(--space-2);padding:var(--space-5);border-radius:var(--radius-lg);background:var(--hue);color:var(--on-hue);box-shadow:var(--shadow-2);text-align:left;animation:pop-in var(--dur) var(--ease-pop)}.node-pop:before{content:"";position:absolute;top:-8px;left:50%;width:16px;height:16px;background:var(--hue);transform:translate(-50%) rotate(45deg)}.node-pop h3{font-size:var(--text-lg)}.node-pop p{font-size:var(--text-sm);opacity:.95}.node-pop-meta{display:flex;align-items:center;gap:var(--space-2);font-weight:700}.node-pop .btn-primary{--btn-bg: var(--surface);--btn-fg: var(--hue-deep);--btn-border: var(--surface);--btn-base: rgb(0 0 0 / .2);margin-top:var(--space-2)}@keyframes pop-in{0%{opacity:0;transform:translateY(-6px) scale(.95)}}@media (max-width: 420px){.node{--size: 68px}}@media (prefers-reduced-motion: reduce){.node-available .node-btn:before,.node-building .node-btn:after,.node-bubble,.streak .flame.lit{animation:none}}.planner{display:grid;grid-template-columns:auto 1fr;gap:var(--space-4);align-items:start;border-style:dashed}.planner h2{font-size:var(--text-lg);margin-bottom:var(--space-1)}.planner>.btn{grid-column:1 / -1;justify-self:start}.planner-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:var(--radius-md);background:var(--xp-soft);color:var(--xp-ink)}.confirm-title{font-size:var(--text-xl)}.due-banner{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:var(--space-4);margin-bottom:var(--space-5);padding:var(--space-4);border-radius:var(--radius-lg);background:var(--primary-soft);color:var(--ink);text-decoration:none;border:2px solid color-mix(in srgb,var(--primary) 30%,transparent)}.due-banner strong{display:block}.due-banner small{color:var(--ink-2)}.due-cards{position:relative;width:48px;height:48px}.due-cards span{position:absolute;top:4px;right:8px;bottom:4px;left:8px;border-radius:8px;background:var(--surface);border:2px solid var(--primary)}.due-cards span:nth-child(1){transform:rotate(-12deg) translate(-4px);opacity:.5}.due-cards span:nth-child(2){transform:rotate(8deg) translate(4px);opacity:.7}.due-cards span:nth-child(3){display:grid;place-items:center;color:var(--primary)}.due-banner:hover .due-cards span:nth-child(1){transform:rotate(-20deg) translate(-8px)}.due-cards span{transition:transform var(--dur) var(--ease-pop)}.words-filters{position:sticky;top:0;z-index:5;display:grid;gap:var(--space-3);margin:0 calc(-1 * var(--space-4)) var(--space-4);padding:var(--space-3) var(--space-4);background:color-mix(in srgb,var(--bg) 92%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.chips-scroll{display:flex;gap:var(--space-2);overflow-x:auto;padding:2px 2px var(--space-1);scrollbar-width:none}.chips-scroll::-webkit-scrollbar{display:none}.word-list{display:grid;gap:var(--space-2);margin:0;padding:0;list-style:none}.word-row{display:flex;align-items:center;gap:var(--space-3);width:100%;padding:var(--space-3) var(--space-4);border:2px solid var(--line);border-radius:var(--radius-lg);background:var(--surface);text-align:left;transition:border-color var(--dur) var(--ease),transform var(--dur-fast) var(--ease)}.word-row:hover{border-color:var(--line-strong)}.word-row:active{transform:scale(.99)}.word-main{flex:1;min-width:0;display:grid}.word-ms{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-xl);font-weight:800}.word-en{color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.word-side{display:grid;justify-items:end;gap:var(--space-2)}.due-dot{width:10px;height:10px;border-radius:50%;background:var(--xp);box-shadow:0 0 0 3px var(--xp-soft)}.input-big{font-size:var(--text-xl);font-weight:800}.examples-field{margin:0;padding:0;border:0}.example-row{display:grid;grid-template-columns:1fr 1fr auto;gap:var(--space-2);align-items:center}@media (max-width: 520px){.example-row{grid-template-columns:1fr auto}.example-row .input:nth-child(2){grid-row:2}.example-row .btn{grid-row:1 / span 2;grid-column:2}}.word-actions .word-delete{--btn-fg: var(--danger)}.word-actions .word-delete:hover{--btn-bg: var(--danger-soft)}.import-format{display:grid;gap:var(--space-2)}.import-tools{gap:var(--space-2)}.import-text{min-height:180px}.table-wrap{overflow-x:auto;border:2px solid var(--line);border-radius:var(--radius-md);background:var(--surface)}.preview{width:100%;border-collapse:collapse;font-size:var(--text-sm)}.preview th,.preview td{padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--line);text-align:left;vertical-align:top}.preview th{background:var(--surface-2);font-weight:800;color:var(--ink-2);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.05em}.preview tr:last-child td{border-bottom:0}.row-bad td{background:var(--danger-soft);color:var(--ink)}.row-bad svg{display:inline;vertical-align:-3px;color:var(--danger)}.import-actions{display:grid;gap:var(--space-2)}.skip-list{display:grid;gap:var(--space-2);margin:0 auto var(--space-5);padding:0;max-width:480px;list-style:none}.import-done-actions{justify-content:center}.flash-body{flex:1;display:grid;place-items:center;padding:var(--space-4)}.card-stage{position:relative;width:min(380px,100%);aspect-ratio:3 / 4;max-height:60dvh;perspective:1200px}.card-stack span{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:var(--radius-xl);background:var(--surface);border:2px solid var(--line)}.card-stack .stack-1{transform:translateY(10px) scale(.96);opacity:.8}.card-stack .stack-2{transform:translateY(20px) scale(.92);opacity:.5}.flashcard{position:absolute;top:0;right:0;bottom:0;left:0;padding:0;border:0;background:none;transform-style:preserve-3d;transition:transform var(--dur-slow) var(--ease);animation:card-in var(--dur-slow) var(--ease-pop)}.flashcard.is-flipped{transform:rotateY(180deg)}.flashcard.leave-up{animation:leave-up .5s var(--ease) forwards}.flashcard.leave-left{animation:leave-left .36s var(--ease) forwards}@keyframes card-in{0%{transform:translateY(14px) scale(.96);opacity:0}}@keyframes leave-up{to{transform:rotateY(180deg) translateY(-60px) scale(.9);opacity:0}}@keyframes leave-left{to{transform:rotateY(180deg) translate(120%) rotate(8deg);opacity:0}}.face{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;align-content:center;justify-items:center;gap:var(--space-3);padding:var(--space-6);border-radius:var(--radius-xl);background:var(--surface);border:2px solid var(--line);box-shadow:var(--shadow-2);backface-visibility:hidden;text-align:center}.face-back{transform:rotateY(180deg);background:var(--primary-soft);border-color:color-mix(in srgb,var(--primary) 30%,transparent)}.face-group{position:absolute;top:var(--space-5);left:50%;transform:translate(-50%);padding:2px var(--space-3);border-radius:var(--radius-pill);background:var(--surface-2);color:var(--ink-2);font-size:var(--text-xs);font-weight:800}.face-word{font-size:var(--text-4xl);font-weight:900;letter-spacing:-.02em;line-height:1.1;word-break:break-word}.face-word-sm{font-size:var(--text-xl);color:var(--ink-2)}.face-tr{font-size:var(--text-2xl);font-weight:800;color:var(--primary)}.face-ctx{color:var(--ink-2);font-size:var(--text-sm)}.face-ex{display:grid;gap:2px;padding:var(--space-3);border-radius:var(--radius-md);background:var(--surface)}.face-hint{position:absolute;bottom:var(--space-5);color:var(--ink-3);font-size:var(--text-sm)}.box-up{position:absolute;left:50%;top:40%;padding:var(--space-2) var(--space-4);border-radius:var(--radius-pill);background:var(--primary);color:var(--on-primary);font-weight:900;animation:box-up .5s var(--ease-pop) forwards;pointer-events:none}@keyframes box-up{0%{transform:translate(-50%,20px) scale(.6);opacity:0}to{transform:translate(-50%,-60px) scale(1);opacity:1}}.flash-buttons{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3)}.flash-buttons kbd{background:transparent;border-color:currentColor;color:inherit;opacity:.7}.flash-done{text-align:center}@media (prefers-reduced-motion: reduce){.flashcard,.flashcard.is-flipped{transition:none}.flashcard.leave-up,.flashcard.leave-left,.box-up{animation:none}}.review-count{white-space:nowrap;padding:var(--space-1) var(--space-3);border-radius:var(--radius-pill);background:var(--review-soft);color:var(--review);font-weight:800;font-size:var(--text-sm)}.review-card{display:grid;gap:var(--space-4);padding:var(--space-6) var(--space-5);border-radius:var(--radius-xl);background:var(--surface);border:2px solid var(--line);border-top:8px solid var(--review);animation:card-in var(--dur-slow) var(--ease-pop)}.review-meta{display:flex;align-items:center;gap:var(--space-3)}.review-q{font-size:var(--text-xl)}.review-prompt p{font-size:var(--text-lg)}.review-learner{padding:var(--space-4);border-radius:var(--radius-lg);background:var(--review-soft)}.review-learner p{font-size:var(--text-2xl);font-weight:800;line-height:1.3}.review-comment{display:flex;gap:var(--space-3);margin:0;padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);background:var(--surface-2);font-style:italic}.review-comment svg{flex:none;margin-top:3px;color:var(--review)}.review-machine{padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);border:2px dashed var(--line);color:var(--ink-2);font-size:var(--text-sm)}.review-machine summary{cursor:pointer;font-weight:800}.review-machine[open] summary{margin-bottom:var(--space-2)}.review-actions{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3)}.verdict-btn{min-height:84px;flex-direction:column;gap:2px;font-size:var(--text-xl)}.verdict-btn span{display:grid;line-height:1.1}.verdict-btn small{font-size:var(--text-xs);font-weight:700;opacity:.85}.verdict-btn kbd{position:absolute;top:var(--space-2);right:var(--space-2);background:transparent;border-color:currentColor;color:inherit;opacity:.7}.review-skip{grid-column:1 / -1;justify-self:center}.review-fix-text{font-size:var(--text-xl);font-weight:700;min-height:80px}.review-fix-actions .btn-block{flex:1}.review-empty{display:grid;justify-items:center;gap:var(--space-3);padding:var(--space-8) var(--space-5);text-align:center}.review-empty h2{font-size:var(--text-3xl);color:var(--review)}.settings-section{display:grid;gap:var(--space-4)}.settings-head{display:flex;gap:var(--space-3);align-items:flex-start}.settings-head h2{font-size:var(--text-lg)}.settings-icon{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:var(--radius-md);background:var(--primary-soft);color:var(--primary)}.settings-demo{border-style:dashed}.settings-demo .settings-icon{background:var(--xp-soft);color:var(--xp-ink)}.goal-seg{grid-auto-flow:row;grid-template-columns:repeat(2,1fr)}@media (min-width: 600px){.goal-seg{grid-auto-flow:column;grid-template-columns:none}}.goal-seg label{min-height:64px}.theme-seg label{grid-auto-flow:column;gap:var(--space-2)}.switch-row{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4)}.switch-row label{display:grid;cursor:pointer}.judge-form{display:grid;gap:var(--space-3)}@media (min-width: 600px){.judge-form{grid-template-columns:3fr 2fr}.judge-actions{grid-column:1 / -1}}.probe .stack{gap:var(--space-2)}.checklist{display:grid;gap:var(--space-4);margin:0;padding-left:var(--space-5)}.checklist li{display:grid;gap:var(--space-2)}.checklist li::marker{font-weight:900;color:var(--danger)}.token-list{display:grid;gap:var(--space-2);margin:0;padding:0;list-style:none}.token-list li,.account-row{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);border-radius:var(--radius-md);background:var(--surface-2)}.token-icon,.avatar{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--surface);color:var(--ink-2)}.avatar{background:var(--primary);color:var(--on-primary);font-weight:900;font-size:var(--text-lg)}.token-main{flex:1;min-width:0;display:grid}.token-main .small{overflow:hidden;text-overflow:ellipsis}.token-reveal code{font-size:var(--text-md);font-weight:700;padding:var(--space-3);border:2px dashed var(--xp);background:var(--xp-soft);color:var(--ink);white-space:normal;word-break:break-all}@media (max-width: 520px){.account-row{flex-wrap:wrap}}.player-top{position:sticky;top:0;z-index:20;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:var(--space-3);width:100%;max-width:760px;margin:0 auto;padding:var(--space-3) var(--space-4);background:var(--bg)}.progress{height:16px;border-radius:var(--radius-pill);background:var(--surface-3);overflow:hidden}.progress-fill{position:relative;display:block;height:100%;border-radius:inherit;background:var(--primary);transition:width var(--dur-slow) var(--ease-pop)}.progress-fill:after{content:"";position:absolute;top:3px;left:8px;right:8px;height:4px;border-radius:var(--radius-pill);background:#ffffff59}.progress-fill.is-retry{background:var(--xp)}.progress-count{display:inline-flex;align-items:center;gap:4px;min-width:48px;justify-content:flex-end;color:var(--ink-2);font-weight:800;font-size:var(--text-sm);font-variant-numeric:tabular-nums}.player-body,.intro{flex:1;width:100%;max-width:640px;margin:0 auto;padding:var(--space-4) var(--space-4) var(--space-6)}.player-foot{position:sticky;bottom:0;width:100%;max-width:640px;margin:0 auto;padding:var(--space-4) var(--space-4) calc(var(--space-4) + env(safe-area-inset-bottom));background:linear-gradient(to top,var(--bg) 70%,transparent)}.key-hint{margin-top:var(--space-2);text-align:center;color:var(--ink-3);font-size:var(--text-xs)}@media (hover: none){.key-hint,.option kbd,.fill-chip kbd,.verdict-btn kbd,.flash-buttons kbd,.review-skip kbd{display:none}}.player-center{flex:1;display:grid;place-content:center;justify-items:center;gap:var(--space-4);padding:var(--space-6) var(--space-4);text-align:center}.player-msg{font-size:var(--text-2xl)}.instruction{margin-bottom:var(--space-5);font-size:var(--text-xl);font-weight:800}.retry-ribbon{display:inline-flex;align-items:center;gap:var(--space-1);margin-bottom:var(--space-3);padding:2px var(--space-3);border-radius:var(--radius-pill);background:var(--xp-soft);color:var(--xp-ink);font-weight:800;font-size:var(--text-sm)}.check-error{margin-top:var(--space-4)}.ex{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-5);animation:ex-in var(--dur-slow) var(--ease)}@keyframes ex-in{0%{opacity:0;transform:translate(24px)}}.prompt{display:flex;align-items:baseline;gap:var(--space-3);font-size:var(--text-2xl);font-weight:800;line-height:1.3}.prompt-lang{flex:none;position:relative;top:-3px;padding:1px 6px;border-radius:6px;background:var(--surface-2);color:var(--ink-2);font-size:11px;font-weight:900;letter-spacing:.06em}.prompt-ms .prompt-lang{background:var(--primary-soft);color:var(--primary)}.options{display:grid;gap:var(--space-3)}.option{display:flex;align-items:center;gap:var(--space-3);min-height:60px;padding:var(--space-3) var(--space-4);border:2px solid var(--line);border-radius:var(--radius-lg);background:var(--surface);box-shadow:0 4px 0 var(--line);font-size:var(--text-lg);font-weight:700;text-align:left;transition:transform var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease),border-color var(--dur) var(--ease),background-color var(--dur) var(--ease)}.option:hover:not([aria-disabled=true]){background:var(--surface-2)}.option:active:not([aria-disabled=true]){transform:translateY(4px);box-shadow:0 0 0 var(--line)}.option kbd{flex:none}.option.is-picked,.fill-chip.is-picked{border-color:var(--pending);background:var(--pending-soft);box-shadow:0 4px 0 var(--pending)}.option.is-picked kbd{border-color:var(--pending);color:var(--pending)}.option.is-right,.fill-chip.is-right{border-color:var(--primary);background:var(--primary-soft);box-shadow:0 4px 0 var(--primary);animation:pop var(--dur-slow) var(--ease-pop)}.option.is-wrong,.fill-chip.is-wrong{border-color:var(--danger);background:var(--danger-soft);box-shadow:0 4px 0 var(--danger);animation:shake .4s var(--ease)}.option.is-answer,.fill-chip.is-answer{border-color:var(--primary);border-style:dashed}.option.is-dim,.fill-chip.is-dim{opacity:.5}@keyframes pop{40%{transform:scale(1.04)}}@keyframes shake{20%,60%{transform:translate(-6px)}40%,80%{transform:translate(6px)}}.speech{display:flex;align-items:flex-end;gap:var(--space-2)}.speech-moo{flex:none}.bubble{position:relative;flex:1;padding:var(--space-4) var(--space-5);border:2px solid var(--line);border-radius:var(--radius-lg);background:var(--surface)}.bubble:before{content:"";position:absolute;left:-9px;bottom:18px;width:16px;height:16px;background:var(--surface);border-left:2px solid var(--line);border-bottom:2px solid var(--line);transform:rotate(45deg)}.bubble .prompt{font-size:var(--text-xl)}.answer-line{display:flex;flex-wrap:wrap;align-content:flex-start;gap:var(--space-2);min-height:124px;padding:var(--space-3) 0;background-image:repeating-linear-gradient(to bottom,transparent 0,transparent 57px,var(--line-strong) 57px,var(--line-strong) 59px)}.answer-placeholder{align-self:center;color:var(--ink-3);font-weight:700}.tray{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-2);padding-top:var(--space-2)}.wtile{min-height:46px;padding:0 var(--space-4);border:2px solid var(--line);border-radius:var(--radius-md);background:var(--surface);box-shadow:0 4px 0 var(--line);font-size:var(--text-lg);font-weight:700;transition:transform var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease)}.wtile:active:not(:disabled){transform:translateY(4px);box-shadow:0 0 0 var(--line)}.wtile-placed{animation:tile-in var(--dur) var(--ease-pop)}@keyframes tile-in{0%{transform:scale(.7);opacity:0}}.wtile-ghost{background:var(--surface-3);border-color:var(--surface-3);box-shadow:none;color:transparent;cursor:default}.mode-switch{display:inline-flex;align-items:center;gap:var(--space-1);justify-self:center}.answer-text{font-size:var(--text-xl);font-weight:700}.sentence{font-size:var(--text-2xl);font-weight:800;line-height:1.8}.slot{display:inline-block;min-width:4.5em;padding:0 var(--space-3);border-bottom:4px solid var(--line-strong);border-radius:6px 6px 0 0;text-align:center;line-height:1.4;vertical-align:baseline;transition:background-color var(--dur) var(--ease),border-color var(--dur) var(--ease)}.slot-filled{background:var(--pending-soft);border-color:var(--pending);animation:tile-in var(--dur) var(--ease-pop)}.slot.is-right,.slot-input.is-right{background:var(--primary-soft);border-color:var(--primary)}.slot.is-wrong,.slot-input.is-wrong{background:var(--danger-soft);border-color:var(--danger)}.slot-input{min-width:5em;max-width:100%;padding:0 var(--space-2);border:0;border-bottom:4px solid var(--primary);border-radius:6px 6px 0 0;background:var(--surface-2);color:var(--ink);font:inherit;text-align:center;line-height:1.4}.slot-input:focus-visible{outline:none;background:var(--primary-soft)}.fill-options{display:flex;flex-wrap:wrap;gap:var(--space-3)}.fill-chip,.fill-chip[aria-checked]{color:var(--ink)}.fill-chip{min-height:52px;padding:0 var(--space-5);border-radius:var(--radius-md);box-shadow:0 4px 0 var(--line);color:var(--ink);font-size:var(--text-lg)}.fill-chip kbd{margin-right:var(--space-1)}.hint-btn{display:inline-flex;align-items:center;gap:var(--space-1);justify-self:start}.hint{display:inline-flex;align-items:center;gap:var(--space-2);justify-self:start;padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);background:var(--xp-soft);color:var(--ink);font-weight:700;animation:tile-in var(--dur) var(--ease-pop)}.hint svg{color:var(--xp-ink)}.intro{display:flex;flex-direction:column;padding-bottom:0}.intro-card{flex:1;min-width:0;display:grid;grid-template-columns:minmax(0,1fr);align-content:start;gap:var(--space-4);animation:ex-in var(--dur-slow) var(--ease)}.intro-card h1{font-size:var(--text-3xl)}.intro-body{font-size:var(--text-lg);line-height:1.6}.intro .player-foot{padding-left:0;padding-right:0}.examples{display:grid;gap:var(--space-3);margin:var(--space-2) 0 0;padding:0;list-style:none}.examples li{display:grid;gap:2px;padding:var(--space-3) var(--space-4);border-left:5px solid var(--primary);border-radius:0 var(--radius-md) var(--radius-md) 0;background:var(--surface);animation:ex-in var(--dur-slow) var(--ease) both}.ex-ms{font-size:var(--text-xl);font-weight:700}.ex-ms strong{color:var(--primary);font-weight:900}.ex-en{color:var(--ink-2);font-size:var(--text-sm)}.sheet{--tone: var(--primary);--tone-soft: var(--primary-soft);--tone-deep: var(--primary-deep);--on-tone: var(--on-primary);position:sticky;bottom:0;z-index:30;background:var(--tone-soft);border-top:3px solid var(--tone);box-shadow:var(--shadow-sheet);animation:sheet-up var(--dur-slow) var(--ease)}.sheet-incorrect{--tone: var(--danger);--tone-soft: var(--danger-soft);--tone-deep: var(--danger-deep);--on-tone: var(--on-danger)}.sheet-pending{--tone: var(--pending);--tone-soft: var(--pending-soft);--tone-deep: var(--pending-deep);--on-tone: var(--on-pending)}@keyframes sheet-up{0%{transform:translateY(100%)}}.sheet-inner{display:grid;gap:var(--space-3);max-width:640px;max-height:62dvh;overflow-y:auto;margin:0 auto;padding:var(--space-5) var(--space-4) calc(var(--space-4) + env(safe-area-inset-bottom))}.sheet-head{display:flex;align-items:center;gap:var(--space-3)}.sheet-head h2{color:var(--tone);font-size:var(--text-2xl)}.sheet-pending .sheet-head h2{font-size:var(--text-xl)}.sheet-icon{flex:none;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--tone);color:var(--on-tone)}.sheet-correct .sheet-icon{animation:pop-big var(--dur-slow) var(--ease-pop)}@keyframes pop-big{0%{transform:scale(.3) rotate(-30deg)}}.sheet-sub{color:var(--ink-2);font-size:var(--text-sm)}.sheet-label{display:block;color:var(--ink-2);font-size:var(--text-xs);font-weight:800;letter-spacing:.06em;text-transform:uppercase}.sheet-answer p{color:var(--tone);font-size:var(--text-xl);font-weight:800}.sheet-feedback{color:var(--ink)}.sheet-source{color:var(--ink-2);font-size:var(--text-xs);font-weight:700}.sheet-cta{--btn-bg: var(--tone);--btn-fg: var(--on-tone);--btn-base: var(--tone-deep);--btn-border: var(--tone);margin-top:var(--space-2)}.dispute .link-btn{display:inline-flex;align-items:center;gap:var(--space-1);color:var(--ink-2);font-size:var(--text-sm)}.dispute-form{display:grid;grid-template-columns:1fr auto;gap:var(--space-2);align-items:center}.dispute-form .input{min-height:40px;padding:var(--space-2) var(--space-3);background:var(--surface)}.dispute-error{grid-column:1 / -1;color:var(--danger);font-size:var(--text-sm)}.dispute-sent{display:inline-flex;align-items:center;gap:var(--space-1);color:var(--review);font-weight:800;font-size:var(--text-sm)}.summary{flex:1;display:grid;align-content:center;justify-items:center;gap:var(--space-3);width:100%;max-width:520px;margin:0 auto;padding:var(--space-6) var(--space-4) calc(var(--space-6) + env(safe-area-inset-bottom));text-align:center}.summary-hero{position:relative;display:grid;place-items:center;width:220px;height:180px}.summary-moo{animation:moo-jump .9s var(--ease-pop) both}@keyframes moo-jump{0%{transform:translateY(30px) scale(.6);opacity:0}60%{transform:translateY(-10px) scale(1.05);opacity:1}}.petals span{--angle: calc(var(--i) * 25.7deg);position:absolute;left:50%;top:50%;width:14px;height:20px;margin:-10px 0 0 -7px;border-radius:50%/60% 60% 40% 40%;background:var(--bloom);opacity:0;animation:petal 1.4s var(--ease) .2s forwards}.petals span:nth-child(3n){background:var(--xp)}.petals span:nth-child(4n){background:var(--primary)}@keyframes petal{0%{opacity:1;transform:rotate(var(--angle)) translateY(0) scale(.4)}70%{opacity:1}to{opacity:0;transform:rotate(var(--angle)) translateY(-130px) rotate(200deg) scale(1)}}.summary-title{font-size:var(--text-3xl);color:var(--primary);animation:pop-big var(--dur-slow) var(--ease-pop) .3s both}.summary-blooms .blooms{gap:var(--space-2)}.summary-blooms svg{animation:bloom-in .6s var(--ease-pop) both}.summary-blooms svg:nth-child(1){animation-delay:.5s}.summary-blooms svg:nth-child(2){animation-delay:.75s}.summary-blooms svg:nth-child(3){animation-delay:1s}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-3);width:100%;margin:var(--space-3) 0}.stat{display:grid;gap:var(--space-1);padding:var(--space-3) var(--space-2);border-radius:var(--radius-lg);border:2px solid var(--line);background:var(--surface)}.stat dt{color:var(--ink-2);font-size:var(--text-xs);font-weight:800;letter-spacing:.05em;text-transform:uppercase}.stat dd{display:flex;align-items:baseline;justify-content:center;gap:4px;margin:0;font-size:var(--text-2xl);font-weight:900;font-variant-numeric:tabular-nums}.stat dd small{color:var(--ink-2);font-size:var(--text-xs);font-weight:700}.stat-xp{border-color:var(--xp);background:var(--xp-soft)}.stat-xp dd{color:var(--xp-ink)}.stat-acc dd{color:var(--primary)}.stat-streak dd{align-items:center;color:var(--xp-ink)}.summary-pending{text-align:left}.summary-actions{display:grid;gap:var(--space-3);width:100%;margin-top:var(--space-3)}@media (prefers-reduced-motion: reduce){.petals{display:none}.ex,.intro-card,.examples li,.option.is-right,.option.is-wrong,.summary-moo,.summary-title,.summary-blooms svg,.sheet,.sheet-correct .sheet-icon{animation:none}}