.system-toolbar { display:flex; flex-wrap:wrap; justify-content:space-between; gap:1rem; margin-top:2.5rem; }
.system-tabs { display:flex; flex-wrap:wrap; gap:.5rem; }
.system-tabs button, .system-pause { min-height:44px; padding:.6rem 1rem; border:1px solid var(--dark-muted); background:transparent; color:var(--paper); font:inherit; font-size:.8rem; }
.system-tabs button[aria-selected="true"] { background:var(--paper); color:var(--ink); }
.system-diagram { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) minmax(0,1fr); align-items:center; gap:3rem; position:relative; padding:3rem 0 5rem; margin-top:1rem; }
.system-connections { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; fill:none; stroke:var(--orange); stroke-width:1; opacity:.45; }
.system-connections marker { fill:var(--orange); stroke:none; }
.system-current { stroke-dasharray:8 20; animation:system-flow 5s linear infinite; }
.system-station, .system-engine { position:relative; z-index:1; min-width:0; }
.system-station-label { color:var(--dark-muted); font-size:.65rem; letter-spacing:.08em; margin-bottom:1.25rem; }
.system-queue { display:grid; gap:.65rem; }
.system-ticket { display:flex; align-items:center; gap:.75rem; border:1px solid var(--line); background:var(--dark); padding:1rem; }
.system-ticket-icon { color:var(--orange); font-size:1.4rem; }
.system-ticket strong, .system-ticket div > span { display:block; font-size:.8rem; }
.system-ticket div > span { color:var(--dark-muted); font-size:.7rem; }
.system-small-note { color:var(--dark-muted); font-size:.7rem; margin-top:1rem; }
.system-engine { aspect-ratio:1; display:grid; place-items:center; background:var(--dark); border-radius:50%; }
.system-orbit { position:absolute; inset:0; width:100%; height:100%; fill:none; stroke:var(--orange); stroke-width:1.5; }
.system-orbit-track { opacity:.2; }
.system-rotor { transform-origin:150px 150px; animation:system-turn 30s linear infinite; }
.system-engine-copy { text-align:center; padding:2rem; }
.system-engine-copy > span { font-size:.6rem; letter-spacing:.12em; color:var(--dark-muted); }
.system-engine-copy strong { display:block; font-size:clamp(1.25rem,2.5vw,2rem); line-height:1.2; margin:1rem 0; }
.system-engine-copy p { font-size:.75rem; color:var(--dark-muted); }
.system-dots { display:flex; gap:.4rem; justify-content:center; margin-top:1rem; }
.system-dots i { width:5px; height:5px; background:var(--orange); border-radius:50%; }
.system-result { background:var(--paper); color:var(--ink); padding:1.25rem; min-height:190px; }
.system-result-heading { display:flex; justify-content:space-between; font-size:.8rem; font-weight:600; margin-bottom:1.5rem; }
.system-check { color:var(--orange-ink); }
.system-plan-days { display:flex; justify-content:space-between; padding-left:2.5rem; font-size:.5rem; }
.system-lane { position:relative; height:28px; border-bottom:1px solid var(--line); font-size:.6rem; display:flex; align-items:center; }
.system-bar { position:absolute; height:12px; background:var(--orange-ink); left:28%; width:32%; }
.bar-two { left:45%; width:40%; opacity:.7; }.bar-three { left:32%; width:55%; opacity:.45; }
.system-message-label { font-size:.6rem; color:var(--muted); }.system-visual p { font-size:.85rem; margin:.75rem 0; }.system-source-chip { font-size:.65rem; color:var(--orange-ink); }
.system-reply, .system-answer { display:none; }
[data-scenario="requests"] .system-plan, [data-scenario="knowledge"] .system-plan { display:none; }
[data-scenario="requests"] .system-reply, [data-scenario="knowledge"] .system-answer { display:block; }
.system-feedback { position:absolute; bottom:1rem; left:0; right:0; display:flex; justify-content:center; gap:.5rem; font-size:.75rem; color:var(--dark-muted); text-align:center; }
.system-explanation { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:2rem; padding:2rem 0 0; margin:0; list-style:none; border-top:1px solid var(--dark-muted); }
.system-explanation li > span { color:var(--orange); font-size:.65rem; letter-spacing:.08em; }
.system-explanation h3 { font-size:1.15rem; line-height:1.4; margin:.75rem 0; }.system-explanation p { font-size:.85rem; color:var(--dark-muted); }
.system-section.is-paused * { animation-play-state:paused !important; }
@keyframes system-turn { to { transform:rotate(360deg); } } @keyframes system-flow { to { stroke-dashoffset:-112; } }
@media(max-width:1000px) { .system-diagram { gap:1rem; }.system-engine-copy { padding:1.5rem; }.system-ticket { padding:.7rem; } }
@media(max-width:760px) { .system-diagram { grid-template-columns:1fr; gap:2rem; padding-bottom:4rem; }.system-station { width:100%; max-width:420px; margin-inline:auto; }.system-engine { width:min(100%,280px); margin-inline:auto; }.system-connections { display:none; }.system-explanation { grid-template-columns:1fr; }.system-engine-copy strong { font-size:1.7rem; } }
@media(prefers-reduced-motion:reduce) { .system-current, .system-rotor { animation:none; } }

/* Sequential work: intake rolls, a plan forms, and feedback returns. */
.system-inbox { height: 178px; overflow: hidden; mask-image: linear-gradient(transparent, oklch(0% 0 0) 6%, oklch(0% 0 0) 82%, transparent); }
.system-queue { animation: system-intake 9s var(--ease) infinite; }
.system-bar { transform-origin: left; animation: system-plan 9s var(--ease) infinite; }
.bar-two { animation-delay: 0.3s; }.bar-three { animation-delay: 0.6s; }
.system-check, .system-visual > p { animation: system-result 9s ease-out infinite; }
.system-dots i { animation: system-dot 3s ease-in-out infinite; }
.system-dots i:nth-child(2) { animation-delay: 0.4s; }.system-dots i:nth-child(3) { animation-delay: 0.8s; }
.system-section * { animation-play-state: paused; }
.system-section[data-motion="running"] * { animation-play-state: running; }
@keyframes system-intake { 0%, 12% { transform: translateY(0); } 65%, 85% { transform: translateY(-50px); } 100% { transform: translateY(0); } }
@keyframes system-plan { 0%, 15% { transform: scaleX(0.3); opacity: 0.45; } 48%, 90% { transform: scaleX(1); opacity: 1; } 100% { transform: scaleX(0.3); opacity: 0.45; } }
@keyframes system-result { 0%, 25% { opacity: 0.45; } 55%, 100% { opacity: 1; } }
@keyframes system-dot { 0%, 100% { opacity: 0.3; } 50% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
 .system-section *, .system-section[data-motion="running"] * { animation: none !important; transition: none !important; }
 .system-pause { display: none; }
}
@media print { .system-section * { animation: none !important; } .system-pause, .system-tabs { display: none; } }
