/* Compact workflow hero; one persistent database and three highlighted nodes. */
.workflow-theatre{width:100%;max-width:none!important;background:#0b1e15;border:1px solid #3f654b;border-radius:13px;overflow:hidden;box-shadow:0 25px 60px #0003}
.wc-top{display:flex;justify-content:space-between;gap:14px;padding:17px 20px;border-bottom:1px solid #2f4937;color:#b6ccb9;font:9px var(--mono);letter-spacing:.04em}.wc-top>span:last-child{font-size:8px;color:#8da58f}
.wc-flow{display:grid;grid-template-columns:1fr 28px 1fr 28px 1fr;align-items:center;padding:20px;background:radial-gradient(#71967b33 1px,transparent 1px);background-size:16px 16px}.wc-flow>div{display:grid;justify-items:center;gap:7px;border:1px solid #36533f;border-radius:8px;padding:13px 6px;background:#10271b;transition:background .4s,border-color .4s,box-shadow .4s}.wc-flow strong{font-size:12px;color:#c7d9c4}.wc-flow i{display:block;font:28px/32px var(--mono);height:32px;color:#a9dfb9}.wc-logo{width:32px;background:url('/assets/refinery-mark.svg') center/28px no-repeat}.wc-flow>.active{background:#234630;border-color:#b0ecc0;box-shadow:0 0 24px #9fe9b220}.wc-flow>.active strong{color:#eff9e8}.wc-wire{height:1px;background:#4d7355;position:relative}.wc-wire:after{content:'';position:absolute;top:-2px;width:7px;height:4px;background:#b4f2c4;animation:wc-packet 2.4s linear infinite}@keyframes wc-packet{from{left:0;opacity:.3}to{left:80%;opacity:1}}.is-paused .wc-wire:after{animation-play-state:paused}
.wc-database{margin:0 20px;border:1px solid #58715a;border-radius:7px;overflow:hidden;background:#e7eddf;color:#25412c}.wc-database header{padding:11px 13px;background:#d4e0cb;display:flex;justify-content:space-between;gap:10px;font:8px var(--mono)}.wc-db-row{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-top:1px solid #bdceb6;font-size:12px}.wc-db-row code{font:13px var(--mono)}.wc-target{background:#fff0c9;transition:background .5s}.wc-target small{display:block;font-size:9px;color:#7b785b;margin-top:4px}.wc-target code{color:#785415;font-size:17px}.wc-target b{font-size:12px}.wc-database footer{padding:9px 13px;font-size:9px;line-height:1.5;background:#193526;color:#d2caa9}.workflow-theatre[data-step="0"] .wc-target{opacity:.5}.workflow-theatre[data-step="3"] .wc-target{background:#ceeacb}.workflow-theatre[data-step="3"] .wc-target code{color:#295a35}
.workflow-theatre .story-stage-area{padding:21px 20px;min-height:190px}.workflow-theatre .story-stage h2{font-size:23px;color:#edf4e7;line-height:1.2;letter-spacing:-.035em}.workflow-theatre .story-explanation{font-size:12px;line-height:1.65;min-height:0;margin:11px 0 13px;color:#b8cbb1}.workflow-theatre .story-visual{animation:none!important;gap:9px}.wc-order,.wc-evidence{font:10px/1.6 var(--mono);color:#b6c9a5}.wc-receipt{padding:11px;border:1px solid #5f956b;border-radius:5px;font:10px/1.7 var(--mono);color:#b8edc3;background:#1b3a25}.workflow-theatre [data-wf-approve]{justify-self:start;border:0;padding:11px 14px;border-radius:5px;background:#b6eac4;color:#17351f;font-size:12px;cursor:pointer}.workflow-theatre [data-wf-approve]:focus-visible{outline:2px solid white;outline-offset:3px}.workflow-theatre [data-wf-approve]:disabled{opacity:.6;cursor:wait}
.wc-controls{display:flex;align-items:center;gap:12px;border-top:1px solid #304c38;padding:0 14px}.wc-controls .story-step-buttons{flex:1}.wc-controls .story-step-buttons button{font-size:10px;padding:12px 3px;min-height:44px}.wc-controls .motion-toggle{margin:0;font-size:10px;white-space:nowrap}.workflow-theatre figcaption{padding:12px 20px;background:#081c11}.workflow-theatre figcaption strong{font-size:11px;line-height:1.6}.workflow-theatre figcaption>span{font-size:9px}
@media(max-width:680px){.wc-top{padding:14px 15px;font-size:8px}.wc-flow{padding:16px 15px;grid-template-columns:1fr 18px 1fr 18px 1fr}.wc-flow>div{padding:10px 5px}.wc-flow strong{font-size:10px}.wc-database{margin-inline:15px}.wc-database header{font-size:7px}.workflow-theatre .story-stage-area{padding:19px 15px;min-height:215px}.workflow-theatre .story-stage h2{font-size:21px}.wc-controls{gap:5px;padding-inline:10px}.wc-controls .story-step-buttons button{font-size:9px}.wc-controls .motion-toggle{font-size:9px}}
@media(prefers-reduced-motion:reduce){.workflow-theatre *,.workflow-theatre *:after{animation:none!important;transition:none!important}}

.wc-cart{width:32px;height:32px;fill:none;stroke:#a9dfb9;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}