.site .demo{--demo-h:460px;--demo-w:520px;height:var(--demo-h);border-radius:var(--radius-card);background:var(--surface-sunken);isolation:isolate;place-items:center;display:grid;position:relative;overflow:hidden}.site .demo-motif{z-index:-1;position:absolute;inset:0}.site .demo-motif>*,.site .demo-motif svg{width:100%!important;height:100%!important}.site .demo-ui{width:min(var(--demo-w), 100% - 2 * var(--pad-4));clip-path:inset(0 0 100%)}.site [data-demo].play .demo-ui{animation:site-demo-card-in var(--dur-5) var(--step-8bit) var(--card-delay,calc(var(--dur-5) * 2)) both}@media (max-width:720px){.site .demo{--demo-h:440px}}.site .dcard{height:var(--card-h,360px);background:var(--surface-raised);border:1.5px solid var(--border-light);border-radius:var(--radius-card);color:var(--text-1);text-align:left;grid-template-rows:auto 1fr auto;display:grid;overflow:hidden;box-shadow:0 6px 12px #0000000f,0 24px 48px #0000001a}.site .dc-head{align-items:center;gap:var(--pad-3);height:56px;padding:0 var(--pad-4);border-bottom:1px solid var(--border-extra-light);display:flex}.site .dc-head .who{flex:1;min-width:0;display:grid}.site .dc-head .name{font-size:14px;font-weight:450;line-height:21px}.site .dc-head .sub{font:11px/14px var(--font-mono);letter-spacing:var(--track-label);text-transform:uppercase;color:var(--text-3);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.site .dc-head .sub>span:not(.on),.site .dc-head .sub>span.on.off{display:none}.site .dc-body{padding:var(--pad-3) var(--pad-4);align-content:start;gap:2px;min-height:0;display:grid;overflow:hidden}.site .dc-foot{justify-content:space-between;align-items:center;gap:var(--pad-3);height:48px;padding:0 var(--pad-4);border-top:1px solid var(--border-extra-light);font:11px/14px var(--font-mono);letter-spacing:var(--track-label);text-transform:uppercase;color:var(--text-3);display:flex}.site .dc-foot b{color:var(--text-1);font-variant-numeric:tabular-nums;font-weight:400}.site .ev{align-items:center;gap:var(--pad-3);grid-template-columns:20px minmax(0,1fr) auto;min-height:36px;font-size:14px;line-height:21px;display:grid}.site .demo-ui .ev[data-at]:not(.on),.site .demo-ui .rv[data-at]:not(.on){display:none}.site .demo-ui .ev.on,.site .demo-ui .rv.on{animation:site-ev-in var(--dur-3) var(--step-8bit) both}.site .ev .txt{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.site .ev .meta{font:11px/14px var(--font-mono);letter-spacing:var(--track-label);text-transform:uppercase;color:var(--text-3);white-space:nowrap}.site .ev .st{border-radius:var(--radius-chip);background:var(--fill-2);width:20px;height:20px;color:var(--sai-purple);place-items:center;display:grid}.site .ev .st>.d,.site .ev.done .st>.p{display:none}.site .ev.done .st>.d{display:inline-block}.site .ev.done .st{background:var(--sai-green);color:var(--sai-black)}.site .ev.warn.done .st{background:var(--orange-800);color:#fff}.site .ev.brand.done .st{background:var(--sai-purple);color:#fff}.site .ev.quiet.done .st{background:var(--fill-2);color:var(--text-2)}.site .ev:not(.done) .txt{color:var(--text-2)}.site .ev .ok{color:var(--ink-verified)}.site .d-user{background:var(--bubble);border-radius:var(--radius-control);white-space:nowrap;text-overflow:ellipsis;justify-self:end;max-width:85%;padding:8px 12px;font-size:14px;line-height:21px;overflow:hidden}.site .d-cipher{border-radius:var(--radius-control);background:var(--sai-black);max-width:85%;color:var(--sai-green);font:12px/21px var(--font-mono);white-space:nowrap;justify-self:end;padding:8px 12px;overflow:hidden}.site .d-answer{gap:var(--pad-2);padding-top:var(--pad-2);grid-template-columns:24px 1fr;align-items:start;font-size:14px;line-height:21px;display:grid}.site .d-receipt{align-items:center;gap:var(--pad-2);font:11px/14px var(--font-mono);letter-spacing:var(--track-label);text-transform:uppercase;color:var(--text-3);padding-left:32px;display:flex}.site .d-receipt .chip{height:20px}.site [data-type]:after{content:"";vertical-align:-2px;background:var(--sai-purple);opacity:0;width:6px;height:14px;margin-left:2px;display:inline-block}.site [data-type].typing:after{opacity:1}.site .d-meter{height:12px;margin:var(--pad-2) 0;grid-template-columns:repeat(20,1fr);gap:2px;display:grid}.site .d-meter i{background:var(--fill-2)}.site .d-meter.on i{animation:1ms step-end both site-meter-fill;animation-delay:calc(var(--n) * var(--stagger) * 2)}.site .d-alloc{height:12px;margin:var(--pad-1) 0 var(--pad-2);gap:2px;display:flex}.site .d-alloc .a{flex:0 0 var(--a,62%);background:var(--sai-purple);transition:flex-basis var(--dur-5) var(--step-8bit)}.site .d-alloc .b{background:var(--sai-blue,#4f8fe6);flex:1}.site .d-alloc.on .a{--a:var(--a2,60%)}.site .d-legend{font:11px/14px var(--font-mono);letter-spacing:var(--track-label);text-transform:uppercase;color:var(--text-3);justify-content:space-between;display:flex}.site .d-big{font-family:var(--font-head);font-variant-numeric:tabular-nums;font-size:40px;font-weight:700;line-height:40px}.site .d-kv{align-items:baseline;gap:var(--pad-3);padding:var(--pad-2) 0;border-bottom:1px solid var(--border-extra-light);grid-template-columns:1fr auto;font-size:14px;line-height:21px;display:grid}.site .d-kv .k{color:var(--text-3)}.site .d-kv .v{font-variant-numeric:tabular-nums}.site .d-ticker{height:100%;position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(#0000,#000 16% 84%,#0000);mask-image:linear-gradient(#0000,#000 16% 84%,#0000)}.site .d-ticker .rows{animation:7.2s steps(24,end) infinite site-ticker;display:grid}.site .d-ticker .rows>div{gap:var(--pad-3);grid-template-columns:20px 1fr auto;align-items:center;height:36px;font-size:13px;line-height:18px;display:grid}.site .d-ticker .rows .meta{font:11px/14px var(--font-mono);color:var(--text-3);text-transform:uppercase;letter-spacing:var(--track-label)}.site .d-ticker .rows i{background:var(--sai-green);width:8px;height:8px;margin:0 6px}@media (prefers-reduced-motion:reduce){.site [data-demo] .demo-ui{clip-path:none;animation:none!important}.site .demo-ui .ev.on,.site .demo-ui .rv.on,.site .d-ticker .rows{animation:none}}.site .flip .demo{border:1.5px solid var(--border-light)}@keyframes site-demo-card-in{0%{clip-path:inset(0 0 100%)}to{clip-path:inset(0)}}@keyframes site-ev-in{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}@keyframes site-meter-fill{to{background:var(--sai-purple)}}@keyframes site-ticker{to{transform:translateY(-50%)}}