.cleaning-sim{border:1px solid var(--line);border-radius:var(--radius-lg);padding:clamp(16px,3vw,32px);background:var(--paper);color:var(--ink)}.cleaning-sim-toolbar{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}.cleaning-sim-toolbar p{margin:0;font-size:16px;font-weight:600}.cleaning-sim-actions{display:flex;gap:8px;flex-wrap:wrap}.cleaning-sim-actions .button{min-height:44px;font-size:14px}.cleaning-sim-actions button:disabled{opacity:.65;cursor:default}.cleaning-sim-map{margin-top:24px;background:var(--surface);border-radius:var(--radius);overflow-x:auto}.cleaning-sim-map svg{display:block;width:100%;min-width:600px;height:auto}.sim-zone{--robot-color: var(--brand)}.sim-zone-2{--robot-color: var(--navy)}.sim-zone-3{--robot-color: #735b88}.sim-floor{fill:var(--paper);stroke:var(--line);stroke-width:3}.sim-zone-label{fill:var(--ink);font-size:18px;font-weight:600}.sim-divider{stroke:var(--line);stroke-dasharray:5 7}.sim-route{fill:none;stroke:var(--line);stroke-width:2;stroke-dasharray:4 6}.sim-cleaned{fill:none;stroke:var(--robot-color);stroke-width:28;opacity:.22;stroke-linejoin:round;stroke-linecap:round}.sim-obstacle{fill:var(--soft);stroke:var(--muted);stroke-width:2}.sim-obstacle-mark{stroke:var(--muted);stroke-width:2;fill:none}.sim-dock-route{stroke:var(--line);stroke-width:2;stroke-dasharray:3 5;fill:none}.sim-dock rect{fill:var(--surface);stroke:var(--muted);stroke-width:2}.sim-dock path{fill:none;stroke:var(--muted);stroke-width:2}.sim-dock.is-charging rect{fill:var(--robot-color)}.sim-dock text{fill:var(--ink);font-size:15px;font-weight:600}.sim-robot circle{fill:var(--robot-color);stroke:var(--paper);stroke-width:3}.sim-robot path{fill:none;stroke:var(--paper);stroke-width:2}.sim-robot .sim-direction{stroke:var(--robot-color)}.sim-robot text{fill:var(--paper);font-size:12px;font-weight:700}.cleaning-sim-key{display:flex;gap:12px 24px;flex-wrap:wrap;padding:16px 0;color:var(--muted);font-size:13px}.cleaning-sim-key span{display:inline-flex;gap:8px;align-items:center}.cleaning-sim-key i{display:inline-block;width:20px;height:12px}.sim-key-cleaned{background:var(--brand);opacity:.3;border-radius:3px}.sim-key-route{border-top:2px dashed var(--muted);transform:translateY(5px)}.sim-key-obstacle{background:var(--soft);border:1px solid var(--muted)}.cleaning-sim-timeline{padding:16px 0;border-block:1px solid var(--soft)}.cleaning-sim-timeline label{display:flex;justify-content:space-between;gap:12px;font-size:14px;font-weight:600}.cleaning-sim-timeline input{width:100%;min-height:44px;padding:0;accent-color:var(--brand);cursor:pointer}.cleaning-sim-timeline p{margin:0;font-size:13px;color:var(--muted)}.cleaning-sim-fleet{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:0;margin:24px 0;gap:24px;list-style:none}.cleaning-sim-fleet li{display:flex;gap:12px;align-items:center;min-width:0}.cleaning-sim-fleet li:before{display:none}.sim-robot-id{background:var(--robot-color,var(--brand));color:var(--paper);border-radius:50%;padding:10px;font-weight:600;font-size:14px}.cleaning-sim-fleet li>div{display:grid;gap:4px;flex:1}.cleaning-sim-fleet strong{font-size:14px}.cleaning-sim-fleet li>span:last-child,.cleaning-sim-fleet div>span{color:var(--muted);font-size:13px}@media (max-width:600px){.cleaning-sim-fleet{grid-template-columns:1fr;gap:16px}.cleaning-sim-toolbar{gap:16px}.cleaning-sim-actions{width:100%}.cleaning-sim-map{margin-inline:-12px}}.cleaning-sim-mobile-hint{display:none}@media (max-width:700px){.cleaning-sim-mobile-hint{display:block;margin-bottom:0}}.cctv-sim{display:grid;gap:16px;padding:clamp(14px,2vw,22px);border-radius:var(--radius-lg);background:var(--navy);color:var(--on-dark)}.cctv-sim-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px}.cctv-sim-modes{display:flex;padding:3px;border-radius:999px;background:var(--navy-raise);border:1px solid var(--navy-edge)}.cctv-sim-modes button{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:6px 14px;border-radius:999px;font-size:14px;font-weight:600;color:var(--on-dark-muted);transition:background var(--fast),color var(--fast)}.cctv-sim-modes button svg{font-size:18px}.cctv-sim-modes button[aria-pressed=true]{background:#fff;color:var(--ink)}.cctv-sim-ai-toggle{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:6px 10px 6px 14px;border-radius:999px;border:1px solid var(--navy-edge);background:var(--navy-raise);font-size:14px;font-weight:600;color:var(--on-dark)}.cctv-sim-ai-toggle>svg{font-size:18px;color:var(--on-dark-muted)}.cctv-sim-ai-toggle>i{position:relative;width:38px;height:22px;border-radius:11px;background:#3a466b;transition:background var(--base)}.cctv-sim-ai-toggle>i:after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform var(--base) var(--ease-out)}.cctv-sim-ai-toggle.is-on>svg{color:var(--violet)}.cctv-sim-ai-toggle.is-on>i{background:var(--brand)}.cctv-sim-ai-toggle.is-on>i:after{transform:translate(16px)}.cctv-sim-playback{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-left:auto}.cctv-sim-playback .button{min-height:46px;padding:10px 18px;font-size:14px;gap:10px}.cctv-sim-playback .button svg{font-size:20px}.cctv-sim-playback .button-secondary{background:var(--navy-raise);color:#fff;border:1px solid var(--navy-edge)}.cctv-sim-playback .button-secondary:hover{background:var(--navy-edge)}.cctv-sim-still{display:inline-flex;align-items:center;gap:10px;font-size:13px;color:var(--on-dark-muted)}.cctv-sim-still button{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--navy-raise);border:1px solid var(--navy-edge);color:var(--on-dark-muted)}.cctv-sim-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:16px;align-items:stretch}.cctv-sim-view{margin:0;min-width:0}.cctv-sim-screen{position:relative;overflow:hidden;aspect-ratio:16/9;border-radius:12px;background:#111933;box-shadow:inset 0 0 0 1px var(--navy-edge)}.cctv-sim-screen>svg:not(.cctv-sim-minimap){position:absolute;top:0;right:0;bottom:0;left:0;display:block;width:100%;height:100%}.cctv-sim-screen:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:repeating-linear-gradient(180deg,rgba(255,255,255,.025) 0 1px,transparent 1px 3px)}.cctv-sim-floorline{stroke:#a97fdc24;stroke-width:1}.cctv-sim-window{fill:#3b4a78;stroke:#4e5c8c}.cctv-sim-door{fill:#141b33;stroke:#4e5c8c}.cctv-sim-roller rect{fill:#2f3a60;stroke:#56629a}.cctv-sim-roller path{stroke:#45507e;stroke-width:2}.cctv-sim-sign{fill:#f3c27b;font-size:12px;font-weight:700;text-anchor:middle;letter-spacing:.06em}.cctv-sim-vline path{stroke:#e0676b;stroke-width:2.5;stroke-dasharray:10 8;opacity:.7}.cctv-sim-vline text{fill:#ff9ea2;font-size:12px;font-weight:700}.cctv-sim-vline.is-hit path{stroke-width:4;opacity:1;filter:drop-shadow(0 0 6px #e0676b)}.cctv-sim-van rect:first-child{fill:#e9ebef}.cctv-sim-van-cab{fill:#cfd5e0}.cctv-sim-van-glass{fill:#3b4a78}.cctv-sim-wheel{fill:#151b2b;stroke:#8d97b5;stroke-width:3}.cctv-sim-pot{fill:#8a5a3c}.cctv-sim-leaves path{fill:#3f8f5f}.cctv-sim-leaves{transform-origin:0 -6px;transform-box:fill-box}.cctv-sim-plant.is-moving .cctv-sim-leaves{animation:cctv-sway .5s ease-in-out infinite alternate}.cctv-sim-person circle,.cctv-sim-person path{fill:#d9dfeb}.cctv-sim-person .cctv-sim-legs{fill:none;stroke:#d9dfeb;stroke-width:9;stroke-linecap:round}.cctv-sim-shadow{fill:#00000059}@keyframes cctv-sway{0%{transform:rotate(-7deg)}to{transform:rotate(7deg)}}.cctv-sim-box{position:absolute;z-index:1;border:2px solid;border-radius:4px;pointer-events:none;transition:left .1s linear,top .1s linear,width .1s linear,height .1s linear;animation:cctv-box-in .3s var(--ease-out)}.cctv-sim-box b{position:absolute;left:-2px;bottom:100%;margin-bottom:3px;padding:1px 7px;border-radius:4px;font-size:12px;font-weight:700;line-height:1.5;white-space:nowrap;color:#0f1528}.cctv-sim-box.is-person{border-color:#c3a0e6;background:#c3a0e614}.cctv-sim-box.is-person b{background:#c3a0e6}.cctv-sim-box.is-face{border-color:#6cc4e8}.cctv-sim-box.is-face b{left:calc(100% + 6px);bottom:auto;top:-2px;margin:0;background:#6cc4e8}.cctv-sim-box.is-vehicle{border-color:#f3b25b;background:#f3b25b14}.cctv-sim-box.is-vehicle b{background:#f3b25b}@keyframes cctv-box-in{0%{opacity:0;transform:scale(1.15)}}.cctv-sim-hud{position:absolute;left:12px;right:12px;top:10px;z-index:2;display:flex;justify-content:space-between;align-items:flex-start;gap:10px;pointer-events:none}.cctv-sim-hud.is-bottom{top:auto;bottom:10px;align-items:flex-end}.cctv-sim-cam,.cctv-sim-rec,.cctv-sim-mode-chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:6px;background:#0a0e1ea8;font-size:12px;font-weight:600;color:#fff;font-variant-numeric:tabular-nums}.cctv-sim-cam i{width:7px;height:7px;border-radius:50%;background:#36c27a}.cctv-sim-rec i{width:8px;height:8px;border-radius:50%;background:#e0676b;animation:cctv-blink 1.2s steps(2) infinite}.cctv-sim-mode-chip svg{font-size:15px;color:var(--violet)}.cctv-sim-mode-chip:not(.is-ai){color:#f3c27b}.cctv-sim-minimap{position:absolute;top:42px;right:12px;z-index:2;width:110px;height:auto;pointer-events:none}.cctv-sim-minimap>rect{fill:#0a0e1eb3;stroke:#fff3}.cctv-sim-mini-fov{fill:#c3a0e633;stroke:#c3a0e699}.cctv-sim-mini-cam{fill:#fff}.cctv-sim-mini-person{fill:#c3a0e6}.cctv-sim-mini-van{fill:#f3b25b}@keyframes cctv-blink{to{opacity:.2}}.cctv-sim-power{display:flex;gap:10px;align-items:flex-start;margin-top:10px;font-size:13px;line-height:1.6;color:var(--on-dark-muted)}.cctv-sim-power svg{flex:none;font-size:18px;color:var(--violet)}.cctv-sim-events{display:flex;flex-direction:column;gap:12px;min-width:0;padding:16px;border-radius:12px;border:1px solid var(--navy-edge);background:var(--navy-raise)}.cctv-sim-events-head{display:flex;justify-content:space-between;align-items:center;gap:10px}.cctv-sim-events-head strong{display:inline-flex;align-items:center;gap:8px;font-size:16px}.cctv-sim-events-head strong svg{font-size:20px;color:var(--violet)}.cctv-sim-events-head span{padding:2px 10px;border-radius:999px;background:var(--navy);font-size:12px;font-weight:700;color:var(--on-dark-muted)}.cctv-sim-search{display:flex;flex-wrap:wrap;gap:6px;padding:6px;border-radius:10px;background:var(--navy);transition:box-shadow var(--base)}.cctv-sim-search.is-live{box-shadow:0 0 0 2px var(--violet)}.cctv-sim-search button{min-height:34px;padding:4px 12px;border-radius:999px;font-size:13px;font-weight:600;color:var(--on-dark-muted)}.cctv-sim-search button[aria-pressed=true]{background:#fff;color:var(--ink)}.cctv-sim-search button:disabled{opacity:.4;cursor:not-allowed}.cctv-sim-log{display:grid;gap:6px;margin:0;padding:0;list-style:none;flex:1;align-content:start}.cctv-sim-log li{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;background:var(--navy);border:1px solid var(--navy-edge);animation:cctv-log-in .35s var(--ease-out)}.cctv-sim-log .is-person{--event:#c3a0e6}.cctv-sim-log .is-face{--event:#6cc4e8}.cctv-sim-log .is-line{--event:#e0676b}.cctv-sim-log .is-vehicle{--event:#f3b25b}.cctv-sim-log .is-motion{--event:#f3c27b}.cctv-sim-log .is-leaves.is-filtered{--event:#56607d;opacity:.6}.cctv-sim-log .is-leaves.is-filtered strong{text-decoration:line-through;text-decoration-color:#fff6}.cctv-sim-log-icon{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:8px;background:color-mix(in srgb,var(--event,#c3a0e6) 18%,var(--navy-raise));color:var(--event,#c3a0e6)}.cctv-sim-log-icon svg{width:20px;height:20px;fill:currentColor}.cctv-sim-log .is-face .cctv-sim-log-icon{background:#6cc4e8}.cctv-sim-log .is-face .cctv-sim-log-icon svg{fill:#0f1528;width:26px;height:26px}.cctv-sim-log-text{display:grid;min-width:0}.cctv-sim-log-text strong{font-size:13px;line-height:1.4}.cctv-sim-log-text small{font-size:11px;color:var(--on-dark-muted);font-variant-numeric:tabular-nums}.cctv-sim-log-empty{font-size:13px;color:var(--on-dark-muted)}.cctv-sim-compare{margin:0;font-size:12px;line-height:1.6;color:var(--on-dark-muted)}@keyframes cctv-log-in{0%{opacity:0;transform:translate(8px)}}.cctv-sim-signal{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.cctv-sim-signal-part{position:relative;min-width:0}.cctv-sim-signal-node{position:relative;display:flex;align-items:center;gap:10px;height:100%;padding:12px;border-radius:12px;border:1px solid var(--navy-edge);background:var(--navy-raise);transition:background var(--base),border-color var(--base)}.cctv-sim-signal-node.is-reached{border-color:#a97fdc73}.cctv-sim-signal-node.is-active{background:var(--brand);border-color:var(--brand);box-shadow:0 12px 26px -14px #693094e6}.cctv-sim-signal-icon{display:grid;place-items:center;flex:none;width:38px;height:38px;border-radius:10px;background:var(--navy);color:var(--violet)}.cctv-sim-signal-node.is-active .cctv-sim-signal-icon{background:#fff;color:var(--brand)}.cctv-sim-signal-node div{display:grid;min-width:0}.cctv-sim-signal-node strong{font-size:14px;line-height:1.35}.cctv-sim-signal-node div span{font-size:12px;line-height:1.45;color:var(--on-dark-muted)}.cctv-sim-signal-node.is-active div span{color:#ffffffd9}.cctv-sim-signal-number{position:absolute;top:8px;right:10px;font-size:11px;font-weight:700;color:var(--on-dark-muted)}.cctv-sim-wire{position:absolute;top:50%;left:100%;z-index:1;width:10px;height:2px;background:var(--navy-edge)}.cctv-sim-wire i{display:block;height:100%;background:var(--violet)}.cctv-sim-wire b{position:absolute;top:-3px;width:8px;height:8px;margin-left:-4px;border-radius:50%;background:#fff;box-shadow:0 0 8px var(--violet)}.cctv-sim-timeline label{display:flex;justify-content:space-between;margin-bottom:8px;font-size:13px;font-weight:600}.cctv-sim-timeline output{color:var(--violet);font-variant-numeric:tabular-nums}.cctv-sim-track{position:relative}.cctv-sim-track input{width:100%;accent-color:var(--violet)}.cctv-sim-ticks{position:absolute;left:8px;right:8px;top:-10px;height:8px;pointer-events:none}.cctv-sim-ticks i{position:absolute;top:0;width:8px;height:8px;margin-left:-4px;border-radius:50%;background:var(--tick)}.cctv-sim-ticks .is-person{--tick:#c3a0e6}.cctv-sim-ticks .is-face{--tick:#6cc4e8}.cctv-sim-ticks .is-line{--tick:#e0676b}.cctv-sim-ticks .is-vehicle{--tick:#f3b25b}.cctv-sim-ticks .is-leaves{--tick:#56607d}.cctv-sim-ticks .is-motion{--tick:#f3c27b}.cctv-sim-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0;padding:0;list-style:none}.cctv-sim-steps button{display:flex;align-items:center;gap:10px;width:100%;height:100%;min-height:48px;padding:8px 12px;border-radius:10px;background:var(--navy-raise);border:1px solid var(--navy-edge);font-size:14px;font-weight:600;text-align:left;transition:background var(--fast),border-color var(--fast)}.cctv-sim-steps button span{display:grid;place-items:center;flex:none;width:26px;height:26px;border-radius:50%;border:1px solid var(--navy-edge);font-size:12px}.cctv-sim-steps button:hover{border-color:var(--violet)}.cctv-sim-steps button[aria-pressed=true]{background:#fff;color:var(--ink);border-color:#fff}.cctv-sim-steps button[aria-pressed=true] span{background:var(--brand);border-color:var(--brand);color:#fff}.cctv-sim-detail h3{margin:0 0 6px;font-size:20px;line-height:1.4;letter-spacing:0;color:#fff}.cctv-sim-detail p{max-width:80ch;margin:0;font-size:15px;line-height:1.7;color:var(--on-dark-muted)}.cctv-sim-note{margin:0;font-size:12px;line-height:1.6;color:#8d97b5}.cctv-sim[data-motion=still] .cctv-sim-rec i,.cctv-sim[data-motion=still] .cctv-sim-plant .cctv-sim-leaves{animation-play-state:paused}@media (prefers-reduced-motion:reduce){.cctv-sim *{animation:none!important;transition:none!important}}@media (max-width:1100px){.cctv-sim-layout{grid-template-columns:1fr}.cctv-sim-log{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}}@media (max-width:850px){.cctv-sim-signal,.cctv-sim-steps{grid-template-columns:repeat(2,minmax(0,1fr))}.cctv-sim-wire{display:none}.cctv-sim-playback{margin-left:0}}@media (max-width:600px){.cctv-sim-hud{left:8px;right:8px;top:6px}.cctv-sim-hud.is-bottom{bottom:6px}.cctv-sim-cam,.cctv-sim-rec,.cctv-sim-mode-chip{font-size:10px;padding:3px 7px}.cctv-sim-minimap{width:72px;top:30px;right:8px}.cctv-sim-box b{font-size:10px;padding:0 5px}.cctv-sim-signal{grid-template-columns:1fr}.cctv-sim-playback,.cctv-sim-playback .button{flex:1}.cctv-sim-toolbar>*{width:100%}.cctv-sim-modes button{flex:1;justify-content:center}.cctv-sim-ai-toggle{justify-content:space-between}}.system-diagram{padding-top:40px}.system-diagram-heading{display:flex;justify-content:space-between;align-items:start;gap:32px;margin-bottom:32px}.system-diagram-heading>div:first-child{max-width:850px}.system-diagram-heading h2{max-width:24ch}.system-diagram-heading p{margin-top:22px;max-width:65ch}.system-view-switch{display:flex;gap:5px;background:var(--soft);padding:5px;border-radius:4px;flex-shrink:0}.system-view-switch button{min-width:62px;min-height:46px;font-size:16px;border-radius:2px}.system-view-switch button[aria-pressed=true]{background:var(--navy);color:#fff}.system-diagram-body{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:40px;align-items:start}.system-diagram-visual{min-width:0;background:#eff2f5}.system-plan{position:relative;height:470px;isolation:isolate}.system-flow-lines{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:visible;z-index:-1}.flow-base,.flow-travel{fill:none;stroke-width:2;vector-effect:non-scaling-stroke}.flow-base{stroke:#bdc7d3}.flow-travel{stroke-dasharray:9 7;opacity:.32;animation:diagram-signal 1.8s linear infinite;animation-play-state:paused}.system-diagram.is-running .flow-travel{animation-play-state:running}.flow-connection.is-current .flow-travel{opacity:1;stroke-width:3}.flow-data .flow-travel{stroke:#276d9d}.flow-control .flow-travel{stroke:#773e9d}.flow-power .flow-travel{stroke:#a36717}.flow-arrow.flow-data{fill:#276d9d}.flow-arrow.flow-control{fill:#773e9d}.flow-arrow.flow-power{fill:#a36717}.system-node{position:absolute;transform:translate(-50%,-50%);width:37%;min-height:140px;padding:18px 12px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;background:#fff;border:2px solid transparent;border-radius:4px;text-align:center;transition:border-color .2s,background .2s}.system-node.is-selected{border-color:var(--brand);background:#faf7fc}.system-node-symbol{display:grid;place-items:center;color:var(--brand);height:48px}.system-node-symbol img{-o-object-fit:contain;object-fit:contain}.system-node-title{font-size:16px;line-height:1.6;font-weight:600;text-wrap:balance}.system-flow-key{display:flex;flex-wrap:wrap;gap:12px 22px;margin:0;padding:18px 24px;list-style:none;background:#e8edf2}.system-flow-key li{font-size:13px;display:flex;gap:8px;align-items:center;line-height:1.6}.system-flow-key i{width:18px;height:3px;background:#276d9d;display:block}.system-flow-key .flow-key-power{background:#a36717}.system-flow-key .flow-key-control{background:#773e9d}.diagram-icon-credit{font-size:13px;padding:12px 24px;color:var(--muted)}.diagram-icon-credit a{text-decoration:underline;text-underline-offset:3px}.system-step-controls{display:flex;justify-content:space-between;align-items:center;gap:16px;font-size:15px;margin-bottom:20px}.diagram-play{background:var(--soft);min-height:44px;padding:10px 14px;font-size:14px;border-radius:4px}.diagram-play:disabled{cursor:default;opacity:1;color:var(--muted)}.system-step-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px}.system-step-list button{display:flex;gap:10px;text-align:left;align-items:center;background:var(--surface);min-height:64px;padding:12px;font-size:14px;line-height:1.55;width:100%;height:100%;border-radius:4px}.system-step-list button>span{display:grid;place-items:center;flex-shrink:0;width:26px;height:26px;background:#e2e6ec;color:var(--ink);font-size:13px;border-radius:50%}.system-step-list button[aria-pressed=true]{background:var(--navy);color:#fff}.system-step-list button[aria-pressed=true]>span{background:#fff;color:var(--navy)}.system-step-detail{margin-top:28px;min-height:180px}.system-step-detail h3{line-height:1.4}.system-step-detail p{font-size:17px;margin-top:16px}.system-link-list{margin:18px 0 0;display:grid;gap:14px}.system-link-list div{padding:14px 18px;background:var(--surface)}.system-link-list dt{font-size:13px;line-height:1.6;font-weight:600}.system-link-list dd{font-size:14px;line-height:1.6;margin:5px 0 0;color:var(--muted)}.system-diagram-note{font-size:14px;color:var(--muted);line-height:1.8;margin-top:24px;max-width:1000px}.diagram-fallback{font-size:16px;padding:18px 22px;background:var(--surface);margin-bottom:24px}.system-scene{position:relative;height:470px;background:#172334;overflow:hidden}.system-scene canvas{display:block;width:100%;height:100%;touch-action:pan-y;cursor:grab}.system-scene canvas:active{cursor:grabbing}.scene-marker{position:absolute;display:grid;place-items:center;width:30px;height:30px;background:#fff;color:#172334;border:2px solid #b5c4d7;border-radius:50%;font-size:13px;font-weight:600;transform:translate(-50%,-50%);pointer-events:none}.scene-marker.is-current{background:#a267c4;color:#fff;border-color:#fff}.scene-controls{position:absolute;bottom:14px;left:14px;right:14px;display:flex;align-items:center;justify-content:space-between;gap:8px}.scene-controls>span{font-size:13px;color:#dce6f3}.scene-controls>div{display:flex;gap:5px}.scene-controls button{min-width:42px;min-height:42px;padding:8px 12px;background:#fff;color:#172334;border-radius:4px;font-size:13px}.scene-loading{height:470px;display:grid;place-items:center;font-size:16px;padding:30px;text-align:center;background:#172334;color:#fff}@keyframes diagram-signal{to{stroke-dashoffset:-32}}@media (max-width:1000px){.system-diagram-body{grid-template-columns:1fr;gap:28px}.system-plan,.system-scene,.scene-loading{height:430px}.system-explanation{display:grid;grid-template-columns:1fr 1fr;gap:20px 28px}.system-step-controls{grid-column:1/-1;margin:0}.system-step-list{align-self:start}.system-step-detail{margin:0;min-height:0}.system-link-list{grid-column:1/-1;grid-template-columns:repeat(2,minmax(0,1fr));margin:0}.system-diagram-heading h2{max-width:24ch}}@media (max-width:600px){.system-diagram-heading{display:block}.system-view-switch{margin-top:24px;width:-moz-max-content;width:max-content}.system-diagram-heading h2{font-size:30px}.system-diagram-heading p{font-size:17px}.system-plan,.system-scene,.scene-loading{height:390px}.system-node{width:40%;min-height:135px;padding:14px 8px}.system-node-title{font-size:14px}.system-flow-key{padding:16px;gap:9px 16px}.system-flow-key li{font-size:13px}.system-explanation{display:block}.system-step-controls{margin-bottom:16px}.system-step-list{gap:7px}.system-step-list button{font-size:14px;padding:12px 10px}.system-step-detail{margin-top:24px}.system-step-detail h3{font-size:25px}.system-link-list{display:grid;grid-template-columns:1fr;margin-top:20px}.system-diagram-note{font-size:13px}.scene-controls{left:10px;right:10px}.scene-controls>span{max-width:95px;font-size:13px}.scene-controls button{padding:8px;min-width:40px}.diagram-icon-credit{padding:12px 16px}.system-diagram{padding-top:20px}}@media (prefers-reduced-motion:reduce){.flow-travel{animation:none}.system-node{transition:none}}