/* Reference finish: original League typography/art, live scene, unchanged controls. */
:root{--ivory:#f5ead4;--line:#9e8150;--cyan:#e7be67;--gold:#e7c477;--gold-bright:#ffdfa0;--nav-h:calc(66 * var(--rs));--rank-height:calc(156 * var(--rs));--roster-height:calc(136 * var(--rs))}
body:has(#menu:not([hidden])) #game{filter:saturate(.92)contrast(1.08)brightness(.96)}
#menu{background:linear-gradient(90deg,#010b15ad 0%,#020f1820 32%,transparent 59%,#020d17d9 68%),linear-gradient(0deg,#010b14bf,transparent 42%),linear-gradient(180deg,#09213b35,transparent 65%);color:var(--ivory)}
#menu:before{content:'';position:absolute;inset:var(--nav-h) 32% 25% 0;background:linear-gradient(145deg,#10376524,transparent 65%);pointer-events:none}
#menu header{height:var(--nav-h);padding:0 calc(206 * var(--rs)) 0 calc(36 * var(--rs));gap:calc(30 * var(--rs));background:linear-gradient(110deg,#020c15fc,#061420f5);border-bottom:1px solid #c5a35e;box-shadow:0 4px 24px #0005}
#menu header>.brand{width:calc(330 * var(--rs));gap:calc(18 * var(--rs));font:700 calc(34 * var(--rs))/1 Beaufort,serif;letter-spacing:.7px;color:#f5e7cd;text-shadow:0 1px 1px #000}
#menu header .brand img{width:calc(74 * var(--rs));height:calc(50 * var(--rs));object-fit:contain;filter:drop-shadow(0 2px 4px #0008)}
#menu .home-rail button{gap:calc(9 * var(--rs));flex-direction:row;padding:0 calc(14 * var(--rs));color:#c6c9cf}
#menu .home-rail button svg{display:block;width:calc(21 * var(--rs));height:calc(21 * var(--rs));stroke-width:1.7}
#menu .home-rail button span,#menu .home-rail button[data-shell=achievements] span{font:700 clamp(11px,calc(17 * var(--rs)),20px)/1 Beaufort,serif;letter-spacing:.3px}
#menu .home-rail button:before{display:none}
#menu .home-rail button.active{color:#ffe3a0;background:radial-gradient(ellipse at bottom,#ddaa3933,transparent 70%);border-bottom:3px solid #e8c16c}
#menu .home-rail button.active:after{left:15%;width:70%;height:2px;bottom:-3px;transform:none;background:#ffdf8c;border:0;box-shadow:0 0 15px #edbd5b}
#menu .home-rail button:hover{color:#fff0c6;background:linear-gradient(0deg,#ae803026,transparent)}
#menu .profile-summary{right:calc(20 * var(--rs));width:calc(180 * var(--rs));height:var(--nav-h);filter:none}
#menu #rankProfile{clip-path:none;border:0;border-left:1px solid #8f73424d;background:none;box-shadow:none;padding:0;overflow:visible}
#menu .profile-medallion{position:absolute;left:0;top:0;width:200px;height:174px;transform:scale(calc(.36 * var(--rs) / 1px));transform-origin:top left}
#menu .profile-gem{display:none}
#menu #displayName,#menu #profileNameInput{left:calc(78 * var(--rs));top:calc(16 * var(--rs));width:calc(104 * var(--rs));height:calc(23 * var(--rs));text-align:left;font:500 calc(17 * var(--rs))/1.2 Beaufort,serif!important;margin:0}
#menu #earnedRankName{left:calc(78 * var(--rs));top:calc(40 * var(--rs));width:auto;font:500 calc(11 * var(--rs))/1 Beaufort,serif;letter-spacing:1px;color:#d6b572}
#menu #earnedRankName:before,#menu #earnedRankName:after{display:none}
#menu #profileNameInput{border-color:#dcb76b;box-shadow:0 0 0 2px #c7963324}
#menu .menu-grid{inset:var(--nav-h) calc(24 * var(--rs)) calc(37 * var(--rs))!important}
#menu .location-panel{inset:calc(22 * var(--rs)) 0 calc(var(--rank-height) + 18 * var(--rs)) auto!important;width:31.8%!important;height:auto!important;gap:calc(12 * var(--rs))!important;padding:calc(16 * var(--rs))!important;border:1px solid #a88d59!important;border-radius:10px!important;background:linear-gradient(145deg,#061722f5,#020b13f7)!important;box-shadow:inset 0 0 0 4px #020c14,0 10px 35px #0005!important;overflow:visible!important}
#menu .training-heading{height:calc(66 * var(--rs));gap:12px;flex-direction:column;align-items:stretch;order:0}
#menu .training-heading>div:first-child{display:none}
#menu .training-kind.mode-switch{display:flex;flex:1;width:100%;margin:0!important;padding:3px;gap:4px;border:1px solid #746344;background:#020b13;border-radius:4px;min-height:calc(48 * var(--rs))}
#menu .training-kind.mode-switch button{flex:1;min-height:0;padding:calc(12 * var(--rs));font:700 calc(19 * var(--rs))/1 Beaufort,serif;text-transform:uppercase;color:#a6afb9;letter-spacing:.5px}
#menu .training-kind.mode-switch button[aria-pressed=true]{background:linear-gradient(180deg,#57432270,#1a1c1b)!important;box-shadow:inset 0 0 0 1px #d4b36d,inset 0 -2px #edc475,0 0 10px #e8b7481f!important;color:#ffdfa0;border-radius:2px}
#menu .training-kind.mode-switch button span{color:#ddbf7a}
#menu .rank-showcase{order:1;flex:1;min-height:calc(150 * var(--rs));max-height:calc(215 * var(--rs));padding:calc(8 * var(--rs)) calc(10 * var(--rs));border:0;border-bottom:1px solid #6e5c3d;background:radial-gradient(ellipse at 25% 60%,#ba8e2114,transparent 64%);clip-path:none}
#menu .rank-top{height:calc(22 * var(--rs))}
#menu .section-label{font:500 calc(13 * var(--rs))/1 Beaufort,serif;letter-spacing:1.5px;color:#c0b9aa}
#menu .tier-picker{font:400 calc(13 * var(--rs)) Spiegel,sans-serif;color:#c0b9aa}
#menu .selected-rank{gap:calc(12 * var(--rs))}
#menu .selected-rank>img{width:35%;padding:calc(5 * var(--rs));max-height:calc(153 * var(--rs));filter:drop-shadow(0 4px 12px #0009)}
#menu .selected-rank h3{font:700 calc(34 * var(--rs))/1.1 Beaufort,serif;color:#efd394;letter-spacing:1px}
#menu .selected-rank p{font:400 calc(15 * var(--rs))/1.4 Spiegel,sans-serif;color:#c2c5c7}
#menu .pass-rules{order:2}
#menu .session-metrics{height:calc(78 * var(--rs));border:0;border-bottom:1px solid #716041;clip-path:none;background:none;box-shadow:none;padding:calc(8 * var(--rs)) 0}
#menu .session-metrics b{font-size:calc(32 * var(--rs));color:#f5e8d0}
#menu .session-metrics em{font-size:calc(18 * var(--rs))}
#menu .session-metrics small{font:500 calc(11 * var(--rs))/1.25 Spiegel,sans-serif;letter-spacing:.6px;color:#bcbfc3}
#menu .arena-picker{order:3;height:calc(76 * var(--rs));padding:5px;gap:calc(15 * var(--rs));border-color:#59616b;clip-path:none;border-radius:4px;background:#030c15}
#menu .arena-picker img{width:calc(112 * var(--rs));border:1px solid #6e5c39;filter:brightness(.85)saturate(.8)}
#menu .arena-picker span{font:500 calc(21 * var(--rs))/1.15 Beaufort,serif;color:#efe5d0}
#menu .arena-picker small{font:500 calc(10 * var(--rs))/1.2 Spiegel,sans-serif;letter-spacing:1px;color:#c0b8a6}
#menu .arena-picker small.arena-note{font:400 calc(12 * var(--rs))/1.4 Spiegel,sans-serif;color:#8f9da8;letter-spacing:0;margin:4px 0 0}
#menu .location-panel #startBtn{order:4;height:calc(64 * var(--rs));padding:0 calc(30 * var(--rs))!important;min-height:46px;font:700 calc(28 * var(--rs))/1 Beaufort,serif!important;color:#171207;border:1px solid #ffe19b;border-radius:5px;background:linear-gradient(120deg,#98702d 0,#ddba61 25%,#ffe5a0 49%,#dcb562 75%,#956a29 100%);box-shadow:inset 0 0 0 3px #ad8241,inset 0 0 0 4px #ffe6ac,inset 0 -8px 20px #81551b26,0 0 22px #e3b64f1f;text-shadow:0 1px #fff0b855;clip-path:polygon(14px 0,calc(100% - 14px) 0,100% 50%,calc(100% - 14px) 100%,14px 100%,0 50%);letter-spacing:.6px}
#menu #startBtn span{color:#241a08;font-size:calc(28 * var(--rs));right:calc(24 * var(--rs))}
#menu #startBtn:hover{filter:brightness(1.12);box-shadow:inset 0 0 0 3px #b58b47,inset 0 0 0 4px #fff0bf,0 0 25px #e5b44d45}
#menu #startBtn:before{background:linear-gradient(110deg,transparent 30%,#fff7d24d 48%,transparent 65%)}
#menu .location-panel #startBtn:disabled{filter:grayscale(.8);opacity:.55;cursor:wait}
#menu .coop-coming{order:5;height:calc(55 * var(--rs));padding:calc(8 * var(--rs)) calc(14 * var(--rs));gap:calc(16 * var(--rs));border-color:#626771;background:linear-gradient(#29333f,#17212c)!important;box-shadow:inset 0 1px #bbc2cb22;border-radius:4px;filter:grayscale(1)}
#menu .coop-coming .coop-icon{width:calc(35 * var(--rs))}
#menu .coop-coming strong{font:700 calc(17 * var(--rs)) Spiegel,sans-serif;color:#9ca3ad}
#menu .coop-coming small{font:400 calc(11 * var(--rs)) Spiegel,sans-serif;color:#8b939e}
#menu .coop-coming>b{font:600 calc(11 * var(--rs)) Spiegel,sans-serif;color:#a3a9b2;padding:calc(5 * var(--rs)) calc(9 * var(--rs))}
#menu .hero-info{inset:0 33% calc(var(--rank-height) + var(--roster-height) + 28 * var(--rs)) 0!important;width:auto;height:auto}
#menu .hero-card{width:44%;padding:0 calc(24 * var(--rs)) calc(22 * var(--rs))!important;display:flex;flex-direction:column;background:linear-gradient(90deg,#010a149e,transparent)!important}
#menu .hero-card h1{order:0;font:700 calc(76 * var(--rs))/1 Beaufort,serif!important;font-style:italic!important;letter-spacing:calc(1.5 * var(--rs));color:#fbefd8;text-shadow:0 4px 10px #000b;margin:0 0 calc(10 * var(--rs))!important}
#menu .hero-card>.eyebrow{order:1;font:400 calc(22 * var(--rs))/1.15 Beaufort,serif!important;font-style:italic!important;text-transform:none;letter-spacing:0!important;margin:0 0 calc(25 * var(--rs));color:#dbdbd9;border-left:3px solid #d8b160;padding-left:calc(13 * var(--rs))}
#menu .hero-card h1,#menu .hero-card>.eyebrow{font-synthesis:style}
#menu .hero-card>.eyebrow{margin:0 0 calc(25 * var(--rs))!important}
#menu .model-status{border-left-color:#d5b36c;color:#e9d39d;background:#06111ce8}
#menu .champion-difficulty{order:2;margin:0 0 calc(18 * var(--rs));width:auto}
#menu .dodge-rating-heading{flex-wrap:wrap;gap:calc(7 * var(--rs)) calc(12 * var(--rs))}
#menu .dodge-rating-heading>span:first-child{flex-basis:100%;font:700 calc(13 * var(--rs))/1.2 Beaufort,serif;letter-spacing:.6px;color:#e2bf74}
#menu .dodge-rating-heading strong{font:600 calc(14 * var(--rs)) Spiegel,sans-serif;color:#dfc48b}
#menu .menu-spells{order:3;gap:calc(15 * var(--rs))!important}
#menu .menu-spells .incoming-icon{width:calc(43 * var(--rs))!important;height:calc(43 * var(--rs))!important;border-color:#c09c53!important;border-radius:2px;box-shadow:0 2px 6px #0008}
#menu .incoming-icon kbd{font-size:calc(12 * var(--rs));height:calc(18 * var(--rs));min-width:calc(18 * var(--rs));background:#050e16;border-color:#b69a5f}
#menu .menu-summoners{order:4;margin-top:calc(18 * var(--rs));gap:calc(23 * var(--rs))}
#menu .menu-summoners img{height:calc(30 * var(--rs));width:calc(30 * var(--rs))}
#menu .menu-summoners b,#menu .menu-summoners kbd{font-size:calc(12 * var(--rs));color:#e9daba}
#menu .champion-panel{inset:auto 33% calc(var(--rank-height) + 18 * var(--rs)) 0!important;height:var(--roster-height)!important;padding:calc(10 * var(--rs)) calc(24 * var(--rs))!important;border:0!important;border-top:1px solid #8e754533!important;background:linear-gradient(0deg,#020d17e8,#020d1745)!important;clip-path:none;box-shadow:none}
#menu #champions{grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:minmax(0,1fr);gap:calc(8 * var(--rs))!important;justify-items:center}
#menu .champion-button{width:100%;max-width:calc(86 * var(--rs));border:1px solid #525a62!important;border-radius:5px;background:linear-gradient(#17212b,#020a10)!important;box-shadow:inset 0 0 0 2px #030d16,0 3px 7px #0007;transition:border-color .15s,box-shadow .15s,filter .15s}
#menu .champion-portrait{border:0;border-radius:4px 4px 0 0;height:calc(100% - 21 * var(--rs));padding:3px;background:#050e17}
#menu .champion-button img{object-fit:contain;filter:brightness(.82)saturate(.78);transition:filter .18s}
#menu .champion-button>span:last-child{line-height:calc(20 * var(--rs));background:#07111b;border-radius:0 0 4px 4px}
#menu .champion-button b{font:700 calc(12 * var(--rs))/1 Beaufort,serif!important;letter-spacing:.4px!important;color:#c8c8c5}
#menu .champion-button.selected{border-color:#ffe09a!important;box-shadow:inset 0 0 0 1px #e7b954,0 0 12px #d2a84b52}
#menu .champion-button.selected .champion-portrait{border:0;box-shadow:none}
#menu .champion-button.selected img,#menu .champion-button:hover img{filter:brightness(1.07)saturate(1.05)}
#menu .champion-button.selected b{color:#ffe6a2}
#menu .champion-button.selected:after{content:'';left:15%;right:15%;bottom:-1px;top:auto;height:2px;background:#ffe09a;box-shadow:0 0 9px #ffc953}
#menu .champion-button:hover{border-color:#d4b16c!important;box-shadow:0 0 12px #bf8f3438}
#menu .lobby-progression{position:absolute;inset:auto 0 0;height:var(--rank-height);padding:calc(10 * var(--rs)) calc(20 * var(--rs));background:linear-gradient(100deg,#020d18f7,#061521ed,#020c15f7);border-top:1px solid #c0a067;border-bottom:1px solid #675943;box-shadow:0 -8px 30px #0003}
#menu .lobby-progression h2{margin:0;font:700 calc(24 * var(--rs))/1.2 Beaufort,serif;color:#e9c67f;letter-spacing:.5px}
#menu .lobby-progression{pointer-events:auto}
#menu .lobby-progression h2 span{font-size:calc(24 * var(--rs));margin-right:calc(10 * var(--rs))}
#menu .lobby-progression .rank-carousel{height:calc(108 * var(--rs));border:0;background:none}
#menu #rankRail{gap:calc(40 * var(--rs));padding:0 calc(50 * var(--rs))}
#menu .tier-option{padding:0 4px calc(8 * var(--rs));background:none;border-bottom:0}
#menu .tier-option img{transform:scale(1.5);max-height:calc(80 * var(--rs));filter:drop-shadow(0 2px 4px #0008)}
#menu .tier-option b{font:500 calc(16 * var(--rs))/1.2 Beaufort,serif;text-transform:none;color:#bdc1c8}
#menu .tier-option.locked img{filter:grayscale(1)brightness(.6);opacity:.65}
#menu .tier-option.selected{background:radial-gradient(ellipse at 50% 40%,#d3a02921,transparent 65%);box-shadow:none}
#menu .tier-option.selected b{color:#ffe5a1}
#menu .tier-option.selected:after{display:none}
#menu .tier-option.current:not(.selected){box-shadow:none}
#menu .tier-check{color:#f8d98b;border-color:#b89650;background:#111a1f}
#menu .tier-check,#menu .tier-lock{right:calc(50% - 40 * var(--rs));bottom:calc(28 * var(--rs));width:calc(17 * var(--rs));height:calc(17 * var(--rs));font-size:calc(12 * var(--rs))}
#menu footer{display:flex!important;left:calc(40 * var(--rs));right:calc(30 * var(--rs));bottom:0;height:calc(35 * var(--rs));font:400 calc(12 * var(--rs)) Spiegel,sans-serif!important;color:#8995a0;gap:16px}
#menu footer>span:first-child{margin-right:auto;color:#c6b890}
#menu footer button{font:500 calc(12 * var(--rs)) Beaufort,serif;color:#c6b890}
#menu button:focus-visible,#modalCard button:focus-visible{outline:2px solid #ffe09a;outline-offset:3px;filter:brightness(1.13)}
/* ARAM keeps its independent controls, score and mastery; no rank ladder. */
body.arena-selected{--rank-height:0px;--roster-height:calc(136 * var(--rs))}
body.arena-selected #menu .lobby-progression{display:none}
@media(min-width:1051px){body.arena-selected #menu .location-panel{height:calc(100% - 40 * var(--rs))!important;align-self:stretch}}
#menu .arena-setup{order:1;flex:1;border:0;border-bottom:1px solid #716041;background:radial-gradient(ellipse at 20% 0,#c3962512,transparent 65%);padding:calc(8 * var(--rs));grid-template-columns:1fr;align-content:space-evenly;gap:calc(16 * var(--rs))}
#menu .arena-heading,#menu .arena-best,#menu .arena-mastery{grid-column:1!important}
@media(min-width:1051px){#menu .arena-setup{grid-template-columns:1.1fr 1fr;gap:calc(12 * var(--rs));align-content:space-between}#menu .arena-heading,#menu .arena-best,#menu .arena-mastery{grid-column:1/3!important}}
#menu .arena-emblem{display:none}
#menu .arena-heading h3{font:700 calc(31 * var(--rs))/1.15 Beaufort,serif;color:#efd291}
#menu .arena-heading small,#menu .arena-setup legend{color:#d3b87d;font:500 calc(12 * var(--rs)) Spiegel,sans-serif}
#menu .arena-heading p{font:400 calc(15 * var(--rs))/1.4 Spiegel,sans-serif;color:#b5bdc7}
#menu .arena-segment button[aria-pressed=true]{border-color:#ecc776;background:linear-gradient(#6f53203d,#2b271e);box-shadow:inset 0 0 0 1px #c9a05a55,0 0 9px #dcb65024}
#menu .arena-segment button:hover{border-color:#d1b16d}
#menu .arena-segment strong{font:700 calc(20 * var(--rs)) Beaufort,serif;color:#eee1c4}
#menu .arena-segment small{font:400 calc(12 * var(--rs)) Spiegel,sans-serif;color:#9ca8b3}
#menu .arena-roster-link{color:#ddc38d;border-color:#80693f}
#menu .arena-best{border-color:#63563f;color:#c9b68d}
#menu .arena-mastery{background:#07121d;border-color:#736141;color:#d1c5ad}
#menu .mastery-track i{background:linear-gradient(90deg,#b68432,#f1d185)}
#menu .arena-mastery:hover{border-color:#dcba72;background:#181d20}
/* Shared finish for existing records, achievements, settings and result dialogs. */
#modalCard{background:radial-gradient(ellipse at 20% 0,#13304744,transparent 65%),#030e18;border-color:#b49761;color:#e7e0d1;box-shadow:0 24px 80px #000a,inset 0 0 0 4px #04111a}
#modalCard h2,#modalCard h3{color:#efd08c;font-family:Beaufort,serif;letter-spacing:.5px}
#modalCard p,#modalCard label{font-family:Spiegel,sans-serif;color:#bac4ce}
#modalCard button{border-color:#8b754d;color:#e4d4ae;background:linear-gradient(#15202a,#07111b);border-radius:3px}
#modalCard button:hover{border-color:#e6c16f;background:#252820;color:#fff0c5}
#modalCard button.primary{color:#1e1708;background:linear-gradient(110deg,#b28a3e,#f8dc91,#bd974f);border-color:#f5d38d;text-shadow:none}
#modalCard input,#modalCard select{accent-color:#d6b167;border-color:#746044;background:#06111c;color:#e7dcc5}
#modalCard .tier-option.selected{background:radial-gradient(ellipse at bottom,#b18a2736,transparent 80%);border-color:#d9b66c;color:#f9df9c}
#modalCard .tier-option.selected:after{background:#ebc575;box-shadow:0 0 8px #bf922c}
#modalCard .journal-summary,#modalCard .training-record,#modalCard .played-champion,#modalCard .training-overview{background:#091722;border-color:#4c4d44}
#modalCard .record-number strong,#modalCard .training-stat strong{color:#eacb8e}
#modalCard .dialog-scroll:focus-visible{outline-color:#d4b26b}
.boot-mark img{object-fit:contain;filter:drop-shadow(0 0 22px #bf943c38)}
#boot .loading-track i{background:linear-gradient(90deg,#9d722b,#f0d18b)}
@media(max-width:1050px){
 :root{--rs:.8px;--nav-h:64px;--rank-height:145px;--roster-height:170px}
 #menu{overflow-y:auto;background:linear-gradient(90deg,#020c1766,transparent 70%),linear-gradient(0deg,#020c17,transparent 80%)}
 #menu header{position:sticky;top:0;height:64px;flex-shrink:0;padding:0 170px 0 18px;gap:15px}
 #menu header>.brand{font-size:24px;width:auto;gap:12px}#menu header .brand img{width:55px;height:40px}
 #menu .home-rail{top:64px;height:46px;border-bottom-color:#9c8051;background:#020d18f5}
 #menu .home-rail button span,#menu .home-rail button[data-shell=achievements] span{font-size:12px}#menu .home-rail button svg{width:17px;height:17px}
 #menu .profile-summary{right:12px;width:165px;height:64px}#menu .profile-medallion{transform:scale(.32)}
 #menu #displayName,#menu #profileNameInput{left:68px;top:15px;width:94px;height:22px;font-size:14px!important}#menu #earnedRankName{left:68px;top:39px;font-size:10px}
 #menu .menu-grid{position:relative!important;inset:auto!important;display:flex!important;flex:0 0 auto!important;height:auto!important;margin:54px 16px 20px!important;gap:16px!important}
 #menu .menu-grid>section{flex-shrink:0!important}
 #menu .hero-info{position:relative;inset:auto!important;width:100%;height:470px;order:0}
 #menu .hero-card{width:44%;padding:0 12px 24px!important}#menu .hero-card h1{font-size:58px!important}#menu .hero-card>.eyebrow{font-size:19px!important}
 #menu .champion-panel{position:relative!important;inset:auto!important;width:100%;height:170px!important;order:1;padding:8px 12px!important}
 #menu #champions{grid-template-columns:repeat(6,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}
 #menu .champion-button{width:86px}#menu .champion-button b{font-size:11px!important}
 #menu .location-panel{position:relative!important;inset:auto!important;width:100%!important;height:auto!important;min-height:650px!important;order:2;padding:20px!important;gap:16px!important}
 #menu .training-heading{height:56px}#menu .training-kind.mode-switch button{font-size:17px}
 #menu .rank-showcase{min-height:170px;max-height:210px}#menu .selected-rank h3{font-size:34px}#menu .selected-rank p{font-size:17px}
 #menu .session-metrics{height:76px}#menu .session-metrics b{font-size:34px}#menu .session-metrics small{font-size:11px}
 #menu .arena-picker{height:78px}#menu .arena-picker span{font-size:22px}#menu .arena-picker img{width:120px}
 #menu .location-panel #startBtn{height:58px;font-size:24px!important}#menu .coop-coming{height:60px}
 #menu .lobby-progression{position:relative;inset:auto;height:165px;order:3;padding:14px 8px}#menu .lobby-progression h2{font-size:21px}#menu .lobby-progression .rank-carousel{height:110px}#menu #rankRail{gap:10px;padding:0 8px}#menu .tier-option b{font-size:13px}
 #menu footer{position:relative;inset:auto;height:42px;flex-shrink:0;margin:0 20px;font-size:10px!important}
 #menu .arena-setup{min-height:400px;gap:20px;padding:12px}#menu .arena-heading h3{font-size:28px}#menu .arena-heading p{font-size:14px}#menu .arena-setup legend{font-size:12px}
}
@media(max-width:580px){
 #menu header{padding-left:12px;padding-right:140px}#menu header>.brand{font-size:18px;gap:6px}#menu header .brand img{width:40px}
 #menu .profile-summary{right:4px;width:134px}#menu .profile-medallion{transform:scale(.26);top:5px}#menu #displayName,#menu #profileNameInput{left:55px;width:78px;font-size:12px!important}#menu #earnedRankName{left:55px}
 #menu .home-rail button{gap:5px;padding:0 4px}#menu .home-rail button svg{display:none}#menu .home-rail button span,#menu .home-rail button[data-shell=achievements] span{font-size:11px}
 #menu .hero-info{height:370px}#menu .hero-card{width:48%}#menu .hero-card h1{font-size:40px!important}#menu .hero-card>.eyebrow{font-size:15px!important;margin-bottom:16px}
 #menu .dodge-rating-heading>span:first-child{font-size:10px}#menu .menu-spells{gap:9px!important}#menu .menu-spells .incoming-icon{height:28px!important;width:28px!important}#menu .menu-summoners{gap:12px}#menu .menu-summoners b{font-size:9px}
 #menu .champion-panel{height:255px!important}#menu #champions{grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:9px!important}#menu .champion-button{width:74px}
 #menu .location-panel{padding:14px!important;min-height:610px!important}#menu .selected-rank h3{font-size:28px}#menu .selected-rank p{font-size:14px}#menu .session-metrics small{font-size:10px}
 #menu .lobby-progression{height:150px}#menu .lobby-progression h2{font-size:18px}#menu #rankRail{gap:3px;padding:0}#menu .tier-option b{font-size:11px}#menu .rank-carousel>button{flex-basis:18px}
 #menu footer{flex-wrap:wrap;height:auto;padding-bottom:14px;gap:8px}#menu footer>span:first-child{width:100%}
}
@media(prefers-reduced-motion:reduce){#menu *{transition:none!important;animation:none!important}}