/* Reference-matched League client chrome. The WebGL scene stays live beneath it. */
@font-face{font-family:Beaufort;src:url('assets/fonts/beaufortforlol-regular.otf') format('opentype');font-weight:400;font-display:swap}
@font-face{font-family:Beaufort;src:url('assets/fonts/beaufortforlol-medium.otf') format('opentype');font-weight:500;font-display:swap}
@font-face{font-family:Spiegel;src:url('assets/fonts/spiegel-semibold.otf') format('opentype');font-weight:600;font-display:swap}
:root{--u:min(calc(100vw / 1672),calc(100vh / 941));--rail:calc(110 * var(--u));--right:calc(563 * var(--u));--gold:#c8aa6e;--shell-line:#52677677;--paper:#f0e6d2}
#menu,#modalCard{font-family:Beaufort,serif;font-synthesis:none;color:var(--paper);-webkit-font-smoothing:antialiased;user-select:none}
#modalCard input{user-select:text}
#menu button,#menu select,#modalCard button{font-family:Beaufort,serif;font-synthesis:none}
#menu{padding:0;background:linear-gradient(90deg,#00101a40,transparent 43%,#00101a18),linear-gradient(0deg,#00101ad9,transparent 30%)}
#menu header{height:calc(68 * var(--u));left:0;padding:0 calc(30 * var(--u)) 0 calc(145 * var(--u));gap:20px;background:linear-gradient(90deg,#00101ae0,#00101a33 55%,#00101af0);border-bottom:1px solid #b28c4780}
#menu header .brand{font:700 calc(36 * var(--u))/1 Beaufort,serif;letter-spacing:calc(3 * var(--u));color:#f4d38d;text-shadow:0 2px 3px #000}
#menu header .brand img{display:block;position:absolute;left:calc(25 * var(--u));top:calc(10 * var(--u));width:calc(54 * var(--u));height:calc(58 * var(--u))}
#menu .profile-summary{margin-left:auto}
#menu #rankProfile{display:flex;align-items:center;gap:calc(18 * var(--u));padding:0;background:none;border:0;text-transform:none;box-shadow:none}
#menu #profileAvatar{width:calc(54 * var(--u));height:calc(54 * var(--u));object-fit:cover;border-radius:50%;border:2px solid #c8aa6e}
#menu #displayName{font:500 calc(20 * var(--u)) Beaufort,serif!important;color:#f0e7d9;max-width:180px;overflow:hidden;text-overflow:ellipsis}
#menu .rank-crest{display:flex;align-items:center;gap:calc(16 * var(--u));border-left:1px solid #ae8d4140;padding-left:calc(18 * var(--u))}
#menu #earnedBadge{width:calc(55 * var(--u));height:calc(57 * var(--u));object-fit:contain;padding:0}
#menu #earnedBadge[hidden]{display:none}
#menu #earnedRankName{font:500 calc(17 * var(--u)) Beaufort,serif;color:#f0d482;text-transform:uppercase;letter-spacing:1px}
.profile-chevron{color:#eee9dc}
#menu .home-rail{top:calc(68 * var(--u));width:var(--rail);padding:calc(44 * var(--u)) 0 0;gap:0;background:#00101aeb;border-right:1px solid #b18d4a77;z-index:2}
#menu .home-rail button{min-height:calc(107 * var(--u));padding:calc(20 * var(--u)) 0;gap:calc(12 * var(--u));display:flex;flex-direction:column;align-items:center;justify-content:center;color:#aabbd1;border:1px solid transparent;border-left:3px solid transparent;background:none}
#menu .home-rail button svg{width:calc(29 * var(--u));height:calc(29 * var(--u));stroke:currentColor;fill:none;stroke-width:1.8;stroke-linejoin:round;stroke-linecap:round}
#menu .home-rail button span{font:500 calc(14 * var(--u)) Beaufort,serif;letter-spacing:.06em;text-transform:uppercase}
#menu .home-rail button[data-shell=achievements] span{font-size:calc(11 * var(--u))}
#menu .home-rail button.active{color:#ffe6a0;border-color:#b18d4a44;border-left-color:#d7b36b;background:linear-gradient(90deg,#ac854138,#09151b80)}
#menu .home-rail button:hover{color:#f4dea7;background:#b18d4a17}
#menu .menu-grid{inset:calc(78 * var(--u)) calc(20 * var(--u)) calc(46 * var(--u)) var(--rail)!important;display:block!important;padding:0!important}
#menu .hero-info{inset:0 calc(var(--right) + 16 * var(--u)) calc(145 * var(--u)) 0;align-items:flex-end!important}
#menu .hero-card{max-width:none;width:100%;padding:calc(25 * var(--u)) calc(36 * var(--u)) calc(30 * var(--u))!important;background:none!important;border:0!important;pointer-events:none}
#menu .hero-card>.eyebrow{font:400 calc(18 * var(--u)) Beaufort,serif!important;letter-spacing:.12em!important;color:#fff8ec;text-shadow:0 2px 4px #000;margin:0!important}
#menu .hero-card h1{font:700 calc(84 * var(--u))/1.06 Beaufort,serif!important;letter-spacing:calc(3 * var(--u));margin:calc(4 * var(--u)) 0 calc(14 * var(--u))!important;background:linear-gradient(#ffffe6 12%,#eedfa9 48%,#e9ac4e 100%);color:transparent;background-clip:text;filter:drop-shadow(0 2px 2px #0009);text-shadow:none}
#menu .menu-spells{gap:calc(20 * var(--u))!important;margin:0!important;flex-wrap:nowrap!important;justify-content:flex-start!important}
#menu .menu-spells .incoming-icon{width:calc(66 * var(--u))!important;height:calc(66 * var(--u))!important;border:1px solid #e8c46f;opacity:1;filter:none;box-shadow:0 0 0 2px #00101c}
#menu .menu-spells .incoming-icon img{filter:none;opacity:1}
#menu .incoming-icon kbd{bottom:calc(-10 * var(--u));right:calc(-3 * var(--u));font:500 calc(20 * var(--u)) Beaufort,serif;min-width:calc(30 * var(--u));height:calc(28 * var(--u));display:grid;place-items:center;background:#010b12;border:1px solid #d8b35d;color:#ffecaa}
#menu .kit-description{display:none}
#menu .menu-summoners{display:flex;gap:calc(30 * var(--u));margin-top:calc(25 * var(--u));align-items:center}
.menu-summoners>span{display:flex;gap:calc(12 * var(--u));align-items:center}
.menu-summoners img{width:calc(46 * var(--u));height:calc(46 * var(--u));border:1px solid #d9b65f}
.menu-summoners kbd{padding:3px 6px;border:1px solid #b79954;color:#e7cf8b;font:500 calc(17 * var(--u)) Beaufort,serif;background:#001019}
.menu-summoners b{font:500 calc(15 * var(--u)) Beaufort,serif;letter-spacing:.04em;text-transform:uppercase}
#menu .model-status{top:16px;left:36px;transform:none;background:#00101add;border-left:2px solid #00c5e9;padding:10px 14px;font:14px Spiegel,sans-serif!important;letter-spacing:0;color:#bdebf3}
#menu .model-status[hidden]{display:none!important}
#menu .champion-panel{right:calc(var(--right) + 16 * var(--u));height:calc(150 * var(--u))!important;bottom:0;padding:calc(12 * var(--u))!important;border:1px solid #b1965866!important;background:linear-gradient(100deg,#00101aec,#051d23d9)!important;box-shadow:none!important;clip-path:polygon(12px 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%,0 12px)}
#menu #champions{height:100%!important;gap:calc(14 * var(--u))!important;padding:0 0 4px!important;scrollbar-width:thin;scrollbar-color:#b9a36855 transparent}
#menu .champion-button{flex:0 0 calc(102 * var(--u))!important;min-width:calc(102 * var(--u))!important;padding:3px!important;gap:calc(9 * var(--u))!important;background:none!important;box-shadow:none!important}
#menu .champion-button img{width:calc(92 * var(--u))!important;height:calc(92 * var(--u))!important;border:1px solid #b0b6b1;box-shadow:0 0 0 3px #020d16;filter:none}
#menu .champion-button b{font:500 calc(15 * var(--u))/1 Beaufort,serif!important;letter-spacing:.03em!important;color:#f3efe2}
#menu .champion-button.selected img{border:2px solid #94f2ff;box-shadow:0 0 0 2px #074860,0 0 12px #13cfffaa}
#menu .champion-button.selected b{color:#00efff}
#menu .champion-button:hover img{border-color:#fff0b9}
/* The frame is UI geometry, never replacement art for the scene or rank emblems. */
#menu .location-panel,#modalCard{border:2px solid #cda450!important;background:linear-gradient(135deg,#00121cf5,#000d17fa)!important;box-shadow:inset 0 0 50px #00232d55,0 8px 40px #0007!important;border-radius:calc(18 * var(--u)) 0 calc(18 * var(--u)) 0}
#menu .location-panel:before,#modalCard:before{content:'';position:absolute;inset:4px;border:1px solid #ad8743;border-radius:12px 0 12px 0;pointer-events:none}
#menu .location-panel:after,#modalCard:after{content:'◆';font:14px Beaufort,serif;line-height:1;color:#f8d16d;background:#00101a;position:absolute;top:-9px;left:50%;transform:translateX(-50%);padding:0 5px;text-shadow:0 0 4px #b07c31}
#menu .location-panel{width:var(--right)!important;padding:calc(30 * var(--u))!important;gap:0!important;overflow:visible!important}
#menu .location-panel>.eyebrow{display:none}
#menu .location-panel h2{font:700 calc(38 * var(--u))/1.2 Beaufort,serif!important;letter-spacing:.04em!important;margin:0 0 calc(22 * var(--u))!important;color:#f5d38e;white-space:nowrap}
#menu .training-kind{display:grid;grid-template-columns:1fr 1fr;padding:3px;gap:4px;border:1px solid #34556b;border-radius:4px;margin:0 0 calc(20 * var(--u))}
#menu .training-kind button{font:500 calc(18 * var(--u)) Beaufort,serif;letter-spacing:.06em;text-transform:uppercase;min-height:calc(46 * var(--u));border:1px solid #375369!important;color:#e6e2ee;background:#00111e;box-shadow:none}
#menu .training-kind button.selected,#menu .location.selected{color:#fff!important;border-color:#00d7f2!important;box-shadow:inset 0 0 12px #008bd899,0 0 5px #00b7db55!important;background:linear-gradient(#003a6d,#002552 55%,#00366b)!important}
#menu .section-label{display:block;font:400 calc(18 * var(--u)) Beaufort,serif;letter-spacing:.15em;color:#eee7df;margin:0 0 calc(7 * var(--u))}
#menu #locations{display:grid!important;grid-template-columns:1.08fr 1fr 1fr;gap:calc(7 * var(--u));}
#menu .location-panel .location{display:flex;align-items:center;gap:calc(15 * var(--u));min-height:calc(55 * var(--u))!important;padding:calc(9 * var(--u))!important;background:#01111d;border:1px solid #53677c;border-radius:3px;justify-content:center;box-shadow:none}
#menu .location-panel .location b{font:500 calc(18 * var(--u)) Beaufort,serif!important;text-transform:none;white-space:nowrap}
#menu .location .zone-symbol{display:grid;place-items:center;font:400 calc(32 * var(--u)) Beaufort,serif;color:#d9e0ee}
#menu .location.selected .zone-symbol{color:#ffe17a}
#menu .tier-picker{min-height:calc(68 * var(--u));padding:0 calc(28 * var(--u));gap:12px;margin:0 0 calc(28 * var(--u));background:#00101c;border:1px solid #7b7565;border-left-color:#d3ac58;border-radius:3px}
#menu .tier-picker strong{font:700 calc(38 * var(--u)) Beaufort,serif;letter-spacing:.02em;text-transform:uppercase;color:#efca7e}
#menu .tier-picker .tier-rank{margin-left:auto;width:calc(68 * var(--u));height:calc(64 * var(--u));object-fit:contain}
#menu .tier-picker>b{font:500 calc(24 * var(--u)) Beaufort,serif;margin-left:auto;color:#ede8df}
#menu .tier-picker .tier-rank+b{margin-left:4px}
#menu .pass-rules{display:block;margin:0 0 calc(42 * var(--u))}
.session-metrics{display:grid;grid-template-columns:1fr 1fr 1fr;border:1px solid #536273;border-radius:3px;padding:calc(14 * var(--u)) 0;background:#00101c}
.session-metrics>span{display:grid;text-align:center;gap:1px;position:relative}
.session-metrics>span+span{border-left:1px solid #1b3544}
#menu .session-metrics b{font:700 calc(46 * var(--u))/1.05 Beaufort,serif;color:#f5f0df;font-variant-numeric:tabular-nums}
#menu .session-metrics em{font:500 calc(27 * var(--u)) Beaufort,serif;font-style:normal;margin-left:1px}
#menu .session-metrics small{font:500 calc(16 * var(--u)) Beaufort,serif;letter-spacing:.025em;text-transform:uppercase;color:#e5e0dc}
#menu .arena-picker{min-height:calc(86 * var(--u));margin:0 0 calc(38 * var(--u));gap:calc(20 * var(--u));background:#00111d;border:1px solid #576779;border-radius:3px}
#menu .arena-picker img{width:calc(162 * var(--u));height:calc(83 * var(--u));object-fit:cover;object-position:50% 55%}
#menu .arena-picker span{font:500 calc(24 * var(--u)) Beaufort,serif;color:#f3f0e9}
#menu .arena-picker small{font:400 calc(14 * var(--u)) Beaufort,serif;letter-spacing:.1em;display:block;margin-bottom:2px}
#menu .arena-picker>b{font:500 calc(24 * var(--u)) Beaufort,serif;margin-left:auto;margin-right:calc(20 * var(--u));color:#eee8df}
#menu .location-panel #startBtn,#modalCard .dialog-actions .primary{position:relative;min-height:calc(78 * var(--u));font:700 calc(38 * var(--u)) Beaufort,serif;letter-spacing:.035em;background:linear-gradient(#004c86,#002855 52%,#003d6e);color:#f8d995;border:2px solid #f6d373;box-shadow:inset 0 0 0 3px #00101b,inset 0 0 0 4px #1ad3ed;clip-path:polygon(16px 0,calc(100% - 16px) 0,100% 16px,100% calc(100% - 16px),calc(100% - 16px) 100%,16px 100%,0 calc(100% - 16px),0 16px);text-shadow:0 2px 4px #000}
#menu .location-panel #startBtn{margin-top:auto!important;margin-bottom:calc(42 * var(--u));display:flex;align-items:center;justify-content:center;gap:calc(40 * var(--u));padding:12px}
#menu #startBtn span{position:absolute;right:calc(30 * var(--u))}
#menu .location-panel #startBtn:hover,#modalCard .dialog-actions .primary:hover{filter:brightness(1.2)}
#menu .build-status{position:absolute;top:calc(33 * var(--u));right:calc(29 * var(--u));padding:0;border:1px solid #334b63;border-radius:3px;width:calc(116 * var(--u));height:calc(39 * var(--u));display:grid;place-items:center;background:#001322}
#menu .build-status span{font:400 calc(12 * var(--u)) Beaufort,serif;color:#d2d4e6;pointer-events:none}
#menu #saveMode{position:absolute;inset:0;opacity:0;width:100%;cursor:pointer}
#menu footer{left:var(--rail);right:calc(25 * var(--u));height:calc(30 * var(--u));font:400 calc(10 * var(--u)) Spiegel,sans-serif!important;letter-spacing:.05em!important;opacity:.65;border-top:1px solid #ad874366;color:#b4bec1}
/* Results keep the same League frame and type hierarchy as the supplied reference. */
#modal{padding:24px;background:#00091088;backdrop-filter:none}
#modalCard{position:relative;width:min(1040px,92vw);max-height:90vh;padding:35px 42px;color:#ede5d5;overflow:auto}
#modalCard h2{font:700 35px/1.2 Beaufort,serif;letter-spacing:.04em;color:#f1ce8c;margin:0 25px 24px 0}
#modalCard h3{font-family:Beaufort,serif;color:#dfc18b}
#modalCard p{font:400 15px/1.6 Spiegel,sans-serif}
#modalCard .close-modal{position:absolute;right:22px;top:16px;color:#bf9552;background:none;border:0;font:400 30px Beaufort,serif;padding:0;width:32px;height:32px}
#modalCard .dialog-actions{display:flex;gap:24px;margin-top:22px}
#modalCard .dialog-actions button{padding:12px 24px;font:500 18px Beaufort,serif;color:#eee6ce;background:#02131e;border:1px solid #8a6737;letter-spacing:.04em}
#modalCard.dialog-result{width:calc(906 * var(--u));padding:calc(36 * var(--u)) calc(42 * var(--u)) calc(16 * var(--u));max-width:94vw;max-height:94vh;overflow:visible}
#modalCard.dialog-result h2{font:700 calc(48 * var(--u))/1.2 Beaufort,serif;letter-spacing:.055em;text-align:center;margin:0 0 calc(7 * var(--u));color:#f2cd85}
#modalCard .result-subtitle{font:400 calc(19 * var(--u)) Beaufort,serif;letter-spacing:.18em;text-align:center;margin:0 0 calc(18 * var(--u));color:#d9d1cd}
.result-subtitle i{font-style:normal;padding:0 12px;color:#8196a2}
.result-reason{display:flex;align-items:center;justify-content:center;gap:calc(18 * var(--u));font:400 calc(23 * var(--u)) Beaufort,serif;padding:calc(14 * var(--u));margin-bottom:calc(14 * var(--u));border-block:1px solid #98713970;background:linear-gradient(90deg,transparent,#65401a55,transparent);color:#f3cf74}
.result-reason>span{font-size:calc(30 * var(--u));color:#e6b046}.result-reason.passed{color:#9bdcc9;background:linear-gradient(90deg,transparent,#136b6a44,transparent)}
.result-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:calc(15 * var(--u));margin-bottom:calc(13 * var(--u))}
.result-metrics>div{display:grid;grid-template-columns:calc(76 * var(--u)) 1fr;text-align:center;align-items:center;border:1px solid #3e5867;border-radius:3px;background:#03162080;padding:calc(12 * var(--u)) calc(12 * var(--u))}
.metric-symbol{grid-row:1/3;color:#45738e;font:500 calc(46 * var(--u)) Beaufort,serif}
.result-metrics b{font:700 calc(40 * var(--u))/1.2 Beaufort,serif;color:#f7dfaf}
.result-metrics small{font:400 calc(15 * var(--u)) Beaufort,serif;letter-spacing:.13em;text-transform:uppercase;color:#8bafc2;white-space:nowrap}
.result-tip{display:flex;align-items:center;gap:calc(24 * var(--u));padding:calc(9 * var(--u)) calc(25 * var(--u));border:1px solid #85724f80;border-radius:3px;background:#20241b28;font:400 calc(20 * var(--u)) Beaufort,serif;color:#ded5c9}
.result-tip>span{font-size:calc(30 * var(--u));color:#eeb940;line-height:1.1}
#modalCard.dialog-result .dialog-actions{display:grid;grid-template-columns:1fr 1fr;gap:calc(28 * var(--u));margin-top:calc(26 * var(--u))}
#modalCard.dialog-result .dialog-actions .primary{font-size:calc(32 * var(--u));min-height:calc(70 * var(--u));color:#fff7d9}
#modalCard.dialog-result .dialog-actions button:not(.primary){font:500 calc(21 * var(--u)) Beaufort,serif;background:#01111b;min-height:calc(66 * var(--u));border-radius:3px}
.result-earned{text-align:center;margin-top:calc(20 * var(--u));position:relative}
.result-earned:before,.result-earned:after{content:'';position:absolute;top:54%;height:1px;width:35%;background:linear-gradient(90deg,transparent,#c09b50)}
.result-earned:before{left:0}.result-earned:after{right:0;transform:rotate(180deg)}
.result-earned>small{font:400 calc(13 * var(--u)) Beaufort,serif;letter-spacing:.16em;color:#a5b5c5}
#resultRank{display:flex;align-items:center;justify-content:center;gap:calc(18 * var(--u));min-height:calc(58 * var(--u))}
#resultRank img{width:calc(65 * var(--u));height:calc(58 * var(--u));object-fit:contain}
#resultRank strong{font:500 calc(29 * var(--u)) Beaufort,serif;letter-spacing:.12em;text-transform:uppercase;color:#edca86}
.result-extra{display:flex;align-items:center;justify-content:space-between;font:400 calc(11 * var(--u)) Spiegel,sans-serif;color:#6c8797;margin-top:6px}
.result-extra button{border:0;background:none;color:#9baeb7;font:400 calc(11 * var(--u)) Spiegel,sans-serif;padding:3px}
#modalCard .tier-grid{gap:12px}#modalCard .tier-grid button{font-family:Beaufort,serif}#modalCard .tier-grid img{object-fit:contain}.beginner-text{display:grid;place-items:center;height:70px;font:500 16px Beaufort,serif;color:#e2c48a}
@media(max-width:1100px) and (min-width:721px){:root{--u:min(calc(100vw / 1480),calc(100vh / 850));--right:calc(525 * var(--u))}#menu .location-panel h2{font-size:calc(34 * var(--u))!important}#menu .build-status{width:calc(105 * var(--u))}#menu .hero-card{padding-left:calc(25 * var(--u))!important}#menu .hero-card h1{font-size:calc(74 * var(--u))!important}}
@media(max-width:720px){:root{--u:0.75px;--rail:0px}#menu{overflow:auto}#menu header{height:62px;padding-left:66px;padding-right:10px}#menu header .brand{font-size:20px}#menu header .brand img{left:12px;width:36px;top:10px;height:42px}#menu #profileAvatar{display:none}#menu #displayName{font-size:15px!important}#menu .rank-crest{gap:5px;padding-left:7px}#menu #earnedBadge{width:30px;height:34px}#menu #earnedRankName{font-size:12px}#menu .home-rail{display:flex;position:absolute;top:62px;width:100%;bottom:auto;flex-direction:row;padding:0;background:#00101aee;z-index:3}#menu .home-rail button{min-height:52px;padding:8px;gap:4px}#menu .home-rail button svg{width:17px;height:17px}#menu .home-rail button span{font-size:10px}#menu .menu-grid{position:relative!important;inset:auto!important;margin:120px 12px 30px!important;padding-top:370px!important}#menu .hero-info{inset:0 0 auto;height:245px}#menu .hero-card{padding:20px 10px!important}#menu .champion-panel{top:250px;right:0;height:110px!important}#menu .location-panel{position:relative;inset:auto;width:100%!important;min-height:625px;padding:24px!important}#menu .location-panel h2{font-size:28px!important}#menu .location-panel .build-status{top:27px;right:22px}#menu footer{position:relative;margin:15px;height:24px}#modal{padding:12px}#modalCard,#modalCard.dialog-result{width:100%;padding:24px 18px;max-height:92vh;overflow:auto}#modalCard.dialog-result h2{font-size:26px}.result-subtitle{letter-spacing:.03em!important}.result-metrics{gap:6px}.result-metrics>div{grid-template-columns:1fr;padding:10px 2px}.metric-symbol{display:none}.result-metrics small{font-size:10px}.result-tip{font-size:14px;padding:10px}.result-earned:before,.result-earned:after{width:26%}#modalCard.dialog-result .dialog-actions{gap:10px}#modalCard.dialog-result .dialog-actions button{font-size:16px!important}}
@media(prefers-reduced-motion:reduce){#menu *,#modalCard *{transition:none;animation:none;scroll-behavior:auto}}

/* Existing gameplay alerts retain their independent layout. */
.objective-alert{width:330px;display:grid;grid-template-columns:44px 1fr auto;gap:10px 12px;align-items:center;padding:12px 15px;background:linear-gradient(110deg,#061923f5,#091a23e8)!important;border:1px solid #c8aa6e66;border-top:2px solid #c8aa6e;box-shadow:0 6px 22px #0005;text-align:left;text-shadow:none;color:#f0e6cc}
.objective-symbol{width:44px;height:44px;display:grid;place-items:center;border-right:1px solid #c8aa6e44;padding-right:10px}.objective-symbol svg{width:34px;height:34px;fill:none;stroke:#c8aa6e;stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}
.objective-copy>span{font:500 19px Beaufort,serif;display:block;color:#f0e6cc}.objective-copy strong{font:600 10px Spiegel,sans-serif;letter-spacing:.09em;color:#72cad2;line-height:1.5;margin-top:3px}.objective-copy small{font:12px Spiegel,sans-serif;color:#a5b9c2;margin-top:2px;white-space:nowrap}
#objectiveClock{font:600 24px Spiegel,sans-serif;color:#efe4cc}#objectiveMove{grid-column:1/-1;pointer-events:auto;text-align:left;font:600 11px Spiegel,sans-serif;letter-spacing:.06em;padding:8px 10px;background:#12323b;border:1px solid #62a2ab77;color:#c7eef0;cursor:pointer}#objectiveMove span{float:right}#objectiveMove:hover{background:#1d4650;border-color:#85d2da}#objectiveMove[hidden]{display:none}.objective-alert.urgent{border-color:#df805f}
#crowdControl{position:absolute;z-index:12;transform:translate(-50%,-100%);padding:5px 12px;border:1px solid #c29bfa88;border-radius:3px;background:#211335dd;color:#edddff;font:600 13px Spiegel,sans-serif;letter-spacing:.04em;white-space:nowrap;pointer-events:none;text-shadow:0 1px 3px #000}
#crowdControl[data-kind=stun]{background:#132b40e8;border-color:#93dfff88;color:#d8f6ff}
/* WoW influence is limited to the achievement journal's category rail and progress rows. */
#modalCard.dialog-achievements{width:min(1140px,95vw);padding:30px 35px;max-height:91vh}
#modalCard.dialog-achievements h2{margin-bottom:5px}.achievement-intro{margin:0 0 22px;color:#9eb3c4}
.achievement-layout{display:grid;grid-template-columns:210px 1fr;gap:26px}.achievement-sidebar{border-right:1px solid #9b804747;padding-right:20px}.achievement-summary{text-align:center;padding:18px 4px 22px;border-bottom:1px solid #a78a4944;margin-bottom:16px}.achievement-summary small{display:block;font:11px Beaufort,serif;letter-spacing:.12em;color:#bda875}.achievement-summary strong{display:block;font:500 40px Beaufort,serif;color:#e2c991;margin:8px 0}.achievement-summary span{font:12px Spiegel,sans-serif;color:#7995a7}.achievement-sidebar button{display:block;width:100%;text-align:left;padding:13px 12px;background:none;border:1px solid transparent;color:#a5bdcc;font:500 16px Beaufort,serif!important;margin-bottom:3px}.achievement-sidebar button.selected{color:#f5dfab;border-color:#846b4066!important;background:linear-gradient(90deg,#9a763b35,transparent);box-shadow:none!important}.achievement-sidebar p{font:12px/1.6 Spiegel,sans-serif!important;color:#718c9d;margin-top:25px}.achievement-toolbar{display:flex;gap:12px}.achievement-toolbar input{flex:1;min-width:100px;background:#000d17;border:1px solid #596a6d;padding:10px 13px;color:#e3e4dc;font:14px Spiegel,sans-serif}.achievement-toolbar select{background:#00151f;border:1px solid #596a6d;color:#cbced1;font:13px Spiegel,sans-serif;padding:8px}#modalCard .achievement-context{font:12px/1.5 Spiegel,sans-serif;color:#8ca6b5;margin:12px 0}#achievementCount{font:11px Spiegel,sans-serif;color:#b5a578}#achievementList{max-height:52vh;overflow:auto;padding:10px 10px 5px 0;scrollbar-width:thin;scrollbar-color:#7d713e #071923}.achievement-card{display:flex;gap:17px;padding:19px 17px;margin-bottom:12px;background:linear-gradient(115deg,#10273290,#02131b);border:1px solid #56677575;border-left:2px solid #a68a52;border-radius:3px}.achievement-card.earned{border-color:#c9aa62}.achievement-token{width:90px;height:90px;object-fit:contain;align-self:center}.achievement-catalogue-mark{width:44px;align-self:center;text-align:center;font-size:32px;color:#527b93}.achievement-copy{flex:1;min-width:0}.achievement-copy>small{font:10px Spiegel,sans-serif;letter-spacing:.09em;color:#7aa3b9;text-transform:uppercase}#modalCard .achievement-card h3{font:500 24px Beaufort,serif;color:#eedab0;margin:5px 0}#modalCard .achievement-card p{font:13px/1.5 Spiegel,sans-serif;color:#b3c3cc;margin:7px 0 13px}.achievement-progress{height:20px;position:relative;background:#06121a;border:1px solid #837040;box-shadow:inset 0 1px 5px #000;overflow:hidden}.achievement-progress i{display:block;height:100%;background:linear-gradient(#298fab,#174860);box-shadow:inset 0 1px 1px #76d4df}.achievement-progress>span{position:absolute;inset:0;text-align:center;font:11px/18px Spiegel,sans-serif;color:#dde5e1;text-shadow:0 1px 2px #000}.achievement-reward{display:flex;justify-content:space-between;font:11px Spiegel,sans-serif;color:#ac9c73;margin-top:8px}.league-thresholds{display:flex;gap:12px;flex-wrap:wrap}.league-thresholds>span{font:9px Spiegel,sans-serif;color:#8fa6b5}.league-thresholds b{display:block;font:500 15px Beaufort,serif;color:#cebd98;margin-top:4px}#modalCard .league-only{font:11px Spiegel,sans-serif;color:#978b78;margin:0 0 14px}.achievement-empty{padding:30px;text-align:center}
@media(max-width:720px){#modalCard.dialog-achievements{padding:24px 16px}.achievement-layout{grid-template-columns:1fr;gap:12px}.achievement-sidebar{border:0;padding:0;display:flex;overflow:auto;gap:5px}.achievement-sidebar .achievement-summary,.achievement-sidebar p{display:none}.achievement-sidebar button{width:auto;white-space:nowrap;padding:8px;font-size:13px!important}.achievement-toolbar{gap:5px}.achievement-toolbar select{max-width:120px}.achievement-token{width:56px;height:56px}.achievement-card{padding:12px;gap:12px}#modalCard .achievement-card h3{font-size:20px}#achievementList{max-height:48vh}}
/* Measured corrections at the 1672 × 941 reference viewport. */
#menu header .brand span{font:inherit;letter-spacing:inherit}
#menu .location-panel .location{height:calc(55 * var(--u))!important;min-height:calc(55 * var(--u))!important;margin:0!important}
#menu .location .zone-symbol{height:calc(32 * var(--u));width:calc(32 * var(--u));flex-shrink:0;line-height:1}
#menu .location .zone-symbol svg{width:100%;height:100%;stroke:currentColor;stroke-width:1.5;fill:none;stroke-linecap:round;stroke-linejoin:round}
#menu .champion-button{height:calc(120 * var(--u))!important;min-height:calc(120 * var(--u))!important;margin:0!important;flex-shrink:0}
#menu .champion-button img,#menu .champion-button>span{flex-shrink:0}
#menu .location-panel h2{margin-bottom:calc(14 * var(--u))!important}
#menu .session-metrics{padding:calc(10 * var(--u)) 0}
#menu .hero-card{padding-bottom:calc(5 * var(--u))!important}
#menu{background:linear-gradient(90deg,#00101a15,transparent 43%,#00101a10),linear-gradient(0deg,#00101a99,transparent 25%)}
body:not(.playing) #vignette{box-shadow:inset 0 0 80px #00101a44;background:none}
#menu .location-panel #locations{display:none!important}
#menu .champion-panel{bottom:calc(-15 * var(--u));height:calc(166 * var(--u))!important}
#menu #champions{padding-bottom:8px!important}
#menu .home-rail button[data-shell=home] svg{fill:currentColor;stroke-width:.6}
body[data-mode=dead] #menu,body[data-mode=win] #menu{display:block!important;pointer-events:none;background:none}
body[data-mode=dead] #menu .menu-grid,body[data-mode=win] #menu .menu-grid,body[data-mode=dead] #menu footer,body[data-mode=win] #menu footer{display:none!important}
body[data-mode=dead] #hud,body[data-mode=win] #hud{opacity:.25}
.ornament{position:absolute;width:28px;height:28px;fill:none;stroke:#d8ac53;stroke-width:1.3;pointer-events:none;z-index:2}
.ornament.tl{top:-3px;left:-3px}.ornament.tr{top:-3px;right:-3px;transform:rotate(90deg)}.ornament.br{bottom:-3px;right:-3px;transform:rotate(180deg)}.ornament.bl{bottom:-3px;left:-3px;transform:rotate(270deg)}
.frame-gem{position:absolute;bottom:-8px;left:50%;width:12px;height:12px;border:1px solid #e6b95f;background:#00131f;transform:translateX(-50%) rotate(45deg);pointer-events:none;z-index:2}.frame-gem:before{content:'';position:absolute;inset:3px;background:#d6ab53}
.metric-symbol svg{width:48px;height:48px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.result-tip>span svg{width:28px;height:30px;stroke:currentColor;fill:none;stroke-width:1.6}
@media(max-width:720px){#menu .champion-panel{height:116px!important;bottom:auto}#menu .menu-grid{padding-top:380px!important}.frame-gem{display:none}}
#menu .location-panel #startBtn,#modalCard .dialog-actions .primary{border:0;box-shadow:none;background:linear-gradient(#004b84,#002859 55%,#003b70)}
#menu .location-panel #startBtn:after,#modalCard .dialog-actions .primary:after{content:'';position:absolute;inset:0;background:url('assets/button-bevel.svg') center / 100% 100% no-repeat;pointer-events:none}
#modalCard.dialog-result{margin-left:calc(166 * var(--u));padding-top:calc(32 * var(--u))}
#modalCard.dialog-result .result-reason{padding-block:calc(10 * var(--u))}
#modalCard.dialog-result .result-subtitle{margin-bottom:calc(14 * var(--u))}
#modalCard.dialog-result .result-metrics>div{padding-block:calc(10 * var(--u))}
#modalCard.dialog-result .result-earned{margin-top:calc(15 * var(--u))}
@media(max-width:720px){#modalCard.dialog-result{margin-left:0}}
#modalCard.dialog-result{margin-top:calc(30 * var(--u))}
#modalCard.dialog-result .result-extra{position:absolute;left:calc(42 * var(--u));right:calc(42 * var(--u));bottom:calc(10 * var(--u));margin:0}
body[data-mode=dead] #hud,body[data-mode=win] #hud{visibility:hidden}
@media(max-width:720px){#modalCard.dialog-result{margin-top:0}#modalCard.dialog-result .result-extra{position:static;margin-top:8px}}
#modalCard.dialog-achievements{overflow:hidden}
.dialog-achievements .achievement-layout{min-height:0;max-height:min(650px,calc(90vh - 150px))}
.dialog-achievements .achievement-sidebar{overflow-y:auto;scrollbar-width:thin;scrollbar-color:#756444 transparent}
.dialog-achievements .achievement-content{min-height:0;display:flex;flex-direction:column}
.dialog-achievements #achievementList{min-height:0;max-height:none;flex:1;overflow:auto}
.dialog-achievements .ornament.tl{top:0;left:0}.dialog-achievements .ornament.tr{top:0;right:0}.dialog-achievements .ornament.br{bottom:0;right:0}.dialog-achievements .ornament.bl{bottom:0;left:0}
.dialog-achievements .frame-gem{bottom:1px}
#modalCard.dialog-achievements:after{top:0;font-size:10px}
@media(max-width:720px){.dialog-achievements .achievement-layout{max-height:calc(90vh - 155px)}.dialog-achievements .achievement-sidebar{overflow-y:hidden;min-height:42px}.dialog-achievements #achievementList{max-height:40vh}}
/* A focused dodge journal: earned rank, active playtime and played champions. */
#modalCard.dialog-achievements{width:min(1050px,94vw);max-height:91vh;display:flex;flex-direction:column}
#trainingAchievements{overflow-y:auto;min-height:0;scrollbar-width:thin;scrollbar-color:#92733b #051722;padding-right:10px}
.training-overview{display:grid;grid-template-columns:1.15fr 1fr 1fr;border:1px solid #876d3f80;background:linear-gradient(110deg,#12304280,#041722);padding:18px 0;margin-bottom:24px}
.training-stat{padding:0 20px;border-right:1px solid #3e617150;display:flex;flex-direction:column;justify-content:center;gap:8px}.training-stat:last-child{border:0}.training-stat small{font:11px Spiegel,sans-serif;letter-spacing:.12em;color:#91adbc}.training-stat strong{display:flex;align-items:center;gap:10px;font:500 32px Beaufort,serif;color:#f0d9a3;min-height:44px}.training-stat img{width:48px;height:48px;object-fit:contain}
.achievement-section-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:12px 0}.achievement-section-heading h3{font:500 16px Beaufort,serif!important;letter-spacing:.08em;color:#dcc697;margin:0!important}.achievement-section-heading span{font:12px Spiegel,sans-serif;color:#87a4b6}
.dialog-achievements #achievementList{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-height:none;overflow:visible;padding:0;margin-bottom:22px;flex:none}.achievement-card{margin:0;gap:10px;padding:16px 12px}.achievement-token{width:66px;height:78px}#modalCard .achievement-card h3{font-size:23px}.achievement-reward{gap:8px;font-size:10px}
.played-champions{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.played-champion{display:flex;align-items:center;gap:10px;border:1px solid #42607077;background:#0b202a80;padding:10px}.played-champion img{width:44px;height:44px;border:1px solid #b0985a}.played-champion strong{display:block;font:500 17px Beaufort,serif;color:#e1d7bb}.played-champion span{font:12px Spiegel,sans-serif;color:#8fb9cf}.played-champions .achievement-empty{grid-column:1/-1;padding:12px;color:#91a9b7}#modalCard .achievement-footnote{font:11px/1.5 Spiegel,sans-serif;color:#718d9f;margin:20px 0 0}
@media(max-width:800px){.dialog-achievements #achievementList{grid-template-columns:1fr}.played-champions{grid-template-columns:repeat(3,1fr)}.training-stat{padding:0 12px}.training-stat strong{font-size:24px}.training-stat small{font-size:10px}.training-stat img{width:35px;height:35px}}
@media(max-width:500px){.played-champions{grid-template-columns:1fr 1fr}.training-stat{padding:0 8px}.training-stat strong{font-size:20px}.training-stat small{font-size:9px}.training-overview{padding:12px 0}.achievement-section-heading{gap:8px}.achievement-section-heading h3{font-size:14px!important}.achievement-section-heading span{font-size:10px}}

#crowdControl[data-kind=fear]{background:#3d1023ed;border-color:#ff557caa;color:#ffe0e7}
