.prototype-note{padding:8px 20px;text-align:center;background:var(--ink);color:var(--paper);font-size:10px;letter-spacing:.02em}.prototype-note span{padding:0 8px}.config-header{height:94px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.config-brand{display:flex;gap:20px;align-items:center}.config-brand img{width:126px}.config-brand span{color:var(--green);border-left:1px solid #b3baad;padding-left:20px;text-transform:uppercase;letter-spacing:.13em;font-size:11px}.back-link{font-size:12px;color:var(--green)}.config-layout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:74px;align-items:start;padding-top:42px;padding-bottom:55px}.preview-column{position:sticky;top:24px;min-width:0}.preview-stage{background:#e6ddce;position:relative;border-radius:5px;padding:22px 25px 18px;overflow:hidden;background-image:radial-gradient(ellipse at 20% 5%,#fff9e78a,transparent 65%)}.preview-top,.preview-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--green);position:relative;z-index:1}.preview-top .eyebrow{font-size:9px;letter-spacing:.11em}.preview-top button{border:0;background:none;padding:8px 0;text-decoration:underline;text-underline-offset:4px;font-size:10px;color:#475d55}.preview-bottom{font-size:10px;padding-top:10px;color:#52645b}.frame-preview{height:505px;display:flex;align-items:center;justify-content:center;padding:12px 0}.frame-preview svg{height:100%;width:100%;max-width:410px;fill:none;stroke:none;overflow:visible}.preview-meta{display:flex;align-items:center;gap:8px;margin-top:15px;font-size:11px;color:var(--green)}.live-dot{height:6px;width:6px;background:var(--green);border-radius:50%}.preview-meta button{margin-left:auto;background:none;border:0;color:var(--green);font-size:11px;text-decoration:underline;text-underline-offset:4px;padding:8px 0}.preview-disclaimer{font-size:10px;line-height:1.65;color:#63685d;margin-top:4px;max-width:55ch}.product-promises{display:flex;justify-content:space-between;gap:16px;margin-top:26px;padding-top:18px;border-top:1px solid var(--line);font-size:10px;color:#63685d}.configuration{padding:5px 0;min-width:0}.configuration>.eyebrow{font-size:10px}.configuration h1{font-size:clamp(33px,3vw,46px);margin:17px 0}.product-intro{font-size:13px;line-height:1.8;max-width:380px}.step-navigation{display:flex;margin:29px 0 32px;border-bottom:1px solid var(--line);gap:4px}.step-navigation button{flex:1;text-align:left;border:0;border-bottom:2px solid transparent;padding:0 0 13px;background:none;font-size:11px;color:#62675e;min-height:44px}.step-navigation button span{font-family:var(--display);font-size:17px;margin-right:8px}.step-navigation button[aria-current=step]{color:var(--green);border-color:var(--green);font-weight:700}.step-navigation button.completed{color:var(--green)}.step-heading{margin-bottom:24px}.step-heading h2{font-size:30px}.step-heading p{font-size:12px;color:#62675e;margin-top:10px;line-height:1.7}.field{display:flex;flex-direction:column;font-size:11px;font-weight:600;gap:8px;margin-top:20px;color:var(--ink)}.field input,.field select,.read-only{border:1px solid #b5b9aa;border-radius:4px;padding:12px 13px;background:#faf6ee;color:var(--ink);min-height:46px;width:100%;font-size:13px;min-width:0}.field input::placeholder{color:#72786d}.field-pair{display:grid;grid-template-columns:1fr 1.25fr;gap:16px}.field-note{font-size:10px;color:#62675e;line-height:1.7;margin-top:9px}.optional{font-size:9px;font-weight:400;color:#697165;display:contents}.source-options{display:flex;border:0;padding:0;gap:10px;margin:0}.source-options label{flex:1;position:relative}.source-options input,.display-options input{position:absolute;opacity:0}.source-options label span{display:block;text-align:center;border:1px solid #a8b5a8;border-radius:4px;font-size:11px;padding:13px 8px;cursor:pointer}.source-options input:checked+span{background:#e2e9dd;border-color:var(--green);color:var(--green);box-shadow:inset 0 0 0 1px var(--green)}.source-options input:focus-visible+span,.display-options input:focus-visible~strong{outline:3px solid var(--clay);outline-offset:4px}.quiet-note{display:flex;gap:13px;margin-top:28px;padding:17px 0;border-top:1px solid var(--line);font-size:11px;color:#62675e}.quiet-note>span{color:var(--green);font-size:23px;line-height:1.2}.quiet-note p{max-width:45ch}.step-actions{display:flex;gap:20px;align-items:center;justify-content:space-between;margin-top:26px}.step-actions .btn{flex:1;gap:30px}.step-back{background:none;border:0;color:var(--green);font-size:12px;padding:14px 0}.config-footer{display:flex;justify-content:space-between;gap:15px;margin-top:30px;padding-top:19px;border-top:1px solid var(--line);font-size:9px;color:#62675e}.display-options{border:0;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px}.display-options legend{font-size:11px;font-weight:600;margin-bottom:12px}.display-options label{position:relative;display:grid;grid-template-columns:31px 1fr;gap:2px 8px;border:1px solid #b5b9aa;border-radius:4px;padding:15px 13px;cursor:pointer}.display-options label:has(input:checked){background:#e2e9dd;border-color:var(--green);box-shadow:inset 0 0 0 1px var(--green)}.display-icon{font-size:27px;grid-row:1/3;line-height:1.4;color:var(--green)}.display-options strong{font-size:11px}.display-options small{font-size:9px;color:#62675e}.palette-heading{display:flex;gap:15px;align-items:center;justify-content:space-between;margin-top:30px;padding-top:24px;border-top:1px solid var(--line)}.palette-heading .eyebrow{font-size:9px}.palette-heading h3{font-family:var(--display);font-size:25px;color:var(--green);margin-top:8px;font-weight:500}#palette-dots{display:flex}#palette-dots i{width:27px;height:27px;border-radius:50%;border:2px solid var(--paper);margin-left:-5px;box-shadow:0 0 0 1px #abb1a4}.palette-description{font-size:11px;color:#62675e;line-height:1.7;margin:12px 0 15px}.colour-row{display:flex;align-items:center;justify-content:space-between;gap:14px;border-top:1px solid var(--line);padding:13px 0}.colour-row>div>span{font-size:11px;font-weight:600;display:block}.colour-row small{font-size:9px;color:#62675e}.swatches{display:flex;flex-wrap:wrap;gap:3px;justify-content:flex-end}.swatch{width:32px;height:36px;background:transparent;border:1px solid transparent;border-radius:20px;display:grid;place-items:center;padding:4px}.swatch i{width:23px;height:23px;display:block;border-radius:50%;border:1px solid #0002}.swatch[aria-pressed=true]{border-color:var(--green)}.swatch[aria-pressed=true] i:after{content:'✓';font-size:12px;color:var(--swatch-ink);display:block;text-align:center;line-height:21px}.palette-footer{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-top:5px}.palette-footer>span{font-size:9px;color:#62675e}.palette-footer button{font-size:10px;background:none;border:0;text-decoration:underline;text-underline-offset:3px;color:var(--green);padding:10px 0;min-height:40px}.gpx-box{border:1px dashed #a2aea0;border-radius:5px;background:#faf6ee;padding:23px;text-align:center;margin-top:20px}.upload-symbol{display:block;font-size:27px;color:var(--green)}.gpx-box label{font-family:var(--display);font-size:23px;color:var(--green)}.gpx-box p{font-size:10px;margin-top:8px;color:#62675e}.gpx-box input{font-size:11px;display:block;max-width:100%;margin:19px auto 0}.gpx-box input::file-selector-button{padding:10px 12px;border:1px solid #a2aea0;background:var(--paper);border-radius:3px;margin-right:10px;font:inherit;color:var(--green)}.form-error{font-size:11px;color:#8d3828;border-left:3px solid #b85b42;padding:10px 12px;background:#f4dfd2;margin-top:20px}.summary-group{border-top:1px solid var(--line);padding:17px 0}.summary-group-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px}.summary-group-header h3{font-size:12px;color:var(--green)}.summary-group-header button{font-size:10px;color:var(--green);border:0;background:none;text-decoration:underline;text-underline-offset:4px;min-height:30px}.summary-group p{font-size:11px;color:#565e54;line-height:1.8}.summary-group .summary-colours{display:flex;gap:14px;flex-wrap:wrap;margin-top:9px}.summary-colours span{display:flex;align-items:center;gap:5px;font-size:10px}.summary-colours i{height:12px;width:12px;border:1px solid #0002;border-radius:50%}.medal-reminder{display:flex;align-items:flex-start;gap:13px;background:#e3e9dd;border-radius:4px;padding:16px;margin:5px 0 22px}.medal-reminder>span{font-size:27px;line-height:1;color:var(--green)}.medal-reminder p{font-size:10px;line-height:1.8}.medal-reminder strong{color:var(--green)}.confirmation{font-size:11px;display:flex;gap:10px;align-items:flex-start;cursor:pointer}.confirmation input{accent-color:var(--green);margin-top:3px;width:16px;height:16px;flex-shrink:0}.save-status{font-size:11px;margin-top:12px;color:var(--green)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}[hidden]{display:none!important}#preview-dialog{max-width:700px;max-height:94vh}#preview-dialog .dialog-head{padding:12px 22px}#preview-dialog h2{font-size:25px}#close-preview{font-size:28px}#large-preview{background:#e6ddce;height:min(70vh,700px);padding:20px;display:flex;justify-content:center}#large-preview svg{width:100%;height:100%;stroke:none}#preview-dialog>p{font-size:10px;margin:14px 20px;color:#62675e}
@media(max-width:1100px){.config-layout{gap:35px}.frame-preview{height:470px}.preview-stage{padding:15px}.preview-top{gap:5px}.preview-top .eyebrow{font-size:8px}.preview-top button{font-size:9px}.colour-row{align-items:flex-start}.swatches{max-width:210px}.product-promises{font-size:9px;gap:10px}.config-footer{flex-direction:column;gap:4px}}
@media(max-width:760px){.prototype-note{font-size:9px;line-height:1.6;padding:7px 20px}.config-header{height:76px}.config-brand{gap:11px}.config-brand img{width:100px}.config-brand span{font-size:8px;padding-left:11px}.back-link{font-size:9px;max-width:88px;text-align:right}.config-layout{display:flex;flex-direction:column;gap:28px;padding-top:22px;padding-bottom:35px}.preview-column{position:relative;top:0;width:100%}.preview-stage{padding:13px 16px}.frame-preview{height:325px;padding:4px 0}.preview-top .eyebrow{font-size:8px;letter-spacing:.06em}.preview-top button{font-size:9px}.preview-bottom{font-size:9px;padding-top:3px}.preview-meta{font-size:10px;margin-top:7px;gap:6px}.preview-meta button{font-size:10px}.preview-disclaimer{font-size:9px}.product-promises{display:none}.configuration{width:100%}.configuration h1{font-size:35px;margin:12px 0 15px}.configuration>.eyebrow{font-size:9px}.product-intro{font-size:12px}.step-navigation{margin:23px 0 25px;gap:8px}.step-navigation button{font-size:10px}.step-navigation button span{font-size:15px;margin-right:5px}.step-heading h2{font-size:29px}.step-heading p{font-size:11px}.field input,.field select{font-size:16px;padding:11px 12px}.field .read-only{font-size:11px;display:flex;align-items:center}.field-pair{gap:12px}.display-options label{padding:13px 10px;grid-template-columns:24px 1fr;gap:2px 6px}.display-icon{font-size:23px}.display-options strong{font-size:10px}.display-options small{font-size:8px}.colour-row{gap:6px;align-items:center}.swatches{max-width:210px;gap:1px}.swatch{width:29px;height:38px}.swatch i{height:21px;width:21px}.palette-heading{margin-top:25px}.palette-description{font-size:10px}.step-actions{margin-top:23px}.config-footer{flex-direction:row;font-size:8px}.step-actions .btn{font-size:12px;padding:14px 13px;gap:16px}}
.mobile-preview-button{display:none}
@media(max-width:760px){.mobile-preview-button{position:sticky;top:8px;z-index:5;display:flex;justify-content:space-between;align-items:center;width:100%;margin:0 0 22px;padding:12px 15px;min-height:44px;border:1px solid var(--green);border-radius:4px;background:var(--paper);color:var(--green);box-shadow:0 4px 12px #242b2910;font-size:12px}}
/* Storefront integration */
.config-layout{padding-top:38px;gap:64px}.config-layout .preview-column{top:24px}.config-layout .preview-stage{border-radius:4px}.configuration h1{font-size:42px;line-height:1.08}.configuration .order-status{margin-top:16px;font-size:11px;color:var(--green);padding-top:14px;border-top:1px solid var(--line)}.restore-status{margin-top:15px;font-size:12px;padding:13px;background:#e2e9dd;border-radius:3px}.design-followup{display:flex;align-items:center;gap:25px;flex-wrap:wrap;margin-top:15px}.design-followup .text-link{font-size:11px}.field input[type=file]{font-size:11px;line-height:1.7}.field input[type=file]::file-selector-button{border:1px solid #acb5a3;background:var(--paper);color:var(--green);padding:8px;border-radius:3px;margin-right:8px}.config-layout .step-heading p{font-size:12px}.config-layout .product-promises{font-size:10px}.config-layout .step-navigation button{font-size:12px}.config-layout .field{font-size:12px}.config-layout .field-note{font-size:11px}.config-layout .step-back{min-height:44px}.config-layout .summary-group p{font-size:12px}.config-layout .confirmation{font-size:12px}.config-layout .colour-row small{font-size:10px}.config-layout .display-options strong{font-size:12px}.config-layout .display-options small{font-size:10px}.config-layout .preview-disclaimer{font-size:11px}.config-layout .medal-reminder p{font-size:11px}
@media(max-width:1100px){.config-layout{gap:35px}.config-layout .configuration h1{font-size:36px}}
@media(max-width:760px){.config-layout{gap:28px;padding-top:24px}.config-layout .preview-column{top:0}.config-layout .configuration h1{font-size:36px}.config-layout .preview-disclaimer{font-size:10px}.config-layout .step-navigation{gap:5px}.config-layout .step-navigation button{font-size:11px}.config-layout .field input,.config-layout .field select{font-size:16px}.config-layout .field input[type=file]{font-size:11px}.config-layout .display-options strong{font-size:11px}.config-layout .display-options small{font-size:9px}.config-layout .swatch{width:31px;height:44px}.config-layout .colour-row{align-items:flex-start}.config-layout .palette-footer button{min-height:44px}.design-followup{gap:17px}.config-layout .config-footer{font-size:9px}}
