.container-graph{width:100%;max-width:90%;margin:30px auto;border:1px solid #eae6df;background:#fff;padding:24px;border-radius:12px;box-shadow:0 4px 20px rgba(0,0,0,2%);font-family:inter,sans-serif;box-sizing:border-box}.graph{margin:0 auto;height:32px;margin-bottom:8px;display:flex;align-items:center}.graph:last-child{margin-bottom:0}.total{width:40px;font-size:14px;color:#2c3e50;font-weight:700;text-align:center;flex-shrink:0}.bars{height:32px;flex-grow:1;display:flex;border-radius:6px;overflow:hidden;background-color:#faf7f2}.bar{height:100%;font-size:13px;font-weight:600;color:#2c3e50;display:flex;align-items:center;justify-content:center;cursor:pointer;border:none;transition:filter .2s ease,opacity .2s ease;box-sizing:border-box}.bar:hover{filter:brightness(.95)}.bg-group1{background-color:#e3f2fd;color:#1565c0}.bg-group2{background-color:#e8f5e9;color:#2e7d32}.bg-group3{background-color:#fffde7;color:#f57f17}.bg-group4{background-color:#ffebee;color:#c62828}.bg-group5{background-color:#f3e5f5;color:#6a1b9a}p .bg-group1,p .bg-group2,p .bg-group3,p .bg-group4,p .bg-group5{padding:2px 6px;border-radius:4px;font-weight:600;display:inline-block}.value{display:block;margin-top:5px;text-align:center}.top-legend{margin:0 0 20px;padding:0;display:flex;justify-content:flex-end;gap:8px;list-style:none}.top-legend li{min-width:110px;font-size:12px;font-weight:600;text-align:center;padding:8px 12px;border-radius:6px;box-sizing:border-box}@media screen and (max-width:800px){.container-graph{max-width:100%;padding:12px}.graph{height:24px;margin-bottom:6px}.bars{height:24px}.total{font-size:12px}.bar{font-size:11px}.top-legend{flex-wrap:wrap;justify-content:center}.top-legend li{min-width:45%;padding:6px;font-size:11px}}