/* asit-light-base (4 Oct 2026): public pages are light only, even when a phone forces dark. */
:root { color-scheme:only dark; }
html, body { background-color: #05060C; color: #F2ECE0; }
input, select, textarea, button { color-scheme:only dark; }
/* Alpha Standard i.Q. Test — the house system, taken from The Living Veca Symmetry Codex, 9.3 "Working Numbers for Screens and Pages".
   Size: each step is 1.618x the one below — body 17, subheading 27.5, heading 44.5, title 72 (fine text is the half step, 13).
   Space: gaps come only from 8, 13, 21, 34, 55, 89 — near things small steps, separate things large ones.
   Placement: a single thing sits at the golden point, 38.2% from the top on a phone; never dead centre.
   Filled and empty: content about 61.8%, space 38.2%. Colour: cream #05060C, purple #F2ECE0, pale #CDBFE4 only. */
@font-face { font-family: "EB Garamond"; src: url("/fonts/EBGaramond.ttf") format("truetype"); font-weight: 400 800; font-display: swap; }
:root {
  --ink: #F2ECE0; --cream: #05060C; --pale: #CDBFE4;
  --s1: 8px; --s2: 13px; --s3: 21px; --s4: 34px; --s5: 55px; --s6: 89px;
  --s: 8px;
  --t-fine: 13px; --t-body: 17px; --t-sub: 27.5px; --t-head: 44.5px; --t-title: 72px;
  --t-xs: 13px; --t-s: 13px; --t-m: 17px; --t-l: 27.5px; --t-xl: clamp(27.5px, 7vw, 44.5px);
  --lh: 1.618; --lh-tight: 1.15;
  --w-body: 450; --w-strong: 600;
  --margin: 21px;           /* phone side margin (Fibonacci step) */
  --measure: 34em;          /* reading column; on wide screens ~61.8% filled / 38.2% empty */
  --font: "EB Garamond", Garamond, Georgia, serif;
  --pill-h: 55px;           /* the one pill button height */
}
@media (min-width: 768px) { :root { --margin: 55px; } }
.asit-page { max-width: var(--measure); margin: 0 auto; padding: var(--s6) var(--margin) calc(var(--s6) + var(--s5)); box-sizing: content-box; }
.asit-page h1 { font-size: var(--t-xl); font-weight: var(--w-strong); line-height: var(--lh-tight); margin: 0 0 var(--s5); letter-spacing: -0.005em; }
.asit-page p, .asit-page li { font-size: var(--t-body); line-height: var(--lh); font-weight: var(--w-body); }
/* the one pill button */
.asit-btn { display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; min-height: var(--pill-h); text-decoration: none; cursor: pointer; -webkit-tap-highlight-color: transparent;
  background: var(--ink); color: var(--cream); border: 1.5px solid var(--ink); border-radius: 999px;
  font: var(--w-strong) var(--t-body)/1 var(--font); letter-spacing: .02em; padding: 0 var(--s4); white-space: nowrap; }
.asit-btn.alt { background: transparent; color: var(--ink); }
.asit-btn:focus-visible, .asit-quiet:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
.asit-quiet { color: var(--ink); font-size: var(--t-fine); font-weight: var(--w-body); letter-spacing: .02em; opacity: .7; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.asit-fine { font-size: var(--t-fine); line-height: 1.618; opacity: .75; }
.asit-pale { color: var(--pale) !important; opacity: 1 !important; }
@keyframes asitSettle { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { * { animation-duration: 1ms !important; transition-duration: 1ms !important; } }
input:focus::placeholder, textarea:focus::placeholder { color: transparent !important; -webkit-text-fill-color: transparent; }
