.perforated-tool{--cad-ink:#202529;--cad-muted:#626a70;--cad-line:#cbd0d3;--cad-soft:#f1f3f4;--cad-yellow:#e9b92e;color:var(--cad-ink);background:#f0f1f1;min-height:calc(100vh - 64px);padding-bottom:48px}.generator-breadcrumbs{color:var(--cad-muted);gap:9px;padding:22px 0;font-size:11px;display:flex}.generator-breadcrumbs a:hover{color:var(--cad-ink);text-decoration:underline}.generator-heading{justify-content:space-between;align-items:end;gap:20px;margin:3px 0 18px;display:flex}.generator-eyebrow{letter-spacing:1.7px;color:#725810;font-size:9px;font-weight:600}.generator-heading h1{letter-spacing:-.8px;margin-top:5px;font-size:31px;line-height:1.2}.generator-heading>div>p:last-child{color:var(--cad-muted);margin-top:6px;font-size:13px;line-height:1.5}.generator-unit-note{border:1px solid var(--cad-line);color:var(--cad-muted);white-space:nowrap;background:#fff;padding:7px 9px;font-size:10px}.generator-layout{grid-template-columns:320px minmax(0,1fr);gap:14px;display:grid}.parameter-panel,.model-panel,.generator-results{border:1px solid var(--cad-line);background:#fff}.parameter-panel{align-self:start;padding:17px 17px 13px}.panel-heading{align-items:center;gap:10px;display:flex}.panel-index{background:var(--cad-yellow);place-items:center;width:23px;height:23px;font-size:9px;font-weight:700;display:grid}.panel-heading h2{letter-spacing:-.2px;font-size:15px;font-weight:600}.parameter-group{border:0;border-top:1px solid #e1e4e6;margin:15px 0 0;padding:13px 0 0}.parameter-group legend{padding:0 0 9px;font-size:11px;font-weight:600}.generator-fields{grid-template-columns:1fr 1fr;gap:10px 11px;display:grid}.generator-fields>label{color:var(--cad-muted);font-size:10px}.generator-fields>label>span{float:right;color:#777f85;font-weight:600}.field-with-unit{background:#fff;border:1px solid #bcc3c7;align-items:center;height:34px;margin-top:5px;display:flex}.field-with-unit:focus-within{outline:2px solid var(--cad-yellow);outline-offset:1px}.field-with-unit input{width:100%;min-width:0;height:100%;color:var(--cad-ink);font-variant-numeric:tabular-nums;background:0 0;border:0;outline:0;padding:0 8px;font-size:12px}.field-with-unit small{color:#646c71;padding:0 7px;font-size:9px}.parameter-help{color:var(--cad-muted);margin-top:9px;font-size:9px;line-height:1.5}.pattern-options{grid-template-columns:1fr 1fr;gap:7px;display:grid}.pattern-options label{border:1px solid var(--cad-line);cursor:pointer;align-items:flex-start;gap:7px;min-height:55px;padding:9px 8px;display:flex;position:relative}.pattern-options label:has(input:checked){box-shadow:inset 3px 0 0 var(--cad-yellow);background:#fff9e6;border-color:#87702e}.pattern-options input{accent-color:#b2870c;margin:2px 0 0}.pattern-options span{flex-direction:column;gap:4px;display:flex}.pattern-options strong{font-size:9px;font-weight:600;line-height:1.3}.pattern-options small{color:var(--cad-muted);font-size:8px;line-height:1.35}.material-field{margin-top:14px}.material-field>label{color:var(--cad-muted);margin-bottom:5px;font-size:10px;display:block}.material-field select{width:100%;height:36px;color:var(--cad-ink);background:#fff;border:1px solid #bcc3c7;border-radius:0;padding:0 9px;font-size:11px}.material-field select:focus-visible,.field-with-unit input:focus-visible{outline:2px solid var(--cad-yellow);outline-offset:1px}.generator-error{color:#a52b25;min-height:15px;margin-top:8px;font-size:10px;line-height:1.5}.generator-error:empty{display:none}.model-panel{flex-direction:column;min-width:0;padding:0 15px;display:flex}.model-toolbar{border-bottom:1px solid #e1e4e6;justify-content:space-between;align-items:center;gap:15px;min-height:55px;display:flex}.view-controls{align-items:center;gap:4px;display:flex}.view-controls button{color:#565e63;background:#f1f3f4;border:1px solid #0000;min-height:30px;padding:0 10px;font-size:9px}.view-controls button[aria-pressed=true]{color:#25282a;background:#f8edc8;border-color:#bf9b2e;font-weight:600}.view-controls button.reset-camera{background:#fff;border-color:#cbd0d3;margin-left:5px}.model-canvas,.top-view-wrap{background:#eef0f1;width:100%;height:clamp(350px,42vw,510px);position:relative;overflow:hidden}.model-canvas canvas{touch-action:none;width:100%;height:100%;display:block}.model-fallback{color:var(--cad-muted);text-align:center;place-items:center;padding:22px;font-size:12px;display:grid;position:absolute;inset:0}.model-fallback[hidden]{display:none}.top-view-wrap{background:#f4f5f5;justify-content:center;align-items:center;display:flex}.top-view-wrap svg{width:100%;height:100%;display:block}.top-view-wrap[hidden]{display:none}.sheet-outline{fill:#e3e6e7;stroke:#31383c;stroke-width:1.2px}.holes circle{fill:#f7f8f8;stroke:#5e666b;stroke-width:.8px}.dimension-line{stroke:#555d62;stroke-width:1px}.dimension-label,.view-label{fill:#3d454a;font:11px Arial,sans-serif}.view-label{fill:#656e73;font-size:10px}.model-footer{min-height:35px;color:var(--cad-muted);border-top:1px solid #e1e4e6;justify-content:space-between;align-items:center;gap:12px;font-size:9px;display:flex}.model-footer>span:first-child{align-items:center;gap:7px;display:flex}.status-dot{background:#b18b1e;border-radius:50%;width:7px;height:7px}.generator-results{grid-column:1/-1;padding:16px 18px 13px}.results-heading{justify-content:space-between;align-items:center;gap:15px;display:flex}.results-heading>p{color:var(--cad-muted);font-size:9px}.primary-results{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:13px;display:grid}.primary-result{background:#f3f4f4;border-left:3px solid #b9bec1;flex-direction:column;min-width:0;min-height:81px;padding:11px 12px;display:flex}.primary-result:first-child{border-left-color:var(--cad-yellow);background:#fff8e2}.primary-result>span{color:var(--cad-muted);font-size:9px}.primary-result strong{letter-spacing:-.4px;font-variant-numeric:tabular-nums;margin-top:5px;font-size:21px;font-weight:600}.primary-result small{color:var(--cad-muted);margin-top:3px;font-size:8px;line-height:1.4}.secondary-results{border-top:1px solid #e1e4e6;border-bottom:1px solid #e1e4e6;grid-template-columns:repeat(7,minmax(0,1fr));margin-top:12px;display:grid}.secondary-results>div{border-right:1px solid #e1e4e6;min-width:0;padding:10px 9px}.secondary-results>div:first-child{padding-left:0}.secondary-results>div:last-child{border:0}.secondary-results span,.secondary-results strong{display:block}.secondary-results span{color:var(--cad-muted);font-size:8px;line-height:1.35}.secondary-results strong{overflow-wrap:anywhere;font-variant-numeric:tabular-nums;margin-top:5px;font-size:10px;font-weight:600;line-height:1.35}.weight-note{color:var(--cad-muted);margin-top:9px;font-size:8px;line-height:1.5}@media (width>=1400px){.generator-layout{grid-template-columns:340px minmax(0,1fr);gap:16px}.model-canvas,.top-view-wrap,.pattern-image-wrap{height:520px}}@media (width<=900px){.generator-layout{grid-template-columns:285px minmax(0,1fr);gap:10px}.parameter-panel{padding:14px 12px}.model-panel{padding-inline:11px}.model-canvas,.top-view-wrap,.pattern-image-wrap{height:390px}.secondary-results{grid-template-columns:repeat(3,minmax(0,1fr))}.secondary-results>div:nth-child(3){border-right:0}.secondary-results>div:nth-child(n+4){border-top:1px solid #e1e4e6}.secondary-results>div:nth-child(4){padding-left:0}}@media (width<=680px){.perforated-tool{padding-bottom:28px}.perforated-tool>.container{width:calc(100% - 28px)}.generator-breadcrumbs{padding-block:16px;font-size:10px}.generator-heading{align-items:flex-start;margin:0 0 13px}.generator-heading h1{letter-spacing:-.6px;font-size:25px}.generator-heading>div>p:last-child{max-width:280px;font-size:11px}.generator-unit-note{display:none}.generator-layout{grid-template-columns:minmax(0,1fr);gap:10px}.parameter-panel{padding:14px}.parameter-group{margin-top:12px;padding-top:11px}.generator-fields{gap:10px 12px}.generator-fields>label{font-size:10px}.field-with-unit{height:38px}.field-with-unit input{font-size:14px}.pattern-options label{min-height:58px;padding:8px 7px}.pattern-options strong{font-size:9px}.material-field select{height:40px;font-size:13px}.model-panel{padding-inline:11px}.model-toolbar{flex-direction:column;justify-content:center;align-items:flex-start;gap:8px;min-height:52px;padding-block:9px}.view-controls{width:100%}.view-controls button{flex:1;min-height:34px;font-size:10px}.view-controls button.reset-camera{flex:none}.model-canvas,.top-view-wrap,.pattern-image-wrap{height:min(88vw,400px);min-height:270px}.model-footer{flex-direction:column;justify-content:center;align-items:flex-start;gap:5px;padding-block:8px;font-size:8px}.generator-results{grid-column:auto;padding:13px 12px}.results-heading{flex-direction:column;align-items:flex-start;gap:5px}.results-heading>p{font-size:8px}.primary-results{grid-template-columns:1fr 1fr;gap:7px}.primary-result{min-height:77px;padding:9px}.primary-result:last-child{grid-column:1/-1}.primary-result strong{font-size:19px}.secondary-results{grid-template-columns:1fr 1fr}.secondary-results>div{border-top:1px solid #e1e4e6;border-right:1px solid #e1e4e6!important;padding:9px 7px!important}.secondary-results>div:nth-child(odd){padding-left:0!important}.secondary-results>div:nth-child(2n){border-right:0!important}.secondary-results>div:first-child,.secondary-results>div:nth-child(2){border-top:0}.secondary-results span{font-size:8px}.secondary-results strong{font-size:10px}.weight-note{font-size:8px}}.preview-simplified{color:#8a6b13;margin:0;padding:8px 0;font-size:10px;line-height:1.45}.preview-simplified[hidden]{display:none}.generate-button{background:var(--cad-yellow);color:#25282a;cursor:pointer;border:1px solid #a88419;width:100%;min-height:38px;margin-top:12px;font-size:12px;font-weight:700}.generate-button:hover{background:#e9bd2d}.generate-button:focus-visible{outline-offset:2px;outline:2px solid #1b63c8}.generator-dirty{color:#8a6b13;margin:7px 0 0;font-size:10px;line-height:1.45}.generator-dirty[hidden]{display:none}.generate-button:disabled{cursor:wait;opacity:.68}.generation-progress{margin-top:10px}.generation-progress[hidden]{display:none}.generation-progress-labels{color:var(--cad-muted);justify-content:space-between;gap:10px;margin-bottom:5px;font-size:9px;line-height:1.4;display:flex}.generation-progress-labels span:last-child{font-variant-numeric:tabular-nums;color:var(--cad-ink);font-weight:600}.generation-progress progress{appearance:none;background:#e7e9ea;border:0;border-radius:0;width:100%;height:7px;display:block}.generation-progress progress::-webkit-progress-bar{background:#e7e9ea}.generation-progress progress::-webkit-progress-value{background:var(--cad-yellow);transition:width .18s}.generation-progress progress::-moz-progress-bar{background:var(--cad-yellow);transition:width .18s}.generate-image-button{color:#25282a;cursor:pointer;background:#fffaf0;border:1px solid #a88419;width:100%;min-height:38px;margin-top:8px;font-size:12px;font-weight:600}.generate-image-button:hover{background:#fff3cf}.generate-image-button:focus-visible{outline-offset:2px;outline:2px solid #1b63c8}.generate-image-button:disabled{cursor:wait;opacity:.68}@media (width<=680px){.generate-button,.generate-image-button{min-height:44px}}.mobile-generate-button,.mobile-generate-error{display:none}.generator-layout>.model-panel{grid-area:1/2}.generator-layout>.generator-results{grid-row:2}@media (width<=680px){.generator-layout>.generator-results,.generator-layout>.model-panel{grid-area:auto}#generate-button{display:none}.mobile-generate-button{margin:12px 0 4px;display:block}.mobile-generate-error:not(:empty){display:block}.model-panel .panel-index,.generator-results .panel-index{font-size:0}.model-panel .panel-index:after{content:"03";font-size:9px}.generator-results .panel-index:after{content:"02";font-size:9px}}.pattern-image-wrap{background:#eef0f1;width:100%;height:clamp(350px,42vw,510px);position:relative;overflow:hidden}.pattern-image-wrap canvas{width:100%;height:100%;display:block}.pattern-zoom-controls{flex-wrap:wrap;align-items:center;gap:5px;display:flex}.pattern-zoom-controls button{border:1px solid var(--cad-line);min-width:32px;min-height:32px;color:var(--cad-ink);cursor:pointer;background:#fff;padding:0 9px;font-size:11px}.pattern-zoom-controls button:hover{background:#fff8e2;border-color:#a88419}.pattern-zoom-controls button:disabled{opacity:.4;cursor:default}.pattern-zoom-controls button:focus-visible,.pattern-image-wrap canvas:focus-visible{outline-offset:2px;outline:2px solid #1b63c8}.pattern-zoom-controls output{text-align:center;font-variant-numeric:tabular-nums;min-width:48px;font-size:11px}.pattern-clarity{color:#725810;margin:0;padding:9px 0;font-size:11px;line-height:1.5}.pattern-clarity[hidden]{display:none}.pattern-image-wrap canvas.is-zoomed{cursor:grab;touch-action:none}.pattern-image-wrap canvas.is-dragging{cursor:grabbing}@media (width<=1100px){.model-toolbar{flex-wrap:wrap;gap:8px;padding-block:10px}.pattern-zoom-controls{padding-bottom:2px}}@media (width<=680px){.pattern-zoom-controls{width:100%}.pattern-zoom-controls button{min-height:40px}.pattern-zoom-controls button:nth-last-child(-n+2){flex:1}}.pattern-export-status{color:var(--cad-muted);margin:0;padding:9px 0;font-size:11px;line-height:1.5}.pattern-export-status[hidden]{display:none}#pattern-pdf{background:#fff8e2;border-color:#a88419}.drawing-layout{grid-template-columns:minmax(0,1fr) 200px;align-items:center;min-width:0;display:grid}.hole-detail-panel{border-left:1px solid #e1e4e6;flex-direction:column;justify-content:center;align-self:stretch;padding:16px 0 16px 10px;display:flex}.hole-detail-panel h3{margin:0 0 5px;font-size:12px;font-weight:600}.hole-detail-panel>p{color:var(--cad-muted);font-size:9px;line-height:1.5}#hole-detail-diagram{align-self:center;width:100%;max-width:280px;margin-top:10px}#hole-detail-diagram svg{width:100%;height:auto;display:block}#hole-detail-diagram text{fill:var(--cad-ink);stroke:none;text-anchor:middle;dominant-baseline:middle;font:11px Arial,sans-serif}.hole-detail-panel label{color:var(--cad-ink);justify-content:space-between;gap:10px;margin:8px 0;font-size:10px;display:flex}.hole-detail-panel input[type=range]{accent-color:#a88419;cursor:pointer;width:100%;min-height:24px}.hole-detail-panel input:focus-visible{outline-offset:2px;outline:2px solid #1b63c8}.hole-detail-panel .detail-scale-note{margin-top:5px;font-size:8px}@media (width<=1100px){.drawing-layout{grid-template-columns:minmax(0,1fr) 160px}}@media (width<=900px){.drawing-layout{grid-template-columns:minmax(0,1fr)}.hole-detail-panel{border-top:1px solid #e1e4e6;border-left:0;padding:14px 4px}.hole-detail-panel input[type=range],.hole-detail-panel label{align-self:center;width:100%;max-width:280px}#hole-detail-diagram{max-width:240px}.hole-detail-panel input[type=range]{min-height:36px}}.generator-fields>label[hidden],.material-field[hidden],.pattern-options>label[hidden]{display:none}.generator-fields>label>span#hole-size-label,.generator-fields>label>span#hole-pitch-label{float:none;color:var(--cad-muted);font-weight:400}.shape-selector{margin:0 0 12px}.secondary-results{grid-template-columns:repeat(4,minmax(0,1fr))}@media (width<=900px){.secondary-results{grid-template-columns:repeat(2,minmax(0,1fr))}}#hole-detail-diagram text{paint-order:stroke;stroke:#fff;stroke-width:3px;stroke-linejoin:round}@media (width<=680px){.pattern-zoom-controls{grid-template-columns:34px 48px 34px minmax(0,1fr) minmax(0,1fr);gap:4px;display:grid}.pattern-zoom-controls button{white-space:normal;min-height:44px;padding-inline:5px;line-height:1.25}.pattern-zoom-controls output{min-width:0}#pattern-pdf{grid-column:1/-1}}.pattern-options:has(#inline-pattern-option[hidden]){grid-template-columns:minmax(0,1fr)}