:root{
  /* Surfaces — warm cream */
  --bg:#f7f4f0; --bg-1:#f2ede7; --bg-2:#ece7df; --bg-3:#e4ddd4;
  --surface:#ffffff; --surface-2:#f2ede7; --surface-3:#ece7df;

  /* Hairlines */
  --line:rgba(0,0,0,0.08); --line-soft:rgba(0,0,0,0.05); --line-strong:rgba(0,0,0,0.14);
  --line-warm:#e8e3db;

  /* Ink — warm near-black */
  --ink:#141210; --ink-soft:#3a3631; --ink-mute:#5a5650; --ink-dim:#8a8480;

  /* Brand accent — BrainVaultAI violet */
  --amber:#7c3aed; --amber-2:#9561fa; --amber-deep:#6d28d9;
  --teal:#2563eb; --teal-deep:#1d4ed8;
  --ember:#ea580c; --sage:#16a34a; --rose-warn:#ea580c;

  /* Legacy aliases */
  --p1:#7c3aed; --p2:#9561fa; --p3:#2563eb;
  --gold:#b8893a; --green:#16a34a; --red:#dc2626;

  /* Shadows — light system */
  --glow:0 2px 6px rgba(0,0,0,0.05),0 16px 40px rgba(0,0,0,0.09);
  --glow-soft:0 1px 2px rgba(0,0,0,0.04),0 4px 16px rgba(0,0,0,0.06);
  --shadow-card:0 1px 3px rgba(0,0,0,0.05),0 4px 16px rgba(0,0,0,0.07);
  --shadow-lift:0 4px 12px rgba(0,0,0,0.07),0 20px 48px rgba(0,0,0,0.11);
  --shadow-card-hover:0 2px 8px rgba(0,0,0,0.06),0 12px 32px rgba(0,0,0,0.10);

  --ease:cubic-bezier(.22,1,.36,1);
  --ease-editorial:cubic-bezier(.22,.61,.36,1);
  --ease-out-premium:cubic-bezier(0.32,0.72,0,1);

  --r-sm:6px; --r-md:14px; --r-lg:20px; --r-xl:28px; --r-pill:999px;

  /* Type families — Bricolage everywhere, no italic serif */
  --serif:'Bricolage Grotesque','Inter',system-ui,sans-serif;
  --display:'Bricolage Grotesque','Inter',system-ui,sans-serif;
  --body:'Plus Jakarta Sans','Inter',ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;
  --surface-glass:rgba(255,255,255,0.72);
  --line-glass:rgba(255,255,255,0.18);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:var(--body);
  background:var(--bg); color:var(--ink);
  font-size:16px; line-height:1.65; letter-spacing:-0.011em;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  min-height:100vh; overflow-x:hidden;
}
body::before{
  content:''; position:fixed; inset:0; pointer-events:none; z-index:0;
  background-image:radial-gradient(circle, rgba(0,0,0,0.045) 1px, transparent 1px);
  background-size:28px 28px; opacity:.55;
}
body::after{
  content:''; position:fixed; inset:0; pointer-events:none; z-index:0;
  background:
    radial-gradient(55% 50% at 88% 0%, rgba(124,58,237,0.06) 0%, transparent 60%),
    radial-gradient(45% 40% at 8% 90%, rgba(22,163,74,0.04) 0%, transparent 55%);
}
.app{position:relative; z-index:2}
h1,h2,h3,h4{
  font-family:var(--display);
  color:var(--ink); letter-spacing:-0.025em;
  font-weight:600; line-height:1.1;
  font-optical-sizing:auto;
}
h1{font-size:clamp(2rem,4vw,3.2rem); letter-spacing:-0.035em; font-weight:700}
h2{font-size:clamp(1.4rem,2.6vw,1.9rem); letter-spacing:-0.025em; font-weight:600}
h3{font-size:1.08rem; letter-spacing:-0.015em}
h4{font-size:0.98rem; font-weight:600}
.serif{font-family:var(--display); font-style:normal; font-weight:700; letter-spacing:-0.025em}
a{color:var(--p1); text-decoration:none}
button{font:inherit; cursor:pointer; border:none; background:none; color:inherit}

/* NAV */
.nav{
  position:sticky; top:12px; z-index:50;
  margin:12px 20px 0;
  background:rgba(252,250,247,0.82);
  backdrop-filter:saturate(180%) blur(20px);
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  border:1px solid rgba(255,255,255,0.35);
  border-radius:18px;
  box-shadow:0 4px 24px rgba(0,0,0,0.07),0 1px 4px rgba(0,0,0,0.04);
}
.nav-inner{max-width:1200px; margin:0 auto; padding:10px 24px; display:flex; align-items:center; gap:14px}
@media(max-width:480px){.nav-inner{padding:8px 14px; gap:8px}}
.brand{display:flex; align-items:center; gap:10px}
.brand-mark{
  width:32px; height:32px; border-radius:10px;
  background:linear-gradient(135deg, var(--amber) 0%, var(--amber-deep) 100%);
  display:flex; align-items:center; justify-content:center;
  font-weight:700; color:#ffffff; font-size:14px;
  box-shadow:var(--shadow-card);
}
.brand-orb{width:32px; height:32px; flex-shrink:0; display:flex; align-items:center; justify-content:center}
.brand-name{font-family:var(--display); font-weight:700; font-size:15px; letter-spacing:-0.015em; color:var(--ink)}
.brand-name b{color:var(--amber); font-weight:700}
.nav-spacer{flex:1}
.chip{
  display:inline-flex; align-items:center; gap:7px;
  padding:6px 12px; border-radius:var(--r-pill);
  background:#ffffff; border:1px solid var(--line-warm);
  font-size:12px; color:var(--ink-mute); font-weight:500;
  box-shadow:var(--shadow-card);
}
.chip b{color:var(--ink); font-weight:700}
.chip .dot{width:6px; height:6px; border-radius:50%; background:var(--green)}
.chip-btn{padding:6px 12px; border-radius:var(--r-pill); background:transparent; border:1px solid var(--line-warm); color:var(--ink-mute); font-size:12px; transition:.2s}
.chip-btn:hover{background:var(--surface-2); color:var(--ink)}

/* LAYOUT */
.layout{max-width:1200px; margin:0 auto; padding:24px 24px; display:grid; grid-template-columns:260px 1fr; gap:22px}
@media(max-width:1024px){.layout{grid-template-columns:1fr; padding:16px}}
@media(max-width:480px){.layout{padding:12px 14px; gap:14px}}

/* DASHBOARD */
.dashboard{
  grid-column:1/-1;
  background:#ffffff;
  border:1px solid var(--line-warm);
  border-radius:var(--r-xl);
  padding:0;
  position:relative; overflow:hidden;
  box-shadow:var(--shadow-card);
}
.dashboard::before{
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg, var(--amber), var(--amber-2), var(--teal));
  pointer-events:none; z-index:1;
}
.dash-grid{position:relative; z-index:0; display:grid; grid-template-rows:auto 1fr; gap:0}

/* STAT STRIP */
.stat-strip{
  display:grid; grid-template-columns:repeat(4,1fr);
  border:1px solid var(--line-warm); border-radius:var(--r-lg);
  overflow:hidden; background:var(--surface-2);
}
.stat-cell{padding:18px 24px; border-right:1px solid var(--line-warm); position:relative; display:flex; flex-direction:column; gap:6px; background:#ffffff}
.stat-cell:last-child{border-right:none}
.stat-cell::after{content:''; position:absolute; left:0; top:0; bottom:0; width:3px; transition:.3s}
.stat-cell:nth-child(1)::after{background:var(--amber)}
.stat-cell:nth-child(2)::after{background:var(--green)}
.stat-cell:nth-child(3)::after{background:var(--teal)}
.stat-cell:nth-child(4)::after{background:var(--gold)}
.stat-val{font-family:var(--display); font-size:2.2rem; font-weight:800; color:var(--ink); line-height:1; letter-spacing:-.04em}
.stat-val.c-amber{color:var(--amber)}
.stat-val.c-green{color:var(--green)}
.stat-val.c-teal{color:var(--teal)}
.stat-label{font-size:10px; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-mute); font-weight:700}
@media(max-width:700px){.stat-strip{grid-template-columns:repeat(2,1fr)}.stat-cell:nth-child(2){border-right:none}.stat-cell:nth-child(3){border-top:1px solid var(--line-warm)}}
@media(max-width:480px){.stat-cell{padding:14px 16px}.stat-val{font-size:1.8rem}}

/* DASH BODY */
.dash-body{display:grid; grid-template-columns:3fr 2fr; gap:0; align-items:center; padding:32px 36px}
@media(max-width:900px){.dash-body{grid-template-columns:1fr; gap:24px; padding:24px}}
/* stat strip border override - it's the top of the card, no separate border radius */
.stat-strip{border-radius:0; border:none; border-bottom:1px solid var(--line-warm)}

/* NEXT ACTION */
.next-action{display:flex; flex-direction:column; gap:0; padding-right:32px; border-right:1px solid var(--line)}
.na-eyebrow{font-size:10px; letter-spacing:.22em; text-transform:uppercase; color:var(--amber); font-weight:700; margin-bottom:16px; display:flex; align-items:center; gap:8px}
.na-eyebrow::before{content:''; width:16px; height:1px; background:var(--amber); display:inline-block}
.na-heading{font-family:var(--display); font-size:clamp(3rem,4.8vw,5.2rem); font-weight:800; color:var(--ink); line-height:.95; letter-spacing:-.04em; margin-bottom:16px}
.na-heading span{color:var(--amber); display:block}
.na-divider{width:40px; height:2px; background:linear-gradient(90deg, var(--amber), transparent); margin-bottom:18px; border-radius:1px}
.na-line{color:var(--ink-soft); font-size:15px; line-height:1.65; max-width:440px; margin-bottom:28px}
.na-cta{
  display:inline-flex; align-items:center; gap:10px;
  padding:13px 28px; background:linear-gradient(135deg, var(--amber), var(--amber-deep)); color:#ffffff;
  border-radius:var(--r-pill); font-weight:800; font-size:13.5px;
  letter-spacing:.03em; border:none; cursor:pointer; width:fit-content;
  transition:.2s var(--ease); box-shadow:0 4px 16px rgba(124,58,237,.3);
}
.na-cta:hover{background:linear-gradient(135deg, var(--amber-2), var(--amber)); transform:translateY(-2px); box-shadow:0 8px 28px rgba(124,58,237,.45)}
.na-cta svg{width:14px; height:14px; flex-shrink:0}

/* RIGHT COLUMN */
.dash-right-col{display:flex; flex-direction:column; align-items:center; gap:20px; padding-left:36px}
@media(max-width:900px){.dash-right-col{padding-left:0}}
.ring-wrap{display:flex; flex-direction:column; align-items:center; justify-content:center}
.ring{position:relative; width:170px; height:170px}
.ring svg{width:100%; height:100%; transform:rotate(-90deg)}
.ring-bg{fill:none; stroke:rgba(124,58,237,.08); stroke-width:8}
.ring-fill{fill:none; stroke:url(#ringGrad); stroke-width:8; stroke-linecap:round; transition:stroke-dasharray 1.1s var(--ease-editorial); filter:drop-shadow(0 0 8px rgba(124,58,237,.3))}
.ring-center{position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center}
.ring-num{font-family:var(--display); font-size:2.6rem; color:var(--ink); line-height:.88; letter-spacing:-.03em; font-weight:700}
.ring-label{font-size:10px; letter-spacing:.22em; text-transform:uppercase; color:var(--ink-mute); font-weight:600; margin-top:4px}
.ring-sub{font-size:11px; color:var(--amber); margin-top:6px; font-weight:500}

.dash-right{display:flex; flex-direction:column; gap:14px}
.chart-card{
  background:#ffffff; border:1px solid var(--line-warm);
  border-radius:var(--r-md); padding:14px 16px; box-shadow:var(--shadow-card);
}
.chart-title{font-size:10px; letter-spacing:.22em; text-transform:uppercase; color:var(--ink-mute); font-weight:700; margin-bottom:10px}
.bar-row{display:grid; grid-template-columns:90px 1fr 30px; gap:10px; align-items:center; margin-bottom:6px; font-size:11px}
.bar-row:last-child{margin-bottom:0}
.bar-label{color:var(--ink-soft); font-weight:500}
.bar-track{height:6px; background:var(--bg-1); border-radius:var(--r-pill); overflow:hidden}
.bar-fill{height:100%; border-radius:var(--r-pill); transition:width .8s var(--ease)}
.bar-fill.p1{background:linear-gradient(90deg, var(--p1), var(--p2)); box-shadow:0 0 6px rgba(124,58,237,.25)}
.bar-fill.p2{background:linear-gradient(90deg, var(--teal), var(--teal-deep))}
.bar-fill.p3{background:linear-gradient(90deg, #d4a85c, var(--gold))}
.bar-fill.p4{background:linear-gradient(90deg, #3fb37e, var(--green))}
.bar-val{color:var(--ink); font-weight:700; text-align:right}

.agents-card{
  background:#ffffff; border:1px solid var(--line-warm);
  border-radius:var(--r-md); padding:14px 16px; box-shadow:var(--shadow-card);
}
.agents-row{display:grid; grid-template-columns:repeat(3,1fr); gap:8px}
.ag{
  background:var(--surface-2); border:1px solid var(--line-warm); border-radius:10px;
  padding:10px 8px; text-align:center; position:relative; overflow:hidden;
  transition:.4s var(--ease);
}
.ag.locked{opacity:.4}
.ag.live{
  border-color:var(--p1); background:rgba(124,58,237,.05);
  box-shadow:var(--shadow-card);
}
.ag-name{font-weight:800; font-size:13px; color:var(--ink); letter-spacing:.05em}
.ag-role{font-size:9px; letter-spacing:.15em; color:var(--ink-mute); text-transform:uppercase; margin-top:2px; font-weight:600}
.ag-stat{font-size:9px; color:var(--ink-dim); margin-top:6px; letter-spacing:.1em; text-transform:uppercase; font-weight:700}
.ag.live .ag-stat{color:var(--green)}
.ag.live::after{content:'●'; color:var(--green); position:absolute; top:6px; right:8px; font-size:8px; animation:pulse 2s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}

/* SIDEBAR */
.sidebar{
  position:sticky; top:90px; align-self:start;
  background:#ffffff;
  border:1px solid var(--line-warm); border-radius:var(--r-lg);
  padding:18px 14px; max-height:calc(100vh - 110px); overflow-y:auto;
  box-shadow:var(--shadow-card);
}
.sidebar::-webkit-scrollbar{width:4px}
.sidebar::-webkit-scrollbar-thumb{background:var(--line-warm); border-radius:2px}
.pgroup{margin-bottom:18px}
.phead{
  font-size:9px; letter-spacing:.22em; text-transform:uppercase; font-weight:800;
  padding:6px 10px; border-radius:6px; margin-bottom:6px; display:inline-block;
}
.pgroup.p1 .phead{color:var(--p1); background:rgba(124,58,237,.08)}
.pgroup.p2 .phead{color:var(--p3); background:rgba(37,99,235,.08)}
.pgroup.p3 .phead{color:var(--gold); background:rgba(184,137,58,.1)}
.pgroup.p4 .phead{color:var(--green); background:rgba(22,163,74,.08)}
.wlink{
  display:flex; align-items:center; gap:10px; width:100%; text-align:left;
  padding:9px 10px; border-radius:8px; color:var(--ink-mute); font-size:13px;
  border:1px solid transparent; transition:.2s; margin-bottom:1px; position:relative;
}
.wlink:hover{background:var(--surface-2); color:var(--ink)}
.wlink.active{
  background:linear-gradient(135deg, rgba(255,176,69,.18), rgba(255,176,69,.06));
  color:var(--ink);
  border-color:var(--amber);
  box-shadow:0 2px 10px -2px rgba(255,176,69,.35), inset 3px 0 0 var(--amber);
  padding-left:14px;
}
.wlink.complete{color:var(--ink-soft)}
.wlink.complete .wnum{background:rgba(22,163,74,.1); color:var(--green); border-color:rgba(22,163,74,.3)}
.wlink.active .wnum{background:var(--amber); color:#ffffff; border-color:var(--amber); box-shadow:0 0 0 3px rgba(255,176,69,.2)}
.wlink.active .wweek{color:var(--amber); font-weight:800}
.wlink.active .wtitle{font-weight:700}
.wnum{
  width:24px; height:24px; border-radius:50%; background:var(--surface);
  border:1px solid var(--line); display:flex; align-items:center; justify-content:center;
  font-size:11px; font-weight:800; color:var(--ink-mute); flex-shrink:0;
}
.wlabel{flex:1; display:flex; flex-direction:column; gap:1px; min-width:0}
.wweek{font-size:10px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-mute); line-height:1}
.wtitle{font-weight:500; line-height:1.2; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.where{
  display:none; font-size:9px; font-weight:800; letter-spacing:.05em; text-transform:uppercase;
  color:#fff; background:var(--amber); padding:3px 6px; border-radius:4px; flex-shrink:0;
  box-shadow:0 1px 4px rgba(255,176,69,.4);
}
.wlink.active .where{display:inline-block}

/* MAIN */
.main{min-width:0}

/* WEEK HERO */
.hero{
  background:#ffffff;
  border:1px solid var(--line-warm); border-radius:var(--r-xl);
  padding:44px 44px 36px; margin-bottom:28px; position:relative; overflow:hidden;
  box-shadow:var(--shadow-card);
}
.hero::before{content:''; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg, var(--amber), var(--amber-2), var(--teal)); pointer-events:none}
.hero-tag{
  display:inline-flex; align-items:center; gap:8px;
  padding:6px 14px; border-radius:var(--r-pill);
  font-family:var(--body);
  font-size:10px; letter-spacing:.22em; text-transform:uppercase; font-weight:600;
  margin-bottom:22px; position:relative; z-index:1;
}
.hero-tag.t1{background:rgba(124,58,237,.08); color:var(--amber);  border:1px solid rgba(124,58,237,.2)}
.hero-tag.t2{background:rgba(37,99,235,.08); color:var(--teal);   border:1px solid rgba(37,99,235,.2)}
.hero-tag.t3{background:rgba(124,58,237,.08); color:var(--amber-2);border:1px solid rgba(124,58,237,.2)}
.hero-tag.t4{background:rgba(22,163,74,.08); color:var(--sage);   border:1px solid rgba(22,163,74,.2)}
.hero h1{font-family:var(--display); font-style:normal; font-weight:700; max-width:760px; margin-bottom:18px; font-size:clamp(2.2rem,4.4vw,3.4rem); line-height:1.04; letter-spacing:-.025em; position:relative; z-index:1}
.hero .promise{color:var(--ink-soft); font-size:1.08rem; max-width:640px; line-height:1.6; margin-bottom:24px; position:relative; z-index:1}
.hero-meta{display:flex; flex-wrap:wrap; gap:20px; font-size:12.5px; color:var(--ink-mute); position:relative; z-index:1; margin-bottom:22px}
.hero-meta b{color:var(--ink); font-weight:600}

.wow{
  background:rgba(124,58,237,.04);
  border:1px solid rgba(124,58,237,.15); border-left:3px solid var(--amber);
  border-radius:var(--r-md); padding:18px 22px; position:relative; z-index:1;
}
.wow-label{
  font-size:10px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--amber); font-weight:600; margin-bottom:8px;
  display:flex; align-items:center; gap:6px;
}
.wow-label::before{content:''; width:6px; height:6px; border-radius:50%; background:var(--amber); display:inline-block; box-shadow:0 0 8px var(--amber)}
.wow-text{color:var(--ink); font-size:.98rem; line-height:1.6}

/* JOURNEY MAP */
.map{
  display:flex; gap:6px; margin:20px 0 4px; position:relative; z-index:1;
}
.map-step{
  flex:1; height:6px; border-radius:var(--r-pill); background:var(--surface); cursor:pointer;
  position:relative; transition:.3s;
}
.map-step:hover{background:var(--surface-2)}
.map-step.done{background:linear-gradient(90deg, var(--p1), var(--p2))}
.map-step.current{background:var(--p1); animation:cur 1.6s ease-in-out infinite}
@keyframes cur{0%,100%{box-shadow:0 0 6px rgba(124,58,237,.4)}50%{box-shadow:0 0 12px rgba(124,58,237,.7)}}

/* CHECKPOINTS */
.cks{display:flex; flex-direction:column; gap:14px}
.ck{
  background:#ffffff;
  border:1px solid var(--line-warm); border-radius:var(--r-lg);
  overflow:hidden; transition:border-color .4s var(--ease), box-shadow .4s var(--ease);
  box-shadow:var(--shadow-card);
}
.ck.complete{border-color:rgba(22,163,74,.3)}
.ck.current{border-color:var(--p1); box-shadow:var(--shadow-lift)}
.ck-head{display:flex; align-items:center; gap:16px; padding:18px 22px; cursor:pointer; user-select:none; transition:background .2s}
.ck-head:hover{background:var(--surface-2)}
.ck-num{
  width:38px; height:38px; border-radius:50%;
  background:var(--surface-2); border:1px solid var(--line-warm);
  display:flex; align-items:center; justify-content:center;
  font-weight:800; color:var(--ink-mute); flex-shrink:0;
  transition:.3s var(--ease);
}
.ck.complete .ck-num{background:rgba(22,163,74,.1); color:var(--green); border-color:rgba(22,163,74,.3)}
.ck.complete .ck-num::after{content:'✓'; font-size:16px}
.ck.complete .ck-num .nn{display:none}
.ck.current .ck-num{background:linear-gradient(135deg,var(--amber),var(--amber-deep)); color:#ffffff; border-color:var(--amber); font-weight:900}
.ck-info{flex:1; min-width:0}
.ck-title{font-weight:700; color:var(--ink); font-size:1.02rem; margin-bottom:2px}
.ck-sub{color:var(--ink-mute); font-size:12px}
.ck-tag{font-size:10px; padding:4px 10px; background:rgba(124,58,237,.07); border:1px solid rgba(124,58,237,.15); border-radius:var(--r-pill); color:var(--amber); white-space:nowrap; font-weight:600; letter-spacing:.05em}
.ck-arrow{color:var(--ink-mute); font-size:16px; transition:transform .3s}
.ck.open .ck-arrow{transform:rotate(180deg); color:var(--p2)}

.ck-body{max-height:0; overflow:hidden; transition:max-height .6s var(--ease)}
.ck.open .ck-body{max-height:9000px}
.ck-content{padding:8px 26px 26px; border-top:1px solid var(--line-warm); color:var(--ink-soft); line-height:1.7}
.ck-content > * + *{margin-top:14px}
.ck-content strong{color:var(--ink); font-weight:600}
.ck-content h4{color:var(--ink); margin-top:22px; font-size:1rem; font-weight:700; letter-spacing:-.01em}
.ck-content ul, .ck-content ol{padding-left:22px}
.ck-content li{margin-bottom:6px}
.ck-content p{color:var(--ink-soft)}

/* MICRO CARDS */
.kcards{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:10px; margin:12px 0}
.kcard{
  background:#ffffff; border:1px solid var(--line-warm);
  border-radius:var(--r-md); padding:14px 16px; box-shadow:var(--shadow-card);
}
.kcard h5{font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--p1); font-weight:800; margin-bottom:6px}
.kcard p{color:var(--ink-soft); font-size:.92rem; line-height:1.55; margin:0}
.kcard.green h5{color:var(--green)}
.kcard.gold h5{color:var(--gold)}
.kcard.blue h5{color:var(--p3)}

/* CALLOUTS */
.cal{
  padding:14px 18px; border-radius:var(--r-md);
  background:rgba(124,58,237,.04); border:1px solid rgba(124,58,237,.12);
  border-left:3px solid var(--amber);
}
.cal.tip{border-left-color:var(--teal); background:rgba(37,99,235,.04); border-color:rgba(37,99,235,.12)}
.cal.warn{border-left-color:var(--ember); background:rgba(234,88,12,.04); border-color:rgba(234,88,12,.12)}
.cal.green{border-left-color:var(--sage); background:rgba(22,163,74,.04); border-color:rgba(22,163,74,.12)}
.cal-l{font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--amber); font-weight:800; margin-bottom:5px}
.cal.tip .cal-l{color:var(--teal)} .cal.warn .cal-l{color:var(--ember)} .cal.green .cal-l{color:var(--sage)}

/* COMPARE */
.compare{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:12px 0}
@media(max-width:600px){.compare{grid-template-columns:1fr}}
.cmp{padding:14px 16px; border-radius:var(--r-md); border:1px solid var(--line); font-size:.9rem; line-height:1.5}
.cmp.bad{background:rgba(255,122,150,.05); border-color:rgba(255,122,150,.25); border-left:3px solid var(--red)}
.cmp.good{background:rgba(96,165,250,.05); border-color:rgba(96,165,250,.25); border-left:3px solid var(--green)}
.cmp-h{font-size:10px; letter-spacing:.18em; text-transform:uppercase; font-weight:800; margin-bottom:6px}
.cmp.bad .cmp-h{color:var(--red)} .cmp.good .cmp-h{color:var(--green)}
.cmp p{font-style:italic; color:var(--ink)}

/* MISSION */
.mission{
  background:rgba(124,58,237,.04);
  border:1px solid rgba(124,58,237,.2); border-radius:var(--r-md);
  padding:20px 22px; box-shadow:var(--shadow-card);
}
.mission h5{color:var(--p1); font-size:10px; letter-spacing:.22em; text-transform:uppercase; margin-bottom:8px; font-weight:800}
.mission p{color:var(--ink); font-size:1.02rem; line-height:1.6}

/* SKOOL TEMPLATE */
.skool{
  background:rgba(22,163,74,.04); border:1px dashed rgba(22,163,74,.3);
  border-radius:var(--r-md); padding:14px 18px; color:var(--ink-soft);
  font-size:.9rem; line-height:1.7;
}
.skool b{color:var(--green); font-style:normal; font-weight:700}

/* PROMPT LOCKED */
.locked-prompts{
  margin-top:18px; padding:24px; border-radius:var(--r-md);
  background:var(--surface-2); border:1px dashed var(--line-warm);
  text-align:center; color:var(--ink-mute);
}
.lp-icon{font-size:2rem; opacity:.4; margin-bottom:6px}
.lp-title{font-weight:700; color:var(--ink-soft); font-size:.95rem}
.lp-hint{font-size:.85rem; margin-top:4px; color:var(--ink-mute)}

/* UNLOCKED PROMPTS */
.unlock-zone{margin-top:20px; animation:reveal .8s var(--ease)}
@keyframes reveal{
  0%{opacity:0; transform:translateY(20px)}
  100%{opacity:1; transform:translateY(0)}
}
.unlock-banner{
  background:rgba(124,58,237,.06);
  border:1px solid rgba(124,58,237,.2); border-radius:var(--r-md); padding:16px 20px;
  display:flex; align-items:center; gap:14px; margin-bottom:14px;
  position:relative; overflow:hidden;
}
.unlock-banner::after{
  content:''; position:absolute; inset:0;
  background:radial-gradient(circle at 30% 50%, rgba(124,58,237,.08), transparent 55%);
  animation:shine 4s ease-in-out infinite;
  pointer-events:none;
}
@keyframes shine{0%,100%{transform:translateX(-30%)}50%{transform:translateX(30%)}}
.unlock-ico{
  width:42px; height:42px; border-radius:50%;
  background:linear-gradient(135deg, var(--p1), var(--p3));
  display:flex; align-items:center; justify-content:center; font-size:18px;
  flex-shrink:0; box-shadow:0 2px 8px rgba(124,58,237,.25);
}
.unlock-text{flex:1}
.unlock-title{font-weight:800; color:var(--ink); font-size:.98rem; margin-bottom:2px}
.unlock-sub{color:var(--ink-soft); font-size:.85rem}

.prompt-card{
  background:#ffffff; border:1px solid var(--line-warm);
  border-radius:var(--r-md); margin-bottom:14px; overflow:hidden;
  transition:.3s;
}
.prompt-card:hover{border-color:rgba(124,58,237,.3); box-shadow:var(--shadow-card)}
.pc-head{
  display:flex; align-items:flex-start; gap:12px;
  padding:14px 18px; background:var(--surface-2);
  border-bottom:1px solid var(--line-warm);
}
.pc-num{
  width:24px; height:24px; border-radius:50%;
  background:rgba(124,58,237,.1); color:var(--p1);
  display:flex; align-items:center; justify-content:center;
  font-size:11px; font-weight:800; flex-shrink:0; margin-top:2px;
}
.pc-info{flex:1; min-width:0}
.pc-name{font-weight:700; color:var(--ink); font-size:.95rem; line-height:1.3}
.pc-when{font-size:11px; color:var(--ink-mute); margin-top:3px}
.pc-copy{
  padding:6px 12px; font-size:11px; font-weight:700;
  background:rgba(124,58,237,.08); color:var(--p1);
  border:1px solid rgba(124,58,237,.2); border-radius:6px;
  transition:.2s; white-space:nowrap;
}
.pc-copy:hover{background:var(--amber); color:#ffffff}
.pc-copy.copied{background:var(--green); color:#ffffff; border-color:var(--green)}
.pc-usage{
  padding:10px 18px; background:var(--surface-2);
  font-size:.85rem; color:var(--ink-soft); border-bottom:1px solid var(--line-warm);
}
.pc-usage b{color:var(--p2); font-weight:700; font-size:10px; letter-spacing:.15em; text-transform:uppercase; display:block; margin-bottom:3px}
.pc-body{
  padding:16px 18px; font-family:'JetBrains Mono', monospace;
  font-size:.78rem; line-height:1.75; color:var(--ink-soft);
  white-space:pre-wrap; word-break:break-word; background:var(--bg-1);
}

/* ACTIONS */
.acts{display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-top:22px}
.btn{
  padding:11px 22px; border-radius:var(--r-pill);
  font-size:13px; font-weight:700; transition:.2s var(--ease);
  display:inline-flex; align-items:center; gap:8px;
}
.btn-p{background:linear-gradient(135deg,var(--amber),var(--amber-deep)); color:#ffffff; box-shadow:0 4px 14px rgba(124,58,237,.25); font-weight:700}
.btn-p:hover{background:linear-gradient(135deg,var(--amber-2),var(--amber)); transform:translateY(-1px); box-shadow:0 8px 24px rgba(124,58,237,.35)}
.btn-p.done{background:var(--sage); color:#ffffff; box-shadow:none}
.btn-p.done::before{content:'✓ '}
.btn-g{background:transparent; color:var(--ink-mute); border:1px solid var(--line-warm)}
.btn-g:hover{color:var(--ink); border-color:var(--p1); background:rgba(124,58,237,.04)}

/* NOTE CAPTURE */
.notes-wrap{margin-top:18px; background:var(--surface-2); border:1px solid var(--line-warm); border-radius:var(--r-md); padding:16px 18px}
.notes-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:10px}
.notes-title{font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--p1); font-weight:800; display:flex; align-items:center; gap:6px}
.notes-saved{font-size:11px; color:var(--green); opacity:0; transition:opacity .3s}
.notes-saved.show{opacity:1}
.notes-area{
  width:100%; background:#ffffff; border:1px solid var(--line-warm);
  border-radius:8px; padding:14px; color:var(--ink); font:inherit; font-size:.92rem;
  min-height:140px; resize:vertical;
}
.notes-area:focus{outline:none; border-color:var(--p1); box-shadow:0 0 0 3px rgba(124,58,237,.1)}
.notes-area::placeholder{color:var(--ink-dim)}

/* TIMELINE COMPACT */
.tline{margin-top:10px}
.tline summary{cursor:pointer; padding:8px 0; font-size:12px; color:var(--p2); font-weight:600; letter-spacing:.05em; list-style:none}
.tline summary::-webkit-details-marker{display:none}
.tline summary::before{content:'›'; margin-right:6px; transition:transform .2s; display:inline-block}
.tline[open] summary::before{transform:rotate(90deg)}
.tline-list{margin-top:8px; border-top:1px solid var(--line-soft); padding-top:10px}
.tline-row{display:grid; grid-template-columns:70px 1fr; gap:14px; padding:8px 0; font-size:.86rem; border-bottom:1px solid var(--line-soft)}
.tline-row:last-child{border:none}
.tline-time{font-weight:700; color:var(--p2); font-size:11px; letter-spacing:.05em; padding-top:2px}
.tline-text{color:var(--ink-soft); line-height:1.55}

/* INTERACTIVE WIDGETS */
.widget{
  margin:16px 0; background:#ffffff;
  border:1px solid var(--line-warm); border-radius:var(--r-md); padding:20px; box-shadow:var(--shadow-card);
  position:relative;
}
.widget-tag{
  position:absolute; top:-9px; left:18px;
  background:linear-gradient(135deg,var(--amber),var(--amber-deep)); color:#ffffff; padding:3px 10px;
  border-radius:var(--r-pill); font-size:9px; letter-spacing:.2em; text-transform:uppercase; font-weight:800;
}
.widget-title{font-weight:700; color:var(--ink); margin-bottom:6px; font-size:1rem}
.widget-sub{font-size:.85rem; color:var(--ink-mute); margin-bottom:14px}
.input-row{margin-bottom:12px}
.input-row label{display:block; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--p2); font-weight:700; margin-bottom:5px}
.input-row label .hint{color:var(--ink-mute); text-transform:none; letter-spacing:0; font-weight:400; font-size:11px; margin-left:6px}
.input-row input, .input-row textarea{
  width:100%; background:var(--surface-2); border:1px solid var(--line-warm);
  border-radius:8px; padding:10px 14px; color:var(--ink); font:inherit; font-size:.9rem;
}
.input-row textarea{min-height:60px; resize:vertical}
.input-row input:focus, .input-row textarea:focus{outline:none; border-color:var(--p1); box-shadow:0 0 0 3px rgba(124,58,237,.1)}
.assembled{
  background:var(--bg-1); border:1px solid var(--p1); border-radius:var(--r-md);
  padding:16px; font-family:'JetBrains Mono', monospace; font-size:.8rem;
  line-height:1.7; color:var(--ink-soft); white-space:pre-wrap; min-height:80px;
  position:relative;
}
.assembled-l{font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--p2); font-weight:800; margin-bottom:8px; font-family:'Inter', sans-serif}
.assembled-empty{color:var(--ink-dim); font-style:italic}

/* CHECKLIST WIDGET */
.cklist{display:flex; flex-direction:column; gap:8px; margin-top:10px}
.cki{
  display:flex; align-items:center; gap:12px; padding:10px 14px;
  background:var(--surface-2); border:1px solid var(--line-warm); border-radius:8px;
  transition:.2s; cursor:pointer;
}
.cki:hover{border-color:rgba(124,58,237,.3)}
.cki input{accent-color:var(--p1); cursor:pointer; width:16px; height:16px}
.cki span{flex:1; font-size:.9rem; color:var(--ink-soft)}
.cki input:checked + span{color:var(--ink); text-decoration:line-through; text-decoration-color:var(--ink-mute)}

/* WEEK COMPLETE */
.wkdone{
  margin-top:20px; padding:32px;
  background:rgba(22,163,74,.04);
  border:1px solid var(--green); border-radius:var(--r-lg); text-align:center;
  position:relative; overflow:hidden;
}
.wkdone::before{
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse at top, rgba(22,163,74,.08), transparent 70%);
  pointer-events:none;
}
.wkdone h3{font-family:var(--display); font-style:normal; font-weight:700; color:var(--green); font-size:1.8rem; font-weight:400; margin-bottom:8px; position:relative; z-index:1}
.wkdone p{color:var(--ink-soft); max-width:500px; margin:0 auto 18px; position:relative; z-index:1}

/* COST MAP */
.cost-map{margin:0 0 20px;padding:18px 20px;background:rgba(124,58,237,.05);border:1px solid rgba(124,58,237,.18);border-radius:var(--r-md)}
.cost-map-h{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--p1);font-weight:800;margin-bottom:10px}
.cost-map-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.cost-tier{background:var(--surface);border:1px solid var(--line-warm);border-radius:var(--r-sm);padding:12px 14px}
.cost-tier-label{font-size:.75rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:4px}
.cost-tier-price{font-size:1.25rem;font-weight:700;color:var(--ink);margin-bottom:2px}
.cost-tier-when{font-size:.78rem;color:var(--ink-mute)}
.cost-tier.free .cost-tier-price{color:var(--sage)}
.cost-tier.plus .cost-tier-price{color:var(--teal)}
.cost-tier.pro .cost-tier-price{color:var(--p1)}
@media(max-width:600px){.cost-map-grid{grid-template-columns:1fr}}

/* TROUBLE SECTION */
.trouble-section{margin-top:18px;border:1px solid rgba(234,88,12,.2);border-radius:var(--r-md);overflow:hidden}
.trouble-toggle{display:flex;align-items:center;gap:10px;padding:12px 16px;cursor:pointer;background:rgba(234,88,12,.04);font-size:.88rem;font-weight:600;color:var(--ember);user-select:none;list-style:none}
.trouble-toggle::-webkit-details-marker{display:none}
.trouble-toggle::before{content:'🔧';font-size:1rem}
.trouble-items{padding:0 16px 14px}
.trouble-item{padding:10px 0;border-bottom:1px dashed var(--line-soft);font-size:.88rem;color:var(--ink-soft);line-height:1.6}
.trouble-item:last-child{border:none}
.trouble-item strong{color:var(--ink);display:block;margin-bottom:3px}

/* AUDIO PLAYER — sticky footer position so it stays visible no matter where the user scrolls */
.audio-player{
  display:flex; align-items:center; gap:10px;
  background:var(--surface);
  border:1px solid var(--line-warm);
  border-radius:var(--r-pill);
  padding:8px 14px;
  box-shadow:0 -4px 24px -8px rgba(0,0,0,.18), 0 -1px 6px -1px rgba(0,0,0,.08);
  transition:opacity .28s var(--ease), transform .35s cubic-bezier(.16,1,.3,1);
  width:calc(100% - 28px); max-width:680px;
  margin:0; position:fixed;
  left:50%; bottom:calc(env(safe-area-inset-bottom, 0px) + 16px);
  transform:translateX(-50%);
  z-index:50;
  backdrop-filter:blur(6px);
}
.audio-player.hidden{opacity:0; pointer-events:none; transform:translateX(-50%) translateY(120%)}
/* Pulse the player briefly when a new track loads so the user notices it */
@keyframes ap-pop{0%{box-shadow:0 -4px 24px -8px rgba(124,58,237,.45), 0 0 0 0 rgba(124,58,237,.4)} 70%{box-shadow:0 -4px 24px -8px rgba(124,58,237,.25), 0 0 0 12px rgba(124,58,237,0)} 100%{box-shadow:0 -4px 24px -8px rgba(0,0,0,.18), 0 0 0 0 rgba(124,58,237,0)}}
.audio-player.pop{animation:ap-pop 1.2s ease-out}
/* Pad page content so nothing is hidden behind the player when visible */
body.ap-active{padding-bottom:90px}
@media(max-width:600px){
  body.ap-active{padding-bottom:84px}
  .audio-player{width:calc(100% - 16px); bottom:calc(env(safe-area-inset-bottom, 0px) + 10px)}
}
.ap-btn{
  flex-shrink:0; width:44px; height:44px;
  border-radius:50%; background:var(--p1); color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-size:1rem; transition:background .15s, transform .1s;
  border:none; cursor:pointer; touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}
.ap-btn:hover{background:var(--p2); transform:scale(1.06)}
.ap-btn:active{transform:scale(.96)}
.ap-btn-ghost{
  flex-shrink:0; width:28px; height:28px;
  border-radius:50%; background:var(--bg-2); color:var(--ink-mute);
  display:flex; align-items:center; justify-content:center;
  font-size:.78rem; font-weight:700; letter-spacing:-.03em;
  border:none; cursor:pointer; transition:background .15s, color .15s;
  touch-action:manipulation; -webkit-tap-highlight-color:transparent;
}
.ap-btn-ghost:hover{background:var(--bg-3); color:var(--ink)}
.ap-center{flex:1; min-width:0; display:flex; flex-direction:column; gap:5px}
.ap-label{font-size:.75rem; font-weight:600; color:var(--ink-soft); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; letter-spacing:-.01em}
.ap-track{display:flex; align-items:center; gap:8px}
.ap-bar{
  flex:1; height:4px; background:var(--bg-3); border-radius:2px;
  cursor:pointer; position:relative; overflow:hidden;
}
.ap-fill{height:100%; background:var(--p1); border-radius:2px; transition:width .1s linear; pointer-events:none}
.ap-bar:hover .ap-fill{background:var(--p2)}
input.ap-range{
  position:absolute; inset:0; width:100%; height:100%;
  opacity:0; cursor:pointer; margin:0; padding:0;
}
.ap-time{font-size:.68rem; font-family:var(--mono); color:var(--ink-mute); white-space:nowrap; min-width:68px; text-align:right}
.ap-close{
  flex-shrink:0; width:22px; height:22px; border-radius:50%;
  background:none; color:var(--ink-dim); font-size:.7rem;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; border:none; transition:color .15s;
}
.ap-close:hover{color:var(--ink)}
@media(max-width:520px){
  .audio-player{padding:7px 10px; gap:8px}
  .ap-btn{width:40px;height:40px;font-size:.9rem}
  .ap-label{font-size:.7rem}
  .ap-time{min-width:56px;font-size:.62rem}
}

/* MODAL */
.modal-bg{
  position:fixed; inset:0; background:rgba(20,18,16,.65); backdrop-filter:blur(14px);
  z-index:100; display:none; align-items:center; justify-content:center; padding:20px;
}
.modal-bg.open{display:flex}
.modal{
  background:#ffffff;
  border:1px solid var(--line-warm); border-radius:var(--r-lg);
  padding:36px; max-width:460px; width:100%;
  box-shadow:0 40px 80px -20px rgba(0,0,0,.25);
}
.modal h2{font-family:var(--display); font-style:normal; font-weight:700; margin-bottom:10px; font-size:1.8rem; letter-spacing:-.025em}
.modal p{color:var(--ink-mute); margin-bottom:18px; font-size:.95rem}
.modal input{
  width:100%; padding:14px 18px; background:var(--surface-2); border:1px solid var(--line-warm);
  border-radius:10px; color:var(--ink); font:inherit; font-size:1rem; margin-bottom:18px;
}
.modal input:focus{outline:none; border-color:var(--p1); box-shadow:0 0 0 3px rgba(124,58,237,.1)}

/* TOAST */
.toast{
  position:fixed; bottom:30px; right:30px; z-index:90;
  background:#ffffff;
  border:1px solid var(--p1); border-radius:var(--r-md); padding:14px 20px;
  box-shadow:var(--shadow-lift); max-width:340px;
  transform:translateX(420px); transition:transform .5s var(--ease);
  display:flex; align-items:center; gap:12px;
}
.toast.show{transform:translateX(0)}
.toast-ico{font-size:1.4rem}
.toast-text{flex:1}
.toast-title{font-weight:700; color:var(--ink); font-size:.92rem; margin-bottom:2px}
.toast-sub{color:var(--ink-soft); font-size:.82rem}

/* CERTIFICATE */
.cert{
  margin-top:24px; padding:48px 32px; text-align:center;
  background:#ffffff;
  border:2px solid var(--p1); border-radius:var(--r-lg);
  position:relative; overflow:hidden; box-shadow:var(--shadow-lift);
}
.cert::before{
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse at top, rgba(124,58,237,.06), transparent 70%);
}
.cert > *{position:relative; z-index:1}
.cert-seal{
  width:80px; height:80px; border-radius:50%;
  background:linear-gradient(135deg, var(--p1), var(--p3));
  display:inline-flex; align-items:center; justify-content:center;
  font-size:2rem; margin-bottom:18px;
  box-shadow:0 4px 16px rgba(124,58,237,.3);
}
.cert h2{font-family:var(--display); font-style:normal; font-weight:700; font-size:1.5rem; margin-bottom:6px}
.cert-name{font-family:var(--display); font-style:normal; font-size:3rem; color:var(--p1); margin:8px 0 14px; font-weight:800; letter-spacing:-.03em}
.cert-line{color:var(--ink-soft); max-width:440px; margin:0 auto; font-size:.95rem}

/* DEPTH "WHY" CARDS (3 mini cards per week) */
.depth-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:4px 0 18px}
@media(max-width:760px){.depth-grid{grid-template-columns:1fr}}
.depth-card{
  background:#ffffff;
  border:1px solid var(--line-warm); border-radius:var(--r-md); padding:18px 18px 16px; box-shadow:var(--shadow-card);
  position:relative; overflow:hidden;
}
.depth-card::before{
  content:''; position:absolute; top:0; left:0; right:0; height:2px;
}
.depth-card.problem::before{background:linear-gradient(90deg, var(--red), transparent)}
.depth-card.cost::before{background:linear-gradient(90deg, var(--gold), transparent)}
.depth-card.future::before{background:linear-gradient(90deg, var(--green), transparent)}
.depth-icon{font-size:1.4rem; margin-bottom:10px; display:inline-block}
.depth-h{font-size:10px; letter-spacing:.22em; text-transform:uppercase; font-weight:800; margin-bottom:6px}
.depth-card.problem .depth-h{color:var(--red)}
.depth-card.cost .depth-h{color:var(--gold)}
.depth-card.future .depth-h{color:var(--green)}
.depth-card p{font-size:.9rem; line-height:1.55; color:var(--ink-soft); margin:0}
.depth-card .num{font-family:var(--display); font-style:normal; font-size:1.6rem; color:var(--ink); font-weight:800; margin-top:8px; display:block; letter-spacing:-.02em}

/* WHERE TO PASTE CALLOUT */
.where-paste{
  background:linear-gradient(135deg, rgba(59,130,246,.10), rgba(59,130,246,.04));
  border:1px solid rgba(59,130,246,.3); border-radius:10px;
  padding:12px 16px; margin:10px 18px 14px;
  display:flex; gap:12px; align-items:flex-start;
}
.where-ico{
  width:32px; height:32px; border-radius:8px;
  background:linear-gradient(135deg, var(--teal), var(--teal-deep));
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
  font-size:1rem;
}
.where-text{flex:1; font-size:.84rem; color:var(--ink-soft); line-height:1.55}
.where-text b{color:var(--p3); font-weight:700; font-size:9px; letter-spacing:.22em; text-transform:uppercase; display:block; margin-bottom:3px}
.where-path{
  display:inline-block; background:rgba(59,130,246,.12); color:var(--p3);
  padding:2px 8px; border-radius:5px; font-family:'JetBrains Mono',monospace;
  font-size:.75rem; font-weight:600; margin:2px 0;
}

/* SAVEABLE TASK LIST */
.tasklist{
  background:#ffffff;
  border:1px solid var(--line-warm); border-radius:var(--r-md); padding:20px;
  margin:16px 0; position:relative;
  box-shadow:var(--shadow-card);
}
.tl-tag{
  position:absolute; top:-9px; left:18px;
  background:linear-gradient(135deg,var(--amber),var(--amber-deep)); color:#ffffff; padding:3px 10px; border-radius:var(--r-pill);
  font-size:9px; letter-spacing:.2em; text-transform:uppercase; font-weight:800;
}
.tl-title{font-weight:700; color:var(--ink); font-size:1.02rem; margin-bottom:4px}
.tl-sub{font-size:.85rem; color:var(--ink-mute); margin-bottom:14px}
.tl-rows{display:flex; flex-direction:column; gap:6px}
.tl-row{
  display:flex; align-items:center; gap:10px; padding:8px 12px;
  background:var(--surface-2); border:1px solid var(--line-warm); border-radius:8px;
  transition:.2s;
}
.tl-row:hover{border-color:rgba(124,58,237,.3)}
.tl-num{width:22px; height:22px; border-radius:50%; background:var(--surface); color:var(--p2); display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:800; flex-shrink:0}
.tl-input{flex:1; background:transparent; border:none; color:var(--ink); font:inherit; font-size:.92rem; outline:none}
.tl-input::placeholder{color:var(--ink-dim)}
.tl-rate{width:60px; background:transparent; border:1px solid var(--line); color:var(--gold); padding:4px 6px; border-radius:6px; font-size:11px; text-align:center; font-weight:700}
.tl-rate:focus{outline:none; border-color:var(--gold)}
.tl-del{color:var(--ink-dim); padding:4px 8px; cursor:pointer; font-size:14px; transition:.2s; border-radius:4px}
.tl-del:hover{color:var(--red); background:rgba(255,122,150,.1)}
.tl-add{
  display:inline-flex; align-items:center; gap:6px; margin-top:10px;
  background:rgba(124,58,237,.06); color:var(--p1); border:1px dashed rgba(124,58,237,.3);
  padding:8px 16px; border-radius:var(--r-pill); font-size:12px; font-weight:600; cursor:pointer;
  transition:.2s;
}
.tl-add:hover{background:var(--amber); color:#ffffff; border-color:var(--amber); border-style:solid}
.tl-saved{display:inline-block; margin-left:10px; font-size:11px; color:var(--green); opacity:0; transition:opacity .3s}
.tl-saved.show{opacity:1}
.tl-foot{display:flex; justify-content:space-between; align-items:center; margin-top:12px; font-size:11px; color:var(--ink-mute)}

/* BRAIN ARCHITECTURE DIAGRAM */
.brain-arch{margin:18px 0; padding:24px; background:#ffffff; border:1px solid var(--line-warm); border-radius:var(--r-lg); position:relative; box-shadow:var(--shadow-card)}
.brain-arch::before{
  content:''; position:absolute; top:0; left:0; right:0; height:1px;
  background:linear-gradient(90deg, transparent, var(--p1), transparent);
}
.arch-layer{
  position:relative; padding:14px 18px 14px 60px;
  background:var(--surface-2); border:1px solid var(--line-warm); border-left:3px solid var(--p1);
  border-radius:var(--r-md); margin-bottom:10px;
  transition:.3s;
}
.arch-layer:hover{border-left-width:5px; padding-left:62px; background:var(--bg-2)}
.arch-num{
  position:absolute; left:14px; top:14px;
  width:32px; height:32px; border-radius:50%;
  background:linear-gradient(135deg, var(--amber), var(--amber-deep)); color:#ffffff;
  display:flex; align-items:center; justify-content:center; font-weight:800; font-size:.95rem;
  box-shadow:0 4px 12px rgba(124,58,237,.25);
}
.arch-name{font-weight:700; color:var(--ink); font-size:.98rem; margin-bottom:3px}
.arch-tool{display:inline-block; font-size:10px; padding:2px 7px; background:rgba(59,130,246,.14); color:var(--p3); border-radius:4px; margin-left:8px; font-weight:600; letter-spacing:.05em}
.arch-desc{font-size:.86rem; color:var(--ink-soft); line-height:1.55; margin-top:4px}
.arch-arrow{text-align:center; font-size:1.2rem; color:var(--ink-dim); margin:-4px 0}

/* SETUP STEP WALKTHROUGH */
.setup{margin:16px 0; background:#ffffff; border:1px solid var(--line-warm); border-radius:var(--r-md); overflow:hidden; box-shadow:var(--shadow-card)}
.setup-head{padding:14px 18px; background:var(--surface-2); border-bottom:1px solid var(--line-warm); display:flex; align-items:center; gap:10px}
.setup-tag{font-size:9px; letter-spacing:.22em; text-transform:uppercase; color:var(--p3); font-weight:800; background:rgba(59,130,246,.14); padding:3px 8px; border-radius:4px}
.setup-title{font-weight:700; color:var(--ink); font-size:.95rem}
.setup-body{padding:16px 18px}
.setup-step{display:grid; grid-template-columns:32px 1fr; gap:14px; padding:10px 0; border-bottom:1px dashed var(--line-warm)}
.setup-step:last-child{border:none}
.setup-step-num{
  width:28px; height:28px; border-radius:50%;
  background:rgba(59,130,246,.18); color:var(--p3);
  display:flex; align-items:center; justify-content:center; font-weight:800; font-size:.85rem;
}
.setup-step-text{font-size:.92rem; color:var(--ink-soft); line-height:1.55}
.setup-step-text b{color:var(--ink); font-weight:600}
.setup-kbd{display:inline-block; background:var(--surface-2); border:1px solid var(--line-warm); border-bottom-width:2px; padding:1px 7px; border-radius:4px; font-family:'JetBrains Mono',monospace; font-size:.78rem; color:var(--p1); margin:0 2px; font-weight:600}

/* FRIDAY SYNTHESIS WIZARD */
.synth{
  margin:18px 0; background:#ffffff;
  border:1px solid var(--p1); border-radius:var(--r-lg); overflow:hidden;
  box-shadow:var(--shadow-lift);
}
.synth-head{
  padding:18px 22px; background:rgba(124,58,237,.05);
  border-bottom:1px solid var(--line-warm);
}
.synth-tag{display:inline-block; font-size:9px; letter-spacing:.25em; text-transform:uppercase; font-weight:800; background:linear-gradient(135deg,var(--amber),var(--amber-deep)); color:#ffffff; padding:3px 10px; border-radius:var(--r-pill); margin-bottom:8px}
.synth-title{font-family:var(--display); font-style:normal; font-weight:700; font-size:1.6rem; color:var(--ink); margin-bottom:4px; letter-spacing:-.025em}
.synth-sub{font-size:.88rem; color:var(--ink-soft)}
.synth-progress{display:flex; gap:6px; padding:14px 22px; background:var(--surface-2); border-bottom:1px solid var(--line-warm)}
.synth-pdot{flex:1; height:4px; background:var(--bg-3); border-radius:var(--r-pill); transition:.4s}
.synth-pdot.active{background:var(--p1); box-shadow:0 0 8px var(--p1)}
.synth-pdot.done{background:var(--green)}
.synth-body{padding:22px}
.synth-step-num{display:inline-flex; align-items:center; gap:8px; font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--p2); font-weight:800; margin-bottom:10px}
.synth-step-num .ringnum{width:28px; height:28px; border-radius:50%; background:linear-gradient(135deg, var(--amber), var(--amber-deep)); color:#ffffff; display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:800}
.synth-step-title{font-weight:700; color:var(--ink); font-size:1.1rem; margin-bottom:6px}
.synth-step-desc{font-size:.9rem; color:var(--ink-soft); margin-bottom:14px; line-height:1.6}
.synth-area{
  width:100%; background:var(--surface-2); border:1px solid var(--line-warm); border-radius:10px;
  padding:14px 16px; color:var(--ink); font:inherit; font-size:.92rem; line-height:1.55;
  min-height:120px; resize:vertical;
}
.synth-area:focus{outline:none; border-color:var(--p1); box-shadow:0 0 0 3px rgba(124,58,237,.1)}
.synth-area::placeholder{color:var(--ink-dim); font-style:italic}
.synth-actions{display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:18px}
.synth-actions .left{font-size:11px; color:var(--ink-mute)}
.synth-nav{display:flex; gap:8px}
.synth-btn{padding:9px 18px; border-radius:var(--r-pill); font-size:13px; font-weight:700; transition:.2s}
.synth-btn-p{background:linear-gradient(135deg,var(--amber),var(--amber-deep)); color:#ffffff; box-shadow:var(--shadow-card); font-weight:700}
.synth-btn-p:hover{background:linear-gradient(135deg,var(--amber-2),var(--amber))}
.synth-btn-g{background:transparent; color:var(--ink-mute); border:1px solid var(--line-warm)}
.synth-btn-g:hover{color:var(--ink); border-color:var(--p1)}
.synth-save-final{
  width:100%; padding:16px; background:linear-gradient(135deg, var(--amber), var(--amber-deep));
  color:#ffffff; font-weight:800; font-size:.95rem; letter-spacing:.05em; text-transform:uppercase;
  border-radius:var(--r-pill); box-shadow:var(--shadow-card); transition:.2s;
}
.synth-save-final:hover{transform:translateY(-1px); box-shadow:var(--shadow-lift)}
.synth-checklist{display:flex; flex-direction:column; gap:8px}
.synth-ckitem{display:flex; align-items:flex-start; gap:10px; padding:10px 14px; background:var(--surface-2); border:1px solid var(--line-warm); border-radius:8px; cursor:pointer; transition:.2s}
.synth-ckitem:hover{border-color:rgba(124,58,237,.3); background:#ffffff}
.synth-ckitem input{margin-top:3px; accent-color:var(--p1); width:16px; height:16px}
.synth-ckitem label{flex:1; font-size:.9rem; color:var(--ink-soft); cursor:pointer; line-height:1.5}
.synth-ckitem strong{color:var(--ink)}

.synth-history{margin-top:24px; background:var(--surface-2); border:1px solid var(--line-warm); border-radius:var(--r-md); padding:18px 20px}
.synth-history-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:14px}
.synth-history-h{font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--p1); font-weight:800}
.synth-count{font-family:var(--display); font-style:normal; font-size:1.8rem; color:var(--ink); font-weight:700}
.synth-card{background:#ffffff; border:1px solid var(--line-warm); border-left:3px solid var(--p1); border-radius:8px; padding:12px 16px; margin-bottom:10px}
.synth-card-date{font-size:10px; letter-spacing:.15em; text-transform:uppercase; color:var(--ink-mute); font-weight:700; margin-bottom:5px}
.synth-card-text{color:var(--ink-soft); font-size:.88rem; line-height:1.6; white-space:pre-wrap}
.synth-empty{text-align:center; padding:24px; color:var(--ink-mute); font-size:.88rem; font-style:italic}
.synth-streak-banner{
  background:rgba(22,163,74,.06);
  border:1px solid rgba(22,163,74,.25); border-radius:var(--r-md); padding:14px 18px; margin-top:14px;
  display:flex; align-items:center; gap:14px;
}
.synth-streak-banner .num{font-family:var(--display); font-style:normal; font-size:2.2rem; color:var(--green); line-height:.9; min-width:60px; text-align:center; font-weight:700}
.synth-streak-banner .lbl{flex:1; font-size:.88rem; color:var(--ink-soft); line-height:1.5}
.synth-streak-banner .lbl b{color:var(--ink); font-weight:700}

/* AGENT TEST DRIVE — W7-W10 first conversation widget */
.agdrive{margin:16px 0 20px; background:#fffdf7; border:2px solid var(--line-warm); border-left:5px solid var(--ag-color); border-radius:12px; padding:22px 24px; box-shadow:0 2px 12px -4px rgba(0,0,0,.06)}
.agdrive-head{margin-bottom:18px}
.agdrive-tag{font-size:11px; font-weight:800; letter-spacing:.15em; text-transform:uppercase; color:var(--ag-color); margin-bottom:6px}
.agdrive-title{font-family:var(--display); font-size:1.4rem; font-weight:800; color:var(--ink); line-height:1.2}
.agdrive-sub{font-size:.92rem; color:var(--ink-soft); margin-top:8px; line-height:1.55}
.agdrive-steps{display:flex; gap:8px; margin-bottom:18px; flex-wrap:wrap}
.agdrive-step{flex:1; min-width:130px; display:flex; align-items:center; gap:8px; padding:10px 12px; background:#fff; border:1.5px solid var(--line-warm); border-radius:8px; font-size:12.5px; font-weight:600; color:var(--ink-mute); transition:.2s}
.agdrive-step-n{width:22px; height:22px; border-radius:50%; background:var(--surface); border:1px solid var(--line); display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:800; flex-shrink:0}
.agdrive-step.active{border-color:var(--ag-color); background:rgba(0,0,0,.02); color:var(--ink); box-shadow:0 2px 8px -2px rgba(0,0,0,.08)}
.agdrive-step.active .agdrive-step-n{background:var(--ag-color); color:#fff; border-color:var(--ag-color)}
.agdrive-step.done{opacity:.7}
.agdrive-step.done .agdrive-step-n{background:var(--green); color:#fff; border-color:var(--green)}
.agdrive-step.done .agdrive-step-n::after{content:'✓'; position:absolute}
.agdrive-card{background:#fff; border:1px solid var(--line-warm); border-radius:10px; padding:18px}
.agdrive-card-h{font-size:1rem; font-weight:800; color:var(--ink); margin-bottom:4px}
.agdrive-card-d{font-size:.85rem; color:var(--ink-soft); margin-bottom:14px; line-height:1.5}
.agdrive-prompt{background:#faf6ee; border:1px solid var(--line-warm); border-radius:8px; padding:14px 16px; font-family:var(--mono); font-size:12.5px; line-height:1.65; white-space:pre-wrap; color:var(--ink); margin:0 0 14px; max-height:380px; overflow-y:auto}
.agdrive-actions{display:flex; gap:10px; flex-wrap:wrap}
.agdrive-actions .btn.copied{background:var(--green); color:#fff; border-color:var(--green)}
@media(max-width:560px){.agdrive-steps{flex-direction:column} .agdrive-step{width:100%}}

/* FOLDER MAP — Week 4 Vault structure diagram */
.folder-map{
  background:#fffdf7; border:1.5px solid var(--line-warm); border-radius:12px;
  padding:22px 24px; margin:18px 0 22px; box-shadow:inset 0 1px 0 #fff;
}
.fm-title{font-size:11px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--gold); margin-bottom:12px}
.fm-tree{font-family:var(--mono); font-size:13.5px; line-height:1.7}
.fm-root{display:flex; align-items:center; gap:8px; font-size:15px; padding:8px 10px; background:rgba(184,137,58,.1); border-radius:6px; margin-bottom:8px}
.fm-root b{color:var(--ink); font-size:14px}
.fm-branch{padding:8px 10px 8px 22px; border-left:2px dashed var(--line-warm); margin-left:12px; margin-bottom:4px; position:relative}
.fm-branch::before{content:'└'; position:absolute; left:6px; top:8px; color:var(--ink-mute); font-family:var(--mono)}
.fm-branch.fm-last{border-left-style:solid}
.fm-branch b{color:var(--ink); font-weight:700}
.fm-ico{margin-right:6px}
.fm-note{display:block; font-family:var(--body); font-size:12px; color:var(--ink-mute); margin-top:2px; margin-left:22px; font-style:italic}
.fm-leaf{font-family:var(--body); font-size:12px; color:var(--ink-soft); margin-left:22px; margin-top:6px; padding:3px 8px; background:rgba(0,0,0,.02); border-radius:4px; display:inline-block; margin-right:6px}
.fm-legend{margin-top:14px; padding:10px 12px; background:rgba(37,99,235,.05); border-left:3px solid #2563eb; border-radius:4px; font-size:12.5px; color:var(--ink-soft); line-height:1.5}
.fm-legend b{color:#2563eb}
@media(max-width:560px){.fm-tree{font-size:12px} .fm-branch{padding-left:16px; margin-left:8px} .fm-note{font-size:11px}}

/* COCKPIT — Week 11 Command Center Generator */
.cockpit{margin-top:14px}
.cockpit-actions{display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-bottom:14px}
.cockpit-stamp{font-size:.78rem; color:var(--ink-mute); font-style:italic}
.btn-sm{font-size:.8rem; padding:6px 12px}
.btn-g.copied{background:var(--green); color:#fff; border-color:var(--green)}
.cockpit-page{
  background:#fffdf7; border:1px solid var(--line-warm); border-radius:12px;
  padding:32px 36px; box-shadow:0 6px 24px -8px rgba(0,0,0,.08);
}
.cp-head{text-align:center; border-bottom:3px solid var(--gold); padding-bottom:14px; margin-bottom:22px}
.cp-brand{font-size:10px; letter-spacing:.25em; color:var(--gold); font-weight:800}
.cp-name{font-size:30px; font-weight:800; margin:8px 0 4px; font-family:var(--display); color:var(--ink)}
.cp-date{font-size:13px; color:var(--ink-mute)}
.cp-section{margin-bottom:22px}
.cp-h{font-size:12px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--gold); border-bottom:1px solid var(--line-warm); padding-bottom:5px; margin-bottom:10px}
.cp-sub{font-size:12px; color:var(--ink-mute); margin-bottom:8px}
.cp-pri{padding-left:24px; margin:6px 0}
.cp-pri li{font-size:15px; font-weight:600; margin-bottom:10px; color:var(--ink)}
.cp-pri-input{
  border:none; border-bottom:1px dashed var(--line); font:inherit; font-weight:600;
  width:calc(100% - 8px); background:transparent; padding:4px 4px; color:var(--ink);
}
.cp-pri-input:focus{outline:none; border-bottom-color:var(--gold)}
.cp-grid{display:grid; grid-template-columns:1fr 1fr; gap:18px}
@media(max-width:680px){.cp-grid{grid-template-columns:1fr}}
.cp-agent, .cp-link{display:flex; justify-content:space-between; align-items:center; padding:8px 0; font-size:13px; border-bottom:1px dotted var(--line-warm)}
.cp-agent.pending{opacity:.55}
.cp-agent-dot{display:inline-block; width:8px; height:8px; border-radius:50%; background:var(--ink-mute); margin-right:8px}
.cp-agent.live .cp-agent-dot{background:var(--green); box-shadow:0 0 6px var(--green)}
.cp-dash, .ck-dash{color:var(--ink-mute); font-style:italic; font-size:12px}
.cp-week{width:100%; border-collapse:collapse; font-size:13px}
.cp-week td{padding:8px 10px; border-bottom:1px solid var(--line-warm); vertical-align:top}
.cp-week td:first-child{width:34%; color:var(--gold); font-weight:600}
.cp-prompt{
  background:#faf6ee; border:1px solid var(--line-warm); padding:14px;
  border-radius:6px; font-family:var(--mono); font-size:11.5px; white-space:pre-wrap;
  margin:8px 0; color:var(--ink); line-height:1.6; max-height:280px; overflow-y:auto;
}
.cp-stats{display:flex; gap:20px; justify-content:center; margin:20px 0 14px; padding:18px; background:rgba(184,137,58,.06); border-radius:10px; border:1px solid var(--line-warm)}
.cp-stat{text-align:center; flex:1}
.cp-stat .n{font-size:28px; font-weight:800; color:var(--gold); font-family:var(--display); line-height:1}
.cp-stat .l{font-size:10px; color:var(--ink-mute); text-transform:uppercase; letter-spacing:.1em; margin-top:4px}
.cp-foot{text-align:center; font-size:11px; color:var(--ink-mute); padding-top:14px; border-top:1px solid var(--line-warm); font-style:italic}

/* FIRST DAY WELCOME CARD (Today mode, brand new users) */
.firstday-card{
  background:#ffffff;
  border:1px solid var(--p1); border-radius:var(--r-xl);
  padding:40px 44px; margin-bottom:24px; position:relative; overflow:hidden;
  box-shadow:var(--shadow-lift);
  max-width:720px; margin-left:auto; margin-right:auto;
}
.firstday-card::before{
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg, var(--amber), var(--amber-2), var(--teal));
  pointer-events:none;
}
.firstday-vaulty{width:96px; height:96px; margin:0 auto 18px; position:relative; z-index:1}
.firstday-vaulty svg{width:96px; height:96px; filter:drop-shadow(0 0 16px rgba(124,58,237,.3))}
.firstday-tag{text-align:center; font-size:10px; letter-spacing:.25em; text-transform:uppercase; font-weight:800; color:var(--p1); margin-bottom:14px; position:relative; z-index:1}
.firstday-h{font-family:var(--display); font-style:normal; font-weight:700; font-size:clamp(2rem,5vw,3rem); color:var(--ink); text-align:center; letter-spacing:-.025em; margin-bottom:12px; position:relative; z-index:1; line-height:1.05}
.firstday-h b{color:var(--p1); font-weight:700}
.firstday-sub{color:var(--ink-soft); font-size:1.02rem; line-height:1.65; max-width:580px; margin:0 auto 26px; text-align:center; position:relative; z-index:1}
.firstday-cta-row{display:flex; justify-content:center; gap:12px; flex-wrap:wrap; margin-bottom:32px; position:relative; z-index:1}
.firstday-cta{font-size:.95rem; padding:14px 28px}
.firstday-orient{background:var(--surface-2); border:1px solid var(--line-warm); border-radius:var(--r-lg); padding:24px; position:relative; z-index:1; margin-bottom:18px}
.firstday-orient-h{font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--p1); font-weight:800; margin-bottom:16px}
.firstday-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:10px}
@media(max-width:700px){.firstday-grid{grid-template-columns:1fr}}
.firstday-orient-card{display:flex; gap:12px; padding:12px 14px; background:#ffffff; border:1px solid var(--line-warm); border-radius:var(--r-md); font-size:.86rem; color:var(--ink-soft); line-height:1.5}
.firstday-orient-card b{color:var(--ink); font-weight:700}
.firstday-orient-num{width:24px; height:24px; border-radius:50%; background:rgba(124,58,237,.1); color:var(--p1); display:flex; align-items:center; justify-content:center; font-size:.78rem; font-weight:800; flex-shrink:0}
.firstday-skool{background:rgba(22,163,74,.05); border:1px solid rgba(22,163,74,.2); border-left:3px solid var(--green); border-radius:var(--r-md); padding:14px 20px; color:var(--ink-soft); font-size:.92rem; line-height:1.6; position:relative; z-index:1}
.firstday-skool b{color:var(--green); font-weight:700; display:block; margin-bottom:4px}
.firstday-skool a{color:var(--p1); word-break:break-all}
@media(max-width:560px){.firstday-card{padding:28px 22px} .firstday-vaulty{width:72px; height:72px} .firstday-orient{padding:18px}}

/* TIME SAVED CARD */
.saved-card{
  background:rgba(22,163,74,.05);
  border:1px solid rgba(22,163,74,.2); border-radius:var(--r-md);
  padding:14px 16px; text-align:center; position:relative; overflow:hidden;
  box-shadow:var(--shadow-card);
}
.saved-card::before{
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg, var(--green), transparent);
  pointer-events:none;
}
.saved-num{font-family:var(--display); font-style:normal; font-size:2.4rem; color:var(--green); line-height:.9; letter-spacing:-.03em; position:relative; z-index:1; font-weight:700}
.saved-label{font-size:10px; letter-spacing:.22em; text-transform:uppercase; color:var(--ink-mute); font-weight:700; margin-top:6px; position:relative; z-index:1}
.saved-sub{font-size:11px; color:var(--ink-soft); margin-top:6px; position:relative; z-index:1}

/* STREAK GRID */
.sgrid{display:grid; grid-template-columns:repeat(7,1fr); gap:5px; margin-top:4px}
.sday{
  aspect-ratio:1; border-radius:6px; background:var(--surface-2); border:1px solid var(--line-warm);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  font-size:9px; color:var(--ink-dim); transition:.3s; padding:2px;
}
.sday .sd-d{font-weight:700; font-size:.78rem; color:var(--ink-mute); line-height:1}
.sday .sd-l{font-size:8px; letter-spacing:.1em; text-transform:uppercase; margin-top:2px; color:var(--ink-dim)}
.sday.done{background:linear-gradient(135deg, var(--amber), var(--amber-deep)); border-color:var(--amber); box-shadow:0 4px 10px rgba(124,58,237,.25)}
.sday.done .sd-d, .sday.done .sd-l{color:#ffffff; font-weight:700}
.sday.today{border-color:var(--amber-2); border-width:2px}
.sday.today .sd-d{color:var(--amber-2)}
.sday.done.today .sd-d{color:#ffffff}

/* POWER TOOL TABS */
.ptabs{margin:18px 0; background:#ffffff; border:1px solid var(--line-warm); border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--shadow-card)}
.ptabs-nav{display:flex; gap:0; padding:6px; background:var(--surface-2); border-bottom:1px solid var(--line-warm); overflow-x:auto}
.ptab-btn{
  padding:10px 14px; border-radius:8px; font-size:.84rem; font-weight:600;
  color:var(--ink-mute); transition:.2s; white-space:nowrap; display:flex; align-items:center; gap:8px;
}
.ptab-btn:hover{color:var(--ink); background:rgba(124,58,237,.06)}
.ptab-btn.active{color:#ffffff; background:linear-gradient(135deg,var(--amber),var(--amber-deep)); box-shadow:0 4px 12px -4px rgba(124,58,237,.3)}
.ptab-btn .pti{font-size:1.05rem}
.ptab-btn .free{font-size:9px; padding:2px 6px; border-radius:4px; background:rgba(96,165,250,.18); color:var(--green); font-weight:700; letter-spacing:.05em}
.ptab-btn .paid{font-size:9px; padding:2px 6px; border-radius:4px; background:rgba(167,139,250,.18); color:var(--gold); font-weight:700; letter-spacing:.05em}
.ptab-btn.active .free, .ptab-btn.active .paid{background:rgba(255,255,255,.25); color:#ffffff}
.ptab-body{padding:24px}
.ptab-panel{display:none; animation:tabFade .4s var(--ease)}
.ptab-panel.active{display:block}
@keyframes tabFade{0%{opacity:0; transform:translateY(8px)}100%{opacity:1; transform:translateY(0)}}
.ptab-hero{display:flex; align-items:flex-start; gap:16px; margin-bottom:18px; padding:18px; background:rgba(124,58,237,.05); border:1px solid rgba(124,58,237,.15); border-radius:var(--r-md)}
.ptab-emoji{font-size:2.2rem; flex-shrink:0; line-height:1}
.ptab-h{font-family:var(--display); font-style:normal; font-weight:700; font-size:1.6rem; color:var(--ink); margin-bottom:6px; letter-spacing:-.025em}
.ptab-h-sub{font-size:.88rem; color:var(--ink-soft); line-height:1.6}
.ptab-grid{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:16px}
@media(max-width:700px){.ptab-grid{grid-template-columns:1fr}}
.ptab-use{background:var(--surface-2); border:1px solid var(--line-warm); border-left:3px solid var(--p3); border-radius:var(--r-md); padding:14px 18px}
.ptab-use h6{font-size:10px; letter-spacing:.18em; text-transform:uppercase; color:var(--p3); font-weight:800; margin-bottom:6px}
.ptab-use p{font-size:.86rem; color:var(--ink-soft); margin:0; line-height:1.55}
.ptab-use strong{color:var(--ink); font-weight:600}

/* RADIO PICK WIDGET */
.pick-wrap{margin:16px 0}
.pick-q{font-weight:700; color:var(--ink); margin-bottom:10px; font-size:.95rem}
.pick-opts{display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:8px}
.pick-opt{
  position:relative; padding:14px 16px; background:var(--surface-2); border:1px solid var(--line-warm);
  border-radius:var(--r-md); cursor:pointer; transition:.2s; text-align:center;
}
.pick-opt:hover{border-color:rgba(124,58,237,.3); background:var(--bg-2)}
.pick-opt.selected{border-color:var(--p1); background:rgba(124,58,237,.06); box-shadow:var(--shadow-card)}
.pick-opt.selected::after{content:'✓'; position:absolute; top:8px; right:10px; color:var(--p2); font-weight:800}
.pick-opt .pi{font-size:1.6rem; margin-bottom:6px; display:block}
.pick-opt .pn{font-weight:700; color:var(--ink); font-size:.9rem}
.pick-saved{margin-top:10px; padding:10px 14px; background:rgba(96,165,250,.08); border:1px dashed var(--green); border-radius:8px; font-size:.85rem; color:var(--ink-soft); display:none}
.pick-saved.show{display:block; animation:tabFade .3s var(--ease)}
.pick-saved strong{color:var(--green); font-weight:700}

@media(max-width:768px){
  .nav-inner{padding:12px 16px; gap:8px; flex-wrap:wrap}
  .chip{font-size:11px; padding:5px 10px}
  .hero{padding:24px}
  .ck-head{padding:14px 18px; gap:12px}
  .ck-content{padding:6px 18px 22px}
  .ck-tag{font-size:9px; padding:3px 8px}
  .dashboard{padding:24px}
  .ring{width:160px; height:160px}
  .ring-num{font-size:2.8rem}
}

/* MISSING TOKEN: --purple-glow used in some chassis CSS */
:root{--purple-glow:rgba(139,92,246,.6)}

/* POWER MODE TAB - gold accent */
.mtab-power{position:relative}
.mtab-power.active{background:linear-gradient(135deg, var(--gold), #d4a85c) !important; color:#ffffff !important; box-shadow:0 2px 12px -4px rgba(184,137,58,.4) !important}
.mtab-power:not(.active){color:var(--gold)}
.mtab-power:not(.active):hover{color:#f7d68a; background:rgba(167,139,250,.1)}

/* POWER PATH MODE PAGE */
.pp-hero{
  background:#ffffff;
  border:1px solid var(--line-warm); border-radius:var(--r-xl);
  padding:36px 40px; margin-bottom:28px; position:relative; overflow:hidden;
  box-shadow:var(--shadow-card);
}
.pp-hero::before{
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg, var(--gold), var(--amber), var(--amber-2));
  pointer-events:none;
}
.pp-hero-badge{display:inline-block; font-size:9px; letter-spacing:.25em; text-transform:uppercase; font-weight:800; color:var(--gold); background:rgba(184,137,58,.1); padding:5px 14px; border-radius:var(--r-pill); border:1px solid rgba(184,137,58,.3); margin-bottom:18px; position:relative; z-index:1}
.pp-hero-title{font-family:var(--display); font-style:normal; font-weight:700; font-size:clamp(2.2rem,5vw,3.4rem); color:var(--ink); letter-spacing:-.025em; margin-bottom:14px; position:relative; z-index:1; line-height:1.05}
.pp-hero-sub{color:var(--ink-soft); font-size:1.02rem; line-height:1.65; max-width:680px; margin-bottom:20px; position:relative; z-index:1}
.pp-hero-warn{background:rgba(167,139,250,.08); border:1px solid rgba(167,139,250,.25); border-left:3px solid var(--gold); border-radius:var(--r-md); padding:14px 18px; color:var(--ink-soft); font-size:.9rem; line-height:1.6; margin-bottom:22px; position:relative; z-index:1}
.pp-toc{display:grid; grid-template-columns:repeat(2,1fr); gap:10px; position:relative; z-index:1}
@media(max-width:700px){.pp-toc{grid-template-columns:1fr}}
.pp-toc-item{display:flex; align-items:center; gap:12px; padding:12px 16px; background:var(--surface-2); border:1px solid var(--line-warm); border-radius:var(--r-md); color:var(--ink-soft); text-decoration:none; font-size:.9rem; font-weight:600; transition:.2s; cursor:pointer}
.pp-toc-item:hover{border-color:var(--gold); background:#ffffff; transform:translateX(2px); color:var(--ink)}
.pp-toc-num{width:24px; height:24px; border-radius:50%; background:rgba(184,137,58,.12); color:var(--gold); display:flex; align-items:center; justify-content:center; font-weight:800; font-size:.8rem; flex-shrink:0}
.pp-toc-ico{font-size:1.1rem}
.pp-toc-name{flex:1}

.pp-section{
  background:#ffffff;
  border:1px solid var(--line-warm); border-radius:var(--r-xl);
  margin-bottom:20px; overflow:hidden; scroll-margin-top:90px;
  box-shadow:var(--shadow-card);
}
.pp-section-head{display:flex; align-items:flex-start; gap:18px; padding:24px 28px; background:var(--surface-2); border-bottom:1px solid var(--line-warm)}
.pp-section-icon{width:52px; height:52px; border-radius:var(--r-md); background:linear-gradient(135deg, var(--gold), #d4a85c); color:#ffffff; display:flex; align-items:center; justify-content:center; font-size:1.5rem; flex-shrink:0}
.pp-section-tag{font-size:9px; letter-spacing:.25em; text-transform:uppercase; color:var(--gold); font-weight:800; margin-bottom:4px}
.pp-section-title{font-family:var(--display); font-style:normal; font-weight:700; font-size:clamp(1.5rem,3vw,1.9rem); color:var(--ink); letter-spacing:-.02em; margin-bottom:4px; line-height:1.1}
.pp-section-sub{color:var(--ink-soft); font-size:.92rem; line-height:1.5}
.pp-section-body{padding:24px 28px}
.pp-section-body > * + *{margin-top:14px}

.pp-callout{padding:14px 18px; border-radius:var(--r-md); background:var(--surface-2); border:1px solid var(--line-warm); border-left:3px solid var(--p1)}
.pp-callout.pp-why{border-left-color:var(--p3)}
.pp-callout.pp-cost{border-left-color:var(--green)}
.pp-callout.pp-payoff{border-left-color:var(--gold)}
.pp-callout-l{font-size:10px; letter-spacing:.22em; text-transform:uppercase; color:var(--p2); font-weight:800; margin-bottom:6px}
.pp-callout.pp-why .pp-callout-l{color:var(--p3)}
.pp-callout.pp-cost .pp-callout-l{color:var(--green)}
.pp-callout.pp-payoff .pp-callout-l{color:var(--gold)}
.pp-callout.pp-plain{border-left-color:#9561fa; background:rgba(149,97,250,.06)}
.pp-callout.pp-plain .pp-callout-l{color:#9561fa}
.pp-callout.pp-mistake{border-left-color:#ef4444; background:rgba(239,68,68,.05)}
.pp-callout.pp-mistake .pp-callout-l{color:#ef4444}
.pp-callout.pp-firstwin{border-left-color:#16a34a; background:rgba(22,163,74,.06)}
.pp-callout.pp-firstwin .pp-callout-l{color:#16a34a}
.pp-callout p{color:var(--ink-soft); font-size:.92rem; line-height:1.6; margin:0}
/* HOW-TO TIP BOXES */
.howto-tip{margin:8px 0; border-radius:var(--r-md); border:1px solid #ddd6fe; background:#faf5ff; overflow:hidden}
.howto-sum{display:flex; align-items:center; gap:8px; padding:10px 14px; cursor:pointer; font-size:.875rem; font-weight:600; color:#7c3aed; list-style:none; user-select:none}
.howto-sum::-webkit-details-marker{display:none}
.howto-sum::after{content:'▸'; margin-left:auto; font-size:.75rem; transition:transform .2s}
details[open] .howto-sum::after{transform:rotate(90deg)}
.howto-ico{font-size:1rem; flex-shrink:0}
.howto-body{padding:12px 16px 14px; border-top:1px solid #ddd6fe}
.howto-steps{margin:0; padding-left:20px; display:flex; flex-direction:column; gap:6px}
.howto-steps li{font-size:.875rem; color:var(--ink-soft); line-height:1.55}
.howto-note{margin-top:10px; padding:8px 12px; background:rgba(124,58,237,.07); border-radius:6px; font-size:.82rem; color:#6d28d9; line-height:1.5}

.pp-foot{
  background:rgba(37,99,235,.04);
  border:1px solid rgba(37,99,235,.15); border-radius:var(--r-xl);
  padding:28px 32px; text-align:center; margin-top:14px;
}
.pp-foot-title{font-family:var(--display); font-style:normal; font-weight:700; font-size:1.6rem; color:var(--ink); margin-bottom:6px; letter-spacing:-.02em}
.pp-foot-sub{color:var(--ink-soft); font-size:.92rem; max-width:480px; margin:0 auto; line-height:1.6}

/* TOOL DEEP-LINK PILL — used in week steps (B2) */
.tool-deeplink-row{display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin:14px 0; padding:12px 16px; background:linear-gradient(135deg, rgba(14,165,233,.08), rgba(14,165,233,.02)); border:1px solid rgba(14,165,233,.25); border-left:3px solid #0ea5e9; border-radius:8px}
.tool-deeplink-pill{display:inline-flex; align-items:center; gap:10px; padding:9px 16px 9px 14px; background:#fff; color:#0ea5e9; font-weight:700; font-size:13px; border:1.5px solid #0ea5e9; border-radius:999px; cursor:pointer; transition:.18s; font-family:inherit; box-shadow:0 2px 8px -2px rgba(14,165,233,.2)}
.tool-deeplink-pill:hover{background:#0ea5e9; color:#fff; transform:translateY(-1px); box-shadow:0 4px 14px -2px rgba(14,165,233,.4)}
.tool-deeplink-ico{font-size:15px; line-height:1}
.tool-deeplink-arrow{opacity:.6; font-weight:800}
.tool-deeplink-hint{font-size:12px; color:var(--ink-mute); font-style:italic; line-height:1.4}
@media(max-width:560px){.tool-deeplink-hint{font-size:11px}}

/* TODAY DASHBOARD — Power Operator sidebar card (B1) */
.power-operator-card{
  background:linear-gradient(135deg, var(--gold), #d4a85c) !important;
  border-color:var(--gold) !important;
  color:#fff !important;
  text-align:center;
  box-shadow:0 6px 24px -8px rgba(184,137,58,.5);
  position:relative; overflow:hidden;
}
.power-operator-card::before{content:''; position:absolute; top:-50%; left:-50%; width:200%; height:200%; background:radial-gradient(ellipse at top, rgba(255,255,255,.2), transparent 60%); pointer-events:none}
.power-operator-card .po-seal{font-size:2.2rem; margin-bottom:4px; position:relative; z-index:1}
.power-operator-card .po-title{font-family:var(--display); font-weight:800; font-size:1.15rem; margin-bottom:6px; letter-spacing:-.01em; position:relative; z-index:1}
.power-operator-card .po-line{font-size:.82rem; line-height:1.5; opacity:.95; position:relative; z-index:1}
.power-master-card{background:linear-gradient(135deg, #6d28d9, #4c1d95) !important; border-color:#6d28d9 !important; box-shadow:0 6px 24px -8px rgba(109,40,217,.55)}
.power-master-card::before{background:radial-gradient(ellipse at top, rgba(255,255,255,.25), transparent 60%)}
.pp-grad-master{background:linear-gradient(135deg, #6d28d9, #4c1d95) !important; box-shadow:0 6px 24px -8px rgba(109,40,217,.55)}

/* POWER PATH — new elements for Sprint A: recommended order, prereqs, meta, foryou, health check */
.pp-recommend{background:rgba(22,163,74,.06); border:1px solid rgba(22,163,74,.2); border-radius:var(--r-md); padding:12px 16px; font-size:.9rem; color:var(--ink-soft); line-height:1.55; margin-bottom:18px; position:relative; z-index:1}
.pp-recommend b{color:var(--green); font-weight:800}
.pp-section.won .pp-section-head{background:linear-gradient(135deg, rgba(22,163,74,.08), rgba(22,163,74,.02))}
.pp-section.won .pp-section-icon{background:linear-gradient(135deg, var(--green), #15803d)}
.pp-won-badge{align-self:flex-start; font-size:10px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:#fff; background:var(--green); padding:5px 10px; border-radius:var(--r-pill); box-shadow:0 1px 4px rgba(22,163,74,.3); flex-shrink:0; white-space:nowrap}
.pp-section-meta{display:flex; gap:8px; padding:14px 28px 0; flex-wrap:wrap}
.pp-meta-pill{display:inline-flex; align-items:center; gap:6px; font-size:11.5px; font-weight:700; color:var(--ink-soft); background:#fff; border:1px solid var(--line-warm); padding:5px 12px; border-radius:var(--r-pill)}
.pp-meta-pill.pp-meta-pre{color:#0ea5e9; border-color:rgba(14,165,233,.3); background:rgba(14,165,233,.05)}
.pp-callout.pp-foryou{border-left-color:#2563eb; background:rgba(37,99,235,.05)}
.pp-callout.pp-foryou .pp-callout-l{color:#2563eb}
.pp-prereqs{background:#fffdf7; border:1px dashed var(--line-warm); border-radius:var(--r-md); padding:12px 16px; margin-bottom:14px}
.pp-prereqs-l{font-size:10px; font-weight:800; letter-spacing:.15em; text-transform:uppercase; color:var(--ink-mute); margin-bottom:6px}
.pp-prereqs ul{margin:0; padding-left:22px; color:var(--ink-soft); font-size:.88rem; line-height:1.6}
.pp-prereqs li{margin-bottom:3px}
.pp-toc-item.won{border-color:var(--green); background:rgba(22,163,74,.06)}
.pp-toc-item.won .pp-toc-num{background:var(--green); color:#fff}
.pp-toc-check{color:var(--green); font-weight:800; font-size:1rem}

/* Power Path Health Check */
.pp-healthcheck{background:linear-gradient(135deg, #fffdf7, #fdf9ed); border:2px solid var(--gold); border-radius:var(--r-xl); padding:28px 32px; margin-top:18px; box-shadow:0 4px 18px -6px rgba(184,137,58,.2)}
.pp-hc-head{margin-bottom:20px; text-align:center}
.pp-hc-tag{font-size:9px; letter-spacing:.25em; text-transform:uppercase; font-weight:800; color:var(--gold); margin-bottom:8px}
.pp-hc-title{font-family:var(--display); font-weight:700; font-size:1.8rem; color:var(--ink); letter-spacing:-.02em; margin-bottom:8px}
.pp-hc-sub{color:var(--ink-soft); font-size:.92rem; line-height:1.6; max-width:560px; margin:0 auto}
.pp-hc-list{display:flex; flex-direction:column; gap:10px}
.pp-hc-row{display:flex; align-items:center; gap:14px; padding:14px 18px; background:#fff; border:1px solid var(--line-warm); border-radius:var(--r-md); transition:.2s}
.pp-hc-row.done{border-color:var(--green); background:rgba(22,163,74,.05); box-shadow:inset 3px 0 0 var(--green)}
.pp-hc-icon{width:36px; height:36px; border-radius:50%; background:var(--surface-2); display:flex; align-items:center; justify-content:center; font-size:1.1rem; flex-shrink:0}
.pp-hc-row.done .pp-hc-icon{background:var(--green); color:#fff; font-weight:800}
.pp-hc-text{flex:1; min-width:0}
.pp-hc-title{font-weight:700; font-size:.95rem; color:var(--ink); margin-bottom:3px; font-family:var(--body); letter-spacing:0}
.pp-hc-q{font-size:.82rem; color:var(--ink-mute); line-height:1.45}
.pp-hc-btns{flex-shrink:0}
.pp-grad{margin-top:24px; padding:32px 28px; background:linear-gradient(135deg, var(--gold), #d4a85c); border-radius:var(--r-xl); color:#fff; text-align:center; box-shadow:0 6px 24px -8px rgba(184,137,58,.5)}
.pp-grad-seal{font-size:3rem; margin-bottom:8px}
.pp-grad-title{font-family:var(--display); font-weight:800; font-size:1.6rem; margin-bottom:8px; letter-spacing:-.02em}
.pp-grad-line{font-size:.95rem; line-height:1.6; max-width:520px; margin:0 auto; opacity:.95}
@media(max-width:560px){
  .pp-hc-row{flex-wrap:wrap}
  .pp-hc-btns{width:100%; margin-top:8px}
  .pp-hc-btns .btn{width:100%}
  .pp-section-head{flex-wrap:wrap}
  .pp-won-badge{order:-1; margin-bottom:8px}
}

@media(max-width:560px){
  .pp-hero{padding:24px 22px}
  .pp-section-head{padding:18px 20px; gap:14px}
  .pp-section-icon{width:44px; height:44px; font-size:1.3rem}
  .pp-section-body{padding:18px 20px}
  .pp-foot{padding:22px 20px}
}

/* TOOLS TAB */
.mtab-tools.active{background:linear-gradient(135deg,#0ea5e9,#0284c7) !important; color:#fff !important; box-shadow:0 2px 12px -4px rgba(14,165,233,.4) !important}
.mtab-tools:not(.active){color:#0ea5e9}
.mtab-tools:not(.active):hover{color:#38bdf8; background:rgba(14,165,233,.08)}
.tools-page{max-width:1100px; margin:0 auto; padding:28px 24px 60px}
.tools-header{margin-bottom:28px}
.tools-page-title{font-family:var(--display); font-weight:800; font-size:2rem; color:var(--ink); letter-spacing:-.03em; margin-bottom:6px}
.tools-page-sub{color:var(--ink-soft); font-size:.95rem; line-height:1.5}
.tools-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:32px}
@media(max-width:900px){.tools-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.tools-grid{grid-template-columns:1fr}}
.tool-card{background:#fff; border:1.5px solid var(--line-warm); border-radius:var(--r-lg); padding:18px 20px; cursor:pointer; transition:.18s; display:flex; flex-direction:column; gap:8px}
.tool-card:hover{border-color:#0ea5e9; box-shadow:0 4px 20px -8px rgba(14,165,233,.25); transform:translateY(-1px)}
.tool-card.active{border-color:#0ea5e9; background:rgba(14,165,233,.04); box-shadow:0 0 0 3px rgba(14,165,233,.12)}
.tool-card-icon{font-size:1.6rem; line-height:1}
.tool-card-name{font-weight:700; font-size:.95rem; color:var(--ink)}
.tool-card-desc{font-size:.82rem; color:var(--ink-mute); line-height:1.45}
.tool-panel{background:#fff; border:1.5px solid var(--line-warm); border-radius:var(--r-xl); padding:28px 30px}
@media(max-width:560px){.tool-panel{padding:20px 18px}}
.tool-panel-title{font-family:var(--display); font-weight:700; font-size:1.35rem; color:var(--ink); margin-bottom:4px}
.tool-panel-sub{font-size:.875rem; color:var(--ink-mute); margin-bottom:20px}
.tool-form{display:flex; flex-direction:column; gap:14px}
.tool-field{display:flex; flex-direction:column; gap:5px}
.tool-label{font-size:.8rem; font-weight:700; color:var(--ink-soft); letter-spacing:.04em; text-transform:uppercase}
.tool-input,.tool-select,.tool-textarea{border:1.5px solid var(--line-warm); border-radius:var(--r-md); padding:10px 13px; font-size:.9rem; color:var(--ink); background:#fafafa; width:100%; box-sizing:border-box; font-family:inherit; transition:.15s}
.tool-input:focus,.tool-select:focus,.tool-textarea:focus{outline:none; border-color:#0ea5e9; background:#fff; box-shadow:0 0 0 3px rgba(14,165,233,.1)}
.tool-textarea{resize:vertical; min-height:80px}
.tool-submit{align-self:flex-start; background:linear-gradient(135deg,#0ea5e9,#0284c7); color:#fff; border:none; border-radius:var(--r-pill); padding:11px 26px; font-weight:700; font-size:.9rem; cursor:pointer; transition:.15s; display:flex; align-items:center; gap:8px}
.tool-submit:hover{transform:translateY(-1px); box-shadow:0 4px 16px -4px rgba(14,165,233,.5)}
.tool-output-wrap{margin-top:20px; display:none}
.tool-output-wrap.show{display:block}
.tool-output-label{font-size:.75rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-mute); margin-bottom:8px; display:flex; align-items:center; justify-content:space-between}
.tool-output-box{background:var(--surface-2); border:1.5px solid var(--line-warm); border-radius:var(--r-md); padding:16px 18px; font-size:.88rem; color:var(--ink); line-height:1.65; white-space:pre-wrap; word-break:break-word}
.tool-copy-btn{background:none; border:1px solid var(--line-warm); border-radius:var(--r-pill); padding:4px 12px; font-size:.75rem; font-weight:600; color:var(--ink-mute); cursor:pointer; transition:.15s}
.tool-copy-btn:hover{border-color:#0ea5e9; color:#0ea5e9}
.tool-copy-btn.copied{border-color:var(--green); color:var(--green)}

/* PROMPT LIBRARY (Tools → Prompt Library) — 15 prompts, filter + search + per-prompt expand */
.lib-toolbar{display:flex; flex-direction:column; gap:10px; margin-bottom:18px; padding-bottom:14px; border-bottom:1px solid var(--line-warm)}
.lib-cats{display:flex; gap:6px; flex-wrap:wrap}
.lib-cat-btn{padding:5px 12px; background:var(--surface-2); border:1px solid var(--line-warm); border-radius:var(--r-sm); color:var(--ink-mute); font-size:12px; cursor:pointer; font-weight:500; transition:.15s}
.lib-cat-btn:hover{background:var(--surface-3); color:var(--ink)}
.lib-cat-btn.active{font-weight:600}
.lib-search{width:100%; padding:8px 14px; border:1px solid var(--line-warm); border-radius:var(--r-pill); background:var(--surface-2); font-size:13px; color:var(--ink); outline:none; box-sizing:border-box; font-family:inherit}
.lib-search:focus{border-color:var(--amber); background:#fff}
.lib-list{display:flex; flex-direction:column; gap:8px}
.lib-card{background:#fff; border:1px solid var(--line-warm); border-radius:var(--r-md); overflow:hidden; transition:.2s}
.lib-card.open{border-color:var(--ink-mute); box-shadow:var(--shadow-card)}
.lib-card-head{padding:14px 18px; cursor:pointer; display:flex; align-items:center; gap:14px}
.lib-card-head:hover{background:var(--surface-2)}
.lib-card-num{width:28px; height:28px; border-radius:6px; display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:700; flex-shrink:0; border:1px solid}
.lib-card-body{flex:1; min-width:0}
.lib-card-title{font-size:14px; font-weight:600; color:var(--ink); margin-bottom:2px}
.lib-card-desc{font-size:12px; color:var(--ink-mute); line-height:1.5}
.lib-card-cat{font-size:10px; padding:2px 8px; border-radius:4px; text-transform:uppercase; letter-spacing:.06em; font-weight:600; flex-shrink:0}
.lib-card-chevron{color:var(--ink-dim); font-size:13px; flex-shrink:0}
.lib-card-expand{border-top:1px solid var(--line-warm); padding:18px; background:var(--surface-2)}
.lib-fields{display:flex; flex-direction:column; gap:12px; margin-bottom:16px}
.lib-field-label{font-size:11px; color:var(--ink-mute); display:block; margin-bottom:5px; text-transform:uppercase; letter-spacing:.05em; font-weight:600}
.lib-input,.lib-textarea{width:100%; background:#fff; border:1px solid var(--line-warm); border-radius:6px; padding:9px 12px; color:var(--ink); font-size:13px; line-height:1.6; outline:none; box-sizing:border-box; font-family:inherit; transition:.15s}
.lib-textarea{resize:vertical; min-height:64px}
.lib-input:focus,.lib-textarea:focus{border-color:var(--amber); box-shadow:0 0 0 3px rgba(124,58,237,.08)}
.lib-preview{background:#fff; border:1px solid var(--line-warm); border-radius:7px; padding:14px 16px; margin-bottom:12px}
.lib-preview pre{margin:0; color:var(--ink-soft); font-size:12.5px; line-height:1.75; white-space:pre-wrap; font-family:var(--body); word-break:break-word}
.lib-copy-prompt-btn{width:100%; padding:10px; border-radius:7px; font-size:13px; font-weight:600; cursor:pointer; border:1px solid; transition:.2s; font-family:inherit}
.lib-empty{padding:40px 24px; text-align:center; color:var(--ink-mute); font-size:13.5px}

/* ---- Realtor Prompt Library: card actions + full-prompt modal ---- */
.rlib-card .lib-card-head{cursor:pointer}
.rlib-card-actions{display:flex; gap:8px; padding:0 18px 14px 60px}
.rlib-btn{padding:7px 14px; border-radius:7px; font-size:12.5px; font-weight:600; cursor:pointer; border:1px solid var(--line-warm); background:var(--surface-2); color:var(--ink-soft); font-family:inherit; transition:.15s}
.rlib-btn:hover{filter:brightness(.97)}
.rlib-btn-view:hover{background:var(--surface-3); color:var(--ink)}
@media(max-width:560px){.rlib-card-actions{padding-left:18px}}

.rlib-modal-bg{position:fixed; inset:0; background:rgba(20,18,16,.62); z-index:1200; display:none; align-items:center; justify-content:center; padding:24px; opacity:0; transition:opacity .2s}
.rlib-modal-bg.open{display:flex; opacity:1}
.rlib-modal{position:relative; background:#fff; border:1px solid var(--line-strong); border-radius:var(--r-xl); padding:30px 32px; max-width:640px; width:100%; max-height:86vh; overflow-y:auto; box-shadow:var(--shadow-lift)}
.rlib-modal-close{position:absolute; top:14px; right:18px; background:none; border:none; color:var(--ink-mute); font-size:1.5rem; line-height:1; cursor:pointer; padding:2px 8px}
.rlib-modal-close:hover{color:var(--ink)}
.rlib-modal-cat{display:inline-block; font-size:10px; padding:3px 9px; border-radius:4px; text-transform:uppercase; letter-spacing:.06em; font-weight:700; margin-bottom:12px}
.rlib-modal-title{font-family:var(--display); font-weight:700; font-size:1.4rem; letter-spacing:-.02em; color:var(--ink); margin-bottom:6px}
.rlib-modal-desc{font-size:13px; color:var(--ink-mute); line-height:1.55; margin-bottom:18px}
.rlib-modal-body{background:var(--surface-2); border:1px solid var(--line-warm); border-radius:9px; padding:16px 18px; margin-bottom:16px}
.rlib-modal-body pre{margin:0; color:var(--ink-soft); font-size:13px; line-height:1.7; white-space:pre-wrap; word-break:break-word; font-family:var(--body)}
.rlib-modal-copy{width:100%; padding:11px; border-radius:8px; font-size:13.5px; font-weight:600; cursor:pointer; border:1px solid transparent; color:#fff; font-family:inherit; transition:.2s}
.rlib-modal-copy:hover{filter:brightness(1.04)}
@media(max-width:560px){.rlib-modal{padding:24px 20px}.rlib-modal-title{font-size:1.2rem}}

/* USE TAG ("Use this in your business" callout in week hero */
.use-tag{background:rgba(22,163,74,.05); border:1px solid rgba(22,163,74,.2); border-left:3px solid var(--green); border-radius:var(--r-md); padding:12px 16px; margin:18px 0 14px; position:relative; z-index:1}
.use-tag-l{font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--green); font-weight:800; margin-bottom:4px}
.use-tag-t{color:var(--ink); font-size:.92rem; line-height:1.55}

/* HOW RAG WORKS (featured deep-dive card */
.rag-card{
  background:#ffffff;
  border:1px solid var(--line-warm); border-radius:var(--r-xl);
  padding:36px 40px; margin-bottom:28px; position:relative; overflow:hidden;
  box-shadow:var(--shadow-card);
}
.rag-card::before{
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg, var(--p3), var(--p1));
  pointer-events:none;
}
.rag-tag{display:inline-block; font-size:9px; letter-spacing:.25em; text-transform:uppercase; font-weight:800; color:var(--p3); background:rgba(37,99,235,.1); padding:5px 14px; border-radius:var(--r-pill); border:1px solid rgba(37,99,235,.25); margin-bottom:16px; position:relative; z-index:1}
.rag-title{font-family:var(--display); font-style:normal; font-weight:700; font-size:clamp(1.8rem,4vw,2.6rem); color:var(--ink); letter-spacing:-.025em; margin-bottom:12px; position:relative; z-index:1; line-height:1.1}
.rag-sub{color:var(--ink-soft); font-size:1rem; line-height:1.65; max-width:680px; margin-bottom:24px; position:relative; z-index:1}
.rag-block{padding:18px 22px; background:var(--surface-2); border:1px solid var(--line-warm); border-radius:var(--r-md); margin-bottom:14px; position:relative; z-index:1}
.rag-block-h{font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--p3); font-weight:800; margin-bottom:10px}
.rag-block p{color:var(--ink-soft); font-size:.92rem; line-height:1.65; margin:0 0 10px}
.rag-block p:last-child{margin-bottom:0}
.rag-block strong, .rag-block b{color:var(--ink); font-weight:700}
.rag-list{padding-left:20px; margin:0}
.rag-list li{color:var(--ink-soft); font-size:.9rem; line-height:1.6; margin-bottom:8px}
.rag-list li:last-child{margin-bottom:0}
.rag-list b{color:var(--ink); font-weight:700}
.rag-steps{display:flex; flex-direction:column; gap:10px}
.rag-step{display:flex; gap:14px; align-items:flex-start; padding:12px 14px; background:var(--surface-2); border:1px solid var(--line-warm); border-radius:var(--r-md); font-size:.9rem; color:var(--ink-soft); line-height:1.55}
.rag-step b{color:var(--ink); font-weight:700}
.rag-step-num{width:26px; height:26px; border-radius:50%; background:linear-gradient(135deg, var(--teal), var(--teal-deep)); color:#ffffff; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:.85rem; flex-shrink:0}
.rag-versus{display:grid; grid-template-columns:1fr 1fr; gap:10px}
@media(max-width:600px){.rag-versus{grid-template-columns:1fr}}
.rag-vs-card{padding:14px 16px; background:var(--surface-2); border:1px solid var(--line-warm); border-radius:var(--r-md); border-left:3px solid var(--p3)}
.rag-vs-card.rag-vs-yes{border-left-color:var(--green)}
.rag-vs-card.rag-vs-no{border-left-color:var(--gold)}
.rag-vs-tag{font-size:10px; letter-spacing:.15em; text-transform:uppercase; color:var(--p2); font-weight:800; margin-bottom:6px}
.rag-vs-card.rag-vs-yes .rag-vs-tag{color:var(--green)}
.rag-vs-card.rag-vs-no .rag-vs-tag{color:var(--gold)}
.rag-vs-card p{font-size:.86rem; color:var(--ink-soft); line-height:1.55; margin:0}
.rag-foot{background:rgba(22,163,74,.05); border:1px solid rgba(22,163,74,.2); border-left:3px solid var(--green); border-radius:var(--r-md); padding:14px 18px; color:var(--ink-soft); font-size:.92rem; line-height:1.6; position:relative; z-index:1; margin-top:6px}
.rag-foot strong{color:var(--green); font-weight:700}
@media(max-width:560px){.rag-card{padding:24px 22px}}

/* POWER PATH BONUS CARD (in Help mode) */
.ppath-card{
  background:#ffffff;
  border:1px solid var(--line-warm); border-radius:var(--r-xl);
  padding:28px 32px; margin-bottom:28px; position:relative; overflow:hidden;
  box-shadow:var(--shadow-card);
}
.ppath-card::before{
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg, var(--gold), var(--amber));
  pointer-events:none;
}
.ppath-badge{display:inline-block; font-size:9px; letter-spacing:.25em; text-transform:uppercase; font-weight:800; color:var(--gold); background:rgba(184,137,58,.1); padding:4px 12px; border-radius:var(--r-pill); border:1px solid rgba(184,137,58,.25); margin-bottom:12px; position:relative; z-index:1}
.ppath-title{font-family:var(--display); font-style:normal; font-weight:700; font-size:clamp(1.5rem,3vw,2rem); color:var(--ink); letter-spacing:-.02em; margin-bottom:8px; position:relative; z-index:1}
.ppath-sub{color:var(--ink-soft); font-size:.95rem; line-height:1.6; max-width:680px; margin-bottom:20px; position:relative; z-index:1}
.ppath-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:12px; margin-bottom:14px; position:relative; z-index:1}
@media(max-width:700px){.ppath-grid{grid-template-columns:1fr}}
.ppath-item{display:flex; gap:14px; padding:14px 16px; background:var(--surface-2); border:1px solid var(--line-warm); border-radius:var(--r-md); transition:.2s}
.ppath-item:hover{border-color:rgba(184,137,58,.35); background:#ffffff}
.ppath-num{width:28px; height:28px; border-radius:50%; background:linear-gradient(135deg, var(--gold), #d4a85c); color:#ffffff; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:.85rem; flex-shrink:0}
.ppath-h{font-weight:700; color:var(--ink); font-size:.92rem; margin-bottom:3px}
.ppath-d{font-size:.82rem; color:var(--ink-soft); line-height:1.55}
.ppath-foot{font-size:.82rem; color:var(--ink-mute); font-style:italic; position:relative; z-index:1}

/* MIND MAP FIGURES (5-Layer Brain, 4 Employees, Daily Routine cycle) */
.mm-figure{
  background:var(--surface-2);
  border:1px solid var(--line-warm); border-radius:var(--r-xl);
  padding:18px; margin:0 0 24px;
  display:flex; justify-content:center; align-items:center;
  overflow:hidden; box-shadow:var(--shadow-card);
}
.mm-figure svg{max-width:100%; height:auto; display:block}
.mm-figure-compact{padding:14px; margin-bottom:20px}
.hub-figure{margin:0}
.hub-figure figcaption{font-size:.8rem; color:var(--ink-mute); text-align:center; margin-top:10px; font-style:italic}
@media(max-width:560px){
  .mm-figure{padding:10px; border-radius:var(--r-md); margin-bottom:14px}
}

/* WEEKLY RHYTHM (Pillar wrap-ups, vault habits, etc.) */
.kcard-head{font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--p2); font-weight:800; margin-bottom:6px}
.cal-head{font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--p2); font-weight:800; margin-bottom:10px; padding-bottom:8px; border-bottom:1px solid var(--line-soft)}
.cal-row{display:grid; grid-template-columns:120px 1fr; gap:14px; padding:8px 0; border-bottom:1px dashed var(--line-soft); font-size:.88rem; align-items:start}
.cal-row:last-child{border:none}
.cal-day{font-weight:700; color:var(--ink); font-size:.82rem; letter-spacing:.04em}
.cal-task{color:var(--ink-soft); line-height:1.55}

/* ============================================================
   V2 CHASSIS: MODE TABS, VAULTY, TODAY, AGENTS, VAULT, HELP
   ============================================================ */

/* MODE TABS */
.mode-tabs{display:flex; align-items:center; gap:4px; background:var(--surface-2); border:1px solid var(--line-warm); border-radius:14px; padding:4px}
.mtab{display:flex; align-items:center; gap:7px; padding:8px 16px; border-radius:10px; font-size:13px; font-weight:600; color:var(--ink-mute); transition:color .2s var(--ease), background .2s var(--ease), box-shadow .2s var(--ease); white-space:nowrap}
.mtab:hover{color:var(--ink-soft); background:rgba(124,58,237,.05)}
.mtab.active{color:var(--ink); background:#ffffff; box-shadow:var(--shadow-card); font-weight:700}
.mtab-icon{display:flex; align-items:center; justify-content:center; width:16px; height:16px}
@media(max-width:768px){.mtab{padding:7px 10px; font-size:12px} .mode-tabs{gap:2px}}
@media(max-width:540px){.mtab-label{display:none} .mtab{padding:8px 9px} .mode-tabs{gap:1px}}

/* VAULTY NAV SLOT */
.vaulty-nav-slot{width:32px; height:32px; border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:default; flex-shrink:0}
.vaulty-nav-slot svg{width:32px; height:32px; filter:drop-shadow(0 0 6px rgba(124,58,237,.3)); transition:transform .4s var(--ease)}
.vaulty-nav-slot:hover svg{transform:scale(1.15)}
.vaulty-fallback{width:32px; height:32px; border-radius:50%; background:linear-gradient(135deg, var(--amber), var(--teal)); display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:800; color:#ffffff}

/* MODE SECTIONS */
[data-mode-section]{animation:modeIn .35s var(--ease)}
@keyframes modeIn{0%{opacity:0; transform:translateY(10px)}100%{opacity:1; transform:translateY(0)}}
.mode-full-width{max-width:960px; margin:0 auto; padding:28px 28px 60px}
@media(max-width:768px){.mode-full-width{padding:16px 16px 48px}}
@media(max-width:480px){.mode-full-width{padding:12px 14px 40px}}

/* TODAY MODE */
.today-greeting{display:grid; grid-template-columns:1fr auto; gap:24px; align-items:center; background:#ffffff; border:1px solid var(--line-warm); border-radius:var(--r-xl); padding:32px 36px; margin-bottom:24px; position:relative; overflow:hidden; box-shadow:var(--shadow-card)}
.today-greeting::before{content:''; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg, var(--amber), var(--amber-2), var(--teal)); pointer-events:none}
.tg-day{font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--p1); font-weight:700; margin-bottom:8px; position:relative; z-index:1}
.tg-name{font-family:var(--display); font-style:normal; font-size:clamp(2.2rem,4vw,3.2rem); color:var(--ink); line-height:1; letter-spacing:-.025em; margin-bottom:10px; position:relative; z-index:1; font-weight:700}
.tg-name b{color:var(--p1); font-weight:700}
.tg-tip{font-size:.9rem; color:var(--ink-soft); max-width:480px; line-height:1.6; padding:12px 16px; background:rgba(124,58,237,.06); border:1px solid rgba(124,58,237,.15); border-left:3px solid var(--p1); border-radius:var(--r-md); position:relative; z-index:1; transition:opacity .3s}
.tg-tip .tip-label{font-size:9px; letter-spacing:.2em; text-transform:uppercase; color:var(--p1); font-weight:800; margin-bottom:4px}
.today-vaulty{width:80px; height:80px; flex-shrink:0; position:relative; z-index:1}
.today-vaulty svg{width:80px; height:80px; filter:drop-shadow(0 0 12px rgba(124,58,237,.3))}
.vaulty-avatar-fallback{width:80px; height:80px; border-radius:50%; background:linear-gradient(135deg, var(--p1), var(--p3)); display:flex; align-items:center; justify-content:center; font-size:2rem; box-shadow:0 0 24px rgba(124,58,237,.3)}
@media(max-width:768px){.today-greeting{grid-template-columns:1fr; padding:24px} .today-vaulty{display:none}}

.today-stats{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:24px; align-items:start}
@media(max-width:900px){.today-stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.today-stats{grid-template-columns:1fr}}
.tstat-card{background:#ffffff; border:1px solid var(--line-warm); border-radius:var(--r-lg); padding:20px 22px; position:relative; overflow:hidden; transition:.3s var(--ease); box-shadow:var(--shadow-card)}
.tstat-card:hover{border-color:rgba(124,58,237,.3); transform:translateY(-2px); box-shadow:var(--shadow-lift)}
.tstat-card::before{content:''; position:absolute; top:0; left:0; right:0; height:3px}
.tstat-card.streak::before{background:linear-gradient(90deg, var(--p1), transparent)}
.streak-risk{background:rgba(239,68,68,.08); border:1px solid rgba(239,68,68,.25); border-left:3px solid #ef4444; border-radius:var(--r-md); padding:10px 14px; font-size:.875rem; color:#dc2626; font-weight:600; display:flex; align-items:center; gap:8px; margin-bottom:12px}
.tstat-card.saved::before{background:linear-gradient(90deg, var(--green), transparent)}
.tstat-card.agents::before{background:linear-gradient(90deg, var(--p3), transparent)}
.tstat-card.xp::before{background:linear-gradient(90deg, var(--gold), transparent)}
.tstat-num{font-family:var(--display); font-style:normal; font-size:clamp(2rem,4vw,2.8rem); line-height:.9; letter-spacing:-.03em; margin-bottom:6px; font-weight:700}
.tstat-card.streak .tstat-num{color:var(--p1)}
.tstat-card.saved .tstat-num{color:var(--green)}
.tstat-card.agents .tstat-num{color:var(--p3)}
.tstat-card.xp .tstat-num{color:var(--gold)}
.tstat-label{font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-mute); font-weight:700}
.tstat-sub{font-size:.78rem; color:var(--ink-dim); margin-top:5px}
.stat-streak-grid{display:grid; grid-template-columns:repeat(7,1fr); gap:3px; margin-top:8px}
.ssg-day{aspect-ratio:1; border-radius:3px; background:var(--bg-3); font-size:0}
.ssg-day.hit{background:linear-gradient(135deg, var(--p1), var(--p3))}
.ssg-day.today-ring{outline:2px solid var(--p1); outline-offset:1px}

.today-body{display:grid; grid-template-columns:1fr 360px; gap:20px}
@media(max-width:1024px){.today-body{grid-template-columns:1fr}}

.routine-card{background:#ffffff; border:1px solid var(--line-warm); border-radius:var(--r-lg); overflow:hidden; margin-bottom:20px; box-shadow:var(--shadow-card)}
.routine-head{padding:18px 22px; background:var(--surface-2); border-bottom:1px solid var(--line-warm); display:flex; align-items:center; justify-content:space-between}
.routine-title{font-weight:700; font-size:.98rem; color:var(--ink); display:flex; align-items:center; gap:8px}
.routine-title::before{content:''; width:8px; height:8px; border-radius:50%; background:var(--green); box-shadow:0 0 8px var(--green); display:inline-block}
.routine-date{font-size:11px; color:var(--ink-mute); font-weight:500}
.routine-items{padding:14px 22px 18px; display:flex; flex-direction:column; gap:8px}
.ri{display:flex; align-items:center; gap:14px; padding:11px 14px; background:var(--surface-2); border:1px solid var(--line-warm); border-radius:10px; cursor:pointer; transition:.2s; user-select:none}
.ri:hover{border-color:rgba(124,58,237,.3); background:#ffffff}
.ri.done{border-color:rgba(22,163,74,.25); background:rgba(22,163,74,.04)}
.ri-check{width:20px; height:20px; border-radius:50%; border:2px solid var(--line-warm); display:flex; align-items:center; justify-content:center; flex-shrink:0; transition:.2s; font-size:10px; color:transparent}
.ri.done .ri-check{background:var(--green); border-color:var(--green); color:#ffffff; font-size:11px}
.ri-text{flex:1; font-size:.9rem; color:var(--ink-soft); font-weight:500}
.ri.done .ri-text{color:var(--ink); text-decoration:line-through; text-decoration-color:var(--ink-mute)}
.ri-tag{font-size:9px; padding:2px 7px; border-radius:4px; background:var(--surface-3); border:1px solid var(--line-warm); color:var(--ink-dim); font-weight:700; letter-spacing:.05em; white-space:nowrap}
.routine-progress{height:3px; background:var(--bg-2); border-radius:0 0 var(--r-lg) var(--r-lg); overflow:hidden}
.routine-progress-fill{height:100%; background:linear-gradient(90deg, var(--p1), var(--green)); transition:width .6s var(--ease); box-shadow:0 0 8px rgba(96,165,250,.4)}

.echo-card{background:rgba(37,99,235,.04); border:1px solid rgba(37,99,235,.15); border-radius:var(--r-lg); padding:22px; margin-bottom:20px; position:relative; overflow:hidden; box-shadow:var(--shadow-card)}
.echo-card::before{content:''; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg, var(--p3), transparent); pointer-events:none}
.echo-label{font-size:9px; letter-spacing:.25em; text-transform:uppercase; color:var(--p3); font-weight:800; margin-bottom:10px; display:flex; align-items:center; gap:6px}
.echo-label::before{content:'◈'; font-size:12px}
.echo-heading{font-family:var(--display); font-style:normal; color:var(--ink); font-size:1.25rem; font-weight:700; margin-bottom:8px; letter-spacing:-.02em}
.echo-body{color:var(--ink-soft); font-size:.9rem; line-height:1.65}
.echo-date{font-size:10px; color:var(--ink-dim); margin-top:12px; letter-spacing:.1em}
.echo-empty{color:var(--ink-dim); font-style:italic; font-size:.88rem}

.today-side{display:flex; flex-direction:column; gap:20px}
.side-card{background:#ffffff; border:1px solid var(--line-warm); border-radius:var(--r-lg); padding:20px; box-shadow:var(--shadow-card)}
.side-card-title{font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-mute); font-weight:800; margin-bottom:14px; display:flex; align-items:center; justify-content:space-between}

/* PAGE INTRO HEADER (Agents, Vault, Help shared header card) */
.page-intro{
  background:#ffffff;
  border:1px solid var(--line-warm); border-radius:var(--r-xl);
  padding:28px 32px 24px; margin-bottom:24px;
  position:relative; overflow:hidden;
  box-shadow:var(--shadow-card);
}
.page-intro::before{
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg, var(--amber), var(--amber-2), var(--teal));
}
.page-intro::after{
  content:''; position:absolute; bottom:0; right:0; width:220px; height:100%;
  background:radial-gradient(ellipse at right center, rgba(124,58,237,.06) 0%, transparent 70%);
  pointer-events:none;
}
@media(max-width:768px){.page-intro{padding:22px 22px 20px}}

/* AGENTS MODE */
.agents-page-title{font-family:var(--display); font-style:normal; font-weight:700; font-size:clamp(1.8rem,3.5vw,2.4rem); color:var(--ink); letter-spacing:-.025em; margin-bottom:6px}
.agents-page-sub{color:var(--ink-mute); font-size:.95rem; margin-bottom:0; max-width:640px}
.agents-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:20px}
@media(max-width:800px){.agents-grid{grid-template-columns:1fr}}
.agent-card{background:#ffffff; border:1px solid var(--line-warm); border-radius:var(--r-xl); padding:28px; position:relative; overflow:hidden; transition:.3s var(--ease); box-shadow:var(--shadow-card)}
.agent-card:hover{transform:translateY(-3px); border-color:rgba(124,58,237,.3); box-shadow:var(--shadow-lift)}
.agent-card.status-live{border-color:var(--p1); box-shadow:var(--shadow-lift)}
.agent-card.status-live::before{content:''; position:absolute; top:-40%; right:-15%; width:60%; height:170%; background:radial-gradient(ellipse, rgba(124,58,237,.08), transparent 65%); pointer-events:none}
.agent-card.status-progress{border-color:rgba(124,58,237,.25)}
.agent-card.status-notbuilt{opacity:.8}
.agent-status-dot{position:absolute; top:22px; right:22px; width:10px; height:10px; border-radius:50%}
.agent-status-dot.live{background:var(--green); box-shadow:0 0 12px var(--green); animation:pulse 2s ease-in-out infinite}
.agent-status-dot.progress{background:var(--gold)}
.agent-status-dot.notbuilt{background:var(--ink-dim)}
.agent-icon{width:52px; height:52px; border-radius:var(--r-md); display:flex; align-items:center; justify-content:center; font-size:1.5rem; margin-bottom:16px; position:relative; z-index:1}
.agent-card.status-live .agent-icon{background:linear-gradient(135deg, var(--p1), var(--p3)); box-shadow:0 8px 24px -8px rgba(124,58,237,.4)}
.agent-card.status-progress .agent-icon{background:rgba(124,58,237,.08); border:1px solid rgba(124,58,237,.2)}
.agent-card.status-notbuilt .agent-icon{background:var(--surface-2); border:1px solid var(--line-warm)}
.agent-name{font-weight:800; font-size:1.3rem; color:var(--ink); letter-spacing:.04em; position:relative; z-index:1}
.agent-role{font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-mute); font-weight:600; margin-bottom:12px; position:relative; z-index:1}
.agent-desc{font-size:.88rem; color:var(--ink-soft); line-height:1.6; margin-bottom:16px; position:relative; z-index:1}
.agent-status-badge{display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border-radius:var(--r-pill); font-size:10px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; margin-bottom:16px}
.badge-live{background:rgba(22,163,74,.1); color:var(--green); border:1px solid rgba(22,163,74,.25)}
.badge-progress{background:rgba(184,137,58,.1); color:var(--gold); border:1px solid rgba(184,137,58,.25)}
.badge-notbuilt{background:var(--surface-2); color:var(--ink-dim); border:1px solid var(--line-warm)}
.agent-meta{font-size:.78rem; color:var(--ink-dim); margin-bottom:16px; display:flex; gap:14px; flex-wrap:wrap; position:relative; z-index:1}
.agent-actions{display:flex; gap:10px; flex-wrap:wrap; position:relative; z-index:1}
.agent-url-row{display:flex; align-items:center; gap:8px; margin-top:12px; background:var(--surface-2); border:1px solid var(--line-warm); border-radius:8px; padding:8px 12px; position:relative; z-index:1}
.agent-url-input{flex:1; background:transparent; border:none; color:var(--ink-soft); font:inherit; font-size:.82rem; outline:none; min-width:0}
.agent-url-input::placeholder{color:var(--ink-dim)}
.agent-url-saved{font-size:10px; color:var(--green); opacity:0; transition:opacity .3s; white-space:nowrap}
.agent-url-saved.show{opacity:1}

/* VAULT MODE */
.vault-page-title{font-family:var(--display); font-style:normal; font-weight:700; font-size:clamp(1.8rem,3.5vw,2.4rem); color:var(--ink); letter-spacing:-.025em; margin-bottom:6px}
.vault-page-sub{color:var(--ink-mute); font-size:.95rem; margin-bottom:0; max-width:640px}
.vault-arch-card{background:#ffffff; border:1px solid var(--line-warm); border-radius:var(--r-xl); padding:28px 32px; margin-bottom:24px; position:relative; overflow:hidden; box-shadow:var(--shadow-card)}
.vault-arch-card::before{content:''; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg, var(--amber), var(--amber-2), var(--teal))}
.vault-arch-title{font-size:10px; letter-spacing:.22em; text-transform:uppercase; color:var(--p1); font-weight:800; margin-bottom:18px}
.arch-layers{display:flex; flex-direction:column; gap:8px}
.al{display:flex; align-items:center; gap:16px; padding:14px 18px; background:var(--surface-2); border:1px solid var(--line-warm); border-left:3px solid var(--p1); border-radius:var(--r-md); transition:.25s}
.al:hover{background:#ffffff; border-left-width:4px; box-shadow:var(--shadow-card)}
.al-num{width:30px; height:30px; border-radius:50%; background:linear-gradient(135deg, var(--amber), var(--amber-deep)); color:#ffffff; display:flex; align-items:center; justify-content:center; font-size:.85rem; font-weight:800; flex-shrink:0}
.al-name{font-weight:700; color:var(--ink); font-size:.95rem}
.al-tool{font-size:9px; padding:2px 7px; background:rgba(37,99,235,.1); color:var(--p3); border-radius:4px; font-weight:600; letter-spacing:.05em; margin-left:6px}
.al-desc{font-size:.82rem; color:var(--ink-soft); line-height:1.5; margin-top:2px}
.al-badge{margin-left:auto; font-size:9px; padding:3px 9px; border-radius:var(--r-pill); font-weight:700; letter-spacing:.06em; text-transform:uppercase; white-space:nowrap}
.al-badge.set{background:rgba(22,163,74,.1); color:var(--green); border:1px solid rgba(22,163,74,.25)}
.al-badge.empty{background:var(--surface-2); color:var(--ink-dim); border:1px solid var(--line-warm)}
.vault-body{display:grid; grid-template-columns:1fr 300px; gap:20px}
@media(max-width:800px){.vault-body{grid-template-columns:1fr}}
.vault-links-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:12px; margin-bottom:20px}
@media(max-width:600px){.vault-links-grid{grid-template-columns:1fr}}
.vlink-card{background:#ffffff; border:1px solid var(--line-warm); border-radius:var(--r-lg); padding:18px; position:relative; transition:.2s; overflow:hidden; box-shadow:var(--shadow-card)}
.vlink-card:hover{border-color:rgba(124,58,237,.3); transform:translateY(-1px); box-shadow:var(--shadow-lift)}
.vlink-card.has-url{cursor:pointer}
.vlink-card.has-url:hover{border-color:var(--p1)}
.vlink-label{font-size:9px; letter-spacing:.18em; text-transform:uppercase; color:var(--p1); font-weight:800; margin-bottom:6px; display:flex; align-items:center; gap:6px}
.vlink-label .vl-icon{font-size:14px}
.vlink-title{font-weight:700; color:var(--ink); font-size:.93rem; margin-bottom:4px}
.vlink-sub{font-size:.78rem; color:var(--ink-mute); line-height:1.5}
.vlink-url-input{width:100%; background:var(--surface-2); border:1px dashed var(--line-warm); border-radius:6px; padding:6px 10px; color:var(--ink-soft); font:inherit; font-size:.78rem; outline:none; margin-top:8px}
.vlink-url-input:focus{border-color:var(--p1); background:#ffffff}
.vlink-url-input::placeholder{color:var(--ink-dim)}
.vlink-saved{font-size:9px; color:var(--green); opacity:0; transition:opacity .3s; margin-top:4px; display:block}
.vlink-saved.show{opacity:1}
.synth-status-card{background:rgba(124,58,237,.04); border:1px solid rgba(124,58,237,.18); border-radius:var(--r-lg); padding:22px; margin-bottom:20px; box-shadow:var(--shadow-card)}
.ssc-row{display:flex; align-items:center; justify-content:space-between; margin-bottom:14px}
.ssc-title{font-weight:700; color:var(--ink); font-size:.95rem; display:flex; align-items:center; gap:8px}
.ssc-count{font-family:var(--display); font-style:normal; font-size:2.2rem; color:var(--p1); font-weight:700; line-height:.9}
.ssc-label{font-size:9px; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-mute); font-weight:700}
.ssc-date{font-size:.82rem; color:var(--ink-soft); margin-top:4px}
.ssc-hist{margin-top:14px; display:flex; flex-direction:column; gap:8px}
.ssc-card{background:#ffffff; border:1px solid var(--line-warm); border-left:3px solid var(--p1); border-radius:8px; padding:12px 14px}
.ssc-card-date{font-size:9px; letter-spacing:.15em; text-transform:uppercase; color:var(--ink-mute); font-weight:700; margin-bottom:4px}
.ssc-card-text{color:var(--ink-soft); font-size:.83rem; line-height:1.6}
.vault-side-card{background:#ffffff; border:1px solid var(--line-warm); border-radius:var(--r-lg); padding:20px; margin-bottom:16px; box-shadow:var(--shadow-card)}
.vault-side-title{font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-mute); font-weight:800; margin-bottom:14px}
.echo-archive{display:flex; flex-direction:column; gap:8px}
.ea-item{padding:10px 12px; background:var(--surface-2); border:1px solid var(--line-warm); border-radius:8px; font-size:.82rem; color:var(--ink-soft)}
.ea-date{font-size:9px; color:var(--ink-dim); letter-spacing:.1em; text-transform:uppercase; margin-bottom:3px}

/* HELP MODE */
.help-page-title{font-family:var(--display); font-style:normal; font-weight:700; font-size:clamp(1.8rem,3.5vw,2.4rem); color:var(--ink); letter-spacing:-.025em; margin-bottom:6px}
.help-page-sub{color:var(--ink-mute); font-size:.95rem; margin-bottom:0; max-width:640px}
.help-body{display:grid; grid-template-columns:1fr 360px; gap:24px; align-items:start}
@media(max-width:1024px){.help-body{grid-template-columns:1fr}}

/* ============================================================
   MOBILE OVERLAP FIXES (v4.1)
   ============================================================ */
@media(max-width:900px){
  /* NAV: 2-row layout. Brand + chips + sign-in on top, tabs centered below */
  .nav-inner{flex-wrap:wrap; gap:10px 12px; padding:10px 14px}
  .brand-name{font-size:14px}
  .brand-mark{width:28px; height:28px; font-size:13px}
  .brand-orb{width:28px; height:28px}
  .mode-tabs{order:5; flex-basis:100%; justify-content:center; gap:2px; padding:3px}
  .nav-spacer{display:none}
  .chip{font-size:11px; padding:5px 10px; gap:5px}
  .chip-btn{padding:6px 12px; font-size:12px}

  /* DASHBOARD: stack everything */
  .dash-grid{grid-template-columns:1fr !important; gap:20px}
  .dash-right{order:3}
  .ring-wrap{order:2}
  /* Force the cohort dashboard agents row to stack on mobile (override inline style) */
  .agents-row{grid-template-columns:repeat(2,1fr) !important; gap:6px}
  .ag{padding:10px 6px}
  .ag-name{font-size:.85rem}
  .ag-role{font-size:9px}
  .ag-stat{font-size:8px}

  /* Stats grid in cohort dash */
  .stat-row{grid-template-columns:repeat(2,1fr) !important}

  /* Cohort layout: sidebar moves below main on mobile */
  .layout{grid-template-columns:1fr; padding:12px; gap:14px}
  .sidebar{position:static; max-height:none; padding:14px 12px}

  /* Today greeting stacks */
  .today-greeting{grid-template-columns:1fr; padding:22px; text-align:left}
  .today-vaulty{display:none}
  .tg-name{font-size:clamp(1.6rem,7vw,2.2rem)}

  /* Stat cards full width 2 wide */
  .today-stats{grid-template-columns:repeat(2,1fr); gap:10px}
  .tstat-card{padding:16px 14px}
  .tstat-num{font-size:1.8rem}

  /* Today body single column */
  .today-body{grid-template-columns:1fr; gap:14px}

  /* Vault + help bodies single column */
  .vault-body, .help-body{grid-template-columns:1fr; gap:14px}
  .faq-section{position:static}

  /* Hero pads */
  .hero{padding:22px 18px}

  /* Mode wrapper */
  .mode-full-width{padding:18px 14px 40px}
}

@media(max-width:560px){
  /* Tighten further on phones */
  .nav-inner{padding:8px 10px; gap:6px}
  .chip{font-size:10px; padding:4px 8px}
  .chip-btn{padding:5px 10px; font-size:11px}
  .brand-name{font-size:13px}
  .vaulty-nav-slot{width:24px; height:24px}
  .vaulty-nav-slot svg{width:24px; height:24px}

  /* Streak chip hides label text, just keeps the number */
  .chip[title*="Morning Brief"]{display:none}

  /* Stat row collapses to 1 col */
  .today-stats{grid-template-columns:1fr}
  .stat-row{grid-template-columns:1fr !important}
  .agents-row{grid-template-columns:1fr !important}

  /* Dashboard ring smaller */
  .ring{width:140px; height:140px}
  .ring-num{font-size:2.4rem}

  /* Checkpoint card tighter */
  .ck-head{padding:12px 14px; gap:10px}
  .ck-num{width:32px; height:32px; font-size:13px}
  .ck-title{font-size:.95rem}
  .ck-sub{font-size:11px}
  .ck-tag{font-size:9px; padding:3px 7px}
  .ck-content{padding:6px 14px 18px}

  /* Cards/kcards stack */
  .kcards{grid-template-columns:1fr; gap:8px}
  .depth-grid{grid-template-columns:1fr}

  /* Compare blocks stack */
  .compare{grid-template-columns:1fr}

  /* Agents page */
  .agents-grid{grid-template-columns:1fr}
  .agent-card{padding:20px}

  /* Vault link cards */
  .vault-links-grid{grid-template-columns:1fr}

  /* Glossary cards */
  .glossary-grid{grid-template-columns:1fr}

  /* Help body */
  .help-body{gap:12px}

  /* Timeline mini list */
  .tline-row{grid-template-columns:60px 1fr; gap:10px; font-size:.82rem}
  .tline-time{font-size:10px}

  /* Setup walkthroughs */
  .setup-step{grid-template-columns:24px 1fr; gap:10px; padding:8px 0}
  .setup-step-num{width:22px; height:22px; font-size:.75rem}
  .setup-step-text{font-size:.86rem; line-height:1.5}

  /* Synth wizard tighter */
  .synth-head{padding:14px 16px}
  .synth-body{padding:16px}
  .synth-title{font-size:1.35rem}
  .synth-step-title{font-size:1rem}
  .synth-area{min-height:100px; padding:12px 14px; font-size:.88rem}
  .synth-actions{flex-wrap:wrap; gap:8px}
  .synth-actions .left{font-size:10px; flex-basis:100%}

  /* Routine items wrap */
  .routine-items{padding:12px 16px 14px}
  .ri{padding:10px 12px; gap:10px}
  .ri-text{font-size:.85rem}

  /* Prompt cards */
  .pc-head{padding:11px 14px; gap:8px}
  .pc-name{font-size:.88rem}
  .pc-when{font-size:10px}
  .pc-copy{font-size:10px; padding:5px 10px}
  .pc-body{padding:12px 14px; font-size:.72rem}

  /* Mission, callouts */
  .mission{padding:16px 18px}
  .mission p{font-size:.94rem}
  .cal{padding:12px 14px}
  .cal-l{font-size:9px}

  /* Where-to-paste callout */
  .where-paste{padding:10px 12px; gap:10px}
  .where-ico{width:28px; height:28px; font-size:.9rem}
  .where-text{font-size:.78rem}

  /* Skool template */
  .skool{padding:12px 14px; font-size:.82rem}

  /* Cal-row (weekly rhythms) */
  .cal-row{grid-template-columns:1fr; gap:4px; padding:8px 0}
  .cal-day{font-size:.78rem; color:var(--p2)}

  /* Modal */
  .modal{padding:24px 22px}
  .modal h2{font-size:1.5rem}

  /* Hero on small */
  .hero{padding:18px 16px}
  .week-tag{font-size:9px; padding:4px 10px}

  /* Toast position */
  .toast{right:16px; bottom:16px; left:16px; max-width:none}
}

/* Prevent any element from exceeding viewport width */
.app,.hero,.ck,.synth,.routine-card,.echo-card,.agent-card,.vlink-card,.gcard,.prompt-card,.modal{max-width:100%}
img,svg,pre{max-width:100%}
pre,.pc-body,.synth-area,.notes-area{word-break:break-word; overflow-wrap:anywhere}

/* Prevent horizontal scroll caused by long URLs */
.agent-url-input,.vlink-url-input,.tl-input,input[type="url"]{min-width:0}

.glossary-search-wrap{position:relative; margin-bottom:20px}
.glossary-search{width:100%; background:var(--surface-2); border:1px solid var(--line-warm); border-radius:var(--r-pill); padding:13px 20px 13px 44px; color:var(--ink); font:inherit; font-size:.95rem; outline:none; transition:.2s}
.glossary-search:focus{border-color:var(--p1); box-shadow:0 0 0 3px rgba(124,58,237,.1)}
.glossary-search::placeholder{color:var(--ink-dim)}
.gs-icon{position:absolute; left:16px; top:50%; transform:translateY(-50%); color:var(--ink-mute); pointer-events:none; font-size:16px}
.glossary-count{font-size:11px; color:var(--ink-mute); margin-bottom:12px}
.glossary-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:12px}
@media(max-width:700px){.glossary-grid{grid-template-columns:1fr}}
.gcard{background:#ffffff; border:1px solid var(--line-warm); border-radius:var(--r-lg); overflow:hidden; cursor:pointer; transition:.25s var(--ease); box-shadow:var(--shadow-card)}
.gcard:hover{border-color:rgba(124,58,237,.3); transform:translateY(-2px); box-shadow:var(--shadow-lift)}
.gcard.open{border-color:var(--p1); box-shadow:var(--shadow-lift)}
.gcard-head{padding:16px 18px; display:flex; align-items:flex-start; justify-content:space-between; gap:12px}
.gcard-term{font-weight:800; color:var(--ink); font-size:.95rem; letter-spacing:-.01em}
.gcard-def{font-size:.82rem; color:var(--ink-soft); margin-top:3px; line-height:1.5}
.gcard-arrow{color:var(--ink-mute); font-size:14px; transition:transform .3s; flex-shrink:0; margin-top:2px}
.gcard.open .gcard-arrow{transform:rotate(180deg); color:var(--p2)}
.gcard-body{max-height:0; overflow:hidden; transition:max-height .45s var(--ease)}
.gcard.open .gcard-body{max-height:600px}
.gcard-content{padding:0 18px 18px; border-top:1px solid var(--line-warm); padding-top:14px; color:var(--ink-soft); font-size:.85rem; line-height:1.65}
.gcard-content > * + *{margin-top:10px}
.gc-analogy{background:rgba(37,99,235,.06); border:1px solid rgba(37,99,235,.15); border-left:3px solid var(--p3); border-radius:8px; padding:10px 14px; font-style:italic; color:var(--ink-soft)}
.gc-analogy b{color:var(--p3); font-style:normal; font-weight:700; font-size:9px; letter-spacing:.15em; text-transform:uppercase; display:block; margin-bottom:4px}
.gc-when{font-size:.8rem; color:var(--ink-mute)}
.gc-when b{color:var(--ink-soft); font-weight:600}
.gc-power{background:rgba(184,137,58,.08); border:1px solid rgba(184,137,58,.2); border-radius:6px; padding:6px 10px; font-size:.78rem; color:var(--gold); display:inline-flex; align-items:center; gap:6px}
.gc-power::before{content:'⚡'; font-size:11px}
.gcard-hidden{display:none}
.faq-section{background:#ffffff; border:1px solid var(--line-warm); border-radius:var(--r-xl); overflow:hidden; position:sticky; top:90px; box-shadow:var(--shadow-card)}
.faq-head{padding:18px 22px; border-bottom:1px solid var(--line-warm)}
.faq-head-title{font-weight:700; color:var(--ink); font-size:.95rem}
.faq-head-sub{font-size:.82rem; color:var(--ink-mute); margin-top:2px}
.faq-list{padding:8px 0}
.faq-item{border-bottom:1px solid var(--line-soft)}
.faq-item:last-child{border:none}
.faq-q{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 22px; cursor:pointer; user-select:none; font-weight:600; font-size:.88rem; color:var(--ink-soft); transition:color .2s}
.faq-q:hover{color:var(--ink)}
.faq-q.open{color:var(--p1)}
.faq-chevron{color:var(--ink-mute); font-size:12px; transition:transform .25s; flex-shrink:0}
.faq-q.open .faq-chevron{transform:rotate(180deg); color:var(--p2)}
.faq-a{max-height:0; overflow:hidden; transition:max-height .4s var(--ease)}
.faq-item.open .faq-a{max-height:400px}
.faq-a-content{padding:0 22px 16px; font-size:.85rem; color:var(--ink-soft); line-height:1.7}
.faq-a-content a{color:var(--p1)}
@media(max-width:1024px){.faq-section{position:static}}

/* ---- SYNC STATUS ---- */
.sync-chip{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:600;letter-spacing:.04em;cursor:pointer;padding:5px 10px;border-radius:var(--r-pill);border:1px solid var(--line);background:var(--surface);transition:background .2s,border-color .2s;white-space:nowrap;max-width:160px}
.sync-chip:hover{background:var(--surface-2)}
.sync-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.sync-idle .sync-dot,.sync-auth .sync-dot{background:var(--ink-dim)}
.sync-pending .sync-dot{background:var(--amber);animation:sync-pulse 1s ease-in-out infinite}
.sync-synced .sync-dot{background:var(--green)}
.sync-error .sync-dot{background:var(--red)}
.sync-offline .sync-dot{background:var(--ink-dim)}
@keyframes sync-pulse{0%,100%{opacity:.4}50%{opacity:1}}
.sync-label{color:var(--ink-mute);overflow:hidden;text-overflow:ellipsis}
.sync-synced .sync-label{color:var(--green)}
.sync-error .sync-label{color:var(--red)}
.sync-auth .sync-label{color:var(--amber)}

/* ---- BACKUP MODAL ---- */
.backup-modal-bg{position:fixed;inset:0;background:rgba(20,18,16,.65);z-index:1100;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .25s}
.backup-modal-bg.open{opacity:1;pointer-events:all}
.backup-modal{background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--r-xl);padding:36px 40px;max-width:420px;width:92%;box-shadow:var(--shadow-lift)}
.backup-modal h2{font-family:var(--display);font-size:1.6rem;font-weight:800;color:var(--ink);margin:0 0 10px}
.backup-modal p{font-size:.9rem;color:var(--ink-soft);line-height:1.6;margin:0 0 20px}
.backup-email-input{width:100%;padding:12px 16px;background:var(--bg-1);border:1px solid var(--line-strong);border-radius:var(--r-md);font-size:.95rem;color:var(--ink);box-sizing:border-box;margin-bottom:14px}
.backup-email-input:focus{outline:none;border-color:var(--amber)}
.backup-modal-row{display:flex;gap:10px;flex-wrap:wrap}
.backup-divider{border:none;border-top:1px solid var(--line);margin:20px 0}
.backup-export-row{display:flex;gap:10px}
.backup-modal-close{position:absolute;top:16px;right:20px;background:none;border:none;color:var(--ink-mute);font-size:1.2rem;cursor:pointer;padding:4px 8px}

/* ---- EXPORT IMPORT ---- */
.export-import-bar{display:flex;gap:8px;margin-top:8px}

/* ---- BV FLOW DIAGRAM ---- */
.bv-flow{display:flex;flex-wrap:wrap;align-items:stretch;gap:6px;margin:14px 0}
.bv-flow-node{flex:1;min-width:120px;background:var(--surface-2);border:1px solid var(--line-warm);border-radius:var(--r-md);padding:10px 14px;text-align:center}
.bv-flow-node-icon{font-size:1.4rem;display:block;margin-bottom:4px}
.bv-flow-node-name{font-weight:700;font-size:.88rem;color:var(--ink);display:block}
.bv-flow-node-role{font-size:.78rem;color:var(--ink-soft);display:block;margin-top:2px}
.bv-flow-sep{display:flex;align-items:center;color:var(--ink-mute);font-size:1rem;padding:0 2px;flex-shrink:0}
.bv-flow-return{margin-top:8px;padding:8px 14px;background:rgba(22,163,74,.06);border:1px solid rgba(22,163,74,.18);border-radius:var(--r-md);color:var(--ink-soft);font-size:.85rem;text-align:center;width:100%}
@media(max-width:560px){.bv-flow-sep{display:none}.bv-flow-node{min-width:calc(50% - 6px)}}

/* ============================================================
   PHASE 1 — VISUAL FOUNDATION PASS
   Additive overrides only. No class renames. No layout changes.
   ============================================================ */

/* 3a — Inset top highlight on white card surfaces */
.kcard{box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.85)}
.setup{box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.85)}
.pp-section{box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.85)}
.tstat-card{box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.85)}
.today-greeting{box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.85)}
.routine-card{box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.85)}
.side-card{box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.85)}
.vault-side-card{box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.85)}
.faq-section{box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.85)}
.page-intro{box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.85)}
.rag-card{box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.85)}
.ppath-card{box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.85)}
.mm-figure{box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.85)}
.vault-arch-card{box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.85)}
.lib-card.open{box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.85)}
.ck{box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.85)}

/* 3b — Interactive cards: transition + hover depth */
.tool-card{
  box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.85);
  transition:border-color .22s var(--ease-out-premium),box-shadow .22s var(--ease-out-premium),transform .22s var(--ease-out-premium);
}
.tool-card:hover{box-shadow:var(--shadow-card-hover),inset 0 1px 0 rgba(255,255,255,0.6)}

.agent-card{
  box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.85);
  transition:border-color .28s var(--ease-out-premium),box-shadow .28s var(--ease-out-premium),transform .28s var(--ease-out-premium);
}
.agent-card:hover{box-shadow:var(--shadow-lift),inset 0 1px 0 rgba(255,255,255,0.6)}

.vlink-card{
  box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.85);
  transition:border-color .22s var(--ease-out-premium),box-shadow .22s var(--ease-out-premium),transform .22s var(--ease-out-premium);
}
.vlink-card:hover{box-shadow:var(--shadow-card-hover),inset 0 1px 0 rgba(255,255,255,0.6)}

.gcard{
  box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,0.85);
  transition:border-color .25s var(--ease-out-premium),box-shadow .25s var(--ease-out-premium),transform .25s var(--ease-out-premium);
}
.gcard:hover,.gcard.open{box-shadow:var(--shadow-card-hover),inset 0 1px 0 rgba(255,255,255,0.6)}

.tstat-card{transition:.3s var(--ease-out-premium)}
.tstat-card:hover{box-shadow:var(--shadow-lift),inset 0 1px 0 rgba(255,255,255,0.6)}

/* 5 — Step accordion polish */
.ck{transition:border-color .35s var(--ease-out-premium),box-shadow .35s var(--ease-out-premium)}
.ck.current{box-shadow:var(--shadow-lift),inset 0 1px 0 rgba(255,255,255,0.7)}
.ck.open{box-shadow:var(--shadow-card-hover),inset 0 1px 0 rgba(255,255,255,0.7)}
.ck.current.open{box-shadow:var(--shadow-lift),inset 0 1px 0 rgba(255,255,255,0.7)}
.ck-body{transition:max-height .55s var(--ease-out-premium)}

/* 4 — Button and CTA motion */
.btn{
  transition:color .2s var(--ease-out-premium),background .2s var(--ease-out-premium),
             box-shadow .2s var(--ease-out-premium),border-color .2s var(--ease-out-premium),
             transform .15s var(--ease-out-premium);
}
.btn:active{transform:scale(0.98)}
.btn:focus-visible{outline:2px solid var(--p1);outline-offset:3px;border-radius:var(--r-pill)}
.btn-p:hover{transform:translateY(-2px)}
.btn-p:active{transform:scale(0.98) translateY(0)}
.btn-g{
  transition:color .2s var(--ease-out-premium),background .2s var(--ease-out-premium),
             box-shadow .2s var(--ease-out-premium),border-color .2s var(--ease-out-premium),
             transform .15s var(--ease-out-premium);
}
.btn-g:active{transform:scale(0.98)}
.btn-g:focus-visible{outline:2px solid var(--p1);outline-offset:3px}
.mtab{
  transition:color .18s var(--ease-out-premium),background .18s var(--ease-out-premium),
             box-shadow .18s var(--ease-out-premium),transform .15s var(--ease-out-premium);
}
.mtab:active{transform:scale(0.98)}
.mtab:focus-visible{outline:2px solid var(--p1);outline-offset:2px;border-radius:10px}

/* Reduced motion — all transitions and transforms off */
@media(prefers-reduced-motion:reduce){
  .btn,.btn-p,.btn-g,.mtab,
  .tool-card,.agent-card,.vlink-card,.gcard,.tstat-card,
  .ck,[data-mode-section]{
    transition:none!important;
    transform:none!important;
    animation:none!important;
  }
  .ck-body{transition:none!important}
}

/* ============================================================
   PHASE 2 — FLOATING GLASS NAV: mobile reset
   At ≤900px the nav returns to full-width sticky (2-row layout).
   ============================================================ */
@media(max-width:900px){
  .nav{
    margin:0;
    border-radius:0;
    top:0;
    border:none;
    border-bottom:1px solid var(--line-warm);
    box-shadow:none;
    background:rgba(247,244,240,0.92);
  }
}

/* ============================================================
   PHASE 3 — ENTRY MOTION SYSTEM
   Reveal animation for content blocks entering the viewport.
   Controlled by js/motion.js via IntersectionObserver.
   ============================================================ */
.bv-reveal{
  opacity:0;
  transform:translateY(16px);
  filter:blur(8px);
  transition:
    opacity .72s var(--ease-out-premium),
    transform .72s var(--ease-out-premium),
    filter .72s var(--ease-out-premium);
  will-change:opacity,transform,filter;
}
.bv-reveal.is-visible{
  opacity:1;
  transform:translateY(0);
  filter:blur(0);
}
.bv-reveal[data-bv-delay="1"]{transition-delay:50ms}
.bv-reveal[data-bv-delay="2"]{transition-delay:100ms}
.bv-reveal[data-bv-delay="3"]{transition-delay:150ms}
.bv-reveal[data-bv-delay="4"]{transition-delay:200ms}

@media(prefers-reduced-motion:reduce){
  .bv-reveal{
    opacity:1!important;
    transform:none!important;
    filter:none!important;
    transition:none!important;
  }
}

/* ============================================================
   PHASE 4 — POWER SECTION HEADERS
   Structured curriculum dividers for the Power Advanced Track.
   .pp-section-title scoped under .pp-section-heading to avoid
   conflicting with the existing module card title rule (line 1202).
   ============================================================ */
.pp-section-heading{
  margin:34px 0 14px;
  padding:16px 18px;
  border:1px solid var(--line-warm);
  border-radius:var(--r-lg);
  background:linear-gradient(135deg,rgba(255,255,255,.82),rgba(248,246,243,.72));
  box-shadow:var(--shadow-card);
}
.pp-section-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:.68rem;
  text-transform:uppercase;
  letter-spacing:.18em;
  color:var(--p1);
  font-weight:800;
  margin-bottom:6px;
}
.pp-section-heading .pp-section-title{
  font-size:1.05rem;
  font-weight:900;
  color:var(--ink);
  margin:0;
}
.pp-section-desc{
  margin:4px 0 0;
  color:var(--ink-soft);
  font-size:.9rem;
  line-height:1.5;
}
@media(max-width:560px){
  .pp-section-heading{
    margin:26px 0 12px;
    padding:14px;
  }
}

/* ============================================================
   PHASE 5 — EDITORIAL HIERARCHY: COHORT WEEK PAGES
   Week eyebrow, build-output pill, step output label.
   ============================================================ */
.week-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin-bottom:8px;
  padding:5px 9px;
  border-radius:999px;
  background:rgba(124,58,237,.08);
  border:1px solid rgba(124,58,237,.16);
  color:var(--p1);
  font-size:.68rem;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.18em;
}
.week-output-pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-top:10px;
  padding:8px 11px;
  border-radius:999px;
  background:rgba(22,163,74,.07);
  border:1px solid rgba(22,163,74,.18);
  color:var(--ink-soft);
  font-size:.82rem;
  font-weight:700;
}
.week-output-pill b{
  color:var(--ink);
}
.step-output{
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin-top:8px;
  padding:5px 8px;
  border-radius:999px;
  background:rgba(37,99,235,.07);
  border:1px solid rgba(37,99,235,.14);
  color:var(--ink-soft);
  font-size:.74rem;
  font-weight:700;
}
@media(max-width:560px){
  .week-output-pill{
    border-radius:14px;
    align-items:flex-start;
  }
}


/* PHASE 7 — MODE HERO POLISH */
.pi-eyebrow{display:inline-flex;align-items:center;gap:6px;margin-bottom:8px;padding:5px 9px;border-radius:999px;background:rgba(124,58,237,.07);border:1px solid rgba(124,58,237,.15);color:var(--p1);font-size:.68rem;font-weight:900;text-transform:uppercase;letter-spacing:.18em;}
.pi-purpose{display:inline-flex;align-items:center;gap:6px;margin-top:8px;padding:5px 9px;border-radius:999px;background:rgba(20,184,166,.07);border:1px solid rgba(20,184,166,.18);color:var(--ink-soft);font-size:.78rem;font-weight:700;}
@media(max-width:560px){.pi-purpose{border-radius:14px;align-items:flex-start;}}

/* ============================================================
   PHASE 9 — COHORT COCKPIT REDESIGN
   Week hero becomes a mission cockpit. Steps become checkpoints.
   Sidebar becomes a mission map.
   ============================================================ */

/* --- Week Cockpit Shell --- */
.week-cockpit{
  position:relative;
  margin-bottom:24px;
  padding:26px 26px 20px;
  border-radius:var(--r-lg);
  background:linear-gradient(135deg,rgba(124,58,237,.10),rgba(37,99,235,.07),rgba(255,255,255,.88));
  border:1px solid rgba(124,58,237,.13);
  box-shadow:0 2px 20px rgba(124,58,237,.09),0 1px 4px rgba(0,0,0,.05);
  border-top:3px solid var(--p1);
  overflow:hidden;
}
.week-cockpit::before{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(255,255,255,.55) 0%,transparent 55%);
  pointer-events:none;
}

/* --- Cockpit Top Row --- */
.week-cockpit-top{
  display:flex;
  align-items:flex-start;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:16px;
}
.week-cockpit-top .week-eyebrow{
  margin-bottom:0;
}
.wck-done-chip{
  margin-left:auto;
  padding:4px 10px;
  border-radius:999px;
  background:rgba(37,99,235,.08);
  border:1px solid rgba(37,99,235,.18);
  color:var(--ink-soft);
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.04em;
}

/* --- Cockpit Grid --- */
.week-cockpit-grid{
  display:grid;
  grid-template-columns:1fr 210px;
  gap:22px;
  align-items:start;
  margin-bottom:18px;
}
.week-cockpit-main{
  min-width:0;
}
.week-cockpit-title{
  font-size:clamp(1.45rem,2.8vw,1.95rem);
  font-weight:900;
  color:var(--ink);
  line-height:1.15;
  margin:0 0 10px;
  letter-spacing:-.025em;
}

/* --- Aside: Stats + Rail --- */
.week-cockpit-aside{
  padding-top:2px;
}
.week-cockpit-stats{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
  margin-bottom:10px;
}
.wck-stat{
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:7px 4px;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(124,58,237,.10);
  border-radius:8px;
  text-align:center;
}
.wck-stat-n{
  font-size:1.05rem;
  font-weight:900;
  color:var(--p1);
  line-height:1.1;
}
.wck-stat-l{
  font-size:.58rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.07em;
  color:var(--ink-soft);
  margin-top:2px;
}

/* --- Progress Rail --- */
.week-progress-rail{
  display:flex;
  gap:4px;
}
.wpr-seg{
  flex:1;
  height:7px;
  border-radius:4px;
  background:rgba(0,0,0,.09);
  cursor:pointer;
  transition:background .25s var(--ease-out-premium),transform .15s;
}
.wpr-seg:hover{
  transform:scaleY(1.5);
  background:rgba(124,58,237,.2);
}
.wpr-seg.done{
  background:linear-gradient(90deg,var(--p1),rgba(37,99,235,.75));
}
.wpr-seg.current{
  background:rgba(37,99,235,.48);
  box-shadow:0 0 7px rgba(37,99,235,.32);
}

/* --- Mission Steps --- */
.mission-step{
  position:relative;
  transition:box-shadow .3s var(--ease-out-premium);
}
.mission-step [data-mount]{
  position:relative;
}
.mission-step-rail{
  position:absolute;
  top:0;
  left:0;
  width:3px;
  height:100%;
  background:transparent;
  border-radius:2px 0 0 2px;
  transition:background .3s var(--ease-out-premium);
  z-index:1;
}
.mission-step.done .mission-step-rail{
  background:#16a34a;
}
.mission-step.open .mission-step-rail,
.mission-step.current .mission-step-rail{
  background:var(--p1);
}
.mission-step.open{
  box-shadow:0 4px 26px rgba(124,58,237,.13),0 1px 4px rgba(0,0,0,.06);
}
.mission-step.done .ck-head{
  opacity:.8;
}

/* --- Step Index Badge --- */
.mission-step-index{
  flex-shrink:0;
  width:32px!important;
  height:32px!important;
  min-width:32px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:.78rem;
  font-weight:900;
  background:rgba(124,58,237,.07);
  border:1.5px solid rgba(124,58,237,.18);
  color:var(--p1);
  transition:background .25s,border-color .25s,color .25s;
}
.mission-step.done .mission-step-index{
  background:rgba(22,163,74,.10);
  border-color:rgba(22,163,74,.3);
  color:#16a34a;
}
.mission-step.open .mission-step-index,
.mission-step.current .mission-step-index{
  background:var(--p1);
  border-color:var(--p1);
  color:#fff;
}

/* --- Sidebar Mission Map --- */
.week-map-item{
  position:relative;
  transition:background .2s,border-left-color .2s,box-shadow .2s;
}
.week-map-item.active{
  background:linear-gradient(90deg,rgba(124,58,237,.08),rgba(37,99,235,.03)) !important;
  border-left:3px solid var(--p1) !important;
  box-shadow:inset 0 0 0 0 transparent,0 1px 6px rgba(124,58,237,.08);
}
.week-map-item.done::after{
  content:'';
  position:absolute;
  right:10px;
  top:50%;
  transform:translateY(-50%);
  width:6px;
  height:6px;
  border-radius:50%;
  background:#16a34a;
}
.week-map-item:not(.active):not(.done){
  opacity:.68;
}
.week-map-item:not(.active):not(.done):hover{
  opacity:1;
}

/* --- Mobile --- */
@media(max-width:640px){
  .week-cockpit{
    padding:16px 14px 14px;
  }
  .week-cockpit-grid{
    grid-template-columns:1fr;
    gap:14px;
  }
  .week-cockpit-aside{
    padding-top:0;
  }
  .week-cockpit-stats{
    grid-template-columns:repeat(4,1fr);
    gap:4px;
  }
  .week-cockpit-title{
    font-size:1.35rem;
  }
  .wck-done-chip{
    margin-left:0;
  }
}
@media(max-width:400px){
  .week-cockpit-stats{
    grid-template-columns:1fr 1fr;
  }
}

/* ============================================================
   SESSION RECAPS — per-week panel, Replays library, search, viewer
   ============================================================ */
.recap-panel{background:var(--surface); border:1px solid var(--line-warm); border-radius:var(--r-lg); padding:20px 22px; margin:18px 0 22px; box-shadow:var(--glow-soft)}
.recap-panel-head{display:flex; align-items:flex-start; gap:12px; margin-bottom:4px}
.recap-panel-ico{font-size:22px; line-height:1.2}
.recap-panel-title{font-family:var(--display); font-weight:700; font-size:15px; letter-spacing:-0.01em}
.recap-panel-sub{font-size:13px; color:var(--ink-mute); line-height:1.5}
.recap-cards{display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:14px; margin-top:14px}
.recap-card{background:var(--surface-2); border:1px solid var(--line-soft); border-radius:var(--r-md); padding:16px 16px 14px; display:flex; flex-direction:column; gap:10px; transition:box-shadow .2s var(--ease), transform .2s var(--ease)}
.recap-card:hover{box-shadow:var(--shadow-card-hover); transform:translateY(-1px)}
.recap-card.viewed{border-color:rgba(22,163,74,.35)}
.recap-card.coming{opacity:.65; border-style:dashed}
.recap-card-top{display:flex; align-items:center; gap:10px}
.recap-badge{font-size:10.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; padding:4px 10px; border-radius:var(--r-pill); background:rgba(124,58,237,.10); color:var(--amber-deep)}
.recap-badge.bonus{background:rgba(234,88,12,.12); color:var(--ember)}
.recap-date{font-size:12px; color:var(--ink-dim); margin-left:auto}
.recap-card-title{font-family:var(--display); font-weight:600; font-size:15px; line-height:1.35; letter-spacing:-0.01em}
.recap-card-title.muted{color:var(--ink-mute); font-weight:500; font-size:14px}
.recap-bar{height:6px; background:var(--bg-2); border-radius:var(--r-pill); overflow:hidden}
.recap-bar-fill{height:100%; background:linear-gradient(90deg,var(--amber),var(--amber-2)); border-radius:var(--r-pill); transition:width .3s var(--ease)}
.recap-card.viewed .recap-bar-fill{background:var(--sage)}
.recap-card-foot{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:2px}
.recap-xp{font-size:12px; font-weight:600; color:var(--amber-deep); background:rgba(124,58,237,.08); padding:4px 10px; border-radius:var(--r-pill); white-space:nowrap}
.recap-xp.earned{color:var(--sage); background:rgba(22,163,74,.10)}
.recap-resume{font-size:12px; color:var(--ink-mute)}
.recap-card-btns{display:flex; gap:8px; margin-left:auto}
.recap-card-btns .btn{padding:8px 14px; font-size:12.5px}

/* Replays library page */
.recaps-page{max-width:1080px; margin:0 auto; padding:26px 20px 80px}
.recaps-hero{margin-bottom:22px}
.recaps-hero-eyebrow{font-size:11px; font-weight:700; letter-spacing:.2em; color:var(--amber-deep); margin-bottom:8px}
.recaps-hero-title{font-family:var(--display); font-size:clamp(26px,4vw,38px); font-weight:700; letter-spacing:-0.02em; line-height:1.1; margin-bottom:8px}
.recaps-hero-sub{color:var(--ink-mute); font-size:15px; max-width:640px; line-height:1.55}
.recaps-hero-stats{margin-top:12px; font-size:13px; color:var(--ink-soft)}
.rc-week-group{margin-bottom:22px}
.rc-week-label{font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-mute); margin-bottom:10px}

/* Search */
.rc-search-wrap{margin:6px 0 26px}
.rc-search-box{display:flex; align-items:center; gap:10px; background:var(--surface); border:1px solid var(--line-strong); border-radius:var(--r-pill); padding:12px 18px; box-shadow:var(--glow-soft); transition:border-color .15s}
.rc-search-box:focus-within{border-color:var(--amber)}
.rc-search-ico{font-size:15px; opacity:.7}
.rc-search-input{flex:1; border:none; outline:none; background:transparent; font:inherit; font-size:15px; color:var(--ink)}
.rc-search-hint{font-size:12px; color:var(--ink-dim); margin:8px 4px 0}
.rc-results{margin-top:14px}
.rc-results mark{background:rgba(124,58,237,.18); color:inherit; border-radius:3px; padding:0 2px}
.rc-results-head{font-size:13.5px; color:var(--ink-soft); margin-bottom:12px; display:flex; align-items:center; gap:10px}
.rc-clear{border:none; background:transparent; color:var(--amber-deep); font-weight:600; font-size:12.5px; cursor:pointer; text-decoration:underline}
.rc-loading,.rc-empty{font-size:13.5px; color:var(--ink-mute); padding:14px 4px}
.rc-group{background:var(--surface); border:1px solid var(--line-warm); border-radius:var(--r-md); padding:14px 16px; margin-bottom:12px}
.rc-group-head{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:6px}
.rc-group-title{font-family:var(--display); font-weight:600; font-size:14.5px}
.rc-group-date{font-size:12px; color:var(--ink-dim)}
.rc-group-open{margin-left:auto; padding:6px 12px; font-size:12px}
.rc-hit{display:flex; align-items:flex-start; gap:12px; padding:10px 4px; border-top:1px solid var(--line-soft)}
.rc-ts{flex:0 0 auto; font-family:var(--mono); font-size:12.5px; font-weight:600; color:var(--amber-deep); background:rgba(124,58,237,.08); padding:5px 10px; border-radius:var(--r-pill); text-decoration:none; white-space:nowrap}
.rc-ts:hover{background:rgba(124,58,237,.16)}
.rc-hit-body{flex:1; min-width:0}
.rc-hit-title{font-weight:600; font-size:13.5px; line-height:1.4}
.rc-hit-snip{font-size:12.5px; color:var(--ink-mute); line-height:1.5; margin-top:2px}
.rc-hit-jump{flex:0 0 auto; border:1px solid var(--line-warm); background:transparent; color:var(--ink-mute); font-size:12px; font-weight:600; padding:5px 10px; border-radius:var(--r-pill); cursor:pointer}
.rc-hit-jump:hover{color:var(--amber-deep); border-color:var(--amber)}

/* Viewer modal */
.recap-modal-bg{position:fixed; inset:0; z-index:2000; background:rgba(20,18,16,.55); backdrop-filter:blur(6px); display:none; align-items:center; justify-content:center; padding:clamp(8px,2.5vw,32px)}
.recap-modal-bg.open{display:flex}
.recap-modal{width:min(1100px,100%); height:min(92vh,100%); background:var(--bg); border-radius:var(--r-lg); overflow:hidden; display:flex; flex-direction:column; box-shadow:var(--shadow-lift)}
.recap-modal-head{display:flex; align-items:center; gap:12px; padding:12px 16px; border-bottom:1px solid var(--line-warm); background:var(--surface); flex-wrap:wrap}
.recap-modal-info{display:flex; align-items:center; gap:10px; min-width:0; flex:1}
.recap-modal-title{font-family:var(--display); font-weight:600; font-size:14px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.recap-modal-acts{display:flex; align-items:center; gap:8px}
.recap-modal-acts .btn{padding:7px 12px; font-size:12px; text-decoration:none}
.recap-modal-close{border:none; background:var(--surface-2); width:32px; height:32px; border-radius:50%; font-size:14px; color:var(--ink-mute); cursor:pointer}
.recap-modal-close:hover{color:var(--ink); background:var(--bg-2)}
.recap-iframe{flex:1; width:100%; border:none; background:#fff}
@media(max-width:640px){
  .recap-card-btns{margin-left:0; width:100%}
  .recap-modal-bg{padding:0}
  .recap-modal{height:100%; border-radius:0}
  .rc-hit{flex-wrap:wrap}
}
