.hero-centered{text-align:center;display:grid;justify-items:center}
.hero-centered h1,.hero-centered div,.hero-centered small{width:100%;text-align:center}
.product-stage{position:relative;height:330px;margin:-4px 0 20px;background:linear-gradient(145deg,#161719,#2c2e31);overflow:hidden;border-radius:8px}
.product-stage canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab}
.product-stage canvas:active{cursor:grabbing}
.preview-copy{position:absolute;left:16px;bottom:14px;display:grid;color:white;pointer-events:none}
.preview-copy strong{font-size:16px}.preview-copy span{font-size:12px;color:#c6c7ca;margin-top:3px}
.color-field{border:0;padding:0;margin:0}.color-field legend{font-size:13px;font-weight:600;margin-bottom:7px}
.color-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;min-height:48px}
.color-choice{display:flex;align-items:center;justify-content:center;gap:7px;background:white;color:#27272a;border:1px solid #d4d4d8;padding:10px 7px;min-width:0}
.color-choice.selected{border-color:#dc2626;box-shadow:0 0 0 1px #dc2626}
.color-choice i{width:18px;height:18px;border-radius:50%;background:var(--swatch);border:1px solid rgba(0,0,0,.18);flex:0 0 auto}
.color-choice span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.color-empty,.privacy-note{font-size:12px;color:#71717a}
.color-empty{padding:10px 0}.privacy-note{text-align:center;line-height:1.6;margin:14px 0 0}
@media(max-width:420px){.product-stage{height:290px}.color-options{grid-template-columns:repeat(2,minmax(0,1fr))}}
