.pattern-experiment{border:1px solid var(--line,#2d3228);background:#131610;border-radius:6px;margin:32px 0 48px;overflow:hidden}.pe-toolbar{border-bottom:1px solid var(--line,#2d3228);justify-content:space-between;align-items:center;min-height:55px;padding:14px 25px;display:flex}.pe-caption{color:var(--muted,#a3a79b);font-family:var(--mono,monospace);letter-spacing:.04em;align-items:center;gap:10px;font-size:11px;display:flex}.pe-step{color:#a3aa98;margin-left:16px;font-size:11px}.pe-reset{color:var(--muted,#a3a79b);align-items:center;gap:7px;padding:8px 0 8px 15px;font-size:11px;display:flex}.pe-reset:hover{color:var(--accent,#e2cdae)}.pe-reset>span{font-size:18px}.pe-architecture-bar{justify-content:space-between;align-items:center;gap:20px;padding:22px 25px 0;display:flex}.pe-switch{border:1px solid #343c2b;border-radius:4px;gap:3px;padding:3px;display:flex}.pe-switch>button{color:var(--muted,#a3a79b);border-radius:2px;min-height:38px;padding:10px 14px;font-size:11px;line-height:1.4}.pe-switch>button[aria-pressed=true]{color:#202619;background:#e2cdae}.pe-switch>button:hover:not([aria-pressed=true]){color:#eeeee8;background:#232a1d}.pe-switch-note{color:#a1a697;font-size:11px}.pe-canvas{background:radial-gradient(at 50% 45%,#e2cdae05,#0000 65%);padding:24px 22px 16px;position:relative}.pe-premise{text-align:center;color:#a7af9b;margin:3px 0 0;font-size:12px;line-height:1.6}.pe-graph{width:100%;max-height:385px;display:block;overflow:visible}.pe-edge{color:#717a65}.pe-edge>path{fill:none;stroke:currentColor;stroke-width:1.1px}.pe-edge>text{font-size:11px;font-family:var(--mono,monospace);fill:#a6b196}.pe-edge.is-failed{color:#ca8069}.pe-edge.is-failed>text{fill:#e39b84}.pe-edge.is-inactive{opacity:.3}.pe-edge.is-compensating{color:#e2cdae}.pe-message{fill:#e2cdae}.pe-edge.is-failed .pe-message{fill:#ef967e}.pe-node>rect{fill:#272f29;stroke:#48543b;stroke-width:1px}.pe-node-dot{fill:#e2cdae}.pe-node-kind{font-family:var(--mono,monospace);fill:#9ba78c;letter-spacing:1px;font-size:11px}.pe-node-label{font-family:var(--sans,sans-serif);fill:#e6eadd;font-size:12px}.pe-node-detail{font-family:var(--mono,monospace);fill:#aeb89e;font-size:11px}.pe-node.is-failed>rect{stroke:#b57560;fill:#271d15}.pe-node.is-failed .pe-node-dot,.pe-node.is-failed .pe-node-detail{fill:#ef967e}.pe-node.is-active>rect{stroke:#c2d985;fill:#242d1b}.pe-legend{color:#a5af98;font-family:var(--mono,monospace);letter-spacing:.015em;justify-content:center;align-items:center;gap:22px;font-size:11px;display:flex}.pe-legend>span{align-items:center;gap:6px;display:flex}.pe-legend i{background:#e2cdae;border-radius:50%;width:5px;height:5px;display:block}.pe-legend .pe-legend-event{background:#818c70;border-radius:0;width:14px;height:1px}.pe-metrics{border-top:1px solid var(--line,#2d3228);border-bottom:1px solid var(--line,#2d3228);background:#11140e;grid-template-columns:repeat(4,1fr);display:grid}.pe-metrics>div{border-right:1px solid var(--line,#2d3228);padding:21px 25px}.pe-metrics>div:last-child{border-right:0}.pe-metrics span{font-family:var(--mono,monospace);color:#a7ad9d;font-size:11px;line-height:1.5;display:block}.pe-metrics strong{color:#e2cdae;letter-spacing:-.7px;text-transform:capitalize;margin-top:9px;font-size:25px;font-weight:450;display:block}.pe-metrics .is-warning strong{color:#efb58f}.pe-controls{flex-wrap:wrap;gap:10px;padding:24px 25px 0;display:flex}.pe-controls .button{font-size:11px}.pe-failure{margin-left:auto}.pe-observation{grid-template-columns:88px 1fr;align-items:baseline;gap:15px;min-height:78px;padding:25px 25px 12px;display:grid}.pe-observation-label{font-family:var(--mono,monospace);color:#c6d5ad;font-size:11px}.pe-observation p{color:#c0c6b6;margin:0;font-size:12px;line-height:1.7}.pe-caveat{color:#a3ab97;margin:0;padding:0 25px 22px 128px;font-size:11px;line-height:1.7}.pe-mobile-graph{display:none}@media (max-width:1000px){.pe-architecture-bar{flex-direction:column;align-items:flex-start;gap:10px}.pe-switch-note{font-size:11px}.pe-metrics>div{padding:18px}.pe-metrics strong{font-size:21px}.pe-failure{margin-left:0}.pe-legend{gap:14px;font-size:11px}}@media (max-width:640px){.pattern-experiment{margin-top:24px}.pe-toolbar{padding:12px 16px}.pe-caption{gap:7px;font-size:11px}.pe-step{margin-left:3px;font-size:11px}.pe-reset{font-size:11px}.pe-architecture-bar{padding:17px 16px 0}.pe-switch{width:100%}.pe-switch>button{flex:1;min-height:44px;padding:9px 7px;font-size:11px}.pe-canvas{padding:19px 16px 17px}.pe-premise{text-align:left;margin-bottom:20px;font-size:12px}.pe-graph{display:none}.pe-mobile-graph{gap:9px;display:grid}.pe-mobile-node{background:#272f29;border:1px solid #48543b;border-radius:4px;grid-template-columns:1fr auto;gap:5px 10px;padding:13px 15px;display:grid}.pe-mobile-node .pe-mobile-node-type{font-family:var(--mono,monospace);text-transform:uppercase;color:#a5b096;letter-spacing:.1em;grid-column:1/-1;font-size:11px}.pe-mobile-node strong{font-size:12px;font-weight:500;line-height:1.6}.pe-mobile-node>span:not(.pe-mobile-node-type){font-family:var(--mono,monospace);color:#c3cdb5;align-self:center;font-size:11px}.pe-mobile-node>small{color:#a3ad95;grid-column:1/-1;margin-top:4px;font-size:11px;line-height:1.6}.pe-mobile-node.is-failed{background:#271d15;border-color:#b57560}.pe-mobile-node.is-failed>span:not(.pe-mobile-node-type){color:#ef967e}.pe-mobile-node.is-active{border-color:#c2d985}.pe-legend{flex-wrap:wrap;justify-content:flex-start;gap:12px;margin-top:20px;font-size:11px}.pe-legend>span:last-child{width:100%}.pe-metrics{grid-template-columns:repeat(2,1fr)}.pe-metrics>div{padding:15px 16px}.pe-metrics>div:nth-child(2){border-right:0}.pe-metrics>div:nth-child(-n+2){border-bottom:1px solid var(--line,#2d3228)}.pe-metrics span{font-size:11px}.pe-metrics strong{margin-top:7px;font-size:23px}.pe-controls{gap:8px;padding:18px 16px 0}.pe-controls .button{flex:100%;justify-content:space-between;min-height:44px;font-size:11px}.pe-observation{grid-template-columns:1fr;gap:7px;min-height:115px;padding:20px 16px 12px}.pe-observation p{font-size:11px}.pe-caveat{padding:0 16px 20px;font-size:11px}}@media (prefers-reduced-motion:reduce){.pe-message{display:none}.pattern-experiment *{transition:none!important;animation:none!important}}
