:root {
  --ink:        #0A0A0A;
  --ink-soft:   #151515;
  --paper:      #F4F1EA;
  --paper-dim:  #C9C4B8;
  --accent:     #FFFFFF;
  --on-accent:  #0A0A0A;   /* legible text colour for the current accent */

  --accent-sentai: #E01B24;
  --accent-ongaku: #8B5CF6;
  --accent-manga:  #F5C518;
  --accent-anime:  #17C3B2;

  /* Text colour paired with each accent. These match what on_accent() in
     app/helpers.php computes from relative luminance, so hover states and
     server-rendered pages never disagree. Only the red is dark enough to
     need light text (4.6:1); the violet actually scores better with dark
     text (5.5:1 vs 3.2:1), counterintuitive as that looks. */
  --on-sentai: #F4F1EA;
  --on-ongaku: #0A0A0A;
  --on-manga:  #0A0A0A;
  --on-anime:  #0A0A0A;

  --display: Impact, "Haettenschweiler", "Arial Narrow Bold", "Franklin Gothic Bold", sans-serif;
  --body-font: "Trebuchet MS", "Segoe UI", system-ui, sans-serif;

  --s1: 0.25rem;
  --s2: 0.5rem;
  --s3: 1rem;
  --s4: 1.75rem;
  --s5: 3rem;
  --s6: 5rem;

  --edge: 3px solid var(--ink);
  --skew: -6deg;
  --fast: 140ms;
  --slow: 520ms;
  --ease-slam: cubic-bezier(0.16, 1, 0.3, 1);
}

[data-division="sentai"] { --accent: var(--accent-sentai); --on-accent: var(--on-sentai); }
[data-division="ongaku"] { --accent: var(--accent-ongaku); --on-accent: var(--on-ongaku); }
[data-division="manga"]  { --accent: var(--accent-manga);  --on-accent: var(--on-manga); }
[data-division="anime"]  { --accent: var(--accent-anime);  --on-accent: var(--on-anime); }

/* Set by landing.js while a quadrant is hovered or focused, so the header buttons and
   every other accent-coloured element adopt that wall's colour. */
:root[data-hover="sentai"] { --accent: var(--accent-sentai); --on-accent: var(--on-sentai); }
:root[data-hover="ongaku"] { --accent: var(--accent-ongaku); --on-accent: var(--on-ongaku); }
:root[data-hover="manga"]  { --accent: var(--accent-manga);  --on-accent: var(--on-manga); }
:root[data-hover="anime"]  { --accent: var(--accent-anime);  --on-accent: var(--on-anime); }
