:root{font-family:system-ui,-apple-system,Segoe UI,sans-serif;color:#e9f5ff;background:#061018;color-scheme:dark}*{box-sizing:border-box}body{margin:0}.tp-shell{min-height:100dvh;background:radial-gradient(ellipse at 50% 0,#173045,#061018 70%)}.tp-bar{height:62px;padding:0 clamp(12px,3vw,34px);display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #36556c}.tp-bar a{color:#a6c7d8;text-decoration:none;font-size:14px}.tp-bar strong{font-size:clamp(16px,3vw,25px);letter-spacing:.08em}.tp-bar strong span{color:#54e4aa}.tp-menu{max-width:690px;margin:clamp(30px,6vw,100px) auto;padding:20px}.tp-overline{color:#7fe8be;font-weight:800;letter-spacing:.15em;font-size:12px}.tp-menu h1{font-size:clamp(32px,6vw,64px);letter-spacing:-.04em;margin:.3em 0}.tp-menu p{line-height:1.7;color:#a8c1cf}.tp-actions{display:flex;gap:15px;flex-wrap:wrap;margin:34px 0}.tp-primary,.tp-join button,.tp-invite button,#tp-rematch{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:10px;background:#59dfa9;color:#071d19;padding:13px 20px;font-size:16px;font-weight:800;text-decoration:none;cursor:pointer}.tp-join{display:flex;gap:7px;max-width:350px}.tp-join input,.tp-invite input{min-width:0;background:#0e222d;border:1px solid #47647a;border-radius:9px;color:white;padding:12px;font:600 15px system-ui;letter-spacing:.1em}.tp-join input{width:190px}.tp-guide{margin-top:30px;font-size:13px}.tp-notice{border-left:3px solid #ffb66c;padding-left:13px}.tp-match{max-width:1400px;margin:auto;padding:12px}.tp-match-top{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:clamp(12px,2vw,18px);font-weight:800;min-height:44px}.tp-match-top>div{display:flex;gap:18px}.tp-match-top #tp-health{color:#8ee2c7}.tp-arena{position:relative;background:#08151d;aspect-ratio:5/3;border:4px solid #345163;border-radius:8px;overflow:hidden}.tp-arena canvas{width:100%;height:100%;display:block;image-rendering:pixelated;touch-action:none}.tp-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#051018a8;text-align:center;font-weight:900;font-size:clamp(18px,3vw,42px);padding:12px;pointer-events:none}.tp-overlay[hidden]{display:none}.tp-controllers{display:none;justify-content:space-between;align-items:center;gap:12px;margin:14px 0}.tp-pad{width:110px;height:110px;touch-action:none;user-select:none;border:4px solid #5f90a5;border-radius:50%;position:relative;background:#193041;display:grid;place-items:center}.tp-pad span{width:43px;height:43px;border-radius:50%;background:#a9dbef;box-shadow:inset 0 -6px #598ca4}.tp-aim{border-color:#fa929c}.tp-aim span{background:#ffacaa}.tp-hint{font-size:12px;color:#95b8c8;text-align:center}.tp-invite{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:15px}.tp-invite[hidden]{display:none}.tp-invite p{width:100%;margin:0}.tp-invite input{flex:1;letter-spacing:normal}.tp-back{display:inline-block;margin-top:16px;color:#a2c7d9;font-size:13px}#tp-rematch{margin-top:16px}#tp-rematch[hidden]{display:none}#tp-rematch:disabled{opacity:.5}.tp-guide,.tp-invite p{color:#b6cad6}.tp-dash{border:1px solid #6bd7b1;background:#163b37;color:#a8ffcd;border-radius:5px;padding:12px 7px;font-size:11px;font-weight:900;cursor:pointer}.tp-dash:disabled{opacity:.4;cursor:default}@media(hover:none),(pointer:coarse){.tp-controllers{display:flex}}@media(max-width:680px){.tp-bar{height:54px}.tp-match{padding:6px}.tp-match-top>div{flex-direction:column;gap:0}.tp-arena{border-width:2px}.tp-pad{width:100px;height:100px}.tp-hint{max-width:85px}.tp-invite input{width:100%}}

/* Visual parity with Tank Pixel Remaster — online mode */
.tp-shell{background:radial-gradient(ellipse at 50% -20%,#243b40,#0a1820 50%,#061117);color:#e5f5f5}
.tp-bar{background:#0b1922;border-bottom:1px solid #39565e}
.tp-bar strong{letter-spacing:.12em}.tp-bar strong span{color:#65e3b2}
.tp-menu{background:linear-gradient(140deg,#162d35db,#0b1b26e6);border:1px solid #34525a;margin-top:clamp(20px,5vw,60px);max-width:720px;padding:clamp(20px,5vw,50px)}
.tp-overline{color:#66e6b1;font-size:11px;letter-spacing:.2em}
.tp-menu h1{text-transform:uppercase;font-weight:1000;letter-spacing:-.05em}
.tp-match-top{padding:10px;background:#15262e;border:1px solid #355059;border-bottom:0}
.tp-arena{border:2px solid #344b54;border-radius:0;aspect-ratio:5/3}
.tp-invite{border:1px solid #35535a;background:#152932;padding:15px}
.tp-primary,.tp-join button,.tp-invite button,#tp-rematch{background:#62e8b2;border-radius:3px}
.tp-back{border:1px solid #45636b;padding:10px 18px}
.tp-overlay{background:#08151cb5;text-shadow:0 2px 15px #000}

.tp-special-status{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.tp-special-status button{min-height:31px;min-width:86px;border-radius:3px;border:1px solid #597686;background:#183641;color:#f9c58d;font-size:11px;font-weight:900;cursor:pointer}
.tp-special-status button+button{color:#aeecff;border-color:#5390a2}
.tp-special-status button:disabled{opacity:.38;cursor:default}
.tp-special-status button.ready{box-shadow:0 0 10px #99e9cc36}
.tp-special-status kbd{border:1px solid #6b8790;padding:2px 4px}
.tp-abilities{display:flex;gap:5px;pointer-events:auto}
.tp-ability{border:1px solid #765749;background:#202c37;color:#ffb87e;border-radius:5px;min-width:43px;min-height:34px;font-size:21px;font-weight:900;cursor:pointer}
.tp-ability span{display:block;font-size:8px}
.tp-ability.shield{color:#8adcf5;border-color:#55899e}
.tp-ability:disabled{opacity:.38;cursor:default}
.tp-ability.ready{box-shadow:0 0 12px #7cdfb833}
@media(orientation:landscape) and (max-height:820px){
 body.tank-immersive .tp-special-status{display:none}
 body.tank-immersive .tp-controllers .tp-abilities{
  display:flex;position:absolute;top:calc(40% + var(--tank-control-size,84px) / 2 + 49px);
  right:var(--tank-control-right,10px);left:auto;
  width:var(--tank-control-size,84px);z-index:5;pointer-events:auto;
 }
 body.tank-immersive .tp-abilities .tp-ability{min-width:0;flex:1;min-height:30px;height:30px;font-size:17px;padding:1px}
 body.tank-immersive .tp-abilities .tp-ability span{font-size:7px}
}
@media(max-width:750px) and (orientation:portrait){.tp-special-status{display:none}}

/* Sound toggle stays reachable alongside the connection indicator. */
.tp-sound-control{height:30px;width:32px;min-width:32px;border:1px solid #456c77;border-radius:4px;background:#17323e;color:#92f1d0;font-size:18px;cursor:pointer}
.tp-sound-control:focus-visible{outline:2px solid #f6c883;outline-offset:2px}
@media (orientation:landscape) and (max-height:820px){
 body.tank-immersive .tp-sound-control{height:26px;min-width:26px;width:26px;font-size:15px}
}

/* V6 class selector / finished duel report */
.tp-class-selector{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:0;padding:0;margin:18px 0 20px;gap:8px}
.tp-class-selector legend{color:#82e6bd;font-size:10px;font-weight:900;letter-spacing:.14em;padding-bottom:9px}
.tp-class-selector label{position:relative;cursor:pointer;min-width:0}
.tp-class-selector input{position:absolute;opacity:0;width:1px;height:1px}
.tp-class-selector label span{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px;padding:12px 5px;border:1px solid #47606d;min-height:90px;background:linear-gradient(150deg,#1e3441,#14252e);border-radius:4px;color:#72e0b0}
.tp-class-selector label:has(input:checked) span{border-color:#79ffbb;background:#24493f;box-shadow:0 0 14px #7defaf30}
.tp-class-selector label:has(input:focus-visible) span{outline:3px solid #efca84;outline-offset:2px}
.tp-class-selector strong{font-size:11px;letter-spacing:.04em;color:#f2f8f4}
.tp-class-selector small{font-size:10px;color:#a9c4c7;text-align:center}
.tp-class-label{font-size:9px;color:#b0eac6;font-weight:900;letter-spacing:.08em}
.tp-after-action[hidden]{display:none!important}
.tp-after-action{margin:10px auto;padding:12px;max-width:570px;border:1px solid #51817b;background:#0c202bdc;color:#d8f4eb}
.tp-after-action h2{text-align:center;font-size:15px;letter-spacing:.13em;margin:0 0 8px;color:#75e8b4}
#tp-after-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
#tp-after-stats section{min-width:0;background:#1d3541;padding:10px;border:1px solid #42616c}
#tp-after-stats section h3{font-size:11px;margin:0 0 7px;color:#9de3c7}
#tp-after-stats section>div{display:flex;justify-content:space-between;gap:6px;padding:2px 0;font-size:10px}
#tp-after-stats section>div span{color:#aec6ce}
#tp-after-stats section>div strong{color:#eaf8f4}
@media(max-width:680px){.tp-class-selector{gap:4px;margin:12px 0}.tp-class-selector label span{padding:7px 3px;min-height:69px}.tp-class-selector strong{font-size:9px}.tp-class-selector small{font-size:8px}}
@media (orientation:landscape) and (max-height:820px){
 body.tank-immersive .tp-class-label{display:none}
 body.tank-immersive .tp-after-action:not([hidden]){position:fixed;z-index:13;max-width:min(470px,69vw);max-height:calc(var(--tank-vv-height,100dvh) - 94px);overflow-y:auto;top:calc(var(--tank-vv-top,0px) + 45px);left:50%;transform:translateX(-50%);margin:0;padding:8px;background:#0c202bf2}
 body.tank-immersive .tp-after-action h2{font-size:11px}
 body.tank-immersive #tp-after-stats section{padding:5px}
 body.tank-immersive #tp-after-stats section>div{font-size:9px}
 body.tank-immersive #tp-rematch:not([hidden]){bottom:max(8px,env(safe-area-inset-bottom));}
}


/* Release identity must remain readable even if optional release.css has not deployed. */
.tank-release-stamp{
 display:block;position:relative;z-index:20;
 box-sizing:border-box;width:fit-content;
 max-width:calc(100vw - 16px);
 margin:5px auto 12px;padding:5px 9px;
 border:1px solid #446965;border-radius:6px;
 background:#0a2129;color:#bce6dd;
 font:700 10px/1.35 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
 letter-spacing:.02em;text-align:center;
 white-space:normal;overflow-wrap:anywhere;
 pointer-events:none;
}
@media (orientation:landscape) and (max-height:820px){
 body.tank-immersive .tank-release-stamp{
  position:fixed;left:50%;transform:translateX(-50%);
  bottom:max(3px,env(safe-area-inset-bottom,0px));
  z-index:31;max-width:66vw;
  margin:0;padding:3px 6px;font-size:9px;
 }
}

/* World Operations configuration is independent of account and ticket handling. */
.tp-world-setup{padding:14px;border:1px solid #3b5861;margin:16px 0;background:#11262d}.tp-world-setup legend{font:800 11px system-ui;color:#9bcbb8;letter-spacing:.1em}.tp-world-setup>label,.tp-slot-row label{font:700 11px system-ui;display:flex;align-items:center;gap:10px;color:#b9cec6}.tp-world-setup select{background:#203940;color:#e0ecdf;border:1px solid #4e6b6d;padding:9px;min-width:0;font:700 12px system-ui;border-radius:3px}.tp-world-setup>label select{flex:1}.tp-world-setup p{font-size:11px}.tp-slot-row{display:grid;grid-template-columns:1fr 1fr;gap:15px;padding:6px 0}.tp-slot-row label{display:grid;grid-template-columns:90px 1fr}.tp-world-setup small{display:block;color:#9bb8b4;font-size:11px;line-height:1.5;margin-top:8px}#tp-score,#tp-health{font-size:11px;line-height:1.6}@media(max-width:600px){.tp-slot-row{gap:8px}.tp-slot-row label{grid-template-columns:1fr}.tp-world-setup select{width:100%}#tp-health{font-size:8px}}
