body:has(.demo-banner){--demo-banner-height:40px;padding-top:var(--demo-banner-height)}body:has(.demo-banner) .site-header{top:var(--demo-banner-height)}body:has(.demo-banner) .portal-sidebar{top:var(--demo-banner-height);height:calc(100dvh - var(--demo-banner-height))}.demo-banner{position:fixed;inset:0 0 auto;z-index:200;height:var(--demo-banner-height);display:flex;align-content:center;align-items:center;justify-content:center;flex-wrap:wrap;gap:4px 28px;padding:6px 20px;background:var(--highlight);color:var(--on-highlight);font-size:12px}.demo-banner a{text-decoration:underline;text-underline-offset:3px;font-weight:650}.demo-launcher{max-width:1140px;margin:auto;padding:48px 28px 80px}.demo-launcher header{margin:64px 0 32px;max-width:700px}.demo-launcher h1{font-family:var(--font-display);font-weight:var(--font-display-weight);font-size:clamp(42px,5vw,68px);letter-spacing:-.04em;line-height:1.08;margin:16px 0 20px}.demo-launcher header p{max-width:550px;font-size:18px;line-height:1.7;color:var(--muted)}.demo-explainer{padding:20px 24px;border:1px solid var(--line);background:var(--primary-soft);border-radius:var(--radius-medium);margin-bottom:28px;font-size:14px}.demo-explainer p{margin:7px 0 0;color:var(--muted);line-height:1.65}.demo-accounts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.demo-account{position:relative;display:flex;flex-direction:column;text-align:left;min-width:0;padding:28px;border:1px solid var(--line);background:var(--surface);border-radius:var(--radius-medium);color:var(--ink);transition:border-color .18s,transform .18s}.demo-account:hover{border-color:var(--primary);transform:translateY(-3px)}.demo-account:disabled{opacity:.7}.demo-account-index{position:absolute;top:24px;right:24px;color:var(--primary);font-family:var(--font-display)}.demo-account-role{text-transform:uppercase;letter-spacing:.12em;font-size:10px;margin:2px 30px 28px 0;font-weight:700;color:var(--primary)}.demo-account strong{font-family:var(--font-display);font-weight:var(--font-display-weight);font-size:26px;margin-bottom:12px}.demo-account>span:not([class]){font-size:13px;line-height:1.6;color:var(--muted);min-height:44px}.demo-account small{font-size:11px;color:var(--muted);overflow-wrap:anywhere;margin-top:20px}.demo-account-enter{display:flex;align-items:center;justify-content:space-between;padding-top:24px;margin-top:auto;font-size:12px;font-weight:650}.demo-account-enter span{font-size:20px}.demo-footer{display:flex;justify-content:space-between;align-items:center;gap:30px;border-top:1px solid var(--line);margin-top:48px;padding-top:32px}.demo-footer h2{font-family:var(--font-display);font-size:24px;font-weight:var(--font-display-weight);margin:0 0 12px}.demo-footer p{color:var(--muted);font-size:13px;line-height:1.7;max-width:520px}.demo-reset{display:flex;flex-wrap:wrap;gap:16px;max-width:330px}@media(max-width:800px){.demo-accounts{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:540px){.demo-launcher{padding:32px 20px 60px}.demo-launcher header{margin-top:40px}.demo-accounts{grid-template-columns:1fr}.demo-footer{align-items:flex-start;flex-direction:column}.demo-account{padding:24px}body:has(.demo-banner){--demo-banner-height:62px}.demo-banner{font-size:11px}}@media(prefers-reduced-motion:reduce){.demo-account{transition:none}.demo-account:hover{transform:none}}.demo-back{display:inline-flex;align-items:center;gap:12px;font-size:.8125rem;font-weight:650}.demo-account{box-shadow:var(--shadow-card)}.demo-account-index,.demo-account-role{font-family:var(--font-mono)}