/* Full landscape practice room. Explicit media bounds avoid inherited icon sizing. */
html body #lobby #practice-panel.pr-room{position:fixed!important;inset:0!important;transform:none!important;margin:auto!important;width:min(1180px,100vw)!important;max-width:100vw!important;height:min(700px,100dvh)!important;max-height:100dvh!important;padding:max(10px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))!important;box-sizing:border-box!important;overflow:hidden!important;border:2px solid #b992db;border-radius:22px;background:radial-gradient(ellipse at 15% 10%,#473064 0,transparent 65%),#201831;color:#fff0ce}
#practice-panel.pr-room[open]{display:grid!important;grid-template-rows:auto minmax(0,1fr) auto;gap:12px}
.pr-room *, .pr-picker *{box-sizing:border-box}
.pr-room button,.pr-picker button{width:auto;margin:0;font:inherit;font-weight:700;color:#fff0dc;border:1px solid #ab8ac7;border-radius:14px;background:linear-gradient(#69477f,#382449);box-shadow:0 5px 0 #160e28,inset 0 1px 0 #ffffff30;min-height:44px;padding:8px 12px;cursor:pointer;touch-action:manipulation;transition:filter .12s,transform .12s}
.pr-room button:active,.pr-picker button:active{transform:translateY(3px);box-shadow:0 2px 0 #160e28;filter:brightness(1.15)}
.pr-room button[aria-pressed=true],.pr-picker button[aria-pressed=true]{color:#302044;border-color:#fde4a7;background:linear-gradient(#fde6ab,#ebc459);box-shadow:0 5px 0 #847447}
.pr-room button:focus-visible,.pr-picker button:focus-visible{outline:3px solid #fde7ac;outline-offset:2px}
.pr-room button:disabled,.pr-picker button:disabled{cursor:default;opacity:.55}
.pr-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
.pr-heading h2{font-size:clamp(22px,3vw,34px);margin:0;line-height:1.1}.pr-heading small{font-size:10px;letter-spacing:2px;color:#c8aadf}
.pr-body{display:grid;grid-template-columns:minmax(170px,25%) minmax(0,1fr);gap:14px;min-height:0}
.pr-match{display:flex;flex-direction:column;gap:12px;min-height:0;padding:12px;border:1px solid #77558f;border-radius:18px;background:#18152c70}
.pr-choice{display:flex;gap:8px}.pr-choice button{flex:1;min-width:0;padding:8px 4px;white-space:nowrap}
.pr-arena{min-height:0;flex:1;display:flex}
#practice-panel.pr-room .map-choice{width:100%;height:100%;min-height:0;margin:0;padding:8px;display:flex;flex-direction:column;justify-content:center;gap:6px;background:#262642;border:1px solid #776393;border-radius:14px}
#practice-panel.pr-room .map-choice-art{position:static;flex:1;min-height:0;height:auto;display:flex;align-items:center;justify-content:center;overflow:hidden}
#practice-panel.pr-room .map-choice-art svg{width:100%;height:100%;max-height:150px;max-width:210px}
#practice-panel.pr-room .map-choice-art b{font-size:40px;line-height:1}
#practice-panel.pr-room .map-choice-caption{position:static;display:block;text-align:center;padding:0}
#practice-panel.pr-room .map-choice-caption strong{display:block;font-size:14px;line-height:1.15}
#practice-panel.pr-room .map-choice-caption small,#practice-panel.pr-room .map-choice-caption span{display:none}
#practice-panel.pr-room .map-choice-nav{position:static;display:flex;gap:8px;justify-content:center}
#practice-panel.pr-room .map-choice-nav button{flex:1;min-width:0;width:auto;height:40px;min-height:40px;padding:0;font-size:24px}
.pr-bots{display:grid;grid-template-rows:auto minmax(0,1fr);gap:12px;min-width:0;min-height:0}
.pr-roster{display:grid;grid-template-columns:100px minmax(0,1fr);gap:8px}
.pr-all{grid-row:1/3;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px;font-size:21px!important}.pr-all strong{font-size:15px}
.pr-team{display:flex;gap:8px}.pr-team button{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;gap:8px;border-color:#75badc}.pr-team[data-team="1"] button{border-color:#e68aa9}.pr-team strong{font-size:14px}.pr-team small{font-size:11px;white-space:nowrap}
.pr-editor{display:grid;grid-template-rows:auto minmax(0,1fr);min-height:0;gap:10px;padding:12px;background:#322344;border:1px solid #9971b0;border-radius:18px}
.pr-strength{display:grid;grid-template-columns:minmax(100px,30%) minmax(0,1fr);gap:16px;align-items:center}.pr-strength label{display:flex;flex-direction:column;gap:3px;margin:0!important}.pr-strength label span{font-size:12px;color:#d6c2e7}.pr-strength output{font-weight:bold;color:#fcde8e;margin-left:6px}
.pr-slider{display:flex;align-items:center;gap:10px}.pr-slider button{width:44px;flex:none;padding:0;font-size:22px}.pr-slider input{width:100%;min-width:0;height:34px;accent-color:#f4d37c;cursor:pointer}
.pr-deck{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;min-height:0}
.pr-deck button{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:0;padding:8px 5px;overflow:hidden}.pr-deck small{font-size:11px;color:#e1c7f0}.pr-deck strong{font-size:clamp(12px,1.4vw,16px);line-height:1.12;max-width:100%;overflow-wrap:anywhere}
.pr-deck img,.pr-deck svg{display:block!important;width:clamp(32px,7vh,66px)!important;height:clamp(32px,7vh,66px)!important;max-width:100%!important;object-fit:contain;flex-shrink:1;min-height:0}
.pr-random{display:flex;align-items:center;justify-content:center;font-size:32px;color:#d3b2fa;line-height:1;width:44px;height:44px;flex-shrink:1;min-height:0}.pr-edit-mark{position:absolute;right:7px;top:6px;color:#fde39f;font-size:14px}
.pr-footer{display:flex;align-items:center;justify-content:space-between;gap:12px}.pr-status{font-size:12px;color:#c9b2dc}.pr-room #play-practice{min-width:230px;background:linear-gradient(#fde7b0,#e9c154);color:#3b2a18;border-color:#fdedc3;box-shadow:0 5px 0 #867442}
.pr-picker{position:fixed;inset:0;margin:auto;width:min(850px,96vw);height:min(540px,96dvh);max-height:96dvh;max-width:96vw;padding:16px;border:2px solid #bc95df;border-radius:22px;background:radial-gradient(ellipse at top,#513766,#20162f);color:#fff0dc;overflow:hidden}
.pr-picker[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:14px}.pr-picker::backdrop{background:#110b23cc}.pr-picker header,.pr-picker footer{display:flex;align-items:center;justify-content:space-between;gap:12px}.pr-picker h2{font-size:20px;margin:0}.pr-picks{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:12px;min-height:0}.pr-picks button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:0;overflow:hidden}.pr-picks img,.pr-picks svg{width:48px!important;height:48px!important;max-height:55%!important;object-fit:contain;flex-shrink:1;min-height:0}.pr-picks strong{font-size:13px;line-height:1.15}.pr-picker footer button{min-width:65px;font-size:22px}
@media(max-height:460px){html body #lobby #practice-panel.pr-room{border-radius:0;padding-top:8px!important;padding-bottom:max(10px,env(safe-area-inset-bottom))!important}#practice-panel.pr-room[open]{gap:8px}.pr-heading small{display:none}.pr-heading h2{font-size:23px}.pr-body{gap:10px}.pr-match{padding:8px;gap:8px}.pr-bots{gap:8px}.pr-roster{gap:6px;grid-template-columns:88px minmax(0,1fr)}.pr-team button{min-height:36px;padding:4px;gap:4px}.pr-team small{font-size:10px}.pr-editor{padding:8px;gap:6px}.pr-deck button{gap:3px}.pr-strength{gap:8px}.pr-deck img,.pr-deck svg{width:32px!important;height:32px!important}.pr-random{height:32px;font-size:26px}.pr-choice button{min-height:40px}.pr-picker{padding:10px;gap:8px!important}.pr-picks{gap:8px}.pr-picker h2{font-size:17px}}
@media(max-width:720px){.pr-body{grid-template-columns:160px minmax(0,1fr)}.pr-team button{flex-direction:column;gap:0}.pr-team strong{font-size:12px}.pr-roster{grid-template-columns:70px minmax(0,1fr)}.pr-all strong{font-size:12px}.pr-deck{gap:5px}.pr-strength{grid-template-columns:95px minmax(0,1fr)}.pr-slider{gap:5px}.pr-slider button{width:36px}.pr-deck strong{font-size:11px}.pr-status{font-size:11px}.pr-room #play-practice{min-width:190px}.pr-picker .pr-picks strong{font-size:11px}}
/* Reserve the full upper area for setup; navigation shares the launch bar. */
html body #lobby #practice-panel.pr-room[open]{grid-template-rows:minmax(0,1fr) 48px;gap:12px}
#practice-panel.pr-room .pr-footer{position:static;inset:auto;width:100%;height:48px;min-height:0;margin:0;padding:0;display:flex;justify-content:space-between;align-items:center;background:none;border:0;gap:12px}
#practice-panel.pr-room .pr-exit{display:flex;align-items:center;gap:12px;flex:none}
#practice-panel.pr-room .pr-exit h2{margin:0;font-size:20px;line-height:1}
#practice-panel.pr-room button{margin:0;line-height:1.15}
#practice-panel.pr-room .pr-footer button{height:44px;min-height:44px;padding:8px 18px}
#practice-panel.pr-room .pr-roster{grid-template-columns:88px minmax(0,1fr);gap:8px}
#practice-panel.pr-room .pr-team button{height:44px;min-height:44px;font-size:14px;padding:5px 8px}
#practice-panel.pr-room .pr-team small{font-size:11px}
#practice-panel.pr-room .pr-all{min-height:96px}
#practice-panel.pr-room .pr-strength{grid-template-columns:135px minmax(0,1fr)}
#practice-panel.pr-room .pr-slider button{min-height:44px;height:44px;width:44px;flex:none}
#practice-panel.pr-room .pr-editor{grid-template-rows:44px minmax(0,1fr);gap:10px;min-height:0}
#practice-panel.pr-room .pr-deck button{min-height:0;height:100%;font-size:14px;padding:6px;gap:4px}
#practice-panel.pr-room .pr-deck small{font-size:11px;line-height:1.1}
#practice-panel.pr-room .pr-deck strong{font-size:13px;line-height:1.1}
#practice-panel.pr-room .pr-deck img,#practice-panel.pr-room .pr-deck svg{width:36px!important;height:36px!important;max-height:36px!important;object-fit:contain}
#practice-panel.pr-room .pr-random{height:36px;width:36px;flex:none}
#practice-panel.pr-room .pr-random img,#practice-panel.pr-room .pr-random svg{width:32px!important;height:32px!important}
#practice-panel.pr-room .pr-choice button{min-height:44px}
#practice-panel.pr-room .map-choice-nav button{min-height:44px;height:44px}
#practice-panel.pr-room .map-choice-art{flex:1 1 0;min-height:24px}
#practice-panel.pr-room .map-choice-art img{width:36px;height:36px;object-fit:contain}
@media(max-height:360px){html body #lobby #practice-panel.pr-room[open]{gap:8px}#practice-panel.pr-room .pr-bots{gap:8px}#practice-panel.pr-room .pr-editor{padding:8px;gap:6px}#practice-panel.pr-room .pr-deck button{display:grid;grid-template-columns:32px minmax(0,1fr);grid-template-rows:auto auto;column-gap:5px;text-align:left;align-content:center}#practice-panel.pr-room .pr-deck button>img,#practice-panel.pr-room .pr-deck button>svg,#practice-panel.pr-room .pr-deck .pr-random{grid-column:1;grid-row:1/3;width:30px!important;height:30px!important}#practice-panel.pr-room .pr-deck small,#practice-panel.pr-room .pr-deck strong{grid-column:2}#practice-panel.pr-room .pr-deck small{font-size:10px}#practice-panel.pr-room .pr-deck strong{font-size:12px}#practice-panel.pr-room .pr-status{display:none}}
@media(max-width:720px){#practice-panel.pr-room .pr-roster{grid-template-columns:70px minmax(0,1fr)}#practice-panel.pr-room .pr-team button{padding:4px}#practice-panel.pr-room .pr-strength{grid-template-columns:100px minmax(0,1fr)}#practice-panel.pr-room .pr-status{display:none}}
.pr-picker>header{position:static;inset:auto;width:100%;max-width:none;height:44px;min-height:0;margin:0;padding:0;display:flex;justify-content:space-between;align-items:center;background:none;border:0;box-shadow:none}
/* Use focused choice screens instead of squeezing six selectors into a sidebar. */
#practice-panel.pr-room .pr-body{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:64px minmax(0,1fr);gap:14px}
#practice-panel.pr-room .pr-match,#practice-panel.pr-room .pr-roster{display:none}
#practice-panel.pr-room .pr-bots{display:block;min-height:0;height:100%}
#practice-panel.pr-room .pr-editor{height:100%;padding:14px;grid-template-rows:56px minmax(0,1fr);gap:12px}
#practice-panel.pr-room .pr-shortcuts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;min-width:0}
#practice-panel.pr-room .pr-shortcuts button{position:relative;min-height:64px;padding:9px 34px 9px 14px;text-align:left;display:flex;flex-direction:column;justify-content:center;gap:5px;border-color:#ba97db;background:linear-gradient(140deg,#644983,#302440)}
#practice-panel.pr-room .pr-shortcuts small{color:#cfb2e9;font-size:12px;line-height:1}
#practice-panel.pr-room .pr-shortcuts strong{font-size:17px;line-height:1.1}
#practice-panel.pr-room .pr-shortcuts button>span{position:absolute;right:13px;top:50%;transform:translateY(-50%);font-size:28px;color:#fde39f}
#practice-panel.pr-room .pr-strength{grid-template-columns:180px minmax(0,1fr)}
#practice-panel.pr-room .pr-strength label{font-size:16px}
#practice-panel.pr-room .pr-slider button{width:52px;height:52px;min-height:52px}
#practice-panel.pr-room .pr-deck{gap:14px}
#practice-panel.pr-room .pr-deck button{display:grid;grid-template-columns:48px minmax(0,1fr);grid-template-rows:auto auto;align-content:center;text-align:left;gap:6px 12px;padding:12px}
#practice-panel.pr-room .pr-deck button>img,#practice-panel.pr-room .pr-deck button>svg,#practice-panel.pr-room .pr-deck .pr-random{grid-column:1;grid-row:1/3;width:44px!important;height:44px!important;max-height:44px!important}
#practice-panel.pr-room .pr-deck small,#practice-panel.pr-room .pr-deck strong{grid-column:2}
#practice-panel.pr-room .pr-deck small{font-size:12px}
#practice-panel.pr-room .pr-deck strong{font-size:16px}
.pr-picker.pr-setup-picker[open]{grid-template-rows:44px minmax(0,1fr)}
.pr-setup-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:minmax(68px,1fr);gap:14px;min-height:0;overflow:auto;padding:3px 3px 8px;scrollbar-width:thin}
.pr-setup-options button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;min-height:68px;padding:10px}
.pr-setup-options strong{font-size:18px;line-height:1.1}
.pr-setup-options small{font-size:13px}
.pr-option-icon{font-size:25px;line-height:1}
.pr-option-icon img,.pr-option-icon svg{width:30px!important;height:30px!important;object-fit:contain}
@media(max-height:380px){#practice-panel.pr-room .pr-body{gap:10px}#practice-panel.pr-room .pr-editor{padding:10px;gap:8px}#practice-panel.pr-room .pr-deck{gap:10px}#practice-panel.pr-room .pr-deck button{padding:7px;grid-template-columns:36px minmax(0,1fr);column-gap:8px}#practice-panel.pr-room .pr-deck button>img,#practice-panel.pr-room .pr-deck button>svg,#practice-panel.pr-room .pr-deck .pr-random{width:34px!important;height:34px!important}#practice-panel.pr-room .pr-deck strong{font-size:14px}.pr-setup-options{gap:10px}.pr-setup-options button{gap:4px}.pr-setup-options strong{font-size:16px}}
@media(max-width:720px){#practice-panel.pr-room .pr-shortcuts{gap:8px}#practice-panel.pr-room .pr-shortcuts button{padding-left:10px;padding-right:25px}#practice-panel.pr-room .pr-shortcuts strong{font-size:14px}#practice-panel.pr-room .pr-strength{grid-template-columns:130px minmax(0,1fr)}#practice-panel.pr-room .pr-deck button{grid-template-columns:28px minmax(0,1fr);padding:6px;column-gap:5px}#practice-panel.pr-room .pr-deck strong{font-size:12px}#practice-panel.pr-room .pr-deck small{font-size:10px}}
.pr-picker[data-setup-kind=bots] .pr-setup-options{grid-template-columns:repeat(4,minmax(0,1fr))}
.pr-picker[data-setup-kind=arena] .pr-option-icon{display:flex;width:100%;height:50px;align-items:center;justify-content:center;color:#bca4e8}
.pr-picker[data-setup-kind=arena] .pr-option-icon svg{width:100px!important;height:50px!important}

.pr-name-fields{overflow:auto;min-height:0;display:flex;flex-direction:column;gap:12px;touch-action:pan-y}.pr-name-fields p{margin:0}.pr-name-fields label{display:flex;flex-direction:column;gap:5px;font-weight:700}.pr-name-fields input{width:100%;min-height:44px;padding:8px 12px;border:1px solid #ba97db;border-radius:12px;background:#21172f;color:#fde4a7;font:inherit;font-size:16px}.pr-name-fields input:focus-visible{outline:2px solid #fde7ac}.pr-name-fields small{color:#fde39f}

/* Academy training hall, shared by the setup and every choice dialog. */
html body #lobby #practice-panel.pr-room,body .pr-picker{border:2px solid #b49a68;border-radius:22px 10px;background:radial-gradient(ellipse at 50% 0,#57416655,transparent 65%),linear-gradient(#211a32ed,#181322f5),url('art/academy-honors.svg') center/cover;color:#eee0c8;box-shadow:inset 0 0 0 4px #211a3288,inset 0 0 0 5px #d1b98633,0 18px 60px #100a2288}
body .pr-room::backdrop,body .pr-picker::backdrop{background:#110b23cc}
body :is(.pr-room,.pr-picker) button{border:1px solid #b49a68;border-bottom:4px solid #665039;border-radius:12px 6px;background:linear-gradient(#4a3856,#2c233b);color:#f0d8a4;box-shadow:inset 0 0 0 2px #d1b98622,0 3px 8px #100a2255}
body :is(.pr-room,.pr-picker) button:hover{filter:brightness(1.12)}
body :is(.pr-room,.pr-picker) button:focus-visible,body .pr-name-fields input:focus-visible{outline:2px solid #ffe2a6;outline-offset:2px}
body :is(.pr-room,.pr-picker) button[aria-pressed=true],body #practice-panel.pr-room #play-practice{background:linear-gradient(#ead4a1,#bd9960);color:#302139;border-color:#f2dca7;border-bottom-color:#80613d;box-shadow:inset 0 0 0 2px #fff0c344,0 3px 8px #100a2255}
body #practice-panel.pr-room .pr-shortcuts button{background:linear-gradient(120deg,#45324fe8,#261e35);border-color:#b49a68;border-bottom-color:#665039;box-shadow:inset 0 0 0 2px #d1b98622,0 3px 8px #100a2255}
body #practice-panel.pr-room :is(.pr-shortcuts strong,.pr-exit h2),body .pr-picker h2{font-family:Georgia,serif;color:#f0d8a4;text-shadow:0 2px 3px #140b24}
body #practice-panel.pr-room :is(.pr-shortcuts small,.pr-deck small,.pr-strength label span),body .pr-status{color:#ccbcd3}
body #practice-panel.pr-room :is(.pr-shortcuts button>span,.pr-strength output,.pr-edit-mark,.pr-random),body .pr-name-fields small{color:#ffe1a4}
body #practice-panel.pr-room .pr-editor{background:linear-gradient(115deg,#382b43dd,#211a32e8);border-color:#b49a6888;border-radius:18px 8px;box-shadow:inset 0 0 0 3px #d1b98614}
body #practice-panel.pr-room .pr-slider input{accent-color:#d8b779}
body #practice-panel.pr-room .pr-deck button{background:radial-gradient(ellipse at 20% 50%,#70567b33,transparent 75%),linear-gradient(#3e304b,#271f35)}
body .pr-name-fields input{background:#21172e;color:#fff0d7;border-color:#b49a68}
body .pr-picker :is(.pr-setup-options,.pr-name-fields){scrollbar-color:#b49a68 #211a32}
@media(max-height:460px){html body #lobby #practice-panel.pr-room{border-radius:0}}

body #practice-panel #practice-elo::-webkit-slider-runnable-track{border-color:#ad9266;background:linear-gradient(90deg,#dfbf80 0 var(--strength,25%),#252038 var(--strength,25%) 100%)}
body #practice-panel #practice-elo::-moz-range-track{border-color:#ad9266;background:linear-gradient(90deg,#dfbf80 0 var(--strength,25%),#252038 var(--strength,25%) 100%)}
/* Keep the current Mastery identity legible without shrinking the slider. */
body #practice-panel.pr-room .pr-rank{display:flex;align-items:center;gap:7px;min-width:0;line-height:1.15;color:#ecd9ff}
body #practice-panel.pr-room .pr-rank img{width:32px;height:36px;object-fit:contain;flex:none;filter:drop-shadow(0 2px 3px #100a2288)}
body #practice-panel.pr-room .pr-rank b{font-size:12px;overflow-wrap:anywhere}
