/* Archive family (Index, Themes, Design) on the unified foundation.
   archive-system.css draws almost everything from --archive-* tokens; here they follow the shared palette,
   so light and dark are both complete. Page-specific rules live in each page's own sheet. */

/* The seal face behind --font-glyph (index seals, theme marks) used to be declared in styles.css, which these pages no longer load. */
@font-face{font-family:"Galok Glyph Display";src:url("/assets/fonts/galok-glyph-display.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
html[data-g] .archive-page{--font-glyph:"Galok Glyph Display","Galok Serif",serif}
html[data-g] .archive-page .glyph-draw{font-family:var(--font-glyph);font-weight:400}

html[data-g]{
  --archive-paper:var(--g-bg);--archive-white:var(--g-surface);--archive-ink:var(--g-ink);--archive-muted:var(--g-muted);
  --archive-red:var(--g-view-text);--archive-blue:var(--g-frame-text);--font-mono:var(--g-mono);
  --archive-line:var(--g-rule-strong)
}
html[data-g] .archive-page{background:var(--g-bg);color:var(--g-ink);font-family:var(--g-sans)}

/* Type: archive-system was tracked for Helvetica at -.07em to -.085em; Galok Sans needs less or the words run together. */
html[data-g] .archive-main :is(h1,h2){font-weight:560;letter-spacing:-.05em}
html[data-g] .archive-main h3{font-weight:560;letter-spacing:-.03em}
html[data-g] .archive-search-panel input{font-weight:520;letter-spacing:-.035em}

/* Filters: the shared pill group (Radar, Data), one family across the site. */
html[data-g] .archive-filters{gap:4px;padding:4px;border:1px solid var(--g-rule-strong);border-radius:999px;align-self:end}
html[data-g] .archive-filters button{min-height:36px;padding:0 14px;border:0;border-radius:999px;color:var(--g-muted);font:500 13px/1 var(--g-sans);letter-spacing:0;text-transform:none}
html[data-g] .archive-filters button:hover{color:var(--g-ink)}
html[data-g] .archive-filters button[aria-pressed="true"]{background:var(--g-inv-bg);color:var(--g-inv-ink)}
@media (pointer:coarse){html[data-g] .archive-filters button{min-height:44px}}
@media (max-width:900px){html[data-g] .archive-search-panel{grid-template-columns:minmax(0,1fr)}html[data-g] .archive-filters{flex-wrap:nowrap;max-width:100%;overflow-x:auto;scrollbar-width:none;justify-self:start}html[data-g] .archive-filters button{flex:none}}

/* Results: hover inverts with the shared inverse pair, readable in both themes. */
@media (hover:hover) and (pointer:fine){
  html[data-g] .archive-result:is(:hover,:focus-visible){color:var(--g-inv-ink);background:var(--g-inv-bg)}
  html[data-g] .archive-result:is(:hover,:focus-visible) :is(p,span){color:inherit;opacity:.78}
}

/* Index: five paths in one row on wide screens, no empty cell. */
@media (min-width:1180px){html[data-g] .archive-index-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}

/* Legacy variable names that section sheets still read (styles.css is no longer loaded on these pages). */
html[data-g] .archive-page{--ink:var(--g-ink);--muted:var(--g-muted);--line:var(--g-rule-strong);--radius:0px;--font-serif:var(--g-serif);--font-ui:var(--g-sans)}

/* Feature panels: a deep-blue plate in both themes (its type is set for a dark ground). */
html[data-g] .notes-feature{border-color:var(--g-rule-strong)}
html[data-g] .notes-feature-copy{background:#173f53;color:#f4f4ec}
html[data-g] .notes-feature-copy .archive-kicker{color:#f2b8ae}
html[data-g] .notes-feature--research:is(:hover,:focus-visible){background:var(--g-surface)}

/* Themes: cards sit on the shared surface; footer nav links use readable lens text twins in both themes. */
html[data-g] .themes-card{background:var(--g-surface);border-color:var(--g-rule)}
html[data-g] .themes-card[data-series="macro"]{--accent-text:var(--g-view-text)}
html[data-g] .themes-card[data-series="frame"]{--accent-text:var(--g-frame-text)}
html[data-g] .themes-card[data-series="scene"]{--accent-text:var(--g-observe-text)}
html[data-g] .themes-card-nav a[data-series="macro"]{color:var(--g-view-text);border-bottom-color:color-mix(in srgb, var(--g-view-text) 45%, transparent)}
html[data-g] .themes-card-nav a[data-series="frame"]{color:var(--g-frame-text);border-bottom-color:color-mix(in srgb, var(--g-frame-text) 45%, transparent)}
html[data-g] .themes-card-nav a[data-series="scene"]{color:var(--g-observe-text);border-bottom-color:color-mix(in srgb, var(--g-observe-text) 45%, transparent)}
html[data-g] .notes-feature-copy h2{font-size:clamp(2.4rem,4.4vw,5.4rem);line-height:.92;letter-spacing:-.05em;overflow-wrap:normal;hyphens:manual;text-wrap:balance}