.bgdemo{--ink:#2c3d4f;--surface:#f7f9fb;--surface-2:#eef2f7;--line:#e3e9f0;--line-strong:#cfd8e3;--text:#2c3d4f;--muted:#5b6b84;--muted-2:#8493a8;--brand:#111929;--brand-dark:#111929;--rs-red:#c90c0f;--match:#16a34a;--review:#f59e0b;--shadow-sm:0 1px 2px #1018280d, 0 1px 3px #1018280f;--shadow:0 10px 30px -12px #0b122040, 0 2px 8px #0b12200f;--shadow-lg:0 40px 80px -32px #0b122073, 0 8px 24px #0b122014;--sans:"Inter",ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;--mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;font-family:var(--sans);color:var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;font-size:16px;line-height:1.6}.bgdemo h3{letter-spacing:-.022em;color:var(--ink);margin:0;line-height:1.12}.bgdemo p{margin:0}.bgdemo img{max-width:100%;display:block}.bgdemo .tcard{border:1px solid var(--line);box-shadow:var(--shadow);background:#fff;border-radius:18px;padding:22px;position:relative;overflow:hidden}.bgdemo .tcard-top{justify-content:space-between;align-items:center;margin-bottom:18px;display:flex}.bgdemo .tcard-label{letter-spacing:.1em;text-transform:uppercase;color:var(--muted-2);font-size:11.5px;font-weight:700}.bgdemo .tio{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px 16px}.bgdemo .tio+.tio{margin-top:10px}.bgdemo .tio-k{letter-spacing:.08em;text-transform:uppercase;color:var(--muted-2);margin-bottom:7px;font-size:11px;font-weight:700}.bgdemo .tio-v{font-family:var(--mono);color:var(--ink);letter-spacing:-.01em;min-height:21px;font-size:14px}.bgdemo .tio-v .caret{background:var(--brand);vertical-align:-2px;width:2px;height:15px;animation:1s step-end infinite blink;display:inline-block}@keyframes blink{50%{opacity:0}}.bgdemo .tio.out{background:linear-gradient(#fff,#fbfefc);border-color:#0e9e744d}.bgdemo .tio.out .tio-v{color:var(--brand-dark);font-weight:600}.bgdemo .tarrow{justify-content:center;margin:10px 0;display:flex}.bgdemo .tarrow svg{width:20px;height:20px;color:var(--line-strong);animation:2s ease-in-out infinite nudge}@keyframes nudge{0%,to{transform:translateY(0)}50%{transform:translateY(4px)}}.bgdemo .tbadges{flex-wrap:wrap;gap:6px;margin-top:14px;display:flex}.bgdemo .tbadge{background:var(--surface-2);color:var(--muted);border-radius:6px;padding:4px 9px;font-size:11px;font-weight:650}.bgdemo .tbadge.ok{color:#137a3a;background:#16a34a1f}.bgdemo .wt{grid-template-columns:1fr;gap:22px;display:grid}.bgdemo .wt-rail{scrollbar-width:none;gap:8px;padding-bottom:4px;display:flex;overflow-x:auto}.bgdemo .wt-rail::-webkit-scrollbar{display:none}@media (max-width:800px){.bgdemo .wt-rail{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),#0000);mask-image:linear-gradient(90deg,#000 calc(100% - 28px),#0000)}}.bgdemo .wt-chip{text-align:left;cursor:pointer;border:1px solid var(--line);min-width:132px;font:inherit;color:inherit;background:#fff;border-radius:12px;flex:1 1 0;padding:11px 13px 12px;transition:border-color .2s,box-shadow .2s,background .2s;position:relative;overflow:hidden}.bgdemo .wt-chip:hover{border-color:var(--line-strong)}.bgdemo .wt-chip .n{background:var(--surface-2);width:19px;height:19px;color:var(--muted);border-radius:50%;justify-content:center;align-items:center;margin-bottom:7px;font-size:11px;font-weight:700;transition:background .2s,color .2s;display:inline-flex}.bgdemo .wt-chip .t{letter-spacing:-.01em;color:var(--muted);font-size:13px;font-weight:600;line-height:1.3;display:block}.bgdemo .wt-chip[aria-selected=true]{background:var(--rs-red);border-color:var(--rs-red);box-shadow:var(--shadow-sm)}.bgdemo .wt-chip[aria-selected=true] .n{background:var(--brand);color:#fff}.bgdemo .wt-chip[aria-selected=true] .t{color:#fff}.bgdemo .wt-chip.done .n{color:#137a3a;background:#16a34a24}.bgdemo .wt-chip .bar{background:var(--brand);width:0;height:2px;position:absolute;bottom:0;left:0}.bgdemo .wt-chip[aria-selected=true] .bar.run{animation:linear forwards railFill;animation-duration:var(--sd,5.2s)}@keyframes railFill{0%{width:0}to{width:100%}}.bgdemo .wt-main{grid-template-columns:1.72fr .98fr;align-items:start;gap:30px;display:grid}.bgdemo .frame{border:1px solid var(--line-strong);box-shadow:var(--shadow-lg);background:#fff;border-radius:16px;overflow:hidden}.bgdemo .frame-bar{border-bottom:1px solid var(--line);background:linear-gradient(#fbfcfd,#f4f7fa);align-items:center;gap:9px;padding:11px 14px;display:flex}.bgdemo .dots{gap:6px;display:flex}.bgdemo .dots i{background:#d9e1ea;border-radius:50%;width:9px;height:9px}.bgdemo .urlbar{border:1px solid var(--line);color:var(--muted-2);font-size:11.5px;font-family:var(--mono);background:#fff;border-radius:7px;flex:1;align-items:center;gap:7px;padding:5px 10px;display:flex}.bgdemo .urlbar svg{width:11px;height:11px;color:var(--match)}.bgdemo .stage{background:#fff;height:598px;position:relative;overflow:hidden}.bgdemo .pane{opacity:0;pointer-events:none;padding:26px 28px;position:absolute;inset:0;overflow:hidden}.bgdemo .pane.active{opacity:1;pointer-events:auto}.bgdemo .stage.scaled .pane{width:744px;height:620px;transform:scale(var(--pscale,1));transform-origin:0 0;bottom:auto;right:auto}.bgdemo .m-h{letter-spacing:-.018em;color:var(--ink);font-size:19px;font-weight:670}.bgdemo .m-sub{color:var(--muted);margin-top:5px;font-size:13px}.bgdemo .m-card{border:1px solid var(--line);background:#fff;border-radius:12px}.bgdemo .m-pad{padding:16px 18px}.bgdemo .m-btn{background:var(--ink);color:#fff;border:1px solid var(--ink);border-radius:9px;align-items:center;gap:7px;padding:9px 15px;font-size:12.5px;font-weight:600;display:inline-flex}.bgdemo .m-btn.light{color:var(--ink);border-color:var(--line-strong);background:#fff}.bgdemo .m-label{letter-spacing:.07em;text-transform:uppercase;color:var(--muted-2);font-size:11px;font-weight:700}.bgdemo .m-select{border:1px solid var(--line-strong);font-family:var(--mono);color:var(--ink);background:#fff;border-radius:9px;justify-content:space-between;align-items:center;padding:9px 12px;font-size:12.5px;display:flex}.bgdemo .m-select .ph{color:var(--muted-2)}.bgdemo .m-select svg{width:12px;height:12px;color:var(--muted-2)}.bgdemo .m-steps{color:var(--muted-2);flex-wrap:wrap;align-items:center;gap:9px;margin-bottom:18px;font-size:12.5px;display:flex}.bgdemo .m-steps b{background:var(--surface-2);width:19px;height:19px;color:var(--muted);border-radius:50%;justify-content:center;align-items:center;margin-right:6px;font-size:11px;font-weight:700;display:inline-flex}.bgdemo .m-steps span{align-items:center;font-weight:550;display:inline-flex}.bgdemo .m-steps span.on{color:var(--ink);font-weight:650}.bgdemo .m-steps span.on b{background:var(--ink);color:#fff}.bgdemo .m-steps span.ok b{color:#137a3a;background:#16a34a26}.bgdemo .m-steps i.sep{background:var(--line-strong);border-radius:50%;width:4px;height:4px}.bgdemo .m-table{border-collapse:collapse;width:100%;font-size:12px}.bgdemo .m-table th{text-align:left;font-family:var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted-2);border-bottom:1px solid var(--line);background:var(--surface);padding:9px 10px;font-size:10px;font-weight:600}.bgdemo .m-table td{color:var(--text);white-space:nowrap;text-overflow:ellipsis;border-bottom:1px solid #f1f4f8;padding:9px 10px;overflow:hidden}.bgdemo .m-table td.mono{font-family:var(--mono);color:var(--muted);font-size:11.5px}.bgdemo .m-note{color:var(--muted);background:var(--surface);border:1px solid var(--line);border-radius:10px;gap:9px;padding:11px 13px;font-size:11.5px;display:flex}.bgdemo .m-note svg{width:14px;height:14px;color:var(--brand);flex:none;margin-top:1px}.bgdemo .stat{border:1px solid var(--line);background:#fff;border-radius:11px;padding:13px 15px}.bgdemo .stat .k{letter-spacing:.08em;text-transform:uppercase;color:var(--muted-2);font-size:10px;font-weight:700}.bgdemo .stat .v{letter-spacing:-.03em;color:var(--ink);margin-top:4px;font-size:23px;font-weight:700}.bgdemo .stat .v.green{color:var(--match)}.bgdemo .pill{border-radius:999px;align-items:center;gap:6px;padding:3px 9px;font-size:11.5px;font-weight:600;display:inline-flex}.bgdemo .pill i{border-radius:50%;width:6px;height:6px}.bgdemo .pill.match{color:#137a3a;background:#16a34a1a}.bgdemo .pill.match i{background:var(--match)}.bgdemo .pill.review{color:#96620a;background:#f59e0b21}.bgdemo .pill.review i{background:var(--review)}.bgdemo .check{border:1.5px solid var(--line-strong);background:#fff;border-radius:5px;flex:none;justify-content:center;align-items:center;width:17px;height:17px;display:inline-flex}.bgdemo .check svg{color:#fff;opacity:0;width:11px;height:11px}.bgdemo .check.locked{background:var(--muted-2);border-color:var(--muted-2)}.bgdemo .check.locked svg{opacity:1}.bgdemo .optrow{border-bottom:1px solid #f1f4f8;align-items:center;gap:11px;padding:8px 2px;font-size:13px;display:flex}.bgdemo .optrow:last-child{border-bottom:0}.bgdemo .optrow .grow{flex:1}.bgdemo .optrow .tag{color:var(--muted-2);background:var(--surface-2);border-radius:6px;padding:3px 8px;font-size:10.5px;font-weight:600}.bgdemo .optrow small{color:var(--muted-2);margin-top:2px;font-size:11.5px;font-weight:400;line-height:1.4;display:block}.bgdemo .cursor{z-index:20;opacity:0;pointer-events:none;filter:drop-shadow(0 2px 4px #0b12204d);width:20px;height:20px;position:absolute}.bgdemo .cursor svg{width:100%;height:100%}.bgdemo .ripple{border:2px solid var(--brand);opacity:0;z-index:19;pointer-events:none;border-radius:50%;width:34px;height:34px;position:absolute}@keyframes rUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes rIn{0%{opacity:0}to{opacity:1}}@keyframes rScale{0%{opacity:0;transform:scale(.94)}to{opacity:1;transform:none}}@keyframes rLeft{0%{opacity:0;transform:translate(-14px)}to{opacity:1;transform:none}}@keyframes rRow{0%{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}@keyframes flash{0%{border-color:var(--brand);box-shadow:0 0 #11192980}to{border-color:var(--line-strong);box-shadow:0 0 0 8px #11192900}}@keyframes pop{0%{opacity:0;transform:scale(.3)}60%{transform:scale(1.18)}to{opacity:1;transform:scale(1)}}@keyframes grow{0%{transform:scaleY(0)}to{transform:scaleY(1)}}@keyframes pressBtn{0%,to{transform:none}45%{transform:scale(.955)}}@keyframes ringPulse{0%{box-shadow:0 0 #c90c0f73}70%{box-shadow:0 0 0 14px #c90c0f00}to{box-shadow:0 0 #c90c0f00}}@keyframes rippleOut{0%{opacity:.9;transform:scale(.3)}to{opacity:0;transform:scale(1.5)}}.bgdemo .pane .an{opacity:0}.bgdemo .pane.run .an{animation:.52s cubic-bezier(.22,.7,.3,1) both rUp;animation-delay:var(--d,0s)}.bgdemo .pane.run .an.fade{animation-name:rIn}.bgdemo .pane.run .an.scale{animation-name:rScale}.bgdemo .pane.run .an.left{animation-name:rLeft}.bgdemo .pane.run .an.row{animation-name:rRow;animation-duration:.34s}.bgdemo .pane.run .an.pop{animation-name:pop;animation-duration:.42s}.bgdemo .pane.run .flashy{animation:1s ease-out both flash;animation-delay:var(--fd,0s)}.bgdemo .pane.run .pressy{animation:.5s ease-out both pressBtn;animation-delay:var(--pd,0s)}.bgdemo .pane.run .ringy{animation:1.9s ease-out infinite ringPulse;animation-delay:var(--rd,0s)}.bgdemo .pane.run .cursor{animation:var(--curs) both}.bgdemo .pane.run .ripple{animation:.7s ease-out both rippleOut;animation-delay:var(--rpd,0s)}@keyframes cur1{0%{opacity:0;top:70%;left:38%}12%{opacity:1}70%{top:11%;left:82.5%}76%{top:11%;left:82.5%;transform:scale(.82)}84%{transform:scale(1)}to{opacity:1;top:11%;left:82.5%}}@keyframes cur5{0%{opacity:0;top:38%;left:30%}15%{opacity:1}55%{top:72%;left:80.5%}62%{top:72%;left:80.5%;transform:scale(.82)}70%{top:72%;left:80.5%;transform:scale(1)}to{opacity:1;top:72%;left:80.5%}}.bgdemo .prog{background:var(--surface-2);border-radius:99px;height:7px;overflow:hidden}.bgdemo .prog i{background:linear-gradient(90deg,var(--brand),#3d4d6b);border-radius:99px;width:0;height:100%;display:block}.bgdemo .pane.run .prog i{animation:4.4s cubic-bezier(.3,.6,.35,1) both progFill;animation-delay:var(--gd,0s)}@keyframes progFill{0%{width:0}to{width:100%}}.bgdemo .spinner{border:2px solid #0e9e7440;border-top-color:var(--brand);border-radius:50%;width:14px;height:14px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.bgdemo .bars{align-items:flex-end;gap:26px;padding-left:6px;display:flex}.bgdemo .barcol{flex-direction:column;flex:1;align-items:center;gap:7px;display:flex}.bgdemo .barcol .bwrap{justify-content:center;align-items:flex-end;width:100%;height:100px;display:flex}.bgdemo .barcol .b{transform-origin:bottom;border-radius:6px 6px 0 0;width:38px;transform:scaleY(0)}.bgdemo .pane.run .barcol .b{animation:.72s cubic-bezier(.2,.75,.3,1) both grow;animation-delay:var(--d,0s)}.bgdemo .barcol .cap{color:var(--muted);font-size:11px;font-weight:600}.bgdemo .barcol .num{color:var(--muted-2);font-size:11px;font-weight:600}.bgdemo .mapwrap{aspect-ratio:1000/760;background:#eaf0f6;border-radius:10px;width:100%;position:relative;overflow:hidden}.bgdemo .mapwrap .base{width:100%;height:100%;position:absolute;inset:0}.bgdemo .mapwrap .overlay{position:absolute;inset:0}.bgdemo .mapwrap .legend{border:1px solid var(--line);color:var(--muted);background:#ffffffed;border-radius:7px;gap:7px;padding:4px 7px;font-size:9px;font-weight:650;display:flex;position:absolute;bottom:6px;left:6px}.bgdemo .mapwrap .legend span{align-items:center;gap:4px;display:inline-flex}.bgdemo .mapwrap .legend i{border-radius:50%;width:6px;height:6px}.bgdemo .mapwrap .attrib{color:var(--muted-2);background:#fffc;border-radius:4px;padding:2px 5px;font-size:9px;position:absolute;top:6px;right:6px}.bgdemo .mdot{opacity:0;border-radius:50%;width:8px;height:8px;position:absolute;transform:translate(-50%,-50%);box-shadow:0 0 0 1.5px #ffffffe6}.bgdemo .pane.run .mdot{animation:.4s cubic-bezier(.2,.8,.3,1) both pop;animation-delay:var(--d,0s)}.bgdemo .wt-side{position:sticky;top:134px}.bgdemo .wt-copy{border:1px solid var(--line);box-shadow:var(--shadow-sm);background:#fff;border-radius:14px;padding:24px}.bgdemo .wt-copy .num{letter-spacing:.09em;text-transform:uppercase;color:var(--rs-red);align-items:center;gap:8px;margin-bottom:12px;font-size:11.5px;font-weight:700;display:inline-flex}.bgdemo .wt-copy h3{font-size:22px;font-weight:680}.bgdemo .wt-copy p{color:var(--muted);margin-top:12px;font-size:15px}.bgdemo .wt-copy .why{border-top:1px solid var(--line);color:var(--text);gap:10px;margin-top:18px;padding-top:16px;font-size:13.5px;display:flex}.bgdemo .wt-copy .why svg{width:15px;height:15px;color:var(--brand);flex:none;margin-top:3px}.bgdemo .wt-copy .why b{font-weight:650}.bgdemo .wt-controls{align-items:center;gap:8px;margin-top:16px;display:flex}.bgdemo .icon-btn{border:1px solid var(--line-strong);cursor:pointer;width:38px;height:38px;color:var(--ink);background:#fff;border-radius:10px;justify-content:center;align-items:center;transition:border-color .18s,background .18s;display:inline-flex}.bgdemo .icon-btn:hover{background:#fbfcfe;border-color:#aebbcc}.bgdemo .icon-btn svg{width:15px;height:15px}.bgdemo .wt-controls .count{color:var(--muted-2);font-variant-numeric:tabular-nums;margin-left:auto;font-size:12.5px;font-weight:600}@keyframes rOut{0%{opacity:1}to{opacity:0;visibility:hidden}}.bgdemo .pane .outy{opacity:1}.bgdemo .pane.run .outy{animation:.4s ease-out both rOut;animation-delay:var(--od,1.2s)}@keyframes typing{0%{width:0}to{width:100%}}.bgdemo .tw{white-space:nowrap;vertical-align:bottom;width:0;display:inline-block;overflow:hidden}.bgdemo .pane.run .tw{animation:1.6s steps(48,end) both typing;animation-delay:var(--d,.6s)}@keyframes tickOn{0%{border-color:var(--line-strong);background:#fff;transform:scale(1)}55%{transform:scale(1.16)}to{background:var(--ink);border-color:var(--ink);transform:scale(1)}}.bgdemo .pane .check.tick svg{opacity:0}.bgdemo .pane.run .check.tick{animation:.4s cubic-bezier(.2,.8,.3,1) both tickOn;animation-delay:var(--d,0s)}.bgdemo .pane.run .check.tick svg{animation:.2s both rIn;animation-delay:calc(var(--d,0s) + .14s)}.bgdemo .filetable{table-layout:fixed}@media (max-width:1040px){.bgdemo .wt-main{grid-template-columns:1fr}.bgdemo .wt-side{position:static}.bgdemo .stage{height:560px}.bgdemo .frame{border-radius:14px}}@media (max-width:720px){.bgdemo .stage{height:500px}.bgdemo .pane{padding:18px}.bgdemo .wt-chip{min-width:118px}}@media (prefers-reduced-motion:reduce){.bgdemo .pane .an,.bgdemo .pane.run .an,.bgdemo .pane.run .barcol .b,.bgdemo .pane.run .mdot,.bgdemo .pane.run .prog i{opacity:1!important;width:auto!important;animation:none!important;transform:none!important}.bgdemo .pane.run .prog i{width:100%!important}.bgdemo .pane.run .cursor,.bgdemo .pane.run .ripple{opacity:0!important;animation:none!important}.bgdemo .pane.run .ringy,.bgdemo .pane.run .flashy,.bgdemo .pane.run .pressy,.bgdemo .spinner,.bgdemo .tarrow svg,.bgdemo .tio-v .caret{animation:none!important}}
