:root{color-scheme:light;--ink:#171b24;--muted:#626b7a;--accent:#003d9f;--line:#dde3ec;--paper:#f5f7fb}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif}header{max-width:1220px;margin:auto;padding:28px 42px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}.brand{font-size:27px;font-weight:850;letter-spacing:-1.3px;text-decoration:none;color:var(--ink)}.brand span{color:var(--accent)}.header-note,.eyebrow{font-size:11px;letter-spacing:2px;font-weight:bold;color:var(--muted)}main{max-width:1220px;margin:auto;padding:46px 42px 60px}.intro{margin-bottom:32px}.eyebrow{color:var(--accent)}h1{font-size:46px;letter-spacing:-1.8px;margin:12px 0}p{line-height:1.55}.intro p{color:var(--muted);margin:0}.studio{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(340px,1fr);gap:32px;align-items:start}.preview-panel{position:sticky;top:24px;min-width:0}.preview-top,.preview-bottom{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:13px}.preview-top{padding:18px 22px;background:#eaf0f9;border-radius:16px 16px 0 0;font-weight:bold}.preview-pill{font-size:11px;white-space:nowrap;font-weight:normal;border:1px solid #cad6e9;border-radius:20px;padding:6px 10px}.plate-stage{background:radial-gradient(ellipse at 40% 30%,#fff 0,#edf2fa 55%,#dce6f4 100%);min-height:275px;display:flex;justify-content:center;align-items:center;padding:42px 12px;position:relative;overflow:hidden}.plate-stage img{width:100%;display:block;filter:drop-shadow(0 13px 10px #12265020)}.plate-stage img[hidden]{display:none}.loading{position:absolute;bottom:13px;right:17px;color:var(--muted);font-size:11px}.preview-bottom{padding:16px 22px;background:#eaf0f9;border-radius:0 0 16px 16px;color:#526078;font-size:12px}.preview-note{text-align:center;font-size:11px;color:var(--muted);padding:0 10px}.configuration{font-size:12px;text-align:center;color:var(--muted);padding:12px}.fit-warning{padding:15px 18px;border:1px solid #edc38a;background:#fff5e6;color:#80501b;border-radius:10px;font-size:13px;line-height:1.5}.fit-error{padding:15px 18px;border:1px solid #dfb4ae;background:#fff0ec;color:#963b2e;border-radius:10px;font-size:13px;line-height:1.5}.controls{background:white;border:1px solid var(--line);border-radius:16px;padding:26px}.field{margin-bottom:26px}.field>label{display:flex;align-items:center;gap:9px;margin-bottom:12px;font-size:14px;font-weight:600}.step{color:#7c879a;font-size:11px;font-weight:normal}.hint{font-size:11px;color:var(--muted);line-height:1.55;margin:8px 0 0}input[type=text]{width:100%;padding:17px 15px;border:1px solid #b4bfd0;border-radius:8px;font-size:23px;font-weight:bold;letter-spacing:1.5px;text-transform:uppercase;color:var(--ink);background:#fff}input:focus,select:focus,button:focus-visible{outline:3px solid #8fb8ff;outline-offset:2px}select{width:100%;padding:13px 12px;background:white;border:1px solid var(--line);border-radius:8px;font:14px Arial;color:var(--ink);min-height:46px}.groups{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-bottom:12px}.groups button{border:1px solid var(--line);border-radius:8px;padding:13px 7px;background:#fff;color:var(--ink);font-size:13px;font-weight:bold;text-align:left;cursor:pointer;min-height:66px}.groups button span{font-size:9px;font-weight:normal;display:block;line-height:1.4;margin-top:5px;color:var(--muted)}.groups button[aria-pressed=true]{border-color:var(--accent);background:#edf4ff;box-shadow:inset 0 0 0 1px var(--accent)}.fixed-settings{background:#f1f5fb;border-radius:9px;padding:15px;display:flex;flex-direction:column;gap:7px;font-size:12px}.fixed-settings span{color:var(--muted);font-size:11px}.fixed-settings[hidden],[hidden]{display:none!important}.badge-row{display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:13px;margin-bottom:10px}.badge-row select{max-width:160px}.toggle{position:relative;display:flex;justify-content:space-between;align-items:center;font-size:13px;min-height:47px;border-bottom:1px solid #edf0f5;cursor:pointer}.toggle input{position:absolute;right:0;opacity:0;width:42px;height:30px}.switch{width:36px;height:21px;border-radius:14px;background:#c7ced9;position:relative}.switch:after{content:'';position:absolute;width:15px;height:15px;border-radius:50%;background:white;left:3px;top:3px;transition:transform .16s}.toggle input:checked+.switch{background:var(--accent)}.toggle input:checked+.switch:after{transform:translateX(15px)}.toggle input:focus-visible+.switch{outline:3px solid #8fb8ff}.toggle:has(input:disabled){opacity:.55;cursor:default}#colour-name{margin-left:auto;font-weight:normal;color:var(--muted);font-size:12px}.colours{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}.colours button{height:41px;padding:4px;border:1px solid var(--line);border-radius:8px;background:white;cursor:pointer}.colours button[aria-pressed=true]{border:2px solid #171b24}.colour-chip{display:block;height:100%;border-radius:4px;background:var(--swatch)}.colour-chip.clear{background:linear-gradient(130deg,#a6c9d5,#fff 35%,#d8e8f5 58%,#faffff 70%,#9baec2)}.primary{width:100%;display:flex;justify-content:space-between;align-items:center;border:0;border-radius:9px;background:var(--accent);color:white;padding:17px 18px;font-size:14px;font-weight:bold;cursor:pointer}.primary:disabled{background:#d4dae4;cursor:not-allowed}.order-area{margin-top:25px}.order-area .hint{text-align:center}.review-panel{max-width:680px;margin:35px auto 0;padding:28px;background:white;border:1px solid var(--line);border-radius:14px}.review-panel h2{margin-top:0;font-size:24px}.review-panel p{color:var(--muted);font-size:13px}dl{display:grid;grid-template-columns:1fr 1fr;gap:14px;font-size:14px}dt{color:var(--muted)}dd{margin:0;overflow-wrap:anywhere}.secondary{padding:12px 18px;border:1px solid #bdcbe0;background:#f1f5fb;border-radius:8px;color:var(--accent);cursor:pointer}#copy-status{font-size:12px;margin-left:12px}footer{text-align:center;padding:28px;color:var(--muted);font-size:12px;border-top:1px solid var(--line)}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:800px){header{padding:22px}.header-note{font-size:9px;letter-spacing:1px}main{padding:30px 18px}.intro{margin-bottom:24px}h1{font-size:36px}.studio{grid-template-columns:1fr;gap:20px}.preview-panel{position:relative;top:0}.plate-stage{min-height:180px;padding:25px 8px}.controls{padding:21px}.preview-note{margin-bottom:0}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* Fresh Plates storefront palette: blue #003d9f, yellow #ffdd08. */
header{max-width:none;padding:24px max(24px,calc((100vw - 1136px)/2));background:#003d9f;border-bottom:4px solid #ffdd08}.brand{color:#fff}.brand span{color:#ffdd08}.header-note{color:#fff;opacity:.85}h1{color:#171b24}.eyebrow{color:#003d9f}.primary{background:#ffdd08;color:#002c73;box-shadow:0 3px 0 #e0bf00;transition:background .15s,transform .15s}.primary:hover:not(:disabled){background:#ffe538;transform:translateY(-1px)}.primary:disabled{background:#d4dae4;color:#626b7a;box-shadow:none}.groups button:hover{border-color:#8fb8ff}.groups button[aria-pressed=true]{color:#003d9f}.controls{box-shadow:0 8px 30px #13376d08}.preview-top{color:#003d9f}.secondary{color:#003d9f}.secondary:hover{background:#e6efff}@media(max-width:800px){header{padding:20px 22px}}

.view-controls{display:flex;justify-content:center;gap:4px;margin-top:20px}.view-controls button{font:inherit;font-size:13px;border:1px solid #c7d5e8;border-radius:6px;padding:7px 16px;background:white;color:#164485;cursor:pointer}.view-controls button[aria-pressed=true]{background:#164485;color:white}.view-controls button:disabled{opacity:.4;cursor:default}.colour-chip{background:linear-gradient(135deg,#ffffffaa,var(--swatch) 38%,#ffffff88 55%,var(--swatch))!important}
