/* app-dark.css — MARKER-67 (2026-09-23), F4 E6: the dark colour scheme.
   Reviewer (GPT_VERDICT_AQ E6): "Dark mode is a binding product requirement in the master plan, not N/A
   merely because the current CSS lacks it." F3 had no dark scheme at all, and no custom properties to
   swap: every colour is a literal in app.css / app-fixes.css. So this file restates each coloured rule,
   under the SAME selector, inside one prefers-color-scheme block. Same selector + a later file = it wins
   in dark and is inert in light. Nothing sits outside the block, so the light scheme cannot move.
   layout.php loads it after app-fixes.css and declares <meta name="color-scheme" content="light dark">,
   so the browser's own parts (scrollbars, date pickers, checkboxes) follow the scheme too.

   Held by m67/contrast.py: every colour, background, border and shadow set in the two light files has an
   override here (C4); every text/background pair the model derives is >= 4.5:1, >= 3:1 for large text,
   focus rings and control/severity edges, in both schemes (C1/C2); nothing here is outside the block (C7).
   Rule order inside the block mirrors the light files, because equal-specificity pairs (nav a:hover vs
   nav a.active, .form button vs button.danger) are decided by source order in both schemes.

   Palette: page #0f1419 · surface #171d24 · raised #222a33 / #2a323c · edge #2c3540 · field edge #6b7682
   ink #e6e9ee · secondary #b4bcc6 · muted #9aa4af · link and focus #8ab4f8.
   Buttons and the active nav item invert (light fill, dark ink): a near-black button on a near-black card
   would have no edge at all. The CSP is style-src 'self' — no inline style anywhere, this file included. */
@media (prefers-color-scheme: dark){
  /* ── app.css ── */
  body{background:#0f1419;color:#e6e9ee}
  aside{background:#171d24;border-left-color:#2c3540}
  .brand i{background:#e6e9ee;color:#11161c}
  .brand small{color:#9aa4af}
  nav a{color:#b4bcc6}
  nav a:hover{background:#222a33;color:#f3f5f8}
  header span{color:#9aa4af}
  header p{color:#b4bcc6}
  .card{background:#171d24;border-color:#2c3540;box-shadow:0 5px 20px rgba(0,0,0,.35)}
  .form label{color:#c3cad3}
  .form input,.form select{border-color:#6b7682;background:#0f1419;color:#e6e9ee}
  .form button,button{background:#dfe4ea;color:#11161c}
  .ghost{background:#2a323c;color:#e6e9ee}
  td,th{border-bottom-color:#2c3540}
  th{color:#9aa4af}
  .alert{border-right-color:#3a4450}
  .alert.critical{border-right-color:#f26d6d}
  .alert.warning{border-right-color:#f0b43c}
  .kpis b{background:#171d24;border-color:#2c3540}
  .toast{background:#2a323c;color:#f0f3f6;box-shadow:0 4px 18px rgba(0,0,0,.5)}
  .toast.err{background:#8b2323}
  .login{background:radial-gradient(circle at 60% 20%,#1c232b,#12171d 55%,#0c1015)}
  .auth p{color:#9aa4af}
  .muted{color:#9aa4af}
  .badge{background:#2a323c;color:#d5dbe2}
  .badge.ok{background:#12351f;color:#7ee2a0}
  .badge.bad{background:#3d1a1a;color:#ffb4ab}
  .btn{background:#dfe4ea;color:#11161c}
  .btn.ghost{background:#2a323c;color:#e6e9ee}
  .bar{background:#222a33}
  .bar .out{background:#7d8899}
  .bar .in{background:#3d8fb8}
  .bar .accrued{background:#b5e0f2}
  .tile{border-inline-start-color:#3a4450}
  .tile.ok{border-inline-start-color:#57c26a}
  .tile.warn{border-inline-start-color:#f59e42}
  .tile.bad{border-inline-start-color:#f26d6d}
  .pos{color:#6fdc8c}
  .neg{color:#ff8a80}
  nav a.active,.tabs a.active{background:#dfe4ea;color:#11161c}
  .tabs a{color:#b4bcc6;background:#222a33}
  .ack{border-color:#2c3540}
  .ack legend{color:#9aa4af}
  .prov{border-bottom-color:#7d8793}
  .prov-blocked{border-bottom-color:#e0a54a}
  .prov-flag{color:#f0b454}
  .freshness-mismatch{border-right-color:#e0a54a}

  /* ── app-fixes.css ── */
  .tile-link:focus-visible{outline-color:#8ab4f8}
  .form textarea{border-color:#6b7682;background:#0f1419;color:#e6e9ee}
  .card.alert.error{border-right-color:#f26d6d;color:#ffb4ab}
  .linkbank p.alert.error{border-right-color:#f26d6d;background:#3d1a1a;color:#ffb4ab}
  button.danger{background:#f28b82;color:#1b0f0f}
  .linkbank tr.open td{background:#222a33}
  .batch-rows tr.row-bad td{background:#3a1d1d}
  .batch-rows tr.row-dup td{background:#3a3016}
  .linkbank td select,.linkbank td input[name=integration_id]{border-color:#6b7682;background:#0f1419;color:#e6e9ee}
  .pager a{color:#b4bcc6}
  main p a{color:#e6e9ee}
  :focus-visible{outline-color:#8ab4f8}

  /* ── what the light scheme leaves to the browser ──
     A link outside the styled contexts (a table cell, an open batch row) keeps the user agent's #0000EE,
     1.9:1 on the dark surface; a form control outside .form (the pay, token and date fields inside table
     rows) keeps the user agent's field colours. Named here so neither depends on how a given browser
     reads color-scheme. Every styled context above is more specific and still wins. */
  a{color:#8ab4f8}
  input,select,textarea{background:#0f1419;color:#e6e9ee;border-color:#6b7682}
  ::placeholder{color:#8d97a2}
}
