:root{color-scheme:dark;--bg:#0f1115;--fg:#e8eaed;--muted:#9aa0a6;--accent:#7c9cff;--card:#1a1d24;--danger:#ff6b6b;--ok:#63e6be}*{box-sizing:border-box}body,html{margin:0;height:100%;background:var(--bg);color:var(--fg);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Apple SD Gothic Neo,Noto Sans KR,sans-serif}button{font:inherit;cursor:pointer;border:1px solid #333;background:var(--card);color:var(--fg);border-radius:10px;padding:.75rem 1.1rem}button:disabled{opacity:.5;cursor:not-allowed}button.primary{background:var(--accent);color:#0b1020;border-color:transparent;font-weight:600}.home{max-width:28rem;margin:0 auto;padding:4rem 1.25rem;text-align:center}.invite-page{min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:2rem 1.25rem}.invite-card{width:100%;max-width:22rem;padding:1.75rem 1.5rem 1.5rem;border-radius:16px;background:var(--card);border:1px solid #2a3140;box-shadow:0 16px 40px rgba(0,0,0,.35)}.invite-card h1{margin:0 0 .65rem;font-size:1.45rem}.invite-card .code-line{margin:0 0 .35rem}.invite-card .code{letter-spacing:.08em}.invite-card .hint{margin:0 0 1.1rem;font-size:.88rem}.invite-submit{width:100%}.home h1{font-size:2.5rem;margin:0 0 .5rem}.hint,.tagline{color:var(--muted)}.hub-link{color:var(--accent);text-decoration:none}.hub-link:hover{text-decoration:underline}.field{display:flex;flex-direction:column;gap:.35rem;text-align:left;color:var(--muted);font-size:.85rem;margin-bottom:.75rem}.code-input,.field input{font:inherit;padding:.65rem .75rem;border-radius:10px;border:1px solid #333;background:#0c0e12;color:var(--fg)}.actions{gap:.75rem}.actions,.room{display:flex;flex-direction:column}.room{height:100dvh;min-height:0}.room-centered{text-align:center;padding-top:3rem}.room-header{display:flex;justify-content:space-between;align-items:center;flex-shrink:0;padding:.55rem 1rem;color:var(--muted);font-size:.9rem;background:#0c0e12;border-bottom:1px solid #222}.room-header-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:60%}.ok{color:var(--ok)}.bad{color:var(--danger)}.lobby{max-width:28rem;margin:2rem auto;padding:0 1.25rem}.lobby h2{margin-top:0}.player-list{list-style:none;padding:0;text-align:left}.player-list li{padding:.4rem 0;border-bottom:1px solid #222}.play{flex:1 1}.play,.play-board{min-height:0;position:relative}.play-board{width:100%;height:100%;background:#12151c}.phaser-host{position:absolute;inset:0}.phaser-host canvas{display:block}.play-hud{position:absolute;top:0;left:0;right:0;z-index:8;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:start;grid-gap:.75rem;gap:.75rem;padding:.7rem .85rem;pointer-events:none}.play-hud>*{pointer-events:auto}.scoreboard{min-width:11.5rem;max-width:16rem;border-radius:12px;background:rgba(12,16,24,.88);border:1px solid #2c3548;box-shadow:0 8px 24px rgba(0,0,0,.35);overflow:hidden}.scoreboard-head{padding:.4rem .7rem;font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#c9d4f0;background:linear-gradient(180deg,#243044,#1a2233);border-bottom:1px solid #33405a}.scoreboard-list{margin:0;padding:.25rem 0;list-style:none}.scoreboard-row{display:grid;grid-template-columns:1.4rem 1fr auto;align-items:center;grid-gap:.4rem;gap:.4rem;padding:.28rem .7rem;font-size:.86rem;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.scoreboard-row.me{background:rgba(124,156,255,.16);color:#e8eeff}.scoreboard-rank{font-weight:800;color:#f0c14b;text-align:center}.scoreboard-nick{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.scoreboard-pts{font-weight:800;color:#9ee6c5}.game-hud{text-align:right;font-size:.86rem;padding:.45rem .7rem;border-radius:12px;background:rgba(12,16,24,.88);border:1px solid #2c3548;box-shadow:0 8px 24px rgba(0,0,0,.35)}.game-hud p{margin:.15rem 0}.hud-hint{color:var(--muted);font-size:.8rem}.play-docks{position:absolute;left:0;right:0;bottom:.75rem;z-index:6;display:flex;justify-content:center;gap:.6rem;pointer-events:none}.play-docks>*{pointer-events:auto}.bell-dock,.flip-dock{font-weight:700}.bell-dock{background:#3a1218;border-color:#ff3344}.game-over{flex:1 1;display:flex;align-items:center;justify-content:center;padding:1.5rem 1.25rem 2.5rem}.game-over-card{width:min(26rem,100%);padding:1.6rem 1.4rem 1.35rem;border-radius:18px;background:var(--card);border:1px solid #2a3140;box-shadow:0 20px 56px rgba(0,0,0,.45);text-align:center}.game-over-kicker{margin:0 0 .35rem;font-size:.72rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}.game-over-card h2{margin:0;font-size:1.7rem;letter-spacing:-.03em}.game-over-winner{margin:.45rem 0 1.15rem;color:#f0c14b;font-weight:800;font-size:1.05rem}.game-over-list{margin:0 0 1.2rem;padding:0;list-style:none;text-align:left}.game-over-row{display:grid;grid-template-columns:2.1rem 1fr auto;align-items:center;grid-gap:.55rem;gap:.55rem;padding:.62rem .7rem;border-radius:12px}.game-over-row+.game-over-row{margin-top:.3rem}.game-over-row.winner{background:rgba(240,193,75,.12);box-shadow:inset 0 0 0 1px rgba(240,193,75,.28)}.game-over-row.me:not(.winner){background:rgba(124,156,255,.14)}.game-over-rank{width:2.1rem;height:2.1rem;display:grid;place-items:center;border-radius:999px;background:#141820;border:1px solid #33405a;font-weight:800;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.game-over-row.winner .game-over-rank{background:#f0c14b;border-color:#f0c14b;color:#1a1404}.game-over-nick{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:700}.game-over-me-tag{display:inline-block;margin-left:.4rem;padding:.05rem .4rem;border-radius:999px;background:#7c9cff;color:#0b1020;font-size:.68rem;font-weight:800;vertical-align:1px}.game-over-score{display:flex;flex-direction:column;align-items:flex-end;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.game-over-score strong{font-size:1.05rem}.game-over-score small{color:var(--muted);font-size:.72rem;font-weight:600}.game-over-restart{width:100%}.howto-backdrop{position:absolute;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;padding:1.25rem;background:rgba(8,10,14,.72)}.howto-card{width:min(22rem,100%);padding:1.35rem 1.4rem 1.2rem;border-radius:14px;background:var(--card);border:1px solid #2a3140;box-shadow:0 16px 48px rgba(0,0,0,.45)}.howto-card h2{margin:0 0 .85rem;font-size:1.15rem}.howto-card ol{margin:0 0 1.1rem;padding-left:1.2rem;color:var(--fg);font-size:.92rem;line-height:1.45}.howto-card li+li{margin-top:.45rem}.howto-card kbd{display:inline-block;padding:.05rem .35rem;border-radius:5px;border:1px solid #3a4150;background:#0c0e12;font-size:.8em}.howto-card .primary{width:100%}.toast{position:absolute;top:.85rem;left:50%;z-index:30;transform:translateX(-50%);max-width:min(28rem,calc(100% - 2rem));padding:.7rem 1.1rem;border-radius:12px;background:#3a1618;border:1px solid #ff6b6b;color:#ffe8e8;font-weight:700;box-shadow:0 10px 28px rgba(0,0,0,.4);animation:toast-in .2s ease-out}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,-8px)}to{opacity:1;transform:translate(-50%)}}.hud-urgent{color:#ffb4b4;font-weight:800}.turn-banner{justify-self:center;min-width:13rem;max-width:22rem;display:flex;flex-direction:column;align-items:center;gap:.12rem;padding:.55rem 1.1rem .6rem;border-radius:14px;background:rgba(12,16,24,.92);border:1px solid #2c3548;box-shadow:0 8px 24px rgba(0,0,0,.35);text-align:center}.turn-banner strong{font-size:1.05rem;letter-spacing:-.02em}.turn-banner span{color:var(--muted);font-size:.78rem}.turn-banner.mine{background:rgba(42,32,8,.96);border:3px solid #f0c14b;min-width:16rem;max-width:28rem;padding:.75rem 1.35rem .8rem;box-shadow:0 0 0 1px rgba(240,193,75,.28),0 10px 28px rgba(0,0,0,.4);animation:turn-pulse 1.4s ease-in-out infinite}.turn-banner.mine strong{color:#ffe08a;font-size:1.45rem;line-height:1.25}.turn-banner.mine span{color:#e8d7a0}@keyframes turn-pulse{0%,to{box-shadow:0 0 0 1px rgba(240,193,75,.28),0 10px 28px rgba(0,0,0,.4)}50%{box-shadow:0 0 0 4px rgba(240,193,75,.18),0 10px 28px rgba(0,0,0,.4)}}@media (max-width:720px){.play-hud{grid-template-columns:1fr 1fr}.turn-banner{grid-column:1/-1;order:-1;max-width:none;width:100%}}.race-layer{position:absolute;inset:0;z-index:5;gap:.75rem;padding:4.5rem 1.25rem 5rem;background:linear-gradient(180deg,#0c1612,#12241c 55%,#0c1612);touch-action:none;cursor:pointer}.race-layer,.race-timer{display:flex;flex-direction:column}.race-timer{align-self:center;align-items:center;min-width:8.5rem;padding:.55rem 1.4rem .65rem;border-radius:16px;background:#14261c;border:2px solid #3d7a55;box-shadow:0 10px 28px rgba(0,0,0,.35)}.race-timer.urgent{border-color:#ff5a5a;background:#2a1214}.race-timer-label{font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:#9dceb0}.race-timer.urgent .race-timer-label{color:#ffb4b4}.race-timer-num{font-size:3.2rem;font-weight:800;line-height:1;font-feature-settings:"tnum";font-variant-numeric:tabular-nums;color:#e8ffe8}.race-timer.urgent .race-timer-num{color:#ffd0d0}.race-timer-hint{margin-top:.15rem;font-size:.8rem;color:#8fb89d}.race-lanes{flex:1 1;display:flex;flex-direction:column;justify-content:center;gap:.7rem;max-width:52rem;width:100%;margin:0 auto}.race-lane{display:grid;grid-template-columns:7.2rem 1fr 3.4rem;align-items:center;grid-gap:.65rem;gap:.65rem;opacity:.72}.race-lane.me{opacity:1;padding:.35rem .45rem;margin:0 -.45rem;border-radius:14px;background:rgba(70,110,210,.18);box-shadow:0 0 0 2px #7c9cff}.race-lane.me .race-lane-name{color:#d6e6ff;font-weight:800}.race-me-tag{display:inline-block;margin-right:.35rem;padding:.05rem .4rem;border-radius:999px;background:#7c9cff;color:#0b1020;font-size:.7rem;font-weight:800;vertical-align:1px}.race-lane-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}.race-track{position:relative;height:2.15rem;border-radius:999px;background:#1a3328;border:1px solid #2f5a43;overflow:hidden}.race-lane.me .race-track{height:2.7rem;border-width:2px;border-color:#8eb0ff;background:#1a2438;box-shadow:0 0 16px rgba(124,156,255,.35)}.race-track-fill{position:absolute;inset:0 auto 0 0;background:linear-gradient(90deg,#2f8f55,#6dffa0);opacity:.45}.race-lane.me .race-track-fill{background:linear-gradient(90deg,#3a5fd0,#8eb0ff)}.race-runner{position:absolute;top:50%;transform:translate(-50%,-50%);font-size:1.35rem;filter:drop-shadow(0 1px 1px #000)}.race-lane.me .race-runner{font-size:1.85rem;filter:drop-shadow(0 0 8px rgba(180,210,255,.85))}.race-finish{position:absolute;right:.45rem;top:50%;transform:translateY(-50%);font-size:.7rem;font-weight:800;letter-spacing:.08em;color:#fff3a0}.race-lane-count{font-feature-settings:"tnum";font-variant-numeric:tabular-nums;font-weight:700;text-align:right;color:#b8e0c8}