.assembly-host { position: relative; }
.assembly-sketch { position: absolute; inset: 0; width: 100%; max-width: 100%; height: 100%; min-height: 1px; overflow: hidden; pointer-events: none; z-index: 1; }
.assembly-sketch path { fill: none; stroke: var(--ink); stroke-width: 1px; vector-effect: non-scaling-stroke; }
.assembly-glyph { opacity: 1; }
.assembly-copy-run { position: relative; }
.assembly-copy { position: absolute; inset: 0; display: block; overflow: clip; pointer-events: none; }
.assembly-copy[hidden] { display: none; }
.assembly-copy-label { position: absolute; top: 50%; left: 0; transform: translateY(-50%); white-space: nowrap; line-height: 1; background: linear-gradient(to right, #638aff99 var(--selection, 0%), transparent var(--selection, 0%)); }
.assembly-accessible { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.assembly-overlay { position: fixed; inset: 0; pointer-events: none; overflow: clip; contain: paint; z-index: 8; }
.assembly-cursor, .assembly-selection, .assembly-anchor { --cursor-color: #325ccc; position: fixed; z-index: 8; pointer-events: none; color: var(--cursor-color); }
.assembly-cursor { top: 0; left: 0; width: 24px; height: 30px; will-change: transform; filter: drop-shadow(0 1px 1px #1112); }
.assembly-cursor[hidden], .assembly-selection[hidden], .assembly-anchor[hidden] { display: none; }
.assembly-cursor-1, .assembly-selection-1, .assembly-anchor-1 { --cursor-color: #a4507f; }
.assembly-cursor-2, .assembly-selection-2, .assembly-anchor-2 { --cursor-color: #aa641f; }
.assembly-cursor-3, .assembly-selection-3, .assembly-anchor-3 { --cursor-color: #2f7c67; }
.assembly-cursor-4, .assembly-selection-4, .assembly-anchor-4 { --cursor-color: #7658b6; }
.assembly-cursor-5, .assembly-selection-5, .assembly-anchor-5 { --cursor-color: #167d91; }
.assembly-cursor svg { width: 24px; height: 30px; display: block; overflow: visible; transform: translate(-2px,-2px); }
.assembly-cursor path { fill: currentColor; stroke: var(--paper); stroke-width: 1.5px; stroke-linejoin: round; }
.assembly-cursor > span { position: absolute; top: 23px; left: 14px; display: block; width: max-content; padding: 5px 8px; color: #fff; background: var(--cursor-color); border: 1px solid #ffffffa0; border-radius: 0 3px 3px; font: 10px/1.2 var(--mono); }
.assembly-cursor[data-side="left"] > span { left: 0; transform: translateX(-100%); border-radius: 4px 0 4px 4px; }
.assembly-cursor .assembly-tool { position: absolute; display: none; transform: none; }
.assembly-cursor .assembly-pen { left: -2px; top: -24px; width: 28px; height: 28px; }
.assembly-cursor .assembly-crosshair { left: -12px; top: -12px; width: 24px; height: 24px; }
.assembly-cursor .assembly-ibeam { left: -6px; top: -22px; width: 12px; height: 24px; }
.assembly-crosshair path, .assembly-ibeam path { fill: none; stroke: currentColor; stroke-width: 2px; }
.assembly-pen .assembly-tool-line { fill: none; stroke: var(--paper); stroke-width: 1px; }
.assembly-cursor[data-phase="action"] .assembly-arrow { display: none; }
.assembly-cursor[data-phase="action"][data-mode="drawing"] .assembly-pen,
.assembly-cursor[data-phase="action"][data-mode="placing"] .assembly-crosshair,
.assembly-cursor[data-phase="action"][data-mode="framing"] .assembly-crosshair,
.assembly-cursor[data-phase="action"][data-mode="editing"] .assembly-ibeam,
.assembly-cursor[data-phase="action"][data-mode="selecting"] .assembly-ibeam,
.assembly-cursor[data-phase="action"][data-mode="typing"] .assembly-ibeam { display: block; }
.assembly-cursor[data-phase="action"][data-mode^="pasting"] .assembly-arrow { display: block; }
.assembly-cursor[data-phase="click"]::after { content: ''; position: absolute; width: 22px; height: 22px; border: 2px solid currentColor; border-radius: 50%; left: -11px; top: -11px; animation: assembly-click .055s ease-out both; }
.assembly-selection { border: 1px solid currentColor; opacity: .48; }
.assembly-selection::before, .assembly-selection::after { content: ''; position: absolute; opacity: .25; }
.assembly-selection::before { left: -24px; top: -1px; width: calc(100% + 48px); border-top: 1px dashed currentColor; }
.assembly-selection::after { top: -24px; left: -1px; height: calc(100% + 48px); border-left: 1px dashed currentColor; }
.assembly-selection b { position: absolute; left: 50%; top: 100%; margin-top: 8px; padding: 3px 6px; transform: translateX(-50%); white-space: nowrap; color: currentColor; background: var(--paper); border: 1px solid currentColor; font: 10px/1.2 var(--mono); }
.assembly-selection i { position: absolute; width: 6px; height: 6px; border: 1px solid currentColor; background: var(--paper); transform: translate(-50%,-50%); }
.assembly-selection i:nth-child(1) { top: 0; left: 0; }.assembly-selection i:nth-child(2) { top: 0; left: 100%; }.assembly-selection i:nth-child(3) { top: 100%; left: 0; }.assembly-selection i:nth-child(4) { top: 100%; left: 100%; }
.assembly-anchor { top: -4px; left: -4px; width: 8px; height: 8px; border: 1.5px solid currentColor; background: var(--paper); z-index: 7; }
.assembly-anchor-start { border-radius: 50%; }
[data-assembly-state="waiting"], [data-assembly-state="running"] { opacity: 1 !important; }
.project-preview:is([data-assembly-state="waiting"], [data-assembly-state="running"]) { border-color: transparent; }
[data-build-scene]:is([data-assembly-state="waiting"], [data-assembly-state="running"]) iframe { pointer-events: none; }
[data-build-scene][data-assembly-state="waiting"] summary::after, [data-build-scene][data-assembly-state="running"] summary::after { opacity: 0; }
body:has(#article-dialog[open]) :is(.assembly-cursor,.assembly-selection,.assembly-anchor) { display: none; }
@keyframes assembly-click { from { opacity: 1; transform: scale(.2); } to { opacity: 0; transform: scale(1.5); } }
@media (max-width: 767px) { .assembly-cursor > span { font-size: 9px; padding: 4px 6px; }.assembly-selection b { font-size: 9px; }.assembly-selection::before, .assembly-selection::after { display: none; } }
@media (prefers-reduced-motion: reduce) { .assembly-glyph { opacity: 1 !important; }.assembly-sketch, .assembly-cursor, .assembly-selection, .assembly-anchor { display: none !important; } }

.assembly-cursor[data-phase="action"][data-mode="resizing"] .assembly-crosshair { display: block; transform: rotate(45deg); }
.assembly-cursor[data-phase="action"][data-mode="dragging"] .assembly-arrow,
.assembly-cursor[data-phase="action"][data-mode="aligning"] .assembly-arrow { display: block; }
.assembly-selection[data-action="resize"] { opacity: .8; }
.assembly-selection[data-action="resize"] i:nth-child(4) { width: 10px; height: 10px; background: currentColor; box-shadow: 0 0 0 3px var(--paper); }
.assembly-selection[data-action="drag"] { border-style: dashed; opacity: .8; }
.assembly-snap-guide { opacity: .8; border-style: dashed; }
.assembly-snap-guide::before, .assembly-snap-guide::after { opacity: .8; display: block; }