#reach { background: var(--surface); border-radius: 18px; padding: 18px 20px; display: grid; grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: 16px 28px; align-items: center; border: 2px dashed #c9bfe6; }
.rs-left { display: grid; gap: 8px; align-content: start; }
#reach h2 { margin: 0; font-family: var(--display); font-weight: 400; font-size: 19px; color: var(--ink); }
.rs-mock { justify-self: start; background: #fbe1d7; color: #92282b; font-size: 10px; font-weight: 800; letter-spacing: .1em; padding: 3px 9px; border-radius: 999px; }
.rs-hero { background: linear-gradient(135deg, #2E2159, #6B3FC4); color: #FFFFFF; border-radius: 14px; padding: 12px 16px; display: flex; align-items: center; gap: 12px; }
.rs-hero b { font-size: 46px; font-weight: 800; line-height: 1; color: #F2A27F; font-variant-numeric: tabular-nums; }
.rs-hero span { font-size: 13px; line-height: 1.35; color: #E6DEF8; }
.rs-mini { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.rs-mini div { background: var(--bg); border-radius: 10px; padding: 8px 10px; display: grid; }
.rs-mini b { font-size: 17px; color: var(--ink); font-variant-numeric: tabular-nums; }
.rs-mini span { font-size: 11.5px; color: var(--muted); }
.rs-right { display: grid; gap: 8px; }
.rs-list { display: grid; gap: 7px; }
.rs-row { display: grid; grid-template-columns: 22px minmax(70px, 96px) minmax(0, 1fr) 62px; gap: 10px; align-items: center; }
.rs-rk { width: 22px; height: 22px; border-radius: 50%; background: var(--head); color: #FFFFFF; font-size: 11px; font-weight: 800; display: grid; place-items: center; }
.rs-nm { font-size: 14px; color: var(--ink); }
.rs-track { height: 10px; background: var(--bg); border-radius: 999px; overflow: hidden; }
.rs-track i { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, #6B3FC4, #E47D62); }
.rs-val { font-size: 12px; color: var(--muted); text-align: right; font-variant-numeric: tabular-nums; }
.rs-val b { font-size: 17px; color: var(--ink); }
.rs-note { margin: 0; font-size: 11.5px; color: var(--muted); line-height: 1.45; }
@media (max-width: 760px) { #reach { grid-template-columns: minmax(0, 1fr); } }
#reach { grid-template-columns: minmax(0, 330px) minmax(0, 1fr); }
.rs-mock { white-space: nowrap; font-size: 9.5px; }
@media (max-width: 760px) { #reach { grid-template-columns: minmax(0, 1fr); } .rs-mock { white-space: normal; } }

.wrap > header.top { background: radial-gradient(120% 140% at 90% 0%, #D9774E 0%, #6B3FC4 40%, #2E2159 75%, #1E1640 100%); border-radius: 22px; padding: 36px 34px; }
.wrap > header.top .eyebrow { color: #F2A27F; }
.wrap > header.top h1, .wrap > header.top h1 em { color: #FFFFFF; }
.wrap > header.top h1 em { color: #F2A27F; }
.wrap > header.top .lede { color: #E6DEF8; }