@font-face{font-family:AtelierSerif;src:local("Baskerville"),local("Georgia");font-display:swap}
:root{--paper:#f4f0e9;--ink:#42392f;--muted:#8d8276;--line:#dcd3c7;--serif:AtelierSerif,Georgia,'Times New Roman',serif;--sans:'Segoe UI',Arial,sans-serif;--side:394px}
*{box-sizing:border-box}body{margin:0;color:var(--ink);background:var(--paper);font-family:var(--sans);font-size:14px;-webkit-font-smoothing:antialiased}button,input,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:wait;opacity:.45}button,a,input{outline-offset:5px}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #9b7753}button{border:0}svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.45;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:var(--serif);font-weight:400}a{color:inherit}.icon-definitions{position:absolute;width:0;height:0;overflow:hidden}[hidden]{display:none!important}
.header{height:78px;display:flex;align-items:center;justify-content:space-between;padding:0 40px;background:rgba(247,243,237,.96);border-bottom:1px solid rgba(140,122,99,.13);position:relative;z-index:3}.brand{text-decoration:none;display:flex;align-items:baseline;gap:13px}.brand span{font-family:var(--serif);font-size:25px;letter-spacing:7px}.brand small{font-size:9px;letter-spacing:3px;color:var(--muted)}.header-tab{font-family:var(--serif);font-size:18px;position:absolute;left:50%;transform:translateX(-50%);height:100%;display:flex;align-items:center}.header-tab:after{content:"";position:absolute;bottom:17px;left:calc(50% - 22px);width:44px;height:1px;background:#7d6f5c}.header-actions{display:flex;gap:17px;align-items:center}.icon-button{width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;background:transparent;border-radius:50%;transition:background .2s,color .2s}.icon-button:hover{background:#e9e0d4}.action-separator{width:1px;height:18px;background:#c9bfb1;margin-right:1px}.icon-button[aria-pressed=true]{color:#6d3944}.icon-button[aria-pressed=true] use[href="#i-heart"]{fill:#6d3944;stroke:#6d3944}
.atelier{display:grid;grid-template-columns:minmax(0,1fr) var(--side);height:calc(100cqh - 78px);min-height:710px}.stage{position:relative;overflow:hidden;background:radial-gradient(ellipse at 34% 35%,#f8f3e9 0,#ece3d5 65%,#ded2bf 100%)}.stage:before{content:"";position:absolute;inset:-35% 35% 35% -25%;transform:rotate(-32deg);background:linear-gradient(90deg,transparent 10%,#fff9e975 15%,#fff9e98c 38%,transparent 43%,transparent 47%,#fff9e975 52%,#fff9e97a 75%,transparent 80%);filter:blur(19px);pointer-events:none}.stage-heading{position:absolute;top:33px;left:0;right:0;text-align:center;z-index:1;pointer-events:none}.eyebrow{font-size:9px;letter-spacing:2.5px;font-weight:500;color:#8d8070}.stage-heading h1{font-size:46px;line-height:1.2;letter-spacing:-1.6px;margin-top:9px}#viewer{position:absolute;inset:46px 0 28px;cursor:grab;outline-offset:-6px;touch-action:none}#viewer:active{cursor:grabbing}#viewer canvas{display:block;width:100%;height:100%}.stage-caption{position:absolute;left:35px;top:180px;z-index:1;display:flex;gap:13px;align-items:flex-start;font-size:10px;line-height:1.7;letter-spacing:.15px;color:#96836b;pointer-events:none}.caption-line{width:21px;height:1px;background:#a28b70;margin-top:8px}.reset-camera{position:absolute;right:24px;top:28px;z-index:2;color:#96846e}.reset-camera svg{width:18px;height:18px}.viewer-controls{position:absolute;bottom:65px;left:0;right:0;display:flex;justify-content:center;gap:10px;z-index:2}.pill{height:42px;min-width:128px;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:0 19px;border:1px solid rgba(255,255,255,.65);border-radius:30px;background:rgba(250,246,239,.79);box-shadow:0 3px 12px #69543706;backdrop-filter:blur(12px);font-size:12px;transition:background .2s,border-color .2s,transform .2s}.pill svg{width:18px;height:18px}.pill:hover{background:#fffaf1;transform:translateY(-1px)}.pill[aria-pressed=true]{border-color:#9e8b72;background:#f6f0e6}.rotate-hint{position:absolute;bottom:28px;left:0;right:0;display:flex;align-items:center;justify-content:center;gap:22px;color:#9b8b77;pointer-events:none}.rotate-hint p{font-family:var(--serif);font-size:13px;letter-spacing:.3px}.rotate-hint>span{font-size:23px;font-weight:300;line-height:1}.stage-signature{position:absolute;bottom:29px;left:28px;font-size:8px;letter-spacing:1.8px;color:#948673}.stage-signature span{padding:0 7px}.loading{position:absolute;inset:0;z-index:5;display:flex;align-items:center;justify-content:center;flex-direction:column;background:radial-gradient(ellipse at 40% 40%,#f4ede2,#e7ddce);transition:opacity .7s,visibility .7s}.loading.finished{opacity:0;visibility:hidden;pointer-events:none}.loading-mark{font-family:var(--serif);font-size:44px;color:#a18a6d;margin-bottom:18px}.loading>p{font-family:var(--serif);font-size:21px;letter-spacing:.1px}.loading small{color:var(--muted);font-size:10px;letter-spacing:1px}.progress{width:160px;height:1px;background:#d0c3b1;margin:22px 0 16px;overflow:hidden}.progress span{height:1px;display:block;width:4%;background:#786147;transition:width .3s}.viewer-error{position:absolute;inset:20% 10%;z-index:6;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;background:#f4ede2e8;backdrop-filter:blur(15px);border:1px solid #e3d8c8;border-radius:3px;text-align:center;padding:28px}.viewer-error h2{font-size:30px}.viewer-error p{line-height:1.7;color:#877762;max-width:300px;font-size:13px}
.configuration{position:relative;z-index:2;display:flex;flex-direction:column;border-left:1px solid #d4c8b740;background:linear-gradient(130deg,#f7f4ee,#f0ebe3);padding:33px 32px 23px;overflow:auto;scrollbar-width:thin;scrollbar-color:#d3c8ba transparent}.configuration-heading .eyebrow{font-size:8px;letter-spacing:1.8px}.configuration-heading h2{font-size:39px;line-height:1.2;letter-spacing:-1.2px;margin-top:10px}.intro{font-size:11px;color:var(--muted);margin-top:10px;letter-spacing:.2px}.options{margin-top:29px}.option-section{border-top:1px solid var(--line);padding:19px 0 20px}.section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:17px}.section-title h3,.section-title label{font-family:var(--serif);font-size:21px}.section-number{font-size:9px;letter-spacing:1.2px;color:#a79a88}.selection-label{font-size:10px;color:#918372;letter-spacing:.4px}.segmented{display:flex;gap:9px}.segmented button{border:1px solid #d4cabe;background:transparent;border-radius:24px;height:37px;flex:1;font-size:11px;transition:background .2s,border-color .2s}.segmented button:hover{background:#ebe3d8}.segmented button.selected{border-color:#7d6d5b;background:#e8dfd330}.option-note{font-size:10px;line-height:1.5;letter-spacing:.05px;color:#9a8c7b;margin-top:12px}.swatches{display:flex;gap:20px;align-items:start}.swatch{width:58px;padding:0;background:transparent;display:flex;flex-direction:column;align-items:center;gap:11px;font-size:10px;letter-spacing:.1px;color:#817362}.sample{display:block;position:relative;width:49px;height:49px;border-radius:50%;box-shadow:inset 0 0 0 1px #0000000d;transition:transform .2s}.sample:after{content:"";position:absolute;inset:-5px;border-radius:50%;border:1px solid transparent;transition:border-color .2s}.swatch:hover .sample{transform:scale(1.04)}.swatch.selected .sample:after{border-color:#8c7860}.swatch.selected{color:var(--ink)}.sample:not(.gold):not(.silver):before{content:"";position:absolute;inset:0;border-radius:50%;opacity:.28;mix-blend-mode:soft-light;background-image:url('data:image/svg+xml,%3Csvg viewBox="0 0 150 150" xmlns="http://www.w3.org/2000/svg"%3E%3Cfilter id="n"%3E%3CfeTurbulence type="fractalNoise" baseFrequency=".7" numOctaves="3" stitchTiles="stitch"/%3E%3C/filter%3E%3Crect width="150" height="150" opacity=".9" filter="url(%23n)"/%3E%3C/svg%3E')}.black{background:radial-gradient(ellipse at 25% 15%,#45423f,#211f1d)}.burgundy{background:radial-gradient(ellipse at 25% 15%,#71424b,#3d1827)}.pink{background:radial-gradient(ellipse at 25% 15%,#ded0df,#baa5c1)}.yellow{background:radial-gradient(ellipse at 25% 15%,#f1eadb,#d8cdb4)}.gold{background:linear-gradient(115deg,#8f6130,#e1bb78 25%,#fff0c9 43%,#c29451 65%,#a57b3b)}.silver{background:linear-gradient(115deg,#858585,#c6c4c0 25%,#fff 43%,#a8a6a2 65%,#8a8987)}.metal-swatches{gap:26px}.metal-swatches .sample{width:44px;height:44px}.optional{font-size:7px;letter-spacing:1.4px;color:#a39685}.initials-section{padding-bottom:10px}.initials-input{height:43px;display:flex;align-items:center;border:1px solid #dcd2c5;border-radius:5px;background:#ffffff18}.initials-input:focus-within{border-color:#97836b}.initials-input input{width:100%;min-width:0;height:100%;background:transparent;border:0;outline:none;padding:0 14px;font-family:var(--serif);font-size:18px;letter-spacing:2px;text-transform:uppercase;color:var(--ink)}.initials-input input::placeholder{text-transform:none;font-family:var(--sans);font-size:11px;letter-spacing:.5px;color:#b2a596}.initials-input .icon-button{width:38px;flex-shrink:0;color:#a39684}.initials-input .icon-button svg{width:14px;height:14px}.configuration-footer{margin-top:auto;padding-top:22px}.creation-summary{display:flex;gap:7px;align-items:center;margin-bottom:13px;color:#9c8b75;font-size:9px;letter-spacing:.2px}.summary-dot{width:4px;height:4px;background:#9e8a6e;border-radius:50%}.creation-summary p span{padding:0 5px;color:#beb19f}.primary-button{width:100%;min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 19px;background:#483c2e;color:#f7f1e7;border-radius:5px;font-family:var(--serif);font-size:16px;letter-spacing:.05px;transition:background .2s,transform .2s;box-shadow:0 4px 12px #483c2e09}.primary-button:hover{background:#61513d;transform:translateY(-1px)}.primary-button svg{width:20px;height:20px;stroke-width:1.2}.save-note{text-align:center;font-size:8px;letter-spacing:.2px;color:#a69986;margin-top:11px}
.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,15px);padding:13px 22px;background:#483c2ef0;color:#fff9ee;border-radius:4px;font-size:12px;z-index:30;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;box-shadow:0 7px 30px #0002;max-width:calc(100cqw - 40px);text-align:center}.toast.visible{opacity:1;transform:translate(-50%,0)}.saved-dialog{width:480px;max-width:calc(100% - 32px);border:1px solid #e8dece;border-radius:8px;background:#f6f1e9;color:var(--ink);padding:32px;box-shadow:0 25px 100px #3b2e2455;text-align:center;max-height:90cqh;overflow:auto}.saved-dialog::backdrop{background:#30291f66;backdrop-filter:blur(6px)}.dialog-close{position:absolute;top:14px;right:14px}.dialog-close svg{width:18px;height:18px}.saved-dialog h2{font-size:32px;letter-spacing:-.8px;margin-top:12px}.dialog-intro{font-size:11px;line-height:1.6;color:var(--muted);margin-top:10px}.saved-dialog>img{width:100%;height:250px;object-fit:contain;background:radial-gradient(ellipse at 34% 35%,#f8f3e9,#e4d9c8);border-radius:4px;margin-top:22px}.saved-description{padding:17px 0 20px}.saved-description h3{font-size:23px}.saved-description p{margin-top:7px;font-size:11px;color:#948571;line-height:1.7}.dialog-actions .primary-button{font-size:15px}.text-button{background:transparent;margin-top:18px;font-size:11px;color:#8b775d}.text-button span{padding-left:6px}.stage:fullscreen{height:100cqh;width:100cqw}.stage:fullscreen #viewer{inset:50px 0 0}.stage:fullscreen .stage-caption{display:none}
@container atelier-viewport (min-width:1600px){.app-frame{--side:440px}.configuration{padding:43px 40px 30px}.configuration-heading h2{font-size:43px}.option-section{padding-top:23px;padding-bottom:25px}.swatches{gap:26px}.stage-heading{top:40px}.stage-heading h1{font-size:51px}}
@container atelier-viewport (max-height:830px) and (min-width:901px){.atelier{min-height:650px}.configuration{padding-top:25px;padding-bottom:18px}.configuration-heading h2{font-size:35px}.intro{margin-top:7px}.options{margin-top:23px}.option-section{padding-top:15px;padding-bottom:15px}.section-title{margin-bottom:14px}.sample{width:45px;height:45px}.swatch{gap:9px}.option-note{margin-top:10px}.configuration-footer{padding-top:16px}.stage-caption{top:160px}}
@container atelier-viewport (max-width:1150px){.app-frame{--side:350px}.header{padding:0 26px}.brand small{display:none}.configuration{padding-left:25px;padding-right:25px}.configuration-heading h2{font-size:36px}.swatches{gap:15px}.sample{width:44px;height:44px}.stage-caption{display:none}.stage-signature{font-size:7px;left:19px;bottom:15px}.stage-heading h1{font-size:41px}.viewer-controls{gap:8px}.pill{min-width:111px;padding:0 14px}.rotate-hint{bottom:24px}}
@container atelier-viewport (max-width:900px){.header{height:66px;padding:0 22px}.brand span{font-size:20px;letter-spacing:5px}.header-tab{font-size:15px;left:53%}.header-tab:after{bottom:12px;width:30px;left:calc(50% - 15px)}.header-actions{gap:7px}.action-separator{display:none}.header-actions .icon-button{width:30px}.header-actions #fullscreen{display:none}.atelier{display:flex;flex-direction:column;height:auto;min-height:0}.stage{height:65cqh;min-height:435px;max-height:620px;flex-shrink:0}.stage-heading{top:25px}.stage-heading h1{font-size:35px;margin-top:6px}.stage-heading .eyebrow{font-size:8px;letter-spacing:2px}#viewer{inset:36px -5% 22px}.reset-camera{top:20px;right:17px}.viewer-controls{bottom:47px;gap:8px}.pill{height:38px;min-width:108px;font-size:11px;gap:7px}.pill svg{width:16px;height:16px}.rotate-hint{bottom:15px;gap:17px}.rotate-hint p{font-size:11px}.rotate-hint>span{font-size:19px}.stage-signature{display:none}.configuration{padding:27px 30px 28px;overflow:visible;border-left:0;border-top:1px solid #e1d7c8;display:grid;grid-template-columns:1fr 1fr;gap:0 32px}.configuration-heading{grid-column:1 / -1;margin-bottom:5px}.configuration-heading h2{font-size:36px}.configuration-heading .eyebrow{font-size:8px}.intro{margin-top:7px}.options{display:contents}.option-section{padding:21px 0}.option-section:first-child{margin-top:24px}.option-section:nth-child(2){margin-top:24px}.configuration-footer{grid-column:1 / -1;padding-top:23px}.primary-button{min-height:49px}.configuration-footer .primary-button{max-width:500px;margin:auto}.creation-summary{justify-content:center;margin-bottom:14px}.save-note{font-size:9px}.sample{width:47px;height:47px}.swatches{gap:17px}.toast{bottom:17px;font-size:11px}}
@container atelier-viewport (max-width:560px){.header{padding:0 18px}.brand span{font-size:19px;letter-spacing:4px}.header-tab{font-size:14px;left:51%}.header-actions{gap:4px}.header-actions .icon-button{width:29px}.header-actions svg{width:19px;height:19px}.configuration{display:flex;gap:0;padding:27px 26px}.configuration-heading{margin-bottom:0}.options{display:block;margin-top:25px}.option-section:first-child,.option-section:nth-child(2){margin-top:0}.option-section{padding:21px 0}.configuration-heading h2{font-size:36px}.section-title h3,.section-title label{font-size:22px}.segmented button{height:40px;font-size:12px}.swatches{gap:21px}.swatch{font-size:11px;width:58px}.sample{width:48px;height:48px}.section-title{margin-bottom:19px}.option-note{font-size:11px}.configuration-footer{padding-top:22px}.creation-summary{font-size:10px}.primary-button{font-size:17px}.save-note{font-size:9px;margin-top:13px}.initials-input{height:46px}.saved-dialog{padding:30px 24px}.saved-dialog h2{font-size:29px}.saved-dialog>img{height:220px}.viewer-controls .pill{min-width:100px;padding:0 13px}.stage{min-height:415px}.stage-heading h1{font-size:34px}}
.marking-controls{margin-top:19px;border-top:1px solid var(--line);padding-top:16px}.marking-location{display:flex;align-items:center;justify-content:space-between;font-size:10px;gap:10px;margin-bottom:20px}.marking-location select{font:inherit;color:#77644e;border:1px solid var(--line);border-radius:4px;background:transparent;padding:7px 22px 7px 8px;max-width:200px}.placement-heading{display:flex;align-items:center;justify-content:space-between;font-size:11px;margin-bottom:17px}.placement-heading .text-button{margin:0;font-size:10px;text-decoration:underline;text-underline-offset:3px}.range-label{display:flex;justify-content:space-between;font-size:10px;color:#8d7d67;margin-top:12px}.range-label output{color:#ab9b84;font-size:9px}.placement-range{appearance:none;width:100%;height:3px;border:0;background:#d9ccba;border-radius:2px;margin:15px 0 9px;cursor:pointer;accent-color:#8a7151}.placement-range::-webkit-slider-thumb{appearance:none;width:14px;height:14px;background:#8b7252;border:3px solid #f4eee3;box-shadow:0 0 0 1px #b4a186;border-radius:50%}.placement-range::-moz-range-thumb{width:11px;height:11px;background:#8b7252;border:3px solid #f4eee3;border-radius:50%}.marking-view{display:inline-flex;align-items:center;gap:7px;font-size:10px;background:transparent;padding:8px 0;margin-top:6px;color:#8b7152}.marking-view svg{width:15px;height:15px}
@container atelier-viewport (min-width:901px){.configuration{overflow:hidden}.options{overflow-y:auto;min-height:0;flex:1;margin-right:-12px;padding-right:12px;scrollbar-width:thin;scrollbar-color:#d3c8ba transparent}.configuration-heading{flex-shrink:0}.configuration-footer{flex-shrink:0;margin-top:0;padding-top:15px}}
.cognac{background:radial-gradient(ellipse at 25% 15%,#a56a38,#77401e)}.taupe{background:radial-gradient(ellipse at 25% 15%,#938675,#6f6557)}.rosegold{background:linear-gradient(115deg,#9d5e49,#dca28b 25%,#ffe0ca 43%,#c28b73 65%,#ae7560)}.swatches:not(.metal-swatches){display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:19px 8px;justify-items:center}.sample.rosegold:before{display:none}
#viewer{inset:0}.stage-heading{transition:opacity .3s}.stage.is-inspecting .stage-heading{opacity:0}
.language-switch{display:flex;gap:2px;padding:3px;border:1px solid var(--line);border-radius:22px;flex-shrink:0}.language-switch button{width:29px;height:27px;border-radius:50%;background:transparent;color:var(--muted);font-size:10px;letter-spacing:.5px;transition:background .2s,color .2s}.language-switch button:hover{background:#e9e0d4}.language-switch button[aria-pressed=true]{background:#e4d9c9;color:var(--ink)}
@container atelier-viewport (max-width:560px){.header-tab{display:none}.language-switch{padding:2px}.language-switch button{width:27px;height:26px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;scroll-behavior:auto!important}}