@import"https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;600;700&display=swap";@import"https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@700&display=swap";: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%}body{font-family:Noto Sans JP,Noto Sans,Hiragino Sans,Hiragino Kaku Gothic ProN,Meiryo,sans-serif;-webkit-font-smoothing:antialiased}.app{width:100%;padding:8px;position:relative;min-height:100vh;overflow:visible}.app-background{position:absolute;inset:0;background-size:cover;background-position:center top;background-repeat:no-repeat;filter:brightness(.5);background-attachment:fixed;animation:app-bg-fade 1.2s ease forwards;z-index:0}.app-background-overlay{position:absolute;inset:0;background:#00000073;pointer-events:none}.app-content{position:relative;z-index:1;max-width:1200px;margin:0 auto;padding:96px 0 48px}@keyframes app-bg-fade{0%{opacity:0}to{opacity:1}}.header{position:absolute;top:12px;left:12px;margin:0;z-index:4}.logo{margin:0}.logo-image{max-width:140px;width:100%;height:auto;display:block}.search-container{display:flex;flex-direction:column;align-items:center;margin-bottom:32px;gap:8px;position:sticky;top:16px;z-index:3;background:#0006;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:14px;padding:12px 12px 16px;box-shadow:0 10px 30px #00000059,inset 0 0 0 1px #ffffff0d;border:1px solid rgba(255,255,255,.06);gap:10px}.lane-filter{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;width:100%;max-width:640px;justify-content:center}.lane-chip{background:#f0e6d21f;color:#f0e6d2;border:1px solid rgba(240,230,210,.2);border-radius:8px;padding:8px 10px;font-size:.75rem;cursor:pointer;transition:all .15s ease;display:inline-flex;align-items:center;justify-content:center;gap:4px;flex-direction:column}.lane-chip-label{font-size:.7rem;line-height:1}.lane-chip:hover{border-color:#f0e6d259;transform:translateY(-1px)}.lane-chip.is-active{background:#f0e6d21f;color:#f0e6d2;border-color:#4aa8ff;box-shadow:0 0 0 2px #4aa8ff59;border-radius:8px}.favorite-toggle img{width:18px;height:18px;display:block;filter:invert(1) brightness(1.6)}@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:16px;top:50%;transform:translateY(-50%);pointer-events:none}.search-icon img{width:18px;height:18px;display:block;opacity:.85;filter:invert(1) brightness(1.6)}.search-input{width:100%;padding:10px 16px 10px 36px;font-size:.95rem;border:1px solid rgba(255,255,255,.08);border-radius:8px;background:#ffffff1a;color:#f6f6f6;outline:none;transition:box-shadow .2s}.search-input:focus{border-color:#4aa8ff;box-shadow:0 0 0 2px #4aa8ff4d,0 8px 22px #0003}.search-input::placeholder{color:#f0f0f04d}.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,1fr);gap:4px;justify-items:center}@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%;position:relative}.favorite-button{position:absolute;top:6px;right:6px;width:22px;height:22px;display:grid;place-items:center;cursor:pointer;border-radius:50%;background:transparent;border:1px solid transparent;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:none;opacity:0;transition:opacity .15s ease,transform .15s ease,box-shadow .15s ease,background .15s ease,border-color .15s ease;padding:0}.favorite-button img{width:14px;height:14px;filter:invert(1) brightness(2);opacity:0;text-shadow:-3px -3px 6px rgba(0,0,0,.95),3px -3px 6px rgba(0,0,0,.95),-3px 3px 6px rgba(0,0,0,.95),3px 3px 6px rgba(0,0,0,.95)}.favorite-button:hover{transform:scale(1.05)}.favorite-button.is-active{opacity:1;background:#0000008c;border-color:#ffffff1f;box-shadow:0 10px 18px #00000073,inset 0 0 0 1px #ffffff14}.favorite-button.is-active img{filter:invert(1) brightness(2.2);opacity:1}.champion-card:hover .favorite-button{opacity:1;background:#00000073;border-color:#ffffff1f;box-shadow:0 8px 16px #0006,inset 0 0 0 1px #ffffff14}.champion-card:hover .favorite-button img{opacity:1}.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}}.champion-name{font-size:.6rem;color:#f0e6d2;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:80px;margin-top:-1px}.champion-lanes{display:flex;gap:4px;flex-wrap:wrap;justify-content:center}.champion-lane-chip{background:#f0e6d21f;color:#f0e6d2;border:1px solid rgba(240,230,210,.25);border-radius:999px;padding:2px 6px;font-size:.6rem;line-height:1.2;display:inline-flex;align-items:center;gap:4px}.loading,.error,.no-results{text-align:center;padding:40px;color:#a09b8c;font-size:1.1rem}.champion-detail{position:relative;min-height:100vh;padding:32px 16px 48px;display:flex;align-items:center;justify-content:center;background-size:cover;background-position:center top;background-repeat:no-repeat;overflow:hidden}.background-overlay{position:absolute;inset:0;background:linear-gradient(180deg,#0c0c0ccc,#0c0c0cbf 40%,#0c0c0ce6)}.detail-content{position:relative;z-index:1;max-width:640px;width:100%}.champion-info{text-align:center;margin-bottom:24px}.champion-title{color:#f0e6d2;font-size:1.8rem;margin:0 0 16px;font-weight:700;font-family:"Noto Serif JP",Hiragino Mincho ProN,Yu Mincho,serif}.champion-subtitle{color:#a0a0a0;font-size:.95rem;margin:0 0 4px}.champion-chips{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}.champion-chip{background:#f0e6d21f;color:#f0e6d2;border:1px solid rgba(240,230,210,.25);border-radius:999px;padding:6px 10px;font-size:.8rem;line-height:1;display:inline-flex;align-items:center;gap:6px}.champion-chip.is-lane{background:linear-gradient(135deg,#2e3f54,#1d2734);color:#f5f7fb;border-color:#4aa8ff;box-shadow:0 4px 12px #00000040}.counter-sections{display:flex;flex-direction:column;gap:24px;margin-bottom:32px}.counter-section{background-color:transparent}.section-title{color:#f0e6d2;font-size:1rem;font-weight:700;margin:0 0 12px}.matchup-list{display:flex;gap:12px;overflow-x:auto;padding-bottom:8px}.matchup-item{display:flex;flex-direction:column;align-items:center;gap:4px;flex-shrink:0;cursor:pointer;transition:opacity .2s}.matchup-item:hover{opacity:.7}.matchup-image{width:56px;height:56px;border-radius:4px;border:none}.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;gap:12px;margin-bottom:24px}.external-link{flex:1;padding:12px 16px;border-radius:8px;text-decoration:none;font-size:.9rem;font-weight:700;text-align:center;transition:opacity .2s;position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px}.external-link:hover{opacity:.8}.external-link{background:linear-gradient(135deg,#4aa8ff,#1f6fbf);color:#0c1a24;border:1px solid rgba(255,255,255,.1)}.external-link:before{content:"";width:14px;height:14px;display:inline-block;background-color:currentColor;mask:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='currentColor'%20class='size-6'%3e%3cpath%20fill-rule='evenodd'%20d='M19.902%204.098a3.75%203.75%200%200%200-5.304%200l-4.5%204.5a3.75%203.75%200%200%200%201.035%206.037.75.75%200%200%201-.646%201.353%205.25%205.25%200%200%201-1.449-8.45l4.5-4.5a5.25%205.25%200%201%201%207.424%207.424l-1.757%201.757a.75.75%200%201%201-1.06-1.06l1.757-1.757a3.75%203.75%200%200%200%200-5.304Zm-7.389%204.267a.75.75%200%200%201%201-.353%205.25%205.25%200%200%201%201.449%208.45l-4.5%204.5a5.25%205.25%200%201%201-7.424-7.424l1.757-1.757a.75.75%200%201%201%201.06%201.06l-1.757%201.757a3.75%203.75%200%201%200%205.304%205.304l4.5-4.5a3.75%203.75%200%200%200-1.035-6.037.75.75%200%200%201-.354-1Z'%20clip-rule='evenodd'%20/%3e%3c/svg%3e") center / contain no-repeat;-webkit-mask:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='currentColor'%20class='size-6'%3e%3cpath%20fill-rule='evenodd'%20d='M19.902%204.098a3.75%203.75%200%200%200-5.304%200l-4.5%204.5a3.75%203.75%200%200%200%201.035%206.037.75.75%200%200%201-.646%201.353%205.25%205.25%200%200%201-1.449-8.45l4.5-4.5a5.25%205.25%200%201%201%207.424%207.424l-1.757%201.757a.75.75%200%201%201-1.06-1.06l1.757-1.757a3.75%203.75%200%200%200%200-5.304Zm-7.389%204.267a.75.75%200%200%201%201-.353%205.25%205.25%200%200%201%201.449%208.45l-4.5%204.5a5.25%205.25%200%201%201-7.424-7.424l1.757-1.757a.75.75%200%201%201%201.06%201.06l-1.757%201.757a3.75%203.75%200%201%200%205.304%205.304l4.5-4.5a3.75%203.75%200%200%200-1.035-6.037.75.75%200%200%201-.354-1Z'%20clip-rule='evenodd'%20/%3e%3c/svg%3e") center / contain no-repeat}.back-link{display:block;color:#a09b8c;text-decoration:none;font-size:.9rem;text-align:center;padding:12px;transition:color .2s;position:relative;display:inline-flex;align-items:center;gap:6px}.back-link:hover{color:#f0e6d2}.back-link:before{content:"";width:14px;height:14px;display:inline-block;background-color:currentColor;mask:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='currentColor'%20class='size-6'%3e%3cpath%20fill-rule='evenodd'%20d='M9.53%202.47a.75.75%200%200%201%200%201.06L4.81%208.25H15a6.75%206.75%200%200%201%200%2013.5h-3a.75.75%200%200%201%200-1.5h3a5.25%205.25%200%201%200%200-10.5H4.81l4.72%204.72a.75.75%200%201%201-1.06%201.06l-6-6a.75.75%200%200%201%200-1.06l6-6a.75.75%200%200%201%201.06%200Z'%20clip-rule='evenodd'%20/%3e%3c/svg%3e") center / contain no-repeat;-webkit-mask:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='currentColor'%20class='size-6'%3e%3cpath%20fill-rule='evenodd'%20d='M9.53%202.47a.75.75%200%200%201%200%201.06L4.81%208.25H15a6.75%206.75%200%200%201%200%2013.5h-3a.75.75%200%200%201%200-1.5h3a5.25%205.25%200%201%200%200-10.5H4.81l4.72%204.72a.75.75%200%201%201-1.06%201.06l-6-6a.75.75%200%200%201%200-1.06l6-6a.75.75%200%200%201%201.06%200Z'%20clip-rule='evenodd'%20/%3e%3c/svg%3e") center / contain no-repeat}.no-data,.loading,.error{text-align:center;padding:40px;color:#a09b8c}.error{color:#e84057}