/* Shared DET editorial foundation. Timed-task states retain their own semantics. */
:root {
    --det-brand-paper: #faf9f5;
    --det-brand-card: #ffffff;
    --det-brand-ink: #233d33;
    --det-brand-muted: #59675e;
    --det-brand-accent: #315b46;
    --det-brand-accent-hover: #244734;
    --det-brand-on-accent: #ffffff;
    --det-brand-soft: #edf0e8;
    --det-brand-line: #dce1d6;
    --det-brand-serif: 'Instrument Serif', Georgia, serif;
    --det-brand-sans: 'Inter', Arial, sans-serif;
    --det-brand-radius: 6px;
}

html[data-det-theme="dark"] {
    --det-brand-paper: #141f19;
    --det-brand-card: #1c2b22;
    --det-brand-ink: #edf0e5;
    --det-brand-muted: #b9c6b9;
    --det-brand-accent: #c0d8b1;
    --det-brand-accent-hover: #d1e3c6;
    --det-brand-on-accent: #17271e;
    --det-brand-soft: #25372b;
    --det-brand-line: #3c4c3d;
}

.det-nav-header, .det-nav-header *,
.det-guide-page, .det-guide-page *,
.det-page, .det-page *, .det-price-page, .det-price-page *,
footer, footer * {
    font-family: var(--det-brand-sans);
}

.det-page *, .det-price-page * { box-sizing: border-box; }

footer.bg-white { background: var(--det-brand-paper); border-color: var(--det-brand-line); }
footer .text-gradient { background: none; -webkit-text-fill-color: currentColor; color: var(--det-brand-ink); }
footer :is(.text-gray-600, .text-gray-500, .text-gray-400) { color: var(--det-brand-muted); }
body.dark-mode .det-nav-logo img,
body.dark-mode footer .det-footer-logo { filter: brightness(0) invert(1); }

/* Loaded only on DET app and guide surfaces; the marketing landing keeps its design. */
:root .det-nav-header { background: var(--det-brand-card); border-bottom-color: var(--det-brand-line); box-shadow: none; }
:root .det-nav-logo-text { background: none; -webkit-text-fill-color: currentColor; color: var(--det-brand-accent); }
:root .det-nav-badge { background: var(--det-brand-accent); color: var(--det-brand-on-accent); }
:root .det-login-btn { background: var(--det-brand-accent); color: var(--det-brand-on-accent); }
:root .det-login-btn:hover { background: var(--det-brand-accent-hover); color: var(--det-brand-on-accent); box-shadow: none; transform: none; }
:root .det-user-btn { background: var(--det-brand-soft); color: var(--det-brand-muted); }
:root body.dark-mode .det-nav-header { background: var(--det-brand-card); border-bottom-color: var(--det-brand-line); box-shadow: none; }
:root body.dark-mode .det-nav-logo-text { background: none; color: var(--det-brand-accent); }
:root body.dark-mode .det-login-btn { background: var(--det-brand-accent); color: var(--det-brand-on-accent); }
:root body.dark-mode .det-login-btn:hover { background: var(--det-brand-accent-hover); color: var(--det-brand-on-accent); }
:root body.dark-mode footer.bg-white { background: var(--det-brand-paper) !important; border-color: var(--det-brand-line) !important; }
:root body.dark-mode footer :is(.text-gray-600, .text-gray-500, .text-gray-400) { color: var(--det-brand-muted) !important; }