/* css/overrides.css — CROSS-MODULE responsive and print blocks, and it MUST LOAD LAST (#362).

   These @media blocks each style selectors belonging to more than one module,
   so they cannot live in any single module file. In the original single
   css/app.css they sat AFTER the base rules they override, and CSS resolves a
   same-specificity tie by document order — so putting them in core.css, which
   loads first, silently killed them.

   MEASURED, before this file existed: at a 1000px viewport (inside
   @media(max-width:1100px)) Live Fleet's .map-wrap rendered as TWO columns
   '300px 394px' instead of the single '712px' column master gives — the
   responsive override had lost the tie. A 1600px computed-style diff could not
   see it, which is why tests/css-split-check.js checks selector ownership
   rather than trusting a render at one width. */

@media print{.cn-warn{display:none}}
@media(max-width:1100px){.rep-grid{grid-template-columns:1fr}.rep-2{grid-template-columns:1fr}.comp-flow{columns:1}}
@media print{
  .sidebar,.topbar,.cn-toolbar,.ptoast,.toast{display:none!important}
  .main,.view,#app{display:block!important;padding:0!important;margin:0!important}
  .cn-sheet{border:none;max-width:100%}
  @page{size:A4 portrait;margin:10mm}
}
/* ---------- Responsive / tablet ---------- */
@media(max-width:1100px){
  .kpis{grid-template-columns:repeat(2,1fr)}
  .dash-row{grid-template-columns:1fr}
  .board{grid-template-columns:repeat(2,1fr)}
  .detail{grid-template-columns:1fr}
  .map-wrap{grid-template-columns:1fr;height:auto}
  #map{height:60vh}
}
@media(max-width:820px){
  .sidebar{position:fixed;left:0;top:0;z-index:60;transform:translateX(-100%);transition:transform .25s;box-shadow:0 0 40px rgba(0,0,0,.4)}
  @media(prefers-reduced-motion:reduce){.sidebar{transition:none}}
  .sidebar.is-open{transform:translateX(0)}
  /* Tighter brand in the mobile drawer — it scrolls away with the menu */
  .brand{padding:14px 20px 10px;gap:6px}
  .brand__mark{width:64px}
  .brand__word{font-size:21px;border-bottom-width:3px;padding-bottom:4px}
  .brand__app{font-size:11px;letter-spacing:2px}
  .nav__item{padding:11px 15px}
  .hamburger{display:block}
  .view{padding:18px}
  .board{grid-template-columns:1fr}
  .user__name{display:none}
}
@media(max-width:820px){
  .ld-vals{grid-template-columns:1fr auto}
  .chk-bar{flex-direction:column;align-items:stretch}
}