/* Bounded panels: only long content lists scroll; navigation never leaves the viewport. */
#preloader{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;background:radial-gradient(ellipse at center,#20323a,#071014 75%);padding:24px;color:#eee2c7;font-family:Atkinson,Arial,sans-serif}#preloader[hidden]{display:none}.load-card{width:min(420px,90vw);text-align:center}.load-card img{display:block;width:100%;height:min(36svh,230px);object-fit:contain}.load-line{display:flex;justify-content:space-between;gap:14px;font-size:15px;font-weight:bold;margin:16px 0 10px}#loadingProgress{display:block;width:100%;height:10px;accent-color:#d64c36}#loadingRetry{margin:15px auto;padding:10px 24px;background:#eee2c7;color:#17252b;border:0;font-size:17px}.load-card small{display:block;margin-top:22px;font-size:14px;letter-spacing:1px}.studio-brand{position:absolute;bottom:7px;left:0;right:0;text-align:center;pointer-events:none;font:400 13px Atkinson,Arial,sans-serif;letter-spacing:1px;color:#c8c6ba}
#intro .main-menu button,#intro .main-menu button:hover,#intro .main-menu button:focus-visible,#intro .main-menu button.menu-active{box-sizing:border-box;border-width:1px;font-weight:400;line-height:1.2;letter-spacing:0;transform:none!important;translate:none!important;scale:1;transition:color .12s,background-color .12s;flex-shrink:0}
#intro .title-stack h1{flex-shrink:0;animation:none;transform:none}
#intro .main-menu button{font:400 24px/1.2 var(--display);height:54px;min-height:54px;padding:10px 20px}
@media(max-height:560px){#intro .main-menu button{font-size:clamp(15px,2.5vw,22px);height:40px;min-height:40px;padding:7px 12px}}
@media(min-height:900px) and (min-width:1800px){#intro .main-menu button{font-size:30px;height:64px;min-height:64px}}
body[data-screen="playing"] header{bottom:12px;right:14px;top:auto;width:210px;justify-content:flex-end;padding:0;height:auto;gap:6px}
body[data-screen="playing"] header .utility{font-size:13px;padding:8px}
body[data-screen="playing"] footer{left:14px;right:240px;bottom:8px;width:auto;padding:4px 0;height:auto;max-width:none}
body[data-screen="playing"] footer .keys{display:flex;flex-wrap:wrap;gap:8px 12px;min-width:0}body[data-screen="playing"] footer .keys>span{font-size:11px;line-height:1.4}body[data-screen="playing"] footer kbd{font-size:11px;padding:3px}
.overlay{max-width:100%;min-width:0}button,select{max-width:100%}
#shopPanel{padding:clamp(10px,2vw,28px);gap:10px 24px;align-items:stretch}
.shop-heading{padding-right:0;min-width:0}.shop-heading h2{margin:0}.shop-heading #wallet{flex-shrink:0}
#shopPanel .shop-browser{height:100%;min-height:0;overflow:hidden;padding:0;gap:8px}
#shopItems{min-height:0;max-height:none;overflow:auto;overscroll-behavior:contain}
.shop-tabs,.shop-purchase{flex-shrink:0}.shop-tabs button{font-size:clamp(13px,1.2vw,18px)}
.shop-purchase .primary{width:100%}.shop-purchase small:empty{display:none}
#helpPanel,#pausePanel,#end{padding:12px;overflow:hidden;align-items:center}
#helpPanel .dialog{display:flex;flex-direction:column;max-height:100%;overflow:hidden;min-height:0;padding:clamp(12px,2vw,28px)}
#helpPanel h2{flex-shrink:0;margin:0 0 10px}.help-copy{min-height:0;overflow:auto;overscroll-behavior:contain;padding-right:8px}
#closeHelp{position:static;flex-shrink:0;margin-top:10px;width:100%}
#pausePanel .dialog{max-height:100%;overflow:auto;padding:16px}#pausePanel h2{margin:0 0 10px}
#end .newspaper{display:flex;flex-direction:column;max-height:100%;overflow:hidden;min-height:0;margin:auto;padding:14px 20px;gap:12px}
.result-copy{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px 20px;min-height:0;overflow:auto;overscroll-behavior:contain}
.result-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;flex-shrink:0}
.newspaper .result-actions button,.newspaper .result-actions #endMenu{grid-column:auto;min-height:46px;font-size:15px;padding:10px;line-height:1.2;white-space:normal}
.newspaper .result-actions .primary{padding-left:34px}.newspaper .result-actions .primary::before{left:5px;width:22px}
#bracketPanel{overflow:hidden;padding:16px}.bracket-content{display:flex;flex-direction:column;min-height:0;max-height:100%;width:min(100%,1000px);margin:auto}
#bracketMatches{min-height:0;overflow:auto;overscroll-behavior:contain}#bracketStart,#bracketBack{flex-shrink:0}#bracketStart{margin-top:12px}
body[data-screen="bracket"] header,body[data-screen="paused"] header{display:none}
@media(orientation:landscape){
 #shopPanel{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);grid-template-rows:auto minmax(0,1fr);grid-template-areas:'heading heading' 'preview shop';overflow:hidden}
 #shopPanel .shop-heading{flex-wrap:nowrap;gap:12px}#shopPanel .shop-heading .back{flex-basis:auto;padding:6px 0}
 #shopPanel .shop-heading h2{font-size:clamp(18px,2.5vw,30px)}.shop-heading #wallet{font-size:clamp(15px,2vw,22px)}
 #shopPanel .shop-item strong{font-size:clamp(13px,1.2vw,17px)}#shopPanel .shop-item small{font-size:12px}
 #selectPanel{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto;grid-template-areas:'heading details' 'preview details' 'roster actions';gap:10px 22px;padding:clamp(10px,2vw,28px);overflow:hidden}
 #selectPanel .fighter-details{min-height:0;max-height:100%;overflow:auto;padding:0;background:transparent;align-self:center}
 #selectPanel .select-actions{grid-template-columns:1fr 1fr}.select-actions .difficulty-label{grid-column:1;min-width:0}.select-actions .customize-link{grid-column:2}
 #selectPanel .select-name{align-self:end;max-width:100%;padding:0}
}
@media(orientation:landscape) and (max-height:560px){
 .title-stack{margin:0;width:min(700px,96vw);height:100%;max-height:100%;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:18px;padding:20px}
 .title-stack h1{margin:0}.title-stack h1 img{max-height:70svh}.main-menu{width:100%;gap:7px}.main-menu button,.main-menu button:first-child{min-height:40px;padding:8px 12px;font-size:clamp(15px,2.5vw,22px)}#loadStatus{grid-column:1/-1;position:absolute;bottom:3px;left:0;right:0}
 body[data-screen="menu"] header{top:3px;right:8px}header .utility{padding:5px 8px;font-size:12px}
 #selectPanel .select-heading h2{font-size:clamp(16px,2.8vw,23px);margin:2px 0}.select-heading>span,.fighter-stats{display:none}
 #selectPanel .back{min-height:28px;padding:4px 0;font-size:14px}.select-name h3{font-size:clamp(19px,3vw,30px);margin:3px 0}.select-name>span{font-size:12px}
 #selectPanel .fighter-details{gap:0}#selectPanel .move-detail{padding:0}#selectPanel .move-detail p{font-size:14px;line-height:1.25;margin:4px 0}.move-detail h3{font-size:18px;margin:4px 0}.move-label,.move-detail small{font-size:12px;letter-spacing:0}
 #selectPanel #roster{gap:4px}#roster button,#roster button[aria-pressed=true]{min-height:36px;padding:4px 7px}#roster strong{font-size:13px;margin:3px 0}#roster small,#roster button>span{display:none}
 #selectPanel .select-actions{gap:5px}.select-actions .difficulty-label{font-size:0;gap:0}.select-actions .difficulty-label select{font-size:13px;min-height:30px;padding:4px}.select-actions .customize-link{font-size:12px;min-height:30px;padding:3px}
 #selectPanel .select-actions #confirmFighter{min-height:38px;padding:7px 14px 7px 35px;font-size:17px}.select-actions .primary::before{width:19px;left:6px;top:4px;bottom:4px}
 #shopPanel{gap:6px 14px}.shop-tabs button{padding:7px 3px;font-size:13px}.shop-item{padding:6px 3px;gap:6px}.item-swatch{width:28px;height:28px}.shop-purchase{padding-top:5px;gap:4px}.shop-purchase>strong{font-size:17px}.shop-purchase .primary{min-height:36px;padding:6px 10px 6px 35px;font-size:16px}.shop-purchase .primary::before{width:20px;top:4px;bottom:4px;left:5px}.shop-purchase small{font-size:11px;min-height:0}
 #helpPanel .dialog{width:min(720px,100%)}.control-list{display:grid;grid-template-columns:1fr 1fr;gap:5px 16px}.control-list>div{gap:6px}.control-list dt,.control-list dd{font-size:13px}.help-copy p{font-size:14px;line-height:1.3}#closeHelp{min-height:36px;padding:6px 40px;font-size:17px}
 #pausePanel .dialog{width:min(500px,100%)}#pausePanel .dialog button{min-height:38px;margin:5px 0;padding:7px 40px;font-size:17px}#pausePanel h2{font-size:25px}
 .bracket-content h2{font-size:24px;margin:5px 0}.bracket-content .eyebrow{font-size:12px}#bracketStart{min-height:38px;padding:6px 40px;font-size:18px;margin-top:6px}
 #end .newspaper{padding:10px;gap:8px}.newspaper .result-actions button{font-size:12px;min-height:38px;padding:6px}.result-actions{gap:6px}.newspaper .paper-masthead{font-size:23px}.newspaper #newsHeadline{font-size:25px}
}
@media(orientation:portrait){.result-actions{grid-template-columns:1fr 1fr}.newspaper .result-actions #endMenu{grid-column:1/-1}}