.demo-banner{border:1px solid var(--line-strong);border-radius:18px;background:var(--surface);padding:24px;margin:0 0 24px}
.demo-banner h1{font-size:clamp(23px,4vw,30px);line-height:1.2;margin:12px 0}
.demo-banner p{line-height:1.55}
.demo-kicker{color:var(--accent);font-size:11px;font-weight:750;letter-spacing:1.2px;display:flex;align-items:center;gap:8px;margin:0}
.demo-dot{width:7px;height:7px;border-radius:50%;background:var(--accent);flex-shrink:0}
.demo-disclaimer{color:var(--muted);font-size:13px;max-width:60ch}
.demo-actions,.demo-tour-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:18px}
.demo-actions a{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
.demo-links{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 0;font-size:13px}
.demo-links a{color:var(--muted);text-underline-offset:4px}
.demo-tour{background:var(--selected);border:2px solid var(--accent);border-radius:14px;padding:20px;margin:20px 0;scroll-margin:20px}
.demo-tour h2{font-size:21px;margin:10px 0}
.demo-tour p{line-height:1.55}
.demo-tour h2:focus{outline:none}
.demo-tour [disabled]{opacity:.45}
.demo-highlight{outline:2px dashed var(--accent);outline-offset:6px;border-radius:10px}
.demo-hint{position:relative;margin:12px 0}
.demo-hint-button{color:var(--accent);background:transparent;border:0;padding:7px 0;font-size:12px;min-height:40px;text-align:left;cursor:pointer}
.demo-hint-button span{display:inline-grid;place-items:center;width:19px;height:19px;border:1px solid var(--accent);border-radius:50%;margin-right:6px;font-weight:700}
.demo-hint-text{display:block;border:1px solid var(--line-strong);border-radius:10px;background:var(--surface-soft);color:var(--text);font-size:13px;line-height:1.6;padding:12px 14px;max-width:55ch;margin-top:4px}
.demo-hint-text[hidden],.demo-tour[hidden]{display:none}
.demo-session-label{position:sticky;top:0;z-index:4;text-align:center;background:var(--accent);color:var(--on-accent);padding:7px 12px;font-size:12px;font-weight:650}
#install-app{display:none!important}
@media(max-width:480px){.demo-banner{padding:18px}.demo-actions{align-items:stretch}.demo-actions>.primary,.demo-actions>a{width:100%}.demo-tour{padding:16px}.demo-tour-actions{gap:8px}.demo-tour-actions button{padding:10px 13px}}
@media print{.demo-banner,.demo-tour,.demo-hint{display:none!important}.demo-session-label{position:static;background:white;color:black;border-bottom:1px solid black;display:block!important}}