/* explore.php restyle overrides — admin/STYLE-GUIDE.md.
   explore.php's inline <style> reads --card-bg/--border/--text/--accent, but nothing on the
   site ever defines those custom properties, so every var(--card-bg, #131a2b)-style rule was
   silently always resolving to its hardcoded dark fallback, in both themes. Fixed here by
   overriding the resolved properties with the real --ws-*/--dn-* tokens rather than by trying
   to define the missing vars. Loaded after site-next.css, keyed on body[data-page="explore"]. */

/* ── Type (§1.2, §3): section title to the real scale; caps labels to sentence case ── */
body[data-page="explore"] .ex-sec h2 {
    font-size: 17px; font-weight: 600; letter-spacing: -0.005em;
    text-transform: none; opacity: 1; color: var(--ws-text-primary);
}
body[data-page="explore"] .ex-loc h1 { font-weight: 600; letter-spacing: -0.005em; }
body[data-page="explore"] .r-kind {
    text-transform: none; letter-spacing: 0; font-size: 12.5px; font-weight: 600;
    opacity: 1; color: var(--ws-text-secondary);
}
body[data-page="explore"] .ex-tag {
    text-transform: none; letter-spacing: 0; opacity: 1;
    color: var(--ws-text-secondary); border-color: var(--ws-border-default);
}

/* ── Colour (§1.3, §1.7): real tokens in place of the dead vars; opacity-dimming replaced with
   the muted/secondary text tokens so contrast is defined rather than washed. Stale meter reading
   marked yellow (a stale reading is one of the two things yellow means) instead of faded. ── */
body[data-page="explore"] .ex-search input {
    background: var(--ws-bg-input); border-color: var(--ws-border-default); color: var(--ws-text-primary);
}
body[data-page="explore"] .ex-search input:focus { border-color: var(--dn-accent); }
body[data-page="explore"] .ex-results { background: var(--ws-bg-card-solid); border-color: var(--dn-card-edge); }
body[data-page="explore"] .ex-result { color: var(--ws-text-primary); border-bottom-color: var(--ws-border-subtle); }
body[data-page="explore"] .ex-result:hover, body[data-page="explore"] .ex-result.active { background: rgba(22, 131, 196, .12); }
body[data-page="explore"] .ex-btn { border-color: var(--ws-border-default); color: var(--ws-text-primary); }
body[data-page="explore"] .ex-btn.primary { background: var(--dn-accent); color: #FFFFFF; }
body[data-page="explore"] .ex-btn.primary:hover { background: var(--dn-accent-hover); }
body[data-page="explore"] .ex-note,
body[data-page="explore"] .ex-loc .ex-sub,
body[data-page="explore"] .ex-fc-note { color: var(--ws-text-secondary); opacity: 1; }
body[data-page="explore"] .r-sub,
body[data-page="explore"] .m-meta,
body[data-page="explore"] .ex-attrib { color: var(--ws-text-muted); opacity: 1; }
body[data-page="explore"] .ex-fc-note a { color: var(--dn-accent); }
body[data-page="explore"] .ex-meter.stale { opacity: 1; }
body[data-page="explore"] .ex-stale { color: var(--wsv-maybe); font-weight: 500; }
body[data-page="explore"] .ex-ico-book { vertical-align: -3px; margin-left: 1px; color: var(--ws-text-secondary); }

/* ── Chrome (§1.4): radius 12px on inner controls, offset shadow → the shared card lift ── */
body[data-page="explore"] .ex-btn { border-radius: var(--dn-radius-inner); }
body[data-page="explore"] .ex-results { box-shadow: var(--dn-card-lift); }
body[data-page="explore"] .ex-meter { border-bottom-color: var(--ws-border-subtle); }

/* ── Light theme (§1.7): no page-specific rules needed — every override above uses a token that
   already flips under [data-theme="light"] in theme.css / site-next.css (card, edge, lift, text,
   verdict yellow), so the page inherits the light definition without restating it here. ── */