.hw-app{--wb:var(--hw-ember);--bg:var(--hw-bg);--panel:var(--hw-surface);--raised:var(--hw-elevated);--sunken:color-mix(in srgb, var(--hw-bg) 70%, #000);--line:var(--hw-border);--line-2:var(--hw-border-hover);--grid:color-mix(in srgb, var(--hw-border) 35%, transparent);--grid-major:color-mix(in srgb, var(--hw-border) 70%, transparent);--ink:var(--hw-ink);--ink-2:var(--hw-ink-2);--ink-3:color-mix(in srgb, var(--hw-ink-3) 80%, #fff);--signal:var(--wb);--signal-ink:var(--wb);--signal-dim:color-mix(in srgb, var(--wb) 15%, transparent);--signal-line:color-mix(in srgb, var(--wb) 55%, transparent);--on-signal:var(--hw-on-accent);--amber:var(--hw-warn);--amber-dim:color-mix(in srgb, var(--hw-warn) 15%, transparent);--red:var(--hw-bad);--red-dim:color-mix(in srgb, var(--hw-bad) 15%, transparent);--focus:var(--wb);font-family:var(--font-body), var(--font-sans), system-ui, sans-serif;background:var(--hw-bg);color:var(--hw-ink)}:root[data-theme=light] .hw-app{--ink-3:color-mix(in srgb, var(--hw-ink-3) 85%, #000);--sunken:color-mix(in srgb, var(--hw-bg) 80%, var(--hw-border));--hw-ember:#b8430d;--hw-pcb:#136b52;--hw-steel:#2a58c2}.hw-app[data-wb=silicon]{--wb:var(--hw-steel)}.hw-app[data-wb=board]{--wb:var(--hw-pcb)}.hw-app[data-wb=matter]{--wb:var(--hw-ember)}.hw-app .num{font-family:var(--font-code), var(--font-mono), ui-monospace, monospace}.hw-split{cursor:col-resize;touch-action:none;background:0 0;position:relative}.hw-split:after{content:"";background:var(--hw-border);transition:background .15s var(--hw-ease), inset .15s var(--hw-ease);border-radius:2px;position:absolute;inset:0 3px}.hw-split:hover:after,.hw-split:focus-visible:after,.hw-split[data-drag="1"]:after{background:var(--wb);inset:0 2px}.hw-split:focus-visible{outline:2px solid var(--wb);outline-offset:-2px;border-radius:4px}.hw-tip{position:relative}.hw-tip>.hw-tip-text{white-space:nowrap;pointer-events:none;opacity:0;z-index:60;background:var(--hw-elevated);border:1px solid var(--hw-border);color:var(--hw-ink);box-shadow:var(--hw-shadow);border-radius:8px;padding:4px 8px;font-size:12px;transition:opacity .12s;position:absolute;top:50%;left:calc(100% + 10px);translate:0 -50%}.hw-tip:hover>.hw-tip-text,.hw-tip:focus-visible>.hw-tip-text{opacity:1}@media (max-width:1023px){.hw-tip>.hw-tip-text{display:none}}.hw-app .hw-spot{z-index:90;position:fixed;inset:0}@keyframes hw-pop{0%{opacity:0;transform:translateY(6px)scale(.98)}to{opacity:1;transform:none}}.hw-pop{animation:hw-pop .22s var(--hw-ease) both}@media (prefers-reduced-motion:reduce){.hw-pop{animation:none}.hw-split:after,.hw-tip>.hw-tip-text{transition:none}}.hw-app [data-flash="1"]{outline:2px solid var(--wb);outline-offset:2px;border-radius:12px}.hw-app [data-step]:focus{outline:none}.hw-marker{transform-box:fill-box;transform-origin:50%;animation:1.6s ease-in-out infinite hw-marker-pulse}@keyframes hw-marker-pulse{0%,to{opacity:1}50%{opacity:.45}}@media (prefers-reduced-motion:reduce){.hw-marker{animation:none}}.hw-wf-spin{animation:.9s linear infinite hw-wf-spin}@keyframes hw-wf-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.hw-wf-spin{animation:none}}