.round-demo-open{position:absolute;top:12px;right:20px;z-index:22;padding:12px 20px;border:1px solid #47ddd8;border-radius:12px;background:#251735;color:white;font:inherit;font-weight:800;cursor:pointer}
html .host-body dialog.round-demo-layer[open]{display:flex;flex-direction:column;inset:0;width:100%;height:100dvh;max-width:100%;max-height:100dvh;margin:0;border:0;border-radius:0;transform:none;padding:0;overflow:auto}
html .host-body .round-demo-layer .round-demo-content{width:100%;max-width:none;margin:0;flex:1;display:flex;flex-direction:column}
html .host-body .round-demo-layer .round-demo-previews{flex:1;align-items:stretch}
html .host-body .round-demo-previews>section{display:flex;flex-direction:column;min-width:0}
html .host-body .round-demo-previews .demo-tv{flex:1;min-height:35vh}
.round-demo-layer{position:fixed;inset:0;width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;padding:0;border:0;background:#160d25;color:#fff;box-sizing:border-box;overflow:auto}.round-demo-layer::backdrop{background:#0d0719}.round-demo-layer>header{position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;gap:20px;align-items:center;padding:18px 28px;background:#211431;border-bottom:1px solid #78558c}.round-demo-layer h1{font-size:clamp(1.4rem,3vw,2.2rem);margin:4px 0}.round-demo-layer small,.demo-brand{color:#55d9d9}.round-demo-layer button{font:inherit;padding:12px 18px;border-radius:12px;border:1px solid #9471a8;background:#3a264b;color:#fff;cursor:pointer}.round-demo-layer button:focus-visible,.round-demo-open:focus-visible{outline:3px solid #c5ff20;outline-offset:3px}.round-demo-layer [data-demo-close]{background:#c5ff20;color:#20142b;font-weight:800}.round-demo-layer nav{display:flex;gap:12px;padding:18px 28px}.round-demo-layer [aria-pressed=true]{border-color:#4ee5da;background:#17433d}.round-demo-content{padding:0 28px 28px;max-width:1500px;margin:auto}.demo-disclaimer{color:#d4c6df;margin-top:0}.round-demo-previews{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(280px,1fr);gap:30px}.round-demo-previews h2,.demo-host-notes h2{font-size:1.2rem}.demo-tv{border:7px solid #45374f;border-radius:18px;min-height:280px;padding:28px;background:linear-gradient(130deg,#142c32,#30153b);text-align:center;display:flex;flex-direction:column;justify-content:center;box-sizing:border-box}.demo-tv h3{font-size:clamp(1.5rem,3vw,2.6rem);margin:20px 0}.demo-tv img{max-height:200px;max-width:100%;object-fit:contain}.demo-phone{max-width:320px;min-height:300px;margin:auto;border:7px solid #6b587a;border-radius:30px;padding:24px 18px;background:#281738;box-sizing:border-box}.demo-phone h3{font-size:1.15rem}.demo-phone input{box-sizing:border-box;width:100%;padding:10px;margin:10px 0;background:#170c25;color:#fff;border:1px solid #937aa1;border-radius:10px}.demo-phone input[type=range]{padding:0}.demo-options{display:grid;grid-template-columns:1fr 1fr;gap:8px}.demo-options span{padding:12px;background:#403252;border-radius:10px}.demo-phone .demo-buzzer{width:100%;min-height:110px;border-radius:50%;background:#c5ff20;color:#171020;font-weight:900}.demo-match{font-size:4rem;font-weight:bold;background:#14817e;text-align:center;border-radius:16px}.demo-canvas{min-height:130px;background:#fff;color:#222;padding:20px;text-align:center;border-radius:12px}.demo-result{padding:24px;color:#c5ff20;font-size:1.6rem}.demo-host-notes{border-left:4px solid #49d5ca;padding:8px 20px;margin-top:24px;background:#ffffff08}.demo-host-notes p{line-height:1.6}.demo-feedback{color:#c5ff20;font-size:.9rem}@media(max-width:760px){.round-demo-previews{grid-template-columns:1fr}.round-demo-layer>header{align-items:start;padding:12px;gap:10px}.round-demo-content{padding:0 16px 20px}.round-demo-layer nav{padding:12px;flex-wrap:wrap}.round-demo-layer [data-demo-close]{font-size:.85rem}}