:root {

  /* "Ma-Doori" (間取り, floor plan) — third JP Real Estate direction, sourced from
     live web research (WebSearch, 2026-07-23): madori-reading is a real, distinct
     skill/topic in Japanese apartment hunting (comparing 1K/1DK/1LDK layouts).
     Distinct mechanic from both prior JP sites: content is diagram-led (hand-drawn
     SVG floor-plan diagrams), not photo-led (urbanhavora) or photo-portfolio-led
     (aptenclave). Palette: blueprint blue-on-paper + a single vermillion-red
     accent — this pairing is a real convention (architects/inspectors redline
     floor plans in red pen on blue drafting paper), not decoration. Distinct
     from urbanhavora (washi/indigo), aptenclave (concrete/orange), dwelloryx
     (cream/terracotta). */

  --ink: #1A2B3D;
  --ink-soft: #3F5166;
  --muted: #7C8CA0;
  --line: #C9D6E4;
  --line-soft: #DCE6F0;
  --line-strong: #1A2B3D;
  --surface: #FFFFFF;
  --surface-2: #EEF3F8;
  --surface-3: #DCE6F0;

  --bg: #F4F8FB;
  --bg-rgb: 244, 248, 251;

  --accent: #C63A2E;
  --accent-soft: #A62F25;
  --accent-tint: rgba(198, 58, 46, 0.08);
  --accent-rgb: 198, 58, 46;
  --accent-ink: #7A211A;

  --blueprint: #2C4D73;
  --blueprint-rgb: 44, 77, 115;

  --night: #14202E;
  --night-2: #0D151E;
  --night-rgb: 20, 32, 46;

  --white: #FFFFFF;
  --white-rgb: 255, 255, 255;

  --ok: #2F6B4E;
  --warn: #8A5A10;

  /* --brand* — the shared style.css/animations.css hardcode this name for
     nav-hover/buttons/badges (same duplication urbanhavora/aptenclave hit);
     alias it to the blueprint-ink scale rather than a divergent color. */
  --brand: #1A2B3D;
  --brand-strong: #0D151E;
  --brand-soft: #3F5166;
  --brand-tint: rgba(26, 43, 61, 0.05);
  --brand-rgb: 26, 43, 61;

  /* Technical/drafting typography — monospace-forward for labels/dimensions
     (JIS-drawing convention), a plain functional sans for body copy. No serif
     anywhere (unlike urbanhavora) — this is a technical-reference tone, not
     editorial warmth. System stacks only, no self-hosted webfont. */
  --font-head: "Hiragino Kaku Gothic ProN", "Yu Gothic", "Noto Sans JP", "Hiragino Sans", sans-serif;
  --font-body: -apple-system, "Hiragino Kaku Gothic ProN", "Yu Gothic", "Noto Sans JP", "Segoe UI", Roboto, sans-serif;
  --font-mono: "SF Mono", ui-monospace, "IBM Plex Mono", "Cascadia Code", monospace;

  --radius-sm: 0.15rem;
  --radius: 0.2rem;
  --radius-lg: 0.3rem;
  --radius-xl: 0.4rem;
  --shadow-sm: 0 2px 8px rgba(26, 43, 61, 0.06);
  --shadow: 0 8px 24px rgba(26, 43, 61, 0.08);
  --shadow-lg: 0 20px 48px rgba(26, 43, 61, 0.12);

  --container: 1160px;
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --topbar-h: calc(4.6rem + var(--safe-top));

  --space-3xs: 0.25rem;
  --space-2xs: 0.375rem;
  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 2.5rem;
  --space-3xl: 3.5rem;

  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
}