:root{--bg:#13201a;--bg2:#0d1612;--wood:#3b2a1a;--wood-dark:#24180e;--wood-light:#c79a62;--parch:#f6ecd2;--muted:#b9a888;--gold:#f0c23a;--green:#4caf50;--green-dark:#2e7d32;--red:#e0463a;--blue:#4a90e2;--team0:#6ab4ff;--team1:#ff6b6b;--px:"Press Start 2P", monospace;--body:"VT323", monospace}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--parch);font-family:var(--body);min-height:100%;image-rendering:pixelated;margin:0;padding:0;font-size:20px}body{background-color:var(--bg);background-image:linear-gradient(45deg,#ffffff05 25%,#0000 25% 75%,#ffffff05 75%),linear-gradient(45deg,#ffffff05 25%,#0000 25% 75%,#ffffff05 75%);background-position:0 0,8px 8px;background-size:16px 16px}canvas.pixel{image-rendering:pixelated;display:block}h1,h2,h3{font-family:var(--px);letter-spacing:1px;margin:0 0 12px;font-weight:400}h2{color:var(--gold);font-size:12px}h3{font-size:10px}.panel{background:var(--wood);border:4px solid var(--wood-dark);box-shadow:inset 0 0 0 2px var(--wood-light), inset 0 0 0 4px var(--wood-dark), 4px 4px 0 #00000073;padding:16px}.inset{background:var(--wood-dark);padding:8px;box-shadow:inset 2px 2px #00000080}.btn{font-family:var(--px);color:#fff;background:var(--green);cursor:pointer;box-shadow:inset -3px -3px 0 var(--green-dark), inset 3px 3px 0 #ffffff40, 0 0 0 2px #120c18;white-space:nowrap;border:0;padding:10px 14px;font-size:10px}.btn:hover:not(:disabled){filter:brightness(1.12)}.btn:active:not(:disabled){box-shadow:inset 3px 3px 0 var(--green-dark), 0 0 0 2px #120c18;transform:translateY(2px)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.red{background:var(--red);box-shadow:inset -3px -3px #8f2219,inset 3px 3px #ffffff40,0 0 0 2px #120c18}.btn.gold{background:var(--gold);color:#2a1d12;box-shadow:inset -3px -3px #a87b10,inset 3px 3px #ffffff59,0 0 0 2px #120c18}.btn.ghost{background:var(--wood-dark);box-shadow:inset -3px -3px #120c18,inset 3px 3px #ffffff1a,0 0 0 2px #120c18}.btn.small{padding:7px 9px;font-size:8px}input,select{font-family:var(--body);color:var(--parch);background:var(--wood-dark);box-shadow:inset 2px 2px 0 #000, 0 0 0 2px var(--wood-light);border:0;outline:none;min-width:0;padding:6px 8px;font-size:20px}input:focus,select:focus{box-shadow:inset 2px 2px 0 #000, 0 0 0 2px var(--gold)}.bar{background:#120c18;height:12px;position:relative;box-shadow:0 0 0 2px #120c18}.bar>span{background:var(--gold);height:100%;display:block;box-shadow:inset 0 -3px #00000040,inset 0 3px #ffffff40}.muted{color:var(--muted)}.px{font-family:var(--px)}.row{align-items:center;gap:12px;display:flex}.col{flex-direction:column;gap:12px;display:flex}.spacer{flex:1}.center-screen{text-align:center;place-items:center;min-height:100vh;padding:16px;display:grid}.logo{font-family:var(--px);color:var(--gold);text-shadow:3px 3px #5e3c1c,6px 6px #120c18;letter-spacing:2px;margin:0;font-size:22px}.lobby{flex-direction:column;gap:16px;max-width:1240px;margin:0 auto;padding:16px;display:flex}.lobby-grid{grid-template-columns:minmax(0,1fr) 340px;align-items:start;gap:16px;display:grid}@media (max-width:900px){.lobby-grid{grid-template-columns:minmax(0,1fr)}}.topbar{flex-wrap:wrap;align-items:center;gap:16px;display:flex}.room-item{background:var(--wood-dark);align-items:center;gap:12px;margin-bottom:8px;padding:10px 12px;display:flex;box-shadow:inset 0 -2px #0006}.tag{font-family:var(--px);color:var(--parch);background:#120c18;padding:4px 6px;font-size:8px}.tag.playing{color:var(--red)}.tag.waiting{color:#8dff8a}.slots{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;display:grid}.slot{background:var(--wood-dark);flex-direction:column;align-items:center;gap:6px;min-height:150px;padding:10px;display:flex;position:relative;box-shadow:inset 0 0 0 2px #0000004d}.slot.empty{opacity:.4;justify-content:center}.slot.team0{box-shadow:inset 0 0 0 3px var(--team0)}.slot.team1{box-shadow:inset 0 0 0 3px var(--team1)}.slot .name{font-family:var(--px);text-align:center;word-break:break-all;font-size:8px}.slot .crown{font-family:var(--px);color:var(--gold);font-size:8px;position:absolute;top:6px;left:8px}.slot .ready{font-family:var(--px);color:#8dff8a;font-size:8px}.archers{grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;display:grid}.archer-card{background:var(--wood-dark);cursor:pointer;color:inherit;text-align:left;font-family:var(--body);border:0;flex-direction:column;gap:6px;padding:10px;font-size:18px;display:flex;box-shadow:inset 0 0 0 2px #00000059}.archer-card:hover{box-shadow:inset 0 0 0 2px var(--wood-light)}.archer-card.selected{box-shadow:inset 0 0 0 3px var(--gold);background:#3a2a14}.archer-card .title{font-family:var(--px);color:var(--gold);font-size:8px;line-height:1.3}.stat{grid-template-columns:74px 1fr;align-items:center;gap:6px;font-size:16px;display:grid}.pips{gap:2px;display:flex}.pips i{background:#120c18;width:10px;height:8px}.pips i.on{background:var(--gold)}.chat{flex-direction:column;gap:8px;display:flex}.chat-log{background:var(--wood-dark);height:180px;padding:8px;font-size:18px;line-height:1.1;overflow-y:auto}.chat-log .sys{color:var(--muted);font-style:italic}.chat-log b{color:var(--gold);font-weight:400}table.rank{border-collapse:collapse;width:100%;font-size:18px}table.rank td{border-bottom:2px solid var(--wood-dark);vertical-align:middle;padding:4px}.battle{background:#0a0d14;flex-direction:column;height:100vh;display:flex;overflow:hidden}.battle-top{background:var(--wood-dark);border-bottom:4px solid #120c18;gap:8px;padding:6px 8px;display:flex;overflow-x:auto}.pcard{background:var(--wood);align-items:center;gap:6px;min-width:170px;padding:4px 8px;font-size:16px;display:flex;box-shadow:inset 0 0 0 2px #0000004d}.pcard.active{box-shadow:inset 0 0 0 2px var(--gold)}.pcard.dead{opacity:.4}.pcard .pname{font-family:var(--px);font-size:8px}.game-wrap{flex:1;min-height:0;position:relative}.game-wrap>.phaser-holder{width:100%;height:100%}.turn-banner{font-family:var(--px);color:var(--gold);pointer-events:none;text-align:center;background:#120c18cc;padding:8px 14px;font-size:12px;position:absolute;top:12px;left:50%;transform:translate(-50%)}.hud{background:var(--wood);box-shadow:inset 0 2px 0 var(--wood-light);border-top:4px solid #120c18;grid-template-columns:220px 1fr 300px;align-items:center;gap:12px;padding:10px 12px;display:grid}@media (max-width:800px){.hud{grid-template-columns:1fr}}.power{background:#120c18;height:26px;position:relative;box-shadow:0 0 0 2px #000}.power .fill{background:linear-gradient(90deg,#4caf50,#f0c23a 60%,#e0463a);position:absolute;inset:3px auto 3px 3px}.power .last{background:#fff;width:3px;position:absolute;top:-4px;bottom:-4px}.power .ticks{pointer-events:none;background-image:linear-gradient(90deg,#0009 2px,#0000 2px);background-size:10% 100%;position:absolute;inset:0}.dial{width:84px;height:84px}.wind{font-family:var(--px);text-align:center;font-size:10px}.timer{font-family:var(--px);color:var(--gold);font-size:22px}.timer.low{color:var(--red)}.keys{color:var(--muted);font-size:15px}.modal-bg{z-index:50;background:#000000b3;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.modal{width:100%;max-width:760px;max-height:90vh;overflow:auto}.result-row{background:var(--wood-dark);grid-template-columns:40px 1fr 70px 50px 90px 120px;align-items:center;gap:8px;margin-bottom:6px;padding:6px 8px;font-size:18px;display:grid}.result-row.win{box-shadow:inset 4px 0 0 var(--gold)}.levelup{font-family:var(--px);color:#8dff8a;font-size:8px}.archer-sprite{image-rendering:pixelated;background-position:0 0;background-repeat:no-repeat;flex:none;display:inline-block}.archer-sprite.anim-idle{animation:1s steps(2,end) infinite sprite-idle}.archer-sprite.anim-walk{animation:.4s steps(4,end) infinite sprite-walk}@keyframes sprite-idle{0%{background-position-x:0}to{background-position-x:calc(var(--s) * -2)}}@keyframes sprite-walk{0%{background-position-x:calc(var(--s) * -2)}to{background-position-x:calc(var(--s) * -6)}}.steps{align-items:center;gap:3px}.steps-num{font-family:var(--px);color:#9ff3ff;font-size:18px}.steps-num.low{color:var(--red)}.battle-chat{z-index:5;flex-direction:column;gap:4px;width:min(360px,100% - 20px);display:flex;position:absolute;bottom:10px;left:10px}.battle-chat .log{pointer-events:none;flex-direction:column;gap:2px;max-height:170px;font-size:19px;line-height:1.05;display:flex;overflow-y:auto}.battle-chat.open .log{pointer-events:auto;background:#120c188c;padding:4px 6px}.battle-chat .msg{text-shadow:2px 2px #120c18,-1px -1px #120c18;transition:opacity .6s}.battle-chat .msg.old{opacity:0}.battle-chat.open .msg.old{opacity:.75}.battle-chat .msg b{color:var(--gold);font-weight:400}.battle-chat .msg.sys{color:var(--muted);font-style:italic}.battle-chat input{opacity:.55;background:#120c18bf;width:100%;padding:4px 8px;font-size:18px}.battle-chat.open input{opacity:1}.btn.item{align-items:center;gap:6px;display:inline-flex}.menu-tabs{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;display:grid}.menu-tab{font-family:var(--body);color:var(--parch);background:var(--wood-dark);cursor:pointer;text-align:left;border:0;flex-direction:column;gap:4px;padding:12px 10px 10px;display:flex;box-shadow:inset 0 0 0 2px #00000059}.menu-tab .px{font-size:10px}.menu-tab .muted{font-size:16px}.menu-tab:hover{box-shadow:inset 0 0 0 2px var(--wood-light)}.menu-tab.on{background:var(--wood);box-shadow:inset 0 3px 0 var(--gold), inset 0 0 0 2px var(--wood-light)}.menu-tab.on .px{color:var(--gold)}.menu-body{border-top-width:0}.field{color:var(--muted);flex-direction:column;gap:2px;font-size:15px;display:flex}.tag.kind-competitive{color:var(--gold)}.tag.kind-training{color:#9ff3ff}@media (max-width:600px){.menu-tabs{grid-template-columns:minmax(0,1fr)}}.vip-dock{z-index:60;flex-direction:column;align-items:flex-end;gap:8px;max-width:calc(100vw - 32px);display:flex;position:fixed;bottom:16px;right:16px}.battle~.vip-dock{bottom:150px}body:has(.battle) .vip-dock{bottom:150px}.vip-toggle{align-items:center;gap:8px;display:inline-flex}.vip-panel{width:360px;max-width:calc(100vw - 32px);max-height:min(560px,100vh - 120px);overflow-y:auto}.badge{font-family:var(--px);background:var(--red);color:#fff;padding:3px 5px;font-size:8px;box-shadow:0 0 0 2px #120c18}.vip-list{flex-direction:column;gap:8px;display:flex}.vip-row{align-items:center;gap:6px;min-width:0;display:flex}.vip-name{font-family:var(--px);text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:9px;overflow:hidden}.vip-name.link{color:var(--parch);cursor:pointer;background:0 0;border:0;padding:0}.vip-name.link:hover{color:var(--gold)}.vip-sub{color:var(--muted);padding-left:16px;font-size:15px}.dot{background:#5a5560;flex:none;width:8px;height:8px;box-shadow:0 0 0 2px #120c18}.dot.online{background:#5fd35a}.dot.playing{background:var(--gold)}.pm-log{background:var(--wood-dark);flex-direction:column;gap:6px;height:260px;padding:8px;display:flex;overflow-y:auto}.pm{word-break:break-word;background:#3a2a1a;align-self:flex-start;max-width:85%;padding:4px 8px;font-size:18px;line-height:1.1;box-shadow:inset 0 0 0 1px #0006}.pm.mine{background:#2e5a2a;align-self:flex-end}.pm time{color:var(--muted);text-align:right;font-size:13px;display:block}