@media (max-width: 1200px) {
    .process-flow-lane {
        gap: 0.8rem 1rem;
    }

    .process-flow-node {
        flex: 1 1 11rem;
        min-width: 11rem;
        max-width: 14rem;
    }

    .process-flow-node-card {
        min-width: 0;
        max-width: none;
        width: 100%;
    }
}

@media (max-width: 1180px) {
    .neo-chat-box .chat-layout,
    .neo-chat-box.has-todo-sidebar .chat-layout,
    .neo-chat-box.has-canvas-panel .chat-layout {
        flex-direction: column;
    }

    .neo-chat-box .chat-side-panels,
    .neo-chat-box.has-todo-sidebar .chat-side-panels,
    .neo-chat-box.has-canvas-panel .chat-side-panels {
        width: 100%;
        min-width: 0;
        max-width: none;
        flex: 1 1 auto;
    }

    .neo-chat-box .chat-canvas-panel,
    .neo-chat-box .todo-sidebar,
    .neo-chat-box .todo-sidebar-restore {
        width: 100%;
        min-width: 0;
        max-width: none;
        position: static;
        top: auto;
    }

    .neo-chat-box .chat-canvas-markdown {
        min-height: 12rem;
    }
}

@media (max-width: 960px) {
    nav#top-nav .nav-page-tools {
        flex-basis: 20rem;
    }
}

@media (max-width: 860px) {
    nav#top-nav .nav-page-tools {
        flex-basis: 16rem;
        margin-left: 0.5rem;
    }

    .nav-page-tools-row {
        gap: 0.5rem;
    }

    .nav-project-select {
        min-width: 11rem;
        max-width: min(32vw, 15rem);
    }

}

@media (max-width: 768px) {
    nav#top-nav .nav-page-tools {
        flex-basis: 13rem;
    }

}

@media (max-width: 768px) {
    .pagination-controls-flex {
        flex-wrap: wrap;
        row-gap: 0.5rem;
    }

    .split-layout {
        flex-direction: column;
        width: 100%;
    }

    .subject-intro {
        flex-direction: column;
    }

    .subject-intro-face {
        width: 8rem;
    }

    .split-layout-aside {
        flex-basis: auto;
        width: auto;
    }

    .sticky-stack {
        position: static;
        max-height: none;
        overflow: visible;
    }

    .organization-profile-row,
    .organization-profile-sections {
        flex-direction: column;
    }

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

    table.responsive-table,
    table.responsive-table thead,
    table.responsive-table tbody,
    table.responsive-table th,
    table.responsive-table td,
    table.responsive-table tr {
        display: block;
    }

    table.responsive-table .table-actions-cell {
        width: auto;
        text-align: left;
    }

    table.responsive-table .table-action-bar {
        justify-content: flex-start;
    }

    table.responsive-table thead {
        display: none;
    }

    table.responsive-table tr {
        padding: 0.8rem 0;
        border-bottom: 1px solid var(--table-border-color, var(--color-border));
    }

    table.responsive-table td {
        border-bottom: none;
        padding: 0.3rem 0;
    }
}

@media (max-width: 768px) {
    .tenant-contact-layout {
        flex-direction: column;
    }

    .tenant-contact-secondary {
        flex-basis: 100%;
        min-width: 0;
    }

    .contact-add-sections {
        flex-direction: column;
    }

    .contact-add-form-row {
        flex-direction: column;
    }

    .contact-add-field {
        flex-basis: 100%;
    }

    .neo-chat-box .chat-layout {
        flex-direction: column-reverse;
        width: 100%;
    }

    .neo-chat-box .chat-main {
        max-width: 100%;
        overflow-x: hidden;
    }

    .chat-response.user .response-content,
    .chat-steering-content,
    .chat-response .message {
        max-width: 85%;
        word-break: break-word;
        overflow-wrap: break-word;
    }

    .chat-response .answer,
    .chat-response.assistant .response-content {
        max-width: 95%;
        word-break: break-word;
        overflow-wrap: break-word;
    }

    .chat-response .answer pre,
    .chat-response .response-content pre {
        max-width: 100%;
        overflow-x: auto;
    }

    .neo-chat-box .chat-context-project-dialog-select,
    .neo-chat-box .chat-context-project-link,
    .neo-chat-box .chat-context-project-trigger {
        max-width: 100%;
        min-width: 8rem;
    }

    .neo-chat-box.has-todo-sidebar .chat-layout {
        flex-direction: column;
    }

    .neo-chat-box .todo-sidebar,
    .neo-chat-box .todo-sidebar-restore {
        position: static;
        top: auto;
        z-index: auto;
        width: 100%;
        min-width: 0;
        max-width: 100%;
        max-height: none;
    }

    .neo-chat-box .todo-sidebar.is-minimized {
        width: 100%;
    }

    section#pricing-plans {
        flex-direction: column;
        align-items: center;
        gap: 1.25rem;
    }

    section#pricing-plans .plan {
        max-width: 100%;
        width: 100%;
        padding: 2rem 1.25rem;
    }

    section#pricing-plans .plan.preferred {
        transform: none;
        order: -1;
    }

}

@media (max-width: 760px) {
    body:has(nav#top-nav.has-page-tools) {
        --nav-horizontal-height: 6.25rem;
    }

    nav#top-nav.has-page-tools {
        flex-wrap: wrap;
        align-content: center;
        row-gap: 0.35rem;
        padding-top: 0.35rem;
        padding-bottom: 0.35rem;
    }

    nav#top-nav.has-page-tools .nav-toggle {
        order: 1;
    }

    nav#top-nav.has-page-tools .nav-current-organization {
        order: 2;
    }

    nav#top-nav.has-page-tools .nav-page-tools {
        order: 3;
        flex: 0 1 auto;
        width: auto;
        margin-left: 0.5rem;
    }

    nav#top-nav.has-page-tools .nav-page-tools-row {
        width: auto;
        min-width: 0;
    }

    nav#top-nav.has-page-tools .nav-submenu {
        order: 4;
        margin-left: auto;
    }

    nav#top-nav.has-page-tools .nav-profile-menu {
        order: 5;
        margin-left: auto;
    }

    .process-flow-shell {
        padding: 1rem;
    }

    .process-flow-lane {
        flex-direction: column;
        align-items: stretch;
        overflow-x: visible;
    }

    .process-flow-stage-branch {
        margin-left: 0;
        padding-top: 0;
    }

    .process-flow-stage-branch::before,
    .process-flow-stage-branch::after {
        display: none;
    }

    .process-flow-node {
        width: 100%;
        min-width: min(100%, 10.5rem);
        max-width: 13rem;
    }

    .process-flow-node:not(:last-child)::after {
        top: calc(100% + 0.5rem);
        left: 0.42rem;
        width: 0;
        height: 0.9rem;
        border-top: none;
        border-left: 2px solid var(--color-border);
        transform: none;
    }

    .process-flow-node-card {
        min-width: 0;
        max-width: none;
        width: 100%;
    }

    .process-flow-node-card::after {
        display: none;
    }
}

@media (max-width: 720px) {
    .toolbar-btn-compact {
        box-sizing: border-box;
        width: 3.2rem;
        min-width: 3.2rem;
        max-width: 3.2rem;
        height: 3.2rem;
        min-height: 3.2rem;
        max-height: 3.2rem;
        padding: 0;
        gap: 0;
        font-size: 0;
        line-height: 1;
        border-radius: var(--radius-md);
    }

    .toolbar-btn-compact .button-label {
        display: none !important;
    }

    .toolbar-btn-compact .button-icon {
        font-size: 1.65rem;
        font-weight: 700;
    }

    .toolbar-strip {
        gap: 0.55rem;
    }

    .toolbar-strip .toolbar-btn {
        flex: 0 0 auto;
        width: 3.2rem;
        min-width: 3.2rem;
        max-width: 3.2rem;
        height: 3.2rem;
        min-height: 3.2rem;
        max-height: 3.2rem;
    }

    .toolbar-strip .toggle-summary-btn {
        flex: 0 0 auto;
        width: 3.2rem;
        min-width: 3.2rem;
        max-width: 3.2rem;
        height: 3.2rem;
        min-height: 3.2rem;
        max-height: 3.2rem;
        padding: 0;
    }

    .meta-bar {
        gap: 0.45rem 0.85rem;
        font-size: 0.72rem;
    }

    .status-marker {
        font-size: 0.75rem;
    }

    .neo-chat-box .chat-canvas-letterhead {
        flex-direction: column;
        gap: 1rem;
    }

    .neo-chat-box .chat-canvas-letterhead-brand.placement-right,
    .neo-chat-box .chat-canvas-letterhead-contact.placement-right {
        margin-left: 0;
        text-align: left;
        justify-items: start;
    }

    .neo-chat-box .chat-helper-actions {
        justify-content: flex-start;
    }

    .neo-chat-box .chat-helper-actions .chat-attachment-picker-trigger {
        margin-right: 0;
    }

    .neo-chat-box .chat-context-bar .project-group,
    .neo-chat-box .chat-context-bar .github-group {
        flex-basis: 100%;
    }

    .communication-page {
        gap: 0.85rem;
        padding: 0.85rem;
    }

    .folder-tab {
        font-size: 1rem;
    }
}

@media (max-width: 700px) {
    .profile-page {
        padding: 0.7rem;
    }

    .agent-connection {
        align-items: flex-start;
        flex-direction: column;
    }

    .agent-connection__action {
        align-self: flex-start;
    }

    .profile-danger-zone__item,
    .profile-danger-zone__email {
        flex-direction: column;
    }

    .profile-danger-zone__email .profile-account-email__form {
        width: 100%;
    }

    .profile-card-header {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .profile-role-summary {
        width: auto;
        align-items: flex-start;
        margin-left: 0;
    }

    .profile-form .avatar-editor {
        flex-direction: column;
        align-items: flex-start;
    }

}

@media (max-width: 640px) {
    .pagination-controls-flex {
        flex-direction: row;
    }

    nav#top-nav .nav-page-tools {
        flex-basis: 10.5rem;
        margin-left: 0.35rem;
    }

    nav#top-nav.has-page-tools .nav-page-tools {
        flex-basis: auto;
        margin-left: 0.35rem;
    }

    nav#top-nav .nav-current-organization {
        max-width: min(46vw, 11rem);
        font-size: 0.9rem;
    }

    .nav-page-tools-row {
        gap: 0.35rem;
    }

    .status-encrypted-at-rest__label {
        display: none;
    }

    .status-pill.status-encrypted-at-rest {
        padding-inline: 0.55rem;
    }

    .nav-project-select-group label {
        display: none;
    }

    .nav-project-select {
        min-width: 8.5rem;
        max-width: 9.5rem;
    }

    .nav-submenu {
        gap: 0.125rem;
    }

    .nav-submenu a {
        padding: 4px 8px;
        font-size: 13px;
    }

    body#signin main,
    body#signup main,
    body#login-success main {
        padding: 0 1rem;
    }

    body#signin form,
    body#signup form {
        padding: 1.5rem;
    }
}

@media (max-width: 56.25rem) {
    .danger-panel {
        flex-direction: column;
        align-items: stretch;
    }
}

@media (max-width: 43.75rem) {
    .selection-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .selection-toolbar-actions {
        width: 100%;
    }

    .action-toolbar {
        gap: 0.6rem;
    }

    .action-tile {
        flex: 1 1 100%;
        justify-content: flex-start;
    }

    .recording-dialog-actions,
    .media-actions-row {
        flex-direction: column;
        align-items: stretch;
    }

    .recording-trigger {
        width: 100%;
    }

    .surface-section-header,
    .recording-status-row {
        flex-direction: column;
        align-items: flex-start;
    }
}

@media (max-width: 37.5rem) {
    .card-list-item {
        flex-direction: column;
    }

    .card-list-media,
    .card-list-media.is-compact {
        width: 100%;
        min-height: 7.5rem;
        max-height: 11.25rem;
        border-radius: 0;
    }

    .card-list-controls {
        flex-direction: row;
        border-left: none;
        border-top: 1px solid var(--border-color, var(--color-hex-e0e0e0));
        padding: 0.5rem 1rem;
        justify-content: flex-end;
    }

    .dialog-lightbox {
        padding: 1rem;
    }
}

@media (max-width: 540px) {
    .neo-email-compose-row {
        grid-template-columns: 3.4rem minmax(0, 1fr);
    }

    .toolbar-btn-compact {
        width: 2.85rem;
        min-width: 2.85rem;
        height: 2.85rem;
        min-height: 2.85rem;
    }

    .communication-chat-overlay {
        padding: 0;
    }

    .communication-compose-overlay {
        padding: 0;
    }

    .communication-chat-dialog {
        padding: 0.85rem;
        border-radius: 0;
    }

    .communication-compose-dialog {
        padding: 0.4rem 0.5rem 0.2rem;
        border-radius: 0;
    }

    .communication-page {
        padding: 0.7rem;
    }
}
