/* HOP — Easy 8 Reset (e8reset.js, v106). Warning colours come from --warning / --warning-100. */
:root{ --e8r-ink:#8a5a00; --e8r-bg:#fff4dc; --e8r-line:#efc56a; }
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]){ --e8r-ink:#f0c35a; --e8r-bg:rgba(240,195,90,.12); --e8r-line:rgba(240,195,90,.45); } }
:root[data-theme="dark"]{ --e8r-ink:#f0c35a; --e8r-bg:rgba(240,195,90,.12); --e8r-line:rgba(240,195,90,.45); }

/* the Daily Anchors row */
.anchor-list .anchor-card.anchor-row.anchor-reset{ background:var(--e8r-bg); box-shadow:inset 4px 0 0 var(--e8r-ink); }
.anchor-list .anchor-card.anchor-row.anchor-reset.is-done{ background:transparent; box-shadow:inset 4px 0 0 var(--e8r-line); }
.anchor-list .anchor-reset .anchor-icon{ background:var(--e8r-bg); color:var(--e8r-ink); border:1.5px solid var(--e8r-line); }
.anchor-list .anchor-reset.is-done .anchor-icon{ background:var(--success-100); color:var(--success); border-color:transparent; }
.anchor-reset .anchor-title{ color:var(--e8r-ink); }
.anchor-reset.is-done .anchor-title{ color:var(--text); }
.anchor-reset-n{ font-size:12px; font-weight:700; color:var(--text-muted); margin-top:2px; }

/* flags on days (Progress) */
.e8r-flag{ display:inline-flex; color:var(--e8r-ink); line-height:0; }
.sc-col .e8r-flag{ position:absolute; top:2px; right:2px; }
.sc-col{ position:relative; }
.sc-cell{ position:relative; }
.sc-cell .e8r-flag{ position:absolute; top:1px; right:1px; }
.sc-cell .e8r-flag svg{ width:11px; height:11px; }
.sc-sec h3 .e8r-flag{ margin-left:6px; vertical-align:-1px; }
.e8r-dayflag{ margin:2px 0 8px; font-size:13.5px; color:var(--e8r-ink); background:var(--e8r-bg); border:1px solid var(--e8r-line); border-radius:10px; padding:7px 10px; }

/* the page */
.e8r-main{ gap:12px; padding-top:14px; }
.e8r-hero{ display:flex; gap:12px; align-items:flex-start; padding:14px; border-radius:16px; background:var(--e8r-bg); border:1px solid var(--e8r-line); }
.e8r-hero.is-clear{ background:var(--success-100); border-color:transparent; }
.e8r-hero-ic{ flex:none; width:44px; height:44px; border-radius:12px; display:grid; place-items:center; color:var(--e8r-ink); background:var(--surface); }
.e8r-hero.is-clear .e8r-hero-ic{ color:var(--success); }
.e8r-hero h2{ margin:0 0 4px; font-size:18.5px; line-height:1.25; }
.e8r-hero p{ margin:0; font-size:15px; line-height:1.45; color:var(--text-muted); }
.e8r-strip{ display:grid; grid-template-columns:repeat(7, minmax(0,1fr)); gap:6px; }
.e8r-day{ position:relative; display:flex; flex-direction:column; align-items:center; gap:2px; padding:8px 2px; border-radius:12px; background:var(--surface); border:1px solid var(--border); color:var(--text); }
.e8r-day b{ font-size:18px; font-weight:800; font-variant-numeric:tabular-nums; }
.e8r-day span{ font-size:11.5px; color:var(--text-muted); }
.e8r-day svg{ position:absolute; top:4px; right:4px; width:11px; height:11px; }
.e8r-day.is-flag{ background:var(--e8r-bg); border-color:var(--e8r-line); color:var(--e8r-ink); }
.e8r-day.is-ok b{ color:var(--success); }
.e8r-day.is-none{ opacity:.6; }
.e8r-list{ list-style:none; margin:0; padding:4px 14px; }
.e8r-when{ padding:10px 0; border-bottom:1px solid var(--border); }
.e8r-when:last-child{ border-bottom:0; }
.e8r-when-h{ display:flex; justify-content:space-between; align-items:center; gap:8px; }
.e8r-pill{ font-size:12.5px; font-weight:800; padding:3px 9px; border-radius:999px; background:var(--e8r-bg); color:var(--e8r-ink); border:1px solid var(--e8r-line); white-space:nowrap; }
.e8r-when-m{ font-size:14px; color:var(--text-muted); margin-top:3px; }
.e8r-card{ padding:14px; display:flex; flex-direction:column; gap:10px; }
.e8r-sub{ font-size:12.5px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:var(--text-muted); }
.e8r-chips{ display:flex; flex-wrap:wrap; gap:6px; }
.e8r-chip{ font-size:14px; font-weight:600; padding:5px 10px; border-radius:999px; background:var(--surface-2); border:1px solid var(--border); }
.e8r-chip i{ font-style:normal; font-weight:500; color:var(--text-muted); }
.e8r-note{ margin:0; font-size:15px; font-style:italic; line-height:1.4; }
.e8r-note span{ font-style:normal; font-size:13px; color:var(--text-muted); margin-left:4px; }
.e8r-note.is-up{ color:var(--success); }
.e8r-small{ margin:0; font-size:14px; color:var(--text-muted); line-height:1.4; }
.e8r-lead{ margin:0; font-size:15.5px; line-height:1.45; }
.e8r-help{ padding:10px 12px; border-radius:12px; background:var(--surface-2); display:flex; flex-direction:column; gap:6px; }
.e8r-help b{ font-size:15px; }
.e8r-help p{ margin:0; font-size:14.5px; line-height:1.4; color:var(--text); }
.e8r-links{ display:flex; flex-wrap:wrap; gap:6px; }
.e8r-link{ font:inherit; font-size:14px; font-weight:700; padding:7px 11px; border-radius:999px; border:1.5px solid var(--accent-400); background:var(--surface); color:var(--accent-600); cursor:pointer; text-align:left; }
.e8r-plan{ display:flex; flex-direction:column; gap:8px; }
.e8r-plan textarea{ width:100%; box-sizing:border-box; font:inherit; font-size:16px; padding:10px 12px; border-radius:12px; border:1px solid var(--border-strong); background:var(--surface); color:var(--text); resize:vertical; }
.e8r-plan .btn{ align-self:flex-start; }
.e8r-find{ padding:12px 14px; border-radius:14px; background:var(--surface); border:1px solid var(--border); display:flex; flex-direction:column; gap:5px; }
.e8r-find b{ font-size:15.5px; line-height:1.3; }
.e8r-find p{ margin:0; font-size:14.5px; line-height:1.45; color:var(--text-muted); }
.e8r-find a{ font-size:13px; font-weight:700; color:var(--accent-600); text-decoration:none; }
.e8r-how p{ margin:0; font-size:15px; line-height:1.45; }
.e8r-total{ margin:4px 0 0; text-align:center; font-size:13.5px; color:var(--text-muted); }

/* ---------- v107 ---------- */
/* Missed check-ins card: a gentle blue, with the days and their Fill in buttons */
.anchor-list .anchor-missed{ display:flex; flex-direction:column; gap:8px; width:100%; min-height:0; padding:12px 12px 12px 14px; border:0; border-radius:0; background:var(--accent-100); box-shadow:inset 4px 0 0 var(--accent-500); cursor:default; text-align:left; }
.anchor-list .anchor-missed + .anchor-card, .anchor-list .anchor-card + .anchor-missed{ border-top:1px solid var(--border); }
.e8m-head{ display:flex; align-items:center; gap:12px; }
.anchor-missed .anchor-icon{ width:40px; height:40px; border-radius:12px; margin:0; flex:none; display:grid; place-items:center; background:var(--surface); color:var(--accent-600); }
.anchor-missed .anchor-icon svg{ width:22px; height:22px; }
.anchor-missed .anchor-copy{ flex:1; min-width:0; }
.e8m-list{ list-style:none; margin:0 0 0 52px; padding:0; display:flex; flex-direction:column; gap:6px; }
.e8m-day{ display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:14.5px; font-weight:600; color:var(--text); }
.e8m-fill{ flex:none; font:inherit; font-size:13.5px; font-weight:800; padding:7px 12px; border-radius:999px; border:0; cursor:pointer; background:var(--refresh-action, var(--accent-500)); color:var(--refresh-action-ink, #fff); }
.e8m-skip{ align-self:flex-start; margin-left:52px; font:inherit; font-size:13.5px; font-weight:700; padding:6px 0; border:0; background:none; color:var(--text-muted); text-decoration:underline; text-underline-offset:3px; cursor:pointer; }
/* You're back */
.anchor-list .anchor-card.anchor-row.anchor-back{ background:var(--success-100); }
.anchor-back .anchor-title{ color:var(--success); }
/* the plan in the check-in */
.e8p-box{ margin:12px 0 10px; padding:12px; border-radius:14px; background:var(--e8r-bg); border:1px solid var(--e8r-line); display:flex; flex-direction:column; gap:6px; }
.e8p-h{ display:flex; align-items:center; gap:6px; font-size:12.5px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:var(--e8r-ink); }
.e8p-plan{ margin:0; font-size:15px; font-style:italic; line-height:1.4; }
.e8p-q{ font-size:15px; font-weight:700; }
.e8p-btns{ display:flex; flex-wrap:wrap; gap:6px; }
.e8p-btns button{ font:inherit; font-size:14px; font-weight:700; padding:8px 13px; border-radius:999px; border:1.5px solid var(--border-strong); background:var(--surface); color:var(--text); cursor:pointer; }
.e8p-done{ margin:0; font-size:14.5px; font-weight:600; color:var(--text); }
.e8p-undo{ font:inherit; font-size:13px; font-weight:700; border:0; background:none; color:var(--accent-500); text-decoration:underline; cursor:pointer; padding:0 0 0 4px; }
/* the page */
.e8r-plancard{ border:1.5px solid var(--e8r-line); }
.e8r-planlog{ margin:0; font-size:14px; color:var(--text-muted); }
.e8r-det > summary{ cursor:pointer; font-weight:700; color:var(--text-muted); padding:10px 2px; }
.e8r-det[open] > summary{ color:var(--text); }
.e8r-finds{ display:flex; flex-direction:column; gap:10px; }