:root {
        --bg-main: #0d1117;
        --bg-panel: #161b22;
        --bg-hover: #21262d;
        --text-main: #c9d1d9;
        --text-muted: #8b949e;
        --blue: #58a6ff;
        --blue-hover: #79c0ff;
        --blue-text: #9ccdff;
        --blue-soft: rgba(88,166,255,.12);
        --blue-border: rgba(88,166,255,.34);
        --green: #3fb950;
        --green-hover: #56d364;
        --green-text: #7ee787;
        --green-soft: rgba(63,185,80,.12);
        --green-border: rgba(63,185,80,.36);
        --amber: #d29922;
        --amber-text: #e3b341;
        --amber-soft: rgba(210,153,34,.13);
        --amber-border: rgba(210,153,34,.42);
        --red: #f85149;
        --red-text: #ff938a;
        --red-soft: rgba(248,81,73,.12);
        --red-border: rgba(248,81,73,.38);
        --accent: var(--blue);
        --warn: var(--amber);
        --err: var(--red);
        --border: #30363d;
        --timeline-bg: #0b1015;
        --timeline-bg-soft: #10171f;
        --timeline-divider: rgba(82,93,106,.74);
        --timeline-divider-soft: rgba(82,93,106,.38);
        --wave-idle: #68717b;
        --wave-active: #acd6ff;
        --header-button-height: 32px;
        --header-button-radius: 5px;
        --panel-card-radius: 12px;
        --panel-card-padding-y: 14px;
        --panel-card-padding-x: 16px;
        --panel-row-radius: 10px;
        --control-transition-fast: 120ms ease;
        --control-transition: 190ms ease;
        --control-transition-slow: 260ms ease;
    }
    * { box-sizing: border-box; }
    body { background: var(--bg-main); color: var(--text-main); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif; margin: 0; height: 100vh; display: flex; flex-direction: column; overflow: hidden; }
    ::-webkit-scrollbar { width: 6px; height: 6px; }
    ::-webkit-scrollbar-track { background: transparent; }
    ::-webkit-scrollbar-thumb { background: #484f58; border-radius: 3px; }

    .top-bar {
        position: relative;
        height: 48px;
        min-height: 48px;
        border-bottom: 1px solid var(--border);
        background:
            linear-gradient(180deg, rgba(255,255,255,.018), rgba(13,17,23,.10)),
            var(--bg-panel);
        display: flex;
        align-items: center;
        padding: 0 16px;
        gap: 12px;
    }
    .top-identity,
    .top-nav-actions,
    .top-guide-actions,
    .top-project-group,
    .top-transport {
        display: flex;
        align-items: center;
        min-width: 0;
    }
    .top-identity {
        flex: 0 1 auto;
        min-width: 0;
        max-width: calc(50% - 220px);
        gap: 13px;
    }
    .top-nav-actions {
        gap: 6px;
        flex: 0 0 auto;
    }
    .top-guide-actions {
        flex: 0 0 auto;
        gap: 8px;
    }
    .top-spacer {
        flex: 1 1 auto;
        min-width: 24px;
    }
    .top-transport {
        gap: 12px;
        justify-content: flex-end;
        flex: 0 0 auto;
    }
    .top-transport-core {
        position: absolute;
        top: 8px;
        left: 50%;
        transform: translateX(-50%);
        display: inline-flex;
        align-items: center;
        gap: 8px;
        flex: 0 0 auto;
    }
    .top-focus-actions {
        display: none;
        align-items: center;
        gap: 8px;
        flex: 0 0 auto;
    }
    .top-export-actions {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        flex: 0 0 auto;
    }
    .top-export-actions::before {
        content: "";
        width: 1px;
        height: 26px;
        margin-right: 3px;
        background: rgba(139,148,158,.18);
        flex: 0 0 auto;
    }
    .app-brand {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        color: var(--text-main);
        font-size: 14.5px;
        font-weight: 700;
        text-decoration: none;
        white-space: nowrap;
        flex-shrink: 0;
    }
    .app-brand-icon {
        display: block;
        flex: 0 0 auto;
        filter: drop-shadow(0 0 5px rgba(88,166,255,.18));
    }
    .app-brand:hover {
        color: #f0f6fc;
    }
    .top-project-group {
        position: relative;
        gap: 6px;
        flex: 0 1 auto;
        max-width: min(220px, 100%);
        padding-left: 12px;
        border-left: 1px solid rgba(139,148,158,.18);
        font-size: 12px;
        line-height: 1;
    }
    .top-project-link {
        color: rgba(139,148,158,.78);
        text-decoration: none;
        font-weight: 620;
        white-space: nowrap;
    }
    .top-project-link:hover {
        color: var(--blue-text);
    }
    .top-project-separator {
        color: rgba(139,148,158,.55);
        flex: 0 0 auto;
    }
    .top-project-name {
        font-size: 12px;
        color: rgba(201,209,217,.86);
        flex: 1 1 auto;
        min-width: 0;
        max-width: 180px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        padding: 0 2px;
    }
    .top-project-name.is-truncated {
        cursor: default;
    }
    .project-name-tooltip {
        position: absolute;
        left: 0;
        top: calc(100% + 9px);
        z-index: 120;
        width: max-content;
        max-width: min(360px, calc(100vw - 24px));
        padding: 6px 9px;
        border: 1px solid rgba(139,148,158,.34);
        border-radius: 5px;
        background: rgba(13,17,23,.96);
        color: var(--text-main);
        box-shadow: 0 10px 24px rgba(0,0,0,.36);
        font-size: 11px;
        font-weight: 600;
        line-height: 1.25;
        letter-spacing: 0;
        pointer-events: none;
        visibility: hidden;
        opacity: 0;
        transform: translateY(4px);
        transition:
            opacity var(--control-transition-fast),
            transform var(--control-transition-fast),
            visibility 0s linear var(--control-transition-fast);
        overflow-wrap: anywhere;
    }
    .top-project-name.is-truncated:hover + .project-name-tooltip,
    .top-project-name.is-truncated:focus + .project-name-tooltip,
    .project-name-tooltip.visible {
        visibility: visible;
        opacity: 1;
        transform: translateY(0);
        transition:
            opacity var(--control-transition-fast),
            transform var(--control-transition-fast),
            visibility 0s;
    }
    .top-bar .top-back-btn,
    .top-bar .top-help-btn,
    .top-bar #automix-export-aaf-btn,
    .top-bar #suite-workflow-back-btn,
    .top-bar #suite-workflow-fullscreen-btn,
    .top-bar #suite-workflow-run-btn,
    .top-bar #btn-play,
    .top-bar #btn-raw-playback,
    .top-bar .master-volume-control {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding-top: 0;
        padding-bottom: 0;
        line-height: 1;
    }
    .top-bar .top-back-btn,
    .top-bar .top-help-btn {
        height: var(--header-button-height);
        min-height: var(--header-button-height);
        max-height: var(--header-button-height);
    }
    .top-bar #automix-export-aaf-btn,
    .top-bar #suite-workflow-back-btn,
    .top-bar #suite-workflow-fullscreen-btn,
    .top-bar #suite-workflow-run-btn,
    .top-bar #btn-play,
    .top-bar #btn-raw-playback,
    .top-bar .master-volume-control {
        height: var(--header-button-height);
        min-height: var(--header-button-height);
        max-height: var(--header-button-height);
    }
    .top-export-btn {
        min-width: 104px;
        padding-left: 14px;
        padding-right: 14px;
        border-radius: var(--header-button-radius);
        font-weight: 700;
        white-space: nowrap;
        flex-shrink: 0;
    }
    .top-export-btn:disabled {
        opacity: .45;
        cursor: not-allowed;
    }
    .top-bar #suite-workflow-run-btn.suite-embed-run-btn {
        display: none;
    }
    .top-bar #suite-workflow-back-btn.suite-embed-back-btn {
        display: none;
        min-width: 86px;
        width: auto;
        padding: 0 12px;
        gap: 7px;
        border: 1px solid rgba(139,148,158,.22);
        border-radius: var(--header-button-radius);
        background: rgba(139,148,158,.04);
        color: rgba(201,209,217,.72);
        flex: 0 0 auto;
        font-size: 11px;
        font-weight: 800;
        letter-spacing: .03em;
    }
    .top-bar #suite-workflow-fullscreen-btn.suite-embed-fullscreen-btn {
        display: none;
        min-width: 116px;
        width: 116px;
        padding: 0 10px;
        gap: 7px;
        border: 1px solid rgba(139,148,158,.22);
        border-radius: var(--header-button-radius);
        background: rgba(139,148,158,.04);
        color: rgba(201,209,217,.72);
        flex: 0 0 auto;
        font-size: 11px;
        font-weight: 800;
        letter-spacing: .03em;
    }
    .top-bar #suite-workflow-fullscreen-btn.suite-embed-fullscreen-btn:hover,
    .top-bar #suite-workflow-fullscreen-btn.suite-embed-fullscreen-btn.is-active {
        border-color: var(--blue-border);
        background: var(--blue-soft);
        color: var(--blue-text);
    }
    .suite-back-icon,
    .suite-fullscreen-icon {
        display: block;
        width: 15px;
        height: 15px;
    }
    .suite-back-label,
    .suite-fullscreen-label {
        line-height: 1;
        white-space: nowrap;
    }
    .top-bar #btn-play {
        width: 82px;
        flex: 0 0 82px;
        padding-left: 0;
        padding-right: 0;
        border: 1px solid var(--green-border);
        border-radius: var(--header-button-radius);
        background: var(--green-soft);
        color: var(--green-text);
        text-align: center;
        text-transform: uppercase;
    }
    .top-bar #btn-play:hover {
        border-color: var(--green);
        color: #aff5b4;
        background: rgba(63,185,80,.18);
    }
    .top-bar #btn-play.is-playing {
        border-color: var(--red-border);
        background: var(--red-soft);
        color: var(--red-text);
    }
    .top-bar #btn-play.is-playing:hover {
        border-color: var(--err);
        background: rgba(248,81,73,.18);
        color: #ffb3ad;
    }
    .top-bar #btn-raw-playback {
        width: 62px;
        min-width: 62px;
        flex: 0 0 62px;
        padding-left: 0;
        padding-right: 0;
        border-color: rgba(139,148,158,.22);
        border-radius: var(--header-button-radius);
        background: rgba(139,148,158,.04);
        color: rgba(201,209,217,.64);
    }
    .top-bar #btn-raw-playback:hover {
        border-color: rgba(139,148,158,.42);
        background: rgba(139,148,158,.11);
        color: var(--text-main);
    }
    .top-bar #btn-raw-playback.active {
        border-color: var(--amber-border);
        background: var(--amber-soft);
        color: var(--amber-text);
    }
    .master-volume-control {
        width: 118px;
        gap: 0;
        margin-left: 0;
        padding: 0 5px;
        justify-content: flex-start;
        align-items: center;
        border: 1px solid transparent;
        border-radius: var(--header-button-radius);
        background: transparent;
        color: rgba(201,209,217,.68);
        cursor: pointer;
        transition:
            background var(--control-transition),
            color var(--control-transition);
    }
    .master-volume-control:hover,
    .master-volume-control:focus-within {
        background: rgba(139,148,158,.055);
        color: var(--text-main);
    }
    .master-volume-icon {
        width: 14px;
        height: 14px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        color: currentColor;
    }
    .master-volume-icon:not(.master-volume-icon-loud) {
        margin-right: 3px;
    }
    .master-volume-icon-loud {
        width: 14px;
        height: 14px;
    }
    .master-volume-slider {
        --slider-progress: 100%;
        width: 66px;
        height: 20px;
        margin: 0 5px 0 0;
        padding: 0;
        -webkit-appearance: none;
        appearance: none;
        background: transparent;
        cursor: pointer;
        display: block;
    }
    .master-volume-slider::-webkit-slider-runnable-track {
        height: 4px;
        border-radius: 999px;
        background: linear-gradient(
            90deg,
            rgb(140,145,153) 0%,
            rgb(140,145,153) var(--slider-progress),
            rgba(139,148,158,.32) var(--slider-progress),
            rgba(139,148,158,.32) 100%
        );
    }
    .master-volume-slider::-webkit-slider-thumb {
        width: 7px;
        height: 18px;
        margin-top: -7px;
        -webkit-appearance: none;
        appearance: none;
        border: 0;
        border-radius: 2px;
        background: rgb(140,145,153);
        box-shadow: 0 1px 5px rgba(0,0,0,.35);
        transition:
            background var(--control-transition),
            box-shadow var(--control-transition);
    }
    .master-volume-slider:hover::-webkit-slider-thumb,
    .master-volume-control:focus-within .master-volume-slider::-webkit-slider-thumb {
        background: rgb(140,145,153);
        box-shadow: 0 1px 7px rgba(0,0,0,.4);
    }
    .master-volume-slider::-moz-range-track {
        height: 4px;
        border-radius: 999px;
        background: linear-gradient(
            90deg,
            rgb(140,145,153) 0%,
            rgb(140,145,153) var(--slider-progress),
            rgba(139,148,158,.32) var(--slider-progress),
            rgba(139,148,158,.32) 100%
        );
    }
    .master-volume-slider::-moz-range-thumb {
        width: 7px;
        height: 18px;
        border: 0;
        border-radius: 2px;
        background: rgb(140,145,153);
        box-shadow: 0 1px 5px rgba(0,0,0,.35);
        transition:
            background var(--control-transition),
            box-shadow var(--control-transition);
    }
    .master-volume-slider:hover::-moz-range-thumb,
    .master-volume-control:focus-within .master-volume-slider::-moz-range-thumb {
        background: rgb(140,145,153);
        box-shadow: 0 1px 7px rgba(0,0,0,.4);
    }
    .master-volume-slider:focus-visible {
        outline: none;
        box-shadow: none;
    }
    .master-volume-slider::-moz-focus-outer {
        border: 0;
    }
    .master-volume-percent {
        width: 28px;
        flex: 0 0 28px;
        text-align: right;
        font-family: ui-monospace, monospace;
        font-size: 10px;
        font-weight: 300;
        color: rgba(201,209,217,.64);
        line-height: 1;
        letter-spacing: .02em;
        font-variant-numeric: tabular-nums;
        font-feature-settings: "tnum" 1, "zero" 1;
    }
    .master-volume-control:focus-within {
        box-shadow: none;
    }
    .top-back-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding-left: 10px;
        padding-right: 11px;
        border: 1px solid var(--border);
        border-radius: var(--header-button-radius);
        background: rgba(139,148,158,.07);
        color: var(--text-muted);
        font-size: 11px;
        font-weight: 700;
        text-decoration: none;
        flex-shrink: 0;
    }
    .top-back-btn:hover {
        background: var(--bg-hover);
        color: var(--text-main);
        border-color: rgba(139,148,158,.42);
    }
    .top-help-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 62px;
        padding: 0 12px;
        border: 1px solid var(--green-border);
        border-radius: var(--header-button-radius);
        background: rgba(63,185,80,.055);
        color: var(--green-text);
        font-size: 10.5px;
        font-weight: 800;
        letter-spacing: .035em;
        text-transform: uppercase;
        cursor: pointer;
        flex-shrink: 0;
    }
    .top-help-btn:hover,
    .top-help-btn.active {
        border-color: var(--green);
        color: #aff5b4;
        background: rgba(63,185,80,.18);
    }
    @media (max-width: 820px) {
        .top-identity {
            max-width: none;
        }
        .app-brand {
            max-width: 142px;
            overflow: hidden;
            text-overflow: ellipsis;
        }
        .top-project-group {
            display: none;
        }
        .top-transport-core {
            position: static;
            transform: none;
        }
    }
    .clerk-auth {
        display: flex;
        align-items: center;
        min-width: 66px;
        justify-content: flex-end;
        color: var(--text-muted);
        font-size: 11px;
        flex-shrink: 0;
    }
    .clerk-auth[hidden] { display: none; }
    .clerk-auth[data-state="loading"],
    .clerk-auth[data-state="error"] {
        border: 1px solid var(--border);
        border-radius: 4px;
        padding: 4px 8px;
        background: var(--bg-hover);
    }
    .clerk-signin-btn {
        padding: 4px 10px;
        font-size: 11px;
        white-space: nowrap;
    }
    .license-status {
        border: 1px solid var(--blue-border);
        background: var(--blue-soft);
        color: var(--blue-hover);
        border-radius: 4px;
        padding: 3px 8px;
        font-size: 10px;
        font-weight: 800;
        letter-spacing: .03em;
        text-transform: uppercase;
        white-space: nowrap;
        max-width: 180px;
        overflow: auto;
        scrollbar-gutter: stable;
        text-overflow: ellipsis;
        flex-shrink: 0;
    }
    .license-status[data-state="trial"] {
        border-color: var(--amber-border);
        background: var(--amber-soft);
        color: var(--amber-text);
    }
    .license-status[data-state="pending"] {
        border-color: var(--border);
        background: var(--bg-hover);
        color: var(--text-muted);
    }
    body.auth-locked .landing,
    body.auth-locked #workspace {
        pointer-events: none;
        user-select: none;
        filter: grayscale(.35);
        opacity: .38;
    }
    .auth-lock {
        position: fixed;
        inset: 46px 0 0;
        z-index: 2000;
        display: flex;
        align-items: center;
        justify-content: center;
        pointer-events: none;
        overflow: auto;
        padding: 24px;
    }
    .auth-lock-panel {
        pointer-events: auto;
        min-width: min(420px, calc(100vw - 48px));
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
    }
    .auth-lock-signin {
        display: flex;
        justify-content: center;
    }
    .offline-license-form {
        width: min(420px, calc(100vw - 48px));
        background: var(--bg-panel);
        border: 1px solid var(--border);
        border-radius: 8px;
        padding: 12px;
        display: flex;
        flex-direction: column;
        gap: 8px;
    }
    .offline-license-form[hidden] { display: none; }
    .offline-license-title {
        color: var(--text-main);
        font-size: 12px;
        font-weight: 800;
    }
    .offline-license-input {
        width: 100%;
        min-height: 78px;
        resize: vertical;
        background: var(--bg-main);
        border: 1px solid var(--border);
        border-radius: 6px;
        color: var(--text-main);
        font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
        font-size: 11px;
        line-height: 1.35;
        padding: 7px;
    }
    .offline-license-actions {
        display: flex;
        align-items: center;
        gap: 8px;
    }
    .offline-license-status {
        color: var(--text-muted);
        font-size: 11px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .offline-license-status[data-state="error"] { color: var(--err); }
    .offline-license-status[data-state="ok"] { color: var(--green); }
    .tool-strip {
        border-bottom: 1px solid var(--border);
        background: rgba(13,17,23,0.95);
        padding: 7px 12px 6px;
        display: flex;
        flex-direction: column;
        gap: 4px;
        flex-shrink: 0;
    }
    .tool-strip-run {
        display: flex;
        align-items: center;
        gap: 8px;
    }
    .tool-strip-label {
        font-size: 10px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: .06em;
        color: var(--warn);
        white-space: nowrap;
        flex-shrink: 0;
    }
    .tool-strip-btn {
        background: var(--amber-soft);
        border: 1px solid var(--amber-border);
        color: var(--warn);
        border-radius: 5px;
        padding: 3px 10px;
        font-size: 10px;
        font-weight: 700;
        cursor: pointer;
        transition:
            background-color var(--control-transition),
            background var(--control-transition),
            border-color var(--control-transition),
            color var(--control-transition),
            box-shadow var(--control-transition),
            opacity var(--control-transition),
            filter var(--control-transition);
        flex-shrink: 0;
    }
    .tool-strip-btn:hover { background: rgba(210,153,34,.20); }
    .tool-strip-btn:disabled { opacity: .45; cursor: default; }
    .tool-strip-status {
        font-size: 10px;
        color: var(--text-muted);
        min-height: 12px;
        flex: 1;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .tool-strip-params {
        display: flex;
        align-items: center;
        gap: 8px;
        flex-wrap: nowrap;
    }
    .tool-strip-field {
        display: flex;
        align-items: center;
        gap: 5px;
        font-size: 10px;
        color: var(--text-muted);
        flex-shrink: 0;
    }
    .tool-strip-field span {
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: .05em;
        white-space: nowrap;
    }
    .tool-strip-field input,
    .tool-strip-field select {
        background: var(--bg-main);
        border: 1px solid var(--border);
        color: var(--text-main);
        border-radius: 4px;
        padding: 3px 5px;
        font-size: 10px;
    }
    .tool-strip-field input { width: 58px; }
    .tool-strip-field select { cursor: pointer; }
    .editor { position: relative; display: flex; flex: 1; overflow: hidden; }
    .pane-center { position: relative; flex: 1; display: flex; flex-direction: column; overflow: hidden; }

    .timeline-area { position: relative; flex: 1; display: flex; flex-direction: column; overflow: hidden; }

    /* Single scroll root — the only element that scrolls horizontally.
       All waveform canvases, subtitle lanes, and timeline rulers are
       children of this container and scroll together as one panel. */
    #timeline-body { flex: 1; display: flex; min-height: 0; overflow: hidden; }
    #track-mixer { width: 128px; flex-shrink: 0; background: var(--bg-panel); border-right: 1px solid var(--border); overflow: hidden; }
    #track-mixer-ruler-spacer {
        position: sticky;
        top: 0;
        z-index: 24;
        height: 18px;
        min-height: 18px;
        border-bottom: 1px solid var(--border);
        background: var(--timeline-bg-soft);
        box-shadow: inset -1px 0 0 var(--border);
    }
    #track-mixer-rows { position: relative; z-index: 1; will-change: transform; }
    .mixer-row {
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        gap: 7px;
        padding: 12px 10px 8px;
        overflow: hidden;
        transition: opacity .2s, background .2s;
        min-height: 44px;
        background-image: linear-gradient(
            to bottom,
            transparent calc(100% - 4px),
            var(--border) calc(100% - 4px),
            var(--border) calc(100% - 3px),
            var(--bg-panel) calc(100% - 3px),
            var(--bg-panel) calc(100% - 1px),
            var(--border) calc(100% - 1px),
            var(--border) 100%
        );
    }
    .mixer-row.muted { opacity: 1; background-color: rgba(248,81,73,.045); }
    .mixer-row.muted .mixer-track-head { opacity: .48; }
    .mixer-row.muted .btn-mix:not(.mute-on) { opacity: .58; }
    .mixer-track-head {
        display: flex;
        align-items: center;
        gap: 6px;
        min-width: 0;
        width: 100%;
        min-height: 16px;
        line-height: 16px;
    }
    .mixer-track-dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; display: inline-block; }
    .mixer-track-name { font-size: 12px; line-height: 16px; font-weight: 700; color: var(--text-main); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 104px; }
    .mixer-btns { display: flex; gap: 5px; flex-wrap: wrap; min-height: 22px; }
    .btn-mix {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        height: 22px;
        min-width: 40px;
        padding: 0 7px;
        background: rgba(22,27,34,.54);
        border: 1px solid rgba(139,148,158,.22);
        color: rgba(139,148,158,.78);
        border-radius: 4px;
        font-size: 9px;
        font-weight: 800;
        line-height: 1;
        cursor: pointer;
        text-transform: uppercase;
        letter-spacing: .055em;
        transition:
            background-color var(--control-transition),
            background var(--control-transition),
            border-color var(--control-transition),
            color var(--control-transition),
            box-shadow var(--control-transition),
            opacity var(--control-transition),
            filter var(--control-transition);
        text-align: center;
    }
    .btn-mix:hover { color: var(--text-main); border-color: rgba(201,209,217,.38); background: rgba(33,38,45,.76); }
    .btn-mix.mute-on {
        background: rgba(248,81,73,.18);
        color: var(--red-text);
        border-color: var(--red-border);
        box-shadow: inset 0 0 0 1px rgba(248,81,73,.22), 0 0 12px rgba(248,81,73,.13);
    }
    .btn-mix.solo-on {
        background: rgba(210,153,34,.20);
        color: var(--amber-text);
        border-color: var(--amber-border);
        box-shadow: inset 0 0 0 1px rgba(210,153,34,.24), 0 0 12px rgba(210,153,34,.13);
    }
    #waveform-scroll-root { flex: 1; overflow-x: auto; overflow-y: auto; background: var(--timeline-bg); }
    .wavesurfer-global-timeline {
        position: sticky;
        top: 0;
        z-index: 18;
        height: 18px;
        min-height: 18px;
        background: var(--timeline-bg-soft);
        border-bottom: 1px solid var(--border);
    }
    .wavesurfer-global-timeline > * {
        height: 18px !important;
        min-height: 18px !important;
    }
    #waveform-area { min-width: 100%; }
    #waveform-area .scroll {
        overflow-x: hidden !important;
        overflow-y: hidden !important;
    }
    #waveform-area ::part(scroll) {
        overflow-x: hidden !important;
        overflow-y: hidden !important;
    }

    .track-row {
        padding-bottom: 4px;
        position: relative;
        background-image: linear-gradient(
            to bottom,
            transparent calc(100% - 4px),
            var(--timeline-divider-soft) calc(100% - 4px),
            var(--timeline-divider-soft) calc(100% - 3px),
            var(--bg-panel) calc(100% - 3px),
            var(--bg-panel) calc(100% - 1px),
            var(--timeline-divider) calc(100% - 1px),
            var(--timeline-divider) 100%
        );
        transition: box-shadow .16s ease, background-color .16s ease;
    }
    .track-label { position: absolute; top: 0; left: 0; z-index: 10; background: rgba(22,27,34,0.88); backdrop-filter: blur(4px); padding: 3px 10px; font-size: 11px; color: var(--text-muted); border-bottom-right-radius: 6px; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 6px; }
    .track-wave { min-height: 160px; background: var(--timeline-bg); overflow: hidden; position: relative; }
    .desktop-wave-progress-fill {
        position: absolute;
        inset: 0;
        z-index: 2;
        pointer-events: none;
        transform: scaleX(0);
        transform-origin: left center;
        background:
            linear-gradient(90deg, rgba(88,166,255,.15), rgba(88,166,255,.08)),
            linear-gradient(180deg, rgba(255,255,255,.04), transparent 42%, rgba(88,166,255,.05));
        mix-blend-mode: screen;
        transition: transform .08s linear;
    }
    .automation-overlay {
        position: absolute;
        left: 0;
        top: 0;
        height: 100%;
        pointer-events: none;
        z-index: 8;
        overflow: visible;
        opacity: 1;
        transition: opacity .28s ease;
    }
    .automation-unity-line {
        stroke: rgba(239,236,229,0.42);
        stroke-width: 1;
        vector-effect: non-scaling-stroke;
    }
    .automation-gain-line {
        fill: none;
        stroke: rgba(240,238,232,0.9);
        stroke-width: 2;
        stroke-linecap: round;
        stroke-linejoin: round;
        vector-effect: non-scaling-stroke;
        filter: drop-shadow(0 0 3px rgba(13,17,23,0.65));
        transition: stroke .16s ease, filter .16s ease, opacity .16s ease;
    }
    [data-region-type] {
        opacity: .84;
        border-radius: 2px;
        box-shadow: inset 0 0 0 1px var(--region-border-color, rgba(201,209,217,.16));
        transition: opacity .2s ease, filter .2s ease, box-shadow .2s ease;
    }
    [data-region-type]:hover,
    [data-region-type].is-selected {
        opacity: .96;
        filter: saturate(1.12);
        box-shadow: inset 0 0 0 1px var(--region-accent-color, rgba(201,209,217,.42));
    }
    [data-region-type="crosstalk"] {
        box-shadow:
            inset 0 3px 0 var(--region-accent-color, rgba(255,123,114,.82)),
            inset 0 0 0 1px var(--region-border-color, rgba(255,123,114,.38));
    }
    [data-region-type="crosstalk"]:hover,
    [data-region-type="crosstalk"].is-selected {
        box-shadow:
            inset 0 3px 0 var(--region-accent-color, rgba(255,123,114,.96)),
            inset 0 0 0 1px var(--region-accent-color, rgba(255,123,114,.64));
    }
    [data-region-type="music"] {
        opacity: .8;
    }
    .timeline-visual-enter {
        opacity: 0 !important;
    }
    .timeline-visual-enter.is-visible {
        opacity: 1 !important;
    }
    .timeline-hide-automation .automation-overlay {
        opacity: 0;
    }
    .timeline-hide-regions [data-region-type] {
        opacity: 0;
        pointer-events: none;
    }

    .subs-area { background: var(--bg-panel); }
    .sub-lane { height: 22px; position: relative; overflow: hidden; border-top: 1px solid rgba(48,54,61,.3); }
    /* Label stays pinned at the left viewport edge via JS translateX (see pinSubtitleLabels) */
    .sub-lane-label { position: absolute; left: 0; top: 0; height: 100%; width: 70px; display: flex; align-items: center; padding-left: 6px; font-size: 9px; font-weight: 700; text-transform: uppercase; z-index: 1; background: var(--bg-panel); }
    .sub-inner { position: relative; height: 100%; }
    .sub-block { position: absolute; top: 0; height: 100%; display: flex; align-items: center; padding: 0 6px 0 4px; font-size: 10px; font-family: ui-monospace, monospace; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; cursor: pointer; border-left: 2px solid; border-radius: 2px; }
    .sub-block:hover { background: rgba(255,255,255,.06); }
    .sub-block.active { background: rgba(88,166,255,.12); }

    .console-area {
        border-top: 1px solid var(--border);
        background: #0a0e12;
        display: flex;
        flex-direction: column;
        transition: height .25s ease;
    }
    .console-header { padding: 6px 12px; font-size: 11px; color: var(--text-muted); text-transform: uppercase; border-bottom: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; gap: 12px; cursor: pointer; user-select: none; }
    .console-title { flex: 0 0 auto; }
    .console-status { min-width: 0; max-width: 72%; display: inline-flex; align-items: center; justify-content: flex-end; gap: 5px; color: var(--text-muted); text-transform: none; }
    .console-status-dot { width: 6px; height: 6px; border-radius: 50%; flex: 0 0 auto; display: inline-block; }
    .console-status-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .console-status-running .console-status-dot { background: var(--warn); animation: pulse 1.5s infinite; }
    .console-status-running .console-status-text { color: var(--warn); }
    .console-status-done .console-status-dot { background: var(--green); }
    .console-status-done .console-status-text { color: var(--green); }
    .console-status-error .console-status-dot { background: var(--err); }
    .console-status-error .console-status-text { color: var(--err); }
    .console-log { flex: 1; padding: 6px 12px; font-family: 'SF Mono', 'Fira Code', monospace; font-size: 12px; color: #8b949e; overflow-y: auto; }

    .log-line { margin-bottom: 2px; line-height: 1.4; }
    .log-step { color: var(--accent); }
    .log-ok { color: var(--green); }
    .log-warn { color: var(--warn); }
    .log-err { color: var(--err); }
    @keyframes pulse { 0%,100% { opacity: .5; } 50% { opacity: 1; } }

    button,
    .btn,
    .top-back-btn,
    .top-help-btn,
    .tool-strip-btn,
    .import-btn,
    .import-aaf-choice-btn,
    .agent-export-btn,
    .agent-send-btn,
    .btn-mix,
    .btn-agent-toggle,
    .zoom-btn,
    .timeline-tools-toggle,
    .region-legend-toggle,
    .automix-help-btn,
    .automix-pill,
    .automix-segment-btn,
    .automix-action-btn,
    .automix-process-btn,
    .automix-mini-btn,
    .automix-modal-close,
    .automix-modal-help-btn,
    .prop-panel-btn,
    .btn-icon,
    .qc-check-toggle {
        transition:
            background-color var(--control-transition),
            background var(--control-transition),
            border-color var(--control-transition),
            color var(--control-transition),
            box-shadow var(--control-transition),
            opacity var(--control-transition),
            filter var(--control-transition),
            transform var(--control-transition-fast);
    }
    button:disabled,
    .btn:disabled {
        transition:
            background-color var(--control-transition),
            background var(--control-transition),
            border-color var(--control-transition),
            color var(--control-transition),
            box-shadow var(--control-transition),
            opacity var(--control-transition),
            filter var(--control-transition);
    }
    button:focus-visible,
    .btn:focus-visible,
    .top-back-btn:focus-visible,
    .top-help-btn:focus-visible,
    .btn-mix:focus-visible,
    .btn-agent-toggle:focus-visible,
    .zoom-btn:focus-visible,
    .timeline-tools-toggle:focus-visible,
    .region-legend-toggle:focus-visible,
    .automix-pill:focus-visible,
    .automix-mini-btn:focus-visible,
    .qc-check-toggle:focus-visible {
        outline: none;
        border-color: rgba(121,192,255,.72);
        box-shadow:
            inset 0 0 0 1px rgba(121,192,255,.18),
            0 0 0 2px rgba(88,166,255,.18);
    }
    .btn { border: none; border-radius: 4px; padding: 5px 14px; font-size: 12px; font-weight: 600; cursor: pointer; }
    .btn-primary { background: var(--accent); color: #000; }
    .btn-primary:hover { background: var(--blue-hover); }
    .btn-ghost { background: var(--bg-hover); color: var(--text-main); border: 1px solid var(--border); }
    .btn-ghost:hover { background: #30363d; }
    .transport-toggle.active {
        background: var(--amber-soft);
        color: var(--amber-text);
        border-color: var(--amber-border);
        box-shadow: inset 0 0 0 1px rgba(210,153,34,.14);
    }
    .tag { display: inline-block; padding: 1px 6px; border-radius: 3px; font-size: 10px; font-weight: 600; margin-right: 4px; margin-bottom: 3px; }
    .tag-blue { background: var(--blue-soft); color: var(--blue-hover); }
    .tag-green { background: var(--green-soft); color: var(--green-text); }
    .tag-yellow { background: var(--amber-soft); color: var(--amber-text); }
    .tag-red { background: var(--red-soft); color: var(--red-text); }
    .tag-purple { background: rgba(188,140,255,.15); color: #bc8cff; }

    .meta-row { display: flex; justify-content: space-between; align-items: center; padding: 3px 0; font-size: 12px; }
    .meta-label { color: var(--text-muted); font-size: 10px; text-transform: uppercase; letter-spacing: .04em; }
    .meta-value { font-family: ui-monospace, monospace; font-size: 12px; }
    .section-title { font-size: 10px; font-weight: 700; color: var(--text-muted); text-transform: uppercase; letter-spacing: .06em; margin-bottom: 8px; margin-top: 16px; }
    .section-title:first-child { margin-top: 0; }

    .landing {
        flex: 1;
        min-height: 0;
        overflow: auto;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        padding: 34px;
        background:
            linear-gradient(180deg, rgba(18,24,32,.56), rgba(8,12,16,.24)),
            var(--bg-main);
    }
    .landing-shell {
        position: relative;
        width: clamp(795px, calc(100vw - 68px), 1034px);
        height: min(650px, calc(100vh - 116px));
        min-height: 0;
        display: grid;
        grid-template-columns: 300px minmax(0, 1fr);
        gap: 18px;
        align-items: stretch;
        margin-left: 16px;
    }
    .landing-shell:has(#lufs-correction-panel:not([hidden])) {
        grid-template-columns: 300px minmax(0, 1fr);
        gap: 18px;
    }
    .landing-shell::after {
        content: "";
        grid-column: 2;
        grid-row: 1;
        min-width: 0;
        min-height: 0;
        border: 1px solid rgba(139,148,158,.22);
        border-radius: 12px;
        background:
            linear-gradient(180deg, rgba(255,255,255,.026), rgba(13,17,23,.68)),
            rgba(22,27,34,.92);
        box-shadow: 0 18px 42px rgba(0,0,0,.26);
        pointer-events: none;
        z-index: 0;
    }
    .landing-shell > .landing-empty-panel,
    .landing-shell > .landing-panel {
        grid-column: 2;
        grid-row: 1;
        position: relative;
        z-index: 1;
        transition:
            opacity .24s ease,
            transform .24s ease;
        will-change: opacity, transform;
    }
    .landing-view-entering,
    .landing-view-exiting {
        opacity: 0;
        pointer-events: none;
    }
    .landing-view-entering {
        visibility: visible;
        transform: translateY(4px);
    }
    .landing-view-exiting {
        transform: translateY(-2px);
    }
    .landing-view-active {
        opacity: 1;
        transform: translateY(0);
        visibility: visible;
        transition-delay: 0s;
    }
    @media (prefers-reduced-motion: reduce) {
        .landing-shell > .landing-empty-panel,
        .landing-shell > .landing-panel {
            transition: none;
        }
        .landing-view-entering,
        .landing-view-exiting,
        .landing-view-active {
            transform: none;
        }
    }
    .landing-modes {
        display: flex;
        flex-direction: column;
        gap: 10px;
        min-width: 0;
    }
    .landing-mode-card {
        width: 100%;
        min-height: 144px;
        padding: 16px;
        border: 1px solid rgba(139,148,158,.20);
        border-radius: 12px;
        background:
            linear-gradient(180deg, rgba(255,255,255,.025), rgba(13,17,23,.72)),
            rgba(22,27,34,.86);
        color: var(--text-main);
        text-align: left;
        cursor: pointer;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        gap: 9px;
        transition:
            background var(--control-transition),
            border-color var(--control-transition),
            box-shadow var(--control-transition),
            color var(--control-transition),
            opacity var(--control-transition),
            transform var(--control-transition-fast);
    }
    .landing-mode-card:hover {
        border-color: rgba(121,192,255,.42);
        background:
            linear-gradient(180deg, rgba(88,166,255,.075), rgba(13,17,23,.70)),
            rgba(22,27,34,.92);
    }
    .landing-mode-card.active {
        border-color: rgba(88,166,255,.56);
        background:
            linear-gradient(180deg, rgba(88,166,255,.16), rgba(13,17,23,.66)),
            rgba(22,27,34,.96);
        box-shadow:
            inset 0 0 0 1px rgba(88,166,255,.13),
            0 12px 30px rgba(0,0,0,.20);
    }
    .landing-mode-card:disabled {
        cursor: not-allowed;
        opacity: .48;
        transform: none;
        border-color: rgba(139,148,158,.16);
        background:
            linear-gradient(180deg, rgba(255,255,255,.018), rgba(13,17,23,.70)),
            rgba(22,27,34,.72);
    }
    .landing-mode-kicker {
        color: var(--blue-text);
        font-size: 10px;
        font-weight: 800;
        letter-spacing: .08em;
        line-height: 1;
        text-transform: uppercase;
    }
    .landing-mode-status {
        align-self: flex-start;
        margin-top: auto;
        padding: 3px 7px;
        border: 1px solid rgba(210,153,34,.36);
        border-radius: 999px;
        background: rgba(210,153,34,.10);
        color: var(--amber-text);
        font-size: 9px;
        font-weight: 850;
        letter-spacing: .06em;
        line-height: 1;
        text-transform: uppercase;
    }
    .lufs-workflow-layout {
        min-width: 0;
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 0;
        align-items: start;
        justify-items: center;
    }
    .lufs-media-profile-card {
        position: absolute;
        left: calc(100% + 14px);
        top: 0;
        width: clamp(260px, 24vw, 320px);
        min-width: 0;
        max-height: min(650px, calc(100vh - 116px));
        padding: 14px 16px 15px;
        overflow: auto;
        opacity: 0;
        visibility: hidden;
        transform: translateX(-8px);
        pointer-events: none;
        border: 1px solid rgba(139,148,158,0);
        border-radius: 12px;
        background:
            linear-gradient(180deg, rgba(88,166,255,.055), rgba(13,17,23,.70)),
            rgba(22,27,34,.92);
        box-shadow: 0 16px 34px rgba(0,0,0,0);
        color: var(--text-main);
        transition:
            opacity .22s ease,
            transform .28s ease,
            border-color .22s ease,
            box-shadow .22s ease,
            visibility 0s linear .22s;
    }
    .landing-shell:not(:has(#lufs-correction-panel:not([hidden]))) .lufs-media-profile-card {
        display: none;
    }
    .lufs-media-profile-card.is-visible {
        opacity: 1;
        visibility: visible;
        transform: translateX(0);
        pointer-events: auto;
        border-color: rgba(88,166,255,.32);
        box-shadow:
            inset 0 0 0 1px rgba(255,255,255,.025),
            0 14px 30px rgba(0,0,0,.18);
        transition:
            opacity .22s ease,
            transform .28s ease,
            border-color .22s ease,
            box-shadow .22s ease;
    }
    @media (min-width: 901px) and (max-width: 1439px) {
        .landing:has(#lufs-correction-panel:not([hidden])):has(.lufs-media-profile-card.is-visible) {
            align-items: flex-start;
            padding-top: max(34px, calc((100vh - 698px) / 2));
        }
        .landing-shell:has(#lufs-correction-panel:not([hidden])):has(.lufs-media-profile-card.is-visible) {
            height: auto;
            min-height: 0;
            grid-template-rows: auto auto;
        }
        .landing-shell:has(#lufs-correction-panel:not([hidden])):has(.lufs-media-profile-card.is-visible)::after,
        .landing-shell:has(#lufs-correction-panel:not([hidden])):has(.lufs-media-profile-card.is-visible) > .landing-panel {
            grid-row: 1;
        }
        .landing-shell:has(#lufs-correction-panel:not([hidden])) > .landing-panel {
            overflow: visible;
            scrollbar-gutter: auto;
        }
        .landing-shell:has(#lufs-correction-panel:not([hidden])) .lufs-media-profile-card {
            position: relative;
            left: auto;
            top: auto;
            grid-column: 2;
            grid-row: 2;
            width: 100%;
            max-height: none;
            overflow: visible;
            transform: translateY(-8px);
        }
        .landing-shell:has(#lufs-correction-panel:not([hidden])) .lufs-media-profile-card:not(.is-visible) {
            display: none;
        }
        .landing-shell:has(#lufs-correction-panel:not([hidden])) .lufs-media-profile-card.is-visible {
            transform: translateY(0);
        }
    }
    .lufs-profile-kicker {
        color: var(--blue-text);
        font-size: 9px;
        font-weight: 850;
        letter-spacing: .08em;
        line-height: 1;
        text-transform: uppercase;
    }
    .lufs-profile-name-wrap {
        min-width: 0;
        margin-top: 7px;
    }
    .lufs-profile-name {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: rgba(201,209,217,.96);
        font-size: 13px;
        font-weight: 780;
        line-height: 1.15;
    }
    .lufs-profile-meta {
        margin-top: 4px;
        color: rgba(139,148,158,.82);
        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
        font-size: 10px;
        line-height: 1.2;
    }
    .lufs-profile-stats {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 6px;
        margin-top: 10px;
    }
    .lufs-profile-stats div {
        min-width: 0;
        border: 1px solid rgba(139,148,158,.13);
        border-radius: 7px;
        background: rgba(0,0,0,.16);
        padding: 6px 7px;
    }
    .lufs-profile-stats span {
        display: block;
        color: rgba(139,148,158,.82);
        font-size: 8px;
        font-weight: 850;
        letter-spacing: .06em;
        line-height: 1;
        text-transform: uppercase;
    }
    .lufs-profile-stats strong {
        display: block;
        min-width: 0;
        margin-top: 4px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: rgba(201,209,217,.96);
        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
        font-size: 11px;
        font-weight: 720;
        line-height: 1.05;
    }
    .lufs-profile-format {
        display: flex;
        flex-direction: column;
        gap: 2px;
        margin-top: 9px;
        color: rgba(139,148,158,.84);
        font-size: 10px;
        line-height: 1.25;
    }
    .lufs-profile-format span {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .lufs-profile-details {
        display: flex;
        flex-direction: column;
        gap: 8px;
        margin-top: 12px;
        padding-top: 12px;
        border-top: 1px solid rgba(139,148,158,.15);
    }
    .lufs-profile-detail-section {
        display: flex;
        flex-direction: column;
        gap: 5px;
    }
    .lufs-profile-detail-title {
        color: var(--blue-text);
        font-size: 8px;
        font-weight: 850;
        letter-spacing: .08em;
        line-height: 1;
        text-transform: uppercase;
    }
    .lufs-profile-detail {
        display: grid;
        grid-template-columns: minmax(68px, .72fr) minmax(0, 1.28fr);
        align-items: baseline;
        gap: 8px;
        min-width: 0;
        color: rgba(201,209,217,.82);
        font-size: 10px;
        line-height: 1.25;
    }
    .lufs-profile-detail span {
        min-width: 0;
        color: rgba(139,148,158,.82);
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .lufs-profile-detail strong {
        min-width: 0;
        color: rgba(201,209,217,.92);
        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
        font-size: 10px;
        font-weight: 620;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .lufs-profile-detail-note {
        color: rgba(139,148,158,.84);
        font-size: 10px;
        line-height: 1.35;
    }
    .landing-mode-name {
        font-size: 18px;
        font-weight: 760;
        line-height: 1.15;
        letter-spacing: 0;
    }
    .landing-mode-description {
        color: rgba(201,209,217,.70);
        font-size: 12px;
        line-height: 1.45;
        max-width: 240px;
    }
    .landing-empty-panel {
        min-width: 0;
        min-height: 0;
        padding: 32px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        color: var(--text-main);
    }
    .landing-empty-panel[hidden] {
        visibility: hidden;
        opacity: 0;
        pointer-events: none;
    }
    .landing-empty-mark {
        width: 64px;
        height: 64px;
        margin-bottom: 16px;
        border: 1px solid rgba(88,166,255,.28);
        border-radius: 16px;
        background:
            linear-gradient(180deg, rgba(88,166,255,.13), rgba(88,166,255,.035));
        color: var(--blue-text);
        display: grid;
        place-items: center;
        box-shadow: inset 0 0 0 1px rgba(255,255,255,.025);
    }
    .landing-empty-kicker {
        color: var(--blue-text);
        font-size: 10px;
        font-weight: 800;
        letter-spacing: .08em;
        line-height: 1;
        text-transform: uppercase;
    }
    .landing-empty-title {
        margin: 8px 0 0;
        color: var(--text-main);
        font-size: 26px;
        font-weight: 800;
        line-height: 1.08;
        letter-spacing: 0;
    }
    .landing-empty-copy {
        width: min(420px, 100%);
        margin: 12px 0 0;
        color: rgba(201,209,217,.68);
        font-size: 13px;
        line-height: 1.55;
    }
    .landing-panel {
        min-width: 0;
        min-height: 0;
        padding: 18px;
        display: flex;
        flex-direction: column;
        overflow: auto;
        scrollbar-gutter: stable;
    }
    .landing-panel[hidden] {
        visibility: hidden;
        opacity: 0;
        pointer-events: none;
    }
    .landing-panel-head {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 18px;
        padding-bottom: 16px;
        margin-bottom: 16px;
        border-bottom: 1px solid rgba(139,148,158,.18);
    }
    .landing-panel-kicker {
        color: var(--text-muted);
        font-size: 10px;
        font-weight: 800;
        letter-spacing: .08em;
        line-height: 1;
        text-transform: uppercase;
    }
    .landing-panel-title,
    .landing-modal-title {
        margin: 5px 0 0;
        color: var(--text-main);
        font-size: 24px;
        font-weight: 800;
        line-height: 1.1;
        letter-spacing: 0;
    }
    .landing-panel-note {
        flex: 0 0 auto;
        margin-top: 1px;
        padding: 4px 8px;
        border: 1px solid rgba(88,166,255,.28);
        border-radius: 6px;
        background: rgba(88,166,255,.08);
        color: var(--blue-text);
        font-size: 10px;
        font-weight: 800;
        letter-spacing: .05em;
        text-transform: uppercase;
        white-space: nowrap;
    }
    .landing-panel .import-card,
    .landing-panel .source-card {
        width: 100%;
        max-width: none;
    }
    #lufs-correction-panel,
    .single-project-panel {
        gap: 16px;
    }
    #lufs-correction-panel .landing-panel-head,
    .single-project-panel .landing-panel-head {
        margin-bottom: 2px;
    }
    .single-project-panel .single-import-card {
        width: min(620px, 100%);
        max-width: 620px;
        align-self: center;
        padding: 0;
        gap: 12px;
        background: transparent;
        border-color: transparent;
        box-shadow: none;
    }
    .single-import-card .import-dropzone,
    .lufs-workflow-card .landing-media-dropzone {
        min-height: 174px;
        justify-content: center;
        align-items: center;
        padding: 22px;
        gap: 10px;
        background:
            linear-gradient(180deg, rgba(88,166,255,.07), rgba(13,17,23,.24));
    }
    .single-import-card .import-btn,
    .lufs-workflow-card .landing-media-dropzone .import-btn {
        flex: 0 0 auto;
        min-width: 166px;
        padding-inline: 18px;
    }
    .single-import-card .import-status,
    .lufs-workflow-card > .import-status {
        min-height: 20px;
        display: flex;
        align-items: center;
        justify-content: center;
        line-height: 1.35;
        overflow-wrap: anywhere;
    }
    .single-import-card .import-status[data-state="ready"],
    .single-import-card .import-status[data-state="choice"] {
        justify-content: flex-start;
        text-align: left;
    }
    .single-section-title {
        margin: 0;
        color: rgba(139,148,158,.92);
        text-align: left;
    }
    .single-import-card .single-section-title {
        text-align: center;
    }
    .single-import-kicker {
        color: rgba(139,148,158,.92);
        font-size: 10px;
        font-weight: 850;
        letter-spacing: .09em;
        line-height: 1;
        text-transform: uppercase;
    }
    .single-import-title {
        color: var(--text-main);
        font-size: 17px;
        font-weight: 780;
        line-height: 1.2;
    }
    .single-import-copy {
        max-width: 420px;
        margin: -4px auto 0;
        color: rgba(201,209,217,.66);
        font-size: 12px;
        line-height: 1.45;
    }
    .single-import-card .single-import-btn {
        margin-top: 6px;
    }
    .single-project-list {
        width: min(620px, 100%);
        align-self: center;
        display: flex;
        flex-direction: column;
        gap: 10px;
        min-width: 0;
    }
    .single-project-list:empty {
        display: none;
    }
    .single-project-list {
        margin-top: 2px;
        padding-top: 14px;
        border-top: 1px solid rgba(139,148,158,.13);
    }
    .recent-workspaces-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
        min-width: 0;
    }
    .recent-workspaces-title-wrap {
        min-width: 0;
        display: flex;
        flex-direction: column;
        gap: 3px;
    }
    .recent-workspaces-count {
        color: rgba(139,148,158,.72);
        font-size: 10px;
        font-weight: 600;
        line-height: 1.2;
    }
    .recent-workspaces-search {
        flex: 0 0 176px;
        min-width: 132px;
        height: 30px;
        display: flex;
        align-items: center;
        gap: 7px;
        padding: 0 10px;
        border: 1px solid rgba(139,148,158,.18);
        border-radius: 8px;
        background: rgba(13,17,23,.42);
        color: rgba(139,148,158,.9);
        transition: border-color var(--control-transition), background var(--control-transition);
    }
    .recent-workspaces-search:focus-within {
        border-color: rgba(88,166,255,.45);
        background: rgba(13,17,23,.62);
    }
    .recent-search-icon {
        width: 13px;
        height: 13px;
        display: inline-flex;
        flex: 0 0 auto;
        opacity: .82;
    }
    .recent-search-icon svg {
        width: 100%;
        height: 100%;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.7;
        stroke-linecap: round;
        stroke-linejoin: round;
    }
    .recent-workspaces-search input {
        width: 100%;
        min-width: 0;
        border: 0;
        outline: 0;
        padding: 0;
        background: transparent;
        color: var(--text-main);
        font: inherit;
        font-size: 12px;
        font-weight: 650;
        line-height: 1;
    }
    .recent-workspaces-search input::placeholder {
        color: rgba(139,148,158,.72);
    }
    .recent-workspaces-rows {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }
    .recent-workspaces-empty {
        min-height: 42px;
        display: grid;
        place-items: center;
        border: 1px dashed rgba(139,148,158,.20);
        border-radius: 9px;
        color: rgba(139,148,158,.78);
        font-size: 12px;
        font-weight: 650;
    }
    .recent-workspaces-empty[hidden] {
        display: none;
    }
    .single-section-title-wide {
        margin-bottom: 0;
    }
    .single-project-list .source-card {
        width: 100%;
        max-width: none;
        padding: 11px 12px;
        border-radius: 9px;
        background:
            linear-gradient(180deg, rgba(255,255,255,.018), rgba(13,17,23,.38)),
            rgba(22,27,34,.58);
        border-color: rgba(139,148,158,.17);
    }
    .single-project-list .source-card:hover {
        background:
            linear-gradient(180deg, rgba(88,166,255,.065), rgba(13,17,23,.42)),
            rgba(22,27,34,.76);
        border-color: rgba(88,166,255,.42);
    }
    .single-project-list .project-card-layout {
        grid-template-columns: minmax(0, 1fr) auto auto;
        min-height: 34px;
        gap: 10px;
    }
    .single-project-list .project-card-main {
        gap: 3px;
    }
    .single-project-list .project-card-name {
        font-size: 13px;
        letter-spacing: 0;
    }
    .single-project-list .project-card-meta {
        display: flex;
        align-items: center;
        gap: 7px;
        min-width: 0;
        font-size: 10.5px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .single-project-list .project-card-state {
        justify-self: end;
        border: 1px solid rgba(139,148,158,.18);
        border-radius: 999px;
        padding: 3px 7px;
        color: rgba(139,148,158,.86);
        background: rgba(139,148,158,.055);
        font-size: 9px;
        font-weight: 800;
        letter-spacing: .075em;
        line-height: 1;
        text-transform: uppercase;
    }
    .single-project-list .project-card-state[data-ready="true"] {
        color: var(--green-text);
        border-color: rgba(63,185,80,.28);
        background: rgba(63,185,80,.09);
    }
    .single-project-list .project-delete-btn {
        min-width: 64px;
        padding: 5px 10px;
        opacity: .78;
    }
    .single-project-list .project-delete-btn:hover {
        opacity: 1;
    }
    .import-card {
        width: 420px;
        max-width: calc(100vw - 32px);
        background: var(--bg-panel);
        border: 1px solid var(--border);
        border-radius: 12px;
        padding: 16px;
        display: flex;
        flex-direction: column;
        gap: 12px;
    }
    .import-dropzone {
        position: relative;
        border: 1px dashed rgba(88,166,255,.45);
        background: linear-gradient(180deg, rgba(88,166,255,.08), rgba(13,17,23,.25));
        border-radius: 10px;
        padding: 20px 16px;
        text-align: center;
        display: flex;
        flex-direction: column;
        gap: 6px;
        transition:
            min-height var(--control-transition),
            max-height var(--control-transition),
            padding var(--control-transition),
            gap var(--control-transition),
            border-color .15s,
            background .15s,
            transform .15s;
    }
    .import-dropzone.dragover {
        border-color: var(--accent);
        background: linear-gradient(180deg, rgba(88,166,255,.16), rgba(13,17,23,.35));
        transform: translateY(-1px);
    }
    .import-dropzone.busy { opacity: 0.7; }
    .import-actions { display: flex; gap: 8px; }
    .import-btn {
        flex: 1;
        background: rgba(88,166,255,.12);
        border: 1px solid rgba(88,166,255,.35);
        color: var(--accent);
        border-radius: 8px;
        padding: 10px 12px;
        font-family: inherit;
        font-size: 12px;
        font-weight: 700;
        line-height: 1.2;
        cursor: pointer;
        transition:
            background-color var(--control-transition),
            background var(--control-transition),
            border-color var(--control-transition),
            color var(--control-transition),
            box-shadow var(--control-transition),
            opacity var(--control-transition),
            filter var(--control-transition);
    }
    .import-btn:hover { background: rgba(88,166,255,.2); }
    .import-btn:disabled { opacity: .5; cursor: default; }
    .import-status {
        min-height: 16px;
        font-size: 11px;
        color: var(--text-muted);
        text-align: center;
    }
    .import-status[data-state="busy"] { color: var(--accent); }
    .import-status[data-state="error"] { color: var(--err); }
    .import-status[data-state="ready"] {
        color: var(--text-main);
        text-align: left;
    }
    .import-status[data-state="choice"] {
        color: var(--text-main);
        text-align: left;
    }
    #lufs-status {
        min-height: 38px;
        padding: 0 8px;
        display: flex;
        align-items: center;
        justify-content: center;
        line-height: 1.35;
        overflow-wrap: anywhere;
        transition: color var(--control-transition), opacity var(--control-transition);
    }
    #lufs-status:empty::before {
        content: "";
    }
    #lufs-status[data-state="ready"],
    #lufs-status[data-state="choice"] {
        justify-content: center;
        text-align: center;
    }
    .lufs-current-file {
        min-height: 32px;
        min-width: 0;
        padding: 0 10px;
        display: flex;
        align-items: center;
        justify-content: center;
        border: 1px solid rgba(139,148,158,.16);
        border-radius: 8px;
        background: rgba(13,17,23,.26);
        color: rgba(201,209,217,.92);
    }
    .lufs-current-file[hidden] {
        display: none;
    }
    .lufs-current-file-name {
        max-width: 100%;
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 12px;
        font-weight: 760;
        line-height: 1.25;
    }
    .lufs-collapse-dropzone-btn {
        position: absolute;
        top: 14px;
        right: 14px;
        width: 28px;
        height: 28px;
        padding: 0;
        border: 0;
        border-radius: 6px;
        background: transparent;
        color: rgba(201,209,217,.78);
        cursor: pointer;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        transition:
            color var(--control-transition),
            transform var(--control-transition);
    }
    .lufs-collapse-dropzone-btn::before {
        content: "";
        width: 8px;
        height: 8px;
        border-right: 2px solid currentColor;
        border-bottom: 2px solid currentColor;
        transform: translateY(2px) rotate(225deg);
        transition: transform var(--control-transition);
    }
    .lufs-workflow-card .landing-media-dropzone.is-collapsed .lufs-collapse-dropzone-btn::before {
        transform: translateY(-2px) rotate(45deg);
    }
    .lufs-collapse-dropzone-btn:hover,
    .lufs-collapse-dropzone-btn:focus-visible {
        color: var(--blue-text);
    }
    .lufs-collapse-dropzone-btn:focus-visible {
        outline: none;
        box-shadow: none;
    }
    .lufs-collapse-dropzone-btn[hidden] {
        display: none;
    }
    .lufs-status-content {
        position: relative;
        width: 100%;
        min-width: 0;
        display: grid;
        grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
        align-items: center;
        gap: 10px;
        text-align: left;
    }
    .lufs-file-tooltip-anchor {
        position: relative;
    }
    .lufs-file-tooltip-anchor[data-tooltip]:hover::after {
        content: attr(data-tooltip);
        position: absolute;
        left: 0;
        bottom: calc(100% + 8px);
        z-index: 50;
        width: max-content;
        max-width: min(520px, calc(100vw - 48px));
        padding: 7px 9px;
        border: 1px solid rgba(88,166,255,.32);
        border-radius: 7px;
        background:
            linear-gradient(180deg, rgba(22,27,34,.98), rgba(13,17,23,.98)),
            rgba(22,27,34,.98);
        box-shadow: 0 12px 28px rgba(0,0,0,.34);
        color: rgba(240,246,252,.96);
        font-size: 11px;
        font-weight: 680;
        line-height: 1.35;
        letter-spacing: 0;
        text-align: left;
        text-transform: none;
        white-space: normal;
        overflow-wrap: anywhere;
        pointer-events: none;
    }
    .lufs-profile-name-wrap.lufs-file-tooltip-anchor[data-tooltip]:hover::after {
        top: calc(100% + 7px);
        right: 0;
        bottom: auto;
        width: auto;
        max-width: none;
    }
    .lufs-status-file {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: rgba(201,209,217,.94);
        font-size: 11px;
        font-weight: 760;
    }
    .lufs-status-message {
        min-width: 0;
        color: currentColor;
        font-size: 11px;
        line-height: 1.3;
        text-align: right;
    }
    .import-aaf-choice {
        display: flex;
        flex-direction: column;
        gap: 8px;
        width: 100%;
    }
    .import-aaf-choice-title {
        font-size: 10px;
        font-weight: 850;
        text-transform: uppercase;
        color: rgba(139,148,158,.92);
        letter-spacing: .08em;
        line-height: 1;
    }
    .import-aaf-choice-copy {
        margin-top: -4px;
        color: rgba(201,209,217,.62);
        font-size: 11px;
        line-height: 1.35;
    }
    .import-aaf-choice-list {
        display: flex;
        flex-direction: column;
        gap: 0;
        max-height: 246px;
        overflow: auto;
        padding: 3px;
        border: 1px solid rgba(139,148,158,.16);
        border-radius: 10px;
        background: rgba(13,17,23,.30);
    }
    .import-aaf-choice-btn {
        width: 100%;
        min-height: 36px;
        border: 0;
        border-bottom: 1px solid rgba(139,148,158,.10);
        border-radius: 7px;
        background: transparent;
        color: var(--text-main);
        cursor: pointer;
        display: flex;
        align-items: center;
        line-height: 1.25;
        padding: 7px 10px;
        text-align: left;
        min-width: 0;
        transition:
            background-color var(--control-transition),
            color var(--control-transition),
            box-shadow var(--control-transition),
            opacity var(--control-transition),
            filter var(--control-transition);
    }
    .import-aaf-choice-btn:last-child {
        border-bottom-color: transparent;
    }
    .import-aaf-choice-btn:hover {
        background: rgba(88,166,255,.09);
        color: #dceaff;
    }
    .import-aaf-choice-btn:focus-visible {
        outline: 1px solid rgba(88,166,255,.62);
        outline-offset: -1px;
        background: rgba(88,166,255,.12);
    }
    .import-aaf-choice-name {
        min-width: 0;
        width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: rgba(201,209,217,.95);
        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
        font-size: 11px;
        font-weight: 680;
    }
    .landing-media-card {
        gap: 12px;
    }
    .landing-media-dropzone {
        justify-content: center;
    }
    .lufs-media-summary {
        margin-bottom: 8px;
        color: var(--green-text);
        font-size: 11px;
        font-weight: 760;
        letter-spacing: .01em;
        text-align: center;
    }
    .lufs-media-list {
        display: flex;
        flex-direction: column;
        gap: 6px;
    }
    .lufs-media-row {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: 10px;
        min-height: 30px;
        padding: 6px 8px;
        border: 1px solid rgba(139,148,158,.18);
        border-radius: 7px;
        background: rgba(13,17,23,.34);
    }
    .lufs-media-name {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: rgba(201,209,217,.92);
        font-size: 11px;
        font-weight: 650;
    }
    .lufs-media-size,
    .lufs-media-more {
        color: rgba(139,148,158,.82);
        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
        font-size: 10px;
        white-space: nowrap;
    }
    .lufs-media-more {
        padding: 2px 8px;
        text-align: center;
    }
    .lufs-workflow-card {
        width: min(620px, 100%);
        max-width: 620px;
        justify-self: center;
        gap: 12px;
        padding: 0;
        border: 1px solid transparent;
        border-radius: 12px;
        background: transparent;
        box-shadow: none;
    }
    .lufs-workflow-layout > .lufs-workflow-card {
        width: min(620px, 100%);
        max-width: 620px;
    }
    .lufs-workflow-card .landing-media-dropzone {
        max-height: 190px;
        overflow: hidden;
    }
    .lufs-workflow-card .landing-media-dropzone:has(.lufs-collapse-dropzone-btn:not([hidden])) {
        padding-right: 54px;
    }
    .lufs-workflow-card .landing-media-dropzone .single-import-kicker,
    .lufs-workflow-card .landing-media-dropzone .single-import-title,
    .lufs-workflow-card .landing-media-dropzone .single-import-copy,
    .lufs-workflow-card .landing-media-dropzone .single-import-btn {
        transition:
            opacity var(--control-transition),
            max-width var(--control-transition),
            max-height var(--control-transition),
            margin var(--control-transition),
            padding var(--control-transition),
            border-color var(--control-transition),
            transform var(--control-transition);
    }
    .lufs-workflow-card .landing-media-dropzone .single-import-copy,
    .lufs-workflow-card .landing-media-dropzone .single-import-btn {
        max-height: 72px;
        overflow: hidden;
    }
    .lufs-workflow-card .landing-media-dropzone.is-collapsed {
        min-height: 58px;
        max-height: 58px;
        padding: 12px 54px 12px 14px;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        text-align: left;
        cursor: pointer;
        border-style: solid;
        background:
            linear-gradient(180deg, rgba(88,166,255,.075), rgba(13,17,23,.26));
    }
    .lufs-workflow-card .landing-media-dropzone.is-collapsed:hover,
    .lufs-workflow-card .landing-media-dropzone.is-collapsed:focus-visible {
        border-color: rgba(88,166,255,.62);
        background:
            linear-gradient(180deg, rgba(88,166,255,.11), rgba(13,17,23,.31));
    }
    .lufs-workflow-card .landing-media-dropzone.is-collapsed:focus-visible {
        outline: none;
        box-shadow: 0 0 0 2px rgba(88,166,255,.20);
    }
    .lufs-workflow-card .landing-media-dropzone.is-collapsed .single-import-kicker {
        flex: 0 0 auto;
    }
    .lufs-workflow-card .landing-media-dropzone.is-collapsed .single-import-title {
        min-width: 0;
        flex: 1 1 auto;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 13px;
        line-height: 1.1;
    }
    .lufs-workflow-card .landing-media-dropzone.is-collapsed .single-import-copy,
    .lufs-workflow-card .landing-media-dropzone.is-collapsed .single-import-btn {
        flex: 0 1 0;
        width: 0;
        min-width: 0;
        max-width: 0;
        max-height: 0;
        margin: 0;
        padding: 0;
        border-color: transparent;
        opacity: 0;
        pointer-events: none;
        transform: translateY(-2px);
    }
    .lufs-settings-card {
        display: flex;
        flex-direction: column;
        gap: 11px;
        padding-top: 2px;
    }
    .lufs-measurements {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }
    .lufs-measurement {
        min-width: 0;
        border: 1px solid rgba(139,148,158,.15);
        border-radius: 8px;
        background: rgba(0,0,0,.16);
        padding: 9px 10px;
        display: flex;
        flex-direction: column;
        gap: 4px;
    }
    .lufs-measurement span,
    .lufs-slider-head span {
        color: rgba(139,148,158,.86);
        font-size: 10px;
        font-weight: 850;
        letter-spacing: .06em;
        line-height: 1;
        text-transform: uppercase;
    }
    .lufs-measurement strong {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: var(--text-main);
        font-size: 14px;
        font-weight: 780;
        line-height: 1.2;
    }
    #lufs-output-value {
        display: -webkit-box;
        overflow: hidden;
        white-space: normal;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        font-size: 13px;
        line-height: 1.22;
    }
    .lufs-slider-group {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }
    .lufs-slider-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
    }
    .lufs-target-input {
        width: 78px;
        height: 30px;
        border: 1px solid rgba(88,166,255,.28);
        border-radius: 8px;
        background: rgba(13,17,23,.7);
        color: var(--accent);
        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
        font-size: 12px;
        font-weight: 760;
        text-align: left;
        padding: 0 9px;
        outline: none;
    }
    .lufs-target-input:focus {
        border-color: rgba(88,166,255,.65);
        box-shadow: 0 0 0 2px rgba(88,166,255,.12);
    }
    .lufs-target-slider {
        width: 100%;
        height: 18px;
        margin: 0;
        appearance: none;
        -webkit-appearance: none;
        background: transparent;
        cursor: pointer;
    }
    .lufs-target-slider:disabled {
        cursor: default;
        opacity: .55;
    }
    .lufs-target-slider::-webkit-slider-runnable-track {
        height: 4px;
        border-radius: 999px;
        background: linear-gradient(90deg, rgba(88,166,255,.95), rgba(88,166,255,.32));
    }
    .lufs-target-slider::-webkit-slider-thumb {
        width: 16px;
        height: 16px;
        margin-top: -6px;
        border: none;
        border-radius: 50%;
        background: #79c0ff;
        box-shadow: 0 0 0 1px rgba(255,255,255,.18);
        -webkit-appearance: none;
    }
    .lufs-target-slider::-moz-range-track {
        height: 4px;
        border-radius: 999px;
        background: linear-gradient(90deg, rgba(88,166,255,.95), rgba(88,166,255,.32));
    }
    .lufs-target-slider::-moz-range-thumb {
        width: 16px;
        height: 16px;
        border: none;
        border-radius: 50%;
        background: #79c0ff;
        box-shadow: 0 0 0 1px rgba(255,255,255,.18);
    }
    .lufs-slider-scale {
        display: flex;
        justify-content: space-between;
        color: rgba(139,148,158,.86);
        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
        font-size: 10px;
        line-height: 1;
    }
    .lufs-advanced-output {
        margin-top: 1px;
        padding-top: 11px;
        border-top: 1px solid rgba(139,148,158,.15);
        color: rgba(201,209,217,.82);
    }
    .lufs-advanced-output > summary {
        list-style: none;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        color: rgba(139,148,158,.92);
        font-size: 10px;
        font-weight: 850;
        letter-spacing: .06em;
        line-height: 1;
        text-transform: uppercase;
        transition: color var(--control-transition);
    }
    .lufs-advanced-output > summary::-webkit-details-marker {
        display: none;
    }
    .lufs-advanced-output > summary::before {
        content: "›";
        flex: 0 0 auto;
        color: rgba(121,192,255,.82);
        font-size: 14px;
        line-height: 1;
        transform: rotate(0deg);
        transition: transform var(--control-transition);
    }
    .lufs-advanced-output[open] > summary::before {
        transform: rotate(90deg);
    }
    .lufs-advanced-output > summary:hover {
        color: rgba(201,209,217,.94);
    }
    .lufs-advanced-output > summary span {
        flex: 1 1 auto;
    }
    .lufs-advanced-output > summary strong {
        flex: 0 1 auto;
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: var(--blue-text);
        font-size: 10px;
        font-weight: 820;
        text-align: right;
        text-transform: none;
        letter-spacing: .02em;
    }
    .lufs-output-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        margin-top: 10px;
    }
    .lufs-output-cell {
        min-width: 0;
        padding: 8px 9px;
        border: 1px solid rgba(139,148,158,.12);
        border-radius: 8px;
        background: rgba(13,17,23,.24);
    }
    .lufs-output-cell span {
        display: block;
        color: rgba(139,148,158,.78);
        font-size: 8px;
        font-weight: 850;
        letter-spacing: .08em;
        line-height: 1;
        text-transform: uppercase;
    }
    .lufs-output-cell strong {
        display: block;
        min-width: 0;
        margin-top: 5px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: rgba(201,209,217,.94);
        font-size: 11px;
        font-weight: 720;
        line-height: 1.15;
    }
    .lufs-output-cell-select {
        display: flex;
        flex-direction: column;
        gap: 5px;
    }
    .lufs-output-select {
        width: 100%;
        min-width: 0;
        height: 26px;
        border: 1px solid rgba(88,166,255,.36);
        border-radius: 7px;
        background: rgba(13,17,23,.34);
        color: rgba(201,209,217,.94);
        font: 720 11px/1 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
        outline: none;
        padding: 0 24px 0 8px;
        transition:
            border-color var(--control-transition),
            background var(--control-transition),
            color var(--control-transition),
            opacity var(--control-transition);
    }
    .lufs-output-select:not(:disabled):hover,
    .lufs-output-select:not(:disabled):focus-visible {
        border-color: rgba(121,192,255,.7);
        background: rgba(22,35,50,.62);
    }
    .lufs-output-select:disabled {
        cursor: default;
        opacity: .58;
    }
    .lufs-output-note {
        margin: 8px 0 0;
        color: rgba(139,148,158,.78);
        font-size: 11px;
        line-height: 1.4;
    }
    .lufs-progress-slot {
        min-height: 8px;
    }
    .lufs-progress-slot:not([data-active]) {
        display: none;
        min-height: 0;
    }
    .lufs-inline-progress {
        position: relative;
        height: 8px;
        border: 1px solid rgba(88,166,255,.26);
        border-radius: 999px;
        overflow: hidden;
        background: rgba(13,17,23,.52);
    }
    .lufs-inline-progress-fill {
        height: 100%;
        border-radius: inherit;
        background: linear-gradient(90deg, #58a6ff, #79c0ff);
        transition: width .18s ease;
    }
    .lufs-inline-progress[data-indeterminate="true"] .lufs-inline-progress-fill {
        position: absolute;
        left: -40%;
        width: 38% !important;
        animation: import-progress-slide 1.2s ease-in-out infinite;
    }
    .lufs-primary-btn:not(:disabled),
    .lufs-download-btn {
        background: var(--accent);
        border-color: rgba(88,166,255,.75);
        color: #06111d;
    }
    .lufs-download-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        text-decoration: none;
    }
    .lufs-download-btn[hidden] {
        display: none;
    }
    .import-progress {
        display: flex;
        flex-direction: column;
        gap: 6px;
        text-align: left;
        color: var(--text-main);
    }
    .import-progress-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        color: var(--text-main);
        font-size: 11px;
        font-weight: 700;
    }
    .import-progress-bar {
        height: 8px;
        border: 1px solid rgba(88,166,255,.32);
        border-radius: 999px;
        overflow: hidden;
        background: rgba(13,17,23,.7);
    }
    .import-progress-fill {
        height: 100%;
        border-radius: inherit;
        background: linear-gradient(90deg, #3fb950, #58a6ff);
        transition: width .18s ease;
    }
    .import-progress[data-indeterminate="true"] .import-progress-bar {
        position: relative;
    }
    .import-progress[data-indeterminate="true"] .import-progress-fill {
        position: absolute;
        left: -40%;
        width: 38% !important;
        animation: import-progress-slide 1.2s ease-in-out infinite;
    }
    .import-progress-meta {
        min-height: 14px;
        color: var(--text-muted);
        font-size: 10px;
        line-height: 1.35;
    }
    @keyframes import-progress-slide {
        0% { left: -40%; }
        100% { left: 105%; }
    }
    .source-card {
        background: var(--bg-panel);
        border: 1px solid var(--border);
        border-radius: 8px;
        padding: 16px 20px;
        width: min(420px, calc(100vw - 32px));
        cursor: pointer;
        transition: border-color .15s, background .15s;
    }
    .source-card:hover { border-color: var(--accent); background: var(--bg-hover); }
    .project-card-layout {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: 14px;
    }
    .project-card-main {
        min-width: 0;
        display: flex;
        flex-direction: column;
        gap: 4px;
    }
    .project-card-name {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-weight: 700;
        font-size: 14px;
        line-height: 1.25;
    }
    .project-card-meta {
        font-size: 11px;
        color: var(--text-muted);
        line-height: 1.2;
    }
    .project-delete-btn {
        background: var(--red-soft);
        border: 1px solid var(--red-border);
        color: var(--red-text);
        border-radius: 7px;
        padding: 6px 12px;
        font-size: 11px;
        font-weight: 700;
        cursor: pointer;
        min-width: 72px;
        justify-self: end;
        flex-shrink: 0;
    }
    .project-delete-btn:hover { background: rgba(248,81,73,.18); }

    .landing-modal-backdrop {
        position: fixed;
        inset: 0;
        z-index: 300;
        display: grid;
        place-items: center;
        padding: 28px;
        background: rgba(1,4,9,.68);
        backdrop-filter: blur(9px);
    }
    .landing-modal-backdrop[hidden] {
        display: none;
    }
    .landing-modal {
        width: min(520px, calc(100vw - 40px));
        border: 1px solid rgba(139,148,158,.30);
        border-radius: 12px;
        background:
            linear-gradient(180deg, rgba(255,255,255,.03), rgba(13,17,23,.76)),
            var(--bg-panel);
        box-shadow: 0 24px 72px rgba(0,0,0,.42);
        overflow: hidden;
    }
    .landing-modal-head {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 16px;
        padding: 18px 20px 16px;
        border-bottom: 1px solid rgba(139,148,158,.18);
    }
    .landing-modal-close {
        width: 28px;
        height: 28px;
        border: 1px solid transparent;
        border-radius: 6px;
        background: transparent;
        color: rgba(201,209,217,.72);
        cursor: pointer;
        font-size: 22px;
        line-height: 1;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        transition:
            background var(--control-transition),
            border-color var(--control-transition),
            color var(--control-transition);
    }
    .landing-modal-close:hover {
        background: rgba(139,148,158,.10);
        border-color: rgba(139,148,158,.22);
        color: var(--text-main);
    }
    .landing-modal-body {
        padding: 18px 20px 4px;
        display: flex;
        flex-direction: column;
        gap: 14px;
        color: rgba(201,209,217,.76);
        font-size: 13px;
        line-height: 1.5;
    }
    .landing-modal-body p {
        margin: 0;
    }
    .landing-modal-placeholder {
        min-height: 96px;
        border: 1px dashed rgba(88,166,255,.30);
        border-radius: 10px;
        background: linear-gradient(180deg, rgba(88,166,255,.075), rgba(13,17,23,.28));
        padding: 16px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 7px;
    }
    .landing-modal-placeholder-label {
        color: var(--blue-text);
        font-size: 10px;
        font-weight: 800;
        letter-spacing: .08em;
        text-transform: uppercase;
    }
    .landing-modal-actions {
        display: flex;
        justify-content: flex-end;
        gap: 10px;
        padding: 16px 20px 20px;
    }
    .landing-modal-primary {
        min-width: 118px;
        border-radius: 7px;
        padding: 9px 16px;
    }

    @media (max-width: 900px) {
        .landing {
            align-items: stretch;
            justify-content: flex-start;
            padding: 20px;
        }
        .landing-shell,
        .landing-shell:has(#lufs-correction-panel:not([hidden])) {
            width: 100%;
            height: auto;
            min-height: 0;
            margin-left: 0;
            grid-template-columns: 1fr;
        }
        .landing-shell::after,
        .landing-shell > .landing-empty-panel,
        .landing-shell > .landing-panel {
            grid-column: 1;
            grid-row: 2;
        }
        .landing-shell > .landing-panel {
            overflow: visible;
            scrollbar-gutter: auto;
        }
        .lufs-status-content {
            grid-template-columns: 1fr;
            gap: 3px;
            text-align: center;
        }
        .lufs-status-message {
            text-align: center;
        }
        .lufs-media-profile-card {
            position: static;
            width: 100%;
            max-height: none;
            overflow: visible;
        }
        .lufs-media-profile-card:not(.is-visible) {
            display: none;
        }
        .landing-mode-card {
            min-height: 118px;
        }
    }

    .qc-page { flex: 1; overflow: auto; padding: 24px; display: flex; flex-direction: column; gap: 18px; }
    .qc-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
    .qc-title { font-size: 22px; font-weight: 800; color: var(--text-main); }
    .qc-subtitle { font-size: 12px; color: var(--text-muted); margin-top: 4px; line-height: 1.35; }
    .qc-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
    .qc-summary-card {
        min-height: 126px;
        background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(13,17,23,0.5));
        border: 1px solid var(--border);
        border-radius: var(--panel-card-radius);
        padding: var(--panel-card-padding-y) var(--panel-card-padding-x);
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 8px;
    }
    .qc-summary-card.pass { border-color: var(--green-border); box-shadow: inset 0 0 0 1px var(--green-soft); }
    .qc-summary-card.warn { border-color: var(--amber-border); box-shadow: inset 0 0 0 1px var(--amber-soft); }
    .qc-summary-card.fail { border-color: var(--red-border); box-shadow: inset 0 0 0 1px var(--red-soft); }
    .qc-summary-card.na { border-color: rgba(139,148,158,.35); }
    .qc-summary-label { font-size: 12px; font-weight: 800; color: var(--text-muted); text-transform: uppercase; letter-spacing: .05em; }
    .qc-summary-value { font-size: 24px; font-weight: 800; line-height: 1.15; color: var(--text-main); }
    .qc-status-panel {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        background: linear-gradient(180deg, rgba(255,255,255,.025), rgba(13,17,23,.70));
        border: 1px solid var(--border);
        border-radius: var(--panel-card-radius);
        padding: 12px 14px;
    }
    .qc-layout { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 14px; min-height: 0; }
    .qc-sidecard, .qc-main {
        background: linear-gradient(180deg, rgba(255,255,255,.025), rgba(13,17,23,.70));
        border: 1px solid var(--border);
        border-radius: var(--panel-card-radius);
        padding: var(--panel-card-padding-y);
    }
    .qc-main {
        background: transparent;
        border: 0;
        border-radius: 0;
        padding: 0;
    }
    .qc-files { display: flex; flex-direction: column; gap: 8px; padding-right: 2px; }
    .qc-file-row { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--text-main); min-width: 0; }
    .qc-file-row span:last-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .qc-file-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); display: inline-block; }
    .qc-file-track {
        padding-top: 8px;
        border-top: 1px solid rgba(139,148,158,.16);
    }
    .qc-file-track:first-child {
        padding-top: 0;
        border-top: 0;
    }
    .qc-file-track-name {
        display: flex;
        align-items: center;
        gap: 8px;
        min-width: 0;
        color: var(--text-main);
        font-size: 12px;
        font-weight: 750;
    }
    .qc-file-track-name span:last-child {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .qc-file-clips {
        display: flex;
        flex-direction: column;
        gap: 2px;
        margin-top: 5px;
        padding-left: 16px;
    }
    .qc-file-clip-row {
        display: grid;
        grid-template-columns: minmax(72px, .82fr) minmax(96px, 1.18fr) auto;
        gap: 8px;
        align-items: center;
        min-width: 0;
        padding: 2px 0;
        color: var(--text-muted);
        font-size: 11px;
        line-height: 1.25;
    }
    .qc-file-clip,
    .qc-file-media {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .qc-file-clip { color: rgba(240,246,252,.84); }
    .qc-file-clip-row.fail .qc-file-media { color: var(--red-text); }
    .qc-file-clip-row.na .qc-file-media { color: rgba(201,209,217,.56); }
    .qc-counts { display: flex; flex-wrap: wrap; gap: 8px; }
    .qc-count-chip {
        border-radius: 999px;
        padding: 4px 10px;
        font-size: 11px;
        font-weight: 700;
        border: 1px solid var(--border);
        color: var(--text-muted);
        background: rgba(139,148,158,.1);
    }
    .qc-count-chip.pass { border-color: var(--green-border); color: var(--green-text); background: var(--green-soft); }
    .qc-count-chip.warn { border-color: var(--amber-border); color: var(--amber-text); background: var(--amber-soft); }
    .qc-count-chip.fail { border-color: var(--red-border); color: var(--red-text); background: var(--red-soft); }
    .qc-checklist { display: flex; flex-direction: column; gap: 6px; }
    .qc-check-row {
        border: 1px solid var(--border);
        border-left: 2px solid var(--border);
        border-radius: var(--panel-row-radius);
        padding: 10px 12px;
        background:
            linear-gradient(180deg, rgba(255,255,255,.018), rgba(13,17,23,.60)),
            rgba(13,17,23,.58);
        transition:
            border-color var(--control-transition),
            background var(--control-transition),
            box-shadow var(--control-transition),
            filter var(--control-transition);
    }
    .qc-check-row.has-detail { cursor: pointer; }
    .qc-check-row.has-detail:hover {
        border-color: rgba(139,148,158,.42);
        background:
            linear-gradient(180deg, rgba(255,255,255,.026), rgba(13,17,23,.64)),
            rgba(13,17,23,.62);
    }
    .qc-check-row.running { border-left-color: var(--accent); }
    .qc-check-row.pass { border-left-color: var(--green); }
    .qc-check-row.warn { border-left-color: var(--warn); }
    .qc-check-row.fail { border-left-color: var(--err); }
    .qc-check-row.na { border-left-color: var(--text-muted); }
    .qc-check-toggle {
        appearance: none;
        border: 0;
        background: transparent;
        color: inherit;
        padding: 0;
        margin: 0;
        width: 100%;
        display: grid;
        grid-template-columns: 13px minmax(0, 1fr) auto;
        align-items: center;
        gap: 7px;
        text-align: left;
        cursor: pointer;
    }
    .qc-check-toggle:disabled {
        cursor: default;
    }
    .qc-check-chevron {
        width: 13px;
        height: 13px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: rgba(139,148,158,.86);
    }
    .qc-check-chevron::before {
        content: "";
        width: 5px;
        height: 5px;
        border-right: 1.5px solid currentColor;
        border-bottom: 1.5px solid currentColor;
        transform: rotate(-45deg);
        transition: transform .16s ease, opacity .16s ease;
        opacity: .78;
    }
    .qc-check-row.is-expanded .qc-check-chevron::before {
        transform: rotate(45deg);
    }
    .qc-check-row:not(.has-detail) .qc-check-chevron::before {
        opacity: .18;
    }
    .qc-check-title { font-size: 14px; font-weight: 750; color: var(--text-main); line-height: 1.2; }
    .qc-check-status {
        border: 1px solid var(--border);
        border-radius: 999px;
        padding: 3px 7px;
        background: rgba(139,148,158,.10);
        font-size: 9.5px;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: .05em;
        color: var(--text-muted);
        line-height: 1;
        white-space: nowrap;
    }
    .qc-check-row.pass .qc-check-status { border-color: var(--green-border); background: var(--green-soft); color: var(--green-text); }
    .qc-check-row.warn .qc-check-status { border-color: var(--amber-border); background: var(--amber-soft); color: var(--amber-text); }
    .qc-check-row.fail .qc-check-status { border-color: var(--red-border); background: var(--red-soft); color: var(--red-text); }
    .qc-check-row.running .qc-check-status { border-color: var(--blue-border); background: var(--blue-soft); color: var(--blue-hover); }
    .qc-check-summary { font-size: 12px; color: rgba(240,246,252,.88); margin: 6px 0 0 20px; line-height: 1.45; }
    .qc-check-detail {
        font-size: 11px;
        color: var(--text-muted);
        margin: 0 0 0 20px;
        line-height: 1.55;
        max-height: 0;
        opacity: 0;
        overflow: hidden;
        cursor: default;
        transition: max-height .22s ease, opacity .16s ease, margin-top .16s ease;
    }
    .qc-check-row.is-expanded .qc-check-detail {
        max-height: 1200px;
        opacity: 1;
        margin-top: 10px;
    }
    .qc-detail-copy { color: var(--text-muted); }
    .qc-detail-list {
        margin: 0;
        padding-left: 16px;
        display: flex;
        flex-direction: column;
        gap: 3px;
    }
    .qc-metric-table-wrap {
        width: 100%;
        overflow-x: auto;
        border-top: 1px solid rgba(139,148,158,.18);
        border-bottom: 1px solid rgba(139,148,158,.12);
        background: transparent;
    }
    .qc-metric-table {
        width: 100%;
        border-collapse: collapse;
        min-width: 330px;
        font-size: 11px;
    }
    .qc-metric-table th,
    .qc-metric-table td {
        padding: 6px 2px;
        border-bottom: 1px solid rgba(139,148,158,.10);
        text-align: left;
        vertical-align: middle;
    }
    .qc-metric-table tr:last-child td { border-bottom: 0; }
    .qc-metric-table th {
        color: var(--text-muted);
        font-size: 9.5px;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: .05em;
    }
    .qc-num-cell {
        text-align: right;
        font-variant-numeric: tabular-nums;
        color: rgba(240,246,252,.84);
        white-space: nowrap;
    }
    .qc-track-cell {
        max-width: 128px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: var(--text-main);
    }
    .qc-mini-status {
        display: inline-flex;
        align-items: center;
        border: 1px solid var(--border);
        border-radius: 999px;
        padding: 2px 6px;
        font-size: 9px;
        line-height: 1;
        font-weight: 800;
        letter-spacing: .04em;
    }
    .qc-mini-status.pass { border-color: var(--green-border); background: var(--green-soft); color: var(--green-text); }
    .qc-mini-status.warn { border-color: var(--amber-border); background: var(--amber-soft); color: var(--amber-text); }
    .qc-mini-status.fail { border-color: var(--red-border); background: var(--red-soft); color: var(--red-text); }
    .qc-mini-status.na { border-color: rgba(139,148,158,.35); background: rgba(139,148,158,.10); color: var(--text-muted); }
    .qc-evidence-list {
        display: flex;
        flex-direction: column;
        gap: 0;
        border-top: 1px solid rgba(139,148,158,.14);
    }
    .qc-evidence-row {
        border-bottom: 1px solid rgba(139,148,158,.10);
        padding: 7px 0;
        background: transparent;
    }
    .qc-evidence-title {
        color: var(--text-main);
        font-weight: 700;
        margin-bottom: 4px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .qc-evidence-values {
        display: flex;
        flex-wrap: wrap;
        gap: 5px 10px;
    }
    .qc-evidence-values span { color: var(--text-muted); }
    .qc-evidence-values strong { color: rgba(201,209,217,.78); font-weight: 700; }
    .qc-inventory-list {
        display: flex;
        flex-direction: column;
        gap: 0;
        border-top: 1px solid rgba(139,148,158,.14);
    }
    .qc-inventory-track {
        padding: 8px 0;
        border-bottom: 1px solid rgba(139,148,158,.10);
    }
    .qc-inventory-track:last-child { border-bottom: 0; }
    .qc-inventory-track-head {
        display: grid;
        grid-template-columns: 8px minmax(0, 1fr) auto auto;
        align-items: center;
        gap: 8px;
        min-width: 0;
    }
    .qc-inventory-track-name {
        color: var(--text-main);
        font-weight: 750;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .qc-inventory-count {
        color: var(--text-muted);
        font-size: 10px;
        font-weight: 750;
        text-transform: uppercase;
        letter-spacing: .04em;
        white-space: nowrap;
    }
    .qc-inventory-clips {
        display: flex;
        flex-direction: column;
        gap: 2px;
        margin-top: 6px;
        padding-left: 16px;
    }
    .qc-inventory-clip-row {
        display: grid;
        grid-template-columns: minmax(78px, .85fr) minmax(104px, 1.15fr) auto;
        gap: 8px;
        align-items: center;
        min-width: 0;
        color: var(--text-muted);
        font-size: 11px;
        line-height: 1.25;
    }
    .qc-inventory-clip,
    .qc-inventory-media {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .qc-inventory-clip { color: rgba(240,246,252,.84); }
    .qc-inventory-clip-row.fail .qc-inventory-media { color: var(--red-text); }
    .qc-inventory-clip-row.na .qc-inventory-media { color: rgba(201,209,217,.56); }
    .pane-qc .qc-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pane-qc .qc-layout { grid-template-columns: 1fr; }
    .pane-qc .qc-summary-card { min-height: 96px; padding: 14px; }
    .pane-qc .qc-summary-value { font-size: 18px; }

    @media (max-width: 1200px) {
        .qc-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
        .qc-layout { grid-template-columns: 1fr; }
    }
    .time-display {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 96px;
        min-width: 96px;
        max-width: 96px;
        height: var(--header-button-height);
        padding: 0 2px;
        border: 0;
        border-radius: 0;
        background: transparent;
        color: var(--text-main);
        font-family: ui-monospace, monospace;
        font-size: 16px;
        font-weight: 300;
        letter-spacing: .02em;
        line-height: 1;
        font-variant-numeric: tabular-nums;
        font-feature-settings: "tnum" 1, "zero" 1;
        box-shadow: none;
        pointer-events: none;
        flex: 0 0 auto;
        z-index: 24;
    }
    .timeline-tools-dock {
        position: fixed;
        right: 14px;
        bottom: calc(var(--timeline-console-inset, 30px) + 12px);
        z-index: 35;
        display: flex;
        align-items: center;
        gap: 7px;
        padding: 5px 6px;
        border: 1px solid rgba(139,148,158,.22);
        border-radius: 5px;
        background: rgba(5,8,11,.94);
        box-shadow: 0 8px 18px rgba(0,0,0,.28);
        backdrop-filter: blur(10px);
        transform-origin: right center;
        transition:
            transform .25s ease,
            bottom .25s ease,
            gap .22s ease,
            padding .22s ease,
            border-color .18s ease,
            background .18s ease,
            box-shadow .18s ease;
        will-change: transform, gap;
    }
    .timeline-tools-content {
        display: flex;
        align-items: center;
        gap: 7px;
        max-width: 260px;
        overflow: visible;
        opacity: 1;
        transition:
            max-width .26s ease,
            opacity .16s ease .08s;
    }
    .timeline-tools-dock.collapsed {
        gap: 0;
        padding: 5px 6px;
        cursor: pointer;
    }
    .timeline-tools-dock.collapsed .timeline-tools-content {
        max-width: 0;
        overflow: hidden;
        opacity: 0;
        transition:
            max-width .26s ease,
            opacity .12s ease;
        pointer-events: none;
    }
    .timeline-tools-toggle {
        position: relative;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 18px;
        min-width: 18px;
        height: 18px;
        padding: 0;
        border: 0;
        border-radius: 4px;
        background: transparent;
        color: var(--text-muted);
        cursor: pointer;
        line-height: 0;
        transition:
            width .2s ease,
            min-width .2s ease,
            height .2s ease,
            background .12s ease,
            border-color .12s ease,
            color .12s ease;
    }
    .timeline-tools-toggle:hover {
        background: rgba(139,148,158,.14);
        color: var(--text-main);
    }
    .timeline-tools-collapse-icon,
    .timeline-tools-wrench-icon {
        position: absolute;
        inset: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        transition: opacity .16s ease, transform .16s ease;
    }
    .timeline-tools-wrench-icon {
        opacity: 0;
        transform: scale(.74) rotate(-8deg);
    }
    .timeline-tools-wrench-icon svg {
        width: 13px;
        height: 13px;
    }
    .timeline-tools-dock.collapsed .timeline-tools-toggle {
        width: 18px;
        min-width: 18px;
        height: 18px;
        border: 0;
        border-radius: 4px;
        color: var(--text-muted);
        background: transparent;
    }
    .timeline-tools-dock.collapsed .timeline-tools-toggle:hover {
        color: var(--text-main);
        background: rgba(139,148,158,.14);
    }
    .timeline-tools-dock.collapsed .timeline-tools-collapse-icon {
        opacity: 0;
        transform: scale(.72) translateX(-2px);
    }
    .timeline-tools-dock.collapsed .timeline-tools-wrench-icon {
        opacity: 1;
        transform: scale(1) rotate(0deg);
    }
    .region-key-control {
        position: relative;
        display: flex;
        align-items: center;
    }
    .region-legend-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 28px;
        min-width: 28px;
        height: 18px;
        min-height: 18px;
        max-height: 18px;
        padding: 0;
        line-height: 0;
        box-sizing: border-box;
    }
    .region-legend-toggle[hidden] {
        display: none;
    }
    .region-legend-toggle.active {
        color: var(--accent);
        border-color: rgba(88,166,255,.72);
        background: rgba(88,166,255,.14);
    }
    .region-key-icon {
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 2px;
        width: 13px;
        height: 10px;
        flex: 0 0 auto;
    }
    .region-key-row {
        display: block;
        width: 100%;
        height: 2px;
        border-radius: 999px;
        box-shadow: 0 0 0 1px rgba(255,255,255,.08) inset;
    }
    .region-key-row-voice { background: #a9d5ff; }
    .region-key-row-crosstalk { background: #ff9aa6; }
    .region-key-row-music { background: #9ee6b4; }
    body:has(.pane-agent.open) .timeline-tools-dock {
        transform: translate3d(-400px, 0, 0);
    }
    .zoom-controls {
        position: static;
        display: flex;
        align-items: center;
        gap: 4px;
        margin-left: 0;
        padding: 0 0 0 7px;
        border: 0;
        border-left: 1px solid rgba(139,148,158,.18);
        border-radius: 0;
        background: transparent;
        box-shadow: none;
        backdrop-filter: none;
        transition: none;
        will-change: auto;
    }
    .zoom-btn { background: var(--bg-hover); border: 1px solid var(--border); color: var(--text-main); width: 18px; height: 18px; border-radius: 4px; cursor: pointer; font-size: 12px; display: flex; align-items: center; justify-content: center; line-height: 1; }
    .zoom-btn:hover { background: #30363d; }
    .zoom-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 16px;
        height: 18px;
        color: var(--text-muted);
        flex: 0 0 auto;
    }
    .zoom-slider {
        --slider-progress: 0%;
        width: 58px;
        height: 18px;
        margin: 0;
        padding: 0;
        -webkit-appearance: none;
        appearance: none;
        background: transparent;
        cursor: pointer;
        display: block;
    }
    .zoom-slider::-webkit-slider-runnable-track {
        height: 3px;
        border-radius: 999px;
        background: linear-gradient(
            90deg,
            rgb(140,145,153) 0%,
            rgb(140,145,153) var(--slider-progress),
            rgba(139,148,158,.32) var(--slider-progress),
            rgba(139,148,158,.32) 100%
        );
    }
    .zoom-slider::-webkit-slider-thumb {
        width: 10px;
        height: 10px;
        margin-top: -3.5px;
        -webkit-appearance: none;
        appearance: none;
        border: 0;
        border-radius: 50%;
        background: rgb(140,145,153);
        box-shadow: 0 1px 5px rgba(0,0,0,.36);
        transition:
            background var(--control-transition),
            transform var(--control-transition),
            box-shadow var(--control-transition);
    }
    .zoom-slider:hover::-webkit-slider-thumb,
    .zoom-slider:focus-visible::-webkit-slider-thumb {
        background: rgb(140,145,153);
        transform: scale(1.06);
        box-shadow: 0 1px 7px rgba(0,0,0,.4);
    }
    .zoom-slider::-moz-range-track {
        height: 3px;
        border-radius: 999px;
        background: linear-gradient(
            90deg,
            rgb(140,145,153) 0%,
            rgb(140,145,153) var(--slider-progress),
            rgba(139,148,158,.32) var(--slider-progress),
            rgba(139,148,158,.32) 100%
        );
    }
    .zoom-slider::-moz-range-thumb {
        width: 10px;
        height: 10px;
        border: 0;
        border-radius: 50%;
        background: rgb(140,145,153);
        box-shadow: 0 1px 5px rgba(0,0,0,.36);
        transition:
            background var(--control-transition),
            transform var(--control-transition),
            box-shadow var(--control-transition);
    }
    .zoom-slider:hover::-moz-range-thumb,
    .zoom-slider:focus-visible::-moz-range-thumb {
        background: rgb(140,145,153);
        transform: scale(1.06);
        box-shadow: 0 1px 7px rgba(0,0,0,.4);
    }
    .zoom-slider:focus-visible {
        outline: none;
        box-shadow: none;
    }
    .zoom-slider::-moz-focus-outer {
        border: 0;
    }
    .timeline-visual-controls {
        position: static;
        display: flex;
        align-items: center;
        gap: 4px;
        margin-left: 0;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
        backdrop-filter: none;
        transition: none;
        will-change: auto;
    }
    .timeline-visual-controls .top-visual-toggle {
        width: 28px;
        min-width: 28px;
        height: 18px;
        min-height: 18px;
        max-height: 18px;
        padding: 0;
        font-size: 11px;
        font-weight: 800;
        line-height: 1;
    }
    .timeline-tools-dock [data-ui-tooltip] {
        position: relative;
    }
    .timeline-tools-dock [data-ui-tooltip]::after {
        content: attr(data-ui-tooltip);
        position: absolute;
        left: 50%;
        bottom: calc(100% + 9px);
        z-index: 70;
        min-width: max-content;
        max-width: 180px;
        padding: 5px 7px;
        border: 1px solid rgba(139,148,158,.24);
        border-radius: 5px;
        background: rgba(5,8,11,.96);
        color: var(--text-main);
        font-size: 10px;
        font-weight: 650;
        line-height: 1.2;
        letter-spacing: .01em;
        white-space: nowrap;
        box-shadow: 0 8px 18px rgba(0,0,0,.32);
        opacity: 0;
        pointer-events: none;
        transform: translate(-50%, 4px);
        transition: opacity .14s ease, transform .14s ease;
    }
    .timeline-tools-dock [data-ui-tooltip]::before {
        content: "";
        position: absolute;
        left: 50%;
        bottom: calc(100% + 5px);
        z-index: 71;
        width: 7px;
        height: 7px;
        border-right: 1px solid rgba(139,148,158,.24);
        border-bottom: 1px solid rgba(139,148,158,.24);
        background: rgba(5,8,11,.96);
        opacity: 0;
        pointer-events: none;
        transform: translate(-50%, 4px) rotate(45deg);
        transition: opacity .14s ease, transform .14s ease;
    }
    .timeline-tools-dock [data-ui-tooltip]:hover::after,
    .timeline-tools-dock [data-ui-tooltip]:hover::before,
    .timeline-tools-dock [data-ui-tooltip]:focus-visible::after,
    .timeline-tools-dock [data-ui-tooltip]:focus-visible::before {
        opacity: 1;
        transform: translate(-50%, 0);
    }
    .timeline-tools-dock [data-ui-tooltip]:hover::before,
    .timeline-tools-dock [data-ui-tooltip]:focus-visible::before {
        transform: translate(-50%, 0) rotate(45deg);
    }
    .timeline-tools-dock .region-legend-toggle.active::after,
    .timeline-tools-dock .region-legend-toggle.active::before {
        display: none;
    }
    .agent-mode-controls {
        position: absolute;
        top: 8px;
        right: 16px;
        width: calc(400px - 32px);
        z-index: 36;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 8px;
    }
    .automix-panel-status {
        flex: 1 1 auto;
        min-width: 0;
        max-width: none;
        height: 26px;
        display: inline-flex;
        align-items: center;
        justify-content: flex-start;
        padding: 0 4px;
        color: var(--text-muted);
        font-size: 12px;
        font-weight: 650;
        line-height: 1;
        letter-spacing: .01em;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        transition: color .18s ease, opacity .18s ease;
    }
    .automix-panel-status[data-state="idle"] {
        opacity: .72;
    }
    .automix-panel-status[data-state="running"] {
        color: var(--blue-text);
        opacity: 1;
    }
    .automix-panel-status[data-state="done"] {
        color: var(--green-text);
        opacity: 1;
    }
    .automix-panel-status[data-state="reset"] {
        color: var(--text-main);
        opacity: .9;
    }
    .automix-panel-status[data-state="error"] {
        color: var(--red-text);
        opacity: 1;
    }
    .timeline-hover-time {
        position: fixed;
        z-index: 60;
        display: none;
        align-items: center;
        justify-content: center;
        min-width: 68px;
        padding: 0 8px;
        border: 1px solid rgba(88,166,255,.32);
        border-radius: 3px;
        background: rgba(5,8,11,.94);
        color: var(--text-main);
        box-sizing: border-box;
        font-family: "SFMono-Regular", "SF Mono", "Cascadia Mono", "Consolas", "Liberation Mono", "Menlo", monospace;
        font-size: 11px;
        font-weight: 400;
        line-height: 1;
        letter-spacing: .02em;
        box-shadow: inset 0 0 0 1px rgba(13,17,23,.22);
        pointer-events: none;
        font-variant-numeric: tabular-nums;
        font-feature-settings: "tnum" 1, "zero" 1;
    }
    .timeline-hover-time.visible { display: inline-flex; }
    .timeline-hover-line {
        position: fixed;
        z-index: 32;
        display: none;
        width: 1px;
        background: rgba(201,209,217,.58);
        box-shadow: 0 0 0 1px rgba(13,17,23,.24);
        pointer-events: none;
    }
    .timeline-hover-line.visible { display: block; }
    .timeline-playhead-line {
        position: fixed;
        z-index: 31;
        display: none;
        width: 1px;
        background: rgba(216,229,240,.72);
        box-shadow:
            0 0 0 1px rgba(13,17,23,.28),
            0 0 8px rgba(88,166,255,.16);
        pointer-events: none;
    }
    .timeline-playhead-line.visible { display: block; }

    /* WaveSurfer timeline plugin renders inside the waveform wrapper — syncs automatically */

    .track-header { display: flex; align-items: center; gap: 8px; padding: 3px 10px; background: var(--bg-panel); border-bottom: 1px solid rgba(48,54,61,.5); font-size: 11px; color: var(--text-muted); }
    .track-lufs { font-family: ui-monospace, monospace; font-size: 9px; padding: 1px 5px; border-radius: 3px; }
    .track-dur { font-family: ui-monospace, monospace; font-size: 9px; color: var(--text-muted); margin-left: auto; }

    .meta-strip { display: flex; align-items: center; gap: 12px; padding: 6px 14px; background: var(--bg-panel); border-bottom: 1px solid var(--border); font-size: 11px; overflow-x: auto; flex-shrink: 0; }
    .meta-strip-group { display: flex; align-items: center; gap: 5px; white-space: nowrap; }
    .meta-strip-sep { width: 1px; height: 16px; background: var(--border); flex-shrink: 0; }
    .meta-strip-icon { font-size: 12px; opacity: .6; }

    .track-wave [data-id] { cursor: pointer; }

    /* ── Agent Panel ─────────────────────────────────────────────── */
    .pane-agent {
        width: 0;
        min-width: 0;
        padding-top: 42px;
        border-left: 0 solid var(--border);
        background: var(--bg-panel);
        display: flex;
        flex-direction: column;
        overflow: hidden;
        transition: width .25s ease, min-width .25s ease, border-left-width .25s ease;
        flex-shrink: 0;
    }
    .pane-agent.open {
        width: 400px;
        min-width: 400px;
        border-left-width: 1px;
    }
    .pane-qc .qc-pane-scroll {
        flex: 1;
        overflow-y: auto;
        padding: 14px;
        display: flex;
        flex-direction: column;
        gap: 14px;
    }
    .pane-qc .qc-pane-toolbar {
        align-items: flex-start;
        padding-bottom: 2px;
    }
    .pane-qc .qc-pane-title { font-size: 18px; }
    .pane-automix .automix-scroll {
        flex: 1;
        overflow-y: auto;
        padding: 14px;
        display: flex;
        flex-direction: column;
        gap: 12px;
        background:
            radial-gradient(circle at top right, rgba(88,166,255,.12), transparent 30%),
            linear-gradient(180deg, rgba(255,255,255,.02), rgba(13,17,23,.02));
    }
    .automix-hero {
        border: 1px solid rgba(88,166,255,.2);
        background: linear-gradient(180deg, rgba(88,166,255,.08), rgba(22,27,34,.85));
        border-radius: 16px;
        padding: 16px 18px;
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 16px;
    }
    .automix-title {
        font-size: 20px;
        font-weight: 800;
        letter-spacing: -.02em;
        color: var(--text-main);
    }
    .automix-subtitle {
        font-size: 12px;
        color: var(--text-muted);
        margin-top: 4px;
        line-height: 1.5;
    }
    .automix-badge {
        flex-shrink: 0;
        border-radius: 999px;
        padding: 6px 10px;
        font-size: 11px;
        font-weight: 700;
        color: #8dd6ff;
        background: rgba(88,166,255,.12);
        border: 1px solid rgba(88,166,255,.25);
    }
    .automix-grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 12px;
    }
    .automix-card {
        position: relative;
        isolation: isolate;
        overflow: hidden;
        background: linear-gradient(180deg, rgba(255,255,255,.025), rgba(13,17,23,.72));
        border: 1px solid var(--border);
        border-radius: var(--panel-card-radius);
        padding: var(--panel-card-padding-y) var(--panel-card-padding-x);
        display: flex;
        flex-direction: column;
        gap: 12px;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
        transition: border-color .34s ease, box-shadow .46s ease, filter .46s ease, background .34s ease;
    }
    .automix-card > * {
        position: relative;
        z-index: 1;
    }
    .automix-card::after {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 0;
        border-radius: inherit;
        pointer-events: none;
        opacity: 0;
        background:
            radial-gradient(circle at 18% 0%, rgba(121,192,255,.20), transparent 38%),
            radial-gradient(circle at 88% 100%, rgba(88,166,255,.15), transparent 40%),
            linear-gradient(180deg, rgba(88,166,255,.08), rgba(88,166,255,.02));
        box-shadow:
            inset 0 0 34px rgba(88,166,255,.10),
            inset 0 1px 0 rgba(255,255,255,.055);
        transition:
            opacity var(--automix-card-processing-phase, .9s) cubic-bezier(.22, .9, .28, 1),
            filter var(--automix-card-processing-phase, .9s) cubic-bezier(.22, .9, .28, 1);
        will-change: opacity, filter;
    }
    .automix-card.is-processing-visual {
        border-color: rgba(88,166,255,.78);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.055),
            inset 0 0 28px rgba(88,166,255,.075),
            0 0 0 1px rgba(88,166,255,.30),
            0 0 32px rgba(88,166,255,.18);
    }
    .automix-card.is-processing-visual::after {
        opacity: .58;
        filter: brightness(.96);
    }
    .automix-card.is-processing::after {
        animation: automix-card-processing-breathe var(--automix-card-processing-cycle, 1.55s) ease-in-out infinite;
    }
    .automix-card.is-processing-settling::after {
        opacity: .58;
        filter: brightness(.96);
        animation: none;
    }
    .automix-card-main {
        border-color: var(--blue-border);
        background:
            linear-gradient(180deg, rgba(88,166,255,.07), rgba(13,17,23,.76)),
            linear-gradient(180deg, rgba(255,255,255,.025), rgba(13,17,23,.72));
    }
    .automix-card-head {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 10px;
    }
    .automix-card-main .automix-card-head {
        align-items: center;
    }
    .automix-card-stem .automix-card-head {
        align-items: center;
    }
    .automix-card-title {
        font-size: 14.5px;
        line-height: 1.15;
        font-weight: 800;
        letter-spacing: -.01em;
        color: var(--text-main);
    }
    .automix-card-title-row {
        display: flex;
        align-items: center;
        gap: 8px;
        min-width: 0;
    }
    .automix-card-status {
        flex: 0 0 auto;
        align-self: center;
        display: inline-flex;
        align-items: center;
        gap: 5px;
        border: 0;
        border-radius: 999px;
        padding: 1px 0;
        background: transparent;
        color: rgba(121,192,255,.82);
        font-size: 10px;
        font-weight: 650;
        line-height: 1;
        text-transform: none;
        letter-spacing: .01em;
        white-space: nowrap;
    }
    .automix-card-status::before {
        content: "";
        width: 6px;
        height: 6px;
        border-radius: 999px;
        background: currentColor;
        box-shadow: 0 0 6px rgba(121,192,255,.22);
        opacity: .86;
    }
    .automix-card[data-processed="true"] .automix-card-status {
        color: var(--green-text);
    }
    .automix-card[data-processed="true"] .automix-card-status::before {
        box-shadow: 0 0 7px rgba(126,231,135,.28);
    }
    .automix-card[data-status-mode="processing"] .automix-card-status {
        color: var(--blue-text);
    }
    @keyframes automix-card-processing-breathe {
        0%, 100% {
            opacity: .58;
            filter: brightness(.96);
        }
        50% {
            opacity: 1;
            filter: brightness(1.08);
        }
    }
    .automix-card-controls {
        display: inline-flex;
        align-items: center;
        justify-content: flex-end;
        gap: 6px;
        flex: 0 0 auto;
        flex-wrap: wrap;
    }
    .automix-card-actions {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 5px;
        margin-top: auto;
    }
    .automix-card-actions .automix-process-btn {
        margin-right: auto;
    }
    .automix-card-actions .btn-ghost {
        margin-left: auto;
    }
    .automix-help-btn {
        width: 18px;
        height: 18px;
        min-width: 18px;
        border: 1px solid rgba(139,148,158,.36);
        border-radius: 50%;
        background: rgba(139,148,158,.10);
        color: rgba(201,209,217,.82);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 0;
        font-size: 11px;
        line-height: 1;
        font-weight: 800;
        cursor: help;
        flex-shrink: 0;
    }
    .automix-help-btn:hover,
    .automix-help-btn:focus-visible,
    .automix-help-btn[aria-expanded="true"] {
        border-color: rgba(88,166,255,.55);
        background: rgba(88,166,255,.16);
        color: var(--blue-text);
        outline: none;
    }
    .automix-help-tooltip {
        position: fixed;
        z-index: 3200;
        width: min(340px, calc(100vw - 24px));
        max-height: min(560px, calc(100vh - 24px));
        overflow: auto;
        border: 1px solid rgba(88,166,255,.35);
        border-radius: 10px;
        padding: 12px 14px;
        color: var(--text-main);
        background:
            linear-gradient(180deg, rgba(88,166,255,.14), rgba(22,27,34,.98)),
            var(--bg-panel);
        box-shadow: 0 16px 36px rgba(0,0,0,.38);
        pointer-events: none;
    }
    .automix-help-tooltip[hidden] {
        display: none;
    }
    .automix-help-tooltip::before {
        content: "";
        position: absolute;
        top: -5px;
        left: calc(var(--automix-tip-arrow-left, 50%) - 5px);
        width: 10px;
        height: 10px;
        transform: rotate(45deg);
        border-left: 1px solid rgba(88,166,255,.35);
        border-top: 1px solid rgba(88,166,255,.35);
        background: rgba(31,45,62,.98);
    }
    .automix-help-tooltip-title {
        font-size: 13px;
        line-height: 1.25;
        font-weight: 800;
        color: #cde7ff;
        margin-bottom: 6px;
    }
    .automix-help-tooltip-body {
        font-size: 12px;
        line-height: 1.4;
        color: var(--text-main);
    }
    .automix-help-tooltip-body[hidden],
    .automix-help-tooltip-list[hidden] {
        display: none;
    }
    .automix-help-tooltip-list {
        margin: 10px 0 0;
        padding: 0;
        display: grid;
        gap: 8px;
    }
    .automix-help-tooltip-item {
        margin: 0;
    }
    .automix-help-tooltip-item.is-nested {
        margin-left: 10px;
        padding-left: 10px;
        border-left: 1px solid rgba(88,166,255,.25);
    }
    .automix-help-tooltip-list dt {
        margin: 0;
        font-size: 11px;
        line-height: 1.25;
        font-weight: 800;
        color: #9ccdff;
    }
    .automix-help-tooltip-item.is-nested dt {
        color: rgba(156,205,255,.86);
    }
    .automix-help-tooltip-list dd {
        margin: 2px 0 0;
        font-size: 11px;
        line-height: 1.4;
        color: var(--text-muted);
    }
    .automix-help-tooltip-media {
        margin-top: 10px;
        border: 1px solid rgba(88,166,255,.24);
        border-radius: 8px;
        overflow: hidden;
        background: rgba(1,4,9,.38);
    }
    .automix-help-tooltip-media[hidden] {
        display: none;
    }
    .automix-help-tooltip-media-img {
        display: block;
        width: 100%;
        height: auto;
    }
    .automix-row {
        display: flex;
        flex-direction: column;
        gap: 8px;
        align-items: stretch;
    }
    .automix-label {
        font-size: 11px;
        font-weight: 700;
        letter-spacing: .04em;
        text-transform: uppercase;
        color: var(--text-muted);
        line-height: 1.35;
    }
    .automix-check {
        display: inline-flex;
        align-items: flex-start;
        gap: 8px;
        font-size: 12px;
        font-weight: 600;
        color: var(--text-main);
        line-height: 1.35;
        flex-wrap: wrap;
    }
    .automix-check[hidden] {
        display: none;
    }
    .automix-check-compact {
        font-size: 11px;
        color: var(--text-muted);
        align-items: center;
        flex-wrap: nowrap;
    }
    .automix-check input[type="checkbox"] {
        width: 16px;
        height: 16px;
        accent-color: var(--accent);
        cursor: pointer;
        margin: 0;
    }
    .automix-mini-btn {
        min-width: 54px;
        min-height: 23px;
        padding: 3px 8px;
        font-size: 9.5px;
        font-weight: 700;
        line-height: 1;
        white-space: nowrap;
    }
    .automix-process-btn.is-processed {
        border-color: var(--green-border);
        box-shadow: inset 0 0 0 1px rgba(126,231,135,.16);
    }
    .automix-pill-group,
    .automix-segment {
        display: inline-flex;
        flex-wrap: wrap;
        gap: 6px;
    }
    .automix-pill,
    .automix-segment-btn {
        background: rgba(139,148,158,.08);
        border: 1px solid rgba(139,148,158,.18);
        color: var(--text-main);
        border-radius: 9px;
        padding: 6px 11px;
        font-size: 12px;
        font-weight: 700;
        cursor: pointer;
        transition:
            background-color var(--control-transition),
            background var(--control-transition),
            border-color var(--control-transition),
            color var(--control-transition),
            box-shadow var(--control-transition),
            opacity var(--control-transition),
            filter var(--control-transition),
            transform var(--control-transition-fast);
    }
    .automix-pill:hover,
    .automix-segment-btn:hover {
        background: rgba(255,255,255,.08);
        border-color: rgba(255,255,255,.16);
        transform: translateY(-1px);
    }
    .automix-pill.is-active,
    .automix-segment-btn.is-active {
        background: linear-gradient(180deg, rgba(88,166,255,.22), rgba(88,166,255,.12));
        border-color: var(--blue-border);
        color: var(--blue-text);
        box-shadow: inset 0 0 0 1px rgba(88,166,255,.12);
    }
    .automix-number {
        width: 100%;
        max-width: 160px;
        height: 32px;
        border-radius: 9px;
        border: 1px solid var(--border);
        background: rgba(13,17,23,.9);
        color: var(--text-main);
        padding: 0 10px;
        text-align: left;
        font-size: 12px;
        font-weight: 700;
    }
    .automix-number:disabled {
        opacity: .45;
        color: var(--text-muted);
        background: rgba(13,17,23,.55);
        cursor: default;
    }
    .automix-field-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }
    #automix-ducking-fields[data-disabled="true"] {
        display: none;
    }
    .automix-field-stack {
        grid-template-columns: 1fr;
    }
    .automix-field {
        display: flex;
        flex-direction: column;
        gap: 6px;
        font-size: 12px;
        font-weight: 600;
        color: var(--text-main);
    }
    .automix-field .automix-number {
        max-width: none;
    }
    .automix-scale-labels {
        display: flex;
        align-items: center;
        justify-content: space-between;
        font-size: 10.5px;
        line-height: 1.2;
        color: rgba(139,148,158,.86);
        margin-top: 4px;
        margin-bottom: 0;
        min-height: 13px;
    }
    .automix-disabled-control {
        opacity: .48;
    }
    .automix-disabled-control input,
    .automix-disabled-control button {
        cursor: default;
    }
    .automix-slider-group {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }
    .automix-slider-label {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        min-height: 26px;
        font-size: 12px;
        font-weight: 600;
        color: var(--text-main);
        line-height: 1.35;
    }
    .automix-slider-label output {
        font-family: ui-monospace, monospace;
        font-size: 11px;
        color: var(--accent);
    }
    .automix-range-values {
        display: flex;
        align-items: center;
        gap: 6px;
        color: var(--text-muted);
        font-size: 11px;
        font-weight: 700;
        white-space: nowrap;
    }
    .automix-range-number {
        width: 72px;
        height: 26px;
        border-radius: 8px;
        border: 1px solid var(--border);
        background: rgba(13,17,23,.9);
        color: var(--accent);
        padding: 0 10px;
        text-align: left;
        font-family: ui-monospace, monospace;
        font-size: 11px;
        font-weight: 700;
    }
    .automix-target-number {
        flex: 0 0 72px;
        min-width: 72px;
    }
    .automix-db-control {
        gap: 8px;
    }
    .automix-db-control .automix-slider-label {
        align-items: center;
        gap: 12px;
    }
    .automix-db-control .automix-slider-label > span {
        min-width: 0;
        line-height: 1.35;
    }
    .automix-db-number {
        flex: 0 0 72px;
        width: 72px;
        height: 26px;
        font-size: 11px;
    }
    .automix-db-slider {
        height: 22px;
        margin: 0;
    }
    .automix-db-control .automix-scale-labels {
        margin-top: 4px;
        margin-bottom: 0;
    }
    .automix-slider {
        --slider-progress: 0%;
        width: 100%;
        height: 22px;
        margin: 0;
        -webkit-appearance: none;
        appearance: none;
        background: transparent;
        cursor: pointer;
    }
    .automix-slider::-webkit-slider-runnable-track {
        height: 4px;
        border-radius: 999px;
        background: linear-gradient(
            90deg,
            var(--blue-hover) 0%,
            var(--blue-hover) var(--slider-progress),
            rgba(139,148,158,.42) var(--slider-progress),
            rgba(139,148,158,.42) 100%
        );
    }
    .automix-slider::-webkit-slider-thumb {
        width: 14px;
        height: 14px;
        margin-top: -5px;
        -webkit-appearance: none;
        appearance: none;
        border: 0;
        border-radius: 50%;
        background: var(--blue-hover);
        box-shadow: 0 1px 6px rgba(0,0,0,.35);
    }
    .automix-slider::-moz-range-track {
        height: 4px;
        border-radius: 999px;
        background: linear-gradient(
            90deg,
            var(--blue-hover) 0%,
            var(--blue-hover) var(--slider-progress),
            rgba(139,148,158,.42) var(--slider-progress),
            rgba(139,148,158,.42) 100%
        );
    }
    .automix-slider::-moz-range-thumb {
        width: 14px;
        height: 14px;
        border: 0;
        border-radius: 50%;
        background: var(--blue-hover);
        box-shadow: 0 1px 6px rgba(0,0,0,.35);
    }
    .automix-slider:focus-visible {
        outline: none;
        filter: drop-shadow(0 0 5px rgba(88,166,255,.26));
    }
    .automix-slider:disabled {
        cursor: default;
        opacity: .55;
    }
    .automix-range-slider {
        --range-start: 25%;
        --range-end: 75%;
        position: relative;
        height: 22px;
    }
    .automix-range-slider::before {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: 50%;
        height: 4px;
        transform: translateY(-50%);
        border-radius: 999px;
        background: linear-gradient(
            90deg,
            rgba(139,148,158,.45) 0%,
            rgba(139,148,158,.45) var(--range-start),
            var(--blue-hover) var(--range-start),
            var(--blue-hover) var(--range-end),
            rgba(139,148,158,.45) var(--range-end),
            rgba(139,148,158,.45) 100%
        );
    }
    .automix-range-input {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 22px;
        margin: 0;
        -webkit-appearance: none;
        appearance: none;
        background: transparent;
        pointer-events: none;
    }
    .automix-range-input::-webkit-slider-runnable-track {
        height: 4px;
        background: transparent;
    }
    .automix-range-input::-webkit-slider-thumb {
        width: 14px;
        height: 14px;
        margin-top: -5px;
        -webkit-appearance: none;
        appearance: none;
        border: 0;
        border-radius: 50%;
        background: var(--blue-hover);
        box-shadow: 0 1px 6px rgba(0,0,0,.35);
        cursor: pointer;
        pointer-events: auto;
    }
    .automix-range-input::-moz-range-track {
        height: 4px;
        background: transparent;
    }
    .automix-range-input::-moz-range-thumb {
        width: 14px;
        height: 14px;
        border: 0;
        border-radius: 50%;
        background: var(--blue-hover);
        box-shadow: 0 1px 6px rgba(0,0,0,.35);
        cursor: pointer;
        pointer-events: auto;
    }
    .automix-card-stem[data-disabled="true"] {
        opacity: 1;
    }
    .automix-card-stem[hidden] {
        display: none;
    }
    .automix-card-stem[data-disabled="true"] .automix-slider {
        pointer-events: none;
    }
    .automix-card-stem[data-disabled="true"] .automix-card-title,
    .automix-card-stem[data-disabled="true"] .automix-slider-label {
        color: var(--text-muted);
    }
    body.help-tour-active .automix-card.automix-tour-active,
    body.help-tour-active .automix-card-stem[data-disabled="true"].automix-tour-active {
        opacity: 1;
    }
    body.help-tour-active .automix-card.automix-tour-active .automix-disabled-control {
        opacity: 1;
    }
    body.help-tour-active .automix-card-stem[data-disabled="true"].automix-tour-active .automix-card-title,
    body.help-tour-active .automix-card-stem[data-disabled="true"].automix-tour-active .automix-slider-label {
        color: var(--text-main);
    }
    body.help-tour-active .automix-card.automix-tour-active input:disabled {
        color: var(--text-main);
        -webkit-text-fill-color: var(--text-main);
    }
    .automix-footer {
        border: 1px solid var(--border);
        border-radius: 16px;
        padding: 14px 16px;
        background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(13,17,23,.72));
        display: flex;
        flex-direction: column;
        gap: 14px;
    }
    .automix-footer-title {
        font-size: 14px;
        line-height: 1.2;
        font-weight: 800;
        color: var(--text-main);
    }
    .automix-summary {
        font-size: 12px;
        line-height: 1.5;
        color: var(--text-muted);
    }
    .automix-footer-actions {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }
    .automix-actions {
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
    }
    .automix-actions .btn {
        width: 100%;
    }
    .automix-action-btn {
        min-height: 36px;
        border-color: var(--blue-border);
        color: var(--blue-text);
        background: linear-gradient(180deg, rgba(88,166,255,.10), rgba(88,166,255,.05));
        font-weight: 700;
    }
    .automix-action-btn:hover:not(:disabled) {
        border-color: rgba(88,166,255,.45);
        background: linear-gradient(180deg, rgba(88,166,255,.16), rgba(88,166,255,.08));
    }
    .automix-action-btn:disabled {
        opacity: .45;
    }
    .automix-process-btn {
        min-width: 82px;
        border-color: var(--accent);
        color: #000;
        background: var(--accent);
        box-shadow: inset 0 1px 0 rgba(255,255,255,.18);
        position: relative;
        display: inline-grid;
        grid-template: 1fr / 1fr;
        place-items: center;
        overflow: hidden;
        transition:
            background .24s ease,
            border-color .24s ease,
            color .24s ease,
            box-shadow .28s ease,
            filter .28s ease;
    }
    .automix-process-btn:hover:not(:disabled) {
        border-color: var(--blue-hover);
        background: var(--blue-hover);
    }
    .automix-process-label {
        grid-area: 1 / 1;
        transition: opacity .22s ease, transform .24s ease;
        will-change: opacity, transform;
    }
    .automix-process-label-idle {
        opacity: 1;
        transform: translateY(0);
    }
    .automix-process-label-busy {
        opacity: 0;
        transform: translateY(5px);
    }
    .automix-process-btn.is-processing-action {
        border-color: rgba(121,192,255,.9);
        background: var(--blue-hover);
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.22),
            0 0 0 1px rgba(88,166,255,.20),
            0 0 14px rgba(88,166,255,.22);
        filter: brightness(1.02);
    }
    .automix-process-btn.is-processing-action .automix-process-label-idle {
        opacity: 0;
        transform: translateY(-5px);
    }
    .automix-process-btn.is-processing-action .automix-process-label-busy {
        opacity: 1;
        transform: translateY(0);
    }
    .automix-card-actions .btn-ghost {
        min-width: 50px;
        background: rgba(139,148,158,.065);
        border-color: rgba(139,148,158,.18);
        color: rgba(201,209,217,.74);
        font-weight: 650;
    }
    .automix-card-actions .btn-ghost:disabled {
        opacity: .58;
        cursor: default;
    }
    .automix-card-actions .btn-ghost:hover:not(:disabled) {
        background: rgba(139,148,158,.12);
        border-color: rgba(201,209,217,.28);
        color: var(--text-main);
    }
    .pane-automix .automix-process-block {
        flex-shrink: 0;
        border-right: 0;
        border-bottom: 0;
        border-left: 0;
        border-radius: 0;
        padding: 14px;
        gap: 11px;
        background:
            linear-gradient(180deg, rgba(88,166,255,.08), rgba(88,166,255,.02)),
            rgba(22,27,34,.96);
        box-shadow: 0 -12px 32px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.04);
    }
    .pane-automix .automix-process-block .automix-summary {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
        font-size: 12px;
        line-height: 1.4;
    }
    .pane-automix .automix-process-block .automix-actions {
        grid-template-columns: 1fr minmax(86px, .42fr);
    }
    .pane-automix .automix-process-block .automix-action-btn {
        min-height: 34px;
    }
    .pane-automix .automix-process-block .automix-toast {
        padding: 8px 10px;
        font-size: 11px;
        line-height: 1.35;
    }
    .automix-toast {
        border-radius: 10px;
        padding: 10px 12px;
        font-size: 12px;
        line-height: 1.5;
        border: 1px solid rgba(88,166,255,.22);
        color: var(--text-main);
        background: rgba(88,166,255,.08);
    }
    .automix-toast-success {
        border-color: var(--green-border);
        background: var(--green-soft);
    }
    .automix-toast-error {
        border-color: var(--red-border);
        background: var(--red-soft);
    }
    .automix-toast strong {
        color: #8dd6ff;
        font-weight: 800;
    }
    .automix-toast-success strong { color: var(--green-text); }
    .automix-toast-error strong { color: var(--red-text); }
    .automix-modal-backdrop[hidden] {
        display: none;
    }
    .automix-modal-backdrop {
        position: fixed;
        inset: 0;
        z-index: 3000;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 24px;
        background: rgba(1,4,9,.62);
        backdrop-filter: blur(6px);
    }
    .automix-modal {
        width: min(420px, calc(100vw - 32px));
        border: 1px solid var(--border);
        border-radius: 10px;
        background: #161b22;
        box-shadow: 0 24px 80px rgba(0,0,0,.52);
        overflow: hidden;
    }
    .automix-modal-head {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 16px;
        padding: 18px 20px 14px;
        border-bottom: 1px solid var(--border);
    }
    .automix-modal-title {
        color: var(--text-main);
        font-size: 16px;
        font-weight: 800;
        line-height: 1.2;
    }
    .automix-modal-kicker {
        margin-top: 4px;
        color: var(--text-muted);
        font-size: 12px;
        line-height: 1.4;
    }
    .automix-modal-close {
        flex: 0 0 auto;
    }
    .automix-modal-body {
        display: flex;
        flex-direction: column;
        gap: 12px;
        padding: 18px 20px;
    }
    .automix-modal-copy-row {
        display: flex;
        align-items: center;
        gap: 8px;
    }
    .automix-modal-copy {
        margin: 0;
        color: var(--text-main);
        font-size: 14px;
        font-weight: 700;
        line-height: 1.45;
    }
    .automix-modal-help-btn {
        flex: 0 0 auto;
    }
    .automix-modal-option {
        width: 100%;
        padding: 10px 12px;
        border: 1px solid rgba(139,148,158,.22);
        border-radius: 8px;
        background: rgba(13,17,23,.52);
    }
    .automix-modal-actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 10px;
        padding: 0 20px 20px;
    }
    .automix-modal-actions-single {
        grid-template-columns: 1fr;
    }
    .automix-modal-actions .btn {
        min-height: 34px;
    }
    .help-tour-root[hidden] {
        display: none;
    }
    .help-tour-root {
        position: fixed;
        inset: 0;
        z-index: 3400;
        pointer-events: none;
    }
    .help-tour-dim,
    .help-tour-spotlights {
        position: fixed;
        inset: 0;
        width: 100vw;
        height: 100vh;
        pointer-events: none;
    }
    .help-tour-dim {
        z-index: 1;
    }
    .help-tour-spotlights {
        z-index: 2;
    }
    .help-tour-spotlight {
        position: absolute;
        box-sizing: border-box;
        border: 2px solid #79c0ff;
        border-radius: 8px;
        background: rgba(88,166,255,.08);
        box-shadow:
            0 0 0 4px rgba(88,166,255,.18),
            0 12px 36px rgba(0,0,0,.38);
        transition: left .18s ease, top .18s ease, width .18s ease, height .18s ease;
    }
    body.help-tour-active .help-tour-target-ring {
        position: relative;
        z-index: 3402;
        outline: 2px solid #79c0ff;
        outline-offset: 3px;
        box-shadow:
            0 0 0 6px rgba(88,166,255,.18),
            0 8px 24px rgba(0,0,0,.34);
    }
    .help-tour-card {
        position: fixed;
        z-index: 3;
        width: min(360px, calc(100vw - 32px));
        border: 1px solid rgba(88,166,255,.32);
        border-radius: 8px;
        background: #161b22;
        color: var(--text-main);
        box-shadow: 0 20px 70px rgba(0,0,0,.48);
        pointer-events: auto;
        overflow: hidden;
        transition: left .18s ease, top .18s ease;
    }
    .help-tour-card-head {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        gap: 14px;
        padding: 14px 16px 10px;
        border-bottom: 1px solid var(--border);
    }
    .help-tour-step {
        margin-bottom: 5px;
        color: var(--accent);
        font-size: 10px;
        font-weight: 900;
        letter-spacing: .08em;
        text-transform: uppercase;
    }
    .help-tour-title {
        color: var(--text-main);
        font-size: 16px;
        font-weight: 850;
        line-height: 1.2;
    }
    .help-tour-close {
        width: 28px;
        height: 28px;
        border: 0;
        border-radius: 4px;
        background: transparent;
        color: var(--text-muted);
        font-size: 18px;
        line-height: 1;
        cursor: pointer;
    }
    .help-tour-close:hover {
        color: var(--text-main);
        background: var(--bg-hover);
    }
    .help-tour-body {
        padding: 12px 16px 2px;
    }
    .help-tour-copy {
        margin: 0;
        color: var(--text-muted);
        font-size: 13px;
        line-height: 1.55;
        white-space: pre-line;
    }
    .help-tour-section {
        margin-top: 12px;
        padding-top: 12px;
        border-top: 1px solid rgba(139,148,158,.28);
    }
    .help-tour-section[hidden] {
        display: none;
    }
    .help-tour-section-title {
        margin: 0 0 5px;
        color: var(--text-main);
        font-size: 12px;
        font-weight: 850;
        line-height: 1.25;
    }
    .help-tour-section-copy {
        margin: 0;
        color: var(--text-muted);
        font-size: 12px;
        line-height: 1.45;
    }
    .help-tour-media {
        width: min(150px, 100%);
        margin: 12px auto 0;
        border: 1px solid rgba(88,166,255,.24);
        border-radius: 8px;
        overflow: hidden;
        background: rgba(1,4,9,.36);
    }
    .help-tour-media[hidden] {
        display: none;
    }
    .help-tour-media-img {
        display: block;
        width: 100%;
        height: auto;
    }
    .help-tour-actions {
        display: grid;
        grid-template-columns: auto 1fr auto auto;
        gap: 8px;
        align-items: center;
        padding: 14px 16px 16px;
    }
    .help-tour-progress {
        height: 4px;
        border-radius: 999px;
        background: rgba(139,148,158,.24);
        overflow: hidden;
    }
    .help-tour-progress span {
        display: block;
        height: 100%;
        border-radius: inherit;
        background: var(--accent);
        transition: width .18s ease;
    }
    .help-tour-actions .btn {
        min-height: 30px;
        padding-left: 12px;
        padding-right: 12px;
    }
    .agent-header {
        padding: 10px 14px;
        border-bottom: 1px solid var(--border);
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-shrink: 0;
    }
    .agent-header-title {
        font-size: 12px;
        font-weight: 700;
        color: var(--text-main);
        display: flex;
        align-items: center;
        gap: 6px;
    }
    .agent-close-btn {
        background: none;
        border: none;
        color: var(--text-muted);
        cursor: pointer;
        font-size: 16px;
        line-height: 1;
        padding: 2px 4px;
        border-radius: 3px;
    }
    .agent-close-btn:hover { color: var(--text-main); background: var(--bg-hover); }

    .agent-messages {
        flex: 1;
        overflow-y: auto;
        padding: 12px 14px;
        display: flex;
        flex-direction: column;
        gap: 14px;
    }

    /* User bubble */
    .agent-msg-user {
        align-self: flex-end;
        background: var(--accent);
        color: #000;
        border-radius: 12px 12px 2px 12px;
        padding: 8px 12px;
        font-size: 12px;
        max-width: 86%;
        line-height: 1.5;
        font-weight: 500;
    }

    /* Assistant message wrapper */
    .agent-msg-assistant { display: flex; flex-direction: column; gap: 8px; max-width: 100%; }

    /* Thinking block */
    .agent-thinking {
        background: rgba(210,153,34,.08);
        border: 1px solid rgba(210,153,34,.25);
        border-radius: 6px;
        padding: 8px 10px;
        font-family: ui-monospace, monospace;
        font-size: 11px;
        color: var(--warn);
        line-height: 1.55;
        white-space: pre-wrap;
        word-break: break-word;
        max-height: 200px;
        overflow-y: auto;
        cursor: pointer;
        position: relative;
    }
    .agent-thinking.collapsed { max-height: 36px; overflow: hidden; }
    .agent-thinking-header {
        font-size: 10px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: .06em;
        opacity: .7;
        margin-bottom: 4px;
    }
    .agent-thinking-text::after {
        content: '▌';
        display: inline;
        animation: blink .7s step-end infinite;
    }
    .agent-thinking-text.done::after { display: none; }
    @keyframes blink { 50% { opacity: 0; } }

    /* Plan card */
    .agent-plan-card {
        background: var(--bg-main);
        border: 1px solid var(--border);
        border-radius: 6px;
        padding: 10px 12px;
        font-size: 12px;
    }
    .agent-plan-intent {
        font-weight: 600;
        color: var(--text-main);
        margin-bottom: 8px;
        line-height: 1.4;
    }
    .agent-plan-steps { display: flex; flex-direction: column; gap: 4px; }
    .agent-plan-step {
        display: flex;
        gap: 8px;
        align-items: flex-start;
        font-size: 11px;
        color: var(--text-muted);
        line-height: 1.4;
    }
    .agent-plan-step-num {
        font-family: ui-monospace, monospace;
        font-size: 10px;
        color: var(--accent);
        min-width: 18px;
        font-weight: 700;
    }
    .agent-plan-step-reason { color: var(--text-muted); font-style: italic; font-size: 10px; }

    /* Status / execute row inside assistant message */
    .agent-executing-badge {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        background: rgba(63,185,80,.1);
        border: 1px solid rgba(63,185,80,.25);
        border-radius: 4px;
        padding: 4px 8px;
        font-size: 11px;
        color: var(--green);
        font-weight: 600;
    }

    /* Agent input bar — Cursor style */
    .agent-input-bar {
        border-top: 1px solid var(--border);
        padding: 12px 14px 14px;
        flex-shrink: 0;
    }
    .agent-input-wrap {
        background: var(--bg-main);
        border: 1px solid var(--border);
        border-radius: 10px;
        display: flex;
        flex-direction: column;
        padding: 10px 12px 8px;
        transition: border-color .15s, box-shadow .15s;
    }
    .agent-input-wrap:focus-within {
        border-color: rgba(88,166,255,.5);
        box-shadow: 0 0 0 3px rgba(88,166,255,.08);
    }
    .agent-textarea {
        background: transparent;
        border: none;
        color: var(--text-main);
        font-size: 13px;
        resize: none;
        outline: none;
        font-family: inherit;
        min-height: 52px;
        max-height: 140px;
        line-height: 1.6;
        width: 100%;
    }
    .agent-textarea::placeholder { color: var(--text-muted); }
    .agent-input-row {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 8px;
        margin-top: 6px;
    }
    .agent-export-btn,
    .agent-export-select {
        height: 28px;
        border-radius: 6px;
        border: 1px solid var(--border);
        background: var(--bg-hover);
        color: var(--text-main);
        font-size: 11px;
        font-weight: 600;
    }
    .agent-export-btn {
        padding: 0 10px;
        cursor: pointer;
        transition:
            background-color var(--control-transition),
            background var(--control-transition),
            border-color var(--control-transition),
            color var(--control-transition),
            box-shadow var(--control-transition),
            opacity var(--control-transition),
            filter var(--control-transition);
    }
    .agent-export-btn:hover { background: rgba(88,166,255,.14); border-color: rgba(88,166,255,.35); }
    .agent-export-select {
        padding: 0 8px;
        min-width: 68px;
        cursor: pointer;
    }
    .agent-export-btn:disabled,
    .agent-export-select:disabled {
        opacity: .45;
        cursor: default;
    }
    .agent-send-btn {
        background: var(--accent);
        color: #000;
        border: none;
        border-radius: 6px;
        width: 28px;
        height: 28px;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        flex-shrink: 0;
        transition:
            background-color var(--control-transition),
            background var(--control-transition),
            border-color var(--control-transition),
            color var(--control-transition),
            box-shadow var(--control-transition),
            opacity var(--control-transition),
            filter var(--control-transition);
    }
    .agent-send-btn:hover { background: #79c0ff; }
    .agent-send-btn:disabled { opacity: .35; cursor: default; background: var(--accent); }
    .agent-export-chip {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        background: rgba(88,166,255,.12);
        border: 1px solid rgba(88,166,255,.3);
        border-radius: 20px;
        padding: 4px 10px;
        font-size: 11px;
        color: var(--accent);
        font-weight: 600;
        cursor: pointer;
        text-decoration: none;
        transition:
            background-color var(--control-transition),
            background var(--control-transition),
            border-color var(--control-transition),
            color var(--control-transition),
            box-shadow var(--control-transition),
            opacity var(--control-transition),
            filter var(--control-transition);
    }
    .agent-export-chip:hover { background: rgba(88,166,255,.22); }

    /* Floating agent mode toggles */
    .btn-agent-toggle {
        background: var(--bg-hover);
        border: 1px solid var(--border);
        color: var(--text-muted);
        border-radius: 4px;
        padding: 4px 10px;
        font-size: 11px;
        font-weight: 600;
        cursor: pointer;
        display: flex;
        align-items: center;
        gap: 5px;
        transition:
            background-color var(--control-transition),
            background var(--control-transition),
            border-color var(--control-transition),
            color var(--control-transition),
            box-shadow var(--control-transition),
            opacity var(--control-transition),
            filter var(--control-transition);
    }
    .btn-agent-toggle:hover { color: var(--text-main); border-color: var(--text-muted); }
    .btn-agent-toggle.active {
        background: var(--blue-soft);
        color: var(--blue-hover);
        border-color: var(--blue-border);
        box-shadow: inset 0 0 0 1px rgba(88,166,255,.10);
    }

    @media (max-width: 1200px) {
        .tool-strip-params { gap: 6px; }
        .tool-strip-field input { width: 52px; }
        .automix-grid { grid-template-columns: 1fr; }
        .automix-card-main { grid-row: auto; }
        .automix-footer {
            flex-direction: column;
            align-items: stretch;
        }
        .automix-actions {
            justify-content: stretch;
        }
        .automix-actions .btn {
            flex: 1;
        }
    }

    .region-legend {
        position: absolute;
        right: 0;
        bottom: calc(100% + 8px);
        z-index: 36;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 5px;
        min-width: 132px;
        max-width: min(280px, calc(100vw - 32px));
        padding: 7px;
        border: 1px solid rgba(139,148,158,.22);
        border-radius: 6px;
        background: rgba(5,8,11,.96);
        backdrop-filter: blur(10px);
        box-shadow: 0 8px 22px rgba(0,0,0,.22);
        pointer-events: auto;
        opacity: 0;
        transform: translateY(4px);
        transition: opacity .16s ease, transform .16s ease;
    }
    .region-legend[hidden] {
        display: none;
    }
    .region-legend.is-open {
        opacity: 1;
        transform: translateY(0);
    }
    .region-legend-title {
        font-size: 9px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: .06em;
        color: var(--text-muted);
        align-self: stretch;
        padding: 0 2px 2px;
    }
    .region-legend-chip {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        width: 100%;
        padding: 4px 6px;
        border-radius: 5px;
        background: rgba(255,255,255,0.04);
        border: 1px solid rgba(255,255,255,0.08);
        color: var(--text-main);
        font-size: 10px;
        line-height: 1;
        white-space: nowrap;
    }
    .region-legend-swatch {
        width: 8px;
        height: 8px;
        border-radius: 999px;
        display: inline-block;
        flex-shrink: 0;
    }
    .region-legend-count {
        color: var(--text-muted);
        font-size: 10px;
        font-weight: 700;
    }
    .region-hover-tooltip {
        position: fixed;
        top: 0;
        left: 0;
        z-index: 9999;
        max-width: 320px;
        white-space: pre-line;
        padding: 8px 10px;
        border-radius: 6px;
        background: rgba(13,17,23,0.96);
        border: 1px solid rgba(255,255,255,0.12);
        color: var(--text-main);
        font-size: 11px;
        line-height: 1.45;
        box-shadow: 0 8px 24px rgba(0,0,0,0.35);
        pointer-events: none;
        opacity: 0;
        transform: translateY(4px);
        transition: opacity .08s ease, transform .08s ease;
    }
    .region-hover-tooltip.visible {
        opacity: 1;
        transform: translateY(0);
    }
    body.workspace-embed .region-hover-tooltip {
        background: #fffefa;
        border: 1px solid rgba(15, 118, 110, .30);
        color: #171614;
        font-weight: 550;
        box-shadow: 0 14px 34px rgba(34, 28, 15, .18);
    }

    /* Region resize handle highlight */
    [part="region-handle-left"],
    [part="region-handle-right"] {
        opacity: 0.7;
        transition: opacity .15s;
    }
    [part="region-handle-left"]:hover,
    [part="region-handle-right"]:hover {
        opacity: 1;
    }

    /* ── Proposal diff overlay ───────────────────────────────────────── */
    #proposal-panel {
        display: none;
        align-items: center;
        gap: 8px;
        padding: 6px 12px;
        background: rgba(210,153,34,0.08);
        border-bottom: 1px solid rgba(210,153,34,0.3);
        font-size: 11px;
        flex-wrap: wrap;
        flex-shrink: 0;
    }
    #proposal-panel.active { display: flex; }
    .proposal-label {
        font-weight: 700;
        color: var(--warn);
        flex: 1;
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .proposal-stats { color: var(--text-muted); font-size: 10px; }
    .prop-panel-btn {
        cursor: pointer;
        border: 1px solid;
        border-radius: 4px;
        padding: 2px 9px;
        font-size: 10px;
        font-weight: 700;
        background: transparent;
        white-space: nowrap;
    }
    .prop-panel-btn.accept-all  { color: var(--green);  border-color: rgba(63,185,80,.4); }
    .prop-panel-btn.accept-all:hover  { background: rgba(63,185,80,.15); }
    .prop-panel-btn.decline-all { color: var(--err);    border-color: rgba(248,81,73,.4); }
    .prop-panel-btn.decline-all:hover { background: rgba(248,81,73,.1); }
    .prop-panel-btn.apply-btn   { color: #fff; border-color: var(--accent); background: var(--accent); }
    .prop-panel-btn.apply-btn:hover   { opacity: .85; }
    .prop-panel-btn.dismiss-btn { color: var(--text-muted); border-color: var(--border); }
    .prop-panel-btn.dismiss-btn:hover { background: rgba(255,255,255,.05); }
    /* Preview A/B toggle */
    .prop-preview-btn {
        cursor: pointer;
        border: 1px solid rgba(88,166,255,.4);
        border-radius: 4px;
        padding: 2px 9px;
        font-size: 10px;
        font-weight: 700;
        background: transparent;
        color: rgba(88,166,255,.85);
        white-space: nowrap;
    }
    .prop-preview-btn:hover  { background: rgba(88,166,255,.1); }
    .prop-preview-btn.active { background: rgba(88,166,255,.25); }

    /* Proposal region content inside WaveSurfer region */
    .prop-region-inner {
        display: flex;
        align-items: center;
        gap: 4px;
        padding: 1px 5px;
        font-size: 9px;
        line-height: 1.2;
        pointer-events: auto;
        white-space: nowrap;
        overflow: hidden;
        max-width: 100%;
    }
    .prop-region-reason {
        font-weight: 700;
        color: rgba(255,255,255,.9);
        overflow: hidden;
        text-overflow: ellipsis;
        flex: 1;
    }
    .prop-region-gain { color: rgba(255,255,255,.6); flex-shrink: 0; }
    .prop-region-btns { display: flex; gap: 2px; flex-shrink: 0; }
    .prop-r-accept, .prop-r-decline {
        cursor: pointer;
        border: none;
        border-radius: 3px;
        padding: 1px 5px;
        font-size: 10px;
        font-weight: 900;
        line-height: 1;
    }
    .prop-r-accept  { background: rgba(63,185,80,.9);  color: #fff; }
    .prop-r-decline { background: rgba(248,81,73,.75); color: #fff; }
    .prop-r-accept:hover  { background: rgb(63,185,80); }
    .prop-r-decline:hover { background: rgb(248,81,73); }
    /* Region state colors — applied via region.setOptions() */
    /* pending-decrease, pending-increase, accepted, declined handled in JS */

    @media (prefers-reduced-motion: reduce) {
        button,
        .btn,
        .top-back-btn,
        .top-help-btn,
        .tool-strip-btn,
        .import-btn,
        .import-aaf-choice-btn,
        .agent-export-btn,
        .agent-send-btn,
        .btn-mix,
        .btn-agent-toggle,
        .zoom-btn,
        .timeline-tools-toggle,
        .region-legend-toggle,
        .automix-help-btn,
        .automix-pill,
        .automix-segment-btn,
        .automix-action-btn,
        .automix-process-btn,
        .automix-mini-btn,
        .automix-modal-close,
        .automix-modal-help-btn,
        .prop-panel-btn,
        .btn-icon,
        .qc-check-toggle {
            transition-duration: 1ms;
        }
    }

    /* ------------------------------------------------------------------
       Post-production suite
       ------------------------------------------------------------------ */
    .post-production-body {
        background: #f7f6f1;
        color: #171614;
        height: 100vh;
        overflow: hidden;
    }
    .post-production-body .clerk-auth {
        position: fixed;
        right: 18px;
        bottom: 18px;
        z-index: 50;
    }
    .pp-root {
        --pp-bg: #f7f6f1;
        --pp-surface: #ffffff;
        --pp-surface-2: #f0eee7;
        --pp-ink: #171614;
        --pp-ink-2: #3a3833;
        --pp-muted: #6e6b62;
        --pp-border: #e4dfd3;
        --pp-border-2: #d6cfbf;
        --pp-accent: #0f766e;
        --pp-danger: #b91c1c;
        --pp-warning: #b45309;
        --pp-running: #2563eb;
        --pp-success: #4d7c5c;
        width: 100vw;
        height: 100vh;
        background: var(--pp-bg);
        color: var(--pp-ink);
        font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
        font-size: 13px;
        line-height: 1.45;
        letter-spacing: 0;
    }
    .pp-root *,
    .pp-root *::before,
    .pp-root *::after {
        box-sizing: border-box;
    }
    .pp-root button,
    .pp-root input {
        font: inherit;
    }
    .pp-root svg {
        width: 16px;
        height: 16px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round;
        flex: 0 0 auto;
    }
    .pp-shell {
        display: grid;
        grid-template-columns: 214px minmax(0, 1fr);
        height: 100%;
        min-height: 0;
    }
    .pp-shell.is-rail-collapsed {
        grid-template-columns: 64px minmax(0, 1fr);
    }
    .pp-shell.is-workflow-artifact-fullscreen {
        grid-template-columns: minmax(0, 1fr);
    }
    .pp-rail {
        --pp-rail-icon-column: 52px;
        position: relative;
        display: flex;
        flex-direction: column;
        min-height: 0;
        border-right: 1px solid var(--pp-border);
        padding: 14px 6px;
        background: #faf9f5;
    }
    .pp-rail[hidden] {
        display: none;
    }
    .pp-rail-head {
        display: flex;
        align-items: center;
        gap: 6px;
        padding-bottom: 10px;
    }
    .pp-wordmark,
    .pp-rail-tool,
    .pp-nav-item,
    .pp-project-mini,
    .pp-tab,
    .pp-table-row.pp-workflow-row {
        cursor: pointer;
    }
    .pp-wordmark {
        display: grid;
        grid-template-columns: var(--pp-rail-icon-column) minmax(0, 1fr);
        align-items: center;
        width: 100%;
        min-width: 0;
        padding: 4px 8px 4px 0;
        border: 0;
        background: transparent;
        color: var(--pp-ink);
        font-weight: 700;
        text-align: left;
    }
    .pp-wordmark span:not(.pp-logo),
    .pp-rail-tool span,
    .pp-nav-item span:not(.pp-count),
    .pp-project-mini > span:not(.pp-project-glyph) {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .pp-rail-edge-toggle {
        position: absolute;
        top: 18px;
        right: -12px;
        z-index: 3;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 24px;
        height: 24px;
        border: 1px solid var(--pp-border-2);
        border-radius: 7px;
        background: var(--pp-surface);
        color: var(--pp-muted);
        padding: 0;
        box-shadow: 0 1px 5px rgba(23, 22, 20, .08);
        cursor: pointer;
    }
    .pp-rail-edge-toggle:hover {
        background: var(--pp-ink);
        border-color: var(--pp-ink);
        color: var(--pp-bg);
    }
    .pp-rail-edge-toggle svg {
        width: 14px;
        height: 14px;
    }
    .pp-shell.is-rail-collapsed .pp-rail {
        align-items: stretch;
        padding: 14px 6px;
    }
    .pp-shell.is-rail-collapsed .pp-rail-edge-toggle {
        top: 18px;
        right: -12px;
    }
    .pp-shell.is-rail-collapsed .pp-rail-edge-toggle:hover {
        background: var(--pp-ink);
        border-color: var(--pp-ink);
        color: var(--pp-bg);
    }
    .pp-shell.is-rail-collapsed .pp-rail-head {
        flex-direction: column;
        gap: 6px;
        padding-bottom: 10px;
    }
    .pp-shell.is-rail-collapsed .pp-wordmark {
        grid-template-columns: var(--pp-rail-icon-column);
        justify-items: center;
        width: var(--pp-rail-icon-column);
        height: 33px;
        margin-inline: auto;
        padding: 0;
    }
    .pp-shell.is-rail-collapsed .pp-wordmark span:not(.pp-logo),
    .pp-shell.is-rail-collapsed .pp-rail-tool span,
    .pp-shell.is-rail-collapsed .pp-nav-item span:not(.pp-count),
    .pp-shell.is-rail-collapsed .pp-project-mini > span:not(.pp-project-glyph),
    .pp-shell.is-rail-collapsed .pp-current-project {
        display: none;
    }
    .pp-shell.is-rail-collapsed .pp-rail-tool {
        grid-template-columns: var(--pp-rail-icon-column);
        justify-items: center;
        width: var(--pp-rail-icon-column);
        margin-inline: auto;
        padding: 0;
    }
    .pp-shell.is-rail-collapsed .pp-rail-label {
        display: flex;
        align-items: center;
        justify-content: center;
        color: transparent;
        font-size: 0;
        line-height: 14px;
        margin-top: 10px;
        padding-block: 2px;
        white-space: nowrap;
    }
    .pp-shell.is-rail-collapsed .pp-rail-label::before {
        content: "";
        display: block;
        width: 22px;
        height: 1px;
        border-radius: 999px;
        background: var(--pp-border-2);
    }
    .pp-shell.is-rail-collapsed .pp-nav-item,
    .pp-shell.is-rail-collapsed .pp-project-mini {
        position: relative;
        grid-template-columns: var(--pp-rail-icon-column);
        justify-items: center;
        width: var(--pp-rail-icon-column);
        min-height: 32px;
        margin-inline: auto;
        padding: 0;
    }
    .pp-shell.is-rail-collapsed .pp-count {
        position: absolute;
        top: -4px;
        right: 2px;
        min-width: 16px;
        height: 16px;
        margin-left: 0;
        padding: 0 4px;
        background: var(--pp-surface);
        font-size: 9px;
        line-height: 14px;
    }
    .pp-logo,
    .pp-brand-mark {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 25px;
        height: 25px;
        border-radius: 6px;
        background: var(--pp-ink);
        color: var(--pp-bg);
        font-weight: 800;
    }
    .pp-logo svg {
        width: 17px;
        height: 17px;
        stroke-width: 2.4;
    }
    .pp-wordmark .pp-logo,
    .pp-rail-tool > svg,
    .pp-nav-item > svg,
    .pp-project-mini > .pp-project-glyph {
        justify-self: center;
    }
    .pp-rail-tool {
        position: relative;
        display: grid;
        grid-template-columns: var(--pp-rail-icon-column) minmax(0, 1fr);
        align-items: center;
        min-height: 32px;
        width: 100%;
        border: 0;
        border-radius: 7px;
        background: transparent;
        color: var(--pp-ink-2);
        padding: 6px 10px 6px 0;
        text-align: left;
    }
    .pp-rail-search-wrap {
        display: grid;
        gap: 0;
        margin: 2px 0 8px;
        border-top: 1px solid var(--pp-border);
        border-bottom: 1px solid var(--pp-border);
        padding: 8px 0;
    }
    .pp-shell.is-rail-collapsed .pp-rail-search-wrap {
        justify-items: center;
        margin: 2px 0 8px;
        padding: 8px 0;
    }
    .pp-rail-search-icon.has-query::after {
        content: "";
        position: absolute;
        right: 8px;
        bottom: 6px;
        width: 6px;
        height: 6px;
        border-radius: 999px;
        background: var(--pp-success);
        box-shadow: 0 0 0 2px #faf9f5;
    }
    .pp-rail-search-field {
        display: grid;
        grid-template-columns: calc(var(--pp-rail-icon-column) - 2px) minmax(0, 1fr) 24px;
        align-items: center;
        min-height: 32px;
        width: 100%;
        border: 1px solid var(--pp-border);
        border-radius: 7px;
        background: var(--pp-surface);
        color: var(--pp-muted);
        padding: 0 6px 0 0;
    }
    .pp-rail-search-field.is-active,
    .pp-rail-search-field:focus-within {
        border-color: var(--pp-border-2);
        box-shadow: 0 0 0 2px rgba(61, 130, 133, .12);
        color: var(--pp-ink);
    }
    .pp-rail-search-field > svg {
        justify-self: center;
    }
    .pp-rail-search-field input {
        min-width: 0;
        width: 100%;
        height: 30px;
        border: 0;
        outline: 0;
        background: transparent;
        color: var(--pp-ink);
        font: inherit;
    }
    .pp-rail-search-field input::placeholder {
        color: var(--pp-muted);
    }
    .pp-nav,
    .pp-project-list {
        display: flex;
        flex-direction: column;
        gap: 2px;
    }
    .pp-nav-item,
    .pp-project-mini {
        display: grid;
        grid-template-columns: var(--pp-rail-icon-column) minmax(0, 1fr) auto;
        align-items: center;
        min-height: 32px;
        width: 100%;
        border: 0;
        border-radius: 7px;
        background: transparent;
        color: var(--pp-ink-2);
        padding: 6px 10px 6px 0;
        text-align: left;
    }
    .pp-project-mini {
        grid-template-columns: var(--pp-rail-icon-column) minmax(0, 1fr);
    }
    .pp-project-glyph {
        position: relative;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 24px;
        height: 24px;
    }
    .pp-project-initial {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 20px;
        height: 20px;
        border: 1px solid var(--pp-border);
        border-radius: 6px;
        background: var(--pp-surface);
        color: var(--pp-ink);
        font-size: 10px;
        font-weight: 800;
    }
    .pp-project-glyph .pp-dot {
        position: absolute;
        right: -2px;
        bottom: 0;
        width: 6px;
        height: 6px;
        box-shadow: 0 0 0 2px #faf9f5;
    }
    .pp-rail-tool:hover,
    .pp-nav-item:hover,
    .pp-project-mini:hover,
    .pp-tab:hover,
    .pp-ghost:hover,
    .pp-secondary:hover,
    .pp-icon-button:hover {
        background: var(--pp-surface-2);
        color: var(--pp-ink);
    }
    .pp-rail-tool.is-active,
    .pp-nav-item.is-active,
    .pp-project-mini.is-active {
        background: var(--pp-surface);
        color: var(--pp-ink);
        box-shadow: inset 0 0 0 1px var(--pp-border);
        font-weight: 650;
    }
    .pp-count {
        margin-left: auto;
        border: 1px solid var(--pp-border);
        border-radius: 999px;
        padding: 1px 6px;
        color: var(--pp-muted);
        font-size: 11px;
        font-variant-numeric: tabular-nums;
    }
    .pp-nav-item > .pp-count {
        justify-self: end;
    }
    .pp-count.subtle {
        margin-left: 0;
        border-radius: 5px;
        font-size: 10px;
    }
    .pp-rail-label {
        margin-top: 20px;
        padding: 4px 8px;
        color: var(--pp-muted);
        font-size: 11px;
        font-weight: 700;
        letter-spacing: .04em;
        text-transform: uppercase;
    }
    .pp-dot {
        width: 7px;
        height: 7px;
        border-radius: 999px;
        background: var(--pp-muted);
        flex: 0 0 auto;
    }
    .pp-dot.success { background: var(--pp-success); }
    .pp-dot.warning { background: var(--pp-warning); }
    .pp-dot.failed { background: var(--pp-danger); }
    .pp-dot.prepared,
    .pp-dot.queued,
    .pp-dot.preparing { background: var(--pp-warning); }
    .pp-dot.completed { background: var(--pp-success); }
    .pp-dot.running {
        background: var(--pp-running);
        box-shadow: 0 0 0 0 rgba(37, 99, 235, .35);
        animation: pp-pulse 1.8s ease infinite;
        animation-delay: var(--pp-run-pulse-delay, 0s);
    }
    @keyframes pp-pulse {
        to { box-shadow: 0 0 0 8px rgba(37, 99, 235, 0); }
    }
    .pp-rail-footer {
        display: flex;
        align-items: center;
        gap: 9px;
        margin-top: auto;
        border-top: 1px solid var(--pp-border);
        padding: 12px 8px 4px;
    }
    .pp-avatar {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 26px;
        height: 26px;
        border: 1px solid var(--pp-border-2);
        border-radius: 50%;
        background: var(--pp-surface);
        color: var(--pp-ink-2);
        font-size: 10px;
        font-weight: 800;
        letter-spacing: 0;
    }
    .pp-user {
        display: grid;
        gap: 1px;
        min-width: 0;
    }
    .pp-user small,
    .pp-project-title span,
    .pp-page-head p,
    .pp-panel-head p,
    .pp-artifact-copy small,
    .pp-artifact-copy em,
    .pp-loading-copy,
    .muted {
        color: var(--pp-muted);
    }
    .pp-current-project {
        color: var(--pp-muted);
        font-family: ui-monospace, "SF Mono", Menlo, monospace;
        font-size: 10px;
        padding: 2px 8px;
    }
    .pp-search-clear {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 22px;
        height: 22px;
        border: 0;
        border-radius: 5px;
        background: transparent;
        color: var(--pp-muted);
        padding: 0;
    }
    .pp-search-clear:hover {
        background: var(--pp-surface-2);
        color: var(--pp-ink);
    }
    .pp-search-clear svg {
        width: 12px;
        height: 12px;
    }
    .pp-main {
        position: relative;
        display: grid;
        grid-template-rows: auto minmax(0, 1fr);
        min-width: 0;
        min-height: 0;
    }
    .pp-main-no-tabs {
        grid-template-rows: minmax(0, 1fr);
    }
    .pp-main.is-workflow-artifact-fullscreen {
        grid-template-rows: minmax(0, 1fr);
    }
    .pp-topbar {
        display: flex;
        align-items: center;
        gap: 14px;
        min-height: 58px;
        border-bottom: 1px solid var(--pp-border);
        padding: 10px 22px;
        background: var(--pp-bg);
    }
    .pp-rail-toggle {
        flex: 0 0 auto;
    }
    .pp-rail-toggle.is-collapsed {
        background: var(--pp-ink);
        border-color: var(--pp-ink);
        color: var(--pp-bg);
    }
    .pp-project-title {
        display: grid;
        gap: 2px;
        min-width: 220px;
    }
    .pp-project-title strong {
        font-size: 14px;
    }
    .pp-project-title span,
    .pp-user small,
    .pp-artifact-copy em {
        font-size: 11px;
    }
    .pp-search {
        display: flex;
        align-items: center;
        gap: 8px;
        width: min(380px, 34vw);
        min-width: 220px;
        margin-left: auto;
        border: 1px solid var(--pp-border);
        border-radius: 8px;
        background: var(--pp-surface);
        color: var(--pp-muted);
        padding: 0 10px;
    }
    .pp-search input {
        width: 100%;
        height: 34px;
        border: 0;
        outline: 0;
        background: transparent;
        color: var(--pp-ink);
    }
    .pp-workspace-chrome {
        display: grid;
        grid-template-rows: 38px 38px;
        min-width: 0;
        min-height: 76px;
        border-bottom: 1px solid var(--pp-border);
        background: var(--pp-bg);
    }
    .pp-workspace-chrome[hidden] {
        display: none;
    }
    .pp-project-context-bar {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        min-width: 0;
        width: 100%;
        height: 38px;
        border-bottom: 1px solid var(--pp-border);
        padding: 0 22px;
        color: var(--pp-muted);
        font-size: 11px;
    }
    .pp-project-context-link {
        display: inline-flex;
        align-items: center;
        height: 24px;
        border: 0;
        border-radius: 5px;
        background: transparent;
        color: var(--pp-muted);
        padding: 0;
        font-size: 10px;
        font-weight: 800;
        letter-spacing: .04em;
        text-transform: uppercase;
        cursor: pointer;
    }
    .pp-project-context-link:hover {
        color: var(--pp-ink);
    }
    .pp-project-context-link:focus-visible {
        outline: none;
        color: var(--pp-ink);
        box-shadow: 0 0 0 2px rgba(45, 125, 131, .18);
    }
    .pp-project-context-separator {
        color: var(--pp-muted);
        font-size: 12px;
        font-weight: 700;
        line-height: 1;
    }
    .pp-project-context-bar strong {
        min-width: 0;
        max-width: min(420px, 42vw);
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: var(--pp-ink);
        font-size: 13px;
        font-weight: 750;
    }
    .pp-tabs {
        display: flex;
        align-items: center;
        gap: 18px;
        flex: 1 1 auto;
        min-height: 38px;
        min-width: 0;
        overflow-x: auto;
        overflow-y: hidden;
        padding: 0 22px;
        background: var(--pp-bg);
    }
    .pp-tab {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        height: 38px;
        border: 0;
        border-bottom: 2px solid transparent;
        background: transparent;
        color: var(--pp-muted);
        white-space: nowrap;
    }
    .pp-tab.is-active {
        border-bottom-color: var(--pp-ink);
        color: var(--pp-ink);
        font-weight: 700;
    }
    .pp-tab:disabled {
        cursor: default;
        opacity: .42;
    }
    .pp-workflow-badge,
    .pp-page-badge,
    .pp-kind {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        border: 1px solid color-mix(in srgb, var(--team), transparent 70%);
        background: color-mix(in srgb, var(--team), transparent 91%);
        color: var(--team);
        border-radius: 7px;
    }
    .pp-workflow-badge {
        width: 25px;
        height: 25px;
    }
    .pp-page-badge {
        width: 25px;
        height: 25px;
        border-color: var(--pp-border-2);
        background: var(--pp-surface-2);
        color: var(--pp-muted);
    }
    .pp-dashboard-page,
    .pp-workflow {
        min-height: 0;
        overflow: hidden;
        padding: 18px 24px;
    }
    .pp-dashboard-page {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 348px;
        gap: 0;
        padding: 0;
    }
    .pp-dashboard-main {
        display: grid;
        grid-template-rows: auto auto minmax(0, 1fr);
        gap: 14px;
        min-width: 0;
        min-height: 0;
        overflow: hidden;
        padding: 18px 24px;
    }
    .pp-projects-page {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 348px;
        min-height: 0;
        overflow: hidden;
    }
    .pp-projects-main {
        display: grid;
        grid-template-rows: auto minmax(0, 1fr);
        gap: 14px;
        min-width: 0;
        min-height: 0;
        overflow: hidden;
        padding: 18px 24px;
    }
    .pp-project-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
        align-content: start;
        gap: 10px;
        min-height: 0;
        overflow: auto;
    }
    .pp-project-card-button {
        position: relative;
        display: grid;
        grid-template-columns: 10px minmax(0, 1fr);
        gap: 5px 10px;
        min-height: 138px;
        border: 1px solid var(--pp-border);
        border-radius: 8px;
        background: var(--pp-surface);
        color: var(--pp-ink);
        padding: 14px;
        text-align: left;
        cursor: pointer;
    }
    .pp-project-card-button:hover {
        border-color: var(--pp-border-2);
        background: var(--pp-surface-2);
    }
    .pp-project-card-button .pp-dot {
        margin-top: 7px;
    }
    .pp-project-card-button strong,
    .pp-project-card-id,
    .pp-project-card-description,
    .pp-project-card-meta {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .pp-project-card-button strong {
        font-size: 15px;
    }
    .pp-project-card-id,
    .pp-project-card-description,
    .pp-project-card-meta {
        grid-column: 2;
        color: var(--pp-muted);
        font-size: 11px;
    }
    .pp-project-card-description {
        display: -webkit-box;
        white-space: normal;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        line-height: 1.35;
    }
    .pp-project-card-id {
        font-family: ui-monospace, "SF Mono", Menlo, monospace;
    }
    .pp-project-create {
        display: grid;
        gap: 8px;
        border: 1px solid var(--pp-border);
        border-radius: 8px;
        background: var(--pp-surface);
        padding: 12px;
    }
    .pp-project-create label {
        color: var(--pp-muted);
        font-size: 11px;
        font-weight: 700;
    }
    .pp-project-create input,
    .pp-project-create textarea {
        width: 100%;
        border: 1px solid var(--pp-border);
        border-radius: 7px;
        background: var(--pp-bg);
        color: var(--pp-ink);
        padding: 7px 10px;
        outline: none;
    }
    .pp-project-create input {
        min-height: 36px;
    }
    .pp-project-create textarea {
        min-height: 70px;
        resize: vertical;
        font: inherit;
        line-height: 1.35;
    }
    .pp-page-head {
        grid-column: 1 / -1;
        display: flex;
        align-items: flex-end;
        justify-content: space-between;
        gap: 14px;
    }
    .pp-page-head > div:first-child {
        min-width: 0;
    }
    .pp-page-head.compact {
        grid-column: auto;
        align-items: center;
    }
    .pp-page-head h1 {
        margin: 0;
        font-size: 25px;
        font-weight: 750;
    }
    .pp-page-head p,
    .pp-panel-head p,
    .pp-project-card p {
        margin: 2px 0 0;
    }
    .pp-primary,
    .pp-secondary,
    .pp-ghost,
    .pp-icon-button,
    .pp-config-select,
    .pp-chip {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        min-height: 30px;
        border-radius: 7px;
        border: 1px solid var(--pp-border-2);
        background: var(--pp-surface);
        color: var(--pp-ink);
        padding: 5px 11px;
    }
    .pp-primary {
        border-color: var(--pp-ink);
        background: var(--pp-ink);
        color: var(--pp-bg);
        font-weight: 700;
    }
    .pp-primary:disabled {
        cursor: not-allowed;
        opacity: .45;
    }
    .pp-secondary.danger {
        color: var(--pp-danger);
    }
    .pp-secondary.danger:hover {
        border-color: color-mix(in srgb, var(--pp-danger), transparent 65%);
        background: #fbe5e5;
        color: var(--pp-danger);
    }
    .pp-secondary.danger:disabled {
        cursor: not-allowed;
        opacity: .45;
    }
    .pp-primary.wide {
        width: 100%;
    }
    .pp-ghost {
        border-color: transparent;
        background: transparent;
        color: var(--pp-muted);
    }
    .pp-ghost.icon-only,
    .pp-icon-button {
        width: 32px;
        padding: 0;
    }
    .pp-stat-grid {
        display: grid;
        grid-template-columns: repeat(4, minmax(120px, 1fr));
        gap: 10px;
    }
    .pp-stat,
    .pp-runs-card {
        border: 1px solid var(--pp-border);
        border-radius: 8px;
        background: var(--pp-surface);
    }
    .pp-stat {
        padding: 13px 15px;
    }
    .pp-stat strong {
        display: block;
        font-size: 25px;
        line-height: 1;
    }
    .pp-stat span {
        color: var(--pp-muted);
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: .04em;
    }
    .pp-stat.running strong { color: var(--pp-running); }
    .pp-stat.warning strong { color: var(--pp-warning); }
    .pp-stat.danger strong { color: var(--pp-danger); }
    .pp-stat.success strong { color: var(--pp-success); }
    .pp-workflow-table,
    .pp-runs-card {
        display: grid;
        grid-auto-rows: min-content;
        align-self: stretch;
        min-height: 0;
        overflow: auto;
    }
    .pp-workflow-table {
        border: 1px solid var(--pp-border);
        border-radius: 8px;
        background: var(--pp-surface);
    }
    .pp-table-head,
    .pp-table-row {
        display: grid;
        grid-template-columns: 2fr 1.15fr .55fr 1.15fr .7fr 74px;
        gap: 14px;
        align-items: center;
        min-width: 860px;
    }
    .pp-run-history-head,
    .pp-run-history-row {
        grid-template-columns: 2fr .9fr .28fr .28fr .9fr 1.05fr .7fr 150px;
        min-width: 980px;
    }
    .pp-table-head {
        position: sticky;
        top: 0;
        z-index: 1;
        border-bottom: 1px solid var(--pp-border);
        background: var(--pp-bg);
        color: var(--pp-muted);
        padding: 10px 18px;
        font-size: 10px;
        font-weight: 800;
        letter-spacing: .06em;
        text-transform: uppercase;
    }
    .pp-table-row {
        width: 100%;
        min-height: 58px;
        border: 0;
        border-bottom: 1px solid var(--pp-border);
        background: var(--pp-surface);
        color: var(--pp-ink);
        padding: 10px 18px;
        text-align: left;
    }
    .pp-table-row:last-child {
        border-bottom: 0;
    }
    .pp-table-row:hover {
        background: #fbfaf7;
    }
    .pp-cell {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .pp-cell.title {
        display: flex;
        align-items: center;
        gap: 10px;
        font-weight: 700;
    }
    .pp-cell.title.stacked {
        display: grid;
        gap: 2px;
    }
    .pp-cell.title.stacked span {
        color: var(--pp-muted);
        font-family: ui-monospace, "SF Mono", Menlo, monospace;
        font-size: 11px;
        font-weight: 500;
    }
    .pp-run-title-button {
        min-width: 0;
        display: grid;
        gap: 2px;
        border: 0;
        padding: 0;
        background: transparent;
        color: inherit;
        text-align: left;
        cursor: pointer;
    }
    .pp-run-title-button strong,
    .pp-run-title-button span {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .pp-run-title-button:hover strong {
        text-decoration: underline;
        text-underline-offset: 3px;
    }
    .pp-run-title-button:disabled {
        cursor: default;
    }
    .pp-run-title-button:disabled:hover strong {
        text-decoration: none;
    }
    .pp-cell.result {
        display: flex;
        align-items: center;
        gap: 7px;
        font-weight: 650;
    }
    .pp-cell.result.success { color: var(--pp-success); }
    .pp-cell.result.warning { color: var(--pp-warning); }
    .pp-cell.result.failed { color: var(--pp-danger); }
    .pp-cell.result.prepared,
    .pp-cell.result.queued,
    .pp-cell.result.preparing { color: var(--pp-warning); }
    .pp-cell.result.completed { color: var(--pp-success); }
    .pp-cell.result.running { color: var(--pp-running); }
    .pp-issue-count {
        color: var(--pp-ink);
        font-weight: 750;
        text-align: center;
    }

    .pp-report-shell {
        height: 100vh;
        background: var(--pp-bg);
    }
    .pp-report-shell .pp-wordmark,
    .pp-report-shell .pp-nav-item,
    .pp-report-shell .pp-project-mini {
        text-decoration: none;
    }
    .pp-report-main-shell {
        min-height: 0;
        overflow: hidden;
        padding: 0;
    }
    .pp-report {
        min-height: 0;
        height: 100%;
        display: grid;
        grid-template-columns: minmax(0, 1fr) 10px var(--pp-report-player-width, 440px);
        gap: 0;
        padding: 18px;
        box-sizing: border-box;
        background: var(--pp-bg);
        color: var(--pp-ink);
    }
    .pp-report-main {
        min-width: 0;
        min-height: 0;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        border: 1px solid var(--pp-border);
        border-radius: 8px;
        background: var(--pp-surface);
    }
    .pp-report-header {
        min-height: 78px;
        padding: 18px 22px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        border-bottom: 1px solid var(--pp-border);
        background: var(--pp-surface);
    }
    .pp-report-title-group {
        display: flex;
        align-items: center;
        gap: 18px;
        min-width: 0;
    }
    .pp-report-back {
        width: 32px;
        height: 32px;
        display: inline-grid;
        place-items: center;
        border: 1px solid var(--pp-border);
        border-radius: 999px;
        color: var(--pp-ink);
        background: var(--pp-surface);
        text-decoration: none;
        flex: 0 0 auto;
    }
    .pp-report-back::before {
        content: "";
        width: 8px;
        height: 8px;
        border-left: 2px solid currentColor;
        border-bottom: 2px solid currentColor;
        transform: rotate(45deg);
        margin-left: 3px;
    }
    .pp-report-back:hover {
        border-color: #171614;
        background: #fbfaf7;
    }
    .pp-report-title-group h1 {
        margin: 0;
        font-size: 18px;
        line-height: 1.2;
    }
    .pp-report-title-group p {
        margin: 4px 0 0;
        color: var(--pp-muted);
        font-size: 12px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 58vw;
    }
    .pp-report-summary {
        display: flex;
        align-items: center;
        gap: 8px;
        flex-wrap: wrap;
        justify-content: flex-end;
        color: var(--pp-muted);
        font-size: 12px;
    }
    .pp-report-summary span,
    .pp-report-summary strong {
        border: 1px solid var(--pp-border);
        border-radius: 999px;
        padding: 6px 10px;
        background: var(--pp-bg);
        color: var(--pp-ink);
    }
    .pp-report-export {
        display: inline-flex;
        align-items: center;
    }
    .pp-report-export-status:empty {
        display: none;
    }
    .pp-report-export-status a {
        color: inherit;
        text-decoration: none;
        font-weight: 800;
    }
    .sr-only {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }
    .pp-report-tabs {
        min-height: 56px;
        display: flex;
        align-items: center;
        gap: 0;
        padding: 10px 22px;
        border-bottom: 1px solid var(--pp-border);
        background: #fbfaf7;
    }
    .pp-report-tabs button {
        height: 36px;
        display: inline-flex;
        align-items: center;
        gap: 8px;
        border: 1px solid #d9d2c5;
        border-right-width: 0;
        border-radius: 0;
        background: #f5f2eb;
        color: var(--pp-muted);
        font-size: 12px;
        font-weight: 800;
        padding: 0 14px;
    }
    .pp-report-tabs button:first-child {
        border-radius: 999px 0 0 999px;
    }
    .pp-report-tabs button:last-child {
        border-right-width: 1px;
        border-radius: 0 999px 999px 0;
    }
    .pp-report-tabs button.is-active {
        color: var(--pp-ink);
        background: var(--pp-surface);
        border-color: #171614;
        box-shadow: inset 0 0 0 1px #171614;
    }
    .pp-report-tabs button:disabled {
        opacity: .45;
    }
    .pp-report-tabs span {
        min-width: 22px;
        height: 20px;
        display: inline-grid;
        place-items: center;
        border: 1px solid #d9d2c5;
        border-radius: 999px;
        background: #fffdfa;
        color: var(--pp-muted);
        font-size: 10.5px;
        font-weight: 800;
        padding: 0 6px;
    }
    .pp-report-tabs button.is-active span {
        border-color: #bdb4a6;
        background: #f3efe7;
        color: var(--pp-ink);
    }
    .pp-report-controls {
        min-height: 62px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
        padding: 11px 22px;
        border-bottom: 1px solid var(--pp-border);
        background: #fbfaf7;
    }
    .pp-report-controls-left,
    .pp-report-controls-right {
        display: flex;
        align-items: center;
        gap: 12px;
        min-width: 0;
    }
    .pp-report-controls-label {
        color: var(--pp-muted);
        font-size: 11px;
        font-weight: 850;
        letter-spacing: .06em;
        text-transform: uppercase;
    }
    .pp-report-filter-group {
        display: flex;
        align-items: center;
        gap: 5px;
        flex-wrap: wrap;
        padding: 5px;
        border: 1px solid #d9d2c5;
        border-radius: 999px;
        background: var(--pp-surface);
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .65);
    }
    .pp-report-filter-group.is-hidden,
    .pp-report-category.is-hidden,
    .pp-report-export.is-hidden {
        display: none;
    }
    .pp-report-filter-group button,
    .pp-report-category select,
    .pp-report-search input,
    .pp-report-video-actions button {
        height: 32px;
        border: 1px solid transparent;
        border-radius: 999px;
        background: transparent;
        color: var(--pp-ink);
        font: inherit;
        font-size: 12px;
    }
    .pp-report-category select,
    .pp-report-search input,
    .pp-report-video-actions button {
        border-color: var(--pp-border);
        background: var(--pp-surface);
    }
    .pp-report-filter-group button,
    .pp-report-video-actions button {
        padding: 0 13px;
        font-weight: 750;
    }
    .pp-report-filter-group button.is-active {
        color: var(--pp-surface);
        background: var(--pp-ink);
        border-color: var(--pp-ink);
    }
    .pp-report-filter-divider {
        width: 1px;
        height: 20px;
        background: #d9d2c5;
        margin: 0 4px;
    }
    .pp-report-category,
    .pp-report-search {
        display: flex;
        align-items: center;
        gap: 8px;
    }
    .pp-report-search {
        display: none;
    }
    .pp-report-search.is-visible {
        display: flex;
    }
    .pp-report-category span,
    .pp-report-search span {
        color: var(--pp-muted);
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: .06em;
        font-weight: 850;
    }
    .pp-report-category select {
        min-width: 180px;
        padding: 0 10px;
        border-radius: 999px;
    }
    .pp-report-search input {
        width: 220px;
        padding: 0 10px;
        border-radius: 999px;
    }
    .pp-report-list {
        min-height: 0;
        overflow: auto;
        padding: 18px 22px 22px;
        display: grid;
        align-content: start;
        gap: 0;
        background: var(--pp-bg);
    }
    .pp-report-placeholder {
        padding: 24px;
        border: 1px solid var(--pp-border);
        border-radius: 8px;
        background: var(--pp-surface);
        display: grid;
        gap: 8px;
    }
    .pp-report-placeholder strong {
        font-size: 18px;
    }
    .pp-report-placeholder span {
        color: var(--pp-muted);
    }
    .pp-report-issue-row {
        width: 100%;
        min-height: 54px;
        display: grid;
        grid-template-columns: 92px minmax(0, 1fr) 76px 190px 34px;
        align-items: center;
        gap: 14px;
        padding: 11px 14px;
        border: 0;
        border-bottom: 1px solid #d8d2c7;
        border-left: 3px solid transparent;
        border-radius: 0;
        background: var(--pp-surface);
        color: var(--pp-ink);
        text-align: left;
    }
    .pp-report-issue-row.is-remediation,
    .pp-report-table-head:has(+ .pp-report-issue-row.is-remediation) {
        grid-template-columns: 92px minmax(0, 1fr) 112px minmax(300px, 430px) 24px;
    }
    .pp-report-issue-row.is-saving {
        opacity: .72;
    }
    .pp-remediation-action select,
    .pp-remediation-settings input {
        height: 32px;
        border: 1px solid #d2cabd;
        border-radius: 7px;
        background: var(--pp-surface);
        color: var(--pp-ink);
        font: inherit;
        font-weight: 750;
    }
    .pp-remediation-action select {
        width: 104px;
        padding: 0 8px;
    }
    .pp-remediation-settings {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 6px;
        align-items: center;
    }
    .pp-remediation-settings label {
        display: grid;
        grid-template-columns: auto minmax(42px, 1fr) auto;
        gap: 4px;
        align-items: center;
        min-width: 0;
    }
    .pp-remediation-settings em,
    .pp-remediation-settings small {
        color: var(--pp-muted);
        font-size: 10px;
        font-style: normal;
        font-weight: 800;
        text-transform: uppercase;
    }
    .pp-remediation-settings input {
        width: 100%;
        min-width: 0;
        padding: 0 6px;
        text-align: right;
    }
    .pp-report-table-head {
        position: sticky;
        top: 0;
        z-index: 2;
        display: grid;
        grid-template-columns: 92px minmax(0, 1fr) 76px 190px 34px;
        gap: 14px;
        padding: 10px 14px;
        border: 1px solid #d8d2c7;
        border-bottom: 0;
        border-radius: 8px 8px 0 0;
        background: #e9e5dc;
        color: var(--pp-muted);
        font-size: 10px;
        font-weight: 850;
        letter-spacing: .08em;
        text-transform: uppercase;
    }
    .pp-report-table-head + .pp-report-issue-row {
        border-top: 1px solid #d8d2c7;
    }
    .pp-report-list .pp-report-issue-row:last-child {
        border-radius: 0 0 8px 8px;
    }
    .pp-report-issue-row:hover,
    .pp-report-issue-row.is-active {
        background: #f6faf8;
    }
    .pp-report-issue-row.is-active {
        border-left-color: #3767e2;
        background: #eff5ff;
        box-shadow: inset 0 0 0 2px rgba(55, 103, 226, .18);
    }
    .pp-report-issue-row strong {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 13px;
    }
    .pp-report-time {
        display: flex;
        align-items: center;
        gap: 7px;
        color: var(--pp-running);
        font-weight: 800;
        font-size: 12px;
        font-family: ui-monospace, "SF Mono", Menlo, monospace;
    }
    .pp-report-play {
        width: 0;
        height: 0;
        border-top: 5px solid transparent;
        border-bottom: 5px solid transparent;
        border-left: 8px solid currentColor;
    }
    .pp-report-severity {
        justify-self: start;
        border-radius: 999px;
        padding: 4px 8px;
        background: var(--pp-surface-2);
        color: var(--pp-muted);
        font-size: 10px;
        font-weight: 850;
        text-transform: uppercase;
    }
    .pp-report-severity.strong {
        color: var(--pp-danger);
        background: #fff1ee;
    }
    .pp-report-severity.mild {
        color: var(--pp-warning);
        background: #fff7e8;
    }
    .pp-report-severity.info {
        color: var(--pp-running);
        background: #eef4ff;
    }
    .pp-report-row-category {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: var(--pp-muted);
        font-size: 12px;
    }
    .pp-report-row-actions {
        display: flex;
        justify-content: flex-end;
    }
    .pp-report-remove-issue {
        width: 26px;
        height: 26px;
        display: inline-grid;
        place-items: center;
        border: 1px solid transparent;
        border-radius: 6px;
        color: var(--pp-muted);
    }
    .pp-report-remove-issue::before,
    .pp-report-remove-issue::after {
        content: "";
        position: absolute;
        width: 11px;
        height: 2px;
        border-radius: 999px;
        background: currentColor;
    }
    .pp-report-remove-issue::before {
        transform: rotate(45deg);
    }
    .pp-report-remove-issue::after {
        transform: rotate(-45deg);
    }
    .pp-report-remove-issue {
        position: relative;
    }
    .pp-report-remove-issue:hover,
    .pp-report-remove-issue:focus {
        border-color: #e3bbb4;
        background: #fff1ee;
        color: var(--pp-danger);
        outline: 0;
    }
    .pp-report-video-panel {
        min-width: 0;
        background: var(--pp-surface);
        display: flex;
        flex-direction: column;
        overflow: hidden;
        border: 1px solid var(--pp-border);
        border-radius: 8px;
        align-self: start;
        max-height: calc(100vh - 36px);
    }
    .pp-report-resizer {
        align-self: stretch;
        margin: 0 6px;
        border-radius: 999px;
        background: transparent;
        cursor: col-resize;
        position: relative;
    }
    .pp-report-resizer::before {
        content: "";
        position: absolute;
        top: 10px;
        bottom: 10px;
        left: 50%;
        width: 2px;
        border-radius: 999px;
        transform: translateX(-50%);
        background: #d0c8bb;
    }
    .pp-report-resizer:hover::before,
    .pp-report.is-resizing .pp-report-resizer::before {
        width: 4px;
        background: #171614;
    }
    .pp-report-video-actions {
        height: 46px;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        padding: 0 14px;
        border-bottom: 1px solid var(--pp-border);
        background: var(--pp-surface);
        user-select: none;
    }
    .pp-report-video-actions strong {
        font-size: 12px;
        letter-spacing: .06em;
        text-transform: uppercase;
        color: var(--pp-muted);
    }
    .pp-report-video-shell {
        position: relative;
        aspect-ratio: 16 / 9;
        background: #111;
    }
    .pp-report-video {
        width: 100%;
        height: 100%;
        object-fit: contain;
        background: #111;
    }
    .pp-report-video-empty {
        position: absolute;
        inset: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 20px;
        text-align: center;
        color: #f7f4ee;
        background: #111;
    }
    .pp-report-timeline {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        height: 46px;
        padding: 0 16px 16px;
        display: flex;
        align-items: flex-end;
        background: linear-gradient(to top, rgba(0, 0, 0, .74), transparent);
        pointer-events: none;
    }
    .pp-report-timeline-track {
        position: relative;
        width: 100%;
        height: 5px;
        border-radius: 999px;
        background: rgba(255, 255, 255, .24);
        pointer-events: auto;
        cursor: pointer;
    }
    .pp-report-timeline-progress {
        position: absolute;
        inset: 0 auto 0 0;
        width: 0;
        border-radius: inherit;
        background: #f7f4ee;
    }
    .pp-report-marker {
        position: absolute;
        top: -5px;
        width: 4px;
        height: 15px;
        border: 0;
        border-radius: 3px;
        transform: translateX(-50%);
        background: var(--pp-running);
        cursor: pointer;
    }
    .pp-report-marker.strong {
        background: var(--pp-danger);
    }
    .pp-report-marker.mild {
        background: var(--pp-warning);
    }
    .pp-report-subtitle {
        min-height: 46px;
        padding: 13px 16px;
        background: #151515;
        color: #f7f4ee;
        font-size: 12px;
        line-height: 1.45;
        border-top: 1px solid #2c2c2c;
    }
    .pp-report-video-meta {
        display: grid;
        gap: 0;
        border-top: 1px solid var(--pp-border);
    }
    .pp-report-video-meta > div {
        display: grid;
        grid-template-columns: 90px minmax(0, 1fr);
        gap: 14px;
        padding: 14px 18px;
        border-bottom: 1px solid var(--pp-border);
    }
    .pp-report-video-meta span {
        color: var(--pp-muted);
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: .06em;
        font-weight: 800;
    }
    .pp-report-video-meta strong {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 13px;
    }
    @media (max-width: 1080px) {
        .pp-report-shell {
            grid-template-columns: 1fr;
        }
        .pp-report-shell .pp-rail {
            display: none;
        }
        .pp-report {
            grid-template-columns: 1fr;
            padding: 10px;
        }
        .pp-report-main {
            border-right: 0;
        }
        .pp-report-resizer {
            display: none;
        }
        .pp-report-video-panel {
            border-top: 1px solid var(--pp-border);
        }
        .pp-report-controls,
        .pp-report-header {
            align-items: flex-start;
            flex-direction: column;
        }
        .pp-report-issue-row {
            grid-template-columns: 82px minmax(0, 1fr);
        }
        .pp-report-table-head {
            display: none;
        }
        .pp-report-severity,
        .pp-report-row-category {
            grid-column: 2;
        }
    }
    .pp-cell.chips {
        display: flex;
        gap: 5px;
        flex-wrap: wrap;
        white-space: normal;
    }
    .pp-cell.end {
        display: flex;
        align-items: center;
        gap: 7px;
        justify-content: flex-end;
    }
    .pp-export-select,
    .pp-report-export select {
        height: 30px;
        border: 1px solid var(--pp-border-2);
        border-radius: 7px;
        background: var(--pp-surface);
        color: var(--pp-ink);
        padding: 0 9px;
        font: inherit;
        font-size: 12px;
        font-weight: 700;
    }
    .pp-export-select:disabled,
    .pp-report-export select:disabled {
        opacity: .5;
        cursor: wait;
    }
    .mono {
        font-family: ui-monospace, "SF Mono", Menlo, monospace;
        font-size: 11px;
    }
    .pp-progress {
        height: 5px;
        border-radius: 999px;
        background: var(--pp-surface-2);
        overflow: hidden;
    }
    .pp-progress span {
        display: block;
        height: 100%;
        border-radius: inherit;
        background: var(--pp-accent);
    }
    .pp-workflow-screen {
        display: grid;
        grid-template-rows: auto minmax(0, 1fr);
        min-height: 0;
        overflow: hidden;
    }
    .pp-workflow-screen.is-artifact-open {
        grid-template-rows: minmax(0, 1fr);
        height: 100%;
    }
    .pp-workflow {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 348px;
        gap: 0;
        padding: 0;
    }
    .pp-workflow-main {
        display: grid;
        grid-template-rows: auto minmax(0, 1fr);
        gap: 14px;
        min-width: 0;
        min-height: 0;
        padding: 18px 24px;
        overflow: hidden;
    }
    .pp-workflow-title {
        display: flex;
        align-items: center;
        gap: 13px;
    }
    .pp-label {
        color: var(--pp-muted);
        font-size: 10px;
        font-weight: 800;
        letter-spacing: .06em;
        text-transform: uppercase;
    }
    .pp-config-select {
        justify-content: flex-start;
        max-width: min(620px, 52vw);
    }
    .pp-config-select span {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: var(--pp-muted);
    }
    .pp-pills {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
        margin-left: auto;
    }
    .pp-pill,
    .pp-chip {
        border-radius: 999px;
        border: 1px solid var(--pp-border);
        background: var(--pp-surface);
        color: var(--pp-muted);
        padding: 2px 8px;
        font-size: 11px;
        font-weight: 700;
    }
    a.pp-chip {
        text-decoration: none;
    }
    .pp-chip.is-linked {
        color: var(--pp-ink);
    }
    .pp-chip.is-linked:hover {
        border-color: var(--pp-accent);
    }
    .pp-pill.success { color: var(--pp-success); background: #e8f1eb; border-color: #e8f1eb; }
    .pp-pill.warning { color: var(--pp-warning); background: #fbf1dd; border-color: #fbf1dd; }
    .pp-pill.failed { color: var(--pp-danger); background: #fbe5e5; border-color: #fbe5e5; }
    .pp-pill.running { color: var(--pp-running); background: #e6edfb; border-color: #e6edfb; }
    .pp-workflow-content {
        display: grid;
        grid-template-rows: minmax(0, 1fr);
        gap: 14px;
        min-height: 0;
        overflow: auto;
    }
    .pp-workflow-subtabs {
        display: flex;
        align-items: center;
        gap: 4px;
        min-height: 34px;
        min-width: 0;
        overflow-x: auto;
        border-bottom: 1px solid var(--pp-border);
        background: #faf9f6;
        padding: 3px 24px;
    }
    .pp-workflow-subtab {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        height: 28px;
        min-height: 28px;
        max-width: 260px;
        border: 1px solid transparent;
        border-radius: 6px;
        background: transparent;
        color: var(--pp-muted);
        padding: 4px 8px;
        font-size: 13px;
        font-weight: 700;
        line-height: 1;
        cursor: pointer;
    }
    .pp-workflow-subtab:focus {
        outline: none;
    }
    .pp-workflow-subtab:focus-visible {
        box-shadow: 0 0 0 2px rgba(45, 125, 131, .18);
    }
    .pp-workflow-subtab:hover {
        background: var(--pp-surface-2);
        color: var(--pp-ink);
    }
    .pp-workflow-subtab.is-active {
        border-color: var(--pp-border);
        background: var(--pp-surface);
        color: var(--pp-ink);
        box-shadow: inset 0 -2px 0 var(--pp-accent);
    }
    .pp-workflow-subtab.is-active:focus-visible {
        box-shadow: 0 0 0 2px rgba(45, 125, 131, .18), inset 0 -2px 0 var(--pp-accent);
    }
    .pp-workflow-subtab svg {
        flex: 0 0 auto;
        width: 14px;
        height: 14px;
    }
    .pp-workflow-subtab span {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .pp-workflow-subtab em,
    .pp-workflow-subtab small {
        flex: 0 0 auto;
        color: var(--pp-muted);
        font-size: 9px;
        font-style: normal;
        font-weight: 800;
        letter-spacing: .04em;
        text-transform: uppercase;
    }
    .pp-workflow-subtab em {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 18px;
        height: 18px;
        border-radius: 999px;
        background: var(--pp-surface-2);
        color: var(--pp-ink);
    }
    .pp-tab-close {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 16px;
        height: 16px;
        margin-right: -3px;
        border-radius: 5px;
        color: var(--pp-muted);
    }
    .pp-tab-close:hover {
        background: var(--pp-surface-2);
        color: var(--pp-ink);
    }
    .pp-tab-close svg {
        width: 11px;
        height: 11px;
    }
    .pp-run-panel {
        display: grid;
        grid-template-rows: auto minmax(0, 1fr) auto;
        min-height: 0;
        border-left: 1px solid var(--pp-border);
        background: #fbfaf7;
    }
    .pp-panel-head,
    .pp-panel-action {
        padding: 14px 16px;
    }
    .pp-panel-head {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 10px;
        border-bottom: 1px solid var(--pp-border);
    }
    .pp-panel-head strong {
        font-size: 14px;
    }
    .pp-artifact-list {
        min-height: 0;
        overflow: auto;
    }
    .pp-artifact-strip {
        border: 1px solid var(--pp-border);
        border-radius: 8px;
        background: var(--pp-surface);
        overflow: hidden;
    }
    .pp-ready-card {
        border: 1px solid var(--pp-border);
        border-radius: 8px;
        background: var(--pp-surface);
        overflow: hidden;
    }
    .pp-section-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        border-bottom: 1px solid var(--pp-border);
        background: var(--pp-bg);
        padding: 10px 14px;
    }
    .pp-section-head div {
        display: grid;
        gap: 1px;
    }
    .pp-section-head span {
        color: var(--pp-muted);
        font-size: 11px;
    }
    .pp-section-summary {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        min-height: 24px;
        border: 1px solid var(--pp-border);
        border-radius: 999px;
        background: var(--pp-surface);
        padding: 2px 8px;
        white-space: nowrap;
    }
    .pp-section-summary strong {
        color: var(--pp-ink);
        font-size: 11px;
        line-height: 1;
    }
    .pp-section-summary span {
        color: var(--pp-muted);
        font-size: 10px;
        font-weight: 700;
        line-height: 1;
    }
    .pp-artifact-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(180px, 1fr));
        max-height: 176px;
        overflow: auto;
    }
    .pp-run-artifact-list {
        display: grid;
        grid-template-columns: repeat(2, minmax(260px, 1fr));
        max-height: 220px;
        min-height: 0;
        overflow: auto;
    }
    .pp-run-artifact-list .pp-artifact {
        border-right: 1px solid var(--pp-border);
    }
    .pp-run-files-card {
        display: grid;
        grid-template-rows: auto minmax(0, 1fr);
        min-height: 0;
    }
    .pp-section-head .pp-workflow-filter-bar {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 8px;
        min-width: 0;
        overflow-x: auto;
        overflow-y: hidden;
        white-space: nowrap;
    }
    .pp-run-files-card .pp-section-head {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: start;
        gap: 8px 12px;
    }
    .pp-run-files-card .pp-section-head > div:first-child {
        min-width: 0;
    }
    .pp-run-files-card .pp-section-head > div:first-child span {
        display: block;
        max-width: 34ch;
    }
    .pp-run-files-card .pp-section-head .pp-workflow-filter-bar {
        grid-column: 1 / -1;
        justify-content: flex-start;
        width: 100%;
        overflow: visible;
        white-space: normal;
    }
    .pp-workflow-filter-search {
        display: flex;
        flex: 1 1 170px;
        align-items: center;
        gap: 7px;
        width: auto;
        min-width: 150px;
        max-width: 230px;
        height: 32px;
        border: 1px solid var(--pp-border);
        border-radius: 999px;
        background: var(--pp-surface);
        color: var(--pp-muted);
        padding: 0 8px 0 10px;
        white-space: nowrap;
    }
    .pp-workflow-filter-search svg,
    .pp-workflow-filter-clear svg {
        flex: 0 0 auto;
        width: 14px;
        height: 14px;
    }
    .pp-workflow-filter-search input {
        width: 100%;
        min-width: 0;
        height: 30px;
        border: 0;
        outline: 0;
        background: transparent;
        color: var(--pp-ink);
        font: inherit;
        font-size: 12px;
    }
    .pp-workflow-filter-clear {
        display: inline-flex;
        flex: 0 0 auto;
        align-items: center;
        justify-content: center;
        width: 22px;
        height: 22px;
        border: 0;
        border-radius: 999px;
        background: transparent;
        color: var(--pp-muted);
        cursor: pointer;
    }
    .pp-workflow-filter-clear:hover {
        background: var(--pp-surface-2);
        color: var(--pp-ink);
    }
    .pp-section-head .pp-workflow-filter-chips {
        display: flex;
        flex: 999 1 auto;
        flex-wrap: wrap;
        align-items: center;
        gap: 6px;
        min-width: 0;
        white-space: normal;
    }
    .pp-section-head .pp-workflow-filter-chips button {
        display: inline-flex;
        flex: 0 0 auto;
        align-items: center;
        gap: 6px;
        min-height: 28px;
        min-width: max-content;
        border: 1px solid var(--pp-border);
        border-radius: 999px;
        background: var(--pp-surface);
        color: var(--pp-muted);
        padding: 0 10px;
        font: inherit;
        font-size: 11px;
        font-weight: 750;
        cursor: pointer;
        white-space: nowrap;
    }
    .pp-section-head .pp-workflow-filter-chips button span {
        display: inline-block;
        color: inherit;
        font-size: inherit;
        white-space: nowrap;
    }
    .pp-section-head .pp-workflow-filter-chips button.is-active {
        border-color: var(--pp-ink);
        background: var(--pp-ink);
        color: var(--pp-surface);
    }
    .pp-section-head .pp-workflow-filter-chips em {
        display: inline-block;
        font-style: normal;
        opacity: .72;
        white-space: nowrap;
    }
    .pp-run-file-list {
        min-height: 0;
        overflow-x: hidden;
        overflow-y: auto;
    }
    .pp-run-file-empty {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        min-height: 360px;
        height: 100%;
        padding: 42px 24px;
        color: var(--pp-ink);
        text-align: center;
    }
    .pp-run-file-empty-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 48px;
        height: 48px;
        margin-bottom: 14px;
        border: 1px solid rgba(15, 118, 110, .24);
        border-radius: 12px;
        background: #e6f6f2;
        color: var(--pp-accent);
        box-shadow: 0 12px 32px rgba(15, 118, 110, .10);
    }
    .pp-run-file-empty-icon svg {
        width: 24px;
        height: 24px;
        stroke-width: 1.8;
    }
    .pp-run-file-empty strong {
        font-size: 18px;
        line-height: 1.2;
    }
    .pp-run-file-empty p {
        max-width: 360px;
        margin: 8px 0 0;
        color: var(--pp-muted);
        font-size: 13px;
        line-height: 1.45;
    }
    .pp-run-file {
        display: grid;
        border-bottom: 6px solid var(--pp-bg);
        background: var(--pp-surface);
        box-shadow: inset 0 -1px 0 var(--pp-border);
    }
    .pp-run-file:last-child {
        border-bottom-width: 0;
    }
    .pp-run-file.is-selected {
        background: #eef8f6;
    }
    .pp-run-file.is-disabled {
        opacity: .68;
    }
    .pp-run-file-head {
        display: grid;
        grid-template-columns: 22px 18px 38px minmax(0, 1fr) auto;
        gap: 8px;
        align-items: center;
        min-width: 0;
        min-height: 54px;
        padding: 7px 12px;
    }
    .pp-run-file-disclosure,
    .pp-run-file-open,
    .pp-actions-chip {
        border: 1px solid transparent;
        background: transparent;
        color: var(--pp-muted);
        cursor: pointer;
    }
    .pp-run-file-disclosure {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 22px;
        height: 22px;
        border-radius: 6px;
        padding: 0;
    }
    .pp-run-file-identity {
        display: flex;
        grid-column: 2;
        grid-row: 1;
        align-items: flex-start;
        gap: 10px;
        min-width: 0;
    }
    .pp-run-file .pp-artifact-copy {
        display: flex;
        align-items: center;
        gap: 8px;
        min-width: 0;
        overflow: hidden;
    }
    .pp-run-file .pp-artifact-copy strong,
    .pp-run-file .pp-artifact-copy small,
    .pp-run-file .pp-artifact-copy em {
        flex: 0 1 auto;
        min-width: 0;
    }
    .pp-run-file .pp-artifact-copy strong {
        color: var(--pp-ink);
        font-size: 14px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .pp-run-file .pp-artifact-copy small::before {
        content: "/";
        margin-right: 8px;
        color: var(--pp-muted-2);
        font-weight: 700;
    }
    .pp-run-file-disclosure svg {
        width: 14px;
        height: 14px;
        transition: transform .14s ease;
    }
    .pp-run-file.is-collapsed .pp-run-file-disclosure svg {
        transform: rotate(-90deg);
    }
    .pp-run-file-disclosure:hover,
    .pp-run-file-open:hover,
    .pp-actions-chip:hover {
        background: var(--pp-surface-2);
        border-color: var(--pp-border);
        color: var(--pp-ink);
    }
    .pp-run-file-select {
        display: inline-flex;
        align-items: flex-start;
        justify-content: center;
        flex: 0 0 auto;
        padding-top: 2px;
    }
    .pp-run-file-head input {
        accent-color: var(--pp-ink);
    }
    .pp-run-file-actions {
        display: inline-flex;
        align-items: center;
        justify-content: flex-end;
        gap: 8px;
        min-width: 0;
    }
    .pp-run-file-open {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        min-height: 26px;
        border-color: var(--pp-border);
        border-radius: 999px;
        background: #fbfaf7;
        padding: 2px 9px;
        color: var(--pp-ink);
        font-size: 11px;
        font-weight: 800;
        line-height: 1;
        white-space: nowrap;
    }
    .pp-run-file-open svg {
        width: 13px;
        height: 13px;
    }
    .pp-run-file-head .pp-kind {
        height: 26px;
        min-width: 38px;
        border-radius: 7px;
        font-size: 9px;
    }
    .pp-run-file-head .pp-artifact-copy strong {
        font-size: 13px;
    }
    .pp-run-file-count {
        display: inline-flex;
        flex: 0 0 auto;
        align-items: center;
        min-height: 18px;
        border: 1px solid var(--pp-border);
        border-radius: 999px;
        background: #fbfaf7;
        padding: 1px 7px;
        color: var(--pp-muted);
        font-size: 10px;
        font-weight: 700;
        line-height: 1;
        white-space: nowrap;
    }
    .pp-run-file-executed {
        display: block;
        margin: 0 12px 12px 89px;
        background: transparent;
    }
    .pp-run-file-run-list {
        display: grid;
        align-content: start;
        gap: 6px;
        min-height: 0;
    }
    .pp-run-file-older-list {
        display: grid;
        gap: 6px;
    }
    .pp-root .pp-run-file-more {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        justify-self: start;
        gap: 4px;
        min-height: 18px;
        padding: 1px 7px;
        border: 1px solid var(--pp-border);
        border-radius: 999px;
        background: #fbfaf7;
        color: var(--pp-muted);
        font-size: 10px;
        font-weight: 700;
        cursor: pointer;
    }
    .pp-root .pp-run-file-more:hover {
        background: var(--pp-surface-2);
        color: var(--pp-ink);
    }
    .pp-root .pp-run-file-more svg {
        width: 9px;
        height: 9px;
        transition: transform .14s ease;
    }
    .pp-root .pp-run-file-more:not(.is-expanded) svg {
        transform: rotate(-90deg);
    }
    .pp-file-run {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: 10px;
        border: 1px solid var(--pp-border);
        border-left: 2px solid var(--pp-accent);
        border-radius: 0 7px 7px 0;
        background: #fffdfa;
        padding: 8px 10px 8px 12px;
    }
    .pp-file-run-output {
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: start;
        gap: 6px 10px;
    }
    .pp-file-run.is-highlighted {
        animation: pp-run-job-highlight 6.5s ease-out both;
    }
    .pp-file-run.is-running {
        border-color: rgba(37, 99, 235, .28);
        border-left-color: var(--pp-running);
        background: #eef6ff;
        box-shadow: inset 0 0 0 1px rgba(37, 99, 235, .08);
        animation: pp-run-job-active 1.8s ease infinite;
        animation-delay: var(--pp-run-pulse-delay, 0s);
    }
    .pp-file-run.is-running.is-highlighted {
        animation:
            pp-run-job-highlight 6.5s ease-out both,
            pp-run-job-active 1.8s ease infinite;
        animation-delay: 0s, var(--pp-run-pulse-delay, 0s);
    }
    @keyframes pp-run-job-highlight {
        0%,
        48% {
            border-color: rgba(50, 128, 112, .58);
            background: #ecfbf7;
            box-shadow: 0 0 0 3px rgba(50, 128, 112, .14);
        }
        100% {
            border-color: var(--pp-border);
            background: transparent;
            box-shadow: none;
        }
    }
    @keyframes pp-run-job-active {
        0% {
            border-color: rgba(37, 99, 235, .24);
            border-left-color: var(--pp-running);
            background: #eef6ff;
            box-shadow: 0 0 0 0 rgba(37, 99, 235, .16);
        }
        55% {
            border-color: rgba(37, 99, 235, .42);
            border-left-color: var(--pp-running);
            background: #dbeafe;
            box-shadow: 0 0 0 4px rgba(37, 99, 235, .08);
        }
        100% {
            border-color: rgba(37, 99, 235, .24);
            border-left-color: var(--pp-running);
            background: #eef6ff;
            box-shadow: 0 0 0 8px rgba(37, 99, 235, 0);
        }
    }
    .pp-file-run::before {
        content: none;
    }
    .pp-file-run-main {
        position: relative;
        display: grid;
        grid-column: 1;
        grid-template-columns: minmax(0, 1fr);
        align-items: start;
        min-width: 0;
        gap: 4px;
    }
    .pp-file-run-status,
    .pp-file-run-submeta,
    .pp-file-run-outputs {
        display: flex;
        align-items: center;
        min-width: 0;
        gap: 7px;
    }
    .pp-file-run-status strong,
    .pp-file-run-submeta span {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .pp-file-run-output .pp-file-run-main strong {
        font-size: 13px;
    }
    .pp-file-run-title-button {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        min-width: 0;
        border: 0;
        background: transparent;
        color: inherit;
        padding: 0;
        font: inherit;
        cursor: pointer;
    }
    .pp-file-run-title-button:disabled {
        cursor: default;
        opacity: .68;
    }
    .pp-file-run-title-button:hover .pp-file-run-label {
        border-color: var(--pp-ink);
    }
    .pp-file-run-label {
        display: inline-flex;
        align-items: center;
        max-width: 220px;
        min-height: 24px;
        border: 1px solid color-mix(in srgb, var(--pp-accent), transparent 55%);
        border-radius: 999px;
        background: color-mix(in srgb, var(--pp-accent), transparent 88%);
        color: var(--pp-ink);
        padding: 0 9px;
        font-size: 12px;
        font-weight: 850;
        line-height: 1;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .pp-file-run-issues {
        display: inline-flex;
        align-items: center;
        min-height: 24px;
        border: 1px solid var(--pp-border);
        border-radius: 999px;
        background: var(--pp-surface);
        color: var(--pp-ink);
        padding: 0 9px;
        font-size: 11px;
        font-weight: 800;
        white-space: nowrap;
    }
    .pp-file-run-submeta {
        padding-left: 15px;
        color: var(--pp-muted);
        font-size: 11px;
    }
    .pp-file-run-outputs {
        padding-left: 15px;
        justify-content: flex-start;
    }
    .pp-run-version-details {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 5px;
        padding-left: 15px;
        color: var(--pp-muted);
        font-size: 11px;
    }
    .pp-run-param-inline {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        min-height: 22px;
        border: 1px solid var(--pp-border);
        border-radius: 999px;
        background: #fff;
        padding: 2px 8px;
        white-space: nowrap;
    }
    .pp-run-param-inline strong {
        color: var(--pp-ink);
        font-size: 11px;
    }
    .pp-run-config-wrap {
        position: relative;
        display: inline-flex;
        align-items: center;
    }
    .pp-run-config-chip {
        display: inline-flex;
        align-items: center;
        min-height: 22px;
        border: 1px solid var(--pp-border);
        border-radius: 999px;
        background: var(--pp-surface);
        color: var(--pp-ink);
        padding: 2px 8px;
        font: inherit;
        font-weight: 800;
        white-space: nowrap;
        cursor: pointer;
    }
    .pp-run-config-chip:hover,
    .pp-run-config-chip.is-open {
        border-color: var(--pp-accent);
        background: #f5fbf9;
        color: var(--pp-ink);
    }
    .pp-run-params-tooltip {
        position: fixed;
        z-index: 40;
        display: grid;
        gap: 8px;
        border: 1px solid rgba(30, 132, 123, .28);
        border-radius: 8px;
        background: #fffefa;
        box-shadow: 0 18px 42px rgba(34, 28, 15, .16);
        padding: 8px;
        color: var(--pp-ink);
        overflow: visible;
        white-space: normal;
    }
    .pp-run-params-sections {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 5px;
    }
    .pp-run-params-section {
        border: 1px solid var(--pp-border);
        border-radius: 6px;
        background: #fffdf9;
        overflow: hidden;
    }
    .pp-run-params-title {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        gap: 10px;
        min-width: 0;
    }
    .pp-run-params-title strong {
        min-width: 0;
        overflow: hidden;
        color: var(--pp-ink);
        font-size: 11px;
        font-weight: 850;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .pp-run-params-title em {
        color: var(--pp-muted);
        font-style: normal;
        font-size: 9.5px;
        white-space: nowrap;
    }
    .pp-run-params-section-title {
        display: block;
        border-bottom: 1px solid var(--pp-border);
        background: var(--pp-surface);
        padding: 4px 6px;
        color: var(--pp-ink);
        font-size: 9.5px;
        font-weight: 800;
    }
    .pp-run-params-list {
        display: grid;
        gap: 0;
    }
    .pp-run-param-row {
        display: grid;
        grid-template-columns: minmax(48px, .9fr) minmax(0, 1.1fr);
        gap: 4px;
        border-top: 1px solid var(--pp-border-soft);
        padding: 3px 6px;
        font-size: 9px;
        line-height: 1.15;
    }
    .pp-run-param-row:first-child {
        border-top: 0;
    }
    .pp-run-param-row span {
        color: var(--pp-muted);
    }
    .pp-run-param-row strong {
        min-width: 0;
        overflow: hidden;
        color: var(--pp-ink);
        font-size: 9.5px;
        font-weight: 600;
        text-overflow: ellipsis;
        white-space: normal;
    }
    .pp-run-params-empty {
        color: var(--pp-muted);
        font-size: 11px;
    }
    .pp-file-run-actions {
        display: flex;
        grid-column: 2;
        grid-row: 1;
        align-items: center;
        justify-content: flex-end;
        gap: 6px;
        min-width: 0;
    }
    .pp-file-run-output .pp-file-run-actions {
        grid-column: 1;
        grid-row: auto;
        justify-content: flex-start;
        gap: 0;
        padding-left: 15px;
    }
    .pp-run-version-actions {
        display: flex;
        grid-column: 2;
        grid-row: 1;
        align-items: center;
        justify-content: flex-end;
        gap: 6px;
        min-width: 0;
        padding-left: 0;
    }
    .pp-run-version-actions .pp-run-version-action {
        background: #fffdf9;
    }
    .pp-run-version-actions a.pp-run-version-action,
    .pp-run-version-actions a.pp-run-version-action:visited {
        color: var(--pp-ink);
        font: inherit;
        text-decoration: none;
    }
    .pp-run-version-actions .pp-run-version-action:hover:not(:disabled) {
        background: var(--pp-surface-2);
    }
    .pp-run-version-actions .pp-run-version-action:disabled {
        background: #fbfaf7;
    }
    .pp-file-run-actions .pp-secondary {
        min-height: 26px;
        padding: 2px 9px;
        white-space: nowrap;
    }
    .pp-file-run-actions svg {
        width: 13px;
        height: 13px;
    }
    .pp-file-run-outputs.pp-cell {
        overflow: visible;
        white-space: normal;
    }
    .pp-output-chip {
        position: relative;
        display: inline-flex;
        align-items: center;
        gap: 4px;
        min-width: 0;
    }
    .pp-actions-menu {
        position: relative;
        display: inline-flex;
        align-items: center;
        flex: 0 0 auto;
    }
    .pp-actions-chip {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 26px;
        border-color: var(--pp-border);
        border-radius: 999px;
        background: #fbfaf7;
        padding: 2px 9px;
        color: var(--pp-ink);
        font-size: 11px;
        font-weight: 800;
        line-height: 1;
        white-space: nowrap;
    }
    .pp-actions-chip.pp-remove-chip {
        color: #b42318;
    }
    .pp-output-chip .pp-chip,
    .pp-output-chip .pp-run-output-open,
    .pp-output-chip .pp-actions-chip {
        min-height: 24px;
        padding: 2px 8px;
        font-size: 10px;
    }
    .pp-output-chip .pp-run-output-open svg {
        width: 12px;
        height: 12px;
    }
    .pp-actions-menu.is-open .pp-actions-chip {
        border-color: var(--pp-accent);
        color: var(--pp-ink);
        box-shadow: 0 0 0 2px rgba(61, 130, 133, .12);
    }
    .pp-actions-popover {
        position: absolute;
        top: calc(100% + 5px);
        right: 0;
        z-index: 9;
        min-width: 156px;
        border: 1px solid var(--pp-border);
        border-radius: 7px;
        background: var(--pp-surface);
        box-shadow: 0 10px 24px rgba(23, 22, 20, .12);
        padding: 5px;
    }
    .pp-actions-item {
        display: grid;
        grid-template-columns: 18px minmax(0, 1fr);
        align-items: center;
        gap: 7px;
        width: 100%;
        min-height: 30px;
        border: 0;
        border-radius: 5px;
        background: transparent;
        color: var(--pp-ink);
        padding: 5px 7px;
        font: inherit;
        font-size: 12px;
        font-weight: 700;
        text-align: left;
        text-decoration: none;
        cursor: pointer;
    }
    .pp-actions-item:hover {
        background: var(--pp-surface-2);
        color: var(--pp-ink);
    }
    .pp-actions-item.danger {
        color: var(--pp-danger);
    }
    .pp-actions-item.danger:hover {
        background: #fff1f1;
    }
    .pp-actions-item:disabled {
        cursor: not-allowed;
        opacity: .55;
    }
    .pp-actions-item svg {
        width: 14px;
        height: 14px;
        justify-self: center;
    }
    .pp-actions-empty {
        display: block;
        color: var(--pp-muted);
        font-size: 11px;
        font-weight: 700;
        white-space: nowrap;
    }
    .pp-run-file-executed > .pp-empty-inline {
        color: var(--pp-muted);
        border: 1px solid var(--pp-border);
        border-radius: 7px;
        background: transparent;
        padding: 7px 10px;
        font-size: 12px;
    }
    .pp-run-file-executed > .pp-empty-inline::before {
        content: none;
    }
    .pp-open-aaf-card {
        display: grid;
        grid-template-rows: minmax(0, 1fr);
        min-height: 0;
    }
    .pp-workflow-screen.is-artifact-open .pp-open-aaf-card {
        border: 0;
        border-radius: 0;
        background: var(--pp-bg);
        padding: 10px;
    }
    .pp-open-aaf-shell {
        display: grid;
        height: 100%;
        min-height: 100%;
        overflow: hidden;
        border: 1px solid var(--pp-border);
        border-radius: 10px;
        background: var(--pp-surface);
        box-shadow: 0 10px 28px rgba(34, 28, 15, .08);
    }
    .pp-open-aaf-frame {
        width: 100%;
        height: 100%;
        min-height: 0;
        border: 0;
        border-radius: inherit;
        background: var(--pp-surface);
    }
    .pp-open-aaf-message {
        display: grid;
        place-items: center;
        align-content: center;
        gap: 9px;
        min-height: 100%;
        background: var(--pp-surface);
        color: var(--pp-ink);
        text-align: center;
    }
    .pp-open-aaf-message strong {
        font-size: 16px;
    }
    .pp-open-aaf-message span {
        color: var(--pp-muted);
        font-size: 12px;
    }
    .pp-inline-loader {
        width: 22px;
        height: 22px;
        border: 2px solid var(--pp-border);
        border-top-color: var(--pp-accent);
        border-radius: 50%;
        animation: pp-spin .8s linear infinite;
    }
    @keyframes pp-spin {
        to { transform: rotate(360deg); }
    }
    body.workspace-embed .top-bar {
        min-height: 42px;
        height: 42px;
        padding: 0 10px;
    }
    body.workspace-embed .top-identity,
    body.workspace-embed .top-guide-actions,
    body.workspace-embed .top-spacer {
        display: none;
    }
    body.workspace-embed .top-export-actions,
    body.workspace-embed #suite-workflow-back-btn.suite-embed-back-btn,
    body.workspace-embed #suite-workflow-fullscreen-btn.suite-embed-fullscreen-btn,
    body.workspace-embed #suite-workflow-run-btn.suite-embed-run-btn {
        display: inline-flex;
    }
    body.workspace-embed #automix-export-aaf-btn {
        display: none;
    }
    body.workspace-embed .top-transport {
        flex: 1 1 auto;
        justify-content: flex-end;
        min-width: 0;
    }
    body.workspace-embed .top-focus-actions {
        position: relative;
        z-index: 2;
        display: inline-flex;
        margin-right: auto;
    }
    body.workspace-embed .top-transport-core {
        position: absolute;
        top: 5px;
        left: 50%;
        transform: translateX(-50%);
        z-index: 1;
    }
    body.workspace-embed .top-export-actions {
        position: relative;
        z-index: 2;
    }
    body.workspace-embed .agent-mode-controls {
        top: 7px;
        right: 12px;
        width: 340px;
    }
    body.workspace-embed .pane-agent.open {
        width: 360px;
        min-width: 360px;
    }
    body.workspace-embed .pane-automix .automix-scroll {
        background: var(--bg-main);
    }
    body.workspace-embed .automix-card,
    body.workspace-embed .automix-card-main {
        background: var(--bg-panel);
        border-color: rgba(139,148,158,.22);
        box-shadow: none;
    }
    body.workspace-embed .automix-card::after {
        background: rgba(88,166,255,.035);
        box-shadow: none;
    }
    body.workspace-embed .automix-card-main {
        border-color: rgba(139,148,158,.24);
    }
    body.workspace-embed .automix-card.is-processing-visual {
        border-color: rgba(88,166,255,.36);
        box-shadow: none;
    }
    body.workspace-embed .automix-card.is-processing-visual::after,
    body.workspace-embed .automix-card.is-processing-settling::after {
        opacity: .10;
        filter: none;
    }
    body.workspace-embed .automix-card-status::before,
    body.workspace-embed .automix-card[data-processed="true"] .automix-card-status::before {
        box-shadow: none;
    }
    body.workspace-embed .automix-pill.is-active,
    body.workspace-embed .automix-segment-btn.is-active {
        background: rgba(88,166,255,.10);
        box-shadow: none;
    }
    body.workspace-embed .automix-pill:hover,
    body.workspace-embed .automix-segment-btn:hover {
        transform: none;
    }
    body.workspace-embed .automix-help-tooltip {
        background: var(--bg-panel);
        box-shadow: 0 12px 28px rgba(0,0,0,.24);
    }
    body.workspace-embed .automix-slider::-webkit-slider-runnable-track {
        background: linear-gradient(
            90deg,
            var(--blue-hover) 0%,
            var(--blue-hover) var(--slider-progress),
            rgba(139,148,158,.42) var(--slider-progress),
            rgba(139,148,158,.42) 100%
        );
    }
    body.workspace-embed .automix-slider::-moz-range-track {
        background: linear-gradient(
            90deg,
            var(--blue-hover) 0%,
            var(--blue-hover) var(--slider-progress),
            rgba(139,148,158,.42) var(--slider-progress),
            rgba(139,148,158,.42) 100%
        );
    }
    body.workspace-embed .automix-slider::-webkit-slider-thumb,
    body.workspace-embed .automix-range-input::-webkit-slider-thumb {
        box-shadow: none;
    }
    body.workspace-embed .automix-slider::-moz-range-thumb,
    body.workspace-embed .automix-range-input::-moz-range-thumb {
        box-shadow: none;
    }
    body.workspace-embed .automix-slider:focus-visible {
        filter: none;
    }
    body.workspace-embed .automix-range-slider::before {
        background: rgba(139,148,158,.45);
    }
    body.workspace-embed .automix-range-slider::after {
        content: "";
        position: absolute;
        left: var(--range-start);
        right: calc(100% - var(--range-end));
        top: 50%;
        height: 4px;
        transform: translateY(-50%);
        border-radius: 999px;
        background: var(--blue-hover);
        pointer-events: none;
    }
    body.workspace-embed .pane-automix .automix-process-block {
        background: var(--bg-panel);
        border-top: 1px solid var(--border);
        box-shadow: none;
    }
    body.workspace-embed {
        --bg-main: #f7f6f1;
        --bg-panel: #fffefa;
        --bg-hover: #f0eee7;
        --text-main: #171614;
        --text-muted: #6e6b62;
        --blue: #0f766e;
        --blue-hover: #115e59;
        --blue-text: #0f766e;
        --blue-soft: rgba(15, 118, 110, .10);
        --blue-border: rgba(15, 118, 110, .30);
        --green: #4d7c5c;
        --green-hover: #3f6f50;
        --green-text: #4d7c5c;
        --green-soft: rgba(77, 124, 92, .12);
        --green-border: rgba(77, 124, 92, .30);
        --amber: #b45309;
        --amber-text: #b45309;
        --amber-soft: rgba(180, 83, 9, .10);
        --amber-border: rgba(180, 83, 9, .28);
        --red: #b91c1c;
        --red-text: #b91c1c;
        --red-soft: rgba(185, 28, 28, .10);
        --red-border: rgba(185, 28, 28, .28);
        --accent: #0f766e;
        --border: #e4dfd3;
        --timeline-bg: #fffefa;
        --timeline-bg-soft: #f0eee7;
        --timeline-divider: rgba(214, 207, 191, .95);
        --timeline-divider-soft: rgba(214, 207, 191, .62);
        --wave-idle: #aaa294;
        --wave-active: #0f766e;
        --timeline-cursor: #171614;
        background: var(--bg-main);
        color: var(--text-main);
    }
    body.workspace-embed .top-bar,
    body.workspace-embed .pane-agent,
    body.workspace-embed #track-mixer,
    body.workspace-embed .console-area {
        background: var(--bg-panel);
        border-color: var(--border);
        color: var(--text-main);
    }
    body.workspace-embed .top-bar {
        background: var(--bg-panel);
        box-shadow: inset 0 -1px 0 var(--border);
    }
    body.workspace-embed #waveform-scroll-root,
    body.workspace-embed #waveform-area,
    body.workspace-embed #waveform-area .scroll,
    body.workspace-embed #waveform-area ::part(scroll),
    body.workspace-embed .track-wave {
        background: var(--timeline-bg);
    }
    body.workspace-embed .wavesurfer-global-timeline,
    body.workspace-embed #track-mixer-ruler-spacer,
    body.workspace-embed .track-header,
    body.workspace-embed .meta-strip {
        background: var(--timeline-bg-soft);
        border-color: var(--border);
        color: var(--text-muted);
    }
    body.workspace-embed .track-row {
        background-image: linear-gradient(
            to bottom,
            transparent calc(100% - 4px),
            var(--timeline-divider-soft) calc(100% - 4px),
            var(--timeline-divider-soft) calc(100% - 3px),
            var(--timeline-bg) calc(100% - 3px),
            var(--timeline-bg) calc(100% - 1px),
            var(--timeline-divider) calc(100% - 1px),
            var(--timeline-divider) 100%
        );
    }
    body.workspace-embed .mixer-row {
        background-image: linear-gradient(
            to bottom,
            transparent calc(100% - 4px),
            var(--border) calc(100% - 4px),
            var(--border) calc(100% - 3px),
            var(--bg-panel) calc(100% - 3px),
            var(--bg-panel) calc(100% - 1px),
            var(--border) calc(100% - 1px),
            var(--border) 100%
        );
    }
    body.workspace-embed .mixer-track-name,
    body.workspace-embed .automix-title,
    body.workspace-embed .automix-card-title,
    body.workspace-embed .qc-title,
    body.workspace-embed .qc-pane-title {
        color: var(--text-main);
    }
    body.workspace-embed .track-label {
        background: rgba(255, 254, 250, .92);
        border-color: var(--border);
        color: var(--text-muted);
    }
    body.workspace-embed .automation-unity-line {
        stroke: rgba(110, 107, 98, .38);
    }
    body.workspace-embed .automation-gain-line {
        stroke: rgba(23, 22, 20, .76);
        filter: none;
    }
    body.workspace-embed .timeline-hover-time {
        border-color: var(--blue-border);
        background: #fffefa;
        color: var(--text-main);
        box-shadow: 0 8px 20px rgba(34, 28, 15, .12);
    }
    body.workspace-embed .timeline-hover-line,
    body.workspace-embed .timeline-playhead-line {
        background: rgba(15, 118, 110, .72);
        box-shadow: none;
    }
    body.workspace-embed .top-bar #suite-workflow-run-btn.suite-embed-run-btn {
        border-color: var(--text-main);
        background: var(--text-main);
        color: #fffefa;
    }
    body.workspace-embed .top-bar #suite-workflow-back-btn.suite-embed-back-btn,
    body.workspace-embed .top-bar #suite-workflow-fullscreen-btn.suite-embed-fullscreen-btn,
    body.workspace-embed .top-bar #btn-raw-playback,
    body.workspace-embed .master-volume-control,
    body.workspace-embed .btn-mix,
    body.workspace-embed .btn-agent-toggle {
        border-color: var(--border);
        background: #fffefa;
        color: var(--text-main);
        font-weight: 800;
    }
    body.workspace-embed .top-bar #suite-workflow-back-btn.suite-embed-back-btn:hover,
    body.workspace-embed .top-bar #suite-workflow-fullscreen-btn.suite-embed-fullscreen-btn:hover,
    body.workspace-embed .top-bar #suite-workflow-fullscreen-btn.suite-embed-fullscreen-btn.is-active,
    body.workspace-embed .top-bar #btn-raw-playback:hover,
    body.workspace-embed .top-bar #btn-raw-playback.active,
    body.workspace-embed .btn-mix:hover,
    body.workspace-embed .btn-agent-toggle:hover,
    body.workspace-embed .btn-agent-toggle.active {
        border-color: var(--blue-border);
        background: var(--blue-soft);
        color: var(--blue-text);
    }
    body.workspace-embed .top-bar #btn-play {
        border-color: var(--green-border);
        background: var(--green-soft);
        color: var(--green-text);
    }
    body.workspace-embed .top-bar #btn-play:hover {
        border-color: var(--green);
        background: rgba(77, 124, 92, .16);
        color: var(--green-text);
    }
    body.workspace-embed .top-bar #btn-play.is-playing {
        border-color: var(--red-border);
        background: var(--red-soft);
        color: var(--red-text);
    }
    body.workspace-embed .pane-automix .automix-scroll {
        background: var(--bg-main);
    }
    body.workspace-embed .automix-card,
    body.workspace-embed .automix-card-main,
    body.workspace-embed .automix-help-tooltip,
    body.workspace-embed .qc-status-panel,
    body.workspace-embed .qc-check-row {
        background: var(--bg-panel);
        border-color: var(--border);
        color: var(--text-main);
        box-shadow: none;
    }
    body.workspace-embed .automix-card-main {
        border-color: var(--blue-border);
        background: #fffefa;
    }
    body.workspace-embed .automix-card::after,
    body.workspace-embed .automix-hero {
        background: var(--blue-soft);
        border-color: var(--blue-border);
        box-shadow: none;
    }
    body.workspace-embed .automix-subtitle,
    body.workspace-embed .qc-subtitle,
    body.workspace-embed .qc-check-summary,
    body.workspace-embed .qc-check-detail,
    body.workspace-embed .automix-label,
    body.workspace-embed .automix-scale-labels,
    body.workspace-embed .automix-slider-label {
        color: var(--text-muted);
    }
    body.workspace-embed .automix-number,
    body.workspace-embed .automix-db-number,
    body.workspace-embed .automix-range-number,
    body.workspace-embed .automix-target-number {
        background: #fffefa;
        border-color: var(--border);
        color: var(--text-main);
    }
    body.workspace-embed .automix-process-btn,
    body.workspace-embed .automix-action-btn {
        background: var(--accent);
        border-color: var(--accent);
        color: #fffefa;
        font-weight: 850;
    }
    body.workspace-embed .automix-process-btn:hover:not(:disabled),
    body.workspace-embed .automix-action-btn:hover:not(:disabled) {
        background: var(--blue-hover);
        border-color: var(--blue-hover);
        color: #fffefa;
    }
    body.workspace-embed .automix-process-btn:disabled,
    body.workspace-embed .automix-action-btn:disabled,
    body.workspace-embed .automix-mini-btn:disabled,
    body.workspace-embed button:disabled {
        border-color: var(--border);
        background: #f7f6f1;
        color: #8f887b;
        opacity: 1;
    }
    body.workspace-embed .automix-card-actions .btn-ghost {
        border-color: var(--border);
        background: #fffefa;
        color: var(--text-main);
        font-weight: 800;
    }
    body.workspace-embed .automix-card-actions .btn-ghost:disabled {
        border-color: var(--border);
        background: #f7f6f1;
        color: #8f887b;
        opacity: 1;
    }
    body.workspace-embed .automix-card-actions .btn-ghost:hover:not(:disabled) {
        border-color: var(--blue-border);
        background: var(--blue-soft);
        color: var(--blue-text);
    }
    body.workspace-embed .console-header {
        background: var(--bg-panel);
        border-color: var(--border);
        color: var(--text-muted);
    }
    body.workspace-embed .timeline-tools-dock {
        border-color: rgba(15, 118, 110, .26);
        background: #fffefa;
        box-shadow: 0 14px 34px rgba(34, 28, 15, .16);
    }
    body.workspace-embed .timeline-tools-toggle,
    body.workspace-embed .timeline-tools-dock.collapsed .timeline-tools-toggle,
    body.workspace-embed .timeline-visual-controls .top-visual-toggle,
    body.workspace-embed .region-legend-toggle,
    body.workspace-embed .zoom-btn {
        border-color: var(--border);
        background: #fffefa;
        color: var(--text-muted);
    }
    body.workspace-embed .timeline-tools-toggle:hover,
    body.workspace-embed .timeline-tools-dock.collapsed .timeline-tools-toggle:hover,
    body.workspace-embed .timeline-visual-controls .top-visual-toggle:hover,
    body.workspace-embed .region-legend-toggle:hover,
    body.workspace-embed .region-legend-toggle.active,
    body.workspace-embed .timeline-visual-controls .top-visual-toggle.active,
    body.workspace-embed .timeline-visual-controls .top-visual-toggle[aria-pressed="true"],
    body.workspace-embed .zoom-btn:hover {
        border-color: var(--blue-border);
        background: var(--blue-soft);
        color: var(--blue-text);
    }
    body.workspace-embed .zoom-controls {
        border-left-color: var(--border);
    }
    body.workspace-embed .zoom-icon {
        color: var(--text-muted);
    }
    body.workspace-embed .zoom-slider::-webkit-slider-runnable-track {
        background: linear-gradient(
            90deg,
            var(--blue) 0%,
            var(--blue) var(--slider-progress),
            rgba(214, 207, 191, .85) var(--slider-progress),
            rgba(214, 207, 191, .85) 100%
        );
    }
    body.workspace-embed .zoom-slider::-moz-range-track {
        background: linear-gradient(
            90deg,
            var(--blue) 0%,
            var(--blue) var(--slider-progress),
            rgba(214, 207, 191, .85) var(--slider-progress),
            rgba(214, 207, 191, .85) 100%
        );
    }
    body.workspace-embed .zoom-slider::-webkit-slider-thumb,
    body.workspace-embed .zoom-slider::-moz-range-thumb {
        background: var(--blue);
        box-shadow: 0 1px 5px rgba(34, 28, 15, .18);
    }
    body.workspace-embed .timeline-tools-dock [data-ui-tooltip]::after {
        border-color: rgba(15, 118, 110, .26);
        background: #fffefa;
        color: var(--text-main);
        box-shadow: 0 10px 24px rgba(34, 28, 15, .16);
    }
    body.workspace-embed .timeline-tools-dock [data-ui-tooltip]::before {
        border-color: rgba(15, 118, 110, .26);
        background: #fffefa;
    }
    .pp-artifact {
        display: grid;
        grid-template-columns: 18px 52px minmax(0, 1fr);
        gap: 10px;
        align-items: center;
        border-bottom: 1px solid var(--pp-border);
        background: var(--pp-surface);
        padding: 11px 16px;
        cursor: pointer;
    }
    .pp-artifact-grid .pp-artifact {
        border-right: 1px solid var(--pp-border);
    }
    .pp-artifact.is-selected {
        background: #eef8f6;
    }
    .pp-artifact.is-disabled {
        cursor: default;
        opacity: .68;
    }
    .pp-artifact input {
        accent-color: var(--pp-ink);
    }
    .pp-kind {
        height: 30px;
        border-color: var(--pp-border);
        background: var(--pp-surface-2);
        color: var(--pp-muted);
        font-family: ui-monospace, "SF Mono", Menlo, monospace;
        font-size: 10px;
        font-weight: 800;
    }
    .pp-artifact-copy {
        display: grid;
        gap: 1px;
        min-width: 0;
    }
    .pp-artifact-copy strong,
    .pp-artifact-copy small,
    .pp-artifact-copy em {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .pp-artifact-copy em {
        font-style: normal;
    }
    .pp-artifact-meta {
        display: flex;
        align-items: center;
        gap: 6px;
        min-width: 0;
    }
    .pp-artifact-meta span:last-child {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .pp-panel-action {
        border-top: 1px solid var(--pp-border);
    }
    .pp-panel-action {
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
    }
    .pp-config-panel-body {
        display: grid;
        align-content: start;
        gap: 14px;
        min-height: 0;
        overflow: auto;
        padding: 14px 16px;
    }
    .pp-config-dropdown {
        position: relative;
        display: flex;
        align-items: center;
    }
    .pp-config-dropdown select {
        width: 100%;
        min-height: 36px;
        appearance: none;
        border: 1px solid var(--pp-border-2);
        border-radius: 7px;
        background: var(--pp-surface);
        color: var(--pp-ink);
        font: inherit;
        font-weight: 700;
        outline: none;
        padding: 6px 34px 6px 10px;
    }
    .pp-config-dropdown svg {
        position: absolute;
        right: 10px;
        width: 14px;
        height: 14px;
        color: var(--pp-muted);
        pointer-events: none;
    }
    .pp-remediation-source {
        display: grid;
        gap: 10px;
        border: 1px solid var(--pp-border);
        border-radius: 8px;
        background: var(--pp-surface);
        padding: 12px;
    }
    .pp-remediation-source-head {
        display: grid;
        gap: 2px;
    }
    .pp-remediation-source-head strong {
        font-size: 13px;
    }
    .pp-remediation-source-head span,
    .pp-remediation-empty span {
        color: var(--pp-muted);
        font-size: 11px;
        line-height: 1.35;
    }
    .pp-remediation-picker,
    .pp-remediation-empty,
    .pp-remediation-plan {
        display: grid;
        gap: 8px;
    }
    .pp-remediation-empty {
        border: 1px dashed var(--pp-border-2);
        border-radius: 7px;
        padding: 10px;
    }
    .pp-remediation-metric {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        min-height: 28px;
        border-top: 1px solid var(--pp-border);
        color: var(--pp-muted);
        font-size: 11px;
    }
    .pp-remediation-metric:first-child {
        border-top: 0;
    }
    .pp-remediation-metric em {
        font-style: normal;
    }
    .pp-remediation-metric strong {
        max-width: 58%;
        overflow: hidden;
        color: var(--pp-ink);
        font-size: 12px;
        text-align: right;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .pp-secondary.wide {
        width: 100%;
    }
    .pp-chain {
        display: grid;
        gap: 10px;
    }
    .pp-chain-step {
        border: 1px solid var(--pp-border);
        border-radius: 8px;
        background: var(--pp-surface);
        overflow: hidden;
    }
    .pp-chain-step.is-enabled {
        border-color: color-mix(in srgb, var(--pp-accent), transparent 64%);
    }
    .pp-chain-step.is-disabled .pp-control-list {
        opacity: 0.58;
    }
    .pp-chain-head {
        display: grid;
        grid-template-columns: 26px minmax(0, 1fr);
        gap: 10px;
        align-items: center;
        padding: 11px 12px;
    }
    .pp-chain-head div {
        display: grid;
        min-width: 0;
        gap: 1px;
    }
    .pp-chain-head span {
        color: var(--pp-muted);
        font-size: 11px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .pp-chain-title {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 10px;
        align-items: center;
    }
    .pp-chain-title-copy {
        display: grid;
        min-width: 0;
        gap: 1px;
    }
    .pp-chain-title-copy strong {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .pp-chain-toggle {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        min-height: 24px;
        color: var(--pp-muted);
        font-size: 11px;
        font-weight: 800;
        cursor: pointer;
        user-select: none;
    }
    .pp-chain-toggle input {
        flex: 0 0 auto;
    }
    .pp-chain-index {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 24px;
        height: 24px;
        border-radius: 6px;
        background: var(--pp-surface-2);
        color: var(--pp-ink);
        font-weight: 800;
        font-size: 11px;
    }
    .pp-control-list {
        display: grid;
        border-top: 1px solid var(--pp-border);
    }
    .pp-control-row {
        display: grid;
        grid-template-columns: minmax(96px, 1fr) minmax(0, auto);
        align-items: center;
        gap: 10px;
        border-bottom: 1px solid var(--pp-border);
        padding: 8px 12px;
        color: var(--pp-muted);
        font-size: 12px;
    }
    .pp-control-row:last-child {
        border-bottom: 0;
    }
    .pp-control-row-full {
        grid-template-columns: 1fr;
        align-items: stretch;
    }
    .pp-control-label {
        min-width: 0;
    }
    .pp-control-row.is-slider {
        grid-template-columns: minmax(0, 1fr);
        align-items: stretch;
        gap: 7px;
        padding: 10px 12px 11px;
    }
    .pp-control-row.is-slider .pp-control-label {
        color: var(--pp-muted);
        font-weight: 650;
    }
    .pp-control-value {
        display: inline-flex;
        align-items: baseline;
        gap: 4px;
        color: var(--pp-ink);
        font-family: ui-monospace, "SF Mono", Menlo, monospace;
    }
    .pp-param-input {
        width: 74px;
        min-height: 28px;
        border: 1px solid var(--pp-border-2);
        border-radius: 0;
        background: var(--pp-surface);
        color: var(--pp-ink);
        font: inherit;
        font-family: ui-monospace, "SF Mono", Menlo, monospace;
        font-size: 12px;
        outline: none;
        padding: 3px 5px;
        text-align: right;
    }
    .pp-number-control {
        display: inline-flex;
        align-items: center;
        justify-content: flex-end;
        color: var(--pp-ink);
    }
    .pp-number-control .pp-param-input {
        border-left: 0;
        border-right: 0;
    }
    .pp-number-control.compact .pp-param-input {
        width: 54px;
    }
    .pp-number-step {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 24px;
        height: 28px;
        border: 1px solid var(--pp-border-2);
        background: var(--pp-surface-2);
        color: var(--pp-muted);
        font: inherit;
        font-family: ui-monospace, "SF Mono", Menlo, monospace;
        font-size: 13px;
        font-weight: 800;
        line-height: 1;
        cursor: pointer;
    }
    .pp-number-step:first-child {
        border-radius: 6px 0 0 6px;
    }
    .pp-number-step:nth-last-child(2),
    .pp-number-step:last-child {
        border-radius: 0 6px 6px 0;
    }
    .pp-number-step:hover {
        background: var(--pp-surface);
        color: var(--pp-ink);
    }
    .pp-control-row.is-slider.is-slider-dragging .pp-number-step,
    .pp-control-row.is-slider.is-slider-dragging .pp-number-step:hover {
        background: var(--pp-surface-2);
        color: var(--pp-muted);
        pointer-events: none;
    }
    .pp-number-step:disabled,
    .pp-param-input:disabled,
    .pp-param-check:disabled {
        cursor: not-allowed;
        opacity: 0.45;
    }
    .pp-number-control em {
        margin-left: 4px;
        color: var(--pp-muted);
        font-style: normal;
        font-size: 10px;
    }
    .pp-slider-control,
    .pp-dual-slider-control {
        display: grid;
        gap: 7px;
        min-width: 0;
        width: 100%;
    }
    .pp-slider-readout {
        display: flex;
        justify-content: flex-end;
        min-width: 0;
    }
    .pp-slider-input {
        width: 100%;
        min-width: 0;
        height: 18px;
        margin: 0;
        border: 0;
        border-radius: 999px;
        background: transparent;
        cursor: pointer;
        appearance: none;
        -webkit-appearance: none;
    }
    .pp-slider-input:disabled {
        cursor: not-allowed;
        opacity: 0.45;
    }
    .pp-slider-input::-webkit-slider-runnable-track {
        height: 4px;
        border-radius: 999px;
        background: linear-gradient(
            to right,
            color-mix(in srgb, var(--pp-accent), white 10%) 0%,
            color-mix(in srgb, var(--pp-accent), white 10%) var(--pp-slider-value, 0%),
            var(--pp-border-2) var(--pp-slider-value, 0%),
            var(--pp-border-2) 100%
        );
    }
    .pp-slider-input::-moz-range-track {
        height: 4px;
        border-radius: 999px;
        background: linear-gradient(
            to right,
            color-mix(in srgb, var(--pp-accent), white 10%) 0%,
            color-mix(in srgb, var(--pp-accent), white 10%) var(--pp-slider-value, 0%),
            var(--pp-border-2) var(--pp-slider-value, 0%),
            var(--pp-border-2) 100%
        );
    }
    .pp-slider-input::-webkit-slider-thumb {
        width: 14px;
        height: 14px;
        margin-top: -5px;
        border: 2px solid var(--pp-surface);
        border-radius: 50%;
        background: var(--pp-accent);
        box-shadow: 0 1px 4px rgba(20, 18, 14, 0.18);
        appearance: none;
        -webkit-appearance: none;
    }
    .pp-slider-input::-moz-range-thumb {
        width: 14px;
        height: 14px;
        border: 2px solid var(--pp-surface);
        border-radius: 50%;
        background: var(--pp-accent);
        box-shadow: 0 1px 4px rgba(20, 18, 14, 0.18);
    }
    .pp-slider-input:focus-visible {
        outline: 2px solid color-mix(in srgb, var(--pp-accent), transparent 28%);
        outline-offset: 4px;
    }
    .pp-slider-scale {
        display: flex;
        justify-content: space-between;
        color: var(--pp-muted);
        font-family: ui-monospace, "SF Mono", Menlo, monospace;
        font-size: 10px;
        line-height: 1;
    }
    .pp-range-readouts {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }
    .pp-range-value-field {
        display: grid;
        align-items: start;
        justify-items: start;
        gap: 4px;
        min-width: 0;
        color: var(--pp-muted);
        font-size: 10px;
        font-weight: 800;
        text-transform: uppercase;
    }
    .pp-range-value-field:nth-child(2) {
        justify-items: end;
    }
    .pp-dual-slider-wrap {
        position: relative;
        display: block;
        height: 22px;
    }
    .pp-dual-slider-track,
    .pp-dual-slider-fill {
        position: absolute;
        top: 50%;
        height: 4px;
        transform: translateY(-50%);
        border-radius: 999px;
        pointer-events: none;
    }
    .pp-dual-slider-track {
        left: 0;
        right: 0;
        background: var(--pp-border-2);
        z-index: 0;
    }
    .pp-dual-slider-fill {
        left: var(--pp-range-start, 0%);
        right: calc(100% - var(--pp-range-end, 100%));
        background: color-mix(in srgb, var(--pp-accent), white 10%);
        z-index: 1;
    }
    .pp-dual-range {
        position: absolute;
        inset: 0;
        height: 22px;
        background: transparent;
        pointer-events: none;
        z-index: 2;
    }
    .pp-dual-range::-webkit-slider-runnable-track {
        height: 4px;
        border: 0;
        background: transparent;
    }
    .pp-dual-range::-moz-range-track {
        height: 4px;
        border: 0;
        background: transparent;
    }
    .pp-dual-range::-moz-range-progress {
        background: transparent;
    }
    .pp-dual-range::-webkit-slider-thumb {
        pointer-events: auto;
    }
    .pp-dual-range::-moz-range-thumb {
        pointer-events: auto;
    }
    .pp-dual-range.is-upper {
        z-index: 3;
    }
    .pp-dual-range.is-lower {
        z-index: 3;
    }
    .pp-dual-range:focus,
    .pp-dual-range:hover {
        z-index: 4;
    }
    select.pp-param-input {
        width: min(190px, 100%);
        border-radius: 6px;
        text-align: left;
    }
    .pp-category-list {
        display: grid;
        gap: 8px;
        min-width: 0;
        width: 100%;
    }
    .pp-category-list.empty {
        color: var(--pp-muted);
        font-size: 11px;
    }
    .pp-category-list-summary {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        color: var(--pp-muted);
        font-size: 11px;
    }
    .pp-category-list-summary strong {
        color: var(--pp-ink);
        font-size: 12px;
    }
    .pp-category-items {
        display: grid;
        gap: 6px;
        max-height: 340px;
        overflow: auto;
        padding-right: 2px;
    }
    .pp-category-item {
        display: grid;
        grid-template-columns: 16px 42px minmax(0, 1fr) auto;
        align-items: start;
        gap: 8px;
        border: 1px solid var(--pp-border);
        border-radius: 7px;
        background: var(--pp-surface);
        color: var(--pp-muted);
        padding: 8px;
    }
    .pp-category-item.is-enabled {
        border-color: color-mix(in srgb, var(--pp-team, #7a8d84) 36%, var(--pp-border));
    }
    .pp-category-code {
        color: var(--pp-ink);
        font-family: ui-monospace, "SF Mono", Menlo, monospace;
        font-size: 11px;
        font-weight: 800;
    }
    .pp-category-copy {
        display: grid;
        gap: 2px;
        min-width: 0;
    }
    .pp-category-copy strong {
        color: var(--pp-ink);
        font-size: 12px;
        line-height: 1.25;
    }
    .pp-category-copy small {
        display: -webkit-box;
        overflow: hidden;
        color: var(--pp-muted);
        font-size: 11px;
        line-height: 1.25;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }
    .pp-category-item em {
        color: var(--pp-muted);
        font-style: normal;
        font-size: 10px;
        font-weight: 800;
        text-transform: uppercase;
    }
    .pp-param-check {
        width: 16px;
        height: 16px;
        accent-color: var(--pp-ink);
    }
    .pp-range-control {
        display: grid;
        justify-items: end;
        gap: 6px;
        color: var(--pp-ink);
    }
    .pp-range-field {
        display: inline-flex;
        align-items: center;
        justify-content: flex-end;
        gap: 6px;
        color: var(--pp-muted);
        font-size: 10px;
        font-weight: 700;
        text-transform: uppercase;
    }
    .pp-range-control em {
        color: var(--pp-muted);
        font-style: normal;
        font-size: 10px;
    }
    .pp-control-value em {
        color: var(--pp-muted);
        font-style: normal;
        font-size: 10px;
    }
    .pp-loading,
    .pp-error,
    .pp-empty-state {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 14px;
        height: 100%;
        padding: 24px;
        text-align: left;
    }
    .pp-error,
    .pp-empty-state {
        flex-direction: column;
        text-align: center;
    }
    .pp-loading-title {
        font-size: 16px;
        font-weight: 750;
    }
    .pp-error h1,
    .pp-empty-state h1 {
        margin: 0;
        font-size: 22px;
    }
    .pp-error p,
    .pp-empty-state p {
        max-width: 440px;
        margin: 0 0 8px;
        color: var(--pp-muted);
    }
    .pp-modal-backdrop {
        position: fixed;
        inset: 0;
        z-index: 80;
        display: flex;
        align-items: center;
        justify-content: center;
        background: rgba(23, 22, 20, .28);
        padding: 24px;
    }
    .pp-modal {
        width: min(420px, 100%);
        border: 1px solid var(--pp-border);
        border-radius: 8px;
        background: var(--pp-surface);
        box-shadow: 0 18px 60px rgba(23, 22, 20, .18);
    }
    .pp-modal-head,
    .pp-modal-actions {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        padding: 14px 16px;
    }
    .pp-modal-head {
        border-bottom: 1px solid var(--pp-border);
    }
    .pp-modal-field {
        display: grid;
        gap: 7px;
        padding: 16px;
    }
    .pp-modal-note,
    .pp-modal-status {
        margin: 0;
        padding: 12px 16px 0;
        color: var(--pp-muted);
        font-size: 12px;
        line-height: 1.35;
    }
    .pp-modal-status {
        color: var(--pp-danger);
    }
    .pp-modal-field span {
        color: var(--pp-muted);
        font-size: 11px;
        font-weight: 800;
        letter-spacing: .05em;
        text-transform: uppercase;
    }
    .pp-modal-field input {
        width: 100%;
        min-height: 36px;
        border: 1px solid var(--pp-border-2);
        border-radius: 7px;
        background: var(--pp-surface);
        color: var(--pp-ink);
        outline: none;
        padding: 6px 10px;
    }
    .pp-modal-actions {
        justify-content: flex-end;
        border-top: 1px solid var(--pp-border);
    }
    .pp-artifacts-page {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 348px;
        gap: 0;
        min-height: 0;
        overflow: hidden;
        padding: 0;
    }
    .pp-artifacts-main {
        display: grid;
        grid-template-rows: auto auto auto minmax(0, 1fr);
        gap: 14px;
        min-width: 0;
        min-height: 0;
        padding: 18px 24px;
        overflow: hidden;
    }
    .pp-artifact-controls {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        min-width: 0;
    }
    .pp-artifact-search {
        flex: 1 1 190px;
        max-width: 260px;
    }
    .pp-artifact-view-toolbar {
        display: inline-flex;
        align-items: center;
        flex: 0 0 auto;
        gap: 4px;
        border: 1px solid var(--pp-border);
        border-radius: 8px;
        background: var(--pp-surface);
        padding: 3px;
    }
    .pp-artifact-view-button {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        min-height: 30px;
        border: 0;
        border-radius: 6px;
        background: transparent;
        color: var(--pp-muted);
        padding: 5px 9px;
        font: inherit;
        font-size: 12px;
        font-weight: 750;
        cursor: pointer;
    }
    .pp-artifact-view-button svg {
        width: 15px;
        height: 15px;
    }
    .pp-artifact-view-button:hover {
        background: var(--pp-surface-2);
        color: var(--pp-ink);
    }
    .pp-artifact-view-button.is-active {
        background: var(--pp-ink);
        color: var(--pp-surface);
    }
    .pp-artifacts-table {
        display: grid;
        grid-auto-rows: min-content;
        align-self: stretch;
        min-height: 0;
        overflow: auto;
        border: 1px solid var(--pp-border);
        border-radius: 8px;
        background: var(--pp-surface);
    }
    .pp-artifact-table-head,
    .pp-artifact-table-row {
        display: grid;
        gap: 8px;
        align-items: center;
        min-width: 650px;
    }
    .pp-artifacts-table.is-file-browser .pp-artifact-table-head,
    .pp-artifacts-table.is-file-browser .pp-artifact-file-row {
        min-width: 720px;
    }
    .pp-artifact-table-head {
        position: sticky;
        top: 0;
        z-index: 1;
        border-bottom: 1px solid var(--pp-border);
        background: var(--pp-bg);
        color: var(--pp-muted);
        padding: 10px 18px;
        font-size: 10px;
        font-weight: 800;
        letter-spacing: .06em;
        text-transform: uppercase;
    }
    .pp-artifact-group {
        display: flex;
        align-items: center;
        gap: 8px;
        min-width: 650px;
        min-height: 38px;
        border: 0;
        border-bottom: 1px solid var(--pp-border);
        background: #f7f5ef;
        color: var(--pp-ink);
        padding: 8px 18px;
        text-align: left;
        cursor: pointer;
    }
    .pp-artifact-group:hover {
        background: var(--pp-surface-2);
    }
    .pp-artifact-group strong {
        font-size: 12px;
        font-weight: 800;
        letter-spacing: .04em;
        text-transform: uppercase;
    }
    .pp-artifact-group span:last-child {
        color: var(--pp-muted);
        font-size: 11px;
        font-weight: 700;
    }
    .pp-artifact-group-icon {
        display: inline-flex;
        color: var(--pp-muted);
        transition: transform .14s ease;
    }
    .pp-artifact-group.is-collapsed .pp-artifact-group-icon {
        transform: rotate(-90deg);
    }
    .pp-artifact-file-row {
        display: grid;
        gap: 8px;
        align-items: center;
        width: 100%;
        min-height: 40px;
        border: 0;
        border-bottom: 1px solid var(--pp-border);
        background: var(--pp-surface);
        color: var(--pp-ink);
        padding: 7px 18px;
        text-align: left;
        cursor: pointer;
    }
    .pp-artifact-file-row:last-child {
        border-bottom: 0;
    }
    .pp-artifact-file-row:hover,
    .pp-artifact-file-row.is-active {
        background: #fbfaf7;
    }
    .pp-artifacts-table.is-file-browser .pp-artifact-file-row.is-active {
        background: #e6f6f2;
        box-shadow:
            inset 3px 0 0 var(--pp-accent),
            inset 0 0 0 1px rgba(15, 118, 110, .22);
    }
    .pp-artifacts-table.is-file-browser .pp-artifact-file-row.is-active:hover {
        background: #dff3ee;
    }
    .pp-artifact-file-row.is-folder {
        font-weight: 500;
    }
    .pp-artifact-file-name {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        min-width: 0;
    }
    .pp-artifact-file-name strong {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-weight: 500;
    }
    .pp-artifact-file-indent {
        flex: 0 0 calc(var(--pp-file-depth, 0) * 22px);
        width: calc(var(--pp-file-depth, 0) * 22px);
    }
    .pp-artifact-file-disclosure,
    .pp-artifact-file-icon {
        display: inline-flex;
        flex: 0 0 auto;
        color: var(--pp-muted);
    }
    .pp-artifact-file-disclosure {
        width: 14px;
        transition: transform .14s ease;
    }
    .pp-artifact-file-row.is-collapsed .pp-artifact-file-disclosure {
        transform: rotate(-90deg);
    }
    .pp-artifact-file-row.is-file .pp-artifact-file-disclosure {
        visibility: hidden;
    }
    .pp-artifact-file-icon svg {
        width: 17px;
        height: 17px;
    }
    .pp-artifact-file-row .muted {
        color: var(--pp-muted);
    }
    .pp-artifact-table-row {
        width: 100%;
        min-height: 58px;
        border: 0;
        border-bottom: 1px solid var(--pp-border);
        background: var(--pp-surface);
        color: var(--pp-ink);
        padding: 10px 18px;
        text-align: left;
        cursor: pointer;
    }
    .pp-artifacts-table.is-file-browser .pp-artifact-file-row {
        min-height: 40px;
        padding: 7px 18px;
    }
    .pp-artifact-table-row:last-child {
        border-bottom: 0;
    }
    .pp-artifact-table-row:hover,
    .pp-artifact-table-row.is-active {
        background: #fbfaf7;
    }
    .pp-artifact-table-row.is-active {
        background: #e6f6f2;
        box-shadow:
            inset 3px 0 0 var(--pp-accent),
            inset 0 0 0 1px rgba(15, 118, 110, .22);
    }
    .pp-artifact-table-row.is-active:hover {
        background: #dff3ee;
    }
    .pp-artifact-table-row.is-highlighted,
    .pp-artifact-file-row.is-highlighted {
        background: #dff8f2;
        box-shadow:
            inset 3px 0 0 var(--pp-accent),
            inset 0 0 0 1px rgba(15, 118, 110, .30),
            0 0 0 3px rgba(15, 118, 110, .10);
        animation: pp-artifact-row-highlight 6.5s ease-out both;
    }
    @keyframes pp-artifact-row-highlight {
        0% {
            background: #dff8f2;
            box-shadow:
                inset 3px 0 0 var(--pp-accent),
                inset 0 0 0 1px rgba(15, 118, 110, .36),
                0 0 0 0 rgba(15, 118, 110, .22);
        }
        14% {
            background: #c9f2e8;
            box-shadow:
                inset 3px 0 0 var(--pp-accent),
                inset 0 0 0 1px rgba(15, 118, 110, .44),
                0 0 0 6px rgba(15, 118, 110, .16);
        }
        30% {
            background: #e7fbf6;
            box-shadow:
                inset 3px 0 0 var(--pp-accent),
                inset 0 0 0 1px rgba(15, 118, 110, .30),
                0 0 0 2px rgba(15, 118, 110, .10);
        }
        46% {
            background: #cef4eb;
            box-shadow:
                inset 3px 0 0 var(--pp-accent),
                inset 0 0 0 1px rgba(15, 118, 110, .40),
                0 0 0 5px rgba(15, 118, 110, .14);
        }
        68% {
            background: #effcf8;
            box-shadow:
                inset 3px 0 0 var(--pp-accent),
                inset 0 0 0 1px rgba(15, 118, 110, .24),
                0 0 0 2px rgba(15, 118, 110, .07);
        }
        100% {
            background: #fbfaf7;
            box-shadow:
                inset 3px 0 0 var(--pp-accent),
                inset 0 0 0 1px rgba(15, 118, 110, .10),
                0 0 0 0 rgba(15, 118, 110, 0);
        }
    }
    .pp-artifact-table-cell {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .pp-artifacts-panel {
        grid-template-rows: auto minmax(0, 1fr);
    }
    .pp-admin-page {
        display: grid;
        grid-template-rows: auto auto minmax(0, 1fr);
        gap: 14px;
        min-height: 0;
        overflow: hidden;
        padding: 18px 24px;
    }
    .pp-admin-stats {
        grid-template-columns: repeat(4, minmax(120px, 1fr));
    }
    .pp-admin-table {
        display: grid;
        grid-auto-rows: min-content;
        min-height: 0;
        overflow: auto;
        border: 1px solid var(--pp-border);
        border-radius: 8px;
        background: var(--pp-surface);
    }
    .pp-admin-head,
    .pp-admin-row {
        display: grid;
        grid-template-columns: minmax(150px, 1.2fr) minmax(180px, 1.6fr) minmax(120px, 1fr) minmax(110px, .8fr);
        gap: 12px;
        align-items: center;
        min-width: 640px;
    }
    .pp-admin-head {
        position: sticky;
        top: 0;
        z-index: 1;
        border-bottom: 1px solid var(--pp-border);
        background: var(--pp-bg);
        color: var(--pp-muted);
        padding: 10px 18px;
        font-size: 10px;
        font-weight: 800;
        letter-spacing: .06em;
        text-transform: uppercase;
    }
    .pp-admin-row {
        min-height: 54px;
        border-bottom: 1px solid var(--pp-border);
        padding: 10px 18px;
    }
    .pp-admin-row:last-child {
        border-bottom: 0;
    }
    .pp-admin-row span {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .pp-config-card-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
        align-content: start;
        gap: 10px;
        min-height: 0;
        overflow: auto;
    }
    .pp-config-card {
        display: grid;
        gap: 12px;
        border: 1px solid var(--pp-border);
        border-radius: 8px;
        background: var(--pp-surface);
        padding: 14px;
    }
    .pp-config-card.is-default {
        background: #fbfaf7;
    }
    .pp-config-card-head {
        display: grid;
        grid-template-columns: 28px minmax(0, 1fr) auto;
        gap: 10px;
        align-items: start;
    }
    .pp-config-card-head div {
        display: grid;
        gap: 2px;
        min-width: 0;
    }
    .pp-config-card-head strong,
    .pp-config-card-head span,
    .pp-config-card-meta strong {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .pp-config-card-head span,
    .pp-config-card-meta span {
        color: var(--pp-muted);
        font-size: 11px;
    }
    .pp-config-card-head em {
        border: 1px solid var(--pp-border);
        border-radius: 999px;
        color: var(--pp-muted);
        font-size: 10px;
        font-style: normal;
        font-weight: 800;
        padding: 2px 7px;
        text-transform: uppercase;
    }
    .pp-config-card-meta {
        display: grid;
        gap: 7px;
        border-top: 1px solid var(--pp-border);
        padding-top: 10px;
    }
    .pp-config-card-meta div {
        display: grid;
        grid-template-columns: 72px minmax(0, 1fr);
        gap: 10px;
        align-items: center;
    }
    .pp-config-card-meta strong {
        font-size: 12px;
    }
    .pp-settings-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(220px, 1fr));
        gap: 14px;
        align-content: start;
        min-height: 0;
        overflow: auto;
    }
    .pp-settings-section {
        display: grid;
        gap: 10px;
        align-content: start;
        border: 1px solid var(--pp-border);
        border-radius: 8px;
        background: var(--pp-surface);
        padding: 14px;
    }
    .pp-source-list {
        display: grid;
        gap: 8px;
    }
    .pp-source-card {
        display: grid;
        grid-template-columns: 34px minmax(0, 1fr);
        gap: 10px;
        align-items: center;
        min-height: 58px;
        border: 1px solid var(--pp-border);
        border-radius: 8px;
        background: var(--pp-surface);
        color: var(--pp-ink);
        padding: 10px;
        text-align: left;
        cursor: pointer;
    }
    .pp-source-card:hover {
        border-color: var(--pp-border-2);
        background: #fbfaf7;
    }
    .pp-source-card.is-active {
        border-color: var(--pp-ink);
        background: #fff;
    }
    .pp-source-card:disabled,
    .pp-source-card.is-disabled {
        opacity: .45;
        cursor: not-allowed;
    }
    .pp-source-card:disabled:hover,
    .pp-source-card.is-disabled:hover {
        border-color: var(--pp-border);
        background: var(--pp-surface);
    }
    .pp-source-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 32px;
        height: 32px;
        border-radius: 7px;
        background: var(--pp-surface-2);
        color: var(--pp-muted);
    }
    .pp-source-copy {
        display: grid;
        min-width: 0;
        gap: 1px;
    }
    .pp-source-copy small {
        color: var(--pp-muted);
        font-size: 11px;
        line-height: 1.25;
    }
    .pp-local-intake {
        display: grid;
        gap: 10px;
        border: 1px solid var(--pp-border);
        border-radius: 8px;
        background: var(--pp-surface);
        padding: 12px;
    }
    .pp-project-panel-description {
        margin: 0;
        color: var(--pp-muted);
        font-size: 12px;
        line-height: 1.35;
    }
    .pp-project-meta-list {
        display: grid;
        border-top: 1px solid var(--pp-border);
        border-bottom: 1px solid var(--pp-border);
    }
    .pp-project-meta-list div {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(96px, auto);
        gap: 10px;
        padding: 8px 0;
    }
    .pp-project-meta-list div + div {
        border-top: 1px solid var(--pp-border);
    }
    .pp-project-meta-list span {
        color: var(--pp-muted);
        font-size: 11px;
    }
    .pp-project-meta-list strong {
        min-width: 0;
        overflow: hidden;
        text-align: right;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 12px;
    }
    .pp-modal-field.compact {
        padding: 0;
    }
    .pp-local-actions {
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
    }
    .pp-local-actions .pp-secondary {
        justify-content: center;
    }
    .pp-intake-status {
        margin: 0;
        color: var(--pp-muted);
        font-size: 11px;
        line-height: 1.35;
    }
    .pp-artifact-details {
        display: grid;
        gap: 10px;
        border: 1px solid var(--pp-border);
        border-radius: 8px;
        background: var(--pp-surface);
        padding: 12px;
    }
    .pp-artifact-detail-head {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 10px;
        align-items: start;
    }
    .pp-artifact-detail-title {
        display: grid;
        gap: 2px;
        min-width: 0;
    }
    .pp-artifact-detail-title strong,
    .pp-artifact-detail-title small {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .pp-artifact-detail-title small,
    .pp-artifact-description {
        color: var(--pp-muted);
        font-size: 11px;
        line-height: 1.35;
    }
    .pp-artifact-description {
        margin: 0;
    }
    .pp-artifact-preview {
        overflow: hidden;
        border: 1px solid var(--pp-border);
        border-radius: 8px;
        background: #111;
        aspect-ratio: 16 / 9;
    }
    .pp-artifact-preview video {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: contain;
        background: #111;
    }
    .pp-artifact-actions {
        display: grid;
    }
    .pp-download-link {
        text-decoration: none;
    }
    .pp-detail-list {
        display: grid;
    }
    .pp-detail-row {
        display: grid;
        grid-template-columns: 92px minmax(0, 1fr);
        gap: 10px;
        border-top: 1px solid var(--pp-border);
        padding: 8px 0;
    }
    .pp-detail-row span {
        color: var(--pp-muted);
        font-size: 11px;
        font-weight: 700;
    }
    .pp-detail-row strong {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-family: ui-monospace, "SF Mono", Menlo, monospace;
        font-size: 11px;
    }

    @media (max-width: 980px) {
        .pp-dashboard-page,
        .pp-projects-page {
            grid-template-columns: 1fr;
        }
        .pp-workflow {
            grid-template-columns: 1fr;
            overflow: auto;
        }
        .pp-file-run {
            grid-template-columns: 1fr;
        }
        .pp-file-run-actions {
            grid-column: 1;
            grid-row: auto;
            justify-content: flex-start;
            padding-left: 18px;
        }
        .pp-file-run-meta,
        .pp-file-run-meta .chips {
            justify-content: flex-start;
        }
        .pp-run-panel {
            min-height: 420px;
            border-left: 0;
            border-top: 1px solid var(--pp-border);
        }
    }

    @media (max-width: 720px) {
        .pp-main {
            padding-top: 0;
        }
        .pp-topbar {
            flex-wrap: wrap;
        }
        .pp-search {
            order: 3;
            width: 100%;
            min-width: 0;
            margin-left: 0;
        }
        .pp-stat-grid {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }
        .pp-page-head {
            align-items: flex-start;
            flex-direction: column;
            padding-right: 0;
        }
        .pp-tabs {
            padding-right: 22px;
        }
        .pp-pills {
            margin-left: 0;
        }
        .pp-run-files-card .pp-section-head {
            align-items: flex-start;
            flex-direction: column;
        }
        .pp-run-files-card .pp-section-head .pp-workflow-filter-bar {
            justify-content: flex-start;
            width: 100%;
        }
        .pp-workflow-filter-search {
            width: 100%;
            min-width: 0;
        }
        .pp-section-head .pp-workflow-filter-chips {
            max-width: 100%;
            overflow-x: auto;
        }
        .pp-run-file-head {
            grid-template-columns: 24px 18px minmax(0, 1fr);
        }
        .pp-run-file-executed {
            margin: -4px 16px 14px 42px;
        }
        .pp-run-file-head .pp-kind {
            grid-column: 3;
            justify-self: start;
        }
        .pp-run-file-head .pp-artifact-copy {
            grid-column: 1 / -1;
        }
        .pp-run-file-open,
        .pp-actions-menu {
            grid-column: 3;
            justify-self: start;
        }
        .pp-file-run {
            grid-template-columns: minmax(0, 1fr);
        }
        .pp-file-run-actions {
            grid-column: 1;
            justify-content: flex-start;
        }
    }