/* ── Responsive ───────────────────────────── */
@media (min-width: 769px) {
    #filterToolMenu {
        max-height: min(420px, calc(100vh - 220px));
        overflow-y: auto;
        overscroll-behavior: contain;
    }
}

@media (max-width: 991px) {
    .community-hub-layout,
    .contribution-workspace {
        grid-template-columns: 1fr;
    }

    .community-guide,
    .contribution-guide {
        position: static;
    }

    .community-guide {
        margin-top: 8px;
    }

    .contribution-guide {
        grid-row: 1;
    }

    .home-learning-grid,
    .home-trust-layout {
        grid-template-columns: 1fr;
    }

    .detail-sidebar-wrapper {
        position: static;
        max-height: none;
    }

    /* Prompt detail mobile reorder */
    .detail-layout-row {
        display: flex;
        flex-direction: column;
    }

    .detail-main-col {
        order: 1;
    }

    .detail-sidebar-col {
        order: 2;
    }

    .detail-comments-col {
        order: 3;
    }

    .tool-detail-layout-row > .tool-detail-main-col,
    .tool-detail-layout-row > .tool-detail-sidebar-col {
        display: contents;
    }

    .tool-detail-layout-row > .tool-detail-main-col > *,
    .tool-detail-layout-row > .tool-detail-sidebar-col > * {
        width: 100%;
        max-width: 100%;
        padding-right: calc(var(--bs-gutter-x) * 0.5);
        padding-left: calc(var(--bs-gutter-x) * 0.5);
        margin-top: var(--bs-gutter-y);
    }

    .tool-detail-content {
        order: 1;
    }

    .tool-action-card {
        order: 2;
    }

    .tool-review-section {
        order: 3;
    }

    .tool-review-list {
        order: 4;
    }

    .tool-related-list {
        order: 5;
    }
}

@media (max-width: 768px) {

    .community-composer-modal {
        align-items: stretch;
        padding: 0;
    }

    .community-composer-modal__dialog {
        border: 0;
        border-radius: 0;
        max-height: 100vh;
        width: 100%;
    }

    .community-composer-modal__topbar {
        padding: 12px 14px;
    }

    .prompt-composer--modal .prompt-composer__body,
    .prompt-composer--modal .prompt-composer__author,
    .prompt-composer--modal .prompt-composer__footer {
        padding-left: 16px;
        padding-right: 16px;
    }

    .prompt-field-row {
        grid-template-columns: 1fr;
    }

    .prompt-field-remove {
        justify-self: end;
    }

    .prompt-copy-fields {
        grid-template-columns: 1fr;
    }

    .prompt-composer__footer {
        align-items: stretch;
        flex-direction: column;
    }

    .prompt-composer__footer .btn-yz {
        width: 100%;
    }

    .community-entry {
        grid-template-columns: minmax(0, 1fr);
    }

    .community-entry__content,
    .community-entry__vote {
        grid-column: 1;
    }

    .community-entry__vote {
        border-left: 0;
        border-top: 1px solid var(--color-border);
        flex-direction: row;
        grid-row: 2;
        justify-content: flex-start;
        min-height: 50px;
        padding: 2px 10px;
    }

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

    .home-learning-section .daily-term-card,
    .home-editorial-card {
        padding: 20px;
    }

    .profile-visibility-note {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .profile-visibility-note a {
        margin-left: 26px;
        white-space: normal;
    }

    .profile-section-nav {
        display: flex;
        overflow-x: auto;
        overscroll-behavior-inline: contain;
        scrollbar-width: thin;
    }

    .profile-section-link {
        flex: 0 0 auto;
        min-width: 150px;
    }

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

    .tool-filter-desktop {
        display: none;
    }

    .tool-filter-mobile-bar {
        align-items: center;
        background: var(--color-surface);
        border-top: 1px solid var(--color-border);
        bottom: 0;
        box-shadow: var(--shadow-md);
        display: flex;
        justify-content: center;
        left: 0;
        padding: 8px 12px;
        position: fixed;
        right: 0;
        z-index: 89;
    }

    .tool-filter-mobile-trigger {
        padding-inline: var(--space-3);
        width: auto;
    }

    .tool-filter-sheet {
        border-radius: var(--radius-lg) var(--radius-lg) 0 0;
        margin: auto 0 0;
        max-height: min(86vh, 720px);
        max-width: none;
        overflow-y: auto;
        width: 100%;
    }

    .tool-filter-sheet__form {
        padding-bottom: max(var(--space-3), env(safe-area-inset-bottom));
    }

    section.has-sticky-filter {
        padding-bottom: 92px;
    }

    .page-header-component__main {
        align-items: flex-start;
        flex-direction: column;
        gap: var(--space-3);
    }

    .page-header-component__action {
        align-self: flex-start;
        width: auto;
    }

    .section-heading-row {
        align-items: flex-start;
        flex-direction: column;
    }

    .section-heading-row .btn-view-all {
        width: auto;
    }

    .page-header-component h1 {
        font-size: 1.75rem;
    }

    .page-header-component .site-breadcrumb__list {
        flex-wrap: wrap;
    }

    /* Hero V2 responsive */
    .hero-v2 {
        padding: 48px 0 22px;
    }

    .hero-v2-title {
        font-size: clamp(2.15rem, 10.8vw, 2.85rem);
        letter-spacing: -0.045em;
    }

    .hero-v2-subtitle {
        font-size: 0.95rem;
    }

    .hero-v2-actions {
        gap: 8px;
        margin-bottom: 20px;
    }

    .hero-search__control {
        padding-left: 13px;
    }

    .hero-search__control button {
        min-width: 64px;
        padding-inline: 14px;
    }

    .hero-cta {
        font-size: 0.86rem;
        padding: 12px 14px;
    }

    .hero-paths {
        max-width: none;
        padding-top: 12px;
    }

    .hero-paths-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 3px;
        margin-bottom: 6px;
        padding: 0 4px 5px;
        text-align: left;
    }

    .hero-paths-eyebrow::after {
        content: none;
    }

    .hero-paths-grid {
        grid-template-columns: 1fr;
    }

    .hero-path-card {
        min-height: 0;
        padding: 12px;
    }

    .floating-icon {
        display: none;
    }

    .hero-badge {
        font-size: var(--font-size-caption);
        padding: 6px 14px;
    }

    .hero-search__hint {
        display: none;
    }

    .newsletter-form input,
    .newsletter-form .btn-yz {
        height: 44px;
        min-height: 44px;
    }

    .newsletter-form .btn-yz {
        width: auto;
    }

    .btn-yz,
    .btn-view-all {
        min-height: 44px;
    }

    .btn-yz--icon {
        flex-basis: 44px;
        width: 44px;
    }

    .detail-header {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    /* Mobile sticky filter bar */
    .filter-bar-sticky {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 90;
        background: var(--color-surface);
        border-top: 1px solid var(--color-border);
        padding: 8px 12px;
        box-shadow: var(--shadow-md);
        margin-bottom: 0;
    }

    .filter-bar-sticky .filter-bar {
        margin-bottom: 0;
        justify-content: center;
    }

    .filter-bar-sticky .filter-dropdown-toggle {
        padding: 6px 12px;
        font-size: var(--font-size-caption);
    }

    /* Filter dropdown opens upward on mobile */
    .filter-bar-sticky .filter-dropdown-menu {
        position: absolute;
        top: auto;
        bottom: calc(100% + 8px);
        left: 0;
        transform: translateY(8px);
    }

    .filter-bar-sticky .filter-dropdown.open .filter-dropdown-menu {
        transform: translateY(0);
    }

    /* Add bottom spacing to page content so it doesn't hide behind sticky bar */
    .has-sticky-filter .content-section {
        padding-bottom: 60px;
    }

    .filter-dropdown-menu {
        position: fixed;
        top: auto;
        bottom: 0;
        left: 0;
        right: 0;
        border-radius: var(--radius-lg) var(--radius-lg) 0 0;
        max-height: 60vh;
        overflow-y: auto;
        transform: translateY(100%);
    }

    .filter-dropdown.open .filter-dropdown-menu {
        transform: translateY(0);
    }

    .reddit-card {
        flex-direction: column;
    }

    .reddit-content-col {
        order: 1;
    }

    .reddit-vote-col {
        order: 2;
        flex-direction: row;
        padding: 10px 16px;
        min-width: unset;
        justify-content: left;
    }

    /* Pagination mobile */
    .yz-pagination {
        gap: 4px;
    }

    .yz-page-link {
        min-width: 44px;
        height: 44px;
        font-size: 0.8rem;
        padding: 0 8px;
    }

    /* View All minimal mobile */
    .btn-view-all {
        font-size: var(--font-size-caption);
        padding: 8px 12px;
    }

    /* Mobile detail layout */
    .detail-sidebar-wrapper {
        position: static;
        max-height: none;
    }

    .vote-panel-inline {
        gap: 20px;
    }

    .profile-header-actions,
    .form-actions {
        align-items: center;
        width: auto;
    }

    .form-card,
    .surface-card--spacious {
        padding: var(--space-3);
    }

    .comment-item--depth-1,
    .comment-item--depth-2,
    .comment-item--depth-3 {
        margin-left: var(--space-2);
    }

    .prompt-card .prompt-actions,
    .tool-card .tool-meta {
        align-items: flex-start;
        flex-wrap: wrap;
        gap: var(--space-1);
    }
}

@media (max-width: 560px) {
    .home-article-grid,
    .home-category-grid {
        grid-template-columns: 1fr;
    }

    .home-subsection-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }
}

@media (max-width: 360px) {
    .container {
        --bs-gutter-x: 1.5rem;
    }

    .hero-v2-title {
        font-size: 2.05rem;
        overflow-wrap: anywhere;
    }

    .hero-path-card {
        gap: 10px;
        grid-template-columns: minmax(0, 1fr) 16px;
        padding: 10px;
    }

    .page-header-component h1,
    .section-title,
    .detail-title {
        overflow-wrap: anywhere;
    }

    .tool-filter-sheet__actions {
        grid-template-columns: 1fr;
    }

    .image-upload-zone {
        padding: var(--space-2);
    }
}