/* English homepage only. Section color never determines the artwork theme. */
.neutral-company-cube { display:none; }
.workflow-outline { display:block; flex:none; width:64px; height:64px; }
:root:not([data-theme="dark"]) {
 --bg:#fafafa; --ink:#242424; --muted:#606060; --line:#d4d4d4; --white:#fff; --lime:#dedede; --surface:#eee;
 .site-header { background:#fafafaf5; }
 .brand-mark,.brand svg,.brand img,.nav-icon-light,[data-light-art],.workflow-outline { filter:grayscale(1); }
 .development-world,.data-story,.monitoring-story { background:#f5f5f5; border-color:#d1d1d1; }
 .data-story,.monitoring-story { --ink:#242424; --muted:#606060; --line:#ccc; }
 .closing { background:#eee; border-color:#ccc; }
 .closing [data-light-art] { filter:grayscale(1); }
 .hero .environment-story { padding-block:30px; }
 .toolkit-preview-window { height:370px; overflow:clip; isolation:isolate; background:transparent; }
 .toolkit-preview-slide { padding-block:22px; background:transparent; animation:none; }
 .toolkit-preview-slide[hidden] { display:none!important; }
 .toolkit-preview-controls button[aria-pressed="true"] { background:#262626; color:#fff; border-color:#262626; }
 .toolkit-preview-controls button { transition:background-color .15s,color .15s; }
 .slide-company-diagram { height:300px; grid-template-rows:1fr auto; min-height:0; }
 .slide-company-diagram>[data-light-art],.slide-company-diagram>.arcade-art { display:none!important; }
 .slide-company-diagram>.neutral-company-cube { display:block; height:262px; width:100%; max-width:390px; justify-self:center; }
 .company-diagram-caption { color:#333; }
 .company-diagram-caption span { color:#666; }
 .local-explanation .workflow-outline { width:38px; height:54px; }
 .simulation-story { background:#242424; border-color:#454545; --ink:#f4f4f4; --muted:#c3c3c3; --line:#606060; }
 .simulation-story .section-heading>p:last-child,.simulation-story .entity-grid p { color:#c3c3c3; }
 .simulation-story .entity-grid,.simulation-story .entity-grid>li { border-color:#505050; }
 .simulation-story [data-light-art] [stroke]:not([stroke="none"]) { stroke:#f1f1f1; }
 .simulation-story [data-light-art] [fill]:not([fill="none"]) { fill:#bcbcbc; }
 .simulation-story .arcade-art,.simulation-story .pixel-art,.pixel-art,.arcade-art { display:none!important; }
 .simulation-story [data-light-art] { display:block; }
 .simulation-scenarios { --muted:#c3c3c3; --line:#606060; }
 /* The full forecast remains visible. Only source/method notes use a disclosure. */
 .simulation-story .simulation-evidence { background:#fafafa; color:#242424; --ink:#242424; --muted:#606060; --line:#d4d4d4; padding:22px 24px; margin-top:22px; }
 .simulation-evidence .evidence-layout { grid-template-columns:.72fr 1.28fr; gap:28px; align-items:center; }
 .simulation-evidence .evidence-copy h3 { font-size:25px; margin:10px 0 12px; }
 .simulation-evidence .evidence-copy>p:not(.eyebrow) { font-size:12px; line-height:1.65; }
 .simulation-evidence .evidence-copy .eyebrow { font-size:9px; }
 .simulation-evidence .effort-total { margin:14px 0; padding:12px 0; }
 .simulation-evidence .effort-total>p:first-child { font-size:64px; line-height:1; color:#242424; }
 .simulation-evidence .effort-total>p:last-child { font-size:12px; }
 .simulation-evidence .evidence-chart { padding:0; color:#242424; }
 .simulation-evidence .evidence-chart figcaption { padding-bottom:8px; }
 .simulation-evidence .evidence-bars { margin-top:12px; }
 .simulation-evidence .evidence-bars li+li { margin-top:14px; }
 .simulation-evidence .evidence-track { height:12px; margin-top:7px; background:#d8d8d8; }
 .simulation-evidence .effort-baseline,.simulation-evidence .legend-baseline { background:#d8d8d8!important; }
 .simulation-evidence .evidence-fill:not(.effort-baseline),.simulation-evidence .legend-simulated { background:#292929!important; }
 .simulation-evidence .effort-saving strong { color:#242424; font-size:24px; }
 .simulation-evidence .effort-direction { stroke:#555; }
 .simulation-evidence .evidence-method { margin-top:14px; }
 .simulation-evidence .effort-legend { margin-top:8px; }
}
/* Each artwork occupies the same transparent stage; all labels remain HTML. */
.connector-constellation,.monitoring-timeline { align-self:center; margin:0; min-width:0; color:#333; }
.constellation-field { position:relative; width:100%; height:280px; max-width:430px; margin:auto; }
.constellation-links { position:absolute; width:100%; height:100%; inset:0; fill:none; stroke:#c4c4c4; stroke-width:1; }
.constellation-links ellipse { stroke-dasharray:3 7; }
.collect-center { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:124px; height:116px; display:flex; flex-direction:column; align-items:center; justify-content:center; border:1px solid #a4a4a4; border-radius:20px; background:#fafafa; box-shadow:0 7px 18px #00000007; }
.collect-center .workflow-outline { width:64px; height:60px; }
.collect-center strong { font-size:13px; line-height:1.2; font-weight:500; }
.collect-center small { font-size:9px; color:#666; margin-top:4px; }
.connector-node { position:absolute; transform:translate(-50%,-50%); display:flex; flex-direction:column; gap:7px; align-items:center; justify-content:center; width:76px; height:69px; border:1px solid #d1d1d1; border-radius:13px; background:#fff; box-shadow:0 3px 10px #00000005; }
.connector-node img { width:27px; height:27px; object-fit:contain; }
.connector-node span { font:9px/1.3 var(--mono); color:#555; }
.connector-0 { left:50%; top:10%; }
.connector-1 { left:84%; top:30%; }
.connector-2 { left:84%; top:73%; }
.connector-3 { left:50%; top:93%; }
.connector-4 { left:16%; top:73%; }
.connector-5 { left:16%; top:30%; }
.connector-constellation>figcaption { font:9px/1.5 var(--mono); text-align:center; color:#666; margin-top:14px; }
.monitoring-timeline { width:100%; max-width:440px; margin-inline:auto; padding:12px 4px; }
.timeline-topline { display:flex; justify-content:space-between; align-items:center; gap:12px; font-size:12px; color:#444; padding-inline:12px; }
.timeline-topline span:last-child { font:9px var(--mono); color:#777; }
.timeline-canvas { position:relative; aspect-ratio:400/235; margin-block:14px 8px; }
.timeline-canvas>svg { width:100%; height:100%; overflow:visible; fill:none; stroke-linecap:round; stroke-linejoin:round; }
.timeline-grid { stroke:#ddd; stroke-width:1; }
.timeline-area { fill:#33333308; }
.timeline-line { stroke:#444; stroke-width:1.7; }
.pattern-region { fill:#3333330b; stroke:#999; stroke-dasharray:3 4; }
.event-stems { stroke:#b7b7b7; stroke-width:1; stroke-dasharray:2 4; }
.event-dots { stroke:#333; stroke-width:1.4; fill:#fff; }
.timeline-highlight { position:absolute; left:49%; top:5%; font:10px/1.3 var(--mono); color:#333; background:#f5f5f5; padding:3px 5px; border-radius:3px; white-space:nowrap; }
.timeline-event { position:absolute; bottom:0; font:9px var(--mono); color:#666; transform:translateX(-50%); }
.event-request { left:16%; }.event-timeout { left:51%; }.event-retest { left:86%; }
.monitoring-timeline>figcaption { display:flex; gap:18px; justify-content:center; color:#666; font:9px var(--mono); margin-top:16px; }
.monitoring-timeline>figcaption span { display:flex; align-items:center; gap:6px; }
.monitoring-timeline i { display:inline-block; width:7px; height:7px; border:1px solid #444; border-radius:50%; }
.monitoring-timeline .legend-pattern { border-radius:2px; border-style:dashed; width:11px; height:11px; }
[data-theme="dark"] .neutral-company-cube { display:none; }
@media(max-width:900px){
 :root:not([data-theme="dark"]) { .toolkit-preview-window { height:410px; } }
 .connector-node { width:64px; height:62px; }
 .connector-node img { width:25px; height:25px; }
 .collect-center { width:106px; height:106px; }
 .constellation-field { height:270px; }
}
@media(max-width:640px){
 :root:not([data-theme="dark"]) {
  .toolkit-preview-window { height:610px; }
  .toolkit-preview-slide { grid-template-rows:auto 300px; gap:14px; padding-block:20px; }
  .slide-company-diagram { height:290px; }
  .slide-company-diagram>.neutral-company-cube { height:245px; }
  .simulation-story .simulation-evidence { padding:20px 18px; }
  .simulation-evidence .evidence-layout { grid-template-columns:1fr; gap:22px; }
  .simulation-evidence .evidence-copy h3 { font-size:24px; }
  .simulation-evidence .effort-total>p:first-child { font-size:62px; }
  .simulation-evidence .evidence-bars li+li { margin-top:16px; }
  .simulation-evidence .effort-saving strong { font-size:25px; }
  .simulation-evidence .evidence-track { height:13px; }
  .simulation-evidence .evidence-chart { padding:0; }
  .computer-toolbar .workflow-outline,.signal-board-heading .workflow-outline { width:48px; height:48px; }
 }
 .constellation-field { height:255px; }
 .connector-node { width:62px; height:60px; }
 .collect-center { width:98px; height:100px; }
 .collect-center .workflow-outline { width:54px; height:52px; }
 .collect-center small { font-size:8px; }
 .connector-constellation>figcaption { font-size:8px; margin-top:17px; }
 .monitoring-timeline { padding-inline:0; }
 .timeline-highlight { font-size:8px; }
 .timeline-topline { padding-inline:0; }
 .timeline-event,.monitoring-timeline>figcaption { font-size:8px; }
 .monitoring-timeline>figcaption { gap:10px; }
}
@media(max-width:360px){
 :root:not([data-theme="dark"]) { .toolkit-preview-window { height:660px; } }
 .connector-node { width:54px; height:55px; }
 .connector-node img { width:23px; height:23px; }
 .connector-node span { font-size:8px; }
 .collect-center { width:90px; height:94px; }
 .timeline-topline span:last-child { font-size:8px; }
}
@media(prefers-reduced-motion:reduce){ .toolkit-preview-controls button { transition:none; } }
