/* game-kit 6ee9a0c: css/theme.css — edit in game-kit and run tools/kit-sync.js */
/* game-kit design tokens (docs/standard-3d.md "Theme tokens"). Load AFTER css/kit.css and BEFORE the game's own CSS:
     <link rel="stylesheet" href="css/kit.css"><link rel="stylesheet" href="css/theme.css"><link rel="stylesheet" href="css/theme-game.css">
   Put data-theme on <html> (the legacy kit variables --ink/--paper/--line/--accent... are defined on :root from these):
     <html data-theme="dark-industrial">  |  "paper-light"  |  "retro-crt"  |  (none = the kit default below)
   data-theme is a LIST of words (standard 1.1, selectors use ~=): a game's own look sits ON TOP of a standard theme:
     <html data-theme="dark-industrial mygame">  +  css/theme-game.css:  [data-theme~="mygame"] { --gf-accent: #ffcc4a; }
   A game adds a theme with ONE css file that overrides tokens:  [data-theme~="my-look"] { --gf-bg: ...; }
   Rules for kit CSS: never hard-code a colour/size that a token covers; write  var(--gf-surface, var(--old, #fff))  so a
   game that does not load theme.css looks exactly as before. Tokens only; no selectors for kit classes in this file. */
:root {
  /* colour */
  --gf-bg: #dfe8ea;            /* page / behind the 3D view */
  --gf-surface: #fffdf6;       /* window and card background */
  --gf-surface-2: #f2efe4;     /* inset areas, thumbnails, quiet rows */
  --gf-panel: rgba(252, 250, 244, 0.97);       /* window shell (slightly translucent) */
  --gf-panel-soft: rgba(255, 253, 246, 0.92);  /* HUD chips */
  --gf-text: #23302c;
  --gf-text-dim: #5c6662;
  --gf-accent: #3a7a5a;
  --gf-accent-ink: #ffffff;    /* text on an accent-coloured background */
  --gf-accent-2: #e8a040;      /* second accent (fills, rings, highlights: NOT for text on a light surface, use --gf-goal) */
  --gf-goal: #8a4e0c;          /* text colour of the current goal / task (AA on --gf-surface and --gf-panel-soft) */
  --gf-accent-soft: #eaf4ee;   /* selected row / soft accent tint */
  --gf-highlight: #fff7e6;     /* "look here" tint (current goal, why-needed) */
  --gf-heading: #2f5e46;       /* window titles, section headings */
  --gf-accent-hover: #2f6a4c;
  --gf-border-strong: #8c8472; /* button / control borders */
  --gf-scrim: rgba(40, 50, 45, 0.28);          /* dim layer behind a window */
  --gf-danger: #c0502a;
  --gf-ok: #2e7a4a;
  --gf-border: #d8d2c2;
  --gf-overlay: rgba(0, 0, 0, 0.55);           /* modal backdrop */
  --gf-overlay-strong: rgba(0, 0, 0, 0.72);
  /* shape */
  --gf-radius: 10px;
  --gf-radius-lg: 16px;
  --gf-shadow: 0 10px 40px rgba(0, 0, 0, 0.25);
  /* spacing scale */
  --gf-space-1: 4px; --gf-space-2: 8px; --gf-space-3: 12px; --gf-space-4: 16px; --gf-space-5: 24px; --gf-space-6: 32px;
  /* type */
  --gf-font: 'Zen Maru Gothic', 'Hiragino Maru Gothic ProN', 'Hiragino Sans', 'Yu Gothic', 'Noto Sans JP', sans-serif;
  --gf-font-mono: ui-monospace, 'Cascadia Mono', 'SFMono-Regular', Consolas, 'Noto Sans Mono CJK JP', monospace;
  --gf-text-sm: 0.85em; --gf-text-md: 1em; --gf-text-lg: 1.2em;
  --gf-lh: 1.65;
  /* windows (U12 fixed size, U14 narrow screens, U21 generous margins) */
  --gf-safe-t: env(safe-area-inset-top, 0px); --gf-safe-r: env(safe-area-inset-right, 0px);
  --gf-safe-b: env(safe-area-inset-bottom, 0px); --gf-safe-l: env(safe-area-inset-left, 0px);
  --gf-win-margin: clamp(12px, 3vmin, 32px);   /* gap between a window and the screen edge */
  --gf-win-pad: var(--gf-space-4);             /* padding inside a window */
  --gf-win-w: min(1000px, calc(100vw - 2 * var(--gf-win-margin) - var(--gf-safe-l) - var(--gf-safe-r)));
  --gf-win-h: min(680px, calc(100vh - 2 * var(--gf-win-margin) - var(--gf-safe-t) - var(--gf-safe-b)));
  --gf-win-w-narrow: min(620px, calc(100vw - 2 * var(--gf-win-margin) - var(--gf-safe-l) - var(--gf-safe-r)));
  /* touch */
  --gf-hit: 44px;
  /* mini games / terminal screens (task-minigames #mg) */
  --gf-mg-bg: #0a1410; --gf-mg-bg-2: #0b1810; --gf-mg-line: #2a5a3a; --gf-mg-btn: #12261a; --gf-mg-ink: #d8ffe4;
  --gf-mg-accent: #46c27a; --gf-mg-warn: #ffcc4a; --gf-mg-dim: #6a8a76;
  /* effects a theme may switch on: scanlines overlay opacity (0 = none) */
  --gf-scanlines: 0;
  /* the SVG map (map-svg.js): room kinds, doors, grid */
  --gf-map-room: #dbe8f4; --gf-map-corridor: #e8e2c8; --gf-map-outdoor: #d6efd0; --gf-map-stairs: #f2d9b8; --gf-map-door: #8a5a00; --gf-map-grid: #eeeeee; --gf-map-grid-2: #cccccc;
}
@supports (height: 100dvh) { :root { --gf-win-h: min(680px, calc(100dvh - 2 * var(--gf-win-margin) - var(--gf-safe-t) - var(--gf-safe-b))); } }

/* 届けるな / 应答するな: dark green-black terminals, phosphor green, amber warnings */
[data-theme~="dark-industrial"] {
  --gf-bg: #05090a; --gf-surface: #101a17; --gf-surface-2: #16241f; --gf-panel: rgba(12, 20, 17, 0.97); --gf-panel-soft: rgba(12, 20, 17, 0.9);
  --gf-text: #d6ece0; --gf-text-dim: #7f9d8e; --gf-accent: #46c27a; --gf-accent-ink: #05140b; --gf-accent-2: #ffcc4a; --gf-goal: #ffcc4a;
  --gf-accent-soft: #14301f; --gf-heading: #46c27a; --gf-accent-hover: #5fd690; --gf-border-strong: #3d7a54; --gf-scrim: rgba(0, 0, 0, 0.5); --gf-highlight: #2a2410; --gf-danger: #e0483a; --gf-ok: #46c27a; --gf-border: #2a5a3a;
  --gf-overlay: rgba(0, 0, 0, 0.7); --gf-overlay-strong: rgba(0, 0, 0, 0.85);
  --gf-radius: 6px; --gf-radius-lg: 10px; --gf-shadow: 0 10px 40px rgba(0, 0, 0, 0.7);
  --gf-font: 'Noto Sans JP', 'Hiragino Sans', 'Yu Gothic', sans-serif;
  --gf-lh: 1.6;
  --gf-map-room: #243a34; --gf-map-corridor: #2c3a2a; --gf-map-outdoor: #1f3326; --gf-map-stairs: #3a3322; --gf-map-door: #ffcc4a; --gf-map-grid: #14201c; --gf-map-grid-2: #1c2c26;
}
/* 未然調書 / 日陰の台帳: warm paper, ink, brick-red accent, serif headings welcome */
[data-theme~="paper-light"] {
  --gf-bg: #e9e4d6; --gf-surface: #fffdf6; --gf-surface-2: #f3ecda; --gf-panel: rgba(255, 253, 246, 0.98); --gf-panel-soft: rgba(255, 253, 246, 0.94);
  --gf-text: #2b2620; --gf-text-dim: #5f574c; --gf-accent: #b04e26; --gf-accent-ink: #ffffff; --gf-accent-2: #b08a2e;
  --gf-accent-soft: #f6e6dc; --gf-heading: #8a3a1a; --gf-accent-hover: #a2481f; --gf-border-strong: #8a7e62; --gf-goal: #7a4a08; --gf-scrim: rgba(40, 30, 20, 0.3); --gf-highlight: #fbf0d2; --gf-danger: #b3261e; --gf-ok: #3b7a4a; --gf-border: #e3dccb;
  --gf-overlay: rgba(40, 30, 20, 0.5); --gf-overlay-strong: rgba(40, 30, 20, 0.7);
  --gf-radius: 8px; --gf-radius-lg: 12px; --gf-shadow: 0 8px 30px rgba(60, 40, 20, 0.28);
  --gf-font: 'Zen Old Mincho', 'Noto Serif JP', 'Hiragino Mincho ProN', 'Yu Mincho', serif;
  --gf-mg-bg: #f6f0df; --gf-mg-bg-2: #fffdf6; --gf-mg-line: #cdbf9c; --gf-mg-btn: #efe6cf; --gf-mg-ink: #2b2620;
  --gf-mg-accent: #3b7a4a; --gf-mg-warn: #b3601e; --gf-mg-dim: #7a7266;
}
/* old TV: black glass, green phosphor, monospace, optional scanlines */
[data-theme~="retro-crt"] {
  --gf-bg: #000000; --gf-surface: #031203; --gf-surface-2: #082008; --gf-panel: rgba(2, 14, 2, 0.97); --gf-panel-soft: rgba(2, 14, 2, 0.9);
  --gf-text: #7dff8a; --gf-text-dim: #3fae4d; --gf-accent: #7dff8a; --gf-accent-ink: #001a02; --gf-accent-2: #ffd24a; --gf-goal: #ffd24a;
  --gf-accent-soft: #0b2c0e; --gf-heading: #7dff8a; --gf-accent-hover: #a6ffae; --gf-border-strong: #2fa13d; --gf-scrim: rgba(0, 0, 0, 0.6); --gf-highlight: #2a2a05; --gf-danger: #ff5a4a; --gf-ok: #7dff8a; --gf-border: #1f7a2a;
  --gf-overlay: rgba(0, 0, 0, 0.75); --gf-overlay-strong: rgba(0, 0, 0, 0.9);
  --gf-radius: 2px; --gf-radius-lg: 4px; --gf-shadow: 0 0 24px rgba(60, 255, 90, 0.25);
  --gf-font: var(--gf-font-mono); --gf-lh: 1.55; --gf-scanlines: 0.18;
  --gf-mg-bg: #021002; --gf-mg-bg-2: #031a04; --gf-mg-line: #1f7a2a; --gf-mg-btn: #062a08; --gf-mg-ink: #aaffb2;
  --gf-mg-accent: #7dff8a; --gf-mg-warn: #ffd24a; --gf-mg-dim: #3fae4d;
  --gf-map-room: #0b2c0e; --gf-map-corridor: #0a2410; --gf-map-outdoor: #072008; --gf-map-stairs: #2a2a05; --gf-map-door: #ffd24a; --gf-map-grid: #062006; --gf-map-grid-2: #0a2c0c;
}
/* optional scanline veil: add <div class="gf-scanlines"></div> once; invisible unless the theme sets --gf-scanlines */
.gf-scanlines { position: fixed; inset: 0; z-index: 99999; pointer-events: none; opacity: var(--gf-scanlines);
  background: repeating-linear-gradient(to bottom, rgba(0, 0, 0, 0.55) 0 1px, transparent 1px 3px); }
@media (prefers-reduced-motion: reduce), (prefers-contrast: more) { .gf-scanlines { display: none; } }