/* Operational technology page */
.motion-svg .zl-teal{fill:var(--teal-strong)}

/* IT and OT priorities: the bars swap places when the view changes */
#m-itot .bar{transition:transform .8s cubic-bezier(.4,0,.2,1)}
#m-itot[data-state="ot"] .bar-c{transform:translateY(140px)}
#m-itot[data-state="ot"] .bar-a{transform:translateY(-140px)}
#m-itot .safety{fill:#FFF1F2;stroke:#E11D48;stroke-width:1.5}
#m-itot .safety-t{fill:#9F1239}

/* Purdue explorer: levels listed down the panel */
.motion-states.vertical{flex-direction:column;flex-wrap:nowrap;width:100%}
.motion-states.vertical button{display:flex;justify-content:space-between;align-items:center;gap:12px;text-align:left;white-space:normal;padding:.5rem .8rem}
.motion-states.vertical small{font-size:.78rem;font-weight:500;color:var(--subtle)}
.motion-states.vertical button[aria-pressed="true"] small{color:var(--orange-strong)}
.lvl h3{font-size:1.05rem;margin-bottom:8px}
.lvl dl{margin:0;display:grid;grid-template-columns:118px 1fr;gap:6px 12px;font-size:.88rem}
.lvl dt{font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--subtle);padding-top:2px}
.lvl dd{margin:0;color:var(--text);line-height:1.5}
.purdue .zone.m-hl{stroke-width:3}

/* Counters in the polling comparison */
.motion-note .big{font-family:var(--font-heading);font-size:1.6rem;font-weight:700;line-height:1;color:var(--orange-strong);margin-right:2px}

/* Topic tree */
.uns-explain{margin-top:28px}
.uns-explain > div{min-width:0}
.uns-explain .sub-title{margin-top:0}
.uns-explain pre{margin:14px 0 0;padding:16px 18px;background:var(--navy);color:#E2E8F0;border-radius:var(--radius);overflow:auto;font-size:.82rem;line-height:1.7}

/* Ring simulator */
.ring-link{transition:stroke .3s ease}
#ring-l12.is-cut{stroke:#E11D48;stroke-dasharray:6 7}
.ring-cut{align-self:flex-start}
.ring-readout{border:1px solid var(--line);border-radius:12px;padding:12px 14px;display:grid;gap:8px}
.ring-name{font-weight:700;color:var(--ink);font-size:.95rem}
.ring-bar{height:8px;border-radius:999px;background:var(--surface-2);overflow:hidden}
.ring-bar span{display:block;height:100%;width:0;background:#E11D48;border-radius:999px}
.ring-bar span.ok{background:var(--teal)}
.ring-readout dl{margin:0;display:grid;grid-template-columns:130px 1fr;gap:4px 10px;font-size:.86rem}
.ring-readout dt{color:var(--subtle);font-weight:600}
.ring-readout dd{margin:0;color:var(--text)}

/* Roadmap timeline */
.rm-dot{fill:#fff;stroke:var(--line-strong);stroke-width:3;transition:fill .3s ease,stroke .3s ease}
.rm-dot.m-hl{fill:var(--orange);stroke:var(--orange)}

@media (max-width:700px){
  .lvl dl,.ring-readout dl{grid-template-columns:1fr}
  .lvl dt{padding-top:6px}
}

/* Phase 2: paired tables, OEE calculator, historian compression */
.ot-tables{gap:24px;margin-top:28px;align-items:start}
.ot-tables .sub-title{margin-top:0}
.ot-tables .table-wrap + .sub-title{margin-top:26px}
.ot-tables .principles{grid-template-columns:minmax(0,1fr)}
@media (max-width:900px){.ot-tables{grid-template-columns:minmax(0,1fr)}}
.ot-lede{max-width:75ch;margin:0 0 18px}
.oee{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:24px;align-items:start}
.oee-form{display:grid;gap:10px}
.oee-row{display:grid;grid-template-columns:1fr 120px;align-items:center;gap:12px;font-size:.92rem}
.oee-row label{color:var(--ink);font-weight:500}
.oee-row input{font:inherit;padding:.45rem .6rem;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);width:100%}
.oee-row input:focus-visible{outline:3px solid var(--orange);outline-offset:1px}
.oee-out td:nth-child(2){font-variant-numeric:tabular-nums;font-weight:600;white-space:nowrap}
@media (max-width:800px){.oee{grid-template-columns:minmax(0,1fr)}.oee-row{grid-template-columns:1fr 110px}}
.sw-raw{fill:var(--subtle)}
.sw-exc{fill:var(--cyan)}
.sw-drop{fill:#CBD5E1}
.sw-arc{fill:var(--orange);stroke:#fff;stroke-width:2}
.sw-line{fill:none;stroke:var(--orange);stroke-width:2.5;stroke-linejoin:round}
.sw-buf{fill:var(--purple);opacity:.75}
