/* Outliyr public tokens. Single source of truth for the dashboard look on
 * opted-in public templates. Mirrors :root[data-theme] in styles-mock.css.
 *
 * Light is the default on public shells (cold visitors, prospective sponsors,
 * journalists). Dark is opt-in via the user toggle (sets data-theme="dark"
 * on documentElement + body class).
 */

:root,
:root[data-theme="light"] {
  --bg-canvas:#ffffff;--bg-subtle:#f7f8fa;--surface:#ffffff;--surface-elevated:#f7f8f9;--surface-overlay:#e9edf3;--surface-inverse:#000e1c;
  --text-primary:#111111;--text-secondary:#3f3f3f;--text-muted:#666666;--text-on-accent:#ffffff;--text-inverse:#ffffff;
  --border-default:#cccccc;--border-subtle:#f0f0f0;--border-strong:#bfbfbf;
  --accent-primary:#1e73be;--accent-secondary:#fcb900;--brand-dark-blue:#112e9c;--accent-primary-soft:rgba(30, 127, 210, 0.08);
  --success:#2f9960;--warning:#b8860b;--danger:#c2383a;--info:#1e7fd2;
  --link:#1834a1;--link-hover:#042192;--link-visited:#6b4fb8;
  --state-warning-bg:#fffbeb;--state-success-bg:#ecfdf5;--state-danger-bg:#fef2f2;--state-info-bg:#eff6ff;
  --shadow-color:rgba(20, 30, 50, 0.12);
  --bg:var(--bg-canvas);--bg-2:var(--bg-subtle);--panel:var(--surface);--panel-2:var(--surface-elevated);--panel-3:var(--surface-overlay);
  --border:var(--border-default);--border-2:var(--border-strong);--border-glow:rgba(30, 127, 210, 0.3);
  --text:var(--text-primary);--text-2:var(--text-secondary);--text-3:var(--text-muted);--text-4:#a0a9b4;
  --blue:var(--accent-primary);--blue-dim:var(--link-hover);--blue-ink:#1b5e95;--blue-soft:var(--accent-primary-soft);
  --green:var(--success);--yellow:var(--accent-secondary);--orange:#c0631b;--red:var(--danger);--sage:#6b8f76;--violet:var(--link-visited);
  --pro:linear-gradient(135deg,#e8a232 0%, #c47818 100%);
  --radius:4px;
  --font:"IBM Plex Sans", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --mono:"IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --ol-color-bg-primary:var(--bg-canvas);--ol-color-bg-secondary:var(--bg-subtle);
  --ol-color-panel-1:var(--surface);--ol-color-panel-2:var(--surface-elevated);--ol-color-panel-3:var(--surface-overlay);
  --ol-color-text-1:var(--text-primary);--ol-color-text-2:var(--text-secondary);--ol-color-text-3:var(--text-muted);
  --ol-color-border-1:var(--border-default);--ol-color-border-2:var(--border-strong);
  --ol-color-blue-500:var(--accent-primary);--ol-color-green:var(--success);--ol-color-red:var(--danger);
}

:root[data-theme="dark"] {
  --bg-canvas:#0a0b0d;--bg-subtle:#0f1114;--surface:#13161b;--surface-elevated:#1f232c;--surface-overlay:#272c37;--surface-inverse:#ffffff;
  --text-primary:#e8ebf0;--text-secondary:#aab3be;--text-muted:#6e7684;--text-on-accent:#ffffff;--text-inverse:#0d1b2a;
  --border-default:#383d47;--border-subtle:#2a2f38;--border-strong:#4b5160;
  --accent-primary:#3da5ff;--accent-secondary:#f2d046;--brand-dark-blue:#9dd0ff;--accent-primary-soft:rgba(61, 165, 255, 0.12);
  --success:#4cce8a;--warning:#f2d046;--danger:#e85d5d;--info:#3da5ff;
  --link:#3da5ff;--link-hover:#9dd0ff;--link-visited:#b99cf0;
  --state-warning-bg:#2a2110;--state-success-bg:#10251b;--state-danger-bg:#2a1417;--state-info-bg:#102133;
  --shadow-color:rgba(0, 0, 0, 0.4);
  --border-glow:rgba(61, 165, 255, 0.35);--text-4:#4a5160;--blue-ink:#9dd0ff;--orange:#f08a3e;--sage:#aec9b5;
  --pro:linear-gradient(135deg,#f2d046 0%, #e8a232 100%);
  --base:#0a0b0d;--base-2:#0f1114;--base-3:#13161b;--alt-bg:#1f232c;
  --contrast:#e8ebf0;--contrast-2:#aab3be;--contrast-3:#6e7684;
  --accent:#3da5ff;--light-blue:#3da5ff;--gold:#f2d046;--dark-blue:#9dd0ff;--light-black:#aab3be;
}

:root[data-theme="dark"] body,
:root[data-theme="dark"] #page,
:root[data-theme="dark"] .site,
:root[data-theme="dark"] .site-content,
:root[data-theme="dark"] .content-area,
:root[data-theme="dark"] .grid-container,
:root[data-theme="dark"] .entry-content,
:root[data-theme="dark"] .inside-article {
  background-color:var(--bg-canvas, #0a0b0d) !important;
  color:var(--text-primary, #e8ebf0) !important;
}

:root[data-theme="dark"] .site-header,
:root[data-theme="dark"] .main-navigation,
:root[data-theme="dark"] .inside-navigation,
:root[data-theme="dark"] .mobile-header-navigation,
:root[data-theme="dark"] .gen-sidebar-nav,
:root[data-theme="dark"] .nav-below-header {
  background-color:var(--bg-subtle, #0f1114) !important;
  color:var(--text-primary, #e8ebf0) !important;
  border-color:var(--border-default, #383d47) !important;
}

:root[data-theme="dark"] .main-navigation a,
:root[data-theme="dark"] .main-navigation .main-nav ul li a,
:root[data-theme="dark"] .menu-toggle {
  color:var(--text-primary, #e8ebf0) !important;
}

:root[data-theme="dark"] .main-navigation a:hover,
:root[data-theme="dark"] .main-navigation .main-nav ul li a:hover,
:root[data-theme="dark"] .menu-toggle:hover {
  color:var(--link, #3da5ff) !important;
}

:root[data-theme="dark"] .entry-content a {
  color:var(--link, #3da5ff) !important;
}

:root[data-theme="dark"] .entry-content a:hover {
  color:var(--link-hover, #9dd0ff) !important;
}

:root[data-theme="dark"] .footer-widgets,
:root[data-theme="dark"] .footer-widgets-container,
body.outliyr-public-dark .footer-widgets,
body.outliyr-public-dark .footer-widgets-container {
  background-color:var(--bg-canvas, #0a0b0d) !important;
  color:var(--text-muted, #6e7684) !important;
}

:root[data-theme="dark"] .site-info,
body.outliyr-public-dark .site-info {
  background-color:var(--bg-subtle, #0f1114) !important;
  color:var(--text-muted, #6e7684) !important;
}

@media (min-width: 769px) and (max-width: 1075px) {
  body #masthead.site-header {
    display:block !important;
  }

  body #masthead .inside-header {
    display:flex !important;
    align-items:center;
  }

  body #masthead #mobile-menu-control-wrapper.main-navigation {
    display:flex !important;
    width:auto !important;
    height:44px !important;
    min-width:148px;
    margin-left:auto;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    flex:0 0 auto;
  }

  body #masthead #mobile-menu-control-wrapper .outliyr-theme-toggle-slot,
  body #masthead #mobile-menu-control-wrapper .outliyr-search-mobile-trigger--header,
  body #masthead #mobile-menu-control-wrapper .spt-theme-toggle,
  body #masthead #mobile-menu-control-wrapper .menu-toggle {
    width:44px !important;
    height:44px !important;
    min-width:44px !important;
    flex:0 0 44px !important;
  }
}

@media (max-width: 768px) {
  body #mobile-header .inside-navigation {
    display:flex !important;
    align-items:center;
    flex-wrap:nowrap;
  }

  body #mobile-header .navigation-branding,
  body #mobile-header .site-logo,
  body #mobile-header .site-logo.mobile-header-logo {
    margin-right:auto;
  }

  body #mobile-header .outliyr-theme-toggle-slot {
    margin-left:auto;
    order:2;
    flex:0 0 auto;
  }

  body #mobile-header .menu-toggle {
    order:3;
    margin-left:8px;
  }
}

:root[data-theme="dark"] .outliyr-feed-thumb,
:root[data-theme="dark"] .ol-comments-cta,
:root[data-theme="dark"] #outliyr-toc-drawer,
:root[data-theme="dark"] .osp-btn,
:root[data-theme="dark"] .outliyr-category-pill,
:root[data-theme="dark"] .product,
:root[data-theme="dark"] .product-small,
:root[data-theme="dark"] .woocommerce ul.products li.product,
:root[data-theme="dark"] .woocommerce-loop-product__link {
  background-color:var(--surface, #13161b) !important;
  color:var(--text-primary, #e8ebf0) !important;
  border-color:var(--border-default, #383d47) !important;
}

:root[data-theme="dark"] .outliyr-category-pill:hover,
:root[data-theme="dark"] .osp-btn:hover {
  background-color:var(--surface-elevated, #1f232c) !important;
  color:var(--text-primary, #e8ebf0) !important;
}

:root[data-theme="dark"] a.gb-button:not(.gb-button-text),
:root[data-theme="dark"] .gb-button:not(.gb-button-text) {
  background-color:var(--accent-primary, #3da5ff) !important;
  color:var(--text-on-accent, #ffffff) !important;
  border-color:var(--accent-primary, #3da5ff) !important;
}

:root[data-theme="dark"] .cat-links a,
:root[data-theme="dark"] .tags-links a,
:root[data-theme="dark"] .entry-meta a,
:root[data-theme="dark"] .gb-query-loop-item a[rel="tag"] {
  background-color:var(--surface-elevated, #1f232c) !important;
  color:var(--link, #3da5ff) !important;
  border-color:var(--border-default, #383d47) !important;
}

:root[data-theme="dark"] .oi-personalize-panel,
:root[data-theme="dark"] .oi-filters,
:root[data-theme="dark"] .oi-chip,
:root[data-theme="dark"] .oi-table,
:root[data-theme="dark"] .oi-table thead,
:root[data-theme="dark"] .oi-table tbody,
:root[data-theme="dark"] .oi-table th,
:root[data-theme="dark"] .oi-table td,
:root[data-theme="dark"] .oi-row,
:root[data-theme="dark"] .oi-card,
:root[data-theme="dark"] .oi-card-row,
:root[data-theme="dark"] .oi-col-compare,
:root[data-theme="dark"] .oi-col-tried,
:root[data-theme="dark"] .oi-col-name,
:root[data-theme="dark"] .oi-col-type,
:root[data-theme="dark"] .oi-col-score,
:root[data-theme="dark"] .oi-col-tier,
:root[data-theme="dark"] .oi-col-best,
:root[data-theme="dark"] .oi-results,
:root[data-theme="dark"] .oi-results-table,
:root[data-theme="dark"] .oi-panel,
:root[data-theme="dark"] .oi-widget {
  background-color:var(--surface, #13161b) !important;
  color:var(--text-primary, #e8ebf0) !important;
  border-color:var(--border-default, #383d47) !important;
}

:root[data-theme="dark"] .oi-row:nth-child(even),
:root[data-theme="dark"] .oi-table tr:nth-child(even),
:root[data-theme="dark"] .oi-chip:hover {
  background-color:var(--surface-elevated, #1f232c) !important;
}

:root[data-theme="dark"] .ol-comments-cta a,
:root[data-theme="dark"] .ol-byline-comments-link a,
:root[data-theme="dark"] .widget a,
:root[data-theme="dark"] .main-navigation .sub-menu a,
:root[data-theme="dark"] .outliyr-archive-card,
:root[data-theme="dark"] .outliyr-archive-card__inner,
:root[data-theme="dark"] .outliyr-archive-card-content,
:root[data-theme="dark"] .oi-suggest {
  background-color:var(--surface, #13161b) !important;
  color:var(--text-primary, #e8ebf0) !important;
  border-color:var(--border-default, #383d47) !important;
}

:root[data-theme="dark"] .ol-comments-cta a:hover,
:root[data-theme="dark"] .ol-byline-comments-link a:hover,
:root[data-theme="dark"] .widget a:hover {
  background-color:var(--surface-elevated, #1f232c) !important;
  color:var(--link-hover, #9dd0ff) !important;
}

.menu-bar-items .outliyr-theme-toggle-slot {
  display:flex;
  align-items:center;
  gap:8px;
  line-height:1;
}

.outliyr-search-mobile-trigger--header {
  display:none;
}

.spt-theme-toggle {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  min-width:36px;
  padding:0;
  border:1px solid var(--border-default, #d9dee6);
  border-radius:12px;
  background:var(--surface, #ffffff);
  color:var(--text-secondary, #3a4555);
  box-shadow:0 1px 2px var(--shadow-color, rgba(20, 30, 50, 0.12));
  cursor:pointer;
}

.spt-theme-toggle:hover,
.spt-theme-toggle:focus {
  color:var(--text-primary, #111111);
  border-color:var(--border-strong, #b9c1cc);
}

.spt-theme-toggle:focus-visible {
  outline:2px solid var(--accent-primary, #1e7fd2);
  outline-offset:2px;
}

.spt-theme-toggle .spt-icon {
  width:18px;
  height:18px;
}

.spt-theme-toggle__sun {
  display:none;
}

.spt-theme-toggle__moon {
  display:block;
}

:root[data-theme="dark"] .spt-theme-toggle__sun,
.outliyr-public-shell[data-theme="dark"] .spt-theme-toggle__sun {
  display:block;
}

:root[data-theme="dark"] .spt-theme-toggle__moon,
.outliyr-public-shell[data-theme="dark"] .spt-theme-toggle__moon {
  display:none;
}

:root[data-theme="dark"] .spt-theme-toggle {
  background:var(--surface, #13161b);
  color:var(--text-primary, #e8ebf0);
  border-color:var(--border-default, #383d47);
  box-shadow:none;
}

:root[data-theme="dark"] .spt-theme-toggle:hover,
:root[data-theme="dark"] .spt-theme-toggle:focus {
  color:var(--text-primary, #e8ebf0);
  border-color:var(--border-strong, #4b5160);
}

:root[data-theme="dark"] h1,
:root[data-theme="dark"] h2,
:root[data-theme="dark"] h3,
:root[data-theme="dark"] h4,
:root[data-theme="dark"] h5,
:root[data-theme="dark"] .entry-title,
:root[data-theme="dark"] .gb-headline {
  color:var(--text-primary, #e8ebf0) !important;
}

:root[data-theme="dark"] .gb-button,
:root[data-theme="dark"] a.gb-button,
:root[data-theme="dark"] .wp-block-button__link.has-background,
:root[data-theme="dark"] a.wp-block-button__link.has-background {
  color:var(--text-on-accent, #ffffff) !important;
}

:root[data-theme="dark"] .gb-button-text,
:root[data-theme="dark"] a.wp-block-button__link:not(.has-background) {
  color:var(--accent-primary, #3da5ff) !important;
  background-color:transparent !important;
}

@media (max-width: 1075px) {
  .outliyr-theme-toggle-slot {
    order:2;
  }

  .outliyr-search-mobile-trigger.outliyr-search-mobile-trigger--header {
    display:flex;
    order:1;
    width:44px;
    height:44px;
    min-width:44px;
    flex:0 0 44px;
    align-items:center;
    justify-content:center;
    border:1px solid var(--border-default, #cccccc);
    border-radius:12px;
    background:var(--surface, #ffffff);
    color:var(--text-primary, #111111);
    padding:0;
  }

  .spt-theme-toggle {
    order:2;
    width:44px;
    height:44px;
    min-width:44px;
    flex:0 0 44px;
  }

  .main-navigation .menu-toggle,
  #mobile-menu-control-wrapper .menu-toggle,
  #mobile-header .menu-toggle {
    order:3;
    min-width:44px;
    width:44px;
    height:44px;
    flex:0 0 44px;
    flex-grow:0 !important;
    flex-shrink:0 !important;
    align-items:center;
    justify-content:center;
  }

  :root[data-theme="dark"] .outliyr-search-mobile-trigger.outliyr-search-mobile-trigger--header {
    background:var(--surface, #13161b);
    color:var(--text-primary, #e8ebf0);
    border-color:var(--border-default, #383d47);
  }
}

.outliyr-search-mobile-trigger--header .outliyr-search-mobile-icon {
  border-color:currentColor;
}

.outliyr-search-mobile-trigger--header .outliyr-search-mobile-icon::after {
  background:currentColor;
}

:root[data-theme="dark"] input:not([type="submit"]):not([type="button"]):not([type="reset"]),
:root[data-theme="dark"] textarea,
:root[data-theme="dark"] select,
:root[data-theme="dark"] .wp-block-search__input,
:root[data-theme="dark"] .comment-form input:not([type="submit"]),
:root[data-theme="dark"] .comment-form textarea,
:root[data-theme="dark"] .formkit-input,
:root[data-theme="dark"] .formkit-select,
:root[data-theme="dark"] .formkit-textarea,
:root[data-theme="dark"] .wp-block-convertkit-form-builder-field input,
:root[data-theme="dark"] .wp-block-convertkit-form-builder-field textarea {
  background-color:var(--surface, #13161b) !important;
  color:var(--text-primary, #e8ebf0) !important;
  border-color:var(--border-default, #383d47) !important;
}

:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder,
:root[data-theme="dark"] .formkit-input::placeholder {
  color:var(--text-muted, #6e7684) !important;
}

:root[data-theme="dark"] .formkit-form,
:root[data-theme="dark"] .formkit-fields,
:root[data-theme="dark"] .convertkit-form,
:root[data-theme="dark"] .wp-block-convertkit-form-builder,
:root[data-theme="dark"] .wp-block-convertkit-form-builder-form {
  background-color:var(--surface, #13161b) !important;
  color:var(--text-primary, #e8ebf0) !important;
  border-color:var(--border-default, #383d47) !important;
}

:root[data-theme="dark"] .outliyr-search-modal {
  color:var(--text-primary, #e8ebf0) !important;
}

:root[data-theme="dark"] .outliyr-search-panel,
:root[data-theme="dark"] .outliyr-search-input,
:root[data-theme="dark"] .outliyr-search-default,
:root[data-theme="dark"] .outliyr-search-results {
  background-color:var(--surface, #13161b) !important;
  color:var(--text-primary, #e8ebf0) !important;
}

:root[data-theme="dark"] .outliyr-search-input-wrap,
:root[data-theme="dark"] .outliyr-search-filters,
:root[data-theme="dark"] .outliyr-search-footer {
  border-color:var(--border-default, #383d47) !important;
}

:root[data-theme="dark"] .outliyr-search-footer,
:root[data-theme="dark"] .outliyr-search-clear,
:root[data-theme="dark"] .outliyr-search-close,
:root[data-theme="dark"] .outliyr-search-kbd {
  background-color:var(--surface-elevated, #1f232c) !important;
  color:var(--text-secondary, #aab3be) !important;
  border-color:var(--border-default, #383d47) !important;
}

:root[data-theme="dark"] .outliyr-search-mobile-trigger,
:root[data-theme="dark"] .outliyr-search-mobile-trigger:active {
  background-color:transparent;
  color:var(--text-primary, #e8ebf0);
}

:root[data-theme="dark"] .outliyr-sticky-toc,
:root[data-theme="dark"] .outliyr-sticky-toc__inner,
:root[data-theme="dark"] #ez-toc-container,
:root[data-theme="dark"] .lwptoc,
:root[data-theme="dark"] .lwptoc_i,
:root[data-theme="dark"] .gb-accordion,
:root[data-theme="dark"] .gb-accordion__item,
:root[data-theme="dark"] .gb-accordion__content,
:root[data-theme="dark"] .comment-respond,
:root[data-theme="dark"] #comments,
:root[data-theme="dark"] #commentform,
:root[data-theme="dark"] .outliyr-member-sidebar,
:root[data-theme="dark"] .oms-sidebar,
:root[data-theme="dark"] .oms-panel,
:root[data-theme="dark"] .oms-card,
:root[data-theme="dark"] [class*="pro-tip"],
:root[data-theme="dark"] [class*="protip"] {
  background-color:var(--surface, #13161b) !important;
  color:var(--text-primary, #e8ebf0) !important;
  border-color:var(--border-default, #383d47) !important;
}

:root[data-theme="dark"] .gb-accordion__toggle,
:root[data-theme="dark"] .outliyr-sticky-toc a,
:root[data-theme="dark"] #ez-toc-container a,
:root[data-theme="dark"] .lwptoc a,
:root[data-theme="dark"] .comment-respond a,
:root[data-theme="dark"] #comments a,
:root[data-theme="dark"] .outliyr-member-sidebar a,
:root[data-theme="dark"] .oms-sidebar a {
  color:var(--link, #3da5ff) !important;
}

:root[data-theme="dark"] .gb-accordion__toggle {
  background-color:var(--surface-elevated, #1f232c) !important;
  border-color:var(--border-default, #383d47) !important;
}

:root[data-theme="dark"] .woocommerce,
:root[data-theme="dark"] .woocommerce-page,
:root[data-theme="dark"] .woocommerce div.product,
:root[data-theme="dark"] .woocommerce ul.products li.product,
:root[data-theme="dark"] .woocommerce div.product .woocommerce-tabs,
:root[data-theme="dark"] .woocommerce-Tabs-panel,
:root[data-theme="dark"] .woocommerce table.shop_table,
:root[data-theme="dark"] .woocommerce .woocommerce-ordering select {
  background-color:var(--bg-canvas, #0a0b0d) !important;
  color:var(--text-primary, #e8ebf0) !important;
  border-color:var(--border-default, #383d47) !important;
}

.outliyr-public-shell,
.outliyr-public-shell[data-theme="light"] {
  --bg:#F7F8FA;--bg-2:#EEF1F6;--panel:#FFFFFF;--panel-2:#E8EDF5;--panel-3:#DFE4EE;
  --border:#C5CCD6;--border-2:#9CA5B3;--border-glow:rgba(30,127,210,.3);
  --text:#0D1B2A;--text-2:#3A4555;--text-3:#6B7684;--text-4:#A0A9B4;
  --blue:#1E7FD2;--blue-dim:#0F5A9A;--blue-ink:#1B5E95;--blue-soft:rgba(30,127,210,.08);
  --green:#2F9960;--yellow:#B8941E;--orange:#C0631B;--red:#C2383A;--sage:#6B8F76;--violet:#6B4FB8;
  --pro:linear-gradient(135deg,#E8A232 0%, #C47818 100%);
  --radius:4px;
  --font:"IBM Plex Sans", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --mono:"IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

:root[data-theme="dark"] .outliyr-public-shell,
.outliyr-public-shell[data-theme="dark"] {
  --bg:#0A0B0D;--bg-2:#0F1114;--panel:#13161B;--panel-2:#1F232C;--panel-3:#272C37;
  --border:#383D47;--border-2:#4B5160;--border-glow:rgba(61,165,255,.35);
  --text:#E8EBF0;--text-2:#AAB3BE;--text-3:#6E7684;--text-4:#4A5160;
  --blue:#3DA5FF;--blue-dim:#1E5C96;--blue-ink:#9DD0FF;--blue-soft:rgba(61,165,255,.12);
  --green:#4CCE8A;--yellow:#F2D046;--orange:#F08A3E;--red:#E85D5D;--sage:#AEC9B5;--violet:#B99CF0;
  --pro:linear-gradient(135deg,#F2D046 0%, #E8A232 100%);
}

.outliyr-public-shell {
  background: var(--bg);
  color: var(--text);
  font-family: var(--font);
  position: relative;
}

/* Subtle blue radial atmosphere bleeding from the upper right.
 * Pure CSS, no fetch, no JS. Doubles as a visual continuity signal with
 * the dashboard which uses the same accent. */
.outliyr-public-shell::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background: radial-gradient(900px 600px at 88% -10%, var(--blue-soft), transparent 60%);
}

.outliyr-public-shell > * {
  position: relative;
  z-index: 1;
}

.outliyr-public-shell a { color: var(--blue); text-decoration: none; }
.outliyr-public-shell a:hover { text-decoration: underline; }
.outliyr-public-shell h1, .outliyr-public-shell h2, .outliyr-public-shell h3, .outliyr-public-shell h4 {
  color: var(--text);
  font-family: var(--font);
  letter-spacing: 0;
}
.outliyr-public-shell *, .outliyr-public-shell *::before, .outliyr-public-shell *::after {
  box-sizing: border-box;
}

/* GeneratePress chrome + page wrapper dark integration. The theme-toggle JS
 * adds body.outliyr-public-dark when data-theme=dark is set on
 * documentElement. We make the ENTIRE page dark (body, #page, .site-content,
 * .grid-container, header, footer) so there is no light frame around the
 * dark public shell.
 *
 * Class-name guards verified via DevTools 2026-04-29; if GP theme classes
 * drift, re-grep with curl https://outliyr.com/trials/. */
body.outliyr-public-dark,
body.outliyr-public-dark #page,
body.outliyr-public-dark .site,
body.outliyr-public-dark .site-content,
body.outliyr-public-dark .content-area,
body.outliyr-public-dark .grid-container,
body.outliyr-public-dark .grid-container.container.hfeed,
body.outliyr-public-dark .site-header,
body.outliyr-public-dark .main-navigation,
body.outliyr-public-dark .inside-navigation,
body.outliyr-public-dark .gen-sidebar-nav,
body.outliyr-public-dark .nav-below-header,
body.outliyr-public-dark .site-footer,
body.outliyr-public-dark #footer-widgets,
body.outliyr-public-dark .footer-widgets,
body.outliyr-public-dark .site-info {
  background-color: #0A0B0D !important;
  color: #E8EBF0 !important;
  border-color: #383D47 !important;
}

body.outliyr-public-dark .main-navigation a,
body.outliyr-public-dark .menu-item > a,
body.outliyr-public-dark .site-info a,
body.outliyr-public-dark .footer-widgets a {
  color: #AAB3BE !important;
}

body.outliyr-public-dark .main-navigation a:hover,
body.outliyr-public-dark .menu-item > a:hover {
  color: #3DA5FF !important;
}

/* Logo swap: replace black-text variant with the white-text variant under
 * dark mode. Uses the canonical white logo PNG hosted in WP uploads (also
 * used by /clip/ landing pages). The existing outliyr-dark-mode-chrome
 * mu-plugin only matched .site-logo img.is-logo-image; the actual GP DOM
 * on these pages renders the logo as <a><img class="header-image is-logo-image"></a>
 * with no .site-logo wrapper, so we target by img class directly. */
body.outliyr-public-dark img.is-logo-image,
body.outliyr-public-dark img.header-image {
  content: url('https://outliyr.com/wp-content/uploads/Outliyr-Logo-2025-White-Img-White-Text-700px.png');
}

body.outliyr-public-dark .main-navigation .sub-menu {
  background-color: #13161B !important;
  border-color: #383D47 !important;
}

/* Outliyr sitewide top banner (TIB CTA) is the deliberate global orange
 * accent; pass through unchanged in dark mode. */
body.outliyr-public-dark .top-bar,
body.outliyr-public-dark .top-bar-text { /* keep banner orange; pass through */ }

body.outliyr-public-dark .footer-widgets,
body.outliyr-public-dark .footer-widgets-container {
  background-color:var(--bg-canvas, #0a0b0d) !important;
  color:var(--text-muted, #6e7684) !important;
}

body.outliyr-public-dark .site-info {
  background-color:var(--bg-subtle, #0f1114) !important;
  color:var(--text-muted, #6e7684) !important;
}