:root{--ink:#edf5f2;--muted:#98b0b1;--line:rgba(176,220,215,.2);--panel:rgba(9,25,33,.82);--jade:#66ddc8;--jade2:#c5fff0;--gold:#f0c26d;--rose:#ea7482;--violet:#aa94f2}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#07151f;color:var(--ink);font-family:ui-sans-serif,system-ui,"Microsoft YaHei",sans-serif}button{font:inherit;color:inherit}.game{position:relative;width:100vw;height:100vh;min-height:560px;overflow:hidden;background:#07151f}.game canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none}.scanlines{position:absolute;inset:0;pointer-events:none;opacity:.12;background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(255,255,255,.035) 4px)}.hud{position:absolute;z-index:3}.top{left:28px;right:28px;top:23px;display:flex;align-items:center;justify-content:space-between;pointer-events:none}.title-block,.distance,.actions{pointer-events:auto}.title-block{display:flex;align-items:center;gap:12px}.seal{width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--jade);color:var(--jade2);font-family:serif;font-size:22px;background:rgba(6,31,38,.72)}h1{margin:0;font:400 23px/1.1 Georgia,"Songti SC",serif;letter-spacing:.16em} .title-block p{margin:4px 0 0;color:var(--muted);font-size:10px;letter-spacing:.2em}.distance{text-align:center}.distance span{display:block;color:var(--muted);font-size:10px;letter-spacing:.25em}.distance strong{font:500 30px/1.1 ui-monospace,monospace;color:var(--jade2)}.distance small{color:var(--muted);font-size:11px}.actions{display:flex;gap:8px}.square{width:38px;height:38px;border:1px solid var(--line);background:rgba(7,26,34,.78);cursor:pointer}.square:hover{border-color:var(--jade);color:var(--jade2)}.left{left:28px;top:105px;width:218px}.right{right:28px;top:105px;width:218px}.left,.right{display:grid;gap:10px}.panel,.skill{border:1px solid var(--line);background:var(--panel);backdrop-filter:blur(9px)}.panel{padding:13px 14px}.label-row,.hint-row{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:11px}.label-row b{color:var(--jade2);font-weight:500}.bar,.progress{height:5px;margin:11px 0 9px;background:rgba(150,195,190,.12);overflow:hidden}.bar i,.progress i{display:block;width:18%;height:100%;background:var(--jade);box-shadow:0 0 14px rgba(102,221,200,.65);transition:width .2s}.bar.gold i{background:var(--gold);box-shadow:0 0 14px rgba(240,194,109,.6)}.hint-row strong{color:var(--ink);font:600 13px ui-monospace,monospace}.micro{display:block;color:var(--muted);font-size:10px;letter-spacing:.2em}.sect strong,.realm strong{display:block;margin-top:9px;font:500 19px Georgia,serif;letter-spacing:.1em}.sect p,.realm p,.chain p{margin:7px 0 0;color:var(--muted);font-size:10px;line-height:1.5}.tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-top:12px}.tab{min-height:32px;border:1px solid rgba(176,220,215,.15);background:rgba(0,0,0,.16);color:var(--muted);font-size:10px;cursor:pointer}.tab.active,.tab:hover{border-color:var(--jade);color:var(--jade2);background:rgba(50,137,125,.2)}.progress{margin-top:14px}.progress i{width:0}.realm small{display:block;margin-top:5px;color:var(--jade2);font:10px ui-monospace,monospace}.chain strong{display:block;margin-top:7px;color:var(--gold);font:500 29px ui-monospace,monospace}.skill{display:flex;align-items:center;gap:10px;position:relative;min-height:64px;padding:10px 12px;text-align:left;border-color:rgba(240,194,109,.35);background:rgba(47,34,23,.82);cursor:pointer}.skill:hover,.skill.ready{border-color:var(--gold)}.skill-glyph{display:grid;place-items:center;width:33px;height:33px;border:1px solid rgba(240,194,109,.38);color:var(--gold);font-size:18px}.skill b,.skill small{display:block}.skill b{font-size:13px}.skill small{margin-top:3px;color:var(--muted);font-size:10px}.skill em{position:absolute;right:9px;top:8px;color:var(--gold);font:10px ui-monospace,monospace;font-style:normal}.toast{position:absolute;z-index:4;left:50%;top:90px;transform:translateX(-50%);padding:7px 16px;border:1px solid rgba(197,255,240,.25);background:rgba(7,27,34,.85);color:var(--jade2);font-size:10px;letter-spacing:.15em;opacity:0;transition:opacity .2s;pointer-events:none}.toast.show{opacity:1}.pause-shade,.over{position:absolute;z-index:8;inset:0;display:grid;place-items:center;background:rgba(2,11,18,.66);backdrop-filter:blur(5px)}.pause-shade{place-content:center;justify-items:center;gap:8px}.hidden{display:none!important}.pause-symbol{display:grid;place-items:center;width:48px;height:48px;border:1px solid var(--jade);color:var(--jade2);font-size:20px}.pause-shade strong{font:400 31px Georgia,serif;letter-spacing:.16em}.pause-shade span{color:var(--muted);font-size:11px}.bottom{left:28px;right:28px;bottom:21px;display:flex;justify-content:space-between;align-items:end}.controls{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:10px;letter-spacing:.1em}.controls kbd{display:grid;place-items:center;min-width:23px;height:22px;border:1px solid rgba(240,194,109,.4);background:rgba(15,26,31,.82);color:var(--gold);font-size:10px}.controls kbd:nth-of-type(3){min-width:46px}.score{text-align:right}.score>span{display:block;color:var(--muted);font-size:10px;letter-spacing:.2em}.score strong{display:block;margin-top:2px;color:var(--jade2);font:500 25px ui-monospace,monospace;letter-spacing:.12em}.score small{color:var(--muted);font-size:10px}.score small b{color:var(--gold);font-weight:500}.over-card{width:min(420px,calc(100vw - 36px));padding:32px;border:1px solid rgba(197,255,240,.28);background:rgba(8,23,31,.96);text-align:center}.over-card h2{margin:10px 0;color:var(--jade2);font:400 40px Georgia,serif;letter-spacing:.16em}.over-card p{margin:0 auto 20px;color:var(--muted);font-size:12px;line-height:1.8}.over-card p b{color:var(--ink)}.results{display:grid;grid-template-columns:repeat(3,1fr);margin:18px 0 21px;padding:13px 0;border-block:1px solid var(--line)}.results div+div{border-left:1px solid var(--line)}.results span,.results b{display:block}.results span{color:var(--muted);font-size:10px}.results b{margin-top:5px;color:var(--gold);font:600 18px ui-monospace,monospace}.primary{border:1px solid var(--jade);padding:11px 20px;background:var(--jade);color:#06262a;font-weight:700;letter-spacing:.1em;cursor:pointer}.primary:hover{background:var(--jade2)}
@media(max-width:760px){.game{min-height:500px}.top{left:14px;right:14px;top:13px}.seal{width:31px;height:31px;font-size:17px}h1{font-size:18px}.title-block p{font-size:8px}.distance strong{font-size:22px}.square{width:34px;height:34px}.left{left:14px;top:68px;width:145px}.right{right:14px;top:68px;width:145px}.panel{padding:9px}.sect strong{font-size:14px}.sect p{display:none}.tabs{margin-top:8px}.tab{min-height:28px;font-size:9px}.realm strong{font-size:14px}.realm p{display:none}.chain strong{font-size:22px}.skill{min-height:51px;padding:7px}.skill-glyph{width:26px;height:26px;font-size:14px}.skill b{font-size:11px}.skill small{font-size:9px}.bottom{left:14px;right:14px;bottom:12px}.controls span{display:none}.controls{gap:4px}.score strong{font-size:19px}.toast{top:62px;max-width:235px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}
.touch-controls{display:none;position:absolute;z-index:4;left:50%;bottom:56px;transform:translateX(-50%);grid-template-columns:repeat(5,42px);gap:6px;touch-action:manipulation}.touch-controls button{width:42px;height:42px;border:1px solid rgba(197,255,240,.28);background:rgba(8,28,35,.78);color:var(--jade2);font-size:18px;cursor:pointer}.touch-controls button:active{background:rgba(78,174,158,.42);transform:translateY(1px)}.touch-controls button[data-action="skill"]{border-color:rgba(240,194,109,.5);color:var(--gold)}
@media(max-width:760px){.touch-controls{display:grid}.bottom{bottom:10px}}
.tabs{grid-template-columns:repeat(4,1fr)}
.square.active{border-color:var(--jade);color:var(--jade2);background:rgba(50,137,125,.2)}
.left,.right{top:92px;width:176px;gap:6px}.panel{padding:8px 9px}.label-row,.hint-row{font-size:10px}.bar,.progress{height:4px;margin:6px 0}.sect strong,.realm strong{margin-top:4px;font-size:15px}.sect p,.realm p,.chain p{display:none}.tabs{margin-top:6px;gap:3px}.tab{min-height:25px;font-size:9px}.realm small{margin-top:3px;font-size:9px}.chain strong{margin-top:2px;font-size:22px}.skill{min-height:50px;padding:7px 8px;gap:7px}.skill-glyph{width:28px;height:28px;font-size:15px}.skill b{font-size:11px}.skill small{font-size:9px}
@media(max-width:760px){.left,.right{top:60px;width:132px;gap:4px}.panel{padding:6px 7px}.label-row,.hint-row{font-size:9px}.hint-row strong{font-size:11px}.bar,.progress{height:3px;margin:4px 0}.micro{font-size:8px}.sect strong,.realm strong{font-size:12px;letter-spacing:.05em}.tabs{margin-top:4px}.tab{min-height:22px;font-size:8px}.realm small{font-size:8px}.chain strong{font-size:18px}.skill{min-height:43px;padding:5px 6px}.skill-glyph{width:23px;height:23px;font-size:12px}.skill em{right:6px;top:6px;font-size:9px}}
:root{--focus-ring:2px solid var(--gold)}
button:focus-visible{outline:var(--focus-ring);outline-offset:2px}
.game{user-select:none;-webkit-user-select:none}
.daily-hud{display:block!important;max-width:190px;margin:3px auto 0;color:var(--gold)!important;font-size:9px!important;letter-spacing:0!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lobby{position:absolute;z-index:10;inset:0;display:grid;place-items:center;padding:14px;background:rgba(2,11,18,.78);backdrop-filter:blur(7px)}
.over-card{max-height:calc(100vh - 24px);overflow:auto}
.lobby-card{width:min(820px,100%);max-height:calc(100vh - 28px);overflow:auto;padding:22px;border:1px solid rgba(197,255,240,.3);background:rgba(8,23,31,.98);box-shadow:0 18px 70px rgba(0,0,0,.38)}
.lobby-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.lobby-head h2{margin:4px 0 0;color:var(--jade2);font:400 29px Georgia,serif}.wallet{color:var(--muted);font-size:12px}.wallet b{margin-left:7px;color:var(--gold);font:600 20px ui-monospace,monospace}
.lobby-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.lobby-section{min-width:0}.lobby-section h3{margin:15px 0 7px;color:var(--jade2);font-size:12px;font-weight:600}.lobby-section h3:first-child{margin-top:0}.lobby-heroes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.lobby-heroes button,.loadouts button,.upgrade-list button{min-height:38px;padding:7px 9px;border:1px solid var(--line);background:rgba(9,31,39,.86);text-align:left;cursor:pointer}.lobby-heroes button{display:flex;justify-content:space-between;align-items:center}.lobby-heroes button small,.loadouts small{color:var(--muted);font-size:9px}.lobby-heroes button.active,.loadouts button.active{border-color:var(--jade);color:var(--jade2);background:rgba(50,137,125,.19)}.lobby-heroes button.locked{color:#83999a}.loadouts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.loadouts button{font-size:10px}.loadouts small{display:block;margin-top:3px}.upgrade-list{display:grid;gap:5px}.upgrade-list button{display:flex;justify-content:space-between;align-items:center;color:var(--ink);font-size:10px}.upgrade-list button b{color:var(--gold);font:500 10px ui-monospace,monospace}.daily-detail{margin:0;color:var(--muted);font-size:11px;line-height:1.7}.daily-progress{height:5px;margin-top:8px;background:rgba(150,195,190,.14)}.daily-progress i{display:block;width:0;height:100%;background:var(--gold);transition:width .2s}.achievement-list{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin:0;padding:0;list-style:none}.achievement-list li{padding:6px 8px;border-left:2px solid rgba(176,220,215,.2);background:rgba(255,255,255,.025);color:var(--muted);font-size:9px}.achievement-list li.done{border-color:var(--gold);color:var(--gold)}.record-list{display:grid;gap:3px;max-height:118px;overflow:auto}.record-row{display:grid;grid-template-columns:22px 1fr auto;gap:6px;padding:4px 6px;background:rgba(255,255,255,.035);color:var(--muted);font-size:9px}.record-row b{color:var(--jade2);font:500 10px ui-monospace,monospace}.start-run{display:block;min-width:190px;margin:17px auto 0}.quiet-button{margin:9px 0 0 10px;padding:10px 13px;border:1px solid var(--line);background:transparent;color:var(--muted);cursor:pointer}.run-reward{min-height:16px;color:var(--gold)!important}.over-card .record-list{max-width:280px;margin:0 auto 16px;text-align:left}
@media(max-width:620px){.lobby{padding:7px}.lobby-card{padding:14px;max-height:calc(100vh - 14px)}.lobby-head h2{font-size:23px}.lobby-grid{grid-template-columns:1fr;gap:2px}.lobby-grid .lobby-section+ .lobby-section{border-top:1px solid var(--line);padding-top:4px}.lobby-section h3{margin-top:10px}.lobby-heroes{grid-template-columns:repeat(2,minmax(0,1fr))}.loadouts{grid-template-columns:repeat(3,minmax(0,1fr))}.achievement-list{grid-template-columns:1fr 1fr}.lobby .record-list{max-height:76px}}
@media(max-width:480px){.game{min-height:0;height:100dvh}.top{left:6px;right:6px;top:5px;display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:5px;align-items:center}.title-block{min-width:0;gap:4px}.seal{flex:0 0 22px;width:22px;height:22px;font-size:13px}h1{font-size:11px;letter-spacing:0;white-space:nowrap}.title-block p{display:none}.distance{display:flex;align-items:baseline;gap:2px;white-space:nowrap}.distance span{font-size:8px;letter-spacing:0}.distance strong{font-size:13px;line-height:1}.distance small{font-size:8px}.daily-hud{display:none!important}.actions{gap:2px}.square{width:22px;height:22px;padding:0;font-size:11px}.toast{top:34px;max-width:calc(100vw - 16px);padding:4px 8px;font-size:9px}.left{left:6px}.right{right:6px}}
@media(max-height:420px){.top{top:4px;left:6px;right:6px;grid-template-columns:minmax(0,1fr) auto;gap:4px}.top .distance{grid-column:2;grid-row:1}.top .actions{grid-column:1;grid-row:1;justify-self:end}.top .actions .square:nth-child(3),.top .actions .square:nth-child(4){display:none}.bottom{left:6px;right:6px;bottom:4px;align-items:center;pointer-events:none}.bottom .controls{display:none}.score{display:flex;align-items:baseline;gap:4px;padding:2px 5px;border:1px solid rgba(176,220,215,.16);background:rgba(7,26,34,.72);pointer-events:auto}.score>span,.score small{display:inline;font-size:8px;letter-spacing:0}.score strong{margin:0;font-size:13px;line-height:1}.score small b{font-size:9px}}
