.graphs-shell{display:grid;gap:18px}.graphs-intro h3{margin:8px 0 6px}.graphs-layout{display:grid;grid-template-columns:320px minmax(0,1fr);gap:18px}.graphs-sidebar,.graphs-main{display:grid;gap:18px;align-content:start}.graphs-panel{display:grid;gap:14px;padding:18px;border:1px solid rgba(15,23,42,.08);border-radius:14px;background:linear-gradient(180deg,#fffffffa,#f8fafcfa);box-shadow:0 14px 30px #0f172a0d}.graphs-panel h4{margin:0;color:#0f172aeb}.graphs-preset-list{display:grid;gap:10px}.graphs-preset{text-align:left;padding:12px 14px;border:1px solid rgba(15,23,42,.1);border-radius:12px;background:#ffffffd9;color:#0f172ae0;font:inherit;font-weight:600;cursor:pointer;transition:all .18s ease}.graphs-preset:hover,.graphs-preset.is-active{border-color:#1d4ed83d;background:#1d4ed814;color:#1d4ed8}.graphs-filter-grid{display:grid;gap:12px}.graphs-field{display:grid;gap:6px}.graphs-field span{color:#0f172ab8;font-size:.86rem;font-weight:600}.graphs-field select{min-height:40px;padding:8px 12px;border:1px solid rgba(15,23,42,.12);border-radius:10px;background:#fffffffa;color:#0f172aeb;font:inherit}.graphs-apply{margin-top:4px}.graphs-chart-panel{min-height:720px}.graphs-chart-header{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:12px}.graphs-legend{display:flex;flex-wrap:wrap;gap:14px;color:#0f172abd;font-size:.92rem;font-weight:500}.graphs-legend span{display:inline-flex;align-items:center;gap:8px}.graphs-legend i{width:12px;height:12px;border-radius:999px;display:inline-block}.graphs-echart{width:100%;height:600px;border-radius:14px;background:radial-gradient(circle at top right,rgba(29,78,216,.05),transparent 28%),linear-gradient(180deg,#fffffffa,#f8fafcfa);border:1px solid rgba(15,23,42,.08)}.echarts-tooltip{display:grid;gap:12px;padding:16px 18px;min-width:220px}.echarts-tooltip-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}.echarts-tooltip-head strong{color:#fff;font-size:.95rem}.echarts-tooltip-head span{display:inline-flex;align-items:center;justify-content:center;padding:6px 10px;border-radius:999px;font-size:.78rem;font-weight:700}.echarts-tooltip-grid{display:grid;grid-template-columns:max-content 1fr;gap:8px 14px;align-items:center}.echarts-tooltip-grid span{color:#ffffff9e}.echarts-tooltip-grid strong{color:#fff;font-size:.92rem}@media (max-width: 1080px){.graphs-layout{grid-template-columns:1fr}.graphs-chart-panel{min-height:auto}}@media (max-width: 640px){.graphs-chart-header{align-items:stretch}.graphs-echart{height:500px}.echarts-tooltip-grid{grid-template-columns:1fr;gap:4px}}
