:root{--bg: #0a0c11;--card: #12151d;--card-2: #171b25;--line: #232838;--text: #eceff7;--muted: #8b93a8;--accent: #8b5cf6;--accent-2: #22d3ee;--good: #34d399;--warn: #fbbf24;--bad: #f87171;--radius: 16px;--grad: linear-gradient(135deg, #8b5cf6, #22d3ee);font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color-scheme:dark}*{box-sizing:border-box}[hidden]{display:none!important}html,body{margin:0;min-height:100%}body{background:var(--bg);color:var(--text);line-height:1.5;-webkit-font-smoothing:antialiased;display:flex;flex-direction:column;min-height:100vh}a{color:var(--accent-2)}kbd{font:inherit;font-size:12px;padding:1px 6px;border:1px solid var(--line);border-bottom-width:2px;border-radius:6px;background:var(--card-2);color:var(--text)}.bg-glow{position:fixed;inset:0;pointer-events:none;z-index:0;background:radial-gradient(60% 50% at 15% 0%,rgba(139,92,246,.22),transparent 70%),radial-gradient(50% 45% at 90% 10%,rgba(34,211,238,.14),transparent 70%)}.topbar{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:16px clamp(16px,4vw,40px)}.brand{display:inline-flex;align-items:center;gap:10px;color:var(--text);text-decoration:none;font-weight:700;font-size:20px;letter-spacing:-.02em}.brand b{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}.top-right{display:flex;align-items:center;gap:12px}.pill{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;color:var(--muted);border:1px solid var(--line);background:#12151db3;padding:6px 12px;border-radius:999px}.dot{width:8px;height:8px;border-radius:50%;background:var(--good);box-shadow:0 0 0 4px #34d39926}main{position:relative;z-index:1;flex:1;width:100%;max-width:1400px;margin:0 auto;padding:0 clamp(16px,4vw,40px) 40px}.btn{font:inherit;font-weight:600;font-size:14px;color:var(--text);background:var(--card-2);border:1px solid var(--line);border-radius:12px;padding:10px 16px;cursor:pointer;transition:transform .08s,background .15s,border-color .15s,box-shadow .15s}.btn:hover{border-color:#3a4160;background:#1c2130}.btn:active{transform:translateY(1px)}.btn.ghost{background:transparent}.btn.sm{padding:6px 12px;font-size:13px;border-radius:10px}.btn.wide{width:100%}.btn.primary{border:0;background:var(--grad);color:#071016;box-shadow:0 8px 28px -8px #8b5cf6b3}.btn.primary:hover{filter:brightness(1.08);box-shadow:0 10px 34px -8px #22d3ee99}.btn.big{width:100%;padding:15px 18px;font-size:16px}.btn:disabled{opacity:.5;cursor:progress}:focus-visible{outline:2px solid var(--accent-2);outline-offset:2px}#landing{max-width:860px;margin:0 auto;text-align:center;padding-top:clamp(8px,3vh,40px)}.hero h1{font-size:clamp(36px,6vw,62px);line-height:1.04;letter-spacing:-.035em;margin:8px 0 16px}.grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}.lede{color:var(--muted);font-size:clamp(16px,2vw,19px);max-width:640px;margin:0 auto 32px}.dropzone{display:block;cursor:pointer;border:2px dashed #34406a;border-radius:24px;padding:clamp(36px,7vw,68px) 24px;background:linear-gradient(180deg,#8b5cf612,#22d3ee0a);transition:border-color .2s,background .2s,transform .2s}.dropzone:hover,.dropzone:focus-visible,.dropzone.over{border-color:var(--accent-2);background:linear-gradient(180deg,#8b5cf624,#22d3ee17);transform:translateY(-2px)}.dz-icon{width:68px;height:68px;margin:0 auto 14px;display:grid;place-items:center;border-radius:20px;color:#071016;background:var(--grad);box-shadow:0 14px 40px -10px #8b5cf6cc}.dz-title{font-size:22px;font-weight:700;letter-spacing:-.01em}.dz-sub{color:var(--muted);margin-top:6px}.dz-formats{color:#5d6580;font-size:12.5px;margin-top:14px;letter-spacing:.04em}.try-row{margin-top:16px}.error{margin:16px auto 0;max-width:620px;color:#fecaca;background:#f871711a;border:1px solid rgba(248,113,113,.35);padding:10px 14px;border-radius:12px;font-size:14px}.steps{display:flex;align-items:stretch;justify-content:center;gap:12px;margin:56px 0 40px;flex-wrap:wrap}.step{display:flex;flex-direction:column;align-items:center;gap:2px;padding:16px 22px;min-width:190px;border:1px solid var(--line);border-radius:var(--radius);background:#12151db3}.step span:last-child{color:var(--muted);font-size:13.5px}.step .n{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--grad);color:#071016;font-weight:800;font-size:13px;margin-bottom:4px}.step-arrow{align-self:center;color:#4a5272;font-size:22px}.features{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;text-align:left}.feat{background:#12151db3;border:1px solid var(--line);border-radius:var(--radius);padding:18px}.feat h3{margin:0 0 6px;font-size:15.5px}.feat p{margin:0;color:var(--muted);font-size:13.5px}#workspace{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:22px;align-items:start;padding-top:6px}.stage-col{position:sticky;top:8px;min-width:0}.stage{display:grid;place-items:center;background:repeating-conic-gradient(#10131a 0% 25%,#0d1016 0% 50%) 50% / 24px 24px;border:1px solid var(--line);border-radius:var(--radius);padding:14px;min-height:300px;overflow:hidden}.frame{position:relative;display:inline-block;line-height:0;box-shadow:0 20px 60px -20px #000c;border-radius:4px;overflow:hidden}#preview{display:block;max-width:100%;max-height:calc(100vh - 190px);width:auto;height:auto}.overlay{position:absolute;inset:0;cursor:crosshair;touch-action:none}.box{position:absolute;border-radius:6px;cursor:pointer;transition:background .12s,box-shadow .12s,border-color .12s}.box.on{border:2px solid rgba(34,211,238,.9);box-shadow:0 0 0 1px #00000080}.box.off{border:2px dashed rgba(251,191,36,.9);background:#fbbf2414}.box.face{border-radius:50%}.box:hover{background:#8b5cf638}.box .tag{position:absolute;left:-2px;top:-22px;line-height:1;font-size:11px;font-weight:700;padding:4px 7px;border-radius:6px 6px 6px 0;background:#0b0d12;color:var(--text);white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .12s}.box:hover .tag{opacity:1}.box.off .tag{color:var(--warn)}.box .x{position:absolute;right:-9px;top:-9px;width:20px;height:20px;line-height:18px;text-align:center;border-radius:50%;background:#ef4444;color:#fff;font-size:13px;font-weight:700;opacity:0}.box.manual:hover .x{opacity:1}.box.draft{border:2px dashed #fff;background:#ffffff1f;pointer-events:none}.frame.peeking .overlay{opacity:0}.scanfx{position:absolute;inset:0;pointer-events:none;overflow:hidden}.scanfx i{position:absolute;left:0;right:0;height:90px;top:-90px;background:linear-gradient(180deg,transparent,rgba(34,211,238,.28),rgba(139,92,246,.5));border-bottom:2px solid #67e8f9;animation:scan 1.8s linear infinite}@keyframes scan{to{top:100%}}.stage-bar{display:flex;align-items:center;gap:12px;padding:10px 2px 0}.hint{flex:1;color:var(--muted);font-size:13px}.pagenav{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--muted)}.panel{display:flex;flex-direction:column;gap:14px}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px}.card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;gap:10px}.card h2{margin:0;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.09em;color:var(--muted)}.count-badge{font-size:12.5px;font-weight:700;color:#071016;background:var(--grad);padding:2px 10px;border-radius:999px}.count-badge:empty{display:none}.tag{font-size:11px;font-weight:700;padding:3px 8px;border-radius:999px}.tag.ok{color:var(--good);background:#34d3991f}.tag.warn{color:var(--warn);background:#fbbf241f}.scan-steps{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:6px;font-size:13.5px}.scan-steps li{display:flex;align-items:center;gap:10px;color:var(--muted)}.scan-steps li .ic{width:18px;height:18px;display:grid;place-items:center;font-size:12px}.scan-steps li.run{color:var(--text)}.scan-steps li.run .ic{border:2px solid var(--line);border-top-color:var(--accent-2);border-radius:50%;animation:spin .7s linear infinite}.scan-steps li.done{color:var(--text)}.scan-steps li.done .ic{color:var(--good)}.scan-steps li .r{margin-left:auto;color:var(--muted);font-size:12.5px;font-variant-numeric:tabular-nums}@keyframes spin{to{transform:rotate(360deg)}}.bar{height:5px;background:var(--card-2);border-radius:99px;overflow:hidden}.bar i{display:block;height:100%;width:0;background:var(--grad);transition:width .25s}#scan-card.done .bar{display:none}#scan-card.done .scan-steps{margin-bottom:0}#scan-card.done .scan-steps li:not(.done){display:none}.cats{list-style:none;margin:0;padding:0;display:grid;gap:4px}.cat{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;cursor:pointer;user-select:none;transition:background .12s}.cat:hover{background:var(--card-2)}.cat .ic{width:24px;text-align:center}.cat .lbl{flex:1;font-size:14px}.cat .n{min-width:22px;text-align:center;font-size:12px;font-weight:700;color:var(--muted);background:var(--card-2);border-radius:999px;padding:1px 8px}.cat.has .n{color:#071016;background:var(--accent-2)}.cat.none{opacity:.55}.switch{width:34px;height:20px;border-radius:99px;background:#2a3045;position:relative;transition:background .15s;flex:none}.switch:after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .15s}.cat.enabled .switch{background:var(--accent)}.cat.enabled .switch:after{transform:translate(14px)}.seg{display:grid;grid-template-columns:repeat(3,1fr);background:var(--card-2);border-radius:12px;padding:4px;gap:4px}.seg button{font:inherit;font-weight:600;font-size:13.5px;color:var(--muted);background:transparent;border:0;padding:8px;border-radius:9px;cursor:pointer}.seg button.on{background:#262c42;color:var(--text);box-shadow:inset 0 0 0 1px #37406090}.slider{display:flex;align-items:center;gap:12px;margin-top:14px;font-size:13.5px;color:var(--muted)}.slider input{flex:1;accent-color:var(--accent)}.meta{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:13.5px}.meta li{display:flex;gap:10px;align-items:baseline}.meta .k{color:var(--muted);flex:none}.meta .v{margin-left:auto;text-align:right;word-break:break-word}.meta .v.high{color:var(--bad)}.meta .empty{color:var(--muted)}.export{position:sticky;bottom:8px;display:grid;gap:10px;background:linear-gradient(180deg,#151927,#12151d)}.row{display:flex;gap:10px}.fmt{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:13.5px;width:100%}.fmt select{flex:1;font:inherit;color:var(--text);background:var(--card-2);border:1px solid var(--line);border-radius:10px;padding:8px 10px}.save-note{font-size:13px;color:var(--good);background:#34d39917;border:1px solid rgba(52,211,153,.3);border-radius:12px;padding:10px 12px}.save-note.bad{color:var(--warn);background:#fbbf2417;border-color:#fbbf244d}.fine{margin:0;color:#66708b;font-size:12px;text-align:center}.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%);z-index:20;background:#1b2032;border:1px solid #333c5c;color:var(--text);padding:12px 18px;border-radius:14px;box-shadow:0 16px 50px -10px #000;font-size:14px;max-width:90vw}.dragveil{position:fixed;inset:0;z-index:30;display:grid;place-items:center;background:#0a0c11cc;backdrop-filter:blur(6px);font-size:28px;font-weight:800}.dragveil>div{padding:40px 60px;border:3px dashed var(--accent-2);border-radius:28px}.foot{position:relative;z-index:1;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:18px clamp(16px,4vw,40px);color:#59627d;font-size:12.5px;border-top:1px solid #141824}@media(max-width:980px){#workspace{grid-template-columns:1fr}.stage-col{position:static}#preview{max-height:60vh}.export{position:static}.pill,.step-arrow{display:none}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}.try-row{display:grid;gap:10px;justify-items:center}.try-label{color:var(--muted);font-size:13.5px}.samples{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}.chip{font:inherit;font-size:13.5px;font-weight:600;color:var(--text);background:#12151db3;border:1px solid var(--line);border-radius:999px;padding:7px 14px;cursor:pointer;transition:border-color .15s,background .15s,transform .08s}.chip:hover{border-color:var(--accent-2);background:#1c2130}.chip:active{transform:translateY(1px)}.faq{margin:48px auto 0;max-width:760px;text-align:left}.faq h2{font-size:22px;letter-spacing:-.01em;margin:0 0 14px;text-align:center}.faq details{background:#12151db3;border:1px solid var(--line);border-radius:12px;padding:12px 16px;margin-bottom:8px}.faq summary{cursor:pointer;font-weight:600}.faq details[open] summary{margin-bottom:6px}.faq p{margin:0;color:var(--muted);font-size:14px}noscript .error{display:block}
