*{box-sizing:border-box;margin:0;padding:0}body{color:#e8eef4;background:#0d1520;min-height:100vh;font-family:system-ui,-apple-system,sans-serif}a{color:#6db3f2}main{max-width:1320px;margin:0 auto;padding:2rem}main.play{max-width:none;padding:0}main.menu{background:radial-gradient(120% 70% at 50% -5%,#e8c46814,#0000 60%),linear-gradient(#3f6d5f0b 1px,#0000 1px) 0 0/100% 34px,linear-gradient(90deg,#3f6d5f0b 1px,#0000 1px) 0 0/34px 100%;justify-content:center;align-items:center;max-width:820px;min-height:100vh;display:flex}.menu-inner{text-align:center;width:100%;animation:.5s both room-rise}.menu-eyebrow{letter-spacing:.34em;text-transform:uppercase;color:#8a6d2f;border:1px solid #b8923f66;border-radius:999px;padding:.25rem .8rem;font-size:.72rem;display:inline-block}.menu-title{letter-spacing:-.03em;background:linear-gradient(#f6f9fc 0%,#b6c6d4 70%,#8aa0b2 100%);color:#0000;-webkit-background-clip:text;background-clip:text;margin:1rem 0 .6rem;font-size:clamp(3rem,9vw,5rem);font-weight:800;line-height:1}.menu-tagline{color:#9fb6c9;margin-bottom:2.5rem;font-size:1.05rem}.menu-modes{grid-template-columns:1fr 1fr;gap:1.25rem;display:grid}@media (max-width:600px){.menu-modes{grid-template-columns:1fr}}.mode-card{text-align:left;color:#e8eef4;background:linear-gradient(#1f2e40e6,#101a26f2);border:1px solid #33485f;border-radius:14px;flex-direction:column;gap:.45rem;padding:1.5rem 1.4rem 1.3rem;text-decoration:none;transition:transform .16s,border-color .16s,box-shadow .16s;animation:.5s both room-rise;display:flex;position:relative;box-shadow:0 18px 40px -26px #000c}.mode-card:before{content:"";background:linear-gradient(90deg,#0000,#e8c46880,#0000);border-radius:14px 14px 0 0;height:2px;position:absolute;inset:0 0 auto}.mode-card:hover{border-color:#5a8a52;transform:translateY(-4px);box-shadow:0 26px 50px -28px #000000e6,0 0 0 1px #5a8a5266}.mode-tag{text-transform:uppercase;letter-spacing:.16em;color:#c79a4a;font-size:.68rem}.mode-name{letter-spacing:-.01em;font-size:1.5rem;font-weight:700}.mode-desc{color:#9fb6c9;font-size:.92rem;line-height:1.5}.mode-go{color:#7fae5a;margin-top:.6rem;font-size:.85rem;font-weight:600;transition:transform .16s}.mode-card:hover .mode-go{transform:translate(4px)}.back-link{color:#7f93a8;letter-spacing:.02em;margin-bottom:1.5rem;font-size:.85rem;text-decoration:none;display:inline-block}.back-link:hover{color:#6db3f2}.map-preview{background:#16324a;border:1px solid #33485f;border-radius:8px;width:100%;height:auto;margin-top:1.5rem;display:block}.map-preview-error{text-align:center;color:#e8b4b4;margin-top:1.5rem;font-size:.9rem}.field{flex-direction:column;gap:.5rem;display:flex}.field>span{text-transform:uppercase;letter-spacing:.08em;color:#7f93a8;font-size:.8rem}.choices{align-items:stretch;gap:.5rem;display:flex}.choice,.speed-btn,.water-btn,.lane-btn,.gear-btn,.rail-back{font:inherit;cursor:pointer;color:#e8eef4;background:#1a2838;border:1px solid #33485f;border-radius:6px;padding:.5rem 1rem}.choice{text-align:center;flex:1}.choice.selected{background:#3f6d3a;border-color:#5a8a52}.choice:disabled{cursor:not-allowed;opacity:.35}.choices input[type=number]{font:inherit;color:#e8eef4;background:#101a26;border:1px solid #33485f;border-radius:6px;flex:1;min-width:0;padding:.5rem .75rem}.match-layout{--rail-w:12.5rem;grid-template-columns:var(--rail-w) 1fr var(--rail-w);background:#16324a;height:100dvh;display:grid}.rail{background:#0e1822;flex-direction:column;gap:.8rem;padding:1rem .85rem;display:flex;overflow-y:auto}.rail-left{border-right:1px solid #243a52}.rail-right{border-left:1px solid #243a52}.match-stage{background:#16324a;position:relative;overflow:hidden}.stage-loading{color:#9fb6c9;place-items:center;display:grid;position:absolute;inset:0}.standings{flex-direction:column;gap:.4rem;display:flex}.standing{background:#16222f;border-radius:5px;align-items:center;gap:.55rem;padding:.45rem .55rem;font-size:1.05rem;font-weight:600;display:flex}.standing.out{opacity:.4;text-decoration:line-through}.s-name{white-space:nowrap;text-overflow:ellipsis;flex:1;overflow:hidden}.s-count{font-variant-numeric:tabular-nums;color:#cdd9e4}.swatch{border-radius:3px;flex:none;width:1rem;height:1rem}.rail-group{flex-direction:column;gap:.35rem;display:flex}.rail-label{text-transform:uppercase;letter-spacing:.16em;color:#6f8499;padding-left:.1rem;font-size:.68rem}.lane-btn,.gear-btn,.rail-back{justify-content:center;align-items:center;gap:.5rem;width:100%;display:flex}.rail svg{flex:none}.btn-hint{color:#7f93a8;font-size:.85em;font-weight:500}.speeds{display:flex}.speed-btn{border-right-width:0;border-radius:0;flex:1;justify-content:center;align-items:center;padding:.45rem 0;display:flex}.speed-btn:first-child{border-top-left-radius:6px;border-bottom-left-radius:6px}.speed-btn:last-child{border-right-width:1px;border-top-right-radius:6px;border-bottom-right-radius:6px}.speed-btn.running{background:#3f6d3a;border-color:#5a8a52}.speed-btn.paused{background:#8a6d2f;border-color:#b8923f}.lane-btn{touch-action:none;-webkit-user-select:none;user-select:none}.lane-btn.armed{background:#8a6d2f;border-color:#b8923f}.settings-wrap{position:relative}.gear-btn.open{background:#33485f;border-color:#4a647e}.settings-pop{z-index:20;background:#0e1822;border:1px solid #33485f;border-radius:6px;flex-direction:column;gap:.4rem;padding:.5rem;display:flex;position:absolute;top:calc(100% + .4rem);left:0;right:0;box-shadow:0 12px 28px -14px #000000d9}.settings-pop .water-btn{text-align:center;border-radius:4px;width:100%}.rail-back{border-radius:4px;width:100%;margin-bottom:.4rem;text-decoration:none}@media (max-width:720px){.match-layout{--rail-w:7.5rem}.rail{gap:.5rem;padding:.6rem .45rem}.standing{padding:.25rem .3rem;font-size:.78rem}}.play-error{text-align:center;padding:3rem 1rem}.play-error p{color:#e8b4b4;margin-bottom:1rem}.standing.spectating{color:#e8c468;letter-spacing:.08em;text-transform:uppercase;font-size:.78rem}.conn-banner{z-index:50;text-align:center;letter-spacing:.02em;padding:.55rem 1rem;font-size:.9rem;font-weight:600;position:fixed;top:0;left:0;right:0}.conn-banner.reconnecting{color:#fff7e6;background:#8a6d2f}.conn-banner.reconnecting:after{content:"";vertical-align:-.05em;border:2px solid #fff7e666;border-top-color:#fff7e6;border-radius:50%;width:.7em;height:.7em;margin-left:.6em;animation:.7s linear infinite conn-spin;display:inline-block}.conn-banner.disconnected{color:#ffe6e6;background:#6d3a3a}@keyframes conn-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.conn-banner.reconnecting:after{animation:none}}.room{background:radial-gradient(120% 80% at 50% -10%,#e8c46812,#0000 60%),linear-gradient(#3f6d5f0d 1px,#0000 1px) 0 0/100% 32px,linear-gradient(90deg,#3f6d5f0d 1px,#0000 1px) 0 0/32px 100%;max-width:880px;margin:0 auto;padding:2.5rem 1.25rem 4rem;position:relative}.room-head{text-align:center;margin-bottom:2rem;animation:.5s both room-rise}.room-eyebrow{letter-spacing:.32em;text-transform:uppercase;color:#8a6d2f;border:1px solid #b8923f66;border-radius:999px;margin-bottom:.9rem;padding:.2rem .7rem;font-size:.72rem;display:inline-block}.room-title{letter-spacing:-.02em;background:linear-gradient(#f4f8fc,#aebfce);color:#0000;-webkit-background-clip:text;background-clip:text;font-size:2.6rem;line-height:1.05}.room-sub{color:#9fb6c9;margin-top:.6rem;font-size:1rem}.room-error{color:#e8b4b4;text-align:center;background:#6d3a3a40;border:1px solid #6d3a3a;border-radius:8px;margin-bottom:1.5rem;padding:.75rem 1rem}.room-grid{grid-template-columns:1.5fr 1fr;align-items:start;gap:1.25rem;display:grid}@media (max-width:680px){.room-grid{grid-template-columns:1fr}}.room-card{animation:.5s both room-rise;animation-delay:calc(80ms * var(--i,0) + 50ms);background:linear-gradient(#1f2e40e6,#101a26f2);border:1px solid #33485f;border-radius:14px;flex-direction:column;gap:1.25rem;padding:1.5rem;display:flex;position:relative;box-shadow:0 18px 40px -24px #000c,inset 0 1px #ffffff08}.room-card:before{content:"";background:linear-gradient(90deg,#0000,#e8c4688c,#0000);border-radius:14px 14px 0 0;height:2px;position:absolute;inset:0 0 auto}.room-legend{text-transform:uppercase;letter-spacing:.16em;color:#7f93a8;align-items:center;gap:.5rem;font-size:.74rem;display:flex}.room-legend:before{content:"";background:#5a8a52;border-radius:2px;width:6px;height:6px;box-shadow:0 0 8px #7fae5ab3}.field-row{gap:1.25rem;display:flex}.field-row .field{flex:1}.btn-primary,.btn-ghost{font:inherit;cursor:pointer;border-radius:8px;padding:.7rem 1rem;font-weight:600;transition:background .15s,border-color .15s,transform 50ms}.btn-primary{color:#f2f7ee;background:linear-gradient(#468040,#366433);border:1px solid #5a8a52;box-shadow:0 8px 20px -12px #5a8a52e6}.btn-primary:hover:not(:disabled){background:linear-gradient(#4f8e48,#3c7038)}.btn-primary:active:not(:disabled){transform:translateY(1px)}.btn-ghost{color:#cdd9e4;background:#16222f;border:1px solid #33485f}.btn-ghost:hover:not(:disabled){background:#1b2b3b;border-color:#4a647e}.btn-primary:disabled,.btn-ghost:disabled{opacity:.4;cursor:not-allowed}.room-code-input,.room-server input{font:inherit;color:#e8eef4;background:#101a26;border:1px solid #33485f;border-radius:6px;width:100%;padding:.5rem .75rem}.room-code-input::placeholder{color:#5b7184}.room-server{margin-top:.25rem}.room-server span{color:#5b7184}.room-server input{color:#9fb6c9;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.82rem}.room-hint{color:#7f93a8;margin-top:-.4rem;font-size:.85rem}.room-lobby{gap:1.5rem;max-width:520px;margin:0 auto}.room-code-block{flex-direction:column;gap:.6rem;display:flex}.room-code-row{align-items:stretch;gap:.6rem;display:flex}.room-code{letter-spacing:.22em;color:#e8c468;text-align:center;text-shadow:0 0 18px #e8c46859;background:radial-gradient(120% 140% at 50% 0,#e8c4681a,#10182099);border:1px dashed #e8c46880;border-radius:8px;flex:1;padding:.7rem .5rem;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:1.7rem;font-weight:700}.room-copy{white-space:nowrap;padding-inline:1rem}.room-copy.copied{color:#9fd48c;border-color:#5a8a52}.seat-list{flex-direction:column;gap:.55rem;list-style:none;display:flex}.seat{animation:.4s both room-rise;animation-delay:calc(60ms * var(--i,0) + .15s);background:#131f2c;border:1px solid #2a3c50;border-radius:10px;align-items:center;gap:.75rem;padding:.7rem .9rem;display:flex}.seat.you{background:linear-gradient(90deg,#3f6d3a38,#131f2c 60%);border-color:#5a8a52}.seat .swatch{border-radius:4px;width:1.05rem;height:1.05rem;box-shadow:0 0 0 1px #0006,0 0 10px -2px}.seat-name{flex:1;align-items:center;gap:.5rem;font-weight:600;display:flex}.seat-you{text-transform:uppercase;letter-spacing:.1em;color:#9fd48c;border:1px solid #5a8a52;border-radius:999px;padding:.05rem .4rem;font-size:.62rem}.seat-status{text-transform:uppercase;letter-spacing:.08em;border:1px solid;border-radius:999px;padding:.18rem .55rem;font-size:.72rem}.seat-status.on{color:#7fae5a}.seat-status.bot{color:#c79a4a}.seat-status.open{color:#5b7184}.room-actions{gap:.75rem;display:flex}.room-actions .btn-primary{flex:1}@keyframes room-rise{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.room-head,.room-card,.seat{animation:none}}.admin{max-width:1080px;margin:0 auto;padding:24px 20px 64px}.admin-header{border-bottom:1px solid #1e2c3c;margin-bottom:24px;padding-bottom:14px}.admin-title{letter-spacing:.02em;color:#e8eef4;font-size:20px;font-weight:700;text-decoration:none}.admin-title-tag{text-transform:uppercase;letter-spacing:.12em;color:#8a6d2f;vertical-align:middle;border:1px solid #4a3c1c;border-radius:4px;margin-left:8px;padding:2px 6px;font-size:11px;font-weight:600}.admin-h1{color:#e8eef4;margin:0 0 18px;font-size:22px}.admin-count{color:#93a7ba;vertical-align:middle;background:#14202e;border:1px solid #1e2c3c;border-radius:999px;margin-left:8px;padding:1px 10px;font-size:13px;display:inline-block}.admin-empty{color:#93a7ba;text-align:center;background:#101a26;border:1px solid #1e2c3c;border-radius:8px;padding:28px}.admin-table{border-collapse:collapse;width:100%;font-size:14px}.admin-table th,.admin-table td{text-align:left;border-bottom:1px solid #182636;padding:10px 12px}.admin-table th{text-transform:uppercase;letter-spacing:.08em;color:#6f8499;font-size:11px;font-weight:600}.admin-table tbody tr:hover{background:#101a26}.admin-link{color:#6db3f2;text-decoration:none}.admin-link:hover{text-decoration:underline}.admin-mono{color:#aebfcf;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.admin-mode{text-transform:uppercase;letter-spacing:.06em;border-radius:4px;padding:2px 8px;font-size:11px;font-weight:600}.admin-mode-online{color:#6db3f2;background:#11283c}.admin-mode-offline{color:#c0a060;background:#2a2210}.admin-back{color:#6db3f2;margin-bottom:16px;font-size:14px;text-decoration:none;display:inline-block}.admin-back:hover{text-decoration:underline}.admin-detail{border:1px solid #1e2c3c;border-radius:8px;margin:0 0 24px;overflow:hidden}.admin-detail-row{border-bottom:1px solid #182636;grid-template-columns:160px 1fr;display:grid}.admin-detail-row:last-child{border-bottom:none}.admin-detail dt{color:#6f8499;background:#0f1925;padding:10px 14px;font-size:13px}.admin-detail dd{margin:0;padding:10px 14px;font-size:14px}.admin-btn{color:#cfe6ff;background:#14324c;border:1px solid #1f4a6e;border-radius:6px;padding:9px 16px;font-size:14px;text-decoration:none;display:inline-block}.admin-btn:hover{background:#1a3e5e}