:root{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;color:#292e2c;background:#eeebe5;--ink:#292e2c;--muted:#797d75;--accent:#ba633f;--line:#dedfd7;--paper:#f8f8f3}*{box-sizing:border-box}body{margin:0}button,select,input{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:4px}button{color:inherit}a{color:inherit;text-decoration:none}.header{height:90px;display:flex;align-items:center;padding:0 32px;gap:36px;border-bottom:1px solid #d7d9d0;background:#f6f6ef}.brand{display:flex;align-items:center;gap:13px}.brandmark{font-size:39px;line-height:1;letter-spacing:-7px;font-weight:700;background:var(--ink);color:#f0f2e8;width:46px;height:46px;border-radius:13px;padding:2px 10px 8px 8px}.brandmark span{color:#eaa174}.brand strong{font-size:16px;letter-spacing:1.7px}.brand small{display:block;color:var(--muted);font-size:12px;letter-spacing:2px;margin-top:5px}.local{font-size:13px;color:#777e73;display:flex;align-items:center;gap:7px}.local i,footer i{width:6px;height:6px;border-radius:50%;background:#91a079;display:inline-block}.header-actions{margin-left:auto;display:flex;gap:10px}.button{border:1px solid #d3d7ce;border-radius:7px;background:transparent;padding:11px 16px;font-size:14px;transition:.15s}.button:hover{background:#e4e7de}.button.primary{background:var(--ink);color:#f6f6ef;border-color:var(--ink)}.button.primary:hover{background:#424940}.button.active{background:#e7d5c7;border-color:#bd8567}.workspace{display:grid;grid-template-columns:214px minmax(350px,1fr) 278px;min-height:720px;height:calc(100dvh - 126px)}.panel{background:var(--paper);padding:28px 21px;overflow-y:auto}.versions{border-right:1px solid var(--line)}.materials{border-left:1px solid var(--line);padding-bottom:20px}.section-title>span,.eyebrow{font-size:10px;letter-spacing:1.7px;font-weight:650;color:#8a8e80}.section-title h2{font-size:19px;font-weight:600;margin:7px 0 23px}.version-list{display:flex;flex-direction:column;gap:10px}.version{position:relative;text-align:left;background:transparent;border:1px solid transparent;border-radius:9px;padding:13px 12px;transition:.15s;min-height:116px}.version:hover{background:#f0f0e9}.version.selected{background:#ebeee3;border-color:#c4cab7}.version-num{position:absolute;right:12px;top:12px;font-size:10px;color:#7f8577}.version-icon{height:28px;width:55px;background:linear-gradient(145deg,#81877b,#444d42);border:1px solid #4e574a;box-shadow:3px 4px 0 #c5cbbb;transform:skewY(-8deg);margin:3px 0 12px;border-radius:3px}.version[data-version="aligned"] .version-icon{width:66px}.version[data-version="soft"] .version-icon{border-radius:10px;width:66px}.version[data-version="facet"] .version-icon{clip-path:polygon(10% 0,90% 0,100% 20%,100% 80%,90% 100%,10% 100%,0 80%,0 20%);width:66px;background:linear-gradient(145deg,#909782,#3e463a)}.version strong{font-size:14px;font-weight:600;display:block}.version small{display:block;color:#747c6a;font-size:11px;margin-top:5px}.version-foot{display:flex;gap:8px;align-items:flex-start;margin-top:30px}.version-foot p{font-size:11px;line-height:1.8;color:#93988a;margin:0}.mini-dot{width:5px;height:5px;flex-shrink:0;background:#a4af96;border-radius:50%;margin-top:7px}.text-button{padding:0;border:0;background:none;color:#7b826e;font-size:12px;margin-top:22px}.studio{position:relative;display:flex;flex-direction:column;min-height:0;overflow:hidden;background:radial-gradient(ellipse at 50% 42%,#f6f2e9 0,#eae6dc 70%,#e4e1d7 100%)}.stage-heading{position:absolute;z-index:2;left:34px;right:26px;top:30px;display:flex;justify-content:space-between;pointer-events:none}.stage-heading button{pointer-events:auto}.stage-heading h1{margin:8px 0 7px;font-size:30px;font-weight:500;letter-spacing:-1px}.stage-heading p{font-size:12px;margin:0;color:#888b7e}.icon-button{border:1px solid #cfd3c7;background:#f7f6efaa;width:34px;height:34px;border-radius:50%;font-size:20px}.icon-button:hover{background:#fff}#canvas-wrap{position:relative;flex:1;min-height:380px}#viewport{width:100%;height:100%;display:block;touch-action:none;outline:none}#loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:10px;background:#eeece4;color:#757d6a;font-size:14px;z-index:3}#loading[hidden]{display:none}.spinner{border:2px solid #c6ccbd;border-top-color:#b57950;border-radius:50%;width:18px;height:18px;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}#error{position:absolute;left:10%;right:10%;top:40%;padding:24px;background:#fff6f0;border:1px solid #d2a28a;line-height:1.7;border-radius:8px}.stage-bottom{display:flex;justify-content:space-between;align-items:center;padding:0 26px 22px;gap:12px}.view-controls{display:flex;padding:4px;border:1px solid #cdd1c4;border-radius:8px;gap:2px;background:#f8f8efb3;flex-shrink:0}.view-controls button{background:none;border:none;font-size:12px;padding:7px 13px;border-radius:5px;color:#8b907e}.view-controls button:hover{color:#384432}.view-controls button.selected,.view-controls button[aria-pressed="true"]{background:#363f34;color:#f0f0e9}.gestures{font-size:10px;color:#929684}.metrics{margin:0 26px;border-top:1px solid #ced2c2;display:flex;gap:30px;align-items:center;padding:21px 0 24px;flex-wrap:wrap}.metrics div span{font-size:10px;color:#8d917f;letter-spacing:1px;display:block;margin-bottom:7px}.metrics strong{font-size:13px;font-weight:500}.metrics p{font-size:10px;color:#979a8c;margin:0 0 0 auto;max-width:190px;line-height:1.8}.control-block{padding-bottom:23px;margin-bottom:20px;border-bottom:1px solid #e3e5db}.control-label,.sliders label,.assembly>label:not(.switch-row){font-size:12px;display:flex;justify-content:space-between;align-items:center;margin:0 0 13px}.control-label output,label output{font-size:11px;color:#929786;font-weight:400}.swatches{display:flex;gap:12px}.swatch{height:33px;width:33px;border-radius:50%;border:3px solid #f8f8f3;outline:1px solid #d4d7cc;background:var(--swatch);box-shadow:inset 1px 1px 4px #ffffff40}.swatch.selected{outline:2px solid #b97854}.texture-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.texture{padding:0 0 8px;background:#eeefe8;border:1px solid #e0e3d7;border-radius:6px;font-size:11px;overflow:hidden}.texture.selected{border-color:#738363;background:#e6ebde}.texture-sample{height:43px;margin:0 0 7px;background-color:#4f564b;position:relative}.texture-sample.smooth{background:linear-gradient(135deg,#565d52,#3d453b)}.texture-sample.dots{background-image:radial-gradient(circle,#293225 1px,#606951 1.5px,transparent 2.2px);background-size:9px 9px}.texture-sample.diagonal{background:repeating-linear-gradient(135deg,#50584b 0,#646d5a 3px,#323d2f 4px,#50584b 7px)}.texture-sample.weave{background-image:repeating-linear-gradient(45deg,transparent 0,transparent 2px,#262d2470 3px,transparent 4px),repeating-linear-gradient(-45deg,transparent 0,transparent 2px,#81917570 3px,transparent 4px)}.hint{font-size:10px;color:#979d8b;line-height:1.8;margin:10px 0 0}.sliders{padding-bottom:18px}.sliders label{margin-top:16px;margin-bottom:6px}.sliders label:first-child{margin-top:0}input[type="range"]{width:100%;height:3px;accent-color:#737f64;cursor:pointer;display:block;margin:12px 0 17px}input:disabled{opacity:.35;cursor:default}.range-ends{display:flex;justify-content:space-between;color:#a1a693;font-size:9px;margin-top:-8px}select{width:100%;padding:10px 9px;border:1px solid #d7dccd;border-radius:5px;color:#535d47;background:#f5f6ef;font-size:12px}.switch-row{display:flex;position:relative;align-items:center;font-size:11px;gap:10px;margin:0 0 18px}.switch-row input{position:absolute;right:0;width:30px;height:18px;opacity:0;cursor:pointer;z-index:2}.switch{margin-left:auto;background:#d6dccc;width:29px;height:16px;border-radius:10px;position:relative;pointer-events:none}.switch:after{content:"";width:12px;height:12px;position:absolute;left:2px;top:2px;background:white;border-radius:50%;transition:.18s}.switch-row input:checked+.switch{background:#748567}.switch-row input:checked+.switch:after{left:15px}.switch-row input:focus-visible+.switch{outline:2px solid #ba633f;outline-offset:3px}.assembly{margin-bottom:16px;padding-bottom:3px}.restore{font-size:11px;width:100%;padding:10px;color:#848d77}footer{height:36px;display:flex;align-items:center;padding:0 25px;font-size:10px;color:#8d9481;background:#f6f6ef;border-top:1px solid #dbdfd1;gap:30px}footer>span:first-child{color:#79876a}footer a{margin-left:auto}#compare-labels{position:absolute;left:0;right:0;top:150px;display:flex;pointer-events:none;font-size:12px}#compare-labels[hidden]{display:none}#compare-labels>div{width:50%;text-align:center}#compare-labels b{background:#65745a;color:white;padding:3px 6px;border-radius:4px;margin-right:7px}#compare-labels small{display:block;color:#969e87;margin:7px}#pin{display:block;border:0;background:none;pointer-events:auto;color:#9a7f63;font-size:10px;margin:8px auto}dialog{border:0;border-radius:16px;width:min(970px,92vw);max-height:86vh;padding:30px;background:#f4f4ec;color:var(--ink);box-shadow:0 20px 100px #0003}dialog::backdrop{background:#1d2719aa;backdrop-filter:blur(5px)}.dialog-head{display:flex;justify-content:space-between;margin-bottom:25px}.dialog-head h2{font-size:25px;font-weight:500;margin:8px 0}.dialog-head p{color:#869075;font-size:13px}.dialog-head .icon-button{flex-shrink:0}#reference-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}#reference-grid figure{margin:0;background:white;border-radius:8px;overflow:hidden}#reference-grid img{display:block;object-fit:contain;width:100%;height:200px;padding:15px}#reference-grid figcaption{padding:12px 15px;font-size:12px;color:#6f7b5d;border-top:1px solid #ecefe3}#toast{position:fixed;bottom:55px;left:50%;transform:translateX(-50%) translateY(10px);background:#34432a;color:white;padding:13px 20px;font-size:13px;border-radius:7px;opacity:0;pointer-events:none;transition:.2s;z-index:10}#toast.visible{opacity:1;transform:translateX(-50%)}
@media(min-width:1600px){.workspace{grid-template-columns:250px minmax(350px,1fr) 310px}.panel{padding:32px 27px}.version{min-height:129px}.stage-heading{top:38px;left:42px}.stage-heading h1{font-size:35px}.control-label,.sliders label,.switch-row,select{font-size:14px}.hint{font-size:12px}.texture{font-size:13px}.texture-sample{height:52px}}
@media(max-width:1100px){.workspace{grid-template-columns:165px minmax(320px,1fr) 245px}.panel{padding:25px 15px}.header{padding:0 20px}.local{display:none}.stage-heading{left:24px}.stage-heading h1{font-size:25px}.gestures{display:none}.metrics{gap:16px}.metrics p{max-width:none;margin-left:0}.view-controls button{padding:6px 10px}}
@media(max-width:760px){.header{height:74px;padding:0 15px;gap:8px}.brand{gap:8px}.brandmark{width:36px;height:38px;font-size:32px;border-radius:10px;padding-left:6px}.brand strong{font-size:12px}.brand small{font-size:9px;letter-spacing:1px}.header-actions{gap:6px}.header-actions .button{padding:8px;font-size:11px}.workspace{display:flex;flex-direction:column;height:auto;min-height:0}.versions{padding:17px 15px;border-right:0;border-bottom:1px solid var(--line)}.versions .section-title,.version-foot,.versions .text-button{display:none}.version-list{flex-direction:row;gap:7px}.version{min-height:66px;width:25%;padding:9px 7px}.version-icon{display:none}.version-num{position:static;display:block;font-size:8px;margin-bottom:6px}.version strong{font-size:11px}.version small{font-size:8px}.studio{height:610px;flex:none}.stage-heading{top:23px;left:22px}.stage-heading h1{font-size:25px}#canvas-wrap{min-height:330px}.stage-bottom{padding:0 17px 15px;justify-content:center}.metrics{padding:16px 0;margin:0 20px;gap:17px}.metrics p{width:100%;font-size:9px}.metrics strong{font-size:12px}.materials{padding:25px 20px;display:grid;grid-template-columns:1fr 1fr;gap:0 24px}.materials .section-title{grid-column:1/-1}.control-block{margin-bottom:18px;padding-bottom:18px}.sliders{grid-column:2;grid-row:2/4}.assembly{grid-column:1/-1}.restore{grid-column:1/-1}.texture-sample{height:48px}footer{height:auto;min-height:55px;padding:12px 20px;gap:10px;flex-wrap:wrap;font-size:9px}footer a{margin-left:0}#compare-labels{top:128px;font-size:10px}#compare-labels small,#pin{font-size:9px}#reference-grid{grid-template-columns:1fr 1fr}#reference-grid img{height:150px}.dialog-head p{font-size:11px}dialog{padding:20px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* Readable controls; keep the working canvas within laptop-height viewports. */
.workspace{min-height:540px}.version-num{position:static;display:block;margin-bottom:9px}.version{min-height:128px}.version-icon{margin-bottom:10px}.version strong,.texture,.control-label,.sliders label,.assembly>label:not(.switch-row),.switch-row,select,.restore{font-size:14px}.version small,.control-label output,label output,.hint,.text-button{font-size:12px}.stage-heading p{font-size:14px}.view-controls button{font-size:13px}.metrics strong{font-size:14px}.metrics div span,.metrics p,.version-foot p,.gestures,footer{font-size:11px}.texture-sample{height:47px}.control-block{padding-bottom:18px;margin-bottom:18px}.panel{scrollbar-width:thin;scrollbar-color:#c9cfc0 transparent}#canvas-wrap{min-height:320px}
@media(max-width:1100px){.version strong{font-size:13px}.version small{font-size:11px}.metrics p{font-size:10px}.control-label,.sliders label,.assembly>label:not(.switch-row),.switch-row,select{font-size:13px}}
@media(max-width:760px){.workspace{min-height:0}.version{min-height:75px}.version strong{font-size:12px}.version small{font-size:9px}.version-num{font-size:9px;margin-bottom:7px}.stage-heading p{font-size:12px}.metrics strong{font-size:12px}.control-label,.sliders label,.assembly>label:not(.switch-row),.switch-row,select,.texture{font-size:14px}.version-icon{display:none}.materials{gap:0 20px}footer{font-size:10px}}

@media(min-width:761px) and (max-height:820px){.versions{padding-top:23px}.versions .section-title h2{margin-bottom:15px}.version{min-height:105px;padding-top:9px;padding-bottom:9px}.version-icon{height:21px;width:49px;margin-bottom:7px}.version-num{margin-bottom:6px}.version-foot{margin-top:20px}}
#compare-labels{top:auto;bottom:27px;background:linear-gradient(transparent,#ebe8deaa);padding-top:8px}#compare-labels>div{line-height:1.4}#compare-labels small,#pin{margin-top:6px}

.mode-nav{position:absolute;z-index:3;left:30px;right:30px;top:118px;display:flex;gap:5px;pointer-events:auto}.mode-nav button{border:1px solid #c9cfc0;background:#f6f5edc9;border-radius:6px;padding:7px 12px;font-size:12px;color:#7b866b}.mode-nav button.selected{background:#536448;border-color:#536448;color:white}.stage-heading h1{font-size:27px;margin-top:6px}.stage-heading p{font-size:12px}.inspection-panel{padding:0 0 22px;margin-bottom:24px;border-bottom:1px solid #d7ddcc}.inspection-panel .section-title h2{margin-bottom:12px}.inspection-panel .hint{margin:0 0 18px}.inspection-panel .control-label{margin-top:15px}.motion-buttons{display:flex;gap:5px;justify-content:space-between}.motion-buttons button{border:1px solid #ccd4c2;border-radius:5px;padding:8px 9px;background:#eef1e7;font-size:12px;flex:1}.motion-buttons #motion-play{background:#526345;color:white;border-color:#526345;flex:1.5}.motion-steps{display:flex;list-style:none;padding:0;gap:8px;justify-content:space-between;margin:18px 0 14px}.motion-steps li{color:#9ca78e;font-size:12px;border-bottom:2px solid #dce2d2;flex:1;padding-bottom:7px}.motion-steps li.active{color:#ba633f;border-color:#ba633f}#motion-caption{position:absolute;left:30px;right:30px;bottom:156px;text-align:center;pointer-events:none;font-size:12px;color:#7c896c}#motion-stage{font-weight:600;color:#ac673f;padding-right:14px}#motion-detail{display:inline-block}#logo-text{width:100%;padding:10px;border:1px solid #d7dccd;border-radius:5px;background:#f5f6ef;font-size:14px;color:#38432d}.logo-text-label,.logo-size-label{margin-top:17px}.logo-size-label{margin-bottom:4px}.button:disabled{cursor:default;opacity:.4}.view-controls button[hidden],.inspection-panel[hidden],#motion-caption[hidden]{display:none}.studio.inspection .stage-heading{top:22px}.studio.inspection .metrics p{max-width:230px}.studio.inspection .gestures{display:none}
@media(max-width:1100px){.mode-nav{left:22px;right:22px;gap:4px}.mode-nav button{padding:7px 8px;font-size:11px}}
@media(max-width:760px){.mode-nav{top:110px;left:20px;right:15px}.mode-nav button{font-size:11px;padding:8px 11px}.studio{height:650px}.inspection-panel{grid-column:1/-1}.inspection-panel~.section-title{grid-column:1/-1}.materials .sliders{grid-row:auto}.materials .assembly{grid-column:1/-1}#motion-caption{left:20px;right:20px;bottom:181px;font-size:10px}.stage-heading h1{font-size:24px}.stage-heading p{font-size:11px}.mode-nav button{flex:1}.studio.inspection .metrics p{max-width:none}}

.mode-nav{position:static;margin:0 26px 14px;flex-shrink:0;gap:6px}.mode-nav button{font-size:13px;padding:8px 14px}#motion-caption{position:static;margin:0 26px 12px;text-align:left;flex-shrink:0}.stage-bottom{padding-bottom:16px}.mode-nav button{background:#f5f5ec}.studio.inspection #canvas-wrap{min-height:280px}@media(max-width:1100px){.mode-nav button{font-size:12px;padding:8px 10px}}@media(max-width:760px){.mode-nav{margin:0 17px 12px;gap:5px}.mode-nav button{font-size:12px;padding:9px 8px}#motion-caption{margin:0 17px 10px}.studio.inspection #canvas-wrap{min-height:280px}}

/* Additional lid studies keep the accepted outlines available for comparison. */
.version[data-version="soft_edge"] .version-icon,.version[data-version="soft_crown"] .version-icon{border-radius:10px;width:66px}
.version[data-version="soft_edge"] .version-icon{box-shadow:inset 0 3px 4px #bec5b370,3px 4px 0 #c5cbbb}
.version[data-version="soft_crown"] .version-icon{box-shadow:inset 0 5px 7px #d0d5c590,3px 4px 0 #c5cbbb}
#lid-spec{font-size:11px;color:#7d8970;margin-top:8px;line-height:1.6;max-width:470px}
#lid-spec[hidden]{display:none}
@media(max-width:760px){.version-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.version{width:auto}#lid-spec{font-size:10px;max-width:85%;margin-top:5px}}

/* Only the two confirmed finishes are offered; all shell parts share them. */
.finish-options{display:grid;grid-template-columns:1fr 1fr;gap:10px}.finish-options .swatch{display:block;width:auto;height:auto;border:1px solid #d6d8d1;outline:none;border-radius:7px;background:#f2f2ec;padding:6px;box-shadow:none;color:#363838}.finish-options .swatch.selected{border-color:#936c54;box-shadow:0 0 0 1px #936c54;background:#ede7df}.finish-options strong{display:block;font-size:12px;font-weight:500;margin:8px 0 3px}.finish-sample{display:block;height:48px;border-radius:4px;background:linear-gradient(145deg,#ffffff18,#00000018),var(--swatch)}.swatch[data-color="printed"] .finish-sample{background-image:radial-gradient(circle at 30% 25%,#ffffff30 .6px,transparent 1px),radial-gradient(circle at 65% 75%,#00000030 .5px,transparent 1px),linear-gradient(145deg,#ffffff15,#00000015);background-size:3px 4px,5px 3px,100% 100%}.photo-reference{display:inline-block;font-size:11px;color:#776b60;margin-top:10px;text-decoration:underline;text-underline-offset:3px}.studio{background:radial-gradient(ellipse at 50% 42%,#f0f0ee 0,#e6e6e3 70%,#ddddda 100%)}