:root{--ink:#17243b;--paper:#fff9ec;--orange:#ff794e;--teal:#27c9cc}*{box-sizing:border-box}body{margin:0;background:#efe6ce;color:var(--ink);font-family:'Microsoft YaHei','PingFang SC',system-ui,sans-serif;overflow:hidden}button,input,select{font:inherit;color:inherit}button{cursor:pointer;border:2px solid var(--ink);border-radius:12px;background:var(--paper);padding:10px 16px;font-weight:800;box-shadow:0 3px 0 var(--ink);touch-action:manipulation}button:active{transform:translateY(2px);box-shadow:0 1px 0 var(--ink)}button:disabled{opacity:.5;cursor:default}input,select{border:2px solid #d7d4c9;border-radius:10px;background:#fffef9;padding:12px;width:100%;outline:none}input:focus{border-color:var(--teal)}label{display:block;font-weight:700;font-size:14px}label input{margin-top:8px}#game{display:block;width:100vw;height:100dvh;touch-action:none}.hidden{display:none!important}.overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:24px;background:#1b29484d;overflow:auto;z-index:20}.welcome{width:min(1080px,100%);display:grid;grid-template-columns:1.1fr 1fr;background:var(--paper);border:3px solid var(--ink);border-radius:26px;box-shadow:8px 10px 0 #17243b;overflow:hidden}.hero{background:#f2c94c;position:relative;padding:34px 32px 18px;display:flex;flex-direction:column;overflow:hidden}.edition,.eyebrow{letter-spacing:2px;font-size:11px;font-weight:900}.hero h1{font-size:64px;line-height:1.06;margin:24px 0 8px;letter-spacing:-3px;transform:rotate(-3deg);z-index:1}.hero h1>span{display:block;color:#fff9ec;text-shadow:3px 3px 0 var(--ink),-1px -1px 0 var(--ink)}.spark{color:#ff794e;margin-left:14px}.tagline{font-size:18px;font-weight:800;z-index:1}.hero-art{min-height:230px;flex:1;background:url('/assets/concept.png') 0 53%/165% auto;border:3px solid var(--ink);border-radius:18px;transform:rotate(-3deg);margin:18px -12px 22px}.hero-foot{display:flex;justify-content:space-between;font-size:12px;font-weight:800;gap:12px}.entry{padding:40px}.eyebrow{color:#b55737}h2{font-size:28px;margin:12px 0}.sub{font-size:13px;line-height:1.8;color:#667080}.primary{background:var(--orange);width:100%;margin-top:18px;padding:14px;display:flex;justify-content:center;gap:16px}.divider{text-align:center;font-size:12px;color:#81848a;margin:22px 0 12px}.join-row{display:flex;gap:10px}.join-row input{text-transform:uppercase;width:65%;letter-spacing:3px}.join-row button{flex:1;background:#a8e6dc}.rules{border-top:1px dashed #bcb7a6;margin-top:20px;padding-top:18px;font-size:13px}.rules p{margin:10px 0}.rules i{font-style:normal;font-size:11px;color:#b9603e;margin-right:10px}small{display:block;font-size:11px;color:#78808a;line-height:1.8}#error{font-size:13px;color:#bf3f38;min-height:16px}.lobby-card{background:var(--paper);padding:30px;border:3px solid var(--ink);border-radius:22px;box-shadow:7px 8px 0 var(--ink);width:min(520px,100%)}.room-code{display:flex;align-items:center;gap:12px;margin:24px 0}.room-code strong{font-size:30px;letter-spacing:3px}.room-code button{margin-left:auto;font-size:11px;padding:8px}#roster{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:20px}.person{border:2px solid #e5dece;border-radius:10px;padding:12px;display:flex;align-items:center;gap:9px;font-size:13px}.dot{width:14px;height:14px;border-radius:50%;border:2px solid var(--ink);display:inline-block}#botlabel,#durationlabel{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px}#bots,#duration{width:160px}#network{font-size:12px;margin-top:20px;line-height:1.8;overflow-wrap:anywhere}a{color:#177981}.exit{font-size:11px;padding:7px 10px;box-shadow:none}.lobby-card>.exit{margin-top:12px}#hud{position:fixed;inset:0;pointer-events:none}#hud button{pointer-events:auto}.topbar{position:absolute;top:max(12px,env(safe-area-inset-top));left:18px;right:18px;display:flex;align-items:center;gap:10px}.brand{background:var(--paper);border:2px solid var(--ink);border-radius:10px;font-size:14px;font-weight:1000;padding:8px 13px;transform:rotate(-2deg);box-shadow:2px 3px 0 var(--ink)}.brand span{color:#e65d37;margin-left:3px}#timer{font-size:24px;font-weight:900;background:var(--ink);color:white;padding:7px 18px;border-radius:12px;margin:auto}#timer.urgent{background:#c84b34}#sound,#help{font-size:11px;padding:8px;box-shadow:none}#scores{position:absolute;top:76px;left:18px;display:flex;flex-direction:column;gap:5px}.score{font-size:12px;border:1px solid #17243b55;background:#fff9eceb;border-radius:8px;padding:6px 10px;display:flex;gap:8px;align-items:center;min-width:150px}.score.me{border:2px solid var(--ink);font-weight:800}.score b{margin-left:auto}.map-box{position:absolute;right:18px;top:76px;background:var(--paper);border:2px solid var(--ink);padding:5px;border-radius:12px;box-shadow:2px 3px 0 #17243b55;text-align:center}.map-box canvas{display:block;width:120px;height:120px;border-radius:6px}.map-box span{font-size:10px;color:#667080}#toast{position:absolute;top:76px;left:50%;transform:translateX(-50%);font-size:13px;font-weight:bold;background:#fff9ecee;border-radius:12px;padding:9px 15px;max-width:36vw;text-align:center;transition:opacity .2s}#toast:empty{display:none}#status{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);border:2px solid var(--ink);background:#fff9ecf5;border-radius:12px;padding:10px 18px;font-weight:800;font-size:14px;white-space:nowrap;box-shadow:2px 3px 0 #17243b}#controls{position:absolute;left:25px;right:25px;bottom:max(30px,env(safe-area-inset-bottom));display:flex;justify-content:space-between;align-items:end}#stick{width:112px;height:112px;background:#fff9ec77;border:3px solid #17243b88;border-radius:50%;position:relative;pointer-events:auto;touch-action:none;box-shadow:inset 0 0 0 9px #fff9ec66}#knob{position:absolute;width:44px;height:44px;left:31px;top:31px;border-radius:50%;background:var(--paper);border:3px solid var(--ink);box-shadow:0 4px 0 #17243b66}.actions{display:flex;align-items:end;gap:16px}.actions button{border:3px solid var(--ink);border-radius:50%;width:72px;height:72px;font-size:27px;background:#f4d357;touch-action:none;user-select:none}.actions #fire{width:94px;height:94px;background:#ff9067;font-size:34px}.actions small{font-size:9px;color:var(--ink);white-space:nowrap}.actions #item.empty{filter:grayscale(1);opacity:.6}#keyboard{position:absolute;bottom:10px;left:25px;font-size:10px;color:#536275}dialog{max-width:460px;border:3px solid var(--ink);border-radius:20px;background:var(--paper);padding:24px;line-height:1.8;font-size:14px}dialog::backdrop{background:#17243b88}#connection{position:fixed;inset:auto 10px 10px;background:#ffdd76;padding:16px;border:2px solid var(--ink);z-index:100;text-align:center;border-radius:12px}#rankings .person{justify-content:space-between;margin:7px 0}#awards{font-size:12px;line-height:2;background:#f2e8ce;border-radius:10px;padding:12px;margin-top:14px}
@media(max-width:700px){.overlay{padding:12px;align-items:flex-start}.welcome{grid-template-columns:1fr;max-width:440px;margin:auto}.hero{padding:18px 22px}.hero h1{font-size:35px;margin:10px 0}.hero h1>span{display:inline;margin-left:8px}.hero-art{display:none}.tagline{font-size:13px;margin:9px 0}.hero-foot{font-size:10px}.edition{font-size:9px}.entry{padding:22px}.entry h2{font-size:24px}.rules{margin-top:16px;padding-top:12px}.entry .primary{margin-top:14px}.lobby-card{padding:20px;margin:auto}.topbar{left:9px;right:9px;gap:6px}.brand{font-size:10px;padding:8px}.brand span{display:block;margin:0}#timer{font-size:20px;padding:7px 12px}#sound{font-size:9px}#scores{left:9px;top:70px;gap:3px}.score{font-size:10px;min-width:117px;padding:4px 6px}.score:nth-child(n+5){display:none}.map-box{right:9px;top:70px}.map-box canvas{width:86px;height:86px}#toast{top:180px;max-width:85vw;width:max-content;font-size:11px}#status{bottom:160px;font-size:12px;padding:8px 12px;max-width:95vw;white-space:normal;text-align:center}#controls{left:15px;right:15px;bottom:30px}.actions{gap:12px}.actions button{width:61px;height:61px}.actions #fire{width:80px;height:80px}.actions small{font-size:8px}#stick{width:106px;height:106px}#knob{left:28px;top:28px}#keyboard{display:none}}
@media(max-height:500px){.welcome{margin:0 auto}.hero{display:none}.welcome{max-width:600px;grid-template-columns:1fr}.entry{padding:18px}.rules{display:none}#scores{top:62px}.score:nth-child(n+4){display:none}.map-box{top:62px}.map-box canvas{width:75px;height:75px}#toast{top:62px;max-width:40vw}#status{bottom:12px;font-size:11px}#controls{bottom:20px}#stick{width:90px;height:90px}#knob{left:20px;top:20px}.actions #fire{width:76px;height:76px}.actions button{width:60px;height:60px}.topbar{top:7px}}
.actions button{padding:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;line-height:1.15}.actions small{line-height:1.3}
@media(max-width:700px){.actions small{font-size:8px}}
.score.me{display:flex!important;order:-1}
.actions #item{background:#67dce3}.actions #item.boosting{background:#b8fcff;box-shadow:0 0 24px #32d9ff,inset 0 0 12px #fff;animation:nitro-pulse .25s infinite alternate}@keyframes nitro-pulse{to{filter:brightness(1.2)}}

#modelabel,#teamlabel{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px}#mode,#team{width:160px}#lobbyNotice{color:#a54228;font-size:12px}#lobbyNotice:empty{display:none}
#upgradeStatus{position:absolute;bottom:85px;left:50%;transform:translateX(-50%);padding:7px 12px;border-radius:10px;background:#17243be8;color:#fff5ce;font-weight:800;font-size:12px;white-space:nowrap}.report-row{font-size:12px;line-height:1.8;padding:4px 0;border-bottom:1px solid #ded7c5}#battleReport{margin:10px 0}
@media(max-width:700px){#upgradeStatus{bottom:213px;font-size:11px}}
@media(max-height:500px){#upgradeStatus{bottom:60px;font-size:11px}}

.team-swap{font-size:10px;padding:4px 6px;box-shadow:none;margin-left:auto;white-space:nowrap}#roster .person{flex-wrap:wrap}
.lobby-card{margin:auto}

@media(max-width:700px){#music,#sound{font-size:9px;padding:6px 5px}.topbar{gap:4px}}

#roundNotice{position:absolute;top:128px;left:50%;transform:translateX(-50%);padding:10px 18px;background:#fff0bbf5;border:2px solid #71552c;border-radius:18px;color:#573c24;font-weight:900;pointer-events:none;text-align:center;max-width:90vw;width:max-content;box-shadow:0 3px 0 #71552c33}#roundNotice:empty{display:none}
#result .lobby-card{width:min(620px,100%);max-height:calc(100dvh - 32px);overflow-y:auto}#result h2{font-size:25px}#winnerBanner{display:flex;align-items:center;flex-direction:column;gap:5px;background:#ffe6a5;border:2px solid #b98943;border-radius:18px;padding:16px;margin:12px 0 20px}.winner-crown{font-size:32px}.winner-name{font-size:24px;overflow-wrap:anywhere;text-align:center}.winner-area{font-size:13px}.podium-first{background:#fff0cc;border-radius:10px;padding:10px!important}.place{font-weight:900;color:#85765e;width:30px;flex-shrink:0}.rank-name{flex:1;overflow-wrap:anywhere}.rank-area{white-space:nowrap}#rankings .person{gap:10px}#awards{display:grid;grid-template-columns:1fr 1fr;gap:9px;background:none;padding:0}.award-card{display:flex;flex-direction:column;background:#f2ead9;border:1px solid #d1c4aa;border-radius:12px;padding:12px;line-height:1.5}.award-title{font-size:13px}.award-names{font-weight:800;overflow-wrap:anywhere;margin:7px 0}.award-stat{color:#776b58}.peaceful{grid-column:1/-1}.battle-details{margin:16px 0;font-size:12px}.battle-details summary{cursor:pointer;font-weight:800}#result small{display:block;margin:10px 0;color:#756b58}
@media(max-width:700px){#roundNotice{top:160px;font-size:12px;padding:8px 12px}#result .lobby-card{padding:18px;max-height:calc(100dvh - 24px)}#result h2{font-size:22px}.winner-name{font-size:21px}.award-card{padding:9px}}
@media(max-width:700px){#roundNotice{top:auto;bottom:270px}}
