:root{--bg-0: #07070f;--bg-1: #0b0d18;--surface: #0e1424;--surface-strong: #151b2f;--text: #eef2ff;--muted: #9aa4c1;--neon-blue: #47f5ff;--neon-purple: #9d7bff;--neon-pink: #ff59d9;--neon-green: #6effa8;--danger: #ff5c7a}*{box-sizing:border-box}body{font-family:Inter,system-ui,sans-serif;background:radial-gradient(1200px 1200px at 20% 0%,rgba(71,245,255,.08),transparent),radial-gradient(1000px 1000px at 100% 10%,rgba(157,123,255,.08),transparent),var(--bg-0);color:var(--text);margin:0;min-height:100vh}a{color:inherit}button{font-family:inherit}.app-shell{display:flex;min-height:100vh}.sidebar{width:280px;padding:32px 24px;background:linear-gradient(180deg,#0e1424f2,#090c16f2);border-right:1px solid rgba(71,245,255,.2);box-shadow:inset -1px 0 #9d7bff33;position:sticky;top:0;height:100vh;overflow-y:auto}.brand{display:flex;flex-direction:column;gap:4px;margin-bottom:24px}.logo-text{font-size:1.6rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--neon-blue);text-shadow:0 0 14px rgba(71,245,255,.6)}.logo-sub{font-size:.85rem;text-transform:uppercase;letter-spacing:.3em;color:var(--muted)}.user-card{display:flex;flex-direction:column;gap:10px;padding:16px;border-radius:16px;background:#0f1424e6;border:1px solid rgba(71,245,255,.2)}.user-name{font-weight:600}.user-role{color:var(--muted);font-size:.85rem}.sidebar-section{margin-top:28px}.section-title{font-size:.75rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-bottom:12px}.server-list{display:flex;flex-direction:column;gap:10px}.server-item{display:flex;align-items:center;gap:10px;width:100%;border-radius:12px;padding:10px 12px;border:1px solid rgba(157,123,255,.15);background:#0a0d16e6;color:var(--text);cursor:pointer;transition:border .2s ease,box-shadow .2s ease,transform .2s ease;text-align:left}.server-item:hover{transform:translate(2px);border-color:#47f5ff80}.server-item.active{border-color:var(--neon-blue);box-shadow:0 0 16px #47f5ff59}.status-dot{width:8px;height:8px;border-radius:50%;background:#546079;box-shadow:0 0 6px #54607999}.status-dot.playing{background:var(--neon-green);box-shadow:0 0 10px #6effa8cc}.status-dot.paused{background:#ffc857;box-shadow:0 0 10px #ffc857b3}.status-dot.idle{background:#5b6b87}.server-name{flex:1;font-weight:600}.server-meta{font-size:.8rem;color:var(--muted)}.main{flex:1;padding:32px 40px 48px}.topbar{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:24px}.top-actions{display:flex;gap:12px;align-items:center}.summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin-bottom:24px}.summary-card{padding:16px;border-radius:16px;background:#0e1424d9;border:1px solid rgba(71,245,255,.15);display:flex;flex-direction:column;gap:6px}.summary-label{font-size:.75rem;letter-spacing:.15em;text-transform:uppercase;color:var(--muted)}.panel-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:20px}.panel{padding:20px;border-radius:18px;background:#0e1424e6;border:1px solid rgba(71,245,255,.18);position:relative;overflow:hidden}.neon-card{animation:neonPulse 6s ease-in-out infinite;box-shadow:0 0 18px #47f5ff1f;position:relative;overflow:hidden}.neon-card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;padding:1px;border-radius:inherit;background:linear-gradient(120deg,#ff4fd8,#ff7b4f,#ffd04f,#6effa8,#47f5ff,#6a7dff,#b36bff,#ff4fd8);background-size:300% 300%;animation:chromaBorder 6s linear infinite;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}.panel-main{grid-column:span 7}.panel-actions,.panel-settings{grid-column:span 5}.panel-wide{grid-column:span 12}.panel-header{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:12px}.status-pill{padding:6px 12px;border-radius:999px;font-size:.75rem;text-transform:uppercase;letter-spacing:.1em}.status-pill.playing{color:#04160f;background:var(--neon-green)}.status-pill.paused{color:#2b1a00;background:#ffc857}.status-pill.idle{color:#e0e6f8;background:#44506a}.current-track{margin-top:16px;padding:12px;border-radius:12px;background:#0a0e18cc}.track-title{font-size:1.05rem;font-weight:600;margin-top:6px}.track-meta{color:var(--muted);font-size:.85rem;margin-top:4px}.control-group{margin-top:16px}.controls{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}.queue-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}.controls button,.queue-actions button,.history-list button{background:#141a2ce6;color:var(--text);border:1px solid rgba(71,245,255,.2);padding:8px 12px;border-radius:10px;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.controls button:hover,.queue-actions button:hover,.history-list button:hover{transform:translateY(-1px);border-color:var(--neon-blue);box-shadow:0 0 12px #47f5ff59}.field{margin-top:16px;display:flex;flex-direction:column;gap:8px}.field input,.field select,textarea{background:#070a12e6;color:var(--text);border:1px solid rgba(71,245,255,.2);border-radius:10px;padding:10px}.queue-list{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:10px}.queue-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px;border-radius:12px;background:#080c16d9;border:1px solid rgba(157,123,255,.2)}.queue-title{font-weight:600}.panel-stack{margin-top:28px;display:grid;gap:20px}.log-output{background:#05070ce6;padding:16px;border-radius:12px;max-height:320px;overflow:auto;font-size:.85rem}.button{background:linear-gradient(120deg,#47f5ff4d,#9d7bff66);color:var(--text);border:1px solid rgba(71,245,255,.6);padding:10px 16px;border-radius:12px;text-decoration:none;font-weight:600;display:inline-flex;align-items:center;justify-content:center;gap:8px;box-shadow:0 0 16px #47f5ff40;cursor:pointer}.button.ghost{background:transparent;border:1px solid rgba(157,123,255,.5);box-shadow:none}.alert{background:#ff5c7a1a;border:1px solid rgba(255,92,122,.6);padding:12px 14px;border-radius:12px;margin-bottom:16px}.muted{color:var(--muted)}.small{font-size:.85rem}.login-shell{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}.login-card{max-width:420px;width:100%;padding:32px;border-radius:20px;text-align:center;display:flex;flex-direction:column;gap:16px}.history-list{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:8px}.history-list li{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;background:#080c16d9;padding:8px 12px;border-radius:10px}@keyframes neonPulse{0%{box-shadow:0 0 12px #47f5ff33,0 0 24px #9d7bff33}50%{box-shadow:0 0 18px #47f5ff66,0 0 32px #9d7bff4d}to{box-shadow:0 0 12px #47f5ff33,0 0 24px #9d7bff33}}@keyframes chromaBorder{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}@media (max-width: 1100px){.app-shell{flex-direction:column}.sidebar{width:100%;height:auto;position:static}.main{padding:24px}.panel-grid{grid-template-columns:repeat(1,minmax(0,1fr))}.panel-main,.panel-actions,.panel-settings,.panel-wide{grid-column:span 1}}