@property --demo-n{syntax: "<integer>"; inherits: false; initial-value: 0;}.demo-stage{margin-top:40px}.demo-stage-bare{margin-top:44px;display:flex;flex-direction:column;align-items:center}.demo-frame{border-radius:var(--rf-r-lg);overflow:hidden;background:#2a1b4a url(/swirl.webp) center/cover;padding:clamp(28px,5vw,64px);display:flex;align-items:center;justify-content:center}.demo-frame-bare{background:none;padding:0;overflow:visible}.demo-cap{margin-top:14px;display:flex;align-items:center;gap:9px;font-size:13px;color:var(--rf-text-3)}.demo-media{width:100%;max-width:620px;border-radius:var(--rf-r-card);display:block;box-shadow:0 34px 80px -36px #16123a99}.demo-app{--demo-cycle: 9s;width:100%;max-width:560px;text-align:left;background:var(--rf-white);border:1px solid rgba(255,255,255,.6);border-radius:var(--rf-r-card);overflow:hidden;box-shadow:0 34px 80px -36px #16123a99;font-family:var(--rf-sans)}.demo-bar{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--rf-line)}.demo-brand{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:700;color:var(--rf-text-1)}.demo-logo{width:16px;height:16px;border-radius:5px;background:var(--rf-gradient)}.demo-live{display:flex;align-items:center;gap:6px;font:600 10px/1 var(--rf-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--rf-text-3)}.demo-live-dot{width:6px;height:6px;border-radius:50%;background:var(--rf-teal);animation:demo-pulse 2s var(--rf-ease) infinite}.demo-body{position:relative;overflow:hidden;padding:18px 16px 16px;display:grid;gap:13px}.demo-body:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 44%,color-mix(in srgb,var(--rf-violet) 12%,transparent) 50%,transparent 56%);transform:translate(-130%);animation:demo-shimmer var(--demo-cycle) var(--rf-ease) infinite}.demo-msg{justify-self:end;max-width:82%;padding:10px 13px;background:var(--rf-ink);color:var(--rf-on-dark-1);font-size:13.5px;line-height:1.45;border-radius:14px 14px 4px;animation:demo-in-msg var(--demo-cycle) var(--rf-ease) infinite}.demo-scan{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 14px;border-radius:var(--rf-r-inner);background:var(--rf-paper-2);animation:demo-in-scan var(--demo-cycle) var(--rf-ease) infinite}.demo-scan-label{font:600 11px/1 var(--rf-mono);letter-spacing:.04em;text-transform:uppercase;color:var(--rf-text-3)}.demo-clarify{display:grid;gap:10px;padding:12px 14px;border-radius:var(--rf-r-inner);border:1px solid var(--rf-line);background:var(--rf-white);animation:demo-in-clarify var(--demo-cycle) var(--rf-ease) infinite}.demo-q{display:grid;gap:7px}.demo-q-label{font:600 10px/1 var(--rf-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--rf-text-3)}.demo-chips{display:flex;flex-wrap:wrap;gap:7px}.demo-chip{font-size:12px;line-height:1;padding:6px 11px;border-radius:var(--rf-r-pill);border:1px solid var(--rf-line);background:var(--rf-white);color:var(--rf-text-2)}.demo-chip.on{animation:demo-chip-on var(--demo-cycle) var(--rf-ease) infinite}.demo-count{display:flex;align-items:baseline;gap:8px}.demo-num{--demo-n: var(--demo-to, 0);counter-reset:demon var(--demo-n);display:inline-block;min-width:var(--demo-num-w, 4.4ch);text-align:right;font:800 26px/1 var(--rf-display);letter-spacing:-.02em;font-variant-numeric:tabular-nums;background:var(--rf-gradient);-webkit-background-clip:text;background-clip:text;color:transparent}.demo-num:after{content:counter(demon)}.demo-unit{font-size:12px;color:var(--rf-text-2)}.demo-rows{display:grid;gap:8px;animation:demo-in-rows var(--demo-cycle) var(--rf-ease) infinite}.demo-row{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--rf-line);border-radius:var(--rf-r-inner);background:var(--rf-white);font-size:13px;color:var(--rf-text-1)}.demo-ic{flex:none;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:700}.demo-ic.ok{background:color-mix(in srgb,var(--rf-teal) 15%,transparent);color:var(--rf-teal)}.demo-ic.sub{background:color-mix(in srgb,var(--rf-violet) 15%,transparent);color:var(--rf-violet)}.demo-part{flex:1}.demo-tag{flex:none;font:600 10.5px/1 var(--rf-mono);letter-spacing:.03em;text-transform:uppercase;color:var(--rf-teal)}.demo-tag.alt{color:var(--rf-violet)}.demo-result{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:var(--rf-r-inner);background:var(--rf-ink);color:var(--rf-on-dark-1);animation:demo-in-result var(--demo-cycle) var(--rf-ease) infinite}.demo-result-k{font-weight:700;font-size:13.5px}.demo-result-v{font-size:12px;color:var(--rf-on-dark-2)}.demo-rec{position:relative;padding:13px 14px 13px 16px;border:1px solid var(--rf-line);border-radius:var(--rf-r-inner);background:var(--rf-white);box-shadow:0 1px 2px #16123a0a}.demo-rec:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;border-radius:var(--rf-r-inner) 0 0 var(--rf-r-inner);background:var(--rf-gradient)}.demo-rec-label{font:600 9.5px/1 var(--rf-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--rf-text-3)}.demo-rec-part{margin-top:6px;font-size:15px;font-weight:700;color:var(--rf-text-1)}.demo-rec-why{margin:9px 0 0;padding:0;display:grid;gap:6px}.demo-rec-why li{list-style:none;display:flex;align-items:flex-start;gap:8px;font-size:12.5px;line-height:1.4;color:var(--rf-text-2)}.demo-rec-why .ck{flex:none;margin-top:1px;width:15px;height:15px;border-radius:50%;background:color-mix(in srgb,var(--rf-teal) 15%,transparent);color:var(--rf-teal);display:grid;place-items:center;font:700 9px/1 var(--rf-sans)}.demo-source{margin-top:11px;display:inline-flex;align-items:center;gap:7px;padding:6px 10px;border-radius:var(--rf-r-pill);background:var(--rf-paper-2);border:1px solid var(--rf-line);font:500 11px/1 var(--rf-mono);color:var(--rf-text-3)}.demo-source svg{flex:none;width:13px;height:13px;color:var(--rf-violet)}.demo-source b{color:var(--rf-violet);font-weight:600}.demo-file{justify-self:start;display:inline-flex;align-items:center;gap:10px;max-width:90%;padding:10px 13px;border:1px solid var(--rf-line);border-radius:var(--rf-r-inner);background:var(--rf-paper-2);font-size:13px;color:var(--rf-text-1);animation:demo-in-msg var(--demo-cycle) var(--rf-ease) infinite}.demo-file-ic{flex:none;width:22px;height:22px;border-radius:6px;background:var(--rf-gradient);color:#fff;display:grid;place-items:center;font-size:11px}.demo-file-meta{padding-left:10px;font:600 11px/1 var(--rf-mono);color:var(--rf-text-3)}.demo-checks{display:grid;gap:8px}.demo-check{display:flex;align-items:center;gap:10px;padding:9px 12px;border:1px solid var(--rf-line);border-radius:var(--rf-r-inner);background:var(--rf-white);font-size:13px;color:var(--rf-text-1)}.demo-check .k{font-weight:600}.demo-check .v{margin-left:auto;padding-left:10px;font:500 11.5px/1.3 var(--rf-mono);color:var(--rf-text-3);text-align:right}.demo-check-ic{flex:none;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:700}.demo-check-ic.pass{background:color-mix(in srgb,var(--rf-teal) 15%,transparent);color:var(--rf-teal)}.demo-check-ic.flag{background:color-mix(in srgb,var(--rf-amber) 16%,transparent);color:var(--rf-amber)}.demo-check .num{flex:none;width:16px;font:700 10px/1 var(--rf-mono);color:var(--rf-violet)}.demo-phase{display:flex;align-items:center;gap:8px;font:600 9.5px/1 var(--rf-mono);letter-spacing:.11em;text-transform:uppercase;color:var(--rf-violet)}.demo-phase:after{content:"";flex:1;height:1px;background:var(--rf-line)}.demo-json{overflow:hidden;padding:10px 12px;border:1px solid var(--rf-line);border-radius:var(--rf-r-inner);background:#fbfaf7;font:500 11.5px/1.7 var(--rf-mono)}.demo-json .demo-jl{white-space:pre}.demo-json .jk{color:var(--rf-violet)}.demo-json .js{color:var(--rf-teal)}.demo-json .jn{color:var(--rf-amber)}.demo-json .jp{color:var(--rf-text-3)}@keyframes demo-pulse{0%,to{box-shadow:0 0 color-mix(in srgb,var(--rf-teal) 55%,transparent)}70%{box-shadow:0 0 0 6px transparent}}@keyframes demo-in-msg{0%{opacity:0;transform:translateY(10px)}4%{opacity:1;transform:none}96%{opacity:1;transform:none}to{opacity:0;transform:translateY(10px)}}@keyframes demo-in-clarify{0%,6%{opacity:0;transform:translateY(8px)}12%{opacity:1;transform:none}96%{opacity:1;transform:none}to{opacity:0}}@keyframes demo-chip-on{0%,13%{border-color:var(--rf-line);background:var(--rf-white);color:var(--rf-text-2);box-shadow:none}18%,96%{border-color:transparent;background:color-mix(in srgb,var(--rf-violet) 12%,var(--rf-white));color:var(--rf-violet);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--rf-violet) 32%,transparent)}to{border-color:var(--rf-line);background:var(--rf-white);color:var(--rf-text-2);box-shadow:none}}@keyframes demo-in-scan{0%,24%{opacity:0;transform:translateY(8px)}28%{opacity:1;transform:none}96%{opacity:1;transform:none}to{opacity:0}}@keyframes demo-in-rows{0%,48%{opacity:0;transform:translateY(10px)}56%{opacity:1;transform:none}96%{opacity:1;transform:none}to{opacity:0;transform:translateY(10px)}}@keyframes demo-in-result{0%,64%{opacity:0;transform:translateY(8px) scale(.98)}70%{opacity:1;transform:none}96%{opacity:1;transform:none}to{opacity:0}}@keyframes demo-shimmer{0%,24%{transform:translate(-130%)}46%,to{transform:translate(130%)}}@media(prefers-reduced-motion:reduce){.demo-msg,.demo-clarify,.demo-scan,.demo-rows,.demo-result{animation:none;opacity:1;transform:none}.demo-num{animation:none;--demo-n: var(--demo-to, 0)}.demo-chip.on{animation:none;border-color:transparent;background:color-mix(in srgb,var(--rf-violet) 12%,var(--rf-white));color:var(--rf-violet);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--rf-violet) 32%,transparent)}.demo-live-dot{animation:none}.demo-body:after{display:none}}