.sbcube { margin: 0 0 1.5rem; display: grid; gap: 1.25rem; }
.sbcube-preview-title { font-weight: 600; margin: 0 0 .5rem; }
.sbcube-preview-title span { font-weight: 400; opacity: .7; font-size: .9em; }
.sbcube-preview { display: grid; grid-template-columns: repeat(3, 1fr); gap: .6rem; }
.sbcube-card { margin: 0; cursor: pointer; border-radius: 12px; padding: 4px; border: 2px solid transparent; transition: border-color .15s; }
.sbcube-card.is-active { border-color: #c9a227; }
.sbcube-card figcaption { font-size: .75rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: center; margin-bottom: 3px; opacity: .8; }
.sbcube-card canvas { display: block; width: 100%; height: auto; border-radius: 8px; }
.sbcube-note { font-size: .8rem; opacity: .7; margin: .4rem 0 0; }
.sbcube-form { display: grid; gap: .8rem; }
.sbcube-face { border: 1px solid #ddd; border-radius: 10px; padding: .7rem .9rem .9rem; margin: 0; }
.sbcube-face legend { font-weight: 600; padding: 0 .3rem; }
.sbcube-face label { display: block; font-size: .9rem; margin-top: .4rem; }
.sbcube-face input[type=text], .sbcube-face input[type=date], .sbcube-face input[type=time], .sbcube-face select {
	display: block; width: 100%; box-sizing: border-box; margin-top: .25rem; padding: .55rem .6rem; border: 1px solid #bbb; border-radius: 6px; font-size: 1rem; background: #fff;
}
.sbcube-row { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.sbcube-label { display: block; font-size: .9rem; margin-top: .6rem; }
.sbcube-motifs { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .3rem; }
.sbcube-motifs { display: grid !important; grid-template-columns: repeat(4, 1fr); }
.sbcube-motif { display: flex !important; flex-direction: column; align-items: center; gap: .25rem; margin: 0 !important; border: 2px solid #ddd; border-radius: 10px; padding: .35rem; cursor: pointer; font-size: .8rem; text-align: center; }
.sbcube-motif input { position: absolute; opacity: 0; pointer-events: none; }
.sbcube-motif img { width: 100%; max-width: 72px; height: auto; border-radius: 6px; }
.sbcube-motif:has(input:checked) { border-color: #c9a227; background: #fbf5e3; }
.sbcube-confirm { display: flex; gap: .5rem; align-items: flex-start; font-size: .9rem; }
.sbcube-confirm input { margin-top: .25rem; }
@media (max-width: 600px) { .sbcube-preview { grid-template-columns: repeat(2, 1fr); } }
.sbcube-auto { font-size: .9rem; margin: .3rem 0 0; }
