.wm-preview { display: grid; place-items: center; }
.wm-preview canvas { display: block; max-width: 100%; max-height: var(--preview-max-h); width: auto; height: auto; }
.wm-nav { justify-content: center; align-items: center; }
.wm-color { height: 44px; padding: 4px; cursor: pointer; }
.wm-pos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; padding: 8px; border-radius: var(--radius); background: var(--surface-sunken); }
.wm-pos label { position: relative; display: grid; place-items: center; height: 36px; border-radius: 8px; background: var(--surface); border: 1px solid var(--border); cursor: pointer; }
.wm-pos input { position: absolute; opacity: 0; pointer-events: none; }
.wm-pos label > span:empty::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--border-strong); }
.wm-pos input:checked + span:empty::before { background: var(--primary); box-shadow: 0 0 0 4px var(--primary-soft); }
.wm-pos label:has(input:checked) { border-color: var(--primary); }
.wm-pos label:has(input:focus-visible) { box-shadow: var(--ring); }
.wm-pos .wm-tile { grid-column: 1 / -1; font-size: .85rem; font-weight: 600; color: var(--text-soft); }
.wm-pos .wm-tile:has(input:checked) { color: var(--primary); background: var(--primary-softer); }