.symbol-defs{position:absolute;width:0;height:0;overflow:hidden}
.build-radial{pointer-events:none}.radial-disc{pointer-events:auto}
.resources{position:fixed;top:106px;left:50%;transform:translateX(-50%);display:flex;gap:0;padding:10px 15px;pointer-events:auto}
.resources>div{display:flex;align-items:center;gap:8px;min-width:104px;padding:0 14px;border-right:1px solid var(--line)}
.resources>div:first-child{padding-left:0}.resources>div:last-child{border:0;padding-right:0}
.resources svg{width:21px;height:25px;fill:none;stroke:#9eb582;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.resources>div:nth-child(2) svg{stroke:#bec9c9}.resources span:not(.gold-coin){font-size:11px;color:var(--muted);display:grid;gap:3px}.resources b{font:20px Georgia,serif;color:var(--cream)}
.resources small{font-size:10px;color:#adbd97;white-space:nowrap}.gold-coin{color:var(--gold);font-size:21px}
.controls-hint .build-launch{display:flex;align-items:center;justify-content:center;gap:8px;width:auto;min-width:84px;height:34px;border-radius:3px;padding:0 10px;background:#1c342bdc;color:var(--gold);font-size:13px;border-color:#cfb78375}
.build-launch kbd{border:0;background:none;padding:0;color:var(--gold)}
.controls-hint .erase-launch{min-width:76px;color:#e1b39a;border-color:#b9957a75}.controls-hint .erase-launch[aria-pressed=true]{background:#6b4d39;border-color:#efbc93}.erase-launch kbd{color:#e1b39a}.placement-info.erasing{border-color:#d4a181aa}.placement-info.erasing p{color:#e7c2a4}#removal-status{border:1px solid #ca9b6977;padding:12px;margin-top:14px;background:#bb77421a}#removal-countdown{font:18px Georgia;color:#edbb8b}#removal-detail{font-size:12px;color:#ccb89f}#cancel-removal{margin-top:9px}.controls-hint{gap:8px}
@media(max-width:580px){.controls-hint .erase-launch{min-width:60px}.controls-hint .draw-hint{gap:4px}.controls-hint{gap:5px}#removal-countdown{font-size:16px}}
.build-radial{--diameter:340px;position:fixed;z-index:30;width:var(--diameter);outline:0}
.radial-disc{width:var(--diameter);height:var(--diameter);border-radius:50%;position:relative;background:#13281fed;border:1px solid #d2b77988;box-shadow:0 18px 70px #05190daa,0 0 0 5px #152d2688;overflow:hidden;backdrop-filter:blur(16px)}
.radial-option{position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:50%;background:#1a332b;transition:background .12s;color:var(--cream);padding:0}
.radial-option:hover:not(:disabled),.radial-option:focus-visible{background:#395044;outline:0}.radial-option:disabled{color:#87988b;background:#162b25;opacity:.65}
.radial-north{clip-path:polygon(50% 49%,0 0,100% 0)}.radial-east{clip-path:polygon(51% 50%,100% 0,100% 100%)}.radial-south{clip-path:polygon(50% 51%,100% 100%,0 100%)}.radial-west{clip-path:polygon(49% 50%,0 100%,0 0)}
.radial-label{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:95px;transform:translate(-50%,-50%);pointer-events:none}
.radial-north .radial-label{left:50%;top:21%}.radial-east .radial-label{left:79%;top:50%}.radial-south .radial-label{left:50%;top:79%}.radial-west .radial-label{left:21%;top:50%}
.radial-label svg{width:23px;height:23px;fill:none;stroke:var(--gold);stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round}
.radial-label strong{font:17px/1.05 Georgia,serif;font-weight:400}.radial-label small{font:11px/1.35 Arial,sans-serif;color:#c7c9ad}.radial-label kbd{font:9px Arial,sans-serif;border:0;background:none;color:#849c88;padding:0;position:absolute;right:3px;top:3px}
.radial-close{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)!important;width:63px;height:63px;border-radius:50%;border:1px solid #d2b77966;z-index:5;background:#142a22;color:var(--gold);font:26px Georgia,serif;display:grid;place-content:center;gap:1px;box-shadow:0 0 0 5px #183329}
.radial-close small{font:8px Arial,sans-serif;letter-spacing:1px;color:#a4b29e}.radial-close:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
.radial-description{background:#162d25f2;border:1px solid var(--line);border-radius:3px;font-size:12px;line-height:1.5;text-align:center;padding:11px 13px;color:#c6cdbb;margin:13px auto 0;max-width:310px;pointer-events:none}
.placement-info{position:absolute;left:50%;transform:translateX(-50%);bottom:96px;padding:15px 20px;max-width:400px;min-width:285px;border-color:#82c09b99}
.placement-info strong{font:21px Georgia,serif}.placement-info>span{font-size:12px;color:var(--gold);display:block;margin-top:7px}.placement-info p{font-size:13px;line-height:1.5;color:#bad9bf;margin:7px 0 0}.placement-info.invalid{border-color:#cf947877}.placement-info.invalid p{color:#e0b09b}
.next-soldier{width:100%;margin-top:6px;min-height:32px;font-size:12px}.game-active .topbar{z-index:6}
.placement-info:not([hidden])~.toast{bottom:235px}
@media(max-width:900px){.resources{top:164px}.resources>div{min-width:93px;padding:0 11px}.resources small{font-size:9px}.placement-info{bottom:302px}.controls-hint{bottom:260px}}
@media(max-width:580px){.resources{top:154px;padding:9px 12px;width:calc(100% - 24px);justify-content:space-between}.resources>div{min-width:0;padding:0 10px;gap:7px;flex:1}.resources small{font-size:8px;max-width:40px}.resources svg{width:18px}.resources b{font-size:18px}.resources span:not(.gold-coin){font-size:10px}.controls-hint{bottom:14px;gap:8px}.controls-hint .build-launch{min-width:64px;height:30px;font-size:12px;gap:5px}.placement-info{bottom:290px;max-width:calc(100% - 28px);width:calc(100% - 28px);min-width:0;padding:12px 15px}.placement-info strong{font-size:19px}.placement-info p{font-size:12px}.radial-label{width:86px}.radial-label strong{font-size:16px}.radial-description{font-size:11px}.radial-label small{font-size:11px}.tile-panel{max-height:calc(100dvh - 310px)}.next-soldier{font-size:11px}}
@media(max-height:620px){.radial-label svg{width:18px;height:18px}.radial-label{gap:2px;width:79px}.radial-label strong{font-size:14px}.radial-label small{font-size:10px}.radial-close{width:48px;height:48px}.radial-description{margin-top:7px;padding:6px;font-size:11px}.resources{top:80px}.playing-banner{top:17px}.placement-info{bottom:56px}.controls-hint{bottom:14px}}
@media(max-width:900px){.placement-info:not([hidden])~.toast{bottom:445px}}
@media(max-width:580px){.placement-info:not([hidden])~.toast{bottom:440px}}
@media(max-height:620px){.placement-info:not([hidden])~.toast{bottom:200px}}

.town-life{position:absolute;top:172px;left:50%;transform:translateX(-50%);font-size:11px;padding:7px 12px;color:#e1d7ad;white-space:nowrap;border-radius:20px;pointer-events:none!important}
#harbor-actions h4{font:18px Georgia;margin:17px 0 0;color:#e9d49f}#harbor-actions .secondary{gap:9px;flex-wrap:wrap}#harbor-actions .secondary span{font-size:11px}#ship-actions p,#transport-actions p,#harbor-actions p{font-size:12px;line-height:1.5}#harbor-fleet .secondary{margin-top:8px}.glass{border-radius:8px}.tile-panel{box-shadow:0 10px 40px #14292044}
.leaderboard{position:absolute;right:30px;top:98px;width:210px;padding:13px 12px 9px;background:#172e27ed;pointer-events:auto!important;box-shadow:0 8px 25px #10261e25}
.leaderboard summary{cursor:pointer;list-style:none;display:grid;gap:5px;padding:0 2px 9px}.leaderboard summary::-webkit-details-marker{display:none}.leaderboard summary>span{font:9px Arial;letter-spacing:1.7px;color:#a9bba2}.leaderboard summary b{font:21px Georgia;color:#eed9a9}.leaderboard summary b:after{content:' −';float:right;font:16px Arial;color:#9dad97}.leaderboard:not([open]) summary b:after{content:' +'}.leaderboard summary small{font:10px Arial;color:#b9c5ac}
.leaderboard-rows{display:grid;gap:2px;max-height:calc(100dvh - 395px);overflow-y:auto}.leaderboard-row{position:relative;display:grid;grid-template-columns:16px 7px 1fr auto;align-items:center;gap:7px;min-height:24px;width:100%;padding:4px 3px;border:0;border-radius:3px;background:transparent;text-align:left;color:#d4dec8;font:11px Arial}.leaderboard-row:hover{background:#f2dfb51b}.leaderboard-row.is-you{background:#85caff1c;color:#eef4e5}.leaderboard-rank{font-size:9px;color:#9baf97;text-align:center}.leaderboard-row i{width:7px;height:7px;border-radius:2px}.leaderboard-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.leaderboard-row b{font-size:10px;font-variant-numeric:tabular-nums;font-weight:400;color:#f0e2bd}.leaderboard-note{font:9px Arial;color:#9bad98;text-align:center;margin:10px 0 1px}.match-results{width:100%;font-size:11px;margin-top:7px}
.match-active .compass{display:none}.match-active .zoom-controls{right:255px;top:220px}.match-recovery{position:absolute;top:210px;left:50%;transform:translateX(-50%);width:max-content;max-width:380px;padding:10px 14px;font:12px/1.5 Arial;text-align:center;color:#eed4a3;pointer-events:none!important}.match-winner{border-left:3px solid var(--winner-color);padding:12px 15px;background:#ffffff08;font:14px Arial;color:#e5d2a3}#match-dialog h2{margin-top:18px}#match-dialog .match-map{justify-content:center}
.direct-hint{position:absolute;left:50%;top:208px;transform:translateX(-50%);padding:9px 13px;font:11px/1.5 Arial;color:#f5e0ab;max-width:min(460px,70vw);text-align:center;pointer-events:none!important}#direct-control[aria-pressed=true]{background:#629bc833;border-color:#94cef0;color:#e0f3ff}body.direct-active .controls-hint>span:first-child{color:#f5db9f}
@media(max-width:580px){.direct-hint{top:254px;left:12px;transform:none;max-width:calc(100% - 185px);font-size:10px;padding:8px}.direct-hint~.match-recovery{top:310px}}
@media(max-width:1100px){.leaderboard{right:20px;width:186px;top:205px}.match-active .zoom-controls{right:220px;top:225px}.leaderboard-rows{max-height:230px}.leaderboard summary b{font-size:19px}}
@media(max-width:900px){.leaderboard{top:210px;right:18px}.match-active .zoom-controls{right:20px;top:330px}.leaderboard[open]{z-index:9}.leaderboard[open]~*{z-index:auto}}
@media(max-width:580px){.leaderboard{width:154px;right:12px;top:254px;padding:9px}.leaderboard summary b{font-size:17px}.leaderboard summary>span{display:none}.leaderboard summary small{font-size:9px}.leaderboard-rows{max-height:220px}.leaderboard-row{gap:4px;font-size:10px;grid-template-columns:12px 6px 1fr auto}.leaderboard-row b{font-size:9px}.leaderboard-note{font-size:8px}.match-active .zoom-controls{right:12px;top:340px}.match-active .tile-panel{width:calc(100% - 185px)}.match-recovery{top:254px;left:12px;transform:none;width:calc(100% - 185px);font-size:11px;padding:8px}.leaderboard[open]+.match-recovery{max-width:calc(100% - 185px)}}
@media(max-width:900px){.town-life{top:235px}}@media(max-width:580px){.town-life{top:217px;font-size:10px}.tile-panel{width:calc(100% - 165px)}#harbor-actions .secondary{padding:8px;line-height:1.4}}@media(max-height:620px){.town-life{top:143px}}