:root{--bg: #0b0c10;--card: #121318;--muted: #8a8f98;--text: #e6e9ef;--accent: #6aa6ff;--accent-2: #67e8f9;--border: #20222b;--ok: #22c55e;--err: #ef4444}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:linear-gradient(180deg,#0b0c10,#0f172a);color:var(--text);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,Arial,"Apple Color Emoji","Segoe UI Emoji"}.container{max-width:960px;margin:0 auto;padding:32px 20px}header{margin-bottom:18px}h1{margin:0 0 6px;font-size:28px;letter-spacing:.2px}.subtitle{margin:0;color:var(--muted)}.dropzone{margin-top:18px;background:var(--card);border:2px dashed var(--border);border-radius:12px;padding:22px;transition:all .15s ease;cursor:pointer}.dropzone.over{border-color:var(--accent);box-shadow:0 0 0 2px #1f2a40 inset}.dropzone:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.dz-inner{display:flex;align-items:center;gap:14px}.dz-icon{font-size:36px}.dz-help{color:var(--muted);font-size:14px}.controls{display:grid;grid-template-columns:repeat(auto-fit,minmax(360px,1fr));gap:16px;margin:20px 0}.control{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:14px}label{display:block;font-weight:600;margin-bottom:8px}.hint{color:var(--muted);font-weight:400}.range-row{display:grid;grid-template-columns:1fr 64px;gap:10px;align-items:center}output{display:inline-block;background:#111827;border:1px solid var(--border);border-radius:8px;padding:6px 10px;text-align:center}.segmented{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:8px;background:#0e1320;border:1px solid var(--border);padding:6px;border-radius:12px}.segmented button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;border-radius:8px;padding:10px 12px;color:var(--muted);background:transparent;display:flex;align-items:center;justify-content:center;gap:8px;font-weight:600;cursor:pointer;min-width:0}.segmented button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.segmented button.active{background:linear-gradient(180deg,#101827,#0c1220);color:var(--text);box-shadow:0 0 0 1px var(--border) inset,0 6px 16px #00000040}.segmented .badge{display:inline-block;background:#0b1220;border:1px solid var(--border);color:var(--accent);font-size:12px;padding:2px 6px;border-radius:999px}.segmented .seg-title{letter-spacing:.2px}.mode-grid{grid-column:1 / -1;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}.mode-card{background:#0b1220;border:1px solid var(--border);border-radius:12px;padding:14px;transition:border-color .15s ease,transform .15s ease}.mode-card.active{border-color:var(--accent);transform:translateY(-1px)}.mode-card .title{display:flex;align-items:baseline;gap:8px;margin-bottom:8px}.mode-card .desc{margin:6px 0 0;color:var(--muted)}.mode-card .muted{margin:8px 0 0;color:var(--muted);font-size:14px}.manual-settings{display:grid;gap:12px}.manual-settings .field label{margin-bottom:6px}.progress{position:relative;width:100%;height:8px;background:#0c1220;border:1px solid var(--border);border-radius:999px;overflow:hidden}.progress .bar{position:absolute;left:0;top:0;bottom:0;width:0%;background:linear-gradient(90deg,var(--accent),var(--accent-2));transition:width .15s ease}.skeleton{position:relative;display:block;background:#0f172a;border-radius:8px;overflow:hidden}.skeleton:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;transform:translate(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.06),transparent);animation:shimmer 1.2s infinite}@keyframes shimmer{to{transform:translate(100%)}}.controls .control:first-child{grid-column:1 / -1}.actions{display:flex;align-items:center;gap:14px;margin:8px 0 18px}button.primary{background:linear-gradient(90deg,var(--accent),var(--accent-2));color:#001227;border:0;padding:12px 16px;border-radius:10px;font-weight:700;transition:transform .05s ease;box-shadow:0 8px 20px #4b77fc40}button.primary:disabled{filter:grayscale(.7);opacity:.7;cursor:not-allowed}a.link{color:var(--muted);text-decoration:none}a.link:hover{color:var(--text);text-decoration:underline}.toast{margin-top:6px;background:#0b1220;border:1px solid var(--border);border-left:4px solid var(--ok);border-radius:10px;padding:12px 14px;color:#d1fae5}.toast:has(.error){border-left-color:var(--err);color:#fee2e2}footer{margin-top:16px;color:var(--muted);font-size:13px}.dropzone.over{transform:translateY(-1px)}button.primary:not(:disabled):hover{transform:translateY(-1px)}button.primary:active{transform:translateY(1px) scale(.995)}
