/* Sample-site strip and panel. Neutral, so it sits on top of any of the six designs. */
#demo-strip{position:fixed;left:0;right:0;margin:0 auto;width:max-content;bottom:max(10px,env(safe-area-inset-bottom));z-index:9000;display:flex;align-items:center;gap:10px;max-width:calc(100vw - 16px);padding:6px 6px 6px 14px;border-radius:999px;background:rgba(17,17,19,.92);color:#fff;font:500 13px/1.2 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;box-shadow:0 10px 30px -10px rgba(0,0,0,.6);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
#demo-strip>span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:.85}
#demo-strip b{white-space:nowrap}
#demo-strip b{font-weight:700;opacity:1}
#demo-strip a{flex:none;display:inline-flex;align-items:center;min-height:36px;padding:0 14px;border-radius:999px;background:#fff;color:#111;text-decoration:none;font-weight:700}
#demo-strip a:focus-visible{outline:2px solid #fff;outline-offset:3px}
@media (max-width:520px){#demo-strip .ds-long{display:none}#demo-strip{gap:8px;padding-left:12px}#demo-strip a{padding:0 12px}}
body{padding-bottom:64px}
#demo-panel{position:fixed;inset:0;z-index:9100;display:grid;place-items:end center}
@media (min-width:640px){#demo-panel{place-items:center}}
#demo-panel .dp-back{position:absolute;inset:0;background:rgba(10,10,12,.55);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
#demo-panel .dp-card{position:relative;width:min(440px,100%);margin:0;padding:24px 22px 18px;border-radius:22px 22px 0 0;background:#fff;color:#141414;font:400 16px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;box-shadow:0 30px 80px -20px rgba(0,0,0,.6);animation:dp-in .35s cubic-bezier(.22,1,.36,1)}
@media (min-width:640px){#demo-panel .dp-card{border-radius:22px}}
#demo-panel .dp-k{margin:0;font:600 11px/1 ui-monospace,Menlo,monospace;letter-spacing:.12em;text-transform:uppercase;color:#7a7a7a}
#demo-panel h2{margin:10px 0 8px;font-size:22px;line-height:1.15;letter-spacing:-.02em}
#demo-panel .dp-p{margin:0 0 18px;color:#4a4a4a}
#demo-panel .dp-go{display:flex;justify-content:center;align-items:center;min-height:50px;border-radius:14px;background:#141414;color:#fff;text-decoration:none;font-weight:700}
#demo-panel .dp-x{display:block;width:100%;min-height:44px;margin-top:6px;border:0;background:none;color:#555;font:inherit;cursor:pointer}
@keyframes dp-in{from{transform:translateY(24px);opacity:0}}
@media (prefers-reduced-motion:reduce){#demo-panel .dp-card{animation:none}}