/* Shared editorial and instrument presentation. Loaded after page styles. */

/* Headings share one scale; compact dashboard and footer labels retain their role. */
:is(.meter-intro, .bass-hero, .mic-hero, .speaker-hero, .headphone-hero,
    .tone-hero, .spectrum-hero, .methodology-hero, .changelog-hero,
    .about-hero, .privacy-hero) h1 {
    max-width: min(100%, 30ch);
    font-family: var(--font-display);
    font-size: var(--type-h1-size);
    font-weight: var(--font-weight-extrabold);
    line-height: var(--leading-tight);
    letter-spacing: var(--tracking-tight);
    text-wrap: balance;
    hyphens: auto;
}

:is(.home-section__header, .bass-section-header, .mic-section-header,
    .speaker-section-header, .headphone-section-header, .tone-section-heading,
    .spectrum-section-heading, .methodology-section__heading,
    .about-reading-layout, .about-section-intro, .about-final,
    .changelog-updates, .privacy-copy) h2,
:is(.bass-editorial, .mic-editorial, .speaker-editorial, .headphone-editorial,
    .tone-editorial, .spectrum-editorial) h2 {
    max-width: min(100%, 32ch);
    font-family: var(--font-display);
    font-size: var(--type-h2-size);
    font-weight: var(--font-weight-extrabold);
    line-height: var(--leading-tight);
    letter-spacing: var(--tracking-tight);
    text-wrap: balance;
    hyphens: auto;
}

:is(.bass-copy-section, .mic-copy-section, .speaker-copy-section,
    .headphone-copy-section, .tone-copy-section, .tone-how-to,
    .tone-waveform-guide, .tone-practical, .tone-capabilities,
    .tone-related, .tone-quickstart, .spectrum-editorial > section,
    .privacy-section) h2 {
    max-width: min(100%, 32ch);
    font-family: var(--font-display);
    font-size: var(--type-h2-size);
    font-weight: var(--font-weight-extrabold);
    line-height: var(--leading-tight);
    letter-spacing: var(--tracking-tight);
    text-wrap: balance;
    hyphens: auto;
}

:is(.meter-intro__lead, .bass-hero__support, .mic-hero__support,
    .speaker-hero__support, .headphone-hero__support, .tone-hero__support,
    .spectrum-hero__support, .methodology-hero__inner > p,
    .changelog-hero p, .about-hero__layout > div > p,
    .privacy-hero__support) {
    max-width: 72ch;
    color: var(--color-text-secondary);
    font-family: var(--font-body);
    font-size: var(--type-lead-size);
    line-height: var(--type-body-leading);
}

.meter-after .meter-intro__lead {
    max-width: none;
}

:is(.about-copy, .methodology-prose, .privacy-copy) {
    font-size: var(--text-base);
    line-height: var(--type-body-leading);
}

:is(.home-section__header, .bass-section-header, .mic-section-header,
    .speaker-section-header, .headphone-section-header, .tone-section-heading,
    .spectrum-section-heading, .methodology-section__heading,
    .about-section-intro) > p:not([class*="kicker"]):not([class*="label"]) {
    margin-block-start: var(--section-heading-gap);
    color: var(--color-text-secondary);
    font-size: var(--type-lead-size);
    line-height: var(--type-body-leading);
}

:is(.section-kicker, .meter-intro__eyebrow, .bass-hero__eyebrow,
    .mic-hero__eyebrow, .speaker-hero__eyebrow, .headphone-hero__eyebrow,
    .tone-hero__eyebrow, .spectrum-hero__eyebrow, .bass-section-kicker,
    .tone-section-heading__label, .headphone-section-label) {
    color: var(--color-mint);
    font-family: var(--font-body);
    font-size: var(--text-xs);
    font-weight: var(--font-weight-semibold);
    line-height: 1.4;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

:is(.home-section, .about-section, .methodology-section, .changelog-updates,
    .privacy-section, .bass-copy-section, .mic-copy-section,
    .speaker-copy-section, .headphone-copy-section, .tone-copy-section,
    .tone-how-to, .tone-waveform-guide, .tone-practical,
    .tone-capabilities, .tone-related, .spectrum-editorial > section,
    .bass-faq, .mic-faq, .speaker-faq, .headphone-faq,
    .tone-faq, .spectrum-faq) {
    padding-block: var(--section-space);
}

:is(.home-section__header, .bass-section-header, .mic-section-header,
    .speaker-section-header, .headphone-section-header, .tone-section-heading,
    .spectrum-section-heading) {
    margin-block-end: var(--section-content-gap);
}

/* Seven FAQ implementations use the same card, type, icon, and open state. */
:is(.faq-layout, .bass-faq, .mic-faq, .speaker-faq, .headphone-faq,
    .tone-faq, .spectrum-faq) :is(header, .home-section__header) {
    width: 100%;
    max-width: var(--faq-width);
    margin-inline: auto;
    margin-block-end: var(--section-content-gap);
    display: block;
    position: static;
}

:is(.faq-layout, .bass-faq, .mic-faq, .speaker-faq, .headphone-faq,
    .tone-faq, .spectrum-faq) :is(header, .home-section__header) h2 {
    max-width: none;
    margin-block-start: var(--space-2);
    font-size: var(--type-h2-size);
    line-height: var(--leading-tight);
}

:is(.faq-layout, .bass-faq, .mic-faq, .speaker-faq, .headphone-faq,
    .tone-faq, .spectrum-faq) :is(header, .home-section__header) > p:last-child {
    max-width: 72ch;
    margin-block-start: var(--section-heading-gap);
    color: var(--color-text-secondary);
    font-size: var(--type-lead-size);
    line-height: var(--type-body-leading);
}

/* The homepage FAQ follows the full homepage container. */
.faq-layout :is(header, .home-section__header),
.faq-layout .faq-list {
    max-width: none;
}

:is(.faq-list, .bass-faq__list, .mic-faq__list, .speaker-faq__list,
    .headphone-faq__list, .tone-faq__list, .spectrum-faq__list) {
    width: 100%;
    max-width: var(--faq-width);
    margin-inline: auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-3);
    columns: auto;
    border: 0;
}

:is(.headphone-faq__columns, .tone-faq__columns) {
    width: 100%;
    max-width: var(--faq-width);
    margin-inline: auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-3);
}

:is(.faq-list, .bass-faq__list, .mic-faq__list, .speaker-faq__list,
    .headphone-faq__list, .tone-faq__list, .spectrum-faq__list) details,
.headphone-faq__list details:first-child,
.spectrum-faq__list details:nth-last-child(-n + 2) {
    min-width: 0;
    border: 1px solid var(--color-border);
    border-radius: var(--card-radius);
    background: var(--color-surface);
    break-inside: avoid;
}

:is(.faq-list, .bass-faq__list, .mic-faq__list, .speaker-faq__list,
    .headphone-faq__list, .tone-faq__list, .spectrum-faq__list) details:hover {
    border-color: color-mix(in srgb, var(--color-cyan) 38%, var(--color-border));
}

:is(.faq-list, .bass-faq__list, .mic-faq__list, .speaker-faq__list,
    .headphone-faq__list, .tone-faq__list, .spectrum-faq__list) details[open] {
    border-color: color-mix(in srgb, var(--color-cyan) 48%, var(--color-border));
    background: var(--color-surface-elevated);
}

:is(.faq-list, .bass-faq__list, .mic-faq__list, .speaker-faq__list,
    .headphone-faq__list, .tone-faq__list, .spectrum-faq__list) summary {
    min-height: 4.5rem;
    padding: var(--space-4) var(--space-6);
    display: grid;
    grid-template-columns: minmax(0, 1fr) 2.25rem;
    align-items: center;
    gap: var(--space-4);
    color: var(--color-text);
    font-family: var(--font-body);
    font-size: var(--text-base);
    font-weight: var(--font-weight-semibold);
    line-height: 1.45;
    list-style: none;
    cursor: pointer;
}

:is(.faq-list, .bass-faq__list, .mic-faq__list, .speaker-faq__list,
    .headphone-faq__list, .tone-faq__list, .spectrum-faq__list) summary::-webkit-details-marker,
:is(.faq-list, .bass-faq__list, .mic-faq__list, .speaker-faq__list,
    .headphone-faq__list, .tone-faq__list, .spectrum-faq__list) summary::marker {
    display: none;
}

:is(.faq-list, .bass-faq__list, .mic-faq__list, .speaker-faq__list,
    .headphone-faq__list, .tone-faq__list, .spectrum-faq__list) summary > span:last-child {
    width: 2.25rem;
    height: 2.25rem;
    display: grid;
    place-items: center;
    border: 1px solid var(--color-border);
    border-radius: 50%;
    color: var(--color-cyan);
    font-family: var(--font-body);
    font-size: var(--text-xl);
    font-weight: var(--font-weight-regular);
    line-height: 1;
    transition: transform var(--duration-fast) var(--ease-standard);
}

.headphone-faq__list summary > span:last-child::before {
    position: static;
    width: auto;
    height: auto;
    background: none;
    content: "+";
}
.headphone-faq__list summary > span:last-child::after { display: none; }

:is(.faq-list, .bass-faq__list, .mic-faq__list, .speaker-faq__list,
    .headphone-faq__list, .tone-faq__list, .spectrum-faq__list) details[open] summary > span:last-child {
    transform: rotate(45deg);
}

:is(.faq-list, .bass-faq__list, .mic-faq__list, .speaker-faq__list,
    .headphone-faq__list, .tone-faq__list, .spectrum-faq__list) details > p {
    width: auto;
    max-width: 72ch;
    margin: 0;
    padding: 0 var(--space-6) var(--space-6);
    color: var(--color-text-secondary);
    font-family: var(--font-body);
    font-size: var(--text-base);
    line-height: var(--type-body-leading);
}

/* The gold callouts share a surface; cyan information remains a separate semantic variant. */
:is(.meter-disclaimer, .inline-note--warning, .exposure-caution,
    .health-caution, .bass-limit-warning, .clarity-warning,
    .headphone-limit-note, .speaker-limit-note, .tone-early-warning,
    .accuracy-guidance__caution) {
    position: relative;
    min-width: 0;
    padding: var(--gold-box-padding);
    padding-inline-start: calc(var(--gold-box-padding) + 2.25rem);
    border: 1px solid var(--gold-box-border);
    border-radius: var(--card-radius);
    background: var(--gold-box-background);
    color: var(--color-text-secondary);
    font-family: var(--font-body);
    font-size: var(--text-sm);
    line-height: var(--type-body-leading);
}

:is(.meter-disclaimer, .inline-note--warning, .exposure-caution,
    .health-caution, .bass-limit-warning, .clarity-warning,
    .headphone-limit-note, .speaker-limit-note, .tone-early-warning,
    .accuracy-guidance__caution)::before {
    position: absolute;
    inset-block-start: var(--gold-box-padding);
    inset-inline-start: var(--gold-box-padding);
    width: 1.25rem;
    height: 1.25rem;
    display: grid;
    place-items: center;
    border: 1px solid var(--color-warning);
    border-radius: 50%;
    color: var(--color-warning);
    content: "!";
    font-family: var(--font-display);
    font-size: var(--text-xs);
    font-weight: var(--font-weight-extrabold);
    line-height: 1;
}

:is(.meter-disclaimer, .inline-note--warning, .exposure-caution,
    .health-caution, .bass-limit-warning, .clarity-warning,
    .headphone-limit-note, .speaker-limit-note, .tone-early-warning,
    .accuracy-guidance__caution) strong {
    color: var(--color-warning);
    font-family: var(--font-display);
    font-size: var(--text-base);
    font-weight: var(--font-weight-bold);
}

.accuracy-guidance > .accuracy-guidance__caution {
    padding-inline-start: calc(var(--gold-box-padding) + 2.25rem);
}

.tone-early-warning p { margin-block-start: var(--space-2); font-size: var(--text-sm); line-height: var(--type-body-leading); }
:is(.tone-early-warning, .clarity-warning) { display: block; }
.tone-early-warning svg,
.clarity-warning > span { display: none; }

/* Comparable fields and actions share touch targets; instrument keys keep their larger geometry. */
:is(.site-header__language select, .bass-test-page select, .tone-generator-page select,
    .microphone-test-page select, .spectrum-page select,
    .bass-test-page input:not([type="range"]):not([type="checkbox"]):not([type="radio"]),
    .tone-generator-page input:not([type="range"]):not([type="checkbox"]):not([type="radio"]),
    .microphone-test-page input:not([type="range"]):not([type="checkbox"]):not([type="radio"])) {
    min-height: var(--control-height);
    max-width: 100%;
    border-radius: var(--control-radius);
    font-family: var(--font-body);
    font-size: var(--text-sm);
}

:is(.site-header__cta, .site-header__mobile-cta, .about-button,
    .tone-action-button, .tone-stop, .tone-secondary-button,
    .tone-share-button, .tone-export-button, .bass-play-selected,
    .bass-stop, .speaker-stop, .headphone-stop,
    .sound-dashboard__start, .calibration-modal__reset) {
    min-height: var(--control-height);
    max-width: 100%;
    border-radius: var(--control-radius);
    font-family: var(--font-body);
    font-size: var(--text-sm);
    font-weight: var(--font-weight-semibold);
    line-height: 1.25;
    white-space: normal;
    text-align: center;
}

:is(.tone-console, .tone-workspace, .bass-module, .mic-panel,
    .speaker-tool, .headphone-tool, .spectrum-panel,
    .tool-card, .accuracy-guidance > section, .about-trust-grid a) {
    min-width: 0;
    border-radius: var(--card-radius);
}

main :is(.container, .container-tool, .container-prose) { min-width: 0; }
main :is(img, svg, canvas, table) { max-width: 100%; }
main :is(.container, .container-tool, .container-prose) > * { min-width: 0; }
main :is(h1, h2, h3, h4, p, li, summary, button) { overflow-wrap: break-word; }
main [id] { scroll-margin-top: calc(var(--space-20) + var(--space-4)); }

:is(body:has(.bass-test-page[data-playing="true"]),
    body:has(.speaker-tools[data-playing="true"]),
    body:has(.headphone-tools[data-playing="true"])) .site-footer {
    padding-block-end: max(var(--space-24), env(safe-area-inset-bottom));
}

@media (max-width: 42rem) {
    html[lang="de"] main :is(h1, h2, h3) {
        text-wrap: wrap;
    }

    html[lang="de"] :is(.meter-intro, .speaker-hero) h1 {
        hyphens: manual;
    }

    :is(.headphone-transport, .speaker-transport, .bass-transport) strong {
        overflow: visible;
        text-overflow: clip;
        white-space: normal;
        overflow-wrap: anywhere;
        line-height: 1.3;
    }

    .bass-transport__inner > div {
        overflow: visible;
    }

    .speaker-console__state span:last-child {
        overflow: visible;
        text-overflow: clip;
        white-space: normal;
    }

    :is(.meter-disclaimer, .inline-note--warning, .exposure-caution,
        .health-caution, .bass-limit-warning, .clarity-warning,
        .headphone-limit-note, .speaker-limit-note, .tone-early-warning,
        .accuracy-guidance__caution) {
        padding: calc(var(--gold-box-padding) + 1.75rem) var(--gold-box-padding) var(--gold-box-padding);
    }

    .accuracy-guidance > .accuracy-guidance__caution {
        padding: calc(var(--gold-box-padding) + 1.75rem) var(--gold-box-padding) var(--gold-box-padding);
    }

    :is(.faq-list, .bass-faq__list, .mic-faq__list, .speaker-faq__list,
        .headphone-faq__list, .tone-faq__list, .spectrum-faq__list) summary {
        padding-inline: var(--space-4);
        gap: var(--space-3);
    }
    :is(.faq-list, .bass-faq__list, .mic-faq__list, .speaker-faq__list,
        .headphone-faq__list, .tone-faq__list, .spectrum-faq__list) details > p {
        padding-inline: var(--space-4);
    }
}

@media (prefers-reduced-motion: reduce) {
    :is(.faq-list, .bass-faq__list, .mic-faq__list, .speaker-faq__list,
        .headphone-faq__list, .tone-faq__list, .spectrum-faq__list) summary > span:last-child {
        transition-duration: 0.01ms;
    }
}

/* One content edge for every page, instrument, editorial section, and FAQ. */
main :is(.container, .container-tool, .container-prose) {
    width: min(100% - (var(--page-gutter) * 2), var(--container-max));
    max-width: var(--container-max);
}

main :is(.faq-layout, .bass-faq, .mic-faq, .speaker-faq, .headphone-faq,
    .tone-faq, .spectrum-faq) :is(header, .home-section__header,
    .faq-list, .bass-faq__list, .mic-faq__list, .speaker-faq__list,
    .headphone-faq__list, .tone-faq__list, .spectrum-faq__list,
    .headphone-faq__columns, .tone-faq__columns) {
    max-width: none;
    width: 100%;
}

main :is(.headphone-faq__layout, .tone-faq__layout) {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-6);
}

main :is(.headphone-faq__columns, .tone-faq__columns) {
    grid-template-columns: minmax(0, 1fr);
}

main :is(.faq-layout, .bass-faq, .mic-faq, .speaker-faq, .headphone-faq,
    .tone-faq, .spectrum-faq) details > p {
    max-width: none;
}

/* Editorial copy occupies its section; paired layouts still limit each column naturally. */
main :is(.bass-intro__copy, .speaker-intro__copy, .headphone-intro__copy,
    .mic-intro__layout, .tone-intro__copy, .tone-copy-prose,
    .spectrum-editorial, .spectrum-section-heading, .tone-section-heading,
    .methodology-prose, .privacy-copy, .about-copy) {
    max-width: none;
}

main :is(.bass-copy-section, .mic-copy-section, .speaker-copy-section,
    .headphone-copy-section, .tone-copy-section, .tone-how-to,
    .tone-waveform-guide, .tone-practical, .tone-capabilities,
    .tone-related, .tone-learning, .tone-reference, .tone-accuracy,
    .spectrum-editorial > section, .methodology-section, .privacy-section,
    .about-section) p {
    max-width: none;
}

.tone-copy-section--narrow .tone-copy-prose,
.spectrum-concepts__fft-intro,
.spectrum-section-heading,
.spectrum-section-heading--wide {
    max-width: none;
}

.bass-intro__inner,
.headphone-intro__layout {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-6);
}

/* Notes use the same full-width warning surface after the primary controls. */
main :is(.meter-disclaimer, .inline-note--warning, .exposure-caution,
    .health-caution, .bass-limit-warning, .clarity-warning,
    .headphone-limit-note, .speaker-limit-note, .tone-early-warning,
    .accuracy-guidance__caution, .bass-safety, .headphone-safety,
    .speaker-safety) {
    width: 100%;
    max-width: none;
    border: 1px solid var(--gold-box-border);
    border-radius: var(--card-radius);
    background: var(--gold-box-background);
    color: var(--color-text-secondary);
    font-size: var(--text-base);
    line-height: var(--type-body-leading);
}

main :is(.bass-safety, .headphone-safety, .speaker-safety) {
    position: relative;
    display: block;
    padding: var(--gold-box-padding);
    padding-inline-start: calc(var(--gold-box-padding) + 2.25rem);
}

main :is(.bass-safety, .headphone-safety, .speaker-safety)::before {
    position: absolute;
    inset-block-start: var(--gold-box-padding);
    inset-inline-start: var(--gold-box-padding);
    width: 1.25rem;
    height: 1.25rem;
    display: grid;
    place-items: center;
    border: 1px solid var(--color-warning);
    border-radius: 50%;
    color: var(--color-warning);
    content: "!";
    font-size: var(--text-xs);
    font-weight: var(--font-weight-extrabold);
    line-height: 1;
}

main :is(.bass-safety__signal, .headphone-safety__signal, .speaker-safety__signal) {
    display: none;
}

main :is(.bass-safety, .headphone-safety, .speaker-safety) h2 {
    color: var(--color-warning);
    font-size: var(--text-base);
}

main :is(.bass-safety, .headphone-safety, .speaker-safety) :is(p, li) {
    font-size: var(--text-base);
}

.tone-early-warning--before-play {
    margin-block-start: var(--space-6);
    margin-inline: 0;
}

/* The introductory row of every tool has the same compact rhythm. */
main :is(.bass-hero, .speaker-hero, .headphone-hero, .mic-hero,
    .tone-hero, .spectrum-hero) {
    padding-block: var(--space-8) var(--space-4);
}

main :is(.bass-primary, .speaker-tools, .headphone-tools, .mic-tool,
    .tone-primary, .spectrum-tool) {
    padding-block-start: var(--space-4);
}

main :is(.bass-hero__nav, .headphone-hero__nav, .mic-hero__jumps) {
    margin-block: var(--space-4) var(--space-6);
}

/* All related-tool families use one flexible row system without empty cells. */
main :is(.bass-related-tools, .mic-related-tools, .speaker-related-tools,
    .headphone-related-tools, .tone-related__links, .spectrum-related__grid) {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
    border: 0;
}

main :is(.bass-related-tools, .mic-related-tools, .speaker-related-tools,
    .headphone-related-tools, .tone-related__links, .spectrum-related__grid) > a:nth-child(n) {
    flex: 1 1 calc(33.333% - var(--space-3));
    min-width: min(100%, 15rem);
    min-height: 0;
    padding: var(--space-5, 1.25rem);
    border: 1px solid var(--color-border);
    border-radius: var(--card-radius);
    background: var(--color-surface);
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto 1fr auto;
    align-content: start;
    gap: var(--space-3);
}

main :is(.bass-related-tools, .mic-related-tools, .speaker-related-tools,
    .headphone-related-tools, .tone-related__links, .spectrum-related__grid) > a :is(strong, span, i, svg) {
    grid-column: 1;
}

main :is(.bass-related-tools, .mic-related-tools, .speaker-related-tools,
    .headphone-related-tools, .tone-related__links, .spectrum-related__grid) > a :is(i, svg) {
    grid-row: 3;
    justify-self: start;
    align-self: end;
}

main .spectrum-related__grid > a i {
    position: static;
    inset: auto;
    justify-self: end;
}

main :is(.bass-related-tools, .mic-related-tools, .speaker-related-tools,
    .headphone-related-tools, .tone-related__links, .spectrum-related__grid) > a span {
    font-size: max(var(--text-sm), 0.9375rem);
    line-height: 1.5;
}

/* Remove reserved diagram space and restore normal explanation size. */
.tone-accuracy > .container { gap: var(--space-8); }
.tone-accuracy__chain { grid-template-columns: minmax(0, 1fr); gap: var(--space-6); }
.tone-accuracy__chain > .tone-diagram-note { grid-column: auto; margin-block-start: 0; }
.tone-signal-chain li { font-size: var(--text-sm); }
.tone-diagram-note,
.tone-wavelength-comparison p,
.tone-spectrum small,
.tone-practical__grid p,
.spectrum-console__header p { font-size: var(--text-sm); }

/* Editorial heading columns need enough room for longer localized words. */
.methodology-layout {
    grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
    gap: clamp(var(--space-8), 5vw, var(--space-16));
}

@media (max-width: 70rem) {
    .methodology-layout { grid-template-columns: minmax(0, 1fr); }
    .methodology-section__heading { position: static; }
}

.spectrum-how__steps p,
.diagnostic-list p,
.spectrum-use-list p,
.frequency-band-notes p,
.bass-module__header .bass-module__guidance p,
.speaker-steps p,
.tone-steps p,
.tone-practical__list p { font-size: max(var(--text-sm), 0.9375rem); }

@media (max-width: 42rem) {
    main :is(.bass-console, .speaker-tool, .headphone-tool, .mic-panel,
        .tone-console, .tone-workspace, .spectrum-console) {
        margin-inline: 0;
        max-width: 100%;
    }

    .headphone-tool__header--primary {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: var(--space-3);
        padding: var(--space-4);
    }

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

    .headphone-tool__header--primary p { max-width: none; font-size: var(--text-sm); }
    .headphone-console__state { width: fit-content; max-width: 100%; justify-content: start; }

    main :is(.bass-related-tools, .mic-related-tools, .speaker-related-tools,
        .headphone-related-tools, .tone-related__links, .spectrum-related__grid) > a:nth-child(n) {
        flex-basis: 100%;
        padding: var(--space-4);
    }

    .tone-early-warning--before-play { margin-inline: 0; }

    main :is(.bass-safety, .headphone-safety, .speaker-safety) {
        padding: calc(var(--gold-box-padding) + 1.75rem) var(--gold-box-padding) var(--gold-box-padding);
    }
}