/* V1 pública · pulido visual y responsive. No altera el visor ni sus mecánicas. */
:root{--atlas-header:64px;--atlas-left:218px;--atlas-right:318px;--atlas-gap:8px}
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

header{height:var(--atlas-header);padding:8px 18px;gap:16px}
header .brand{font-size:19px;line-height:1;padding-right:18px}
header .brand small{margin-top:4px}
header .header-title{display:flex;align-items:center;white-space:nowrap}
header h1{font-size:21px;line-height:1.1}
header nav{font-size:11px;white-space:nowrap}
.equipment-chooser{min-width:136px;display:block}
.equipment-chooser>span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
.equipment-chooser select{padding:6px 10px}
.header-help{padding:7px 11px}

main{grid-template-columns:var(--atlas-left) minmax(0,1fr) var(--atlas-right);gap:var(--atlas-gap);padding:8px;height:calc(100vh - var(--atlas-header));transition:grid-template-columns .2s ease}
.left,.right{padding:10px}
.left h3,.right h3{font-size:12px;margin:3px 0 8px;letter-spacing:.2px}
.left h3:not(:first-child){padding-top:10px;margin-top:9px}
.left button{padding:6px 8px;font-size:11px;line-height:1.15}
.study-controls{gap:7px;padding-bottom:10px;margin-bottom:10px;font-size:11px}
.study-controls small,.study-note{font-size:10px;line-height:1.35}
.study-controls select,.part-filter{padding:6px}
.part-filter{margin-bottom:6px}
#parts summary{padding:7px 0;font-size:11px}
.environment-controls{margin:8px 0;padding:8px 0}
.environment-controls p{margin:6px 0;font-size:11px}

.right{position:relative;padding-left:13px;transition:padding .2s ease}
.right>h3:first-of-type{margin-left:28px;min-height:22px;display:flex;align-items:center}
.right h2,.info-title{font-size:21px;margin:5px 0 1px}
.subtitle{margin-bottom:8px}
.box,.info-box{padding:9px;margin:6px 0;font-size:12px;line-height:1.35}
.related{margin-top:10px;gap:5px}
.related button,.focus-part,.info-actions button{padding:7px}
.tip{margin-top:10px;padding-top:9px;font-size:10px}
.info-panel-toggle{position:absolute;z-index:7;left:7px;top:8px;width:27px;height:27px;padding:0;border:1px solid #a9c1d1;border-radius:7px;background:#eef6fb;color:#28516d;font:700 21px/1 Segoe UI,Arial;cursor:pointer;transition:background .15s ease,color .15s ease}
.info-panel-toggle:hover,.info-panel-toggle:focus-visible{background:#087fce;color:#fff}
body.info-collapsed main{grid-template-columns:var(--atlas-left) minmax(0,1fr) 38px}
body.info-collapsed .right{padding:0;overflow:hidden}
body.info-collapsed .right>:not(.info-panel-toggle){display:none!important}
body.info-collapsed .info-panel-toggle{left:5px;top:50%;transform:translateY(-50%);height:48px}

.modes{bottom:9px;width:max-content;max-width:calc(100% - 16px);min-height:38px;padding:4px;gap:2px;justify-content:center;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;scrollbar-width:none;border-radius:8px}
.modes::-webkit-scrollbar{display:none}
.modes button,.modes select{flex:0 0 auto;min-height:30px;height:30px;padding:5px 7px!important;font-size:10px;line-height:1;border-radius:4px!important}
.modes select{max-width:118px;padding-right:4px!important}
.modes .dock-status{position:absolute;right:5px;top:-19px;width:auto;max-width:300px;padding:3px 7px;border:1px solid #c5d7e2;border-radius:10px;background:#f7fbfede;color:#526c7c;font-size:9px;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none;box-shadow:0 2px 7px #17354d18}
.environment-caption{bottom:58px}

@media(max-width:1450px){:root{--atlas-left:205px;--atlas-right:292px}.modes button,.modes select{padding-left:6px!important;padding-right:6px!important;font-size:9.5px}.right h2,.info-title{font-size:19px}}
@media(max-width:1100px){:root{--atlas-left:190px;--atlas-right:255px}header nav{display:none}.modes{justify-content:flex-start}.right{display:block}.box,.info-box{font-size:11px}}
@media(max-width:850px){
 :root{--atlas-header:74px}
 body{overflow:auto}header{height:auto;min-height:var(--atlas-header);padding:9px 12px;gap:10px;flex-wrap:wrap}header .brand{font-size:16px}header h1{font-size:17px}header nav{display:none}
 main,body.info-collapsed main{height:auto;min-height:calc(100vh - var(--atlas-header));grid-template-columns:180px minmax(0,1fr);align-items:start;padding:7px;gap:7px}
 .stage{height:700px}.right,body.info-collapsed .right{grid-column:1/-1;padding:10px;overflow:auto}.right>:not(.info-panel-toggle),body.info-collapsed .right>:not(.info-panel-toggle){display:revert!important}.info-panel-toggle{display:none}
 .modes{left:8px;transform:none;width:calc(100% - 16px);max-width:none;justify-content:flex-start}.modes button,.modes select{min-height:36px;height:36px;font-size:10px}
 .modes .dock-status{top:-20px}.environment-caption{bottom:62px}
}
@media(max-width:580px){
 header .brand{border-right:0;padding-right:0}.header-title{flex:1 1 190px}.equipment-chooser{order:3;min-width:126px}.header-help{order:4}
 main,body.info-collapsed main{grid-template-columns:minmax(0,1fr)}.stage{order:1;height:clamp(480px,68svh,620px)}.left{order:2;max-height:none}.right,body.info-collapsed .right{order:3;grid-column:auto}
}