/* ═══ DESIGN SYSTEM VARIABLES ═══ */
/* Fonts are system stacks: Google Fonts were blocked by CSP (font-src 'self')
   and the @import + mid-body <link> chain delayed first paint. */
:root {
    /* Typographical Stacks */
    --sans-font: system-ui, -apple-system, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
    --title-font: system-ui, -apple-system, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
    --display-font: system-ui, -apple-system, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
    --mono-font: ui-monospace, 'SF Mono', Menlo, Monaco, Consolas, monospace;
    
    /* Curated Harmonies (Brutalist HSL Colors) */
    --color-bg: #f8f9fa;
    --color-dark: #000000;
    --color-light-grey: #f8f9fa;
    --color-border: #000000;

    /* Surface + text tokens (used across views and JS modules) */
    --color-surface: #ffffff;
    --color-text: #111111;
    --color-text-secondary: #555555;
    --color-text-muted: #666666;
    --color-bg-alt: #f7f7f7;
    --color-border-light: #cccccc;
    --color-border-lighter: #dddddd;
    
    /* Unified Tactical States */
    --seismo-accent: #ffd95a;
    --color-accent: #ffd95a;         /* Brand yellow — buttons, nav, active pills */
    --color-hover-accent: #fff4d1;   /* Light tint of brand yellow */
    
    /* Functional Colors (Mapped exactly to styleguide) */
    --color-success: #00aa00;
    --color-success-hover: #eafaf1;
    --color-success-active: #c3e6cb;
    
    --color-warning: #ff9900;
    --color-warning-hover: #fffdf0;
    --color-warning-active: #ffe8cc;
    
    --color-danger: #FF2C2C;
    --color-danger-hover: #fff5f5;
    --color-danger-active: #f8d7da;
    
    /* Spacing Tokens */
    --space-xxs: 0.125rem;  /* 2px */
    --space-xs: 0.25rem;    /* 4px */
    --space-sm: 0.5rem;     /* 8px */
    --space-md: 0.625rem;   /* 10px */
    --space-lg: 0.75rem;    /* 12px */
    --space-xl: 0.875rem;   /* 14px */
    --space-xxl: 1rem;      /* 16px */
    --space-3xl: 1.25rem;   /* 20px */
    --space-4xl: 1.5rem;    /* 24px */
    --space-5xl: 2rem;      /* 32px */
}

/* ═══ Base ═══ */
html {
    font-size: 100%; /* 16px — rem tokens below use this root */
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
    background-color: #ffffff;
    color: #000000;
    line-height: 1.6;
    font-size: 0.875rem;                 /* medium — default */
}

.container {
    max-width: 75rem;
    margin: 0 auto;
    padding: 1.25rem 1.25rem;
}

/* ═══ Font-size tokens (16px root) ═══ */
/* big    = 1.125rem (18px) — titles, nav, h2, buttons                    */
/* medium = 0.875rem (14px) — body text, card content, inputs, descriptions */
/* small  = 0.75rem (12px)  — tags, pills, dates, status lines              */

/* ═══ Source pill colours (timeline cards + filter page) ═══ */
:root {
    --seismo-pill-feed-rss: #add8e6;
    --seismo-pill-feed-substack: #c5b4d1;
    --seismo-pill-feed-media: #ffc4c4;
    --seismo-pill-agenda: #e0e0e0;
    --seismo-pill-scraper: #7EB8B0;
    --seismo-pill-documents: #C5E4DF;
    --seismo-pill-lex: #f5f562;
    --seismo-pill-leg: #d4edda;
    --seismo-pill-mail: #ffdbbb;
    --seismo-pill-newsletter: #e5c1a7;
    
    /* Label Button Color Themes */
    --label-investigation: #FF6B6B;
    --label-important: #FFA94D;
    --label-background: #74C0FC;
    --label-noise: #e0e0e0;
}

/* ═══ Logo ═══ */
.logo-icon {
    display: inline-block;
    vertical-align: middle;
    height: 1em;
    width: auto;
    margin-inline-end: 0.3em;
    object-fit: contain;
}

.logo-icon-large {
    height: 2.375rem;
    width: 2.375rem;
}

/* ═══ Top Bar ═══ */
.top-bar {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.625rem 0;
    border-bottom: 0.125rem solid #000000;
    margin-bottom: 1rem;
}

.top-bar-left {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    flex: 1;
    min-width: 0;
}

/* Deliberately not the platform UI font (-apple-system / SF) — reads more like a product wordmark */
.top-bar-title {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 1.125rem;                /* big */
    font-weight: 700;
    color: #000000;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 0.3em;
    white-space: nowrap;
    /* Default subpixel rendering — antialiased thins bold text on some Retina / mobile Safari */
    letter-spacing: 0.01em;
}

/* Explicit bold on each node — !important wins over any host/CDN or legacy rule */
.top-bar-title .top-bar-brand-name,
.top-bar-title .top-bar-brand-version,
.top-bar-title .top-bar-page-title {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 700 !important;
}

.top-bar-title .top-bar-brand-version {
    font-size: 0.92em;
    opacity: 1;
}

.top-bar-title .top-bar-brand-prefix {
    color: #111111;
}

.top-bar-title .top-bar-brand-suffix {
    color: var(--seismo-accent, #111111);
}

.top-bar-title a {
    color: inherit;
    text-decoration: none;
}

/* Logo + brand open the desk switcher — looks like the old wordmark, no chrome */
.desk-switcher-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.3em;
    margin: 0;
    padding: 0;
    border: none;
    background: transparent;
    color: inherit;
    font: inherit;
    letter-spacing: inherit;
    cursor: pointer;
    white-space: nowrap;
}

.desk-switcher-toggle:focus-visible {
    outline: 0.125rem solid #000000;
    outline-offset: 0.125rem;
}

/* Desk switcher: accent fills the chip (not the font). Mothership = brand yellow. */
.desk-switcher .desk-switcher-link {
    color: #111111 !important;
}

.desk-switcher .desk-switcher-link--mothership {
    background-color: #ffd95a !important;
}

.desk-switcher .desk-switcher-link:not(.desk-switcher-link--mothership) {
    background-color: var(--desk-fill, #ffffff) !important;
}

.top-bar-subtitle {
    font-size: 0.75rem;                /* small */
    font-weight: 400;
    color: #000000;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.top-bar-actions {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    flex-shrink: 0;
}

/* Icon buttons in top bar */
.top-bar-btn {
    width: 2.375rem;
    height: 2.375rem;
    border: 0.125rem solid #000000;
    background: #ffffff;
    color: #000000;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 1.125rem;                /* big */
    font-family: inherit;
    font-weight: 600;
    text-decoration: none;
    transition: transform 0.1s ease, box-shadow 0.1s ease, background-color 0.1s ease, border-color 0.1s ease;
    flex-shrink: 0;
    padding: 0;
    line-height: 1;
}

.top-bar-btn:hover {
    box-shadow: 0.125rem 0.125rem 0 #000000;
}

.top-bar-btn.active {
    background: #000000;
    color: #ffffff;
}

/* Text actions (Refresh / Logout) — same brutalist hover as .btn */
.top-bar-btn.top-bar-btn--text {
    width: auto;
    min-width: 2.375rem;
    min-height: 2.375rem;
    padding: 0 0.75rem;
    font-size: 0.875rem;
    font-weight: 600;
}

/* Operator backup nag — coral chip beside the brand when last backup > 7d.
   !important beats the later design-system .top-bar-btn tactile block. */
.top-bar-btn.top-bar-btn--backup-reminder {
    background: #ff6a3d !important;
    background-color: #ff6a3d !important;
    border-color: #000000 !important;
    color: #000000 !important;
    font-weight: 700 !important;
}

.top-bar-btn.top-bar-btn--backup-reminder:hover {
    background: #ff815c !important;
    background-color: #ff815c !important;
    box-shadow: 0.1875rem 0.1875rem 0 #000000 !important;
}

/* Menu toggle — same footprint as other top-bar icon buttons */
.nav-menu-toggle {
    flex-shrink: 0;
}

/* ═══ Navigation Drawer ═══ */
.nav-drawer {
    display: none;
    border: 0.125rem solid #000000;
    border-top: none;
    margin-top: -1rem;
    margin-bottom: 1rem;
}

.nav-drawer.open {
    display: flex;
    flex-wrap: wrap;
}

.nav-link {
    padding: 0.5rem 0.875rem;
    background-color: #ffffff;
    color: #000000;
    font-size: 0.875rem;                /* medium */
    font-weight: 600;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    transition: all 0.15s;
    font-family: inherit;
    border-inline-end: 0.125rem solid #000000;
}

.nav-link:last-child {
    border-inline-end: none;
}

.nav-link:hover {
    box-shadow: 0.125rem 0.125rem 0 #000000;
}

.nav-link.active {
    background-color: var(--seismo-accent, #000000);
    color: #ffffff;
}

/* ═══ Search Drawer ═══ */
.search-drawer {
    display: none;
    margin-top: -1rem;
    margin-bottom: 1rem;
    border: 0.125rem solid #000000;
    border-top: none;
    padding: 0.75rem;
}

.search-drawer.open {
    display: block;
}

/* Header (hidden in new layout) */
header {
    display: none;
}

.subtitle {
    font-size: 0.75rem;                /* small */
    font-weight: 400;
    color: #000000;
}

/* ═══ Typography ═══ */
h2 {
    font-size: 1.125rem;                /* big */
    font-weight: 700;
    color: #000000;
    margin-bottom: 0.75rem;
}

h3 {
    font-size: 1.125rem;                /* big */
    font-weight: 700;
    color: #000000;
    margin-top: 1rem;
    margin-bottom: 0.5rem;
}

/* ═══ Forms ═══ */
.search-input,
.feed-input {
    padding: 0.625rem 0.875rem;
    border: 0.125rem solid #000000;
    background-color: #ffffff;
    color: #000000;
    font-size: 0.875rem;                /* medium */
    font-family: inherit;
}

.search-input:hover,
.feed-input:hover {
    box-shadow: 0.125rem 0.125rem 0 #000000;
}

.search-input:focus,
.feed-input:focus {
    outline: none;
    background-color: #fafafa;
    box-shadow: 0.125rem 0.125rem 0 #000000;
}

.search-input::placeholder,
.feed-input::placeholder {
    color: #000000;
    opacity: 0.4;
}

.search-form {
    display: flex;
    gap: 0.625rem;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 1rem;
}

.dashboard-search-desktop {
    margin-bottom: 0.125rem;
}
.dashboard-search-desktop .search-form {
    margin-bottom: 0;
}


/* Excludes timeline inline toolbar — that input must shrink (mobile row with Heute / expand) */
.search-form .search-input:not(.search-input--timeline-inline) {
    flex: 1;
    min-width: 18.75rem;
}

.add-feed-form {
    display: flex;
    gap: 0.625rem;
    flex-wrap: wrap;
    margin-bottom: 1.25rem;
}

.add-feed-form .feed-input {
    flex: 1;
    min-width: 18.75rem;
}

select.search-input,
textarea.search-input {
    box-sizing: border-box;
    max-width: 100%;
}

textarea.search-input.setup-code-preview {
    font-family: ui-monospace, Menlo, Monaco, Consolas, monospace;
    font-size: 0.75rem;
}

/* Items | Sources toggle row (Feeds / Mail / Scraper) */
.view-toggle-bar {
    display: flex;
    gap: 0.625rem;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 1rem;
}

.view-toggle-label {
    font-size: 0.875rem;
    font-weight: 600;
    color: #000000;
}

/* Admin source forms — brutalist card */
.admin-form-card {
    max-width: 40rem;
    margin-bottom: 1.5rem;
    padding: 1rem;
    border: 0.125rem solid #000000;
    background-color: #ffffff;
}

.admin-form-card-narrow {
    max-width: 32.5rem;
}

.admin-form-card h3:first-of-type {
    margin-top: 0;
}

.admin-form-card h2 {
    margin-top: 1.125rem;
    margin-bottom: 0.75rem;
}

.admin-form-card h2:first-child {
    margin-top: 0;
}

.view-toggle-below-search {
    margin-top: 0.75rem;
}

.view-toggle-bar--split {
    justify-content: flex-start;
    column-gap: 1.75rem;
    row-gap: 0.625rem;
}

.view-toggle-group {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.625rem;
}

.admin-form-field {
    margin-bottom: 0.625rem;
}

.admin-form-field label {
    display: block;
    font-size: 0.875rem;
    font-weight: 600;
    margin-bottom: 0.25rem;
    color: #000000;
}

.admin-form-field--check {
    margin-bottom: 1rem;
}

/* Must beat `.admin-form-field label { display: block }` (0,2,0) */
.admin-form-field label.admin-form-check {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    font-size: 0.875rem;
    font-weight: 600;
    margin-bottom: 0.25rem;
    cursor: pointer;
    line-height: 1.35;
}

.admin-form-check input[type="checkbox"] {
    margin: 0.15rem 0 0;
    flex-shrink: 0;
}

.admin-form-check span {
    min-width: 0;
}

.admin-form-field--check .magnitu-field-hint {
    margin-top: 0.125rem;
    margin-inline-start: 1.375rem;
}

/* Settings → General: stacked panels instead of one crowded card */
.settings-general-stack {
    max-width: 40rem;
}

.settings-general-form > * + * {
    margin-top: 1.25rem;
}

.settings-general-panel > .section-title:first-child {
    margin-top: 0;
    margin-bottom: 0.5rem;
}

.settings-general-panel > .admin-intro:first-of-type {
    margin-top: 0;
}

.settings-general-panel--note {
    background: #f7f7f7;
}

.settings-general-panel--note .admin-intro {
    margin-bottom: 0;
}

.settings-general-input {
    width: 100%;
    max-width: 28rem;
    box-sizing: border-box;
}

.settings-general-input--narrow {
    width: 7rem;
    box-sizing: border-box;
}

.settings-general-input--wide {
    width: 100%;
    max-width: 40rem;
    box-sizing: border-box;
}

.settings-general-links {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1.25rem;
    margin: 0.25rem 0 0;
    font-size: 0.875rem;
    font-weight: 600;
}

.settings-general-links a {
    color: #000000;
}

.settings-general-links a:hover {
    text-decoration: underline;
}

.settings-general-save {
    margin-top: 0.25rem;
}

.settings-general-status {
    margin-top: -0.25rem;
}

.settings-general-subtitle {
    font-size: 1rem;
    margin-top: 1.25rem;
}

.settings-general-timezone {
    margin-bottom: 0;
}

.admin-form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
    margin-top: 0.25rem;
}

.admin-help {
    margin-bottom: 0.625rem;
    padding: 0.75rem 0.875rem;
    border: 0.125rem solid #000000;
    background-color: #f5f5f5;
    font-size: 0.75rem;
    line-height: 1.5;
    color: #000000;
}

.admin-help code {
    word-break: break-all;
}

.admin-intro {
    margin-bottom: 0.75rem;
    font-size: 0.875rem;
    line-height: 1.5;
    color: #000000;
}

.admin-new-senders-section {
    margin-bottom: 1.75rem;
    padding: 1rem;
    border: 0.125rem solid #000000;
    background-color: var(--color-hover-accent, #fff4d1);
}

.admin-new-senders-badge {
    display: inline-block;
    min-width: 1.5rem;
    padding: 0 0.375rem;
    margin-inline-start: 0.375rem;
    font-size: 0.8125rem;
    font-weight: 700;
    text-align: center;
    border: 0.125rem solid #000000;
    background-color: #ffffff;
}

.section-title--compact {
    margin-top: 0;
    margin-bottom: 0.625rem;
    font-size: 1.1rem;
}

.data-table--new-senders thead th {
    background-color: #fff3c4;
}

.admin-form-card--review {
    background-color: #fffef8;
    border-color: #c9a227;
}

.admin-hint {
    margin: -0.25rem 0 0.625rem;
    font-size: 0.8125rem;
    line-height: 1.45;
    color: #333333;
}

.data-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
    border: 0.125rem solid #000000;
    background-color: #ffffff;
}

.data-table thead th {
    padding: 0.5rem 0.625rem;
    text-align: start;
    border-bottom: 0.125rem solid #000000;
    background-color: #ffffc5;
    font-weight: 700;
    font-size: 0.875rem;
}

.data-table tbody td {
    padding: 0.5rem 0.625rem;
    border-bottom: 0.0625rem solid #000000;
    vertical-align: top;
}

.data-table tbody tr:last-child td {
    border-bottom: none;
}

.data-table-empty td {
    padding: 0.75rem 0.875rem;
    font-size: 0.875rem;
    opacity: 0.85;
}

.data-table-url {
    /* Do not use break-all: the table then collapses this column to a few characters. */
    min-width: 18rem;
    width: 30%;
    overflow-wrap: anywhere;
    word-break: normal;
}

.data-table-url a {
    overflow-wrap: inherit;
}

.data-table-actions {
    width: 1%;
    white-space: nowrap;
}

.data-table-actions .admin-table-actions {
    flex-wrap: nowrap;
}

.table-cell-placeholder {
    opacity: 0.6;
}

.top-bar-form-gap {
    margin: 0 0.5rem 0 0;
}

.top-bar-form-flush {
    margin: 0;
}

/* Timeline Refresh (AJAX): width locked so idle/loading do not shift the top bar */
.top-bar-btn--timeline-refresh {
    min-width: 12.5ch;
    box-sizing: border-box;
}

.top-bar-btn--timeline-refresh.is-refreshing {
    cursor: wait;
    opacity: 0.7;
    /* WebKit: flex `<button>` + max-width ellipsis often clips; mothership Chromium is more forgiving */
    overflow: visible;
}

/*
 * Three-dot pulse inside the Refresh loading label — avoids max-width animation
 * + ::after in a flex `<button>` (reliable on Safari/satellite uploads).
 */
.loading-dots {
    display: inline-flex;
    gap: 0;
    margin-inline-start: 0.08em;
    vertical-align: -0.05em;
}

.loading-dots-char {
    display: inline-block;
    animation: seismo-dot-wave 0.95s ease-in-out infinite;
    opacity: 0.35;
}

.loading-dots-char:nth-child(2) {
    animation-delay: 0.16s;
}

.loading-dots-char:nth-child(3) {
    animation-delay: 0.32s;
}

@keyframes seismo-dot-wave {
    0%,
    100% {
        opacity: 0.35;
    }
    50% {
        opacity: 1;
    }
}

@media (prefers-reduced-motion: reduce) {
    .loading-dots-char {
        animation: none;
        opacity: 1;
    }
}

.btn.is-refreshing,
.top-bar-btn.is-refreshing {
    cursor: wait;
    opacity: 0.7;
}

.magnitu-field-hint--spaced {
    margin-bottom: 0.75rem;
}

.admin-table-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
    align-items: center;
    white-space: nowrap;
}

.admin-inline-form {
    display: inline-block;
    vertical-align: middle;
    margin: 0;
}

.data-table-row-muted td {
    opacity: 0.68;
}

.data-table .pill {
    display: inline-block;
    font-size: 0.6875rem;
    font-weight: 700;
    padding: 0.125rem 0.5rem;
    border: 0.0625rem solid #000;
    text-transform: lowercase;
}

.data-table .pill-on {
    background: #e8f8e8;
}

.data-table .pill-off {
    background: #fff0f0;
}

.btn.btn-sm {
    font-size: 0.75rem;
    padding: 0.25rem 0.625rem;
}

.setup-content {
    max-width: 40rem;
}

.setup-content h1:first-of-type {
    margin-top: 0;
}

/* ═══ Timeline filter toolbar (dashboard) ═══ */
.type-sample-big {
    font-size: 1.125rem;
    font-weight: 700;
    color: #000000;
}

.type-sample-small {
    font-size: 0.75rem;
    color: #000000;
}

.search-section-spaced {
    margin-bottom: 1rem;
}

.filter-toolbar {
    margin-top: 1rem;
}

.filter-toolbar__head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.375rem;
}

.filter-toolbar__label {
    font-size: 0.875rem;
    font-weight: 600;
    margin-bottom: 0;
    color: #000000;
}

.filter-toolbar__clear-all {
    font-size: 0.75rem;
    font-weight: 600;
    color: #000000;
    text-decoration: underline;
    opacity: 0.75;
}

.filter-toolbar__clear-all:hover {
    opacity: 1;
}

/* Dashboard filter pills (multi-toggle + per-row None) */
.filter-pill {
    display: inline-block;
    padding: 0.25rem 0.625rem;
    border: 0.0625rem solid #666666;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-decoration: none;
    color: #000000;
    background-color: #ffffff;
    line-height: 1.3;
}

.filter-pill:hover {
    border-color: #000000;
}

.filter-pill--active {
    border-color: #000000;
    box-shadow: 0.0625rem 0.0625rem 0 #000000;
}

.filter-pill--none.filter-pill--active {
    background-color: #f5f5f5;
}

.filter-pill--feed.filter-pill--active {
    background-color: var(--seismo-pill-feed-rss);
}

.filter-pill--scraper.filter-pill--active {
    background-color: var(--seismo-pill-scraper);
}

.filter-pill--documents.filter-pill--active {
    background-color: var(--seismo-pill-documents);
}

.filter-pill--lex.filter-pill--active {
    background-color: var(--seismo-pill-lex);
}

.filter-pill--mail.filter-pill--active {
    background-color: var(--seismo-pill-mail);
}

.filter-pill--leg.filter-pill--active {
    background-color: var(--seismo-pill-leg);
}

.filter-toolbar__row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
    align-items: center;
}

.filter-toolbar__row + .filter-toolbar__row {
    margin-top: 0.5rem;
}

.filter-toolbar__hint {
    font-size: 0.875rem;
    font-weight: 600;
    color: #000000;
    opacity: 0.85;
}

.filter-toolbar__sep {
    opacity: 0.45;
    font-size: 0.75rem;
    padding: 0 0.125rem;
}

.filter-page-preview {
    margin-top: 0.5rem;
    padding-top: 0.75rem;
    border-top: 0.125rem solid #000000;
}

.filter-page-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 0.875rem;
}

.filter-toolbar--form {
    margin-top: 0;
}

.filter-pill-label {
    display: inline-block;
    margin: 0;
    cursor: pointer;
}

.filter-pill-input {
    display: none;
}

/* Filter page: same square pills as .entry-tag, compact size, full type colour always */
.filter-pill-text {
    display: inline-block;
    padding: 0.25rem 0.625rem;
    border: 0.125rem solid #000000;
    border-radius: 0;
    font-size: 0.75rem;
    font-weight: 500;
    color: #000000;
    background-color: #ffffff;
    line-height: 1.3;
    box-sizing: border-box;
    -webkit-appearance: none;
    appearance: none;
}

.filter-pill-input:checked + .filter-pill-text--feed,
.filter-pill-input:checked + .filter-pill-text--feed-rss {
    background-color: var(--seismo-pill-feed-rss);
}

.filter-pill-input:checked + .filter-pill-text--feed-substack {
    background-color: var(--seismo-pill-feed-substack);
}

.filter-pill-input:checked + .filter-pill-text--feed-media {
    background-color: var(--seismo-pill-feed-media);
}

.filter-pill-input:checked + .filter-pill-text--scraper {
    background-color: var(--seismo-pill-scraper);
}

.filter-pill-input:checked + .filter-pill-text--documents {
    background-color: var(--seismo-pill-documents);
}

.filter-pill-input:checked + .filter-pill-text--lex {
    background-color: var(--seismo-pill-lex);
}

.filter-pill-input:checked + .filter-pill-text--mail {
    background-color: var(--seismo-pill-mail);
}

.filter-pill-input:checked + .filter-pill-text--leg {
    background-color: var(--seismo-pill-leg);
}

.filter-pill-label:hover .filter-pill-text {
    border-color: #000000;
}

.filter-pill-input:checked + .filter-pill-text {
    border-color: #000000;
    box-shadow: 0.0625rem 0.0625rem 0 #000000;
}

.filter-pill-input:focus-visible + .filter-pill-text {
    outline: 0.125rem solid #000000;
    outline-offset: 0.125rem;
}

/* ═══ Entry row internals ═══ */
.entry-actions-main {
    display: flex;
    align-items: center;
    gap: 0.625rem;
}

.entry-content.entry-preview {
    display: block;
    text-align: start;
}

.entry-preview-text {
    display: inline;
}

.entry-link--after-preview {
    display: inline;
    margin-inline-start: 0.35rem;
    white-space: nowrap;
}

.entry-meta-mono {
    font-family: ui-monospace, Menlo, Monaco, Consolas, monospace;
    font-size: 0.75rem;
    font-weight: 600;
    color: #000000;
}

.entry-meta-mono--jus {
    font-size: 0.75rem;
}

.entry-author-muted {
    font-size: 0.75rem;
    color: #000000;
    opacity: 0.75;
}

/* Tag colour tokens (timeline cards) */
.entry-tag--parl {
    background-color: var(--seismo-pill-feed-rss);
    border-color: #000000;
}

.entry-tag--meta {
    background-color: #f5f5f5;
}

.entry-tag--feed-rss {
    background-color: var(--seismo-pill-feed-rss);
    border-color: #000000;
}

.entry-tag--feed-substack {
    background-color: var(--seismo-pill-feed-substack);
    border-color: #000000;
}

.entry-tag--feed-media {
    background-color: var(--seismo-pill-feed-media);
    border-color: #000000;
}

.entry-tag--agenda {
    background-color: var(--seismo-pill-agenda);
    border-color: #000000;
}

.entry-tag--broadcast {
    background-color: #f7d6c8;
    border-color: #000000;
}

.entry-tag--scraper {
    background-color: var(--seismo-pill-scraper);
    border-color: #000000;
}

.entry-tag--documents {
    background-color: var(--seismo-pill-documents);
    border-color: #000000;
}

.entry-tag--lex-source {
    background-color: var(--seismo-pill-lex);
    border-color: #000000;
}

.entry-tag--lex-doc {
    background-color: #f5f5f5;
}

/* Lex jurisdiction cards: flag mark + grey doc type left, score top-right */
.entry-header--lex-eu {
    width: 100%;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem 0.625rem;
}

.entry-header--lex-eu .entry-header--lex-eu-left {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem 0.625rem;
    min-width: 0;
}

/* Grey box + black type — same shell as legacy .entry-tag--lex-doc pills */
.entry-lex-eu-doc-type {
    display: inline-block;
    padding: 0.25rem 0.625rem;
    border: 0.125rem solid #000000;
    border-radius: 0;
    background-color: #f5f5f5;
    color: #000000;
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1.3;
    box-sizing: border-box;
}

.entry-header--lex-eu .entry-header--lex-eu-right {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin-inline-start: auto;
    flex-shrink: 0;
}

.entry-header--lex-eu .entry-header-end,
.entry-header--lex-eu .magnitu-badge {
    margin-inline-start: 0;
}

/* Pale yellow, black border — jurisdiction chip (EU / CH / FR / DE / IT / …) */
.entry-lex-eu-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    min-height: 1.375rem;
    padding: 0.1875rem 0.5rem 0.1875rem 0.375rem;
    border: 0.125rem solid #000000;
    background-color: #fff2a8;
    color: #000000;
    font-size: 0.75rem;
    font-weight: 800;
    font-family: inherit;
    line-height: 1.1;
    box-sizing: border-box;
}

.entry-lex-eu-mark__flag {
    display: inline-block;
    font-size: 1em;
    line-height: 1;
}

.entry-lex-eu-mark__text {
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* Same shell as .entry-lex-eu-mark — Swiss jurisdiction (legacy lex_rows / celex parl_mm:*) */
.entry-lex-ch-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    min-height: 1.375rem;
    padding: 0.1875rem 0.5rem 0.1875rem 0.375rem;
    border: 0.125rem solid #000000;
    background-color: #fff2a8;
    color: #000000;
    font-size: 0.75rem;
    font-weight: 800;
    font-family: inherit;
    line-height: 1.1;
    box-sizing: border-box;
}

.entry-lex-ch-mark__flag {
    display: inline-block;
    font-size: 1em;
    line-height: 1;
}

.entry-lex-ch-mark__text {
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.entry-tag--leg-type {
    background-color: var(--seismo-pill-leg);
    border-color: #000000;
}

.entry-tag--leg-council {
    background-color: #e2e3f1;
    border-color: #000000;
}

.filter-pill--newsletter.filter-pill--active {
    background-color: var(--seismo-pill-newsletter);
}

.filter-pill-input:checked + .filter-pill-text--newsletter {
    background-color: var(--seismo-pill-newsletter);
}

.entry-tag--email-sender {
    background-color: var(--seismo-pill-mail);
    border-color: #000000;
}

.entry-tag--newsletter-sender {
    background-color: var(--seismo-pill-newsletter);
    border-color: #000000;
}

.entry-tag--leg-signal {
    background-color: #f5f5f5;
    border-color: #000000;
}

.entry-tag--status-completed {
    background-color: #f5f5f5;
}

.entry-tag--status-cancelled {
    background-color: #ffcccc;
}

.entry-tag--status-other {
    background-color: #fff3cd;
}

.leg-date-heading {
    margin: 1.25rem 0 0.5rem;
    padding: 0.25rem 0;
    border-bottom: 0.125rem solid #000000;
    font-weight: 700;
    font-size: 0.875rem;
    color: #000000;
}

.empty-state-tip {
    font-size: 0.75rem;
    margin-top: 0.5rem;
    color: #000000;
    opacity: 0.8;
}

/* ═══ Diagnostics plugin cards ═══ */
.entry-card.entry-card--diag-never {
    background-color: #f5f5f5;
}

.entry-card.entry-card--diag-ok {
    background-color: #d4edda;
}

.entry-card.entry-card--diag-error {
    background-color: #ffcccc;
}

.entry-card.entry-card--diag-skipped {
    background-color: #f5f5f5;
}

.entry-card.entry-card--diag-warn {
    background-color: #fff3cd;
}

/* Diagnostics Action Center — services vs sources panes (dashed split like cron card) */
.action-center-card {
    padding: 0;
    border: 0.125rem solid #000000;
    overflow: hidden;
}

.action-center-header {
    padding: 1rem 1rem 0.75rem;
    background-color: #ffffff;
    border-bottom: 0.125rem solid #000000;
}

.action-center-header > .section-title {
    margin-top: 0;
    margin-bottom: 0.35rem;
}

.action-center-header > .admin-intro {
    margin-bottom: 0;
}

.action-center-pane {
    padding: 1rem;
}

.action-center-pane + .action-center-pane {
    border-top: 0.125rem dashed #000000;
}

.diag-setup-todo-card {
    padding: 1rem;
    border: 0.125rem solid #000000;
}

.diag-setup-todo-card > .section-title {
    margin-top: 0;
    margin-bottom: 0.35rem;
}

.diag-setup-todo-card > .admin-intro {
    margin-top: 0;
}

.action-center-pane--ok {
    background-color: #d4edda;
}

.action-center-pane--warn {
    background-color: #fff3cd;
}

.action-center-pane--error {
    background-color: #ffcccc;
}

.action-center-pane-title {
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.action-center-pane-ok {
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.action-center-pane-list {
    margin: 0;
    padding-inline-start: 1.25rem;
    line-height: 1.6;
}

.action-center-pane-list li {
    margin-bottom: 0.5rem;
}

.action-center-pane-list li:last-child {
    margin-bottom: 0;
}

.entry-tag--surface {
    background-color: #ffffff;
}

.entry-tag--emphasis {
    font-weight: 600;
}

.entry-tag--warn-pill {
    background-color: #fff3cd;
}

/* Friendly status badges for Diagnostics */
.status-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.625rem;
    font-size: 0.75rem;
    font-weight: 700;
    border: 0.125rem solid #000000;
    margin-inline-end: 0.5rem;
    line-height: 1.1;
    box-sizing: border-box;
}
.status-badge--success { background-color: #d4edda; color: #155724; }
.status-badge--info    { background-color: #e8f4fd; color: #004085; }
.status-badge--danger  { background-color: #f8d7da; color: #721c24; }
.status-badge--neutral { background-color: #e2e3e5; color: #383d41; }

.entry-content--mono-sm {
    margin-top: 0.5rem;
    font-family: ui-monospace, Menlo, Monaco, Consolas, monospace;
    font-size: 0.75rem;
    line-height: 1.45;
    color: #000000;
}

.diag-inline-error {
    margin-top: 0.375rem;
    font-size: 0.75rem;
    color: #990000;
}

.diag-inline-warn {
    margin-top: 0.375rem;
    font-size: 0.75rem;
    color: #856404;
}

.diag-actions {
    margin-top: 0.625rem;
}

.diag-source-health-summary {
    margin-top: 0.25rem;
}

.section-title--nested {
    font-size: 1rem;
    margin-top: 1.25rem;
    margin-bottom: 0.35rem;
}

.diag-source-health-table {
    margin-top: 0.35rem;
}

.diag-source-health-mono {
    font-size: 0.75rem;
}

.diag-source-health-note {
    max-width: 17.5rem;
    word-break: break-word;
}

.diag-source-pill {
    display: inline-block;
    padding: 0.125rem 0.5rem;
    border: 0.0625rem solid #000000;
    font-size: 0.75rem;
    line-height: 1.3;
}

.diag-source-pill--ok {
    background-color: #e8f5e9;
}

.diag-source-pill--stale {
    background-color: #fff8e1;
}

.diag-source-pill--degraded {
    background-color: #ffe0b2;
    border-color: #ff9800;
}

.diag-source-pill--broken {
    background-color: #ffebee;
}

.diag-source-pill--disabled {
    background-color: #f5f5f5;
    opacity: 0.85;
}

.diag-source-pill--pending {
    background-color: #e3f2fd;
    border-color: #1976d2;
}

.diag-all-clear {
    color: #155724;
    font-weight: 600;
}

.diag-split-todo-list {
    list-style: none;
    margin: 0.5rem 0 0;
    padding: 0;
}

.diag-split-todo-item {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.75rem;
    padding: 0.65rem 0;
    border-top: 0.0625rem dashed rgba(0, 0, 0, 0.2);
}

.diag-split-todo-item:first-child {
    border-top: 0;
    padding-top: 0;
}

.diag-split-todo-actions {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Plain-language status line that leads each Diagnostics card, with the
   technical pill/timestamp dump demoted into a collapsed disclosure below it. */
.diag-plain-status {
    font-weight: 600;
    font-size: 0.9375rem;
}

.diag-system-details {
    margin-top: 0.75rem;
    font-size: 0.8125rem;
    border-top: 0.0625rem dashed rgba(0, 0, 0, 0.2);
    padding-top: 0.5rem;
}

.diag-system-details > summary {
    cursor: pointer;
    font-weight: 600;
    color: #555555;
    outline: none;
    user-select: none;
    font-size: 0.75rem;
}

.diag-system-details > summary + * {
    margin-top: 0.5rem;
}

/* Generic status pill used inline in Diagnostics prose (e.g. "Mutex: <pill>free</pill>").
   `.pill-on` reads as the calmer/expected state, `.pill-off` as the one worth a second look —
   these are relative to context, not a strict "good/bad" signal, since e.g. a held mutex is
   normal while a window runs. */
.pill {
    display: inline-block;
    padding: 0.0625rem 0.4375rem;
    font-size: 0.75rem;
    font-weight: 700;
    border: 0.0625rem solid rgba(0, 0, 0, 0.35);
    border-radius: 0.75rem;
    line-height: 1.4;
}

.pill-on {
    background-color: #e8f5e9;
    border-color: #2e7d32;
    color: #1b5e20;
}

.pill-off {
    background-color: #fdecea;
    border-color: #b71c1c;
    color: #7a1f1f;
}

.diag-alert-jump {
    text-decoration: underline;
}

/* Everything-else disclosure below Action Center — see diagnostics_panel.php. */
.diag-detail-collapsible {
    margin-top: 1.5rem;
}

.diag-detail-summary {
    cursor: pointer;
    font-weight: 700;
    font-size: 1.1rem;
    padding: 0.5rem 0;
    outline: none;
    user-select: none;
}

.diag-detail-summary-ok {
    font-weight: 400;
    color: #556;
    font-size: 0.85em;
}

/* Status glossary + "show healthy rows" disclosures nested inside sections. */
.diag-glossary,
.diag-healthy-rows {
    margin-top: 0.5rem;
}

.diag-glossary summary,
.diag-healthy-rows summary {
    cursor: pointer;
    font-weight: 600;
    font-size: 0.8125rem;
    color: #555555;
    outline: none;
    user-select: none;
}

.diag-glossary[open] summary,
.diag-healthy-rows[open] summary {
    margin-bottom: 0.5rem;
}

.diag-test-section {
    margin-top: 1.5rem;
}

.pre-json-block {
    margin: 0;
    padding: 0.75rem 0.875rem;
    border: 0.125rem solid #000000;
    background-color: #f5f5f5;
    font-size: 0.75rem;
    line-height: 1.4;
    overflow-x: auto;
    color: #000000;
}

/* ═══ Plugin recent runs (nested table) ═══ */
.plugin-runs-details {
    margin-top: 0.625rem;
}

.plugin-runs-details summary {
    cursor: pointer;
    font-weight: 600;
    font-size: 0.75rem;
    color: #000000;
}

.plugin-runs-table {
    width: 100%;
    font-size: 0.75rem;
    margin-top: 0.5rem;
    border-collapse: collapse;
    border: 0.125rem solid #000000;
    background-color: #ffffff;
}

.plugin-runs-table thead th {
    padding: 0.375rem 0.5rem;
    text-align: start;
    border-bottom: 0.125rem solid #000000;
    background-color: #ffffc5;
    font-weight: 700;
}

.plugin-runs-table tbody td {
    padding: 0.375rem 0.5rem;
    border-bottom: 0.0625rem solid #000000;
    vertical-align: top;
}

.plugin-runs-table tbody tr:last-child td {
    border-bottom: none;
}

.plugin-runs-table .plugin-run-error {
    color: #990000;
    font-size: 0.75rem;
}

/* ═══ Settings tabs (moved from inline settings.php) ═══ */
.settings-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1.25rem;
    border-bottom: 0.125rem solid #000000;
    padding-bottom: 0.625rem;
}

.settings-tabs a {
    padding: 0.5rem 0.875rem;
    text-decoration: none;
    font-weight: 600;
    font-size: 0.875rem;
    border: 0.125rem solid #000000;
    color: #000000;
    background-color: #ffffff;
    display: inline-block;
    transition: all 0.15s;
}

.settings-tabs a:hover {
    box-shadow: 0.125rem 0.125rem 0 #000000;
}

.settings-tabs a.active {
    background-color: var(--seismo-accent, #ffd95a);
    color: #000000;
    border-color: #000000;
}

.settings-tabs a.settings-tab--error {
    border-color: #FF2C2C;
    color: #FF2C2C;
}

.settings-tabs a.settings-tab--error:hover {
    box-shadow: 0.125rem 0.125rem 0 #FF2C2C;
}

.settings-tabs a.settings-tab--error.active {
    transform: none;
    box-shadow: 0.0625rem 0.0625rem 0 #FF2C2C;
    background-color: #FF2C2C;
    color: #ffffff;
    border-color: #000000;
}

/* ═══ Retention grid (Settings) ═══ */
.retention-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1rem;
    font-size: 0.875rem;
    border: 0.125rem solid #000000;
    background-color: #ffffff;
}

.retention-table th,
.retention-table td {
    padding: 0.5rem 0.625rem;
    border-bottom: 0.0625rem solid #000000;
    text-align: start;
    vertical-align: top;
}

.retention-table thead th {
    background-color: #ffffc5;
    font-weight: 700;
    border-bottom: 0.125rem solid #000000;
}

.retention-table tbody tr:last-child td {
    border-bottom: none;
}

.retention-table input[type="number"] {
    max-width: 100%;
}

.retention-keeps label {
    display: block;
    font-size: 0.75rem;
    margin-top: 0.125rem;
    color: #000000;
}

.retention-family-note {
    font-size: 0.75rem;
    color: #000000;
    opacity: 0.75;
    margin-top: 0.125rem;
}

.retention-unlimited {
    color: #000000;
    opacity: 0.65;
    font-style: italic;
}

/* ═══ Magnitu settings tab ═══ */
.magnitu-settings-stack > * + * {
    margin-top: 1.5rem;
}

.magnitu-panel {
    padding: 1rem;
    border: 0.125rem solid #000000;
    background-color: #ffffff;
}

.magnitu-panel--danger {
    border-color: #FF2C2C;
    background-color: #fff5f5;
}

.magnitu-panel--danger > .section-title:first-child,
.magnitu-panel--danger > h3:first-child {
    color: #FF2C2C;
    margin-top: 0;
}

.magnitu-panel--danger > .admin-intro:first-of-type {
    margin-top: 0;
}

.magnitu-panel > h3:first-of-type,
.magnitu-panel > .section-title:first-of-type {
    margin-top: 0;
}

.magnitu-field-block {
    margin-bottom: 1rem;
}

.magnitu-field-block:last-child {
    margin-bottom: 0;
}

.magnitu-field-label {
    font-size: 0.75rem;
    font-weight: 600;
    display: block;
    margin-bottom: 0.25rem;
    color: #000000;
}

.magnitu-field-hint {
    font-size: 0.75rem;
    margin-top: 0.25rem;
    color: #000000;
    opacity: 0.75;
}

/* Measured numbers, not static explanation: set the live hint apart. */
.magnitu-field-hint--measured {
    border-left: 2px solid rgba(0, 0, 0, 0.25);
    padding-left: 0.4rem;
    opacity: 0.9;
}

.magnitu-copy-row {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    flex-wrap: wrap;
}

.magnitu-stats-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
}

.magnitu-stats-grid--four {
    grid-template-columns: repeat(4, 1fr);
}

@media (max-width: 56.25rem) {
    .magnitu-stats-grid--four {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 40rem) {
    .magnitu-stats-grid {
        grid-template-columns: 1fr;
    }
}

.magnitu-stat-tile {
    text-align: center;
    padding: 0.625rem;
    border: 0.125rem solid #000000;
    background-color: #ffffff;
}

.magnitu-stat-value {
    font-size: 1.125rem;
    font-weight: 700;
    color: #000000;
}

.magnitu-stat-label {
    font-size: 0.75rem;
    color: #000000;
}

.magnitu-sync-line {
    font-size: 0.75rem;
    margin-top: 0.75rem;
    color: #000000;
}

/* Logbook — source add audit (mothership) */
.logbook-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.logbook-line {
    padding: 0.5rem 0;
    border-bottom: 0.0625rem solid #000000;
    font-size: 0.875rem;
    color: #000000;
}

.logbook-line:last-child {
    border-bottom: none;
}

.logbook-when {
    font-weight: 700;
}

.magnitu-model-block {
    margin-top: 1rem;
    padding: 0.75rem 0.875rem;
    border: 0.125rem solid #000000;
    background-color: #ffffff;
}

.magnitu-model-kicker {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.01875rem;
    margin-bottom: 0.5rem;
    color: #000000;
}

.magnitu-model-head {
    display: flex;
    gap: 1rem;
    align-items: baseline;
    flex-wrap: wrap;
}

.magnitu-model-name {
    font-size: 1.125rem;
    font-weight: 700;
    color: #000000;
}

.magnitu-model-version {
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.125rem 0.5rem;
    border: 0.125rem solid #000000;
    background-color: #FF6B6B;
    color: #000000;
}

.magnitu-model-desc {
    font-size: 0.75rem;
    margin-top: 0.25rem;
    color: #000000;
}

.magnitu-model-trained {
    font-size: 0.75rem;
    margin-top: 0.375rem;
    color: #000000;
}

.magnitu-model-foot {
    font-size: 0.6875rem;
    margin-top: 0.5rem;
    color: #000000;
    opacity: 0.75;
    font-style: italic;
}

.magnitu-prefs-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

@media (max-width: 40rem) {
    .magnitu-prefs-grid {
        grid-template-columns: 1fr;
    }
}

.magnitu-sort-label {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0;
    cursor: pointer;
    font-size: 0.875rem;
    color: #000000;
}

.search-input[readonly].magnitu-readonly-key,
.search-input[readonly].magnitu-readonly-url {
    box-sizing: border-box;
    background-color: #f5f5f5;
    cursor: pointer;
    font-family: ui-monospace, Menlo, Monaco, Consolas, monospace;
    font-size: 0.75rem;
}

.search-input[readonly].magnitu-readonly-key {
    flex: 1;
    min-width: 12rem;
    width: auto;
}

.search-input[readonly].magnitu-readonly-url {
    width: 100%;
}

/* ═══ Health (minimal public page) ═══ */
.health-page {
    max-width: 45rem;
    margin: 2.5rem auto;
    padding: 0 1.25rem 3rem;
}

.health-page h1 {
    margin: 0 0 1.5rem;
    font-size: 1.375rem;
    font-weight: 700;
    color: #000000;
}

.health-dl {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 0.5rem 1.25rem;
    margin: 0 0 1.5rem;
    font-size: 0.875rem;
    color: #000000;
}

.health-dl dt {
    font-weight: 600;
}

.health-dl dd {
    margin: 0;
}

.health-code {
    padding: 0.125rem 0.375rem;
    border: 0.125rem solid #000000;
    background-color: #f5f5f5;
    font-size: 0.75rem;
}

.health-status-ok {
    color: #006600;
    font-weight: 600;
}

.health-status-warn {
    color: #996600;
    font-weight: 600;
}

.health-status-err {
    color: #990000;
    font-weight: 600;
}

.health-overall {
    margin: 0 0 1.25rem;
    font-size: 0.9375rem;
    font-weight: 600;
}

.health-section-title {
    margin: 0 0 0.75rem;
    font-size: 1rem;
    font-weight: 700;
    color: #000000;
}

.health-cron-table {
    width: 100%;
    border-collapse: collapse;
    margin: 0 0 1.5rem;
    font-size: 0.8125rem;
}

.health-cron-table th,
.health-cron-table td {
    border: 0.125rem solid #000000;
    padding: 0.375rem 0.625rem;
    text-align: left;
    vertical-align: top;
}

.health-cron-table th {
    font-weight: 700;
    background-color: #f5f5f5;
}

.health-note {
    font-size: 0.75rem;
    color: #000000;
    padding-top: 1rem;
    margin: 0;
    border-top: 0.125rem solid #000000;
    line-height: 1.5;
}

/* ═══ Login ═══ */
.login-container {
    max-width: 27.5rem;
    margin: 5rem auto 0;
}

.login-form-card {
    margin-top: 1.5rem;
}

.module-section-spaced {
    margin-bottom: 1.5rem;
}

/* ═══ Buttons & Master Brutalist Clickables ═══ */
.btn, .top-bar-btn, .settings-tabs a, .nav-link, .tag-filter-pill {
    border: 0.125rem solid #000000;
    border-radius: 0 !important; /* Locks sharp 90-degree tactile corners */
    font-weight: 600;
    transition: transform 0.1s ease, box-shadow 0.1s ease, background-color 0.1s ease, border-color 0.1s ease;
    box-shadow: 0.0625rem 0.0625rem 0 #000000; /* Flat default shadow - refined 1px */
    cursor: pointer;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* 3D Tactile Hover Lift */
.btn:hover, .top-bar-btn:hover, .settings-tabs a:hover, .nav-link:hover, .tag-filter-pill:hover {
    transform: translate(-1px, -1px);
    box-shadow: 0.125rem 0.125rem 0 #000000; /* Refined 2px shadow on hover */
}

.btn {
    padding: 0.5rem 1rem;
    background-color: #ffffff;
    color: #000000;
    font-size: 0.875rem;                /* medium */
    font-family: inherit;
}

.btn-primary {
    background-color: #ffffff;
    color: #000000;
}

.btn-secondary {
    background-color: #ffffff;
    color: #000000;
}

.btn-danger {
    background-color: #ffffff;
    color: #000000;
    border-color: #FF2C2C;
}

.btn-danger:hover {
    box-shadow: 0.125rem 0.125rem 0 #FF2C2C;
}

.btn-warning {
    background-color: #ffffff;
    color: #000000;
    border-color: #ff9900;
}

.btn-warning:hover {
    box-shadow: 0.125rem 0.125rem 0 #ff9900;
}

.btn-success {
    background-color: #ffffff;
    color: #000000;
    border-color: #00aa00;
}

.btn-success:hover {
    box-shadow: 0.125rem 0.125rem 0 #00aa00;
}

/* Expand + translation toggle — matched compact card controls */
.btn.entry-expand-btn,
.btn.entry-lang-toggle {
    font-size: 0.75rem !important;
    padding: 0.25rem 0.625rem !important;
    line-height: 1 !important;
    height: 1.625rem !important;
    box-sizing: border-box !important;
    box-shadow: 0.0625rem 0.0625rem 0 #000000 !important;
}

/* Translation pair: HTML `hidden` is authoritative; CSS mirrors for non-JS / print */
.entry-card .entry-text--original[hidden],
.digest-child-item .entry-text--original[hidden],
.entry-card .entry-text--translated[hidden],
.digest-child-item .entry-text--translated[hidden] {
    display: none !important;
}

.entry-card.is-showing-original .entry-text--translated,
.digest-child-item.is-showing-original .entry-text--translated {
    display: none !important;
}

.entry-card.is-showing-original .entry-text--original,
.digest-child-item.is-showing-original .entry-text--original {
    display: inline !important;
}

.timeline-day-row-actions {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    gap: 0.5rem;
}

/* Timeline toolbar: Media / ★ favs / highest sort + expand all — matched control utilities */
.timeline-day-row-actions .btn.entry-expand-all-btn,
.timeline-day-row-actions .btn.timeline-media-toggle-btn,
.timeline-day-row-actions .btn.timeline-favourites-toggle-btn,
.timeline-day-row-actions .btn.timeline-highlights-sort-toggle-btn,
.timeline-day-row-actions .btn.timeline-highlights-band-toggle-btn,
.timeline-day-row-actions .btn.timeline-agenda-sort-toggle-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    height: 1.625rem;
    margin: 0;
    padding: 0.25rem 0.625rem;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1;
    border: 0.125rem solid #000000;
    border-radius: 0;
    white-space: nowrap;
    font-family: inherit;
    -webkit-appearance: none;
    appearance: none;
    box-shadow: 0.0625rem 0.0625rem 0 #000000;
}

.timeline-favourites-toggle-star {
    font-size: 0.625rem;
    line-height: 1;
    margin-inline-end: 0.125rem;
}

/* ═══ Cards ═══ */
.entry-card,
.item-card {
    border: 0.125rem solid #000000;
    padding: 0.875rem 1rem;
    background-color: #ffffff;
    transition: all 0.2s;
}

.entry-card:hover,
.item-card:hover {
    box-shadow: 0.125rem 0.125rem 0 #000000;
}

/* Magnitu timeline: day group headings between cards */
.timeline-day-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin: 1.125rem 0 0.625rem 0;
}

.timeline-day-row .magnitu-day-separator {
    margin: 0;
    flex: 1;
    min-width: 0;
}

.timeline-day-row--expand-only {
    justify-content: flex-end;
}

/* Index only: mobile search in day row (first row on narrow viewports) */
.timeline-inline-search {
    display: none;
}

.timeline-day-row--with-inline-search .magnitu-day-separator {
    flex: 0 1 auto;
}

.timeline-day-row--with-inline-search .timeline-inline-search {
    flex: 1;
    min-width: 0;
}

.timeline-day-row--expand-only.timeline-day-row--with-inline-search {
    justify-content: flex-start;
    gap: 0.5rem;
}

.timeline-day-row--expand-only.timeline-day-row--with-inline-search .timeline-day-row-actions {
    margin-inline-start: auto;
}

.search-form--timeline-inline {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 0.375rem;
    margin-bottom: 0;
}

.search-form--timeline-inline .search-input--timeline-inline {
    flex: 1;
    min-width: 0;
    padding: 0.375rem 0.625rem;
    font-size: 0.875rem;
}

.btn-timeline-search-submit {
    flex-shrink: 0;
    padding: 0.375rem 0.625rem;
    font-size: 0.75rem;
    font-weight: 700;
}

.timeline-search-clear {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.75rem;
    height: 2rem;
    font-size: 1.125rem;
    line-height: 1;
    font-weight: 700;
    text-decoration: none;
    color: #000000;
    border: 0.125rem solid #000000;
    background: #ffffff;
}

.timeline-search-clear:hover {
    box-shadow: 0.125rem 0.125rem 0 #000000;
}

.magnitu-day-separator {
    margin: 1.125rem 0 0.625rem 0;
}
.magnitu-day-separator-text {
    display: inline-block;
    padding: 0.3125rem 0.75rem;
    border: 0.125rem solid #000000;
    background: #f0f0f0;
    font-size: 0.75rem;
    font-weight: 700;
    color: #000000;
}

/* Card header row (tags left; actions + score badge clustered top-right) */
.entry-header,
.item-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.375rem;
    margin-bottom: 0.375rem;
    font-size: 0.75rem;                /* small */
    color: #000000;
}

.entry-header > .entry-tag,
.item-meta > .entry-tag {
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.entry-header-end {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin-inline-start: auto;
    flex-shrink: 0;
}

.entry-header-end .magnitu-badge {
    margin-inline-start: 0;
}

.entry-card--agenda .entry-title {
    margin-top: 0.15rem;
}

.entry-card-actions {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}

.entry-feed,
.item-date {
    font-weight: 600;
    color: #000000;
}

.entry-tag {
    display: inline-block;
    padding: 0.25rem 0.625rem;
    border: 0.125rem solid #000000;
    border-radius: 0;
    font-size: 0.75rem;                /* small */
    font-weight: 500;
    color: #000000;
    box-sizing: border-box;
}

.entry-date,
.item-author {
    font-size: 0.75rem;                /* small */
    font-style: italic;
    color: #000000;
}

.entry-title,
.item-title {
    font-size: 0.875rem;                /* medium */
    font-weight: 700;
    margin-bottom: 0.375rem;
    color: #000000;
}

.entry-title a,
.item-title a {
    color: #000000;
    text-decoration: none;
}

.entry-title a:hover,
.item-title a:hover {
    text-decoration: underline;
}

.entry-content,
.item-content {
    color: #000000;
    line-height: 1.5;
    margin-bottom: 0.5rem;
    font-size: 0.75rem;                /* small */
}

.entry-muted {
    opacity: 0.75;
    font-style: italic;
}

.feed-description {
    color: #000000;
    margin-bottom: 0.5rem;
    font-size: 0.75rem;                /* small */
    line-height: 1.5;
}

.entry-link,
.item-link {
    display: inline;
    color: #000000;
    text-decoration: none;
    font-weight: 600;
    font-size: 0.75rem;                /* small */
}

.entry-link:hover,
.item-link:hover {
    text-decoration: underline;
}

.item-content p {
    margin-bottom: 0.5rem;
}

.item-content img {
    max-width: 100%;
    height: auto;
    margin: 0.5rem 0;
}

.item-content a {
    color: #000000;
    text-decoration: underline;
}

/* ═══ Messages ═══ */
.message {
    padding: 0.625rem 0.875rem;
    margin-bottom: 0.75rem;
    border: 0.125rem dashed #000000;
    background-color: #ffffff;
    font-size: 0.75rem;                /* small */
    color: #000000;
}

.message-success {
    background-color: #f5f5f5;
}

.message-error {
    background-color: #ffffff;
}

.message-info {
    background-color: #f5f5f5;
}

.message-warning {
    background-color: #fff3cd;
}

.lex-scope-banner {
    position: relative;
    padding-right: 2rem;
}

.lex-scope-banner__jur {
    font-weight: 600;
}

.lex-scope-banner__dismiss {
    position: absolute;
    top: 0.25rem;
    right: 0.35rem;
    margin: 0;
}

.lex-scope-banner__dismiss-btn {
    border: none;
    background: transparent;
    color: #000000;
    font-size: 1.1rem;
    line-height: 1;
    cursor: pointer;
    padding: 0.15rem 0.35rem;
}

.lex-scope-banner__dismiss-btn:hover {
    opacity: 0.65;
}

/* ═══ Gold tab — scope-omission hit list ═══ */
.lex-gold-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.entry-card.entry-card--archived {
    opacity: 0.65;
    background-color: #fbfbfb;
}

.lex-gold-item__dismiss-form {
    margin: 0;
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
}

.entry-lex-eu-doc-type.lex-badge--omission {
    background-color: #ffd95a;
}

.entry-lex-eu-doc-type.lex-badge--members {
    background-color: #b8e0ff;
}

.entry-lex-eu-doc-type.lex-badge--tax {
    background-color: #ffb3b3;
}

.entry-lex-eu-doc-type.lex-badge--regulation {
    background-color: #d4edda;
}

.lex-gold-item__snippet-text {
    color: #000000;
}

.lex-gold-item__snippet-full-text {
    font-size: 0.75rem;
    line-height: 1.6;
    color: #000000;
}

.lex-gold-item__analysis {
    margin-top: 0.75rem;
    border: 0.0625rem solid #000000;
    background-color: #fafafa;
    padding: 0.75rem 1rem;
}

.lex-gold-item__analysis-loading {
    font-size: 0.8125rem;
    color: #444444;
    font-style: italic;
    margin: 0;
}

.lex-gold-item__analysis-error {
    font-size: 0.8125rem;
    color: #cc0000;
    margin: 0;
}

.lex-gold-item__analysis-headline {
    font-weight: 700;
    font-size: 0.875rem;
    margin: 0 0 0.5rem 0;
    line-height: 1.4;
    color: #000000;
}

.lex-gold-item__verdict {
    display: inline-block;
    font-size: 0.6875rem;
    font-weight: 600;
    padding: 0.0625rem 0.375rem;
    border: 0.0625rem solid #000000;
    margin: 0 0 0.5rem 0;
}

.lex-gold-item__verdict--real_barrier {
    background-color: #ffb3b3;
    color: #000000;
}

.lex-gold-item__verdict--false_alarm {
    background-color: #d4edda;
    color: #000000;
}

.lex-gold-item__verdict--treaty_protected {
    background-color: #b8e0ff;
    color: #000000;
}

.lex-gold-item__verdict--niche_individual {
    background-color: #e0e0e0;
    color: #000000;
}

.lex-gold-item__exposure {
    display: inline-block;
    font-size: 0.6875rem;
    font-weight: 600;
    padding: 0.0625rem 0.375rem;
    border: 0.0625rem solid #000000;
    margin: 0 0 0.5rem 0.25rem;
}

.lex-gold-item__exposure--material {
    background-color: #ffd9a6;
    color: #000000;
}

.lex-gold-item__exposure--limited {
    background-color: #f2f2f2;
    color: #000000;
}

.lex-gold-item__exposure--symbolic {
    background-color: #f2f2f2;
    color: #666666;
}

.lex-gold-item__impl-badge {
    display: inline-block;
    font-size: 0.6875rem;
    font-weight: 600;
    padding: 0.0625rem 0.375rem;
    border: 0.0625rem solid #8a6d3b;
    background-color: #fcf8e3;
    color: #8a6d3b;
    margin: 0 0 0.5rem 0.25rem;
}

.lex-gold-item__stale-badge {
    display: inline-block;
    font-size: 0.6875rem;
    font-weight: 600;
    padding: 0.0625rem 0.375rem;
    border: 0.0625rem solid #a94442;
    background-color: #f2dede;
    color: #a94442;
    margin: 0 0 0.5rem 0.25rem;
}

.lex-gold-item__analysis-body {
    font-size: 0.8125rem;
    line-height: 1.6;
}

.lex-gold-item__analysis-body .seismo-md-p {
    margin: 0 0 0.5rem 0;
}

.lex-gold-item__analysis-body .seismo-md-p:last-child {
    margin-bottom: 0;
}

.lex-gold-item__analysis-body .seismo-md-h2 {
    font-weight: 700;
    font-size: 0.8125rem;
    margin: 0.75rem 0 0.25rem 0;
}

.lex-gold-item__analysis-body .seismo-md-h3 {
    font-weight: 600;
    font-size: 0.8125rem;
    margin: 0.5rem 0 0.25rem 0;
}

.lex-gold-item__analysis-body .seismo-md-blockquote {
    border-left: 0.1875rem solid var(--seismo-accent, #ffd95a);
    margin: 0.5rem 0;
    padding: 0.25rem 0.75rem;
    background-color: #ffffff;
    font-size: 0.75rem;
}

.lex-gold-item__analysis-body .seismo-md-ul,
.lex-gold-item__analysis-body .seismo-md-ol {
    margin: 0.25rem 0;
    padding-left: 1.5rem;
}

.lex-gold-item__analysis-body .seismo-md-li {
    margin: 0.125rem 0;
}

.lex-gold-item__analysis-meta {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 0.5rem;
    padding-top: 0.5rem;
    border-top: 0.0625rem solid #cccccc;
    font-size: 0.6875rem;
    color: #666666;
}

.lex-gold-item__analysis-cached {
    font-style: italic;
    color: #888888;
}

.lex-gold-item__analysis-date {
    color: #888888;
}

.lex-gold-item__analysis-model {
    font-family: var(--mono-font, monospace);
}

.lex-gold-item__analysis-cost {
    font-family: var(--mono-font, monospace);
    color: #444444;
}

.lex-gold-item__analysis-regen-btn {
    margin-left: auto;
    border: 0.0625rem solid #000000;
    background: #ffffff;
    color: #000000;
    font-size: 0.6875rem;
    cursor: pointer;
    padding: 0.0625rem 0.375rem;
}

.lex-gold-item__analysis-regen-btn:hover {
    background-color: var(--seismo-accent, #ffd95a);
}

.lex-gold-item__analysis-regen-btn:disabled {
    opacity: 0.6;
    cursor: wait;
}

.lex-gold-archive {
    margin-top: 1.5rem;
    border-top: 0.125rem solid #000000;
    padding-top: 0.75rem;
}

.lex-gold-archive__header {
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 700;
    color: #000000;
    padding: 0.5rem 0;
    user-select: none;
}

.lex-gold-archive__header:hover {
    color: #444444;
}

.lex-gold-archive__body {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding-top: 0.5rem;
}

/* ═══ Settings → Desks ═══ */
.settings-code-inline {
    background: #ffffff;
    padding: 0.125rem 0.375rem;
    border: 0.0625rem solid #000000;
    font-size: 0.75rem;
    user-select: all;
}

.settings-code-block {
    display: block;
    margin-top: 0.375rem;
    background: #ffffff;
    padding: 0.375rem 0.5rem;
    border: 0.0625rem solid #000000;
    font-size: 0.75rem;
    white-space: pre-wrap;
    overflow-x: auto;
}

.settings-code-tiny {
    font-size: 0.6875rem;
}

.settings-satellite-table-wrap {
    overflow-x: auto;
    margin-bottom: 1.25rem;
    border: 0.125rem solid #000000;
    background: #ffffff;
}

.settings-satellite-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8125rem;
}

.settings-satellite-table th,
.settings-satellite-table td {
    padding: 0.5rem 0.625rem;
    border-bottom: 0.0625rem solid #cccccc;
    text-align: start;
    vertical-align: middle;
}

.settings-satellite-table thead th {
    background: #ffffc5;
    font-weight: 700;
    border-bottom: 0.125rem solid #000000;
}

.settings-satellite-table tbody tr:last-child td {
    border-bottom: none;
}

.settings-satellite-row-highlight {
    background-color: #fff3cd;
}

.settings-satellite-meta {
    font-size: 0.6875rem;
    color: #444444;
}

.settings-satellite-rotated {
    color: #990000;
}

.settings-accent-swatch {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    vertical-align: middle;
    margin-inline-end: 0.25rem;
    border: 0.0625rem solid #000000;
}

.settings-satellite-actions {
    text-align: end;
    white-space: nowrap;
}

.settings-satellite-actions .admin-inline-form {
    display: inline-block;
    margin-inline-start: 0.25rem;
}

.settings-satellite-brand-prefix {
    color: #111111;
    font-weight: 600;
}

.settings-satellite-brand-suffix {
    font-weight: 600;
}

.settings-satellite-muted {
    color: #999999;
    font-size: 0.6875rem;
}

.settings-satellite-add {
    border: 0.125rem solid #000000;
    padding: 0.75rem 1rem;
    margin-bottom: 1.25rem;
}

.settings-mail-advanced {
    border: 0.125rem solid #000000;
    padding: 0.75rem 1rem;
    margin-bottom: 1.25rem;
}

.settings-mail-advanced summary {
    cursor: pointer;
    font-weight: 600;
    font-size: 0.875rem;
}

.settings-satellite-add-summary {
    cursor: pointer;
    font-weight: 600;
    font-size: 0.875rem;
}

.settings-satellite-form {
    margin-top: 0.75rem;
    max-width: 40rem;
}

.settings-satellite-context {
    font-size: 0.75rem;
    color: #555555;
    border-top: 0.0625rem solid #cccccc;
    padding-top: 0.75rem;
    margin-top: 0.5rem;
}

.settings-satellite-context ul {
    margin: 0.375rem 0 0 1.25rem;
    padding: 0;
}

.settings-ok {
    color: #006600;
}

.settings-bad {
    color: #990000;
}

/* ═══ Tag Filters ═══ */
.tag-filter-section {
    width: 100%;
    margin-top: 0.5rem;
}

.tag-filter-section--spaced-bottom {
    margin-bottom: 1rem;
}

.tag-filter-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
}

.tag-filter-pill {
    position: relative;
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.625rem;
    border: 0.125rem solid #000000;
    background-color: #ffffff;
    color: #000000;
    font-size: 0.75rem;                /* small */
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}

.tag-filter-pill input[type="checkbox"] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.tag-filter-pill span {
    pointer-events: none;
}

.tag-filter-pill:hover {
    box-shadow: 0.125rem 0.125rem 0 #000000;
}

/* Transient 3D Pressed Click State */
.btn:active, .top-bar-btn:active, .settings-tabs a:active, .nav-link:active, .tag-filter-pill:active {
    transform: translate(1px, 1px);
    box-shadow: 0 0 0 #000000; /* Refined 0px shadow when actively clicked */
}

/* Persistent Selected Active State */
.btn.active, .btn.is-active,
.top-bar-btn.active, 
.settings-tabs a.active, .nav-link.active,
.tag-filter-pill-active {
    transform: none;
    box-shadow: 0.0625rem 0.0625rem 0 #000000; /* Keeps refined 1px shadow */
    background-color: var(--color-accent, #ffd95a); /* Brand yellow accent */
}

.tag-filter-pill-active.tag-filter-pill--ch-lex {
    background-color: #ffffb3;
}

.tag-filter-pill-active.tag-filter-pill--non-ch-lex {
    background-color: #9fd4c4;
}

button.tag-filter-pill {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    appearance: none;
    -webkit-appearance: none;
    margin: 0;
    user-select: none;
}

.tag-filter-pill-active.tag-filter-pill--leg-source {
    background-color: #d4edda;
}

.tag-filter-pill-active.tag-filter-pill--event-type {
    background-color: #e2e3f1;
}

/* Filter pill active background overrides matching the styleguide sources color scheme */
.tag-filter-pill-active.tag-filter-pill--feeds {
    background-color: var(--seismo-pill-feed-rss, #add8e6);
}

.tag-filter-pill-active.tag-filter-pill--substack {
    background-color: var(--seismo-pill-feed-substack, #c5b4d1);
}

.tag-filter-pill-active.tag-filter-pill--media {
    background-color: var(--seismo-pill-feed-media, #ffc4c4);
}

.tag-filter-pill-active.tag-filter-pill--agenda {
    background-color: var(--seismo-pill-agenda, #e0e0e0);
}

.tag-filter-pill-active.tag-filter-pill--scraper {
    background-color: var(--seismo-pill-scraper, #7EB8B0);
}

.tag-filter-pill-active.tag-filter-pill--documents {
    background-color: var(--seismo-pill-documents, #C5E4DF);
}

.tag-filter-pill-active.tag-filter-pill--lex {
    background-color: var(--seismo-pill-lex, #f5f562);
}

.tag-filter-pill-active.tag-filter-pill--leg {
    background-color: var(--seismo-pill-leg, #d4edda);
}

.tag-filter-pill-active.tag-filter-pill--email {
    background-color: var(--seismo-pill-mail, #ffdbbb);
}

.tag-filter-pill-active.tag-filter-pill--newsletter {
    background-color: var(--seismo-pill-newsletter, #e5c1a7);
}

.tag-filter-pill-active.tag-filter-pill--broadcast {
    background-color: #f7d6c8;
}

/* ═══ Category Filters ═══ */
.category-filter {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}

.category-btn {
    padding: 0.375rem 0.75rem;
    border: 0.125rem solid #000000;
    background-color: #ffffff;
    color: #000000;
    font-size: 0.75rem;                /* small */
    font-weight: 500;
    text-decoration: none;
    display: inline-block;
    transition: all 0.2s;
    font-family: inherit;
}

.category-btn:hover {
    box-shadow: 0.125rem 0.125rem 0 #000000;
}

/* ═══ Layout ═══ */
.latest-entries-section,
.items-list {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
    margin-bottom: 1.5rem;
}

.items-list {
    gap: 0.75rem;
}

/* Actions row */
.feed-actions,
.feed-actions-top {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-top: 0.625rem;
}

/* ═══ Empty State ═══ */
.empty-state {
    text-align: center;
    padding: 1.875rem 1.25rem;
    color: #000000;
    font-size: 0.75rem;                /* small */
}

/* ═══ Section Title Row ═══ */
.section-title-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 0.625rem 0;
}

.section-title-row .section-title {
    margin-bottom: 0;
    font-size: 0.75rem;                /* small */
    font-weight: 400;
    color: #000000;
}

.section-title-row .btn.active {
    background-color: var(--color-accent, #ffd95a);
}

/* ═══ Entry Expand/Collapse ═══ */
.entry-full-content {
    display: none;
    color: #000000;
    line-height: 1.5;
    font-size: 0.75rem;                /* small */
    margin-bottom: 0.5rem;
    white-space: pre-wrap;
    word-wrap: break-word;
}

.timeline-entry-paragraph {
    margin: 0 0 0.75rem 0;
    line-height: 1.6;
}

.timeline-entry-paragraph:last-child {
    margin-bottom: 0;
}

.timeline-inline-link {
    color: var(--seismo-accent, #000000);
    text-decoration: underline;
    font-weight: 500;
    word-break: break-all;
    transition: opacity 0.15s ease;
}

.timeline-inline-link:hover {
    opacity: 0.8;
}

/* ═══ Entry body (sanitized rich HTML reader mode) ═══ */
/* Styles the output of EmailHtmlSanitizer::sanitizeForReader(). No view consumes
   it yet (Reading Experience Phase 1 wires the render switch); defined here so
   rich tags render cleanly the moment a view adopts .entry-body. Overrides the
   pre-wrap whitespace of .entry-full-content, which suits plain text, not HTML. */
.entry-body {
    white-space: normal;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

.entry-body p {
    margin: 0 0 0.75rem 0;
    line-height: 1.6;
}

.entry-body p:last-child {
    margin-bottom: 0;
}

.entry-body a {
    color: #000000;
    text-decoration: underline;
    word-break: break-word;
}

.entry-body a:hover {
    opacity: 0.75;
}

.entry-body blockquote {
    margin: 0.75rem 0;
    padding: 0.25rem 0 0.25rem 0.75rem;
    border-left: 0.1875rem solid var(--seismo-accent, #ffd95a);
    color: #444444;
    font-style: italic;
}

.entry-body ul,
.entry-body ol {
    margin: 0 0 0.75rem 0;
    padding-left: 1.5rem;
}

.entry-body li {
    margin-bottom: 0.25rem;
    line-height: 1.6;
}

/* Same type size as surrounding card body — emphasis via weight only (bold/lists). */
.entry-body h1,
.entry-body h2,
.entry-body h3,
.entry-body h4,
.entry-body h5,
.entry-body h6 {
    margin: 0.75rem 0 0.5rem 0;
    font-size: inherit;
    line-height: inherit;
    font-weight: 700;
    color: #000000;
}

.entry-body pre {
    margin: 0.5rem 0;
    padding: 0.5rem;
    background: #f4f4f4;
    border-radius: 0.1875rem;
    overflow-x: auto;
    font-size: inherit;
    line-height: inherit;
    white-space: pre;
}

.entry-body code {
    font-family: var(--mono-font, ui-monospace, monospace);
    font-size: inherit;
    background: #f4f4f4;
    padding: 0.0625rem 0.25rem;
    border-radius: 0.125rem;
    word-wrap: break-word;
}

.entry-body pre code {
    background: none;
    padding: 0;
}

.entry-body hr {
    border: none;
    border-top: 0.0625rem solid #dddddd;
    margin: 1rem 0;
}

.entry-actions {
    display: flex;
    justify-content: space-between;
    gap: 0.625rem;
    align-items: center;
    margin-top: 0.5rem;
    padding-top: 0.625rem;
    border-top: 0.0625rem dashed #dddddd;
}

.entry-meta-right {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    flex-shrink: 0;
    white-space: nowrap;
}

.favourite-form {
    margin: 0;
    display: inline-flex;
    align-items: center;
}

.favourite-form,
.hide-entry-form {
    margin: 0;
    display: inline-flex;
    align-items: center;
}

.favourite-btn,
.hide-entry-btn {
    border: 0;
    outline: none;
    background: transparent;
    padding: 0;
    margin: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    min-height: 0;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1;
    font-family: inherit;
    color: #888888;
    opacity: 0.55;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    box-shadow: none;
    transition: opacity 0.15s ease, color 0.15s ease;
}

.favourite-btn:hover,
.favourite-btn:focus-visible,
.hide-entry-btn:hover,
.hide-entry-btn:focus-visible {
    opacity: 1;
    color: #000000;
    box-shadow: none;
    outline: none;
}

.favourite-btn.is-favourite {
    opacity: 1;
    color: #000000;
}

.hide-entry-btn {
    font-size: 1rem;
    font-weight: 300;
}

.entry-card--hiding {
    opacity: 0.45;
    pointer-events: none;
    transition: opacity 0.15s ease;
}

.entry-actions .entry-date {
    white-space: nowrap;
}

/* ═══ Search Highlight ═══ */
.search-highlight {
    background-color: #FFFFC5;
    padding: 0;
    font-weight: inherit;
}

/* ═══ Legacy (hidden) ═══ */
.floating-refresh-btn {
    display: none;
}

/* ═══ Tag Inputs (Settings) ═══ */
.feed-tag-input-wrapper {
    position: relative;
    display: flex;
    align-items: center;
}

.feed-tag-input {
    flex: 1;
    padding: 0.375rem 0.75rem;
    border: 0.125rem solid #000000;
    background-color: #ffffff;
    color: #000000;
    font-size: 0.875rem;                /* medium */
    font-family: inherit;
    font-weight: 500;
    transition: all 0.15s;
}

.feed-tag-input:hover {
    box-shadow: 0.125rem 0.125rem 0 #000000;
}

.feed-tag-input:focus {
    outline: none;
    background-color: #fafafa;
    box-shadow: 0.125rem 0.125rem 0 #000000;
}

.feed-tag-input.feed-tag-saving {
    border-color: #666666;
    background-color: #f5f5f5;
}

.feed-tag-input.feed-tag-saved {
    border-color: #00aa00;
    background-color: #f0fff0;
}

.btn-warning:active {
    transform: translate(1px, 1px);
    box-shadow: 0 0 0 #ff9900;
}

.btn-warning.active {
    transform: none;
    box-shadow: 0.0625rem 0.0625rem 0 #ff9900;
    background-color: #ffe8cc;
}

.feed-tag-indicator {
    position: absolute;
    inset-inline-end: 0.75rem;
    font-size: 0.75rem;                /* small */
    font-weight: 600;
    pointer-events: none;
    color: #000000;
}

/* ═══ Responsive ═══ */
@media (max-width: 48rem) {
    .container {
        /* Extra inline-end room for permanent tactile button shadows */
        padding: 0.75rem 0.875rem 0.75rem 0.75rem;
    }

    .top-bar {
        gap: 0.375rem;
        /* Trailing shadow on Logout / Refresh must stay inside the viewport */
        padding-inline-end: 0.125rem;
    }

    .top-bar-left {
        min-width: 0;
        overflow: hidden;
    }

    .top-bar-subtitle {
        display: none;
    }

    .top-bar-title {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 1rem;
        font-weight: 700 !important;
    }

    .desk-switcher-toggle {
        min-width: 0;
        max-width: 100%;
        overflow: hidden;
    }

    /* Version fights Refresh/Logout on narrow phones — brand alone is enough */
    .top-bar-title .top-bar-brand-version {
        display: none;
    }

    .top-bar-title .logo-icon-large {
        height: 2rem;
        width: 2rem;
    }

    .top-bar-actions {
        gap: 0.25rem;
        padding-inline-end: 0.125rem;
    }

    .top-bar-btn.top-bar-btn--text {
        padding: 0 0.5rem;
        font-size: 0.8125rem;
        min-height: 2.125rem;
    }

    .nav-menu-toggle.top-bar-btn {
        width: 2.125rem;
        height: 2.125rem;
    }

    .nav-drawer.open {
        flex-direction: column;
    }

    .nav-link {
        border-inline-end: none;
        border-bottom: 0.0625rem solid #e0e0e0;
        width: 100%;
    }

    .nav-link:last-child {
        border-bottom: none;
    }

    .add-feed-form,
    .search-form:not(.search-form--timeline-inline) {
        flex-direction: column;
    }

    .add-feed-form .feed-input,
    .search-form:not(.search-form--timeline-inline) .search-input {
        min-width: 100%;
    }

    /* Stacked “Search entries…” block — hide when the compact timeline toolbar is active */
    .dashboard-search-desktop--hide-on-mobile {
        display: none !important;
    }

    .timeline-inline-search {
        display: block;
        min-width: 0;
    }

    /* Two-row timeline toolbar: full-width search, then date + actions */
    .timeline-day-row--with-inline-search {
        flex-wrap: wrap;
        align-items: center;
        gap: 1.25rem 0.625rem;
    }

    .timeline-day-row--with-inline-search .timeline-inline-search {
        order: 1;
        flex: 1 1 100%;
        width: 100%;
        max-width: 100%;
    }

    .timeline-day-row--with-inline-search .magnitu-day-separator {
        order: 2;
        flex: 0 1 auto;
    }

    .timeline-day-row--with-inline-search .timeline-day-row-actions {
        order: 3;
        flex: 0 0 auto;
        margin-inline-start: auto;
        flex-wrap: wrap;
        justify-content: flex-end;
        gap: 0.375rem;
        max-width: 100%;
    }

    .timeline-day-row-actions .btn.entry-expand-all-btn,
    .timeline-day-row-actions .btn.timeline-media-toggle-btn,
    .timeline-day-row-actions .btn.timeline-favourites-toggle-btn,
    .timeline-day-row-actions .btn.timeline-highlights-sort-toggle-btn,
    .timeline-day-row-actions .btn.timeline-highlights-band-toggle-btn,
    .timeline-day-row-actions .btn.timeline-agenda-sort-toggle-btn {
        padding: 0.25rem 0.5rem;
    }

    /* Highlights / index toolbar: wrap instead of crushing the first pill (iOS double-chrome) */
    .timeline-day-row {
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    .timeline-day-row .timeline-day-row-actions {
        flex: 1 1 auto;
        flex-wrap: wrap;
        justify-content: flex-end;
        gap: 0.375rem;
        min-width: 0;
    }

    /* Agenda (and other multi-pill) cards: wrap pills; keep actions readable */
    .entry-card,
    .item-card {
        padding: 0.75rem !important;
    }

    .entry-header,
    .item-meta {
        align-items: flex-start;
        column-gap: 0.375rem;
        row-gap: 0.375rem;
    }

    .entry-header > .entry-tag,
    .item-meta > .entry-tag {
        flex: 0 1 auto;
        /* Prefer wrapping over crushing three Agenda pills into the score cluster */
        max-width: calc(100% - 0.25rem);
    }

    /* Agenda: reserve the top-right for hide/star/score; pills wrap in the remaining space */
    .entry-card--agenda .entry-header {
        position: relative;
        padding-inline-end: 4.75rem;
        row-gap: 0.375rem;
    }

    .entry-card--agenda .entry-header > .entry-tag {
        max-width: 100%;
    }

    .entry-card--agenda .entry-header-end {
        position: absolute;
        top: 0;
        inset-inline-end: 0;
        margin-inline-start: 0;
    }

    .entry-header-end {
        align-self: flex-start;
    }

    .timeline-day-row--expand-only.timeline-day-row--with-inline-search {
        gap: 1.25rem 0.5rem;
    }

    .timeline-day-row--expand-only.timeline-day-row--with-inline-search .timeline-inline-search {
        order: 1;
    }

    .timeline-day-row--expand-only.timeline-day-row--with-inline-search .timeline-day-row-actions {
        order: 2;
        flex: 1 1 100%;
        width: 100%;
        max-width: 100%;
        margin-inline-start: 0;
        justify-content: flex-end;
    }

    /* Beats generic .search-form { flex-wrap: wrap } if cascade/order differs on the host */
    .search-form.search-form--timeline-inline {
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        margin-bottom: 0;
        width: 100%;
    }

    .search-form--timeline-inline .search-input--timeline-inline {
        flex: 1 1 auto;
        min-width: 0 !important;
        width: auto;
    }

    .tag-filter-section {
        margin-top: 0.5rem;
    }

    .tag-filter-list {
        gap: 0.25rem;
    }

    .tag-filter-pill {
        padding: 0.1875rem 0.5rem;
    }

    .feed-actions,
    .feed-actions-top {
        flex-direction: column;
    }
}

/* ═══ Magnitu: Relevance Scoring ═══ */

/* Score badge (small number in entry header) */
.magnitu-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.75rem;
    height: 1.375rem;
    padding: 0 0.375rem;
    font-size: 0.75rem;                /* small */
    font-weight: 700;
    font-family: inherit;
    border: 0.125rem solid #000000;
    margin-inline-start: auto;
}

.magnitu-badge-investigation {
    background-color: #FF6B6B;
    color: #000000;
}

.magnitu-badge-important {
    background-color: #FFA94D;
    color: #000000;
}

.magnitu-badge-background {
    background-color: #74C0FC;
    color: #000000;
}

.magnitu-badge-noise {
    background-color: #e0e0e0;
    color: #000000;
}

/* Alert highlighting for high-score entries (if applied to card in future) */
.entry-card.magnitu-alert {
    border-color: #FF6B6B;
    border-width: 0.125rem;
    box-shadow: 0.1875rem 0.1875rem 0 #FF6B6B;
}

.entry-card.magnitu-alert:hover {
    box-shadow: 0.25rem 0.25rem 0 #FF6B6B;
}

/* Digest newsletters — nested stories inside parent card (Mail/Newsletter timeline) */
.digest-child-stories {
    margin-top: 0.75rem;
    padding-top: 0.5rem;
    border-top: 0.125rem dashed #000000;
    display: flex;
    flex-direction: column;
}

.digest-child-item {
    padding: 0.625rem 0;
    border-top: 0.125rem dashed #000000;
}

.digest-child-item:first-child {
    border-top: none;
}

.digest-child-item__head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.625rem;
}

.digest-child-item__title {
    margin: 0;
    font-size: 0.9375rem;
    font-weight: 700;
    line-height: 1.3;
}

.digest-child-item__body {
    font-size: 0.8125rem;
    color: #333333;
    margin-top: 0.25rem;
    line-height: 1.45;
}

.digest-child-item__actions {
    margin-top: 0.35rem;
}

.digest-child-item .entry-full-content {
    font-size: 0.8125rem;
    color: #333333;
    margin-top: 0.25rem;
}

.digest-child-item .magnitu-badge {
    font-size: 0.6875rem;
    padding: 0.125rem 0.375rem;
    flex-shrink: 0;
}

.entry-tag--digest-story {
    background-color: #f5f5f5;
    color: #000000;
    border: 0.0625rem solid #000000;
}

/* Score coverage indicator in section title */
.magnitu-coverage {
    font-weight: 400;
    font-size: 0.75rem;                /* small */
    color: #000000;
}

/* "Why?" button — compact, same size as expand buttons */
.btn.magnitu-why-btn {
    font-size: 0.75rem;                /* small */
    padding: 0.25rem 0.625rem;
}

/* Explanation panel (shown on "Why?" click) */
.magnitu-explanation {
    padding: 0.625rem 0.875rem;
    margin: 0.375rem 0;
    border: 0.125rem solid #000000;
    background-color: #f5f5f5;
    font-size: 0.75rem;                /* small */
}

.magnitu-explanation-label {
    font-weight: 600;
    margin-bottom: 0.375rem;
    font-size: 0.75rem;                /* small */
    color: #000000;
}

.magnitu-explanation-features {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
}

.magnitu-feature {
    display: inline-block;
    padding: 0.125rem 0.5rem;
    font-size: 0.75rem;                /* small */
    font-family: monospace;
    border: 0.125rem solid #000000;
    background-color: #ffffff;
    color: #000000;
}

.magnitu-feature-positive {
    background-color: #e6ffe6;
}

.magnitu-feature-negative {
    background-color: #ffe6e6;
}

/* Magnitu page explainer */
.magnitu-explainer {
    padding: 0.625rem 0;
    margin-bottom: 0.5rem;
    border-bottom: 0.125rem solid #000000;
}

.magnitu-explainer p {
    font-size: 0.75rem;                /* small */
    line-height: 1.6;
    margin: 0 0 0.25rem 0;
    color: #000000;
}

.magnitu-explainer p:last-child {
    margin-bottom: 0;
}

/* ═══ About page ═══ */
/* Width must stay on main.settings-container only — never body, or the nav drawer
   shares the narrow column and wraps into a broken multi-row grid. */
main.about-modern-layout {
    line-height: 1.55;
}

.about-hero h1 {
    margin-top: 0;
    font-size: 1.375rem;
    margin-bottom: 0.75rem;
}

.about-lede {
    font-size: 0.9375rem;
    margin-bottom: 0.85rem;
    color: #000000;
}

.about-meta {
    font-size: 0.75rem;
    color: #000000;
    opacity: 0.75;
    font-weight: 400;
}

/* Premium Brutalist About Card Design */
.about-card {
    border: 0.125rem solid #000000;
    background: #ffffff;
    padding: 1.5rem;
    margin-bottom: 2rem;
    box-shadow: 0.25rem 0.25rem 0 #000000;
}

.about-card h2 {
    margin-top: 0 !important;
    font-family: var(--title-font) !important;
    font-size: 1.15rem !important;
    border-bottom: 0.125rem solid #000000;
    padding-bottom: 0.5rem;
    margin-bottom: 1rem !important;
}

/* About Grid columns (Desktop/Screen only) */
.about-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
    margin-top: 1rem;
}

@media (max-width: 768px) {
    .about-grid {
        grid-template-columns: 1fr;
    }
}

.about-grid-item {
    border: 0.125rem solid #000000;
    padding: 1rem;
    background: #ffffff;
    box-shadow: 0.25rem 0.25rem 0 #000000;
}

.about-grid-item strong {
    font-family: var(--title-font);
    font-size: 0.9375rem;
    display: block;
    margin-bottom: 0.5rem;
    color: #000000;
}

.about-grid-item p {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.5;
}

/* Beautiful statistics grid */
.about-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
    margin: 1.25rem 0;
}

@media (max-width: 600px) {
    .about-stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

.about-stat-card {
    border: 0.125rem solid #000000;
    padding: 1.25rem 0.75rem;
    text-align: center;
    background: #ffffff;
    box-shadow: 0.25rem 0.25rem 0 #000000;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.about-stat-card:hover {
    transform: translate(-0.0625rem, -0.0625rem);
    box-shadow: 0.3125rem 0.3125rem 0 #000000;
}

.about-stat-number {
    font-family: var(--display-font);
    font-size: 2rem;
    font-weight: 700;
    display: block;
    color: #000000;
    line-height: 1.1;
    margin-bottom: 0.25rem;
}

.about-stat-label {
    font-family: var(--mono-font);
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #555555;
    display: block;
}

/* Scoring mix callout */
.about-scoring-callout {
    border: 0.125rem solid #000000;
    background: #ffffc5;
    padding: 0.75rem 1rem;
    margin-top: 1rem;
    display: flex;
    gap: 0.75rem;
    align-items: baseline;
    box-shadow: 0.125rem 0.125rem 0 #000000;
}

@media (max-width: 600px) {
    .about-scoring-callout {
        flex-direction: column;
        gap: 0.25rem;
    }
}

.about-scoring-callout .callout-title {
    font-family: var(--mono-font);
    font-size: 0.8125rem;
    text-transform: uppercase;
    white-space: nowrap;
    color: #000000;
}

.about-scoring-callout .callout-desc {
    margin: 0;
    font-size: 0.875rem;
    color: #000000;
}

/* Taxonomy levels alignment */
.priority-taxonomy-table td {
    vertical-align: middle !important;
}

.priority-taxonomy-table td span.magnitu-badge {
    margin: 0 auto;
}

.about-table-wrap,
.table-responsive {
    overflow-x: auto;
    margin: 0.75rem 0 1rem;
}

.about-table,
.styleguide-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
    border: 0.125rem solid #000000;
    background-color: #ffffff;
}

.about-table th,
.about-table td,
.styleguide-table th,
.styleguide-table td {
    border-bottom: 0.0625rem solid #000000;
    padding: 0.5rem 0.625rem;
    text-align: start;
    vertical-align: top;
}

.about-table thead th,
.styleguide-table thead th {
    background-color: #ffffc5;
    font-weight: 700;
    border-bottom: 0.125rem solid #000000;
}

.about-table tbody tr:last-child td,
.styleguide-table tbody tr:last-child td {
    border-bottom: none;
}

.about-table tbody tr:nth-child(even),
.styleguide-table tbody tr:nth-child(even) {
    background-color: #fafafa;
}

/* About page — settings-style narrow column (see views/about.php) */
.settings-container {
    max-width: 46rem;
    margin: 0 auto;
    padding-bottom: 2rem;
    line-height: 1.55;
}

.settings-header h1 {
    margin-top: 0;
    font-size: 1.375rem;
    margin-bottom: 0.5rem;
    color: #000000;
}

.settings-header .subtitle {
    font-size: 0.75rem;
    font-weight: 400;
    color: #000000;
    opacity: 0.85;
    margin: 0;
}

.settings-section h2 {
    font-size: 1.0625rem;
    margin-top: 1.75rem;
    margin-bottom: 0.5rem;
    padding-bottom: 0.25rem;
    border-bottom: 0.125rem solid #000000;
    color: #000000;
}

.settings-section h3.about-subheading {
    font-size: 0.9375rem;
    margin: 1.35rem 0 0.4rem;
    font-weight: 600;
    color: #000000;
    border-bottom: none;
    padding-bottom: 0;
}

.settings-header + .settings-section h2 {
    margin-top: 1.25rem;
}

.settings-section > p,
.settings-section > ul:not(.about-history) {
    margin: 0.5rem 0 1rem;
    color: #000000;
}

.settings-section > ul:not(.about-history) {
    margin-inline-start: 1.25rem;
}

.settings-section a {
    color: #000000;
    font-weight: 600;
}

.meta-text {
    font-size: 0.75rem;
    line-height: 1.55;
    color: #000000;
    opacity: 0.85;
}

.meta-text--spaced {
    margin-top: 2rem;
}

main.about-modern-layout ul:not(.about-history) {
    margin: 0.5rem 0 1rem 1.25rem;
}

.about-history {
    list-style: none;
    padding-inline-start: 0;
    margin: 0.75rem 0 1.5rem;
}

.about-history li {
    margin-bottom: 1rem;
    padding: 0.65rem 0 0.65rem 1rem;
    border-inline-start: 0.25rem solid var(--seismo-accent, #000);
    background: #fafafa;
}

/* About page — prose timeline blocks (see views/about.php) */
.about-timeline {
    margin: 0.75rem 0 1.5rem;
}

.about-timeline-entry {
    margin-bottom: 1rem;
    padding: 0.75rem 0.85rem 0.75rem 1rem;
    border-inline-start: 0.25rem solid var(--seismo-accent, #000);
    background: #fafafa;
    line-height: 1.55;
}

.about-timeline-entry:last-child {
    margin-bottom: 0;
}

.about-timeline-entry ul {
    margin: 0.5rem 0 0 1.25rem;
}

.about-footer {
    margin-top: 2.5rem;
    padding-top: 1.25rem;
    border-top: 0.125rem solid #000;
    font-size: 0.875rem;
}

.about-footer .about-meta {
    margin-top: 0.5rem;
}

/* About — keyword grid & hybrid stages (views/about.php) */
.about-detail-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
    gap: 0.625rem;
    margin: 1rem 0 0.5rem;
}

.about-detail-grid__item {
    padding: 0.5rem 0.75rem;
    border: 0.125rem solid #000000;
    background: #fafafa;
    font-size: 0.8125rem;
    font-weight: 600;
    text-align: center;
    color: #000000;
}

.about-hybrid-stage {
    margin: 0.75rem 0 1rem;
    padding: 0.85rem 1rem;
    border: 0.125rem solid #000000;
    background: #ffffff;
    line-height: 1.55;
}

.about-hybrid-stage h3 {
    font-size: 0.9375rem;
    font-weight: 700;
    margin: 0 0 0.4rem;
    color: #000000;
}

.about-hybrid-stage p {
    margin: 0;
    font-size: 0.875rem;
    color: #000000;
}

.about-hybrid-stage + .about-hybrid-stage {
    margin-top: 0.65rem;
}

/* Scraper Sources — dry-run preview (Slice: scraper preview) */
.scraper-preview-panel {
    margin-top: 1.5rem;
    padding-top: 1rem;
    border-top: 0.125rem solid #000000;
}

.scraper-preview-badge {
    display: inline-block;
    margin-inline-start: 0.35rem;
    padding: 0.1rem 0.45rem;
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    vertical-align: middle;
    border: 0.0625rem solid #000000;
    background: #f0f0f0;
}

.scraper-preview-cards {
    margin-top: 0.75rem;
}

/* ═══ Detailed Timeline & History Styles ═══ */
.about-modern-layout.settings-container {
    max-width: 54rem !important; /* Slightly wider for cards and timeline panels */
}

.detailed-timeline {
    position: relative;
    margin-top: 1.5rem;
    padding-left: 1.5rem;
    border-left: 3px solid #000;
}

.timeline-era-card {
    position: relative;
    background: #fff;
    border: 2px solid #000;
    padding: 1.5rem !important;
    margin-bottom: 2.5rem;
    box-shadow: 4px 4px 0 #000;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.timeline-era-card:hover {
    transform: translate(-2px, -2px);
    box-shadow: 6px 6px 0 #000;
}

.timeline-era-card::before {
    content: "";
    position: absolute;
    left: -1.875rem;
    top: 1.35rem;
    width: 12px;
    height: 12px;
    background: #fff;
    border: 3px solid #000;
    border-radius: 50%;
    z-index: 2;
}

.timeline-era-card h3 {
    margin-top: 0 !important;
    border-bottom: 2px solid #000;
    padding-bottom: 0.5rem;
    font-size: 1.2rem;
}

.current-version-card {
    border-color: #000;
    background: #fffdec !important;
    box-shadow: 4px 4px 0 #000;
}

.current-version-card::before {
    background: #f5f562;
}

.era-meta-row, .era-badge-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.era-badge {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border: 1px solid #000;
    padding: 2px 8px;
    background: #f0f0f0;
}

.era-badge-foundation { background: #e1f5fe; }
.era-badge-powerhouse { background: #e8f5e9; }
.era-badge-usability { background: #fff3e0; }
.era-badge-consolidation { background: #f3e5f5; }
.era-badge-satellites { background: #efebe9; }
.era-badge-ai { background: #fffdec; border-color: #b2a100; color: #6d6200; }
.era-badge-design { background: #e0f2f1; border-color: #00796b; color: #004d40; }
.era-badge-intelligence { background: #ede7f6; border-color: #5e35b1; color: #311b92; }

.era-date {
    font-size: 0.8rem;
    font-family: monospace;
    font-weight: 600;
    color: #555;
}

.era-narrative {
    font-size: 0.875rem;
    line-height: 1.6;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px dashed #ccc;
}

.era-changes h4 {
    font-size: 0.85rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 0.5rem 0;
    color: #111;
}

.era-changes ul {
    margin: 0 0 1rem 1.25rem;
    padding: 0;
    font-size: 0.85rem;
    line-height: 1.5;
}

.era-changes li {
    margin-bottom: 0.35rem;
}

.era-technical-depth {
    background: #f9f9f9;
    border-left: 3px solid #666;
    padding: 0.65rem 0.85rem;
    font-size: 0.8rem;
    line-height: 1.5;
}

.era-technical-depth strong {
    display: block;
    margin-bottom: 0.25rem;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.5px;
    color: #444;
}

.era-technical-depth p {
    margin: 0;
}

/* ═══ Proposal Section Styles ═══ */
.proposal-section {
    background: #fff;
    border: 2px solid #000;
    padding: 1.5rem !important;
    margin-bottom: 2rem;
    box-shadow: 4px 4px 0 #000;
}

.proposal-section h2 {
    margin-top: 0 !important;
    border-bottom: 2px solid #000;
    padding-bottom: 0.5rem;
    font-size: 1.2rem;
}

.proposal-details {
    margin-top: 1.25rem;
}

.proposal-block {
    margin-bottom: 1.5rem;
}

.proposal-block h3 {
    font-size: 1rem;
    font-weight: 700;
    margin: 0 0 0.5rem 0;
    color: #000;
    border-bottom: 1px solid #eee;
    padding-bottom: 0.25rem;
}

.proposal-block p {
    font-size: 0.875rem;
    line-height: 1.6;
    margin: 0 0 0.75rem 0;
}

.proposal-block ul {
    margin: 0 0 0 1.25rem;
    padding: 0;
    font-size: 0.85rem;
    line-height: 1.5;
}

.proposal-block li {
    margin-bottom: 0.35rem;
}

@media (max-width: 48rem) {
    .detailed-timeline {
        padding-left: 1rem;
    }
    .timeline-era-card::before {
        left: -1.55rem;
    }
}

/* ==========================================
   GLOBAL DESIGN SYSTEM SKIN OVERRIDES
   Upgrades all live pages to match the Styleguide
   ========================================== */

body {
    font-family: var(--sans-font), -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif !important;
    background-color: var(--color-bg) !important;
}

/* Geometrical Headings & Navigation Drawer Links */
h1, h2, h3, h4, h5, h6,
.section-title,
.admin-section-title,
.timeline-title,
.about-card-title,
.proposal-block h3,
.top-bar-title,
.top-bar-title .top-bar-brand-name,
.top-bar-title .top-bar-brand-version,
.top-bar-title .top-bar-page-title,
.nav-link,
.settings-tabs a,
.view-toggle-bar a,
.top-bar-btn,
.btn {
    font-family: var(--title-font), sans-serif !important;
}

/* Card titles withOutfit/Sans family and bold weights */
.entry-title,
.item-title,
.entry-title a,
.item-title a {
    font-family: var(--sans-font), sans-serif !important;
    font-size: 0.95rem !important;
    font-weight: 750 !important;
    line-height: 1.35 !important;
}

/* Body Copy and Previews */
.entry-content,
.item-content,
.entry-preview,
.entry-full-content {
    font-family: var(--sans-font), sans-serif !important;
    font-size: 0.8rem !important;
    line-height: 1.45 !important;
}

/* Monospace Elements & Badges */
.entry-date,
.entry-meta,
.entry-meta-right,
.entry-actions,
.card-date-stamp,
.card-metadata-mono,
.magnitu-badge,
code,
pre,
.data-table th,
.entry-lex-eu-mark,
.entry-lex-ch-mark,
.entry-tag,
.filter-pill-text,
.top-bar-subtitle {
    font-family: var(--mono-font), ui-monospace, monospace !important;
}

/* Spacious, High-End timeline cards */
.entry-card,
.item-card {
    padding: 1rem 1.25rem !important;
    transition: box-shadow 0.15s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.15s ease !important;
}

/* ==========================================
   UNIFIED BRUTALIST CLICKABLES & TRANSITIONS
   Declared last to cleanly override any legacy/duplicate selectors
   ========================================== */

/* De-clutter joined border navigation drawer box */
.nav-drawer {
    display: none;
    border: none !important;
    background: transparent !important;
    gap: 0.5rem !important;
    padding: 0.5rem 0 !important;
    margin-top: 0.5rem !important;
    margin-bottom: 1.5rem !important;
    flex-wrap: wrap !important;
}

.nav-drawer.open {
    display: flex !important;
}

.btn, .top-bar-btn, .settings-tabs a, 
.view-toggle-bar a, .nav-link, .tag-filter-pill {
    border: 0.125rem solid #000000 !important;
    border-radius: 0 !important; /* Locks sharp 90-degree tactile corners */
    font-weight: 600 !important;
    transition: transform 0.1s ease, box-shadow 0.1s ease, background-color 0.1s ease, border-color 0.1s ease !important;
    box-shadow: 0.125rem 0.125rem 0 #000000 !important; /* Premium tactile 2px shadow standard */
    cursor: pointer !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* 3D Tactile Hover Lift (Strictly no background color changes) */
.btn:hover, .top-bar-btn:hover, .settings-tabs a:hover, 
.view-toggle-bar a:hover, .nav-link:hover, .tag-filter-pill:hover {
    transform: translate(-1px, -1px) !important;
    box-shadow: 0.1875rem 0.1875rem 0 #000000 !important; /* Expanded 3px shadow */
}

/* 3D Pressed Active State (Transient) */
.btn:active, .top-bar-btn:active, .settings-tabs a:active, 
.view-toggle-bar a:active, .nav-link:active, .tag-filter-pill:active {
    transform: translate(1px, 1px) !important;
    box-shadow: 0 0 0 #000000 !important; /* Collapsed 0px shadow */
}

/* 3D Selected State (Persistent - rests flat at baseline with 1px drop shadow) */
.btn.active, .btn.is-active,
.top-bar-btn.active, 
.settings-tabs a.active, .nav-link.active,
.tag-filter-pill.active {
    transform: none !important; /* Rests on baseline */
    box-shadow: 0.0625rem 0.0625rem 0 #000000 !important; /* Maintains 1px drop shadow */
    background-color: var(--color-accent, #ffd95a) !important; /* Brand yellow accent */
    color: #000000 !important; /* High contrast black text */
}

.btn:disabled,
.btn[disabled],
.btn.btn-disabled {
    background-color: #e8e8e8 !important;
    color: #777777 !important;
    border-color: #999999 !important;
    box-shadow: none !important;
    transform: none !important;
    cursor: not-allowed !important;
    opacity: 1 !important;
    pointer-events: none !important;
}

.btn:disabled:hover,
.btn[disabled]:hover,
.btn.btn-disabled:hover,
.btn:disabled:active,
.btn[disabled]:active,
.btn.btn-disabled:active {
    transform: none !important;
    box-shadow: none !important;
    background-color: #e8e8e8 !important;
    color: #777777 !important;
}

.tag-filter-pill-active {
    transform: none !important;
    box-shadow: 0.0625rem 0.0625rem 0 #000000 !important;
    background-color: var(--color-accent, #ffd95a); /* Fallback brand yellow accent without !important */
    color: #000000 !important;
}

/* Error setting tab state */
.settings-tabs a.settings-tab--error {
    border-color: #FF2C2C !important;
    color: #FF2C2C !important;
}

.settings-tabs a.settings-tab--error:hover {
    box-shadow: 0.1875rem 0.1875rem 0 #FF2C2C !important;
}

.settings-tabs a.settings-tab--error.active {
    transform: none !important;
    box-shadow: 0.0625rem 0.0625rem 0 #FF2C2C !important;
    background-color: #FF2C2C !important;
    color: #ffffff !important;
}

/* Diagnostics main-nav error state (Action Center attention) */
.nav-link.nav-link--error {
    border-color: #FF2C2C !important;
    color: #FF2C2C !important;
}

.nav-link.nav-link--error:hover {
    box-shadow: 0.1875rem 0.1875rem 0 #FF2C2C !important;
}

.nav-link.nav-link--error.active {
    transform: none !important;
    box-shadow: 0.0625rem 0.0625rem 0 #FF2C2C !important;
    background-color: #FF2C2C !important;
    color: #ffffff !important;
}

.nav-link.nav-link--warn {
    border-color: #C47A00 !important;
    color: #C47A00 !important;
}

.nav-link.nav-link--warn:hover {
    box-shadow: 0.1875rem 0.1875rem 0 #C47A00 !important;
}

.nav-link.nav-link--warn.active {
    transform: none !important;
    box-shadow: 0.0625rem 0.0625rem 0 #C47A00 !important;
    background-color: #C47A00 !important;
    color: #ffffff !important;
}

/* Functional Override: SUCCESS */
.btn-success {
    background-color: #ffffff !important;
    color: #000000 !important;
    border-color: var(--color-success) !important;
    box-shadow: 0.0625rem 0.0625rem 0 var(--color-success) !important;
}

.btn-success:hover {
    transform: translate(-1px, -1px) !important;
    box-shadow: 0.125rem 0.125rem 0 var(--color-success) !important;
    background-color: var(--color-success-hover) !important;
}

.btn-success:active {
    transform: translate(1px, 1px) !important;
    box-shadow: 0 0 0 var(--color-success) !important;
}

.btn-success.active {
    transform: none !important;
    box-shadow: 0.0625rem 0.0625rem 0 var(--color-success) !important;
    background-color: var(--color-success-active) !important;
}

/* Functional Override: WARNING */
.btn-warning {
    background-color: #ffffff !important;
    color: #000000 !important;
    border-color: var(--color-warning) !important;
    box-shadow: 0.0625rem 0.0625rem 0 var(--color-warning) !important;
}

.btn-warning:hover {
    transform: translate(-1px, -1px) !important;
    box-shadow: 0.125rem 0.125rem 0 var(--color-warning) !important;
    background-color: var(--color-warning-hover) !important;
}

.btn-warning:active {
    transform: translate(1px, 1px) !important;
    box-shadow: 0 0 0 var(--color-warning) !important;
}

.btn-warning.active {
    transform: none !important;
    box-shadow: 0.0625rem 0.0625rem 0 var(--color-warning) !important;
    background-color: var(--color-warning-active) !important;
}

/* Functional Override: DANGER */
.btn-danger {
    background-color: #ffffff !important;
    color: #000000 !important;
    border-color: var(--color-danger) !important;
    box-shadow: 0.0625rem 0.0625rem 0 var(--color-danger) !important;
}

.btn-danger:hover {
    transform: translate(-1px, -1px) !important;
    box-shadow: 0.125rem 0.125rem 0 var(--color-danger) !important;
    background-color: var(--color-danger-hover) !important;
}

.btn-danger:active {
    transform: translate(1px, 1px) !important;
    box-shadow: 0 0 0 var(--color-danger) !important;
}

.btn-danger.active {
    transform: none !important;
    box-shadow: 0.0625rem 0.0625rem 0 var(--color-danger) !important;
    background-color: var(--color-danger-active) !important;
}

/* Brutalist Sharp Forms & Input Fields Override */
.search-input, .feed-input, select, textarea, input[type="text"], input[type="search"], input[type="password"] {
    border-radius: 0 !important; /* strict 90 degrees */
    box-shadow: none !important;
}
.search-input:hover, .feed-input:hover, select:hover, textarea:hover, input[type="text"]:hover, input[type="search"]:hover, input[type="password"]:hover {
    box-shadow: 0.125rem 0.125rem 0 #000000 !important;
}
.search-input:focus, .feed-input:focus, select:focus, textarea:focus, input[type="text"]:focus, input[type="search"]:focus, input[type="password"]:focus {
    box-shadow: 0.125rem 0.125rem 0 #000000 !important;
    background-color: #fafafa !important;
}

/* Interactive Star & Cross Action Button scaling */
.hide-entry-btn, .favourite-btn {
    transition: opacity 0.15s ease, color 0.15s ease, transform 0.10s ease !important;
}

.hide-entry-btn:hover, .favourite-btn:hover {
    transform: scale(1.15) !important;
    opacity: 1 !important;
    color: #000000 !important;
}

/* Core Monospace Pill Overrides - guarantee no specificity or font fallback overrides */
.entry-tag,
.entry-tag-text,
.entry-tag--parl,
.entry-tag--meta,
.entry-tag--feed-rss,
.entry-tag--feed-substack,
.entry-tag--feed-media,
.entry-tag--broadcast,
.entry-tag--scraper,
.entry-tag--documents,
.entry-tag--lex-source,
.entry-tag--lex-doc,
.entry-tag--leg-type,
.entry-tag--leg-council,
.entry-tag--email-sender,
.entry-tag--newsletter-sender,
.entry-tag--leg-signal,
.entry-tag--status-completed,
.entry-tag--status-cancelled,
.entry-tag--status-other,
.entry-tag--surface,
.entry-tag--emphasis,
.entry-tag--warn-pill,
.entry-lex-eu-mark,
.entry-lex-eu-mark__text,
.entry-lex-ch-mark,
.entry-lex-ch-mark__text,
.filter-pill-text,
.magnitu-badge {
    font-family: 'Space Mono', 'Fira Code', monospace !important;
    font-weight: 700 !important;
    letter-spacing: -0.01em !important;
}

/* ═══ Labeling Buttons (Magnitu-aligned) ═══ */
.label-btn {
    padding: 0.4rem 0.625rem;
    border: 2px solid #000000;
    background: #ffffff;
    color: #000000;
    font-size: 0.75rem;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
    border-radius: 0;
    transition: background-color 0.1s ease, color 0.1s ease, box-shadow 0.1s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
}

.label-btn:hover {
    box-shadow: 2px 2px 0 #000000;
}

.label-btn--inv { border-color: var(--label-investigation) !important; }
.label-btn--imp { border-color: var(--label-important) !important; }
.label-btn--bg { border-color: var(--label-background) !important; }
.label-btn--noise { border-color: var(--label-noise) !important; }

.label-btn--inv:hover,
.label-btn.active.label-btn--inv {
    background-color: var(--label-investigation) !important;
    color: #000000 !important;
}
.label-btn--imp:hover,
.label-btn.active.label-btn--imp {
    background-color: var(--label-important) !important;
    color: #000000 !important;
}
.label-btn--bg:hover,
.label-btn.active.label-btn--bg {
    background-color: var(--label-background) !important;
    color: #000000 !important;
}
.label-btn--noise:hover,
.label-btn.active.label-btn--noise {
    background-color: var(--label-noise) !important;
    color: #000000 !important;
}

/* ═══ Brutalist Custom Select & Sliders Overrides ═══ */
select.search-input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right 0.75rem center !important;
    background-size: 0.875rem !important;
    padding-right: 2.25rem !important;
    border-radius: 0 !important;
}

/* Sliders (Range Input) */
input[type="range"].search-input {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    background: transparent;
    cursor: pointer;
    border: none !important;
    box-shadow: none !important;
    padding: 0.5rem 0 !important;
}

input[type="range"].search-input:focus {
    outline: none;
    background: transparent !important;
    box-shadow: none !important;
}

input[type="range"].search-input::-webkit-slider-runnable-track {
    width: 100%;
    height: 0.5rem;
    cursor: pointer;
    background: #ffffff;
    border: 0.125rem solid #000000;
    border-radius: 0 !important;
}

input[type="range"].search-input::-moz-range-track {
    width: 100%;
    height: 0.5rem;
    cursor: pointer;
    background: #ffffff;
    border: 0.125rem solid #000000;
    border-radius: 0 !important;
}

input[type="range"].search-input::-webkit-slider-thumb {
    height: 1.25rem;
    width: 0.75rem;
    border: 0.125rem solid #000000;
    background: var(--seismo-accent, #ffd95a);
    cursor: pointer;
    -webkit-appearance: none;
    margin-top: -0.425rem; /* center on track */
    border-radius: 0 !important;
    transition: transform 0.1s ease, background-color 0.1s ease;
}

input[type="range"].search-input::-webkit-slider-thumb:hover {
    background: #000000;
    transform: scale(1.1);
}

input[type="range"].search-input::-moz-range-thumb {
    height: 1.25rem;
    width: 0.75rem;
    border: 0.125rem solid #000000;
    background: var(--seismo-accent, #ffd95a);
    cursor: pointer;
    border-radius: 0 !important;
    transition: transform 0.1s ease, background-color 0.1s ease;
}

input[type="range"].search-input::-moz-range-thumb:hover {
    background: #000000;
    transform: scale(1.1);
}

/* ═══ PRINT STYLING ═══ */
@media print {
    /* Hide interactive elements and navigation */
    .top-bar,
    header,
    footer,
    .settings-tabs,
    .about-footer,
    .toggle-styleguide-bar,
    .tabs-styleguide-bar,
    .card-actions-bar button,
    .card-header-bar span.card-action-cross,
    .card-header-bar span.card-action-star,
    .showcase-interactive,
    .btn,
    .settings-tabs a {
        display: none !important;
    }

    /* Standard container setup for print */
    body {
        background: #ffffff !important;
        color: #000000 !important;
        font-size: 10pt !important;
        line-height: 1.5 !important;
    }

    .container {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .about-modern-layout,
    .settings-container {
        border: none !important;
        box-shadow: none !important;
        padding: 0 !important;
        margin: 0 !important;
        width: 100% !important;
    }

    /* Print-specific layout grid */
    .about-grid {
        display: block !important;
    }
    
    .about-grid-item {
        margin-bottom: 1.5rem !important;
        page-break-inside: avoid !important;
    }

    /* Keep tables clean and visible in print */
    table {
        page-break-inside: auto !important;
        width: 100% !important;
        border-collapse: collapse !important;
    }
    
    tr {
        page-break-inside: avoid !important;
        page-break-after: auto !important;
    }
    
    thead {
        display: table-header-group !important;
    }

    th, td {
        border: 1px solid #000000 !important;
        padding: 0.5rem !important;
        font-size: 9pt !important;
        color: #000000 !important;
        background: none !important;
    }

    /* Heading page-breaks */
    h1, h2, h3, h4, h5, h6 {
        page-break-after: avoid !important;
        color: #000000 !important;
    }

    section,
    .about-card,
    .dashboard-section {
        border: none !important;
        box-shadow: none !important;
        padding: 1rem 0 !important;
        margin-bottom: 2rem !important;
        page-break-inside: avoid !important;
    }

    /* Priority badges style overrides for print */
    .magnitu-badge {
        border: 1px solid #000000 !important;
        box-shadow: none !important;
        background-color: transparent !important;
        color: #000000 !important;
        print-color-adjust: exact !important;
        -webkit-print-color-adjust: exact !important;
    }

    .magnitu-badge-investigation {
        background-color: #FF6B6B !important;
    }
    
    .magnitu-badge-important {
        background-color: #FFA94D !important;
    }
    
    .magnitu-badge-background {
        background-color: #74C0FC !important;
    }
    
    .magnitu-badge-noise {
        background-color: #e0e0e0 !important;
    }
    
    .pill-source {
        border: 1px solid #000000 !important;
        background-color: #f5f5f5 !important;
        color: #000000 !important;
        print-color-adjust: exact !important;
        -webkit-print-color-adjust: exact !important;
    }

    /* Example Card / Entry Card print styles */
    .showcase-card,
    .entry-card {
        border: 1px solid #000000 !important;
        box-shadow: none !important;
        background: #ffffff !important;
        page-break-inside: avoid !important;
        padding: 0.875rem 1rem !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 0.5rem !important;
    }
    .entry-header-end {
        display: inline-flex !important;
        align-items: center !important;
        gap: 0.5rem !important;
    }
    .entry-card-actions,
    .entry-expand-btn {
        display: none !important;
    }
}

/* ═══ Overhauled Filter Page Usability Styles ═══ */

/* Brutalist Switch (Toggle Slider) */
.brutalist-switch {
    position: relative;
    display: inline-block;
    width: 2.75rem;
    height: 1.5rem;
    vertical-align: middle;
}

.brutalist-switch input {
    opacity: 0;
    width: 0;
    height: 0;
    position: absolute;
}

.brutalist-slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ffffff;
    border: 0.125rem solid #000000;
    transition: background-color 0.1s ease;
}

.brutalist-slider:before {
    position: absolute;
    content: "";
    height: 0.875rem;
    width: 0.875rem;
    left: 0.1875rem;
    bottom: 0.125rem;
    background-color: #000000;
    transition: transform 0.1s ease;
}

.brutalist-switch input:checked + .brutalist-slider {
    background-color: var(--seismo-accent, #ffd95a);
}

.brutalist-switch input:checked + .brutalist-slider:before {
    transform: translateX(1.125rem);
    background-color: #000000;
}

.brutalist-switch input:focus-visible + .brutalist-slider {
    outline: 0.125rem solid #000000;
    outline-offset: 0.125rem;
}

.brutalist-switch input:disabled + .brutalist-slider {
    background-color: #f5f5f5;
    cursor: not-allowed;
    opacity: 0.6;
}

.brutalist-switch input:disabled + .brutalist-slider:before {
    background-color: #666666;
}

/* Filter Category Grid */
.filter-category-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 0.875rem;
    margin-top: 1rem;
    margin-bottom: 1.5rem;
}

.category-toggle-card {
    border: 0.125rem solid #000000;
    background-color: #ffffff;
    padding: 0.875rem;
    box-shadow: 0.1875rem 0.1875rem 0 #000000;
    transition: transform 0.1s ease, box-shadow 0.1s ease;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 0.5rem;
}

.category-toggle-card:hover {
    transform: translate(-0.0625rem, -0.0625rem);
    box-shadow: 0.25rem 0.25rem 0 #000000;
}

.category-toggle-card__main {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
}

.category-toggle-card__title {
    font-size: 1rem;
    font-weight: 700;
    color: #000000;
}

.category-toggle-card__desc {
    font-size: 0.75rem;
    color: #666666;
    line-height: 1.4;
}

/* Detailed Filters Container */
.detailed-filters-container {
    display: none;
    border-top: 0.125rem solid #000000;
    padding-top: 1rem;
    margin-top: 1rem;
}

.detailed-filters-container.is-visible {
    display: block;
}

/* Filter Toolbar Section & Header */
.filter-toolbar__section {
    margin-bottom: 1.5rem;
}

.filter-toolbar__section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 0.125rem solid #000000;
    padding-bottom: 0.5rem;
    margin-bottom: 1rem;
}

/* Customize Sources Button / Detail Toggle */
.detail-toggle-label {
    display: inline-block;
    cursor: pointer;
}

.detail-toggle-input {
    display: none;
}

.detail-toggle-btn {
    display: inline-block;
    padding: 0.375rem 0.75rem;
    border: 0.125rem solid #000000;
    background-color: #ffffff;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    box-shadow: 0.125rem 0.125rem 0 #000000;
    transition: background-color 0.1s ease, box-shadow 0.1s ease, transform 0.1s ease;
}

.detail-toggle-input:checked + .detail-toggle-btn {
    background-color: var(--seismo-accent, #ffd95a);
    box-shadow: 0.0625rem 0.0625rem 0 #000000;
    transform: translate(0.0625rem, 0.0625rem);
}

.detail-toggle-btn:hover {
    background-color: #f5f5f5;
}

.detail-toggle-input:checked + .detail-toggle-btn:hover {
    background-color: var(--seismo-accent, #ffd95a);
}

/* Row level search input & clear */
.filter-row-header-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    width: 100%;
    margin-bottom: 0.375rem;
}

.pill-search-input {
    font-size: 0.75rem !important;
    padding: 0.25rem 0.5rem !important;
    max-width: 15rem;
    border: 0.125rem solid #000000 !important;
    border-radius: 0 !important;
}

/* Relevance Score Range Slider Style */
.score-filter-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    border: 0.125rem solid #000000;
    background-color: #ffffff;
    padding: 0.75rem 1rem;
    box-shadow: 0.1875rem 0.1875rem 0 #000000;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
}

.score-filter-label {
    font-size: 0.875rem;
    font-weight: 700;
    color: #000000;
}

.score-threshold-range {
    flex: 1;
    min-width: 150px;
}

.score-threshold-value {
    font-size: 0.875rem;
    font-weight: 700;
    padding: 0.25rem 0.5rem;
    background-color: var(--seismo-accent, #ffd95a);
    border: 0.125rem solid #000000;
}






/* Diagnostics Advanced toggle */
.diag-page-toolbar {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 0.5rem;
    margin: 0 0 0.75rem;
}
.diag-page:not(.diag-advanced) .diag-advanced-only {
    display: none !important;
}
.diag-advanced-toggle-hint {
    font-size: 0.85rem;
    color: var(--text-muted, #666);
}
.diag-category-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin: 0 0 1.25rem;
}
.diag-category-nav a {
    border: 0.125rem solid #000000;
    padding: 0.35rem 0.55rem;
    color: #000000;
    background: #ffffff;
    font-size: 0.875rem;
    font-weight: 700;
    text-decoration: none;
}
.diag-category-nav a:hover {
    background: var(--seismo-accent, #ffd95a);
}
.diag-category-heading {
    margin: 1.75rem 0 0.75rem;
    padding-bottom: 0.5rem;
    border-bottom: 0.125rem solid #000000;
}
.diag-category-heading h2 {
    margin: 0;
    font-size: 1.25rem;
}
.diag-category-heading p {
    margin: 0.25rem 0 0;
    color: var(--text-muted, #666);
}
/*
 * The Diagnostics partial keeps its established PHP render blocks, while these
 * orders present the layperson categories in operational order. IDs also remain
 * stable for Action Center deep-links.
 */
.diag-page {
    display: flex;
    flex-direction: column;
}
.diag-page-toolbar,
.diag-category-nav,
#diag-action-center {
    order: 1;
}
#diag-content-gathering { order: 10; }
#diag-source-health { order: 11; }
#diag-media-fetchers { order: 12; }
#diag-agenda-fetchers { order: 13; }
#diag-core-fetchers { order: 14; }
#diag-plugins { order: 15; }
#diag-email-digests { order: 20; }
#diag-split-todo { order: 21; }
#diag-multi-layout { order: 22; }
#diag-ai-scoring { order: 30; }
#diag-ml { order: 31; }
#diag-translation-category { order: 40; }
#diag-translation { order: 41; }
#diag-server-health { order: 50; }
#diag-cron { order: 51; }
#diag-master-refresh { order: 90; }
.diag-test-section { order: 100; }

/* Scraper — category select + Gemini feedback panel (was inline in views/scraper.php) */
.category-select {
    padding: 3px 8px;
    border: 1px solid var(--color-border-light);
    border-radius: 4px;
    font-size: 0.85rem;
    max-width: 150px;
    background: var(--color-surface);
    transition: border-color 0.2s ease-in-out;
    cursor: pointer;
}
.category-select:focus {
    outline: none;
    border-color: #2563eb;
}
.gemini-feedback-box {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
    padding: 1.2rem;
    border-radius: var(--radius-md, 8px);
    background: rgba(168, 85, 247, 0.05);
    border: 1px solid rgba(168, 85, 247, 0.2);
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.02);
    transition: all 0.3s ease;
}
.gemini-feedback-title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 700;
    color: #9333ea;
    margin-bottom: 0.5rem;
    font-size: 0.95rem;
}
.gemini-feedback-text {
    font-size: 0.9rem;
    color: var(--text-color, #374151);
    line-height: 1.4;
    margin: 0;
}