/* Lesson illustrations use CloseTag purple/plum/lavender only. UI feedback keeps its own semantic palette. */
.ct-concept-v09{--cv-paper:var(--sb-screen);--cv-ink:var(--sb-ink);--cv-line:#9875c3;--cv-soft:var(--sb-panel);--cv-depth:var(--sb-line);--cv-accent:var(--sb-accent);--cv-muted:var(--sb-muted);--cv-signal:var(--sb-strong);--cv-caution:var(--sb-accent);position:relative;width:100%;max-width:650px;margin:0 auto;isolation:isolate;color:var(--cv-ink)}
html[data-ct-lesson-theme=dark] .ct-concept-v09,[data-theme=dark] .ct-concept-v09{--cv-line:#a58acb}
.ct-concept-v09:before{content:'';position:absolute;inset:18% 7% 0;border-radius:50%;background:radial-gradient(ellipse,var(--cv-depth),transparent 72%);z-index:-1;pointer-events:none}
.ct-concept-v09 svg{display:block;width:100%;height:auto;overflow:visible;direction:ltr;unicode-bidi:isolate}
.ct-concept-v09 .ct-cv-device{filter:drop-shadow(0 4px 5px var(--ct-scene-shadow))}
.ct-concept-v09 .ct-fact-art{display:block;width:min(180px,100%);height:auto;margin:0 auto 12px;overflow:visible;flex:none}
.ct-fact-standalone{width:min(180px,100%);margin:0 auto!important}
.ct-fact-standalone:before{display:none}
.ct-prose-details{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.ct-prose-detail{display:flex;flex-direction:column;justify-content:center;padding:20px;border:1px solid var(--sb-line);border-radius:18px;background:var(--sb-screen);min-width:0}
.ct-prose-detail:last-child:nth-child(odd){grid-column:1/-1}
.ct-prose-detail p{font:650 16px/1.95 Cairo,sans-serif;margin:0!important;color:var(--sb-ink)}
@container(max-width:550px){.ct-prose-details{grid-template-columns:1fr}.ct-prose-detail{padding:16px}}
.ct-lesson-art .ct-cv-facts{display:flex;flex-wrap:wrap;gap:8px 18px;justify-content:center;margin:4px 0 0;padding-top:13px;border-top:1px solid var(--sb-line);font:650 14px/1.9 Cairo,sans-serif;color:var(--sb-muted);text-align:center;direction:rtl}
.ct-cv-facts span{max-width:100%;overflow-wrap:anywhere}
/* A standalone card uses all 12 columns, including before a full-width note sequence. */
.ct-scene-cards>.ct-scene-card:last-child:nth-child(odd),
.ct-scene-cards>.ct-scene-card:nth-child(odd):has(+.ct-scene-note-sequence),
.ct-scene-note-sequence>.ct-scene-card:last-child:nth-child(odd){grid-column:1/-1}
.ct-concept-v09 text{font-family:ui-monospace,Consolas,monospace;font-weight:750;fill:var(--cv-ink)}
.ct-concept-v09 text[lang=ar]{font-family:Cairo,sans-serif;font-weight:700;letter-spacing:normal;word-spacing:normal;direction:rtl;unicode-bidi:isolate;font-variant:normal;font-feature-settings:normal;font-kerning:normal;font-synthesis:none}
.ct-concept-v09 text.ct-cv-on-accent{fill:var(--cv-paper)}
.ct-concept-v09 .ct-cv-byte{font-size:27px;letter-spacing:-1px}.ct-concept-v09 .ct-cv-label{font-size:28px;letter-spacing:.5px}
.ct-concept-v09 .ct-cv-kicker{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 13px;color:var(--sb-muted);font:650 14px/1.8 Cairo,sans-serif;text-align:start;direction:rtl}
.ct-cv-kicker i{height:1px;flex:1;background:var(--sb-line);min-width:10px}.ct-cv-kicker span{max-width:47%}
.ct-scene-card--concept{gap:20px;justify-content:center;background:linear-gradient(135deg,var(--ct-scene-paper),var(--sb-screen));overflow:hidden}
.ct-scene-card--concept.ct-scene-card--row{display:flex;flex-direction:column;direction:rtl;gap:22px;padding:28px 32px}
.ct-scene-card--concept.ct-scene-card--row>.ct-scene-card-copy{width:100%;border-top:1px solid var(--sb-line);padding-top:20px}
.ct-scene-card--concept.ct-scene-card--row>.ct-concept-v09{max-width:600px}
.ct-scene-card--concept .ct-scene-card-top h4{font-size:20px}.ct-scene-card--concept .ct-scene-card-copy{min-width:0}
@container(max-width:560px){.ct-scene-card--concept.ct-scene-card--row{padding:22px 20px}.ct-scene-card--concept .ct-concept-v09{width:100%;max-width:470px}.ct-concept-v09 .ct-cv-kicker{font-size:14px}.ct-concept-v09 .ct-cv-byte{font-size:29px}.ct-concept-v09 .ct-cv-label{font-size:31px}}
@container(max-width:350px){.ct-scene-card--concept{padding:18px 12px}.ct-scene-card--concept.ct-scene-card--row{padding:18px 12px}.ct-concept-v09 .ct-cv-kicker{gap:7px}.ct-concept-v09 .ct-cv-byte{font-size:32px}.ct-concept-v09 .ct-cv-label{font-size:34px}.ct-scene-card--concept [data-tcp-prose]{font-size:16px;line-height:1.95}}
@media(prefers-reduced-motion:reduce){.ct-concept-v09 *{animation:none!important;transition:none!important}}
/* Preserve the drawing area instead of stacking three mobile gutters. */
@media(max-width:560px){
 html body.ct-lesson-page.ct-ip-v6-preview .ct-topic-collapsible .ct-topic-disclosure-content>.ct-native-tcp:has(.ct-concept-v09){padding-inline:0!important}
 .ct-native-tcp .tcp-scene-board:has(.ct-concept-v09){padding-inline:8px}
 .ct-native-tcp .ct-scene-card--concept,.ct-native-tcp .ct-scene-card--concept.ct-scene-card--row{padding-inline:8px}
}

/* Connected process steps: a reserved connector lane, never a glyph over card copy. */
.ct-linked-steps{--ct-step-gap:56px;--ct-step-1:#56357e;--ct-step-2:#7850b3;--ct-step-3:#684191;display:grid;gap:var(--ct-step-gap);list-style:none!important;padding:0!important;margin:0!important}
html[data-ct-lesson-theme=dark] .ct-linked-steps,[data-theme=dark] .ct-linked-steps{--ct-step-1:#d3b1ff;--ct-step-2:#c49bf6;--ct-step-3:#bca1df}
.ct-linked-step{--ct-step-color:var(--ct-step-1);position:relative;min-width:0;box-sizing:border-box}
.ct-linked-step:nth-child(3n+2){--ct-step-color:var(--ct-step-2)}
.ct-linked-step:nth-child(3n){--ct-step-color:var(--ct-step-3)}
.ct-linked-step>.ct-step-link{display:block;position:absolute;inset-inline-end:calc(-1 * var(--ct-step-gap));top:calc(50% - 28px);width:56px;height:56px;padding:0;margin:0;border:0;background:none;box-shadow:none;color:var(--ct-step-color);pointer-events:none;z-index:1;font-style:normal}
.ct-linked-step>.ct-step-link>svg{position:absolute;left:0;top:16px;width:56px!important;height:24px!important;max-width:none!important;overflow:visible;transform-origin:center}
.ct-linked-steps[dir=rtl]>.ct-linked-step>.ct-step-link>svg{transform:rotate(180deg)}
html body.ct-lesson-page .ct-lm-stage .ct-step-art,.ct-step-art{display:block;width:140px!important;height:112px!important;max-width:100%!important;margin:0 auto!important;overflow:visible;flex:none;--cv-paper:var(--sb-screen);--cv-line:var(--ct-step-color);--cv-accent:var(--ct-step-color);--cv-soft:var(--sb-panel);--cv-signal:var(--sb-strong)}
.ct-linked-step>.ct-step-number{display:grid;place-items:center;justify-self:center;align-self:center;width:36px;height:36px;border:0;border-radius:12px;background:var(--ct-step-color);color:var(--sb-screen);font:800 16px/1 Cairo,sans-serif}
.ct-scene-steps.ct-handshake-steps{gap:56px;grid-template-columns:repeat(3,minmax(0,1fr))}
.ct-scene-steps.ct-handshake-steps>.ct-linked-step{align-content:center;padding:20px;gap:14px;border-top:4px solid var(--ct-step-color);background:linear-gradient(150deg,var(--sb-screen),var(--sb-panel));color:var(--sb-ink)}
.ct-scene-steps.ct-handshake-steps>.ct-linked-step:after{display:none}
.ct-scene-steps.ct-handshake-steps b{font-size:18px}
.ct-scene-steps.ct-handshake-steps small{font:650 14px/1.8 Cairo,sans-serif;color:var(--sb-muted);white-space:normal}
.ct-scene-steps.ct-handshake-steps li[aria-current]{outline:0;outline-offset:0;box-shadow:inset 0 0 0 2px var(--sb-accent)}
.ct-scene-cards--steps{grid-template-columns:minmax(0,1fr)!important;gap:56px}
.ct-scene-cards--steps>.ct-scene-card:not(:last-child):after{top:calc(100% + 11px);bottom:auto;right:calc(50% - 6px);width:12px;height:34px;background:var(--sb-accent);clip-path:polygon(42% 0,58% 0,58% 78%,100% 65%,100% 77%,50% 100%,0 77%,0 65%,42% 78%)}
@container (max-width:760px){
 .ct-scene-steps.ct-handshake-steps{grid-template-columns:1fr}
 .ct-scene-steps.ct-handshake-steps>.ct-linked-step{padding:16px}
 .ct-handshake-steps>.ct-linked-step>.ct-step-link{top:100%;inset-inline-end:calc(50% - 28px)}
 .ct-handshake-steps>.ct-linked-step>.ct-step-link>svg{transform:rotate(90deg)}
}