:root{color-scheme:dark;--ink: #eef1e6;--muted: #b2c2bd;--gold: #e8c98a;--gold-hot: #ffd98f;--mint: #a6d8bd;--glass: rgba(14, 26, 38, .82);--glass-edge: rgba(232, 201, 138, .35);--display: "Cormorant Garamond", Georgia, serif;--sans: "Alegreya Sans", system-ui, sans-serif;--caps: "Alegreya Sans SC", var(--sans);--danger: #ff5b45}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#0f1b28;color:var(--ink);font-family:var(--sans)}canvas#game{position:fixed;inset:0;width:100vw;height:100vh;display:block;touch-action:none}button{font:600 15px var(--caps);letter-spacing:.06em;color:var(--ink);background:#142634e6;border:1px solid var(--glass-edge);border-radius:6px;padding:10px 16px;cursor:pointer}button:hover:not(:disabled){border-color:var(--gold);color:#fff}button:disabled{opacity:.45;cursor:default}button.primary{background:linear-gradient(180deg,#e9c783,#b98d45);color:#1d1406;border-color:#f7dc9f}button.primary:hover:not(:disabled){background:linear-gradient(180deg,#f5d898,#c99b52);color:#120c02}button.big{font-size:22px;padding:14px 26px;width:100%}button.link{background:none;border:none;padding:0;color:var(--gold);text-decoration:underline;font:inherit}input{font:16px var(--sans);color:var(--ink);background:#08121ae6;border:1px solid var(--glass-edge);border-radius:6px;padding:9px 11px;min-width:0}.hidden{display:none!important}select{font:16px var(--sans);color:var(--ink);background:#08121ae6;border:1px solid var(--glass-edge);border-radius:6px;padding:8px}.panel{background:var(--glass);border:1px solid var(--glass-edge);border-radius:10px;padding:18px;backdrop-filter:blur(6px);box-shadow:0 10px 40px #00000059}.row{display:flex;gap:8px;margin-top:10px}.row>*{flex:1}.status{min-height:1.2em;color:var(--muted);font-size:14px;margin:10px 0 0}.screen{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;padding:16px;z-index:5;background:radial-gradient(ellipse at center,#0a141e1a,#0a121c8c)}.brand h1{font:700 clamp(44px,8vw,86px)/.95 var(--display);margin:0;text-align:center;text-shadow:0 4px 24px rgba(0,0,0,.5)}.brand h1 span{color:var(--gold);font-style:italic}.tagline{text-align:center;font:italic 600 22px var(--display);color:var(--muted);margin:6px 0 0}.menu-panel{width:min(430px,100%)}.field{display:flex;flex-direction:column;gap:4px;margin-bottom:12px;font:14px var(--caps);color:var(--muted)}.controls-hint{font-size:13px;color:var(--muted);text-align:center;max-width:720px}.code{font-family:monospace;color:var(--gold);letter-spacing:.15em}#roster{list-style:none;padding:0;margin:12px 0}#roster li{padding:4px 0;border-bottom:1px solid rgba(255,255,255,.06)}.boot{position:fixed;inset:0;display:grid;place-items:center;font:italic 600 26px var(--display);background:#0f1b28;z-index:20}#labels{position:fixed;inset:0;pointer-events:none;z-index:2}.player-label{position:absolute;left:0;top:0;display:flex;flex-direction:column;align-items:center;font:600 13px var(--caps);text-shadow:0 1px 3px #000,0 0 8px rgba(0,0,0,.6);white-space:nowrap;will-change:transform}.player-label.self b{color:var(--gold-hot)}.player-label .inst{font:700 17px var(--sans)}.player-label .inst.hot{animation:pulse .6s ease-in-out infinite alternate}.player-label .lives{font-size:9px;letter-spacing:2px;color:#ffdca0}@keyframes pulse{0%{transform:scale(1)}to{transform:scale(1.18)}}#hud{position:fixed;inset:0;pointer-events:none;z-index:3}#hud .top{position:absolute;top:12px;left:50%;transform:translate(-50%);display:flex;gap:8px;align-items:center}.pill{background:var(--glass);border:1px solid var(--glass-edge);border-radius:999px;padding:6px 16px;font:700 22px var(--sans)}.pill.small{font-size:14px;color:var(--muted)}.pill.sudden{color:var(--danger);border-color:var(--danger)}.banner{position:absolute;top:28%;left:50%;transform:translate(-50%,-50%);font:700 clamp(40px,9vw,96px) var(--display);color:var(--gold-hot);text-shadow:0 4px 30px rgba(0,0,0,.6);pointer-events:none}#toasts{position:absolute;top:90px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:6px}.toast{background:var(--glass);border:1px solid var(--glass-edge);border-radius:8px;padding:6px 14px;font:600 16px var(--caps);animation:toast 2.6s forwards}.toast.warn{border-color:var(--danger);color:#ffd0c4}.toast.combo{border-color:var(--gold);color:var(--gold-hot);font-size:20px}@keyframes toast{0%{opacity:0;transform:translateY(-6px)}10%,80%{opacity:1;transform:none}to{opacity:0}}#feed{position:absolute;top:14px;right:14px;display:flex;flex-direction:column;align-items:flex-end;gap:4px;font-size:14px}#feed div{background:var(--glass);border-radius:6px;padding:4px 10px;animation:toast 6s forwards}#feed b{color:var(--gold-hot)}#hud .bottom{position:absolute;bottom:14px;left:14px;right:14px;display:flex;align-items:flex-end;gap:14px}.self{display:flex;flex-direction:column;align-items:center;min-width:118px;padding:10px 14px}.instability{font:700 44px/1 var(--sans)}.lives{font-size:16px;letter-spacing:5px;color:#ffd98f;margin-top:4px}.spellbar{display:flex;gap:8px;margin:0 auto}.slot{position:relative;width:62px;height:62px;border-radius:10px;background:var(--glass);border:1px solid var(--glass-edge);display:grid;place-items:center;overflow:hidden}.slot .icon{font-size:26px}.slot .key{position:absolute;top:2px;left:5px;font:700 11px var(--caps);color:var(--muted)}.slot .cd{position:absolute;inset:0;background:conic-gradient(rgba(0,0,0,.62) var(--p, 0%),transparent 0)}.slot .cd-text{position:absolute;font:700 18px var(--sans);text-shadow:0 1px 3px #000}.slot.ultimate{border-color:var(--gold)}.slot.ultimate .fill{position:absolute;left:0;bottom:0;width:100%;height:var(--u, 0%);background:linear-gradient(0deg,#ff963c8c,#ffd27840)}.slot.ultimate.ready{box-shadow:0 0 18px #ffbe5acc}.slot.dodge{width:46px;height:46px;align-self:center}.net{font-size:11px;color:var(--muted);min-width:118px;text-align:right}#edge-flash{position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 #fff0;transition:box-shadow .35s}#edge-flash.on{box-shadow:inset 0 0 120px 20px #fff0c8bf;transition:none}.results{width:min(620px,100%);text-align:center}.results h2{font:700 44px var(--display);margin:0;color:var(--gold-hot)}#scoreboard{width:100%;border-collapse:collapse;margin:14px 0;font-size:15px}#scoreboard th{font:600 12px var(--caps);color:var(--muted);text-align:left;padding:4px 6px}#scoreboard td{padding:6px;border-top:1px solid rgba(255,255,255,.06);text-align:left}#scoreboard tr.me td{color:var(--gold-hot)}.touch{position:absolute;inset:0;pointer-events:none}.stick{position:absolute;left:24px;bottom:130px;width:130px;height:130px;border-radius:50%;border:2px solid rgba(255,255,255,.25);background:#0a141e4d;pointer-events:auto;touch-action:none}.stick i{position:absolute;left:50%;top:50%;width:54px;height:54px;margin:-27px;border-radius:50%;background:#e8c98a8c}.touch-buttons{position:absolute;right:18px;bottom:120px;display:grid;grid-template-columns:repeat(3,62px);gap:10px;pointer-events:auto}.touch-buttons button{width:62px;height:62px;border-radius:50%;font-size:22px;padding:0;touch-action:none}.touch-buttons .t-primary{grid-row:span 2;height:134px;border-radius:30px}@media(max-width:700px){.slot{width:48px;height:48px}.slot .icon{font-size:20px}.instability{font-size:32px}.self{min-width:90px}.net{display:none}}.book{width:min(860px,100%);max-height:92vh;overflow:auto}.book h2{font:700 36px var(--display);margin:0 0 8px;color:var(--gold-hot)}.book h3{font:600 14px var(--caps);color:var(--muted);margin:14px 0 6px}.book-choices{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}.book-choice{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:left;padding:10px;font-family:var(--sans);letter-spacing:0}.book-choice .icon{font-size:24px}.book-choice b{font:700 15px var(--sans)}.book-choice small{font:12px var(--sans);color:var(--muted);line-height:1.25}.book-choice.chosen{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold) inset,0 0 16px #e8c98a40}.discoveries{list-style:none;padding:0;margin:0;display:grid;gap:4px}.discoveries li{color:var(--muted)}.discoveries li.found{color:var(--gold-hot)}.discoveries small{color:var(--muted);margin-left:6px}.slot.ultimate .cd-text{position:absolute;bottom:3px;font-size:12px}.look-row{align-items:center;margin:0 0 12px}.look-row button{flex:0 0 44px}.look-name{text-align:center;font:600 17px var(--display);color:var(--gold)}