/* Structures layer (step 8a): click popup on the map + the Layers panel group. Tokens only. */
.sm-struct-pop { position: absolute; z-index: 5; min-width: 190px; max-width: 280px; background: var(--bg-panel); color: var(--text); border: 1px solid var(--border-strong); box-shadow: 0 2px 8px rgba(0,0,0,.5); font: var(--fs-ui) var(--font-ui); pointer-events: auto; }
.sm-pop-head { display: flex; align-items: center; gap: 6px; padding: 5px 8px; background: var(--bg-panel-header); border-bottom: 1px solid var(--border); color: var(--text-bright); }
.sm-pop-swatch { width: 10px; height: 10px; border: 1px solid rgba(255,255,255,.35); flex: none; }
.sm-pop-body { padding: 5px 8px; display: flex; flex-direction: column; gap: 2px; color: var(--text-dim); font-size: var(--fs-small); }
.sm-pop-body .mono { font-family: var(--font-mono); color: var(--text); }
.sm-pop-actions { display: flex; gap: 4px; padding: 5px 8px 6px; border-top: 1px solid var(--border); }
.sm-pop-actions button { flex: 1; height: 22px; background: var(--bg-hover); color: var(--text); border: 1px solid var(--border-strong); border-radius: var(--radius); font: inherit; cursor: pointer; }
.sm-pop-actions button:hover:not(:disabled) { background: var(--bg-active); }
.sm-pop-actions button:disabled { color: var(--text-dim); cursor: default; }

.slyr-group[hidden] { display: none !important; }
.slyr-bar { display: flex; align-items: center; gap: 6px; height: 22px; padding: 0 10px; color: var(--text-dim); font-size: var(--fs-small); border-bottom: 1px solid var(--border); }
.slyr-bar .spacer { flex: 1; }
.slyr-bar button { height: 18px; padding: 0 6px; background: var(--bg-hover); color: var(--text); border: 1px solid var(--border); border-radius: var(--radius); font: inherit; cursor: pointer; }
.slyr-bar button:hover { background: var(--bg-active); }
.slyr-twist { background: none !important; border: 0 !important; padding: 0 !important; width: 14px; color: var(--text-dim) !important; }
.slyr-list { max-height: 220px; overflow-y: auto; border-bottom: 1px solid var(--border); }
.slyr-list[hidden] { display: none; }
.slyr-type { display: flex; align-items: center; gap: 6px; height: 22px; padding: 0 10px; font-size: var(--fs-small); color: var(--text); }
.slyr-type:hover { background: var(--bg-hover); }
.slyr-type input { margin: 0; }
.slyr-type i { width: 10px; height: 10px; border: 1px solid rgba(255,255,255,.3); flex: none; }
.slyr-type .slyr-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.slyr-type .slyr-n { font-family: var(--font-mono); color: var(--text-dim); }
.slyr-type.off .slyr-name, .slyr-type.off .slyr-n { color: var(--text-dim); }
.slyr-empty { padding: 4px 10px; color: var(--text-dim); font-size: var(--fs-small); }

/* pixel-art type icons in the Layers list (lead, 2026-11-09) */
.slyr-icon { width: 16px; height: 16px; padding: 1px; box-sizing: border-box; image-rendering: pixelated; background: #1f2026; border: 1px solid; flex: none; }