/* theme.css — design tokens + ambient layers. The archive as a printed page:
   paper, ink, screentone. Junji Ito register per STYLE-REFERENCE.md.
   Ink, not glow: no amber, no phosphor, no CRT. Rust is the only accent. */
:root{
  /* paper + ink */
  --paper:#e8e6e0;
  --bone:#dcd9d1;
  --ink:#131313;                       /* never pure black; text renders at 92% */
  --wash:#9a978f;                      /* grey wash — secondary surfaces */
  --bg:#e8e6e0;
  --surface:#e8e6e0;
  --surface-hi:#efede7;
  --surface-lo:#dcd9d1;
  --bg-card:var(--paper);
  --fg:rgba(19,19,19,.92);
  --fg-muted:#5c5a54;
  /* rust — the ONLY accent colour, < 2% of any viewport */
  --accent:#6e4a3a;
  --accent-bright:#4c3227;             /* pressed/visited rust, never a glow */
  --ok:#3f3d38;                        /* no status green anywhere */
  --err:var(--accent);
  --border:#131313;
  --line:rgba(19,19,19,.35);
  --line-bright:#131313;
  --rule:rgba(19,19,19,.18);           /* hairline rules that may fade */
  --border-strong:#131313;
  --rust:#6e4a3a;
  /* type — Didone-adjacent display (system stack, no web-font downloads),
     grotesque mono for anything that reads like a caption or code */
  --font-display:"Playfair Display","Georgia","Times New Roman",serif;
  --font-black:ui-monospace,Consolas,"Courier New",monospace;
  --font-body:"Helvetica Neue",Helvetica,"Segoe UI",Arial,sans-serif;
  --font-mono:ui-monospace,Consolas,"Courier New",monospace;
  --radius:1px; --radius-sm:1px;
  --maxw:1160px;
  /* screentone: density, not opacity, grades the shadow */
  --tone-dense:radial-gradient(rgba(19,19,19,.6) 0 .8px, transparent 1.1px);
  --tone-sparse:radial-gradient(rgba(19,19,19,.5) 0 .8px, transparent 1.1px);
  /* sanctioned Ito signature — hairline spiral, used twice site-wide */
  --spiral:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath d='M25.6 23.7a1.7 1.7 0 1 0-3.4 0 3.9 3.9 0 0 0 7.8 0 6.6 6.6 0 1 0-13.2 0 9.7 9.7 0 0 0 19.4 0 13.1 13.1 0 1 0-26.2 0 16.8 16.8 0 0 0 33.6 0' fill='none' stroke='%23131313' stroke-width='1.1'/%3E%3C/svg%3E");
  --spiral-rust:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath d='M25.6 23.7a1.7 1.7 0 1 0-3.4 0 3.9 3.9 0 0 0 7.8 0 6.6 6.6 0 1 0-13.2 0 9.7 9.7 0 0 0 19.4 0 13.1 13.1 0 1 0-26.2 0 16.8 16.8 0 0 0 33.6 0' fill='none' stroke='%236e4a3a' stroke-width='1.1'/%3E%3C/svg%3E");
}
/* ——— ambient layers: paper only ——— */
/* base sheet */
body::before{
  content:""; position:fixed; inset:0; z-index:-2; pointer-events:none;
  background:var(--paper);
}
/* trim line: the page's own binding edge, a hairline nobody measures */
body::after{
  content:""; position:fixed; inset:0 0 0 22px; width:1px; z-index:-1;
  pointer-events:none; background:var(--rule);
}
/* paper grain: monochrome feTurbulence at baseFrequency 0.9, ≤4% opacity */
.grain{ position:fixed; inset:0; z-index:60; pointer-events:none; opacity:.035;
  mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23g)'/%3E%3C/svg%3E") }
/* foxing stain: a rust stain that imperceptibly darkens, once, over 32s.
   The ceiling of site motion. Non-looping, never a gimmick. */
@keyframes stain-darken{ from{ opacity:.05 } to{ opacity:.09 } }
.stain{ position:fixed; right:-30px; bottom:-24px; width:260px; height:170px;
  z-index:1; pointer-events:none; mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='170'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.012 0.02' numOctaves='3' seed='4'/%3E%3CfeColorMatrix values='0 0 0 0 0.431 0 0 0 0 0.29 0 0 0 0 0.227 0 0 0 -2.6 1.42'/%3E%3C/filter%3E%3Crect width='260' height='170' filter='url(%23f)'/%3E%3C/svg%3E");
  animation:stain-darken 32s linear 1 forwards }
/* catalogue column: a fixed vertical-rl spine at the page edge —
   archive content, not kanji tourism */
.edge-code{ position:fixed; right:8px; top:28vh; z-index:5; pointer-events:none;
  writing-mode:vertical-rl; font-family:var(--font-mono); font-size:11px;
  letter-spacing:.32em; text-transform:uppercase; color:rgba(19,19,19,.5) }
/* CRT/scanline/TV layers are retired — these hooks no longer exist. */
@media (prefers-reduced-motion:reduce){
  .stain{ animation:none; opacity:.07 }
  *{ transition-duration:.01ms !important; animation-duration:.01ms !important }
}
#view{ opacity:1; transition:opacity .15s } .booting #view{ opacity:0 }
.nojs{ padding:4rem 1rem; text-align:center; color:var(--fg-muted) }
.nojs code{ color:var(--accent) }