#territory-play-area{display:grid;width:100%;height:auto;min-width:0;min-height:0;grid-template-rows:auto minmax(0,1fr) auto;gap:8px;margin:0;padding:0}
#territory-play-area[hidden]{display:none!important}
.territory-hud{display:grid;padding:11px 14px;grid-template-columns:minmax(120px,.7fr) minmax(240px,1.7fr) minmax(115px,.55fr);align-items:center;gap:16px;border:1px solid #393c4a;border-radius:14px;background:linear-gradient(135deg,#1c1e25,#14151a);box-shadow:0 16px 40px #0005}
.territory-hud>div{display:grid;gap:3px}.territory-hud small{color:#6f88a5;font-size:8px;font-weight:900;letter-spacing:.16em}.territory-hud strong{color:#eaf7ff;font-size:15px}
.territory-objective{position:relative}.territory-share-head{display:flex;min-width:0;align-items:center;gap:6px}.territory-share-head span{color:#c5d5e5;font-size:9px;font-weight:900}.territory-share-head>b{color:#fff;font-size:10px}.territory-share-head em{margin-left:auto;flex:0 0 auto;color:#75e7d7;font-size:8px;font-style:normal;font-weight:900}.territory-share-summary{display:flex;min-width:0;align-items:center;gap:5px 12px;overflow:hidden;color:#cbd9e8;font-size:9px;white-space:nowrap}.territory-share-summary span{display:flex;align-items:center;gap:4px}.territory-share-summary i{width:7px;height:7px;flex:0 0 7px;border-radius:50%;background:var(--territory-color);box-shadow:0 0 8px var(--territory-color),0 0 2px #fff}.territory-share-summary b{color:#fff;font-size:10px}.territory-share-summary .unclaimed i{background:#40536a;box-shadow:none}.territory-world-share{display:block;width:100%;height:19px;border:1px solid #6e91af;border-radius:6px;background:#22242c;box-shadow:inset 0 1px 3px #fff6,inset 0 -2px 6px #0008,0 0 11px #48b9e04a;filter:saturate(1.18) brightness(1.1)}
.territory-hud>#territory-self-stat{text-align:right}.territory-hud>#territory-self-stat b{font-size:18px}.territory-hud>#territory-self-stat span{color:#8497ad;font-size:8px}
.territory-stage{position:relative;display:block;width:100%;height:100%;min-width:0;min-height:260px;overflow:hidden;border:1px solid #31343f;border-radius:14px;background:radial-gradient(circle at 50% 50%,#2d303b,#0a0b0e 72%);box-shadow:inset 0 0 42px #0009,0 20px 50px #0005}
.territory-stage:before{position:absolute;z-index:1;inset:0;pointer-events:none;content:"";background:linear-gradient(90deg,transparent 49.8%,#6defff08 50%,transparent 50.2%),linear-gradient(0deg,transparent 49.8%,#6defff08 50%,transparent 50.2%)}
.territory-board-box{position:absolute;inset:0;overflow:hidden}
#territory-board{position:absolute;top:0;left:0;display:block;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border-radius:0;border:0;background:#101114;image-rendering:auto}
.territory-mhud{display:none}
.territory-minimap{position:absolute;z-index:3;top:12px;left:12px;width:190px;padding:7px;border:1px solid #6c91aa75;border-radius:11px;background:#0e0f12e8;box-shadow:0 8px 24px #000a,0 0 22px #43dbff17;backdrop-filter:blur(5px);pointer-events:none}
.territory-minimap header{display:flex;margin:0 1px 5px;align-items:center;justify-content:space-between}.territory-minimap header b{color:#bceefa;font-size:8px;letter-spacing:.14em}.territory-minimap header span{color:#708ba1;font-size:8px}.territory-minimap canvas{display:block;border:1px solid #333643;border-radius:5px;background:#090a0c}
.territory-footer{display:flex;min-height:54px;padding:9px 13px;align-items:center;justify-content:space-between;gap:16px;border:1px solid #31343f;border-radius:13px;background:#15161b}.territory-footer p{display:grid;margin:0;gap:3px}.territory-footer p b{color:#8beeff;font-size:10px;letter-spacing:.05em}.territory-footer p span{color:#7e92a9;font-size:9px}
.territory-touch{display:grid;width:116px;grid-template-columns:repeat(3,34px);grid-template-rows:repeat(2,30px);gap:4px}.territory-touch button{min-width:0;padding:0;border-color:#31506b;color:#cce9f4;background:#21232a}.territory-touch button:nth-child(1){grid-column:2}.territory-touch button:nth-child(2){grid-column:1}.territory-touch button:nth-child(3){grid-column:2}.territory-touch button:nth-child(4){grid-column:3}.territory-touch button:active{border-color:#64e9ff;background:#3c404e;transform:translateY(1px)}
.territory-joystick{position:absolute;z-index:7;width:92px;height:92px;transform:translate(-50%,-50%);pointer-events:none}.territory-joystick[hidden]{display:none}.territory-joystick i,.territory-joystick b{position:absolute;display:block;border-radius:50%}.territory-joystick i{inset:0;border:2px solid #9cf6ff9c;background:#1d1e2570;box-shadow:inset 0 0 26px #47e9ff26,0 0 24px #39dff73d;backdrop-filter:blur(3px)}.territory-joystick b{top:27px;left:27px;width:38px;height:38px;border:2px solid #e7fdffcc;background:radial-gradient(circle at 38% 32%,#ecffff,#59dfef 38%,#167999);box-shadow:0 4px 16px #0008,0 0 18px #54edff80;will-change:transform}
#territory-respawn{position:absolute;z-index:4;top:42%;left:50%;transform:translate(-50%,-50%);display:grid;padding:17px 24px;place-items:center;gap:5px;border:1px solid #ff5b8175;border-radius:13px;color:#fff;background:#121318e8;box-shadow:0 15px 35px #0009,0 0 28px #ff4e7f24;backdrop-filter:blur(6px)}#territory-respawn[hidden]{display:none}#territory-respawn b{font-size:14px}#territory-respawn span{color:#ff90aa;font-size:10px}
#territory-event{position:absolute;z-index:4;top:13px;left:50%;padding:7px 12px;transform:translateX(-50%);border:1px solid #67e7d277;border-radius:999px;color:#a4ffef;background:#08211edc;font-size:9px;font-weight:900;box-shadow:0 0 22px #4fffd138}#territory-event[hidden]{display:none}#territory-event.winner{top:50%;padding:14px 24px;transform:translate(-50%,-50%);border-color:#ffd96e;color:#fff6c4;background:#261c08ed;font-size:18px;box-shadow:0 0 45px #ffd35155}
.territory-active #scores{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:5px}.territory-active #scores span{padding:3px 7px;border-left:3px solid var(--territory-color);border-radius:4px;color:#b8c8d8;background:#16171c;font-size:8px}.territory-active .panel.grow{max-width:none}.territory-active #game{width:100%;min-width:0;min-height:0}.territory-active #territory-play-area{flex:1;align-self:stretch}


/* Spectators can select players from the HUD with a mouse, touch or keyboard. */
.territory-share-summary button{display:inline-flex;align-items:center;gap:4px;padding:3px 6px;min-height:28px;min-width:0;font:inherit;color:var(--territory-color);background:#1a1c22;border:1px solid transparent;border-radius:6px;cursor:pointer}
.territory-share-summary button i{width:7px;height:7px;border-radius:50%;background:var(--territory-color)}
.territory-share-summary button[aria-pressed="true"]{border-color:var(--territory-color)}
[data-territory-watch]:focus-visible{outline:2px solid white;outline-offset:2px}
#territory-play-area.territory-spectating .territory-minimap{pointer-events:auto;cursor:crosshair}
#territory-play-area.territory-spectating .territory-share-summary{display:flex;overflow-x:auto;pointer-events:auto}
#territory-play-area.territory-spectating .territory-share-summary button{flex-shrink:0}

/* A single spectator control bar, separate from score readouts and the canvas. */
#territory-watch-controls{display:flex;align-items:center;gap:12px;min-width:0;padding:10px 14px;border:1px solid #393c49;border-radius:12px;background:#16181d;color:#afc4d8}
#territory-watch-controls[hidden]{display:none!important}
#territory-watch-controls label{flex:0 0 auto;font-size:12px;font-weight:700}
#territory-watch-target{width:240px;max-width:100%;min-width:0;min-height:40px;margin:0;padding:8px 32px 8px 12px;border:1px solid #39536c;border-radius:8px;background-color:#22242d;color:#e6f3ff;font-size:13px;text-overflow:ellipsis}
#territory-watch-target:focus-visible{outline:2px solid #79dce9;outline-offset:2px}
.territory-watch-hint{margin-left:auto;font-size:11px;color:#8099b2}
.territory-spectating .territory-footer{display:none}
#territory-play-area.territory-spectating .territory-share-summary{pointer-events:none;overflow:hidden}


/* Canvas margins must not consume the short landscape viewport. */
.territory-minimap canvas,.territory-world-share{margin:0}

/* Long presses on the game surface are controls, not text selection. */
#territory-play-area,#territory-play-area *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
#territory-play-area input,#territory-play-area textarea,#territory-play-area [contenteditable="true"]{-webkit-user-select:text;user-select:text;-webkit-touch-callout:default}

/* Keep the alternative directional controls usable without pointer input. */
.territory-touch button:focus-visible{outline:3px solid #e8ffff;outline-offset:3px}
