.xp{font-size:var(--type-body-l);line-height:1.6}:root{ --face-head:"Red Hat Display",Arial,sans-serif;--face-body:"Red Hat Text",Arial,sans-serif;--face-mono:"Red Hat Text",Arial,sans-serif}.xp .intro{max-width:1240px;margin:0 auto;padding:28px 20px 18px}.xp .intro h1{font-family:var(--face-head);font-weight:800;font-size:var(--type-display-m);line-height:1.12;color:var(--navy);margin:0 0 10px;max-width:24ch}.xp .intro p{margin:0;max-width:62ch;color:var(--muted)}.xp .stage{max-width:1240px;margin:0 auto 8px;padding:0 20px}.xp .stage[hidden]{display:none}.xp .view{position:relative;width:100%;aspect-ratio:16/9;max-height:64vh;min-height:300px;border:1px solid var(--rule);border-radius:10px 10px 0 0;background:var(--field);overflow:hidden}.xp .view canvas{position:absolute;inset:0;width:100%;height:100%;display:block}.xp .panel{position:absolute;right:14px;top:14px;width:min(270px,29%);max-height:calc(100% - 28px);overflow:hidden;background:var(--panel);border-left:4px solid var(--navy);padding:8px 14px;font-size:var(--type-body-s)}.xp .panel div{padding:6px 0}.xp .panel div+div{border-top:1px solid var(--rule)}.xp .panel b{display:block;font-family:var(--face-mono);font-weight:600;font-size:var(--type-headline-s);line-height:1.2;color:var(--ink);font-variant-numeric:tabular-nums}.xp .panel b.long{font-size:var(--type-body-m);line-height:1.35}.xp .panel b.neg{color:var(--red-text)}.xp .panel small{display:block;color:var(--muted);font-size:var(--type-body-s);line-height:1.3}.xp .panel small.how{font-size:var(--type-body-s);color:var(--leader)}.xp .capband{background:var(--navy);color:var(--on-navy);padding:14px 20px 16px;min-height:96px}.xp .eyebrow{margin:0 0 4px;font-family:var(--face-head);font-weight:700;font-size:var(--type-body-s);letter-spacing:.12em;text-transform:uppercase;opacity:.82}.xp .caption{margin:0;font-family:var(--face-head);font-weight:800;font-size:var(--type-headline-l);line-height:1.25;text-wrap:balance}.xp .bar{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--rule);border-top:0;border-radius:0 0 10px 10px;background:var(--panel)}.xp .dots{display:flex;gap:6px;flex:1;justify-content:center;flex-wrap:wrap}.xp .dots button{width:30px;height:30px;border:0;background:transparent;padding:0;cursor:pointer;display:grid;place-items:center}.xp .dots button::before{content:"";width:11px;height:11px;border-radius:50%;border:2px solid var(--navy);background:transparent}.xp .dots button[aria-current=true]::before{background:var(--red);border-color:var(--red)}.xp .ctl{font:600 var(--type-body-m) var(--face-body);border:1.5px solid var(--navy);background:var(--field);color:var(--navy);border-radius:6px;padding:6px 14px;cursor:pointer;min-height:36px}.xp .ctl[aria-pressed=true]{background:var(--navy);color:var(--on-navy)}.xp .count{font-family:var(--face-mono);font-size:var(--type-body-s);color:var(--muted);min-width:44px;text-align:right}.xp .xp-doc{max-width:760px;margin:0 auto;padding:12px 20px 40px}.xp .xp-doc h2{font-family:var(--face-head);font-weight:800;font-size:var(--type-headline-s);line-height:1.25;color:var(--navy);margin:0 0 8px}.xp .xp-doc section{margin-top:34px}.xp .xp-doc .step-no{font-family:var(--face-mono);font-weight:500;font-size:var(--type-body-s);color:var(--muted);margin:0 0 2px}.xp .xp-doc dl{display:grid;grid-template-columns:max-content 1fr;gap:4px 18px;margin:12px 0 0;padding:10px 14px;background:var(--panel);border-left:4px solid var(--rule);font-size:var(--type-body-m)}.xp .xp-doc dt{color:var(--muted)}.xp .xp-doc dd{margin:0;font-family:var(--face-mono);font-weight:600}.xp .xp-doc .sources{margin-top:40px;font-size:var(--type-body-m)}.xp .xp-doc .sources h2{font-size:var(--type-title-l)}.xp .xp-doc .sources li{margin:4px 0}@media (max-width:759px){.xp .view{aspect-ratio:auto;max-height:none;min-height:0;overflow:visible}.xp .view canvas{position:relative;inset:auto;width:100%;aspect-ratio:4/5;height:auto}.xp .panel{position:static;width:auto;max-height:none;display:grid;grid-template-columns:1fr 1fr;gap:0 14px;border-left:0;border-top:1px solid var(--rule)}.xp .panel div+div{border-top:0}.xp .panel div{border-bottom:1px solid var(--rule)}.xp .capband{min-height:110px}.xp .bar{gap:6px;padding:8px;flex-wrap:wrap}.xp .dots{gap:0;flex-basis:100%;order:-1}.xp #prev{margin-right:auto}.xp .ctl{padding:6px 10px}.xp .count{display:none}}
.xp .xp-crumbs{margin:0 0 18px}.xp .xp-guide{margin:28px 0 0;font:700 var(--type-body-l)/1.4 var(--display)}
.xp .intro,.xp .stage{max-width:var(--page);padding-left:var(--gutter);padding-right:var(--gutter)}.xp .intro{max-width:calc(760px + 2*var(--gutter))}.xp .intro p{max-width:none}.xp .xp-doc{margin-left:auto;margin-right:auto;padding-left:var(--gutter);padding-right:var(--gutter);max-width:calc(760px + 2*var(--gutter))}
