/* Portfolio keeps the shared Activity system alive, but does not expose its
   trigger inside the Portfolio Project header. */
body.projects-dashboard.dashboard-portfolio-context-open .dashboard-project-header-context > .dashboard-activity-btn {
    display: none !important;
}

@media (min-width: 900px) {
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-split-shell {
        display: grid;
        grid-template-columns: minmax(720px, 3fr) minmax(360px, 2fr);
        width: 100%;
        height: 100%;
        min-height: 0;
        overflow-x: auto;
        overflow-y: hidden;
        background: #f8f7f2;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-editor {
        min-width: 0;
        min-height: 0;
        overflow: auto;
        background: linear-gradient(180deg, rgba(255, 255, 255, .72) 0 64%, rgba(143, 194, 197, .7) 100%);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-editor > .portfolio-clean-page {
        width: calc(100% - 48px) !important;
        max-width: none !important;
        margin: 0 24px !important;
        padding: 28px 8px 64px;
        height: auto;
        min-height: 100%;
        display: block;
        box-sizing: border-box;
    }

    body.projects-dashboard.dashboard-portfolio-context-open .dashboard-shell-control-cluster {
        display: none !important;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-panel,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-panel button,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-panel input {
        font-family: "Avenir Next", "Segoe UI", sans-serif;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-toolbar {
        position: relative;
        z-index: 8;
        display: grid;
        grid-template-columns: minmax(215px, 1fr) auto auto;
        align-items: center;
        gap: 18px;
        min-height: 52px;
        padding: 0 4px 25px;
        border-bottom: 1px solid #d5e0eb;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-add-projects {
        display: inline-flex;
        align-items: center;
        justify-self: start;
        gap: 14px;
        min-width: 0;
        padding: 0;
        border: 0;
        background: transparent;
        color: #26394e;
        cursor: pointer;
        box-shadow: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-add-projects > span {
        display: inline-flex;
        flex: 0 0 42px;
        align-items: center;
        justify-content: center;
        width: 42px;
        height: 42px;
        border: 1px solid #cbd9e7;
        border-radius: 50%;
        color: #6e86a0;
        font-size: 25px;
        font-weight: 300;
        line-height: 1;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-add-projects > strong {
        overflow: hidden;
        font-size: 15px;
        font-weight: 400;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-switch,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-utility-pill {
        display: inline-flex;
        align-items: stretch;
        min-height: 42px;
        border: 1px solid #cbd9e7;
        border-radius: 16px;
        background: rgba(255, 255, 255, .58);
        overflow: visible;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-switch {
        padding: 0;
        overflow: hidden;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-switch .portfolio-clean-layout {
        min-height: 42px;
        padding: 0 20px;
        border: 0;
        border-radius: 0;
        background: transparent;
        color: #526d8c;
        font-size: 13px;
        font-weight: 400;
        cursor: pointer;
        box-shadow: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-switch .portfolio-clean-layout + .portfolio-clean-layout {
        border-left: 1px solid #d5e0eb;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-switch .portfolio-clean-layout.is-active {
        background: #e8f2ff;
        color: #46698e;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-utility-pill > button,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-menu-wrap > button {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 52px;
        min-width: 52px;
        height: 42px;
        padding: 0;
        border: 0;
        border-left: 1px solid #d5e0eb;
        border-radius: 0;
        background: transparent;
        color: #607c98;
        cursor: pointer;
        box-shadow: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-utility-pill > button:first-child {
        border-left: 0;
        border-radius: 15px 0 0 15px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-menu-wrap {
        position: relative;
        display: flex;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-menu-wrap > button {
        border-radius: 0 15px 15px 0;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-utility-pill svg {
        width: 21px;
        height: 21px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.65;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-utility-pill button:hover,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-utility-pill button:focus-visible,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-switch button:hover,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-switch button:focus-visible {
        background: #f0f6fb;
        outline: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-menu {
        position: absolute;
        z-index: 30;
        top: calc(100% + 8px);
        right: 0;
        display: grid;
        min-width: 184px;
        padding: 7px;
        border: 1px solid #cbd9e7;
        border-radius: 14px;
        background: var(--portfolio-manager-control-surface, #f8f5f1);
        box-shadow: 0 14px 34px rgba(39, 63, 88, .14);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-menu[hidden] {
        display: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-menu button {
        min-height: 38px;
        padding: 0 12px;
        border: 0;
        border-radius: 9px;
        background: transparent;
        color: #26394e;
        font: 400 13px/1 "Avenir Next", "Segoe UI", sans-serif;
        text-align: left;
        cursor: pointer;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-menu button:hover,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-menu button:focus-visible {
        background: #eef4fa;
        outline: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-operation-status {
        min-height: 18px;
        margin: 10px 4px -5px;
        color: #617a95;
        font-size: 12px;
        line-height: 1.45;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-operation-status[hidden] {
        display: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-operation-status.is-error {
        color: #c63d48;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-settings {
        display: grid;
        grid-template-columns: minmax(160px, 1fr) auto auto auto;
        align-items: center;
        gap: 18px;
        padding: 24px 4px;
        border-bottom: 1px solid #d5e0eb;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-name {
        display: block;
        min-width: 0;
        max-width: 250px;
        overflow: hidden;
        padding: 10px 18px;
        border-radius: 11px;
        background: #bbbcb9;
        color: #fff;
        font-size: 15px;
        line-height: 1;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-password {
        display: inline-flex;
        align-items: center;
        gap: 9px;
        min-height: 42px;
        padding: 0;
        border: 0;
        background: transparent;
        color: #172231;
        cursor: pointer;
        box-shadow: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-password > span,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-switch {
        position: relative;
        display: inline-block;
        flex: 0 0 42px;
        width: 42px;
        height: 22px;
        border-radius: 999px;
        background: #bfc3c7;
        transition: background .16s ease;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-password i,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-switch i {
        position: absolute;
        top: 2px;
        left: 2px;
        display: block;
        width: 18px;
        height: 18px;
        border-radius: 50%;
        background: #fff;
        box-shadow: 0 1px 3px rgba(20, 33, 47, .2);
        transition: transform .16s ease;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-password.is-on > span,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-toggle.is-on .portfolio-manager-switch {
        background: #69d58d;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-password.is-on i,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-toggle.is-on .portfolio-manager-switch i {
        transform: translateX(20px);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-password strong {
        font-size: 12px;
        font-weight: 400;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-placeholder-action,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-copy-link,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-remove {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 38px;
        padding: 0 18px;
        border: 1px solid #cbd9e7;
        border-radius: 12px;
        background: rgba(255, 255, 255, .7);
        color: #172231;
        font-size: 13px;
        font-weight: 400;
        white-space: nowrap;
        box-shadow: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root button.portfolio-manager-placeholder-action:disabled {
        cursor: default;
        opacity: .62;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-copy-link,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root button.portfolio-clean-remove {
        cursor: pointer;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-copy-link:hover,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-copy-link:focus-visible,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root button.portfolio-clean-remove:hover,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root button.portfolio-clean-remove:focus-visible {
        border-color: #adc1d5;
        background: #f2f7fc;
        outline: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker {
        margin: 0 4px 25px;
        padding: 0 0 24px;
        border-bottom: 1px solid #d5e0eb;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source {
        display: grid;
        grid-template-columns: 100px minmax(0, 1fr);
        width: 100%;
        min-height: 220px;
        overflow: hidden;
        border: 1px solid #d5e0eb;
        border-radius: 16px;
        background: rgba(255, 255, 255, .5);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-tabs {
        display: flex !important;
        flex-direction: column;
        border: 0;
        border-right: 1px solid #d5e0eb;
        border-radius: 0 !important;
        background: rgba(248, 247, 242, .74);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-tab {
        flex: 0 0 42px !important;
        width: 100% !important;
        height: 42px;
        margin: 0 !important;
        border: 0 !important;
        border-bottom: 1px solid #dce5ed !important;
        border-radius: 0 !important;
        background: transparent !important;
        color: #607a95 !important;
        font-size: 12px !important;
        cursor: pointer;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-tab.is-active {
        background: #eaf2fa !important;
        color: #26394e !important;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-body {
        min-height: 220px;
        max-height: 330px;
        overflow: auto;
        padding: 18px;
        border-radius: 0;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-list {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(145px, 1fr));
        gap: 10px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-list[hidden] {
        display: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder {
        grid-column: 1 / -1;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-card {
        display: contents;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-card.is-expanded {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: repeat(auto-fill, minmax(145px, 1fr));
        gap: 10px;
        padding: 14px;
        border: 1px solid #aeb5bb;
        border-radius: 10px;
        box-sizing: border-box;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-card.is-expanded > .portfolio-clean-source-folder-row {
        height: auto;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-card.is-expanded > .portfolio-clean-source-children {
        display: contents;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-card > .portfolio-clean-source-children[hidden] {
        display: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-item,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-drag {
        min-height: 42px;
        padding: 8px 12px;
        border: 1px solid #d7e2ed;
        border-radius: 11px;
        background: rgba(255, 255, 255, .86);
        color: #2f4760;
        font-size: 12px;
        text-align: left;
        cursor: grab;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition {
        position: relative;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        overflow: visible !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition .portfolio-clean-composition-tabs {
        position: static;
        display: flex;
        min-height: 40px;
        margin: 18px 4px 0;
        overflow: hidden;
        border: 1px solid #d5e0eb;
        border-radius: 13px;
        background: rgba(255, 255, 255, .48);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition .portfolio-clean-composition-tab {
        flex: 1 1 0;
        height: 40px;
        padding: 0 10px;
        border: 0;
        border-radius: 0 !important;
        color: #fff;
        font-size: 12px !important;
        cursor: pointer;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition .portfolio-clean-composition-tab.is-active {
        box-shadow: inset 0 -3px 0 rgba(38, 57, 78, .34);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition .portfolio-clean-rows {
        display: block;
        min-height: 0;
        padding: 0;
        overflow: visible;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition .portfolio-clean-row {
        display: grid !important;
        grid-template-columns: minmax(230px, .95fr) minmax(0, 1.5fr) !important;
        align-items: center;
        gap: 18px;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 88px;
        padding: 17px 4px;
        border: 0;
        border-bottom: 1px solid #d5e0eb;
        border-radius: 0;
        background: transparent !important;
        box-sizing: border-box;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition .portfolio-clean-row-title {
        display: grid;
        grid-template-columns: 84px 12px auto minmax(0, 1fr) auto;
        align-items: center;
        gap: 7px;
        width: 100%;
        min-width: 0;
        min-height: 54px;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: transparent !important;
        color: #182638;
        text-align: left;
        cursor: grab;
        box-shadow: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-thumbnail {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 84px;
        height: 54px;
        overflow: hidden;
        border-radius: 10px;
        background: #e5edf4;
        color: #607a95;
        font-size: 10px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-thumbnail img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-thumbnail > span {
        display: flex;
        width: 100%;
        height: 100%;
        align-items: center;
        justify-content: center;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-thumbnail .mode-video { background: #dce9f8; }
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-thumbnail .mode-photo { background: #e4f0d9; }
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-thumbnail .mode-files { background: #fff0bd; }
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-thumbnail .mode-audio { background: #efddf2; }
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-thumbnail .mode-blog { background: #e9e0f5; }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-drag {
        color: #8aa0b6;
        font-size: 12px;
        letter-spacing: -4px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-row-number {
        color: #344b63;
        font-size: 13px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-row-name {
        min-width: 0;
        overflow: hidden;
        font-size: 14px;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-row-mode {
        padding: 5px 8px;
        border-radius: 8px;
        background: #dfeaf5;
        color: #56708d;
        font-size: 10px;
        line-height: 1;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-row-controls {
        display: flex !important;
        align-items: center;
        justify-content: flex-end;
        gap: 12px;
        min-width: 0 !important;
        overflow: visible !important;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-toggle {
        display: inline-flex !important;
        flex: 0 0 58px;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 5px;
        min-width: 58px;
        min-height: 44px;
        padding: 0;
        border: 0 !important;
        border-radius: 0;
        background: transparent !important;
        color: #172231 !important;
        box-shadow: none !important;
        cursor: pointer;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-toggle strong {
        font-size: 10px;
        font-weight: 400;
        line-height: 1;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-toggle-placeholder {
        opacity: .48;
        cursor: default;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-remove-placeholder {
        visibility: hidden;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-shared-list {
        margin: 24px 4px 0;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-share-details {
        margin: 18px 4px 0;
    }

    @media (max-width: 1279px) {
        body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-toolbar {
            grid-template-columns: minmax(190px, 1fr) auto;
        }

        body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-utility-pill {
            grid-column: 2;
        }

        body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-settings {
            grid-template-columns: minmax(150px, 1fr) auto auto;
        }

        body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-copy-link {
            grid-column: 3;
        }

        body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition .portfolio-clean-row {
            grid-template-columns: 1fr !important;
            gap: 10px;
        }

        body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-row-controls {
            justify-content: flex-start;
            padding-left: 103px;
        }
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-live-pane {
        position: relative;
        min-width: 0;
        min-height: 0;
        overflow: visible;
        border-left: 1px solid #cfddea;
        background: #f6f4ed;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-live-divider {
        position: absolute;
        z-index: 8;
        top: 0;
        bottom: 0;
        left: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 6px;
        width: 18px;
        padding: 0;
        transform: translateX(-50%);
        color: #8b8b88;
        font: 400 12px/1 "Avenir Next", "Segoe UI", sans-serif;
        touch-action: none;
        cursor: col-resize;
        pointer-events: auto;
        user-select: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-live-divider:focus-visible {
        outline: 2px solid #9dbfe3;
        outline-offset: -2px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-live-divider span {
        display: block;
        width: 12px;
        height: 12px;
        border: 5px solid rgba(255, 203, 70, .32);
        border-radius: 50%;
        background: #ffc83f;
        background-clip: padding-box;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-live-divider em {
        font-style: normal;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-split-shell.is-divider-disabled .portfolio-manager-live-divider {
        cursor: default;
        pointer-events: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-split-shell.is-divider-resizing,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-split-shell.is-divider-resizing * {
        cursor: col-resize !important;
        user-select: none !important;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-split-shell.is-divider-resizing .portfolio-manager-live-frame {
        pointer-events: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-live-frame-wrap {
        position: absolute;
        inset: 0;
        overflow: hidden;
        background: var(--portfolio-manager-canvas, #f2f0ea);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-live-frame {
        position: absolute;
        top: 0;
        left: 0;
        display: block;
        border: 0;
        opacity: 0;
        transform-origin: top left;
        background: var(--portfolio-manager-canvas, #f2f0ea);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-split-shell.is-live-ready .portfolio-manager-live-frame {
        opacity: 1;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-live-loading {
        position: absolute;
        z-index: 2;
        top: 50%;
        left: 50%;
        margin: 0;
        transform: translate(-50%, -50%);
        color: #6f7f8e;
        font: 400 13px/1.3 "Avenir Next", "Segoe UI", sans-serif;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-split-shell.is-live-ready .portfolio-manager-live-loading {
        display: none;
    }
}

.portfolio-presentation-dialog {
    width: min(1040px, calc(100vw - 48px));
    max-width: none;
    max-height: min(86vh, 900px);
    margin: auto;
    padding: 0;
    overflow: hidden;
    border: 1px solid #cbd9e7;
    border-radius: 22px;
    background: #f2f0ea;
    color: #203247;
    box-shadow: 0 24px 80px rgba(30, 45, 61, .2);
    font-family: "Avenir Next", "Segoe UI", sans-serif;
}

.portfolio-presentation-dialog::backdrop {
    background: rgba(24, 34, 45, .32);
    backdrop-filter: blur(3px);
}

.portfolio-presentation-dialog-shell {
    display: flex;
    max-height: min(86vh, 900px);
    flex-direction: column;
}

.portfolio-presentation-dialog-head {
    display: flex;
    flex: 0 0 auto;
    align-items: flex-start;
    justify-content: space-between;
    gap: 28px;
    padding: 28px 30px 24px;
    border-bottom: 1px solid #d5e0eb;
}

.portfolio-presentation-dialog-head h2 {
    margin: 0;
    color: #15263a;
    font-size: 24px;
    font-weight: 600;
    line-height: 1.2;
}

.portfolio-presentation-dialog-head p {
    max-width: 680px;
    margin: 8px 0 0;
    color: #63758a;
    font-size: 13px;
    line-height: 1.5;
}

.portfolio-presentation-dialog-close {
    display: inline-flex;
    flex: 0 0 42px;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    padding: 0;
    border: 1px solid #cbd9e7;
    border-radius: 50%;
    background: rgba(255, 255, 255, .52);
    color: #6b84a0;
    font-size: 24px;
    font-weight: 300;
    line-height: 1;
    cursor: pointer;
}

.portfolio-presentation-dialog-body {
    min-height: 180px;
    padding: 24px 30px 30px;
    overflow: auto;
}

.portfolio-presentation-dialog-loading,
.portfolio-presentation-empty,
.portfolio-presentation-selected > p {
    margin: 24px 0;
    color: #6d7e91;
    font-size: 13px;
}

.portfolio-presentation-warning {
    margin: 0 0 18px;
    padding: 10px 12px;
    border: 1px solid #ead6a4;
    border-radius: 10px;
    background: #fff8e5;
    color: #765b1d;
    font-size: 12px;
}

.portfolio-presentation-selected {
    margin-bottom: 22px;
    padding: 16px 18px;
    border: 1px solid #d5e0eb;
    border-radius: 14px;
    background: rgba(255, 255, 255, .5);
}

.portfolio-presentation-selected h3 {
    margin: 0 0 10px;
    font-size: 13px;
    font-weight: 600;
}

.portfolio-presentation-selected ol {
    display: grid;
    gap: 6px;
    margin: 0;
    padding-left: 28px;
}

.portfolio-presentation-selected li {
    min-height: 30px;
    padding-left: 2px;
}

.portfolio-presentation-selected li,
.portfolio-presentation-order-controls {
    display: flex;
    align-items: center;
}

.portfolio-presentation-selected li {
    justify-content: space-between;
    gap: 14px;
}

.portfolio-presentation-selected li > span:first-child {
    display: grid;
    min-width: 0;
}

.portfolio-presentation-selected li > span:first-child strong,
.portfolio-presentation-selected li > span:first-child small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.portfolio-presentation-selected li > span:first-child small {
    color: #78899b;
    font-size: 10px;
    font-weight: 400;
}

.portfolio-presentation-order-controls {
    gap: 4px;
}

.portfolio-presentation-order-controls button {
    width: 28px;
    height: 28px;
    padding: 0;
    border: 1px solid #cad8e6;
    border-radius: 50%;
    background: transparent;
    color: #5f7894;
    cursor: pointer;
}

.portfolio-presentation-order-controls button:disabled {
    opacity: .32;
    cursor: default;
}

.portfolio-hero-source-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
    margin: 0 0 18px;
}

.portfolio-hero-source-tabs {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 10px;
}

.portfolio-hero-source-tabs button {
    min-width: 92px;
    min-height: 40px;
    padding: 0 18px;
    border: 1px solid #cbd9e7;
    border-radius: 12px;
    background: rgba(255, 255, 255, .52);
    color: #526a84;
    font-weight: 400;
    cursor: pointer;
}

.portfolio-hero-source-tabs button:hover,
.portfolio-hero-source-tabs button:focus-visible {
    border-color: #9fbbd8;
    background: #f4f7fa;
}

.portfolio-hero-source-tabs button.is-active {
    border-color: #b8cde1;
    background: #e5edf6;
    color: #203247;
}

.portfolio-presentation-dialog.is-portfolio-hero-dialog .portfolio-presentation-save-status {
    flex: 0 0 auto;
    margin: 0 0 0 auto;
    color: #63758a;
    font-size: 12px;
}

.portfolio-presentation-dialog.is-portfolio-hero-dialog .portfolio-presentation-save-status.is-error {
    color: #c9474f;
}

.portfolio-presentation-dialog.is-portfolio-hero-dialog .portfolio-presentation-dialog-close,
.portfolio-presentation-dialog.is-portfolio-hero-dialog .portfolio-presentation-dialog-close:hover,
.portfolio-presentation-dialog.is-portfolio-hero-dialog .portfolio-presentation-dialog-close:active,
.portfolio-presentation-dialog.is-portfolio-hero-dialog .portfolio-presentation-dialog-close:focus-visible {
    border-color: #cbd9e7;
    background: rgba(255, 255, 255, .52);
    color: #6b84a0;
}

.portfolio-presentation-dialog.is-portfolio-hero-dialog .portfolio-presentation-dialog-close:hover,
.portfolio-presentation-dialog.is-portfolio-hero-dialog .portfolio-presentation-dialog-close:focus-visible {
    border-color: #9fbbd8;
    background: #e5edf6;
    color: #203247;
}

.portfolio-hero-browser-head {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 40px;
    margin: 0;
}

.portfolio-hero-browser-head[hidden] {
    display: none;
}

.portfolio-hero-browser-head [data-hero-back] {
    min-width: 40px;
    min-height: 38px;
    padding: 0 12px;
    border-radius: 10px;
}

.portfolio-presentation-dialog.is-portfolio-hero-dialog .portfolio-hero-browser-head [data-hero-back],
.portfolio-presentation-dialog.is-portfolio-hero-dialog .portfolio-hero-browser-head [data-hero-back]:hover,
.portfolio-presentation-dialog.is-portfolio-hero-dialog .portfolio-hero-browser-head [data-hero-back]:active,
.portfolio-presentation-dialog.is-portfolio-hero-dialog .portfolio-hero-browser-head [data-hero-back]:focus-visible {
    border: 1px solid #cbd9e7;
    background: rgba(255, 255, 255, .52);
    color: #526a84;
}

.portfolio-presentation-dialog.is-portfolio-hero-dialog .portfolio-hero-browser-head [data-hero-back]:hover,
.portfolio-presentation-dialog.is-portfolio-hero-dialog .portfolio-hero-browser-head [data-hero-back]:focus-visible {
    border-color: #9fbbd8;
    background: #f4f7fa;
    color: #203247;
}

.portfolio-hero-browser-head strong {
    font-size: 14px;
    font-weight: 600;
}

.portfolio-presentation-media-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px 14px;
}

.portfolio-presentation-media-card {
    display: block;
    min-width: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: #26394e;
    text-align: left;
    cursor: pointer;
}

.portfolio-presentation-media-visual {
    position: relative;
    display: block;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    border: 2px solid transparent;
    border-radius: 12px;
    background: #dfe7ee;
    transition: border-color .15s ease, box-shadow .15s ease;
}

.portfolio-presentation-media-visual::after {
    position: absolute;
    z-index: 1;
    inset: 0;
    content: "";
    pointer-events: none;
    background: linear-gradient(0deg, rgba(8, 24, 38, .58), rgba(8, 24, 38, .08) 58%, rgba(8, 24, 38, .18));
    opacity: 0;
    transition: opacity .16s ease;
}

.portfolio-presentation-media-card:hover .portfolio-presentation-media-visual,
.portfolio-presentation-media-card:focus-visible .portfolio-presentation-media-visual {
    border-color: #9fbbd8;
}

.portfolio-presentation-media-card.is-selected .portfolio-presentation-media-visual {
    border-color: #62d58e;
    box-shadow: 0 0 0 3px rgba(98, 213, 142, .2);
}

.portfolio-presentation-media-card.is-selected .portfolio-presentation-media-visual::after {
    opacity: 1;
}

.portfolio-presentation-dialog.is-portfolio-hero-dialog .portfolio-presentation-media-card.is-selected {
    background: transparent;
    color: #26394e;
}

.portfolio-presentation-dialog.is-portfolio-hero-dialog .portfolio-presentation-media-card,
.portfolio-presentation-dialog.is-portfolio-hero-dialog .portfolio-presentation-media-card:hover,
.portfolio-presentation-dialog.is-portfolio-hero-dialog .portfolio-presentation-media-card:active,
.portfolio-presentation-dialog.is-portfolio-hero-dialog .portfolio-presentation-media-card:focus-visible {
    background: transparent;
    color: #26394e;
}

.portfolio-presentation-dialog.is-portfolio-hero-dialog .portfolio-presentation-media-card.is-selected .portfolio-presentation-media-visual {
    border-color: #8eb4d9;
    box-shadow: 0 0 0 3px rgba(142, 180, 217, .18);
}

.portfolio-presentation-dialog.is-portfolio-hero-dialog .portfolio-presentation-media-card.is-selected .portfolio-presentation-media-visual::after {
    background: none;
    opacity: 0;
}

.portfolio-presentation-media-visual img,
.portfolio-presentation-media-visual video,
.portfolio-presentation-media-empty {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.portfolio-presentation-media-order {
    position: absolute;
    z-index: 2;
    top: 8px;
    right: 8px;
    display: none;
    align-items: center;
    justify-content: center;
    min-width: 27px;
    height: 27px;
    padding: 0 7px;
    border-radius: 999px;
    background: #62d58e;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
}

.portfolio-presentation-media-card.is-selected .portfolio-presentation-media-order {
    display: inline-flex;
}

.portfolio-presentation-dialog.is-portfolio-hero-dialog .portfolio-presentation-media-order {
    border: 1px solid #9fbbd8;
    background: #e5edf6;
    color: #203247;
}

.portfolio-presentation-media-card > strong,
.portfolio-presentation-media-card > small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.portfolio-presentation-media-card > strong {
    margin: 8px 2px 0;
    font-size: 12px;
    font-weight: 600;
}

.portfolio-presentation-media-card > small {
    margin: 2px 2px 0;
    color: #78899b;
    font-size: 10px;
}

.portfolio-presentation-text-label {
    display: grid;
    gap: 9px;
    color: #26394e;
    font-size: 12px;
    font-weight: 600;
}

.portfolio-presentation-text-label textarea {
    width: 100%;
    min-height: 150px;
    padding: 15px 16px;
    resize: vertical;
    border: 1px solid #cbd9e7;
    border-radius: 14px;
    outline: none;
    background: rgba(255, 255, 255, .62);
    color: #203247;
    font: 400 14px/1.5 "Avenir Next", "Segoe UI", sans-serif;
    box-sizing: border-box;
}

.portfolio-presentation-text-label textarea:focus {
    border-color: #8eb4d9;
    box-shadow: 0 0 0 3px rgba(142, 180, 217, .16);
}

.portfolio-presentation-text-label small {
    justify-self: end;
    color: #8291a0;
    font-weight: 400;
}

.portfolio-presentation-dialog-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 26px;
    padding-top: 20px;
    border-top: 1px solid #d5e0eb;
}

.portfolio-presentation-dialog-actions button {
    min-height: 40px;
    padding: 0 18px;
    border-radius: 12px;
}

.portfolio-presentation-dialog-actions .portfolio-presentation-save {
    border-color: #69cf91;
    background: #69cf91;
    color: #fff;
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-placeholder-action.is-configured {
    border-color: #74cf98;
    background: rgba(105, 207, 145, .12);
    color: #377d53;
}

@media (max-width: 700px) {
    .portfolio-presentation-dialog {
        width: calc(100vw - 24px);
        max-height: calc(100vh - 24px);
        border-radius: 16px;
    }

    .portfolio-presentation-dialog-shell {
        max-height: calc(100vh - 24px);
    }

    .portfolio-presentation-dialog-head,
    .portfolio-presentation-dialog-body {
        padding: 20px;
    }

    .portfolio-presentation-media-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .portfolio-hero-source-row {
        align-items: flex-start;
    }

    .portfolio-hero-source-tabs {
        gap: 8px;
    }

    .portfolio-hero-source-tabs button {
        min-width: 72px;
        padding: 0 12px;
    }

    .portfolio-presentation-dialog-actions {
        flex-wrap: wrap;
    }
}

@media (max-width: 899px) {
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-split-shell,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-editor {
        display: contents;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-live-pane {
        display: none;
    }

    body.projects-dashboard.dashboard-portfolio-context-open .dashboard-shell-control-cluster {
        display: none !important;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-editor > .portfolio-clean-page {
        display: block;
        width: calc(100% - 28px) !important;
        height: auto;
        min-height: 100%;
        margin: 0 14px !important;
        padding: 22px 0 48px;
        box-sizing: border-box;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-panel,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-panel button,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-panel input {
        font-family: "Avenir Next", "Segoe UI", sans-serif;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-toolbar {
        position: relative;
        z-index: 8;
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: 14px 10px;
        padding: 0 2px 20px;
        border-bottom: 1px solid #d5e0eb;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-add-projects {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        min-width: 0;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: transparent;
        color: #26394e;
        box-shadow: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-add-projects > span {
        display: inline-flex;
        flex: 0 0 36px;
        align-items: center;
        justify-content: center;
        width: 36px;
        height: 36px;
        border: 1px solid #cbd9e7;
        border-radius: 50%;
        color: #6e86a0;
        font-size: 22px;
        font-weight: 300;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-add-projects > strong {
        overflow: hidden;
        font-size: 13px;
        font-weight: 400;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-switch,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-utility-pill {
        display: inline-flex;
        align-items: stretch;
        min-height: 38px;
        overflow: hidden;
        border: 1px solid #cbd9e7;
        border-radius: 14px;
        background: rgba(255, 255, 255, .72);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-switch {
        grid-column: 1;
        justify-self: start;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-utility-pill {
        grid-column: 2;
        overflow: visible;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-switch .portfolio-clean-layout {
        min-height: 38px;
        padding: 0 14px;
        border: 0;
        border-radius: 0;
        background: transparent;
        color: #526d8c;
        font-size: 11px;
        box-shadow: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-switch .portfolio-clean-layout + .portfolio-clean-layout {
        border-left: 1px solid #d5e0eb;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-switch .portfolio-clean-layout.is-active {
        background: #e8f2ff;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-utility-pill > button,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-menu-wrap > button {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 42px;
        min-width: 42px;
        height: 38px;
        padding: 0;
        border: 0;
        border-left: 1px solid #d5e0eb;
        border-radius: 0;
        background: transparent;
        color: #607c98;
        box-shadow: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-utility-pill > button:first-child {
        border-left: 0;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-menu-wrap {
        position: relative;
        display: flex;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-utility-pill svg {
        width: 19px;
        height: 19px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.65;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-menu {
        position: absolute;
        z-index: 30;
        top: calc(100% + 7px);
        right: 0;
        display: grid;
        min-width: 176px;
        padding: 7px;
        border: 1px solid #cbd9e7;
        border-radius: 13px;
        background: var(--portfolio-manager-control-surface, #f8f5f1);
        box-shadow: 0 12px 30px rgba(39, 63, 88, .14);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-menu[hidden] {
        display: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-menu button {
        min-height: 38px;
        padding: 0 10px;
        border: 0;
        border-radius: 8px;
        background: transparent;
        color: #26394e;
        font: 400 12px/1 "Avenir Next", "Segoe UI", sans-serif;
        text-align: left;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-operation-status {
        margin: 9px 2px -3px;
        color: #617a95;
        font-size: 11px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-operation-status[hidden] {
        display: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-operation-status.is-error {
        color: #c63d48;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-settings {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: 12px;
        padding: 20px 2px;
        border-bottom: 1px solid #d5e0eb;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-name {
        display: block;
        min-width: 0;
        overflow: hidden;
        padding: 10px 13px;
        border-radius: 10px;
        background: #bbbcb9;
        color: #fff;
        font-size: 13px;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-password {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        min-height: 38px;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: transparent;
        color: #172231;
        box-shadow: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-password > span,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-switch {
        position: relative;
        display: inline-block;
        flex: 0 0 38px;
        width: 38px;
        height: 20px;
        border-radius: 999px;
        background: #bfc3c7;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-password i,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-switch i {
        position: absolute;
        top: 2px;
        left: 2px;
        display: block;
        width: 16px;
        height: 16px;
        border-radius: 50%;
        background: #fff;
        box-shadow: 0 1px 3px rgba(20, 33, 47, .2);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-password.is-on > span,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-toggle.is-on .portfolio-manager-switch {
        background: #69d58d;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-password.is-on i,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-toggle.is-on .portfolio-manager-switch i {
        transform: translateX(18px);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-password strong {
        font-size: 11px;
        font-weight: 400;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-placeholder-action,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-copy-link,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-remove {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 36px;
        padding: 0 13px;
        border: 1px solid #cbd9e7;
        border-radius: 11px;
        background: rgba(255, 255, 255, .76);
        color: #172231;
        font-size: 11px;
        font-weight: 400;
        white-space: nowrap;
        box-shadow: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-placeholder-action:disabled {
        opacity: .62;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker {
        margin-bottom: 20px;
        padding-bottom: 20px;
        border-bottom: 1px solid #d5e0eb;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source {
        display: grid;
        grid-template-columns: 82px minmax(0, 1fr);
        width: 100%;
        min-height: 210px;
        overflow: hidden;
        border: 1px solid #d5e0eb;
        border-radius: 14px;
        background: rgba(255, 255, 255, .52);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-tabs {
        display: flex !important;
        flex-direction: column;
        border: 0;
        border-right: 1px solid #d5e0eb;
        border-radius: 0 !important;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-tab {
        flex: 0 0 40px !important;
        width: 100% !important;
        height: 40px;
        margin: 0 !important;
        border: 0 !important;
        border-bottom: 1px solid #dce5ed !important;
        border-radius: 0 !important;
        background: transparent !important;
        color: #607a95 !important;
        font-size: 10px !important;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-tab.is-active {
        background: #eaf2fa !important;
        color: #26394e !important;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-body {
        min-height: 210px;
        max-height: 300px;
        padding: 12px;
        overflow: auto;
        border-radius: 0;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-list {
        display: grid;
        gap: 8px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-list[hidden] {
        display: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-item,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-drag {
        min-height: 38px;
        padding: 7px 10px;
        border: 1px solid #d7e2ed;
        border-radius: 10px;
        background: rgba(255, 255, 255, .86);
        color: #2f4760;
        font-size: 11px;
        text-align: left;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition {
        position: relative;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        overflow: visible !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition .portfolio-clean-composition-tabs {
        position: static;
        display: flex;
        min-height: 38px;
        margin: 15px 2px 0;
        overflow: hidden;
        border: 1px solid #d5e0eb;
        border-radius: 12px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition .portfolio-clean-composition-tab {
        flex: 1 1 0;
        height: 38px;
        padding: 0 5px;
        border: 0;
        border-radius: 0 !important;
        color: #fff;
        font-size: 10px !important;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition .portfolio-clean-rows {
        display: block;
        min-height: 0;
        padding: 0;
        overflow: visible;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition .portfolio-clean-row {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        padding: 16px 2px;
        border: 0;
        border-bottom: 1px solid #d5e0eb;
        border-radius: 0;
        background: transparent !important;
        box-sizing: border-box;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition .portfolio-clean-row-title {
        display: grid;
        grid-template-columns: 76px 10px auto minmax(0, 1fr) auto;
        align-items: center;
        gap: 6px;
        width: 100%;
        min-width: 0;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: transparent !important;
        color: #182638;
        text-align: left;
        box-shadow: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-thumbnail {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 76px;
        height: 48px;
        overflow: hidden;
        border-radius: 9px;
        background: #e5edf4;
        color: #607a95;
        font-size: 9px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-thumbnail img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-thumbnail > span {
        display: flex;
        width: 100%;
        height: 100%;
        align-items: center;
        justify-content: center;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-drag {
        color: #8aa0b6;
        font-size: 10px;
        letter-spacing: -4px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-row-number,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-row-name {
        font-size: 12px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-row-name {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-row-mode {
        padding: 4px 6px;
        border-radius: 7px;
        background: #dfeaf5;
        color: #56708d;
        font-size: 9px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-row-controls {
        display: flex !important;
        align-items: center;
        gap: 8px;
        min-width: 0 !important;
        margin-top: 12px;
        padding-left: 92px;
        overflow-x: auto !important;
        scrollbar-width: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-row-controls::-webkit-scrollbar {
        display: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-toggle {
        display: inline-flex !important;
        flex: 0 0 52px;
        flex-direction: column;
        align-items: center;
        gap: 4px;
        min-width: 52px;
        min-height: 40px;
        padding: 0;
        border: 0 !important;
        border-radius: 0;
        background: transparent !important;
        color: #172231 !important;
        box-shadow: none !important;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-toggle strong {
        font-size: 9px;
        font-weight: 400;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-toggle-placeholder {
        opacity: .48;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-remove-placeholder {
        visibility: hidden;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-share-details,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-shared-list {
        margin: 18px 2px 0;
    }
}

/* Revised portfolio manager -------------------------------------------------
   The manager and the live/picker stage share the dashboard's established
   content rail. These rules are deliberately presentation-only: the controls
   retain the data attributes and event paths used by the existing manager. */
@media (min-width: 900px) {
    body.projects-dashboard.portfolio-page-route #portfolio-route-root {
        --portfolio-manager-canvas: var(--dashboard-canvas-background, #f2f0ea);
        overflow: hidden;
        background: var(--portfolio-manager-canvas);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-split-shell {
        --portfolio-manager-row-title-width: 164px;
        --portfolio-manager-row-column-gap: 22px;
        display: grid;
        grid-template-columns: clamp(560px, var(--portfolio-manager-left-column, 55%), calc(100% - 430px)) minmax(430px, 1fr);
        grid-template-rows: 81px auto minmax(0, 1fr);
        width: var(--dashboard-content-rail-width, min(1330px, calc(100vw - 76px)));
        max-width: var(--dashboard-content-rail-width, min(1330px, calc(100vw - 76px)));
        height: 100%;
        min-height: 0;
        margin: 0 auto;
        overflow: visible;
        background: var(--portfolio-manager-canvas);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-toolbar,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-right-toolbar {
        position: relative;
        z-index: 12;
        display: flex;
        align-items: center;
        min-width: 0;
        min-height: 0;
        padding: 0 28px;
        border-bottom: 1px solid #d5e0eb;
        background: var(--portfolio-manager-canvas);
        box-sizing: border-box;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-left-toolbar {
        grid-column: 1;
        grid-row: 1;
        gap: clamp(16px, 1.7vw, 30px);
        padding-left: 0;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-right-toolbar {
        grid-column: 2;
        grid-row: 1;
        justify-content: flex-end;
        gap: 26px;
        padding-right: 0;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-share-pane {
        grid-column: 1 / -1;
        grid-row: 2;
        min-width: 0;
        min-height: 0;
        max-height: min(460px, 44vh);
        padding: 18px 0;
        overflow: auto;
        overscroll-behavior: contain;
        scrollbar-width: none;
        -ms-overflow-style: none;
        border-bottom: 1px solid #d5e0eb;
        background: var(--portfolio-manager-canvas);
        box-sizing: border-box;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-share-pane[hidden] {
        display: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-share-pane > .portfolio-clean-share-details {
        width: 100%;
        margin: 0;
        box-sizing: border-box;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-share-pane .portfolio-clean-share-generate {
        grid-column: 5;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-share-pane .portfolio-clean-share-form input[hidden] {
        display: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-editor {
        grid-column: 1;
        grid-row: 3;
        display: block;
        min-width: 0;
        min-height: 0;
        overflow: auto;
        scrollbar-width: none;
        -ms-overflow-style: none;
        background: var(--portfolio-manager-canvas);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-editor > .portfolio-clean-page {
        display: flex;
        flex-direction: column;
        width: 100% !important;
        height: 100%;
        min-height: 100%;
        margin: 0 !important;
        padding: 30px 28px 60px 0;
        box-sizing: border-box;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-live-pane {
        grid-column: 2;
        grid-row: 3;
        position: relative;
        display: block;
        min-width: 0;
        min-height: 0;
        overflow: visible;
        border-left: 1px solid #cfddea;
        background: var(--portfolio-manager-canvas);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-right-stage {
        position: absolute;
        inset: 0;
        min-width: 0;
        min-height: 0;
        overflow: hidden;
        background: var(--portfolio-manager-canvas);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-add-projects {
        flex: 0 1 auto;
        gap: 12px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-add-projects > span {
        flex-basis: 38px;
        width: 38px;
        height: 38px;
        font-size: 23px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-add-projects > strong {
        font-size: 13px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-switch {
        display: inline-flex;
        flex: 0 0 auto;
        align-items: center;
        gap: 9px;
        min-height: 40px;
        padding: 0 13px;
        overflow: visible;
        border: 1px solid #cbd9e7;
        border-radius: 13px;
        background: rgba(255, 255, 255, .58);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-switch .portfolio-clean-layout {
        min-height: 38px;
        padding: 0;
        border: 0;
        background: transparent !important;
        color: #506c8b;
        font-size: 12px;
        font-weight: 400;
        box-shadow: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-switch .portfolio-clean-layout + .portfolio-clean-layout {
        border-left: 0;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-switch .portfolio-clean-layout.is-active {
        color: #314d6c;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-track {
        position: relative;
        display: inline-block;
        appearance: none;
        flex: 0 0 40px;
        width: 40px;
        height: 22px;
        min-height: 22px;
        padding: 0;
        border: 0;
        border-radius: 999px;
        background: #f2f2f0;
        box-shadow: inset 0 0 0 1px #dfe4e8;
        cursor: pointer;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-track i {
        position: absolute;
        top: 2px;
        left: 2px;
        width: 18px;
        height: 18px;
        border-radius: 50%;
        background: #9dbfe3;
        box-shadow: 0 1px 3px rgba(39, 63, 88, .18);
        transition: transform .16s ease;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-track.is-tab i {
        transform: translateX(18px);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-track:focus-visible {
        outline: 2px solid #8eb1d4;
        outline-offset: 2px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-password {
        flex: 0 0 auto;
        flex-direction: column;
        justify-content: center;
        gap: 4px;
        min-width: 58px;
        min-height: 48px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-password > span,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-switch {
        flex: 0 0 20px;
        width: 38px;
        height: 20px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-password i,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-switch i {
        width: 16px;
        height: 16px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-password.is-on i,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-toggle.is-on .portfolio-manager-switch i {
        transform: translateX(18px);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-password strong {
        font-size: 10px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-left-toolbar > .portfolio-manager-add-hero {
        min-width: 92px;
        min-height: 36px;
        padding: 0 15px;
        border-radius: 10px;
        font-size: 12px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-view-switch {
        display: inline-flex;
        flex: 0 0 auto;
        min-height: 32px;
        margin-right: auto;
        overflow: hidden;
        border: 1px solid #cbd9e7;
        border-radius: 10px;
        background: rgba(255, 255, 255, .58);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-view-switch button {
        min-width: 68px;
        min-height: 32px;
        padding: 0 13px;
        border: 0;
        background: transparent;
        color: #172231;
        font: 400 12px/1 "Avenir Next", "Segoe UI", sans-serif;
        cursor: pointer;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-view-switch button + button {
        border-left: 1px solid #cbd9e7;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-view-switch button.is-active {
        background: #69d28e;
        color: #172231;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-view-switch button:focus-visible {
        outline: 2px solid #8eb1d4;
        outline-offset: -2px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-utility-pill {
        min-height: 40px;
        border-radius: 14px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-utility-pill > button,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-menu-wrap > button {
        width: 48px;
        min-width: 48px;
        height: 40px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-operation-status {
        margin: 0 0 12px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition {
        display: flex;
        flex: 1 0 auto;
        flex-direction: column;
        width: 100% !important;
        margin: 0 !important;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition .portfolio-clean-composition-tabs {
        margin: 0 0 18px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition .portfolio-clean-rows {
        display: block !important;
        position: relative;
        flex: 1 0 auto;
        min-height: 220px;
        padding: 0 0 56px;
        overflow: visible;
        box-sizing: border-box;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition .portfolio-clean-rows.is-drop-target {
        outline: 1px dashed #91abc5;
        outline-offset: -1px;
        background: rgba(220, 233, 246, .22);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-empty-drop-guide {
        position: absolute;
        inset: 0 0 56px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 36px;
        color: #52677d;
        text-align: center;
        pointer-events: none;
        box-sizing: border-box;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-empty-drop-guide strong,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-picker-empty strong {
        color: #2f4760;
        font-size: 16px;
        font-weight: 500;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-empty-drop-guide span,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-picker-empty span {
        max-width: 420px;
        font-size: 14px;
        line-height: 1.5;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-picker-empty {
        display: flex;
        grid-row: 1 / -1;
        height: 100%;
        min-height: 0;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 36px;
        color: #52677d;
        text-align: center;
        box-sizing: border-box;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition .portfolio-clean-row {
        display: grid !important;
        grid-template-columns: var(--portfolio-manager-row-title-width) minmax(0, 1fr) !important;
        align-items: center;
        gap: var(--portfolio-manager-row-column-gap);
        width: 100% !important;
        min-width: 0 !important;
        min-height: 138px;
        padding: 18px 0;
        border: 0;
        border-bottom: 1px solid #d5e0eb;
        border-radius: 0;
        background: transparent !important;
        box-sizing: border-box;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition .portfolio-clean-row-title {
        display: block !important;
        width: 164px;
        min-width: 0;
        min-height: 0 !important;
        padding: 0;
        border: 0;
        background: transparent !important;
        color: #24384d;
        text-align: left;
        box-shadow: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-thumbnail {
        display: flex;
        width: 164px;
        height: 92px;
        overflow: hidden;
        border-radius: 11px;
        background: #e5edf4;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-thumbnail img,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-thumbnail > span {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-thumbnail > span {
        display: flex;
        align-items: center;
        justify-content: center;
        color: #607a95;
        font-size: 10px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-row-caption {
        display: flex;
        align-items: center;
        gap: 6px;
        min-width: 0;
        padding: 8px 4px 0;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-row-name {
        min-width: 0;
        overflow: hidden;
        font-size: 12px;
        font-weight: 500;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-drag {
        display: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-row-number,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-row-mode {
        display: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-row-controls {
        display: grid !important;
        grid-template-columns: minmax(76px, 92px) repeat(3, minmax(58px, 72px)) minmax(70px, 88px);
        align-items: center;
        justify-content: end;
        gap: 6px;
        min-width: 0 !important;
        padding: 0;
        overflow: visible !important;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-placeholders {
        display: grid;
        gap: 5px;
        width: 100%;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-placeholders .portfolio-manager-placeholder-action,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-placeholders .portfolio-manager-card-layout,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-placeholders .portfolio-manager-card-layout button {
        width: 100%;
        min-width: 0;
        min-height: 29px;
        padding: 0 8px;
        box-sizing: border-box;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-placeholders .portfolio-manager-placeholder-action,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-placeholders .portfolio-manager-card-layout button {
        border: 1px solid #cbd9e7;
        border-radius: 8px;
        background: var(--portfolio-manager-canvas);
        color: #172231;
        font-family: inherit;
        font-size: 10px;
        font-weight: 400;
        line-height: 1;
        white-space: nowrap;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-placeholders .portfolio-manager-card-layout {
        display: block;
        height: auto;
        overflow: visible;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: transparent;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-placeholders .portfolio-manager-card-layout button {
        cursor: pointer;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-placeholders .portfolio-manager-card-layout button:hover,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-placeholders .portfolio-manager-card-layout button:focus-visible {
        border-color: #adc1d5;
        background: var(--portfolio-manager-canvas);
        outline: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-toggle {
        display: inline-flex !important;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 5px;
        width: 58px;
        min-width: 58px;
        min-height: 44px;
        padding: 0;
        border: 0 !important;
        border-radius: 0;
        background: transparent !important;
        color: #172231 !important;
        box-shadow: none !important;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-toggle strong {
        font-size: 9px;
        font-weight: 400;
        line-height: 1;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-password i,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-toggle .portfolio-manager-switch i {
        background: var(--portfolio-manager-canvas);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-remove {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        min-width: 70px;
        height: 29px;
        min-height: 29px;
        padding: 0 10px;
        border: 1px solid #cbd9e7;
        border-radius: 8px;
        background: var(--portfolio-manager-canvas);
        color: #172231;
        font-size: 10px;
        font-weight: 400;
        line-height: 1;
        white-space: nowrap;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-remove-placeholder {
        visibility: hidden;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker {
        width: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
        border: 0;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-picker-pane {
        position: absolute;
        z-index: 5;
        inset: 0;
        overflow: hidden;
        background: var(--portfolio-manager-canvas);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-picker-pane[hidden] {
        display: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: 74px minmax(0, 1fr);
        width: 100%;
        height: 100%;
        min-height: 0;
        overflow: hidden;
        border: 0;
        border-radius: 0;
        background: var(--portfolio-manager-canvas);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-tabs {
        display: flex !important;
        flex-direction: row;
        align-items: end;
        justify-content: center;
        gap: 25px !important;
        padding: 0 20px 15px;
        border: 0;
        background: var(--portfolio-manager-canvas);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-tab {
        position: relative;
        flex: 0 0 auto !important;
        width: auto !important;
        height: 40px;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        color: #526d8c !important;
        font-size: 15px !important;
        font-weight: 400 !important;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-tab.is-active {
        background: transparent !important;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-tab.is-active::after {
        position: absolute;
        bottom: 1px;
        left: 50%;
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: #e83544;
        content: "";
        transform: translateX(-50%);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-body {
        min-height: 0;
        max-height: none;
        padding: 26px 28px 60px;
        overflow: auto;
        border-radius: 0;
        box-sizing: border-box;
        overscroll-behavior: contain;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-list {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        align-items: start;
        gap: 18px 14px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-list[hidden] {
        display: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder {
        grid-column: 1 / -1;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-card {
        display: contents;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-card.is-expanded {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        align-items: start;
        gap: 18px 14px;
        padding: 12px;
        border: 1px solid #aeb5bb;
        border-radius: 10px;
        box-sizing: border-box;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-children {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 18px 14px;
        margin-top: 14px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-children[hidden] {
        display: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-item {
        position: relative;
        display: block;
        width: 100%;
        height: auto !important;
        min-height: 0 !important;
        padding: 0;
        overflow: hidden;
        border: 0;
        border-radius: 0;
        background: transparent;
        color: #26394e;
        text-align: left;
        box-shadow: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-picker-thumbnail {
        position: relative;
        display: flex;
        width: 100%;
        aspect-ratio: 1.58 / 1;
        overflow: hidden;
        border-radius: 9px;
        background: #e5edf4;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-picker-thumbnail img,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-picker-thumbnail > span {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-picker-thumbnail > span {
        display: flex;
        align-items: center;
        justify-content: center;
        color: #607a95;
        font-size: 10px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-item > strong {
        display: block;
        min-width: 0;
        padding: 7px 3px 0;
        overflow: hidden;
        font-size: 11px;
        font-weight: 500;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-row {
        display: grid;
        grid-template-columns: 30px minmax(0, 1fr);
        align-items: center;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-card .portfolio-clean-source-folder-row {
        position: relative;
        display: block;
        min-width: 0;
        height: auto;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-card.is-expanded > .portfolio-clean-source-children {
        display: contents;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-card > .portfolio-clean-source-children[hidden] {
        display: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-drag {
        min-height: 38px !important;
        height: 38px !important;
        border-radius: 9px;
        font-size: 11px !important;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-card .portfolio-clean-source-folder-drag {
        position: relative;
        display: block;
        width: 100%;
        height: auto !important;
        min-height: 0 !important;
        padding: 0;
        overflow: hidden;
        border: 0;
        border-radius: 0;
        background: transparent;
        color: #26394e;
        box-shadow: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-card .portfolio-clean-source-folder-drag > strong {
        display: block;
        min-width: 0;
        padding: 7px 3px 0;
        overflow: hidden;
        font-size: 11px;
        font-weight: 500;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-picker-folder-thumbnail > img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-picker-folder-projects {
        position: absolute;
        top: 9px;
        left: 9px;
        display: flex !important;
        width: calc(100% - 54px) !important;
        height: auto !important;
        flex-direction: column;
        align-items: flex-start !important;
        gap: 2px;
        color: #26394e;
        font-size: 8px !important;
        line-height: 1.15;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-picker-folder-projects > span {
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-picker-folder-thumbnail > em {
        position: absolute;
        right: 8px;
        bottom: 7px;
        padding: 3px 5px;
        border-radius: 999px;
        background: rgba(248, 246, 241, .9);
        color: #52657a;
        font-size: 7px;
        font-style: normal;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-card .portfolio-clean-source-folder-toggle {
        position: absolute;
        z-index: 2;
        top: 7px;
        right: 7px;
        display: grid;
        width: 30px;
        min-width: 30px;
        height: 30px !important;
        min-height: 30px !important;
        aspect-ratio: 1;
        padding: 0;
        place-items: center;
        border: 1px solid rgba(141, 157, 169, .7);
        border-radius: 50%;
        background: rgba(248, 246, 241, .94);
        color: #40566f;
        cursor: pointer;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-card .portfolio-clean-source-folder-toggle span {
        font-size: 16px;
        line-height: 1;
        transform: translateY(-1px);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-split-shell.is-picker-open .portfolio-manager-live-divider span,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-split-shell.is-picker-open .portfolio-manager-live-divider em {
        opacity: 0;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-live-frame-wrap {
        position: absolute;
        inset: 0;
    }
}

@media (min-width: 900px) and (max-width: 1180px) {
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-split-shell {
        --portfolio-manager-row-title-width: 145px;
        --portfolio-manager-row-column-gap: 14px;
        grid-template-columns: clamp(560px, var(--portfolio-manager-left-column, 55%), calc(100% - 430px)) minmax(430px, 1fr);
        overflow-x: auto;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-left-toolbar {
        gap: 8px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-add-projects > strong {
        max-width: 130px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-left-toolbar > .portfolio-manager-add-hero {
        min-width: 80px;
        padding: 0 10px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition .portfolio-clean-row {
        grid-template-columns: var(--portfolio-manager-row-title-width) minmax(0, 1fr) !important;
        gap: var(--portfolio-manager-row-column-gap);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition .portfolio-clean-row-title,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-thumbnail {
        width: 145px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-thumbnail {
        height: 82px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-row-controls {
        gap: 5px;
    }
}

@media (max-width: 899px) {
    body.projects-dashboard.portfolio-page-route #portfolio-route-root {
        overflow-y: auto;
        background: #f8f7f2;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-split-shell,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-editor {
        display: block !important;
        width: 100%;
        height: auto;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-toolbar,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-right-toolbar {
        display: flex;
        align-items: center;
        gap: 10px;
        width: calc(100% - 28px);
        min-height: 70px;
        margin: 0 14px;
        padding: 12px 2px;
        border-bottom: 1px solid #d5e0eb;
        box-sizing: border-box;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-left-toolbar {
        flex-wrap: wrap;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-right-toolbar {
        justify-content: flex-end;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-view-switch {
        display: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-switch {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        min-height: 38px;
        padding: 0 10px;
        border: 1px solid #cbd9e7;
        border-radius: 12px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-track {
        position: relative;
        width: 36px;
        height: 20px;
        border-radius: 999px;
        background: #f2f2f0;
        box-shadow: inset 0 0 0 1px #dfe4e8;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-track i {
        position: absolute;
        top: 2px;
        left: 2px;
        width: 16px;
        height: 16px;
        border-radius: 50%;
        background: #9dbfe3;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-track.is-tab i {
        transform: translateX(16px);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-live-pane {
        display: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-split-shell.is-picker-open .portfolio-manager-live-pane {
        display: block;
        width: calc(100% - 28px);
        min-height: 520px;
        margin: 0 14px 30px;
        border: 1px solid #d5e0eb;
        border-radius: 14px;
        overflow: hidden;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-split-shell.is-picker-open .portfolio-manager-live-frame-wrap,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-live-divider {
        display: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-right-stage,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-picker-pane,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source {
        position: static;
        width: 100%;
        height: 520px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker {
        margin: 0;
        padding: 0;
        border: 0;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source {
        display: grid;
        grid-template-columns: 82px minmax(0, 1fr);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-body {
        max-height: none;
        overflow: auto;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-picker-thumbnail {
        display: flex;
        width: 100%;
        aspect-ratio: 1.58 / 1;
        overflow: hidden;
        border-radius: 8px;
        background: #e5edf4;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-picker-thumbnail img,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-picker-thumbnail > span {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-item {
        display: block;
        height: auto !important;
        padding: 0;
        border: 0;
        background: transparent;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-item > strong {
        display: block;
        padding: 6px 2px;
        overflow: hidden;
        font-size: 10px;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-card {
        display: contents;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-card.is-expanded {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: repeat(auto-fill, minmax(145px, 1fr));
        align-items: start;
        gap: 10px;
        padding: 12px;
        border: 1px solid #aeb5bb;
        border-radius: 9px;
        box-sizing: border-box;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-card .portfolio-clean-source-folder-row {
        position: relative;
        display: block;
        min-width: 0;
        height: auto;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-card .portfolio-clean-source-folder-drag {
        position: relative;
        display: block;
        width: 100%;
        height: auto !important;
        min-height: 0 !important;
        padding: 0;
        overflow: hidden;
        border: 0;
        border-radius: 0;
        background: transparent;
        color: #26394e;
        box-shadow: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-card .portfolio-clean-source-folder-drag > strong {
        display: block;
        min-width: 0;
        padding: 6px 2px;
        overflow: hidden;
        font-size: 10px;
        font-weight: 500;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-card .portfolio-clean-source-folder-toggle {
        position: absolute;
        z-index: 2;
        top: 7px;
        right: 7px;
        display: grid;
        width: 30px;
        min-width: 30px;
        height: 30px !important;
        min-height: 30px !important;
        padding: 0;
        place-items: center;
        border: 1px solid rgba(141, 157, 169, .7);
        border-radius: 50%;
        background: rgba(248, 246, 241, .94);
        color: #40566f;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-card.is-expanded > .portfolio-clean-source-children {
        display: contents;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-card > .portfolio-clean-source-children[hidden] {
        display: none;
    }
}

/* Keep the control system authoritative after the legacy responsive rules. */
body.projects-dashboard.portfolio-page-route #portfolio-route-root {
    --portfolio-manager-control-surface: #f8f5f1;
    --portfolio-manager-control-active: #edf4fb;
    --portfolio-manager-control-border: #c9d8e8;
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-utility-pill {
    background: var(--portfolio-manager-control-surface);
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-utility-pill > button[data-share].is-active {
    background: var(--portfolio-manager-control-active) !important;
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-placeholder-action,
body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-placeholder-action.is-configured {
    border-color: var(--portfolio-manager-control-border);
    background: var(--portfolio-manager-control-surface);
    color: #172231;
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-placeholder-action.is-configured {
    background: var(--portfolio-manager-control-active);
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-password i,
body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-toggle .portfolio-manager-switch i {
    background: var(--portfolio-manager-control-surface);
}

@media (min-width: 900px) {
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-left-toolbar {
        gap: clamp(26px, 3.2vw, 54px);
        padding-right: 18px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-right-toolbar {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 20px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-mobile-project-picker {
        display: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-toolbar-group {
        display: flex;
        flex: 0 0 auto;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        gap: 8px;
        min-width: 0;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-toolbar-label {
        color: #172231;
        font-size: 10px;
        font-weight: 400;
        line-height: 1;
        white-space: nowrap;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-toolbar-controls {
        display: flex;
        align-items: center;
        gap: 8px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-settings-group {
        flex: 1 1 auto;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-website-layout-group {
        margin-left: auto;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-view-group {
        justify-self: center;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-settings-group .portfolio-manager-password {
        flex-direction: row;
        justify-content: flex-start;
        gap: 7px;
        min-width: 92px;
        min-height: 34px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-settings-group .portfolio-manager-password > span {
        order: 2;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-settings-group .portfolio-manager-password strong {
        order: 1;
        font-size: 10px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-left-toolbar > .portfolio-manager-toolbar-group .portfolio-manager-add-hero,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-left-toolbar > .portfolio-manager-toolbar-group .portfolio-manager-add-text {
        min-width: 72px;
        min-height: 34px;
        padding: 0 12px;
        border: 1px solid var(--portfolio-manager-control-border);
        border-radius: 9px;
        background: var(--portfolio-manager-control-surface);
        color: #172231;
        font-size: 10px;
        font-weight: 400;
        line-height: 1;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-left-toolbar > .portfolio-manager-toolbar-group .portfolio-manager-add-hero.is-configured,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-left-toolbar > .portfolio-manager-toolbar-group .portfolio-manager-add-text.is-configured {
        background: var(--portfolio-manager-control-active);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-switch,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-view-switch {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: stretch;
        gap: 0;
        min-height: 34px;
        padding: 0;
        overflow: hidden;
        border: 1px solid var(--portfolio-manager-control-border);
        border-radius: 9px;
        background: var(--portfolio-manager-control-surface);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-switch {
        width: 104px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-view-switch {
        width: 152px;
        min-height: 34px;
        margin: 0;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-switch .portfolio-clean-layout,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-view-switch button {
        width: 100%;
        min-width: 0;
        min-height: 32px;
        padding: 0 8px;
        border: 0;
        border-radius: 0;
        background: var(--portfolio-manager-control-surface) !important;
        color: #172231;
        font-size: 10px;
        font-weight: 400;
        line-height: 1;
        box-shadow: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-switch .portfolio-clean-layout + .portfolio-clean-layout,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-view-switch button + button {
        border-left: 1px solid var(--portfolio-manager-control-border);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-switch .portfolio-clean-layout.is-active,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-view-switch button.is-active {
        background: var(--portfolio-manager-control-active) !important;
        color: #172231;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition {
        --portfolio-manager-row-media-height: 92px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition .portfolio-clean-row {
        align-items: start;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-row-controls {
        grid-template-columns: var(--portfolio-manager-action-columns, 92px repeat(3, 58px) 34px);
        align-items: start;
        align-self: start;
        justify-content: space-between;
        gap: 0;
        height: var(--portfolio-manager-row-media-height);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-placeholders {
        grid-template-rows: repeat(3, minmax(0, 1fr));
        height: 100%;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-placeholders.is-without-hero {
        align-self: center;
        grid-template-rows: repeat(2, minmax(0, 1fr));
        height: 61px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-placeholders .portfolio-manager-placeholder-action,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-placeholders .portfolio-manager-card-layout,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-placeholders .portfolio-manager-card-layout button {
        height: 100%;
        min-height: 0;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-body {
        scrollbar-width: none;
        -ms-overflow-style: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-share-pane::-webkit-scrollbar,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-editor::-webkit-scrollbar,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-body::-webkit-scrollbar {
        display: none;
        width: 0;
        height: 0;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-placeholders .portfolio-manager-placeholder-action,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-placeholders .portfolio-manager-card-layout button,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-remove {
        border-color: var(--portfolio-manager-control-border);
        background: var(--portfolio-manager-control-surface);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-placeholders .portfolio-manager-card-layout button,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-placeholders .portfolio-manager-placeholder-action,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-placeholders .portfolio-manager-placeholder-action.is-configured,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-placeholders .portfolio-manager-card-layout button:hover,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-placeholders .portfolio-manager-placeholder-action:hover {
        border-color: var(--portfolio-manager-control-border);
        background: var(--portfolio-manager-control-surface);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-placeholders .portfolio-manager-card-layout button:focus-visible,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-row-placeholders .portfolio-manager-placeholder-action:focus-visible {
        border-color: var(--portfolio-manager-control-border);
        background: var(--portfolio-manager-control-surface);
        outline: 2px solid #8eb1d4;
        outline-offset: 1px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-toggle {
        align-self: center;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-toggle .portfolio-manager-switch {
        flex: 0 0 24px;
        width: 46px;
        height: 24px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-toggle .portfolio-manager-switch i {
        width: 20px;
        height: 20px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-toggle.is-on .portfolio-manager-switch i {
        transform: translateX(22px);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-toggle strong {
        font-size: 10px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-remove {
        align-self: center;
        justify-self: center;
        width: 24px;
        min-width: 24px;
        height: 24px;
        min-height: 24px;
        padding: 0;
        border-radius: 50%;
        font-size: 15px;
        font-weight: 300;
        transform: translateY(-7px);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root button.portfolio-clean-remove:hover,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root button.portfolio-clean-remove:active,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root button.portfolio-clean-remove:focus-visible {
        border-color: #f43b45;
        background: #fff;
        color: #f43b45;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root button.portfolio-clean-remove:focus-visible {
        outline: 2px solid rgba(244, 59, 69, .28);
        outline-offset: 2px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-split-shell:not(.is-picker-open) .portfolio-manager-live-pane {
        border-left: 0;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-split-shell:not(.is-picker-open) .portfolio-manager-live-divider::before {
        content: "";
        position: absolute;
        z-index: 0;
        top: 0;
        left: 50%;
        width: 1px;
        height: 100%;
        transform: translateX(-50%);
        background: linear-gradient(
            to bottom,
            #cfddea 0,
            #cfddea calc(50% - 15px),
            transparent calc(50% - 15px),
            transparent calc(50% + 15px),
            #cfddea calc(50% + 15px),
            #cfddea 100%
        );
        pointer-events: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-live-divider span,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-live-divider em {
        position: relative;
        z-index: 1;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-live-divider em {
        display: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-live-divider span {
        width: 10px;
        height: 10px;
        border: 0;
        border-radius: 50%;
        background: #727980;
        background-clip: border-box;
        box-shadow: none;
        opacity: .5;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-live-divider span::before,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-live-divider span::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        z-index: -1;
        width: 12px;
        height: 12px;
        border: 1px solid rgba(103, 110, 117, .78);
        border-radius: 50%;
        background: transparent;
        box-sizing: border-box;
        box-shadow: none;
        opacity: 0;
        transform: translate(-50%, -50%) scale(.85);
        pointer-events: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-live-divider span::after {
        border-color: rgba(153, 159, 165, .68);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-split-shell.is-live-ready:not(.is-picker-open) .portfolio-manager-live-divider span::before,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-split-shell.is-live-ready:not(.is-picker-open) .portfolio-manager-live-divider span::after {
        animation: portfolioManagerLiveSignalRing 1.8s ease-out infinite;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-split-shell.is-live-ready:not(.is-picker-open) .portfolio-manager-live-divider span::after {
        animation-delay: .6s;
    }
}

@keyframes portfolioManagerLiveSignalRing {
    0% {
        opacity: 0;
        transform: translate(-50%, -50%) scale(.85);
    }
    16% {
        opacity: .82;
        transform: translate(-50%, -50%) scale(1);
    }
    72% {
        opacity: .2;
        transform: translate(-50%, -50%) scale(2.1);
    }
    100% {
        opacity: 0;
        transform: translate(-50%, -50%) scale(2.1);
    }
}

@media (prefers-reduced-motion: reduce) {
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-split-shell.is-live-ready:not(.is-picker-open) .portfolio-manager-live-divider span::before,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-split-shell.is-live-ready:not(.is-picker-open) .portfolio-manager-live-divider span::after {
        animation: none;
        opacity: .34;
        transform: translate(-50%, -50%) scale(1.55);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-split-shell.is-live-ready:not(.is-picker-open) .portfolio-manager-live-divider span::after {
        opacity: .2;
        transform: translate(-50%, -50%) scale(2.1);
    }
}

/* Project-picker folder cards share this alignment in Video, Photo, Files,
   Audio, and Notes Collections. The controls retain their existing hooks. */
body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-manager-picker-folder-thumbnail {
    position: relative;
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-manager-picker-folder-thumbnail > em {
    position: absolute;
    right: auto;
    bottom: 7px;
    left: 7px;
    padding: 3px 5px;
    border-radius: 999px;
    background: rgba(248, 246, 241, .9);
    color: #52657a;
    font-size: 7px;
    font-style: normal;
    line-height: 1;
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-card .portfolio-clean-source-folder-toggle {
    right: auto;
    left: 7px;
    align-items: center;
    justify-items: center;
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-card .portfolio-clean-source-folder-toggle > span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 12px;
    height: 8px;
    font-size: 0;
    line-height: 0;
    transform: none;
    transform-origin: center;
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-card .portfolio-clean-source-folder-toggle > span > svg {
    display: block;
    width: 12px;
    height: 8px;
    overflow: visible;
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-card.is-expanded .portfolio-clean-source-folder-toggle > span {
    transform: rotate(180deg);
}

@media (min-width: 900px) and (max-width: 1180px) {
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-left-toolbar {
        gap: 18px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition {
        --portfolio-manager-row-media-height: 82px;
    }
}

@media (max-width: 899px) {
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-toolbar-group,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-toolbar-controls {
        display: contents;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-toolbar-label {
        display: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-mobile-project-picker {
        display: inline-flex;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-switch {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0;
        min-width: 132px;
        padding: 0;
        overflow: hidden;
        border-color: var(--portfolio-manager-control-border);
        background: var(--portfolio-manager-control-surface);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-switch .portfolio-clean-layout {
        min-height: 36px;
        border: 0;
        border-radius: 0;
        background: var(--portfolio-manager-control-surface) !important;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-switch .portfolio-clean-layout + .portfolio-clean-layout {
        border-left: 1px solid var(--portfolio-manager-control-border);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-switch .portfolio-clean-layout.is-active {
        background: var(--portfolio-manager-control-active) !important;
    }
}

/* Portfolio Manager toolbar consolidation ---------------------------------
   These rules intentionally sit after every legacy responsive layer. The
   controls keep their established data hooks; only their presentation and
   toolbar grouping change here. */
body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-options[hidden] {
    display: none !important;
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-body {
    border: 0;
    background: var(--portfolio-manager-canvas, #f2f0ea);
}

@media (min-width: 900px) {
    body.projects-dashboard.portfolio-page-route #portfolio-route-root {
        --portfolio-manager-action-columns: 92px repeat(3, 58px) 34px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-left-toolbar {
        display: grid;
        grid-template-columns: var(--portfolio-manager-row-title-width) minmax(0, 1fr);
        align-items: center;
        gap: var(--portfolio-manager-row-column-gap);
        /* Match the editor's right inset so header and row columns agree. */
        padding-right: 28px;
        overflow: visible;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-mobile-project-picker {
        display: inline-flex;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-add-projects {
        flex: 0 0 auto;
        gap: 12px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-add-projects > span {
        flex-basis: 42px;
        width: 42px;
        height: 42px;
        font-size: 25px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-add-projects > strong {
        max-width: none;
        font-size: 13px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-left-toolbar > .portfolio-manager-add-projects {
        min-width: 0;
        width: 100%;
        justify-content: flex-start;
        white-space: normal;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-wrap {
        display: flex;
        align-items: center;
        min-width: 0;
        container: portfolio-layout / inline-size;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-pill {
        flex: 0 1 auto;
        min-width: 0;
        max-width: 100%;
        display: inline-flex;
        align-items: stretch;
        min-height: 42px;
        overflow: hidden;
        border: 1px solid var(--portfolio-manager-control-border);
        border-radius: 14px;
        background: var(--portfolio-manager-control-surface);
        box-sizing: border-box;
        box-shadow: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-trigger,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-options > button {
        flex: 1 1 auto;
        min-width: 0;
        min-height: 40px;
        height: 40px;
        padding: 0 14px;
        border: 0;
        border-radius: 0;
        background: var(--portfolio-manager-control-surface) !important;
        color: #172231;
        font: 400 12px/1 "Avenir Next", "Segoe UI", sans-serif;
        white-space: normal;
        box-shadow: none;
        cursor: pointer;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-options {
        flex: 1 1 auto;
        display: inline-flex;
        align-items: stretch;
        min-width: 0;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-trigger {
        flex: 0 0 90px;
        width: 90px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-options > button {
        border-left: 1px solid var(--portfolio-manager-control-border);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-options > .portfolio-clean-layout.is-active {
        background: var(--portfolio-manager-control-active) !important;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-options > button:not(.is-active):not(.is-configured):hover {
        background: var(--portfolio-manager-control-surface) !important;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-trigger:focus-visible,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-options > button:focus-visible {
        position: relative;
        z-index: 1;
        outline: 2px solid #8eb1d4;
        outline-offset: -3px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-right-toolbar {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 0;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-view-switch {
        position: absolute;
        left: 50%;
        width: 136px;
        min-height: 42px;
        margin: 0;
        overflow: hidden;
        border: 1px solid var(--portfolio-manager-control-border);
        border-radius: 14px;
        background: var(--portfolio-manager-control-surface);
        transform: translateX(-50%);
        box-sizing: border-box;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-view-switch button {
        width: 100%;
        min-width: 0;
        min-height: 40px;
        height: 40px;
        padding: 0 10px;
        border: 0;
        border-radius: 0;
        background: var(--portfolio-manager-control-surface) !important;
        color: #172231;
        font: 400 13px/1 "Avenir Next", "Segoe UI", sans-serif;
        box-shadow: none;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-view-switch button + button {
        border-left: 0;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-view-switch button.is-active {
        background: var(--portfolio-manager-control-active) !important;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-utility-pill {
        margin-left: auto;
    }
}

@media (max-width: 899px) {
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-wrap {
        display: flex;
        flex: 1 1 100%;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px 14px;
        min-width: 0;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-pill {
        min-width: 0;
        max-width: 100%;
        display: inline-flex;
        align-items: stretch;
        min-height: 38px;
        overflow: hidden;
        border: 1px solid var(--portfolio-manager-control-border);
        border-radius: 12px;
        background: var(--portfolio-manager-control-surface);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-trigger,
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-options > button {
        flex: 0 0 auto;
        min-width: 0;
        min-height: 36px;
        padding: 0 11px;
        border: 0;
        border-radius: 0;
        background: var(--portfolio-manager-control-surface) !important;
        color: #172231;
        font: 400 11px/1 "Avenir Next", "Segoe UI", sans-serif;
        white-space: nowrap;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-options {
        display: inline-flex;
        align-items: stretch;
        min-width: 0;
        /* Keep the original horizontal menu accessible on small screens. */
        overflow-x: auto;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-trigger {
        width: 86px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-options > button {
        border-left: 1px solid var(--portfolio-manager-control-border);
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-options > .portfolio-clean-layout.is-active {
        background: var(--portfolio-manager-control-active) !important;
    }
}

/* Membership remains visible in the picker at every screen size and layout. */
body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-item.is-in-portfolio,
body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-project-picker .portfolio-clean-source-folder-drag.is-in-portfolio {
    opacity: .48;
}

/* Portfolio navigation selections use a restrained layer of the Live blue. */
body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-view-switch button.is-active,
body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-options > .portfolio-clean-layout.is-active,
body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-options > .is-configured {
    background: rgba(157, 191, 227, .18) !important;
}

@container portfolio-layout (max-width: 420px) {
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-layout-options > button {
        padding-inline: 2px;
        font-size: 11px;
    }
}

/* Composition tabs share the manager controls' neutral surfaces. */
body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition .portfolio-clean-composition-tabs {
    background: var(--portfolio-manager-control-surface);
    border-color: var(--portfolio-manager-control-border);
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition .portfolio-clean-composition-tab {
    background: transparent;
    color: #172231;
    box-shadow: none;
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition .portfolio-clean-composition-tab.is-active {
    background: rgba(157, 191, 227, .18) !important;
    box-shadow: none;
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition .portfolio-clean-composition-tab:not(.is-active):hover {
    background: rgba(157, 191, 227, .09);
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition .portfolio-clean-composition-tab:focus-visible {
    outline: 2px solid #8eb1d4 !important;
    outline-offset: -2px;
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition .portfolio-clean-row.is-portfolio-newly-added {
    animation: portfolio-added-feedback 2s ease-out;
}

/* Files projects use the same folder-row language as Live View, reduced to two
   rows for the Manager's landscape thumbnails. The overlay never owns input. */
body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-files-thumbnail {
    position: relative;
    isolation: isolate;
    background: #f8f7f2;
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-files-thumbnail > img {
    position: absolute;
    z-index: 0;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-files-thumbnail > .portfolio-manager-files-preview {
    position: absolute;
    z-index: 1;
    inset: 7px;
    display: grid;
    width: auto;
    height: auto;
    grid-template-rows: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    justify-content: stretch;
    gap: 4px;
    pointer-events: none;
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-files-row {
    display: flex;
    min-width: 0;
    padding: 3px 6px;
    flex-direction: column;
    justify-content: center;
    gap: 1px;
    overflow: hidden;
    border: 1px solid rgba(207, 221, 236, .92);
    border-radius: 6px;
    background: rgba(249, 248, 246, .7);
    color: #1c2e44;
    box-sizing: border-box;
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-files-row.is-goodybag {
    border-color: #dce7f3;
    background: #f6f9fd;
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-files-name,
body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-files-count {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-files-name {
    font: 400 10px/1.08 "Avenir Next", "Segoe UI", sans-serif;
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-files-count {
    color: #778ca5;
    font: 500 8px/1.08 "Avenir Next", "Segoe UI", sans-serif;
}

/* Preserve the shared overview styling without losing to older, more
   specific manager thumbnail/placeholder rules. */
body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-note-thumbnail,
body.projects-dashboard .portfolio-manager-note-thumbnail {
    container-type: inline-size;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .78), rgba(203, 204, 199, .42)),
        #d5d5d0;
}

body.projects-dashboard .portfolio-card-note-preview {
    display: block;
    width: 100%;
    height: 100%;
    min-width: 0;
    overflow: hidden;
}

body.projects-dashboard .portfolio-card-note-preview > :is(img, video) {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-note-thumbnail > video,
body.projects-dashboard .portfolio-manager-note-thumbnail > video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-note-thumbnail > .portfolio-manager-note-preview,
body.projects-dashboard .portfolio-manager-note-thumbnail > .portfolio-manager-note-preview {
    display: flex;
    width: 100%;
    height: 100%;
    padding: clamp(5px, 5.5cqi, 14px);
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    overflow: hidden;
    color: #20252a;
    text-align: left;
    box-sizing: border-box;
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-note-preview strong,
body.projects-dashboard .portfolio-manager-note-preview strong {
    display: -webkit-box;
    overflow: hidden;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(6px, 4.5cqi, 14px);
    font-weight: 600;
    line-height: 1.08;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-note-preview time,
body.projects-dashboard .portfolio-manager-note-preview time {
    margin-top: clamp(2px, 1.8cqi, 6px);
    color: #586a7e;
    font: 400 clamp(4px, 1.8cqi, 7px)/1.1 "Avenir Next", "Segoe UI", sans-serif;
}

body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-note-excerpt,
body.projects-dashboard .portfolio-manager-note-excerpt {
    display: -webkit-box;
    overflow: hidden;
    margin-top: clamp(3px, 3cqi, 9px);
    color: #39434d;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(5px, 2.2cqi, 9px);
    line-height: 1.35;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

@media (max-width: 899px) {
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-files-thumbnail > .portfolio-manager-files-preview {
        inset: 4px;
        gap: 3px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-files-row {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        padding: 2px 4px;
        gap: 3px;
        border-radius: 4px;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-files-name {
        font-size: 8px;
        line-height: 1;
    }

    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-files-count {
        font-size: 7px;
        line-height: 1;
    }
}

@keyframes portfolio-added-feedback {
    from { box-shadow: inset 0 0 0 2px rgba(157, 191, 227, .8); }
    to { box-shadow: inset 0 0 0 2px transparent; }
}

@media (prefers-reduced-motion: reduce) {
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-manager-composition .portfolio-clean-row.is-portfolio-newly-added {
        animation-timing-function: step-end;
    }
}

/* Desktop Files/Notes have no Comments control. Retain the first permission
   slot so Download and Collaboration stay aligned; do not hide the separate
   collaboration placeholder belonging to Notes collections. */
@media (min-width: 900px) {
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-row.mode-files .portfolio-clean-row-controls > [data-setting="allow_comments"],
    body.projects-dashboard.portfolio-page-route #portfolio-route-root .portfolio-clean-row.mode-blog .portfolio-clean-row-controls > .portfolio-clean-toggle-placeholder:nth-child(2) {
        /* Override the builder's base visibility: visible !important rule. */
        visibility: hidden !important;
        pointer-events: none;
    }
}