@font-face {
  font-family: 'Barlow Condensed';
  src: url('assets/fonts/BarlowCondensed-SemiBold.ttf') format('truetype');
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: 'Barlow Condensed';
  src: url('assets/fonts/BarlowCondensed-Bold.ttf') format('truetype');
  font-weight: 700 900;
  font-display: swap;
}
@font-face {
  font-family: 'IBM Plex Mono';
  src: url('assets/fonts/IBMPlexMono-Regular.ttf') format('truetype');
  font-weight: 400 600;
  font-display: swap;
}

body.at-base {
  --hangar-panel: #11191cda;
  --hangar-line: #9caba837;
  --hangar-text: #e7e9e4;
  --hangar-muted: #a4afaa;
  --hangar-accent: #c4b18a;
  color: var(--hangar-text);
}
body.at-base > header {
  height: 64px;
  padding: 0 26px;
  background: linear-gradient(180deg, #111a20, #11181de8);
  border-bottom: 1px solid #b9c1bb2c;
  box-shadow: 0 8px 35px #0005;
}
body.at-base .brand {
  min-width: 200px;
  font-size: 25px;
  letter-spacing: 2px;
}
body.at-base .brand b {
  background: #8c402c;
  box-shadow: inset 0 0 0 1px #f4cfa442;
}
body.at-base .header-actions {
  gap: 7px;
}
body.at-base .header-actions button {
  flex: none;
  padding: 9px 14px;
  background: #27323766;
  border-color: #acb8b130;
  color: #d3d9d4;
  font-size: 10px;
  letter-spacing: .6px;
  white-space: nowrap;
}
body.at-base .header-actions button:hover,
body.at-base .hangar-maintenance button:hover {
  background: #4a555460;
  color: #fff5dc;
  border-color: #d2c6a77a;
}
body.at-base #overlay {
  padding: 82px 26px 16px;
  min-height: 100svh;
}
body.at-base #menuHome {
  height: calc(100svh - 98px);
  min-height: 590px;
  grid-template-columns: 252px minmax(300px, 1fr) 230px;
  grid-template-rows: 62px minmax(220px, 1fr) auto;
  gap: 18px 24px;
}
body.at-base #menuHome > .hangar-scene {
  inset: 64px 0 0;
  background: #101a1e !important;
}
body.at-base #menuHome > .hangar-scene:after {
  content: '';
  display: block;
  position: absolute;
  inset: 0;
  z-index: 1;
  background: radial-gradient(ellipse at 48% 40%, transparent 35%, #04080b45), linear-gradient(0deg, #04080b88, transparent 48%);
  pointer-events: none;
}
body.at-base .hangar-scene #game {
  cursor: grab;
}
body.at-base .hangar-scene #game:active {
  cursor: grabbing;
}
body.at-base #menuHome > .hangar-scene .vehicle-placard {
  bottom: 257px;
  padding: 12px 30px 15px;
  min-width: 330px;
  border-top: 1px solid #d5d8c32b;
  background: linear-gradient(90deg, #0a111000, #0b1216b8 20%, #0b1216b8 80%, #0a111000);
  text-shadow: 0 2px 9px #000b;
}
body.at-base #menuHome > .hangar-scene .vehicle-placard strong {
  font-size: 31px;
  letter-spacing: 1px;
  color: #edf0e7;
}
body.at-base .vehicle-placard > span {
  color: #c5b78f;
  font-size: 8px;
}
.hangar-orbit-hint {
  position: absolute;
  right: 27px;
  bottom: 256px;
  z-index: 2;
  padding: 7px 10px;
  color: #d0d7c6;
  background: #0c141990;
  border: 1px solid #bac1ab2b;
  font: 8px 'IBM Plex Mono', monospace;
  pointer-events: none;
}
body.at-base .hangar-pilot,
body.at-base .hangar-wallet {
  background: var(--hangar-panel);
  border-color: var(--hangar-line);
  box-shadow: 0 8px 24px #0004;
  backdrop-filter: blur(10px);
}
body.at-base .hangar-pilot { padding: 8px 12px; }
body.at-base .pilot-emblem {
  background: linear-gradient(145deg, #525a51, #202b2b);
  color: #d3c295;
  border-color: #c0bc9659;
}
body.at-base .pilot-details > strong { font-size: 16px; color: #e0e6da; }
body.at-base .pilot-details small { color: #a4b0ad; font-size: 8px; }
body.at-base .hangar-wallet { padding: 9px 14px; gap: 12px; }
body.at-base .hangar-wallet #credits { color: #e0cfa2; font-size: 26px; }
body.at-base .hangar-deploy { align-self: stretch; }
body.at-base .hangar-deploy #start {
  width: min(340px, 65%);
  min-height: 62px;
  background: linear-gradient(180deg, #ba5d3f, #8f3629);
  border: 1px solid #edba825e;
  border-top-color: #df9b6f;
  border-radius: 1px;
  box-shadow: 0 6px 20px #0008, inset 0 1px #fdd9ad33;
  font-size: 29px;
  letter-spacing: 1.4px;
}
body.at-base .battle-mode {
  min-height: 62px;
  background: #121d22df;
  border-color: #9baca74d;
  color: #d6ded7;
  font: 600 13px 'Barlow Condensed', sans-serif;
  letter-spacing: 1px;
}
body.at-base .hangar-sheet {
  align-self: start;
  max-height: calc(100svh - 407px);
  padding: 17px 19px;
  background: linear-gradient(145deg, #142027ed, #10171be0);
  border-color: var(--hangar-line);
  border-top: 2px solid #b5ac876e;
  box-shadow: 0 15px 32px #0004;
  scrollbar-color: #64726a #172125;
}
body.at-base .sheet-eyebrow { color: #c2bda1; font-size: 9px; letter-spacing: 1px; }
body.at-base #menuHome .hangar-sheet h2 {
  margin-top: 11px;
  font-size: 34px;
  color: #edf0e8;
  line-height: 1.05;
}
body.at-base #overlay .hangar-sheet > p { font-size: 10px; color: #a6b4af; line-height: 1.6; }
body.at-base .tank-stat-list { margin: 15px 0; }
body.at-base .tank-stat-list > div { min-height: 33px; border-color: #b5c2b01b; font-size: 10px; }
body.at-base .tank-stat-list dt { color: #a8b5af; }
body.at-base .tank-stat-list dd { color: #e5e9df; font: 400 10px 'IBM Plex Mono', monospace; }
body.at-base .hangar-ammo select { background: #0c161b; border-color: #91a2974a; min-height: 36px; }
body.at-base .hangar-maintenance { gap: 8px; }
body.at-base .hangar-maintenance #garage { grid-column: 1; grid-row: 1; }
body.at-base .hangar-maintenance #shop { grid-column: 2; grid-row: 1; }
body.at-base .hangar-maintenance #tankShop { grid-row: 2; }
body.at-base .hangar-maintenance button {
  min-height: 38px;
  background: linear-gradient(#344247c2, #253135bc);
  border-color: #aab7a545;
  font-size: 9px;
  color: #dbe0d0;
}
body.at-base .hangar-maintenance #tankShop { background: #455044a3; }
body.at-base .campaign-banner {
  padding: 9px 12px;
  background: #202d2dcf;
  border-color: var(--hangar-line);
  box-shadow: 0 6px 22px #0003;
}
body.at-base .campaign-code { font-size: 24px; color: #c2bca1; }
body.at-base .campaign-banner strong { font-size: 13px; color: #d8ddce; }
body.at-base .mission-card {
  padding: 17px;
  background: linear-gradient(145deg, #17242be3, #10181be3);
  border-color: var(--hangar-line);
  border-top: 2px solid #b5ac876e;
  box-shadow: 0 15px 32px #0004;
}
body.at-base .mission-kicker { font-size: 9px; color: #c6b990; letter-spacing: 1.6px; }
body.at-base .mission-card h3 { font-size: 26px; color: #e1e5d9; line-height: 1.08; margin: 10px 0; }
body.at-base #overlay .mission-card p { font-size: 10.5px; color: #b5c0b8; line-height: 1.6; }
body.at-base .mission-rewards { margin: 11px 0; }
body.at-base .mission-card button { min-height: 38px; color: #d4dccb; }
body.at-base .hangar-tip { background: #142126c9; border-color: #b8b19270; }
body.at-base .hangar-lineup {
  background: linear-gradient(180deg, #19252bf2, #10191ef5);
  border-color: #a4b4a344;
  border-top: 1px solid #c9c7a977;
  box-shadow: 0 -12px 38px #0005;
}
body.at-base .lineup-heading { min-height: 31px; border-color: #b4c2ac27; color: #aebeb4; }
body.at-base .lineup-tab { color: #e1e4d5; border-color: #c9b17d; font-size: 10px; }
body.at-base .vehicle-deck { gap: 8px; padding: 10px; }
body.at-base .hangar-vehicle {
  min-height: 132px;
  padding: 8px;
  background: linear-gradient(155deg, #3b484c, #1b292d);
  border: 1px solid #7e939164;
  box-shadow: inset 0 1px #c7d4c30a;
  color: #b9c8ba;
  transition: border-color .18s, background .18s;
}
body.at-base .hangar-vehicle.selected {
  border-color: #d5c18c;
  background: linear-gradient(155deg, #535b4b, #26342d);
  box-shadow: inset 0 -2px #c9b17d, 0 0 16px #a39a4a16;
}
body.at-base .hangar-vehicle:hover { border-color: #cbd8c2; background: linear-gradient(155deg, #4c5a57, #25332f); }
body.at-base .hangar-vehicle.locked { border-style: solid; }
body.at-base .vehicle-slot { font: 400 7px 'IBM Plex Mono', monospace; color: #a6b8ad; }
body.at-base .vehicle-slot > span { font-size: 6px; color: #bac7b7; }
.vehicle-thumbnail { display: none; width: 100%; height: 71px; object-fit: contain; pointer-events: none; }
.has-thumbnail .vehicle-thumbnail { display: block; }
.has-thumbnail svg { display: none !important; }
body.at-base .hangar-vehicle.locked .vehicle-thumbnail { filter: saturate(.58) brightness(.8); }
body.at-base .vehicle-lock { top: 16px; right: 5px; padding: 3px 4px; z-index: 1; background: #111b1cda; font-size: 5px; border-color: #c2b48b45; }
body.at-base .vehicle-card-name { color: #e3e9d8; font: 700 17px/1 'Barlow Condensed', sans-serif; margin-top: 1px; }
body.at-base #overlay .hangar-vehicle > small { font: 7px 'IBM Plex Mono', monospace !important; color: #a6b9a5; margin-top: 7px; }
body.at-base .lineup-help { border-color: #acb6a02b; padding: 7px 8px 3px; }
body.at-base .lineup-help > span { color: #c2c9b8; font-size: 8px; }
body.at-base #overlay .lineup-help > p { color: #95aaa0; }
body.at-base .lineup-help button { min-height: 28px; background: #34434192; border-color: #94a38849; }
body.at-base .lineup-footer { padding: 6px 13px; color: #93a89b; font-size: 7px; }
body.at-base #saveHint { color: #95ab9a; font-size: 7px; }
body.at-base #menuPanel {
  background: linear-gradient(135deg, #1b2a31f7, #0c161cf5);
  border-color: #a7b3a34d;
  border-top-color: #b6aa82;
  box-shadow: 0 20px 80px #0009;
}
body.at-base #menuPanel h2 { font-size: 38px; color: #e4e8db; }
body.at-base #menuPanel .upgrade { background: #17272ec9; border-color: #8b9e8b3d; }
body.at-base #menuPanel .upgrade b { color: #d9e0ce; }
.customization-preview { border-color: #a8b4a64d; background: #111e24; }
@media (max-height: 820px) {
  body.at-base #menuHome { gap: 12px 22px; grid-template-rows: 58px minmax(210px, 1fr) auto; min-height: 570px; }
  body.at-base .hangar-deploy #start, body.at-base .battle-mode { min-height: 58px; }
  body.at-base .hangar-sheet { max-height: calc(100svh - 380px); padding: 13px 16px; }
  body.at-base #menuHome .hangar-sheet h2 { font-size: 30px; }
  body.at-base .tank-stat-list { margin: 11px 0; }
  body.at-base .tank-stat-list > div { min-height: 29px; padding: 6px 0; }
  body.at-base .hangar-vehicle { min-height: 112px; }
  .vehicle-thumbnail { height: 57px; }
  body.at-base .vehicle-deck { padding: 8px; gap: 7px; }
  body.at-base #menuHome > .hangar-scene .vehicle-placard { bottom: 230px; padding: 8px 25px; }
  body.at-base #menuHome > .hangar-scene .vehicle-placard strong { font-size: 28px; }
  .hangar-orbit-hint { bottom: 231px; font-size: 7px; }
}
@media (max-width: 1120px) {
  body.at-base > header { padding: 0 15px; }
  body.at-base .brand { min-width: 160px; font-size: 22px; }
  body.at-base .header-actions button { padding: 8px 9px; font-size: 8px; }
  body.at-base #overlay { padding-right: 15px; padding-left: 15px; }
  body.at-base #menuHome { grid-template-columns: 220px minmax(240px, 1fr) 205px; column-gap: 14px; }
  body.at-base .vehicle-card-name { font-size: 14px; }
  body.at-base #overlay .hangar-vehicle > small { font-size: 6px !important; }
  .hangar-orbit-hint { right: 15px; }
}
@media (prefers-reduced-motion: reduce) {
  body.at-base .hangar-vehicle { transition: none; }
}
/* Keep the full vehicle visible above a single scrolling catalogue row. */
body.at-base #menuHome{height:calc(100svh - 96px);min-height:0;max-height:none;grid-template-rows:62px minmax(0,1fr) 210px;align-content:stretch}
body.at-base #menuHome>.hangar-scene{position:relative;inset:auto;grid-column:2;grid-row:2;min-height:0;overflow:hidden;border:1px solid #82958b40}
body.at-base #menuHome>.hangar-scene .vehicle-placard{bottom:12px;min-width:0;width:90%;padding:7px 10px}
body.at-base #menuHome>.hangar-scene .vehicle-placard strong{font-size:23px}
body.at-base .hangar-orbit-hint{bottom:75px;right:12px}
body.at-base .hangar-sheet,body.at-base .hangar-missions{min-height:0;max-height:100%;overflow:auto;align-self:stretch;scrollbar-width:thin}
body.at-base .vehicle-deck{display:flex;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;gap:9px;padding:8px 10px;scrollbar-width:thin;scrollbar-color:#9ca98a #172126}
body.at-base .vehicle-deck>.hangar-vehicle{flex:0 0 170px;min-height:128px;height:128px}
body.at-base .vehicle-deck>.lineup-help{display:none}
body.at-base .vehicle-thumbnail{height:64px}
body.at-base .hangar-lineup{min-height:0;overflow:hidden}
body.at-base .lineup-footer{padding:6px 12px}
body.at-base .vehicle-thumbnail{filter:brightness(1.25)}
body.at-base .hangar-vehicle.locked .vehicle-thumbnail{filter:saturate(.7) brightness(1.15)}
@media(max-height:820px){body.at-base #menuHome{grid-template-rows:54px minmax(0,1fr) 180px;gap:10px 18px;height:calc(100svh - 88px)}body.at-base .vehicle-deck>.hangar-vehicle{height:108px;min-height:108px;flex-basis:154px}body.at-base .vehicle-thumbnail{height:48px}body.at-base .hangar-sheet{padding:10px 14px}}
