
:root{
  /* Layout: an iPhone app in Apple's grammar. Large titles that collapse into a sticky bar,
     inset grouped cards on a soft ground, one floating tab bar. Hunter green and gold carry
     the brand through feature cards, selected states and the primary buttons. */
  --bg:#F7F4EA;
  --card:#FFFFFF;
  --fill:#EFEBDF;
  --fill-2:#E5E0D0;
  --seg-on:#FFFFFF;
  --text:#0D2119;
  --text-2:#3F4A42;
  --text-3:#5C665F;
  --accent:#7A6420;
  --tint:#1F5A3D;
  --gold:#CDB46A;
  --on-gold:#0D2119;
  --sep:rgba(13,33,25,.12);
  --edge:rgba(13,33,25,.38);
  --danger:#B3261E;
  --feature:#153B2B;
  --on-feature:#F3EEDF;
  --on-feature-2:#CFC9B6;
  --feature-accent:#CDB46A;
  --feature-sep:rgba(243,238,223,.16);
  --track:rgba(13,33,25,.12);
  --living:#1F5A3D;
  --imp:#A68A2C;
  --bar:#3E7A5A;
  --rail:#B5CDBF;
  --bar-now:#A68A2C;
  --chip-on:#153B2B;
  --chip-on-text:#F3EEDF;
  --good-bg:#E3EFE7;
  --good-text:#1F5A3D;
  --bar-glass:rgba(255,255,255,.8);
  --bar-solid:#FFFFFF;
  --tab-edge:rgba(13,33,25,.08);
  --scrim:rgba(13,33,25,.4);
  --shadow:0 12px 32px -14px rgba(13,33,25,.35);
  --display:'Cormorant Garamond','Cormorant',Georgia,'Times New Roman',serif;
  /* Michael's Everest Therapy Solutions site's type (Oct 27, 2026: "Make the font my website font"): Cormorant Garamond
     for display and the TOWARDS wordmark, Avenir Next for everything else, Mulish where Avenir Next isn't installed.
     (Cinzel stays only inside the lock-screen picture, a graphic he already approved.) */
  --mark:'Cormorant Garamond','Cormorant',Georgia,serif;
  --ui:'Avenir Next',Avenir,'Mulish','Segoe UI',system-ui,-apple-system,'Helvetica Neue',Arial,sans-serif;
  --gutter:16px;
  --path-band:#ECE6D4;
  --trail:rgba(13,33,25,.32);
  --halo:rgba(62,122,90,.35);
  --logo-light:block;
  --logo-dark:none;
  color-scheme:light;
}
/* Premium layer (Oct 25, 2026). Depth and light, not new colors: hairline edges, layered shadows tinted with the
   brand green, a soft gold glow behind the page, a richer feature card, a glass navigation layer (Apple keeps
   Liquid Glass to bars and controls, never content), springy presses and a gentle entrance. Overrides follow
   the base rules at the end of this stylesheet. */
:root{
  --edge-soft:rgba(98,80,26,.10);
  --hi:rgba(255,255,255,.9);
  --lift-1:0 1px 1px hsl(150 45% 12% / .035),0 2px 4px -1px hsl(150 45% 12% / .05),0 8px 18px -8px hsl(150 45% 12% / .09);
  --lift-2:0 1px 2px hsl(150 45% 12% / .05),0 6px 12px -4px hsl(150 45% 12% / .08),0 18px 36px -14px hsl(150 45% 12% / .16);
  --lift-3:0 2px 4px hsl(150 50% 8% / .10),0 12px 24px -8px hsl(150 50% 8% / .22),0 32px 56px -24px hsl(150 50% 8% / .38);
  --glow-1:rgba(205,180,106,.26);
  --glow-2:rgba(31,90,61,.10);
  --gold-hi:#E2CC8C;
  --gold-lo:#C4A757;
  --gold-shadow:0 1px 1px rgba(122,98,26,.18),0 6px 14px -6px rgba(166,138,44,.55);
  --feature-hi:#1C4C3A;
  --feature-lo:#0F2E22;
  --tile-hi:#F4F0E5;
  --tile-lo:#E8E1CF;
  --glass:rgba(255,255,255,.66);
  --glass-edge:rgba(255,255,255,.75);
  --glass-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 2px 6px hsl(150 45% 12% / .06),0 14px 34px -12px hsl(150 45% 12% / .30);
  --tab-on:#1F5A3D;
  --tab-on-bg:linear-gradient(180deg,rgba(31,90,61,.12),rgba(31,90,61,.07));
  --prog:linear-gradient(90deg,#2F7553,#1F5A3D);
  --ease-spring:cubic-bezier(.32,.72,0,1);
  --ease-press:cubic-bezier(.2,.8,.2,1);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --edge-soft:rgba(243,238,223,.07); --hi:rgba(243,238,223,.07);
    --lift-1:0 1px 1px rgba(0,0,0,.25),0 8px 20px -10px rgba(0,0,0,.55);
    --lift-2:0 1px 2px rgba(0,0,0,.3),0 14px 30px -12px rgba(0,0,0,.6);
    --lift-3:0 2px 6px rgba(0,0,0,.35),0 24px 48px -18px rgba(0,0,0,.75);
    --glow-1:rgba(205,180,106,.10); --glow-2:rgba(62,122,90,.22);
    --gold-shadow:0 1px 1px rgba(0,0,0,.3),0 8px 18px -8px rgba(205,180,106,.35);
    --feature-hi:#22543F; --feature-lo:#143A2B;
    --tile-hi:#22493A; --tile-lo:#1A3C2F;
    --glass:rgba(24,56,43,.62); --glass-edge:rgba(243,238,223,.12);
    --glass-shadow:inset 0 1px 0 rgba(243,238,223,.10),0 2px 6px rgba(0,0,0,.25),0 16px 36px -12px rgba(0,0,0,.6);
    --tab-on:#E2CC8C; --tab-on-bg:linear-gradient(180deg,rgba(205,180,106,.18),rgba(205,180,106,.10));
    --prog:linear-gradient(90deg,#E2CC8C,#C4A757);
  }
}
:root[data-theme="dark"]{
  --edge-soft:rgba(243,238,223,.07); --hi:rgba(243,238,223,.07);
  --lift-1:0 1px 1px rgba(0,0,0,.25),0 8px 20px -10px rgba(0,0,0,.55);
  --lift-2:0 1px 2px rgba(0,0,0,.3),0 14px 30px -12px rgba(0,0,0,.6);
  --lift-3:0 2px 6px rgba(0,0,0,.35),0 24px 48px -18px rgba(0,0,0,.75);
  --glow-1:rgba(205,180,106,.10); --glow-2:rgba(62,122,90,.22);
  --gold-shadow:0 1px 1px rgba(0,0,0,.3),0 8px 18px -8px rgba(205,180,106,.35);
  --feature-hi:#22543F; --feature-lo:#143A2B;
  --tile-hi:#22493A; --tile-lo:#1A3C2F;
  --glass:rgba(24,56,43,.62); --glass-edge:rgba(243,238,223,.12);
  --glass-shadow:inset 0 1px 0 rgba(243,238,223,.10),0 2px 6px rgba(0,0,0,.25),0 16px 36px -12px rgba(0,0,0,.6);
  --tab-on:#E2CC8C; --tab-on-bg:linear-gradient(180deg,rgba(205,180,106,.18),rgba(205,180,106,.10));
  --prog:linear-gradient(90deg,#E2CC8C,#C4A757);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0D2119; --card:#153428; --fill:#1D4234; --fill-2:#24503F; --seg-on:#2C5A47;
    --text:#F3EEDF; --text-2:#C9C3B0; --text-3:#ABA691;
    --accent:#CDB46A; --tint:#CDB46A; --gold:#CDB46A; --on-gold:#0D2119;
    --sep:rgba(243,238,223,.12); --edge:rgba(243,238,223,.42); --danger:#FF8A80;
    --feature:#1C4334; --on-feature:#F3EEDF; --on-feature-2:#CFC9B6; --feature-accent:#CDB46A; --feature-sep:rgba(243,238,223,.14);
    --track:rgba(243,238,223,.14); --living:#F3EEDF; --imp:#CDB46A; --bar:#7FA88E; --rail:#3F6553; --bar-now:#CDB46A;
    --chip-on:#CDB46A; --chip-on-text:#0D2119; --good-bg:rgba(127,168,142,.18); --good-text:#B4D2BE;
    --bar-glass:rgba(21,52,40,.82); --bar-solid:#153428; --tab-edge:rgba(243,238,223,.1); --scrim:rgba(0,0,0,.58); --shadow:0 18px 40px -18px rgba(0,0,0,.8);
    --path-band:#163327; --trail:rgba(243,238,223,.3); --halo:rgba(127,168,142,.45);
    --logo-light:none; --logo-dark:block;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#0D2119; --card:#153428; --fill:#1D4234; --fill-2:#24503F; --seg-on:#2C5A47;
  --text:#F3EEDF; --text-2:#C9C3B0; --text-3:#ABA691;
  --accent:#CDB46A; --tint:#CDB46A; --gold:#CDB46A; --on-gold:#0D2119;
  --sep:rgba(243,238,223,.12); --edge:rgba(243,238,223,.42); --danger:#FF8A80;
  --feature:#1C4334; --on-feature:#F3EEDF; --on-feature-2:#CFC9B6; --feature-accent:#CDB46A; --feature-sep:rgba(243,238,223,.14);
  --track:rgba(243,238,223,.14); --living:#F3EEDF; --imp:#CDB46A; --bar:#7FA88E; --rail:#3F6553; --bar-now:#CDB46A;
  --chip-on:#CDB46A; --chip-on-text:#0D2119; --good-bg:rgba(127,168,142,.18); --good-text:#B4D2BE;
  --bar-glass:rgba(21,52,40,.82); --bar-solid:#153428; --tab-edge:rgba(243,238,223,.1); --scrim:rgba(0,0,0,.58); --shadow:0 18px 40px -18px rgba(0,0,0,.8);
  --path-band:#163327; --trail:rgba(243,238,223,.3); --halo:rgba(127,168,142,.45);
    --logo-light:none; --logo-dark:block;
  color-scheme:dark;
}
@media (min-width:414px){:root{--gutter:20px}}

/* Apple text sizes: 1rem = Body (17px), following the iPhone's Text Size setting on touch devices */
html{font-size:106.25%;-webkit-text-size-adjust:100%}
@media (hover:none) and (pointer:coarse){@supports (font:-apple-system-body){html{font:-apple-system-body}}}
*{box-sizing:border-box}
body{background:var(--bg);color:var(--text);font-family:var(--ui);font-size:1rem;line-height:1.38;font-weight:400;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:30;background:var(--bg)}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer;-webkit-user-select:none;user-select:none}
p{margin:0}
h1,h2,h3{margin:0}
a{color:var(--tint)}
:focus-visible{outline:3px solid var(--tint);outline-offset:2px;border-radius:12px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.t-large{font-family:var(--display);font-weight:500;font-size:2.12rem;line-height:1.12;letter-spacing:-.005em;text-wrap:balance}
.t-title1{font-family:var(--display);font-weight:500;font-size:1.76rem;line-height:1.15;text-wrap:balance}
.t-title2{font-weight:700;font-size:1.294rem;line-height:1.27;text-wrap:balance}
.t-title3{font-weight:700;font-size:1.176rem;line-height:1.25}
.t-headline{font-weight:700;font-size:1rem;line-height:1.3}
.t-body{font-size:1rem;line-height:1.42}
.t-callout{font-size:.941rem;line-height:1.36}
.t-sub{font-size:.882rem;line-height:1.36}
.t-foot{font-size:.765rem;line-height:1.38}
.c2{color:var(--text-2)}
.c3{color:var(--text-3)}
.num{font-variant-numeric:tabular-nums}
.quote{font-family:var(--display);font-style:italic;font-weight:500;font-size:1.3rem;line-height:1.35}

/* shell */
.navbar{position:sticky;top:env(safe-area-inset-top,0px);z-index:25;border-bottom:1px solid transparent;transition:background-color .2s,border-color .2s}
.navbar.scrolled{background:var(--bar-glass);-webkit-backdrop-filter:blur(20px) saturate(1.5);backdrop-filter:blur(20px) saturate(1.5);border-bottom-color:var(--sep)}
.navbar-in{max-width:600px;margin:0 auto;min-height:52px;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:8px;padding-left:max(var(--gutter),env(safe-area-inset-left,0px));padding-right:max(var(--gutter),env(safe-area-inset-right,0px))}
.brand{display:flex;align-items:center;gap:9px;min-width:0}
.brand img{width:30px;height:30px;flex:none}
.logo-l{display:var(--logo-light)}
.logo-d{display:var(--logo-dark)}
.brand-word{font-family:var(--mark);font-weight:600;font-size:1.06rem;letter-spacing:.2em;transition:opacity .2s}
.navbar.scrolled .brand-word{opacity:0}
.nav-title{font-weight:700;font-size:1rem;opacity:0;transition:opacity .2s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:52vw}
.navbar.scrolled .nav-title{opacity:1}
.nav-right{justify-self:end;display:flex;align-items:center}
.app{max-width:600px;margin:0 auto;padding-left:max(var(--gutter),env(safe-area-inset-left,0px));padding-right:max(var(--gutter),env(safe-area-inset-right,0px));padding-block:2px calc(108px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:32px}
.ltitle{display:flex;flex-direction:column;gap:4px}

/* controls */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:0 24px;border-radius:999px;border:1.5px solid transparent;font-weight:700;font-size:1rem;text-decoration:none;transition:transform .12s ease,opacity .12s}
.btn:active,.row:active,.choice:active,.chip:active{opacity:.75}
.btn-primary{background:var(--gold);color:var(--on-gold)}
.btn-secondary{background:transparent;border-color:var(--tint);color:var(--tint)}
.btn-quiet{background:var(--fill);color:var(--text)}
.btn-block{width:100%}
.btn-sm{min-height:44px;padding:0 18px;font-size:.941rem;white-space:nowrap;flex:none}
.on-feature .btn-secondary{border-color:var(--feature-accent);color:var(--feature-accent)}
.tbtn{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 4px;background:none;border:0;color:var(--tint);font-weight:700;font-size:1rem;text-decoration:none}
.tbtn.danger{color:var(--danger)}
/* Add to Home Screen steps */
.howto{list-style:none;margin:0;padding:16px;gap:14px}
.howto-step{display:flex;gap:12px;align-items:flex-start}
.howto-n{flex:none;width:28px;height:28px;border-radius:50%;background:var(--gold);color:var(--on-gold);display:grid;place-items:center;font-weight:800;font-size:.95rem;margin-top:-2px}
.howto-step svg{display:inline-block;vertical-align:-4px;color:var(--tint)}
/* Add to Home Screen (Michael, Oct 29: "This looks basic. Give it a more premium look"): his icon landing on the photo
   Home opens with, then the steps as a gold path, each with a small picture of what they'll tap */
.hs-hero{flex:none;position:relative;isolation:isolate;height:188px;border-radius:24px;overflow:hidden;display:flex;align-items:flex-end;justify-content:center;padding-bottom:26px;box-shadow:var(--lift-1)}
.hs-photo{position:absolute;inset:0;z-index:-2;background:url(home-end.jpg) center 30%/cover no-repeat;filter:saturate(.84) sepia(.06) contrast(1.03)}
.hs-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(13,33,25,0) 20%,rgba(13,33,25,.5) 100%)}
.hs-app{display:flex;flex-direction:column;align-items:center;gap:7px;animation:hs-land .9s var(--ease-spring) .2s both}
.hs-icon{display:block;width:72px;height:72px;border-radius:17px;outline:1px solid rgba(255,255,255,.28);outline-offset:-1px;box-shadow:0 14px 30px -6px rgba(0,0,0,.5),0 3px 8px rgba(0,0,0,.28)}
.hs-label{color:#fff;font-size:.8rem;font-weight:600;letter-spacing:.01em;text-shadow:0 1px 4px rgba(0,0,0,.55)}
@keyframes hs-land{from{opacity:0;transform:translateY(14px) scale(.84)}to{opacity:1;transform:none}}
.hs-intro{display:flex;flex-direction:column;gap:8px;margin-top:-4px}
.hs-card{list-style:none;margin:0;padding:22px 18px 4px;border-radius:24px;background:var(--card);box-shadow:var(--lift-1)}
.hs-step{position:relative;display:grid;grid-template-columns:32px minmax(0,1fr);column-gap:14px;padding-bottom:18px}
.hs-step:not(:last-child)::before{content:"";position:absolute;left:15.25px;top:38px;bottom:4px;width:1.5px;border-radius:1px;background:linear-gradient(var(--gold),color-mix(in srgb,var(--gold) 35%,transparent))}
.hs-n,.chal-n{flex:none;width:32px;height:32px;border-radius:50%;border:1.5px solid var(--gold);display:grid;place-items:center;font-family:var(--display);font-size:1.3rem;font-weight:600;line-height:1;font-variant-numeric:lining-nums;font-feature-settings:'lnum' 1;color:var(--accent);background:var(--card)}
.hs-txt{display:flex;flex-direction:column;align-items:flex-start;gap:9px;padding-top:4px}
.hs-txt .t-body{line-height:1.4}
.hs-key{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--fill);color:var(--text)}
.hs-key.dots{font-size:1.3rem;font-weight:800;line-height:1}
.hs-row{display:flex;align-items:center;justify-content:space-between;gap:16px;width:min(100%,250px);min-height:44px;padding:0 12px 0 14px;border-radius:14px;background:var(--fill);font-size:.941rem;font-weight:600;color:var(--text)}
.hs-row svg{flex:none}
.hs-switch{flex:none;position:relative;width:44px;height:26px;border-radius:13px;background:#34C759}
.hs-switch::after{content:"";position:absolute;top:2px;right:2px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.hs-mini{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:.706rem;font-weight:600;color:var(--text-2)}
.hs-mini img{display:block;width:46px;height:46px;border-radius:11px;box-shadow:0 0 0 1px color-mix(in srgb,var(--text) 16%,transparent),0 4px 10px -3px rgba(0,0,0,.3)}
.hs-notes{display:flex;flex-direction:column;gap:8px;padding:14px 4px 0;border-top:1px solid var(--sep);font-size:.882rem;line-height:1.45;color:var(--text-2)}
.hs-notes p{margin:0}
@media (prefers-reduced-motion:reduce){.hs-app{animation:none}}
/* Challenges: the card on Home, the list and each challenge's page */
.chal-card{gap:10px}
.chal-card .label,.chal-eyebrow{font-size:.882rem;font-weight:700;color:var(--accent)}
.chal-head{display:flex;flex-direction:column;gap:8px}
.chal-sec{gap:8px}
.chal-k{font-size:.882rem;font-weight:800;color:var(--accent)}
.chal-quote{margin:4px 0 0;padding:4px 0 0 14px;border-left:2px solid var(--gold);display:flex;flex-direction:column;gap:6px}
.chal-quote .quote{margin:0;font-size:1.2rem}
.chal-more{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px}
.chal-row .rtxt{gap:2px}
.tag.tag-on{background:var(--chip-on);color:var(--chip-on-text)}
.icon-btn{width:44px;height:44px;flex:none;border-radius:999px;border:0;background:transparent;color:var(--tint);display:grid;place-items:center;padding:0}
.icon-btn.filled{background:var(--fill);color:var(--text)}

/* cards and lists */
.sect{display:flex;flex-direction:column;gap:10px}
.sect-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-inline:4px}
.card{background:var(--card);border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:12px}
.card.list{padding:0 0 0 16px;gap:0}
.row{display:flex;align-items:center;gap:12px;width:100%;min-height:52px;padding:10px 16px 10px 0;background:none;border:0;border-top:1px solid var(--sep);color:var(--text);text-align:left;text-decoration:none}
.card.list > .row:first-child,.card.list > :first-child .row{border-top:0}
.row .ic{flex:none;width:32px;height:32px;border-radius:9px;display:grid;place-items:center;background:var(--fill);color:var(--tint)}
.row .rtxt{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px}
.row .rval{flex:none;color:var(--text-2);font-size:1rem}
.row .chev{flex:none;color:var(--text-3)}
.row.danger{color:var(--danger)}
.row.danger .ic{color:var(--danger)}
.row-input{flex:1 1 0;min-width:0;text-align:right;text-align-last:right;background:transparent;border:0;padding:8px 0;font-size:1rem;color:var(--text-2)}
.field-row .rtxt{flex:1 1 auto;min-width:0}
.field-row .row-input{flex:0 0 auto;width:auto;max-width:62%}
.field-row .row-input[type=text]{flex:1 1 0;width:0;max-width:none}
.row-input:focus{outline:none;color:var(--text)}
.row:focus-within{outline:none}
.foot-under{padding:6px 4px 0}

/* feature (brand) card */
.feature{background:var(--feature);color:var(--on-feature);border-radius:22px;padding:20px;display:flex;flex-direction:column;gap:14px;box-shadow:var(--shadow)}
.feature .c2{color:var(--on-feature-2)}
.feature .label{font-size:.882rem;font-weight:700;color:var(--feature-accent)}
.feature .split{height:1px;background:var(--feature-sep)}

/* goals */
.goal{display:flex;flex-direction:column;gap:8px;padding:14px 16px 6px 0;border-top:1px solid var(--sep)}
.card.list > .goal:first-child{border-top:0}
.goal-title{display:block;width:100%;padding:0;background:none;border:0;text-align:left;color:var(--text)}
.prog{height:6px;border-radius:999px;background:var(--track);overflow:hidden}
.prog i{display:block;height:100%;border-radius:999px;background:var(--tint);transition:width .4s ease}
.step{display:flex;align-items:center;gap:12px;width:100%;min-height:48px;padding:6px 0;background:none;border:0;color:var(--text);text-align:left}
.box{flex:none;width:26px;height:26px;border-radius:50%;border:2px solid var(--edge);display:grid;place-items:center;color:var(--chip-on-text);transition:background-color .12s,border-color .12s}
.step[aria-pressed="true"] .box{background:var(--chip-on);border-color:var(--chip-on)}
.step[aria-pressed="true"] .stext{color:var(--text-3);text-decoration:line-through}
.step .stext{min-width:0}
.step-edit{display:flex;align-items:center;gap:4px}
.step-edit .step{flex:1 1 auto;min-width:0}
.del-btn{width:44px;height:44px;flex:none;border:0;border-radius:50%;background:transparent;color:var(--danger);display:grid;place-items:center}

/* values */
.vbar{position:relative;height:8px;border-radius:999px;background:var(--track);margin-block:8px 4px}
.vbar .liv{position:absolute;left:0;top:0;bottom:0;border-radius:999px;background:var(--living);transition:width .4s ease}
.vbar .imp{position:absolute;top:-5px;width:4px;height:18px;margin-left:-2px;border-radius:2px;background:var(--imp);transition:left .4s ease}
.vrow{display:flex;flex-direction:column;gap:2px;padding:12px 16px 12px 0;border-top:1px solid var(--sep)}
.card.list > .vrow:first-child{border-top:0}
.vrow-top{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.legend{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center}
.legend span{display:inline-flex;align-items:center;gap:6px}
.rate-note{text-align:center;margin-top:-6px;padding:0 8px}
.card.track{padding:0;gap:0}
.card.track .disclose{background:transparent;border:0;box-shadow:none;border-radius:inherit;min-height:60px;padding:0 18px;gap:12px}
.track-h{display:flex;flex-direction:column;gap:2px;padding:10px 0}
.track-h .t-sub{font-weight:500}
.track-body{display:flex;flex-direction:column;gap:14px;padding:0 18px 20px}
.track-body .card.list{background:var(--fill)}
.track-stop{align-self:center}
.lg-liv{width:18px;height:8px;border-radius:4px;background:var(--living)}
.lg-imp{width:4px;height:14px;border-radius:2px;background:var(--imp)}
.slider{display:flex;flex-direction:column;gap:2px}
.slider-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px}
.slider-val{font-size:1.294rem;font-weight:800;line-height:1;color:var(--text)}
.slider-row{display:flex;align-items:center;gap:6px}
.slider-row input{flex:1 1 auto;min-width:0}
.step-btn{width:44px;height:44px;flex:none;border-radius:50%;border:0;background:var(--fill);color:var(--text);font-size:1.3rem;font-weight:700;line-height:1;display:grid;place-items:center}
.slider-ends{display:flex;justify-content:space-between;padding-inline:50px}
input[type=range]{-webkit-appearance:none;appearance:none;height:44px;margin:0;background:transparent;cursor:pointer}
input[type=range]::-webkit-slider-runnable-track{height:6px;border-radius:999px;background:linear-gradient(to right,var(--fill-c) 0 var(--p),var(--track) var(--p) 100%)}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:28px;height:28px;margin-top:-11px;border-radius:50%;background:#FFFFFF;border:0;box-shadow:0 1px 2px rgba(0,0,0,.25),0 4px 12px rgba(0,0,0,.2)}
input[type=range]::-moz-range-track{height:6px;border-radius:999px;background:var(--track)}
input[type=range]::-moz-range-progress{height:6px;border-radius:999px;background:var(--fill-c)}
input[type=range]::-moz-range-thumb{width:28px;height:28px;border-radius:50%;background:#FFFFFF;border:0;box-shadow:0 2px 8px rgba(0,0,0,.3)}

/* chips, choices, segmented */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;gap:6px;min-height:44px;max-width:100%;padding:8px 16px;border-radius:22px;border:0;background:var(--fill);color:var(--text);font-weight:600;font-size:.941rem;line-height:1.25;text-align:left;overflow-wrap:anywhere}
.chip[aria-pressed="true"]{background:var(--chip-on);color:var(--chip-on-text)}
.chip svg{flex:none}
.chip.mine{background:var(--good-bg);color:var(--good-text)}
.choices{display:flex;flex-direction:column;gap:10px}
.choice{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:56px;padding:0 18px;border-radius:16px;border:2px solid transparent;background:var(--card);color:var(--text);font-weight:700;font-size:1rem;text-align:left}
.choice[aria-pressed="true"]{border-color:var(--tint)}
.choice .tick{width:26px;height:26px;border-radius:50%;border:2px solid var(--edge);display:grid;place-items:center;color:var(--chip-on-text)}
.choice[aria-pressed="true"] .tick{background:var(--chip-on);border-color:var(--chip-on)}
.seg{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:2px;padding:2px;border-radius:12px;background:var(--fill)}
.seg button{min-height:40px;border:0;border-radius:10px;background:transparent;color:var(--text);font-weight:600;font-size:.882rem;padding:0 10px;white-space:nowrap}
.seg button[aria-pressed="true"]{background:var(--seg-on);font-weight:700;box-shadow:0 1px 3px rgba(0,0,0,.14)}
.scroll-x{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin-inline:calc(-1 * max(var(--gutter),env(safe-area-inset-left,0px)));padding-inline:max(var(--gutter),env(safe-area-inset-left,0px))}
.scroll-x::-webkit-scrollbar{display:none}
.scroll-x .chip{flex:none;white-space:nowrap}

/* fields */
.field{display:flex;flex-direction:column;gap:8px}
.field-label{font-weight:700;font-size:.941rem}
.opt{font-weight:500;color:var(--text-3)}
.input,.textarea{width:100%;min-height:50px;padding:12px 14px;border-radius:12px;border:1px solid var(--edge);background:var(--card);color:var(--text);font-size:1rem;font-weight:500;line-height:1.4}
.textarea{min-height:96px;resize:vertical}
.input::placeholder,.textarea::placeholder{color:var(--text-3);opacity:1}
.add-row{display:flex;gap:8px}
.add-row .input{flex:1 1 auto;min-width:0}
.disclose{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:52px;padding:0 16px;border-radius:14px;border:0;background:var(--card);color:var(--text);font-weight:700;font-size:1rem;text-align:left}
.disclose svg{transition:transform .2s;color:var(--text-3)}
.disclose[aria-expanded="true"] svg{transform:rotate(90deg)}
.group{display:flex;flex-direction:column;gap:18px;padding:16px;border-radius:16px;background:var(--card)}
.note{padding:12px 14px;border-radius:12px;background:var(--fill);font-size:.941rem;line-height:1.45}
.reply{font-family:var(--display);font-style:italic;font-weight:500;font-size:1.3rem;color:var(--accent)}

/* values card */
.vcard{align-items:center;text-align:center;gap:12px;padding:24px 20px}
.vcard img{width:52px;height:52px}
.vcard .vals{display:flex;flex-wrap:wrap;justify-content:center;gap:2px 10px;font-family:var(--display);font-weight:600;font-size:1.5rem;line-height:1.3}
.vcard .vals span:not(:last-child)::after{content:"\00b7";color:var(--feature-accent);margin-left:10px}
.vcard .rule{width:40px;height:1px;background:var(--feature-accent)}

/* tab bar */
.tabbar{position:fixed;z-index:20;left:max(16px,env(safe-area-inset-left,0px));right:max(16px,env(safe-area-inset-right,0px));bottom:calc(8px + env(safe-area-inset-bottom,0px));max-width:480px;margin-inline:auto;height:62px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px;padding:5px;border-radius:31px;background:var(--bar-glass);-webkit-backdrop-filter:blur(20px) saturate(1.6);backdrop-filter:blur(20px) saturate(1.6);border:1px solid var(--tab-edge);box-shadow:var(--shadow)}
.tab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-width:44px;border:0;border-radius:26px;background:transparent;color:var(--text-2);font-size:.647rem;font-weight:700}
.tab[aria-current="page"]{color:var(--accent);background:var(--fill)}

/* sheets, flows, toast */
.scrim{position:fixed;inset:0;z-index:50;background:var(--scrim);display:flex;align-items:flex-end;justify-content:center;animation:fade .2s ease both}
.sheet{width:100%;max-width:600px;height:calc(100% - 12px - env(safe-area-inset-top,0px));display:flex;flex-direction:column;background:var(--bg);border-radius:14px 14px 0 0;box-shadow:0 -10px 40px rgba(0,0,0,.25);animation:up .3s cubic-bezier(.2,.8,.2,1) both;overflow:hidden}
.sheet.medium{height:auto;max-height:calc(100% - 12px - env(safe-area-inset-top,0px))}
.grab{width:36px;height:5px;border-radius:999px;background:var(--fill-2);margin:6px auto 0;flex:none}
.sheet-head{flex:none;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:8px;min-height:52px;padding:0 max(8px,env(safe-area-inset-right,0px)) 0 max(8px,env(safe-area-inset-left,0px))}
.sheet-head .t-headline{text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sheet-head .end{justify-self:end}
.sheet-body{flex:1 1 auto;overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;gap:24px;padding:8px max(var(--gutter),env(safe-area-inset-right,0px)) calc(28px + env(safe-area-inset-bottom,0px)) max(var(--gutter),env(safe-area-inset-left,0px))}
.ascrim{position:fixed;inset:0;z-index:90;background:var(--scrim);display:flex;align-items:flex-end;justify-content:center;animation:fade .15s ease both}
.asheet{width:100%;max-width:480px;display:flex;flex-direction:column;gap:8px;padding:0 max(8px,env(safe-area-inset-right,0px)) calc(8px + env(safe-area-inset-bottom,0px)) max(8px,env(safe-area-inset-left,0px));animation:up .25s cubic-bezier(.2,.8,.2,1) both}
.agroup{background:var(--card);border-radius:14px;overflow:hidden}
.amsg{padding:16px;text-align:center;font-size:.882rem;line-height:1.4;color:var(--text-2);border-bottom:1px solid var(--sep)}
.amsg b{display:block;color:var(--text);font-size:.941rem;margin-bottom:2px}
.abtn{display:block;width:100%;min-height:56px;border:0;background:var(--card);font-size:1.06rem;font-weight:700;color:var(--tint)}
.abtn.danger{color:var(--danger)}
.abtn.cancel{border-radius:14px;font-weight:800}
.flow{position:fixed;inset:0;z-index:40;background:var(--bg);display:flex;flex-direction:column;padding-top:env(safe-area-inset-top,0px);animation:fade .2s ease both}
.flow-head,.flow-inner,.flow-foot-in{width:100%;max-width:600px;margin:0 auto;padding-left:max(var(--gutter),env(safe-area-inset-left,0px));padding-right:max(var(--gutter),env(safe-area-inset-right,0px))}
.flow-head{flex:none;display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;gap:8px;min-height:52px}
.meter{display:flex;flex-direction:column;align-items:center;gap:6px}
.meter-bars{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:5px;width:100%;max-width:220px}
.meter-bars span{height:4px;border-radius:999px;background:var(--fill-2)}
.meter-bars span.on{background:var(--tint)}
.flow-body{flex:1 1 auto;overflow-y:auto;overscroll-behavior:contain}
.flow-inner{display:flex;flex-direction:column;gap:24px;padding-block:12px 32px}
.flow-foot{flex:none;background:var(--bg);border-top:1px solid var(--sep)}
.flow-foot-in{display:flex;gap:10px;padding-block:12px calc(12px + env(safe-area-inset-bottom,0px))}
.flow-foot-in .btn{flex:1 1 0}
.done-mark{width:72px;height:72px;border-radius:50%;background:var(--chip-on);color:var(--chip-on-text);display:grid;place-items:center}
.center{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding-top:12px}
.search{position:sticky;top:-8px;z-index:2;background:var(--bg);padding-block:8px 10px;display:flex;flex-direction:column;gap:10px}
.group-title{font-size:.882rem;font-weight:700;color:var(--text-2);padding-inline:4px}
.ladder{display:flex;flex-direction:column}
.rung{display:flex;gap:12px;width:100%;min-height:48px;padding:0;background:none;border:0;color:var(--text);text-align:left}
.rung .rail{flex:none;width:16px;display:flex;flex-direction:column;align-items:center}
.rung .dot{flex:none;width:12px;height:12px;margin-top:5px;border-radius:50%;border:2.5px solid var(--bar);background:var(--card)}
.rung.here .dot{background:var(--tint);border-color:var(--tint)}
.rung .line{flex:1 1 auto;width:2px;background:var(--sep);margin-block:3px}
.rung .rt{display:flex;flex-direction:column;gap:1px;padding-bottom:12px}
.rung.here .rt b{color:var(--tint)}
.toast-wrap{position:fixed;left:0;right:0;bottom:calc(80px + env(safe-area-inset-bottom,0px));z-index:70;display:flex;justify-content:center;padding:0 16px;pointer-events:none}
.toast{pointer-events:auto;display:flex;align-items:center;gap:14px;max-width:440px;padding:12px 12px 12px 18px;border-radius:16px;background:var(--text);color:var(--bg);font-weight:700;font-size:.941rem;line-height:1.35;box-shadow:0 14px 34px rgba(0,0,0,.35);animation:up .25s ease both}
.toast.plain{padding-right:18px}
.toast button{white-space:nowrap;flex:none;min-height:40px;padding:0 14px;border-radius:999px;border:0;background:var(--gold);color:var(--on-gold);font-weight:800;font-size:.882rem}
.notice{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 12px 12px 16px;border-radius:16px;background:var(--card)}
.loading{min-height:70vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;padding:24px}
.loading img{width:72px;height:72px;animation:breathe 2.4s ease-in-out infinite}
.loading-word{font-family:var(--mark);font-weight:600;font-size:1.5rem;letter-spacing:.26em}
/* daily thought + quick actions */
.thought{gap:8px}
.thought-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:-8px -10px -4px 0}
.thought .quote{font-size:1.32rem}
.save-btn[aria-pressed="true"]{color:var(--accent)}
.actions2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.qa{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-height:96px;padding:14px;border-radius:16px;border:0;background:var(--card);color:var(--text);text-align:left}
.qa .qa-ic{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--fill);color:var(--tint);margin-bottom:4px}
/* goal path */
.pathwrap{display:flex;flex-direction:column;gap:6px}
.summit{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;padding:4px 8px 0}
.pathview{position:relative;width:100%}
.trail-svg{position:absolute;left:0;top:0;overflow:visible;pointer-events:none}
.trail-band{fill:none;stroke:var(--path-band);stroke-width:20;stroke-linecap:round}
.trail-line{fill:none;stroke:var(--trail);stroke-width:3;stroke-dasharray:1 9;stroke-linecap:round}
.trail-walked{fill:none;stroke:var(--bar);stroke-width:5;stroke-linecap:round}
.plist{list-style:none;margin:0;padding:0}
.pnode{position:absolute;transform:translate(-50%,-50%);border-radius:50%;display:grid;place-items:center;z-index:2}
.pnode.done{width:34px;height:34px;background:var(--chip-on);color:var(--chip-on-text)}
.pnode.here{width:44px;height:44px;background:var(--card);border:3px solid var(--bar);animation:halo 2.6s ease-out infinite}
.pnode.here::after{content:"";width:14px;height:14px;border-radius:50%;background:var(--bar)}
.pnode.ahead{width:28px;height:28px;background:var(--bg);border:2.5px solid var(--edge)}
.pnode.peak{width:54px;height:54px;background:var(--feature);border:3px solid var(--bg)}
.pnode.peak img{width:32px;height:32px}
.pnode.start{width:22px;height:22px;background:var(--bg);border:3px solid var(--bar)}
.pcard{position:absolute;z-index:3;transform:translateY(-50%);display:flex;flex-direction:column;align-items:flex-start;gap:3px;padding:10px 12px;border-radius:14px;border:0;background:var(--card);color:var(--text);text-align:left;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.pcard.here{box-shadow:0 0 0 2px var(--bar)}
.pcard.done .ptitle{color:var(--text-2)}
.ptitle{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.pill{display:inline-flex;align-items:center;padding:2px 9px;border-radius:999px;background:var(--gold);color:var(--on-gold);font-size:.706rem;font-weight:800}
.trailhead{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:0 8px}
@keyframes halo{0%{box-shadow:0 0 0 0 var(--halo)}70%{box-shadow:0 0 0 14px rgba(0,0,0,0)}100%{box-shadow:0 0 0 0 rgba(0,0,0,0)}}
/* history */
.stat-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.stat{background:var(--fill);border-radius:12px;padding:10px 6px;text-align:center;display:flex;flex-direction:column;gap:2px}
.stat b{font-size:1.294rem;font-weight:800;line-height:1.1}
.tag{display:inline-flex;align-items:center;padding:2px 9px;border-radius:999px;font-size:.765rem;font-weight:800;background:var(--fill);color:var(--text-2);white-space:nowrap}
.tag.yes{background:var(--good-bg);color:var(--good-text)}
.hcard{display:flex;flex-direction:column;gap:6px;padding:14px 16px;border-radius:16px;background:var(--card)}
.hcard-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.tip{padding:10px 12px;border-radius:12px;background:var(--fill);font-size:.882rem;line-height:1.45;color:var(--text-2)}
.tip b{color:var(--text)}
/* engagement upgrades */
.course-card{gap:10px}
.cc-acts{display:flex;flex-wrap:wrap;align-items:center;gap:4px 18px}
.sess-plan,.sess-ask{display:flex;flex-direction:column;gap:6px;border-top:1px solid var(--edge-soft);padding-top:12px;margin-top:2px}
.num-chips .chip{min-width:52px;justify-content:center;text-align:center}
.jentry{width:100%;border:0;text-align:left;color:var(--text)}
.jtext{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;white-space:pre-line}
.memory-card{gap:12px}
.mem-open{display:flex;align-items:center;gap:12px;width:100%;padding:0;border:0;background:none;color:var(--text);text-align:left}
.mem-open .ic{flex:none;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(180deg,var(--tile-hi),var(--tile-lo));color:var(--tint)}
.mem-open .rtxt{flex:1 1 auto;display:flex;flex-direction:column;gap:2px;min-width:0}
.mem-open .chev{flex:none;color:var(--text-3)}
.mem-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.win-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.win-tile{position:relative;aspect-ratio:1/1;width:100%;padding:0;border:0;border-radius:12px;overflow:hidden;background:var(--fill);color:var(--text)}
.win-tile img{display:block;width:100%;height:100%;object-fit:cover}
.win-tile.words{display:flex;align-items:flex-end;padding:8px;background:linear-gradient(160deg,var(--feature-hi),var(--feature-lo));color:var(--on-feature);text-align:left}
.win-words{font-size:.765rem;font-weight:600;line-height:1.3;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.mem-strip .win-tile.words{padding:6px}
.mem-strip .win-words{font-size:.62rem;-webkit-line-clamp:3}
.win-pick{flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:176px;padding:20px;border:2px dashed var(--sep);border-radius:20px;background:var(--card);color:var(--text);text-align:center;cursor:pointer}
.win-pick-ic{width:52px;height:52px;margin-bottom:4px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(180deg,var(--gold-hi),var(--gold-lo));color:var(--on-gold);box-shadow:var(--lift-1)}
.win-pick.has{min-height:0;padding:0;border:0;background:none;gap:10px}
.win-pick.has img{display:block;width:100%;max-height:340px;object-fit:cover;border-radius:20px}
.win-pick-acts{display:flex;align-items:center;justify-content:center;gap:16px}
.win-photo{flex:none;display:block;width:100%;max-height:60vh;object-fit:contain;border-radius:20px;background:var(--fill)}
.win-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:-8px}
.win-acts{display:flex;justify-content:center;gap:24px;margin-top:-8px}
.share-post{flex:none;gap:10px}
.share-post img{display:block;width:100%;max-height:260px;object-fit:cover;border-radius:14px}
.share-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px}
.share-steps li{display:flex;align-items:flex-start;gap:12px}
.share-steps li > div{display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.remember-card{position:relative;padding:0;overflow:hidden}
.remember-open{display:flex;align-items:center;gap:14px;width:100%;padding:12px 48px 12px 12px;border:0;background:none;color:var(--text);text-align:left}
.remember-open img{flex:none;width:76px;height:76px;border-radius:14px;object-fit:cover}
.remember-open .rtxt{display:flex;flex-direction:column;gap:2px;min-width:0}
.remember-cap{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.remember-x{position:absolute;top:6px;right:6px}
.install-card{gap:12px}
.install-head{display:flex;align-items:center;gap:12px}
.install-head .ic{flex:none;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(180deg,var(--tile-hi),var(--tile-lo));color:var(--tint)}
.install-head .rtxt{display:flex;flex-direction:column;gap:2px;min-width:0}
.install-acts{display:flex;gap:8px;flex-wrap:wrap}
.pmap{flex:none;display:flex;flex-direction:column;gap:4px;padding:12px 14px 10px;border-radius:16px;background:var(--card);border:1px solid var(--edge-soft);box-shadow:inset 0 1px 0 var(--hi),var(--lift-1)}
.pmap-v{font-size:.765rem;font-weight:800;color:var(--accent)}
.pmap-list{position:relative;list-style:none;margin:0;padding:0}
.pmap-list::before{content:"";position:absolute;left:11px;top:16px;bottom:14px;width:2px;background:var(--bar);opacity:.45}
.pmap-list li{position:relative;display:flex;align-items:center;gap:10px;min-height:30px;padding:2px 0}
.pmap-flag{position:relative;z-index:1;flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(180deg,var(--gold-hi),var(--gold-lo));color:var(--on-gold)}
.pmap-flag svg{width:15px;height:15px}
.pmap-dot{position:relative;z-index:1;flex:none;width:10px;height:10px;margin:0 7px;border-radius:50%;border:2px solid var(--bar);background:var(--card)}
.pmap-next .pmap-dot{border-style:dashed}
.pmap-start .pmap-dot{background:var(--gold);border-color:var(--gold)}
.pmap-t{flex:1 1 auto;min-width:0;font-size:.882rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pmap-top .pmap-t{font-weight:800;font-size:.941rem}
.pmap-next .pmap-t,.pmap-ph{color:var(--text-3);font-weight:500}
.pmap-f{flex:none;font-size:.706rem;font-weight:700;color:var(--text-3)}
.hpath{gap:4px}
.hpath-row{display:flex;align-items:center;gap:10px;width:100%;min-height:36px;padding:4px 0;border:0;background:none;color:var(--text);font:inherit;text-align:left;cursor:pointer}
.hpath .pmap-t{white-space:normal}
.hpath .pmap-list::before{top:20px;bottom:18px}
.hpath-fold .pmap-t{color:var(--tint);font-weight:700}
.hpath-fold .pmap-dot{border-style:dashed}
.hpath-fold .pmap-f{color:var(--tint)}
.hpath-also{border-top:1px solid var(--sep);margin-top:2px;padding-top:8px}
.hpath-also .pmap-dot{border-style:dashed}
.gp-how{display:flex;flex-direction:column;gap:4px;padding:10px 14px;border-radius:14px;background:var(--fill)}
.gp-how ol{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:2px;font-size:.941rem;line-height:1.38}
.ask-card{gap:10px}
.ask-acts{display:flex;align-items:center;flex-wrap:wrap;gap:4px 16px}
.bpath{flex:none;list-style:none;margin:0;padding:16px 16px 14px;display:flex;flex-direction:column;border-radius:20px;background:var(--card);border:1px solid var(--edge-soft);box-shadow:inset 0 1px 0 var(--hi),var(--lift-1)}
.bpath > li{display:flex;gap:14px}
.bp-flag,.bp-node{position:relative;z-index:1;flex:none;width:40px;display:flex;justify-content:center}
.bp-flag::before{content:"";position:absolute;top:0;width:40px;height:40px;border-radius:50%;background:linear-gradient(180deg,var(--gold-hi),var(--gold-lo));box-shadow:var(--lift-1)}
.bp-flag svg{position:relative;margin-top:10px;color:var(--on-gold)}
.bp-node::before{content:"";margin-top:4px;width:18px;height:18px;border-radius:50%;border:3px solid var(--bar);background:var(--card)}
.bp-next .bp-node::before{border-style:dashed;border-color:var(--gold-lo);background:transparent}
.bp-today .bp-node::before{border-color:var(--gold-lo);background:var(--gold)}
.bp-body{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:3px;padding-bottom:2px}
.bp-label{font-size:.765rem;font-weight:800;color:var(--accent)}
.bp-title{font-size:1.06rem;font-weight:700;line-height:1.3;overflow-wrap:anywhere}
.bp-goal .bp-title{font-family:var(--display);font-size:1.45rem;line-height:1.15}
.bp-when{font-size:.82rem;font-weight:600;color:var(--text-2)}
.bp-next .bp-body{gap:8px;padding:12px;border:2px dashed var(--gold-lo);border-radius:14px;background:color-mix(in srgb,var(--gold) 9%,transparent);align-items:stretch}
.bp-next .bp-title{font-size:1rem}
.bp-next .input{background:var(--card)}
.bp-next .ask-acts{margin-top:2px}
.bp-arrow{align-items:center;min-height:38px;color:var(--bar);font-size:.765rem;font-weight:700}
.bp-arrow-ic{position:relative;flex:none;width:40px;height:38px;display:flex;align-items:center;justify-content:center}
.bp-arrow-ic::before{content:"";position:absolute;left:19px;top:0;bottom:0;width:2px;background:var(--bar);opacity:.5}
.bp-arrow-ic svg{position:relative;width:22px;height:22px;padding:3px;border-radius:50%;background:var(--card);box-shadow:0 0 0 2px var(--bar) inset}
.qa-wide{grid-column:1 / -1;flex-direction:row;align-items:center;gap:12px;min-height:0;padding:12px 14px}
.qa-wide .qa-ic{margin-bottom:0;flex:none}
.qa-wide .qa-txt{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px}
.qa-wide .chev{flex:none;color:var(--text-3)}
.next-ck{gap:4px}
.climb{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.climb-step{position:relative;display:flex;gap:12px}
.climb-rail{flex:none;position:relative;width:40px;display:flex;justify-content:center}
.climb-rail::before{content:"";position:absolute;left:19px;top:0;bottom:0;width:2px;border-radius:1px;background:var(--bar);opacity:.55}
.climb-step.top .climb-rail::before{top:20px}
.climb-step:last-child .climb-rail::before{bottom:auto;height:19px}
.climb-step.top:last-child .climb-rail::before{display:none}
.climb-summit{position:relative;z-index:1;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(180deg,var(--gold-hi),var(--gold-lo));color:var(--on-gold);box-shadow:var(--lift-1)}
.climb-dot{position:relative;z-index:1;width:14px;height:14px;margin-top:12px;border-radius:50%;border:2.5px solid var(--bar);background:var(--card)}
.climb-step.start .climb-dot{border-color:var(--gold-lo);background:var(--gold)}
.climb-up{position:absolute;z-index:1;left:9px;bottom:2px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--card);color:var(--bar);box-shadow:0 0 0 1.5px var(--bar) inset}
.flow .climb-up,.flow .climb-dot{background:var(--bg)}
.climb-body{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:6px;padding:8px 0 28px}
.climb-step.top .climb-body{padding-top:0;gap:2px;min-height:40px;justify-content:center}
.climb-step:last-child .climb-body{padding-bottom:2px}
.climb-eyebrow{font-size:.765rem;font-weight:700;color:var(--text-2)}
.climb-meta{display:flex;align-items:center;justify-content:space-between;gap:8px}
.climb-when{position:relative;display:inline-flex;align-items:center;color:var(--tint)}
.climb-when select{appearance:none;-webkit-appearance:none;min-height:36px;padding:6px 30px 6px 12px;border:0;border-radius:999px;background:var(--fill);color:var(--text);font:inherit;font-size:.882rem;font-weight:600}
.climb-when svg{position:absolute;right:10px;pointer-events:none}
.climb-add{align-self:flex-start;margin-top:4px}
.climb-step.ask .climb-dot{border-style:dashed;border-color:var(--tint)}
.climb-step.ask .climb-body{gap:8px;margin-bottom:20px;padding:12px 14px 14px;border-radius:18px;background:var(--card);box-shadow:var(--lift-1)}
.climb-step.ask:last-child .climb-body{margin-bottom:0}
.climb .field-label{display:flex;align-items:center;flex-wrap:wrap;gap:6px}
.watch{align-self:flex-start;display:inline-flex;align-items:center;gap:10px;max-width:100%;min-height:48px;padding:6px 14px 6px 6px;border-radius:999px;background:var(--card);box-shadow:var(--lift-1);color:var(--text);text-decoration:none}
.watch-play{flex:none;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(180deg,var(--gold-hi),var(--gold-lo));color:var(--on-gold)}
.watch-txt{display:flex;flex-direction:column;min-width:0;line-height:1.25}
.watch-txt b{font-size:.882rem;font-weight:700}
.watch-txt span{font-size:.765rem;color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.watch .chev{flex:none;color:var(--text-3)}
.watch.slim{min-height:44px;padding:0;gap:10px;background:none;box-shadow:none;border:0;font-family:inherit;text-align:left;cursor:pointer}
.watch.slim .watch-play{width:28px;height:28px}
.watch.slim .watch-play svg{width:12px;height:12px}
.watch.slim .watch-txt b{color:var(--tint)}
.watch.slim .watch-txt span{color:var(--text-3)}
.flow-intro{display:flex;flex-direction:column;gap:8px}
.field-hint{font-size:.882rem;line-height:1.4;color:var(--text-2)}
.flow-more{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding-top:4px}
.flow-more .tbtn{padding-inline:0}
.srow{display:flex;align-items:center;border-top:1px solid var(--sep)}
.card.list > .srow:first-child{border-top:0}
.srow .row{flex:1 1 auto;min-width:0;border-top:0}
.srow-play{flex:none;width:44px;height:44px;margin-right:8px;border-radius:50%;display:grid;place-items:center;background:var(--fill);color:var(--tint)}
.ilink{align-self:flex-start;display:inline-flex;align-items:center;gap:5px;min-height:32px;margin-top:-6px;color:var(--tint);font-weight:700;font-size:.882rem;text-decoration:none}
.course-card .label{font-size:.882rem;font-weight:700;color:var(--accent)}
.vprog{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:8px;padding:10px 12px;border-radius:12px;background:var(--fill)}
.vprog-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.spark{flex:none;overflow:visible}
.spark polyline{fill:none;stroke:var(--living);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.spark circle{fill:var(--living)}
.vhead{display:flex;align-items:center;justify-content:space-between;gap:8px}
.vhead-r{display:flex;align-items:center;gap:2px;margin-right:-10px}
.pin-btn{color:var(--text-3)}
.pin-btn[aria-pressed="true"]{color:var(--accent)}
.sense[aria-pressed="true"] .stext{text-decoration:none;color:var(--text)}
.choice.two{min-height:68px;padding:12px 18px}
.choice .ctext{display:flex;flex-direction:column;gap:2px;font-weight:700}
.choice .ctext small{font-weight:500;font-size:.882rem;color:var(--text-2)}
.reframe{display:flex;flex-direction:column;gap:8px;padding:18px;border-radius:18px;background:var(--feature);color:var(--on-feature)}
.reframe .quote{font-size:1.3rem}
.reframe .label{font-size:.882rem;font-weight:700;color:var(--feature-accent)}
.plan-line{padding:10px 12px;border-radius:12px;background:var(--fill);font-size:.941rem;line-height:1.45}
.plan-line b{color:var(--text)}
.did-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
.did-line{display:flex;align-items:center;gap:8px;font-size:.941rem;font-weight:600;color:var(--good-text)}
.did-line svg{flex:none;width:16px;height:16px}
.goal-link{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:0 12px}
.goal-link .tbtn{min-height:36px;font-size:.882rem}
/* How TOWARDS works: the page dims except the one thing being explained, with a gold edge around it and the
   explanation in a card beside it, pointing at it */
.tour{position:fixed;inset:0;z-index:60;animation:fade .3s ease both}
.touring .app{padding-bottom:80vh}
.tour-hole{position:fixed;pointer-events:none;box-shadow:0 0 0 2px var(--gold),0 0 0 200vmax rgba(6,18,12,.64);transition:top .4s var(--ease-press),left .4s var(--ease-press),width .4s var(--ease-press),height .4s var(--ease-press),border-radius .4s var(--ease-press)}
.tour-bub{position:fixed;left:16px;right:16px;max-width:400px;margin-inline:auto;display:flex;flex-direction:column;gap:6px;padding:12px 18px 16px;border-radius:24px;background:var(--card);color:var(--text);border:1px solid var(--edge-soft);box-shadow:var(--lift-3);transition:top .4s var(--ease-press)}
.tour-bub.measuring{visibility:hidden;transition:none}
.tour-bub:focus{outline:none}
.tour-bub::after{content:"";position:absolute;left:calc(var(--caret) - 8px);width:16px;height:16px;background:var(--card);border:1px solid var(--edge-soft);transform:rotate(45deg)}
.tour-bub.below::after{top:-9px;border-right:0;border-bottom:0}
.tour-bub.above::after{bottom:-9px;border-left:0;border-top:0}
.tour-bub.over::after,.tour-bub.measuring::after{display:none}
.tour-top{display:flex;align-items:center;justify-content:space-between}
.tour-top .tbtn{font-size:.941rem}
.tour-count{display:flex;align-items:center;gap:8px}
.tour-tag{padding:3px 10px;border-radius:999px;background:var(--fill);color:var(--accent);font-size:.765rem;font-weight:800;letter-spacing:.01em}
.tour-tab .tour-hole{box-shadow:0 0 0 2px var(--gold),0 0 0 200vmax rgba(6,18,12,.34)}
.tour-t{font-family:var(--display);font-weight:500;font-size:1.6rem;line-height:1.1;letter-spacing:-.005em}
.tour-acts{display:flex;justify-content:flex-end;gap:10px;margin-top:8px}
@media (prefers-reduced-motion: reduce){.tour{animation:none}.tour-hole,.tour-bub{transition:none}}
.sugg{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
/* Passenger sketches (Michael, Oct 28): drawn with a finger, kept as simple lines in their entries */
.daily-head{padding:0 4px;font-weight:600;margin:18px 0 8px}
.notice.notice-stack{flex-direction:column;align-items:flex-start}
.vframe{position:relative;width:100%;aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:var(--feature)}
.vframe iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
/* Why we ask: a quiet pill under a step's question; the reason opens beneath it */
.why-wrap{display:flex;flex-direction:column;gap:10px;align-items:flex-start;width:100%}
.why-wrap.tuck{margin-top:-12px}
.center .why-wrap{align-items:center}
.center .why{text-align:left}
.why-btn{position:relative;display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:0 14px 0 9px;border-radius:999px;border:1px solid var(--edge-soft);background:transparent;color:var(--text-2);font:inherit;font-size:.882rem;font-weight:700;cursor:pointer}
.why-btn::after{content:"";position:absolute;inset:-5px -2px}
.why-btn[aria-expanded="true"]{background:var(--fill);border-color:transparent;color:var(--text)}
.why{display:flex;flex-direction:column;gap:10px;width:100%;padding:14px 16px;border-radius:18px;background:var(--fill);font-size:.941rem;line-height:1.45;animation:fade .2s ease both}
.why p{margin:0}
button.watch:not(.slim){border:0;font:inherit;text-align:left;cursor:pointer}
button.watch:not(.slim) .watch-txt span{white-space:normal}
.why .watch{background:var(--card)}
.chal-sec .watch{background:var(--fill);box-shadow:none}
.why-cap{font-size:.765rem;line-height:1.35;color:var(--text-3)}
button.ilink{background:none;border:0;padding:0;font-family:inherit;cursor:pointer}
.sk-pad{display:block;width:100%;max-width:320px;aspect-ratio:1;border-radius:18px;background:var(--card);border:1.5px dashed var(--edge-soft);touch-action:none;cursor:crosshair}
.sk-line{fill:none;stroke:var(--text);stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round}
.sk-tools{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.sk-art{display:block;flex:none;border-radius:14px;background:var(--card);border:1px solid var(--edge-soft)}
.sk-art .sk-line{stroke-width:4}
.chip .sk-art{border-radius:8px;margin:-4px 0 -4px -8px}
.sk-funny{font-family:var(--pm-serif, Georgia, serif);font-style:italic;font-size:1.15rem;line-height:1.3;color:var(--text);margin:0}
.wp-today{display:flex;gap:14px;align-items:center;text-align:left}
.sugg .chip{min-height:36px;padding:6px 12px;font-size:.882rem}
/* round 5 */
.lock-prev{display:flex;justify-content:center}
.lock-prev img{width:78%;max-width:340px;border-radius:30px;box-shadow:0 18px 40px -18px rgba(0,0,0,.6)}
.lock-wait{width:78%;max-width:340px;aspect-ratio:1170/2532;border-radius:30px;background:var(--fill);display:grid;place-items:center}
.be-wrap{display:flex;justify-content:center}
.be{width:100%;max-width:340px;height:auto;overflow:visible;touch-action:manipulation}
.be .seg-p{stroke:var(--bg);stroke-width:1.2;cursor:pointer;transition:fill .12s}
.be .seg-p:focus{outline:none;stroke:var(--tint);stroke-width:2.5}
.be .r1{fill:var(--fill-2)}.be .r2{fill:var(--fill)}.be .r3{fill:var(--fill-2)}.be .r4{fill:var(--fill)}.be .r5{fill:var(--fill-2)}
.be .on{fill:var(--gold)}
.be .axis{stroke:var(--edge);stroke-width:1.2}
.be .lbl{font-family:var(--ui);font-size:10.5px;font-weight:700;fill:var(--text-2)}
.be .then{fill:none;stroke:var(--text);stroke-width:2.2}
.be .now{fill:var(--on-gold)}
.be-legend{display:flex;justify-content:center;gap:16px;flex-wrap:wrap}
.be-legend span{display:inline-flex;align-items:center;gap:6px}
.lg-then{width:12px;height:12px;border-radius:50%;border:2px solid var(--text)}
.lg-now{width:14px;height:14px;border-radius:4px;background:var(--gold)}
.checkrow{display:flex;align-items:flex-start;gap:12px;width:100%;min-height:48px;padding:8px 0;background:none;border:0;border-top:1px solid var(--sep);color:var(--text);text-align:left}
.checkrow:first-of-type{border-top:0}
.checkrow .box{border-radius:7px;margin-top:1px}
.checkrow[aria-pressed="true"] .box{background:var(--chip-on);border-color:var(--chip-on)}
.recap-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.moves-def p + p{margin-top:6px}
/* after the course */
.after-rows{display:flex;flex-direction:column;margin-right:-18px}
.after-rows .row:first-child{border-top:0}
.after-rows .row{padding-top:12px;padding-bottom:12px}
/* values list */
.vlist{align-items:flex-start;padding-top:14px;padding-bottom:12px}
.vlist .rtxt{gap:3px}
.vlist .vbar{margin-block:8px 2px}
.vlist-top{display:flex;align-items:center;gap:8px}
.vlist .chev{align-self:center}
/* goals: Build a goal path */
.path-cta{width:100%;text-align:left;cursor:pointer;margin-top:-12px}
.path-cta .row{border-top:0}
.path-cta .row .ic{background:var(--chip-on-grad);color:var(--chip-on-text)}
/* goals: all goals, by value. Each goal's node sits on a rail; smaller goals hang off the goal they build to. */
.vt-def{margin-top:-6px;padding-inline:4px}
.vt-card{padding-block:8px 6px;gap:0}
.card.vt-empty{background:transparent;border:1.5px dashed var(--edge);box-shadow:none}
.vt-tree,.vt-kids{list-style:none;margin:0;padding:0}
.vt-tree > li + li{border-top:1px solid var(--sep);margin-top:4px;padding-top:4px}
.vt-row{position:relative;display:grid;grid-template-columns:24px minmax(0,1fr);column-gap:12px;padding:8px 0}
.vt-body{display:flex;flex-direction:column;gap:8px;min-width:0}
.vt-meta{display:block;font-weight:700;margin-bottom:2px}
.vt-node{position:relative;z-index:1;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--card)}
.vt-node i{width:12px;height:12px;border-radius:50%;border:2px solid var(--bar);background:var(--card)}
.vt-flag{background:linear-gradient(180deg,var(--gold-hi),var(--gold-lo));color:var(--on-gold)}
.vt-flag svg{width:15px;height:15px}
.vt-goal.done > .vt-row .vt-node{background:var(--fill);color:var(--tint)}
.vt-goal.done > .vt-row .t-headline{color:var(--text-2)}
.vt-row.has-kids::before{content:"";position:absolute;left:11px;top:20px;bottom:0;width:2px;background:var(--rail)}
.vt-kids{padding-left:22px}
.vt-kids > li{position:relative}
.vt-kids > li::before{content:"";position:absolute;left:-11px;top:0;bottom:0;width:2px;background:var(--rail)}
.vt-kids > li:last-child::before{bottom:auto;height:21px}
.vt-kids > li::after{content:"";position:absolute;left:-9px;top:19px;width:16px;height:2px;background:var(--rail)}
.pill{white-space:nowrap}
/* check-in: When ___ shows up, I will ___ */
.cue-group{gap:14px}
.cue-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:-8px -4px -8px 0}
.cue{display:flex;flex-direction:column;gap:8px}
.cue-w{font-family:var(--display);font-style:italic;font-weight:500;font-size:1.25rem;line-height:1.2;color:var(--accent)}
.cue .input + .cue-w,.cue .cue-sugg + .cue-w{margin-top:6px}
/* notes for later */
.note-line{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-weight:600}
.two-fields{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}
.note-card{gap:12px;padding:26px 22px}
.note-card .quote{font-size:1.55rem;line-height:1.32;white-space:pre-line}
/* ---------- premium layer: components ---------- */
:root{--chip-on-grad:linear-gradient(180deg,#22533E,#133427);--field-edge:rgba(13,33,25,.2);
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .05 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--chip-on-grad:linear-gradient(180deg,#E2CC8C,#C4A757);--field-edge:rgba(243,238,223,.18)}}
:root[data-theme="dark"]{--chip-on-grad:linear-gradient(180deg,#E2CC8C,#C4A757);--field-edge:rgba(243,238,223,.18)}

/* ground: a soft gold light from above; the status-bar strip turns to glass so the glow isn't cut */
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(120% 55% at 50% -14%,var(--glow-1),transparent 62%),radial-gradient(70% 42% at 108% 6%,var(--glow-2),transparent 70%)}
body::before{background:color-mix(in srgb,var(--bg) 80%,transparent);-webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4)}

/* type: bigger, tighter display titles; serif section heads; small-caps eyebrows on card labels */
.t-large{font-size:2.2rem;line-height:1.06;letter-spacing:-.015em}
.sect-head .t-title3{font-family:var(--display);font-weight:500;font-size:1.5rem;line-height:1.1;letter-spacing:-.005em}
.sect{gap:12px}
.feature .label,.thought-head > .t-sub,.group-title{font-size:.706rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.feature .label{color:var(--gold-hi)}
.thought .quote{font-size:1.42rem;line-height:1.3}

/* surfaces: hairline edge, top highlight, layered shadow tinted green */
.card,.qa,.hcard,.notice,.group,.disclose,.agroup,.pcard{border:1px solid var(--edge-soft);box-shadow:inset 0 1px 0 var(--hi),var(--lift-1)}
.card,.group,.hcard{border-radius:22px}
.card{padding:18px}
.card.list{padding:0 0 0 16px}
.cc-acts{gap:4px 12px}
.qa{border-radius:22px;min-height:106px;padding:16px;gap:5px}
.notice{border-radius:20px}
.disclose{border-radius:18px}
.choice{border:1.5px solid var(--edge-soft);border-radius:18px;box-shadow:inset 0 1px 0 var(--hi),var(--lift-1)}
.choice[aria-pressed="true"]{border-color:var(--tint);box-shadow:0 0 0 4px color-mix(in srgb,var(--tint) 14%,transparent),var(--lift-1)}
.row .ic,.qa .qa-ic{background:linear-gradient(180deg,var(--tile-hi),var(--tile-lo));box-shadow:inset 0 1px 0 var(--hi),0 1px 2px hsl(150 45% 12% / .07)}
.row .ic{border-radius:10px}
.qa .qa-ic{width:40px;height:40px;border-radius:13px}

/* the brand card: deep green with a warm light in the corner and a fine grain */
.feature,.reframe{position:relative;border:1px solid rgba(243,238,223,.08);background:var(--grain),radial-gradient(120% 85% at 100% 0%,rgba(205,180,106,.2),rgba(205,180,106,0) 58%),radial-gradient(90% 70% at 0% 100%,rgba(0,0,0,.20),transparent 70%),linear-gradient(165deg,var(--feature-hi),var(--feature-lo));box-shadow:inset 0 1px 0 rgba(255,255,255,.10),var(--lift-3)}
.feature{border-radius:26px;padding:22px;gap:14px}
.reframe{border-radius:22px}
.vcard{padding:28px 22px}
.vcard .vals{font-size:1.6rem}

/* buttons: gold with a lit top edge; presses spring */
.btn-primary,.toast button{background:linear-gradient(180deg,var(--gold-hi),var(--gold-lo));box-shadow:inset 0 1px 0 rgba(255,255,255,.45),var(--gold-shadow)}
.btn-secondary{background:color-mix(in srgb,var(--tint) 6%,transparent)}
.btn-quiet{border-color:var(--edge-soft);box-shadow:inset 0 1px 0 var(--hi)}
.pill{background:linear-gradient(180deg,var(--gold-hi),var(--gold-lo))}
.btn,.qa,.choice,.chip,.tab,.hcard,.icon-btn,.step-btn,.disclose,.jentry,.toast button,.seg button{transition:transform .4s var(--ease-press),box-shadow .25s ease,background-color .2s ease,border-color .2s ease,color .2s ease,opacity .2s ease}
.btn:active,.qa:active,.choice:active,.chip:active,.tab:active,.icon-btn:active,.step-btn:active,.disclose:active,.toast button:active,.jentry:active{transform:scale(.965);opacity:1;transition-duration:.12s}

/* chips, toggles, segmented */
.chip{border:1px solid var(--edge-soft);box-shadow:inset 0 1px 0 var(--hi)}
.chip[aria-pressed="true"]{border-color:transparent;background:var(--chip-on-grad);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 4px 10px -4px hsl(150 45% 12% / .35)}
.step[aria-pressed="true"] .box,.choice[aria-pressed="true"] .tick,.checkrow[aria-pressed="true"] .box,.done-mark,.pnode.done{background:var(--chip-on-grad)}
.done-mark{width:80px;height:80px;box-shadow:0 0 0 8px color-mix(in srgb,var(--chip-on) 12%,transparent),var(--lift-2);animation:pop .6s var(--ease-spring) both}
.seg{border-radius:14px;padding:3px;box-shadow:inset 0 1px 2px hsl(150 45% 12% / .07)}
.seg button{border-radius:11px}
.seg button[aria-pressed="true"]{box-shadow:0 1px 2px hsl(150 45% 12% / .10),0 4px 10px -4px hsl(150 45% 12% / .16)}
.prog{height:7px}
.prog i{background:var(--prog)}

/* fields */
.input,.textarea{border-radius:14px;border-color:var(--field-edge);box-shadow:inset 0 1px 2px hsl(150 45% 12% / .05);transition:border-color .2s,box-shadow .2s}
.input:focus,.textarea:focus{outline:none;border-color:var(--gold-lo);box-shadow:0 0 0 4px rgba(205,180,106,.24)}

/* navigation layer: glass bars that float above the content */
.navbar.scrolled{background:var(--glass);border-bottom-color:transparent;box-shadow:0 1px 0 var(--edge-soft),0 12px 28px -22px hsl(150 45% 12% / .45);-webkit-backdrop-filter:blur(24px) saturate(1.8);backdrop-filter:blur(24px) saturate(1.8)}
.tabbar{height:64px;border-radius:32px;background:var(--glass);border:1px solid var(--glass-edge);-webkit-backdrop-filter:blur(26px) saturate(1.9);backdrop-filter:blur(26px) saturate(1.9);box-shadow:var(--glass-shadow)}
.tab{border-radius:27px}
.tab[aria-current="page"]{color:var(--tab-on);background:var(--tab-on-bg);box-shadow:inset 0 1px 0 var(--hi)}
.tab svg{transition:transform .45s var(--ease-spring)}
.tab[aria-current="page"] svg{transform:translateY(-1px) scale(1.06)}

/* sheets, flows, toast */
.sheet{border-radius:28px 28px 0 0;box-shadow:0 -1px 0 var(--hi),0 -18px 50px rgba(0,0,0,.22);animation:up .5s var(--ease-spring) both}
.grab{width:40px;background:var(--edge-soft);background:color-mix(in srgb,var(--text) 22%,transparent)}
.asheet{animation:up .45s var(--ease-spring) both}
.agroup{border-radius:18px}
.abtn.cancel{border-radius:18px}
.flow{background:radial-gradient(120% 55% at 50% -14%,var(--glow-1),transparent 62%),var(--bg)}
.flow-foot{background:color-mix(in srgb,var(--bg) 82%,transparent);border-top-color:transparent;box-shadow:0 -1px 0 var(--edge-soft);-webkit-backdrop-filter:blur(20px) saturate(1.5);backdrop-filter:blur(20px) saturate(1.5)}
.meter-bars span{height:5px}
.meter-bars span.on{background:var(--prog)}
.toast{border-radius:20px;background:color-mix(in srgb,var(--text) 90%,transparent);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),var(--lift-3);-webkit-backdrop-filter:blur(20px) saturate(1.6);backdrop-filter:blur(20px) saturate(1.6);animation:toast-in .5s var(--ease-spring) both}
.lock-prev img{box-shadow:var(--lift-3)}

/* each screen settles in, one block after another */
.app > *{animation:rise-in .6s var(--ease-press) both}
.app > :nth-child(2){animation-delay:.04s}.app > :nth-child(3){animation-delay:.08s}.app > :nth-child(4){animation-delay:.12s}
.app > :nth-child(5){animation-delay:.16s}.app > :nth-child(6){animation-delay:.2s}.app > :nth-child(n+7){animation-delay:.24s}
.loading img{animation:breathe 2.4s ease-in-out infinite}
@keyframes rise-in{from{opacity:0;transform:translateY(12px)}}
@keyframes toast-in{from{opacity:0;transform:translateY(16px) scale(.96)}}
@keyframes pop{from{opacity:0;transform:scale(.6)}}

@keyframes up{from{transform:translateY(40px);opacity:0}}
@keyframes fade{from{opacity:0}}
@keyframes breathe{50%{opacity:.6}}
/* ---------- Premium Home (C8 "more premium", Oct 26-27, 2026) ----------
   Michael chose the C8 direction (his drone photo of the pier, the Everest Therapy Solutions site's colors and type)
   and said "Build the premium". Built screen by screen; this layer is Home only (.pm-home on <main>) plus the tab
   bar. Colors and fonts are the Everest site's (ets-site/assets/site.css): cream ground, hunter and forest greens,
   gold as small accents; Cormorant Garamond (400/500) for display, Avenir Next with Mulish where it isn't installed.
   Fewer boxes: space and hairlines separate things. One solid green button per block. Dark mode uses the Mindset
   Evolution site's dark palette. */
:root{
  --pm-ground:#F9F4F1; --pm-paper:#FEFCFB; --pm-line:#E7DFD8; --pm-line2:#DDD4C9; --pm-gold:#C3AA53; --pm-gold-deep:#9E8737; --pm-gold-text:#75622A;
  --pm-head:#153B2B; --pm-link:#24513D; --pm-ink:#1A2420; --pm-stone:#4A5750; --pm-btn:#153B2B; --pm-btn-text:#F2F4EE; --pm-rail:#A89878; --pm-plank:#D8CDB6;
  --pm-pier:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 10.5L12 5l9 5.5' fill='none' stroke='%23153B2B' stroke-width='1.4' stroke-linejoin='round'/%3E%3Cpath d='M5 10.5V17M19 10.5V17' stroke='%23153B2B' stroke-width='1.2'/%3E%3Cpath d='M3 17.5h18' stroke='%23153B2B' stroke-width='1.6'/%3E%3C/svg%3E");
  --pm-serif:'Cormorant Garamond','Cormorant',Georgia,serif;
  --pm-sans:'Avenir Next',Avenir,'Mulish','Segoe UI',system-ui,sans-serif;
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
    --pm-ground:#0F1A15; --pm-paper:#152219; --pm-line:#28372F; --pm-line2:#33453A; --pm-gold:#D2BB68; --pm-gold-deep:#D2BB68; --pm-gold-text:#D2BB68;
    --pm-head:#E8ECE5; --pm-link:#D2BB68; --pm-ink:#E8ECE5; --pm-stone:#A6B4AA; --pm-btn:#D2BB68; --pm-btn-text:#0F1A15; --pm-rail:#7A6E57; --pm-plank:#2C3A31; --pm-pier:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 10.5L12 5l9 5.5' fill='none' stroke='%23E8ECE5' stroke-width='1.4' stroke-linejoin='round'/%3E%3Cpath d='M5 10.5V17M19 10.5V17' stroke='%23E8ECE5' stroke-width='1.2'/%3E%3Cpath d='M3 17.5h18' stroke='%23E8ECE5' stroke-width='1.6'/%3E%3C/svg%3E");
} }
:root[data-theme="dark"]{
    --pm-ground:#0F1A15; --pm-paper:#152219; --pm-line:#28372F; --pm-line2:#33453A; --pm-gold:#D2BB68; --pm-gold-deep:#D2BB68; --pm-gold-text:#D2BB68;
    --pm-head:#E8ECE5; --pm-link:#D2BB68; --pm-ink:#E8ECE5; --pm-stone:#A6B4AA; --pm-btn:#D2BB68; --pm-btn-text:#0F1A15; --pm-rail:#7A6E57; --pm-plank:#2C3A31; --pm-pier:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 10.5L12 5l9 5.5' fill='none' stroke='%23E8ECE5' stroke-width='1.4' stroke-linejoin='round'/%3E%3Cpath d='M5 10.5V17M19 10.5V17' stroke='%23E8ECE5' stroke-width='1.2'/%3E%3Cpath d='M3 17.5h18' stroke='%23E8ECE5' stroke-width='1.6'/%3E%3C/svg%3E");
}
body:has(.pm-home){--bg:var(--pm-ground)}
body:has(.pm-home)::after{display:none}
body:has(.navbar.on-photo)::before{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}
.navbar.on-photo{color:#fff}
.navbar.on-photo .logo-l{display:none}
.navbar.on-photo .logo-d{display:block}
.navbar.on-photo .icon-btn{color:#fff}
.pm-home{font-family:var(--pm-sans);color:var(--pm-ink);font-weight:400;gap:30px}
.pm-photo{position:relative;overflow:hidden;height:calc(290px + env(safe-area-inset-top,0px));margin:calc(-55px - env(safe-area-inset-top,0px)) calc(-1 * max(var(--gutter),env(safe-area-inset-right,0px))) -4px calc(-1 * max(var(--gutter),env(safe-area-inset-left,0px)));background:#1D2A33}
/* the picture and the clip share one gentle grade (calmer, warmer), so the first frame hands over to the clip unseen */
.pm-bg,.pm-vid{position:absolute;inset:0;width:100%;height:100%;filter:saturate(.84) sepia(.06) contrast(1.03)}
.pm-bg{background:url(home-start.jpg) center 55%/cover no-repeat}
.pm-photo.end .pm-bg{background-image:url(home-end.jpg)}
.pm-vid{object-fit:cover;object-position:center 55%;opacity:0;transition:opacity .6s ease}
.pm-photo.live .pm-vid,.pm-photo.done .pm-vid{opacity:1}
.pm-photo::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(to bottom,rgba(0,0,0,.42),rgba(0,0,0,0) 34%),radial-gradient(130% 100% at 50% 40%,transparent 60%,rgba(0,0,0,.18))}
.pm-pause{position:absolute;right:14px;bottom:14px;z-index:2;width:34px;height:34px;padding:0;border:0;border-radius:50%;display:grid;place-items:center;background:rgba(21,59,43,.72);color:#F2F4EE;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.pm-pause::after{content:"";position:absolute;inset:-6px}
/* the opening: the picture settles from a slight zoom as the logo screen sweeps away */
.pm-photo.intro .pm-bg,.pm-photo.intro .pm-vid{animation:pm-settle 2.2s cubic-bezier(.2,.7,.15,1) both}
@keyframes pm-settle{from{transform:scale(1.14)}}
.splash{position:fixed;inset:0;z-index:70;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:24px 24px 30vh;background:var(--bg);color:var(--text);animation:swoosh-up .85s cubic-bezier(.76,0,.24,1) .35s both;will-change:transform}
.splash img{width:72px;height:72px}
.splash > *{animation:swoosh-lift .85s cubic-bezier(.76,0,.24,1) .35s both}
.splash::after{content:"";position:absolute;left:-10%;right:-10%;bottom:-38px;height:76px;border-radius:50%;background:var(--bg)}
@keyframes swoosh-up{to{transform:translateY(-112%)}}
@keyframes swoosh-lift{to{transform:translateY(-60px);opacity:0}}
@media (prefers-reduced-motion:reduce){
  .pm-photo.intro .pm-bg,.pm-photo.intro .pm-vid{animation:none}
  .splash,.splash > *{animation:splash-fade .3s ease both}
}
@keyframes splash-fade{to{opacity:0}}
.pm-home .ltitle{gap:6px}
.pm-home .pm-date{font-size:.8rem;font-weight:500;letter-spacing:.05em;color:var(--pm-stone)}
/* their values, right under the greeting, so they're the first thing Home shows (Michael, Oct 30: "Values need to be
   easily viewed"). Each opens that value's page. */
.pm-vals{display:flex;flex-direction:column;gap:10px;margin-top:-12px}
.pm-vals .label::before{content:"";width:22px;height:1px;flex:none;background:var(--pm-gold)}
.pm-vchips{display:flex;flex-wrap:wrap;gap:8px}
.pm-vchip{min-height:42px;padding:0 18px;border-radius:999px;border:1px solid var(--pm-line2);background:var(--pm-paper);color:var(--pm-head);font-family:var(--pm-serif);font-size:1.2rem;font-weight:500;line-height:1.1;cursor:pointer}
.pm-home .t-large{font-family:var(--pm-serif);font-weight:500;font-size:2.55rem;line-height:1.02;letter-spacing:0;color:var(--pm-head)}
.pm-home .c2,.pm-home .c3{color:var(--pm-stone)}
.pm-home .t-headline{font-weight:600}
.pm-home .card,.pm-home .notice{background:var(--pm-paper);border:1px solid var(--pm-line);box-shadow:none;border-radius:16px}
.pm-home .row{border-top-color:var(--pm-line)}
.pm-home .row .ic{background:none;box-shadow:none;color:var(--pm-gold-deep)}
.pm-home .tbtn,.pm-home .ilink{color:var(--pm-link);font-weight:500;font-size:.88rem;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.pm-home .btn{font-weight:500;letter-spacing:.01em}
.pm-home .btn-primary{background:var(--pm-btn);color:var(--pm-btn-text);box-shadow:none}
.pm-home .btn-secondary{background:transparent;border:1px solid var(--pm-line2);color:var(--pm-head)}
.pm-home .sect{gap:8px}
.pm-home .sect-head{padding-inline:0}
.pm-home .sect-head .t-title3{font-family:var(--pm-serif);font-weight:400;font-size:2rem;line-height:1.05;color:var(--pm-head)}
.pm-home .label,.pm-home .thought-head > .t-sub{display:flex;align-items:center;gap:10px;font-size:.78rem;font-weight:600;letter-spacing:.02em;text-transform:none;color:var(--pm-gold-text)}
/* this week's step: no box, the step in the serif, one green button */
.pm-home .feature{background:none;border:0;border-radius:0;box-shadow:none;padding:0;color:var(--pm-ink);gap:10px}
.pm-home .feature .label::before{content:"";width:22px;height:1px;flex:none;background:var(--pm-gold)}
.pm-home .feature .t-title3{font-family:var(--pm-serif);font-weight:500;font-size:1.72rem;line-height:1.14;color:var(--pm-ink)}
.pm-home .feature .btn,.pm-home .feature .btn-secondary{align-self:flex-start;width:auto;margin-top:6px;padding:0 26px;background:var(--pm-btn);border-color:transparent;color:var(--pm-btn-text);box-shadow:none}
/* today's thought: between two hairlines, not in a card */
.pm-home .thought{background:none;border:0;border-radius:0;padding:16px 0;border-top:1px solid var(--pm-line);border-bottom:1px solid var(--pm-line)}
.pm-home .thought .quote{font-family:var(--pm-serif);font-weight:400;font-size:1.5rem;line-height:1.28;color:var(--pm-ink)}
.pm-home .course-card > .t-headline{font-family:var(--pm-serif);font-weight:500;font-size:1.5rem;line-height:1.12;color:var(--pm-head)}
/* the goal ladder, drawn as the dock */
.pm-home .sect .card.list:has(> .goal){background:none;border:0;border-radius:0;padding:0}
.pm-home .goal{border-top-color:var(--pm-line);padding:16px 0 6px}
.pm-home .card.list > .goal:first-child{padding-top:4px}
.pm-home .pmap-v{display:flex;align-items:center;gap:10px;font-size:.78rem;font-weight:600;color:var(--pm-gold-text)}
.pm-home .hpath > .pmap-v::before{content:"";width:22px;height:1px;flex:none;background:var(--pm-gold)}
.pm-home .hpath .pmap-list::before{left:4px;width:16px;top:26px;bottom:18px;opacity:1;background:repeating-linear-gradient(to bottom,transparent 0 7px,var(--pm-plank) 7px 8px);border-left:1px solid var(--pm-rail);border-right:1px solid var(--pm-rail)}
.pm-home .hpath .pmap-flag{background:var(--pm-ground) var(--pm-pier) center/24px no-repeat;box-shadow:none;border-radius:0}
.pm-home .hpath .pmap-flag svg{display:none}
.pm-home .hpath .pmap-dot{width:12px;height:12px;margin:0 6px;border:1.4px solid var(--pm-head);background:var(--pm-ground)}
.pm-home .hpath .pmap-start .pmap-dot{background:var(--pm-head);border-color:var(--pm-head);box-shadow:0 0 0 2px var(--pm-gold)}
.pm-home .hpath-fold .pmap-dot{border-style:dashed}
.pm-home .hpath-fold .pmap-t,.pm-home .hpath-fold .pmap-f{color:var(--pm-link)}
.pm-home .pmap-t{font-weight:500;font-size:.97rem;color:var(--pm-ink)}
.pm-home .pmap-top .pmap-t{font-weight:600}
.pm-home .pmap-f{font-weight:500;color:var(--pm-stone)}
.pm-home .pill{background:none;box-shadow:inset 0 0 0 1px var(--pm-gold);color:var(--pm-gold-text);font-weight:600;padding:3px 10px}
.pm-home .goal .step{border-top:1px solid var(--pm-line);margin-top:4px;padding-top:10px}
.pm-home .goal .step .t-foot{color:var(--pm-gold-text)}
.pm-home .box{border:1.5px solid var(--pm-link)}
.pm-home .hpath-also{border-top-color:var(--pm-line)}
.pm-home .hpath-also .pmap-dot{border:1.3px dashed var(--pm-rail);background:none}
.pm-home .prog{height:4px;background:var(--pm-line)}
.pm-home .prog i{background:var(--pm-head)}
/* Home widgets: a two-column grid; small widgets pair up, wide ones take the row (Edit Home sets which and how) */
.wgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;grid-auto-flow:row dense}
.wcell{display:flex;min-width:0;position:relative;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}
.wcell.wide{grid-column:1 / -1}
.wcell:has(> .wwig:empty){display:none}
.wwig{flex:1 1 auto;min-width:0;display:flex;position:relative}
.wwig > :first-child{flex:1 1 auto;min-width:0}
.pm-home .wwig > :not(.wbadge){background:var(--pm-paper);border:1px solid var(--pm-line);border-radius:20px;padding:16px;box-shadow:none;margin:0;display:flex;flex-direction:column;gap:10px;color:var(--pm-ink)}
.pm-home .wwig > .remember-card{padding:0;gap:0}
.pm-home .wwig > * .card,.pm-home .wwig > * .card.list{background:none;border:0;border-radius:0;padding:0;box-shadow:none}
.pm-home .wcell .label::before{content:"";width:18px;height:1px;flex:none;background:var(--pm-gold)}
.pm-home .wcell h2.label{margin:0}
.pm-home .whead{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:-4px}
.pm-home .whead .tbtn{min-height:32px}
.pm-home .wwig > .feature .t-title3{font-size:1.6rem}
.pm-home .wtile{align-items:flex-start;justify-content:space-between;gap:14px;min-height:138px;text-align:left;font:inherit;cursor:pointer}
.pm-home .wcell.wide .wtile{flex-direction:row;align-items:center;justify-content:flex-start;min-height:0;padding:14px 16px}
.pm-home .wti{width:36px;height:36px;flex:none;border-radius:50%;display:grid;place-items:center;box-shadow:inset 0 0 0 1px var(--pm-line2);color:var(--pm-gold-deep)}
.pm-home .wti svg{width:18px;height:18px}
.pm-home .wtx{display:flex;flex-direction:column;gap:3px;min-width:0}
.pm-home .wtx .t-headline{font-size:.97rem;font-weight:600;color:var(--pm-head)}
.pm-home .wvals{justify-content:flex-start}
.pm-home .wv-names{display:flex;flex-direction:column;font-family:var(--pm-serif);font-weight:500;font-size:1.35rem;line-height:1.2;color:var(--pm-head)}
.pm-home .wcell.wide .wv-names{flex-direction:row;flex-wrap:wrap;gap:0 14px}
.pm-home .wv-st{font-family:var(--pm-serif);font-style:italic;font-size:1.05rem;line-height:1.3;color:var(--pm-link)}
.pm-home .wwig > .thought .quote{font-size:1.32rem}
/* more widgets (Oct 27, 2026) */
.pm-home a.wtile,.pm-home a.wtile *{text-decoration:none}
.pm-home .wcell .wtile.wcol{flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:10px}
.pm-home .wtile .label{width:100%}
.pm-home .wchips{gap:8px}
.pm-home .wchips .chip{min-height:40px;padding:6px 15px;font-size:.88rem}
.pm-home .wq{margin:0;font-family:var(--pm-serif);font-weight:500;font-size:1.32rem;line-height:1.25;color:var(--pm-head)}
.pm-home .wacts{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.pm-home .wp-list{display:flex;flex-direction:column;gap:8px}
.pm-home .wcell.wide .wp-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px;width:100%}
.pm-home .wp-one{display:flex;flex-direction:column;gap:2px;min-width:0}
.pm-home .wp-name{font-family:var(--pm-serif);font-weight:500;font-size:1.3rem;line-height:1.15;color:var(--pm-head)}
.pm-home .wsaved .quote{font-size:1.22rem;margin:0}
.pm-home .sess-plan .cc-acts{gap:0 16px}
.pm-home .sess-plan .tbtn{min-height:40px;font-size:.882rem}
.pm-home .wnums{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.pm-home .wnums > div{display:flex;flex-direction:column;gap:4px;min-width:0}
.pm-home .wn{font-family:var(--pm-serif);font-weight:500;font-size:2.2rem;line-height:1;color:var(--pm-head)}
.pm-home .wbe-row{display:flex;align-items:center;gap:18px}
.pm-home .be.be-mini{width:92px;max-width:92px;flex:none;pointer-events:none}
.pm-home .be-mini .seg-p{stroke:var(--pm-paper)}
.pm-home .wbe-list{display:flex;flex-direction:column;gap:3px}
.wedit{display:flex;justify-content:center;margin-top:-8px}
/* wiggle mode */
@keyframes wiggle{0%,100%{transform:rotate(-.55deg)}50%{transform:rotate(.55deg)}}
@keyframes wiggle-wide{0%,100%{transform:rotate(-.25deg)}50%{transform:rotate(.25deg)}}
.wgrid.editing .wcell{touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:grab}
.wgrid.editing .wwig{animation:wiggle .3s ease-in-out infinite;transform-origin:50% 50%}
.wgrid.editing .wcell.wide .wwig{animation-name:wiggle-wide}
.wgrid.editing .wcell:nth-child(even) .wwig{animation-delay:-.15s;animation-duration:.32s}
.wgrid.editing .wwig > :not(.wbadge){pointer-events:none}
.wgrid.editing .wcell:focus-visible{outline:2px solid var(--pm-gold);outline-offset:4px;border-radius:22px}
.wgrid.editing .wwig:not(:has(> :not(.wbadge)))::before{content:attr(data-ph);flex:1;display:flex;align-items:center;min-height:84px;padding:14px 16px;border:1.5px dashed var(--pm-line2);border-radius:20px;font-size:.82rem;color:var(--pm-stone)}
.wcell.lifted{z-index:20;cursor:grabbing}
.wcell.lifted .wwig{animation:none;transform:scale(1.04);transition:transform .15s ease}
.wcell.lifted .wwig > :not(.wbadge){box-shadow:0 18px 40px -16px rgba(0,0,0,.45)}
.wcell.pop .wwig{animation:pop-in .45s cubic-bezier(.2,.9,.3,1.3) both}
@keyframes pop-in{from{transform:scale(.6);opacity:0}}
.wbadge{position:absolute;z-index:3;width:28px;height:28px;padding:0;border:0;border-radius:50%;display:grid;place-items:center;pointer-events:auto;box-shadow:0 2px 6px rgba(0,0,0,.25)}
.wbadge::after{content:"";position:absolute;inset:-8px}
.wbadge svg{width:15px;height:15px}
.wrm{top:-9px;left:-9px;background:#E9E5DF;color:#1A2420}
.wsz{bottom:-9px;right:-9px;background:var(--pm-btn);color:var(--pm-btn-text)}
.wbar{position:fixed;z-index:40;top:calc(8px + env(safe-area-inset-top,0px));left:max(12px,env(safe-area-inset-left,0px));right:max(12px,env(safe-area-inset-right,0px));max-width:576px;margin-inline:auto;display:flex;align-items:center;gap:10px;padding:6px 6px 6px 6px;border-radius:999px;background:var(--glass);border:1px solid var(--glass-edge);-webkit-backdrop-filter:blur(24px) saturate(1.8);backdrop-filter:blur(24px) saturate(1.8);box-shadow:var(--glass-shadow)}
.wbar-add{flex:none;width:40px;height:40px;border:0;border-radius:50%;display:grid;place-items:center;background:var(--pm-btn);color:var(--pm-btn-text);padding:0}
.wbar-add[aria-expanded="true"] svg{transform:rotate(45deg)}
.wbar-add svg{transition:transform .2s ease}
.wbar-t{flex:1;text-align:center;font-size:.82rem;font-weight:500;color:var(--text-2)}
.wbar-done{flex:none;min-height:40px}
/* the widget bank: a panel at the bottom, Home stays in view above it */
.wbank{position:fixed;z-index:35;left:0;right:0;bottom:0;max-width:600px;margin-inline:auto;height:min(54vh,480px);display:flex;flex-direction:column;background:var(--pm-ground);border-radius:22px 22px 0 0;box-shadow:0 -14px 40px -10px rgba(0,0,0,.35);animation:up .32s cubic-bezier(.2,.8,.2,1) both;font-family:var(--pm-sans);color:var(--pm-ink)}
.wbank-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 14px 6px;border-bottom:1px solid var(--pm-line)}
.wbank-head .t-headline{font-weight:600}
.wbank-body{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:12px 16px calc(24px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:22px}
.wbank-item{display:flex;flex-direction:column;gap:10px}
.wbank-top{display:flex;align-items:center;gap:12px}
.wbank-top .rtxt{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.wbank-size{align-self:flex-start;width:auto}
.wbank-size button{min-height:30px;padding:0 12px;font-size:.75rem}
.wbank-prev{pointer-events:none;max-height:240px;overflow:hidden;-webkit-mask-image:linear-gradient(to bottom,#000 78%,transparent);mask-image:linear-gradient(to bottom,#000 78%,transparent)}
.wbank-none{padding:18px;border:1.5px dashed var(--pm-line2);border-radius:20px}
.wbank-group{display:flex;flex-direction:column;gap:22px}
.wbank-gh{margin:0;padding-top:16px;border-top:1px solid var(--pm-line);font-family:var(--pm-serif);font-weight:500;font-size:1.3rem;line-height:1.2;color:var(--pm-head)}
.wbank-group:first-child .wbank-gh{padding-top:4px;border-top:0}
body:has(.wbank) .app{padding-bottom:calc(min(54vh,480px) + 24px)}
@media (prefers-reduced-motion:reduce){
  .wgrid.editing .wwig{animation:none;outline:1.5px dashed var(--pm-line2);outline-offset:3px;border-radius:20px}
  .wcell.pop .wwig{animation:none}
}
/* the tab bar (every tab): the tab you're on in green with a small gold dot, no filled pill */
.tab[aria-current="page"]{background:none;box-shadow:none;color:var(--pm-head);position:relative}
.tab[aria-current="page"]::after{content:"";position:absolute;bottom:4px;left:50%;width:4px;height:4px;margin-left:-2px;border-radius:50%;background:var(--pm-gold)}
.tab[aria-current="page"] svg{transform:none}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none!important}
  .loading img,.pnode.here,.app > *,.done-mark{animation:none!important}
  .sheet,.toast,.asheet{animation:fade .2s ease both!important}
}
@media (prefers-reduced-transparency:reduce){
  .tabbar,.navbar.scrolled{background:var(--bar-solid);-webkit-backdrop-filter:none;backdrop-filter:none}
  body::before,.flow-foot{background:var(--bg);-webkit-backdrop-filter:none;backdrop-filter:none}
  .toast{background:var(--text);-webkit-backdrop-filter:none;backdrop-filter:none}
}
@media (prefers-contrast:more){
  .tabbar,.navbar.scrolled{background:var(--bar-solid);-webkit-backdrop-filter:none;backdrop-filter:none}
  .card,.choice,.disclose,.group,.qa,.hcard,.notice,.chip,.input,.textarea{border:1px solid var(--edge)}
  .c3{color:var(--text-2)}
}

html,body{margin:0}
.gate{min-height:100vh;min-height:100dvh;max-width:440px;margin:0 auto;padding:max(64px,env(safe-area-inset-top)) 24px 48px;display:flex;flex-direction:column;justify-content:center;gap:14px}
.gate .btn{margin-top:4px}
