@font-face{font-family:Inter;font-style:normal;font-weight:300 700;font-display:swap;src:url('./assets/fonts-inter-latin.woff2') format('woff2')}
@font-face{font-family:Inter;font-style:normal;font-weight:300 700;font-display:swap;src:url('./assets/fonts-inter-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:400 900;font-display:swap;src:url('./assets/fonts-playfair-display-latin.woff2') format('woff2')}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:400 900;font-display:swap;src:url('./assets/fonts-playfair-display-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
:root{font-family:Inter,Arial,sans-serif;color:#121824;background:#f7f7f7;font-synthesis:none;--color:#24314a;--muted:#6b7280;--green:#3db364}
*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #3d7cc9;outline-offset:3px}button:disabled{cursor:wait;opacity:.6}button,img,canvas{touch-action:manipulation}button{transition:background .2s,border-color .2s,color .2s}p,h1,h2,figure{margin:0}[hidden]{display:none!important}
.create-shell{display:grid;grid-template-columns:minmax(0,1fr);min-height:100svh;overflow-x:clip}
.preview{position:relative;display:flex;align-items:center;justify-content:center;background:#edeef0;padding-bottom:47px;min-width:0}
.preview-sticky{position:relative;width:100%;aspect-ratio:5/6;max-height:80svh}
.gallery-stage{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%;padding:28px 34px;touch-action:pan-y}
.poster{position:relative;aspect-ratio:1000/1333;max-width:100%;height:100%;max-height:100%;box-shadow:0 12px 36px #00000038,0 4px 12px #00000024;background:#24314a}
#poster-canvas{display:block;width:100%;height:100%;object-fit:contain}
.render-message{position:absolute;inset:0;display:grid;place-content:center;padding:28px;color:#fff;text-align:center;font-size:14px;line-height:1.6;background:#24314a}
.gallery-photo{max-width:100%;max-height:100%;width:100%;height:100%;object-fit:contain}
.gallery-thumbnails{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);display:none;gap:8px;max-width:100%;padding:4px}
.thumbnail{width:30px;height:36px;flex-shrink:0;border:2px solid #dfe1e5;background:white;border-radius:4px;padding:0;overflow:hidden}
.thumbnail.selected{border-color:#121824}.thumbnail img,.thumbnail canvas{width:100%;height:100%;object-fit:cover;display:block}
.configuration{width:100%;max-width:450px;justify-self:center;display:flex;flex-direction:column;background:#f7f7f7;min-width:0;padding-top:8px}
.product-tabs{position:relative;display:flex;padding:8px 16px 0;border-bottom:1px solid #1218241f;margin-top:-47px;min-height:39px}
.product-tabs button{position:relative;bottom:-1px;background:none;border:1px solid transparent;border-bottom:0;border-radius:8px 8px 0 0;padding:8px 14px 9px;font-size:13px;line-height:1;color:#6b728099}
.product-tabs button:first-child{margin-left:-15px}.product-tabs button[aria-pressed=true]{background:#f7f7f7;border-color:#1218241f;color:#121824}
.steps{display:flex;align-items:center;justify-content:space-between;padding:8px 16px;gap:12px;min-height:32px;font-size:11px;font-weight:300;line-height:1.2}
.steps button{border:0;background:none;padding:0;font:inherit;color:#12182459}.steps span{white-space:nowrap}
.controls{display:flex;flex-direction:column;gap:24px;padding:16px 16px 32px;flex:1}
.product-heading h1{font-family:'Playfair Display',Georgia,serif;font-size:24px;font-weight:400;line-height:1.4;margin:0 0 14px}
.price-row{display:flex;align-items:center;justify-content:space-between;font-size:14px;line-height:1.4}.price-row strong{font-weight:600}.stock{font-size:12px;color:#69ac70;display:flex;align-items:center;gap:5px}.stock i{display:block;width:10px;height:10px;border-radius:100%;background:currentColor}
fieldset{padding:0;margin:0;border:0;min-width:0}legend{padding:0;margin:0 0 10px;font-size:14px;font-weight:400;line-height:1.2}
.segmented{display:grid;gap:4px;background:#ededed;padding:4px;border-radius:6px}.two{grid-template-columns:repeat(2,minmax(0,1fr))}.three{grid-template-columns:repeat(3,minmax(0,1fr))}.four{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.segmented button{min-width:0;min-height:40px;border:1.5px solid transparent;border-radius:4px;background:transparent;font-size:14px;font-weight:400;line-height:1.4;color:var(--muted);padding:4px}
.segmented button[aria-pressed=true],.segmented button[aria-checked=true]{border-color:#121824;background:white;color:#121824}
.print-types{background:#12182408}
.color-options{gap:4px}.color-options button,.theme-options button{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:6px;padding:8px 4px;font-size:12px;line-height:1.2}
.color-swatch{width:50px;height:50px;border-radius:50%;display:block;flex-shrink:0;background:linear-gradient(180deg,#ffffff40,transparent 64%),var(--swatch)}
.midnight{--swatch:#24314a}.black{--swatch:#11141a}.slate{--swatch:#4b5e80}.teal{--swatch:#225452}
.style-options{gap:4px;padding:4px;background:#ededed;border-radius:6px}.style-sample{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-width:0;height:94px;border:1.5px solid transparent;border-radius:4px;background:linear-gradient(180deg,#ffffff40,transparent),var(--color);color:white;padding:12px 0}
.style-sample[aria-pressed=true]{border-color:#121824;box-shadow:inset 0 0 0 1px #ffffff60}.mini-map{display:block;width:50px;height:50px;border:1px solid currentColor;border-radius:50%}
.mini-text{width:12px;height:11px;display:block;background:linear-gradient(currentColor,currentColor) top center/12px 1px no-repeat,linear-gradient(currentColor,currentColor) center/12px 1px no-repeat,linear-gradient(currentColor,currentColor) bottom center/8px 1px no-repeat}
.filled-white .mini-map{background:#fff}.white-filled,.white-white{background:white;color:var(--color)}.white-filled .mini-map{background:var(--color)}
.theme-options img{width:50px;height:50px;object-fit:contain;mix-blend-mode:multiply}.theme-options button{padding:8px 4px}
.element-options{gap:4px}.element-options button{padding:0;font-size:14px}
.continue{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:24px 32px;background:var(--green);color:#fff;border:0;border-radius:40px;box-shadow:0 2px 4px #0004;font-size:16px;font-weight:500;letter-spacing:1.6px;line-height:18px}.continue:hover:not(:disabled){background:#32a759}.continue:active:not(:disabled){transform:translateY(1px)}
.preview-footer{display:none;justify-content:space-between;gap:12px;padding:0 16px 16px;font-size:12px;color:#6b7280}.preview-footer a{color:inherit;text-decoration:none}.preview-footer button{font:inherit;color:inherit;padding:0;background:none;border:0}
dialog{width:min(440px,calc(100% - 32px));border:0;border-radius:12px;padding:36px 28px 28px;color:#121824;box-shadow:0 20px 80px #0004}dialog::backdrop{background:#0c142c70;backdrop-filter:blur(3px)}dialog h2{font:400 25px/1.3 'Playfair Display',Georgia,serif;margin-bottom:16px}dialog p{font-size:15px;line-height:1.65;color:#606773}.close-dialog{position:absolute;top:8px;right:12px;border:0;background:none;font-size:28px;padding:0 8px}.dialog-confirm{margin-top:24px;min-height:44px;padding:12px 20px;border:0;border-radius:28px;background:#121824;color:white;width:100%;font-size:14px}
.sr-only,.skip-link:not(:focus){position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.skip-link:focus{position:fixed;top:8px;left:8px;z-index:20;background:white;padding:12px}.noscript{position:fixed;inset:auto 12px 12px;background:white;padding:20px;box-shadow:0 2px 20px #0003;z-index:5}
@media(min-width:1024px){.create-shell{grid-template-columns:minmax(0,1fr) 400px}.preview{padding-bottom:0}.preview-sticky{position:sticky;top:0;height:100vh;max-height:none;max-width:780px;aspect-ratio:auto}.gallery-stage{padding:16px}.poster{box-shadow:0 24px 80px #0006,0 8px 28px #0004}.gallery-thumbnails{display:flex;bottom:2.5%}.thumbnail{width:48px;height:48px}.configuration{width:auto;max-width:none;justify-self:stretch}.product-tabs{margin-top:0}.preview-footer{font-size:11px}}
@media(max-width:359px){.controls{padding-inline:12px}.color-swatch{width:44px;height:44px}.color-options button{padding-inline:0}.mini-map{width:44px;height:44px}.element-options button{font-size:12px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;scroll-behavior:auto!important}}

/* Conditional format controls retain the source layout and touch target sizes. */
.gemstone-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(48px,1fr));gap:8px}
.gemstone-options button{display:grid;place-items:center;border:1.5px solid transparent;border-radius:50%;padding:4px;background:none;min-width:44px;min-height:44px;aspect-ratio:1}
.gemstone-options button[aria-pressed=true]{border-color:#121824;background:#fff}
.gemstone-options button span:not(.color-swatch){position:absolute;width:1px;height:1px;clip:rect(0,0,0,0);overflow:hidden}
.gemstone-options .color-swatch{width:100%;height:100%;object-fit:cover;max-width:52px;max-height:52px}
.option-caption{font-size:.875rem;line-height:1.5;margin-bottom:12px;color:#6b7280}
.style-options.compact-styles{grid-template-columns:repeat(2,minmax(0,1fr));width:50%;min-width:min(176px,100%)}
.element-options.two-elements{grid-template-columns:repeat(2,minmax(0,1fr))}
.jewelry-preview .poster{box-shadow:none;background:transparent}
.jewelry-preview .preview{background:radial-gradient(ellipse at 50% 62%,#edf0f1,#c7cbcf 85%)}
.jewelry-preview .gallery-stage{padding:0}
.jewelry-preview .poster{width:100%;max-width:none;aspect-ratio:auto}

/* Responsive contract: usable at 320 CSS px, zoomable text and safe-area insets. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
:root{--safe-top:env(safe-area-inset-top,0px);--safe-right:env(safe-area-inset-right,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px)}
.create-shell{min-height:100vh;min-height:100svh}
.preview-sticky{max-height:80vh;max-height:80svh}
.gallery-stage{padding-inline:max(20px,var(--safe-left)) max(20px,var(--safe-right));padding-top:max(28px,var(--safe-top))}
.configuration{padding-inline:var(--safe-left) var(--safe-right)}
.product-tabs{min-height:44px}.product-tabs button{min-height:44px;font-size:.8125rem;line-height:1.25;white-space:normal}
.steps{gap:8px;min-height:44px;font-size:.75rem}.steps button{min-height:44px;flex:1;text-align:center}.steps span{flex:1;white-space:normal}.steps button,.steps span{min-width:0;overflow-wrap:anywhere;hyphens:auto;line-height:1.35}
.controls{gap:1.5rem;padding-bottom:2rem}
.product-heading h1{font-size:1.5rem;overflow-wrap:anywhere}.price-row{font-size:.875rem;gap:12px;flex-wrap:wrap}.stock{font-size:.75rem}
legend{font-size:.875rem;line-height:1.4;overflow-wrap:anywhere}
.segmented button{min-height:44px;font-size:.875rem;height:auto;overflow-wrap:anywhere;hyphens:auto}
.color-options button,.theme-options button{font-size:.75rem;line-height:1.4}
.color-options,.theme-options{grid-template-columns:repeat(auto-fit,minmax(min(100%,3.75rem),1fr))}.print-types{grid-template-columns:repeat(2,minmax(0,1fr))}
.color-swatch,.mini-map{width:min(50px,100%);height:auto;aspect-ratio:1}
.mini-map{flex-shrink:0}.element-options{padding:0;background:transparent;grid-template-columns:repeat(auto-fit,minmax(min(100%,5rem),1fr))}.element-options button{font-size:.875rem}
.continue{min-height:56px;font-size:1rem;line-height:1.35;letter-spacing:.1em;padding:20px 24px}
.preview-footer{font-size:.75rem;padding-bottom:max(16px,var(--safe-bottom));align-items:center}.preview-footer a,.preview-footer button{display:inline-flex;align-items:center;min-height:44px}
dialog{max-width:calc(100vw - 32px);max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);overflow:auto;overscroll-behavior:contain;padding:40px 24px max(24px,var(--safe-bottom))}
dialog h2{font-size:1.5625rem;overflow-wrap:anywhere}dialog p{font-size:.9375rem;overflow-wrap:anywhere}.close-dialog{width:44px;height:44px;top:0;right:4px;display:grid;place-items:center;padding:0}.dialog-confirm{font-size:.875rem}
@media(min-width:1024px){.preview-sticky{max-height:none}.gallery-stage{padding-top:max(16px,var(--safe-top));padding-bottom:max(16px,var(--safe-bottom))}.configuration{padding-left:0}.controls{padding-right:max(16px,var(--safe-right))}.gallery-thumbnails{bottom:max(2.5%,var(--safe-bottom))}}
@media(max-width:359px){.controls{padding-inline:12px}.style-options{gap:3px}.theme-options button,.color-options button{padding-inline:2px}}

/* Step 2 shares the preview and maintains 44px touch targets at every width. */
.steps button[aria-current=step]{color:#121824}
.personalize-heading h1{font:400 1.5rem/1.4 'Playfair Display',Georgia,serif;margin-bottom:12px}
.personalize-heading p{font-size:.875rem;line-height:1.6}
.personal-field{min-width:0}.personal-field>label{display:block;font-size:.875rem;line-height:1.5;margin-bottom:10px}
.personalization input,.personalization select,.personalization textarea{font:400 16px/1.5 Inter,Arial,sans-serif;color:#121824;background:white;border:1px solid #d1d5db;border-radius:6px;min-width:0;width:100%;padding:10px 12px;min-height:46px}
.personalization input:focus,.personalization select:focus,.personalization textarea:focus{outline:2px solid #546b92;outline-offset:1px}
.personalization input[aria-invalid=true],.personalization textarea[aria-invalid=true]{border-color:#a52c35}
.personalization textarea{display:block;resize:vertical;min-height:100px;height:100px}
.personalization input::placeholder,.personalization textarea::placeholder{color:#87909f;opacity:1}
.personal-place-wrap{position:relative}.place-symbol{position:absolute;left:12px;top:50%;transform:translateY(-50%);font-size:22px;color:#6b7280;pointer-events:none}.personal-place-wrap input{padding-left:40px}
.personal-date-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) minmax(0,.65fr);gap:8px}
.personal-date-row select{padding-inline:8px}.personal-date-row input{text-align:center;padding-inline:4px;appearance:textfield}.personal-date-row input::-webkit-inner-spin-button{appearance:none}
.personal-toggle{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:44px;padding:4px 0;background:none;border:0;text-align:left;font-size:.875rem;line-height:1.5}
.toggle-track{width:42px;height:24px;flex:0 0 42px;border-radius:30px;background:#b5bdc7;padding:3px;transition:background .2s}.toggle-track::after{content:'';display:block;width:18px;height:18px;background:#fff;border-radius:50%;box-shadow:0 1px 3px #0003;transition:transform .2s}.personal-toggle[aria-checked=true] .toggle-track{background:#121824}.personal-toggle[aria-checked=true] .toggle-track::after{transform:translateX(18px)}
.advanced-fields{display:grid;gap:16px}.personal-time-row{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) minmax(0,1fr);gap:8px;align-items:center;margin-top:8px}
.personal-help{font-size:.75rem;line-height:1.5;color:#6b7280;margin-top:8px}.field-error{font-size:.75rem;line-height:1.5;color:#a52c35;margin-top:8px;overflow-wrap:anywhere}
.personal-actions{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:12px;margin-top:auto;padding-top:8px}.personal-actions button{min-height:56px;padding:16px 10px;letter-spacing:.06em;font-size:.875rem;gap:8px}.back{border:0;border-radius:40px;background:#e3e5e8;display:flex;align-items:center;justify-content:center;line-height:1.35}.back:hover{background:#d6d9de}
.personal-popover{position:fixed;z-index:30;background:white;color:#121824;border:1px solid #d1d5db;border-radius:8px;box-shadow:0 8px 30px #12182426;overflow:auto;overscroll-behavior:contain;font:400 14px/1.5 Inter,Arial,sans-serif}
.personal-suggestions p{padding:12px}.personal-suggestions small{display:block;padding:8px 12px;font:400 12px/1.4 Inter,Arial,sans-serif;color:#5e5e5e;border-top:1px solid #eee;text-align:right;white-space:nowrap}.personal-suggestions small a{color:inherit}
.personal-place-option{min-height:48px;padding:12px;cursor:pointer;overflow-wrap:anywhere}.personal-place-option:hover,.personal-place-option[aria-selected=true]{background:#eaf0f8}
.personal-calendar{padding:8px}.personal-calendar-controls{display:grid;grid-template-columns:44px 1fr 44px;align-items:center;text-align:center;margin-bottom:4px;text-transform:capitalize}.personal-calendar button{border:0;background:none;padding:0;min-height:44px;min-width:0;border-radius:5px}.personal-calendar-controls button{font-size:24px}.personal-calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));text-align:center}.personal-calendar-grid>span{font-size:12px;color:#6b7280;padding:4px}.personal-calendar-grid button{font-size:14px}.personal-calendar-grid .other-month{color:#9ca3af}.personal-calendar button:hover:not(:disabled){background:#eaf0f8}.personal-calendar [aria-current=date]{background:#121824;color:white}.personal-calendar [aria-current=date]:hover{color:#121824}
@media(min-width:1024px){.personalization{min-height:calc(100svh - 200px)}}
@media(max-width:359px){.personal-date-row{gap:6px}.personal-actions{gap:8px}.personal-actions button{font-size:.8125rem;letter-spacing:.025em}.personalization select{padding-inline:6px}}

/* Final step: source-like size/finish controls, readable on small touch screens. */
.finalization .personalize-heading h1{margin-bottom:0}
.finalization{gap:16px}
.face-thumbnail{font-size:10px;line-height:1.2}.face-thumbnail span{display:block;padding:2px}
.save-signup{display:flex;flex-direction:column;min-width:0}
.final-gallery{position:relative;min-width:0}.final-gallery-track{display:flex;width:100%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;border-radius:6px;overscroll-behavior-x:contain;touch-action:pan-x pan-y}.final-gallery-track::-webkit-scrollbar{display:none}.final-gallery-track img{display:block;flex:0 0 100%;width:100%;height:auto;aspect-ratio:1;object-fit:cover;scroll-snap-align:start}
.final-photo-arrow{position:absolute;top:50%;transform:translateY(-50%);border:0;border-radius:50%;background:#12182460;color:#fff;width:44px;height:44px;font-size:30px;line-height:1}.final-photo-arrow.previous{left:4px}.final-photo-arrow.next{right:4px}
.final-summary>p,.final-summary strong,.final-summary #final-frame-summary,.final-summary .final-total{display:none!important}.final-stock{justify-content:flex-start!important}
#final-size-field>legend{width:100%;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:4px 12px;margin-bottom:4px}.size-guide-link{display:flex;align-items:center;gap:6px;border:0;background:none;padding:0;min-height:44px;font-size:.75rem;color:#6b7280}
.size-options button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:56px;font-size:.8125rem;padding:8px 3px}.size-options button span{white-space:nowrap}.size-options .size-price{font-size:.75rem;color:#6b7280}
.frame-toggle>span:first-child{flex:1}.frame-toggle #final-frame-extra{white-space:nowrap;margin-left:4px}.frame-toggle .toggle-track{flex-shrink:0}
#final-frame-details>p{margin-top:0;margin-bottom:16px}#final-frame-details legend{display:flex;justify-content:space-between;width:100%;gap:8px}#final-frame-name{color:#6b7280;font-size:.75rem}
.frame-options{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}.frame-options button{aspect-ratio:1;min-width:0;min-height:44px;border:1.5px solid transparent;border-radius:50%;background:none;padding:5px;display:grid;place-items:center}.frame-options button[aria-pressed=true]{border-color:#121824}.frame-options img{width:100%;height:100%;object-fit:contain}.frame-options button:disabled{cursor:not-allowed}
.chain-options button{padding:10px 8px;font-size:.875rem}
.size-options small{font-size:.75rem;color:#6b7280}.size-options button[aria-pressed=true] small{color:inherit}
.final-product-details{display:grid;gap:12px}.final-product-details h2{font-size:.875rem;font-weight:500;line-height:1.5}.final-product-details>img{display:block;width:100%;height:auto;aspect-ratio:5/4;object-fit:cover;border-radius:6px}.final-product-details p{font-size:.875rem;line-height:1.6}
.final-summary{border-block:1px solid #d6d9df;padding:16px 0;display:grid;gap:10px;font-size:.875rem;line-height:1.5}.final-summary-line{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}.final-summary-line>span{min-width:0;overflow-wrap:anywhere}.final-summary strong{white-space:nowrap;font-weight:600}.final-summary>p{color:#6b7280;font-size:.8125rem}.final-total{border-top:1px solid #e5e7eb;padding-top:12px;font-size:1rem}.final-stock{justify-content:flex-end;line-height:1.5}.final-stock.backorder{color:#936013;align-items:flex-start}.final-stock.backorder i{flex-shrink:0;margin-top:4px}.final-reference-note{font-size:.75rem;line-height:1.5;color:#6b7280;text-align:center}
#size-guide{width:min(520px,calc(100vw - 24px));padding:40px 16px 20px}#size-guide img{display:block;width:100%;height:auto;max-height:55svh;object-fit:contain;border-radius:6px;margin-top:16px}#size-guide-caption{font-size:.875rem;margin-top:12px;text-align:center}#size-guide-help{font-size:.75rem;line-height:1.5;margin-top:12px}.size-guide-choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:8px}.size-guide-choices button{min-height:44px;padding:8px;border:1px solid #d1d5db;background:white;border-radius:6px;font-size:.8125rem}.size-guide-choices button[aria-pressed=true]{border-color:#121824;background:#edf0f4}
@media(max-width:359px){.frame-options{gap:2px}.frame-options button{padding:3px}.size-options button{font-size:.75rem}.size-options .size-price{font-size:.75rem}.size-guide-link{font-size:.75rem}}
#size-guide #size-guide-photo{width:auto;max-width:100%;height:auto;max-height:55svh;aspect-ratio:700/1000;object-fit:contain;margin-inline:auto;background-size:100% 100%;background-position:center;background-repeat:no-repeat}
.poster{flex-shrink:0}
@media(min-width:1024px){.preview{align-items:flex-start}}

/* Save Your Design: the reference's white full-screen overlay, with local-only actions. */
body.saving-design{overflow:hidden}
.save-design-dialog{position:fixed;inset:0;margin:0;width:100%;max-width:none;height:100vh;height:100dvh;max-height:none;padding:max(16px,var(--safe-top)) max(12px,var(--safe-right)) max(16px,var(--safe-bottom)) max(12px,var(--safe-left));border-radius:0;background:#fff;box-shadow:none;overscroll-behavior:contain}
.save-design-dialog[open]{display:flex;align-items:safe center;justify-content:center}.save-design-dialog::backdrop{background:#fff;backdrop-filter:none}
.save-card{position:relative;width:350px;max-width:100%;margin:auto;flex-shrink:0;padding:24px 16px 16px;background:#fff;box-shadow:0 4px 8px #0000001a;text-align:center}
.save-close{position:absolute;right:8px;top:8px;display:grid;place-items:center;width:44px;height:44px;border:0;padding:0;background:none;z-index:1}
.save-envelope{width:120px;height:120px;margin:0 auto 0;display:grid;place-items:center}.envelope-letter{animation:letter-in 1.1s ease-out both}.envelope-flap{transform-origin:60px 47px;animation:flap-in 1.1s ease-out both}
.save-card h1{font:600 1.25rem/1.4 Inter,Arial,sans-serif;margin:0 0 4px;outline-offset:4px;overflow-wrap:anywhere}
.save-card h1:focus{outline:none}
.save-card .save-intro{font-size:.75rem;line-height:1.6;color:#828892;margin:0 0 8px}
.save-form{display:flex;flex-direction:column;min-width:0}.save-google{display:flex;justify-content:center;align-items:center;gap:14px;width:100%;min-height:44px;background:white;border:1px solid #d9dde2;border-radius:6px;padding:10px 12px;font-size:.875rem;font-weight:500;line-height:1.4}.save-google:hover{background:#f6f8fc}
.google-mark{font:700 21px/1 Arial,sans-serif;color:#4285f4}.save-divider{display:flex;align-items:center;gap:8px;margin:16px 0;color:#7d8490;font-size:.75rem;line-height:1.5}.save-divider::before,.save-divider::after{content:'';height:1px;flex:1;background:#e5e7eb}.save-divider span{min-width:0}
#save-email{width:100%;min-height:46px;min-width:0;border:1px solid #acb7c2;border-radius:6px;background:#fff;color:#121824;text-align:center;padding:10px 8px;font:400 1rem/1.5 Inter,Arial,sans-serif}#save-email:focus{outline:2px solid #546b92;outline-offset:1px}#save-email[aria-invalid=true]{border-color:#a52c35}
.save-card .save-booklet{font-size:.75rem;line-height:1.55;color:#7b818b;text-align:left;margin:12px 0}
.save-consent{display:flex;align-items:center;gap:9px;text-align:left;min-height:44px;padding:4px 0;margin:0 0 12px;font-size:.75rem;line-height:1.5;color:#626a75;cursor:pointer}.save-consent input{margin:0;width:17px;height:17px;flex:0 0 17px;accent-color:#121824}.save-consent input:focus-visible{outline:2px solid #546b92;outline-offset:3px}
.save-submit{width:100%;min-height:50px;border:0;border-radius:999px;background:#121824;color:#fff;padding:14px 10px;font-size:.875rem;font-weight:400;letter-spacing:.12em;line-height:1.5}.save-submit:hover:not(:disabled){background:#29374d}.save-skip{border:0;background:none;width:100%;min-height:44px;padding:12px 8px 4px;font-size:.875rem;font-weight:300;line-height:1.5}.save-skip:disabled{cursor:not-allowed}
.save-card .save-feedback{font-size:.8125rem;line-height:1.5;text-align:left;margin:12px 0;color:#54647b}.save-card .save-error{color:#a52c35}
.save-card .save-local-note{font-size:.75rem;line-height:1.5;color:#7a818b;border-top:1px solid #edf0f3;padding-top:12px;margin-top:8px}
.save-result{display:grid;gap:14px;padding-top:14px}.save-result img{display:block;width:auto;height:auto;max-width:100%;max-height:240px;object-fit:contain;margin:auto}.save-result p{font-size:.875rem;line-height:1.55}.save-result .save-next-stage{font-size:.8125rem;color:#7a818b}
@keyframes letter-in{from{transform:translateY(14px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes flap-in{from{transform:scaleY(-.1)}to{transform:scaleY(1)}}
@media(max-width:359px){.save-card{padding-inline:12px}.save-submit{letter-spacing:.07em;font-size:.8125rem}.save-card h1{font-size:1.1875rem}}
@media(max-height:700px){.save-envelope{width:88px;height:88px}.save-envelope svg{width:88px;height:88px}.save-card{padding-top:16px}}
@media(prefers-reduced-motion:reduce){.save-envelope *{animation:none!important}}
