:root {
    /* DEFAULTS — kept here so any /pages/{cc}/ rendered without a domain
     * theme (e.g. local dev with no Host header) still gets the historical
     * blue look. Per-domain themes override these via theme-head.php's
     * inline <style id="t1-theme-vars"> block, which loads after this
     * stylesheet so the runtime palette wins. */
    --t1-accent: #2563eb;
    --t1-accent-hover: #1e40af;
    --t1-accent-deep: #1e3a8a;
    --t1-accent-soft: #eff6ff;
    --t1-text: #0f172a;
    --t1-text-muted: #475569;
    --t1-border: #e2e8f0;
    --t1-border-soft: #f1f5f9;
    --t1-bg-soft: #f8fafc;
    --t1-radius-sm: 8px;
    --t1-radius: 12px;
    --t1-radius-lg: 16px;
    --t1-shadow-card: 0 1px 2px rgba(15, 23, 42, .05), 0 4px 16px rgba(15, 23, 42, .06);
    --t1-shadow-card-hover: 0 4px 8px rgba(15, 23, 42, .08), 0 18px 36px rgba(15, 23, 42, .10);
    --t1-shadow-button: 0 2px 4px rgba(37, 99, 235, .22), 0 6px 16px rgba(37, 99, 235, .26);
    --t1-shadow-button-hover: 0 3px 6px rgba(37, 99, 235, .26), 0 14px 30px rgba(37, 99, 235, .34);
    --t1-ease: cubic-bezier(.4, 0, .2, 1);
    --t1-duration: 220ms;
}

/* ── Per-domain body theming ────────────────────────────────────────────
 * When a theme preset defines font_body / body_bg / page_text via
 * theme-head.php, those land as `--t1-page-bg` etc on :root. The body
 * rule below picks them up via var() with sensible fallbacks (white +
 * gray-900 + system-ui, mirroring the historical look).
 *
 * The `html[data-theme]` selector boost (specificity 0,1,1) beats the
 * Tailwind `bg-white text-gray-900 font-sans` utilities on <body> so the
 * theme wins without an !important. Pages without `data-theme` on <html>
 * (legacy / unthemed) keep their historical Tailwind-utility look. */
html[data-theme] body {
    background-color: var(--t1-page-bg, #ffffff);
    color: var(--t1-page-text, #0f172a);
    font-family: var(--t1-font-body, system-ui, -apple-system, 'Segoe UI', sans-serif);
}
html[data-theme] .article-body,
html[data-theme] article,
html[data-theme] aside {
    color: var(--t1-page-text, #0f172a);
}
html[data-theme] .article-body h1,
html[data-theme] .article-body h2,
html[data-theme] .article-body h3,
html[data-theme] article h1,
html[data-theme] article h2,
html[data-theme] article h3,
html[data-theme] .font-serif {
    font-family: var(--t1-font-display, Georgia, 'Times New Roman', serif);
}

header {
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    box-shadow: 0 1px 0 rgba(15, 23, 42, .04), 0 2px 8px rgba(15, 23, 42, .02);
    backdrop-filter: saturate(140%);
    padding-top: 14px;
    padding-bottom: 14px;
}
/* On themed pages where the body bg is non-white (cream / parchment), the
 * default white-to-slate header gradient looks like an awkward sticker on
 * top of the body. Match the header to the body bg so the page reads as
 * one continuous surface — the brand identity comes from typography and
 * the accent rule below, not header chrome. */
html[data-theme] header {
    background: var(--t1-page-bg, linear-gradient(180deg, #ffffff 0%, #f8fafc 100%));
    border-bottom-color: var(--t1-accent-softer, #e2e8f0);
}
header .t1-brand-logo {
    font-size: 1.5rem !important;
    background: linear-gradient(120deg, var(--t1-text) 0%, var(--t1-accent) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
/* Themed pages drive the brand logo's font from the theme's display
 * stack — Fraunces for fmentoring, Cormorant for chordcall, IBM Plex Mono
 * for glassdesk, etc. The inline `style="font-family:Georgia,..."` on the
 * .t1-brand-logo span uses var() so this cascades cleanly through. */
html[data-theme] header .t1-brand-logo {
    font-family: var(--t1-font-display, Georgia, 'Times New Roman', serif) !important;
    background: linear-gradient(120deg, var(--t1-page-text, var(--t1-text)) 0%, var(--t1-accent) 100%);
    -webkit-background-clip: text;
    background-clip: text;
}
header nav,
header #menu-toggle,
#mobile-menu,
#login-modal {
    display: none !important;
}

.h-1.bg-accent {
    background: linear-gradient(90deg, var(--t1-accent) 0%, #06b6d4 100%);
    height: 3px !important;
}

#progress-bar {
    background: linear-gradient(90deg, var(--t1-accent) 0%, #06b6d4 100%) !important;
    height: 3px !important;
}

.text-accent {
    color: var(--t1-accent) !important;
}

.article-body img,
article img {
    border-radius: var(--t1-radius);
}
.article-body > div:has(> img:first-child:last-child) {
    box-shadow: var(--t1-shadow-card);
    border-radius: var(--t1-radius);
    transition: box-shadow var(--t1-duration) var(--t1-ease);
}
.article-body > div:has(> img:first-child:last-child):hover {
    box-shadow: var(--t1-shadow-card-hover);
}

aside > div.bg-white,
aside > div.border {
    box-shadow: var(--t1-shadow-card);
    transition: box-shadow var(--t1-duration) var(--t1-ease), transform var(--t1-duration) var(--t1-ease);
}
aside > div.bg-white:hover {
    box-shadow: var(--t1-shadow-card-hover);
}

.bg-accent {
    box-shadow: var(--t1-shadow-button);
    transition: background-color var(--t1-duration) var(--t1-ease),
                box-shadow var(--t1-duration) var(--t1-ease),
                transform var(--t1-duration) var(--t1-ease);
}
/* Hover background sourced from --t1-accent-hover so the per-domain theme
 * drives both states. Removes the need for `hover:bg-[#1e40af]` Tailwind
 * arbitrary classes on every CTA — those were pinned to the legacy blue
 * and never tracked the per-domain accent. */
.bg-accent:hover {
    background-color: var(--t1-accent-hover) !important;
    box-shadow: var(--t1-shadow-button-hover);
    transform: translateY(-1px);
}
.bg-accent:active {
    transform: translateY(0);
    box-shadow: var(--t1-shadow-button);
}

/* ── Themed footer + sidebar surface tint ───────────────────────────────
 * The shared landing-page footer is `bg-gray-50` by default. On themed
 * pages with a warm cream / parchment body bg, gray-50 reads as a cool
 * grey rectangle awkwardly stuck under the article. Pull it back to a
 * subtle tint of the theme's accent-softer so the footer feels like part
 * of the same surface. */
html[data-theme] footer.bg-gray-50 {
    background-color: var(--t1-accent-softer, #f8fafc) !important;
    border-top-color: var(--t1-accent-soft, #e2e8f0) !important;
}

#floating-cta {
    box-shadow: 0 6px 16px rgba(30, 58, 95, .25), 0 2px 4px rgba(30, 58, 95, .15);
    backdrop-filter: blur(4px);
    transition: transform var(--t1-duration) var(--t1-ease), box-shadow var(--t1-duration) var(--t1-ease);
    font-size: 0.95rem;
    padding: 14px 18px;
}
#floating-cta:not(.hidden) {
    animation: t1FloatIn 320ms var(--t1-ease) both;
}
@keyframes t1FloatIn {
    from { transform: translateY(8px); opacity: 0; }
    to   { transform: translateY(0);   opacity: 1; }
}


.preloader-pop {
    position: fixed;
    display: flex;
    background: rgba(255, 255, 255, 0.95);
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}
.preloader-info { display: block; }
.preloader-pop__inner { text-align: center; position: relative; }
.preloader-pop__inner h4 { font-size: 22px; color: #1a1a1a; margin-top: 15px; margin-bottom: 15px; }
.preloader-pop__inner p { margin: 10px 0; color: #555; }
.lds-ripple { display: inline-block; position: relative; width: 64px; height: 64px; }
.lds-ripple div {
    position: absolute;
    border: 3px solid #1a1a1a;
    opacity: 1;
    border-radius: 50%;
    animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
}
.lds-ripple div:nth-child(2) { animation-delay: -0.5s; }
@keyframes lds-ripple {
    0% { top: 28px; left: 28px; width: 0; height: 0; opacity: 1; }
    100% { top: 0; left: 0; width: 58px; height: 58px; opacity: 0; }
}

/* ── intl-tel-input ── */
.iti--allow-dropdown { width: 100%; }

/* ── Sidebar sticky ── */
.sidebar-sticky { position: sticky; top: 1.5rem; }

/* ── Calculator slider ── */
.calc-slider {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 6px;
    border-radius: 999px;
    background: #e5e7eb;
    outline: none;
    cursor: pointer;
    margin: 8px 0;
}
.calc-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #1a1a1a;
    border: 3px solid #fff;
    box-shadow: 0 1px 4px rgba(0,0,0,0.3);
    cursor: pointer;
    margin-top: -8px;
    transition: transform 0.15s;
}
.calc-slider::-webkit-slider-thumb:hover { transform: scale(1.15); }
.calc-slider::-moz-range-thumb {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #1a1a1a;
    border: 3px solid #fff;
    box-shadow: 0 1px 4px rgba(0,0,0,0.3);
    cursor: pointer;
}
.calc-slider::-webkit-slider-runnable-track {
    background: linear-gradient(to right, #1a1a1a 0%, #1a1a1a var(--slider-pct, 0%), #e5e7eb var(--slider-pct, 0%), #e5e7eb 100%);
    height: 6px;
    border-radius: 999px;
}
.calc-slider::-moz-range-track {
    background: linear-gradient(to right, #1a1a1a 0%, #1a1a1a var(--slider-pct, 0%), #e5e7eb var(--slider-pct, 0%), #e5e7eb 100%);
    height: 6px;
    border-radius: 999px;
}

/* ── Live feed ── */
.desk-feed-reel { will-change: transform; }
.desk-feed-row {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 8px 14px;
    border-bottom: 1px solid #f3f4f6;
    box-sizing: border-box;
}
.desk-feed-row:last-child { border-bottom: none; }
.live-pulse { animation: livePulse 2s ease-in-out infinite; }
@keyframes livePulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.4; }
}

/* ── Mobile ticker ── */
.mobile-slot-window { position: relative; }
.mobile-slot-reel { transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94); }
.mobile-slot-row { height: 40px; display: flex; align-items: center; }

.comment-item {
    opacity: 0;
    transform: translateY(12px);
    padding: 16px 6px;
    border-radius: var(--t1-radius-sm);
    transition: opacity 0.4s ease-out, transform 0.4s ease-out, background-color var(--t1-duration) var(--t1-ease);
}
.comment-item.visible {
    opacity: 1;
    transform: translateY(0);
}
.comment-item:hover {
    background-color: var(--t1-bg-soft);
}

.article-body {
    font-size: 1.25rem;
}
.article-body h1 {
    font-size: clamp(2rem, 4.4vw, 3.1rem);
    line-height: 1.18;
    letter-spacing: -0.02em;
    color: var(--t1-text);
}
.article-body p {
    font-size: 1.3rem;
    line-height: 1.8;
    margin-bottom: 1.65rem;
    color: #1f2937;
    letter-spacing: -0.003em;
}
.article-body > p:first-of-type,
.article-body > div + p,
article > p:first-of-type {
    font-size: 1.42rem;
    line-height: 1.7;
    color: var(--t1-text);
    font-weight: 500;
}
.article-body h2 {
    font-family: Georgia, 'Times New Roman', serif;
    font-size: clamp(1.7rem, 3vw, 2.15rem);
    font-weight: 700;
    margin: 3rem 0 1.3rem;
    color: var(--t1-text);
    line-height: 1.22;
    letter-spacing: -0.018em;
    position: relative;
    padding-left: 18px;
}
.article-body h2::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.55em;
    width: 5px;
    height: 0.85em;
    background: var(--t1-accent);
    border-radius: 3px;
}
.article-body h2 + p {
    margin-top: 0;
}
.article-body ul { margin: 1.5rem 0; }
.article-body ul li {
    margin-bottom: 1.4rem;
    font-size: 1.22rem;
    line-height: 1.7;
    color: #1f2937;
}
.article-body strong {
    color: var(--t1-text);
}
.article-body a {
    color: var(--t1-accent);
    text-underline-offset: 3px;
    transition: color var(--t1-duration) var(--t1-ease);
}
.article-body a:hover {
    color: var(--t1-accent-hover);
}

aside .calc-card,
aside .cta-card,
aside #live-feed-list,
aside > div {
    border-radius: var(--t1-radius-lg);
    border-color: var(--t1-border);
}
aside p,
aside .text-sm {
    font-size: 1rem;
    line-height: 1.55;
}
aside h3,
aside .font-serif {
    font-size: 1.2rem;
}

.bg-accent.text-white {
    font-size: 1.05rem;
    letter-spacing: 0.005em;
}
a.bg-accent.block,
button.bg-accent {
    padding-top: 14px;
    padding-bottom: 14px;
    border-radius: var(--t1-radius);
}

@media (min-width: 1024px) {
    .article-body p { font-size: 1.32rem; }
    .article-body ul li { font-size: 1.24rem; }
}

@media (max-width: 640px) {
    .article-body p { font-size: 1.2rem; line-height: 1.78; }
    .article-body > p:first-of-type,
    .article-body > div + p { font-size: 1.28rem; }
    .article-body ul li { font-size: 1.15rem; }
    .article-body h2 { padding-left: 14px; }
    .article-body h2::before { width: 4px; }
}

/* ── Masthead logo ── */
.masthead-logo {
    font-family: Georgia, 'Times New Roman', serif;
    font-weight: 700;
    font-size: 1.65rem;
    letter-spacing: -0.02em;
    color: #1a1a1a;
    text-decoration: none;
    display: inline-block;
}
.masthead-logo span {
    color: #1e3a5f;
    font-style: italic;
}

/* ============================================================
 * PER-THEME STRUCTURAL OVERRIDES — header / footer / buttons
 *
 * Mirrors the corporate-site approach in /assets/themes.css: each
 * brand-tied theme below pushes beyond colour swaps to give the
 * landing page a genuinely different shape. Same markup across
 * every country and every domain — the per-theme rules here key off
 * `html[data-theme="X"]` so adding a new branded domain is one
 * preset entry + one UPDATE row, no per-domain CSS file.
 *
 * Specificity: `html[data-theme=X]` (0,1,1) beats Tailwind utility
 * classes (0,1,0) without !important. For inline-styled brand-logo
 * spans (specificity 1,0,0,0) we use !important on the few rules
 * that need to win.
 *
 * Generic auto-hashed themes (violet/emerald/ocean/etc.) get
 * colour-only treatment from the :root vars + .bg-accent rule
 * above. They intentionally don't get per-theme structural
 * overrides — those are reserved for brand-tied themes where the
 * shape is part of the brand.
 * ============================================================ */

/* ───── FMENTORING — editorial cream / serif / square ───── */
html[data-theme="fmentoring"] .h-1.bg-accent {
    background: var(--t1-accent) !important;
    height: 4px !important;
}
html[data-theme="fmentoring"] header {
    border-bottom: none;
    box-shadow: 0 1px 0 var(--t1-accent-softer);
    padding-top: 22px;
    padding-bottom: 18px;
}
html[data-theme="fmentoring"] header > div::before {
    content: 'ISSUE NO. 01 · ' attr(data-pubdate);
    display: block;
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: .62rem;
    letter-spacing: .22em;
    color: var(--t1-accent);
    text-transform: uppercase;
    margin-bottom: 8px;
}
html[data-theme="fmentoring"] header .t1-brand-logo {
    font-style: normal !important;
    font-weight: 600 !important;
    font-size: 1.7rem !important;
    letter-spacing: -0.025em !important;
    background: none !important;
    -webkit-text-fill-color: var(--t1-page-text) !important;
    color: var(--t1-page-text) !important;
}
html[data-theme="fmentoring"] #login-button,
html[data-theme="fmentoring"] #mobile-login-button {
    color: var(--t1-page-text);
    text-transform: uppercase;
    letter-spacing: .14em;
    font-size: .7rem;
    font-weight: 600;
}
html[data-theme="fmentoring"] #register-button,
html[data-theme="fmentoring"] a.bg-accent {
    border-radius: 0 !important;
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: .72rem !important;
    font-weight: 700;
}
html[data-theme="fmentoring"] .text-accent {
    text-transform: uppercase;
    letter-spacing: .26em;
    font-family: 'JetBrains Mono', ui-monospace, monospace;
}
html[data-theme="fmentoring"] footer.bg-gray-50 {
    background: var(--t1-page-bg) !important;
    border-top: 1px solid var(--t1-accent) !important;
    padding-top: 3rem;
    padding-bottom: 3rem;
}
html[data-theme="fmentoring"] footer .t1-brand-logo {
    font-style: normal !important;
    font-weight: 500 !important;
    font-size: 1.4rem !important;
    background: none !important;
    -webkit-text-fill-color: var(--t1-page-text) !important;
    color: var(--t1-page-text) !important;
}
html[data-theme="fmentoring"] footer nav a {
    text-transform: uppercase;
    letter-spacing: .12em;
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: .65rem;
}
html[data-theme="fmentoring"] #floating-cta {
    border-radius: 0 !important;
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: .72rem;
    font-weight: 700;
}

/* ───── INKDRAFT — brutalist white/magenta / heavy black border / mono ───── */
html[data-theme="inkdraft"] .h-1.bg-accent {
    background: var(--t1-accent) !important;
    height: 6px !important;
}
html[data-theme="inkdraft"] header {
    background: var(--t1-page-bg) !important;
    border-bottom: 4px solid var(--t1-page-text) !important;
    padding-top: 18px;
    padding-bottom: 18px;
}
html[data-theme="inkdraft"] header .t1-brand-logo {
    font-family: 'JetBrains Mono', ui-monospace, monospace !important;
    font-style: normal !important;
    font-weight: 700 !important;
    font-size: 1.15rem !important;
    text-transform: uppercase;
    letter-spacing: .04em !important;
    background: none !important;
    -webkit-text-fill-color: var(--t1-page-text) !important;
    color: var(--t1-page-text) !important;
}
html[data-theme="inkdraft"] #login-button,
html[data-theme="inkdraft"] #mobile-login-button {
    color: var(--t1-page-text);
    text-transform: uppercase;
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    letter-spacing: .04em;
    font-size: .78rem;
    font-weight: 700;
}
html[data-theme="inkdraft"] #register-button,
html[data-theme="inkdraft"] a.bg-accent {
    border-radius: 0 !important;
    border: 2px solid var(--t1-page-text);
    text-transform: uppercase;
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    letter-spacing: .04em;
    font-size: .78rem !important;
    font-weight: 700;
}
html[data-theme="inkdraft"] .text-accent {
    text-transform: uppercase;
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    letter-spacing: .12em;
}
html[data-theme="inkdraft"] footer.bg-gray-50 {
    background: var(--t1-page-text) !important;
    color: #fff !important;
    border-top: 4px solid var(--t1-accent) !important;
}
html[data-theme="inkdraft"] footer .t1-brand-logo {
    font-family: 'JetBrains Mono', ui-monospace, monospace !important;
    font-style: normal !important;
    font-weight: 700 !important;
    font-size: 1.25rem !important;
    text-transform: uppercase;
    background: none !important;
    -webkit-text-fill-color: #fff !important;
    color: #fff !important;
}
html[data-theme="inkdraft"] footer nav a,
html[data-theme="inkdraft"] footer p {
    color: #d4d4d4 !important;
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    text-transform: uppercase;
    letter-spacing: .04em;
    font-size: .68rem !important;
}
html[data-theme="inkdraft"] #floating-cta {
    border-radius: 0 !important;
    border: 2px solid var(--t1-page-text);
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    text-transform: uppercase;
    font-size: .78rem;
}

/* ───── GLASSDESK — industrial / mono / sharp panels ───── */
html[data-theme="glassdesk"] .h-1.bg-accent {
    background: var(--t1-accent) !important;
    height: 2px !important;
}
html[data-theme="glassdesk"] header {
    background: #fff !important;
    border-bottom: 1px solid #d4d4d4 !important;
    padding-top: 14px;
    padding-bottom: 14px;
}
html[data-theme="glassdesk"] header .t1-brand-logo {
    font-family: 'IBM Plex Mono', ui-monospace, monospace !important;
    font-style: normal !important;
    font-weight: 500 !important;
    font-size: 1.05rem !important;
    text-transform: lowercase;
    letter-spacing: -.02em !important;
    background: none !important;
    -webkit-text-fill-color: var(--t1-page-text) !important;
    color: var(--t1-page-text) !important;
}
html[data-theme="glassdesk"] header .t1-brand-logo::before {
    content: '$ ';
    color: var(--t1-accent);
    font-weight: 400;
}
html[data-theme="glassdesk"] #login-button,
html[data-theme="glassdesk"] #mobile-login-button {
    color: var(--t1-page-text);
    font-family: 'IBM Plex Mono', ui-monospace, monospace;
    font-size: .82rem;
    font-weight: 400;
}
html[data-theme="glassdesk"] #register-button,
html[data-theme="glassdesk"] a.bg-accent {
    border-radius: 2px !important;
    font-family: 'IBM Plex Mono', ui-monospace, monospace;
    font-size: .82rem !important;
    font-weight: 500;
    text-transform: lowercase;
}
html[data-theme="glassdesk"] .text-accent {
    font-family: 'IBM Plex Mono', ui-monospace, monospace;
    text-transform: uppercase;
    letter-spacing: .14em;
}
html[data-theme="glassdesk"] footer.bg-gray-50 {
    background: #1f1f1f !important;
    color: #d4d4d4 !important;
    border-top: 1px solid var(--t1-accent) !important;
}
html[data-theme="glassdesk"] footer .t1-brand-logo {
    font-family: 'IBM Plex Mono', ui-monospace, monospace !important;
    font-style: normal !important;
    font-weight: 500 !important;
    text-transform: lowercase;
    background: none !important;
    -webkit-text-fill-color: var(--t1-accent) !important;
    color: var(--t1-accent) !important;
}
html[data-theme="glassdesk"] footer nav a,
html[data-theme="glassdesk"] footer p {
    color: #a3a3a3 !important;
    font-family: 'IBM Plex Mono', ui-monospace, monospace;
    font-size: .72rem !important;
}
html[data-theme="glassdesk"] #floating-cta {
    border-radius: 2px !important;
    font-family: 'IBM Plex Mono', ui-monospace, monospace;
    text-transform: lowercase;
    font-size: .82rem;
}

/* ───── CHORDCALL — luxury parchment / serif / pill / gilt ───── */
html[data-theme="chordcall"] .h-1.bg-accent {
    background: linear-gradient(90deg, transparent 0%, #B8860B 50%, transparent 100%) !important;
    height: 1px !important;
}
html[data-theme="chordcall"] header {
    background: var(--t1-page-bg) !important;
    border-bottom: 1px solid rgba(184, 134, 11, .35) !important;
    padding-top: 26px;
    padding-bottom: 22px;
}
html[data-theme="chordcall"] header .t1-brand-logo {
    font-style: italic !important;
    font-weight: 500 !important;
    font-size: 2rem !important;
    letter-spacing: -0.01em !important;
    background: none !important;
    -webkit-text-fill-color: var(--t1-page-text) !important;
    color: var(--t1-page-text) !important;
}
html[data-theme="chordcall"] header .t1-brand-logo::after {
    content: ' · est. 2024';
    font-family: 'Sora', system-ui, sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: .58rem;
    letter-spacing: .26em;
    color: rgba(26, 14, 10, .55);
    text-transform: uppercase;
    vertical-align: middle;
    margin-left: 6px;
}
html[data-theme="chordcall"] #login-button,
html[data-theme="chordcall"] #mobile-login-button {
    color: var(--t1-page-text);
    font-style: italic;
    font-family: var(--t1-font-display);
    font-size: 1rem;
    font-weight: 400;
}
html[data-theme="chordcall"] #register-button,
html[data-theme="chordcall"] a.bg-accent {
    border-radius: 9999px !important;
    font-family: var(--t1-font-display);
    font-style: italic;
    font-size: 1rem !important;
    font-weight: 500;
    padding-left: 1.4rem;
    padding-right: 1.4rem;
    border: 1px solid #B8860B;
}
html[data-theme="chordcall"] .text-accent {
    font-family: var(--t1-font-display);
    font-style: italic;
    text-transform: none;
    letter-spacing: 0;
    font-size: .95rem;
    text-transform: none;
    color: #B8860B !important;
}
html[data-theme="chordcall"] footer.bg-gray-50 {
    background: var(--t1-page-bg) !important;
    border-top: 1px solid rgba(184, 134, 11, .35) !important;
    box-shadow: inset 0 1px 0 0 var(--t1-page-bg), 0 -3px 0 -2px rgba(184, 134, 11, .35);
    padding-top: 4rem;
}
html[data-theme="chordcall"] footer .t1-brand-logo {
    font-style: italic !important;
    font-weight: 500 !important;
    font-size: 1.6rem !important;
    background: none !important;
    -webkit-text-fill-color: var(--t1-page-text) !important;
    color: var(--t1-page-text) !important;
}
html[data-theme="chordcall"] footer nav a {
    font-family: var(--t1-font-display);
    font-style: italic;
    font-size: .95rem;
}
html[data-theme="chordcall"] #floating-cta {
    border-radius: 9999px !important;
    font-family: var(--t1-font-display);
    font-style: italic;
    font-size: 1rem;
    border: 1px solid #B8860B;
}

/* ───── PENNYGROVE — pastel cream / chunky friendly / very rounded ───── */
html[data-theme="pennygrove"] .h-1.bg-accent {
    background: linear-gradient(90deg, var(--t1-accent) 0%, #8FA77B 100%) !important;
    height: 5px !important;
    border-radius: 0 0 999px 999px;
}
html[data-theme="pennygrove"] header {
    background: var(--t1-page-bg) !important;
    border-bottom: none !important;
    box-shadow: 0 4px 20px rgba(232, 155, 123, .12);
    padding-top: 18px;
    padding-bottom: 18px;
}
html[data-theme="pennygrove"] header .t1-brand-logo {
    font-style: normal !important;
    font-weight: 400 !important;
    font-size: 1.85rem !important;
    letter-spacing: -.005em !important;
    background: none !important;
    -webkit-text-fill-color: var(--t1-accent) !important;
    color: var(--t1-accent) !important;
}
html[data-theme="pennygrove"] #login-button,
html[data-theme="pennygrove"] #mobile-login-button {
    color: var(--t1-page-text);
    font-weight: 600;
    font-size: .9rem;
}
html[data-theme="pennygrove"] #register-button,
html[data-theme="pennygrove"] a.bg-accent {
    border-radius: 9999px !important;
    font-weight: 700;
    font-size: .92rem !important;
    padding-left: 1.3rem;
    padding-right: 1.3rem;
}
html[data-theme="pennygrove"] .text-accent {
    text-transform: none;
    letter-spacing: 0;
    font-size: .82rem;
    font-weight: 700;
}
html[data-theme="pennygrove"] footer.bg-gray-50 {
    background: linear-gradient(180deg, var(--t1-page-bg) 0%, #FFEED9 100%) !important;
    border-top: none !important;
    padding-top: 3rem;
}
html[data-theme="pennygrove"] footer .t1-brand-logo {
    font-style: normal !important;
    font-weight: 400 !important;
    font-size: 1.5rem !important;
    background: none !important;
    -webkit-text-fill-color: var(--t1-accent) !important;
    color: var(--t1-accent) !important;
}
html[data-theme="pennygrove"] footer nav a {
    font-weight: 600;
}
html[data-theme="pennygrove"] #floating-cta {
    border-radius: 9999px !important;
    font-weight: 700;
}

/* ───── WILDGRADE — maximalist white/navy / chunky display / loud ───── */
html[data-theme="wildgrade"] .h-1.bg-accent {
    background: linear-gradient(90deg, #FF0080 0%, #FF0080 25%, #FFE600 25%, #FFE600 50%, #00FF66 50%, #00FF66 75%, var(--t1-accent) 75%, var(--t1-accent) 100%) !important;
    height: 8px !important;
}
html[data-theme="wildgrade"] header {
    background: var(--t1-page-bg) !important;
    border-bottom: 4px solid var(--t1-accent) !important;
    padding-top: 18px;
    padding-bottom: 18px;
}
html[data-theme="wildgrade"] header .t1-brand-logo {
    font-style: normal !important;
    font-weight: 400 !important;
    font-size: 1.5rem !important;
    text-transform: uppercase;
    letter-spacing: 0 !important;
    background: none !important;
    -webkit-text-fill-color: var(--t1-accent) !important;
    color: var(--t1-accent) !important;
}
html[data-theme="wildgrade"] #login-button,
html[data-theme="wildgrade"] #mobile-login-button {
    color: var(--t1-accent);
    font-family: 'Space Mono', ui-monospace, monospace;
    text-transform: uppercase;
    font-weight: 700;
    font-size: .82rem;
}
html[data-theme="wildgrade"] #register-button,
html[data-theme="wildgrade"] a.bg-accent {
    background-color: #FF0080 !important;
    border-radius: 0 !important;
    font-family: 'Bungee', system-ui, sans-serif !important;
    text-transform: uppercase;
    font-size: .8rem !important;
    box-shadow: 4px 4px 0 var(--t1-accent);
    transform: none;
}
html[data-theme="wildgrade"] #register-button:hover,
html[data-theme="wildgrade"] a.bg-accent:hover {
    background-color: #FF0080 !important;
    transform: translate(-2px, -2px) !important;
    box-shadow: 6px 6px 0 var(--t1-accent) !important;
}
html[data-theme="wildgrade"] .text-accent {
    font-family: 'Bungee', system-ui, sans-serif;
    text-transform: uppercase;
    letter-spacing: 0;
    font-size: .85rem;
    color: #FF0080 !important;
}
html[data-theme="wildgrade"] footer.bg-gray-50 {
    background: var(--t1-accent) !important;
    color: #fff !important;
    border-top: 8px solid #FFE600 !important;
}
html[data-theme="wildgrade"] footer .t1-brand-logo {
    font-family: 'Bungee', system-ui, sans-serif !important;
    font-style: normal !important;
    font-weight: 400 !important;
    font-size: 1.6rem !important;
    text-transform: uppercase;
    background: none !important;
    -webkit-text-fill-color: #FFE600 !important;
    color: #FFE600 !important;
}
html[data-theme="wildgrade"] footer nav a,
html[data-theme="wildgrade"] footer p {
    color: #fff !important;
    font-family: 'Space Mono', ui-monospace, monospace;
    font-size: .72rem !important;
}
html[data-theme="wildgrade"] #floating-cta {
    background-color: #FF0080 !important;
    border-radius: 0 !important;
    font-family: 'Bungee', system-ui, sans-serif !important;
    text-transform: uppercase;
    font-size: .82rem;
    box-shadow: 4px 4px 0 var(--t1-accent);
}

/* ============================================================
 * THEMED LEAD FORM (V1) + COMMENTS — every brand-tied theme
 *
 * Two layers:
 *   1. Generic `html[data-theme]` rules wire the form wrapper, inputs,
 *      and comments section to the theme variables (border, focus,
 *      link colour, font) so even the 8 colour-only generic themes
 *      get coherent treatment.
 *   2. Per-`html[data-theme="X"]` blocks below override structural
 *      pieces (input border style, button casing, font weight) for
 *      the brand-tied themes.
 *
 * Form structure (V1, the inline form on each country page):
 *   #form (wrapper) > #form-subtitle (heading) > <input> > #next-button
 * Comments structure:
 *   .comment-item, #post-comment-btn, .comment-like-btn
 * ============================================================ */

/* ── Generic themed defaults — apply to every themed domain ── */

html[data-theme] #form {
    background: var(--t1-accent-soft, #f8fafc) !important;
    border: 2px solid var(--t1-accent-softer, #e2e8f0) !important;
    color: var(--t1-page-text, #0f172a);
}
html[data-theme] #form-subtitle {
    color: var(--t1-page-text, #0f172a) !important;
    font-family: var(--t1-font-display, Georgia, 'Times New Roman', serif);
}
html[data-theme] #form input[type="email"],
html[data-theme] #form input[type="text"],
html[data-theme] #form input[type="tel"] {
    background: var(--t1-page-bg, #fff);
    border-color: var(--t1-accent-softer, #d1d5db) !important;
    color: var(--t1-page-text, #0f172a) !important;
    font-family: var(--t1-font-body, system-ui, sans-serif);
    transition: border-color var(--t1-duration) var(--t1-ease), box-shadow var(--t1-duration) var(--t1-ease);
}
html[data-theme] #form input::placeholder {
    color: var(--t1-page-muted, #6b7280);
    opacity: 1;
}
html[data-theme] #form input:focus {
    outline: none;
    border-color: var(--t1-accent) !important;
    box-shadow: 0 0 0 3px var(--t1-accent-softer);
}
html[data-theme] #form #next-button,
html[data-theme] #form #create-account-button {
    font-family: var(--t1-font-body, system-ui, sans-serif);
}

/* Comments: link/like hover + button + heading colour */
html[data-theme] #comments-heading {
    color: var(--t1-page-text, #0f172a) !important;
    font-family: var(--t1-font-display, Georgia, 'Times New Roman', serif);
}
html[data-theme] .comment-item .text-gray-900 {
    color: var(--t1-page-text, #0f172a) !important;
}
html[data-theme] .comment-item p {
    color: var(--t1-page-text, #1f2937) !important;
    font-family: var(--t1-font-body, system-ui, sans-serif);
}
html[data-theme] .comment-like-btn:hover,
html[data-theme] .comment-item .hover\:text-teal-600:hover {
    color: var(--t1-accent) !important;
}
html[data-theme] #comment-name-input,
html[data-theme] #comment-text-input {
    background: var(--t1-page-bg, #fff) !important;
    border-color: var(--t1-accent-softer, #e5e7eb) !important;
    color: var(--t1-page-text, #0f172a) !important;
    font-family: var(--t1-font-body, system-ui, sans-serif);
}
html[data-theme] #comment-name-input:focus,
html[data-theme] #comment-text-input:focus {
    outline: none;
    border-color: var(--t1-accent) !important;
    box-shadow: 0 0 0 2px var(--t1-accent-softer);
}
html[data-theme] #post-comment-btn {
    background: var(--t1-accent) !important;
    color: #fff !important;
    font-family: var(--t1-font-body, system-ui, sans-serif);
    transition: background-color var(--t1-duration) var(--t1-ease);
}
html[data-theme] #post-comment-btn:hover {
    background: var(--t1-accent-hover) !important;
}

/* ── Per-theme structural overrides (form + comments) ── */

/* FMENTORING — editorial, square, mono labels */
html[data-theme="fmentoring"] #form {
    border-radius: 0 !important;
    border-width: 1px !important;
    border-color: var(--t1-page-text) !important;
}
html[data-theme="fmentoring"] #form-subtitle {
    text-transform: uppercase;
    letter-spacing: .14em;
    font-size: 1rem !important;
    font-weight: 600 !important;
}
html[data-theme="fmentoring"] #form input {
    border-radius: 0 !important;
    border-width: 0 0 1px 0 !important;
    border-bottom-color: var(--t1-page-text) !important;
    background: transparent !important;
    padding-left: 2px !important;
    padding-right: 2px !important;
}
html[data-theme="fmentoring"] #form input:focus {
    box-shadow: 0 1px 0 0 var(--t1-accent) !important;
    border-bottom-color: var(--t1-accent) !important;
}
html[data-theme="fmentoring"] #form #next-button,
html[data-theme="fmentoring"] #form #create-account-button,
html[data-theme="fmentoring"] #post-comment-btn {
    border-radius: 0 !important;
    text-transform: uppercase;
    letter-spacing: .14em;
    font-size: .85rem !important;
    font-family: 'JetBrains Mono', ui-monospace, monospace !important;
}
html[data-theme="fmentoring"] #comments-heading {
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: .85rem !important;
    font-family: 'JetBrains Mono', ui-monospace, monospace !important;
}
html[data-theme="fmentoring"] .comment-item .text-gray-900 {
    font-family: var(--t1-font-display) !important;
    font-size: 1rem !important;
}
html[data-theme="fmentoring"] .comment-like-btn,
html[data-theme="fmentoring"] .comment-item button {
    text-transform: uppercase;
    letter-spacing: .1em;
    font-family: 'JetBrains Mono', ui-monospace, monospace !important;
    font-size: .65rem !important;
}

/* INKDRAFT — brutalist, sharp, mono everywhere */
html[data-theme="inkdraft"] #form {
    border-radius: 0 !important;
    border: 3px solid var(--t1-page-text) !important;
    background: var(--t1-page-bg) !important;
}
html[data-theme="inkdraft"] #form-subtitle {
    text-transform: uppercase;
    font-family: 'JetBrains Mono', ui-monospace, monospace !important;
    font-size: 1.1rem !important;
    font-weight: 700 !important;
    letter-spacing: .04em;
}
html[data-theme="inkdraft"] #form input {
    border-radius: 0 !important;
    border-width: 2px !important;
    border-color: var(--t1-page-text) !important;
    font-family: 'JetBrains Mono', ui-monospace, monospace !important;
}
html[data-theme="inkdraft"] #form #next-button,
html[data-theme="inkdraft"] #form #create-account-button,
html[data-theme="inkdraft"] #post-comment-btn {
    border-radius: 0 !important;
    border: 2px solid var(--t1-page-text);
    text-transform: uppercase;
    font-family: 'JetBrains Mono', ui-monospace, monospace !important;
    letter-spacing: .04em;
}
html[data-theme="inkdraft"] #comments-heading {
    text-transform: uppercase;
    font-family: 'JetBrains Mono', ui-monospace, monospace !important;
}
html[data-theme="inkdraft"] .comment-item .text-gray-900 {
    font-family: 'JetBrains Mono', ui-monospace, monospace !important;
    text-transform: uppercase;
    font-size: .82rem !important;
}
html[data-theme="inkdraft"] .comment-item p {
    font-family: 'JetBrains Mono', ui-monospace, monospace !important;
    font-size: .85rem !important;
}
html[data-theme="inkdraft"] .comment-like-btn,
html[data-theme="inkdraft"] .comment-item button {
    text-transform: uppercase;
    font-family: 'JetBrains Mono', ui-monospace, monospace !important;
}
html[data-theme="inkdraft"] #comment-name-input,
html[data-theme="inkdraft"] #comment-text-input {
    border-radius: 0 !important;
    border-width: 2px !important;
    border-color: var(--t1-page-text) !important;
    font-family: 'JetBrains Mono', ui-monospace, monospace !important;
}

/* GLASSDESK — industrial, sharp 2px corners, mono lowercase */
html[data-theme="glassdesk"] #form {
    border-radius: 2px !important;
    border-width: 1px !important;
    border-color: #d4d4d4 !important;
    background: #fff !important;
}
html[data-theme="glassdesk"] #form-subtitle {
    font-family: 'IBM Plex Mono', ui-monospace, monospace !important;
    text-transform: lowercase;
    font-size: 1rem !important;
    font-weight: 500 !important;
    letter-spacing: -.01em;
}
html[data-theme="glassdesk"] #form input {
    border-radius: 2px !important;
    border-color: #d4d4d4 !important;
    font-family: 'IBM Plex Mono', ui-monospace, monospace !important;
    font-size: .95rem !important;
}
html[data-theme="glassdesk"] #form #next-button,
html[data-theme="glassdesk"] #form #create-account-button,
html[data-theme="glassdesk"] #post-comment-btn {
    border-radius: 2px !important;
    text-transform: lowercase;
    font-family: 'IBM Plex Mono', ui-monospace, monospace !important;
    font-size: .95rem !important;
    font-weight: 500;
}
html[data-theme="glassdesk"] #comments-heading {
    font-family: 'IBM Plex Mono', ui-monospace, monospace !important;
    text-transform: lowercase;
    font-size: 1rem !important;
}
html[data-theme="glassdesk"] .comment-item .text-gray-900 {
    font-family: 'IBM Plex Mono', ui-monospace, monospace !important;
    font-size: .85rem !important;
}
html[data-theme="glassdesk"] .comment-item p {
    font-family: 'IBM Plex Mono', ui-monospace, monospace !important;
    font-size: .85rem !important;
}
html[data-theme="glassdesk"] .comment-like-btn,
html[data-theme="glassdesk"] .comment-item button {
    font-family: 'IBM Plex Mono', ui-monospace, monospace !important;
    text-transform: lowercase;
}
html[data-theme="glassdesk"] #comment-name-input,
html[data-theme="glassdesk"] #comment-text-input {
    border-radius: 2px !important;
    font-family: 'IBM Plex Mono', ui-monospace, monospace !important;
}

/* CHORDCALL — luxury, italic serif headings, pill buttons, gilt borders */
html[data-theme="chordcall"] #form {
    border-radius: 4px !important;
    border-width: 1px !important;
    border-color: rgba(184, 134, 11, .35) !important;
    background: var(--t1-accent-soft) !important;
    padding: 2rem !important;
}
html[data-theme="chordcall"] #form-subtitle {
    font-family: var(--t1-font-display) !important;
    font-style: italic;
    font-weight: 500 !important;
    font-size: 1.65rem !important;
    text-transform: none !important;
    letter-spacing: 0;
}
html[data-theme="chordcall"] #form input {
    border-radius: 4px !important;
    border-color: rgba(184, 134, 11, .35) !important;
    background: var(--t1-page-bg) !important;
    font-family: var(--t1-font-body) !important;
}
html[data-theme="chordcall"] #form #next-button,
html[data-theme="chordcall"] #form #create-account-button,
html[data-theme="chordcall"] #post-comment-btn {
    border-radius: 9999px !important;
    font-family: var(--t1-font-display) !important;
    font-style: italic;
    font-weight: 500;
    border: 1px solid #B8860B;
}
html[data-theme="chordcall"] #comments-heading {
    font-family: var(--t1-font-display) !important;
    font-style: italic;
    font-weight: 500 !important;
    font-size: 1.5rem !important;
}
html[data-theme="chordcall"] .comment-item .text-gray-900 {
    font-family: var(--t1-font-display) !important;
    font-style: italic;
    font-size: 1.05rem !important;
}
html[data-theme="chordcall"] .comment-item p {
    font-family: var(--t1-font-body) !important;
}
html[data-theme="chordcall"] #comment-name-input,
html[data-theme="chordcall"] #comment-text-input {
    border-radius: 4px !important;
    border-color: rgba(184, 134, 11, .35) !important;
    background: var(--t1-accent-soft) !important;
    font-family: var(--t1-font-body) !important;
}

/* PENNYGROVE — pastel, very rounded, friendly, chunky display */
html[data-theme="pennygrove"] #form {
    border-radius: 24px !important;
    border-width: 0 !important;
    background: #fff !important;
    box-shadow: 0 8px 28px rgba(232, 155, 123, .18);
}
html[data-theme="pennygrove"] #form-subtitle {
    font-family: var(--t1-font-display) !important;
    font-weight: 400 !important;
    font-size: 1.6rem !important;
    color: var(--t1-accent) !important;
    text-transform: none;
}
html[data-theme="pennygrove"] #form input {
    border-radius: 14px !important;
    border-width: 2px !important;
    border-color: var(--t1-accent-softer) !important;
    background: var(--t1-page-bg) !important;
    font-family: var(--t1-font-body) !important;
}
html[data-theme="pennygrove"] #form #next-button,
html[data-theme="pennygrove"] #form #create-account-button,
html[data-theme="pennygrove"] #post-comment-btn {
    border-radius: 9999px !important;
    font-weight: 700;
    font-family: var(--t1-font-body) !important;
}
html[data-theme="pennygrove"] #comments-heading {
    font-family: var(--t1-font-display) !important;
    font-weight: 400 !important;
    font-size: 1.5rem !important;
    color: var(--t1-accent) !important;
}
html[data-theme="pennygrove"] .comment-item .text-gray-900 {
    font-weight: 700 !important;
}
html[data-theme="pennygrove"] #comment-name-input,
html[data-theme="pennygrove"] #comment-text-input {
    border-radius: 12px !important;
    border-width: 2px !important;
    border-color: var(--t1-accent-softer) !important;
    background: var(--t1-page-bg) !important;
}

/* WILDGRADE — maximalist, shadow blocks, Bungee shouting */
html[data-theme="wildgrade"] #form {
    border-radius: 0 !important;
    border: 4px solid var(--t1-accent) !important;
    background: var(--t1-page-bg) !important;
    box-shadow: 8px 8px 0 #FFE600;
    padding: 1.75rem !important;
}
html[data-theme="wildgrade"] #form-subtitle {
    font-family: 'Bungee', system-ui, sans-serif !important;
    font-weight: 400 !important;
    font-size: 1.6rem !important;
    color: var(--t1-accent) !important;
    text-transform: uppercase;
    letter-spacing: 0;
}
html[data-theme="wildgrade"] #form input {
    border-radius: 0 !important;
    border-width: 3px !important;
    border-color: var(--t1-accent) !important;
    font-family: 'Space Mono', ui-monospace, monospace !important;
    font-weight: 700;
}
html[data-theme="wildgrade"] #form #next-button,
html[data-theme="wildgrade"] #form #create-account-button {
    background-color: #FF0080 !important;
    color: #fff !important;
    border-radius: 0 !important;
    font-family: 'Bungee', system-ui, sans-serif !important;
    text-transform: uppercase;
    box-shadow: 4px 4px 0 var(--t1-accent);
    transform: none;
}
html[data-theme="wildgrade"] #form #next-button:hover,
html[data-theme="wildgrade"] #form #create-account-button:hover {
    transform: translate(-2px, -2px) !important;
    box-shadow: 6px 6px 0 var(--t1-accent) !important;
    background-color: #FF0080 !important;
}
html[data-theme="wildgrade"] #post-comment-btn {
    background: #FF0080 !important;
    color: #fff !important;
    border-radius: 0 !important;
    font-family: 'Bungee', system-ui, sans-serif !important;
    text-transform: uppercase;
    box-shadow: 3px 3px 0 var(--t1-accent);
}
html[data-theme="wildgrade"] #post-comment-btn:hover {
    background: #FF0080 !important;
    box-shadow: 5px 5px 0 var(--t1-accent) !important;
}
html[data-theme="wildgrade"] #comments-heading {
    font-family: 'Bungee', system-ui, sans-serif !important;
    text-transform: uppercase;
    color: var(--t1-accent) !important;
    font-size: 1.5rem !important;
}
html[data-theme="wildgrade"] .comment-item .text-gray-900 {
    font-family: 'Bungee', system-ui, sans-serif !important;
    text-transform: uppercase;
    font-size: .85rem !important;
}
html[data-theme="wildgrade"] .comment-item p {
    font-family: 'Space Mono', ui-monospace, monospace !important;
}
html[data-theme="wildgrade"] .comment-like-btn,
html[data-theme="wildgrade"] .comment-item button {
    font-family: 'Space Mono', ui-monospace, monospace !important;
    text-transform: uppercase;
    font-weight: 700;
}
html[data-theme="wildgrade"] #comment-name-input,
html[data-theme="wildgrade"] #comment-text-input {
    border-radius: 0 !important;
    border-width: 3px !important;
    border-color: var(--t1-accent) !important;
    font-family: 'Space Mono', ui-monospace, monospace !important;
}

/* ───── MERIDIANNOTE — Swiss / grid minimalism / Geist / meridian-blue ───── */
html[data-theme="meridiannote"] .h-1.bg-accent {
    background: var(--t1-accent) !important;
    height: 1px !important;
}
html[data-theme="meridiannote"] header {
    background: var(--t1-page-bg) !important;
    border-bottom: 1px solid rgba(10,10,10,0.16);
    padding-top: 20px;
    padding-bottom: 20px;
}
html[data-theme="meridiannote"] header .t1-brand-logo {
    font-family: 'Geist', system-ui, sans-serif !important;
    font-style: normal !important;
    font-weight: 500 !important;
    font-size: 1.25rem !important;
    letter-spacing: -0.01em !important;
    background: none !important;
    -webkit-text-fill-color: var(--t1-page-text) !important;
    color: var(--t1-page-text) !important;
}
html[data-theme="meridiannote"] header .t1-brand-logo::after {
    content: ' · 48.857°N';
    font-family: 'Geist Mono', ui-monospace, monospace;
    font-size: .68rem;
    letter-spacing: .08em;
    color: rgba(10,10,10,0.42);
    margin-left: 6px;
}
html[data-theme="meridiannote"] #login-button,
html[data-theme="meridiannote"] #mobile-login-button {
    color: var(--t1-page-text);
    text-transform: uppercase;
    letter-spacing: .14em;
    font-size: .68rem;
    font-weight: 500;
    font-family: 'Geist Mono', ui-monospace, monospace;
}
html[data-theme="meridiannote"] #register-button,
html[data-theme="meridiannote"] a.bg-accent {
    border-radius: 0 !important;
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: .7rem !important;
    font-weight: 500;
    font-family: 'Geist Mono', ui-monospace, monospace;
    padding: 10px 18px !important;
}
html[data-theme="meridiannote"] .text-accent {
    text-transform: uppercase;
    letter-spacing: .22em;
    font-family: 'Geist Mono', ui-monospace, monospace;
    font-size: .7rem;
}
html[data-theme="meridiannote"] footer.bg-gray-50 {
    background: var(--t1-page-bg) !important;
    border-top: 1px solid rgba(10,10,10,0.16) !important;
    padding-top: 3rem;
    padding-bottom: 3rem;
}
html[data-theme="meridiannote"] footer .t1-brand-logo {
    font-family: 'Geist', system-ui, sans-serif !important;
    font-style: normal !important;
    font-weight: 500 !important;
    font-size: 1.1rem !important;
    background: none !important;
    -webkit-text-fill-color: var(--t1-page-text) !important;
    color: var(--t1-page-text) !important;
}
html[data-theme="meridiannote"] footer nav a,
html[data-theme="meridiannote"] footer p {
    font-family: 'Geist', system-ui, sans-serif;
    font-size: .82rem;
}
html[data-theme="meridiannote"] #floating-cta {
    border-radius: 0 !important;
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: .7rem;
    font-weight: 500;
    font-family: 'Geist Mono', ui-monospace, monospace;
}
/* Form */
html[data-theme="meridiannote"] #form {
    background: var(--t1-page-bg) !important;
    border: 1px solid rgba(10,10,10,0.16) !important;
    border-radius: 0 !important;
}
html[data-theme="meridiannote"] #form-subtitle {
    font-family: 'Geist', system-ui, sans-serif !important;
    font-weight: 400;
    letter-spacing: -0.01em;
    text-transform: none;
}
html[data-theme="meridiannote"] #form input {
    border-radius: 0 !important;
    border-width: 1px !important;
    font-family: 'Geist', system-ui, sans-serif !important;
}
html[data-theme="meridiannote"] #form #next-button,
html[data-theme="meridiannote"] #form #create-account-button {
    border-radius: 0 !important;
    font-family: 'Geist Mono', ui-monospace, monospace !important;
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: .76rem !important;
    font-weight: 500;
}
/* Comments */
html[data-theme="meridiannote"] #comments-heading {
    font-family: 'Geist', system-ui, sans-serif !important;
    font-weight: 500;
    letter-spacing: -0.01em;
    text-transform: none;
}
html[data-theme="meridiannote"] .comment-item .text-gray-900 {
    font-family: 'Geist', system-ui, sans-serif !important;
    font-weight: 500;
}
html[data-theme="meridiannote"] .comment-item p {
    font-family: 'Geist', system-ui, sans-serif !important;
}
html[data-theme="meridiannote"] #comment-name-input,
html[data-theme="meridiannote"] #comment-text-input {
    border-radius: 0 !important;
    border-width: 1px !important;
    border-color: rgba(10,10,10,0.16) !important;
    font-family: 'Geist', system-ui, sans-serif !important;
}
html[data-theme="meridiannote"] #post-comment-btn {
    border-radius: 0 !important;
    font-family: 'Geist Mono', ui-monospace, monospace !important;
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: .76rem !important;
    font-weight: 500;
}

/* ───── LUMEQUANT — Quant tear-sheet / DM Serif Display + Manrope + DM Mono / sapphire on cream ───── */
html[data-theme="lumequant"] .h-1.bg-accent {
    background: var(--t1-accent) !important;
    height: 1px !important;
}
html[data-theme="lumequant"] header {
    background: var(--t1-page-bg) !important;
    border-bottom: 1px solid rgba(10,18,48,0.16);
    padding-top: 20px;
    padding-bottom: 20px;
}
html[data-theme="lumequant"] header .t1-brand-logo {
    font-family: 'DM Serif Display', Georgia, 'Times New Roman', serif !important;
    font-style: italic !important;
    font-weight: 400 !important;
    font-size: 1.45rem !important;
    letter-spacing: -0.01em !important;
    background: none !important;
    -webkit-text-fill-color: var(--t1-page-text) !important;
    color: var(--t1-page-text) !important;
}
html[data-theme="lumequant"] header .t1-brand-logo::after {
    content: ' / MI · 45.4805°N';
    font-family: 'DM Mono', ui-monospace, monospace;
    font-style: normal;
    font-size: .65rem;
    letter-spacing: .14em;
    color: rgba(10,18,48,0.45);
    text-transform: uppercase;
    margin-left: 8px;
}
html[data-theme="lumequant"] #login-button,
html[data-theme="lumequant"] #mobile-login-button {
    color: var(--t1-page-text);
    text-transform: uppercase;
    letter-spacing: .16em;
    font-size: .68rem;
    font-weight: 500;
    font-family: 'DM Mono', ui-monospace, monospace;
}
html[data-theme="lumequant"] #register-button,
html[data-theme="lumequant"] a.bg-accent {
    border-radius: 1px !important;
    text-transform: uppercase;
    letter-spacing: .14em;
    font-size: .72rem !important;
    font-weight: 600;
    font-family: 'DM Mono', ui-monospace, monospace;
    padding: 11px 20px !important;
}
html[data-theme="lumequant"] .text-accent {
    text-transform: uppercase;
    letter-spacing: .22em;
    font-family: 'DM Mono', ui-monospace, monospace;
    font-size: .7rem;
}
html[data-theme="lumequant"] footer.bg-gray-50 {
    background: #0E1C3D !important;
    color: rgba(243,240,232,0.72);
    border-top: 1px solid rgba(243,240,232,0.10) !important;
    padding-top: 3rem;
    padding-bottom: 3rem;
}
html[data-theme="lumequant"] footer.bg-gray-50 .text-gray-700,
html[data-theme="lumequant"] footer.bg-gray-50 .text-gray-600,
html[data-theme="lumequant"] footer.bg-gray-50 .text-gray-500 {
    color: rgba(243,240,232,0.72) !important;
}
html[data-theme="lumequant"] footer .t1-brand-logo {
    font-family: 'DM Serif Display', Georgia, serif !important;
    font-style: italic !important;
    font-weight: 400 !important;
    font-size: 1.3rem !important;
    background: none !important;
    -webkit-text-fill-color: #F3F0E8 !important;
    color: #F3F0E8 !important;
}
html[data-theme="lumequant"] footer nav a,
html[data-theme="lumequant"] footer p {
    font-family: 'Manrope', system-ui, sans-serif;
    font-size: .85rem;
}
html[data-theme="lumequant"] footer nav a {
    color: rgba(243,240,232,0.82) !important;
}
html[data-theme="lumequant"] footer nav a:hover {
    color: #F3F0E8 !important;
}
html[data-theme="lumequant"] #floating-cta {
    border-radius: 1px !important;
    text-transform: uppercase;
    letter-spacing: .14em;
    font-size: .72rem;
    font-weight: 600;
    font-family: 'DM Mono', ui-monospace, monospace;
}
/* Form */
html[data-theme="lumequant"] #form {
    background: #FFFFFF !important;
    border: 1px solid rgba(10,18,48,0.18) !important;
    border-radius: 2px !important;
    box-shadow: 0 1px 0 rgba(10,18,48,0.04);
}
html[data-theme="lumequant"] #form-subtitle {
    font-family: 'DM Serif Display', Georgia, serif !important;
    font-weight: 400;
    letter-spacing: -0.01em;
    text-transform: none;
}
html[data-theme="lumequant"] #form input {
    border-radius: 1px !important;
    border-width: 1px !important;
    border-color: rgba(10,18,48,0.20) !important;
    font-family: 'Manrope', system-ui, sans-serif !important;
}
html[data-theme="lumequant"] #form #next-button,
html[data-theme="lumequant"] #form #create-account-button {
    border-radius: 1px !important;
    font-family: 'DM Mono', ui-monospace, monospace !important;
    text-transform: uppercase;
    letter-spacing: .14em;
    font-size: .76rem !important;
    font-weight: 600;
}
/* Comments */
html[data-theme="lumequant"] #comments-heading {
    font-family: 'DM Serif Display', Georgia, serif !important;
    font-weight: 400;
    letter-spacing: -0.01em;
    text-transform: none;
}
html[data-theme="lumequant"] .comment-item .text-gray-900 {
    font-family: 'Manrope', system-ui, sans-serif !important;
    font-weight: 600;
    color: #0A1230 !important;
}
html[data-theme="lumequant"] .comment-item p {
    font-family: 'Manrope', system-ui, sans-serif !important;
}
html[data-theme="lumequant"] #comment-name-input,
html[data-theme="lumequant"] #comment-text-input {
    border-radius: 1px !important;
    border-width: 1px !important;
    border-color: rgba(10,18,48,0.18) !important;
    font-family: 'Manrope', system-ui, sans-serif !important;
}
html[data-theme="lumequant"] #post-comment-btn {
    border-radius: 1px !important;
    font-family: 'DM Mono', ui-monospace, monospace !important;
    text-transform: uppercase;
    letter-spacing: .14em;
    font-size: .76rem !important;
    font-weight: 600;
}
