:root{--card-face:#f6f7f8;--card-suit-red:#d6342c;--card-suit-black:#16161a;--chart-hit:#2b3a44;--chart-stand:#c9d3d8;--chart-double:#e8b04b;--chart-split:#7c8cff;--chart-surrender:#e0665c;--font-body:"Inter", system-ui, -apple-system, sans-serif;--type-display:34px;--type-title:26px;--type-headline:20px;--type-body:16px;--type-caption:13px;--type-overline:12px;--space-xs:4px;--space-sm:8px;--space-md:12px;--space-lg:16px;--space-xl:24px;--space-xxl:32px;--radius-sm:10px;--radius-md:16px;--radius-lg:22px;--radius-card:12px;--radius-pill:999px;--motion-fast:.12s;--motion-base:.2s;--motion-slow:.32s}:root,[data-theme=tide]{--ground:#080c0f;--surface:#121a1f;--raised:#1a252c;--line:#24323b;--text:#eef4f6;--muted:#9aaab2;--accent:#34d3b6;--on-accent:#04201b;--bad:#ff6b6b;--font-display:"Sora", var(--font-body)}[data-theme=ember]{--ground:#0c0b0a;--surface:#1a1816;--raised:#242120;--line:#302c2a;--text:#f5f2ef;--muted:#a8a29e;--accent:#ff6b57;--on-accent:#1a0a07;--bad:#ff4d8d;--font-display:"Space Grotesk", var(--font-body)}[data-theme=signal]{--ground:#09090b;--surface:#16171b;--raised:#1f2026;--line:#2a2b33;--text:#f4f4f5;--muted:#a1a1aa;--accent:#6b9bff;--on-accent:#0a1230;--bad:#ff6b6b;--font-display:"Manrope", var(--font-body)}*{box-sizing:border-box}html,body{background:var(--ground);min-height:100%;color:var(--text);font-family:var(--font-body);font-size:var(--type-body);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;margin:0}main{max-width:480px;margin:0 auto}h1,h2,h3{font-family:var(--font-display);letter-spacing:-.02em;margin:0}h1{font-size:var(--type-display);font-weight:700}h2{font-size:var(--type-headline);margin:var(--space-xl) 0 var(--space-md);font-weight:600}h3{font-size:var(--type-body);font-weight:600}p{margin:0}button,select,input{font:inherit;color:inherit}button{cursor:pointer;background:0 0;border:0;padding:0}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}[hidden]{display:none!important}.muted{color:var(--muted)}.fine{color:var(--muted);font-size:var(--type-caption);margin-top:var(--space-md)}.overline{color:var(--muted);font-size:var(--type-overline);letter-spacing:.12em;text-transform:uppercase;font-weight:600}.icon{width:22px;height:22px;display:inline-flex}.icon svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:100%;height:100%}.primary,.secondary{min-height:52px;padding:0 var(--space-xl);border-radius:var(--radius-md);transition:transform var(--motion-fast), filter var(--motion-fast);justify-content:center;align-items:center;font-weight:600;display:inline-flex}.primary{background:var(--accent);color:var(--on-accent)}.secondary{background:var(--raised)}.primary:active,.secondary:active{transform:scale(.98)}.primary:hover,.secondary:hover{filter:brightness(1.08)}.icon-button{background:var(--surface);width:48px;height:48px;color:var(--text);border-radius:50%;flex:none;justify-content:center;align-items:center;display:inline-flex}.pill,.pill-select{border-radius:var(--radius-pill);background:var(--surface);color:var(--muted);font-size:var(--type-caption);padding:var(--space-sm) var(--space-lg);letter-spacing:.02em;font-weight:500}.pill-select{appearance:none;background-image:linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%);background-position:calc(100% - 17px) 55%,calc(100% - 12px) 55%;background-repeat:no-repeat;background-size:5px 5px;background-color:var(--surface);border:0;max-width:60%;padding-right:30px}.chip{border-radius:var(--radius-pill);background:color-mix(in srgb, var(--accent) 18%, transparent);color:var(--accent);font-size:var(--type-overline);padding:var(--space-xs) var(--space-md);margin-left:auto;font-weight:600}.chips{gap:var(--space-sm);margin:var(--space-lg) 0;flex-wrap:wrap;display:flex}.chip-toggle{border-radius:var(--radius-pill);background:var(--raised);color:var(--muted);padding:var(--space-sm) var(--space-md);font-size:var(--type-caption);border:1px solid #0000;font-weight:500}.chip-toggle[aria-pressed=true]{background:color-mix(in srgb, var(--accent) 16%, var(--raised));border-color:var(--accent);color:var(--text)}.page{padding:max(var(--space-xl), env(safe-area-inset-top)) var(--space-lg) calc(120px + env(safe-area-inset-bottom))}.page-head{justify-content:space-between;align-items:center;gap:var(--space-md);margin:var(--space-xl) 0 var(--space-xl);display:flex}.page-head.start{justify-content:flex-start}.hero{background:var(--surface);border-radius:var(--radius-lg);padding:var(--space-xl);flex-direction:column;display:flex}.hero h2{font-size:var(--type-title);margin:var(--space-sm) 0 var(--space-sm);font-weight:700}.hero .primary{margin-top:var(--space-xl)}.tiles{gap:var(--space-md);margin-top:var(--space-lg);grid-template-columns:1fr 1fr;display:grid}.tiles.three{grid-template-columns:repeat(3,1fr)}.tile{background:var(--surface);border-radius:var(--radius-md);padding:var(--space-lg);gap:var(--space-xs);flex-direction:column;display:flex}.tile b{font-family:var(--font-display);font-size:var(--type-title);letter-spacing:-.02em;font-variant-numeric:tabular-nums;font-weight:700}.tile span{color:var(--muted);font-size:var(--type-caption)}.units{gap:var(--space-lg);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.units li{align-items:center;gap:var(--space-lg);display:flex}.units li.locked{color:var(--muted);opacity:.7}.ring{flex:none;width:44px;height:44px}.ring svg{width:100%;height:100%;transform:rotate(-90deg)}.ring circle{fill:none;stroke-width:4px;stroke-linecap:round}.ring .track{stroke:var(--raised)}.ring .started{stroke:color-mix(in srgb, var(--accent) 30%, transparent)}.ring .fluent{stroke:var(--accent)}.ring circle[stroke-dasharray^="0.00"]{stroke:none}.ring.lock{background:var(--surface);border-radius:50%;justify-content:center;align-items:center;display:inline-flex}.ring.lock svg{fill:none;stroke:currentColor;stroke-width:1.8px;width:20px;height:20px;transform:none}.unit-text{flex-direction:column;display:flex}.unit-text b{font-weight:600}.unit-text span{color:var(--muted);font-size:var(--type-caption)}.tabbar{left:50%;bottom:max(var(--space-lg), env(safe-area-inset-bottom));width:min(448px, calc(100% - 2 * var(--space-lg)));padding:var(--space-sm);border-radius:var(--radius-pill);background:var(--raised);z-index:10;justify-content:space-around;display:flex;position:fixed;transform:translate(-50%);box-shadow:0 12px 32px #00000073}@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.tabbar{background:color-mix(in srgb, var(--raised) 72%, transparent);-webkit-backdrop-filter:blur(20px)saturate(1.4);backdrop-filter:blur(20px)saturate(1.4)}}.tabbar button{padding:var(--space-sm) 0;border-radius:var(--radius-pill);color:var(--muted);font-size:var(--type-overline);flex-direction:column;flex:1;align-items:center;gap:2px;font-weight:500;display:flex}.tabbar button[aria-current=true]{color:var(--accent)}.drill{height:100dvh;padding:max(var(--space-lg), env(safe-area-inset-top)) var(--space-lg) max(var(--space-lg), env(safe-area-inset-bottom));-webkit-user-select:none;user-select:none;touch-action:manipulation;flex-direction:column;display:flex}.drill-top{align-items:center;gap:var(--space-sm);grid-template-columns:48px 1fr 48px;display:grid}.drill-top .pill{justify-self:center}.count{color:var(--muted);font-size:var(--type-body);font-variant-numeric:tabular-nums;justify-self:end}.count b{color:var(--text)}.meter{border-radius:var(--radius-pill);background:var(--raised);height:4px;margin-top:var(--space-lg);overflow:hidden}.meter div{background:var(--accent);border-radius:inherit;width:0;height:100%;transition:width var(--motion-slow) ease-out}.table{justify-content:center;align-items:center;gap:var(--space-lg);border-radius:var(--radius-lg);min-height:0;transition:background-color var(--motion-base);flex-direction:column;flex:1;display:flex}.table.flash{background:radial-gradient(closest-side, color-mix(in srgb, var(--accent) 18%, transparent), transparent)}.seat{align-items:center;gap:var(--space-sm);flex-direction:column;display:flex}.cards{justify-content:center;display:flex}.card{--w:clamp(76px, 24vw, 108px);width:var(--w);height:calc(var(--w) * 1.4);border-radius:var(--radius-card);background:var(--card-face);color:var(--card-suit-black);font-family:var(--font-display);position:relative;box-shadow:0 6px 18px #00000059}.card.red{color:var(--card-suit-red)}.card .rank{font-size:calc(var(--w) * .34);letter-spacing:-.04em;font-weight:700;line-height:1;position:absolute;top:6%;left:10%}.card .pip{font-size:calc(var(--w) * .42);justify-content:center;align-items:center;line-height:1;display:flex;position:absolute;inset:22% 0 0}.fan .card+.card{margin-left:calc(var(--w) * -.42)}.fan .card:nth-child(odd){transform:rotate(-4deg)}.fan .card:nth-child(2n){transform:rotate(4deg)translateY(2px)}.hand{border-radius:var(--radius-md);display:block}.total{font-family:var(--font-display);font-size:var(--type-headline);opacity:0;min-height:1.4em;transition:opacity var(--motion-slow) ease-out;font-weight:600}.total.shown{opacity:1}.tag{border-radius:var(--radius-pill);background:var(--surface);color:var(--accent);font-size:var(--type-overline);letter-spacing:.06em;text-transform:uppercase;padding:var(--space-xs) var(--space-md);font-weight:600}.tag.empty{visibility:hidden}.tag.empty:before{content:" "}.feedback{text-align:center;min-height:3.2em;font-size:var(--type-caption);color:var(--muted);padding:0 var(--space-sm);margin-bottom:var(--space-sm);justify-content:center;align-items:center;display:flex}.feedback.good{color:var(--accent);font-variant-numeric:tabular-nums}.feedback.slow{color:var(--muted)}.feedback.bad{color:var(--text);background:color-mix(in srgb, var(--bad) 14%, var(--surface));border-radius:var(--radius-md);padding:var(--space-md) var(--space-lg);text-align:left;display:block}.feedback.bad strong{color:var(--bad)}.actions{gap:var(--space-md);grid-template-columns:repeat(6,1fr);display:grid}.act{border-radius:var(--radius-md);background:var(--surface);min-height:64px;font-weight:600;font-size:var(--type-body);transition:background-color var(--motion-fast), transform var(--motion-fast);grid-column:span 2;position:relative}.act:nth-child(-n+2){grid-column:span 3;min-height:76px}.act:active{background:var(--raised);transform:scale(.97)}.act.right{background:var(--accent);color:var(--on-accent)}.act.wrong{background:color-mix(in srgb, var(--bad) 30%, var(--surface))}.act kbd{color:var(--muted);font-family:inherit;font-size:10px;display:none;position:absolute;top:6px;right:8px}@media (hover:hover) and (pointer:fine){.act kbd{display:block}.act:hover{background:var(--raised)}}.drill.done>:not(.summary,.drill-top){display:none}.drill.done .drill-top>:not(#drill-close){visibility:hidden}.summary{padding-top:var(--space-xl);flex-direction:column;flex:1;display:flex;overflow-y:auto}.summary h1{margin:var(--space-sm) 0 var(--space-sm)}.missed{background:var(--surface);border-radius:var(--radius-md);margin:0;padding:0;list-style:none}.missed li{justify-content:space-between;gap:var(--space-md);padding:var(--space-md) var(--space-lg);font-size:var(--type-caption);display:flex}.missed li+li{border-top:1px solid var(--line)}.missed b{color:var(--accent)}.summary-actions{padding-top:var(--space-xl);gap:var(--space-md);grid-template-columns:1fr 2fr;margin-top:auto;display:grid}.scroll{margin:0 calc(-1 * var(--space-lg));padding:0 var(--space-lg);overflow-x:auto}.grid{border-collapse:separate;border-spacing:3px;font-size:var(--type-overline);margin:0 auto}.grid th{color:var(--muted);padding:2px 4px;font-weight:500}.grid th[scope=row]{text-align:right;white-space:nowrap}.grid td{padding:0}.cell{background:var(--stage,var(--raised));border-radius:5px;width:26px;height:22px;display:block}.stage-new{--stage:var(--raised)}.stage-learning{--stage:color-mix(in srgb, var(--accent) 28%, var(--raised))}.stage-review{--stage:color-mix(in srgb, var(--accent) 60%, var(--raised))}.stage-fluent{--stage:var(--accent)}.cell.locked{box-shadow:inset 0 0 0 1px var(--line);background:0 0}.cell.selected{outline:2px solid var(--text);outline-offset:1px}.legend{gap:var(--space-md);margin-top:var(--space-xl);color:var(--muted);font-size:var(--type-caption);flex-wrap:wrap;display:flex}.legend span{align-items:center;gap:6px;display:inline-flex}.legend .cell{border-radius:4px;width:14px;height:14px}.detail{background:var(--surface);border-radius:var(--radius-md);padding:var(--space-lg);margin-top:var(--space-md);gap:var(--space-xs);font-size:var(--type-caption);flex-direction:column;display:flex}.history{margin:var(--space-sm) 0 0;color:var(--muted);padding-left:1.2em}.history .miss{color:var(--bad)}.code{text-align:center;color:#0b0f12;border-radius:5px;width:28px;height:24px;font-size:11px;font-weight:600}.code-H{background:var(--chart-hit);color:var(--text)}.code-S{background:var(--chart-stand)}.code-D{background:var(--chart-double)}.code-P{background:var(--chart-split)}.code-R{background:var(--chart-surrender)}.code-legend{gap:var(--space-sm);color:var(--muted);font-size:var(--type-caption);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.code-legend li{align-items:center;gap:var(--space-md);display:flex}.code-legend i{flex:none;justify-content:center;align-items:center;font-style:normal;display:inline-flex}.themes{gap:var(--space-md);grid-template-columns:repeat(3,1fr);display:grid}.theme{align-items:center;gap:var(--space-sm);padding:var(--space-md);border-radius:var(--radius-md);background:var(--surface);font-size:var(--type-caption);border:2px solid #0000;flex-direction:column;font-weight:600;display:flex}.theme[aria-checked=true]{border-color:var(--accent)}.swatch{border-radius:var(--radius-sm);background:var(--sw-ground);align-items:flex-end;width:100%;height:48px;padding:8px;display:flex}.swatch i{border-radius:var(--radius-pill);background:var(--sw-accent);width:60%;height:10px}.settings{gap:var(--space-lg);flex-direction:column;display:flex}.settings label,.settings .field{gap:var(--space-xs);color:var(--muted);font-size:var(--type-caption);flex-direction:column;display:flex}.settings .chips{margin:var(--space-xs) 0 0}.settings select,.settings input{border-radius:var(--radius-sm);background:var(--surface);min-height:48px;color:var(--text);padding:0 var(--space-md);font-size:var(--type-body);border:0}.row3{gap:var(--space-md);grid-template-columns:repeat(3,1fr);display:grid}.row{gap:var(--space-md);margin-top:var(--space-lg);flex-wrap:wrap;display:flex}.file input{display:none}.toast{left:50%;top:max(var(--space-lg), env(safe-area-inset-top));background:var(--raised);color:var(--text);border-radius:var(--radius-pill);padding:var(--space-md) var(--space-xl);font-size:var(--type-caption);z-index:20;font-weight:500;position:fixed;transform:translate(-50%);box-shadow:0 12px 32px #00000073}@media (prefers-reduced-motion:reduce){*{transition:none!important}}