:root{--vh: 1vh}html{-webkit-text-size-adjust:100%;text-size-adjust:100%;overscroll-behavior:none;background-color:var(--bg, #0b1220)}html,body{touch-action:manipulation;overflow-x:hidden;max-width:100%}body{-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;user-select:none;-webkit-user-select:none;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);box-sizing:border-box}input,textarea,[contenteditable],.selectable{user-select:text;-webkit-user-select:text;-webkit-touch-callout:default}button,[role=button],a,label,summary{touch-action:manipulation}button,input,select,textarea{font-family:inherit;font-size:inherit}input,textarea,select{font-size:max(16px,1em)}button,[role=button]{min-height:44px;min-width:44px;cursor:pointer}.board,.field,canvas,.drag-surface{touch-action:none}.control-layer{position:fixed;inset:0;z-index:30;pointer-events:none;touch-action:none}.control-layer>*{pointer-events:auto}.safe-inset{padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}:root{--ground: #141519;--frame: #0e1013;--panel: #1b1e24;--panel-edge: #2c313a;--board: #1d2026;--road: #69748a;--outline: #0f1115;--text: #eef1f5;--text-dim: #a3adbb;--gold: #ffd76e;--danger: #ff6b6b;--good: #6fe0a4;--spitter: #ffb340;--mire: #55d6c8;--lance: #c58bff;--heart: #ff5f8f;--radius: 12px;--tap: 44px;color-scheme:dark}[hidden]{display:none!important}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--ground);color:var(--text);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased}#app{min-height:100vh;min-height:calc(var(--vh, 1vh) * 100);min-height:100dvh;display:flex;flex-direction:column}.main-content,#screen{flex:1 1 auto;display:flex;flex-direction:column;min-height:0}.site-footer{flex-shrink:0;padding:14px 16px calc(14px + env(safe-area-inset-bottom));text-align:center;font-size:13px;color:var(--text-dim)}.site-footer a{color:var(--text-dim)}body.playing .site-footer{display:none!important}a{color:var(--gold)}.muted{color:var(--text-dim)}.good{color:var(--good)}.btn{min-height:var(--tap);padding:11px 18px;border-radius:var(--radius);border:1px solid var(--panel-edge);background:var(--panel);color:var(--text);font:inherit;font-weight:600;cursor:pointer;touch-action:manipulation}.btn:hover{border-color:var(--road)}.btn:focus-visible{outline:3px solid var(--gold);outline-offset:2px}.btn-primary{background:var(--spitter);border-color:var(--spitter);color:#14161a}.btn-quiet{background:transparent;border-color:transparent;color:var(--text-dim)}.icon-btn{width:var(--tap);height:var(--tap);border-radius:var(--radius);border:1px solid var(--panel-edge);background:var(--panel);color:var(--text);font:inherit;font-weight:700;cursor:pointer;touch-action:manipulation}.menu{flex:1;display:flex;flex-direction:column;gap:14px;align-items:center;justify-content:center;padding:24px 16px;text-align:center;max-width:620px;margin:0 auto;width:100%}.title{margin:0;font-size:clamp(34px,11vw,56px);letter-spacing:-.02em;background:linear-gradient(96deg,var(--spitter),var(--mire));-webkit-background-clip:text;background-clip:text;color:transparent}.title-sm{margin:0 0 4px;font-size:clamp(20px,6vw,28px)}.tagline{margin:0;color:var(--text-dim);line-height:1.5;max-width:42ch}.modes{display:grid;gap:8px;width:100%}.mode-card{display:flex;flex-direction:column;gap:2px;min-height:var(--tap);padding:10px 14px;border-radius:var(--radius);border:1px solid var(--panel-edge);background:var(--panel);color:var(--text);font:inherit;text-align:left;cursor:pointer;touch-action:manipulation}.mode-card.on{border-color:var(--spitter);box-shadow:inset 0 0 0 1px var(--spitter)}.mode-name{font-weight:700}.mode-blurb{font-size:13px;color:var(--text-dim)}.modes-compact .mode-card{padding:8px 12px}.menu-actions{display:flex;gap:10px;width:100%;flex-wrap:wrap;justify-content:center}.menu-actions .btn{flex:1 1 160px;max-width:100%}.menu-links{display:flex;gap:4px;flex-wrap:wrap;justify-content:center}.best{margin:0;color:var(--text-dim);font-size:14px}.game{height:calc(var(--vh, 1vh) * 100);display:flex;flex-direction:column;min-height:0;gap:6px;padding:calc(6px + env(safe-area-inset-top)) 8px calc(6px + env(safe-area-inset-bottom))}@supports (height: 100dvh){.game{height:100dvh}}.hud{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-shrink:0}.hud-stats{display:flex;gap:8px;flex-wrap:wrap;min-width:0}.hud-stat{padding:7px 11px;border-radius:10px;background:var(--panel);border:1px solid var(--panel-edge);font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}#s-gold{color:var(--gold)}#s-heart{color:var(--heart)}#s-heart.low{color:var(--danger);animation:pulse .9s ease-in-out infinite}.hud-buttons{display:flex;gap:6px;flex-shrink:0}.wave-bar{height:4px;border-radius:2px;background:var(--panel);overflow:hidden;flex-shrink:0}.wave-bar-fill{height:100%;width:0;background:var(--road);transition:width .2s linear}.rivals{display:flex;gap:6px;overflow-x:auto;flex-shrink:0;scrollbar-width:none;touch-action:pan-x}.rivals::-webkit-scrollbar{display:none}.rival{display:flex;align-items:center;gap:6px;min-height:var(--tap);padding:6px 10px;border-radius:10px;border:1px solid var(--panel-edge);background:var(--panel);color:var(--text);font:inherit;font-size:13px;white-space:nowrap;cursor:pointer;touch-action:manipulation}.rival.dead{opacity:.45}.rival-heart{font-variant-numeric:tabular-nums;color:var(--text-dim)}.rival-glyph,.chip-glyph{width:14px;height:14px;flex-shrink:0;background:var(--c, var(--text));display:inline-block}.glyph-disc,.chip-disc{border-radius:50%}.glyph-square{border-radius:2px}.glyph-triangle{clip-path:polygon(50% 0,100% 100%,0 100%)}.glyph-diamond{clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}.chip-ring{border-radius:50%;background:transparent;border:4px solid var(--c)}.chip-chevron{clip-path:polygon(50% 0,100% 100%,50% 70%,0 100%)}.field-wrap{flex:1 1 auto;min-height:0;position:relative;display:flex}#field{flex:1;width:100%;height:100%;display:block;touch-action:none;user-select:none;-webkit-user-select:none;border-radius:var(--radius)}.tray{display:flex;gap:8px;flex-shrink:0}.chip{flex:1 1 0;min-width:0;min-height:62px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:8px 4px;border-radius:var(--radius);border:1px solid var(--panel-edge);background:var(--panel);color:var(--text);font:inherit;font-size:12px;cursor:pointer;touch-action:none;user-select:none;-webkit-user-select:none}.chip.on{border-color:var(--c, var(--spitter));box-shadow:0 0 0 2px var(--spitter) inset}.chip.poor{opacity:.5}.chip-name{font-weight:600}.chip-cost{color:var(--gold);font-variant-numeric:tabular-nums;font-weight:700}.sheet{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;border-radius:var(--radius);border:1px solid var(--panel-edge);background:var(--panel);flex-shrink:0}.sheet-info{display:flex;flex-direction:column;font-size:13px}.sheet-actions{display:flex;gap:6px;flex-wrap:wrap}.sheet-actions .btn{padding:9px 12px;font-size:14px}.pause-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#141519db;z-index:20}.pause-card{display:flex;flex-direction:column;gap:10px;padding:22px;border-radius:var(--radius);background:var(--panel);border:1px solid var(--panel-edge);text-align:center}.pause-card h2{margin:0 0 4px}.game{position:relative}.countdown{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:15}.cd-num{font-size:clamp(56px,22vw,120px);font-weight:800;color:var(--text);text-shadow:0 4px 24px rgba(0,0,0,.7);animation:cd-pop .5s ease-out}.cd-go{color:var(--spitter)}.countdown.reduced .cd-num{animation:none}@keyframes cd-pop{0%{transform:scale(1.5);opacity:0}to{transform:scale(1);opacity:1}}@keyframes pulse{50%{opacity:.55}}.lobby-mode,.lobby-host{width:100%;max-width:560px;margin:0 auto;padding:0 16px}.lobby-mode{padding-top:18px}.lobby-mode-label{margin:0 0 8px;font-size:14px;color:var(--text-dim)}.lobby-mode-label strong{color:var(--text)}.lobby-mode-label .muted{display:block;font-size:13px}.room-entry,.lobby{width:100%;max-width:560px;margin:0 auto;padding:24px 16px;display:flex;flex-direction:column;gap:14px}.re-title,.lobby-title{margin:0;font-size:clamp(20px,6vw,28px)}.re-sub{margin:0;color:var(--text-dim)}.re-row,.lobby-row{display:flex;gap:8px;flex-wrap:wrap}.re-input,.lobby input{flex:1 1 140px;min-height:var(--tap);padding:11px 14px;border-radius:var(--radius);border:1px solid var(--panel-edge);background:var(--board);color:var(--text);font:inherit;font-size:18px;letter-spacing:.14em;text-transform:uppercase}.re-or{color:var(--text-dim);text-align:center;font-size:13px}.re-btn,.lobby button{min-height:var(--tap);padding:11px 18px;border-radius:var(--radius);border:1px solid var(--panel-edge);background:var(--panel);color:var(--text);font:inherit;font-weight:600;cursor:pointer;touch-action:manipulation}.re-btn-primary,.lobby button.primary{background:var(--spitter);border-color:var(--spitter);color:#14161a}.lobby-code{font-size:clamp(30px,12vw,48px);font-weight:800;letter-spacing:.18em;color:var(--spitter)}.lobby-players,.lobby-roster{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}.lobby-players li,.lobby-roster li{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;border-radius:var(--radius);background:var(--panel);border:1px solid var(--panel-edge)}.spinner{display:inline-block;width:16px;height:16px;border-radius:50%;border:2px solid var(--panel-edge);border-top-color:var(--spitter);animation:spin .8s linear infinite;vertical-align:-3px;margin-right:8px}@keyframes spin{to{transform:rotate(360deg)}}.lobby-searching,.connecting{color:var(--text-dim);display:flex;align-items:center;justify-content:center}@media(prefers-reduced-motion:reduce){.spinner{animation-duration:2.4s}.cd-num{animation:none}}.results{flex:1;display:flex;flex-direction:column;gap:14px;align-items:center;justify-content:center;padding:24px 12px;max-width:900px;margin:0 auto;width:100%;text-align:center}.table-wrap{width:100%;overflow-x:auto;border-radius:var(--radius);border:1px solid var(--panel-edge)}.results-table{width:100%;border-collapse:collapse;font-size:13px;white-space:nowrap}.results-table th,.results-table td{padding:9px 10px;text-align:left;border-bottom:1px solid var(--panel-edge)}.results-table th{color:var(--text-dim);font-weight:600;background:var(--panel)}.results-table tr.self td{background:#ffb34012}.results-table tr.won .r-name{font-weight:700}.r-name{display:flex;align-items:center;gap:7px}.r-road{font-variant-numeric:tabular-nums}.badge{padding:2px 7px;border-radius:999px;background:var(--spitter);color:#14161a;font-size:11px;font-weight:700}.road-note{font-size:13px;max-width:56ch;margin:0;line-height:1.5}.results-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.rematch-status{width:100%;margin:4px 0 0;font-size:13px}.modal-wrap{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:20px;background:#0a0b0eb8}.modal{width:100%;max-width:520px;max-height:84vh;overflow-y:auto;padding:22px;border-radius:var(--radius);background:var(--panel);border:1px solid var(--panel-edge)}.modal-title{margin:0 0 10px;font-size:22px}.modal-body{line-height:1.6;font-size:15px}.modal-body p{margin:0 0 12px}.modal-close{margin-top:8px;width:100%}kbd{padding:1px 5px;border-radius:4px;background:var(--board);border:1px solid var(--panel-edge);font-size:12px;margin:0 1px}.toast{position:fixed;left:50%;bottom:calc(96px + env(safe-area-inset-bottom));transform:translate(-50%,12px);z-index:40;padding:9px 16px;border-radius:999px;background:var(--panel);border:1px solid var(--panel-edge);color:var(--text);font-size:14px;font-weight:600;opacity:0;pointer-events:none;transition:opacity .18s ease,transform .18s ease;max-width:90vw;text-align:center}.toast-on{opacity:1;transform:translate(-50%)}.toast-bad{border-color:var(--danger);color:var(--danger)}@media(min-width:640px){.modes{grid-template-columns:repeat(3,1fr)}}