:root{font-family:Segoe UI,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;color:#f0e6d2;background-color:#1f1f1f;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}#root{width:100%}.app{max-width:1200px;margin:0 auto;padding:8px;min-height:100vh;background:linear-gradient(to bottom,#072423,#000b16);background-attachment:fixed}.header{margin-top:40px;text-align:center;margin-bottom:30px}.logo{margin:0}.logo-image{max-width:280px;width:100%;height:auto}.search-container{display:flex;justify-content:center;margin-bottom:80px;position:sticky;top:0;z-index:100;padding:8px 0}@media(max-width:479px){.app.is-searching{padding-top:8px}.app.is-searching .search-container{margin-bottom:8px}.header-hidden-mobile{display:none}}.search-wrapper{position:relative;width:100%;padding:4px}@media(min-width:480px){.search-wrapper{max-width:400px}}.search-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:23px;height:23px;pointer-events:none}.search-cancel{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:20px;height:20px;padding:0;border:none;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center}.search-cancel img{width:100%;height:100%}.search-input{width:100%;padding:12px 40px 12px 44px;font-size:1.1rem;border:none;border-radius:8px;background-color:#fff;color:#333;outline:none;transition:box-shadow .2s}.search-input:focus{box-shadow:0 0 0 3px #c8aa6e4d}.search-input::placeholder{color:#999}.champion-list{display:flex;flex-direction:column;gap:24px}.champion-group{display:flex;flex-direction:column;gap:4px}.row-separator{color:#f0e6d2;font-size:1.4rem;font-weight:700;font-family:Times New Roman,Yu Mincho,Hiragino Mincho ProN,serif;padding:8px 0 0;background-color:transparent;border:none;margin-bottom:0;position:relative}.row-separator:after{content:"";display:block;height:1px;margin-top:-2px;background:linear-gradient(90deg,#f0e6d2,#1f1f1f)}.champion-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}@media(max-width:479px){.app.has-query .champion-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}@media(min-width:480px){.champion-grid{grid-template-columns:repeat(auto-fill,minmax(72px,1fr));gap:8px}}.champion-card{display:flex;flex-direction:column;align-items:center;gap:2px;padding:1px;border-radius:8px;background-color:transparent;cursor:pointer;transition:transform .2s,opacity .2s;width:100%}.champion-card:hover{transform:scale(1.05);opacity:.85}.champion-image{width:64px;height:64px;border-radius:4px;border:none;transition:border-radius .2s}@media(max-width:479px){.champion-image{width:100%;height:auto;aspect-ratio:1}}.app.has-query .champion-image{border-radius:50%}.champion-name{font-size:.6rem;color:#f0e6d2;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:80px;margin-top:-1px}.loading,.error,.no-results{text-align:center;padding:40px;color:#a09b8c;font-size:1.1rem}.champion-detail{max-width:600px;margin:0 auto;padding:8px 8px 40px;min-height:100vh;background:linear-gradient(to bottom,#072423,#000b16);background-attachment:fixed}.detail-header{display:flex;align-items:center;gap:12px;margin-bottom:4px;position:sticky;top:0;z-index:100}.detail-logo{margin:0 0 4px;flex-shrink:0;line-height:0}.detail-logo-image{width:105px;height:auto}.detail-search-wrapper{position:relative;flex:1;cursor:pointer;margin-top:-4px}.detail-search-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:20px;height:20px;pointer-events:none}.detail-search-input{width:100%;padding:10px 16px 10px 42px;font-size:1rem;border:none;border-radius:8px;background-color:#fff;color:#333;outline:none;cursor:pointer}.detail-search-input::placeholder{color:#999}.detail-search-cancel{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:20px;height:20px;padding:0;border:none;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center}.detail-search-cancel img{width:100%;height:100%}.search-results-overlay{position:absolute;top:100%;left:0;right:0;background-color:#0a2827;border-radius:0 0 10px 10px;margin-top:4px;max-height:300px;overflow-y:auto;overflow-x:hidden;z-index:1000;box-shadow:0 4px 4px #00000080;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;padding:8px}@media(max-width:479px){.search-results-overlay{position:absolute;left:-8px;right:-8px;margin-top:4px;max-height:calc(100vh - 60px)}}@media(min-width:480px){.search-results-overlay{grid-template-columns:repeat(auto-fill,minmax(56px,1fr))}}.search-result-item{display:flex;flex-direction:column;align-items:center;gap:4px;padding:4px;cursor:pointer;transition:opacity .2s}.search-result-item:hover{opacity:.7}.search-result-image{width:100%;height:auto;aspect-ratio:1;border-radius:50%}@media(min-width:480px){.search-result-image{width:48px;height:48px}}.search-result-name{color:#f0e6d2;font-size:.6rem;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}@media(max-width:479px){.detail-header{min-height:50px}.detail-header.search-focused .detail-logo{display:none}.detail-header.search-focused{gap:0}}.splash-container{position:relative;width:100%;aspect-ratio:16 / 9;overflow:hidden;border-radius:8px;margin-bottom:16px}.splash-image{width:100%;height:100%;object-fit:cover;object-position:center top}.splash-overlay{position:absolute;bottom:0;left:0;right:0;height:60%;background:linear-gradient(to top,#1F1F1F 0%,transparent 100%)}.champion-info{text-align:center;margin-bottom:40px}.champion-title{color:#f0e6d2;font-size:1.8rem;margin:0;font-weight:700;font-family:Times New Roman,Yu Mincho,Hiragino Mincho ProN,serif}.vs-prefix{margin-right:.3em}.champion-title:after{content:"";display:block;height:1px;margin-top:4px;margin-bottom:8px;background:linear-gradient(90deg,transparent 0%,#f0e6d2 50%,transparent 100%)}.champion-tags{color:#a09b8c;font-size:.9rem;margin:0;font-family:Times New Roman,Yu Mincho,Hiragino Mincho ProN,serif;letter-spacing:.1em}.counter-sections{display:flex;flex-direction:column;gap:24px;margin-bottom:32px}.counter-section{background-color:transparent}.section-title{color:#f0e6d2;font-size:1.2em;font-weight:700;margin:0 0 12px;font-family:Times New Roman,Yu Mincho,Hiragino Mincho ProN,serif;text-align:center}.section-title:after{content:"";display:block;height:1px;margin-top:4px;background:linear-gradient(90deg,transparent 0%,#f0e6d2 50%,transparent 100%)}.matchup-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}@media(min-width:480px){.matchup-list{display:flex;gap:12px}}.matchup-item{display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;transition:opacity .2s}.matchup-item:hover{opacity:.7}.matchup-image{width:100%;height:auto;aspect-ratio:1;border-radius:4px}@media(min-width:480px){.matchup-image{width:56px;height:56px}}.matchup-name{color:#a09b8c;font-size:.7rem;text-align:center;white-space:nowrap;max-width:60px;overflow:hidden;text-overflow:ellipsis}.external-links{display:flex;justify-content:center;gap:48px;margin-bottom:24px}.external-link{width:120px;padding:12px 16px;border-radius:8px;text-decoration:none;font-size:1.3em;font-weight:700;text-align:center;transition:opacity .2s;background-color:#08f;color:#fff}.external-link:hover{opacity:.8}.no-data,.loading,.error{text-align:center;padding:40px;color:#a09b8c}.error{color:#e84057}