/* Size the workspace from its available height, not from independent vh guesses. */
@media (min-width: 721px) {
    .dashboard-shell .dashboard-window { display: flex; flex-direction: column; overflow: hidden; }
    .dashboard-shell .dashboard-main {
        display: flex; flex: 1; flex-direction: column; min-height: 0;
        padding: clamp(16px, 2.4dvh, 26px) clamp(20px, 2.2vw, 36px) 8px;
    }
    .dashboard-shell .dashboard-header { flex: 0 0 auto; margin-bottom: clamp(12px, 2dvh, 22px); }
    .dashboard-shell .hub-tab:not([hidden]) {
        position: relative; flex: 1; min-height: 0; min-width: 0; overflow: auto;
        scrollbar-width: thin; scrollbar-color: var(--shell-hover) transparent;
        overscroll-behavior: contain;
    }
    body.dashboard-shell.omo-design .page-gfm-footer {
        flex: 0 0 auto; margin: 0; padding: 5px 20px 9px; line-height: 16px;
    }
    .dashboard-shell .dashboard-account-frame { height: 100%; min-height: 0; }
    .dashboard-shell .hub-tab[data-tab-panel="chat"] .messenger { height: 100%; min-height: 0; }
    .dashboard-shell .hub-tab[data-tab-panel="home"]:not([hidden]) {
        display: flex; flex-direction: column; gap: clamp(12px, 2dvh, 22px);
    }
    .dashboard-shell .hub-hero {
        flex: 0 0 auto; min-height: clamp(150px, 22dvh, 260px);
        margin: 0; padding: clamp(18px, 2.5dvh, 30px);
    }
    .dashboard-shell .hub-hero h2 { font-size: clamp(24px, 3.4dvh, 36px); margin-bottom: 10px; }
    .dashboard-shell .hub-subline { line-height: 1.6; }
    .dashboard-shell .hub-hero-art img { height: calc(100% + 20px); right: 12px; bottom: -16px; }
    .dashboard-shell #anon-stats-note { flex: 0 0 auto; margin: 0 !important; }
    .dashboard-shell .hub-grid {
        flex: 1; min-height: 0; margin: 0; align-items: stretch; gap: clamp(12px, 1.5vw, 22px);
    }
    .dashboard-shell .hub-col-main, .dashboard-shell .hub-col-side { min-height: 0; gap: 14px; }
    .dashboard-shell .hub-col-side { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(90px, .7fr) minmax(180px, 1.3fr); }
    .dashboard-shell .hub-grid .dashboard-card {
        display: flex; flex: 1; flex-direction: column; min-height: 0; margin: 0;
    }
    .dashboard-shell .hub-grid .card-header { flex: 0 0 auto; padding: 16px 20px 8px; }
    .dashboard-shell .hub-grid .card-content {
        flex: 1; min-height: 0; padding: 10px 20px 16px;
        overflow: auto; scrollbar-width: thin; scrollbar-color: var(--shell-hover) transparent;
    }
    .dashboard-shell .hub-feed-list:has(> .hub-empty:only-child) { min-height: 0; height: 100%; padding: 8px; }
    .dashboard-shell .hub-post { padding-block: 14px; }
    .dashboard-shell .hub-post + .hub-post { margin-top: 0; }
    body.dashboard-shell.omo-design .hub-stat-list .stat-item { min-height: 0; padding-block: clamp(7px, 1.2dvh, 13px); gap: 12px; }
    .dashboard-shell .hub-grid .card-header h3 { font-size: 16px; }
    /* Cards share a row when the window is wide enough, avoiding a tall side stack. */
    @media (min-width: 1200px) {
        .dashboard-shell .hub-grid { grid-template-columns: minmax(0, 1.7fr) minmax(180px, .8fr) minmax(220px, 1fr); }
        .dashboard-shell .hub-col-side { display: contents; }
    }
    @media (max-width: 1199px) {
        .dashboard-shell .hub-grid { grid-template-columns: minmax(0, 1.3fr) minmax(230px, 1fr); }
        .dashboard-shell .hub-hero-main { width: 70%; }
        .dashboard-shell .hub-grid .card-header, .dashboard-shell .hub-grid .card-content { padding-inline: 16px; }
        body.dashboard-shell.omo-design .hub-stat-list .stat-item { padding-block: 6px; }
        body.dashboard-shell.omo-design .hub-stat-list .stat-label { font-size: 12px; }
    }
    @media (max-width: 900px) {
        .dashboard-shell .hub-grid { flex: 0 0 auto; grid-template-columns: minmax(0, 1fr); }
        .dashboard-shell .hub-col-side { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: auto; }
        .dashboard-shell .hub-grid .card-content { overflow: visible; }
        .dashboard-shell .dashboard-community-card { min-height: 150px; }
        .dashboard-shell .hub-hero { min-height: 150px; }
    }
    /* Long timelines scroll below their controls. These columns can shrink freely. */
    .dashboard-shell .hub-tab[data-tab-panel="social"] .social-layout { height: 100%; min-height: 0; align-items: stretch; }
    .dashboard-shell .social-main { display: flex; flex-direction: column; min-height: 0; }
    .dashboard-shell .social-main > :not(.social-list) { flex-shrink: 0; }
    .dashboard-shell .social-list { flex: 1; min-height: 0; overflow: auto; scrollbar-width: thin; }
    .dashboard-shell .social-list:empty { flex: 0; }
    .dashboard-shell .social-aside { position: static; min-height: 0; overflow: auto; scrollbar-width: thin; }
    .dashboard-shell .social-empty { min-height: 0; padding: 24px; overflow: auto; }
    .dashboard-shell .social-heading { padding-bottom: 14px; }
    .dashboard-shell .social-search { margin-block: 12px; }
    .dashboard-shell .social-composer { margin-block: 0 14px; }
    .dashboard-shell [data-tab-panel="you"] > .dashboard-content { height: 100%; }
    .dashboard-shell [data-tab-panel="you"] .dashboard-grid {
        height: 100%; margin: 0; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px;
    }
    .dashboard-shell [data-tab-panel="you"] .dashboard-card { min-height: 0; }
    .dashboard-shell [data-tab-panel="you"] .card-header { flex-shrink: 0; padding: 16px 18px 8px; }
    .dashboard-shell [data-tab-panel="you"] .card-content { min-height: 0; overflow: auto; padding: 12px 18px; scrollbar-width: thin; }
    .dashboard-shell [data-tab-panel="you"] .anonymous-warning { grid-column: 1 / -1; }
    @media (min-width: 901px) and (max-width: 1150px) {
        .dashboard-shell .hub-tab[data-tab-panel="social"] .social-layout { grid-template-columns: minmax(0, 1fr) 220px; }
        .dashboard-shell .social-aside { display: block; }
        .dashboard-shell .social-account { margin-bottom: 16px; }
    }
    @media (max-width: 1199px) {
        .dashboard-shell [data-tab-panel="you"] .dashboard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
        .dashboard-shell [data-tab-panel="you"] #gallery-card { grid-column: 1 / -1; }
    }
    @media (max-width: 900px) {
        .dashboard-shell .hub-tab[data-tab-panel="social"] .social-layout { height: auto; }
        .dashboard-shell .social-main { min-height: 0; }
        .dashboard-shell .social-list { max-height: 60dvh; flex: auto; }
        .dashboard-shell [data-tab-panel="you"] > .dashboard-content { height: auto; }
        .dashboard-shell [data-tab-panel="you"] .dashboard-grid { grid-template-columns: minmax(0, 1fr); height: auto; }
    }
    .dashboard-shell .forum-banner { --banner-height: clamp(150px, 24dvh, 240px); }
    .dashboard-shell .forum-banner[data-size="compact"] { --banner-height: clamp(130px, 20dvh, 180px); }
    .dashboard-shell .forum-banner[data-size="tall"] { --banner-height: clamp(180px, 28dvh, 300px); }
    .dashboard-shell .forum-board-list .forum-row { padding-block: 16px; }
    .dashboard-shell .rn-archive { top: 0; max-height: calc(100dvh - 180px); }
}

@media (max-width: 720px) {
    .dashboard-shell .hub-hero { display: block; min-height: 0; padding: 22px; }
    .dashboard-shell .hub-hero-main { display: block; width: 65%; }
    .dashboard-shell .hub-hero h2 { font-size: 24px; margin-bottom: 12px; }
    .dashboard-shell .hub-hero-art { position: absolute; inset: 0 0 0 auto; width: 30%; height: auto; overflow: hidden; }
    .dashboard-shell .hub-hero-art img { height: auto; width: 100%; right: 0; bottom: 0; }
    .dashboard-shell .hub-subline { font-size: 12px; }
    .dashboard-shell .hub-feed-list:has(> .hub-empty:only-child) { min-height: 100px; }
    .dashboard-shell [data-tab-panel="home"] :is(.hub-grid, .hub-col-main, .hub-col-side) { gap: 14px; }
    .dashboard-shell [data-tab-panel="home"] .card-header { padding: 14px 18px 4px; }
    .dashboard-shell [data-tab-panel="home"] .card-content { padding: 10px 18px 14px; }
    .dashboard-shell .dashboard-community-card .card-content { max-height: 32dvh; overflow: auto; scrollbar-width: thin; }
    body.dashboard-shell.omo-design .hub-stat-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
    body.dashboard-shell.omo-design .hub-stat-list .stat-item { min-height: 0; padding: 7px 0; gap: 4px; flex-direction: column; align-items: flex-start; }
    body.dashboard-shell.omo-design .hub-stat-list .stat-label { font-size: 12px; }
    /* Chat and account pages own their scrolling, also on a phone. */
    .dashboard-shell .dashboard-window:has(> .dashboard-main > :is([data-tab-panel="chat"], [data-tab-panel="settings"], [data-tab-panel="profile"]):not([hidden])) {
        position: fixed; inset: 0; display: flex; flex-direction: column; overflow: hidden;
    }
    .dashboard-shell .dashboard-window:has(> .dashboard-main > :is([data-tab-panel="chat"], [data-tab-panel="settings"], [data-tab-panel="profile"]):not([hidden])) .dashboard-main {
        display: flex; flex: 1; flex-direction: column; min-height: 0; padding-bottom: 8px;
    }
    .dashboard-shell .dashboard-header { flex-shrink: 0; }
    .dashboard-shell .hub-tab:is([data-tab-panel="chat"], [data-tab-panel="settings"], [data-tab-panel="profile"]):not([hidden]) { flex: 1; min-height: 0; }
    .dashboard-shell .hub-tab[data-tab-panel="chat"] .messenger,
    .dashboard-shell .dashboard-account-frame { height: 100%; min-height: 0; }
    body.dashboard-shell.omo-design .page-gfm-footer { flex-shrink: 0; padding: 6px 14px 10px; }
}

body.dashboard-shell.modal-open .hub-tab:not([hidden]),
body.dashboard-shell[style*="overflow: hidden"] .hub-tab:not([hidden]) { overflow: hidden; }