/* My Journey — visual refresh 2026-11-02 (DEC-030).
   Lively palette, gradient accents, bolder type, animated bars and checks.
   Class names unchanged from the previous stylesheet so the app logic is untouched. */

:root{
    --bg:#F4F7FB;
    --bg-blob-1:rgba(20,184,166,0.16);
    --bg-blob-2:rgba(249,112,102,0.14);
    --bg-blob-3:rgba(245,158,11,0.12);
    --surface:#FFFFFF;
    --surface-2:#EEF3F8;
    --border:#E2E8F0;
    --ink:#0F172A;
    --ink-muted:#5B6678;
    --accent:#0D9488;
    --accent-2:#22C55E;
    --accent-ink:#FFFFFF;
    --accent-soft:#D7F4EE;
    --indigo:#6366F1;
    --indigo-soft:#E8E9FD;
    --warn:#B45309;
    --warn-soft:#FEF3C7;
    --critical:#DC2626;
    --critical-soft:#FEE2E2;
    --coral:#F97066;
    --amber:#F59E0B;
    --grad-accent:linear-gradient(135deg,#0D9488 0%,#22C55E 100%);
    --grad-hero:linear-gradient(135deg,#0F766E 0%,#0D9488 48%,#34D399 100%);
    --grad-warm:linear-gradient(135deg,#F97066 0%,#F59E0B 100%);
    --grad-bar:linear-gradient(90deg,#0D9488,#22C55E);
    --shadow: 0 1px 2px rgba(15,23,42,0.04), 0 10px 30px -12px rgba(13,148,136,0.25);
    --shadow-lift: 0 2px 4px rgba(15,23,42,0.05), 0 18px 40px -14px rgba(13,148,136,0.35);
    --font-display: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    --font-mono: ui-monospace, 'SF Mono', 'Cascadia Mono', 'Roboto Mono', Menlo, Consolas, monospace;
    --radius:18px;
    --radius-sm:12px;
    --ease:cubic-bezier(.2,.8,.2,1);
    color-scheme: light;
  }
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      --bg:#0B1220; --bg-blob-1:rgba(45,212,191,0.14); --bg-blob-2:rgba(249,112,102,0.12); --bg-blob-3:rgba(245,158,11,0.10);
      --surface:#121B2E; --surface-2:#192540; --border:#243252;
      --ink:#E8ECF4; --ink-muted:#98A4B8;
      --accent:#2DD4BF; --accent-2:#4ADE80; --accent-ink:#052E2B; --accent-soft:#123D3A;
      --indigo:#A5B4FC; --indigo-soft:#232B4F;
      --warn:#FBBF24; --warn-soft:#3B2E10;
      --critical:#F87171; --critical-soft:#3F1D1D;
      --grad-hero:linear-gradient(135deg,#0F766E 0%,#14B8A6 55%,#4ADE80 100%);
      --shadow: 0 1px 2px rgba(0,0,0,0.35), 0 14px 36px -14px rgba(0,0,0,0.6);
      --shadow-lift: 0 2px 6px rgba(0,0,0,0.4), 0 22px 48px -16px rgba(0,0,0,0.7);
      color-scheme: dark;
    }
  }
  :root[data-theme="dark"]{
    --bg:#0B1220; --bg-blob-1:rgba(45,212,191,0.14); --bg-blob-2:rgba(249,112,102,0.12); --bg-blob-3:rgba(245,158,11,0.10);
    --surface:#121B2E; --surface-2:#192540; --border:#243252;
    --ink:#E8ECF4; --ink-muted:#98A4B8;
    --accent:#2DD4BF; --accent-2:#4ADE80; --accent-ink:#052E2B; --accent-soft:#123D3A;
    --indigo:#A5B4FC; --indigo-soft:#232B4F;
    --warn:#FBBF24; --warn-soft:#3B2E10;
    --critical:#F87171; --critical-soft:#3F1D1D;
    --grad-hero:linear-gradient(135deg,#0F766E 0%,#14B8A6 55%,#4ADE80 100%);
    --shadow: 0 1px 2px rgba(0,0,0,0.35), 0 14px 36px -14px rgba(0,0,0,0.6);
    --shadow-lift: 0 2px 6px rgba(0,0,0,0.4), 0 22px 48px -16px rgba(0,0,0,0.7);
    color-scheme: dark;
  }

  *{box-sizing:border-box;}
  [hidden]{ display:none !important; }
  html,body{margin:0;padding:0;}
  html{ touch-action:manipulation; }
  body{
    background:var(--bg); color:var(--ink);
    font-family:var(--font-sans);
    -webkit-font-smoothing:antialiased;
    min-height:100vh;
    overflow-x:hidden;
    position:relative;
  }
  /* soft colour blobs behind everything */
  body::before{
    content:""; position:fixed; inset:-20% -10% auto -10%; height:70vh; z-index:-1; pointer-events:none;
    background:
      radial-gradient(42% 60% at 12% 10%, var(--bg-blob-1), transparent 70%),
      radial-gradient(36% 50% at 88% 0%, var(--bg-blob-2), transparent 70%),
      radial-gradient(30% 45% at 60% 30%, var(--bg-blob-3), transparent 70%);
    filter:blur(10px);
  }
  h1,h2,h3{text-wrap:balance; margin:0;}
  button{font-family:inherit;}
  input,select,textarea{font-family:inherit; color:inherit;}
  ::selection{background:var(--accent-soft);}
  .tabular{font-variant-numeric:tabular-nums;}

  .app{
    display:grid;
    grid-template-columns: 232px 1fr;
    min-height:100vh;
  }
  /* Phones get the docked bottom bar; tablets (iPad portrait and up) and desktops get the sidebar. */
  @media (max-width: 739px){
    .app{ grid-template-columns: 1fr; padding-bottom:calc(78px + env(safe-area-inset-bottom)); }
    .sidebar{ display:none !important; }
    .tabbar{ display:flex !important; }
  }
  @media (min-width: 740px) and (max-width: 1023px){
    .app{ grid-template-columns: 200px 1fr; }
    .sidebar{ padding:20px 12px; }
    .main{ padding:20px 20px 60px; }
    .side-status .row{ flex-wrap:wrap; }
    .side-status .btn{ white-space:nowrap; padding:7px 10px; }
  }

  /* ---------- sidebar ---------- */
  .sidebar{
    border-right:1px solid var(--border);
    padding:24px 16px;
    display:flex; flex-direction:column; gap:22px;
    position:sticky; top:0; height:100vh;
    background:color-mix(in srgb, var(--surface) 70%, transparent);
    backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  }
  .brand{ display:flex; flex-direction:column; gap:3px; }
  .brand-mark{
    font-family:var(--font-display); font-size:24px; font-weight:800; letter-spacing:-0.02em;
    background:var(--grad-accent); -webkit-background-clip:text; background-clip:text; color:transparent;
  }
  .brand-sub{ font-size:11px; text-transform:uppercase; letter-spacing:0.14em; color:var(--ink-muted); font-weight:700; }
  .nav{ display:flex; flex-direction:column; gap:4px; margin-top:6px; }
  .nav-btn{
    display:flex; align-items:center; gap:11px;
    padding:11px 12px; border-radius:12px;
    border:1px solid transparent; background:transparent;
    color:var(--ink-muted); font-size:14px; font-weight:700;
    cursor:pointer; text-align:left;
    transition:background .18s var(--ease), color .18s var(--ease), transform .18s var(--ease);
  }
  .nav-btn svg{ width:18px; height:18px; flex:none; transition:transform .25s var(--ease); }
  .nav-btn:hover{ background:var(--surface-2); color:var(--ink); }
  .nav-btn:hover svg{ transform:translateY(-1px) scale(1.08); }
  .nav-btn.active{ background:var(--grad-accent); color:var(--accent-ink); box-shadow:0 8px 20px -10px rgba(13,148,136,0.7); }
  .side-status{
    margin-top:auto; padding-top:16px; border-top:1px solid var(--border);
    display:flex; flex-direction:column; gap:10px;
  }
  .day-badge{ display:flex; align-items:baseline; gap:6px; }
  .day-badge .num{ font-family:var(--font-display); font-size:32px; font-weight:800; letter-spacing:-0.03em; color:var(--accent); }
  .day-badge .of{ font-size:12px; color:var(--ink-muted); font-weight:600; }
  .streak-chip{ display:inline-flex; align-items:center; gap:6px; font-size:12px; color:var(--ink-muted); width:fit-content; }
  .streak-chip b{ color:var(--ink); font-variant-numeric:tabular-nums; }

  /* ---------- mobile tab bar ---------- */
  .tabbar{
    display:none; position:fixed; bottom:0; left:0; right:0;
    background:var(--surface);
    border-top:1px solid var(--border);
    box-shadow:0 -6px 20px -14px rgba(15,23,42,0.35);
    padding:8px 6px calc(8px + env(safe-area-inset-bottom));
    justify-content:space-around; z-index:20;
  }
  .tabbar .nav-btn{
    flex-direction:column; gap:4px; font-size:11px; padding:7px 4px 6px; flex:1 1 0; min-height:52px;
    border-radius:14px; justify-content:center; letter-spacing:0.01em;
  }
  .tabbar .nav-btn svg{ width:21px; height:21px; }
  .tabbar .nav-btn.active{ box-shadow:none; }
  .tabbar .nav-btn.active svg{ transform:translateY(-1px) scale(1.08); }

  /* ---------- page frame ---------- */
  .main{ padding:22px 24px 70px; max-width:1000px; width:100%; min-width:0; margin:0 auto; }
  @media (max-width:600px){ .main{ padding:14px 14px 40px; } }

  .topline{
    display:flex; align-items:center; justify-content:space-between;
    margin-bottom:18px; gap:10px; flex-wrap:wrap;
  }
  .topline h1{ font-family:var(--font-display); font-size:30px; font-weight:800; letter-spacing:-0.03em; }
  .topline .date{
    font-size:12px; color:var(--accent); font-weight:700; padding:5px 11px; border-radius:99px;
    background:var(--accent-soft);
  }

  .view{ display:none; flex-direction:column; gap:16px; }
  .view.active{ display:flex; animation:view-in .32s var(--ease) both; }
  @keyframes view-in{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }

  .grid2{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
  @media (max-width:640px){ .grid2{ grid-template-columns:1fr; } }
  .grid3{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
  @media (max-width:640px){ .grid3{ grid-template-columns:1fr 1fr; } .grid3.keep3{ grid-template-columns:repeat(3,1fr); gap:8px; } .grid3.keep3 .stat-value{ font-size:22px; } .grid3.keep3 .card-title{ font-size:10.5px; } }

  /* ---------- cards ---------- */
  .card{
    background:var(--surface); border:1px solid var(--border); border-radius:var(--radius);
    padding:18px; box-shadow:var(--shadow); min-width:0;
    display:flex; flex-direction:column; gap:10px;
    transition:transform .22s var(--ease), box-shadow .22s var(--ease);
  }
  @media (hover:hover){ .card:hover{ transform:translateY(-2px); box-shadow:var(--shadow-lift); } }
  .card-head{ display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap; }
  .card-title{ font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:0.08em; color:var(--ink-muted); }
  .card-title.big{ font-size:17px; text-transform:none; letter-spacing:-0.01em; color:var(--ink); font-weight:800; }

  /* hero: "Your journey so far" */
  .card.hero{
    background:var(--grad-hero); color:#fff; border:none;
    box-shadow:0 18px 40px -16px rgba(13,148,136,0.6);
    position:relative; overflow:hidden;
  }
  .card.hero::after{
    content:""; position:absolute; right:-40px; top:-60px; width:220px; height:220px; border-radius:50%;
    background:radial-gradient(circle, rgba(255,255,255,0.28), rgba(255,255,255,0) 70%);
    pointer-events:none;
  }
  .card.hero .card-title.big, .card.hero .stat-sub, .card.hero b{ color:#fff; }
  .card.hero .stat-sub{ opacity:0.92; }
  .card.hero .chip{ background:rgba(255,255,255,0.22); color:#fff; backdrop-filter:blur(6px); }
  .card.hero .bar{ background:rgba(255,255,255,0.25); }
  .card.hero .bar > i{ background:#fff; box-shadow:0 0 14px rgba(255,255,255,0.8); }
  @media (hover:hover){ .card.hero:hover{ transform:translateY(-2px) scale(1.005); } }

  .stat-value{ font-family:var(--font-display); font-size:28px; font-weight:800; letter-spacing:-0.03em; line-height:1.1; }
  .stat-sub{ font-size:12.5px; color:var(--ink-muted); }

  /* ---------- bars ---------- */
  .bar{ height:10px; border-radius:99px; background:var(--surface-2); overflow:hidden; position:relative; }
  .bar > i{
    display:block; height:100%; background:var(--grad-bar); border-radius:99px;
    transition:width .6s var(--ease), background .3s;
    position:relative;
  }
  .bar > i::after{
    content:""; position:absolute; inset:0; border-radius:99px;
    background:linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.45) 50%, transparent 100%);
    transform:translateX(-100%); animation:shimmer 2.6s ease-in-out infinite;
  }
  @keyframes shimmer{ 0%{ transform:translateX(-100%);} 60%,100%{ transform:translateX(100%);} }
  .bar.warn > i{ background:var(--grad-warm); }
  .bar.over > i{ background:linear-gradient(90deg,#EF4444,#F97066); }

  .row{ display:flex; align-items:center; gap:8px; }
  .row.between{ justify-content:space-between; }
  .row.wrap{ flex-wrap:wrap; }

  /* ---------- inputs ---------- */
  label.field{ display:flex; flex-direction:column; gap:5px; font-size:12.5px; color:var(--ink-muted); font-weight:600; }
  label.field > input, label.field > select, label.field > textarea{ width:100%; min-width:0; }
  input[type="number"], input[type="text"], input[type="date"], input[type="time"], input[type="url"], select, textarea{
    background:var(--surface-2); border:1px solid transparent; border-radius:var(--radius-sm);
    padding:11px 12px; font-size:15px; color:var(--ink); font-weight:600;
    transition:border-color .18s, background .18s, box-shadow .18s;
  }
  input::placeholder, textarea::placeholder{ color:var(--ink-muted); opacity:0.7; font-weight:500; }
  select.freq-warn, .weekday-grid select.day-warn{
    border-color:var(--critical); background:var(--critical-soft); color:var(--critical);
  }
  input:focus, select:focus, textarea:focus{
    outline:none; background:var(--surface); border-color:var(--accent);
    box-shadow:0 0 0 4px color-mix(in srgb, var(--accent) 22%, transparent);
  }
  button:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
  textarea{ resize:vertical; min-height:60px; font-weight:500; }
  .num-input{ width:100%; font-variant-numeric:tabular-nums; }
  /* iOS zooms into any field under 16px; keep every field at 16px on phones (DEC-053). */
  @media (max-width:739px){
    input[type="number"], input[type="text"], input[type="date"], input[type="time"], input[type="url"], input[type="password"], select, textarea, .pic-time, table.prog-table td input, table.prog-table td select{ font-size:16px !important; }
  }

  /* ---------- buttons ---------- */
  .btn{
    display:inline-flex; align-items:center; justify-content:center; gap:6px;
    padding:10px 16px; border-radius:12px; border:1px solid var(--border);
    background:var(--surface); color:var(--ink); font-size:13.5px; font-weight:700;
    cursor:pointer; transition:transform .15s var(--ease), box-shadow .15s var(--ease), background .15s, filter .15s;
  }
  .btn:hover{ background:var(--surface-2); }
  .btn:active{ transform:scale(0.96); }
  .btn.primary{ background:var(--grad-accent); border-color:transparent; color:var(--accent-ink); box-shadow:0 8px 18px -10px rgba(13,148,136,0.8); }
  .btn.primary:hover{ filter:brightness(1.07); transform:translateY(-1px); }
  .btn.ghost{ background:transparent; border-color:transparent; }
  .btn.danger{ color:var(--critical); border-color:var(--critical-soft); background:var(--critical-soft); }
  .btn.sm{ padding:7px 12px; font-size:12.5px; border-radius:10px; }
  .btn.icon{ padding:8px; border-radius:12px; }

  /* ---------- chips ---------- */
  .chip{
    display:inline-flex; align-items:center; gap:5px;
    padding:4px 10px; border-radius:99px; font-size:11px; font-weight:800;
    text-transform:uppercase; letter-spacing:0.05em;
    background:var(--surface-2); color:var(--ink-muted);
  }
  .chip.ok{ background:var(--accent-soft); color:var(--accent); }
  .chip.warn{ background:var(--warn-soft); color:var(--warn); }
  .chip.rest{ background:var(--indigo-soft); color:var(--indigo); }
  .chip.critical{ background:var(--critical-soft); color:var(--critical); }

  .freq-select{
    appearance:none; -webkit-appearance:none;
    display:inline-flex; align-items:center; gap:5px;
    padding:4px 26px 4px 10px; border-radius:99px; font-size:11px; font-weight:800;
    text-transform:uppercase; letter-spacing:0.05em;
    background:var(--accent-soft) url('data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 20 20%22><path fill=%22%23888%22 d=%22M5 8l5 5 5-5z%22/></svg>') no-repeat right 8px center / 10px;
    color:var(--accent); border:none; cursor:pointer;
  }
  .freq-select.mismatch{
    background-color:var(--critical-soft); color:var(--critical);
    background-image:url('data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 20 20%22><path fill=%22%23c0392b%22 d=%22M5 8l5 5 5-5z%22/></svg>');
  }

  /* ---------- checkboxes ---------- */
  .check{
    appearance:none; -webkit-appearance:none;
    width:26px; height:26px; border-radius:9px; border:2px solid var(--border);
    background:var(--surface); cursor:pointer; flex:none; position:relative;
    transition:background .18s var(--ease), border-color .18s var(--ease), transform .18s var(--ease);
  }
  .check:hover{ border-color:var(--accent); }
  .check::after{
    content:""; position:absolute; left:8px; top:3px; width:6px; height:12px;
    border:solid #fff; border-width:0 3px 3px 0; transform:rotate(45deg) scale(0); opacity:0;
    transition:transform .2s var(--ease), opacity .2s;
  }
  .check:checked{ background:var(--grad-accent); border-color:transparent; animation:pop .32s var(--ease); }
  .check:checked::after{ transform:rotate(45deg) scale(1); opacity:1; }
  @keyframes pop{ 0%{ transform:scale(0.85);} 55%{ transform:scale(1.14);} 100%{ transform:scale(1);} }

  /* ---------- exercise rows ---------- */
  .exercise-row{
    display:grid; grid-template-columns:auto 1fr auto auto auto auto; gap:8px; align-items:center;
    padding:10px 0; border-bottom:1px solid var(--border);
  }
  @media (max-width:520px){ .exercise-row{ grid-template-columns:auto 1fr auto; row-gap:6px; } }
  .exercise-row:last-child{ border-bottom:none; }
  .exercise-name{ font-weight:700; font-size:14.5px; }
  .exercise-meta{ font-size:12px; color:var(--ink-muted); font-family:var(--font-mono); }
  .weight-in{ width:64px; }
  .rest-btn{ font-family:var(--font-mono); min-width:54px; }
  .rest-btn.running{ background:var(--indigo-soft); border-color:var(--indigo); color:var(--indigo); }
  .session-timer{
    display:flex; align-items:center; justify-content:space-between;
    padding:10px 12px; border-radius:12px; background:var(--surface-2); margin-bottom:2px;
  }
  .session-timer .time{ font-family:var(--font-display); font-size:22px; font-weight:800; font-variant-numeric:tabular-nums; }

  /* ---------- habit rows ---------- */
  .habit-row{
    display:flex; align-items:center; justify-content:space-between; gap:10px;
    padding:9px 0; border-bottom:1px solid var(--border);
  }
  .habit-row:last-child{ border-bottom:none; }
  .habit-name{ font-size:14px; font-weight:700; }
  .habit-target{ font-size:11.5px; color:var(--ink-muted); font-weight:500; }
  .habit-row-text{ flex-direction:column; align-items:stretch; gap:6px; }
  .checkin-section{ padding-bottom:10px; margin-bottom:10px; border-bottom:1px solid var(--border); }
  .checkin-section:last-child{ border-bottom:none; margin-bottom:0; padding-bottom:0; }
  .habit-textarea{ width:100%; min-height:90px; resize:vertical; font-family:inherit; line-height:1.5; padding:10px 12px; }

  /* ---------- collapsible cards ---------- */
  details.card{ padding:0; }
  details.card > summary{
    cursor:pointer; list-style:none; padding:18px; display:flex;
    align-items:center; justify-content:space-between; gap:8px;
  }
  details.card > summary::-webkit-details-marker{ display:none; }
  details.card > summary .chev{ color:var(--ink-muted); transition:transform .2s var(--ease); flex:none; }
  details.card[open] > summary .chev{ transform:rotate(180deg); }
  .warmup-body{ padding:0 18px 18px; display:flex; flex-direction:column; gap:0; }
  .warmup-row{ display:flex; justify-content:space-between; align-items:flex-start; gap:10px; padding:8px 0; border-bottom:1px solid var(--border); }
  .warmup-row:last-child{ border-bottom:none; }
  .warmup-row .wu-name{ font-size:13.5px; font-weight:700; }
  .warmup-row .wu-notes{ font-size:12px; color:var(--ink-muted); }
  .warmup-row .wu-amt{ font-size:12px; color:var(--ink-muted); font-family:var(--font-mono); white-space:nowrap; }

  /* ---------- editors ---------- */
  .editor-row{ display:grid; grid-template-columns:1.4fr 0.7fr 0.7fr 0.9fr auto; gap:8px; align-items:center; padding:6px 0; }
  @media (max-width:640px){ .editor-row{ grid-template-columns:1fr 1fr; } }
  .hw-editor-row{
    display:grid; grid-template-columns:auto 1.2fr .55fr .55fr .9fr 1.3fr auto; gap:8px; align-items:center;
    padding:6px 0; border-bottom:1px solid var(--border);
  }
  .hw-editor-row:last-child{ border-bottom:none; }
  .hw-editor-row.head{ border-bottom:none; padding-bottom:2px; }
  .hw-editor-row.head span{ font-size:10.5px; text-transform:uppercase; letter-spacing:0.06em; color:var(--ink-muted); font-weight:800; }
  @media (max-width:640px){ .hw-editor-row{ grid-template-columns:1fr 1fr; } .hw-editor-row.head{ display:none; } }
  .freq-tags{ display:flex; gap:6px; }
  .freq-tag{ display:flex; flex-direction:column; align-items:center; gap:2px; font-size:10px; color:var(--ink-muted); cursor:pointer; }
  .freq-tag input{ width:14px; height:14px; accent-color:var(--accent); cursor:pointer; }
  .wu-editor-row{
    display:grid; grid-template-columns:1.2fr 0.85fr 1.3fr 1fr auto; gap:8px; align-items:center;
    padding:6px 0; border-bottom:1px solid var(--border);
  }
  .wu-editor-row:last-child{ border-bottom:none; }
  @media (max-width:640px){ .wu-editor-row{ grid-template-columns:1fr 1fr; } }

  /* ---------- heat map ---------- */
  .heatmap{ display:grid; grid-template-columns:repeat(7, 16px) auto; gap:4px; align-items:center; }
  .heat-cell{ width:16px; height:16px; border-radius:4px; background:var(--surface-2); border:1px solid var(--border); position:relative; }
  .heat-cell[data-state="complete"]{ background:var(--accent); border-color:var(--accent); }
  .heat-cell[data-state="partial"]{ background:var(--amber); border-color:var(--amber); opacity:0.85; }
  .heat-cell[data-state="missed"]{ background:var(--critical-soft); border-color:var(--critical); opacity:0.6; }
  .heat-cell[data-state="today"]{ outline:2px solid var(--indigo); outline-offset:1px; }
  .heat-cell[data-state="future"]{ opacity:0.45; }
  .heat-cell-outside{ background:transparent; border-color:transparent; }
  .heat-week-label{ font-size:10.5px; color:var(--ink-muted); white-space:nowrap; padding-left:6px; text-transform:uppercase; letter-spacing:0.04em; font-weight:700; }

  canvas{ width:100%; height:190px; display:block; }

  .divider{ height:1px; background:var(--border); border:none; margin:2px 0; }
  .empty{ font-size:13.5px; color:var(--ink-muted); padding:12px 0; }
  .form-section{ padding:12px 0 2px; border-top:1px solid var(--border); display:flex; flex-direction:column; gap:10px; }
  .form-section:first-of-type{ border-top:none; padding-top:2px; }
  .form-section-head{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; flex-wrap:wrap; }
  .form-section-title{ font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:0.08em; color:var(--accent); }
  .form-note{ font-size:12.5px; color:var(--ink-muted); background:var(--surface-2); border-radius:10px; padding:9px 12px; line-height:1.5; }
  .height-row{ gap:6px; }
  .height-row input{ width:72px !important; min-width:0; }
  .height-row .unit{ font-size:12px; color:var(--ink-muted); font-weight:700; margin-right:6px; }
  @media (max-width:640px){ .form-section .grid3:not(.rowfields){ grid-template-columns:1fr 1fr; } .form-section .grid3:not(.rowfields) > :first-child{ grid-column:1 / -1; } }
  /* One row per item on phones: label left, field right (DEC-056). */
  @media (max-width:739px){
    .rowfields{ display:flex; flex-direction:column; gap:8px; }
    .rowfields label.field{ flex-direction:row; align-items:center; justify-content:space-between; gap:12px; padding:2px 0; }
    .rowfields label.field > input, .rowfields label.field > select{ width:152px; flex:none; text-align:right; }
    .rowfields label.field > input[type="date"]{ text-align:left; }
  }
  .autosave-hint{ display:flex; align-items:center; justify-content:flex-end; gap:8px; min-height:20px; }
  .saved-flash{
    font-size:12px; font-weight:800; color:var(--accent); opacity:0; transform:translateY(4px);
    transition:opacity .25s var(--ease), transform .25s var(--ease);
  }
  .saved-flash::before{ content:"✓ "; }
  .saved-flash.show{ opacity:1; transform:none; }

  .section-divider{
    display:inline-flex; width:fit-content; font-size:11px; font-weight:800; color:var(--accent);
    text-transform:uppercase; letter-spacing:0.08em; margin:6px 2px -6px;
    padding:4px 10px; border-radius:99px; background:var(--accent-soft);
  }
  .subtab-bar{ display:flex; gap:6px; border-bottom:1px solid var(--border); padding-bottom:10px; margin-bottom:2px; flex-wrap:wrap; }
  .subtab-btn, .ptab-btn, .stab-btn{ padding:8px 14px; border-radius:99px; border:1px solid transparent; background:transparent; color:var(--ink-muted); font-size:13px; font-weight:700; cursor:pointer; transition:background .18s, color .18s; }
  .subtab-btn:hover, .ptab-btn:hover, .stab-btn:hover{ background:var(--surface-2); color:var(--ink); }
  .subtab-btn.active, .ptab-btn.active, .stab-btn.active{ background:var(--grad-accent); color:var(--accent-ink); }
  .subview, .psubview, .ssubview{ display:none; flex-direction:column; gap:16px; }
  .subview.active, .psubview.active, .ssubview.active{ display:flex; }
  .field-block{ display:flex; flex-direction:column; gap:6px; font-size:12.5px; color:var(--ink-muted); font-weight:600; }
  .daily-pics{ display:flex; flex-wrap:wrap; gap:8px; }
  .pic-item{ display:flex; flex-direction:column; align-items:center; gap:3px; }
  .pic-thumb{
    width:76px; height:76px; border-radius:12px; overflow:hidden; position:relative; display:block;
    background:var(--surface-2); border:1px solid var(--border);
  }
  .pic-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
  .pic-add{ width:76px; height:76px; border-style:dashed; border-width:2px; }
  .pic-cap{ font-size:10.5px; color:var(--ink-muted); font-weight:700; }
  .pic-time{ width:76px; padding:3px 4px !important; font-size:11px !important; border-radius:8px !important; text-align:center; }
  .meal-day{ margin:6px 0 2px; font-size:12px; font-weight:800; color:var(--ink-muted); text-transform:uppercase; letter-spacing:0.05em; }
  .pic-week{ padding:12px 0; border-bottom:1px solid var(--border); }
  .pic-week:last-child{ border-bottom:none; }
  .pic-week-head{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:8px; cursor:pointer; list-style:none; }
  .pic-week-head::-webkit-details-marker{ display:none; }
  .pic-week-head .chev{ color:var(--ink-muted); transition:transform .2s var(--ease); }
  details.pic-week[open] > .pic-week-head .chev{ transform:rotate(180deg); }
  details.pic-week:not([open]) > .pic-week-head{ margin-bottom:0; }
  .pic-week-head .lbl{ font-weight:800; font-size:14px; }
  .advanced-only{ display:none; }
  .show-advanced .advanced-only{ display:flex; }
  .show-advanced tr.advanced-only, .show-advanced td.advanced-only, .show-advanced th.advanced-only{ display:table-cell; }

  .weekday-grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:6px; }
  .weekday-grid select{ width:100%; padding:7px 4px; font-size:11px; }
  .weekday-label{ font-size:10.5px; text-align:center; color:var(--ink-muted); text-transform:uppercase; font-weight:700; }
  .weekday-date{ display:block; font-size:9.5px; opacity:0.7; text-transform:none; letter-spacing:0; margin-top:1px; }

  .day-toggle-grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:6px; }
  .day-toggle{
    display:flex; flex-direction:column; align-items:center; gap:6px;
    padding:9px 2px; border-radius:12px; border:1px solid var(--border);
    background:var(--surface-2); cursor:pointer; user-select:none; transition:transform .15s var(--ease), background .18s;
  }
  .day-toggle:active{ transform:scale(0.95); }
  .day-toggle.on{ background:var(--accent-soft); border-color:var(--accent); }
  .day-toggle .wd{ font-size:10.5px; text-transform:uppercase; letter-spacing:0.05em; color:var(--ink-muted); font-weight:700; }
  .day-toggle.on .wd{ color:var(--accent); font-weight:800; }
  .day-toggle input{ accent-color:var(--accent); }

  /* ---------- rotation list ---------- */
  .rotation-list{ display:flex; flex-direction:column; gap:0; }
  details.rotation-item{ padding:10px 0; border-bottom:1px solid var(--border); font-size:13.5px; }
  details.rotation-item:last-child{ border-bottom:none; }
  details.rotation-item.is-today{ background:var(--accent-soft); margin:0 -18px; padding:12px 18px; border-radius:12px; border-bottom:none; }
  details.rotation-item > summary{ display:flex; align-items:center; gap:8px; cursor:pointer; list-style:none; }
  details.rotation-item > summary::-webkit-details-marker{ display:none; }
  details.rotation-item > summary .chev{ color:var(--ink-muted); transition:transform .2s var(--ease); flex:none; margin-left:4px; }
  details.rotation-item[open] > summary .chev{ transform:rotate(180deg); }
  .rotation-item .wd{ color:var(--ink-muted); width:96px; flex:none; font-size:12px; font-weight:600; }
  .rotation-item .lbl{ font-weight:800; flex:1; }
  .rotation-exercises{ display:flex; flex-wrap:wrap; gap:5px; padding-left:28px; margin-top:8px; }
  .rotation-ex-chip{ font-size:11.5px; padding:4px 9px; border-radius:99px; background:var(--surface); color:var(--ink-muted); border:1px solid var(--border); }
  .rotation-ex-chip.done{ background:var(--accent-soft); color:var(--accent); font-weight:700; border-color:transparent; }
  .rotation-wu-label{ font-size:10.5px; text-transform:uppercase; letter-spacing:0.06em; color:var(--ink-muted); font-weight:800; width:100%; margin-top:2px; }
  .rotation-wu-chip{ font-size:11.5px; padding:4px 9px; border-radius:99px; background:var(--indigo-soft); color:var(--indigo); }

  /* ---------- tables ---------- */
  .table-wrap{ overflow-x:auto; border-radius:12px; }
  table.prog-table{ border-collapse:collapse; width:100%; min-width:760px; }
  table.prog-table th, table.prog-table td{ padding:8px 8px; border-bottom:1px solid var(--border); white-space:nowrap; }
  table.prog-table#meas-history{ min-width:0; }
  table.prog-table#meas-history th:first-child, table.prog-table#meas-history td:first-child{ position:sticky; left:0; z-index:2; background:var(--surface); box-shadow:2px 0 0 var(--border); max-width:120px; white-space:normal; line-height:1.2; }
  table.prog-table#meas-history th.wk-current:first-child{ background:var(--surface); }
  table.prog-table#meas-history th:not(:first-child), table.prog-table#meas-history td:not(:first-child){ min-width:64px; text-align:center; }
  @media (max-width:739px){
    table.prog-table#meas-history th, table.prog-table#meas-history td{ padding:7px 5px; font-size:12px; }
    table.prog-table#meas-history th:first-child, table.prog-table#meas-history td:first-child{ max-width:92px; font-size:11px; }
    table.prog-table#meas-history th:not(:first-child), table.prog-table#meas-history td:not(:first-child){ min-width:46px; }
    table.prog-table#meas-history th:not(:first-child){ font-size:9.5px; }
  }
  table.photo-table{ min-width:0; }
  table.photo-table td.part-cell{ white-space:normal; }
  @media (max-width:640px){
    table.photo-table th, table.photo-table td{ padding:6px 3px; }
    table.photo-table td.part-cell{ font-size:10.5px; max-width:70px; }
    table.photo-table .photo-slot{ width:50px; height:64px; }
    table.photo-table th{ font-size:9.5px; }
  }
  table.prog-table th{ text-align:left; font-size:10.5px; text-transform:uppercase; letter-spacing:0.06em; color:var(--ink-muted); font-weight:800; }
  table.prog-table th.wk-current, table.prog-table td.wk-current{ background:var(--accent-soft); }
  table.prog-table td.wk-improved{ background:var(--accent-soft); color:var(--accent); font-weight:800; }
  table.prog-table td.wk-worse{ color:var(--critical); font-weight:800; }
  table.prog-table td.wk-stuck{ background:var(--warn-soft); }
  table.prog-table td.trend-good{ color:var(--accent); font-weight:800; }
  table.prog-table td.trend-bad{ color:var(--critical); font-weight:800; }
  table.prog-table td input, table.prog-table td select{ width:100%; min-width:64px; padding:6px 7px; font-size:12.5px; border-radius:8px; }
  table.prog-table td.part-cell{ font-size:11.5px; color:var(--ink-muted); font-weight:600; }
  table.prog-table tr.meas-row td{ white-space:normal; padding:0 8px 8px; background:var(--surface); }
  details.meas-details > summary{
    list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between;
    gap:8px; padding:7px 0; font-size:12.5px; font-weight:700; color:var(--ink-muted);
  }
  details.meas-details > summary::-webkit-details-marker{ display:none; }
  details.meas-details > summary .chev{ transition:transform .2s var(--ease); }
  details.meas-details[open] > summary .chev{ transform:rotate(180deg); }
  details.meas-details .meas-grid{ padding:4px 0 6px; }
  details.meas-details .meas-grid input{ min-width:0; }
  .move-cell{ display:flex; flex-direction:column; gap:2px; }
  .move-cell .btn{ width:22px; height:18px; padding:0; font-size:9px; line-height:1; }
  .move-cell .btn:disabled{ opacity:0.25; cursor:default; }
  .week-chip{ font-family:var(--font-mono); }
  table.prog-table th[data-sort]{ cursor:pointer; user-select:none; }
  table.prog-table th[data-sort]:hover{ color:var(--ink); }
  table.prog-table th.sorted{ color:var(--accent); }
  .prog-pair{ display:flex; align-items:center; gap:3px; white-space:nowrap; }
  .prog-pair input{ width:38px; padding:5px 4px; text-align:center; }
  .prog-pair input:last-child{ width:56px; }

  /* ---------- photos & food ---------- */
  .photo-slot{
    width:64px; height:80px; border-radius:12px; overflow:hidden; position:relative;
    background:var(--surface-2); border:2px dashed var(--border);
    display:flex; align-items:center; justify-content:center; cursor:pointer;
    transition:border-color .18s, transform .18s var(--ease);
  }
  .photo-slot:hover{ border-color:var(--accent); transform:scale(1.03); }
  .photo-slot img{ width:100%; height:100%; object-fit:cover; display:block; }
  .photo-slot .plus{ color:var(--accent); font-size:22px; font-weight:400; }
  .photo-slot input[type="file"]{ position:absolute; inset:0; opacity:0; cursor:pointer; }
  .photo-remove{
    position:absolute; top:3px; right:3px; width:18px; height:18px; border-radius:50%;
    background:var(--critical); color:#fff; font-size:10px; line-height:18px; text-align:center;
    cursor:pointer; z-index:2;
  }
  .food-meal-section{ margin-bottom:14px; }
  .food-meal-section:last-child{ margin-bottom:0; }
  .food-meal-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:6px; }
  .food-entry-row{ display:flex; flex-wrap:wrap; gap:10px; }
  .food-entry{ display:flex; flex-direction:column; align-items:center; gap:5px; }
  .food-entry-photo{
    width:64px; height:64px; border-radius:12px; overflow:hidden; position:relative;
    background:var(--surface-2); border:2px dashed var(--border);
    display:flex; align-items:center; justify-content:center; cursor:pointer;
  }
  .food-entry-photo img{ width:100%; height:100%; object-fit:cover; display:block; }
  .food-entry-photo .plus{ color:var(--ink-muted); font-size:20px; font-weight:300; }
  .food-entry-photo input[type="file"]{ position:absolute; inset:0; opacity:0; cursor:pointer; }
  .food-entry-remove{
    position:absolute; top:2px; right:2px; width:16px; height:16px; border-radius:50%;
    background:var(--critical); color:#fff; font-size:10px; line-height:16px; text-align:center;
    cursor:pointer; z-index:2;
  }
  .food-entry-cal{ width:64px; padding:4px 5px; font-size:11px; text-align:center; }
  .cmp-row{ padding:12px 0; border-top:1px solid var(--border); }
  .cmp-row:first-child{ border-top:none; padding-top:4px; }
  .cmp-row.is-base{ background:var(--accent-soft); margin:0 -18px; padding:12px 18px; border-radius:12px; border-top:none; }
  .cmp-head{ display:flex; align-items:baseline; justify-content:space-between; gap:8px; margin-bottom:8px; }
  .cmp-head .lbl{ font-weight:800; font-size:14px; }
  .cmp-head .date{ font-size:12px; color:var(--ink-muted); font-weight:700; }
  .cmp-photos{ display:grid; grid-template-columns:repeat(4,1fr); gap:6px; }
  .cmp-photos figure{ margin:0; display:flex; flex-direction:column; gap:3px; }
  .cmp-photos img, .cmp-photos .noimg{ width:100%; aspect-ratio:3/4; object-fit:cover; border-radius:10px; background:var(--surface-2); display:block; }
  .cmp-photos .noimg{ display:flex; align-items:center; justify-content:center; font-size:10.5px; color:var(--ink-muted); border:1px dashed var(--border); }
  .cmp-photos figcaption{ font-size:10px; text-transform:uppercase; letter-spacing:0.05em; color:var(--ink-muted); font-weight:800; text-align:center; }
  .compare-grid{ display:grid; grid-template-columns:auto repeat(4,1fr); gap:10px; margin-top:12px; align-items:center; }
  .compare-grid .ch{ font-size:11px; text-transform:uppercase; letter-spacing:0.05em; color:var(--ink-muted); text-align:center; font-weight:800; }
  .compare-grid .rowlbl{ font-size:12px; font-weight:800; }
  .compare-grid img{ width:100%; aspect-ratio:3/4; object-fit:cover; border-radius:12px; background:var(--surface-2); }
  .compare-grid .noimg{ width:100%; aspect-ratio:3/4; border-radius:12px; background:var(--surface-2); display:flex; align-items:center; justify-content:center; font-size:11px; color:var(--ink-muted); }
  @media (max-width:640px){ .compare-grid{ grid-template-columns:auto repeat(2,1fr); } }

  .donut-wrap{ position:relative; width:64px; height:64px; margin-top:4px; }
  .donut{ width:64px; height:64px; border-radius:50%; background:conic-gradient(var(--surface-2) 0% 100%); }
  .donut-hole{ position:absolute; top:8px; left:8px; width:48px; height:48px; border-radius:50%; background:var(--surface); }
  .donut-label{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:800; }
  .minibar-block{ display:flex; flex-direction:column; gap:4px; }
  .minibar-row{ display:flex; align-items:flex-end; gap:2px; height:36px; }
  .minibar-row .mbar{ flex:1; background:var(--accent); border-radius:3px 3px 0 0; min-height:3px; }
  .minibar-row .mbar.empty{ background:var(--surface-2); }

  /* ---------- toast ---------- */
  .toast{
    position:fixed; bottom:20px; left:50%; transform:translate(-50%, 24px) scale(0.96);
    background:var(--ink); color:var(--bg); padding:11px 18px; border-radius:14px;
    font-size:13.5px; font-weight:700; opacity:0; transition:all .28s var(--ease); pointer-events:none; z-index:50;
    box-shadow:0 14px 40px -10px rgba(0,0,0,0.45);
  }
  @media (max-width:739px){ .toast{ bottom:calc(92px + env(safe-area-inset-bottom)); } }
  .toast.show{ opacity:1; transform:translate(-50%, 0) scale(1); }

  .goal-legend{ display:flex; gap:14px; flex-wrap:wrap; font-size:11.5px; color:var(--ink-muted); font-weight:600; }
  .goal-legend .dot{ width:9px; height:9px; border-radius:99px; display:inline-block; margin-right:5px; }

  /* ---------- modals ---------- */
  .video-modal-overlay{
    position:fixed; inset:0; background:rgba(5,10,20,0.6); z-index:100;
    display:none; align-items:center; justify-content:center; padding:20px;
    backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  }
  .video-modal-overlay.show{ display:flex; }
  .video-modal{
    background:var(--surface); border-radius:var(--radius); width:100%; max-width:720px;
    overflow:hidden; box-shadow:var(--shadow-lift); display:flex; flex-direction:column;
    animation:view-in .3s var(--ease) both;
  }
  .video-modal-head{ display:flex; align-items:center; justify-content:space-between; padding:12px 16px; border-bottom:1px solid var(--border); flex:none; }
  .video-modal-body{ position:relative; width:100%; aspect-ratio:16/9; background:#000; }
  .video-modal-body iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
  .video-modal-fallback{
    position:absolute; inset:0; display:flex; flex-direction:column; align-items:center;
    justify-content:center; gap:10px; padding:20px; text-align:center; background:var(--surface);
  }
  .confirm-modal{
    background:var(--surface); border-radius:var(--radius); width:100%; max-width:380px;
    padding:22px; box-shadow:var(--shadow-lift); display:flex; flex-direction:column; gap:16px;
    animation:view-in .3s var(--ease) both;
  }
  .confirm-modal p{ margin:0; font-size:14.5px; line-height:1.5; color:var(--ink); }

  @keyframes spin{ from{ transform:rotate(0deg); } to{ transform:rotate(360deg); } }
  .btn.spinning svg{ animation:spin 0.9s linear infinite; }

  /* ---------- ask jake ---------- */
  .card.hero.jake-hero{ background:linear-gradient(135deg,#312E81 0%,#4F46E5 55%,#06B6D4 100%); box-shadow:0 18px 40px -16px rgba(79,70,229,0.55); }
  .jake-finding{ display:flex; gap:10px; padding:9px 0; border-bottom:1px solid var(--border); align-items:flex-start; }
  .jake-finding:last-child{ border-bottom:none; }
  .jake-finding .dot{ width:10px; height:10px; border-radius:99px; margin-top:5px; flex:none; background:var(--ink-muted); }
  .jake-finding.good .dot{ background:var(--accent-2); }
  .jake-finding.watch .dot{ background:var(--amber); }
  .jake-finding.act .dot{ background:var(--critical); }
  .jake-finding.act{ background:var(--critical-soft); margin:0 -8px; padding:9px 8px; border-radius:10px; border-bottom:none; }
  .jake-finding.act .t{ color:var(--critical); }
  .jake-finding.act .d{ color:var(--ink); }
  .alarm{ color:var(--critical); font-weight:600; background:var(--critical-soft); border-radius:4px; padding:0 3px; box-decoration-break:clone; -webkit-box-decoration-break:clone; }
  .jake-finding .t{ font-weight:800; font-size:14px; }
  .jake-finding .d{ font-size:12.5px; color:var(--ink-muted); }
  .jake-change{ display:flex; justify-content:space-between; gap:10px; padding:9px 0; border-bottom:1px solid var(--border); align-items:center; flex-wrap:wrap; }
  .jake-change:last-child{ border-bottom:none; }
  .jake-change .k{ font-weight:800; font-size:14px; }
  .jake-change .v{ font-family:var(--font-display); font-weight:800; font-size:15px; }
  .jake-change .v .arrow{ color:var(--ink-muted); margin:0 6px; font-weight:400; }
  .jake-change .r{ font-size:12.5px; color:var(--ink-muted); width:100%; }
  .jake-action{ display:flex; justify-content:space-between; gap:10px; padding:10px 0; border-bottom:1px solid var(--border); align-items:center; flex-wrap:wrap; }
  .jake-action:last-child{ border-bottom:none; }
  .jake-action .t{ font-weight:800; font-size:14px; }
  .jake-action .d{ font-size:12.5px; color:var(--ink-muted); }
  .jake-briefing{ font-size:14.5px; line-height:1.6; white-space:pre-wrap; word-wrap:break-word; }
  .jake-kpis{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:4px; }
  @media (min-width:640px){ .jake-kpis{ grid-template-columns:repeat(6,1fr); } }
  .jake-kpi{ background:rgba(255,255,255,0.16); border-radius:12px; padding:8px 10px; }
  .jake-kpi .l{ font-size:10px; text-transform:uppercase; letter-spacing:0.06em; opacity:0.85; font-weight:700; }
  .jake-kpi .v{ font-family:var(--font-display); font-weight:800; font-size:16px; letter-spacing:-0.02em; }
  .jake-kpi .s{ font-size:10.5px; opacity:0.85; }
  .jake-section{ margin-top:12px; }
  .jake-section-label{ font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:0.08em; color:var(--accent); margin:0 0 6px; display:flex; align-items:center; gap:8px; }
  .jake-section-label .n{ background:var(--accent-soft); color:var(--accent); border-radius:99px; padding:1px 7px; font-size:10.5px; }
  .jake-section-label.warn{ color:var(--warn); } .jake-section-label.warn .n{ background:var(--warn-soft); color:var(--warn); }
  .jake-section-label.critical{ color:var(--critical); } .jake-section-label.critical .n{ background:var(--critical-soft); color:var(--critical); }
  .jake-section-label.muted{ color:var(--ink-muted); } .jake-section-label.muted .n{ background:var(--surface-2); color:var(--ink-muted); }
  .jake-prose{ font-size:14.5px; line-height:1.6; }
  .jake-prose p{ margin:0 0 8px; }
  .jake-prose ul{ margin:0 0 8px; padding-left:18px; }
  .jake-prose li{ margin:2px 0; }
  .jake-prose h4{ font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:0.08em; color:var(--accent); margin:14px 0 6px; }
  .jake-prose h4:first-child{ margin-top:0; }
  .jake-progress-row{ display:flex; justify-content:space-between; gap:10px; font-size:12.5px; color:var(--ink-muted); font-weight:600; }
  .jake-where{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
  .jake-where div{ background:var(--surface-2); border-radius:12px; padding:9px 10px; }
  .jake-where .l{ font-size:10px; text-transform:uppercase; letter-spacing:0.06em; color:var(--ink-muted); font-weight:700; }
  .jake-where .v{ font-family:var(--font-display); font-weight:800; font-size:17px; letter-spacing:-0.02em; }
  details.jake-rules{ margin-top:8px; }
  details.jake-rules > summary{ cursor:pointer; font-size:12.5px; font-weight:700; color:var(--ink-muted); list-style:none; }
  details.jake-rules > summary::-webkit-details-marker{ display:none; }
  details.jake-rules > summary::before{ content:"▸ "; }
  details.jake-rules[open] > summary::before{ content:"▾ "; }
  details.jake-rules ul{ margin:6px 0 0; padding-left:18px; font-size:12.5px; color:var(--ink-muted); line-height:1.5; }
  .jake-report .jake-where{ margin-bottom:10px; }
  .jake-briefing.loading{ opacity:0.7; font-style:italic; }
  .jake-chat{ display:flex; flex-direction:column; gap:10px; max-height:460px; overflow:auto; padding:4px 2px; }
  .jake-msg{ max-width:88%; padding:10px 13px; border-radius:16px; font-size:14px; line-height:1.5; white-space:pre-wrap; word-wrap:break-word; }
  .jake-msg.me{ align-self:flex-end; background:var(--grad-accent); color:var(--accent-ink); border-bottom-right-radius:6px; }
  .jake-msg.jake{ align-self:flex-start; background:var(--surface-2); color:var(--ink); border-bottom-left-radius:6px; }
  .jake-msg .meta{ display:block; font-size:10.5px; opacity:0.7; margin-top:6px; }
  .jake-msg.thinking{ opacity:0.7; font-style:italic; }
  .jake-hist{ display:flex; justify-content:space-between; gap:10px; padding:8px 0; border-bottom:1px solid var(--border); font-size:12.5px; flex-wrap:wrap; }
  .jake-hist:last-child{ border-bottom:none; }
  .jake-hist .when{ color:var(--ink-muted); font-weight:700; }
  .jake-hist .what{ flex:1; min-width:200px; }
  .jake-hist .undo{ font-size:12px; }

  /* ---------- celebration ---------- */
  .confetti{ position:fixed; left:0; top:0; width:0; height:0; z-index:200; pointer-events:none; }
  .confetti i{
    position:absolute; width:9px; height:9px; border-radius:2px; opacity:0.95;
    transform:translate(-50%,-50%);
    animation:confetti-fly .9s var(--ease) forwards;
  }
  @keyframes confetti-fly{
    0%{ transform:translate(-50%,-50%) rotate(0) scale(1); opacity:1; }
    100%{ transform:translate(calc(-50% + var(--dx)), calc(-50% + var(--dy))) rotate(var(--rot)) scale(0.6); opacity:0; }
  }

  @media (prefers-reduced-motion: reduce){
    *{ transition:none !important; animation:none !important; }
    .bar > i::after{ display:none; }
  }
