/* The Last Convoy — field-map briefing identity + responsive polish */
:root{--lc-safe-l:max(12px,env(safe-area-inset-left,0px));--lc-safe-r:max(12px,env(safe-area-inset-right,0px));--lc-safe-t:max(10px,env(safe-area-inset-top,0px));--lc-safe-b:max(10px,env(safe-area-inset-bottom,0px))}
#screen-menu{padding:0;align-items:stretch;justify-content:stretch;background:linear-gradient(135deg,#c6b98f,#8d8c70 60%,#4e5247);overflow:hidden}
#screen-menu::before{content:'';position:absolute;inset:5%;background:repeating-linear-gradient(0deg,transparent 0 34px,rgba(58,63,48,.14) 35px 36px),repeating-linear-gradient(90deg,transparent 0 34px,rgba(58,63,48,.14) 35px 36px);border:1px solid rgba(55,57,47,.35);transform:rotate(-1deg);box-shadow:0 18px 40px rgba(0,0,0,.35);pointer-events:none}
#screen-menu::after{content:'ROUTE K-17   ▲  EXTRACTION   ●  CHECKPOINT   ╳  HOSTILE';position:absolute;left:max(7%,var(--lc-safe-l));right:max(7%,var(--lc-safe-r));bottom:calc(7% + env(safe-area-inset-bottom,0px));padding:.5rem .7rem;background:#3f473b;color:#ece5c8;font:800 .7rem/1 ui-monospace,monospace;letter-spacing:.11em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#screen-menu .panel{position:absolute;inset:0;width:100%;max-width:none;max-height:none;padding:0;background:transparent;border:0;box-shadow:none;text-align:left;overflow:visible}
#screen-menu .panel::before,#screen-menu .panel::after{display:none!important}
#screen-menu .eyebrow{position:absolute;left:max(8%,var(--lc-safe-l));top:10%;background:#b44a34;color:#fff4dc;border-radius:0;padding:.3rem .65rem;font-family:ui-monospace,monospace;letter-spacing:.15em;transform:rotate(-2deg);box-shadow:4px 4px 0 #4b352b}
#screen-menu h1{position:absolute;left:max(8%,var(--lc-safe-l));top:18%;margin:0!important;max-width:55%;background:none!important;color:#263129!important;font:900 clamp(3rem,8vw,6.4rem)/.76 Impact,system-ui!important;letter-spacing:-.035em!important;text-shadow:none!important;transform:rotate(-1deg)}
#screen-menu h1 span{display:block;color:#8c392a!important;font-size:.58em;letter-spacing:.02em}
#screen-menu .subtitle{position:absolute;left:max(8%,var(--lc-safe-l));top:48%;width:min(44vw,520px);margin:0;background:rgba(239,230,196,.78);color:#30392f;border-left:6px solid #3d473c;padding:.75rem .9rem;font-family:Georgia,serif;font-size:.9rem;line-height:1.45}
#screen-menu .stat-strip{position:absolute;right:max(8%,var(--lc-safe-r));top:10%;width:min(28vw,330px);display:grid;gap:5px;margin:0;background:transparent;border:0;transform:rotate(1deg)}
#screen-menu .stat-strip span{background:#e8dfc4;color:#2f382f;border:2px solid #3f493f;border-radius:0;padding:.55rem .7rem;font:800 .72rem/1 ui-monospace,monospace;box-shadow:4px 4px 0 rgba(52,58,48,.38)}
#screen-menu .menu-actions{position:absolute;right:max(8%,var(--lc-safe-r));top:39%;width:min(29vw,340px);display:flex;flex-direction:column;gap:7px;margin:0}
#screen-menu .menu-actions button{min-height:50px;border-radius:0!important;border:2px solid #384239!important;background:#d8d0b4!important;color:#2f382f!important;box-shadow:4px 4px 0 #535b4e!important;text-align:left;padding:.6rem .75rem!important;font:900 .75rem/1 ui-monospace,monospace!important;text-transform:uppercase;letter-spacing:.07em}
#screen-menu .menu-actions button.primary{min-height:70px;background:#3f493f!important;color:#f4ecd0!important;border-color:#252c25!important;box-shadow:6px 6px 0 #252c25!important;font-size:.9rem!important}
#screen-how .panel,#screen-leaderboard .panel,#screen-draft .panel,#screen-gameover .panel{background:#ded5b8!important;color:#2d352d!important;border-radius:0!important;border:2px solid #3a453b!important;box-shadow:8px 8px 0 #2b322c!important;text-align:left!important;max-height:calc(100dvh - var(--lc-safe-t) - var(--lc-safe-b) - 18px);overflow:auto}
#screen-gameover h2{background:none!important;color:#8c392a!important;text-shadow:none!important}
#screen-how,#screen-leaderboard,#screen-draft,#screen-gameover{padding:var(--lc-safe-t) var(--lc-safe-r) var(--lc-safe-b) var(--lc-safe-l)}
.game-bar{padding-left:var(--lc-safe-l);padding-right:var(--lc-safe-r);padding-top:max(0px,env(safe-area-inset-top,0px))}
.hud{padding-left:var(--lc-safe-l);padding-right:var(--lc-safe-r)}
.lc-actionbar{left:var(--lc-safe-l)!important;right:var(--lc-safe-r)!important;max-width:none!important}
.lc-undo{left:var(--lc-safe-l)!important;bottom:calc(12px + env(safe-area-inset-bottom,0px))!important}
.lc-endturn{right:var(--lc-safe-r)!important;bottom:calc(12px + env(safe-area-inset-bottom,0px))!important}
button,a{touch-action:manipulation}
.icon-btn,.hud-btn,.menu-actions button,.lc-undo,.lc-endturn,.lc-acts button,.lc-draft button,.nn-nudge-signup,.nn-nudge-later{min-height:44px}
.icon-btn,.hud-btn{min-width:44px}
button:focus-visible,a:focus-visible{outline:3px solid #f0d26f;outline-offset:3px}
@media(max-width:700px){
  #screen-menu{overflow:auto}
  #screen-menu::before{inset:2%;opacity:.7}
  #screen-menu::after{left:var(--lc-safe-l);right:var(--lc-safe-r);bottom:calc(var(--lc-safe-b) + 5px);font-size:.5rem;letter-spacing:.06em}
  #screen-menu .panel{position:relative;display:grid;grid-template-rows:auto auto auto auto 1fr;align-content:start;gap:8px;min-height:100%;padding:calc(var(--lc-safe-t) + 18px) var(--lc-safe-r) calc(var(--lc-safe-b) + 52px) var(--lc-safe-l);overflow:auto}
  #screen-menu .eyebrow,#screen-menu h1,#screen-menu .subtitle,#screen-menu .stat-strip,#screen-menu .menu-actions{position:static;left:auto;right:auto;top:auto;bottom:auto;transform:none;width:min(92vw,560px);max-width:100%;justify-self:center}
  #screen-menu .eyebrow{width:auto;justify-self:start;font-size:.56rem}
  #screen-menu h1{font-size:clamp(2.6rem,14vw,5rem)!important}
  #screen-menu .subtitle{font-size:.74rem;padding:.55rem .65rem}
  #screen-menu .stat-strip{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
  #screen-menu .stat-strip span{min-width:0;font-size:.62rem}
  #screen-menu .menu-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:auto 0 0}
  #screen-menu .menu-actions button,#screen-menu .menu-actions button.primary{min-height:46px;font-size:.62rem!important;padding:.5rem .6rem!important}
  #screen-menu .menu-actions button.primary{grid-column:1/-1;min-height:54px}
  #screen-how .panel,#screen-leaderboard .panel,#screen-draft .panel,#screen-gameover .panel{width:min(94vw,680px);padding:16px 14px}
  .how-grid{grid-template-columns:1fr!important}
  .hud-top{gap:5px;overflow-x:auto;scrollbar-width:none}
  .hud-chip{flex:0 0 auto}
  .lc-actionbar{bottom:calc(58px + env(safe-area-inset-bottom,0px))!important}
}
@media(max-height:520px) and (orientation:landscape){
  #screen-menu .panel{grid-template-columns:minmax(250px,.9fr) minmax(360px,1.1fr);grid-template-rows:auto auto 1fr;gap:6px 18px;padding:calc(var(--lc-safe-t) + 8px) var(--lc-safe-r) calc(var(--lc-safe-b) + 34px) var(--lc-safe-l)}
  #screen-menu .eyebrow{grid-column:1;grid-row:1;align-self:end}
  #screen-menu h1{grid-column:1;grid-row:2;font-size:clamp(2.1rem,10vh,3.2rem)!important}
  #screen-menu .subtitle{grid-column:1;grid-row:3;width:100%;font-size:.61rem;align-self:start}
  #screen-menu .stat-strip{grid-column:2;grid-row:1;width:100%;grid-template-columns:repeat(2,minmax(0,1fr));align-self:end}
  #screen-menu .menu-actions{grid-column:2;grid-row:2/4;width:100%;grid-template-columns:repeat(2,minmax(0,1fr));align-self:center}
  #screen-menu .menu-actions button,#screen-menu .menu-actions button.primary{grid-column:auto;min-height:44px;font-size:.56rem!important}
  #screen-menu .menu-actions button.primary{grid-column:1/-1}
  #screen-how .panel,#screen-leaderboard .panel,#screen-draft .panel,#screen-gameover .panel{width:min(94vw,900px);padding:12px 16px}
  .how-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}
