:root {
    --brand-ink: #062936;
    --brand-ink-rgb: 6 41 54;
    --brand-primary: #0A3C4D;
    --brand-primary-rgb: 10 60 77;
    --brand-hover: #10556A;
    --brand-hover-rgb: 16 85 106;
    --brand-muted: #536F79;
    --brand-muted-rgb: 83 111 121;
    --brand-soft: #9DBDC7;
    --brand-soft-rgb: 157 189 199;
    --brand-line: #CDDEE3;
    --brand-line-rgb: 205 222 227;
    --brand-surface: #EDF4F6;
    --brand-surface-rgb: 237 244 246;
    --brand-paper: #F6F9FA;
    --brand-paper-rgb: 246 249 250;
    --brand-accent: #FF833D;
    --brand-accent-rgb: 255 131 61;
    --brand-accent-ink: #AA310D;
    --brand-accent-ink-rgb: 170 49 13;
    --brand-accent-soft: #FFEADF;
    --brand-accent-soft-rgb: 255 234 223;
    --brand-danger: #B53616;
    --brand-danger-rgb: 181 54 22;
    --ink: var(--brand-primary);
    --paper: var(--brand-paper);
    --muted: var(--brand-muted);
    --line: var(--brand-line);
    --coral: var(--brand-accent);
    --gold: var(--brand-accent);
    --mint: var(--brand-surface);
    --shadow: 0 18px 50px rgb(var(--brand-primary-rgb) / .12);
}

/* Brand treatments are last in the cascade; geometry remains component-owned. */
body { background: var(--brand-paper); color: var(--brand-primary); }
::selection { background: var(--brand-accent-soft); color: var(--brand-ink); }
.site-header.rich-header { background: var(--brand-primary) !important; border-bottom-color: var(--brand-accent) !important; }
.rich-header .brand strong, .rich-header .brand small { color: #fff !important; }
.rich-header .brand i { color: var(--brand-accent) !important; }
.rich-header nav .nav-pill, .rich-header .story-dropdown-toggle { color: var(--brand-paper) !important; }
.rich-header nav .nav-pill.nav-login,
.rich-header nav .nav-pill.nav-login:is(.active, [aria-current="page"]) {
    background: var(--brand-paper) !important;
    color: var(--brand-primary) !important;
    border: 1px solid var(--brand-line) !important;
}
.rich-header nav .nav-pill.nav-login:hover,
.rich-header nav .nav-pill.nav-login:focus-visible {
    background: var(--brand-accent-soft) !important;
    color: var(--brand-ink) !important;
    border-color: var(--brand-accent) !important;
}
.rich-header nav .nav-pill:focus-visible { outline: 2px solid var(--brand-accent); outline-offset: 3px; }
.rich-header nav .nav-pill span { color: inherit !important; }
.rich-header nav .nav-pill svg { stroke: currentColor !important; }
.rich-header .story-dropdown-links { background: var(--brand-primary) !important; border-color: var(--brand-hover); }
.rich-header .story-dropdown-links a strong { color: #fff; }
.rich-header .story-dropdown-links a small { color: var(--brand-line); }
.rich-header .story-dropdown-links a:hover { background: var(--brand-hover) !important; }
.rich-header .account-dropdown-links form { margin: 0; border-top: 1px solid #ffffff15; }
.rich-header .account-dropdown-links form button {
    display: grid; grid-template-columns: 25px 1fr 18px; gap: .7rem; align-items: center;
    width: 100%; box-sizing: border-box; padding: 1rem .6rem; border: 0; border-radius: 7px;
    background: transparent; color: var(--brand-surface); text-align: left; font: inherit; cursor: pointer;
}
.rich-header .account-dropdown-links form button:hover { background: var(--brand-hover); }
.rich-header .account-dropdown-links form { width: 100%; }
.rich-header nav .nav-pill.active:where(:not(.nav-login, .nav-subscribe, .nav-donate, .nav-studio)) { color: var(--brand-accent-soft) !important; }
.rich-header nav .nav-pill:is(.nav-subscribe, .nav-donate, .nav-studio),
.rich-header nav .nav-pill:is(.nav-subscribe, .nav-donate, .nav-studio):is(.active, [aria-current="page"]) {
    background: var(--brand-accent) !important;
    border-color: var(--brand-accent) !important;
    color: var(--brand-ink) !important;
}
.rich-header nav .nav-subscribe:hover, .rich-header nav .nav-donate:hover, .rich-header nav .nav-studio:hover {
    background: var(--brand-accent-soft) !important; color: var(--brand-ink) !important;
}
.rich-header nav :is(.nav-donate,.nav-studio) svg { stroke: var(--brand-ink) !important; }
.rich-header.menu-open .menu-toggle { background: var(--brand-accent) !important; border-color: var(--brand-accent) !important; }
.rich-header.menu-open .menu-toggle span { background: var(--brand-ink) !important; }
.rich-footer { background: var(--brand-primary); border-top: 3px solid var(--brand-accent); }
.rich-footer :is(p, small) { color: var(--brand-line); }
.rich-footer a { color: var(--brand-paper); }
.rich-footer a:hover { color: var(--brand-accent-soft); }
:is(.hero-button,.primary-action,.community-button,.gate-subscribe,.story-button,.contact-submit,.secondary-action,.editor-save-record,.comment-share-button),
.member-signin button[type=submit] {
    background: var(--brand-accent) !important;
    color: var(--brand-ink) !important;
    border-color: var(--brand-accent) !important;
    text-shadow: none;
}
:is(.hero-button,.primary-action,.community-button,.gate-subscribe,.story-button,.contact-submit,.secondary-action,.editor-save-record,.comment-share-button):hover:not(:disabled),
.member-signin button[type=submit]:hover:not(:disabled) {
    background: var(--brand-primary) !important; color: #fff !important; border-color: var(--brand-primary) !important;
}
.story-invitation .story-button:hover, .rich-footer .community-button:hover { background: var(--brand-accent-soft) !important; color: var(--brand-ink) !important; }
:is(.hero-button,.community-button,.gate-subscribe,.story-button) span { color: inherit; }
body .subscriber-directory { background: #fff; border-color: var(--brand-line); }
body .subscriber-table thead th { background: var(--brand-primary); border-color: var(--brand-hover); }
body .subscriber-table thead th button, body .topic-action-heading { color: var(--brand-paper); }
body .subscriber-table thead th[aria-sort=ascending] button, body .subscriber-table thead th[aria-sort=descending] button { color: var(--brand-accent-soft); }
body .subscriber-table tbody tr:hover { background: var(--brand-surface); }
body .subscriber-overview > div:first-child { background: var(--brand-primary); border-color: var(--brand-primary); }
body .subscriber-overview > div:first-child strong { color: #fff; }
body .subscriber-overview > div:first-child span { color: var(--brand-line); }
body .subscriber-overview > div:first-child::after { content: ""; position: absolute; bottom: 0; left: 27px; right: 27px; height: 3px; background: var(--brand-accent); }
body .resource-category-header { background: var(--brand-primary); border-bottom: 3px solid var(--brand-accent); }
body .resource-category-header h3 { color: #fff; }
body .resource-category-header small { color: var(--brand-line); }
body .resource-category-header > span { color: var(--brand-accent); }
body .resource-table thead th { background: var(--brand-surface); color: var(--brand-muted); }
body .resource-table a { color: var(--brand-accent-ink); }
body .subscriber-modal-toolbar, body .subscriber-modal-footer { background: var(--brand-surface); }
body .subscriber-modal-toolbar { border-top: 3px solid var(--brand-accent); }
body .subscriber-modal-toolbar .subscriber-close { background: var(--brand-primary); color: #fff; }
body .studio-navigation a.active { background: var(--brand-primary); color: #fff; box-shadow: inset 0 -3px var(--brand-accent); }
body .studio-navigation a:not(.active):hover { background: var(--brand-accent-soft); color: var(--brand-primary); }
body .subscriber-gate { background: radial-gradient(ellipse at top, #fff, var(--brand-surface) 65%, var(--brand-line)); border-color: var(--brand-line); }
body .gate-lock { background: var(--brand-primary); color: var(--brand-accent); }
body .gate-orbit { border-color: var(--brand-accent); }
body .subscriber-gate h2 em { color: var(--brand-accent-ink); }
body .gate-signin a { color: var(--brand-accent-ink); }
body .story-invitation { background: var(--brand-primary); }
body .story-invitation em { color: var(--brand-accent-soft); }
body .story-invitation .story-eyebrow { color: var(--brand-line); }
body .story-text-link { color: var(--brand-accent-soft); }
body .story-hero-copy h1 em, body .member-signin h1 em { color: var(--brand-accent-ink); }
body .story-hero-photo figcaption > span { color: var(--brand-accent); }
body .story-prose, body .gate-description, body .gate-signin { color: var(--brand-muted); }
body .story-invitation .story-prose { color: var(--brand-line); }
body .new-home-copy .eyebrow, body .new-home-copy .hero-kicker { color: var(--brand-accent-soft); }
body .subscriber-status { color: var(--brand-primary); background: var(--brand-surface); border-color: var(--brand-line); }
body .subscriber-status.disabled { color: var(--brand-accent-ink); background: var(--brand-accent-soft); border-color: var(--brand-accent-soft); }
body .subscriber-danger { color: var(--brand-danger); background: #FFF0EC; border-color: #E8B9AB; }
body .subscription-error, body .validation-message, body .field-error { color: var(--brand-danger); }
:where(input, textarea, select) { accent-color: var(--brand-primary); }
:where(a, button, input, textarea, select, summary):focus-visible { outline: 3px solid var(--brand-accent); outline-offset: 3px; }
