*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#0a1628;color:#eee;min-height:100vh;position:relative}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;opacity:.06;pointer-events:none;z-index:0}.app{position:relative;z-index:1;max-width:800px;margin:0 auto;padding:2rem}header h1{font-size:2.5rem;margin-bottom:0;color:#c8102e}.header-brand{display:flex;align-items:center;gap:.75rem}.header-logo{width:48px;height:48px;border-radius:10px}.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem}.card{background:#122044;border-radius:12px;padding:1.5rem;cursor:pointer;transition:transform .2s,box-shadow .2s;text-decoration:none;color:inherit}.card:hover{transform:translateY(-4px);box-shadow:0 8px 25px #c8102e4d}.card h3{margin-bottom:.5rem}.card p{color:#aaa;font-size:.9rem}.song-item{background:#122044;border-radius:8px;padding:1rem;margin-bottom:1rem;display:flex;align-items:center;gap:1rem}.song-item .info{flex:1}.song-item .info h4{margin-bottom:.25rem}.song-item .info p{color:#aaa;font-size:.85rem}.play-btn{background:#c8102e;border:none;color:#fff;width:48px;height:48px;border-radius:50%;font-size:1.2rem;cursor:pointer;transition:background .2s}.play-btn:hover{background:#e63946}.back-link{display:inline-block;margin-bottom:1rem;color:#c8102e;text-decoration:none}.back-link:hover{text-decoration:underline}.roster-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.edit-toggle-btn{background:transparent;border:1px solid #C8102E;color:#c8102e;padding:.4rem 1rem;border-radius:6px;cursor:pointer;font-size:.85rem}.edit-toggle-btn:hover{background:#c8102e;color:#fff}.player-form{display:flex;gap:.5rem;margin-bottom:1.5rem;flex-wrap:wrap}.player-inline-form{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}.player-inline-form input{padding:.4rem .6rem;border:1px solid #333;border-radius:6px;background:#122044;color:#eee;font-size:.9rem}.player-inline-form input[placeholder="#"]{width:60px;-moz-appearance:textfield;-webkit-appearance:textfield;appearance:textfield}.player-inline-form input[placeholder="#"]::-webkit-inner-spin-button,.player-inline-form input[placeholder="#"]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.player-inline-form input[placeholder=Position]{width:100px}.position-select{padding:.4rem .6rem;border:1px solid #333;border-radius:6px;background:#122044;color:#eee;font-size:.9rem;cursor:pointer}.player-inline-form button[type=submit]{padding:.4rem .8rem;background:#c8102e;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:.9rem}.player-form input{padding:.5rem .75rem;border:1px solid #333;border-radius:6px;background:#122044;color:#eee;font-size:.9rem}.player-form input[placeholder="#"]{width:60px;-moz-appearance:textfield;-webkit-appearance:textfield;appearance:textfield}.player-form input[placeholder="#"]::-webkit-inner-spin-button,.player-form input[placeholder="#"]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.player-form input[placeholder=Position]{width:100px}.player-form button{padding:.5rem 1rem;background:#c8102e;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:.9rem}.player-form button[type=button]{background:#555}.roster-card{position:relative}.card-link{text-decoration:none;color:inherit;display:block}.card-actions{display:flex;gap:.5rem;margin-top:.75rem}.action-btn{background:transparent;border:none;cursor:pointer;font-size:1rem;padding:.25rem .5rem;border-radius:4px}.action-btn:hover{background:#ffffff1a}.delete-btn:hover{background:#c8102e33}.upload-form{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1.5rem;padding:1rem;background:#122044;border-radius:8px}.upload-form input[type=text],.upload-form input[type=file]{padding:.5rem .75rem;border:1px solid #333;border-radius:6px;background:#0a1628;color:#eee;font-size:.9rem}.upload-form button{padding:.6rem 1rem;background:#c8102e;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:.9rem}.upload-form button:disabled{opacity:.6;cursor:not-allowed}.player-info-row{display:flex;justify-content:space-between;align-items:center}.audio-icon{font-size:1.5rem;flex-shrink:0;width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#c8102e33}.playing .audio-icon{background:#c8102e;color:#fff}.playing{box-shadow:0 0 15px #c8102e80;border:1px solid #C8102E}.roster-card[draggable=true]{cursor:grab}.roster-card[draggable=true]:active{cursor:grabbing}.dragging{opacity:.4}.drop-before{position:relative}.drop-before:before{content:"";position:absolute;left:-.55rem;top:0;bottom:0;width:3px;background:#c8102e;border-radius:2px}.drop-after{position:relative}.drop-after:after{content:"";position:absolute;right:-.55rem;top:0;bottom:0;width:3px;background:#c8102e;border-radius:2px}.song-label{margin-top:.5rem;font-size:.8rem;color:#888;font-style:italic}.time-label{margin-top:.4rem;font-size:.8rem;color:#888;cursor:pointer}.time-label:hover{color:#c8102e}.time-edit-row{display:flex;align-items:center;gap:.5rem;margin-top:.5rem;flex-wrap:wrap}.time-edit-row label{display:flex;align-items:center;gap:.3rem;font-size:.8rem;color:#aaa}.time-edit-row input[type=number]{width:64px;padding:.2rem .4rem;background:#0a1628;border:1px solid #444;border-radius:4px;color:#eee;font-size:.8rem;-moz-appearance:textfield;-webkit-appearance:textfield;appearance:textfield}.time-edit-row input[type=number]::-webkit-inner-spin-button,.time-edit-row input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.time-save-btn{padding:.2rem .6rem;background:#c8102e;border:none;border-radius:4px;color:#fff;font-size:.8rem;cursor:pointer}.time-save-btn:hover{background:#e63946}.song-upload-section{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-top:.5rem;padding-top:.5rem;border-top:1px solid rgba(255,255,255,.1)}.current-song{font-size:.8rem;color:#aaa;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.no-song{font-size:.8rem;color:#666;font-style:italic;flex:1}.file-upload-label{background:#c8102e33;color:#c8102e;padding:.3rem .6rem;border-radius:4px;font-size:.75rem;cursor:pointer;white-space:nowrap}.file-upload-label:hover{background:#c8102e;color:#fff}.bg-upload-row{display:flex;align-items:center;gap:.75rem;margin-bottom:1.25rem}.bg-filename{font-size:.8rem;color:#aaa;font-style:italic}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.logout-btn{background:transparent;border:1px solid #C8102E;color:#c8102e;padding:.5rem 1rem;border-radius:6px;cursor:pointer;font-size:.9rem}.logout-btn:hover{background:#c8102e;color:#fff}.login-container{max-width:360px;margin:4rem auto;text-align:center}.login-container h2{margin-bottom:1.5rem}.login-form{display:flex;flex-direction:column;gap:1rem}.login-form input{padding:.75rem 1rem;border:1px solid #333;border-radius:8px;background:#122044;color:#eee;font-size:1rem}.login-form button{padding:.75rem;background:#c8102e;border:none;border-radius:8px;color:#fff;font-size:1rem;cursor:pointer}.login-form button:hover{background:#e63946}.error{color:#ff6b6b;font-size:.9rem}.toggle-auth{margin-top:1rem;color:#aaa;cursor:pointer;font-size:.9rem}.toggle-auth:hover{color:#c8102e}
