:root{--ink:#24221f;--muted:#77736d;--line:#dedbd4;--cream:#f3f0e9;--paper:#fbfaf7;--accent:#252f2a}
*{box-sizing:border-box}body{margin:0;color:var(--ink);font-family:"DM Sans",sans-serif;background:var(--paper)}button,a{font:inherit;color:inherit}button{cursor:pointer}
header{height:74px;padding:0 4vw;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:#fff;position:relative;z-index:3}
.brand{font-family:"Gilda Display",serif;letter-spacing:.25em;font-size:21px;text-decoration:none}nav{display:flex;gap:34px}nav a{text-decoration:none;font-size:13px;color:#514e49}
.head-actions{display:flex;align-items:center;gap:8px}.head-actions button{border:0;background:none;padding:10px}.bag{border-left:1px solid var(--line)!important;padding-left:18px!important}.bag span{background:var(--ink);color:#fff;border-radius:50%;font-size:9px;padding:2px 5px}
main{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(420px,.88fr);height:calc(100vh - 74px);min-height:650px}
.viewer{position:relative;overflow:hidden;background:radial-gradient(circle at 48% 46%,#fff 0,#f2efe8 50%,#e5e0d6 100%);padding:28px 4vw}.viewer-top{display:flex;justify-content:space-between;position:relative;z-index:2}.eyebrow{font-size:10px;letter-spacing:.22em;font-weight:600}.viewer-top button{border:0;border-bottom:1px solid;background:none;font-size:11px;padding:3px 0}
.halo{position:absolute;width:490px;height:490px;border-radius:50%;border:1px solid rgba(255,255,255,.75);left:50%;top:50%;transform:translate(-50%,-50%);box-shadow:0 0 90px rgba(255,255,255,.8) inset}
.ring-stage{height:calc(100% - 95px);display:flex;align-items:center;justify-content:center;position:relative;z-index:1;cursor:grab}.ring-stage:active{cursor:grabbing}#ringCanvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}.model-loader{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;background:radial-gradient(circle,rgba(255,255,255,.92),rgba(242,239,232,.7));transition:opacity .5s}.model-loader.loaded{opacity:0;pointer-events:none}.model-loader span{width:28px;height:28px;border:1px solid #aaa;border-top-color:#24221f;border-radius:50%;animation:spin .8s linear infinite}.model-loader small{font-size:9px;letter-spacing:.16em;text-transform:uppercase}@keyframes spin{to{transform:rotate(360deg)}}
.viewer-tools{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:14px;font-size:10px;letter-spacing:.08em;color:var(--muted);z-index:2}.viewer-tools button{width:34px;height:34px;border-radius:50%;border:1px solid #cbc6bc;background:rgba(255,255,255,.7)}
.preview-note{position:absolute;bottom:24px;left:4vw;display:flex;gap:10px;align-items:center}.preview-note span{font-size:22px}.preview-note strong,.preview-note small{display:block}.preview-note strong{font-family:"Gilda Display";font-size:14px}.preview-note small{font-size:10px;color:var(--muted);margin-top:2px}
.configurator{background:#fff;padding:0 clamp(30px,5vw,78px);display:flex;flex-direction:column;overflow:auto}.progress{height:2px;background:#eee;margin:0 calc(clamp(30px,5vw,78px) * -1) 54px}.progress span{display:block;height:100%;background:var(--ink);width:16.6%;transition:width .3s}
.config-head{display:flex;justify-content:space-between;align-items:flex-end}.config-head h1{font-family:"Gilda Display",serif;font-weight:400;font-size:clamp(30px,3vw,43px);margin:11px 0 0;line-height:1.08}.config-head>span{font-size:11px;color:var(--muted);letter-spacing:.12em}.description{font-size:13px;color:var(--muted);margin:16px 0 30px}
.options{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.option{min-height:112px;border:1px solid var(--line);background:#fff;padding:12px 8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;transition:.2s}.option:hover{border-color:#918b82}.option.active{border:1.5px solid var(--ink);background:#faf9f5}.option .icon{font-family:"Gilda Display";font-size:29px;height:38px;display:flex;align-items:center}.option .icon.shape-icon{height:48px}.option .shape-icon img{width:48px;height:48px;display:block}.option small{font-size:11px}.option em{font-size:9px;color:var(--muted);font-style:normal}
.swatch{width:29px;height:29px;border-radius:50%;border:1px solid #aaa;box-shadow:inset 0 0 0 4px #fff}.detail-row{margin-top:18px}.detail-row label{display:block;font-size:11px;margin-bottom:8px}.detail-row select,.detail-row input{width:100%;height:47px;border:1px solid var(--line);background:white;padding:0 14px;outline:none}.detail-row input:focus,.detail-row select:focus{border-color:var(--ink)}
.summary{margin-top:auto;padding-top:25px}.summary button{width:100%;border:0;border-top:1px solid var(--line);background:none;display:flex;justify-content:space-between;padding:18px 0}.summary button span{margin-right:auto}.summary button strong{font-weight:500}.summary button i{margin-left:14px}.summary-details{display:grid;grid-template-columns:1fr 1fr;gap:7px;font-size:10px;color:var(--muted);padding:0 0 14px}.summary-details b{color:var(--ink);font-weight:500}
.footer-actions{display:grid;grid-template-columns:112px 1fr;gap:10px;padding:0 0 28px}.footer-actions button{height:54px}.back{background:#fff;border:1px solid var(--line)}.next{background:var(--accent);color:#fff;border:0;display:flex;justify-content:center;align-items:center;gap:30px}.next span{font-size:19px}.toast{position:fixed;right:24px;bottom:24px;background:#253029;color:#fff;padding:16px 22px;font-size:12px;transform:translateY(100px);opacity:0;transition:.3s;z-index:9}.toast.show{transform:none;opacity:1}
@media(max-width:850px){header{height:62px}nav{display:none}main{display:block;height:auto;min-height:0}.viewer{height:52vh;min-height:390px}.viewer-tools{bottom:12px}.preview-note{display:none}.configurator{padding:0 22px;min-height:540px}.progress{margin:0 -22px 34px}.options{grid-template-columns:repeat(3,1fr)}.option{min-height:95px}.config-head h1{font-size:33px}.summary{margin-top:36px}.footer-actions{position:sticky;bottom:0;background:#fff;padding-top:10px}}
@media(max-width:440px){.head-actions button:not(.bag){display:none}.options{grid-template-columns:repeat(2,1fr)}}

/* ===== Quote generator (Arnold & Co pricing guide) ===== */
.band-note{display:block;color:#a8863b;font-size:11px;margin-top:6px;min-height:14px}
.quote-flags{display:flex;gap:18px;margin-top:14px;flex-wrap:wrap}
.quote-flags .flag{display:flex;align-items:center;gap:8px;font-size:12px;color:#514e49}
.quote-flags select{padding:6px 10px;border:1px solid var(--line);background:#fff}
.quote-breakdown{display:grid;grid-template-columns:1fr auto;gap:6px 14px;font-size:11px;color:var(--muted);margin-top:16px;padding:14px 16px;background:#faf9f5;border:1px solid var(--line)}
.quote-breakdown b{color:var(--ink);font-weight:500;text-align:right}
.quote-breakdown .qb-total{border-top:1px solid var(--line);padding-top:8px;margin-top:4px;color:var(--ink);font-weight:600}
#quoteOverlay{position:fixed;inset:0;z-index:100;background:#e8e4de;overflow-y:auto;display:none;padding:0 0 40px}
#quoteOverlay.open{display:block}
#quoteOverlay .q-toolbar{position:sticky;top:0;z-index:10;display:flex;gap:10px;padding:16px 20px;max-width:680px;margin:0 auto}
#quoteOverlay .q-toolbar button{flex:1;padding:12px 16px;border-radius:8px;border:1px solid #ccc;background:#fff;color:#666;cursor:pointer;font-size:13px;font-weight:600}
#quoteOverlay .q-toolbar button.primary{background:linear-gradient(135deg,#C9A84C,#a88a32);color:#111;border:none}
#quoteOverlay .q-page{max-width:680px;margin:0 auto;background:#fff;box-shadow:0 2px 40px rgba(0,0,0,.12)}
#quoteOverlay .q-head{padding:44px 48px 36px;display:flex;justify-content:space-between;align-items:flex-start}
#quoteOverlay .q-head img{height:44px}
#quoteOverlay .q-head-right{text-align:right;font-size:11px;color:#aaa;line-height:1.7}
#quoteOverlay .q-gold-line{height:2px;background:linear-gradient(90deg,#C9A84C,#e2cea0,#C9A84C);margin:0 48px}
#quoteOverlay .q-renders{display:flex;gap:12px;justify-content:center;padding:32px 48px 4px}
#quoteOverlay .q-renders img{width:33%;aspect-ratio:1;object-fit:cover;background:#faf9f5;border:1px solid var(--line);border-radius:5px}
#quoteOverlay .q-body{padding:40px 48px 48px}
#quoteOverlay .q-greeting{font-size:15px;line-height:1.8;color:#444}
#quoteOverlay .q-items{display:grid;grid-template-columns:1fr auto;gap:7px 16px;font-size:12px;color:#777;margin-top:28px}
#quoteOverlay .q-items b{color:#333;font-weight:500;text-align:right}
#quoteOverlay .q-total{display:flex;justify-content:space-between;align-items:baseline;padding:18px 0 0;margin-top:12px;border-top:2px solid #C9A84C}
#quoteOverlay .q-total-label{font-size:14px;font-weight:700;color:#222}
#quoteOverlay .q-total-val{font-family:"Gilda Display",serif;font-size:26px;font-weight:700;color:#C9A84C}
#quoteOverlay .q-note{margin-top:20px;font-size:12px;color:#888}
#quoteOverlay .q-next{background:#faf8f3;border-radius:6px;padding:20px 24px;margin-top:32px;font-size:13px;line-height:1.7;color:#666}
#quoteOverlay .q-sign{margin-top:32px;font-size:14px;line-height:1.7;color:#444}
#quoteOverlay .q-sign .nm{font-weight:600}
#quoteOverlay .q-sign .co{font-size:12px;color:#999}
#quoteOverlay .q-foot{background:#111;padding:16px 48px;text-align:center;font-size:9px;letter-spacing:2px;text-transform:uppercase;color:#666}
#quoteOverlay .q-textmode{padding:14px;background:#e8f5e8;border-radius:10px;font-size:11px;letter-spacing:2px;text-transform:uppercase;color:#666;margin-bottom:16px;text-align:center}
#quoteOverlay .q-pre{font-size:15px;line-height:1.8;color:#333;white-space:pre-wrap}
@media print{
  body.quoting>*:not(#quoteOverlay){display:none!important}
  #quoteOverlay{position:static;background:#fff;padding:0}
  #quoteOverlay .q-toolbar{display:none}
  #quoteOverlay .q-page{box-shadow:none;max-width:100%}
}
.quote-flags input[type=checkbox]{width:16px;height:16px;margin:0}
.quote-flags select{width:auto;height:auto}

/* multi-section wizard pages */
.options-host{display:flex;flex-direction:column;gap:26px}
.opt-section .opt-heading{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin:0 0 10px;font-weight:600}
.opt-section .options{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.opt-section .options.compact{grid-template-columns:repeat(4,1fr);gap:8px}
.options.compact .option{min-height:74px;padding:8px 6px;gap:6px}
.options.compact .option .icon{font-size:19px;height:22px}
.options.compact .option .icon.shape-icon{height:30px}
.options.compact .option .shape-icon img{width:30px;height:30px}
.options.compact .option small{font-size:10px}
.options.compact .option em{font-size:8px}
.options.compact .swatch{width:20px;height:20px;box-shadow:inset 0 0 0 3px #fff}
/* "coming soon" (priced-only, no 3D preview yet) option chips */
.option .soon-tag{display:block;margin-top:2px;font-size:8px;font-style:normal;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);opacity:.75}
.option.soon{opacity:.82}
.option.soon.active{opacity:1}
#stoneTypeSelect{width:100%;height:47px;border:1px solid var(--line);background:#fff;padding:0 14px;outline:none;font-family:inherit;font-size:13px}
#stoneTypeSelect:focus{border-color:var(--ink)}
/* halo / pavé accent-stone picker, sits under its option */
.accent-stone{margin-top:12px;display:flex;flex-direction:column;gap:7px}
.accent-stone label{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-weight:600}
.accent-stone select{width:100%;height:47px;border:1px solid var(--line);background:#fff;padding:0 14px;outline:none;font-family:inherit;font-size:13px}
.accent-stone select:focus{border-color:var(--ink)}
@media(max-width:850px){.opt-section .options.compact{grid-template-columns:repeat(3,1fr)}}

/* step navigation strip (all pages, click to jump) */
.step-nav{display:flex;flex-wrap:wrap;gap:4px;margin:14px 0 4px;background:#f2f0eb;padding:4px;border-radius:8px}
.step-tab{display:flex;align-items:center;gap:6px;padding:8px 12px;border:0;background:transparent;border-radius:6px;cursor:pointer;white-space:nowrap;flex:1 0 auto;justify-content:center;transition:.15s;color:var(--ink);line-height:1;min-height:34px}
.step-tab:hover{background:#e9e6df}
.step-tab.active{background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.step-tab .step-num{width:18px;height:18px;border-radius:50%;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:700;flex:0 0 18px}
.step-tab.active .step-num{background:var(--ink);color:#fff;border-color:var(--ink)}
.step-tab.done .step-num{background:#6a7f6a;color:#fff;border-color:#6a7f6a}
.step-tab .step-label{font-size:11px;letter-spacing:.06em;text-transform:uppercase;font-weight:600}
@media(max-width:850px){.step-nav{position:sticky;top:0;z-index:30;margin:10px -22px 4px;border-radius:0;padding:4px 10px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.step-nav::-webkit-scrollbar{display:none}.step-tab .step-label{display:none}.step-tab.active .step-label{display:inline}}

/* ===== mobile polish (iPhone 13 Pro/Max and up) ===== */
@media(max-width:850px){
  /* dynamic viewport height so Safari's collapsing URL bar doesn't jump the layout */
  .viewer{height:52vh;height:52svh}
  /* iOS zooms the page when a focused input's font is under 16px */
  .detail-row input,.detail-row select,#stoneTypeSelect,.accent-stone select{font-size:16px;height:50px}
  /* roomier tap targets on the wizard grids */
  .options.compact .option{min-height:82px}
  .step-tab{min-height:40px}
  /* quote overlay fits the phone */
  #quoteOverlay .q-toolbar{padding:12px calc(12px + env(safe-area-inset-right)) 12px calc(12px + env(safe-area-inset-left))}
  #quoteOverlay .q-page{margin:0 10px;padding:24px 18px}
  /* keep the sticky footer clear of the home indicator */
  .footer-actions{padding-bottom:calc(10px + env(safe-area-inset-bottom))}
}
@media(hover:none){
  button{-webkit-tap-highlight-color:transparent}
  .option:hover{border-color:var(--line)}
  .option.active{border-color:var(--ink)}
}

/* ===== mobile bottom step carousel (replaces Back/Next under 850px) ===== */
.step-carousel{display:none}
@media(max-width:850px){
  .footer-actions{display:none}
  .configurator{padding-bottom:96px}
  .step-carousel{
    position:fixed;left:0;right:0;bottom:0;z-index:80;
    display:flex;align-items:center;gap:8px;
    padding:10px 14px calc(12px + env(safe-area-inset-bottom));
    background:rgba(255,255,255,.94);
    -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
    border-top:1px solid var(--line);
  }
  .step-carousel button{
    flex:0 0 auto;width:44px;height:44px;border-radius:50%;
    border:1px solid var(--line);background:#fff;color:var(--ink);
    font-size:17px;line-height:1;
  }
  .step-carousel button:active{background:var(--ink);color:#fff;border-color:var(--ink)}
  .car-viewport{position:relative;flex:1;height:46px;overflow:hidden}
  #carTrack{position:absolute;inset:0}
  .car-item{
    position:absolute;left:50%;top:56%;white-space:nowrap;
    font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--ink);
    transition:transform .7s cubic-bezier(.3,1,.32,1),opacity .7s cubic-bezier(.3,1,.32,1);
    will-change:transform,opacity;
  }
  /* slots position the words horizontally; the per-LETTER transforms (set in
     JS) wrap each word around the wheel's arc and fade the outer halves */
  .car-item[data-off="0"]{transform:translate(-50%,-50%);opacity:1}
  .car-item[data-off="1"]{transform:translate(calc(-50% + 114px),-50%);opacity:.9}
  .car-item[data-off="-1"]{transform:translate(calc(-50% - 114px),-50%);opacity:.9}
  .car-item[data-off="2"]{transform:translate(calc(-50% + 215px),-50%);opacity:0}
  .car-item[data-off="-2"]{transform:translate(calc(-50% - 215px),-50%);opacity:0}
  .car-ch{
    display:inline-block;font-style:normal;
    transition:transform .7s cubic-bezier(.3,1,.32,1),opacity .7s cubic-bezier(.3,1,.32,1);
  }
}

/* ===== header search bar + predictive results ===== */
.head-search{position:relative;flex:1;max-width:460px;margin:0 26px;display:flex;align-items:center;gap:9px;height:44px;padding:0 16px;border:1px solid var(--line);border-radius:22px;background:#faf9f5}
.head-search .hs-icon{font-size:17px;color:var(--muted)}
.head-search input{flex:1;border:0;background:none;outline:none;font-family:inherit;font-size:13px;color:var(--ink)}
.head-search input::placeholder{color:#a49e94}
.search-results{display:none;position:absolute;top:52px;left:0;right:0;z-index:90;background:#fff;border:1px solid var(--line);box-shadow:0 14px 40px rgba(0,0,0,.1);max-height:60vh;overflow:auto}
.search-results.open{display:block}
.sr-row{display:flex;align-items:center;gap:12px;width:100%;padding:9px 12px;background:#fff;border:0;border-bottom:1px solid #f1efe9;text-align:left;cursor:pointer}
.sr-row:hover{background:#faf9f5}
.sr-row img,.sr-noimg{width:48px;height:48px;object-fit:cover;border-radius:4px;background:#f4f2ee;flex:0 0 auto;display:flex;align-items:center;justify-content:center;color:#c9c3b8}
.sr-txt b{display:block;font-size:13px;font-weight:600}
.sr-txt small{font-size:11px;color:var(--muted);text-transform:capitalize}

/* ===== store gallery overlay ("Jewelry") ===== */
#galleryOverlay{display:none;position:fixed;inset:0;z-index:120;background:#fbfaf7;overflow:auto}
#galleryOverlay.open{display:block}
.g-head{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:18px;padding:18px 4vw;background:rgba(251,250,247,.96);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.g-head h2{font-family:"Gilda Display",serif;font-size:24px;font-weight:400;margin:0;letter-spacing:.06em}
.g-head input{flex:1;max-width:340px;height:40px;padding:0 15px;border:1px solid var(--line);border-radius:20px;background:#fff;outline:none;font-family:inherit;font-size:13px}
.g-head button{margin-left:auto;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:#fff;font-size:15px;cursor:pointer}
.g-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px;padding:22px 4vw 60px}
.g-card{display:flex;flex-direction:column;gap:4px;padding:0 0 14px;border:1px solid var(--line);background:#fff;text-align:center;cursor:pointer;transition:.15s}
.g-card:hover{border-color:var(--ink);transform:translateY(-2px)}
.g-card img{width:100%;aspect-ratio:1;object-fit:cover;background:#f4f2ee;margin-bottom:8px}
.g-noimg{width:100%;aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:34px;color:#d8d2c6;background:#f4f2ee;margin-bottom:8px}
.g-card b{font-size:13px;font-weight:600;padding:0 10px}
.g-card small{font-size:10.5px;color:var(--muted);text-transform:capitalize;padding:0 10px}
.g-card em{font-style:normal;font-size:11px;color:#8c6d1f;margin-top:3px}
.g-empty{grid-column:1/-1;text-align:center;color:var(--muted);padding:40px}

/* ===== store-photo fallback in the viewer ===== */
.photo-view{display:none;position:absolute;inset:0;z-index:6;background:#fbfaf7;flex-direction:column;align-items:center;justify-content:center;gap:12px}
.photo-view.show{display:flex}
.photo-view #photoMain{max-width:86%;max-height:72%;object-fit:contain;border-radius:6px}
.photo-thumbs{display:flex;gap:8px}
.photo-thumbs img{width:52px;height:52px;object-fit:cover;border-radius:4px;border:1.5px solid transparent;cursor:pointer;background:#f4f2ee}
.photo-thumbs img.active{border-color:var(--ink)}
#photoClose{position:absolute;top:14px;right:14px;height:34px;padding:0 14px;border-radius:17px;border:1px solid var(--line);background:#fff;font-size:12px;cursor:pointer}

/* ===== quote-step reference ring cards + quote block ===== */
.ref-rings{margin-bottom:22px}
.ref-rings>label{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:600;margin-bottom:10px}
.ref-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}
.ref-card{display:flex;flex-direction:column;gap:4px;padding:0 0 10px;border:1px solid var(--line);background:#fff;text-align:center;cursor:pointer}
.ref-card img,.ref-noimg{width:100%;aspect-ratio:1;object-fit:cover;background:#f4f2ee;margin-bottom:6px;display:flex;align-items:center;justify-content:center;color:#d8d2c6}
.ref-card small{font-size:11px;font-weight:600;padding:0 8px}
.ref-card em{font-style:normal;font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.ref-card.active{border:1.5px solid var(--ink);background:#faf9f5}
.ref-card.active em{color:#8c6d1f}
.ref-none{color:var(--muted)}
#quoteOverlay .q-refring{display:flex;gap:16px;align-items:center;margin:26px 48px 0;padding:14px 16px;background:#faf9f5;border:1px solid var(--line)}
#quoteOverlay .q-refring img{width:74px;height:74px;object-fit:cover;border-radius:4px}
#quoteOverlay .q-refring .q-ref-label{display:block;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:3px}
#quoteOverlay .q-refring a{color:#8c6d1f;font-size:11px;word-break:break-all}

/* mobile: keep Jewelry visible, let the search bar breathe */
@media(max-width:850px){
  nav{display:flex}
  .head-search{margin:0 10px;height:38px;min-width:0}
  .g-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));padding:16px 16px 60px}
  .g-head{padding:12px 16px}
  .g-head h2{font-size:19px}
  #quoteOverlay .q-refring{margin:20px 18px 0}
}

/* ===== Design lab (in-scene transform editor) ===== */
.viewer-top-actions{display:flex;gap:8px;align-items:center}
.viewer-top-actions button{border:0;border-bottom:1px solid;background:none;font-size:11px;padding:3px 0}
#editLab.active{color:#8c6d1f;font-weight:600}
.editor-panel{display:none;position:absolute;top:52px;left:4vw;z-index:8;width:264px;background:rgba(255,255,255,.97);backdrop-filter:blur(8px);border:1px solid var(--line);box-shadow:0 12px 34px rgba(0,0,0,.18);padding:10px 12px 12px;border-radius:9px}
.editor-panel.open{display:block}
.ep-body{max-height:min(72vh,620px);overflow-y:auto;margin:0 -12px;padding:0 12px}
.ep-body::-webkit-scrollbar{width:7px}
.ep-body::-webkit-scrollbar-thumb{background:rgba(0,0,0,.16);border-radius:4px}
.ep-row{display:flex;gap:6px;margin-bottom:7px}
.ep-head{justify-content:space-between;align-items:center;margin-bottom:9px;cursor:grab;user-select:none;touch-action:none}
.ep-head:active{cursor:grabbing}
.ep-head strong{font-family:"Gilda Display",serif;font-size:14px;letter-spacing:.04em}
.ep-head button{border:0;background:none;font-size:14px;cursor:pointer;color:var(--muted)}
.editor-panel .ep-row>button{flex:1;height:32px;border:1px solid var(--line);background:#fff;font-size:11px;border-radius:5px;cursor:pointer;transition:.15s}
.editor-panel .ep-row>button:hover{border-color:var(--ink)}
.ep-modes button.active{background:var(--ink);color:#fff;border-color:var(--ink)}
.ep-group{border-top:1px solid var(--line);padding-top:9px;margin-top:2px}
.ep-group:first-child{border-top:0;padding-top:0}
.ep-glabel{font-size:9.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin-bottom:6px;font-weight:600}
.ep-row2{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:7px}
.ep-row2 label{display:flex;flex-direction:column;gap:3px;font-size:9.5px;color:var(--muted)}
.ep-row2 select{height:30px;border:1px solid var(--line);border-radius:5px;background:#fff;font-size:11px;color:var(--ink);padding:0 5px}
.ep-check{flex-direction:row!important;align-items:center;gap:5px!important;font-size:10.5px!important;color:var(--ink)!important;padding-top:14px}
.ep-check input{width:14px;height:14px}
#epAddStone,#epUpload{font-weight:600;background:#faf6ec!important;border-color:#d9c690!important;color:#8c6d1f}
#epCapture{background:#faf6ec!important;border-color:#d9c690!important;color:#8c6d1f;font-weight:600}
.ep-adv{margin-top:8px}
.ep-adv summary{font-size:10px;color:var(--muted);cursor:pointer;margin-bottom:6px}
.ep-hint{display:block;font-size:9.5px;color:var(--muted);line-height:1.5;margin:6px 0 2px}
/* the header's close button must stay corner-sized — not flex-grow into a drag dead-zone */
.editor-panel .ep-head>button{flex:0 0 auto;height:auto;border:0;background:none;padding:0 4px}
/* contextual "selected object" editor */
.ep-selected{background:#faf7ee;border:1px solid #e6d9b8;border-radius:7px;padding:8px;margin:0 0 4px}
.ep-selhead{display:flex;justify-content:space-between;align-items:center;margin-bottom:7px}
.ep-selhead .ep-glabel{margin:0;color:#8c6d1f}
#epSelDelete{border:1px solid #e0c48a;background:#fff;border-radius:5px;cursor:pointer;font-size:12px;height:24px;width:30px;line-height:1}
#epSelDelete:hover{background:#f3e6c4}
#epSelBody .ep-crow{display:flex;flex-direction:column;gap:3px;font-size:9.5px;color:var(--muted);margin-bottom:6px}
#epSelBody select,#epSelBody input[type=number]{height:30px;border:1px solid var(--line);border-radius:5px;background:#fff;font-size:11px;color:var(--ink);padding:0 5px;width:100%}
#epSelBody .ep-check{padding-top:2px}
#epSelBody .ep-note{font-size:10px;color:var(--muted);line-height:1.5}
#epOut{width:100%;height:88px;font-family:ui-monospace,Menlo,monospace;font-size:9.5px;border:1px solid var(--line);border-radius:5px;padding:7px;resize:vertical;background:#fbfaf7;color:#514e49}
@media(max-width:850px){.editor-panel{left:12px;right:12px;width:auto;top:46px}}

/* ===== Studio export modal ===== */
#studioOverlay{position:fixed;inset:0;background:rgba(30,26,20,0.45);backdrop-filter:blur(6px);
  display:none;align-items:center;justify-content:center;z-index:60}
#studioOverlay.open{display:flex}
.st-panel{background:#f6f4ef;border-radius:14px;padding:18px 20px 16px;width:min(92vw,460px);
  box-shadow:0 24px 70px rgba(0,0,0,0.35);display:flex;flex-direction:column;gap:12px}
.st-head{display:flex;align-items:center;justify-content:space-between}
.st-head h3{font-family:"Gilda Display",serif;font-weight:400;font-size:1.25rem;margin:0}
.st-head button{border:0;background:none;font-size:1rem;cursor:pointer;opacity:0.6}
.st-head button:hover{opacity:1}
.st-templates{display:flex;gap:8px}
.st-t{flex:1;padding:8px 10px;border:1px solid #d8d2c4;border-radius:8px;background:#fff;
  font:500 0.78rem "DM Sans",sans-serif;cursor:pointer;color:#3c372e}
.st-t.active{border-color:#3c372e;background:#3c372e;color:#f6f4ef}
.st-stage{position:relative;border-radius:10px;overflow:hidden;background:#e8e2d5;
  aspect-ratio:4/5;display:flex;align-items:center;justify-content:center}
.st-stage img{width:100%;height:100%;object-fit:cover;display:block}
#stBusy{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font:500 0.85rem "DM Sans",sans-serif;color:#6b6353;background:rgba(240,236,226,0.75);opacity:0;
  pointer-events:none;transition:opacity 0.2s}
.st-stage.busy #stBusy{opacity:1}
.st-actions{display:flex;gap:8px}
.st-actions button{flex:1;padding:11px 10px;border:0;border-radius:8px;background:#3c372e;color:#f6f4ef;
  font:600 0.8rem "DM Sans",sans-serif;cursor:pointer}
.st-actions button:disabled{opacity:0.55;cursor:default}
.st-actions button:hover:not(:disabled){background:#514a3d}
.st-hint{color:#8a8271;font:400 0.68rem "DM Sans",sans-serif;text-align:center}

/* ===== Studio mode (Blender-style arranging window) ===== */
body.studio-mode header,body.studio-mode .configurator,body.studio-mode .step-carousel,
body.studio-mode .preview-note,body.studio-mode .viewer-tools{display:none!important}
body.studio-mode main{display:block}
body.studio-mode .viewer{position:fixed;inset:0;z-index:70;max-width:none;width:100vw;height:100vh;margin:0;padding:0;background:#101012}
body.studio-mode .ring-stage{position:absolute;inset:0;width:100%;height:100%;max-height:none;aspect-ratio:auto}
body.studio-mode .halo{display:none}
#studioPanel{z-index:90}
#studioPanel input[type=range]{width:100%;accent-color:#3c372e}
#studioPanel input[type=color]{width:100%;height:26px;border:1px solid var(--line);border-radius:5px;background:#fff;padding:1px}
#frameGuide{display:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  height:94%;aspect-ratio:4/5;border:1.5px dashed rgba(255,255,255,.55);border-radius:6px;
  pointer-events:none;box-shadow:0 0 0 4000px rgba(0,0,0,.18)}
body.studio-mode #frameGuide{display:block}
.sp-modes button.active{background:var(--ink);color:#fff;border-color:var(--ink)}

/* ===== sale / discount on the quote step ===== */
.quote-sale{margin-top:14px;display:flex;flex-direction:column;gap:10px}
.quote-sale .flag{display:flex;align-items:center;gap:8px;font-size:12px;color:#514e49}
.quote-sale .flag input[type=checkbox]{width:16px;height:16px;margin:0}
.quote-sale .sale-row{display:flex;gap:10px}
.quote-sale .sale-row select{flex:0 0 90px;padding:6px 10px;border:1px solid var(--line);background:#fff}
.quote-sale .sale-row input{flex:1;padding:6px 10px;border:1px solid var(--line);background:#fff}
.quote-breakdown .qb-discount{color:#8c6d1f;font-weight:600}
/* quote page subtotal / discount rows above the total */
#quoteOverlay .q-subline{display:flex;justify-content:space-between;align-items:baseline;font-size:13px;color:#555;padding:2px 0}
#quoteOverlay .q-subline.q-sale{color:#8c6d1f;font-weight:600}
#quoteOverlay .q-subline:first-of-type{margin-top:12px}

/* ===== embed product mode ===== */
body.embed-product header, body.embed-product aside, body.embed-product #stepNav,
body.embed-product .wizard, body.embed-product #summary, body.embed-product .viewer-top,
body.embed-product footer, body.embed-product #next, body.embed-product #back { display:none !important; }
body.embed-product main { display:block; padding:0; }
body.embed-product .viewer { width:100%; height:100vh; border:0; border-radius:0;
  background:#fff !important; padding:0; }
body.embed-product .model-loader { background:#fff !important; }
/* controls now live on the Shopify product page — ring only, no on-canvas chrome */
body.embed-product #embedBar,
body.embed-product .preview-note,
body.embed-product .viewer-tools { display:none !important; }
#embedBar { position:fixed; left:0; right:0; bottom:0; background:#fff; border-top:1px solid #e7e2d6;
  display:flex; gap:18px; padding:10px 14px; overflow-x:auto; font-family:"DM Sans",sans-serif; }
#embedBar .eb-g > span { display:block; font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:#8a8577; margin-bottom:4px; }
#embedBar .eb-g > div { display:flex; gap:6px; }
#embedBar button { border:1px solid #ddd7c9; background:#fff; border-radius:4px; padding:6px 10px; font-size:12px;
  cursor:pointer; white-space:nowrap; display:flex; align-items:center; gap:5px; color:#2a3040; }
#embedBar button img { width:14px; height:14px; }
#embedBar button.on { border-color:#1f3050; background:#1f3050; color:#fff; }
#embedBar button.on img { filter:invert(1); }
/* embed-product: show ONLY the ring — hide the wizard panel and lock scrolling */
body.embed-product{overflow:hidden!important;height:100vh!important}
body.embed-product main{height:100vh!important;overflow:hidden!important;display:block!important}
body.embed-product .configurator{display:none!important}
body.embed-product .step-carousel{display:none!important}