:root{
  --bg:#000; --fg:#e6f7ff; --mut:#7bdcff; --card:#080b10; --accent:#00f0ff; --accent2:#00ffa3;
  --glowA: 0 0 12px rgba(0,240,255,.55), 0 0 28px rgba(0,255,163,.45);
}
*{box-sizing:border-box;font-family:system-ui, -apple-system, Segoe UI, Roboto, Inter, 'Orbitron', sans-serif}
html,body{margin:0;background:none;}
.hdr{padding:20px 16px; border-bottom:1px solid #0f1a22; background:linear-gradient(180deg,#02070a,transparent);text-align: center;}
.hdr h1{margin:0; font-family:'Orbitron',system-ui,sans-serif; letter-spacing:.5px; text-shadow:var(--glowA)}
.tag{color:var(--mut);margin:.25rem 0 0}
.wrap{max-width:1080px;margin:20px auto;padding:0 12px;display:grid;gap:16px}
.card{background:linear-gradient(180deg,#05090e,#050a11 40%, #05080e);
      border:1px solid #0e1f27;border-radius:20px;padding:16px;box-shadow:0 10px 30px rgba(0,0,0,.45), var(--glowA)}
.card h2{margin:.25rem 0 1rem;font-family:'Orbitron',system-ui,sans-serif}
label{display:block;margin:.5rem 0}
input,select,textarea{width:100%;padding:12px;border-radius:12px;border:1px solid #0e1f27;background:#03080d;color:var(--fg);
  box-shadow:inset 0 0 0 1px rgba(0,240,255,.04)}
input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 0 2px rgba(0,240,255,.35)}
textarea{resize:vertical}
.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.btn{padding:11px 16px;border-radius:14px;border:1px solid #0e1f27;background:#06121a;color:var(--fg);cursor:pointer;transition:.2s transform,.2s filter}
.btn:hover{filter:brightness(1.15)}
.btn:active{transform:translateY(1px) scale(.995)}
.btn.neon{border-color:var(--accent);box-shadow:var(--glowA); text-shadow:var(--glowA)}
.ck{display:flex;align-items:center;gap:.5rem}
.mono{font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;color:#bfefff}
.sm{font-size:.9rem}
.job{border-top:1px solid #0e1f27;padding:.75rem 0}
.progress{height:12px;background:#030b11;border-radius:999px;border:1px solid #0e1f27;overflow:hidden; box-shadow:inset 0 0 14px rgba(0,0,0,.6)}
.progress > div{height:100%;background:linear-gradient(90deg, var(--accent), var(--accent2));width:0%; animation: flow 2.5s linear infinite}
@keyframes flow{0%{filter:hue-rotate(0)}100%{filter:hue-rotate(360deg)}}
.files{list-style:none;padding:0;margin:.5rem 0 0}
.files li{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;border-bottom:1px solid #0e1f27;padding:10px 0}
.badge{font-size:.75rem;padding:.2rem .5rem;border:1px solid #0e1f27;border-radius:999px;background:#041018;color:#7bdcff;display: none;}
.ft{padding:24px;color:#7bdcff;text-align:center}

/* DnBCD banners, modals, toasts */
.video-banner{display:grid;grid-auto-flow:column;gap:14px;align-items:center;padding:10px 14px;border:1px solid #0e1f27;border-radius:16px;background:linear-gradient(180deg,#041117,#030b12);box-shadow:var(--glowA)}
.video-banner .title{font-family:'Orbitron'; letter-spacing:.4px; text-shadow:var(--glowA)}
.modal{position:fixed;inset:0;display:none;place-items:center;background:rgba(0,0,0,.65);backdrop-filter:blur(6px);z-index:9999}
.modal.show{display:grid}
.modal .sheet{width:min(720px,96vw);max-height:86vh;overflow:auto;background:#050a11;border:1px solid #0e1f27;border-radius:18px;box-shadow:var(--glowA);padding:16px}
.toast{position:fixed;right:18px;bottom:18px;z-index:2147483647; display:flex; flex-direction:column; gap:8px}
.toast .t{min-width:260px; max-width:360px; background:#031018; border:1px solid #0e1f27; padding:12px 14px; border-radius:14px; box-shadow:var(--glowA); opacity:0; transform:translateY(8px); transition:.25s}
.toast .t.show{opacity:1; transform:translateY(0)}
.toast .t .title{font-family:'Orbitron'; font-size:.95rem; margin-bottom:4px; color:#a8fff4}
.toast .t .msg{font-size:.9rem; color:#c9f7ff}