/* ---------- action diagram ---------- */
.ad-toolbar { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.ad-toolbar .sep { width: 1px; height: 22px; background: var(--line); margin: 0 4px; }
.ad-tog { font-size: 12px; color: var(--muted); margin-left: 4px; }
.ad-canvas .dnode.ad-action rect:first-child { filter: drop-shadow(0 1px 1.5px var(--dg-shadow)); }
.ad-ctl path, .ad-exit rect { filter: drop-shadow(0 1px 1.5px var(--dg-shadow)); }
.ad-ctl:hover path, .ad-exit:hover rect, .ad-ionode:hover path, .ad-resnode:hover path { stroke-width: 2; }
.ad-hit:hover { fill: var(--dg-sel-soft); }
.ad-blabel { user-select: none; }
.ad-blabel:hover { text-decoration: underline; }
.ad-dec { cursor: pointer; }
.ad-panel { padding: 12px 14px; }
.ad-panel h4 { margin: 0 0 10px; font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.ad-sub { font-size: 12px; color: var(--muted); font-weight: 600; margin: 4px 0 6px; }
.ad-branch-row { display: flex; align-items: center; gap: 6px; margin-bottom: 6px; padding: 3px; border-radius: 4px; }
.ad-branch-row.sel { background: var(--accent-2); }
.ad-warn { background: var(--warn-bg); border: 1px solid var(--warn); color: var(--warn); padding: 6px 10px; border-radius: 4px; font-size: 12px; margin: 8px 0; }

/* sequence diagram */
.sq-act:hover rect { stroke-width: 2; }

/* ---------- simulator ---------- */
.sim-page { display: flex; flex-direction: column; gap: 14px; }
.sim-page .page-head { margin-bottom: 0; }
.seg { display: inline-flex; }
.seg .btn { border-radius: 0; }
.seg .btn:first-child { border-radius: 4px 0 0 4px; }
.seg .btn:last-child { border-radius: 0 4px 4px 0; margin-left: -1px; }
.sim-form { gap: 14px; align-items: flex-end; flex-wrap: wrap; }
.sim-form .field { margin-bottom: 0; }
.sim-run { height: 34px; }
.sim-results { display: flex; flex-direction: column; gap: 14px; }
.sim-results > .grid { gap: 14px; }
.sim-tiles .v { font-size: 22px; }
.sim-card .card-body { overflow-x: auto; }
.sim-svg { display: block; max-width: 100%; height: auto; font-family: var(--font); }
.sim-svg rect, .sim-svg path { transition: opacity .1s; }
.sim-bin:hover path { opacity: .8; }
.sim-res + .sim-res { margin-top: 14px; padding-top: 10px; border-top: 1px solid var(--line-2); }
.sim-res-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 4px; }
.sim-table { margin-top: 10px; }
.sim-table th { cursor: default; }
.sim-log { max-height: 360px; overflow: auto; }
.sim-log td { font-size: 12.5px; padding: 4px 10px; }
.sim-log tr.ev-decision td, .sim-log tr.ev-loop td { color: var(--info); }
.sim-log tr.ev-deadlock td { color: var(--danger); font-weight: 600; }
.sim-log tr.ev-cost td { color: var(--warn); }
@media (max-width: 760px) { .sim-form { gap: 8px; } }
.sim-svg text, .ad-canvas text { font-family: var(--font); }
svg text.halo { paint-order: stroke; stroke: var(--canvas-bg); stroke-width: 4px; stroke-linejoin: round; }
.ad-panel h4 { display: flex; align-items: center; } .ad-close { margin-left: auto; font-size: 18px; }
.ad-lines path, .ad-io path { pointer-events: none; }

/* ---------- action diagram: palette, drag/drop, connect handles ---------- */
.ad-pal { display: flex; flex-direction: column; gap: 4px; padding: 8px; min-height: 0; flex: 1; overflow: hidden; }
.ad-pal-head { display: flex; align-items: center; font-weight: 600; font-size: 13px; } .ad-pal-head .icon-btn { margin-left: auto; }
.ad-pal-hint { font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; margin-top: 4px; }
.ad-pal-item { display: flex; align-items: center; gap: 8px; padding: 5px 8px; border-radius: 4px; cursor: grab; font-size: 12.5px; user-select: none; }
.ad-pal-item:hover { background: var(--accent-2); }
.ad-pal-icon { width: 20px; text-align: center; font-size: 14px; color: var(--text); opacity: .75; }
.ad-pal-list { overflow-y: auto; flex: 1; min-height: 60px; margin: 0 -8px; padding: 0 8px; }
.ad-pal-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ad-ghost { position: fixed; z-index: 150; pointer-events: none; background: var(--surface); color: var(--text); border: 1px solid var(--accent); border-radius: 4px; padding: 3px 8px; font-size: 12px; box-shadow: var(--shadow); white-space: nowrap; }
.ad-canvas.ad-dragging .ad-hit { fill: var(--dg-ok-faint); }
.ad-hit.ad-drop-ok { fill: var(--dg-ok-glow-strong) !important; }
.ad-action.ad-drop-ok > rect:first-child, .ad-ionode.ad-drop-ok path, .ad-resnode.ad-drop-ok path { stroke: var(--dg-ok-strong) !important; stroke-width: 3 !important; }
.ad-moving { opacity: .45; pointer-events: none; }
.ad-handle circle { fill: var(--dg-ok-strong); stroke: var(--dg-paper); stroke-width: 2; filter: drop-shadow(0 1px 2px var(--dg-shadow)); }
.ad-handle:hover circle { fill: var(--dg-ok-hover); }
.ad-rubber { fill: none; stroke: var(--dg-ok-strong); stroke-width: 2; stroke-dasharray: 5 4; pointer-events: none; }
.ad-half { fill: var(--dg-ok-faint); stroke: var(--dg-ok-strong); stroke-dasharray: 3 3; pointer-events: none; }
.ad-half.on { fill: var(--dg-ok-glow-strong); }
.ad-half-t { font-size: 11px; font-weight: 700; fill: var(--dg-zone-ink); pointer-events: none; }
.ad-halves, .ad-overlay text { pointer-events: none; }
.ad-col { display: flex; flex-direction: column; gap: 6px; align-items: stretch; margin-top: 8px; }
.ad-script { font: 12.5px/1.45 ui-monospace, SFMono-Regular, Menlo, monospace; width: 100%; tab-size: 2; white-space: pre; }
.ad-script-box { display: flex; flex-direction: column; gap: 8px; }
.ad-check { margin: 0; padding-left: 18px; } .ad-check li { margin: 4px 0; }
.ad-pio path { stroke-dasharray: 4 3; }
.ad-readonly .zoom-box { display: none; }
/* simulation trace highlighting (read-only action diagram inside the simulator) */
.sim-trace { height: 340px; display: flex; flex-direction: column; position: relative; }
.sim-trace .canvas-wrap { flex: 1; min-height: 300px; }
.sim-trace .ad-readonly .zoom-box { display: flex; }
.sim-trace .sim-run > rect:first-child, .sim-trace .sim-run > path:first-child { stroke: var(--sim-run) !important; stroke-width: 3.5 !important; fill: var(--sim-run-bg) !important; }
.sim-trace .sim-wait > rect:first-child, .sim-trace .sim-wait > path:first-child { stroke: var(--sim-wait) !important; stroke-width: 3.5 !important; fill: var(--sim-wait-bg) !important; }
.sim-trace .sim-done > rect:first-child, .sim-trace .sim-done > path:first-child { fill: var(--sim-done-bg) !important; }

/* ---------- simulator dashboard ---------- */
.sim-controls .sim-ctl { gap: 8px; align-items: center; flex-wrap: wrap; }
.sim-clock { font: 600 14px/1 ui-monospace, Menlo, monospace; min-width: 120px; }
.sim-checks { display: flex; flex-direction: column; gap: 2px; font-size: 12.5px; }
.sim-body { display: flex; gap: 14px; align-items: flex-start; }
.sim-grid { flex: 1; min-width: 0; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 14px; }
.sim-intro { grid-column: span 12; }
.sim-panel { display: flex; flex-direction: column; min-width: 0; }
.sim-panel.dragging { opacity: .5; } .sim-panel.drop { outline: 2px dashed var(--accent); }
.sim-phead { display: flex; align-items: center; gap: 6px; padding: 7px 10px; border-bottom: 1px solid var(--line); font-weight: 600; cursor: grab; }
.sim-ptitle { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sim-pbody { padding: 10px 12px; overflow: auto; resize: vertical; min-height: 60px; }
.sim-pbody.locked { resize: none; }
.sim-ptools { display: flex; gap: 4px; flex-wrap: wrap; align-items: center; margin-bottom: 6px; }
.sim-legend { display: inline-flex; gap: 10px; font-size: 11px; color: var(--muted); margin-left: 8px; }
.sim-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 3px; vertical-align: -1px; opacity: .7; }
.sim-scroll { overflow-x: auto; }
.sim-big { font-size: 24px; font-weight: 700; }
.sim-complete { font-size: 20px; font-weight: 700; color: var(--ok); } .sim-complete.bad { color: var(--danger); }
.sim-err { color: var(--danger); margin-top: 6px; white-space: pre-wrap; }
.sim-empty { color: var(--muted); font-size: 12.5px; padding: 6px 0; }
.sim-status { display: flex; flex-direction: column; gap: 6px; }
.sim-srow { cursor: pointer; } .sim-sname { font-size: 12.5px; }
.sim-prog { height: 8px; background: var(--line-2); border-radius: 4px; overflow: hidden; margin: 3px 0; }
.sim-prog > div { height: 100%; background: var(--sim-bar); transition: width .1s; }
.sim-prog.wait-io > div { background: var(--sim-bar-io); } .sim-prog.wait-resource > div { background: var(--sim-bar-res); } .sim-prog.wait-utilization > div { background: var(--sim-wait); } .sim-prog.wait-start > div { background: var(--sim-bar-start); }
.sim-prog.decomp > div { background: var(--sim-bar-decomp); }
.sim-mcprog { width: 180px; display: inline-block; vertical-align: middle; }
.sim-console { font: 12px/1.5 ui-monospace, Menlo, monospace; max-height: 320px; overflow: auto; white-space: pre-wrap; }
.sim-cl.cl-script-error, .sim-cl.cl-error, .sim-cl.cl-deadlock { color: var(--danger); font-weight: 600; }
.sim-cl.cl-warning { color: var(--warn); } .sim-cl.cl-print { color: var(--text); }
.sim-log tr.ev-io td, .sim-log tr.ev-transfer td { color: var(--ok); }
.sim-log tr.ev-killed td, .sim-log tr.ev-error td { color: var(--danger); }
.sim-drawer { width: 300px; flex: none; position: sticky; top: 10px; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius, 6px); padding: 10px 12px; max-height: 80vh; overflow: auto; display: flex; flex-direction: column; gap: 6px; }
.sim-drawer.hidden { display: none; }
.sim-dhead { display: flex; align-items: center; gap: 6px; }
.sim-cfg { max-height: 300px; overflow: auto; margin-top: 6px; }
.sim-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px 12px; margin-bottom: 8px; }
.sim-prompt { display: flex; flex-direction: column; gap: 8px; min-width: 300px; }
.sim-bar:hover, .sim-tile:hover rect, .sim-line:hover path { opacity: .8; }
@media (max-width: 900px) { .sim-grid { grid-template-columns: minmax(0, 1fr); } .sim-panel { grid-column: span 1 !important; } .sim-body { flex-direction: column; } .sim-drawer { width: auto; position: static; } }
/* dark theme: charts keep a light plot area (like diagram canvases) so their inline colors stay readable */
[data-theme=dark] .sim-svg { background: var(--canvas-bg); border-radius: var(--r-sm); }
.sim-pbody .sim-svg:not(.sim-gantt) { max-height: 320px; }