.longitudinalPanel{overflow:hidden}.vizGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.vizCard{min-width:0;padding:16px;border:1px solid #d4e6ed;border-radius:20px;background:linear-gradient(145deg,#fff,#eef8fb);box-shadow:0 10px 24px rgba(8,37,58,.08)}.vizCard.wide{grid-column:1/-1}.vizHeader{display:flex;align-items:end;justify-content:space-between;gap:12px;margin-bottom:10px}.vizHeader h3{margin:3px 0 0;font-size:22px;color:#17354a}.vizKicker{font-size:10px;font-weight:900;letter-spacing:.12em;color:#218b99}.vizHeader select{max-width:360px;padding:8px 10px;border:1px solid #c9dfe8;border-radius:11px;background:#fff;color:#284b61}.metricStrip{display:flex;flex-wrap:wrap;gap:7px;margin:8px 0 10px}.metricStrip span{padding:7px 10px;border-radius:11px;background:#edf6fa;border:1px solid #d3e6ed;font-size:10px;color:#5d788b}.metricStrip b{font-size:13px;color:#173d55;margin-right:3px}.trendSvg{display:block;width:100%;height:auto;border-radius:16px;background:linear-gradient(180deg,#fafdff,#eef6fa)}.gridLine{stroke:#dbe8ee;stroke-width:1}.axisLine{stroke:#9eb7c4;stroke-width:1.2}.axisText{font:11px Inter,system-ui,sans-serif;fill:#6c8493}.seriesLine{fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.seriesDot{stroke:#fff;stroke-width:2}.seriesLine.s0,.seriesDot.s0{stroke:#2aaeb8;fill:#2aaeb8}.seriesLine.s1,.seriesDot.s1{stroke:#716fe0;fill:#716fe0}.legend{display:flex;gap:14px;margin-top:8px;font-size:10px;color:#607d8f}.legend span{display:flex;align-items:center;gap:5px}.legendSwatch{width:18px;height:4px;border-radius:999px}.legendSwatch.s0{background:#2aaeb8}.legendSwatch.s1{background:#716fe0}.vizNote{font-size:10px;line-height:1.45;color:#6a8595;margin:10px 0 0}.vizEmpty,.profileEmpty{padding:28px;border-radius:16px;background:#edf6f9;color:#668192;font-size:12px}.profileEmpty b{display:block;color:#244a60;margin-bottom:6px}.profileEmpty p{margin:0;line-height:1.5}.actionBars,.profileBars{display:grid;gap:9px}.actionBar,.profileBar{display:grid;grid-template-columns:minmax(130px,220px) 1fr 38px;gap:9px;align-items:center;font-size:11px}.actionBar>div,.profileBar>div{height:10px;border-radius:999px;background:#dcebf0;overflow:hidden}.actionBar i,.profileBar i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#3ac4cd,#6d70df)}.actionBar b,.profileBar b{text-align:right;color:#21495f}.checkpointGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.cpCard{display:flex;flex-direction:column;gap:5px;padding:11px;border:1px solid #d5e5eb;border-radius:14px;background:#fff}.cpCard span{font-size:9px;font-weight:900;letter-spacing:.09em;color:#3f8c9a}.cpCard b{font-size:13px}.cpCard small{font-size:9px;color:#6d8695}.cpCard em{font-size:9px;font-style:normal;font-weight:900;color:#876f30}.cpCard.earned{border-color:#79d8c5;background:#f0fcf7}.cpCard.earned em{color:#188363}@media(max-width:900px){.vizGrid{grid-template-columns:1fr}.vizCard.wide{grid-column:auto}.checkpointGrid{grid-template-columns:repeat(2,1fr)}.vizHeader{align-items:start;flex-direction:column}.vizHeader select{width:100%;max-width:none}}@media(max-width:560px){.checkpointGrid{grid-template-columns:1fr}.actionBar,.profileBar{grid-template-columns:1fr 44px}.actionBar>span,.profileBar>span{grid-column:1/-1}.metricStrip{display:grid;grid-template-columns:repeat(2,1fr)}}