#industries [data-industry-open] { text-align:left; color:var(--ink); cursor:pointer; font:inherit; width:100%; }
#industries .industry-trigger-title { font:700 17px/1.3 var(--display); }
#industries .industry-trigger-copy { font:400 13px/1.6 var(--mono); color:var(--muted); }
#industries .industry-trigger-action { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:10px; padding-top:12px; border-top:1px solid var(--line); color:var(--accent); font:600 11px/1.4 var(--sans); }
#industries .industry-trigger-action span { font-size:17px; }
#industries [data-industry-open]:focus-visible { outline:3px solid var(--accent); outline-offset:4px; }

#industry-dialog { --industry-progress:0; --ix-success:#08754f; --ix-warning:#98620c; --ix-grid:#a4b7d225; width:min(1130px,calc(100% - 40px)); max-width:none; max-height:90dvh; padding:0; border:1px solid var(--line2); border-radius:20px; color:var(--ink); background:var(--surface); box-shadow:0 28px 100px #07142e45; overflow:auto; overscroll-behavior:contain; font:400 14px/1.5 var(--sans); }
#industry-dialog::backdrop { background:#07142db3; backdrop-filter:blur(7px); }
#industry-dialog *, #industry-dialog *::before, #industry-dialog *::after { box-sizing:border-box; }
#industry-dialog :is(button,a):focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
#industry-dialog button { font:600 12px/1.4 var(--sans); cursor:pointer; }
#industry-dialog button:disabled { opacity:.4; cursor:default; }
#industry-dialog .industry-shell { padding:0; }
#industry-dialog .industry-header { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:23px 30px 18px; margin:0; border-bottom:1px solid var(--line); }
#industry-dialog .industry-eyebrow { margin:0 0 5px; color:var(--accent); font:600 10px/1.4 var(--mono); text-transform:uppercase; letter-spacing:.11em; }
#industry-dialog #industry-title { margin:0; font:800 23px/1.2 var(--display); letter-spacing:-.035em; }
#industry-dialog .industry-close { display:flex; align-items:center; justify-content:center; flex-shrink:0; width:36px; height:36px; padding:0; color:var(--muted); background:var(--surface2); border:1px solid var(--line); border-radius:50%; font-size:25px; line-height:1; }
#industry-dialog .industry-close:hover { color:var(--ink); border-color:var(--line2); }
#industry-dialog .industry-introduction { display:flex; align-items:center; justify-content:space-between; gap:28px; padding:25px 30px 20px; }
#industry-dialog #industry-setting { margin:0; max-width:24ch; font:750 27px/1.2 var(--display); letter-spacing:-.04em; }
#industry-dialog #industry-benefit { margin:0; max-width:38ch; color:var(--muted); font-size:13px; line-height:1.7; }
#industry-dialog .industry-stage { margin:0 24px; padding:5px 0; border:1px solid var(--line); border-radius:13px; background:linear-gradient(155deg,var(--surface),var(--surface2)); overflow:hidden; }
#industry-dialog .industry-diagram { display:block; width:100%; height:auto; }
#industry-dialog .industry-stage:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
#industry-dialog .industry-pan-hint { display:none; margin:8px 18px 0; color:var(--faint); font:500 10px/1.5 var(--sans); }
#industry-dialog[data-overflow="true"] .industry-pan-hint { display:flex; align-items:center; justify-content:space-between; gap:8px; }
#industry-dialog .industry-diagram text { font-family:var(--sans); }
#industry-dialog .ix-grid-line { stroke:var(--ix-grid); stroke-width:1; }
#industry-dialog .ix-campus-ground { fill:var(--surface); stroke:var(--line); stroke-width:1; }
#industry-dialog .ix-building { fill:var(--soft); stroke:var(--accent); stroke-width:1.5; }
#industry-dialog .ix-detail { fill:none; stroke:var(--accent); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; opacity:.72; }
#industry-dialog .ix-water { fill:var(--accent); fill-opacity:.19; stroke:var(--accent); stroke-width:1; }
#industry-dialog .ix-wave { fill:none; stroke:var(--accent); stroke-width:2; stroke-linecap:round; opacity:.45; }
#industry-dialog .ix-pipe { fill:none; stroke:var(--accent); stroke-width:5; stroke-linecap:round; opacity:.45; }
#industry-dialog .ix-map-label { fill:var(--ink); font-size:12px; font-weight:600; }
#industry-dialog .ix-endpoint { fill:var(--accent); stroke:var(--surface); stroke-width:3; }
#industry-dialog .ix-endpoint-ring { fill:none; stroke:var(--accent); stroke-width:2; opacity:.25; transition:stroke .3s,opacity .3s; }
#industry-dialog .ix-wire { fill:none; stroke:var(--line2); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; transition:stroke .4s; }
#industry-dialog .ix-packet { fill:var(--accent); opacity:0; }
#industry-dialog[data-playing="true"] .ix-packet { opacity:1; }
#industry-dialog .ix-panel { fill:var(--surface); stroke:var(--line2); stroke-width:1; }
#industry-dialog .ix-console .ix-panel, #industry-dialog .ix-team .ix-panel { transition:stroke .35s,stroke-width .35s; }
#industry-dialog .ix-divider { fill:none; stroke:var(--line); stroke-width:1; }
#industry-dialog .ix-brand-dot { fill:var(--accent); }
#industry-dialog .ix-console-title { fill:var(--ink); font-size:15px; font-weight:800; letter-spacing:-.4px; }
#industry-dialog .ix-small { fill:var(--faint); font-size:9.5px; }
#industry-dialog .ix-person { fill:var(--ink); font-size:11px; font-weight:700; }
#industry-dialog .ix-row { fill:var(--surface2); stroke:var(--line); stroke-width:.7; transition:fill .35s,stroke .35s; }
#industry-dialog .ix-row-label { fill:var(--ink); font-size:9.5px; font-weight:500; }
#industry-dialog .ix-status-dot { fill:var(--accent); transition:fill .35s; }
#industry-dialog .ix-ticket-icon { fill:none; stroke:var(--faint); stroke-width:1.2; stroke-linecap:round; }
#industry-dialog .ix-avatar { fill:var(--soft); }
#industry-dialog .ix-avatar-mark { fill:var(--accent); stroke:var(--accent); stroke-linecap:round; }
#industry-dialog .ix-message { fill:var(--surface2); stroke:var(--line); stroke-width:1; transition:fill .35s; }
#industry-dialog .ix-message-label { fill:var(--ink); font-size:9px; }
#industry-dialog .ix-footnote { fill:var(--faint); font-family:var(--mono); font-size:7px; letter-spacing:.7px; }
#industry-dialog[data-step="0"] .ix-endpoint-ring { opacity:.8; stroke-width:3; }
#industry-dialog[data-step="1"] .ix-wire-source, #industry-dialog[data-step="2"] .ix-wire-source { stroke:var(--ix-warning); stroke-dasharray:5 5; }
#industry-dialog[data-step="1"] .ix-status-dot, #industry-dialog[data-step="2"] .ix-status-dot { fill:var(--ix-warning); }
#industry-dialog[data-step="1"] .ix-signal-row .ix-row, #industry-dialog[data-step="2"] .ix-ticket-row .ix-row { stroke:var(--ix-warning); stroke-width:1.5; }
#industry-dialog[data-step="2"] .ix-console .ix-panel { stroke:var(--accent); stroke-width:2; }
#industry-dialog[data-step="3"] .ix-wire-team { stroke:var(--accent); }
#industry-dialog[data-step="3"] .ix-team .ix-panel { stroke:var(--accent); stroke-width:2; }
#industry-dialog[data-step="3"] .ix-message { fill:var(--soft); stroke:var(--accent); }
#industry-dialog[data-step="4"] .ix-wire, #industry-dialog[data-step="4"] .ix-endpoint-ring { stroke:var(--ix-success); }
#industry-dialog[data-step="4"] .ix-status-dot, #industry-dialog[data-step="4"] .ix-endpoint { fill:var(--ix-success); }
#industry-dialog[data-step="4"] .ix-ticket-row .ix-row { stroke:var(--ix-success); stroke-width:1.5; }

#industry-dialog .industry-steps { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:6px; margin:20px 30px 0; }
#industry-dialog .industry-steps button { position:relative; display:flex; align-items:center; gap:7px; padding:11px 9px 15px; text-align:left; color:var(--faint); border:0; background:transparent; border-radius:6px 6px 0 0; min-height:53px; }
#industry-dialog .industry-steps button:hover { background:var(--surface2); }
#industry-dialog .industry-steps button[aria-current="step"] { color:var(--accent); }
#industry-dialog .industry-step-index { font:500 9px var(--mono); opacity:.8; }
#industry-dialog .industry-steps button i { position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--line); overflow:hidden; }
#industry-dialog .industry-steps button[aria-current="step"] i { background:var(--line2); }
#industry-dialog .industry-steps button[aria-current="step"] i::after { content:""; display:block; width:100%; height:100%; background:var(--accent); transform:scaleX(var(--industry-progress)); transform-origin:left; }
#industry-dialog[data-playing="false"] .industry-steps button[aria-current="step"] i::after { transform:scaleX(1); }
#industry-dialog .industry-narrative { display:flex; gap:22px; padding:22px 30px 17px; min-height:126px; }
#industry-dialog #industry-step-number { flex-shrink:0; padding-top:5px; color:var(--accent); font:500 10px var(--mono); }
#industry-dialog #industry-step-title { margin:0 0 7px; color:var(--ink); font:750 19px/1.3 var(--display); letter-spacing:-.025em; }
#industry-dialog #industry-step-copy { margin:0; color:var(--muted); font-size:12.5px; line-height:1.7; max-width:93ch; }
#industry-dialog .industry-controls { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:6px 30px 20px; }
#industry-dialog .industry-play-controls, #industry-dialog .industry-direction-controls { display:flex; gap:7px; flex-shrink:0; }
#industry-dialog .industry-controls button { color:var(--ink); border:1px solid var(--line2); background:var(--surface); border-radius:7px; padding:8px 11px; min-height:36px; }
#industry-dialog .industry-controls button:hover:not(:disabled) { background:var(--surface2); }
#industry-dialog .industry-controls [data-industry-play] { background:var(--accent); color:var(--accent-ink,#fff); border-color:transparent; min-width:109px; }
#industry-dialog .industry-controls [data-industry-play]:hover:not(:disabled) { background:var(--accent); filter:brightness(1.06); }
#industry-dialog #industry-playback-status { flex:1; margin:0; color:var(--faint); font-size:10px; line-height:1.5; }
#industry-dialog .industry-disclosure { margin:0; padding:16px 30px 20px; border-top:1px solid var(--line); background:var(--ground); color:var(--faint); font-size:10.5px; line-height:1.7; }
#industry-dialog .industry-sr { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
:root[data-theme="dark"] #industry-dialog { --ix-success:#58c79a; --ix-warning:#e2b45c; --ix-grid:#90aace19; }

@media (max-width:760px) {
  #industry-dialog { width:calc(100% - 20px); max-height:94dvh; border-radius:14px; }
  #industry-dialog .industry-header { padding:18px 19px 14px; }
  #industry-dialog #industry-title { font-size:21px; }
  #industry-dialog .industry-introduction { display:block; padding:20px 19px 17px; }
  #industry-dialog #industry-setting { font-size:24px; max-width:30ch; }
  #industry-dialog #industry-benefit { margin-top:10px; max-width:50ch; font-size:12px; }
  #industry-dialog .industry-stage { margin:0 12px; }
  #industry-dialog .industry-diagram { min-width:570px; width:100%; }
  #industry-dialog .industry-stage { overflow-x:auto; }
  #industry-dialog .industry-steps { margin:17px 18px 0; gap:3px; }
  #industry-dialog .industry-steps button { display:block; text-align:center; padding:7px 3px 13px; font-size:9px; min-height:61px; }
  #industry-dialog .industry-step-index { display:block; margin-bottom:5px; }
  #industry-dialog .industry-narrative { gap:11px; padding:20px 19px 14px; min-height:155px; }
  #industry-dialog #industry-step-title { font-size:18px; }
  #industry-dialog #industry-step-copy { font-size:12px; }
  #industry-dialog #industry-step-number { font-size:9px; white-space:nowrap; }
  #industry-dialog .industry-controls { flex-wrap:wrap; padding:5px 19px 18px; gap:12px; }
  #industry-dialog #industry-playback-status { flex-basis:100%; order:3; min-height:15px; }
  #industry-dialog .industry-controls button { font-size:11px; padding:8px 9px; }
  #industry-dialog .industry-disclosure { padding:14px 19px 18px; }
}
@media (max-width:420px) {
  #industry-dialog .industry-play-controls, #industry-dialog .industry-direction-controls { gap:5px; }
  #industry-dialog .industry-controls { gap:8px; }
  #industry-dialog .industry-controls button { padding:8px; font-size:10px; }
  #industry-dialog .industry-controls [data-industry-play] { min-width:97px; }
}
@media (prefers-reduced-motion:reduce) {
  #industries [data-industry-open], #industry-dialog * { scroll-behavior:auto!important; animation:none!important; transition:none!important; }
  #industry-dialog .ix-packet { display:none; }
}
@media(pointer:coarse) {
  #industry-dialog .industry-close { width:44px; height:44px; }
  #industry-dialog .industry-controls button { min-height:44px; }
}
