.dual-chart-wrapper{align-items:flex-start;display:flex;gap:40px;justify-content:center;margin:30px auto;max-width:1200px;width:100%}.custom-chart-container{flex:1;min-width:300px}.chart-title{color:#333;font-size:18px;font-weight:700;line-height:1.5;margin-bottom:20px;text-align:center}.chart-flex-wrapper{align-items:center;display:flex;flex-direction:column;gap:15px}.canvas-area{height:220px;width:220px}.legend-area{max-width:280px;width:100%}.legend-box{background:#fcfcfc;border:1px solid #dcdcdc;border-radius:8px;list-style:none;margin:0;padding:15px}.legend-item{align-items:center;display:flex;font-size:13px;line-height:1.5;margin-bottom:8px}.legend-item:last-child{margin-bottom:0}.color-swatch{border-radius:2px;display:inline-block;flex-shrink:0;height:14px;margin-right:8px;width:14px}.label-text{color:#555;margin-right:5px}.percentage-text{color:#777;font-weight:700}.chart-note{color:#777;font-size:12px;line-height:1.6;margin-top:10px;text-align:right}@media screen and (max-width:768px){.dual-chart-wrapper{align-items:center;flex-direction:column;gap:60px}.custom-chart-container{width:100%}.canvas-area{height:200px;width:200px}.legend-area{max-width:100%}.chart-note{text-align:left}}