/* Self-hosted typography */
@font-face {
    font-family: "CTV Josefin Sans";
    font-style: normal;
    font-display: swap;
    font-weight: 100 700;
    src: url("../fonts/vendor/josefin-sans-latin-wght-normal.woff2") format("woff2-variations");
}

@font-face {
    font-family: "CTV Literata";
    font-style: normal;
    font-display: swap;
    font-weight: 200 900;
    src: url("../fonts/vendor/literata-latin-wght-normal.woff2") format("woff2-variations");
}

@font-face {
    font-family: "CTV Literata";
    font-style: italic;
    font-display: swap;
    font-weight: 200 900;
    src: url("../fonts/vendor/literata-latin-wght-italic.woff2") format("woff2-variations");
}

/* Theme and measurement tokens */
:root {
    --font-ui: "Segoe UI Variable", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --font-heading: "CTV Josefin Sans", var(--font-ui);
    --font-reading: "CTV Literata", Georgia, Cambria, "Times New Roman", Times, serif;
    --font-body: var(--font-ui);
    --font-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;

    --size-zero: 0;
    --size-hairline: 0.0625rem;
    --size-radius-small: 0.1875rem;
    --size-radius-medium: 0.1875rem;
    --size-shell: 74rem;
    --size-reading: 52rem;
    --size-form-narrow: 30rem;
    --size-full: 100%;
    --grid-fr: 1fr;
    --grid-detail-fr: 3fr;
    --size-card-min: 15rem;
    --size-latest-min: 22rem;
    --size-footer-column-min: 14rem;
    --size-form-min: 18rem;
    --size-control-min: 7rem;
    --size-focus: 0.2rem;
    --size-shadow-y: 0.5rem;
    --size-shadow-blur: 1.5rem;
    --size-textarea-short: 8rem;
    --size-textarea-long: 24rem;
    --size-editor-min: 20rem;
    --size-media-name: 14rem;
    --size-feature-list: 10rem;
    --size-feature-latest: 4.5rem;
    --size-feature-icon-surface: 4rem;
    --size-feature-icon-max: 55%;
    --size-feature-document: 20rem;
    --size-feature-picker: 8rem;
    --ratio-feature-image: 3 / 2;
    --size-icon: 1.1rem;
    --size-icon-button: 2.25rem;
    --size-button-min: 2.25rem;
    --size-brand-logo-width: 12.5rem;
    --size-brand-logo-height: 1.75rem;
    --size-nav-icon: 1rem;
    --size-select-menu-max: 18rem;
    --size-tooltip-max: 18rem;
    --size-dialog-width: 44rem;
    --size-dialog-max-height: 85vh;
    --layer-select: 20;
    --layer-tooltip: 40;
    --duration-fast: 120ms;
    --angle-half-turn: 180deg;

    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.5rem;
    --space-6: 2rem;
    --space-7: 3rem;
    --space-8: 5rem;

    --font-size-small: 0.82rem;
    --font-size-body: 1rem;
    --font-size-lead: 1.15rem;
    --font-size-reading: 1.05rem;
    --font-size-h3: 1.3rem;
    --font-size-h2: clamp(1.7rem, 4vw, 2.5rem);
    --font-size-h1: clamp(2.3rem, 7vw, 4.6rem);
    --font-size-page-title: clamp(2rem, 5vw, 3.5rem);
    --line-height-tight: 1.05;
    --line-height-heading: 1.2;
    --line-height-body: 1.65;
    --line-height-reading: 1.75;
    --letter-spacing-eyebrow: 0.08em;

    --color-bg: #fff8f7;
    --color-surface: #ffffff;
    --color-surface-strong: #fff0ee;
    --color-text: #202127;
    --color-muted: #666a73;
    --color-border: #e7c8c5;
    --color-accent: #c9212e;
    --color-accent-strong: #9f1722;
    --color-accent-secondary: #0b6fae;
    --color-accent-text: #ffffff;
    --color-focus: #d72d3c;
    --color-danger: #a51f28;
    --color-danger-bg: #fff0ee;
    --color-success: #25633f;
    --color-success-bg: #edf8f0;
    --color-shadow: rgb(117 31 38 / 12%);

    --shadow-card: 0 var(--size-shadow-y) var(--size-shadow-blur) var(--color-shadow);
}

[data-theme="dark"] {
    --color-bg: #171315;
    --color-surface: #211a1c;
    --color-surface-strong: #302124;
    --color-text: #f5eeee;
    --color-muted: #c5b7ba;
    --color-border: #56373c;
    --color-accent: #ff747d;
    --color-accent-strong: #ff9aa1;
    --color-accent-secondary: #70c5f5;
    --color-accent-text: #2a0d11;
    --color-focus: #ff858d;
    --color-danger: #ff9b9b;
    --color-danger-bg: #3a1b1f;
    --color-success: #9dd8b4;
    --color-success-bg: #193024;
    --color-shadow: rgb(0 0 0 / 30%);
}

@media (prefers-color-scheme: dark) {
    [data-theme="system"] {
        --color-bg: #171315;
        --color-surface: #211a1c;
        --color-surface-strong: #302124;
        --color-text: #f5eeee;
        --color-muted: #c5b7ba;
        --color-border: #56373c;
        --color-accent: #ff747d;
        --color-accent-strong: #ff9aa1;
        --color-accent-secondary: #70c5f5;
        --color-accent-text: #2a0d11;
        --color-focus: #ff858d;
        --color-danger: #ff9b9b;
        --color-danger-bg: #3a1b1f;
        --color-success: #9dd8b4;
        --color-success-bg: #193024;
        --color-shadow: rgb(0 0 0 / 30%);
    }
}

/* Base elements */
* {
    box-sizing: border-box;
}

html {
    background: var(--color-bg);
}

body {
    margin: var(--size-zero);
    background: var(--color-bg);
    color: var(--color-text);
    font-family: var(--font-body);
    font-size: var(--font-size-body);
    line-height: var(--line-height-body);
}

html.ui-dialog-open,
body.ui-dialog-open {
    overflow: hidden;
}

a {
    color: var(--color-accent);
    text-decoration-thickness: var(--size-hairline);
    text-underline-offset: var(--space-1);
}

a:hover {
    color: var(--color-accent-strong);
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: var(--size-hairline) solid var(--color-focus);
    /* outline-offset: var(--space-1); */
}

button,
input,
select,
textarea {
    font: inherit;
}

button {
    cursor: pointer;
}

code {
    font-family: var(--font-mono);
}

h1,
h2,
h3,
p {
    margin-top: var(--size-zero);
}

h1,
h2,
h3 {
    font-family: var(--font-heading);
    line-height: var(--line-height-heading);
}

h1 {
    max-width: var(--size-shell);
    margin-bottom: var(--space-5);
    font-size: var(--font-size-h1);
    line-height: var(--line-height-tight);
}

h2 {
    margin-bottom: var(--space-4);
    font-size: var(--font-size-h2);
}

h3 {
    margin-bottom: var(--space-3);
    font-size: var(--font-size-h3);
}

/* Shared layout */
.site-shell {
    width: min(calc(var(--size-full) - (var(--space-5) * 2)), var(--size-shell));
    margin-inline: auto;
}

.site-header,
.site-footer {
    background: var(--color-surface);
}

.site-header {
    border-top: 0.2rem solid var(--color-accent);
    border-bottom: var(--size-hairline) solid var(--color-border);
}

.site-footer {
    border-top: var(--size-hairline) solid var(--color-border);
    color: var(--color-muted);
    font-size: var(--font-size-small);
}

.header-layout {
    display: grid;
}

.header-brand-row,
.admin-header,
.admin-actions,
.site-toolbar,
.theme-toolbar,
.account-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
}

.header-brand-row {
    padding-block: var(--space-4);
}

.brand {
    display: inline-flex;
    align-items: center;
    gap: var(--space-3);
    color: var(--color-text);
    text-decoration: none;
}

.brand-logo-frame {
    display: inline-grid;
    width: var(--size-brand-logo-width);
    height: var(--size-brand-logo-height);
    align-items: center;
}

.brand-logo {
    grid-area: 1 / 1;
    width: var(--size-brand-logo-width);
    height: var(--size-brand-logo-height);
    object-fit: contain;
    object-position: left center;
}

.brand-logo--dark {
    display: none;
}

[data-theme="dark"] .brand-logo--light {
    display: none;
}

[data-theme="dark"] .brand-logo--dark {
    display: block;
}

@media (prefers-color-scheme: dark) {
    [data-theme="system"] .brand-logo--light {
        display: none;
    }

    [data-theme="system"] .brand-logo--dark {
        display: block;
    }
}

.primary-nav {
    display: flex;
    overflow-x: auto;
    align-items: center;
    gap: var(--space-1);
    border-top: var(--size-hairline) solid var(--color-border);
    padding-block: var(--space-2);
    scrollbar-width: thin;
}

.primary-nav a {
    display: inline-flex;
    flex: none;
    align-items: center;
    gap: var(--space-2);
    border-radius: var(--size-radius-small);
    padding: var(--space-2) var(--space-3);
    color: var(--color-muted);
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}

.primary-nav a:hover,
.primary-nav a:focus-visible {
    background: var(--color-surface-strong);
    color: var(--color-accent);
}

.primary-nav__search .ui-icon {
    width: var(--size-nav-icon);
    height: var(--size-nav-icon);
}

.site-toolbar,
.theme-toolbar,
.account-toolbar {
    flex-wrap: nowrap;
    justify-content: flex-end;
    gap: var(--space-1);
}

.theme-toolbar,
.account-toolbar {
    border: var(--size-hairline) solid var(--color-border);
    border-radius: var(--size-radius-small);
    padding: var(--space-1);
    background: var(--color-surface);
}

.toolbar-form {
    display: inline-flex;
    margin: var(--size-zero);
}

.footer-layout {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(var(--size-full), var(--size-footer-column-min)), var(--grid-fr)));
    gap: var(--space-6);
    padding-block: var(--space-6);
}

.footer-publisher strong {
    display: block;
    margin-bottom: var(--space-2);
    color: var(--color-text);
    font-family: var(--font-heading);
    font-size: var(--font-size-h3);
}

.footer-publisher p,
.footer-note p {
    margin-bottom: var(--space-2);
}

.footer-publisher a,
.footer-note a {
    color: var(--color-muted);
}

.footer-publisher a:hover,
.footer-note a:hover {
    color: var(--color-accent);
}

.footer-research-note {
    margin-top: var(--space-4);
    padding-top: var(--space-3);
    border-top: var(--size-hairline) solid var(--color-border);
}

.footer-links {
    display: grid;
    align-content: start;
    gap: var(--space-2);
}

.footer-links a {
    width: fit-content;
    color: var(--color-muted);
    text-decoration: none;
}

.footer-links a:hover {
    color: var(--color-accent);
}

.footer-links strong,
.footer-note strong {
    color: var(--color-text);
}

.footer-note {
    align-self: start;
}

/* Shared controls */
input,
select,
textarea {
    width: var(--size-full);
    border: var(--size-hairline) solid var(--color-border);
    border-radius: var(--size-radius-small);
    padding: var(--space-2) var(--space-3);
    background: var(--color-bg);
    color: var(--color-text);
}

textarea {
    min-height: var(--size-textarea-short);
    resize: vertical;
}

textarea[rows="20"],
textarea[rows="24"] {
    min-height: var(--size-textarea-long);
}

.ui-button {
    display: inline-flex;
    min-height: var(--size-button-min);
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    border: var(--size-hairline) solid var(--color-border);
    border-radius: var(--size-radius-small);
    padding: var(--space-2) var(--space-4);
    background: var(--color-surface);
    color: var(--color-text);
    font-weight: 600;
    line-height: var(--line-height-heading);
    text-decoration: none;
}

.ui-button:hover {
    border-color: var(--color-accent);
    color: var(--color-accent);
}

.ui-button--primary {
    border-color: var(--color-accent);
    background: var(--color-accent);
    color: var(--color-accent-text);
}

.ui-button--primary:hover {
    border-color: var(--color-accent-strong);
    background: var(--color-accent-strong);
    color: var(--color-accent-text);
}

.ui-button--secondary {
    background: var(--color-surface);
}

.ui-button--quiet {
    min-width: var(--size-icon-button);
    border-color: transparent;
    background: transparent;
}

.ui-button--quiet:hover,
.ui-button--quiet[aria-pressed="true"] {
    border-color: var(--color-border);
    background: var(--color-surface-strong);
    color: var(--color-accent);
}

.ui-button--icon-only {
    width: var(--size-icon-button);
    min-width: var(--size-icon-button);
    padding: var(--space-2);
}

.ui-button--compact {
    min-height: auto;
    padding: var(--space-1) var(--space-2);
    font-size: var(--font-size-small);
}

.ui-button--danger {
    border-color: var(--color-danger);
    background: var(--color-danger-bg);
    color: var(--color-danger);
}

.ui-button--danger:hover {
    border-color: var(--color-danger);
    background: var(--color-danger);
    color: var(--color-accent-text);
}

.ui-icon {
    width: var(--size-icon);
    height: var(--size-icon);
    flex: none;
    object-fit: contain;
}

.ui-select__native--enhanced {
    display: none;
}

.ui-select {
    position: relative;
    width: var(--size-full);
    font-weight: 400;
}

.ui-select__button {
    display: flex;
    width: var(--size-full);
    min-height: var(--size-button-min);
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    border: var(--size-hairline) solid var(--color-border);
    border-radius: var(--size-radius-small);
    padding: var(--space-2) var(--space-3);
    background: var(--color-bg);
    color: var(--color-text);
    text-align: left;
}

.ui-select__button:hover,
.ui-select__button[aria-expanded="true"] {
    border-color: var(--color-accent);
}

.ui-select__value {
    min-width: var(--size-zero);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ui-select__arrow {
    transition: transform var(--duration-fast) ease;
}

.ui-select__button[aria-expanded="true"] .ui-select__arrow {
    transform: rotate(var(--angle-half-turn));
}

.ui-select__listbox {
    position: absolute;
    z-index: var(--layer-select);
    top: calc(var(--size-full) + var(--space-1));
    right: var(--size-zero);
    left: var(--size-zero);
    max-height: var(--size-select-menu-max);
    overflow-y: auto;
    border: var(--size-hairline) solid var(--color-border);
    border-radius: var(--size-radius-small);
    background: var(--color-surface);
    box-shadow: var(--shadow-card);
}

.ui-select__option {
    padding: var(--space-2) var(--space-3);
    color: var(--color-text);
    cursor: pointer;
}

.ui-select__option:hover,
.ui-select__option:focus,
.ui-select__option--selected {
    background: var(--color-surface-strong);
    color: var(--color-accent);
    outline: none;
}

.ui-tooltip {
    position: fixed;
    z-index: var(--layer-tooltip);
    max-width: var(--size-tooltip-max);
    border: var(--size-hairline) solid var(--color-border);
    border-radius: var(--size-radius-small);
    padding: var(--space-1) var(--space-2);
    background: var(--color-text);
    color: var(--color-bg);
    box-shadow: var(--shadow-card);
    font-size: var(--font-size-small);
    line-height: var(--line-height-heading);
    pointer-events: none;
}

.ui-dialog {
    width: min(calc(var(--size-full) - (var(--space-5) * 2)), var(--size-dialog-width));
    max-height: var(--size-dialog-max-height);
    overflow: auto;
    border: var(--size-hairline) solid var(--color-border);
    border-radius: var(--size-radius-small);
    padding: var(--size-zero);
    background: var(--color-surface);
    color: var(--color-text);
    box-shadow: var(--shadow-card);
}

.ui-dialog::backdrop {
    background: var(--color-shadow);
}

.ui-dialog__titlebar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
    border-bottom: var(--size-hairline) solid var(--color-border);
    padding: var(--space-3) var(--space-4);
    background: var(--color-surface-strong);
    cursor: move;
    user-select: none;
    touch-action: none;
}

.ui-dialog__title {
    margin: var(--size-zero);
    font-family: var(--font-heading);
    font-size: var(--font-size-h3);
}

.ui-dialog__body {
    padding: var(--space-4);
}

.ui-dialog[data-dragged="true"] {
    position: fixed;
    inset: auto;
}

/* Public editorial publication */
.brand-edition {
    border-left: var(--size-hairline) solid var(--color-border);
    padding-left: var(--space-3);
    color: var(--color-accent-secondary);
    font-size: var(--font-size-small);
    font-weight: 700;
    letter-spacing: var(--letter-spacing-eyebrow);
    text-transform: uppercase;
    white-space: nowrap;
}

.hero,
.section-hero {
    border-bottom: var(--size-hairline) solid var(--color-border);
    background: var(--color-surface-strong);
}

.section-hero__content {
    padding-block: var(--space-7);
}

.section-hero--compact .section-hero__content,
.section-hero--editorial .section-hero__content {
    padding-block: var(--space-6);
}

.eyebrow,
.story-kicker {
    color: var(--color-accent);
    font-size: var(--font-size-small);
    font-weight: 750;
    letter-spacing: var(--letter-spacing-eyebrow);
    text-transform: uppercase;
}

.eyebrow {
    margin-bottom: var(--space-3);
}

.story-kicker {
    display: inline-block;
}

.story-kicker--with-icon {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
}

.story-kicker--with-icon .ui-icon {
    width: var(--size-nav-icon);
    height: var(--size-nav-icon);
}

.hero-summary,
.section-heading p,
.publication-front__standfirst,
.publishing-heritage__lead {
    max-width: var(--size-reading);
    color: var(--color-muted);
    font-size: var(--font-size-lead);
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
    margin-top: var(--space-5);
}

.text-link {
    font-weight: 700;
    text-decoration-thickness: var(--size-hairline);
}

.section-block {
    padding-block: var(--space-7) var(--space-8);
}

.section-heading {
    margin-bottom: var(--space-6);
}

.section-heading--split,
.section-heading--rule {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-5);
    align-items: end;
    border-bottom: var(--size-hairline) solid var(--color-border);
    padding-bottom: var(--space-4);
}

.section-heading--split p,
.section-heading--rule p {
    margin-bottom: var(--size-zero);
}

/* Public publisher information */
.info-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(var(--size-full), var(--size-card-min)), var(--grid-fr)));
    gap: var(--space-5);
}

.info-grid--two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.info-card {
    min-width: 0;
    border: var(--size-hairline) solid var(--color-border);
    border-radius: var(--size-radius-medium);
    padding: var(--space-5);
    background: var(--color-surface);
}

.info-card h2 {
    margin-bottom: var(--space-3);
    font-size: var(--font-size-h3);
}

.info-card p:last-child,
.info-card ul:last-child {
    margin-bottom: var(--size-zero);
}

.info-list {
    padding-left: var(--space-5);
}

.info-list li + li {
    margin-top: var(--space-2);
}

.info-placeholder {
    border-left: 0.2rem solid var(--color-accent-secondary);
    padding-left: var(--space-3);
}

.info-section--ruled {
    border-top: var(--size-hairline) solid var(--color-border);
}

.contact-address {
    margin-bottom: var(--space-4);
    font-style: normal;
}

.public-form {
    position: relative;
    display: grid;
    gap: var(--space-3);
    margin-top: var(--space-5);
    border-top: var(--size-hairline) solid var(--color-border);
    padding-top: var(--space-5);
}

.form-trap {
    position: absolute;
    left: -10000px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.subscription-heading {
    align-items: end;
}

.subscription-list {
    display: grid;
    gap: var(--space-4);
}

.subscription-card {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(18rem, 0.85fr);
    gap: var(--space-6);
    align-items: start;
}

.subscription-card--other {
    border-style: dashed;
}

.subscription-card h3 {
    margin-bottom: var(--space-2);
    font-size: var(--font-size-h3);
}

.subscription-edition {
    margin-bottom: var(--space-3);
    color: var(--color-muted);
    font-size: var(--font-size-small);
}

.subscription-description {
    max-width: var(--size-reading);
    margin-bottom: var(--space-3);
}

.subscription-actions,
.subscription-trial-links {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2) var(--space-4);
}

.subscription-card__rates {
    border-left: var(--size-hairline) solid var(--color-border);
    padding-left: var(--space-5);
}

.subscription-table {
    width: 100%;
    border-collapse: collapse;
}

.subscription-table th,
.subscription-table td {
    border-bottom: var(--size-hairline) solid var(--color-border);
    padding: var(--space-2) var(--space-3);
    text-align: left;
}

.subscription-table th:last-child,
.subscription-table td:last-child {
    text-align: right;
}

.subscription-note {
    margin-top: var(--space-3);
    margin-bottom: var(--size-zero);
}

@media (max-width: 48rem) {
    .info-grid--two,
    .subscription-card {
        grid-template-columns: 1fr;
    }

    .subscription-card__rates {
        border-left: var(--size-zero);
        border-top: var(--size-hairline) solid var(--color-border);
        padding-top: var(--space-4);
        padding-left: var(--size-zero);
    }
}

/* Front page */
.publication-front {
    border-bottom: var(--size-hairline) solid var(--color-border);
    background:
        linear-gradient(120deg, var(--color-surface-strong), var(--color-surface) 58%, var(--color-bg));
}

.publication-front__grid {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(22rem, 1.1fr);
    gap: clamp(var(--space-6), 6vw, var(--space-8));
    align-items: start;
    min-height: 34rem;
    padding-block: var(--space-7);
}

.publication-front__intro h1 {
    max-width: 12ch;
    margin-bottom: var(--space-4);
    font-size: clamp(3rem, 7vw, 6.2rem);
    line-height: 0.94;
    letter-spacing: -0.035em;
}

.publication-front__standfirst {
    max-width: 40rem;
    margin-bottom: var(--size-zero);
}

.lead-story {
    position: relative;
    min-width: 0;
    border-top: 0.25rem solid var(--color-accent);
    border-bottom: var(--size-hairline) solid var(--color-border);
    background: var(--color-surface);
    box-shadow: var(--shadow-card);
}

.lead-story__link {
    display: grid;
    color: var(--color-text);
    text-decoration: none;
}

.lead-story__visual {
    display: grid;
    place-items: center;
    overflow: hidden;
    width: 100%;
    aspect-ratio: 16 / 9;
    background: var(--color-surface-strong);
}

.lead-story__visual img,
.editorial-card__visual img,
.publication-card__visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.lead-story__visual--icon .ui-icon,
.editorial-card__visual--icon .ui-icon,
.publication-card__visual--icon .ui-icon {
    width: 4rem;
    height: 4rem;
}

.lead-story__copy {
    display: grid;
    gap: var(--space-2);
    padding: var(--space-5);
}

.lead-story__title {
    font-family: var(--font-heading);
    font-size: clamp(1.8rem, 4vw, 3rem);
    line-height: var(--line-height-heading);
}

.lead-story__summary {
    color: var(--color-muted);
    font-family: var(--font-reading);
    font-size: var(--font-size-reading);
    line-height: 1.55;
}

.story-date {
    color: var(--color-muted);
    font-size: var(--font-size-small);
}

.lead-story__link:hover .lead-story__title,
.editorial-card a:hover strong,
.publication-card__link:hover .publication-card__title {
    color: var(--color-accent);
}

.lead-story--text-only .lead-story__copy,
.lead-story--empty {
    min-height: 24rem;
    align-content: end;
    padding: var(--space-6);
    background:
        linear-gradient(155deg, transparent 0 48%, var(--color-surface-strong) 48% 100%),
        var(--color-surface);
}

.editorial-section {
    border-bottom: var(--size-hairline) solid var(--color-border);
}

.editorial-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-5);
}

.editorial-card {
    min-width: 0;
    border-bottom: var(--size-hairline) solid var(--color-border);
}

.editorial-card a {
    display: grid;
    height: 100%;
    color: var(--color-text);
    text-decoration: none;
}

.editorial-card__visual {
    display: grid;
    place-items: center;
    overflow: hidden;
    aspect-ratio: 3 / 2;
    border-bottom: var(--size-hairline) solid var(--color-border);
    background: var(--color-surface-strong);
}

.editorial-card__copy {
    display: grid;
    gap: var(--space-2);
    align-content: start;
    padding-block: var(--space-4);
}

.editorial-card__copy strong {
    font-family: var(--font-heading);
    font-size: var(--font-size-h3);
    line-height: var(--line-height-heading);
}

.editorial-card__copy > span:last-child:not(.story-kicker) {
    color: var(--color-muted);
    font-family: var(--font-reading);
    font-size: 0.95rem;
    line-height: 1.55;
}

.editorial-card--text-only {
    border-top: 0.25rem solid var(--color-accent);
}

.editorial-card--text-only .editorial-card__copy {
    padding: var(--space-4);
    background: var(--color-surface);
}

/* Publishing ecosystem */
.publishing-heritage {
    padding-block: var(--space-8);
    background:
        linear-gradient(180deg, var(--color-surface-strong), var(--color-bg));
}

.publishing-heritage__intro {
    display: grid;
    grid-template-columns: minmax(8rem, 12rem) minmax(0, var(--size-reading));
    gap: var(--space-6);
    align-items: center;
    margin-bottom: var(--space-7);
}

.publishing-heritage__badge-wrap {
    display: grid;
    place-items: center;
}

.publishing-heritage__badge {
    width: min(100%, 11rem);
    height: auto;
    mix-blend-mode: multiply;
}

[data-theme="dark"] .publishing-heritage__badge {
    mix-blend-mode: screen;
    opacity: 0.82;
}

@media (prefers-color-scheme: dark) {
    [data-theme="system"] .publishing-heritage__badge {
        mix-blend-mode: screen;
        opacity: 0.82;
    }
}

.publishing-heritage__intro h2 {
    max-width: 18ch;
    margin-bottom: var(--space-3);
}

.ecosystem-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-5);
}

.ecosystem-card {
    display: grid;
    grid-template-rows: auto 1fr;
    gap: var(--space-3);
    min-width: 0;
}

.ecosystem-card__image {
    display: block;
    overflow: hidden;
    aspect-ratio: 5 / 6;
    border: var(--size-hairline) solid var(--color-border);
    border-radius: var(--size-radius-medium);
    background: var(--color-surface);
    box-shadow: var(--shadow-card);
}

.ecosystem-card__image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: top center;
    transition: transform var(--duration-fast) ease;
}

.ecosystem-card__image--wide img {
    object-position: center;
}

.ecosystem-card__image:hover img {
    transform: scale(1.015);
}

.ecosystem-card__copy {
    display: grid;
    gap: var(--space-3);
    align-content: start;
    min-height: 100%;
    border: var(--size-hairline) solid var(--color-border);
    border-top: 0.2rem solid var(--color-accent);
    border-radius: var(--size-radius-medium);
    padding: var(--space-5);
    background: var(--color-surface);
    box-shadow: var(--shadow-card);
}

.ecosystem-card__copy h3,
.ecosystem-card__copy p {
    margin-bottom: var(--size-zero);
}

.ecosystem-card__copy p {
    color: var(--color-muted);
}

.ecosystem-card__links {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
}

.ecosystem-card__copy a,
.ecosystem-card__links a {
    font-weight: 700;
}

/* Dormant section landing support */
.research-grid,
.section-link-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(var(--size-full), var(--size-card-min)), var(--grid-fr)));
    gap: var(--space-4);
}

.research-card,
.section-link-card {
    display: grid;
    align-content: start;
    gap: var(--space-2);
    border: var(--size-hairline) solid var(--color-border);
    border-radius: var(--size-radius-medium);
    padding: var(--space-5);
    background: var(--color-surface);
    color: var(--color-text);
    text-decoration: none;
}

.research-card:hover,
.section-link-card:hover {
    border-color: var(--color-accent);
    color: var(--color-text);
    box-shadow: var(--shadow-card);
}

.research-card__label {
    color: var(--color-accent);
    font-size: var(--font-size-small);
    font-weight: 700;
    letter-spacing: var(--letter-spacing-eyebrow);
    text-transform: uppercase;
}

.research-card strong,
.section-link-card strong {
    font-family: var(--font-heading);
    font-size: var(--font-size-h3);
    line-height: var(--line-height-heading);
}

.research-card > span:last-child,
.section-link-card span {
    color: var(--color-muted);
}

.research-callout {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(var(--size-full), var(--size-card-min)), var(--grid-fr)));
    gap: var(--space-5);
    align-items: center;
}

.research-callout > .ui-button {
    justify-self: start;
}

.research-callout p:last-child {
    max-width: var(--size-reading);
    margin-bottom: var(--size-zero);
    color: var(--color-muted);
}

.empty-state {
    color: var(--color-muted);
}

.empty-state--panel,
.empty-state--section {
    display: grid;
    gap: var(--space-2);
    border: var(--size-hairline) solid var(--color-border);
    border-radius: var(--size-radius-medium);
    padding: var(--space-5);
    background: var(--color-surface);
}

.empty-state strong {
    color: var(--color-text);
}

/* Article and Coming Soon indexes */
.page-title {
    max-width: 18ch;
    font-size: var(--font-size-page-title);
}

.publication-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 var(--space-6);
}

.publication-card {
    min-width: 0;
    border-bottom: var(--size-hairline) solid var(--color-border);
}

.publication-card--lead {
    grid-column: 1 / -1;
    border-top: 0.25rem solid var(--color-accent);
}

.publication-card__link {
    display: grid;
    grid-template-columns: minmax(10rem, 0.7fr) minmax(0, 1.3fr);
    gap: var(--space-5);
    align-items: center;
    padding-block: var(--space-5);
    color: var(--color-text);
    text-decoration: none;
}

.publication-card--lead .publication-card__link {
    grid-template-columns: minmax(16rem, 1fr) minmax(0, 1fr);
    padding-block: var(--space-6);
}

.publication-card--text-only .publication-card__link {
    grid-template-columns: 1fr;
}

.publication-card__visual {
    display: grid;
    place-items: center;
    overflow: hidden;
    width: 100%;
    aspect-ratio: 3 / 2;
    background: var(--color-surface-strong);
}

.publication-card__copy {
    display: grid;
    gap: var(--space-2);
    min-width: 0;
}

.publication-card__title {
    font-family: var(--font-heading);
    font-size: clamp(1.4rem, 2.7vw, 2rem);
    line-height: var(--line-height-heading);
}

.publication-card--lead .publication-card__title {
    font-size: clamp(2rem, 4vw, 3.25rem);
}

.publication-card__summary {
    color: var(--color-muted);
    font-family: var(--font-reading);
    line-height: 1.6;
}

.publication-card__meta,
.meta-line,
.field-help {
    color: var(--color-muted);
    font-size: var(--font-size-small);
}

/* Long-form editorial detail */
.legal-document {
    padding-block: var(--space-7) var(--space-8);
}

.document-header {
    max-width: 64rem;
    margin-bottom: var(--space-6);
}

.document-header--editorial {
    border-bottom: var(--size-hairline) solid var(--color-border);
    padding-bottom: var(--space-6);
}

.document-header__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    margin-bottom: var(--space-4);
}

.document-admin-actions {
    margin-top: var(--space-3);
}

.document-header__meta .eyebrow,
.document-header__meta .meta-line {
    margin-bottom: var(--size-zero);
}

.document-eyebrow {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.document-eyebrow .ui-icon {
    width: var(--size-nav-icon);
    height: var(--size-nav-icon);
}

.document-title {
    max-width: 21ch;
    margin-bottom: var(--space-3);
    font-size: clamp(2.5rem, 6vw, 4rem);
    line-height: 1.02;
    letter-spacing: -0.025em;
}

.document-deckline {
    margin-bottom: var(--space-5);
    color: var(--color-muted);
    font-family: var(--font-reading);
    font-size: var(--font-size-lead);
}

.document-feature-visual {
    display: grid;
    place-items: center;
    overflow: hidden;
    width: min(100%, 64rem);
    aspect-ratio: 16 / 9;
    margin-top: var(--space-5);
    background: var(--color-surface-strong);
}

.document-feature-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.document-feature-visual--icon {
    width: min(100%, 18rem);
    aspect-ratio: 3 / 2;
}

.document-feature-visual--icon .ui-icon {
    width: 4rem;
    height: 4rem;
}

.publisher-contact-strip {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(9rem, 0.85fr) minmax(12rem, 1.2fr) minmax(10rem, 0.75fr);
    gap: var(--space-5);
    width: min(100%, 64rem);
    border: var(--size-hairline) solid var(--color-border);
    border-top: 0;
    padding: var(--space-4) var(--space-5);
    background: var(--color-surface);
}

.publisher-contact-strip strong,
.publisher-contact-strip p {
    margin: var(--size-zero);
}

.publisher-contact-strip__publisher,
.publisher-contact-strip__open,
.publisher-contact-strip__links {
    display: grid;
    align-content: start;
    gap: var(--space-2);
}

.publisher-contact-strip__brand {
    color: var(--color-accent);
    font-family: var(--font-heading);
    font-size: var(--font-size-lead);
    letter-spacing: 0.03em;
}

.publisher-contact-strip__publisher p {
    color: var(--color-muted);
    font-size: var(--font-size-small);
    line-height: 1.45;
}

.publisher-contact-strip__open > strong {
    color: var(--color-muted);
}

.publisher-contact-strip__open a {
    color: var(--color-accent-secondary);
}

.publisher-contact-strip__group {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: var(--space-3);
    align-items: start;
}

.publisher-contact-strip__icon {
    display: grid;
    place-items: center;
    width: 2.75rem;
    height: 2.75rem;
    border: var(--size-hairline) solid var(--color-border);
    border-radius: 50%;
    background: var(--color-surface-strong);
}

.publisher-contact-strip__icon .ui-icon {
    width: 1.45rem;
    height: 1.45rem;
}

.publisher-contact-strip__network a,
.publisher-contact-strip__phone a {
    width: fit-content;
    color: var(--color-accent);
    font-weight: 650;
}

.publisher-contact-strip a:hover {
    color: var(--color-accent-strong);
}

.document-layout {
    display: grid;
    grid-template-columns: minmax(0, var(--size-reading)) minmax(12rem, 16rem);
    gap: clamp(var(--space-5), 6vw, var(--space-8));
    align-items: start;
}

.document-main {
    min-width: 0;
}

.document-section {
    margin-bottom: var(--space-6);
}

.document-section > h2 {
    border-bottom: var(--size-hairline) solid var(--color-border);
    padding-bottom: var(--space-3);
}

.document-summary,
.document-body {
    font-family: var(--font-reading);
    font-size: var(--font-size-reading);
    line-height: var(--line-height-reading);
}

.document-summary {
    border-left: var(--size-focus) solid var(--color-accent);
    margin-bottom: var(--space-6);
    padding-left: var(--space-4);
    color: var(--color-muted);
    font-size: var(--font-size-lead);
}

.document-body p,
.document-summary p {
    margin-bottom: var(--space-4);
}

.document-body img,
.document-summary img {
    max-width: var(--size-full);
    height: auto;
}

.document-body table,
.document-summary table {
    width: var(--size-full);
    border-collapse: collapse;
    margin-bottom: var(--space-5);
}

.document-body th,
.document-body td,
.document-summary th,
.document-summary td {
    border: var(--size-hairline) solid var(--color-border);
    padding: var(--space-2) var(--space-3);
    text-align: left;
    vertical-align: top;
}

.document-body blockquote,
.document-summary blockquote {
    margin: var(--space-4) var(--size-zero);
    border-left: var(--size-focus) solid var(--color-border);
    padding-left: var(--space-4);
    color: var(--color-muted);
}

.document-body figure,
.document-summary figure {
    margin: var(--space-5) var(--size-zero);
}

.document-body figcaption,
.document-summary figcaption {
    margin-top: var(--space-2);
    color: var(--color-muted);
    font-size: var(--font-size-small);
}

.document-rail {
    position: sticky;
    top: var(--space-5);
    display: grid;
    gap: var(--space-5);
}

.document-rail__note {
    border-top: var(--size-hairline) solid var(--color-border);
    padding-top: var(--space-4);
    color: var(--color-muted);
    font-size: var(--font-size-small);
}

.document-rail__note p {
    margin-top: var(--space-2);
    margin-bottom: var(--size-zero);
}

.coming-soon-banner {
    display: inline-block;
    margin-bottom: var(--space-4);
    border-left: 0.25rem solid var(--color-accent);
    padding: var(--space-2) var(--space-3);
    background: var(--color-surface-strong);
    color: var(--color-accent-strong);
    font-weight: 700;
}

.case-meta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--size-zero) var(--space-5);
    max-width: 64rem;
    margin: var(--space-5) var(--size-zero) var(--size-zero);
    border-top: var(--size-hairline) solid var(--color-border);
}

.case-meta div {
    display: grid;
    grid-template-columns: minmax(7rem, 0.65fr) minmax(0, 1.35fr);
    gap: var(--space-3);
    border-bottom: var(--size-hairline) solid var(--color-border);
    padding-block: var(--space-3);
}

.case-meta dt {
    color: var(--color-muted);
    font-weight: 700;
}

.case-meta dd {
    margin: var(--size-zero);
}

.source-panel {
    border-top: var(--size-hairline) solid var(--color-border);
    padding-top: var(--space-5);
}

/* Share controls */
.share-tools {
    display: grid;
    gap: var(--space-3);
}

.share-tools__label {
    margin-bottom: var(--size-zero);
    color: var(--color-text);
    font-size: var(--font-size-small);
    font-weight: 750;
    letter-spacing: var(--letter-spacing-eyebrow);
    text-transform: uppercase;
}

.share-tools__items {
    display: grid;
    grid-template-columns: repeat(4, var(--size-icon-button));
    gap: var(--space-2);
}

.share-tool {
    display: grid;
    width: var(--size-icon-button);
    height: var(--size-icon-button);
    place-items: center;
    margin: var(--size-zero);
    border: var(--size-hairline) solid var(--color-border);
    border-radius: var(--size-radius-small);
    padding: var(--space-1);
    background: var(--color-surface);
    color: var(--color-text);
    cursor: pointer;
    text-decoration: none;
}

.share-tool:hover,
.share-tool:focus-visible {
    border-color: var(--color-accent);
    background: var(--color-surface-strong);
}

.share-icon {
    display: inline-grid;
    width: 1.35rem;
    height: 1.35rem;
}

.share-icon__image {
    grid-area: 1 / 1;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.share-icon__image--dark {
    display: none;
}

[data-theme="dark"] .share-icon__image--light {
    display: none;
}

[data-theme="dark"] .share-icon__image--dark {
    display: block;
}

@media (prefers-color-scheme: dark) {
    [data-theme="system"] .share-icon__image--light {
        display: none;
    }

    [data-theme="system"] .share-icon__image--dark {
        display: block;
    }
}

.share-tools__hint,
.share-tools__status {
    margin-bottom: var(--size-zero);
    color: var(--color-muted);
    font-size: 0.75rem;
    line-height: 1.45;
}

.share-tools__status:empty {
    display: none;
}

/* Responsive editorial layout */
@media (max-width: 62rem) {
    .publisher-contact-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .publication-front__grid,
    .document-layout {
        grid-template-columns: 1fr;
    }

    .publication-front__grid {
        min-height: 0;
    }

    .publication-front__intro h1 {
        max-width: 14ch;
    }

    .document-rail {
        position: static;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        border-top: var(--size-hairline) solid var(--color-border);
        padding-top: var(--space-5);
    }

    .ecosystem-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 44rem) {
    .publisher-contact-strip {
        grid-template-columns: 1fr;
        gap: var(--space-4);
        padding-inline: var(--space-4);
    }

    .brand-edition {
        display: none;
    }

    .publication-front__intro h1 {
        font-size: clamp(2.7rem, 14vw, 4rem);
    }

    .editorial-grid,
    .publication-list,
    .ecosystem-grid,
    .case-meta,
    .publishing-heritage__intro,
    .document-rail {
        grid-template-columns: 1fr;
    }


    .publication-card,
    .publication-card--lead {
        grid-column: auto;
    }

    .publication-card__link,
    .publication-card--lead .publication-card__link {
        grid-template-columns: 1fr;
    }

    .section-heading--split,
    .section-heading--rule {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .publishing-heritage__badge-wrap {
        justify-items: start;
    }

    .publishing-heritage__badge {
        width: 7rem;
    }


    .document-title {
        font-size: clamp(2.3rem, 11vw, 3.5rem);
    }

    .case-meta div {
        grid-template-columns: 1fr;
        gap: var(--space-1);
    }
}

/* Administrator interface */
.admin-shell {
    padding-block: var(--space-6) var(--space-8);
}

.admin-header {
    margin-bottom: var(--space-5);
}

.admin-heading {
    margin-bottom: var(--size-zero);
    font-size: var(--font-size-h2);
}

.admin-actions {
    justify-content: flex-start;
}

.admin-toolbar {
    margin-bottom: var(--space-4);
}

.admin-panel,
.publish-panel,
.preview-banner {
    border: var(--size-hairline) solid var(--color-border);
    border-radius: var(--size-radius-medium);
    background: var(--color-surface);
}

.admin-panel {
    padding: var(--space-5);
}

.admin-editorial-guide {
    margin-bottom: var(--space-5);
}

.admin-editorial-guide h2 {
    margin-bottom: var(--space-3);
}

.admin-editorial-guide h3 {
    margin-bottom: var(--space-2);
    font-size: var(--font-size-h4);
}

.admin-editorial-guide__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(var(--size-full), var(--size-card-min)), var(--grid-fr)));
    gap: var(--space-5);
    margin-top: var(--space-4);
}

.admin-editorial-guide__grid ul {
    margin-bottom: var(--size-zero);
}

.admin-editorial-guide__gate {
    margin-top: var(--space-4);
    border-top: var(--size-hairline) solid var(--color-border);
    padding-top: var(--space-4);
}

.admin-editorial-guide__gate p:last-child {
    margin-bottom: var(--size-zero);
}

.admin-editorial-example {
    margin-top: var(--space-5);
    border-top: var(--size-hairline) solid var(--color-border);
    padding-top: var(--space-5);
}

.admin-editorial-example__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(var(--size-full), var(--size-card-min)), var(--grid-fr)));
    gap: var(--space-5);
    align-items: start;
    margin-top: var(--space-3);
}

.admin-editorial-example__article {
    border: var(--size-hairline) solid var(--color-border);
    border-radius: var(--size-radius-medium);
    padding: var(--space-4);
    background: var(--color-bg);
}

.admin-editorial-example__article p:last-child {
    margin-bottom: var(--size-zero);
}

.admin-editorial-example__note {
    margin-top: var(--space-4);
    margin-bottom: var(--size-zero);
}

.narrow-panel {
    max-width: var(--size-form-narrow);
}

.form-stack {
    display: grid;
    gap: var(--space-5);
}

.form-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(var(--size-full), var(--size-form-min)), var(--grid-fr)));
    gap: var(--space-4);
}

.field-label {
    display: grid;
    align-content: start;
    gap: var(--space-2);
    font-weight: 700;
}

.subscription-admin-group + .subscription-admin-group {
    border-top: var(--size-hairline) solid var(--color-border);
    padding-top: var(--space-5);
}

.subscription-admin-table .price-input {
    min-width: 8rem;
}

.ui-yes-no {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
}

.ui-yes-no__native {
    width: auto;
}

.ui-yes-no__control {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    border: var(--size-hairline) solid transparent;
    border-radius: var(--size-radius-small);
    padding: var(--space-1) var(--space-2);
    background: transparent;
    color: var(--color-text);
    font: inherit;
    cursor: pointer;
}

.ui-yes-no__control:hover,
.ui-yes-no__control:focus-visible {
    border-color: var(--color-border);
    background: var(--color-surface-strong);
    outline: none;
}

.ui-yes-no__control[aria-invalid="true"] {
    border-color: var(--color-danger);
}

.ui-yes-no__control:disabled {
    cursor: default;
    opacity: 0.55;
}

.ui-yes-no__control .ui-icon {
    width: var(--size-icon-button);
    height: var(--size-icon-button);
}

.ui-yes-no__state {
    min-width: 2.25rem;
    font-weight: 700;
}

.ui-yes-no__label {
    font-weight: 600;
    cursor: pointer;
}

.ui-yes-no--enhanced .ui-yes-no__native {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

.presentation-disclosure {
    border: var(--size-hairline) solid var(--color-border);
    border-radius: var(--size-radius-small);
    background: var(--color-bg);
}

.presentation-disclosure__summary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    padding: var(--space-3) var(--space-4);
    cursor: pointer;
    font-weight: 700;
}

.presentation-disclosure__summary:hover,
.presentation-disclosure__summary:focus-visible {
    color: var(--color-accent);
}

.presentation-disclosure__status {
    color: var(--color-muted);
    font-size: var(--font-size-small);
    font-weight: 600;
}

.presentation-disclosure[open] .presentation-disclosure__summary {
    border-bottom: var(--size-hairline) solid var(--color-border);
    background: var(--color-surface);
}

.presentation-field {
    display: grid;
    gap: var(--space-3);
    margin: var(--size-zero);
    border: var(--size-zero);
    padding: var(--space-4);
}

.presentation-field legend {
    margin-bottom: var(--space-2);
    padding: var(--size-zero);
    font-weight: 700;
}

.feature-image-options,
.feature-icon-options {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(var(--size-full), var(--size-card-min)), var(--grid-fr)));
    gap: var(--space-3);
}

.feature-image-option,
.feature-icon-option {
    display: grid;
    gap: var(--space-2);
    align-content: start;
    border: var(--size-hairline) solid var(--color-border);
    border-radius: var(--size-radius-medium);
    padding: var(--space-3);
    background: var(--color-bg);
    cursor: pointer;
    font-weight: 600;
}

.feature-image-option:has(input:checked),
.feature-icon-option:has(input:checked) {
    border-color: var(--color-accent);
    box-shadow: inset var(--size-focus) var(--size-zero) var(--size-zero) var(--color-accent);
}

.feature-image-option img {
    width: var(--size-feature-picker);
    max-width: var(--size-full);
    aspect-ratio: var(--ratio-feature-image);
    object-fit: cover;
    border-radius: var(--size-radius-small);
}

.feature-image-auto-option {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-weight: 600;
}

.feature-icon-option {
    grid-template-columns: auto var(--grid-fr);
    align-items: center;
}

.feature-icon-option input {
    grid-column: 1 / -1;
}

.feature-icon-preview {
    display: grid;
    place-items: center;
    width: var(--size-icon-button);
    height: var(--size-icon-button);
    border-radius: var(--size-radius-small);
    background: var(--color-surface-strong);
}

.field-help {
    font-weight: 400;
}

.wide-field {
    grid-column: 1 / -1;
}

.rich-field {
    font-weight: 400;
}

.rich-field > span:first-child {
    font-weight: 700;
}

.rich-editor-frame {
    overflow: hidden;
    border: var(--size-hairline) solid var(--color-border);
    border-radius: var(--size-radius-small);
    background: var(--color-bg);
    box-shadow: var(--shadow-card);
}

.rich-editor-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
    border-bottom: var(--size-hairline) solid var(--color-border);
    padding: var(--space-2);
    background: var(--color-surface);
}

.rich-editor-toolgroup {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-1);
    border: var(--size-hairline) solid var(--color-border);
    border-radius: var(--size-radius-small);
    padding: var(--space-1);
    background: var(--color-surface-strong);
}

.rich-editor-toolgroup--feature {
    border-color: var(--color-accent);
    background: var(--color-surface);
}

.rich-editor-toolgroup--utility {
    margin-left: auto;
}

.editor-tool {
    display: inline-flex;
    min-height: var(--size-button-min);
    align-items: center;
    justify-content: center;
    gap: var(--space-1);
    border: var(--size-hairline) solid transparent;
    border-radius: var(--size-radius-small);
    padding: var(--space-1) var(--space-3);
    background: transparent;
    color: var(--color-text);
    font: inherit;
    font-size: var(--font-size-small);
    font-weight: 650;
    line-height: var(--line-height-heading);
    cursor: pointer;
}

.editor-tool:hover {
    border-color: var(--color-border);
    background: var(--color-surface);
    color: var(--color-accent-strong);
    box-shadow: var(--shadow-card);
}

.editor-tool:focus-visible {
    outline: var(--size-hairline) solid var(--color-focus);
    outline-offset: var(--space-1);
}

.editor-tool:active {
    border-color: var(--color-accent);
    background: var(--color-surface);
    color: var(--color-accent-strong);
}

.editor-tool--compact {
    min-width: var(--size-icon-button);
    padding-inline: var(--space-2);
}

.editor-tool--quiet {
    color: var(--color-text-muted);
    font-weight: 600;
}

.rich-editor-source {
    min-height: var(--size-editor-min);
    border: var(--size-zero);
    border-radius: var(--size-zero);
}

.rich-editor-source-enhanced {
    display: none;
}

.rich-editor-surface {
    min-height: var(--size-editor-min);
    padding: var(--space-4);
    outline: none;
    font-family: var(--font-reading);
    font-size: var(--font-size-reading);
    line-height: var(--line-height-reading);
}

.rich-editor-surface:focus {
    box-shadow: inset var(--size-focus) var(--size-zero) var(--size-zero) var(--color-focus);
}

.rich-editor-surface img {
    max-width: var(--size-full);
    height: auto;
}

.rich-editor-surface table {
    width: var(--size-full);
    border-collapse: collapse;
}

.rich-editor-surface th,
.rich-editor-surface td {
    border: var(--size-hairline) solid var(--color-border);
    padding: var(--space-2);
}

.editor-tool--source-citation {
    border-color: var(--color-accent);
    background: var(--color-accent);
    color: var(--color-accent-text);
}

.editor-tool--source-citation:hover,
.editor-tool--source-citation:active {
    border-color: var(--color-accent-strong);
    background: var(--color-accent-strong);
    color: var(--color-accent-text);
}

.source-citation-dialog__body {
    display: grid;
    gap: var(--space-4);
}

.source-citation-dialog__body > p {
    margin: var(--size-zero);
}

.source-citation-dialog__grid {
    display: grid;
    gap: var(--space-3);
}

.source-citation-dialog__grid textarea {
    min-height: auto;
}

.source-citation-dialog__actions {
    margin-top: var(--size-zero);
}

.source-citation-dialog__remove {
    margin-left: auto;
    color: var(--color-danger);
}

.source-citation-box {
    display: grid;
    gap: var(--space-3);
    margin: var(--space-6) var(--size-zero);
    border: var(--size-hairline) solid var(--color-border);
    border-left: var(--space-1) solid var(--color-accent);
    border-radius: var(--size-radius-small);
    padding: var(--space-5);
    background: var(--color-surface-strong);
    box-shadow: var(--shadow-card);
}

.source-citation-box__eyebrow {
    margin: var(--size-zero);
    color: var(--color-accent-strong);
    font-family: var(--font-heading);
    font-size: var(--font-size-small);
    font-weight: 700;
    letter-spacing: var(--letter-spacing-eyebrow);
    line-height: var(--line-height-heading);
    text-transform: uppercase;
}

.source-citation-box__row {
    display: grid;
    grid-template-columns: minmax(var(--size-control-min), 0.7fr) minmax(0, var(--grid-detail-fr));
    gap: var(--space-3);
    margin: var(--size-zero);
    padding-top: var(--space-3);
    border-top: var(--size-hairline) solid var(--color-border);
}

.source-citation-box__label {
    color: var(--color-muted);
    font-family: var(--font-ui);
    font-size: var(--font-size-small);
    font-weight: 700;
    line-height: var(--line-height-heading);
}

.source-citation-box__value {
    min-width: var(--size-zero);
    overflow-wrap: anywhere;
}

.source-citation-box__report {
    color: var(--color-accent-strong);
    font-weight: 800;
}

.source-citation-box__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
    padding-top: var(--space-3);
    border-top: var(--size-hairline) solid var(--color-border);
}

.source-citation-box__actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: var(--size-button-min);
    border: var(--size-hairline) solid var(--color-border);
    border-radius: var(--size-radius-small);
    padding: var(--space-2) var(--space-3);
    background: var(--color-surface);
    color: var(--color-accent-strong);
    font-family: var(--font-ui);
    font-size: var(--font-size-small);
    font-weight: 700;
    line-height: var(--line-height-heading);
    text-decoration: none;
}

.source-citation-box__actions a:hover,
.source-citation-box__actions a:focus-visible {
    border-color: var(--color-accent);
    background: var(--color-surface-strong);
    box-shadow: var(--shadow-card);
}

.source-citation-box__actions a:focus-visible {
    outline: var(--size-hairline) solid var(--color-focus);
    outline-offset: var(--space-1);
}

.source-citation-box__access-note {
    flex-basis: 100%;
    color: var(--color-muted);
    font-family: var(--font-ui);
    font-size: var(--font-size-small);
}

.rich-editor-surface .source-citation-box {
    cursor: pointer;
}

.rich-editor-surface .source-citation-box:hover,
.rich-editor-surface .source-citation-box:focus {
    outline: var(--size-hairline) solid var(--color-focus);
    outline-offset: var(--space-1);
}

@media (max-width: 42rem) {
    .rich-editor-toolbar {
        align-items: stretch;
    }

    .rich-editor-toolgroup--utility {
        margin-left: var(--size-zero);
    }

    .source-citation-box__row {
        grid-template-columns: var(--grid-fr);
        gap: var(--space-1);
    }
}

.editor-media-panel {
    font-weight: 400;
}

.editor-media-summary {
    display: inline-flex;
    width: max-content;
    align-items: center;
    gap: var(--space-2);
    list-style: none;
    border: var(--size-hairline) solid var(--color-border);
    border-radius: var(--size-radius-small);
    padding: var(--space-2) var(--space-3);
    background: var(--color-surface);
    color: var(--color-text);
    cursor: pointer;
    font-size: var(--font-size-small);
    font-weight: 650;
}

.editor-media-summary::-webkit-details-marker {
    display: none;
}

.editor-media-summary::after {
    content: "+";
    color: var(--color-accent-strong);
    font-weight: 700;
}

.editor-media-panel[open] .editor-media-summary::after {
    content: "−";
}

.editor-media-summary:hover,
.editor-media-summary:focus-visible {
    border-color: var(--color-accent);
    background: var(--color-surface-strong);
    color: var(--color-accent-strong);
    box-shadow: var(--shadow-card);
}

.editor-media-summary:focus-visible {
    outline: var(--size-hairline) solid var(--color-focus);
    outline-offset: var(--space-1);
}

.editor-media-panel[open] .editor-media-summary {
    margin-bottom: var(--space-2);
}

.editor-media-strip {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
}

.media-insert-button {
    max-width: var(--size-media-name);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-media-layout {
    display: grid;
    gap: var(--space-5);
}

.media-table td:nth-child(2) {
    max-width: var(--size-media-name);
    overflow-wrap: anywhere;
}

.media-preview-cell {
    width: 7rem;
}

.media-library-thumbnail {
    display: block;
    width: 6rem;
    aspect-ratio: var(--ratio-feature-image);
    object-fit: cover;
    border: var(--size-hairline) solid var(--color-border);
    border-radius: var(--size-radius-small);
    background: var(--color-bg);
}

.media-library-file-kind {
    display: inline-grid;
    place-items: center;
    min-width: 3rem;
    min-height: 3rem;
    border: var(--size-hairline) solid var(--color-border);
    border-radius: var(--size-radius-small);
    color: var(--color-muted);
    font-size: var(--font-size-small);
    font-weight: 700;
}

.media-action-form {
    margin: var(--size-zero);
}

.media-usage-list {
    margin: var(--space-2) var(--size-zero) var(--size-zero);
    padding-left: var(--space-5);
    color: var(--color-muted);
    font-size: var(--font-size-small);
}

.publish-panel {
    margin-top: var(--space-5);
    padding: var(--space-4) var(--space-5);
}

.publish-panel p {
    color: var(--color-muted);
}

.flash-stack {
    display: grid;
    gap: var(--space-2);
    margin-bottom: var(--space-4);
}

.flash-message,
.preview-banner {
    padding: var(--space-3) var(--space-4);
}

.flash-error {
    border: var(--size-hairline) solid var(--color-danger);
    background: var(--color-danger-bg);
    color: var(--color-danger);
}

.flash-success {
    border: var(--size-hairline) solid var(--color-success);
    background: var(--color-success-bg);
    color: var(--color-success);
}

.preview-banner {
    margin-bottom: var(--space-5);
    border-color: var(--color-accent);
    color: var(--color-accent);
    font-weight: 700;
}

.admin-preview-document {
    margin-inline: var(--size-zero);
    padding-block: var(--size-zero) var(--space-6);
}

.table-scroll {
    overflow-x: auto;
}

.admin-table {
    width: var(--size-full);
    border-collapse: collapse;
}

.admin-table th,
.admin-table td {
    border-bottom: var(--size-hairline) solid var(--color-border);
    padding: var(--space-3);
    text-align: left;
    vertical-align: top;
}

.admin-table th {
    color: var(--color-muted);
    font-size: var(--font-size-small);
    text-transform: uppercase;
}

.admin-title-public-link {
    display: inline-flex;
    align-items: center;
    margin-left: var(--space-1);
    vertical-align: text-bottom;
}

.admin-title-public-link .ui-icon {
    width: var(--font-size-small);
    height: var(--font-size-small);
}

.publication-finder {
    display: grid;
    gap: var(--space-3);
    border: var(--size-hairline) solid var(--color-border);
    border-radius: var(--size-radius-small);
    padding: var(--space-4);
    background: var(--color-surface);
}

.publication-finder__heading {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: var(--space-3);
}

.publication-finder__heading > div {
    display: grid;
    gap: var(--space-1);
}

.publication-finder__controls {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: end;
    gap: var(--space-3);
}

.publication-finder__controls > *,
.publication-finder__query,
.publication-finder__results,
.publication-finder__preview {
    min-width: var(--size-zero);
}

.publication-finder__query {
    grid-column: 1 / -1;
}

.publication-finder__search {
    min-height: var(--size-button-min);
    justify-self: start;
}

.publication-finder__status {
    min-height: 1.4em;
    margin: var(--size-zero);
}

.publication-finder__results {
    display: grid;
    gap: var(--space-2);
    max-height: 18rem;
    overflow: auto;
}

.publication-finder__result {
    display: grid;
    gap: var(--space-1);
    width: var(--size-full);
    border: var(--size-hairline) solid var(--color-border);
    border-radius: var(--size-radius-small);
    padding: var(--space-3);
    background: var(--color-bg);
    color: var(--color-text);
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.publication-finder__result:hover,
.publication-finder__result:focus-visible {
    border-color: var(--color-accent);
    outline: none;
    box-shadow: var(--shadow-card);
}

.publication-finder__result span,
.publication-finder__preview-meta span {
    color: var(--color-muted);
    font-size: var(--font-size-small);
}

.publication-finder__preview {
    display: grid;
    gap: var(--space-3);
    border-top: var(--size-hairline) solid var(--color-border);
    padding-top: var(--space-3);
}

.publication-finder__preview[hidden] {
    display: none;
}

.publication-finder__preview-meta {
    display: grid;
    gap: var(--space-1);
}

.publication-finder__catchnote {
    max-height: 14rem;
    overflow: auto;
    border-left: var(--space-1) solid var(--color-accent);
    padding-left: var(--space-3);
    white-space: pre-wrap;
    font-family: var(--font-reading);
    line-height: var(--line-height-reading);
}

.publication-finder__preview-actions {
    margin-top: var(--size-zero);
}

@media (max-width: 56rem) {
    .publication-finder__controls {
        grid-template-columns: var(--grid-fr);
    }
}

.statistics-summary {
    margin-bottom: var(--space-5);
}

.statistics-summary h2,
.statistics-mix h2 {
    margin-bottom: var(--space-2);
}

.statistics-summary__intro {
    max-width: var(--size-reading);
    color: var(--color-muted);
}

.statistics-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(var(--size-full), var(--size-card-min)), var(--grid-fr)));
    gap: var(--space-4);
    margin-top: var(--space-4);
}

.statistics-card {
    display: grid;
    gap: var(--space-1);
    border: var(--size-hairline) solid var(--color-border);
    border-radius: var(--size-radius-medium);
    background: var(--color-surface);
    padding: var(--space-5);
}

.statistics-card__value {
    font-size: var(--font-size-h2);
    line-height: 1;
}

.statistics-card__label {
    color: var(--color-muted);
}

.statistics-mix {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(18rem, 1fr);
    gap: var(--space-6);
    align-items: center;
}

.statistics-mix__visual {
    display: grid;
    grid-template-columns: minmax(12rem, 16rem) minmax(12rem, 1fr);
    gap: var(--space-5);
    align-items: center;
}

.statistics-donut {
    position: relative;
    aspect-ratio: 1;
    width: min(100%, 16rem);
    margin-inline: auto;
}

.statistics-donut__svg {
    display: block;
    width: 100%;
    height: 100%;
    transform: rotate(-90deg);
}

.statistics-donut__track,
.statistics-donut__segment {
    fill: none;
    stroke-width: 12;
}

.statistics-donut__track {
    stroke: var(--color-border);
}

.statistics-donut__segment--case-law {
    stroke: var(--color-accent);
}

.statistics-donut__segment--recent-decision {
    stroke: var(--color-accent-secondary);
}

.statistics-donut__center {
    position: absolute;
    inset: 0;
    display: grid;
    place-content: center;
    text-align: center;
    pointer-events: none;
}

.statistics-donut__center strong {
    font-size: var(--font-size-h2);
    line-height: 1;
}

.statistics-donut__center span {
    margin-top: var(--space-1);
    color: var(--color-muted);
    font-size: var(--font-size-small);
}

.statistics-legend {
    display: grid;
    gap: var(--space-3);
    margin: 0;
}

.statistics-legend > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
    border-bottom: var(--size-hairline) solid var(--color-border);
    padding-bottom: var(--space-3);
}

.statistics-legend dt {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.statistics-legend dd {
    margin: 0;
    font-weight: 700;
}

.statistics-legend__swatch {
    width: 0.75rem;
    height: 0.75rem;
    border-radius: 50%;
    flex: 0 0 auto;
}

.statistics-legend__swatch--case-law {
    background: var(--color-accent);
}

.statistics-legend__swatch--recent-decision {
    background: var(--color-accent-secondary);
}

@media (max-width: 52rem) {
    .statistics-mix,
    .statistics-mix__visual {
        grid-template-columns: 1fr;
    }
}