/* ===== site2 visuals: renders, icons, live scenes. Motion runs only in view (.on) and stops under reduced motion. ===== */
.ico{display:block;flex:none}
.rnd{margin:0;display:flex;justify-content:center;align-items:center}.rnd img{width:100%;height:auto;max-height:640px;object-fit:contain}
.rnd.float img{animation:rfloat 9s ease-in-out infinite}@keyframes rfloat{50%{transform:translateY(-8px)}}
.vz{position:relative;background:#fff;border:1px solid var(--line);border-radius:22px;padding:22px;box-shadow:0 30px 70px -44px rgba(17,19,22,.38);overflow:hidden;font-size:14px}
.band.g .vz{border-color:transparent}
.vz:not(.on) *{animation-play-state:paused!important}
.vz-k{font:500 12px var(--mono);letter-spacing:.07em;text-transform:uppercase;color:var(--soft);margin:0 0 14px}
.vz-f{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;border-top:1px solid var(--line);margin-top:16px;padding-top:12px;font-size:13px;color:var(--muted)}.vz-f b{color:var(--ink);font-weight:500}
.px3{display:inline-grid;grid-template-columns:repeat(3,7px);gap:2px;vertical-align:middle}.px3 i{width:7px;height:7px;border-radius:2px;background:#2A2E33;transition:background .3s}
.px3 i.on{background:var(--red)}.px3 i.t{background:var(--tint)}.px3.sm{grid-template-columns:repeat(3,5px)}.px3.sm i{width:5px;height:5px;border-radius:1.5px}
.vz .mb{font:500 12px var(--mono);padding:4px 8px;border-radius:999px;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}
/* card icons */
.card .ico{margin-bottom:6px}.ind .card .ico{margin-bottom:14px}
.dm{display:flex;gap:12px;align-items:flex-start}.dm .ico{margin-top:1px}.dm>span{display:block}
/* orchestration */
.orch{display:grid;grid-template-columns:1fr 70px 1fr;align-items:center;gap:0;padding:26px;min-height:440px}
.orch-a{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.orch-a li{display:flex;gap:12px;align-items:center;padding:10px 12px;border-radius:14px;border:1px solid transparent;transition:all .5s var(--ease)}
.orch-a b{display:block;font-weight:500;font-size:14.5px}.orch-a em{display:block;font-style:normal;font:12px var(--mono);color:var(--soft);margin-top:2px}
.orch-a li.on{background:#fff;border-color:var(--line);box-shadow:0 12px 30px -18px rgba(17,19,22,.35)}.orch-a li.on em{color:var(--red-t)}
.orch-l{width:70px;height:100%;min-height:300px}.orch-l path{fill:none;stroke:var(--line2);stroke-width:1.2;vector-effect:non-scaling-stroke;transition:stroke .4s}
.orch-l path.on{stroke:var(--red);stroke-dasharray:6 6;animation:dash 1s linear infinite}@keyframes dash{to{stroke-dashoffset:-24}}
.orch-r{background:var(--dark);color:#fff;border-radius:18px;padding:18px;min-height:280px;display:flex;flex-direction:column}
.orch-r .vz-k{color:#8A9096}.orch-r>b{font:500 18px var(--disp);letter-spacing:-.02em}
.orch-c{list-style:none;margin:14px 0;padding:0;display:grid;gap:6px;flex:1;align-content:start}
.orch-c li{display:flex;justify-content:space-between;gap:8px;white-space:nowrap;font:12px var(--mono);color:#D6DADE;padding:8px 10px;border-radius:9px;background:#1A1D21;animation:rin .5s var(--ease) both}
.orch-c li em{font-style:normal;color:#7A8086}@keyframes rin{from{opacity:0;transform:translateY(6px)}}
.orch-s{display:flex;align-items:center;gap:10px;font-size:13px;color:#B4B9BE;border-top:1px solid var(--dline);padding-top:12px}
/* activity log */
.log{background:#0B0C0E;border-color:#23272B;color:#C9CED3;padding:0;font:12.5px/1.8 var(--mono)}
.log-h{display:flex;justify-content:space-between;padding:12px 16px;border-bottom:1px solid #23272B;color:#8A9096;font-size:12px;text-transform:uppercase;letter-spacing:.07em}
.live::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--mint);margin-right:8px;animation:blink 2s ease-in-out infinite}@keyframes blink{50%{opacity:.25}}
.log-b{height:330px;overflow:hidden;padding:12px 16px;position:relative}.log-b::after{content:"";position:absolute;inset:auto 0 0 0;height:70px;background:linear-gradient(transparent,#0B0C0E)}
.ln{opacity:0;transform:translateY(4px);transition:all .5s var(--ease);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ln.in{opacity:1;transform:none}
.ln .t{color:#6E747A}.ln .a{color:#fff}.ln .ok{color:var(--mint)}.ln .rv{color:#FF8A70}
/* logo assemble */
.asm{background:transparent;border:0;box-shadow:none;aspect-ratio:16/10;padding:0}.asm i{position:absolute;left:0;top:0;border-radius:3px;background:var(--red);opacity:.14;transition:transform 2.2s var(--ease),opacity 2s ease}
.asm i.t{background:var(--tint)}
/* console */
.cons{padding:0}.cons-t{display:flex;gap:7px;align-items:center;padding:12px 16px;border-bottom:1px solid var(--line)}.cons-t i{width:10px;height:10px;border-radius:50%;background:var(--line2)}.cons-t span{margin-left:10px;font:12px var(--mono);color:var(--soft)}
.cons-b{display:grid;grid-template-columns:214px 1fr;min-height:400px}
.cons-ag{background:var(--panel);padding:12px 10px;display:grid;gap:4px;align-content:start}
.cag{display:flex;align-items:center;gap:9px;padding:8px 9px;border-radius:10px;font-size:13px;transition:all .4s}.cag b{font-weight:500;flex:1}.cag s{text-decoration:none;font:12px var(--mono);color:var(--soft)}
.cag.on{background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.06)}.cag.on s{color:var(--red-t)}.cag.done s{color:var(--ok)}
.cons-m{padding:18px 20px}.cons-f{display:flex;align-items:center;gap:8px;border:1px solid var(--line2);border-radius:11px;padding:11px 13px;font-size:15px;min-height:46px}
.cur{width:1.5px;height:18px;background:var(--red);animation:blink 1s steps(1) infinite}
.cons-p{display:flex;gap:4px;margin:16px 0 6px}.cons-p i{flex:1;height:8px;border-radius:3px;background:var(--line);transition:background .25s}.cons-p i.f{background:var(--ink)}.cons-p i.r{background:var(--red)}
.cons-pl{font:12px var(--mono);color:var(--soft);min-height:16px}
.cons-r{margin-top:10px;display:grid;gap:7px}.cons-r div{display:grid;grid-template-columns:12px 1fr auto;gap:10px;align-items:center;padding:9px 12px;border-radius:10px;background:var(--panel);font-size:13.5px;opacity:0;transform:translateY(6px);transition:all .5s var(--ease)}
.cons-r div.in{opacity:1;transform:none}.cons-r i{width:9px;height:9px;border-radius:2.5px;display:block}.cons-r em{font-style:normal;font:12px var(--mono);color:var(--muted)}
.cons-s{margin-top:12px;display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;background:var(--dark);color:#fff;opacity:0;transition:opacity .6s}.cons-s.in{opacity:1}
.cons-s b{display:block;font-weight:500;font-size:14px}.cons-s em{display:block;font-style:normal;font:12px var(--mono);color:#B4B9BE}
/* agent spec card */
.agc{background:var(--panel);border-radius:22px;padding:30px;display:grid;grid-template-columns:120px 1fr;gap:26px;align-items:center}
.agc dl{margin:0;display:grid;gap:4px}.agc dt{font:500 12px var(--mono);text-transform:uppercase;letter-spacing:.07em;color:var(--red-t);margin-top:10px}.agc dt:first-child{margin-top:0}.agc dd{margin:0;font-size:15px;color:var(--ink2)}
/* flow */
.flow{padding:30px 26px}.flow ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:12px;position:relative;z-index:1}
.flow ol::before{content:"";position:absolute;left:8%;right:8%;top:22px;height:2px;background:var(--line);z-index:-1}
.fn{display:flex;flex-direction:column;gap:6px;align-items:flex-start;padding:0 4px}
.fk{display:inline-grid;place-items:center;height:44px;padding:0 14px;border-radius:12px;background:#fff;border:1px solid var(--line2);font:500 12px var(--mono);text-transform:uppercase;letter-spacing:.05em;animation:flight 8s var(--ease) infinite;animation-delay:calc(var(--i) * 1.6s)}
.fn.rec .fk{background:var(--dark);color:#fff;border-color:var(--dark)}
.fn b{font-weight:500;font-size:15px;margin-top:8px}.fn small{font-size:13px;color:var(--muted);line-height:1.45}.fi{display:flex;gap:4px;margin-top:4px}
@keyframes flight{0%,4%{box-shadow:none;border-color:var(--line2)}8%,18%{border-color:var(--red);box-shadow:0 0 0 5px rgba(255,48,9,.12)}26%,100%{box-shadow:none}}
.ftk{position:absolute;top:50px;left:8%;width:12px;height:12px;border-radius:3px;background:var(--red);animation:ftok 8s var(--ease) infinite}
@keyframes ftok{0%{left:8%;opacity:0}4%{opacity:1}80%{left:86%;opacity:1}90%,100%{left:86%;opacity:0}}
/* gate: a queue searched in one pass, results landing in two columns */
.gq{display:grid;grid-template-columns:1fr 1.15fr;gap:18px}
.gq-h{font:500 12px var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--soft);margin:0 0 8px}.gq-h.rvh{color:var(--red-t);margin-top:16px}
.gq-l{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.gq-l li{display:flex;justify-content:space-between;align-items:center;padding:9px 11px;border-radius:10px;background:var(--panel);font-size:13px;animation:gql 10s var(--ease) infinite;animation-delay:calc(var(--i) * .9s)}
.gq-t{width:14px;height:14px;border-radius:4px;border:1.5px solid var(--line2);flex:none;animation:gqt 10s var(--ease) infinite;animation-delay:calc(var(--i) * .9s)}
@keyframes gql{0%,2%{background:var(--panel)}5%{background:#fff;box-shadow:0 0 0 1.5px var(--ink)}10%,100%{background:var(--panel);box-shadow:none}}
@keyframes gqt{0%,6%{background:transparent;border-color:var(--line2)}9%,94%{background:var(--ink);border-color:var(--ink)}100%{background:transparent}}
.gq-ok,.gq-rv{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.gq-ok li{font-size:13px;padding:8px 11px;border-radius:10px;background:#E6F5EC;color:var(--ok);opacity:0;animation:gqin 10s var(--ease) infinite;animation-delay:calc(var(--i) * .9s + .5s)}
.gq-rv li{padding:9px 11px;border-radius:10px;background:#FFF4DE;opacity:0;animation:gqin 10s var(--ease) infinite;animation-delay:calc(var(--i) * .9s + .5s)}
.gq-rv li.bad{background:#FDECE8}.gq-rv b{display:block;font-weight:500;font-size:13px}.gq-rv span{display:block;font-size:12px;color:var(--muted);margin-top:2px}
@keyframes gqin{0%,4%{opacity:0;transform:translateX(-6px)}9%,94%{opacity:1;transform:none}100%{opacity:0}}
/* pulse */
.pl-svg{width:100%;height:auto;display:block}.pl-base{fill:none;stroke:var(--line);stroke-width:1}
.pl-line{fill:none;stroke:var(--ink);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:640;stroke-dashoffset:640;animation:pdraw 9s var(--ease) infinite}
@keyframes pdraw{0%{stroke-dashoffset:640}45%,92%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
.pl-dot{fill:var(--red);opacity:0;animation:pdot 9s infinite}@keyframes pdot{0%,30%{opacity:0}34%,92%{opacity:1}100%{opacity:0}}
.pl-days{display:flex;justify-content:space-between;font:12px var(--mono);color:var(--soft);margin:2px 0 14px}
.pl-alert{border:1px solid #FFD2C6;background:#FFF8F6;border-radius:14px;padding:14px 16px;opacity:0;transform:translateY(8px);animation:palert 9s var(--ease) infinite}
.pl-alert b{display:block;font:500 16px var(--disp);margin:8px 0 2px}.pl-alert p{color:var(--ink2);font-size:13.5px}.pl-alert em{display:block;font-style:normal;font-size:12.5px;color:var(--muted);margin-top:6px}
@keyframes palert{0%,40%{opacity:0;transform:translateY(8px)}48%,92%{opacity:1;transform:none}100%{opacity:0}}
.mb.bad{background:#FDECE8;color:var(--bad)}.mb.warn{background:#FFF4DE;color:var(--warn)}.mb.ok{background:#E6F5EC;color:var(--ok)}
/* quote */
.qt-doc{position:relative;background:var(--panel);border-radius:14px;padding:20px 18px}.qt-pg{position:absolute;right:14px;top:12px;font:12px var(--mono);color:var(--soft)}
.qt-l{display:grid;gap:9px;margin:6px 0}.qt-l i{display:block;height:7px;border-radius:4px;background:#DADDE0}
.qt-q{margin:14px 0;font-size:14.5px;line-height:1.6;color:var(--ink)}
.qt-q mark{background:linear-gradient(transparent 62%,rgba(255,48,9,.22) 62%) no-repeat;background-size:0 100%;color:inherit;animation:qmark 10s var(--ease) infinite}
@keyframes qmark{0%,5%{background-size:0 100%}30%,100%{background-size:100% 100%}}
.qt-tags{display:grid;gap:8px;margin-top:14px}.qt-tags span{font-size:13px;padding:8px 12px;border-radius:10px;opacity:0;animation:10s var(--ease) infinite}
.qt-ok{background:#E6F5EC;color:var(--ok);animation-name:qa!important}.qt-gap{background:#FFF4DE;color:var(--warn);animation-name:qb!important}.qt-drop{background:var(--panel);color:var(--soft);text-decoration:line-through;animation-name:qc!important}
@keyframes qa{0%,32%{opacity:0;transform:translateY(6px)}38%,94%{opacity:1;transform:none}100%{opacity:0}}
@keyframes qb{0%,46%{opacity:0;transform:translateY(6px)}52%,94%{opacity:1;transform:none}100%{opacity:0}}
@keyframes qc{0%,60%{opacity:0;transform:translateY(6px)}66%,94%{opacity:1;transform:none}100%{opacity:0}}
/* backtest */
.bt-c{position:relative;height:200px;border-bottom:1px solid var(--line2)}
.bt-bars{position:absolute;inset:0;display:flex;align-items:flex-end;gap:3px}.bt-bars i{flex:1;height:var(--h);border-radius:3px 3px 0 0;background:#D5D8DB;transition:background .5s}
.bt-bars i.hot{background:var(--red)}
.bt-th{position:absolute;left:0;right:0;bottom:65%;border-top:2px dashed var(--ink);transition:bottom 1.2s var(--ease)}.bt-th span{position:absolute;right:0;top:-24px;font:12px var(--mono);background:#fff;padding:2px 6px;border-radius:6px;color:var(--ink)}
.bt-x{display:flex;justify-content:space-between;font:12px var(--mono);color:var(--soft);margin-top:6px}
/* chain */
.ch-l{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.ch-l li{display:grid;grid-template-columns:48px 1fr auto;gap:10px;align-items:center;padding:11px 13px;border-radius:12px;border:1px solid var(--line);font-size:13.5px;animation:chin 10s var(--ease) infinite;animation-delay:calc(var(--i) * .7s)}
.ch-n{font:500 12px var(--mono);color:var(--red-t)}.ch-l code{font:12px var(--mono);color:var(--muted)}
@keyframes chin{0%,14%,100%{border-color:var(--line);box-shadow:none}5%{border-color:var(--red);box-shadow:0 0 0 3px rgba(255,48,9,.08)}}
.ch-v{margin-top:14px;background:var(--dark);border-radius:12px;padding:12px 14px;display:grid;gap:3px}
.ch-v code{font:12px var(--mono);color:#C9CED3}.ch-v b{color:var(--mint);font-weight:500;animation:chv 10s var(--ease) infinite}@keyframes chv{0%,48%,64%,100%{text-shadow:none}54%{text-shadow:0 0 10px rgba(127,214,204,.75)}}
/* industry check */
.ic-h{display:flex;gap:14px;align-items:center;margin-bottom:16px}.ic-h .vz-k{margin:0 0 4px}.ic-h b{font:500 18px var(--disp);letter-spacing:-.02em}
.ic ol{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.ic li{position:relative;display:flex;justify-content:space-between;gap:12px;align-items:center;padding:12px 14px;border-radius:12px;background:var(--panel)}
.ic li b{display:block;font-weight:500;font-size:14px}.ic li em{display:block;font-style:normal;font:12px var(--mono);color:var(--soft);margin-top:2px}
.ic-r{text-align:right;opacity:0;animation:icr 9s var(--ease) infinite;animation-delay:calc(var(--i) * 1.1s)}.ic-r small{display:block;font-size:12px;color:var(--muted);margin-top:5px}
.ic-w{position:absolute;right:16px;top:50%;display:flex;gap:4px;transform:translateY(-50%);animation:icw 9s infinite;animation-delay:calc(var(--i) * 1.1s)}.ic-w i{width:5px;height:5px;border-radius:50%;background:var(--soft)}
@keyframes icr{0%,12%{opacity:0;transform:translateY(4px)}18%,90%{opacity:1;transform:none}100%{opacity:0}}
@keyframes icw{0%,12%{opacity:1}16%,100%{opacity:0}}
.ic-f{font-size:12.5px;color:var(--muted);margin-top:14px}
/* embed */
.emb{padding:0}.emb-t{display:flex;gap:7px;align-items:center;padding:11px 14px;border-bottom:1px solid var(--line);background:#FAFAFA}.emb-t i{width:9px;height:9px;border-radius:50%;background:var(--line2)}.emb-t span{margin-left:8px;font:12px var(--mono);color:var(--soft)}
.emb-b{padding:22px}.emb-h{font:500 17px var(--disp);margin-bottom:14px}
.emb-f{display:grid;gap:5px;margin-bottom:12px}.emb-f label{font-size:12.5px;color:var(--muted)}.emb-f span{border:1px solid var(--line2);border-radius:10px;padding:10px 12px;font-size:14px}
.emb-w{margin-top:16px;border:1px solid var(--ink);border-radius:14px;padding:14px;opacity:0;transform:translateY(10px);animation:embw 9s var(--ease) infinite}
.emb-wh{display:flex;gap:10px;align-items:center;font:500 12px var(--mono);text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}.emb-wh .px3 i{background:var(--red)}
.emb-wr{display:flex;gap:10px;align-items:center;margin:10px 0;font-size:14px}.emb-w a{font-size:13.5px;font-weight:500}
@keyframes embw{0%,22%{opacity:0;transform:translateY(10px)}30%,92%{opacity:1;transform:none}100%{opacity:0}}
/* output stack (dark band): a cascade; back cards show only their header */
.os{background:transparent;border:0;box-shadow:none;height:400px;padding:0}
.os-c{position:absolute;left:calc(8% + (2 - var(--i)) * 4%);right:calc(8% + (2 - var(--i)) * 4%);top:calc(10% + var(--i) * 11%);background:hsl(210 6% calc(86% + var(--i) * 7%));color:var(--ink);border-radius:18px;padding:16px 18px;box-shadow:0 -10px 30px -16px rgba(0,0,0,.5),0 30px 60px -30px rgba(0,0,0,.6);animation:osw 9s ease-in-out infinite;animation-delay:calc(var(--i) * -1.5s)}
.os-c .mt{font:500 18px var(--disp);letter-spacing:-.03em;margin:10px 0 8px;color:var(--ink)}.os-c .mr span{color:var(--muted)}
.os-s{display:flex;gap:8px;align-items:center;font-size:12px;color:var(--muted);margin-top:10px}.os-s .px3 i{background:var(--red)}
@keyframes osw{50%{transform:translateY(-5px)}}
/* twinkle on dark bands */
.tw{position:absolute;pointer-events:none;z-index:0}.tw i{position:absolute;width:6px;height:6px;border-radius:1.5px;background:var(--red);opacity:0;transition:opacity 2.4s ease}.tw i.t{background:var(--tint)}
.band.d .panel{position:relative;overflow:clip}.band.d .panel>.w{position:relative;z-index:1}
@media (max-width:980px){
  .gq{grid-template-columns:1fr}
  .log{font-size:12px}.log-b{height:300px;padding:10px 12px}
  .orch{grid-template-columns:1fr;min-height:0}.orch-l{display:none}.orch-r{margin-top:14px;min-height:0}
  .cons-b{grid-template-columns:1fr}.cons-ag{grid-template-columns:1fr 1fr}
  .flow ol{grid-template-columns:1fr;gap:16px}.flow ol::before,.ftk{display:none}.fn{min-width:0;padding:0}.fn b{margin:4px 0 0}.fn small{display:block}
  .agc{grid-template-columns:1fr}.os{height:380px}
}
@media (prefers-reduced-motion:reduce){.vz *{animation:none!important;opacity:1!important;transform:none!important}.pl-line{stroke-dashoffset:0}.qt-q mark{background-size:100% 100%}.gq-t{background:var(--ink)}.ic-w{display:none!important}}
.rnd.bleed{position:relative;background:var(--panel);border-radius:24px;overflow:hidden;aspect-ratio:4/3;width:100%}
.rnd.bleed img{position:absolute;right:8%;bottom:-14%;height:122%;width:auto;max-width:none;max-height:none}
.agent>div{min-width:0}
.rnd.bleed.close img{height:140%;top:-20%;bottom:auto;right:3%}
/* output cards: one accent per category, from the palette (small elements only) */
.oc{--c:#FF3009;--ct:#C9290A;position:relative;overflow:hidden;background:radial-gradient(120% 90% at 100% 0%,color-mix(in srgb,var(--c) 9%,#fff) 0%,#fff 58%)}
.oc-business{--c:#1F5FE0;--ct:#1F4FB8}.oc-vendor{--c:#F2994A;--ct:#A9561A}.oc-docs{--c:#3FB8A6;--ct:#1E7A6C}.oc-programs{--c:#E9C23F;--ct:#8A6A00}
.oc::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--c);opacity:.85}
.oc-h{display:flex;align-items:center;gap:12px;margin-bottom:6px}.oc-h .ico{margin:0}
.oc .ck{color:var(--ct)!important;margin:0}
a.card.oc:hover{border-color:color-mix(in srgb,var(--c) 45%,#fff);box-shadow:0 18px 40px -26px color-mix(in srgb,var(--c) 55%,transparent)}
.band.g .oc{background:radial-gradient(120% 90% at 100% 0%,color-mix(in srgb,var(--c) 10%,#fff) 0%,#fff 58%)}
/* capability glyphs: one accent per agent page */
.gly{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:13px;color:var(--a);background:color-mix(in srgb,var(--a) 10%,#fff);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--a) 18%,#fff);margin-bottom:8px}
.gly svg{width:24px;height:24px}
.card:has(.gly) h3{margin-top:2px}
/* Home opening: live layers over the render */
.hx{display:flex;justify-content:center;perspective:1400px}
.hx-in{position:relative;width:min(100%,460px);aspect-ratio:1033/1448;transform-style:preserve-3d;transition:transform 1.2s var(--ease);animation:hxfloat 7s ease-in-out infinite}
.hx-in img{position:absolute;inset:0;width:100%;height:100%}
@keyframes hxfloat{50%{translate:0 -12px}}
.hx-pulse{position:absolute;left:47.4%;top:67.9%;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:#FF5A33;box-shadow:0 0 0 4px rgba(255,48,9,.18),0 0 18px 6px rgba(255,48,9,.55);animation:hxpulse 3.2s cubic-bezier(.5,0,.3,1) infinite}
@keyframes hxpulse{0%{left:47.4%;top:67.9%;opacity:0}10%{opacity:1}55%{left:60%;top:70.4%;opacity:1}65%,100%{left:60%;top:70.4%;opacity:0}}
.hx-sonar{position:absolute;left:71.4%;top:74%;width:26%;aspect-ratio:1;translate:-50% -50%;border-radius:50%;border:2px solid rgba(127,214,204,.8);opacity:0;animation:hxsonar 3.2s ease-out infinite;animation-delay:1.7s}
.hx-sonar.s2{animation-delay:2.3s}
@keyframes hxsonar{0%{scale:.92;opacity:.75}100%{scale:1.6;opacity:0}}
.hx-sheen{position:absolute;left:12.5%;top:23%;width:54%;height:34%;overflow:hidden;clip-path:polygon(1% 1%,99% 14%,97% 99%,3% 80%)}
.hx-sheen b{position:absolute;top:-30%;bottom:-30%;width:28%;left:-40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.75) 50%,transparent);transform:skewX(-14deg);animation:hxsheen 7s ease-in-out infinite;animation-delay:.6s}
@keyframes hxsheen{0%,62%{left:-40%}86%,100%{left:120%}}
.hx-px i{position:absolute;width:6.2%;aspect-ratio:1;translate:-50% -50%;border-radius:22%;background:radial-gradient(circle,rgba(255,120,90,.9),rgba(255,48,9,0) 70%);mix-blend-mode:screen;opacity:0;animation:hxpx 4.5s ease-in-out infinite;animation-delay:var(--d)}
@keyframes hxpx{0%,100%{opacity:0}18%{opacity:.95}40%{opacity:0}}
.hx-mark{position:absolute;left:26.6%;top:68.6%;width:5%;aspect-ratio:1;translate:-50% -50%;border-radius:50%;background:radial-gradient(circle,rgba(255,90,51,.7),rgba(255,48,9,0) 70%);animation:hxmark 3.2s ease-in-out infinite}
@keyframes hxmark{0%,100%{opacity:.2;scale:.8}10%{opacity:1;scale:1.25}30%{opacity:.2;scale:.8}}
@media (prefers-reduced-motion:reduce){.hx-in,.hx-in *{animation:none!important}.hx-pulse,.hx-sonar,.hx-px,.hx-mark,.hx-sheen{display:none}}
@media (max-width:980px){.hx-in{width:min(100%,360px)}}
/* Home opening: live product demo */
.hdemo{position:relative;background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:0 40px 90px -50px rgba(17,19,22,.45);overflow:hidden}
.hd-tabs{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line)}
.hd-tab{position:relative;text-align:left;background:#fff;border:0;border-right:1px solid var(--line);padding:14px 16px 16px;cursor:pointer;font-family:inherit}
.hd-tab:last-child{border-right:0}.hd-tab b{display:block;font:500 15px var(--disp);color:var(--muted);transition:color .3s}.hd-tab span{display:block;font-size:12px;color:var(--muted);margin-top:3px;line-height:1.35}
.hd-tab i{position:absolute;left:0;bottom:-1px;height:2px;width:0;background:var(--red)}
.hd-tab.on b{color:var(--ink)}.hd-tab.on span{color:var(--muted)}.hd-tab.on i{animation:hdprog var(--dur,9s) linear forwards}
@keyframes hdprog{to{width:100%}}
.hd-canvas{position:relative;height:470px;background-color:#F7F7F8;background-image:radial-gradient(#D9DCDF 1px,transparent 1.2px);background-size:16px 16px}
.hd-lines{position:absolute;inset:0;width:100%;height:100%}.hd-lines path{fill:none;stroke:#B8BDC2;stroke-width:1.4;vector-effect:non-scaling-stroke;stroke-dasharray:4 4;opacity:0;transition:opacity .4s}
.hd-lines path.on{opacity:1}.hd-lines path.hot{stroke:var(--red);stroke-dasharray:none;stroke-width:1.8}
.hd-n{position:absolute;left:33%;translate:-50% 0;width:42%;display:flex;gap:10px;align-items:center;background:#fff;border:1px solid var(--line2);border-radius:13px;padding:10px 12px;box-shadow:0 10px 24px -18px rgba(17,19,22,.4);opacity:0;transform:translateY(8px) scale(.98);transition:opacity .45s var(--ease),transform .45s var(--ease),border-color .4s,box-shadow .4s}
.hd-n.on{opacity:1;transform:none}.hd-n img{flex:none}.hd-n span{flex:1;min-width:0}
.hd-n em{display:block;font:500 12px var(--mono);font-style:normal;text-transform:uppercase;letter-spacing:.07em;color:var(--soft)}.hd-n b{display:block;font-weight:500;font-size:13.5px}.hd-n small{display:block;font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hd-in{top:5%}.hd-sc{top:25%}.hd-dr{top:45%}.hd-pd{top:65%;border-color:#FFC4B6}
.hd-ok,.hd-esc{top:87%;width:26%;padding:8px 12px}.hd-ok{left:18%}.hd-esc{left:48%}
.hd-st{width:16px;height:16px;border-radius:50%;flex:none;border:1.5px solid var(--line2);transition:all .3s}
.hd-n.run{border-color:var(--red);box-shadow:0 0 0 4px rgba(255,48,9,.1),0 10px 24px -18px rgba(17,19,22,.4)}.hd-n.run .hd-st{border-color:var(--red);border-top-color:transparent;animation:spin .8s linear infinite}
.hd-n.done .hd-st{background:var(--ok);border-color:var(--ok);box-shadow:inset 0 0 0 3px #fff}.hd-n.pick{border-color:var(--ok);box-shadow:0 0 0 4px rgba(30,122,85,.12)}
@keyframes spin{to{transform:rotate(360deg)}}
.hd-ai{position:absolute;right:3.5%;top:20%;width:36%;background:#fff;border:1px solid #FFC4B6;border-radius:14px;padding:12px 14px;box-shadow:0 18px 40px -26px rgba(255,48,9,.45);opacity:0;transform:translateY(8px);transition:all .5s var(--ease)}
.hd-ai.on{opacity:1;transform:none}.hd-ai-h{display:flex;align-items:center;gap:8px;font:500 12px var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--red-t);margin:0 0 6px}
.hd-ai-t{font-size:13px;line-height:1.5;color:var(--ink2);min-height:58px}.hd-ai-t::after{content:"";display:inline-block;width:1.5px;height:14px;background:var(--red);margin-left:2px;vertical-align:-2px;animation:blink 1s steps(1) infinite}
.hd-find{position:absolute;right:3.5%;top:27%;width:36%;background:#FFF8EC;border:1px solid #F3D9A8;border-radius:14px;padding:12px 14px;opacity:0;transform:translateX(10px);transition:all .5s var(--ease)}
.hd-find.on{opacity:1;transform:none}.hd-find b{display:block;font-weight:500;font-size:13.5px;margin-top:8px}.hd-find small{display:block;font-size:12px;color:var(--muted);margin-top:2px}
.hd-dec{position:absolute;right:3%;top:8%;width:37%;background:#fff;border:1px solid var(--line2);border-radius:16px;padding:16px;box-shadow:0 24px 50px -30px rgba(17,19,22,.5);opacity:0;transform:translateX(12px);transition:all .5s var(--ease)}
.hd-dec.on{opacity:1;transform:none}.hd-dec .mr{font-size:12.5px;padding:8px 0}.hd-dec .mr b{font-size:12.5px;max-width:58%}.hd-dec .mr b.ok{color:var(--ok)}
.hd-seal{margin-top:12px;display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:11px;background:var(--dark);color:#fff;opacity:0;transition:opacity .5s}.hd-seal.on{opacity:1}
.hd-seal b{display:block;font-weight:500;font-size:12.5px}.hd-seal em{display:block;font-style:normal;font:12px var(--mono);color:#B4B9BE}
.hd-watch{position:absolute;inset:5% 4% 25% 4%;opacity:0;pointer-events:none;transition:opacity .5s}.hd-watch.on{opacity:1}
.hd-kpi{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.hd-kpi div{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px}.hd-kpi b{display:block;font:500 24px var(--disp);letter-spacing:-.02em}.hd-kpi span{display:block;font-size:12px;color:var(--muted);margin-top:2px}
.hd-chart{display:block;width:100%;height:100px;margin-top:14px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px}
.hd-chart path{fill:none;stroke-width:2;vector-effect:non-scaling-stroke;stroke-dasharray:600;stroke-dashoffset:600}.hd-chart .c1{stroke:var(--red)}.hd-chart .c2{stroke:#7FD6CC}
.hd-watch.on .hd-chart path{animation:hdline 2.4s var(--ease) forwards}.hd-watch.on .hd-chart .c2{animation-delay:.4s}@keyframes hdline{to{stroke-dashoffset:0}}
.hd-bars{display:flex;align-items:flex-end;gap:6px;height:88px;margin-top:12px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px}
.hd-bars i{flex:1;height:0;border-radius:3px 3px 0 0;background:#E9ECEE;transition:height .9s var(--ease)}.hd-bars i:nth-child(10){background:var(--red)}
.hd-watch.on .hd-bars i{height:var(--h)}
.hdemo.watching .hd-n,.hdemo.watching .hd-lines{opacity:0!important;transition:opacity .4s}
@media (max-width:980px){.hd-tab span{display:none}.hd-canvas{height:440px}.hd-n{width:56%;left:34%}.hd-ai,.hd-find{width:40%}.hd-dec{width:60%}.hd-ok,.hd-esc{width:30%}}
@media (prefers-reduced-motion:reduce){.hd-tab.on i{animation:none;width:100%}}
/* the record render: sealing and chaining */
.rl-img{position:relative;width:min(100%,440px);aspect-ratio:1140/1448;margin:0 auto}.rl-img img{position:absolute;inset:0;width:100%;height:100%}
.rl-chain{position:absolute;left:19%;top:1%;width:66%;height:27%;overflow:hidden;clip-path:polygon(2% 0,96% 8%,100% 100%,0 100%)}
.rl-chain b{position:absolute;left:0;right:0;height:22%;top:-25%;background:linear-gradient(180deg,transparent,rgba(255,200,180,.55),transparent);mix-blend-mode:screen;animation:rlchain 6s ease-in-out infinite}
@keyframes rlchain{0%,8%{top:-25%}55%,100%{top:110%}}
.rr{position:absolute;left:19%;width:42%;height:4.4%;translate:0 -50%;rotate:3.2deg;overflow:hidden;border-radius:6px}
.rr::before{content:"";position:absolute;inset:0;width:40%;left:-45%;background:linear-gradient(90deg,transparent,rgba(255,90,51,.35),transparent);animation:rrsweep 6s ease-in-out infinite;animation-delay:var(--d)}
@keyframes rrsweep{0%{left:-45%}22%,100%{left:110%}}
.rl-ring{position:absolute;left:73.2%;top:72%;width:30%;aspect-ratio:1;translate:-50% -50%;border-radius:50%;background:conic-gradient(from 0deg,transparent 0 78%,rgba(255,220,200,.85) 86%,transparent 94%);-webkit-mask:radial-gradient(circle,transparent 52%,#000 54%,#000 66%,transparent 68%);mask:radial-gradient(circle,transparent 52%,#000 54%,#000 66%,transparent 68%);mix-blend-mode:screen;animation:rlspin 5.5s linear infinite}
@keyframes rlspin{to{rotate:360deg}}
.rl-img .hx-px i{width:5.6%}
@media (prefers-reduced-motion:reduce){.rl-chain,.rr,.rl-ring,.rl-img .hx-px{display:none}}
/* Home opening: live product demo */
.hdemo{position:relative;background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:0 40px 90px -50px rgba(17,19,22,.45);overflow:hidden}
.hd-tabs{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line)}
.hd-tab{position:relative;text-align:left;background:#fff;border:0;border-right:1px solid var(--line);padding:14px 16px 16px;cursor:pointer;font-family:inherit}
.hd-tab:last-child{border-right:0}.hd-tab b{display:block;font:500 15px var(--disp);color:var(--muted);transition:color .3s}.hd-tab span{display:block;font-size:12px;color:var(--muted);margin-top:3px;line-height:1.35}
.hd-tab i{position:absolute;left:0;bottom:-1px;height:2px;width:0;background:var(--red)}
.hd-tab.on b{color:var(--ink)}.hd-tab.on span{color:var(--muted)}.hd-tab.on i{animation:hdprog var(--dur,9s) linear forwards}
@keyframes hdprog{to{width:100%}}
.hd-canvas{position:relative;height:470px;background-color:#F7F7F8;background-image:radial-gradient(#D9DCDF 1px,transparent 1.2px);background-size:16px 16px}
.hd-lines{position:absolute;inset:0;width:100%;height:100%}.hd-lines path{fill:none;stroke:#B8BDC2;stroke-width:1.4;vector-effect:non-scaling-stroke;stroke-dasharray:4 4;opacity:0;transition:opacity .4s}
.hd-lines path.on{opacity:1}.hd-lines path.hot{stroke:var(--red);stroke-dasharray:none;stroke-width:1.8}
.hd-n{position:absolute;left:33%;translate:-50% 0;width:42%;display:flex;gap:10px;align-items:center;background:#fff;border:1px solid var(--line2);border-radius:13px;padding:10px 12px;box-shadow:0 10px 24px -18px rgba(17,19,22,.4);opacity:0;transform:translateY(8px) scale(.98);transition:opacity .45s var(--ease),transform .45s var(--ease),border-color .4s,box-shadow .4s}
.hd-n.on{opacity:1;transform:none}.hd-n img{flex:none}.hd-n span{flex:1;min-width:0}
.hd-n em{display:block;font:500 12px var(--mono);font-style:normal;text-transform:uppercase;letter-spacing:.07em;color:var(--soft)}.hd-n b{display:block;font-weight:500;font-size:13.5px}.hd-n small{display:block;font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hd-in{top:5%}.hd-sc{top:25%}.hd-dr{top:45%}.hd-pd{top:65%;border-color:#FFC4B6}
.hd-ok,.hd-esc{top:87%;width:26%;padding:8px 12px}.hd-ok{left:18%}.hd-esc{left:48%}
.hd-st{width:16px;height:16px;border-radius:50%;flex:none;border:1.5px solid var(--line2);transition:all .3s}
.hd-n.run{border-color:var(--red);box-shadow:0 0 0 4px rgba(255,48,9,.1),0 10px 24px -18px rgba(17,19,22,.4)}.hd-n.run .hd-st{border-color:var(--red);border-top-color:transparent;animation:spin .8s linear infinite}
.hd-n.done .hd-st{background:var(--ok);border-color:var(--ok);box-shadow:inset 0 0 0 3px #fff}.hd-n.pick{border-color:var(--ok);box-shadow:0 0 0 4px rgba(30,122,85,.12)}
@keyframes spin{to{transform:rotate(360deg)}}
.hd-ai{position:absolute;right:3.5%;top:20%;width:36%;background:#fff;border:1px solid #FFC4B6;border-radius:14px;padding:12px 14px;box-shadow:0 18px 40px -26px rgba(255,48,9,.45);opacity:0;transform:translateY(8px);transition:all .5s var(--ease)}
.hd-ai.on{opacity:1;transform:none}.hd-ai-h{display:flex;align-items:center;gap:8px;font:500 12px var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--red-t);margin:0 0 6px}
.hd-ai-t{font-size:13px;line-height:1.5;color:var(--ink2);min-height:58px}.hd-ai-t::after{content:"";display:inline-block;width:1.5px;height:14px;background:var(--red);margin-left:2px;vertical-align:-2px;animation:blink 1s steps(1) infinite}
.hd-find{position:absolute;right:3.5%;top:27%;width:36%;background:#FFF8EC;border:1px solid #F3D9A8;border-radius:14px;padding:12px 14px;opacity:0;transform:translateX(10px);transition:all .5s var(--ease)}
.hd-find.on{opacity:1;transform:none}.hd-find b{display:block;font-weight:500;font-size:13.5px;margin-top:8px}.hd-find small{display:block;font-size:12px;color:var(--muted);margin-top:2px}
.hd-dec{position:absolute;right:3%;top:8%;width:37%;background:#fff;border:1px solid var(--line2);border-radius:16px;padding:16px;box-shadow:0 24px 50px -30px rgba(17,19,22,.5);opacity:0;transform:translateX(12px);transition:all .5s var(--ease)}
.hd-dec.on{opacity:1;transform:none}.hd-dec .mr{font-size:12.5px;padding:8px 0}.hd-dec .mr b{font-size:12.5px;max-width:58%}.hd-dec .mr b.ok{color:var(--ok)}
.hd-seal{margin-top:12px;display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:11px;background:var(--dark);color:#fff;opacity:0;transition:opacity .5s}.hd-seal.on{opacity:1}
.hd-seal b{display:block;font-weight:500;font-size:12.5px}.hd-seal em{display:block;font-style:normal;font:12px var(--mono);color:#B4B9BE}
.hd-watch{position:absolute;inset:5% 4% 25% 4%;opacity:0;pointer-events:none;transition:opacity .5s}.hd-watch.on{opacity:1}
.hd-kpi{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.hd-kpi div{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px}.hd-kpi b{display:block;font:500 24px var(--disp);letter-spacing:-.02em}.hd-kpi span{display:block;font-size:12px;color:var(--muted);margin-top:2px}
.hd-chart{display:block;width:100%;height:100px;margin-top:14px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px}
.hd-chart path{fill:none;stroke-width:2;vector-effect:non-scaling-stroke;stroke-dasharray:600;stroke-dashoffset:600}.hd-chart .c1{stroke:var(--red)}.hd-chart .c2{stroke:#7FD6CC}
.hd-watch.on .hd-chart path{animation:hdline 2.4s var(--ease) forwards}.hd-watch.on .hd-chart .c2{animation-delay:.4s}@keyframes hdline{to{stroke-dashoffset:0}}
.hd-bars{display:flex;align-items:flex-end;gap:6px;height:88px;margin-top:12px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px}
.hd-bars i{flex:1;height:0;border-radius:3px 3px 0 0;background:#E9ECEE;transition:height .9s var(--ease)}.hd-bars i:nth-child(10){background:var(--red)}
.hd-watch.on .hd-bars i{height:var(--h)}
.hdemo.watching .hd-n,.hdemo.watching .hd-lines{opacity:0!important;transition:opacity .4s}
@media (max-width:980px){.hd-tab span{display:none}.hd-canvas{height:440px}.hd-n{width:56%;left:34%}.hd-ai,.hd-find{width:40%}.hd-dec{width:60%}.hd-ok,.hd-esc{width:30%}}
@media (prefers-reduced-motion:reduce){.hd-tab.on i{animation:none;width:100%}}
/* the record render, explained */
.rl{display:grid;grid-template-columns:1fr;gap:18px}
.rl-img{position:relative;width:min(100%,400px);aspect-ratio:1140/1448;margin:0 auto}.rl-img img{position:absolute;inset:0;width:100%;height:100%}
.rl-m{position:absolute;translate:-50% -50%;width:30px;height:30px;border:0;padding:0;border-radius:9px;background:#fff;color:var(--ink);font:500 12px var(--mono);cursor:pointer;box-shadow:0 6px 18px -6px rgba(0,0,0,.45);transition:background .3s,color .3s,scale .3s}
.rl-m::after{content:"";position:absolute;inset:-6px;border-radius:12px;border:2px solid var(--red);opacity:0}
.rl-m.on{background:var(--red);color:#fff;scale:1.12}.rl-m.on::after{animation:rlring 1.6s ease-out infinite}
@keyframes rlring{0%{opacity:.8;inset:-2px}100%{opacity:0;inset:-12px}}
.rl-l{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.rl-l li{display:grid;grid-template-columns:30px 1fr;gap:12px;align-items:start;padding:10px 12px;border-radius:12px;font-size:14px;color:var(--muted);cursor:default;transition:background .3s,color .3s}
.rl-l b{display:block;font-weight:500;color:var(--ink);font-size:14.5px}
.rl-n{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:7px;background:var(--panel);font:500 12px var(--mono);color:var(--muted);transition:all .3s}
.rl-l li.on{background:#fff;box-shadow:0 12px 30px -20px rgba(17,19,22,.35);color:var(--ink2)}.rl-l li.on .rl-n{background:var(--red);color:#fff}
@media (prefers-reduced-motion:reduce){.rl-m.on::after{animation:none}}
/* Home opening: the layered workspace */
.hl{display:flex;justify-content:center}
.hl-in{position:relative;width:min(100%,470px)}
.hl-l{position:absolute;inset:0;will-change:transform,opacity}.hl-f{position:absolute;inset:0;animation:hlfloat 7s ease-in-out infinite;animation-delay:calc(var(--fd) * -1)}
.hl-l img,.hl-all{position:absolute;inset:0;width:100%;height:100%}
.hl-all{visibility:hidden}
@keyframes hlfloat{50%{translate:0 -6px}}
.hl-p0 .hl-f,.hl-p1 .hl-f,.hl-p2 .hl-f{animation-duration:9s}
.hl-chart .hl-f,.hl-ring .hl-f{animation-duration:6s}
.hl-card .hl-f{animation-duration:5.5s}
.hl-card .hx-sheen{left:12.5%;top:23%;width:54%;height:34%}
.hl-card img{filter:drop-shadow(0 18px 24px rgba(17,19,22,.28))}.hl-chart img,.hl-ring img{filter:drop-shadow(0 14px 18px rgba(17,19,22,.3))}
.hl-trace img{clip-path:inset(0 100% 0 0);transition:clip-path 1.1s var(--ease)}.hl.built .hl-trace img{clip-path:inset(0 0 0 0)}
.hl-card.lift{transition:transform .9s var(--ease)}
.hl-pulse{position:absolute;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:#FF5A33;box-shadow:0 0 0 4px rgba(255,48,9,.18),0 0 18px 6px rgba(255,48,9,.55);opacity:0;pointer-events:none}
.hl-sonar{position:absolute;width:26%;aspect-ratio:1;translate:-50% -50%;border-radius:50%;border:2px solid rgba(127,214,204,.85);opacity:0;pointer-events:none}
.hl.ping .hl-pulse{animation:hlpulse 1.6s cubic-bezier(.5,0,.3,1) forwards}
.hl.ping .hl-sonar{animation:hxsonar 2.2s ease-out .9s forwards}.hl.ping .hl-sonar.s2{animation-delay:1.4s}
@keyframes hlpulse{0%{left:var(--x0);top:var(--y0);opacity:0}12%{opacity:1}75%{left:var(--x1);top:var(--y1);opacity:1}100%{left:var(--x1);top:var(--y1);opacity:0}}
@media (max-width:980px){.hl-in{width:min(100%,360px)}}
@media (prefers-reduced-motion:reduce){.hl-f{animation:none}.hl-trace img{clip-path:none}.hl-pulse,.hl-sonar{display:none}}
.open.split:has(.hl){overflow-x:clip}
.hd-n em{color:var(--muted)!important}

/* ---------- Home opening: the OS block, opened by scrolling ---------- */
.hq{position:relative;height:260vh}
.hq-pin{position:sticky;top:72px;height:calc(100vh - 72px);min-height:620px;display:flex;align-items:center}
.hq-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:40px;align-items:center;width:100%}
.hq-v{margin:0;display:flex;flex-direction:column;align-items:center}
.hq-s{position:relative;width:min(100%,calc((100vh - 200px) * var(--ar,.85)),600px);-webkit-mask-image:linear-gradient(#000 calc(100% - var(--m,0%)),transparent);mask-image:linear-gradient(#000 calc(100% - var(--m,0%)),transparent)}
.hq-s img,.hq-s canvas{position:absolute;inset:0;width:100%;height:100%}
.hq-cv{opacity:0}.hq.drawn .hq-cv{opacity:1}.hq.drawn .hq-f0{visibility:hidden}
.hq-cap{position:relative;margin-top:8px;display:grid;justify-items:center;gap:10px;font:500 14px var(--body);color:var(--muted)}
.hq-cap i{display:block;width:120px;height:3px;border-radius:2px;background:var(--line);overflow:hidden}
.hq-cap i b{display:block;height:100%;background:var(--red);transform-origin:left;transform:scaleX(var(--p,0))}
.hq-cap span{grid-area:2/1;opacity:0;transform:translateY(6px);transition:opacity .45s var(--ease),transform .45s var(--ease)}
.hq-cap span.on{opacity:1;transform:none}
.hq.static{height:auto}.hq.static .hq-pin{position:relative;top:0;height:auto;min-height:0;padding:56px 0 48px}
@media (max-width:980px){.hq-g{grid-template-columns:1fr;gap:28px}.hq-s{width:min(100%,420px)}}
/* ---------- The review moment: a finding travels to a person, who decides; the record seals ---------- */
.vz.rq{background:none;border:0;padding:0;box-shadow:none;overflow:visible;border-radius:0;max-width:540px;margin-left:auto}
.rq-k{display:flex;justify-content:space-between;font:500 12.5px var(--mono);color:#8A9198;margin:0 0 12px}.vz.rq .rq-n{color:#FF8A70;background:rgba(255,74,34,.12)!important;padding:2px 8px;border-radius:999px}
.rq-stack{list-style:none;margin:0;padding:0;position:relative;height:118px}
.rq-f{position:absolute;left:0;right:0;top:0;display:flex;gap:16px;align-items:center;padding:14px 18px 14px 14px;border-radius:18px;
  background:linear-gradient(180deg,#1F2226,#17191C);box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 0 0 1px rgba(255,255,255,.05),0 20px 40px -22px rgba(0,0,0,.9);
  transition:transform .7s var(--ease),opacity .7s var(--ease);transform-origin:50% 0}
.rq-f .ico{width:56px;height:56px;flex:none}
.rq-f em{display:block;font:500 12px var(--mono);font-style:normal;color:#8A9198}.rq-f b{display:block;font:600 15.5px/1.3 var(--body);color:#fff;margin-top:2px}
.rq-f span{display:block;font-size:13px;color:#9AA1A8;margin-top:2px}
.rq-f>*{transition:opacity .45s}.rq-f.p1>*,.rq-f.p2>*,.rq-f.p3>*{opacity:0}
.rq-f.p0{z-index:4}.rq-f.p1{z-index:3;transform:translateY(14px) scale(.95);background:#15171A}.rq-f.p2{z-index:2;transform:translateY(26px) scale(.9);background:#111315}
.rq-f.p3{z-index:1;transform:translateY(34px) scale(.86);opacity:0}
.rq-f.go{transform:translateY(150px) scale(.92);opacity:0;z-index:5}
.rq-tr{position:relative;height:56px;margin:4px 0 4px 44px;width:2px}
.rq-tr b{position:absolute;left:0;top:8px;bottom:8px;width:2px;background:linear-gradient(#3A3F45,#FF3009 50%,#3A3F45)}
.rq-nd{position:absolute;left:-4px;width:10px;height:10px;border-radius:3px;background:#2B2F35;box-shadow:0 0 0 2px #FF3009}.rq-nd:first-child{top:0}.rq-nd:nth-child(3){bottom:0}
.rq-pl{position:absolute;left:-5px;top:0;width:12px;height:12px;border-radius:50%;background:#FF5A33;box-shadow:0 0 14px 4px rgba(255,74,34,.6);opacity:0}
.rq.run .rq-pl{animation:rqpl .8s var(--ease)}
@keyframes rqpl{0%{opacity:0;transform:translateY(0)}15%{opacity:1}85%{opacity:1}100%{opacity:0;transform:translateY(44px)}}
.rq-dec{padding:18px 20px;border-radius:20px;background:linear-gradient(180deg,#22262A,#191C1F);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 0 0 1px rgba(255,255,255,.06),0 30px 60px -30px rgba(0,0,0,.9)}
.rq-h{display:flex;align-items:center;gap:12px}.rq-av{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#FFC4B6;color:#141414;font:600 13px var(--body);flex:none}
.rq-h b{display:block;font:600 14.5px var(--body);color:#fff}.rq-h div span{display:block;font-size:12.5px;color:#8A9198}
.rq-st{margin-left:auto;font:500 12px var(--mono);color:#8A9198;padding:4px 9px;border-radius:999px;box-shadow:inset 0 0 0 1px #3A3F45}
.rq-t{margin:16px 0 0;font:600 17px/1.35 var(--body);color:#fff;transition:opacity .35s}.rq-t.fade{opacity:0}
.rq-btn{display:flex;gap:10px;margin-top:14px}.rq-btn span{flex:1;text-align:center;font:600 13.5px var(--body);padding:10px;border-radius:12px;color:#C9CED3;box-shadow:inset 0 0 0 1px #3A3F45;transition:all .35s}
.rq-btn span[data-b="clear"].pick{background:#7FD6CC;color:#0E2A27;box-shadow:none}.rq-btn span[data-b="esc"].pick{background:#FF3009;color:#fff;box-shadow:none}
.rq-r{margin:14px 0 0;min-height:22px;font-size:13.5px;color:#C9CED3}.rq-r span{font:500 12px var(--mono);color:#8A9198;margin-right:10px}.rq-r em{font-style:normal}
.rq-seal{display:flex;align-items:center;gap:10px;margin-top:14px;padding-top:14px;border-top:1px solid #2B2F35;font-size:13px;color:#8A9198}
.rq-seal code{margin-left:auto;font:12px var(--mono);color:#8A9198}
.rq-px{display:inline-flex;gap:3px}.rq-px i{width:9px;height:9px;border-radius:2px;background:#2B2F35;transition:background .3s}
.rq.sealed .rq-px i{background:#FF3009}.rq.sealed .rq-px i:first-child{background:#FFC4B6}.rq.sealed .rq-sn{color:#fff}
@media (max-width:980px){.vz.rq{margin:0}}
.rq-f>div{flex:1;min-width:0;text-align:left;margin:0}.rq-f.p1,.rq-f.p2{box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 0 0 1px rgba(255,255,255,.06)}
/* review moment, refined (owner 2026-10-19): breathing room on the left, and a clean trace centred under the agent icon */
.vz.rq .rq-stack .rq-f{gap:18px;padding:16px 22px 16px 26px}
.rq-tr{margin:6px 0 6px 53px;height:60px}
.rq-tr b{top:5px;bottom:5px;width:2px;background:linear-gradient(#FF3009,rgba(255,48,9,.45) 50%,#FF3009)}
.rq-nd{left:-4px;width:10px;height:10px;border-radius:3px;background:#FF3009;box-shadow:0 0 10px rgba(255,48,9,.55)}
.rq-pl{left:-4px;width:10px;height:10px}
/* ---------- Home, the record: the examiner asks, the record answers ---------- */
.vz.rs{padding:22px 24px 20px}
.rs-q{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:16px;background:var(--panel)}
.rs-ex{flex:none;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#14171A;color:#fff;font:600 12px var(--mono)}
.rs-q em{display:block;font:500 12px var(--mono);font-style:normal;color:var(--muted)}.rs-qt{display:block;font:600 16px/1.35 var(--body);color:var(--ink);min-height:22px;margin-top:2px}
.rs-hd{display:flex;justify-content:space-between;align-items:center;margin:18px 0 6px;font:500 12.5px var(--mono);color:var(--muted)}
.rs-ch{color:#17675E;background:#E6F6F3;padding:3px 9px;border-radius:999px}
.rs-tl{list-style:none;margin:0;padding:0;position:relative}
.rs-line{position:absolute;left:66px;top:18px;width:2px;height:calc((100% - 36px) * var(--n,0) / 5);background:linear-gradient(#FF3009,#FF6A47);transition:height .6s cubic-bezier(.22,1,.36,1);border-radius:2px}
.rs-tl::before{content:"";position:absolute;left:66px;top:18px;bottom:18px;width:2px;background:var(--line)}
.rs-tl li{display:grid;grid-template-columns:48px 14px 1fr;gap:10px;align-items:center;padding:7px 0;opacity:.18;transform:translateX(10px);transition:opacity .5s,transform .5s cubic-bezier(.22,1,.36,1)}
.rs-tl li.on{opacity:1;transform:none}
.rs-t{font:500 12px var(--mono);color:var(--muted);text-align:right}
.rs-n{position:relative;z-index:1;display:grid;place-items:center}.rs-n i{width:12px;height:12px;border-radius:3px;background:#fff;box-shadow:0 0 0 2px var(--line);transition:all .35s}
.rs-tl li.sealed .rs-n i{background:#FF3009;box-shadow:0 0 0 3px #FFE1D8,0 0 12px rgba(255,48,9,.45)}
.rs-tl li:nth-child(odd).sealed .rs-n i{background:#FF3009}.rs-tl li:last-of-type.sealed .rs-n i{background:#FFC4B6}
.rs-b{display:grid;grid-template-columns:30px 1fr auto;gap:12px;align-items:center;padding:10px 12px;border-radius:14px;background:#fff;box-shadow:0 0 0 1px var(--line)}
.rs-b .ico{width:30px;height:30px}.rs-av{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#FFC4B6;color:#14171A;font:600 12px var(--body)}
.rs-b b{display:block;font:600 14px/1.3 var(--body);color:var(--ink)}.rs-b span{display:block;font-size:12.5px;color:var(--muted);margin-top:1px}
.rs-b code{font:500 12px var(--mono);color:var(--muted);background:var(--panel);padding:3px 7px;border-radius:7px;transition:color .3s}
.rs-tl li.sealed .rs-b code{color:#C9290A}
.rs-rp{display:flex;align-items:center;gap:12px;margin-top:14px;padding:12px 14px;border-radius:14px;background:var(--panel)}
.rs-sw{width:36px;height:20px;border-radius:999px;background:#D3D6D9;position:relative;transition:background .35s}.rs-sw i{position:absolute;left:2px;top:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:left .35s cubic-bezier(.22,1,.36,1)}
.rs.replay .rs-sw{background:#FF3009}.rs.replay .rs-sw i{left:18px}
.rs-rp b{font:600 14px var(--body)}.rs-rr{margin-left:auto;font:500 12.5px var(--mono);color:var(--muted);opacity:0;transform:translateX(-6px);transition:all .5s}
.rs.replay .rs-rr{opacity:1;transform:none;color:#17675E}
@media (max-width:560px){.rs-b{grid-template-columns:30px 1fr}.rs-b code{display:none}.rs-tl li{grid-template-columns:40px 14px 1fr}.rs-line,.rs-tl::before{left:58px}}
.rs-b .rs-av{display:grid;place-items:center;margin:0;font:600 12px var(--body);color:#14171A}
/* record scene, benchmark pass: depth, a living chain, a replay that re-verifies */
.rs-stage{position:relative;padding:34px 30px 30px 18px;perspective:1400px;isolation:isolate}
.rs-stage::before{content:"";position:absolute;inset:0;z-index:-2;border-radius:28px;
  background:radial-gradient(60% 50% at 18% 8%,rgba(255,64,24,.10),transparent 70%),radial-gradient(55% 45% at 92% 96%,rgba(79,127,230,.10),transparent 70%),
             url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20'%3E%3Crect x='9' y='9' width='2.4' height='2.4' rx='.4' fill='%2314171A' fill-opacity='.06'/%3E%3C/svg%3E"),#F6F6F7}
.rs-ghost{position:absolute;z-index:-1;left:10%;right:2%;top:20px;bottom:60px;border-radius:24px;background:#fff;box-shadow:0 0 0 1px var(--line),0 20px 40px -30px rgba(20,22,26,.35)}
.rs-ghost.g1{transform:translate(22px,-14px) rotate(2deg);opacity:.75}.rs-ghost.g2{transform:translate(42px,-26px) rotate(3.6deg);opacity:.45}
.vz.rs{transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .5s cubic-bezier(.22,1,.36,1);border-radius:24px;
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 0 0 1px rgba(20,22,26,.06),0 30px 60px -30px rgba(20,22,26,.45),0 10px 22px -16px rgba(20,22,26,.25)}
.rs-pulse{position:absolute;left:61px;top:0;width:12px;height:12px;border-radius:50%;background:#FF5A33;box-shadow:0 0 14px 4px rgba(255,74,34,.6);opacity:0;z-index:2;pointer-events:none}
.rs-pulse.go{animation:rspl .7s cubic-bezier(.22,1,.36,1)}
@keyframes rspl{0%{opacity:0;transform:translateY(-34px) scale(.6)}35%{opacity:1}100%{opacity:0;transform:none scale(1.6)}}
.rs-tl li.flash .rs-b{box-shadow:0 0 0 1.5px #FF3009,0 8px 24px -12px rgba(255,48,9,.45)}
.rs-tl li.flash .rs-n i{animation:rsrip .7s ease-out}
@keyframes rsrip{0%{box-shadow:0 0 0 3px #FFE1D8,0 0 0 0 rgba(255,48,9,.5)}100%{box-shadow:0 0 0 3px #FFE1D8,0 0 0 14px rgba(255,48,9,0)}}
.rs-b{transition:box-shadow .5s}
.rs-tl li.match .rs-b code{color:#17675E;background:#E6F6F3}
.rs-tl li.match .rs-b code::after{content:" \2713"}
.rs-scan{position:absolute;left:22px;right:22px;top:118px;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,#7FD6CC,transparent);box-shadow:0 0 14px 2px rgba(127,214,204,.6);opacity:0;pointer-events:none}
.rs.scan .rs-scan{animation:rsscan 1.6s cubic-bezier(.45,0,.2,1)}
@keyframes rsscan{0%{opacity:0;top:118px}10%{opacity:1}90%{opacity:1}100%{opacity:0;top:calc(100% - 90px)}}
@media (prefers-reduced-motion:reduce){.vz.rs{transform:none}.rs-pulse,.rs-scan{display:none}}
@media (max-width:560px){.rs-stage{padding:22px 10px 18px 6px}.rs-ghost{display:none}.rs-pulse{left:53px}}
/* record scene, cleaned up: one card, no ghosts or tinted backdrop; wide on the Evidence page */
.rs-stage{padding:0}.rs-stage::before{display:none}.rs-ghost{display:none}
.rs-wide{max-width:680px;margin:0 auto}
.rs-rr{white-space:nowrap}
.rs-b b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* ---------- Home, the record: "Verified offline" (spec: visual_library/specs/home_record.md) ---------- */
.vg-st{position:relative;padding:46px 34px;border-radius:28px;isolation:isolate;overflow:hidden;background:#0B0D10;box-shadow:0 40px 80px -40px rgba(11,13,16,.6)}
.vg-st::before{content:"";position:absolute;inset:-20%;z-index:-2;background:radial-gradient(35% 30% at 18% 14%,rgba(255,64,24,.26),transparent 70%),radial-gradient(35% 32% at 86% 88%,rgba(31,95,224,.30),transparent 70%),radial-gradient(30% 28% at 78% 18%,rgba(185,167,242,.16),transparent 70%),radial-gradient(28% 26% at 20% 90%,rgba(127,214,204,.14),transparent 70%);animation:vgdrift 18s ease-in-out infinite alternate}
.vg-st::after{content:"";position:absolute;inset:0;z-index:-1;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20'%3E%3Crect x='9' y='9' width='2.4' height='2.4' rx='.4' fill='%23FFFFFF' fill-opacity='.07'/%3E%3C/svg%3E")}
@keyframes vgdrift{0%{transform:translate(0,0) rotate(0)}100%{transform:translate(3%,-2%) rotate(6deg)}}
.vg-px{position:absolute;right:22px;top:16px;display:grid;grid-template-columns:repeat(3,9px);grid-template-rows:repeat(3,9px);gap:2px}
.vg-px i{border-radius:2px;background:#FF3009;box-shadow:0 0 10px rgba(255,48,9,.55)}
.vg-px i:nth-child(1){grid-area:1/1;background:#FFC4B6;box-shadow:0 0 8px rgba(255,196,182,.4)}.vg-px i:nth-child(2){grid-area:1/2}.vg-px i:nth-child(3){grid-area:2/2}.vg-px i:nth-child(4){grid-area:2/3}.vg-px i:nth-child(5){grid-area:3/3;background:#FFC4B6;box-shadow:0 0 8px rgba(255,196,182,.4)}
.vz.vg{border:0;max-width:540px;margin:0 auto;padding:26px 30px 22px;border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.025));backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),inset 0 0 0 1px rgba(255,255,255,.06),0 30px 60px -30px rgba(0,0,0,.8);color:#F4F5F6}
.vg-h{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-bottom:18px;border-bottom:1px solid rgba(255,255,255,.08)}
.vg-id{display:flex;align-items:center;gap:14px}
.vg-id .ico{width:40px;height:40px;flex:none}
.vg-id>span{display:grid;gap:3px}
.vg-id b{font:600 16px var(--disp);color:#fff}
.vg-id code{font:500 12.5px var(--mono);color:#9AA1A7;white-space:nowrap}.vg-id code em{font-style:normal}
.vg-pill{font:600 12.5px var(--body);padding:5px 11px;border-radius:999px;background:rgba(255,255,255,.08);color:#E6E8EA;transition:background .3s,color .3s;white-space:nowrap}
.vg-pill.ok{background:rgba(127,214,204,.14);color:#8FE3D9}.vg-pill.bad{background:rgba(255,48,9,.18);color:#FF8A6A}
.vg-ring{position:relative;height:320px;margin:0 -10px}
.vg-ring canvas{position:absolute;inset:0;width:100%;height:100%}
.vg-ctr{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;justify-items:center;gap:2px;text-align:center;pointer-events:none}
.vg-ctr>div{grid-area:1/1;display:grid;justify-items:center;gap:3px;transition:opacity .45s,transform .45s cubic-bezier(.22,1,.36,1)}
.vg-n{font:600 42px/1 var(--disp);color:#fff;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.vg-ctr span{font:500 12.5px var(--body);color:#9AA1A7;white-space:nowrap}
.vg-ctr code{font:500 12px var(--mono);color:#8A9096;margin-top:6px}
.vg-ok b{display:inline-flex;align-items:center;gap:6px}
.vg-bad{opacity:0;transform:scale(.94)}
.vg-bad b{font:600 26px/1.1 var(--disp);color:#FF6A45}
.vg-bad span{color:#E6E8EA;font-weight:600}
.vg-bad code{color:#FF8A6A}.vg-bad s{color:#6B7177}
.vg.broken .vg-ok{opacity:0;transform:scale(.94)}.vg.broken .vg-bad{opacity:1;transform:none}
.vg-f{display:flex;align-items:center;justify-content:center;gap:12px;padding-top:16px;border-top:1px solid rgba(255,255,255,.08)}
.vg-lg{display:flex;gap:16px;font:400 12px var(--body);color:#9AA1A7}
.vg-lg span{display:flex;align-items:center;gap:7px}.vg-lg i{width:8px;height:8px;border-radius:2px;background:var(--c);box-shadow:0 0 6px var(--c)}
.k0{--c:#1F5FE0}.k1{--c:#F5CF6A}.k2{--c:#B9A7F2}.k3{--c:#7FD6CC}
.vg-f code{font:500 12px var(--mono);color:#8A9096;white-space:nowrap}
@media (max-width:560px){.vg-st{padding:48px 12px 30px;margin:0 -4px}.vg-px{right:14px;top:12px}.vg-bad span{font-size:12px}.vz.vg{padding:22px 18px}.vg-ring{height:290px}.vg-lg{gap:12px;flex-wrap:wrap}.vg-f code{display:none}.vg-id b{font-size:15px}.vg-id code em{display:none}.vg-n{font-size:36px}}
@media (prefers-reduced-motion:reduce){.vg-st::before{animation:none}}
/* Document review opener: the brief assembles from the document */
.vz.db{max-width:580px;margin:0 auto;padding:26px 28px 22px;border-radius:22px;position:relative;overflow:visible}
.db-h{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.db-id{display:flex;align-items:center;gap:12px}.db-id .ico{width:36px;height:36px;flex:none}
.db-id>span{display:grid;gap:2px}.db-id b{font:600 15.5px var(--disp);color:var(--ink)}.db-id code{font:500 12px var(--mono);color:var(--muted)}
.db-pill{font:600 12.5px var(--body);padding:5px 11px;border-radius:999px;background:#F2F3F4;color:#14171A;white-space:nowrap;transition:background .3s,color .3s}
.db-pill.ok{background:#E6F6F3;color:#17675E}
.db-b{display:grid;grid-template-columns:148px 1fr;gap:24px;margin-top:20px;align-items:start}
.db-doc{display:grid;gap:8px;justify-items:center}
.db-pg{position:relative;width:148px;height:196px;border-radius:10px;background:#fff;box-shadow:0 0 0 1px #E3E6E8,0 10px 24px -14px rgba(20,22,26,.35),6px 6px 0 -1px #F1F2F3,6px 6px 0 0 #E3E6E8;padding:18px 14px;overflow:hidden}
.db-ln{display:grid;gap:7px}.db-ln i{display:block;height:4px;border-radius:2px;background:#E4E7EA;transition:background .3s}
.db-ln i.hl{background:#FFB8A6}
.db-band{position:absolute;left:0;right:0;top:0;height:30px;background:linear-gradient(180deg,transparent,rgba(31,95,224,.10),transparent);transform:translateY(var(--y,-40px));pointer-events:none}
.db-no{margin:0;font:500 12px var(--mono);color:var(--muted)}.db-no b{font-weight:500;color:var(--ink)}
.db-k{margin:0 0 8px;font:500 12px var(--mono);color:var(--muted)}
.db-list ol{list-style:none;margin:0;padding:0;display:grid}
.db-list li{display:grid;grid-template-columns:10px 1fr;gap:12px;padding:10px 0;border-top:1px solid #EEF0F1;align-items:start}
.db-list li:first-child{border-top:0;padding-top:2px}
.db-dot{width:9px;height:9px;border-radius:3px;margin-top:5px;background:#D5D9DC;transition:background .3s,box-shadow .3s}
.db-list b{display:block;font:500 14px var(--body);color:var(--ink)}
.db-list q{display:block;quotes:none;font:italic 400 13px/1.45 var(--body);color:#3A4046;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:3px}
.db-m{display:flex;align-items:center;gap:8px;margin-top:5px;flex-wrap:wrap}
.db-m code{font:500 12px var(--mono);color:#14171A;background:#F2F3F4;border-radius:6px;padding:2px 7px}
.db-m em{font-style:normal;font:500 12.5px var(--body)}
.db-w{display:none;text-decoration:none;font:400 12.5px var(--body);color:var(--soft);margin-top:3px}
.db-list li:not(.on):not(.x) .db-w{display:block}
.db-list li:not(.on):not(.x) q,.db-list li:not(.on):not(.x) .db-m{display:none}
.db-list li.on .db-dot{box-shadow:0 0 0 3px var(--ring,transparent)}
.t-ok{--ring:#E3F5F2}.t-ok.on .db-dot{background:#7FD6CC}.t-ok em{color:#17675E}
.t-warn{--ring:#FDF3D9}.t-warn.on .db-dot{background:#F5CF6A}.t-warn em{color:#8A6510}
.t-gap{--ring:#FFE6DF}.t-gap.on .db-dot{background:#FF3009}.t-gap em{color:#C9290A}
.t-gap.on q,.t-gap .db-drop{display:none}
.t-gap.x q{display:block;text-decoration:line-through;text-decoration-color:#FF3009;color:var(--soft)}
.t-gap.x .db-drop{display:inline}.t-gap.x .db-gap{display:none}
.db-list li.pop{animation:dbpop .5s var(--ease)}
@keyframes dbpop{0%{background:rgba(127,214,204,.0)}30%{background:rgba(127,214,204,.14)}100%{background:rgba(127,214,204,0)}}
.db-f{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.db-c{font:600 14.5px var(--disp);color:var(--ink);transition:opacity .3s}.db-f code{font:500 12px var(--mono);color:var(--muted)}
.vz.db:not(.done) .db-c{opacity:.0}
.db-chip{position:absolute;left:0;top:0;width:46px;height:16px;border-radius:5px;background:#FFB8A6;box-shadow:0 6px 14px -4px rgba(255,48,9,.45);opacity:0;pointer-events:none;transition:transform .55s cubic-bezier(.22,1,.36,1),opacity .2s}
@media (max-width:560px){.vz.db{padding:20px 16px}.db-b{grid-template-columns:96px 1fr;gap:14px}.db-pg{width:96px;height:128px;padding:12px 9px}.db-ln{gap:5px}.db-ln i{height:3px}.db-ln i:nth-child(n+11){display:none}.db-f code{display:none}.db-id code{font-size:12px}}
@media (prefers-reduced-motion:reduce){.db-list li.pop{animation:none}}
.db-b>*,.db-list li>div{min-width:0}
.db-list li>div{min-height:66px}.db-list li.t-gap>div{min-height:44px}
@media (max-width:560px){.db-id b{font-size:14px;white-space:nowrap}.db-id code{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:150px;display:block}.db-id>span{min-width:0}.db-id{min-width:0}.db-pill{font-size:12px;padding:4px 9px}.db-gap{font-size:12px}}
/* Developers: the integration loom */
.ix-st{position:relative;padding:40px 36px;border-radius:28px;isolation:isolate;overflow:hidden;background:#0B0D10;box-shadow:0 40px 80px -40px rgba(11,13,16,.6)}
.ix-st::before{content:"";position:absolute;inset:-20%;z-index:-2;background:radial-gradient(30% 34% at 12% 30%,rgba(31,95,224,.24),transparent 70%),radial-gradient(30% 34% at 88% 70%,rgba(127,214,204,.16),transparent 70%),radial-gradient(26% 30% at 50% 50%,rgba(255,64,24,.16),transparent 70%),radial-gradient(26% 30% at 80% 10%,rgba(185,167,242,.14),transparent 70%);animation:vgdrift 20s ease-in-out infinite alternate}
.ix-st::after{content:"";position:absolute;inset:0;z-index:-1;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20'%3E%3Crect x='9' y='9' width='2.4' height='2.4' rx='.4' fill='%23FFFFFF' fill-opacity='.06'/%3E%3C/svg%3E")}
.vz.ix{position:relative;display:grid;grid-template-columns:240px 1fr 240px;align-items:center;gap:0;background:none;border:0;box-shadow:none;padding:0;overflow:visible;min-height:440px;color:#F4F5F6}
.ix-sv{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.ix-col{position:relative;display:grid;gap:12px;z-index:1}
.ix-k{margin:0 0 2px;font:500 12px var(--mono);color:#8A9096;letter-spacing:.04em}
.ix-out .ix-k{text-align:right}
.ix-n{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;background:linear-gradient(180deg,#1B1E22,#141619);box-shadow:inset 0 1px 0 rgba(255,255,255,.07),inset 0 0 0 1px rgba(255,255,255,.07);transition:box-shadow .35s}
.ix-n>i{width:10px;height:10px;border-radius:3px;background:var(--c);box-shadow:0 0 10px var(--c);flex:none}
.ix-n span{display:grid;gap:2px;min-width:0}.ix-n b{font:500 14px var(--body);color:#fff}.ix-n code{font:500 12px var(--mono);color:#9AA1A7;white-space:nowrap}
.ix-n.hot{box-shadow:inset 0 1px 0 rgba(255,255,255,.07),inset 0 0 0 1px var(--c),0 0 24px -6px var(--c)}
.ix-hub{position:relative;z-index:1;display:grid;justify-items:center;gap:14px}
.ix-core{display:grid;justify-items:center;gap:6px;padding:24px 30px 20px;border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.035));box-shadow:inset 0 1px 0 rgba(255,255,255,.1),inset 0 0 0 1px rgba(255,255,255,.09),0 30px 60px -30px rgba(0,0,0,.9);transition:box-shadow .4s}
.ix-core.hot{box-shadow:inset 0 1px 0 rgba(255,255,255,.1),inset 0 0 0 1px rgba(255,48,9,.5),0 0 50px -10px rgba(255,48,9,.55)}
.ix-core b{font:600 18px var(--disp);color:#fff}.ix-core code{font:500 12px var(--mono);color:#9AA1A7}
.ix-px{display:grid;grid-template-columns:repeat(3,12px);gap:3px;margin-bottom:6px}
.ix-px i{width:12px;height:12px;border-radius:3px;background:rgba(255,255,255,.08);transition:background .25s,box-shadow .25s}
.ix-px i.v{background:#FF3009;box-shadow:0 0 10px rgba(255,48,9,.6)}.ix-px i.t{background:#FFC4B6}
.ix-ev{margin:0;font:500 12px var(--mono);color:#8A9096}
.ix-lab{position:absolute;left:0;top:0;z-index:2;font:500 12px var(--mono);color:#14171A;background:#fff;border-radius:7px;padding:3px 8px;white-space:nowrap;pointer-events:none;box-shadow:0 8px 20px -8px rgba(0,0,0,.7);opacity:0;transition:opacity .25s}
@media (max-width:860px){.vz.ix{grid-template-columns:1fr;gap:48px;min-height:0}.ix-col{grid-template-columns:1fr 1fr;gap:10px}.ix-k{grid-column:1/-1}.ix-out .ix-k{text-align:left}.ix-st{padding:28px 14px}.ix-n{padding:10px 11px;gap:9px}.ix-n code{font-size:12px;white-space:normal}}
@media (prefers-reduced-motion:reduce){.ix-st::before{animation:none}}
/* a rendered run on loop (industry openers) */
.rl{margin:0;display:flex;justify-content:center}.rl-s{position:relative;width:min(100%,460px)}
.rl-f0,.rl-cv{position:absolute;inset:0;width:100%;height:100%}.rl-cv{opacity:0;transition:opacity .3s}.rl.drawn .rl-cv{opacity:1}.rl.drawn .rl-f0{visibility:hidden}