600;700&family=Noto+Sans+Georgian:wght@400;500;600;700&family=Noto+Serif+Georgian:wght@500;600;700&display=swap');
@font-face{font-family:Beaufort for LOL;src:url(assets/beaufort-bold.woff2) format("woff2");font-weight:600 900;font-display:optional}@font-face{font-family:Beaufort for LOL;src:url(assets/beaufort-medium.woff2) format("woff2");font-weight:400 500;font-display:optional}:root{color-scheme:dark;--gold:#f0c45b;--bright:#ffe09a;--muted:#9da6ac;--line:#554529;--surface:#101b24;--bg:#071018;--heading:"Beaufort for LOL","Cinzel","Noto Serif Georgian",serif}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 50% 26%,#17232a,#0a151d 48%,#050b11);color:#e9e4d8;font-family:Noto Sans Georgian,sans-serif;font-size:16px;line-height:1.75}button,input{font:inherit}button{cursor:pointer}a{color:var(--gold)}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--bright);outline-offset:5px}button{color:inherit}header{height:82px;display:flex;justify-content:space-between;align-items:center;max-width:1400px;padding:0 40px;margin:auto}nav{display:flex;gap:15px;min-height:40px}.nav-button{background:transparent;border:1px solid #766033;border-radius:5px;padding:6px 15px;color:var(--gold);display:flex;gap:10px;align-items:center;font-size:14px}.nav-button[hidden]{display:none}.nav-button:hover{background:#e0b35212;border-color:var(--gold)}.nav-button svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.5}.edition{display:flex;align-items:center;gap:12px;color:var(--muted);font-family:var(--heading);font-size:13px;letter-spacing:.1em}.edition i{height:13px;border-left:1px solid #665435}.edition a{text-decoration:none}main{max-width:1280px;min-height:calc(100vh - 148px);margin:auto;padding:20px 40px 55px}main:focus{outline:none}h1,h2,h3{font-family:var(--heading);color:var(--gold);font-weight:600;line-height:1.5}h1{font-size:30px;margin:0}h2{font-size:23px;margin:0}p{margin:0}.home-screen{min-height:calc(100vh - 220px);display:flex;flex-direction:column;align-items:center;justify-content:center;padding-bottom:40px}.mark{width:83px;height:88px;object-fit:contain;filter:drop-shadow(0 0 15px #e9b84e20);display:block}.home-screen>.mark{margin-bottom:20px}.home-screen h1{font-size:21px;margin-bottom:57px}.lane-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:30px;width:100%;max-width:1050px}.lane-card{height:247px;border:2px solid #d8aa43;border-radius:26px;background:linear-gradient(160deg,#19252b90,#0c151bb3);box-shadow:0 0 0 1px #dfb55317,inset 0 0 24px #dda93f06;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:24px;transition:transform .2s,border-color .2s,box-shadow .2s;color:var(--gold);position:relative}.lane-card img{height:61px;width:61px;object-fit:contain;filter:brightness(0) saturate(100%) invert(85%) sepia(49%) saturate(661%) hue-rotate(341deg) brightness(104%) contrast(88%)}.lane-card b{font-family:var(--heading);font-size:20px;letter-spacing:.06em}.lane-card small{display:block;font-size:12px;letter-spacing:0;color:#bbae8e;font-weight:400}.lane-card:hover{transform:translateY(-7px);border-color:var(--bright);box-shadow:0 0 30px #f3c15720,inset 0 0 40px #d3a73c0d}.lane-card:after{content:"";height:3px;width:30px;position:absolute;bottom:20px;background:var(--gold);opacity:.6}.screen-head{text-align:center;margin:10px 0 34px}.screen-head .lane-mini{width:30px;height:30px;object-fit:contain;margin-bottom:10px;filter:sepia(1) saturate(3)}.sub{font-size:14px;color:var(--muted);margin-top:8px}.search-wrap{position:relative;max-width:600px;margin:25px auto 32px}.search-wrap svg{position:absolute;width:20px;height:20px;left:18px;top:17px;stroke:var(--gold);fill:none;stroke-width:1.5}.search-wrap input{width:100%;padding:13px 50px;border:1px solid #8e713a;border-radius:5px;background:#0b141d;color:#f0e4c8;font-size:16px;outline-offset:3px}.search-wrap input::placeholder{color:#b6ac95}.search-clear{position:absolute;right:12px;top:10px;background:none;border:0;color:var(--gold);font-size:22px}.champ-grid{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:24px 19px}.champ{border:0;background:transparent;padding:0;min-width:0;text-align:center;color:#d4c9b0}.champ img{aspect-ratio:1;object-fit:cover;width:100%;height:auto;border:1px solid #625236;border-radius:7px;display:block;transition:filter .2s,border-color .2s,transform .2s;filter:saturate(.86)}.champ b{font-size:13px;font-weight:500;line-height:1.5;display:block;margin-top:8px;overflow-wrap:anywhere}.champ small{display:block;color:#87939a;font-size:11px;line-height:1.5;margin-top:2px}.champ:hover img{border-color:var(--bright);filter:saturate(1.15);transform:translateY(-3px)}.champ:hover b{color:var(--gold)}.no-results{text-align:center;grid-column:1/-1;padding:50px;color:var(--muted)}.choose-screen{min-height:calc(100vh - 220px);display:flex;align-items:center;justify-content:center}.direction-grid{display:grid;grid-template-columns:235px minmax(190px,270px) 235px;gap:65px;align-items:center}.direction-card{height:267px;border:2px solid #d8aa43;border-radius:26px;background:linear-gradient(145deg,#17232a,#0b131a);color:var(--gold);padding:28px 20px;box-shadow:inset 0 0 30px #d5ad3c05;transition:all .2s}.direction-card:hover{border-color:var(--bright);box-shadow:0 0 35px #e7ba4520;transform:translateY(-4px)}.direction-card strong{font-family:var(--heading);font-size:23px;display:block;line-height:1.7;font-weight:600}.direction-card small{color:#b8aa89;font-size:13px;display:block;margin-top:17px}.chosen-center{display:flex;flex-direction:column;align-items:center;text-align:center}.chosen-center>.mark{width:67px;height:70px;margin-bottom:23px}.selected-portrait{width:91px;height:91px;object-fit:cover;border:1px solid var(--gold);border-radius:50%;margin-bottom:13px;box-shadow:0 0 0 6px #e1b44708}.chosen-center h1{font-size:23px;overflow-wrap:anywhere}.chosen-center .sub{margin-top:3px}.result-screen{max-width:930px;margin:auto}.results-header{display:flex;align-items:center;gap:18px;margin:15px 0 17px}.results-header .selected-portrait{margin:0;width:76px;height:76px;border-radius:8px;flex-shrink:0}.results-header h1{font-size:24px}.results-header .sub{margin:4px 0 0}.switch-link{margin-left:auto;font-size:13px;background:none;border:1px solid #705c35;color:var(--gold);border-radius:5px;padding:7px 11px;flex-shrink:0}.context-note{color:#a8adae;font-size:13px;margin-bottom:25px}.matchup{border:1px solid #776039;border-radius:8px;background:#0f1a23c9;margin-bottom:15px;overflow:hidden}.matchup summary{cursor:pointer;list-style:none;padding:18px 21px;display:flex;align-items:center;gap:17px}.matchup summary::-webkit-details-marker{display:none}.matchup summary:after{content:"+";font-family:serif;font-size:26px;color:var(--gold);margin-left:auto}.matchup[open] summary:after{content:"−"}.matchup summary img{width:62px;height:62px;border:1px solid #a48143;border-radius:5px;object-fit:cover}.matchup h2{font-size:20px}.english{color:#959fa4;font-size:12px}.verdict{color:#dfbf78;font-size:12px;margin-left:auto;max-width:185px;text-align:right}.verdict.caution{color:#b8b4a9}.match-body{padding:0 23px 23px}.match-body p{font-size:16px;line-height:1.95;color:#dbdcd8;border-top:1px solid #76603242;padding-top:18px}.match-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:20px;color:var(--muted);font-size:12px}.match-foot a{text-decoration:none}.statline{color:#acb7b7;font-size:12px}.statline b{color:#dac596;font-size:14px}.rank-number{font-family:var(--heading);font-size:13px;color:#7e7258;min-width:13px}.loading{text-align:center;padding:20vh 10px;color:var(--gold)}footer{max-width:1400px;display:flex;justify-content:space-between;align-items:center;margin:auto;height:66px;padding:0 40px;color:#777f82;font-size:12px}footer>span{font-family:var(--heading);letter-spacing:.08em}footer button{font-size:12px;background:none;border:0;color:#b5a781}dialog{background:#101a23;color:#d4d8d7;border:1px solid #a78140;border-radius:12px;width:min(650px,calc(100% - 30px));padding:30px;max-height:85vh}dialog::backdrop{background:#000b;backdrop-filter:blur(5px)}dialog h2{font-size:21px;padding-right:25px}dialog p{font-size:14px;line-height:1.9;margin-top:17px}.dialog-close{position:absolute;right:16px;top:12px;font-size:26px;color:var(--gold);border:0;background:none}.skip{position:fixed;top:-100px;left:20px;padding:10px;background:#10202d;z-index:10}.skip:focus{top:10px}[hidden]{display:none!important}@media(max-width:1000px){.lane-grid{gap:18px}.lane-card{height:218px;border-radius:22px}.lane-card b{font-size:17px}.champ-grid{grid-template-columns:repeat(7,minmax(0,1fr))}.direction-grid{grid-template-columns:210px minmax(150px,210px) 210px;gap:35px}.direction-card{height:245px}.direction-card strong{font-size:20px}}@media(max-width:760px){header{padding:0 20px;height:72px}main{padding:15px 22px 35px;min-height:calc(100vh - 135px)}.lane-grid{grid-template-columns:repeat(3,minmax(0,1fr));max-width:570px;gap:18px}.lane-card{height:190px}.home-screen h1{margin-bottom:30px}.home-screen{padding-bottom:10px}.home-screen>.mark{height:70px;width:66px;margin-bottom:13px}.lane-card:nth-child(4){grid-column:1;transform:translate(55%)}.lane-card:nth-child(5){grid-column:2;transform:translate(55%)}.champ-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:20px 13px}.direction-grid{grid-template-columns:1fr 1fr;gap:22px;max-width:550px;width:100%}.chosen-center{grid-column:1/-1;grid-row:1}.chosen-center>.mark{width:46px;height:48px;margin-bottom:16px}.direction-card{height:205px;grid-row:2;border-radius:21px}.direction-card strong{font-size:21px}.choose-screen{min-height:calc(100vh - 190px)}.selected-portrait{width:73px;height:73px}.results-header{flex-wrap:wrap}.switch-link{margin-left:94px}.result-screen{max-width:650px}.results-header h1{font-size:22px}footer{padding:0 22px}.matchup summary{gap:13px;padding:16px}.matchup h2{font-size:18px}.verdict{font-size:11px;max-width:118px}.match-body{padding:0 18px 20px}.match-foot{align-items:flex-start;flex-direction:column}}@media(max-width:460px){.lane-grid{gap:13px}.lane-card{height:163px;border-radius:19px;gap:16px}.lane-card img{width:43px;height:43px}.lane-card b{font-size:14px}.lane-card small{font-size:10px}.lane-card:after{bottom:15px;width:22px}.home-screen h1{font-size:19px}.edition{font-size:11px;gap:7px}.nav-button{padding:5px 8px;font-size:12px;gap:5px}nav{gap:7px}.champ-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px 12px}.screen-head h1{font-size:24px}.search-wrap input{font-size:14px}.direction-card{height:200px;padding:20px 10px}.direction-card strong{font-size:18px}.direction-card small{font-size:11px}.direction-grid{gap:15px}.matchup summary{display:grid;grid-template-columns:15px 52px minmax(0,1fr) 15px;gap:3px 10px}.matchup summary img{width:52px;height:52px;grid-row:1/3;grid-column:2}.rank-number{grid-row:1/3;grid-column:1}.matchup summary>div{grid-column:3}.verdict{grid-column:3;text-align:left;margin-left:0;max-width:none}.matchup summary:after{grid-column:4;grid-row:1/3}.match-body p{font-size:15px}.results-header h1{font-size:20px}.results-header>div{max-width:calc(100% - 95px)}.context-note{font-size:12px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}:where(.lol-action,.nav-button,.community-link,.chip,.rank-tile,.rank-div,.lane-o,.q-opt,.game-switch button,.var-tabs button,.rr-chip,.color-dot,.lib-sel,.bc-go,.pick-cats button,.pf-tabs button,.like-btn,.shop-item,.spell,.rune-pick,.cp-tile,.lane-pills button,.q-period button,.rank-chip,.tree-row button,.pt-form button,.lm-node,.rm-card,.build-card,.botw-card,.bc-chip,.quiz-link,.top-nav a,.top-nav button,#wr-nav button,#wr-nav a,.wi-pick-btn,.wi-pick-grid button,.lane-tabs button){transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,background .16s ease,color .16s ease,filter .16s ease}@media(hover:hover){:where(.lol-action,.nav-button,.community-link,.chip,.rank-tile,.rank-div,.lane-o,.q-opt,.game-switch button,.var-tabs button,.rr-chip,.color-dot,.lib-sel,.bc-go,.pick-cats button,.pf-tabs button,.like-btn,.shop-item,.spell,.rune-pick,.cp-tile,.lane-pills button,.q-period button,.rank-chip,.tree-row button,.pt-form button,.rm-card,.build-card,.botw-card,.bc-chip,.quiz-link,.top-nav a,.top-nav button,#wr-nav button,#wr-nav a,.wi-pick-btn,.lane-tabs button):hover{transform:translateY(-2px);box-shadow:0 10px 22px -14px #000b,0 0 14px -5px var(--accent,#49c5d6);filter:brightness(1.07)}}:where(.lol-action,.nav-button,.community-link,.chip,.rank-tile,.rank-div,.lane-o,.q-opt,.game-switch button,.var-tabs button,.rr-chip,.lib-sel,.bc-go,.pick-cats button,.pf-tabs button,.like-btn,.shop-item,.spell,.rune-pick,.cp-tile,.lane-pills button,.q-period button,.pt-form button,.rm-card,.build-card,.botw-card):active{transform:translateY(0) scale(.985);filter:none}:where(button,.lol-action)[disabled]:hover,:where(button,.lol-action)[aria-disabled=true]:hover{transform:none;box-shadow:none;filter:none}@media(prefers-reduced-motion:reduce){:where(.lol-action,.nav-button,.community-link,.chip,.rank-tile,.rank-div,.lane-o,.q-opt,.game-switch button,.var-tabs button,.rr-chip,.lib-sel,.bc-go,.pick-cats button,.pf-tabs button,.like-btn,.shop-item,.spell,.rune-pick,.cp-tile,.lane-pills button,.q-period button,.pt-form button,.rm-card,.build-card,.botw-card):hover{transform:none}}.wi-pick{position:relative;flex:none;overflow:visible;padding-block:1px}.wi-pick-btn{display:inline-flex;align-items:center;gap:7px;background:var(--raise,#141a24);border:1px solid var(--line,#26303d);border-radius:10px;padding:7px 11px;color:var(--ink,#e8edf4);font:inherit;font-size:12.5px;line-height:1.2;min-height:38px;box-sizing:border-box;cursor:pointer;white-space:nowrap;overflow:visible}.wi-pick-btn:hover{border-color:var(--accent,#49c5d6)}.wi-pick-btn[aria-expanded=true]{border-color:var(--accent,#49c5d6);box-shadow:0 0 0 1px var(--accent,#49c5d6)}.wi-pick-dot{width:15px;height:15px;border-radius:50%;background:var(--accent,#49c5d6);flex:none;box-shadow:inset 0 0 0 1px #ffffff40,0 0 10px -1px currentColor;filter:saturate(1.35) brightness(1.12)}.wi-pick-tag{font-style:normal;font-size:10.5px;font-weight:700;letter-spacing:.04em;color:var(--accent,#49c5d6);border:1px solid var(--line,#26303d);border-radius:5px;padding:2px 5px;flex:none}.wi-pick-value{max-width:13ch;overflow:hidden;text-overflow:ellipsis}.wi-pick-caret{font-style:normal;font-size:9px;color:var(--faint,#7b8798);flex:none}.wi-pick-menu{position:fixed;top:0;left:0;z-index:9000;width:252px;box-sizing:border-box;background:var(--card,#0e131b);border:1px solid var(--line,#26303d);border-radius:14px;padding:12px;box-shadow:0 18px 40px -18px #000e,0 0 0 1px #0006}.wi-pick-menu[data-pick=lang]{width:232px}.wi-pick-menu[hidden]{display:none}.wi-pick-title{margin:0 0 9px;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--faint,#7b8798)}.wi-pick-grid{display:grid;gap:6px}.wi-pick-grid.two{grid-template-columns:1fr}.wi-pick-grid button.wide{margin-top:4px;border-top:1px solid var(--line,#26303d);border-radius:0 0 9px 9px;padding-top:9px}.wi-pick-grid button{position:relative;display:flex;align-items:center;gap:6px;min-width:0;background:var(--raise,#141a24);border:1px solid transparent;border-radius:9px;padding:7px 16px 7px 8px;color:var(--muted,#9aa7b8);font:inherit;font-size:12px;line-height:1.2;cursor:pointer;text-align:left}.wi-pick-grid button:hover{color:var(--ink,#e8edf4);border-color:var(--line,#26303d)}.wi-pick-grid button:focus-visible{outline:2px solid var(--accent,#49c5d6);outline-offset:1px}.wi-pick-grid button.on{color:var(--ink,#e8edf4);border-color:var(--sw,var(--accent,#49c5d6))}.wi-pick-grid button span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wi-swatch{width:15px;height:15px;border-radius:50%;background:var(--sw);flex:none;box-shadow:inset 0 0 0 1px var(--sr,#ffffff33),0 0 8px -2px var(--sw)}.wi-swatch[style*=--sr]{box-shadow:inset 0 0 0 1.5px var(--sr),0 0 0 1px #0006}.wi-tag{font-style:normal;font-size:10px;font-weight:700;letter-spacing:.04em;flex:none;width:26px;text-align:center;color:var(--faint,#7b8798)}.wi-pick-grid button.on .wi-tag{color:var(--accent,#49c5d6)}.wi-tick{position:absolute;right:5px;top:50%;transform:translateY(-50%);font-style:normal;font-size:11px;color:var(--accent,#49c5d6);opacity:0}.wi-pick-grid button.on .wi-tick{opacity:1}@media(max-width:560px){.wi-pick-menu{width:min(252px,calc(100vw - 20px))}.wi-pick-menu[data-pick=lang]{width:min(232px,calc(100vw - 20px))}.wi-pick-value{display:none}}.wi-splash{position:fixed;inset:0;z-index:9999;pointer-events:none;contain:strict;overflow:hidden}.wi-splash i{position:absolute;display:block;border-radius:50%}.wi-splash-ball{left:var(--x);top:var(--y);width:34px;height:34px;margin:-17px 0 0 -17px;background:radial-gradient(circle at 34% 30%,#fff,var(--c) 58%,color-mix(in srgb,var(--c) 64%,#000) 100%);box-shadow:0 0 18px 4px var(--c),0 0 40px 9px color-mix(in srgb,var(--c) 45%,transparent);animation:wi-ball .33s cubic-bezier(.55,0,.75,.25) forwards}.wi-splash-flash{left:50%;top:50%;width:200px;height:200px;margin:-100px 0 0 -100px;opacity:0;background:radial-gradient(circle,#fff 0%,var(--c) 46%,transparent 72%);transform:scale(.1);animation:wi-flash .26s .33s ease-out forwards}.wi-splash-wave{left:50%;top:50%;width:var(--r);height:var(--r);margin:calc(var(--r)/-2) 0 0 calc(var(--r)/-2);background:radial-gradient(circle,var(--c) 0%,var(--c) 44%,color-mix(in srgb,var(--c) 62%,transparent) 68%,transparent 80%);opacity:0;transform:scale(0);animation:wi-wave .58s .33s cubic-bezier(.18,.82,.26,1) forwards}.wi-splash-ring{left:50%;top:50%;width:var(--r);height:var(--r);margin:calc(var(--r)/-2) 0 0 calc(var(--r)/-2);border:2px solid var(--c);opacity:0;transform:scale(0);box-shadow:0 0 22px 2px var(--c);animation:wi-ring .5s .33s cubic-bezier(.14,.86,.24,1) forwards}@keyframes wi-ball{0%{transform:translate(0) scale(.45);opacity:0}12%{opacity:1}78%{transform:translate(calc(50vw - var(--x)),calc(50vh - var(--y))) scale(1.2);opacity:1}to{transform:translate(calc(50vw - var(--x)),calc(50vh - var(--y))) scale(.2);opacity:1}}@keyframes wi-flash{0%{transform:scale(.1);opacity:1}to{transform:scale(3);opacity:0}}@keyframes wi-wave{0%{transform:scale(0);opacity:1}46%{opacity:.9}to{transform:scale(1.06);opacity:0}}@keyframes wi-ring{0%{transform:scale(.02);opacity:.9}to{transform:scale(1);opacity:0}}@media(prefers-reduced-motion:reduce){.wi-splash{display:none}}
