.diagram-container{flex-direction:column;gap:10px;width:100%;height:100%;display:flex}.diagram-chart{flex-direction:row;align-items:center;height:100%;display:flex;overflow:hidden}.period-selector{flex-wrap:wrap;gap:6px;min-height:27px;padding:4px 0;display:flex}.period-btn{border:1px solid var(--border-color,#8080804d);color:var(--text-color,inherit);cursor:pointer;background-color:#0000;border-radius:4px;padding:4px 10px;font-size:12px;transition:background-color .2s,border-color .2s}.period-btn:hover{background-color:var(--hover-bg,#8080801a);border-color:var(--hover-border,#80808080)}.period-btn.active{background-color:var(--active-bg,#4f6273cc);border-color:var(--active-border,#4f6273);color:#fff}