*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{height:100%}body{height:100%;font-family:Archivo,sans-serif;-webkit-font-smoothing:antialiased;background:#111;overscroll-behavior:none;touch-action:manipulation}#root{height:100%}button{font-family:inherit}:root{--accent: #e07b00;--accent-light: #f59c30;--accent-glow: rgba(224,123,0,.3);--bg: #faf7f2;--surface: #ffffff;--surface2: #f0ead8;--surface3: #e8e0cc;--ink: #18150f;--ink2: #7a6b56;--ink3: #6b5e4e;--line: #e4d9c4;--line2: #d0c4ac;--tile-bg: #ede3d2;--tile-edge: #c4b396;--tile-ink: #1e1a12;--tile-shine: rgba(255,255,255,.65);--slot-bg: #e6dcc8;--slot-border: #c0b298;--slot-filled: #fad17a;--slot-fill-edge:#c29033;--slot-fill-ink: #3d2800;--correct-bg: var(--accent);--correct-glow: var(--accent-glow);--wrong-bg: #fce8e4;--wrong-border: #d4503a;--wrong-ink: #be3922;--chip-bg: #fdeece;--chip-line: #f0c878;--chip-ink: #9a5500;--green-bg: #e6f9ee;--green-line: #7dd4a6;--green-ink: #0b6b35;--target-bg: #18150f;--target-tile: #2a2318;--target-ink: #f8f3e8;--nav-bg: #ffffff;--nav-line: #e4d9c4;--shadow-sm: 0 1px 3px rgba(24,21,15,.1);--shadow-md: 0 4px 12px rgba(24,21,15,.13);--shadow-lg: 0 8px 28px rgba(24,21,15,.18);--shadow-tile: 0 3px 0 var(--tile-edge), var(--shadow-sm);--r-sm: 10px;--r-md: 16px;--r-lg: 22px;--r-xl: 28px;--r-pill:999px}.dark{--bg: #141210;--surface: #1e1a16;--surface2: #28231d;--surface3: #322b23;--ink: #f0e8d8;--ink2: #b0a090;--ink3: #9a8878;--line: #2e2720;--line2: #3e342a;--tile-bg: #33291e;--tile-edge: #1c1510;--tile-ink: #f0e8d8;--tile-shine: rgba(255,255,255,.06);--slot-bg: #1c1812;--slot-border: #3a3226;--slot-filled: #c09030;--slot-fill-edge:#7a5a18;--slot-fill-ink: #fff7e0;--correct-bg: var(--accent);--wrong-bg: #341612;--wrong-border: #b04030;--wrong-ink: #f08060;--chip-bg: #2e2010;--chip-line: #5a3e18;--chip-ink: #e8a840;--green-bg: #0e2416;--green-line: #1e5e36;--green-ink: #4ecf82;--target-bg: #f0e8d8;--target-tile: #d8ccb8;--target-ink: #18150f;--nav-bg: #1e1a16;--nav-line: #2e2720;--shadow-sm: 0 1px 3px rgba(0,0,0,.35);--shadow-md: 0 4px 12px rgba(0,0,0,.45);--shadow-lg: 0 8px 28px rgba(0,0,0,.6);--shadow-tile: 0 3px 0 var(--tile-edge), var(--shadow-sm)}@keyframes spin{to{transform:rotate(360deg)}}.app{width:100%;max-width:430px;height:100dvh;margin:0 auto;background:var(--bg);display:flex;flex-direction:column;position:relative;overflow:hidden;transition:background .2s}@media (min-width: 431px){html,body{height:100dvh;overflow:hidden}body{display:flex;align-items:center;justify-content:center;background:#111}.app{width:390px;max-width:none;height:min(844px,calc(100dvh - 48px));min-height:568px;border-radius:44px;box-shadow:0 40px 100px #0000008c,0 0 0 1px #ffffff12;overflow:hidden}}@media (max-width: 359px){.tile--source,.tile--slot{width:60px;height:70px}.tile--source,.tile--slot{font-size:26px}.tile--sm{width:26px;height:34px;font-size:12px}}.page{flex:1;display:flex;flex-direction:column;overflow:hidden;min-height:0}.page-scroll{flex:1;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;min-height:0}.page-scroll::-webkit-scrollbar{display:none}.topbar{display:flex;align-items:center;justify-content:space-between;padding:18px 20px 14px;flex-shrink:0}.topbar-title{font:900 22px Archivo,sans-serif;letter-spacing:-.5px;color:var(--ink)}.bottom-nav{display:flex;background:var(--nav-bg);border-top:1px solid var(--nav-line);flex-shrink:0;padding-bottom:env(safe-area-inset-bottom,8px)}.nav-item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:12px 0 10px;gap:4px;border:none;background:none;cursor:pointer;color:var(--ink3);font:600 10px Space Mono,monospace;letter-spacing:.3px;text-transform:uppercase;transition:color .12s;position:relative}.nav-item.active{color:var(--accent)}.nav-item.active:after{content:"";position:absolute;top:0;left:25%;right:25%;height:2.5px;background:var(--accent);border-radius:0 0 3px 3px}.nav-icon{font-size:18px;line-height:1}.tile{position:relative;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;flex-shrink:0}.tile--source{width:66px;height:76px;background:var(--tile-bg);box-shadow:inset 0 1px 0 var(--tile-shine),var(--shadow-tile);color:var(--tile-ink);font:800 30px Archivo,sans-serif;cursor:pointer;transition:transform .08s,box-shadow .08s}.tile--source:active:not(.placed){transform:translateY(2px) scale(.95);box-shadow:inset 0 1px 0 var(--tile-shine),var(--shadow-sm)}.tile--source.placed{background:var(--surface2);box-shadow:none;color:transparent;cursor:default;opacity:.5}.tile--slot{width:66px;height:76px;background:var(--slot-bg);border:2px dashed var(--slot-border);color:var(--tile-ink);font:800 30px Archivo,sans-serif;cursor:default;transition:background .12s,border .12s,box-shadow .12s}.tile--slot.filled{background:var(--slot-filled);border:none;box-shadow:inset 0 1px #ffffff47,0 3px 0 var(--slot-fill-edge),var(--shadow-sm);color:var(--slot-fill-ink);cursor:pointer}.tile--slot.correct{background:var(--correct-bg);border:none;box-shadow:inset 0 1px #ffffff38,0 3px #00000038,0 4px 14px var(--correct-glow);color:#fff;cursor:pointer}.tile--slot.wrong{background:var(--wrong-bg);border:2px solid var(--wrong-border);color:var(--wrong-ink);cursor:pointer}.tile-val{position:absolute;right:5px;bottom:4px;font:700 9px Space Mono,monospace;opacity:.35;pointer-events:none}.tile--sm{width:30px;height:38px;font:800 14px Archivo,sans-serif;border-radius:6px}.tile--sm .tile-val{font-size:6px;right:2px;bottom:2px}.btn-primary{display:block;width:100%;border:none;border-radius:var(--r-lg);padding:20px;font:900 17px Archivo,sans-serif;letter-spacing:2px;text-transform:uppercase;color:#fff;background:var(--accent);cursor:pointer;box-shadow:0 4px #0003,var(--shadow-md);transition:transform .08s,box-shadow .08s;text-align:center}.btn-primary:active{transform:translateY(2px);box-shadow:0 2px #0003,var(--shadow-sm)}.btn-secondary{display:block;width:100%;border:1.5px solid var(--line);border-radius:var(--r-lg);padding:17px;font:700 15px Archivo,sans-serif;color:var(--ink);background:var(--surface);cursor:pointer;text-align:center}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:18px}.card--accent{background:var(--target-bg);border-color:transparent}.chip{display:inline-flex;align-items:center;gap:6px;background:var(--chip-bg);border:1.5px solid var(--chip-line);border-radius:var(--r-pill);padding:6px 14px;font:700 13px Space Mono,monospace;color:var(--chip-ink)}.unclaimed-banner{display:flex;align-items:center;justify-content:space-between;width:100%;background:var(--green-bg);border:1.5px solid var(--green-line);border-radius:var(--r-md);padding:14px 16px;cursor:pointer}.stat-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:14px 16px}.stat-label{font:700 9px Space Mono,monospace;letter-spacing:1.5px;text-transform:uppercase;color:var(--ink2);margin-bottom:6px}.stat-value{font:800 26px Space Mono,monospace;color:var(--ink);line-height:1}.lb-row{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:var(--r-md);background:var(--surface);border:1px solid var(--line);margin-bottom:8px}.lb-row.me{background:var(--chip-bg);border-color:var(--chip-line)}.timer-bar{height:6px;border-radius:var(--r-pill);background:var(--surface3);overflow:hidden;flex:1}.timer-fill{height:100%;border-radius:var(--r-pill);background:linear-gradient(90deg,var(--accent),var(--accent-light));transition:width .1s linear}.timer-fill.low{background:linear-gradient(90deg,#c1432e,#e06050)}.prog-dot{width:10px;height:10px;border-radius:50%;background:var(--surface3);transition:background .2s,transform .2s;flex-shrink:0}.prog-dot.done{background:var(--accent);transform:scale(1.15)}@keyframes wz-shake{0%,to{transform:translate(0)}16%{transform:translate(-8px)}33%{transform:translate(8px)}50%{transform:translate(-6px)}66%{transform:translate(6px)}83%{transform:translate(-2px)}}@keyframes wz-pop{0%{transform:scale(1)}35%{transform:scale(1.08)}to{transform:scale(1)}}@keyframes wz-bob{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes wz-rise{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes wz-pulse{0%,to{opacity:1}50%{opacity:.4}}@keyframes wz-sweep{0%,18%{left:0}25%,43%{left:76px}50%,68%{left:152px}75%,93%{left:228px}to{left:0}}@keyframes wz-bounce-in{0%{transform:scale(.6);opacity:0}60%{transform:scale(1.06);opacity:1}80%{transform:scale(.97)}to{transform:scale(1)}}.anim-shake{animation:wz-shake .42s ease-in-out}.anim-pop{animation:wz-pop .38s ease-out}.anim-rise{animation:wz-rise .35s ease-out both}.anim-pulse{animation:wz-pulse .75s infinite}.anim-bounce-in{animation:wz-bounce-in .4s cubic-bezier(.34,1.56,.64,1) both}.anim-bob-0{animation:wz-bob 2.6s ease-in-out infinite 0s}.anim-bob-1{animation:wz-bob 2.6s ease-in-out infinite .15s}.anim-bob-2{animation:wz-bob 2.6s ease-in-out infinite .3s}.anim-bob-3{animation:wz-bob 2.6s ease-in-out infinite .45s}.sweep-cursor{position:absolute;top:0;width:66px;height:76px;border-radius:var(--r-sm);border:2.5px solid var(--accent);box-shadow:0 0 0 4px var(--accent-glow);animation:wz-sweep 3s ease-in-out infinite;pointer-events:none;z-index:2}.label-xs{font:700 9px Space Mono,monospace;letter-spacing:2px;text-transform:uppercase;color:var(--ink2)}