@import url('../common/sim.css');

/* Legend */
.wwsim .sw-line   { width: 22px; height: 2px; background: var(--accent); }
.wwsim .sw-dash   { width: 22px; height: 0; border-top: 1px dashed rgba(0,119,204,0.45); }
.wwsim .sw-thresh { width: 22px; height: 0; border-top: 2px dashed rgba(224,0,60,0.85); }
.wwsim .sw-cp     { width: 2px; height: 13px; background: var(--accent2); box-shadow: 0 0 8px var(--accent2); }
.wwsim .sw-seg    { width: 16px; height: 13px; background: rgba(224,0,60,0.25); }
.wwsim .sw-span   { width: 16px; height: 13px; background: rgba(224,0,60,0.25); }

/* Interventions */
.wwsim .btn-spike  { color: var(--accent3); border-color: var(--accent3); }
.wwsim .btn-spike:hover, .wwsim .btn-spike.active { background-color: var(--accent3-bg); }

.wwsim .btn-step   { color: var(--accent2); border-color: var(--accent2); }
.wwsim .btn-step:hover, .wwsim .btn-step.active  { background-color: var(--accent2-bg); }

.wwsim .btn-micro  { color: var(--accent); border-color: var(--accent); }
.wwsim .btn-micro:hover, .wwsim .btn-micro.active { background-color: var(--accent-bg); }

.wwsim .btn-ramp   { color: var(--accent4); border-color: var(--accent4); }
.wwsim .btn-ramp:hover, .wwsim .btn-ramp.active { background-color: var(--accent4-bg); }

.wwsim .btn-rebase { color: var(--accent5); border-color: var(--accent5); }
.wwsim .btn-rebase:hover, .wwsim .btn-rebase.active { background-color: var(--accent5-bg); }

.wwsim .btn-reset  { color: var(--text); border-color: var(--text); }
.wwsim .btn-reset:hover, .wwsim .btn-reset.active { background-color: var(--surface2); }

/* Status bar */
.wwsim .w-status-bar {
  display: flex; gap: 28px; flex-wrap: wrap;
  font-family: 'IBM Plex Mono', monospace; font-size: 11px; color: var(--text-dim);
}
.wwsim .w-stat { display: flex; flex-direction: column; gap: 3px; }
.wwsim .w-stat-label { text-transform: uppercase; letter-spacing: 0.5px; }
.wwsim .w-stat-value { color: var(--accent); font-size: 14px; }
@keyframes ts-flash { 0%,100%{opacity:1} 50%{opacity:0.2} }
.wwsim .w-stat-value.flash { animation: ts-flash 0.5s ease; color: var(--accent2) !important; }
