:root{--gronkie-accent: #445566;--gronkie-accent-contrast: #ffffff;--gronkie-radius: 8px}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,sans-serif;color:#1a1a1a;background:#fafafa}main{max-width:1100px;margin:0 auto;padding:1.5rem}header h1{color:var(--gronkie-accent, #445566)}.builder-selector{display:inline-flex;align-items:center;gap:.5rem;margin-bottom:1rem;font-size:.95rem}.builder-selector-label{font-weight:600;color:#4a4a4a}.builder-selector select{border:1px solid color-mix(in srgb,var(--gronkie-accent, #445566) 40%,#cfd4da);border-radius:var(--gronkie-radius, 8px);padding:.4rem .6rem;font-size:.95rem;background:#fff;color:#1a1a1a}.storefront-layout{display:grid;grid-template-columns:minmax(260px,380px) minmax(280px,1fr);gap:2rem;align-items:start}@media(max-width:720px){.storefront-layout{grid-template-columns:1fr}}.viewport-panel{aspect-ratio:4 / 3;min-height:280px;overflow:hidden;border-radius:var(--gronkie-radius, 8px);background:color-mix(in srgb,var(--gronkie-accent, #445566) 6%,#eef0f3)}.viewport-panel canvas{display:block;width:100%;height:100%}footer{margin-top:1.5rem}footer p{font-size:1.25rem;font-weight:600}footer button{background:var(--gronkie-accent, #445566);color:var(--gronkie-accent-contrast, #ffffff);border:none;border-radius:var(--gronkie-radius, 8px);padding:.75rem 1.5rem;font-size:1rem;cursor:pointer}footer button:hover{filter:brightness(.92)}footer button:disabled{cursor:not-allowed;filter:grayscale(.4) brightness(.85)}.order-confirmation{color:#1f6f4a;font-weight:600}.order-error{color:#a3242f;font-weight:600}.colourway-field{border:1px solid var(--gronkie-border, #d8dbe2);border-radius:var(--gronkie-radius, 8px)}.colourway-option{display:flex;align-items:center;gap:.5rem;padding:.25rem 0}.colourway-swatches{display:inline-flex;border-radius:3px;overflow:hidden}.colourway-swatch{width:1.1rem;height:1.1rem}.colourway-label{font-size:.9rem}.number-field-header{display:flex;justify-content:space-between;align-items:baseline;gap:.5rem}.number-field-value{font-variant-numeric:tabular-nums;color:var(--gronkie-accent, #445566)}
