/* extra scene parts used by the features page */
.sw-tgl{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 12px;border:1px solid #E2E8F0;border-radius:10px;margin-top:6px;font-weight:700;background:#fff;transition:opacity .3s,background .3s}
.sw-tgl small{display:block}
.sw-sw{width:38px;height:22px;border-radius:999px;background:#5412C4;position:relative;flex:none;transition:background .25s}
.sw-sw:after{content:"";position:absolute;top:3px;left:19px;width:16px;height:16px;border-radius:50%;background:#fff;transition:left .25s cubic-bezier(.34,1.56,.64,1)}
.sw-tgl.off .sw-sw{background:#94A3B8}.sw-tgl.off .sw-sw:after{left:3px}.sw-tgl.off{opacity:.75}
.sw-tgl.press .sw-sw,.sw-tgl.hov{transform:none}
.sw-brand{display:flex;align-items:center;gap:10px;margin-top:12px;flex-wrap:wrap}
.sw-swatch{width:26px;height:26px;border-radius:50%;border:2px solid transparent;box-shadow:0 0 0 1px #CBD5E1;transition:.2s}
.sw-swatch.on{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--c)}
.sw-prev{margin-left:auto;display:flex;align-items:center;gap:8px;padding:6px 12px;border-radius:9px;background:var(--c,#5412C4);color:#fff;font-weight:800;font-size:12px;transition:background .35s}
.sw-prev .ms{font-size:16px}
.sw-seg{display:flex;gap:6px;margin-top:8px}
.sw-seg .sw-chip.on{background:#5412C4;border-color:#5412C4;color:#fff}.sw-seg .sw-chip.on .ms{color:#fff}
.sw-menu{position:absolute;z-index:6;min-width:140px;background:#fff;border:1px solid #E2E8F0;border-radius:10px;box-shadow:0 18px 40px -14px rgba(15,23,42,.45);padding:5px;opacity:0;transform:translateY(-6px) scale(.97);pointer-events:none;transition:.2s}
.sw-menu.open{opacity:1;transform:none}.sw-menu div{padding:7px 10px;border-radius:7px;font-weight:700}.sw-menu div.hov{background:#EDE9FE;color:#5B21B6}
.sw-tr.dim{opacity:.25}.sw-tr{transition:opacity .3s}
.sw-meter.lg{height:9px}
.sw-step{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #E2E8F0;border-radius:11px;padding:9px 11px;margin-top:7px;font-weight:700}
.sw-step .no{width:24px;height:24px;border-radius:7px;background:#5412C4;color:#fff;display:grid;place-items:center;font-size:11.5px;flex:none}
.sw-step .g{flex:1}.sw-step.in{animation:swIn .5s both cubic-bezier(.16,1,.3,1)}.sw-step.flash{animation:swFlash 1.4s ease}
.sw-step.drag{box-shadow:0 14px 28px -10px rgba(84,18,196,.5);border-color:#5412C4;z-index:2;position:relative}
.sw-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:12px;margin-top:12px}
.sw-col h6{margin:0 0 4px;font-size:12px;font-weight:800;color:#64748B;letter-spacing:.04em;text-transform:uppercase}
.sw-add{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid #E2E8F0;border-radius:11px;padding:8px 10px;margin-top:7px;font-weight:700;transition:.25s}
.sw-add .ms{margin-left:auto;color:#5412C4;font-size:20px}.sw-add.used{opacity:.4}.sw-add.hov{border-color:#5412C4}
.sw-skill{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid #F1F5F9;font-weight:700}
.sw-skill .g{flex:1;min-width:0}.sw-skill .sw-bar2{width:96px}.sw-skill .pc{width:36px;text-align:right;font-variant-numeric:tabular-nums;color:#5B21B6}
.sw-skill.in{animation:swIn .5s both cubic-bezier(.16,1,.3,1)}
.sw-lnk{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:800;color:#5412C4;background:#F5F3FF;border-radius:999px;padding:3px 9px}
.sw-lnk .ms{font-size:14px}
.sw-dz{margin-top:12px;border:2px dashed #CBD5E1;border-radius:14px;padding:16px;text-align:center;color:#64748B;font-weight:700;position:relative;overflow:hidden;transition:.3s}
.sw-dz .ms{font-size:30px;color:#A78BFA;display:block;margin:0 auto 4px}.sw-dz.hot{border-color:#5412C4;background:#F5F3FF}
.sw-dz .up{height:6px;border-radius:6px;background:#E2E8F0;margin:8px auto 0;width:60%;overflow:hidden;opacity:0;transition:opacity .2s}.sw-dz .up i{display:block;height:100%;width:0;background:#5412C4;transition:width 1.2s cubic-bezier(.16,1,.3,1)}.sw-dz.busy .up{opacity:1}
.sw-lib{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px}
.sw-file{background:#fff;border:1px solid #E2E8F0;border-radius:11px;padding:10px;font-weight:700;font-size:12px;display:flex;flex-direction:column;gap:6px}
.sw-file .ic{width:30px;height:30px;border-radius:8px;display:grid;place-items:center}.sw-file .ic .ms{font-size:18px}.sw-file small{display:block}
.sw-file.in{animation:swIn .5s both cubic-bezier(.34,1.4,.64,1)}
.sw-ft{position:absolute;z-index:7;display:flex;align-items:center;gap:8px;background:#fff;border:1px solid #CBD5E1;border-radius:10px;padding:7px 11px;font-weight:700;font-size:12px;box-shadow:0 14px 30px -10px rgba(15,23,42,.5);transition:transform .85s cubic-bezier(.65,0,.35,1),opacity .3s}
.sw-themes{display:flex;gap:6px;margin-top:10px;align-items:center}
.sw-pv{margin-top:8px;border-radius:12px;padding:12px 14px;border:1px solid #E2E8F0;background:#fff;transition:background .4s,color .4s,border-color .4s;font-weight:700}
.sw-pv b{display:block;font-size:14px;transition:font-family .2s}.sw-pv small{display:block;margin-top:2px;transition:color .4s}
.sw-pv.t-mid{background:#0F172A;color:#E2E8F0;border-color:#1E293B}.sw-pv.t-mid small{color:#94A3B8}
.sw-pv.t-ed{background:#FFFBEB;color:#451A03;border-color:#FDE68A;font-family:Georgia,serif}.sw-pv.t-ed small{color:#92400E}
.sw-flip{perspective:700px;margin-top:12px}
.sw-fc{position:relative;height:150px;transform-style:preserve-3d;transition:transform .7s cubic-bezier(.34,1.2,.64,1)}
.sw-fc.flipped{transform:rotateY(180deg)}
.sw-fc>div{position:absolute;inset:0;backface-visibility:hidden;border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:14px;font-weight:800;font-size:17px;border:1px solid #E2E8F0;background:#fff}
.sw-fc>div small{display:block;margin-top:6px;font-size:12px}
.sw-fc .back{transform:rotateY(180deg);background:#5412C4;color:#fff;border-color:#5412C4;font-size:14px;line-height:1.45}
.sw-fc.swap{animation:swIn .45s both}
.sw-bub{margin-top:8px;border-radius:12px;padding:8px 11px;font-weight:600;max-width:92%}
.sw-bub.me{margin-left:auto;background:#EDE9FE;color:#4C1D95}.sw-bub.ai{background:#fff;border:1px solid #E2E8F0}
.sw-bub.ai .t:empty:after{content:"…";color:#94A3B8}
.sw-bm{color:#94A3B8;transition:color .25s,transform .4s cubic-bezier(.34,1.56,.64,1)}.sw-bm.on{color:#B45309;transform:scale(1.2)}.sw-bm.on{font-variation-settings:"FILL" 1,"wght" 500,"GRAD" 0,"opsz" 24}

/* dark variants */
html[data-theme="dark"] .sw-tgl,html[data-theme="dark"] .sw-step,html[data-theme="dark"] .sw-add,html[data-theme="dark"] .sw-file,html[data-theme="dark"] .sw-pv,html[data-theme="dark"] .sw-fc>div,html[data-theme="dark"] .sw-bub.ai,html[data-theme="dark"] .sw-menu,html[data-theme="dark"] .sw-ft{background:#18181B;border-color:#27272A;color:#FAFAFA}
html[data-theme="dark"] .sw-sw{background:#7C3AED}html[data-theme="dark"] .sw-tgl.off .sw-sw{background:#52525B}
html[data-theme="dark"] .sw-swatch{box-shadow:0 0 0 1px #3F3F46}html[data-theme="dark"] .sw-swatch.on{box-shadow:0 0 0 2px #0F0F12,0 0 0 4px var(--c)}
html[data-theme="dark"] .sw-seg .sw-chip.on{background:#7C3AED;border-color:#7C3AED}
html[data-theme="dark"] .sw-menu div.hov{background:rgba(124,58,237,.25);color:#DDD6FE}
html[data-theme="dark"] .sw-step .no{background:#7C3AED}
html[data-theme="dark"] .sw-col h6{color:#A1A1AA}
html[data-theme="dark"] .sw-add .ms,html[data-theme="dark"] .sw-lnk{color:#C4B5FD}html[data-theme="dark"] .sw-lnk{background:rgba(124,58,237,.2)}
html[data-theme="dark"] .sw-add.hov{border-color:#A78BFA}
html[data-theme="dark"] .sw-skill{border-color:#27272A}html[data-theme="dark"] .sw-skill .pc{color:#C4B5FD}
html[data-theme="dark"] .sw-dz{border-color:#3F3F46;color:#A1A1AA}html[data-theme="dark"] .sw-dz.hot{background:rgba(124,58,237,.14);border-color:#A78BFA}
html[data-theme="dark"] .sw-dz .up{background:#27272A}html[data-theme="dark"] .sw-dz .up i{background:#A78BFA}
html[data-theme="dark"] .sw-fc .back{background:#7C3AED;border-color:#7C3AED}
html[data-theme="dark"] .sw-bub.me{background:rgba(124,58,237,.3);color:#EDE9FE}
html[data-theme="dark"] .sw-pv.t-mid{background:#000;border-color:#27272A}
@media (max-width:640px){.sw-cols{grid-template-columns:minmax(0,1fr)}.sw-cols .sw-col:first-child{display:none}.sw-lib{grid-template-columns:repeat(2,minmax(0,1fr))}.sw-lib .sw-file:nth-child(3){display:none}}