/* The interactive operating framework. All rules stay inside this panel. */
.system-hero{padding:17px 18px 15px;border-radius:28px;box-shadow:0 18px 55px #25252508,inset 0 1px 0 #fff;background:radial-gradient(ellipse at 10% 15%,#ede9fb55,transparent 55%),radial-gradient(ellipse at 95% 90%,#e5f1e944,transparent 55%),#ffffffa8}
.system-hero .system-panel-head{gap:12px;min-height:25px;font-size:12px;font-weight:550;letter-spacing:-.015em;color:#41413e}
.system-hero .system-replay{display:inline-flex;align-items:center;justify-content:center;gap:5px;flex-shrink:0;min-height:30px;padding:4px 7px;border:0;border-radius:9px;background:transparent;color:#62625c;font-size:10px;font-weight:450;line-height:1.2;white-space:nowrap}
.system-hero .system-replay:hover{background:#eaeae680;color:#363632}
.system-hero .system-replay svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.system-hero .system-replay.is-playing{background:#f0edf7;color:#75618c}
.system-hero .system-scenarios{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;margin-top:9px;padding:3px;border:1px solid #deded780;border-radius:14px;background:#f3f3ef80}
.system-hero .system-scenarios button{min-width:0;min-height:33px;padding:7px 4px;border:1px solid transparent;border-radius:10px;background:transparent;color:#676761;font-size:11px;font-weight:450;line-height:1.25;white-space:nowrap;transition:background .2s,border-color .2s,box-shadow .2s,color .2s}
.system-hero .system-scenarios button:hover{background:#fff9;color:#383835}
.system-hero .system-scenarios button[aria-pressed=true]{background:#fff;border-color:#d5d1df;box-shadow:0 2px 9px #35313c0a;color:#47414d}
.system-hero .system-graph{height:250px;margin-top:12px;isolation:isolate}
.system-hero .system-paper{inset:-4px -2px;background-size:16px 16px;opacity:.65}
.system-hero .system-connections{overflow:visible;pointer-events:none}
.system-hero .sys-path{stroke-width:1.5;transition:opacity .35s,stroke-width .35s,stroke-dashoffset .7s;vector-effect:non-scaling-stroke}
.system-hero .sys-feedback{stroke-width:1;opacity:.7}
.system-hero .sys-path.is-relevant{stroke-width:2;opacity:1}
.system-hero .sys-node{width:44%;height:22%;min-height:0;padding:6px 10px;gap:8px;border-radius:21px;display:flex;align-items:center;justify-content:flex-start;box-shadow:0 5px 14px #38323c08,inset 0 1px 0 #fff;transform:none;animation:none;transition:opacity .3s,transform .3s,background .3s,border-color .3s,box-shadow .3s}
.system-hero[data-system-phase] .sys-node{background:linear-gradient(130deg,#ffffffed,var(--node-tint));border-color:var(--node-border)}
.system-hero[data-system-phase] .sys-node:hover{transform:translateY(-2px);box-shadow:0 9px 20px #38323c10,inset 0 1px 0 #fff}
.system-hero[data-system-phase] .sys-node[aria-pressed=true]{transform:translateY(-2px);background:linear-gradient(130deg,#ffffffe6,var(--node-tint));border-color:var(--node-accent);box-shadow:0 7px 20px #38323c12,0 0 0 2px #ffffffb3,inset 0 1px #fff}
.system-hero[data-system-phase] .sys-node[data-phase]{border-color:var(--node-border)}
.system-hero[data-system-phase] .sys-node[data-phase][aria-pressed=true]{border-color:var(--node-accent)}
.system-hero .sys-node .sys-node-copy{min-width:0}
.system-hero .sys-node strong{font-size:12px;line-height:1.2;font-weight:550;color:#3f3f3c;letter-spacing:-.025em}
.system-hero .sys-node small{display:block;white-space:normal;font-size:11px;line-height:1.2;font-weight:400;color:#63635f;margin-top:3px}
.system-hero .sys-node .sys-icon{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:29px;height:29px;border-radius:11px;border:1px solid #ffffffd9;background:#ffffffac;box-shadow:0 2px 4px #34303c05;color:var(--node-accent)}
.system-hero .sys-icon svg{width:18px;height:18px;stroke-width:1.4}
.system-hero .sys-node i{right:10px;top:9px;width:4px;height:4px;opacity:.7;background:var(--node-accent)}
.system-hero .sys-property,.system-hero .sys-quality{left:15%;width:70%;height:18%;border-radius:28px;justify-content:center;gap:11px;padding:5px 13px}
.system-hero .sys-property{top:0}
.system-hero .sys-pms{left:2%;top:25%}
.system-hero .sys-channels{left:54%;top:25%}
.system-hero .sys-team{left:2%;top:51%}
.system-hero .sys-guest{left:54%;top:51%}
.system-hero .sys-quality{top:81%}
.system-hero .sys-property .sys-icon,.system-hero .sys-quality .sys-icon{width:28px;height:28px;border-radius:50%}
.system-hero[data-mode=scenario] .sys-node.is-dimmed{opacity:.45;transform:none}
.system-hero[data-mode=scenario] .sys-node.is-dimmed:hover,.system-hero[data-mode=scenario] .sys-node.is-dimmed:focus-visible{opacity:1}
.system-hero .system-build-steps{margin-top:7px;padding:3px;border-radius:12px;background:#eeeeea70;border-color:#d9d9d366;gap:4px}
.system-hero .system-build-steps button{min-height:31px;padding:6px 3px;border-radius:9px;font-size:11px;line-height:1.3;color:#6b6b65}
.system-hero .system-build-steps button span{font-size:10px;margin-right:4px;color:inherit;opacity:.7}
.system-hero .sys-description{min-height:116px;margin-top:11px;padding-top:11px;border-color:#d9d9d388}
.system-hero .sys-description strong{display:block;font-size:13px;line-height:1.3;font-weight:550;letter-spacing:-.02em;color:#41413e}
.system-hero .sys-description p{font-size:12px;line-height:1.4;color:#63635f;margin-top:5px;max-width:100%}
.system-hero .sys-deliverables{display:flex;gap:5px 13px;flex-wrap:wrap;padding:0;margin:7px 0 0;list-style:none;color:#63635f}
.system-hero .sys-deliverables li{display:flex;align-items:center;gap:5px;font-size:11px;line-height:1.3;margin:0}
.system-hero .sys-deliverables li:before{content:'';height:4px;width:4px;flex-shrink:0;border-radius:50%;background:#9ca68e}
.system-hero .sys-service-link{display:inline-flex;align-items:center;gap:8px;margin-top:8px;font-size:11px;line-height:1.35;font-weight:550;color:#444740;text-decoration:underline;text-underline-offset:3px;text-decoration-color:#a6ada0}
.system-hero .sys-service-link:hover{text-decoration-color:#444740}
.system-hero .system-footnote{margin-top:9px;font-size:10px;line-height:1.4;color:#70706a;letter-spacing:0}
.system-hero button:focus-visible,.system-hero a:focus-visible{outline:2px solid #706382;outline-offset:3px}
@media(max-width:1100px) and (min-width:1001px){.system-hero{padding-inline:14px}.system-hero .sys-node{padding-inline:8px;gap:6px}.system-hero .sys-node .sys-icon{width:24px;height:24px;border-radius:9px}.system-hero .sys-node small{font-size:10px}.system-hero .system-scenarios button{font-size:10px}.system-hero .system-graph{height:270px}}
@media(max-width:1000px){.system-hero{padding:19px 20px 16px}.system-hero .system-graph{height:270px}.system-hero .sys-description{min-height:108px}}
@media(max-width:600px){.system-hero{padding:15px 12px 14px;border-radius:24px}.system-hero .system-panel-head{font-size:12px;gap:7px}.system-hero .system-replay{font-size:11px;padding-inline:3px}.system-hero .system-scenarios button{font-size:11px;min-height:34px}.system-hero .system-graph{height:260px;margin-top:11px}.system-hero .sys-node{padding:5px 7px;gap:6px;border-radius:19px}.system-hero .sys-node .sys-icon{width:24px;height:24px;border-radius:9px}.system-hero .sys-icon svg{width:16px;height:16px}.system-hero .sys-node strong{font-size:12px}.system-hero .sys-node small{font-size:11px;line-height:1.2}.system-hero .sys-property,.system-hero .sys-quality{border-radius:26px;gap:8px}.system-hero .sys-node i{width:3px;height:3px;right:8px;top:8px}.system-hero .sys-description{min-height:128px}.system-hero .sys-description p{font-size:12px}.system-hero .sys-deliverables{gap:5px 10px}.system-hero .sys-deliverables li{font-size:11px}.system-hero .system-build-steps button{font-size:11px;min-height:32px}.system-hero .system-build-steps button span{font-size:9px}.system-hero .system-footnote{font-size:10px;line-height:1.4}}
@media(prefers-reduced-motion:reduce){.system-hero .sys-node,.system-hero .sys-path,.system-hero button{animation:none!important;transition:none!important}.system-hero[data-system-phase] .sys-node:hover,.system-hero[data-system-phase] .sys-node[aria-pressed=true]{transform:none}}
