.copilot-draft[data-v-8642c87e] {
        /* Fill the assistant column (up to the 90% gutter) so the YAML preview uses the available
           width instead of shrinking to its longest line. */
        width: 100%;
        max-width: 90%;
        border: 1px solid var(--ks-border-subtle);
        border-radius: var(--ks-radius-lg);
        overflow: hidden;
        background: var(--ks-bg-base);
}
.copilot-draft-header[data-v-8642c87e] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: var(--ks-spacing-2);
        padding: var(--ks-spacing-2) var(--ks-spacing-3);
        background: var(--ks-bg-elevated);
}
.copilot-draft-title[data-v-8642c87e] {
        display: flex;
        align-items: center;
        gap: var(--ks-spacing-1);
        font-size: var(--ks-font-size-sm);
}
.copilot-draft-constraints[data-v-8642c87e] {
        margin: var(--ks-spacing-2) var(--ks-spacing-3) 0;
}

    /* Constrain + scroll the highlighted block; KsMarkdown styles the code itself. */
.copilot-draft-yaml[data-v-8642c87e] {
        margin: 0;
        max-height: 18rem;
        overflow: auto;
        padding: var(--ks-spacing-3);
        font-size: var(--ks-font-size-sm);
}
.copilot-draft-footer[data-v-8642c87e] {
        display: flex;
        justify-content: flex-end;
        gap: var(--ks-spacing-2);
        padding: var(--ks-spacing-2) var(--ks-spacing-3);
        background: var(--ks-bg-elevated);
}

.proposed-action[data-v-f6fa70c5] {
        border: 1px solid var(--ks-border-default);
        border-radius: var(--ks-radius-lg);
        /* Darker body; header/footer bands sit a shade lighter on top (Figma). */
        background: var(--ks-bg-base);
        /* Clip the tinted header/footer bands to the rounded corners. */
        overflow: hidden;
}

    /* Header + footer share the lighter elevated fill; body stays on the darker base. */
.proposed-action-header[data-v-f6fa70c5] {
        display: flex;
        align-items: center;
        gap: var(--ks-spacing-2);
        padding: var(--ks-spacing-3) var(--ks-spacing-4);
        background: var(--ks-bg-elevated);
        border-bottom: 1px solid var(--ks-border-subtle);
}

    /* Card copy sits one step up from the transcript's xs, at sm (12px). */
.proposed-action-title[data-v-f6fa70c5],
    .proposed-action-status[data-v-f6fa70c5],
    .proposed-action-summary[data-v-f6fa70c5],
    .proposed-step-title[data-v-f6fa70c5] {
        font-size: var(--ks-font-size-sm);
}
.proposed-action-title[data-v-f6fa70c5] {
        font-weight: 600;
}
.proposed-action-status[data-v-f6fa70c5] {
        margin-left: auto;
        --kel-text-color: var(--ks-text-secondary);
}
.proposed-action-body[data-v-f6fa70c5] {
        padding: var(--ks-spacing-3) var(--ks-spacing-4);
        background: var(--ks-bg-base);
}
.proposed-action-summary[data-v-f6fa70c5] {
        display: block;
        white-space: pre-line;
        --kel-text-color: var(--ks-text-secondary);
}
.proposed-action-args[data-v-f6fa70c5] {
        margin: var(--ks-spacing-2) 0 0;
        display: flex;
        flex-direction: column;
        gap: var(--ks-spacing-1);
}
.proposed-action-arg[data-v-f6fa70c5] {
        display: flex;
        gap: var(--ks-spacing-2);
        font-size: var(--ks-font-size-xs);
}
.proposed-action-arg-key[data-v-f6fa70c5] {
        flex: 0 0 auto;
        min-width: 5rem;
        color: var(--ks-text-secondary);
}
.proposed-action-arg-value[data-v-f6fa70c5] {
        margin: 0;
        min-width: 0;
        font-family: var(--ks-font-family-mono);
        color: var(--ks-text-primary);
        word-break: break-word;
}
.proposed-action-steps[data-v-f6fa70c5] {
        display: flex;
        flex-direction: column;
        margin: 0;
        padding: 0;
        list-style: none;
}
.proposed-step[data-v-f6fa70c5] {
        display: flex;
        gap: var(--ks-spacing-3);
        padding: var(--ks-spacing-3) 0;
}
.proposed-step + .proposed-step[data-v-f6fa70c5] {
        border-top: 1px solid var(--ks-border-subtle);
}
.proposed-step-number[data-v-f6fa70c5] {
        flex-shrink: 0;
        width: var(--ks-spacing-5);
        height: var(--ks-spacing-5);
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        background: var(--ks-bg-tag);
        color: var(--ks-text-secondary);
}
.proposed-step-body[data-v-f6fa70c5] {
        display: flex;
        flex-direction: column;
        gap: var(--ks-spacing-1);
}
.proposed-step-detail[data-v-f6fa70c5] {
        font-family: monospace;
        color: var(--ks-text-muted);
        word-break: break-word;
}
.proposed-action-footer[data-v-f6fa70c5] {
        display: flex;
        align-items: center;
        /* Both actions on the right (Figma). */
        justify-content: flex-end;
        gap: var(--ks-spacing-2);
        padding: var(--ks-spacing-3) var(--ks-spacing-4);
        background: var(--ks-bg-elevated);
        border-top: 1px solid var(--ks-border-subtle);
}

    /* Footer buttons come down from the 14px default to sm (12px) so they sit closer to the copy. */
.proposed-action-btn[data-v-f6fa70c5] {
        font-size: var(--ks-font-size-sm);
}

    /* "Reply to revise" reads as a subdued secondary link next to the primary action. */
.proposed-action-reject[data-v-f6fa70c5] {
        --ks-button-text-color: var(--ks-text-secondary);
        color: var(--ks-text-secondary);
}

.copilot-msg[data-v-41d1b703] {
        margin-bottom: var(--ks-spacing-3);
}
.copilot-msg-user[data-v-41d1b703] {
        display: flex;
        justify-content: flex-end;
}
.copilot-msg-assistant[data-v-41d1b703] {
        display: flex;
        justify-content: flex-start;
}
.copilot-msg-cancelled[data-v-41d1b703] {
        display: flex;
        justify-content: center;
}
.copilot-cancelled-label[data-v-41d1b703] {
        --kel-text-color: var(--ks-text-muted);
        font-style: italic;
}
.copilot-bubble-user[data-v-41d1b703] {
        max-width: 85%;
        padding: var(--ks-spacing-2) var(--ks-spacing-3);
        border-radius: var(--ks-radius-lg);
        background: var(--ks-bg-elevated);
}

    /* Assistant replies get their own left-aligned bubble (surface fill) so they read as
       styled responses rather than plain text. */
.copilot-bubble-assistant[data-v-41d1b703] {
        max-width: 90%;
        padding: var(--ks-spacing-2) var(--ks-spacing-3);
        border-radius: var(--ks-radius-lg);
        background: var(--ks-bg-surface);
        border: 1px solid var(--ks-border-subtle);
        /* Copilot body copy sits at sm (12px), matching user bubbles / tool strip / plan card.
           .ks-markdown sets no font-size of its own, so this cascades into its paragraphs,
           list items and inline code — keeping every message the same base size. */
        font-size: var(--ks-font-size-sm);
        line-height: 1.5;
}
.copilot-tool-args[data-v-41d1b703] {
        margin: 0;
        font-family: monospace;
        white-space: pre-wrap;
        word-break: break-word;
        color: var(--ks-text-secondary);
}

    /* Body copy (user bubble) and the tool strip sit at sm (12px), uniform with the rest. */
.copilot-bubble-text[data-v-41d1b703],
    .copilot-tool-label[data-v-41d1b703] {
        font-size: var(--ks-font-size-sm);
}

    /* Tool call header + tool result share one subdued treatment (secondary),
       so the whole "tool activity" strip reads uniformly. Status is carried by the icon. */
.copilot-tool-label[data-v-41d1b703] {
        --kel-text-color: var(--ks-text-secondary);
}
.copilot-tool-result-row[data-v-41d1b703] {
        display: flex;
        align-items: center;
        gap: var(--ks-spacing-1);
}
.copilot-tool-result-icon.is-ok[data-v-41d1b703] {
        color: var(--ks-text-success);
}
.copilot-tool-result-icon.is-error[data-v-41d1b703] {
        color: var(--ks-text-error);
}

.copilot-composer[data-v-53f310a2] {
        display: flex;
        flex-direction: column;
        width: 100%;
        gap: var(--ks-spacing-3);
        padding: var(--ks-spacing-4);
        border: 1px solid var(--ks-border-strong);
        border-radius: var(--ks-