:root{--navy:#0b1d4f;--blue:#1d4ed8;--gold:#facc15;--ink:#f8fafc;--glass:#080f26b8;--font:"Barlow Condensed", "Arial Narrow", sans-serif}*{box-sizing:border-box}html,body{height:100%;color:var(--ink);font-family:var(--font);background:#0b1220;margin:0;overflow:hidden}canvas#c{cursor:none;width:100vw;height:100vh;display:block}.hidden{display:none!important}kbd{font-family:var(--font);letter-spacing:.04em;background:#ffffff1f;border:1px solid #ffffff40;border-radius:4px;padding:1px 7px;font-size:.85em;font-weight:700}#speed{text-align:center;pointer-events:none;position:fixed;bottom:54px;left:50%;transform:translate(-50%)}#speed b{text-shadow:0 3px 12px #00000080;font-size:56px;font-style:italic;font-weight:800;line-height:1}#speed span{opacity:.8;letter-spacing:.1em;margin-left:6px;font-size:18px;font-weight:700}#speed em{letter-spacing:.2em;color:var(--gold);opacity:0;font-size:15px;font-style:normal;font-weight:800;display:block}#speed em.on{opacity:1}#speed.flash b{animation:.35s ease-out speedpop}@keyframes speedpop{0%{color:var(--gold);transform:scale(1.35)}to{transform:scale(1)}}#popup{text-align:center;pointer-events:none;opacity:0;position:fixed;top:30%;left:50%;transform:translate(-50%,-50%)}#popup.show{animation:1.9s cubic-bezier(.2,1.4,.4,1) forwards pop}#popup-title{letter-spacing:.02em;text-shadow:0 6px 24px #0000008c;-webkit-text-stroke:3px #0b1d4f;paint-order:stroke fill;font-size:92px;font-style:italic;font-weight:900;line-height:.95}#popup-sub{-webkit-text-stroke:1px #0b1d4fe6;paint-order:stroke fill;letter-spacing:.18em;text-shadow:0 2px 10px #0009;margin-top:6px;font-size:24px;font-weight:700}#popup.save #popup-title{color:#fca5a5;font-size:64px}@keyframes pop{0%{opacity:0;transform:translate(-50%,-50%)scale(.5)}12%{opacity:1;transform:translate(-50%,-50%)scale(1.08)}22%{transform:translate(-50%,-50%)scale(1)}80%{opacity:1}to{opacity:0;transform:translate(-50%,-60%)scale(1)}}#toast{letter-spacing:.16em;background:var(--glass);opacity:0;pointer-events:none;border-radius:6px;padding:4px 14px;font-size:18px;font-weight:700;position:fixed;top:22px;left:50%;transform:translate(-50%)}#toast.show{animation:1.6s forwards toast}@keyframes toast{0%,75%{opacity:1}to{opacity:0}}#callout{pointer-events:none;opacity:0;letter-spacing:.04em;color:var(--navy);background:#fff;border-radius:10px;padding:2px 14px 4px;font-size:30px;font-style:italic;font-weight:900;position:fixed;top:0;left:0;box-shadow:0 6px 18px #00000059}#callout:after{content:"";border:9px solid #0000;border-top-color:#fff;border-bottom:0;position:absolute;bottom:-9px;left:50%;transform:translate(-50%)}#callout.show{animation:1.1s ease-out forwards callpop}@keyframes callpop{0%{opacity:0;scale:.5}12%{opacity:1;scale:1.12}22%{scale:1}75%{opacity:1}to{opacity:0}}#keys{opacity:.75;white-space:nowrap;gap:14px;font-size:14px;display:flex;position:fixed;bottom:12px;left:50%;transform:translate(-50%)}#reticle{pointer-events:none;position:fixed;top:0;left:0}#reticle svg{display:block;overflow:visible}#r-acc{fill:#ffffff0f;stroke:#ffffffe6;stroke-width:2px}#r-power{fill:none;stroke:#fff;stroke-width:4px;stroke-linecap:round;transition:opacity .1s}#reticle line{stroke:#fff;stroke-width:2px}#reticle[data-state=perfect] #r-power,#reticle[data-state=perfect] #r-acc{stroke:var(--gold)}#reticle[data-state=over] #r-power{stroke:#f87171}#reticle.dim{opacity:.35}#title{z-index:10;cursor:default;background:linear-gradient(90deg,#060a1ce0 0,#060a1c8c 34%,#060a1c00 58%),linear-gradient(#060a1cb3 0,#060a1c00 18% 78%,#060a1c8c 100%);position:fixed;inset:0}.topbar{align-items:center;gap:28px;padding:18px 32px;display:flex;position:absolute;top:0;left:0;right:0}.logo{flex:none;align-items:center;gap:2px;display:flex}.logo-word{letter-spacing:.02em;text-shadow:0 4px 22px #1d4ed88c;font-size:50px;font-style:italic;font-weight:900;line-height:1}.logo-mark{fill:none;stroke:#fff;stroke-width:3.2px;stroke-linecap:round;stroke-linejoin:round;width:62px;height:40px;margin-left:-4px}.logo-mark .mesh{stroke-width:1.4px;opacity:.75}.tabs{flex:1;justify-content:center;gap:6px;display:flex}.tabs button{font-family:var(--font);letter-spacing:.06em;color:#ffffffc7;cursor:pointer;background:0 0;border:0;border-radius:8px;padding:6px 16px;font-size:21px;font-style:italic;font-weight:800;position:relative}.tabs button:after{content:"";background:#ffffff2e;border-radius:2px;height:3px;position:absolute;bottom:-6px;left:14px;right:14px}.tabs button:hover{color:#fff}.tabs button.on{color:var(--navy);background:#fff}.tabs button.on:after{background:#fff}.tabs .dot{top:2px;right:2px}.dot{background:#ef4444;border:2px solid #fff;border-radius:50%;width:12px;height:12px;position:absolute}.level-pill{background:#080f2699;border:1px solid #ffffff38;border-radius:12px;flex-direction:column;flex:none;gap:4px;min-width:110px;padding:7px 14px;display:flex}.level-pill b{letter-spacing:.08em;font-size:18px;font-weight:800}.level-pill b span{color:var(--gold)}.lp-bar{background:#ffffff26;border-radius:3px;height:5px;overflow:hidden}.lp-bar i{background:var(--gold);height:100%;display:block}.view{display:none}#title[data-view=home] #home,#title[data-view=news] #news,#title[data-view=settings] #settings,#title[data-view=locker] #locker{display:flex}#home{flex-direction:column;justify-content:center;gap:14px;width:min(470px,100vw - 64px);position:absolute;top:112px;bottom:28px;left:32px}.card{width:100%;min-height:92px;font-family:var(--font);color:#fff;text-align:left;cursor:pointer;border:2px solid #ffffff38;border-radius:16px;align-items:center;padding:14px 54px 14px 24px;transition:transform .14s,border-color .14s,box-shadow .14s;display:flex;position:relative;overflow:hidden;box-shadow:0 10px 30px #00000059,inset 0 1px #ffffff40}.card:hover:not(:disabled){border-color:#ffffffd9;transform:translate(6px)}.card:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.card .c-text{z-index:1;flex-direction:column;gap:6px;display:flex;position:relative}.card b{letter-spacing:.01em;text-shadow:0 3px 12px #00000059;font-size:46px;font-style:italic;font-weight:900;line-height:.9}.card small{letter-spacing:.2em;opacity:.85;font-size:15px;font-weight:700}.card .c-art{fill:none;stroke:#fff6;stroke-width:4px;stroke-linecap:round;stroke-linejoin:round;width:120px;height:90px;position:absolute;top:50%;right:44px;transform:translateY(-50%)}.card .c-art .mesh{stroke-width:2px}.card .chev{font-size:46px;font-weight:600;line-height:1;position:absolute;top:50%;right:18px;transform:translateY(-54%)}.card .dot{top:10px;right:10px}.c-play{background:linear-gradient(120deg,#1e3a8a,#2563eb 55%,#3b82f6);border-color:#ffffffbf;min-height:150px}.c-play b{font-size:76px}.c-play .c-art{stroke:#ffffff73;width:170px;height:128px;right:40px}.c-vs{background:linear-gradient(120deg,#3b1f7a,#5b3bb5)}.c-team{background:linear-gradient(120deg,#065f46,#059669)}.c-party{background:linear-gradient(120deg,#9d174d,#db2777)}#lobby .panel.party{width:min(560px,100vw - 32px)}#lobby .teams{text-align:left;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0;display:grid}#lobby .pt{background:#ffffff0f;border:1px solid #ffffff1f;border-radius:10px;padding:10px 12px}#lobby .pt.home{border-top:3px solid #f5f5f5}#lobby .pt.away{border-top:3px solid #7bafd4}#lobby .pt h3{letter-spacing:.08em;margin:0 0 6px;font-size:17px}#lobby .pt ul{min-height:26px;margin:0 0 6px;padding:0;font-size:17px;font-weight:700;list-style:none}#lobby .pt li em{letter-spacing:.1em;color:var(--gold);margin-left:4px;font-size:12px;font-style:normal;font-weight:800}#lobby .pt li.cpu{opacity:.55;font-weight:600}#lobby .pt small{opacity:.7;margin-bottom:6px;font-size:14px;display:block}#lobby .pt .join-team{margin-top:0;padding:5px 12px;font-size:15px}#lobby .mode{color:var(--gold);font-weight:700}#team-score{z-index:5;text-align:right;pointer-events:none;text-shadow:0 1px 4px #0009;position:fixed;top:14px;right:16px}#team-score b{letter-spacing:.06em;font-size:26px;font-weight:800;display:block}#team-score span{letter-spacing:.1em;opacity:.9;font-size:16px;font-weight:700}.c-locker{background:linear-gradient(120deg,#7f1d1d,#c8102e)}.c-news{background:linear-gradient(120deg,#92400e,#d97706 60%,#f59e0b)}.c-settings{background:linear-gradient(120deg,#1f2937,#374151)}#play:disabled{cursor:progress;filter:saturate(.6)brightness(.85)}#home .card{flex:0 auto;min-height:0}.panel-view{background:#080d20e6;border:1px solid #ffffff24;border-radius:16px;flex-direction:column;width:min(560px,100vw - 64px);padding:22px 26px;position:absolute;top:104px;bottom:28px;left:32px;overflow-y:auto}.panel-view h2{letter-spacing:.02em;margin:0 0 8px;font-size:44px;font-style:italic;font-weight:900}.panel-view h3{letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin:18px 0 8px;font-size:16px;font-weight:800}.panel-view .back{font-family:var(--font);letter-spacing:.08em;color:var(--navy);background:var(--gold);cursor:pointer;border:0;border-radius:8px;align-self:flex-start;margin-top:20px;padding:8px 28px;font-size:22px;font-style:italic;font-weight:800}.news-entry{border-top:1px solid #ffffff1f;padding:14px 0 16px}.news-entry:first-child{border-top:0}.news-date{letter-spacing:.18em;color:var(--navy);background:var(--gold);border-radius:5px;padding:2px 10px;font-size:14px;font-weight:800;display:inline-block}.news-entry.new .news-date:after{content:"NEW";color:#fff;background:#ef4444;border-radius:4px;margin-left:8px;padding:0 6px}.news-entry h4{margin:8px 0 6px;font-size:26px;font-style:italic;font-weight:800}.news-entry ul{opacity:.92;gap:5px;margin:0;padding-left:18px;font-size:18px;line-height:1.3;display:grid}.set-note{opacity:.7;margin:8px 0 0;font-size:15px}.set-row{align-items:center;gap:14px;padding:6px 0;font-size:19px;display:flex}.set-row span{flex:1}.set-row input[type=range]{width:180px;accent-color:var(--gold)}.set-row input[type=checkbox]{width:22px;height:22px;accent-color:var(--gold)}.set-row output{text-align:right;width:44px;font-weight:700}.controls{gap:8px;margin:0;padding:0;font-size:18px;list-style:none;display:grid}.controls li{grid-template-columns:110px 1fr;align-items:baseline;gap:12px;display:grid}.controls li kbd,.controls li .keys{justify-self:start}.controls .keys{gap:4px;font-style:normal;display:flex}#nameplate{left:var(--np-x,62%);top:var(--np-y,86%);letter-spacing:.2em;background:#080d20c7;border:1px solid #fff3;border-radius:12px;align-items:center;gap:10px;padding:7px 14px 7px 22px;font-size:22px;font-weight:800;display:flex;position:absolute;transform:translate(-50%)}#title:not([data-view=home]) #nameplate{display:none}#np-name{text-align:center;outline:none;min-width:60px}#np-name[contenteditable=true]{border-bottom:2px solid var(--gold)}#np-edit{cursor:pointer;background:0 0;border:0;width:30px;height:30px;padding:4px}#np-edit svg{fill:none;stroke:#fff;stroke-width:1.8px;stroke-linejoin:round;width:100%;height:100%}button.ghost{font-family:var(--font);letter-spacing:.1em;color:var(--ink);cursor:pointer;background:0 0;border:2px solid #ffffff80;border-radius:8px;padding:10px 28px;font-size:22px;font-style:italic;font-weight:800;transition:transform .12s}#locker{text-align:left;flex-direction:column;width:min(400px,100%);padding:12px 24px 28px;position:absolute;top:96px;bottom:0;left:0;overflow-y:auto}#title[data-view=locker]{background:linear-gradient(90deg,#050814f0 0,#050814d9 380px,#05081400 640px)}#lk-back:hover{transform:translateY(-2px)scale(1.03)}.lk-title{letter-spacing:.04em;font-size:46px;font-style:italic;font-weight:900;line-height:1}.lk-level{letter-spacing:.2em;opacity:.85;margin-top:10px;font-size:18px}.lk-level b{color:var(--gold);letter-spacing:0;font-size:30px}.lk-bar{background:#ffffff1f;border-radius:4px;height:8px;margin:6px 0 4px;overflow:hidden}.lk-bar i{background:var(--gold);border-radius:4px;height:100%;display:block}.lk-xptext{opacity:.7;letter-spacing:.06em;font-size:14px}.lk-how{opacity:.6;margin:10px 0 14px;font-size:14px}#lk-list{gap:8px;display:grid}.lk-card{text-align:left;font-family:var(--font);color:var(--ink);cursor:pointer;background:#ffffff0f;border:2px solid #ffffff1a;border-radius:10px;gap:2px;padding:10px 14px;display:grid}.lk-card b{font-size:22px;font-style:italic;font-weight:800}.lk-card span{opacity:.75;font-size:14px}.lk-card em{letter-spacing:.14em;text-transform:uppercase;color:var(--gold);font-size:13px;font-style:normal;font-weight:700}.lk-card.on{border-color:var(--gold);background:#facc151a}.lk-card.locked{cursor:default;opacity:.45}.lk-card.locked em{color:var(--ink)}.lk-card:not(.locked):not(.on):hover{border-color:#fff6}.lk-actions{gap:10px;margin-top:16px;display:flex}#lk-back{font-family:var(--font);letter-spacing:.1em;color:var(--navy);background:var(--gold);cursor:pointer;border:0;border-radius:8px;padding:10px 28px;font-size:22px;font-style:italic;font-weight:800;transition:transform .12s}@media (width<=760px){#callout{pointer-events:none;opacity:0;letter-spacing:.04em;color:var(--navy);background:#fff;border-radius:10px;padding:2px 14px 4px;font-size:30px;font-style:italic;font-weight:900;position:fixed;top:0;left:0;box-shadow:0 6px 18px #00000059}#callout:after{content:"";border:9px solid #0000;border-top-color:#fff;border-bottom:0;position:absolute;bottom:-9px;left:50%;transform:translate(-50%)}#callout.show{animation:1.1s ease-out forwards callpop}@keyframes callpop{0%{opacity:0;scale:.5}12%{opacity:1;scale:1.12}22%{scale:1}75%{opacity:1}to{opacity:0}}#keys{display:none}#popup-title{font-size:64px}}#lobby{z-index:30;background:#050814d1;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}#lobby.hidden{display:none}#lobby .panel{text-align:center;background:#0e1220f5;border:1px solid #ffffff1f;border-radius:14px;width:min(460px,100vw - 32px);padding:22px 22px 18px}#lobby h2{letter-spacing:.04em;margin:0 0 6px;font-size:30px;font-weight:800}#lobby p{opacity:.85;margin:8px 0;font-size:17px}#lobby .lobby-link{gap:8px;margin:12px 0;display:flex}#lobby .lobby-link input{min-width:0;font:inherit;color:#fff;background:#ffffff0f;border:1px solid #fff3;border-radius:8px;flex:1;padding:8px 10px;font-size:15px}#lobby button{font:inherit;letter-spacing:.06em;cursor:pointer;color:#111;background:#f2c94c;border:0;border-radius:8px;padding:8px 16px;font-weight:800}#lobby button.ghost{color:#fff;background:0 0;border:1px solid #ffffff59;margin-top:8px}#lobby .lobby-wait{animation:1.4s ease-in-out infinite lobbyPulse}@keyframes lobbyPulse{50%{opacity:.45}}#mp-score{z-index:5;text-align:right;pointer-events:none;text-shadow:0 1px 4px #0009;position:fixed;top:14px;right:16px}#mp-score b{letter-spacing:.06em;font-size:24px;font-weight:800;display:block}#mp-score span{letter-spacing:.04em;opacity:.9;font-size:15px;font-weight:600}@media (width<=900px){.topbar{flex-wrap:wrap;gap:10px 16px;padding:12px 16px}.logo-word{font-size:36px}.logo-mark{width:46px;height:30px}.tabs{flex-basis:100%;order:3;justify-content:flex-start;overflow-x:auto}.tabs button{white-space:nowrap;padding:5px 10px;font-size:17px}.tabs button:after{display:none}#home,.panel-view{width:calc(100vw - 32px);top:120px;bottom:70px;left:16px}#home{justify-content:flex-start;gap:8px;overflow-y:auto}.card{padding:12px 46px 12px 18px}.card b{font-size:34px}.c-play{min-height:110px}.c-play b{font-size:54px}.card .c-art{opacity:.5;right:30px}#title{background:linear-gradient(#060a1cd9 0,#060a1c99 60%,#060a1ccc 100%)}#nameplate{font-size:18px;top:auto;bottom:16px;left:50%}#locker{top:120px}}
