.demo-page{--display:Space,Arial,sans-serif;--mono:Mono,monospace;--white:#edf6fc}.demo-hero,.demo-stage{--muted:#b4c6d3;--line:#7494ab40;color:#edf6fc}.demo-hero{background:radial-gradient(ellipse at 80% 45%,#273e51,transparent 60%),#121d28}.demo-hero a:focus-visible,.demo-stage a:focus-visible{outline-color:#bce4ff}
.demo-hero{padding-top:148px;padding-bottom:52px}.demo-hero .breadcrumbs{margin-bottom:32px}.demo-hero-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:7vw;align-items:end}.demo-hero h1{font-size:clamp(3rem,6.5vw,6.5rem);font-weight:400;line-height:1.02;letter-spacing:-.055em;margin:0}.demo-hero-grid>div{max-width:440px}.demo-hero-grid p{color:var(--muted);line-height:1.7}.demo-hero-grid .demo-hero-lead{font-family:var(--display);font-size:clamp(1.3rem,2vw,1.75rem);line-height:1.35;color:var(--white);margin:0 0 18px}.demo-hero-actions{display:flex;gap:24px;flex-wrap:wrap;margin-top:24px}.demo-stage{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,460px);gap:clamp(40px,8vw,120px);align-items:start;padding-top:52px;padding-bottom:52px;background:#101820;border-top:1px solid var(--line)}.demo-context{max-width:440px}.demo-context h2{font-family:var(--display);font-weight:400;font-size:clamp(2rem,3.5vw,3.2rem);line-height:1.12;letter-spacing:-.045em;margin:0 0 20px}.demo-context>p{color:var(--muted);font-size:15px;line-height:1.75}.demo-guide{list-style:none;padding:0;margin:34px 0}.demo-guide li{display:flex;gap:18px;padding:16px 0;border-top:1px solid var(--line)}.demo-guide li>span{font:11px var(--mono);color:var(--blue);padding-top:3px}.demo-guide h3{font-size:16px;font-weight:500;margin:0 0 4px}.demo-guide p{font-size:13px;line-height:1.6;color:var(--muted);margin:0}.demo-boundary{border-left:2px solid var(--blue);padding:0 0 0 18px;margin:32px 0}.demo-boundary h3{font-size:15px;font-weight:500;margin:0 0 10px}.demo-boundary p{font-size:13px;color:var(--muted);line-height:1.7;margin:0}.demo-context .demo-local-note{font-size:12px}.companion-embed{width:100%;max-width:460px;min-width:0;margin-inline:auto}.companion-caption{display:flex;justify-content:space-between;gap:12px;margin-bottom:12px;font:9px var(--mono);letter-spacing:.1em;color:var(--muted)}.companion-frame{--app-scale:1;position:relative;width:100%;height:calc(932px * var(--app-scale));overflow:hidden;background:transparent}.companion-frame iframe{position:absolute;top:0;left:0;width:460px;height:932px;border:0;display:block;transform:scale(var(--app-scale));transform-origin:top left;background:transparent}.companion-caption-note{text-align:center;font-size:11px;line-height:1.6;color:var(--muted);margin:14px 0 0}.demo-return{border-top:1px solid var(--line);padding-top:46px;padding-bottom:52px;display:flex;justify-content:space-between;gap:36px;align-items:center}.demo-return p{max-width:680px;color:var(--muted);font-size:15px;line-height:1.7}.demo-return .text-link{flex-shrink:0}@media(max-width:1000px){.demo-stage{grid-template-columns:1fr;gap:40px}.demo-context{max-width:680px}.demo-guide{display:grid;grid-template-columns:1fr 1fr;gap:0 32px}.demo-hero-grid{grid-template-columns:1fr;gap:30px}.demo-hero-grid>div{max-width:620px}.demo-return{display:block}.demo-return .text-link{margin-top:18px}}@media(max-width:520px){.demo-hero{padding-top:124px;padding-bottom:48px}.demo-hero .breadcrumbs{margin-bottom:26px}.demo-hero h1{font-size:clamp(2.6rem,10.5vw,3.8rem)}.demo-stage{padding-top:42px;padding-bottom:42px}.demo-guide{display:block}.companion-frame{--app-scale:.72}}@media(max-width:380px){.companion-frame{--app-scale:.6}}
.data-page .companion-embed{scroll-margin-top:24px}
.anchor-alias{display:block;height:0;scroll-margin-top:24px}
@media(max-width:1000px){.data-page .companion-embed{grid-row:1}}
