:root{--ink: #1d1a16;--paper: rgba(236, 228, 210, .94);--paper-2: rgba(222, 211, 188, .96);--line: #8a7a5c;--blue: #3b6ea8;--red: #a8403b;--gold: #c9a24a}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#0d0f12;font-family:Georgia,Times New Roman,serif;color:var(--ink)}#app canvas{display:block}#ui{position:fixed;inset:0;pointer-events:none}#ui>*{pointer-events:auto}.hidden{display:none!important}.panel{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(440px,92vw);padding:24px 28px;background:var(--paper);border:1px solid var(--line);box-shadow:0 20px 60px #00000080,inset 0 0 0 4px #ffffff40}.panel h1{margin:0;font-size:40px;letter-spacing:.25em;text-align:center}.panel h2{margin:0 0 8px;font-size:30px;text-align:center}.panel .sub{margin:4px 0 20px;text-align:center;color:#5b4f3a;font-style:italic}label{display:block;margin-bottom:12px;font-size:14px}input{font:inherit;font-size:16px;padding:8px 10px;border:1px solid var(--line);background:#ffffff8c;width:100%;text-transform:uppercase}#name{text-transform:none}.row{display:grid;grid-template-columns:1fr 80px 1fr;gap:8px;align-items:stretch}button{font:inherit;font-size:15px;padding:9px 14px;cursor:pointer;border:1px solid var(--ink);background:var(--ink);color:#f1e9d6;letter-spacing:.04em}button:hover{background:#3a3129}button:disabled{opacity:.5;cursor:default}button.wide{width:100%;margin-bottom:10px;padding:12px;font-size:1.05em;background:#6b4f25;border-color:#c9a24a}button.wide:hover{background:#7d5d2c}#lobby-status{margin-top:16px;padding-top:12px;border-top:1px dashed var(--line)}#lobby-status p{margin:6px 0}#invite{user-select:all;font-family:monospace;font-size:12px;word-break:break-all}#players{margin:8px 0;padding-left:18px}#players li.t0::marker{color:var(--blue)}#players li.t1::marker{color:var(--red)}#start{width:100%;margin-top:8px}.hint{font-size:12px;color:#5b4f3a}.controls{margin-top:18px;line-height:1.5}.error{color:var(--red);min-height:1.2em;font-size:13px}#hud{position:absolute;inset:0;pointer-events:none}#top{position:absolute;top:10px;left:50%;transform:translate(-50%);display:flex;gap:14px;align-items:center;padding:6px 14px;background:var(--paper-2);border:1px solid var(--line);pointer-events:auto}#timer{font-size:20px;font-variant-numeric:tabular-nums;min-width:60px}#points{display:flex;gap:10px}.pt{display:flex;flex-direction:column;align-items:center;font-size:11px;min-width:86px}.pt .bar{width:100%;height:6px;background:#b8ab90;margin-top:3px;position:relative;overflow:hidden}.pt .bar i{position:absolute;top:0;bottom:0}.pt .bar i.t0{background:var(--blue);right:50%}.pt .bar i.t1{background:var(--red);left:50%}.pt.own0 .name{color:var(--blue);font-weight:700}.pt.own1 .name{color:var(--red);font-weight:700}#hold{font-size:12px;min-width:120px;text-align:right}#edge{display:flex;flex-direction:column;font-size:11px;min-width:96px;gap:2px}#edge .ebar{height:7px;background:#b8ab90;position:relative;overflow:hidden}#edge .ebar i{position:absolute;left:0;top:0;bottom:0;width:0;background:var(--gold);transition:width .3s linear}#edge .ebar.foe{height:3px}#edge .ebar.foe i{background:#8a7a5c}#edge.paused .lbl{color:#a07a1a}#edge.ready .ebar:not(.foe) i{background:var(--gold);animation:glow .8s ease-in-out infinite alternate}#edge.done{opacity:.55}@keyframes glow{0%{filter:brightness(1)}to{filter:brightness(1.6)}}#reward{position:absolute;left:50%;top:98px;transform:translate(-50%);pointer-events:auto;background:var(--paper);border:1px solid var(--gold);box-shadow:0 10px 30px #00000073;padding:10px 12px;width:min(420px,94vw)}#reward .rt{margin:0 0 8px;font-size:15px;text-align:center;color:#7a5a1a}#reward .rbtns{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}#reward button{display:flex;flex-direction:column;gap:4px;padding:8px;text-align:left}#reward button b{font-size:14px}#reward button span{font-size:11px;color:#d8ccb0;line-height:1.3;letter-spacing:0}#reward button:disabled{opacity:.4;cursor:default}#horn{background:var(--gold);color:var(--ink);border-color:var(--gold);animation:glow .9s ease-in-out infinite alternate}#horn:hover{background:#d8b45a}#ping{font-size:11px;font-variant-numeric:tabular-nums;min-width:44px;text-align:right;color:#5b4f3a}#ping.good{color:#3f7a2a}#ping.mid{color:#a07a1a}#ping.bad{color:#a8403b}#ready{padding:6px 14px;font-size:14px;background:var(--gold);color:var(--ink);border-color:var(--gold)}#ready:disabled{opacity:.7;cursor:default;background:var(--paper-2);color:#5b4f3a}body.deploy #timer{color:#8a5a1a}#cards{position:absolute;left:50%;bottom:12px;transform:translate(-50%);display:flex;gap:6px;pointer-events:auto}.card{width:74px;padding:6px 6px 5px;background:var(--paper-2);border:1px solid var(--line);cursor:pointer;font-size:11px;text-align:center;position:relative;user-select:none}.card.sel{outline:2px solid var(--gold)}.card.dead{opacity:.35}.card.routing{border-color:var(--red)}.card.noammo .f{color:var(--red)}.card .hd{display:flex;align-items:center;justify-content:center;gap:4px}.card .k{width:22px;height:22px;color:#2a2420;flex:none}.card .n{font-variant-numeric:tabular-nums;font-size:12px}.card .m{height:6px;background:#b8ab90;margin-top:4px}.card.hit{animation:card-hit .6s ease-in-out infinite alternate}.card.shaky{background:#ead2c4}.card.card.routing .k,.card.card.shaky .k{color:var(--red)}@keyframes card-hit{0%{box-shadow:0 0 #a8403b00}to{box-shadow:0 0 0 3px #a8403bd9}}.card .m i{display:block;height:100%;background:#6a9a4a}.card .y{height:3px;background:#d8ceb6;margin-top:2px}.card .y i{display:block;height:100%;width:0;background:#8a8578}.card .st{font-size:9px;color:#5b4f3a;text-transform:uppercase;letter-spacing:.05em}.card .f{font-size:9px;color:#7a5a2a;letter-spacing:.03em}#tactics{position:absolute;left:50%;bottom:94px;transform:translate(-50%);display:flex;flex-direction:column;gap:6px;pointer-events:auto;background:#ece2c8e6;border:1px solid var(--line);padding:6px 8px}#tactics .trow{display:flex;align-items:center;gap:6px}#tactics .tl{font-size:11px;min-width:64px;color:#5b4f3a;text-transform:uppercase;letter-spacing:.05em}#tactics .trow>div{display:flex;gap:4px;flex-wrap:wrap}#tactics button{padding:5px 9px;font-size:12px}#tactics button.on{background:var(--gold);color:var(--ink);border-color:var(--gold)}#tactics button:disabled{opacity:.35;cursor:default}#msg{position:absolute;left:50%;top:70px;transform:translate(-50%);font-size:16px;color:#f1e9d6;text-shadow:0 1px 3px #000;opacity:0;transition:opacity .3s}#selbox{position:fixed;border:1px dashed #f1e9d6;background:#f1e9d61f;pointer-events:none;display:none}#minimap{position:absolute;left:12px;bottom:12px;border:1px solid var(--line);background:#2a2a24;box-shadow:0 6px 24px #00000073;pointer-events:auto;touch-action:none;image-rendering:pixelated}#halt{position:absolute;right:12px;bottom:12px;pointer-events:auto;padding:12px 18px;font-size:16px}.mini{padding:2px 8px;font-size:11px;margin-left:6px}.touch-only{display:none}@media(pointer:coarse){.desktop-only{display:none}.touch-only{display:block}button.touch-only{display:inline-block}.panel{padding:18px 16px}.panel h1{font-size:32px}#top{top:6px;padding:4px 8px;gap:8px;max-width:96vw}#timer{font-size:16px;min-width:46px}.pt{min-width:62px;font-size:10px}#hold{min-width:80px;font-size:11px}#edge{min-width:64px;font-size:10px}#reward{top:82px;padding:8px}#reward .rbtns{gap:5px}#reward button span{display:none}#cards{bottom:8px;gap:4px;left:150px;transform:none;right:90px;overflow-x:auto;justify-content:flex-start}.card{width:58px;padding:4px 3px 3px;font-size:10px;flex:0 0 auto}.card .k{width:17px;height:17px}.card .st{display:none}#msg{top:56px;font-size:14px}}@media(max-width:480px){.row{grid-template-columns:1fr 70px 1fr}}#actions{position:absolute;right:12px;bottom:12px;display:flex;gap:8px;pointer-events:auto}#actions button{padding:10px 16px;font-size:15px}#halt{position:static}#build.active{background:var(--gold);color:var(--ink);border-color:var(--gold)}body.build-mode #app canvas{cursor:crosshair}.card.k-worker .k{color:#6e5a40}.card.k-horse_archer .k,.card.k-cavalry .k{color:#5a3a2a}@media(pointer:coarse){#actions{right:8px;bottom:8px;flex-direction:column}#cards{right:120px}#tactics{left:150px;right:90px;bottom:66px;transform:none;padding:4px 6px;gap:4px;overflow-x:auto}#tactics .tl{display:none}#tactics button{padding:6px 7px;font-size:11px}}#mute{position:absolute;top:10px;right:12px;pointer-events:auto;width:38px;height:38px;padding:0;font-size:18px;border-radius:50%}#mute.off{opacity:.55}#quality{position:absolute;top:54px;right:12px;pointer-events:auto;padding:4px 8px;font-size:11px}#quality-sel,#map-sel{width:100%;padding:6px;font:inherit;background:var(--paper-2);border:1px solid var(--line);color:var(--ink)}#attackmove.active{background:var(--red);border-color:var(--red)}body.attack-mode #app canvas{cursor:crosshair}#map-sel:disabled{opacity:.7}#map-blurb{margin:-4px 0 6px}.army{margin:6px 0 10px;font-size:14px}.army summary{cursor:pointer;padding:4px 0}.army .apresets{display:flex;flex-wrap:wrap;gap:4px;margin:6px 0}.army .arow{display:grid;grid-template-columns:1fr 38px 30px 26px 30px;align-items:center;gap:4px;padding:2px 0;border-bottom:1px dotted var(--line)}.army .acost{opacity:.7;text-align:right;font-size:12px}.army .arow b{text-align:center}.army button.mini{padding:2px 6px;font-size:13px}.endtable{width:100%;border-collapse:collapse;margin:8px 0;font-size:14px}.endtable th,.endtable td{padding:3px 6px;text-align:right;border-bottom:1px dotted var(--line)}.endtable th:first-child,.endtable td:first-child{text-align:left}.endtable th.t0{color:#3b6ea8}.endtable th.t1{color:#a8403b}.endchart{width:100%;height:auto;display:block;margin-top:6px;background:#0000000a}.panel{max-height:calc(100dvh - 24px);overflow-y:auto}.botrow{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:stretch;margin-bottom:10px}.botrow button.wide{margin-bottom:0}select{font:inherit;font-size:15px;padding:6px 8px;border:1px solid var(--line);background:#ffffff8c}details.controls summary{cursor:pointer;font-size:13px;color:#3e3527}details.controls ul{margin:6px 0 0;padding-left:16px}details.controls li{margin-bottom:3px}#tempo{display:flex;gap:4px}#tempo button{padding:4px 9px;font-size:13px;min-width:34px}#tempo button.on{background:var(--gold);color:var(--ink);border-color:var(--gold)}#paused{position:absolute;left:50%;top:38%;transform:translate(-50%,-50%);pointer-events:none;font-size:34px;letter-spacing:.2em;text-transform:uppercase;color:#f1e9d6;text-shadow:0 2px 8px #000;text-align:center}#paused span{display:block;font-size:13px;letter-spacing:.06em;text-transform:none;opacity:.85;margin-top:4px}#tip{position:absolute;left:50%;top:108px;transform:translate(-50%);max-width:min(520px,90vw);padding:7px 14px;background:#ece2c8eb;border:1px solid var(--line);border-left:4px solid var(--gold);font-size:13px;line-height:1.4;pointer-events:none;transition:opacity .4s}#tip b{color:#6b4f25}body:not(.deploy) #tip{display:none}.card .g{position:absolute;top:1px;left:3px;font-size:10px;font-weight:700;color:#6b4f25;font-variant-numeric:tabular-nums}@media(pointer:coarse){#tip{top:88px;font-size:12px}#paused{font-size:24px}}body.shoulder #cards,body.shoulder #tactics{opacity:.35;transform:translateY(40%);transition:opacity .2s,transform .2s}body.shoulder #cards:hover,body.shoulder #tactics:hover{opacity:1;transform:none}#hero-hud{position:fixed;left:136px;bottom:14px;display:flex;flex-direction:column;gap:5px;align-items:stretch;padding:8px 12px;background:#14100c8c;border-radius:6px;color:#efe6d2;font-size:12px;pointer-events:none;z-index:20}#hero-hud.hidden{display:none}#hero-hud .hbar span{width:30px}#hero-hud .hbar{display:flex;align-items:center;gap:6px}#hero-hud .track{width:160px;height:8px;background:#ffffff26;border-radius:4px;overflow:hidden}#hero-hud .fill{height:100%;transition:width .12s}#hero-hud .fill.hp{background:#b8483c}#hero-hud .fill.st{background:#d8b45a}#hero-hud .fill.st.low{background:#8a7a5a}#hero-cross{display:none;position:fixed;left:50%;top:46%;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;background:#fff5dcd9;box-shadow:0 0 0 1px #00000080;pointer-events:none;z-index:20}body.hero #hero-cross{display:block}#hero-flash{position:fixed;inset:0;pointer-events:none;box-shadow:inset 0 0 120px 30px #aa140a8c;opacity:0;z-index:19}#hero-flash.on{animation:heroFlash .45s ease-out}@keyframes heroFlash{0%{opacity:1}to{opacity:0}}#hero-cross.hit,#hero-cross.kill{width:18px;height:18px;margin:-9px 0 0 -9px;border-radius:0;background:none;box-shadow:none}#hero-cross.hit:before,#hero-cross.hit:after,#hero-cross.kill:before,#hero-cross.kill:after{content:"";position:absolute;left:8px;top:-1px;width:2px;height:20px;background:#fff6e0;transform:rotate(45deg)}#hero-cross.hit:after,#hero-cross.kill:after{transform:rotate(-45deg)}#hero-cross.kill:before,#hero-cross.kill:after{background:#ff5a3c;width:3px}.hero-plus{position:fixed;left:calc(50% + 16px);top:calc(46% - 26px);color:#ff7a52;font:700 18px/1 Georgia,serif;text-shadow:0 1px 2px rgba(0,0,0,.7);pointer-events:none;z-index:21;animation:heroPlus .8s ease-out forwards}@keyframes heroPlus{to{transform:translateY(-26px);opacity:0}}.hero-dir{position:fixed;left:50%;top:46%;width:190px;height:190px;border-radius:50%;border-top:6px solid rgba(220,40,20,.9);border-right:6px solid transparent;border-left:6px solid transparent;border-bottom:6px solid transparent;pointer-events:none;z-index:21;animation:heroDir .9s ease-out forwards}.hero-dir.blocked{border-top-color:#c8c8d2d9}@keyframes heroDir{to{opacity:0}}#hero-target{display:none;position:fixed;left:50%;top:64px;transform:translate(-50%);padding:3px 10px;background:#3c0e0a99;color:#f4e4d0;font-size:13px;border-radius:4px;pointer-events:none;z-index:20}#loader{position:fixed;inset:0;z-index:100;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;background:#0d0f12;color:#e6dcc4;transition:opacity .35s ease}#loader.done{opacity:0;pointer-events:none}#loader h1{margin:0;font-size:44px;font-weight:400;letter-spacing:.3em;padding-left:.3em}#loader-bar{width:min(360px,70vw);height:6px;background:#e6dcc426;border-radius:3px;overflow:hidden}#loader-fill{width:0;height:100%;background:var(--gold);transition:width .2s ease}#loader-text{margin:0;font-size:14px;font-style:italic;color:#a89c80}#campaign-btn{margin-bottom:8px}#sefer-list{list-style:none;margin:0 0 12px;padding:0}#sefer-list li{display:flex;align-items:center;gap:10px;padding:7px 4px;border-bottom:1px dotted var(--line)}#sefer-list .n{width:24px;height:24px;flex:none;border-radius:50%;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:13px}#sefer-list small{display:block;font-size:12px;opacity:.75}#sefer-list .done .n{background:var(--blue);color:#fff;border-color:var(--blue)}#sefer-list .now{background:#c9a24a33}#sefer-list .now .n{background:var(--gold);border-color:var(--gold)}#sefer-list .locked{opacity:.5}.sefer-row{margin-top:8px;justify-content:space-between}#brief-text p{margin:0 0 10px;line-height:1.45;font-size:15px}.brief-goal{margin:10px 0 4px;padding:8px 10px;background:#c9a24a38;border-left:3px solid var(--gold)}#brief-army{list-style:none;margin:8px 0 12px;padding:0;font-size:13px}#brief-army li{display:flex;justify-content:space-between;gap:10px;padding:2px 0;border-bottom:1px dotted var(--line)}#brief-go{margin-bottom:6px}#end-campaign p{margin:8px 0;line-height:1.45}#objective{position:fixed;top:12px;left:12px;padding:6px 12px;font-size:14px;color:#f2e8cf;background:#14100aad;border-left:3px solid var(--gold);max-width:28vw;pointer-events:none;z-index:5}@media(max-width:900px){#objective{top:52px;left:8px;max-width:60vw;font-size:12px;padding:4px 8px}}