.demo{border:1px solid var(--border);border-radius:var(--radius-xl);background:var(--surface-1);box-shadow:var(--shadow-4);font-size:var(--text-sm);-webkit-user-select:none;user-select:none;position:relative;overflow:hidden}.demo-bar{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border);background:var(--surface-sunken);align-items:center;gap:6px;display:flex}.demo-bar>span{background:var(--border-strong);border-radius:50%;width:10px;height:10px}.demo-bar p{margin-left:var(--space-3);font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--text-secondary)}.live{font-size:11px;font-style:normal;font-weight:var(--weight-semibold);border-radius:var(--radius-sm);color:#fff;background:#e02929;margin-left:auto;padding:1px 8px}.demo-body{grid-template-columns:210px 1fr;min-height:300px;display:grid}.demo-side{padding:var(--space-4);border-right:1px solid var(--border);background:var(--surface);gap:var(--space-3);flex-direction:column;display:flex}.side-title,.main-title{font-size:var(--text-xs);font-weight:var(--weight-semibold);text-transform:uppercase;letter-spacing:.06em;color:var(--text-tertiary)}.main-title{font-size:var(--text-lg);text-transform:none;letter-spacing:-.01em;color:var(--text-primary)}.dm{gap:var(--space-2);font-size:var(--text-xs);line-height:1.4;display:flex}.dm>span{flex-direction:column;min-width:0;display:flex}.dm strong{font-weight:var(--weight-semibold)}.av{border-radius:var(--radius-md);flex:none;place-items:center;width:28px;height:28px;font-size:10px;display:grid}.av1{color:#8b4818;background:#fae6d1}.av2{color:#215283;background:#d8ebf8}.demo-main{padding:var(--space-5);gap:var(--space-4);flex-direction:column;display:flex}.fields{gap:var(--space-4);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.fields dt{font-size:var(--text-xs);color:var(--text-tertiary)}.fields dd{font-weight:var(--weight-medium);width:fit-content}.t{border-radius:var(--radius-sm);outline-offset:2px;transition:filter var(--dur-base) var(--ease-out), outline-color var(--dur-fast) var(--ease-out);outline:2px solid #0000}.t.is-hover{outline-color:var(--accent);background:color-mix(in srgb, var(--accent) 8%, transparent)}.t.is-blurred{filter:blur(6px)}.mini-bar{left:50%;bottom:var(--space-4);align-items:center;gap:var(--space-3);padding:6px 6px 6px var(--space-3);border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface-1);box-shadow:var(--shadow-3);font-size:var(--text-xs);font-weight:var(--weight-semibold);white-space:nowrap;display:flex;position:absolute;transform:translate(-50%)}.mini-bar .dot{background:var(--accent);border-radius:50%;width:7px;height:7px}.mini-bar b{border-radius:var(--radius-md);background:var(--accent);color:var(--on-accent);padding:3px 10px}.cursor{pointer-events:none;transition:transform .7s var(--ease-out);filter:drop-shadow(0 1px 2px #00000040);position:absolute;top:0;left:0}@media (max-width:560px){.demo-body{grid-template-columns:1fr}.demo-side{border-right:0;border-bottom:1px solid var(--border)}}
.hero{gap:var(--space-8);padding-block:var(--space-8) var(--space-9);grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:center;display:grid}.hero h1{margin-top:var(--space-3);font-size:var(--text-5xl);line-height:1.05;font-weight:var(--weight-semibold);letter-spacing:-.03em;max-width:12ch}.hero-lede{margin-top:var(--space-5);font-size:var(--text-md);color:var(--text-secondary);max-width:44ch}.hero-actions{gap:var(--space-3);margin-top:var(--space-6);flex-wrap:wrap;display:flex}.hero-note{margin-top:var(--space-4);font-size:var(--text-sm)}@media (max-width:960px){.hero{gap:var(--space-7);padding-top:var(--space-7);grid-template-columns:1fr}.hero h1{font-size:var(--text-4xl)}}.split{gap:var(--space-8);grid-template-columns:minmax(0,4fr) minmax(0,6fr);align-items:start;display:grid}@media (max-width:860px){.split{gap:var(--space-6);grid-template-columns:1fr}}.incidents{flex-direction:column;padding:0;list-style:none;display:flex}.incidents li{padding-block:var(--space-5);border-top:1px solid var(--border)}.incidents li:first-child{border-top:0;padding-top:0}.incidents h3,.steps h3,.feature-list h3{font-size:var(--text-md);font-weight:var(--weight-semibold);letter-spacing:-.01em;margin-bottom:var(--space-1)}.incidents p{max-width:52ch}.steps{margin-top:var(--space-7);gap:var(--space-6);grid-template-columns:repeat(3,minmax(0,1fr));padding:0;list-style:none;display:grid}.steps li{gap:var(--space-1);flex-direction:column;display:flex}.step-n{width:32px;height:32px;margin-bottom:var(--space-3);border-radius:var(--radius-lg);background:var(--accent-soft);color:var(--accent-soft-text);font-weight:var(--weight-semibold);place-items:center;display:grid}@media (max-width:760px){.steps{grid-template-columns:1fr}}.features{gap:var(--space-8);grid-template-columns:minmax(0,4fr) minmax(0,6fr);display:grid}.feature-lead{align-self:start;position:sticky;top:112px}.feature-lead .section-title{margin-top:var(--space-3)}.feature-list{gap:var(--space-6) var(--space-5);grid-template-columns:repeat(2,minmax(0,1fr));padding:0;list-style:none;display:grid}.pro-tag{vertical-align:2px;margin-left:var(--space-1);border-radius:var(--radius-sm);font-size:11px;font-weight:var(--weight-semibold);letter-spacing:.02em;text-transform:uppercase;background:var(--accent-soft);color:var(--accent-soft-text);padding:0 6px;display:inline-block}@media (max-width:860px){.features{gap:var(--space-6);grid-template-columns:1fr}.feature-lead{position:static}}@media (max-width:560px){.feature-list{grid-template-columns:1fr}}.uses div{gap:var(--space-4);padding-block:var(--space-4);border-top:1px solid var(--border);grid-template-columns:minmax(0,2fr) minmax(0,3fr);display:grid}.uses div:first-child{border-top:0;padding-top:0}.uses dt{font-weight:var(--weight-semibold)}@media (max-width:560px){.uses div{gap:var(--space-1);grid-template-columns:1fr}}.faq details{border-top:1px solid var(--border)}.faq details:first-child{border-top:0}.faq summary{justify-content:space-between;align-items:center;gap:var(--space-4);padding-block:var(--space-4);font-weight:var(--weight-semibold);cursor:pointer;list-style:none;display:flex}.faq details:first-child summary{padding-top:0}.faq summary::-webkit-details-marker{display:none}.faq summary:after{content:"+";font-size:var(--text-xl);font-weight:var(--weight-normal);color:var(--text-tertiary);transition:transform var(--dur-fast) var(--ease-out);flex:none;line-height:1}.faq details[open] summary:after{transform:rotate(45deg)}.faq details p{padding-bottom:var(--space-4);max-width:60ch}.cta{background:var(--surface-sunken)}.cta-inner{justify-content:space-between;align-items:flex-end;gap:var(--space-5);flex-wrap:wrap;display:flex}