/* Final layout pass: keep pages spacious, scannable and consistent. */
:root {
    --layout-page: min(1280px, calc(100% - 40px));
    --layout-wide: min(1480px, calc(100% - 48px));
    --layout-gap: clamp(18px, 2.4vw, 30px);
    --layout-card-pad: clamp(18px, 2.2vw, 28px);
    --layout-tight-pad: clamp(14px, 1.8vw, 20px);
}

.admin-main {
    width: min(100%, 1500px);
    margin: 0 auto;
}

.site-main > .account-head,
.site-main > .file-table-card,
.site-main > .profile-console,
.site-main > .share-header,
.site-main > .share-link-panel,
.site-main > .access-panel,
.site-main > .metric-grid,
.site-main > .pagination-bar {
    width: var(--layout-page);
    margin-left: auto;
    margin-right: auto;
}

.account-head,
.share-header,
.admin-topbar,
.section-head {
    gap: var(--layout-gap);
}

.account-head,
.share-header {
    margin-bottom: 24px;
    padding: 22px 0 4px;
}

.account-head h1,
.share-header h1,
.admin-topbar h1 {
    max-width: 900px;
    text-wrap: balance;
}

.hero-text,
.section-head p,
.account-head p,
.share-header p {
    max-width: 760px;
}

.panel,
.file-table-card,
.share-link-panel,
.access-panel,
.login-card,
.profile-identity-panel,
.profile-settings-panel {
    padding: var(--layout-card-pad);
}

.metric-card {
    padding: var(--layout-tight-pad);
}

.section-head {
    align-items: flex-start;
    margin-bottom: 18px;
}

.section-head > div {
    min-width: min(100%, 320px);
}

.section-head h2 {
    margin-bottom: 6px;
    font-size: clamp(22px, 2.2vw, 30px);
    line-height: 1.15;
}

.form-grid,
.option-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr));
    gap: 14px;
}

.form-grid label,
.option-grid label,
.request-create-form label,
.request-upload-form label:not(.drop-zone) {
    min-width: 0;
}

.form-grid input,
.form-grid select,
.form-grid textarea,
.option-grid input,
.option-grid select,
.option-grid textarea {
    width: 100%;
}

.responsive-table {
    margin-inline: calc(var(--layout-card-pad) * -1);
    padding-inline: var(--layout-card-pad);
}

.responsive-table table {
    min-width: 760px;
}

th,
td {
    padding: 14px 16px;
    vertical-align: middle;
}

th {
    white-space: nowrap;
}

td {
    overflow-wrap: anywhere;
}

.table-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    min-width: 138px;
}

.table-actions form {
    margin: 0;
}

.pagination-bar {
    margin-top: 18px;
    padding: 12px 14px;
}

.pagination-size select {
    min-width: 86px;
}

.profile-console {
    grid-template-columns: minmax(260px, 320px) minmax(0, 1fr);
    gap: var(--layout-gap);
    padding-top: 18px;
}

.profile-setting-row {
    grid-template-columns: 44px minmax(0, 1fr) auto;
}

.profile-setting-row .small-button {
    justify-self: end;
}

.profile-setting-meta {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 10px;
    min-width: 0;
}

.profile-state-pill {
    justify-self: start;
}

.modal-card {
    padding: clamp(18px, 2.5vw, 26px);
}

.settings-shell .tab-list,
.settings-shell .subtab-list,
.ipban-tabs .tab-list {
    overflow-x: auto;
    flex-wrap: nowrap;
    scrollbar-width: thin;
}

.settings-shell .tab-button,
.settings-shell .subtab-button,
.ipban-tabs .tab-button {
    flex: 0 0 auto;
}

.transfer-desktop-scene {
    width: min(100% - 56px, 1360px);
    grid-template-columns: minmax(360px, 460px) minmax(0, 1fr);
    gap: clamp(44px, 6vw, 92px);
}

.transfer-stage {
    width: min(100%, 460px);
}

.transfer-stage .upload-panel {
    padding: clamp(18px, 2vw, 24px);
}

.transfer-story-panel {
    min-height: clamp(500px, 62vh, 640px);
    padding: clamp(38px, 5vw, 68px);
}

.transfer-story-panel h2 {
    max-width: 720px;
    font-size: clamp(38px, 5.2vw, 68px);
}

.trust-band {
    width: var(--layout-page);
}

.request-card-grid {
    width: var(--layout-page);
    margin-left: auto;
    margin-right: auto;
}

.request-card {
    min-width: 0;
}

.request-card-head,
.request-link-row,
.request-actions {
    min-width: 0;
}

.request-card-head {
    align-items: flex-start;
}

.request-actions .small-button {
    justify-content: center;
}

@media (max-width: 1180px) {
    .metric-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .profile-console {
        grid-template-columns: 1fr;
    }

    .profile-identity-panel {
        position: static;
    }
}

@media (max-width: 920px) {
    :root {
        --layout-page: min(100% - 28px, 760px);
        --layout-wide: min(100% - 28px, 900px);
    }

    .admin-main {
        width: 100%;
        padding-inline: 14px;
    }

    .admin-topbar,
    .panel,
    .file-table-card,
    .share-link-panel,
    .access-panel,
    .profile-identity-panel,
    .profile-settings-panel {
        border-radius: 16px;
    }

    .transfer-desktop-scene {
        width: var(--layout-page);
        padding-top: 28px;
    }

    .transfer-stage {
        width: min(100%, 520px);
    }
}

@media (max-width: 720px) {
    :root {
        --layout-page: min(100% - 22px, 560px);
        --layout-card-pad: 16px;
    }

    .site-body .site-header {
        grid-template-columns: 48px minmax(0, 1fr) auto;
        gap: 8px;
    }

    .site-body .brand {
        min-width: 0;
    }

    .account-head,
    .share-header,
    .admin-topbar,
    .section-head {
        align-items: stretch;
        flex-direction: column;
    }

    .account-head,
    .share-header {
        padding-top: 14px;
    }

    .section-head .small-button,
    .section-head .primary-button,
    .section-head form,
    .section-head form button {
        width: 100%;
        justify-content: center;
    }

    .metric-grid {
        grid-template-columns: 1fr;
    }

    .responsive-table {
        margin-inline: -12px;
        padding-inline: 12px;
    }

    .responsive-table table {
        min-width: 680px;
    }

    th,
    td {
        padding: 12px 14px;
    }

    .table-actions {
        min-width: 128px;
    }

    .profile-setting-row {
        grid-template-columns: 42px minmax(0, 1fr);
    }

    .profile-setting-meta {
        grid-column: 2;
        justify-content: flex-start;
    }

    .profile-setting-row .profile-state-pill,
    .profile-setting-row .small-button {
        justify-self: start;
    }

    .modal-actions,
    .modal-actions .primary-button,
    .modal-actions .small-button {
        width: 100%;
        justify-content: center;
    }

    .transfer-desktop-scene {
        width: 100%;
        padding-top: 0;
    }

    .transfer-stage .upload-panel {
        border-radius: 22px;
    }

    .transfer-stage .drop-zone {
        min-height: 230px;
        padding: 24px 18px;
    }

    .album-promo {
        width: min(100% - 16px, 520px);
    }

    .request-card-head,
    .request-link-row {
        flex-direction: column;
    }

    .request-link-row input,
    .request-link-row .icon-button,
    .request-actions .small-button,
    .request-actions form,
    .request-actions form button {
        width: 100%;
    }
}

@media (max-width: 420px) {
    :root {
        --layout-page: min(100% - 16px, 420px);
    }

    .site-body .header-auth-link {
        max-width: 118px;
        font-size: 14px;
    }

    .panel,
    .file-table-card,
    .share-link-panel,
    .access-panel,
    .login-card,
    .profile-identity-panel,
    .profile-settings-panel {
        padding: 14px;
    }

    .transfer-mode a {
        font-size: 13px;
    }
}