.demo-page{padding:48px 0 70px}.demo-page h1{font-size:clamp(36px,5vw,64px);line-height:1.05;margin:14px 0 18px}.demo-intro{max-width:720px;color:#c9c5d0;font-size:18px;line-height:1.6}.demo-layout{display:grid;grid-template-columns:minmax(260px,.9fr) minmax(0,1.2fr);align-items:center;gap:36px;margin-top:36px}.demo-core{position:relative;text-align:center;background:radial-gradient(circle,#0c425055,transparent 68%);padding:20px}.demo-core canvas{display:block;width:min(100%,440px);height:auto;aspect-ratio:1;margin:auto;filter:drop-shadow(0 0 28px #1ee8ff77)}.core-label{font-size:14px;color:#68dcff;letter-spacing:.15em}.demo-controls{display:flex;flex-wrap:wrap;gap:10px;margin:24px 0}.demo-controls button{font:inherit;font-size:14px;min-height:44px;padding:12px 16px;background:#101321;border:1px solid #ffffff45;color:#fff;cursor:pointer}.demo-controls button[aria-pressed=true]{border-color:#68dcff;background:#163041}.demo-controls button:focus-visible,.demo-page a:focus-visible{outline:2px solid #68dcff;outline-offset:4px}.demo-summary{padding:28px;background:linear-gradient(135deg,#102532,#120e22);border:1px solid #68dcff44}.demo-summary h2{font-size:30px;line-height:1.15;letter-spacing:-.02em}.demo-summary p{font-size:16px;line-height:1.65;color:#c9c5d0}.demo-note{font-size:14px;color:#aaa7b3;line-height:1.6}.demo-items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:34px 0}.demo-item{border:1px solid #ffffff28;background:#0b111b;padding:22px}.demo-item summary{cursor:pointer;min-height:44px;list-style:none;font-size:17px;font-weight:600}.demo-item summary::-webkit-details-marker{display:none}.demo-item p{color:#aaa7b3;line-height:1.6}.demo-item strong{display:block;font-size:34px;color:#68dcff;margin-bottom:10px}.demo-item summary:after{content:'View details';display:block;font-size:14px;font-weight:400;color:#68dcff;margin-top:12px}.demo-item[open] summary:after{content:'Hide details'}.demo-footer{border-top:1px solid #ffffff28;padding-top:28px}.demo-status{min-height:24px;font-size:14px;color:#aaa7b3}.demo-audio{font:inherit;cursor:pointer}.demo-audio[aria-pressed=true]{background:#cbb7ff;color:#05050a}@media(max-width:800px){.demo-page{padding:32px 0 50px}.demo-layout,.demo-items{grid-template-columns:1fr;gap:18px}.demo-core{padding:0}.demo-core canvas{max-width:300px}.demo-summary{padding:22px}}