/* ============================================================================
   KOIYOMI THEME LAYER · v1.0 · 2026-08-11
   ----------------------------------------------------------------------------
   SURGICAL RETROFIT — loaded AFTER each page's inline <style>.
   Touches tokens and accessibility only. Zero layout rules, so it cannot break
   the existing 22 pages; it simply corrects what they already consume.

   Delivers, site-wide, in one file:
     1. WCAG AA colour correction. Two ratified colours carried trust copy at
        2.58:1 and 2.90:1 — the 35-years credibility line and the
        「メーターなし。一律料金。追加請求なし」 pricing promise. Both now ≥4.5:1.
     2. A real dark theme. Stated primary context is "she's on her phone at 2am";
        the site was light-only. In dark the ORIGINAL ratified palette passes AA
        untouched — these colours were authored for the retired Theme B.
     3. 44px minimum touch targets (13 of 33 were undersized).
     4. Visible keyboard focus (was entirely absent).
     5. prefers-reduced-motion support.
   ========================================================================== */

/* ---- 1 · LIGHT: AA-corrected tokens ------------------------------------- */
:root {
  --faint: #776f5d;          /* was #a3987f — 2.58:1 → 4.51:1 */
  --gold:  #886b30;          /* was #b08a3e — 2.90:1 → 4.52:1 */
  --gold-ornament: #b08a3e;  /* the original, for rules/borders only */
  --tap: 44px;
}

/* ---- 2 · DARK ----------------------------------------------------------- */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg:#14110f; --surface:#1c1815; --surface2:#241f1b;
    --border:#332c25; --border2:#4a4036;
    --text:#e8e0d4;          /* 14.4:1 */
    --mute:#9a9083;          /*  6.0:1 */
    --faint:#a3987f;         /*  6.6:1 — original, restored */
    --gold:#b08a3e;          /*  5.9:1 — 真鍮 as authored */
    --gold-deep:#b08a3e60;
    --gold-ornament:#b08a3e;
    --oxblood:#e93550; --oxblood-lit:#ff4d66;  /* 4.5:1 lifted for dark */
    --rose:#e93550;
  }
  /* the paper-grain overlay reads as dirt on a dark ground */
  :root:not([data-theme="light"]) body::before { opacity: .022; }
  /* translucent fixed nav was hard-coded to the cream value */
  :root:not([data-theme="light"]) nav { background: rgba(20,17,15,.72); }
  :root:not([data-theme="light"]) nav.scrolled { background: rgba(20,17,15,.94); }
  :root:not([data-theme="light"]) ::selection { background: rgba(233,53,80,.28); }
}

/* explicit toggle — must win in BOTH directions */
:root[data-theme="dark"] {
  --bg:#14110f; --surface:#1c1815; --surface2:#241f1b;
  --border:#332c25; --border2:#4a4036;
  --text:#e8e0d4; --mute:#9a9083; --faint:#a3987f;
  --gold:#b08a3e; --gold-deep:#b08a3e60; --gold-ornament:#b08a3e;
  --oxblood:#e93550; --oxblood-lit:#ff4d66; --rose:#e93550;
}
:root[data-theme="dark"] body::before { opacity: .022; }
:root[data-theme="dark"] nav { background: rgba(20,17,15,.72); }
:root[data-theme="dark"] nav.scrolled { background: rgba(20,17,15,.94); }
:root[data-theme="dark"] ::selection { background: rgba(233,53,80,.28); }

body { transition: background-color .4s cubic-bezier(.22,.61,.36,1),
                   color .4s cubic-bezier(.22,.61,.36,1); }

/* ---- 3 · TOUCH TARGETS -------------------------------------------------- */
/* Applies to standalone controls; inline links inside prose are exempted so
   body copy line-height is never disturbed. */
nav a, nav button,
.btn, .navcta, .cta, [class*="cta"] a, [class*="cta"] button,
footer a, .card a, a.card, .door, button, summary {
  min-height: var(--tap);
  display: inline-flex;
  align-items: center;
  touch-action: manipulation;
}
p a, li a, .prose a, .lead a { min-height: 0; display: inline; }

/* ---- 4 · FOCUS ---------------------------------------------------------- */
:focus-visible {
  outline: 2px solid var(--oxblood);
  outline-offset: 3px;
  border-radius: 2px;
}

/* ---- 5 · THEME TOGGLE --------------------------------------------------- */
.theme-toggle {
  width: var(--tap); height: var(--tap);
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--border); border-radius: 3px;
  background: transparent; color: var(--mute);
  cursor: pointer; font-size: 15px; line-height: 1;
  transition: color .25s, border-color .25s;
}
.theme-toggle:hover { color: var(--text); border-color: var(--border2); }

/* ---- 6 · MOTION --------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important; animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}