:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}:root{--font-family-sans: "Nunito Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;--font-family-mono: "Roboto Mono", Menlo, Monaco, Consolas, "Courier New", monospace;--color-bg-app-light: #F8F9FA;--color-bg-surface-light: #FFFFFF;--color-bg-surface-raised-light: #F1F3F5;--color-text-body-light: #212529;--color-text-muted-light: #6C757D;--color-text-heading-light: #007BFF;--color-text-on-accent-light: #FFFFFF;--color-border-primary-light: #CED4DA;--color-border-secondary-light: #DEE2E6;--color-accent-light: #007BFF;--color-accent-hover-light: #0056B3;--color-accent-disabled-light: #A0CFFF;--color-highlight-light: #FFC107;--color-error-light: #DC3545;--color-error-bg-light: #F8D7DA;--color-success-light: #28A745;--color-success-bg-light: #D4EDDA;--color-warning-light: #FD7E14;--color-warning-bg-light: #FFF3CD;--shadow-sm-light: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md-light: 0 3px 5px -1px rgba(0, 0, 0, .06), 0 2px 3px -1px rgba(0, 0, 0, .04);--shadow-lg-light: 0 8px 12px -3px rgba(0, 0, 0, .07), 0 3px 5px -2px rgba(0, 0, 0, .03);--outline-focus-light: 2px solid var(--color-accent-light);--color-bg-app: var(--color-bg-app-light);--color-bg-surface: var(--color-bg-surface-light);--color-bg-surface-raised: var(--color-bg-surface-raised-light);--color-text-body: var(--color-text-body-light);--color-text-muted: var(--color-text-muted-light);--color-text-heading: var(--color-text-heading-light);--color-text-on-accent: var(--color-text-on-accent-light);--color-border-primary: var(--color-border-primary-light);--color-border-secondary: var(--color-border-secondary-light);--color-accent: var(--color-accent-light);--color-accent-hover: var(--color-accent-hover-light);--color-accent-disabled: var(--color-accent-disabled-light);--color-highlight: var(--color-highlight-light);--color-error: var(--color-error-light);--color-error-bg: var(--color-error-bg-light);--color-success: var(--color-success-light);--color-success-bg: var(--color-success-bg-light);--color-warning: var(--color-warning-light);--color-warning-bg: var(--color-warning-bg-light);--shadow-sm: var(--shadow-sm-light);--shadow-md: var(--shadow-md-light);--shadow-lg: var(--shadow-lg-light);--outline-focus: var(--outline-focus-light);--color-scrollbar-bg: #E9ECEF;--color-scrollbar-thumb: #ADB5BD;--color-scrollbar-thumb-hover: #6C757D}[data-theme=dark]{--color-bg-app-dark: #2C3E50;--color-bg-surface-dark: #3B5368;--color-bg-surface-raised-dark: #4A657E;--color-text-body-dark: #EAEAEA;--color-text-muted-dark: #B0BEC5;--color-text-heading-dark: #A9CCE3;--color-text-on-accent-dark: #2C3E50;--color-border-primary-dark: #4A657E;--color-border-secondary-dark: #5D7C98;--color-accent-dark: #5DADE2;--color-accent-hover-dark: #85C1E9;--color-accent-disabled-dark: #4A657E;--color-highlight-dark: #F4D03F;--color-error-dark: #EC7063;--color-error-bg-dark: #5D292B;--color-success-dark: #7DCEA0;--color-success-bg-dark: #2A5D3F;--color-warning-dark: #F5B041;--color-warning-bg-dark: #6E4F27;--shadow-sm-dark: 0 1px 2px 0 rgba(0, 0, 0, .2);--shadow-md-dark: 0 4px 6px -1px rgba(0, 0, 0, .25), 0 2px 4px -1px rgba(0, 0, 0, .2);--shadow-lg-dark: 0 10px 15px -3px rgba(0, 0, 0, .25), 0 4px 6px -2px rgba(0, 0, 0, .2);--outline-focus-dark: 2px solid var(--color-accent-dark);--color-bg-app: var(--color-bg-app-dark);--color-bg-surface: var(--color-bg-surface-dark);--color-bg-surface-raised: var(--color-bg-surface-raised-dark);--color-text-body: var(--color-text-body-dark);--color-text-muted: var(--color-text-muted-dark);--color-text-heading: var(--color-text-heading-dark);--color-text-on-accent: var(--color-text-on-accent-dark);--color-border-primary: var(--color-border-secondary-dark);--color-border-secondary: var(--color-border-secondary-dark);--color-accent: var(--color-accent-dark);--color-accent-hover: var(--color-accent-hover-dark);--color-accent-disabled: var(--color-accent-disabled-dark);--color-highlight: var(--color-highlight-dark);--color-error: var(--color-error-dark);--color-error-bg: var(--color-error-bg-dark);--color-success: var(--color-success-dark);--color-success-bg: var(--color-success-bg-dark);--color-warning: var(--color-warning-dark);--color-warning-bg: var(--color-warning-bg-dark);--shadow-sm: var(--shadow-sm-dark);--shadow-md: var(--shadow-md-dark);--shadow-lg: var(--shadow-lg-dark);--outline-focus: var(--outline-focus-dark);--color-scrollbar-bg: var(--color-bg-surface-dark);--color-scrollbar-thumb: var(--color-border-secondary-dark);--color-scrollbar-thumb-hover: var(--color-text-muted-dark)}html,body,#root{height:100%;margin:0;padding:0;font-family:var(--font-family-sans);box-sizing:border-box;background-color:var(--color-bg-app);color:var(--color-text-body);transition:background-color .3s ease,color .3s ease}*,*:before,*:after{box-sizing:inherit}.geometry-app{display:flex;flex-direction:column;min-height:100vh;width:100vw;background-color:var(--color-bg-app);transition:background-color .3s ease}.geometry-header{display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:.75rem 1.5rem;background:var(--color-bg-surface);box-shadow:var(--shadow-md);z-index:10;flex-shrink:0;border-bottom:1px solid var(--color-border-primary)}.header-controls{display:flex;flex-direction:row;align-items:center;gap:.75rem}.geometry-title{font-size:clamp(1.4rem,3.5vw,1.6rem);font-weight:700;margin:0;color:var(--color-text-heading);text-align:left}.language-selector-container{position:relative;display:inline-flex;align-items:center}.language-selector-container label{font-size:.8rem;color:var(--color-text-muted);margin-right:.5rem}#language-selector{appearance:none;-webkit-appearance:none;-moz-appearance:none;padding:.4rem 2rem .4rem .8rem;font-size:.8rem;line-height:normal;background-color:var(--color-bg-surface-raised);color:var(--color-text-body);border:1px solid var(--color-border-secondary);border-radius:4px;cursor:pointer;min-width:100px;background-image:none}.language-selector-container:after{content:"▼";font-size:.7rem;color:var(--color-text-muted);position:absolute;right:.75rem;top:50%;transform:translateY(-50%);pointer-events:none;transition:color .2s ease}#language-selector:focus,.theme-toggle-button:focus{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 2px var(--color-accent-disabled)}.theme-toggle-button-container{display:flex;align-items:center}.theme-toggle-button{background-color:var(--color-bg-surface-raised);border:1px solid var(--color-border-secondary);color:var(--color-text-body);padding:.35rem .55rem;font-size:1.1rem;line-height:1;border-radius:4px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:background-color .2s ease,border-color .2s ease,color .2s ease}.theme-toggle-button:hover{background-color:var(--color-bg-surface);border-color:var(--color-accent)}.calculator-container{max-width:1300px;margin:1rem auto;background:var(--color-bg-surface);border-radius:8px;box-shadow:var(--shadow-lg);border:1px solid var(--color-border-primary);display:flex;flex-direction:column;overflow-x:auto;overflow-y:hidden}.shape-tabs-container{border-bottom:1px solid var(--color-border-primary);background-color:var(--color-bg-surface);flex-shrink:0}.shape-category-label{padding:.6rem 1.25rem;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-muted);background-color:var(--color-bg-surface-raised);border-bottom:1px solid var(--color-border-secondary)}.shape-tabs-container .shape-category-label:first-of-type{border-top-left-radius:7px;border-top-right-radius:7px}.shape-tabs{display:flex;flex-direction:row;flex-wrap:wrap;gap:0px;padding:.4rem 1rem}.shape-tab{display:flex;align-items:center;gap:.4rem;padding:.6rem .8rem;background:none;border:none;border-bottom:2px solid transparent;font-size:.9rem;font-weight:400;color:var(--color-text-muted);cursor:pointer;transition:color .2s ease,border-color .2s ease,background-color .2s ease;white-space:nowrap;margin-right:.3rem;border-radius:4px 4px 0 0}.shape-tab-icon{display:inline-flex;align-items:center;justify-content:center;width:1.1em;height:1.1em;color:currentColor}.shape-tab-icon svg{width:100%;height:100%;stroke-width:1.2px}.shape-tab:hover{color:var(--color-text-body);background-color:var(--color-bg-surface-raised)}.shape-tab.active{color:var(--color-accent);border-bottom-color:var(--color-accent);font-weight:600}.shape-tab.active .shape-tab-icon{color:var(--color-accent)}.shape-tab:focus-visible{outline:none;box-shadow:0 0 0 2px var(--color-accent-disabled)}.calculator-content{display:grid;grid-template-columns:320px 1fr 260px;flex-grow:1;min-height:0}.dimensions-panel,.calculator-sidebar{padding:1.25rem;overflow-y:auto;background-color:var(--color-bg-surface);flex-shrink:0}.dimensions-panel{border-right:1px solid var(--color-border-primary)}.calculator-sidebar{border-left:1px solid var(--color-border-primary);display:block}.main-visualization-and-calculations-panel{padding:1.25rem;display:flex;flex-direction:column;min-width:0;min-height:0;background-color:var(--color-bg-app);overflow-y:auto}.visualization-panel{display:flex;flex-direction:column;flex-grow:1;min-height:0}.shape-display{flex:1;min-height:350px;background-color:var(--color-bg-app);border:1px solid var(--color-border-primary);border-radius:6px;overflow:hidden;position:relative}.calculations-panel{background-color:var(--color-bg-surface);border:1px solid var(--color-border-primary);border-radius:6px;padding:1.25rem;margin-top:1.25rem;flex-shrink:0}.panel-title{font-size:1.1rem;font-weight:600;margin-top:0;margin-bottom:1rem;color:var(--color-text-heading);padding-bottom:.4rem;border-bottom:1px solid var(--color-border-secondary)}.dimension-input-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:.6rem;padding:.25rem 0}.dimension-label{flex-shrink:0;flex-basis:120px;font-size:.85rem;font-weight:400;color:var(--color-text-body);margin-right:.75rem}.dimension-input-with-unit{display:grid;flex-grow:1;grid-template-columns:1fr auto auto;align-items:center;gap:.25rem}.dimension-input{padding:.5rem .6rem;border:1px solid var(--color-border-primary);background-color:var(--color-bg-surface);color:var(--color-text-body);border-radius:4px;font-size:.85rem;font-family:var(--font-family-mono);width:100%;transition:border-color .2s,box-shadow .2s}.dimension-input:focus{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 1.5px var(--color-accent-disabled)}.dimension-input::placeholder{color:var(--color-text-muted);opacity:.6}.clear-input-button{background:none;border:none;color:var(--color-text-muted);cursor:pointer;font-size:1.2rem;line-height:1;padding:0 .15rem;transition:color .2s}.clear-input-button:hover{color:var(--color-error)}.unit-label{font-size:.75rem;color:var(--color-text-muted);margin-left:.4rem;white-space:nowrap}.unit-settings-section .unit-selector-container:first-child{padding-top:0;border-top:none}.unit-selector-container{display:flex;align-items:center;margin-top:.8rem;padding-top:.8rem;border-top:1px solid var(--color-border-secondary);justify-content:space-between}.unit-selector{width:auto;min-width:100px;padding:.5rem .6rem;border:1px solid var(--color-border-primary);background-color:var(--color-bg-surface);color:var(--color-text-body);border-radius:4px;font-size:.8rem}.calculation-row{display:flex;justify-content:space-between;padding:.5rem 0;border-bottom:1px solid var(--color-border-secondary);font-size:.85rem}.calculation-row:last-child{border-bottom:none}.calculation-label{font-weight:400;color:var(--color-text-body)}.calculation-label small{font-weight:400;font-size:.9em;color:var(--color-text-muted);margin-left:4px;font-family:var(--font-family-mono)}.calculation-value{font-weight:400;color:var(--color-text-body);font-family:var(--font-family-mono)}.calculation-output-unit-selector{margin-bottom:.8rem}.clear-all-button{background-color:var(--color-bg-surface-raised);color:var(--color-text-muted);padding:.5rem .9rem;border:1px solid var(--color-border-primary);border-radius:5px;cursor:pointer;font-weight:600;font-size:.8rem;margin-top:1.25rem;width:auto;display:inline-block;transition:background-color .2s ease,border-color .2s ease,color .2s ease}.clear-all-button:hover{background-color:var(--color-error-bg);color:var(--color-error);border-color:var(--color-error)}.shape-status-message{padding:.6rem .8rem;margin-bottom:.8rem;border-radius:4px;font-size:.8rem;text-align:left;min-height:1.5em;border-width:1px;border-style:solid}.shape-status-message.shape-status-error{color:var(--color-error);background-color:var(--color-error-bg);border-color:var(--color-error)}.shape-status-message.shape-status-info{color:var(--color-text-body);background-color:var(--color-bg-surface-raised);border-color:var(--color-border-primary)}.shape-status-message.shape-status-warning{color:var(--color-warning);background-color:var(--color-warning-bg);border-color:var(--color-warning)}.panel-section{margin-bottom:1.25rem}.panel-section:last-of-type{margin-bottom:0}.panel-section-separator{border:none;border-top:1px solid var(--color-border-secondary);margin-top:.8rem;margin-bottom:1.25rem}.advanced-options-container{margin-top:1rem;padding-top:1rem;border-top:1px dashed var(--color-border-secondary)}.advanced-options-toggle{background-color:transparent;border:none;color:var(--color-accent);cursor:pointer;font-size:.85rem;font-weight:600;padding:.4rem 0;width:100%;text-align:left;display:flex;justify-content:space-between;align-items:center}.advanced-options-toggle:hover{color:var(--color-accent-hover)}.advanced-options-content{padding-top:.4rem;animation:fadeIn .3s ease-out}.advanced-options-content hr{border:none;border-top:1px solid var(--color-border-secondary);margin:8px 0 12px}.simple-calculator{display:flex;flex-direction:column}.calculator-display,.calculator-result{width:100%;padding:.5rem .6rem;margin-bottom:.4rem;text-align:right;font-size:1.1rem;font-family:var(--font-family-mono);border:1px solid var(--color-border-primary);border-radius:4px;background-color:var(--color-bg-app);color:var(--color-text-body)}.calculator-result{font-size:.9rem;background-color:var(--color-bg-surface-raised);min-height:1.5em}.calculator-buttons{display:grid;grid-template-columns:repeat(4,1fr);gap:.4rem}.calculator-button{padding:.6rem .4rem;font-size:.85rem;font-weight:600;border:1px solid var(--color-border-primary);border-radius:4px;background-color:var(--color-bg-surface-raised);color:var(--color-text-body);cursor:pointer;transition:background-color .2s,border-color .2s,color .2s}.calculator-button:hover{border-color:var(--color-text-muted)}.calculator-button.equals{background-color:var(--color-accent);color:var(--color-text-on-accent);grid-column:span 2;border-color:var(--color-accent)}.calculator-button.equals:hover{background-color:var(--color-accent-hover);border-color:var(--color-accent-hover)}.calculator-button.operator{background-color:var(--color-bg-surface);color:var(--color-accent)}.calculator-button.operator:hover{background-color:var(--color-bg-surface-raised)}.calculator-button.control{background-color:var(--color-error-bg);color:var(--color-error);border-color:var(--color-error)}.calculator-button.control:hover{background-color:var(--color-error);color:var(--color-text-on-accent)}.calculator-container::-webkit-scrollbar,.dimensions-panel::-webkit-scrollbar,.calculator-sidebar::-webkit-scrollbar,.main-visualization-and-calculations-panel::-webkit-scrollbar,.shape-tabs::-webkit-scrollbar{width:8px;height:6px}.calculator-container::-webkit-scrollbar-track,.dimensions-panel::-webkit-scrollbar-track,.calculator-sidebar::-webkit-scrollbar-track,.main-visualization-and-calculations-panel::-webkit-scrollbar-track,.shape-tabs::-webkit-scrollbar-track{background:var(--color-bg-surface)}.calculator-container::-webkit-scrollbar-thumb,.dimensions-panel::-webkit-scrollbar-thumb,.calculator-sidebar::-webkit-scrollbar-thumb,.main-visualization-and-calculations-panel::-webkit-scrollbar-thumb,.shape-tabs::-webkit-scrollbar-thumb{background:var(--color-scrollbar-thumb);border-radius:4px;border:1.5px solid var(--color-bg-surface)}.calculator-container::-webkit-scrollbar-thumb:hover,.dimensions-panel::-webkit-scrollbar-thumb:hover,.calculator-sidebar::-webkit-scrollbar-thumb:hover,.main-visualization-and-calculations-panel::-webkit-scrollbar-thumb:hover,.shape-tabs::-webkit-scrollbar-thumb:hover{background:var(--color-scrollbar-thumb-hover)}@keyframes fadeIn{0%{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 992px){.calculator-content{display:flex;flex-direction:column;grid-template-columns:none}.calculator-container{overflow-y:auto}.dimensions-panel,.main-visualization-and-calculations-panel,.calculator-sidebar{overflow-y:visible;flex-shrink:0}.dimensions-panel{order:1;border-right:none;border-bottom:1px solid var(--color-border-primary)}.main-visualization-and-calculations-panel{order:2;padding-top:.8rem;display:flex;flex-direction:column}.calculations-panel{order:1;margin-top:0;margin-bottom:1.25rem}.visualization-panel{order:2}.calculator-sidebar{order:3;display:block;border-left:none;border-top:1px solid var(--color-border-primary);padding:1.25rem}.simple-calculator{max-width:320px;margin-left:auto;margin-right:auto}.shape-tabs{padding:.2rem .75rem}.shape-tab{padding:.5rem .8rem;font-size:.85rem;gap:.4rem}.shape-tab-icon{width:1em;height:1em}}@media (max-width: 768px){.geometry-header{padding:.6rem 1rem;gap:.5rem}.geometry-title{font-size:1.1rem;flex-shrink:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.header-controls{gap:.5rem;flex-shrink:0}#language-selector{min-width:90px;padding:.35rem 1.8rem .35rem .6rem;font-size:.75rem}.language-selector-container:after{right:.5rem;font-size:.65rem}.theme-toggle-button{padding:.3rem .5rem;font-size:1rem}.calculator-container{margin:.8rem;border-radius:6px}.shape-tabs-container .shape-category-label{padding:.4rem 1rem}.shape-tabs{flex-wrap:nowrap;overflow-x:auto;padding-bottom:.4rem;scrollbar-width:thin;scrollbar-color:var(--color-scrollbar-thumb) var(--color-bg-surface-raised)}.shape-tabs::-webkit-scrollbar{height:6px}.shape-tabs::-webkit-scrollbar-thumb{background-color:var(--color-scrollbar-thumb);border-radius:3px}.shape-tabs::-webkit-scrollbar-track{background-color:var(--color-bg-surface-raised)}}@media (max-width: 480px){.geometry-header{padding:.5rem .75rem;gap:.4rem}.geometry-title{font-size:1rem}.header-controls{gap:.4rem}#language-selector{min-width:80px;padding:.3rem 1.6rem .3rem .5rem;font-size:.7rem}.language-selector-container:after{right:.4rem;font-size:.6rem}.theme-toggle-button{padding:.25rem .4rem;font-size:.9rem}.calculator-container{margin:.4rem;border-radius:4px}.dimensions-panel,.main-visualization-and-calculations-panel,.calculator-sidebar,.calculations-panel{padding:.8rem}.shape-tab{padding:.4rem .5rem;font-size:.75rem;margin-right:.15rem;gap:.25rem}.shape-tab-icon{width:.9em;height:.9em}.panel-title{font-size:1rem;margin-bottom:.8rem}.dimension-input-row{flex-direction:column;align-items:flex-start;margin-bottom:.5rem}.dimension-label{margin-bottom:.25rem;flex-basis:auto}.dimension-input-with-unit{width:100%}.unit-selector-container{flex-direction:column;align-items:flex-start;gap:.4rem}.unit-selector{width:100%;max-width:none}.shape-display{min-height:250px}.calculations-panel{margin-top:.8rem}.calculation-row,.clear-all-button,.advanced-options-toggle{font-size:.8rem}.simple-calculator{max-width:none}}:root{--color-highlight-bg-light: #fff3cd;--color-highlight-text-light: #856404}[data-theme=dark]{--color-highlight-bg-dark: #695d37;--color-highlight-text-dark: #fff5c0}:root{--color-highlight-bg: var(--color-highlight-bg-light);--color-highlight-text: var(--color-highlight-text-light)}[data-theme=dark]{--color-highlight-bg: var(--color-highlight-bg-dark);--color-highlight-text: var(--color-highlight-text-dark)}.focused-item{background-color:var(--color-highlight-bg)!important;box-shadow:0 0 0 2px var(--color-accent);transition:background-color .3s ease-out,box-shadow .3s ease-out;border-radius:4px}[data-metric-focus]:focus-visible,.dimension-input-with-unit:has(input.focused-item):focus-visible,input.focused-item:focus-visible{outline:2px solid var(--color-accent)!important;outline-offset:1px}.shape-information-section-wrapper{max-width:1300px;margin:2rem auto;padding:0 2rem;background-color:var(--color-bg-surface);border-radius:8px;box-shadow:var(--shadow-lg);border:1px solid var(--color-border-primary)}.shape-info-container{color:var(--color-text-body)}.shape-info-title{color:var(--color-text-heading);font-size:1.8rem;margin-top:0;border-bottom:2px solid var(--color-accent);padding-bottom:2rem;margin-bottom:2rem;padding-top:2rem}.shape-info-intro{font-size:1.1rem;line-height:1.6}.info-section{margin-top:2rem}.info-section-title{font-size:1.4rem;color:var(--color-text-body);border-bottom:1px solid var(--color-border-secondary);padding-bottom:.3rem;margin-bottom:1rem}.info-item{margin-bottom:1rem}.info-item strong{font-size:1.1rem;color:var(--color-accent)}.info-item p{margin-top:.25rem;margin-bottom:0;line-height:1.5}.info-formula-code{background-color:var(--color-bg-surface-raised);padding:.75rem;border-radius:4px;font-family:var(--font-family-mono);white-space:pre-wrap;margin:.5rem 0}.shape-info-loader,.shape-info-error{padding:2rem;text-align:center;font-size:1.2rem;color:var(--color-text-muted)}