:root{--primary-color:#0072bc;--primary-hover:#005f9e;--text-color:#333;--bg-color:#fff;--h2-font-size:1.5rem;--h3-font-size:1rem;--h2-font-size-mobile:1.2rem;--h3-font-size-mobile:.9rem;font-family:Inter,Arial,sans-serif;font-weight:400}body{background-color:var(--bg-color);color:var(--text-color);margin:0;padding:0}.container{box-sizing:border-box;width:100%;margin:0 auto;padding:1rem}h2{font-size:var(--h2-font-size);text-align:center;margin:.5rem 0}h3{font-size:var(--h3-font-size);text-align:center;margin:.5rem 0}p{text-align:center;margin:.5rem 0;font-size:1rem}.chart-container{width:100%}.chart-container canvas{width:100%;height:auto}button{border:1px solid var(--primary-color);background-color:var(--primary-color);color:#fff;cursor:pointer;border-radius:6px;width:auto;padding:.4em .8em;font-size:.9rem;transition:background-color .25s}button:hover{background-color:var(--primary-hover)}button:disabled{color:#666;cursor:not-allowed;background-color:#ccc}@media (width<=768px){.container{padding:.5rem}h2{font-size:var(--h2-font-size-mobile)}h3{font-size:var(--h3-font-size-mobile)}button{width:auto;padding:.4em .8em;font-size:.9rem}.MuiStack-root{gap:.5rem}}