@import "https://fonts.googleapis.com/css2?family=VT323&display=swap";
:root{--bg-color:#0c0c0c;--window-bg:#1c1c1ceb;--border-color:#333;--text-main:#0f0;--text-highlight:#ff6beb;--text-yellow:#f2e16d;--btn-bg:#2a2a2a;--btn-border-light:#555;--btn-border-dark:#000}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body.no-scroll{overflow:hidden}body{background:url(/textura_mobile.png) 50%/cover no-repeat fixed;background-color:var(--bg-color);color:var(--text-main);flex-direction:column;justify-content:center;align-items:center;height:100dvh;padding:12px;font-family:Courier New,Courier,monospace;display:flex}@media (min-width:768px){body{background-image:url(/textura_desktop.png)}}.page-wrapper{flex-direction:column;justify-content:center;align-items:center;gap:12px;width:100%;max-width:500px;height:100%;display:flex}.window{background-color:var(--window-bg);border:4px solid var(--border-color);border-top-color:var(--btn-border-light);border-left-color:var(--btn-border-light);border-right-color:var(--btn-border-dark);border-bottom-color:var(--btn-border-dark);flex-direction:column;width:100%;min-height:0;padding:4px;display:flex;box-shadow:8px 8px #000c}.title-bar{color:#fff;background:linear-gradient(90deg,#ff6beb,#3b006a);border:2px solid #2b004d;border-color:#ffa1f3 #2b004d #2b004d #ffa1f3;flex-shrink:0;justify-content:space-between;padding:4px 8px;font-family:VT323,monospace;font-size:1.1rem;font-weight:700;display:flex}.content{background-color:#141414eb;border:2px solid #333;border-color:#000 #333 #333 #000;flex-direction:column;flex:1;min-height:0;padding:16px;display:flex}.logo-container{text-align:center;flex-shrink:0;margin-bottom:16px}.logo-container img{width:75%;max-width:300px;height:auto}.slogan{color:#ccc;letter-spacing:3px;margin-top:4px;font-family:VT323,monospace;font-size:1.3rem;font-weight:700;display:block}.venue-logo{text-align:center;flex-shrink:0;padding:4px 0}.venue-logo img{opacity:.85;width:180px;height:auto}form{flex-direction:column;flex:1;justify-content:space-between;min-height:0;display:flex}label{color:var(--text-yellow);flex-shrink:0;margin-bottom:3px;font-size:.85rem;font-weight:700;display:block}input[type=text]{width:100%;color:var(--text-main);background-color:#000;border:2px solid #555;border-color:#000 #555 #555 #000;outline:none;flex-shrink:0;margin-bottom:10px;padding:10px;font-family:Courier New,Courier,monospace;font-size:1rem}input[type=text]:focus{border-color:var(--text-highlight)}input[type=text]::placeholder{color:#555}button{background-color:var(--btn-bg);color:#fff;border:3px solid;border-top-color:var(--btn-border-light);border-left-color:var(--btn-border-light);border-right-color:var(--btn-border-dark);border-bottom-color:var(--btn-border-dark);cursor:pointer;background:linear-gradient(#444 0%,#222 100%);flex-shrink:0;width:100%;margin-top:auto;padding:10px;font-family:VT323,monospace;font-size:1.4rem;transition:all .1s}button:active{border-top-color:var(--btn-border-dark);border-left-color:var(--btn-border-dark);border-right-color:var(--btn-border-light);border-bottom-color:var(--btn-border-light);background:linear-gradient(#222 0%,#444 100%)}button:disabled{opacity:.5;cursor:not-allowed}.dj-panel{flex:1;min-height:0;overflow-y:auto}.btn-danger{margin-top:12px;color:#ff6b6b!important;background:linear-gradient(#8b0000 0%,#5c0000 100%)!important;border-color:#a00!important}.btn-danger:active{background:linear-gradient(#5c0000 0%,#8b0000 100%)!important}.song-list{flex-direction:column;gap:12px;margin-top:20px;list-style:none;display:flex}.song-item{background:#111;border:2px solid #333;align-items:center;gap:12px;padding:10px;display:flex}.song-item.downloaded{opacity:.4;filter:grayscale();order:999}.song-item img{object-fit:cover;border:1px solid #555;width:60px;height:60px}.song-info{flex:1}.song-title{color:var(--text-highlight);font-size:1.1rem;font-weight:700}.song-artist{color:var(--text-main);font-size:.9rem}.guest-name{color:#888;margin-top:4px;font-size:.8rem}.badge{background:var(--text-highlight);color:#000;border-radius:4px;padding:2px 6px;font-size:.7rem;font-weight:700}.dj-controls{flex-direction:column;gap:8px;display:flex}.btn-small{padding:6px;font-size:1rem}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.loading-text{color:var(--text-yellow);text-align:center;margin-top:20px;animation:1s infinite blink}.success-message{text-align:center;color:var(--text-highlight);border:2px dashed var(--text-highlight);background:#ff6beb1a;margin-top:20px;padding:10px;font-weight:700}
