/* Midnight blue enamel restores the original client palette; gold art keeps the Asa finish. */
.client,.auth,.draft,.queue-panel,#collection-dialog,#loadout-dialog{--gold:#e7ce90;--gold-dark:#ae9056;--text:#e6edf0;--muted:#91a7b1;--line:#9dbaca2b;--bg:#08151e;--panel:#10232e;--blue-panel:url('./assets/ui/asa/panel-blue.png');--blue-button:url('./assets/ui/asa/action-button-blue.png');color:var(--text)}
.client{background:linear-gradient(105deg,#07151eef,#0a1b27f2),url('./assets/ui/asa/sengolia-panorama.png') center/cover}
.client-top{background:linear-gradient(#122a37,#08151f 88%);border-bottom-color:#bca56855}.client-wordmark{color:#ecd29a}.client-wallet button{background:linear-gradient(#18323f99,#091b25);border-color:#8daabd3a}.client .icon-button{background:linear-gradient(#1a3544,#0a1d29);border-color:#9eb9c344;color:#d8dfd9}.client-me{background:#18374466;border-color:#9bb6c23a}.client-me canvas{background:#142d3b}.client-main{scrollbar-color:#4d7588 #08151e}.client-nav button{color:#aebfc7}.client-nav button.active{background:linear-gradient(0deg,#619cb423,transparent);color:#f1d9a5}
.client .button-gold,.auth .button-gold,#collection-dialog .button-gold,#loadout-dialog .button-gold,.client-play,.draft .button-gold{background-image:var(--blue-button);color:#f4e4bd}.client .button-secondary{background:linear-gradient(#1a3444,#0b1d28);border-color:#91b2c04d;color:#d4e1e6}
.client-toast{background:#0d2533f5;border-color:#c6ac6e88}.client .hint,.client .store-note{color:#9fb3be}.client-welcome>span:last-child{color:#bbcbd4}
.home-hero{background-image:linear-gradient(90deg,#071b2633 15%,#092434c7 43%,#061924e6 75%),url('./assets/ui/asa/sengolia-panorama.png')}.home-hero p{color:#c4d5dd}.home-hero:after{border-color:#abc6d326}.home-hero.is-complete{background-position:center}.home-card,.queue-card,.play-side,.pack-card{border-image-source:var(--blue-panel)}.home-card p,.home-card .news,.home-card small{color:#b6c9d3}.home-rank b{color:#e1e8eb}.home-rank small{color:#91aab7}
.feed-post{background:linear-gradient(135deg,#16303fda,#0b1f2cda);border-color:#8fb1c138}.feed-copy p,.feed-copy li{color:#b7cbd5}.feed-art{background:#122d3e}.feed-owned{color:#8fcbd8}.feed-meta{color:#96acb6}.play-banner{background-image:linear-gradient(90deg,#081d2af0,#0b2233a1),url('./assets/ui/asa/sengolia-panorama.png')}.play-banner p{color:#b4cbd7}.play-group{color:#8eabb8}.queue-card.selected,.queue-card[aria-pressed="true"]{box-shadow:0 0 0 1px #d9c081,inset 0 0 40px #69bde21f,0 8px 20px #0005}.queue-card small{color:#9fb9c6}.queue-icon{background:radial-gradient(#6baac429,transparent);border-color:#bda56677}.queue-card.selected .queue-icon{color:#99dbed;border-color:#84c4dc88}.party-list li{background:#0718248c;color:#d5e0e5}.play-summary p{color:#b6cbd6}.play-summary{border-color:#8fb1c12e}.client .map-choice{border-color:#8fb1c12e}
.store-page-head p{color:#a8bdc8}.store-search{background:#0c2331d9;border-color:#8db2c355}.store-search input{color:#e3edf1}.store-search input::placeholder{color:#7896a6}.store-toolbar>small{color:#a1b7c2}.store-tabs button{color:#9cb4c1}.store-tabs button[aria-selected=true]{background:linear-gradient(0deg,#5798b426,transparent)}.store-filter button{background:#14314399;border-color:#87aabd44;color:#abc2cf}.store-filter button[aria-pressed=true]{background:#2d597444;color:#f1dba7;border-color:#cbb279}
.store-card,.champion-tile{background:linear-gradient(#163040,#0b202d);border-color:#97b2bc55}.store-card-art:after{background:linear-gradient(transparent,#0b202d)}.store-card-art{box-shadow:inset 0 0 50px #102e4422}.store-card .eyebrow,.champion-tile .eyebrow{color:#95b6c5}.store-card small,.champion-tile small{color:#a9c0cb}.store-card em{border-color:#9ab9c32b}.store-card[data-owned=true] em{color:#8fcfdf}.store-empty{background:#102b3bcc;border-color:#95b5c644;color:#bed2dd}.store-requirement{color:#bfae8d}
#collection-dialog,#loadout-dialog{border-image-source:var(--blue-panel);scrollbar-color:#52768a #0a1c28}#collection-dialog::backdrop,#loadout-dialog::backdrop{background:#030b13cc}#collection-dialog .close-dialog,#loadout-dialog .close-dialog{background:#153243;border-color:#b8a36b66}.collection-header p,.preview-copy>strong,.preview-copy p,.collection-selection>p{color:#adc2cd}.collection-tabs>button{color:#9eb7c3}.collection-heroes button{background:linear-gradient(#24445477,#102532);border-color:#88a9b944;color:#c1d3dc}.collection-heroes button[aria-pressed=true]{background:#2d587344;border-color:#d3ba7b}.collection-heroes small{color:#8ca8b7}.collection-card{background:#102835;border-color:#7b9faf55}.collection-card[aria-pressed=true]{background:#214357;border-color:#d8c18b}.collection-card>small{color:#a7c2d0}.collection-card .card-kicker{color:#9ab9c8}.preview-art{border-color:#9ab6bf44}.preview-art>small{background:#071b28bb;color:#b4cedc}.preview-controls button{background:#183647;border-color:#8eafbf44;color:#acc7d5}.preview-controls button[aria-pressed=true]{background:#34587466;border-color:#c9b17a}.collection-selection .local-economy{color:#8ba6b4;border-color:#95b2c333}.challenge-card{background:linear-gradient(#1b3b4f,#102531);border-color:#8dabb855}
.profile-banner,.rank-mine{background:linear-gradient(110deg,#1a3d51bb,#0c2232);border-color:#9cb4bd44}.rank-card{background:linear-gradient(#21435666,#0c202eb3);border-color:#91adb944}.history-row{background:#102f42cc}.tier-legend{color:#a4beca}.client .rank-table tr:hover td{background:#2c4f6488}.client .rank-table tr.you td{background:#2b506466}.xp-track{background:#05121c;border-color:#7c9aa744}.xp-track i{background:linear-gradient(90deg,#387f9c,#83c3d4)}
.client-social{background:linear-gradient(#102b3aee,#071823f7);border-left-color:#8ea9b83f}.friend-form input,.chat-form input,.chat-form button{background:#061a27b3;border-color:#86a9bb44}.social-list .hint{color:#8da8b6}.client-chat{border-color:#8dabbd2c}.chat-log{color:#b7d0dc}.friend:hover{background:#32607a33}.friend-actions button{background:#183a4f;border-color:#8baaba44}.social-settings{border-top-color:#8dabbd33}.social-head small{color:#8ac9dc}.client-social-backdrop{background:#020b14a8}.auth{background:linear-gradient(90deg,#061a2be3,#0a2237c5),url('./assets/ui/asa/sengolia-panorama.png') center/cover}.auth-card{border-image-source:var(--blue-panel)}.auth input{background:#0b2333;border-color:#8eaabd66}.auth-lead,.auth-note{color:#9cb6c6}
/* Champion selection */
.draft{--gold:#e7ce90;--muted:#93acb9;background:radial-gradient(ellipse at 50% -10%,#23465e80,transparent 65%),linear-gradient(#061722ee,#06121af5),url('./assets/ui/asa/sengolia-panorama.png') center/cover;padding:22px max(26px,calc((100vw - 1760px)/2)) 25px;scrollbar-width:thin;scrollbar-color:#486c80 #081722}
.draft-header{max-width:1760px;margin:0 auto;min-height:106px;align-items:center;gap:24px;padding:0 0 16px;border-color:#b6a27144;position:relative}.draft-title{display:flex;align-items:center;gap:18px;min-width:0}.draft-title>svg{color:#d5bb7e;width:42px;height:52px;filter:drop-shadow(0 0 12px #78bad02c)}.draft-header h2{font-size:32px;color:#efe4c8;line-height:1.2;margin:8px 0}.draft-title p{font-size:11px;color:#8faebf;margin:7px 0 0;line-height:1.6}.draft-header .eyebrow{font-size:8px;letter-spacing:2px}
.draft-steps{list-style:none;display:flex;align-items:center;gap:24px;padding:0;margin:0 20px 0 auto;color:#5e7c8d;font-size:8px;letter-spacing:1.5px}.draft-steps li{display:flex;align-items:center;gap:8px;white-space:nowrap}.draft-steps b{display:grid;place-items:center;width:25px;height:25px;border:1px solid #65869b44;border-radius:50%;font:500 10px var(--serif);color:#809bac}.draft-steps .active{color:#c6dce5}.draft-steps .active b,.draft-steps .complete b{color:#eddaad;border-color:#c4ae7580;background:#243a4766}.draft-steps .complete{color:#83c2d5}
.draft-timer{position:relative;isolation:isolate;width:106px;height:106px;flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding-bottom:1px;background:url('./assets/ui/asa/selection-clock.png') center/100% 100% no-repeat;filter:drop-shadow(0 4px 7px #0008)}.draft-timer strong{font:500 34px/1 var(--serif);color:#f0e0b1;text-shadow:0 2px 5px #000}.draft-timer small{font:500 6px var(--sans);letter-spacing:1.6px;color:#8facbd}.draft-clock-progress{position:absolute;inset:14px;border-radius:50%;background:conic-gradient(from -90deg,#92dbeb var(--time-left,100%),#41657922 0);mask:radial-gradient(farthest-side,transparent calc(100% - 2px),#000 0);opacity:.7;z-index:-1}.draft-timer.urgent strong{color:#ffa1ac}.draft-timer.urgent .draft-clock-progress{background:conic-gradient(from -90deg,#ff879a var(--time-left,100%),#6b334755 0)}.draft-timer.urgent{animation:draft-clock-warning 1s ease-in-out infinite}
.draft-body{max-width:1760px;margin:20px auto 0;grid-template-columns:190px minmax(0,1fr) 190px;gap:22px;align-items:start}.draft-main{min-width:0}.draft-section-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;color:#83a8bb;font-size:8px;letter-spacing:1.7px}.draft-section-heading b{color:#d1bb82;font-size:8px;font-weight:500;margin-left:8px}.draft-section-heading>small{font-size:9px;letter-spacing:.4px;color:#87a9bb;white-space:nowrap}
.draft-team{padding-top:1px;min-width:0}.draft-team h3{display:flex;align-items:center;gap:8px;color:#91ccdd;font-size:8px;letter-spacing:1.8px;margin:0 0 15px;min-height:13px}.draft-team h3 svg{width:16px;height:16px}.draft-team.enemy h3{color:#e5a0af}.draft-team ol{gap:9px}.draft-team li{position:relative;grid-template-columns:39px minmax(0,1fr) 12px;gap:9px;padding:11px 9px;border:1px solid #85b1c333;background:linear-gradient(105deg,#1a374a88,#0a1e2bbb);min-height:65px;box-shadow:0 4px 10px #0002}.draft-team li.you{background:linear-gradient(110deg,#2e4c5dc9,#112936);border-color:#cbb07888}.draft-team li.you:before{content:'';position:absolute;left:-1px;top:12px;bottom:12px;width:2px;background:#e4c985}.draft-team.enemy li{border-color:#9d657d3b;background:linear-gradient(105deg,#30283d66,#101e2bbb)}.draft-team canvas,.draft-team .unknown{width:39px;height:39px;border-radius:50%;background:#0b1e29;border:1px solid #a8bbc344}.draft-team .unknown{font:500 19px var(--serif);color:#8a7d94;border-color:#8f6d8055}.draft-team strong{font-size:10px;font-weight:600;line-height:1.5;color:#e0e6e8}.draft-team small{font-size:8px;color:#88a6b7;letter-spacing:.3px;line-height:1.7}.draft-team .lock{font-size:12px;color:#688799}.draft-team .lock.on{color:#96d5e5}
.draft-champions{gap:10px;grid-template-columns:repeat(5,minmax(0,1fr))}.draft-champions button{isolation:isolate;background:linear-gradient(160deg,#203d52,#0c1d2b);border:1px solid #9bb7c444;transition:transform .18s,border-color .18s,box-shadow .18s;box-shadow:0 6px 14px #0003}.draft-champions button:before{content:'';position:absolute;inset:5px;border:1px solid #c8b67c2a;pointer-events:none;z-index:2}.draft-champions button:after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 35%,#6da7bf30,transparent 60%);z-index:-1}.draft-champions canvas{width:100%;height:clamp(152px,13vw,223px);object-fit:contain;aspect-ratio:auto;display:block;margin-top:-2px;margin-bottom:23px;filter:drop-shadow(0 5px 4px #0006)}.draft-champions .draft-card-copy{position:absolute;left:0;right:0;bottom:0;padding:20px 6px 12px;line-height:1.5;background:linear-gradient(transparent,#071722e8 38%);text-align:center}.draft-card-copy strong{display:block;font:500 15px/1.2 var(--serif);color:#ead8a8;letter-spacing:.1px}.draft-card-copy small{display:block;font:500 7px var(--sans);letter-spacing:1.3px;color:#8eafc0;margin-top:4px;text-transform:uppercase}.draft-card-status{position:absolute;right:11px;top:11px;width:18px;height:18px;display:grid;place-items:center;font:600 10px var(--sans);color:#e8ce8f;background:#112d40bb;border:1px solid #ceb57466;border-radius:50%;opacity:0;transition:opacity .18s}.draft-champions button[aria-pressed=true]{border-color:#e1c78c;box-shadow:0 0 0 1px #d5ba7577,inset 0 0 40px #6eafd728,0 6px 16px #0005}.draft-champions button[aria-pressed=true] .draft-card-status{opacity:1}.draft-champions button:hover:not(:disabled){transform:translateY(-3px);border-color:#deca96}.draft-champions button:disabled{opacity:1}.draft-champions button[data-owned=false]{opacity:.46}.draft-champions button[data-owned=false] canvas{filter:grayscale(.65) brightness(.65)}.draft-champions button[data-owned=false] .draft-card-status{opacity:1;color:#b5ad9c}.draft.is-locked .draft-champions button:not([aria-pressed=true]){opacity:.5}
.draft-hero{gap:12px;margin:15px 0 14px;min-height:44px;padding:0 0 13px;border-bottom:1px solid #89adbd2b}.draft-hero strong{font-size:24px;color:#e9dbb6}.draft-hero small{color:#85b2c7;font-size:7px}.draft-skins{gap:5px;max-width:80%}.draft-skins button{background:linear-gradient(#1b3b50bb,#0e2636);border-color:#87a5b43a;color:#b3ccd9;font-size:9px;padding:7px 11px;min-height:30px}.draft-skins button[aria-pressed=true]{border-color:#cbb375;background:#28465a;color:#eedba7}.draft-skins button:disabled{opacity:.75}.draft-spells button{font-size:8px;color:#99c8dd}.draft #draft-picker{grid-template-columns:minmax(0,1fr) minmax(230px,.42fr);gap:14px 18px}.draft .loadout-slots{gap:9px}.draft .loadout-slot{padding:12px 6px 10px;min-height:98px;border:1px solid #8fabb844;background:linear-gradient(#17384ccc,#0a2131);box-shadow:inset 0 0 0 3px #03111c66;gap:7px}.draft .loadout-slot img{width:46px;height:46px;border:1px solid #cdb27899;box-shadow:0 2px 6px #0008}.draft .loadout-slot.active{background:linear-gradient(#29516a,#102c41);border-color:#e0c585;box-shadow:inset 0 0 0 3px #e1c58112,0 0 15px #65bce516}.draft .loadout-slot.ultimate{border-color:#af92bd66}.draft .loadout-slot.ultimate.active{border-color:#d9b4eb}.draft .loadout-slot kbd{left:9px;top:9px;font:600 11px var(--serif);color:#e7ce90;text-shadow:0 1px 2px #000}.draft .loadout-slot small{font-size:9px;line-height:1.5;color:#b9d0de;min-height:27px;max-width:96%}.draft .skill-pool{gap:14px;padding:3px 0}.draft .skill-pool h4{font-size:8px;letter-spacing:1.5px;color:#cdb57d;margin-bottom:10px}.draft .skill-pool h4 small{font-size:7px;color:#718fa3}.draft .pool-grid{gap:7px}.draft .pool-skill{width:42px;height:42px;border-color:#88adc052;padding:2px;background:#081b29;opacity:.72;box-shadow:0 2px 4px #0005}.draft .pool-skill.fits{border-color:#9fbdcb88;opacity:.95}.draft .pool-skill.chosen{border-color:#e2c78b;box-shadow:0 0 0 1px #d8bd7b66;opacity:1}.draft .pool-key{background:#071722aa;padding:0 3px;bottom:2px;right:2px;font-size:9px}.draft .skill-detail{border:9px solid transparent;border-image:var(--blue-panel) 80 fill / 9px;background:none;display:grid;grid-template-columns:40px minmax(0,1fr);gap:10px;padding:15px 12px;min-height:236px;max-width:100%;box-shadow:0 6px 18px #0003}.draft .skill-detail>img{width:40px;height:40px;border:1px solid #c6aa6a88;box-shadow:0 2px 5px #0006}.draft .skill-detail strong{font-size:15px;line-height:1.35;color:#e9dcb9}.draft .skill-detail .skill-tags{color:#86a6ba;font-size:8px;line-height:1.6;letter-spacing:.2px}.draft .skill-detail p{font-size:11px;line-height:1.65;color:#b9d0dd;margin-top:10px}.draft .skill-detail .skill-numbers{font-size:10px;color:#e4ca8a}.draft .skill-detail .skill-origin{color:#7291a4;font-size:9px}.draft .skill-detail .skill-origin{max-height:84px;overflow:auto;scrollbar-width:thin;scrollbar-color:#4f7083 transparent}
.draft #draft-chat{margin-top:15px}.draft .chat-box{background:#071b2acc;border-color:#87a8ba3b}.draft .chat-box input{padding:10px 13px;background:#0c2536;color:#c4dbe7;border-top-color:#81a7bd24;font-size:11px}.draft .chat-box-log{font-size:10px;max-height:62px;padding:3px 11px}.draft .chat-box-log:empty{display:none}.draft-actions{margin-top:15px;padding-top:12px;border-top:1px solid #8ba8b326;gap:15px;flex-wrap:nowrap}.draft-actions p{font-size:10px;line-height:1.65;color:#91adbd;max-width:62ch}.draft .button-gold{min-width:220px;height:49px;margin:0;padding:10px 24px;border:0;clip-path:none;box-shadow:none;color:#f0dfb2;font-size:10px;gap:22px;background-size:100% 100%;text-shadow:0 1px 3px #000}.draft .button-gold:before,.draft .button-gold:after{display:none}.draft .button-gold:disabled{filter:saturate(.5);opacity:.88;cursor:default}.draft.is-locked .draft-actions p{color:#96c5d9}
/* Matchmaking is a compact framed status, with live text separate from its ornaments. */
.queue-panel{width:min(660px,calc(100vw - 32px));max-width:none;min-height:106px;bottom:24px;padding:20px 24px;display:grid;grid-template-columns:44px minmax(0,1fr) 80px auto;gap:16px;border:0;background:url('./assets/ui/asa/queue-frame-blue.png') center/100% 100% no-repeat;box-shadow:none;filter:drop-shadow(0 12px 22px #000b);isolation:isolate}.queue-sigil{position:relative;width:40px;height:40px;display:grid;place-items:center;color:#dfc68b}.queue-sigil>svg{width:27px;height:27px}.queue-sigil:before{content:'';position:absolute;inset:0;border:1px solid #90c6dd55;border-right-color:#e8d2a1;border-radius:50%;animation:queue-search-turn 3s linear infinite}.queue-copy{min-width:0}.queue-panel .queue-eyebrow{display:block;font-size:6px;letter-spacing:1.9px;color:#87a9bd;margin:0 0 6px}.queue-panel strong{font:500 13px/1.4 var(--serif);letter-spacing:.2px;color:#ead8ae}.queue-panel small#queue-detail{font-size:9px;line-height:1.5;margin-top:5px;color:#9eb9c9}.queue-clock{display:grid;justify-items:center;gap:5px;padding-left:12px;border-left:1px solid #af9d6944}.queue-clock>small{font-size:6px;letter-spacing:1px;color:#8ba7b9;white-space:nowrap;margin:0}.queue-panel time{font:500 24px/1 var(--serif);color:#e9d4a0;letter-spacing:.6px}.queue-panel .button-secondary{height:33px;min-width:0;padding:7px 11px;background:linear-gradient(#1d3c51,#0b2434);border:1px solid #a3b8bb44;color:#b9cbd4;font-size:8px;letter-spacing:1px;transition:border-color .18s,color .18s}.queue-panel .button-secondary:hover{border-color:#d8c18c;color:#f4e6c3}.queue-progress{height:2px;margin-top:9px;max-width:240px;overflow:hidden;background:#76b2d222}.queue-progress i{display:block;width:35%;height:100%;background:linear-gradient(90deg,transparent,#8dd7e9,#c7ad71);animation:queue-search-sweep 2.7s ease-in-out infinite}
@keyframes queue-search-turn{to{transform:rotate(360deg)}}@keyframes queue-search-sweep{from{transform:translateX(-105%)}to{transform:translateX(390%)}}@keyframes draft-clock-warning{50%{filter:drop-shadow(0 0 9px #da688b55)}}
@media(max-width:1500px){.draft{padding:18px 26px 24px}.draft-body{grid-template-columns:165px minmax(0,1fr) 165px;gap:18px}.draft-team li{grid-template-columns:32px minmax(0,1fr) 10px;gap:7px;padding:10px 8px;min-height:59px}.draft-team canvas,.draft-team .unknown{width:32px;height:32px}.draft-team strong{font-size:9px}.draft-team small{font-size:7px}.draft #draft-picker{grid-template-columns:minmax(0,1fr) 245px;gap:12px 15px}.draft .pool-skill{width:37px;height:37px}.draft .pool-grid{gap:6px}.draft-steps{gap:15px;margin-right:6px}.draft-card-copy strong{font-size:13px}.draft .skill-detail{grid-template-columns:32px minmax(0,1fr);padding:12px 8px;gap:8px}.draft .skill-detail>img{width:32px;height:32px}.draft .skill-detail strong{font-size:13px}.draft .skill-detail p{font-size:10px}.draft .skill-detail .skill-numbers{font-size:9px}.draft .skill-detail .skill-origin{font-size:8px;max-height:70px}}
@media(max-width:1200px){.draft{padding:17px 22px 25px}.draft-body{grid-template-columns:145px minmax(0,1fr) 145px;gap:14px}.draft-steps{display:none}.draft-champions{gap:7px}.draft-champions canvas{height:150px;margin-bottom:22px}.draft .loadout-slot{padding:10px 5px 7px;min-height:92px}.draft .loadout-slot img{width:39px;height:39px}.draft .loadout-slot kbd{left:6px;top:7px;font-size:10px}.draft .loadout-slot small{font-size:8px}.draft #draft-picker{grid-template-columns:minmax(0,1fr) 210px;gap:12px}.draft .pool-skill{width:34px;height:34px}.draft .pool-grid{gap:5px}.draft .skill-detail{grid-template-columns:1fr}.draft .skill-detail>img{display:none}.draft-actions p{font-size:9px}.draft .button-gold{min-width:185px;font-size:9px;padding:10px 18px}.draft-hero strong{font-size:22px}.draft-team li{grid-template-columns:28px minmax(0,1fr) 8px;gap:6px;padding:9px 7px}.draft-team canvas,.draft-team .unknown{width:28px;height:28px}.draft-team .lock{font-size:10px}}
@media(max-width:1000px){.draft-body{grid-template-columns:1fr 1fr;grid-template-areas:'allies enemies' 'main main';gap:15px 20px}.draft-main{grid-area:main}.draft-team:not(.enemy){grid-area:allies}.draft-team.enemy{grid-area:enemies}.draft-team ol{display:flex;gap:7px;overflow:auto;scrollbar-width:thin;padding-bottom:3px}.draft-team li{min-width:146px;flex:1;grid-template-columns:30px minmax(0,1fr) 9px;min-height:56px}.draft-team canvas,.draft-team .unknown{width:30px;height:30px}.draft-team h3{margin-bottom:10px}.draft-team small{font-size:8px}.draft-team strong{font-size:9px}.draft #draft-picker{grid-template-columns:minmax(0,1fr) 240px;grid-template-areas:'slots detail' 'pool detail';gap:12px 16px}.draft .skill-detail{display:block;min-height:230px}.draft .skill-detail>img{display:block;float:left;margin:0 9px 7px 0;width:38px;height:38px}.draft-champions canvas{height:166px}.draft .pool-skill{width:39px;height:39px}.draft .pool-grid{gap:6px}.draft-card-copy strong{font-size:15px}.draft .loadout-slot img{width:44px;height:44px}.draft .loadout-slot small{font-size:9px}.draft-title p{font-size:10px}.draft-header{min-height:96px}.draft-timer{width:94px;height:94px}.draft-timer strong{font-size:30px}.draft-clock-progress{inset:12px}.draft-header h2{font-size:30px}}
@media(max-width:700px){.draft{padding:14px 16px 24px}.draft-header{gap:15px;min-height:94px;padding-bottom:12px}.draft-title{gap:11px}.draft-title>svg{width:27px;height:37px}.draft-header h2{font-size:25px}.draft-header .eyebrow{font-size:7px;letter-spacing:1.5px}.draft-title p{font-size:9px;max-width:30ch}.draft-timer{width:87px;height:87px}.draft-timer strong{font-size:28px}.draft-timer small{font-size:5px}.draft-clock-progress{inset:11px}.draft-body{margin-top:15px;gap:14px}.draft-champions canvas{height:139px;margin-bottom:20px}.draft-card-copy strong{font-size:12px}.draft-card-copy small{font-size:6px;letter-spacing:.6px}.draft-champions .draft-card-copy{padding:15px 3px 10px}.draft-champions button:before{inset:3px}.draft-card-status{right:7px;top:7px;width:15px;height:15px;font-size:8px}.draft #draft-picker{grid-template-columns:1fr;grid-template-areas:'slots' 'pool' 'detail';gap:15px}.draft .skill-detail{min-height:0;padding:14px 12px}.draft .skill-detail>img{width:45px;height:45px}.draft .skill-detail strong{font-size:16px}.draft .skill-detail p{font-size:11px}.draft .skill-detail .skill-origin{font-size:9px;max-height:none}.draft .pool-skill{width:42px;height:42px}.draft .pool-grid{gap:7px}.draft .loadout-slot small{font-size:8px}.draft-skins{max-width:100%}.draft-hero{margin:14px 0}.draft-actions{align-items:flex-start}.draft .button-gold{min-width:180px}.queue-panel{width:calc(100vw - 24px);padding:18px 20px;grid-template-columns:32px minmax(0,1fr) 70px;gap:12px;bottom:16px;min-height:117px}.queue-sigil{width:31px;height:31px}.queue-sigil>svg{width:21px;height:21px}.queue-panel strong{font-size:12px}.queue-clock{padding-left:10px}.queue-clock>small{font-size:5px}.queue-panel time{font-size:22px}.queue-panel .button-secondary{grid-column:2/4;justify-self:end;font-size:7px;height:29px;padding:5px 10px;margin-top:-2px}.queue-copy{grid-row:1/3}.queue-sigil{grid-row:1/3}.queue-clock{grid-row:1;grid-column:3}.queue-panel .queue-eyebrow{font-size:5px;letter-spacing:1.3px}.queue-panel small#queue-detail{font-size:8px}.queue-progress{margin-top:8px}}
@media(max-width:480px){.draft{padding:13px 12px 25px}.draft-title>svg{display:none}.draft-header h2{font-size:25px;margin:7px 0}.draft-title p{font-size:8px;max-width:25ch}.draft-timer{width:80px;height:80px}.draft-timer strong{font-size:27px}.draft-clock-progress{inset:10px}.draft-header .eyebrow{font-size:6px;letter-spacing:1.4px}.draft-team li{min-width:136px;padding:8px;min-height:54px}.draft-team h3{font-size:7px;letter-spacing:1.2px;gap:5px}.draft-team h3 svg{width:13px;height:13px}.draft-section-heading{font-size:7px;letter-spacing:1px;gap:8px}.draft-section-heading b{font-size:7px;margin-left:4px}.draft-section-heading>small{font-size:8px}.draft-champions{display:flex;gap:8px;overflow:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:#426a82 transparent;padding:2px 1px 10px}.draft-champions button{min-width:calc((100% - 18px)/3);flex:0 0 calc((100% - 18px)/3);scroll-snap-align:start}.draft-champions canvas{height:132px}.draft-card-copy strong{font-size:13px}.draft-card-copy small{font-size:6px}.draft-hero{gap:11px}.draft-hero strong{font-size:24px}.draft-hero small{font-size:7px}.draft-skins button{font-size:8px;padding:7px 10px}.draft #draft-picker{gap:16px}.draft .loadout-slots{gap:6px}.draft .loadout-slot{padding:12px 4px 8px;gap:8px;min-height:95px}.draft .loadout-slot img{width:37px;height:37px}.draft .loadout-slot kbd{font-size:9px;left:5px;top:6px}.draft .loadout-slot small{font-size:8px;min-height:26px}.draft .pool-skill{width:39px;height:39px}.draft .pool-grid{gap:7px}.draft .skill-pool{gap:15px}.draft .skill-detail{padding:15px 11px}.draft .skill-detail p{font-size:11px}.draft-actions{flex-direction:column;margin-top:14px;gap:12px}.draft-actions p{font-size:10px;line-height:1.7}.draft .draft-actions .button-gold{width:100%;min-width:0;height:48px;font-size:10px}.draft #draft-chat{margin-top:16px}.draft .chat-box input{font-size:10px}.draft.is-locked .draft-champions{scroll-snap-type:none}.queue-panel{gap:11px;padding:18px 17px;min-height:132px;grid-template-columns:28px minmax(0,1fr) 62px}.queue-sigil{width:28px;height:28px}.queue-panel strong{font-size:11px;line-height:1.5}.queue-panel small#queue-detail{font-size:8px;line-height:1.6}.queue-panel time{font-size:21px}.queue-panel .queue-eyebrow{font-size:5px;letter-spacing:1px}.queue-panel .button-secondary{height:27px;font-size:6px;padding:5px 8px}.queue-clock{padding-left:7px}.queue-clock>small{font-size:4px;letter-spacing:.9px}.home-hero:before{background:linear-gradient(transparent,#081d2bea 28%)}.home-hero .eyebrow{color:#d7bf8b}}
@media(min-width:1001px) and (max-height:850px){.draft{padding-top:14px;padding-bottom:18px}.draft-header{min-height:83px;padding-bottom:12px}.draft-header h2{font-size:28px;margin:6px 0}.draft-title p{font-size:10px;margin-top:5px}.draft-title>svg{width:33px;height:41px}.draft-timer{width:82px;height:82px}.draft-timer strong{font-size:28px}.draft-timer small{font-size:5px}.draft-clock-progress{inset:11px}.draft-body{margin-top:14px}.draft-section-heading{margin-bottom:10px}.draft-champions canvas{height:126px;margin-bottom:21px}.draft-card-copy strong{font-size:13px}.draft-card-copy small{font-size:6px}.draft-champions .draft-card-copy{padding:15px 5px 10px}.draft-hero{margin:10px 0 11px;padding-bottom:10px;min-height:37px}.draft-hero strong{font-size:22px}.draft-hero small{font-size:6px}.draft-skins button{min-height:27px;padding:6px 10px;font-size:8px}.draft #draft-picker{gap:11px 15px}.draft .loadout-slot{padding:9px 5px 7px;min-height:83px;gap:6px}.draft .loadout-slot img{width:38px;height:38px}.draft .loadout-slot small{font-size:8px;min-height:22px}.draft .loadout-slot kbd{font-size:9px;top:7px;left:7px}.draft .skill-pool{gap:11px}.draft .pool-skill{width:33px;height:33px}.draft .pool-grid{gap:6px}.draft .skill-pool h4{margin-bottom:7px;font-size:7px}.draft .skill-detail{min-height:205px}.draft .skill-detail .skill-origin{max-height:62px}.draft #draft-chat{margin-top:11px}.draft .chat-box input{padding:8px 12px;font-size:10px}.draft-actions{margin-top:10px;padding-top:10px}.draft .draft-actions .button-gold{height:44px;font-size:9px}.draft-actions p{font-size:9px}}
@media(max-width:480px){.queue-clock>small{font-size:6px;letter-spacing:.4px}.queue-panel .button-secondary{font-size:7px}.queue-panel .queue-eyebrow{font-size:6px;letter-spacing:.8px}}
@media(prefers-reduced-motion:reduce){.draft *, .queue-panel *, .draft *:before, .queue-panel *:before{animation:none!important;transition:none!important}.queue-progress i{width:100%;background:#78b9d5;opacity:.65}}
.draft-champions,.collection-heroes{grid-template-columns:repeat(6,minmax(0,1fr))}