:root{--bg: #0b0f14;--panel: #0f1720;--fg: #e5e7eb;--muted: #94a3b8;--border: #1e293b;--accent: #38bdf8;--accent-2: #22d3ee;--ok: #22c55e;--warn: #fbbf24;--err: #ef4444;--radius: 12px;--green1: #10b981;--green2: #34d399;--purple1: #8b5cf6;--purple2: #a78bfa;--orange1: #f59e0b;--orange2: #fbbf24}*,*:before,*:after{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;background:radial-gradient(1200px 800px at 20% 0%,#0f172a 0%,var(--bg) 60%);color:var(--fg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.container{max-width:960px;margin:2rem auto;padding:1rem}h1,h2,h3{margin:0 0 .5rem;line-height:1.2}p{margin:.25rem 0 .75rem;color:var(--muted)}.muted{color:var(--muted)}input,select,button{font:inherit}input,select{width:100%;padding:12px 14px;border:1px solid var(--border);border-radius:var(--radius);background:#0b1220;color:var(--fg)}select:focus,input:focus,button:focus{outline:2px solid var(--accent);outline-offset:2px}button{border:1px solid var(--border);background:#0b1220;color:var(--fg);padding:12px 16px;border-radius:var(--radius);cursor:pointer;transition:transform .08s ease,background .15s ease,border-color .15s ease,box-shadow .15s ease,color .15s ease}button:hover{background:#0e1526;border-color:#263042}button:active{transform:translateY(1px) scale(.99)}button.primary{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#041018;border:none;box-shadow:0 8px 24px #22d3ee40}button.primary:hover{filter:brightness(1.05);box-shadow:0 10px 28px #38bdf847}button.primary:disabled{opacity:.65;cursor:not-allowed;filter:grayscale(.2)}.btn-lg{width:100%;padding:14px 18px;font-weight:700;border-radius:14px}.btn-clear{background:#fbbf24;color:#0b1220;border:1px solid var(--border)}.btn-clear:hover{background:#dba417}.card{border:1px solid var(--border);border-radius:var(--radius);background:var(--panel);padding:14px}.row{display:flex;gap:12px;align-items:center}.grid-2{display:grid;grid-template-columns:1fr auto;gap:10px}.grid-3{display:grid;grid-template-columns:1fr auto auto;gap:10px}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-6{margin-top:1.5rem}.section{border:1px solid var(--border);border-radius:14px;padding:12px;background:#0b1522}.section.active{outline:2px solid rgba(34,211,238,.35);background:#0a1c2b}.section h3{margin:0 0 6px;font-size:16px;font-weight:700}.alert-warn{border:1px solid rgba(251,191,36,.35);background:#fbbf241f;color:#fde68a;padding:10px 12px;border-radius:10px}.alert-err{border:1px solid rgba(239,68,68,.35);background:#ef44441a;color:#fecaca;padding:10px 12px;border-radius:10px}.tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.tab{position:relative;border-radius:12px;padding:10px 12px 10px 36px;background:transparent;color:var(--fg);cursor:pointer;border:2px solid var(--border);transition:transform .06s ease,box-shadow .15s ease,filter .15s ease,background .15s ease,border-color .15s ease}.tab:active{transform:translateY(1px) scale(.99)}.tab .dot{position:absolute;left:10px;top:50%;transform:translateY(-50%);width:10px;height:10px;border-radius:999px;border:2px solid currentColor;background:transparent;transition:background .15s ease,transform .15s ease}.tab-green{border-color:var(--green1);color:var(--green2)}.tab-purple{border-color:var(--purple1);color:var(--purple2)}.tab-orange{border-color:var(--orange1);color:var(--orange2)}.tab-green:hover{background:linear-gradient(135deg,var(--green1),var(--green2));color:#03140d}.tab-purple:hover{background:linear-gradient(135deg,var(--purple1),var(--purple2));color:#130b22}.tab-orange:hover{background:linear-gradient(135deg,var(--orange1),var(--orange2));color:#1f1203}.tab.tab-active.tab-green{background:linear-gradient(135deg,var(--green1),var(--green2));color:#03140d}.tab.tab-active.tab-purple{background:linear-gradient(135deg,var(--purple1),var(--purple2));color:#130b22}.tab.tab-active.tab-orange{background:linear-gradient(135deg,var(--orange1),var(--orange2));color:#1f1203}.tab.tab-active .dot{background:currentColor;transform:translateY(-50%) scale(1.2)}.select-green{border-color:#10b98173}.select-purple{border-color:#8b5cf673}.select-orange{border-color:#f59e0b73}.progress-overlay{position:relative;border-radius:16px;overflow:hidden;background:#071017;border:1px solid #0f1a24}.progress-overlay:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(0,255,170,.06) 2px,transparent 2px),linear-gradient(90deg,rgba(0,255,170,.06) 2px,transparent 2px);background-size:6px 6px,6px 6px;animation:gridShift 10s linear infinite;pointer-events:none}@keyframes gridShift{0%{transform:translate(0)}to{transform:translate(-6px,-6px)}}.progress-bar{height:12px;background:#22d3ee2e;border-radius:999px;overflow:hidden;border:1px solid #124559}.progress-bar>div{height:100%;background:linear-gradient(90deg,#06b6d4,#22d3ee,#6ee7b7);width:0%;transition:width .2s ease;box-shadow:0 0 20px #22d3ee59}.matrix-log{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,Liberation Mono,monospace;font-size:12px;color:#86efac;max-height:220px;overflow:auto;padding:10px 12px;background:#022c2838;border:1px solid rgba(20,83,75,.4);border-radius:10px;line-height:1.35}.matrix-log .log-time{color:#5eead4}.matrix-log .log-err{color:#fca5a5}.matrix-log .log-warn{color:#fcd34d}.matrix-log .log-success{color:#86efac}.btn-spinner-row{display:inline-flex;align-items:center;gap:8px}.btn-spinner{width:14px;height:14px;border:2px solid rgba(4,16,24,.35);border-top-color:#041018;border-radius:50%;animation:spin .7s linear infinite;flex-shrink:0}@keyframes spin{to{transform:rotate(360deg)}}.progress-status-row{display:flex;align-items:center;justify-content:space-between;padding:0 2px}.progress-status-badge{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--accent-2);background:#22d3ee14;padding:2px 8px;border-radius:999px;border:1px solid rgba(34,211,238,.2)}.progress-percent{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;font-weight:700;color:var(--accent)}.progress-fill{height:100%;background:linear-gradient(90deg,#06b6d4,#22d3ee,#6ee7b7);transition:width .3s ease;box-shadow:0 0 16px #22d3ee66}.progress-fill-done{background:linear-gradient(90deg,var(--ok),#34d399);box-shadow:0 0 16px #22c55e59}.overlay-done{border-color:#22c55e4d!important}.overlay-done:before{background-image:linear-gradient(rgba(34,197,94,.04) 2px,transparent 2px),linear-gradient(90deg,rgba(34,197,94,.04) 2px,transparent 2px)!important}.log-muted{color:#4b5563;font-style:italic}.completion-card{border:1px solid rgba(34,197,94,.3);border-radius:14px;background:#22c55e0f;padding:16px}.completion-header{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:700;color:var(--ok)}.completion-icon{font-size:20px;line-height:1}.completion-links{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.link-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;text-decoration:none;transition:filter .15s,opacity .15s,background .15s;border:1px solid transparent}.link-btn:hover{filter:brightness(1.1)}.link-btn-primary{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#041018;border-color:transparent}.link-btn-secondary{background:#22d3ee1a;color:var(--accent-2);border-color:#22d3ee40}.link-btn-ghost{background:transparent;color:var(--muted);border-color:var(--border)}.link-btn-ghost:hover{color:var(--fg);background:#ffffff0a;filter:none}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.backend-status-banner{display:flex;align-items:center;gap:10px;padding:10px 14px;margin-bottom:1rem;border-radius:10px;border:1px solid rgba(239,68,68,.3);background:#ef444412;font-size:13px;color:#fca5a5;flex-wrap:wrap}.backend-status-banner a{color:#fca5a5;font-weight:600}.backend-status-banner code{background:#ffffff14;padding:1px 5px;border-radius:4px;font-size:12px}.bsb-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;animation:pulse-dot 1.5s ease-in-out infinite}.bsb-dot-red{background:#ef4444}.bsb-dot-yellow{background:#fbbf24}@keyframes pulse-dot{0%,to{opacity:1}50%{opacity:.4}}.bsb-retry{margin-left:auto;padding:4px 10px;font-size:12px;font-weight:600;border-radius:6px;background:#ef444426;border:1px solid rgba(239,68,68,.4);color:#fca5a5;cursor:pointer}.bsb-retry:hover{background:#ef444440}.backend-status-banner.banner-warn{border-color:#fbbf2459;background:#fbbf2414;color:#fde68a}.backend-status-banner.banner-warn code{background:#ffffff14}
