/* ============================================================================
   MINDSTER — APP SHELL v3 · STYLESHEET
   Built 2026-09-01 · BUILD session. Loads AFTER assets/movement-page.css and
   only adds the shell's own components — variables, .wkbar/.wkfill/.tick,
   .retest, .sitline, .extag, .twdate are the established visual language,
   reused as-is. Four tabs per the recommended composite.

   THE LAW ON EVERY SURFACE: measure to motivate, never to demotivate. Zero is
   neutral gray labeled EMPTY with the signal as the invitation — never red,
   never a deficit, and never the word "open" (that word belongs to the gates).

   MOBILE RULE (client-sim finding F5): the signal / gloss lines are NEVER
   hidden at any width. There is no display:none on .apsig in this file.
   ========================================================================== */

.appwrap{max-width:520px;margin:0 auto;padding:0 16px 84px}

/* --- per-tab header (same rhythm as header.top) ---------------------------- */
.apphead{background:#f6f3ec;border-bottom:1px solid #e6dfd1;padding:18px 16px 12px;margin:0 -16px}
.apphead .brand{font-size:11px}
.apphead h1{font-family:Georgia,serif;font-size:23px;line-height:1.2;margin:4px 0 0}
.apphead .d{font-family:var(--ui);font-size:12px;color:var(--soft);margin-top:3px;line-height:1.45}

/* --- the bottom tab bar ---------------------------------------------------- */
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:40;display:flex;background:#fff;border-top:1px solid var(--line)}
.tabbar .tbin{display:flex;width:100%;max-width:520px;margin:0 auto}
.tabbar button{flex:1;font-family:var(--ui);font-size:10px;font-weight:800;letter-spacing:.04em;color:var(--soft);background:none;border:0;padding:9px 2px 11px;cursor:pointer}
.tabbar button .ic{display:block;font-size:16px;margin-bottom:2px}
.tabbar button[aria-pressed="true"]{color:var(--accent)}

/* --- screens --------------------------------------------------------------- */
.screen{display:none;padding-bottom:24px}
.screen.on{display:block}
.k{font-family:var(--ui);font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#1a3a5c;margin:16px 0 6px}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin:10px 0}
.card .t{font-size:14.5px;line-height:1.55}
.note{font-family:var(--ui);font-size:11.5px;color:var(--soft);line-height:1.5;margin:6px 0}

/* --- PHOTOS ------------------------------------------------------------------ */
.photoframe{width:100%;height:78vh;min-height:520px;margin:10px 0;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff}
.photoframe iframe{width:100%;height:100%;border:0;display:block}
.clienttoggle{display:flex;gap:8px;margin:10px 0 4px}
.clienttoggle button{flex:1;font-family:var(--ui);font-size:12px;font-weight:800;padding:9px;border-radius:8px;border:1px solid var(--line);background:#fff;color:#5c6470;cursor:pointer}
.clienttoggle button.on{background:var(--accent);border-color:var(--accent);color:#fff}

/* --- TODAY ----------------------------------------------------------------- */
.gobtn{display:block;width:100%;font-family:var(--ui);font-size:13.5px;font-weight:800;background:var(--accent);color:#fff;border:0;border-radius:10px;padding:13px;cursor:pointer;margin:10px 0 4px;text-align:center;text-decoration:none;box-sizing:border-box}
.snacklinks{margin-top:8px}
.snacklinks a{display:block;font-family:var(--ui);font-size:12.5px;font-weight:700;color:var(--accent);text-decoration:none;border-bottom:0;padding:5px 0}
.todaymin{font-family:var(--ui);font-size:13px;color:#333;line-height:1.5}
.todaymin b{font-size:16px;color:#1a3a5c}

/* --- TODAY v3: the four pillars, visible (Ed-ruled 2026-09-01) ------------- */
.pillchips{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:12px 0 2px}
.pillchips button{font-family:var(--ui);background:#fff;border:1px solid var(--line);border-radius:8px;padding:7px 3px;cursor:pointer;text-align:center}
.pillchips .pcn{display:block;font-size:8.5px;font-weight:800;letter-spacing:.04em;color:#1a3a5c}
.pillchips .pcw{display:block;font-size:9px;color:var(--soft);margin-top:2px;text-transform:capitalize}
.pillchips button.ontoday{border-color:var(--accent);background:#eef3f9}
.pillchips button.ontoday .pcw{color:var(--accent);font-weight:700}

/* the routine rows — every item a link, its why beneath it */
.snacktag{font-family:var(--ui);font-size:9.5px;font-weight:800;letter-spacing:.09em;color:#8a7016;margin-bottom:5px}
.snacktag.cxm{color:#175a5e}   /* the mobility block */
.snacktag.cxp{color:#2d5378}   /* the other pillars' blocks */
.routinebreakdown{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:4px 14px;margin:8px 0 14px}
.rbrow{font-family:var(--ui);font-size:13px;color:#1a3a5c;padding:8px 0;border-top:1px solid var(--line)}
.rbrow:first-child{border-top:0}
.rbrow .rbmin{float:right;font-weight:800;color:var(--soft);font-size:11px;letter-spacing:.04em}
.rt{border-top:1px solid var(--line);padding:9px 0 7px}
.rt:nth-of-type(2){border-top:0;padding-top:2px}
.rt>a{font-family:var(--ui);font-size:13px;font-weight:700;color:var(--accent);text-decoration:none;border-bottom:1px dotted #9fb0c8}
.rt .rmin{font-family:var(--ui);font-size:10px;font-weight:800;color:var(--soft);letter-spacing:.04em;float:right;margin-top:2px}
.rt .rwhy{font-family:var(--ui);font-size:11px;color:var(--soft);line-height:1.45;margin-top:3px;clear:both}

/* the photo timeline — the growing strip (Ed-ruled 2026-09-01) */
.phototl{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:8px 0 4px}
.phototl .ptag{font-family:var(--ui);font-size:9px;font-weight:800;letter-spacing:.06em;color:var(--soft);margin-bottom:4px;text-transform:uppercase}
.phototl .apslot{min-height:88px;font-size:10px}
.phototl .ghost .apslot{border-style:dotted;color:var(--soft)}

/* the desk-day line per pillar (client-sim F10) */
.deskline{font-family:var(--ui);font-size:11.5px;color:#333;line-height:1.5;margin:6px 0 2px}

/* the belief card — the identity system's daily surface */
.belief{background:var(--goldbg);border:1px solid #ecd9a8;border-left:5px solid var(--gold);border-radius:10px;padding:12px 14px;margin:10px 0}
.belief .bk{font-family:var(--ui);font-size:9.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);margin-bottom:4px}
.belief .bt{font-size:15.5px;line-height:1.45;font-weight:500}
.belief .bsrc{font-family:var(--ui);font-size:10.5px;color:#8a7016;margin-top:5px}
.goldstar{color:var(--gold);font-weight:900}

/* photo slots + pairs (established placeholder language) */
.apslot{border:1px dashed var(--line);border-radius:8px;background:var(--card);color:var(--soft);font-family:var(--ui);font-size:10.5px;text-align:center;display:flex;align-items:center;justify-content:center;padding:8px;min-height:104px;line-height:1.4}
.photopair{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:8px 0}
.photopair .ptag{font-family:var(--ui);font-size:9.5px;font-weight:800;letter-spacing:.08em;color:var(--soft);margin-bottom:4px;text-transform:uppercase}
.paircap{font-size:12.5px;line-height:1.5;margin-top:2px}

/* --- COVERAGE -------------------------------------------------------------- */
.target{background:#fff;border:1px solid var(--line);border-left:5px solid var(--accent);border-radius:10px;padding:12px 14px;margin:10px 0}
.target .t{font-size:13.5px;line-height:1.55}
.headline{font-family:var(--ui);font-size:14px;font-weight:800;color:#1a3a5c;margin:12px 0 4px}

.appillar{background:#f4f7fa;border:1px solid #dde5ec;border-radius:10px;margin:10px 0;overflow:hidden}
.aphead{display:flex;justify-content:space-between;align-items:center;gap:10px;width:100%;text-align:left;background:none;border:0;padding:12px 14px;cursor:pointer;font:inherit}
.aphead .pn{font-family:var(--ui);font-size:12px;font-weight:800;letter-spacing:.08em;color:#1a3a5c;text-transform:uppercase}
.aphead .pc{font-family:var(--ui);font-size:11.5px;color:var(--soft);text-align:right;line-height:1.35}
.aphead .pc b{color:#1a3a5c}
.apbody{border-top:1px solid #e2e9ef;padding:8px 14px 12px}
.unitnote{font-family:var(--ui);font-size:11.5px;color:var(--soft);line-height:1.5;margin:4px 0 8px}

.aprow{display:grid;grid-template-columns:minmax(120px,46%) 1fr 82px;gap:8px;align-items:center;margin:10px 0}
.apname{font-family:var(--ui);font-size:12.5px;font-weight:700;color:#333;line-height:1.3}
.apname a{color:inherit;text-decoration:none;border-bottom:1px dotted #9fb0c8}
.apname a:hover{color:#12406e;border-bottom-color:#12406e}
.apsig{font-family:var(--ui);font-size:11px;font-weight:400;color:var(--soft);line-height:1.4;margin-top:1px}
.aprow.zero .apsig{color:#333;font-weight:500}
.aprow .wkbar{height:11px}
.aprow.zero .wkbar{background:#d8d8d8}
.aprow .wkfill{background:#2e7d52}
.aprow.opt .wkfill{background:#b8860b}
.apstat{font-family:var(--ui);font-size:11px;text-align:right;white-space:nowrap;color:#555;line-height:1.35}
.apstat b{display:block;font-size:10.5px;letter-spacing:.03em}
.aprow.covered .apstat b{color:#2e7d52}
.aprow.opt .apstat b{color:#b8860b}
.aprow.zero .apstat{color:var(--soft);font-family:var(--ui);font-weight:700;font-size:10.5px;letter-spacing:.04em}
.apstat .sub{display:block;font-size:9.5px;color:var(--soft);letter-spacing:.02em;font-weight:400}

/* the mobility complexes' color identities (Ed-ruled 2026-09-01) */
.aprow.cx-ankle{border-left:3px solid #6ea6aa;padding-left:8px}
.aprow.cx-hip{border-left:3px solid #a08ab8;padding-left:8px}
.aprow.cx-upper{border-left:3px solid #8aa9c4;padding-left:8px}
.apgroup{font-family:var(--ui);font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;margin:12px 0 2px;border-bottom:1px solid #dde5ec;padding-bottom:3px;color:var(--soft)}
.apgroup.cx-ankle{color:#175a5e;border-bottom-color:#9cc4c6}
.apgroup.cx-hip{color:#563a6b;border-bottom-color:#c3b2d4}
.apgroup.cx-upper{color:#2d5378;border-bottom-color:#aac1d6}

/* --- IDENTITY -------------------------------------------------------------- */
.idrow{display:flex;gap:10px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:8px;padding:10px 12px;margin:8px 0}
.idrow.goldrow{background:var(--goldbg);border-color:#ecd9a8}
.idrow .chk{font-family:var(--ui);font-weight:900;color:var(--green);flex-shrink:0;margin-top:1px}
.idrow.goldrow .chk{color:var(--gold)}
.idrow .it{font-size:14px;line-height:1.45}
.idrow .isrc{font-family:var(--ui);font-size:10.5px;color:var(--soft);margin-top:3px;line-height:1.45}
.idrow .isrc a{color:var(--accent);font-weight:700;text-decoration:none;border-bottom:1px dotted #9fb0c8}
.idrow .isrc button{font-family:var(--ui);font-size:10.5px;font-weight:700;color:var(--accent);background:none;border:0;padding:0;cursor:pointer;border-bottom:1px dotted #9fb0c8}

/* the journal timeline (concept 3) */
.milestone{display:flex;gap:10px;padding:10px 0 14px 16px;border-left:2px solid var(--line);position:relative;margin-left:6px}
.milestone::before{content:'';position:absolute;left:-5px;top:14px;width:8px;height:8px;border-radius:50%;background:var(--accent)}
.milestone.gold::before{background:var(--gold)}
.milestone.check::before{background:var(--green)}
.milestone .mw{font-family:var(--ui);font-size:10px;font-weight:800;letter-spacing:.06em;color:var(--soft);min-width:44px;text-transform:uppercase;margin-top:2px}
.milestone .mt{font-size:13px;line-height:1.5;flex:1}
.milestone .photopair .apslot{min-height:70px}

/* --- TEST WEEK ------------------------------------------------------------- */
.gatechip{font-family:var(--ui);font-size:10.5px;font-weight:800;border-radius:6px;padding:3px 9px;background:var(--redbg);color:var(--red);border:1px solid #e5b7b2;display:inline-block;margin:2px 3px 2px 0}
.gatecard{background:#fff;border:1px solid var(--line);border-left:5px solid var(--red);border-radius:8px;padding:11px 13px;margin:8px 0}
.gatecard .gm{font-family:var(--ui);font-size:12.5px;font-weight:700;color:#333}
.gatecard .gt{font-size:13px;line-height:1.5;margin-top:3px}
.gatecard a{font-family:var(--ui);font-size:12px;font-weight:700;color:var(--accent);text-decoration:none;border-bottom:1px dotted #9fb0c8;display:inline-block;margin-top:6px}
.retestcard{background:#fff;border:1px solid var(--line);border-left:5px solid #2e7d52;border-radius:8px;padding:11px 13px;margin:8px 0}
.retestcard .gm{font-family:var(--ui);font-size:12.5px;font-weight:700;color:#1a3a5c}
.retestcard .gt{font-size:13px;line-height:1.5;margin-top:3px}
.retestcard a{font-family:var(--ui);font-size:12px;font-weight:700;color:var(--accent);text-decoration:none;border-bottom:1px dotted #9fb0c8;display:inline-block;margin-top:6px}

/* shared bits */
.extag{font-family:var(--ui);font-size:10px;font-weight:800;letter-spacing:.06em;color:#8a7016;background:#fdf6dd;border-radius:4px;display:inline-block;padding:2px 8px;margin-top:10px}
.applink{font-family:var(--ui);font-size:12.5px;font-weight:700;color:var(--accent);text-decoration:none;border-bottom:1px dotted #9fb0c8}

/* --- YOUR TRAJECTORY (2026-09-06) ------------------------------------------ */
.trajchart{background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px;margin:10px 0}
.trajchart svg{width:100%;height:auto;display:block}
.trajlegend{display:flex;flex-direction:column;gap:6px;margin:6px 0 12px}
.trajleg{font-family:var(--ui);font-size:12px;color:#5c6470;display:flex;align-items:center;gap:8px}
.trajleg .sw{display:inline-block;width:22px;height:4px;border-radius:2px;flex:0 0 auto}
.trajleg .sw-gray{background:#c7cdd4}
.trajleg .sw-gold{background:#d7a948}

/* ============================================================================
   THE IDENTITY INTEGRATION PASS — 2026-09-03
   The video-to-identity loop on Today, the creed lines and the what-we-measure
   stance on Coverage, beliefs resurfacing on the pillar sections, the
   CHECKED TODAY tag on Identity. Receipt/idline follow the shared components
   in PREVIEWS/STRENGTH_UX_CONCEPTS.html.
   ========================================================================== */

/* the checkpoint line on every routine movement row (Today) */
.ckpt{font-family:var(--ui);font-size:10.5px;color:#8a7016;line-height:1.45;margin-top:3px}

/* the checked-statements flow (Today, on the completed block) */
.ckflow{background:var(--goldbg);border:1px solid #ecd9a8;border-radius:8px;padding:9px 12px;margin-top:9px}
.ckflow .cfk{font-family:var(--ui);font-size:9px;font-weight:800;letter-spacing:.1em;color:#8a7016}
.ckflow .cfs{font-size:13px;line-height:1.45;margin-top:6px}
.ckflow .cfsrc{font-family:var(--ui);font-size:10.5px;color:#8a7016;margin-top:1px}
.ckflow .cfgo{font-family:var(--ui);font-size:11.5px;font-weight:700;color:var(--accent);background:none;border:0;padding:0;margin-top:8px;cursor:pointer;border-bottom:1px dotted #9fb0c8}

/* the session-receipt close (Today) — the STRENGTH_UX_CONCEPTS component */
.receipt{background:#fff;border:1px solid var(--line);border-left:5px solid var(--green);border-radius:10px;padding:12px 14px;margin:10px 0}
.receipt .rk2{font-family:var(--ui);font-size:9.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--green);margin-bottom:5px}
.receipt .rlead{font-size:13.5px;line-height:1.5;margin-bottom:6px}
.receipt .rnote{font-family:var(--ui);font-size:10.5px;color:var(--soft);margin-top:7px;line-height:1.45}
.idline{display:flex;gap:10px;align-items:flex-start;background:var(--goldbg);border:1px solid #ecd9a8;border-radius:8px;padding:9px 11px;cursor:pointer}
.idline input{margin-top:2px;accent-color:var(--gold)}
.idline .kk{display:block;font-family:var(--ui);font-size:9px;font-weight:800;letter-spacing:.1em;color:var(--gold)}
.idline .ktext{font-size:13.5px;line-height:1.45}

/* the anti-gamification statement (Coverage) */
.antigame{font-family:var(--ui);font-size:12.5px;font-weight:700;line-height:1.55;color:#fff;background:var(--accent);border-radius:10px;padding:12px 14px;margin:12px 0}

/* your own belief on the pillar it belongs to (Coverage sections) */
.pillbelief{background:var(--goldbg);border:1px solid #ecd9a8;border-left:4px solid var(--gold);border-radius:8px;padding:8px 11px;margin:8px 0}
.pillbelief .pbk{font-family:var(--ui);font-size:9px;font-weight:800;letter-spacing:.08em;color:#8a7016}
.pillbelief .pbt{font-size:13px;line-height:1.45;margin-top:3px}

/* HOW MINDSTER WORKS — the five creed lines (Coverage bottom) */
.lawscard{background:#fff;border:1px solid var(--line);border-radius:10px;padding:8px 14px 10px;margin:8px 0}
.lawscard .lawnote{font-family:var(--ui);font-size:11px;color:var(--soft);line-height:1.5;padding:4px 0 6px;border-bottom:1px solid var(--line)}
.lawrow{border-top:1px solid var(--line)}
.lawrow:first-of-type{border-top:0}
.lawline{display:block;width:100%;text-align:left;background:none;border:0;padding:10px 0;cursor:pointer;font-family:Georgia,serif;font-size:14.5px;line-height:1.4;color:var(--ink)}
.lawline .lmark{font-family:var(--ui);font-size:11px;color:var(--soft);margin-right:7px}
.lawline[aria-expanded="true"]{font-weight:700}
.lawwhy{font-family:var(--ui);font-size:12px;color:#333;line-height:1.55;padding:0 0 10px 20px}

/* the CHECKED TODAY tag (Identity) */
.tdtag{font-family:var(--ui);font-size:8.5px;font-weight:800;letter-spacing:.08em;color:#175a5e;background:#e5f1f1;border-radius:4px;padding:2px 6px;vertical-align:2px;white-space:nowrap}

/* ONE APP v1 (2026-09-03): the pillar-page link atop each Coverage section */
.pillpage{margin:6px 0 8px;line-height:1.5}