@font-face{font-family:LabMono;src:local('SFMono-Regular'),local('Consolas');font-display:swap}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:#f4f3ef;color:#262624;font-family:Arial,'PingFang SC','Microsoft YaHei',sans-serif;font-size:14px}button,input,a,summary{-webkit-tap-highlight-color:transparent}button,a,input{outline-offset:4px}button{font:inherit;cursor:pointer}button:disabled{cursor:not-allowed;opacity:.4}a{color:inherit;text-decoration:none}button{border:0}button:hover{filter:brightness(.95)}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid #db0001}button:active{transform:translateY(1px)}.site-header{height:88px;display:flex;align-items:center;justify-content:space-between;padding:0 4%;border-bottom:1px solid #dcdcd5}.wordmark{font-size:22px;font-weight:800;display:flex;align-items:center;gap:8px;letter-spacing:-1px}.wordmark i{color:#db0001;font-style:normal}.brand-symbol{display:block;width:48px;height:48px;object-fit:contain;margin-right:-3px;flex-shrink:0}.wordmark-sub{font-family:LabMono,monospace;font-weight:400;letter-spacing:1px;font-size:8px;width:60px;line-height:1.6;margin-left:12px}.site-header nav{display:flex;gap:32px;height:100%;align-items:center}.site-header nav a{color:#777870;font-size:13px;height:100%;display:flex;align-items:center;gap:8px;border-bottom:2px solid transparent}.site-header nav a.active{color:#252724;border-bottom-color:#db0001}.site-header nav span{font-size:16px}.private{display:flex;gap:7px;align-items:center;font-size:11px;color:#73766d}.private svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:1.5}main{max-width:1560px;padding:0 4%;margin:auto}.intro{display:flex;align-items:flex-end;justify-content:space-between;padding:51px 0 35px}.eyebrow{font-family:LabMono,monospace;letter-spacing:1.5px;font-size:10px;display:flex;align-items:center;gap:9px;color:#666b62}.eyebrow>span:not(:only-child){width:6px;height:6px;border-radius:50%;background:#db0001}.eyebrow b{font-weight:400;color:#aaa;padding:0 6px}h1{font-size:clamp(25px,3vw,43px);letter-spacing:-1.5px;font-weight:550;line-height:1.3;margin:19px 0 13px}h1>span,.section-title h2>span{color:#db0001}.intro p{color:#777970;font-size:12px;line-height:1.8;margin:0}.intro-meta{font:9px/2.3 LabMono,monospace;text-align:right;letter-spacing:1px;margin-bottom:3px;color:#75786f}.intro-meta span{letter-spacing:0;color:#989a92}.lab-toolbar{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #d8d9d1;border-bottom:1px solid #d8d9d1;min-height:65px}.preset-switch,.toolbar-actions{display:flex;align-items:center;gap:7px}.toolbar-label{font-size:10px;letter-spacing:1px;color:#8b8c84;margin-right:15px}.preset{background:none;color:#92948b;padding:9px 13px;border-radius:3px;font-family:LabMono,monospace;font-size:10px;display:flex;gap:10px;align-items:center;white-space:nowrap}.preset span{font-family:Arial,'PingFang SC',sans-serif;font-size:12px;color:#64675e}.preset.active{background:#e7e8df;color:#db0001}.preset.active span{color:#2d3029}.plain{background:none;font-size:11px;color:#767b70;padding:9px 13px}.toolbar-actions .plain+ .plain{border-left:1px solid #d9dcd0}.workspace{display:grid;grid-template-columns:254px minmax(0,1fr);gap:25px;padding:24px 0}.controls{background:#edeee7;border:1px solid #e1e2d8;border-radius:5px;padding:20px}.panel-heading{display:flex;align-items:center;justify-content:space-between}.panel-heading h2{margin:0;font-size:13px;font-weight:500}.panel-heading>span{font:8px LabMono,monospace;letter-spacing:1px;color:#91958a}.source-switch{display:flex;margin:20px 0 23px;background:#e1e4d9;padding:3px;border-radius:4px}.source-switch button{background:none;flex:1;padding:8px 5px;font-size:11px;color:#7d8276;border-radius:2px}.source-switch button.active{background:#fbfcf7;color:#34382f;box-shadow:0 1px 4px #202b2010}.param{margin-bottom:21px}.param-label{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.param-label label{font-size:11px;color:#43473e}.param-label label small{font-size:8px;font-family:LabMono,monospace;color:#979b8f;margin-left:6px}.param-value{font-family:LabMono,monospace;color:#db0001;font-size:11px;border:1px solid #d9ddcf;background:#f4f5ef;padding:3px 4px;border-radius:3px;width:58px;text-align:right;appearance:textfield}.param-value::-webkit-inner-spin-button{appearance:none}.range{width:100%;height:3px;border-radius:2px;appearance:none;background:linear-gradient(to right,#db0001 var(--range,40%),#d3d8c8 var(--range,40%));display:block;margin:13px 0 10px;cursor:pointer}.range::-webkit-slider-thumb{appearance:none;width:11px;height:11px;border-radius:50%;background:#db0001;border:2px solid #fff;box-shadow:0 0 0 1px #db000130}.range::-moz-range-thumb{width:9px;height:9px;border-radius:50%;background:#db0001;border:2px solid #fff}.range-labels{display:flex;justify-content:space-between;font:8px LabMono,monospace;color:#a1a599}.control-divider{border-top:1px solid #d9ddd0;margin:10px 0 18px}.minor-label{font-size:10px;display:flex;justify-content:space-between;color:#626859}.minor-label span{font:8px LabMono,monospace;letter-spacing:1px;color:#959b8d}.material-row{display:flex;gap:4px;margin:13px 0 18px}.material{font-size:10px;display:flex;align-items:center;gap:5px;padding:8px 6px;flex:1;border:1px solid transparent;background:none;color:#898f80;border-radius:3px;white-space:nowrap}.material.active{border-color:#b8c0ac;color:#454c3d;background:#f4f5ee}.swatch{width:13px;height:13px;border-radius:50%;display:inline-block;border:1px solid #62665950;background:linear-gradient(140deg,#666 8%,white 36%,#4e504f 55%,#d8dce0 80%)}.swatch.blue{background:linear-gradient(140deg,#051f7b,#708cfa 40%,#041687 55%,#1d3ef6)}.swatch.copper{background:linear-gradient(140deg,#622d14,#ffc886 40%,#8f3c17 55%,#e58d5f)}.switch-row{display:flex;align-items:center;justify-content:space-between;margin:13px 0;font-size:11px;cursor:pointer}.switch-row small{font:8px LabMono,monospace;color:#969e8e;margin-left:6px}.switch-row input{position:absolute;opacity:0}.switch{width:26px;height:14px;border-radius:10px;background:#d2d7c8;position:relative}.switch:after{content:'';position:absolute;background:#fff;width:10px;height:10px;top:2px;left:2px;border-radius:50%;transition:transform .2s}.switch-row input:checked+.switch{background:#db0001}.switch-row input:checked+.switch:after{transform:translateX(12px)}.switch-row input:focus-visible+.switch{outline:2px solid #db0001;outline-offset:3px}.control-note{margin-top:24px;display:flex;gap:9px;border-top:1px solid #d9ddd0;padding-top:16px;color:#989f8e}.control-note>span{color:#db0001;font-size:15px}.control-note p{font-size:10px;line-height:1.9;margin:0}.view-area{min-width:0;display:flex;flex-direction:column}.view-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.viewport{background:#161918;border:1px solid #303430;border-radius:5px;overflow:hidden;color:#cad0c7;min-width:0}.viewport-head{height:45px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid #ffffff0e;font-size:11px}.viewport-head>span{display:flex;align-items:center;gap:7px}.viewport-head small{font:8px LabMono,monospace;margin-left:2px;color:#6c756b;letter-spacing:1px}.orange-dot{width:5px;height:5px;background:#db0001;border-radius:50%}.icon-button{background:none;color:#b0b7aa;font-size:19px;padding:4px 6px}.canvas-wrap{aspect-ratio:1/1;position:relative;background:#101311;overflow:hidden}.canvas-wrap canvas{width:100%;height:100%;display:block}.editor-overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;touch-action:none}.editor-overlay.editing{pointer-events:auto;cursor:crosshair}.editor-overlay line{stroke:#db0001;opacity:.24;stroke-width:1;pointer-events:none}.editor-overlay circle{fill:#db0001;stroke:#ffd9d9;stroke-width:2;cursor:grab;pointer-events:all}.editor-overlay circle:hover{r:9}.canvas-axis{position:absolute;bottom:18px;left:18px;font:8px/1.7 LabMono,monospace;color:#87947e;opacity:.45;pointer-events:none}.corner-label{position:absolute;right:16px;bottom:20px;font:7px LabMono,monospace;letter-spacing:1px;color:#7b8577;opacity:.65;pointer-events:none}.viewport-foot{height:35px;padding:0 14px;display:flex;align-items:center;justify-content:space-between;font:7px LabMono,monospace;letter-spacing:.4px;color:#737e6e;border-top:1px solid #ffffff0b}.viewport-foot span:nth-child(2){color:#87967c}.view-tabs{display:flex;height:100%;gap:14px;align-items:center}.view-tabs button{font-size:10px;padding:0;height:100%;border-bottom:1px solid transparent;color:#6f7a6c;background:none}.view-tabs button.active{color:#e0e6db;border-bottom-color:#db0001}.render-status{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:15px 1px;font:9px LabMono,monospace;color:#919989}.render-status>div{display:flex;align-items:center;gap:7px}.green-dot{width:5px;height:5px;border-radius:50%;background:#73975a}.status-divider{margin:0 5px;color:#c4c9bc}.experiment-tip{border:1px solid #dfdfd5;border-radius:4px;margin-top:auto;padding:17px 19px;display:grid;grid-template-columns:1fr auto;gap:9px 12px;background:#f7f7f1}.tip-index{font:8px LabMono,monospace;letter-spacing:1px;color:#9ca28f}.experiment-tip p{font-size:11px;color:#8b9380;line-height:1.8;margin:0;grid-column:1;max-width:550px}.experiment-tip b{font-weight:400;color:#424b36}.experiment-tip button{grid-column:2;grid-row:1/3;align-self:center;font-size:10px;padding:10px 14px;background:#e9ecdf;border:1px solid #d8ddcd;border-radius:3px;color:#647254;touch-action:none}.experiment-tip button span{margin-left:8px;color:#9aab88}.export-strip{display:flex;justify-content:space-between;align-items:center;padding:19px 0;border-top:1px solid #d7dbce;border-bottom:1px solid #d7dbce;gap:16px}.export-strip>div{display:flex;gap:10px;align-items:center}.export-symbol{font-size:28px;color:#979e8d;margin-right:9px}.export-strip p{font-size:12px;margin:0}.export-strip small{display:block;color:#949d86;font-size:10px;margin-top:5px}.secondary{border:1px solid #d7ddcc;background:transparent;color:#69745c;font-size:11px;border-radius:3px;padding:11px 14px}.primary{border:1px solid #db0001;background:#db0001;color:white;font-size:11px;border-radius:3px;padding:11px 17px}.primary>span{margin-left:12px}.workflow-section{padding:70px 0 55px}.section-title h2{font-size:27px;font-weight:500;letter-spacing:-.5px;margin:17px 0 14px}.section-title p{font-size:12px;color:#8a9480;line-height:1.8}.workflow-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:65px;margin-top:35px}.workflow-explain{padding-top:7px}.step{display:flex;gap:22px;margin-bottom:32px}.step>span{font:11px LabMono,monospace;color:#db0001;padding-top:4px}.step h3{font-size:14px;font-weight:500;margin:0 0 9px}.step p{font-size:11px;line-height:1.9;color:#8b9481;margin:0 0 12px;max-width:370px}.step code{font:8px LabMono,monospace;letter-spacing:.6px;color:#a5ad99}.doc-link{font-size:10px;color:#8c9880;display:block;margin:14px 0 0 36px;text-decoration:underline;text-underline-offset:4px}.code-card{background:#20251f;border-radius:5px;overflow:hidden;min-width:0;align-self:start}.code-tabs{display:flex;gap:20px;border-bottom:1px solid #ffffff10;height:47px;padding:0 20px;overflow:auto}.code-tabs button{white-space:nowrap;background:none;color:#85927b;font-size:10px;padding:0;border-bottom:1px solid transparent}.code-tabs button.active{color:#e3ebdc;border-bottom-color:#db0001}.code-meta{display:flex;justify-content:space-between;padding:16px 20px 0;align-items:center;font:9px LabMono,monospace;color:#87977c}.code-meta button{background:#30382b;border:1px solid #434e3b;color:#aabb9c;border-radius:3px;padding:5px 8px;font-size:9px}.code-card pre{height:305px;overflow:auto;font:10px/1.8 LabMono,monospace;margin:15px 0 0;padding:0 22px 22px;color:#d1dac4;tab-size:2;scrollbar-color:#46553c #20251f}.code-card .comment{color:#788c6a}.code-card .keyword{color:#ff8c8d}.code-card .number{color:#bbc87e}.code-foot{border-top:1px solid #ffffff0c;display:flex;justify-content:space-between;padding:11px 20px;font:8px LabMono,monospace;color:#728363}.guide-section{border-top:1px solid #d6ddcd;padding:45px 0 65px;display:grid;grid-template-columns:.6fr 1.4fr;gap:65px}.guide-heading h2{font-size:23px;font-weight:500;margin-top:15px}.guide-heading .eyebrow{font-size:8px}.guide-content details{border-bottom:1px solid #dce1d4;padding:16px 0}.guide-content details:first-child{padding-top:0}.guide-content summary{list-style:none;display:flex;justify-content:space-between;cursor:pointer;font-size:12px;color:#57654b}.guide-content summary::-webkit-details-marker{display:none}.guide-content summary span{color:#a0ad94}.guide-content p{font-size:11px;color:#8a977d;line-height:1.9;max-width:650px;margin:15px 0 0}.guide-content details[open] summary span{transform:rotate(45deg)}footer{border-top:1px solid #d9dfd0;display:flex;justify-content:space-between;align-items:center;padding:22px 4%;font-size:9px;color:#97a389}.footer-brand{font-size:12px;font-weight:700;color:#758269}footer>span:last-child{font:8px LabMono,monospace;letter-spacing:1px}footer i{color:#db0001;font-size:15px;margin-left:8px}.toast{position:fixed;bottom:30px;left:50%;transform:translate(-50%,15px);background:#2c3527;color:#f3f6ee;padding:13px 23px;border:1px solid #596a4a;border-radius:5px;font-size:12px;opacity:0;pointer-events:none;transition:all .2s;z-index:10;max-width:90%;box-shadow:0 10px 50px #121a1030}.toast.show{opacity:1;transform:translate(-50%,0)}[hidden]{display:none!important}.upload-zone{display:block;border:1px dashed #bdc7ae;border-radius:4px;text-align:center;padding:13px 4px;cursor:pointer;color:#727f62}.upload-zone span{font-size:11px}.upload-zone small{display:block;font-size:8px;margin-top:7px;color:#929f82}.check-row{font-size:10px;display:flex;align-items:center;gap:5px;margin-top:10px;color:#7c8a6c}.check-row input{accent-color:#db0001}.input-status{font-size:9px;line-height:1.7;color:#8d9b7c;margin:8px 0 18px;overflow-wrap:anywhere}#render-error{background:#fff0f0;border:1px solid #eeb7b7;color:#8d2021;padding:15px;line-height:1.7;font-size:12px;border-radius:4px;margin-bottom:10px}body{--x:0}@media(min-width:1500px){.workspace{grid-template-columns:275px minmax(0,1fr)}}@media(max-width:1100px){.wordmark-sub{display:none}.workspace{grid-template-columns:223px minmax(0,1fr);gap:17px}.controls{padding:16px}.view-grid{gap:10px}.viewport-head{padding:0 10px}.viewport-head small{display:none}.view-tabs{gap:9px}.view-tabs button{font-size:9px}.experiment-tip{display:block}.experiment-tip p{margin:10px 0}.experiment-tip button{margin-top:5px}.param{margin-bottom:17px}.intro-meta{display:none}.workflow-grid{gap:35px}.viewport-foot{padding:0 9px;font-size:6px}.material{padding:8px 3px;font-size:9px}.swatch{width:11px;height:11px}}@media(max-width:800px){.site-header{height:68px}.wordmark{font-size:18px}.brand-symbol{display:block;width:48px;height:48px;object-fit:contain;margin-right:-3px;flex-shrink:0}.site-header nav{gap:18px}.site-header nav a{font-size:11px}.private{display:none}.intro{padding:35px 0 25px}h1{font-size:29px}.intro p{font-size:11px}.workspace{grid-template-columns:1fr;gap:17px}.view-area{grid-row:1}.controls{display:grid;grid-template-columns:1fr 1fr;gap:0 22px}.panel-heading,.source-switch,#sliders,.control-divider,.control-note,#image-panel{grid-column:1/-1}.source-switch{max-width:260px;margin:15px 0 20px}#sliders{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}.minor-label{grid-column:1}.material-row{grid-column:1;grid-row:auto;margin-bottom:0}.switch-row{grid-column:2;margin:4px 0}.switch-row[for=animate]{grid-row:6}.switch-row[for=handles]{grid-row:7}.control-note{margin-top:16px;padding-top:12px}.minor-label span{display:none}.param{margin-bottom:20px}.view-grid{gap:12px}.viewport-head small{display:inline}.viewport-head{padding:0 13px}.view-tabs{gap:12px}.view-tabs button{font-size:10px}.viewport-foot{font-size:7px}.experiment-tip{display:grid;gap:5px;padding:14px}.experiment-tip p{margin:0}.experiment-tip button{margin:0;padding:9px}.toolbar-label{display:none}.preset{padding:9px;gap:6px}.toolbar-actions{gap:0}.plain{padding:8px;font-size:10px}.lab-toolbar{min-height:58px}.export-strip p{font-size:11px}.export-strip small{font-size:9px}.export-symbol{display:none}.secondary,.primary{padding:10px;font-size:10px}.workflow-section{padding:45px 0}.section-title h2{font-size:24px}.workflow-grid{grid-template-columns:1fr;gap:30px}.workflow-explain{display:grid;grid-template-columns:1fr 1fr 1fr;gap:15px}.step{gap:9px;margin-bottom:0}.step p{font-size:10px}.step code{font-size:7px}.step h3{font-size:12px}.doc-link{margin:0;grid-column:1/-1}.guide-section{grid-template-columns:1fr;gap:15px;padding:30px 0 45px}.guide-heading h2{font-size:22px}footer>span:nth-child(2){display:none}}@media(max-width:520px){.site-header nav a:last-child{display:none}.site-header nav{gap:15px}.wordmark{font-size:16px}.brand-symbol{display:block;width:48px;height:48px;object-fit:contain;margin-right:-3px;flex-shrink:0}.site-header{padding:0 5%}main{padding:0 5%}.intro h1{font-size:26px;letter-spacing:-1px}.intro p{max-width:320px;line-height:1.9;font-size:10px}.eyebrow{font-size:8px;letter-spacing:1px}.preset{font-size:8px;padding:8px 6px;gap:4px}.preset span{font-size:10px}.plain{padding:8px 5px;font-size:9px}.view-grid{grid-template-columns:1fr}.canvas-wrap{aspect-ratio:1}.viewport-head{height:42px}.viewport-foot{height:32px;font-size:8px}.view-tabs{gap:20px}.view-tabs button{font-size:11px}.render-status{font-size:8px;flex-wrap:wrap;gap:8px}.experiment-tip{display:block}.experiment-tip p{margin:9px 0}.experiment-tip button{margin-top:2px}.export-strip{flex-direction:column;align-items:flex-start;gap:15px}.export-strip>div:last-child{width:100%;gap:7px}.primary{margin-left:auto}.controls{gap:0 16px}#sliders{gap:0 20px}.param-label label{font-size:11px}.param-label label small{display:none}.param-value{width:52px}.workflow-explain{grid-template-columns:1fr;gap:23px}.step{gap:20px}.step p{max-width:none;font-size:11px}.step code{font-size:8px}.step h3{font-size:13px}.section-title p{font-size:11px}.code-tabs{gap:18px;padding:0 16px}.code-card pre{font-size:9px;padding:0 16px 20px}.doc-link{margin-left:34px}.guide-content p{font-size:11px}footer{padding:22px 5%}.footer-brand{font-size:10px}footer>span:last-child{font-size:6px}.toast{font-size:11px;bottom:20px;width:max-content;text-align:center}}
/* v2 · input workshop and real geometry */
.mode-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;flex-wrap:wrap}.mode-switch{display:flex;background:#e7e8df;border-radius:4px;padding:3px;gap:3px}.mode-switch button{background:none;padding:9px 13px;font-size:10px;color:#76806a;border-radius:3px}.mode-switch button.active{background:#fff;color:#db0001;box-shadow:0 1px 5px #26301a10}#hole-status{font-size:10px;color:#7c896d}.source-switch button{padding-left:8px;padding-right:8px;white-space:nowrap}.select-label{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:10px;color:#707c61;margin:13px 0 7px}.select-label small{font-size:8px;color:#8e987f}select,input[type=number]{font:inherit;color:inherit}select{background:#fafbf5;border:1px solid #d5ddca;border-radius:3px;padding:8px;width:100%;font-size:11px}#extract-color{width:30px;height:25px;padding:1px;background:none;border:1px solid #c9d2bf}.mini-param{display:grid;grid-template-columns:60px 1fr;gap:5px;align-items:center;font-size:10px;margin-top:12px;color:#7c896d}input[type=range]{accent-color:#db0001;min-width:0;max-width:100%}.input-previews{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}.input-previews figure{margin:0;min-width:0}.input-previews canvas{width:100%;aspect-ratio:1;background:repeating-conic-gradient(#d9ddd3 0 25%,#f2f3ed 0 50%) 50% / 12px 12px;border-radius:3px}.input-previews figcaption{font-size:8px;color:#8c987b;text-align:center;margin-top:5px}#input-before{cursor:crosshair}.draw-panel{display:grid;grid-template-columns:1fr minmax(200px,50%);gap:20px;background:#e9ede1;border:1px solid #d1dbc5;padding:18px;border-radius:5px;margin-bottom:15px}.draw-controls h3{font-weight:500;font-size:19px;margin:12px 0}.draw-controls p{font-size:11px;line-height:1.9;color:#7b886b;max-width:280px}.draw-controls small{display:block;color:#8c987d;font-size:9px;margin-top:13px}.draw-controls input[type=range]{width:100%}.button-row{display:flex;gap:7px;margin:12px 0}.secondary.active{background:#f7dddd;color:#db0001;border-color:#e59a9b}#drawing{width:100%;height:auto;aspect-ratio:1;display:block;background:#0d110b;border-radius:4px;touch-action:none;cursor:crosshair;align-self:center}.mesh-panel{background:#e9ede1;border:1px solid #d1dbc5;padding:17px;border-radius:5px;margin-bottom:15px}.mesh-controls{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.mesh-controls label{font-size:10px;color:#77876a}.mesh-controls select,.mesh-controls input[type=number]{margin-top:7px;height:33px}.mesh-controls input[type=number]{width:100%;padding:7px;border:1px solid #d5ddca;border-radius:3px;background:#fafbf5;font-size:11px}.mesh-controls .check-row{margin:0}.mesh-controls button{grid-column:3/-1;padding:6px}.mesh-panel p{font-size:10px;line-height:1.8;color:#8a977b;margin:13px 0}.mesh-status-row{display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid #d1dbc5;padding-top:10px;font-size:10px;line-height:1.7;color:#647653}.mesh-status-row button{white-space:nowrap;padding:7px 10px}#mesh-canvas{touch-action:none;cursor:grab}#mesh-canvas:active{cursor:grabbing}.export-strip>div:last-child{flex-wrap:wrap}.controls{align-self:start}.view-area{min-width:0}.canvas-wrap canvas{max-width:100%}#trace-source{width:100%;font-size:10px}.corner-label,.canvas-axis{pointer-events:none}
@media(max-width:1100px){.mode-switch button{padding:8px;font-size:9px}.draw-panel{gap:12px;padding:13px}.mesh-controls{gap:9px}.export-strip{gap:15px}.export-strip>div:first-child{min-width:155px}.export-strip>div:last-child{justify-content:flex-end}.export-strip small{max-width:190px}.draw-controls h3{font-size:16px}}
@media(max-width:800px){.controls .switch-row[for=animate],.controls .switch-row[for=handles]{grid-row:auto}.controls .control-note{grid-column:1/-1}.input-previews{max-width:300px}#image-panel{max-width:100%}.mini-param{grid-template-columns:90px 1fr}.draw-panel{grid-template-columns:1fr 50%}}
@media(max-width:520px){.mode-bar{gap:9px}#hole-status{font-size:9px}.draw-panel{grid-template-columns:1fr}.draw-controls p{max-width:none}.draw-controls{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}.draw-controls>div:first-child{grid-column:1/-1}.draw-controls>.select-label{grid-column:2;grid-row:2}.draw-controls>input{grid-column:2;grid-row:3}.draw-controls>.button-row{margin:6px 0}.draw-controls>small{grid-column:1/-1}.mesh-controls{grid-template-columns:1fr 1fr}.mesh-controls button{grid-column:1/-1}.export-strip>div:last-child{justify-content:flex-start}.export-strip .primary{margin-left:0}.export-strip small{max-width:none}}

.drawing-stage{position:relative;align-self:center;min-width:0}.drawing-stage canvas{width:100%;height:auto;display:block}#pen-overlay{position:absolute;inset:0;pointer-events:none}.button-row{flex-wrap:wrap}#pen-help{font-size:11px;color:#667858}#drawing:focus-visible{outline:2px solid #db0001;outline-offset:3px}#mesh-build{background:#db0001;color:white;border-color:#db0001}.mesh-controls input[type=range]{display:block;width:100%;margin-top:18px}@media(max-width:520px){.draw-controls{display:block}.draw-controls .select-label{margin-top:14px}}

/* Persistent workspace: each control rail scrolls without moving the preview. */
.language-switch{display:flex;gap:3px;border:1px solid #d4d9cb;padding:3px;border-radius:5px;flex-shrink:0}
.language-switch button{min-width:38px;min-height:34px;padding:6px;background:transparent;color:#65705c;border-radius:3px;font-size:11px}
.language-switch button[aria-pressed=true]{background:#283226;color:#fff}
.site-header{gap:18px}.private{display:none}.intro{padding-top:32px;padding-bottom:26px}
.workspace{height:min(840px,calc(100dvh - 32px));min-height:460px;display:grid;grid-template-columns:250px minmax(0,1fr);gap:18px;padding:16px 0;scroll-margin-top:0;overflow:hidden}
.workspace.has-tools{grid-template-columns:250px minmax(0,1fr) 270px}
.controls,.tool-rail{height:100%;min-height:0;min-width:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:#adb89e transparent;align-self:stretch;padding:18px;display:block}
.tool-rail{display:none;background:#edeee7;border:1px solid #e1e2d8;border-radius:5px}
.has-tools .tool-rail{display:block}.tool-rail .panel-heading{margin-bottom:18px}
.controls .panel-heading{gap:10px}.panel-heading>span{font-size:7px}.panel-heading h2{line-height:1.5}
.param-label{gap:8px}.param-label label{line-height:1.5}.param-label small{display:block;margin-left:0}.param-value{flex-shrink:0}
.controls #sliders{display:block}.material-row{flex-wrap:wrap}.material{white-space:normal;min-height:40px;font-size:10px}.source-switch{max-width:none}.source-switch button{white-space:normal;min-height:40px;font-size:11px}
.view-area{min-height:0;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto auto;gap:10px;grid-row:auto}
.preview-switch,.mobile-tools{display:flex;gap:4px;align-items:center;background:#e7e8df;border-radius:5px;padding:4px}
.preview-switch button,.mobile-tools button{background:none;border-radius:3px;min-height:36px;padding:8px 14px;color:#707d64;font-size:11px;line-height:1.4}
.preview-switch button.active,.mobile-tools button.active{background:#fafbf6;color:#db0001;box-shadow:0 1px 4px #202b2010}
.mode-bar{margin:0;gap:8px}.mode-switch button{min-height:36px;white-space:normal}#hole-status{line-height:1.6;font-size:10px}
.view-grid{display:grid;grid-template-columns:minmax(0,1fr);min-height:0;gap:0}
.viewport{display:none;min-height:0;grid-template-rows:auto minmax(0,1fr) auto}
.workspace[data-preview=metal] .viewport:not(.mask-viewport):not(.drawing-viewport),.workspace[data-preview=mask] .mask-viewport,.workspace[data-preview=drawing] .drawing-viewport{display:grid}
.viewport-head{min-height:44px;height:auto;padding:8px 12px;gap:8px;line-height:1.5}.viewport-foot{height:auto;min-height:32px;gap:8px;font-size:9px;line-height:1.5;padding:6px 12px;flex-wrap:wrap}
.canvas-wrap,.drawing-stage{min-height:0;width:100%;height:100%;aspect-ratio:auto;container-type:size;position:relative;align-self:stretch;overflow:hidden;display:flex;justify-content:center;align-items:center;background:#101311}
.canvas-wrap canvas,.canvas-wrap .editor-overlay,.drawing-stage canvas,#drawing{width:min(100cqw,100cqh);height:min(100cqw,100cqh);max-width:none;aspect-ratio:1;flex-shrink:0}
.canvas-wrap .editor-overlay,#pen-overlay{inset:auto;left:50%;top:50%;transform:translate(-50%,-50%)}
.render-status{padding:0;line-height:1.6;flex-wrap:wrap;font-size:9px}.render-status>div{flex-wrap:wrap}
.experiment-tip{display:block;margin:0;padding:10px 12px}.experiment-tip p{font-size:10px;margin:4px 0}.experiment-tip button{margin:4px 0 0;min-height:36px}.tip-index{display:none}
.tool-rail .draw-panel,.tool-rail .mesh-panel{display:block;padding:0;border:0;background:transparent;margin-bottom:20px}.tool-rail .draw-controls{display:block}.tool-rail .draw-controls h3{font-size:18px}.tool-rail .draw-controls p{max-width:none}.tool-rail .draw-controls small{line-height:1.6}
.tool-rail .mesh-controls{grid-template-columns:1fr;gap:16px}.tool-rail .mesh-controls button{grid-column:auto;min-height:40px}.tool-rail .mesh-controls label{font-size:12px;line-height:1.5}.tool-rail .mesh-status-row{display:flex;flex-direction:column;align-items:stretch;gap:12px}.tool-rail select{height:auto;min-height:40px;font-size:12px}.tool-rail .button-row .secondary{flex:1;min-height:40px}.tool-empty{font-size:12px;line-height:1.9;color:#818e74}.mobile-tools{display:none}
.range{height:22px;background:linear-gradient(to right,#db0001 var(--range,40%),#d3d8c8 var(--range,40%)) center/100% 3px no-repeat;margin:4px 0}.range::-webkit-slider-thumb{width:16px;height:16px}.range::-moz-range-thumb{width:13px;height:13px}.draw-controls input[type=range],.mesh-controls input[type=range]{min-height:28px}
html[lang!=zh-CN] .param-label small{display:none}html[lang!=zh-CN] .panel-heading>span{display:none}
@media(max-width:1100px) and (min-width:801px){.workspace,.workspace.has-tools{grid-template-columns:215px minmax(0,1fr)}.workspace.has-tools{grid-template-columns:215px minmax(0,1fr) 230px;gap:12px}.controls,.tool-rail{padding:12px}.experiment-tip p{display:none}.experiment-tip{padding:6px}.viewport-foot{font-size:8px}.site-header nav{gap:16px}}
@media(max-width:800px){
 .site-header{height:auto;min-height:68px;padding:12px 4%;flex-wrap:wrap;gap:10px}.site-header nav{order:3;width:100%;gap:24px;height:auto}.site-header nav a{padding:6px 0;font-size:11px}.site-header nav a:last-child{display:flex}.wordmark-sub{display:none}
 .intro{padding:22px 0}.intro h1{font-size:27px;letter-spacing:-.5px}.intro p{max-width:none}.lab-toolbar{flex-wrap:wrap;padding:8px 0;gap:8px}.preset-switch{overflow:auto;max-width:100%}.preset{padding:8px;font-size:9px}.preset span{font-size:11px}.toolbar-actions{margin-left:auto}.toolbar-actions .plain{min-height:36px;font-size:10px}
 .workspace,.workspace.has-tools{height:calc(100dvh - 16px);min-height:440px;max-height:1100px;grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto minmax(160px,.8fr);gap:9px;padding:8px 0}
 .view-area{grid-row:1;grid-template-rows:auto auto minmax(0,1fr);gap:6px}.view-area .render-status,.view-area .experiment-tip{display:none}.view-area #render-error{position:absolute;z-index:2;max-width:90%}
 .preview-switch button{flex:1;min-height:36px;padding:6px;font-size:11px}.mode-switch button{font-size:10px;padding:6px 8px}.mode-bar{gap:4px}.mode-switch{flex-shrink:0}#hole-status{font-size:9px}.viewport-head{min-height:34px;padding:4px 10px;font-size:10px}.viewport-foot{min-height:26px;padding:4px 10px;font-size:8px}.corner-label,.canvas-axis{display:none}
 .mobile-tools{display:flex;grid-row:2}.mobile-tools button{flex:1;padding:7px 5px;min-height:40px;font-size:11px}
 .controls,.tool-rail,.has-tools .tool-rail{display:none;grid-row:3;grid-column:1;height:100%;padding:14px}
 .workspace[data-tool=shape] .controls,.workspace[data-tool=tools] .tool-rail{display:block}
 .controls #sliders{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}.controls .panel-heading{display:none}.controls .source-switch{margin:0 0 16px}.controls .param{margin-bottom:15px}.param-label label{font-size:11px}.controls .material-row{max-width:420px}
 .workspace.preview-expanded{grid-template-rows:minmax(0,1fr) auto}.workspace.preview-expanded .controls,.workspace.preview-expanded .tool-rail{display:none}
 .view-tabs{gap:12px}.view-tabs button{font-size:10px}.tool-rail .mesh-controls{grid-template-columns:1fr 1fr;gap:14px}.tool-rail .mesh-controls button{grid-column:1/-1}.tool-rail .draw-controls p{max-width:none}.tool-rail .draw-controls>.button-row{margin:10px 0}
 .export-strip>div:last-child{gap:8px}.export-strip button{min-height:42px}.primary{margin-left:0}.guide-section,.workflow-section{overflow-wrap:anywhere}
}
@media(max-height:520px) and (min-width:650px){.workspace,.workspace.has-tools{min-height:320px;grid-template-columns:210px minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto}.view-area{grid-column:2;grid-row:1/-1}.mobile-tools{grid-column:1;grid-row:2}.controls,.tool-rail{grid-column:1;grid-row:1}.controls #sliders{display:block}.workspace.preview-expanded{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto}.workspace.preview-expanded .view-area{grid-column:1;grid-row:1}.workspace.preview-expanded .mobile-tools{grid-column:1;grid-row:2}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

.workspace[data-preview=split] .view-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
.workspace[data-preview=split] .viewport:not(.drawing-viewport){display:grid}
.preview-switch{flex-wrap:wrap}
@media(max-width:360px){.controls #sliders{grid-template-columns:1fr}.language-switch button{min-width:32px}.preview-switch button{padding:6px 4px}}
@media(max-width:800px) and (max-height:650px){.workspace,.workspace.has-tools{grid-template-rows:minmax(0,1fr) auto 180px}.view-area #hole-status,.viewport-foot{display:none}.workspace.preview-expanded{grid-template-rows:minmax(0,1fr) auto}}
@media(max-height:520px) and (min-width:650px){
 .workspace,.workspace.has-tools{height:calc(100dvh - 16px);min-height:300px;grid-template-columns:210px minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto}
 .mobile-tools{display:flex;grid-column:1;grid-row:2;flex-wrap:wrap}.mobile-tools button{flex:1;padding:5px;font-size:10px}
 .controls,.tool-rail,.has-tools .tool-rail{display:none;grid-column:1;grid-row:1;height:100%;padding:12px}
 .workspace[data-tool=shape] .controls,.workspace[data-tool=tools] .tool-rail{display:block}
 .view-area{grid-column:2;grid-row:1/-1;grid-template-rows:auto auto minmax(0,1fr);gap:5px}
 .view-area .render-status,.view-area .experiment-tip,.view-area #hole-status,.viewport-foot{display:none}
 .workspace.preview-expanded{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto}
 .workspace.preview-expanded .controls,.workspace.preview-expanded .tool-rail{display:none}
 .workspace.preview-expanded .view-area{grid-column:1;grid-row:1}.workspace.preview-expanded .mobile-tools{grid-column:1;grid-row:2}
 .controls #sliders{display:block}.tool-rail .mesh-controls{grid-template-columns:1fr}
}

.obj-upload{padding-bottom:12px;border-bottom:1px solid #d1dbc5;margin-bottom:12px}.obj-upload button{width:100%}.obj-upload p{overflow-wrap:anywhere}#obj-controls{padding-bottom:15px;margin-bottom:12px;border-bottom:1px solid #d1dbc5}#obj-controls>label{font-size:11px;color:#67795b}#obj-controls input[type=range]{width:100%}#obj-controls .check-row{margin-top:12px}.mesh-status-row{flex-wrap:wrap}.mesh-status-row>span{flex-basis:100%}

/* Long translated toolbar labels must remain reachable on short screens. */
@media(max-width:1100px){.lab-toolbar{flex-wrap:wrap;gap:8px;padding:8px 0}.preset-switch{max-width:100%;overflow:auto}.toolbar-actions{max-width:100%;flex-wrap:wrap;margin-left:auto}}

.mesh-controls .mesh-export-note{grid-column:1/-1;margin:0;font-size:11px}