.futsal-panel{color:#fff;background-color:#000;flex-direction:column;min-height:100vh;padding:20px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;display:flex}.panel-header{border-bottom:1px solid #333;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:10px;display:flex}.match-state-selector{gap:10px;display:flex}.state-btn{color:#fff;cursor:pointer;background:#222;border:1px solid #444;border-radius:4px;padding:8px 16px;font-weight:700}.state-btn.active{background:#e63946;border-color:#e63946}.reset-btn{color:#888;cursor:pointer;background:0 0;border:1px solid #444;padding:5px 10px;font-size:.8rem}.panel-main{flex:1}.teams-grid{grid-template-columns:1fr 1.5fr 1fr;gap:20px;height:100%;display:grid}.team-control{background:#111;border:2px solid #222;border-radius:8px;flex-direction:column;align-items:center;padding:20px;transition:all .3s;display:flex}.team-control.bonus-alert{border-color:#f1fa8c;box-shadow:0 0 15px #f1fa8c4d}.team-name{text-align:center;text-transform:uppercase;color:#f1fa8c;margin-bottom:20px;font-size:1.5rem}.score-area{align-items:center;gap:20px;margin-bottom:30px;display:flex}.score-display{text-align:center;background:#000;border:4px solid #333;border-radius:8px;min-width:120px;padding:10px 20px;font-size:6rem;font-weight:800;line-height:1}.score-area button{color:#fff;cursor:pointer;background:#333;border:none;border-radius:50%;width:50px;height:50px;font-size:2rem}.score-area button:hover{background:#444}.fouls-area{text-align:center;width:100%;margin-bottom:20px}.fouls-header{color:#888;margin-bottom:10px;font-size:.9rem}.fouls-counter{justify-content:center;gap:8px;margin-bottom:15px;display:flex}.foul-dot{border:2px solid #333;border-radius:50%;width:15px;height:15px}.foul-dot.active{background:#e63946;border-color:#e63946}.add-foul-btn{color:#fff;cursor:pointer;background:#e63946;border:none;border-radius:4px;width:100%;padding:12px;font-size:1.1rem;font-weight:700}.bonus-label{color:#e63946;margin-top:10px;font-weight:700;animation:1s infinite blink}@keyframes blink{50%{opacity:.3}}.timeout-btn{color:#fff;cursor:pointer;background:#457b9d;border:none;border-radius:4px;width:100%;margin-top:20px;padding:10px 20px}.timeout-btn.disabled{cursor:not-allowed;opacity:.5;background:#333}.central-clock-area{flex-direction:column;justify-content:center;align-items:center;gap:20px;display:flex;position:relative}.clock-display{color:#f1fa8c;background:#000;border:8px solid #333;border-radius:12px;padding:20px;font-family:Courier New,Courier,monospace;font-size:8rem;font-weight:700;line-height:1}.clock-controls{gap:15px;width:100%;display:flex}.play-pause-btn{cursor:pointer;color:#fff;background:#1a936f;border:none;border-radius:8px;flex:2;padding:20px;font-size:1.5rem;font-weight:700}.play-pause-btn.running{background:#e63946}.edit-time-btn{color:#fff;cursor:pointer;background:#333;border:none;border-radius:8px;flex:1}.time-editor{flex-direction:column;align-items:center;gap:20px;display:flex}.edit-inputs{align-items:center;gap:10px;display:flex}.edit-inputs input{color:#fff;text-align:center;background:#222;border:2px solid #555;border-radius:8px;width:120px;font-size:4rem}.edit-actions{gap:10px;display:flex}.confirm-btn{color:#fff;cursor:pointer;background:#1a936f;border:none;border-radius:4px;padding:10px 20px}.cancel-btn{color:#fff;cursor:pointer;background:#444;border:none;border-radius:4px;padding:10px 20px}.timeout-overlay{z-index:10;background:#000000f2;border-radius:12px;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.timeout-timer{text-align:center}.timeout-clock{color:#e63946;font-size:6rem;font-weight:700}.cancel-timeout-btn{color:#fff;cursor:pointer;background:#e63946;border:none;border-radius:8px;margin-top:20px;padding:15px 30px;font-size:1.2rem;font-weight:700;transition:transform .1s}.cancel-timeout-btn:active{transform:scale(.95)}.modal-overlay{z-index:1000;background:#000000e6;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-content{text-align:center;background:#111;border:4px solid #333;border-radius:12px;width:90%;max-width:500px;padding:40px}.modal-content h2{color:#e63946;margin-bottom:20px;font-size:2rem}.modal-content p{color:#ccc;margin-bottom:30px;font-size:1.2rem;line-height:1.5}.modal-actions{justify-content:center;gap:20px;display:flex}.modal-actions .confirm-btn{background:#e63946;padding:15px 30px;font-size:1.2rem}.modal-actions .cancel-btn{background:#444;padding:15px 30px;font-size:1.2rem}.setup-wrapper{justify-content:center;align-items:center;min-height:100vh;display:flex}.setup-header{justify-content:space-between;align-items:center;margin-bottom:30px;display:flex}.help-buttons{gap:10px;display:flex}.help-btn{color:#888;cursor:pointer;background:#333;border:1px solid #444;border-radius:4px;padding:8px 15px;font-size:.8rem;transition:all .2s}.help-btn:hover{color:#fff;background:#444}.help-modal{text-align:left}.help-modal.wider{max-width:500px;padding:20px}.help-text{margin-bottom:25px}.help-text p{margin-bottom:15px}.help-text section{margin-bottom:20px}.help-text h3{color:#f1fa8c;margin-bottom:10px;font-size:1.1rem}.help-text ul{color:#ccc;padding-left:20px}.help-text li{margin-bottom:8px}.help-text.scrollable{max-height:400px;padding-right:15px;overflow-y:auto}.help-text.scrollable::-webkit-scrollbar{width:8px}.help-text.scrollable::-webkit-scrollbar-thumb{background:#333;border-radius:4px}.warning h3{color:#e63946}.setup-view{background:#111;border:1px solid #333;border-radius:12px;width:100%;max-width:800px;padding:30px}.setup-form{flex-direction:column;gap:30px;display:flex}.form-grid{grid-template-columns:1fr 1fr;gap:40px;display:grid}.setup-group h3{color:#f1fa8c;margin-bottom:15px}.setup-group input[type=text]{color:#fff;background:#222;border:1px solid #444;border-radius:4px;width:100%;margin-bottom:15px;padding:12px}.sub-inputs{gap:20px;display:flex}.sub-inputs label{color:#888;flex-direction:column;font-size:.8rem;display:flex}.sub-inputs input{color:#fff;background:#222;border:1px solid #444;border-radius:4px;width:80px;padding:8px}.start-match-btn{color:#fff;cursor:pointer;background:#e63946;border:none;border-radius:8px;padding:20px;font-size:1.5rem;font-weight:700;transition:transform .1s}.start-match-btn:active{transform:scale(.98)}.active-banners-preview{background:#000;border:1px solid #222;border-radius:8px;margin-top:-10px;padding:15px}.active-banners-preview h3{color:#888;text-transform:uppercase;letter-spacing:1px;margin-bottom:15px;font-size:.9rem}.preview-list{gap:15px;padding-bottom:10px;display:flex;overflow-x:auto}.preview-item{aspect-ratio:16/9;background:#111;border:1px solid #333;border-radius:4px;flex:0 0 120px;position:relative;overflow:hidden}.preview-item img{-o-object-fit:cover;object-fit:cover;width:100%;height:100%}.preview-item.default{border-color:#f1fa8c44}.preview-item.default span{color:#f1fa8c;text-align:center;background:#f1fa8c33;padding:2px;font-size:.6rem;position:absolute;bottom:0;left:0;right:0}.banner-manager{margin-top:10px}.upload-section{margin-bottom:20px}.upload-label{text-align:center;cursor:pointer;color:#888;background:#222;border:2px dashed #444;border-radius:8px;padding:20px;transition:all .2s;display:block}.upload-label:hover{color:#f1fa8c;background:#2a2a2a;border-color:#f1fa8c}.suggest-upload-btn{text-align:center;cursor:pointer;color:#888;background:#222;border:2px dashed #444;border-radius:8px;width:100%;padding:20px;font-size:1rem;transition:all .2s}.suggest-upload-btn:hover{color:#f1fa8c;background:#2a2a2a;border-color:#f1fa8c}.banner-guide-content{text-align:center;margin:10px 0}.guide-image-container{background:#000;border:1px solid #333;border-radius:8px;max-width:300px;margin:10px auto;padding:5px}.guide-image{border-radius:4px;max-width:100%;height:auto}.guide-tip{color:#888;font-size:.9rem;font-style:italic}.upload-label input{display:none}.banners-list{background:#000;border-radius:8px;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:15px;max-height:300px;padding:10px;display:grid;overflow-y:auto}.banner-item{aspect-ratio:16/9;border:1px solid #333;border-radius:4px;position:relative;overflow:hidden}.banner-item img{-o-object-fit:cover;object-fit:cover;width:100%;height:100%}.delete-banner-btn{color:#fff;cursor:pointer;background:#e63946e6;border:none;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;font-weight:700;display:flex;position:absolute;top:5px;right:5px}.delete-banner-btn:hover{background:#e63946;transform:scale(1.1)}.panel-footer{width:100%;margin-top:auto;padding-top:20px}.banner-carousel{background:#111;border:1px solid #222;border-radius:12px;width:100%;height:150px;position:relative;overflow:hidden}.carousel-slide{opacity:0;justify-content:center;align-items:center;width:100%;height:100%;transition:opacity 1s ease-in-out;display:flex;position:absolute;top:0;left:0}.carousel-slide.active{opacity:1}.carousel-slide img{-o-object-fit:contain;object-fit:contain;max-width:100%;max-height:100%}@media (max-width:1024px){.teams-grid{grid-template-rows:auto auto auto;grid-template-columns:1fr}.central-clock-area{grid-row:1}}