/* Retention loop (task T-B): Home streak panel, at-risk banner, streak sheet, Settings reminder controls. Game layer, opaque (no blur). */
.streak-panel{display:flex;flex-direction:column;gap:14px;margin-bottom:24px}
.rt-top{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.rt-head{display:flex;align-items:center;gap:14px;min-width:0;flex:1 1 260px}
.rt-flame{position:relative;display:grid;place-items:center;width:72px;height:72px;flex:none;background:var(--bp-warn-soft,#FFF2D6)}
.rt-flame.cold .px-ico{filter:grayscale(1);opacity:.55}
.rt-flame .rt-n{position:absolute;right:-6px;bottom:-6px;min-width:32px;height:28px;padding:0 6px;display:grid;place-items:center;font-size:18px;background:var(--gm-sun);color:#3A2600;box-shadow:0 0 0 2px var(--gm-sun-d)}
.rt-ht{min-width:0}.rt-h{margin:0;font-size:22px;color:var(--bp-ink)}
.rt-sub{margin:4px 0 0;font-size:15px;color:var(--bp-ink-2)}
.rt-goal{display:flex;align-items:center;gap:12px}
.rt-gl{font:600 14px/1.3 var(--lg-font);color:var(--bp-ink-2)}.rt-gx{font-size:18px;color:var(--bp-ink)}
.rt-week{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.rt-day{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 0;background:var(--bp-paper-2);min-height:64px;justify-content:center}
.rt-day .rt-l{font:700 13px/1 var(--lg-font);color:var(--bp-ink-2)}
.rt-day.now{box-shadow:inset 0 0 0 3px var(--gm-sky)}.rt-day.now .rt-l{color:var(--bp-tint-ink)}
.rt-day.done{background:var(--bp-warn-soft,#FFF2D6)}
.rt-day.frozen{background:var(--bp-tint-soft)}
.rt-day.future{opacity:.85}
.rt-dot{display:block;width:12px;height:12px;margin:6px;background:var(--gm-seg)}
.rt-day.missed .rt-dot{background:transparent;box-shadow:inset 0 0 0 2px var(--bp-line-strong)}
.rt-tags{display:flex;gap:8px;flex-wrap:wrap}.rt-tag{gap:6px}
.rt-foot{display:flex;align-items:center;justify-content:space-between;gap:8px 16px;flex-wrap:wrap;font-size:15px}
.rt-shield-row{display:flex;align-items:center;gap:8px}.rt-shields{display:inline-flex;gap:2px}
.rt-shields .off{filter:grayscale(1);opacity:.35}
.rt-ms{font-size:14px}
.rt-more{align-self:flex-start;min-height:44px}
@media(max-width:560px){.rt-goal{width:100%}.rt-week{gap:4px}.rt-day{min-height:58px}}

/* at-risk banner (shown after the reminder time, dismissible for the day) */
.rt-risk{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:16px;border:2px solid var(--gm-sun-d);background:var(--bp-warn-soft,#FFF2D6)}
.rt-risk-ico{display:grid;place-items:center;width:48px;height:48px;flex:none}
.rt-risk-t{flex:1 1 240px;display:flex;flex-direction:column;gap:4px;min-width:0}.rt-risk-t b{font-size:17px}
.rt-risk-a{display:flex;gap:8px;flex-wrap:wrap}.rt-risk-a .btn{min-height:44px}
@media(max-width:560px){.rt-risk-a{width:100%}.rt-risk-a .btn.pri{flex:1}}

/* the top-bar flame is a button now */
button.hud-chip.hud-streak{height:44px;font:inherit;cursor:pointer;color:var(--gm-chip-ink)}
button.hud-streak:focus-visible{outline:3px solid var(--bp-focus);outline-offset:2px}
@media(max-width:420px){button.hud-chip.hud-streak{height:44px}}

/* streak sheet */
.streak-sheet{max-width:480px}
.rt-sheet{display:flex;flex-direction:column;gap:10px}
.rt-sheet p{margin:0}
.rt-big{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.rt-big>div:nth-child(2){flex:1;min-width:140px}
.rt-big .rt-flame{width:64px;height:64px}.rt-bn{font-size:28px}
.rt-big-goal{display:flex;flex-direction:column;align-items:center;gap:2px}
.rt-sh{margin:8px 0 0;font-size:17px}
.rt-ladder{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}
.rt-ladder li{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 0;background:var(--bp-paper-2);font-size:16px}
.rt-ladder li.got{background:var(--bp-warn-soft,#FFF2D6)}.rt-ladder li.next{box-shadow:inset 0 0 0 3px var(--gm-sky)}
.rt-ladder .rt-dot{margin:2px}

/* Settings: daily reminder */
.rt-rem{display:flex;flex-direction:column;gap:4px;margin:0 0 6px}
.rt-trow{margin:0 12px;gap:12px;align-items:center}.rt-time{min-height:44px;width:140px}
.rt-wd{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;margin:4px 8px 8px}
.rt-wdb{min-height:44px;min-width:0;border:0;background:var(--bp-paper-2);color:var(--bp-ink-2);font:600 15px var(--lg-font);cursor:pointer;border-radius:10px}
.rt-wdb[aria-pressed="true"]{background:var(--bp-primary,#2272E6);color:var(--bp-on-primary,#fff)}
.rt-perm,.rt-note{margin:4px 12px;font-size:14px}
html[data-skin=pixel] .rt-wdb{border-radius:0;clip-path:var(--px-notch);font-family:var(--px-font)}
html[data-skin=pixel] .rt-risk{border-width:3px}

@media(forced-colors:active){.rt-day,.rt-ladder li,.rt-wdb,.rt-flame{border:1px solid CanvasText}.rt-day.now,.rt-ladder li.next{outline:3px solid Highlight}.rt-wdb[aria-pressed="true"]{background:Highlight;color:HighlightText}}

/* animated streak flame (retention/flame.js) */
.fl{position:relative;display:inline-grid;place-items:end center}
.fl-cv{display:block;position:relative;z-index:1;object-fit:contain;transform-origin:50% 100%}.fl.lit .fl-img{animation:flflick 1.4s ease-in-out infinite alternate}.fl-blue .fl-img{filter:hue-rotate(185deg) saturate(1.3)}.fl-dot{width:var(--fl,24px);height:var(--fl,24px);border-radius:50% 50% 45% 45%;background:radial-gradient(circle at 50% 70%,#FFE45A,#FF8A2A 60%,#E8452F)}@keyframes flflick{0%{transform:scale(1,1) rotate(-1.5deg)}50%{transform:scale(1.04,.96) rotate(1deg)}100%{transform:scale(.97,1.05) rotate(-.5deg)}}@media(prefers-reduced-motion:reduce){.fl.lit .fl-img{animation:none}}
.fl-glow{position:absolute;inset:-18% -30% -6%;border-radius:50%;background:radial-gradient(closest-side,rgba(255,170,60,.55),rgba(255,120,40,.18) 55%,transparent 75%);animation:flglow 1.6s ease-in-out infinite}
.fl-hot .fl-glow{background:radial-gradient(closest-side,rgba(255,200,80,.65),rgba(255,120,40,.22) 55%,transparent 75%)}
.fl-blue .fl-glow{background:radial-gradient(closest-side,rgba(120,190,255,.6),rgba(70,130,255,.2) 55%,transparent 75%)}
.fl.cold .fl-glow{display:none}.fl.cold .fl-cv{filter:grayscale(1);opacity:.5}
@keyframes flglow{0%,100%{opacity:.75;transform:scale(.96)}50%{opacity:1;transform:scale(1.05)}}
@media(prefers-reduced-motion:reduce){.fl-glow{animation:none;opacity:.8}}
.rt-flame .fl{transform:translateY(-2px)}
.rt-day .fl{margin-top:2px}
.rt-flame{width:84px!important;height:84px!important;overflow:visible}.rt-flame .fl-cv{filter:drop-shadow(0 0 3px rgba(255,150,40,.7))}
