/* Shared visual language, promoted from the notification inbox.
   Keep capture/selector content and status colors meaningful. */
:root, body.site-theme {
    --c-bg: #f8f7f5; --c-surface: #fff; --c-surface-2: #faf9f7;
    --c-surface-3: #f0eeeb; --c-border: #e9e6e2; --c-border-strong: #cdc7c0;
    --c-text: #262523; --c-text-2: #716c65; --c-text-3: #817b74;
    --c-primary: #d34453; --c-primary-hover: #bb3544;
    --c-primary-soft: #fceef0; --c-primary-text: #b83646; --c-on-primary: #fff;
    --c-cyan: #739897; --c-cyan-soft: #edf3ed; --c-violet: #9783b7;
    --c-coral: #d34453; --c-amber: #c79f61;
    --r-xs: 10px; --r-sm: 12px; --r-md: 16px; --r-lg: 24px; --r-xl: 28px;
    --sh-xs: 0 2px 8px -4px rgba(52,39,23,.08);
    --sh-sm: 0 6px 28px -18px rgba(52,39,23,.16);
    --sh-md: 0 12px 36px -20px rgba(52,39,23,.2);
    --sh-lg: 0 20px 48px -24px rgba(52,39,23,.22);
    --font-display: var(--font-ui);
    --bs-body-bg: var(--c-bg); --bs-body-color: var(--c-text);
    --bs-border-color: var(--c-border); --bs-secondary-color: var(--c-text-2);
    --bs-tertiary-bg: var(--c-surface-2); --bs-secondary-bg: var(--c-surface-3);
}
[data-bs-theme="dark"], [data-bs-theme="dark"] body.site-theme {
    --c-bg: #191918; --c-surface: #242422; --c-surface-2: #2a2a27;
    --c-surface-3: #353531; --c-border: #3b3b35; --c-border-strong: #57574e;
    --c-text: #f5f3ee; --c-text-2: #b9b5ab; --c-text-3: #aaa69b;
    --c-primary: #f28b97; --c-primary-hover: #f6a2ab;
    --c-primary-text: #f6a2ab; --c-primary-soft: #442c30; --c-on-primary: #242422;
    --c-cyan-soft: #26342d;
    --sh-xs: 0 2px 8px -4px rgba(0,0,0,.12);
    --sh-sm: 0 6px 28px -18px rgba(0,0,0,.3);
    --sh-md: 0 12px 36px -20px rgba(0,0,0,.4);
    --sh-lg: 0 20px 48px -24px rgba(0,0,0,.5);
}
body.site-theme { background: var(--c-bg); color: var(--c-text); font-family: var(--font-ui); }
.site-theme::before, .site-theme::after { display: none; }
.site-theme h1 { font-family: var(--font-ui); font-weight: 700; letter-spacing: -.05em; }
.site-theme .page-head { gap: 1.5rem; margin-bottom: 2rem; align-items: center; }
.site-theme .page-head h1 { font-size: clamp(1.9rem,3vw,2.7rem); margin-bottom: .65rem; overflow-wrap: anywhere; }
.site-theme .page-head .page-sub { font-size: .9rem; line-height: 1.7; }
.site-theme .section-kicker { font-size: .7rem; letter-spacing: .12em; color: var(--c-primary-text); margin-bottom: .6rem; }
.site-theme .app-content { padding-top: 2.8rem; }
.site-theme .app-sidebar { background: var(--c-surface); border-right: 1px solid var(--c-border); box-shadow: none; }
.site-theme .app-sidebar::before { display: none; }
.site-theme .app-sidebar .sb-brand, .site-theme .app-sidebar .sb-brand:hover { color: var(--c-text); border-bottom-color: var(--c-border); }
.site-theme .sb-section, .site-theme .app-sidebar .sb-brand small { color: var(--c-text-2); }
.site-theme .sb-link { color: var(--c-text-2); }
.site-theme .sb-link:hover { background: var(--c-surface-2); color: var(--c-text); }
.site-theme .sb-link.active { background: var(--c-primary-soft); color: var(--c-primary-text); box-shadow: none; }
.site-theme .sb-foot { border-top-color: var(--c-border); }
.site-theme .sb-foot .avatar, .site-theme .avatar { background: var(--c-surface-3); color: var(--c-text); box-shadow: none; }
.site-theme .app-topbar { background: var(--c-surface); border-bottom: 1px solid var(--c-border); box-shadow: none; backdrop-filter: none; }
.site-theme .btn { border-radius: 12px; letter-spacing: -.01em; }
.site-theme .btn-primary, .site-theme .app-topbar .btn-primary {
    background: var(--c-text); border-color: var(--c-text); color: var(--c-surface); box-shadow: none;
}
.site-theme .btn-primary:hover, .site-theme .btn-primary:focus { background: var(--c-text); color: var(--c-surface); opacity: .88; box-shadow: none; transform: none; }
.site-theme .btn.btn-add-website { background: #15803d; border-color: #15803d; color: #fff; opacity: 1; }
.site-theme .btn.btn-add-website:hover, .site-theme .btn.btn-add-website:focus { background: #166534; border-color: #166534; color: #fff; opacity: 1; }
.site-theme .btn.btn-add-website:active { background: #14532d; border-color: #14532d; color: #fff; }
.site-theme .btn-secondary, .site-theme .btn-light { background: var(--c-surface); color: var(--c-text); border-color: var(--c-border-strong); box-shadow: none; }
.site-theme .btn-secondary:hover, .site-theme .btn-light:hover { background: var(--c-surface-2); color: var(--c-text); border-color: var(--c-text-2); }
.site-theme .btn-outline-primary { color: var(--c-text); border-color: var(--c-border-strong); background: transparent; }
.site-theme .btn-outline-primary:hover { color: var(--c-surface); background: var(--c-text); border-color: var(--c-text); }
.site-theme .btn-icon { box-shadow: none; border-color: var(--c-border); }
.site-theme .card, .site-theme .panel, .site-theme .stat, .site-theme .site-card {
    background: var(--c-surface); border: 1px solid var(--c-border); border-radius: 24px; box-shadow: var(--sh-sm);
}
.site-theme .card:hover, .site-theme .site-card:hover, .site-theme .stat:hover { transform: none; border-color: var(--c-border-strong); box-shadow: var(--sh-sm); }
.site-theme .card-header { padding: 1.25rem 1.5rem; font-size: .95rem; gap: .75rem; flex-wrap: wrap; }
.site-theme .card-body { padding: 1.5rem; }
.site-theme .card-footer { background: var(--c-surface-2); padding: 1rem 1.5rem; }
.site-theme .card-header > i:first-child, .site-theme .feature-icon, .site-theme .step-icon {
    width: 2.8rem; height: 2.8rem; border-radius: 15px; background: #fbf0e8; color: #755740; box-shadow: none;
}
.site-theme .stat { padding: 1.5rem; }
.site-theme .stat::after, .site-theme .stat::before { display: none; }
.site-theme .stat-label { color: var(--c-text-2); font-size: .75rem; }
.site-theme .stat-label > i { background: #fbf0e8; color: #755740; border-radius: 12px; }
.site-theme .stat:nth-child(4n+2) .stat-label > i { background: #edf3ed; color: #527456; }
.site-theme .stat:nth-child(4n+3) .stat-label > i { background: #f0edfa; color: #796597; }
.site-theme .stat:nth-child(4n+4) .stat-label > i { background: #fff0ef; color: #a96764; }
.site-theme .stat-value { font-size: 2.1rem; font-variant-numeric: tabular-nums; }
.site-theme .stat-meta { font-size: .72rem; color: var(--c-text-2); }
.ui-art { display: inline-grid; place-items: center; width: 3.6rem; height: 3.6rem; flex-shrink: 0; border-radius: 19px; color: #473d37; background: #fbf0e8; --icon-accent: #f0c4a4; }
.ui-art svg { width: 2.7rem; height: 2.7rem; }
.ui-art.sage { background: #edf3ed; --icon-accent: #b9d1b5; }
.ui-art.rose { background: #fff0ef; --icon-accent: #efa7a5; }
.ui-art.lavender { background: #f0edfa; --icon-accent: #c4b6ec; }
.site-theme .stat:has(> .ui-art) { display: grid; grid-template-columns: 3.6rem minmax(0,1fr); column-gap: 1rem; align-content: center; }
.stat > .ui-art { grid-column: 1; grid-row: 1 / 4; align-self: center; }
.site-theme .stat:has(> .ui-art) .stat-label { margin-bottom: .25rem; }
.site-theme .stat:has(> .ui-art) .stat-value { margin-bottom: .15rem; }
.site-theme .stat:has(> .ui-art) .stat-meta { margin-top: .15rem; }
.site-theme .form-control, .site-theme .form-select { border-radius: 12px; border-color: var(--c-border-strong); background-color: var(--c-surface); color: var(--c-text); box-shadow: none; font-size: .86rem; padding: .75rem .9rem; }
.site-theme .form-select { padding-right: 2.5rem; }
.site-theme .form-control-sm, .site-theme .form-select-sm { padding: .45rem .7rem; font-size: .78rem; }
.site-theme .form-control:focus, .site-theme .form-select:focus { border-color: var(--c-text-2); box-shadow: 0 0 0 3px color-mix(in srgb,var(--c-text) 8%,transparent); }
.site-theme .form-control:disabled, .site-theme .form-control[readonly] { background: var(--c-surface-2); color: var(--c-text-2); }
.site-theme .form-label { color: var(--c-text); font-size: .8rem; font-weight: 600; }
.site-theme .form-text { color: var(--c-text-2); font-size: .75rem; line-height: 1.7; }
.site-theme .form-check-input:checked { background-color: var(--c-text); border-color: var(--c-text); }
.site-theme .form-switch .form-check-input { width: 2.6em; height: 1.5em; cursor: pointer; }
.site-theme .form-switch { padding-left: 3.2em; }
.site-theme .settings-view .form-switch { padding-left: 0; }
.site-theme .form-switch .form-check-input { margin-left: -3.2em; }
.site-theme .settings-view .form-switch .form-check-input { margin-left: 0; }
.site-theme .form-section { border-color: var(--c-border); }
.site-theme .input-group-text { background: var(--c-surface-2); border-color: var(--c-border-strong); color: var(--c-text-2); }
.site-theme .table { --bs-table-bg: transparent; --bs-table-color: var(--c-text); --bs-table-border-color: var(--c-border); }
.site-theme .table thead th { background: var(--c-surface-2); color: var(--c-text-2); font-size: .68rem; letter-spacing: .05em; padding-block: 1rem; }
.site-theme .table td { font-size: .8rem; padding-block: 1rem; }
.site-theme .table tbody tr:hover { background: var(--c-surface-2); }
.site-theme .nav-pills .nav-link.active, .site-theme .page-item.active .page-link { background: var(--c-text); color: var(--c-surface); border-color: var(--c-text); }
.site-theme .nav-tabs .nav-link.active { border-color: var(--c-border); border-bottom-color: var(--c-surface); background: var(--c-surface); color: var(--c-text); }
.site-theme .progress-bar { background: var(--c-primary); }
.site-theme .modal-content { background: var(--c-surface); color: var(--c-text); border-radius: 24px; border-color: var(--c-border); box-shadow: var(--sh-lg); }
.site-theme .dropdown-menu { background: var(--c-surface); border-color: var(--c-border); border-radius: 14px; box-shadow: var(--sh-md); }
.site-theme .empty-state .es-icon { background: #edf3ed; color: #527456; border-radius: 20px; box-shadow: none; }
.site-theme .site-card-shot { background: var(--c-surface-3); }
.site-theme .profile-cover { background: #f1eae2; }

/* Public pages share the same surfaces, typography and restrained accents. */
.site-theme .site-nav { background: var(--c-surface); border-bottom-color: var(--c-border); backdrop-filter: none; }
.site-theme .hero, .site-theme .workflow-section { background: var(--c-bg); }
.site-theme .hero::before, .site-theme .hero-orb, .site-theme .stage-glow, .site-theme .cta-orb, .site-theme .auth-brand::before, .site-theme .auth-shell::before { display: none; }
.site-theme .hero h1 { font-size: clamp(2.4rem,5vw,4.5rem); font-family: var(--font-ui); font-weight: 700; letter-spacing: -.06em; line-height: 1.12; }
.site-theme .gradient-text { background: none; color: var(--c-primary-text); -webkit-text-fill-color: currentColor; }
.site-theme .section-head h2, .site-theme .section h2, .site-theme .auth-brand h2 { font-family: var(--font-ui); font-weight: 700; letter-spacing: -.045em; }
.site-theme .bento-card, .site-theme .workflow-card, .site-theme .price-card { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: 24px; box-shadow: var(--sh-sm); }
.site-theme .bento-card:hover, .site-theme .workflow-card:hover, .site-theme .price-card:hover { transform: none; box-shadow: var(--sh-md); }
.site-theme .bento-card::after { display: none; }
.site-theme .feature-icon { display: grid; place-items: center; }
.site-theme .feature-icon .ui-art { width: 3rem; height: 3rem; }
.site-theme .feature-icon .ui-art svg { width: 2.3rem; height: 2.3rem; }
.site-theme .price-card.featured { border-color: var(--c-primary); background: var(--c-surface); box-shadow: 0 0 0 1px var(--c-primary); }
.site-theme .plan-tag { background: var(--c-primary); color: var(--c-on-primary); box-shadow: none; }
.site-theme .cta-panel, .site-theme .auth-brand { background: var(--c-surface-3); color: var(--c-text); }
.site-theme .cta-panel { border: 1px solid var(--c-border); border-radius: 28px; }
.site-theme .cta-panel::before { display: none; }
.site-theme .cta-panel h2, .site-theme .auth-brand h2 { color: var(--c-text); }
.site-theme .cta-panel p, .site-theme .auth-brand p, .site-theme .auth-brand li { color: var(--c-text-2); }
.site-theme .auth-brand li i { color: var(--c-success-text); background: var(--c-success-soft); }
.site-theme .eyebrow-light { color: var(--c-primary-text); background: var(--c-primary-soft); border-color: transparent; }
.site-theme .product-window { box-shadow: var(--sh-lg); border-color: var(--c-border); transform: none; }
.site-theme .mock-sidebar { background: var(--c-surface-2); border-right-color: var(--c-border); }
.site-theme .mock-sidebar i.active { background: var(--c-primary-soft); }
.site-theme .mock-logo, .site-theme .proof-faces span { background: var(--c-primary-soft); color: var(--c-primary-text); }
.site-theme .mock-image, .site-theme .mini-diff > div { background: var(--c-surface-3); color: var(--c-text-2); }
.site-theme .floating-alert, .site-theme .floating-status { box-shadow: var(--sh-md); border-color: var(--c-border); }
.site-theme .footer { background: var(--c-surface); border-top-color: var(--c-border); }
.site-theme .blog-hero, .site-theme .cta-section { background: var(--c-surface-3) !important; color: var(--c-text) !important; border: 1px solid var(--c-border); }
.site-theme .blog-hero h1, .site-theme .blog-hero h2, .site-theme .cta-section h2 { color: var(--c-text) !important; }
.site-theme .blog-hero .lead, .site-theme .cta-section p { color: var(--c-text-2) !important; }
.site-theme .blog-hero { box-shadow: var(--sh-sm); }
.site-theme .blog-hero::after { display: none; }
.site-theme .read-more-btn, .site-theme .back-to-blog { background: var(--c-text) !important; color: var(--c-surface) !important; box-shadow: none; font-size: .8rem; font-weight: 600; }
.site-theme .blog-card:hover, .site-theme .related-post-card:hover { transform: none !important; }
.site-theme .cta-section h3 { color: var(--c-text) !important; }
.site-theme .ai-badge { background: var(--c-info-soft); color: var(--c-info-text); }
.site-theme .floating-status { background: var(--c-text); color: var(--c-surface); }
.site-theme .mock-sidebar i { background: var(--c-border-strong); }
.site-theme .sb-nav { scrollbar-width: thin; scrollbar-color: var(--c-border-strong) transparent; }
.site-theme .category-icon, .site-theme .post-placeholder { background: var(--c-primary-soft) !important; color: var(--c-primary-text) !important; }

/* Older admin templates retain their layout and use the shared surfaces. */
.site-theme .admin-container { background: transparent; min-height: auto; padding-top: 0; }
.site-theme :is(.admin-header,.page-header,.header-section,.comparison-header) h1 { font-family: var(--font-ui); font-weight: 700; font-size: clamp(1.9rem,3vw,2.7rem); }
.site-theme :is(.stats-card,.admin-card,.health-card,.config-card,.form-container,.info-card,.error-card,.post-card,.recommendation-card) { background: var(--c-surface) !important; color: var(--c-text) !important; border: 1px solid var(--c-border) !important; border-radius: 24px !important; box-shadow: var(--sh-sm) !important; }
.site-theme :is(.user-info,.chart-container,.activity-list,.log-item,.editor-toolbar,.preview-content,.email-preview,.settings-card,.user-details,.user-stats) { background: var(--c-surface); color: var(--c-text); border-color: var(--c-border); }
.site-theme :is(.stat-number,.stat-title,.form-group label,.user-name,.section-title,.card-title) { color: var(--c-text); }
.site-theme :is(.stat-description,.stat-label,.user-email,.form-help,.section-description) { color: var(--c-text-2); }
.site-theme .error-header { background: var(--c-danger-soft); color: var(--c-danger-text); }
.site-theme .error-header h1, .site-theme .error-header h2 { color: inherit; }
.site-theme .error-details { background: var(--c-danger-soft); color: var(--c-danger-text); }
.site-theme .admin-section, .site-theme .stat-card, .site-theme .email-card { background: var(--c-surface); color: var(--c-text); border: 1px solid var(--c-border); border-radius: 24px; box-shadow: var(--sh-sm); }
.site-theme .admin-section:hover { transform: none; box-shadow: var(--sh-sm); }
.site-theme .admin-header::before { display: none; }
.site-theme .admin-nav, .site-theme .email-header { background: var(--c-surface-2); color: var(--c-text); box-shadow: none; }
.site-theme .admin-nav .nav-link { color: var(--c-text-2); }
.site-theme .admin-nav .nav-link:hover { background: var(--c-surface); color: var(--c-text); transform: none; box-shadow: none; }
.site-theme .admin-nav .nav-link.active { background: var(--c-primary-soft); color: var(--c-primary-text); }
.site-theme .admin-section h2, .site-theme .email-header h2 { color: var(--c-text); }
.site-theme .sidebar:not(.app-sidebar) { background: var(--c-surface); color: var(--c-text); border-right: 1px solid var(--c-border); box-shadow: none; }
.site-theme .content-area { background: var(--c-bg); min-width: 0; }
.site-theme .element-info { background: var(--c-surface-2); border-color: var(--c-border); border-radius: 16px; }
.site-theme .status-bar:not(.error):not(.success):not(.warning), .site-theme .main-container .header { background: var(--c-surface-2); color: var(--c-text); box-shadow: none; border-bottom: 1px solid var(--c-border); }
.site-theme .main-container .header h1, .site-theme .main-container .header h2 { color: var(--c-text); }
@media (max-width: 767.98px) {
    .site-theme .main-container { flex-direction: column; height: auto; min-height: 100vh; }
    .site-theme .main-container > .sidebar { width: 100%; border-right: 0; border-bottom: 1px solid var(--c-border); }
}
@media (max-width: 767.98px) {
    .site-theme .app-content { padding-top: 1.6rem; }
    .site-theme .page-head { align-items: stretch; }
    .site-theme .card-header, .site-theme .card-body { padding: 1.2rem; }
    .site-theme .card-footer { padding: 1rem 1.2rem; }
    .site-theme .stat { padding: 1.1rem; }
    .site-theme .stat:has(> .ui-art) { grid-template-columns: 1fr; }
    .stat > .ui-art { grid-row: auto; margin-bottom: .8rem; }
    .site-theme .stat-value { font-size: 1.8rem; }
}
@media print { body.site-theme { --c-bg: #fff; --c-surface: #fff; --c-text: #222; --c-text-2: #555; } }