.demo-intro{padding:60px 0 38px;display:grid;grid-template-columns:1.2fr .8fr;gap:18px 60px;align-items:end}
.demo-intro>.eyebrow{grid-column:1/-1}.demo-intro h1{font-size:clamp(45px,5vw,84px);max-width:none}.demo-intro>p:not(.eyebrow){max-width:43ch;color:var(--muted);font-size:18px}
.demo-intro .demo-disclosure{grid-column:1/-1;max-width:100ch!important;font-size:12px!important;margin-top:8px;line-height:1.8}
.demo-tabs{display:flex;flex-wrap:wrap;gap:0 35px;border-block:1px solid var(--line);margin-bottom:38px}
.demo-tabs button{display:flex;gap:12px;align-items:center;min-height:64px;padding:14px 0;background:none;border:0;border-bottom:2px solid transparent;color:#92a8c3;font:500 19px/1.3 Display,Body,sans-serif;cursor:pointer}
.demo-tabs button span{font:10px ui-monospace,monospace;color:#8caed9}.demo-tabs button[aria-selected=true]{color:#edf5ff;border-bottom-color:#abcfff}.demo-tabs button:hover{color:#edf5ff}
.demo-panel{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.35fr);gap:0 clamp(40px,6vw,100px);padding-bottom:38px;align-items:start;min-width:0}
.demo-narrative{padding-top:10px;min-width:0}.demo-narrative h2{font-size:clamp(30px,3vw,49px);max-width:19ch;margin:22px 0}.demo-narrative h2:focus{outline:none}.demo-description{font-size:17px;color:#c2d2e6;line-height:1.85;max-width:43ch}.demo-hint{font-size:13px;line-height:1.9;max-width:48ch;color:#92a9c6;margin-top:20px}
.demo-stepper{display:grid;gap:8px;margin-top:32px}.demo-stepper button{display:flex;align-items:center;gap:14px;text-align:left;min-height:44px;padding:8px 0;background:none;border:0;color:#8198b5;font:13px Body,system-ui,sans-serif;cursor:pointer}.demo-stepper span{display:grid;place-items:center;width:24px;height:24px;border:1px solid #526b8b;font:10px ui-monospace,monospace}.demo-stepper button[aria-current=step]{color:#e5edf8}.demo-stepper button[aria-current=step] span{background:#bed8fa;color:#101b29;border-color:#bed8fa}
.demo-evidence{min-width:0}.scenario-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-bottom:16px;border-bottom:1px solid var(--line);font-size:14px}.example-label{font:10px ui-monospace,monospace;color:#9ab2cf;white-space:nowrap}.scenario-figure{background:radial-gradient(ellipse at 70% 50%,#15263a77,transparent 70%);overflow:hidden}.scenario-svg{display:block;width:100%;height:auto;max-height:390px}.scenario-svg text{font:14px Body,system-ui,sans-serif;fill:#b9cbe3}.scenario-choice{padding:12px 0 22px}.scenario-choice[hidden]{display:none}.scenario-choice>p{font-size:13px;color:#b7cbe5;margin-bottom:12px}.scenario-choice>div{display:flex;gap:10px;flex-wrap:wrap}.scenario-choice button{min-height:44px;background:transparent;color:#afc3dd;border:1px solid #4a617e;padding:10px 15px;font:12px Body,system-ui,sans-serif;cursor:pointer}.scenario-choice button[aria-pressed=true]{color:#f0f6ff;border-color:#aacfff;background:#192a40}.scenario-choice button:hover{border-color:#c8dfff}
.scenario-reading{display:grid;grid-template-columns:.7fr 1.3fr;gap:25px;padding:22px 0;border-block:1px solid var(--line)}.scenario-reading>div{display:grid;align-content:start;gap:7px}.scenario-reading strong{font:400 clamp(28px,3vw,46px)/1.1 Display,Body,sans-serif;color:#e5f0ff;letter-spacing:-.04em}.scenario-reading span{font-size:11px;color:#9eb7d5}.scenario-reading p{font-size:13px;line-height:1.85;color:#b6c9e1;max-width:50ch}
.scenario-data{margin-top:10px;font-size:12px}.scenario-data summary{padding:12px 0;min-height:44px;color:#b9d4f4;cursor:pointer}.scenario-data table{border-collapse:collapse;width:100%;font-size:12px}.scenario-data caption{text-align:left;color:#91a9c8;padding:12px 0}.scenario-data th,.scenario-data td{text-align:left;padding:10px 8px;border-bottom:1px solid var(--line);vertical-align:top;overflow-wrap:anywhere}.scenario-data th{font-weight:500;color:#cadcf1}.scenario-data td{color:#a9bed8}
.demo-controls{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid var(--line);padding-top:25px;margin-top:30px}.demo-controls p{font-size:12px;color:#95abc6}.demo-previous{min-height:48px;display:flex;align-items:center;gap:14px;border:0;background:none;color:#bad3f0;font:13px Body,system-ui,sans-serif;cursor:pointer}.demo-previous:disabled{opacity:.4;cursor:default}.demo-next{font-family:Body,system-ui,sans-serif;cursor:pointer}
.demo-outro{display:flex;justify-content:space-between;align-items:center;gap:32px;padding:38px 0 24px;border-top:1px solid var(--line)}.demo-outro h2{font-size:clamp(29px,3vw,45px);max-width:26ch}.demo-outro p{font-size:14px;color:var(--muted);margin-top:14px;max-width:58ch}
.demo-fallback{border-top:1px solid var(--line);padding:30px 0;display:grid;gap:25px}.demo-fallback article{display:grid;gap:10px}.demo-fallback article p{font-size:15px;color:var(--muted)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.scenario-data summary:focus-visible{outline:2px solid #b7d7ff;outline-offset:4px}
@media(max-width:1100px){.demo-panel{grid-template-columns:.8fr 1.2fr;gap:0 32px}.demo-tabs{gap:0 25px}.demo-tabs button{font-size:17px}.demo-description{font-size:15px}.scenario-reading{grid-template-columns:1fr;gap:15px}.scenario-reading>div{display:flex;align-items:baseline;gap:15px}.scenario-reading span{max-width:22ch}}
@media(max-width:760px){.demo-intro{display:block;padding:38px 0 26px}.demo-intro h1{font-size:clamp(39px,10vw,62px);margin:16px 0 23px}.demo-intro>p:not(.eyebrow){font-size:15px}.demo-intro .demo-disclosure{font-size:11px!important;margin-top:20px}.demo-tabs{gap:0 23px;flex-wrap:nowrap;overflow-x:auto;margin-bottom:26px;scrollbar-width:thin}.demo-tabs button{font-size:17px;flex-shrink:0;min-height:55px;scroll-margin-inline:22px}.demo-tabs button span{display:none}.demo-panel{display:block;padding-bottom:26px}.demo-narrative{padding-top:0}.demo-narrative h2{font-size:32px;max-width:25ch;margin:15px 0}.demo-description{font-size:15px;max-width:none}.demo-hint{font-size:12px;margin-top:15px;max-width:none}.demo-stepper{display:flex;gap:22px;margin:23px 0 28px}.demo-stepper button{font-size:0;padding:0;min-width:44px}.demo-stepper span{width:30px;height:30px;font-size:12px}.scenario-heading{font-size:13px}.scenario-reading{padding:20px 0}.scenario-reading strong{font-size:38px}.scenario-reading p{font-size:13px}.scenario-choice button{flex:1 1 125px;font-size:12px;padding:10px}.demo-controls{display:grid;grid-template-columns:1fr 1fr;margin-top:24px;padding-top:18px;gap:10px}.demo-controls p{grid-column:1/-1;grid-row:1;font-size:11px}.demo-controls .action{justify-self:end;gap:12px;white-space:normal;font-size:12px;padding:12px;min-height:50px;text-align:left}.demo-previous{font-size:12px;gap:10px}.demo-outro{align-items:flex-start;flex-direction:column;padding-top:30px;gap:24px}.demo-outro h2{font-size:30px}.demo-outro p{font-size:13px}.scenario-data th:first-child{width:28%}}
@media(forced-colors:active){.demo-tabs button[aria-selected=true],.scenario-choice button[aria-pressed=true],.demo-stepper button[aria-current=step] span{outline:2px solid Highlight}.scenario-svg{forced-color-adjust:none}}
