.App{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif}html{scroll-behavior:smooth}.top-bar{width:100%;display:block}.content-container{max-width:1200px;margin:0 auto;padding:50px 20px}.charts{display:flex;gap:40px;justify-content:center;flex-wrap:wrap}.charts>*{flex:1 1 400px}.chart-title{margin-top:40px;margin-bottom:50px;color:#583593;text-align:center;font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;font-size:xx-large}.card{background-color:#fff;border-radius:12px;padding:20px;border:2px solid #d0c6d0;box-shadow:12px 4px 8px #0000001a;width:100%;max-width:1500px;margin:40px auto;box-sizing:border-box}.future-components{margin-top:40px}.stats-section{margin-top:40px;display:flex;gap:20px;justify-content:center;flex-wrap:wrap}.compare-to-class-section .stats-section{margin-top:24px}.compare-to-class-section .chart1,.compare-to-class-section .chart2{display:flex;justify-content:center;width:100%}.compare-to-class-section .chart1>*,.compare-to-class-section .chart2>*{width:100%}.compare-to-class-section .content-container{padding:20px 20px 40px}.compare-to-class-section .stacked-section{display:flex;flex-direction:column;gap:24px;width:100%}.compare-to-class-section .stacked-section>*{width:100%}.stat-card{background:#f9f7ff;border:2px solid #d0c6d0;border-radius:10px;padding:20px;width:300px;text-align:center;margin-top:0}.stat-title{color:#583593;margin-bottom:15px}.stat-grid{display:flex;justify-content:space-between}.stat-label{font-size:12px;color:#777}.stat-value{font-size:20px;font-weight:700;color:#333}#root{width:100vw;min-height:100vh;text-align:center;background:#fff}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#2e2e2e;background-color:#fff;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#764abc;text-decoration:inherit}a:hover{color:#583593}body{margin:0;display:flex;justify-content:center;align-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1;color:#0d0611}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#cab8f1;color:#2e2e2e;cursor:pointer;transition:background-color .25s,color .25s}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#2e2e2e;background-color:#e6e0f8}a:hover{color:#583593}button{background-color:#a28ec6}}.navbar{background-color:#9e81b6;padding:10px 20px;color:#fff;font-size:1.2em;overflow:visible}.navButton{background-color:#a28ec6;color:#fff;padding:10px 20px;border:none;border-radius:5px;cursor:pointer;font-size:1em;transition:background-color .3s ease,color .3s ease}.navButton:hover{background-color:#785694;color:#fff}.home-box{padding:2rem;box-shadow:0 4px 6px #0000001a;border-radius:.5rem}.home-text{font-size:1.125rem;color:#718096;text-align:center}.home-button{font-size:1.125rem}.heading{color:#9e81b6}.center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.tooltip{position:absolute;text-align:center;width:auto;height:auto;padding:10px;font:12px sans-serif;background:#fff;border:1px solid #9e81b6;border-radius:8px;pointer-events:none;color:#2e2e2e}.custom-select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background:#fff;border:1px solid #ccc;padding:10px;font-size:16px;border-radius:4px;color:#2e2e2e}.custom-select:hover{border-color:#9e81b6}.custom-select:focus{outline:none;border-color:#a28ec6}.custom-select option{background-color:#fff;color:#2e2e2e}