/* Oracle EPM page layout (§6.4). Shared components come from components.css and fig.css; page-only classes use the epm- prefix. */

/* E-2 module map: footnote refs sit under the map (a button.fn cannot live inside button.modnode) */
.epm-modmap { max-width: 64rem; }
.epm-modmap .modnode-name sup { font-size: 0.65em; color: var(--accent); margin-left: 0.1em; }
.epm-fns { list-style: none; display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-5); margin: var(--s-8) 0 0; padding: 0; font-family: var(--font-mono); font-size: var(--t-readout); letter-spacing: 0.04em; color: var(--text-2); }
.epm-fns .fn { min-height: 44px; }

/* E-4 figure: capped so the 640-unit drawing stays near its authored scale */
.epm-fig { max-width: 60rem; }
.epm-fig .node-readout { text-transform: none; letter-spacing: 0.02em; }
/* the check inside an application draws when the cost centre arrives, not when the node lights */
.epm-fig [data-node]:not(.epm-ok) .node-check { stroke-dashoffset: var(--len, 40); }
/* the three Human nodes and their routes exist only with governance off */
.epm-fig:not(.epm-manual) .epm-team,
.epm-fig:not(.epm-manual) [data-route^="team"] { opacity: 0; pointer-events: none; }

/* E-5 link */
.epm-link { display: inline-block; font-weight: 500; }

/* E-2: paired modules share a row height (the two lists sit on one subgrid), so the connectors stay
   level; resting connectors are faint crimson rather than near-invisible grey */
.epm-modmap .modlink { stroke: var(--accent-soft); opacity: 0.7; }
/* the hovered or focused module's road turns accent and heavier (§4.4 Module node, §5.3 M21) */
.epm-modmap .modlink.is-lit { stroke: var(--fig-path-lit); stroke-width: 2; opacity: 1; }
@media (min-width: 769px) {
  .epm-modmap { grid-template-rows: repeat(6, auto); row-gap: var(--s-3); }
  .epm-modmap > ul { grid-row: 1 / span 6; grid-template-rows: subgrid; }
  .epm-modmap > ul > li:not(.modmap-col-label) { display: grid; }
  .epm-modmap .modnode { height: 100%; align-content: start; }
}