.chroma-showcase{--cs-ink:#172438;--cs-muted:#64748b;--cs-border:#dfe6ee;--cs-surface:#fff;--cs-soft:#f5f8fb;--cs-accent:#235b88;--cs-radius:14px;font:inherit;color:var(--cs-ink);width:100%;box-sizing:border-box}.chroma-showcase *{box-sizing:border-box}.chroma-showcase button,.chroma-showcase select,.chroma-showcase input{font:inherit}.chroma-showcase button{cursor:pointer}.chroma-showcase button:focus-visible,.chroma-showcase a:focus-visible,.chroma-showcase select:focus-visible,.chroma-showcase input:focus-visible{outline:3px solid var(--cs-accent);outline-offset:3px}.cs-teaser{display:grid;grid-template-columns:1.25fr 1fr;gap:32px;padding:clamp(24px,4vw,54px);border:1px solid var(--cs-border);border-radius:var(--cs-radius);background:#fff;align-items:center}.cs-eyebrow{font-size:11px;font-weight:750;letter-spacing:.1em;color:var(--cs-accent);margin:0 0 12px}.cs-teaser h2{font-size:clamp(23px,2.7vw,39px);line-height:1.13;margin:0 0 17px;color:var(--cs-ink)}.cs-teaser-copy>p:not(.cs-eyebrow){font-size:16px;line-height:1.7;color:#46566b;margin:0 0 20px}.cs-teaser-actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.cs-launch{border:0;border-radius:9px;background:var(--cs-ink);color:#fff;padding:13px 20px;font-weight:700}.cs-launch span{margin-left:10px}.cs-helper{font-size:12px;color:var(--cs-muted)}.cs-teaser-art{background:var(--cs-soft);border:1px solid var(--cs-border);border-radius:14px;padding:16px;box-shadow:0 20px 35px rgba(31,55,83,.07);transform:rotate(-1deg)}.cs-art-toolbar{display:flex;align-items:center;gap:5px;border-bottom:1px solid var(--cs-border);padding-bottom:12px}.cs-art-toolbar i{width:8px;height:8px;border-radius:50%;background:#b7c8d8}.cs-art-toolbar span{font-weight:700;font-size:11px;margin-left:8px}.cs-art-stats{display:flex;gap:10px;margin:14px 0}.cs-art-stats b{flex:1;background:white;border:1px solid var(--cs-border);border-radius:8px;padding:13px;font-size:23px}.cs-art-stats small{display:block;font-size:10px;font-weight:500;color:var(--cs-muted);margin-bottom:5px}.cs-art-chart{height:92px;display:flex;align-items:end;gap:10px;padding:8px 12px 0;background:#fff;border-radius:8px;border:1px solid var(--cs-border)}.cs-art-chart span{flex:1;background:#a6bace;border-radius:4px 4px 0 0}.cs-art-chart span:nth-child(even){background:#426b90}.cs-art-line{display:flex;gap:9px;margin-top:12px}.cs-art-line span{height:8px;background:#dbe4ec;border-radius:8px;flex:1}.cs-art-line span:last-child{flex:2}.cs-teaser-compact .cs-teaser-art{display:none}.cs-teaser-compact{display:block}.cs-modal[hidden]{display:none!important}.cs-modal{position:fixed;inset:0;z-index:999999;background:rgba(12,22,37,.79);display:flex;align-items:center;justify-content:center;padding:18px}.cs-modal-open{overflow:hidden}.cs-dialog{background:#fff;width:min(1380px,100%);height:min(900px,94vh);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 26px 100px rgba(0,0,0,.35)}.cs-topbar{padding:16px 24px;display:flex;justify-content:space-between;align-items:center;gap:14px;border-bottom:1px solid var(--cs-border);background:#fff}.cs-brand{display:flex;gap:12px;align-items:center}.cs-brand-mark{background:#203a59;color:white;font-weight:800;width:40px;height:40px;display:grid;place-items:center;border-radius:10px}.cs-brand strong{font-size:15px;display:block;line-height:1.3}.cs-brand small{color:var(--cs-muted);font-size:11px;display:block}.cs-brand em{border:1px solid var(--cs-border);border-radius:4px;font-style:normal;letter-spacing:.08em;font-size:9px;margin-left:7px;padding:2px 5px}.cs-top-actions{display:flex;gap:8px;align-items:center}.cs-top-actions button{padding:9px 11px;border-radius:8px;border:1px solid var(--cs-border);color:var(--cs-ink);background:white;font-size:12px;font-weight:700}.cs-top-actions .cs-close{background:var(--cs-ink);color:white;border-color:var(--cs-ink)}.cs-app{display:grid;grid-template-columns:205px minmax(0,1fr);min-height:0;flex:1}.cs-sidebar{background:#f2f5f8;border-right:1px solid var(--cs-border);padding:19px 10px;display:flex;flex-direction:column;gap:5px}.cs-sidebar button{text-align:left;border:0;border-radius:8px;background:transparent;color:#40536b;padding:13px 14px;display:flex;gap:10px;align-items:center;font-weight:650}.cs-sidebar button.is-active{background:#fff;color:var(--cs-ink);box-shadow:0 1px 4px #0000000b}.cs-sidebar-foot{margin-top:auto;padding:16px 10px;font-size:11px;line-height:1.8;color:var(--cs-muted)}.cs-main{min-width:0;overflow:auto;padding:clamp(16px,3vw,38px);background:#f9fbfd}.cs-main-header{display:flex;justify-content:space-between;gap:12px;align-items:center}.cs-main-header h2{font-size:clamp(21px,2.2vw,29px);margin:0 0 6px;color:var(--cs-ink);line-height:1.2}.cs-view-subheading{margin:0;color:var(--cs-muted);font-size:14px}.cs-demo-label{white-space:nowrap;font-size:10px;color:var(--cs-muted);border:1px solid var(--cs-border);padding:6px 9px;border-radius:6px}.cs-story{border:1px solid #d7e4ed;background:#eff6fa;border-radius:10px;padding:13px 15px;margin:22px 0;color:#284963;font-size:13px;line-height:1.5}.cs-story.cs-tour-on{outline:2px solid #a4b7c8}.cs-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:14px}.cs-metric{border:1px solid var(--cs-border);border-radius:11px;background:#fff;padding:17px;min-width:0}.cs-metric>span{font-size:12px;color:var(--cs-muted);display:block}.cs-metric strong{font-size:clamp(20px,2vw,28px);display:block;margin:8px 0;white-space:nowrap}.cs-metric small{font-size:11px;color:var(--cs-muted)}.cs-columns{display:grid;grid-template-columns:1.35fr 1fr;gap:14px}.cs-panel{border:1px solid var(--cs-border);border-radius:11px;background:#fff;padding:20px;min-width:0;margin-bottom:14px}.cs-panel h3{margin:0 0 18px;font-size:16px;color:var(--cs-ink)}.cs-panel p{font-size:13px;line-height:1.7;color:#43536a}.cs-panel-note{font-size:11px!important;color:var(--cs-muted)!important;margin:12px 0 0}.cs-flow{display:flex;gap:7px;align-items:center;margin:15px 0 18px}.cs-flow div{flex:1;min-width:0;background:var(--cs-soft);border:1px solid var(--cs-border);border-radius:8px;padding:12px 8px}.cs-flow div b{display:block;font-size:11px;color:var(--cs-accent);margin-bottom:9px}.cs-flow div strong{display:block;font-size:12px}.cs-flow div small{font-size:10px;line-height:1.4;color:var(--cs-muted);display:block;margin-top:5px}.cs-flow i{font-style:normal;color:var(--cs-muted)}.cs-text-button{border:0;background:transparent;color:var(--cs-accent);font-size:13px;font-weight:750;padding:4px 0}.cs-bars{height:160px;display:flex;align-items:end;gap:9px;border-bottom:1px solid var(--cs-border);padding:10px 0 0}.cs-bars span{flex:1;background:#d2dfeb;border-radius:4px 4px 0 0}.cs-bars span:nth-child(3n){background:#6e91af}.cs-activity{display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--cs-border);padding:10px 0;font-size:13px}.cs-activity:last-child{border:0}.cs-activity>span{color:var(--cs-accent)}.cs-activity small{margin-left:auto;color:var(--cs-muted);white-space:nowrap}.cs-lead-tools{display:flex;align-items:end;justify-content:space-between;gap:12px;margin-bottom:12px}.cs-lead-tools label{font-size:12px;font-weight:700}.cs-lead-tools input{display:block;margin-top:5px;padding:9px 11px;border:1px solid var(--cs-border);border-radius:7px;width:240px;max-width:100%}.cs-lead-tools>span{color:var(--cs-muted);font-size:12px}.cs-table-scroll{overflow-x:auto}.cs-lead-table{width:100%;border-collapse:collapse;font-size:13px;min-width:620px}.cs-lead-table th{text-align:left;padding:12px 10px;background:var(--cs-soft);color:var(--cs-muted);font-weight:700;font-size:11px}.cs-lead-table td{padding:14px 10px;border-bottom:1px solid var(--cs-border)}.cs-lead-table td strong{display:block}.cs-lead-table td small{display:block;font-size:11px;color:var(--cs-muted);margin-top:4px}.cs-lead-table select{max-width:150px;width:100%;border:1px solid var(--cs-border);border-radius:7px;padding:7px;background:#fff;font-size:12px}.cs-lead-table tr[hidden]{display:none}.cs-tasks{display:flex;flex-direction:column;gap:9px}.cs-task{display:flex;align-items:center;gap:13px;border:1px solid var(--cs-border);padding:13px;border-radius:8px}.cs-task-icon{display:grid;place-items:center;width:30px;height:30px;background:var(--cs-soft);border-radius:7px}.cs-task>span:nth-child(2){flex:1}.cs-task strong{display:block;font-size:13px}.cs-task small{display:block;color:var(--cs-muted);font-size:11px;margin-top:4px}.cs-task em{font-style:normal;font-size:11px;color:var(--cs-muted);background:var(--cs-soft);border-radius:5px;padding:7px}.cs-breakdown>div{display:grid;grid-template-columns:120px 20px 1fr;gap:10px;align-items:center;margin:12px 0;font-size:12px}.cs-breakdown i{background:var(--cs-soft);height:9px;border-radius:8px;overflow:hidden}.cs-breakdown i b{height:100%;background:var(--cs-accent);display:block;border-radius:8px}.cs-footer{border-top:1px solid var(--cs-border);margin-top:16px;padding-top:14px;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:11px;color:var(--cs-muted)}.cs-cta{background:var(--cs-ink);color:#fff!important;text-decoration:none;padding:9px 14px;border-radius:6px;font-weight:700;white-space:nowrap}.cs-cta[hidden]{display:none}@media(max-width:900px){.cs-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.cs-columns{grid-template-columns:1fr}.cs-app{grid-template-columns:140px minmax(0,1fr)}.cs-sidebar button{font-size:12px;padding:11px 8px}.cs-flow{flex-wrap:wrap}.cs-flow div{flex-basis:39%}.cs-flow i:nth-of-type(2){display:none}}@media(max-width:640px){.cs-teaser{grid-template-columns:1fr}.cs-modal{padding:0}.cs-dialog{border-radius:0;height:100dvh}.cs-topbar{padding:10px 12px}.cs-top-actions{gap:5px}.cs-top-actions button{font-size:11px;padding:7px}.cs-top-actions .cs-reset{display:none}.cs-top-actions .cs-close span{display:none}.cs-brand-mark{width:30px;height:30px}.cs-brand strong{font-size:12px}.cs-brand small{font-size:9px}.cs-app{display:flex;flex-direction:column}.cs-sidebar{display:flex;flex-direction:row;border-bottom:1px solid var(--cs-border);border-right:0;padding:7px;gap:2px}.cs-sidebar button{flex:1;text-align:center;display:block;font-size:11px;padding:9px 3px}.cs-sidebar-foot{display:none}.cs-main{padding:15px}.cs-main-header{align-items:flex-start}.cs-demo-label{display:none}.cs-metrics{gap:8px}.cs-metric{padding:12px}.cs-metric strong{font-size:20px}.cs-metric small{font-size:10px}.cs-flow div{flex-basis:38%}.cs-footer{align-items:flex-start;flex-direction:column}}

/* v0.2.1: Portal overlay isolation from page-builder containers. */
body > .cs-modal {
  --cs-ink:#172438; --cs-muted:#64748b; --cs-border:#dfe6ee;
  --cs-surface:#fff; --cs-soft:#f5f8fb; --cs-accent:#235b88;
  --cs-radius:14px; box-sizing:border-box; font-family:inherit; color:var(--cs-ink);
  isolation:isolate; max-width:none!important; max-height:none!important;
  margin:0!important; border:0!important; transform:none!important;
  width:100vw!important; height:100dvh!important;
}
body > .cs-modal *, body > .cs-modal *::before, body > .cs-modal *::after {box-sizing:border-box}
body > .cs-modal .cs-dialog {max-width:min(1380px,100%); margin:auto; position:relative; transform:none}
body > .cs-modal .cs-app {min-height:0}
body > .cs-modal button, body > .cs-modal input, body > .cs-modal select {font:inherit}
body > .cs-modal button {cursor:pointer}
body.cs-modal-open {overflow:hidden!important}
@media(max-width:640px){body > .cs-modal .cs-dialog {max-width:100%;height:100dvh;border-radius:0}}

/* All demonstrations share the same neutral application shell. */
body > .cs-modal .cs-demo-rows{display:flex;flex-direction:column;gap:8px}
body > .cs-modal .cs-demo-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px;border:1px solid #e0e7ee;border-radius:9px;background:#fff;flex-wrap:wrap}
body > .cs-modal .cs-demo-row>div{flex:1;min-width:150px}body > .cs-modal .cs-demo-row strong{display:block;font-size:13px}body > .cs-modal .cs-demo-row small{display:block;color:#67768a;margin-top:5px;font-size:12px}body > .cs-modal .cs-demo-row>span{font-size:12px;color:#53647a}
body > .cs-modal .cs-demo-action{padding:9px 13px!important;border:1px solid #ced9e5!important;border-radius:7px!important;background:#f4f8fc!important;color:#223b57!important;font-size:12px!important;font-weight:700!important;cursor:pointer}
body > .cs-modal .cs-demo-action:hover{background:#e6eef6!important}
body > .cs-modal .cs-demo-form{display:grid;gap:15px;max-width:760px}body > .cs-modal .cs-demo-form label,body > .cs-modal .cs-demo-record label{font-size:12px;font-weight:700;display:flex;gap:8px;flex-direction:column}
body > .cs-modal .cs-demo-form select,body > .cs-modal .cs-demo-form input,body > .cs-modal .cs-demo-form textarea,body > .cs-modal .cs-demo-record select{width:100%;padding:11px;border:1px solid #ced9e5;border-radius:7px;background:#fff;color:#172438;font:inherit}
body > .cs-modal .cs-demo-record{display:grid;grid-template-columns:minmax(160px,2fr) 1fr 1fr;gap:14px;align-items:center;border-bottom:1px solid #e2e9f1;padding:15px 0}
body > .cs-modal .cs-demo-record>strong{font-size:13px}body > .cs-modal .cs-demo-record>small{display:block;font-size:11px;color:#64748b}
body > .cs-modal .cs-demo-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}body > .cs-modal .cs-demo-choices h4{grid-column:1/-1}
body > .cs-modal .cs-demo-choices button{text-align:left!important;padding:20px!important}
body > .cs-modal .cs-demo-flow{display:flex;gap:10px;align-items:center;flex-wrap:wrap;color:#789}body > .cs-modal .cs-demo-flow span{background:#eef3f8;border:1px solid #dde7ee;padding:17px 14px;border-radius:9px;color:#243d56;font-size:13px;font-weight:700}
body > .cs-modal .cs-demo-feature{padding:24px;background:#f2f7fa;border-radius:12px}body > .cs-modal .cs-demo-success{color:#16633c!important;font-weight:700}
@media(max-width:680px){body > .cs-modal .cs-demo-record{grid-template-columns:1fr}body > .cs-modal .cs-demo-choices{grid-template-columns:1fr}}