/* PR #2 — Global responsive layer (studio surfaces).
   Duplicated from styles.css PR #1 block; does not target admin/newsdesk-* . */

html, body {
    overflow-wrap: anywhere;
}

.btn:focus-visible,
.ghost-btn:focus-visible,
.btn-primary:focus-visible,
.nav-link:focus-visible,
.text-input:focus-visible,
.input:focus-visible,
textarea:focus-visible,
select:focus-visible,
input:focus-visible {
    outline: 2px solid var(--gold, #d4a853);
    outline-offset: 2px;
}

.vault-main {
    max-width: 1280px;
    margin: 0 auto;
    padding: 56px 48px 96px;
}

.article-repurpose-pre {
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    max-width: 100%;
}

@media (max-width: 1100px) {
    .cp-strip { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 900px) {
    .comparison-grid,
    .cp-grid-2 { grid-template-columns: 1fr; }
}

@media (max-width: 1024px) {
    .text-input,
    .input,
    .textarea,
    .select,
    textarea,
    select,
    input {
        font-size: 16px;
    }
}

@media (max-width: 780px) {
    .lab-main,
    .vault-main,
    .connect-main,
    .landing-main {
        padding-left: 16px;
        padding-right: 16px;
    }
    .lab-main { padding: 32px 16px 72px; }
    .console-grid,
    .output-grid,
    .comparison-grid,
    .profile-grid,
    .voice-library,
    .cp-grid-2,
    .filter-row,
    .repurpose-grid,
    .scorecard-grid,
    .raw-lessons-list,
    .hooks-grid,
    .field-row.two-col {
        grid-template-columns: 1fr;
    }
    .stats-grid,
    .cp-strip { grid-template-columns: repeat(2, 1fr); }
    .console-card,
    .output-card,
    .voice-capture-card,
    .cluster-card,
    .trend-card,
    .filter-rail {
        padding: 20px;
    }
    .section-title {
        font-size: clamp(30px, 9vw, 42px);
    }
    button,
    .ghost-btn,
    .btn-primary,
    .btn-ghost,
    .landing-cta,
    .platform-btn,
    .nav-link,
    .icon-btn,
    .icon-btn-tiny,
    .meta-btn,
    .workspace-current,
    .calibration-btn {
        min-height: 44px;
    }
    .icon-btn,
    .icon-btn-tiny {
        min-width: 44px;
        width: 44px;
        height: 44px;
    }
}

@media (max-width: 640px) {
    .cp-strip { grid-template-columns: 1fr; }
    .drill-content { width: 100vw; max-width: 100vw; }
}

@media (max-width: 520px) {
    .output-footer,
    .sample-actions,
    .filter-actions,
    .card-header,
    .version-header,
    .cluster-header,
    .comparison-header {
        flex-direction: column;
        align-items: stretch;
    }
    .ghost-btn,
    .btn-primary,
    .btn-ghost,
    .forge-button {
        width: 100%;
        justify-content: center;
    }
    .stats-grid,
    .cp-strip { grid-template-columns: 1fr; }
    .platform-group-grid,
    .scorecard-grid { grid-template-columns: 1fr; }
    .vault-main { padding: 32px 16px 72px; }
}

@media (max-width: 390px) {
    .section-title { font-size: clamp(26px, 8.5vw, 34px); }
    .landing-hero h1 { font-size: clamp(28px, 9vw, 36px); }
}
