.demo-workspace{padding-bottom:4rem}.sim-toolbar{display:flex;align-items:end;gap:1rem;flex-wrap:wrap;padding:1.5rem 0}.sim-toolbar>div{flex:1;min-width:220px}.sim-toolbar h2{font-size:1.8rem;letter-spacing:-.04em;margin:.5rem 0 0}.sim-toolbar label{display:grid;gap:.3rem;font-size:.7rem;text-transform:uppercase;letter-spacing:.05em}.sim-toolbar select{min-width:125px;padding:.65rem;background:var(--panel);border:1px solid var(--line)}
.sim-frame{display:grid;grid-template-columns:210px minmax(0,1fr);border:1px solid var(--line);box-shadow:0 12px 40px #20282d0e;border-radius:6px;overflow:hidden;background:var(--panel)}.sim-nav{background:#243640;color:#f1f1eb;display:flex;flex-direction:column;padding:1.3rem .7rem;gap:.4rem}.sim-wordmark{font-size:.75rem;letter-spacing:.16em;padding:.5rem .7rem 1.5rem}.sim-nav button,.sim-nav a{border:0;text-align:left;padding:.9rem .7rem;background:none;color:inherit;font-size:.8rem;cursor:pointer;border-radius:3px}.sim-nav [aria-current=page]{background:#fff2;color:#fff}.sim-nav button:hover,.sim-nav a:hover{background:#fff1}.sim-nav p{font-size:.7rem;color:#bdc9c9;padding:2rem .7rem 0;line-height:1.7;margin-top:auto}.sim-main{padding:1.6rem;min-height:590px;min-width:0}.sim-main h3{font-size:1.35rem;letter-spacing:-.025em;margin-bottom:.5rem}.sim-main p{font-size:.88rem}.sim-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.8rem;margin:1.5rem 0}.sim-metric{padding:1rem;border:1px solid var(--line);border-top:2px solid var(--accent);min-width:0}.sim-metric small{font-size:.68rem;display:block;color:var(--muted)}.sim-metric strong{font-size:1.7rem;font-weight:550;letter-spacing:-.04em;display:block;margin:.5rem 0;white-space:nowrap;font-variant-numeric:tabular-nums}.sim-metric span{font-size:.68rem;color:var(--muted)}.sim-chart{width:100%;height:165px;margin:1rem 0;background:repeating-linear-gradient(to top,transparent 0,transparent 40px,#d7ddda 41px)}.sim-chart polyline{stroke:var(--accent);stroke-width:3;fill:none;stroke-dasharray:1000;stroke-dashoffset:1000;animation:trace-line 1.2s ease forwards}.sim-chart circle{fill:var(--accent)}@keyframes trace-line{to{stroke-dashoffset:0}}
.sim-two{display:grid;grid-template-columns:1.3fr 1fr;gap:1.4rem}.sim-panel{border:1px solid var(--line);padding:1.2rem;min-width:0}.sim-panel h4{margin:0 0 .7rem;font-size:.9rem}.sim-main .button{min-height:40px;padding:.5rem .8rem;font-size:.75rem}.sim-scroll{overflow-x:auto}.sim-table{width:100%;border-collapse:collapse;font-size:.78rem}.sim-table th{text-align:left;color:var(--muted);font-size:.68rem;font-weight:600}.sim-table th,.sim-table td{padding:.85rem .55rem;border-bottom:1px solid var(--line)}.sim-table td button{border:0;background:none;color:var(--accent);padding:.4rem 0;cursor:pointer;text-decoration:underline;text-underline-offset:3px}.sim-badge{display:inline-flex;border:1px solid var(--line);border-radius:20px;padding:.15rem .55rem;font-size:.68rem;white-space:nowrap}.sim-badge[data-state=blocked]{color:#923c2c;background:#faf0e8}.sim-badge[data-state=approved]{color:#235a41;background:#eef6ed}.sim-filters{display:flex;gap:.75rem;justify-content:space-between;margin:1.2rem 0;flex-wrap:wrap}.sim-filters input{padding:.6rem;border:1px solid var(--line);background:var(--panel);min-width:210px}.sim-track{height:7px;background:#e0e6e2;margin:.7rem 0}.sim-track i{height:100%;display:block;background:var(--accent);transition:width .35s}.sim-range{display:grid;grid-template-columns:1fr 2fr 50px;gap:1rem;align-items:center;margin:1.2rem 0;font-size:.82rem}.sim-range input{width:100%;accent-color:var(--accent)}.sim-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.65rem;margin:1.4rem 0}.sim-node{padding:1rem .7rem;border:1px solid var(--line);font-size:.76rem;position:relative}.sim-node small{display:block;color:var(--muted);margin-top:.5rem}.sim-node[data-stage=done]{background:#eff5ef;border-color:#648572}.sim-node[data-stage=running]{outline:2px solid var(--accent);animation:sim-pulse 1s infinite}.sim-node[data-stage=failed]{border-color:#a14e34;background:#faf0e8}@keyframes sim-pulse{50%{outline-offset:4px}}.sim-log{list-style:none;padding:0;font-size:.77rem;line-height:1.6}.sim-log li{display:flex;gap:.8rem;padding:.6rem 0;border-bottom:1px solid var(--line)}.sim-log time{font-family:monospace;color:var(--muted);white-space:nowrap}.sim-live{font-size:.8rem;color:var(--muted);padding:.5rem 0}.sim-dialog{border:1px solid var(--line);border-radius:5px;background:var(--panel);color:var(--ink);max-width:620px;width:calc(100% - 2rem);padding:1.8rem}.sim-dialog::backdrop{background:#19262bb0}.sim-dialog h3{font-size:1.5rem;margin-top:1.8rem}.sim-dialog dt{font-size:.75rem;color:var(--muted);margin-top:1rem}.sim-dialog dd{margin:0}.sim-permission{background:#f2f3ee;padding:.8rem;border-left:2px solid var(--accent);font-size:.78rem}.sim-count{font-variant-numeric:tabular-nums}
@media(max-width:1050px){.sim-frame{grid-template-columns:165px minmax(0,1fr)}.sim-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.sim-two{grid-template-columns:1fr}.sim-flow{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.sim-frame{grid-template-columns:1fr}.sim-nav{display:flex;flex-direction:row;overflow:auto;padding:.6rem;gap:.5rem}.sim-wordmark,.sim-nav p,.sim-nav a{display:none}.sim-nav button{min-width:130px;line-height:1.5}.sim-main{padding:1rem}.sim-toolbar{gap:.6rem}.sim-toolbar>div{flex-basis:100%}.sim-toolbar h2{font-size:1.6rem}.sim-toolbar label{flex:1}.sim-metric strong{font-size:1.45rem}.sim-range{grid-template-columns:1fr 1.2fr 40px}.sim-main{min-height:0}}
@media(prefers-reduced-motion:reduce){.sim-chart polyline{animation:none;stroke-dashoffset:0}.sim-node[data-stage=running]{animation:none}.sim-track i{transition:none}}
