@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--ink:#191b23;--muted:#747782;--soft:#a6a7ae;--paper:#f5f2ef;--white:#fff;--line:#e8e5e4;--burgundy:#9a315b;--rose:#d37191;--blue:#39799b;--radius:18px}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Manrope,'DM Sans',Arial,sans-serif}button,input{font:inherit}button{cursor:pointer}.shell{max-width:1320px;padding:0 40px 70px;margin:auto}.topbar{height:86px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #dbd8d7}.brand{display:flex;align-items:center;gap:12px;font-size:17px;font-weight:800;letter-spacing:.045em}.brand-mark{background:var(--ink);color:#fff;width:34px;height:34px;display:grid;place-items:center;font-size:22px;border-radius:3px;font-family:Georgia,serif;font-style:italic}.brand-muted{color:var(--muted);font-weight:500}.top-status{font-size:12px;color:var(--muted);font-weight:700;letter-spacing:.04em}.status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#76a884;margin-right:6px}.intro{padding:76px 0 51px;max-width:900px}.eyebrow{font-size:11px;font-weight:800;letter-spacing:.2em;color:var(--burgundy);text-transform:uppercase}.intro h1{font-size:clamp(39px,5.4vw,70px);line-height:1.08;letter-spacing:-.055em;margin:18px 0 23px;font-weight:800}.intro h1 em{color:var(--burgundy);font-style:normal}.intro p{font-size:16px;line-height:1.8;color:#5e606a;max-width:700px;margin:0}.control-card,.chart-card{background:var(--white);border:1px solid #eeebea;border-radius:var(--radius);box-shadow:0 12px 30px rgba(31,24,27,.025)}.control-card{padding:27px 32px 23px}.control-heading{display:flex;align-items:center;justify-content:space-between;gap:20px}.control-heading span{font-size:11px;letter-spacing:.17em;color:var(--muted);font-weight:800}.control-heading strong{font-size:25px;letter-spacing:-.04em}.tenor-row{display:flex;align-items:center;gap:28px;margin-top:23px}input[type=range]{width:100%;height:5px;accent-color:var(--burgundy);cursor:pointer}.month-input{display:flex;align-items:center;border:1px solid var(--line);border-radius:9px;height:42px;padding:0 10px;gap:4px;white-space:nowrap}.month-input input{width:56px;border:0;outline:0;text-align:right;font-weight:800;color:var(--ink)}.month-input span{color:var(--muted);font-size:12px}.tenor-scale{display:flex;justify-content:space-between;margin-right:98px;margin-top:5px;font-size:11px;color:var(--soft)}.presets{display:flex;gap:9px;flex-wrap:wrap;margin-top:22px}.presets button{border:1px solid #e5e1e1;border-radius:7px;background:#fff;color:#4e4f59;padding:8px 14px;font-size:12px;font-weight:700}.presets button.active{background:#f7e9ef;color:var(--burgundy);border-color:#e6bdcb}.date-controls{display:flex;align-items:end;gap:20px;border-top:1px solid var(--line);margin-top:24px;padding-top:20px}.date-controls label{display:flex;flex-direction:column;gap:5px;font-size:11px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.date-controls input{border:1px solid var(--line);background:#fff;border-radius:7px;padding:8px 10px;color:var(--ink);font-size:12px;font-weight:700}.hint{font-size:11px;color:var(--soft);margin-left:auto;margin-bottom:9px}.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:18px 0}.metric{background:#fff;border:1px solid #eeebea;border-radius:14px;padding:21px 22px;min-height:130px}.metric-title{font-size:11px;letter-spacing:.03em;font-weight:700;color:var(--muted);display:flex;align-items:center;gap:8px}.key-dot{width:8px;height:8px;border-radius:50%;display:inline-block}.key-dot.ofz,.swatch.ofz{background:var(--ink)}.key-dot.expected,.swatch.expected{background:var(--burgundy)}.key-dot.premium,.swatch.premium{background:var(--rose)}.key-dot.residual{background:#a4a7ad}.metric strong{display:block;font-size:30px;margin-top:18px;line-height:1;letter-spacing:-.045em;font-variant-numeric:tabular-nums}.metric-unit{font-size:11px;color:var(--soft)}.chart-card{padding:29px 32px 20px;margin-top:18px}.chart-card.secondary{margin-top:18px}.chart-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}.chart-head h2{font-size:24px;letter-spacing:-.035em;margin:7px 0 0}.chart-tools button{background:#f7f4f4;border:0;border-radius:7px;color:#6b555f;padding:9px 13px;font-size:11px;font-weight:800}.asof{font-size:12px;font-weight:700;color:var(--muted);margin-top:9px}.legend{display:flex;gap:23px;flex-wrap:wrap;margin:25px 0 5px;font-size:11px;color:var(--muted);font-weight:700}.legend span{display:flex;align-items:center;gap:8px}.swatch{display:inline-block;width:19px;height:3px;border-radius:2px}.chart-wrap{height:360px;position:relative;margin-top:14px}.chart-wrap svg{display:block;width:100%;height:100%;overflow:visible}.chart-wrap svg text{font-family:'DM Sans',Arial,sans-serif;fill:#9999a0;font-size:10px}.chart-wrap svg .grid{stroke:#eeeae9;stroke-width:1}.chart-wrap svg .line{fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}.chart-wrap svg .line.ofz{stroke:var(--ink)}.chart-wrap svg .line.expected{stroke:var(--burgundy)}.chart-wrap svg .line.premium{stroke:var(--rose)}.chart-wrap svg .cursor{stroke:#b1aab0;stroke-width:1;stroke-dasharray:4 4}.chart-wrap svg .end-label{font-size:10px;font-weight:700}.chart-wrap svg .end-label.ofz{fill:var(--ink)}.chart-wrap svg .end-label.expected{fill:var(--burgundy)}.chart-wrap svg .end-label.premium{fill:#ba5a78}.chart-wrap svg .selected-line{stroke:#ad7890;stroke-dasharray:4 4;stroke-width:1.3}.chart-wrap svg .point{stroke:#fff;stroke-width:2}.tooltip{position:absolute;pointer-events:none;z-index:3;background:#21212b;color:#fff;border-radius:8px;padding:10px 13px;box-shadow:0 9px 22px #0002;min-width:145px;font-size:11px;line-height:1.8}.tooltip b{display:block;margin-bottom:4px;font-size:12px}.tooltip .label-row{display:flex;justify-content:space-between;gap:20px}.tooltip .label-row i{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:5px}.chart-foot{border-top:1px solid #f0eded;padding-top:15px;display:flex;justify-content:space-between;color:#a4a3a8;font-size:10px;font-weight:700}.notes{margin-top:38px;max-width:1000px;color:#696a72;font-size:12px;line-height:1.8}.notes-title{font-size:11px;letter-spacing:.15em;font-weight:800;color:var(--ink);text-transform:uppercase}.notes p{margin:11px 0}.notes b{color:#3d3d47}
@media(max-width:900px){.shell{padding:0 20px 55px}.intro{padding-top:55px}.metric-grid{grid-template-columns:repeat(2,1fr)}.chart-wrap{height:310px}}@media(max-width:600px){.shell{padding:0 14px 45px}.topbar{height:67px}.top-status{font-size:0}.status-dot{font-size:12px}.intro{padding:44px 5px 35px}.intro p{font-size:14px}.control-card,.chart-card{padding:20px 16px}.control-heading strong{font-size:20px}.tenor-row{gap:13px}.date-controls{flex-wrap:wrap}.date-controls .hint{width:100%;margin:0}.metric-grid{gap:9px}.metric{padding:16px 12px;min-height:112px}.metric strong{font-size:24px}.metric-title{font-size:10px}.chart-head h2{font-size:20px}.chart-wrap{height:265px}.legend{gap:10px;font-size:10px}.chart-foot{font-size:9px}.chart-foot span:last-child{max-width:45%;text-align:right}}
.intro{max-width:1100px;padding:64px 0 42px}
.intro h1{font-size:clamp(34px,4.3vw,58px);line-height:1.16;margin:0 0 30px;max-width:1100px}
.intro-copy{max-width:900px}
.intro-copy p{max-width:none;margin:0 0 10px;color:#4e505b}
.intro-copy p:last-child{margin-top:23px}
.intro-copy b{color:var(--ink)}
.notes{margin-top:34px}
@media(max-width:600px){.intro{padding:42px 5px 33px}.intro h1{font-size:34px;line-height:1.2}.intro-copy p{font-size:13px;line-height:1.7}}
.chart-tools{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.chart-tools a,.chart-tools button{display:inline-block;background:#f7f4f4;border:0;border-radius:7px;color:#6b555f;padding:9px 13px;font-size:11px;font-weight:800;text-decoration:none}
