:root{--bg: #0b0e14;--card: #11151c;--text: #e6e6e6;--muted: #9aa4b2;--accent: #5cc8ff;--accent-2: #94f7c5;--border: #222830}.muted{color:var(--muted)}.container{max-width:1200px;margin:0 auto;padding:0 20px 40px}.card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:16px}.btn{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#0b0e14;border:none;padding:8px 12px;border-radius:8px;cursor:pointer;font-weight:600;transition:all .2s ease}.btn:hover{filter:brightness(1.05)}.config-btn{background:linear-gradient(135deg,#50c878,#4a90e2);position:relative}.config-btn:hover{filter:brightness(1.1);transform:translateY(-1px)}.btn.active{background:linear-gradient(135deg,#4a90e2,#50c878)}.chip{display:inline-flex;align-items:center;gap:8px;background:#0f131a;border:1px solid var(--border);padding:6px 10px;border-radius:999px;cursor:pointer;transition:all .2s ease}.chip input{accent-color:var(--accent)}.chip.on{border-color:var(--accent);box-shadow:0 0 0 2px #54a8ff26 inset;background:#0c1016}.search{padding:8px 10px;border-radius:8px;border:1px solid var(--border);background:#0f131a;color:var(--text);min-width:220px}input[type=number]{width:120px;padding:8px 10px;border-radius:8px;border:1px solid var(--border);background:#0f131a;color:var(--text)}.tile{background:#0f131a;border:1px solid var(--border);border-radius:10px;padding:10px;text-decoration:none;color:inherit;cursor:pointer;transition:all .2s ease;text-align:center}.tile:hover{border-color:var(--accent);box-shadow:0 0 0 2px #54a8ff26;transform:translateY(-1px)}.tile .name{font-weight:700}.tile .title{font-size:.75rem;color:#3498db;margin-bottom:.25rem;font-weight:500}.tile .sub{font-size:.75rem;color:#7f8c8d}.avatar-container{width:48px;height:48px;margin:0 auto .5rem;position:relative}.tile .avatar{width:100%;height:100%;border-radius:4px;object-fit:cover;border:1px solid #e1e8ed}.avatar-placeholder{width:48px;height:48px;border-radius:4px;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:1.2rem;border:1px solid #e1e8ed}.header-title{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:20px;padding:25px 30px;background:linear-gradient(135deg,#667eea33,#764ba233,#667eea1a);border-radius:16px;border:1px solid rgba(102,126,234,.3);-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);box-shadow:0 8px 32px #667eea33;margin:20px}.title-group{display:flex;align-items:center;gap:16px;padding:0;border:none;background:none;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}.title-group h1{background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:700;font-size:1.8rem;text-shadow:0 2px 4px rgba(0,0,0,.1)}.logo{height:40px;width:auto;object-fit:contain}.header h1{margin:0}.action-buttons{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.controls .row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.controls .row.between{justify-content:space-between}.controls .field{display:flex;flex-direction:column;gap:6px}.controls .field.inline{flex-direction:row;align-items:center;gap:8px}.controls .field.inline label{margin-bottom:0;white-space:nowrap}.controls .field.inline input[type=number]{width:80px}.btns{display:flex;gap:8px;flex-wrap:wrap}.regions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.heroes .row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.heroes .row.between{justify-content:space-between}.heroes .row.gap{gap:8px}.search-container{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;margin-top:12px}.footer{text-align:center;margin-top:40px;margin-bottom:40px;padding-top:20px;border-top:1px solid var(--border)}.badges{display:flex;justify-content:center;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px}.badges img{height:20px;transition:opacity .2s ease}.badges a:hover img{opacity:.8}.data-source{font-size:.875rem;margin:0}.copyright{font-size:.8rem;margin:8px 0 0}@media (max-width: 768px){.header-title{flex-direction:column;text-align:center;padding:20px 15px;margin:10px}.action-buttons{flex-direction:column;width:100%;max-width:400px}.announcement-banner,.map-btn{width:100%;justify-content:center}.container{padding:0 16px}.controls .row,.controls .field.inline{flex-direction:column;align-items:stretch}.controls .field.inline label{margin-bottom:6px}.btns,.regions{justify-content:center}.champions{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:8px}.action-buttons{justify-content:center}.badges{gap:6px}.badges img{height:18px}}@media (max-width: 480px){.header-title{padding:15px 10px;gap:15px}.title-group h1{font-size:1.5rem}.logo{height:32px}}.map-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;text-decoration:none;border-radius:20px;font-size:.9rem;font-weight:600;transition:all .2s ease;box-shadow:0 2px 8px #667eea4d}.map-btn.centered{margin-top:16px;align-self:center}.map-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px #667eea66;filter:brightness(1.1)}.announcement-banner{background:linear-gradient(135deg,#4a90e2,#50c878);color:#fff;padding:12px 20px;border-radius:12px;box-shadow:0 2px 8px #4a90e233;text-align:center;font-size:.95rem;text-decoration:none;transition:all .3s ease;position:relative;overflow:hidden;margin:0}.announcement-banner:hover{transform:translateY(-2px);box-shadow:0 4px 16px #4a90e266;filter:brightness(1.1)}.announcement-banner:active{transform:translateY(0);box-shadow:0 2px 8px #4a90e233}.banner-content{display:flex;align-items:center;justify-content:center;gap:8px;font-weight:500}.banner-icon{font-size:1.1rem}.banner-text{color:#fff}body{position:relative;background-image:url(https://game.gtimg.cn/images/lol/universe/images/map-background.png);background-size:cover;background-position:center;background-attachment:fixed;background-repeat:no-repeat}body:before{content:"";position:fixed;top:0;left:0;right:0;bottom:0;background-image:radial-gradient(ellipse 200px 100px at 15% 20%,rgba(255,255,255,.15) 0%,transparent 70%),radial-gradient(ellipse 150px 80px at 25% 25%,rgba(255,255,255,.12) 0%,transparent 60%),radial-gradient(ellipse 180px 90px at 20% 15%,rgba(255,255,255,.1) 0%,transparent 65%),radial-gradient(ellipse 250px 120px at 70% 30%,rgba(255,255,255,.18) 0%,transparent 75%),radial-gradient(ellipse 180px 100px at 75% 35%,rgba(255,255,255,.14) 0%,transparent 65%),radial-gradient(ellipse 200px 110px at 80% 25%,rgba(255,255,255,.12) 0%,transparent 70%),radial-gradient(ellipse 300px 150px at 45% 70%,rgba(255,255,255,.16) 0%,transparent 80%),radial-gradient(ellipse 220px 120px at 50% 75%,rgba(255,255,255,.13) 0%,transparent 70%),radial-gradient(ellipse 180px 100px at 40% 65%,rgba(255,255,255,.11) 0%,transparent 65%),radial-gradient(ellipse 160px 90px at 85% 60%,rgba(255,255,255,.14) 0%,transparent 60%),radial-gradient(ellipse 140px 80px at 90% 65%,rgba(255,255,255,.12) 0%,transparent 55%);background-size:100% 100%,100% 100%,100% 100%,100% 100%,100% 100%,100% 100%,100% 100%,100% 100%,100% 100%,100% 100%,100% 100%;animation:cloudFloat1 25s ease-in-out infinite,cloudFloat2 30s ease-in-out infinite reverse,cloudFloat3 35s ease-in-out infinite;z-index:-1}body:after{content:"";position:fixed;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,#0b0e1466,#0b0e144d,#0b0e1480);z-index:-2}@keyframes cloudFloat1{0%,to{transform:translate(0) translateY(0) scale(1);opacity:.6}33%{transform:translate(-20px) translateY(-10px) scale(1.1);opacity:.8}66%{transform:translate(10px) translateY(15px) scale(.9);opacity:.4}}@keyframes cloudFloat2{0%,to{transform:translate(0) translateY(0) rotate(0);opacity:.5}50%{transform:translate(30px) translateY(-20px) rotate(2deg);opacity:.7}}@keyframes cloudFloat3{0%,to{transform:translateY(0) scale(1);opacity:.3}25%{transform:translateY(-15px) scale(1.05);opacity:.6}75%{transform:translateY(10px) scale(.95);opacity:.4}}