:root{--ink:#434444;--muted:#746D64;--accent:#B18F68;--accent-soft:#C3AA8D;--accent-hover:#C3AA8D;--accent-ink:#765A3D;--on-accent:#302A23;--accent-tint:#F1E9DF;--line:#EBE3D9;--paper:#F4F0EB;--surface:#F7F4F0;--info:#526D89;--info-soft:#EAF3F7;--watercolor:#A0C5D7;--watercolor-line:#C7DDE6;--watercolor-ink:#456C80;--font:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);font-size:14px}button,input{font:inherit}button{cursor:pointer}button:disabled{opacity:.4;cursor:wait}button:focus-visible,input:focus-visible,summary:focus-visible,a:focus-visible{outline:3px solid var(--accent-soft);outline-offset:3px}a{color:inherit}.site-header{height:82px;padding:0 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:10px;font-size:23px;font-weight:650;text-decoration:none;letter-spacing:2px}.brand-mark{display:block;width:36px;height:36px;flex:none}.brand-en{font-size:11px;font-weight:500;letter-spacing:2.5px;margin-left:7px;color:var(--muted)}.header-note{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:8px}.header-note i,.live-dot{width:6px;height:6px;background:var(--accent);border-radius:50%;display:inline-block}.text-button{background:none;border:0;color:var(--muted);font-size:12px;padding:6px}.text-button:hover{color:var(--accent-ink)}main{max-width:1440px;padding:44px 5% 0;margin:auto}.intro{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}.eyebrow{font-size:10px;letter-spacing:2px;color:var(--accent-ink)}h1{font-weight:550;font-size:34px;letter-spacing:1px;margin:12px 0 10px}p{line-height:1.75}.intro p{color:var(--muted);margin:0;font-size:13px}.intro-aside{font-size:16px;text-align:right;letter-spacing:1px}.intro-aside span{display:block;font-size:11px;color:var(--muted);margin-top:9px;letter-spacing:.5px}.workspace{display:grid;grid-template-columns:304px minmax(0,1fr);gap:24px;align-items:start}.panel{background:#fff;border:1px solid var(--line);border-radius:16px;padding:24px}.panel-title{display:flex;align-items:center;justify-content:space-between}h2{font-size:17px;font-weight:600;margin:0}.section-note{font-size:11px;color:var(--muted);margin:8px 0 22px}.field-label{display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:550}.field-label>span,.field-label label span{font-size:10px;font-weight:400;color:var(--muted);margin-left:4px}.segmented{display:flex;gap:3px;border-radius:8px;padding:4px;background:var(--paper);margin:10px 0 20px}.segmented button{width:50%;border:0;background:transparent;border-radius:5px;padding:9px 0;color:var(--muted);font-size:12px}.segmented .active{background:#fff;color:var(--accent-ink);box-shadow:0 1px 5px #302a2310}.parameter{margin:19px 0}.number-wrap{display:flex;align-items:center;border:1px solid var(--line);border-radius:7px;padding:5px 8px;gap:4px}.number-wrap input{width:57px;background:none;border:0;color:var(--ink);font-size:17px;text-align:right;font-variant-numeric:tabular-nums;padding:0}.number-wrap span{font-size:10px;color:var(--muted)}input[type=number]{appearance:textfield;-moz-appearance:textfield}input::-webkit-inner-spin-button{appearance:none}input[type=range]{width:100%;height:4px;appearance:none;background:linear-gradient(to right,var(--accent) 0%,var(--accent) var(--fill,50%),#D7E5EB var(--fill,50%),var(--line) 100%);border-radius:8px;margin:17px 0 10px;cursor:pointer}input[type=range]::-webkit-slider-thumb{appearance:none;width:15px;height:15px;border:3px solid #fff;border-radius:50%;background:var(--accent);box-shadow:0 0 0 1px var(--accent-soft)}input[type=range]::-moz-range-thumb{width:10px;height:10px;border:3px solid #fff;border-radius:50%;background:var(--accent)}.range-ends{display:flex;justify-content:space-between;font-size:10px;color:var(--muted)}.quick-title{font-size:10px;color:var(--muted);margin:22px 0 9px}.presets{display:flex;gap:5px}.presets button{padding:7px 0;flex:1;background:#fff;border:1px solid var(--line);border-radius:6px;font-size:10px;color:var(--muted)}.presets button:hover{border-color:var(--accent-ink);color:var(--accent-ink)}.measurements{border-top:1px solid var(--line);margin-top:22px;padding-top:19px}.measurements summary{list-style:none;display:flex;justify-content:space-between;cursor:pointer;font-size:12px}.measurements summary::-webkit-details-marker{display:none}.measurements summary span{color:var(--muted);font-size:10px}.measurements p{font-size:10px;color:var(--muted);margin:12px 0}.measurement-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.measurement-grid label{font-size:11px;color:var(--muted)}.measurement-grid label>div{display:flex;align-items:center;margin-top:6px;border:1px solid var(--line);border-radius:6px;padding:7px}.measurement-grid input{width:100%;min-width:0;border:0;outline-offset:5px;background:none;font-size:13px;color:var(--ink)}.measurement-grid span{font-size:10px}.reference-card{background:var(--info-soft);padding:15px;border-radius:9px;margin-top:21px}.mini-label{font-size:9px;letter-spacing:1px;color:var(--accent-ink)}.reference-card>div{font-size:10px;margin-top:8px;display:flex;align-items:center;justify-content:space-between}.reference-card strong{font-size:14px;font-weight:550}.reference-card p{font-size:9px;color:var(--muted);margin:8px 0 0}.input-error{font-size:11px;color:#b33a3a}.model-section{min-width:0}.viewer{height:560px;background:radial-gradient(ellipse at 55% 30%,var(--surface) 0,var(--paper) 70%,var(--line) 100%);position:relative;border-radius:16px;overflow:hidden;border:1px solid var(--line)}.viewer-top{position:absolute;left:25px;right:25px;top:21px;display:flex;justify-content:space-between;align-items:center;font-size:11px;z-index:2;pointer-events:none}.live-dot{margin-right:6px}.viewer-muted{color:var(--muted);font-size:10px;margin-left:6px}.model-status{border:1px solid var(--line);border-radius:20px;padding:5px 9px;color:var(--muted);font-size:9px}.canvas-wrap{position:absolute;inset:0}.canvas-wrap canvas{display:block;touch-action:none}.height-label{position:absolute;font-size:23px;font-variant-numeric:tabular-nums;pointer-events:none;transform:translate(-100%,-50%);color:var(--info);white-space:nowrap}.height-label small{font-size:10px}.height-label span{font-size:10px;display:block;text-align:right;color:var(--muted);margin-top:4px}.floating-label{position:absolute;background:#ffffffd9;padding:7px 10px;border-radius:6px;border:1px solid var(--line);font-size:10px;white-space:nowrap;pointer-events:none;transform:translate(0,-50%);box-shadow:0 3px 12px #302a2308}.floating-label i{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--accent);margin-right:6px}.floating-label b{margin-left:9px;font-weight:550}.viewer-bottom{position:absolute;bottom:40px;left:25px;right:25px;display:flex;gap:17px;align-items:center}.view-buttons{display:flex;gap:3px;background:#ffffff99;border:1px solid var(--line);border-radius:8px;padding:4px;margin-right:auto}.view-buttons button{border:0;background:none;font-size:11px;padding:7px 12px;color:var(--muted);border-radius:5px}.view-buttons button.active{background:var(--accent);color:var(--on-accent)}.check-label{font-size:10px;color:var(--muted);display:flex;gap:6px;align-items:center;cursor:pointer}.check-label input{accent-color:var(--accent-ink);margin:0}.icon-button{width:30px;height:30px;border:1px solid var(--line);border-radius:7px;background:#ffffff66;color:var(--accent-ink);font-size:20px}.viewer-hint{position:absolute;bottom:16px;left:25px;font-size:9px;color:var(--muted);pointer-events:none;letter-spacing:.4px}.viewer-error{position:absolute;inset:70px 25px 100px;background:#F4F0EBED;display:flex;align-items:center;justify-content:center;padding:30px;text-align:center;z-index:4;line-height:1.8}.viewer-error[hidden]{display:none}.dimension-strip{display:grid;grid-template-columns:repeat(2,1fr);background:#fff;border:1px solid var(--line);border-radius:12px;margin-top:14px;padding:19px 6px}.dimension-strip>div{padding:0 20px;border-right:1px solid var(--line)}.dimension-strip>div:last-child{border:0}.dimension-strip span{display:block;font-size:10px;color:var(--muted);margin-bottom:8px}.dimension-strip em{font-style:normal;font-size:8px;color:var(--muted);margin-left:5px}.dimension-strip em.measured{color:var(--accent-ink)}.dimension-strip strong{font-size:25px;font-weight:500;font-variant-numeric:tabular-nums}.dimension-strip small{font-size:10px;color:var(--muted);margin-left:5px}.model-note{display:flex;align-items:flex-start;gap:9px;margin:14px 0}.note-icon{width:14px;height:14px;flex-shrink:0;border:1px solid #C5B9AC;border-radius:50%;font-size:9px;text-align:center;color:var(--muted);margin-top:3px}.model-note p{font-size:10px;color:var(--muted);margin:0}.secondary-button,.primary-button{border-radius:7px;padding:10px 14px;font-size:11px;white-space:nowrap}.secondary-button{background:#fff;border:1px solid var(--line);color:var(--ink)}.primary-button{background:var(--accent);border:1px solid var(--accent);color:var(--on-accent)}.primary-button:hover{background:var(--accent-hover)}footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);margin-top:35px;padding:22px 0;color:var(--muted);font-size:10px}dialog{border:1px solid var(--line);border-radius:16px;padding:28px;width:min(560px,90vw);color:var(--ink);background:#fff;max-height:85vh;overflow:auto}dialog::backdrop{background:#302a2355;backdrop-filter:blur(3px)}.dialog-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}dialog p,dialog li{font-size:12px;color:var(--muted);line-height:1.85}dialog ul{padding-left:20px}dialog li{margin:10px 0}dialog a{color:var(--accent-ink)}dialog h3{font-size:13px;margin-top:22px}.dialog-footnote{border-top:1px solid var(--line);padding-top:16px;font-size:10px!important}
@media(min-width:1500px){.viewer{height:620px}}@media(max-width:1000px){main{padding:30px 3% 0}.site-header{padding:0 3%}.workspace{grid-template-columns:270px minmax(0,1fr);gap:15px}.panel{padding:20px}.dimension-strip>div{padding:0 10px}.viewer{height:540px}.viewer-muted{display:none}.floating-label{font-size:9px;padding:6px}.view-buttons button{padding:7px 9px}.viewer-bottom{left:16px;right:16px;gap:10px}}@media(max-width:700px){.site-header{height:65px}.brand{font-size:20px}.brand-en,.header-note{display:none}main{padding:25px 4% 0}.intro{margin-bottom:22px}.intro h1{font-size:26px}.intro p{font-size:11px}.intro-aside{display:none}.workspace{display:flex;flex-direction:column}.panel{width:100%;padding:20px}.model-section{width:100%}.viewer{height:490px}.parameter{margin:16px 0}.reference-card{margin-top:16px}.dimension-strip{padding:15px 4px}.dimension-strip>div{padding:0 8px}.dimension-strip span{font-size:9px}.dimension-strip strong{font-size:22px}.dimension-strip em{display:block;margin:4px 0 0}.primary-button,.secondary-button{padding:10px}.viewer-top{left:17px;right:17px}.viewer-hint{left:17px}footer{gap:25px;line-height:1.8}footer>span:last-child{text-align:right}.floating-label{font-size:8px;padding:5px 7px}.floating-label b{margin-left:5px}.height-label{font-size:20px}}
@media(max-width:700px){.viewer-bottom{left:12px;right:12px;gap:6px}.view-buttons{gap:1px}.view-buttons button{font-size:10px;padding:6px 5px}.check-label{font-size:9px;gap:4px}}@media(max-width:360px){.viewer-bottom{flex-wrap:wrap}.view-buttons{width:100%;justify-content:center}.viewer-hint{display:none}}

select{font:inherit;color:var(--ink)}select:focus-visible{outline:3px solid var(--accent-soft);outline-offset:3px}.product-picker{border-bottom:1px solid var(--line);padding-bottom:22px;margin-bottom:24px}.product-picker .section-note{margin-bottom:14px}.product-field{display:flex;align-items:center;gap:18px;font-size:12px;margin:10px 0}.product-field select{flex:1;min-width:0;padding:10px;background:var(--surface);border:1px solid var(--line);border-radius:7px}.size-heading{font-size:12px;margin:18px 0 9px;font-weight:600}.size-heading span{float:right;font-size:9px;color:var(--muted);font-weight:400}.size-options{display:flex;flex-wrap:wrap;gap:6px}.size-options button{background:white;border:1px solid var(--line);color:var(--ink);border-radius:7px;padding:10px 9px;min-width:40px;font-size:12px}.size-options button.active{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}.size-options button.recommended:not(.active){border-color:var(--accent);background:var(--accent-tint)}.size-options button small{display:block;font-size:8px;margin-top:3px;opacity:.75}.size-recommendation{font-size:10px;color:var(--accent-ink);margin:10px 0}.selected-product{border-radius:8px;background:var(--accent-tint);padding:12px;margin-top:12px}.selected-product strong{display:block;font-size:12px}.selected-product span{display:block;font-size:10px;color:var(--accent-ink);margin-top:6px}.product-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;gap:12px}.product-toolbar .segmented{margin:0;width:240px}.product-toolbar .segmented button{padding:9px 16px}.viewer{height:620px}.model-section{position:sticky;top:16px}@media(max-width:700px){.model-section{position:static}.viewer{height:490px}.product-toolbar .segmented{width:210px}.product-toolbar .text-button{font-size:10px;padding:5px}.product-picker{margin-bottom:20px}.size-options button{flex:1;min-width:42px}.selected-product strong{font-size:13px}}

.viewer-product-label{position:absolute;top:53px;left:25px;z-index:2;font-size:12px;font-weight:600;color:var(--accent-ink);pointer-events:none}.body-controls>summary{display:none}@media(max-width:700px){.body-controls>summary{display:flex;justify-content:space-between;align-items:center;list-style:none;font-size:14px;cursor:pointer}.body-controls>summary::-webkit-details-marker{display:none}.body-controls>summary span{font-size:10px;color:var(--muted)}.body-controls[open]>.panel-title{margin-top:20px}.viewer-product-label{left:17px;font-size:11px}}

[hidden]{display:none!important}
.fit-panel{margin-top:12px;padding:13px 18px;border:1px solid var(--line);border-radius:12px;background:var(--paper)}.fit-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.fit-heading .check-label{font-size:12px;color:var(--ink)}.fit-summary{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.fit-chip{font-size:11px;padding:6px 10px;border-radius:6px;background:#eaf4ef;color:#28745c}.fit-chip.loose,.fit-chip.larger{background:#fff4d6;color:#9a6200}.fit-chip.intersecting,.fit-chip.smaller{background:#faecec;color:#b33a3a}.fit-chip.unknown,.fit-chip.unranked{background:var(--paper);color:var(--muted)}.fit-panel p{margin:9px 0 0;font-size:10px;color:var(--muted);line-height:1.7}@media(max-width:700px){.fit-panel{padding:12px}.fit-summary{gap:6px}.fit-chip{font-size:10px;padding:6px 8px}}

.dimension-strip>.dimension-title{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;border:0;margin-bottom:14px}.dimension-title h2{font-size:13px}.dimension-input{display:flex;align-items:baseline;gap:3px}.dimension-input input{width:100%;min-width:0;border:0;border-bottom:1px solid var(--accent-soft);background:none;font-size:25px;color:var(--ink);font-variant-numeric:tabular-nums;padding:0 0 3px}.dimension-input small{margin-left:0;flex-shrink:0}.dimension-strip input[type=range]{margin:14px 0 5px}.circumference-help{font-size:10px;color:var(--muted);margin:10px 0;line-height:1.8}input[aria-invalid=true]{border-color:#b33a3a}.dimension-strip input:disabled{opacity:.5}@media(max-width:700px){.dimension-input input{font-size:22px}.dimension-strip>.dimension-title{padding:0 8px;margin-bottom:10px}}
.header-actions{display:flex;align-items:center;gap:12px}.share-body-option{display:flex;align-items:center;gap:8px;font-size:12px}.share-body-option input{accent-color:var(--accent-ink)}.share-hint{font-size:11px!important}.share-link-label{display:block;font-size:12px;margin-top:20px}.share-link{width:100%;margin:8px 0 12px;padding:12px;font-size:12px;border:1px solid var(--line);border-radius:8px;background:var(--surface);box-sizing:border-box}.share-actions{display:flex;flex-wrap:wrap;gap:8px}.share-preview{display:flex;gap:14px;align-items:flex-start}.share-preview canvas{width:160px;max-width:100%;height:auto}.share-preview img{width:210px;max-width:55%;height:auto;border:1px solid var(--line);border-radius:8px}#share-local-note{background:var(--accent-tint);padding:10px;border-radius:8px;color:#9a6200}#share-status{color:var(--accent-ink);min-height:24px}@media(max-width:700px){.header-actions{gap:6px}.header-actions .text-button{font-size:10px}.header-actions .primary-button{font-size:10px;padding:8px}#share-dialog{padding:20px;width:calc(100vw - 32px);box-sizing:border-box}.share-preview{gap:8px}.share-preview canvas{width:135px}.share-preview img{width:180px}.share-body-option{align-items:flex-start;line-height:1.6}.share-actions button{flex:1}}
#share-qr{flex:0 0 160px}#share-qr canvas{display:block;width:100%;height:auto;aspect-ratio:1}@media(max-width:700px){#share-qr{flex-basis:135px}}

/* In-page product menus keep the same touch experience on phones and desktops. */
.product-picker{position:relative;z-index:5}
.product-field>span{flex-shrink:0}
.product-dropdown{position:relative;flex:1;min-width:0}
.product-dropdown-trigger{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:46px;padding:12px 14px;text-align:left;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:10px;font-size:13px;-webkit-tap-highlight-color:transparent}
.product-dropdown-trigger[aria-expanded=true]{border-color:var(--accent-ink);background:#fff;box-shadow:0 0 0 3px #B18F680b}
.dropdown-arrow{width:7px;height:7px;border-right:1.5px solid var(--muted);border-bottom:1.5px solid var(--muted);transform:rotate(45deg);margin:0 2px 4px;flex-shrink:0}
[aria-expanded=true] .dropdown-arrow{transform:rotate(225deg);margin:4px 2px 0}
.product-dropdown-menu{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:20;padding:6px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 30px #43444426;max-height:240px;overflow-y:auto;overscroll-behavior:contain}
.product-dropdown-option{display:flex;align-items:center;justify-content:space-between;gap:6px;min-height:46px;padding:11px 12px;border-radius:7px;font-size:13px;line-height:1.5;cursor:pointer;-webkit-tap-highlight-color:transparent}
.product-dropdown-option[aria-selected=true]{background:var(--accent-tint);color:var(--accent-ink);font-weight:600}
.product-dropdown-option[aria-selected=true]::after{content:'✓';font-size:15px;flex-shrink:0}
.product-dropdown-option:focus-visible{outline:2px solid var(--accent-ink);outline-offset:-2px}
.product-dropdown-option[aria-disabled=true]{color:#9C948B;cursor:not-allowed;font-size:12px}
@media(hover:hover){.product-dropdown-option:not([aria-disabled=true]):hover{background:var(--accent-tint)}}

/* A compact share sheet; generated artwork stays offscreen until system sharing. */
#share-dialog{width:min(480px,calc(100vw - 32px));padding:28px}
#share-dialog .dialog-heading{margin-bottom:8px}
#share-dialog .share-intro{margin:0 0 22px;font-size:13px}
#share-dialog .share-body-option{padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--surface);align-items:flex-start;gap:11px;font-size:13px;line-height:1.5}
#share-dialog .share-body-option input{width:17px;height:17px;margin:2px 0 0;flex-shrink:0}
#share-dialog .share-body-option small{display:block;font-size:11px;font-weight:400;line-height:1.7;color:var(--muted);margin-top:5px}
#share-dialog .share-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:22px}
#share-dialog .share-actions button{padding:17px 10px;min-height:76px;white-space:normal;border-radius:11px;font-size:13px;line-height:1.5}
#share-dialog .share-actions small{display:block;font-size:10px;font-weight:400;opacity:.8;margin-top:5px}
#share-status{font-size:11px;margin:15px 0 0;min-height:20px;line-height:1.65}
.model-loading{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:6;pointer-events:none;width:min(300px,calc(100% - 48px));padding:18px 20px;border:1px solid var(--line);border-radius:14px;background:#fff;box-shadow:0 4px 16px #43444410;color:var(--accent-ink);font-size:13px}
.model-loading progress{display:block;appearance:none;-webkit-appearance:none;width:100%;height:5px;margin-top:9px;border:0;border-radius:10px;overflow:hidden;background:var(--line);accent-color:var(--accent-ink)}
.model-loading progress::-webkit-progress-bar{background:var(--line);border-radius:10px}
.model-loading progress::-webkit-progress-value{background:var(--accent);border-radius:10px;transition:width .2s ease}
.model-loading progress::-moz-progress-bar{background:var(--accent);border-radius:10px}
.model-loading progress:indeterminate{background:linear-gradient(90deg,var(--line) 20%,var(--accent-soft) 50%,var(--line) 80%);background-size:200% 100%;animation:loading-slide 1.3s linear infinite}
.model-loading progress:indeterminate::-webkit-progress-bar{background:transparent}
.viewer[aria-busy=true]>:not(.model-loading):not(.viewer-error){visibility:hidden;pointer-events:none}
@keyframes loading-slide{to{background-position:-200% 0}}
@media(prefers-reduced-motion:reduce){.model-loading progress{animation:none!important;transition:none!important}}
@media(max-width:700px){#share-dialog{padding:23px 20px}.model-loading{width:min(280px,calc(100% - 40px))}}

/* Customer links use the saved body and devote the viewport to try-on. */
.customer-view{height:100vh;height:100dvh;overflow:hidden}
.customer-view main,.customer-view .workspace{padding:0;margin:0;max-width:none;display:block;height:100%}
.customer-view .intro,.customer-view .panel,.customer-view footer,.customer-view .product-toolbar,
.customer-view #fit-panel,.customer-view #wearing-structure,
.customer-view #circumference-help,.customer-view #product-note,
.customer-view .site-header .brand,.customer-view .header-note,.customer-view #share-open,
.customer-view #customer-share-open,.customer-view #model-status{display:none!important}
.customer-view .site-header{position:fixed;right:max(14px,env(safe-area-inset-right));top:env(safe-area-inset-top);height:auto;border:0;padding:0;z-index:8}
.customer-view #source-open{font-size:11px;min-height:44px;padding:12px 4px;color:var(--muted)}
.customer-view .model-section{position:static;height:100%;width:100%}
.customer-view .viewer{width:100%;height:100%;border:0;border-radius:0}
.customer-view .viewer-top{top:max(22px,env(safe-area-inset-top));left:24px;right:115px}
.customer-view .viewer-product-label{left:24px;top:50px}
.customer-view .viewer-bottom{bottom:calc(45px + env(safe-area-inset-bottom));left:24px;right:24px}
.customer-view .viewer-hint{bottom:calc(23px + env(safe-area-inset-bottom));left:24px}
.customer-product-open{position:fixed;right:max(20px,env(safe-area-inset-right));bottom:calc(112px + env(safe-area-inset-bottom));z-index:8;display:flex;align-items:center;gap:8px;border:1px solid #ffffffaa;border-radius:28px;padding:14px 20px;background:var(--accent);color:var(--on-accent);box-shadow:0 6px 24px #765A3D26;font-size:14px;min-height:48px}
.customer-product-open span{font-size:20px;line-height:1}
.customer-stamp{display:none}
.customer-view .customer-stamp{display:flex;flex-direction:column;position:fixed;left:24px;top:76px;font-size:10px;color:var(--muted);pointer-events:none;gap:6px;max-width:calc(100vw - 48px)}
#customer-age-note{font-size:11px;color:var(--muted)}
#customer-products{width:360px;padding:30px 24px 24px;margin:auto 20px 178px auto;max-height:calc(100dvh - 60px);overflow:auto}
#customer-products-close{position:absolute;right:17px;top:18px;z-index:6}
#customer-products .product-picker{border:0;margin:0;padding:0}
#customer-products .panel-title{padding-right:28px}
#customer-products .section-note{margin:12px 0 22px}
#customer-products .size-options button{min-height:46px;min-width:45px;flex:1}
#customer-products .product-dropdown-menu{position:relative;top:auto;margin-top:6px;max-height:180px;box-shadow:none}
#customer-apply{width:100%;margin-top:24px;font-size:14px;min-height:46px;border-radius:10px}
#customer-share-dialog{width:min(540px,calc(100vw - 32px))}
.customer-privacy{font-size:10px!important;margin:10px 0 18px}
#customer-result{padding:16px;background:var(--accent-tint);border:1px solid var(--line);border-radius:10px;font-size:13px}
.customer-result-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
.customer-result-heading strong{min-width:0;line-height:1.6}
#customer-preview{flex-shrink:0;min-height:32px;display:flex;align-items:center;padding:4px 0;text-decoration:none;font-size:11px;color:var(--accent-ink);white-space:nowrap}
#customer-preview:hover{text-decoration:underline}
.customer-result-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.customer-result-actions>*{flex:1;text-align:center;text-decoration:none}
#customer-share-status{color:var(--accent-ink);min-height:20px}
#customer-failure{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px;text-align:center;background:var(--paper);z-index:10}
#customer-failure h1{font-size:24px}#customer-failure p{max-width:380px;color:var(--muted);line-height:1.9}
.customer-unavailable main,.customer-unavailable .customer-stamp{display:none}
@media(max-width:700px){
 .customer-view .viewer-top{left:18px;font-size:10px}
 .customer-view .viewer-product-label{left:18px;top:49px;font-size:13px}
 .customer-view .customer-stamp{left:18px;top:75px}
 .customer-view .viewer-bottom{left:12px;right:12px;gap:6px;flex-wrap:nowrap;bottom:calc(45px + env(safe-area-inset-bottom))}
 .customer-view .view-buttons{width:auto;gap:0;flex-shrink:0}
 .customer-view .view-buttons button{min-height:36px;padding:7px 8px;font-size:11px}
 .customer-view .viewer-bottom .icon-button{width:36px;height:36px;flex-shrink:0}
 .customer-view .viewer-bottom .check-label{font-size:10px;white-space:nowrap}
 .customer-view .viewer-hint{left:18px;display:block;font-size:9px}
 .customer-view .floating-label{font-size:10px;padding:7px 8px}
 .customer-view .height-label{font-size:20px}
 .customer-product-open{right:16px;padding:12px 17px;bottom:calc(111px + env(safe-area-inset-bottom))}
 #customer-products{width:100%;max-width:none;margin:auto 0 0;border-radius:22px 22px 0 0;padding:28px 24px calc(24px + env(safe-area-inset-bottom));max-height:85dvh}
 #customer-share-dialog{padding:22px 18px}
 .site-header .header-actions{gap:3px}.site-header #customer-share-open{font-size:10px;padding:8px}
 .site-header .brand{gap:5px;font-size:18px;letter-spacing:1px}
}
@media(max-width:360px){.customer-view .view-buttons button{padding:6px}.customer-view .viewer-bottom{gap:4px;left:8px;right:8px}}
@media(max-height:500px) and (orientation:landscape){.customer-view .viewer-top{top:14px}.customer-view .viewer-product-label{top:36px}.customer-view .customer-stamp{top:60px}.customer-view .viewer-bottom{bottom:16px}.customer-view .viewer-hint{display:none}.customer-product-open{bottom:80px}}

/* Clear, mutually exclusive product types, shared by both page variants. */
.product-field{align-items:flex-start}
.product-field>span{padding-top:14px}
.product-type-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;flex:1;min-width:0}
.product-type-choice{position:relative;display:flex;align-items:center;justify-content:center;gap:7px;min-height:56px;padding:10px 6px;border:2px solid var(--line);border-radius:11px;background:#fff;color:var(--muted);cursor:pointer;transition:background .15s,border-color .15s,box-shadow .15s}
.product-type-choice input{position:absolute;width:1px;height:1px;opacity:0}
.product-type-choice strong{font-family:inherit;font-size:13px;white-space:nowrap;font-weight:400}
.type-choice-check{display:grid;place-items:center;width:20px;height:20px;flex-shrink:0;border:1.5px solid #C5B9AC;border-radius:5px;color:transparent;font-size:14px;font-weight:800}
.product-type-choice.selected{background:var(--accent);border-color:var(--accent);color:var(--on-accent);box-shadow:0 3px 10px #B18F6824}
.product-type-choice.selected .type-choice-check{background:#fff;border-color:#fff;color:var(--accent)}
.product-type-choice:focus-within{outline:3px solid var(--accent-soft);outline-offset:3px}
#customer-products .product-type-choice{min-height:60px}
/* Label stays level with the closed field when the series list expands. */
#customer-products .product-field>span{align-self:flex-start}
.customer-view .customer-stamp{top:51px}
@media(max-width:700px){.customer-view .customer-stamp{top:50px}}
@media(max-height:500px) and (orientation:landscape){.customer-view .customer-stamp{top:38px}}

/* This button remains reachable while the other interface slides offscreen. */
.viewer-bottom{right:72px!important}
.viewer-focus-toggle{position:absolute;z-index:9;right:25px;bottom:40px;display:grid;place-items:center;min-width:34px;min-height:34px}
.viewer-focus-toggle svg{width:19px;height:19px}
.collapse-icon{display:none}
.viewer-focused .expand-icon{display:none}.viewer-focused .collapse-icon{display:block}
.viewer-focused{overflow:hidden}
.viewer-focused .viewer{position:fixed;inset:0;width:100vw;height:100vh;height:100dvh;border-radius:0;border:0;z-index:20}
.viewer-focused .model-section{position:static}
.viewer-focused #zoom-fit{opacity:1;visibility:visible;pointer-events:auto}
.site-header,.intro,.panel,footer,.product-toolbar,.viewer-top,.viewer-bottom,.viewer-hint,.customer-stamp,.floating-label,.height-label,.model-section>p,.fit-panel,.dimension-strip,.model-note{transition:transform .3s ease,opacity .3s ease,visibility .3s}
.viewer-focused .site-header,.viewer-focused .intro,.viewer-focused .product-toolbar,.viewer-focused .viewer-top,.viewer-focused .customer-stamp{transform:translateY(-140px);opacity:0;visibility:hidden;pointer-events:none}
.viewer-focused .panel{transform:translateX(-110%);opacity:0;visibility:hidden;pointer-events:none}
.viewer-focused .viewer-bottom,.viewer-focused .viewer-hint,.viewer-focused footer,.viewer-focused .model-section>p,.viewer-focused .fit-panel,.viewer-focused .dimension-strip,.viewer-focused .model-note{transform:translateY(160px);opacity:0;visibility:hidden;pointer-events:none}
.viewer-focused .height-label{transform:translate(-100vw,-50%);opacity:0;visibility:hidden}
.viewer-focused .floating-label{transform:translate(100vw,-50%);opacity:0;visibility:hidden}
.customer-product-open{touch-action:none;user-select:none;-webkit-user-select:none;transition:left .2s ease,top .2s ease,transform .3s ease,opacity .3s ease,visibility .3s}
.customer-product-open.is-dragging{transition:none;cursor:grabbing;box-shadow:0 10px 28px #765A3D38}
.viewer-focused .customer-product-open{transform:translateX(150%);opacity:0;visibility:hidden;pointer-events:none}
.viewer-focused .customer-product-open.dock-left{transform:translateX(-150%)}
.customer-view .viewer-focus-toggle{right:24px;bottom:calc(45px + env(safe-area-inset-bottom))}
@media(max-width:700px){
 .viewer-bottom{right:54px!important}
 .viewer-focus-toggle{right:12px;width:36px;height:36px}
 .customer-view .viewer-focus-toggle{right:12px;width:36px;height:36px}
 .customer-view .viewer-bottom .view-buttons{margin-right:auto}
 #customer-products .product-type-choices{gap:8px}
}
@media(max-width:360px){#customer-products .product-type-choice{gap:5px}.customer-view .viewer-focus-toggle{right:8px}}
@media(max-height:500px) and (orientation:landscape){.customer-view .viewer-focus-toggle{bottom:16px}}
@media(prefers-reduced-motion:reduce){.viewer-focused *,.customer-product-open,.viewer-top,.viewer-bottom,.viewer-hint,.floating-label,.height-label,.site-header,.customer-stamp{transition:none!important}}
#customer-products{margin:auto 20px auto auto;max-height:calc(100dvh - 32px)}
@media(max-width:700px){#customer-products{margin:auto 0 0;max-height:85dvh}}
.customer-product-open{width:max-content;white-space:nowrap}

/* Keep home navigation separate from reference information. */
.header-sharing{display:flex;align-items:center;gap:8px;border-left:1px solid var(--line);padding-left:18px;margin-left:6px}
.site-header .reference-link{display:flex;align-items:center;gap:6px;min-height:44px;font-size:12px;color:var(--muted);white-space:nowrap}
.reference-link span{font-size:16px;font-weight:400}
.site-header .header-sharing a{display:flex;align-items:center;justify-content:center;text-decoration:none;min-height:44px;font-size:12px;padding:10px 15px}
.customer-view .header-sharing{display:none}
.customer-result-actions>*{min-height:42px;display:flex;align-items:center;justify-content:center;padding:10px 8px}
#customer-image{border-color:var(--accent-soft);color:var(--accent-ink);background:#fff}
#customer-image:not(:disabled):hover{background:var(--accent-tint)}
#customer-image-fallback{text-align:center;margin:14px 0 20px}
#customer-card{display:block;width:100%;max-width:340px;height:auto;margin:0 auto 12px;border-radius:12px;border:1px solid var(--line)}
#customer-card-download{display:inline-block;text-decoration:none}
@media(max-width:700px){
 body:not(.customer-view) .site-header{display:grid;grid-template-columns:1fr auto;gap:4px 16px;padding:10px 4% 12px;height:auto}
 body:not(.customer-view) .header-actions{display:contents}
 body:not(.customer-view) .header-sharing{grid-column:1/-1;border:0;padding:0;margin:0;gap:10px}
 body:not(.customer-view) .header-sharing a{flex:1;min-height:42px;font-size:12px}
 body:not(.customer-view) .site-header .reference-link{font-size:11px;padding:8px 0}
}

.product-type-choice[aria-disabled="true"]{opacity:.4;cursor:not-allowed;box-shadow:none}
/* Pull-up working-range feedback also travels with the customer product picker. */
.elastic-note{margin:12px 0 0;padding:9px 11px;border-radius:8px;background:var(--info-soft);color:var(--info);font-size:11px;line-height:1.65}
.elastic-note.tooLarge,.fit-chip.tooLarge{background:#fff4d6;color:#9a6200}
.elastic-note.tooSmall,.fit-chip.tooSmall{background:#faecec;color:#b33a3a}
.fit-chip.compatible{background:var(--info-soft);color:var(--info)}
/* Select one reference; keep the selector visible while its content scrolls. */
#source-dialog{width:min(880px,calc(100vw - 32px));max-height:90vh;max-height:90dvh;padding:0;overflow:hidden}
#source-dialog[open]{display:flex;flex-direction:column}
#source-dialog .dialog-heading{flex-shrink:0;padding:22px 26px;margin:0;border-bottom:1px solid var(--line);background:#fff}
#source-dialog .dialog-heading .icon-button{width:40px;height:40px}
.source-tabs{display:flex;gap:6px;flex-shrink:0;margin:20px 24px 0;padding:5px;border-radius:12px;background:var(--paper)}
.source-tabs [role="tab"]{flex:1;min-width:0;min-height:46px;padding:10px 12px;border:0;border-radius:8px;background:transparent;color:var(--muted);font:inherit;font-size:13px;cursor:pointer}
.source-tabs [aria-selected="true"]{background:var(--accent);color:var(--on-accent);font-weight:600;box-shadow:0 2px 5px #302a2320}
.source-tabs [role="tab"]:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.source-content{padding:20px 24px 24px;overflow:auto;overscroll-behavior:contain;min-height:0}
.source-column[hidden]{display:none}
.source-column{min-width:0;border:1px solid var(--line);border-radius:12px;padding:22px;background:var(--surface)}
#source-dialog .source-kicker{margin:0 0 7px;font-size:10px;letter-spacing:.6px;color:var(--muted)}
#source-dialog .source-column>h3{margin:0 0 18px;font-size:19px;color:var(--ink)}
#source-dialog h4{margin:22px 0 8px;font-size:13px;font-weight:600}
#source-dialog p{overflow-wrap:anywhere}
.source-boundary{padding:12px 14px;border-radius:8px;background:var(--paper)}
.source-topic{border-top:1px solid var(--line)}
.source-topic summary{padding:13px 0;cursor:pointer;font-size:12px;font-weight:550;line-height:1.6}
.source-topic-body{padding-bottom:12px}
.source-topic-body>p:first-child{margin-top:0}
.source-topic-body a{overflow-wrap:anywhere}
.source-table{overflow-x:auto;max-width:100%;margin:14px 0;border:1px solid var(--line);border-radius:8px;background:#fff}
.source-table table{border-collapse:collapse;min-width:480px;width:100%;font-size:11px;line-height:1.7}
.source-table th,.source-table td{padding:9px 10px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line);border-right:1px solid var(--line)}
.source-table th{background:var(--paper);font-weight:600}
.source-table tr:last-child td{border-bottom:0}
.source-table th:last-child,.source-table td:last-child{border-right:0}
@media(max-width:760px){
 #source-dialog{width:calc(100vw - 20px);max-height:92vh;max-height:92dvh}
 #source-dialog .dialog-heading{padding:12px 16px}
 .source-tabs{margin:14px 14px 0;gap:4px;padding:4px}
 .source-tabs [role="tab"]{font-size:12px;padding:9px 5px}
 .source-content{padding:14px}
 .source-column{padding:17px}
 #source-dialog .source-column>h3{font-size:17px}
}

/* Fixed top-left capsule sits below the draggable product button in stacking order. */
.customer-fit-notice{--notice-bg:#fff4d6;--notice-line:#e5d6b0;position:absolute;z-index:7;left:18px;top:calc(82px + env(safe-area-inset-top));width:max-content;max-width:calc(100% - 36px);color:#9a6200}
.customer-fit-capsule{display:flex;align-items:center;gap:7px;width:max-content;max-width:100%;min-height:34px;padding:6px 11px;border:1px solid var(--notice-line);border-radius:20px;background:var(--notice-bg);box-shadow:0 2px 8px #302a2308;color:inherit;text-align:left}
.customer-fit-capsule>span:first-child{font-size:14px;flex-shrink:0}
#customer-fit-summary{font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.customer-fit-selection{font-size:12px;line-height:1.75;padding:10px 12px;margin:12px 0 0;border-radius:8px;background:#fff4d6;color:#9a6200}
.customer-fit-notice[data-tone=tight]{--notice-bg:#faecec;--notice-line:#e6baba;color:#b33a3a}
.customer-fit-selection[data-tone=tight]{background:#faecec;color:#b33a3a}
.viewer-focused .customer-fit-notice,.customer-unavailable .customer-fit-notice{display:none!important}
@media(max-height:500px) and (orientation:landscape){.customer-fit-notice{top:calc(64px + env(safe-area-inset-top))}}

/* Customer controls stay light over the scene, with comfortable touch targets. */
.customer-size-dock,.customer-body-dock{position:fixed;z-index:7;left:50%;transform:translateX(-50%);border:1px solid #ffffffb3;background:#F7F4F0D9;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 5px 24px #302a2309;transition:opacity .25s,visibility .25s}
.customer-size-dock{top:calc(18px + env(safe-area-inset-top));width:max-content;max-width:calc(100vw - 32px);padding:4px 6px;border-radius:14px}
.customer-control-label{display:none}
.customer-size-dock .size-options{display:flex;flex-wrap:nowrap;gap:4px}
.customer-size-dock .size-options button{flex:0 0 auto;min-width:48px;min-height:44px;padding:4px 8px;font-size:12px;border-color:transparent;background:transparent;border-radius:10px}
.customer-size-dock .size-options button.active{background:var(--accent);color:var(--on-accent);box-shadow:0 2px 7px #B18F6820}
.customer-size-dock .size-options button.recommended:not(.active){background:var(--accent-tint);border-color:var(--accent-soft)}
.customer-size-dock .size-options button small{font-size:9px;margin-top:2px}
.customer-body-dock{width:min(280px,calc(100vw - 40px));bottom:calc(98px + env(safe-area-inset-bottom));border-radius:14px;padding:4px 4px 2px}
.customer-body-dock .dimension-strip{margin:0;padding:0;background:transparent;border:0;border-radius:0}
.customer-body-dock .dimension-title{padding:0 9px;margin-bottom:0}
.customer-body-dock .dimension-title h2{font-size:10px;font-weight:500;color:var(--muted);letter-spacing:.5px}
.customer-body-dock #reset-circumferences{font-size:10px;padding:3px;min-height:24px}
.customer-body-dock .dimension-strip>div:not(.dimension-title){padding:0 9px;border-color:var(--line)}
.customer-body-dock .dimension-strip span{font-size:10px;line-height:12px;margin-bottom:1px}
.customer-body-dock .dimension-strip em{display:none}
.customer-body-dock .dimension-input input{font-size:18px;min-height:24px;border-bottom:0;padding:0}
.customer-body-dock .dimension-input small{font-size:10px}
.customer-body-dock .input-error{margin:6px 12px;line-height:1.6}
.customer-product-open{bottom:calc(270px + env(safe-area-inset-bottom))}
#customer-products{width:400px;padding-top:26px}
#customer-products .section-note{margin:9px 0 15px}
#customer-basic-controls{border-top:1px solid var(--line);padding-top:16px;margin-top:20px}
#customer-basic-controls h3{font-size:13px;margin:0 0 12px;font-weight:600}
#customer-basic-controls .parameter{margin:14px 0}
#customer-basic-controls input[type=range]{margin-top:14px;margin-bottom:8px}
#customer-apply{margin-top:12px;min-height:48px}
.viewer-focused .customer-size-dock,.viewer-focused .customer-body-dock{opacity:0;visibility:hidden;pointer-events:none}
.customer-unavailable .customer-size-dock,.customer-unavailable .customer-body-dock{display:none!important}
@media(max-width:800px){
 .customer-size-dock{top:calc(77px + env(safe-area-inset-top))}
 .customer-view .customer-fit-notice{top:calc(143px + env(safe-area-inset-top));left:14px}


 #customer-products{width:100%;padding:24px 22px calc(20px + env(safe-area-inset-bottom))}
}
@media(max-height:500px) and (orientation:landscape){
 .customer-size-dock{top:12px}
 .customer-control-label{display:none}
 .customer-body-dock{left:auto;right:12px;transform:none;width:220px;bottom:70px;padding:5px 2px 3px}
 .customer-body-dock .dimension-strip>div:not(.dimension-title){padding:0 6px}
 .customer-body-dock .dimension-input input{font-size:18px}
 .customer-body-dock .dimension-title{padding:0 6px;margin-bottom:3px}
 .customer-body-dock .dimension-title h2{font-size:10px}
 .customer-view .customer-fit-notice{top:80px}
 .customer-product-open{bottom:225px}
}

/* The guide lives in the open dialog's top layer, then follows the customer to the scene. */
.customer-guide{position:fixed;inset:0;z-index:100;isolation:isolate;touch-action:manipulation}
.customer-guide[data-mode=action],.customer-guide[data-mode=edit],.customer-guide[data-mode=waiting]{pointer-events:none}
.customer-loading-lock{position:fixed;inset:0;z-index:110;touch-action:none;overscroll-behavior:none}
.customer-loading-locked{overflow:hidden;touch-action:none;overscroll-behavior:none}
.customer-guide-ring{position:fixed;border:1px solid var(--accent-soft);border-radius:12px;box-shadow:0 0 0 9999px #302a2357;pointer-events:none}
.customer-guide-card{position:fixed;pointer-events:auto;padding:14px 18px 17px;border:1px solid var(--line);border-radius:18px;background:#ffffff;color:var(--ink);box-shadow:0 12px 38px #302a2324;outline:none}
.customer-guide-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:-5px}
.customer-guide-kind{font-size:11px;color:var(--accent-ink);letter-spacing:1px}
.customer-guide-skip{min-height:40px;min-width:48px;padding:6px 0 6px 12px;border:0;background:none;color:var(--muted);font-size:12px}
.customer-guide-card h2{font-size:17px;line-height:1.5;font-weight:600;margin:0 0 8px}
.customer-guide-card p{font-size:12px;color:var(--muted);line-height:1.8;margin:0}
.customer-guide-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:14px;font-size:10px;color:var(--muted)}
.customer-guide-count{font-variant-numeric:tabular-nums;letter-spacing:2px;color:var(--muted)}
.customer-guide-hint{color:var(--accent-ink);text-align:right}
.customer-guide-card:focus-visible{outline:none}
.customer-unavailable .customer-guide{display:none!important}
@media(prefers-reduced-motion:no-preference){.customer-guide-card{animation:guide-appear .16s ease-out}@keyframes guide-appear{from{opacity:0}to{opacity:1}}}

.customer-guide-next{min-width:82px;min-height:40px;padding:9px 18px;border:1px solid var(--accent);border-radius:9px;background:var(--accent);color:var(--on-accent);font-size:12px}
.customer-guide-next:hover{background:var(--accent-ink)}
.customer-guide[data-step="3"] .customer-guide-card::after{content:"";position:absolute;left:calc(50% - 6px);bottom:-7px;width:12px;height:12px;background:#ffffff;border-right:1px solid var(--line);border-bottom:1px solid var(--line);transform:rotate(45deg)}
.customer-body-dock .dimension-input{align-items:center;min-height:28px;padding:1px 5px;border:1px solid var(--line);border-radius:6px;background:#ffffffbf}
.customer-body-dock .dimension-input:focus-within{border-color:var(--accent-ink);box-shadow:0 0 0 2px #B18F6814}
.customer-body-dock .dimension-input input:focus-visible{outline:none}
.customer-body-dock .dimension-input:has(input[aria-invalid=true]){border-color:#b33a3a}

/* Keep a broad touch target while the visible rail stays compact. */
input:is(#age-range,#length-range,#weight-range){display:block;height:44px;margin:1px 0;background:transparent;touch-action:none;-webkit-tap-highlight-color:transparent}
input:is(#age-range,#length-range,#weight-range)::-webkit-slider-runnable-track{height:5px;border-radius:5px;background:linear-gradient(to right,var(--accent) var(--fill,50%),#D7E5EB var(--fill,50%))}
input:is(#age-range,#length-range,#weight-range)::-moz-range-track{height:5px;border-radius:5px;background:linear-gradient(to right,var(--accent) var(--fill,50%),#D7E5EB var(--fill,50%))}
input:is(#age-range,#length-range,#weight-range)::-webkit-slider-thumb{width:26px;height:26px;margin-top:-10.5px;border:3px solid #fff;box-shadow:0 1px 5px #B18F6830,0 0 0 1px var(--accent-soft)}
input:is(#age-range,#length-range,#weight-range)::-moz-range-thumb{box-sizing:border-box;width:26px;height:26px;border:3px solid #fff;box-shadow:0 1px 5px #B18F6830,0 0 0 1px var(--accent-soft)}
input:is(#age-range,#length-range,#weight-range):active::-webkit-slider-thumb{box-shadow:0 0 0 6px #B18F6819,0 0 0 1px var(--accent-ink)}
input:is(#age-range,#length-range,#weight-range):active::-moz-range-thumb{box-shadow:0 0 0 6px #B18F6819,0 0 0 1px var(--accent-ink)}
#customer-products #customer-basic-controls input[type=range]{margin:0}
.customer-body-dock{padding-bottom:9px}

/* App controls should not invoke browser zoom, text selection or drag previews. */
body{touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}
.customer-view{overscroll-behavior:none;touch-action:pan-x pan-y}
html:has(body.customer-view){overscroll-behavior:none}
dialog,.source-content,.source-table{overscroll-behavior:contain}
input:not([type=range]),textarea,[contenteditable=true],#source-dialog,#source-dialog *,#customer-card{-webkit-user-select:text;user-select:text;-webkit-touch-callout:default}
#customer-card{-webkit-user-drag:auto}
@media(max-width:800px){input.share-link,.measurement-grid input,textarea{font-size:16px}}

/* Optional, local waist stretch. It never replaces the saved wearing shape. */
#waist-label:has(.waist-pull-launch:not([hidden])){display:flex;align-items:center;gap:0;padding:0 3px 0 8px;pointer-events:auto;overflow:hidden}
#waist-label.pull-only{padding-left:0}
#waist-label.pull-only .waist-data{display:none}
.waist-pull-launch{display:inline-flex;align-items:center;justify-content:center;gap:2px;min-height:40px;margin-left:3px;padding:0 7px;border:0;border-radius:5px;background:transparent;color:var(--watercolor-ink);font:inherit;font-size:10px;white-space:nowrap;touch-action:manipulation}
.waist-pull-launch span{font-size:17px;font-weight:300;line-height:1}
.pull-only .waist-pull-launch{margin-left:0}
.waist-pull-launch:hover{background:#F0F7FA}
.waist-pull-launch:focus-visible{outline:2px solid var(--watercolor-ink);outline-offset:2px}
.waist-pull-handle{position:absolute;z-index:10;transform:translate(-50%,-50%);width:56px;height:56px;border:0;background:transparent;box-shadow:none;cursor:grab;touch-action:none;user-select:none;color:var(--accent-ink)}
.waist-pull-handle>span{position:absolute;width:26px;height:22px;margin:-11px 0 0 -13px;text-align:center;font-size:25px;font-weight:300;line-height:22px;pointer-events:none;text-shadow:0 1px 4px #ffff;transition:opacity .18s}
.waist-pull-handle small{position:absolute;white-space:nowrap;transform:translateX(-50%);font-size:10px;line-height:16px;color:var(--accent-ink);text-shadow:0 1px 4px #ffff;pointer-events:none;transition:opacity .18s}
.waist-pull-handle.is-dragging{cursor:grabbing}
.waist-pull-handle.has-interacted>span,.waist-pull-handle.has-interacted small{opacity:0}
.waist-pull-handle:focus-visible{outline:2px dashed #765A3D77;outline-offset:2px;border-radius:6px}
.waist-pull-handle.show-hint>span,.waist-pull-handle.show-hint small{animation:pull-fabric-hint .9s ease-in-out 1}
@keyframes pull-fabric-hint{0%,100%{translate:0 0}50%{translate:var(--hint-dx,5px) var(--hint-dy,0px)}}
@media(prefers-reduced-motion:reduce){.waist-pull-handle.show-hint>span,.waist-pull-handle.show-hint small{animation:none}}
.waist-pull-exit{position:absolute;z-index:12;top:59px;right:18px;display:inline-flex;align-items:center;gap:7px;min-height:40px;padding:0 13px;border:1px solid var(--accent-soft);border-radius:22px;background:#F7F4F0EB;color:var(--accent-ink);font:inherit;font-size:12px;box-shadow:0 2px 10px #765A3D0a;backdrop-filter:blur(8px);cursor:pointer;touch-action:manipulation}
.waist-pull-exit svg{flex:none}.waist-pull-exit:hover{background:var(--accent-tint)}.waist-pull-exit:active{background:var(--line)}.waist-pull-exit:focus-visible{outline:2px solid var(--accent-ink);outline-offset:3px}
.customer-view .waist-pull-exit{top:calc(48px + env(safe-area-inset-top))}
.waist-pulling .floating-label,.waist-pulling .height-label,.waist-pulling .viewer-bottom,.waist-pulling .viewer-hint,.waist-pulling .viewer-focus-toggle,.waist-pulling .customer-size-dock,.waist-pulling .customer-body-dock,.waist-pulling .customer-product-open{visibility:hidden!important;pointer-events:none!important}
.waist-pulling .canvas-wrap{touch-action:none}
.customer-unavailable .waist-pull-launch,.customer-unavailable .waist-pull-exit,.customer-unavailable .waist-pull-handle{display:none!important}
.viewer[aria-busy=true] .waist-pull-launch{display:none!important}

.waist-pulling .waist-pull-launch{visibility:hidden;pointer-events:none}

/* Aleva sand-gold actions with cream surfaces; fitting states retain semantic colors. */
.brand{color:#302A23}.brand-mark img{display:block;width:100%;height:100%}
.product-type-choice.selected .type-choice-check{color:var(--on-accent);background:var(--accent-tint);border-color:var(--accent-tint)}
:is(.primary-button,.customer-product-open,.customer-guide-next):not(:disabled):hover{background:var(--accent-hover)}
.size-options button.active:hover,.view-buttons button.active:hover,.source-tabs [aria-selected="true"]:hover{background:var(--accent-hover)}
.customer-product-open:focus-visible{outline-color:var(--accent-ink)}

/* Boundary advice remains distinct from a confirmed recommendation. */
.fit-chip.trial{background:#FFF4D6;color:#9A6200}
.size-recommendation{font-size:11px;line-height:1.65;color:#9A6200;margin:10px 0 0}
.fit-chip.possiblyTight,.fit-chip.possiblyLoose,.fit-chip.uncertain{background:#FFF4D6;color:#9A6200}

#customer-basic-controls h3{display:flex;align-items:center;justify-content:space-between;gap:12px}
#customer-restart{font-size:11px;font-weight:400;min-height:32px;padding:4px 8px;color:var(--accent-ink)}
#customer-result .customer-privacy{margin:8px 0 0;line-height:1.7}

/* The darker pressed state keeps readable text on brand controls. */
:is(.primary-button,.customer-product-open,.customer-guide-next):not(:disabled):active{background:var(--accent-ink);border-color:var(--accent-ink);color:#fff}

.height-label .body-weight{margin-top:14px;padding-top:11px;border-top:1px solid var(--watercolor-line);text-align:right}

/* Watercolor lives at the edges; gold remains the one primary action color. */
.viewer{isolation:isolate;background:radial-gradient(ellipse at 52% 38%,#FCFAF6 0,var(--paper) 76%,#ECE7DE 100%)}
.viewer::before,.viewer::after{content:"";position:absolute;z-index:-1;pointer-events:none;transition:opacity .3s ease}
.viewer::before{inset:0;background:url('./assets/watercolor-wash.svg') no-repeat right -165px top -210px / 670px 670px,url('./assets/watercolor-wash.svg') no-repeat left -240px bottom -225px / 720px 720px;opacity:.82}
.viewer::after{right:14px;bottom:82px;width:150px;height:210px;background:url('./assets/botanical-lines.svg') center / contain no-repeat;opacity:.65}
.viewer-focused .viewer::before,.viewer-focused .viewer::after{opacity:0}
.viewer[aria-busy=true]::after{opacity:.22}
.intro{position:relative;isolation:isolate}
.intro::after{content:"";position:absolute;z-index:-1;right:8%;top:-65px;width:250px;height:230px;background:url('./assets/watercolor-wash.svg') center / contain no-repeat;pointer-events:none;opacity:.72}
.eyebrow::before{content:"";display:inline-block;vertical-align:middle;width:24px;height:3px;margin-right:9px;border-radius:3px;background:var(--watercolor)}
.header-note i,.live-dot{background:var(--watercolor);box-shadow:0 0 0 3px #A0C5D71A}
.reference-card{position:relative;overflow:hidden;border:1px solid var(--watercolor-line);background:linear-gradient(135deg,#F4F9FB,#E5F0F5)}
.reference-card::after{content:"";position:absolute;right:-10px;bottom:-22px;width:76px;height:76px;border:1px solid #A0C5D766;border-radius:50%;box-shadow:0 0 0 12px #A0C5D712;pointer-events:none}
.reference-card .mini-label{color:var(--watercolor-ink)}
.product-dropdown-trigger{background:linear-gradient(105deg,#FCFBF8 52%,#EAF3F7);border-color:var(--watercolor-line)}
.product-dropdown-trigger[aria-expanded=true]{border-color:var(--watercolor);box-shadow:0 0 0 3px #A0C5D71A}
.product-dropdown-option:focus-visible{outline-color:var(--watercolor-ink)}
.product-type-choice:not(.selected){border-color:var(--watercolor-line);background:linear-gradient(135deg,#fff,#F4F9FB)}
.product-type-choice:not(.selected) .type-choice-check{border-color:#A7C1CD}
.customer-size-dock,.customer-body-dock{background:linear-gradient(115deg,#FFFEFBE8 38%,#EAF3F7E8);border-color:#C7DDE6CC;box-shadow:0 5px 24px #526D890B,inset 0 1px 0 #fff}
.customer-body-dock .dimension-title h2{color:var(--watercolor-ink)}
.customer-body-dock .dimension-title h2::before{content:"";display:inline-block;vertical-align:middle;width:3px;height:10px;margin-right:5px;border-radius:2px;background:var(--watercolor)}
.customer-body-dock .dimension-input{border-color:#CDDDE3;background:#FFFFFFD9}
.customer-body-dock .dimension-input:focus-within{border-color:var(--watercolor-ink);box-shadow:0 0 0 2px #A0C5D726}
.view-buttons{border-color:var(--watercolor-line);background:linear-gradient(115deg,#FFFFFFC9,#EAF3F7C9)}
.floating-label{border-color:#D5E3E8;background:#FFFFFFDE}
.floating-label i{background:var(--watercolor)}
.icon-button{border-color:var(--watercolor-line)}
.customer-guide-ring{border-color:var(--watercolor);outline:3px solid #A0C5D72B;outline-offset:2px}
.customer-guide-card{border-color:var(--watercolor-line);background:radial-gradient(ellipse at 100% 0,#DCECF4 0,transparent 52%),#fff}
.customer-guide-kind{color:var(--watercolor-ink)}
.customer-guide-kind::before{content:"";display:inline-block;width:5px;height:5px;vertical-align:middle;margin-right:6px;border-radius:50%;background:var(--watercolor)}
.customer-guide[data-step="3"] .customer-guide-card::after{border-color:var(--watercolor-line)}
.model-loading{border-color:var(--watercolor-line);background:radial-gradient(ellipse at 100% 0,#E2F0F6,transparent 70%),#fff;box-shadow:0 5px 22px #526D8914}
.model-loading progress::-webkit-progress-bar{background:#DEEBF0}
.model-loading progress::-moz-progress-bar{background:var(--accent)}
.source-tabs{background:linear-gradient(110deg,var(--paper) 38%,#E4F0F5)}
.source-column{background:radial-gradient(ellipse at 100% 0,#E5F0F5 0,transparent 55%),#F9F7F3}
#source-dialog .source-kicker{color:var(--watercolor-ink)}
.source-table th{background:#EAF3F7}
#share-dialog .share-body-option{background:linear-gradient(115deg,#FAF8F4,#EDF5F8);border-color:var(--watercolor-line)}
#customer-result{background:linear-gradient(125deg,var(--accent-tint) 30%,#EAF3F7);border-color:var(--watercolor-line)}
@media(max-width:800px){
 .viewer::before{background-position:right -195px top -105px,left -225px bottom -100px;background-size:440px 440px,480px 480px;opacity:.82}
 .viewer::after{right:-25px;bottom:210px;width:105px;height:150px;opacity:.6}
 .intro::after{right:-35px;top:-35px;width:180px;height:180px;opacity:.5}
}
@media(max-height:500px) and (orientation:landscape){.viewer::after{bottom:20px;width:90px;height:130px}}
@media(prefers-reduced-motion:reduce){.viewer::before,.viewer::after{transition:none}}

/* Keep the fit caveat quiet and clear of the floating customer controls. */
.wearing-disclaimer{position:absolute;z-index:2;top:58px;left:14px;right:14px;margin:0;text-align:center;font-size:10px;line-height:1.5;color:var(--muted);opacity:.8;pointer-events:none}
.customer-view .wearing-disclaimer{top:calc(82px + env(safe-area-inset-top))}
.viewer-focused .wearing-disclaimer,.customer-unavailable .wearing-disclaimer,.waist-pulling .wearing-disclaimer{display:none}
.dimension-strip>div[hidden]{display:none}
.dimension-strip>div:has(#hip){border-right:0}
@media(max-width:800px){.customer-view .wearing-disclaimer{top:calc(136px + env(safe-area-inset-top))}.customer-view .customer-fit-notice{top:calc(163px + env(safe-area-inset-top))}}
@media(max-height:500px) and (orientation:landscape){.customer-view .wearing-disclaimer{top:66px}.customer-view .customer-fit-notice{top:92px}}

/* The measurement method travels with the baby's saved dimensions. */
.measurement-label{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.measurement-label select{font:inherit;font-size:10px;color:var(--muted);background:transparent;border:1px solid var(--line);border-radius:5px;padding:4px;min-height:30px;max-width:100px;touch-action:manipulation}
.customer-view #sex-picker{display:flex;margin:0 0 12px;gap:5px}
.customer-view #sex-picker button{min-height:36px;font-size:12px;flex:1}
.presets{flex-wrap:wrap}
/* A focused/dragged overlay must not scroll the fixed 3D canvas or its labels. */
@supports (overflow:clip){.customer-view .viewer{overflow:clip}}
