/* L3DN product options – uses tokens from the theme when present. */
.l3dn-options { display: grid; gap: 16px; margin: 0 0 16px; }
.l3dn-field { border: 1px solid var(--l3dn-line, #e3e3e0); border-radius: var(--l3dn-radius, 10px); padding: 12px 16px 16px; margin: 0; }
.l3dn-field legend { font-family: var(--l3dn-font-mono, monospace); font-size: 12px; letter-spacing: .06em; text-transform: uppercase; padding: 0 6px; }
.l3dn-field input[type="text"] { width: 100%; padding: 10px 12px; border: 1px solid var(--l3dn-line, #ccc); border-radius: 8px; margin: 4px 0 10px; }
.l3dn-modes { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.l3dn-mode { border: 1px solid var(--l3dn-line, #ccc); border-radius: 999px; padding: 6px 12px; cursor: pointer; }
.l3dn-mode:has(input:checked) { background: var(--l3dn-ink, #111); color: #fff; border-color: var(--l3dn-ink, #111); }
.l3dn-swatches, .l3dn-presets { display: flex; flex-wrap: wrap; gap: 8px; }
.l3dn-swatch-opt, .l3dn-preset { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--l3dn-line, #ccc); border-radius: 8px; padding: 6px 10px; cursor: pointer; }
.l3dn-swatch-opt:has(input:checked), .l3dn-preset:has(input:checked) { outline: 2px solid var(--l3dn-ink, #111); }
.l3dn-swatch-opt input, .l3dn-preset input { position: absolute; opacity: 0; pointer-events: none; }
.is-out { opacity: .45; cursor: not-allowed; }
.l3dn-swatch { display: inline-block; width: 18px; height: 18px; border-radius: 50%; background: var(--c, transparent); border: 1px solid rgba(0,0,0,.25); vertical-align: middle; }
.l3dn-dots { display: inline-flex; }
.l3dn-dots .l3dn-swatch + .l3dn-swatch { margin-left: -6px; }
.l3dn-parts { display: grid; gap: 10px; }
.l3dn-part { display: grid; grid-template-columns: 1fr minmax(140px, 200px) 22px; align-items: center; gap: 8px; }
.l3dn-plus { font-family: var(--l3dn-font-mono, monospace); font-size: 12px; color: var(--l3dn-muted, #666); margin-left: 4px; }
.l3dn-hint { font-size: 13px; color: var(--l3dn-muted, #666); margin: 6px 0 0; }
.l3dn-check { display: flex; gap: 8px; align-items: flex-start; margin-top: 8px; }
.l3dn-logo__status.is-error { color: var(--l3dn-error, #c62828); }
.l3dn-total { margin: 0; font-size: 18px; }
.l3dn-designer { margin: 16px 0; padding: 12px 16px; border-left: 3px solid var(--l3dn-accent, #D4F01E); background: var(--l3dn-surface, #f6f6f3); }
.l3dn-designer__license, .l3dn-designer__platform { font-family: var(--l3dn-font-mono, monospace); font-size: 12px; color: var(--l3dn-muted, #666); }