/* Infrastructure page (#p-infrastructure), round 4. Every rule is scoped under .inner-infrastructure.
   Builds on mish-identity.css (paper reading layout, stage bands, buttons, tags, notes, focus ring) and reads its tokens
   with the identity's own values as fallbacks. Sits after styles.css and showcase.css, so its class rules also override
   the old element rules there (p+p margins, figcaption sizes, the global :focus-visible ring).
   Prefix inf- (the Intelligence port already uses ii-). No infinite CSS animations: the only motion is the film, the
   cable above each scope row and the run, all driven by inner-infrastructure.mjs and all still under reduced motion
   or Pause motion. */

.inner-infrastructure{
  --inf-gutter:var(--mish-gutter,clamp(16px,4vw,56px));
  --inf-max:var(--mish-max,1320px);
  --inf-section:var(--mish-section,clamp(56px,8vw,112px));
  --inf-ease:var(--mish-ease,cubic-bezier(.16,1,.3,1));
  --inf-cable:var(--mish-dur-5,1100ms);
  --inf-sans:var(--mish-font-body,Montserrat,'Avenir Next','Segoe UI',system-ui,sans-serif);
  --inf-mono:var(--mish-font-mono,'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace);
  --inf-label:var(--mish-step-label,clamp(.6875rem,.6643rem + .0952vw,.75rem));
  --inf-small:var(--mish-step-small,clamp(.8125rem,.7893rem + .0952vw,.875rem));
  --inf-body:var(--mish-step-body,clamp(.9375rem,.8911rem + .1905vw,1.0625rem));
  display:block;
  overflow-x:clip;
}
.inner-infrastructure code{font-family:var(--inf-mono);font-weight:500;font-size:.92em;letter-spacing:0;color:var(--mish-text,#251637)}

/* ---------- Intro (paper), with the film beside the copy ----------
   The film plays in the first screen: copy on the left, the film on a small dark stage on the right. Below 1000px the
   film follows the copy. The stage card carries the dark tokens (.mish-stage), so its caption, status line, buttons
   and focus ring read exactly as they did in the dark band. */
.inner-infrastructure .inf-intro{padding-bottom:var(--mish-space-8,64px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);
  gap:var(--mish-space-7,48px) clamp(32px,4vw,64px);align-items:center}
.inner-infrastructure .inf-intro-copy{min-width:0}

/* ---------- Dark bands ---------- */
.inner-infrastructure .inf-band{box-sizing:border-box;padding:var(--inf-section) var(--inf-gutter)}
.inner-infrastructure .inf-band+.inf-band{border-top:1px solid var(--mish-rule,#58466d)}
.inner-infrastructure .inf-band code{color:var(--mish-light,#fbf7ff)}
/* Skill names (read-intake, draft-reply) never break at their hyphen. */
.inner-infrastructure .inf-console code{white-space:nowrap}
.inner-infrastructure .inf-band .mish-kicker{margin-bottom:var(--mish-space-4,16px)}

/* ---------- The film (in the intro) and the scope band: the three parts it assembles ---------- */
.inner-infrastructure .inf-scope-in{max-width:var(--inf-max);margin:0 auto;display:grid;
  grid-template-columns:minmax(0,.8fr) minmax(0,1.3fr);grid-template-areas:"head layers";
  gap:var(--mish-space-6,32px) clamp(32px,5vw,84px);align-items:start}
.inner-infrastructure .inf-scope-head{grid-area:head}
.inner-infrastructure .inf-film{min-width:0;padding:clamp(12px,1.4vw,20px);border-radius:var(--mish-radius-panel,6px)}
.inner-infrastructure .inf-figure{margin:0}
.inner-infrastructure .inf-frame{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--mish-abyss,#100b1d);border:1px solid var(--mish-rule,#58466d);border-radius:var(--mish-radius-panel,6px)}
.inner-infrastructure .inf-frame img,.inner-infrastructure .inf-frame video{display:block;width:100%;height:100%;object-fit:cover}
.inner-infrastructure .inf-frame video{position:absolute;inset:0;transition:opacity var(--mish-dur-3,320ms) ease}
.inner-infrastructure .inf-frame video.static{opacity:0}
.inner-infrastructure .inf-figure figcaption{padding:var(--mish-space-4,16px) 0 0;text-align:left;font:600 var(--inf-small)/1.45 var(--inf-sans);letter-spacing:-.005em;color:var(--mish-light,#fbf7ff)}
.inner-infrastructure .inf-figure figcaption span{display:block;margin-top:6px;font:500 var(--inf-label)/1.4 var(--inf-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mish-dim,#c1b4d0)}
.inner-infrastructure .inf-film-controls{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--mish-space-3,12px) var(--mish-space-4,16px);
  min-height:44px;margin-top:var(--mish-space-4,16px);padding-top:var(--mish-space-3,12px);border-top:1px solid var(--mish-rule,#58466d)}
.inner-infrastructure .inf-film-status{margin:0;max-width:none;font:500 var(--inf-label)/1.4 var(--inf-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mish-muted,#c1b4d0)}
.inner-infrastructure .inf-film-buttons{display:flex;flex-wrap:wrap;gap:var(--mish-space-2,8px)}
.inner-infrastructure .inf-layers{grid-area:layers;list-style:none;margin:0;padding:0}
.inner-infrastructure .inf-layer{position:relative;padding:var(--mish-space-5,24px) 0;border-top:1px solid var(--mish-rule,#58466d)}
.inner-infrastructure .inf-layer:last-child{border-bottom:1px solid var(--mish-rule,#58466d)}
/* The cable: the identity's one motion signature, drawn above each part as the film reaches it. */
.inner-infrastructure .inf-layer::before{content:'';position:absolute;left:0;right:0;top:-1px;height:var(--mish-cable,2px);background:var(--mish-mint,#63d7e3);
  transform-origin:left center;transform:scaleX(1)}
.inner-infrastructure .inf-layer.is-lit::before{transition:transform var(--inf-cable) var(--inf-ease)}
.inner-infrastructure .inf-layer h3{margin:0 0 var(--mish-space-2,8px);color:var(--mish-light,#fbf7ff);transition:color var(--mish-dur-2,180ms) ease}
.inner-infrastructure .inf-layer p{margin:0;color:var(--mish-body,#ded7ea);transition:color var(--mish-dur-2,180ms) ease}
/* The module writes the film's state on the intro (data-inf-film); the scope rows follow it from the band below. */
.inner-infrastructure .inf-intro:is([data-inf-film="playing"],[data-inf-film="paused"]) ~ .inf-scope .inf-layer:not(.is-lit)::before{transform:scaleX(0)}
.inner-infrastructure .inf-intro:is([data-inf-film="playing"],[data-inf-film="paused"]) ~ .inf-scope .inf-layer:not(.is-lit) h3{color:var(--mish-muted,#c1b4d0)}
.inner-infrastructure .inf-intro:is([data-inf-film="playing"],[data-inf-film="paused"]) ~ .inf-scope .inf-layer:not(.is-lit) p{color:var(--mish-dim,#c1b4d0)}

/* ---------- On-site compute band ---------- */
.inner-infrastructure .inf-compute-in{max-width:var(--inf-max);margin:0 auto}
.inner-infrastructure .inf-compute-head{max-width:68ch}
.inner-infrastructure .inf-compute-head .mish-heading{margin-bottom:var(--mish-space-5,24px)}
.inner-infrastructure .inf-compute-head .mish-text+.mish-text{margin-top:var(--mish-space-4,16px)}
.inner-infrastructure .inf-compute-note{margin-top:var(--mish-space-6,32px)}
.inner-infrastructure .inf-rig{margin-top:var(--mish-space-6,32px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);
  gap:var(--mish-space-6,32px) clamp(24px,4vw,56px);align-items:start}

/* The map: the building and the box. Wires and the packet are placed by the module in layout(). */
.inner-infrastructure .inf-map{container:inf-map / inline-size;position:relative;display:flex;flex-direction:column;align-items:center;gap:clamp(20px,2.4vw,32px);padding:12px 0 2px}
.inner-infrastructure .inf-wires{position:absolute;left:0;top:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:0}
.inner-infrastructure .inf-wire{stroke:var(--mish-edge,#9883af);stroke-width:1.5;stroke-linejoin:round;fill:none;transition:stroke var(--mish-dur-2,180ms) ease}
.inner-infrastructure .inf-wire.is-hot{stroke:var(--mish-light,#fbf7ff)}
.inner-infrastructure .inf-building{position:relative;z-index:1;box-sizing:border-box;width:100%;display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));grid-template-areas:"phone server you" "box box box";
  gap:clamp(48px,6vw,88px) var(--mish-space-3,12px);padding:var(--mish-space-6,32px) var(--mish-space-4,16px) var(--mish-space-5,24px);
  border:1px dashed var(--mish-edge,#9883af);border-radius:var(--mish-radius-panel,6px)}
.inner-infrastructure .inf-building-label{position:absolute;left:var(--mish-space-4,16px);top:0;transform:translateY(-50%);margin:0;max-width:none;padding:0 8px;
  background:var(--mish-deep,#180f28);font:500 var(--inf-label)/1.4 var(--inf-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mish-muted,#c1b4d0)}
.inner-infrastructure .inf-node{position:relative;z-index:1;box-sizing:border-box;display:flex;flex-direction:column;gap:3px;min-width:0;padding:10px 12px;
  background:var(--mish-lift,#302047);border:1px solid var(--mish-edge,#9883af);border-radius:var(--mish-radius-control,3px);
  transition:border-color var(--mish-dur-2,180ms) ease}
.inner-infrastructure .inf-node b{font:600 var(--inf-small)/1.3 var(--inf-sans);letter-spacing:-.005em;color:var(--mish-light,#fbf7ff)}
.inner-infrastructure .inf-node span{font:500 var(--inf-label)/1.35 var(--inf-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--mish-muted,#c1b4d0)}
.inner-infrastructure .inf-node[data-inf-node="phone"]{grid-area:phone}
.inner-infrastructure .inf-node[data-inf-node="server"]{grid-area:server}
.inner-infrastructure .inf-node[data-inf-node="you"]{grid-area:you}
.inner-infrastructure .inf-node.is-active{border-color:var(--mish-light,#fbf7ff)}
.inner-infrastructure .inf-node[data-inf-node="you"].is-active{border-color:var(--mish-brass,#ffb16b)}
.inner-infrastructure .inf-node--box{grid-area:box;justify-self:center;width:min(100%,300px);display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:12px;row-gap:3px;align-items:center}
.inner-infrastructure .inf-node--box .inf-boxart{grid-row:1 / span 2}
.inner-infrastructure .inf-boxart{position:relative;display:block;width:44px;height:30px;box-sizing:border-box;border:1px solid var(--mish-edge,#9883af);border-radius:3px;background:var(--mish-deep,#180f28)}
.inner-infrastructure .inf-led{position:absolute;right:5px;top:5px;width:5px;height:5px;border-radius:50%;background:var(--mish-dim,#c1b4d0)}
.inner-infrastructure .inf-node--box.is-busy .inf-led{background:var(--mish-light,#fbf7ff)}
.inner-infrastructure .inf-bars{position:absolute;left:6px;bottom:5px;display:flex;align-items:flex-end;gap:3px;height:15px}
.inner-infrastructure .inf-bars i{display:block;width:3px;height:15px;background:var(--mish-body,#ded7ea);transform-origin:bottom center;transform:scaleY(.35)}
.inner-infrastructure .inf-packet{position:absolute;left:0;top:0;z-index:0;display:block;width:10px;height:10px;margin:-5px 0 0 -5px;background:var(--mish-light,#fbf7ff);opacity:0;pointer-events:none}
.inner-infrastructure .inf-packet[data-on="1"]{opacity:1}
.inner-infrastructure .inf-packet[data-kind="approve"]{background:var(--mish-brass,#ffb16b);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}

/* The console: the box's own log of the run. */
.inner-infrastructure .inf-console{container-type:inline-size;min-width:0;box-sizing:border-box;padding:var(--mish-space-4,16px) var(--mish-space-5,24px) var(--mish-space-3,12px);
  background:var(--mish-abyss,#100b1d);border:1px solid var(--mish-rule,#58466d);border-radius:var(--mish-radius-panel,6px)}
.inner-infrastructure .inf-con-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 12px;padding-bottom:var(--mish-space-3,12px);border-bottom:1px solid var(--mish-rule,#58466d)}
/* The sample label sits beside the console's title, so any crop of the console's head carries it. */
.inner-infrastructure .inf-con-sample{margin-right:auto}
.inner-infrastructure .inf-con-title,.inner-infrastructure .inf-con-status{margin:0;max-width:none;font:500 var(--inf-label)/1.4 var(--inf-mono);letter-spacing:.08em;text-transform:uppercase}
.inner-infrastructure .inf-con-title{color:var(--mish-light,#fbf7ff)}
.inner-infrastructure .inf-con-status{display:inline-flex;flex-wrap:wrap;align-items:center;gap:4px 10px;color:var(--mish-muted,#c1b4d0)}
.inner-infrastructure .inf-con-status b{display:inline-flex;align-items:center;gap:7px;font-weight:500;color:var(--mish-light,#fbf7ff)}
.inner-infrastructure .inf-con-status b::before{content:'';width:6px;height:6px;background:var(--mish-body,#ded7ea)}
.inner-infrastructure .inf-run-controls{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:var(--mish-space-2,8px);min-height:44px;margin-left:auto}
.inner-infrastructure .inf-run-controls[hidden]{display:none}
.inner-infrastructure .inf-con-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 16px;margin:0;padding:var(--mish-space-3,12px) 0;border-bottom:1px solid var(--mish-rule,#58466d)}
.inner-infrastructure .inf-con-meta dt{font:500 var(--inf-label)/1.4 var(--inf-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mish-dim,#c1b4d0)}
.inner-infrastructure .inf-con-meta dd{margin:3px 0 0;font:400 var(--inf-small)/1.45 var(--inf-sans);color:var(--mish-body,#ded7ea)}
.inner-infrastructure .inf-log{list-style:none;margin:0;padding:0}
.inner-infrastructure .inf-step{position:relative;display:grid;grid-template-columns:4.9em 9.5rem minmax(0,1fr);grid-template-areas:"time tag what" "time tag data";
  column-gap:14px;row-gap:5px;padding:12px 0 12px 12px;border-bottom:1px solid var(--mish-rule,#58466d)}
.inner-infrastructure .inf-step:last-child{border-bottom:0}
.inner-infrastructure .inf-step::before{content:'';position:absolute;left:0;top:10px;bottom:10px;width:2px;background:transparent}
.inner-infrastructure .inf-step.is-current::before{background:var(--mish-mint,#63d7e3)}
.inner-infrastructure .inf-step time{grid-area:time;padding-top:5px;white-space:nowrap;font:500 var(--inf-label)/1.4 var(--inf-mono);letter-spacing:.04em;color:var(--mish-dim,#c1b4d0)}
.inner-infrastructure .inf-step .mish-tag{grid-area:tag;justify-self:start;align-self:start}
.inner-infrastructure .inf-what{grid-area:what;margin:0;max-width:none;font:400 var(--inf-small)/1.55 var(--inf-sans);color:var(--mish-body,#ded7ea)}
.inner-infrastructure .inf-data{grid-area:data;justify-self:start;display:inline-flex;align-items:center;gap:7px;margin:0;max-width:none;
  font:500 var(--inf-label)/1.3 var(--inf-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--mish-muted,#c1b4d0)}
.inner-infrastructure .inf-data::before{content:'';flex:none;width:6px;height:6px;background:currentColor}
.inner-infrastructure .inf-data[data-inf-data="wait"]{color:var(--mish-brass,#ffb16b)}
.inner-infrastructure .inf-data[data-inf-data="wait"]::before{width:5px;height:5px;transform:rotate(45deg)}
@container (max-width:34rem){
  .inner-infrastructure .inf-step{grid-template-columns:auto minmax(0,1fr);grid-template-areas:"time tag" "what what" "data data";column-gap:12px}
  .inner-infrastructure .inf-con-meta{grid-template-columns:minmax(0,1fr);gap:6px}
  .inner-infrastructure .inf-con-meta>div{display:grid;grid-template-columns:5.5rem minmax(0,1fr);align-items:baseline;column-gap:10px}
  .inner-infrastructure .inf-con-meta dd{margin:0}
}
@container (max-width:19rem){
  .inner-infrastructure .inf-con-meta>div{grid-template-columns:minmax(0,1fr);row-gap:2px}
}
/* The building's top row stacks when the map is narrow for its text; the wires then run along a bus at the left.
   The container conditions are in rem, the unit this page's text is set in, because showcase.css pins body at 16px
   (so em here would not follow a larger text setting). */
@container inf-map (max-width:19.5rem){
  .inner-infrastructure .inf-map .inf-building{grid-template-columns:minmax(0,1fr);grid-template-areas:"phone" "server" "you" "box";
    row-gap:var(--mish-space-4,16px);padding-left:calc(var(--mish-space-3,12px) + 22px)}
  .inner-infrastructure .inf-map .inf-node--box{justify-self:stretch;width:auto;margin-top:var(--mish-space-4,16px)}
}
/* While the run plays, a line prints left to right. The text is in the DOM all along (clip-path, not display:none). */
.inner-infrastructure .inf-rig[data-inf-run="pending"] .inf-step,
.inner-infrastructure .inf-rig[data-inf-run="playing"] .inf-step[data-state="queued"]{clip-path:inset(0 100% 0 0)}
.inner-infrastructure .inf-rig[data-inf-run="playing"] .inf-step[data-state="printing"]{clip-path:inset(0 calc((1 - var(--inf-print, 0)) * 100%) 0 0)}

/* The ledger: which data stayed and which went out. */
.inner-infrastructure .inf-ledger{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--mish-space-6,32px) clamp(24px,3vw,48px);margin-top:var(--mish-space-7,48px)}
.inner-infrastructure .inf-ledger-h{margin:0;padding-bottom:var(--mish-space-3,12px);border-bottom:1px solid var(--mish-light,#fbf7ff);
  font:500 var(--inf-label)/1.4 var(--inf-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mish-light,#fbf7ff)}
.inner-infrastructure .inf-ledger ul{list-style:none;margin:0;padding:0}
.inner-infrastructure .inf-ledger li{position:relative;padding:10px 0 10px 18px;border-bottom:1px solid var(--mish-rule,#58466d);font:400 var(--inf-small)/1.5 var(--inf-sans);color:var(--mish-body,#ded7ea)}
.inner-infrastructure .inf-ledger li::before{content:'';position:absolute;left:0;top:calc(10px + .75em - 3px);width:6px;height:6px;box-sizing:border-box;background:var(--mish-body,#ded7ea);border:1px solid var(--mish-body,#ded7ea)}
.inner-infrastructure .inf-ledger-col:is([data-inf-ledger="arrives"],[data-inf-ledger="back"]) li::before{background:var(--mish-mint,#63d7e3);border-color:var(--mish-mint,#63d7e3)}
.inner-infrastructure .inf-compute:is([data-inf-run="pending"],[data-inf-run="playing"]) .inf-ledger li:not(.is-lit)::before{background:transparent}

/* ---------- Paper reading sections ---------- */
.inner-infrastructure .inf-read{padding-top:var(--mish-space-8,64px);padding-bottom:0}
.inner-infrastructure .inf-read:has(+ .inf-close){padding-bottom:var(--inf-section)}
.inner-infrastructure .inf-read .mish-read-aside .mish-heading{max-width:14ch}
.inner-infrastructure .inf-read .mish-read-main{padding-top:6px}
.inner-infrastructure .inf-checks{list-style:none;margin:0;padding:0;border-top:1px solid var(--mish-text,#251637)}
.inner-infrastructure .inf-checks li{display:flex;align-items:baseline;gap:14px;padding:var(--mish-space-4,16px) 0;border-bottom:1px solid var(--mish-line,#d8cde4);
  font:400 var(--inf-body)/1.6 var(--inf-sans);color:var(--mish-text,#251637)}
.inner-infrastructure .inf-checks li::before{content:'';flex:none;width:7px;height:7px;background:var(--mish-signal-mark,#006274);transform:translateY(-2px)}
.inner-infrastructure .inf-read .mish-text+.mish-text{margin-top:var(--mish-space-4,16px)}

/* ---------- Closing band ---------- */
.inner-infrastructure .inf-close-in{max-width:var(--inf-max);margin:0 auto;display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--mish-space-6,32px) var(--mish-space-7,48px)}
.inner-infrastructure .inf-close-copy{max-width:62ch}
.inner-infrastructure .inf-close-copy .mish-text{margin-top:var(--mish-space-4,16px)}
.inner-infrastructure .inf-close-contact{margin:var(--mish-space-4,16px) 0 0;max-width:none;font:400 var(--inf-small)/1.7 var(--inf-sans);color:var(--mish-muted,#c1b4d0)}
.inner-infrastructure .inf-close-contact a{white-space:nowrap}

/* ---------- Widths ---------- */
@media (max-width:1079px){
  .inner-infrastructure .inf-rig{grid-template-columns:minmax(0,1fr)}
  .inner-infrastructure .inf-map{max-width:560px;width:100%;margin:0 auto}
}
@media (max-width:999px){
  .inner-infrastructure .inf-intro{grid-template-columns:minmax(0,1fr)}
  .inner-infrastructure .inf-scope-in{grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "layers"}
}
@media (max-width:899px){
  .inner-infrastructure .inf-read{padding-top:var(--mish-space-7,48px)}
  .inner-infrastructure .inf-read .mish-read-aside .mish-heading{max-width:none}
}
@media (max-width:759px){
  .inner-infrastructure .inf-ledger{grid-template-columns:minmax(0,1fr);gap:var(--mish-space-5,24px)}
}
@media (max-width:479px){
  .inner-infrastructure .inf-building{gap:var(--mish-space-7,48px) var(--mish-space-2,8px);padding-left:var(--mish-space-3,12px);padding-right:var(--mish-space-3,12px)}
  .inner-infrastructure .inf-node{padding:8px 9px}
  .inner-infrastructure .inf-console{padding-left:var(--mish-space-4,16px);padding-right:var(--mish-space-4,16px)}
}

/* ---------- Reduced motion: no movement at all; colour changes stay ---------- */
@media (prefers-reduced-motion:reduce){
  .inner-infrastructure .inf-frame video{display:none}
  .inner-infrastructure .inf-layer::before,.inner-infrastructure .inf-layer.is-lit::before,.inner-infrastructure .inf-frame video{transition:none}
}

/* ---------- Forced colours ----------
   Fills are dropped in forced colours, so the markers that carry meaning are redrawn with borders (which the system
   recolours) or with system colours. The words beside each marker say the same thing, so nothing depends on these. */
@media (forced-colors:active){
  .inner-infrastructure .inf-data::before,.inner-infrastructure .inf-con-status b::before{box-sizing:border-box;background:none;border:3px solid currentColor}
  .inner-infrastructure .inf-step.is-current::before{forced-color-adjust:none;background:Highlight}
  .inner-infrastructure .inf-packet,.inner-infrastructure .inf-packet[data-kind]{forced-color-adjust:none;background:Highlight}
  .inner-infrastructure .inf-led{forced-color-adjust:none;background:GrayText}
  .inner-infrastructure .inf-node--box.is-busy .inf-led{background:Highlight}
  .inner-infrastructure .inf-bars i{forced-color-adjust:none;background:CanvasText}
  .inner-infrastructure .inf-layer::before{forced-color-adjust:none;background:CanvasText}
  .inner-infrastructure .inf-node.is-active{outline:2px solid;outline-offset:2px}
  /* The identity's tag markers are fills too; on this page they get the same border glyph. */
  .inner-infrastructure .mish-tag:not(.mish-tag--rules)::before{box-sizing:border-box;background:none;border:3px solid currentColor}
  .inner-infrastructure .inf-wire{stroke:GrayText}
  .inner-infrastructure .inf-wire.is-hot{stroke:Highlight}
}