@import url('https://fonts.googleapis.com/css2?family=Russo+One&family=Inter:wght@400;600&display=swap');
body { background: radial-gradient(circle at top, #0a0f1a, #02040a); color: #e4e8ff; font-family: 'Inter', sans-serif; margin:0; padding:0; overflow-x:hidden;}
header { text-align:center; padding:60px 0 30px; background: linear-gradient(180deg, #111831, #0a0f1a); box-shadow:0 4px 20px rgba(0,0,0,0.5);}
header h1 { font-family:'Russo One', sans-serif; color:#00baff; text-shadow:0 0 15px #00baff; margin:0;}
header p { color:#bbb;}
footer { text-align:center; padding:30px 0; color:#777; font-size:14px;}
.season { margin:25px auto; width:90%; max-width:1000px; background: rgba(20,25,40,0.7); border-radius:12px; overflow:hidden; transition:all 0.3s ease; box-shadow:0 0 25px rgba(0,186,255,0.05);}
.season-header { padding:20px; display:flex; justify-content:space-between; align-items:center; cursor:pointer; background: rgba(0,186,255,0.1); border-bottom:1px solid rgba(0,186,255,0.3);}
.season-header:hover { background: rgba(0,186,255,0.2); }
.season-header h2 { color:#00baff; font-family:'Russo One', sans-serif;}
.arrow { font-size:18px; transition: transform 0.3s;}
.season.expanded .arrow { transform: rotate(180deg); }
.builds-list { display:none; padding:20px; display:none; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:20px;}
.season.expanded .builds-list { display:grid; }
.build-card { background: rgba(10,15,25,0.8); border:1px solid rgba(0,186,255,0.3); border-radius:12px; padding:15px; text-align:center; box-shadow:0 0 20px rgba(0,186,255,0.05); transition:transform 0.2s, box-shadow 0.2s;}
.build-card.online { border-color:#00ffb7;}
.build-card.offline { border-color:#ff4d4d; opacity:0.7;}
.build-card:hover { transform: translateY(-4px); box-shadow:0 0 20px rgba(0,186,255,0.2);}
.download-btn { margin-top:10px; padding:10px 15px; background:#00baff; color:#000; border:none; border-radius:8px; font-weight:bold; cursor:pointer; transition:0.2s;}
.download-btn:hover { background:#00eaff;}
.modal { display:none; position:fixed; z-index:10; left:0; top:0; width:100%; height:100%; background-color: rgba(0,0,0,0.7); backdrop-filter: blur(5px); transition: opacity 0.3s ease;}
.modal.show { display:flex; align-items:center; justify-content:center;}
.modal-content { background: rgba(15,20,35,0.95); border:1px solid rgba(0,186,255,0.3); border-radius:15px; width:90%; max-width:500px; padding:20px; text-align:center; box-shadow:0 0 30px rgba(0,186,255,0.2); animation:pop 0.3s ease;}
@keyframes pop { 0% { transform: scale(0.9); opacity:0;} 100% { transform:scale(1); opacity:1;}}
#close-modal { float:right; font-size:24px; color:#bbb; cursor:pointer;}
#close-modal:hover { color:#fff;}
.mirror-item { margin-top:10px; background: rgba(25,30,45,0.9); padding:10px; border-radius:8px; border-left:5px solid #00baff;}
.mirror-item.online { border-left-color:#00ffb7;}
.mirror-item.offline { border-left-color:#ff4d4d; opacity:0.7;}
.mirror-item a { display:inline-block; margin-top:8px; background:#00baff; color:#000; padding:5px 10px; border-radius:5px; text-decoration:none; font-weight:bold;}
.mirror-item a.disabled { background:#333; color:#777; pointer-events:none;}