:root {
    --ssol-ink: #17212b;
    --ssol-ink-soft: #354351;
    --ssol-muted: #6b7785;
    --ssol-faint: #919aa5;
    --ssol-line: #dbe2e8;
    --ssol-line-strong: #c7d1da;
    --ssol-canvas: #eef2f4;
    --ssol-panel: #f7f9fa;
    --ssol-paper: #ffffff;
    --ssol-accent: #2c92a2;
    --ssol-accent-strong: #1c7482;
    --ssol-accent-soft: #e1f2f4;
    --ssol-success: #277a55;
    --ssol-success-soft: #e4f2ea;
    --ssol-warning: #a66b12;
    --ssol-danger: #a33c44;
    --ssol-focus: #0d6774;
    --ssol-shadow: 0 12px 34px rgba(23, 33, 43, 0.10);
}

body.cl-ssol-light-page,
body.cl-ssol-light-page #page,
body.cl-ssol-light-page .site-content,
body.cl-ssol-light-page .content-area,
body.cl-ssol-light-page .site-main,
body.cl-ssol-light-page .entry-content {
    background: #f4f6f7 !important;
    color: var(--ssol-ink) !important;
    color-scheme: light;
}

.cl-ssol-page,
.cl-ssol-page * {
    box-sizing: border-box;
    color-scheme: light;
    letter-spacing: 0;
}

.cl-ssol-page {
    width: min(1760px, calc(100vw - 24px));
    margin: 10px auto 24px;
    color: var(--ssol-ink);
    background: transparent !important;
    font-family: "Montserrat", "Avenir Next", Avenir, system-ui, sans-serif;
    font-size: 15px;
    line-height: 1.45;
}

/* Studio inside the Profilo Utente tab: it occupies the tab surface, not a separate page. */
.cl-ssol-page--embedded {
    width: 100%;
    max-width: none;
    margin: 0;
}
.cl-ssol-page--embedded .cl-ssol-grid {
    grid-template-columns: minmax(220px, 250px) minmax(360px, 1fr) minmax(280px, 320px);
    height: clamp(560px, calc(100dvh - 168px), 820px);
}

.cl-ssol-appbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    min-height: 62px;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 8px 6px 12px;
    background: transparent !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

.cl-ssol-appbar .cl-ssol-view-controls,
.cl-ssol-appbar [data-ssol-pane-toggle] {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

.cl-ssol-appbar .cl-ssol-view-controls {
    pointer-events: none !important;
}

.cl-ssol-appbar .cl-ssol-view-controls [data-ssol-pane-toggle] {
    position: relative;
    z-index: 1;
    pointer-events: auto !important;
}

.cl-ssol-page .cl-ssol-appbar .cl-ssol-view-controls [data-ssol-pane-toggle] {
    display: grid !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.cl-ssol-brand {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    gap: 10px;
}

.cl-ssol-brand-mark {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 1px solid #bcd8dd;
    border-radius: 8px;
    background: var(--ssol-accent-soft) !important;
    color: var(--ssol-accent-strong) !important;
}

.cl-ssol-brand-mark svg { width: 18px; height: 18px; }
.cl-ssol-brand-copy { display: grid; min-width: 0; gap: 1px; }
.cl-ssol-brand-copy strong { color: var(--ssol-ink) !important; font-size: 16px; font-weight: 760; line-height: 1.2; }
.cl-ssol-brand-copy small { color: var(--ssol-muted) !important; font-size: 11px; font-weight: 560; line-height: 1.25; }

.cl-ssol-view-controls {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding: 3px;
    border: 1px solid var(--ssol-line-strong);
    border-radius: 8px;
    background: #e9edef !important;
}

.cl-ssol-view-controls button {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 6px;
    background: transparent !important;
    color: var(--ssol-muted) !important;
    cursor: pointer;
}

.cl-ssol-view-controls button:hover { color: var(--ssol-ink) !important; }
.cl-ssol-view-controls button[aria-pressed="true"] { background: #ffffff !important; color: var(--ssol-accent-strong) !important; box-shadow: 0 1px 4px rgba(23, 33, 43, .12); }
.cl-ssol-view-controls svg { width: 18px; height: 18px; }

.cl-ssol-statuses {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 7px;
}

.cl-ssol-statuses span {
    display: inline-flex;
    min-height: 30px;
    align-items: center;
    padding: 4px 10px;
    border: 1px solid #3aa6b9;
    border-radius: 30px;
    background: #ffffff !important;
    color: #465462 !important;
    font-size: 11px;
    font-weight: 680;
    white-space: nowrap;
}

.cl-ssol-statuses i {
    width: 7px;
    height: 7px;
    margin-right: 6px;
    border-radius: 50%;
    background: var(--ssol-success);
    box-shadow: 0 0 0 3px var(--ssol-success-soft);
}

.cl-ssol-mobile-nav { display: none; }

.cl-ssol-grid {
    display: grid;
    grid-template-columns: minmax(278px, 300px) minmax(500px, 1fr) minmax(380px, 420px);
    height: clamp(570px, calc(100dvh - 134px), 920px);
    min-height: 560px;
    overflow: hidden;
    border: 1px solid var(--ssol-line-strong);
    border-radius: 8px;
    background: var(--ssol-paper) !important;
    box-shadow: var(--ssol-shadow);
}

.cl-ssol-pane {
    min-width: 0;
    min-height: 0;
    background: var(--ssol-paper) !important;
}

.cl-ssol-files,
.cl-ssol-agent {
    display: flex;
    flex-direction: column;
    background: var(--ssol-panel) !important;
}

.cl-ssol-files { border-right: 1px solid var(--ssol-line); }
.cl-ssol-agent { height: 100%; overflow: hidden; border-left: 1px solid var(--ssol-line); }
.cl-ssol-preview { display: flex; flex-direction: column; background: var(--ssol-canvas) !important; }

.cl-ssol-pane-head {
    position: relative;
    z-index: 5;
    display: flex;
    flex: 0 0 72px;
    min-height: 72px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 17px;
    border-bottom: 1px solid var(--ssol-line);
    background: rgba(255, 255, 255, 0.98) !important;
}

.cl-ssol-pane-head > div:first-child { min-width: 0; }
.cl-ssol-pane-kicker {
    display: block;
    margin: 0 0 3px;
    color: var(--ssol-accent-strong) !important;
    font-size: 10px;
    font-weight: 780;
    line-height: 1.2;
    text-transform: uppercase;
}

.cl-ssol-pane-head h2 {
    margin: 0;
    overflow: hidden;
    color: var(--ssol-ink) !important;
    font-size: 16px;
    font-weight: 740;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cl-ssol-icon-button,
.cl-ssol-send,
.cl-ssol-file-menu {
    display: inline-grid;
    place-items: center;
    padding: 0;
    cursor: pointer;
}

.cl-ssol-icon-button {
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    border: 1px solid var(--ssol-line-strong);
    border-radius: 7px;
    background: #ffffff !important;
    color: #40505f !important;
    transition: border-color 140ms ease, background-color 140ms ease, color 140ms ease, transform 140ms ease;
}

.cl-ssol-icon-button:hover {
    border-color: #86bac3;
    background: var(--ssol-accent-soft) !important;
    color: var(--ssol-accent-strong) !important;
}

.cl-ssol-icon-button:active { transform: translateY(1px); }
.cl-ssol-icon-button svg,
.cl-ssol-send svg,
.cl-ssol-welcome-icon svg,
.cl-ssol-file-menu svg { width: 17px; height: 17px; }

.cl-ssol-page button:focus-visible,
.cl-ssol-page textarea:focus-visible,
.cl-ssol-page input:focus-visible,
.cl-ssol-page select:focus-visible,
.cl-ssol-page summary:focus-visible {
    outline: 2px solid var(--ssol-focus) !important;
    outline-offset: 2px;
}

/* Workspace */
.cl-ssol-workspace-host {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    scrollbar-gutter: stable;
    background: var(--ssol-panel) !important;
}

.cl-ssol-workspace-host .cls-module {
    height: 100%;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.cl-ssol-workspace-host .cls-card__head { display: none !important; }
.cl-ssol-workspace-host .cls-card__body { padding: 0 !important; }
.cl-ssol-workspace-host .cls-ws { min-height: 100%; padding-bottom: 12px; background: transparent !important; }

.cl-ssol-workspace-host .cls-toolbar {
    position: sticky;
    top: 0;
    z-index: 4;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 13px;
    border: 0;
    border-bottom: 1px solid var(--ssol-line);
    border-radius: 0;
    background: rgba(247, 249, 250, 0.98) !important;
    backdrop-filter: blur(10px);
}

.cl-ssol-workspace-host .cls-search {
    width: 100%;
    min-width: 0;
    max-width: none;
    order: -1;
    border: 1px solid var(--ssol-line-strong);
    border-radius: 7px;
    background: #ffffff !important;
    box-shadow: none;
}

.cl-ssol-workspace-host .cls-search:focus-within { border-color: var(--ssol-accent); box-shadow: 0 0 0 3px rgba(44, 146, 162, 0.12); }
.cl-ssol-workspace-host .cls-search input { color: var(--ssol-ink) !important; font-size: 13px; }
.cl-ssol-workspace-host .cls-toolbar .cls-btn {
    width: 34px;
    min-width: 34px;
    height: 34px;
    justify-content: center;
    gap: 0;
    overflow: hidden;
    padding: 0 !important;
    border: 1px solid var(--ssol-line-strong);
    border-radius: 7px !important;
    background: #ffffff !important;
    color: #40505f !important;
    font-size: 0;
    box-shadow: none;
}

.cl-ssol-workspace-host .cls-toolbar .cls-btn:hover { border-color: #86bac3; background: var(--ssol-accent-soft) !important; color: var(--ssol-accent-strong) !important; }
.cl-ssol-workspace-host .cls-toolbar .cls-btn svg { width: 16px; height: 16px; }
.cl-ssol-workspace-host .cls-toolbar__spacer { display: none; }
.cl-ssol-workspace-host .cls-sort { width: 100%; height: 34px; border: 0; background: transparent !important; }
.cl-ssol-workspace-host .cls-sort select { min-width: 0; width: 100%; color: var(--ssol-ink-soft) !important; font-size: 11px; }
.cl-ssol-workspace-host .cls-crumbs { margin: 0; padding: 10px 12px 5px; color: var(--ssol-muted) !important; font-size: 10px; }
.cl-ssol-workspace-host .cls-files { display: grid; grid-auto-rows: max-content; align-content: start; gap: 4px; padding: 6px 8px 16px; background: transparent !important; }

.cl-ssol-workspace-host .cls-file {
    position: relative;
    display: grid !important;
    grid-template-columns: 32px minmax(0, 1fr) auto 26px !important;
    grid-template-areas: "icon main quick menu" "actions actions actions actions" !important;
    align-items: center;
    gap: 0 8px !important;
    width: 100%;
    min-width: 0;
    min-height: 50px;
    padding: 7px 7px 7px 9px !important;
    overflow: visible;
    border: 1px solid #e2e8eb !important;
    border-radius: 6px !important;
    background: #ffffff !important;
    box-shadow: none;
    transition: border-color 140ms ease, background-color 140ms ease, box-shadow 140ms ease;
}

.cl-ssol-workspace-host .cls-file:hover,
.cl-ssol-workspace-host .cls-file:focus-within,
.cl-ssol-workspace-host .cls-file.is-open {
    border-color: #a9cdd3 !important;
    background: #fbfefe !important;
    box-shadow: 0 3px 10px rgba(23, 33, 43, 0.055);
}

.cl-ssol-workspace-host .cls-file__ico {
    grid-area: icon;
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    align-self: center;
    border-radius: 5px !important;
    background: #eef5f6 !important;
    color: var(--ssol-accent-strong) !important;
}
.cl-ssol-workspace-host .cls-file__ico svg { width: 17px; height: 17px; }

.cl-ssol-workspace-host .cls-file__main {
    grid-area: main;
    width: 100%;
    min-width: 0;
}

.cl-ssol-workspace-host .cls-file__name {
    display: block;
    width: 100%;
    min-width: 0;
    min-height: 0;
    padding: 0 !important;
    overflow: hidden;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--ssol-ink) !important;
    font-family: inherit;
    font-size: 12.5px;
    font-weight: 680;
    line-height: 1.3;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
}

.cl-ssol-workspace-host .cls-file__meta {
    display: flex;
    min-width: 0;
    flex-wrap: nowrap;
    align-items: center;
    gap: 5px;
    margin-top: 2px;
    overflow: hidden;
    color: var(--ssol-faint) !important;
    font-size: 9.5px;
    line-height: 1.2;
    white-space: nowrap;
}

.cl-ssol-workspace-host .cls-file__badge {
    grid-column: auto !important;
    justify-self: auto !important;
    padding: 0;
    border-radius: 0;
    background: transparent !important;
    color: var(--ssol-accent-strong) !important;
    font-size: 9px;
    font-weight: 760;
}

.cl-ssol-file-quick-actions {
    grid-area: quick;
    display: inline-flex;
    align-items: center;
    gap: 1px;
    padding: 1px;
    border: 1px solid #e4e9ec;
    border-radius: 6px;
    background: #f8fafb !important;
}

.cl-ssol-file-quick-button,
.cl-ssol-file-menu {
    display: grid;
    width: 24px;
    height: 24px;
    place-items: center;
    align-self: center;
    padding: 0;
    border: 0;
    border-radius: 4px;
    background: transparent !important;
    color: #72808c !important;
    cursor: pointer;
}

.cl-ssol-file-quick-button svg,
.cl-ssol-file-menu svg {
    width: 14px;
    height: 14px;
}

.cl-ssol-file-menu { grid-area: menu; width: 26px; height: 26px; }

.cl-ssol-file-quick-button:hover,
.cl-ssol-file-quick-button:focus-visible,
.cl-ssol-file-menu:hover,
.cl-ssol-file-menu:focus-visible,
.cl-ssol-file-menu[aria-expanded="true"] {
    background: #e8f1f3 !important;
    color: var(--ssol-accent-strong) !important;
}

.cl-ssol-file-quick-button--danger {
    color: #8b7478 !important;
}
.cl-ssol-file-quick-button--danger:hover,
.cl-ssol-file-quick-button--danger:focus-visible {
    background: #f9ebed !important;
    color: #9b343e !important;
}

.cl-ssol-file-quick-button:focus-visible,
.cl-ssol-file-menu:focus-visible {
    outline: 2px solid var(--ssol-accent-strong);
    outline-offset: 1px;
}

.cl-ssol-workspace-host .cls-file__actions {
    grid-area: actions;
    display: none !important;
    width: 100%;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end !important;
    gap: 3px !important;
    margin: 6px 0 0 !important;
    padding: 6px 0 0;
    border-top: 1px solid var(--ssol-line);
    background: transparent !important;
    opacity: 1 !important;
    transform: none !important;
}

.cl-ssol-workspace-host .cls-file.is-actions-open .cls-file__actions { display: flex !important; }
.cl-ssol-workspace-host .cls-file__actions .cls-iconbtn {
    flex: 0 0 28px;
    width: 28px;
    min-width: 28px;
    height: 28px;
    padding: 0 !important;
    border: 1px solid transparent;
    border-radius: 5px !important;
    background: transparent !important;
    color: #465563 !important;
}

.cl-ssol-workspace-host .cls-file__actions .cls-iconbtn:hover {
    border-color: var(--ssol-line-strong);
    background: #eef4f5 !important;
    color: var(--ssol-accent-strong) !important;
}
.cl-ssol-workspace-host .cls-file__actions .cls-iconbtn--danger { color: var(--ssol-danger) !important; }
.cl-ssol-workspace-host .cls-file__actions .cls-iconbtn--danger:hover {
    border-color: #e7c7ca;
    background: #faeeee !important;
}

@media (hover: hover) and (pointer: fine) {
    .cl-ssol-workspace-host .cls-file__actions [data-cls-action="download"],
    .cl-ssol-workspace-host .cls-file__actions [data-cls-action="share"],
    .cl-ssol-workspace-host .cls-file__actions [data-cls-action="delete"] {
        display: none !important;
    }
}

@media (hover: none) and (pointer: coarse) {
    .cl-ssol-workspace-host .cls-file {
        grid-template-columns: 32px minmax(0, 1fr) 26px !important;
        grid-template-areas: "icon main menu" "actions actions actions" !important;
    }
    .cl-ssol-file-quick-actions { display: none; }
}

/* Preview */
.cl-ssol-preview-head { padding-inline: 16px; }
.cl-ssol-preview-head h2 { max-width: min(48vw, 640px); }
.cl-ssol-preview-actions {
    display: inline-flex;
    flex: 0 0 auto;
    gap: 2px;
    padding: 2px;
    border: 1px solid var(--ssol-line-strong);
    border-radius: 7px;
    background: #f0f3f5 !important;
}

.cl-ssol-preview-actions button {
    display: inline-flex;
    min-height: 29px;
    align-items: center;
    gap: 5px;
    padding: 3px 8px;
    border: 0;
    border-radius: 5px;
    background: transparent !important;
    color: var(--ssol-muted) !important;
    font: inherit;
    font-size: 9px;
    font-weight: 720;
    cursor: pointer;
}

.cl-ssol-preview-actions button.is-active { background: #ffffff !important; color: var(--ssol-ink) !important; box-shadow: 0 1px 4px rgba(23, 33, 43, 0.12); }
.cl-ssol-preview-actions svg { width: 14px; height: 14px; }
.cl-ssol-editor-toggle {
    margin-left: 3px;
    gap: 6px !important;
    padding-inline: 9px !important;
}
.cl-ssol-editor-toggle > span {
    position: relative;
    display: inline-block;
    width: 20px;
    height: 12px;
    border-radius: 999px;
    background: #b7c2c8;
    transition: background .16s ease;
}
.cl-ssol-editor-toggle > span::after {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #fff;
    content: '';
    transition: transform .16s ease;
}
.cl-ssol-editor-toggle.is-active > span { background: var(--ssol-accent-strong); }
.cl-ssol-editor-toggle.is-active > span::after { transform: translateX(8px); }
.cl-ssol-editor-toggle:focus-visible { outline: 2px solid var(--ssol-accent-strong); outline-offset: 2px; }

.cl-ssol-new-file-button {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    width: calc(100% - 24px);
    min-height: 58px;
    align-items: center;
    gap: 10px;
    margin: 10px 12px 6px;
    padding: 9px 12px;
    border: 1px dashed #8eabb2;
    border-radius: 7px;
    background: #f8fbfc !important;
    color: var(--ssol-accent-strong) !important;
    text-align: left;
    cursor: pointer;
    transition: border-color .16s ease, background .16s ease, box-shadow .16s ease;
}
.cl-ssol-new-file-button svg { width: 22px; height: 22px; }
.cl-ssol-new-file-button > span { display: grid; min-width: 0; gap: 3px; }
.cl-ssol-new-file-button strong {
    color: var(--ssol-ink-soft) !important;
    font: 720 11px/1.2 var(--ssol-font, Montserrat, Avenir, sans-serif);
}
.cl-ssol-new-file-button small {
    color: var(--ssol-muted) !important;
    font: 500 9.5px/1.25 var(--ssol-font, Montserrat, Avenir, sans-serif);
}
.cl-ssol-new-file-button:hover,
.cl-ssol-new-file-button:focus-visible,
.cl-ssol-new-file-button.is-dragover {
    border-color: var(--ssol-accent-strong);
    background: #eaf5f6 !important;
    box-shadow: inset 0 0 0 1px rgb(31 125 140 / 12%);
}
.cl-ssol-new-file-button:focus-visible { outline: 2px solid var(--ssol-accent-strong); outline-offset: 2px; }
.cl-ssol-modal.cl-ssol-new-file-modal { width: min(420px, 100%); }
.cl-ssol-new-file-intro {
    margin: 0 0 18px;
    color: var(--ssol-muted);
    font-size: 13px;
    line-height: 1.5;
}
.cl-ssol-new-file-field {
    display: grid;
    gap: 6px;
    margin-top: 13px;
}
.cl-ssol-new-file-field > span {
    color: var(--ssol-ink-soft);
    font-size: 11px;
    font-weight: 760;
}
.cl-ssol-new-file-field input,
.cl-ssol-new-file-field select {
    width: 100%;
    min-height: 39px;
    padding: 0 11px;
    border: 1px solid var(--ssol-line-strong);
    border-radius: 6px;
    background: #fff;
    color: var(--ssol-ink);
    font: 13px/1.2 var(--ssol-font, Montserrat, Avenir, sans-serif);
}
.cl-ssol-new-file-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 22px;
}
.cl-ssol-preview-stage {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    padding: clamp(22px, 3vw, 42px);
    background: var(--ssol-canvas) !important;
    scrollbar-gutter: stable;
}

.cl-ssol-welcome {
    display: grid;
    min-height: 100%;
    place-content: center;
    justify-items: center;
    padding: 28px;
    color: var(--ssol-muted) !important;
    text-align: center;
}

.cl-ssol-welcome-icon {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    margin-bottom: 14px;
    border: 1px solid #bcd8dd;
    border-radius: 8px;
    background: #ffffff !important;
    color: var(--ssol-accent-strong) !important;
    box-shadow: 0 8px 24px rgba(23, 33, 43, 0.08);
}

.cl-ssol-welcome h3 { margin: 0 0 6px; color: var(--ssol-ink) !important; font-size: 16px; font-weight: 720; }
.cl-ssol-welcome p { max-width: 430px; margin: 0; color: var(--ssol-muted) !important; font-size: 13px; line-height: 1.55; }

.cl-ssol-document {
    width: min(820px, 100%);
    min-height: 100%;
    margin: 0 auto;
    padding: clamp(42px, 6vw, 76px) !important;
    border: 1px solid #d3dae0;
    border-radius: 3px;
    background: #ffffff !important;
    color: #202936 !important;
    box-shadow: 0 14px 38px rgba(23, 33, 43, 0.09);
    font-family: "Montserrat", "Avenir Next", Avenir, system-ui, sans-serif;
    font-size: 16px;
    line-height: 1.76;
}

.cl-ssol-document h1,
.cl-ssol-document h2,
.cl-ssol-document h3,
.cl-ssol-document h4 { color: var(--ssol-ink) !important; font-family: inherit; font-weight: 740; line-height: 1.25; }
.cl-ssol-document h1 { margin: 0 0 1em; font-size: 32px; }
.cl-ssol-document h2 { margin: 1.65em 0 .65em; font-size: 24px; color: #245b64 !important; }
.cl-ssol-document h3 { margin: 1.45em 0 .55em; font-size: 19px; }
.cl-ssol-document p { margin: 0 0 1em; color: #344153 !important; }
.cl-ssol-document ul,
.cl-ssol-document ol { margin: .7em 0 1.2em; padding-left: 1.5em; }
.cl-ssol-document li { margin: .35em 0; color: #344153 !important; }
.cl-ssol-document blockquote { margin: 1.25em 0; padding: 12px 16px; border-left: 3px solid var(--ssol-accent); background: #f6fafb !important; color: #4b5967 !important; }
.cl-ssol-document code { padding: 2px 4px; border-radius: 4px; background: #eef2f4 !important; color: #273642 !important; font-size: .9em; }
.cl-ssol-document pre,
.cl-ssol-code { margin: 0; overflow-wrap: anywhere; white-space: pre-wrap; font: 12px/1.62 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.cl-ssol-document--text p { white-space: normal; }
.cl-ssol-document--code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.cl-ssol-html-frame,
.cl-ssol-file-frame { width: 100%; height: 100%; min-height: 620px; border: 0; background: #ffffff !important; box-shadow: 0 12px 34px rgba(23, 33, 43, 0.08); }
.cl-ssol-image { display: block; max-width: 100%; max-height: calc(100dvh - 220px); margin: auto; object-fit: contain; }
.cl-ssol-preview-error { display: grid; min-height: 100%; place-content: center; padding: 24px; color: var(--ssol-muted) !important; text-align: center; }

/* Agent */
.cl-ssol-chat {
    flex: 1 1 0;
    height: 0;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 20px 18px 24px;
    background: var(--ssol-panel) !important;
    color: var(--ssol-ink) !important;
    scrollbar-gutter: stable;
}

.cl-ssol-message { margin: 0 0 20px; }
.cl-ssol-message--user { margin-left: 56px; }
.cl-ssol-message-label { margin: 0 0 7px; color: var(--ssol-muted) !important; font-size: 10px; font-weight: 760; line-height: 1.2; text-transform: uppercase; }
.cl-ssol-message--user .cl-ssol-message-label { text-align: right; }
.cl-ssol-message-body {
    padding: 14px 15px;
    border: 1px solid var(--ssol-line);
    border-radius: 7px;
    background: #ffffff !important;
    color: #293744 !important;
    box-shadow: 0 1px 2px rgba(23, 33, 43, 0.04);
    font-size: 13px;
    line-height: 1.62;
}

.cl-ssol-message--user .cl-ssol-message-body { border-color: #aad4db; background: var(--ssol-accent-soft) !important; }
.cl-ssol-message-body > :first-child { margin-top: 0; }
.cl-ssol-message-body > :last-child { margin-bottom: 0; }
.cl-ssol-message-body p { color: inherit !important; }
.cl-ssol-message-body pre { overflow: auto; padding: 9px; border-radius: 5px; background: #f0f3f5 !important; font: 10px/1.5 ui-monospace, monospace; }
.cl-ssol-message-body a { color: var(--ssol-accent-strong) !important; text-decoration-thickness: 1px; text-underline-offset: 2px; }

.cl-ssol-message-actions { display: flex; justify-content: flex-end; gap: 6px; margin-top: 8px; }
.cl-ssol-message-actions button {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 5px 10px;
    border: 1px solid var(--ssol-line-strong);
    border-radius: 6px;
    background: #ffffff !important;
    color: #526170 !important;
    font: inherit;
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
}
.cl-ssol-message-actions button:hover { border-color: #8ebbc3; color: var(--ssol-accent-strong) !important; }
.cl-ssol-message-actions svg { width: 15px; height: 15px; }
.cl-ssol-message-actions .cl-ssol-message-action-icon { width: 34px; padding: 0; }

.cl-ssol-activity-details {
    overflow: hidden;
    border: 1px solid var(--ssol-line);
    border-radius: 7px;
    background: #ffffff !important;
}
.cl-ssol-activity-details > summary {
    padding: 11px 12px;
    background: #ffffff !important;
    color: #526170 !important;
    font-size: 11px;
    font-weight: 720;
    cursor: pointer;
}
.cl-ssol-activity-details[open] > summary { border-bottom: 1px solid var(--ssol-line); }
.cl-ssol-activity-details > summary:hover { color: var(--ssol-accent-strong) !important; }
.cl-ssol-activity-stream .cl-ssol-message-body { padding: 11px 12px; border: 0; border-radius: 0; background: #fbfcfd !important; box-shadow: none; }
.cl-ssol-live-events { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.cl-ssol-live-wait { padding: 4px 0; color: var(--ssol-muted) !important; font-size: 9px; }
.cl-ssol-live-event { position: relative; display: grid; grid-template-columns: 13px minmax(0, 1fr); gap: 7px; padding: 5px 0; }
.cl-ssol-live-event:not(:last-child)::after { content: ""; position: absolute; left: 4px; top: 17px; bottom: -4px; width: 1px; background: #d8e0e5; }
.cl-ssol-live-dot { position: relative; z-index: 1; width: 9px; height: 9px; margin-top: 3px; border: 2px solid #ffffff; border-radius: 50%; background: var(--ssol-warning); box-shadow: 0 0 0 1px #d6b16f; }
.cl-ssol-live-event.is-completed .cl-ssol-live-dot { background: var(--ssol-success); box-shadow: 0 0 0 1px #83b79f; }
.cl-ssol-live-event.is-failed .cl-ssol-live-dot { background: var(--ssol-danger); box-shadow: 0 0 0 1px #d7a0a5; }
.cl-ssol-live-event strong { display: block; color: var(--ssol-ink-soft) !important; font-size: 11px; line-height: 1.3; }
.cl-ssol-live-event small { display: block; margin-top: 2px; color: var(--ssol-muted) !important; font-size: 10px; line-height: 1.4; overflow-wrap: anywhere; }
.cl-ssol-live-event time { display: block; margin-top: 2px; color: var(--ssol-faint) !important; font-size: 9px; font-variant-numeric: tabular-nums; }

.cl-ssol-tool-report { margin-top: 7px; border-top: 1px solid var(--ssol-line); }
.cl-ssol-tool-report summary { padding: 9px 0 3px; color: #526170 !important; font-size: 11px; font-weight: 710; line-height: 1.4; cursor: pointer; }
.cl-ssol-tool-report summary:hover { color: var(--ssol-accent-strong) !important; }
.cl-ssol-tool-trace { display: grid; gap: 5px; margin-top: 6px; }
.cl-ssol-tool-report-item { padding: 7px 8px; border: 1px solid var(--ssol-line); border-radius: 6px; background: #f6f8f9 !important; }
.cl-ssol-tool-report-item strong { display: block; color: var(--ssol-ink-soft) !important; font-size: 11px; }
.cl-ssol-tool-report-item p { margin: 3px 0 0; color: var(--ssol-muted) !important; font-size: 10px; line-height: 1.45; overflow-wrap: anywhere; }
.cl-ssol-formulario-notice { margin: 6px 0 0 !important; padding: 6px 8px; border-left: 2px solid #75aeb8; border-radius: 0 4px 4px 0; background: #eef7f8 !important; color: #4f6368 !important; font-size: 9px !important; line-height: 1.45 !important; }
.cl-ssol-formulario-notice a { color: var(--ssol-accent-strong) !important; font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }
.cl-ssol-formulario-notice { margin: 6px 0 0 !important; padding: 6px 8px; border-left: 2px solid #75aeb8; border-radius: 0 4px 4px 0; background: #eef7f8 !important; color: #4f6368 !important; font-size: 9px !important; line-height: 1.45 !important; }
.cl-ssol-formulario-notice a { color: var(--ssol-accent-strong) !important; font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }

/* [RUN-RECEIPT] Completed-turn accountability summary. */
.cl-ssol-run-receipt { margin-top: 8px; overflow: hidden; border: 1px solid #cfe0e3; border-radius: 7px; background: #f4fafb !important; }
.cl-ssol-run-receipt > summary { padding: 10px 12px; color: var(--ssol-accent-strong) !important; font-size: 11px; font-weight: 740; line-height: 1.4; cursor: pointer; }
.cl-ssol-run-receipt > summary:hover { color: var(--ssol-ink) !important; }
.cl-ssol-run-receipt[open] > summary { border-bottom: 1px solid #cfe0e3; }
.cl-ssol-run-receipt-list { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 6px 8px; margin: 0; padding: 10px 12px 6px; font-size: 10px; line-height: 1.45; }
.cl-ssol-run-receipt-list dt { color: var(--ssol-muted) !important; font-weight: 700; }
.cl-ssol-run-receipt-list dd { min-width: 0; margin: 0; color: var(--ssol-ink-soft) !important; overflow-wrap: anywhere; }
.cl-ssol-run-receipt-copy { margin: 0 12px 11px; padding: 5px 8px; border: 1px solid #b8d6dc; border-radius: 5px; background: #ffffff !important; color: var(--ssol-accent-strong) !important; font: inherit; font-size: 10px; font-weight: 700; cursor: pointer; }
.cl-ssol-run-receipt-copy:hover { border-color: #86bac3; }

.cl-ssol-legal-sources { margin-top: 10px; border: 1px solid #cfe0e3; border-radius: 7px; background: #f4fafb !important; }
.cl-ssol-legal-sources > summary { padding: 10px 12px; color: var(--ssol-accent-strong) !important; font-size: 11px; font-weight: 740; line-height: 1.4; cursor: pointer; }
.cl-ssol-legal-sources > summary:hover { color: var(--ssol-ink) !important; }
.cl-ssol-legal-sources-list { display: grid; gap: 7px; padding: 0 10px 10px; }
.cl-ssol-legal-source { padding: 9px 10px; border: 1px solid var(--ssol-line); border-radius: 6px; background: #ffffff !important; }
.cl-ssol-legal-source strong { display: block; color: var(--ssol-ink) !important; font-size: 11px; }
.cl-ssol-legal-source p { margin: 3px 0 0; color: var(--ssol-ink-soft) !important; font-size: 11px; line-height: 1.45; }
.cl-ssol-legal-source small { display: block; margin-top: 3px; color: var(--ssol-muted) !important; font-size: 9px; }
.cl-ssol-legal-source blockquote { max-height: 150px; margin: 8px 0 0; padding: 8px 9px; overflow: auto; border-left: 2px solid var(--ssol-accent); background: #f7f9fa !important; color: var(--ssol-ink-soft) !important; font-size: 10px; line-height: 1.5; white-space: pre-wrap; }

.cl-ssol-temp { margin-top: 8px; padding: 9px; border: 1px solid #e1c784; border-radius: 7px; background: #fff9e9 !important; }
.cl-ssol-temp strong { display: block; margin-bottom: 5px; color: #5f4a18 !important; font-size: 10px; }
.cl-ssol-temp button { min-height: 29px; padding: 5px 8px; border: 0; border-radius: 6px; background: var(--ssol-ink) !important; color: #ffffff !important; font: inherit; font-size: 9px; font-weight: 700; cursor: pointer; }

.cl-ssol-composer {
    flex: 0 0 auto;
    margin: 0;
    padding: 13px 14px 14px;
    border-top: 1px solid var(--ssol-line);
    background: #ffffff !important;
}

.cl-ssol-context {
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr) 30px;
    align-items: center;
    gap: 9px;
    margin-bottom: 10px;
    padding: 8px 9px;
    border: 1px solid #b8d6dc;
    border-radius: 7px;
    background: #eff8f9 !important;
}
.cl-ssol-context[hidden] { display: none !important; }
.cl-ssol-context-icon { display: grid; width: 32px; height: 32px; place-items: center; border-radius: 6px; background: #ffffff !important; color: var(--ssol-accent-strong) !important; }
.cl-ssol-context-icon svg { width: 16px; height: 16px; }
.cl-ssol-context-copy { display: grid; min-width: 0; gap: 1px; }
.cl-ssol-context-copy small { color: var(--ssol-muted) !important; font-size: 9px; font-weight: 650; }
.cl-ssol-context-copy strong { overflow: hidden; color: var(--ssol-ink-soft) !important; font-size: 11px; font-weight: 720; text-overflow: ellipsis; white-space: nowrap; }
.cl-ssol-context button { display: grid; width: 30px; height: 30px; place-items: center; padding: 0; border: 0; border-radius: 6px; background: transparent !important; color: var(--ssol-muted) !important; cursor: pointer; }
.cl-ssol-context button:hover { background: #ffffff !important; color: var(--ssol-danger) !important; }
.cl-ssol-context button svg { width: 15px; height: 15px; }

.cl-ssol-composer textarea {
    display: block;
    width: 100%;
    height: 88px !important;
    min-height: 88px !important;
    max-height: 180px;
    resize: vertical;
    padding: 12px 13px;
    border: 1px solid var(--ssol-line-strong);
    border-radius: 7px;
    background: #ffffff !important;
    color: var(--ssol-ink) !important;
    font: inherit;
    font-size: 13px;
    line-height: 1.5;
}
.cl-ssol-composer textarea::placeholder { color: #9aa3ad !important; }
.cl-ssol-composer textarea:focus { border-color: var(--ssol-accent); box-shadow: 0 0 0 3px rgba(44, 146, 162, 0.12); outline: 0; }
.cl-ssol-composer-foot { display: flex; min-height: 40px; align-items: center; justify-content: space-between; margin-top: 8px; }
.cl-ssol-composer-foot > span { display: inline-flex; align-items: center; gap: 6px; color: var(--ssol-muted) !important; font-size: 10px; font-weight: 650; }
.cl-ssol-composer-foot > span::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--ssol-success); }
.cl-ssol-send { width: 40px; height: 40px; border: 0; border-radius: 7px; background: var(--ssol-accent) !important; color: #ffffff !important; box-shadow: 0 5px 12px rgba(44, 146, 162, 0.23); }
.cl-ssol-send:hover { background: var(--ssol-accent-strong) !important; }
.cl-ssol-send:active { transform: translateY(1px); }
.cl-ssol-send:disabled { opacity: .45; cursor: wait; box-shadow: none; }

/* Dialog */
.cl-ssol-dialog-scrim { position: fixed; inset: 0; z-index: 100100; display: grid; place-items: center; padding: 20px; background: rgba(17, 25, 33, .60); }
.cl-ssol-dialog { width: min(430px, 100%); padding: 20px; border: 1px solid var(--ssol-line-strong); border-radius: 8px; background: #ffffff !important; color: var(--ssol-ink) !important; box-shadow: 0 24px 70px rgba(0,0,0,.25); }
.cl-ssol-dialog h3 { margin: 0 0 6px; color: var(--ssol-ink) !important; font-size: 16px; }
.cl-ssol-dialog p { margin: 0 0 13px; color: var(--ssol-muted) !important; font-size: 11px; }
.cl-ssol-dialog input { width: 100%; height: 40px; padding: 7px 9px; border: 1px solid var(--ssol-line-strong); border-radius: 6px; background: #ffffff !important; color: var(--ssol-ink) !important; font: inherit; font-size: 12px; }
.cl-ssol-dialog-actions { display: flex; justify-content: flex-end; gap: 7px; margin-top: 15px; }
.cl-ssol-dialog-actions button { min-height: 34px; padding: 6px 10px; border: 1px solid var(--ssol-line-strong); border-radius: 6px; background: #ffffff !important; color: var(--ssol-ink) !important; font: inherit; font-size: 10px; font-weight: 700; cursor: pointer; }
.cl-ssol-dialog-actions button[data-ssol-dialog-save] { border-color: var(--ssol-ink); background: var(--ssol-ink) !important; color: #ffffff !important; }

.cl-ssol-thinking-dots { display: inline-flex; gap: 4px; margin-right: 6px; }
.cl-ssol-thinking-dots i { width: 5px; height: 5px; border-radius: 50%; background: var(--ssol-accent); animation: ssol-breathe 1s infinite ease-in-out; }
.cl-ssol-thinking-dots i:nth-child(2) { animation-delay: 120ms; }
.cl-ssol-thinking-dots i:nth-child(3) { animation-delay: 240ms; }
@keyframes ssol-breathe { 0%, 70%, 100% { opacity: .25; transform: translateY(0); } 35% { opacity: 1; transform: translateY(-2px); } }

@media (max-width: 1220px) {
    .cl-ssol-grid { grid-template-columns: 250px minmax(390px, 1fr) 350px; }
    .cl-ssol-brand-copy small { display: none; }
}

@media (max-width: 1040px) {
    .cl-ssol-page { width: calc(100vw - 16px); margin-top: 6px; }
    .cl-ssol-appbar { min-height: 48px; padding: 4px 2px 8px; }
    .cl-ssol-view-controls { display: none; }
    .cl-ssol-brand-mark { width: 32px; height: 32px; flex-basis: 32px; }
    .cl-ssol-statuses span { min-height: 28px; padding-inline: 9px; font-size: 10px; }
    .cl-ssol-statuses span:nth-child(2) { display: none; }
    .cl-ssol-mobile-nav {
        position: sticky;
        top: 0;
        z-index: 20;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 2px;
        margin-bottom: 7px;
        padding: 3px;
        border: 1px solid var(--ssol-line-strong);
        border-radius: 7px;
        background: #eef2f4 !important;
    }
    .cl-ssol-mobile-nav button { min-height: 36px; border: 0; border-radius: 5px; background: transparent !important; color: var(--ssol-muted) !important; font: inherit; font-size: 10px; font-weight: 720; }
    .cl-ssol-mobile-nav button[aria-pressed="true"] { background: #ffffff !important; color: var(--ssol-ink) !important; box-shadow: 0 1px 5px rgba(23, 33, 43, .12); }
    .cl-ssol-grid { display: block; height: auto; min-height: 0; box-shadow: 0 8px 24px rgba(23, 33, 43, .09); }
    .cl-ssol-grid .cl-ssol-pane { display: none; height: min(760px, calc(100dvh - 134px)); min-height: 590px; border: 0; }
    .cl-ssol-grid[data-ssol-mobile-active="files"] [data-ssol-pane="files"],
    .cl-ssol-grid[data-ssol-mobile-active="preview"] [data-ssol-pane="preview"],
    .cl-ssol-grid[data-ssol-mobile-active="agent"] [data-ssol-pane="agent"] { display: flex; }
    .cl-ssol-preview-stage { padding: 14px; }
    .cl-ssol-document { padding: 34px 28px; }
}

@media (max-width: 560px) {
    .cl-ssol-brand-copy strong { font-size: 14px; }
    .cl-ssol-statuses span:nth-child(3) { display: none; }
    .cl-ssol-pane-head { min-height: 64px; flex-basis: 64px; padding: 11px 13px; }
    .cl-ssol-preview-head { align-items: flex-start; flex-direction: column; height: auto; min-height: 72px; }
    .cl-ssol-preview-head h2 { max-width: 80vw; }
    .cl-ssol-preview-actions { align-self: stretch; }
    .cl-ssol-preview-actions button { flex: 1 1 0; justify-content: center; }
    .cl-ssol-document { padding: 30px 22px; font-size: 15px; }
    .cl-ssol-document h1 { font-size: 27px; }
    .cl-ssol-document h2 { font-size: 21px; }
    .cl-ssol-message--user { margin-left: 22px; }
    .cl-ssol-workspace-host .cls-file__actions { justify-content: space-between !important; }
}

@media (min-width: 1041px) {
    .cl-ssol-page.is-files-hidden .cl-ssol-grid { grid-template-columns: 0 minmax(500px, 1fr) minmax(380px, 420px) !important; }
    .cl-ssol-page.is-agent-hidden .cl-ssol-grid { grid-template-columns: minmax(278px, 300px) minmax(500px, 1fr) 0 !important; }
    .cl-ssol-page.is-files-hidden.is-agent-hidden .cl-ssol-grid { grid-template-columns: 0 minmax(600px, 1fr) 0 !important; }
    .cl-ssol-page.is-files-hidden .cl-ssol-files,
    .cl-ssol-page.is-agent-hidden .cl-ssol-agent { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .cl-ssol-page *,
    .cl-ssol-page *::before,
    .cl-ssol-page *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Agent UX 0.5.6: edge-to-edge workspace shell. */
.cl-ssol-page {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100dvh;
    min-height: 0;
    margin: 0;
    overflow: hidden;
}

body.admin-bar .cl-ssol-page {
    height: calc(100dvh - 32px);
}

.cl-ssol-appbar {
    flex: 0 0 62px;
    padding-inline: 12px;
}

.cl-ssol-grid {
    flex: 1 1 auto;
    width: 100%;
    height: auto;
    min-height: 0;
    border-radius: 0;
    box-shadow: none;
}

@media (max-width: 782px) {
    body.admin-bar .cl-ssol-page {
        height: calc(100dvh - 46px);
    }
}

@media (max-width: 1040px) {
    .cl-ssol-page {
        width: 100%;
        margin: 0;
    }

    .cl-ssol-appbar {
        flex-basis: 48px;
    }

    .cl-ssol-mobile-nav {
        flex: 0 0 44px;
        margin: 0;
        border-right: 0;
        border-left: 0;
        border-radius: 0;
    }

    .cl-ssol-grid {
        flex: 1 1 auto;
        height: auto;
        min-height: 0;
    }

    .cl-ssol-grid .cl-ssol-pane {
        height: 100%;
        min-height: 0;
    }
}

/* Agent UX 0.5.7: use WordPress' actual admin-bar height. */
body.admin-bar.cl-ssol-light-page {
    padding-top: var(--wp-admin--admin-bar--height, 32px) !important;
}

body.admin-bar .cl-ssol-page {
    height: calc(100dvh - var(--wp-admin--admin-bar--height, 32px));
}

/* Studio 0.14: document drawer, local deterministic compilation, visual HTML editing. */
@media (min-width: 1041px) {
    .cl-ssol-page.is-preview-hidden .cl-ssol-grid {
        grid-template-columns: minmax(278px, 300px) minmax(0, 1fr) !important;
    }
    .cl-ssol-page.is-preview-hidden .cl-ssol-preview { display: none; }
    .cl-ssol-page.is-preview-hidden .cl-ssol-agent {
        display: flex !important;
        grid-column: 2;
        border-left: 1px solid var(--ssol-line);
    }
    .cl-ssol-page.is-preview-hidden.is-files-hidden .cl-ssol-grid { grid-template-columns: minmax(0, 1fr) !important; }
    .cl-ssol-page.is-preview-hidden.is-files-hidden .cl-ssol-agent { grid-column: 1; }
    .cl-ssol-page.is-preview-hidden.is-agent-hidden .cl-ssol-grid { grid-template-columns: minmax(278px, 300px) !important; }
    .cl-ssol-page.is-preview-hidden.is-agent-hidden .cl-ssol-files {
        display: flex !important;
        grid-column: 1;
    }
}

.cl-ssol-wysiwyg {
    display: flex;
    height: 100%;
    min-height: 0;
    flex-direction: column;
    background: #eef2f4 !important;
}
.cl-ssol-wysiwyg-toolbar {
    flex: 0 0 auto;
    border-bottom: 1px solid var(--ssol-line);
    background: #ffffff !important;
}
.cl-ssol-editor-toolbar-toggle {
    display: inline-flex;
    align-items: center;
    width: 100%;
    min-height: 34px;
    padding: 0 14px;
    border: 0;
    border-bottom: 1px solid var(--ssol-line);
    background: #ffffff !important;
    color: var(--ssol-ink-soft) !important;
    cursor: pointer;
    font: 800 10px/1 var(--ssol-font, Montserrat, Avenir, sans-serif);
    letter-spacing: .08em;
    text-align: left;
    text-transform: uppercase;
}
.cl-ssol-editor-toolbar-toggle > span { color: var(--ssol-ink-soft); }
.cl-ssol-editor-toolbar-toggle svg {
    width: 15px;
    height: 15px;
    margin-left: auto;
    color: var(--ssol-accent-strong);
    transition: transform .16s ease;
}
.cl-ssol-wysiwyg-toolbar.is-collapsed .cl-ssol-editor-toolbar-toggle svg { transform: rotate(180deg); }
.cl-ssol-wysiwyg-controls {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 5px;
    padding: 8px 14px;
}
.cl-ssol-wysiwyg-toolbar.is-collapsed .cl-ssol-wysiwyg-controls { display: none; }
.cl-ssol-editor-tool-group {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding-right: 6px;
    border-right: 1px solid var(--ssol-line);
}
.cl-ssol-editor-tool-group:last-of-type { border-right: 0; }
.cl-ssol-editor-icon {
    display: inline-grid;
    width: 30px;
    height: 30px;
    place-items: center;
    padding: 0 !important;
    border: 1px solid transparent !important;
    border-radius: 6px;
    background: transparent !important;
    color: #536270 !important;
    cursor: pointer;
}
.cl-ssol-editor-icon svg {
    width: 16px;
    height: 16px;
}
.cl-ssol-editor-icon:hover,
.cl-ssol-editor-icon:focus-visible {
    border-color: #c6d4da !important;
    background: #eff5f6 !important;
    color: var(--ssol-accent-strong) !important;
}
.cl-ssol-editor-icon:focus-visible,
.cl-ssol-editor-toolbar-toggle:focus-visible {
    outline: 2px solid var(--ssol-accent-strong);
    outline-offset: 2px;
}
.cl-ssol-editor-privacy {
    display: inline-flex;
    align-items: center;
    margin-left: auto;
    cursor: pointer;
}
.cl-ssol-editor-save-status {
    max-width: 160px;
    overflow: hidden;
    color: var(--ssol-muted);
    font-size: 10px;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cl-ssol-editor-save[aria-busy="true"] {
    opacity: .6;
    pointer-events: none;
}
.cl-ssol-mobile-agent-bubble { display: none; }
@media (max-width: 1040px) {
    .cl-ssol-mobile-agent-bubble {
        position: fixed;
        right: 14px;
        bottom: calc(54px + env(safe-area-inset-bottom, 0px));
        z-index: 48;
        display: grid;
        width: 44px;
        height: 44px;
        place-items: center;
        padding: 0;
        border: 1px solid rgba(255,255,255,.82);
        border-radius: 50%;
        background: var(--ssol-accent-strong) !important;
        color: #fff !important;
        box-shadow: 0 8px 22px rgba(18, 62, 71, .28);
        cursor: pointer;
        transition: transform .16s ease, box-shadow .16s ease;
    }
    .cl-ssol-mobile-agent-bubble:hover,
    .cl-ssol-mobile-agent-bubble:focus-visible {
        transform: translateY(-2px);
        box-shadow: 0 11px 26px rgba(18, 62, 71, .34);
    }
    .cl-ssol-mobile-agent-bubble:focus-visible {
        outline: 2px solid var(--ssol-accent-strong);
        outline-offset: 3px;
    }
    .cl-ssol-mobile-agent-bubble svg { width: 20px; height: 20px; }
}
@media (max-width: 1040px) {
    .cl-ssol-workspace-host .cls-file {
        overflow: hidden;
        touch-action: pan-y;
    }
    .cl-ssol-file-swipe-actions {
        position: absolute;
        z-index: 1;
        top: 0;
        right: 0;
        bottom: 0;
        display: flex;
        width: 96px;
    }
    .cl-ssol-file-swipe-actions button {
        display: grid;
        width: 48px;
        place-items: center;
        border: 0;
        color: #fff;
        cursor: pointer;
    }
    .cl-ssol-file-swipe-actions svg { width: 18px; height: 18px; }
    .cl-ssol-file-swipe-delete { background: #b7444d !important; }
    .cl-ssol-file-swipe-more { background: #4f6470 !important; }
    .cl-ssol-workspace-host .cls-file__ico,
    .cl-ssol-workspace-host .cls-file__main,
    .cl-ssol-workspace-host .cl-ssol-file-menu {
        position: relative;
        z-index: 2;
        transition: transform .18s ease;
    }
    .cl-ssol-workspace-host .cls-file.is-swipe-open .cls-file__ico,
    .cl-ssol-workspace-host .cls-file.is-swipe-open .cls-file__main,
    .cl-ssol-workspace-host .cls-file.is-swipe-open .cl-ssol-file-menu {
        transform: translateX(-96px);
    }
}

.cl-ssol-editor-privacy input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
}
.cl-ssol-editor-privacy .cl-ssol-editor-icon {
    border-color: #d7e0e4 !important;
}
.cl-ssol-editor-privacy input:checked + .cl-ssol-editor-icon {
    border-color: var(--ssol-accent-strong) !important;
    background: var(--ssol-accent-strong) !important;
    color: #ffffff !important;
}
.cl-ssol-editor-privacy input:focus-visible + .cl-ssol-editor-icon {
    outline: 2px solid var(--ssol-accent-strong);
    outline-offset: 2px;
}
.cl-ssol-wysiwyg-toolbar .cl-ssol-editor-save {
    border-color: var(--ssol-accent-strong) !important;
    background: var(--ssol-accent-strong) !important;
    color: #ffffff !important;
}
.cl-ssol-wysiwyg-toolbar .cl-ssol-editor-save:hover,
.cl-ssol-wysiwyg-toolbar .cl-ssol-editor-save:focus-visible {
    background: #145e69 !important;
    color: #ffffff !important;
}
.cl-ssol-wysiwyg-frame {
    display: block;
    width: 100%;
    min-height: 0;
    flex: 1 1 auto;
    border: 0;
    background: #ffffff;
}
@media (max-width: 620px) {
    .cl-ssol-wysiwyg-controls { gap: 3px; padding: 7px 10px; }
    .cl-ssol-editor-tool-group { padding-right: 4px; }
    .cl-ssol-editor-privacy { margin-left: 0; }
}
.cl-ssol-compiler-notice {
    margin: 0 0 18px;
    padding: 10px 12px;
    border-left: 3px solid var(--ssol-accent);
    background: var(--ssol-accent-soft) !important;
    color: var(--ssol-ink-soft) !important;
    font-size: 13px;
}
.cl-ssol-compiler-fields {
    display: grid;
    gap: 12px;
}
.cl-ssol-compiler-field {
    display: grid;
    gap: 5px;
    color: var(--ssol-ink-soft) !important;
    font-size: 12px;
    font-weight: 700;
}
.cl-ssol-compiler-field input {
    min-height: 38px;
    padding: 8px 10px;
    border: 1px solid var(--ssol-line-strong);
    border-radius: 6px;
    background: #ffffff !important;
    color: var(--ssol-ink) !important;
    font: inherit;
}

/* Studio 0.14.1: persistent deterministic compiler workbench. */
.cl-ssol-compiler-workbench {
    height: 100%;
    min-height: 0;
    overflow: auto;
    padding: 22px;
    background: #f4f7f8;
    color: var(--ssol-ink);
}
.cl-ssol-compiler-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    max-width: 1220px;
    margin: 0 auto 18px;
    padding: 0 2px;
}
.cl-ssol-compiler-head h3 {
    margin: 4px 0 5px;
    color: var(--ssol-ink);
    font-size: 22px;
    letter-spacing: -.025em;
}

.cl-ssol-compiler-title-row {
    display: flex;
    align-items: center;
    gap: 7px;
}
.cl-ssol-compiler-help-button {
    display: inline-grid;
    width: 24px;
    height: 24px;
    place-items: center;
    margin-top: 2px;
    padding: 0;
    border: 1px solid var(--ssol-line-strong);
    border-radius: 50%;
    background: #fff;
    color: var(--ssol-muted);
    cursor: pointer;
    transition: color .16s ease, border-color .16s ease, background .16s ease;
}
.cl-ssol-compiler-help-button svg {
    width: 14px;
    height: 14px;
}
.cl-ssol-compiler-help-button:hover,
.cl-ssol-compiler-help-button[aria-expanded="true"] {
    border-color: var(--ssol-accent-strong);
    background: var(--ssol-accent-soft);
    color: var(--ssol-accent-strong);
}
.cl-ssol-compiler-help-button:focus-visible {
    outline: 2px solid rgba(28, 116, 130, .35);
    outline-offset: 2px;
}
.cl-ssol-compiler-head > div:first-child {
    position: relative;
}
.cl-ssol-compiler-popover {
    position: absolute;
    z-index: 4;
    top: calc(100% + 10px);
    left: 0;
    width: min(360px, calc(100vw - 52px));
    padding: 14px 15px;
    border: 1px solid var(--ssol-line-strong);
    border-radius: 9px;
    background: #fff;
    color: var(--ssol-ink);
    box-shadow: 0 16px 34px rgba(25, 45, 60, .16);
    font-size: 12px;
    line-height: 1.45;
}
.cl-ssol-compiler-popover[hidden] {
    display: none;
}
.cl-ssol-compiler-popover strong {
    display: block;
    margin-bottom: 7px;
    font-size: 13px;
}
.cl-ssol-compiler-popover ol {
    margin: 0 0 8px;
    padding-left: 19px;
}
.cl-ssol-compiler-popover li + li {
    margin-top: 3px;
}
.cl-ssol-compiler-popover p {
    margin: 0;
    padding-top: 8px;
    border-top: 1px solid var(--ssol-line);
    color: var(--ssol-ink-soft);
    font-size: 11px;
}
.cl-ssol-compiler-head p {
    max-width: 650px;
    margin: 0;
    color: var(--ssol-muted);
    font-size: 13px;
    line-height: 1.5;
}
.cl-ssol-compiler-shield {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 10px;
    border: 1px solid #b8ddd8;
    border-radius: 999px;
    background: #e6f5f2;
    color: #17695f;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .02em;
}
.cl-ssol-compiler-layout {
    display: grid;
    grid-template-columns: minmax(250px, 330px) minmax(0, 1fr);
    gap: 16px;
    max-width: 1220px;
    min-height: 510px;
    margin: 0 auto;
}
.cl-ssol-compiler-form,
.cl-ssol-compiler-preview-wrap {
    min-width: 0;
    border: 1px solid var(--ssol-line);
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 12px 30px rgba(29, 47, 62, .07);
}
.cl-ssol-compiler-form {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 16px;
}
.cl-ssol-compiler-form-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--ssol-line);
    color: var(--ssol-ink);
    font-size: 13px;
}
.cl-ssol-compiler-form-head span {
    color: var(--ssol-muted);
    font-size: 11px;
    font-weight: 600;
}
.cl-ssol-compiler-help {
    margin: -5px 0 0;
    color: var(--ssol-muted);
    font-size: 12px;
    line-height: 1.45;
}
.cl-ssol-compiler-field > span {
    display: flex;
    align-items: baseline;
    gap: 6px;
}
.cl-ssol-compiler-field small {
    color: var(--ssol-muted);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 10px;
    font-weight: 600;
}
.cl-ssol-compiler-field input:focus {
    outline: 2px solid rgba(28, 116, 130, .25);
    outline-offset: 1px;
    border-color: var(--ssol-accent-strong);
}
.cl-ssol-compiler-target input[readonly] {
    cursor: default;
    border-style: dashed;
    background: #f4f7f8 !important;
    color: var(--ssol-muted) !important;
    font-size: 11px;
}
.cl-ssol-compiler-target {
    margin-top: 4px;
    padding-top: 14px;
    border-top: 1px solid var(--ssol-line);
}
.cl-ssol-compiler-safe {
    display: grid;
    gap: 3px;
    padding: 10px 11px;
    border-radius: 7px;
    background: #edf7f5;
    color: #1f655e;
    font-size: 11px;
    line-height: 1.4;
}
.cl-ssol-compiler-safe strong {
    font-size: 11px;
}
.cl-ssol-compiler-form > .cl-ssol-button {
    width: 100%;
    min-height: 40px;
    margin-top: auto;
}
.cl-ssol-compiler-preview-wrap {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    min-height: 0;
    padding: 16px;
}
.cl-ssol-compiler-preview {
    min-height: 425px;
    overflow: auto;
    padding: 18px;
    background: #f6f8f9;
}
.cl-ssol-compiler-preview .cl-ssol-document {
    max-width: 760px;
    min-height: 100%;
    margin: 0 auto;
    background: #fff;
    box-shadow: 0 1px 5px rgba(24, 39, 52, .12);
}
.cl-ssol-compiler-frame {
    display: block;
    width: 100%;
    min-height: 500px;
    border: 0;
    background: #fff;
    box-shadow: 0 1px 5px rgba(24, 39, 52, .12);
}
.cl-ssol-compiler-text-preview {
    min-height: 100%;
    margin: 0;
    padding: 18px;
    white-space: pre-wrap;
    background: #fff;
    box-shadow: 0 1px 5px rgba(24, 39, 52, .12);
}
@media (max-width: 720px) {
    .cl-ssol-compiler-workbench { padding: 14px; }
    .cl-ssol-compiler-head { display: grid; gap: 10px; }
    .cl-ssol-compiler-shield { width: fit-content; }
    .cl-ssol-compiler-layout { grid-template-columns: 1fr; min-height: 0; }
    .cl-ssol-compiler-preview { min-height: 330px; }
    .cl-ssol-compiler-frame { min-height: 380px; }
}

/* Studio 0.15: command palette, file actions and first-access onboarding. */
.cl-ssol-command-trigger {
    min-width: 38px;
    padding: 0 8px !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: -.02em;
}
.cl-ssol-command-modal .cl-ssol-modal-body { padding-top: 14px; }
.cl-ssol-command-search {
    width: 100%;
    height: 42px;
    padding: 0 12px;
    border: 1px solid var(--ssol-line-strong);
    border-radius: 7px;
    background: #fff;
    color: var(--ssol-ink);
    font: inherit;
    font-size: 13px;
}
.cl-ssol-command-search:focus { outline: 2px solid rgba(28, 116, 130, .23); outline-offset: 1px; border-color: var(--ssol-accent-strong); }
.cl-ssol-command-list { display: grid; gap: 3px; margin-top: 10px; }
.cl-ssol-command-list button {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    width: 100%;
    min-height: 43px;
    padding: 8px 10px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--ssol-ink);
    font: inherit;
    text-align: left;
    cursor: pointer;
}
.cl-ssol-command-list button:hover,
.cl-ssol-command-list button[aria-selected="true"] { background: var(--ssol-accent-soft); color: var(--ssol-accent-strong); }
.cl-ssol-command-list button span { overflow: hidden; font-size: 12px; font-weight: 740; text-overflow: ellipsis; white-space: nowrap; }
.cl-ssol-command-list button small { max-width: 165px; overflow: hidden; color: var(--ssol-muted); font-size: 10px; text-align: right; text-overflow: ellipsis; white-space: nowrap; }
.cl-ssol-command-empty { margin: 5px 0; padding: 11px; color: var(--ssol-muted); font-size: 12px; text-align: center; }
.cl-ssol-command-foot { margin: 12px 0 0; color: var(--ssol-muted); font-size: 10px; text-align: center; }

.cl-ssol-files { position: relative; }
.cl-ssol-file-action-palette {
    position: absolute;
    z-index: 7;
    right: 12px;
    bottom: 14px;
    width: min(270px, calc(100% - 24px));
    overflow: hidden;
    border: 1px solid #b6d2d8;
    border-radius: 9px;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 13px 28px rgba(28, 54, 67, .16);
    backdrop-filter: blur(9px);
}
.cl-ssol-file-action-palette[hidden] { display: none; }
.cl-ssol-file-action-palette.is-dragging { cursor: grabbing; box-shadow: 0 18px 35px rgba(28, 54, 67, .23); user-select: none; }
.cl-ssol-file-action-palette header {
    display: grid;
    grid-template-columns: 15px minmax(0, 1fr) auto;
    align-items: center;
    gap: 6px;
    min-height: 43px;
    padding: 8px 9px;
    border-bottom: 1px solid #d7e5e8;
    background: #eff8f9;
    cursor: grab;
}
.cl-ssol-file-action-grip { color: var(--ssol-accent-strong); font-size: 16px; line-height: 1; }
.cl-ssol-file-action-palette header div { min-width: 0; }
.cl-ssol-file-action-palette header small { display: block; color: var(--ssol-accent-strong); font-size: 8px; font-weight: 800; letter-spacing: .08em; }
.cl-ssol-file-action-palette header strong { display: block; overflow: hidden; color: var(--ssol-ink); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.cl-ssol-file-action-drag-label { color: var(--ssol-muted); font-size: 9px; }
.cl-ssol-file-action-buttons { display: grid; grid-template-columns: 1fr; gap: 4px; padding: 8px; }
.cl-ssol-file-action-buttons button {
    min-height: 32px;
    padding: 6px 8px;
    border: 1px solid var(--ssol-line);
    border-radius: 5px;
    background: #fff;
    color: var(--ssol-ink-soft);
    font: inherit;
    font-size: 10px;
    font-weight: 720;
    text-align: left;
    cursor: pointer;
}
.cl-ssol-file-action-buttons button:hover { border-color: var(--ssol-accent); background: var(--ssol-accent-soft); color: var(--ssol-accent-strong); }
.cl-ssol-file-action-palette > p { margin: 0; padding: 0 9px 9px; color: var(--ssol-muted); font-size: 9px; line-height: 1.35; }

.cl-ssol-modal.cl-ssol-onboarding-modal .cl-ssol-modal-body { padding-top: 17px; }
.cl-ssol-onboarding-steps { display: grid; gap: 11px; }
.cl-ssol-onboarding-steps article { display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: 10px; align-items: start; padding: 10px; border: 1px solid var(--ssol-line); border-radius: 7px; background: #fbfcfd; }
.cl-ssol-onboarding-steps b { display: grid; width: 26px; height: 26px; place-items: center; border-radius: 50%; background: var(--ssol-accent-soft); color: var(--ssol-accent-strong); font-size: 11px; }
.cl-ssol-onboarding-steps strong { display: block; color: var(--ssol-ink); font-size: 12px; }
.cl-ssol-onboarding-steps span { display: block; margin-top: 2px; color: var(--ssol-muted); font-size: 11px; line-height: 1.45; }
.cl-ssol-onboarding-steps code { padding: 1px 3px; border-radius: 3px; background: #e7eff1; color: var(--ssol-ink-soft); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .92em; }
.cl-ssol-onboarding-actions { display: flex; justify-content: flex-end; margin-top: 16px; }

@media (max-width: 1040px) {
    .cl-ssol-file-action-palette { display: none; }
}


/* Studio 0.15.2: quiet chrome and editorial onboarding. */
.cl-ssol-micro-footer {
    display: flex;
    flex: 0 0 42px;
    align-items: center;
    justify-content: center;
    border-top: 1px solid var(--ssol-line);
    background: #f8fafb !important;
}
.cl-ssol-micro-controls {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    min-height: 28px;
    padding: 3px;
    border: 1px solid var(--ssol-line);
    border-radius: 7px;
    background: #ffffff;
}
.cl-ssol-micro-controls > span {
    width: 1px;
    height: 16px;
    margin: 0 3px;
    background: var(--ssol-line);
}
.cl-ssol-micro-controls button {
    display: grid;
    width: 27px;
    height: 27px;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 5px;
    background: transparent !important;
    color: var(--ssol-muted) !important;
    font: 800 10px/1 "Montserrat", "Avenir Next", Avenir, system-ui, sans-serif;
    cursor: pointer;
}
.cl-ssol-micro-controls button:hover,
.cl-ssol-micro-controls button[aria-pressed="true"] {
    background: var(--ssol-accent-soft) !important;
    color: var(--ssol-accent-strong) !important;
}
.cl-ssol-micro-controls svg { width: 15px; height: 15px; }
.cl-ssol-micro-controls .cl-ssol-command-trigger { width: auto; min-width: 34px; padding-inline: 7px !important; }

.cl-ssol-interface-footer {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    gap: 12px;
    padding-inline: 15px;
}
.cl-ssol-footer-links,
.cl-ssol-footer-theme {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    gap: 7px;
}
.cl-ssol-footer-links { justify-self: start; }
.cl-ssol-footer-links a,
.cl-ssol-footer-links span {
    color: var(--ssol-muted) !important;
    font-size: 10px;
    font-weight: 650;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
}
.cl-ssol-footer-links a:hover,
.cl-ssol-footer-links a:focus-visible { color: var(--ssol-accent-strong) !important; text-decoration: underline; }
.cl-ssol-footer-links span { color: var(--ssol-line-strong) !important; font-weight: 500; }
.cl-ssol-footer-theme { justify-self: end; }
.cl-ssol-footer-theme .wp-dark-mode-switcher,
.cl-ssol-footer-theme .wppool-dark-mode-switcher {
    display: flex;
    margin: 0;
    transform: scale(.84);
    transform-origin: right center;
}

@media (max-width: 700px) {
    .cl-ssol-interface-footer {
        grid-template-columns: minmax(0, 1fr) auto;
        row-gap: 2px;
        min-height: 64px;
        padding-block: 5px;
    }
    .cl-ssol-interface-footer .cl-ssol-micro-controls {
        grid-column: 1 / -1;
        grid-row: 2;
        justify-self: center;
    }
    .cl-ssol-footer-links a,
    .cl-ssol-footer-links span { font-size: 9px; }
}

.cl-ssol-modal.cl-ssol-onboarding-modal {
    width: min(560px, 100%);
    overflow: hidden;
    border: 0;
    border-radius: 14px;
    box-shadow: 0 26px 80px rgba(18, 35, 46, .26);
}
.cl-ssol-modal.cl-ssol-onboarding-modal .cl-ssol-modal-head {
    align-items: flex-start;
    padding: 30px 32px 5px;
    border-bottom: 0;
    background: #fff !important;
}
.cl-ssol-modal.cl-ssol-onboarding-modal .cl-ssol-modal-head h2 {
    margin-top: 5px;
    color: var(--ssol-ink) !important;
    font-size: 28px;
    font-weight: 770;
    letter-spacing: -.035em;
}
.cl-ssol-modal.cl-ssol-onboarding-modal .cl-ssol-modal-head .cl-ssol-pane-kicker {
    color: var(--ssol-accent-strong) !important;
    font-size: 10px;
    letter-spacing: .12em;
}
.cl-ssol-modal.cl-ssol-onboarding-modal .cl-ssol-modal-head .cl-ssol-icon-button {
    width: 31px;
    height: 31px;
    border-color: transparent;
    background: #f3f6f7 !important;
}
.cl-ssol-modal.cl-ssol-onboarding-modal .cl-ssol-modal-body { padding: 10px 32px 30px; }
.cl-ssol-onboarding-lead {
    max-width: 470px;
    margin: 0 0 24px;
    color: #536270;
    font-size: 15px;
    line-height: 1.58;
}
.cl-ssol-onboarding-steps {
    gap: 0;
    border-top: 1px solid var(--ssol-line);
}
.cl-ssol-onboarding-steps article {
    grid-template-columns: 32px minmax(0, 1fr);
    gap: 13px;
    padding: 15px 0;
    border: 0;
    border-bottom: 1px solid var(--ssol-line);
    border-radius: 0;
    background: transparent;
}
.cl-ssol-onboarding-steps b {
    width: 28px;
    height: 28px;
    border: 1px solid #b8dce2;
    border-radius: 7px;
    background: #f0f8f9;
    color: var(--ssol-accent-strong);
    font-size: 9px;
    letter-spacing: .04em;
}
.cl-ssol-onboarding-steps strong {
    color: var(--ssol-ink) !important;
    font-size: 13px;
    font-weight: 760;
}
.cl-ssol-onboarding-steps span {
    margin-top: 3px;
    color: var(--ssol-muted) !important;
    font-size: 12px;
    line-height: 1.48;
}
.cl-ssol-onboarding-actions {
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-top: 22px;
}
.cl-ssol-onboarding-actions > span {
    max-width: 225px;
    color: var(--ssol-muted);
    font-size: 11px;
    line-height: 1.4;
}
.cl-ssol-onboarding-actions kbd {
    display: inline-grid;
    min-width: 17px;
    height: 17px;
    place-items: center;
    border: 1px solid var(--ssol-line-strong);
    border-bottom-color: #aebbc4;
    border-radius: 4px;
    background: #fff;
    color: var(--ssol-ink-soft);
    font: 800 10px/1 ui-monospace, SFMono-Regular, Menlo, monospace;
}
.cl-ssol-onboarding-actions .cl-ssol-button {
    min-height: 38px;
    padding-inline: 14px;
    white-space: nowrap;
}

@media (max-width: 560px) {
    .cl-ssol-micro-footer { flex-basis: 40px; }
    .cl-ssol-modal.cl-ssol-onboarding-modal .cl-ssol-modal-head { padding: 24px 22px 3px; }
    .cl-ssol-modal.cl-ssol-onboarding-modal .cl-ssol-modal-head h2 { font-size: 24px; }
    .cl-ssol-modal.cl-ssol-onboarding-modal .cl-ssol-modal-body { padding: 9px 22px 23px; }
    .cl-ssol-onboarding-lead { margin-bottom: 19px; font-size: 14px; }
    .cl-ssol-onboarding-actions { align-items: stretch; flex-direction: column; }
    .cl-ssol-onboarding-actions > span { max-width: none; text-align: center; }
    .cl-ssol-onboarding-actions .cl-ssol-button { width: 100%; }
}