.su-page{--su-ink:#222c29;--su-green:#31563e;--su-line:#cdcfc5;--su-paper:#faf9f5;--su-muted:#656b61;color:var(--su-ink)}
.su-page [hidden]{display:none!important}.su-workspace{display:grid;grid-template-columns:minmax(300px,365px) minmax(0,1fr);gap:44px;max-width:1432px;margin:0 clamp(24px,3.6vw,64px) 100px}.su-controls{background:var(--su-paper);border:1px solid var(--su-line);min-width:0}.su-step{padding:26px;border-bottom:1px solid var(--su-line)}.su-step:last-child{border:0}.su-page .su-eyebrow{font:10px/1.5 'IBM Plex Mono',monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--su-muted);margin:0 0 9px}.su-page h2{font-size:22px;font-weight:400;line-height:1.25;letter-spacing:-.03em;margin:0 0 22px}.su-page button,.su-page select,.su-page input{font:inherit;max-width:100%}.su-page button{cursor:pointer}.su-page button:disabled{opacity:.45;cursor:not-allowed}.su-page :is(button,input,select,summary,a):focus-visible{outline:2px solid #31563e;outline-offset:4px}.su-label,.su-fields label{display:block;font-size:12px;line-height:1.5;color:#444e45;margin-bottom:7px}.su-page select,.su-page input[type=number]{width:100%;background:transparent;color:var(--su-ink);border:1px solid #adb4a8;border-radius:0;min-height:44px;padding:10px;font-size:13px}.su-page select{margin-bottom:18px}.su-fields{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;margin:12px 0}.su-fields input,.su-fields select{margin:6px 0 0}.su-page .su-help{font-size:12px;line-height:1.6;color:var(--su-muted);margin:12px 0}.su-drop{border:1px dashed #909d8e;background:#f0f2ea;position:relative}.su-drop.dragging{background:#e0ebdb;border-color:#31563e}.su-drop label{display:flex;align-items:center;text-align:center;flex-direction:column;gap:10px;padding:22px 14px 14px;cursor:pointer}.su-drop strong{font-size:15px;font-weight:500}.su-drop label>span:last-child{font-size:11px;line-height:1.5;color:var(--su-muted)}.su-upload-icon{font-size:25px;border:1px solid #bbc3b5;width:42px;height:42px;line-height:40px;border-radius:50%}.su-drop input[type=file]{width:100%;padding:0 12px 15px;font-size:11px}.su-drop input::file-selector-button{border:0;background:#dce4d8;padding:6px;margin-right:5px;cursor:pointer}.su-actions{display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px;margin:16px 0 0}.su-page .su-link{padding:8px 0;background:none;border:0;border-bottom:1px solid #98a38f;font-size:12px;color:var(--su-green)}.su-inset{padding:16px 0 0}.su-primary,.su-secondary{display:inline-flex;justify-content:center;align-items:center;gap:16px;padding:12px 16px;min-height:46px;font-size:12px!important;font-weight:500!important;line-height:1.3}.su-primary{width:100%;background:var(--su-green);color:#fff;border:1px solid var(--su-green);margin-top:8px}.su-primary span{margin-left:auto}.su-primary:hover{background:#23422f}.su-secondary{background:transparent;color:var(--su-ink);border:1px solid #aeb6a7}.su-secondary:hover{background:#e6e9df}#su-cancel{width:100%;margin-top:10px}.su-status{font-size:12px;line-height:1.6;margin:14px 0 0;color:#3d5e43}.su-error,.su-warning{font-size:12px;line-height:1.6;padding:12px;background:#f6e7df;color:#803820;border-left:3px solid #aa5735;margin:14px 0 0;overflow-wrap:anywhere}.su-part-card{display:grid;grid-template-columns:82px minmax(0,1fr);gap:14px;padding-top:20px;margin-top:22px;border-top:1px solid var(--su-line);align-items:center}.su-part-card svg{width:82px;height:82px;background:#edf0e8}.su-part-card strong{display:block;font-size:12px;overflow-wrap:anywhere}.su-part-card p:not(.su-eyebrow){font-size:11px;margin:5px 0;color:var(--su-muted);line-height:1.4}.su-output{min-width:0}.su-preview-heading{display:flex;justify-content:space-between;align-items:start;gap:16px;border-top:1px solid #828c7d;padding:24px 0 4px}.su-preview-heading h2{font-size:26px;max-width:380px}.su-badge{font:10px/1.5 'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:.04em;padding:7px 10px;border:1px solid #aeb6a7;white-space:nowrap}.su-canvas-wrap{position:relative;display:flex;align-items:center;justify-content:center;min-height:390px;aspect-ratio:1.7;background:#e2e6dc;background-image:linear-gradient(#aab8a333 1px,transparent 1px),linear-gradient(90deg,#aab8a333 1px,transparent 1px);background-size:24px 24px;border:1px solid var(--su-line);padding:22px}#su-sheet-preview{display:block;width:100%;height:100%;max-height:550px}#su-empty{text-align:center;max-width:310px}.su-empty-grid{display:block;font-size:50px;font-weight:300;color:#819276;margin:0 0 20px}#su-empty h3{font-size:26px;font-weight:400;margin:0 0 12px}#su-empty p{font-size:13px;line-height:1.7;color:var(--su-muted);margin:0}.su-preview-caption{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:10px;color:var(--su-muted);padding:12px 0 24px;line-height:1.6}.su-preview-caption i{display:inline-block;width:8px;height:8px;background:#6c8d5f}.su-preview-caption b{color:#31563e;font-size:14px}.su-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--su-line);border:1px solid var(--su-line)}.su-metric{padding:23px;background:#faf9f5;display:flex;flex-direction:column;gap:14px}.su-metric>span{font-size:11px;color:#626b5e}.su-metric strong{font-size:38px;line-height:1.1;font-weight:400;letter-spacing:-.04em}.su-metric small{font-size:10px;line-height:1.5;color:#626b5e}.su-featured{background:#31563e;color:#fff}.su-featured :is(span,small){color:#d8e1d2}.su-explanation{padding:18px 0}.su-explanation p{font-size:14px;line-height:1.7;margin:8px 0}.su-downloads{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:28px}.su-method{border-top:1px solid #b7bfb0;border-bottom:1px solid #b7bfb0}.su-method summary{cursor:pointer;padding:19px 0;font-size:13px}.su-method>div{padding-bottom:15px}.su-method p{font-size:12px;line-height:1.75;color:var(--su-muted);margin:0 0 12px}.su-method strong{font-weight:500;color:#344733}.su-method a{color:#31563e;display:inline-block;margin-right:18px;margin-top:8px}.su-noscript{margin:30px 5vw}.su-page .size-hero-title .size-dek{font-size:20px}
@media(min-width:1560px){.su-workspace{margin-inline:auto}}@media(max-width:1100px){.su-workspace{grid-template-columns:minmax(270px,320px) minmax(0,1fr);gap:25px}.su-step{padding:20px}.su-preview-heading{flex-direction:column;padding-bottom:20px;gap:0}.su-canvas-wrap{min-height:290px}.su-metric{padding:17px}.su-metric strong{font-size:32px}}@media(max-width:800px){.su-workspace{grid-template-columns:1fr;gap:32px}.su-output{grid-row:2}.su-canvas-wrap{min-height:260px}.su-preview-heading{flex-direction:row;gap:12px}.su-preview-heading h2{font-size:23px}.su-badge{white-space:normal;max-width:130px}}@media(max-width:420px){.su-workspace{margin-inline:20px}.su-canvas-wrap{padding:12px;min-height:215px}.su-metric{padding:16px 12px}.su-metric strong{font-size:30px}.su-preview-heading{flex-direction:column}.su-badge{max-width:none}.su-downloads>*{width:100%}}
#su-view-title{scroll-margin-top:110px}
.su-view-controls{display:flex;align-items:flex-end;gap:18px;flex-wrap:wrap;padding:0 0 4px}.su-mode{border:0;padding:0;margin:0;min-width:0;flex:1 1 270px}.su-mode legend,.su-quantity-label{font-size:12px;line-height:1.5;color:#444e45}.su-mode legend{margin-bottom:7px}.su-mode>div{display:flex;border:1px solid #aeb6a7}.su-mode button{flex:1;min-height:44px;border:0;background:transparent;font-size:12px;padding:9px 12px;color:#31563e}.su-mode button[aria-pressed=true]{background:#31563e;color:#fff}.su-quantity-label{display:block;flex:0 0 145px}.su-quantity-label input{display:block;margin-top:7px}.su-sheet-nav{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 0 16px}.su-sheet-nav label{display:flex;align-items:center;gap:8px;font-size:12px}.su-sheet-nav input[type=number]{width:78px}.su-sheet-nav>span{font-size:12px;color:#626b5e}.su-sheet-nav .su-secondary{min-width:44px;padding:10px}.su-sheet-nav .su-link{margin-left:auto}.su-view-controls+.su-help{margin-bottom:20px}@media(max-width:500px){.su-quantity-label{flex:1 1 100%}.su-sheet-nav{gap:8px}.su-sheet-nav input[type=number]{width:64px}.su-mode button{padding-inline:8px}}
.su-page .su-featured strong{color:#fff;font-weight:400}
.su-canvas-wrap{min-width:0;width:100%}@media(max-width:800px){.su-canvas-wrap{aspect-ratio:auto;height:clamp(215px,60vw,420px)}}
