@scope (.appearance-configurator){:scope{--ink:#161817;--muted:#6e726f;--line:#dfe2df;--orange:#ef7622;--green:#3e8b50}*{box-sizing:border-box}:scope{margin:0;background:#f4f5f2;color:var(--ink);font-family:Microsoft YaHei,PingFang SC,Arial,sans-serif;letter-spacing:0}button{font:inherit}.app-shell{min-height:100vh}.topbar{height:66px;padding:0 32px;justify-content:space-between;border-bottom:1px solid var(--line);background:#fff}.brand-lockup,.topbar{display:flex;align-items:center}.brand-lockup{gap:15px;font-size:14px;font-weight:700}.brand-lockup img{width:116px;height:36px;object-fit:contain;mix-blend-mode:multiply}.brand-lockup span{border-left:1px solid var(--line);padding-left:15px}.status{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:12px}.status i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 3px #e4f1e7}.workspace{min-height:calc(100vh - 66px);display:grid;grid-template-columns:minmax(0,1fr) 390px}.preview-pane{min-width:0;padding:30px 42px 36px;display:flex;flex-direction:column}.preview-heading{display:flex;align-items:end;justify-content:space-between;gap:24px}.preview-heading p{margin:0 0 5px;color:var(--orange);font-size:11px;font-weight:800}.preview-heading h1{margin:0;font-size:22px;line-height:1.2}.preview-heading>span{max-width:50%;color:var(--muted);font-size:12px;text-align:right}.stage{flex:1;min-height:600px;display:grid;place-items:center;overflow:hidden}.machine{--shell:#f2f2ef;position:relative;width:min(58vh,450px);aspect-ratio:.8;border:1px solid color-mix(in srgb,var(--shell),#000 15%);border-radius:10px 10px 7px 7px;background:var(--shell);box-shadow:0 28px 45px #20242020,inset 13px 0 25px #ffffff33,inset -10px 0 18px #00000010;transition:.25s}.housing-highlight{position:absolute;inset:0;border-radius:inherit;background:linear-gradient(90deg,#fff3,transparent 18%,transparent 82%,#0001);pointer-events:none}.side-grip{position:absolute;z-index:-1;top:7%;width:4.5%;height:31%;background:#2d302f}.side-grip.left{left:-2.5%;clip-path:polygon(35% 4%,100% 0,100% 100%,35% 96%,0 89%,0 11%)}.side-grip.right{right:-2.5%;clip-path:polygon(0 0,65% 4%,100% 11%,100% 89%,65% 96%,0 100%)}.lower-seam{top:79%;height:1px;background:#0003;box-shadow:0 1px #fff5}.lower-panel,.lower-seam{position:absolute;left:0;right:0}.lower-panel{bottom:0;height:21%;border-radius:0 0 7px 7px;box-shadow:inset 0 12px 18px #ffffff13}.control-panel{position:absolute;z-index:2;left:-2.6%;right:-2.6%;top:22%;background:#111413;color:#f5f5f2;box-shadow:0 4px 8px #0004,inset 0 0 0 2px var(--orange);transition:.25s}.panel-chamfer{clip-path:polygon(8% 0,92% 0,100% 24%,100% 76%,92% 100%,8% 100%,0 76%,0 24%)}.panel-hex{clip-path:polygon(10% 0,90% 0,100% 50%,90% 100%,10% 100%,0 50%)}.panel-flat{border-radius:8px}.indicators{position:absolute;top:7%;left:29%;right:29%;display:flex;justify-content:space-between}.indicators span{display:flex;flex-direction:column;align-items:center;gap:2px;font-size:6px;color:#bfc4c1}.indicators i{width:4px;height:4px;border:1px solid #aeb3b0;border-radius:50%}.screen{position:absolute;left:31%;right:31%;top:25%;height:45%;border:2px solid #8b908e;background:#242927;box-shadow:inset 0 0 18px #000;display:flex;align-items:center;justify-content:center;color:#9fd17b}.screen span{position:absolute;left:7px;top:5px;font-size:5px;color:#737c77}.screen b{font:500 22px/1 Arial}.screen small{margin:7px 0 0 3px;font-size:7px}.panel-buttons{position:absolute;left:32%;right:32%;bottom:5%;display:flex;justify-content:space-between}.panel-buttons span{display:flex;flex-direction:column;align-items:center;gap:2px}.panel-buttons button{width:22px;height:22px;padding:0;border:1px solid #aeb3b0;border-radius:50%;background:#1d201f;color:#f4f4f2;font-size:9px;cursor:pointer}.panel-buttons small{color:#d7dad8}.product-logo{position:absolute;z-index:3;width:25%;height:auto;object-fit:contain;mix-blend-mode:multiply;transition:.25s}.logo-top{left:50%;top:6.5%;transform:translateX(-50%)}.logo-left{left:4%;top:24%;width:16%;filter:brightness(0) invert(1);mix-blend-mode:screen}.logo-below{left:50%;top:59%;transform:translateX(-50%)}.logo-lower{right:5%;bottom:9%;width:21%}.controls{background:#fff;border-left:1px solid var(--line);padding:28px 24px 36px;overflow-y:auto}.control-section{padding:0 0 25px;margin:0 0 25px;border-bottom:1px solid var(--line)}.control-section:last-child{border-bottom:0}.section-title{display:flex;align-items:flex-start;gap:12px;margin-bottom:15px}.section-title>span{color:var(--orange);font:700 10px/25px Arial;width:25px;height:25px;border:1px solid #f0c2a0;text-align:center}.section-title h2{margin:0;font-size:14px}.section-title p{margin:3px 0 0;color:var(--muted);font-size:11px}.swatch-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.swatch-grid button{min-width:0;padding:8px 4px 7px;border:1px solid transparent;background:transparent;color:#555a57;font-size:9px;cursor:pointer}.swatch-grid button i{display:block;width:28px;height:28px;margin:0 auto 6px;border:1px solid #0002;box-shadow:inset 0 0 0 2px #fff6}.position-grid button.active,.swatch-grid button.active{border-color:var(--orange);color:var(--ink);background:#fff8f3}.option-list{display:grid;gap:7px}.option-list button{height:42px;display:grid;grid-template-columns:44px 1fr 18px;align-items:center;gap:10px;border:1px solid var(--line);background:#fff;color:#4f5451;text-align:left;font-size:11px;cursor:pointer}.option-list button b{opacity:0;color:var(--orange)}.option-list button.active{border-color:var(--orange);background:#fff8f3;color:var(--ink)}.option-list button.active b{opacity:1}.shape{display:block;width:30px;height:15px;margin-left:9px;background:#242725}.shape-soft{border-radius:10px}.shape-chamfer{clip-path:polygon(14% 0,86% 0,100% 50%,86% 100%,14% 100%,0 50%)}.shape-hex{clip-path:polygon(20% 0,80% 0,100% 50%,80% 100%,20% 100%,0 50%)}.shape-flat{border-radius:2px}.position-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.position-grid button{padding:8px;border:1px solid var(--line);background:#fff;color:#555a57;font-size:10px;cursor:pointer}.position-grid button>i{position:relative;display:block;width:42px;height:36px;margin:0 auto 5px;border:1px solid #aeb2af;background:#f5f5f2}.position-grid button>i:before{content:"";position:absolute;left:5px;right:5px;top:12px;height:10px;background:#262927;border-radius:5px}.marker{position:absolute;width:8px;height:3px;background:var(--orange);z-index:2}.marker-top{top:4px;left:16px}.marker-left{top:15px;left:2px}.marker-below{top:26px;left:16px}.marker-lower{right:3px;bottom:3px}@media(max-width:900px){.workspace{grid-template-columns:1fr}.preview-pane{padding:24px 20px 20px}.stage{min-height:560px}.controls{border-left:0;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.control-section{margin:0;border-bottom:0}}@media(max-width:620px){.topbar{height:58px;padding:0 16px}.brand-lockup img{width:95px}.brand-lockup span{display:none}.preview-heading{align-items:flex-start;flex-direction:column;gap:8px}.preview-heading>span{max-width:100%;text-align:left}.stage{min-height:500px}.machine{width:min(86vw,380px)}.controls{grid-template-columns:1fr;padding:24px 18px}.control-section{padding-bottom:22px;border-bottom:1px solid var(--line)}}.brand-lockup img{mix-blend-mode:normal}.control-panel{background:#16181a;border:3px solid #303332;box-shadow:0 4px 8px #0004,inset 0 0 0 2px #f58220}.control-content,.control-panel{left:3%;right:3%;top:15%;height:32%}.control-content{position:absolute;z-index:4;pointer-events:none}.control-content button{pointer-events:auto}.panel-full{border-radius:0}.panel-soft{left:10%;right:10%}.panel-vertical{height:79%;border-radius:10px}.panel-circleLarge{border-radius:50%}.panel-wideOctagon{left:11%;right:11%;clip-path:polygon(9% 0,91% 0,100% 20%,100% 80%,91% 100%,9% 100%,0 80%,0 20%)}.panel-arch{left:10%;right:10%;border-radius:76px 76px 18px 18px}.panel-chamfer{left:15%;right:15%;clip-path:polygon(18% 0,82% 0,100% 28%,100% 72%,82% 100%,18% 100%,0 72%,0 28%)}.panel-circle{left:23%;right:23%;top:9.5%;height:43.2%;border-radius:50%}.panel-compact{border-radius:30px}.panel-trapezoid{left:14.5%;right:14.5%;clip-path:polygon(0 0,100% 0,92% 100%,8% 100%)}.panel-hex{left:9.5%;right:9.5%;clip-path:polygon(22% 0,78% 0,100% 50%,78% 100%,22% 100%,0 50%)}.panel-chamfer,.panel-hex,.panel-trapezoid,.panel-wideOctagon{background:#f58220;border-color:#303332;box-shadow:0 4px 8px #0004}.panel-chamfer:before,.panel-hex:before,.panel-trapezoid:before,.panel-wideOctagon:before{content:"";position:absolute;inset:4px;background:#16181a;clip-path:inherit}.vector-panel{background:transparent;border:0;box-shadow:none;clip-path:none;overflow:visible}.vector-panel:before{display:none}.vector-panel svg{display:block;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 4px 4px #0004)}.panel-vector-rim{fill:#16181a;stroke:#303332;stroke-width:18;vector-effect:non-scaling-stroke}.panel-vector-line{fill:none;stroke:#f58220;stroke-width:4;vector-effect:non-scaling-stroke}.product-logo{z-index:10;width:27%;mix-blend-mode:normal;filter:none;outline:1px dashed #f58220aa;outline-offset:8px}.logo-corner{left:5%;top:7%;width:22%}.logo-none{display:none}.shape-full{width:38px;margin-left:4px;border-radius:0}.shape-vertical{width:13px;height:26px;margin-left:18px;border-radius:2px}.shape-circle,.shape-circleLarge{width:18px;height:18px;margin-left:15px;border-radius:50%}.shape-wideOctagon{clip-path:polygon(12% 0,88% 0,100% 25%,100% 75%,88% 100%,12% 100%,0 75%,0 25%)}.shape-arch{border-radius:10px 10px 3px 3px}.shape-chamfer{clip-path:polygon(18% 0,82% 0,100% 30%,100% 70%,82% 100%,18% 100%,0 70%,0 30%)}.shape-compact{width:25px;margin-left:12px;border-radius:5px}.shape-trapezoid{clip-path:polygon(8% 0,92% 0,82% 100%,18% 100%);border-radius:4px}.shape-hex{clip-path:polygon(15% 0,85% 0,100% 50%,85% 100%,15% 100%,0 50%)}.marker-corner{top:4px;left:3px}.marker-none{display:none}.machine{aspect-ratio:781/1020;container-type:inline-size}.side-grip{top:5.9%;height:36.8%}.lower-seam{top:83.4%}.lower-panel{height:16.6%}.control-panel{left:11.6%;right:11.6%;top:14.5%;height:31.3%}.panel-soft{left:11.6%;right:11.6%;border-radius:76px}.control-content{left:0;right:0;top:0;height:100%}.indicators{top:16.1%;left:37.5%;right:37.5%}.indicators span{gap:0;line-height:1}.indicators span b{height:6px;color:#f4f5f2;font:700 6px/6px Arial,sans-serif}.indicators span small{color:#d7dad8;font:500 5px/6px Arial,sans-serif}.indicators span i{width:4px;height:4px;margin-top:1px;border:1px solid #c9cecb;border-radius:50%;background:#171a19}.screen{left:32%;right:32%;top:21%;height:16.4%}.panel-buttons{left:35.9%;right:35.9%;top:39.5%;bottom:auto}.panel-buttons button{width:4cqw;height:4cqw;font-size:8px}.panel-buttons small{font-size:5px}.panel-full{left:0;right:0}.panel-vertical{left:25%;right:25%;top:0;height:83.4%}.panel-circleLarge{left:20%;right:20%;top:7%;height:48%}.panel-arch{left:11.6%;right:11.6%}.panel-compact{left:12%;right:12%}.panel-custom{overflow:hidden;border:0;background:transparent;box-shadow:none;cursor:grab;touch-action:none;user-select:none}.panel-custom:active{cursor:grabbing}.panel-custom>img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}.pvc-upload{position:relative;display:grid;place-items:center;min-height:42px;margin-top:9px;border:1px dashed #b9bdb9;background:#fafbf9;color:#474c49;font-size:10px;font-weight:700;cursor:pointer}.pvc-upload.active{border-color:var(--orange);background:#fff8f3;color:var(--ink)}.pvc-upload input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.pvc-tools{display:grid;gap:9px;margin-top:10px;padding:10px;border:1px solid var(--line);background:#fafbf9}.pvc-tools>p{margin:0 0 2px;color:var(--orange);font-size:9px;font-weight:700}.pvc-tools>label{display:grid;grid-template-columns:55px 1fr 30px;align-items:center;gap:8px;color:var(--muted);font-size:9px}.pvc-tools input{width:100%;accent-color:var(--orange)}.pvc-tools b{color:var(--ink);font:700 8px Arial;text-align:right}.pvc-tools>div{display:grid;grid-template-columns:1fr 1fr;gap:7px}.pvc-tools button{min-height:32px;border:1px solid var(--line);background:#fff;color:#4d524f;font-size:9px;cursor:pointer}.pvc-remove{width:100%;height:32px;margin-top:0;border-color:#e0b4a7!important;background:#fff8f5!important;color:#a34a31!important}.custom-swatch{position:relative;min-width:0;padding:8px 4px 7px;border:1px solid transparent;background:transparent;color:#555a57;font-size:9px;text-align:center;cursor:pointer;overflow:hidden}.custom-swatch input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.custom-swatch i{display:block;width:28px;height:28px;margin:0 auto 6px;border:1px solid #0002;box-shadow:inset 0 0 0 2px #fff6}.custom-swatch.active{border-color:var(--orange);color:var(--ink);background:#fff8f3}.swatch-grid small{display:block;margin-top:3px;color:#858a87;font:8px/1.2 Arial,sans-serif}.preview-heading>span b{color:var(--ink);font:700 10px/1 Arial,sans-serif}.selection-summary{display:grid;grid-template-columns:1fr 1fr;gap:1px;margin-bottom:14px;background:var(--line);border:1px solid var(--line)}.selection-summary span{min-width:0;padding:8px;background:#f8f9f7;color:#5b605d;font-size:9px;overflow-wrap:anywhere}.selection-summary b{color:var(--ink);font:700 8px Arial}.submit-section form{display:grid;gap:10px}.submit-section form label{display:grid;gap:5px;color:#555a57;font-size:10px}.submit-section form input{width:100%;height:36px;padding:0 10px;border:1px solid var(--line);background:#fff;color:var(--ink);font-size:11px;outline:none}.submit-section form input:focus{border-color:var(--orange);box-shadow:0 0 0 2px #ef762218}.submit-section form>button{height:40px;border:0;background:var(--ink);color:#fff;font-size:11px;font-weight:700;cursor:pointer}.submit-section form>button:hover{background:var(--orange)}.submit-success{display:grid;gap:4px;margin-top:12px;padding:10px;border-left:3px solid var(--green);background:#eef7f0;color:#386443;font-size:10px}.submit-success strong{font-size:11px}.top-actions{display:flex;align-items:center;gap:18px}.language-switch{display:flex;padding:2px;border:1px solid var(--line);background:#f6f7f5}.language-switch button{width:46px;height:28px;border:0;background:transparent;color:var(--muted);font-size:11px;font-weight:700;cursor:pointer}.language-switch button.active{background:#fff;color:var(--ink);box-shadow:0 1px 4px #0002}.records-link{color:#555a57;font-size:11px;font-weight:700;text-decoration:none}.records-link:hover{color:var(--orange)}.submit-success a{color:#386443;font-weight:700}@media (max-width:620px){.top-actions{gap:0}.records-link,.top-actions .status{display:none}.language-switch button{width:42px;height:26px}}.custom-logo{height:auto;object-fit:contain}.logo-upload{position:relative;display:grid;place-items:center;min-height:40px;margin-top:9px;border:1px dashed #b9bdb9;background:#fafbf9;color:#474c49;font-size:10px;font-weight:700;cursor:pointer}.logo-upload.active{border-color:var(--orange);background:#fff8f3}.logo-upload input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.logo-tools{display:grid;gap:9px;margin-top:9px;padding:10px;border:1px solid var(--line);background:#fafbf9}.logo-tools label{display:grid;grid-template-columns:60px 1fr 30px;align-items:center;gap:8px;color:var(--muted);font-size:9px}.logo-tools input{width:100%;accent-color:var(--orange)}.logo-tools b{font:700 8px Arial;text-align:right}.logo-tools button{height:32px;border:1px solid #e0b4a7;background:#fff8f5;color:#a34a31;font-size:9px;cursor:pointer}.custom-logo{cursor:grab;touch-action:none;user-select:none}.custom-logo:active{cursor:grabbing}.logo-tools>p{margin:0;color:var(--orange);font-size:9px;font-weight:700}}.appearance-configurator{color:#161817;background:#f4f5f2;font-family:Arial,sans-serif}@scope (.appearance-configurator){.app-shell,.workspace{min-height:0}.preview-pane{position:sticky;top:0;align-self:start}.stage{min-height:540px}.machine{max-width:90%}.apply-design{width:100%;padding:14px;background:#ef7622;color:#161817;border:0;font-weight:700;cursor:pointer}button:focus-visible,input:focus-visible{outline:2px solid #13723a;outline-offset:3px}@media(max-width:900px){.preview-pane{position:relative}.controls{display:block}.control-section{margin-bottom:24px}}}@scope (.appearance-configurator){:scope{--ink:#f5f7f8;--muted:#9ca5ad;--line:#2c343c;--orange:#f47800;color:var(--ink);background:#07090b;font-family:Arial,var(--font-geist-sans),sans-serif}.topbar{background:#101419;padding-inline:32px;border-color:var(--line)}.brand-lockup img{display:none}.brand-lockup span{display:block;border:0;padding:0;color:var(--ink);font-size:15px;font-weight:500}.status{color:var(--muted);font-family:var(--font-geist-mono),monospace;font-size:10px}.status i{background:var(--orange);box-shadow:none}.language-switch{background:transparent;padding:0}.language-switch button{height:34px;color:var(--muted)}.language-switch button.active{color:var(--orange);background:#1b2229;box-shadow:none}.preview-pane,.workspace{background:#07090b}.preview-pane{padding:32px 42px 40px}.preview-heading{align-items:start}.preview-heading p{font:10px/1.5 var(--font-geist-mono),monospace;letter-spacing:.1em;text-transform:uppercase;margin-bottom:12px}.preview-heading h1{color:var(--ink);font-size:clamp(28px,3vw,42px);letter-spacing:-.04em;line-height:1.1}.preview-heading>span{line-height:1.7}.stage{margin-top:24px;padding-block:24px}.machine{box-shadow:0 24px 52px #0008,inset 13px 0 25px #ffffff33,inset -10px 0 18px #00000010}.controls{background:#101419}.section-title>span{border-color:var(--line);font-family:var(--font-geist-mono),monospace}.section-title h2{color:var(--ink);font-size:16px;font-weight:600;letter-spacing:-.02em}.section-title p{color:var(--muted);font-size:12px;line-height:1.5}.custom-swatch,.swatch-grid button{color:#bac3cb}.swatch-grid small{color:#9ca5ad}.logo-tools,.logo-upload,.option-list button,.position-grid button,.pvc-tools,.pvc-upload,.selection-summary span{background:#151b21;border-color:#35404b;color:#cbd2d8}.custom-swatch.active,.logo-upload.active,.option-list button.active,.position-grid button.active,.pvc-upload.active,.swatch-grid button.active{background:#241b12;border-color:var(--orange);color:var(--ink)}.option-list button:hover,.position-grid button:hover,.swatch-grid button:hover{border-color:var(--orange)}.shape{background:#adb7c0}.option-list button.active .shape{background:var(--orange)}.position-grid button>i{background:#202831;border-color:#667481}.position-grid button>i:before{background:#88949f}.logo-tools button,.pvc-tools button{background:#1b2229;color:#cbd2d8;border-color:#46525d}.pvc-remove{background:#251b18!important;border-color:#795343!important;color:#efb698!important}.selection-summary span{font-size:11px;padding:10px}.selection-summary b{color:var(--ink)}.apply-design{background:var(--orange);color:#07090b;font-size:13px;padding:16px}.apply-design:hover{background:#ff8b20}.submit-section>p{color:var(--muted);font-size:12px;line-height:1.6;margin-top:12px}.submit-section>p[role=status]{color:#f5b371}button:focus-visible,input:focus-visible{outline-color:var(--orange)}@media(max-width:620px){.topbar{padding-inline:16px;gap:12px;height:auto;min-height:64px}.brand-lockup{min-width:0}.brand-lockup span{font-size:12px;line-height:1.5}.preview-pane{padding:24px 20px}.stage{margin-top:12px}.top-actions{flex-shrink:0}}}@scope (.appearance-configurator){.download-design{width:100%;margin-top:10px;padding:14px;border:1px solid var(--orange);background:transparent;color:var(--orange);font-size:13px;cursor:pointer}.apply-design:disabled,.download-design:disabled{opacity:.5;cursor:wait}.submit-section>p[role=alert]{color:#ffb5a6}}