.demo{padding-block:40px 72px}.demo-head{display:flex;flex-direction:column;gap:12px;margin-bottom:28px}.demo-head h1{font-size:clamp(30px,4.4vw,46px)}.tracks{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}.track{font:inherit;font-weight:600;font-size:16px;min-height:48px;padding:0 20px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--fg);cursor:pointer}.track[aria-selected=true]{background:var(--ink);color:#fff;border-color:var(--ink)}.tour{scroll-margin-top:80px;display:grid;grid-template-columns:minmax(0,auto) minmax(280px,380px);gap:40px;align-items:center;justify-content:center}.device{justify-self:center;background:#0b0916;box-shadow:0 30px 70px #17132b47}.device.phone-f{width:min(360px,100%,calc((100svh - 120px)*.4621));border-radius:44px;padding:12px}.device.tablet-f{width:min(860px,100%,calc((100svh - 120px)*1.39));border-radius:34px;padding:18px}.screen{position:relative;overflow:hidden;background:#fff}.phone-f .screen{border-radius:32px;aspect-ratio:390 / 844}.tablet-f .screen{border-radius:16px;aspect-ratio:1180 / 820}.screen img{width:100%;height:100%;object-fit:cover;display:block;transition:opacity .25s}.screen img.swap{opacity:.25}.hot{position:absolute;border:3px solid var(--sun);border-radius:16px;background:#ffd23f1f;cursor:pointer;padding:0;box-shadow:0 0 #ffd23f99;animation:ping 1.6s ease-out infinite}.hot[hidden]{display:none}@keyframes ping{0%{box-shadow:0 0 #ffd23fa6}to{box-shadow:0 0 0 18px #ffd23f00}}.guide{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:28px;display:flex;flex-direction:column;gap:12px}.guide .count{font-family:var(--mono);font-size:14px;color:var(--brand)}.guide h2{font-size:26px}.guide p{color:var(--muted);min-height:3.3em}.dots{display:flex;gap:6px;flex-wrap:wrap}.dots i{width:8px;height:8px;border-radius:50%;background:var(--line)}.dots i.on{background:var(--brand);width:22px;border-radius:4px}.g-btns{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:6px}.btn.line{border-color:var(--line);background:transparent;color:var(--fg)}.btn[disabled]{opacity:.45;cursor:default;transform:none}.g-cta{margin-top:4px}@media(max-width:900px){.tour{grid-template-columns:1fr;gap:20px}.guide{padding:20px}.guide p{min-height:0}}@media(prefers-reduced-motion:reduce){.hot{animation:none}.screen img{transition:none}}