.app-container{width:min(1200px,100% - 32px);margin:0 auto}.header{align-items:center;margin-bottom:42px;padding-left:32px;display:flex}.logo{font-family:var(--font-display);letter-spacing:2px;text-transform:uppercase;color:var(--neon-cyan);text-shadow:0 0 5px #00f0ffb3,0 0 12px #00f0ff59;align-items:center;gap:12px;font-size:32px;font-weight:700;display:flex}.logo-icon{width:34px;height:34px;color:var(--neon-cyan);stroke-width:2.3px;filter:drop-shadow(0 0 4px #00f0ffa6)drop-shadow(0 0 8px #ff00ff40);flex-shrink:0}button{border-radius:10px;transition:box-shadow .2s,transform .2s,background-color .2s}button:hover:not(:disabled){transform:translateY(-1px)}button:disabled{opacity:.45;cursor:not-allowed}.queue-button,.back-button,.secondary-button,.queue-refresh-button{border:2px solid var(--neon-cyan);color:var(--neon-cyan);font-family:var(--font-display);cursor:pointer;background-color:#0000;padding:12px 18px;font-weight:700}.queue-button{border-color:var(--neon-magenta);color:var(--neon-magenta)}.queue-button:hover:not(:disabled),.back-button:hover:not(:disabled),.secondary-button:hover:not(:disabled),.queue-refresh-button:hover:not(:disabled){box-shadow:0 0 16px #00f0ffa6}.dashboard-main-button:hover:not(:disabled){background-color:#00f0ff1f;box-shadow:0 0 16px #00f0ff73}.player-page{min-height:100vh;padding:34px 20px 60px}.player-content{width:min(1100px,100%);margin:0 auto}.player-title{display:none}.player-help-text{max-width:760px;color:var(--text-muted);margin-bottom:18px;line-height:1.6}.queue-section{background:linear-gradient(145deg, var(--dark-card), var(--dark-surface));border:2px solid var(--neon-magenta);border-radius:18px;margin:34px 0 42px;padding:24px;box-shadow:0 0 20px #ff00ff40,inset 0 0 18px #ff00ff0d}.queue-header{justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px;display:flex}.queue-header h2{font-family:var(--font-display);color:var(--neon-magenta);letter-spacing:2px;text-transform:uppercase;text-shadow:0 0 10px #ff00ffb3;margin:0;font-size:1.15rem}.queue-empty{color:var(--text-muted);line-height:1.5}.queue-list{margin:0;padding:0;list-style:none}.queue-item{border-top:1px solid #ffffff1f;align-items:center;gap:16px;padding:16px 0;display:flex}.queue-item:first-child{border-top:none}.queue-position{background:var(--neon-cyan);color:#050508;width:38px;height:38px;font-family:var(--font-display);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-weight:800;display:flex;box-shadow:0 0 14px #00f0ffbf}.queue-item strong{color:var(--text-main);font-weight:700}.queue-item p{color:var(--text-muted);margin:4px 0 0}.search-input{border:2px solid var(--neon-cyan);width:100%;color:var(--text-main);background-color:#12121aeb;border-radius:14px;margin-bottom:30px;padding:16px 18px;font-size:1rem;box-shadow:0 0 14px #00f0ff38}.search-input::placeholder{color:var(--text-muted)}.search-input:focus{outline:none;box-shadow:0 0 0 3px #00f0ff38,0 0 20px #00f0ff80}.song-section{background:linear-gradient(145deg, var(--dark-card), var(--dark-surface));border:2px solid var(--neon-cyan);border-radius:18px;padding:24px;overflow-x:auto;box-shadow:0 0 22px #00f0ff38,inset 0 0 16px #00f0ff0d}.song-section h2{font-family:var(--font-display);color:var(--neon-cyan);letter-spacing:2px;text-transform:uppercase;margin-bottom:20px}.song-table{border-collapse:collapse;width:100%;min-width:820px}.song-table th{text-align:left;color:var(--neon-magenta);font-family:var(--font-display);letter-spacing:1px;text-transform:uppercase;padding:16px;font-size:.9rem}.song-table td{color:var(--text-main);border-top:1px solid #ffffff1f;padding:16px}.song-table button{background-color:var(--neon-cyan);color:#050508;border-radius:10px;padding:10px 14px}.song-table button:hover:not(:disabled){box-shadow:0 0 16px #00f0ffbf}.auth-page{justify-content:center;align-items:center;min-height:80vh;padding:40px 20px;display:flex}.auth-card{background:linear-gradient(145deg, var(--dark-card), var(--dark-surface));border:2px solid var(--neon-magenta);border-radius:20px;width:min(500px,100%);padding:36px;box-shadow:0 0 25px #f0f6}.auth-title{font-family:var(--font-display);letter-spacing:1px;text-align:center;white-space:nowrap;color:var(--neon-cyan);text-shadow:0 0 5px #00f0ffb3,0 0 12px #00f0ff59;font-size:clamp(1.8rem,4vw,2.1rem);font-weight:700}.auth-subtitle{max-width:360px;color:var(--text-muted);text-align:center;margin:10px auto 30px;line-height:1.5}.auth-input{border:2px solid var(--neon-cyan);width:100%;color:var(--text-main);background-color:#070a12;border-radius:12px;margin-bottom:16px;padding:14px}.auth-input:focus{outline:none;box-shadow:0 0 14px #00f0ff99}.auth-button{background-color:var(--neon-magenta);color:#050508;border-radius:12px;width:100%;padding:14px}.auth-button:hover:not(:disabled){box-shadow:0 0 18px #ff00ffbf}.auth-error{color:#ff8fc7;background:#ff00801f;border:1px solid #ff00808c;border-radius:12px;margin:18px 0;padding:14px 16px;line-height:1.5}.auth-success{color:var(--neon-cyan);background:#00f0ff1a;border:1px solid #00f0ff80;border-radius:12px;margin:18px 0;padding:14px 16px;line-height:1.5}.logout-button{width:100%;color:var(--neon-pink);border:2px solid var(--neon-pink);font-family:var(--font-display);cursor:pointer;background-color:#0000;border-radius:12px;margin-top:24px;padding:14px;font-weight:800}.logout-button:hover:not(:disabled){background-color:#ff00801f;box-shadow:0 0 14px #ff008073}.dashboard-page{justify-content:center;align-items:flex-start;min-height:80vh;padding:40px 20px;display:flex}.dashboard-card{background:linear-gradient(145deg, var(--dark-card), var(--dark-surface));border:2px solid var(--neon-cyan);border-radius:20px;width:min(720px,100%);padding:40px;box-shadow:0 0 28px #00f0ff59}.dashboard-title{font-family:var(--font-display);color:var(--neon-cyan);text-align:center;text-shadow:0 0 8px #00f0ffcc,3px 3px #f0f9;margin-bottom:16px;font-size:clamp(30px,5vw,38px)}.dashboard-welcome,.dashboard-info{color:var(--text-muted);text-align:center;line-height:1.5}.dashboard-welcome{margin-bottom:34px}.dashboard-panel{border-top:1px solid #00f0ff4d;margin-top:26px;padding-top:24px}.dashboard-panel h2{color:var(--neon-magenta);font-family:var(--font-display);letter-spacing:2px;margin-bottom:18px;font-size:1rem}.player-status{color:var(--neon-cyan);margin-bottom:18px;font-weight:700}.player-id-box,.admin-player-info,.setup-player-box{background-color:#070a12e6;border:1px solid #00f0ff80;border-radius:14px;margin-bottom:20px;padding:16px}.player-id-box span,.account-grid span,.setup-label{color:var(--text-muted);font-size:.85rem}.player-id-box p,.account-grid p,.setup-player-id{color:var(--text-main);word-break:break-all;margin-top:8px}.account-grid{grid-template-columns:1fr;gap:18px;display:grid}.dashboard-button-grid{grid-template-columns:1fr 1fr;gap:18px;display:grid}.dashboard-main-button{border:2px solid var(--border-cyan);color:var(--text-main);font-family:var(--font-display);letter-spacing:1px;cursor:pointer;background:#00f0ff0a;border-radius:12px;padding:15px 22px;font-size:.95rem;transition:all .25s}.dashboard-main-button:hover:not(:disabled){background:#00f0ff14;transform:translateY(-2px);box-shadow:0 0 10px #00f0ff40}.qr-code-box{flex-direction:column;align-items:center;gap:16px;margin-top:26px;display:flex}.qr-code-box img{background:#fff;border-radius:16px;width:190px;height:190px;padding:10px;box-shadow:0 0 18px #00f0ff47}.qr-code-info{text-align:center;max-width:320px;color:var(--text-muted);font-size:.9rem;line-height:1.5}.admin-page{padding:40px 20px 60px}.admin-topbar{justify-content:space-between;align-items:center;gap:16px;margin-bottom:30px;display:flex}.admin-title{color:var(--neon-yellow);font-family:var(--font-display);text-shadow:0 0 14px #ffff00b3;font-size:clamp(30px,5vw,44px)}.admin-song-section,.admin-settings-section{background:linear-gradient(145deg, var(--dark-card), var(--dark-surface));border:2px solid var(--neon-cyan);border-radius:18px;margin-bottom:34px;padding:24px;box-shadow:0 0 22px #00f0ff40}.admin-song-section h2{color:var(--neon-yellow);font-family:var(--font-display);margin-bottom:24px}.admin-song-table{border-collapse:collapse;width:100%}.admin-song-table th{color:var(--neon-yellow);text-align:left;font-family:var(--font-display);padding:16px;font-size:.9rem}.admin-song-table td{color:var(--text-main);border-top:1px solid #ffffff1f;padding:16px}.admin-help-text,.setup-subtitle{color:var(--text-muted);margin-bottom:20px;line-height:1.5}.admin-label{color:var(--neon-cyan);margin-bottom:8px;font-weight:700;display:block}.status-active,.setup-status{color:var(--neon-cyan);margin-bottom:20px;font-weight:700}.status-inactive{color:var(--neon-pink);font-weight:700}.secondary-button{width:100%;margin-top:10px}.admin-link{text-align:center;color:var(--text-muted);margin-top:34px;text-decoration:none;display:block}.admin-link:hover{color:var(--neon-cyan);text-shadow:0 0 10px #00f0ff99}@media (width<=760px){.player-page,.admin-page,.dashboard-page,.auth-page{padding-left:16px;padding-right:16px}.header,.admin-topbar,.queue-header{flex-direction:column;align-items:flex-start}.dashboard-card,.auth-card{padding:26px}.dashboard-button-grid{grid-template-columns:1fr}.song-section,.queue-section,.admin-song-section,.admin-settings-section{padding:18px}.song-table,.admin-song-table{white-space:nowrap;display:block;overflow-x:auto}.song-table th,.song-table td,.admin-song-table th,.admin-song-table td{padding:12px}.qr-code-box img{width:180px;height:180px}}@media (width<=480px){.logo{font-size:24px}.logo-icon{width:28px;height:28px}.player-title,.dashboard-title,.admin-title{letter-spacing:1px}.queue-item{align-items:flex-start}.queue-position{width:32px;height:32px}}*{box-sizing:border-box;margin:0;padding:0}:root{--font-display:"Orbitron", sans-serif;--font-body:"Exo 2", Arial, sans-serif;--neon-cyan:#00f0ff;--neon-magenta:#f0f;--neon-yellow:#ff0;--neon-pink:#ff0080;--dark-bg:#0a0a0f;--dark-card:#12121a;--dark-surface:#1a1a25;--text-main:#e0e0ff;--text-muted:#9090a0;--border-cyan-soft:#00f0ff33;--border-cyan:#00f0ff;--border-magenta:#f0f}body{min-height:100vh;color:var(--text-main);font-family:var(--font-body);background-color:var(--dark-bg);background-image:linear-gradient(0deg,#00f0ff08 0,#0000 1px 2px,#00f0ff08 3px),linear-gradient(90deg,#00f0ff08 0,#0000 1px 2px,#00f0ff08 3px);background-size:60px 60px}button,input{font-family:inherit}button:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid var(--neon-cyan);outline-offset:4px}
