: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}body.playing .site-footer{display:none!important}.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}}[hidden]{display:none!important}:root{--c-stage: #15110e;--c-panel: #241d17;--c-panel-edge: #3a2f25;--c-ink: #f2e9dd;--c-ink-dim: #a89684;--c-seat0: #e8a33d;--c-seat1: #61bdea;--c-glyph: #1b1410;--c-crown: #221a12;--c-place: #c9b48f;--c-dest: #7fe0a6;--c-lift: #d79ce8;--c-aim: #ffffff;--c-pinned: #6f6355;--c-danger: #ff7a63;--c-meter-open: #4a3f34;--ease: cubic-bezier(.2, .8, .2, 1);color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--c-stage);color:var(--c-ink);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}#app{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}.main-content{flex:1 0 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(--c-ink-dim)}.site-footer a{color:var(--c-ink-dim)}.screen{padding:18px 16px;display:flex;flex-direction:column;gap:12px;min-height:0;flex:1 0 auto}.menu{align-items:center;justify-content:center;text-align:center;gap:14px}.title{margin:0;font-size:clamp(40px,13vw,68px);letter-spacing:-.03em;font-weight:800;background:linear-gradient(100deg,var(--c-seat0),var(--c-seat1));-webkit-background-clip:text;background-clip:text;color:transparent}.tagline{margin:0;max-width:34ch;color:var(--c-ink-dim);line-height:1.45}.blurb{margin:0;max-width:40ch;min-height:2.8em;font-size:14px;color:var(--c-ink-dim);line-height:1.4}.chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.chip{min-height:44px;padding:10px 16px;border-radius:999px;border:1px solid var(--c-panel-edge);background:var(--c-panel);color:var(--c-ink);font:inherit;font-size:15px;cursor:pointer;touch-action:manipulation}.chip.small{font-size:14px;padding:9px 14px}.chip.on{border-color:var(--c-seat0);background:color-mix(in srgb,var(--c-seat0) 18%,var(--c-panel));color:var(--c-ink)}.btn{min-height:48px;padding:12px 22px;border-radius:12px;border:1px solid var(--c-panel-edge);background:var(--c-panel);color:var(--c-ink);font:inherit;font-size:16px;font-weight:600;cursor:pointer;touch-action:manipulation}.btn:disabled{opacity:.45;cursor:default}.btn.primary{background:linear-gradient(160deg,var(--c-seat0),#c9822a);border-color:transparent;color:#1b1410}.btn.link{background:none;border:none;color:var(--c-ink-dim);text-decoration:underline;min-height:44px;font-weight:500}.btn.tiny{min-height:36px;padding:6px 12px;font-size:13px;font-weight:500}.row{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;align-items:center}.game{padding:8px 10px 0;gap:8px}.hud{display:flex;align-items:center;gap:6px;min-height:44px;flex-wrap:nowrap}.sides{display:flex;gap:6px;flex:1 1 auto;min-width:0}.side{display:flex;align-items:center;gap:5px;padding:5px 7px;border-radius:10px;background:var(--c-panel);border:1px solid transparent;font-size:12px;flex:1 1 0;min-width:0;overflow:hidden}.side.active{border-color:var(--c-ink-dim)}.side .who{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:0 1 auto;min-width:0}.side .meter{flex:0 0 auto;margin-left:auto}.hud .btn.tiny{flex:0 0 auto}.pip{width:14px;height:14px;border-radius:4px;flex:0 0 auto}.meter{display:inline-flex;align-items:center;gap:2px}.meter .seg{width:5px;height:12px;border-radius:2px;background:var(--c-meter-open)}.meter b{font-size:12px;font-weight:700;margin-left:4px;color:var(--c-ink-dim)}.meter.danger b{color:var(--c-danger)}.meter.danger{animation:throb 1.1s ease-in-out infinite}@keyframes throb{50%{opacity:.55}}.stage{position:relative;flex:1 1 auto;min-height:180px;border-radius:16px;background:radial-gradient(120% 90% at 50% 20%,#1d1813,var(--c-stage));border:1px solid var(--c-panel-edge);overflow:hidden;touch-action:none}.board{position:absolute;inset:0}.layer{position:absolute;inset:0;pointer-events:none}.tile,.mark{position:absolute;top:0;left:0;will-change:transform}.tile svg,.mark svg{display:block;width:100%;height:100%;overflow:visible}.tile .face{fill:var(--fill);stroke:#00000080;stroke-width:1.5}.tile .under{opacity:.55}.tile .inner{fill:none;stroke:var(--c-glyph);stroke-width:2;stroke-dasharray:5 4;opacity:.6}.tile.matriarch .face{stroke:var(--c-crown);stroke-width:5}.tile .glyph{position:absolute;inset:0;display:grid;place-items:center;font-weight:800;font-size:calc(var(--r) * .82);line-height:1;color:var(--c-glyph);pointer-events:none}.tile .badge{position:absolute;right:calc(var(--r) * .12);top:0;min-width:calc(var(--r) * .5);height:calc(var(--r) * .5);border-radius:999px;background:var(--under);color:var(--c-glyph);font-size:calc(var(--r) * .34);font-weight:800;display:grid;place-items:center;border:2px solid var(--c-stage)}.tile.pinned .face{fill:color-mix(in srgb,var(--fill) 62%,var(--c-pinned))}.tile.pinned:after{content:"";position:absolute;inset:12%;background:repeating-linear-gradient(45deg,rgba(0,0,0,.32) 0 2px,transparent 2px 6px);pointer-events:none}.tile.selected{z-index:3;filter:drop-shadow(0 0 calc(var(--r) * .24) var(--c-dest))}.tile.landed{animation:land .38s var(--ease)}@keyframes land{0%{filter:brightness(2.1)}to{filter:none}}.mark .markshape{fill:color-mix(in srgb,var(--edge) 14%,transparent);stroke:var(--edge);stroke-width:2.5;stroke-dasharray:6 5}.mark-dest .markshape,.mark-lift .markshape{stroke-dasharray:none;stroke-width:3}.mark-aim .markshape{fill:color-mix(in srgb,var(--c-aim) 26%,transparent);stroke-width:4;stroke-dasharray:none}.mark-dest,.mark-place,.mark-lift{animation:bloom .26s var(--ease)}@keyframes bloom{0%{opacity:0}}.board.shake{animation:shake .34s ease-in-out}@keyframes shake{20%{transform:translate(-5px,3px)}45%{transform:translate(5px,-3px)}70%{transform:translate(-3px,-2px)}to{transform:none}}.prompt{margin:0;min-height:1.4em;font-size:14px;color:var(--c-ink-dim);text-align:center}.tray{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;padding-bottom:calc(6px + env(safe-area-inset-bottom))}.suptile{position:relative;min-width:52px;min-height:56px;border-radius:12px;border:2px solid transparent;background:var(--c-panel);color:var(--c-ink);font:inherit;cursor:pointer;touch-action:manipulation;display:grid;place-items:center;padding:4px}.suptile .sg{font-size:22px;font-weight:800;color:var(--c-glyph);background:var(--seat);width:34px;height:34px;border-radius:8px;display:grid;place-items:center}.suptile .sn{font-size:11px;color:var(--c-ink-dim)}.suptile.on{border-color:var(--c-place);transform:translateY(-4px)}.suptile:disabled{opacity:.35}.controls{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.controls .btn{flex:1 1 auto;max-width:260px}.countdown{position:absolute;inset:0;display:grid;place-items:center;font-size:22vmin;font-weight:800;color:var(--c-ink);text-shadow:0 6px 30px rgba(0,0,0,.7);pointer-events:none;z-index:9}.countdown.pulse{animation:pop .56s var(--ease)}@keyframes pop{0%{transform:scale(.55);opacity:0}60%{opacity:1}to{transform:scale(1.25);opacity:0}}.results{align-items:center;text-align:center}.results h2{margin:6px 0 2px;font-size:26px}.standings{width:100%;max-width:460px;border-collapse:collapse;font-size:14px}.standings th,.standings td{padding:9px 8px;border-bottom:1px solid var(--c-panel-edge);text-align:left}.standings th{color:var(--c-ink-dim);font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.05em}.standings tr.won td{color:var(--c-ink);font-weight:700}.standings .pip{display:inline-block;vertical-align:-2px;margin-right:6px}.perfect{margin:2px 0 0;font-size:13px;color:var(--c-ink-dim);max-width:44ch}.modal-back{position:fixed;inset:0;background:#080605b8;display:grid;place-items:center;padding:18px;z-index:50}.modal{background:var(--c-panel);border:1px solid var(--c-panel-edge);border-radius:16px;padding:20px;max-width:460px;width:100%;max-height:84vh;overflow-y:auto}.modal h2{margin:0 0 10px;font-size:20px}.modal p{margin:0 0 10px;line-height:1.5;font-size:15px}.modal .laws{list-style:none;padding:0;margin:0 0 12px;display:grid;gap:7px}.modal .laws li{display:grid;grid-template-columns:30px 1fr;gap:9px;align-items:start;font-size:14px;line-height:1.4}.modal .laws .lg{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;font-weight:800;color:var(--c-glyph);background:var(--c-seat0)}.modal .btn{width:100%}.lobby,.room-entry{background:var(--c-panel);border:1px solid var(--c-panel-edge);border-radius:16px;padding:18px;max-width:420px;margin:0 auto;width:100%;display:flex;flex-direction:column;gap:12px}.lobby-title,.re-title{margin:0;font-size:20px;font-weight:700}.lobby-sub,.re-sub,.re-note,.lobby-wait,.re-empty{margin:0;font-size:14px;color:var(--c-ink-dim);line-height:1.45}.lobby-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.lobby-code{font-size:30px;font-weight:800;letter-spacing:.16em;color:var(--c-seat0)}.lobby-invite{display:flex;gap:8px;flex-wrap:wrap}.lobby-link{flex:1 1 180px;min-width:0;padding:10px;border-radius:10px;border:1px solid var(--c-panel-edge);background:#191410;color:var(--c-ink-dim);font-size:13px}.lobby-qr-toggle{flex:1 1 100%}.lobby-qr{background:#fff;border-radius:12px;padding:12px;display:block;width:100%;max-width:260px;margin:0 auto}.lobby-qr svg{display:block;width:100%;height:auto}.lobby-players{list-style:none;margin:0;padding:0;display:grid;gap:6px}.lobby-player{display:flex;align-items:center;gap:8px;padding:9px 10px;border-radius:10px;background:#191410;font-size:14px}.lobby-player.is-self{outline:1px solid var(--c-panel-edge)}.lobby-dot{width:9px;height:9px;border-radius:999px;background:var(--c-meter-open);flex:0 0 auto}.lobby-dot.ready{background:var(--c-dest)}.lobby-badge{font-size:11px;padding:2px 7px;border-radius:999px;background:var(--c-panel-edge);color:var(--c-ink-dim)}.lobby-badge.ok{background:color-mix(in srgb,var(--c-dest) 26%,var(--c-panel));color:var(--c-ink)}.lobby-actions,.re-join{display:flex;gap:8px;flex-wrap:wrap}.lobby-btn,.re-go,.re-make,.re-create,.re-browse{min-height:48px;padding:12px 18px;border-radius:12px;border:1px solid var(--c-panel-edge);background:#191410;color:var(--c-ink);font:inherit;font-weight:600;cursor:pointer;flex:1 1 auto;touch-action:manipulation}.lobby-btn.primary,.re-create.primary,.re-make.primary{background:linear-gradient(160deg,var(--c-seat0),#c9822a);border-color:transparent;color:#1b1410}.lobby-btn.ghost{background:none}.re-input{flex:1 1 140px;min-width:0;min-height:48px;padding:12px;border-radius:12px;border:1px solid var(--c-panel-edge);background:#191410;color:var(--c-ink);font:inherit;font-size:20px;letter-spacing:.2em;text-transform:uppercase}.re-divider{text-align:center;color:var(--c-ink-dim);font-size:13px}.re-error{color:var(--c-danger);font-size:13px;margin:0}.lobby-flash{padding:9px 12px;border-radius:10px;background:color-mix(in srgb,var(--c-dest) 22%,var(--c-panel));font-size:14px}.lobby-searching{display:flex;align-items:center;gap:10px;color:var(--c-ink-dim);font-size:14px;justify-content:center}.spinner{width:18px;height:18px;border-radius:999px;border:2px solid var(--c-panel-edge);border-top-color:var(--c-seat0);animation:spin .72s linear infinite;flex:0 0 auto}.spinner.sm{width:13px;height:13px}@keyframes spin{to{transform:rotate(360deg)}}.lobby-modes{display:flex;gap:6px;flex-wrap:wrap}.mode-blurb,.host-pick{width:100%;margin:4px 0 0;font-size:13px;color:var(--c-ink-dim);line-height:1.4}.re-rooms{display:grid;gap:6px}.re-room{display:flex;gap:8px;align-items:center;padding:10px;border-radius:10px;background:#191410;border:1px solid var(--c-panel-edge);color:var(--c-ink);font:inherit;cursor:pointer;min-height:48px}.re-room-code{font-weight:700;letter-spacing:.12em}.re-room-meta,.re-room-state,.re-room-host,.re-room-note,.vis-meta{font-size:12px;color:var(--c-ink-dim)}.vis{display:flex;gap:6px;flex-wrap:wrap;align-items:center}.vis-chip{min-height:40px;padding:8px 14px;border-radius:999px;border:1px solid var(--c-panel-edge);background:#191410;color:var(--c-ink);font:inherit;font-size:14px;cursor:pointer}.vis-chip.on{border-color:var(--c-seat0)}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}@media(min-width:900px){.screen{padding:24px}.game{display:grid;grid-template-columns:minmax(0,1fr) 320px;grid-template-rows:auto 1fr;grid-template-areas:"hud rail" "stage rail";column-gap:20px;row-gap:10px;align-items:stretch;max-width:1180px;margin:0 auto;width:100%}.game .hud{grid-area:hud}.game .stage{grid-area:stage;min-height:460px}.game .rail{grid-area:rail;display:flex;flex-direction:column;gap:12px;justify-content:flex-start;background:var(--c-panel);border:1px solid var(--c-panel-edge);border-radius:16px;padding:14px}.game .tray{justify-content:flex-start}.results .standings{max-width:560px}}@media(orientation:landscape)and (max-height:500px){.game{display:grid;grid-template-columns:minmax(0,1fr) 200px;grid-template-areas:"hud rail" "stage rail";column-gap:12px;padding:6px 8px 0;max-width:none}.game .hud{grid-area:hud;min-height:34px}.game .stage{grid-area:stage;min-height:0}.game .rail{grid-area:rail;display:flex;flex-direction:column;gap:8px;overflow-y:auto;background:none;border:none;padding:0}.tray{gap:5px}.suptile{min-width:46px;min-height:48px}.menu{gap:8px}.title{font-size:34px}}