@font-face { font-family: "Fraunces"; src: url("fonts/Fraunces-Variable.ttf") format("truetype"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Archivo Narrow"; src: url("fonts/ArchivoNarrow-Variable.ttf") format("truetype"); font-weight: 400 700; font-display: swap; }

:root {
  --night: #0d1427;
  --slate: #303856;
  --snow: #f7f2e7;
  --ichu: #d7a642;
  --mineral: #a7382f;
  --glacier: #36b8c5;
  --ink: #12121a;
  --panel: rgba(10, 15, 27, .88);
}

* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; background: var(--night); color: var(--snow); font-family: "Archivo Narrow", sans-serif; touch-action: none; }
button, a { font: inherit; }
button { color: inherit; }

#game-shell { position: fixed; inset: 0; overflow: hidden; background: #0c1324; }
#game { width: 100%; height: 100%; display: block; background: var(--night); }
.screen { position: absolute; inset: 0; z-index: 20; }
[hidden] { display: none !important; }

.title-screen { background: url("assets/title-tableau-v1.webp") center/cover no-repeat; }
.title-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(7,10,20,.9) 0%, rgba(7,10,20,.52) 37%, rgba(7,10,20,.04) 70%), linear-gradient(0deg, rgba(4,7,14,.72), transparent 48%); }
.arcade-back { position: absolute; top: calc(24px + env(safe-area-inset-top)); left: calc(28px + env(safe-area-inset-left)); padding: 10px 13px; color: var(--snow); border: 1px solid rgba(255,255,255,.35); text-decoration: none; letter-spacing: .18em; font-size: 12px; z-index: 2; }
.title-lockup { position: absolute; z-index: 2; left: max(7vw, 62px); top: 50%; transform: translateY(-46%); width: min(560px, 43vw); }
.eyebrow { margin: 0 0 14px; color: var(--ichu); font-size: clamp(11px, 1.1vw, 14px); font-weight: 700; letter-spacing: .2em; text-transform: uppercase; }
h1 { margin: 0; text-transform: uppercase; line-height: .78; text-shadow: 0 8px 32px rgba(0,0,0,.35); }
h1 span { display: block; margin: 0 0 13px 4px; font-size: clamp(18px, 2.2vw, 30px); letter-spacing: .34em; font-weight: 600; }
h1 strong { font-family: "Fraunces", Georgia, serif; font-size: clamp(60px, 8.5vw, 126px); font-weight: 900; letter-spacing: -.065em; }
.title-copy { max-width: 410px; margin: 28px 0 25px; font-size: clamp(17px, 1.7vw, 23px); color: rgba(247,242,231,.78); }
.title-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.title-actions button, .close-button, .debrief button, .debrief a { appearance: none; border: 1px solid rgba(255,255,255,.36); background: rgba(9,13,24,.58); padding: 13px 18px; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; cursor: pointer; backdrop-filter: blur(10px); }
.title-actions .primary, .debrief .primary { background: var(--mineral); border-color: #d66554; }
.title-actions button:hover, .title-actions button:focus-visible { transform: translateY(-2px); border-color: var(--snow); }
.altimeter { position: absolute; right: 28px; bottom: 26px; z-index: 2; text-align: right; color: rgba(247,242,231,.75); letter-spacing: .15em; }
.altimeter span,.altimeter em { display: block; font-size: 10px; font-style: normal; }
.altimeter strong { display: block; font-family: "Fraunces", serif; font-size: 34px; color: var(--snow); }

.fieldbook { display: grid; place-items: center; padding: 7vw; background: linear-gradient(rgba(8,13,25,.82),rgba(8,13,25,.94)), url("assets/andean-battle-plate-v1.webp") center/cover; }
.fieldbook-copy { max-width: 1000px; }
.fieldbook h2, .debrief h2 { margin: 0 0 34px; font-family: "Fraunces", serif; font-size: clamp(44px, 7vw, 92px); line-height: .95; letter-spacing: -.04em; }
.field-columns { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; background: rgba(255,255,255,.18); }
.field-columns article { padding: 24px; background: rgba(10,15,28,.91); }
.field-columns b { color: var(--ichu); text-transform: uppercase; letter-spacing: .1em; }
.field-columns p { color: rgba(247,242,231,.72); line-height: 1.55; }
.close-button { position: absolute; top: 24px; right: 24px; }

#hud { position: absolute; z-index: 10; inset: 0 0 auto; height: 78px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: start; padding: calc(12px + env(safe-area-inset-top)) 22px 0; pointer-events: none; background: linear-gradient(rgba(8,12,24,.8),transparent); text-shadow: 0 2px 5px #000; }
#hud span { display: block; font-size: 10px; color: rgba(247,242,231,.62); letter-spacing: .16em; }
#hud b, #hud strong { font-size: 19px; letter-spacing: .06em; }
.team-readout strong { color: var(--snow); }
.wind-readout { text-align: center; min-width: 160px; }
.wind-readout i { display: inline-block; color: var(--glacier); font-style: normal; font-size: 23px; margin: 0 8px; }
.turn-clock { text-align: right; }
.turn-clock b { color: var(--ichu); font-size: 29px; }

#controls { position: absolute; z-index: 12; left: 0; right: 0; bottom: 0; min-height: 74px; padding: 8px max(12px,env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left)); display: grid; grid-template-columns: minmax(230px,.9fr) minmax(280px,1.1fr) minmax(220px,.85fr); gap: 8px; align-items: stretch; background: linear-gradient(transparent,rgba(5,8,15,.94) 24%); }
.move-pad { display: grid; grid-template-columns: repeat(3,1fr); gap: 6px; }
#controls button { appearance: none; position: relative; overflow: hidden; border: 1px solid rgba(207,225,223,.2); background: linear-gradient(180deg,rgba(20,28,43,.9),rgba(7,11,20,.94)); min-height: 58px; color: var(--snow); text-transform: uppercase; letter-spacing: .06em; font-weight: 700; border-radius: 2px; box-shadow: inset 0 1px rgba(255,255,255,.045),0 6px 18px rgba(0,0,0,.16); }
#controls button::after { content:""; position:absolute; inset:1px; border-top:1px solid rgba(255,255,255,.05); pointer-events:none; }
#controls button.active { border-color: var(--glacier); background: linear-gradient(180deg,#47c8ce,#16838f); color: var(--ink); transform: translateY(2px); }
.weapon-button { display: grid; grid-template-columns: 118px 1fr; align-items: center; padding: 0 14px 0 5px; border-color: rgba(215,166,66,.43) !important; text-align: left; }
.weapon-button canvas { width: 118px; height: 52px; display:block; }
.weapon-button span { min-width:0; border-left:1px solid rgba(215,166,66,.28); padding-left:13px; }
.weapon-button b,.weapon-button small { display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.weapon-button b { color:var(--snow); font-size:15px; }
.weapon-button small { margin-top:5px; color:var(--ichu); font-size:9px; letter-spacing:.16em; }
.view-pad { display:grid; grid-template-columns:minmax(130px,1fr) auto; align-items:stretch; gap:9px; }
.view-pad button { border-color:rgba(54,184,197,.4) !important; }
.view-pad button.is-overview { background:linear-gradient(180deg,#3eb9c5,#176674); color:#071019; }
.view-pad b,.view-pad small { display:block; }
.view-pad small { margin-top:5px; opacity:.55; font-size:9px; }
.view-pad p { align-self:center; margin:0; color:rgba(247,242,231,.5); font-size:10px; line-height:1.35; letter-spacing:.08em; text-transform:uppercase; }

#gesture-hint { position:absolute; z-index:11; left:50%; bottom:82px; transform:translateX(-50%); display:flex; align-items:center; gap:9px; padding:8px 13px 8px 9px; background:rgba(7,11,21,.78); border:1px solid rgba(215,166,66,.32); backdrop-filter:blur(8px); color:rgba(247,242,231,.8); font-size:11px; letter-spacing:.07em; text-transform:uppercase; pointer-events:none; }
#gesture-hint i { width:22px; height:22px; border:2px solid var(--ichu); border-radius:50%; box-shadow:0 0 0 4px rgba(215,166,66,.12); }
#gesture-hint b { color:var(--snow); }

#weapon-rack { position: absolute; z-index: 30; left: 50%; bottom: 94px; transform: translateX(-50%); width: min(840px,calc(100% - 28px)); padding: 16px; background: rgba(8,12,22,.96); border: 1px solid rgba(255,255,255,.2); box-shadow: 0 24px 70px rgba(0,0,0,.52); backdrop-filter: blur(16px); }
.rack-heading { display: flex; justify-content: space-between; align-items: center; padding: 0 2px 12px; color: var(--ichu); letter-spacing: .15em; }
.rack-heading button { border: 0; background: transparent; color: var(--snow); text-transform: uppercase; }
#weapon-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 7px; }
.weapon-choice { border: 1px solid rgba(255,255,255,.14); background: linear-gradient(160deg,rgba(255,255,255,.055),rgba(255,255,255,.015)); min-height: 138px; padding: 9px 12px 12px; text-align: left; cursor: pointer; }
.weapon-choice.selected { border-color: var(--glacier); background: rgba(54,184,197,.15); }
.weapon-choice canvas { display:block; width:100%; height:58px; margin-bottom:5px; }
.weapon-choice b,.weapon-choice span,.weapon-choice small { display: block; }
.weapon-choice span { margin: 5px 0; color: var(--ichu); font-size: 11px; letter-spacing: .1em; }
.weapon-choice small { color: rgba(247,242,231,.55); line-height: 1.25; }

#toast { position: absolute; z-index: 11; top: 96px; left: 50%; transform: translate(-50%,-10px); padding: 8px 13px; background: rgba(8,12,22,.82); border-left: 2px solid var(--ichu); font-size: 13px; letter-spacing: .08em; text-transform: uppercase; opacity: 0; transition: .2s; pointer-events: none; }
#toast.show { opacity: 1; transform: translate(-50%,0); }
.debrief { display: grid; place-items: center; padding: 8vw; text-align: center; background: radial-gradient(circle at center,rgba(28,45,69,.72),rgba(6,9,18,.97)), url("assets/andean-battle-plate-v1.webp") center/cover; }
.debrief>div { max-width: 760px; }
.debrief p { color: rgba(247,242,231,.7); font-size: 20px; }
.debrief button,.debrief a { display: inline-block; margin: 14px 5px; color: var(--snow); text-decoration: none; }

#orientation-gate { position:absolute; z-index:60; inset:0; display:grid; place-content:center; justify-items:center; padding:28px; text-align:center; background:linear-gradient(rgba(7,11,21,.9),rgba(7,11,21,.97)),url("assets/andean-battle-plate-v1.webp") center/cover; }
#orientation-gate h2 { max-width:440px; margin:0 0 10px; font:800 clamp(40px,12vw,66px)/.92 "Fraunces",serif; letter-spacing:-.05em; }
#orientation-gate>p:last-child { max-width:390px; margin:0; color:rgba(247,242,231,.65); font-size:16px; line-height:1.45; }
.turn-phone { width:78px; height:78px; margin-bottom:18px; border:1px solid rgba(54,184,197,.35); border-radius:50%; display:grid; place-items:center; }
.turn-phone i { display:block; width:25px; height:43px; border:3px solid var(--snow); border-radius:5px; transform:rotate(90deg); box-shadow:0 0 24px rgba(54,184,197,.35); }

@media (max-width: 760px) {
  .title-screen { background-position: 62% center; }
  .title-shade { background: linear-gradient(0deg,rgba(7,10,20,.96) 0%,rgba(7,10,20,.65) 48%,rgba(7,10,20,.12) 100%); }
  .title-lockup { left: 24px; right: 24px; top: auto; bottom: calc(24px + env(safe-area-inset-bottom)); width: auto; transform: none; }
  h1 strong { font-size: clamp(54px,17vw,88px); }
  h1 span { font-size: 16px; }
  .title-copy { margin: 18px 0; font-size: 17px; }
  .title-actions button { flex: 1 1 45%; padding: 12px 8px; }
  .altimeter { display: none; }
  .fieldbook { padding: 72px 18px 110px; overflow-y: auto; display: block; }
  .fieldbook h2 { font-size: 48px; }
  .field-columns { grid-template-columns: 1fr; }
  #hud { height: 66px; padding-inline: 11px; }
  #hud b,#hud strong { font-size: 14px; }
  .wind-readout { min-width: 88px; }
  .turn-clock b { font-size: 24px; }
  #weapon-grid { grid-template-columns: repeat(2,1fr); }
}

@media (orientation:portrait) and (max-width:900px) {
  body.in-battle #orientation-gate { display:grid !important; }
}

@media (orientation:landscape) and (max-height:540px) {
  .title-lockup { left:max(5vw,42px); width:min(490px,52vw); }
  h1 span { margin-bottom:7px; font-size:14px; }
  h1 strong { font-size:clamp(47px,9.7vw,82px); }
  .title-copy { margin:14px 0; font-size:15px; }
  .title-actions button { padding:10px 13px; font-size:12px; }
  .arcade-back { top:14px; left:16px; padding:8px 10px; font-size:9px; }
  .altimeter { right:18px; bottom:18px; }
  #hud { height:54px; padding:calc(7px + env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) 0 max(12px,env(safe-area-inset-left)); }
  #hud span { font-size:8px; }
  #hud b,#hud strong { font-size:13px; }
  .turn-clock b { font-size:20px; }
  #controls { min-height:62px; grid-template-columns:minmax(194px,.82fr) minmax(260px,1.12fr) minmax(185px,.8fr); padding-top:5px; gap:6px; }
  #controls button { min-height:49px; font-size:11px; }
  .move-pad { gap:4px; }
  .weapon-button { grid-template-columns:104px 1fr; padding-right:8px; }
  .weapon-button canvas { width:102px; height:44px; }
  .weapon-button span { padding-left:9px; }
  .weapon-button b { font-size:12px; }
  .view-pad { gap:5px; }
  .view-pad p { font-size:8px; }
  #gesture-hint { bottom:65px; padding-block:6px; font-size:9px; }
  #weapon-rack { bottom:66px; width:min(850px,calc(100% - 24px)); max-height:calc(100% - 76px); overflow:auto; padding:10px; }
  #weapon-grid { grid-template-columns:repeat(4,1fr); }
  .weapon-choice { min-height:112px; padding:6px 8px 8px; }
  .weapon-choice canvas { height:42px; }
  .weapon-choice small { display:none; }
  .weapon-choice span { margin:3px 0; font-size:8px; }
}

@media (prefers-reduced-motion: reduce) { *,*::before,*::after { transition: none !important; animation: none !important; } }

/* Combat pass: the original landscape and expedition styling remain the frame. */
button{cursor:pointer}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--glacier);outline-offset:3px}button:disabled{cursor:default;opacity:.42}.expedition-options{display:flex;gap:12px;margin:0 0 16px;max-width:470px}.expedition-options label{flex:1;color:var(--ichu);font-size:10px;letter-spacing:.13em;text-transform:uppercase}.expedition-options select{display:block;width:100%;margin-top:5px;padding:9px;color:var(--snow);font:14px "Archivo Narrow",sans-serif;border:1px solid #ffffff38;background:#101726e8;border-radius:2px;letter-spacing:0}.title-lockup{width:min(600px,47vw)}
#pause-button{position:absolute;right:max(14px,env(safe-area-inset-right));top:calc(13px + env(safe-area-inset-top));z-index:15;width:42px;height:38px;border:1px solid #ffffff35;background:#0d1427cc;color:var(--snow);font-size:19px;border-radius:3px}#hud{padding-right:76px}.turn-clock.danger b{color:#ff7667}
#team-strip{position:absolute;z-index:10;top:67px;left:22px;right:22px;display:flex;justify-content:space-between;gap:24px;pointer-events:none}.expedition-roster{display:flex;gap:5px;pointer-events:auto}.roster-slug{min-width:46px;min-height:29px;padding:4px 7px;color:var(--snow);background:#0b111ed9;border:1px solid #ffffff28;border-bottom:2px solid var(--team);font:700 10px "Archivo Narrow",sans-serif;letter-spacing:.06em}.roster-slug.active{background:var(--team);color:#071019}.roster-slug.dead{opacity:.3;text-decoration:line-through}.roster-slug small{display:block;font-size:8px;opacity:.75;margin-top:2px}
#tactical-bar{position:absolute;z-index:13;left:50%;bottom:85px;transform:translateX(-50%);display:flex;align-items:center;gap:18px;max-width:calc(100% - 26px);padding:9px 12px;background:#0b101ddb;border:1px solid #ffffff26;backdrop-filter:blur(8px)}#tactical-bar b{display:block;color:var(--ichu);font-size:11px;letter-spacing:.1em}#tactical-bar span{display:block;margin-top:3px;font-size:12px;color:#ece6d5cc}#secondary-action{min-width:105px;min-height:42px;border:1px solid #d7a64288;color:var(--snow);background:#64502d66;font:700 12px "Archivo Narrow",sans-serif;text-transform:uppercase;letter-spacing:.06em}#secondary-action:active{background:#d7a642;color:#101726}#gesture-hint{bottom:150px;font-size:10px;border:0;background:#0a0f1c99;padding:6px 10px;opacity:.85}#gesture-hint i{width:16px;height:16px}
#shot-report{position:absolute;z-index:11;top:118px;left:50%;transform:translateX(-50%);background:#101626ec;padding:10px 22px;border-bottom:2px solid var(--glacier);font-size:15px;text-align:center;text-transform:uppercase;letter-spacing:.08em;pointer-events:none}#shot-report small{display:block;color:#f7f2e799;font-size:10px;margin-top:4px}#toast{top:112px}.weapon-choice{position:relative}.weapon-choice .ammo-count{position:absolute;top:9px;right:10px;font-size:11px;font-weight:700;color:var(--snow);letter-spacing:0}.weapon-choice small{font-size:12px;line-height:1.4}.weapon-choice .weapon-tactic{font-size:10px;color:#7bced3;letter-spacing:0;margin-top:6px}.weapon-choice[disabled]{opacity:.35}.weapon-choice:focus-visible{outline:2px solid var(--glacier)}#weapon-rack{max-height:calc(100dvh - 125px);overflow:auto;touch-action:pan-y}#weapon-rack *{touch-action:pan-y}
#pause-menu{max-width:460px;width:calc(100% - 34px);max-height:calc(100dvh - 30px);overflow:auto;border:1px solid #d7a64266;background:#0d1427f5;color:var(--snow);padding:30px;box-shadow:0 25px 100px #0009}#pause-menu::backdrop{background:#050b18aa;backdrop-filter:blur(6px)}#pause-menu h2{font:800 44px/.95 "Fraunces",serif;letter-spacing:-.04em;margin:0 0 18px}#pause-menu p{font-size:14px;color:#f7f2e7aa}#pause-menu .eyebrow{color:var(--ichu)}#pause-menu button{display:block;width:100%;min-height:46px;margin-top:10px;border:1px solid #ffffff30;background:#ffffff09;font:700 13px "Archivo Narrow",sans-serif;text-transform:uppercase;letter-spacing:.1em}#pause-menu button.primary{background:var(--mineral);border-color:#d66554}.settings-row{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0}.settings-row label{font-size:13px;display:flex;align-items:center;gap:5px}.settings-row input{accent-color:var(--glacier);width:17px;height:17px}#checkpoint-note{line-height:1.4}
@media(orientation:landscape) and (max-height:540px){.title-lockup{top:50%;bottom:auto;transform:translateY(-42%);width:56vw}.title-copy{margin:9px 0}.expedition-options{margin-bottom:8px;max-width:410px}.expedition-options label{font-size:8px}.expedition-options select{padding:5px;font-size:11px}.title-actions button{padding:8px 10px}.title-lockup>.eyebrow{display:none}#pause-button{top:7px;height:34px;width:37px}#hud{padding-right:63px}#team-strip{top:48px;left:12px;right:12px}.roster-slug{min-height:25px;min-width:42px;padding:3px 5px;font-size:9px}.roster-slug small{display:none}#tactical-bar{bottom:66px;padding:6px 10px;gap:10px}#tactical-bar b{font-size:9px}#tactical-bar span{font-size:10px}#secondary-action{min-height:34px;font-size:10px}#gesture-hint{display:none!important}#toast{top:83px;font-size:11px}#shot-report{top:81px;font-size:12px;padding:7px 13px}#pause-menu{padding:20px}#pause-menu h2{font-size:30px}}
@media(orientation:portrait) and (max-width:900px){body.in-battle #orientation-gate{display:none!important}.title-lockup{left:22px;right:22px;bottom:calc(24px + env(safe-area-inset-bottom));top:auto;width:auto;transform:none}.title-lockup>.eyebrow{font-size:10px}.title-copy{font-size:16px}.expedition-options{gap:8px}.expedition-options select{font-size:12px;padding:8px}.title-actions button{flex:1 1 42%;font-size:12px}#controls{grid-template-columns:1fr 1fr;gap:7px;padding:8px 10px calc(10px + env(safe-area-inset-bottom));min-height:120px}.move-pad{grid-column:1}.weapon-button{grid-column:2;grid-row:1;grid-template-columns:54px 1fr;padding:0 5px;min-width:0}.weapon-button canvas{width:54px;height:42px}.weapon-button span{padding-left:6px}.weapon-button b{font-size:11px}.weapon-button small{font-size:7px;letter-spacing:.08em}.view-pad{grid-column:1 / -1;grid-template-columns:1fr;max-height:44px}.view-pad button{min-height:44px!important;font-size:10px}.view-pad button b,.view-pad button small{display:inline;margin:0 6px}.view-pad p{display:none}#controls .move-pad button{font-size:12px;min-height:52px}#tactical-bar{bottom:calc(126px + env(safe-area-inset-bottom));width:calc(100% - 20px);gap:8px;padding:8px 10px}#tactical-bar>div{flex:1;min-width:0}#tactical-bar b{font-size:10px}#tactical-bar span{font-size:11px;line-height:1.3}#secondary-action{min-width:92px;min-height:40px;font-size:10px}#gesture-hint{bottom:calc(199px + env(safe-area-inset-bottom));font-size:8px;white-space:nowrap;max-width:95%;padding:6px}#gesture-hint i{display:none}#hud{padding-right:62px}#pause-button{top:12px;width:35px;height:33px}#hud .wind-readout{min-width:76px}#hud span{font-size:7px}#hud b,#hud strong{font-size:13px}#team-strip{left:11px;right:11px;top:61px;gap:8px}.expedition-roster{gap:3px}.roster-slug{min-width:31px;padding:4px;font-size:8px;letter-spacing:0}.roster-slug small{font-size:7px}#toast{top:115px;max-width:92%;font-size:10px;white-space:nowrap}#shot-report{top:114px;width:max-content;max-width:90%;font-size:12px}#weapon-rack{bottom:calc(125px + env(safe-area-inset-bottom));max-height:calc(100dvh - 160px);padding:12px}#weapon-grid{grid-template-columns:1fr 1fr}.weapon-choice{min-height:145px;padding:9px}.weapon-choice canvas{height:46px}.weapon-choice small{font-size:11px}.weapon-choice b{font-size:13px}.weapon-choice span{font-size:9px}.fieldbook h2{font-size:39px}.field-columns article{padding:16px}.debrief h2{font-size:47px}}
