:root{--bg:#050711;--panel:rgba(255,255,255,.08);--line:rgba(255,255,255,.16);--text:#f4f7ff;--muted:#9aa7c7;--hot:#00f5ff;--pink:#ff2bd6;--green:#75ff83}*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,Segoe UI,Arial,sans-serif;background:radial-gradient(circle at top left,#18245e,transparent 35%),radial-gradient(circle at bottom right,#5a114f,transparent 30%),var(--bg);color:var(--text);min-height:100vh}.shell{width:min(1120px,92vw);margin:0 auto;padding:34px 0}.hero{display:grid;gap:20px;grid-template-columns:1.1fr .9fr;align-items:center;min-height:92vh}.card{background:linear-gradient(135deg,rgba(255,255,255,.11),rgba(255,255,255,.04));border:1px solid var(--line);border-radius:28px;box-shadow:0 25px 80px rgba(0,0,0,.38);backdrop-filter:blur(18px);padding:28px}.brand{font-size:clamp(42px,8vw,92px);line-height:.9;margin:0;letter-spacing:-4px;text-transform:uppercase}.glow{background:linear-gradient(90deg,var(--hot),var(--pink));-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 34px rgba(0,245,255,.18)}p{color:var(--muted);font-size:17px;line-height:1.65}.grid{display:grid;gap:18px}.two{grid-template-columns:1fr 1fr}label{display:block;margin:13px 0 7px;color:#dbe5ff;font-size:13px;text-transform:uppercase;letter-spacing:.12em}input,select,button,textarea{width:100%;border:1px solid var(--line);border-radius:16px;padding:14px 16px;background:rgba(0,0,0,.28);color:var(--text);font-size:15px}input[type=file]{padding:12px}button{cursor:pointer;background:linear-gradient(90deg,var(--hot),var(--pink));border:0;color:#04101a;font-weight:900;text-transform:uppercase;letter-spacing:.08em;box-shadow:0 0 28px rgba(0,245,255,.18);transition:.2s}button:hover{transform:translateY(-2px);filter:saturate(1.2)}.ghost{background:rgba(255,255,255,.08);color:var(--text);border:1px solid var(--line);box-shadow:none}.danger{background:linear-gradient(90deg,#ff4b4b,#ffb000)}.ok{background:linear-gradient(90deg,#48ffb4,var(--green))}.pill{display:inline-flex;padding:8px 12px;border-radius:999px;background:rgba(0,245,255,.12);border:1px solid rgba(0,245,255,.35);color:#bdfcff;font-size:12px;text-transform:uppercase;letter-spacing:.12em}.queue{display:grid;gap:12px;margin-top:18px}.track{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center;border:1px solid var(--line);border-radius:20px;padding:16px;background:rgba(0,0,0,.22)}.track h3{margin:0 0 4px;font-size:18px}.track small{color:var(--muted)}.actions{display:flex;gap:10px}.actions button{padding:10px 12px;border-radius:12px}.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.player{min-height:100vh;display:grid;place-items:center;text-align:center}.pulse{width:260px;height:260px;border-radius:50%;margin:auto;background:conic-gradient(from 180deg,var(--hot),var(--pink),var(--hot));filter:drop-shadow(0 0 45px rgba(0,245,255,.28));animation:spin 8s linear infinite;display:grid;place-items:center}.pulse:after{content:'';width:110px;height:110px;border-radius:50%;background:var(--bg);border:1px solid var(--line)}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:850px){.hero,.two{grid-template-columns:1fr}.brand{letter-spacing:-2px}.track{grid-template-columns:1fr}.actions{flex-direction:column}}.logo-wrap {
    display: flex;
    justify-content: center;
    margin-bottom: 30px;
}

.logo {
    width: 280px;
    max-width: 90%;
    filter:
        drop-shadow(0 0 12px rgba(0, 255, 255, 0.5))
        drop-shadow(0 0 24px rgba(255, 0, 255, 0.3));
}

.dashboard-header {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 30px;
}

.logo-small {
    width: 120px;
    filter:
        drop-shadow(0 0 10px rgba(0, 255, 255, 0.5));
}

.subtitle {
    color: #9aa4c7;
    margin-top: 6px;
}

.glow {
    color: #ffffff;
    text-shadow:
        0 0 10px #00d9ff,
        0 0 20px #00d9ff,
        0 0 30px #ff00ff;
}

.logo-wrap {
    display: flex;
    justify-content: center;

    margin-top: -80px;
    margin-bottom: 20px;
}

.grid label {
    margin-bottom: 4px;
}

.grid input,
.grid select,
.grid textarea {
    margin-top: 0;
}

.grid {
    gap: 10px;
}