.cdemo{border:1px solid var(--rule);background:var(--paper);border-radius:8px;flex-direction:column;display:flex;overflow:hidden}.cdemo--expanded{z-index:60;position:fixed;inset:16px;box-shadow:0 24px 70px #0a0a0b4d}.cdemo-scrim{z-index:59;background:#0a0a0b66;position:fixed;inset:0}.cdemo__chrome{border-bottom:1px solid var(--rule);background:var(--tint);align-items:center;gap:10px;padding:8px 12px;display:flex}.cdemo__dots{gap:5px;display:flex}.cdemo__dots i{background:var(--rule);border-radius:999px;width:8px;height:8px}.cdemo__url{min-width:0;font-family:var(--mono);color:var(--faint);white-space:nowrap;text-overflow:ellipsis;flex:1;font-size:11px;overflow:hidden}.cdemo__expand{border:1px solid var(--rule);border-radius:var(--radius-control);background:var(--paper);height:24px;color:var(--muted);cursor:pointer;flex:none;padding:0 10px;font-family:inherit;font-size:11.5px}.cdemo__expand:hover{color:var(--ink);border-color:var(--ink)}.cdemo__tabs{border-bottom:1px solid var(--rule);scrollbar-width:thin;flex-wrap:nowrap;gap:2px;padding:6px 8px;display:flex;overflow-x:auto}.cdemo__tab{border-radius:var(--radius-control);height:26px;color:var(--faint);cursor:pointer;white-space:nowrap;background:0 0;border:0;flex:none;padding:0 11px;font-family:inherit;font-size:12px}.cdemo__tab:hover{color:var(--ink);background:var(--tint)}.cdemo__tab--on{background:var(--ink);color:var(--paper)}.cdemo__screen{grid-template-columns:minmax(0,1fr);min-height:420px;max-height:62vh;overflow-y:auto}.cdemo--expanded .cdemo__screen{flex:1;max-height:none}.cdemo__caption{border-top:1px solid var(--rule);background:var(--tint);color:var(--muted);margin:0;padding:9px 14px;font-size:11.5px;line-height:1.5}@media (max-width:700px){.cdemo__screen{max-height:70vh}}