.collage-canvas{cursor:pointer;touch-action:none;max-width:100%;background:repeating-conic-gradient(#fff 0,#fff 25%,#d4d4d4 0,#d4d4d4 50%) 0 0 / 20px 20px}.cellcount{display:inline-flex;align-items:center;gap:8px;margin-left:auto}.cellcount output{min-width:2ch;text-align:center;font-weight:700;font-variant-numeric:tabular-nums}.cellcount .icon-btn{width:34px;height:34px;font-size:20px;line-height:1}.layouts{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:8px}.lthumb{padding:3px;border:2px solid var(--border);border-radius:10px;background:var(--surface-2);cursor:pointer}.lthumb canvas{display:block;width:100%;height:auto;border-radius:6px}.lthumb:hover{border-color:color-mix(in srgb,var(--accent) 50%,var(--border))}.lthumb[aria-pressed=true]{border-color:var(--accent);background:var(--accent-soft)}.tray{display:flex;flex-wrap:wrap;gap:8px}.tray-item{padding:3px;border:2px solid var(--border);border-radius:10px;background:var(--surface-2);cursor:pointer}.tray-item img{display:block;width:76px;height:76px;object-fit:cover;border-radius:7px}.tray-item.is-used{opacity:.55}.tray-item:hover{border-color:var(--accent);opacity:1}.swatches{display:flex;flex-wrap:wrap;gap:6px}.swatch{width:28px;height:28px;border-radius:50%;border:2px solid var(--border);cursor:pointer;padding:0}.swatch:hover{border-color:var(--accent)}.swatch--none{background:repeating-conic-gradient(#fff 0,#fff 25%,#d4d4d4 0,#d4d4d4 50%) 0 0 / 10px 10px}