/* Landing live-demo frame — v3 dark skin (2026-09-19).
   Loader contract (landing-demo-v3.js) untouched; colors now match the
   landing-v3.css dark theme and the black-theme app inside the frame. */
.live-demo{padding:46px 0 50px;border-top:1px solid rgba(255,255,255,.055);scroll-margin-top:90px;content-visibility:visible;contain-intrinsic-size:auto}.proof.proof-with-demo{content-visibility:visible!important;contain-intrinsic-size:auto!important}
.live-demo-copy{text-align:center;max-width:720px;margin:0 auto 24px}
.live-demo-eyebrow{margin:0 0 8px;color:#8B93FF;font-size:.72rem;font-weight:850;letter-spacing:.12em;text-transform:uppercase}
.live-demo-copy h2{font-size:clamp(1.55rem,3.5vw,2.35rem);line-height:1.15;margin:0;text-wrap:balance;letter-spacing:-.02em}
.live-demo-copy>p:not(.live-demo-eyebrow){max-width:620px;margin:12px auto 0;color:#8B93A0}
.live-demo-badges{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:17px}
.live-demo-badges span{border:1px solid rgba(255,255,255,.08);border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.012) 55%),#12141A;padding:6px 10px;color:#8B93A0;font-size:.72rem;font-weight:700}
.live-demo-badges span:before{content:"\2713";margin-right:5px;color:#34D399}
.live-demo-frame-wrap{position:relative;width:min(470px,100%);margin-inline:auto;padding:15px;border:1px solid rgba(255,255,255,.08);border-radius:30px;background:linear-gradient(145deg,#161922,#0E1016);box-shadow:0 34px 90px -34px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.055)}
.live-demo-frame-wrap:before{content:"";position:absolute;inset:7px;border:1px solid rgba(255,255,255,.05);border-radius:24px;pointer-events:none}
.live-demo-loading{position:absolute;z-index:2;inset:50% auto auto 50%;transform:translate(-50%,-50%);width:max-content;max-width:80%;padding:10px 14px;border-radius:999px;background:#12141A;color:#8B93A0;border:1px solid rgba(255,255,255,.08);box-shadow:0 12px 34px rgba(0,0,0,.6);font-size:.78rem;font-weight:750;text-align:center}
.live-demo-loading:before{content:"";display:inline-block;width:10px;height:10px;margin-right:8px;border:2px solid rgba(139,147,255,.25);border-top-color:#8B93FF;border-radius:50%;animation:live-demo-spin .8s linear infinite}
.live-demo iframe{position:relative;display:block;width:100%;height:1005px;border:0;border-radius:20px;background:#0B0C10;pointer-events:none;touch-action:pan-y}.live-demo-frame-wrap.is-interactive iframe{pointer-events:auto}
.live-demo-open{display:inline-flex;align-items:center;gap:7px;margin-top:15px;color:#8B93FF;font-size:.86rem;font-weight:750}
.live-demo-open:focus-visible{outline:3px solid rgba(139,147,255,.6);outline-offset:3px}
@media(max-width:700px){.live-demo{padding:34px 0 38px;contain-intrinsic-size:1080px}.live-demo-copy{margin-bottom:18px}.live-demo-frame-wrap{margin:0 -16px;padding:8px;border-radius:20px}.live-demo iframe{height:1005px;border-radius:14px}.live-demo-frame-wrap:before{display:none}}
@media(prefers-reduced-motion:reduce){.live-demo{scroll-behavior:auto}}
@keyframes live-demo-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.live-demo-loading:before{animation:none;border-color:#8B93FF}}
.live-demo-activate,.live-demo-continue{position:absolute;z-index:4;border:0;border-radius:999px;box-shadow:0 12px 34px -8px rgba(79,70,229,.55),0 8px 24px rgba(0,0,0,.5);font:inherit;font-size:.78rem;font-weight:850;cursor:pointer}.live-demo-activate{left:50%;top:48%;padding:12px 17px;display:flex;align-items:center;gap:7px;transform:translate(-50%,-50%);background:linear-gradient(135deg,#4F46E5,#7C3AED);color:#fff;opacity:0;visibility:hidden;transition:opacity .18s ease,transform .18s ease}.live-demo-frame-wrap.is-loaded:not(.is-interactive) .live-demo-activate{opacity:1;visibility:visible}.live-demo-frame-wrap.is-interactive .live-demo-activate{display:none}.live-demo-continue{right:22px;bottom:24px;padding:10px 14px;background:#12141A;color:#8B93FF;border:1px solid rgba(255,255,255,.08)}.live-demo-continue[hidden]{display:none!important}.live-demo-frame-wrap.is-interactive:after{content:"";position:absolute;z-index:3;inset:15px;border:2px solid rgba(139,147,255,.55);border-radius:20px;pointer-events:none}.live-demo-frame-wrap:focus-within{outline:3px solid rgba(139,147,255,.35);outline-offset:4px}
@media(max-width:700px){.live-demo-frame-wrap{width:calc(100% + 32px)}.live-demo-continue{right:14px;bottom:16px}.live-demo-frame-wrap.is-interactive:after{inset:8px;border-radius:14px}}
@media(prefers-reduced-motion:reduce){.live-demo-activate{transition:none}}
.live-demo-activate{top:170px;transform:translateX(-50%)}.live-demo-continue{position:fixed;z-index:100;right:20px;bottom:20px}
@media(max-width:700px){.live-demo-activate{top:150px}.live-demo-continue{right:14px;bottom:14px}}