.zm-sand-layout { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(270px, .8fr); gap: 30px; align-items: start; margin-top: 28px; }
.zm-sand-stage { position: relative; width: 100%; aspect-ratio: 1; overflow: hidden; border-radius: 20px; border: 1px solid var(--rule-2); touch-action: none; user-select: none; }
.zm-sand-node { position: absolute; padding: 0; background: transparent; border: 1px solid transparent; border-radius: 5px; cursor: grab; touch-action: none; }
.zm-sand-node.selected { border: 1px dashed var(--accent); }
.zm-sand-node img { width: 100%; height: 100%; object-fit: contain; pointer-events: none; user-select: none; }
.zm-sand-empty { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; align-items: center; color: #665b45; text-align: center; padding: 24px; pointer-events: none; }
.zm-sand-empty[hidden] { display: none; }
.zm-sand-tray { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.zm-sand-material { position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 7px; border: 1px solid var(--rule); border-radius: 7px; background: var(--card); font-size: 12px; min-width: 0; }
.zm-sand-material img { width: 100%; aspect-ratio: 1; object-fit: contain; }
.zm-sand-image-error { position: absolute; inset: auto 0 0; background: var(--accent-soft); color: var(--accent); padding: 4px; font-size: 11px; pointer-events: none; }
.zm-sand-image-error[hidden] { display: none; }
.zm-sand-material.image-error { opacity: .65; }
.zm-sand-layout nav { gap: 8px; margin: 18px 0; }
.zm-sand-layout nav button { padding: 8px 10px; font-size: 13px; }
.zm-sand-layout nav button[aria-pressed="true"] { color: var(--accent); background: var(--accent-soft); border-color: var(--accent); }
.zm-sand-dialog { box-sizing: border-box; width: min(440px, calc(100vw - 40px)); padding: 24px; color: inherit; background: var(--card, #fff); border: 1px solid var(--rule); border-radius: 12px; }
.zm-sand-dialog::backdrop { background: rgb(0 0 0 / .35); }
.zm-sand-dialog h2 { margin-top: 0; }
.zm-sand-dialog .zm-actions { justify-content: flex-end; margin-top: 24px; }
@media (max-width: 800px) { .zm-sand-layout { grid-template-columns: 1fr; gap: 22px; } }
