/* THEME: SQUARED PAPER — a maths exercise book.
   Matte and warm: no gradients, no glass, no blur. The only non-glossy theme,
   so it can't be confused with Classic or Light. */

body.theme-paper {
  /* Faint squared-paper ruling on warm cream stock */
  background:
    repeating-linear-gradient(0deg, transparent 0 23px, rgba(47, 93, 140, 0.07) 23px 24px),
    repeating-linear-gradient(90deg, transparent 0 23px, rgba(47, 93, 140, 0.07) 23px 24px),
    #fdfaf2;
  background-attachment: fixed;

  --text-main: #2e2a24;   /* graphite */
  --text-muted: #5c5445;
  --border-color: #ded5c2;
  --bg-panel: #f5efe1;
  --bg-card: #fffdf7;
  --accent: #2f5d8c;
  --accent-active: #2f5d8c; /* ink blue */
  --accent-ink: #ffffff;

  /* Grid surface — paper with pencil ruling */
  --board-bg: #fffdf7;
  --cell-blank: #fffdf7;
  --cell-line: #8a8578; /* pencil grey */

  /* Overlays */
  --axis: #7c3aed;                       /* violet pencil */
  --axis-halo: rgba(255, 255, 255, 0.9);
  --nearmiss: #dc2626;                   /* red pen */
  --cursor: #2e2a24;
  --cursor-halo: rgba(255, 255, 255, 0.95);
  --ghost: #0369a1;                        /* deep blue pencil — reads on cream */
  --ghost-fill: rgba(3, 105, 161, 0.15);
  --lock: #2e2a24;                         /* ink padlock on the cream board */
  --lock-halo: rgba(255, 253, 247, 0.95);
  --focus: #b45309;

  color: var(--text-main);
}

/* Matte panels — a soft paper shadow instead of frosted glass */
body.theme-paper .reading,
body.theme-paper .panel-left,
body.theme-paper .panel-right,
body.theme-paper .top-bar {
  background: var(--bg-panel);
  border-color: var(--border-color);
  box-shadow: 0 2px 8px rgba(46, 42, 36, 0.07);
}

body.theme-paper .workspace { background: transparent; }

body.theme-paper .board {
  background: var(--board-bg);
  border: 1px solid var(--border-color);
  box-shadow: 0 4px 14px rgba(46, 42, 36, 0.1);
}

body.theme-paper .results-card {
  background: var(--bg-card);
  border: 1px solid var(--border-color);
}

body.theme-paper .select,
body.theme-paper .btn {
  background: #fffdf7;
  color: var(--text-main);
  border: 1px solid #cfc5b0;
}

body.theme-paper .btn-primary {
  background: var(--accent-active);
  color: var(--accent-ink);
  box-shadow: 0 2px 6px rgba(47, 93, 140, 0.28);
}

body.theme-paper .results__nearmiss {
  background: rgba(220, 38, 38, 0.09);
  border-left-color: var(--nearmiss);
}