/* Same styling as previous dashboard with neon hover (trimmed for brevity) */
:root{--bg:#070811;--bg2:#0b0e1d;--ink:#e7ecff;--muted:#9fb0d0;--primary:#4d6bff;--accent:#8a5cff}
*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:radial-gradient(1000px 600px at 70% -10%,rgba(109,97,255,.25),transparent 60%),linear-gradient(180deg,var(--bg),var(--bg2));color:var(--ink);font-family:ui-sans-serif,system-ui,Inter,Segoe UI,Roboto,Arial}
.bg::before{content:"";position:fixed;inset:-10%;pointer-events:none;z-index:-1;background:radial-gradient(600px 400px at 20% 10%,rgba(77,107,255,.28),transparent 60%),radial-gradient(700px 500px at 90% 0,rgba(138,92,255,.22),transparent 60%);filter:blur(50px)}
.topbar{position:sticky;top:0;display:flex;justify-content:space-between;align-items:center;padding:12px 18px;background:rgba(7,8,17,.55);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.08)}
.brand{display:flex;align-items:center;gap:10px;font-weight:700}.brand img{width:28px;height:28px}.brand small{opacity:.8}
.topnav{display:flex;gap:16px}.layout{display:grid;grid-template-columns:380px 1fr;gap:18px;padding:18px}
.panel,.preview{background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:16px;box-shadow:0 0 0 1px rgba(123,110,255,.14),0 14px 44px rgba(88,70,255,.18)}
label{display:block;font-size:14px;color:#cdd6ff;margin:10px 0 6px}input,textarea{width:100%;background:#0c1130;color:#e6ebff;border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:10px 12px;outline:none}
input:focus,textarea:focus{border-color:rgba(120,100,255,.6);box-shadow:0 0 0 3px rgba(120,100,255,.2)}textarea{resize:vertical}
.colors{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.actions{display:flex;gap:10px;margin-top:12px}
.btn{background:linear-gradient(135deg,var(--primary),var(--accent));border:0;color:#fff;padding:12px 16px;border-radius:12px;font-weight:700;cursor:pointer;box-shadow:0 10px 34px rgba(104,88,255,.35);transition:transform .2s,box-shadow .2s;position:relative;overflow:hidden}
.btn:hover{transform:translateY(-2px);box-shadow:0 18px 64px rgba(104,88,255,.45)}
.btn::after{content:"";position:absolute;inset:-2px;background:radial-gradient(120px 60px at var(--mx,50%) 0,rgba(255,255,255,.25),transparent 60%);opacity:0;transition:opacity .25s}.btn:hover::after{opacity:1}
.btn.ghost{background:transparent;border:1px solid rgba(255,255,255,.14)}.btn[disabled]{opacity:.6;cursor:not-allowed;box-shadow:none}
.status{display:flex;gap:12px;align-items:center;margin-top:12px;background:#0b0f25;padding:10px 12px;border-radius:12px;border:1px solid rgba(255,255,255,.08)}.hidden{display:none}
.spinner{width:18px;height:18px;border:3px solid rgba(255,255,255,.18);border-top-color:#9d83ff;border-radius:999px;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
.steps{list-style:none;padding:0;margin:10px 0}.steps li{display:flex;align-items:center;gap:8px;font-weight:700;color:#d7dcff}.steps span{display:grid;place-items:center;width:22px;height:22px;border-radius:999px;background:rgba(141,102,255,.22);border:1px solid rgba(141,102,255,.5)}
.preview-head{display:flex;justify-content:space-between;align-items:center;padding:6px 8px 10px}.badge{background:rgba(141,102,255,.22);border:1px solid rgba(141,102,255,.45);padding:6px 10px;border-radius:999px;font-size:12px}
iframe{width:100%;height:72vh;background:#0b0f25;border:1px solid rgba(255,255,255,.08);border-radius:12px}.preview-help{opacity:.8;padding:6px 8px}
.site-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 18px;border-top:1px solid rgba(255,255,255,.08)}.site-footer img{width:20px;height:20px}
@media (max-width:980px){.layout{grid-template-columns:1fr}iframe{height:62vh}}