/* Continuum 2026 — E-PAPER edition.
   Injected at build time into the e-paper bundle only. v1 and v2 are untouched.

   Colour e-paper (Kaleido-class) constraints this is built for:
     * Reflective, no backlight assumption -> maximum contrast wins. Dark themes
       are the WORST case; the whole palette is inverted to black-on-white.
     * Slow refresh + ghosting -> every animation, transition, shadow and blur
       is removed. Motion smears and costs refreshes.
     * Colour is low-saturation and lower-resolution than greyscale -> accents
       are pushed DARK and few, so they read as distinct even when washed out.
     * Thin/light strokes disappear -> borders are solid black and 2px, type is
       heavier, mid-greys are banned (they render as mud).
     * Slow, sometimes stylus, touch -> bigger targets. */

/* ---------------------------------------------------------------
   1. Invert the theme by redefining every console's CSS variables.
      All six consoles share this naming scheme, so this one block
      re-skins the whole app.
   --------------------------------------------------------------- */
:root, html, body {
  --bg: #ffffff !important;
  --panel: #ffffff !important;
  --panel2: #f4f4f4 !important;
  --line: #000000 !important;
  --ink: #000000 !important;
  --dim: #3a3a3a !important;      /* dark grey, never light — must stay legible */
  --tap: 60px !important;

  /* Accents: dark + saturated so they survive a washed-out colour filter. */
  --teal: #005f52 !important;
  --teal-dim: #005f52 !important;
  --amber: #7a4a00 !important;
  --gold: #6b5200 !important;
  --gold-dim: #6b5200 !important;
  --red: #9a0000 !important;
  --green: #14561f !important;
  --silver: #2a2a2a !important;
  --success: #14561f !important;
  --wood: #ffffff !important;
}

/* ---------------------------------------------------------------
   2. Kill ALL motion. On e-paper, animation = ghosting + wasted refresh.
   --------------------------------------------------------------- */
*, *::before, *::after {
  animation: none !important;
  transition: none !important;
  scroll-behavior: auto !important;
  text-shadow: none !important;
  box-shadow: none !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* ---------------------------------------------------------------
   3. Strip dark surfaces and background photography.
      Two consoles use a full-bleed cover photo behind a dark scrim;
      on colour e-paper that renders as mud behind the text.
   --------------------------------------------------------------- */
body {
  background: #ffffff !important;
  color: #000000 !important;
}
body::before, body::after { display: none !important; content: none !important; }

#app { background: #ffffff !important; }

header, nav, main, section, .card, .cardprop {
  background: #ffffff !important;
  background-image: none !important;
  color: #000000 !important;
}

/* Solid, unmistakable structure instead of subtle tonal panels. */
header { border-bottom: 2px solid #000 !important; }
nav { border-top: 2px solid #000 !important; }
.card {
  border: 2px solid #000 !important;
  border-radius: 4px !important;
  margin-bottom: 12px !important;
}

/* Any leftover dark inline surfaces (rgba panels) forced light. */
[style*="background"] { background-image: none !important; }

/* ---------------------------------------------------------------
   4. Legibility: heavier type, no thin strokes, no mid-grey text.
   --------------------------------------------------------------- */
body, .card, main, header, nav { font-weight: 500 !important; }
h1, h2, h3, b, strong, .card h2 { font-weight: 800 !important; }
.card h2 { letter-spacing: .12em !important; border-bottom: 1px solid #000; padding-bottom: 6px; }
small, .sub, .dim, .hint { color: #3a3a3a !important; }

/* Inputs and controls read as physical objects. */
button, input, select, textarea {
  background: #ffffff !important;
  color: #000000 !important;
  border: 2px solid #000000 !important;
  border-radius: 4px !important;
  font-weight: 700 !important;
}
/* Selected / active states must be obvious without colour subtlety: invert.
   aria-pressed is included so toggle controls (e.g. the Board's tool buttons)
   aren't flattened by the white-button rule above. */
nav button.active, button.active, .on, .active > button, button[aria-pressed="true"] {
  background: #000000 !important;
  color: #ffffff !important;
}
nav button { min-height: var(--tap) !important; font-weight: 700 !important; }

/* Checkboxes/pips need a hard edge to be visible. */
input[type="checkbox"], .chk, .pip {
  outline: 2px solid #000 !important;
  accent-color: #000 !important;
}

/* ---------------------------------------------------------------
   5. Layout: e-paper tablets are usually portrait and slow to scroll,
      so keep a single readable column and generous spacing. Only go
      two-column on genuinely wide screens.
   --------------------------------------------------------------- */
main { padding: 14px !important; }
main > section.tab.active { display: block !important; }
@media (min-width: 1300px) {
  main > section.tab.active {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
    align-items: start;
  }
  main > section.tab.active > .card { margin-bottom: 0 !important; }
}

/* Art is expensive to render: keep it crisp-edged and never oversized. */
img { image-rendering: auto; max-width: 100% !important; }

/* ---------------------------------------------------------------
   6. E-paper toolbar (injected): manual full-refresh to clear ghosting.
   --------------------------------------------------------------- */
.ep-btn {
  background: #ffffff;
  border: 2px solid #000;
  color: #000;
  border-radius: 4px;
  padding: 8px 12px;
  font-size: 14px;
  font-weight: 800;
  line-height: 1;
  min-height: 48px;
  min-width: 48px;
  flex: 0 0 auto;
  margin-left: 8px;
}
.ep-btn:active { background: #000; color: #fff; }

/* The full-refresh flash: one hard black->white repaint clears ghosting. */
.ep-flash {
  position: fixed;
  inset: 0;
  background: #000;
  z-index: 99999;
}

@media print { .ep-btn, .ep-flash { display: none !important; } }