:root{--font-sans:system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-mono:ui-monospace, "SF Mono", Menlo, Consolas, monospace;--navbar-height:3.5rem;--content-width:90%;--radius:.5rem;--transition:.15s ease;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#f5f5f5;--surface:#fff;--text:#1b1d24;--text-muted:#5b6070;--border:#e3e4e8;--accent:#2b59d6;--accent-contrast:#fff;--hover:#1b1d240f;--focus-ring:#2b59d6}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#121317;--surface:#1a1c22;--text:#fff;--text-muted:#a1a5b3;--border:#2b2e38;--accent:#8fa8ff;--accent-contrast:#101218;--hover:#ebecf014;--focus-ring:#8fa8ff}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--bg);min-height:100dvh;color:var(--text);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;font-size:1rem;line-height:1.5}#root{min-height:inherit;flex-direction:column;display:flex}a{color:var(--accent)}:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.page{width:100%;max-width:var(--content-width);flex:1;margin-inline:auto;padding:2rem 1.25rem}.page:focus{outline:none}.skip-link{z-index:20;border-radius:var(--radius);background:var(--accent);color:var(--accent-contrast);padding:.5rem .875rem;text-decoration:none;position:absolute;top:-3rem;left:.75rem}.skip-link:focus{top:.75rem}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}.theme-toggle{border:1px solid var(--border);border-radius:var(--radius);width:2.25rem;height:2.25rem;color:var(--text);cursor:pointer;transition:background-color var(--transition);background:0 0;place-items:center;padding:0;display:grid}.theme-toggle:hover{background:var(--hover)}.theme-toggle svg{width:1.125rem;height:1.125rem}.navbar{z-index:10;background:var(--surface);border-bottom:1px solid var(--border);position:sticky;top:0}.navbar__inner{height:var(--navbar-height);max-width:var(--content-width);align-items:center;gap:1.5rem;margin-inline:auto;padding-inline:1.25rem;display:flex}.navbar__brand{color:var(--text);letter-spacing:-.01em;font-size:1.0625rem;font-weight:650;text-decoration:none}.navbar__nav ul{gap:.25rem;margin:0;padding:0;list-style:none;display:flex}.navbar__nav a{border-radius:var(--radius);color:var(--text-muted);transition:background-color var(--transition), color var(--transition);padding:.375rem .75rem;text-decoration:none;display:block}.navbar__nav a:hover{background:var(--hover);color:var(--text)}.navbar__actions{align-items:center;gap:.5rem;margin-inline-start:auto;display:flex}.image-container{width:100%;color:var(--text);border-radius:var(--radius);cursor:pointer;background:0 0;border:2px solid #0000;flex:1;justify-content:center;align-items:center;padding:.35rem;display:flex}.image-container:hover{background:var(--hover)}.image-container.is-selected{color:var(--accent);border-color:#0000}.theme-image{width:100%;max-width:100%;height:auto;transition:color var(--transition) ease;display:block}.theme-image svg{width:100%;height:auto;display:block}.number-field .MuiInputLabel-root{color:var(--text-muted);overflow:visible}.number-field .MuiInputLabel-root.Mui-focused{color:var(--accent)}.number-field .MuiInputLabel-root.Mui-disabled{color:var(--text-muted)}.number-field .MuiOutlinedInput-root{color:var(--text);padding-right:0}.number-field .MuiOutlinedInput-root .MuiOutlinedInput-notchedOutline,.number-field .MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline{border-color:var(--border)}.number-field .MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline{border-color:var(--focus-ring)}.number-field .MuiOutlinedInput-root .MuiInputBase-input{width:3ch;color:var(--text);text-align:center}.number-field .MuiOutlinedInput-root.Mui-disabled{color:var(--text-muted)}.number-field__adornment{max-height:unset;border-left:1px solid var(--border);flex-direction:column;align-self:stretch;margin-left:0;padding:0}.number-field__adornment button{min-width:auto;color:var(--text);background-color:var(--surface);border-radius:4px;flex:1;margin:0;padding:0}.number-field__adornment button:hover{background-color:var(--hover)}.number-field__icon--up{color:var(--text);transform:translateY(2px)}.number-field__icon--down{color:var(--text);transform:translateY(-2px)}@media (width<=600px){.number-field .number-field__adornment{display:none}.number-field{margin-block:auto!important}.number-field .MuiOutlinedInput-root .MuiInputBase-input{padding-inline:0;align-self:center;padding-top:0;padding-bottom:0}.number-field .MuiInputBase-input[type=number]{appearance:textfield}.number-field .MuiInputBase-input[type=number]::-webkit-inner-spin-button{appearance:none;margin:0}.number-field .MuiInputBase-input[type=number]::-webkit-outer-spin-button{appearance:none;margin:0}}.input-container{width:min(800px,100%);margin-inline:auto;container:input/inline-size}.input-options{width:100%}.input-option{flex:1;min-width:0}.selected-image{justify-content:center;align-items:center;width:100%;height:clamp(140px,45cqi,300px);padding:1rem;display:flex}.selected-image .theme-image{width:100%;height:auto;display:block}.input-width-control{align-self:stretch;align-items:center;height:auto}.dimension-label{white-space:nowrap;align-self:center}.input-slider .MuiSlider-thumb,.input-slider .MuiSlider-track{background-color:var(--accent)}.input-slider .MuiSlider-rail{background-color:var(--border)}.input-slider--vertical{margin-bottom:8px!important}.input-slider--horizontal{margin-top:auto!important;margin-bottom:auto!important}.input-details-row{width:100%}.input-heading{border-bottom:1px solid var(--border);padding-bottom:12px}.depth-input-field .MuiOutlinedInput-root,.depth-input-field .MuiInputAdornment-root,.depth-unit-toggle,.depth-unit-toggle .MuiToggleButton-root{height:100%}.depth-input-field .MuiInputAdornment-root{max-height:none}.depth-input-field,.input-field{width:50%;color:var(--text)}.depth-input-field .MuiOutlinedInput-root{color:var(--text);padding-right:0}.depth-input-field .MuiOutlinedInput-root fieldset{border-color:var(--border)}.depth-input-field .MuiOutlinedInput-root:hover fieldset,.depth-input-field .MuiOutlinedInput-root.Mui-focused fieldset{border-color:var(--accent)}.depth-input-field .MuiOutlinedInput-root .MuiInputBase-input,.depth-input-field .MuiInputLabel-root,.input-field .MuiSelect-icon,.depth-input-field .MuiInputLabel-root.Mui-focused{color:var(--text)}.depth-unit-toggle .MuiToggleButton-root{border-color:var(--border);color:var(--text)}.depth-unit-toggle .MuiToggleButton-root:hover{background-color:var(--hover)}.depth-unit-toggle .MuiToggleButton-root.Mui-selected,.depth-unit-toggle .MuiToggleButton-root.Mui-selected:hover{background-color:var(--accent);color:var(--accent-contrast)}.input-field:hover,.input-field:focus,.input-field .MuiOutlinedInput-root{color:var(--text)}.input-field .MuiOutlinedInput-root fieldset{border-color:var(--border)}.input-field .MuiOutlinedInput-root:hover fieldset,.input-field .MuiOutlinedInput-root.Mui-focused fieldset{border-color:var(--accent)}.input-field .MuiOutlinedInput-root .MuiInputBase-input,.input-field .MuiOutlinedInput-root .MuiSelect-select,.input-field .MuiSelect-icon,.input-field .MuiInputLabel-root,.input-field .MuiInputLabel-root.Mui-focused{color:var(--text)}.input-menu.MuiPaper-root{background-color:var(--surface);color:var(--text)}.input-menu .MuiMenuItem-root{color:var(--text)}.input-menu .MuiMenuItem-root:hover{background-color:var(--hover)}.input-menu .MuiMenuItem-root.Mui-selected,.input-menu .MuiMenuItem-root.Mui-selected:hover{background-color:var(--accent);color:var(--accent-contrast)}:root[data-theme=dark] .input-menu.MuiPaper-root{background-color:var(--surface);color:var(--text)}:root[data-theme=dark] .input-menu .MuiMenuItem-root{color:var(--text)}.output-container{width:min(800px,100%);margin-inline:auto;container:output/inline-size}.output-heading{border-bottom:1px solid var(--border);padding-bottom:12px}.output-row{background-color:var(--surface);border:1px solid var(--border);border-radius:var(--radius);transition:background-color var(--transition);padding:1rem}.output-row:hover{background-color:var(--hover)}.output-label{color:var(--text-muted);font-size:.875rem;font-weight:500}.output-value{color:var(--accent);font-size:1.25rem;font-weight:600}.products-heading{border-bottom:1px solid var(--border);padding-bottom:12px}