/* Sapphire Canvas V1 — lab.sapphire-project.pro Demo presentation. */
.canvas-page,
.canvas-bo {
    --canvas-font: "Inter", "Segoe UI", sans-serif;
    --canvas-display: "Manrope", "Inter", sans-serif;
    --canvas-serif: "Iowan Old Style", "Palatino Linotype", Georgia, serif;
    --canvas-ink: #07111f;
    --canvas-ink-soft: #101d2e;
    --canvas-text: #172437;
    --canvas-muted: #66758a;
    --canvas-faint: #7d8999;
    --canvas-line: #dce3ec;
    --canvas-line-strong: #b6c7dc;
    --canvas-paper: #ffffff;
    --canvas-mist: #f5f7fa;
    --canvas-white: #fff;
    --canvas-teal: #1677ff;
    --canvas-teal-bright: #50a1ff;
    --canvas-teal-soft: #eaf3ff;
    --canvas-gold: #ff7358;
    --canvas-gold-soft: #fff0eb;
    --canvas-green: #23724f;
    --canvas-green-soft: #e1f2e8;
    --canvas-amber: #916117;
    --canvas-amber-soft: #fbefd8;
    --canvas-red: #a44250;
    --canvas-red-soft: #f9e8eb;
    --canvas-shadow: 0 24px 70px rgba(17, 35, 60, .12);
    --canvas-shadow-soft: 0 14px 38px rgba(17, 35, 60, .08);
    box-sizing: border-box;
    color: var(--canvas-text);
    font-family: var(--canvas-font);
}

/* Provider-declared Canvas presentation variants. */
.canvas-page .canvas-hero[data-variant="statement"] .canvas-hero__grid,
.canvas-page .canvas-hero[data-variant="centered"] .canvas-hero__grid {
    grid-template-columns: minmax(0, 1fr);
}
.canvas-page .canvas-hero[data-variant="statement"] .canvas-hero__copy {
    max-width: 1080px;
}
.canvas-page .canvas-hero[data-variant="statement"] .canvas-hero__media {
    justify-self: stretch;
    margin-block-start: clamp(8px, 2vw, 24px);
    max-width: 1120px;
    transform: none;
}
.canvas-page .canvas-hero[data-variant="statement"] .canvas-hero__media img {
    aspect-ratio: 16 / 7;
}
.canvas-page .canvas-hero[data-variant="centered"] .canvas-hero__copy {
    justify-self: center;
    max-width: 920px;
    text-align: center;
}
.canvas-page .canvas-hero[data-variant="centered"] h2,
.canvas-page .canvas-hero[data-variant="centered"] .canvas-lede {
    margin-inline: auto;
    max-width: 18ch;
}
.canvas-page .canvas-hero[data-variant="centered"] .canvas-lede {
    max-width: 62ch;
}
.canvas-page .canvas-hero[data-variant="centered"] .canvas-actions {
    justify-content: center;
}
.canvas-page .canvas-hero[data-variant="centered"] .canvas-hero__media {
    justify-self: center;
    margin-block-start: clamp(6px, 1.5vw, 18px);
    max-width: 980px;
    transform: none;
    width: 100%;
}
.canvas-page .canvas-hero[data-variant="centered"] .canvas-hero__media img {
    aspect-ratio: 16 / 8;
}
.canvas-page .canvas-hero[data-variant="split"] .canvas-hero__grid {
    grid-template-columns: minmax(0, 1.16fr) minmax(300px, .84fr);
}

.canvas-page .canvas-split[data-variant="browser-frame"] .canvas-split__media,
.canvas-page .canvas-split[data-variant="device-frame"] .canvas-split__media {
    background: #08121e;
    border: 1px solid rgba(130, 160, 184, .34);
    box-shadow: 0 30px 74px rgba(2, 12, 22, .28);
}
.canvas-page .canvas-split[data-variant="browser-frame"] .canvas-split__media {
    border-radius: 18px;
    padding-block-start: 34px;
}
.canvas-page .canvas-split[data-variant="browser-frame"] .canvas-split__media::before {
    background: #ff725f;
    border-radius: 50%;
    box-shadow: 14px 0 #f4bd4f, 28px 0 #52c888;
    content: "";
    height: 8px;
    inset-block-start: 13px;
    inset-inline-start: 16px;
    position: absolute;
    width: 8px;
    z-index: 2;
}
.canvas-page .canvas-split[data-variant="browser-frame"] .canvas-split__media img {
    aspect-ratio: 16 / 10;
    background: #fff;
    object-fit: contain;
}
.canvas-page .canvas-split[data-variant="device-frame"] .canvas-split__media {
    border: 6px solid #101923;
    border-radius: 38px;
    justify-self: center;
    max-width: 430px;
    padding: 10px;
    width: min(100%, 430px);
}
.canvas-page .canvas-split[data-variant="device-frame"] .canvas-split__media::before {
    background: rgba(226, 238, 246, .28);
    border-radius: 999px;
    content: "";
    height: 4px;
    inset-block-start: 8px;
    inset-inline-start: 50%;
    position: absolute;
    transform: translateX(-50%);
    width: 52px;
    z-index: 2;
}
.canvas-page .canvas-split[data-variant="device-frame"] .canvas-split__media img {
    aspect-ratio: 4 / 5;
    background: #fff;
    border-radius: 25px;
    object-fit: contain;
}
.canvas-page:dir(rtl) .canvas-split[data-variant="device-frame"] .canvas-split__media::before {
    transform: translateX(50%);
}

.canvas-page .canvas-features[data-variant="list"] .canvas-card-grid {
    grid-template-columns: minmax(0, 1fr);
}
.canvas-page .canvas-features[data-variant="list"] .canvas-card {
    align-items: start;
    display: grid;
    gap: 6px clamp(18px, 3vw, 38px);
    grid-template-columns: auto minmax(0, 1fr);
}
.canvas-page .canvas-features[data-variant="list"] .canvas-card__index {
    grid-row: 1 / span 3;
}
.canvas-page .canvas-features[data-variant="list"] .canvas-card :is(h3, p, a) {
    grid-column: 2;
}
.canvas-page .canvas-features[data-variant="slider"] .canvas-card-grid,
.canvas-page .canvas-catalog[data-variant="slider"] .canvas-catalog__grid {
    display: flex;
    gap: clamp(14px, 2vw, 22px);
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    padding: 3px 2px 20px;
    scroll-padding-inline: 2px;
    scroll-snap-type: inline mandatory;
    scrollbar-color: var(--canvas-teal) var(--canvas-line);
    scrollbar-width: thin;
}
.canvas-page .canvas-features[data-variant="slider"] .canvas-card {
    flex: 0 0 min(82vw, 420px);
    scroll-snap-align: start;
}
.canvas-page .canvas-catalog[data-variant="slider"] .canvas-catalog__grid article {
    flex: 0 0 min(84vw, 470px);
    scroll-snap-align: start;
}
.canvas-page .canvas-features[data-variant="slider"] .canvas-card-grid:focus-visible,
.canvas-page .canvas-catalog[data-variant="slider"] .canvas-catalog__grid:focus-visible {
    outline: 3px solid var(--canvas-gold);
    outline-offset: 5px;
}
.canvas-page .canvas-catalog[data-variant="list"] .canvas-catalog__grid {
    grid-template-columns: minmax(0, 1fr);
}
.canvas-page .canvas-catalog[data-variant="list"] .canvas-catalog__grid article {
    display: grid;
    grid-template-columns: minmax(210px, 32%) minmax(0, 1fr);
}
.canvas-page .canvas-catalog[data-variant="list"] .canvas-catalog__grid article > img {
    aspect-ratio: auto;
    height: 100%;
    min-height: 220px;
}
.canvas-page .canvas-catalog[data-variant="list"] .canvas-catalog__grid article > div:only-child {
    grid-column: 1 / -1;
}

@media (max-width: 900px) {
    .canvas-page .canvas-hero[data-variant="split"] .canvas-hero__grid {
        grid-template-columns: minmax(0, 1fr);
    }
}
@media (max-width: 600px) {
    .canvas-page .canvas-hero[data-variant="statement"] .canvas-hero__media img,
    .canvas-page .canvas-hero[data-variant="centered"] .canvas-hero__media img {
        aspect-ratio: 4 / 3;
    }
    .canvas-page .canvas-features[data-variant="list"] .canvas-card {
        grid-template-columns: minmax(0, 1fr);
    }
    .canvas-page .canvas-features[data-variant="list"] .canvas-card__index {
        grid-row: auto;
    }
    .canvas-page .canvas-features[data-variant="list"] .canvas-card :is(h3, p, a) {
        grid-column: 1;
    }
    .canvas-page .canvas-catalog[data-variant="list"] .canvas-catalog__grid article {
        grid-template-columns: minmax(0, 1fr);
    }
    .canvas-page .canvas-catalog[data-variant="list"] .canvas-catalog__grid article > img {
        aspect-ratio: 16 / 10;
        min-height: 0;
    }
}

.canvas-page *, .canvas-page *::before, .canvas-page *::after,
.canvas-bo *, .canvas-bo *::before, .canvas-bo *::after { box-sizing: border-box; }
.canvas-page :is(h1, h2, h3, p, ol, ul, dl, dd, figure, blockquote),
.canvas-bo :is(h1, h2, h3, p, ol, ul, dl, dd, figure) { margin-block-start: 0; }
.canvas-page :is(h1, h2, h3), .canvas-bo :is(h1, h2, h3) { font-family: var(--canvas-display); }
.canvas-page a, .canvas-bo a { color: inherit; }
.canvas-page img, .canvas-bo img { display: block; max-width: 100%; }
.canvas-page :focus-visible,
.canvas-bo :focus-visible,
.canvas-bo-preview-dialog :focus-visible,
.canvas-bo-media-dialog :focus-visible { outline: 3px solid var(--canvas-teal); outline-offset: 3px; }
.canvas-page [hidden], .canvas-bo [hidden] { display: none !important; }

/* Public composition */
.canvas-page { background: var(--canvas-paper); min-width: 0; overflow: clip; }
.canvas-page__intro { margin-inline: auto; max-width: 1280px; padding: clamp(48px, 7vw, 98px) clamp(22px, 4vw, 58px) clamp(30px, 4vw, 54px); }
.canvas-page__title-visually-hidden { clip: rect(0 0 0 0); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; }
.canvas-page__intro h1 { color: var(--canvas-ink); font-size: clamp(2.65rem, 6vw, 5.8rem); font-weight: 780; letter-spacing: -.06em; line-height: .94; margin: 8px 0 18px; max-width: 14ch; }
.canvas-page__intro p { color: var(--canvas-muted); font-size: clamp(1.06rem, 1.6vw, 1.3rem); line-height: 1.7; margin: 0; max-width: 66ch; }
.canvas-page__sections { display: grid; min-width: 0; }
.canvas-section { background: var(--canvas-paper); color: var(--canvas-text); min-width: 0; padding-block: clamp(62px, 8vw, 116px); position: relative; }
.canvas-section[data-theme="mist"] { background: var(--canvas-mist); }
.canvas-section[data-theme="ink"],
.canvas-section[data-theme="signature"] { background: var(--canvas-ink); color: #eaf3ff; }
.canvas-section[data-theme="gold"] { background: var(--canvas-gold-soft); }
.canvas-shell { margin-inline: auto; max-width: 1280px; padding-inline: clamp(22px, 4vw, 58px); position: relative; }
.canvas-kicker { color: var(--canvas-teal); display: inline-block; font-size: .7rem; font-weight: 850; letter-spacing: .14em; line-height: 1.3; margin-block-end: 10px; text-transform: uppercase; }
[data-theme="ink"] .canvas-kicker, [data-theme="signature"] .canvas-kicker { color: #50a1ff; }
.canvas-section h2 { color: var(--canvas-ink); font-size: clamp(2.15rem, 4.4vw, 4.5rem); font-weight: 770; letter-spacing: -.055em; line-height: 1; margin: 0; text-wrap: balance; }
[data-theme="ink"] h2, [data-theme="signature"] h2 { color: #fff; }
.canvas-section h3 { color: var(--canvas-ink); font-size: 1.18rem; font-weight: 760; letter-spacing: -.025em; line-height: 1.25; }
.canvas-lede, .canvas-section__head > p { color: var(--canvas-muted); font-size: clamp(1.04rem, 1.5vw, 1.25rem); line-height: 1.72; margin-block: 18px 0; max-width: 62ch; }
[data-theme="ink"] :is(.canvas-lede, .canvas-section__head > p),
[data-theme="signature"] :is(.canvas-lede, .canvas-section__head > p) { color: #c5d6ea; }
.canvas-section__head { display: grid; margin-block-end: clamp(28px, 4vw, 50px); max-width: 850px; }
.canvas-section__head--compact { align-items: end; grid-template-columns: minmax(0, 1fr); }
.canvas-actions { align-items: center; display: flex; flex-wrap: wrap; gap: 11px; margin-block-start: 28px; }
.canvas-button { align-items: center; border: 1px solid var(--canvas-line-strong); border-radius: 999px; display: inline-flex; font-size: .88rem; font-weight: 790; justify-content: center; min-height: 48px; padding: 10px 20px; text-decoration: none; transition: background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease; }
.canvas-button:hover { transform: translateY(-2px); }
.canvas-button--primary { background: var(--canvas-teal); border-color: var(--canvas-teal); box-shadow: 0 14px 28px rgba(22, 119, 255, .24); color: #fff !important; }
.canvas-button--quiet { background: rgba(255, 255, 255, .78); color: var(--canvas-ink); }
[data-theme="ink"] .canvas-button--quiet, [data-theme="signature"] .canvas-button--quiet { background: rgba(255, 255, 255, .06); border-color: rgba(177, 205, 240, .25); color: #eaf3ff; }

.canvas-hero { background: linear-gradient(138deg, #07111f, #0c2441 58%, #12365e); isolation: isolate; min-height: min(820px, calc(100vh - 80px)); overflow: hidden; padding-block: clamp(72px, 10vw, 140px); }
.canvas-hero::before { background: radial-gradient(circle at 78% 30%, rgba(80, 161, 255, .24), transparent 30%), radial-gradient(circle at 16% 92%, rgba(255, 115, 88, .16), transparent 27%); content: ""; inset: 0; pointer-events: none; position: absolute; }
.canvas-hero::after { background-image: linear-gradient(rgba(255,255,255,.026) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.026) 1px, transparent 1px); background-size: 42px 42px; content: ""; inset: 0; mask-image: linear-gradient(90deg, transparent, #000 50%, #000); pointer-events: none; position: absolute; }
.canvas-hero__grid { align-items: center; display: grid; gap: clamp(42px, 6vw, 82px); grid-template-columns: minmax(0, 1.28fr) minmax(330px, .72fr); z-index: 1; }
.canvas-hero h2 { color: #fff; font-size: clamp(3rem, 5.1vw, 5.55rem); font-weight: 760; letter-spacing: -.065em; line-height: .93; max-width: 12ch; }
.canvas-hero .canvas-lede { color: #c5d6ea; max-width: 54ch; }
.canvas-hero__media { border: 1px solid rgba(80, 161, 255, .24); border-radius: clamp(24px, 4vw, 44px); box-shadow: 0 32px 90px rgba(3, 11, 24, .42); margin: 0; overflow: hidden; position: relative; transform: rotate(1.2deg); }
.canvas-hero__media::after { border: 1px solid rgba(255,255,255,.18); border-radius: inherit; content: ""; inset: 12px; pointer-events: none; position: absolute; }
.canvas-hero__media img { aspect-ratio: 4 / 5; object-fit: cover; width: 100%; }
.canvas-hero__media figcaption, .canvas-split__media figcaption { background: rgba(7, 17, 31, .88); inset: auto 14px 14px; color: #eaf3ff; font-size: .75rem; line-height: 1.45; padding: 9px 12px; position: absolute; }

.canvas-narrative__grid { align-items: start; display: grid; gap: clamp(42px, 7vw, 110px); grid-template-columns: minmax(240px, .75fr) minmax(0, 1.25fr); }
.canvas-narrative header { position: sticky; inset-block-start: 90px; }
.canvas-prose { color: #42526a; font-family: var(--canvas-serif); font-size: clamp(1.08rem, 1.55vw, 1.28rem); line-height: 1.8; min-width: 0; }
.canvas-prose .canvas-lede { color: var(--canvas-ink); font-family: var(--canvas-display); font-size: clamp(1.35rem, 2vw, 1.75rem); font-weight: 580; letter-spacing: -.025em; line-height: 1.5; }
.canvas-rich-text { max-inline-size: 100%; min-inline-size: 0; overflow-wrap: anywhere; }
.canvas-rich-text > :first-child { margin-block-start: 0; }
.canvas-rich-text > :last-child { margin-block-end: 0; }
.canvas-rich-text :is(p, ul, ol, blockquote, pre, .canvas-rich-text__table-wrap) { margin-block: 1.12em; }
.canvas-rich-text :is(h2, h3, h4, h5, h6) { color: var(--canvas-ink); font-family: var(--canvas-display); letter-spacing: -.032em; line-height: 1.18; margin-block: 1.65em .52em; max-inline-size: 34ch; text-wrap: balance; }
.canvas-rich-text h2 { font-size: clamp(1.8rem, 3vw, 2.45rem); }
.canvas-rich-text h3 { font-size: clamp(1.45rem, 2.35vw, 1.88rem); }
.canvas-rich-text h4 { font-size: clamp(1.22rem, 1.9vw, 1.5rem); }
.canvas-rich-text :is(h5, h6) { font-size: .96rem; letter-spacing: .06em; text-transform: uppercase; }
.canvas-rich-text :is(ul, ol) { padding-inline-start: 1.42em; }
.canvas-rich-text :is(ul, ol) :is(ul, ol) { margin-block: .42em; }
.canvas-rich-text li { padding-inline-start: .18em; }
.canvas-rich-text li + li { margin-block-start: .4em; }
.canvas-rich-text li::marker { color: var(--canvas-teal); font-family: var(--canvas-display); font-weight: 800; }
.canvas-rich-text blockquote { background: linear-gradient(118deg, var(--canvas-teal-soft), rgba(234, 243, 255, .18)); border-end-end-radius: 14px; border-end-start-radius: 0; border-inline-start: 4px solid var(--canvas-gold); border-start-end-radius: 14px; border-start-start-radius: 0; color: var(--canvas-ink-soft); font-size: 1.07em; margin-inline: 0; padding: clamp(18px, 3vw, 27px); }
.canvas-rich-text blockquote > :first-child { margin-block-start: 0; }
.canvas-rich-text blockquote > :last-child { margin-block-end: 0; }
.canvas-rich-text strong { color: var(--canvas-ink); font-weight: 760; }
.canvas-rich-text a { color: #1268dc; text-decoration-color: color-mix(in srgb, currentColor 40%, transparent); text-decoration-thickness: .09em; text-underline-offset: .18em; }
.canvas-rich-text a:hover { text-decoration-color: currentColor; }
.canvas-rich-text a:focus-visible { border-radius: 3px; outline: 3px solid var(--canvas-gold); outline-offset: 3px; }
.canvas-rich-text__link-fallback { border-block-end: 1px dotted currentColor; }
.canvas-rich-text code { background: #edf3fa; border: 1px solid #d9e4f0; border-radius: 5px; color: #164a8a; font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace; font-size: .82em; padding: .13em .36em; }
.canvas-rich-text pre { background: #07111f; border: 1px solid #223956; border-radius: 14px; box-shadow: 0 16px 40px rgba(17, 35, 60, .14); color: #eaf3ff; max-inline-size: 100%; overflow-x: auto; padding: clamp(18px, 3vw, 26px); tab-size: 4; }
.canvas-rich-text pre code { background: transparent; border: 0; color: inherit; display: block; font-size: .76em; line-height: 1.68; padding: 0; white-space: pre; }
.canvas-rich-text__table-wrap { background: #fff; border: 1px solid var(--canvas-line); border-radius: 14px; box-shadow: 0 10px 30px rgba(17, 35, 60, .055); max-inline-size: 100%; overflow-x: auto; scrollbar-gutter: stable; -webkit-overflow-scrolling: touch; }
.canvas-rich-text__table-wrap:focus-visible { outline: 3px solid var(--canvas-gold); outline-offset: 3px; }
.canvas-rich-text table { border-collapse: collapse; font-family: var(--canvas-font); font-size: .8em; line-height: 1.5; min-inline-size: 38rem; width: 100%; }
.canvas-rich-text :is(th, td) { border-block-end: 1px solid var(--canvas-line); padding: .82rem 1rem; text-align: start; vertical-align: top; }
.canvas-rich-text th { background: var(--canvas-ink); color: #fff; font-family: var(--canvas-display); font-size: .8em; font-weight: 780; letter-spacing: .055em; }
.canvas-rich-text tr:nth-child(even) td { background: #f7f9fc; }
.canvas-rich-text tr:last-child td { border-block-end: 0; }
.canvas-prose__note { border-inline-start: 3px solid var(--canvas-gold); margin-block: 34px; padding-inline-start: 24px; }
.canvas-prose__note h3 { font-family: var(--canvas-font); margin-block-end: 8px; }
.canvas-narrative:is([data-theme="ink"], [data-theme="signature"]) .canvas-rich-text { color: #c5d6ea; }
.canvas-narrative:is([data-theme="ink"], [data-theme="signature"]) .canvas-rich-text :is(h2, h3, h4, h5, h6, strong) { color: #f5f9ff; }
.canvas-narrative:is([data-theme="ink"], [data-theme="signature"]) .canvas-rich-text a { color: #7bb5ff; }
.canvas-narrative:is([data-theme="ink"], [data-theme="signature"]) .canvas-rich-text blockquote { background: rgba(80, 161, 255, .1); color: #dce9f8; }
.canvas-narrative:is([data-theme="ink"], [data-theme="signature"]) .canvas-rich-text code { background: rgba(234, 243, 255, .1); border-color: rgba(234, 243, 255, .18); color: #eaf3ff; }
.canvas-narrative:is([data-theme="ink"], [data-theme="signature"]) .canvas-rich-text pre { background: #030a13; }
.canvas-narrative:is([data-theme="ink"], [data-theme="signature"]) .canvas-rich-text__table-wrap { background: rgba(6, 15, 27, .6); border-color: rgba(177, 205, 240, .2); }
.canvas-narrative:is([data-theme="ink"], [data-theme="signature"]) .canvas-rich-text :is(th, td) { border-color: rgba(177, 205, 240, .2); }
.canvas-narrative:is([data-theme="ink"], [data-theme="signature"]) .canvas-rich-text tr:nth-child(even) td { background: rgba(80, 161, 255, .06); }

.canvas-split__grid { align-items: center; display: grid; gap: clamp(42px, 7vw, 96px); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.canvas-split[data-variant="media-start"] .canvas-split__media { grid-column: 1; grid-row: 1; }
.canvas-split[data-variant="media-start"] .canvas-split__copy { grid-column: 2; }
.canvas-split__media { border-radius: 30px; box-shadow: var(--canvas-shadow); margin: 0; overflow: hidden; position: relative; }
.canvas-split__media img { aspect-ratio: 5 / 4; object-fit: cover; width: 100%; }
.canvas-check-list { display: grid; gap: 12px; list-style: none; margin-block: 28px 0; padding: 0; }
.canvas-check-list li { background: rgba(255,255,255,.72); border: 1px solid var(--canvas-line); border-radius: 13px; display: grid; gap: 3px; padding: 14px 16px 14px 46px; position: relative; }
.canvas-check-list li::before { background: var(--canvas-teal-soft); border-radius: 50%; color: var(--canvas-teal); content: "✓"; display: grid; font-weight: 900; height: 24px; inset: 15px auto auto 13px; place-items: center; position: absolute; width: 24px; }
.canvas-check-list span { color: var(--canvas-muted); font-size: .88rem; line-height: 1.5; }

.canvas-metrics { overflow: hidden; }
.canvas-metrics::after { border: 1px solid rgba(80, 161, 255, .14); border-radius: 50%; content: ""; height: 440px; inset: -220px -150px auto auto; position: absolute; width: 440px; }
.canvas-metrics__grid { display: grid; gap: 1px; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; position: relative; z-index: 1; }
.canvas-metrics__grid > div { border-inline-start: 1px solid rgba(177, 205, 240, .18); display: grid; min-height: 170px; padding: 24px clamp(18px, 3vw, 34px); }
.canvas-metrics__grid dt { color: #8fa6c3; font-size: .7rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.canvas-metrics__grid dd { color: #fff; font-size: clamp(2.4rem, 4.4vw, 4.9rem); font-weight: 780; letter-spacing: -.06em; line-height: 1; margin: auto 0 8px; }
.canvas-metrics__grid span { color: #b7c8dc; font-size: .82rem; }

.canvas-card-grid { display: grid; gap: 16px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.canvas-card { background: rgba(255,255,255,.82); border: 1px solid var(--canvas-line); border-radius: 19px; box-shadow: var(--canvas-shadow-soft); display: flex; flex-direction: column; min-height: 260px; overflow: hidden; padding: clamp(20px, 2.7vw, 30px); position: relative; }
.canvas-card::after { background: linear-gradient(90deg, var(--canvas-teal), var(--canvas-teal-bright)); content: ""; height: 3px; inset: auto 0 0; opacity: 0; position: absolute; transform: scaleX(.3); transition: opacity .18s ease, transform .18s ease; }
.canvas-card:hover::after, .canvas-card.is-featured::after { opacity: 1; transform: scaleX(1); }
.canvas-card__index { color: var(--canvas-teal); font-size: .72rem; font-weight: 850; letter-spacing: .1em; }
.canvas-card h3 { font-size: 1.35rem; margin: auto 0 10px; }
.canvas-card p { color: var(--canvas-muted); line-height: 1.65; margin-block-end: 18px; }
.canvas-card a { color: var(--canvas-teal); font-size: .86rem; font-weight: 800; text-decoration: none; }

.canvas-table-wrap { border: 1px solid var(--canvas-line); border-radius: 18px; overflow-x: auto; }
.canvas-table-wrap table { border-collapse: collapse; min-width: 680px; width: 100%; }
.canvas-table-wrap :is(th, td) { border-block-end: 1px solid var(--canvas-line); padding: 16px 18px; text-align: start; }
.canvas-table-wrap thead th { background: var(--canvas-ink); color: #fff; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; }
.canvas-table-wrap tbody th { color: var(--canvas-ink); font-weight: 750; }
.canvas-table-wrap tr.is-featured { background: var(--canvas-teal-soft); }

.canvas-steps__list { counter-reset: canvas-step; display: grid; gap: 0; list-style: none; margin: 0; padding: 0; }
.canvas-steps__list li { align-items: start; display: grid; gap: 22px; grid-template-columns: 58px minmax(0, 1fr); min-height: 132px; position: relative; }
.canvas-steps__list li:not(:last-child)::before { background: var(--canvas-line-strong); content: ""; inline-size: 1px; inset: 54px auto 0 28px; position: absolute; }
.canvas-steps__list > li > span { background: var(--canvas-ink); border: 6px solid var(--canvas-paper); border-radius: 50%; box-shadow: 0 0 0 1px var(--canvas-line); color: #fff; display: grid; font-size: .8rem; font-weight: 850; height: 56px; place-items: center; width: 56px; }
.canvas-steps__list h3 { margin-block: 6px 7px; }
.canvas-steps__list p { color: var(--canvas-muted); line-height: 1.65; max-width: 72ch; }

.canvas-logos__grid { display: grid; gap: 10px; grid-template-columns: repeat(5, minmax(0, 1fr)); list-style: none; margin: 30px 0 0; padding: 0; }
.canvas-logos__grid li { align-items: center; background: #fff; border: 1px solid var(--canvas-line); border-radius: 14px; display: flex; justify-content: center; min-height: 104px; padding: 18px; }
.canvas-logos__grid a { display: contents; }
.canvas-logos__grid img { filter: grayscale(1); max-height: 46px; object-fit: contain; opacity: .7; transition: filter .18s ease, opacity .18s ease; }
.canvas-logos__grid li:hover img { filter: none; opacity: 1; }
.canvas-logos__grid span { color: var(--canvas-muted); font-size: .82rem; font-weight: 800; letter-spacing: .06em; text-align: center; text-transform: uppercase; }

.canvas-quotes { display: grid; gap: 16px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.canvas-quotes figure { background: rgba(255,255,255,.055); border: 1px solid rgba(177, 205, 240, .17); border-radius: 20px; margin: 0; padding: clamp(24px, 3vw, 38px); }
.canvas-quotes blockquote { color: #f3f8ff; font-family: var(--canvas-serif); font-size: clamp(1.25rem, 2vw, 1.75rem); line-height: 1.55; margin: 0 0 24px; }
.canvas-quotes blockquote::before { color: var(--canvas-gold); content: "“"; font-size: 3rem; line-height: 0; margin-inline-end: 5px; vertical-align: -.35em; }
.canvas-quotes figcaption { display: grid; gap: 3px; }
.canvas-quotes figcaption strong { color: #fff; }
.canvas-quotes figcaption span { color: #9eb4d0; font-size: .82rem; }

.canvas-faq__grid { align-items: start; display: grid; gap: clamp(36px, 7vw, 96px); grid-template-columns: minmax(260px, .75fr) minmax(0, 1.25fr); }
.canvas-faq__items { display: grid; gap: 9px; }
.canvas-faq details { background: rgba(255,255,255,.8); border: 1px solid var(--canvas-line); border-radius: 13px; overflow: hidden; }
.canvas-faq summary { align-items: center; color: var(--canvas-ink); cursor: pointer; display: flex; font-weight: 740; gap: 18px; justify-content: space-between; list-style: none; min-height: 64px; padding: 15px 18px; }
.canvas-faq summary::-webkit-details-marker { display: none; }
.canvas-faq summary span { color: var(--canvas-teal); font-size: 1.35rem; transition: transform .18s ease; }
.canvas-faq details[open] summary span { transform: rotate(45deg); }
.canvas-faq details p { border-block-start: 1px solid var(--canvas-line); color: var(--canvas-muted); line-height: 1.7; margin: 0; padding: 16px 18px 19px; }

.canvas-cta { background: var(--canvas-paper); }
.canvas-cta__panel { align-items: center; background: linear-gradient(135deg, #07111f, #0c2441); border: 1px solid rgba(80, 161, 255, .25); border-radius: clamp(24px, 4vw, 42px); box-shadow: var(--canvas-shadow); color: #fff; display: grid; gap: 34px; grid-template-columns: minmax(0, 1fr) auto; overflow: hidden; padding: clamp(30px, 5vw, 66px); position: relative; }
.canvas-cta__panel::after { border: 1px solid rgba(255,255,255,.08); border-radius: 50%; content: ""; height: 360px; inset: -170px -110px auto auto; position: absolute; width: 360px; }
.canvas-cta__panel > * { position: relative; z-index: 1; }
.canvas-cta h2 { color: #fff; font-size: clamp(2rem, 4vw, 4rem); }
.canvas-cta p { color: #c5d6ea; line-height: 1.7; margin: 15px 0 0; max-width: 58ch; }
.canvas-cta .canvas-actions { justify-content: end; margin: 0; }

.canvas-contacts__grid { align-items: start; display: grid; gap: clamp(42px, 7vw, 96px); grid-template-columns: minmax(260px, .82fr) minmax(0, 1.18fr); }
.canvas-contacts__list { border-block-start: 1px solid var(--canvas-line); margin: 0; }
.canvas-contacts__list > div { align-items: baseline; border-block-end: 1px solid var(--canvas-line); display: grid; gap: 20px; grid-template-columns: minmax(100px, .55fr) minmax(0, 1.45fr); padding-block: 17px; }
.canvas-contacts dt { color: var(--canvas-faint); font-size: .7rem; font-weight: 820; letter-spacing: .09em; text-transform: uppercase; }
.canvas-contacts dd { color: var(--canvas-ink); font-size: 1.04rem; font-weight: 700; }
.canvas-contacts dd span { color: var(--canvas-muted); display: block; font-size: .78rem; font-weight: 450; margin-block-start: 4px; }
.canvas-contacts a { color: var(--canvas-teal); }

.canvas-catalog__grid { display: grid; gap: 16px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.canvas-catalog article { background: #fff; border: 1px solid var(--canvas-line); border-radius: 20px; box-shadow: var(--canvas-shadow-soft); overflow: hidden; }
.canvas-catalog article > img { aspect-ratio: 16 / 10; object-fit: cover; width: 100%; }
.canvas-catalog article > div { padding: 24px; }
.canvas-catalog h3 { font-size: 1.35rem; margin-block: 4px 9px; }
.canvas-catalog h3 a { text-decoration: none; }
.canvas-catalog p { color: var(--canvas-muted); line-height: 1.62; margin: 0; }
.canvas-wiki-spaces__grid { display: grid; gap: 14px; grid-template-columns: repeat(3, minmax(0, 1fr)); list-style: none; margin: 0; padding: 0; }
.canvas-wiki-spaces__grid li { align-items: start; background: #fff; border: 1px solid var(--canvas-line); border-radius: 20px; box-shadow: var(--canvas-shadow-soft); display: grid; gap: 17px; grid-template-columns: 42px minmax(0, 1fr); min-height: 210px; padding: clamp(22px, 3vw, 30px); }
.canvas-wiki-spaces__position { align-items: center; background: var(--canvas-ink); border-radius: 12px; color: #fff; display: inline-flex; font-size: .72rem; font-weight: 820; height: 42px; justify-content: center; width: 42px; }
.canvas-wiki-spaces h3 { font-size: clamp(1.22rem, 2vw, 1.55rem); margin: 7px 0 10px; }
.canvas-wiki-spaces__grid p { color: var(--canvas-muted); line-height: 1.62; margin: 0; }
.canvas-tempus-services__grid, .canvas-tempus-specialists__grid, .canvas-prismview-scenes__grid { list-style: none; margin: 0; padding: 0; }
.canvas-tempus-services__grid { display: grid; gap: 16px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.canvas-business-card { background: rgba(255,255,255,.88); border: 1px solid var(--canvas-line); border-block-start: 3px solid var(--canvas-teal); border-radius: 18px; box-shadow: var(--canvas-shadow-soft); display: flex; flex-direction: column; min-height: 250px; overflow: hidden; padding: clamp(22px, 3vw, 30px); }
.canvas-business-card__meta { align-items: center; display: flex; gap: 12px; justify-content: space-between; }
.canvas-business-card__position { align-items: center; background: var(--canvas-teal-soft); border-radius: 999px; color: var(--canvas-teal); display: inline-flex; flex: 0 0 auto; font-size: .7rem; font-weight: 850; height: 34px; justify-content: center; min-width: 34px; padding-inline: 8px; }
.canvas-business-card__label, .canvas-scene-card__label { color: var(--canvas-teal); font-size: .67rem; font-weight: 840; letter-spacing: .1em; text-transform: uppercase; }
.canvas-business-card__copy { display: grid; margin-block-start: auto; padding-block-start: 34px; }
.canvas-business-card h3 { font-size: clamp(1.3rem, 2vw, 1.65rem); margin: 0 0 10px; }
.canvas-business-card p, .canvas-specialist-card p, .canvas-scene-card p { color: var(--canvas-muted); line-height: 1.65; margin: 0; }
.canvas-business-card__action { align-items: center; align-self: start; color: var(--canvas-teal) !important; display: inline-flex; font-size: .8rem; font-weight: 820; gap: 8px; margin-block-start: 18px; text-decoration: none; }
.canvas-business-card__action span { font-size: 1.05rem; transition: transform .18s ease; }
.canvas-business-card__action:hover span { transform: translateX(3px); }
[dir="rtl"] .canvas-business-card__action span { transform: scaleX(-1); }
[dir="rtl"] .canvas-business-card__action:hover span { transform: scaleX(-1) translateX(3px); }
.canvas-tempus-specialists__grid { display: grid; gap: 14px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.canvas-specialist-card { align-items: start; background: rgba(255,255,255,.82); border: 1px solid var(--canvas-line); border-radius: 18px; display: grid; gap: clamp(18px, 3vw, 28px); grid-template-columns: 58px minmax(0, 1fr); min-height: 190px; padding: clamp(22px, 3vw, 30px); }
.canvas-specialist-card__mark { align-items: center; background: linear-gradient(145deg, var(--canvas-ink), var(--canvas-teal)); border: 5px solid var(--canvas-teal-soft); border-radius: 50%; color: #fff; display: inline-flex; font-size: .72rem; font-weight: 850; height: 58px; justify-content: center; width: 58px; }
.canvas-specialist-card__copy { display: grid; }
.canvas-specialist-card h3 { font-size: clamp(1.25rem, 2vw, 1.55rem); margin: 8px 0 9px; }
.canvas-prismview-scenes { isolation: isolate; overflow: hidden; }
.canvas-prismview-scenes::after { background: radial-gradient(circle, rgba(80, 161, 255, .2), transparent 68%); content: ""; height: 680px; inset: -270px -240px auto auto; pointer-events: none; position: absolute; width: 680px; z-index: -1; }
.canvas-prismview-scenes__grid { display: grid; gap: 14px; grid-template-columns: repeat(12, minmax(0, 1fr)); }
.canvas-scene-card { background: rgba(255,255,255,.055); border: 1px solid rgba(177, 205, 240, .18); border-radius: 22px; display: grid; grid-column: span 4; grid-template-rows: auto 1fr; min-height: 390px; overflow: hidden; position: relative; }
.canvas-scene-card:first-child { grid-column: span 8; }
.canvas-scene-card::after { border: 1px solid rgba(255,255,255,.07); border-radius: 50%; content: ""; height: 190px; inset: auto -92px -104px auto; position: absolute; width: 190px; }
.canvas-scene-card__media { align-items: center; aspect-ratio: 16 / 10; background: linear-gradient(135deg, rgba(80, 161, 255, .17), rgba(7, 17, 31, .94)); display: flex; justify-content: center; margin: 0; overflow: hidden; position: relative; }
.canvas-scene-card:first-child .canvas-scene-card__media { aspect-ratio: 2 / 1; }
.canvas-scene-card__media::after { background: linear-gradient(180deg, transparent 48%, rgba(7, 17, 31, .62)); content: ""; inset: 0; pointer-events: none; position: absolute; }
.canvas-scene-card__media img { height: 100%; object-fit: cover; transition: transform .45s ease; width: 100%; }
.canvas-scene-card:hover .canvas-scene-card__media img { transform: scale(1.025); }
.canvas-scene-card__position { color: var(--canvas-gold); font-family: var(--canvas-serif); font-size: clamp(2.6rem, 5vw, 5rem); line-height: .8; opacity: .9; }
.canvas-scene-card__copy { align-self: end; max-width: 62ch; padding: clamp(22px, 3vw, 30px); position: relative; z-index: 1; }
.canvas-scene-card h3 { color: #fff; font-size: clamp(1.35rem, 2.5vw, 2rem); margin: 8px 0 10px; }
.canvas-scene-card p { color: #b7c8dc; }
.canvas-prismview-scenes__heading { align-items: end; display: flex; gap: 28px; justify-content: space-between; }
.canvas-prismview-scenes__heading .canvas-section__head { margin-block-end: 28px; }
.canvas-scene-slider__controls { align-items: center; display: none; gap: 8px; margin-block-end: 28px; }
.canvas-prismview-scenes.is-enhanced .canvas-scene-slider__controls { display: flex; }
.canvas-scene-slider__controls button { align-items: center; background: rgba(255,255,255,.065); border: 1px solid rgba(177, 205, 240, .24); border-radius: 999px; color: #fff; cursor: pointer; display: inline-flex; height: 44px; justify-content: center; transition: background .2s ease, border-color .2s ease, transform .2s ease; width: 44px; }
.canvas-scene-slider__controls button:hover { background: rgba(80, 161, 255, .18); border-color: rgba(80, 161, 255, .68); transform: translateY(-1px); }
.canvas-scene-slider__controls button:disabled { cursor: default; opacity: .38; transform: none; }
.canvas-scene-slider__controls button:focus-visible, .canvas-scene-slider__track:focus-visible { outline: 3px solid var(--canvas-gold); outline-offset: 4px; }
.canvas-scene-slider__controls p { align-items: center; color: var(--canvas-muted); direction: ltr; display: flex; font-variant-numeric: tabular-nums; gap: 5px; margin: 0 4px; min-width: 3.6rem; }
.canvas-scene-slider__controls [data-canvas-scene-current] { color: #fff; font-weight: 800; }
.canvas-scene-slider__track { display: flex; gap: clamp(14px, 2vw, 24px); list-style: none; margin: 0; overflow-x: auto; overscroll-behavior-inline: contain; padding-block: 3px 22px; padding-inline: 0 max(0px, calc((100vw - min(1180px, calc(100vw - 40px))) / 2)); scroll-behavior: smooth; scroll-padding-inline: 2px; scroll-snap-type: inline mandatory; scrollbar-color: rgba(80, 161, 255, .58) rgba(255,255,255,.07); scrollbar-width: thin; touch-action: pan-x pan-y; }
.canvas-prismview-scenes.is-enhanced .canvas-scene-slider__track { cursor: grab; }
.canvas-scene-slider__track.is-dragging { cursor: grabbing; scroll-behavior: auto; scroll-snap-type: none; user-select: none; }
.canvas-scene-slider__track .canvas-scene-card { flex: 0 0 min(78vw, 780px); grid-column: auto; min-height: 520px; scroll-snap-align: start; }
.canvas-scene-slider__track .canvas-scene-card:first-child { grid-column: auto; }
.canvas-scene-slider__track .canvas-scene-card__media, .canvas-scene-slider__track .canvas-scene-card:first-child .canvas-scene-card__media { aspect-ratio: 16 / 9; }
.canvas-prismview-scenes:dir(rtl) .canvas-scene-slider__controls i { transform: scaleX(-1); }
.canvas-scene-slider__track[data-canvas-scene-track] { -webkit-overflow-scrolling: touch; }

[data-theme="ink"] :is(.canvas-business-card, .canvas-specialist-card), [data-theme="signature"] :is(.canvas-business-card, .canvas-specialist-card) { background: rgba(255,255,255,.055); border-color: rgba(177, 205, 240, .18); }
[data-theme="ink"] :is(.canvas-business-card h3, .canvas-specialist-card h3), [data-theme="signature"] :is(.canvas-business-card h3, .canvas-specialist-card h3) { color: #fff; }
[data-theme="ink"] :is(.canvas-business-card p, .canvas-specialist-card p), [data-theme="signature"] :is(.canvas-business-card p, .canvas-specialist-card p) { color: #b7c8dc; }
[data-theme="ink"] .canvas-business-card__action, [data-theme="signature"] .canvas-business-card__action { color: #50a1ff !important; }
.canvas-empty { min-height: 55vh; text-align: center; }
.canvas-provider-section .canvas-section__head { margin-block-end: clamp(28px, 4vw, 48px); }
.canvas-provider-grid { display: grid; gap: clamp(16px, 2.2vw, 26px); grid-template-columns: repeat(12, minmax(0, 1fr)); list-style: none; margin: 0; padding: 0; }
.canvas-provider-card { background: color-mix(in srgb, var(--canvas-surface) 94%, transparent); border: 1px solid color-mix(in srgb, var(--canvas-ink) 13%, transparent); border-radius: 22px; display: flex; flex-direction: column; grid-column: span 4; min-height: 250px; overflow: hidden; padding: clamp(24px, 3vw, 34px); position: relative; transition: border-color .2s ease, transform .2s ease; }
.canvas-provider-card:hover { border-color: color-mix(in srgb, var(--canvas-gold) 55%, transparent); transform: translateY(-3px); }
.canvas-provider-card__order { color: var(--canvas-gold); font-family: var(--canvas-serif); font-size: clamp(1.7rem, 2.8vw, 2.5rem); font-variant-numeric: tabular-nums; line-height: 1; margin-block-end: auto; }
.canvas-provider-card h3 { color: var(--canvas-ink); font-size: clamp(1.3rem, 2vw, 1.75rem); line-height: 1.12; margin: 42px 0 10px; }
.canvas-provider-card p { color: var(--canvas-muted); line-height: 1.65; margin: 0; }
.canvas-provider-card__action { align-items: center; color: var(--canvas-gold); display: inline-flex; font-weight: 800; margin-block-start: 22px; text-decoration: none; }
.canvas-provider-card__action:focus-visible { outline: 3px solid var(--canvas-gold); outline-offset: 4px; }
.canvas-provider-card.is-featured { border-color: color-mix(in srgb, var(--canvas-gold) 65%, transparent); grid-column: span 6; }
.canvas-provider-section--crm .canvas-provider-cta { align-items: center; background: color-mix(in srgb, var(--canvas-ink) 96%, transparent); border-radius: 28px; display: grid; gap: 30px; grid-template-columns: minmax(0, 1fr) auto; padding: clamp(30px, 6vw, 72px); }
.canvas-provider-section--crm .canvas-section__head { margin: 0; }
.canvas-provider-section--crm .canvas-section__head :is(h2, p) { color: #fff; }
.canvas-provider-section--crm .canvas-button { white-space: nowrap; }
.canvas-empty .canvas-shell { max-width: 760px; }
.canvas-empty h1 { color: var(--canvas-ink); font-size: clamp(2.2rem, 5vw, 4.4rem); letter-spacing: -.05em; line-height: 1; }
.canvas-empty p { color: var(--canvas-muted); line-height: 1.7; }

/* Backoffice visual composer */
.canvas-bo { container-type: inline-size; display: grid; gap: 17px; min-width: 0; width: 100%; }
body:has(.canvas-bo) .sapphire-admin-workspace { background: radial-gradient(circle at 85% 8%, rgba(54, 178, 168, .08), transparent 31%), linear-gradient(180deg, #081b25, #0c2530); }
.canvas-bo button, .canvas-bo input, .canvas-bo select, .canvas-bo textarea { font: inherit; }
.canvas-bo button, .canvas-bo select { cursor: pointer; }
.canvas-bo__hero { align-items: end; background: radial-gradient(circle at 88% 6%, rgba(63, 196, 185, .22), transparent 31%), radial-gradient(circle at 10% 120%, rgba(200, 163, 92, .13), transparent 30%), linear-gradient(138deg, #061923, #0a2c38); border: 1px solid rgba(89, 190, 183, .2); border-radius: 24px; box-shadow: 0 24px 58px rgba(3, 21, 31, .24); color: #fff; display: grid; gap: 28px; grid-template-columns: minmax(0, 1fr) auto; min-height: 150px; overflow: hidden; padding: clamp(22px, 3vw, 32px); position: relative; }
.canvas-bo__hero::after { border: 1px solid rgba(142, 220, 215, .11); border-radius: 50%; box-shadow: inset 0 0 0 38px rgba(63,196,185,.03), inset 0 0 0 80px rgba(255,255,255,.015); content: ""; height: 310px; inset: auto -80px -145px auto; position: absolute; width: 310px; }
.canvas-bo__hero > * { position: relative; z-index: 1; }
.canvas-bo__hero--compact { min-height: 108px; padding-block: 20px; }
.canvas-bo__eyebrow, .canvas-bo-kicker { color: #65d9cf; display: inline-flex; gap: 7px; align-items: center; font-size: .66rem; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.canvas-bo-kicker { color: var(--canvas-teal); }
.canvas-bo__hero h2 { color: #fff; font-size: clamp(2rem, 4vw, 3.15rem); font-weight: 800; letter-spacing: -.05em; line-height: 1; margin: 8px 0; }
.canvas-bo__hero p { color: #b9d0d5; line-height: 1.55; margin: 0; max-width: 760px; }
.canvas-bo__hero-actions, .canvas-bo-composer-head__actions { align-items: center; display: flex; flex-wrap: wrap; gap: 9px; justify-content: end; }
.canvas-bo-button, .canvas-bo-icon-button, .canvas-bo-preview-modes button, .canvas-bo-media-dialog button { align-items: center; background: #fff; border: 1px solid var(--canvas-line-strong); border-radius: 10px; color: var(--canvas-ink); display: inline-flex; font-weight: 740; gap: 7px; justify-content: center; min-height: 40px; padding: 8px 13px; text-decoration: none; }
.canvas-bo-button:hover, .canvas-bo-icon-button:hover { background: var(--canvas-teal-soft); border-color: rgba(20,125,120,.42); color: var(--canvas-teal); }
.canvas-bo-button--primary { background: linear-gradient(135deg, var(--canvas-teal), var(--canvas-ink-soft)); border-color: var(--canvas-teal); box-shadow: 0 11px 24px rgba(17,106,103,.2); color: #fff !important; }
.canvas-bo-button--success { background: var(--canvas-green); border-color: var(--canvas-green); color: #fff !important; }
.canvas-bo-button--quiet { background: #f5f8f7; color: var(--canvas-muted); }
.canvas-bo-button--glass { background: rgba(5, 29, 39, .44); border-color: rgba(172, 223, 220, .23); color: #e9f5f4 !important; }
.canvas-bo-button--small { min-height: 34px; padding: 6px 10px; }
.canvas-bo-icon-button { flex: 0 0 auto; height: 36px; min-height: 36px; padding: 6px; width: 36px; }
.canvas-bo-icon-button--danger { color: var(--canvas-red); }
.canvas-bo-alert { border: 1px solid var(--canvas-line); border-inline-start-width: 5px; border-radius: 11px; padding: 12px 15px; }
.canvas-bo-alert--success { background: var(--canvas-green-soft); border-inline-start-color: var(--canvas-green); color: #17583b; }
.canvas-bo-alert--error { background: var(--canvas-red-soft); border-inline-start-color: var(--canvas-red); color: #7e303d; }
.canvas-bo__nav { background: rgba(250,252,251,.94); border: 1px solid rgba(195,211,212,.9); border-radius: 14px; box-shadow: 0 10px 28px rgba(8,36,47,.08); display: flex; gap: 4px; inset-block-start: 10px; max-width: 100%; overflow-x: auto; padding: 7px; position: sticky; scrollbar-width: thin; z-index: 60; }
.canvas-bo__nav a { align-items: center; border-radius: 9px; color: var(--canvas-muted); display: inline-flex; font-size: .86rem; font-weight: 700; gap: 7px; min-height: 40px; padding: 8px 11px; text-decoration: none; white-space: nowrap; }
.canvas-bo__nav a:hover { background: var(--canvas-teal-soft); color: var(--canvas-teal); }
.canvas-bo__nav a.is-active { background: var(--canvas-ink-soft); box-shadow: 0 8px 18px rgba(7,37,51,.18); color: #fff; }
.canvas-bo__workspace { background: #edf3f2; border-radius: 20px; box-shadow: inset 0 1px rgba(255,255,255,.9); min-width: 0; padding: clamp(15px, 2vw, 24px); }
.canvas-bo__status { background: var(--canvas-ink); border-radius: 10px; box-shadow: 0 18px 44px rgba(4,24,36,.22); color: #fff; inset: auto 22px 22px auto; max-width: 390px; padding: 11px 14px; position: fixed; z-index: 1900; }
.canvas-bo__status:empty { display: none; }
.canvas-bo__status[data-kind="success"] { background: var(--canvas-green); }
.canvas-bo__status[data-kind="error"] { background: #8b3441; }
.canvas-bo-view { animation: canvas-bo-enter .25s ease both; display: grid; gap: 17px; min-width: 0; }
@keyframes canvas-bo-enter { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
.canvas-bo-view__head { align-items: flex-start; display: flex; gap: 20px; justify-content: space-between; }
.canvas-bo-view__head h3 { color: var(--canvas-ink); font-size: clamp(1.5rem, 2.7vw, 2.2rem); font-weight: 810; letter-spacing: -.04em; margin: 3px 0 5px; }
.canvas-bo-view__head p { color: var(--canvas-muted); line-height: 1.55; margin: 0; max-width: 800px; }
.canvas-bo-panel { background: #fbfdfc; border: 1px solid var(--canvas-line); border-radius: 16px; box-shadow: 0 12px 34px rgba(11,45,55,.055); min-width: 0; padding: 19px; }
.canvas-bo-panel--flush { overflow: hidden; padding: 0; }
.canvas-bo-panel--sticky { inset-block-start: 76px; position: sticky; }
.canvas-bo-panel__head { align-items: flex-start; display: flex; gap: 16px; justify-content: space-between; margin-block-end: 15px; }
.canvas-bo-panel__head h3 { color: var(--canvas-ink); font-size: 1.08rem; margin: 2px 0 3px; }
.canvas-bo-panel__head p { color: var(--canvas-muted); font-size: .82rem; margin: 0; max-width: 630px; }
.canvas-bo-count { align-items: center; background: var(--canvas-teal-soft); border: 1px solid #c5e5e0; border-radius: 999px; color: var(--canvas-teal); display: inline-flex; flex: 0 0 auto; font-size: .72rem; font-weight: 850; justify-content: center; min-height: 29px; min-width: 29px; padding: 4px 8px; }
.canvas-bo-state { align-items: center; background: #edf1f1; border: 1px solid #d8e0e1; border-radius: 999px; color: var(--canvas-muted); display: inline-flex; font-size: .64rem; font-weight: 800; gap: 4px; letter-spacing: .035em; min-height: 24px; padding: 3px 8px; text-transform: uppercase; white-space: nowrap; }
.canvas-bo-state--draft, .canvas-bo-state--incomplete, .canvas-bo-state--warning, .canvas-bo-state--leased { background: var(--canvas-amber-soft); border-color: #eed9af; color: var(--canvas-amber); }
.canvas-bo-state--review, .canvas-bo-state--pending { background: #e8f0f8; border-color: #cbddeb; color: #286188; }
.canvas-bo-state--published, .canvas-bo-state--complete, .canvas-bo-state--completed, .canvas-bo-state--healthy, .canvas-bo-state--active { background: var(--canvas-green-soft); border-color: #c8e7d4; color: var(--canvas-green); }
.canvas-bo-state--archived, .canvas-bo-state--failed, .canvas-bo-state--error { background: var(--canvas-red-soft); border-color: #eccbd1; color: var(--canvas-red); }
.canvas-bo-metrics { display: grid; gap: 11px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.canvas-bo-metric { background: #fff; border: 1px solid var(--canvas-line); border-block-start: 3px solid var(--canvas-teal); border-radius: 13px; display: grid; gap: 5px; min-height: 108px; padding: 15px; text-decoration: none; }
.canvas-bo-metric span { color: var(--canvas-muted); font-size: .67rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.canvas-bo-metric strong { color: var(--canvas-ink); font-size: 1.85rem; line-height: 1; margin-block-start: auto; }
.canvas-bo-metric small { color: var(--canvas-faint); font-size: .72rem; }
.canvas-bo-dashboard-grid { display: grid; gap: 15px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.canvas-bo-records { display: grid; gap: 7px; }
.canvas-bo-record { align-items: center; background: #fff; border: 1px solid var(--canvas-line); border-radius: 11px; color: inherit; display: grid; gap: 11px; grid-template-columns: 42px minmax(0, 1fr) auto; min-height: 64px; padding: 10px 12px; text-decoration: none; }
.canvas-bo-record__mark { background: var(--canvas-teal-soft); border-radius: 10px; color: var(--canvas-teal); display: grid; height: 40px; place-items: center; width: 40px; }
.canvas-bo-record > span:nth-child(2) { display: grid; min-width: 0; }
.canvas-bo-record strong { color: var(--canvas-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.canvas-bo-record small { color: var(--canvas-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.canvas-bo-page-tree { display: grid; }
.canvas-bo-page-row { align-items: center; border-block-end: 1px solid var(--canvas-line); display: grid; gap: 10px; grid-template-columns: 38px minmax(180px, 1fr) auto auto auto; min-height: 66px; padding-block: 9px; padding-inline: calc(14px + (var(--canvas-depth) * 16px)) 14px; }
.canvas-bo-page-row.is-selected { background: var(--canvas-teal-soft); }
.canvas-bo-tree-spacer { align-items: center; color: var(--canvas-faint); display: flex; height: 36px; justify-content: center; width: 36px; }
.canvas-bo-page-row__copy { display: grid; min-width: 0; }
.canvas-bo-page-row__copy strong { color: var(--canvas-ink); }
.canvas-bo-page-row__copy small { color: var(--canvas-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.canvas-bo-coverage { color: var(--canvas-muted); font-size: .72rem; font-weight: 750; }
.canvas-bo-row-actions { display: flex; gap: 5px; }
.canvas-bo-empty { align-items: center; color: var(--canvas-muted); display: flex; flex-direction: column; justify-content: center; min-height: 260px; padding: 32px; text-align: center; }
.canvas-bo-empty > i { color: var(--canvas-teal); font-size: 2rem; margin-block-end: 10px; }
.canvas-bo-empty h3 { color: var(--canvas-ink); margin-block: 0 7px; }
.canvas-bo-empty p { line-height: 1.55; margin: 0; max-width: 560px; }
.canvas-bo-empty--denied { background: #fff; border: 1px solid var(--canvas-line); border-radius: 18px; min-height: 430px; }

.canvas-bo-composer-head { align-items: end; }
.canvas-bo-save-state { color: var(--canvas-muted); font-size: .72rem; }
.canvas-bo-save-state.is-dirty { color: var(--canvas-amber); font-weight: 760; }
.canvas-bo-locales { background: rgba(255,255,255,.82); border: 1px solid var(--canvas-line); border-radius: 13px; display: flex; gap: 5px; max-width: 100%; overflow-x: auto; padding: 6px; }
.canvas-bo-locale { align-items: center; border: 1px solid transparent; border-radius: 9px; color: var(--canvas-muted); display: inline-flex; gap: 8px; min-height: 40px; padding: 7px 10px; text-decoration: none; white-space: nowrap; }
.canvas-bo-locale.is-active { background: var(--canvas-ink-soft); color: #fff; }
.canvas-bo-locale.is-active .canvas-bo-state { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.12); color: #d9e9e8; }
.canvas-bo-composer { align-items: start; display: grid; gap: 13px; grid-template-columns: minmax(236px, 278px) minmax(430px, 1fr) minmax(300px, 350px); min-width: 0; }
.canvas-bo-composer__rail { display: grid; gap: 10px; min-width: 0; }
.canvas-bo-drawer { background: #fff; border: 1px solid var(--canvas-line); border-radius: 14px; box-shadow: 0 10px 26px rgba(10,42,52,.05); overflow: clip; }
.canvas-bo-drawer > summary { align-items: center; color: var(--canvas-ink); cursor: pointer; display: flex; font-weight: 760; gap: 10px; justify-content: space-between; list-style: none; min-height: 50px; padding: 10px 12px; }
.canvas-bo-drawer > summary::-webkit-details-marker { display: none; }
.canvas-bo-drawer > summary > span:first-child { align-items: center; display: inline-flex; gap: 7px; }
.canvas-bo-drawer__body { border-block-start: 1px solid var(--canvas-line); max-height: min(49vh, 520px); overflow-y: auto; padding: 9px; scrollbar-width: thin; }
.canvas-bo-mini-tree { display: grid; gap: 3px; }
.canvas-bo-mini-tree__row { align-items: center; border-radius: 8px; color: inherit; display: grid; gap: 8px; grid-template-columns: 20px minmax(0, 1fr); min-height: 43px; padding-block: 6px; padding-inline: calc(7px + (var(--canvas-depth) * 11px)) 7px; text-decoration: none; }
.canvas-bo-mini-tree__row:hover, .canvas-bo-mini-tree__row.is-selected { background: var(--canvas-teal-soft); color: var(--canvas-teal); }
.canvas-bo-mini-tree__row > span { display: grid; min-width: 0; }
.canvas-bo-mini-tree__row strong, .canvas-bo-mini-tree__row small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.canvas-bo-mini-tree__row strong { font-size: .78rem; }
.canvas-bo-mini-tree__row small { color: var(--canvas-muted); font-size: .64rem; }
.canvas-bo-search { align-items: center; background: #f6f9f8; border: 1px solid var(--canvas-line); border-radius: 9px; display: grid; gap: 7px; grid-template-columns: 20px minmax(0,1fr); margin-block-end: 8px; padding-inline: 8px; }
.canvas-bo-search input { background: transparent; border: 0; color: var(--canvas-ink); min-height: 38px; min-width: 0; outline: 0; width: 100%; }
.canvas-bo-palette { display: grid; gap: 7px; }
.canvas-bo-palette-card { background: #fbfdfc; border: 1px solid var(--canvas-line); border-radius: 10px; padding: 10px; }
.canvas-bo-palette-card > div { align-items: center; display: grid; gap: 8px; grid-template-columns: 34px minmax(0,1fr); }
.canvas-bo-palette-card__icon { background: var(--canvas-teal-soft); border-radius: 8px; color: var(--canvas-teal); display: grid; height: 34px; place-items: center; width: 34px; }
.canvas-bo-palette-card strong, .canvas-bo-palette-card small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.canvas-bo-palette-card strong { color: var(--canvas-ink); font-size: .78rem; }
.canvas-bo-palette-card small { color: var(--canvas-muted); font-size: .63rem; }
.canvas-bo-palette-card p { color: var(--canvas-muted); display: -webkit-box; font-size: .7rem; line-height: 1.45; margin: 7px 0; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.canvas-bo-palette-card form { display: grid; gap: 9px; }
.canvas-bo-palette-card form > .canvas-bo-button { justify-self: end; }
.canvas-bo-stage, .canvas-bo-inspector { background: #fff; border: 1px solid var(--canvas-line); border-radius: 15px; box-shadow: 0 12px 32px rgba(8,39,50,.06); min-width: 0; }
.canvas-bo-stage__head, .canvas-bo-inspector__head { align-items: flex-start; border-block-end: 1px solid var(--canvas-line); display: flex; gap: 14px; justify-content: space-between; padding: 15px; }
.canvas-bo-stage__head h3, .canvas-bo-inspector__head h3 { color: var(--canvas-ink); font-size: 1rem; margin: 2px 0 0; }
.canvas-bo-inspector__head p { color: var(--canvas-muted); font-size: .64rem; margin: 3px 0 0; overflow-wrap: anywhere; }
.canvas-bo-section-list { background: linear-gradient(180deg, #f4f7f6, #edf2f1); display: grid; gap: 9px; min-height: 570px; padding: 12px; }
.canvas-bo-section-card { align-items: stretch; background: #fff; border: 1px solid var(--canvas-line); border-radius: 12px; box-shadow: 0 8px 20px rgba(9,39,48,.045); display: grid; gap: 9px; grid-template-columns: 36px 72px minmax(0,1fr) auto; min-height: 94px; overflow: hidden; padding: 9px; }
.canvas-bo-section-card.is-selected { border-color: rgba(20,125,120,.56); box-shadow: 0 0 0 2px rgba(20,125,120,.1), 0 10px 22px rgba(9,39,48,.07); }
.canvas-bo-section-card__handle { align-items: center; color: var(--canvas-faint); display: flex; flex-direction: column; font-size: .65rem; gap: 4px; justify-content: center; }
.canvas-bo-section-card__thumb { aspect-ratio: 1; background: var(--canvas-mist); border-radius: 9px; height: 72px; object-fit: cover; width: 72px; }
.canvas-bo-section-card__thumb--empty { color: var(--canvas-teal); display: grid; font-size: 1.25rem; place-items: center; }
.canvas-bo-section-card__copy { align-self: center; display: grid; min-width: 0; padding-block: 3px; text-decoration: none; }
.canvas-bo-section-card__copy > strong { color: var(--canvas-ink); font-size: .89rem; margin-block: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.canvas-bo-section-card__copy > small { color: var(--canvas-muted); display: -webkit-box; font-size: .7rem; line-height: 1.35; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.canvas-bo-badges { display: flex; flex-wrap: wrap; gap: 4px; margin-block-start: 7px; }
.canvas-bo-section-card__actions { align-content: center; display: grid; gap: 4px; grid-template-columns: repeat(2, 36px); }
.canvas-bo-section-card__actions form { margin: 0; }
.canvas-bo-inspector { inset-block-start: 73px; max-height: calc(100vh - 94px); overflow-y: auto; position: sticky; scrollbar-width: thin; }
.canvas-bo-inspector-form { display: grid; gap: 14px; padding: 14px; }
.canvas-bo-inspector-fields { display: grid; gap: 12px; }
.canvas-bo-field { display: grid; gap: 6px; min-width: 0; }
.canvas-bo-field > span, .canvas-bo-field__label { color: #405a64; font-size: .68rem; font-style: normal; font-weight: 800; letter-spacing: .045em; }
.canvas-bo-field__label { align-items: center; display: flex; gap: 6px; justify-content: space-between; }
.canvas-bo-field__label em { color: var(--canvas-red); font-style: normal; }
.canvas-bo-field__label small { background: var(--canvas-teal-soft); border-radius: 999px; color: var(--canvas-teal); font-size: .58rem; padding: 2px 6px; }
.canvas-bo-input, .canvas-bo-field :is(input:not([type="submit"]), select, textarea) { background: #fff; border: 1px solid var(--canvas-line-strong); border-radius: 9px; color: var(--canvas-ink); min-height: 40px; min-width: 0; padding: 8px 10px; width: 100%; }
.canvas-bo-field textarea, textarea.canvas-bo-input { min-height: 96px; resize: vertical; }
.canvas-bo-field > small { color: var(--canvas-muted); font-size: .64rem; line-height: 1.45; }
.canvas-bo-field__error { color: var(--canvas-red); font-size: .66rem; }
.canvas-bo-inspector-form__actions { display: flex; justify-content: stretch; }
.canvas-bo-inspector-form__actions .canvas-bo-button { width: 100%; }
.canvas-bo-workflow { border-block-start: 1px solid var(--canvas-line); display: grid; gap: 11px; padding: 14px; }
.canvas-bo-workflow h3 { color: var(--canvas-ink); font-size: .92rem; margin: 2px 0 0; }
.canvas-bo-workflow dl { display: grid; gap: 0; margin: 0; }
.canvas-bo-workflow dl > div { border-block-end: 1px solid var(--canvas-line); display: grid; gap: 8px; grid-template-columns: 1fr auto; padding-block: 7px; }
.canvas-bo-workflow dt { color: var(--canvas-muted); font-size: .67rem; }
.canvas-bo-workflow dd { color: var(--canvas-ink); font-size: .7rem; font-weight: 720; }
.canvas-bo-workflow form { display: grid; gap: 8px; }
.canvas-bo-review-evidence { display: grid; gap: 8px; list-style: none; margin: 0; padding: 0; }
.canvas-bo-review-evidence li { align-items: start; background: var(--canvas-teal-soft); border: 1px solid var(--canvas-line); border-radius: 10px; display: grid; gap: 9px; grid-template-columns: 28px minmax(0, 1fr); padding: 9px; }
.canvas-bo-review-evidence li > i { color: var(--canvas-teal); padding-block-start: 2px; text-align: center; }
.canvas-bo-review-evidence li > span { display: grid; gap: 2px; }
.canvas-bo-review-evidence strong { color: var(--canvas-ink); font-size: .69rem; }
.canvas-bo-review-evidence time { color: var(--canvas-muted); font-size: .61rem; }
.canvas-bo-review-note { background: var(--canvas-mist); border: 1px solid var(--canvas-line); border-inline-start: 3px solid var(--canvas-teal); border-radius: 10px; margin: 0; padding: 9px 10px; }
.canvas-bo-review-note span { color: var(--canvas-muted); font-size: .6rem; font-weight: 780; letter-spacing: .06em; text-transform: uppercase; }
.canvas-bo-review-note p { color: var(--canvas-text); font-size: .7rem; line-height: 1.5; margin: 4px 0 0; white-space: pre-wrap; }
.canvas-bo-review-actions { display: grid; gap: 9px; }
.canvas-bo-review-action { background: var(--canvas-paper); border: 1px solid var(--canvas-line); border-radius: 11px; display: grid; gap: 9px; margin: 0; padding: 10px; }
.canvas-bo-review-action--compact { align-items: center; grid-template-columns: minmax(0, 1fr) auto; }
.canvas-bo-review-action--compact p { color: var(--canvas-muted); font-size: .68rem; line-height: 1.45; margin: 0; }
.canvas-bo-review-action > summary { color: var(--canvas-ink); cursor: pointer; font-size: .7rem; font-weight: 800; list-style: none; }
.canvas-bo-review-action > summary::-webkit-details-marker { display: none; }
.canvas-bo-review-action[open] > summary { margin-block-end: 8px; }
.canvas-bo-review-action--decision { border-inline-start: 3px solid var(--canvas-green); }
.canvas-bo-review-action--danger { border-inline-start: 3px solid var(--canvas-red); }
.canvas-bo-governance { padding: 15px; }
.canvas-bo-governance__state { display: grid; gap: 9px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.canvas-bo-governance__state > span { background: var(--canvas-mist); border: 1px solid var(--canvas-line); border-radius: 10px; display: grid; gap: 3px; padding: 10px; }
.canvas-bo-governance__state small { color: var(--canvas-muted); font-size: .62rem; }
.canvas-bo-governance__state strong { color: var(--canvas-ink); font-size: .78rem; }
.canvas-bo-governance__editor { border-block-start: 1px solid var(--canvas-line); margin-block-start: 12px; padding-block-start: 12px; }
.canvas-bo-governance__editor > summary { color: var(--canvas-teal-bright); cursor: pointer; font-size: .7rem; font-weight: 800; list-style: none; }
.canvas-bo-governance__editor > summary::-webkit-details-marker { display: none; }
.canvas-bo-governance__editor form { margin-block-start: 11px; }
.canvas-bo-readonly { align-items: start; color: var(--canvas-muted); display: grid; gap: 9px; grid-template-columns: 30px minmax(0,1fr); padding: 14px; }
.canvas-bo-readonly i { background: var(--canvas-mist); border-radius: 8px; color: var(--canvas-teal); display: grid; height: 30px; place-items: center; }
.canvas-bo-readonly p { font-size: .72rem; line-height: 1.5; margin: 0; }
.canvas-bo-muted { color: var(--canvas-muted); font-size: .75rem; }

.canvas-bo-preview-dialog, .canvas-bo-media-dialog { background: rgba(3,18,26,.74); border: 0; height: 100%; margin: 0; max-height: none; max-width: none; padding: clamp(12px, 2vw, 24px); width: 100%; }
.canvas-bo-preview-dialog::backdrop, .canvas-bo-media-dialog::backdrop { background: rgba(3,18,26,.74); backdrop-filter: blur(7px); }
.canvas-bo-preview-dialog__surface, .canvas-bo-media-dialog > div { background: #edf2f1; border: 1px solid rgba(185,216,213,.35); border-radius: 20px; box-shadow: 0 35px 100px rgba(0,0,0,.38); display: grid; height: 100%; margin: auto; max-width: 1740px; overflow: hidden; }
.canvas-bo-preview-dialog__surface > header, .canvas-bo-media-dialog header { align-items: center; background: var(--canvas-ink); color: #fff; display: flex; gap: 18px; justify-content: space-between; padding: 12px 16px; }
.canvas-bo-preview-dialog h3, .canvas-bo-media-dialog h3 { color: #fff; font-size: 1rem; margin: 2px 0 0; }
.canvas-bo-preview-modes { display: flex; gap: 5px; }
.canvas-bo-preview-modes button { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.13); color: #dcebea; min-height: 36px; }
.canvas-bo-preview-modes button.is-active { background: var(--canvas-teal); border-color: var(--canvas-teal); color: #fff; }
.canvas-bo-preview-frame { align-items: start; display: flex; justify-content: center; overflow: auto; padding: 18px; }
.canvas-bo-preview-frame > * { background: #fff; box-shadow: 0 14px 50px rgba(5,27,36,.15); min-height: 100%; transition: width .2s ease; width: 100%; }
.canvas-bo-preview-frame > iframe { border: 0; min-height: calc(100vh - 132px); }
.canvas-bo-preview-frame[data-preview-mode="mobile"] > * { border: 8px solid #162c36; border-radius: 26px; max-width: 390px; overflow: hidden; width: 390px; }
.canvas-bo-preview-loading { color: var(--canvas-muted); display: grid; min-height: 380px; place-items: center; }

.canvas-bo-media-layout { align-items: start; display: grid; gap: 15px; grid-template-columns: minmax(0,1fr) minmax(300px,360px); }
.canvas-bo-media-grid { display: grid; gap: 11px; grid-template-columns: repeat(3, minmax(0,1fr)); }
.canvas-bo-media-card { background: #fff; border: 1px solid var(--canvas-line); border-radius: 13px; overflow: hidden; }
.canvas-bo-media-card.is-selected { border-color: var(--canvas-teal); box-shadow: 0 0 0 2px rgba(20,125,120,.12); }
.canvas-bo-media-card__preview { aspect-ratio: 16 / 10; background: var(--canvas-mist); border: 0; display: grid; overflow: hidden; padding: 0; place-items: center; width: 100%; }
.canvas-bo-media-card__preview img { height: 100%; object-fit: cover; width: 100%; }
.canvas-bo-media-card__preview--pending { color: var(--canvas-muted); font-size: .72rem; gap: 6px; }
.canvas-bo-media-card__copy { display: grid; gap: 5px; padding: 11px; }
.canvas-bo-media-card__copy strong { color: var(--canvas-ink); font-size: .8rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.canvas-bo-media-card__copy small, .canvas-bo-media-card__copy code { color: var(--canvas-muted); font-size: .64rem; overflow-wrap: anywhere; }
.canvas-bo-form { display: grid; gap: 12px; }
.canvas-bo-form--grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.canvas-bo-form--grid .canvas-bo-field--wide, .canvas-bo-form--grid .canvas-bo-form__actions { grid-column: 1 / -1; }
.canvas-bo-form__actions { align-items: center; display: flex; justify-content: end; }
.canvas-bo-locale-editor .canvas-bo-drawer__body { max-height: none; padding: 16px; }
.canvas-bo-snapshot { border-radius: 0; border-inline: 0; box-shadow: none; }
.canvas-bo-snapshot .canvas-bo-drawer__body { max-height: none; padding: 14px; }
.canvas-bo-media-dialog > div { height: auto; max-height: calc(100vh - 48px); max-width: 1100px; }
.canvas-bo-media-dialog figure { display: grid; margin: 0; min-height: 0; overflow: auto; }
.canvas-bo-media-dialog figure img { margin: auto; max-height: calc(100vh - 150px); object-fit: contain; }
.canvas-bo-media-dialog figcaption { background: #fff; color: var(--canvas-muted); padding: 12px 16px; }
.canvas-bo-reusable-list { display: grid; }
.canvas-bo-reusable-card { align-items: center; border-block-end: 1px solid var(--canvas-line); display: grid; gap: 12px; grid-template-columns: 42px minmax(0,1fr) auto auto; min-height: 78px; padding: 11px 14px; }
.canvas-bo-reusable-card__copy { display: grid; min-width: 0; }
.canvas-bo-reusable-card__copy > strong { color: var(--canvas-ink); }
.canvas-bo-reusable-card__copy code { color: var(--canvas-muted); font-size: .64rem; overflow-wrap: anywhere; }
.canvas-bo-reusable-card__impact { display: grid; text-align: center; }
.canvas-bo-reusable-card__impact strong { color: var(--canvas-ink); font-size: 1.1rem; }
.canvas-bo-reusable-card__impact small { color: var(--canvas-muted); font-size: .62rem; }
.canvas-bo-reusable-card__summary { color: var(--canvas-muted); font-size: .72rem; grid-column: 2 / -1; margin: -4px 0 6px; }
.canvas-bo-impact-form { display: flex; justify-content: end; margin-block-start: 15px; }
.canvas-bo-audit-list { display: grid; }
.canvas-bo-audit-list article { align-items: start; border-block-end: 1px solid var(--canvas-line); display: grid; gap: 12px; grid-template-columns: 130px 42px minmax(0,1fr) auto; padding: 13px 15px; }
.canvas-bo-audit-list time { color: var(--canvas-muted); font-size: .68rem; padding-block-start: 12px; }
.canvas-bo-audit-list article > span:nth-child(3) { display: grid; }
.canvas-bo-audit-list p { color: var(--canvas-muted); font-size: .73rem; line-height: 1.45; margin: 5px 0 0; }
.visually-hidden { clip: rect(0 0 0 0); clip-path: inset(50%); height: 1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; }

@container (max-width: 1180px) {
    .canvas-bo-composer { grid-template-columns: minmax(220px, 260px) minmax(420px, 1fr); }
    .canvas-bo-inspector { grid-column: 1 / -1; max-height: none; position: static; }
    .canvas-bo-inspector-fields { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@container (max-width: 860px) {
    .canvas-bo__hero, .canvas-bo-composer-head { align-items: start; grid-template-columns: 1fr; }
    .canvas-bo__hero-actions, .canvas-bo-composer-head__actions { justify-content: start; }
    .canvas-bo-metrics, .canvas-bo-dashboard-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .canvas-bo-composer { grid-template-columns: 1fr; }
    .canvas-bo-composer__rail { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .canvas-bo-inspector { grid-column: auto; }
    .canvas-bo-media-layout { grid-template-columns: 1fr; }
    .canvas-bo-panel--sticky { position: static; }
}
@container (max-width: 620px) {
    .canvas-bo__workspace { padding: 11px; }
    .canvas-bo-view__head { display: grid; }
    .canvas-bo-metrics, .canvas-bo-dashboard-grid, .canvas-bo-composer__rail, .canvas-bo-inspector-fields, .canvas-bo-media-grid, .canvas-bo-form--grid { grid-template-columns: 1fr; }
    .canvas-bo-page-row { grid-template-columns: 34px minmax(0,1fr) auto; }
    .canvas-bo-page-row :is(.canvas-bo-coverage, .canvas-bo-row-actions) { display: none; }
    .canvas-bo-section-card { grid-template-columns: 32px 54px minmax(0,1fr); }
    .canvas-bo-section-card__thumb { height: 54px; width: 54px; }
    .canvas-bo-section-card__actions { display: flex; grid-column: 2 / -1; justify-content: end; }
    .canvas-bo-reusable-card { grid-template-columns: 40px minmax(0,1fr) auto; }
    .canvas-bo-reusable-card :is(.canvas-bo-reusable-card__impact, .canvas-bo-button) { grid-column: 2 / -1; justify-self: start; }
    .canvas-bo-audit-list article { grid-template-columns: 42px minmax(0,1fr); }
    .canvas-bo-audit-list :is(time, .canvas-bo-state) { grid-column: 2; }
    .canvas-bo-preview-modes button span { display: none; }
    .canvas-bo-review-action--compact, .canvas-bo-governance__state { grid-template-columns: 1fr; }
}
.canvas-bo-scopebar {
    align-items: center;
    background: linear-gradient(135deg, rgba(15, 67, 78, .96), rgba(8, 39, 52, .98));
    border: 1px solid rgba(99, 205, 194, .24);
    border-radius: 15px;
    box-shadow: 0 12px 30px rgba(4, 27, 39, .14);
    color: #eefcfb;
    display: grid;
    gap: 12px;
    grid-template-columns: 40px minmax(0, 1fr) auto;
    padding: 11px 13px;
}
.canvas-bo-scopebar__mark,
.canvas-bo-scope-card__icon {
    align-items: center;
    background: rgba(80, 208, 194, .12);
    border: 1px solid rgba(112, 220, 208, .2);
    border-radius: 11px;
    color: #79ded3;
    display: inline-flex;
    height: 40px;
    justify-content: center;
    width: 40px;
}
.canvas-bo-scopebar__identity {
    display: grid;
    gap: 2px;
    min-width: 0;
}
.canvas-bo-scopebar__identity small {
    color: #9fc4c8;
    font-size: .61rem;
    font-weight: 780;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.canvas-bo-scopebar__identity strong {
    font-size: .82rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.canvas-bo-scopebar__identity code {
    color: #b9d4d6;
    font-size: .65rem;
    overflow-wrap: anywhere;
}
.canvas-bo-scopebar__switch { justify-self: end; }
.canvas-bo-scope-chooser { min-height: 360px; }
.canvas-bo-context-note {
    align-items: start;
    background: rgba(28, 132, 125, .09);
    border: 1px solid rgba(42, 157, 148, .2);
    border-radius: 12px;
    color: var(--canvas-muted);
    display: grid;
    gap: 10px;
    grid-template-columns: 28px minmax(0, 1fr);
    padding: 11px 13px;
}
.canvas-bo-context-note i {
    color: var(--canvas-teal);
    padding-block-start: 2px;
}
.canvas-bo-context-note p { line-height: 1.5; margin: 0; }
.canvas-bo-scope-grid {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.canvas-bo-scope-search {
    align-items: end;
    background: rgba(5, 27, 39, .58);
    border: 1px solid var(--canvas-line);
    border-radius: 14px;
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(0, 1fr) auto;
    padding: 13px;
}
.canvas-bo-scope-search__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.canvas-bo__pager,
.canvas-bo-history__pager,
.canvas-bo-reference-results__pager {
    display: flex;
    justify-content: flex-end;
}
.canvas-bo :is(.canvas-bo__pager, .canvas-bo-history__pager, .canvas-bo-reference-results__pager) > .pager {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px 16px;
    margin: 0;
    width: auto;
}
.canvas-bo .pager__cluster { align-items: center; display: flex; gap: 8px; }
.canvas-bo .pager__label {
    color: var(--canvas-muted);
    font-size: .66rem;
    font-weight: 750;
    margin: 0;
    white-space: nowrap;
}
.canvas-bo .pager__pages { align-items: center; display: flex; flex-wrap: wrap; gap: 5px; }
.canvas-bo :is(.pager__page, .pager__gap) {
    align-items: center;
    border: 1px solid var(--canvas-line);
    border-radius: 8px;
    color: var(--canvas-muted);
    display: inline-flex;
    font-size: .68rem;
    height: 34px;
    justify-content: center;
    min-width: 34px;
    padding: 0 8px;
    text-decoration: none;
}
.canvas-bo .pager__page:is(:hover, :focus-visible),
.canvas-bo .pager__page--active {
    background: var(--canvas-teal-soft);
    border-color: var(--canvas-teal);
    color: var(--canvas-teal);
}
.canvas-bo :is(.canvas-bo__pager, .canvas-bo-history__pager, .canvas-bo-reference-results__pager) select.pager__perpage-select {
    background-color: var(--canvas-paper);
    border: 1px solid var(--canvas-line-strong);
    border-radius: 8px;
    color: var(--canvas-ink);
    font-size: .68rem;
    min-height: 34px;
    min-width: 72px;
    padding: 5px 28px 5px 9px;
    width: auto;
}
.canvas-bo-scope-card {
    align-items: center;
    background: linear-gradient(145deg, rgba(7, 31, 44, .98), rgba(5, 22, 32, .98));
    border: 1px solid var(--canvas-line-strong);
    border-radius: 16px;
    box-shadow: 0 12px 30px rgba(5, 34, 46, .08);
    color: #f2f8f9;
    display: grid;
    gap: 13px;
    grid-template-columns: 44px minmax(0, 1fr) auto;
    min-height: 112px;
    padding: 17px;
    text-decoration: none;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.canvas-bo-scope-card:hover,
.canvas-bo-scope-card:focus-visible {
    border-color: var(--canvas-teal);
    box-shadow: 0 18px 42px rgba(5, 56, 65, .15);
    transform: translateY(-2px);
}
.canvas-bo-scope-card__copy {
    display: grid;
    gap: 4px;
    min-width: 0;
}
.canvas-bo-scope-card__copy small,
.canvas-bo-scope-card__copy span {
    color: #9fb8c1;
    font-size: .66rem;
}
.canvas-bo-scope-card__copy small {
    font-weight: 760;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.canvas-bo-scope-card__copy strong {
    font-size: .92rem;
    overflow-wrap: anywhere;
}
.canvas-bo-scope-card__meta {
    align-items: end;
    display: grid;
    gap: 12px;
    justify-items: end;
}
.canvas-bo-scope-card__meta > i { color: var(--canvas-teal); }
@container (max-width: 720px) {
    .canvas-bo-scope-grid { grid-template-columns: 1fr; }
    .canvas-bo-scope-search { grid-template-columns: 1fr; }
    .canvas-bo-scopebar { grid-template-columns: 40px minmax(0, 1fr); }
    .canvas-bo-scopebar__switch { grid-column: 1 / -1; justify-self: stretch; }
}
@container (max-width: 460px) {
    .canvas-bo-scope-card { grid-template-columns: 38px minmax(0, 1fr); padding: 14px; }
    .canvas-bo-scope-card__icon { height: 38px; width: 38px; }
    .canvas-bo-scope-card__meta { align-items: center; grid-column: 2; grid-template-columns: auto 1fr; justify-items: start; }
    .canvas-bo-scope-search__actions { align-items: stretch; flex-direction: column; }
}

/* Composer actions must win over the shell's generic Bootstrap button skin. */
.canvas-bo .canvas-bo-section-card .canvas-bo-section-card__actions {
    align-items: center;
}
.canvas-bo .canvas-bo-section-card .canvas-bo-section-card__actions .canvas-bo-section-action {
    display: inline-flex;
    width: auto;
    min-width: 0;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
.canvas-bo .canvas-bo-section-card .canvas-bo-section-card__actions .canvas-bo-button {
    width: auto;
    min-width: 0;
    min-height: 28px;
    padding: 5px 8px;
    border: 1px solid rgba(111, 190, 196, .28);
    border-radius: 8px;
    color: #d9eff0;
    background: rgba(8, 35, 47, .88);
    box-shadow: none;
    font-size: .63rem;
    font-weight: 760;
    line-height: 1.05;
}
.canvas-bo .canvas-bo-section-card .canvas-bo-section-card__actions .canvas-bo-button:hover,
.canvas-bo .canvas-bo-section-card .canvas-bo-section-card__actions .canvas-bo-button:focus-visible {
    border-color: rgba(91, 219, 204, .58);
    color: #fff;
    background: rgba(22, 85, 88, .9);
}
.canvas-bo .canvas-bo-section-card .canvas-bo-section-card__actions .canvas-bo-section-card__edit {
    margin-inline-end: auto;
    border-color: rgba(91, 219, 204, .5);
    color: #f3fffd;
    background: linear-gradient(135deg, rgba(30, 145, 136, .94), rgba(19, 103, 105, .96));
}
.canvas-bo .canvas-bo-section-card .canvas-bo-section-card__actions .canvas-bo-button--danger {
    border-color: rgba(244, 171, 171, .34);
    color: #ffd6d6;
    background: rgba(105, 37, 47, .54);
}
/* Composer uses the page scrollbar; cards expose readable actions and drag order. */
.canvas-bo-composer .canvas-bo-drawer__body {
    max-height: none;
    overflow: visible;
}
.canvas-bo-composer > .canvas-bo-inspector {
    position: static;
    inset-block-start: auto;
    max-height: none;
    overflow: visible;
}
.canvas-bo-section-card {
    grid-template-columns: 36px 64px minmax(0, 1fr);
}
.canvas-bo-section-card__thumb {
    width: 64px;
    height: 64px;
}
.canvas-bo-section-card__handle[draggable="true"] {
    cursor: grab;
}
.canvas-bo-section-card__handle[draggable="true"]:active,
.canvas-bo-section-card.is-dragging .canvas-bo-section-card__handle {
    cursor: grabbing;
}
.canvas-bo-section-card.is-dragging {
    opacity: .48;
}
.canvas-bo-section-card.is-drop-before {
    box-shadow: inset 0 3px var(--canvas-teal-bright), var(--canvas-shadow-soft);
}
.canvas-bo-section-card.is-drop-after {
    box-shadow: inset 0 -3px var(--canvas-teal-bright), var(--canvas-shadow-soft);
}
.canvas-bo-section-card__actions {
    grid-column: 2 / -1;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
    padding-block-start: 2px;
}
.canvas-bo-section-card__actions form {
    margin: 0;
}
.canvas-bo-section-card__actions input[type="submit"],
.canvas-bo-section-card__actions button {
    width: auto;
    height: auto;
    min-height: 32px;
    padding: 6px 10px;
    font-size: .66rem;
    font-weight: 760;
    line-height: 1.15;
    background-image: none !important;
}
.canvas-bo-section-action--archive input[type="submit"] {
    border-color: rgba(244, 171, 171, .28);
    color: var(--canvas-red);
    background: var(--canvas-red-soft);
}
.canvas-bo-section-pager {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 10px;
    padding: 12px;
    border-block-start: 1px solid var(--canvas-line);
    color: var(--canvas-muted);
    font-size: .7rem;
    font-weight: 760;
}
.canvas-bo-section-pager > :first-child {
    justify-self: start;
}
.canvas-bo-section-pager > :last-child {
    justify-self: end;
}
@container (max-width: 620px) {
    .canvas-bo-section-card {
        grid-template-columns: 32px 52px minmax(0, 1fr);
    }
    .canvas-bo-section-card__thumb {
        width: 52px;
        height: 52px;
    }
    .canvas-bo-section-card__actions {
        grid-column: 1 / -1;
        justify-content: stretch;
    }
    .canvas-bo-section-card__actions form,
    .canvas-bo-section-card__actions input[type="submit"] {
        flex: 1 1 auto;
    }
    .canvas-bo-section-pager {
        grid-template-columns: 1fr 1fr;
    }
    .canvas-bo-section-pager > span {
        grid-column: 1 / -1;
        grid-row: 1;
        justify-self: center;
    }
}

@media (max-width: 900px) {
    .canvas-provider-card, .canvas-provider-card.is-featured { grid-column: span 6; }
    .canvas-page__intro h1 { max-width: none; }
    .canvas-hero { min-height: auto; }
    .canvas-hero__grid, .canvas-narrative__grid, .canvas-split__grid, .canvas-faq__grid, .canvas-contacts__grid, .canvas-cta__panel { grid-template-columns: 1fr; }
    .canvas-narrative header { position: static; }
    .canvas-split[data-variant="media-start"] :is(.canvas-split__media, .canvas-split__copy) { grid-column: auto; grid-row: auto; }
    .canvas-card-grid, .canvas-catalog__grid, .canvas-wiki-spaces__grid, .canvas-tempus-services__grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .canvas-scene-card { grid-column: span 6; }
    .canvas-scene-card:first-child { grid-column: span 12; }
    .canvas-metrics__grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .canvas-quotes { grid-template-columns: 1fr; }
    .canvas-cta .canvas-actions { justify-content: start; }
}
@media (max-width: 600px) {
    .canvas-provider-card, .canvas-provider-card.is-featured { grid-column: 1 / -1; min-height: 220px; }
    .canvas-provider-section--crm .canvas-provider-cta { align-items: stretch; grid-template-columns: 1fr; }
    .canvas-provider-section--crm .canvas-button { text-align: center; white-space: normal; width: 100%; }
    .canvas-page__intro { padding-block-start: 40px; }
    .canvas-page__intro h1 { font-size: clamp(2.35rem, 14vw, 4rem); }
    .canvas-section { padding-block: 58px; }
    .canvas-section h2 { font-size: clamp(2rem, 11vw, 3.25rem); }
    .canvas-hero h2 { font-size: clamp(2.65rem, 14vw, 4.2rem); }
    .canvas-hero__media { transform: none; }
    .canvas-card-grid, .canvas-catalog__grid, .canvas-wiki-spaces__grid, .canvas-tempus-services__grid, .canvas-tempus-specialists__grid, .canvas-metrics__grid, .canvas-logos__grid { grid-template-columns: 1fr; }
    .canvas-scene-card, .canvas-scene-card:first-child { grid-column: span 12; }
    .canvas-prismview-scenes__heading { align-items: start; flex-direction: column; gap: 0; }
    .canvas-prismview-scenes:not(.is-enhanced) .canvas-scene-slider__track { flex-direction: column; overflow: visible; padding: 0; }
    .canvas-prismview-scenes:not(.is-enhanced) .canvas-scene-slider__track .canvas-scene-card { flex-basis: auto; min-height: 390px; width: 100%; }
    .canvas-scene-slider__track .canvas-scene-card { flex-basis: min(86vw, 520px); min-height: 430px; }
    .canvas-metrics__grid > div { border-block-start: 1px solid rgba(198,224,226,.17); border-inline-start: 0; min-height: 130px; }
    .canvas-card { min-height: 220px; }
    .canvas-contacts__list > div { gap: 8px; grid-template-columns: 1fr; }
    .canvas-actions { align-items: stretch; flex-direction: column; }
    .canvas-button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
    .canvas-page *, .canvas-page *::before, .canvas-page *::after,
    .canvas-bo *, .canvas-bo *::before, .canvas-bo *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
}
.canvas-preview-route { background: var(--canvas-ink, #07161b); color: var(--canvas-paper, #f5fbfb); margin: 0; min-height: 100vh; }
.canvas-preview-route__notice { align-items: center; backdrop-filter: blur(18px); background: rgba(7,22,27,.92); border-block-end: 1px solid rgba(198,224,226,.18); display: flex; gap: 12px; inset-block-start: 0; justify-content: center; padding: 10px 20px; position: sticky; z-index: 20; }
.canvas-preview-route__notice strong { color: var(--canvas-accent, #8ce5d4); font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; }
.canvas-preview-route__notice span { color: rgba(245,251,251,.7); font-size: .82rem; }
.canvas-bo-history-list { display: grid; gap: 10px; list-style: none; margin: 0; padding: 0; }
.canvas-bo-history-list > li { align-items: start; background: rgba(255,255,255,.035); border: 1px solid var(--canvas-bo-border); border-radius: 14px; display: grid; gap: 12px; padding: 13px; }
.canvas-bo-history-list > li > div { align-items: center; display: flex; flex-wrap: wrap; gap: 7px; }
.canvas-bo-history-list small { color: var(--canvas-bo-muted); flex-basis: 100%; }
.canvas-bo-history-list form { display: grid; gap: 9px; }
.canvas-bo-schedule { border: 1px solid var(--canvas-line); border-radius: 12px; overflow: hidden; }
.canvas-bo-schedule > summary { align-items: center; color: var(--canvas-ink); cursor: pointer; display: flex; font-size: .72rem; font-weight: 800; gap: 8px; list-style: none; padding: 10px 11px; }
.canvas-bo-schedule > summary::-webkit-details-marker { display: none; }
.canvas-bo-schedule__body { border-block-start: 1px solid var(--canvas-line); display: grid; gap: 10px; padding: 11px; }
.canvas-bo-schedule__body > p { margin: 0; }
.canvas-bo-schedule__when { display: grid; gap: 8px; grid-template-columns: minmax(0, 1fr) minmax(104px, .72fr); }
.canvas-bo .canvas-bo-scheduled-jobs > .canvas-bo-drawer__body > .canvas-bo-muted { color: var(--canvas-muted); }
.canvas-bo-scheduled-list { display: grid; gap: 10px; list-style: none; margin: 0; padding: 0; }
.canvas-bo-scheduled-card { background: var(--canvas-white); border: 1px solid var(--canvas-line); border-inline-start: 3px solid #83a9c3; border-radius: 12px; display: grid; gap: 11px; min-width: 0; padding: 12px; }
.canvas-bo-scheduled-card--leased { border-inline-start-color: var(--canvas-amber); }
.canvas-bo-scheduled-card--completed { border-inline-start-color: var(--canvas-green); }
.canvas-bo-scheduled-card--failed { border-inline-start-color: var(--canvas-red); }
.canvas-bo-scheduled-card--cancelled { border-inline-start-color: var(--canvas-faint); opacity: .82; }
.canvas-bo-scheduled-card > header { align-items: start; display: flex; gap: 9px; justify-content: space-between; }
.canvas-bo-scheduled-card > header > div { display: grid; gap: 3px; min-width: 0; }
.canvas-bo .canvas-bo-scheduled-card > header > div > strong { color: var(--canvas-ink); }
.canvas-bo-scheduled-card code { color: var(--canvas-muted); font-size: .61rem; overflow-wrap: anywhere; }
.canvas-bo-scheduled-card dl { display: grid; gap: 7px; margin: 0; }
.canvas-bo-scheduled-card dl > div { align-items: start; display: grid; gap: 5px; grid-template-columns: minmax(84px, .7fr) minmax(0, 1.3fr); }
.canvas-bo-scheduled-card dt { color: var(--canvas-muted); font-size: .62rem; }
.canvas-bo-scheduled-card dd { color: var(--canvas-ink); display: grid; font-size: .68rem; gap: 2px; min-width: 0; text-align: end; }
.canvas-bo-scheduled-card dd small { color: var(--canvas-muted); font-size: .58rem; font-weight: 800; letter-spacing: .1em; }
.canvas-bo-job-note { align-items: start; background: var(--canvas-amber-soft); border-radius: 9px; color: var(--canvas-amber); display: flex; font-size: .66rem; gap: 7px; margin: 0; padding: 8px 9px; }
.canvas-bo-scheduled-card__cancel { border-block-start: 1px solid var(--canvas-line); display: grid; gap: 8px; padding-block-start: 10px; }
.canvas-bo-scheduled-card__cancel textarea { min-height: 64px; }
.canvas-bo-schedule-pager { display: flex; gap: 8px; justify-content: space-between; padding-block-start: 4px; }
.canvas-bo-empty--compact { min-height: 120px; padding: 18px 12px; }
.canvas-bo-linked { border-inline-start: 3px solid var(--canvas-teal); }
.canvas-bo-propagations { margin-block-start: 16px; }
.canvas-bo-propagation-list { display: grid; gap: 11px; list-style: none; margin: 0; padding: 14px; }
.canvas-bo-propagation-card { background: var(--canvas-white); border: 1px solid var(--canvas-line); border-inline-start: 3px solid #83a9c3; border-radius: 13px; display: grid; gap: 11px; min-width: 0; padding: 13px; }
.canvas-bo-propagation-card--leased { border-inline-start-color: var(--canvas-amber); }
.canvas-bo-propagation-card--completed { border-inline-start-color: var(--canvas-green); }
.canvas-bo-propagation-card--failed { border-inline-start-color: var(--canvas-red); }
.canvas-bo-propagation-card--cancelled { border-inline-start-color: var(--canvas-faint); opacity: .84; }
.canvas-bo-propagation-card > header { align-items: start; display: flex; gap: 10px; justify-content: space-between; }
.canvas-bo-propagation-card > header > div { display: grid; gap: 3px; min-width: 0; }
.canvas-bo-propagation-card code { color: var(--canvas-muted); font-size: .61rem; overflow-wrap: anywhere; }
.canvas-bo-propagation-summary { display: grid; gap: 8px; grid-template-columns: repeat(4, minmax(0,1fr)); margin: 0; }
.canvas-bo-propagation-summary > div { background: var(--canvas-mist); border-radius: 9px; display: grid; gap: 3px; padding: 8px 9px; }
.canvas-bo-propagation-summary dt { color: var(--canvas-muted); font-size: .61rem; }
.canvas-bo-propagation-summary dd { color: var(--canvas-ink); font-size: .7rem; font-weight: 800; margin: 0; min-width: 0; overflow-wrap: anywhere; }
.canvas-bo-propagation-summary dd small { color: var(--canvas-muted); font-size: .57rem; }
.canvas-bo-target-counts { display: grid; gap: 7px; grid-template-columns: repeat(7, minmax(58px,1fr)); }
.canvas-bo-target-counts > span { align-items: center; background: color-mix(in srgb, var(--canvas-mist) 72%, transparent); border: 1px solid var(--canvas-line); border-radius: 9px; display: grid; justify-items: center; min-width: 0; padding: 7px 4px; }
.canvas-bo-target-counts strong { color: var(--canvas-ink); font-size: .8rem; }
.canvas-bo-target-counts small { color: var(--canvas-muted); font-size: .56rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.canvas-bo-job-error { align-items: start; background: color-mix(in srgb, var(--canvas-red) 9%, var(--canvas-white)); border-radius: 9px; color: var(--canvas-red); display: flex; font-size: .66rem; gap: 8px; margin: 0; padding: 9px; }
.canvas-bo-job-error > span { display: grid; gap: 3px; min-width: 0; }
.canvas-bo-job-error small { color: var(--canvas-muted); overflow-wrap: anywhere; }
.canvas-bo-propagation-card__cancel { border-block-start: 1px solid var(--canvas-line); display: grid; gap: 8px; padding-block-start: 10px; }
.canvas-bo-propagation-card__cancel textarea { min-height: 64px; }
.canvas-bo-propagation-pager { display: flex; gap: 8px; justify-content: space-between; padding: 0 14px 14px; }
@container (max-width: 620px) {
    .canvas-bo-schedule__when { grid-template-columns: 1fr; }
    .canvas-bo-scheduled-card dl > div { grid-template-columns: 1fr; }
    .canvas-bo-scheduled-card dd { text-align: start; }
    .canvas-bo-schedule-pager { align-items: stretch; flex-direction: column; }
    .canvas-bo-propagation-summary { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .canvas-bo-target-counts { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .canvas-bo-propagation-pager { align-items: stretch; flex-direction: column; }
}

/* Match the established Tempus dark backoffice hierarchy. */
.canvas-bo {
    --canvas-font: "Manrope", "Segoe UI", sans-serif;
    --canvas-display: "Manrope", "Segoe UI", sans-serif;
    --canvas-ink: #f3f8f9;
    --canvas-ink-soft: #0b2634;
    --canvas-text: #dbe8eb;
    --canvas-muted: #a6b9c4;
    --canvas-faint: #8299a4;
    --canvas-line: rgba(145, 190, 200, .17);
    --canvas-line-strong: rgba(67, 194, 178, .42);
    --canvas-paper: #0b2634;
    --canvas-mist: rgba(13, 43, 56, .58);
    --canvas-white: #0b2634;
    --canvas-teal: #8ee0d8;
    --canvas-teal-bright: #43c2b2;
    --canvas-teal-soft: rgba(20, 122, 120, .2);
    --canvas-gold: #e3c381;
    --canvas-gold-soft: rgba(180, 127, 42, .2);
    --canvas-green: #9aefb6;
    --canvas-green-soft: rgba(72, 160, 105, .18);
    --canvas-amber: #e3c381;
    --canvas-amber-soft: rgba(180, 127, 42, .2);
    --canvas-red: #f4abab;
    --canvas-red-soft: rgba(184, 79, 96, .2);
    --canvas-shadow: inset 0 1px rgba(255, 255, 255, .025), 0 22px 48px rgba(3, 15, 24, .2);
    --canvas-shadow-soft: inset 0 1px rgba(255, 255, 255, .025), 0 16px 34px rgba(2, 12, 20, .22);
    --canvas-bo-border: var(--canvas-line);
    --canvas-bo-muted: var(--canvas-muted);
    --sapphire-admin-surface: rgba(5, 24, 35, .58);
    --sapphire-admin-surface-strong: rgba(7, 27, 39, .92);
    --sapphire-admin-surface-soft: rgba(13, 43, 56, .58);
    --sapphire-admin-border: var(--canvas-line);
    --sapphire-admin-text: var(--canvas-ink);
    --sapphire-admin-text-strong: var(--canvas-ink);
    --sapphire-admin-muted: var(--canvas-muted);
    --sapphire-admin-shadow-md: none;
    padding: 22px;
    border: 1px solid var(--canvas-line);
    border-radius: 28px;
    color: var(--canvas-text);
    color-scheme: dark;
    background:
        radial-gradient(circle at 92% -8%, rgba(45, 178, 163, .13), transparent 30%),
        radial-gradient(circle at 2% 108%, rgba(211, 167, 84, .08), transparent 28%),
        linear-gradient(145deg, #06131f, #071522 42%, #0b202c);
    box-shadow: var(--canvas-shadow);
}
.canvas-bo__hero {
    min-height: 0;
    border-color: var(--canvas-line);
    background:
        radial-gradient(circle at 88% 0%, rgba(45, 178, 163, .15), transparent 30%),
        radial-gradient(circle at 8% 120%, rgba(211, 167, 84, .1), transparent 32%),
        linear-gradient(145deg, #071522, #0a202d 60%, #10313e);
    box-shadow: var(--canvas-shadow-soft);
}
.canvas-bo__nav {
    position: relative;
    inset-block-start: auto;
    padding: 8px;
    border-color: var(--canvas-line);
    border-radius: 18px;
    background: rgba(5, 24, 35, .58);
    box-shadow: inset 0 1px rgba(255, 255, 255, .02);
}
.canvas-bo__nav a {
    flex: 0 0 auto;
    border: 1px solid transparent;
    border-radius: 999px;
    color: #aec1cb;
}
.canvas-bo__nav a:hover {
    border-color: rgba(74, 199, 181, .28);
    color: #e9f7f5;
    background: rgba(74, 199, 181, .08);
}
.canvas-bo__nav a.is-active {
    border-color: rgba(89, 214, 195, .42);
    color: #fff;
    background: linear-gradient(135deg, #1c9d90, #147a78);
    box-shadow: 0 9px 20px rgba(8, 76, 73, .26);
}
.canvas-bo__workspace {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
.canvas-bo-kicker,
.canvas-bo-field > span,
.canvas-bo-field__label {
    color: var(--canvas-gold);
}
.canvas-bo-view__head h3,
.canvas-bo-panel__head h3,
.canvas-bo-empty h3,
.canvas-bo-record strong,
.canvas-bo-page-row__copy strong,
.canvas-bo-drawer > summary,
.canvas-bo-palette-card strong,
.canvas-bo-stage__head h3,
.canvas-bo-inspector__head h3,
.canvas-bo-section-card__copy > strong,
.canvas-bo-workflow h3,
.canvas-bo-workflow dd,
.canvas-bo-media-card__copy strong,
.canvas-bo-reusable-card__copy > strong,
.canvas-bo-reusable-card__impact strong {
    color: var(--canvas-ink);
}
.canvas-bo-view__head p,
.canvas-bo-panel__head p,
.canvas-bo-record small,
.canvas-bo-page-row__copy small,
.canvas-bo-inspector__head p,
.canvas-bo-section-card__copy > small,
.canvas-bo-media-card__copy :is(small, code),
.canvas-bo-reusable-card__copy code,
.canvas-bo-reusable-card__impact small,
.canvas-bo-reusable-card__summary {
    color: var(--canvas-muted);
}
.canvas-bo-button,
.canvas-bo-icon-button,
.canvas-bo-section-card__actions input[type="submit"] {
    border-color: var(--canvas-line);
    color: #c7e7e5;
    background-color: rgba(13, 43, 56, .88);
    box-shadow: none;
}
.canvas-bo-button:hover,
.canvas-bo-icon-button:hover,
.canvas-bo-section-card__actions input[type="submit"]:hover {
    border-color: rgba(92, 219, 202, .48);
    color: #fff;
    background-color: rgba(20, 76, 82, .74);
}
.canvas-bo-button--primary {
    border-color: rgba(67, 194, 178, .42);
    color: #fff;
    background: linear-gradient(135deg, #299f94, #176f70);
    box-shadow: 0 10px 22px rgba(13, 100, 97, .22);
}
.canvas-bo-button--quiet,
.canvas-bo-button--glass {
    border-color: var(--canvas-line);
    color: #bed5dc !important;
    background: rgba(13, 43, 56, .82);
}
.canvas-bo-panel,
.canvas-bo-metric,
.canvas-bo-drawer,
.canvas-bo-stage,
.canvas-bo-inspector,
.canvas-bo-palette-card,
.canvas-bo-section-card,
.canvas-bo-media-card,
.canvas-bo-empty--denied,
.canvas-bo-scheduled-card,
.canvas-bo-propagation-card {
    border-color: var(--canvas-line);
    background: linear-gradient(145deg, rgba(16, 49, 62, .94), rgba(8, 29, 41, .97));
    box-shadow: var(--canvas-shadow-soft);
}
.canvas-bo-metric {
    border-block-start-color: var(--canvas-teal-bright);
}
.canvas-bo-record,
.canvas-bo-locales,
.canvas-bo-search,
.canvas-bo-section-list,
.canvas-bo-media-card__preview,
.canvas-bo-propagation-summary > div,
.canvas-bo-target-counts > span {
    border-color: var(--canvas-line);
    color: var(--canvas-text);
    background: rgba(5, 24, 35, .58);
}
.canvas-bo-record:hover,
.canvas-bo-page-row:hover,
.canvas-bo-mini-tree__row:hover,
.canvas-bo-palette-card:hover {
    border-color: rgba(92, 219, 202, .42);
    background: rgba(20, 76, 82, .38);
}
.canvas-bo-page-row.is-selected,
.canvas-bo-mini-tree__row.is-selected {
    color: var(--canvas-teal);
    background: rgba(20, 122, 120, .2);
}
.canvas-bo-locale.is-active {
    color: #fff;
    background: linear-gradient(135deg, #1c9d90, #147a78);
}
.canvas-bo-state {
    border-color: rgba(120, 191, 244, .2);
    color: #78bff4;
    background: rgba(48, 115, 180, .2);
}
.canvas-bo-state--draft,
.canvas-bo-state--incomplete,
.canvas-bo-state--warning,
.canvas-bo-state--leased {
    border-color: rgba(227, 195, 129, .24);
    color: var(--canvas-amber);
    background: var(--canvas-amber-soft);
}
.canvas-bo-state--published,
.canvas-bo-state--complete,
.canvas-bo-state--completed,
.canvas-bo-state--healthy,
.canvas-bo-state--active {
    border-color: rgba(154, 239, 182, .22);
    color: var(--canvas-green);
    background: var(--canvas-green-soft);
}
.canvas-bo-state--archived,
.canvas-bo-state--failed,
.canvas-bo-state--error {
    border-color: rgba(244, 171, 171, .24);
    color: var(--canvas-red);
    background: var(--canvas-red-soft);
}
.canvas-bo-input,
.canvas-bo-field :is(input:not([type="submit"]), select, textarea) {
    border-color: var(--canvas-line-strong);
    color: var(--canvas-ink);
    background: rgba(4, 19, 29, .72);
    box-shadow: inset 0 1px rgba(255, 255, 255, .02);
}
.canvas-bo :is(input, textarea)::placeholder {
    color: rgba(166, 185, 196, .68);
}
.canvas-bo :is(input, select, textarea):focus {
    border-color: rgba(67, 194, 178, .72);
    outline: 3px solid rgba(67, 194, 178, .12);
    background: rgba(4, 19, 29, .9);
    box-shadow: none;
}
.canvas-bo select option {
    color: var(--canvas-ink);
    background: #071b27;
}
.canvas-bo-schedule,
.canvas-bo-history-list > li {
    border-color: var(--canvas-line);
    color: var(--canvas-text);
    background: rgba(5, 24, 35, .58);
}
.canvas-bo-job-note {
    color: var(--canvas-amber);
    background: var(--canvas-amber-soft);
}
.canvas-bo-job-error {
    color: var(--canvas-red);
    background: var(--canvas-red-soft);
}
.canvas-bo-media-dialog figcaption {
    color: var(--canvas-muted);
    background: #071b27;
}
@container (max-width: 620px) {
    .canvas-bo {
        padding: 14px;
        border-radius: 22px;
    }
    .canvas-bo__hero {
        border-radius: 18px;
    }
}
/* Schema-driven Canvas authoring keeps the Demo palette while sharing behavior. */
.canvas-bo-repeater { background: var(--canvas-mist); border: 1px solid var(--canvas-line); border-radius: 12px; display: grid; gap: 9px; margin-block-start: 8px; padding: 10px; }
.canvas-bo-repeater__head, .canvas-bo-repeater-item__head { align-items: center; display: flex; gap: 10px; justify-content: space-between; }
.canvas-bo-repeater__head > strong { color: var(--canvas-ink); font-size: .76rem; }
.canvas-bo-repeater__items { display: grid; gap: 9px; }
.canvas-bo-repeater-item { background: var(--canvas-paper); border: 1px solid var(--canvas-line); border-radius: 10px; box-shadow: var(--canvas-shadow-soft); display: grid; gap: 10px; min-width: 0; padding: 10px; }
.canvas-bo-repeater-item__head { border-block-end: 1px solid var(--canvas-line); padding-block-end: 8px; }
.canvas-bo-repeater-item__head > strong { color: var(--canvas-ink); font-size: .72rem; }
.canvas-bo-repeater-item__head > strong > span { color: var(--canvas-teal); }
.canvas-bo-config-node { min-width: 0; }
.canvas-bo-repeater-native-add { display: grid; min-width: 0; }
.canvas-bo-repeater-native-add .canvas-bo-button { float: none; max-width: 100%; position: static; white-space: normal; width: 100%; }
.canvas-bo-repeater-item__head { align-items: flex-start; flex-wrap: wrap; }
.canvas-bo-repeater-item__actions { display: flex; flex: 1 1 100%; flex-wrap: wrap; gap: 4px; justify-content: flex-start; min-width: 0; }
.canvas-bo-repeater-item__actions .canvas-bo-icon-button { float: none; font-size: .61rem; height: auto; line-height: 1.2; max-width: 100%; min-height: 32px; padding: 6px 9px; position: static; white-space: normal; width: auto; }
.canvas-bo-repeater-item__actions .canvas-bo-icon-button--danger { margin-inline-start: auto; }
.canvas-bo-reference-picker { background: var(--canvas-mist); border: 1px solid var(--canvas-line); border-radius: 10px; display: grid; gap: 7px; padding: 8px; }
.canvas-bo-reference-picker__search { min-height: 36px !important; }
.canvas-bo-reference-picker__exact { display: none; }
.canvas-bo-reference-picker.is-exact > [data-canvas-picker-search], .canvas-bo-reference-picker.is-exact > [data-canvas-picker-select] { display: none; }
.canvas-bo-reference-picker.is-exact .canvas-bo-reference-picker__exact { display: block; }
.canvas-bo-reference-picker > small { color: var(--canvas-muted); font-size: .62rem; line-height: 1.45; }
.canvas-bo-reference-results__summary { display: grid; gap: 5px; list-style: none; margin: 0; max-block-size: 190px; overflow: auto; padding: 0; }
.canvas-bo-reference-results__summary li { align-items: start; background: var(--canvas-paper); border: 1px solid var(--canvas-line); border-radius: 8px; display: flex; gap: 8px; justify-content: space-between; padding: 7px 8px; }
.canvas-bo-reference-results__summary li.is-selected { border-color: var(--canvas-teal); box-shadow: 0 0 0 1px var(--canvas-teal-soft); }
.canvas-bo-reference-results__summary span { display: grid; gap: 2px; min-width: 0; }
.canvas-bo-reference-results__summary strong { color: var(--canvas-ink); font-size: .69rem; }
.canvas-bo-reference-results__summary small { color: var(--canvas-muted); font-size: .61rem; line-height: 1.4; }
.canvas-bo-reference-results__summary em { color: var(--canvas-teal); font-size: .58rem; font-style: normal; white-space: nowrap; }
.canvas-bo-reference-results__pager { display: flex; flex-wrap: wrap; gap: 6px; }

/* Composer uses the page scrollbar; cards expose readable actions and drag order. */
.canvas-bo-composer .canvas-bo-drawer__body {
    max-height: none;
    overflow: visible;
}
.canvas-bo-composer > .canvas-bo-inspector {
    position: static;
    inset-block-start: auto;
    max-height: none;
    overflow: visible;
}
.canvas-bo-section-card {
    grid-template-columns: 36px 64px minmax(0, 1fr);
}
.canvas-bo-section-card__thumb {
    width: 64px;
    height: 64px;
}
.canvas-bo-section-card__handle[draggable="true"] { cursor: grab; }
.canvas-bo-section-card__handle[draggable="true"]:active,
.canvas-bo-section-card.is-dragging .canvas-bo-section-card__handle { cursor: grabbing; }
.canvas-bo-section-card.is-dragging { opacity: .48; }
.canvas-bo-section-card.is-drop-before { box-shadow: inset 0 3px var(--canvas-teal-bright), var(--canvas-shadow-soft); }
.canvas-bo-section-card.is-drop-after { box-shadow: inset 0 -3px var(--canvas-teal-bright), var(--canvas-shadow-soft); }
.canvas-bo-section-card__actions {
    grid-column: 2 / -1;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
    padding-block-start: 2px;
}
.canvas-bo-section-card__actions form { margin: 0; }
.canvas-bo-section-card__actions input[type="submit"],
.canvas-bo-section-card__actions button {
    width: auto;
    height: auto;
    min-height: 32px;
    padding: 6px 10px;
    font-size: .66rem;
    font-weight: 760;
    line-height: 1.15;
    background-image: none !important;
}
.canvas-bo-section-action--archive input[type="submit"] {
    border-color: rgba(244, 171, 171, .28);
    color: var(--canvas-red);
    background: var(--canvas-red-soft);
}
.canvas-bo-section-pager {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 10px;
    padding: 12px;
    border-block-start: 1px solid var(--canvas-line);
    color: var(--canvas-muted);
    font-size: .7rem;
    font-weight: 760;
}
.canvas-bo-section-pager > :first-child { justify-self: start; }
.canvas-bo-section-pager > :last-child { justify-self: end; }
@container (max-width: 620px) {
    .canvas-bo-section-card { grid-template-columns: 32px 52px minmax(0, 1fr); }
    .canvas-bo-section-card__thumb { width: 52px; height: 52px; }
    .canvas-bo-section-card__actions { grid-column: 1 / -1; justify-content: stretch; }
    .canvas-bo-section-card__actions form,
    .canvas-bo-section-card__actions input[type="submit"] { flex: 1 1 auto; }
    .canvas-bo-section-pager { grid-template-columns: 1fr 1fr; }
    .canvas-bo-section-pager > span {
        grid-column: 1 / -1;
        grid-row: 1;
        justify-self: center;
    }
}

/* Governed reusable authoring */
.canvas-bo-reusable-card { color: inherit; text-decoration: none; }
.canvas-bo-reusable-card:hover { background: var(--canvas-mist); }
.canvas-bo-reusable-hero { align-items: flex-start; display: flex; gap: 18px; justify-content: space-between; }
.canvas-bo-reusable-hero__status,
.canvas-bo-reusable-card > .canvas-bo-badges { align-items: center; display: flex; flex-wrap: wrap; gap: 7px; }
.canvas-bo-backlink { align-items: center; color: var(--canvas-teal); display: inline-flex; font-size: .72rem; font-weight: 800; gap: 7px; margin-block-end: 12px; text-decoration: none; }
.canvas-bo-backlink:hover { text-decoration: underline; }
.canvas-bo-reusable-tabs { background: var(--canvas-mist); border: 1px solid var(--canvas-line); border-radius: 15px; display: flex; gap: 5px; margin-block: 14px; overflow-x: auto; padding: 5px; scrollbar-width: thin; }
.canvas-bo-reusable-tabs a { border: 1px solid transparent; border-radius: 10px; color: var(--canvas-muted); flex: 0 0 auto; font-size: .72rem; font-weight: 800; padding: 9px 12px; text-decoration: none; }
.canvas-bo-reusable-tabs a:hover { color: var(--canvas-ink); }
.canvas-bo-reusable-tabs a[aria-current="page"] { background: var(--canvas-white); border-color: var(--canvas-line); box-shadow: var(--canvas-shadow-soft); color: var(--canvas-ink); }
.canvas-bo-reusable-summary { margin-block-end: 12px; padding: 14px; }
.canvas-bo-reusable-summary dl,
.canvas-bo-impact-metrics { display: grid; gap: 9px; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; }
.canvas-bo-reusable-summary dl > div,
.canvas-bo-impact-metrics > div { background: var(--canvas-mist); border: 1px solid var(--canvas-line); border-radius: 11px; display: grid; gap: 4px; min-width: 0; padding: 10px 11px; }
.canvas-bo-reusable-summary dt,
.canvas-bo-impact-metrics dt { color: var(--canvas-muted); font-size: .62rem; font-weight: 700; }
.canvas-bo-reusable-summary dd,
.canvas-bo-impact-metrics dd { color: var(--canvas-ink); display: grid; font-size: .76rem; gap: 3px; margin: 0; min-width: 0; }
.canvas-bo-reusable-summary code,
.canvas-bo-fingerprint code,
.canvas-bo-reusable-history-card code,
.canvas-bo-propagation-target-list code { font-size: .62rem; overflow-wrap: anywhere; }
.canvas-bo-reusable-locales { display: flex; gap: 7px; margin-block: 12px; overflow-x: auto; padding-block-end: 4px; scrollbar-width: thin; }
.canvas-bo-reusable-locales a { align-items: center; background: var(--canvas-white); border: 1px solid var(--canvas-line); border-radius: 11px; color: var(--canvas-muted); display: flex; flex: 0 0 auto; gap: 7px; min-width: 112px; padding: 9px 11px; text-decoration: none; }
.canvas-bo-reusable-locales a span { color: var(--canvas-ink); font-size: .72rem; font-weight: 800; }
.canvas-bo-reusable-locales a small { font-size: .6rem; }
.canvas-bo-reusable-locales a[aria-current="page"] { border-color: var(--canvas-teal); box-shadow: 0 0 0 2px color-mix(in srgb, var(--canvas-teal) 14%, transparent); }
.canvas-bo-reusable-detail-grid { align-items: start; display: grid; gap: 14px; grid-template-columns: minmax(0, 1.35fr) minmax(280px, .75fr); }
.canvas-bo-reusable-editor,
.canvas-bo-reusable-review,
.canvas-bo-reusable-activation,
.canvas-bo-reusable-lifecycle { min-width: 0; padding: 15px; }
.canvas-bo-reusable-governance { display: grid; gap: 12px; min-width: 0; }
.canvas-bo-reusable-fields { display: grid; gap: 10px; margin-block: 13px; }
.canvas-bo-reusable-fields .canvas-bo-config-node--structural { border-block-start: 1px solid var(--canvas-line); margin-block-start: 3px; padding-block-start: 9px; }
.canvas-bo-reusable-fields .canvas-bo-config-node--structural:first-child { border-block-start: 0; margin: 0; padding: 0; }
.canvas-bo-readonly-value { background: var(--canvas-mist); border: 1px solid var(--canvas-line); border-radius: 9px; color: var(--canvas-ink); display: block; font-size: .7rem; overflow-wrap: anywhere; padding: 9px 10px; }
.canvas-bo-readonly-config { display: grid; gap: 8px; margin: 12px 0 0; }
.canvas-bo-readonly-config > div { background: var(--canvas-mist); border: 1px solid var(--canvas-line); border-radius: 10px; display: grid; gap: 4px; padding: 9px 10px; }
.canvas-bo-readonly-config dt { color: var(--canvas-muted); font-size: .62rem; font-weight: 800; }
.canvas-bo-readonly-config dd { color: var(--canvas-ink); font-size: .76rem; margin: 0; overflow-wrap: anywhere; white-space: pre-wrap; }
.canvas-bo-reusable-editor__form > .canvas-bo-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.canvas-bo-review-actions,
.canvas-bo-lifecycle-actions { display: grid; gap: 9px; margin-block-start: 12px; }
.canvas-bo-review-action,
.canvas-bo-lifecycle-actions > form { background: var(--canvas-mist); border: 1px solid var(--canvas-line); border-radius: 11px; display: grid; gap: 8px; padding: 10px; }
.canvas-bo-impact-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-block: 12px; }
.canvas-bo-impact-metrics dd { font-size: 1.05rem; font-weight: 900; }
.canvas-bo-fingerprint { background: var(--canvas-mist); border: 1px solid var(--canvas-line); border-radius: 11px; display: grid; gap: 5px; margin: 12px 0; padding: 10px 11px; }
.canvas-bo-fingerprint > span { color: var(--canvas-muted); font-size: .62rem; font-weight: 800; }
.canvas-bo-fingerprint code { color: var(--canvas-ink); }
.canvas-bo-activation-confirm { display: grid; gap: 10px; margin-block-start: 12px; }
.canvas-bo-reusable-history,
.canvas-bo-reusable-impact,
.canvas-bo-propagation-targets { padding: 15px; }
.canvas-bo-reusable-history-list,
.canvas-bo-impact-edge-list,
.canvas-bo-propagation-target-list { display: grid; gap: 10px; list-style: none; margin: 12px 0 0; padding: 0; }
.canvas-bo-reusable-history-card,
.canvas-bo-impact-edge-list > li,
.canvas-bo-propagation-target-list > li { background: var(--canvas-mist); border: 1px solid var(--canvas-line); border-radius: 12px; display: grid; gap: 10px; padding: 12px; }
.canvas-bo-reusable-history-card > header,
.canvas-bo-impact-edge-list > li > header,
.canvas-bo-propagation-target-list > li > header { align-items: flex-start; display: flex; gap: 10px; justify-content: space-between; }
.canvas-bo-reusable-history-card > header > span,
.canvas-bo-propagation-target-list > li > header > span { display: grid; gap: 3px; min-width: 0; }
.canvas-bo-history-rollback { border-block-start: 1px solid var(--canvas-line); padding-block-start: 10px; }
.canvas-bo-impact-edge-list dl,
.canvas-bo-propagation-target-list dl { display: grid; gap: 8px; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; }
.canvas-bo-impact-edge-list dl > div,
.canvas-bo-propagation-target-list dl > div { min-width: 0; }
.canvas-bo-impact-edge-list dt,
.canvas-bo-propagation-target-list dt { color: var(--canvas-muted); font-size: .6rem; }
.canvas-bo-impact-edge-list dd,
.canvas-bo-propagation-target-list dd { color: var(--canvas-ink); font-size: .7rem; margin: 3px 0 0; overflow-wrap: anywhere; }
.canvas-bo-propagation-card__actions { align-items: flex-start; border-block-start: 1px solid var(--canvas-line); display: flex; flex-wrap: wrap; gap: 9px; padding-block-start: 10px; }
.canvas-bo-propagation-card__actions > form { display: grid; flex: 1 1 240px; gap: 8px; }
.canvas-bo-state--disabled { border-color: color-mix(in srgb, var(--canvas-amber) 28%, transparent); color: var(--canvas-amber); background: var(--canvas-amber-soft); }
@container (max-width: 760px) {
    .canvas-bo-reusable-hero { display: grid; }
    .canvas-bo-reusable-detail-grid { grid-template-columns: 1fr; }
    .canvas-bo-reusable-summary dl,
    .canvas-bo-impact-metrics { grid-template-columns: 1fr; }
    .canvas-bo-reusable-editor__form > .canvas-bo-form-grid { grid-template-columns: 1fr; }
    .canvas-bo-impact-edge-list dl,
    .canvas-bo-propagation-target-list dl { grid-template-columns: 1fr; }
}
@container (max-width: 520px) {
    .canvas-bo-reusable-card { grid-template-columns: 38px minmax(0, 1fr); }
    .canvas-bo-reusable-card > :is(.canvas-bo-reusable-card__impact, .canvas-bo-badges) { grid-column: 2; justify-self: start; }
    .canvas-bo-reusable-tabs { margin-inline: -4px; }
    .canvas-bo-reusable-history-card > header,
    .canvas-bo-impact-edge-list > li > header,
    .canvas-bo-propagation-target-list > li > header { align-items: flex-start; display: grid; }
}
/* Enterprise composer panels: Demo evidence console. */
.canvas-bo {
    --canvas-enterprise-accent: #66adff;
    --canvas-enterprise-accent-soft: rgba(102, 173, 255, .13);
    --canvas-enterprise-surface: rgba(7, 24, 43, .84);
    --canvas-enterprise-surface-raised: rgba(12, 40, 70, .92);
}
.canvas-bo-composer-view,
.canvas-bo-enterprise-panel,
.canvas-bo-translation-workspace,
.canvas-bo-blueprint-layout,
.canvas-bo-rich-editor { max-inline-size: 100%; min-inline-size: 0; }
.canvas-bo-composer-tabs { background: rgba(3, 15, 28, .82); border: 1px solid var(--canvas-line); border-radius: 11px; display: flex; gap: 4px; margin-block: 4px 16px; max-inline-size: 100%; overflow-x: auto; padding: 4px; scrollbar-width: thin; }
.canvas-bo-composer-tabs a { border: 1px solid transparent; border-radius: 9px; color: var(--canvas-muted); flex: 0 0 auto; font-size: .72rem; font-weight: 820; padding: 9px 13px; text-decoration: none; }
.canvas-bo-composer-tabs a:hover { color: var(--canvas-ink); }
.canvas-bo-composer-tabs a[aria-current="page"] { background: var(--canvas-enterprise-accent-soft); border-color: color-mix(in srgb, var(--canvas-enterprise-accent) 44%, transparent); color: var(--canvas-enterprise-accent); }
.canvas-bo-composer-tabs a:focus-visible,
.canvas-bo-handoff-list a:focus-visible,
.canvas-bo-blueprint-list a:focus-visible,
.canvas-bo-enterprise-form > summary:focus-visible,
.canvas-bo-translation-actions summary:focus-visible { outline: 3px solid var(--canvas-enterprise-accent); outline-offset: 3px; }
.canvas-bo-enterprise-panel { background: linear-gradient(150deg, rgba(9, 34, 59, .84), rgba(4, 19, 35, .94)); border: 1px solid var(--canvas-line); border-radius: 14px; box-shadow: inset 3px 0 rgba(255, 115, 88, .34); display: grid; gap: 14px; overflow: hidden; padding: clamp(14px, 2vw, 22px); }
.canvas-bo-enterprise-panel__head { margin: 0; }
.canvas-bo-enterprise-panel__head h3 { font-size: clamp(1.2rem, 2vw, 1.6rem); }
.canvas-bo-enterprise-notice { align-items: flex-start; background: var(--canvas-enterprise-accent-soft); border: 1px solid color-mix(in srgb, var(--canvas-enterprise-accent) 30%, transparent); border-inline-start: 3px solid var(--canvas-enterprise-accent); border-radius: 11px; display: flex; gap: 10px; min-inline-size: 0; padding: 11px 12px; }
.canvas-bo-enterprise-notice > i { color: var(--canvas-enterprise-accent); margin-block-start: 2px; }
.canvas-bo-enterprise-notice > div { display: grid; gap: 3px; min-inline-size: 0; }
.canvas-bo-enterprise-notice strong { color: var(--canvas-ink); font-size: .72rem; }
.canvas-bo-enterprise-notice p { color: var(--canvas-muted); font-size: .66rem; line-height: 1.5; margin: 0; }
.canvas-bo-enterprise-notice--warning { background: var(--canvas-amber-soft); border-color: color-mix(in srgb, var(--canvas-amber) 32%, transparent); border-inline-start-color: var(--canvas-amber); }
.canvas-bo-enterprise-notice--warning > i { color: var(--canvas-amber); }
.canvas-bo-translation-selector { align-items: end; background: var(--canvas-enterprise-surface); border: 1px solid var(--canvas-line); border-radius: 13px; display: grid; gap: 10px; grid-template-columns: repeat(2, minmax(0, 1fr)) auto; padding: 12px; }
.canvas-bo-translation-selector .canvas-bo-button { min-height: 38px; }
.canvas-bo-translation-panes { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); min-inline-size: 0; }
.canvas-bo-translation-pane { background: var(--canvas-enterprise-surface); border: 1px solid var(--canvas-line); border-radius: 15px; display: grid; gap: 11px; min-inline-size: 0; padding: 13px; text-align: start; }
.canvas-bo-translation-pane > header { border-block-end: 1px solid var(--canvas-line); display: grid; gap: 3px; padding-block-end: 10px; }
.canvas-bo-translation-pane > header > span { color: var(--canvas-enterprise-accent); font-size: .61rem; font-weight: 820; letter-spacing: .09em; text-transform: uppercase; }
.canvas-bo-translation-pane h4 { color: var(--canvas-ink); font-size: .94rem; margin: 0; }
.canvas-bo-translation-pane > header small { color: var(--canvas-muted); font-size: .62rem; }
.canvas-bo-translation-evidence,
.canvas-bo-exact-evidence { display: grid; gap: 8px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; }
.canvas-bo-translation-evidence > div,
.canvas-bo-exact-evidence > div { background: rgba(2, 18, 27, .42); border: 1px solid var(--canvas-line); border-radius: 9px; display: grid; gap: 4px; min-inline-size: 0; padding: 9px; }
.canvas-bo-translation-evidence dt,
.canvas-bo-exact-evidence dt { color: var(--canvas-muted); font-size: .58rem; font-weight: 760; }
.canvas-bo-translation-evidence dd,
.canvas-bo-exact-evidence dd { color: var(--canvas-ink); display: grid; font-size: .66rem; gap: 3px; margin: 0; min-inline-size: 0; }
.canvas-bo :is(.canvas-bo-translation-evidence, .canvas-bo-exact-evidence, .canvas-bo-blueprint-patterns, .canvas-bo-rich-editor, .canvas-bo-blueprint-list, .canvas-bo-blueprint-detail > header) code { font-size: .61rem; overflow-wrap: anywhere; white-space: normal; word-break: break-word; }
.canvas-bo-translation-sections { display: grid; gap: 7px; list-style: none; margin: 0; padding: 0; }
.canvas-bo-translation-sections li { align-items: start; background: rgba(255, 255, 255, .025); border: 1px solid var(--canvas-line); border-radius: 9px; display: grid; gap: 8px; grid-template-columns: 24px minmax(0, 1fr) auto; padding: 8px; }
.canvas-bo-translation-sections li > span { color: var(--canvas-enterprise-accent); font-size: .62rem; font-weight: 850; }
.canvas-bo-translation-sections p { color: var(--canvas-ink); font-size: .66rem; line-height: 1.45; margin: 0; overflow-wrap: anywhere; }
.canvas-bo-translation-sections small { color: var(--canvas-muted); font-size: .56rem; }
.canvas-bo-translation-workspace { align-items: start; display: grid; gap: 12px; grid-template-columns: minmax(220px, .72fr) minmax(0, 1.28fr); }
.canvas-bo-handoff-list,
.canvas-bo-handoff-detail,
.canvas-bo-blueprint-list,
.canvas-bo-blueprint-detail { min-inline-size: 0; padding: 13px; }
.canvas-bo-handoff-list > ol,
.canvas-bo-blueprint-list > ol { display: grid; gap: 7px; list-style: none; margin: 10px 0 0; padding: 0; }
.canvas-bo-handoff-list li > a,
.canvas-bo-blueprint-list li > :is(a, article) { background: rgba(255, 255, 255, .025); border: 1px solid var(--canvas-line); border-radius: 10px; color: inherit; display: grid; gap: 8px; min-inline-size: 0; padding: 10px; text-decoration: none; }
.canvas-bo-handoff-list li > a:hover,
.canvas-bo-handoff-list li > a[aria-current="page"],
.canvas-bo-blueprint-list li > a:hover,
.canvas-bo-blueprint-list li > a[aria-current="page"] { background: var(--canvas-enterprise-accent-soft); border-color: color-mix(in srgb, var(--canvas-enterprise-accent) 38%, transparent); }
.canvas-bo-handoff-list a > span:first-child,
.canvas-bo-blueprint-list li > :is(a, article) > span:first-child { display: grid; gap: 3px; min-inline-size: 0; }
.canvas-bo-handoff-list strong,
.canvas-bo-blueprint-list strong { color: var(--canvas-ink); font-size: .7rem; }
.canvas-bo-handoff-list small,
.canvas-bo-handoff-list time,
.canvas-bo-blueprint-list small { color: var(--canvas-muted); font-size: .59rem; line-height: 1.45; }
.canvas-bo-handoff-list time { text-align: end; }
.canvas-bo-translation-actions { display: grid; gap: 7px; margin-block-start: 12px; }
.canvas-bo-translation-actions details,
.canvas-bo-enterprise-form { background: var(--canvas-enterprise-surface); border: 1px solid var(--canvas-line); border-radius: 12px; overflow: hidden; }
.canvas-bo-translation-actions summary,
.canvas-bo-enterprise-form > summary { color: var(--canvas-ink); cursor: pointer; font-size: .7rem; font-weight: 800; list-style-position: inside; padding: 10px 12px; }
.canvas-bo-translation-actions form,
.canvas-bo-enterprise-form > form,
.canvas-bo-enterprise-form > div { border-block-start: 1px solid var(--canvas-line); display: grid; gap: 10px; min-inline-size: 0; padding: 12px; }
.canvas-bo-enterprise-form > div > form { display: grid; gap: 10px; }
.canvas-bo-blueprint-layout { align-items: start; display: grid; gap: 12px; grid-template-columns: minmax(230px, .72fr) minmax(0, 1.28fr); }
.canvas-bo-blueprint-list li > article[aria-disabled="true"] { opacity: .76; }
.canvas-bo-blueprint-patterns { display: grid; gap: 9px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); list-style: none; margin: 12px 0; padding: 0; }
.canvas-bo-blueprint-patterns > li { background: linear-gradient(145deg, rgba(80, 161, 255, .055), rgba(255, 115, 88, .025)); border: 1px solid var(--canvas-line); border-radius: 9px; display: grid; gap: 9px; min-inline-size: 0; padding: 11px; }
.canvas-bo-blueprint-patterns > li > header { align-items: center; display: flex; gap: 8px; }
.canvas-bo-blueprint-patterns > li > header > span { background: var(--canvas-enterprise-accent-soft); border-radius: 999px; color: var(--canvas-enterprise-accent); display: grid; flex: 0 0 25px; font-size: .61rem; font-weight: 850; height: 25px; place-items: center; }
.canvas-bo-blueprint-patterns strong { color: var(--canvas-ink); font-size: .7rem; overflow-wrap: anywhere; }
.canvas-bo-blueprint-patterns dl { display: grid; gap: 7px; margin: 0; }
.canvas-bo-blueprint-patterns dl > div { display: grid; gap: 3px; min-inline-size: 0; }
.canvas-bo-blueprint-patterns dt { color: var(--canvas-muted); font-size: .56rem; }
.canvas-bo-blueprint-patterns dd { color: var(--canvas-ink); display: grid; font-size: .63rem; gap: 3px; margin: 0; min-inline-size: 0; }
.canvas-bo-rich-editor { background: var(--canvas-enterprise-surface); border: 1px solid var(--canvas-line); border-radius: 13px; display: grid; gap: 10px; margin-block: 12px; padding: 11px; }
.canvas-bo-rich-editor > header { align-items: start; border-block-end: 1px solid var(--canvas-line); display: flex; gap: 10px; justify-content: space-between; padding-block-end: 9px; }
.canvas-bo-rich-editor > header > div { display: grid; gap: 3px; min-inline-size: 0; }
.canvas-bo-rich-editor h4 { color: var(--canvas-ink); font-size: .82rem; margin: 0; }
.canvas-bo-rich-editor > header p { color: var(--canvas-muted); font-size: .61rem; line-height: 1.45; margin: 0; }
.canvas-bo-rich-editor__pin { align-items: start; background: var(--canvas-enterprise-accent-soft); border: 1px solid color-mix(in srgb, var(--canvas-enterprise-accent) 30%, transparent); border-radius: 10px; display: flex; gap: 9px; min-inline-size: 0; padding: 10px; }
.canvas-bo-rich-editor__pin > div { display: grid; gap: 4px; min-inline-size: 0; }
.canvas-bo-rich-editor__pin :is(strong, a) { color: var(--canvas-enterprise-accent); font-size: .65rem; }
.canvas-bo-rich-nodes { display: grid; gap: 8px; list-style: none; margin: 0; padding: 0; }
.canvas-bo-rich-nodes > li { background: rgba(255, 255, 255, .025); border: 1px solid var(--canvas-line); border-radius: 10px; display: grid; gap: 9px; min-inline-size: 0; padding: 9px; }
.canvas-bo-rich-nodes > li.is-root { border-inline-start: 3px solid var(--canvas-enterprise-accent); }
.canvas-bo-rich-nodes > li > header { align-items: start; display: flex; gap: 8px; justify-content: space-between; }
.canvas-bo-rich-nodes > li > header > span:first-child { display: grid; gap: 2px; min-inline-size: 0; }
.canvas-bo-rich-nodes > li > header strong { color: var(--canvas-ink); font-size: .68rem; }
.canvas-bo-rich-nodes > li > p { color: var(--canvas-muted); font-size: .61rem; margin: 0; }
.canvas-bo-rich-nodes > li > dl { display: grid; gap: 6px; margin: 0; }
.canvas-bo-rich-nodes > li > dl > div { display: grid; gap: 3px; }
.canvas-bo-rich-nodes dt { color: var(--canvas-muted); font-size: .56rem; }
.canvas-bo-rich-nodes dd { color: var(--canvas-ink); font-size: .64rem; margin: 0; overflow-wrap: anywhere; }
.canvas-bo-rich-node__actions { display: flex; flex-wrap: wrap; gap: 4px; justify-content: flex-end; }
.canvas-bo-rich-node__fields { display: grid; gap: 8px; grid-template-columns: repeat(2, minmax(0, 1fr)); min-inline-size: 0; }
.canvas-bo-rich-node__fields .canvas-bo-field--wide { grid-column: 1 / -1; }
.canvas-bo-rich-editor__add { align-items: end; border-block-start: 1px solid var(--canvas-line); display: grid; gap: 8px; grid-template-columns: minmax(0, 1fr) auto; padding-block-start: 10px; }
@container (max-width: 900px) {
    .canvas-bo-translation-workspace,
    .canvas-bo-blueprint-layout { grid-template-columns: 1fr; }
}
@container (max-width: 700px) {
    .canvas-bo-translation-selector,
    .canvas-bo-translation-panes { grid-template-columns: 1fr; }
    .canvas-bo-translation-selector .canvas-bo-button { width: 100%; }
    .canvas-bo-translation-evidence,
    .canvas-bo-exact-evidence,
    .canvas-bo-rich-node__fields { grid-template-columns: 1fr; }
    .canvas-bo-rich-node__fields .canvas-bo-field--wide { grid-column: auto; }
}
@container (max-width: 480px) {
    .canvas-bo-composer-tabs { border-radius: 11px; margin-inline: -3px; }
    .canvas-bo-enterprise-panel { border-radius: 14px; padding: 11px; }
    .canvas-bo-translation-sections li { grid-template-columns: 22px minmax(0, 1fr); }
    .canvas-bo-translation-sections li > small { grid-column: 2; }
    .canvas-bo-rich-editor > header,
    .canvas-bo-rich-nodes > li > header { display: grid; }
    .canvas-bo-rich-node__actions { justify-content: flex-start; }
    .canvas-bo-rich-editor__add { grid-template-columns: 1fr; }
    .canvas-bo-rich-editor__add .canvas-bo-button { width: 100%; }
}