.site-header{position:sticky;top:0;z-index:100;border-bottom:1px solid rgba(255,255,255,.09);background:#0a0a0ae6;box-shadow:0 6px 24px #0000001f;backdrop-filter:blur(16px)}.navbar{display:flex;max-width:1200px;min-height:64px;align-items:center;gap:1.5rem;margin:0 auto;padding:0 1rem}.logo-link{display:inline-flex;flex:0 0 auto;align-items:center;gap:.55rem;color:var(--accent);font-size:1.25rem;font-weight:750;letter-spacing:.2px;line-height:1;text-decoration:none;white-space:nowrap}.logo-link:hover{opacity:1;text-decoration:none}.nav-panel{display:flex;min-width:0;flex:1;align-self:stretch}.primary-nav{display:flex;align-items:stretch;gap:.15rem}.nav-link{position:relative;display:flex;align-items:center;gap:.45rem;border:0;padding:0 .75rem;background:transparent;color:color-mix(in srgb,var(--text) 82%,transparent);cursor:pointer;font:inherit;font-size:.92rem;font-weight:680;line-height:1.2;text-decoration:none;white-space:nowrap;transition:background .15s ease,color .15s ease}.nav-link:after{position:absolute;right:.75rem;bottom:0;left:.75rem;height:2px;border-radius:999px 999px 0 0;background:var(--accent);content:"";opacity:0;transform:scaleX(.55);transition:opacity .15s ease,transform .15s ease}a.nav-link:hover,a.nav-link:focus-visible,.nav-dropdown>summary:hover,.nav-dropdown>summary:focus-visible{background:#ffffff0d;color:var(--accent);opacity:1;outline:none;text-decoration:none}.nav-link[aria-current=page],.nav-dropdown.is-current>summary{color:var(--accent)}.nav-link[aria-current=page]:after,.nav-dropdown.is-current>summary:after{opacity:1;transform:scaleX(1)}.nav-dropdown{position:relative;display:flex}.nav-dropdown>summary{list-style:none}.nav-dropdown>summary::-webkit-details-marker{display:none}.dropdown-chevron{width:.45rem;height:.45rem;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .16s ease}.nav-dropdown[open] .dropdown-chevron{transform:translateY(1px) rotate(225deg)}.dropdown-menu{position:absolute;top:calc(100% + 8px);right:0;display:grid;min-width:180px;gap:.2rem;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:.45rem;background:color-mix(in srgb,rgb(10,10,10) 82%,var(--bg));box-shadow:0 16px 36px #0000004d}.dropdown-menu:before{position:absolute;right:0;bottom:100%;left:0;height:9px;content:""}.dropdown-link{border-radius:8px;padding:.65rem .75rem;color:var(--text);font-size:.9rem;font-weight:650;line-height:1.2;text-decoration:none;transition:background .15s ease,color .15s ease}.dropdown-link:hover,.dropdown-link:focus-visible,.dropdown-link[aria-current=page]{background:color-mix(in srgb,var(--accent) 11%,transparent);color:var(--accent);opacity:1;outline:none;text-decoration:none}.navbar-actions,.language-switcher{display:flex;flex:0 0 auto;align-items:center}.navbar-actions{gap:.6rem}.language-switcher{gap:.45rem}.language-label{color:color-mix(in srgb,var(--text) 72%,transparent);font-size:.82rem}.language-select{max-width:8.5rem;border:1px solid rgba(255,255,255,.11);border-radius:8px;padding:.42rem 1.8rem .42rem .65rem;background:#ffffff0d;color:var(--text);cursor:pointer;font:inherit;font-size:.84rem;transition:border-color .15s ease,background .15s ease}.language-select option{background:#fff;color:#111}.language-select:hover,.language-select:focus-visible{border-color:var(--accent);background:#ffffff14;outline:none}.nav-toggle{display:none;width:38px;height:38px;flex:0 0 auto;flex-direction:column;align-items:center;justify-content:center;gap:4px;border:1px solid rgba(255,255,255,.11);border-radius:9px;background:#ffffff0d;color:var(--text);cursor:pointer}.nav-toggle span{width:17px;height:2px;border-radius:99px;background:currentColor;transition:opacity .16s ease,transform .16s ease}.nav-toggle:hover,.nav-toggle:focus-visible{border-color:var(--accent);color:var(--accent);outline:none}.nav-is-open .nav-toggle span:first-child{transform:translateY(6px) rotate(45deg)}.nav-is-open .nav-toggle span:nth-child(2){opacity:0}.nav-is-open .nav-toggle span:last-child{transform:translateY(-6px) rotate(-45deg)}@media(max-width:980px){.navbar{position:relative;min-height:58px;gap:.75rem;padding:.55rem .75rem .55rem 1rem}.logo-link{min-width:0;flex:1;font-size:1.08rem}.nav-toggle{display:flex}.language-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}.language-select{max-width:7.25rem;padding:.38rem 1.45rem .38rem .55rem;font-size:.8rem}.nav-panel{position:absolute;top:100%;right:0;left:0;display:block;max-height:calc(100vh - 58px);overflow:auto;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.1);padding:.55rem .75rem .75rem;background:color-mix(in srgb,rgb(10,10,10) 82%,var(--bg));box-shadow:0 18px 30px #0000003d;opacity:0;pointer-events:none;transform:translateY(-8px);visibility:hidden;transition:opacity .16s ease,transform .16s ease,visibility .16s ease}.nav-is-open .nav-panel{opacity:1;pointer-events:auto;transform:translateY(0);visibility:visible}.primary-nav{display:grid;gap:.2rem}.nav-link{min-height:44px;border-radius:9px;padding:.7rem .8rem;font-size:.95rem}.nav-link:after{top:.65rem;right:auto;bottom:.65rem;left:0;width:2px;height:auto;border-radius:0 999px 999px 0;transform:scaleY(.55)}.nav-link[aria-current=page]:after,.nav-dropdown.is-current>summary:after{transform:scaleY(1)}.nav-dropdown{display:block}.nav-dropdown>summary{justify-content:space-between}.dropdown-menu{position:static;min-width:0;gap:.15rem;margin:.2rem 0 .25rem .8rem;border:0;border-left:1px solid rgba(255,255,255,.1);border-radius:0;padding:.2rem 0 .2rem .55rem;background:transparent;box-shadow:none}.dropdown-link{padding:.62rem .75rem}}@media(max-width:390px){.navbar{gap:.45rem;padding-right:.6rem;padding-left:1rem}.logo-link{gap:.4rem;font-size:.98rem}.navbar-actions{gap:.4rem}.language-select{width:5.85rem;padding-left:.45rem}.nav-toggle{width:36px;height:36px}}@media(prefers-reduced-motion:reduce){.nav-panel,.nav-toggle span,.dropdown-chevron{transition:none}}:root{font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Inter,Arial,Noto Sans,Helvetica Neue,sans-serif}*{box-sizing:border-box}body{display:flex;min-height:100vh;flex-direction:column;margin:0;padding:0;font-family:inherit;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}main,.page{flex:1 0 auto}.page{max-width:1200px;margin:0 auto;padding:0 16px}a{color:var(--accent);text-decoration:none;transition:opacity .15s ease}a:hover{opacity:.85;text-decoration:underline}.bold{font-weight:700}.card{position:relative;margin-bottom:12px;overflow:hidden;border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:14px;background:#00000018;backdrop-filter:blur(8px)}.card h2{margin:0 0 30px;color:var(--accent);font-weight:600;letter-spacing:.3px;text-align:center}.card h3{margin:30px 0 15px;color:var(--accent);font-weight:500;opacity:.9;text-align:center}.site-footer{width:100%;max-width:1100px;flex-shrink:0;margin:40px auto 0;padding:24px 16px 32px;color:color-mix(in srgb,var(--text) 72%,transparent);font-size:.85rem;text-align:center}.footer-links{display:flex;justify-content:center;gap:18px;margin-bottom:12px;font-weight:600}.site-footer p{margin:4px 0}.footer-version{font-size:.72rem;opacity:.8}@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}.usage-rank-number{display:grid;width:22px;min-height:22px;flex:0 0 22px;place-items:center;margin-right:6px;border:1px solid color-mix(in srgb,var(--character-rarity) 30%,transparent);border-radius:7px;background:color-mix(in srgb,var(--character-rarity) 14%,rgba(0,0,0,.22));color:color-mix(in srgb,#fff 88%,var(--character-rarity) 12%);font-size:.68rem;font-weight:900;line-height:1}:root{--bg: #153434;--text: hsla(0, 0%, 100%, .85);--accent: rgb(255, 215, 128);--element: #30d8a0}body{background:var(--bg);color:var(--text)}body[data-element=anemo]{--bg: #153434;--element: #30d8a0}body[data-element=cryo]{--bg: #235d74;--element: #7af0f0}body[data-element=dendro]{--bg: #263d21;--element: #9de43b}body[data-element=electro]{--bg: #352a63;--element: #c87fff}body[data-element=geo]{--bg: #3d2c1d;--element: #f3b530}body[data-element=hydro]{--bg: #15315c;--element: #02c0ff}body[data-element=pyro]{--bg: #3d1818;--element: #ff6640}body[data-element=base]{--bg: #153434;--element: #30d8a0}