:root{--bg-a: #ffffff;--bg-b: #e9dbf8;--bg-c: #c7a2e8;--bg-gradient: linear-gradient(160deg, var(--bg-a) 0%, var(--bg-b) 45%, var(--bg-c) 100%);--bg-image-opacity: .15;--text-primary: #0a0a0c;--text-secondary: #2b2c30;--text-muted: #5b5d63;--panel-bg: rgba(255, 255, 255, .72);--panel-bg-solid: #ffffff;--panel-border: rgba(138, 99, 210, .25);--overlay-bg: rgba(255, 255, 255, .9);--highlight-gradient: radial-gradient(circle at 30% 25%, #ffffff 0%, #b569d9 45%, #e0559f 100%);--grid-panel-bg: linear-gradient(160deg, #eaddf7 0%, #c9a8e8 50%, #a8c8ef 100%);--icon-tile-bg: rgba(58, 32, 92, .92);--icon-tile-border: #ffffff;--header-bg: rgba(255, 255, 255, .85);--sidebar-bg: #ffffff;--sidebar-hover-bg: rgba(138, 99, 210, .12);--divider-color: rgba(138, 99, 210, .25);--input-bg: rgba(255, 255, 255, .9);--input-border: #8a63d2;--input-text: #0a0a0c;--button-border: #8a63d2;--accent: #8a63d2;--shadow-color: rgba(90, 60, 150, .15);--content-gap: 32px;--subnav-height: 64px;--header-height: 64px;--sidebar-clearance: 100px;--top-gap: 7.5px;--fixed-top-offset: calc(var(--header-height) + var(--top-gap));--header-title-gradient: linear-gradient(90deg, #8a63d2 0%, #b48ee0 50%, #6f8fe0 100%);--header-title-outline: transparent}[data-theme=dark]{--bg-a: #060c14;--bg-b: #101f30;--bg-c: #040609;--bg-gradient: linear-gradient(160deg, var(--bg-a) 0%, var(--bg-b) 50%, var(--bg-c) 100%);--bg-image-opacity: .29;--icon-tile-bg: rgba(30, 30, 35, .92);--icon-tile-border: var(--accent);--text-primary: #f4f9ff;--text-secondary: #d7e6f5;--text-muted: #9fb4c8;--panel-bg: rgba(13, 19, 27, .85);--panel-bg-solid: #0d131b;--panel-border: rgba(79, 158, 234, .2);--highlight-gradient: var(--panel-bg-solid);--grid-panel-bg: var(--panel-bg);--overlay-bg: rgba(4, 6, 9, .94);--header-bg: rgba(8, 13, 20, .92);--sidebar-bg: #070c12;--sidebar-hover-bg: rgba(79, 158, 234, .18);--divider-color: rgba(79, 158, 234, .25);--input-bg: rgba(8, 13, 20, .92);--input-border: #4f9eea;--input-text: #eaf6ff;--button-border: #4f9eea;--accent: #4f9eea;--shadow-color: rgba(0, 0, 0, .6);--header-title-gradient: linear-gradient(90deg, #1c2b4a 0%, #0a0e18 50%, #101a33 100%);--header-title-outline: var(--accent)}*{box-sizing:border-box;margin:0;padding:0}html,body{margin:0;padding:0;overflow-x:hidden}body{font-family:Merriweather,serif;background:var(--bg-gradient);color:var(--text-primary);margin:0;padding:var(--header-height) 1rem 1rem 0;transition:background-color .3s ease,color .3s ease}.main-page{margin:var(--top-gap) 0 var(--content-gap) var(--sidebar-clearance)}@media (max-width: 1024px){.main-page{margin:var(--top-gap) -15px var(--content-gap) -5px}}header{position:fixed;top:0;left:0;width:100%;height:var(--header-height);background:var(--header-bg);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:9998;display:flex;align-items:center;justify-content:space-between;padding:0 20px;box-shadow:0 2px 10px var(--shadow-color);box-sizing:border-box;transition:background-color .3s ease,box-shadow .3s ease}.header-brand{display:flex;align-items:center;gap:10px}.header-logo{height:40px;width:auto;display:block}.header-title{font-family:Montserrat,sans-serif;font-weight:700;font-size:20px;letter-spacing:.02em;white-space:nowrap;background:var(--header-title-gradient);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;-webkit-text-stroke:.6px var(--header-title-outline);color:transparent;transition:-webkit-text-stroke-color .3s ease}.header-link-button{display:inline-flex;align-items:center;gap:7px;padding:6px 16px;border-radius:999px;border:1.5px solid var(--accent);background:var(--input-bg);color:var(--accent);font-family:Montserrat,sans-serif;font-weight:600;font-size:13px;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background-color .2s ease,box-shadow .2s ease,transform .2s ease}.header-link-button:hover{background:var(--highlight-gradient);box-shadow:0 0 10px var(--accent);transform:translateY(-1px)}.header-link-button.active{background:var(--accent);color:#fff}.header-link-icon{width:18px;height:18px;display:block}.header-links{display:flex;align-items:center;gap:10px}.header-link-button--purple{border:1.5px solid transparent;background:linear-gradient(var(--input-bg),var(--input-bg)) padding-box,linear-gradient(90deg,#8a63d2,#b48ee0,#6f8fe0) border-box}.header-link-button--purple .header-link-label{background:linear-gradient(90deg,#8a63d2,#b48ee0,#6f8fe0);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}.header-link-button--purple:hover{box-shadow:0 0 10px #b48ee0}body:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background-image:url(https://raw.githubusercontent.com/iuhence/genshin/refs/heads/main/web/Snezhnaya.png);background-size:cover;background-repeat:no-repeat;background-position:center;opacity:var(--bg-image-opacity);z-index:-1;pointer-events:none;transition:opacity .3s ease}.sidebar{position:fixed;z-index:9997;top:0;left:0;height:100vh;width:75px;background-color:var(--sidebar-bg);border-right:2px solid var(--panel-border);transition:width .35s ease,background-color .3s ease,border-color .3s ease;overflow:hidden;display:flex;flex-direction:column;padding-top:20px}.sidebar:hover{width:200px}.sidebar-icons{margin-top:50px}.sidebar-item{display:flex;align-items:center;padding:2px 6px;margin:4px 8px;color:var(--text-secondary);text-decoration:none;border-radius:12.5px;background-color:transparent;transition:background-color .5s ease,color .2s ease,border-color .2s ease}.sidebar-item:hover,.sidebar-item.active{background-color:var(--sidebar-hover-bg)}.sidebar .sidebar-item{border-left:3px solid transparent}.sidebar:hover .sidebar-item.active{border-left-color:var(--accent)}.icon{font-size:.75rem;width:45px;height:45px;display:flex;align-items:center;justify-content:center}.label{opacity:0;margin-left:7.5px;transition:opacity .2s ease;white-space:normal;font-family:Merriweather,serif;font-weight:700;font-size:16px}.sidebar:hover .label{opacity:1}.sidebar-divider{border:none;border-top:1px solid var(--divider-color);margin:12px 8px;opacity:.6}.logo-container{display:relative;justify-content:center;align-items:center;width:100%}.logo-image{height:50px;width:auto;transition:transform .3s ease;transform:scale(1);background:none;transform:scale(1.15);z-index:999}.logo-image:hover{transform:scale(1.25)}.theme-switch{position:relative;display:inline-flex;align-items:center;width:48px;height:26px;padding:0;border-radius:999px;background-color:var(--input-bg);border:2px solid var(--button-border);cursor:pointer;transition:background-color .2s ease,border-color .3s ease}.theme-switch-knob{position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:var(--highlight-gradient);display:flex;align-items:center;justify-content:center;font-size:11px;line-height:1;transition:transform .3s ease}.theme-switch.is-dark .theme-switch-knob{transform:translate(22px)}.box-elements,.box-weapons,.box-rarity{display:flex;gap:8px;flex-wrap:wrap;z-index:9999}.button-filter{background-color:var(--icon-tile-bg);border:2px solid var(--icon-tile-border);border-radius:5px;width:36px;height:36px;cursor:pointer;justify-items:center;align-items:center;transition:background-color .2s,border-color .3s ease;font-family:Merriweather,serif;font-weight:700;color:var(--accent);overflow:hidden}.button-filter img{width:100%;height:100%;opacity:1;padding:2px}.button-filter:hover,.button-filter.active{border:2px solid var(--accent);background-color:var(--accent)}.sort-toggle{background-color:var(--input-bg);border:2px solid var(--button-border);border-radius:5px;width:40px;height:40px;cursor:pointer;justify-items:center;align-items:center;transition:background-color .2s,border-color .3s ease;font-family:Merriweather,serif;font-weight:700;color:var(--text-primary);overflow:hidden}.sort-divider{border:none;border-top:1.5px solid var(--divider-color);margin:10px 0;opacity:.5}.filter-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--overlay-bg);display:flex;align-items:center;justify-content:center;z-index:999}.filter-modal-content{background:var(--panel-bg-solid);border-radius:10px;padding:20px;max-width:80%;color:var(--text-primary);position:relative}.close-btn{position:relative;top:-10px;right:-290px;background:none;border:none;font-size:20px;color:var(--text-primary);cursor:pointer}.mobile-filter{background-color:var(--input-bg);border:2px solid var(--button-border);border-radius:5px;cursor:pointer;align-items:center;padding:10px;transition:background-color .2s,border-color .3s ease;font-family:Merriweather,serif;color:var(--text-primary)}.mobile-filter-toggle{display:none;margin-bottom:-20px}#search-bar{display:flex;top:0;align-items:center;gap:10px;justify-content:flex-end;margin-right:0;z-index:999}#search-input{padding:10px 16px;border-radius:5px;border:2px solid var(--input-border);background-color:var(--input-bg);color:var(--input-text);font-family:Merriweather,serif;font-size:14px;font-weight:700;width:100%;transition:border-color .2s ease,background-color .3s ease,color .3s ease}#search-input::placeholder{color:var(--text-muted);font-family:Merriweather,serif;font-size:14px;font-weight:700;opacity:1}#search-input::-webkit-input-placeholder,#search-input:-ms-input-placeholder,#search-input::-ms-input-placeholder{color:var(--text-muted);font-family:Merriweather,serif;font-size:14px;font-weight:700;opacity:1}#search-input:focus{outline:none;border-color:var(--accent);background:var(--highlight-gradient)}#clear-btn{background-color:var(--panel-bg);padding:17px 16px 2px;border-radius:5px;border:2px solid var(--input-border);font-size:14px;cursor:pointer;color:var(--text-muted);transition:color .2s,background-color .3s ease,border-color .3s ease;height:100%;justify-content:start}#clear-btn:hover{color:var(--text-primary)}.filter-left{display:flex;align-items:center;gap:20px}.filter-right{display:flex;align-items:center;gap:8px;margin-left:auto}.vertical-divider{height:36px;width:1.25px;background-color:var(--divider-color);margin-left:2px;margin-right:2px;opacity:.4}.character-ssr{background:linear-gradient(135deg,#ffb347,#fc3)}.character-sr{background:linear-gradient(135deg,#c084fc,#a855f7)}.character-r{background:linear-gradient(135deg,#9ca3af,#6b7280)}.page-wrapper{min-height:calc(100vh - 20px)}.site-footer{position:relative;left:50%;right:50%;margin-left:-50vw;margin-right:-50vw;width:100vw;box-sizing:border-box;font-family:Merriweather,serif;color:var(--text-primary);background:var(--header-bg);border-top:2px solid var(--panel-border);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;padding:24px 32px 24px 112px;margin-top:40px;transition:background-color .3s ease,border-color .3s ease,color .3s ease}.footer-left{display:flex;align-items:center;gap:16px}.footer-ip h4{font-size:12px;letter-spacing:.05em;text-transform:uppercase;margin-bottom:4px;color:var(--text-primary)}.footer-ip p{font-size:12px;max-width:420px;color:var(--text-muted)}.footer-right{display:flex;align-items:center;gap:8px}@media (min-width: 1025px){.site-footer{position:fixed;bottom:0;left:0;right:auto;margin-left:0;margin-right:0;margin-top:0;width:100vw;z-index:9996;padding:14px 32px 14px 112px;min-height:72px;box-shadow:0 -2px 10px var(--shadow-color)}body{padding-bottom:96px}}.social-link{display:flex;align-items:center;padding-top:8px}.social-icon{width:24px;height:24px;fill:var(--text-primary);margin:.15rem;transition:fill .2s ease}.social-link:hover .social-icon{fill:#ffe479}.character-element{position:absolute;top:5px;right:5px;width:20px;height:20px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.5));z-index:1}.modal-overlay{z-index:9999}.changelog-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--overlay-bg);display:flex;align-items:center;justify-content:center;padding:24px;box-sizing:border-box;z-index:10000}.changelog-modal{position:relative;width:min(640px,100%);max-height:85vh;overflow-y:auto;background:var(--panel-bg-solid);border-top:3px solid var(--accent);border-radius:12px;padding:28px 32px;box-shadow:0 10px 40px var(--shadow-color);box-sizing:border-box}.changelog-close{position:absolute;top:16px;right:16px;width:32px;height:32px;border-radius:8px;background:var(--input-bg);border:1.5px solid var(--panel-border);color:var(--text-primary);font-size:14px;cursor:pointer;transition:background-color .2s ease,border-color .2s ease}.changelog-close:hover{border-color:var(--accent);background:var(--highlight-gradient)}.changelog-header{display:flex;align-items:center;gap:10px}.changelog-header h2{margin:0;font-family:Montserrat,sans-serif;font-size:24px;color:var(--text-primary)}.changelog-subtitle{margin:4px 0 20px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}.changelog-entry{position:relative;margin-left:6px;padding-left:22px;padding-bottom:26px;border-left:2px solid var(--panel-border)}.changelog-entry.last{border-left:2px solid transparent;padding-bottom:0}.changelog-entry-header{display:flex;align-items:center;gap:10px;margin-bottom:10px}.changelog-dot{position:absolute;left:-7px;top:4px;width:12px;height:12px;border-radius:50%;background:var(--accent);border:2px solid var(--panel-bg-solid)}.changelog-entry-header h3{margin:0;font-family:Montserrat,sans-serif;font-size:16px;color:var(--text-primary)}.changelog-date{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:999px;background:var(--input-bg);border:1px solid var(--panel-border);color:var(--accent);font-size:11px;font-weight:700;white-space:nowrap}.changelog-section{margin-bottom:14px}.changelog-section h4{display:flex;align-items:center;gap:6px;margin:0 0 6px;font-size:14px;color:var(--text-primary)}.changelog-arrow{color:var(--accent)}.changelog-section ul{margin:0;padding-left:18px;list-style:disc}.changelog-section li{margin-bottom:6px;font-size:13.5px;line-height:1.5;color:var(--text-secondary)}.changelog-section li::marker{color:var(--accent)}.mobile-nav{display:none;position:fixed;bottom:0;left:0;width:100%;height:64px;background-color:var(--sidebar-bg);border-top:2px solid var(--panel-border);box-shadow:0 -2px 10px var(--shadow-color);justify-content:space-around;align-items:center;z-index:9999;transition:background-color .3s ease,border-color .3s ease}.icon{font-size:0;width:45px;height:45px;display:flex;justify-content:center;align-items:center;color:var(--text-secondary);transition:color .2s ease}@media (max-width: 1024px){:root{--content-gap: 20px;--top-gap: 24px}.sidebar{display:none}.mobile-nav{display:flex}body{padding-bottom:64px}.sidebar-item{width:45px;padding:2px}.label{display:none}.site-footer{padding:20px 16px;justify-content:center;text-align:center}.footer-left{flex-direction:column;text-align:center}.footer-ip p{max-width:100%}header{padding:0 12px}.header-title{font-size:14px}.header-nav-link,.header-nav-divider{display:none}.header-links{gap:6px}.header-link-button{padding:6px 10px}.header-link-button .header-link-label{display:none}.changelog-overlay{padding:12px}.changelog-modal{padding:20px 18px;max-height:90vh}.changelog-header h2{font-size:20px}.changelog-entry{padding-left:18px;padding-bottom:20px}}