/* Approved preview: only Panorama, Dictionary and Job types opt into this family. v2 (28-10-2026): renombrada para renovar la caché de 7 días del recurso JSF. */
/* Constitución Visual · Retícula (cabecera de módulo): contenedor de grupo con base space-13 → padding space-21 (space-13 en teléfono);
   cuando el modo Cristal la pinta como tarjeta lleva radio 13. Antes iba a 0 px laterales y el título y los botones tocaban el borde. */
body.ng-system-identity .ng-compact-head{padding:var(--ng-space-md,21px);margin:0 0 var(--ng-space-md,21px);gap:var(--ng-space-md,21px);align-items:center;isolation:auto;border-radius:13px}
body.ng-system-identity .ng-compact-head:after{display:block;width:34px;height:2px;border-radius:2px;background:var(--ui-primary,#537e30);opacity:.75}
body.ng-system-identity .ng-compact-head .ng-module-identity{align-items:flex-start;gap:13px;flex:1 1 350px}
body.ng-system-identity .ng-compact-head .ng-module-symbol{width:36px;height:36px;flex:0 0 36px;margin:0;border:0;border-radius:0;background:transparent;box-shadow:none;transform:none}
body.ng-system-identity .ng-compact-head .ng-module-symbol:before{inset:0;background:var(--ui-primary,#537e30)}
body.ng-system-identity .ng-compact-head h1{font:620 28px/1.25 var(--ui-font,Inter,Arial)!important;letter-spacing:.07em!important;color:var(--ui-ink,#26362d)!important;text-transform:uppercase;overflow-wrap:normal}
body.ng-system-identity .ng-compact-head.ng-module-puestos h1{font-size:30px!important;letter-spacing:-.025em!important;text-transform:none}
body.ng-system-identity .ng-compact-head .ng-module-tagline{font:400 12px/1.55 var(--ui-font,Inter,Arial);color:var(--ui-muted,#63725d)!important;margin:11px 0 0!important}
body.ng-system-identity .ng-compact-head .ng-module-context{font:400 11px/1.5 var(--ui-font,Inter,Arial);color:var(--ui-muted,#63725d);margin:7px 0 0;text-transform:none;letter-spacing:0}
body.ng-system-identity .ng-compact-head.ng-module-panorama .ng-module-symbol{display:grid!important;grid-template-columns:12px 12px;grid-template-rows:12px 12px;gap:5px;width:36px;height:36px;flex:0 0 36px;padding:3px;transform:rotate(-8deg)}
body.ng-system-identity .ng-compact-head.ng-module-panorama .ng-module-symbol:before{display:none}
.ng-compact-head.ng-module-panorama .ng-module-symbol i{background:var(--ui-primary,#537e30);border-radius:3px}.ng-compact-head.ng-module-panorama .ng-module-symbol i:nth-child(2){opacity:.42}.ng-compact-head.ng-module-panorama .ng-module-symbol i:nth-child(3){opacity:.65}.ng-compact-head.ng-module-panorama .ng-module-symbol i:nth-child(4){opacity:.87}
body.ng-system-identity .ng-compact-head .ng-module-actions{gap:9px;flex-wrap:nowrap;width:auto;max-width:100%;align-items:center;justify-content:flex-end}
body.ng-system-identity .ng-compact-head .ng-module-actions :is(a,button,.atlas-create>summary,.ng-compact-more>summary){font:550 12px/1.35 var(--ui-font,Inter,Arial)!important;box-sizing:border-box;min-height:42px;border:1px solid var(--ui-line,#dce3dc)!important;border-radius:10px!important;padding:10px 14px!important;text-decoration:none!important;box-shadow:none!important;text-shadow:none!important;background:#fff!important;color:var(--ui-primary,#537e30)!important;display:inline-flex;align-items:center;justify-content:center;gap:7px;cursor:pointer;white-space:normal}
body.ng-system-identity .ng-compact-head .ng-module-actions :is(.ng-primary-action,.atlas-create>summary){color:white!important;background:var(--ui-primary,#537e30)!important;border-color:var(--ui-primary,#537e30)!important}
body.ng-system-identity .ng-compact-head .ng-primary-action.ui-button{padding:0!important}
body.ng-system-identity .ng-compact-head .ng-primary-action .ui-button-text{font:inherit!important;padding:11px 14px 11px 28px!important}
.ng-compact-head .ng-compact-more{position:relative;flex-shrink:0}
.ng-compact-head .ng-compact-more>summary{list-style:none;user-select:none}.ng-compact-head .ng-compact-more>summary::-webkit-details-marker{display:none}
body.ng-system-identity .ng-compact-head .ng-compact-more[open]>summary{background:var(--ui-wash,#f0f5ea)!important}
.ng-compact-head .ng-compact-menu{position:absolute;right:0;top:calc(100% + 8px);width:240px;max-width:calc(100vw - 40px);box-sizing:border-box;padding:7px;border:1px solid var(--ui-line,#dce3dc);border-radius:13px;background:#fff;box-shadow:0 12px 28px #24372117;z-index:90;display:flex;flex-direction:column;gap:5px}
body.ng-system-identity .ng-compact-head .ng-compact-menu :is(a,button){width:100%!important;min-height:44px;flex:0 0 auto;justify-content:flex-start!important;text-align:left}
.ng-compact-menu>div{display:flex;flex-direction:column;gap:5px}
body.ng-system-identity .ng-compact-head .ng-module-actions :is(a,button,summary):focus-visible{outline:3px solid var(--ui-primary,#537e30)!important;outline-offset:3px}
.ng-compact-head .atlas-create-options{z-index:90;width:240px;max-width:calc(100vw - 40px)}
body.ng-system-identity .ng-compact-head .atlas-create-options a{justify-content:flex-start;padding:12px!important;min-height:44px}
.ng-compact-page .ng-client-mark{display:flex;justify-content:flex-end;margin:-12px 0 12px;min-height:0}
.ng-compact-page .ng-client-mark:empty{display:none}
body.ng-system-identity .ng-compact-page .ng-client-mark img{width:64px!important;height:36px!important;object-fit:contain;max-width:64px!important;border:0;background:transparent}
.ng-compact-page #ng-panorama-explore>summary{display:none}
.ng-compact-page #ng-panorama-explore:not([open]){display:none}
.ng-compact-page #ng-panorama-explore[open]{border:1px solid var(--ui-line,#dce3dc);border-radius:13px;background:var(--ui-wash,#f0f5ea);padding:16px;margin-bottom:18px}
.ng-compact-page .pm-viewbar{margin:10px 0 16px}.ng-compact-page .pm-viewbar p{font-size:12px;color:var(--ui-muted,#63725d)}
/* Preserve the existing grids and their data; align surfaces, text and tactile controls. */
.ng-compact-page :is(.atlas-grid,.ng-roles-board){font-family:var(--ui-font,Inter,Arial)}
body.ng-system-identity .ng-compact-page :is(.atlas-card,.pm-cell,.ng-area-tile){border-radius:12px;box-shadow:none}
body.ng-system-identity .ng-compact-page .ng-open-role-hint{text-decoration:none!important}
body.ng-system-identity .ng-compact-page .ng-open-role{padding:9px 11px;border:1px solid var(--ui-line,#dce3dc);border-radius:10px;background:var(--ui-wash,#f0f5ea);color:var(--ui-primary,#537e30)!important}
body.ng-system-identity .ng-compact-page .ng-structure-invite a{padding:9px 13px;border:1px solid var(--ui-line,#dce3dc);border-radius:10px;background:white;text-decoration:none!important;color:var(--ui-primary,#537e30)!important}
@media(max-width:700px){
 body.ng-system-identity .ng-compact-head{padding:var(--ng-space-sm,13px);gap:var(--ng-space-sm,13px);margin-bottom:var(--ng-space-sm,13px)}
 body.ng-system-identity .ng-compact-head .ng-module-identity{gap:11px;flex-basis:100%;padding:0}
 body.ng-system-identity .ng-compact-head h1{font-size:24px!important;letter-spacing:.055em!important}
 body.ng-system-identity .ng-compact-head.ng-module-puestos h1{font-size:27px!important}
 body.ng-system-identity .ng-compact-head .ng-module-symbol{width:32px;height:32px;flex-basis:32px}
 body.ng-system-identity .ng-compact-head.ng-module-panorama .ng-module-symbol{width:32px;height:32px;flex-basis:32px;grid-template-columns:11px 11px;grid-template-rows:11px 11px;gap:4px}
 body.ng-system-identity .ng-compact-head .ng-module-tagline{margin-top:10px!important;font-size:12px}
 body.ng-system-identity .ng-compact-head .ng-module-context{font-size:10px}
 body.ng-system-identity .ng-compact-head .ng-module-actions{width:100%;justify-content:flex-start!important}
 body.ng-system-identity .ng-compact-head .ng-module-actions :is(a,button,.atlas-create>summary,.ng-compact-more>summary){min-height:44px;font-size:12px!important}
 .ng-compact-head .ng-more-label{display:none}
 .ng-compact-head .ng-compact-more>summary{min-width:44px}
 .ng-compact-head .ng-compact-menu{right:auto;left:0;max-width:calc(100vw - 48px)}
 .ng-compact-head .ng-compact-more{position:static}
 .ng-compact-head .ng-module-actions{position:relative}
 .ng-compact-head .ng-compact-menu{top:calc(100% + 8px)}
 .ng-compact-page .ng-client-mark{margin:-10px 0 14px}
 .ng-compact-page #ng-panorama-explore[open]{padding:12px}
}
@media(max-width:360px){body.ng-system-identity .ng-compact-head h1{font-size:21px!important}.ng-compact-head .ng-module-copy{max-width:calc(100% - 43px)}body.ng-system-identity .ng-compact-head.ng-module-puestos h1{font-size:25px!important}}
@media(prefers-reduced-motion:reduce){.ng-compact-page *{transition:none!important;animation:none!important}}
@media print{.ng-compact-head .ng-module-actions{display:none!important}.ng-compact-head{break-inside:avoid}}
/* Prevent legacy button padding from enlarging this header's primary action. */
body.ng-system-identity .ng-compact-head .ng-module-actions button.ng-primary-action{height:42px!important;min-height:42px!important;padding:0!important}
body.ng-system-identity .ng-compact-head .ng-module-actions button.ng-primary-action .ui-button-text{min-height:0!important;padding:0 16px 0 30px!important;line-height:18px!important}
@media(max-width:700px){
 body.ng-system-identity .ng-compact-head .ng-module-actions button.ng-primary-action{height:44px!important;min-height:44px!important}
 body.ng-system-identity .ng-compact-page .atlas-grid{grid-template-columns:minmax(0,1fr)!important;gap:10px}
 body.ng-system-identity .ng-compact-page .atlas-entry>summary{min-height:85px;padding:16px}
 body.ng-system-identity .ng-compact-page .atlas-title{font-size:14px;line-height:1.4}
 body.ng-system-identity .ng-compact-page .ng-staffing{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;padding:12px!important}
 body.ng-system-identity .ng-compact-page .ng-staffing-label{grid-column:1/-1;max-width:none!important;flex:auto!important}
 body.ng-system-identity .ng-compact-page .ng-staffing .ng-stat{width:auto!important;min-width:0!important;min-height:88px!important;margin:0!important;padding:12px!important}
 body.ng-system-identity .ng-compact-page .ng-staffing .ng-stat>span{font-size:11px!important;line-height:1.4}
 body.ng-system-identity .ng-compact-page .ng-staffing .ng-stat>strong{font-size:24px!important}
}

/* Shared optical rhythm. Fibonacci spacing, with accessible controls kept at 44px. */
body.ng-system-identity .ng-compact-page{
 --ng-space-xs:8px;--ng-space-sm:13px;--ng-space-md:21px;--ng-space-lg:34px;--ng-space-xl:55px;
 box-sizing:border-box!important;width:100%!important;max-width:1440px!important;min-width:0;
 margin:0 auto!important;padding:34px 34px 55px!important;
}
body.ng-system-identity .ng-compact-head{padding:0 0 21px!important;margin:0 0 21px!important;gap:21px!important;min-height:110px;box-sizing:border-box}
body.ng-system-identity .ng-compact-head .ng-module-identity{gap:13px!important;min-width:0;flex:1 1 61.8%}
body.ng-system-identity .ng-compact-head .ng-module-copy{min-width:0}
body.ng-system-identity .ng-compact-head .ng-module-actions{gap:8px!important;flex:0 1 auto}
body.ng-system-identity .ng-compact-head .ng-module-tagline{margin-top:8px!important;font-size:13px!important;line-height:1.618}
body.ng-system-identity .ng-compact-head .ng-module-context{margin-top:8px!important;font-size:12px!important;line-height:1.5}
body.ng-system-identity .ng-compact-head .ng-module-actions :is(a,button,.atlas-create>summary,.ng-compact-more>summary){min-height:44px!important;border-radius:13px!important;padding:8px 13px!important}
body.ng-system-identity .ng-compact-head .ng-module-actions button.ng-primary-action{height:44px!important;min-height:44px!important;padding:0!important}
body.ng-system-identity .ng-compact-page :is(.atlas-grid,.ng-area-tiles){gap:13px!important}
body.ng-system-identity .ng-compact-page .atlas-toolbar{margin:0 0 21px!important;gap:13px}
body.ng-system-identity .ng-compact-page .atlas-entry>summary{padding:13px;gap:8px}
body.ng-system-identity .ng-compact-page .pm-viewbar{margin:0 0 13px}
body.ng-system-identity .ng-compact-page :is(.ng-staffing,.ng-roles-board){margin-left:0!important;margin-right:0!important}
body.ng-system-identity .ng-compact-page .ng-staffing{padding:13px!important;gap:13px!important;border-radius:13px}
body.ng-system-identity .ng-compact-page .ng-journey{margin:21px 0!important;gap:13px}
body.ng-system-identity .ng-compact-page .ng-journey a{display:inline-flex;align-items:center;min-height:44px;padding:8px 13px;border:1px solid var(--ui-line);border-radius:13px;text-decoration:none!important;background:white;color:var(--ui-primary)!important;box-sizing:border-box}
/* One page scroll and one content frame, instead of legacy nested offsets. */
@media screen{
 html:has(.ng-compact-page),body.ng-app-shell:has(.ng-compact-page){height:auto!important;min-height:100%;overflow:auto!important}
 body.ng-global-enabled.ng-app-shell:has(.ng-compact-page) form#frmMenu{display:block!important;height:auto!important;min-height:0!important;position:static!important;overflow:visible!important}
 body.ng-global-enabled.ng-app-shell:has(.ng-compact-page) .ui-layout-center{position:static!important;inset:auto!important;width:100%!important;height:auto!important;min-width:0!important;padding:0!important;border:0!important;overflow:visible!important;box-sizing:border-box}
 body.ng-global-enabled.ng-app-shell:has(.ng-compact-page) .ui-layout-center>.ui-layout-unit-content{height:auto!important;max-height:none!important;padding:0!important;overflow:visible!important;box-sizing:border-box}
}
@media(max-width:1100px){body.ng-system-identity .ng-compact-head .ng-module-identity{flex-basis:340px}}
@media(max-width:900px){body.ng-system-identity .ng-compact-page{padding:21px 21px 55px!important}}
@media(max-width:700px){
 body.ng-system-identity .ng-compact-head{min-height:0;gap:21px!important}
 body.ng-system-identity .ng-compact-head .ng-module-identity{flex-basis:100%;gap:13px!important}
 body.ng-system-identity .ng-compact-head .ng-module-actions{flex-basis:100%}
 body.ng-system-identity .ng-compact-page .atlas-grid{gap:13px!important}
 body.ng-system-identity .ng-compact-page .ng-staffing{gap:8px!important;padding:13px!important}
}
@media(max-width:360px){body.ng-system-identity .ng-compact-page{padding-left:13px!important;padding-right:13px!important}}
@media print{body.ng-system-identity .ng-compact-page{max-width:none!important;padding:0!important}.ng-compact-head{min-height:0!important}}
body.ng-system-identity .ng-compact-page{font-family:var(--ui-font,Inter,Arial,sans-serif)!important}
body.ng-system-identity .ng-compact-head .ng-module-actions button.ng-primary-action:not(.ui-button){padding:8px 13px!important}
@media(max-width:700px){
 /* Keep role names readable; the matrix itself scrolls, never the whole page. */
 body.ng-system-identity .ng-compact-page .pm-map{table-layout:auto}
 body.ng-system-identity .ng-compact-page .pm-map :is(th,td):not(.pm-grade){min-width:144px}
}
body.ng-system-identity .ng-compact-head .ng-module-symbol{box-sizing:border-box}
body.ng-system-identity .ng-compact-head h1{line-height:34px!important}