@font-face{font-family:QQTCentury;src:url(../font/century.ttf) format("truetype");font-display:swap}:root{--bg: #0b1530;--bg2: #13224a;--card: #1a2d5e;--line: #2c4588;--text: #eef3ff;--muted: #9fb0d8;--accent: #ffcc33;--accent2: #39c6ff;--danger: #ff5b6b;--ok: #4ade80;--safe-t: env(safe-area-inset-top, 0px);--safe-b: env(safe-area-inset-bottom, 0px);--safe-l: env(safe-area-inset-left, 0px);--safe-r: env(safe-area-inset-right, 0px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;background:var(--bg);color:var(--text);overflow:hidden;font-family:Segoe UI,system-ui,-apple-system,PingFang SC,Microsoft YaHei,sans-serif}body{background:radial-gradient(1200px 700px at 50% -10%,#234 0%,transparent 60%),linear-gradient(180deg,#0e1c40,#070d20)}button{font:inherit;color:var(--text);background:var(--card);border:1px solid var(--line);border-radius:10px;padding:8px 14px;cursor:pointer;transition:transform .08s,background .15s}button:hover{background:#22397a}button:active{transform:scale(.97)}button.primary{background:linear-gradient(180deg,#ffd85a,#f5a623);color:#3b2500;border-color:#ffd36b;font-weight:700}button.primary:disabled,button:disabled{opacity:.45;cursor:default}button.small{padding:4px 10px;font-size:13px}button.wide{width:100%}input,select{font:inherit;color:var(--text);background:#0d1a3b;border:1px solid var(--line);border-radius:8px;padding:7px 10px;width:100%}input[type=range]{padding:0}input[type=checkbox]{width:auto}.screen{position:fixed;inset:0;display:none}.screen.show{display:flex}#loading,#menu{flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:20px}.logo{font-size:clamp(44px,9vw,92px);font-weight:900;letter-spacing:2px;color:#fff;text-shadow:0 4px 0 #1b3c99,0 8px 24px #000a}.logo span{color:var(--accent)}.logo small{font-size:.35em;color:var(--accent2);margin-left:8px;vertical-align:super}.sub{color:var(--muted);margin:-8px 0 8px}.bar{width:min(420px,80vw);height:10px;border-radius:6px;background:#0007;overflow:hidden;border:1px solid var(--line)}.bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--accent2),var(--accent));transition:width .2s}.menu-buttons{display:flex;gap:16px;flex-wrap:wrap;justify-content:center}button.big{font-size:22px;font-weight:700;padding:18px 28px;min-width:240px;border-radius:16px;display:flex;flex-direction:column;align-items:center;gap:2px}button.big small{font-size:13px;color:var(--muted);font-weight:400}.credit{color:var(--muted);font-size:12px;text-align:center;max-width:520px}.panel{flex-direction:column;padding:calc(10px + var(--safe-t)) calc(14px + var(--safe-r)) calc(10px + var(--safe-b)) calc(14px + var(--safe-l));overflow:auto}.panel header{display:flex;align-items:center;gap:12px;padding-right:52px}.panel h2{margin:6px 0;font-size:22px}.panel h3{margin:14px 0 8px;font-size:15px;color:var(--accent2)}.setup-body{display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:1100px;width:100%;margin:0 auto}@media (max-width: 760px){.setup-body{grid-template-columns:1fr}}.col{min-width:0}.field{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--muted);margin-bottom:6px}.row{display:flex;gap:8px;align-items:center;margin:8px 0}.row.between{justify-content:space-between}.hint{color:var(--muted);font-size:12px}.hero-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:8px}.hero-grid.small{grid-template-columns:repeat(auto-fill,minmax(72px,1fr))}.hero{position:relative;background:var(--card);border:2px solid transparent;border-radius:12px;padding:6px 4px 4px;text-align:center;cursor:pointer}.hero canvas{width:64px;height:66px;display:block;margin:0 auto;image-rendering:auto}.hero b{display:block;font-size:13px}.hero small{display:block;font-size:11px;color:var(--muted)}.hero.sel{border-color:var(--accent);background:#24407f}.badge{position:absolute;top:4px;right:4px;font-size:10px;padding:1px 5px;border-radius:6px;background:#f59e0b;color:#241500}.badge.ok{background:var(--ok);color:#052}.colors{display:flex;flex-wrap:wrap;gap:8px}.swatch{width:34px;height:34px;border-radius:50%;border:3px solid transparent;cursor:pointer;box-shadow:0 0 0 1px #0006 inset}.swatch.sel{border-color:#fff}.swatch.taken{opacity:.3}.sets{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}.set{background:var(--card);border:2px solid transparent;border-radius:10px;padding:8px 10px;cursor:pointer}.set b{display:block}.set small{color:var(--muted);font-size:12px}.set.sel{border-color:var(--accent);background:#24407f}.maps{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 12px}.mapchip{font-size:12px;padding:5px 9px;border-radius:16px;background:#0d1a3b;border:1px solid var(--line);cursor:pointer}.mapchip.sel{border-color:var(--accent);color:var(--accent)}.mapchip.warn:after{content:" ⚠";color:#f59e0b}.rooms{display:flex;flex-direction:column;gap:8px}.roomrow{display:flex;align-items:center;gap:10px;background:var(--card);border-radius:10px;padding:10px 12px}.roomrow .grow{flex:1;min-width:0}.roomrow b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.code{text-transform:uppercase;letter-spacing:3px;font-weight:700}.code-badge{background:#0d1a3b;border:1px dashed var(--accent);color:var(--accent);padding:4px 10px;border-radius:8px;letter-spacing:3px;font-weight:700;cursor:pointer}.slots{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.slot{background:var(--card);border-radius:12px;padding:8px;display:flex;gap:8px;align-items:center;min-height:82px}.slot canvas{width:54px;height:56px}.slot .who{flex:1;min-width:0}.slot b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.slot .st{font-size:12px;color:var(--muted)}.slot .st.ready{color:var(--ok)}.slot.empty{opacity:.45;justify-content:center}.chat{margin-top:12px}.chat-log{height:150px;overflow:auto;background:#0d1a3b;border:1px solid var(--line);border-radius:8px;padding:6px 8px;font-size:13px}.chat-log p{margin:2px 0}.chat-log .sys{color:var(--muted);font-style:italic}#game{background:#000;align-items:center;justify-content:center}#stage{position:relative;width:800px;height:600px;transform-origin:center center}#canvas{width:100%;height:100%;display:block;background:#000}.banner{position:absolute;top:calc(12px + var(--safe-t));left:50%;transform:translate(-50%);background:#000a;padding:6px 16px;border-radius:20px;font-weight:700;opacity:0;transition:opacity .4s;pointer-events:none}.banner.show{opacity:1}.netinfo{position:absolute;right:calc(60px + var(--safe-r));top:calc(10px + var(--safe-t));font-size:11px;color:#fff9;pointer-events:none}.overlay{position:absolute;inset:0;display:none;align-items:center;justify-content:center;background:#000a;z-index:5}.overlay.show{display:flex}.overlay .card{background:var(--bg2);border:1px solid var(--line);border-radius:16px;padding:22px 26px;text-align:center;max-width:90vw}.overlay h2{margin:0 0 6px;font-size:28px;color:var(--accent)}.overlay .row{justify-content:center}.rotate{position:absolute;inset:auto 0 calc(10px + var(--safe-b)) 0;text-align:center;color:var(--muted);font-size:13px;display:none;pointer-events:none}@media (orientation: portrait) and (pointer: coarse){#game.touching .rotate{display:block}}.gear{position:fixed;top:calc(8px + var(--safe-t));right:calc(8px + var(--safe-r));z-index:30;width:42px;height:42px;border-radius:50%;padding:0;font-size:24px;line-height:40px;background:#0009;border-color:#fff3}.modal{position:fixed;inset:0;background:#000b;display:none;align-items:center;justify-content:center;z-index:40;padding:12px}.modal.show{display:flex}.modal-card{background:var(--bg2);border:1px solid var(--line);border-radius:16px;width:min(560px,100%);max-height:100%;overflow:auto;padding:14px 18px}.modal-card h2{margin:2px 0 8px;display:flex;justify-content:space-between;align-items:center}.modal-card h3{margin:14px 0 6px;font-size:14px;color:var(--accent2)}.opt{display:grid;grid-template-columns:1fr 170px;gap:10px;align-items:center;padding:4px 0;font-size:14px}.opt .note{grid-column:1 / -1;color:var(--muted);font-size:11px;margin-top:-4px}.keybtn{width:100%;font-family:monospace;font-size:12px;padding:5px 6px}.keybtn.wait{border-color:var(--accent);color:var(--accent)}.ingame-actions{display:flex;gap:8px;flex-wrap:wrap}.touch{position:fixed;inset:0;pointer-events:none;display:none;z-index:25;--ts: 1;--to: .6}.touch.show{display:block}.tleft,.tright{position:absolute;bottom:calc(14px + var(--safe-b));pointer-events:none;display:flex;flex-direction:column;align-items:center;gap:10px}.tleft{left:calc(14px + var(--safe-l))}.tright{right:calc(14px + var(--safe-r))}.touch.swap .tleft{left:auto;right:calc(14px + var(--safe-r))}.touch.swap .tright{right:auto;left:calc(14px + var(--safe-l))}.tbomb{pointer-events:auto;touch-action:none;width:calc(96px * var(--ts));height:calc(96px * var(--ts));border-radius:50%;opacity:var(--to);background:radial-gradient(circle at 35% 30%,#ffe27a,#f39c12);color:#3b2500;font-weight:800;border:3px solid #fff8;font-size:calc(15px * var(--ts));display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0;user-select:none;-webkit-user-select:none}.tbomb small{font-size:.7em;font-weight:600}.tbomb.on{transform:scale(.92);filter:brightness(1.15)}.tskills{display:grid;grid-template-columns:repeat(4,auto);gap:5px;justify-content:center;pointer-events:auto}.tskills button{width:calc(32px * var(--ts));height:calc(32px * var(--ts));font-size:calc(13px * var(--ts));padding:0;border-radius:10px;opacity:var(--to);font-weight:700;touch-action:none;user-select:none;-webkit-user-select:none;background:#0008;border-color:#fff6}.tskills button.on{background:#fff4}.stick{pointer-events:auto;touch-action:none;position:relative;width:calc(150px * var(--ts));height:calc(150px * var(--ts));border-radius:50%;background:radial-gradient(circle,#ffffff14 0 38%,#0008 39% 100%);border:3px solid #fff5;opacity:var(--to);user-select:none;-webkit-user-select:none;box-shadow:0 0 0 1px #0006,inset 0 0 18px #0009}.stick:before{content:"";position:absolute;inset:8%;border-radius:50%;border:1px dashed #fff3}.stick i{position:absolute;left:50%;top:50%;width:42%;height:42%;margin:-21% 0 0 -21%;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#b9c8ee 55%,#7189c4);border:2px solid #fff9;box-shadow:0 3px 8px #000a;transition:transform .12s ease-out}.stick.on i{transition:none}.stick.on{border-color:#ffd36bcc}.item-default{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted);margin-bottom:8px;cursor:pointer}.item-slots{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}.item-slot{position:relative;aspect-ratio:1;background:#0d1a3b;border:2px solid var(--line);border-radius:10px;display:flex;align-items:center;justify-content:center;cursor:pointer;min-width:0}.item-slot.sel{border-color:var(--accent);background:#24407f}.item-slot.ro{cursor:default;opacity:.9}.item-key{position:absolute;left:3px;top:1px;font-size:10px;color:var(--muted);font-weight:700}.item-count{position:absolute;right:3px;bottom:1px;font-size:11px;font-weight:700;color:#fff;text-shadow:0 1px 2px #000}.item-slot canvas{max-width:80%;max-height:80%}.item-fallback{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:14px;text-shadow:0 1px 2px #0008;flex:none}.item-catalog{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:6px}.item-pick{display:flex;align-items:center;gap:6px;font-size:12px;padding:4px 8px;text-align:left}.item-pick.sel{border-color:var(--accent);color:var(--accent)}.item-pick .item-fallback{width:20px;height:20px;font-size:11px}.grow{flex:1;min-width:0;font-size:13px}.touch.inroom .tskills{display:none}#room{background:#0a3a7a;overflow:hidden}.room-stage{position:absolute;left:0;top:0;width:800px;height:600px;transform-origin:0 0;background:var(--bg-room) no-repeat,#1b7fd0;font-family:SimSun,Songti SC,PingFang SC,Microsoft YaHei,sans-serif;color:#fff}.room-stage>*{position:absolute}.room-stage button{font-family:inherit}.rm-crumb{left:14px;top:44px;height:17px;line-height:17px;font-size:12px;color:#fff;text-shadow:0 1px 1px #0457;white-space:nowrap}.rm-crumb b{font-weight:400}.rm-crumb .code-badge{background:none;border:0;padding:0;color:#ffe066;letter-spacing:1px;font-size:12px}.rm-titlebar{left:14px;top:62px;width:486px;height:17px;line-height:17px;font-size:12px;color:#ddd;text-align:right;padding-right:6px}.rm-field{left:11px;top:79px;width:491px;height:409px;overflow:hidden}.rm-field canvas{display:block;width:491px;height:435px;margin-top:-20px}.playbtn{position:absolute;left:50%;bottom:8px;transform:translate(-50%);font-size:15px;padding:6px 16px;background:#000a;border-color:#fff5;display:none;font-family:sans-serif}@media (pointer: coarse){.playbtn{display:block}}#room.zoomed .room-stage{background:none}#room.zoomed .room-stage>*:not(.rm-field){visibility:hidden}#room.zoomed{background:#000}.rm-chat{left:14px;top:499px;width:486px;height:68px;overflow-y:auto;font-size:12px;line-height:16px;color:#fff;padding:2px 4px}.rm-chat p{margin:0}.rm-chat .sys{color:#3cff6a}.rm-chat b{color:#ffe066;font-weight:400}.rm-chanl{left:34px;top:572px;width:76px;height:20px;line-height:20px;font-size:13px;text-align:center;color:#fff}.rm-chatin{left:113px;top:572px;width:281px;height:20px;padding:0 6px;border:0;border-radius:0;background:transparent;color:#fff;font-size:13px}.rm-send{left:397px;top:571px;width:108px;height:22px;padding:0;border:0;border-radius:0 10px 10px 0;background:transparent;color:#fff;font-size:13px}.rm-send:hover{background:#fff2}.rm-menu{left:524px;top:57px;width:99px;display:flex;flex-direction:column;gap:6px}.rm-blue{padding:0;height:34px;font-size:15px;font-weight:700;border-radius:8px;color:#fff;border:2px solid #9fe3ff;background:linear-gradient(180deg,#4cc4ff,#1576e0 55%,#0d5fc4);text-shadow:0 1px 2px #003a80;box-shadow:0 2px 3px #0004}.rm-blue:hover{background:linear-gradient(180deg,#74d4ff,#2a8af0 55%,#146ad4)}.rm-blue.dim{filter:saturate(.5)}.rm-mapcard{left:638px;top:53px;width:148px;height:138px;border-radius:6px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;background:radial-gradient(circle at 50% 35%,#9ad8ff,#2a77c9 70%,#1a4f99);color:#fff;text-shadow:0 2px 2px #0007;padding:6px}.rm-mapcard b{font-size:22px;color:#ffe066;-webkit-text-stroke:1px #a04a00}.rm-mapcard span{font-size:14px}.rm-mapcard small{font-size:11px;opacity:.85;font-family:sans-serif}.rm-heroes{left:548px;top:215px;width:218px;height:108px;display:grid;grid-template-columns:repeat(4,1fr);gap:2px}.rm-hero{position:relative;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:4px;border:2px solid transparent;background:#ffffff10}.rm-hero.sel{border-color:#ffd23f;background:#ffd23f33}.rm-hero.partial canvas{filter:saturate(.75)}.rm-hero:hover{background:#ffffff25}.rm-arrow{top:214px;width:20px;height:107px;padding:0;border:0;border-radius:4px;background:transparent}.rm-arrow.l{left:521px}.rm-arrow.r{left:771px}.rm-arrow:hover:not(:disabled){background:#fff4}.rm-arrow:disabled{opacity:1;cursor:default}.rm-colors{left:527px;top:325px;width:259px;height:33px;display:grid;grid-template-columns:repeat(8,1fr)}.rm-color{padding:0;border:0;border-radius:0;background:transparent;position:relative}.rm-color:hover{background:#fff3}.rm-color.sel:after{content:"✔";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:20px;color:#fff;text-shadow:0 0 3px #000,0 0 2px #000}.rm-color.taken{background:#0008;cursor:not-allowed}.rm-bag{left:529px;top:377px;width:60px;height:58px;padding:0;border-radius:8px;border:2px solid #fff;color:#fff;font-size:17px;font-weight:700;line-height:1.05;background:linear-gradient(180deg,#ff9db0,#ff5b7c);text-shadow:0 1px 0 #c2183f,0 -1px 0 #c2183f,1px 0 0 #c2183f,-1px 0 0 #c2183f;box-shadow:0 2px 3px #0004}.rm-bag:hover{filter:brightness(1.08)}.rm-slot{position:absolute;width:56px;height:47px;padding:0;border:0;background:transparent;border-radius:4px;display:flex;align-items:center;justify-content:center}.rm-slot:hover{background:#fff5}.rm-slot .n{position:absolute;right:3px;bottom:1px;font-size:11px;font-weight:700;color:#fff;text-shadow:0 0 2px #000,0 0 2px #000;font-family:sans-serif}.rm-slot .item-fallback{width:28px;height:28px}.rm-start{left:560px;top:528px;width:114px;height:52px;padding:0;border:0;border-radius:0;background:var(--btn-start-0) no-repeat}.rm-start:hover{background-image:var(--btn-start-2)}.rm-start:active{background-image:var(--btn-start-3);transform:none}.rm-start:disabled{background-image:var(--btn-start-1);opacity:1}.rm-ready{left:560px;top:528px;width:114px;height:52px;padding:0;border-radius:10px;border:2px solid #ffe9a0;font-size:22px;font-weight:700;color:#fff;background:linear-gradient(180deg,#ffd65a,#f08a1c 60%,#d0600c);text-shadow:0 1px 0 #8a3c00,0 -1px 0 #8a3c00,1px 0 0 #8a3c00,-1px 0 0 #8a3c00}.rm-ready.on{background:linear-gradient(180deg,#c8c8c8,#8a8a8a);border-color:#eee;text-shadow:0 1px 1px #333;font-size:18px}.rm-leave{left:712px;top:530px;width:52px;height:47px;padding:0;border:0;border-radius:0;background:var(--btn-leave-0) no-repeat}.rm-leave:hover{background-image:var(--btn-leave-1)}#room .modal-card{font-family:system-ui,PingFang SC,Microsoft YaHei,sans-serif}