/* ============================================================================
   MINDSTER — MOVEMENT PAGE MASTER TEMPLATE · STYLESHEET
   Built 2026-08-27 · BUILD session.
   Visual design is the Ed-approved prototype of 2026-08-24 (kept, not redesigned).
   Shell conventions (mobile-first, OG tags, single static page, no dependencies)
   follow clients/diane/DIANE_NETLIFY/index.html.
   One stylesheet for every movement page. Never per-movement CSS.
   ========================================================================== */

:root{
  --ink:#1a1d21; --soft:#5c6470; --line:#e4e7eb;
  --green:#1e7d4f; --greenbg:#eaf6ef;
  --red:#b3372e;   --redbg:#fbeeec;
  --gold:#b98a1e;  --goldbg:#fdf6e7;
  --card:#f7f8fa;  --accent:#12406e;
  --navy:#0e1420;  --deepgreen:#14402b;
  --ui:Helvetica,Arial,sans-serif;
  /* --- THEMEABLE: the three regions under review (Ed, 2026-08-27) --------
     Default = NAVY, the treatment that shipped. data-theme on <html> swaps them. */
  --headerbg:transparent; --headerpad:28px 0 10px; --headerradius:0;
  --headerborder:0; --headerbottom:1px solid var(--line);
  --badgebg:var(--card); --badgeline:var(--line);
  --videobg:#0e1420; --videofg:#9fb0c8; --videodim:#5f708c;
}

/* NAVY — the original treatment. Tokens already sit on :root; this exists so
   the picker can name it explicitly. */
:root[data-theme="navy"]{}

/* NAVY AND SAND — navy headings kept, warm header band, lighter video blocks.
   THE DEFAULT since 2026-08-27 (set on <html> in each movement shell). */
:root[data-theme="sand"]{
  --headerbg:#f6f3ec; --headerpad:22px 18px 18px; --headerradius:12px;
  --headerborder:1px solid #e6dfd1; --headerbottom:1px solid #e6dfd1;
  --badgebg:#fff; --badgeline:#ded6c6;
  --videobg:#2b3540; --videofg:#aab7c4; --videodim:#7d8b99;
}
/* SLATE AND SAND — the full option B, headings go slate too */
:root[data-theme="slate"]{
  --accent:#33414f;
  --headerbg:#f6f3ec; --headerpad:22px 18px 18px; --headerradius:12px;
  --headerborder:1px solid #e6dfd1; --headerbottom:1px solid #e6dfd1;
  --badgebg:#fff; --badgeline:#ded6c6;
  --videobg:#2b3540; --videofg:#aab7c4; --videodim:#7d8b99;
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html{-webkit-text-size-adjust:100%}
body{font-family:Georgia,'Times New Roman',serif;color:var(--ink);line-height:1.65;background:#fff;-webkit-font-smoothing:antialiased}
img,video{max-width:100%;display:block}
.wrap{max-width:760px;margin:0 auto;padding:0 20px 80px}

/* --- 1 · HEADER ---------------------------------------------------------- */
header.top{background:var(--headerbg);padding:var(--headerpad);border-radius:var(--headerradius);border:var(--headerborder);border-bottom:var(--headerbottom);margin-top:0}
.brand{font-family:var(--ui);font-weight:800;letter-spacing:.28em;font-size:13px;color:var(--accent);display:inline-flex;align-items:center;gap:7px;text-decoration:none;cursor:pointer}
.brandlogo{height:22px;width:auto;display:block;vertical-align:middle}
.crumb{font-family:var(--ui);font-size:12px;color:var(--soft);margin-top:14px}
.crumb a{color:#12406e;font-weight:700;text-decoration:none;border-bottom:1px dotted #9fb0c8} /* real links (client-sim F8, 2026-09-01) */
.crumb a:hover{border-bottom-color:#12406e}
h1{font-size:34px;line-height:1.15;margin:6px 0 14px}
.hook{font-size:17px;color:var(--soft);font-style:italic;margin-bottom:18px}
.badges{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:6px}
.badge{font-family:var(--ui);font-size:12px;font-weight:700;background:var(--badgebg);border:1px solid var(--badgeline);border-radius:20px;padding:5px 12px;color:var(--ink)}
.regionmap{margin:18px 0 4px}

/* --- STICKY SECTION NAV (reference 3: sticky section dropdown) ----------- */
nav.secnav{position:sticky;top:0;background:#fff;border-bottom:1px solid var(--line);z-index:9;padding:8px 0;overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch}
nav.secnav a{font-family:var(--ui);font-size:12px;font-weight:700;color:var(--accent);text-decoration:none;margin-right:16px}
section{padding:34px 0 6px;scroll-margin-top:52px}
h2{font-family:var(--ui);font-size:15px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:14px}
p{margin-bottom:14px}

/* --- 2 · QUICK SUMMARY (reference 5) ------------------------------------- */
.summary{background:var(--card);border:1px solid var(--line);border-left:5px solid var(--accent);border-radius:8px;padding:18px 20px}
.summary ul{list-style:disc}
.summary li{margin:8px 0 8px 18px}

/* --- MEDIA SLOTS: real asset when src is set, labeled placeholder when not */
.media{margin-bottom:10px}
.media video,.media img{width:100%;border-radius:10px;border:1px solid var(--line)}
.slot{border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;font-family:var(--ui);padding:18px;overflow:hidden}
.slot .kicker{font-size:14px;font-weight:700;letter-spacing:.04em}
.slot .note{font-size:12px;margin-top:8px;line-height:1.5;max-width:46ch;overflow-wrap:anywhere}
.slot .file{font-size:11px;margin-top:8px;opacity:.8;font-family:ui-monospace,Menlo,Consolas,monospace;max-width:100%;overflow-wrap:anywhere;word-break:break-word}
.slot.video{aspect-ratio:16/9;background:var(--videobg);color:var(--videofg)}
.slot.video .note,.slot.video .file{color:var(--videodim)}
.slot.photo{aspect-ratio:4/3;background:var(--card);border:1px dashed var(--line);color:var(--soft);padding:10px}
.slot.photo .kicker{font-size:11px;font-weight:700}
.slot.photo .note{font-size:10px;margin-top:4px}
/* thumbnail slots: kicker + what-the-shot-is only. The filename lives in the
   movement data file; printing it in a 120px box overflows the placeholder. */
.stepmedia .slot .file,.comp .shot .slot .file{display:none}
.slot.graphic{background:var(--card);border:1px dashed var(--line);color:var(--soft);padding:18px;aspect-ratio:auto;min-height:96px}
.slot.graphic .kicker{font-size:13px;font-weight:700}
.cap{font-family:var(--ui);font-size:12px;color:var(--soft);text-align:center;margin:6px 0 14px}

/* --- WHY AT A GLANCE — the belief strip -----------------------------------
   Fact fragments, not sentences. This is the motivation moment: it has to be
   readable in four seconds on a phone. The three locked why paragraphs still
   sit underneath it for anyone who wants the depth. */
.facts{display:grid;grid-template-columns:1fr;gap:9px;margin-bottom:20px}
.fact{background:var(--card);border:1px solid var(--line);border-left:5px solid var(--accent);border-radius:8px;padding:12px 15px}
.fact .lead{font-family:var(--ui);font-size:15px;font-weight:800;letter-spacing:.01em;color:var(--accent);line-height:1.25}
.fact .t{font-size:14.5px;line-height:1.45;margin-top:3px;color:var(--ink)}
.fact.warn{border-left-color:var(--red)}
.fact.warn .lead{color:var(--red)}
@media (min-width:620px){.facts{grid-template-columns:1fr 1fr}}

/* --- THE NUMBER — a sourced stat, rendered inside the why section --------
   Never a round figure attached to a dramatic claim (GOLD_STATEMENTS, the
   honesty posture). The framing of the source stays as the locked doc wrote it. */
.stat{border:1px solid var(--line);border-left:5px solid var(--accent);background:var(--card);border-radius:8px;padding:16px 18px;margin:18px 0}
.stat .k{font-family:var(--ui);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-weight:800;margin-bottom:6px}
.stat .big{font-family:Georgia,serif;font-size:22px;font-weight:700;line-height:1.2;margin-bottom:6px}
.stat .t{font-size:15px;line-height:1.55}

/* --- 5 · SETUP ----------------------------------------------------------- */
ol.setup{counter-reset:s;list-style:none}
ol.setup li{counter-increment:s;display:flex;gap:14px;margin-bottom:16px;align-items:flex-start}
ol.setup li::before{content:counter(s);font-family:var(--ui);font-weight:800;background:var(--accent);color:#fff;min-width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;margin-top:2px;flex-shrink:0}
ol.setup .steptext{flex:1 1 auto;min-width:0}
ol.setup .stepmedia{flex:0 0 120px;max-width:120px}
.coachcue{background:var(--goldbg);border-left:5px solid var(--gold);border-radius:8px;padding:14px 18px;margin:16px 0;font-size:16px}
.coachcue b{font-family:var(--ui);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:4px}

/* --- 6 · DOSE ------------------------------------------------------------ */
.dose{background:var(--goldbg);border:1px solid #ecd9a8;border-radius:10px;padding:20px}
.dose .big{font-size:22px;font-weight:700;margin-bottom:8px;line-height:1.3}
.dose p:last-child{margin-bottom:0}

/* --- 7 · FELT-TEST DECODER (reference 1: asymmetry cards) ---------------- */
.feel{display:grid;grid-template-columns:1fr;gap:12px}
.feelcard{border-radius:8px;padding:14px 16px;font-size:15px}
.feelcard.yes{background:var(--greenbg);border-left:5px solid var(--green)}
.feelcard.no{background:var(--redbg);border-left:5px solid var(--red)}
.feelcard b{font-family:var(--ui);font-size:12px;letter-spacing:.08em;text-transform:uppercase;display:block;margin-bottom:4px}
.feelcard.yes b{color:var(--green)}
.feelcard.no b{color:var(--red)}

/* --- 8 · COMPENSATIONS (reference 4: red-X photos) ----------------------- */
.comp{border:1px solid var(--line);border-radius:8px;margin-bottom:12px;overflow:hidden}
.comp .head{display:flex;align-items:center;gap:10px;padding:12px 14px;background:var(--redbg)}
.redx{font-family:var(--ui);font-weight:900;color:#fff;background:var(--red);min-width:26px;height:26px;border-radius:6px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.comp .head b{font-family:var(--ui);font-size:14px}
.comp .body{padding:12px 14px;font-size:15px;display:flex;gap:12px;align-items:flex-start}
.comp .body .copy{flex:1 1 auto;min-width:0}
.comp .body .shot{flex:0 0 120px;max-width:120px}
table.pct{width:100%;border-collapse:collapse;font-family:var(--ui);font-size:13px;margin:14px 0}
table.pct th,table.pct td{border:1px solid var(--line);padding:8px 10px;text-align:left}
table.pct th{background:var(--accent);color:#fff;text-transform:uppercase;font-size:11px;letter-spacing:.06em}
table.pct td:nth-child(2),table.pct td:nth-child(3){text-align:center;font-weight:700}
table.pct td:nth-child(2){background:var(--greenbg);color:var(--green)}
table.pct td:nth-child(3){background:var(--redbg);color:var(--red)}
table.pct tr.total td{font-weight:800;background:var(--goldbg)!important;color:var(--ink)!important}
.tablescroll{overflow-x:auto}

/* --- 9 · LADDER + GATE (reference 3: levels as numbered standards) ------- */
.ladder{display:flex;flex-direction:column;gap:10px}
/* Ed 2026-08-28: the level you are on stands out in colour; the rest sit back. */
.rung{border:1px solid var(--line);border-radius:8px;padding:12px 16px;background:var(--card);color:var(--ink)}
.rung b{color:var(--ink)}
.rung.now{background:var(--accent);border-color:var(--accent);color:#fff}
.rung.now b{color:#fff}
.rung.now .badge{background:var(--gold);border-color:var(--gold);color:#fff}
.rung b{font-family:var(--ui);font-size:13px}
.gate{font-size:14px;color:var(--soft);font-style:italic;margin-top:10px}

/* --- 10 · IDENTITY ------------------------------------------------------- */
.identity{background:var(--goldbg);border:1px solid #ecd9a8;border-radius:10px;padding:18px 20px}
.identity label{display:flex;gap:12px;align-items:flex-start;margin:10px 0;font-size:16px;cursor:pointer}
.identity input{width:20px;height:20px;margin-top:4px;flex-shrink:0;accent-color:var(--accent)}
.goldmark{color:var(--gold);font-family:var(--ui);font-weight:800;font-size:11px;letter-spacing:.1em}

/* --- SIX-CUE SCREENSHOT CARD (gold A2 command rows — Ed ruling 2026-08-27, supersedes deep green) --- */
.cuecard{background:#fdf6e7;border:2px solid var(--gold);border-radius:12px;overflow:hidden}
.cuecard h3{font-family:var(--ui);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#fff;background:var(--gold);margin:0;padding:10px 16px;font-weight:800}
.cuecard .row{display:flex;gap:12px;padding:11px 16px;border-bottom:1px solid #ecd9a8;align-items:flex-start}
.cuecard .row:last-of-type{border-bottom:none}
.cuecard .n{background:var(--gold);color:#fff;font-family:var(--ui);font-weight:900;min-width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;margin-top:1px}
.cuecard .cmd{font-family:var(--ui);font-weight:800;font-size:15px;letter-spacing:.02em}
.cuecard .det{font-size:12.5px;color:#6b5a2a;margin-top:1px;line-height:1.4}
.cuecard .snap{font-family:var(--ui);font-size:11px;color:#8a6a12;padding:10px 16px 14px}

/* --- 11 · SAFETY (reference 1: calm safety box) -------------------------- */
.safety{border:1px solid var(--line);border-left:5px solid var(--soft);border-radius:8px;padding:16px 18px;background:var(--card);font-size:15px}

footer.pagefoot{margin-top:50px;padding-top:20px;border-top:1px solid var(--line);font-family:var(--ui);font-size:11px;color:var(--soft)}

@media (max-width:520px){
  h1{font-size:28px}
  .hook{font-size:16px}
  .dose .big{font-size:19px}
  ol.setup .stepmedia,.comp .body .shot{flex-basis:96px;max-width:96px}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}


/* --- REVIEW-ONLY TREATMENT PICKER ---------------------------------------
   Renders only on /soleus/?pick=1 so Ed can compare on the real page, on his
   phone. Delete this block and theme-picker.js once the treatment is ruled. */
.picker{position:fixed;left:0;right:0;bottom:0;z-index:50;background:rgba(255,255,255,.97);border-top:1px solid var(--line);padding:10px 12px calc(10px + env(safe-area-inset-bottom));display:flex;gap:8px;justify-content:center;box-shadow:0 -2px 12px rgba(0,0,0,.08)}
.picker button{font-family:var(--ui);font-size:12px;font-weight:700;border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:20px;padding:9px 13px;cursor:pointer}
.picker button[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:#fff}
body.haspicker{padding-bottom:64px}


/* --- THE ONE-PAGE VERSION ------------------------------------------------
   One screen, the sequence that changes belief: what it does for you -> the
   facts -> the dose -> how to know it is right -> the cues -> who it makes you.
   Every word is already on the page; this is a re-display, never new copy.
   Built to be screenshotted. */
.onepagerbtn{display:block;width:100%;margin:14px 0 2px;font-family:var(--ui);font-size:13.5px;font-weight:800;letter-spacing:.02em;background:var(--accent);color:#fff;border:0;border-radius:10px;padding:14px;cursor:pointer}
.onepagerbtn:active{opacity:.85}
.op-back{position:fixed;inset:0;background:rgba(20,24,30,.55);z-index:60;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:14px}
.op{max-width:640px;margin:0 auto;background:#f6f3ec;border:1px solid #e6dfd1;border-radius:14px;overflow:hidden}
.op-close{position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;align-items:center;background:var(--accent);color:#fff;padding:11px 14px}
.op-close .ttl{font-family:var(--ui);font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.op-close button{background:rgba(255,255,255,.16);border:0;color:#fff;font-family:var(--ui);font-size:13px;font-weight:800;border-radius:8px;padding:6px 12px;cursor:pointer}
.op-body{padding:20px 18px 24px}
.op h2{font-family:Georgia,serif;font-size:26px;line-height:1.15;text-transform:none;letter-spacing:0;color:var(--ink);margin-bottom:8px}
.op .op-hook{font-family:Georgia,serif;font-style:italic;font-size:15px;line-height:1.5;color:#5c6470;margin-bottom:16px}
.op .op-rule{font-family:var(--ui);font-size:10.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);border-top:2px solid var(--accent);padding-top:7px;margin:20px 0 10px}
.op .op-fact{display:flex;gap:10px;margin-bottom:9px;align-items:flex-start}
.op .op-fact .b{width:7px;height:7px;border-radius:50%;background:var(--accent);margin-top:7px;flex-shrink:0}
.op .op-fact.warn .b{background:var(--red)}
.op .op-fact .l{font-family:var(--ui);font-weight:800;font-size:14px;color:var(--accent);line-height:1.3}
.op .op-fact.warn .l{color:var(--red)}
.op .op-fact .s{font-size:14px;line-height:1.45;color:var(--ink)}
.op .op-dose{background:var(--goldbg);border:1px solid #ecd9a8;border-radius:10px;padding:14px 16px}
.op .op-dose .d1{font-family:Georgia,serif;font-size:19px;font-weight:700;line-height:1.25;margin-bottom:5px}
.op .op-dose .d2{font-size:13.5px;line-height:1.5;color:#5c6470}
.op .op-yn{border-radius:8px;padding:11px 13px;margin-bottom:8px;font-size:14px;line-height:1.45}
.op .op-yn.y{background:var(--greenbg);border-left:4px solid var(--green)}
.op .op-yn.n{background:var(--redbg);border-left:4px solid var(--red)}
.op .op-yn b{font-family:var(--ui);font-size:11px;letter-spacing:.07em;text-transform:uppercase;display:block;margin-bottom:2px}
.op .op-yn.y b{color:var(--green)} .op .op-yn.n b{color:var(--red)}
.op .op-cue{display:flex;gap:10px;padding:8px 0;border-bottom:1px solid #e6dfd1;font-size:14px;line-height:1.4}
.op .op-cue:last-of-type{border-bottom:0}
.op .op-cue .n{font-family:var(--ui);font-weight:900;font-size:12px;color:#fff;background:var(--gold);min-width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px}
.op .op-cue .c{font-family:var(--ui);font-weight:800;font-size:13.5px}
.op .op-cue .d{font-size:13px;color:#6b5a2a;line-height:1.4}
.op .op-id{background:#fff;border:1px solid #e6dfd1;border-left:5px solid var(--gold);border-radius:10px;padding:14px 16px;font-size:14.5px;line-height:1.5}
.op .op-foot{font-family:var(--ui);font-size:10.5px;color:#8a8578;text-align:center;margin-top:18px;letter-spacing:.04em}
body.oplock{overflow:hidden}

/* --- HEADER POWER FACTS (replace the region map — Ed ruling 2026-08-28) --- */
.headerfacts{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0 4px}
.hfact{background:#12406e;color:#fff;border-radius:10px;padding:16px 18px}
.hfact .big{font-family:var(--ui);font-weight:900;font-size:19px;line-height:1.2;margin-bottom:6px}
.hfact .txt{font-size:13.5px;line-height:1.45;color:#c9d9ec}
@media (max-width:560px){.headerfacts{grid-template-columns:1fr}}

/* --- YOUR PHOTO — the client's own Day-1 shot as the why (Ed 2026-08-28) --- */
.yourphoto{border:2px solid var(--accent);border-radius:10px;overflow:hidden;margin:4px 0 20px}
.yourphoto .k{font-family:var(--ui);font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:800;color:#fff;background:var(--accent);padding:8px 14px}
.yourphoto .slot{background:var(--card);border-bottom:1px solid var(--line);padding:52px 20px;text-align:center;color:var(--soft);font-family:var(--ui);font-size:12px}
.yourphoto .cap{padding:12px 16px;font-size:14.5px;line-height:1.5}

/* --- COVERAGE MAP — region fronts, active front lit (Ed 2026-08-28) ------ */
.coverage{border:2px solid var(--accent);border-radius:10px;margin:14px 0 4px;background:var(--card);overflow:hidden}
.coverage .k{font-family:var(--ui);font-size:14px;letter-spacing:.06em;font-weight:800;color:#fff;background:var(--accent);padding:11px 16px;margin:0}
.coverage .fronts{padding:14px 16px 4px}
.coverage .note{padding:0 16px 14px}
.fronts{display:flex;flex-wrap:wrap;gap:8px}
.front{font-family:var(--ui);font-size:12.5px;font-weight:700;border:1px solid var(--line);border-radius:20px;padding:6px 13px;background:#fff;color:var(--ink)}
.front.on{background:var(--accent);border-color:var(--accent);color:#fff}
.coverage .note{margin-top:10px;font-size:13px;color:var(--soft);line-height:1.45}

.yourphoto .exampleimg{display:block;width:100%;max-height:420px;object-fit:contain;background:#0e1420}
.yourphoto .extag{font-family:var(--ui);font-size:10px;letter-spacing:.1em;font-weight:800;color:#7a5b00;background:#fff3cd;padding:6px 14px;text-transform:uppercase}

/* --- YOUR CHAIN ROWS + STRAIGHT-TALK PAYOFF (Ed 2026-08-28) -------------- */
.chainrows{display:flex;flex-wrap:wrap;gap:8px;padding:12px 16px 0}
.chain{font-family:var(--ui);font-size:12px;font-weight:800;border-radius:6px;padding:6px 12px}
.chain.red{background:var(--redbg);color:var(--red);border:1px solid #e5b7b2}
.chain.green{background:var(--greenbg);color:var(--green);border:1px solid #b9dcc8}
.payoff{background:var(--greenbg);border-left:5px solid var(--green);border-radius:8px;padding:16px 20px;margin-top:18px}
.payoff .k{font-family:var(--ui);font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:800;color:var(--green);margin-bottom:6px}
.payoff .t{font-size:16.5px;line-height:1.55;font-weight:500}
.headerfacts.one{grid-template-columns:1fr}


/* --- WEEKLY MINUTES METER (Ed feature 2026-08-31) --- */
.weekstrip{background:#f4f7fa;border:1px solid #dde5ec;border-radius:10px;padding:14px 16px;margin:6px 0}
.weekstrip .k{font-size:11px;font-weight:700;letter-spacing:.06em;color:#1a3a5c;margin-bottom:10px;text-transform:uppercase}
.wkrow{display:grid;grid-template-columns:minmax(120px,32%) 1fr 52px;gap:10px;align-items:center;margin:7px 0}
.wkname{font-size:13px;color:#333}
.wkrow.active .wkname{font-weight:700;color:#1a3a5c}
.wkbar{position:relative;height:12px;background:#e4e9ee;border-radius:6px;overflow:visible}
.wkfill{position:absolute;left:0;top:0;bottom:0;background:#2e7d52;border-radius:6px}
.wkrow.active .wkfill{background:#1a3a5c}
.wkrow.zero .wkbar{background:#d8d8d8}
.wkbar .tick{position:absolute;top:-2px;bottom:-2px;width:1px;background:#b7c2cc}
.wkbar .tick.goal{width:2px;background:#c0392b}
.wkmin{font-size:12px;color:#555;text-align:right;white-space:nowrap}
.weekstrip .note{font-size:12px;color:#666;margin-top:8px}
.weekstrip .extag{font-size:10px;color:#8a7016;background:#fdf6dd;border-radius:4px;display:inline-block;padding:2px 8px;margin-top:8px}

/* --- STICKY START BUTTON --- */
.startbtn{position:fixed;right:16px;bottom:16px;z-index:50;background:#1a3a5c;color:#fff;text-decoration:none;
  font-weight:700;font-size:14px;padding:12px 18px;border-radius:999px;box-shadow:0 4px 14px rgba(0,0,0,.25)}
.startbtn:hover{background:#14503c}

/* --- RE-TEST ROW --- */
.retest{background:#eef7f1;border-left:4px solid #2e7d52;border-radius:6px;padding:12px 14px;margin-top:10px}
.retest .k{font-size:11px;font-weight:700;letter-spacing:.06em;color:#2e7d52;margin-bottom:4px}
.retest .t{font-size:14px;color:#333}


/* --- 12-WEEK FOCUS CARD --- */
.focuscard{background:#0f2b45;border-radius:12px;padding:16px 18px;color:#fff;margin:6px 0}
.focuscard .k{font-size:11px;font-weight:700;letter-spacing:.08em;color:#ffd766;margin-bottom:12px;text-transform:uppercase}
.focusgrid{display:grid;grid-template-columns:1fr 1.2fr 1fr;gap:14px}
@media(max-width:640px){.focusgrid{grid-template-columns:1fr}}
.fphoto .ftag,.fplan .ftag{font-size:10px;font-weight:700;letter-spacing:.06em;color:#9fc0dd;margin-bottom:6px}
.fphoto img{width:100%;border-radius:8px}
.fphoto .slot{background:rgba(255,255,255,.08);border:1px dashed rgba(255,255,255,.35);border-radius:8px;
  min-height:120px;display:flex;align-items:center;justify-content:center;font-size:12px;color:#cfe0ef;padding:10px;text-align:center}
.fplan ul{margin:0;padding-left:18px;font-size:13px;color:#e8f1f9}
.fplan li{margin:3px 0}
.ftotal{margin-top:10px;font-size:18px;font-weight:800;color:#ffd766}
.focuscard .extag{font-size:10px;color:#ffd766;opacity:.75;margin-top:10px}
/* maxed meter row */
.wkrow.maxed .wkfill{background:#b8860b}
.wkrow.maxed .wkmin{color:#b8860b;font-weight:800}

.fgoalhead{margin-top:12px}
.fgoalrow{display:grid;grid-template-columns:minmax(90px,30%) 1fr 90px;gap:8px;align-items:center;margin:5px 0}
.fgname{font-size:12px;color:#e8f1f9}
.fgoalrow .wkbar{background:rgba(255,255,255,.15);height:10px}
.fgoalrow .wkfill{background:#ffd766}
.fgmin{font-size:11px;color:#cfe0ef;text-align:right;white-space:nowrap}

.retest .t.tw{margin-top:6px;font-size:12px;color:#2e7d52;font-weight:600}
.fsnack{margin-top:12px;border:1px solid #ffd766;border-radius:8px;padding:10px 12px;background:rgba(255,215,102,.08)}
.fsnack .t{font-size:13px;color:#fff}

/* the sitting counter-signal — promoted to a banner (Ed 2026-08-31) */
.sitline{margin-top:12px;background:#1a3a5c;color:#fff;border-radius:8px;padding:12px 16px;
  font-size:15px;font-weight:700;line-height:1.45}
.twdate{margin-top:8px;font-size:16px;font-weight:800;color:#1a3a5c;letter-spacing:.02em}

/* --- STRENGTH EXTENSION 2026-09-26: written directions + the lift ------- */
.dirlead{margin:0 0 12px}
details.directions{background:var(--card);border:1px solid var(--line);border-left:5px solid var(--accent);border-radius:8px;padding:0;margin:0 0 12px}
details.directions summary{cursor:pointer;font-family:var(--ui);font-weight:800;font-size:15px;color:var(--accent);padding:14px 18px;list-style:none;display:flex;align-items:center;gap:10px}
details.directions summary::-webkit-details-marker{display:none}
details.directions summary::before{content:'+';font-size:20px;line-height:1;width:22px;text-align:center;flex-shrink:0}
details.directions[open] summary::before{content:'\2013'}
details.directions .dirbody{padding:0 18px 16px;font-size:17px}
details.directions .dirbody p{margin:0 0 14px;max-width:68ch}
details.directions .dirhead{font-family:var(--ui);font-weight:800;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin:18px 0 6px}
.liftnote{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:14px 18px;margin:14px 0}
.variants{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin:14px 0}
.variant{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:14px 16px}
.variant.no{background:var(--redbg);border-color:var(--red)}
.variant .k{font-family:var(--ui);font-weight:800;font-size:13px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:6px}
.variant.no .k{color:var(--red)}
.variant.yes{background:var(--greenbg);border-color:var(--green)}
.variant.yes .k{color:var(--green)}
.variant .t{font-size:16px}

/* --- THE DOT (Ed ruling 2026-09-26): earned = green, restricted = red ---- */
.gatedot{display:flex;align-items:center;gap:12px;margin:14px 0 4px;font-family:var(--ui);font-weight:800;font-size:15px;color:var(--ink)}
.gatedot .dot{width:26px;height:26px;border-radius:50%;flex-shrink:0;background:#9aa3ad;box-shadow:0 0 0 4px rgba(0,0,0,.06)}
.gatedot[data-state="earned"] .dot{background:var(--green);box-shadow:0 0 0 4px var(--greenbg)}
.gatedot[data-state="earned"]{color:var(--green)}
.gatedot[data-state="restricted"] .dot{background:var(--red);box-shadow:0 0 0 4px var(--redbg)}
.gatedot[data-state="restricted"]{color:var(--red)}
.gatedot[data-state="checking"]{color:var(--soft)}