:root{--bg: #0b0c0f;--panel: #111318;--elev: #171a21;--text: #e6e8ee;--muted: #a8adbb;--primary: #5b8cff;--primary-600: #4678f4;--primary-700: #3a66d6;--danger: #ff5b6e;--success: #34d399;--border: #242936;--shadow: 0 4px 16px rgba(0,0,0,.35);--radius: 12px;--radius-sm: 8px;--gap: 12px;--gap-lg: 16px;--gap-xl: 24px}@media (prefers-color-scheme: light){:root{--bg: #f7f8fb;--panel: #ffffff;--elev: #ffffff;--text: #0b0c0f;--muted: #616775;--primary: #3b82f6;--primary-600: #2563eb;--primary-700: #1d4ed8;--danger: #ef4444;--success: #16a34a;--border: #e7e9ee;--shadow: 0 6px 20px rgba(2,6,23,.08)}}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,Arial,"Apple Color Emoji","Segoe UI Emoji";background:radial-gradient(1200px 800px at 10% -10%,rgba(91,140,255,.18),transparent 60%),radial-gradient(1000px 700px at 100% 0%,rgba(52,211,153,.12),transparent 55%),var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.container{max-width:1040px;margin:0 auto;padding:24px 16px 32px;display:grid;gap:var(--gap-xl)}.app-header{position:sticky;top:0;z-index:20;-webkit-backdrop-filter:saturate(130%) blur(8px);backdrop-filter:saturate(130%) blur(8px);background:color-mix(in oklab,var(--bg),transparent 35%);border-bottom:1px solid var(--border)}.app-bar{display:flex;align-items:center;justify-content:space-between;padding:12px 0}.brand{font-weight:700;letter-spacing:.2px}.tabs{display:flex;gap:8px}.tab{padding:8px 12px;border-radius:999px;color:var(--muted);border:1px solid transparent}.tab:hover{color:var(--text);background:color-mix(in oklab,var(--panel),transparent 40%)}.tab.active{color:var(--text);background:color-mix(in oklab,var(--primary),transparent 80%);border-color:color-mix(in oklab,var(--primary),var(--border) 70%)}.card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px}.card-title{margin:0 0 8px;font-size:16px}.section-title{margin:0 0 8px;font-size:15px;opacity:.9}.surface-subtle{background:color-mix(in oklab,var(--panel),var(--elev) 85%)}.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.stack{display:grid;gap:10px}.input,.file,.select,textarea{background:var(--elev);color:var(--text);border:1px solid var(--border);border-radius:var(--radius-sm);padding:10px 12px;outline:none;min-width:0}.input::placeholder{color:var(--muted)}.input:focus,.file:focus,.select:focus,textarea:focus{border-color:color-mix(in oklab,var(--primary),var(--border) 60%);box-shadow:0 0 0 3px color-mix(in oklab,var(--primary),transparent 85%)}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--border);background:color-mix(in oklab,var(--panel),var(--elev) 65%);color:var(--text);border-radius:10px;padding:10px 14px;cursor:pointer;transition:transform .06s ease,background .2s ease,border-color .2s ease,box-shadow .2s ease}.btn:hover{transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn:focus-visible{outline:none;box-shadow:0 0 0 3px color-mix(in oklab,var(--primary),transparent 85%)}.btn[disabled]{opacity:.55;cursor:not-allowed}.btn-primary{background:linear-gradient(180deg,color-mix(in oklab,var(--primary),white 6%),var(--primary-600));border-color:color-mix(in oklab,var(--primary),black 25%);box-shadow:0 6px 16px color-mix(in okLab,var(--primary),transparent 80%)}.btn-ghost{background:transparent}.btn-danger{background:linear-gradient(180deg,color-mix(in oklab,var(--danger),white 12%),var(--danger));border-color:color-mix(in oklab,var(--danger),black 25%)}.btn-outline{background:transparent;border-style:dashed}.btn-sm{padding:6px 10px;border-radius:8px}.grid{display:grid;gap:var(--gap)}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}@media (max-width: 720px){.grid-2,.grid-3{grid-template-columns:1fr}}.muted{color:var(--muted)}.divider{border-top:1px solid var(--border);margin:8px 0}.badge{display:inline-block;border:1px solid var(--border);background:color-mix(in oklab,var(--panel),var(--elev) 70%);color:var(--text);padding:4px 8px;border-radius:999px;font-size:12px}.alert{padding:10px 12px;border-radius:10px;border:1px solid var(--border)}.alert-success{background:color-mix(in oklab,var(--success),transparent 85%)}.alert-error{background:color-mix(in oklab,var(--danger),transparent 85%)}.list{display:grid;gap:6px}.list-item{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;background:color-mix(in oklab,var(--panel),var(--elev) 85%);border:1px solid var(--border);border-radius:var(--radius-sm)}.list-item:hover{background:color-mix(in oklab,var(--panel),var(--elev) 75%)}.progress{height:10px;background:color-mix(in oklab,var(--panel),var(--elev) 80%);border-radius:999px;overflow:hidden;border:1px solid var(--border)}.progress-bar{height:100%;background:linear-gradient(90deg,var(--success),color-mix(in oklab,var(--success),white 10%));color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;transition:width .35s ease}pre{background:var(--elev);border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px;overflow:auto}ol,ul{margin:6px 0 0;padding-left:18px}li+li{margin-top:4px}.page{display:grid;gap:var(--gap-lg)}.dropzone{border:1px dashed var(--border);background:color-mix(in oklab,var(--panel),var(--elev) 80%);color:var(--muted);border-radius:var(--radius-sm);min-height:120px;display:grid;place-items:center;text-align:center;padding:16px;cursor:pointer}.dropzone:hover{background:color-mix(in oklab,var(--panel),var(--elev) 70%);color:var(--text)}.dropzone.is-dragover{border-color:color-mix(in oklab,var(--primary),var(--border) 30%);box-shadow:0 0 0 3px color-mix(in oklab,var(--primary),transparent 85%);color:var(--text)}.preview{max-width:100%;max-height:180px;border-radius:8px;box-shadow:var(--shadow)}.scroll{overflow:auto}.spinner{width:14px;height:14px;border:2px solid color-mix(in oklab,var(--text),transparent 75%);border-top-color:var(--text);border-radius:50%;display:inline-block;animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}