/* Compact-only presentation. Keep source-owned resize and raycasting. */
.compact .controls,.compact #reset,.compact #pause{display:none!important}
.compact main{grid-template-rows:auto minmax(0,1fr);padding-bottom:12px}
.compact #zones{padding:6px;gap:4px;background:linear-gradient(180deg,#254544,#203d3c);border:1px solid #ffffff30;box-shadow:inset 0 1px 0 #ffffff0c,0 2px 5px #163b3a0a;border-radius:15px}
.compact #zones button{min-height:48px;padding:8px 12px;gap:10px;font-size:13px;font-weight:550;letter-spacing:.005em;border:1px solid transparent;border-radius:10px;box-shadow:none;transition:background .14s,border-color .14s}
.compact #zones button:after{display:none;content:none}
.compact #zones b{width:28px;height:28px;min-width:28px;display:grid;place-items:center;border-radius:7px;background:#ffffff06;color:color-mix(in srgb,var(--zone) 80%,#dcebe4)}
.compact #zones svg.ui-icon{width:20px;height:20px;stroke-width:1.65}
.compact #zones button:hover,.compact #zones .zone-active,.compact #zones .zone-selected,.compact #zones button:focus-visible{background:color-mix(in srgb,var(--zone) 10%,#294946);border-color:color-mix(in srgb,var(--zone) 28%,#ffffff12);box-shadow:inset 0 1px 0 #ffffff06}
.compact #zones button:focus-visible{outline:2px solid #e5c791;outline-offset:1px}
.compact header a:last-child{background:#274b46;border-color:#173d3b30;box-shadow:inset 0 1px 0 #ffffff10}
.compact header a:last-child:hover{background:#345b53}
@media(max-width:1050px){.compact #zones button{padding:8px 9px;gap:7px;font-size:12px}}
@media(max-width:600px){.compact main{padding-bottom:8px}.compact #zones{gap:3px;padding:5px;border-radius:13px;justify-content:center}.compact #zones button{min-height:44px;padding:7px 8px;gap:7px;font-size:11px}.compact #zones b{width:24px;height:24px;min-width:24px}}
@media(max-height:450px) and (min-width:601px){.compact main{padding-bottom:5px}.compact #zones{padding:4px}.compact #zones button{min-height:44px;padding:6px 9px}}
@media(prefers-reduced-motion:reduce){.compact #zones button{transition:none}}

/* Preserve explanatory copy without implicit grid rows. */
.compact main{display:flex;flex-direction:column;gap:12px}.compact #zones{align-self:center;flex:none;padding-top:6px}.compact #stage{flex:1;height:auto;min-height:0}.compact .heading{flex:none}.compact .heading h1{font-size:18px;margin:0}.compact .heading small{font-size:9px}.compact .note{flex:none;margin:0;font-size:10px;line-height:1.2}.compact #zones button{white-space:normal;text-align:left}.compact #zones button span{max-width:210px}.compact header{flex:none}.equipment-service #card-title{overflow-wrap:anywhere}.equipment-service #contact-links a{display:inline-flex;min-height:44px;align-items:center;padding:8px 12px}.equipment-service #card-examples{display:grid;gap:8px}.equipment-service .cap-label{display:block;margin-top:22px}
@media(max-height:450px){.compact main{gap:5px}.compact .heading h1{font-size:13px}.compact .heading small{display:none}.compact .note{font-size:8px}}

@media(max-width:360px){.compact #zones{justify-content:center}.compact #zones button{max-width:calc(50% - 2px);flex:0 1 calc(50% - 2px);font-size:10px;gap:5px;padding:6px}.compact #zones button span{min-width:0;overflow-wrap:anywhere}.compact #zones b{flex:none}}
