/* ==========================================================
   READINESS CARD — Today (js/readinessCard.js)
   Green / yellow / red use the app's own tones: sage for green,
   tan for yellow, a muted terracotta for red.
========================================================== */
.rd-card{
    --rd-tone:var(--muted);
    margin:0 0 18px;
    padding:20px;
    border:1px solid var(--border);
    border-radius:18px;
    background:var(--surface);
}
.rd-card[hidden], .rd-card [hidden]{ display:none !important; }
/* A client with no watch connected and no readiness data yet (Phase 8). */
.rd-card.rd-none{ display:none !important; }
.rd-card.green{ --rd-tone:var(--good); }
.rd-card.yellow{ --rd-tone:var(--primary); }
.rd-card.red{ --rd-tone:var(--bad); }

/* Three rings, WHOOP-style: sleep · readiness · HRV */
.rd-rings{
    display:grid;
    grid-template-columns:1fr 1.25fr 1fr;
    align-items:start;
    gap:8px;
    max-width:520px;
    margin:0 auto;
}
.rd-gauge{ display:flex; flex-direction:column; align-items:center; text-align:center; min-width:0; }
.rd-ring{
    --pct:0;
    --tone:var(--rd-tone);
    width:116px;
    height:116px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:
        radial-gradient(closest-side, var(--surface) 84%, transparent 85%),
        conic-gradient(var(--tone) calc(var(--pct) * 1%), rgba(255,255,255,.08) 0);
}
.rd-ring.rd-mini{ width:84px; height:84px; margin-top:16px; --tone:var(--muted); }
.rd-ring.rd-mini.green{ --tone:var(--good); }
.rd-ring.rd-mini.yellow{ --tone:var(--primary); }
.rd-ring.rd-mini.red{ --tone:var(--bad); }
.rd-ring strong{ font-family:var(--font-display); font-size:3rem; line-height:1; color:var(--text); text-transform:uppercase; }
.rd-ring b{ font-family:var(--font-display); font-size:1.9rem; font-weight:400; line-height:1; color:var(--text); text-transform:uppercase; }
.rd-ring b small{ font-family:var(--font-body); font-size:.42em; font-weight:600; margin-left:2px; color:var(--muted); }
.rd-glabel{
    margin-top:8px;
    font-size:.72rem;
    font-weight:700;
    letter-spacing:.1em;
    text-transform:uppercase;
    color:var(--text);
}
.rd-gsub{ margin-top:2px; font-size:.78rem; color:var(--muted); }
.rd-gsub.rd-tone{ color:var(--rd-tone); font-weight:600; }

.rd-advice-box{
    margin-top:16px;
    padding:12px 14px;
    border-radius:12px;
    background:rgba(255,255,255,.04);
}
.rd-advice{ margin:0; color:var(--text); font-size:.95rem; line-height:1.45; }
.rd-advice-box .sb-btn{ margin-top:10px; }
.rd-advice-box .rd-link{ display:inline-block; margin-top:8px; }

.rd-more{ margin-top:12px; border-top:1px solid var(--border); padding-top:10px; }
.rd-more > summary{ cursor:pointer; color:var(--primary); font-weight:600; font-size:.9rem; }
.rd-more > .rd-parts:first-of-type{ margin-top:12px; }
.rd-flag{
    margin:6px 0 0;
    color:var(--amber);
    font-size:.85rem;
}
.rd-flag svg, .rd-connect svg, .rd-done svg{ width:15px; height:15px; vertical-align:-3px; }
.rd-link{ color:var(--primary); font-weight:600; font-size:.9rem; }
.rd-swap{ margin-top:2px; }

.rd-parts{
    list-style:none;
    margin:16px 0 0;
    padding:0;
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(170px, 1fr));
    gap:10px;
}
.rd-part{
    position:relative;
    padding:11px 12px 14px;
    border:1px solid var(--border);
    border-radius:12px;
    background:rgba(255,255,255,.02);
    overflow:hidden;
}
.rd-part-top{ display:flex; justify-content:space-between; gap:8px; align-items:baseline; }
.rd-part-top span{ color:var(--muted); font-size:.8rem; }
.rd-part-top strong{ color:var(--text); font-size:1rem; }
.rd-part small{ display:block; margin-top:4px; color:var(--muted); font-size:.78rem; line-height:1.35; }
.rd-bar{
    position:absolute;
    left:0; bottom:0;
    height:3px;
    width:var(--v);
    background:var(--muted);
}
.rd-bar.green{ background:var(--good); }
.rd-bar.yellow{ background:var(--primary); }
.rd-bar.red{ background:var(--bad); }

.rd-connect{
    margin:14px 0 0;
    color:var(--muted);
    font-size:.88rem;
}
.rd-connect a{ color:var(--primary); }

.rd-week{
    display:flex;
    gap:6px;
    margin-top:16px;
}
.rd-dot{
    flex:1 1 0;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:3px;
    padding:7px 0 6px;
    border-radius:10px;
    background:rgba(255,255,255,.03);
    border-top:3px solid rgba(255,255,255,.08);
}
.rd-dot.green{ border-top-color:var(--good); }
.rd-dot.yellow{ border-top-color:var(--primary); }
.rd-dot.red{ border-top-color:var(--bad); }
.rd-dot b{ font-size:.9rem; color:var(--text); }
.rd-dot i{ font-style:normal; font-size:.72rem; color:var(--muted); }

.rd-sleep{
    display:flex;
    align-items:flex-start;
    gap:10px;
    margin-top:16px;
    padding:12px 14px;
    border-radius:12px;
    background:rgba(255,255,255,.03);
}
.rd-sleep > svg{ width:18px; height:18px; flex-shrink:0; margin-top:2px; color:var(--primary); }
.rd-sleep p{ margin:0; color:var(--text); font-size:.9rem; }
.rd-sleep small{ color:var(--muted); font-size:.8rem; }
.rd-link-btn{
    padding:0;
    border:0;
    background:none;
    color:var(--primary);
    font:inherit;
    text-decoration:underline;
    cursor:pointer;
}

.rd-checkin-row{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:10px 14px;
    margin-top:16px;
}
.rd-checkin-row small{ color:var(--muted); font-size:.82rem; }
.rd-done{ color:var(--good); font-weight:600; font-size:.9rem; }

.rd-insights{ margin-top:14px; }
.rd-insights summary{
    cursor:pointer;
    color:var(--primary);
    font-weight:600;
    font-size:.9rem;
}
.rd-insights summary svg{ width:15px; height:15px; vertical-align:-3px; }
.rd-insights p, .rd-insights li{ color:var(--muted); font-size:.86rem; line-height:1.45; }
.rd-insights-list{ margin:8px 0 0; padding-left:18px; }
.rd-insights-list li.helps strong{ color:var(--good); }
.rd-insights-list li.hurts strong{ color:var(--bad); }
.rd-insights-list li strong{ color:var(--text); }

/* Check-in sheet (2026-10-10 redesign): header, scrolling sections, a fixed Save */
.rd-dialog{ width:min(520px, calc(100vw - 32px)); max-height:calc(100dvh - 40px); overflow:hidden; }
.rd-dialog[open]{ display:flex; }
.rd-form{ display:flex; flex-direction:column; gap:0; padding:0; width:100%; max-height:inherit; min-height:0; }
.rd-form-head{
    position:relative;
    padding:22px 22px 16px;
    background:linear-gradient(160deg, color-mix(in srgb, var(--primary) 16%, transparent), transparent 70%);
    border-bottom:1px solid var(--border);
}
.rd-form-head .sb-eyebrow{ color:var(--primary); }
.rd-form-head .sb-dialog-title{ margin:4px 0 0; font-family:var(--font-display); font-size:2rem; font-weight:400; letter-spacing:.01em; line-height:1; text-transform:uppercase; }
.rd-x{
    position:absolute; top:16px; right:16px;
    width:40px; height:40px; display:grid; place-items:center;
    border:1px solid var(--border); border-radius:50%;
    background:rgba(255,255,255,.04); color:var(--text); cursor:pointer;
}
.rd-x svg{ width:18px; height:18px; }
.rd-x .ui-icon{ display:grid; place-items:center; }
.rd-form-body{ flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:6px 22px 18px; }
.rd-sec{ margin:0; padding:16px 0; border-bottom:1px solid color-mix(in srgb, var(--border) 70%, transparent); }
.rd-sec:last-child{ border-bottom:0; }
.rd-sec h3{
    margin:0 0 12px;
    font-size:.72rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
    color:var(--muted);
}
.rd-form-foot{ padding:14px 22px calc(14px + env(safe-area-inset-bottom)); border-top:1px solid var(--border); background:var(--surface); }
.rd-form-foot .sb-btn{ width:100%; min-height:50px; font-size:1rem; }

.rd-scale, .rd-tags{ margin:0; padding:0; border:0; }
.rd-scale + .rd-scale{ margin-top:16px; }
.rd-scale legend{ display:flex; width:100%; justify-content:space-between; align-items:baseline; margin-bottom:8px; color:var(--text); font-weight:600; font-size:.95rem; }
.rd-scale-word{ color:var(--primary); font-weight:600; font-size:.9rem; }
.rd-scale-row{ display:flex; gap:8px; }
.rd-scale-row label{ flex:1 1 0; }
.rd-scale-row input, .rd-tag input{ position:absolute; opacity:0; pointer-events:none; }
.rd-scale-row span{
    display:grid; place-items:center;
    min-height:48px;
    border:1px solid var(--border);
    border-radius:14px;
    background:rgba(255,255,255,.03);
    color:var(--text);
    font-weight:700; font-size:1.05rem;
    cursor:pointer;
    transition:background .15s, border-color .15s, transform .1s;
}
.rd-scale-row span:active{ transform:scale(.96); }
.rd-scale-row input:checked + span{ background:var(--primary); border-color:var(--primary); color:var(--on-primary); box-shadow:0 6px 18px color-mix(in srgb, var(--primary) 30%, transparent); }
.rd-scale-row input:focus-visible + span, .rd-tag input:focus-visible + span{ outline:2px solid var(--primary); outline-offset:2px; }
.rd-scale-ends{ display:flex; justify-content:space-between; margin-top:5px; color:var(--muted); font-size:.75rem; }
.rd-flags{ display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }
.rd-field{ display:grid; gap:6px; color:var(--text); font-size:.92rem; }
.rd-pain{ margin-top:10px; }
.rd-pain[hidden]{ display:none; }
.rd-tags{ display:flex; flex-wrap:wrap; gap:8px; }
.rd-tag > span{
    display:inline-flex; align-items:center; gap:6px;
    min-height:40px;
    padding:8px 14px;
    border:1px solid var(--border);
    border-radius:var(--radius-pill, 999px);
    background:rgba(255,255,255,.03);
    color:var(--text);
    font-size:.88rem;
    cursor:pointer;
    transition:background .15s, border-color .15s;
}
.rd-tag .ui-icon{ display:inline-flex; width:0; overflow:hidden; opacity:0; transition:width .15s, opacity .15s; }
.rd-tag .ui-icon svg{ width:14px; height:14px; flex-shrink:0; }
.rd-tag input:checked + span{ background:color-mix(in srgb, var(--primary) 18%, transparent); border-color:var(--primary); color:var(--primary-light, var(--primary)); font-weight:600; }
.rd-tag input:checked + span .ui-icon{ width:14px; opacity:1; }
.rd-tag-warn input:checked + span{ background:color-mix(in srgb, var(--amber) 18%, transparent); border-color:var(--amber); color:var(--amber); }

.rd-water{ display:flex; align-items:center; justify-content:center; gap:22px; }
.rd-wbtn{
    width:52px; height:52px; border-radius:50%;
    border:1px solid var(--border); background:rgba(255,255,255,.04);
    color:var(--text); font-size:1.6rem; line-height:1; cursor:pointer;
}
.rd-wbtn:active{ transform:scale(.95); }
.rd-wval{ min-width:110px; text-align:center; }
.rd-wval strong{ font-family:var(--font-display); font-size:3.2rem; font-weight:400; line-height:1; color:var(--text); text-transform:uppercase; }
.rd-wval span{ margin-left:4px; color:var(--muted); font-weight:600; }
.rd-wbar{ height:6px; margin:14px 0 6px; border-radius:99px; background:rgba(255,255,255,.07); overflow:hidden; }
.rd-wbar i{ display:block; height:100%; width:0; border-radius:inherit; background:var(--cyan); transition:width .25s; }
.rd-wgoal{ margin:0; text-align:center; color:var(--muted); font-size:.82rem; }
.rd-wpresets{ display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-top:12px; }
.rd-wpreset{
    min-height:36px; padding:6px 14px;
    border:1px solid var(--border); border-radius:var(--radius-pill, 999px);
    background:transparent; color:var(--text); font-weight:600; cursor:pointer;
}
.rd-wpreset.is-on{ border-color:var(--cyan); background:color-mix(in srgb, var(--cyan) 18%, transparent); }
.rd-wclear{ color:var(--muted); font-weight:500; }

@media (max-width:600px){
    /* A bottom sheet on phones */
    .rd-dialog{ width:100vw; max-width:100vw; margin:auto 0 0; border-radius:22px 22px 0 0; max-height:92dvh; border-bottom:0; }
    .rd-form-head{ padding:20px 18px 14px; }
    .rd-form-body{ padding:4px 18px 14px; }
    .rd-form-foot{ padding-left:18px; padding-right:18px; }
}

@media (max-width:560px){
    .rd-card{ padding:16px; }
    .rd-ring{ width:100px; height:100px; }
    .rd-ring strong{ font-size:2.6rem; }
    .rd-ring.rd-mini{ width:72px; height:72px; margin-top:14px; }
    .rd-ring b{ font-size:1.6rem; }
    .rd-parts{ grid-template-columns:1fr 1fr; }
}

/* No score today: the last one, and a way to ask COROS again */
.rd-last{ margin:6px 0 0; color:var(--muted); font-size:.86rem; }
.rd-last strong{ color:var(--text); }
.rd-last strong.green{ color:var(--good); }
.rd-last strong.yellow{ color:var(--primary); }
.rd-last strong.red{ color:var(--bad); }
.rd-refresh{ margin-top:10px; }

/* READINESS v2 (js/readinessV2.js): what's going well / what to watch, COROS shown not scored, the Classic / New switch */
.rd-why{ margin:12px 0 0; display:flex; flex-direction:column; gap:4px; font-size:.9rem; color:var(--text-secondary); }
.rd-why p{ margin:0; }
.rd-why strong{ color:var(--text); }
.rd-coros{ margin:8px 0 0; color:var(--muted); font-size:.85rem; }
.rd-coros small{ font-size:.8rem; }
.rd-context{ margin:10px 0 0; padding:8px 10px; border:1px dashed color-mix(in srgb, var(--muted) 45%, transparent); border-radius:var(--radius-sm); }
.rd-context-h{ margin:0 0 4px; font-size:.75rem; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
.rd-context ul{ margin:0; padding:0; list-style:none; display:grid; gap:2px; font-size:.85rem; color:var(--muted); }
.rd-context strong{ color:var(--text); font-weight:600; margin-right:4px; }
.rd-version{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 8px; margin-top:12px; padding-top:10px; border-top:1px solid var(--border); color:var(--muted); font-size:.85rem; }
.rd-ver{ min-height:36px; padding:4px 12px; border-radius:var(--radius-pill); border:1px solid var(--border); background:transparent; color:var(--text-secondary); font-size:.85rem; cursor:pointer; }
.rd-ver.is-on{ border-color:var(--primary); color:var(--on-primary); background:var(--primary); font-weight:600; }
.rd-version .rd-link{ margin-left:auto; font-size:.85rem; }

/* THIS WEEK (js/thisWeekCard.js): the weekly decision on the coach's Today */
.tw-card:empty{ display:none; }
.tw-card[hidden]{ display:none !important; }
.tw-card{ margin:0 0 20px; padding:18px 20px; border:1px solid var(--border); border-left:4px solid var(--good, var(--green)); border-radius:16px; background:var(--surface); }
.tw-card.is-absorb{ border-left-color:var(--primary); }
.tw-card.is-ease{ border-left-color:var(--amber); }
.tw-card.is-recover, .tw-card.is-checkin{ border-left-color:var(--bad, var(--red)); }
.tw-head{ display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 16px; }
.tw-level{ margin:0; font-family:var(--font-display); font-weight:400; font-size:36px; line-height:1; color:var(--text); text-transform:uppercase; }
.tw-hint{ margin:0; color:var(--text-secondary); flex:1 1 240px; }
.tw-summary{ margin:10px 0 0; color:var(--text); line-height:1.5; }
.tw-domains{ list-style:none; margin:12px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:6px; }
.tw-domains li{ display:flex; gap:6px; align-items:baseline; padding:4px 10px; border-radius:var(--radius-pill); border:1px solid var(--border); font-size:.82rem; color:var(--muted); }
.tw-domains b{ font-weight:600; color:var(--text-secondary); }
.tw-groupnote{ margin:6px 0 0; font-size:.78rem; color:var(--muted); }
.tw-domains .sev-1 b{ color:var(--primary); }
.tw-domains .sev-2 b{ color:var(--amber); }
.tw-domains .sev-3 b{ color:var(--bad, var(--red)); }
.tw-sub{ margin:14px 0 6px; font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--primary); font-weight:700; }
.tw-changes{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; }
.tw-changes li{ display:grid; grid-template-columns:110px 1fr; gap:10px; color:var(--text); font-size:.92rem; }
.tw-changes span{ color:var(--muted); }
.tw-notes{ margin:10px 0 0; padding-left:18px; color:var(--text-secondary); font-size:.88rem; }
.tw-actions, .tw-done{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; margin-top:14px; }
.tw-done span{ color:var(--text-secondary); }
.tw-link{ display:inline-block; margin-top:12px; color:var(--primary); font-weight:600; font-size:.88rem; }
@media (max-width:600px){
    .tw-card{ padding:14px; }
    .tw-level{ font-size:30px; }
    .tw-changes li{ grid-template-columns:1fr; gap:0; }
}
.tw-pointer{ margin:10px 0 0; color:var(--text); }

/* This week on Today: the reasoning folds under Why */
.tw-why{ margin-top:10px; }
.tw-why > summary{ cursor:pointer; color:var(--primary); font-weight:600; font-size:.9rem; }
.rd-amount[data-amount="protein"] .rd-wbar i{ background:var(--green); }
.rd-amount[data-amount="protein"] .rd-wpreset.is-on{ border-color:var(--green); background:color-mix(in srgb, var(--green) 18%, transparent); }


/* Compact, expandable decision card on Today. Weekly Review remains full-size. */
.tw-card{
    margin-bottom:18px;padding:15px 18px;border:1px solid rgba(235,232,220,.085);
    border-left:3px solid var(--good,var(--green));border-radius:20px;
    background:linear-gradient(145deg,rgba(25,44,32,.97),rgba(12,25,18,.98));
    box-shadow:0 16px 38px rgba(0,0,0,.17),inset 0 1px 0 rgba(255,255,255,.025);
}
.tw-card.is-absorb{border-left-color:var(--primary)}
.tw-card.is-ease{border-left-color:var(--amber)}
.tw-card.is-recover,.tw-card.is-checkin{border-left-color:var(--bad,var(--red))}
.tw-compact-head{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:6px 20px}
.tw-compact-title{min-width:100px}
.tw-compact-title .sb-eyebrow{
    margin-bottom:2px;color:var(--primary);font-family:var(--font-mono);font-size:.65rem;
    letter-spacing:.12em;text-transform:uppercase
}
.tw-compact-head .tw-level{font-size:clamp(25px,2.4vw,32px);line-height:.96}
.tw-compact-head .tw-hint{min-width:0;flex:initial;font-size:.86rem;line-height:1.4}
.tw-disclosure{
    display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:36px;padding:0 12px;
    border:1px solid rgba(235,232,220,.13);border-radius:999px;background:rgba(255,255,255,.025);
    color:var(--text-secondary);font:600 .78rem/1 var(--font-body);white-space:nowrap;cursor:pointer;
    transition:background-color .18s ease,border-color .18s ease,color .18s ease
}
.tw-disclosure:hover{border-color:rgba(201,173,132,.42);background:rgba(201,173,132,.08);color:var(--cream)}
.tw-disclosure:focus-visible{outline:2px solid var(--primary);outline-offset:3px}
.tw-disclosure-chevron{color:var(--primary);font-size:1rem;line-height:1}
.tw-details{margin-top:13px;padding-top:12px;border-top:1px solid rgba(235,232,220,.08)}
.tw-details[hidden]{display:none !important}
.tw-details .tw-domains{margin-top:0}
.tw-details .tw-why{margin-top:12px}
.tw-details .tw-sub{margin-top:12px}
.tw-details .tw-actions,.tw-details .tw-done{margin-top:12px}
.tw-details .tw-link{margin-top:10px}
@media (max-width:700px){
    .tw-card{padding:13px 14px;border-radius:17px}
    .tw-compact-head{grid-template-columns:minmax(0,1fr) auto;gap:5px 10px}
    .tw-compact-title{grid-column:1;grid-row:1}
    .tw-compact-head .tw-hint{grid-column:1 / -1;grid-row:2;font-size:.8rem}
    .tw-disclosure{grid-column:2;grid-row:1;min-height:32px;padding:0 10px;font-size:.74rem}
    .tw-compact-head .tw-level{font-size:29px}
}

/* The coach's Today: readiness as one strip under today's run
   (redesign step 2, 2026-10-14). The three rings live under Details. */
.rd-card.rd-compact{ padding:14px 16px; }
.rd-strip{ display:flex; align-items:center; gap:14px; }
.rd-ring.rd-strip-ring{ width:64px; height:64px; flex:0 0 64px; }
.rd-ring.rd-strip-ring strong{ font-size:1.9rem; }
.rd-strip-body{ flex:1 1 auto; min-width:0; }
.rd-strip-head{ display:flex; flex-wrap:wrap; align-items:baseline; gap:2px 8px; margin:0 0 4px; }
.rd-strip-head .rd-glabel{ margin-top:0; }
.rd-strip-head .rd-tone{ color:var(--rd-tone); font-size:.82rem; font-weight:600; }
.rd-strip-facts{ color:var(--muted); font-size:.82rem; }
.rd-compact .rd-strip .rd-advice{ font-size:.92rem; }
.rd-compact .rd-extras{ margin-top:12px; }
.rd-compact .rd-checkin-row{ margin-top:12px; }
.rd-compact .rd-more .rd-rings{ margin:12px auto 6px; }

/* ==========================================================
   READINESS, PREMIUM (2026-10-15): the card's top is a glass panel with a ring
   in the day's tone, the advice, and the watch's sleep, HRV and resting HR each
   with its week as a line (js/bodyView.js). Details fold underneath as before.
   ========================================================== */
.rd-card .eos-today-card-header{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:12px; }
.rd-source{ color:var(--text-secondary); font-size:14px; font-weight:500; }

.rd-card .tone-green, .rd-body.tone-green{ --tone:#A0BB9C; --tone-hi:#CFE3C8; --tone-lo:#6E9A74; }
.rd-card .tone-yellow, .rd-body.tone-yellow{ --tone:#D6B98E; --tone-hi:#F2DDB4; --tone-lo:#B98F57; }
.rd-card .tone-red, .rd-body.tone-red{ --tone:#D98A74; --tone-hi:#F0B5A2; --tone-lo:#B5604C; }
.rd-card .tone-none, .rd-body.tone-none{ --tone:#93A08F; --tone-hi:#C6CBBC; --tone-lo:#6B7A68; }

.rd-body{
    position:relative;
    padding:20px 18px 14px;
    border-radius:28px;
    background:linear-gradient(180deg,rgba(236,230,212,.075),rgba(236,230,212,.02) 46%,rgba(236,230,212,.035));
    border:1px solid rgba(236,230,212,.12);
    box-shadow:inset 0 1px 0 rgba(255,244,222,.1),inset 0 0 40px rgba(255,244,222,.02),0 22px 44px -26px rgba(0,0,0,.7);
    -webkit-backdrop-filter:blur(18px) saturate(1.5);
    backdrop-filter:blur(18px) saturate(1.5);
}
.rd-body::before{ /* a soft glow of the day's tone behind the ring */
    content:"";
    position:absolute;
    left:-10px;
    top:-30px;
    width:190px;
    height:190px;
    border-radius:50%;
    pointer-events:none;
    background:radial-gradient(circle,color-mix(in srgb,var(--tone) 22%,transparent),transparent 68%);
}
.rd-body-top{ position:relative; display:grid; grid-template-columns:124px minmax(0,1fr); gap:16px; align-items:center; }
.rd-ring2{ position:relative; margin:0; width:124px; height:124px; }
.rd-ring2 svg{ display:block; width:100%; height:100%; overflow:visible; }
.rd-ring-glow{ filter:blur(5px); }
.rd-ring2 figcaption{ position:absolute; inset:0; display:grid; place-items:center; padding-bottom:4px; }
.rd-ring2 figcaption b{ font:700 54px/1 var(--font-display); letter-spacing:.01em; color:var(--text); }
.rd-word{ margin:0; font:700 30px/1 var(--font-display); letter-spacing:.01em; text-transform:uppercase; color:var(--tone-hi); }
.rd-line{ margin:8px 0 0; font-size:15.5px; line-height:1.45; color:var(--text-secondary); }
.rd-line b{ color:var(--text); font-weight:650; }

.rd-extras{ position:relative; display:flex; flex-direction:column; align-items:flex-start; gap:8px; margin-top:14px; }

.rd-measures{
    position:relative;
    list-style:none;
    margin:18px 0 0;
    padding:14px 0 0;
    display:grid;
    grid-template-columns:repeat(var(--cols,3),minmax(0,1fr));
    border-top:1px solid var(--border);
}
.rd-measure{ display:grid; align-content:start; gap:4px; padding:0 10px; min-width:0; }
.rd-measure:first-child{ padding-left:0; }
.rd-measure + .rd-measure{ border-left:1px solid var(--border); }
.rd-m-k{ font-size:13px; font-weight:600; color:var(--text-secondary); }
.rd-m-v{ font:600 30px/1 var(--font-display); letter-spacing:.01em; color:var(--text); }
.rd-m-v small{ font:600 12.5px/1 var(--font-body); letter-spacing:0; color:var(--muted); }
.rd-m-spark{ position:relative; height:34px; margin:4px 0 2px; }
.rd-spark{ position:absolute; inset:0; width:100%; height:100%; display:block; overflow:visible; }
.rd-spark-dot{
    position:absolute;
    width:9px;
    height:9px;
    margin:-4.5px 0 0 -4.5px;
    border-radius:50%;
    background:var(--tone-hi);
    box-shadow:0 0 0 2.5px var(--bg),0 0 10px color-mix(in srgb,var(--tone) 70%,transparent);
}
.rd-m-n{ font-size:12.5px; line-height:1.35; color:var(--muted); }

.rd-body-foot{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    flex-wrap:wrap;
    margin-top:14px;
    padding-top:10px;
    border-top:1px solid var(--border);
    font-size:13.5px;
    color:var(--muted);
}
.rd-recovery b{ color:var(--text-secondary); font-weight:650; }
.rd-body-foot .rd-checkin-row{ margin:0; }
.rd-body-foot .sb-btn{ min-height:44px; }
.rd-card .rd-more{ margin-top:14px; }

@media (max-width:400px){
    .rd-body-top{ grid-template-columns:108px minmax(0,1fr); gap:12px; }
    .rd-ring2{ width:108px; height:108px; }
    .rd-ring2 figcaption b{ font-size:46px; }
}
