\n.day-block[data-date=\\"2026-06-17\\"] .day-card { width:auto !important; max-width:none !important; margin:0 !important; }\n.day-block[data-date=\\"2026-06-17\\"] .flow-chart-card { display:block !important; max-width:none !important; width:auto !important; margin:0 !important; padding:26px 28px 28px; }\n.day-block[data-date=\\"2026-06-17\\"] .v5-prog { font-family:'DM Mono',monospace; font-size:9px; letter-spacing:0.12em; color:#a8893a; text-align:right; margin-bottom:18px; }\n.day-block[data-date=\\"2026-06-17\\"] .v5-hero { background:#FAF6EC; border-left:2px solid #7A8C6E; border-radius:0 9px 9px 0; padding:18px 20px; margin-bottom:30px; }\n.day-block[data-date=\\"2026-06-17\\"] .v5-hero-eye { font-family:'DM Mono',monospace; font-size:9px; letter-spacing:0.24em; text-transform:uppercase; color:#a8893a; margin-bottom:6px; }\n.day-block[data-date=\\"2026-06-17\\"] .v5-hero-row { display:flex; align-items:flex-start; gap:12px; }\n.day-block[data-date=\\"2026-06-17\\"] .v5-hero-task { font-family:'Newsreader',serif; font-weight:500; font-size:27px; color:#2A2A25; line-height:1.18; flex:1; outline:none; }\n.day-block[data-date=\\"2026-06-17\\"] .v5-hero .agenda-check { margin-top:8px; flex:0 0 auto; }\n.day-block[data-date=\\"2026-06-17\\"] .v5-hero.done .v5-hero-task { opacity:0.4; text-decoration:line-through; text-decoration-color:var(--sage); }\n.day-block[data-date=\\"2026-06-17\\"] .v5-lab { font-family:'DM Mono',monospace; font-size:8.5px; letter-spacing:0.26em; text-transform:uppercase; color:#a8893a; margin:0 0 14px; }\n.day-block[data-date=\\"2026-06-17\\"] .v5-mini { display:flex; align-items:baseline; gap:12px; padding:12px 0; }\n.day-block[data-date=\\"2026-06-17\\"] .v5-mini .agenda-check { flex:0 0 auto; align-self:center; }\n.day-block[data-date=\\"2026-06-17\\"] .v5-mini-t { font-family:'Newsreader',serif; font-size:19px; color:#2A2A25; flex:1; outline:none; }\n.day-block[data-date=\\"2026-06-17\\"] .v5-mini-time { font-family:'DM Mono',monospace; font-size:10px; letter-spacing:0.06em; color:#a8893a; flex:0 0 auto; }\n.day-block[data-date=\\"2026-06-17\\"] .v5-mini.done .v5-mini-t { opacity:0.4; text-decoration:line-through; text-decoration-color:var(--sage); }\n.day-block[data-date=\\"2026-06-17\\"] .v5-tiles { display:grid; grid-template-columns:repeat(auto-fit, minmax(240px,1fr)); gap:14px; margin-top:26px; }\n.day-block[data-date=\\"2026-06-17\\"] .v5-tile { background:#FAF6EC; border-radius:9px; padding:17px 17px 18px; }\n.day-block[data-date=\\"2026-06-17\\"] .v5-tile.done { opacity:0.5; }\n.day-block[data-date=\\"2026-06-17\\"] .v5-tile-top { display:flex; align-items:flex-start; gap:9px; }\n.day-block[data-date=\\"2026-06-17\\"] .v5-tile .agenda-check { margin-top:5px; flex:0 0 auto; }\n.day-block[data-date=\\"2026-06-17\\"] .v5-tile-t { font-family:'Newsreader',serif; font-size:19px; color:#2A2A25; line-height:1.1; flex:1; outline:none; }\n.day-block[data-date=\\"2026-06-17\\"] .v5-tile-m { font-family:'Newsreader',serif; font-style:italic; font-size:13px; color:#9b9082; margin:2px 0 0 22px; }\n.day-block[data-date=\\"2026-06-17\\"] .v5-tile-move { font-family:'DM Mono',monospace; font-size:9px; line-height:1.5; letter-spacing:0.02em; color:#5f7150; margin:10px 0 0 22px; }\n.day-block[data-date=\\"2026-06-17\\"] .v5-tile-move b { color:#7A8C6E; font-weight:400; }\n@media (max-width:560px) {\n  .day-block[data-date=\\"2026-06-17\\"] .v5-tiles { grid-template-columns:1fr; }\n  .day-block[data-date=\\"2026-06-17\\"] .v5-hero-task { font-size:24px; }\n}\n

\n.day-block.fmt22 .day-card { width:auto !important; max-width:none !important; margin:0 !important; background:rgba(255,255,255,0.12) !important; backdrop-filter:blur(18px) saturate(1.4) !important; -webkit-backdrop-filter:blur(18px) saturate(1.4) !important; border:1px solid rgba(255,255,255,0.2) !important; border-radius:10px !important; box-shadow:0 2px 12px rgba(0,0,0,0.06) !important; }\n.day-block.fmt22 .day-tasks { padding:12px 0 26px !important; }\n.day-block.fmt22 .flow-chart-card { display:block !important; width:auto !important; max-width:none !important; margin:0 !important; padding:20px 30px 26px; border:none !important; box-shadow:none !important; background:rgba(255,255,255,0.10) !important; backdrop-filter:blur(16px) saturate(1.3) !important; -webkit-backdrop-filter:blur(16px) saturate(1.3) !important; }\n.day-block.fmt22.popped .flow-chart-card { background:rgba(255,255,255,0.10) !important; backdrop-filter:blur(16px) saturate(1.3) !important; -webkit-backdrop-filter:blur(16px) saturate(1.3) !important; }\n.day-block.fmt22 .day-pop-x { display:none; }\n.day-block.fmt22.popped .day-tasks { display:block !important; }\n.day-block.fmt22.popped .day-card { position:fixed !important; opacity:1 !important; inset:0 !important; margin:0 !important; width:auto !important; max-width:none !important; min-height:100vh !important; background:#E7E0D2 url('data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww%2Ew3%2Eorg%2F2000%2Fsvg%27%20width%3D%271400%27%20height%3D%271400%27%3E%3Cfilter%20id%3D%27s%27%3E%3CfeTurbulence%20type%3D%27fractalNoise%27%20baseFrequency%3D%270%2E026%200%2E03%27%20numOctaves%3D%275%27%20seed%3D%2714%27%20result%3D%27n%27%2F%3E%3CfeDiffuseLighting%20in%3D%27n%27%20lighting%2Dcolor%3D%27%23ECE5D6%27%20surfaceScale%3D%272%2E6%27%20diffuseConstant%3D%271%2E05%27%3E%3CfeDistantLight%20azimuth%3D%27228%27%20elevation%3D%2756%27%2F%3E%3C%2FfeDiffuseLighting%3E%3C%2Ffilter%3E%3Crect%20width%3D%271400%27%20height%3D%271400%27%20fill%3D%27%23E7E0D2%27%2F%3E%3Crect%20width%3D%271400%27%20height%3D%271400%27%20filter%3D%27url%28%23s%29%27%2F%3E%3C%2Fsvg%3E') center/cover fixed !important; z-index:9999 !important; overflow-y:auto !important; border:none !important; border-radius:0 !important; padding:54px 6vw 70px !important; box-shadow:none !important; }\n.day-block.fmt22.popped .day-pop-x { display:flex; position:fixed; top:20px; right:24px; z-index:10000; width:36px; height:36px; align-items:center; justify-content:center; font-family:\\"DM Mono\\",monospace; font-size:22px; line-height:1; color:#5e5340; cursor:pointer; border:1.5px solid rgba(150,124,78,0.5); border-radius:50%; background:rgba(255,255,255,0.35); }\n.day-block.fmt22 .flow-title { color:#F1EFE8 !important; -webkit-text-fill-color:#F1EFE8 !important; font-family:\\"Gilda Display\\",serif !important; font-size:24px !important; text-transform:none !important; letter-spacing:0.01em !important; margin:0 0 24px !important; text-shadow:none !important; }\n@keyframes flowShimmer { 0% { background-position:200% 0; } 100% { background-position:-200% 0; } }\n.day-block.fmt22 .flow-chart-card .flow-title::after { content:none !important; }\n.day-block.fmt22 .j22-group { font-family: \\"Cinzel\\", serif; font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--dark, #2A2A25); margin: 0 0 6px; padding: 0; font-weight: 500; opacity: 0.85; }\n.day-block.fmt22 .j22-group::first-letter { text-transform:lowercase; }\n.day-block.fmt22 .j22-group:first-of-type { margin-top:6px !important; }\n.day-block.fmt22 .j22-item { display:flex; align-items:baseline; width:auto; min-height:0; background:transparent; border:none; border-radius:0; padding:2px 0; margin:0; cursor:default; }\n.day-block.fmt22 .j22-section-items { border-left:1px solid rgba(150,124,78,0.32); padding-left:24px; }\n.day-block.fmt22 .agenda-check { display:none !important; }\n.day-block.fmt22 .j22-cols { display:grid; grid-template-columns:max-content max-content; column-gap:44px; row-gap:12px; }\n.day-block.fmt22 .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2):not(:first-child) { margin-top:13px; }\n.day-block.fmt22 .j22-cols .j22-item { width:auto; min-width:0; }\n\n.day-block.fmt22 .j22-cols .j22-item { break-inside:avoid; }\n.day-block.fmt22 .j22-item .agenda-check { display:none; }\n.day-block.fmt22 .j22-t a { color:inherit; text-decoration:underline; text-decoration-color:rgba(154,132,86,0.55); text-underline-offset:2px; }\n.day-block.fmt22 .j22-t { font-family:'Newsreader',serif; font-size:21px; color:#2A2A25; line-height:1.5; }\n.day-block.fmt22 .j22-loc { display:block; font-style:italic; font-size:15px; color:#a8706a; margin-top:2px; }\n.day-block.fmt22 .j22-pin { width:10px; height:10px; vertical-align:-1px; margin-right:4px; }\n.day-block.fmt22 .j22-sub { padding-left:22px; margin:0; width:auto; }\n.day-block.fmt22 .j22-sub.fn-top { border-top:1px solid rgba(90,72,40,0.32); margin-top:9px; padding-top:10px; }\n.day-block.fmt22 .j22-sub2 { padding-left:40px; margin:0; width:auto; }\n.day-block.fmt22 .day-date { font-family:\\"Cinzel\\",serif !important; letter-spacing:0.12em !important; }\n.day-block.fmt22 .j22-section { display:flex; align-items:flex-start; gap:8px; margin:0 0 32px 0 !important; }\n.day-block.fmt22 .j22-section > .j22-group { flex:0 0 130px; margin:0 !important; padding:3px 0 0 10px; text-align:left; }\n.day-block.fmt22 .j22-section-items { flex:0 1 auto; min-width:0; }\n.day-block.fmt22 .j22-toggle { align-self:center; cursor:pointer; color:#9a8456; font-size:14px; line-height:1; padding:0 4px; margin-left:2px; opacity:0.7; transition:opacity .15s ease, transform .2s ease; }\n.day-block.fmt22 .j22-item:hover .j22-toggle { opacity:1; }\n.day-block.fmt22 .j22-collapsed .j22-toggle { transform:rotate(-90deg); }\n.day-block.fmt22 .j22-ghead { display:flex; align-items:center; cursor:pointer; }\n.day-block.fmt22 .j22-gtoggle { margin-left:8px; color:#9a8456; font-size:13px; line-height:1; opacity:0.7; padding:0 2px; transition:opacity .15s ease, transform .2s ease; }\n.day-block.fmt22 .j22-ghead:hover .j22-gtoggle { opacity:1; }\n.day-block.fmt22 .j22-gcollapsed .j22-gtoggle { transform:rotate(-90deg); }\n.day-block.fmt22 .j22-sub .j22-t, .day-block.fmt22 .j22-sub2 .j22-t { color:#4a4334; font-size:18px; padding-left:17px; text-indent:-17px; }\n.day-block.fmt22 .j22-section-items.auto-cols { display:grid; grid-template-columns:max-content max-content; column-gap:44px; row-gap:13px; align-items:start; }\n.day-block.fmt22 .j22-section-items.auto-cols > .j22-item { margin-top:0 !important; }\n.day-block.fmt22 .fn-num, .day-block.fmt22 .fn-cite { display:none !important; }\n.day-block.fmt22 .j22-sub.fn-top { border-top:none !important; padding-top:0 !important; }\n.day-block.fmt22 .j22-sub .j22-t, .day-block.fmt22 .j22-sub2 .j22-t { padding-left:0 !important; text-indent:0 !important; }\n.day-block.fmt22 .j22-group { display:none !important; }\n.day-block.fmt22 .j22-section { display:block !important; margin:0 0 22px 0 !important; }\n.day-block.fmt22 .j22-section-items { border-left:none !important; padding-left:0 !important; }\n.day-block.fmt22 .verb-prefix { font-family:\\"Newsreader\\",serif; font-size:21px; color:#2A2A25; line-height:1.5; margin-right:0 !important; white-space:pre; }\n.day-block.fmt22 .day-card-header { padding-left:0 !important; }\n.day-block.fmt22 .agenda-check::before { content:none !important; }\n.day-block.fmt22 .j22-item:not(.j22-sub):not(.j22-sub2) > .agenda-check { display:inline-block !important; -webkit-appearance:none !important; appearance:none !important; width:15px; height:16px; border:none !important; background:transparent !important; position:relative; cursor:pointer; flex-shrink:0; margin-right:9px; align-self:flex-start; margin-top:2px; }\n.day-block.fmt22 .j22-item:not(.j22-sub):not(.j22-sub2) > .agenda-check::after { content:\\"\\2713\\"; position:absolute; left:-1px; top:4px; font-family:\\"Newsreader\\",serif; font-style:italic; font-weight:300; font-size:23px; line-height:1; color:#9a8456; opacity:1; transform:skewX(-10deg); }\n.day-block.fmt22 .j22-item:not(.j22-sub):not(.j22-sub2) > .agenda-check:checked::after { color:#9a8456; opacity:1; }\n.day-block.fmt22 .j22-item:not(.j22-sub):not(.j22-sub2) > .agenda-check:checked + .j22-t { opacity:0.5; }\n.day-block.fmt22 .j22-t.editing { outline:1px dashed rgba(94,90,91,0.55); outline-offset:3px; background:rgba(255,255,255,0.22); border-radius:3px; cursor:text; min-width:30px; }\n.day-block.fmt22 .j22-section-items, .day-block.fmt22 .j22-item { position:relative; }\n.day-block.fmt22 .j22-section { position:relative; }\n.day-block.fmt22 .del-x, .day-block.fmt22 .del-x-sec { position:absolute; top:-1px; right:2px; opacity:0; cursor:pointer; color:#a8706a; font-family:Arial,sans-serif; font-size:15px; line-height:1; padding:1px 5px; transition:opacity .12s; z-index:6; }\n.day-block.fmt22 .j22-item:hover > .del-x { opacity:0.55; }\n.day-block.fmt22 .j22-section:hover:not(:has(.j22-item:hover)) > .del-x-sec { opacity:0.55; }\n.day-block.fmt22 .del-x:hover, .day-block.fmt22 .del-x-sec:hover { opacity:1; }\n.day-block.fmt22 .j22-sub.fn-pair { display:inline-block; margin-right:12px; vertical-align:top; }\n.day-block.fmt22 .j22-sub.fn-pair.fn-top { border-top:none; padding-top:0; margin-top:0; }\n.day-block.fmt22 .fn-num { font-family:\\"DM Mono\\",monospace; font-size:10px; color:#9a7b3f; vertical-align:5px; margin-right:0; display:inline-block; width:17px; text-align:left; letter-spacing:0.04em; }\n.day-block.fmt22 .fn-cite { font-family:\\"DM Mono\\",monospace; font-size:9px; color:#9a7b3f; vertical-align:6px; margin-left:5px; letter-spacing:0.08em; }\n.day-block.fmt22 .j22-item.done .j22-t { opacity:0.4; text-decoration:line-through; text-decoration-color:var(--sage); }\n.j22-delay-btn { display:block; margin:30px auto 20px; padding:7px 18px; background:transparent; border:1px dashed rgba(154,132,86,0.55); border-radius:18px; font-family:'DM Mono',monospace; font-size:10px; letter-spacing:0.1em; text-transform:lowercase; color:#9a8456; cursor:pointer; opacity:0.9; transition:background .15s, opacity .15s; }\n.j22-delay-btn:hover { opacity:1; background:rgba(154,132,86,0.1); }\n.j22-actions { display:flex; justify-content:center; align-items:center; gap:10px; margin:30px 0 20px; }\n.j22-actions .j22-delay-btn { margin:0 !important; }\n.j22-add-btn { display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; padding:0; background:rgba(255,255,255,0.15); border:1.5px dashed rgba(120,100,60,0.7); border-radius:50%; font-family:\\"DM Mono\\",monospace; font-size:18px; line-height:1; color:#6b5a30; cursor:pointer; transition:background .15s, transform .15s; backdrop-filter:blur(4px); }\n.j22-add-btn:hover { background:rgba(120,100,60,0.18); transform:scale(1.08); }\n.add-field { margin:11px 0; }\n.add-field input { width:100%; box-sizing:border-box; padding:9px 11px; font-family:\\"Newsreader\\",serif; font-size:16px; border:1px solid rgba(150,124,78,0.45); border-radius:4px; background:rgba(255,255,255,0.45); color:#2A2A25; }\n.rolled-head { font-family:'DM Mono',monospace; font-size:9px; letter-spacing:0.16em; text-transform:uppercase; color:#b3a079; padding:16px 0 6px 4px; }\n.day-block.fmt22 .rolled-marker { display:none !important; }\n.rolled-task { font-family:'Newsreader',serif; font-size:18px; color:#2A2A25; line-height:1.35; padding:4px 2px 4px 16px; }\n.rolled-task.rolled-sub { padding-left:46px; color:#5f584c; }\n.rolled-task.rolled-sub2 { padding-left:74px; color:#5f584c; }\n


  :root { --cream:#F5F0E8; --sage:#8A9E85; --dark:#2A2A25; --warm:#C4A882; --dusty:#B5A99A; --light-sage:#D4DDD1; --accent:#7A8C6E; }
  html { background:#E7E0D2; }
  * { margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
  body {
  background: #E7E0D2;
  font-family:'Newsreader',serif;
  min-height:100vh;
  padding:0; margin:0;
  color:var(--dark);
}
  header { text-align:center; margin-bottom:48px; }
  header .eyebrow { font-family:'DM Mono',monospace; font-size:10px; letter-spacing:0.25em; color:var(--dusty); text-transform:uppercase; margin-bottom:8px; }
  header h1 { font-size:clamp(36px,8vw,64px); font-weight:400; font-style:italic; color:#1c140e; line-height:1.1; }
  header .subtitle { font-family:'DM Mono',monospace; font-size:9px; color:var(--sage); letter-spacing:0.2em; margin-top:10px; text-transform:uppercase; }
  .divider { width:40px; height:1px; background:var(--warm); margin:18px auto; }
  .progress-wrap { max-width:960px; margin:0 auto 28px; display:flex; align-items:center; gap:12px; }
  .progress-bar { flex:1; height:2px; background:var(--light-sage); border-radius:2px; overflow:hidden; }
  .progress-fill { height:100%; background:var(--sage); border-radius:2px; transition:width 0.5s; width:0%; }
  .progress-label { font-family:'DM Mono',monospace; font-size:9px; color:var(--dusty); letter-spacing:0.15em; white-space:nowrap; }
  .edit-hint { text-align:center; font-family:'DM Mono',monospace; font-size:9px; color:var(--dusty); letter-spacing:0.15em; margin-bottom:20px; opacity:0.7; }
  .grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; max-width:960px; margin:0 auto; }
  .card.single { grid-column: 1 / -1; max-width: calc(50% - 7px); margin: 0 auto; }
  .card { background:#FAF6EC; border-radius:6px; overflow:hidden; position:relative; box-shadow:0 2px 12px rgba(0,0,0,0.06); transition:transform 0.4s,box-shadow 0.4s,opacity 0.4s; }
  .card:hover { transform:translateY(-3px); box-shadow:0 10px 28px rgba(0,0,0,0.09); }
  .card.done { opacity:0.4; filter:grayscale(0.7); transition: opacity 0.3s ease, filter 0.3s ease; }
  .card.done .task-title { text-decoration: line-through; text-decoration-color: currentColor; }
  .card { transition: opacity 0.3s ease, filter 0.3s ease; }
  @keyframes fadeUp { from{opacity:0;transform:translateY(18px)} to{opacity:1;transform:translateY(0)} }
  .card-visual { height:120px; display:flex; align-items:center; justify-content:center; position:relative; }
  .theme-warm{background:linear-gradient(135deg,#f8f4ee,#ede5d8)} .theme-sage{background:linear-gradient(135deg,#eef1ee,#dde6dd)} .theme-lavender{background:linear-gradient(135deg,#f0edf8,#e4dff0)} .theme-blush{background:linear-gradient(135deg,#f8f2ee,#ede0d6)} .theme-amber{background:linear-gradient(135deg,#f5f0e4,#e8dfc8)} .theme-mint{background:linear-gradient(135deg,#eef4ee,#d8ecda)}
  .done-check { position:absolute; top:10px; right:10px; width:22px; height:22px; border-radius:50%; border:1.5px solid var(--dusty); background:rgba(255,255,255,0.88); cursor:pointer; z-index:10; display:flex; align-items:center; justify-content:center; transition:background 0.2s,border-color 0.2s,transform 0.15s; }
  .done-check:active { transform:scale(0.85); }
  .done-check.checked { background:var(--sage); border-color:var(--sage); }
  .done-check .checkmark { display:none; width:11px; height:9px; }
  .done-check.checked .checkmark { display:block; }
  .card-body { padding:14px 16px 16px; border-top:1px solid #f0ece6; position:relative; }
  .task-num { font-family:'DM Mono',monospace; font-size:9px; color:var(--dusty); letter-spacing:0.2em; text-transform:uppercase; margin-bottom:3px; }
  .task-title { font-size:16px; font-weight:400; font-style:italic; color:var(--dark); line-height:1.2; margin-bottom:5px; }
  .task-desc { font-family:'DM Mono',monospace; font-size:9px; color:var(--dusty); line-height:1.6; letter-spacing:0.02em; }
  .task-meta { margin-top:12px; }
  .task-meta::before { content:'GOAL'; font-family:'DM Mono',monospace; font-size:7px; letter-spacing:0.25em; color:var(--sage); text-transform:uppercase; display:block; margin-bottom:3px; }
  .task-goal { font-family:'DM Mono',monospace; font-size:9px; color:var(--dark); letter-spacing:0.05em; line-height:1.5; display:block; }
  .task-target { font-family:'Newsreader',serif; font-size:13px; font-style:italic; font-weight:300; color:var(--dusty); opacity:0.65; display:block; text-align:center; margin-top:10px; }
  .subtask { display:flex; align-items:center; justify-content:space-between; gap:8px; cursor:pointer; line-height:1.8; width:100%; }
  .subtask input[type="checkbox"] { appearance:none; -webkit-appearance:none; width:12px; height:12px; border-radius:50%; border:1.5px solid var(--dusty); background:white; cursor:pointer; flex-shrink:0; order:2; transition:background 0.2s; }
  .subtask input[type="checkbox"]:checked { background:var(--sage); border-color:var(--sage); }
  .subtask.done-subtask { opacity:0.65; text-decoration: line-through; text-decoration-color:var(--sage); }
  .subtask.cancelled { opacity:0.45; text-decoration: line-through; text-decoration-color:var(--dusty); cursor:default; }
  [contenteditable] { outline:none; cursor:text; border-radius:2px; transition:background 0.15s; }
  [contenteditable]:focus { background:rgba(212,221,209,0.2); }

  /* Edit mode visual indicators */
  body.editing .card { outline: 1px dashed rgba(138,158,133,0.3); }
  body.editing [contenteditable="true"] { background: rgba(212,221,209,0.15); padding: 2px 4px; border-radius: 3px; }
  body.editing [contenteditable="true"]:hover { background: rgba(212,221,209,0.3); }
  .add-subtask-btn, .add-task-btn, .add-timeblock-btn, .add-section-btn { display: block; margin: 8px 0 0; padding: 4px 10px; background: transparent; border: 1px dashed var(--light-sage); border-radius: 4px; font-family: 'DM Mono', monospace; font-size: 9px; letter-spacing: 0.1em; color: var(--dusty); cursor: pointer; text-transform: lowercase; transition: all 0.15s; }
  .add-subtask-btn:hover, .add-task-btn:hover, .add-timeblock-btn:hover, .add-section-btn:hover { background: var(--light-sage); color: var(--accent); }
  .add-info-btn { display: none; align-items: center; justify-content: center; margin: 0 4px; padding: 0 4px; height: 14px; min-width: 16px; background: transparent; border: 1px dashed var(--light-sage); border-radius: 8px; font-family: 'DM Mono', monospace; font-size: 8px; color: var(--dusty); cursor: pointer; line-height: 1; flex: 0 0 auto; }
.add-pin-btn { display: none; align-items: center; justify-content: center; margin: 0 2px; padding: 0; height: 16px; min-width: 16px; background: transparent; border: none; font-size: 11px; cursor: pointer; line-height: 1; flex: 0 0 auto; opacity: 0.6; }
.add-pin-btn:hover { opacity: 1; }
.delete-btn { display: none; align-items: center; justify-content: center; margin: 0 2px; padding: 0; height: 16px; min-width: 16px; background: transparent; border: 1px solid #c08484; border-radius: 50%; font-family: 'DM Mono', monospace; font-size: 11px; color: #b04444; cursor: pointer; line-height: 1; flex: 0 0 auto; }
.delete-btn:hover { background: #b04444; color: white; }
.add-task-here-btn { display: none; margin: 4px 0 8px; padding: 3px 8px; background: transparent; border: 1px dashed var(--sage); border-radius: 4px; font-family: 'DM Mono', monospace; font-size: 9px; letter-spacing: 0.1em; color: var(--sage); cursor: pointer; opacity: 0.7; align-self: flex-start; }
.add-task-here-btn:hover { background: var(--light-sage); color: var(--accent); opacity: 1; }
/* Show edit buttons ONLY in edit mode */
body.editing .add-info-btn,
body.editing .add-pin-btn,
body.editing .delete-btn { display: inline-flex; }
body.editing .add-task-here-btn { display: block; }
.rollover-btn { display: block; margin: 12px auto 4px; padding: 6px 14px; background: transparent; border: 1px dashed var(--warm); border-radius: 16px; font-family: 'DM Mono', monospace; font-size: 9px; letter-spacing: 0.15em; text-transform: lowercase; color: var(--warm); cursor: pointer; opacity: 0.65; transition: all 0.2s; position: relative; z-index: 10; pointer-events: auto !important; -webkit-tap-highlight-color: rgba(196,168,130,0.3); -webkit-touch-callout: none; visibility: visible !important; }
/* rollover always visible */

.day-block.collapsed .rollover-btn { display: block; }
  .add-info-btn:hover { background: var(--light-sage); color: var(--accent); }
  .export-btn { display: none !important; }
  body.editing .export-btn { display: inline-flex !important; }
  .add-timeblock-btn { border-color: var(--accent); opacity: 0.6; }
  .add-timeblock-btn:hover { opacity: 1; }

  /* Drag and drop in edit mode */
  body.editing .day-task-item, body.editing .task-group-label { cursor: grab; position: relative; }
  body.editing .day-task-item:active, body.editing .task-group-label:active { cursor: grabbing; }
  body.editing .day-task-item::before, body.editing .task-group-label::before { content: "⋮⋮"; position: absolute; left: -12px; top: 50%; transform: translateY(-50%); color: var(--dusty); opacity: 0.4; font-size: 10px; letter-spacing: -2px; line-height: 0.5; pointer-events: none; }
  .dragging { opacity: 0.4; transform: scale(0.98); }
  .drag-ready { background: rgba(212,221,209,0.3) !important; outline: 1px dashed var(--accent); }
  .drag-over-top { box-shadow: 0 -2px 0 var(--accent); }
  .drag-over-bottom { box-shadow: 0 2px 0 var(--accent); }
  .dragging { opacity: 0.4; }
  .drag-over-top { border-top: 2px solid var(--sage); }
  .drag-over-bottom { border-bottom: 2px solid var(--sage); }

  /* Make time-block labels easier to edit — remove uppercase transform in edit mode */
  body.editing .task-group-label { text-transform: none !important; letter-spacing: 0.1em !important; font-size: 11px !important; padding: 4px 8px !important; }

  /* Drag handles and drag-reorder styling */
  body.editing .day-task-item, body.editing .task-group-label { position: relative; cursor: grab; }
  body.editing .day-task-item::before, body.editing .task-group-label::before {
    content: '⋮⋮'; position: absolute; left: -14px; top: 50%; transform: translateY(-50%);
    font-family: 'DM Mono', monospace; font-size: 10px; color: var(--dusty); opacity: 0.4;
    cursor: grab; padding: 4px; line-height: 1;
  }
  body.editing .day-task-item:hover::before, body.editing .task-group-label:hover::before { opacity: 0.9; }
  .dragging { opacity: 0.4 !important; cursor: grabbing !important; }
  .drag-over-top { border-top: 2px solid var(--sage) !important; }
  .drag-over-bottom { border-bottom: 2px solid var(--sage) !important; }
  .editing-badge { position: fixed; top: 20px; right: 20px; background: var(--sage); color: white; padding: 6px 14px; border-radius: 20px; font-family: 'DM Mono', monospace; font-size: 9px; letter-spacing: 0.15em; text-transform: uppercase; opacity: 0; pointer-events: none; transition: opacity 0.3s; z-index: 100; }
  body.editing .editing-badge { opacity: 1; }
  /* saveToClaude button CSS archived to _archive/save-to-claude.html on 2026-05-20 */
.edit-toggle { position:fixed; bottom:24px; right:24px; background:var(--dark); color:var(--cream); font-family:'DM Mono',monospace; font-size:9px; letter-spacing:0.15em; text-transform:uppercase; padding:8px 16px; border-radius:20px; border:none; cursor:pointer; z-index:100; box-shadow:0 4px 16px rgba(0,0,0,0.2); transition:background 0.2s; }
  
  /* Long-press action menu */
  .action-menu {
    position: fixed;
    background: white;
    border: 1px solid var(--light-sage);
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.18);
    padding: 4px;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    min-width: 160px;
    font-family: 'DM Mono', monospace;
    font-size: 11px;
    letter-spacing: 0.05em;
    overflow: hidden;
  }
  .action-menu-item {
    padding: 9px 14px;
    cursor: pointer;
    color: var(--dark);
    background: transparent;
    border: none;
    text-align: left;
    border-radius: 4px;
    transition: background 0.15s;
    text-transform: lowercase;
    font-family: inherit;
    font-size: inherit;
    letter-spacing: inherit;
  }
  .action-menu-item:hover, .action-menu-item:active {
    background: var(--light-sage);
    color: var(--accent);
  }
  .action-menu-item.danger {
    color: #b04444;
  }
  .action-menu-item.danger:hover, .action-menu-item.danger:active {
    background: #f4dada;
    color: #8a3a3a;
  }
  .action-menu-divider {
    height: 1px;
    background: var(--light-sage);
    margin: 3px 0;
    opacity: 0.5;
  }
  .action-menu-backdrop {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.04);
    z-index: 9998;
  }
  
  /* Remove-info button (edit mode) — small × next to [i] toggles */
  .remove-info-btn {
    display: none;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #b04444;
    color: white;
    font-family: 'DM Mono', monospace;
    font-size: 9px;
    line-height: 12px;
    text-align: center;
    border: none;
    cursor: pointer;
    margin: 0 2px 0 -2px;
    padding: 0;
    flex: 0 0 auto;
    vertical-align: middle;
  }
  body.editing .remove-info-btn { display: inline-block; }
  .edit-toggle.active { background:var(--sage); }
  .export-btn { right:110px !important; padding:8px 12px !important; font-size:14px !important; background:var(--sage) !important; }
  .export-btn.flash { background:#4a5840 !important; }
  .export-btn.flash::after { content:' copied'; font-size:9px; font-family:'DM Mono',monospace; letter-spacing:0.15em; text-transform:uppercase; margin-left:4px; }
  .section-label { grid-column:1/-1; font-family:'DM Mono',monospace; font-size:12px; letter-spacing:0.3em; text-transform:uppercase; color:var(--dusty); padding:20px 0 8px; border-bottom:1px solid var(--light-sage); margin-bottom:4px; text-align:center; }
  footer { text-align:center; margin-top:40px; font-family:'DM Mono',monospace; font-size:9px; color:var(--dusty); letter-spacing:0.2em; text-transform:uppercase; }

  /* ── Schedule ── */
  .schedule-section { max-width:min(1400px, calc(100vw - 40px)); margin:60px auto 0; }
  .schedule-header { text-align:center; margin-bottom:40px; }
  .schedule-header .eyebrow { font-family:'DM Mono',monospace; font-size:9px; letter-spacing:0.25em; color:var(--dusty); text-transform:uppercase; margin-bottom:6px; }
  .schedule-header h2 { font-size:36px; font-weight:400; font-style:italic; color:#1c140e; }
  .schedule-header .sub { font-family:'DM Mono',monospace; font-size:9px; color:var(--dusty); letter-spacing:0.15em; margin-top:8px; text-transform:uppercase; }
  .timeline { position:relative; padding-left:24px; }
  .timeline::before { content:''; position:absolute; left:0; top:0; bottom:0; width:1px; background:var(--light-sage); }
  .day-block { position:relative; margin-bottom:24px; }
  .day-block.past .day-card { opacity:0.85; }
  .day-block.past .day-title { text-decoration: line-through; text-decoration-color:var(--dusty); }
  .day-block.past .day-task-item.checked-item { text-decoration: line-through; text-decoration-color:var(--dusty); opacity:0.6; }
  .day-block.past .day-dot { background:var(--dusty) !important; box-shadow:none !important; }
  .day-dot { position:absolute; left:-28px; top:16px; width:8px; height:8px; border-radius:50%; background:var(--light-sage); border:1.5px solid var(--sage); cursor: pointer; transition: transform 0.2s ease, box-shadow 0.2s ease; z-index: 5; }
  .day-dot:hover { transform: scale(1.3); box-shadow: 0 0 0 4px rgba(138,158,133,0.15); }
  .day-block.collapsed .day-card { box-shadow:none; background:transparent !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; border:none !important; }
  .day-block.collapsed .day-card.depart-card .day-date { color: var(--dark); }
  .day-block.collapsed .day-card .day-tasks { display: none; }
  .day-block.collapsed .day-card .day-note { display: none; }
  .day-block.collapsed .day-dot { background: var(--cream); }
  .day-block.collapsed .day-card-header { border-bottom: none; padding-left: 0; padding-right: 0; justify-content: space-between; text-shadow: none; }
  .day-block.collapsed .day-title { display: none; }
  .day-block.collapsed .day-badge { display: none; }
  .day-block.collapsed .day-count { margin-left: auto; }

  /* Expandable tasks: chevron sits below task on its own row; extras appear to the right of chevron when expanded */
  .day-task-item.expandable { flex-wrap: wrap; }
  .day-task-item.expandable .day-task-text { flex: 1; min-width: 0; }
  .task-chevron-row { flex-basis: 100%; display: flex; align-items: flex-start; gap: 8px; padding: 0 0 0 32px; margin: 0; line-height: 1.5; order: 3; min-height: 24px; }
  .task-chevron { font-family: 'DM Mono', monospace; font-size: 12px; color: var(--dusty); opacity: 0.5; cursor: pointer; padding: 0 4px; transition: opacity 0.2s ease; user-select: none; line-height: 1.5; flex: 0 0 auto; align-self: flex-start; letter-spacing: -1px; min-height: 24px; display: inline-flex; align-items: center; }
  .task-chevron:hover { opacity: 1; }
  .day-task-item.expandable.expanded > .task-chevron-row > .task-chevron,
  .task-subtask.expandable-sub.expanded > .task-chevron-row > .task-chevron { opacity: 0.85; }
  .day-task-item.expandable .task-extras { display: none; flex: 1; }
  .day-task-item.expandable.expanded > .task-chevron-row > .task-extras { display: flex; flex-direction: column; gap: 0; margin: 0; }
  .task-purpose { display: block; }
  /* Purpose: inline next to task name, toggleable via i icon */
  .day-task-item.has-purpose { gap: 0; }
  .day-task-item.has-purpose .day-task-text { flex: 0 0 auto; margin-right: 0; }
  .day-task-item.has-purpose .purpose-toggle {
    display: inline-flex; align-items: center; justify-content: center;
    width: 12px; height: 12px;
    border: 1px solid var(--sage);
    border-radius: 50%;
    color: var(--sage);
    font-family: 'Newsreader', 'Georgia', serif;
    font-style: italic;
    font-size: 9px;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    user-select: none;
    flex: 0 0 auto;
    margin-left: 2px;
    margin-right: auto;
    transition: background 0.2s ease, color 0.2s ease;
  }
  .day-task-item.has-purpose .purpose-toggle:hover { background: var(--sage); color: white; }
  .day-task-item.has-purpose.purpose-shown .purpose-toggle { background: var(--sage); color: white; margin-right: 0; }
  .day-task-item.has-purpose .purpose-content {
    display: none;
    flex: 0 1 auto;
    color: var(--dusty);
    font-size: 0.9em;
    margin-left: 8px;
    margin-right: auto;
    padding: 2px 8px;
    background: rgba(138,158,133,0.08);
    border-radius: 4px;
    line-height: 1.3;
  }
  .day-task-item.has-purpose.purpose-shown .purpose-content { display: inline-block; }

  /* Multi-attribute toggle badges (location, prescriber, action) */
  .day-task-item.has-attrs { gap: 0; flex-wrap: wrap; align-items: center; }
  .day-task-item.has-attrs .day-task-text { flex: 0 0 auto; margin-right: 2px; }
  .day-task-item.has-attrs .attr-toggle {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 10px; height: 14px;
    padding: 0 2px;
    color: var(--sage);
    background: transparent;
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 13px;
    line-height: 1;
    cursor: pointer;
    user-select: none;
    flex: 0 0 auto;
    margin-left: 1px;
    margin-right: 2px;
    font-weight: 600;
  }
  .day-task-item.has-attrs .attr-toggle:hover { color: var(--dark); }
  .day-task-item.has-attrs .attr-toggle.shown { color: var(--dark); font-weight: 700; }
  .day-task-item.has-attrs .attr-content {
    display: none;
    color: var(--dusty);
    font-size: 0.85em;
    margin-right: 6px;
    padding: 1px 6px;
    background: rgba(138,158,133,0.08);
    border-radius: 3px;
  }
  .day-task-item.has-attrs .attr-content.shown { display: inline-block; flex: 0 1 auto; max-width: 100%; }
  .day-task-item.has-attrs > .agenda-check { margin-left: auto; }
  
  /* When attr-content is shown in subtask, it should wrap to next line */
  .task-subtask.has-attrs .attr-content.shown { flex: 0 1 auto; max-width: 100%; }

  .day-task-item.has-attrs .attr-toggle[title="action"] {
    font-family: 'DM Mono', monospace;
    font-style: normal;
    font-size: 14px;
    opacity: 0.7;
    font-weight: 400;
  }
  .task-subtask.has-attrs .attr-toggle[title="action"] {
    font-family: 'DM Mono', monospace;
    font-style: normal;
    font-size: 14px;
    opacity: 0.7;
    font-weight: 400;
  }

  /* No background variant for attr-content (override the sage tint) */
  .attr-content.no-bg { background: transparent !important; }

  /* Priority — hand-drawn SVG pin in left margin */
  .day-task-item.priority,
  .task-subtask.priority {
    position: relative;
  }
  /* Pin appears as a pseudo-element on the task text itself, so it sits inline right after the name */
  .day-task-item.priority > .day-task-text::after,
  .task-subtask.priority > .day-task-text::after {
    content: " priority";
    font-family: 'DM Mono', monospace;
    font-size: 8px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #b04444;
    opacity: 0.75;
    vertical-align: middle;
    margin-left: 4px;
  }
  
  /* has-priority-child no longer cascades visual indicator to parent */
  
  /* Priority subtask within Adderall grid - span full row but content-aligned */
  .day-task-item.adderall-toggle .adderall-grid .task-subtask.priority {
    grid-column: 1 / -1;
    width: 100%;
    box-sizing: border-box;
    justify-content: flex-start;
  }
  .day-task-item.adderall-toggle .adderall-grid .task-subtask.priority > .day-task-text {
    flex: 0 0 auto !important;
  }
  .day-task-item.adderall-toggle .adderall-grid .task-subtask.priority > .agenda-subcheck {
    margin-left: 6px !important;
  }

  /* Subtask that should not wrap: spans full row but text sizes to content (not stretched) */
  .day-task-item.adderall-toggle .adderall-grid .task-subtask.no-wrap {
    grid-column: 1 / -1;
    width: auto;
    white-space: nowrap;
  }
  .day-task-item.adderall-toggle .adderall-grid .task-subtask.no-wrap > .day-task-text {
    flex: 0 0 auto;
    white-space: nowrap;
  }
  
  /* Has-priority-child: removed gold underline */
  .day-task-item.has-priority-child:not(.expanded) > .day-task-text {
  }

  /* Flowchart styling for workflow-style subtasks */
  .task-subtask.flowchart-task {
    grid-column: 1 / -1;
    width: 100%;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 4px;
    flex-wrap: wrap;
    padding: 4px 0;
    background: transparent;
    border: none;
    margin: 4px 0;
    overflow-wrap: break-word;
  }
  .task-subtask.flowchart-task > * {
    margin: 0 !important;
    flex: 0 0 auto;
  }
  .task-subtask.flowchart-task .flow-node {
    font-family: 'Reenie Beanie', cursive;
    font-size: 18px;
    color: var(--dark);
    padding: 0;
    background: transparent;
    border: none;
    line-height: 1.2;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 4px;
  }
  .task-subtask.flowchart-task .flow-node.priority > span::after {
    content: " priority";
    font-family: 'DM Mono', monospace;
    font-size: 8px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #b04444;
    opacity: 0.75;
    vertical-align: middle;
    margin-left: 4px;
  }
  .task-subtask.flowchart-task .flow-node > span {
    flex: 0 0 auto;
  }
  .task-subtask.flowchart-task .flow-node > input[type="checkbox"].agenda-subcheck {
    flex: 0 0 auto;
    width: 11px;
    height: 11px;
  }
  .task-subtask.flowchart-task .flow-node.flow-target {
    background: transparent;
    border: none;
    color: var(--dark);
    font-weight: 400;
  }
  .task-subtask.flowchart-task .flow-arrow {
    font-family: 'DM Mono', monospace;
    color: var(--sage);
    font-size: 14px;
    opacity: 0.6;
    flex: 0 0 auto;
  }
  .task-subtask.flowchart-task .flow-node.hidden,
  .task-subtask.flowchart-task .flow-arrow.hidden { display: none; }
  .task-subtask.flowchart-task .flow-expand {
    font-family: 'Newsreader', serif;
    font-style: italic;
    color: var(--sage);
    font-size: 16px;
    margin-left: 4px;
    cursor: pointer;
    opacity: 0.7;
    user-select: none;
    flex: 0 0 auto;
  }
  .task-subtask.flowchart-task .flow-expand.hidden { display: none; }
  .task-subtask.flowchart-task .agenda-subcheck {
    margin-left: auto;
  }

  /* Toggle-plus indicator — shown only when adderall-toggle is collapsed */
  .toggle-plus {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 14px;
    font-weight: 600;
    color: var(--sage);
    margin-left: 5px;
    margin-right: auto;
    flex: 0 0 auto;
    line-height: 1;
    opacity: 0.6;
  }
  .day-task-item.adderall-toggle.expanded .toggle-plus {
    display: none;
  }
  /* Italicize task text when collapsed */
  .day-task-item.adderall-toggle:not(.expanded) > .day-task-text {
  }

  /* Subtask fraction badge — completed/total, shown next to parent checkbox */
  .day-task-item.adderall-toggle > .subtask-frac {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-weight: 300;
    font-size: 13px;
    color: var(--sage);
    margin-left: auto;
    margin-right: 6px;
    flex: 0 0 auto;
    line-height: 1;
    opacity: 0.7;
    order: 97;
  }

  /* When fraction badge IS present (subchecks exist), tighten the gap and don't use auto on cb */
  .day-task-item.adderall-toggle > .subtask-frac {
    margin-left: auto !important;
  }
  .day-task-item.adderall-toggle > .subtask-frac + .agenda-check {
    margin-left: 6px !important;
  }

  /* Partial-completion: sage dot inside parent's checkbox when at least one subtask is checked */
  .agenda-check.partial {
    background: white !important;
    border-color: var(--sage) !important;
    position: relative;
  }
  .agenda-check.partial::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 6px;
    height: 6px;
    background: var(--sage);
    border-radius: 50%;
  }

  /* Timed block — option 8: time as corner tag with dashed border */
  /* Timed task — yellow background, time inline left of checkbox */
  .day-task-item.timed-task {
    background: rgba(218,180,78,0.18);
    border-radius: 4px;
    padding: 1px 10px;
    margin: 8px 0;
  }
  .day-task-item.timed-task .task-time-inline {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 14px;
    color: #8a6d1f;
    margin-left: auto;
    margin-right: 4px;
    flex: 0 0 auto;
    letter-spacing: 0.02em;
    white-space: nowrap;
    order: 98;
  }
  /* Time-inline also works inside flow-step (e.g. Fajr / PSY-623 prayer-time entries) */
  .flow-chart-card .flow-step .task-time-inline {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 14px;
    color: #8a6d1f;
    margin-left: auto;
    flex: 0 0 auto;
    letter-spacing: 0.02em;
    white-space: nowrap;
  }
  /* === Fraction badge / time / check ordering — consolidated === */
  /* Fraction goes far right, with time + check immediately after */
  .day-task-item.adderall-toggle > .subtask-frac {
    margin-left: auto !important;
    margin-right: 6px !important;
    order: 97;
    flex-shrink: 0;
  }
  /* Time and check live after fraction in visual order */
  .day-task-item .task-time-inline { order: 98; flex-shrink: 0; }
  .day-task-item > .agenda-check { order: 99; }
  /* When fraction is present: time loses its auto-margin so fraction stays right-aligned */
  .day-task-item.adderall-toggle:has(> .subtask-frac) > .task-time-inline {
    margin-left: 0 !important;
  }
  /* When fraction is present: check sits tight, not auto-pushed (fraction already pushed right) */
  .day-task-item.adderall-toggle:has(> .subtask-frac) > .agenda-check {
    margin-left: 6px !important;
  }
  /* When NO fraction: check itself takes auto-margin to sit right */
  .day-task-item.adderall-toggle:not(:has(> .subtask-frac)) > .agenda-check {
    margin-left: auto !important;
  }
  /* Adderall grid always wraps to a new row beneath, after the check */
  .day-task-item.adderall-toggle > .adderall-grid {
    flex-basis: 100%;
    order: 100;
  }
  /* For timed-task adderall-toggle: keep parent text from growing so fraction has room */
  .day-task-item.timed-task.adderall-toggle > .day-task-text {
    flex: 0 0 auto;
    min-width: 0;
  }

  /* When timed-task also has attrs, keep time on right and force it to not wrap */
  .day-task-item.timed-task.has-attrs:not(.adderall-toggle) {
    flex-wrap: nowrap;
    align-items: center;
  }
  /* When timed-task is also adderall-toggle: parent row stays single-line always; grid drops below as separate block */
  .day-task-item.timed-task.has-attrs.adderall-toggle {
    flex-wrap: wrap;
    align-items: center;
  }
  /* Parent's own children stay on first row (text + attrs + time + checkbox) */
  .day-task-item.timed-task.has-attrs.adderall-toggle > .day-task-text,
  .day-task-item.timed-task.has-attrs.adderall-toggle > .attr-toggle,
  .day-task-item.timed-task.has-attrs.adderall-toggle > .attr-content,
  .day-task-item.timed-task.has-attrs.adderall-toggle > .task-time-inline,
  .day-task-item.timed-task.has-attrs.adderall-toggle > .agenda-check {
    align-self: center;
  }
  /* Subtask grid takes a brand new row, full-width, below */
  .day-task-item.timed-task.has-attrs.adderall-toggle > .adderall-grid {
    flex-basis: 100%;
    width: 100%;
    order: 100;
  }
  .day-task-item.timed-task.has-attrs .task-time-inline {
    order: 98;
  }
  .day-task-item.timed-task.has-attrs > .agenda-check {
    order: 99;
    margin-left: 8px;
  }

  /* Sub-section labels — smaller, indented, less prominent than main section labels */
  .task-group-label.sub-section {
    font-family: 'DM Mono', monospace !important;
    font-size: 8px !important;
    letter-spacing: 0.18em !important;
    text-transform: uppercase !important;
    color: #5C7257 !important;
    background: rgba(138,158,133,0.15) !important;
    padding: 3px 10px !important;
    border-radius: 10px !important;
    margin: 8px auto 4px !important;
    display: inline-block !important;
    font-weight: 500 !important;
    opacity: 1 !important;
    /* center via flex parent if it is a flex column */
    align-self: center !important;
  }

  /* Apply has-attrs styling to task-subtask too (for nested attribute badges in Adderall grid) */
  .task-subtask.has-attrs { gap: 0; flex-wrap: nowrap; align-items: center; }
  .task-subtask.has-attrs .day-task-text { flex: 0 0 auto; margin-right: 6px; }
  .task-subtask.has-attrs .attr-toggle {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 12px; height: 14px;
    padding: 0 3px;
    color: var(--sage);
    background: transparent;
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 13px;
    line-height: 1;
    cursor: pointer;
    user-select: none;
    flex: 0 0 auto;
    margin-right: 3px;
    font-weight: 600;
  }
  .task-subtask.has-attrs .attr-toggle:hover { color: var(--dark); }
  .task-subtask.has-attrs .attr-toggle.shown { color: var(--dark); font-weight: 700; }
  .task-subtask.has-attrs .attr-content {
    display: none;
    color: var(--dusty);
    font-size: 0.85em;
    margin-right: 6px;
    padding: 1px 6px;
    background: rgba(138,158,133,0.08);
    border-radius: 3px;
  }
  .task-subtask.has-attrs .attr-content.shown { display: inline-block; }
  .task-subtask.has-attrs > .agenda-subcheck { margin-left: auto; }

  /* Adderall toggle — tap parent to expand/collapse, subtasks in 2 columns */
  .day-task-item.adderall-toggle { cursor: pointer; flex-wrap: wrap; }
  /* Override flex:1 on day-task-text inside adderall-toggle so badge sits right next to text */
  .day-task-item.adderall-toggle > .day-task-text { flex: 0 0 auto; }
  .toggle-indicator {
    font-family: 'DM Mono', monospace;
    font-size: 11px;
    color: var(--sage);
    font-weight: 500;
    margin-left: 2px;
    margin-right: auto;
    flex: 0 0 auto;
    line-height: 1;
  }
  .day-task-item.adderall-toggle .adderall-grid {
    display: none;
    flex-basis: 100%;
    grid-template-columns: 1fr 1fr;
    gap: 0 40px;
    margin-top: -4px;
    padding-left: 20px;
    order: 100;
  }
  .day-task-item.adderall-toggle.expanded .adderall-grid { display: grid; }
  .day-task-item.adderall-toggle .adderall-grid .task-subtask { 
    cursor: default;
    min-height: auto;
    padding: 0;
    line-height: 1;
    margin: 0;
  }
  /* Urgent subtasks within Adderall grid - red tint to highlight as urgent */
  .day-task-item.adderall-toggle .adderall-grid .task-subtask.urgent-sub {
    background: rgba(176,68,68,0.06);
    border-left: 2px solid #b04444;
    padding: 2px 6px;
    border-radius: 0 4px 4px 0;
  }

  /* Lifestyle 2-column split (shop / order) — Option C + D combo */
  .lifestyle-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    margin-top: 4px;
  }
  .lifestyle-col-label {
    display: block;
    font-family: 'DM Mono', monospace;
    font-size: 9px;
    letter-spacing: 0.1em;
    text-transform: lowercase;
    color: var(--dusty);
    text-align: center;
    margin-bottom: 4px;
    padding-top: 4px;
    opacity: 0.85;
  }
  .lifestyle-split .lifestyle-col {
    padding: 4px 10px;
    border-radius: 6px;
  }
  .lifestyle-split .lifestyle-col:first-child {
    margin-right: 0;
  }
  .lifestyle-split .lifestyle-col:last-child {
    padding-left: 10px;
  }
  .lifestyle-split .lifestyle-col:first-child .lifestyle-col-label {
    color: #b04444;
  }
  .lifestyle-split .lifestyle-col:last-child .lifestyle-col-label {
    color: #8c6e52;
  }

  /* Timeslot block — visually groups timeslot label with its tasks */
  .timeslot-block {
    border-left: 2px solid var(--sage);
    padding-left: 12px;
    margin: 12px 0;
    background: rgba(138,158,133,0.04);
    border-radius: 0 6px 6px 0;
    padding-top: 4px;
    padding-bottom: 4px;
    padding-right: 8px;
  }
  .timeslot-block .task-group-label { 
    margin-top: 0; 
    margin-bottom: 4px;
    text-align: left;
    background: transparent;
    padding-left: 0;
    color: var(--sage);
    opacity: 1;
  }

  /* Urgent label — always red, regardless of containing block */
  .task-group-label.urgent-label {
    color: #b04444 !important;
    background: rgba(176,68,68,0.1) !important;
    font-weight: 600;
  }
  .timeslot-block:has(.urgent-label) {
    border-left-color: #b04444;
    background: rgba(176,68,68,0.04);
  }
  .task-subtask { display: flex; align-items: center; justify-content: flex-start; padding: 0; gap: 6px; margin: 0; line-height: 1.5; font-size: inherit; min-height: 24px; }
  .task-subtask > .day-task-text { flex: 0 0 auto; }
  .task-subtask.expandable-sub { flex-wrap: wrap; align-items: center; padding: 0; margin: 0; line-height: 1.5; font-size: inherit; min-height: 24px; }
  .task-subtask.expandable-sub > .day-task-text { flex: 1; min-width: 0; }
  .task-subtask.expandable-sub > .task-chevron-row { flex-basis: 100%; display: flex; align-items: flex-start; gap: 8px; padding: 0 0 0 32px; margin: 0 0 0 0; line-height: 1.5; order: 3; }
  .task-subtask.expandable-sub .task-extras { display: none; flex: 1; }
  .task-subtask.expandable-sub.expanded > .task-chevron-row > .task-extras { display: flex; flex-direction: column; gap: 0; margin: 0; }
  .task-subtask.expandable-sub.expanded > .task-chevron-row > .task-chevron { opacity: 0.85; }
  .day-dot.depart { background:var(--dark); border-color:var(--dark); }
  .day-dot.buffer { background:var(--cream); border-color:var(--dusty); }
  .day-card { background:rgba(255,255,255,0.03); backdrop-filter:blur(16px) saturate(1.3); -webkit-backdrop-filter:blur(16px) saturate(1.3); border:1px solid rgba(255,255,255,0.1); border-radius:6px; box-shadow:0 1px 6px rgba(0,0,0,0.03); }
  .day-card.depart-card { background:var(--dark); }
  .day-card-header { padding:14px 16px 10px; display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; border-bottom:1px solid #f5f0ea; }
  .today-block .day-card-header, .featured-block .day-card-header { justify-content: space-between; }
  .today-block .day-card-header .day-badge, .featured-block .day-card-header .day-badge { margin: 0 auto; position: absolute; left: 50%; transform: translateX(-50%); }
  .today-block .day-card-header, .featured-block .day-card-header { position: relative; }
  .depart-card .day-card-header { border-bottom:1px solid rgba(255,255,255,0.1); }
  .day-date { font-family:"Cinzel",serif; font-size:13px; color:#1c140e; letter-spacing:0.12em; text-transform:uppercase; white-space:nowrap; opacity:1; margin-left:14px; text-shadow: 0 1px 0 rgba(255,248,236,0.5), 0 2px 8px rgba(18,10,6,0.4); }
  .today-block .day-date { font-size:13px !important; opacity:1; }
.featured-block .day-date { font-size:13px; opacity:1; }
  .day-title { font-family:'Newsreader',serif; font-size:20px; font-style:italic; font-weight:300; color:var(--dark); flex:1; letter-spacing:0.01em; }
  .depart-card .day-date,.depart-card .day-title { color:var(--cream); }
  .day-badge { font-family:'DM Mono',monospace; font-size:7px; letter-spacing:0.12em; padding:2px 8px; border-radius:20px; text-transform:uppercase; white-space:nowrap; }
  .today-block .day-badge, .featured-block .day-badge { font-size:11px; letter-spacing:0.18em; padding:5px 14px; }
  .badge-online { background:var(--light-sage); color:var(--accent); }
  .badge-inperson { background:#f0e8d8; color:#8C6E52; }
  .badge-depart { background:#2A2A25; color:#F5F0E8; }
  .badge-buffer { background:var(--light-sage); color:var(--dusty); }
  .badge-mixed { background:#eef1ee; color:var(--sage); }
  .day-tasks { padding:10px 16px 14px 16px; display:flex; flex-direction:column; gap:5px; }
  .today-block .day-tasks, .featured-block .day-tasks { padding-left: 14px; }

  /* Today's agenda - bigger text */
  .today-block .day-task-item, .featured-block .day-task-item { font-size: 16px; line-height: 1.5; padding-right: 0; color: var(--dark); font-weight: 400; }
  .today-block .day-task-item .day-task-text, .today-block .day-task-item .day-task-text span,
  .day-block[data-date="2026-04-28"] .day-task-item .day-task-text, .day-block[data-date="2026-04-28"] .day-task-item .day-task-text span { font-family: 'Reenie Beanie', cursive; font-size: 20px; color: var(--dark); font-weight: 400; }
  .today-block .task-subtask .day-task-text, .today-block .task-subtask .day-task-text span,
  .day-block[data-date="2026-04-28"] .task-subtask .day-task-text, .day-block[data-date="2026-04-28"] .task-subtask .day-task-text span { font-family: 'Reenie Beanie', cursive; font-size: 20px; color: var(--dark); font-weight: 400; }
  /* Smaller font for attr-content (toggle reveals) so long text doesn't overflow */
  .today-block .day-task-item .attr-content,
  .day-block[data-date="2026-04-28"] .day-task-item .attr-content,
  .today-block .task-subtask .attr-content,
  .day-block[data-date="2026-04-28"] .task-subtask .attr-content { font-family: 'Reenie Beanie', cursive; font-size: 15px; color: var(--dark); font-weight: 400; line-height: 1.2; max-width: 100%; word-wrap: break-word; white-space: normal; }
  .featured-block .day-task-item .day-task-text, .featured-block .day-task-item .day-task-text span { color: var(--dark); font-weight: 400; }
  /* Reenie Beanie applied to today's Adderalls section */
  .today-block .day-task-item.adderall-task .day-task-text, .today-block .day-task-item.adderall-task .day-task-text span { font-family: 'Reenie Beanie', cursive; font-size: 20px; color: var(--dark); font-weight: 400; }
  .today-block .day-task-item.compact, .featured-block .day-task-item.compact { font-size: 13px; line-height: 1.6; }
  .day-task-item.compact { font-size: 12px; line-height: 1.5; }
  .today-block .day-task-item > .agenda-check, .featured-block .day-task-item > .agenda-check { margin-left: auto; flex-shrink: 0; margin-right: -4px; }
  /* (was: today-block forced 11px — removed to allow soft & airy 17px) */
  .day-task-item { display:flex; gap:10px; align-items:flex-start; font-family:'Italiana','Cormorant Upright','Newsreader',serif; font-size:14px; color:var(--dusty); letter-spacing:0.02em; line-height:1.5; width:100%; padding-right:8px; padding-left:8px; box-sizing:border-box; margin-bottom:2px; transition: opacity 0.3s ease; flex-wrap: nowrap; }
  /* Expandable / adderall-toggle / has-purpose tasks need flex-wrap to allow subtask grid below */
  .day-task-item.expandable, .day-task-item.adderall-toggle, .day-task-item.has-purpose { flex-wrap: wrap; }
  /* Task name itself wraps internally instead of pushing checkbox down */
  .day-task-item > .day-task-text { min-width: 0; word-break: break-word; }
  .day-task-item:not(.timed):not(.green-highlight) { margin-left: 0; }
  .day-task-item:not(.timed):not(.green-highlight) > .agenda-check { margin-left: auto; flex-shrink: 0; }

  /* Checked state — noticeable fade + strikethrough */
  .day-task-item.checked-item { opacity: 0.35 !important; }
  .day-task-item.checked-item .day-task-text { text-decoration: line-through; text-decoration-color: currentColor; }
  
  /* Auto-fade when checkbox is checked (works without JS class) */
  .day-task-item:has(> .agenda-check:checked) { opacity: 0.4; }
  .day-task-item:has(> .agenda-check:checked) > .day-task-text { text-decoration: line-through; text-decoration-color: currentColor; }
  /* Non-flowchart subtask: fade whole subtask when checked */
  .task-subtask:not(.flowchart-task):has(.agenda-subcheck:checked) { opacity: 0.4; }
  /* Flowchart subtask: only the checked flow-node fades — not the whole row */
  .task-subtask.flowchart-task .flow-node:has(.agenda-subcheck:checked) { opacity: 0.4; }
  /* Non-flowchart subtask: when checked, strike through the text */
  .task-subtask:not(.flowchart-task):has(.agenda-subcheck:checked) .day-task-text { text-decoration: line-through; text-decoration-color: currentColor; }
  /* Flowchart subtask: only the specific flow-node whose checkbox is checked gets struck through */
  .task-subtask.flowchart-task .flow-node:has(.agenda-subcheck:checked) > span { text-decoration: line-through; text-decoration-color: currentColor; opacity: 0.6; }

  /* Collapsible card section */
  .collapsible-header { transition: opacity 0.15s; }
  .collapsible-header:hover { opacity: 0.7; }
  .chevron { display: inline-block; transition: transform 0.25s ease; font-size: 0.85em; color: var(--dusty); }
  .chevron.closed { transform: rotate(-90deg); }
  .collapsible-content { transition: max-height 0.4s ease, opacity 0.3s ease; overflow: hidden; max-height: 8000px; }
  .collapsible-content.collapsed { max-height: 0; opacity: 0; pointer-events: none; }

  /* Day task count badge */
  .day-count { font-family: 'DM Mono', monospace; font-size: 11px; letter-spacing: 0.15em; text-transform: uppercase; color: var(--dusty); opacity: 0.85; margin-left: 8px; white-space: nowrap; }
  .today-block .day-count, .featured-block .day-count { font-size: 11px; opacity: 1; }

  .day-task-text { flex: 1; min-width: 0; text-align: left; }
  .day-task-item .bullet { padding-top:1px; }
  .day-task-item > .agenda-check { margin-top:1px; flex-shrink:0; }
  .day-task-text { flex:1; }
  .agenda-check, .agenda-subcheck { flex-shrink:0; width:13px; height:13px; border-radius:50%; border:1.5px solid var(--light-sage); background:white; cursor:pointer; appearance:none; -webkit-appearance:none; transition:background 0.2s,border-color 0.2s; }
  span.subchecked { opacity: 0.35 !important; transition: opacity 0.2s; }
  .agenda-check:checked, .agenda-subcheck:checked { background: white; border-color: var(--sage); position: relative; }
  .agenda-check:checked::after, .agenda-subcheck:checked::after {
    content: "✓";
    position: absolute;
    top: -8px;
    left: -1px;
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-weight: 300;
    font-size: 24px;
    color: var(--sage);
    line-height: 1;
    transform: skewX(-10deg);
    border: none;
  }
  /* X-mark variant: same style as checkmark, but ✕ glyph nudged 2px left */
  .agenda-check.x-mark:checked::after,
  .agenda-subcheck.x-mark:checked::after {
    content: "✕" !important;
    transform: skewX(-10deg) translateX(-2px) !important;
  }

  /* subcheck styled with check above */
  .bullet { display: none !important; }
  .day-note { font-family:'DM Mono',monospace; font-size:8px; color:var(--dusty); font-style:italic; padding:0 16px 12px; opacity:0.6; letter-spacing:0.05em; }
  .depart-card .day-task-item { color:var(--cream); opacity:0.8; }
  .depart-card .day-note { color:var(--cream); opacity:0.5; }

  /* Today's card aesthetic upgrades */
  .task-group-label-wrap { text-align: center; margin: 18px 0 10px; display: block; } .task-group-label { font-family: 'DM Mono', monospace; font-style: normal; font-weight: 500; font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: #5C7257; opacity: 1; padding: 5px 14px; display: inline-block; text-align: center; background: rgba(138,158,133,0.22); border: none; border-radius: 4px; cursor: pointer; user-select: none; transition: background 0.2s ease; margin: 18px auto 10px; }
  .task-group-label:hover { opacity: 0.7; }
  .task-group-label.section-collapsed { opacity: 0.6; }
  .task-group-label.section-collapsed::after { content: " ▸"; opacity: 0.5; font-size: 7px; }
  .task-group-label.center { text-align: center; }
  .day-tasks > .task-group-label:first-child { margin-top: 6px; }
  .task-group-label.center { text-align: center; }
  .task-group-label.left { text-align: left; }
  .green-highlight ~ .task-group-label { margin-right: -8px; }
  .day-task-item.timed { background: #f8f4ee; border-radius: 4px; padding: 4px 8px; margin: 2px 0; }
  .day-task-item.timed .bullet { color: var(--warm); }
  .day-task-item.timed .bullet, .day-task-item.green-highlight .bullet { display: none; }
  .day-task-item.green-highlight { background: #eef2ea; border-radius: 4px; padding: 4px 8px 4px 16px; margin: 2px 0; }
  /* Make Money Zoom and Admin work look exactly the same */
  .day-task-item.green-highlight .bullet { color: var(--sage); }
  .day-task-item.green-highlight .day-task-text { text-align: center; }
  .day-task-item.timed.center-text .day-task-text { text-align: center; }
  .day-task-item.timed .day-task-text span span,
  .day-task-item.green-highlight .day-task-text span span { text-align: left; }

  .sched-footer { text-align:center; margin-top:40px; padding-bottom:40px; font-family:'DM Mono',monospace; font-size:9px; color:var(--dusty); letter-spacing:0.2em; text-transform:uppercase; }

  /* Archive */
  .archive-toggle { display: block; margin: 24px auto 0; padding: 8px 18px; background: transparent; border: 1px solid var(--light-sage); border-radius: 20px; font-family: 'DM Mono', monospace; font-size: 9px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--dusty); cursor: pointer; transition: all 0.2s; }
  .archive-toggle:hover { background: var(--light-sage); }
  .archive-section { max-height: 0; overflow: hidden; transition: max-height 0.4s ease; }
  .archive-section.open { max-height: 10000px; padding-top: 20px; }
  .archive-section .day-card-header { opacity: 0.7; }
  .archive-section .day-task-item { text-decoration: line-through; opacity: 0.5; }

  /* Agenda collapse */
  .agenda-body.collapsed { display: none !important; }
  .agenda-chevron { display: inline-block; font-size: 14px; margin-left: 8px; transition: transform 0.3s ease; color: var(--dusty); opacity: 0.6; }
  .agenda-chevron.closed { transform: rotate(-90deg); }
  .schedule-header.clickable:hover .agenda-chevron { opacity: 1; }
  .archive-label { font-family: 'DM Mono', monospace; font-size: 8px; letter-spacing: 0.25em; text-transform: uppercase; color: var(--dusty); opacity: 0.5; padding: 20px 0 10px; text-align: center; }

  /* Triage color system */
  .day-task-item.triage-high { background: transparent; color: inherit; border-radius: 0; padding: 0; margin: 0; font-weight: inherit; }
  .day-task-item.triage-med { background: transparent; border-radius: 0; padding: 0; margin: 0; }
  .day-task-item.triage-low { background: transparent; border-radius: 0; padding: 0; margin: 0; }
  .day-task-item.triage-high .bullet, .day-task-item.triage-med .bullet, .day-task-item.triage-low .bullet { display: none; }
  .day-task-item.triage-high .agenda-check, .day-task-item.triage-med .agenda-check, .day-task-item.triage-low .agenda-check { margin-left: auto; }
  .triage-legend { display: flex; justify-content: center; gap: 16px; margin: 0 0 14px; padding: 10px 0 4px; font-family: 'DM Mono', monospace; font-size: 8px; letter-spacing: 0.15em; text-transform: uppercase; opacity: 0.7; }
  .triage-legend .key { display: flex; align-items: center; gap: 6px; }
  .triage-legend .key .tag { width: 10px; height: 10px; border-radius: 50%; }
  .triage-legend .tag.high { background: #872a22; }
  .triage-legend .tag.med { background: #d4b85a; }
  .triage-legend .tag.low { background: #7a8f6a; }


  /* Allow text selection in editable content — drag should not interfere */
  .day-task-text, [contenteditable="true"] { -webkit-user-select: text !important; user-select: text !important; -webkit-user-drag: none; }
  body.editing .day-task-item { cursor: text; }
  body.editing .day-task-item[draggable="true"] { -webkit-user-drag: element; }


/* Athkar — pearly white, warm brown, MAX specificity */
  body .day-task-item.athkar-row { background: linear-gradient(135deg, #fafaf6 0%, #f5f3ec 50%, #faf8f1 100%) !important; box-shadow: 0 2px 8px rgba(138,158,133,0.08), inset 0 1px 0 rgba(255,255,255,0.8); border: 1px solid rgba(196,168,130,0.15); border-radius: 4px; padding: 6px 12px !important; margin: 4px 0; }
  body .day-task-item.athkar-row, body .day-task-item.athkar-row * { color: #4a5840 !important; }
  body .athkar-text { font-family: 'Reem Kufi Fun', 'Aref Ruqaa', 'Markazi Text', 'Amiri', serif !important; font-size: 17px !important; line-height: 1.6 !important; font-weight: 400 !important; letter-spacing: 0 !important; color: #4a5840 !important; text-align: right !important; flex: 1 !important; }

  .collapsible-section { padding: 12px 16px; background: rgba(212,221,209,0.15); border-radius: 6px; margin: 16px 0 10px; font-family: 'DM Mono', monospace; font-size: 9px; letter-spacing: 0.2em; color: var(--accent); text-transform: uppercase; transition: background 0.15s; }
  .collapsible-section:hover { background: rgba(212,221,209,0.3); }
  .arrival-chevron { display: inline-block; transition: transform 0.2s ease; }
  .arrival-chevron.closed { transform: rotate(-90deg); }
  .arrival-section { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; max-height: 5000px; overflow: hidden; transition: max-height 0.4s ease; }
  .arrival-section.collapsed { max-height: 0; }

  /* Research link inside expandable parent */
  .research-link {
    font-family: 'DM Mono', monospace;
    font-size: 11px;
    letter-spacing: 0.05em;
    color: var(--sage);
    text-decoration: none;
    cursor: pointer;
    transition: opacity 0.2s;
  }
  .research-link:hover, .research-link:active { opacity: 0.7; }

  /* Expanded day-cards stretch full width: from left timeline edge to right edge of schedule */
  .day-block:not(.collapsed) .day-card {
    margin-left: -24px;  /* escape the timeline's padding-left */
    margin-right: 0;
    width: calc(100% + 24px);  /* compensate for the negative margin so it reaches right edge */
    box-sizing: border-box;
  }
  /* Keep the day-dot positioning visible against the wider card */
  .day-block:not(.collapsed) .day-dot {
    z-index: 6;
  }

  /* === Rollover Picker Popup === */
  .rollover-picker-overlay {
    position: fixed;
    inset: 0;
    background: rgba(20, 20, 25, 0.55);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    font-family: 'DM Mono', monospace;
  }
  .rollover-picker-modal {
    background: #F0E8DA;
    border-radius: 8px;
    width: 100%;
    max-width: 480px;
    max-height: 80vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 8px 32px rgba(0,0,0,0.3);
    overflow: hidden;
  }
  .rollover-picker-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 18px;
    border-bottom: 1px solid rgba(0,0,0,0.08);
  }
  .rollover-picker-title {
    font-size: 11px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--dark);
  }
  .rollover-picker-close {
    background: transparent;
    border: none;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    color: var(--dusty);
    padding: 0 4px;
  }
  .rollover-picker-dest {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 18px;
    border-bottom: 1px solid rgba(0,0,0,0.08);
    background: rgba(0,0,0,0.02);
  }
  .rollover-picker-label {
    font-size: 10px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--dusty);
  }
  .rollover-picker-select {
    flex: 1;
    padding: 6px 8px;
    font-family: 'DM Mono', monospace;
    font-size: 11px;
    background: white;
    border: 1px solid rgba(0,0,0,0.15);
    border-radius: 4px;
    color: var(--dark);
  }
  .rollover-picker-actions-top {
    display: flex;
    gap: 8px;
    padding: 8px 18px;
    border-bottom: 1px solid rgba(0,0,0,0.05);
  }
  .rollover-picker-toggle-all,
  .rollover-picker-toggle-none {
    background: transparent;
    border: 1px dashed rgba(0,0,0,0.2);
    border-radius: 4px;
    padding: 4px 10px;
    font-family: 'DM Mono', monospace;
    font-size: 9px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--dusty);
    cursor: pointer;
  }
  .rollover-picker-toggle-all:hover,
  .rollover-picker-toggle-none:hover {
    background: rgba(0,0,0,0.04);
  }
  .rollover-picker-list {
    flex: 1;
    overflow-y: auto;
    padding: 10px 18px;
  }
  .rollover-picker-section {
    font-size: 9px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--sage);
    margin-top: 12px;
    margin-bottom: 6px;
    padding: 4px 6px;
    background: rgba(138,158,133,0.1);
    border-radius: 3px;
  }
  .rollover-picker-section:first-child {
    margin-top: 0;
  }
  .rollover-picker-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 4px;
    cursor: pointer;
    border-radius: 4px;
  }
  .rollover-picker-row:hover {
    background: rgba(0,0,0,0.04);
  }
  .rollover-picker-row:has(.rollover-picker-cb:checked) {
    background: rgba(154,132,86,0.22);
  }
  .rollover-picker-row:has(.rollover-picker-cb:checked) .rollover-picker-task-name {
    color: #5e5340;
    font-weight: 500;
  }
  .rollover-picker-cb {
    display: none;
    width: 14px;
    height: 14px;
    accent-color: var(--sage);
    cursor: pointer;
    flex-shrink: 0;
  }
  .rollover-picker-task-name {
    font-family: 'Reenie Beanie', cursive;
    font-size: 17px;
    color: var(--dark);
    line-height: 1.2;
  }
  .picker-roll .rollover-picker-task-name {
    font-family: 'Cormorant Upright', serif;
    font-size: 20px;
  }
  .picker-roll .rollover-picker-modal {
    background: rgba(128,50,60,0.65);
  }
  .rollover-picker-footer {
    display: flex;
    gap: 8px;
    padding: 12px 18px;
    border-top: 1px solid rgba(0,0,0,0.08);
    background: rgba(0,0,0,0.02);
  }
  .rollover-picker-cancel {
    background: transparent;
    border: 1px solid rgba(0,0,0,0.15);
    border-radius: 4px;
    padding: 6px 12px;
    font-family: 'DM Mono', monospace;
    font-size: 10px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--dusty);
    cursor: pointer;
  }
  .rollover-picker-roll-selected,
  .rollover-picker-roll-all {
    flex: 1;
    border: none;
    border-radius: 4px;
    padding: 8px 12px;
    font-family: 'DM Mono', monospace;
    font-size: 10px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: white;
    cursor: pointer;
  }
  .rollover-picker-roll-selected {
    background: var(--sage);
  }
  .rollover-picker-roll-all {
    background: var(--dark);
  }
  .rollover-picker-roll-selected:hover,
  .rollover-picker-roll-all:hover {
    opacity: 0.9;
  }

  /* Today: full-width day card; sections stay inside it */
  .today-block .day-card,
  .day-block.today-block .day-card,
  html body .day-block.today-block.fmt22 .day-card,
  html body .day-block.zone-board-day.fmt22 .day-card,
  html body .day-block.pursuit-board-day.fmt22 .day-card {
    width: min(1600px, calc(100vw - 40px)) !important;
    max-width: min(1600px, calc(100vw - 40px)) !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    min-width: 0 !important;
    border: 1px solid rgba(255,255,255,0.28) !important;
    border-radius: 12px !important;
    box-shadow: 0 8px 28px rgba(0,0,0,0.08) !important;
    backdrop-filter: blur(16px) saturate(1.2) !important;
    -webkit-backdrop-filter: blur(16px) saturate(1.2) !important;
  }
  .day-block.today-block.fmt22 .day-tasks,
  .day-block.zone-board-day.fmt22 .day-tasks,
  .day-block.pursuit-board-day.fmt22 .day-tasks,
  .day-block.today-block.fmt22 .tv-panel.tv-pursuits,
  .day-block.zone-board-day.fmt22 .tv-panel.tv-pursuits,
  .day-block.pursuit-board-day.fmt22 .tv-panel.tv-pursuits,
  .day-block.today-block.fmt22 .tv-panel.tv-pursuits.active,
  .day-block.zone-board-day.fmt22 .tv-panel.tv-pursuits.active,
  .day-block.pursuit-board-day.fmt22 .tv-panel.tv-pursuits.active {
    max-width: none !important;
    width: 100% !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    min-width: 0 !important;
    padding: 8px 8px 12px !important;
  }
  .day-block.today-block.fmt22 .sec-grid,
  .day-block.zone-board-day.fmt22 .sec-grid,
  .day-block.pursuit-board-day.fmt22 .sec-grid {
    max-width: none !important;
    width: 100% !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    min-width: 0 !important;
  }
  .today-block .day-dot,
  .day-block.today-block .day-dot {
    z-index: 6;
  }

  /* Today's card: pull checkboxes inward from the right edge */
  .today-block .day-tasks {
    padding-right: 8px !important;
  }
  .today-block .day-card-header {
    padding-right: 16px !important;
  }

  /* Archive day-block: appended at end of timeline, distinct from real days */
  .archive-block .day-date {
    font-style: italic;
    opacity: 0.85;
  }
  .archive-block .day-card {
    opacity: 0.92;
  }

  /* May 4 card uses today's font (Reenie Beanie 20px) */
  .day-block[data-date="2026-05-04"] .day-task-item .day-task-text,
  

  /* May 4 card uses today's font (Reenie Beanie 20px) */
  .day-block[data-date="2026-05-05"] .day-task-item .day-task-text,
  .day-block[data-date="2026-05-04"] .day-task-item .day-task-text span,
  
  .day-block[data-date="2026-05-05"] .day-task-item .day-task-text span,
  .day-block[data-date="2026-05-04"] .task-subtask .day-task-text,
  
  .day-block[data-date="2026-05-05"] .task-subtask .day-task-text,
  .day-block[data-date="2026-05-04"] .task-subtask .day-task-text span ,
  
  .day-block[data-date="2026-05-05"] .task-subtask .day-task-text span {
    font-family: 'Reenie Beanie', cursive !important;
    font-size: 20px !important;
    color: var(--dark) !important;
    font-weight: 400 !important;
  }
  .day-block[data-date="2026-05-04"] .day-task-item .attr-content,
  
  .day-block[data-date="2026-05-05"] .day-task-item .attr-content,
  .day-block[data-date="2026-05-04"] .task-subtask .attr-content ,
  
  .day-block[data-date="2026-05-05"] .task-subtask .attr-content {
    font-family: 'Reenie Beanie', cursive !important;
    font-size: 15px !important;
    color: var(--dark) !important;
    font-weight: 400 !important;
  }

  /* Skipped tasks: hide native checkbox, show an X mark in its place. No strikethrough. */
  .day-task-item.skipped > .agenda-check {
    appearance: none !important;
    -webkit-appearance: none !important;
    width: 16px !important;
    height: 16px !important;
    border: none !important;
    background: transparent !important;
    position: relative;
    cursor: pointer;
  }
  .day-task-item.skipped > .agenda-check::before {
    content: '×';
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'DM Mono', monospace;
    font-size: 22px;
    font-weight: 400;
    color: var(--dusty);
    line-height: 1;
  }
  /* Today's card: scale X mark to match Reenie Beanie size */
  .today-block .day-task-item.skipped > .agenda-check::before {
    font-size: 26px;
  }

  /* Research-link as button (replaces anchor for better iframe compatibility) */
  button.research-link {
    background: transparent;
    border: none;
    padding: 0;
    margin: 0;
    cursor: pointer;
  }

  /* Priority overlay: faded parent label next to subtask/flow-node items */
  .priority-overlay .priority-parent {
    font-family: 'DM Mono', monospace;
    font-size: 10px;
    letter-spacing: 0.05em;
    color: var(--dusty);
    opacity: 0.85;
    margin-left: auto;
    font-style: italic;
    text-transform: lowercase;
    text-align: right;
    flex: 0 0 auto;
  }
  .priority-overlay .priority-parent::before {
    content: '';
    display: none;
  }

  /* 3-column layout for lifestyle haul sub-sections on May 4 */
  .lifestyle-haul-cols {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 12px;
    margin: 6px 0 8px;
  }
  .lifestyle-haul-cols .haul-col {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .lifestyle-haul-cols .task-group-label.sub-section {
    margin: 0 0 4px;
    text-align: center;
  }
  .lifestyle-haul-cols .day-task-item {
    font-size: 14px;
  }
  /* On narrower screens, drop to 1 column */
  @media (max-width: 480px) {
    .lifestyle-haul-cols {
      grid-template-columns: 1fr;
    }
  }

  /* Plain day-task-item (not adderall-toggle, not has-attrs): push checkbox to the right */
  .day-task-item:not(.adderall-toggle):not(.has-attrs):not(.has-purpose) > .agenda-check {
    margin-left: auto !important;
  }
  /* has-purpose tasks (with i toggle): also push check to the right of the purpose-content */
  .day-task-item.has-purpose > .agenda-check {
    margin-left: auto !important;
  }

  /* Ensure count badge is right-aligned on regular (non-today/featured) day cards */
  .day-block:not(.today-block):not(.featured-block) .day-count {
    margin-left: auto;
  }

  /* X-mark = cancelled style: X glyph but no strikethrough or fading */
  .day-task-item:has(> .agenda-check.x-mark:checked),
  .day-task-item:has(> .agenda-check.x-mark:checked) > .day-task-text,
  .day-task-item:has(> .agenda-check.x-mark:checked).checked-item,
  .day-task-item:has(> .agenda-check.x-mark:checked).checked-item > .day-task-text,
  .day-block.past .day-task-item:has(> .agenda-check.x-mark:checked),
  .day-block.past .day-task-item:has(> .agenda-check.x-mark:checked).checked-item,
  .day-block.past .day-task-item:has(> .agenda-check.x-mark:checked).checked-item > .day-task-text {
    text-decoration: none !important;
    opacity: 1 !important;
  }

  /* Hide all visual pin icons globally — keep .priority class for sorting only */


  /* Canvas layout (sticky-note style) for May 3 */
  .day-tasks.canvas-layout {
    position: relative;
    min-height: 320px;
    display: block !important;
    padding-bottom: 80px;
  }
  .day-tasks.canvas-layout .section-group {
    position: absolute;
    padding: 10px 12px;
    border-radius: 8px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.06);
    display: flex !important;
    flex-direction: column;
    gap: 2px;
    z-index: 2;
  }
  /* Increase canvas height to accommodate parent backdrops */
  .day-tasks.canvas-layout {
    min-height: 320px !important;
  }
  /* Force section content visible inside canvas (override any collapse state) */
  .day-tasks.canvas-layout .section-group > * {
    display: revert !important;
  }
  .day-tasks.canvas-layout .section-group .day-task-item {
    display: flex !important;
  }
  .day-tasks.canvas-layout .section-group .task-group-label {
    margin: 0 0 4px !important;
    background: transparent !important;
    padding: 0 0 4px !important;
    border-bottom: 1px solid rgba(138,158,133,0.3) !important;
    border-radius: 0 !important;
    cursor: pointer !important;
    user-select: none;
  }
  /* Disable collapse arrow inside canvas */
  .day-tasks.canvas-layout .task-group-label.section-collapsed::after {
    content: none !important;
  }
  /* Each section gets its own color */
  .day-tasks.canvas-layout .canvas-g1 {
    top: 28px; left: 0; width: 48%;
    transform: rotate(-1deg);
    background: rgba(138,158,133,0.18); /* sage */
  }
  .day-tasks.canvas-layout .canvas-g2 {
    top: 28px; right: 0; width: 48%;
    transform: rotate(0.5deg);
    background: rgba(173,143,104,0.18); /* warm tan */
  }
  .day-tasks.canvas-layout .canvas-g3 {
    top: 12px; left: 4%; width: 55%;
    transform: rotate(-1.2deg);
    background: rgba(204,153,176,0.18); /* dusty rose */
  }
  .day-tasks.canvas-layout .canvas-g4 {
    top: 75px; right: 4%; left: auto; width: 50%;
    transform: rotate(1.5deg);
    background: rgba(218,180,78,0.18); /* mustard yellow — Jetta in endowments */
  }
  .day-tasks.canvas-layout .canvas-g5 {
    top: 135px; left: 8%; width: 60%;
    transform: rotate(-0.8deg);
    background: rgba(132,158,180,0.18); /* dusty blue — flight in marriage */
  }

  /* Rollover button: pinned to bottom of canvas-layout day with breathing room */
  .day-tasks.canvas-layout > .rollover-btn {
    position: absolute !important;
    bottom: 24px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    margin: 0 !important;
    z-index: 5 !important;
  }

  /* Canvas layout: hide checkbox circles entirely; show ✓ glyph only when checked */
  .day-tasks.canvas-layout .agenda-check,
  .day-tasks.canvas-layout .agenda-subcheck {
    border: none !important;
    background: transparent !important;
    width: 16px !important;
    height: 16px !important;
  }
  /* Hide the circle when unchecked — only the ::after glyph shows when checked */
  .day-tasks.canvas-layout .agenda-check:not(:checked),
  .day-tasks.canvas-layout .agenda-subcheck:not(:checked) {
    visibility: hidden !important;
    width: 0 !important;
    margin: 0 !important;
  }
  /* The check glyph (::after) keeps its existing styling — it inherits from base rule */



  /* Canvas labels are clickable to toggle sections */
  .day-tasks.canvas-layout .section-group > .task-group-label {
    cursor: pointer;
    user-select: none;
  }

  /* Canvas section collapse: when label has .section-collapsed, hide its sibling items */
  .day-tasks.canvas-layout .section-group:has(> .task-group-label.section-collapsed) > .day-task-item,
  .day-tasks.canvas-layout .section-group:has(> .task-group-label.section-collapsed) > .lifestyle-haul-cols,
  .day-tasks.canvas-layout .section-group:has(> .task-group-label.section-collapsed) > div:not(.task-group-label) {
    display: none !important;
  }

  /* Task detail popup (canvas layout, May 3) */
  .task-detail-overlay {
    position: fixed;
    inset: 0;
    background: rgba(42, 47, 51, 0.55);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    opacity: 1;
    transition: opacity 0.2s ease;
  }
  .task-detail-overlay.hidden {
    opacity: 0;
    pointer-events: none;
  }
  .task-detail-modal {
    background: #FBFAF5;
    border-radius: 12px;
    padding: 22px 22px 20px;
    width: 100%;
    max-width: 380px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.25);
    display: flex;
    flex-direction: column;
    gap: 14px;
    position: relative;
    max-height: 80vh;
    overflow-y: auto;
  }
  .task-detail-modal .task-detail-close {
    position: absolute;
    top: 10px;
    right: 12px;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    border: none;
    background: rgba(0,0,0,0.06);
    color: #2A2A25;
    font-size: 16px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
  }
  .task-detail-modal .task-detail-close:hover {
    background: rgba(0,0,0,0.12);
  }
  .task-detail-modal .task-detail-name {
    font-family: 'Reenie Beanie', cursive;
    font-size: 22px;
    color: #2A2A25;
    margin: 0;
    padding-right: 30px;
    line-height: 1.3;
  }
  .task-detail-modal .task-detail-section-title {
    font-family: 'DM Mono', monospace;
    font-size: 9px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--sage);
    margin: 4px 0 6px;
    font-weight: 500;
  }
  .task-detail-modal .task-detail-subtasks {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .task-detail-modal .subtask-row {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: 'Reenie Beanie', cursive;
    font-size: 17px;
    color: #2A2A25;
  }
  .task-detail-modal .subtask-row input[type=checkbox] {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 1.5px solid var(--light-sage);
    background: white;
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    flex-shrink: 0;
    position: relative;
  }
  .task-detail-modal .subtask-row input[type=checkbox]:checked {
    border-color: var(--sage);
  }
  .task-detail-modal .subtask-row input[type=checkbox]:checked::after {
    content: "✓";
    position: absolute;
    top: -8px;
    left: -1px;
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 22px;
    color: var(--sage);
    line-height: 1;
    transform: skewX(-10deg);
  }
  .task-detail-modal .task-detail-empty {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 13px;
    color: var(--dusty);
    opacity: 0.6;
  }
  .task-detail-modal .task-detail-notes {
    width: 100%;
    min-height: 80px;
    padding: 8px 10px;
    border: 1px solid rgba(138,158,133,0.3);
    border-radius: 6px;
    background: #FFFFFF;
    font-family: 'DM Mono', monospace;
    font-size: 12px;
    color: #2A2A25;
    resize: vertical;
    box-sizing: border-box;
  }
  .task-detail-modal .task-detail-notes:focus {
    outline: none;
    border-color: var(--sage);
  /* Linked chats section */
  .task-detail-modal .task-detail-links {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 8px;
    min-height: 0;
  }
  .task-detail-modal .task-detail-link-item {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    background: rgba(154,132,86,0.08);
    border: 1px solid rgba(154,132,86,0.18);
    border-radius: 14px;
    padding: 3px 10px 3px 8px;
    font-family: 'DM Mono', monospace;
    font-size: 9.5px;
    letter-spacing: 0.02em;
    color: rgba(154,132,86,0.85);
    text-decoration: none;
    transition: background 0.15s ease, border-color 0.15s ease;
    max-width: 260px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .task-detail-modal .task-detail-link-item:hover {
    background: rgba(154,132,86,0.15);
    border-color: rgba(154,132,86,0.35);
  }
  .task-detail-modal .task-detail-link-item .link-icon {
    font-size: 11px;
    flex-shrink: 0;
  }
  .task-detail-modal .task-detail-link-item .link-delete {
    font-size: 11px;
    cursor: pointer;
    opacity: 0.5;
    margin-left: 2px;
    flex-shrink: 0;
  }
  .task-detail-modal .task-detail-link-item .link-delete:hover {
    opacity: 1;
  }
  .task-detail-modal .task-detail-add-link-row {
    display: flex;
    gap: 6px;
    align-items: center;
  }
  .task-detail-modal .task-detail-add-link-input {
    flex: 1;
    border: none;
    border-bottom: 1px solid var(--light-sage);
    background: transparent;
    font-family: 'DM Mono', monospace;
    font-size: 10px;
    padding: 4px 2px;
    color: #333;
    outline: none;
  }
  .task-detail-modal .task-detail-add-link-input:focus {
    border-color: var(--sage);
  }
  .task-detail-modal .task-detail-add-link-btn {
    font-family: 'DM Mono', monospace;
    font-size: 9px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    background: rgba(154,132,86,0.12);
    border: 1px solid rgba(154,132,86,0.25);
    border-radius: 10px;
    padding: 3px 10px;
    cursor: pointer;
    color: rgba(154,132,86,0.8);
    transition: background 0.15s ease;
  }
  .task-detail-modal .task-detail-add-link-btn:hover {
    background: rgba(154,132,86,0.22);
  }
  }
  .task-detail-modal .task-detail-footer {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-top: 4px;
  }
  .task-detail-modal .task-detail-checkbox-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .task-detail-modal .task-detail-checkbox-label {
    font-family: 'DM Mono', monospace;
    font-size: 9px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--sage);
    font-weight: 500;
  }
  .task-detail-modal .task-detail-checkbox {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: 1.5px solid var(--light-sage);
    background: white;
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    flex-shrink: 0;
    position: relative;
  }
  .task-detail-modal .task-detail-checkbox:checked {
    border-color: var(--sage);
  }
  .task-detail-modal .task-detail-checkbox:checked::after {
    content: "✓";
    position: absolute;
    top: -8px;
    left: 0;
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 30px;
    color: var(--sage);
    line-height: 1;
    transform: skewX(-10deg);
  }

  /* Hide inline checkbox on canvas layout (popup is the only check) */
  .day-tasks.canvas-layout .day-task-item > .agenda-check {
    display: none !important;
  }
  /* Make task body clickable */
  .day-tasks.canvas-layout .section-group .day-task-item {
    cursor: pointer;
    padding: 4px 6px;
    border-radius: 4px;
    transition: background 0.15s ease;
  }
  .day-tasks.canvas-layout .section-group .day-task-item:hover,
  .day-tasks.canvas-layout .section-group .day-task-item:active {
    background: rgba(0,0,0,0.04);
  }
  /* When task is checked (data-popup-checked), fade + strikethrough */
  .day-tasks.canvas-layout .day-task-item[data-popup-checked="1"] {
    opacity: 0.45;
  }
  .day-tasks.canvas-layout .day-task-item[data-popup-checked="1"] .day-task-text {
    text-decoration: line-through;
    text-decoration-thickness: 1px;
  }

  /* Make canvas section labels clickable above parent backdrops */
  .day-tasks.canvas-layout .section-group > .task-group-label {
    position: relative;
    z-index: 3;
    cursor: pointer !important;
  }

  /* Canvas section collapse: when section-group has .canvas-collapsed class */
  .day-tasks.canvas-layout .section-group.canvas-collapsed > .day-task-item,
  .day-tasks.canvas-layout .section-group.canvas-collapsed > .lifestyle-haul-cols,
  .day-tasks.canvas-layout .section-group.canvas-collapsed > div:not(.task-group-label) {
    display: none !important;
  }
  .day-tasks.canvas-layout .section-group.canvas-collapsed {
    padding-bottom: 8px !important;
  }

  /* Parent cluster collapse: hide sections + their backdrops/labels when parent collapsed */
  .day-tasks.canvas-layout.parent-collapsed-healing .canvas-g1,
  .day-tasks.canvas-layout.parent-collapsed-healing .canvas-g2,
  .day-tasks.canvas-layout.parent-collapsed-healing .parent-overlay-healing {
    display: none !important;
  }
  .day-tasks.canvas-layout.parent-collapsed-features .canvas-g3,
  .day-tasks.canvas-layout.parent-collapsed-features .parent-overlay-features {
    display: none !important;
  }
  .day-tasks.canvas-layout.parent-collapsed-style .canvas-g4,
  .day-tasks.canvas-layout.parent-collapsed-style .canvas-g5,
  .day-tasks.canvas-layout.parent-collapsed-style .parent-overlay-style {
    display: none !important;
  }

  /* Collapsed day overrides canvas-layout display */
  .day-block.collapsed .day-card .day-tasks.canvas-layout {
    display: none !important;
  }

  /* Parent cluster collapse for endowments + marriage */
  .day-tasks.canvas-layout.parent-collapsed-endowments .canvas-g4,
  .day-tasks.canvas-layout.parent-collapsed-endowments .parent-overlay-endowments {
    display: none !important;
  }
  .day-tasks.canvas-layout.parent-collapsed-marriage .canvas-g5,
  .day-tasks.canvas-layout.parent-collapsed-marriage .parent-overlay-marriage {
    display: none !important;
  }

  /* May 4 canvas layout */
  .day-block[data-date="2026-05-04"] .day-tasks.canvas-layout ,
  

  /* May 4 canvas layout */
  .day-block[data-date="2026-05-05"] .day-tasks.canvas-layout {
    min-height: 1550px !important;
  }
  
  /* Healing cluster (May 4) — sections at top */
  .day-block[data-date="2026-05-04"] .canvas-m4-1 ,
  
  
  /* Healing cluster (May 4) — sections at top */
  .day-block[data-date="2026-05-05"] .canvas-m4-1 {
    top: 380px; left: 0; width: 95%;
    transform: rotate(-0.6deg);
    background: rgba(204,153,176,0.22);
  }
  .day-block[data-date="2026-05-04"] .canvas-m4-2 ,
  
  .day-block[data-date="2026-05-05"] .canvas-m4-2 {
    top: 600px; right: 0; width: 70%;
    transform: rotate(0.5deg);
    background: rgba(218,180,78,0.22);
  }
  
  /* Features cluster (May 4) — middle */
  .day-block[data-date="2026-05-04"] .canvas-m4-3 ,
  
  
  /* Features cluster (May 4) — middle */
  .day-block[data-date="2026-05-05"] .canvas-m4-3 {
    top: 30px; left: 0; width: 92%;
    transform: rotate(-0.7deg);
    background: rgba(138,158,133,0.22);
  }
  .day-block[data-date="2026-05-04"] .canvas-m4-4 ,
  
  .day-block[data-date="2026-05-05"] .canvas-m4-4 {
    top: 130px; right: 0; width: 90%;
    transform: rotate(0.6deg);
    background: rgba(173,143,104,0.22);
  }
  .day-block[data-date="2026-05-04"] .canvas-m4-5 ,
  
  .day-block[data-date="2026-05-05"] .canvas-m4-5 {
    top: 220px; left: 0; width: 85%;
    transform: rotate(-0.4deg);
    background: rgba(170,150,200,0.22);
  }
  
  /* Style cluster (May 4) — bottom */
  .day-block[data-date="2026-05-04"] .canvas-m4-6 ,
  
  
  /* Style cluster (May 4) — bottom */
  .day-block[data-date="2026-05-05"] .canvas-m4-6 {
    top: 1080px; left: 0; width: 95%;
    transform: rotate(-0.6deg);
    background: rgba(132,158,180,0.22);
  }
  .day-block[data-date="2026-05-04"] .canvas-m4-7 ,
  
  .day-block[data-date="2026-05-05"] .canvas-m4-7 {
    top: 740px; left: 0; width: 95%;
    transform: rotate(-0.5deg);
    background: rgba(220,170,140,0.22);
  }
  .day-block[data-date="2026-05-04"] .canvas-m4-8 ,
  
  .day-block[data-date="2026-05-05"] .canvas-m4-8 {
    top: 1300px; right: 0; width: 70%;
    transform: rotate(0.4deg);
    background: rgba(120,170,140,0.22);
  }
  
  /* Parent backdrops for May 4 */
  .day-block[data-date="2026-05-04"] .day-tasks .parent-overlay-healing-m4 ,
  
  
  /* Parent backdrops for May 4 */
  .day-block[data-date="2026-05-05"] .day-tasks .parent-overlay-healing-m4 {
    position: absolute; top: 350px; left: -6px; right: -6px; height: 380px;
    background: rgba(138,158,133,0.10); border-radius: 18px; pointer-events: none; z-index: 0;
  }
  .day-block[data-date="2026-05-04"] .day-tasks .parent-overlay-academic-m4 ,
  
  .day-block[data-date="2026-05-05"] .day-tasks .parent-overlay-academic-m4 {
    position: absolute; top: 0px; left: -6px; right: -6px; height: 320px;
    background: rgba(204,153,176,0.10); border-radius: 18px; pointer-events: none; z-index: 0;
  }
  .day-block[data-date="2026-05-04"] .day-tasks .parent-overlay-style-m4 ,
  
  .day-block[data-date="2026-05-05"] .day-tasks .parent-overlay-style-m4 {
    position: absolute; top: 730px; left: -6px; right: -6px; height: 200px;
    background: rgba(218,180,78,0.10); border-radius: 18px; pointer-events: none; z-index: 0;
  }
  
  /* Parent labels for May 4 */
  .day-block[data-date="2026-05-04"] .parent-overlay-label-healing-m4 ,
  
  
  /* Parent labels for May 4 */
  .day-block[data-date="2026-05-05"] .parent-overlay-label-healing-m4 {
    position: absolute; top: 8px; left: 8px;
    font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: 0.22em;
    color: #5C7257; font-weight: 600; text-transform: uppercase;
    pointer-events: auto; cursor: pointer; z-index: 5;
    transform: rotate(-2deg); white-space: nowrap;
  }
  .day-block[data-date="2026-05-04"] .parent-overlay-label-academic-m4 ,
  
  .day-block[data-date="2026-05-05"] .parent-overlay-label-academic-m4 {
    position: absolute; top: 408px; right: 14px;
    font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: 0.22em;
    color: #5C7257; font-weight: 600; text-transform: uppercase;
    pointer-events: auto; cursor: pointer; z-index: 5;
    transform: rotate(1.5deg); white-space: nowrap;
  }
  .day-block[data-date="2026-05-04"] .parent-overlay-label-style-m4 ,
  
  .day-block[data-date="2026-05-05"] .parent-overlay-label-style-m4 {
    position: absolute; top: 748px; left: 10px;
    font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: 0.22em;
    color: #5C7257; font-weight: 600; text-transform: uppercase;
    pointer-events: auto; cursor: pointer; z-index: 5;
    transform: rotate(-1.5deg); white-space: nowrap;
  }
  
  /* Parent collapse for May 4 */
  .day-block[data-date="2026-05-04"] .day-tasks.canvas-layout.parent-collapsed-healing-m4 [data-cluster="healing"],
  
  
  /* Parent collapse for May 4 */
  .day-block[data-date="2026-05-05"] .day-tasks.canvas-layout.parent-collapsed-healing-m4 [data-cluster="healing"],
  .day-block[data-date="2026-05-04"] .day-tasks.canvas-layout.parent-collapsed-healing-m4 .parent-overlay-healing-m4 ,
  
  .day-block[data-date="2026-05-05"] .day-tasks.canvas-layout.parent-collapsed-healing-m4 .parent-overlay-healing-m4 {
    display: none !important;
  }
  .day-block[data-date="2026-05-04"] .day-tasks.canvas-layout.parent-collapsed-academic-m4 [data-cluster="academic"],
  
  .day-block[data-date="2026-05-05"] .day-tasks.canvas-layout.parent-collapsed-academic-m4 [data-cluster="academic"],
  .day-block[data-date="2026-05-04"] .day-tasks.canvas-layout.parent-collapsed-academic-m4 .parent-overlay-features-m4 ,
  
  .day-block[data-date="2026-05-05"] .day-tasks.canvas-layout.parent-collapsed-academic-m4 .parent-overlay-features-m4 {
    display: none !important;
  }
  .day-block[data-date="2026-05-04"] .day-tasks.canvas-layout.parent-collapsed-style-m4 [data-cluster="style"],
  
  .day-block[data-date="2026-05-05"] .day-tasks.canvas-layout.parent-collapsed-style-m4 [data-cluster="style"],
  .day-block[data-date="2026-05-04"] .day-tasks.canvas-layout.parent-collapsed-style-m4 .parent-overlay-style-m4 ,
  
  .day-block[data-date="2026-05-05"] .day-tasks.canvas-layout.parent-collapsed-style-m4 .parent-overlay-style-m4 {
    display: none !important;
  }

  /* May 4 DUP rules (mirror of May 4) */
  .day-block[data-date="2026-05-04-dup"] .day-tasks.canvas-layout {
    min-height: 1620px !important;
  }
  .day-block[data-date="2026-05-04-dup"] .canvas-m4dup-1 {
    top: 380px; left: 0; width: 95%;
    transform: rotate(-0.6deg);
    background: rgba(204,153,176,0.22);
  }
  .day-block[data-date="2026-05-04-dup"] .canvas-m4dup-2 {
    top: 600px; right: 0; width: 70%;
    transform: rotate(0.5deg);
    background: rgba(218,180,78,0.22);
  }
  .day-block[data-date="2026-05-04-dup"] .canvas-m4dup-3 {
    top: 30px; left: 0; width: 92%;
    transform: rotate(-0.7deg);
    background: rgba(138,158,133,0.22);
  }
  .day-block[data-date="2026-05-04-dup"] .canvas-m4dup-4 {
    top: 130px; right: 0; width: 90%;
    transform: rotate(0.6deg);
    background: rgba(173,143,104,0.22);
  }
  .day-block[data-date="2026-05-04-dup"] .canvas-m4dup-5 {
    top: 220px; left: 0; width: 85%;
    transform: rotate(-0.4deg);
    background: rgba(170,150,200,0.22);
  }
  .day-block[data-date="2026-05-04-dup"] .canvas-m4dup-6 {
    top: 1080px; left: 0; width: 95%;
    transform: rotate(-0.6deg);
    background: rgba(132,158,180,0.22);
  }
  .day-block[data-date="2026-05-04-dup"] .canvas-m4dup-7 {
    top: 740px; left: 0; width: 95%;
    transform: rotate(-0.5deg);
    background: rgba(220,170,140,0.22);
  }
  .day-block[data-date="2026-05-04-dup"] .canvas-m4dup-8 {
    top: 1300px; right: 0; width: 70%;
    transform: rotate(0.4deg);
    background: rgba(120,170,140,0.22);
  }
  .day-block[data-date="2026-05-04-dup"] .day-tasks .parent-overlay-healing-m4dup {
    position: absolute; top: 350px; left: -6px; right: -6px; height: 380px;
    background: rgba(138,158,133,0.10); border-radius: 18px; pointer-events: none; z-index: 0;
  }
  .day-block[data-date="2026-05-04-dup"] .day-tasks .parent-overlay-academic-m4dup {
    position: absolute; top: 0px; left: -6px; right: -6px; height: 320px;
    background: rgba(204,153,176,0.10); border-radius: 18px; pointer-events: none; z-index: 0;
  }
  .day-block[data-date="2026-05-04-dup"] .day-tasks .parent-overlay-style-m4dup {
    position: absolute; top: 730px; left: -6px; right: -6px; height: 200px;
    background: rgba(218,180,78,0.10); border-radius: 18px; pointer-events: none; z-index: 0;
  }
  .day-block[data-date="2026-05-04-dup"] .parent-overlay-label-healing-m4dup {
    position: absolute; top: 8px; left: 8px;
    font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: 0.22em;
    color: #5C7257; font-weight: 600; text-transform: uppercase;
    pointer-events: auto; cursor: pointer; z-index: 5;
    transform: rotate(-2deg); white-space: nowrap;
  }
  .day-block[data-date="2026-05-04-dup"] .parent-overlay-label-academic-m4dup {
    position: absolute; top: 408px; right: 14px;
    font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: 0.22em;
    color: #5C7257; font-weight: 600; text-transform: uppercase;
    pointer-events: auto; cursor: pointer; z-index: 5;
    transform: rotate(1.5deg); white-space: nowrap;
  }
  .day-block[data-date="2026-05-04-dup"] .parent-overlay-label-style-m4dup {
    position: absolute; top: 748px; left: 10px;
    font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: 0.22em;
    color: #5C7257; font-weight: 600; text-transform: uppercase;
    pointer-events: auto; cursor: pointer; z-index: 5;
    transform: rotate(-1.5deg); white-space: nowrap;
  }
  .day-block[data-date="2026-05-04-dup"] .day-tasks.canvas-layout.parent-collapsed-healing-m4dup [data-cluster="healing"], .day-block[data-date="2026-05-04-dup"] .day-tasks.canvas-layout.parent-collapsed-healing-m4dup .parent-overlay-healing-m4dup { display: none !important; }
  .day-block[data-date="2026-05-04-dup"] .day-tasks.canvas-layout.parent-collapsed-academic-m4dup [data-cluster="academic"], .day-block[data-date="2026-05-04-dup"] .day-tasks.canvas-layout.parent-collapsed-academic-m4dup .parent-overlay-features-m4dup { display: none !important; }
  .day-block[data-date="2026-05-04-dup"] .day-tasks.canvas-layout.parent-collapsed-style-m4dup [data-cluster="style"], .day-block[data-date="2026-05-04-dup"] .day-tasks.canvas-layout.parent-collapsed-style-m4dup .parent-overlay-style-m4dup { display: none !important; }

  /* May 4 management cluster */
  .day-block[data-date="2026-05-04"] .day-tasks .parent-overlay-management-m4 ,
  

  /* May 4 management cluster */
  .day-block[data-date="2026-05-05"] .day-tasks .parent-overlay-management-m4 {
    position: absolute; top: 1050px; left: -6px; right: -6px; height: 410px;
    background: rgba(132,158,180,0.10); border-radius: 18px; pointer-events: none; z-index: 0;
  }
  .day-block[data-date="2026-05-04"] .parent-overlay-label-management-m4 ,
  
  .day-block[data-date="2026-05-05"] .parent-overlay-label-management-m4 {
    position: absolute; top: 1058px; left: 8px;
    font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: 0.22em;
    color: #5C7257; font-weight: 600; text-transform: uppercase;
    pointer-events: auto; cursor: pointer; z-index: 5;
    transform: rotate(-1.5deg); white-space: nowrap;
  }
  .day-block[data-date="2026-05-04"] .day-tasks.canvas-layout.parent-collapsed-management-m4 [data-cluster="management"],
  
  .day-block[data-date="2026-05-05"] .day-tasks.canvas-layout.parent-collapsed-management-m4 [data-cluster="management"],
  .day-block[data-date="2026-05-04"] .day-tasks.canvas-layout.parent-collapsed-management-m4 .parent-overlay-management-m4 ,
  
  .day-block[data-date="2026-05-05"] .day-tasks.canvas-layout.parent-collapsed-management-m4 .parent-overlay-management-m4 {
    display: none !important;
  }
  
  /* dup */
  .day-block[data-date="2026-05-04-dup"] .day-tasks .parent-overlay-management-m4dup {
    position: absolute; top: 1050px; left: -6px; right: -6px; height: 410px;
    background: rgba(132,158,180,0.10); border-radius: 18px; pointer-events: none; z-index: 0;
  }
  .day-block[data-date="2026-05-04-dup"] .parent-overlay-label-management-m4dup {
    position: absolute; top: 1058px; left: 8px;
    font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: 0.22em;
    color: #5C7257; font-weight: 600; text-transform: uppercase;
    pointer-events: auto; cursor: pointer; z-index: 5;
    transform: rotate(-1.5deg); white-space: nowrap;
  }
  .day-block[data-date="2026-05-04-dup"] .day-tasks.canvas-layout.parent-collapsed-management-m4dup [data-cluster="management"],
  .day-block[data-date="2026-05-04-dup"] .day-tasks.canvas-layout.parent-collapsed-management-m4dup .parent-overlay-management-m4dup {
    display: none !important;
  }

  /* High Functioning cluster — May 4 dup (empty placeholder) */
  .day-block[data-date="2026-05-04-dup"] .day-tasks .parent-overlay-highfunctioning-m4dup {
    position: absolute; top: 1480px; left: -6px; right: -6px; height: 100px;
    background: rgba(170,150,200,0.10); border-radius: 18px; pointer-events: none; z-index: 0;
  }
  .day-block[data-date="2026-05-04-dup"] .parent-overlay-label-highfunctioning-m4dup {
    position: absolute; top: 1488px; right: 14px;
    font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: 0.22em;
    color: #5C7257; font-weight: 600; text-transform: uppercase;
    pointer-events: auto; cursor: pointer; z-index: 5;
    transform: rotate(1.5deg); white-space: nowrap;
  }
  .day-block[data-date="2026-05-04-dup"] .day-tasks.canvas-layout.parent-collapsed-highfunctioning-m4dup [data-cluster="highfunctioning"],
  .day-block[data-date="2026-05-04-dup"] .day-tasks.canvas-layout.parent-collapsed-highfunctioning-m4dup .parent-overlay-highfunctioning-m4dup {
    display: none !important;
  }

  /* Jetta + flight confirmation: tasks (not sections) on May 3 canvas */
  .day-tasks.canvas-layout .day-task-item.canvas-g3,
  .day-tasks.canvas-layout .day-task-item.canvas-g4,
  .day-tasks.canvas-layout .day-task-item.canvas-g5 {
    position: absolute;
    padding: 10px 12px;
    border-radius: 8px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.06);
    z-index: 2;
    display: flex !important;
    align-items: center;
    justify-content: space-between;
  }

  /* Template / inventory card */
  .template-block .template-card {
    background: #F4F2EC;
    border: 1px dashed rgba(92,114,87,0.3);
    padding: 20px;
  }
  .template-tasks {
    padding: 0 !important;
  }
  .template-section {
    margin-bottom: 20px;
  }
  .template-section:last-child {
    margin-bottom: 0;
  }
  .template-section-label {
    font-family: 'DM Mono', monospace;
    font-size: 10px;
    letter-spacing: 0.2em;
    color: #5C7257;
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 10px;
    padding-bottom: 6px;
    border-bottom: 1px solid rgba(92,114,87,0.15);
  }
  .template-pill-row {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
  }
  .template-pill {
    font-family: 'DM Mono', monospace;
    font-size: 10px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 5px 10px;
    border-radius: 12px;
    color: #2A2A25;
    font-weight: 500;
  }
  /* Parent pills get cluster colors */
  .template-pill.toned { background: rgba(138,158,133,0.25); }
  .template-pill.photogenic { background: rgba(204,153,176,0.25); }
  .template-pill.style { background: rgba(218,180,78,0.25); }
  .template-pill.management { background: rgba(186,138,84,0.25); }
  .template-pill.identity { background: rgba(180,120,140,0.25); }
  .template-pill.academic { background: rgba(204,153,176,0.25); }
  .template-pill.highfunctioning { background: rgba(170,150,200,0.25); }
  .template-pill.section-pill {
    background: rgba(140,140,130,0.12);
    color: #4A4A45;
    text-transform: lowercase;
    letter-spacing: 0.04em;
  }
  .template-task-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .template-task {
    font-family: 'Reenie Beanie', cursive;
    font-size: 17px;
    color: #2A2A25;
    padding: 2px 0;
  }

  /* Template section pills — varied colors */
  .template-pill.sec-rose { background: rgba(204,153,176,0.22); }
  .template-pill.sec-mustard { background: rgba(218,180,78,0.22); }
  .template-pill.sec-sage { background: rgba(138,158,133,0.22); }
  .template-pill.sec-tan { background: rgba(173,143,104,0.22); }
  .template-pill.sec-lavender { background: rgba(170,150,200,0.22); }
  .template-pill.sec-blue { background: rgba(132,158,180,0.22); }
  .template-pill.sec-peach { background: rgba(220,170,140,0.22); }
  .template-pill.sec-green { background: rgba(120,170,140,0.22); }
  .template-pill[class*="sec-"] {
    font-family: 'DM Mono', monospace;
    font-size: 9px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-weight: 500;
    color: #5C7257;
    opacity: 0.95;
  }

  /* Square grid cards: all same size, all content visible */
  .grid > .card { box-sizing: border-box; }

  /* May 3 canvas: just enough height for 3 tasks + breathing room above rollover btn */
  .day-block[data-date="2026-05-03"] .day-tasks.canvas-layout {
    min-height: 250px !important;
    padding-bottom: 60px !important;
  }

  /* Recreate older card visual feel — typography polish */
  .grid > .card .task-meta {
    margin-top: 12px;
    border-top: none !important;
  }
  .grid > .card .task-meta::before {
    content: '→' !important;
    font-family: 'DM Mono', monospace !important;
    font-size: 11px !important;
    letter-spacing: 0 !important;
    color: var(--warm) !important;
    text-transform: none !important;
    margin-bottom: 0 !important;
    margin-right: 6px !important;
    display: inline !important;
  }
  .grid > .card .task-goal {
    display: inline !important;
    font-family: 'Newsreader', serif !important;
    font-size: 13px !important;
    font-style: italic !important;
    font-weight: 300 !important;
    color: var(--accent) !important;
    letter-spacing: 0 !important;
    line-height: 1.4 !important;
  }

  /* May 4 dup: darker, bolder Reenie cursive task names for legibility */
  .day-block[data-date="2026-05-04-dup"] .day-task-item .day-task-text,
  .day-block[data-date="2026-05-04-dup"] .day-task-item .day-task-text span,
  .day-block[data-date="2026-05-04-dup"] .task-subtask .day-task-text,
  .day-block[data-date="2026-05-04-dup"] .task-subtask .day-task-text span {
    color: #1A1A15 !important;
    font-weight: 600 !important;
  }

  /* May 4 original: hide inline checkbox circles (popup handles completion) */
  .day-block[data-date="2026-05-04"] .day-task-item .agenda-check,
  

  /* May 4 original: hide inline checkbox circles (popup handles completion) */
  .day-block[data-date="2026-05-05"] .day-task-item .agenda-check,
  .day-block[data-date="2026-05-04"] .task-subtask input[type="checkbox"] ,
  
  .day-block[data-date="2026-05-05"] .task-subtask input[type="checkbox"] {
    display: none !important;
  }
  /* Visual feedback for popup-checked tasks on May 4 */
  .day-block[data-date="2026-05-04"] .day-task-item[data-popup-checked="1"] ,
  
  /* Visual feedback for popup-checked tasks on May 4 */
  .day-block[data-date="2026-05-05"] .day-task-item[data-popup-checked="1"] {
    opacity: 0.4;
  }
  .day-block[data-date="2026-05-04"] .day-task-item[data-popup-checked="1"] .day-task-text ,
  
  .day-block[data-date="2026-05-05"] .day-task-item[data-popup-checked="1"] .day-task-text {
    text-decoration: line-through;
  }
  /* Hover feedback to show clickable */
  .day-block[data-date="2026-05-04"] .day-task-item ,
  
  /* Hover feedback to show clickable */
  .day-block[data-date="2026-05-05"] .day-task-item {
    cursor: pointer;
  }

  .task-detail-modal .task-detail-info {
    font-family: 'Newsreader', serif;
    font-size: 15px;
    line-height: 1.5;
    color: #2A2A25;
    background: rgba(138,158,133,0.08);
    padding: 10px 14px;
    border-radius: 6px;
    margin-bottom: 16px;
  }

  /* May 4 original: tighter line spacing between tasks */
  .day-block[data-date="2026-05-04"] .day-task-item ,
  

  /* May 4 original: tighter line spacing between tasks */
  .day-block[data-date="2026-05-05"] .day-task-item {
    line-height: 1.2 !important;
    margin-bottom: 0 !important;
    padding-top: 1px !important;
    padding-bottom: 1px !important;
  }
  .day-block[data-date="2026-05-04"] .task-group-label ,
  
  .day-block[data-date="2026-05-05"] .task-group-label {
    margin: 6px 0 3px !important;
  }

  /* May 4 (original + dup): hide ALL inline 'i' toggles + info — info shows in popup */
  .day-block[data-date="2026-05-04"] .attr-toggle,
  

  /* May 4 (original + dup): hide ALL inline 'i' toggles + info — info shows in popup */
  .day-block[data-date="2026-05-05"] .attr-toggle,
  .day-block[data-date="2026-05-04"] .attr-content,
  
  .day-block[data-date="2026-05-05"] .attr-content,
  .day-block[data-date="2026-05-04"] .purpose-toggle,
  
  .day-block[data-date="2026-05-05"] .purpose-toggle,
  .day-block[data-date="2026-05-04"] .purpose-content,
  
  .day-block[data-date="2026-05-05"] .purpose-content,
  .day-block[data-date="2026-05-04-dup"] .attr-toggle,
  .day-block[data-date="2026-05-04-dup"] .attr-content,
  .day-block[data-date="2026-05-04-dup"] .purpose-toggle,
  .day-block[data-date="2026-05-04-dup"] .purpose-content {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 0 !important;
  }

  /* May 4: keep haul as 3 columns even on narrow screens */
  .day-block[data-date="2026-05-04"] .lifestyle-haul-cols ,
  

  /* May 4: keep haul as 3 columns even on narrow screens */
  .day-block[data-date="2026-05-05"] .lifestyle-haul-cols {
    grid-template-columns: 1fr 1fr 1fr !important;
    gap: 8px !important;
  }
  .day-block[data-date="2026-05-04"] .lifestyle-haul-cols .day-task-item ,
  
  .day-block[data-date="2026-05-05"] .lifestyle-haul-cols .day-task-item {
    font-size: 12px !important;
  }

  /* May 9: same as May 4 — hide inline checkbox circles */
  .day-block[data-date="2026-05-09"] .day-task-item .agenda-check,
  .day-block[data-date="2026-05-09"] .task-subtask input[type="checkbox"] {
    display: none !important;
  }
  .day-block[data-date="2026-05-09"] .day-task-item[data-popup-checked="1"] {
    opacity: 0.4;
  }
  .day-block[data-date="2026-05-09"] .day-task-item[data-popup-checked="1"] .day-task-text {
    text-decoration: line-through;
  }
  .day-block[data-date="2026-05-09"] .day-task-item {
    cursor: pointer;
  }
  
  /* May 9: tighter line spacing */
  .day-block[data-date="2026-05-09"] .day-task-item {
    line-height: 1.2 !important;
    margin-bottom: 0 !important;
    padding-top: 1px !important;
    padding-bottom: 1px !important;
  }
  .day-block[data-date="2026-05-09"] .task-group-label {
    margin: 6px 0 3px !important;
  }
  
  /* May 9: hide all inline 'i' toggles + content */
  .day-block[data-date="2026-05-09"] .attr-toggle,
  .day-block[data-date="2026-05-09"] .attr-content,
  .day-block[data-date="2026-05-09"] .purpose-toggle,
  .day-block[data-date="2026-05-09"] .purpose-content {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 0 !important;
  }
  
  /* May 9: keep haul as 3 columns even on narrow screens */
  .day-block[data-date="2026-05-09"] .lifestyle-haul-cols {
    grid-template-columns: 1fr 1fr 1fr !important;
    gap: 8px !important;
  }
  .day-block[data-date="2026-05-09"] .lifestyle-haul-cols .day-task-item {
    font-size: 12px !important;
  }

  /* May 9: Reenie Beanie 20px (same as today's May 3 card / May 4) */
  .day-block[data-date="2026-05-09"] .day-task-item .day-task-text,
  .day-block[data-date="2026-05-09"] .day-task-item .day-task-text span,
  .day-block[data-date="2026-05-09"] .task-subtask .day-task-text,
  .day-block[data-date="2026-05-09"] .task-subtask .day-task-text span {
    font-family: 'Reenie Beanie', cursive !important;
    font-size: 20px !important;
    color: var(--dark) !important;
    font-weight: 400 !important;
  }

  /* Archive section: read-only visual snapshot */
  #archive-section .day-task-item,
  #archive-section .task-subtask {
    cursor: default !important;
    pointer-events: none !important;
  }
  #archive-section .day-task-item input,
  #archive-section .task-subtask input {
    pointer-events: none !important;
    cursor: default !important;
  }
  #archive-section .day-block {
    opacity: 0.85;
  }
  #archive-section .day-block::after {
    content: 'snapshot · read-only';
    display: block;
    text-align: center;
    font-family: 'DM Mono', monospace;
    font-size: 8px;
    letter-spacing: 0.2em;
    color: rgba(138,158,133,0.6);
    text-transform: uppercase;
    margin-top: 8px;
  }

  /* Archive: never show crossed-out / faded state on tasks */
  #archive-section .day-task-item[data-popup-checked="1"],
  #archive-section .day-task-item.checked-item,
  #archive-section .task-subtask.checked-item {
    opacity: 1 !important;
  }
  #archive-section .day-task-item[data-popup-checked="1"] .day-task-text,
  #archive-section .day-task-item[data-popup-checked="1"] .day-task-text span,
  #archive-section .day-task-item.checked-item .day-task-text,
  #archive-section .task-subtask.checked-item .day-task-text {
    text-decoration: none !important;
  }
  /* Also block any past-day strikethrough applied to .day-block.past */
  #archive-section .day-block.past .day-task-item.checked-item {
    text-decoration: none !important;
    opacity: 1 !important;
  }

  /* Archived May 3: same Reenie font as today's May 3 */
  .day-block[data-date="2026-05-03-archive"] .day-task-item .day-task-text,
  .day-block[data-date="2026-05-03-archive"] .day-task-item .day-task-text span,
  .day-block[data-date="2026-05-03-archive"] .task-subtask .day-task-text,
  .day-block[data-date="2026-05-03-archive"] .task-subtask .day-task-text span {
    font-family: 'Reenie Beanie', cursive !important;
    font-size: 20px !important;
    color: var(--dark) !important;
    font-weight: 400 !important;
  }

  /* May 3 clone: same Reenie font as today's May 3 */
  .day-block[data-date="2026-05-03-clone"] .day-task-item .day-task-text,
  .day-block[data-date="2026-05-03-clone"] .day-task-item .day-task-text span,
  .day-block[data-date="2026-05-03-clone"] .task-subtask .day-task-text,
  .day-block[data-date="2026-05-03-clone"] .task-subtask .day-task-text span {
    font-family: 'Reenie Beanie', cursive !important;
    font-size: 20px !important;
    color: var(--dark) !important;
    font-weight: 400 !important;
  }
  /* May 3 clone canvas: same min-height as May 3 */
  .day-block[data-date="2026-05-03-clone"] .day-tasks.canvas-layout {
    min-height: 250px !important;
    padding-bottom: 60px !important;
  }

  /* May 3: all canvas task tiles in sage */
  .day-block[data-date="2026-05-03"] .day-tasks.canvas-layout .canvas-g3,
  .day-block[data-date="2026-05-03"] .day-tasks.canvas-layout .canvas-g4,
  .day-block[data-date="2026-05-03"] .day-tasks.canvas-layout .canvas-g5 {
    background: rgba(138,158,133,0.22) !important; /* sage */
  }

  /* May 3: prevent task tile overlap by spreading them vertically */
  .day-block[data-date="2026-05-03"] .day-tasks.canvas-layout .canvas-g3 {
    top: 12px !important;
  }
  .day-block[data-date="2026-05-03"] .day-tasks.canvas-layout .canvas-g4 {
    top: 110px !important;
  }
  .day-block[data-date="2026-05-03"] .day-tasks.canvas-layout .canvas-g5 {
    top: 200px !important;
  }
  .day-block[data-date="2026-05-03"] .day-tasks.canvas-layout {
    min-height: 290px !important;
  }

  /* May 3: hide all inline 'i' toggles + content (info shows in popup via existing logic) */
  .day-block[data-date="2026-05-03"] .attr-toggle,
  .day-block[data-date="2026-05-03"] .attr-content,
  .day-block[data-date="2026-05-03"] .purpose-toggle,
  .day-block[data-date="2026-05-03"] .purpose-content {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 0 !important;
  }

  /* May 3: hide inline checkbox circles (popup handles completion) */
  .day-block[data-date="2026-05-03"] .day-task-item .agenda-check,
  .day-block[data-date="2026-05-03"] .task-subtask input[type="checkbox"] {
    display: none !important;
  }
  /* Visual feedback for popup-checked tasks on May 3 */
  .day-block[data-date="2026-05-03"] .day-task-item[data-popup-checked="1"] {
    opacity: 0.4;
  }
  .day-block[data-date="2026-05-03"] .day-task-item[data-popup-checked="1"] .day-task-text {
    text-decoration: line-through;
  }

  /* (airy spacing removed — back to base) */

  /* Darker, more legible task text */
  .day-task-item .day-task-text,
  .day-task-item .day-task-text span,
  .task-subtask .day-task-text,
  .task-subtask .day-task-text span {
    color: #000000 !important;
  }

  /* May 3: tighter line spacing throughout */
  .day-block[data-date="2026-05-03"] .day-task-item {
    line-height: 1.2 !important;
    margin-bottom: 0 !important;
    padding-top: 1px !important;
    padding-bottom: 1px !important;
  }
  .day-block[data-date="2026-05-03"] .task-group-label {
    margin: 10px 0 4px !important;
    padding: 5px 10px !important;
  }
  .day-block[data-date="2026-05-03"] .task-subtask {
    line-height: 1.2 !important;
    margin-bottom: 0 !important;
  }

  /* Center-align task content in the row */
  .day-tasks > .day-task-item {
    justify-content: center !important;
    text-align: center !important;
  }
  .day-tasks > .day-task-item > .day-task-text {
    text-align: center !important;
  }

  /* May 4: center-align task content */
  .day-block[data-date="2026-05-04"] .day-tasks > .day-task-item ,
  

  /* May 4: center-align task content */
  .day-block[data-date="2026-05-05"] .day-tasks > .day-task-item {
    justify-content: center !important;
    text-align: center !important;
  }
  .day-block[data-date="2026-05-04"] .day-tasks > .day-task-item > .day-task-text ,
  
  .day-block[data-date="2026-05-05"] .day-tasks > .day-task-item > .day-task-text {
    text-align: center !important;
    flex: 0 1 auto !important;
  }

  /* May 4: also center adderall-toggle task content */
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle ,
  

  /* May 4: also center adderall-toggle task content */
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle {
    justify-content: center !important;
    text-align: center !important;
  }
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle > .day-task-text ,
  
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle > .day-task-text {
    text-align: center !important;
    flex: 0 1 auto !important;
  }

  /* May 4: also kill the right-pushing margin on subtask-frac so monthly refills text centers */
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle > .subtask-frac ,
  

  /* May 4: also kill the right-pushing margin on subtask-frac so monthly refills text centers */
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle > .subtask-frac {
    margin-left: 8px !important;
    margin-right: 0 !important;
  }

  /* monthly refills: two-column IR / XR */
  .day-task-item.adderall-toggle .task-extras.two-col-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-top: 8px;
  }
  .day-task-item.adderall-toggle .task-extras.two-col-grid .ir-col,
  .day-task-item.adderall-toggle .task-extras.two-col-grid .xr-col {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .day-task-item.adderall-toggle .task-extras.two-col-grid .task-group-label.sub-section {
    margin: 0 0 4px;
    text-align: center;
    background: rgba(138,158,133,0.15);
    padding: 3px 8px;
    font-size: 10px;
    border-radius: 3px;
    display: block;
  }

  /* Popup: two-column layout for IR/XR style subtasks */
  .task-detail-modal .task-detail-cols {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
  }
  .task-detail-modal .task-detail-col {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .task-detail-modal .task-detail-col-label {
    font-family: 'DM Mono', monospace;
    font-size: 10px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #5C7257;
    background: rgba(138,158,133,0.18);
    padding: 4px 8px;
    border-radius: 3px;
    text-align: center;
    margin-bottom: 4px;
  }

  /* Hide the IR/XR sub-section labels and grid layout INLINE (still visible in popup) */
  .day-task-item.adderall-toggle .task-extras.two-col-grid {
    display: block !important;
  }
  .day-task-item.adderall-toggle .task-extras.two-col-grid > .ir-col,
  .day-task-item.adderall-toggle .task-extras.two-col-grid > .xr-col {
    display: contents !important;
  }
  .day-task-item.adderall-toggle .task-extras.two-col-grid .task-group-label.sub-section {
    display: none !important;
  }

  /* May 4: hide inline flowchart subtasks (only show in popup) */
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras ,
  

  /* May 4: hide inline flowchart subtasks (only show in popup) */
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras {
    display: none !important;
  }

  /* Priority label in popup subtasks */
  .task-detail-modal .subtask-priority-tag {
    font-family: 'DM Mono', monospace;
    font-size: 9px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: #b04444;
    opacity: 0.85;
    margin-left: 6px;
    white-space: nowrap;
  }

  /* (removed: parent indicator when it has a pinned subtask — preview itself shows PRIORITY) */

  /* Priority subtask preview: shown inline under parent, smaller, subtle */
  .day-task-item .task-extras .task-subtask.priority,
  .day-task-item .task-extras .flow-node.priority {
    display: flex !important;
    visibility: visible !important;
    opacity: 0.85;
    font-size: 11px;
    margin-top: 1px;
  }
  /* Show the task-extras container ONLY when it contains a .priority sub */
  .day-task-item.expandable .task-extras:has(.priority) {
    display: flex !important;
    flex-direction: column;
    margin-top: 2px;
  }
  /* Hide non-priority subs even when container is shown */
  .day-task-item.expandable .task-extras:has(.priority) > .task-subtask:not(.priority),
  .day-task-item.expandable .task-extras:has(.priority) > .flowchart-task,
  .day-task-item.expandable .task-extras:has(.priority) > .flow-node:not(.priority) {
    display: none !important;
  }
  /* Override the May 4 hide-all rule for priority preview */
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras:has(.priority) ,
  
  /* Override the May 4 hide-all rule for priority preview */
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras:has(.priority) {
    display: flex !important;
    flex-direction: column;
  }

  /* Parent stays centered even with priority preview underneath */
  .day-task-item.expandable:has(.task-extras .priority) {
    flex-wrap: wrap !important;
  }
  .day-task-item.expandable:has(.task-extras .priority) > .day-task-text {
    flex-basis: auto !important;
  }

  .task-detail-modal .task-detail-add-sub {
    margin-top: 12px;
    padding: 8px 14px;
    background: transparent;
    border: 1px dashed var(--light-sage);
    border-radius: 4px;
    font-family: 'DM Mono', monospace;
    font-size: 10px;
    letter-spacing: 0.1em;
    color: var(--accent);
    cursor: pointer;
    text-transform: lowercase;
    width: 100%;
    transition: all 0.15s ease;
  }
  .task-detail-modal .task-detail-add-sub:hover {
    background: rgba(138,158,133,0.1);
    border-style: solid;
  }

  /* May 4: center-align expandable parent task text (Vyvanse, Strattera) */
  .day-block[data-date="2026-05-04"] .day-task-item.expandable ,
   Strattera) */
  .day-block[data-date="2026-05-05"] .day-task-item.expandable {
    justify-content: center !important;
    text-align: center !important;
    flex-wrap: wrap !important;
  }
  .day-block[data-date="2026-05-04"] .day-task-item.expandable > .day-task-text ,
  
  .day-block[data-date="2026-05-05"] .day-task-item.expandable > .day-task-text {
    text-align: center !important;
    flex: 0 1 auto !important;
  }
  
  /* Priority subtask preview on main card — indented under parent */
  .day-block[data-date="2026-05-04"] .day-task-item.expandable .task-extras .task-subtask.priority ,
  
  
  /* Priority subtask preview on main card — indented under parent */
  .day-block[data-date="2026-05-05"] .day-task-item.expandable .task-extras .task-subtask.priority {
    font-size: 14px !important;
    opacity: 0.7;
    margin-left: 0 !important;
    margin-top: 1px !important;
    width: 100%;
    flex-basis: 100%;
    justify-content: flex-start !important;
    text-align: left !important;
    padding-left: 32px !important;
  }
  .day-block[data-date="2026-05-04"] .day-task-item.expandable .task-extras .task-subtask.priority > .day-task-text,
  
  .day-block[data-date="2026-05-05"] .day-task-item.expandable .task-extras .task-subtask.priority > .day-task-text,
  .day-block[data-date="2026-05-04"] .day-task-item.expandable .task-extras .task-subtask.priority > .day-task-text span ,
  
  .day-block[data-date="2026-05-05"] .day-task-item.expandable .task-extras .task-subtask.priority > .day-task-text span {
    font-size: 14px !important;
  }

  /* Vyvanse / Strattera (any expandable parent) — center the parent text */
  .day-block[data-date="2026-05-04"] .day-task-item.expandable > .day-task-text ,
  

  /* Vyvanse / Strattera (any expandable parent) — center the parent text */
  .day-block[data-date="2026-05-05"] .day-task-item.expandable > .day-task-text {
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
    flex: 0 0 auto !important;
  }
  .day-block[data-date="2026-05-04"] .day-task-item.expandable > .agenda-check ,
  
  .day-block[data-date="2026-05-05"] .day-task-item.expandable > .agenda-check {
    position: absolute;
    right: 8px;
  }
  .day-block[data-date="2026-05-04"] .day-task-item.expandable ,
  
  .day-block[data-date="2026-05-05"] .day-task-item.expandable {
    position: relative;
    flex-wrap: wrap;
    justify-content: center !important;
  }

  /* May 4: nuclear center on Vyvanse/Strattera — text takes full row, sub-preview takes own row */
  .day-block[data-date="2026-05-04"] .day-task-item.expandable ,
   sub-preview takes own row */
  .day-block[data-date="2026-05-05"] .day-task-item.expandable {
    display: block !important;
    text-align: center !important;
    position: relative !important;
  }
  .day-block[data-date="2026-05-04"] .day-task-item.expandable > .day-task-text ,
  
  .day-block[data-date="2026-05-05"] .day-task-item.expandable > .day-task-text {
    display: block !important;
    text-align: center !important;
    width: 100% !important;
  }
  .day-block[data-date="2026-05-04"] .day-task-item.expandable > .agenda-check ,
  
  .day-block[data-date="2026-05-05"] .day-task-item.expandable > .agenda-check {
    position: absolute !important;
    right: 8px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
  }
  .day-block[data-date="2026-05-04"] .day-task-item.expandable > .task-extras ,
  
  .day-block[data-date="2026-05-05"] .day-task-item.expandable > .task-extras {
    text-align: center !important;
  }
  /* (removed: was forcing text-align center which prevented indent) */

  .task-detail-modal .task-detail-add-sub-row {
    margin-top: 12px;
    display: flex;
    gap: 8px;
    align-items: stretch;
  }
  .task-detail-modal .task-detail-add-sub-input {
    flex: 1;
    padding: 8px 12px;
    border: 1px dashed var(--light-sage);
    border-radius: 4px;
    background: transparent;
    font-family: 'Newsreader', serif;
    font-size: 14px;
    color: var(--dark);
    outline: none;
    transition: border-color 0.15s ease;
  }
  .task-detail-modal .task-detail-add-sub-input:focus {
    border-style: solid;
    border-color: var(--accent);
  }
  .task-detail-modal .task-detail-add-sub-btn {
    padding: 8px 16px;
    background: var(--accent);
    color: var(--cream);
    border: none;
    border-radius: 4px;
    font-family: 'DM Mono', monospace;
    font-size: 10px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    cursor: pointer;
    transition: opacity 0.15s ease;
  }
  .task-detail-modal .task-detail-add-sub-btn:hover {
    opacity: 0.85;
  }

  .task-detail-modal .subtask-pin-btn {
    background: transparent;
    border: none;
    cursor: pointer;
    font-size: 14px;
    padding: 2px 6px;
    margin-left: auto;
    opacity: 0.5;
    transition: opacity 0.15s ease;
  }
  .task-detail-modal .subtask-pin-btn:hover {
    opacity: 1;
  }
  .task-detail-modal .subtask-row {
    display: flex;
    align-items: center;
    gap: 8px;
  }

  /* May 4 monthly refills: keep fraction badge inline next to text */
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle ,
  

  /* May 4 monthly refills: keep fraction badge inline next to text */
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle {
    display: block !important;
    text-align: center !important;
  }
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle > .day-task-text ,
  
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle > .day-task-text {
    display: inline !important;
    text-align: center !important;
    width: auto !important;
    margin: 0 !important;
  }
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle > .subtask-frac ,
  
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle > .subtask-frac {
    display: inline !important;
    margin-left: 8px !important;
    margin-right: 0 !important;
    vertical-align: middle;
  }
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle > .agenda-check ,
  
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle > .agenda-check {
    display: none !important;
  }

  /* Indent priority subtask preview on main day card */
  .day-tasks .day-task-item .task-extras .task-subtask.priority,
  .day-tasks .day-task-item .task-extras .flow-node.priority {
    padding-left: 32px !important;
    text-align: left !important;
    justify-content: flex-start !important;
  }

  /* When task has IR/XR columns, hide the global add-subtask row at bottom of popup */
  .task-detail-modal:has(.task-detail-cols) > div > .task-detail-add-sub-row:not(.col-add-row) {
    display: none !important;
  }
  .task-detail-modal .col-add-row {
    margin-top: 8px !important;
    flex-direction: column;
    gap: 4px;
  }
  .task-detail-modal .col-add-row .task-detail-add-sub-input {
    font-size: 12px;
    padding: 6px 8px;
  }
  .task-detail-modal .col-add-row .task-detail-add-sub-btn {
    font-size: 9px;
    padding: 4px 8px;
  }

  /* May 4: forcefully hide IR/XR two-col-grid inline (only show in popup) */
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras.two-col-grid ,
  

  /* May 4: forcefully hide IR/XR two-col-grid inline (only show in popup) */
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras.two-col-grid {
    display: none !important;
  }
  /* Even when has(.priority), still hide two-col-grid inline */
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras.two-col-grid:has(.priority) ,
   still hide two-col-grid inline */
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras.two-col-grid:has(.priority) {
    display: none !important;
  }

/* (replaced by polaroid hover style) */
  .day-block[data-date="2026-05-04"] .day-task-item .task-extras .task-subtask.priority > .day-task-text,
  

/* (replaced by polaroid hover style) */
  .day-block[data-date="2026-05-05"] .day-task-item .task-extras .task-subtask.priority > .day-task-text,
  .day-block[data-date="2026-05-04"] .day-task-item.expandable .task-extras .task-subtask.priority > .day-task-text ,
  
  .day-block[data-date="2026-05-05"] .day-task-item.expandable .task-extras .task-subtask.priority > .day-task-text {
    text-align: left !important;
  }

  /* Force the inner text of priority sub on May 4 to ALSO be flush-left */
  .day-block[data-date="2026-05-04"] .day-task-item .task-extras .task-subtask.priority,
  

  /* Force the inner text of priority sub on May 4 to ALSO be flush-left */
  .day-block[data-date="2026-05-05"] .day-task-item .task-extras .task-subtask.priority,
  .day-block[data-date="2026-05-04"] .day-task-item.expandable .task-extras .task-subtask.priority ,
  
  .day-block[data-date="2026-05-05"] .day-task-item.expandable .task-extras .task-subtask.priority {
    margin-left: 0 !important;
  }
  .day-block[data-date="2026-05-04"] .day-task-item .task-extras .task-subtask.priority > * ,
  
  .day-block[data-date="2026-05-05"] .day-task-item .task-extras .task-subtask.priority > * {
    text-align: left !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .day-block[data-date="2026-05-04"] .day-task-item .task-extras .task-subtask.priority > .day-task-text ,
  
  .day-block[data-date="2026-05-05"] .day-task-item .task-extras .task-subtask.priority > .day-task-text {
    display: inline-block !important;
    text-align: left !important;
    margin-left: 0 !important;
  }

  /* TRY ABSOLUTE POSITIONING for priority sub on May 4 */
  .day-block[data-date="2026-05-04"] .day-task-item.expandable ,
  

  /* TRY ABSOLUTE POSITIONING for priority sub on May 4 */
  .day-block[data-date="2026-05-05"] .day-task-item.expandable {
    position: relative !important;
  }
  .day-block[data-date="2026-05-04"] .day-task-item.expandable .task-extras ,
  
  .day-block[data-date="2026-05-05"] .day-task-item.expandable .task-extras {
    position: relative !important;
  }

  /* Edit mode: hide controls on day card by default, show only when editing */
  .add-pin-btn,
  .day-task-item .unpin-btn,
  .flow-node .flow-expand,
  .flowchart-task .flow-expand,
  .task-subtask .subtask-pin-btn,
  .day-task-item.priority > .priority-tag-inline,
  .flow-node-toggle {
    display: none !important;
  }
  body.editing .add-pin-btn,
  body.editing .day-task-item .unpin-btn,
  body.editing .flow-node .flow-expand,
  body.editing .flowchart-task .flow-expand,
  body.editing .task-subtask .subtask-pin-btn,
  body.editing .flow-node-toggle {
    display: inline-flex !important;
  }
  


  /* Edit mode also applies inside popup: hide pin and + buttons by default */
  .task-detail-modal .subtask-pin-btn,
  .task-detail-modal .flow-expand,
  .task-detail-modal .col-add-row,
  .task-detail-modal .task-detail-add-sub-row {
    display: none !important;
  }
  body.editing .task-detail-modal .subtask-pin-btn {
    display: inline-flex !important;
  }
  body.editing .task-detail-modal .flow-expand {
    display: inline-flex !important;
  }
  body.editing .task-detail-modal .col-add-row,
  body.editing .task-detail-modal .task-detail-add-sub-row {
    display: flex !important;
  }

  /* When monthly refills has a pinned subtask, show ONLY that pinned sub inline (not the whole grid) */
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras.two-col-grid:has(.priority) ,
   show ONLY that pinned sub inline (not the whole grid) */
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras.two-col-grid:has(.priority) {
    display: block !important;
    grid-template-columns: none !important;
  }
  /* Hide IR/XR column headers and non-priority items inside */
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras.two-col-grid:has(.priority) .ir-col,
  
  /* Hide IR/XR column headers and non-priority items inside */
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras.two-col-grid:has(.priority) .ir-col,
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras.two-col-grid:has(.priority) .xr-col ,
  
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras.two-col-grid:has(.priority) .xr-col {
    display: contents !important;
  }
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras.two-col-grid:has(.priority) .task-group-label.sub-section,
  
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras.two-col-grid:has(.priority) .task-group-label.sub-section,
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras.two-col-grid:has(.priority) .task-subtask:not(.priority),
  
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras.two-col-grid:has(.priority) .task-subtask:not(.priority),
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras.two-col-grid:has(.priority) .flow-node:not(.priority),
  
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras.two-col-grid:has(.priority) .flow-node:not(.priority),
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras.two-col-grid:has(.priority) .flowchart-task ,
  
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras.two-col-grid:has(.priority) .flowchart-task {
    display: none !important;
  }
  /* Make the pinned sub itself visible inline, indented */
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras.two-col-grid:has(.priority) .task-subtask.priority ,
   indented */
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras.two-col-grid:has(.priority) .task-subtask.priority {
    display: block !important;
    margin-left: 50% !important;
    text-align: left !important;
    padding-left: 0 !important;
    width: auto !important;
  }

  /* D4 polaroid hover style for priority subtasks on May 4 */
  .day-block[data-date="2026-05-04"] .day-task-item.expandable ,
  

  /* D4 polaroid hover style for priority subtasks on May 4 */
  .day-block[data-date="2026-05-05"] .day-task-item.expandable {
    position: relative !important;
    overflow: visible !important;
  }
  .day-block[data-date="2026-05-04"] .day-task-item.expandable .task-extras ,
  
  .day-block[data-date="2026-05-05"] .day-task-item.expandable .task-extras {
    position: static !important;
    overflow: visible !important;
  }
  .day-block[data-date="2026-05-04"] .day-task-item.expandable .task-extras .task-subtask.priority,
  
  .day-block[data-date="2026-05-05"] .day-task-item.expandable .task-extras .task-subtask.priority,
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras.two-col-grid .task-subtask.priority ,
  
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras.two-col-grid .task-subtask.priority {
    position: absolute !important;
    bottom: 100% !important;
    left: 50% !important;
    right: auto !important;
    top: auto !important;
    transform: translateX(-50%) translateY(-2px) rotate(-2deg) !important;
    background: #FFFEF8 !important;
    padding: 3px 8px 8px !important;
    font-family: 'Reenie Beanie', cursive !important;
    font-size: 12px !important;
    color: var(--dark) !important;
    white-space: nowrap !important;
    box-shadow: 0 12px 28px rgba(0,0,0,0.22), 0 6px 12px rgba(0,0,0,0.12), 0 2px 4px rgba(0,0,0,0.08) !important;
    z-index: 5 !important;
    margin: 0 !important;
    width: auto !important;
    text-align: left !important;
    display: block !important;
    border-radius: 0 !important;
  }
  .day-block[data-date="2026-05-04"] .day-task-item.expandable .task-extras .task-subtask.priority > .day-task-text,
  
  .day-block[data-date="2026-05-05"] .day-task-item.expandable .task-extras .task-subtask.priority > .day-task-text,
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras.two-col-grid .task-subtask.priority > .day-task-text ,
  
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras.two-col-grid .task-subtask.priority > .day-task-text {
    font-size: 12px !important;
    text-align: left !important;
    margin: 0 !important;
  }
  /* Hide checkbox inside polaroid hover */
  .day-block[data-date="2026-05-04"] .day-task-item.expandable .task-extras .task-subtask.priority > .agenda-subcheck,
  
  /* Hide checkbox inside polaroid hover */
  .day-block[data-date="2026-05-05"] .day-task-item.expandable .task-extras .task-subtask.priority > .agenda-subcheck,
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras.two-col-grid .task-subtask.priority > .agenda-subcheck ,
  
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras.two-col-grid .task-subtask.priority > .agenda-subcheck {
    display: none !important;
  }
  /* Hide PRIORITY tag inside polaroid (the polaroid IS the priority indicator) */
  .day-block[data-date="2026-05-04"] .task-subtask.priority > .day-task-text::after ,
  
  /* Hide PRIORITY tag inside polaroid (the polaroid IS the priority indicator) */
  .day-block[data-date="2026-05-05"] .task-subtask.priority > .day-task-text::after {
    display: none !important;
  }
  /* Add space at top of expandable parent so polaroid hover doesn't get cut off */
  .day-block[data-date="2026-05-04"] .day-task-item.expandable ,
  
  /* Add space at top of expandable parent so polaroid hover doesn't get cut off */
  .day-block[data-date="2026-05-05"] .day-task-item.expandable {
    margin-top: 0 !important;
  }

  /* Anchor polaroid to .day-task-item, not the inner column */
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle ,
   not the inner column */
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle {
    position: relative !important;
    overflow: visible !important;
  }
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras.two-col-grid ,
  
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras.two-col-grid {
    position: static !important;
    overflow: visible !important;
  }
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras.two-col-grid .ir-col,
  
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras.two-col-grid .ir-col,
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras.two-col-grid .xr-col ,
  
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras.two-col-grid .xr-col {
    position: static !important;
  }
  /* Override anchor for monthly refills polaroid: position relative to parent day-task-item */
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras.two-col-grid .task-subtask.priority ,
  
  /* Override anchor for monthly refills polaroid: position relative to parent day-task-item */
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras.two-col-grid .task-subtask.priority {
    bottom: 100% !important;
    left: 50% !important;
    right: auto !important;
    margin-top: 0 !important;
  }

  /* Bump gap between polaroid and parent for ALL priority polaroids on May 4 */
  .day-block[data-date="2026-05-04"] .day-task-item .task-extras .task-subtask.priority,
  

  /* Bump gap between polaroid and parent for ALL priority polaroids on May 4 */
  .day-block[data-date="2026-05-05"] .day-task-item .task-extras .task-subtask.priority,
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras.two-col-grid .task-subtask.priority ,
  
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras.two-col-grid .task-subtask.priority {
    transform: translateX(-50%) translateY(-12px) rotate(-2deg) !important;
  }

  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle ,
  

  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle {
    margin-top: 0 !important;
  }

  /* Vyvanse / Strattera polaroids — diagonal upper-right offset */
  .day-block[data-date="2026-05-04"] .day-task-item.expandable:not(.adderall-toggle) .task-extras .task-subtask.priority ,
  

  /* Vyvanse / Strattera polaroids — diagonal upper-right offset */
  .day-block[data-date="2026-05-05"] .day-task-item.expandable:not(.adderall-toggle) .task-extras .task-subtask.priority {
    bottom: auto !important;
    top: -8px !important;
    left: auto !important;
    right: 16px !important;
    transform: translate(0, 0) rotate(-3deg) !important;
  }

  .day-block[data-date="2026-05-04"] .day-task-item.expandable:not(.adderall-toggle) ,
  

  .day-block[data-date="2026-05-05"] .day-task-item.expandable:not(.adderall-toggle) {
    margin-top: 0 !important;
    padding-right: 0 !important;
  }

  /* Monthly refills polaroid — closer to parent, upper-right diagonal */
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras.two-col-grid .task-subtask.priority ,
   upper-right diagonal */
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras.two-col-grid .task-subtask.priority {
    bottom: auto !important;
    top: -8px !important;
    left: auto !important;
    right: 16px !important;
    transform: translate(0, 0) rotate(-3deg) !important;
  }

  /* Gentle bobbing animation for priority polaroid (hovering feel) */
  @keyframes polaroidBob {
    0%, 100% { transform: translateY(0) rotate(-3deg); }
    50% { transform: translateY(-3px) rotate(-3deg); }
  }
  .day-block[data-date="2026-05-04"] .day-task-item.expandable:not(.adderall-toggle) .task-extras .task-subtask.priority,
  
  .day-block[data-date="2026-05-05"] .day-task-item.expandable:not(.adderall-toggle) .task-extras .task-subtask.priority,
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras.two-col-grid .task-subtask.priority ,
  
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras.two-col-grid .task-subtask.priority {
    animation: polaroidBob 3s ease-in-out infinite !important;
  }

  /* Ensure polaroid never covers parent text — anchor above the parent text line */
  .day-block[data-date="2026-05-04"] .day-task-item.expandable:not(.adderall-toggle) .task-extras .task-subtask.priority,
  

  /* Ensure polaroid never covers parent text — anchor above the parent text line */
  .day-block[data-date="2026-05-05"] .day-task-item.expandable:not(.adderall-toggle) .task-extras .task-subtask.priority,
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras.two-col-grid .task-subtask.priority ,
  
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras.two-col-grid .task-subtask.priority {
    bottom: 100% !important;
    top: auto !important;
    right: 8px !important;
    left: auto !important;
    margin-bottom: -4px !important;
  }
  /* Update bob animation to keep it ABOVE the parent line */
  @keyframes polaroidBob {
    0%, 100% { transform: translateY(0) rotate(-3deg); }
    50% { transform: translateY(-3px) rotate(-3deg); }
  }

  /* Vyvanse / Strattera polaroids — tuck closer to parent line */
  .day-block[data-date="2026-05-04"] .day-task-item.expandable:not(.adderall-toggle) .task-extras .task-subtask.priority ,
  

  /* Vyvanse / Strattera polaroids — tuck closer to parent line */
  .day-block[data-date="2026-05-05"] .day-task-item.expandable:not(.adderall-toggle) .task-extras .task-subtask.priority {
    margin-bottom: -21px !important;
  }

  /* Move Creyos/RedBox polaroid horizontally closer to centered Vyvanse/Strattera text */
  .day-block[data-date="2026-05-04"] .day-task-item.expandable:not(.adderall-toggle) .task-extras .task-subtask.priority ,
  

  /* Move Creyos/RedBox polaroid horizontally closer to centered Vyvanse/Strattera text */
  .day-block[data-date="2026-05-05"] .day-task-item.expandable:not(.adderall-toggle) .task-extras .task-subtask.priority {
    right: auto !important;
    left: calc(60% + 3px) !important;
  }




  /* Show pinned flow-nodes on main card (monthly refills) — escape the hidden two-col-grid */
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras.two-col-grid:has(.flow-node.priority),
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras.two-col-grid:has(.flow-node.priority) {
    display: block !important;
    grid-template-columns: none !important;
  }
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras.two-col-grid:has(.flow-node.priority) .ir-col,
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras.two-col-grid:has(.flow-node.priority) .xr-col,
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras.two-col-grid:has(.flow-node.priority) .ir-col,
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras.two-col-grid:has(.flow-node.priority) .xr-col {
    display: contents !important;
  }
  /* Hide non-pinned flow-nodes and other items */
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras.two-col-grid:has(.flow-node.priority) .flowchart-task:not(:has(.flow-node.priority)),
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras.two-col-grid:has(.flow-node.priority) .flowchart-task:not(:has(.flow-node.priority)) {
    display: none !important;
  }
  /* Show flow-node.priority as a polaroid hover */
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras.two-col-grid .flow-node.priority,
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras.two-col-grid .flow-node.priority {
    position: absolute !important;
    bottom: 100% !important;
    top: auto !important;
    right: auto !important;
    left: calc(60% + 3px) !important;
    margin-bottom: -21px !important;
    background: #FFFEF8 !important;
    padding: 3px 8px 8px !important;
    font-family: 'Reenie Beanie', cursive !important;
    font-size: 12px !important;
    color: var(--dark) !important;
    white-space: nowrap !important;
    box-shadow: 0 12px 28px rgba(0,0,0,0.22), 0 6px 12px rgba(0,0,0,0.12), 0 2px 4px rgba(0,0,0,0.08) !important;
    z-index: 5 !important;
    width: auto !important;
    text-align: left !important;
    display: block !important;
    border-radius: 0 !important;
    animation: polaroidBob 3s ease-in-out infinite !important;
  }
  /* Hide the flowchart-task wrapper checkbox/+button when only flow-node.priority should show */
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras.two-col-grid .flowchart-task:has(> .flow-node.priority) > *:not(.flow-node.priority),
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras.two-col-grid .flowchart-task:has(> .flow-node.priority) > *:not(.flow-node.priority) {
    display: none !important;
  }

  /* Force-show priority flow-nodes even if they have .hidden class */
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .flow-node.priority.hidden,
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .flow-node.priority.hidden {
    display: block !important;
    visibility: visible !important;
  }

  /* AGGRESSIVE: force pinned flow-nodes to render as polaroid on day card */
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .flow-node.priority,
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .flow-node.priority {
    position: absolute !important;
    bottom: 100% !important;
    top: auto !important;
    right: auto !important;
    left: calc(60% + 3px) !important;
    margin-bottom: -21px !important;
    background: #FFFEF8 !important;
    padding: 3px 8px 8px !important;
    font-family: 'Reenie Beanie', cursive !important;
    font-size: 12px !important;
    color: var(--dark) !important;
    white-space: nowrap !important;
    box-shadow: 0 12px 28px rgba(0,0,0,0.22), 0 6px 12px rgba(0,0,0,0.12), 0 2px 4px rgba(0,0,0,0.08) !important;
    z-index: 5 !important;
    width: auto !important;
    text-align: left !important;
    display: block !important;
    visibility: visible !important;
    border-radius: 0 !important;
    animation: polaroidBob 3s ease-in-out infinite !important;
  }
  /* Hide the entire flowchart-task wrapper (the chain) when its flow-node is priority */
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .flowchart-task:has(.flow-node.priority),
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .flowchart-task:has(.flow-node.priority) {
    /* still need to render the .priority flow-node, but hide chain elements */
    background: transparent !important;
  }
  /* Ensure the parent day-task-item is positioning context */
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle,
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle {
    position: relative !important;
    overflow: visible !important;
  }
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .task-extras,
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .task-extras,
  .day-block[data-date="2026-05-04"] .day-task-item.adderall-toggle .flowchart-task,
  .day-block[data-date="2026-05-05"] .day-task-item.adderall-toggle .flowchart-task {
    overflow: visible !important;
  }

  .subtask-row.done span { text-decoration: line-through; opacity: 0.45; }
  .subtask-row.done { opacity: 0.6; }

  /* Vertical flow chart card */
  .flow-chart-card {
    background: #E8ECDF;
    border: 1px solid rgba(168, 133, 86, 0.3);
    border-radius: 6px;
    padding: 14px 14px 16px;
    margin: 10px 0 6px;
    box-shadow: 0 2px 8px rgba(107, 77, 42, 0.06);
  }
  /* Tight date→flow gap — TODAY ONLY */
  :is(.day-block.today, .day-block.flow-modern) .flow-chart-card {
    margin-top: 4px;
  }
  .flow-chart-card .flow-title {
    font-family: 'DM Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: #5C7257;
    text-align: center;
    margin: 0 0 18px;
    opacity: 0.9;
  }
  /* === Bigger title gap + shimmering arrows + X delete + selectable text — TODAY ONLY === */
  :is(.day-block.today, .day-block.flow-modern) .flow-chart-card .flow-title {
    margin: 0 0 24px !important;
  }
  :is(.day-block.today, .day-block.flow-modern) .flow-chart-card .flow-arrow {
    font-size: 22px !important;
    line-height: 1 !important;
    background: linear-gradient(90deg, #8a6d1f 0%, #c4a882 25%, #f4d97a 50%, #c4a882 75%, #8a6d1f 100%);
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    animation: allah-shimmer 4s linear infinite;
    filter: drop-shadow(0 2px 4px rgba(0,0,0,0.25)) drop-shadow(0 0 8px rgba(244,217,122,0.3));
  }
  /* Hide empty task-group-label spans (edit-mode placeholder bars) — global, harmless */
  .task-group-label:has(> br:only-child) { display: none !important; }
  .task-group-label:empty { display: none !important; }
  /* Hide all flow-delete buttons globally — they were accidentally baked into past-day HTML
     by the earlier (pre-scoping) /move-cards POSTs. Today's hover rule below re-shows them. */
  .flow-delete { display: none !important; }

  /* === Rehearsal camera toggle ===
     Shown on flow-steps with data-rehearsal="true" (auto-set by JS for tasks
     whose name starts with "rehearsal"). Tan when data-recorded="true". */
  .flow-cam-toggle {
    display: none;
    margin-left: 6px;
    width: 18px; height: 18px;
    background: transparent; border: none; padding: 0;
    cursor: pointer;
    vertical-align: middle;
    color: rgba(196, 168, 130, 0.4);
    transition: color .2s ease;
  }
  /* Show camera toggle on EVERY flow-step / sequence-clone / focus-clone */
  .flow-step .flow-cam-toggle,
  .sequence-clone .flow-cam-toggle,
  .focus-clone .flow-cam-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .flow-step[data-recorded="true"] .flow-cam-toggle,
  .sequence-clone[data-recorded="true"] .flow-cam-toggle,
  .focus-clone[data-recorded="true"] .flow-cam-toggle {
    color: #a88556;
  }
  .flow-cam-toggle:hover { color: #a88556; }
  .flow-cam-toggle svg { width: 14px; height: 14px; }
  /* Inline X delete button — shown on TODAY, flow-modern days, AND any 3-diagram card */
  :is(.day-block.today, .day-block.flow-modern) .flow-chart-card .flow-step,
  .flow-chart-card.may22-sections .flow-step { position: relative; }
  :is(.day-block.today, .day-block.flow-modern) .flow-chart-card .flow-step .flow-delete,
  .flow-chart-card.may22-sections .flow-step .flow-delete {
    position: absolute;
    top: -8px;
    right: -8px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fff;
    color: #c4a882;
    border: 1px solid rgba(196,168,130,0.6);
    font-family: 'DM Mono', monospace;
    font-size: 14px;
    line-height: 1;
    padding: 0;
    cursor: pointer;
    display: none;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 3px rgba(0,0,0,0.15);
    z-index: 100;
  }
  :is(.day-block.today, .day-block.flow-modern) .flow-chart-card .flow-step:hover .flow-delete,
  .flow-chart-card.may22-sections .flow-step:hover .flow-delete { display: flex !important; }
  /* On hover, the entire pill rises above siblings so the X (top:-8px) isn't visually covered
     by the next pill below it. (pill z-index lift) */
  :is(.day-block.today, .day-block.flow-modern) .flow-chart-card .flow-step:hover,
  .flow-chart-card.may22-sections .flow-step:hover {
    z-index: 50;
  }
  :is(.day-block.today, .day-block.flow-modern) .flow-chart-card .flow-step .flow-delete:hover,
  .flow-chart-card.may22-sections .flow-step .flow-delete:hover {
    background: #c4a882;
    color: #fff;
  }
  /* Let the X delete button escape the day-card's overflow:hidden clip
     (X escape-clip override) — only on modern-flow days that actually have hover-Xs. */
  :is(.day-block.today, .day-block.flow-modern) .day-card {
    overflow: visible !important;
  }
  :is(.day-block.today, .day-block.flow-modern) .flow-chart-card {
    overflow: visible !important;
  }
  /* day-tasks overflow visible for X (escape) */
  :is(.day-block.today, .day-block.flow-modern) .day-tasks {
    overflow: visible !important;
  }
  :is(.day-block.today, .day-block.flow-modern) {
    overflow: visible !important;
  }



  /* ===== Hover note: appears inline as a continuation of the task text on hover.
     Put data-hover-note on the .flow-step-text span. The note fades in to the right
     of the text in the same font, but muted, with an em-dash separator.
     IMPORTANT: the pill normally has overflow:hidden + text-overflow:ellipsis so
     long titles truncate. That same clipping was hiding the ::after note. On hover,
     we lift both truncations (parent and child) so the note becomes visible — the
     pill smoothly expands to fit. ===== */
  .flow-chart-card .flow-step-text[data-hover-note]::after {
    content: " " attr(data-hover-note);
    font-family: inherit;
    font-style: italic;
    font-weight: 400;
    color: rgba(42, 42, 42, 0.55);
    pointer-events: none;
    margin-left: 0;
    white-space: nowrap;
    display: none;  /* hidden AND takes no layout space — so default text stays centered */
  }
  /* Lift truncation on hover so the note shows. The pill expands to fit content. */
  :is(.day-block.today, .day-block.flow-modern) .flow-chart-card .flow-step:has(.flow-step-text[data-hover-note]):hover {
    width: auto !important;
    min-width: 400px;
    max-width: 100% !important;
    overflow: visible !important;
    white-space: nowrap !important;
    text-overflow: clip !important;
    z-index: 5;
  }
  :is(.day-block.today, .day-block.flow-modern) .flow-chart-card .flow-step:hover .flow-step-text[data-hover-note] {
    overflow: visible !important;
    text-overflow: clip !important;
  }
  .flow-chart-card .flow-step:hover .flow-step-text[data-hover-note]::after {
    display: inline;
  }
  /* ===== Hover PREFIX: appears BEFORE the text on hover ===== */
  .flow-chart-card .flow-step-text[data-hover-prefix]::before {
    content: attr(data-hover-prefix) " ";
    font-family: inherit;
    font-style: italic;
    font-weight: 400;
    color: rgba(42, 42, 42, 0.55);
    pointer-events: none;
    white-space: nowrap;
    display: none;  /* hidden AND no layout space — default text stays centered */
  }
  :is(.day-block.today, .day-block.flow-modern) .flow-chart-card .flow-step:has(.flow-step-text[data-hover-prefix]):hover {
    width: auto !important;
    min-width: 400px;
    max-width: 100% !important;
    overflow: visible !important;
    white-space: nowrap !important;
    text-overflow: clip !important;
    z-index: 5;
    justify-content: flex-start !important;
  }
  :is(.day-block.today, .day-block.flow-modern) .flow-chart-card .flow-step:hover .flow-step-text[data-hover-prefix] {
    overflow: visible !important;
    text-overflow: clip !important;
    text-align: left !important;
  }
  .flow-chart-card .flow-step:hover .flow-step-text[data-hover-prefix]::before {
    display: inline;
  }
  /* ===== Same hover-note / hover-prefix behavior for May 22 CLONES =====
     sequence-clone and focus-clone are not .flow-step elements, so the rules above
     don't fire on them. Re-add the show-on-hover rules with the clone selectors. */
  .may22-section-sequence .sequence-clone:hover .flow-step-text[data-hover-note]::after,
  .may22-section-focus .focus-clone:hover .flow-step-text[data-hover-note]::after {
    display: inline;
  }
  .may22-section-sequence .sequence-clone:hover .flow-step-text[data-hover-prefix]::before,
  .may22-section-focus .focus-clone:hover .flow-step-text[data-hover-prefix]::before {
    display: inline;
  }
  /* FOCUS hover — ONLY when the item has a hover-note (otherwise stay centered).
     Switches to LEFT alignment so original text + inline hover-note can fit on ONE
     line. Pill grows beyond container if needed, never shrinks below container. */
  .may22-section-focus .focus-clone:has(.flow-step-text[data-hover-note]):hover,
  .may22-section-focus .focus-clone:has(.flow-step-text[data-hover-prefix]):hover {
    justify-content: flex-start !important;
    text-align: left !important;
    white-space: nowrap !important;
    width: max-content !important;
    min-width: 460px !important;
    max-width: none !important;
    align-self: center;
    z-index: 5;
  }
  .may22-section-focus .focus-clone:has(.flow-step-text[data-hover-note]):hover .flow-step-text,
  .may22-section-focus .focus-clone:has(.flow-step-text[data-hover-prefix]):hover .flow-step-text {
    white-space: nowrap !important;
  }
  /* Allow the hovered pill to escape the body container's clip. Restore clip when collapsed. */
  .may22-section-focus .may22-section-body {
    overflow: visible;
  }
  .may22-section-focus.collapsed .may22-section-body {
    overflow: hidden !important;
  }
  /* Constellation labels — render hover-note/prefix the same way */
  .may22-section-flow .const-label[data-hover-note]::after {
    content: " " attr(data-hover-note);
    font-style: italic;
    color: rgba(42, 42, 42, 0.55);
    display: none;
    pointer-events: none;
  }
  .may22-section-flow .const-label[data-hover-prefix]::before {
    content: attr(data-hover-prefix) " ";
    font-style: italic;
    color: rgba(42, 42, 42, 0.55);
    display: none;
    pointer-events: none;
  }
  .may22-section-flow .const-node:hover + .const-label[data-hover-note]::after,
  .may22-section-flow .const-label[data-hover-note]:hover::after {
    display: inline;
  }
  .may22-section-flow .const-node:hover + .const-label[data-hover-prefix]::before,
  .may22-section-flow .const-label[data-hover-prefix]:hover::before {
    display: inline;
  }
  /* Selectable text — note: overflow stays hidden so ellipsis works (changed from visible) */
  :is(.day-block.today, .day-block.flow-modern) .flow-chart-card .flow-step {
    user-select: text;
    -webkit-user-select: text;
  }
  .flow-chart-card .flow-step {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    background: #fff;
    border: 1px solid rgba(196, 168, 130, 0.4);
    border-radius: 4px;
    padding: 9px 14px;
    font-family: 'Newsreader', serif;
    font-size: 14px;
    color: var(--dark, #2a2a2a);
    margin: 0 auto;
    width: 320px;
    max-width: 100%;
    box-sizing: border-box;
    position: relative;
    cursor: pointer;
    user-select: none;
    transition: opacity 0.2s;
  }
  /* ===== Multi-select state (SortableJS MultiDrag) ===== */
  /* Cmd+Click (Mac) / Ctrl+Click (Win/Linux) to add a flow-step to the selection,
     then drag any selected item to move them as a group. */
  .flow-chart-card .flow-step.flow-step-selected {
    background: rgba(196, 168, 130, 0.22) !important;
    border-color: #c4a882 !important;
    box-shadow: 0 0 0 1px #c4a882, 0 2px 6px rgba(196, 168, 130, 0.25);
    outline: none;
  }
  :is(.day-block.today, .day-block.flow-modern) .flow-chart-card .flow-step.flow-step-selected {
    background: rgba(196, 168, 130, 0.18) !important;
    box-shadow: 0 0 0 1.5px #c4a882, 0 2px 8px rgba(196, 168, 130, 0.25);
  }
  /* Subtle ghost during drag */
  .flow-step-dragging {
    opacity: 0.45;
  }

  /* Today's flow-step overrides — white pill, fixed 400px width, ellipsis on inner text */
  :is(.day-block.today, .day-block.flow-modern) .flow-chart-card .flow-step {
    background: #FFFFFF !important;
    font-size: 16px !important;
    margin: 6px auto !important;       /* centered */
    width: 400px !important;
    max-width: 100% !important;
    cursor: default !important;
    user-select: text !important;
    -webkit-user-select: text !important;
    white-space: nowrap !important;
    /* NO overflow:hidden on the parent — that was clipping the X delete button.
       Truncation happens on the inner .flow-step-text span instead. */
  }
  /* Done items get the warm cream background (matches may 6's done-item bg) */
  :is(.day-block.today, .day-block.flow-modern) .flow-chart-card .flow-step.done {
    background: #f6f3ec !important;
  }
  /* MAY 22 ONLY — alabaster pill background. Other modern-flow days stay white. */
  .day-block[data-date="2026-05-22"] .flow-chart-card .flow-step {
    background: #F5F1E8 !important;  /* B · parchment */
  }
  .day-block[data-date="2026-05-22"] .flow-chart-card .flow-step.done {
    background: #f6f3ec !important;  /* keep warm-cream for done */
  }

  /* ============================================================
     MAY 22 — two independent collapsible sections (flow + focus)
     ============================================================ */
  .may22-sections { padding-bottom: 8px; }

  .may22-section {
    /* Uniform spacing with breathing room between buttons */
    margin: 14px 0 !important;
    align-self: stretch !important;
    width: 100% !important;
  }
  .may22-section-header {
    display: block;
    width: 100%;
    cursor: pointer;
    padding: 14px 18px;
    background: linear-gradient(180deg, #dcd6c1 0%, #c8c2ad 100%);
    border: 1px solid rgba(168, 133, 86, 0.5);
    border-radius: 26px;
    font-family: 'DM Mono', monospace;
    font-size: 11px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.26em;
    color: #5a4d33;
    text-align: center;
    user-select: none;
    transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease, letter-spacing 0.18s ease;
    box-sizing: border-box;
    box-shadow:
      0 3px 6px rgba(107, 77, 42, 0.18),
      0 1px 2px rgba(107, 77, 42, 0.10),
      inset 0 1px 0 rgba(255, 255, 255, 0.8),
      inset 0 -1px 0 rgba(168, 133, 86, 0.15);
  }
  .may22-section-header:hover {
    background: linear-gradient(180deg, #e3decb 0%, #ccc6b1 100%);
    transform: translateY(-2px);
    letter-spacing: 0.3em;
    box-shadow:
      0 6px 12px rgba(107, 77, 42, 0.28),
      0 2px 4px rgba(107, 77, 42, 0.14),
      inset 0 1px 0 rgba(255, 255, 255, 0.8);
  }
  .may22-section-header:active {
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(107, 77, 42, 0.15), inset 0 1px 2px rgba(107, 77, 42, 0.1);
  }
  /* All section header text — unified moss green (same as canvas) */
  .may22-section-flow     > .may22-section-header,
  .may22-section-agenda   > .may22-section-header,
  .may22-section-focus    > .may22-section-header,
  .may22-section-all      > .may22-section-header,
  .may22-section-sequence > .may22-section-header { color: #4d6e5a; }
  .may22-section.collapsed .may22-section-header {
    /* Keep the pale moss gradient + border + moss text identical to expanded state.
       The ▸/▾ chevron already communicates state — no need to dim the pill. */
  }
  .may22-section-header .chev { display: none; }

  .may22-section-body {
    overflow: hidden;
    max-height: 2000px;
    transition: max-height 0.4s ease, padding 0.3s ease, opacity 0.3s;
    padding: 16px 0 8px;     /* tighter bottom — was 22px which compounded the gap */
    position: relative;
  }
  .may22-section.collapsed .may22-section-body {
    max-height: 0;
    padding: 0;
    opacity: 0;
  }

  /* ===== SECTION 1: FLOW (constellation arc — dot nodes + labels beside, exactly like option F) ===== */
  .may22-section-flow .may22-section-body {
    min-height: 80px;
    /* Time-bar background has moved to AGENDA section. FLOW is now nodes+arcs only. */
  }
  /* AGENDA section — vertical timeline (option D): line on left, dots mark each item,
     items as small cards stacked chronologically. */
  .may22-section-agenda .may22-section-body {
    position: relative;
    padding: 16px 16px 16px 50px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-height: auto;
  }
  .may22-section-agenda .may22-section-body::before {
    content: '';
    position: absolute;
    left: 30px;
    top: 16px;
    bottom: 16px;
    width: 1px;
    background: rgba(196, 168, 130, 0.4);
  }
  .may22-section-agenda.collapsed .may22-section-body {
    min-height: 0 !important;
    max-height: 0 !important;
    padding: 0 !important;
    opacity: 0 !important;
    overflow: hidden !important;
  }
  .may22-section-agenda.collapsed .may22-section-body::before {
    display: none;
  }
  /* AGENDA items — flex row: bigger time on left, italic name right-aligned */
  .may22-section-agenda .agenda-item {
    position: relative;
    padding: 10px 14px;
    background: #FBF8F3;
    border: 1px solid rgba(196, 168, 130, 0.4);
    border-radius: 4px;
    font-family: 'Newsreader', serif;
    color: #2a2a2a;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
  }
  .may22-section-agenda .agenda-item::before {
    content: '';
    position: absolute;
    left: -23px;
    top: 50%;
    transform: translateY(-50%);
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--warm, #c4a882);
    border: 2px solid #FBF8F3;
  }
  .may22-section-agenda .agenda-item-time {
    font-family: 'Newsreader', serif;
    font-size: 19px;
    color: #a88556;
    letter-spacing: 0.02em;
    flex-shrink: 0;
  }
  .may22-section-agenda .agenda-item-name {
    font-size: 16px;
    font-style: italic;
    text-align: right;
    flex: 1;
  }
  .may22-section-agenda .agenda-empty {
    text-align: center;
    color: var(--dusty, #94927d);
    font-style: italic;
    font-size: 13px;
    padding: 14px 0;
  }
  /* Legacy classes from absolute-positioned implementation — hide if any stale ones exist */
  .may22-section-agenda .agenda-time-label,
  .may22-section-agenda .agenda-hour-bar,
  .may22-section-agenda .agenda-hour-label { display: none; }
  /* Old const-time-label inside FLOW — hide (legacy, no longer rendered there) */
  .may22-section-flow .const-time-label { display: none; }
  /* Section bracket (option B) — vertical brace on the left of a 2+ item group,
     with rotated section label alongside it */
  .may22-section-flow .const-section-brace {
    position: absolute;
    width: 14px;
    border-left: 1.5px solid var(--warm, #c4a882);
    border-top: 1.5px solid var(--warm, #c4a882);
    border-bottom: 1.5px solid var(--warm, #c4a882);
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
    z-index: 2;
    pointer-events: none;
  }
  .may22-section-flow .const-section-brace-label {
    position: absolute;
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 17px;
    color: #5b4733;
    transform: rotate(-90deg);
    transform-origin: top left;
    white-space: nowrap;
    z-index: 2;
    pointer-events: none;
  }
  /* Compressed-window marker — replaces 2+ empty hour bars with a single 40px label */
  .may22-section-flow .const-compressed-window {
    position: absolute;
    left: 8px; right: 12px;
    height: 32px;
    line-height: 32px;
    background: repeating-linear-gradient(
      45deg,
      rgba(196, 168, 130, 0.08) 0 6px,
      rgba(196, 168, 130, 0.04) 6px 12px
    );
    border-top: 1px dashed rgba(168, 133, 86, 0.35);
    border-bottom: 1px dashed rgba(168, 133, 86, 0.35);
    font-family: 'DM Mono', monospace;
    font-size: 10px;
    color: rgba(148, 146, 125, 0.7);
    letter-spacing: 0.06em;
    text-align: center;
    z-index: 1;
    pointer-events: none;
  }
  /* COLLAPSE FIX: min-height was preventing collapse — override on .collapsed */
  .may22-section-flow.collapsed .may22-section-body {
    min-height: 0 !important;
    max-height: 0 !important;
    padding: 0 !important;
    opacity: 0 !important;
    overflow: hidden !important;
  }
  .may22-section-focus.collapsed .may22-section-body {
    min-height: 0 !important;
    max-height: 0 !important;
    padding: 0 !important;
    opacity: 0 !important;
    overflow: hidden !important;
  }
  .may22-section-flow .const-node {
    position: absolute;
    width: 36px; height: 36px;
    border-radius: 50%;
    background: #F5F1E8;
    border: 1.5px solid #c4a882;
    display: flex; align-items: center; justify-content: center;
    font-family: 'DM Mono', monospace;
    font-size: 12px; color: #c4a882;
    cursor: pointer;
    transition: all 0.3s;
    z-index: 2;
  }
  /* Done nodes: NOT filled — same cream background as active, just show a ✓ inside */
  .may22-section-flow .const-node.done {
    background: #F5F1E8;
    color: #c4a882;
    font-size: 22px;
    font-family: 'Newsreader', serif;  /* serif ✓ reads larger than mono */
    line-height: 1;
  }

  /* SECTION-SCOPED DELETE: hide step in its respective section view */
  .may22-section-all .flow-step[data-plan-hidden="true"] { display: none !important; }
  .may22-section-all .flow-step[data-plan-hidden="true"] + .flow-arrow { display: none !important; }
  /* Per-section flags for clones — used by build functions to skip them */
  /* Flow-step descriptor — secondary subtitle text under the main name.
     Rendered in source pills (FOCUS/AGENDA/ALL/SEQUENCE) inline.
     Constellation label renders it as a stacked .const-label-descriptor block. */
  .flow-step-descriptor {
    display: inline-block;
    margin-left: 6px;
    font-family: 'Newsreader', serif;
    font-size: 12px;
    font-style: normal;
    color: #a88556;
    letter-spacing: 0.02em;
    opacity: 0.85;
  }
  /* Inline link inside a flow-step-descriptor — small tan link with arrow */
  .flow-step-descriptor a.flow-step-link,
  .const-label-descriptor a.flow-step-link {
    color: #8b6f3e;
    text-decoration: underline;
    text-decoration-color: rgba(139, 111, 62, 0.5);
    text-underline-offset: 2px;
    font-style: normal;
    font-weight: 500;
  }
  .flow-step-descriptor a.flow-step-link:hover,
  .const-label-descriptor a.flow-step-link:hover {
    color: #5a4d33;
    text-decoration-color: #5a4d33;
  }
  .may22-section-flow .const-label-descriptor {
    display: block;
    margin-top: 2px;
    font-family: 'Newsreader', serif;
    font-size: 12px;
    font-style: normal;
    color: #a88556;
    letter-spacing: 0.02em;
    opacity: 0.85;
  }
  .may22-section-flow .const-label {
    position: absolute;
    font-family: 'Newsreader', serif;
    font-size: 17px; font-style: italic;
    color: #2a2a2a;
    white-space: nowrap;
    z-index: 2;
    /* pointer-events removed — was blocking hover on labels, preventing hover-note from showing */
    cursor: default;
  }
  .may22-section-flow .const-node.done + .const-label {
    color: rgba(0,0,0,0.4);
    text-decoration: line-through;
    text-decoration-color: rgba(196, 168, 130, 0.6);
  }
  /* Time marker (from .task-time-inline) appended to constellation labels —
     subtle tan tone, slightly smaller than the label text. */
  .may22-section-flow .const-label-time {
    color: #a88556;
    font-size: 13px;
    font-style: normal;
    letter-spacing: 0.02em;
  }
  /* Camera icon inline inside every const-label — shows recording state. Faint
     by default, tan when recorded. Clicking toggles data-recorded on the source
     flow-step (which also drives the source pill's flow-cam-toggle in ALL). */
  .may22-section-flow .const-cam-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
    width: 16px; height: 16px;
    margin-left: 6px;
    background: transparent;
    border: none;
    padding: 0;
    cursor: pointer;
    color: rgba(196, 168, 130, 0.4);
    transition: color 0.15s ease;
  }
  .may22-section-flow .const-cam-toggle svg { width: 14px; height: 14px; }
  .may22-section-flow .const-cam-toggle.recorded,
  .may22-section-flow .const-cam-toggle:hover { color: #a88556; }
  /* Floating items: untimed, dashed-border circle, no number, muted. Live below
     the regular constellation, separated by a faint divider + small "floating" label. */
  .may22-section-flow .const-node.floating {
    background: transparent;
    border: 1.5px dashed rgba(196, 168, 130, 0.7);
    color: rgba(196, 168, 130, 0.7);
    font-size: 14px;
  }
  .may22-section-flow .const-node.floating:hover {
    border-color: #c4a882;
    color: #c4a882;
  }
  .may22-section-flow .const-label.floating-label {
    color: #5b4733;
    opacity: 0.75;
  }
  .may22-section-flow .const-floating-divider {
    position: absolute;
    left: 64px;
    height: 1px;
    border-top: 1px dashed rgba(196, 168, 130, 0.35);
    z-index: 3;
  }
  .may22-section-flow .const-floating-heading {
    position: absolute;
    left: 64px;
    font-family: 'DM Mono', monospace;
    font-size: 10px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: rgba(148, 146, 125, 0.85);
    z-index: 3;
  }
  .may22-section-flow .const-floating-add {
    position: absolute;
    font-family: 'DM Mono', monospace;
    font-size: 11px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: rgba(148, 146, 125, 0.7);
    background: transparent;
    border: 1px dashed rgba(196, 168, 130, 0.45);
    border-radius: 3px;
    padding: 2px 8px;
    cursor: pointer;
    z-index: 3;
  }
  .may22-section-flow .const-floating-add:hover {
    color: #5b4733;
    border-color: #c4a882;
  }
  .may22-section-flow .const-node.floating { position: absolute; }
  .may22-section-flow .const-floating-delete {
    position: absolute;
    width: 14px; height: 14px;
    border: none;
    background: transparent;
    color: rgba(196, 168, 130, 0.6);
    font-size: 14px;
    line-height: 1;
    padding: 0;
    cursor: pointer;
    z-index: 5;
    display: none;
  }
  .may22-section-flow .const-node.floating:hover ~ .const-floating-delete[data-fidx],
  .may22-section-flow .const-label.floating-label:hover ~ .const-floating-delete[data-fidx],
  .may22-section-flow .const-floating-delete:hover {
    display: block;
  }
  /* Simpler: keep delete always visible-on-hover-of-its-row via a wrapping group.
     Use JS to show/hide instead since CSS sibling selectors don't cover both
     directions. */
  .may22-section-flow .const-floating-delete:hover { color: #b3503a; }
  /* X delete on REGULAR constellation nodes (not floating) — appears top-right of
     the node on hover. JS toggles display:block; CSS handles visuals. */
  .may22-section-flow .const-node-delete {
    position: absolute;
    width: 16px; height: 16px;
    border: none;
    background: rgba(245, 241, 232, 0.95);
    color: rgba(196, 168, 130, 0.75);
    font-size: 14px;
    line-height: 14px;
    padding: 0;
    border-radius: 50%;
    cursor: pointer;
    z-index: 5;
    display: none;
    box-shadow: 0 1px 2px rgba(0,0,0,0.08);
  }
  .may22-section-flow .const-node-delete:hover { color: #b3503a; }
  /* Mask the alternating time-bar bands behind the floating block so it visually
     sits OUTSIDE the time-bar layout (it's untimed by nature). Solid card-cream
     covers the stripes; sits below nodes/labels but above the time bars. */
  .may22-section-flow .const-floating-mask {
    position: absolute;
    left: 0;
    right: 0;
    background: #F5F1E8;
    z-index: 1;
    transition: box-shadow 0.18s ease, background 0.18s ease;
  }
  /* Visual feedback when a const-node is dragged over the floating zone */
  .may22-section-flow .const-floating-mask.const-drop-target {
    background: #f3ecdf;
    box-shadow: inset 0 0 0 1.5px rgba(196, 168, 130, 0.6),
                inset 0 0 0 4px rgba(245, 241, 232, 0.95),
                inset 0 0 0 5px rgba(196, 168, 130, 0.35);
  }
  /* === New flex-wrap floating block ===
     position: relative (not absolute) so it flows in normal layout BELOW the
     constellation SVG, naturally pushing flowBody's content height. This
     prevents FOCUS section from sitting on top of it. */
  /* "+" add-task button at top-right of FLOW (so it doesn't overlay floating block) */
  .may22-section-flow .flow-add-btn {
    position: absolute;
    top: 8px;
    right: 12px;
    width: 28px; height: 28px;
    border-radius: 50%;
    border: 1px dashed rgba(196, 168, 130, 0.55);
    background: rgba(245, 241, 232, 0.95);
    color: rgba(148, 146, 125, 0.85);
    font-family: 'DM Mono', monospace;
    font-size: 16px;
    line-height: 1;
    cursor: pointer;
    z-index: 6;
    transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
  }
  .may22-section-flow .flow-add-btn:hover {
    color: #5b4733;
    border-color: #c4a882;
    background: rgba(196, 168, 130, 0.12);
  }
  /* Inline input that appears when + is clicked */
  .may22-section-flow .flow-add-input {
    position: absolute;
    top: 8px;
    right: 48px;
    width: 240px;
    height: 28px;
    padding: 0 10px;
    border-radius: 4px;
    border: 1px solid #c4a882;
    background: #FBF8F3;
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 15px;
    color: #2a2a2a;
    z-index: 6;
    outline: none;
  }
  /* Make .may22-section-flow .may22-section-body a positioning context */
  .may22-section-flow .may22-section-body { position: relative; }

  .may22-section-flow .const-floating-block {
    position: relative;
    margin-top: 24px;
    background: #F5F1E8;
    padding: 16px 32px 16px 48px;
    z-index: 2;
    border-top: 1px dashed rgba(196, 168, 130, 0.35);
    transition: box-shadow 0.18s ease, background 0.18s ease;
  }
  .may22-section-flow .const-floating-block.const-drop-target {
    background: #f3ecdf;
    box-shadow: inset 0 0 0 1.5px rgba(196, 168, 130, 0.6),
                inset 0 0 0 4px rgba(245, 241, 232, 0.95),
                inset 0 0 0 5px rgba(196, 168, 130, 0.35);
  }
  .may22-section-flow .const-floating-block .const-floating-heading {
    /* Override the absolute-positioned heading style — inside the block, it
       flows normally as a single-line label above the items. */
    position: static;
    top: auto;
    left: auto;
    display: block;
    margin-bottom: 12px;
  }
  .may22-section-flow .const-floating-items {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 10px;
  }
  .may22-section-flow .const-floating-item-wrap {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    position: relative;
  }
  /* Floating items — readable sizing (NOT shrunk-to-fit-3-per-row). */
  .may22-section-flow .const-floating-item-wrap .const-node.floating {
    position: static;
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    font-size: 14px;
  }
  .may22-section-flow .const-floating-item-wrap .const-label.floating-label {
    position: static;
    white-space: nowrap;
    font-size: 15px;
  }
  .may22-section-flow .const-floating-item-wrap .const-floating-delete {
    position: static;
    display: none;
    width: 14px; height: 14px;
    border: none;
    background: transparent;
    color: rgba(196, 168, 130, 0.7);
    font-size: 14px;
    line-height: 1;
    padding: 0;
    cursor: pointer;
  }
  .may22-section-flow .const-floating-item-wrap:hover .const-floating-delete {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .may22-section-flow .const-floating-item-wrap .const-floating-delete:hover {
    color: #b3503a;
  }
  /* Override absolute positioning on the + add button inside the items row */
  .may22-section-flow .const-floating-items .const-floating-add {
    position: static;
    top: auto;
    left: auto;
  }
  /* Super-node: one collapsible node representing a data-section group.
     IDENTICAL visually to a regular const-node — only the LABEL signals it expands. */
  .may22-section-flow .const-super {
    position: absolute;
    width: 36px; height: 36px;
    border-radius: 50%;
    background: #F5F1E8;
    border: 1.5px solid #c4a882;
    color: #c4a882;
    font-family: 'DM Mono', monospace;
    font-size: 12px;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer;
    transition: all 0.3s;
    z-index: 2;
  }
  .may22-section-flow .const-super.done {
    background: #c4a882;
    color: #FBF8F3;
  }
  /* Super-node label — same size as regular .const-label (17px) */
  .may22-section-flow .const-super-label {
    position: absolute;
    font-family: 'Newsreader', serif;
    font-size: 17px;
    font-style: italic;
    color: #2a2a2a;
    white-space: nowrap;
    z-index: 3;
    cursor: pointer;
    user-select: none;
  }
  .may22-section-flow .const-super-label .cs-section-name {
    font-weight: 500;
    border-bottom: 1px dashed rgba(168, 133, 86, 0.5);
  }
  .may22-section-flow .const-super-label .cs-section-count {
    display: inline-block;
    margin-left: 4px;
    padding: 1px 7px;
    background: rgba(196, 168, 130, 0.25);
    border-radius: 8px;
    font-size: 11px;
    font-style: normal;
    color: #5b4733;
    vertical-align: 2px;
  }
  .may22-section-flow .const-super-label .cs-section-chev {
    display: inline-block;
    margin-left: 4px;
    font-size: 10px;
    transition: transform .2s ease;
    color: #a88556;
  }
  .may22-section-flow .const-super-label.expanded .cs-section-chev {
    transform: rotate(180deg);
  }
  /* Sub-row revealed when the super-node is expanded — vertical list of items */
  .may22-section-flow .const-sub-row {
    position: absolute;
    display: none;
    flex-direction: column;
    gap: 6px;
    padding: 10px 12px;
    background: rgba(245, 236, 217, 0.85);
    border: 1px dashed rgba(168, 133, 86, 0.5);
    border-radius: 8px;
    z-index: 3;
    min-width: 200px;
  }
  .may22-section-flow .const-sub-row.expanded { display: flex; }
  .may22-section-flow .const-sub {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: 'Newsreader', serif;
    font-size: 13.5px;
    font-style: italic;
    color: #2a2a2a;
    cursor: pointer;
    padding: 2px 0;
  }
  .may22-section-flow .const-sub .const-sub-dot {
    width: 8px; height: 8px;
    border-radius: 50%;
    border: 1.5px solid #a88556;
    background: transparent;
    flex-shrink: 0;
  }
  .may22-section-flow .const-sub.done .const-sub-dot { background: #c4a882; }
  .may22-section-flow .const-sub.done .const-sub-text {
    color: rgba(0,0,0,0.4);
    text-decoration: line-through;
    text-decoration-color: rgba(196, 168, 130, 0.6);
  }
  .may22-section-flow .const-sub:hover .const-sub-text { color: #5b4733; }
  .may22-const-arcs {
    position: absolute;
    top: 0; left: 0;
    pointer-events: none; z-index: 1;
  }

  /* flow-title hidden on any card using the 3-diagram (may22-sections) treatment — the
     system has its own headers (FLOW / SEQUENCE / FOCUS). Applies to may22 + any day
     promoted via rollover. */
  .flow-chart-card.may22-sections > .flow-title {
    display: none !important;
  }

  /* ===== SECTION 2: SEQUENCE (cloned pills + arrows inside the section body) ===== */
  /* On MAY 22: originals stay in card root (Sortable + save logic depend on them) but
     are hidden because the 3-diagram sections fully replace them visually.
     On OTHER days promoted via rollover: keep source pills VISIBLE so they remain
     editable + draggable with X delete buttons — the clones in FLOW/SEQUENCE/FOCUS
     are a read-only mirror. */
  .day-block[data-date="2026-05-22"] .flow-chart-card.may22-sections > .flow-step,
  .day-block[data-date="2026-05-22"] .flow-chart-card.may22-sections > .flow-arrow {
    display: none !important;
  }
  .may22-section-sequence .may22-section-body {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
  }
  .may22-section-sequence .sequence-clone {
    display: flex; align-items: center;
    /* Option H — soft gradient (cream → warm, page-glow feel) */
    background: linear-gradient(to bottom, #fdfaf4, #f4eddf);
    border: 1px solid rgba(196, 168, 130, 0.4);
    border-radius: 4px;
    padding: 8px 18px 8px 38px;
    width: max-content;
    max-width: 100%;
    font-family: 'Newsreader', serif;
    font-size: 16px;
    color: #2a2a2a;
    cursor: pointer;
    position: relative;
    transition: all 0.3s ease;
  }
  .may22-section-sequence .sequence-clone.done {
    opacity: 0.4;
    background: #f6f3ec;
  }
  .may22-section-sequence .sequence-clone .clone-check {
    position: absolute; left: 12px; top: 50%; transform: translateY(-50%);
    width: 14px; height: 14px; border-radius: 50%;
    border: 1.4px solid #c4a882; background: transparent;
  }
  .may22-section-sequence .sequence-clone.done .clone-check { background: #c4a882; }
  .may22-section-sequence .sequence-clone.done .clone-check::after {
    content: "✓"; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
    color: #FBF8F3; font-size: 9px; font-weight: 600;
  }
  .may22-section-sequence .sequence-arrow {
    text-align: center;
    font-size: 26px;
    color: transparent;
    background: linear-gradient(90deg, #8a6d1f 0%, #c4a882 25%, #f4d97a 50%, #c4a882 75%, #8a6d1f 100%);
    background-size: 200% auto;
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent;
    line-height: 1;
    margin: 4px 0;
    animation: allah-shimmer 4s linear infinite;
    filter: drop-shadow(0 1px 2px rgba(0,0,0,0.12));
  }

  /* Annotation spacing inside sequence + focus clones */
  .may22-section-sequence .sequence-clone .task-deadline,
  .may22-section-sequence .sequence-clone .task-time-inline,
  .may22-section-sequence .sequence-clone .task-timeslot,
  .may22-section-focus .focus-clone .task-deadline,
  .may22-section-focus .focus-clone .task-time-inline,
  .may22-section-focus .focus-clone .task-timeslot {
    margin-left: 10px !important;
  }

  /* Visible chip styling for annotations inside clones (May 25 deadline, 7p time, etc.) */
  .may22-section-sequence .sequence-clone .task-deadline,
  .may22-section-focus .focus-clone .task-deadline {
    background: rgba(168, 84, 50, 0.12) !important;
    color: #a85432 !important;
    padding: 2px 8px !important;
    border-radius: 4px !important;
    font-family: 'Newsreader', serif !important;
    font-style: italic !important;
    font-size: 12px !important;
    margin-left: 12px !important;
  }
  .may22-section-sequence .sequence-clone .task-time-inline,
  .may22-section-focus .focus-clone .task-time-inline,
  .may22-section-sequence .sequence-clone .task-timeslot,
  .may22-section-focus .focus-clone .task-timeslot {
    background: rgba(132, 156, 122, 0.15) !important;
    color: #5C7257 !important;
    padding: 2px 8px !important;
    border-radius: 4px !important;
    font-family: 'Newsreader', serif !important;
    font-style: italic !important;
    font-size: 12px !important;
    margin-left: 12px !important;
  }

  .may22-section-sequence .sequence-section-heading {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 13px;
    color: #5a4d33;
    text-align: center;
    margin: 12px auto 4px;
    padding: 4px 12px;
    border-bottom: 1px dashed rgba(196, 168, 130, 0.4);
    width: max-content;
  }
  /* Horizontal row of grouped (concurrent) sequence items — mirrors flow-step-row.
     Pulled flush UP against the preceding flow-section-toggle (no gap between header
     and the 3 items). The parent's gap: 2px is cancelled with a negative margin. */
  .may22-section-sequence .sequence-row {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px 14px;
    margin: -2px auto 6px;
    width: max-content;
    max-width: 100%;
  }
  .may22-section-sequence .sequence-row .sequence-clone {
    margin: 0;
  }
  /* Tighten heading→row gap further by removing the toggle's own bottom space */
  .may22-section-sequence .flow-section-toggle {
    margin-bottom: 0 !important;
  }
  .may22-section-sequence.collapsed .may22-section-body {
    min-height: 0 !important;
    max-height: 0 !important;
    padding: 0 !important;
    opacity: 0 !important;
    overflow: hidden !important;
  }
  /* Center-align tasks + headings in EVERY may22-sections ALL section */
  .may22-section-all .may22-section-body {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
  }
  .may22-section-all .flow-step {
    justify-content: center;
    text-align: center;
  }
  /* Grouped-items section heading in ALL — small DM Mono label inserted
     before a consecutive run of items sharing data-section. */
  .may22-section-all .all-section-heading {
    font-family: 'DM Mono', monospace;
    font-size: 10px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: rgba(148, 146, 125, 0.85);
    margin: 12px 0 4px;
    text-align: center;
  }
  /* Subtle tan left border on grouped items so the visual cluster reads */
  .may22-section-all .flow-step[data-section]:not([data-section=""]) {
    border-left: 2px solid rgba(196, 168, 130, 0.6);
    padding-left: 14px;
  }
  .may22-section-all.collapsed .may22-section-body {
    min-height: 0 !important;
    max-height: 0 !important;
    padding: 0 !important;
    opacity: 0 !important;
    overflow: hidden !important;
  }
  /* Visual cue when dragging a constellation node */
  .may22-section-flow .const-node.const-dragging {
    opacity: 0.4;
    transform: scale(1.15);
  }
  .may22-section-flow .const-node.const-drop-target {
    box-shadow: 0 0 0 3px rgba(196, 168, 130, 0.6);
  }

  /* ===== SECTION 3: FOCUS (spotlight — uses cloned pills inside the section body) ===== */
  /* === FOCUS section — matches "H · spotlight focus" pattern from flow-creative.html ===
     Container: 460px-wide vertical flex column, gap: 6px (no negative margins).
     Default items: scale(0.75), opacity 0.45.
     Current item: scale(1.05), full opacity, larger padding/font, tan border + soft shadow. */
  .may22-section-focus .may22-section-body {
    width: 460px;
    max-width: 100%;
    margin: 0 auto;
    padding: 40px 48px 36px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 14px;
  }
  .may22-section-focus .focus-clone {
    display: flex; align-items: center;
    width: 100%;
    box-sizing: border-box;
    padding: 5px 14px 5px 32px;
    background: #F5F1E8;
    border: 1px solid rgba(196, 168, 130, 0.4);
    border-radius: 4px;
    font-family: 'Newsreader', serif;
    font-size: 13px;
    color: #2a2a2a;
    cursor: pointer;
    opacity: 0.45;
    transform: scale(0.75);
    transform-origin: center;
    transition: all 0.4s ease;
    position: relative;
    justify-content: center;
    text-align: center;
  }
  .may22-section-focus .focus-clone .clone-check {
    position: absolute; left: 12px; top: 50%; transform: translateY(-50%);
    width: 12px; height: 12px; border-radius: 50%;
    border: 1.4px solid #c4a882; background: transparent;
  }
  .may22-section-focus .focus-clone.done {
    opacity: 0.3;
  }
  .may22-section-focus .focus-clone.done .clone-check { background: #c4a882; }
  .may22-section-focus .focus-clone.done .clone-check::after {
    content: "✓"; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
    color: #FBF8F3; font-size: 8px; font-weight: 600;
  }
  .may22-section-focus .focus-clone.may22-current-focus {
    transform: scale(1.05);
    transform-origin: left center;  /* scale outward from LEFT — keeps right edge from blowing past container */
    opacity: 1;
    /* Tight padding all around so the border hugs the text closely */
    padding: 4px 8px 4px 22px;
    font-size: 18px;
    background: #FBF8F3;
    border: 2px solid #c4a882;
    box-shadow: 0 4px 14px rgba(196, 168, 130, 0.25);
    width: max-content;
    max-width: 92%;       /* cap at parent inner width minus the scale(1.05) overhead */
    margin: 0 auto 0 0;   /* left-align when content is too wide to center safely */
    white-space: normal;  /* allow long text to wrap inside the pill instead of overflowing */
    word-break: break-word;
  }

  /* MAY 22 ONLY — transparent flow chart card background (no flow-card layer) */
  .day-block[data-date="2026-05-22"] .flow-chart-card {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
  }
  /* MAY 22 ONLY — slightly bigger arrow + tighter gaps between pills (no connector tracks) */
  .day-block[data-date="2026-05-22"] .flow-chart-card .flow-arrow {
    font-size: 32px !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
  }
  /* Tighter pill spacing on May 22 only (reduce from 6px to 2px margin) */
  .day-block[data-date="2026-05-22"] .flow-chart-card .flow-step {
    margin: 2px auto !important;
  }
  /* MAY 22 ONLY — text centered within each pill.
     Strategy: pin the checkbox absolutely at the left, let the text span fill 100%
     of the pill and text-align center so it reads as centered on the pill, not
     just centered in the remaining space-after-the-checkbox. */
  .day-block[data-date="2026-05-22"] .flow-chart-card .flow-step {
    justify-content: center !important;
    /* SYMMETRIC padding so text-align:center on the inner span truly centers on the
       pill (not 12px right of center). Both sides 38px to mirror the abs checkbox space. */
    padding-left: 38px !important;
    padding-right: 38px !important;
  }
  .day-block[data-date="2026-05-22"] .flow-chart-card .flow-step .flow-check {
    position: absolute !important;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    margin-right: 0 !important;
  }
  .day-block[data-date="2026-05-22"] .flow-chart-card .flow-step .flow-step-text {
    text-align: center !important;     /* force-win against any other rule */
    flex: 1 1 auto;
    width: 100%;
  }
  /* Inline deadline pill stays right-anchored (don't center it) */
  .day-block[data-date="2026-05-22"] .flow-chart-card .flow-step .task-deadline {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
  }
  /* May 22 task-time-inline pinned right (centered text doesn't shove it around) */
  .day-block[data-date="2026-05-22"] .flow-chart-card .flow-step .task-time-inline {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
  }
  /* On hover, pills with a data-hover-note shift to LEFT-align so the expanded
     "title — note" text reads naturally instead of awkwardly centered when long. */
  .day-block[data-date="2026-05-22"] .flow-chart-card .flow-step:has(.flow-step-text[data-hover-note]):hover {
    justify-content: flex-start !important;
  }
  .day-block[data-date="2026-05-22"] .flow-chart-card .flow-step:hover .flow-step-text[data-hover-note] {
    text-align: left !important;
  }
  /* When ellipsis is truncating, the inner editable text span also needs to clip */
  :is(.day-block.today, .day-block.flow-modern) .flow-chart-card .flow-step .flow-step-text {
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1 1 auto;
    min-width: 0;
  }
  /* Per-task escape hatch: data-no-truncate="true" disables the ellipsis */
  .flow-chart-card .flow-step-text[data-no-truncate]{
    overflow: visible !important;
    text-overflow: clip !important;
  }
  /* Parent must also let the text overflow if we want to see the full content */
  :is(.day-block.today, .day-block.flow-modern) .flow-chart-card .flow-step:has(.flow-step-text[data-no-truncate]) {
    overflow: visible !important;
    white-space: nowrap !important;
  }
  /* Circular checkboxes — TODAY ONLY (past days keep default square checkboxes) */
  :is(.day-block.today, .day-block.flow-modern) .flow-chart-card .flow-step .flow-check {
    appearance: none;
    -webkit-appearance: none;
    width: 14px;
    height: 14px;
    min-width: 14px;
    border-radius: 50%;
    border: 1.4px solid #c4a882;
    background: transparent;
    cursor: pointer;
    margin-right: 8px;
    position: relative;
    flex: none;
  }
  :is(.day-block.today, .day-block.flow-modern) .flow-chart-card .flow-step .flow-check:checked {
    background: #c4a882;
    border-color: #c4a882;
  }
  :is(.day-block.today, .day-block.flow-modern) .flow-chart-card .flow-step .flow-check:checked::after {
    content: "✓";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #FBF8F3;
    font-size: 9px;
    font-weight: 600;
    line-height: 1;
  }
  .flow-chart-card .flow-step.done {
    opacity: 0.4;
    background: #f6f3ec;
  }
  .flow-step-dragging {
    opacity: 0.4 !important;
    background: #efe9dc !important;
  }
  .flow-chart-card .flow-arrow {
    text-align: center;
    color: rgba(196, 168, 130, 0.6);
    font-size: 14px;
    margin: 8px 0;
    line-height: 1;
  }
  .flow-chart-card .flow-step .flow-check {
    width: 14px;
    height: 14px;
    margin-right: 10px;
    accent-color: #5C7257;
    flex-shrink: 0;
  }

  .flow-chart-card .flow-substeps {
    margin: 4px auto 0;
    max-width: 320px;
    padding-left: 28px;
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .flow-chart-card .flow-substep {
    display: flex;
    align-items: center;
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 12px;
    color: var(--dark, #2a2a2a);
    cursor: pointer;
    user-select: none;
    transition: opacity 0.2s;
    padding: 2px 0;
  }
  .flow-chart-card .flow-substep::before {
    content: '·';
    color: rgba(196, 168, 130, 0.7);
    margin-right: 8px;
    font-size: 16px;
    line-height: 1;
  }
  .flow-chart-card .flow-substep.done {
    opacity: 0.45;
    text-decoration: line-through;
  }
  .flow-chart-card .flow-substep .flow-subcheck {
    width: 11px;
    height: 11px;
    margin-right: 8px;
    accent-color: #5C7257;
    flex-shrink: 0;
  }

  .flow-chart-card .flow-step-row {
    display: flex;
    align-items: stretch;
    justify-content: stretch;
    gap: 0;
    margin: 0 auto;
    width: 320px;
    max-width: 100%;
    box-sizing: border-box;
  }
  .flow-chart-card .flow-step-row .flow-step {
    flex: 1 1 0;
    max-width: none !important;
    width: auto !important;
    margin: 0 !important;
    border-radius: 0;
    border-right-width: 0;
    box-sizing: border-box;
  }
  .flow-chart-card .flow-step-row .flow-step:first-child {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
  }
  .flow-chart-card .flow-step-row .flow-step:last-child {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    border-right-width: 1px;
  }

  .flow-chart-card .flow-step.deferred,
  .flow-chart-card .flow-substep.deferred {
    opacity: 0.55;
    background: #f6f3ec;
    text-decoration: line-through;
  }
  .flow-chart-card .flow-step.deferred {
    text-decoration: none !important;
  }
  .flow-chart-card .flow-step.deferred > * {
    text-decoration: line-through;
  }
  .flow-chart-card .flow-step.deferred .flow-tilde {
    width: 14px;
    height: 14px;
    margin-right: 10px;
    flex-shrink: 0;
    color: #8a8a8a;
    font-family: 'DM Mono', monospace;
    font-size: 16px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    user-select: none;
    text-decoration: none !important;
  }
  .flow-chart-card .flow-step.deferred .flow-tilde::before,
  .flow-chart-card .flow-step.deferred .flow-tilde::after {
    text-decoration: none !important;
  }

  .flow-chart-card .flow-step-row .flow-step {
    white-space: normal;
    overflow: visible;
    min-width: 0;
    font-size: 13px;
    padding: 8px 5px;
    line-height: 1.25;
    word-break: normal;
  }
  /* Plain text labels (no wf-stack) get same prominence as wf-stack cells */
  .flow-chart-card .flow-step-row .flow-step:not(:has(.wf-stack)) {
    font-size: 13px;
    font-weight: inherit;
  }
  /* Adjust spacing inside row labels to allow more text room */
  .flow-chart-card .flow-step-row .flow-step .flow-check {
    margin-right: 5px;
  }

  .day-shaitan-header {
    text-align: center;
    margin: 0 0 8px;
    user-select: none;
  }
  .day-shaitan-header .shaitan-text {
    display: inline-block;
    background-color: #3a3a3a;
    padding: 5px 12px;
    border-radius: 3px;
  }
  .day-shaitan-header .shaitan-inner {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.04em;
    background-image: linear-gradient(135deg, #6b4f24 0%, #b08d57 15%, #e6c992 30%, #fff3d0 45%, #fff8e1 50%, #fff3d0 55%, #e6c992 70%, #b08d57 85%, #6b4f24 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #b08d57;
    text-shadow: 0 0 6px rgba(244,232,179,0.5), 0 0 1px rgba(255,255,255,0.4);
    filter: drop-shadow(0 1px 0 rgba(0,0,0,0.4));
  }
  .day-shaitan-header .shaitan-heart {
    color: #fff8e1;
    font-size: 11px;
    margin-left: 4px;
    filter: drop-shadow(0 0 3px rgba(255,248,225,0.6));
  }

  /* Arabic flow-steps: checkbox stays on left, text pushed to the right */
  .flow-chart-card .flow-step.arabic-step {
    justify-content: flex-start;
  }
  .flow-chart-card .flow-step.arabic-step .flow-check {
    margin-right: auto;
    order: 0;
  }
  .flow-chart-card .flow-step.arabic-step::after {
    content: '';
  }
  /* Push the Arabic text to the right via auto margin on checkbox */
  .flow-chart-card .flow-step.arabic-step {
    text-align: right;
  }

  .flow-chart-card .flow-step.deferred .flow-annotation {
    margin-left: auto;
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 11px;
    color: #94927d;
    text-decoration: none !important;
  }

  .flow-chart-card .flow-section-header {
    text-align: center;
    font-family: 'Newsreader', serif;
    font-size: 14px;
    color: var(--dark, #2a2a2a);
    margin: 8px 0 4px;
    padding: 4px 0;
  }

  .flow-chart-card .flow-section-toggle {
    width: 320px;
    max-width: 100%;
    margin: 0 auto;
    padding: 0;
    background: transparent;
    border: none;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    cursor: default;
    user-select: none;
  }
  .flow-chart-card .flow-section-toggle .flow-check {
    display: none;
  }
  .flow-chart-card .flow-section-toggle .flow-section-text {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 12px;
    color: var(--dusty, #94927d);
    transition: opacity 0.3s;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
  }
  .flow-chart-card .flow-section-toggle::after {
    content: '';
    flex: 1;
    height: 1px;
    background: rgba(196, 168, 130, 0.3);
  }
  .flow-chart-card .flow-section-toggle.done .flow-section-text::before {
    content: '✓';
    color: var(--sage, #5C7257);
    font-size: 12px;
    margin-right: 6px;
    line-height: 1;
  }
  .flow-chart-card .flow-section-toggle.done .flow-section-text {
    opacity: 0.5;
  }

  /* Allow specific row labels to wrap text to 2 lines */
  .flow-chart-card .flow-step-row .flow-step.flow-wrap {
    white-space: normal;
    line-height: 1.15;
    word-break: normal;
  }

  /* Multi-row pickups grid: rows stack vertically with shared edges */
  .flow-chart-card .flow-pickups-grid {
    display: flex;
    flex-direction: column;
    width: 320px;
    max-width: 100%;
    margin: 0 auto;
  }
  .flow-chart-card .flow-pickups-grid .flow-step-row {
    width: 100%;
  }
  /* For grid: bottom row of cells gets bottom border, top row doesn't */
  .flow-chart-card .flow-pickups-grid .flow-step-row:not(:last-child) .flow-step {
    border-bottom-width: 0;
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
  }
  /* Adjust corners for first row */
  .flow-chart-card .flow-pickups-grid .flow-step-row:first-child .flow-step:first-child {
    border-top-left-radius: 4px;
  }
  .flow-chart-card .flow-pickups-grid .flow-step-row:first-child .flow-step:last-child {
    border-top-right-radius: 4px;
  }
  /* Bottom row corners */
  .flow-chart-card .flow-pickups-grid .flow-step-row:last-child .flow-step:first-child {
    border-bottom-left-radius: 4px;
    border-top-left-radius: 0;
  }
  .flow-chart-card .flow-pickups-grid .flow-step-row:last-child .flow-step:last-child {
    border-bottom-right-radius: 4px;
    border-top-right-radius: 0;
  }

  .flow-chart-card .wf-stack {
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100%;
    gap: 0;
    line-height: 1.15;
    min-width: 0;
    overflow: hidden;
  }
  .flow-chart-card .wf-stack > span:first-child {
    flex: 0 1 auto;
    text-align: left;
    white-space: nowrap;
    min-width: 0;
    line-height: 1.15;
  }
  .flow-chart-card .wf-stack .wf-loc {
    flex: 1 1 auto;
    min-width: 0;
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 2px;
    font-size: 9px;
    color: inherit;
    font-style: italic;
    white-space: normal;
    text-align: center;
    line-height: 1.15;
    overflow-wrap: break-word;
  }
  .flow-chart-card .wf-stack .wf-loc > svg + ::after,
  .flow-chart-card .wf-stack .wf-loc {
    /* pin + text are atomic; if too wide, move to its own line via stack */
  }
  .flow-chart-card .wf-stack .wf-loc svg {
    flex-shrink: 0;
    width: 6px;
    height: 8px;
  }

  /* Gold-bordered emphasized flow step */
  .flow-chart-card .flow-step.flow-gold {
    border: 1.5px solid #c4a882;
    box-shadow: 0 0 0 1px rgba(196,168,130,0.15);
  }

  .flow-chart-card .wf-loc.wf-loc-stacked {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-end;
    line-height: 1;
    gap: 0;
  }
  .flow-chart-card .wf-loc.wf-loc-stacked .wf-loc-line {
    display: block;
    text-align: right;
  }

  /* Toggleable location subtitle on pickup cells */
  .flow-chart-card .wf-stack .wf-loc {
    display: none !important;
  }
  .flow-chart-card .wf-stack.wf-loc-shown {
    flex-wrap: nowrap;
  }
  .flow-chart-card .wf-stack.wf-loc-shown .wf-loc {
    display: inline-flex !important;
    flex: 1 1 auto;
    min-width: 0;
    justify-content: center;
    text-align: center;
    font-size: 9px;
    line-height: 1.15;
  }
  .flow-chart-card .wf-pin-toggle {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    padding: 0 2px;
    background: transparent;
    border: none;
    color: #5C7257;
    opacity: 0.7;
    flex: 0 0 auto;
    margin-left: 10px;
    margin-right: auto;
  }
  .flow-chart-card .wf-pin-toggle svg {
    width: 7px;
    height: 9px;
  }

  .flow-chart-card .flow-step .flow-time {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 14px;
    color: #8a6d1f;
    border: none;
    padding: 1px 2px;
    margin-left: auto;
    margin-right: -6px;
    flex-shrink: 0;
    letter-spacing: 0.02em;
    line-height: 1.3;
    text-decoration: none !important;
    display: inline-block;
    white-space: nowrap;
  }
  /* When parent is .done, strikethrough applies to whole row, but not the pill */
  .flow-chart-card .flow-step.done .flow-time {
    text-decoration: none !important;
    opacity: 0.7;
  }

  /* Items marked popup-only: hide inline subtasks; they appear only in the popup card */
  .day-task-item.popup-only > .task-extras,
  .day-task-item.popup-only > .task-subtask,
  .day-task-item.popup-only > .adderall-grid {
    display: none !important;
  }
  /* Hide inline checkbox on popup-only items, EXCEPT when it has .partial (sage dot conveys state) */
  .day-task-item.popup-only > .agenda-check:not(.partial) {
    display: none !important;
  }

  .card .card-subsection {
    display: block;
    font-family: 'DM Mono', monospace;
    font-size: 8px;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--sage, #5C7257);
    opacity: 0.75;
    margin-top: 6px;
    margin-bottom: 2px;
  }
  .card .card-subsection:first-child {
    margin-top: 0;
  }

  .day-task-item.centered {
    justify-content: center;
    text-align: center;
    flex-wrap: nowrap;
  }
  .day-task-item.centered .day-task-text {
    flex: 0 1 auto;
  }
  .day-task-item.centered > .agenda-check {
    margin-left: 8px !important;
    margin-right: 0 !important;
  }

  .flow-chart-card .flow-step-row .flow-step.flow-wide {
    flex: 0 0 180px;
    max-width: 180px !important;
    width: 180px !important;
  }
  .flow-chart-card .flow-step-row .flow-step.flow-narrow {
    flex: 0 0 140px;
    max-width: 140px !important;
    width: 140px !important;
  }

  /* Force equal vertical rhythm across entire flow chart */
  .flow-chart-card > .flow-step,
  .flow-chart-card > .flow-step-row,
  .flow-chart-card > .flow-pickups-grid,
  .flow-chart-card > .flow-section-toggle,
  .flow-chart-card > .flow-step-row > .flow-step {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
  .flow-chart-card > .flow-arrow {
    margin: 8px auto !important;
    padding: 0 !important;
  }

  /* Use flex gap on card itself for deterministic equal spacing throughout */
  .flow-chart-card {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 0 !important;
  }
  .flow-chart-card > * {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
  .flow-chart-card > .flow-arrow {
    margin: 8px 0 !important;
    padding: 0 !important;
  }
  /* Tight arrow spacing — TODAY ONLY */
  :is(.day-block.today, .day-block.flow-modern) .flow-chart-card > .flow-arrow {
    margin: 2px 0 !important;
  }

  .card .subtask .subtask-link {
    text-decoration: none;
    margin: 0 6px;
    font-size: 11px;
    opacity: 0.7;
    cursor: pointer;
    transition: opacity 0.15s;
  }
  .card .subtask .subtask-link:hover {
    opacity: 1;
  }

  /* 4+ cell rows no longer need text shrink - cells auto-size via flex */

  .flow-chart-card .flow-step.flow-leftalign {
    justify-content: flex-start;
    text-align: left;
  }

  /* Compound cell with 2 side-by-side subtasks */
  .flow-chart-card .flow-step.flow-combined {
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 7px 4px;
    flex: 3 0 180px !important;
    min-width: 180px !important;
    width: auto !important;
    max-width: none !important;
    white-space: nowrap !important;
  }
  .flow-chart-card .flow-step.flow-combined .flow-sub-item {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    line-height: 1.15;
    flex: 0 0 auto;
    min-width: 0;
  }
  .flow-chart-card .flow-step.flow-combined .flow-sub-item .flow-check {
    margin-right: 0 !important;
  }
  .flow-chart-card .flow-step.flow-combined .flow-sub-item .flow-check {
    flex-shrink: 0;
  }
  .flow-chart-card .flow-step.flow-combined .flow-sub-item.done {
    text-decoration: line-through;
    opacity: 0.55;
  }

  /* Auto-fit cells to content (text never wraps) + row spans full card width */
  .flow-chart-card .flow-step-row > .flow-step:not(.flow-combined):not(.flow-wide):not(.flow-narrow) {
    white-space: nowrap !important;
    flex: 1 0 auto !important;
    min-width: 0;
  }
  /* Row spans full card width */
  .flow-chart-card .flow-step-row {
    width: 100%;
    box-sizing: border-box;
  }
  /* All inner content stays single-line */
  .flow-chart-card .flow-step-row > .flow-step .wf-stack {
    flex-wrap: nowrap !important;
  }
  .flow-chart-card .flow-step-row > .flow-step .wf-stack > span:first-child {
    white-space: nowrap !important;
  }

  /* Wrap rows: cells size to content, wrap when row overflows */
  .flow-chart-card .flow-step-row.flow-wrap {
    flex-wrap: wrap;
    row-gap: 3px;
    column-gap: 0;
  }
  .flow-chart-card .flow-step-row.flow-wrap > .flow-step:not(.flow-combined):not(.flow-wide):not(.flow-narrow) {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    white-space: nowrap !important;
  }

  /* Ensure row cells contain their text (no spill across cell borders) */
  .flow-chart-card .flow-step-row > .flow-step {
    overflow: hidden;
  }

  /* Time pill: NEVER strikethrough regardless of parent done state */
  .flow-chart-card .flow-step .flow-time,
  .flow-chart-card .flow-step.done .flow-time,
  .flow-chart-card .flow-step .flow-time *,
  .flow-time {
    text-decoration: none !important;
    text-decoration-line: none !important;
    text-decoration-style: none !important;
  }

  /* Vertical layout (opt 7): rounded cards w/ subtle gap */
  .flow-chart-card .flow-step-row.flow-vertical {
    flex-direction: column;
    align-items: stretch;
    gap: 3px;
  }
  .flow-chart-card .flow-step-row.flow-vertical > .flow-step {
    width: 100% !important;
    border: 1px solid rgba(196, 168, 130, 0.4) !important;
    border-radius: 4px !important;
    flex: 1 1 auto !important;
  }
  .flow-chart-card .flow-step-row.flow-vertical > .flow-step.flow-concurrent {
    border-top-width: 1px !important;
  }

  /* Cells inside flow-pickups-grid rows: WIDTH STRICTLY PROPORTIONATE TO TASK NAME */
  .flow-chart-card .flow-pickups-grid .flow-step-row > .flow-step:not(.flow-combined):not(.flow-wide):not(.flow-narrow) {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    white-space: nowrap !important;
  }

  /* Compact, balanced padding on row cells (match itemloc cells) */
  .flow-chart-card .flow-step-row > .flow-step:not(.flow-combined):not(.flow-wide):not(.flow-narrow):not(.flow-itemloc) {
    padding: 5px 8px !important;
  }

  /* Grid cell style — opt B: content-sized + 4px gap + rounded */
  .flow-chart-card .flow-step-row.flow-wrap {
    column-gap: 4px;
    row-gap: 4px;
  }
  .flow-chart-card .flow-step-row.flow-wrap > .flow-step:not(.flow-combined):not(.flow-wide):not(.flow-narrow) {
    border: 1px solid rgba(196, 168, 130, 0.4) !important;
    border-radius: 4px !important;
    background: #fff !important;
  }

  /* Item + Location two-column cell (opt 1) */
  .flow-chart-card .flow-step.flow-itemloc {
    padding: 0 !important;
    gap: 0 !important;
    overflow: hidden;
    align-items: stretch;
  }
  .flow-chart-card .flow-step.flow-itemloc .il-item {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 6px;
    border-right: 1px solid rgba(196, 168, 130, 0.4);
    font-size: 13px;
    line-height: 1;
  }
  .flow-chart-card .flow-step.flow-itemloc .il-loc {
    display: inline-flex;
    align-items: center;
    padding: 5px 6px;
    font-size: 10px;
    color: var(--sage, #5C7257);
    font-family: 'DM Mono', monospace;
    opacity: 0.85;
    line-height: 1;
  }

  /* Two side-by-side groups (items | locations) */
  .flow-chart-card .flow-two-groups {
    display: flex;
    flex-direction: row;
    gap: 8px;
    width: 320px;
    max-width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
  }
  .flow-chart-card .flow-group-items,
  .flow-chart-card .flow-group-locs {
    display: flex;
    flex-direction: column;
    gap: 3px;
    flex: 1 1 0;
    min-width: 0;
  }
  .flow-chart-card .flow-group-cell {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 6px 8px;
    background: #fff;
    border: 1px solid rgba(196, 168, 130, 0.4);
    border-radius: 4px;
    font-family: 'Newsreader', serif;
    font-size: 13px;
    line-height: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    box-sizing: border-box;
  }
  .flow-chart-card .flow-group-loc {
    font-family: 'DM Mono', monospace;
    font-size: 10px;
    color: var(--sage, #5C7257);
    opacity: 0.85;
    border-color: rgba(196,168,130,0.3);
  }

  /* Pure 2-group split (clusters side-by-side, cells stacked vertically in each) */
  .flow-chart-card .flow-two-groups-pure {
    display: flex;
    flex-direction: row;
    gap: 10px;
    width: 320px;
    max-width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
  }
  .flow-chart-card .flow-cluster {
    display: flex;
    flex-direction: column;
    gap: 3px;
    flex: 1 1 0;
    min-width: 0;
  }
  .flow-chart-card .flow-cluster > .flow-step {
    width: 100% !important;
    font-size: 13px;
    padding: 6px 8px !important;
    white-space: normal;
    overflow: visible;
    word-break: normal;
    overflow-wrap: anywhere;
  }

  /* Route opt A: numbered vertical process flow with line + dots */
  .flow-chart-card .flow-route {
    position: relative;
    padding: 0 0 4px 22px;
    width: 320px;
    max-width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
    background: transparent !important;
    border: none !important;
  }
  .flow-chart-card .flow-route::before {
    content: "";
    position: absolute;
    left: 13px;
    top: 18px;
    bottom: 18px;
    width: 1px;
    background: rgba(196, 168, 130, 0.4);
  }
  .flow-chart-card .route-stop {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    position: relative;
  }
  .flow-chart-card .route-stop::before {
    content: "";
    position: absolute;
    left: -16px;
    top: 50%;
    transform: translateY(-50%);
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--warm, #c4a882);
    border: 1.5px solid var(--cream, #fdfaf3);
    box-sizing: border-box;
  }
  .flow-chart-card .route-num {
    font-family: 'DM Mono', monospace;
    font-size: 9px;
    color: var(--warm, #c4a882);
    min-width: 16px;
  }
  .flow-chart-card .route-name {
    font-family: 'Newsreader', serif;
    font-size: 14px;
    color: var(--dark, #2a2a2a);
    flex: 1;
  }

  /* Pin hidden by default; revealed when wf-stack is toggled open */
  .flow-chart-card .wf-pin-toggle {
    display: none !important;
  }
  .flow-chart-card .wf-stack.wf-loc-shown .wf-pin-toggle {
    display: inline-flex !important;
  }

  /* May 11 split layout: route (left) | flow (right) */
  .flow-chart-card .may11-split {
    display: flex;
    flex-direction: row;
    gap: 10px;
    width: 320px;
    max-width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
    align-items: flex-start;
  }
  .flow-chart-card .may11-left,
  .flow-chart-card .may11-right {
    display: flex;
    flex-direction: column;
    min-width: 0;
    gap: 0;
  }
  .flow-chart-card .may11-left {
    gap: 6px;
  }
  .flow-chart-card .may11-left {
    flex: 0 0 50%;
  }
  .flow-chart-card .may11-right {
    flex: 1 1 50%;
  }
  /* Override cell widths to fill the narrower column */
  .flow-chart-card .may11-left .flow-step,
  .flow-chart-card .may11-right .flow-step,
  .flow-chart-card .may11-left .flow-section-toggle,
  .flow-chart-card .may11-right .flow-section-toggle {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
    font-size: 12px;
    padding: 5px 7px !important;
  }
  .flow-chart-card .may11-left .flow-step-row,
  .flow-chart-card .may11-right .flow-step-row {
    width: 100% !important;
    max-width: 100% !important;
  }
  .flow-chart-card .may11-left .flow-pickups-grid,
  .flow-chart-card .may11-right .flow-pickups-grid {
    width: 100% !important;
    max-width: 100% !important;
  }
  .flow-chart-card .may11-left .flow-step,
  .flow-chart-card .may11-right .flow-step {
    white-space: normal;
    overflow-wrap: anywhere;
  }

  /* Number sticker (opt 5: italic Playfair numeral, gold, floating in left margin) */
  .flow-chart-card .sticker-cell-opt5 {
    overflow: visible;
    position: relative;
  }
  .flow-chart-card .sticker-cluster-opt5 {
    position: relative;
    overflow: visible;
  }
  .flow-chart-card .sticker-num-opt5 {
    position: absolute;
    left: -28px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--gold, #8a6d1f);
    opacity: 0.85;
    font-family: 'Playfair Display', 'Newsreader', serif;
    font-style: italic;
    font-weight: 400;
    font-size: 26px;
    line-height: 1;
    pointer-events: none;
    z-index: 2;
  }

  /* May 11 aligned grid: route stops aligned 1:1 with flow items */
  .flow-chart-card .may11-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px 10px;
    width: 320px;
    max-width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
    align-items: stretch;
  }
  .flow-chart-card .may11-grid > [data-gridcol="left"] {
    grid-column: 1;
  }
  .flow-chart-card .may11-grid > [data-gridcol="right"] {
    grid-column: 2;
  }
  .flow-chart-card .may11-grid > * {
    box-sizing: border-box;
    font-size: 12px;
    align-self: stretch;
  }
  .flow-chart-card .may11-grid > .flow-step,
  .flow-chart-card .may11-grid > .flow-section-toggle {
    width: 100% !important;
    max-width: 100% !important;
    padding: 5px 7px !important;
    white-space: normal;
    overflow-wrap: anywhere;
  }
  .flow-chart-card .may11-grid > .flow-step-row {
    width: 100% !important;
    max-width: 100% !important;
  }
  .flow-chart-card .may11-grid > .route-stop {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Space/padding between route stops */
  .flow-chart-card .may11-left .flow-route {
    display: flex;
    flex-direction: column;
    gap: 16px;
  }

  /* Vertically stacked row (cells stack instead of row) */
  .flow-chart-card .flow-stack-vertical {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    width: 100%;
    flex-wrap: nowrap !important;
  }
  .flow-chart-card .flow-stack-vertical > .flow-step {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 auto !important;
  }

  /* Push stop 04 (Wells Fargo) down to align with Wells Fargo statements pickup */
  .flow-chart-card .may11-left .flow-route .route-stop:nth-child(4) {
    margin-top: 14px;
  }

  /* Arrow inside vertical pickup stack: take exactly 34px total vertical space */
  .flow-chart-card .flow-stack-vertical > .flow-arrow {
    margin: 0 !important;
    padding: 0 !important;
    height: 34px;
    line-height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  /* Tight arrow override (smaller vertical margin) */
  .flow-chart-card .flow-arrow.arrow-tight {
    margin: 0 0 !important;
    padding: 0 !important;
  }

  /* Reduce padding above first stop */
  .flow-chart-card .may11-left .flow-route .route-stop:first-child {
    padding-top: 0;
    margin-top: 0;
  }

  /* May 11 aligned grid (explicit row placement) */
  .flow-chart-card .may11-aligned-grid {
    display: grid;
    grid-template-columns: 45% 55%;
    column-gap: 8px;
    row-gap: 10px;
    width: 100%;
    box-sizing: border-box;
    align-items: center;
  }
  .flow-chart-card .may11-aligned-grid > * {
    box-sizing: border-box;
    width: 100% !important;
    max-width: 100% !important;
    font-size: 12px;
  }
  .flow-chart-card .may11-aligned-grid > .flow-step,
  .flow-chart-card .may11-aligned-grid > .flow-section-toggle {
    padding: 5px 7px !important;
    white-space: normal;
    overflow-wrap: anywhere;
  }
  /* Route stops without their original line+dot decoration (since they're in grid cells now) */
  .flow-chart-card .may11-aligned-grid > .route-stop {
    padding: 5px 7px;
    background: transparent;
    border: none;
    position: relative;
  }
  /* Route as a single flow-route container inside grid */
  .flow-chart-card .may11-aligned-grid > .flow-route {
    align-self: stretch;
    justify-self: stretch;
    height: 100%;
    width: 100% !important;
    max-width: 100% !important;
    position: relative;
    padding: 0 0 0 14px;
    background: transparent;
    border: none;
  }
  .flow-chart-card .may11-aligned-grid > .flow-route::before {
    content: "";
    position: absolute;
    left: 5px;
    top: 18px;
    bottom: 18px;
    width: 1px;
    background: rgba(196, 168, 130, 0.4);
  }
  .flow-chart-card .may11-aligned-grid > .flow-route .route-stop {
    position: relative;
    padding: 4px 0;
  }
  .flow-chart-card .may11-aligned-grid > .flow-route .route-stop::before {
    content: "";
    position: absolute;
    left: -8px;
    top: 50%;
    transform: translateY(-50%);
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--warm, #c4a882);
    border: 1.5px solid var(--cream, #fdfaf3);
  }

  /* Route overlay — floating pill on right (May 11, Jul 25) */
  .day-block[data-date="2026-05-11"],
  .day-block[data-date="2026-07-25"] {
    position: relative;
  }
  .day-block[data-date="2026-05-11"] .route-overlay-may11,
  .day-block[data-date="2026-07-25"] .route-overlay {
    position: absolute;
    top: 50px;
    right: 0;
    left: auto;
    width: 180px;
    z-index: 5;
    pointer-events: auto;
    background: rgba(42, 42, 42, 0.92);
    color: var(--cream, #fdfaf3);
    border-left: 1px solid rgba(196, 168, 130, 0.3);
    padding: 14px 14px 14px 6px;
    border-radius: 6px 0 0 6px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.2);
  }
  /* Overlay text colors over dark bg */
  .day-block[data-date="2026-05-11"] .route-overlay-may11 .route-overlay-header,
  .day-block[data-date="2026-07-25"] .route-overlay .route-overlay-header {
    color: rgba(196, 168, 130, 0.85) !important;
  }
  .day-block[data-date="2026-05-11"] .route-overlay-may11 .route-name,
  .day-block[data-date="2026-07-25"] .route-overlay .route-name {
    color: var(--cream, #fdfaf3) !important;
  }
  .day-block[data-date="2026-05-11"] .route-overlay-may11 .route-num,
  .day-block[data-date="2026-07-25"] .route-overlay .route-num {
    color: var(--warm, #c4a882) !important;
  }
  .day-block[data-date="2026-05-11"] .route-overlay-may11 .flow-route::before,
  .day-block[data-date="2026-07-25"] .route-overlay .flow-route::before {
    background: rgba(196, 168, 130, 0.5) !important;
  }
  .day-block[data-date="2026-05-11"] .route-overlay-may11 .route-stop::before,
  .day-block[data-date="2026-07-25"] .route-overlay .route-stop::before {
    border-color: rgba(42, 42, 42, 1) !important;
  }
  .day-block[data-date="2026-05-11"] .route-overlay-may11 .flow-section-toggle,
  .day-block[data-date="2026-07-25"] .route-overlay .flow-section-toggle {
    padding: 3px 5px;
    font-size: 12px;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 6px;
    background: transparent;
    border: none;
  }
  .day-block[data-date="2026-05-11"] .route-overlay-may11 .flow-route,
  .day-block[data-date="2026-07-25"] .route-overlay .flow-route {
    position: relative;
    padding: 6px 0 6px 18px;
    background: transparent;
    border: none;
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
  }
  .day-block[data-date="2026-05-11"] .route-overlay-may11 .flow-route::before,
  .day-block[data-date="2026-07-25"] .route-overlay .flow-route::before {
    content: "";
    position: absolute;
    left: 10px;
    top: 18px;
    bottom: 18px;
    width: 1px;
    background: rgba(196, 168, 130, 0.4);
  }
  .day-block[data-date="2026-05-11"] .route-overlay-may11 .route-stop,
  .day-block[data-date="2026-07-25"] .route-overlay .route-stop {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 5px 0;
    position: relative;
    font-size: 13px;
    background: transparent !important;
    border: none !important;
    width: auto !important;
  }
  .day-block[data-date="2026-05-11"] .route-overlay-may11 .route-stop::before,
  .day-block[data-date="2026-07-25"] .route-overlay .route-stop::before {
    content: "";
    position: absolute;
    left: -12px;
    top: 50%;
    transform: translateY(-50%);
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--warm, #c4a882);
    border: 1.5px solid var(--cream, #fdfaf3);
  }
  .day-block[data-date="2026-05-11"] .route-overlay-may11 .route-num,
  .day-block[data-date="2026-07-25"] .route-overlay .route-num {
    font-family: 'DM Mono', monospace;
    font-size: 10px;
    color: var(--warm, #c4a882);
    min-width: 16px;
  }
  .day-block[data-date="2026-05-11"] .route-overlay-may11 .route-name,
  .day-block[data-date="2026-07-25"] .route-overlay .route-name {
    font-family: 'Newsreader', serif;
    font-size: 14px;
    color: var(--dark, #2a2a2a);
    line-height: 1.15;
    cursor: text;
    outline: none;
    min-width: 1em;
  }
  .day-block[data-date="2026-07-25"] .route-overlay .route-name:focus {
    outline: 1px dashed rgba(196, 168, 130, 0.65);
    outline-offset: 2px;
  }

  /* Collapsed overlay state: small "route" pill */
  .day-block[data-date="2026-05-11"] .route-overlay-may11.route-overlay-collapsed,
  .day-block[data-date="2026-07-25"] .route-overlay.route-overlay-collapsed {
    width: auto;
    overflow: hidden;
    height: auto;
    border-radius: 6px 0 0 6px;
    padding: 6px 12px;
    background: rgba(42, 42, 42, 0.92);
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .day-block[data-date="2026-05-11"] .route-overlay-may11.route-overlay-collapsed > *,
  .day-block[data-date="2026-07-25"] .route-overlay.route-overlay-collapsed > * {
    display: none;
  }
  .day-block[data-date="2026-05-11"] .route-overlay-may11.route-overlay-collapsed::before,
  .day-block[data-date="2026-07-25"] .route-overlay.route-overlay-collapsed::before {
    content: "route";
    color: var(--warm, #c4a882);
    font-family: 'DM Mono';
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.15em;
  }

  /* Ensure overlay receives clicks when collapsed */
  .day-block[data-date="2026-05-11"] .route-overlay-may11.route-overlay-collapsed,
  .day-block[data-date="2026-07-25"] .route-overlay.route-overlay-collapsed {
    cursor: pointer !important;
    pointer-events: auto !important;
  }
  .day-block[data-date="2026-05-11"] .route-overlay-may11.route-overlay-collapsed::before,
  .day-block[data-date="2026-07-25"] .route-overlay.route-overlay-collapsed::before {
    pointer-events: none;
  }

  /* Faded/deprioritized task cell */
  .flow-chart-card .flow-step.flow-faded {
    opacity: 0.4;
  }

  /* Faded route stop in overlay */
  .day-block[data-date="2026-05-11"] .route-overlay-may11 .route-stop.route-stop-faded,
  .day-block[data-date="2026-07-25"] .route-overlay .route-stop.route-stop-faded {
    opacity: 0.4;
  }

  /* Allah guidance banner — shimmering, captivating */
  .day-allah-header {
    margin: 0 0 8px;
    text-align: center;
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 16px;
    line-height: 1.3;
    letter-spacing: 0.02em;
    padding: 10px 12px;
    background: linear-gradient(135deg, rgba(196,168,130,0.08) 0%, rgba(138,109,31,0.08) 100%);
    border-top: 1px solid rgba(138,109,31,0.25);
    border-bottom: 1px solid rgba(138,109,31,0.25);
    position: relative;
    overflow: hidden;
  }
  .day-allah-header .allah-text {
    display: inline-block;
    position: relative;
    background: linear-gradient(
      90deg,
      #8a6d1f 0%,
      #c4a882 25%,
      #f4d97a 50%,
      #c4a882 75%,
      #8a6d1f 100%
    );
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    animation: allah-shimmer 4s linear infinite;
  }
  .day-allah-header .allah-inner {
    display: inline;
  }
  @keyframes allah-shimmer {
    0%   { background-position: 200% center; }
    100% { background-position: -200% center; }
  }

  /* Edit history asterisk + popup */
  .edit-history-asterisk {
    display: none;
    margin-left: 4px;
    color: #708090;
    font-size: 12px;
    cursor: pointer;
    vertical-align: super;
    line-height: 1;
    user-select: none;
  }
  .edit-history-popup {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fdfaf3;
    border: 1px solid rgba(196, 168, 130, 0.5);
    border-radius: 8px;
    padding: 16px 18px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.18);
    z-index: 9999;
    max-width: 320px;
    width: 90%;
    max-height: 70vh;
    overflow-y: auto;
    font-family: 'Newsreader', serif;
    color: #2a2a2a;
  }
  .edit-history-popup .eh-title {
    font-family: 'DM Mono', monospace;
    font-size: 10px;
    color: #5C7257;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(196, 168, 130, 0.3);
  }
  .edit-history-popup .eh-entry {
    margin-bottom: 12px;
    font-size: 13px;
    line-height: 1.4;
  }
  .edit-history-popup .eh-date {
    font-family: 'DM Mono', monospace;
    font-size: 9px;
    color: #94927d;
    margin-bottom: 3px;
  }
  .edit-history-popup .eh-old {
    color: #94927d;
    text-decoration: line-through;
  }
  .edit-history-popup .eh-arrow {
    margin: 0 6px;
    color: #c4a882;
  }
  .edit-history-popup .eh-new {
    color: #2a2a2a;
    font-weight: 500;
  }
  .edit-history-popup .eh-close {
    position: absolute;
    top: 8px;
    right: 12px;
    cursor: pointer;
    font-size: 18px;
    color: #94927d;
    line-height: 1;
    background: none;
    border: none;
  }
  .edit-history-backdrop {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(42, 42, 42, 0.35);
    z-index: 9998;
  }

  /* May 17 paired rows: equal-width parallel columns; text wraps within cells */
  .day-block[data-date="2026-05-17"] .flow-chart-card .flow-step-row {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 0 !important;
    width: 100%;
    box-sizing: border-box;
  }
  .day-block[data-date="2026-05-17"] .flow-chart-card .flow-step-row > .flow-step,
  .day-block[data-date="2026-05-17"] .flow-chart-card .flow-step-row > .flow-step:not(.flow-combined):not(.flow-wide):not(.flow-narrow) {
    flex: 1 1 auto !important;
    flex-basis: auto !important;
    flex-grow: 1 !important;
    flex-shrink: 1 !important;
    min-width: 0 !important;
    width: auto !important;
    max-width: none !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    white-space: normal !important;
    overflow-wrap: break-word !important;
    word-break: normal !important;
    display: flex !important;
    align-items: flex-start !important;
    gap: 6px;
  }
  .day-block[data-date="2026-05-17"] .flow-chart-card .flow-step-row > .flow-step input[type="checkbox"] {
    flex: 0 0 auto;
    margin-top: 2px;
  }

  /* Padding between May 17 flow title and first task */
  .day-block[data-date="2026-05-17"] .flow-chart-card .flow-title {
    margin-bottom: 0 !important;
    margin-top: 0 !important;
    padding-bottom: 8px !important;
    padding-top: 0 !important;
  }

  /* May 17: reduce shaitan→title gap to 20px */
  .day-block[data-date="2026-05-17"] .flow-chart-card {
    margin-top: 8px !important;
    padding-top: 4px !important;
  }

  /* May 17 microfiber row: wash + dry sub-checkboxes stacked vertically
     between "microfiber" and "cycle" */
  .wash-dry-stack {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    vertical-align: middle;
    margin: 0 6px;
    gap: 1px;
    line-height: 1.1;
  }
  .wash-dry-stack .wd-line {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 12px;
    color: var(--dark, #2a2a2a);
    white-space: nowrap;
  }
  .wash-dry-stack .wd-check {
    appearance: none;
    -webkit-appearance: none;
    width: 10px;
    height: 10px;
    min-width: 10px;
    border-radius: 2px;
    border: 1.2px solid #c4a882;
    background: transparent;
    cursor: pointer;
    margin: 0;
    position: relative;
    flex: none;
  }
  .wash-dry-stack .wd-check:checked {
    background: #c4a882;
    border-color: #c4a882;
  }
  .wash-dry-stack .wd-check:checked::after {
    content: "✓";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #FBF8F3;
    font-size: 7px;
    font-weight: 600;
    line-height: 1;
  }

  /* May 18 flow: no checkboxes, tap label to complete, yes/no buttons */
  .day-block[data-date="2026-05-18"] .flow-chart-card .flow-arrow {
    color: #5C7257 !important;
    font-size: 18px !important;
    opacity: 1 !important;
  }
  .day-block[data-date="2026-05-18"] .flow-step.may18-task {
    display: flex !important;
    align-items: center;
    gap: 8px;
    padding: 6px 10px;
  }
  .day-block[data-date="2026-05-18"] .flow-step.may18-task .task-label-text {
    flex: 1;
    cursor: pointer;
    padding: 2px 0;
  }
  .day-block[data-date="2026-05-18"] .flow-step.may18-task .task-done-check {
    display: none;
    color: var(--sage, #5C7257);
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-weight: 300;
    font-size: 24px;
    line-height: 1;
    transform: skewX(-10deg);
    margin-left: 4px;
  }
  .day-block[data-date="2026-05-18"] .flow-step.may18-task.done .task-done-check {
    display: inline;
  }
  .day-block[data-date="2026-05-18"] .flow-step.may18-task.cancelled .task-label-text {
    text-decoration: line-through;
    opacity: 0.5;
  }
  .day-block[data-date="2026-05-18"] .flow-step.may18-task .task-yn-buttons {
    display: inline-flex;
    gap: 4px;
    flex-shrink: 0;
  }
  .day-block[data-date="2026-05-18"] .flow-step.may18-task .task-yn-buttons button {
    font-family: 'DM Mono', monospace;
    font-size: 9px;
    text-transform: lowercase;
    letter-spacing: 0.05em;
    padding: 2px 6px;
    border-radius: 3px;
    cursor: pointer;
    border: none;
  }
  .day-block[data-date="2026-05-18"] .flow-step.may18-task .task-yn-buttons .task-yes {
    background: #c4d4bc;
    color: #3d4a38;
  }
  .day-block[data-date="2026-05-18"] .flow-step.may18-task .task-yn-buttons .task-yes:hover {
    background: #b3c5a9;
  }
  .day-block[data-date="2026-05-18"] .flow-step.may18-task .task-yn-buttons .task-no {
    background: #e6c4b5;
    color: #6e3826;
  }
  .day-block[data-date="2026-05-18"] .flow-step.may18-task .task-yn-buttons .task-no:hover {
    background: #d8b09e;
  }


  .day-block[data-date="2026-05-18"] .flow-step.may18-task.done .task-yn-buttons {
    display: none !important;
  }


  /* No-popup modal */
  .may18-no-popup-overlay {
    position: fixed; inset: 0;
    background: rgba(0,0,0,0.45);
    display: none;
    align-items: center; justify-content: center;
    z-index: 9999;
  }
  .may18-no-popup-overlay.open { display: flex; }
  .may18-no-popup {
    background: #fdfaf3;
    padding: 20px 18px;
    border-radius: 8px;
    border: 1px solid rgba(196,168,130,0.4);
    max-width: 280px;
    width: 90%;
    box-shadow: 0 8px 32px rgba(0,0,0,0.2);
  }
  .may18-no-popup-title {
    font-family: 'EB Garamond', serif;
    font-size: 13px;
    color: #2a2a2a;
    margin-bottom: 12px;
  }
  .may18-no-popup-target {
    font-style: italic;
    color: #a85432;
  }
  .may18-no-popup-buttons {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .may18-no-popup-buttons button {
    font-family: 'DM Mono', monospace;
    font-size: 10px;
    text-transform: lowercase;
    letter-spacing: 0.08em;
    padding: 8px 12px;
    border: 1px solid rgba(196,168,130,0.5);
    background: white;
    color: #2a2a2a;
    border-radius: 4px;
    cursor: pointer;
    text-align: left;
  }
  .may18-no-popup-buttons button:hover { background: rgba(196,168,130,0.1); }
  .may18-no-popup-buttons .cancel-btn { color: #a85432; }

  /* May 18: no strikethrough on completed tasks (just checkmark) */
  .day-block[data-date="2026-05-18"] .flow-step.may18-task.done,
  .day-block[data-date="2026-05-18"] .flow-step.may18-task.done .task-label-text,
  .day-block[data-date="2026-05-18"] .flow-step.may18-task.done * {
    text-decoration: none !important;
    text-decoration-line: none !important;
  }


  /* May 18: in two-column rows, yes/no buttons go UNDER the label */
  .day-block[data-date="2026-05-18"] .flow-chart-card .flow-step-row .flow-step.may18-task {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 4px !important;
  }
  .day-block[data-date="2026-05-18"] .flow-chart-card .flow-step-row .flow-step.may18-task .task-label-text {
    text-align: center;
  }
  .day-block[data-date="2026-05-18"] .flow-chart-card .flow-step-row .flow-step.may18-task .task-yn-buttons {
    justify-content: center;
  }

  /* May 18: gap between flow title and first item */
  .day-block[data-date="2026-05-18"] .flow-chart-card .flow-title {
    padding-bottom: 16px !important;
  }

  /* Allow text wrapping in row-paired flow steps to prevent overflow */
  .flow-step-row .flow-step .task-label-text {
    white-space: normal !important;
    word-break: break-word;
    overflow-wrap: break-word;
  }

  /* May 18: hide inline yes/no buttons (long-press reveals them in popup) */
  .day-block[data-date="2026-05-18"] .task-yn-buttons {
    display: none !important;
  }
  /* Long-press popup menu */
  .yn-longpress-popup {
    position: fixed;
    z-index: 9999;
    background: white;
    border: 1px solid rgba(196, 168, 130, 0.4);
    border-radius: 6px;
    padding: 6px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    display: flex;
    gap: 8px;
  }
  .yn-longpress-popup button {
    font-family: 'DM Mono', monospace;
    font-size: 11px;
    text-transform: lowercase;
    letter-spacing: 0.05em;
    padding: 5px 12px;
    border-radius: 4px;
    cursor: pointer;
    border: none;
  }
  .yn-longpress-popup .yn-yes {
    background: #dbe8d4;
    color: #6b7f60;
  }
  .yn-longpress-popup .yn-no {
    background: #f3dccf;
    color: #a06450;
  }

  /* Floating section · L2 style · below flow on May 18 */
  .floating-section {
    margin: 20px 0 12px;
    background: rgba(196, 168, 130, 0.07);
    border: 1px dashed rgba(196, 168, 130, 0.5);
    border-radius: 12px;
    padding: 12px 14px;
    min-height: 60px;
  }
  .floating-section-label {
    font-family: 'EB Garamond', serif;
    font-style: italic;
    font-size: 13px;
    color: var(--sage, #5C7257);
    margin-bottom: 10px;
  }
  .floating-section-items {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
  }
  .floating-item {
    display: inline-flex;
    align-items: center;
    background: white;
    border: 1px solid rgba(196, 168, 130, 0.45);
    border-radius: 5px;
    padding: 5px 9px;
    font-size: 11px;
    cursor: grab;
    transform: rotate(-1deg);
  }
  .floating-item:nth-child(2n) { transform: rotate(1deg); }
  .floating-item:nth-child(3n) { transform: rotate(-0.5deg); }
  .floating-item:nth-child(4n) { transform: rotate(1.5deg); }
  /* Permanent "+" button at the end of every floating-section-items —
     clicking inserts a new editable .floating-item before it. Sits on the
     same baseline as floating-items but dashed-border + neutral color so it
     reads as an affordance, not a captured task. */
  .floating-add-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px; height: 26px;
    background: transparent;
    border: 1px dashed rgba(196, 168, 130, 0.55);
    border-radius: 5px;
    padding: 0;
    font-family: 'DM Mono', monospace;
    font-size: 16px;
    line-height: 1;
    color: rgba(196, 168, 130, 0.75);
    cursor: pointer;
    transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
    transform: none;
  }
  .floating-add-btn:hover {
    color: #5b4733;
    border-color: #c4a882;
    background: rgba(196, 168, 130, 0.08);
  }

  /* May 18: SV3 engraved silver arrows (multi-shadow chiseled effect) */
  .day-block[data-date="2026-05-18"] .flow-chart-card .flow-arrow {
    color: #f0f0f0 !important;
    text-shadow:
      0 -1px 0 #999,
      0 1px 0 #fff,
      1px 0 0 #b8b8b8,
      -1px 0 0 #fff,
      0 2px 3px rgba(0,0,0,0.2) !important;
    opacity: 1 !important;
    font-size: 18px !important;
  }

  /* Bismillah header — fixed at top of page, 20px gap above */
  .day-card-overlay {
    position: fixed;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 9999;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    pointer-events: none;
    transition: opacity 1.4s ease;
    opacity: 1;
  }
  .day-card-overlay.fade-out {
    opacity: 0;
  }
  .day-card-overlay .dco-bismillah {
    margin: 0;
    font-size: 36px;
    line-height: 1;
    display: inline-block;
    background: linear-gradient(
      90deg,
      #8a6d1f 0%,
      #c4a882 25%,
      #f4d97a 50%,
      #c4a882 75%,
      #8a6d1f 100%
    );
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    animation: allah-shimmer 4s linear infinite;
    filter: drop-shadow(0 2px 8px rgba(0,0,0,0.55)) drop-shadow(0 0 14px rgba(244,217,122,0.25));
  }
  .day-card-overlay .dco-allah {
    margin: 0;
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 22px;
    line-height: 1.3;
    letter-spacing: 0.02em;
  }
  .day-card-overlay .dco-allah .dco-allah-text {
    display: inline-block;
    background: linear-gradient(
      90deg,
      #8a6d1f 0%,
      #c4a882 25%,
      #f4d97a 50%,
      #c4a882 75%,
      #8a6d1f 100%
    );
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    animation: allah-shimmer 4s linear infinite;
    filter: drop-shadow(0 2px 8px rgba(0,0,0,0.5)) drop-shadow(0 0 16px rgba(244,217,122,0.2));
  }
  .day-card-overlay .dco-shaitan {
    margin: 0;
  }
  .day-card-overlay .dco-shaitan .dco-shaitan-text {
    display: inline-block;
    background: transparent;
    padding: 0;
  }
  .day-card-overlay .dco-shaitan .dco-shaitan-inner {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 21px;
    font-weight: 700;
    letter-spacing: 0.04em;
    background-image: linear-gradient(135deg, #e6c992 0%, #fff3d0 25%, #fffaeb 50%, #fff3d0 75%, #e6c992 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #fffaeb;
    filter: drop-shadow(0 2px 4px rgba(0,0,0,0.85)) drop-shadow(0 0 22px rgba(255,243,208,0.55));
  }

  /* Italiana font scoped to today + future day-cards only */
  .day-block.today-or-future .flow-chart-card .flow-step {
    font-family: 'Italiana', serif;
    font-size: 18px;
    letter-spacing: 0.04em;
    line-height: 1.2;
  }
  /* DISABLED 2026-05-21 — today's font override removed to match May 11's Cormorant Garamond look
  :is(.day-block.today, .day-block.flow-modern) .flow-chart-card .flow-step {
    font-family: 'Antic Didone', serif;
    font-size: 18px;
    letter-spacing: 0.02em;
    line-height: 1.2;
  }
  */
  /* DESIGN D: Pill nodes + dashed connectors — today + future */
  .day-block.today-or-future .flow-chart-card {
    align-items: center !important;
  }
  .day-block.today-or-future .flow-chart-card .flow-title {
    width: 100%;
    margin: 0 0 20px !important;
  }
  /* Pill-shaped flow-step nodes — full width, single line, checkbox absolutely positioned at left */
  .day-block.today-or-future .flow-chart-card .flow-step {
    position: relative;
    border-radius: 999px !important;
    background: #ffffff !important;
    border: 1px solid rgba(196,168,130,0.4) !important;
    padding: 8px 18px 8px 38px !important;   /* extra left padding makes room for absolute checkbox */
    justify-content: center;
    text-align: center;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex-wrap: nowrap;
    min-width: 0;
  }
  /* Circular checkbox, positioned at the left edge of the pill */
  .day-block.today-or-future .flow-chart-card .flow-step .flow-check {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    appearance: none;
    -webkit-appearance: none;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 1.4px solid #c4a882;
    background: transparent;
    cursor: pointer;
    margin: 0;
    flex: none;
  }
  .day-block.today-or-future .flow-chart-card .flow-step .flow-check:checked {
    background: #c4a882;
    border-color: #c4a882;
  }
  .day-block.today-or-future .flow-chart-card .flow-step .flow-check:checked::after {
    content: "✓";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #FBF8F3;
    font-size: 9px;
    font-weight: 600;
    line-height: 1;
  }
  /* Past-day flow-steps locked to one line (scoped to PAST days only — applying
     overflow:hidden to modern-flow pills would clip the X delete button at top:-8px/right:-8px) */
  .day-block:not(.today):not(.flow-modern) .flow-chart-card .flow-step {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  /* Dashed vertical connector between pills */
  .day-block.today-or-future .flow-chart-card .flow-arrow.line-chev-transition {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin: 0 !important;
    padding: 0;
    line-height: 0;
    color: transparent;
    text-align: initial;
  }
  .day-block.today-or-future .flow-chart-card .flow-arrow.line-chev-transition::before {
    content: "";
    display: block;
    width: 1px;
    height: 22px;
    background: repeating-linear-gradient(to bottom, rgba(196,168,130,0.55) 0 3px, transparent 3px 6px);
  }
    /* Deadline element — small pill, used inside flow-step (e.g. "Career Readiness Certificate") */
  .flow-chart-card .flow-step .task-deadline {
    font-family: 'Spectral', serif;
    font-style: italic;
    font-size: 13px;
    font-weight: 500;
    color: #a85432;
    background: transparent;
    padding: 0;
    margin-left: auto;
    flex: 0 0 auto;
    letter-spacing: 0.03em;
    white-space: nowrap;
  }
  /* "due " prefix removed 2026-05-21 per request — deadline pill now shows just the date */

  /* V2-style varied arrow transitions — today + future day-cards only */
  .day-block.today-or-future .flow-chart-card .flow-arrow.v2-arrow {
    display: flex;
    align-items: center;
    width: 400px;
    max-width: 100%;
    margin: 4px auto;
    line-height: 1;
    color: transparent;       /* hide any fallback text ↓ */
    text-align: initial;
  }
  .day-block.today-or-future .flow-chart-card .flow-arrow.v2-arrow svg {
    display: block;
  }
  .day-block.today-or-future .flow-chart-card .flow-arrow.v2-center {
    justify-content: center;
  }
  .day-block.today-or-future .flow-chart-card .flow-arrow.v2-left {
    justify-content: flex-start;
    padding-left: 30px;
  }
  .day-block.today-or-future .flow-chart-card .flow-arrow.v2-right {
    justify-content: flex-end;
    padding-right: 30px;
  }


  /* ============== CANVAS SECTION — freeform scrollable whiteboard ============== */
  .may22-section-canvas > .may22-section-header { color: #4d6e5a; }   /* moss green */
  .may22-section-canvas .may22-section-body {
    padding: 0;
    position: relative;
  }
  .canvas-toolbar {
    display: flex;
    justify-content: center;
    gap: 8px;
    padding: 10px;
    background: rgba(196, 168, 130, 0.08);
    border-bottom: 1px solid rgba(168, 133, 86, 0.2);
  }
  .canvas-toolbar button {
    font-family: 'DM Mono', monospace;
    font-size: 10px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    padding: 6px 12px;
    border: 1px solid rgba(168, 133, 86, 0.4);
    background: #faf6ec;
    border-radius: 4px;
    cursor: pointer;
    color: #5a4d33;
    transition: background 0.18s, transform 0.12s;
  }
  .canvas-toolbar button:hover {
    background: #f0e9d8;
    transform: translateY(-1px);
  }
  .canvas-area {
    width: 100%;
    height: 540px;
    overflow: hidden;
    background: #fbf8ec;
    position: relative;
    cursor: grab;
  }
  .canvas-area.panning { cursor: grabbing; }
  .canvas-inner {
    width: 6000px;
    height: 4000px;
    position: relative;
    background: linear-gradient(135deg, #fdfaf2, #f0e4cf 60%, #e8d9bd);
    transform-origin: 0 0;
    transition: none;
    will-change: transform;
  }
  /* (zoom controls CSS removed per user request) */
  /* Sticky note (style E — layered + tilt) */
  .canvas-note {
    position: absolute;
    padding: 12px 14px;
    background: #fdfaf2;
    border-radius: 4px;
    box-shadow:
      0 1px 1px rgba(0,0,0,0.06),
      0 6px 12px rgba(107, 77, 42, 0.15),
      4px 4px 0 rgba(168, 133, 86, 0.18);
    transform: rotate(0.8deg);
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 15px;
    color: #2a2a2a;
    cursor: grab;
    user-select: none;
    min-width: 80px;
    max-width: 260px;
    line-height: 1.35;
  }
  .canvas-note:nth-child(even) { transform: rotate(-0.6deg); }
  .canvas-note:active, .canvas-task:active { cursor: grabbing; }
  .canvas-note[contenteditable="true"]:focus {
    outline: 1.5px solid #c4a882;
    cursor: text;
    user-select: text;
  }
  /* Canvas task — option P (warm cream→ochre gradient) */
  .canvas-task {
    position: absolute;
    padding: 10px 14px;
    background: linear-gradient(135deg, #fdfaf2, #f0e4cf);
    border: 1px solid rgba(168, 133, 86, 0.4);
    border-radius: 4px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 18px;
    color: #2a2a2a;
    user-select: none;
    min-width: 130px;
    max-width: 280px;
    box-shadow: 0 2px 6px rgba(107, 77, 42, 0.12);
  }
  /* Hide the native checkbox — replaced by a custom check circle on the right */
  .canvas-task input[type="checkbox"],
  .canvas-import input[type="checkbox"] { display: none; }
  .canvas-task-check {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 1.5px solid #c4a882;
    background: transparent;
    flex-shrink: 0;
    cursor: pointer;
    position: relative;
    transition: background 0.15s, border-color 0.15s;
  }
  .canvas-task-check:hover { border-color: #8a3b2b; }
  .canvas-task.done .canvas-task-check,
  .canvas-import.done .canvas-task-check {
    background: #c4a882;
    border-color: #c4a882;
  }
  .canvas-task.done .canvas-task-check::after,
  .canvas-import.done .canvas-task-check::after {
    content: '✓';
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    color: #fdfaf0;
    font-size: 10px;
    font-weight: 600;
    line-height: 1;
  }
  .canvas-task-text {
    flex: 1;
    min-width: 40px;
    font-size: 18px;
  }
  .canvas-task-text[contenteditable="true"]:focus {
    outline: 1.5px solid #c4a882;
    cursor: text;
    user-select: text;
  }
  .canvas-task.done .canvas-task-text {
    text-decoration: line-through;
    text-decoration-color: rgba(168, 133, 86, 0.6);
    opacity: 0.55;
  }
  /* × delete button — appears on hover */
  .canvas-item-del {
    position: absolute;
    top: -8px;
    right: -8px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fbf8ec;
    border: 1px solid rgba(168, 133, 86, 0.5);
    color: #94595a;
    font-size: 12px;
    line-height: 1;
    cursor: pointer;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 0;
    font-family: serif;
  }
  .canvas-note:hover .canvas-item-del,
  .canvas-task:hover .canvas-item-del { display: flex; }
  .canvas-item-del:hover { background: #94595a; color: #fbf8ec; }

  /* CANVAS — connector + import + link-mode + flow-picker styles */
  .canvas-svg-layer {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    pointer-events: none;
    z-index: 1;
    overflow: visible;
  }
  .canvas-inner .canvas-note,
  .canvas-inner .canvas-task,
  .canvas-inner .canvas-import { z-index: 2; }
  .canvas-connector-path {
    stroke: #b06544;
    stroke-width: 1.8;
    fill: none;
    pointer-events: stroke;
    cursor: pointer;
    transition: stroke-width 0.12s, stroke 0.12s;
  }
  .canvas-connector-path:hover {
    stroke-width: 2.6;
    stroke: #8a3b2b;
  }
  /* FLOW import item — sage accent bar (style D) */
  .canvas-import {
    position: absolute;
    padding: 10px 14px;
    background: #fbf8ec;
    border: 1px solid rgba(168, 133, 86, 0.4);
    border-left: 4px solid #6e864e;
    border-radius: 4px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 14px;
    color: #2a2a2a;
    cursor: grab;
    user-select: none;
    min-width: 130px;
    max-width: 280px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.06);
  }
  .canvas-import:active { cursor: grabbing; }
  .canvas-import-text {
    flex: 1;
    min-width: 40px;
  }
  .canvas-import-text[contenteditable="true"]:focus {
    outline: 1.5px solid #c4a882;
    cursor: text;
    user-select: text;
  }
  .canvas-import-badge {
    position: absolute;
    top: -7px;
    right: -7px;
    background: #6e864e;
    color: #fdfaf0;
    font-family: 'DM Mono', monospace;
    font-size: 7px;
    letter-spacing: 0.18em;
    padding: 2px 5px;
    border-radius: 3px;
    text-transform: uppercase;
    pointer-events: none;
  }
  /* Link mode — crosshair cursor + highlightable items */
  .canvas-area.link-mode { cursor: crosshair; }
  .canvas-area.link-mode .canvas-note,
  .canvas-area.link-mode .canvas-task,
  .canvas-area.link-mode .canvas-import {
    cursor: pointer;
    outline: 1.5px dashed transparent;
    transition: outline 0.15s ease;
  }
  .canvas-area.link-mode .canvas-note:hover,
  .canvas-area.link-mode .canvas-task:hover,
  .canvas-area.link-mode .canvas-import:hover {
    outline-color: #b06544;
  }
  .canvas-area.link-mode .canvas-link-source {
    outline: 1.5px solid #b06544 !important;
  }
  .canvas-toolbar button.active {
    background: #b06544;
    color: #fdfaf0;
    border-color: #8a3b2b;
  }
  /* FLOW picker modal */
  .flow-picker-overlay {
    position: fixed;
    inset: 0;
    background: rgba(42, 37, 32, 0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
  }
  .flow-picker {
    background: #fbf8ec;
    border: 1px solid rgba(168, 133, 86, 0.5);
    border-radius: 8px;
    padding: 22px 22px 18px;
    max-width: 440px;
    width: calc(100% - 48px);
    max-height: 80vh;
    overflow-y: auto;
    box-shadow: 0 12px 36px rgba(0,0,0,0.3);
    font-family: 'Newsreader', serif;
  }
  .flow-picker h3 {
    font-family: 'DM Mono', monospace;
    font-size: 11px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    text-align: center;
    margin: 0 0 14px;
    color: #5a4d33;
  }
  .flow-picker-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 14px;
  }
  .flow-picker-item {
    padding: 8px 12px;
    background: #fdfaf2;
    border: 1px solid rgba(168, 133, 86, 0.3);
    border-radius: 4px;
    cursor: pointer;
    font-style: italic;
    font-size: 14px;
    color: #2a2a2a;
    transition: background 0.15s, border-color 0.15s;
  }
  .flow-picker-item:hover {
    background: #f0e9d8;
    border-color: rgba(168, 133, 86, 0.6);
  }
  .flow-picker-empty {
    text-align: center;
    color: #8a7e62;
    font-style: italic;
    font-size: 13px;
    padding: 16px 0;
  }
  .flow-picker-close {
    font-family: 'DM Mono', monospace;
    font-size: 10px;
    letter-spacing: 0.18em;
    padding: 8px 12px;
    background: #faf6ec;
    border: 1px solid rgba(168, 133, 86, 0.4);
    border-radius: 4px;
    cursor: pointer;
    width: 100%;
    text-transform: uppercase;
    color: #5a4d33;
  }
  .flow-picker-close:hover { background: #f0e9d8; }


  /* Canvas resize handle — bottom-right corner, visible on hover */
  .canvas-item-resize {
    position: absolute;
    bottom: -2px;
    right: -2px;
    width: 14px;
    height: 14px;
    cursor: nwse-resize;
    display: none;
    align-items: center;
    justify-content: center;
    color: #8a7e62;
    font-size: 11px;
    line-height: 1;
    user-select: none;
    background: transparent;
    border: none;
    padding: 0;
  }
  .canvas-note:hover .canvas-item-resize,
  .canvas-task:hover .canvas-item-resize,
  .canvas-import:hover .canvas-item-resize { display: flex; }
  .canvas-item-resize:hover { color: #5a4d33; }
  /* Allow text wrapping when items are resized larger */
  .canvas-note, .canvas-task-text, .canvas-import-text {
    white-space: pre-wrap;
    word-break: break-word;
  }
  /* Canvas drag grip — appears on hover next to × */
  .canvas-item-drag-handle {
    position: absolute;
    top: -8px;
    left: -8px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fbf8ec;
    border: 1px solid rgba(168, 133, 86, 0.5);
    color: #8a7e62;
    font-size: 11px;
    line-height: 1;
    cursor: grab;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 0;
    font-family: 'DM Mono', monospace;
    font-weight: bold;
  }
  .canvas-note:hover .canvas-item-drag-handle,
  .canvas-task:hover .canvas-item-drag-handle,
  .canvas-import:hover .canvas-item-drag-handle { display: flex; }
  .canvas-item-drag-handle:hover { background: #c4a882; color: #fbf8ec; }
  .canvas-item-drag-handle:active { cursor: grabbing; }
  /* When an item is being edited, item itself shouldn't show grab cursor */
  .canvas-note:focus, .canvas-task-text:focus, .canvas-import-text:focus { cursor: text; }
  /* Items default to text cursor (since they're editable). Grip handles dragging. */
  .canvas-note, .canvas-task, .canvas-import { cursor: text; }
  .canvas-empty-hint {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: rgba(107, 77, 42, 0.35);
    font-style: italic;
    font-size: 14px;
    pointer-events: none;
    user-select: none;
  }
  /* Collapsed state for 1,2,3 section — hide everything except the header */
  .onetwothree-section.collapsed > *:not(.onetwothree-header) { display: none !important; }
  .onetwothree-section.collapsed { padding-bottom: 22px; }
  .onetwothree-section.collapsed .onetwothree-header::after {
    content: '  ▸'; font-size: 11px; color: rgba(196, 168, 130, 0.7); letter-spacing: 0;
  }
  .onetwothree-section:not(.collapsed) .onetwothree-header::after {
    content: '  ▾'; font-size: 11px; color: rgba(196, 168, 130, 0.7); letter-spacing: 0;
  }
  .onetwothree-section .onetwothree-header { cursor: pointer; }
  /* ============== "1, 2, 3" SECTION — staircase track of numbered stones (ADHD-friendly) ============== */
  .onetwothree-section {
    margin: 14px 0 !important;
    font-family: 'Newsreader', serif;
    align-self: stretch !important;
    width: 100% !important;
    box-sizing: border-box;
  }
  .onetwothree-header {
    /* Mirror .may22-section-header — same pop, dusty terracotta text */
    display: block;
    width: 100%;
    cursor: pointer;
    padding: 14px 18px;
    background: linear-gradient(180deg, #dcd6c1 0%, #c8c2ad 100%);
    border: 1px solid rgba(168, 133, 86, 0.5);
    border-radius: 26px;
    font-family: 'DM Mono', monospace;
    font-size: 11px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.26em;
    color: #4d6e5a;
    text-align: center;
    user-select: none;
    transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease, letter-spacing 0.18s ease;
    box-sizing: border-box;
    box-shadow:
      0 3px 6px rgba(107, 77, 42, 0.18),
      0 1px 2px rgba(107, 77, 42, 0.10),
      inset 0 1px 0 rgba(255, 255, 255, 0.8),
      inset 0 -1px 0 rgba(168, 133, 86, 0.15);
  }
  .onetwothree-header:hover {
    background: linear-gradient(180deg, #e3decb 0%, #ccc6b1 100%);
    transform: translateY(-2px);
    letter-spacing: 0.3em;
    box-shadow:
      0 6px 12px rgba(107, 77, 42, 0.28),
      0 2px 4px rgba(107, 77, 42, 0.14),
      inset 0 1px 0 rgba(255, 255, 255, 0.8);
  }
  .onetwothree-header:active {
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(107, 77, 42, 0.15), inset 0 1px 2px rgba(107, 77, 42, 0.1);
  }
  .onetwothree-section.collapsed .onetwothree-header {
    /* Match the may22 sections — keep the pale moss gradient pill in collapsed state too. */
  }
  .onetwothree-track-wrap {
    overflow: hidden;
    max-height: 2000px;
    transition: max-height 0.4s ease, padding 0.3s ease, opacity 0.3s;
    padding: 16px 0 8px;
  }
  .onetwothree-section.collapsed .onetwothree-track-wrap,
  .onetwothree-section.collapsed .onetwothree-track {
    max-height: 0;
    padding: 0;
    opacity: 0;
  }
  .onetwothree-track {
    display: flex;
    flex-direction: column;
    gap: 14px;
    position: relative;
  }
  .onetwothree-stone {
    position: relative;
    display: flex;
    align-items: center;
    gap: 14px;
    background: #FBF8F3;
    border: 1px solid rgba(196, 168, 130, 0.4);
    border-radius: 6px;
    padding: 9px 13px;
    transition: opacity 0.35s ease, transform 0.35s ease;
  }
  /* Staircase offset — each step indented progressively */
  .onetwothree-stone[data-num="1"] { margin-left: 0; }
  .onetwothree-stone[data-num="2"] { margin-left: 7%; }
  .onetwothree-stone[data-num="3"] { margin-left: 14%; }
  .onetwothree-stone[data-num="4"] { margin-left: 21%; }
  .onetwothree-num {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-weight: 500;
    font-size: 30px;
    color: #c4a882;
    line-height: 0.85;
    min-width: 28px;
    text-align: center;
    flex-shrink: 0;
  }
  /* Earthy numeral palette — each stone a different tone */
  .onetwothree-stone[data-num="1"] .onetwothree-num { color: #b06544; }  /* terracotta */
  .onetwothree-stone[data-num="2"] .onetwothree-num { color: #a8782c; }  /* gold ochre */
  .onetwothree-stone[data-num="3"] .onetwothree-num { color: #5a7236; }  /* olive sage */
  .onetwothree-stone[data-num="4"] .onetwothree-num { color: #6b4d2a; }  /* walnut */
  .onetwothree-stone[data-num="5"] .onetwothree-num { color: #94595a; }  /* dusty rose */
  .onetwothree-task {
    flex: 1;
    font-size: 14px;
    font-style: italic;
    color: #2a2a2a;
    line-height: 1.3;
  }
  .onetwothree-check {
    width: 18px;
    height: 18px;
    cursor: pointer;
    flex-shrink: 0;
    accent-color: #c4a882;
  }
  /* Dashed connector line between stones — gives sense of forward motion */
  .onetwothree-stone::after {
    content: '';
    position: absolute;
    left: 32px;
    bottom: -14px;
    width: 1px;
    height: 14px;
    background-image: linear-gradient(to bottom, rgba(196,168,130,0.5) 50%, transparent 50%);
    background-size: 1px 4px;
    background-repeat: repeat-y;
  }
  .onetwothree-stone:last-child::after { display: none; }
  /* Done state — soft fade + strikethrough, num goes faint */
  .onetwothree-stone:has(.onetwothree-check:checked) {
    opacity: 0.5;
  }
  .onetwothree-stone:has(.onetwothree-check:checked) .onetwothree-task {
    text-decoration: line-through;
    text-decoration-color: rgba(196, 168, 130, 0.55);
    text-decoration-thickness: 1px;
    color: #94927d;
  }
  .onetwothree-stone:has(.onetwothree-check:checked) .onetwothree-num {
    color: rgba(196, 168, 130, 0.35);
  }

  /* Collapsed flow-chart-card — show only the title; user clicks title to expand */
  .flow-chart-card.flow-collapsed > *:not(.flow-title) { display: none !important; }
  .flow-chart-card.flow-collapsed .flow-title {
    cursor: pointer;
    opacity: 0.7;
  }
  .flow-chart-card.flow-collapsed .flow-title::after {
    content: '  ▸';
    font-size: 11px;
    color: rgba(196, 168, 130, 0.7);
    letter-spacing: 0;
  }
  .flow-chart-card:not(.flow-collapsed) .flow-title {
    cursor: pointer;
  }
  .flow-chart-card:not(.flow-collapsed) .flow-title::after {
    content: '  ▾';
    font-size: 11px;
    color: rgba(196, 168, 130, 0.7);
    letter-spacing: 0;
  }

  /* JUN 3 ONLY: flatten flow-chart-card so all section pills (inside + outside it)
     participate in the day-tasks flex column with uniform 14px gap. */
  .day-block[data-date="2026-06-03"] .flow-chart-card {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    display: contents !important;
  }
  .day-block[data-date="2026-06-03"] .day-tasks {
    gap: 14px !important;
  }
  /* Sections drop their own margins on Jun 3 — the day-tasks gap handles all spacing */
  .day-block[data-date="2026-06-03"] .may22-section,
  .day-block[data-date="2026-06-03"] .onetwothree-section {
    margin: 0 !important;
  }
  /* Hide the redundant "jun 3 · flow" title — it duplicates the FLOW button */
  .day-block[data-date="2026-06-03"] .flow-title {
    display: none !important;
  }

  /* JUN 3 ONLY: explicit two-column flex layout. JS moves each section
     into the LEFT wrapper (jun3-main) or RIGHT wrapper (jun3-rail) based
     on its .collapsed state, so the rail is always next to the open view. */
  .day-block[data-date="2026-06-03"] .day-tasks {
    display: flex !important;
    flex-direction: row !important;
    gap: 14px !important;
    align-items: flex-start !important;
    padding-right: 10px !important;
  }
  .day-block[data-date="2026-06-03"] .jun3-main {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
  }
  .day-block[data-date="2026-06-03"] .jun3-rail {
    width: 56px;
    flex: 0 0 56px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: center;
  }

  .day-block[data-date="2026-06-04"] .flow-section-divider {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 13px;
    letter-spacing: 0.06em;
    color: #8a7e62;
    text-align: center;
    padding: 14px 0 8px;
    user-select: none;
    background: transparent;
    border: none;
  }
  /* Sections inside each wrapper take full wrapper width */
  .day-block[data-date="2026-06-03"] .jun3-main > .may22-section,
  .day-block[data-date="2026-06-03"] .jun3-main > .onetwothree-section {
    width: 100% !important;
    margin: 0 !important;
  }
  .day-block[data-date="2026-06-03"] .jun3-rail > .may22-section,
  .day-block[data-date="2026-06-03"] .jun3-rail > .onetwothree-section {
    width: 100% !important;
    margin: 0 !important;
  }
  /* Vertical text + compact pill for collapsed (right-rail) chips.
     No min-height — chip sizes to its label only, no empty space below it. */
  .day-block[data-date="2026-06-03"] .may22-section.collapsed > .may22-section-header,
  .day-block[data-date="2026-06-03"] .onetwothree-section.collapsed > .onetwothree-header {
    writing-mode: vertical-rl !important;
    text-orientation: mixed !important;
    padding: 16px 10px 0 10px !important;
    min-height: 0 !important;
    border-radius: 22px !important;
    transition: padding 0.25s ease;
  }
  /* Hide the ▸ chevron on vertical chips (would look awkward sideways) */
  .day-block[data-date="2026-06-03"] .may22-section.collapsed > .may22-section-header::after,
  .day-block[data-date="2026-06-03"] .onetwothree-section.collapsed > .onetwothree-header::after {
    display: none !important;
  }

  /* JUN 3 ONLY: kill the empty space between the header pill and section body */
  .day-block[data-date="2026-06-03"] .may22-section-body {
    padding-top: 0 !important;
  }

  /* JUN 3 ONLY: bigger canvas viewport */
  .day-block[data-date="2026-06-03"] .canvas-area {
    height: 800px !important;
  }

  /* JUN 3 ONLY: canvas inner uses rock texture, tiled */
  .day-block[data-date="2026-06-03"] .canvas-inner {
    background: #f0e4cf url('canvas-bg.jpg') repeat !important;
  }

  /* JUN 3 ONLY: canvas toolbar floats OVER the canvas at the bottom,
     translucent so the picture shows through behind it */
  .day-block[data-date="2026-06-03"] .may22-section-canvas .may22-section-body {
    position: relative !important;
  }
  .day-block[data-date="2026-06-03"] .canvas-toolbar {
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    background: rgba(196, 168, 130, 0.22) !important;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    border-top: 1px solid rgba(168, 133, 86, 0.35) !important;
    border-bottom: none !important;
    z-index: 5 !important;
  }

  /* JUN 6 ONLY: wider flow-step task boxes */
  .day-block[data-date="2026-06-06"] .flow-step {
    padding-left: 28px !important;
    padding-right: 28px !important;
    min-width: 240px;
  }

  /* JUN 6 ONLY: wider task pills */
  .day-block[data-date="2026-06-06"] .flow-step,
  .day-block[data-date="2026-06-06"] label.flow-step {
    padding: 10px 28px !important;
    min-width: 240px !important;
    box-sizing: border-box;
  }


  /* JUN 3 ONLY: when day-block is collapsed, force day-tasks to hide
     (my display:flex !important rule needs an even more specific override) */
  .day-block.collapsed[data-date="2026-06-03"] .day-card .day-tasks {
    display: none !important;
  }

  /* JUN 7 — flow tweaks: no chevron after title, transparent flow-step pills */
  .day-block[data-date="2026-06-07"] .flow-chart-card:not(.flow-collapsed) .flow-title::after,
  .day-block[data-date="2026-06-07"] .flow-chart-card.flow-collapsed .flow-title::after {
    content: none !important;
  }
  .day-block[data-date="2026-06-07"] .flow-chart-card .flow-step {
    background: transparent !important;
  }

  /* JUN 7 — SOCIAL widget. Narrow column. Refined 'that girl' aesthetic.
     Real photo thumbnails (load from /people/<slug>.jpg with cream fallback).
     SVG action icons in tan stroke. */
  .day-block[data-date="2026-06-07"] .social-widget {
    width: 280px;
    flex-shrink: 0;
    padding: 22px 20px 26px;
    background: linear-gradient(180deg, rgba(253, 250, 242, 0.55) 0%, rgba(246, 239, 222, 0.45) 100%);
    border: 1px solid rgba(168, 133, 86, 0.25);
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(107, 77, 42, 0.06);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    font-family: 'Newsreader', serif;
  }
  .day-block[data-date="2026-06-07"] .sw-title {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 22px;
    color: #5a4d33;
    margin: 0;
    line-height: 1;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    cursor: pointer;
    user-select: none;
  }
  .day-block[data-date="2026-06-07"] .sw-title::after {
    content: '▾';
    font-size: 14px;
    color: #94927d;
    margin-left: 6px;
    transition: transform 0.18s ease;
    font-style: normal;
  }
  .day-block[data-date="2026-06-07"] .social-widget.collapsed .sw-title::after {
    transform: rotate(-90deg);
  }
  .day-block[data-date="2026-06-07"] .social-widget.collapsed .sw-sub,
  .day-block[data-date="2026-06-07"] .social-widget.collapsed .sw-list,
  .day-block[data-date="2026-06-07"] .social-widget.collapsed .sw-empty {
    display: none !important;
  }
  .day-block[data-date="2026-06-07"] .social-widget.collapsed {
    padding: 14px 20px;
  }
  .day-block[data-date="2026-06-07"] .sw-counter {
    font-family: 'DM Mono', monospace;
    font-size: 9px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #8a7e62;
    font-style: normal;
  }
  .day-block[data-date="2026-06-07"] .sw-sub {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 12px;
    color: #94927d;
    margin: 4px 0 18px;
    letter-spacing: 0.01em;
  }
  .day-block[data-date="2026-06-07"] .sw-list {
    display: flex;
    flex-direction: column;
    gap: 0;
  }
  .day-block[data-date="2026-06-07"] .sw-row {
    display: grid;
    grid-template-columns: 38px 1fr;
    gap: 12px;
    align-items: center;
    padding: 14px 0;
    border-bottom: 1px solid rgba(168, 133, 86, 0.18);
    transition: opacity 0.4s ease, transform 0.4s ease;
  }
  .day-block[data-date="2026-06-07"] .sw-row:last-child { border-bottom: none; }
  .day-block[data-date="2026-06-07"] .sw-row.done {
    opacity: 0;
    transform: translateX(20px);
    pointer-events: none;
    padding: 0;
    height: 0;
    overflow: hidden;
    border: none;
  }
  .day-block[data-date="2026-06-07"] .sw-row.snoozed {
    opacity: 0.45;
  }
  /* Photo thumbnail with cream-circle fallback */
  .day-block[data-date="2026-06-07"] .sw-photo {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: transparent;
    overflow: hidden;
    box-shadow: inset 0 0 0 1px rgba(168, 133, 86, 0.4);
    flex-shrink: 0;
  }
  .day-block[data-date="2026-06-07"] .sw-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  .day-block[data-date="2026-06-07"] .sw-meta {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
  }
  .day-block[data-date="2026-06-07"] .sw-name {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 17px;
    color: #2a2a2a;
    line-height: 1.1;
    letter-spacing: 0.01em;
  }
  .day-block[data-date="2026-06-07"] .sw-snippet {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 12px;
    color: #8a7e62;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-top: 1px;
  }
  .day-block[data-date="2026-06-07"] .sw-time {
    font-family: 'DM Mono', monospace;
    font-size: 8px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #b0a489;
    margin-top: 3px;
  }
  .day-block[data-date="2026-06-07"] .sw-time.long { color: #b06544; }
  /* Action icons row (SVG, hairline tan) */
  .day-block[data-date="2026-06-07"] .sw-actions {
    display: flex;
    gap: 8px;
    margin-top: 6px;
    grid-column: 2;
  }
  .day-block[data-date="2026-06-07"] .sw-action {
    width: 22px;
    height: 22px;
    padding: 0;
    background: none;
    border: none;
    cursor: pointer;
    color: #94927d;
    transition: color 0.15s ease, transform 0.15s ease;
  }
  .day-block[data-date="2026-06-07"] .sw-action:hover {
    color: #5a4d33;
    transform: scale(1.15);
  }
  .day-block[data-date="2026-06-07"] .sw-action svg {
    width: 100%; height: 100%; stroke: currentColor;
    stroke-width: 1.3; fill: none; stroke-linecap: round; stroke-linejoin: round;
  }
  .day-block[data-date="2026-06-07"] .sw-action.acted {
    color: #6e864e;
  }
  .day-block[data-date="2026-06-07"] .sw-empty {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 14px;
    color: #6e864e;
    text-align: center;
    padding: 24px 0 4px;
    display: none;
  }
  .day-block[data-date="2026-06-07"] .social-widget.cleared .sw-empty { display: block; }

  /* JUN 7: row layout. Social widget sits to the RIGHT of FLOW (right-side column). */
  .day-block[data-date="2026-06-07"] .day-tasks {
    display: flex !important;
    flex-direction: row !important;
    gap: 16px !important;
    align-items: flex-start !important;
  }
  .day-block[data-date="2026-06-07"] .day-tasks > .social-widget {
    flex: 0 0 auto;
    order: 2;
  }
  .day-block[data-date="2026-06-07"] .day-tasks > *:not(.social-widget) {
    flex: 1 1 auto;
    min-width: 0;
    order: 1;
  }
  /* Collapsed override */
  .day-block.collapsed[data-date="2026-06-07"] .day-card .day-tasks {
    display: none !important;
  }

  /* === SOCIAL WIDGET — JUN 8 (cloned from Jun 7) === */
  .day-block[data-date="2026-06-08"] .social-widget {
    width: 380px;
    flex-shrink: 0;
    padding: 22px 20px 26px;
    background: transparent;
    border: 1px solid rgba(168, 133, 86, 0.25);
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(107, 77, 42, 0.06);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    font-family: 'Newsreader', serif;
  }
  .day-block[data-date="2026-06-08"] .sw-title {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 22px;
    color: #5a4d33;
    margin: 0;
    line-height: 1;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    cursor: pointer;
    user-select: none;
  }
  .day-block[data-date="2026-06-08"] .sw-title::after {
    content: '▾';
    font-size: 14px;
    color: #94927d;
    margin-left: 6px;
    transition: transform 0.18s ease;
    font-style: normal;
  }
  .day-block[data-date="2026-06-08"] .social-widget.collapsed .sw-title::after {
    transform: rotate(-90deg);
  }
  .day-block[data-date="2026-06-08"] .social-widget.collapsed .sw-sub,
  .day-block[data-date="2026-06-08"] .social-widget.collapsed .sw-list,
  .day-block[data-date="2026-06-08"] .social-widget.collapsed .sw-empty {
    display: none !important;
  }
  .day-block[data-date="2026-06-08"] .social-widget.collapsed {
    padding: 14px 20px;
  }
  .day-block[data-date="2026-06-08"] .sw-counter {
    font-family: 'DM Mono', monospace;
    font-size: 9px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #8a7e62;
    font-style: normal;
  }
  .day-block[data-date="2026-06-08"] .sw-sub {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 12px;
    color: #94927d;
    margin: 4px 0 18px;
    letter-spacing: 0.01em;
  }
  .day-block[data-date="2026-06-08"] .sw-list {
    display: flex;
    flex-direction: column;
    gap: 0;
  }
  .day-block[data-date="2026-06-08"] .sw-row {
    display: grid;
    grid-template-columns: 38px 1fr;
    gap: 12px;
    align-items: center;
    padding: 14px 0;
    border-bottom: 1px solid rgba(168, 133, 86, 0.18);
    transition: opacity 0.4s ease, transform 0.4s ease;
  }
  .day-block[data-date="2026-06-08"] .sw-row:last-child { border-bottom: none; }
  .day-block[data-date="2026-06-08"] .sw-row.done {
    opacity: 0;
    transform: translateX(20px);
    pointer-events: none;
    padding: 0;
    height: 0;
    overflow: hidden;
    border: none;
  }
  .day-block[data-date="2026-06-08"] .sw-row.snoozed {
    opacity: 0.45;
  }
  /* Photo thumbnail with cream-circle fallback */
  .day-block[data-date="2026-06-08"] .sw-photo {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: transparent;
    overflow: hidden;
    box-shadow: inset 0 0 0 1px rgba(168, 133, 86, 0.4);
    flex-shrink: 0;
  }
  .day-block[data-date="2026-06-08"] .sw-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  .day-block[data-date="2026-06-08"] .sw-meta {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
  }
  .day-block[data-date="2026-06-08"] .sw-name {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 17px;
    color: #2a2a2a;
    line-height: 1.1;
    letter-spacing: 0.01em;
  }
  .day-block[data-date="2026-06-08"] .sw-snippet {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 12px;
    color: #8a7e62;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-top: 1px;
  }
  .day-block[data-date="2026-06-08"] .sw-time {
    font-family: 'DM Mono', monospace;
    font-size: 8px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #b0a489;
    margin-top: 3px;
  }
  .day-block[data-date="2026-06-08"] .sw-time.long { color: #b06544; }
  /* Action icons row (SVG, hairline tan) */
  .day-block[data-date="2026-06-08"] .sw-actions {
    display: flex;
    gap: 8px;
    margin-top: 6px;
    grid-column: 2;
  }
  .day-block[data-date="2026-06-08"] .sw-action {
    width: 22px;
    height: 22px;
    padding: 0;
    background: none;
    border: none;
    cursor: pointer;
    color: #94927d;
    transition: color 0.15s ease, transform 0.15s ease;
  }
  .day-block[data-date="2026-06-08"] .sw-action:hover {
    color: #5a4d33;
    transform: scale(1.15);
  }
  .day-block[data-date="2026-06-08"] .sw-action svg {
    width: 100%; height: 100%; stroke: currentColor;
    stroke-width: 1.3; fill: none; stroke-linecap: round; stroke-linejoin: round;
  }
  .day-block[data-date="2026-06-08"] .sw-action.acted {
    color: #6e864e;
  }
  .day-block[data-date="2026-06-08"] .sw-empty {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 14px;
    color: #6e864e;
    text-align: center;
    padding: 24px 0 4px;
    display: none;
  }
  .day-block[data-date="2026-06-08"] .social-widget.cleared .sw-empty { display: block; }

  /* JUN 8: flow card background — fully transparent */
  .day-block[data-date="2026-06-08"] .flow-chart-card {
    background: transparent !important;
  }

  /* JUN 8: day-card background — a bit transparent */
  .day-block[data-date="2026-06-08"] .day-card {
    background: rgba(216, 213, 202, 0.4) !important;
  }

  /* JUN 7: row layout. Social widget sits to the RIGHT of FLOW (right-side column). */
  .day-block[data-date="2026-06-08"] .day-tasks {
    display: flex !important;
    flex-direction: row !important;
    gap: 16px !important;
    align-items: flex-start !important;
  }
  .day-block[data-date="2026-06-08"] .day-tasks > .social-widget {
    flex: 0 0 auto;
    order: 2;
  }
  .day-block[data-date="2026-06-08"] .day-tasks > *:not(.social-widget) {
    flex: 1 1 auto;
    min-width: 0;
    order: 1;
  }
  /* Collapsed override */
  .day-block.collapsed[data-date="2026-06-08"] .day-card .day-tasks {
    display: none !important;
  }

  /* === SOCIAL — CHAT BUBBLES (Jun 7 + Jun 8) === */
  .day-block[data-date="2026-06-07"] .bubble-cluster {
    position: relative;
    width: 100%;
    height: 200px;
    margin: 6px 0 4px;
  }
  .day-block[data-date="2026-06-08"] .bubble-cluster {
    position: relative;
    width: 100%;
    height: 280px;
    margin: 6px 0 4px;
  }
  /* A4 · watercolor blob nodes */
  .day-block[data-date="2026-06-07"] .bubble,
  .day-block[data-date="2026-06-08"] .bubble {
    position: absolute;
    width: 38px;
    height: 38px;
    padding: 0;
    border-radius: 50%;
    background: radial-gradient(circle at 40% 40%, rgba(176,101,68,0.7) 0%, rgba(176,101,68,0) 70%);
    filter: blur(0.5px);
    opacity: 0.85;
    box-shadow: none;
    display: block;
    cursor: pointer;
    transition: transform 0.25s ease, opacity 0.25s ease;
    animation: none;
  }
  .day-block[data-date="2026-06-07"] .bubble:hover,
  .day-block[data-date="2026-06-08"] .bubble:hover {
    transform: scale(1.15);
    opacity: 1;
    z-index: 10;
  }
  /* tail removed — balls, not chat bubbles */
  .day-block[data-date="2026-06-07"] .bubble::after,
  .day-block[data-date="2026-06-08"] .bubble::after {
    content: none;
  }
  /* name label sits next to the watercolor blob */
  .day-block[data-date="2026-06-07"] .b-name,
  .day-block[data-date="2026-06-08"] .b-name {
    position: absolute;
    left: 42px;
    top: 50%;
    transform: translateY(-50%);
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 16px;
    color: #3a2e1f;
    line-height: 1;
    white-space: nowrap;
    letter-spacing: 0.02em;
    pointer-events: none;
  }
  .day-block[data-date="2026-06-07"] .b-snippet,
  .day-block[data-date="2026-06-08"] .b-snippet {
    position: static;
    opacity: 1;
    transform: none;
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 0;
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 13px;
    color: #3a2e1f;
    white-space: normal;
    line-height: 1.22;
    margin-top: 2px;
    pointer-events: auto;
  }
  .day-block[data-date="2026-06-07"] .b-wait,
  .day-block[data-date="2026-06-08"] .b-wait {
    font-family: 'DM Mono', monospace;
    font-size: 7px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--accent);
    margin-top: 3px;
    opacity: 0.75;
  }
  @keyframes bubble-bob {
    0%,100% { transform: translateY(0px); }
    50% { transform: translateY(-4px); }
  }

  /* Jun 7 — editable empty snippets */
  .day-block[data-date="2026-06-07"] .b-snippet[contenteditable="true"] {
    min-height: 1em;
    outline: none;
    border-bottom: 1px dotted rgba(168,133,86,0.4);
    cursor: text;
  }
  .day-block[data-date="2026-06-07"] .b-snippet[contenteditable="true"]:empty::before {
    content: '—';
    color: rgba(168,133,86,0.5);
    font-style: italic;
  }
  .day-block[data-date="2026-06-07"] .b-snippet[contenteditable="true"]:focus {
    border-bottom-color: var(--accent);
    border-bottom-style: solid;
  }

  /* === SOULS NETWORK — hide snippet/wait, add you-node + lines === */
  .day-block[data-date="2026-06-07"] .b-snippet,
  .day-block[data-date="2026-06-08"] .b-snippet,
  .day-block[data-date="2026-06-07"] .b-wait,
  .day-block[data-date="2026-06-08"] .b-wait {
    display: none !important;
  }
  /* network lines SVG layer */
  .day-block[data-date="2026-06-07"] .net-svg,
  .day-block[data-date="2026-06-08"] .net-svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 0;
    overflow: visible;
  }
  .day-block[data-date="2026-06-07"] .net-line,
  .day-block[data-date="2026-06-08"] .net-line {
    stroke: rgba(168,133,86,0.5);
    stroke-width: 0.4;
    stroke-linecap: round;
    fill: none;
    vector-effect: non-scaling-stroke;
  }
  /* you-node at center */
  .day-block[data-date="2026-06-07"] .you-node,
  .day-block[data-date="2026-06-08"] .you-node {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #b89570;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 10px;
    color: #fdfaf2;
    letter-spacing: 0.04em;
    z-index: 2;
  }
  /* bubbles need higher z-index so they sit above the lines */
  .day-block[data-date="2026-06-07"] .bubble,
  .day-block[data-date="2026-06-08"] .bubble {
    z-index: 1;
  }
  /* === JUN 7 — flow items: left-aligned, no border === */
  .day-block[data-date="2026-06-07"] .flow-chart-card .flow-step {
    border: none !important;
  }

  /* ===========================================
     JUN 8 ONLY — bubble pop + interactive enhancements
     (Layered on top of dark slate-brown page bg #423B36.)
     =========================================== */

  /* Bigger, glowier, breathing blobs */
  .day-block[data-date="2026-06-08"] .bubble {
    width: 46px !important;
    height: 46px !important;
    background: radial-gradient(circle at 38% 38%,
      var(--ph-light, #d8b5b9) 0%,
      var(--accent, #b06544) 55%,
      var(--ph-dark, #8a3f57) 100%) !important;
    filter: blur(0px) !important;
    opacity: 0.95 !important;
    box-shadow:
      0 0 14px 2px color-mix(in srgb, var(--accent, #b06544) 50%, transparent),
      0 0 28px 4px color-mix(in srgb, var(--accent, #b06544) 22%, transparent),
      inset 0 0 6px rgba(255,255,255,0.18) !important;
    animation: bubble-bob-jun8 5.5s ease-in-out infinite !important;
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1),
                box-shadow 0.3s ease, opacity 0.2s ease !important;
  }
  @keyframes bubble-bob-jun8 {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-5px); }
  }

  /* Hover — scale up, brighter glow, lift name */
  .day-block[data-date="2026-06-08"] .bubble:hover {
    transform: scale(1.35) translateY(-3px) !important;
    opacity: 1 !important;
    z-index: 20 !important;
    box-shadow:
      0 0 22px 4px color-mix(in srgb, var(--accent, #b06544) 75%, transparent),
      0 0 48px 8px color-mix(in srgb, var(--accent, #b06544) 35%, transparent),
      inset 0 0 8px rgba(255,255,255,0.32) !important;
    animation-play-state: paused !important;
  }
  .day-block[data-date="2026-06-08"] .bubble:hover .b-name {
    color: #fff !important;
    transform: translateY(-50%) scale(1.05);
    text-shadow: 0 0 8px color-mix(in srgb, var(--accent, #b06544) 60%, transparent);
  }

  /* Click — quick ripple pulse */
  .day-block[data-date="2026-06-08"] .bubble:active {
    transform: scale(1.55) !important;
    transition: transform 0.08s ease-out !important;
  }

  /* Names — cream for visibility on dark slate-brown */
  .day-block[data-date="2026-06-08"] .b-name {
    color: #EFE0BD !important;
    left: 52px !important;
    font-size: 17px !important;
    text-shadow: 0 1px 3px rgba(0,0,0,0.4);
    transition: color 0.25s ease, transform 0.25s ease, text-shadow 0.25s ease;
  }

  /* Hover-only snippet reveal — show what they wrote about */
  .day-block[data-date="2026-06-08"] .bubble .b-snippet {
    display: block !important;
    position: absolute !important;
    left: 52px !important;
    top: calc(50% + 12px) !important;
    transform: translateY(-50%) translateX(-4px) !important;
    font-family: 'Newsreader', serif !important;
    font-style: italic !important;
    font-size: 12px !important;
    color: #C8B89A !important;
    white-space: nowrap !important;
    opacity: 0 !important;
    transition: opacity 0.25s ease, transform 0.25s ease !important;
    pointer-events: none !important;
    text-shadow: 0 1px 2px rgba(0,0,0,0.5) !important;
  }
  .day-block[data-date="2026-06-08"] .bubble:hover .b-snippet {
    opacity: 1 !important;
    transform: translateY(-50%) translateX(0) !important;
  }

  /* Hover-only wait label (e.g. "3d") — small monospace stamp */
  .day-block[data-date="2026-06-08"] .bubble .b-wait {
    display: block !important;
    position: absolute !important;
    top: -8px !important;
    right: -10px !important;
    font-family: 'DM Mono', monospace !important;
    font-size: 8px !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    color: #EFE0BD !important;
    background: rgba(66, 59, 54, 0.85) !important;
    padding: 2px 5px !important;
    border-radius: 8px !important;
    opacity: 0 !important;
    transform: scale(0.6) !important;
    transition: opacity 0.2s ease, transform 0.2s ease !important;
    pointer-events: none !important;
  }
  .day-block[data-date="2026-06-08"] .bubble:hover .b-wait {
    opacity: 1 !important;
    transform: scale(1) !important;
  }

  /* Network lines — cream + brighter for visibility on dark bg */
  .day-block[data-date="2026-06-08"] .net-line {
    stroke: rgba(232, 217, 176, 0.32) !important;
    stroke-width: 0.5 !important;
  }

  /* You-node ("me") — warm glow */
  .day-block[data-date="2026-06-08"] .you-node {
    width: 28px !important;
    height: 28px !important;
    font-size: 11px !important;
    background: radial-gradient(circle at 38% 38%, #e8c79a 0%, #b89570 60%, #8a6a4e 100%) !important;
    box-shadow:
      0 0 14px 2px rgba(232, 199, 154, 0.55),
      inset 0 0 6px rgba(255,255,255,0.3) !important;
    color: #2a1f15 !important;
    animation: you-pulse-jun8 3.2s ease-in-out infinite !important;
  }
  @keyframes you-pulse-jun8 {
    0%, 100% { box-shadow: 0 0 14px 2px rgba(232,199,154,0.5), inset 0 0 6px rgba(255,255,255,0.3); }
    50%      { box-shadow: 0 0 22px 4px rgba(232,199,154,0.75), inset 0 0 8px rgba(255,255,255,0.4); }
  }

  /* "souls" title + sub copy — cream on dark */
  .day-block[data-date="2026-06-08"] .sw-title {
    color: #EFE0BD !important;
  }
  .day-block[data-date="2026-06-08"] .sw-counter {
    color: #C8B89A !important;
  }
  .day-block[data-date="2026-06-08"] .sw-sub {
    color: #B0A085 !important;
  }
  .day-block[data-date="2026-06-08"] .sw-title::after {
    color: #C8B89A !important;
  }
  /* cloned souls circle for today 2026-06-17 */
  .day-block[data-date="2026-06-17"] .social-widget {
    width: 280px;
    flex-shrink: 0;
    padding: 22px 20px 26px;
    background: linear-gradient(180deg, rgba(253, 250, 242, 0.55) 0%, rgba(246, 239, 222, 0.45) 100%);
    border: 1px solid rgba(168, 133, 86, 0.25);
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(107, 77, 42, 0.06);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    font-family: 'Newsreader', serif;
  }
  .day-block[data-date="2026-06-17"] .sw-title {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 22px;
    color: #5a4d33;
    margin: 0;
    line-height: 1;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    cursor: pointer;
    user-select: none;
  }
  .day-block[data-date="2026-06-17"] .sw-title::after {
    content: '▾';
    font-size: 14px;
    color: #94927d;
    margin-left: 6px;
    transition: transform 0.18s ease;
    font-style: normal;
  }
  .day-block[data-date="2026-06-17"] .social-widget.collapsed .sw-title::after {
    transform: rotate(-90deg);
  }
  .day-block[data-date="2026-06-17"] .social-widget.collapsed .sw-sub,
  .day-block[data-date="2026-06-17"] .social-widget.collapsed .sw-list,
  .day-block[data-date="2026-06-17"] .social-widget.collapsed .sw-empty {
    display: none !important;
  }
  .day-block[data-date="2026-06-17"] .social-widget.collapsed {
    padding: 14px 20px;
  }
  .day-block[data-date="2026-06-17"] .sw-counter {
    font-family: 'DM Mono', monospace;
    font-size: 9px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #8a7e62;
    font-style: normal;
  }
  .day-block[data-date="2026-06-17"] .sw-sub {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 12px;
    color: #94927d;
    margin: 4px 0 18px;
    letter-spacing: 0.01em;
  }
  .day-block[data-date="2026-06-17"] .sw-list {
    display: flex;
    flex-direction: column;
    gap: 0;
  }
  .day-block[data-date="2026-06-17"] .sw-row {
    display: grid;
    grid-template-columns: 38px 1fr;
    gap: 12px;
    align-items: center;
    padding: 14px 0;
    border-bottom: 1px solid rgba(168, 133, 86, 0.18);
    transition: opacity 0.4s ease, transform 0.4s ease;
  }
  .day-block[data-date="2026-06-17"] .sw-row:last-child { border-bottom: none; }
  .day-block[data-date="2026-06-17"] .sw-row.done {
    opacity: 0;
    transform: translateX(20px);
    pointer-events: none;
    padding: 0;
    height: 0;
    overflow: hidden;
    border: none;
  }
  .day-block[data-date="2026-06-17"] .sw-row.snoozed {
    opacity: 0.45;
  }
  /* Photo thumbnail with cream-circle fallback */
  .day-block[data-date="2026-06-17"] .sw-photo {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: transparent;
    overflow: hidden;
    box-shadow: inset 0 0 0 1px rgba(168, 133, 86, 0.4);
    flex-shrink: 0;
  }
  .day-block[data-date="2026-06-17"] .sw-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  .day-block[data-date="2026-06-17"] .sw-meta {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
  }
  .day-block[data-date="2026-06-17"] .sw-name {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 17px;
    color: #2a2a2a;
    line-height: 1.1;
    letter-spacing: 0.01em;
  }
  .day-block[data-date="2026-06-17"] .sw-snippet {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 12px;
    color: #8a7e62;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-top: 1px;
  }
  .day-block[data-date="2026-06-17"] .sw-time {
    font-family: 'DM Mono', monospace;
    font-size: 8px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #b0a489;
    margin-top: 3px;
  }
  .day-block[data-date="2026-06-17"] .sw-time.long { color: #b06544; }
  /* Action icons row (SVG, hairline tan) */
  .day-block[data-date="2026-06-17"] .sw-actions {
    display: flex;
    gap: 8px;
    margin-top: 6px;
    grid-column: 2;
  }
  .day-block[data-date="2026-06-17"] .sw-action {
    width: 22px;
    height: 22px;
    padding: 0;
    background: none;
    border: none;
    cursor: pointer;
    color: #94927d;
    transition: color 0.15s ease, transform 0.15s ease;
  }
  .day-block[data-date="2026-06-17"] .sw-action:hover {
    color: #5a4d33;
    transform: scale(1.15);
  }
  .day-block[data-date="2026-06-17"] .sw-action svg {
    width: 100%; height: 100%; stroke: currentColor;
    stroke-width: 1.3; fill: none; stroke-linecap: round; stroke-linejoin: round;
  }
  .day-block[data-date="2026-06-17"] .sw-action.acted {
    color: #6e864e;
  }
  .day-block[data-date="2026-06-17"] .sw-empty {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 14px;
    color: #6e864e;
    text-align: center;
    padding: 24px 0 4px;
    display: none;
  }
  .day-block[data-date="2026-06-17"] .social-widget.cleared .sw-empty { display: block; }

  .day-block[data-date="2026-06-17"] .bubble-cluster {
    position: relative;
    width: 100%;
    height: 200px;
    margin: 6px 0 4px;
  }
  .day-block[data-date="2026-06-08"] .bubble-cluster {
    position: relative;
    width: 100%;
    height: 280px;
    margin: 6px 0 4px;
  }
  /* A4 · watercolor blob nodes */
  .day-block[data-date="2026-06-17"] .bubble,
  .day-block[data-date="2026-06-08"] .bubble {
    position: absolute;
    width: 38px;
    height: 38px;
    padding: 0;
    border-radius: 50%;
    background: radial-gradient(circle at 40% 40%, rgba(176,101,68,0.7) 0%, rgba(176,101,68,0) 70%);
    filter: blur(0.5px);
    opacity: 0.85;
    box-shadow: none;
    display: block;
    cursor: pointer;
    transition: transform 0.25s ease, opacity 0.25s ease;
    animation: none;
  }
  .day-block[data-date="2026-06-17"] .bubble:hover,
  .day-block[data-date="2026-06-08"] .bubble:hover {
    transform: scale(1.15);
    opacity: 1;
    z-index: 10;
  }
  /* tail removed — balls, not chat bubbles */
  .day-block[data-date="2026-06-17"] .bubble::after,
  .day-block[data-date="2026-06-08"] .bubble::after {
    content: none;
  }
  /* name label sits next to the watercolor blob */
  .day-block[data-date="2026-06-17"] .b-name,
  .day-block[data-date="2026-06-08"] .b-name {
    position: absolute;
    left: 42px;
    top: 50%;
    transform: translateY(-50%);
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 16px;
    color: #3a2e1f;
    line-height: 1;
    white-space: nowrap;
    letter-spacing: 0.02em;
    pointer-events: none;
  }
  .day-block[data-date="2026-06-17"] .b-snippet,
  .day-block[data-date="2026-06-08"] .b-snippet {
    position: static;
    opacity: 1;
    transform: none;
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 0;
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 13px;
    color: #3a2e1f;
    white-space: normal;
    line-height: 1.22;
    margin-top: 2px;
    pointer-events: auto;
  }
  .day-block[data-date="2026-06-17"] .b-wait,
  .day-block[data-date="2026-06-08"] .b-wait {
    font-family: 'DM Mono', monospace;
    font-size: 7px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--accent);
    margin-top: 3px;
    opacity: 0.75;
  }
  @keyframes bubble-bob {
    0%,100% { transform: translateY(0px); }
    50% { transform: translateY(-4px); }
  }

  /* Jun 7 — editable empty snippets */
  .day-block[data-date="2026-06-17"] .b-snippet[contenteditable="true"] {
    min-height: 1em;
    outline: none;
    border-bottom: 1px dotted rgba(168,133,86,0.4);
    cursor: text;
  }
  .day-block[data-date="2026-06-17"] .b-snippet[contenteditable="true"]:empty::before {
    content: '—';
    color: rgba(168,133,86,0.5);
    font-style: italic;
  }
  .day-block[data-date="2026-06-17"] .b-snippet[contenteditable="true"]:focus {
    border-bottom-color: var(--accent);
    border-bottom-style: solid;
  }

  /* === SOULS NETWORK — hide snippet/wait, add you-node + lines === */
  .day-block[data-date="2026-06-17"] .b-snippet,
  .day-block[data-date="2026-06-08"] .b-snippet,
  .day-block[data-date="2026-06-17"] .b-wait,
  .day-block[data-date="2026-06-08"] .b-wait {
    display: none !important;
  }
  /* network lines SVG layer */
  .day-block[data-date="2026-06-17"] .net-svg,
  .day-block[data-date="2026-06-08"] .net-svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 0;
    overflow: visible;
  }
  .day-block[data-date="2026-06-17"] .net-line,
  .day-block[data-date="2026-06-08"] .net-line {
    stroke: rgba(168,133,86,0.5);
    stroke-width: 0.4;
    stroke-linecap: round;
    fill: none;
    vector-effect: non-scaling-stroke;
  }
  /* you-node at center */
  .day-block[data-date="2026-06-17"] .you-node,
  .day-block[data-date="2026-06-08"] .you-node {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #b89570;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 10px;
    color: #fdfaf2;
    letter-spacing: 0.04em;
    z-index: 2;
  }
  /* bubbles need higher z-index so they sit above the lines */
  .day-block[data-date="2026-06-17"] .bubble,


/* from #photo-icons */

.card-visual img {
  width: 55px;
  height: 55px;
  object-fit: cover;
  border-radius: 8px;
  opacity: 0.85;
  transition: opacity 0.2s ease, transform 0.2s ease;
}
.card-visual img:hover {
  opacity: 1;
  transform: scale(1.05);
}



  /* ===== Hamburger nav menu + sidebar ===== */
  #hamburger-menu {
    position: fixed;
    top: 18px;
    left: 18px;
    z-index: 10000;
    background: transparent;
    border: none;
    border-radius: 4px;
    padding: 8px 10px;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 3px;
    box-shadow: none;
    transition: opacity 0.2s;
  }
  #hamburger-menu:hover {
    background: transparent;
    box-shadow: none;
    opacity: 0.7;
  }
  #hamburger-menu span {
    display: block;
    width: 18px;
    height: 2px;
    background: #5a4d33;
    border-radius: 1px;
  }
  #nav-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.3);
    z-index: 10000;
    transition: opacity 0.3s;
  }
  #nav-overlay.open { display: block; left: 280px; }
  #nav-sidebar {
    position: fixed;
    top: 0;
    left: -320px;
    width: 280px;
    height: 100vh;
    background: rgba(245, 240, 232, 0.9);
    backdrop-filter: blur(22px) saturate(1.12);
    -webkit-backdrop-filter: blur(22px) saturate(1.12);
    border-right: 1px solid rgba(28, 20, 14, 0.10);
    z-index: 10001;
    padding: 60px 0 20px;
    box-shadow: 8px 0 28px rgba(8, 4, 2, 0.12);
    transition: left 0.3s ease;
    overflow-y: auto;
    box-sizing: border-box;
  }
  #nav-sidebar.open { left: 0; }
  #nav-close {
    position: absolute;
    top: 12px;
    right: 14px;
    background: transparent;
    border: none;
    font-size: 22px;
    color: #5a4d33;
    cursor: pointer;
    padding: 6px 10px;
    line-height: 1;
  }
  #nav-close:hover { color: #2a2a2a; }
  #nav-sidebar h2 { display: none; }
  #nav-sidebar .nav-section {
    font-family: 'DM Mono', monospace;
    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: #8a7e62;
    padding: 14px 24px 6px;
  }
  #nav-sidebar nav { display: flex; flex-direction: column; }
  #nav-sidebar nav a {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 16px;
    padding: 9px 24px;
    color: #2a2a2a;
    text-decoration: none;
    border-bottom: 1px solid rgba(196,168,130,0.18);
    transition: background 0.15s, color 0.15s;
  }
  #nav-sidebar nav a:hover {
    background: rgba(196,168,130,0.18);
    color: #5a4d33;
  }
  #nav-sidebar nav a.current {
    background: rgba(196,168,130,0.25);
    color: #5a4d33;
    font-weight: 500;
  }


/* from #card-fixes-v2 */

/* FIX 1: CSS columns layout with drag-to-reorder */
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-grid { position: relative !important; height: auto !important; display: flex !important; flex-wrap: wrap !important; align-items: flex-start !important; gap: 10px !important; columns: auto !important; grid-template-columns: none !important; }
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-grid.freeform { position: relative !important; height: auto !important; display: flex !important; flex-wrap: wrap !important; align-items: flex-start !important; gap: 10px !important; grid-template-columns: none !important; }
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-grid .sec-card { position: relative !important; top: auto !important; left: auto !important; right: auto !important; display: flex !important; flex-direction: column !important; break-inside: avoid !important; margin: 0 !important; min-height: 0 !important; overflow: hidden !important; }
.day-block.fmt22 .sec-grid .sec-card.card-dragging { opacity: 0.5; }
.day-block.fmt22 .sec-grid .sec-card .card-visual { cursor: grab; touch-action: none; }
.day-block.fmt22 .sec-grid .sec-card .card-visual:active { cursor: grabbing; }

/* FIX 2: Glass effect on the DAY CARD CONTAINER (flow-chart-card), not individual cards */
.day-block.fmt22 .flow-chart-card {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* Individual pursuit cards: frosted / see-through so the page shows through */
.day-block.fmt22 .j22-section.sec-card {
  background: rgba(245, 240, 233, 0.10) !important;
  backdrop-filter: blur(18px) saturate(1.35) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.35) !important;
  border: 1px solid rgba(255, 255, 255, 0.22) !important;
  border-radius: 10px !important;
  box-shadow: 0 2px 10px rgba(0,0,0,0.04) !important;
  overflow: hidden !important;
}

/* FIX 3: Photo as a visible banner/strip at top of card */
.day-block.fmt22 .sec-card .card-visual {
  display: block !important;
  position: relative !important;
  height: 70px !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: rgba(180, 170, 155, 0.2) !important;
}
.day-block.fmt22 .sec-card .card-visual img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  opacity: 0.85 !important;
}

/* FIX 4: Header text - EDITORIAL, bold, readable, below the photo */
.day-block.fmt22 .sec-card .card-visual .j22-group {
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  top: auto !important;
  margin: 0 !important;
  padding: 6px 12px !important;
  background: linear-gradient(to top, rgba(40,35,28,0.7) 0%, rgba(40,35,28,0) 100%) !important;
  font-family: "Playfair Display", "Newsreader", Georgia, serif !important;
  font-style: normal !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;
  color: #ffffff !important;
  opacity: 1 !important;
  text-align: left !important;
  z-index: 3 !important;
  pointer-events: auto !important;
  cursor: text !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: ellipsis !important;
  text-shadow: none !important;
}

/* FIX 5: Card body below photo */
.day-block.fmt22 .sec-card .card-body {
  padding: 10px 12px 12px !important;
  border-top: none !important;
  overflow: hidden !important;
  background: transparent !important;
  min-height: 0 !important;
}

/* FIX 6: Hide the dashed text buttons (+ section, roll over remaining, flow out) */
.day-block.fmt22 .add-section-btn,
.day-block.fmt22 .rollover-btn,
.day-block.fmt22 .flow-rollover-btn {
  display: none !important;
}
/* But show add-section-btn inside tv-pursuits */
.day-block.fmt22 .tv-pursuits .add-section-btn {
  display: inline-block !important;
  margin: 10px auto 0;
  font-size: 11px;
  padding: 5px 14px;
  border: 1px dashed rgba(110,100,86,0.3);
  border-radius: 14px;
  background: transparent;
  color: #6e6456;
  cursor: pointer;
  letter-spacing: 0.04em;
}
.day-block.fmt22.zone-board-day .tv-pursuits .add-section-btn,
.day-block.fmt22.pursuit-board-day .tv-pursuits .add-section-btn,
.day-block.fmt22.zone-board-day .add-grid,
.day-block.fmt22.pursuit-board-day .add-grid {
  display: none !important;
}


/* from #collapsed-fix */

.day-block.collapsed .day-card,
.day-block.fmt22.collapsed .day-card,
.day-block.collapsed.fmt22 .day-card {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}
.day-block.collapsed .today-view-toggle,
.day-block.fmt22.collapsed .today-view-toggle {
  display: none !important;
}
.day-block.collapsed .day-tasks,
.day-block.fmt22.collapsed .day-tasks {
  display: none !important;
}


/* from #per-card-add */

.day-block.fmt22 .sec-card .card-add-task {
  position: absolute;
  bottom: 3px;
  right: 3px;
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,0.6);
  border: 1px dashed rgba(120,100,60,0.5);
  border-radius: 50%;
  font-family: "DM Mono", monospace;
  font-size: 16px;
  line-height: 1;
  color: #6b5a30;
  cursor: pointer;
  opacity: 0;
  transition: opacity 0.15s, background 0.15s, transform 0.15s;
  z-index: 5;
}
.day-block.fmt22 .sec-card:hover .card-add-task,
.day-block.fmt22 .sec-card.is-empty .card-add-task {
  opacity: 1;
}
.day-block.fmt22 .sec-card .card-add-task:hover {
  background: rgba(120,100,60,0.15);
  transform: scale(1.1);
}

/* Pursuit cards stay square. Empty = 148; with tasks = slightly larger square.
   With tasks: photo fills the card as a dimmed background; items sit on top of it. */
.day-block.fmt22 .sec-card {
  width: 148px !important;
  height: 148px !important;
  max-width: 148px !important;
  max-height: 148px !important;
  flex: 0 0 148px !important;
  aspect-ratio: 1 / 1 !important;
  min-height: 0 !important;
  align-self: flex-start !important;
  margin: 0 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  box-sizing: border-box !important;
  position: relative !important;
}
.day-block.fmt22 .sec-card .card-visual .j22-group {
  font-size: 11px !important;
  padding: 4px 8px !important;
}
/* Empty: photo fills the whole square */
.day-block.fmt22 .sec-card.is-empty .card-visual {
  position: absolute !important;
  inset: 0 !important;
  height: 100% !important;
  width: 100% !important;
  flex: none !important;
}
.day-block.fmt22 .sec-card.is-empty .card-add-task {
  width: 18px;
  height: 18px;
  font-size: 14px;
  bottom: 2px;
  right: 2px;
}
.day-block.fmt22 .sec-card.is-empty .card-body {
  display: none !important;
}
/*
  With-tasks card = full-bleed photo vision board.
  Whole card is the image; tasks float as small beige
  ripped-paper scraps (handwriting) scattered on top.
*/
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-card.has-tasks:not(.card-collapsed):not(.card-sized) {
  width: var(--vb-size, 210px) !important;
  height: var(--vb-size, 210px) !important;
  max-width: var(--vb-size, 210px) !important;
  max-height: var(--vb-size, 210px) !important;
  min-width: var(--vb-size, 210px) !important;
  min-height: var(--vb-size, 210px) !important;
  flex: 0 0 var(--vb-size, 210px) !important;
  aspect-ratio: 1 / 1 !important;
  align-self: flex-start !important;
}
.day-block.fmt22:not(.zone-board-day):not(.pursuit-board-day) .sec-card.has-tasks:not(.card-collapsed) .card-visual {
  position: absolute !important;
  inset: 0 !important;
  height: 100% !important;
  width: 100% !important;
  flex: none !important;
  z-index: 0 !important;
}
.day-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .card-visual img {
  opacity: 1 !important;
  filter: saturate(1.04) brightness(1.02) !important;
}
.day-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .card-visual .j22-group {
  top: 0 !important;
  bottom: auto !important;
  z-index: 3 !important;
  background: linear-gradient(to bottom, rgba(20,16,12,0.55) 0%, rgba(20,16,12,0) 100%) !important;
  padding: 9px 11px 20px !important;
  font-size: 12px !important;
}
/* Full-card transparent field — photo is the only backdrop */
.day-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .card-body {
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 2 !important;
  max-height: none !important;
  min-height: 0 !important;
  height: 100% !important;
  overflow: visible !important;
  padding: 34px 8px 10px !important;
  border-top: none !important;
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
  pointer-events: none !important;
}
/* Vision-board scatter field */
.day-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  border-left: none !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
  pointer-events: none !important;
}
.day-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2) {
  position: absolute !important;
  display: inline-flex !important;
  align-items: baseline !important;
  margin: 0 !important;
  padding: 3px 8px 2px 6px !important;
  border: none !important;
  border-radius: 0 !important;
  background: #efe6d8 !important;
  gap: 4px !important;
  flex-wrap: nowrap !important;
  opacity: 1 !important;
  min-height: 0 !important;
  max-width: 46% !important;
  width: max-content !important;
  z-index: 1 !important;
  cursor: grab !important;
  transform-origin: center center !important;
  pointer-events: auto !important;
  box-shadow: 1px 2px 4px rgba(40, 28, 18, 0.22) !important;
  /* subtle torn-paper edge — irregular, not overdone */
  -webkit-clip-path: polygon(
    1% 6%, 4% 1%, 11% 4%, 18% 0%, 27% 3%, 36% 1%, 48% 4%, 58% 0%, 69% 3%, 78% 1%, 88% 4%, 96% 1%, 100% 8%,
    98% 22%, 100% 38%, 97% 52%, 100% 68%, 98% 82%, 100% 94%,
    93% 100%, 82% 97%, 70% 100%, 56% 96%, 42% 100%, 28% 97%, 14% 100%, 3% 96%, 0% 88%,
    2% 72%, 0% 56%, 3% 40%, 0% 24%, 2% 12%
  ) !important;
  clip-path: polygon(
    1% 6%, 4% 1%, 11% 4%, 18% 0%, 27% 3%, 36% 1%, 48% 4%, 58% 0%, 69% 3%, 78% 1%, 88% 4%, 96% 1%, 100% 8%,
    98% 22%, 100% 38%, 97% 52%, 100% 68%, 98% 82%, 100% 94%,
    93% 100%, 82% 97%, 70% 100%, 56% 96%, 42% 100%, 28% 97%, 14% 100%, 3% 96%, 0% 88%,
    2% 72%, 0% 56%, 3% 40%, 0% 24%, 2% 12%
  ) !important;
}
.day-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2):nth-child(3n) {
  -webkit-clip-path: polygon(
    0% 8%, 6% 0%, 14% 3%, 24% 0%, 34% 4%, 46% 1%, 57% 3%, 68% 0%, 79% 4%, 90% 1%, 100% 7%,
    97% 24%, 100% 42%, 96% 58%, 100% 74%, 97% 90%, 100% 100%,
    88% 97%, 74% 100%, 60% 96%, 46% 100%, 32% 97%, 18% 100%, 6% 96%, 0% 86%,
    3% 70%, 0% 52%, 2% 34%, 0% 18%
  ) !important;
  clip-path: polygon(
    0% 8%, 6% 0%, 14% 3%, 24% 0%, 34% 4%, 46% 1%, 57% 3%, 68% 0%, 79% 4%, 90% 1%, 100% 7%,
    97% 24%, 100% 42%, 96% 58%, 100% 74%, 97% 90%, 100% 100%,
    88% 97%, 74% 100%, 60% 96%, 46% 100%, 32% 97%, 18% 100%, 6% 96%, 0% 86%,
    3% 70%, 0% 52%, 2% 34%, 0% 18%
  ) !important;
}
.day-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2):nth-child(3n+2) {
  -webkit-clip-path: polygon(
    2% 4%, 8% 0%, 16% 3%, 28% 0%, 40% 2%, 52% 0%, 64% 4%, 76% 1%, 88% 3%, 98% 0%, 100% 10%,
    98% 28%, 100% 46%, 97% 62%, 100% 78%, 98% 92%,
    90% 100%, 76% 97%, 62% 100%, 48% 96%, 34% 100%, 20% 97%, 8% 100%, 0% 90%,
    2% 74%, 0% 58%, 3% 42%, 0% 26%, 2% 12%
  ) !important;
  clip-path: polygon(
    2% 4%, 8% 0%, 16% 3%, 28% 0%, 40% 2%, 52% 0%, 64% 4%, 76% 1%, 88% 3%, 98% 0%, 100% 10%,
    98% 28%, 100% 46%, 97% 62%, 100% 78%, 98% 92%,
    90% 100%, 76% 97%, 62% 100%, 48% 96%, 34% 100%, 20% 97%, 8% 100%, 0% 90%,
    2% 74%, 0% 58%, 3% 42%, 0% 26%, 2% 12%
  ) !important;
}
.day-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2):hover {
  background: #efe6d8 !important;
  z-index: 3 !important;
}
.day-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-t {
  color: #2a241c !important;
  -webkit-text-fill-color: #2a241c !important;
  font-family: "Reenie Beanie", "Segoe Print", cursive !important;
  font-size: inherit !important;
  line-height: 1.05 !important;
  font-weight: 400 !important;
  font-style: normal !important;
  opacity: 1 !important;
  text-shadow: none !important;
  white-space: normal !important;
}
.day-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2)::before {
  color: rgba(90, 55, 30, 0.7) !important;
  -webkit-text-fill-color: rgba(90, 55, 30, 0.7) !important;
  opacity: 1 !important;
  font-weight: 400 !important;
  font-style: normal !important;
  font-family: "Reenie Beanie", cursive !important;
  font-size: 1.05em !important;
  flex: 0 0 auto !important;
  line-height: 1 !important;
}
.day-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item.j22-sub,
.day-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item.j22-sub2 {
  display: none !important;
}
.day-block.fmt22 .sec-card.has-tasks.vb-dragging {
  overflow: visible !important;
  z-index: 40 !important;
}
.day-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2) {
  touch-action: none;
}


/* from #pursuit-task-style */

/* Refined task appearance inside pursuit cards */
.day-block.fmt22 .sec-card .card-body .j22-section-items {
  padding: 0 !important;
  padding-left: 0 !important;
  margin: 0 !important;
  border-left: none !important;
}
.day-block.fmt22 .sec-card .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2) {
  display: flex !important;
  align-items: center !important;
  padding: 7px 0 !important;
  margin: 0 !important;
  border-bottom: 1px solid rgba(180, 170, 155, 0.2) !important;
  transition: background 0.12s ease;
}
.day-block.fmt22 .sec-card .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2):last-child {
  border-bottom: none !important;
}
.day-block.fmt22 .sec-card .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2):hover {
  background: rgba(154, 132, 86, 0.04) !important;
  border-radius: 4px;
}
/* Refined text - smaller, upright, clean */
.day-block.fmt22 .sec-card .j22-t {
  font-family: 'DM Sans', 'Inter', -apple-system, sans-serif !important;
  font-size: 13px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  color: #3d3a35 !important;
  letter-spacing: 0.01em !important;
  line-height: 1.4 !important;
}
/* Checked state */
.day-block.fmt22 .sec-card .j22-item .agenda-check:checked + .j22-t {
  opacity: 0.4 !important;
  text-decoration: line-through !important;
  text-decoration-color: rgba(100,95,85,0.4) !important;
}
/* Checkbox: small minimal circle */
.day-block.fmt22 .sec-card .j22-item:not(.j22-sub):not(.j22-sub2) > .agenda-check {
  display: inline-flex !important;
  width: 14px !important;
  height: 14px !important;
  min-width: 14px !important;
  border: 1.5px solid rgba(120, 110, 95, 0.4) !important;
  border-radius: 50% !important;
  background: transparent !important;
  margin-right: 10px !important;
  margin-top: 0 !important;
  align-self: center !important;
  cursor: pointer !important;
  transition: border-color 0.15s, background 0.15s;
  -webkit-appearance: none !important;
  appearance: none !important;
  position: relative !important;
}
.day-block.fmt22 .sec-card .j22-item:not(.j22-sub):not(.j22-sub2) > .agenda-check::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) scale(0) !important;
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  background: #9a8456 !important;
  transition: transform 0.15s ease !important;
  font-size: 0 !important;
  background-image: none !important;
}
.day-block.fmt22 .sec-card .j22-item:not(.j22-sub):not(.j22-sub2) > .agenda-check:checked {
  border-color: #9a8456 !important;
}
.day-block.fmt22 .sec-card .j22-item:not(.j22-sub):not(.j22-sub2) > .agenda-check:checked::after {
  transform: translate(-50%, -50%) scale(1) !important;
}
/* Sub-items: slightly indented, smaller */
.day-block.fmt22 .sec-card .j22-item.j22-sub,
.day-block.fmt22 .sec-card .j22-item.j22-sub2 {
  padding-left: 24px !important;
  margin: 0 !important;
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}
.day-block.fmt22 .sec-card .j22-item.j22-sub .j22-t,
.day-block.fmt22 .sec-card .j22-item.j22-sub2 .j22-t {
  font-size: 12px !important;
  color: #5a5549 !important;
}
/* Pin button: wax seal marker (pressed into paper) */
.day-block.fmt22 .sec-card .j22-item .pin-btn {
  position: absolute !important;
  right: -34px !important;
  top: -4px !important;
  left: auto !important;
  transform: none !important;
  margin-right: 0 !important;
  flex-shrink: 0 !important;
  width: 22px !important;
  height: 22px !important;
  z-index: 10 !important;
}
.day-block.fmt22 .sec-card .j22-item .pin-btn:hover {
  transform: scale(1.08) !important;
}
.day-block.fmt22 .sec-card .j22-item.pinned .pin-btn {
  transform: none !important;
}
.day-block.fmt22 .sec-card .j22-section-items {
  padding-left: 0 !important;
}
/* Pinned item styling — no left rail */
.day-block.fmt22 .sec-card .j22-item.pinned {
  border-left: none !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
  background: rgba(154, 132, 86, 0.06) !important;
  border-radius: 4px !important;
  padding: 7px 6px !important;
}
.day-block.fmt22 .sec-card .j22-item.pinned .pin-btn svg {
  fill: none !important;
  stroke: none !important;
  filter: drop-shadow(0 1px 2px rgba(40,12,16,0.35)) !important;
}
.day-block.fmt22 .sec-card .j22-item.pinned .pin-btn .pin-head {
  fill: url(#wax-seal-grad) !important;
}
.day-block.fmt22 .sec-card .j22-item:not(.pinned) .pin-btn .pin-head {
  fill: url(#wax-seal-muted) !important;
}
/* === PROGRESS — clean rail + hover glass dock === */
.day-block.fmt22 .sec-card .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2) {
  flex-wrap: wrap !important;
  overflow: visible !important;
  position: relative !important;
}
.task-meta-row {
  /* Slightly inset, centered under the task name */
  flex: 0 0 auto !important;
  display: block !important;
  width: 86% !important;
  min-width: 0 !important;
  max-width: 86% !important;
  margin-top: 2px !important;
  margin-bottom: 1px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  min-height: 0;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  z-index: 2;
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: none !important;
  border-radius: 0;
  gap: 0 !important;
  overflow: visible !important;
}
.day-block.fmt22 .sec-card .j22-item.pinned > .task-meta-row {
  width: 86% !important;
  max-width: 86% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.task-meta-row::before { content: none !important; }
.j22-item:hover > .task-meta-row,
.task-meta-row:focus-within,
.task-meta-row.is-dock-open {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: none !important;
  z-index: 40;
}
.task-progress-wrap {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0;
  position: relative;
  isolation: isolate;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}
/* No colored empty track — only the sage fill is visible */
.task-progress-wrap::before { content: none !important; display: none !important; }
.task-progress-bar {
  display: block !important;
  flex: none !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0;
  height: 6px;
  position: relative;
  z-index: 1;
  overflow: visible;
  cursor: pointer;
  border-radius: 999px;
  box-sizing: border-box !important;
  /* Empty portion: fully transparent — no frosted rail, no tint */
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
.task-progress-bar::before { content: none !important; }
.task-progress-bar::after { content: none !important; }
.task-progress-bar:hover {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  transform: none;
}
/* Muted sage fill — this is the only colored part of the bar */
.task-progress-fill {
  height: 100%;
  border-radius: 999px;
  transition: width 0.28s cubic-bezier(.22,.8,.2,1);
  width: 0%;
  position: relative;
  z-index: 1;
  overflow: visible;
  background: #849a7f;
  box-shadow:
    inset 0 1px 0 rgba(230, 238, 225, 0.5),
    inset 0 -1px 0 rgba(50, 65, 48, 0.25),
    0 0 0 1px rgba(100, 120, 95, 0.18);
}
.task-progress-wrap.is-empty .task-progress-fill {
  width: 0% !important;
  opacity: 0 !important;
  box-shadow: none !important;
}
.task-progress-fill::before {
  content: '';
  position: absolute;
  left: 6%;
  right: 18%;
  top: 0;
  height: 45%;
  border-radius: 999px;
  background: rgba(232, 240, 228, 0.35);
  pointer-events: none;
  z-index: 2;
}
.task-progress-fill::after {
  content: '';
  position: absolute;
  right: -1px;
  top: 50%;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  transform: translateY(-50%);
  background:
    radial-gradient(circle at 32% 28%, rgba(245, 250, 240, 0.85) 0%, transparent 42%),
    #7a9074;
  box-shadow:
    0 0 0 1px rgba(250, 246, 236, 0.65),
    0 0 3px rgba(122, 140, 110, 0.28),
    inset 0 -1px 1px rgba(40, 55, 38, 0.2);
  pointer-events: none;
  z-index: 4;
}
.task-progress-wrap.is-empty .task-progress-fill::before,
.task-progress-wrap.is-empty .task-progress-fill::after { display: none; }
/* End verb at right end of bar — overlay only, never flex-shrinks the track */
.task-progress-endverb {
  position: absolute !important;
  right: 2px !important;
  top: 50% !important;
  left: auto !important;
  transform: translateY(-50%) !important;
  display: block !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 4px !important;
  text-align: right !important;
  z-index: 5 !important;
  pointer-events: none !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
  opacity: 1 !important;
  flex: none !important;
  flex-shrink: 0 !important;
  font-size: 10px !important;
  line-height: 1.2 !important;
  color: rgba(70, 85, 65, 0.95) !important;
  background: rgba(245, 240, 232, 0.82) !important;
  border-radius: 3px !important;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}
/* Hover glass dock — ONE control cluster below the rail (never on the fill) */
.task-progress-dock {
  position: absolute;
  left: 50%;
  top: calc(100% + 5px);
  transform: translateX(-50%) translateY(-3px);
  z-index: 20;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 3px;
  width: max-content;
  max-width: min(100%, 280px);
  padding: 4px 5px;
  margin: 0;
  box-sizing: border-box;
  border-radius: 12px;
  background:
    linear-gradient(165deg, rgba(255,255,255,0.72) 0%, rgba(255,252,245,0.42) 45%, rgba(255,248,235,0.28) 100%);
  border: 1px solid rgba(154, 132, 86, 0.28);
  box-shadow:
    0 8px 22px rgba(40, 30, 15, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.75);
  -webkit-backdrop-filter: blur(14px) saturate(1.08);
  backdrop-filter: blur(14px) saturate(1.08);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.15s ease, visibility 0.15s ease, transform 0.15s ease;
}
.j22-item:hover > .task-meta-row .task-progress-dock,
.task-meta-row:focus-within .task-progress-dock,
.task-meta-row.is-dock-open .task-progress-dock,
.task-progress-dock.is-active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.task-progress-dock-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  flex: 0 0 auto;
  min-height: 26px;
  padding: 3px 8px;
  margin: 0;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: rgba(70, 60, 45, 0.88);
  font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.01em;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  user-select: none;
  transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease;
}
.task-progress-dock-btn:hover,
.task-progress-dock-btn.is-armed,
.task-progress-dock-btn.running {
  background: rgba(255, 255, 255, 0.55);
  border-color: rgba(154, 132, 86, 0.28);
  color: rgba(55, 45, 30, 0.95);
}
.task-progress-dock-btn.is-armed {
  background: rgba(196, 168, 130, 0.28);
  border-color: rgba(154, 132, 86, 0.42);
}
.task-progress-dock-btn.running {
  color: #8a6e48;
}
.task-progress-dock-btn .task-dock-ico {
  display: inline-flex;
  width: 16px;
  height: 16px;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  line-height: 1;
  flex-shrink: 0;
}
.task-progress-dock-btn .task-dock-ico svg {
  width: 16px;
  height: 16px;
  display: block;
}
.task-progress-dock-btn .task-dock-txt {
  font-variant-numeric: tabular-nums;
}
.task-progress-dock-btn.task-progress-label {
  cursor: default;
  pointer-events: none;
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.03em;
  color: rgba(90, 70, 40, 0.9);
  background: rgba(255, 255, 255, 0.35);
  border-color: rgba(154, 132, 86, 0.16);
}
.task-progress-dock-sep {
  width: 1px;
  height: 14px;
  background: rgba(154, 132, 86, 0.22);
  flex: 0 0 auto;
  margin: 0 1px;
}
/* Legacy class hooks kept as dock chips — never absolute-on-bar */
.task-progress-label,
.task-progress-place-btn,
.task-timer,
.task-estimate {
  position: static !important;
  top: auto !important;
  right: auto !important;
  left: auto !important;
  transform: none !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  margin: 0 !important;
  z-index: auto !important;
}
.task-progress-place-btn {
  width: auto;
  height: auto;
  border-radius: 8px;
  font-size: 11px;
  line-height: 1;
  padding: 3px 8px;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
.task-timer-icon,
.task-estimate-icon {
  width: 16px;
  height: 16px;
  opacity: 0.75;
}
.task-timer.running .task-timer-icon {
  opacity: 1;
  color: #8a6e48;
}
.task-timer-display,
.task-estimate-display {
  font-family: 'DM Mono', monospace;
  font-size: 11px;
  color: #6b6560;
  letter-spacing: 0.03em;
}
.task-timer.running .task-timer-display {
  color: #8a6e48;
  font-weight: 500;
}
.task-estimate-display.has-value {
  color: #6b6560;
}
.task-progress-wrap.has-markers { padding-top: 0; }
.task-progress-wrap.has-markers::before { top: 50%; }
.task-progress-bar.is-placing { cursor: crosshair; overflow: visible; }
.task-progress-bar.is-placing::after {
  content: '' !important;
  position: absolute;
  left: var(--place-x, 50%);
  top: 50%;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  border: 1.5px solid rgba(255, 255, 255, 0.95);
  background: rgba(255, 255, 255, 0.25);
  transform: translate(-50%, -50%);
  z-index: 4;
  pointer-events: none;
  box-shadow: 0 0 0 3px rgba(196, 166, 90, 0.18);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}
.j22-item.has-progress > .j22-t::after { content: none !important; }
.task-progress-inline-prompt {
  position: absolute;
  left: 0;
  right: 0;
  top: -34px;
  z-index: 25;
  display: flex;
  gap: 4px;
  align-items: center;
  padding: 3px 4px;
  border-radius: 8px;
  background: rgba(255, 250, 240, 0.92);
  border: 1px solid rgba(154, 132, 86, 0.28);
  box-shadow: 0 6px 16px rgba(40, 30, 15, 0.12);
}
.task-progress-inline-prompt input {
  flex: 1;
  min-width: 0;
  border: none;
  background: transparent;
  font-family: 'Newsreader', Georgia, serif;
  font-style: italic;
  font-size: 12px;
  color: #2e2b26;
  outline: none;
  padding: 2px 4px;
}
.task-progress-inline-prompt button {
  border: none;
  background: rgba(154, 132, 86, 0.15);
  color: #6b5a3e;
  font-family: 'DM Mono', monospace;
  font-size: 9px;
  letter-spacing: 0.04em;
  padding: 3px 7px;
  border-radius: 6px;
  cursor: pointer;
}
.task-progress-marker {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 3;
  display: flex;
  flex-direction: row;
  align-items: center;
  pointer-events: auto;
}
.task-progress-marker-check {
  -webkit-appearance: none;
  appearance: none;
  width: 12px;
  height: 12px;
  margin: 0;
  flex-shrink: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  cursor: pointer;
  position: relative;
  z-index: 1;
  transition: transform 0.15s ease, opacity 0.15s ease;
}
.task-progress-marker-check::after {
  content: '✓';
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -52%);
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: 11px;
  font-weight: 600;
  line-height: 1;
  color: rgba(122, 140, 110, 0.4);
  text-shadow: 0 1px 0 rgba(255, 252, 245, 0.7);
  pointer-events: none;
}
.task-progress-marker-check:hover {
  transform: scale(1.12);
}
.task-progress-marker-check:hover::after {
  color: rgba(90, 110, 85, 0.75);
}
.task-progress-marker-check:checked {
  border: none;
  background: transparent;
  box-shadow: none;
}
.task-progress-marker-check:checked::after {
  content: '✓';
  width: auto;
  height: auto;
  border: none;
  transform: translate(-50%, -52%);
  color: #6f8568;
  text-shadow: 0 1px 0 rgba(255, 252, 245, 0.85);
}
.task-progress-marker-label {
  position: absolute;
  left: calc(100% + 8px);
  top: 50%;
  transform: translateY(-40%);
  font-family: 'Newsreader', Georgia, serif;
  font-style: italic;
  font-size: 12px;
  letter-spacing: 0.01em;
  color: rgba(46, 43, 38, 0.88);
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  padding: 5px 10px;
  border-radius: 8px;
  background: rgba(255, 250, 240, 0.22);
  border: 1px solid rgba(154, 132, 86, 0.22);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 6px 18px rgba(40, 30, 15, 0.08);
  transition: opacity 0.16s ease, visibility 0.16s ease, transform 0.16s ease;
}
.task-progress-marker-label::after {
  display: none;
}
.task-progress-marker:hover .task-progress-marker-label,
.task-progress-marker:focus-within .task-progress-marker-label {
  opacity: 1;
  visibility: visible;
  transform: translateY(-50%);
}
.task-progress-marker.done .task-progress-marker-label {
  color: rgba(46, 43, 38, 0.78);
  text-decoration: none;
}



#nav-sidebar details.nav-group > summary.nav-section { cursor:pointer; list-style:none; display:flex; align-items:center; justify-content:space-between; }
#nav-sidebar details.nav-group > summary.nav-section::-webkit-details-marker { display:none; }
#nav-sidebar details.nav-group > summary.nav-section::after { content:'\25B8'; font-size:9px; opacity:0.55; transition:transform 0.2s ease; }
#nav-sidebar details.nav-group[open] > summary.nav-section::after { transform:rotate(90deg); }



.day-block[data-date="2026-06-17"] .day-card { width:auto !important; max-width:none !important; margin:0 !important; }
.day-block[data-date="2026-06-17"] .flow-chart-card { display:block !important; max-width:none !important; width:auto !important; margin:0 !important; padding:26px 28px 28px; }
.day-block[data-date="2026-06-17"] .v5-prog { font-family:'DM Mono',monospace; font-size:9px; letter-spacing:0.12em; color:#a8893a; text-align:right; margin-bottom:18px; }
.day-block[data-date="2026-06-17"] .v5-hero { background:#FAF6EC; border-left:2px solid #7A8C6E; border-radius:0 9px 9px 0; padding:18px 20px; margin-bottom:30px; }
.day-block[data-date="2026-06-17"] .v5-hero-eye { font-family:'DM Mono',monospace; font-size:9px; letter-spacing:0.24em; text-transform:uppercase; color:#a8893a; margin-bottom:6px; }
.day-block[data-date="2026-06-17"] .v5-hero-row { display:flex; align-items:flex-start; gap:12px; }
.day-block[data-date="2026-06-17"] .v5-hero-task { font-family:'Newsreader',serif; font-weight:500; font-size:27px; color:#2A2A25; line-height:1.18; flex:1; outline:none; }
.day-block[data-date="2026-06-17"] .v5-hero .agenda-check { margin-top:8px; flex:0 0 auto; }
.day-block[data-date="2026-06-17"] .v5-hero.done .v5-hero-task { opacity:0.4; text-decoration:line-through; text-decoration-color:var(--sage); }
.day-block[data-date="2026-06-17"] .v5-lab { font-family:'DM Mono',monospace; font-size:8.5px; letter-spacing:0.26em; text-transform:uppercase; color:#a8893a; margin:0 0 14px; }
.day-block[data-date="2026-06-17"] .v5-mini { display:flex; align-items:baseline; gap:12px; padding:12px 0; }
.day-block[data-date="2026-06-17"] .v5-mini .agenda-check { flex:0 0 auto; align-self:center; }
.day-block[data-date="2026-06-17"] .v5-mini-t { font-family:'Newsreader',serif; font-size:19px; color:#2A2A25; flex:1; outline:none; }
.day-block[data-date="2026-06-17"] .v5-mini-time { font-family:'DM Mono',monospace; font-size:10px; letter-spacing:0.06em; color:#a8893a; flex:0 0 auto; }
.day-block[data-date="2026-06-17"] .v5-mini.done .v5-mini-t { opacity:0.4; text-decoration:line-through; text-decoration-color:var(--sage); }
.day-block[data-date="2026-06-17"] .v5-tiles { display:grid; grid-template-columns:repeat(auto-fit, minmax(240px,1fr)); gap:14px; margin-top:26px; }
.day-block[data-date="2026-06-17"] .v5-tile { background:#FAF6EC; border-radius:9px; padding:17px 17px 18px; }
.day-block[data-date="2026-06-17"] .v5-tile.done { opacity:0.5; }
.day-block[data-date="2026-06-17"] .v5-tile-top { display:flex; align-items:flex-start; gap:9px; }
.day-block[data-date="2026-06-17"] .v5-tile .agenda-check { margin-top:5px; flex:0 0 auto; }
.day-block[data-date="2026-06-17"] .v5-tile-t { font-family:'Newsreader',serif; font-size:19px; color:#2A2A25; line-height:1.1; flex:1; outline:none; }
.day-block[data-date="2026-06-17"] .v5-tile-m { font-family:'Newsreader',serif; font-style:italic; font-size:13px; color:#9b9082; margin:2px 0 0 22px; }
.day-block[data-date="2026-06-17"] .v5-tile-move { font-family:'DM Mono',monospace; font-size:9px; line-height:1.5; letter-spacing:0.02em; color:#5f7150; margin:10px 0 0 22px; }
.day-block[data-date="2026-06-17"] .v5-tile-move b { color:#7A8C6E; font-weight:400; }
@media (max-width:560px) {
  .day-block[data-date="2026-06-17"] .v5-tiles { grid-template-columns:1fr; }
  .day-block[data-date="2026-06-17"] .v5-hero-task { font-size:24px; }
}



.day-block.fmt22 .day-card { width:auto !important; max-width:none !important; margin:0 !important; background:rgba(255,255,255,0.03) !important; backdrop-filter:blur(16px) saturate(1.3) !important; -webkit-backdrop-filter:blur(16px) saturate(1.3) !important; border:1px solid rgba(255,255,255,0.1) !important; border-radius:10px !important; box-shadow:0 1px 8px rgba(0,0,0,0.03) !important; }
.day-block.fmt22 .day-tasks { padding:12px 0 26px !important; }
.day-block.fmt22 .flow-chart-card { display:block !important; width:auto !important; max-width:none !important; margin:0 !important; padding:20px 30px 26px; border:none !important; box-shadow:none !important; background:rgba(255,255,255,0.10) !important; backdrop-filter:blur(16px) saturate(1.3) !important; -webkit-backdrop-filter:blur(16px) saturate(1.3) !important; }
.day-block.fmt22.popped .flow-chart-card { background:rgba(255,255,255,0.10) !important; backdrop-filter:blur(16px) saturate(1.3) !important; -webkit-backdrop-filter:blur(16px) saturate(1.3) !important; }
.day-block.fmt22 .day-pop-x { display:none; }
.day-block.fmt22.popped .day-tasks { display:block !important; }
.day-block.fmt22.popped .day-card { position:fixed !important; opacity:1 !important; inset:0 !important; margin:0 !important; width:auto !important; max-width:none !important; min-height:100vh !important; background:#E7E0D2 url('data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww%2Ew3%2Eorg%2F2000%2Fsvg%27%20width%3D%271400%27%20height%3D%271400%27%3E%3Cfilter%20id%3D%27s%27%3E%3CfeTurbulence%20type%3D%27fractalNoise%27%20baseFrequency%3D%270%2E026%200%2E03%27%20numOctaves%3D%275%27%20seed%3D%2714%27%20result%3D%27n%27%2F%3E%3CfeDiffuseLighting%20in%3D%27n%27%20lighting%2Dcolor%3D%27%23ECE5D6%27%20surfaceScale%3D%272%2E6%27%20diffuseConstant%3D%271%2E05%27%3E%3CfeDistantLight%20azimuth%3D%27228%27%20elevation%3D%2756%27%2F%3E%3C%2FfeDiffuseLighting%3E%3C%2Ffilter%3E%3Crect%20width%3D%271400%27%20height%3D%271400%27%20fill%3D%27%23E7E0D2%27%2F%3E%3Crect%20width%3D%271400%27%20height%3D%271400%27%20filter%3D%27url%28%23s%29%27%2F%3E%3C%2Fsvg%3E') center/cover !important; background-attachment:scroll !important; z-index:9999 !important; overflow-y:auto !important; border:none !important; border-radius:0 !important; padding:54px 6vw 70px !important; box-shadow:none !important; }
.day-block.fmt22.popped .day-pop-x { display:flex; position:fixed; top:20px; right:24px; z-index:10000; width:36px; height:36px; align-items:center; justify-content:center; font-family:"DM Mono",monospace; font-size:22px; line-height:1; color:#5e5340; cursor:pointer; border:1.5px solid rgba(150,124,78,0.5); border-radius:50%; background:rgba(255,255,255,0.35); }
.day-block.fmt22 .flow-title { color:#F1EFE8 !important; -webkit-text-fill-color:#F1EFE8 !important; font-family:"Gilda Display",serif !important; font-size:24px !important; text-transform:none !important; letter-spacing:0.01em !important; margin:0 0 24px !important; text-shadow:none !important; }
@keyframes flowShimmer { 0% { background-position:200% 0; } 100% { background-position:-200% 0; } }
.day-block.fmt22 .flow-chart-card .flow-title::after { content:none !important; }
.day-block.fmt22 .j22-group { font-family: inherit; font-size: 11px; letter-spacing: 0.18em; text-transform: none !important; color: var(--dark, #2A2A25); margin: 0 0 6px; padding: 0; font-weight: 500; opacity: 0.85; }


.day-block.fmt22 .j22-group:first-of-type { margin-top:6px !important; }
.day-block.fmt22 .j22-item { display:flex; align-items:baseline; width:auto; min-height:0; background:transparent; border:none; border-radius:0; padding:2px 0; margin:0; cursor:default; }
.day-block.fmt22 .j22-section-items { border-left:1px solid rgba(150,124,78,0.32); padding-left:24px; }
.day-block.fmt22 .agenda-check { display:none !important; }
.day-block.fmt22 .j22-cols { display:grid; grid-template-columns:max-content max-content; column-gap:44px; row-gap:12px; }
.day-block.fmt22 .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2):not(:first-child) { margin-top:13px; }
.day-block.fmt22 .j22-cols .j22-item { width:auto; min-width:0; }

.day-block.fmt22 .j22-cols .j22-item { break-inside:avoid; }
.day-block.fmt22 .j22-item .agenda-check { display:none; }
.day-block.fmt22 .j22-t a { color:inherit; text-decoration:underline; text-decoration-color:rgba(154,132,86,0.55); text-underline-offset:2px; }
.day-block.fmt22 .j22-t { font-family:'Newsreader',serif; font-size:21px; color:#2A2A25; line-height:1.5; }
.day-block.fmt22 .j22-loc { display:block; font-style:italic; font-size:15px; color:#a8706a; margin-top:2px; }
.day-block.fmt22 .j22-pin { width:10px; height:10px; vertical-align:-1px; margin-right:4px; }
.day-block.fmt22 .j22-sub { padding-left:22px; margin:0; width:auto; }
.day-block.fmt22 .j22-sub.fn-top { border-top:1px solid rgba(90,72,40,0.32); margin-top:9px; padding-top:10px; }
.day-block.fmt22 .j22-sub2 { padding-left:40px; margin:0; width:auto; }
.day-block.fmt22 .day-date { font-family:"Cinzel",serif !important; letter-spacing:0.12em !important; }
.day-block.fmt22 .j22-section { display:flex; align-items:flex-start; gap:8px; margin:0 0 32px 0 !important; }
.day-block.fmt22 .j22-section > .j22-group { flex:0 0 130px; margin:0 !important; padding:3px 0 0 10px; text-align:left; }
.day-block.fmt22 .j22-section-items { flex:0 1 auto; min-width:0; }
.day-block.fmt22 .j22-toggle { align-self:center; cursor:pointer; color:#9a8456; font-size:14px; line-height:1; padding:0 4px; margin-left:2px; opacity:0.7; transition:opacity .15s ease, transform .2s ease; }
.day-block.fmt22 .j22-item:hover .j22-toggle { opacity:1; }
.day-block.fmt22 .j22-collapsed .j22-toggle { transform:rotate(-90deg); }
.day-block.fmt22 .j22-ghead { display:flex; align-items:center; cursor:pointer; }
.day-block.fmt22 .j22-gtoggle { margin-left:8px; color:#9a8456; font-size:13px; line-height:1; opacity:0.7; padding:0 2px; transition:opacity .15s ease, transform .2s ease; }
.day-block.fmt22 .j22-ghead:hover .j22-gtoggle { opacity:1; }
.day-block.fmt22 .j22-gcollapsed .j22-gtoggle { transform:rotate(-90deg); }
.day-block.fmt22 .j22-sub .j22-t, .day-block.fmt22 .j22-sub2 .j22-t { color:#4a4334; font-size:18px; padding-left:17px; text-indent:-17px; }
.day-block.fmt22 .j22-section-items.auto-cols { display:grid; grid-template-columns:max-content max-content; column-gap:44px; row-gap:13px; align-items:start; }
.day-block.fmt22 .j22-section-items.auto-cols > .j22-item { margin-top:0 !important; }
.day-block.fmt22 .fn-num, .day-block.fmt22 .fn-cite { display:none !important; }
.day-block.fmt22 .j22-sub.fn-top { border-top:none !important; padding-top:0 !important; }
.day-block.fmt22 .j22-sub .j22-t, .day-block.fmt22 .j22-sub2 .j22-t { padding-left:0 !important; text-indent:0 !important; }
.day-block.fmt22 .j22-group { display:none !important; }
.day-block.fmt22 .j22-section { display:block !important; margin:0 0 22px 0 !important; }
.day-block.fmt22 .j22-section-items { border-left:none !important; padding-left:0 !important; }
.day-block.fmt22 .verb-prefix { font-family:"Newsreader",serif; font-size:21px; color:#2A2A25; line-height:1.5; margin-right:0 !important; white-space:pre; }
.day-block.fmt22 .day-card-header { padding-left:0 !important; }
.day-block.fmt22 .agenda-check::before { content:none !important; }
.day-block.fmt22 .j22-item:not(.j22-sub):not(.j22-sub2) > .agenda-check { display:inline-block !important; -webkit-appearance:none !important; appearance:none !important; width:15px; height:16px; border:none !important; background:transparent !important; position:relative; cursor:pointer; flex-shrink:0; margin-right:9px; align-self:flex-start; margin-top:2px; }
.day-block.fmt22 .j22-item:not(.j22-sub):not(.j22-sub2) > .agenda-check::after { content:"\2713"; position:absolute; left:-1px; top:4px; font-family:"Newsreader",serif; font-style:italic; font-weight:300; font-size:23px; line-height:1; color:#9a8456; opacity:1; transform:skewX(-10deg); }
.day-block.fmt22 .j22-item:not(.j22-sub):not(.j22-sub2) > .agenda-check:checked::after { color:#9a8456; opacity:1; }
.day-block.fmt22 .j22-item:not(.j22-sub):not(.j22-sub2) > .agenda-check:checked + .j22-t { opacity:0.5; }
.day-block.fmt22 .j22-t.editing { outline:1px dashed rgba(94,90,91,0.55); outline-offset:3px; background:rgba(255,255,255,0.22); border-radius:3px; cursor:text; min-width:30px; }
.day-block.fmt22 .j22-section-items, .day-block.fmt22 .j22-item { position:relative; }
.day-block.fmt22 .j22-section { position:relative; }
.day-block.fmt22 .del-x, .day-block.fmt22 .del-x-sec { position:absolute; top:-1px; right:2px; opacity:0; cursor:pointer; color:#a8706a; font-family:Arial,sans-serif; font-size:15px; line-height:1; padding:1px 5px; transition:opacity .12s; z-index:6; }
.day-block.fmt22 .j22-item:hover > .del-x { opacity:0.55; }
.day-block.fmt22 .j22-section:hover:not(:has(.j22-item:hover)) > .del-x-sec { opacity:0.55; }
.day-block.fmt22 .del-x:hover, .day-block.fmt22 .del-x-sec:hover { opacity:1; }
.day-block.fmt22 .j22-sub.fn-pair { display:inline-block; margin-right:12px; vertical-align:top; }
.day-block.fmt22 .j22-sub.fn-pair.fn-top { border-top:none; padding-top:0; margin-top:0; }
.day-block.fmt22 .fn-num { font-family:"DM Mono",monospace; font-size:10px; color:#9a7b3f; vertical-align:5px; margin-right:0; display:inline-block; width:17px; text-align:left; letter-spacing:0.04em; }
.day-block.fmt22 .fn-cite { font-family:"DM Mono",monospace; font-size:9px; color:#9a7b3f; vertical-align:6px; margin-left:5px; letter-spacing:0.08em; }
.day-block.fmt22 .j22-item.done .j22-t { opacity:0.4; text-decoration:line-through; text-decoration-color:var(--sage); }
.j22-delay-btn { display:block; margin:30px auto 20px; padding:7px 18px; background:transparent; border:1px dashed rgba(154,132,86,0.55); border-radius:18px; font-family:'DM Mono',monospace; font-size:10px; letter-spacing:0.1em; text-transform:lowercase; color:#9a8456; cursor:pointer; opacity:0.9; transition:background .15s, opacity .15s; }
.j22-delay-btn:hover { opacity:1; background:rgba(154,132,86,0.1); }
.j22-actions { display:flex; justify-content:center; align-items:center; gap:10px; margin:30px 0 20px; }
.j22-actions .j22-delay-btn { margin:0 !important; }
.j22-add-btn { display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; padding:0; background:rgba(255,255,255,0.15); border:1.5px dashed rgba(120,100,60,0.7); border-radius:50%; font-family:"DM Mono",monospace; font-size:18px; line-height:1; color:#6b5a30; cursor:pointer; transition:background .15s, transform .15s; backdrop-filter:blur(4px); }
.j22-add-btn:hover { background:rgba(120,100,60,0.18); transform:scale(1.08); }
.add-field { margin:11px 0; }
.add-field input { width:100%; box-sizing:border-box; padding:9px 11px; font-family:"Newsreader",serif; font-size:16px; border:1px solid rgba(150,124,78,0.45); border-radius:4px; background:rgba(255,255,255,0.45); color:#2A2A25; }
.rolled-head { font-family:'DM Mono',monospace; font-size:9px; letter-spacing:0.16em; text-transform:uppercase; color:#b3a079; padding:16px 0 6px 4px; }
.day-block.fmt22 .rolled-marker { display:none !important; }
.rolled-task { font-family:'Newsreader',serif; font-size:18px; color:#2A2A25; line-height:1.35; padding:4px 2px 4px 16px; }
.rolled-task.rolled-sub { padding-left:46px; color:#5f584c; }
.rolled-task.rolled-sub2 { padding-left:74px; color:#5f584c; }



  .priority-toggle {
    position: fixed;
    top: 16px;
    right: 16px;
    z-index: 100;
    width: 44px;
    height: 32px;
    background: var(--cream);
    border: 1px solid var(--sage);
    border-radius: 6px;
    color: var(--sage);
    font-family: 'DM Mono', monospace;
    font-size: 11px;
    letter-spacing: 0.05em;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .priority-toggle:hover { background: var(--sage); color: var(--cream); }
  
  .priority-overlay {
    position: fixed;
    top: 56px;
    right: 16px;
    z-index: 99;
    width: 280px;
    max-height: 70vh;
    overflow-y: auto;
    background: var(--cream);
    border: 1px solid var(--sage);
    border-radius: 8px;
    padding: 14px 16px 16px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.12);
    transform-origin: top right;
    transition: transform 0.18s ease, opacity 0.18s ease;
  }
  .priority-overlay.hidden { transform: scale(0.92); opacity: 0; pointer-events: none; }
  .priority-overlay h4 {
    font-family: 'DM Mono', monospace;
    font-size: 9px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--sage);
    margin: 0 0 12px;
    text-align: center;
  }
  .priority-overlay .priority-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 0;
    border-bottom: 1px dashed rgba(138,158,133,0.2);
  }
  .priority-overlay .priority-item:last-child { border-bottom: none; }
  .priority-overlay .priority-num {
    font-family: 'DM Mono', monospace;
    font-size: 10px;
    color: var(--sage);
    opacity: 0.6;
    min-width: 14px;
  }
  .priority-overlay .priority-name {
    font-family: 'Reenie Beanie', cursive;
    font-size: 18px;
    color: var(--dark);
    flex: 1 1 auto;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
  }
  .priority-overlay .priority-name.done { opacity: 0.4; text-decoration: line-through; }
  .priority-overlay .priority-date {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 9px;
    color: #8a6d1f;
    opacity: 0.85;
    flex-shrink: 0;
  }
  .priority-overlay .priority-time {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 11px;
    color: #8a6d1f;
    margin-left: 4px;
  }
  .priority-overlay .priority-cb {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 1.5px solid var(--sage);
    background: white;
    cursor: pointer;
    flex-shrink: 0;
    position: relative;
  }
  .priority-overlay .priority-cb.checked::after {
    content: "✓";
    position: absolute;
    top: -8px;
    left: -1px;
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-weight: 300;
    font-size: 24px;
    color: var(--sage);
    line-height: 1;
    transform: skewX(-10deg);
  }
  



  #sync-state-btn {
    position: fixed;
    bottom: 44px;
    right: 14px;
    z-index: 99999;
    padding: 6px 10px;
    background: rgba(196,168,130,0.85);
    color: #fdfaf3;
    border: none;
    border-radius: 3px;
    font-family: 'DM Mono', monospace;
    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    cursor: pointer;
    box-shadow: 0 1px 4px rgba(0,0,0,0.12);
    user-select: none;
    opacity: 0.7;
    transition: opacity 0.2s;
  }
  #sync-state-btn:hover { opacity: 1; }
  #save-github-btn {
    position: fixed;
    bottom: 14px;
    right: 14px;
    z-index: 99999;
    padding: 6px 10px;
    background: rgba(90,110,80,0.9);
    color: #fdfaf3;
    border: none;
    border-radius: 3px;
    font-family: 'DM Mono', monospace;
    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    cursor: pointer;
    box-shadow: 0 1px 4px rgba(0,0,0,0.12);
    user-select: none;
    opacity: 0.85;
    transition: opacity 0.2s;
  }
  #save-github-btn:hover { opacity: 1; }
  #save-github-btn:disabled { opacity: 0.5; cursor: default; }


/* from #ver-toggle */
.day-block.fmt22 .verb-prefix{display:none !important;}

/* from #check-mauve-sub */

/* main checkmarks: gold -> mauve */
.day-block.fmt22 .j22-item:not(.j22-sub):not(.j22-sub2) > .agenda-check::after { color:#ffffff !important; }
.day-block.fmt22 .j22-item:not(.j22-sub):not(.j22-sub2) > .agenda-check:checked::after { color:#ffffff !important; }
/* subtask checkmarks: smaller, mauve */
.day-block.fmt22 .j22-item.j22-sub > .agenda-check,
.day-block.fmt22 .j22-item.j22-sub2 > .agenda-check {
  display:inline-block !important; -webkit-appearance:none !important; appearance:none !important;
  width:12px; height:13px; border:none !important; background:transparent !important;
  position:relative; cursor:pointer; flex-shrink:0; margin-right:7px; align-self:flex-start; margin-top:2px;
}
.day-block.fmt22 .j22-item.j22-sub > .agenda-check::before,
.day-block.fmt22 .j22-item.j22-sub2 > .agenda-check::before { content:none !important; }
.day-block.fmt22 .j22-item.j22-sub > .agenda-check::after,
.day-block.fmt22 .j22-item.j22-sub2 > .agenda-check::after {
  content:"\2713" !important; position:absolute; left:-1px; top:2px; display:block !important;
  font-family:"Newsreader",serif; font-style:italic; font-weight:300; font-size:17px; line-height:1;
  color:#ffffff; opacity:1; transform:skewX(-10deg);
}
.day-block.fmt22 .j22-item.j22-sub > .agenda-check:checked + .j22-t,
.day-block.fmt22 .j22-item.j22-sub2 > .agenda-check:checked + .j22-t { opacity:0.5; }


/* from #j22-sections */

.day-block.fmt22.sections-on .j22-group {
  display:block !important; text-align:center !important;
  font-family:"Newsreader",serif; font-style:italic; font-weight:400;
  font-size:19px; letter-spacing:0.02em; color:#6f5f54;
  margin:0 0 11px 0 !important; padding:0 !important;
}
.day-block.fmt22.sections-on .j22-section { margin-bottom:26px !important; }


/* from #j22-cards */

.day-block.fmt22 .sec-grid{ columns:2; column-gap:16px; max-width:none; margin:16px 0 0; }
.day-block.fmt22 .j22-section.sec-card{ margin:0 0 16px 0 !important; background:rgba(245,240,233,0.10) !important; backdrop-filter:blur(18px) saturate(1.35) !important; -webkit-backdrop-filter:blur(18px) saturate(1.35) !important; border-radius:6px; overflow:visible !important; box-shadow:0 2px 12px rgba(0,0,0,0.04); break-inside:avoid; display:inline-block; width:100%; border:1px solid rgba(255,255,255,0.22) !important; }
.day-block.fmt22 .j22-section.sec-card .card-visual{ overflow:hidden; border-radius:6px 6px 0 0; }
.day-block.fmt22 .sec-card:nth-child(2) .card-visual{ height:130px; }
.day-block.fmt22 .sec-card:nth-child(4) .card-visual{ height:75px; }
.day-block.fmt22 .sec-card:nth-child(5) .card-visual{ height:105px; }
.day-block.fmt22 .sec-card:nth-child(7) .card-visual{ height:80px; }
.day-block.fmt22 .sec-card .card-visual{ height:95px; }
.day-block.fmt22 .sec-card .card-body{ padding:10px 10px 12px; border-top:none; }
.day-block.fmt22 .sec-card .j22-group{ display:block !important; text-align:center !important; margin:0 0 9px !important; font-family:"Newsreader",serif; font-style:italic; font-weight:400; font-size:20px; color:#3a3327; }
.day-block.fmt22 .sec-card .j22-section-items{ border-left:none !important; padding-left:0 !important; }
.day-block.fmt22 .sec-card[data-theme="blush"] .agenda-check::after{ color:#bf8f93 !important; }
.day-block.fmt22 .sec-card[data-theme="warm"] .agenda-check::after{ color:#c4a882 !important; }
.day-block.fmt22 .sec-card[data-theme="lavender"] .agenda-check::after{ color:#9b8ec4 !important; }
.day-block.fmt22 .sec-card[data-theme="amber"] .agenda-check::after{ color:#c4a882 !important; }
.day-block.fmt22 .sec-card[data-theme="sage"] .agenda-check::after{ color:#8a9e85 !important; }


/* from #slate-checks */

/* all item checkmarks -> slate grey */
.day-block.fmt22 .sec-card .j22-item:not(.j22-sub):not(.j22-sub2) > .agenda-check::after,
.day-block.fmt22 .sec-card .j22-item.j22-sub > .agenda-check::after,
.day-block.fmt22 .sec-card .j22-item.j22-sub2 > .agenda-check::after,
.day-block.fmt22 .sec-card[data-theme] .agenda-check::after{ color:#6f757c !important; }
/* card done-check: matte, slate, check only when checked */
.day-block.fmt22 .sec-card .done-check{ background:rgba(247,244,237,0.5) !important; border-color:#9a9690 !important; box-shadow:none !important; }
.day-block.fmt22 .sec-card .done-check .checkmark{ opacity:0; transition:opacity .15s; }
.day-block.fmt22 .sec-card .done-check.checked{ background:rgba(214,214,206,0.55) !important; border-color:#6f757c !important; }
.day-block.fmt22 .sec-card .done-check.checked .checkmark{ opacity:1; }
.day-block.fmt22 .sec-card .done-check .checkmark polyline{ stroke:#6f757c !important; }


/* from #sub-numbers */

.day-block.fmt22 .sec-card .j22-item:not(.j22-sub):not(.j22-sub2){ counter-reset: subn; }
.day-block.fmt22 .sec-card .j22-item.j22-sub,
.day-block.fmt22 .sec-card .j22-item.j22-sub2{ counter-increment: subn; }
.day-block.fmt22 .sec-card .j22-item.j22-sub > .agenda-check::after,
.day-block.fmt22 .sec-card .j22-item.j22-sub2 > .agenda-check::after{
  content: counter(subn) "." !important;
  font-family:"Newsreader",serif !important; font-style:normal !important; font-weight:500 !important;
  font-size:15px !important; color:#6f757c !important; transform:none !important;
  left:0 !important; top:1px !important; line-height:1 !important; display:block !important;
}


/* from #freeform-canvas */

/* Keep square tile flex-wrap (CSS columns was dropping task-cards lower) */
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-grid.freeform{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:flex-start !important;
  align-content:flex-start !important;
  position:relative !important;
  max-width:none !important;
  margin:16px 12px 0 !important;
  overflow:visible;
  columns:auto !important;
  column-count:auto !important;
  gap:10px !important;
}
.day-block.fmt22 .sec-grid.freeform > .sec-card{
  position:relative !important;
  display:flex !important;
  width:148px !important;
  height:148px !important;
  max-width:148px !important;
  max-height:148px !important;
  flex:0 0 148px !important;
  break-inside:avoid !important;
  margin:0 !important;
  align-self:flex-start !important;
  vertical-align:top !important;
  box-sizing:border-box !important;
}
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-grid.freeform > .sec-card.has-tasks:not(.card-collapsed):not(.card-sized){
  width:var(--vb-size, 210px) !important;
  height:var(--vb-size, 210px) !important;
  max-width:var(--vb-size, 210px) !important;
  max-height:var(--vb-size, 210px) !important;
  min-width:var(--vb-size, 210px) !important;
  min-height:var(--vb-size, 210px) !important;
  flex:0 0 var(--vb-size, 210px) !important;
  aspect-ratio:1 / 1 !important;
}
.day-block.fmt22 .sec-grid.freeform .card-visual{ cursor:grab; touch-action:none; }
.day-block.fmt22 .sec-grid.freeform .card-visual:active{ cursor:grabbing; }
.day-block.fmt22 .sec-grid .sec-card.sortable-ghost{ opacity:0.4; }
.day-block.fmt22 .sec-grid .sec-card.sortable-drag{ opacity:0.9; box-shadow:0 8px 24px rgba(0,0,0,0.15); }


/* from #batch-changes */

/* remove card done-checks for now */
.day-block.fmt22 .sec-card .done-check{ display:flex !important; }
/* thinner main checkmark (hairline svg) */
.day-block.fmt22 .sec-card .j22-item:not(.j22-sub):not(.j22-sub2) > .agenda-check::after{
  content:"" !important;
  background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%236f757c'%20stroke-width='1.2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M4%2013l5%205L20%205'/%3E%3C/svg%3E") !important;
  background-repeat:no-repeat !important; background-position:center !important; background-size:contain !important;
  width:15px !important; height:15px !important; top:3px !important; left:-1px !important; transform:none !important;
}
/* shorter topbar header */
.day-card-overlay{ top:6px !important; }
.day-card-overlay .dco-bismillah{ font-size:16px !important; filter:drop-shadow(0 1px 3px rgba(0,0,0,0.45)) !important; }
.day-card-overlay .dco-allah{ font-size:11px !important; }
.day-card-overlay .dco-shaitan{ font-size:10px !important; }
/* card collapse */
.day-block.fmt22 .sec-card.card-collapsed .card-body{ display:none !important; }
/* accordion broad sections */
.day-block.fmt22 .flow-chart-card .acc-head{ cursor:pointer; }
.day-block.fmt22 .flow-chart-card .acc-head:not(.acc-active){ opacity:0.4; }
.day-block.fmt22 .flow-chart-card .flow-body.acc-body{ min-height:120px; }


/* from #acc-tabs */

.day-block.fmt22 .flow-chart-card{ position:relative; box-sizing:border-box; }
.day-block.fmt22 .flow-chart-card .acc-head{ cursor:pointer; transition:opacity .2s, background .2s; }
/* inactive tabs - inline pills in a row */
.day-block.fmt22 .flow-chart-card .acc-head:not(.acc-active){
  position:relative !important; top:auto !important; right:auto !important; bottom:auto !important; left:auto !important;
  width:auto !important; margin:0 !important; padding:0 !important;
  writing-mode:horizontal-tb; text-orientation:initial;
  display:inline-flex !important; align-items:center; justify-content:center;
  background:transparent; border-radius:0;
  color:#6f5f54 !important; -webkit-text-fill-color:#6f5f54 !important;
  font-size:17px !important; opacity:0.78; letter-spacing:0.1em;
}
.day-block.fmt22 .flow-chart-card .acc-head:not(.acc-active):hover{ opacity:1; }


/* from #undo-hairline */

.day-block.fmt22 .sec-card .j22-item:not(.j22-sub):not(.j22-sub2) > .agenda-check::after{
  content:"\2713" !important; background-image:none !important;
  font-family:"Newsreader",serif !important; font-style:italic !important; font-weight:300 !important;
  font-size:23px !important; width:auto !important; height:auto !important; top:4px !important; left:-1px !important;
  transform:skewX(-10deg) scaleY(1.4) !important; transform-origin:center bottom !important; color:#6f757c !important;
}


/* from #acc-fix */

.day-block.fmt22 .flow-chart-card .sec-grid.acc-hidden,
.day-block.fmt22 .flow-chart-card .flow-body.acc-hidden{ display:none !important; }
.day-block.fmt22 .flow-chart-card .flow-body{ min-height:340px; }


/* from #tweaks2 */

/* keep Cormorant glyph, just lighter */
.day-block.fmt22 .sec-card .j22-item:not(.j22-sub):not(.j22-sub2) > .agenda-check::after{ font-weight:300 !important; opacity:0.62 !important; }
/* icon area 55px tall (and shrink icon to fit) */
.day-block.fmt22 .sec-card .card-visual{ height:55px !important; }
.day-block.fmt22 .sec-card .card-visual svg:not(.checkmark){ width:55px !important; height:55px !important; }
/* task item font inside pursuit cards - cleaner, more refined */
.day-block.fmt22 .sec-card .j22-t{
  font-family:'Newsreader',serif !important; font-size:16px !important;
  font-weight:400 !important; font-style:italic !important;
  color:#3a3327 !important; line-height:1.45 !important; letter-spacing:0.01em;
}
.day-block.fmt22 .sec-card .j22-sub .j22-t,
.day-block.fmt22 .sec-card .j22-sub2 .j22-t{
  font-size:14px !important; opacity:0.75;
}
/* toggle bar: all acc-heads sit in a horizontal row at the top */
.day-block.fmt22 .flow-chart-card .acc-toggle-bar{
  display:flex !important; align-items:center; gap:6px; margin:0 0 14px 0; padding:0;
}
.day-block.fmt22 .flow-chart-card .acc-toggle-bar .acc-head{
  position:relative !important; top:auto !important; right:auto !important; bottom:auto !important; left:auto !important;
  width:auto !important; height:auto !important; padding:6px 16px !important; margin:0 !important;
  writing-mode:horizontal-tb !important; text-orientation:initial !important;
  border-radius:16px !important;
  font-family:'Jost',sans-serif !important; font-size:12px !important; letter-spacing:0.08em !important;
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  color:#6f5f54 !important; -webkit-text-fill-color:#6f5f54 !important;
  text-transform:lowercase !important; cursor:pointer;
}
.day-block.fmt22 .flow-chart-card .acc-toggle-bar .acc-head.acc-active{
  background:rgba(110,100,86,0.22) !important; opacity:1 !important; font-weight:500 !important;
}
.day-block.fmt22 .flow-chart-card .acc-toggle-bar .acc-head:not(.acc-active){
  background:rgba(110,100,86,0.08) !important; opacity:0.7 !important;
}
.day-block.fmt22 .flow-chart-card .acc-toggle-bar .acc-head:not(.acc-active):hover{
  opacity:1 !important; background:rgba(110,100,86,0.18) !important;
}


/* from #width720 */

.day-block.fmt22 .flow-chart-card{ width:100% !important; max-width:none !important; margin-left:0 !important; margin-right:0 !important; padding-left:18px !important; padding-right:18px !important; box-sizing:border-box !important; }
.day-block.fmt22 .flow-chart-card .sec-grid{ width:100% !important; max-width:none !important; margin:16px 0 0 !important; }


/* from #flow240 */
.day-block.fmt22 .flow-chart-card .flow-body.acc-body{ min-height:520px !important; }

/* from #actions-fix */
.day-block.fmt22 .flow-chart-card.flow-collapsed > .j22-actions{ display:flex !important; } .day-block.fmt22 .flow-chart-card.flow-collapsed > .acc-body:not(.acc-hidden){ display:block !important; } .day-block.fmt22 .sec-grid.freeform.acc-hidden{ display:none !important; }

/* from #add-grid-css */

.day-block.fmt22 .flow-chart-card .add-grid{ position:relative; top:auto; left:auto; z-index:6;
  padding:5px 14px; background:rgba(110,100,86,0.08); border:none; border-radius:16px;
  color:#6f5f54; font-family:'Jost',sans-serif; font-size:12px; letter-spacing:0.05em; cursor:pointer; margin-left:auto; }
.day-block.fmt22 .flow-chart-card .add-grid:hover{ background:rgba(110,100,86,0.27); }
.day-block.fmt22 .acc-toggle-bar .add-grid{ display:none !important; }
.day-block.fmt22 .add-board-row{
  display:flex; justify-content:center; align-items:center; gap:8px;
  margin:2px auto 10px; position:relative; z-index:12; width:100%;
}
.day-block.fmt22 .add-board-row .add-grid,
.day-block.fmt22 .add-board-row .add-card-btn,
.day-block.fmt22 .add-board-row .add-task-day-btn{
  margin:0; padding:6px 16px; border:none; border-radius:16px;
  background:rgba(255,250,240,0.86); color:#41373a;
  font-family:'Jost',sans-serif; font-size:12px; letter-spacing:0.05em; cursor:pointer;
  box-shadow:0 1px 8px rgba(20,12,6,0.12);
}
.day-block.fmt22 .add-board-row .add-grid:hover,
.day-block.fmt22 .add-board-row .add-card-btn:hover,
.day-block.fmt22 .add-board-row .add-task-day-btn:hover{
  background:#fffaf2;
}
html body.agenda-copy-page .agenda-dump{
  width:min(520px,92%);
  margin:0 auto 18px;
  padding:12px 14px 12px;
  background:rgba(255,250,240,0.9);
  border:1px solid rgba(255,255,255,0.35);
  border-radius:14px;
  box-shadow:0 8px 24px rgba(20,12,6,0.14);
  position:relative;
  z-index:2;
  flex:0 0 auto;
}
html body.agenda-copy-page .agenda-dump-label{
  margin:0 0 8px;
  font-family:"DM Mono",monospace;
  font-size:9px;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:#6f5f54;
}
html body.agenda-copy-page .agenda-dump-input{
  display:block;
  width:100%;
  min-height:72px;
  resize:vertical;
  box-sizing:border-box;
  padding:8px 10px;
  border:1px solid rgba(110,100,86,0.35);
  border-radius:10px;
  background:#fffaf2;
  color:#41373a;
  font-family:"Newsreader",Georgia,serif;
  font-size:15px;
  line-height:1.4;
  outline:none;
}
html body.agenda-copy-page .agenda-dump-row{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:8px;
}
html body.agenda-copy-page .agenda-dump-go{
  border:none;
  border-radius:16px;
  padding:6px 14px;
  background:#41373a;
  color:#fffaf2;
  font-family:"Jost",sans-serif;
  font-size:12px;
  letter-spacing:0.04em;
  cursor:pointer;
}
html body.agenda-copy-page .agenda-dump-go:hover{ background:#2c2420; }
html body.agenda-copy-page .agenda-dump-status{
  font-family:"DM Mono",monospace;
  font-size:9px;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:#6f5f54;
}
.day-block.fmt22 .flow-chart-card .add-grid-input{ position:absolute; top:12px; left:12px; z-index:30; padding:6px 13px; border:1px solid rgba(110,100,86,0.45); border-radius:16px; background:#faf6ee; font-family:'Jost',sans-serif; font-size:12px; letter-spacing:0.04em; color:#41373a; width:160px; outline:none; }
.day-block.fmt22 .sec-picker,
.day-block.fmt22.today-block .sec-picker{
  position:relative; z-index:40; margin:8px auto 4px; padding:10px 12px; width:min(320px,92%);
  background:#faf6ee; border:1px solid rgba(110,100,86,0.28); border-radius:14px;
  box-shadow:0 8px 24px rgba(40,35,28,0.12); font-family:'Jost',sans-serif;
}
.day-block.fmt22 .sec-picker-label{
  margin:0 0 8px; font-family:'DM Mono',monospace; font-size:9px; letter-spacing:0.14em;
  text-transform:uppercase; color:#6f5f54; opacity:0.85;
}
.day-block.fmt22 .sec-picker-group{
  margin:10px 0 4px; padding:0; border:none; background:none;
  font-family:'DM Mono',monospace; font-size:9px; letter-spacing:0.14em;
  text-transform:uppercase; color:#6f5f54; opacity:0.85;
}
.day-block.fmt22 .sec-picker-list .sec-picker-group:first-child{ margin-top:0; }
.day-block.fmt22 .sec-picker-list,
.day-block.fmt22.today-block .sec-picker-list{
  display:flex; flex-direction:column; align-items:stretch; gap:4px;
  max-height:280px; overflow:auto; margin:0 0 10px;
}
.day-block.fmt22 .sec-picker-opt,
.day-block.fmt22.today-block .sec-picker-opt{
  display:block; width:100%; text-align:left;
  padding:7px 12px; border:1px solid rgba(110,100,86,0.22); border-radius:10px;
  background:#fffaf2; color:#41373a; font-size:12px; letter-spacing:0.03em; cursor:pointer;
}
.day-block.fmt22 .sec-picker-opt:hover,
.day-block.fmt22.today-block .sec-picker-opt:hover{ background:rgba(110,100,86,0.14); }
.day-block.fmt22 .sec-picker-new,
.day-block.fmt22.today-block .sec-picker-new{ display:flex; gap:6px; }
.day-block.fmt22 .sec-picker-new .plus-name-input,
.day-block.fmt22.today-block .sec-picker-new .plus-name-input{
  flex:1; padding:6px 10px; border:1px solid rgba(110,100,86,0.4); border-radius:12px;
  background:#fff; font-size:12px; color:#41373a; outline:none;
}
.day-block.fmt22 .sec-picker-go,
.day-block.fmt22.today-block .sec-picker-go{
  padding:4px 12px; border:none; border-radius:12px; background:rgba(110,100,86,0.18);
  color:#41373a; font-size:11px; cursor:pointer;
}


/* from #card-tweaks-x */

/* 1. section name as faint overlay behind the svg icon */
.day-block.fmt22 .sec-card .card-visual{ position:relative; }
.day-block.fmt22 .sec-card .card-visual .j22-group{ position:absolute !important; bottom:0 !important; top:auto !important; left:0 !important; right:0 !important; margin:0 !important; padding:6px 12px !important; background:linear-gradient(to top, rgba(40,35,28,0.7) 0%, rgba(40,35,28,0) 100%) !important; text-align:left !important; z-index:3 !important; opacity:1 !important; font-family:"Playfair Display","Newsreader",Georgia,serif !important; font-style:normal !important; font-weight:700 !important; font-size:13px !important; letter-spacing:0.02em !important; color:#ffffff !important; pointer-events:auto; cursor:text; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; text-shadow:none; }
.day-block.fmt22 .sec-card .card-visual svg:not(.checkmark){ position:relative; z-index:1; }
/* 2. main-task checkmarks on the right */
.day-block.fmt22 .sec-card .j22-item:not(.j22-sub):not(.j22-sub2) > .agenda-check{ order:2 !important; margin-left:auto !important; margin-right:0 !important; }
/* keep section items single-column inside cards (no clipping) */
.day-block.fmt22 .sec-card .j22-section-items.auto-cols{ display:block !important; }
/* 3. when every task in a section is checked, mark its name done */

.day-block.fmt22 .sec-card.all-done .card-visual .j22-group::after{ content:"\00a0\2713"; }


/* from #card-tweaks-y */

/* title spread out more */
.day-block.fmt22 .sec-card .card-visual .j22-group{ letter-spacing:0.02em !important; font-size:13px !important; }
/* done-check: a checkmark instead of a circle */
.day-block.fmt22 .sec-card .done-check{ background:none !important; border:none !important; box-shadow:none !important; opacity:1 !important; }
.day-block.fmt22 .sec-card .done-check.checked{ opacity:1 !important; background:none !important; border:none !important; }
.day-block.fmt22 .sec-card .done-check .checkmark{ display:none !important; }
.day-block.fmt22 .sec-card .done-check::after{ content:"\2713"; color:#6f757c; font-family:"Newsreader",serif; font-style:italic; font-weight:300; font-size:21px; line-height:1; }
.day-block.fmt22 .sec-card .done-check.checked::after{ opacity:0 !important; }
/* item checkmarks thinner (smaller, finer glyph) */
.day-block.fmt22 .sec-card .j22-item:not(.j22-sub):not(.j22-sub2) > .agenda-check::after{ font-size:18px !important; font-weight:300 !important; }


/* from #card-tweaks-z */

/* clicking an item's checkmark removes the check; re-click re-adds it */
.day-block.fmt22 .sec-card .j22-item:not(.j22-sub):not(.j22-sub2) > .agenda-check:checked::after{ opacity:0 !important; }
.day-block.fmt22 .sec-card .agenda-check:checked + .j22-t{ opacity:1 !important; text-decoration:none !important; }
/* task count on each section header — high-contrast pill; hide zeros */
.day-block.fmt22 .sec-card .card-visual .task-count{
  position:absolute !important;
  top:7px !important;
  right:7px !important;
  left:auto !important;
  z-index:8 !important;
  min-width:20px !important;
  height:20px !important;
  padding:0 6px !important;
  border-radius:10px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-family:'DM Mono',monospace !important;
  font-size:11px !important;
  font-weight:600 !important;
  letter-spacing:0.02em !important;
  color:#fff !important;
  background:rgba(28,24,18,0.82) !important;
  border:1px solid rgba(255,255,255,0.35) !important;
  box-shadow:0 1px 4px rgba(0,0,0,0.35) !important;
  opacity:1 !important;
  pointer-events:none !important;
  line-height:1 !important;
}
.day-block.fmt22 .sec-card .card-visual .task-count:empty,
.day-block.fmt22 .sec-card .card-visual .task-count[data-count="0"]{ display:none !important; }
html body .day-block.today-block .task-count,
html body .day-block.zone-board-day .task-count,
html body .day-block.pursuit-board-day .task-count,
html body .day-block[data-date="2026-08-20"] .task-count,
html body .day-block.today-block .task-count-badge,
html body .day-block.zone-board-day .task-count-badge,
html body .day-block.pursuit-board-day .task-count-badge,
html body .day-block[data-date="2026-08-20"] .task-count-badge {
  display: none !important;
}


/* from #card-collapse */

.day-block.fmt22 .sec-card.card-collapsed .card-body{ display:none !important; }
.day-block.fmt22 .sec-card .card-visual{ cursor:pointer; }


/* from #check-delx-fix */
.day-block.fmt22 .sec-card .j22-item:not(.j22-sub):not(.j22-sub2) > .agenda-check{ margin-right:24px !important; } .day-block.fmt22 .sec-card .j22-item .del-x{ right:3px !important; }

/* from #empty-drop-fix */
.day-block.fmt22 .sec-card .j22-section-items{ min-height:46px !important; }

/* from #add-task-sec-css */

.day-block.fmt22 .sec-card .card-visual .add-task-sec{ position:absolute !important; top:6px; left:9px; z-index:4; width:18px; height:18px; line-height:18px; text-align:center; padding:0; background:none; border:none; cursor:pointer; font-family:"Newsreader",serif; font-size:19px; font-weight:300; color:#7a7a72; opacity:0.5; transition:opacity .15s; }
.day-block.fmt22 .sec-card .card-visual .add-task-sec:hover{ opacity:1; }
.day-block.fmt22 .sec-card.card-collapsed .card-visual .add-task-sec{ display:none; }


/* from #flowmap-css */

.day-block.fmt22 .flow-body.flow-auto{ display:flex; flex-direction:column; align-items:center; gap:0; padding:16px 14px; } .day-block.fmt22 .flow-body.flow-auto .flow-step.fm-step{ position:relative; } .day-block.fmt22 .flow-body.flow-auto .fm-num{ font-family:"Newsreader",serif; font-style:italic; font-size:12px; color:#9a948a; margin-right:9px; vertical-align:1px; }
.day-block.fmt22 .flow-body.flow-auto .flow-empty{ font-family:"Newsreader",serif; font-style:italic; color:#9a9a8e; opacity:0.75; font-size:14px; padding:16px; }


/* from #no-task-checkmarks */
/* numbering uses ::before on items; keep agenda-check hidden */

/* from #hide-agenda-checks */
.day-block.fmt22 .sec-card .j22-item:not(.j22-sub):not(.j22-sub2) > .agenda-check, .day-block.fmt22 .flow-chart-card .j22-item:not(.j22-sub):not(.j22-sub2) > .agenda-check { display:none !important; }

/* from #no-checkmarks */
.day-block.fmt22 .sec-card .done-check{ display:none !important; } .day-block.fmt22 .sec-card .card-visual .j22-group::after{ content:none !important; } .day-block.fmt22 .sec-card .card-visual .task-count{ right:7px !important; }
/* flow checks enabled in tv-flow (see tv-flow-retreat-visible) */

/* from #role-ital-css */
.role-ital{ font-style:italic !important; } .rq{ display:none !important; }

/* from #task-sep-resize-css */

.day-block.fmt22 .sec-card .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2){ padding:9px 0 !important; }
.day-block.fmt22 .sec-card .card-resize{
  position:absolute; right:0; bottom:0; width:22px; height:22px;
  cursor:nwse-resize; z-index:12; touch-action:none;
  background:transparent;
}
.day-block.fmt22 .sec-card .card-resize::after,
.day-block.fmt22 .sec-card:hover .card-resize::after,
.day-block.fmt22 .sec-card.resizing .card-resize::after{
  display:none !important; content:none !important; opacity:0 !important; border:0 !important;
}
.day-block.fmt22 .sec-card.resizing{ overflow:hidden; user-select:none; }


/* from #agenda-css */

.day-block.fmt22 .flow-body.agenda-auto{ display:flex; flex-direction:column; gap:0; padding:14px 22px; }
.day-block.fmt22 .flow-body.agenda-auto .ag-row{ display:flex; align-items:baseline; gap:12px; padding:6px 0; border-bottom:1px solid rgba(120,108,86,0.1); }
.day-block.fmt22 .flow-body.agenda-auto .ag-row:last-child{ border-bottom:none; }
.day-block.fmt22 .flow-body.agenda-auto .ag-sec{ flex:0 0 96px; font-family:"Newsreader",serif; font-style:italic; font-size:12px; color:#9a948a; text-align:right; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.day-block.fmt22 .flow-body.agenda-auto .ag-txt{ font-family:"Newsreader",serif; font-size:15px; color:#4a4a42; line-height:1.3; }
.day-block.fmt22 .flow-body.agenda-auto .ag-empty{ font-family:"Newsreader",serif; font-style:italic; color:#9a9a8e; padding:14px; }



/* --- Enhancement Layer: Visual polish + UX utilities --- */

/* Smoother scrolling */
html { scroll-behavior: smooth; }

/* Better text rendering */
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* Refined progress bar with gradient and glow */
.progress-fill {
  background: linear-gradient(90deg, var(--sage), #A6C49F, var(--sage)) !important;
  background-size: 200% auto;
  animation: enh-progressShimmer 3s ease infinite;
  box-shadow: 0 0 8px rgba(138,158,133,0.3);
}
@keyframes enh-progressShimmer {
  0% { background-position: 0% center; }
  100% { background-position: 200% center; }
}

/* Enhanced card hover with subtle lift */
.day-card {
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1),
              box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}
.day-block:not(.collapsed):not(.today-block) .day-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.08), 0 2px 8px rgba(0,0,0,0.04) !important;
}

/* Day dot pulse animation for today */
.day-block.today .day-dot,
.day-block.today-block .day-dot {
  animation: enh-todayPulse 2.5s ease-in-out infinite;
}
@keyframes enh-todayPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(138,158,133,0.4); }
  50% { box-shadow: 0 0 0 6px rgba(138,158,133,0); }
}

/* Smoother checkbox transitions */
.agenda-check, .agenda-subcheck {
  transition: background 0.2s ease, border-color 0.2s ease, transform 0.15s ease !important;
}
.agenda-check:active, .agenda-subcheck:active {
  transform: scale(0.85);
}

/* Better focus states */
button:focus-visible, a:focus-visible, input:focus-visible {
  outline: 2px solid var(--sage) !important;
  outline-offset: 2px !important;
}

/* Enhanced flow-step pills */
.flow-chart-card .flow-step {
  transition: opacity 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease !important;
}

.day-block {
  animation: none;
}
@keyframes enh-fadeInUp {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}
.day-block:nth-child(2) { animation-delay: 0.05s; }
.day-block:nth-child(3) { animation-delay: 0.1s; }
.day-block:nth-child(4) { animation-delay: 0.15s; }
.day-block:nth-child(5) { animation-delay: 0.2s; }

/* Selection styling */
::selection {
  background: rgba(138,158,133,0.25);
  color: inherit;
}

/* --- Scroll-to-top button --- */
#enh-scroll-top {
  position: fixed;
  bottom: 24px;
  left: 24px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(245, 240, 232, 0.9);
  border: 1px solid rgba(196,168,130,0.4);
  color: #2A2A25;
  font-size: 18px;
  cursor: pointer;
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9990;
  backdrop-filter: blur(8px);
  box-shadow: 0 2px 12px rgba(0,0,0,0.08);
  transition: transform 0.2s ease, opacity 0.3s ease, box-shadow 0.2s ease;
}
#enh-scroll-top:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(0,0,0,0.12);
}
#enh-scroll-top.enh-visible { display: flex; }

/* --- Jump-to-today button --- */
#enh-jump-today {
  position: fixed;
  bottom: 72px;
  left: 24px;
  height: 36px;
  padding: 0 14px;
  border-radius: 18px;
  background: rgba(138,158,133,0.9);
  border: none;
  color: white;
  font-family: 'DM Mono', monospace;
  font-size: 9px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9990;
  backdrop-filter: blur(8px);
  box-shadow: 0 2px 12px rgba(138,158,133,0.3);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
#enh-jump-today:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(138,158,133,0.4);
  background: rgba(122,140,110,0.95);
}
#enh-jump-today.enh-visible { display: flex; }

/* --- Dark mode toggle --- */
#enh-dark-toggle {
  position: fixed;
  top: 18px;
  right: 18px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(245, 240, 232, 0.8);
  border: 1px solid rgba(196,168,130,0.3);
  color: #2A2A25;
  font-size: 16px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  backdrop-filter: blur(8px);
  transition: transform 0.2s ease, background 0.2s ease;
}
#enh-dark-toggle:hover { transform: scale(1.1); }

/* --- Search overlay --- */
#enh-search-overlay {
  position: fixed;
  inset: 0;
  background: rgba(20, 20, 25, 0.6);
  backdrop-filter: blur(4px);
  z-index: 99999;
  display: none;
  align-items: flex-start;
  justify-content: center;
  padding: 12vh 16px 16px;
}
#enh-search-overlay.enh-open { display: flex; }
#enh-search-modal {
  background: #F5F0E8;
  border-radius: 12px;
  width: 100%;
  max-width: 520px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.3);
  overflow: hidden;
  animation: enh-searchSlide 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}
@keyframes enh-searchSlide {
  from { opacity: 0; transform: translateY(-20px) scale(0.96); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
#enh-search-input {
  width: 100%;
  padding: 18px 22px;
  border: none;
  background: transparent;
  font-family: 'Newsreader', serif;
  font-size: 20px;
  font-style: italic;
  color: #2A2A25;
  outline: none;
  border-bottom: 1px solid rgba(196,168,130,0.2);
}
#enh-search-input::placeholder { color: #B5A99A; opacity: 0.6; }
#enh-search-results {
  max-height: 50vh;
  overflow-y: auto;
  padding: 8px 0;
}
.enh-sr-item {
  padding: 10px 22px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 10px;
  transition: background 0.15s ease;
  border-bottom: 1px solid rgba(0,0,0,0.03);
}
.enh-sr-item:hover { background: rgba(138,158,133,0.08); }
.enh-sr-date {
  font-family: 'DM Mono', monospace;
  font-size: 9px;
  letter-spacing: 0.1em;
  color: #B5A99A;
  text-transform: uppercase;
  flex: 0 0 auto;
  min-width: 80px;
}
.enh-sr-text {
  font-family: 'Newsreader', serif;
  font-size: 15px;
  color: #2A2A25;
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.enh-sr-text mark {
  background: rgba(218,180,78,0.3);
  color: inherit;
  border-radius: 2px;
  padding: 0 2px;
}
#enh-search-hint {
  padding: 10px 22px 14px;
  text-align: center;
  font-family: 'DM Mono', monospace;
  font-size: 8px;
  letter-spacing: 0.15em;
  color: #B5A99A;
  text-transform: uppercase;
  opacity: 0.7;
}

/* --- Dark mode --- */
body.enh-dark,
body.enh-dark #page-bg-wrapper {
  background: #1a1a1f !important;
  background-image: none !important;
  color: #e8e4dc !important;
}
body.enh-dark .day-card {
  background: #252528 !important;
  border-color: rgba(196,168,130,0.15) !important;
}
body.enh-dark .day-card-header {
  border-bottom-color: rgba(255,255,255,0.06) !important;
}
body.enh-dark .day-date { color: #c4a882 !important; }
body.enh-dark .day-title { color: #e8e4dc !important; }
body.enh-dark .day-task-text,
body.enh-dark .day-task-text span { color: #ddd8d0 !important; }
body.enh-dark .task-group-label {
  color: #8A9E85 !important;
  background: rgba(138,158,133,0.12) !important;
}
body.enh-dark .flow-chart-card {
  background: #2a2a2f !important;
  border-color: rgba(196,168,130,0.2) !important;
}
body.enh-dark .flow-chart-card .flow-step {
  background: #333338 !important;
  border-color: rgba(196,168,130,0.25) !important;
  color: #e8e4dc !important;
}
body.enh-dark .flow-chart-card .flow-step .flow-step-text { color: #e8e4dc !important; }
body.enh-dark header h1,
body.enh-dark .schedule-header h2 { color: #c4a882 !important; }
body.enh-dark .progress-bar { background: rgba(138,158,133,0.2) !important; }
body.enh-dark .eyebrow,
body.enh-dark .subtitle,
body.enh-dark .progress-label { color: #8a7e62 !important; }
body.enh-dark .divider { background: rgba(196,168,130,0.4) !important; }
body.enh-dark .day-badge {
  background: rgba(138,158,133,0.15) !important;
  color: #8A9E85 !important;
}
body.enh-dark #nav-sidebar {
  background: rgba(26, 26, 31, 0.97) !important;
  border-right-color: rgba(196,168,130,0.2) !important;
}
body.enh-dark #nav-sidebar nav a { color: #e8e4dc !important; }
body.enh-dark #nav-sidebar h2 { color: #c4a882 !important; }
body.enh-dark .timeline::before {
  background: linear-gradient(180deg, rgba(138,158,133,0.3) 0%, rgba(138,158,133,0.5) 50%, transparent 100%) !important;
}
body.enh-dark .day-dot { border-color: rgba(138,158,133,0.6) !important; }
body.enh-dark .agenda-check,
body.enh-dark .agenda-subcheck {
  border-color: rgba(138,158,133,0.5) !important;
  background: rgba(40,40,45,0.8) !important;
}
body.enh-dark .agenda-check:checked,
body.enh-dark .agenda-subcheck:checked {
  background: var(--sage) !important;
  border-color: var(--sage) !important;
}
body.enh-dark #enh-dark-toggle {
  background: rgba(40, 40, 45, 0.8) !important;
  border-color: rgba(196,168,130,0.3) !important;
  color: #c4a882 !important;
}
body.enh-dark #enh-search-modal { background: #252528 !important; }
body.enh-dark #enh-search-input {
  color: #e8e4dc !important;
  border-bottom-color: rgba(196,168,130,0.15) !important;
}
body.enh-dark .enh-sr-text { color: #e8e4dc !important; }
body.enh-dark #enh-scroll-top {
  background: rgba(40,40,45,0.9) !important;
  border-color: rgba(196,168,130,0.3) !important;
  color: #c4a882 !important;
}
body.enh-dark::selection { background: rgba(196,168,130,0.3); }

/* --- Responsive --- */
@media (max-width: 768px) {
  #enh-dark-toggle { top: 12px; right: 12px; width: 32px; height: 32px; font-size: 14px; }
  #enh-scroll-top { width: 36px; height: 36px; bottom: 16px; left: 16px; }
  #enh-jump-today { bottom: 58px; left: 16px; height: 32px; font-size: 8px; }
}

/* --- Print --- */
@media print {
  #enh-dark-toggle, #enh-scroll-top, #enh-jump-today, #enh-search-overlay { display: none !important; }
}


/* from #jul-rail-styles */

.jul-rail-fixed {
  position: fixed;
  right: -44px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 900;
  transition: right 0.3s cubic-bezier(0.23,1,0.32,1), opacity 0.3s ease;
  opacity: 0.6;
}
#julRail:hover {
  right: 10px;
  opacity: 1;
}
#julRail.rail-peeking {
  right: -30px;
  opacity: 0.4;
}
.jul-rail-trigger {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 60px;
  pointer-events: auto;
}
.jul-rail {
  width: 54px;
  background: rgba(245,240,234,0.15); backdrop-filter: blur(8px);
  border-radius: 14px;
  padding: 10px 5px;
  border: 1px solid rgba(138,158,133,0.1);
  box-shadow: 0 2px 16px rgba(0,0,0,0.06);
  backdrop-filter: blur(8px);
}
.rail-header {
  font-family: 'DM Mono', monospace;
  font-size: 9px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--dusty, #B5A99A);
  text-align: center;
  margin-bottom: 6px;
  padding-bottom: 5px;
  border-bottom: 1px solid rgba(138,158,133,0.15);
}
.rail-dates {
  display: flex;
  flex-direction: column;
  gap: 0px;
  max-height: 72vh;
  overflow-y: auto;
}
.rail-date {
  display: flex;
  align-items: center;
  gap: 2px;
  padding: 2px 4px;
  border-radius: 5px;
  cursor: pointer;
  transition: background 0.15s ease, transform 0.1s ease;
  position: relative;
}
.rail-date:hover {
  background: rgba(138,158,133,0.15);
  transform: scale(1.04);
}
.rail-date.active {
  background: rgba(110,100,86,0.22);
}
.rail-date.has-tasks .rail-day {
  font-weight: 700;
  color: #3a3327;
}
.rail-day {
  font-family: 'DM Mono', monospace;
  font-size: 9px;
  color: #6f5f54;
  min-width: 14px;
  text-align: right;
}
.rail-dow {
  font-family: 'DM Mono', monospace;
  font-size: 6.5px;
  color: #B5A99A;
  letter-spacing: 0.03em;
}
.rail-count {
  position: absolute;
  right: 2px;
  top: 50%;
  transform: translateY(-50%);
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: rgba(138,158,133,0.3);
  font-family: 'DM Mono', monospace;
  font-size: 7px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #3a3327;
}
.flow-empty {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  color: #B5A99A;
  font-style: italic;
  margin: 4px 0;
}
@media (max-width: 800px) {
  .jul-rail-fixed { display: none; }
}

/* Three-view toggle for today cards */
.today-view-toggle { display:flex; gap:6px; padding:6px 12px; }
.tv-pill { font:600 10px/1 'DM Mono', monospace; text-transform:uppercase; letter-spacing:0.5px; padding:4px 10px; border-radius:12px; border:1px solid rgba(120,110,90,0.25); background:transparent; color:rgba(90,80,60,0.6); cursor:pointer; transition:all 0.2s ease; }
.tv-pill.active { background:rgba(120,110,90,0.15); color:rgba(60,50,30,0.9); border-color:rgba(120,110,90,0.4); }
.tv-pill:hover:not(.active) { background:rgba(120,110,90,0.08); }
.today-agenda-list { padding:8px 12px; }


/* from #card-auto-expand */

/* Lock square sizes — empty 148; with-tasks grows via --vb-size.
   Today’s zone minis are excluded — they use --card-w/--card-h and must not pulse. */
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-grid .sec-card.is-empty,
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-grid.freeform > .sec-card.is-empty,
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-grid .sec-card.card-collapsed.has-tasks,
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-grid.freeform > .sec-card.card-collapsed.has-tasks {
  width: 148px !important;
  height: 148px !important;
  max-width: 148px !important;
  max-height: 148px !important;
  min-height: 0 !important;
  flex: 0 0 148px !important;
  overflow: hidden !important;
}
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-grid .sec-card.has-tasks:not(.card-collapsed):not(.card-sized),
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-grid.freeform > .sec-card.has-tasks:not(.card-collapsed):not(.card-sized) {
  width: var(--vb-size, 210px) !important;
  height: var(--vb-size, 210px) !important;
  max-width: var(--vb-size, 210px) !important;
  max-height: var(--vb-size, 210px) !important;
  min-width: var(--vb-size, 210px) !important;
  min-height: var(--vb-size, 210px) !important;
  flex: 0 0 var(--vb-size, 210px) !important;
  aspect-ratio: 1 / 1 !important;
  overflow: hidden !important;
}
/* User-resized cards: let inline size win (set by resize handle) */
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-grid .sec-card.card-sized:not(.card-collapsed),
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-grid.freeform > .sec-card.card-sized:not(.card-collapsed) {
  max-width: none !important;
  max-height: none !important;
  overflow: hidden !important;
}
.day-block.fmt22 .sec-card.is-empty { min-height:0 !important; }
/* Compact task chrome inside photo-backed squares */
.day-block.fmt22 .sec-card.has-tasks .task-meta-row,
.day-block.fmt22 .sec-card.has-tasks .task-progress-wrap {
  display: none !important;
}


/* from #card-item-numbers */

/* Number items in each pursuit card (checkboxes are hidden — use ::before) */
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-card .j22-section-items { counter-reset: carditem; }
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-card .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2) {
  counter-increment: carditem;
  gap: 6px !important;
}
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-card .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2)::before {
  content: counter(carditem) !important;
  flex: 0 0 12px !important;
  font-family: "DM Mono", monospace !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  color: #334155 !important;
  -webkit-text-fill-color: #334155 !important;
  opacity: 1 !important;
}
/* Full-photo vision board — beat later list/chip styles */
.day-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .card-body {
  background: transparent !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
  box-shadow: none !important;
  inset: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  max-height: none !important;
  min-height: 0 !important;
  height: 100% !important;
  pointer-events: none !important;
}
.day-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items {
  position: relative !important;
  display: block !important;
  height: 100% !important;
  min-height: 100% !important;
  padding: 0 !important;
  border-left: none !important;
  overflow: visible !important;
  pointer-events: none !important;
}
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2) {
  position: absolute !important;
  display: inline-flex !important;
  align-items: baseline !important;
  margin: 0 !important;
  padding: 3px 8px 2px 6px !important;
  border: none !important;
  border-bottom: none !important;
  border-radius: 0 !important;
  background: #efe6d8 !important;
  gap: 3px !important;
  flex-wrap: nowrap !important;
  min-height: 0 !important;
  max-width: 46% !important;
  width: max-content !important;
  z-index: 1 !important;
  transform-origin: center center !important;
  pointer-events: auto !important;
  box-shadow: 1px 2px 4px rgba(40, 28, 18, 0.22) !important;
}
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2):hover {
  background: #efe6d8 !important;
  z-index: 3 !important;
}
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item .j22-t,
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-card.has-tasks:not(.card-collapsed) .j22-t {
  color: #2a241c !important;
  -webkit-text-fill-color: #2a241c !important;
  font-family: "Reenie Beanie", "Segoe Print", cursive !important;
  font-size: inherit !important;
  font-weight: 400 !important;
  font-style: normal !important;
  letter-spacing: 0.01em !important;
  line-height: 1.05 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2)::before {
  content: counter(carditem) !important;
  flex: 0 0 auto !important;
  color: rgba(90, 55, 30, 0.72) !important;
  -webkit-text-fill-color: rgba(90, 55, 30, 0.72) !important;
  font-family: "Reenie Beanie", cursive !important;
  font-size: 1.1em !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  opacity: 1 !important;
}
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item .pin-btn {
  display: none !important;
}
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item > .agenda-check {
  width: 10px !important;
  height: 10px !important;
  min-width: 10px !important;
  margin-right: 2px !important;
  opacity: 0.3 !important;
  border-color: rgba(90, 55, 30, 0.45) !important;
  align-self: baseline !important;
  margin-top: 5px !important;
}
.day-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .task-meta-row,
.day-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .task-progress-wrap,
.day-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .task-status-bar {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}


/* from #tv-flow-retreat-visible */

/* GSEP / classic flow content must stay readable on dark glass */
.day-block.fmt22 .tv-panel.tv-flow .flow-chart-card,
.day-block.fmt22 .tv-panel.tv-flow .gsep-retreat-card {
  background: rgba(255, 255, 255, 0.10) !important;
  backdrop-filter: blur(16px) saturate(1.3) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.3) !important;
  padding: 20px 22px 26px !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  border-radius: 10px !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  margin-bottom: 14px !important;
}
/* Pin retreat under the timeline */
.day-block.fmt22 .tv-panel.tv-flow .gsep-retreat-card {
  margin-top: 14px !important;
  margin-bottom: 0 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}
.day-block.fmt22 .tv-panel.tv-flow .gsep-retreat-card .flow-title {
  margin-bottom: 14px !important;
}
.day-block.fmt22 .tv-panel.tv-flow .flow-title {
  color: #F1EFE8 !important;
  -webkit-text-fill-color: #F1EFE8 !important;
}
.day-block.fmt22 .tv-panel.tv-flow .flow-step,
.day-block.fmt22 .tv-panel.tv-flow .flow-step-text {
  color: #F1EFE8 !important;
  -webkit-text-fill-color: #F1EFE8 !important;
  font-family: "Newsreader", Georgia, serif !important;
  font-size: 17px !important;
  line-height: 1.45 !important;
}
/* Check off flow items — checkbox on the right, no strikethrough */
.day-block.fmt22 .tv-panel.tv-flow .flow-step {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  background: transparent !important;
}
.day-block.fmt22 .tv-panel.tv-flow .flow-step .flow-step-text {
  flex: 1 1 auto !important;
  order: 1 !important;
}
.day-block.fmt22 .tv-panel.tv-flow .flow-step .flow-delete {
  order: 2 !important;
  color: rgba(241,239,232,0.55) !important;
}
.day-block.fmt22 .tv-panel.tv-flow .flow-step .flow-check {
  display: inline-block !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  margin: 3px 0 0 auto !important;
  border-radius: 50% !important;
  border: 1.5px solid rgba(241, 239, 232, 0.55) !important;
  background: transparent !important;
  cursor: pointer !important;
  flex: none !important;
  position: relative !important;
  order: 3 !important;
}
.day-block.fmt22 .tv-panel.tv-flow .flow-step .flow-check:checked {
  background: rgba(196, 168, 130, 0.9) !important;
  border-color: rgba(196, 168, 130, 0.95) !important;
}
.day-block.fmt22 .tv-panel.tv-flow .flow-step .flow-check:checked::after {
  content: "✓" !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -55%) !important;
  color: #2a241c !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}
.day-block.fmt22 .tv-panel.tv-flow .flow-step.done {
  opacity: 1 !important;
  background: transparent !important;
}
.day-block.fmt22 .tv-panel.tv-flow .flow-step.done .flow-step-text {
  opacity: 0.55 !important;
  text-decoration: none !important;
}
.day-block.fmt22 .tv-panel.tv-pursuits > .flow-chart-card {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  padding: 0 !important;
  border: none !important;
  box-shadow: none !important;
}


/* from #task-pin */

.day-block.fmt22 .sec-card .j22-item { position:relative; }
.day-block.fmt22 .sec-card .j22-item .pin-btn {
  position:absolute; right: -2px; top: -2px;
  transform: none;
  opacity:0; cursor:pointer; transition:opacity .15s ease, transform .12s ease;
  width:22px; height:22px; padding:0; border:none; background:transparent;
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0; z-index: 3;
}
.day-block.fmt22 .sec-card .j22-item .pin-btn svg {
  width: 18px; height: 18px;
  overflow: visible;
  fill: none; stroke: none;
  filter: drop-shadow(0 1px 1.5px rgba(40,12,16,0.28));
}
.day-block.fmt22 .sec-card .j22-item:hover .pin-btn { opacity:0.6; }
.day-block.fmt22 .sec-card .j22-item .pin-btn:hover { opacity:1; transform: scale(1.08); }
.day-block.fmt22 .sec-card .j22-item.pinned .pin-btn { opacity:1; }
.day-block.fmt22 .sec-card .j22-item.pinned .pin-btn svg {
  fill: none; stroke: none;
  filter: drop-shadow(0 2px 2px rgba(40,12,16,0.36));
}
.day-block.fmt22 .flow-chart-card .j22-item { position:relative; }
.day-block.fmt22 .flow-chart-card .j22-item .pin-btn {
  position:relative; left:auto; top:auto;
  transform: none;
  opacity:0; cursor:pointer; transition:opacity .15s ease, transform .15s ease;
  width:16px; height:16px; padding:0; border:none; background:transparent;
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0; margin-right:4px;
}
.day-block.fmt22 .flow-chart-card .j22-item:hover .pin-btn { opacity:0.5; }
.day-block.fmt22 .flow-chart-card .j22-item .pin-btn:hover { opacity:1; }
.day-block.fmt22 .flow-chart-card .j22-item.pinned .pin-btn { opacity:1; }
.day-block.fmt22 .flow-chart-card .j22-item.pinned .pin-btn svg {
  fill:none; stroke:none;
}
.day-block.fmt22 .sec-card .j22-item.pinned {
  border-left: none;
  padding-left: 6px;
  margin-left: 0;
}
.day-block.fmt22 .sec-card .j22-section-items { padding-left:0; }



.prayer-slot-task {
  cursor: grab;
  user-select: none;
  -webkit-user-select: none;
  transition: transform 0.15s ease-out, box-shadow 0.15s ease-out;
}
.prayer-slot-task:active {
  cursor: grabbing;
}
.prayer-slot-task.sortable-ghost {
  opacity: 0.3;
  background: rgba(154, 132, 86, 0.15) !important;
}
.prayer-slot-task.sortable-chosen {
  box-shadow: 0 4px 16px rgba(0,0,0,0.3);
  transform: scale(1.02);
  z-index: 100;
}
.prayer-slot-task.sortable-drag {
  opacity: 0.9;
}


/* from #flow-timeline-style */

.flow-timeline-card {
  background: rgba(35, 28, 38, 0.45);
  border-radius: 16px;
  padding: 24px 20px 28px;
  min-height: 200px;
}
.flow-timeline-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 20px;
}
.flow-timeline-title {
  font-family: 'Newsreader', serif;
  font-size: 1.1rem;
  color: rgba(200, 180, 150, 0.7);
  font-style: italic;
  letter-spacing: 0.5px;
}
.flow-timeline-count {
  font-family: 'DM Mono', monospace;
  font-size: 0.85rem;
  color: rgba(200, 180, 150, 0.5);
}
.flow-timeline-list {
  position: relative;
  padding-left: 32px;
}
.flow-timeline-list::before {
  content: '';
  position: absolute;
  left: 8px;
  top: 8px;
  bottom: 8px;
  width: 1px;
  background: rgba(180, 160, 120, 0.3);
}
.flow-tl-item {
  position: relative;
  display: flex;
  align-items: baseline;
  gap: 12px;
  padding: 14px 0;
  cursor: grab;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
  overflow: visible;
}
.flow-tl-item.flow-tl-nest-target {
  background: rgba(180, 160, 120, 0.16);
  border-radius: 8px;
  box-shadow: inset 3px 0 0 rgba(210, 185, 145, 0.85);
}
.flow-tl-item.flow-tl-nest-target .flow-tl-text {
  color: rgba(255, 250, 240, 1);
}
.flow-tl-item .flow-tl-text {
  -webkit-user-select: text;
  user-select: text;
  cursor: text;
}
.flow-tl-dragging {
  opacity: 0.35;
}
.flow-tl-item::before {
  content: '';
  position: absolute;
  left: -28px;
  top: 50%;
  transform: translateY(-50%);
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: rgba(180, 160, 120, 0.8);
}
/* Stepped nest — each depth stairs further right (no a/b labels) */
.flow-tl-item {
  --flow-d: 0;
  margin-left: calc(var(--flow-d) * 48px);
  transition: margin-left 0.18s ease;
}
.flow-tl-item[data-depth]:not([data-depth="0"]) {
  padding-top: 10px;
  padding-bottom: 10px;
  gap: 10px;
  border-left: 1px dashed rgba(180, 160, 120, 0.32);
  padding-left: 16px;
  position: relative;
}
/* Horizontal “stair tread” into the step */
.flow-tl-item[data-depth]:not([data-depth="0"])::after {
  content: '';
  position: absolute;
  left: -48px;
  top: 50%;
  width: 36px;
  height: 1px;
  background: rgba(180, 160, 120, 0.28);
  pointer-events: none;
}
.flow-tl-item[data-depth="2"]::after { left: -48px; width: 36px; }
.flow-tl-item[data-depth]:not([data-depth="0"])::before {
  left: -7px;
  width: 6px;
  height: 6px;
  background: rgba(180, 160, 120, 0.55);
  box-shadow: none;
}
.flow-tl-item[data-depth="1"] .flow-tl-text { font-size: 1.08rem; color: rgba(255, 250, 240, 0.84); }
.flow-tl-item[data-depth="2"] .flow-tl-text { font-size: 1.02rem; color: rgba(255, 250, 240, 0.76); }
.flow-tl-item[data-depth="3"] .flow-tl-text,
.flow-tl-item[data-depth="4"] .flow-tl-text,
.flow-tl-item[data-depth="5"] .flow-tl-text { font-size: 0.98rem; color: rgba(255, 250, 240, 0.68); }
.flow-tl-item[data-depth]:not([data-depth="0"]) .flow-tl-num {
  min-width: 0;
  width: 0;
  overflow: hidden;
  opacity: 0;
  font-size: 0;
  margin: 0;
  padding: 0;
}
.flow-tl-item.flow-tl-sub { /* legacy class kept in sync with depth>0 */ }
.flow-tl-num {
  font-family: 'DM Mono', monospace;
  font-size: 0.75rem;
  color: rgba(200, 180, 150, 0.5);
  min-width: 18px;
  cursor: grab;
}
.flow-tl-num:active {
  cursor: grabbing;
}
.flow-tl-body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
  position: relative;
}
.flow-tl-text {
  font-family: 'Newsreader', serif;
  font-size: 1.15rem;
  color: rgba(255, 250, 240, 0.9);
  outline: none;
  width: 100%;
}
.flow-tl-text:focus {
  border-bottom: 1px solid rgba(180, 160, 120, 0.4);
}
.flow-tl-add-sub {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  left: 0;
  top: calc(100% + 1px);
  z-index: 8;
  width: 20px;
  height: 20px;
  margin: 0;
  padding: 0;
  border: 1px solid rgba(180, 160, 120, 0.35);
  border-radius: 50%;
  background: rgba(45, 36, 48, 0.85);
  color: rgba(200, 180, 150, 0.85);
  font-size: 15px;
  line-height: 1;
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.15s ease, color 0.15s ease, background 0.15s ease;
}
.flow-tl-body:hover .flow-tl-add-sub,
.flow-tl-item:focus-within .flow-tl-add-sub,
.flow-tl-add-sub:focus {
  opacity: 1;
  pointer-events: auto;
}
.flow-tl-add-sub:hover {
  color: rgba(255, 245, 230, 0.98);
  background: rgba(180, 160, 120, 0.4);
  border-color: rgba(200, 180, 150, 0.6);
}
.flow-tl-check {
  appearance: none;
  -webkit-appearance: none;
  width: 15px;
  height: 15px;
  min-width: 15px;
  margin: 0 0 0 auto;
  border-radius: 50%;
  border: 1.4px solid rgba(200, 180, 150, 0.55);
  background: transparent;
  cursor: pointer;
  flex: none;
  position: relative;
  align-self: center;
  order: 10;
}
.flow-tl-check:checked {
  background: rgba(196, 168, 130, 0.9);
  border-color: rgba(196, 168, 130, 0.95);
}
.flow-tl-check:checked::after {
  content: "✓";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -55%);
  color: #2a241c;
  font-size: 9px;
  font-weight: 700;
  line-height: 1;
}
.flow-tl-item.done .flow-tl-text {
  color: rgba(200, 180, 150, 0.55);
  text-decoration: none !important;
}
.flow-tl-item.done .flow-tl-num {
  color: rgba(200, 180, 150, 0.4);
}
.flow-tl-item.done .flow-tl-check {
  opacity: 0.85;
}
.flow-tl-item.done::before {
  background: rgba(180, 160, 120, 0.35);
}
.flow-tl-deadline {
  font-family: 'DM Mono', monospace;
  font-size: 0.7rem;
  color: rgba(200, 180, 150, 0.6);
  font-style: italic;
  margin-left: auto;
}
.flow-tl-dragging {
  opacity: 0.4;
  background: rgba(180, 160, 120, 0.1);
  border-radius: 8px;
}
.flow-tl-chosen {
  background: rgba(180, 160, 120, 0.08);
  border-radius: 8px;
}
.flow-tl-add {
  display: block;
  margin: 16px auto 0;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 1px solid rgba(180, 160, 120, 0.3);
  background: rgba(180, 160, 120, 0.08);
  color: rgba(200, 180, 150, 0.6);
  font-size: 1.2rem;
  cursor: pointer;
  transition: all 0.2s ease;
}
.flow-tl-add:hover {
  background: rgba(180, 160, 120, 0.2);
  color: rgba(200, 180, 150, 0.9);
  border-color: rgba(180, 160, 120, 0.6);
}
.prayer-cards-container {
  display: flex;
  flex-direction: column;
  gap: 0;
  background-image: url('manus-storage/deen-moodboard-bg_807e7166.jpg');
  background-size: cover;
  background-position: center;
  border-radius: 20px;
  padding: 0;
  position: relative;
  overflow: hidden;
  box-shadow: 0 8px 32px rgba(120,100,70,0.15), 0 2px 6px rgba(0,0,0,0.06);
  border: 1px solid rgba(220,210,190,0.4);
}
/* Soft warm overlay for readability over moodboard */
.prayer-cards-container::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(255,252,248,0.4) 0%, rgba(250,245,235,0.55) 30%, rgba(255,252,248,0.65) 100%);
  pointer-events: none;
  border-radius: 20px;
}
/* today's agenda header with ornamental star */
.prayer-header {
  text-align: center;
  padding: 14px 12px 4px;
  position: relative;
  z-index: 2;
}
.prayer-header-ornament {
  display: block;
  margin: 0 auto 8px;
  font-size: 1.4rem;
  color: #b09060;
  opacity: 0.8;
}
.prayer-header-title {
  font-family: 'Newsreader', serif;
  font-size: 1.6rem;
  font-weight: 600;
  color: #3d3225;
  letter-spacing: 0.5px;
}
.prayer-header-location {
  font-family: 'DM Sans', sans-serif;
  font-size: 0.75rem;
  color: #8a7a60;
  margin-top: 4px;
  letter-spacing: 0.3px;
}
.prayer-city-select {
  appearance: none;
  -webkit-appearance: none;
  background: rgba(255,252,248,0.55);
  border: 1px solid rgba(176,144,96,0.35);
  border-radius: 999px;
  padding: 4px 28px 4px 12px;
  font-family: 'DM Sans', sans-serif;
  font-size: 0.75rem;
  color: #5c4a32;
  cursor: pointer;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6'><path d='M0 0l5 6 5-6z' fill='%238a7a60'/></svg>");
  background-repeat: no-repeat;
  background-position: right 10px center;
}
/* Quote card */
.prayer-quote {
  text-align: center;
  font-family: 'Newsreader', serif;
  font-size: 1.05rem;
  font-style: normal;
  color: #3d3225;
  padding: 10px 16px;
  margin: 4px 12px 8px;
  letter-spacing: 0.2px;
  line-height: 1.7;
  position: relative;
  z-index: 2;
  background: none;
  border-radius: 0;
  border: none;
  box-shadow: none;
}
.prayer-quote-mark {
  display: block;
  font-family: Georgia, serif;
  font-size: 2rem;
  color: #b09060;
  line-height: 1;
  margin-bottom: 6px;
}
.prayer-quote-ref {
  display: block;
  font-family: 'DM Mono', monospace;
  font-size: 0.7rem;
  color: #b09060;
  margin-top: 10px;
  letter-spacing: 1px;
}
.prayer-quote-divider {
  display: block;
  width: 24px;
  height: 1px;
  background: #c4a97d;
  margin: 8px auto;
}
/* No top decorative line - using header instead */
.prayer-cards-container::after {
  display: none;
}
.prayer-card {
  background: rgba(255,255,255,0.55);
  border-radius: 10px;
  padding: 12px 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 4px 12px;
  position: relative;
  border: none;
  overflow: hidden;
  clip-path: none;
  transition: box-shadow 0.2s, transform 0.2s;
  z-index: 1;
}
.prayer-card[data-prayer="fajr"] {
  background: linear-gradient(180deg, #1a2748 0%, #3d4a78 42%, #c48a7a 78%, #e8b89a 100%);
}
.prayer-card[data-prayer="dhuhr"] {
  background: linear-gradient(180deg, #7ec8e8 0%, #b9e4f5 45%, #f2f6ea 100%);
}
.prayer-card[data-prayer="asr"] {
  background: linear-gradient(180deg, #5ea0d0 0%, #f0c27a 48%, #e08a4a 100%);
}
.prayer-card[data-prayer="maghrib"] {
  background: linear-gradient(180deg, #2a1a4a 0%, #c43c3c 38%, #f07a3a 72%, #ffc878 100%);
}
.prayer-card[data-prayer="isha"] {
  background:
    radial-gradient(1px 1px at 18% 30%, rgba(255,255,255,0.85), transparent),
    radial-gradient(1px 1px at 72% 22%, rgba(255,255,255,0.7), transparent),
    radial-gradient(1.2px 1.2px at 84% 58%, rgba(255,255,255,0.55), transparent),
    linear-gradient(180deg, #07091a 0%, #141a3a 55%, #2a2458 100%);
}
.prayer-card[data-prayer="fajr"] .prayer-card-name,
.prayer-card[data-prayer="fajr"] .prayer-card-time,
.prayer-card[data-prayer="maghrib"] .prayer-card-name,
.prayer-card[data-prayer="maghrib"] .prayer-card-time,
.prayer-card[data-prayer="isha"] .prayer-card-name,
.prayer-card[data-prayer="isha"] .prayer-card-time {
  color: #f7f1e6;
  text-shadow: 0 1px 8px rgba(0,0,0,0.35);
}
.prayer-card[data-prayer="dhuhr"] .prayer-card-name,
.prayer-card[data-prayer="dhuhr"] .prayer-card-time {
  color: #2a3d4a;
}
.prayer-card[data-prayer="asr"] .prayer-card-name,
.prayer-card[data-prayer="asr"] .prayer-card-time {
  color: #2c1c10;
  text-shadow: 0 1px 6px rgba(255,255,255,0.25);
}
.prayer-card:hover {
  box-shadow: 0 3px 16px rgba(180,160,130,0.12);
  transform: translateY(-1px);
}
.prayer-card::before {
  display: none;
}
.prayer-card::after {
  display: none;
}
.prayer-card-name {
  font-family: 'Newsreader', serif;
  font-size: 1.15rem;
  color: #3d3225;
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0.3px;
  position: relative;
  z-index: 1;
  margin-left: 8px;
}
.prayer-card-time {
  font-family: 'DM Sans', sans-serif;
  font-size: 0.85rem;
  color: #5c4a32;
  font-weight: 500;
  letter-spacing: 0.3px;
  position: relative;
  z-index: 1;
}
.prayer-card-time small {
  font-size: 0.65rem;
  color: #8a7a60;
  margin-left: 2px;
  text-transform: uppercase;
}
.prayer-slot {
  padding: 4px 12px 4px 12px;
  display: flex;
  flex-direction: column;
  gap: 3px;
  position: relative;
}
.prayer-slot::before {
  display: none;
}
.prayer-slot::after {
  display: none;
}
.prayer-slot-task {
  font-family: 'Newsreader', serif;
  font-size: 0.95rem;
  color: #e8e4df;
  padding: 7px 12px;
  border-radius: 6px;
  outline: none;
  transition: background 0.2s, border-color 0.2s;
  position: relative;
  border: 1px solid rgba(100,116,139,0.3);
  background: rgba(51,65,85,0.55);
}
.prayer-slot-task:hover {
  background: rgba(51,65,85,0.7);
  border-color: rgba(100,116,139,0.5);
}
.prayer-slot-task:focus {
  background: rgba(51,65,85,0.8);
  border-color: rgba(100,116,139,0.7);
}
.prayer-slot-add {
  background: rgba(255,255,255,0.3);
  border: 1px dashed rgba(180,155,110,0.4);
  color: #9a8565;
  font-size: 1rem;
  padding: 5px 12px;
  border-radius: 6px;
  cursor: pointer;
  margin-top: 4px;
  transition: all 0.2s;
}
.prayer-slot-add:hover {
  border-color: rgba(180,155,110,0.7);
  color: #6b5a3e;
  background: rgba(255,255,255,0.5);
}
.prayer-footer {
  text-align: center;
  padding: 16px 20px 22px;
  position: relative;
  z-index: 2;
  font-family: 'Newsreader', serif;
  font-size: 0.85rem;
  font-style: italic;
  color: #6b5a3e;
  letter-spacing: 0.3px;
}
<style id="pursuit-final-override">
/* === FINAL OVERRIDE: Task appearance in pursuit cards === */
/* Hide checkbox completely - user said NO checkbox */
.day-block.fmt22 .sec-card .j22-item .agenda-check,
.day-block.fmt22 .sec-card .j22-item > .agenda-check,
.day-block.fmt22 .sec-card .j22-item input.agenda-check {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Task text: clean sans-serif, NOT italic serif */
.day-block.fmt22 .sec-card .j22-t,
.day-block.fmt22 .sec-card .j22-item .j22-t,
.day-block.fmt22 .sec-card .j22-section-items .j22-t {
  font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif !important;
  font-size: 13.5px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  color: #2e2b26 !important;
  letter-spacing: 0 !important;
  line-height: 1.45 !important;
  text-align: center !important;
}
.day-block.fmt22 .sec-card .j22-section-items > .j22-item {
  justify-content: center !important;
}
.task-progress-endverb {
  font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 11px !important;
  font-weight: 400;
  color: #2e2b26;
  letter-spacing: 0.01em;
  white-space: nowrap !important;
  flex-shrink: 0;
  margin-left: 0;
  opacity: 0.9;
  overflow: visible !important;
  max-width: none !important;
}

/* Task items: minimal padding, clean layout */
.day-block.fmt22 .sec-card .j22-section-items {
  padding-left: 0 !important;
  margin: 0 !important;
  border-left: none !important;
}

.day-block.fmt22 .sec-card .j22-section-items > .j22-item {
  display: flex !important;
  align-items: center !important;
  padding: 6px 2px !important;
  margin: 0 !important;
  border-bottom: 1px solid rgba(180, 170, 155, 0.15) !important;
  position: relative !important;
}
.day-block.fmt22 .sec-card .j22-section-items > .j22-item:last-child {
  border-bottom: none !important;
}

/* Card body: normal side padding — bar stays inside */
.day-block.fmt22 .sec-card .card-body {
  padding: 8px 10px 10px !important;
  overflow: visible !important;
}

/* Task row — names stay centered; bar is its own full-width row */
.day-block.fmt22 .sec-card .j22-section-items > .j22-item {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 6px 0 !important;
  margin: 0 !important;
  border-bottom: 1px solid rgba(180, 170, 155, 0.15) !important;
  border-left: none !important;
  position: relative !important;
  overflow: visible !important;
}
.day-block.fmt22 .sec-card .j22-section-items > .j22-item:last-child {
  border-bottom: none !important;
}

/* Status bar: a bit narrower, centered under the name */
.day-block.fmt22 .sec-card .j22-item > .task-meta-row {
  flex: 0 0 auto !important;
  display: block !important;
  width: 86% !important;
  min-width: 0 !important;
  max-width: 86% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}
.day-block.fmt22 .sec-card .j22-item.pinned {
  border-left: none !important;
  padding: 6px 0 !important;
  margin-left: 0 !important;
}
.day-block.fmt22 .sec-card .j22-item.pinned > .task-meta-row {
  width: 86% !important;
  max-width: 86% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.day-block.fmt22 .sec-card .task-progress-wrap,
.day-block.fmt22 .sec-card .task-progress-bar {
  box-sizing: border-box !important;
  max-width: 100% !important;
}
.day-block.fmt22 .sec-card .task-progress-wrap {
  display: block !important;
  width: 100% !important;
  border-radius: 0 !important;
  position: relative !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}
.day-block.fmt22 .sec-card .task-progress-bar {
  display: block !important;
  flex: none !important;
  width: 100% !important;
  border-radius: 999px !important;
}
.day-block.fmt22 .sec-card .task-progress-endverb {
  position: absolute !important;
  right: 2px !important;
  top: 50% !important;
  left: auto !important;
  transform: translateY(-50%) !important;
  flex: none !important;
  flex-shrink: 0 !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 4px !important;
  text-align: right !important;
  z-index: 5 !important;
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
}
/* Dock chips stay in the hover toolbar — never absolute-on-bar */
.day-block.fmt22 .sec-card .task-progress-dock .task-progress-label,
.day-block.fmt22 .sec-card .task-progress-dock .task-progress-place-btn,
.day-block.fmt22 .sec-card .task-progress-dock .task-timer,
.day-block.fmt22 .sec-card .task-progress-dock .task-estimate {
  position: static !important;
  top: auto !important;
  right: auto !important;
  left: auto !important;
  transform: none !important;
  margin: 0 !important;
  flex: none !important;
  opacity: 1 !important;
}

/* Pin button: absolute upper-right of task name, shiny metallic red when pinned */
/* Pin must be relative to the .j22-t text span */
.day-block.fmt22 .sec-card .j22-item .j22-t,
.day-block.fmt22 .flow-chart-card .j22-item .j22-t {
  position: relative !important;
}
.day-block.fmt22 .sec-card .j22-item .pin-btn,
.day-block.fmt22 .flow-chart-card .j22-item .pin-btn {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  left: auto !important;
  transform: none !important;
  opacity: 0 !important;
  cursor: pointer !important;
  transition: opacity .15s ease, transform .12s ease !important;
  width: 26px !important;
  height: 26px !important;
  padding: 2px !important;
  border: none !important;
  background: transparent !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 10 !important;
  flex-shrink: 0 !important;
  margin-left: 10px !important;
  margin-right: 0 !important;
}
.day-block.fmt22 .sec-card .j22-item .pin-btn svg,
.day-block.fmt22 .flow-chart-card .j22-item .pin-btn svg {
  width: 20px !important; height: 20px !important;
  overflow: visible !important;
  fill: none !important;
  stroke: none !important;
  filter: drop-shadow(0 1px 2px rgba(40,12,16,0.3)) !important;
  transform: none !important;
}
.day-block.fmt22 .sec-card .j22-section-items {
  padding-left: 0 !important;
}
.day-block.fmt22 .sec-card .j22-item:hover .pin-btn,
.day-block.fmt22 .flow-chart-card .j22-item:hover .pin-btn { opacity: 0.5 !important; }
.day-block.fmt22 .sec-card .j22-item .pin-btn:hover,
.day-block.fmt22 .flow-chart-card .j22-item .pin-btn:hover {
  opacity: 1 !important;
  transform: scale(1.08) !important;
}
.day-block.fmt22 .sec-card .j22-item.pinned .pin-btn,
.day-block.fmt22 .flow-chart-card .j22-item.pinned .pin-btn {
  opacity: 1 !important;
  transform: none !important;
}
.day-block.fmt22 .sec-card .j22-item.pinned .pin-btn svg,
.day-block.fmt22 .flow-chart-card .j22-item.pinned .pin-btn svg {
  fill: none !important;
  stroke: none !important;
  filter: drop-shadow(0 2px 3px rgba(40,12,16,0.38)) !important;
}
.day-block.fmt22 .sec-card .j22-item.pinned .pin-btn .pin-head,
.day-block.fmt22 .flow-chart-card .j22-item.pinned .pin-btn .pin-head {
  fill: url(#wax-seal-grad) !important;
}
.day-block.fmt22 .sec-card .j22-item:not(.pinned) .pin-btn .pin-head,
.day-block.fmt22 .flow-chart-card .j22-item:not(.pinned) .pin-btn .pin-head {
  fill: url(#wax-seal-muted) !important;
}
/* Pin number badge */
.pin-badge {
  position: absolute;
  top: -2px;
  right: -5px;
  width: auto;
  height: auto;
  border-radius: 0;
  background: none;
  color: #9b1b30;
  font-size: 7px;
  font-weight: 600;
  line-height: 1;
  text-align: center;
  pointer-events: none;
  font-family: 'DM Mono', monospace;
  font-size: 0 !important;
}
.pin-badge::after {
  content: attr(data-pin);
  font-size: 7px;
}

/* Pinned items: subtle accent — no left rail */
.day-block.fmt22 .sec-card .j22-item.pinned {
  background: rgba(154, 132, 86, 0.05) !important;
  border-radius: 3px !important;
  border-left: none !important;
  padding-left: 10px !important;
  margin-left: 0 !important;
}
.day-block.fmt22 .sec-card .j22-item.pinned .j22-t {
  font-weight: 500 !important;
}


/* from #task-count-badge */

.day-block.fmt22 .sec-card .task-count-badge {
  position: absolute !important;
  top: 7px !important;
  right: 7px !important;
  z-index: 8 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 20px !important;
  height: 20px !important;
  padding: 0 6px !important;
  border-radius: 10px !important;
  background: rgba(28,24,18,0.82) !important;
  color: #fff !important;
  font-family: 'DM Mono', monospace !important;
  font-size: 11px !important;
  font-style: normal !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  border: 1px solid rgba(255,255,255,0.35) !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.35) !important;
  overflow: visible !important;
  white-space: nowrap !important;
}
.day-block.fmt22 .sec-card .task-count-badge:empty,
.day-block.fmt22 .sec-card .task-count-badge[data-count="0"] {
  display: none !important;
}
/* Prefer one badge system — hide duplicate card-level badge if visual .task-count exists */
.day-block.fmt22 .sec-card:has(.card-visual .task-count) > .task-count-badge {
  display: none !important;
}


/* from #task-detail-modal */

.task-modal-overlay {
  position: fixed; inset: 0; z-index: 100000;
  background: rgba(0,0,0,0.5); backdrop-filter: blur(4px);
  display: flex; align-items: center; justify-content: center;
  opacity: 0; pointer-events: none; transition: opacity 0.2s;
}
.task-modal-overlay.open { opacity: 1; pointer-events: all; }
.task-modal {
  background: #2a2723; border-radius: 16px;
  width: 90%; max-width: 420px; max-height: 80vh;
  padding: 28px 24px; overflow-y: auto;
  transform: scale(0.95); transition: transform 0.2s cubic-bezier(0.23,1,0.32,1);
  box-shadow: 0 20px 60px rgba(0,0,0,0.4);
}
.task-modal-overlay.open .task-modal { transform: scale(1); }
.task-modal-title {
  font-family: 'Newsreader', serif;
  font-size: 1.4rem; color: rgba(255,250,240,0.92);
  margin-bottom: 6px; font-weight: 500;
}
.task-modal-section {
  font-family: 'DM Mono', monospace;
  font-size: 0.65rem; text-transform: uppercase;
  letter-spacing: 1.5px; color: rgba(200,180,150,0.5);
  margin-bottom: 16px;
}
.task-modal-label {
  font-family: 'DM Mono', monospace;
  font-size: 0.6rem; text-transform: uppercase;
  letter-spacing: 1px; color: rgba(200,180,150,0.5);
  margin-top: 16px; margin-bottom: 6px;
}
.task-modal-notes {
  width: 100%; min-height: 100px; resize: vertical;
  background: rgba(255,250,240,0.04); border: 1px solid rgba(180,160,120,0.15);
  border-radius: 8px; padding: 12px; color: rgba(255,250,240,0.85);
  font-family: 'Newsreader', serif; font-size: 1rem;
  outline: none; transition: border-color 0.15s;
}
.task-modal-notes:focus { border-color: rgba(180,160,120,0.4); }
.task-modal-close {
  position: absolute; top: 16px; right: 16px;
  background: none; border: none; color: rgba(200,180,150,0.6);
  font-size: 1.2rem; cursor: pointer; padding: 4px 8px;
}
.task-modal-close:hover { color: rgba(200,180,150,0.9); }
.task-modal-deadline-input {
  background: rgba(255,250,240,0.04); border: 1px solid rgba(180,160,120,0.15);
  border-radius: 6px; padding: 8px 12px; color: rgba(255,250,240,0.85);
  font-family: 'DM Mono', monospace; font-size: 0.8rem;
  outline: none; width: 100%;
}
.task-modal-deadline-input:focus { border-color: rgba(180,160,120,0.4); }
/* Linked chats in task modal */
.task-modal-links {
  display: flex; flex-wrap: wrap; gap: 6px;
  min-height: 0; margin-bottom: 8px;
}
.task-modal-link-chip {
  display: inline-flex; align-items: center; gap: 6px;
  background: linear-gradient(135deg, rgba(180,160,120,0.08), rgba(180,160,120,0.14));
  border: 1px solid rgba(180,160,120,0.22);
  border-radius: 16px; padding: 5px 12px 5px 10px;
  font-family: 'DM Mono', monospace; font-size: 0.65rem;
  letter-spacing: 0.03em; color: rgba(210,190,160,0.85);
  text-decoration: none;
  transition: all 0.18s cubic-bezier(0.23,1,0.32,1);
  max-width: 280px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  box-shadow: 0 1px 3px rgba(0,0,0,0.12);
}
.task-modal-link-chip:hover {
  background: linear-gradient(135deg, rgba(180,160,120,0.18), rgba(180,160,120,0.28));
  border-color: rgba(200,180,140,0.45);
  color: rgba(255,250,240,0.95);
  transform: translateY(-1px);
  box-shadow: 0 2px 6px rgba(0,0,0,0.18);
}
.task-modal-link-chip .chip-icon { font-size: 11px; flex-shrink: 0; opacity: 0.7; }
.task-modal-link-chip:hover .chip-icon { opacity: 1; }
.task-modal-link-chip .chip-del {
  font-size: 12px; cursor: pointer; opacity: 0.4; margin-left: 4px; flex-shrink: 0;
  transition: opacity 0.12s;
}
.task-modal-link-chip .chip-del:hover { opacity: 1; color: rgba(255,180,180,0.9); }
.task-modal-add-link-row { display: flex; gap: 6px; align-items: center; }
.task-modal-add-link-input {
  flex: 1; background: rgba(255,250,240,0.04);
  border: 1px solid rgba(180,160,120,0.18); border-radius: 8px;
  padding: 7px 12px; color: rgba(255,250,240,0.85);
  font-family: 'DM Mono', monospace; font-size: 0.7rem; outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.task-modal-add-link-input:focus {
  border-color: rgba(180,160,120,0.45);
  box-shadow: 0 0 0 2px rgba(180,160,120,0.08);
}
.task-modal-add-link-btn {
  font-family: 'DM Mono', monospace; font-size: 0.6rem;
  letter-spacing: 0.1em; text-transform: uppercase;
  background: linear-gradient(135deg, rgba(180,160,120,0.1), rgba(180,160,120,0.18));
  border: 1px solid rgba(180,160,120,0.28);
  border-radius: 8px; padding: 6px 14px; cursor: pointer;
  color: rgba(210,190,160,0.8);
  transition: all 0.18s cubic-bezier(0.23,1,0.32,1);
  box-shadow: 0 1px 2px rgba(0,0,0,0.08);
}
.task-modal-add-link-btn:hover {
  background: linear-gradient(135deg, rgba(180,160,120,0.22), rgba(180,160,120,0.32));
  border-color: rgba(200,180,140,0.45);
  color: rgba(255,250,240,0.9);
  transform: scale(0.97);
  box-shadow: 0 2px 5px rgba(0,0,0,0.14);
}
.task-modal-add-link-btn:active {
  transform: scale(0.94);
}
.task-modal-footer {
  display: flex; justify-content: flex-end; align-items: center;
  margin-top: 20px; padding-top: 14px;
  border-top: 1px solid rgba(180,160,120,0.1);
}
.task-modal-done-wrap {
  display: flex; align-items: center; gap: 8px;
}
.task-modal-done-btn {
  font-family: 'DM Mono', monospace;
  font-size: 0.65rem; letter-spacing: 0.1em;
  text-transform: uppercase;
  background: rgba(100,180,100,0.12); border: 1px solid rgba(100,180,100,0.3);
  border-radius: 8px; padding: 7px 18px; cursor: pointer;
  color: rgba(160,220,160,0.85); transition: all 0.18s cubic-bezier(0.23,1,0.32,1);
}
.task-modal-done-btn:hover {
  background: rgba(100,180,100,0.25); border-color: rgba(100,180,100,0.5);
  transform: scale(0.97);
}
.task-modal-done-btn.is-done {
  background: rgba(100,180,100,0.25); border-color: rgba(100,180,100,0.5);
  color: rgba(180,240,180,0.95);
}
.task-modal-done-btn.is-done::before {
  content: '\2713 '; font-size: 0.75rem;
}



.sec-card .card-visual .j22-group[contenteditable="true"] { cursor:text; border-bottom:none; }
.sec-card .card-visual .j22-group[contenteditable="true"]:hover { border-bottom:none; }
.sec-card .card-visual .j22-group[contenteditable="true"]:hover::after { display:none; }
.sec-card .card-visual .j22-group[contenteditable="true"]:focus { border-bottom:none; outline:none; overflow:visible !important; white-space:normal !important; }



/* Subtask toggle system */
.j22-item .subtask-toggle { display:inline-block; width:16px; cursor:pointer; font-size:10px; color:#8a7e6d; margin-right:4px; user-select:none; transition:transform 0.15s ease; }
.j22-item .subtask-toggle.expanded { transform:rotate(90deg); }
.j22-item .subtask-list { display:none; padding-left:20px; margin-top:4px; }
.j22-item .subtask-list.open { display:block; }
.j22-item .subtask-list .subtask-entry { display:flex; align-items:center; gap:6px; padding:3px 0; font-size:12px; color:#5a5549; }
.j22-item .subtask-list .subtask-entry input[type=checkbox] { width:12px; height:12px; accent-color:#8a7e6d; }
.j22-item .subtask-list .subtask-entry span { flex:1; }
.j22-item .subtask-list .subtask-entry span[contenteditable=true]:focus { outline:none; border-bottom:1px solid #c8b89a; }
.j22-item .subtask-list .subtask-entry .del-sub { cursor:pointer; font-size:10px; color:#b89a7a; opacity:0; transition:opacity 0.2s; }
.j22-item .subtask-list .subtask-entry:hover .del-sub { opacity:1; }
.j22-item .subtask-list .add-subtask-btn { cursor:pointer; font-size:11px; color:#8a7e6d; padding:3px 0; opacity:0.7; }
.j22-item .subtask-list .add-subtask-btn:hover { opacity:1; }



.day-block.fmt22 .j22-group::first-letter { text-transform: none !important; }
.day-block.fmt22 .sec-card .j22-group::first-letter { text-transform: none !important; }
.day-block.fmt22 .sec-card .card-visual .j22-group::first-letter { text-transform: none !important; }
.day-block.fmt22 .sec-card .card-body .j22-group::first-letter { text-transform: none !important; }


/* from #btm-ux-pack */

/* Hide chevron arrows after task names; open subtasks via double-click on name */
.day-block.fmt22 .sec-card .j22-item > .subtask-toggle {
  display: none !important;
}
/* Swipe-hide + Hidden rail */
.day-block.fmt22 .tv-pursuits {
  position: relative;
}
.day-block.fmt22 .sec-hidden-btn {
  position: absolute;
  top: 8px;
  right: 14px;
  z-index: 20;
  border: 1px solid rgba(154, 132, 86, 0.28);
  background: rgba(255, 250, 240, 0.55);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: rgba(90, 82, 74, 0.85);
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: lowercase;
  padding: 5px 10px;
  border-radius: 999px;
  cursor: pointer;
  opacity: 0.7;
  transition: opacity 0.15s ease, background 0.15s ease;
}
.day-block.fmt22 .sec-hidden-btn:hover,
.day-block.fmt22 .sec-hidden-btn.is-open {
  opacity: 1;
  background: rgba(255, 250, 240, 0.85);
}
.day-block.fmt22 .sec-hidden-btn:disabled {
  opacity: 0.35;
  cursor: default;
}
.day-block.fmt22.pursuit-board-day .sec-hidden-btn,
.day-block.fmt22.pursuit-board-day .sec-hidden-panel,
.day-block.fmt22.today-block .sec-hidden-btn,
.day-block.fmt22.today-block .sec-hidden-panel,
.day-block.fmt22.zone-board-day .sec-hidden-btn,
.day-block.fmt22.zone-board-day .sec-hidden-panel {
  display: none !important;
}
.day-block.fmt22 .sec-hidden-panel {
  display: none;
  position: absolute;
  top: 36px;
  right: 14px;
  z-index: 21;
  min-width: 180px;
  max-width: 240px;
  padding: 8px;
  border-radius: 12px;
  background: rgba(255, 250, 240, 0.88);
  border: 1px solid rgba(154, 132, 86, 0.22);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 10px 28px rgba(40, 30, 15, 0.12);
}
.day-block.fmt22 .sec-hidden-panel.is-open { display: block; }
.day-block.fmt22 .sec-hidden-panel .sec-hidden-empty {
  font-family: 'Newsreader', Georgia, serif;
  font-style: italic;
  font-size: 12px;
  color: rgba(90, 82, 74, 0.55);
  padding: 6px 8px;
}
.day-block.fmt22 .sec-hidden-panel button {
  display: block;
  width: 100%;
  text-align: left;
  border: none;
  background: transparent;
  padding: 7px 8px;
  border-radius: 8px;
  font-family: 'DM Sans', sans-serif;
  font-size: 12px;
  color: #2e2b26;
  cursor: pointer;
}
.day-block.fmt22 .sec-hidden-panel button:hover {
  background: rgba(154, 132, 86, 0.12);
}
.day-block.fmt22 .sec-card.is-swiping {
  transition: none !important;
  z-index: 5;
  will-change: transform, opacity;
}
.day-block.fmt22 .sec-card.is-hiding {
  transition: transform 0.28s ease, opacity 0.28s ease !important;
  opacity: 0;
  pointer-events: none;
}
.day-block.fmt22 .sec-card.is-card-hidden,
.day-block.fmt22 .sec-grid .sec-card.is-card-hidden,
.day-block.fmt22 .sec-grid.freeform > .sec-card.is-card-hidden {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  margin: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
}
/* Prefer horizontal swipe over scroll/Sortable fight */
.day-block.fmt22 .sec-card .card-body {
  touch-action: pan-y;
}
.day-block.fmt22 .sec-card {
  touch-action: pan-y;
}
/* Task rows: grab to rearrange (all fmt22 days, including today) */
.day-block.fmt22 .sec-card .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2) {
  cursor: grab;
  touch-action: none;
}
.day-block.fmt22 .sec-card .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2):active {
  cursor: grabbing;
}
.j22-sortable-ghost { opacity: 0.35; }
.j22-sortable-chosen { opacity: 0.92; }
/* Manual collapse (cards with tasks): photo-only square (same tile size) */
.day-block.fmt22 .sec-card.card-collapsed.has-tasks {
  width: 148px !important;
  height: 148px !important;
  max-width: 148px !important;
  max-height: 148px !important;
  flex: 0 0 148px !important;
  aspect-ratio: 1 / 1 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}
.day-block.fmt22 .sec-card.card-collapsed.has-tasks .card-visual {
  position: absolute !important;
  inset: 0 !important;
  height: 100% !important;
  flex: none !important;
  display: block !important;
}
.day-block.fmt22 .sec-card.card-collapsed.has-tasks .card-visual img {
  opacity: 0.85 !important;
  filter: none !important;
}
.day-block.fmt22 .sec-card.card-collapsed.has-tasks .card-body {
  display: none !important;
}
.day-block.fmt22 .sec-card.card-collapsed.has-tasks .card-add-task {
  display: flex !important;
  opacity: 1 !important;
}


/* from #pursuit-category-rows */

/* Sidebar rows only for legacy category grids — never the freeform vision canvas */
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-grid.pursuit-categories:not(.pursuit-canvas),
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-grid.freeform.pursuit-categories:not(.pursuit-canvas) {
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  gap: 12px !important;
  width: 100% !important;
}
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-grid.pursuit-canvas,
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-grid.freeform.pursuit-canvas {
  display: block !important;
  flex-direction: unset !important;
  flex-wrap: unset !important;
  position: relative !important;
}
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-grid.pursuit-canvas .pursuit-zone,
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-grid.freeform.pursuit-canvas .pursuit-zone {
  display: block !important;
  flex-direction: unset !important;
  position: absolute !important;
}
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-grid:not(.pursuit-canvas) .pursuit-zone {
  display: flex !important;
  flex-direction: row !important;
  align-items: stretch !important;
  gap: 10px !important;
  width: 100% !important;
  position: relative !important;
  top: auto !important;
  left: auto !important;
}
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-grid:not(.pursuit-canvas) .pursuit-zone-head {
  flex: 0 0 158px !important;
  width: 158px !important;
  min-height: 148px !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  position: relative !important;
  background: rgba(245,240,233,0.42) !important;
  border: 1px solid rgba(255,255,255,0.22) !important;
  box-sizing: border-box !important;
}
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-grid:not(.pursuit-canvas) .pursuit-zone-head img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  opacity: 0.38 !important;
}
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-grid:not(.pursuit-canvas) .pursuit-zone-kicker {
  display: none !important;
}
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-grid:not(.pursuit-canvas) .pursuit-zone-title {
  position: relative !important;
  z-index: 1 !important;
  font-family: "Newsreader", Georgia, serif !important;
  font-size: 22px !important;
  font-weight: 400 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  color: #2c281f !important;
  padding: 2px 12px 6px !important;
  margin: 0 !important;
}
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-grid:not(.pursuit-canvas) .pursuit-zone-subs {
  position: relative !important;
  z-index: 1 !important;
  font-family: "DM Mono", monospace !important;
  font-size: 8px !important;
  letter-spacing: 0.04em !important;
  color: #8a8070 !important;
  padding: 0 12px 12px !important;
  line-height: 1.45 !important;
}
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-grid:not(.pursuit-canvas) .pursuit-zone-cards {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  flex: 1 1 auto !important;
  align-items: flex-start !important;
  min-width: 0 !important;
}
.day-block.fmt22:not(.today-block):not(.zone-board-day):not(.pursuit-board-day) .sec-grid:not(.pursuit-canvas) .add-pursuit-slot {
  width: 148px !important;
  height: 148px !important;
  flex: 0 0 148px !important;
  border-radius: 10px !important;
  border: 1px dashed rgba(110,100,86,0.32) !important;
  background: rgba(255,255,255,0.18) !important;
  color: #8a8070 !important;
  font-family: "DM Mono", monospace !important;
  font-size: 8px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  cursor: pointer !important;
}
.day-block.fmt22:not(.today-block) .add-pursuit-slot span { font-size: 18px; line-height: 1; font-weight: 300; }

.day-block.today-block .pursuit-zoom-host,
.day-block.zone-board-day .pursuit-zoom-host {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
  position: relative;
  transform: none;
}
.day-block.today-block .zone-zoom-out,
.day-block.zone-board-day .zone-zoom-out {
  position: absolute;
  top: 8px;
  right: 12px;
  z-index: 80;
  border: 0;
  border-radius: 999px;
  padding: 7px 14px;
  font-family: "DM Mono", monospace;
  font-size: 9px;
  letter-spacing: 0.14em;
  text-transform: lowercase;
  background: rgba(245,240,233,0.92);
  color: #2c281f;
  cursor: pointer;
}
.day-block.today-block .sec-grid.zone-zoomed,
.day-block.zone-board-day .sec-grid.zone-zoomed {
  width: 100% !important;
  height: 720px !important;
  min-height: 720px !important;
  transform: none !important;
}
.day-block.today-block .sec-grid.zone-zoomed > .pursuit-zone:not(.is-zoomed),
.day-block.zone-board-day .sec-grid.zone-zoomed > .pursuit-zone:not(.is-zoomed) {
  display: none !important;
}
.day-block.today-block .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed,
.day-block.zone-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed {
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 4;
}
.day-block.today-block .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed,
.day-block.zone-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed {
  background: none !important;
  background-color: transparent !important;
}
.day-block.today-block .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed::before,
.day-block.zone-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed::before {
  background-image: var(--zone-photo) !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  opacity: 1 !important;
  inset: 0 !important;
}
.day-block.today-block .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .add-pursuit-slot,
.day-block.zone-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .add-pursuit-slot,
.day-block.today-block .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .zone-resize,
.day-block.zone-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .zone-resize {
  display: none !important;
}
.day-block.today-block .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .pursuit-zone-grid,
.day-block.zone-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .pursuit-zone-grid {
  display: none !important;
}
.day-block.today-block .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .pursuit-zone-grid > .sec-card,
.day-block.zone-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .pursuit-zone-grid > .sec-card {
  position: absolute !important;
  left: var(--ff-x, 8px) !important;
  top: var(--ff-y, 8px) !important;
  width: var(--card-w, 118px) !important;
  height: var(--card-h, 118px) !important;
  pointer-events: auto !important;
}
.day-block.today-block .sec-grid.zone-zoomed .zone-resize,
.day-block.zone-board-day .sec-grid.zone-zoomed .zone-resize {
  display: none !important;
}
.day-block.today-block .sec-grid.pursuit-canvas,
.day-block.zone-board-day .sec-grid.pursuit-canvas,
.day-block.pursuit-board-day .sec-grid.pursuit-canvas,
.day-block[data-date="2026-08-20"] .sec-grid.pursuit-canvas,
.day-block.today-block .sec-grid.freeform.pursuit-canvas,
.day-block.zone-board-day .sec-grid.freeform.pursuit-canvas,
.day-block.pursuit-board-day .sec-grid.freeform.pursuit-canvas,
.day-block[data-date="2026-08-20"] .sec-grid.freeform.pursuit-canvas {
  position: relative !important;
  display: block !important;
  grid-template-columns: none !important;
  flex-wrap: unset !important;
  gap: 0 !important;
  width: var(--canvas-w, 100%) !important;
  max-width: none !important;
  min-width: 0 !important;
  min-height: var(--canvas-h, 720px) !important;
  height: var(--canvas-h, 720px) !important;
  max-height: none !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  padding: 0 !important;
  transform: scale(var(--board-scale, 1)) !important;
  transform-origin: 0 0 !important;
}
.day-block.today-block .sec-grid.pursuit-canvas.item-dragging {
  overflow: visible !important;
}
.day-block.today-block .sec-grid.pursuit-canvas.item-dragging .pursuit-zone {
  overflow: visible !important;
}
.day-block.today-block .sec-grid.pursuit-canvas > .sec-card.loose-card,
html body .day-block.today-block.fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card {
  position: absolute !important;
  left: var(--ff-x, 8px) !important;
  top: var(--ff-y, 8px) !important;
  width: var(--card-w, 118px) !important;
  height: var(--card-h, 118px) !important;
  max-width: none !important;
  max-height: none !important;
  min-width: 0 !important;
  min-height: 0 !important;
  z-index: 18 !important;
  cursor: grab !important;
  touch-action: none !important;
}
.day-block.today-block .sec-grid.pursuit-canvas > .zone-oneoff.canvas-oneoff {
  position: absolute !important;
  left: var(--ff-x, 12px) !important;
  top: var(--ff-y, 52px) !important;
  width: var(--card-w, 176px);
  height: var(--card-h, 118px);
  z-index: 18;
  pointer-events: auto;
}
.day-block.today-block .pursuit-zone,
.day-block.zone-board-day .pursuit-zone,
.day-block.pursuit-board-day .pursuit-zone,
.day-block[data-date="2026-08-20"] .pursuit-zone {
  position: absolute !important;
  left: var(--ff-x, 12px);
  top: var(--ff-y, 12px);
  width: var(--zone-w, 340px);
  height: var(--zone-h, 320px);
  max-width: none !important;
  min-width: 0 !important;
  display: block !important;
  flex-direction: unset !important;
  min-height: 0 !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  background-image: none !important;
  background-color: rgba(255,252,248,0.08) !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  border: 1px solid rgba(255,255,255,0.4) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.12) !important;
  backdrop-filter: blur(12px) saturate(1.08) !important;
  -webkit-backdrop-filter: blur(12px) saturate(1.08) !important;
  cursor: default !important;
  transition: left 0.16s ease, top 0.16s ease;
}
.day-block.today-block .pursuit-zone:not(.zone-collapsed),
.day-block.zone-board-day .pursuit-zone:not(.zone-collapsed),
.day-block.pursuit-board-day .pursuit-zone:not(.zone-collapsed),
.day-block[data-date="2026-08-20"] .pursuit-zone:not(.zone-collapsed) {
  min-width: 320px !important;
  min-height: 300px !important;
}
.day-block.today-block .pursuit-zone-grid .sec-card.card:hover,
.day-block.today-block .pursuit-zone-grid .sec-card:hover {
  transform: none !important;
}
.day-block.today-block .pursuit-zone.zone-dragging {
  transition: none !important;
}
.day-block.today-block .pursuit-zone::before,
.day-block.zone-board-day .pursuit-zone::before,
.day-block[data-date="2026-08-20"] .pursuit-zone::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background-image: var(--zone-photo);
  background-size: cover;
  background-position: center;
  opacity: 0.58;
  pointer-events: none;
  z-index: 0;
}
.day-block.today-block .pursuit-zone-head,
.day-block.zone-board-day .pursuit-zone-head,
.day-block.pursuit-board-day .pursuit-zone-head,
.day-block[data-date="2026-08-20"] .pursuit-zone-head {
  position: absolute !important;
  left: 0 !important; right: 0 !important; top: 0 !important;
  z-index: 25 !important;
  width: 100% !important;
  min-height: 44px !important;
  height: 44px !important;
  flex: none !important;
  pointer-events: auto !important;
  cursor: pointer !important;
  background: linear-gradient(180deg, rgba(0,0,0,0.28), transparent) !important;
  border: none !important;
  pointer-events: auto !important;
  cursor: pointer !important;
}
.day-block.today-block .pursuit-zone-kicker,
.day-block.fmt22 .pursuit-zone-kicker {
  display: none !important;
}
.day-block.today-block .pursuit-zone-title,
.day-block.zone-board-day .pursuit-zone-title,
.day-block.pursuit-board-day .pursuit-zone-title {
  color: #fff !important;
  text-shadow: 0 1px 8px rgba(0,0,0,0.5) !important;
  font-size: 18px !important;
  padding: 10px 12px !important;
  pointer-events: auto !important;
  cursor: pointer !important;
}
.day-block.today-block .pursuit-zone.zone-collapsed,
.day-block.zone-board-day .pursuit-zone.zone-collapsed,
.day-block.pursuit-board-day .pursuit-zone.zone-collapsed,
.day-block[data-date="2026-08-20"] .pursuit-zone.zone-collapsed {
  height: 48px !important;
  min-height: 48px !important;
  width: var(--zone-w, 220px);
  overflow: hidden !important;
  opacity: 0.72;
  cursor: pointer !important;
}
.day-block.today-block .pursuit-zone.zone-collapsed .pursuit-zone-head,
.day-block.zone-board-day .pursuit-zone.zone-collapsed .pursuit-zone-head,
.day-block.pursuit-board-day .pursuit-zone.zone-collapsed .pursuit-zone-head,
.day-block[data-date="2026-08-20"] .pursuit-zone.zone-collapsed .pursuit-zone-head {
  cursor: pointer !important;
}
.day-block.today-block .pursuit-zone.zone-collapsed .pursuit-zone-grid,
.day-block.today-block .pursuit-zone.zone-collapsed .add-pursuit-slot,
.day-block.today-block .pursuit-zone.zone-collapsed .zone-resize,
.day-block.zone-board-day .pursuit-zone.zone-collapsed .pursuit-zone-grid,
.day-block.zone-board-day .pursuit-zone.zone-collapsed .add-pursuit-slot,
.day-block.zone-board-day .pursuit-zone.zone-collapsed .zone-resize,
.day-block.pursuit-board-day .pursuit-zone.zone-collapsed .pursuit-zone-grid,
.day-block.pursuit-board-day .pursuit-zone.zone-collapsed .add-pursuit-slot,
.day-block.pursuit-board-day .pursuit-zone.zone-collapsed .zone-resize,
.day-block[data-date="2026-08-20"] .pursuit-zone.zone-collapsed .pursuit-zone-grid,
.day-block[data-date="2026-08-20"] .pursuit-zone.zone-collapsed .add-pursuit-slot,
.day-block[data-date="2026-08-20"] .pursuit-zone.zone-collapsed .zone-resize {
  display: none !important;
}
.day-block.today-block .pursuit-zone-kicker,
.day-block.fmt22 .pursuit-zone-kicker {
  display: none !important;
}
.day-block.today-block .pursuit-zone-title,
.day-block.zone-board-day .pursuit-zone-title,
.day-block.pursuit-board-day .pursuit-zone-title {
  color: #fff !important;
  text-shadow: 0 1px 8px rgba(0,0,0,0.5) !important;
  font-size: 18px !important;
  padding: 10px 12px !important;
}
.day-block.today-block .pursuit-zone-grid,
.day-block.zone-board-day .pursuit-zone-grid,
.day-block.pursuit-board-day .pursuit-zone-grid {
  position: absolute !important;
  inset: 44px 8px 36px 8px !important;
  display: block !important;
  overflow: hidden !important;
  z-index: 1 !important;
}
html body .day-block.today-block.fmt22 .pursuit-zone-grid > .sec-card:not(.card-collapsed),
html body .day-block.zone-board-day.fmt22 .pursuit-zone-grid > .sec-card:not(.card-collapsed),
html body .day-block.pursuit-board-day.fmt22 .pursuit-zone-grid > .sec-card:not(.card-collapsed),
html body .day-block.today-block.fmt22 .pursuit-zone-grid > .sec-card.is-empty:not(.card-collapsed),
html body .day-block.zone-board-day.fmt22 .pursuit-zone-grid > .sec-card.is-empty:not(.card-collapsed),
html body .day-block.pursuit-board-day.fmt22 .pursuit-zone-grid > .sec-card.is-empty:not(.card-collapsed),
html body .day-block.today-block.fmt22 .pursuit-zone-grid > .sec-card.card-sized:not(.card-collapsed),
html body .day-block.zone-board-day.fmt22 .pursuit-zone-grid > .sec-card.card-sized:not(.card-collapsed) ,
html body .day-block.pursuit-board-day.fmt22 .pursuit-zone-grid > .sec-card.card-sized:not(.card-collapsed) {
  position: absolute !important;
  left: var(--ff-x, 8px) !important;
  top: var(--ff-y, 8px) !important;
  width: var(--card-w, 118px) !important;
  height: var(--card-h, 118px) !important;
  max-width: none !important;
  max-height: none !important;
  min-width: 0 !important;
  min-height: 0 !important;
  flex: none !important;
  display: flex !important;
  cursor: grab !important;
  touch-action: none !important;
  z-index: 3 !important;
  overflow: hidden !important;
}
html body .day-block.today-block.fmt22 .pursuit-zone-grid > .sec-card.card-collapsed {
  position: absolute !important;
  left: var(--ff-x, 8px) !important;
  top: var(--ff-y, 8px) !important;
  width: var(--card-w, 118px) !important;
  height: 44px !important;
  max-height: 44px !important;
  min-height: 44px !important;
  --card-h: 44px !important;
  aspect-ratio: auto !important;
  overflow: hidden !important;
  display: flex !important;
  z-index: 3 !important;
  cursor: pointer !important;
}
.day-block.today-block .pursuit-zone-grid .card-del {
  position: absolute !important;
  top: 4px !important;
  right: 4px !important;
  width: 22px !important;
  height: 22px !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: rgba(44,40,31,0.55) !important;
  color: #f5f0e9 !important;
  font-size: 16px !important;
  line-height: 22px !important;
  padding: 0 !important;
  cursor: pointer !important;
  z-index: 90 !important;
  opacity: 0;
  pointer-events: auto !important;
}
.day-block.today-block .pursuit-zone-grid .sec-card:hover .card-del,
.day-block.today-block .pursuit-zone-grid .card-del:focus {
  opacity: 1;
}
.day-block.today-block .pursuit-zone-grid .card-resize,
.day-block.today-block .zone-oneoff .oneoff-resize {
  position: absolute !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 28px !important;
  height: 28px !important;
  cursor: nwse-resize !important;
  z-index: 80 !important;
  pointer-events: auto !important;
  background: none !important;
}
.day-block.today-block .pursuit-zone-grid .card-resize::after,
.day-block.today-block .pursuit-zone-grid .sec-card:hover .card-resize::after,
.day-block.today-block .pursuit-zone-grid .sec-card.resizing .card-resize::after {
  display: none !important;
  content: none !important;
  opacity: 0 !important;
  border: 0 !important;
}
.day-block.today-block .add-pursuit-slot,
.day-block.zone-board-day .add-pursuit-slot,
.day-block.pursuit-board-day .add-pursuit-slot {
  position: absolute !important;
  left: auto !important;
  top: auto !important;
  right: 2px !important;
  bottom: 2px !important;
  width: 20px !important;
  height: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: none !important;
  border-radius: 50% !important;
  background: transparent !important;
  border: none !important;
  color: #fff !important;
  text-shadow: 0 1px 6px rgba(0,0,0,0.55) !important;
  z-index: 150 !important;
  cursor: pointer !important;
  pointer-events: auto !important;
}
.day-block.today-block .zone-resize,
.day-block.zone-board-day .zone-resize {
  display: block !important;
  position: absolute !important;
  left: auto !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 22px !important;
  height: 22px !important;
  cursor: nwse-resize !important;
  z-index: 50 !important;
  pointer-events: auto !important;
  background: none !important;
  box-shadow: none !important;
  border: 0 !important;
}
.day-block.today-block .zone-resize::before,
.day-block.today-block .zone-resize::after,
.day-block.zone-board-day .zone-resize::before,
.day-block.zone-board-day .zone-resize::after {
  display: none !important;
  content: none !important;
  border: 0 !important;
}
.day-block.today-block .plus-picker ,
.day-block.zone-board-day .plus-picker {
  position: absolute;
  right: 10px;
  left: auto;
  bottom: 52px;
  z-index: 90;
  width: min(240px, calc(100% - 20px));
  max-height: 220px;
  overflow: auto;
  padding: 8px;
  border-radius: 12px;
  background: rgba(245,240,233,0.96);
  box-shadow: 0 10px 28px rgba(0,0,0,0.18);
}
.day-block.today-block .plus-picker-list ,
.day-block.zone-board-day .plus-picker-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 8px;
}
.day-block.today-block .plus-picker-opt ,
.day-block.zone-board-day .plus-picker-opt {
  border: 0;
  background: transparent;
  text-align: left;
  font-family: "DM Mono", monospace;
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: lowercase;
  color: #2c281f;
  padding: 6px 8px;
  border-radius: 8px;
  cursor: pointer;
}
.day-block.today-block .plus-picker-opt:hover {
  background: rgba(44,40,31,0.08);
}
.day-block.today-block .plus-picker-new {
  display: flex;
  gap: 6px;
}
.day-block.today-block .plus-picker .plus-name-input {
  position: static;
  left: auto;
  bottom: auto;
  width: auto;
  flex: 1;
  height: 28px;
}
.day-block.today-block .plus-picker-label {
  margin: 8px 0 4px;
  font-family: "DM Mono", monospace;
  font-size: 8px;
  letter-spacing: 0.12em;
  text-transform: lowercase;
  color: #8a8070;
}
.day-block.today-block .zone-oneoffs {
  position: absolute;
  inset: 0;
  z-index: 4;
  pointer-events: none;
}
.day-block.today-block .zone-oneoff {
  pointer-events: auto;
  position: absolute;
  left: var(--ff-x, 12px);
  top: var(--ff-y, 52px);
  width: var(--card-w, 176px);
  height: var(--card-h, 118px);
  display: block;
  padding: 0;
  overflow: hidden;
  background: #1c1814;
  box-shadow: 1px 2px 8px rgba(40,28,18,0.35);
  border-radius: 4px;
  cursor: grab;
  touch-action: none;
  z-index: 5;
}
.day-block.today-block .zone-oneoff-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
}
.day-block.today-block .zone-oneoff-bar {
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  bottom: auto;
  transform: translateY(-50%);
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px 14px;
  background: none;
  text-align: center;
}
.day-block.today-block .zone-oneoff-t {
  flex: 0 1 auto;
  min-width: 0;
  font-family: "Reenie Beanie", cursive;
  font-size: 34px;
  line-height: 0.95;
  color: #f7f1e6;
  -webkit-text-fill-color: #f7f1e6;
  -webkit-text-stroke: 0;
  text-shadow: 0 1px 8px rgba(0,0,0,0.55);
  overflow: hidden;
  text-align: center;
}
.day-block.today-block .zone-oneoff.need-halo .zone-oneoff-t {
  text-shadow:
    0 1px 2px #000,
    0 0 8px #000,
    0 0 16px rgba(0,0,0,0.95),
    0 0 28px rgba(0,0,0,0.7);
}
.day-block.today-block .zone-oneoff-n {
  display: none !important;
}
.day-block.today-block .sec-card .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2)::before,
.day-block.today-block .sec-card.has-tasks .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2)::before {
  content: none !important;
  display: none !important;
}
.day-block.today-block .zone-oneoff-del {
  position: absolute;
  top: 4px;
  right: 4px;
  z-index: 3;
  border: 0;
  background: rgba(20,16,12,0.45);
  color: #f7f1e6;
  cursor: pointer;
  font-size: 16px;
  line-height: 1;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  padding: 0;
}
.day-block.today-block .pursuit-zone.zone-collapsed .zone-oneoffs {
  display: none !important;
}
html body .day-block.today-block.fmt22 .pursuit-zone-grid > .sec-card .card-visual,
html body .day-block.today-block.fmt22 .pursuit-zone-grid > .sec-card.is-empty .card-visual,
html body .day-block.today-block.fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card .card-visual {
  position: absolute !important;
  inset: 0 !important;
  height: 100% !important;
  width: 100% !important;
  padding: 0 !important;
  overflow: hidden !important;
}
html body .day-block.today-block.fmt22 .pursuit-zone-grid > .sec-card .card-visual img,
html body .day-block.today-block.fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card .card-visual img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 0 !important;
  opacity: 1 !important;
}
html body .day-block.today-block.fmt22 .sec-card.hide-card-title .j22-group,
html body .day-block.today-block.fmt22 .sec-card.hide-card-title .card-visual .j22-group {
  display: none !important;
}
html body .day-block.today-block.fmt22 .sec-card .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2)::before,
html body .day-block.today-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2)::before {
  content: none !important;
  display: none !important;
  counter-increment: none !important;
}
html body .day-block.today-block.fmt22 .sec-card .pin-badge,
html body .day-block.today-block.fmt22 .sec-card .fn-num {
  display: none !important;
}
html body .day-block.today-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2) {
  background: transparent !important;
  box-shadow: none !important;
  -webkit-clip-path: none !important;
  clip-path: none !important;
  padding: 0 !important;
  transform: translate(-50%, -50%) !important;
  justify-content: center !important;
  text-align: center !important;
  max-width: 90% !important;
  z-index: 8 !important;
  overflow: visible !important;
}
html body .day-block.today-block.fmt22 .sec-card.has-tasks {
  overflow: visible !important;
}
html body .day-block.today-block.fmt22 .sec-card.has-tasks .agenda-check {
  display: none !important;
}
html body .day-block.today-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2):hover {
  background: transparent !important;
}
html body .day-block.today-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-t,
html body .day-block.today-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items .j22-t,
html body .day-block.today-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item .j22-t,
html body .day-block.today-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2) .j22-t {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  -webkit-text-stroke: 0 !important;
  text-shadow: none !important;
  font-family: "Reenie Beanie", cursive !important;
  font-size: 28px !important;
  font-style: normal !important;
  font-weight: 400 !important;
}
html body .day-block.today-block.fmt22 .pursuit-zone-grid > .sec-card .card-visual .j22-group,
html body .day-block.today-block.fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card .card-visual .j22-group {
  position: absolute !important;
  left: 0 !important;
  right: auto !important;
  top: 0 !important;
  bottom: auto !important;
  width: auto !important;
  max-width: calc(100% - 36px) !important;
  margin: 0 !important;
  padding: 9px 12px 0 10px !important;
  text-align: left !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  font-family: "Newsreader", Georgia, serif !important;
  font-style: italic !important;
  font-weight: 400 !important;
  font-size: 12px !important;
  letter-spacing: 0.04em !important;
  text-transform: none !important;
  color: #fff !important;
  text-shadow: 0 1px 8px rgba(0,0,0,0.7) !important;
  background: none !important;
  pointer-events: auto !important;
  cursor: pointer !important;
  z-index: 8 !important;
}
html body .day-block.today-block.fmt22 .sec-card.hide-card-title .j22-group,
html body .day-block.today-block.fmt22 .sec-card.hide-card-title .card-visual .j22-group {
  display: none !important;
}
.day-block.today-block .card-collapse-tick {
  position: absolute;
  top: 8px;
  left: 8px;
  z-index: 9;
  width: 16px;
  height: 10px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  pointer-events: auto;
}
.day-block.today-block .sec-card:not(.hide-card-title) .card-collapse-tick {
  display: none;
}
.day-block.today-block .card-collapse-tick::before,
.day-block.today-block .card-collapse-tick::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 1.5px;
  border-radius: 2px;
  background: rgba(255,255,255,0.82);
  box-shadow: 0 1px 4px rgba(0,0,0,0.45);
}
.day-block.today-block .card-collapse-tick::before { top: 2px; }
.day-block.today-block .card-collapse-tick::after { top: 6px; width: 10px; }
html body .day-block.today-block.fmt22 .pursuit-zone-grid > .sec-card.card-collapsed,
html body .day-block.today-block.fmt22 .pursuit-zone-grid > .sec-card.card-collapsed.is-empty,
html body .day-block.today-block.fmt22 .pursuit-zone-grid > .sec-card.card-collapsed.card-sized,
html body .day-block.today-block.fmt22 .pursuit-zone-grid > .sec-card.card-collapsed.has-tasks,
html body .day-block.today-block.fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card.card-collapsed {
  --card-h: 44px !important;
  height: 44px !important;
  max-height: 44px !important;
  min-height: 44px !important;
  aspect-ratio: auto !important;
  overflow: hidden !important;
}
html body .day-block.today-block.fmt22 .sec-card.card-collapsed .card-body,
html body .day-block.today-block.fmt22 .sec-card.card-collapsed .j22-section-items,
html body .day-block.today-block.fmt22 .sec-card.card-collapsed .j22-item {
  display: none !important;
}
html body .day-block.today-block.fmt22 .pursuit-zone-grid > .sec-card.is-empty .card-body {
  display: none !important;
}
.day-block.today-block .pursuit-zone {
  touch-action: none !important;
}
html body .day-block.today-block.fmt22 .sec-grid.pursuit-canvas > .sec-card:not(.loose-card) {
  display: none !important;
}
html body .day-block.today-block.fmt22 .pursuit-zone-grid > .sec-card {
  display: flex !important;
}
html body .day-block.today-block.fmt22 .sec-grid.pursuit-canvas > *:not(.pursuit-zone):not(.loose-card):not(.canvas-oneoff) {
  display: none !important;
}
html body .day-block.today-block.fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card {
  display: flex !important;
}
html body .day-block.today-block.fmt22 .sec-grid.pursuit-canvas > .canvas-oneoff {
  display: block !important;
}
html body .day-block.today-block .day-tasks {
  perspective: 1400px;
}
html body .day-block.today-block .tv-panel {
  animation: none;
  transition: opacity 0.45s ease, transform 0.45s ease;
}
html body .day-block.today-block .tv-panel[style*="display: none"] {
  opacity: 0;
}
html body .day-block.today-block .today-view-toggle {
  display: flex !important;
  justify-content: center;
  gap: 0;
  margin: 8px auto 14px;
  width: min(320px, 90%);
  background: rgba(245,240,233,0.28);
  border: 1px solid rgba(255,255,255,0.35);
  border-radius: 999px;
  padding: 3px;
  backdrop-filter: blur(10px);
}
html body .day-block.today-block .tv-pill {
  flex: 1;
  border: 0 !important;
  background: transparent !important;
  border-radius: 999px !important;
  font-family: "DM Mono", monospace;
  font-size: 9px;
  letter-spacing: 0.16em;
  text-transform: lowercase;
  color: rgba(255,255,255,0.72) !important;
  padding: 8px 10px !important;
}
html body .day-block.today-block .tv-pill.active {
  background: rgba(255,255,255,0.88) !important;
  color: #2a2a25 !important;
}
html body .day-block.today-block .prayer-header-title {
  font-size: 15px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  font-family: "DM Mono", monospace;
  color: rgba(255,255,255,0.82);
}
html body .day-block.today-block .today-agenda-list {
  background: rgba(245,240,233,0.16);
  border: 1px solid rgba(255,255,255,0.22);
  border-radius: 16px;
  padding: 22px 24px;
  backdrop-filter: blur(16px);
}


/* from #zone-zoom-fill */

html body .day-block.today-block .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed,
html body .day-block.zone-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed {
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
}
html body .day-block.zone-board-day .sec-grid.pursuit-canvas,
html body .day-block.zone-board-day .sec-grid.freeform.pursuit-canvas {
  position: relative !important;
  display: block !important;
  flex-direction: unset !important;
  flex-wrap: unset !important;
  gap: 0 !important;
  columns: auto !important;
  column-count: 1 !important;
  width: var(--canvas-w, 100%) !important;
  min-height: var(--canvas-h, 720px) !important;
  height: var(--canvas-h, 720px) !important;
  overflow: hidden !important;
  transform: scale(var(--board-scale, 1)) !important;
  transform-origin: 0 0 !important;
}
html body .day-block.zone-board-day .pursuit-zone {
  position: absolute !important;
  left: var(--ff-x, 12px) !important;
  top: var(--ff-y, 12px) !important;
  width: var(--zone-w, 320px) !important;
  height: var(--zone-h, 280px) !important;
  display: block !important;
  flex-direction: unset !important;
  overflow: hidden !important;
  background-image: none !important;
}
html body .day-block.zone-board-day .pursuit-zone::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: var(--zone-photo) !important;
  background-size: cover !important;
  background-position: center !important;
  opacity: 0.58 !important;
  pointer-events: none !important;
  z-index: 0 !important;
}
html body .day-block.zone-board-day .pursuit-zone-head {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: 0 !important;
  width: 100% !important;
  height: 44px !important;
  flex: none !important;
  background: linear-gradient(180deg, rgba(0,0,0,0.28), transparent) !important;
  border: none !important;
}
html body .day-block.zone-board-day .pursuit-zone-title {
  color: #fff !important;
  text-shadow: 0 1px 8px rgba(0,0,0,0.5) !important;
  font-size: 18px !important;
  padding: 10px 12px !important;
}
html body .day-block.zone-board-day .sec-grid.zone-zoomed {
  width: 100% !important;
  height: 720px !important;
  min-height: 720px !important;
  transform: none !important;
}
html body .day-block.zone-board-day .sec-grid.zone-zoomed > .pursuit-zone:not(.is-zoomed) {
  display: none !important;
}
html body .day-block.zone-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed {
  background: none !important;
  background-color: transparent !important;
}
html body .day-block.zone-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed::before {
  background-image: var(--zone-photo) !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  opacity: 1 !important;
  inset: 0 !important;
}
html body .day-block.zone-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .add-pursuit-slot,
html body .day-block.zone-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .zone-resize {
  display: none !important;
}
html body .day-block.zone-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .pursuit-zone-grid {
  display: none !important;
}
html body .day-block.zone-board-day .pursuit-zone-grid {
  position: absolute !important;
  inset: 44px 8px 36px 8px !important;
  display: block !important;
  overflow: hidden !important;
}
html body .day-block.zone-board-day .pursuit-zone {
  overflow: hidden !important;
}
html body .day-block.zone-board-day .tv-pursuits,
html body .day-block.zone-board-day .pursuit-zoom-host,
html body .day-block.zone-board-day .sec-grid.pursuit-canvas {
  background-image: none !important;
}
html body .day-block.zone-board-day .tv-pursuits > img,
html body .day-block.zone-board-day .pursuit-zoom-host > img,
html body .day-block.zone-board-day .sec-grid.pursuit-canvas > img {
  display: none !important;
}
html body .day-block.zone-board-day .zone-oneoff,
html body .day-block.zone-board-day .zone-oneoff-img,
html body .day-block.zone-board-day .canvas-oneoff {
  display: none !important;
}
html body .day-block.zone-board-day.fmt22 .sec-grid.pursuit-canvas > .sec-card:not(.loose-card) {
  display: none !important;
}
html body .day-block.zone-board-day.fmt22 .pursuit-zone-grid > .sec-card,
html body .day-block.zone-board-day.fmt22 .pursuit-zone-grid > .sec-card.has-tasks,
html body .day-block.zone-board-day.fmt22 .pursuit-zone-grid > .sec-card.card-sized,
html body .day-block.zone-board-day.fmt22 .pursuit-zone-grid > .sec-card.has-tasks.card-sized,
html body .day-block.zone-board-day.fmt22 .pursuit-zone-grid > .sec-card.is-empty {
  position: absolute !important;
  left: var(--ff-x, 8px) !important;
  top: var(--ff-y, 8px) !important;
  width: 118px !important;
  height: 118px !important;
  min-width: 118px !important;
  min-height: 118px !important;
  max-width: 118px !important;
  max-height: 118px !important;
  --card-w: 118px !important;
  --card-h: 118px !important;
  --vb-size: 118px !important;
  flex: none !important;
  display: flex !important;
  overflow: hidden !important;
  isolation: isolate !important;
  contain: paint !important;
  transform: translateZ(0) !important;
  z-index: 3 !important;
}
html body .day-block.zone-board-day.fmt22 .pursuit-zone-grid > .sec-card .card-visual,
html body .day-block.zone-board-day.fmt22 .pursuit-zone-grid > .sec-card.has-tasks:not(.card-collapsed) .card-visual {
  position: absolute !important;
  inset: 0 !important;
  width: 118px !important;
  height: 118px !important;
  max-width: 118px !important;
  max-height: 118px !important;
  overflow: hidden !important;
}
html body .day-block.zone-board-day .pursuit-zone-grid > .sec-card .card-visual,
html body .day-block.zone-board-day .pursuit-zone-grid > .sec-card .card-visual img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: cover !important;
}
html body .day-block.zone-board-day .sec-grid,
html body .day-block.zone-board-day .sec-grid.pursuit-canvas,
html body .day-block.zone-board-day .sec-grid.freeform.pursuit-canvas {
  columns: auto !important;
  column-count: 1 !important;
  column-gap: 0 !important;
}
html body .day-block.zone-board-day .today-view-toggle,
html body .day-block.pursuit-board-day .today-view-toggle {
  display: flex !important;
  justify-content: center;
  gap: 0;
  margin: 8px auto 14px;
  width: min(320px, 90%);
  background: rgba(245,240,233,0.28);
  border: 1px solid rgba(255,255,255,0.35);
  border-radius: 999px;
  padding: 3px;
  backdrop-filter: blur(10px);
}
html body .day-block.zone-board-day .tv-pill,
html body .day-block.pursuit-board-day .tv-pill {
  flex: 1;
  border: 0 !important;
  background: transparent !important;
  border-radius: 999px !important;
  font-family: "DM Mono", monospace;
  font-size: 9px;
  letter-spacing: 0.16em;
  text-transform: lowercase;
  color: rgba(255,255,255,0.72) !important;
  padding: 8px 10px !important;
}
html body .day-block.zone-board-day .tv-pill.active,
html body .day-block.pursuit-board-day .tv-pill.active {
  background: rgba(255,255,255,0.88) !important;
  color: #2a2a25 !important;
}
html body .day-block.zone-board-day .add-pursuit-slot,
html body .day-block.pursuit-board-day .add-pursuit-slot,
html body .day-block[data-date="2026-08-20"] .add-pursuit-slot {
  position: absolute !important;
  left: auto !important;
  top: auto !important;
  right: 2px !important;
  bottom: 2px !important;
  width: 20px !important;
  height: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: none !important;
  border-radius: 50% !important;
  background: transparent !important;
  border: none !important;
  color: #fff !important;
  text-shadow: 0 1px 6px rgba(0,0,0,0.55) !important;
  z-index: 150 !important;
  pointer-events: auto !important;
}
html body .day-block.today-block .add-pursuit-slot {
  right: 2px !important;
  bottom: 2px !important;
  width: 20px !important;
  height: 20px !important;
  z-index: 150 !important;
}

/* Canvas layout, zoom, resize — same on zone-board-day as today-block */
html body .day-block.zone-board-day .day-card,
html body .day-block.zone-board-day.fmt22 .day-card ,
html body .day-block.pursuit-board-day.fmt22 .day-card {
  width: min(1600px, calc(100vw - 40px)) !important;
  max-width: min(1600px, calc(100vw - 40px)) !important;
}
html body .day-block.zone-board-day .pursuit-zone,
html body .day-block.today-block .pursuit-zone {
  touch-action: none !important;
}
html body .day-block.zone-board-day .sec-grid.pursuit-canvas.item-dragging,
html body .day-block.today-block .sec-grid.pursuit-canvas.item-dragging {
  overflow: visible !important;
}
html body .day-block.zone-board-day .pursuit-zone.zone-dragging,
html body .day-block.today-block .pursuit-zone.zone-dragging {
  transition: none !important;
}

html body .day-block.zone-board-day .zone-resize,
html body .day-block.today-block .zone-resize {
  display: block !important;
  position: absolute !important;
  right: 0 !important;
  bottom: 0 !important;
  left: auto !important;
  top: auto !important;
  width: 32px !important;
  height: 32px !important;
  cursor: nwse-resize !important;
  z-index: 140 !important;
  pointer-events: auto !important;
  background: transparent !important;
  touch-action: none !important;
}
html body .day-block.zone-board-day .zone-resize::before,
html body .day-block.today-block .zone-resize::before {
  display: none !important;
  content: none !important;
}
html body .day-block.zone-board-day .zone-resize::after,
html body .day-block.today-block .zone-resize::after {
  display: none !important;
  content: none !important;
  opacity: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Full-bleed zoom: --zone-photo cover (never contain / letterbox / pillarbox), no title/sidebar leftover */
html body .day-block.zone-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed,
html body .day-block.today-block .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed {
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: none !important;
  background-color: transparent !important;
  overflow: hidden !important;
}
html body .day-block.zone-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed::before,
html body .day-block.today-block .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed::before {
  background-image: var(--zone-photo) !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  opacity: 1 !important;
  inset: 0 !important;
  z-index: 6 !important;
  pointer-events: none !important;
}
html body .day-block.zone-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .pursuit-zone-grid,
html body .day-block.today-block .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .pursuit-zone-grid,
html body .day-block.zone-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .add-pursuit-slot,
html body .day-block.today-block .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .add-pursuit-slot,
html body .day-block.zone-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .plus-picker,
html body .day-block.today-block .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .plus-picker,
html body .day-block.zone-board-day .sec-grid.zone-zoomed .zone-resize,
html body .day-block.today-block .sec-grid.zone-zoomed .zone-resize {
  display: none !important;
}

html body .day-block.zone-board-day .zone-oneoff,
html body .day-block.zone-board-day .zone-oneoff-img,
html body .day-block.zone-board-day .canvas-oneoff,
html body .day-block.zone-board-day .zone-oneoffs {
  display: none !important;
}

html body .day-block.zone-board-day .pursuit-zoom-host:has(.zone-zoomed) > .zone-zoom-out,
html body .day-block.today-block .pursuit-zoom-host:has(.zone-zoomed) > .zone-zoom-out {
  display: block !important;
  visibility: visible !important;
  pointer-events: auto !important;
  z-index: 200 !important;
}


/* from #pursuit-board-day-canvas */

/* Aug 20 board — left-aligned date like other days; centered toggle only */
html body .day-block.pursuit-board-day[data-date="2026-08-20"] .day-card,
html body .day-block[data-date="2026-08-20"].pursuit-board-day .day-card {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  width: min(1600px, calc(100vw - 40px)) !important;
  max-width: min(1600px, calc(100vw - 40px)) !important;
}
html body .day-block[data-date="2026-08-20"] .day-card-header {
  align-self: stretch !important;
  width: 100% !important;
  justify-content: flex-start !important;
  text-align: left !important;
}
html body .day-block[data-date="2026-08-20"].collapsed .day-card {
  display: block !important;
  width: auto !important;
  max-width: none !important;
}
html body .day-block[data-date="2026-08-20"].collapsed .day-card-header {
  justify-content: flex-start !important;
  text-align: left !important;
}
html body .day-block[data-date="2026-08-20"] .today-view-toggle {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  align-self: center !important;
  gap: 0 !important;
  margin: 8px auto 14px !important;
  width: min(320px, 90%) !important;
  max-width: min(320px, 90%) !important;
  background: rgba(245,240,233,0.28) !important;
  border: 1px solid rgba(255,255,255,0.35) !important;
  border-radius: 999px !important;
  padding: 3px !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}
html body .day-block[data-date="2026-08-20"] .tv-pill {
  flex: 1 !important;
  border: 0 !important;
  background: transparent !important;
  border-radius: 999px !important;
  font-family: "DM Mono", monospace !important;
  font-size: 9px !important;
  letter-spacing: 0.16em !important;
  text-transform: lowercase !important;
  color: rgba(255,255,255,0.72) !important;
  padding: 8px 10px !important;
}
html body .day-block[data-date="2026-08-20"] .tv-pill.active {
  background: rgba(255,255,255,0.88) !important;
  color: #2a2a25 !important;
}
html body .day-block[data-date="2026-08-20"] .day-tasks,
html body .day-block[data-date="2026-08-20"] .tv-panel.tv-pursuits,
html body .day-block[data-date="2026-08-20"] .tv-panel.tv-pursuits.active {
  width: 100% !important;
  max-width: 100% !important;
  align-self: stretch !important;
  box-sizing: border-box !important;
}
html body .day-block.pursuit-board-day .sec-grid.pursuit-canvas,
html body .day-block.pursuit-board-day .sec-grid.freeform.pursuit-canvas,
html body .day-block[data-date="2026-08-20"] .sec-grid.pursuit-canvas,
html body .day-block[data-date="2026-08-20"] .sec-grid.freeform.pursuit-categories {
  position: relative !important;
  display: block !important;
  flex-direction: unset !important;
  flex-wrap: unset !important;
  align-items: unset !important;
  gap: 0 !important;
  width: var(--canvas-w, 100%) !important;
  min-height: var(--canvas-h, 580px) !important;
  height: var(--canvas-h, 580px) !important;
  overflow: hidden !important;
  transform: scale(var(--board-scale, 1)) !important;
  transform-origin: 0 0 !important;
}
html body .day-block.pursuit-board-day .pursuit-zone,
html body .day-block[data-date="2026-08-20"] .pursuit-zone {
  position: absolute !important;
  display: block !important;
  flex-direction: unset !important;
  flex: none !important;
  align-items: unset !important;
  gap: 0 !important;
  left: var(--ff-x, 12px) !important;
  top: var(--ff-y, 12px) !important;
  width: var(--zone-w, 320px) !important;
  height: var(--zone-h, 280px) !important;
  overflow: hidden !important;
  background-image: none !important;
  border-radius: 14px !important;
  border: 1px solid rgba(255,255,255,0.42) !important;
  box-shadow: 0 12px 28px rgba(20,12,8,0.28) !important;
}
html body .day-block.pursuit-board-day .pursuit-zone:not(.is-zoomed)::before,
html body .day-block[data-date="2026-08-20"] .pursuit-zone:not(.is-zoomed)::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: var(--zone-photo) !important;
  background-size: cover !important;
  background-position: center !important;
  opacity: 0.58 !important;
  pointer-events: none !important;
  z-index: 0 !important;
}
html body .day-block.pursuit-board-day .pursuit-zone-head,
html body .day-block[data-date="2026-08-20"] .pursuit-zone-head {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: 0 !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 44px !important;
  flex: none !important;
  z-index: 30 !important;
  pointer-events: auto !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, rgba(0,0,0,0.28), transparent) !important;
  border: none !important;
}
html body .day-block.pursuit-board-day .pursuit-zone-head img,
html body .day-block[data-date="2026-08-20"] .pursuit-zone-head img {
  display: none !important;
}
html body .day-block.pursuit-board-day .pursuit-zone-subs,
html body .day-block.pursuit-board-day .pursuit-zone-cards,
html body .day-block[data-date="2026-08-20"] .pursuit-zone-subs,
html body .day-block[data-date="2026-08-20"] .pursuit-zone-cards {
  display: none !important;
}
html body .day-block.pursuit-board-day .pursuit-zone-grid,
html body .day-block[data-date="2026-08-20"] .pursuit-zone-grid {
  position: absolute !important;
  inset: 44px 8px 36px 8px !important;
  display: block !important;
  overflow: hidden !important;
  z-index: 1 !important;
}
html body .day-block.pursuit-board-day .add-pursuit-slot,
html body .day-block[data-date="2026-08-20"] .add-pursuit-slot {
  position: absolute !important;
  left: auto !important;
  top: auto !important;
  right: 4px !important;
  bottom: 4px !important;
  width: 22px !important;
  height: 22px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: none !important;
  background: rgba(20,16,12,0.42) !important;
  border: 1px solid rgba(255,255,255,0.35) !important;
  border-radius: 50% !important;
  color: #fff !important;
  text-shadow: none !important;
  z-index: 150 !important;
}
html body .day-block.today-block .add-pursuit-slot,
html body .day-block.zone-board-day .add-pursuit-slot {
  right: 4px !important;
  bottom: 4px !important;
  width: 22px !important;
  height: 22px !important;
  background: rgba(20,16,12,0.42) !important;
  border: 1px solid rgba(255,255,255,0.35) !important;
  border-radius: 50% !important;
  text-shadow: none !important;
  z-index: 150 !important;
}
html body .day-block.today-block .add-pursuit-slot span,
html body .day-block.zone-board-day .add-pursuit-slot span,
html body .day-block.pursuit-board-day .add-pursuit-slot span,
html body .day-block[data-date="2026-08-20"] .add-pursuit-slot span {
  font-size: 16px !important;
  line-height: 1 !important;
  font-weight: 400 !important;
  transform: none !important;
}
html body .day-block.pursuit-board-day .zone-resize,
html body .day-block[data-date="2026-08-20"] .zone-resize {
  display: block !important;
  position: absolute !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 32px !important;
  height: 32px !important;
}
html body .day-block.pursuit-board-day .pursuit-zoom-host,
html body .day-block[data-date="2026-08-20"] .pursuit-zoom-host {
  width: 100% !important;
  overflow: hidden !important;
  position: relative !important;
}
html body .day-block.pursuit-board-day .pursuit-zoom-host:has(.zone-zoomed),
html body .day-block[data-date="2026-08-20"] .pursuit-zoom-host:has(.zone-zoomed) {
  display: block !important;
  width: 100% !important;
  overflow: hidden !important;
  margin: 0 !important;
}

/* Zoomed section: bigger Ambition (etc), still a section with its cards */
html body .day-block.pursuit-board-day .sec-grid.zone-zoomed,
html body .day-block.pursuit-board-day .sec-grid.pursuit-canvas.zone-zoomed,
html body .day-block[data-date="2026-08-20"] .sec-grid.zone-zoomed,
html body .day-block[data-date="2026-08-20"] .sec-grid.pursuit-canvas.zone-zoomed {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: 720px !important;
  min-height: 720px !important;
  max-width: none !important;
  transform: none !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  margin: 0 !important;
}
html body .day-block.pursuit-board-day .sec-grid.zone-zoomed > .pursuit-zone:not(.is-zoomed),
html body .day-block[data-date="2026-08-20"] .sec-grid.zone-zoomed > .pursuit-zone:not(.is-zoomed) {
  display: none !important;
}
html body .day-block.pursuit-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed,
html body .day-block[data-date="2026-08-20"] .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed {
  position: absolute !important;
  left: 16px !important;
  top: 16px !important;
  right: 16px !important;
  bottom: 16px !important;
  width: auto !important;
  height: auto !important;
  border-radius: 14px !important;
  border: 1px solid rgba(255,255,255,0.4) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.12) !important;
  overflow: hidden !important;
  margin: 0 !important;
  transform: none !important;
  background: rgba(255,252,248,0.08) !important;
}
html body .day-block.pursuit-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed::before,
html body .day-block[data-date="2026-08-20"] .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed::before {
  display: block !important;
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: var(--zone-photo) !important;
  background-size: cover !important;
  background-position: center !important;
  opacity: 0.72 !important;
  z-index: 0 !important;
  pointer-events: none !important;
}
html body .day-block.pursuit-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .zone-resize,
html body .day-block[data-date="2026-08-20"] .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .zone-resize {
  display: none !important;
}
html body .day-block.pursuit-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .pursuit-zone-head,
html body .day-block[data-date="2026-08-20"] .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .pursuit-zone-head {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 80 !important;
}
html body .day-block.pursuit-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .pursuit-zone-grid,
html body .day-block[data-date="2026-08-20"] .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .pursuit-zone-grid {
  display: block !important;
  inset: 52px 16px 16px 16px !important;
  overflow: visible !important;
  z-index: 6 !important;
  pointer-events: auto !important;
}
html body .day-block.pursuit-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .add-pursuit-slot,
html body .day-block[data-date="2026-08-20"] .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .add-pursuit-slot {
  display: flex !important;
  z-index: 8 !important;
}
html body .day-block.pursuit-board-day.zone-page-zoom .day-card-header,
html body .day-block.pursuit-board-day.zone-page-zoom .today-view-toggle,
html body .day-block[data-date="2026-08-20"].zone-page-zoom .day-card-header,
html body .day-block[data-date="2026-08-20"].zone-page-zoom .today-view-toggle {
  display: none !important;
}
html body .day-block.pursuit-board-day.zone-page-zoom .day-card,
html body .day-block[data-date="2026-08-20"].zone-page-zoom .day-card {
  display: block !important;
  width: min(1600px, calc(100vw - 40px)) !important;
  max-width: min(1600px, calc(100vw - 40px)) !important;
  padding: 0 !important;
  overflow: hidden !important;
}
html body .day-block.pursuit-board-day.zone-page-zoom .day-tasks,
html body .day-block[data-date="2026-08-20"].zone-page-zoom .day-tasks,
html body .day-block.pursuit-board-day.zone-page-zoom .tv-panel.tv-pursuits,
html body .day-block[data-date="2026-08-20"].zone-page-zoom .tv-panel.tv-pursuits {
  width: 100% !important;
  max-width: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
html body .day-block.pursuit-board-day .pursuit-zoom-host:has(.zone-zoomed) > .zone-zoom-out,
html body .day-block[data-date="2026-08-20"] .pursuit-zoom-host:has(.zone-zoomed) > .zone-zoom-out {
  display: block !important;
  z-index: 90 !important;
}

/* Collapsed Aug 20 must look like other past days, not pinned open */
html body .day-block.pursuit-board-day.fmt22.collapsed .day-card,
html body .day-block[data-date="2026-08-20"].fmt22.collapsed .day-card {
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html body .day-block.pursuit-board-day.collapsed .day-tasks,
html body .day-block.pursuit-board-day.collapsed .today-view-toggle,
html body .day-block[data-date="2026-08-20"].collapsed .day-tasks,
html body .day-block[data-date="2026-08-20"].collapsed .today-view-toggle {
  display: none !important;
}

html body .day-block.pursuit-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .pursuit-zone-grid > .sec-card,
html body .day-block[data-date="2026-08-20"] .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .pursuit-zone-grid > .sec-card {
  display: flex !important;
  position: absolute !important;
  left: var(--ff-x, 8px) !important;
  top: var(--ff-y, 8px) !important;
  width: var(--card-w, 148px) !important;
  height: var(--card-h, 148px) !important;
  z-index: 7 !important;
  pointer-events: auto !important;
  opacity: 1 !important;
}
html body .day-block.pursuit-board-day .sec-grid.zone-zoomed > .sec-card.loose-card,
html body .day-block.pursuit-board-day .sec-grid.zone-zoomed > .zone-oneoff,
html body .day-block.pursuit-board-day .sec-grid.zone-zoomed > .canvas-oneoff,
html body .day-block[data-date="2026-08-20"] .sec-grid.zone-zoomed > .sec-card.loose-card,
html body .day-block[data-date="2026-08-20"] .sec-grid.zone-zoomed > .zone-oneoff,
html body .day-block[data-date="2026-08-20"] .sec-grid.zone-zoomed > .canvas-oneoff {
  display: none !important;
}
html body .day-block.pursuit-board-day .sec-grid.zone-zoomed.item-dragging > .sec-card.loose-card,
html body .day-block[data-date="2026-08-20"] .sec-grid.zone-zoomed.item-dragging > .sec-card.loose-card {
  display: flex !important;
}
html body .day-block.pursuit-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed,
html body .day-block[data-date="2026-08-20"] .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed {
  z-index: 4 !important;
}


/* from #photo-mini-drag */

/* Keep photo-card look while a mini-card is mid-drag (including on document.body) */
.sec-card.loose-card {
  overflow: hidden !important;
  background: transparent !important;
  box-shadow: 0 10px 28px rgba(20,12,6,0.28) !important;
}
.sec-card.loose-card .card-visual {
  position: absolute !important;
  inset: 0 !important;
  height: 100% !important;
  width: 100% !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
}
.sec-card.loose-card .card-visual img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: cover !important;
  border-radius: 0 !important;
  opacity: 1 !important;
  transform: none !important;
}
.sec-card.loose-card.has-tasks:not(.card-collapsed) .card-body {
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  background: transparent !important;
  padding: 0 !important;
  border: none !important;
  box-shadow: none !important;
}
.sec-card.loose-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2) {
  background: transparent !important;
  box-shadow: none !important;
  clip-path: none !important;
  -webkit-clip-path: none !important;
}


/* from #pursuit-board-mini-cards */

/* Aug 20 zone mini-cards — same full-photo layout as today-block */
html body .day-block.pursuit-board-day.fmt22 .pursuit-zone-grid > .sec-card .card-visual,
html body .day-block[data-date="2026-08-20"].fmt22 .pursuit-zone-grid > .sec-card .card-visual,
html body .day-block.pursuit-board-day.fmt22 .pursuit-zone-grid > .sec-card.is-empty .card-visual,
html body .day-block[data-date="2026-08-20"].fmt22 .pursuit-zone-grid > .sec-card.is-empty .card-visual {
  position: absolute !important;
  inset: 0 !important;
  height: 100% !important;
  width: 100% !important;
  max-width: none !important;
  max-height: none !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
}
html body .day-block.pursuit-board-day.fmt22 .pursuit-zone-grid > .sec-card .card-visual img,
html body .day-block[data-date="2026-08-20"].fmt22 .pursuit-zone-grid > .sec-card .card-visual img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: cover !important;
  border-radius: 0 !important;
  opacity: 1 !important;
}
html body .day-block.pursuit-board-day.fmt22 .pursuit-zone-grid > .sec-card .card-visual .j22-group,
html body .day-block[data-date="2026-08-20"].fmt22 .pursuit-zone-grid > .sec-card .card-visual .j22-group {
  position: absolute !important;
  left: 0 !important;
  right: auto !important;
  top: 0 !important;
  bottom: auto !important;
  width: auto !important;
  max-width: calc(100% - 36px) !important;
  margin: 0 !important;
  padding: 9px 12px 0 10px !important;
  text-align: left !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  font-family: "Newsreader", Georgia, serif !important;
  font-style: italic !important;
  font-weight: 400 !important;
  font-size: 12px !important;
  color: #fff !important;
  text-shadow: 0 1px 8px rgba(0,0,0,0.7) !important;
  background: none !important;
  z-index: 8 !important;
}
html body .day-block.pursuit-board-day.fmt22 .sec-card.hide-card-title .card-visual .j22-group,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-card.hide-card-title .card-visual .j22-group {
  display: none !important;
}
html body .day-block.pursuit-board-day.fmt22 .sec-card.is-empty .card-body,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-card.is-empty .card-body {
  display: none !important;
}
html body .day-block.pursuit-board-day.fmt22 .sec-card.has-tasks:not(.card-collapsed) .card-body,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-card.has-tasks:not(.card-collapsed) .card-body {
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  background: transparent !important;
  pointer-events: none !important;
  padding: 0 !important;
  border-top: none !important;
  box-shadow: none !important;
  mask-image: none !important;
  -webkit-mask-image: none !important;
}
html body .day-block.pursuit-board-day.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  border-left: none !important;
  overflow: hidden !important;
  pointer-events: none !important;
}
html body .day-block.pursuit-board-day.fmt22 .sec-card .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2)::before,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-card .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2)::before {
  content: none !important;
  display: none !important;
}
html body .day-block.pursuit-board-day.fmt22 .sec-card.has-tasks .agenda-check,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-card.has-tasks .agenda-check {
  display: none !important;
}
html body .day-block.pursuit-board-day.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2),
html body .day-block[data-date="2026-08-20"].fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2) {
  background: transparent !important;
  box-shadow: none !important;
  clip-path: none !important;
  -webkit-clip-path: none !important;
  padding: 0 6px !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  justify-content: center !important;
  text-align: center !important;
  max-width: 100% !important;
  width: 100% !important;
  box-sizing: border-box !important;
  z-index: 8 !important;
  pointer-events: auto !important;
  overflow: hidden !important;
}
html body .day-block.pursuit-board-day.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2):hover,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2):hover {
  background: transparent !important;
}
html body .day-block.pursuit-board-day.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2)::before,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2)::before {
  content: none !important;
  display: none !important;
  counter-increment: none !important;
}
html body .day-block.pursuit-board-day.fmt22 .sec-card .fn-num,
html body .day-block.pursuit-board-day.fmt22 .sec-card .pin-badge,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-card .fn-num,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-card .pin-badge {
  display: none !important;
}
html body .day-block.pursuit-board-day.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-t,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-t,
html body .day-block.pursuit-board-day.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items .j22-t,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items .j22-t {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  font-family: "Reenie Beanie", cursive !important;
  font-size: 26px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  text-shadow: none !important;
  white-space: normal !important;
  text-align: center !important;
  display: block !important;
  max-width: 100% !important;
  overflow: hidden !important;
  word-break: break-word !important;
  line-height: 1.05 !important;
}
html body .day-block.pursuit-board-day.fmt22 .sec-card.caption-large.has-tasks:not(.card-collapsed) .j22-t,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-card.caption-large.has-tasks:not(.card-collapsed) .j22-t,
html body .day-block.pursuit-board-day.fmt22 .sec-card.caption-large.has-tasks:not(.card-collapsed) .j22-section-items .j22-t,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-card.caption-large.has-tasks:not(.card-collapsed) .j22-section-items .j22-t {
  font-size: 22px !important;
  line-height: 1.08 !important;
}
html body .day-block.pursuit-board-day.fmt22 .pursuit-zone-grid > .sec-card,
html body .day-block[data-date="2026-08-20"].fmt22 .pursuit-zone-grid > .sec-card {
  overflow: hidden !important;
  border-radius: 10px !important;
  width: var(--card-w, 148px) !important;
  height: var(--card-h, 148px) !important;
  max-width: none !important;
  max-height: none !important;
  flex: none !important;
  box-shadow: 0 6px 16px rgba(20,12,8,0.28) !important;
}


/* from #pursuit-board-loose-pieces */

/* Free-flowing cards + one-off tasks on the canvas (Aug 20 / pursuit-board-day) */
.day-block.pursuit-board-day .sec-grid.pursuit-canvas.item-dragging,
.day-block[data-date="2026-08-20"] .sec-grid.pursuit-canvas.item-dragging {
  overflow: visible !important;
}
.day-block.pursuit-board-day .sec-grid.pursuit-canvas.item-dragging .pursuit-zone,
.day-block[data-date="2026-08-20"] .sec-grid.pursuit-canvas.item-dragging .pursuit-zone {
  overflow: visible !important;
}
html body .day-block.pursuit-board-day.fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card {
  position: absolute !important;
  left: var(--ff-x, 8px) !important;
  top: var(--ff-y, 8px) !important;
  width: var(--card-w, 148px) !important;
  height: var(--card-h, 148px) !important;
  max-width: none !important;
  max-height: none !important;
  min-width: 0 !important;
  min-height: 0 !important;
  z-index: 18 !important;
  cursor: grab !important;
  touch-action: none !important;
  display: flex !important;
  overflow: hidden !important;
  border-radius: 10px !important;
}
html body .day-block.pursuit-board-day.fmt22 .sec-grid.pursuit-canvas > .zone-oneoff.canvas-oneoff,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-grid.pursuit-canvas > .zone-oneoff.canvas-oneoff {
  position: absolute !important;
  left: var(--ff-x, 12px) !important;
  top: var(--ff-y, 52px) !important;
  width: var(--card-w, 176px) !important;
  height: var(--card-h, 118px) !important;
  z-index: 18 !important;
  pointer-events: auto !important;
  display: block !important;
}
html body .day-block.pursuit-board-day.fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card .card-visual,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card .card-visual {
  position: absolute !important;
  inset: 0 !important;
  height: 100% !important;
  width: 100% !important;
  padding: 0 !important;
  overflow: hidden !important;
}
html body .day-block.pursuit-board-day.fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card .card-visual img,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card .card-visual img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 0 !important;
  opacity: 1 !important;
}
html body .day-block.pursuit-board-day.fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card .card-visual .j22-group,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card .card-visual .j22-group {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  max-width: calc(100% - 36px) !important;
  padding: 9px 12px 0 10px !important;
  font-family: "Newsreader", Georgia, serif !important;
  font-style: italic !important;
  font-size: 12px !important;
  color: #fff !important;
  text-shadow: 0 1px 8px rgba(0,0,0,0.7) !important;
  z-index: 8 !important;
}
html body .day-block.pursuit-board-day.fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card.hide-card-title .card-visual .j22-group,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card.hide-card-title .card-visual .j22-group {
  display: none !important;
}
html body .day-block.pursuit-board-day.fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card.has-tasks:not(.card-collapsed) .card-body,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card.has-tasks:not(.card-collapsed) .card-body {
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  background: transparent !important;
  pointer-events: none !important;
  padding: 0 !important;
}
html body .day-block.pursuit-board-day.fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2),
html body .day-block[data-date="2026-08-20"].fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2) {
  background: transparent !important;
  box-shadow: none !important;
  clip-path: none !important;
  -webkit-clip-path: none !important;
  padding: 0 !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  justify-content: center !important;
  text-align: center !important;
  max-width: 92% !important;
  z-index: 8 !important;
  pointer-events: auto !important;
}
html body .day-block.pursuit-board-day.fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card.has-tasks:not(.card-collapsed) .j22-t,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card.has-tasks:not(.card-collapsed) .j22-t {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  font-family: "Reenie Beanie", cursive !important;
  font-size: 28px !important;
  text-shadow: none !important;
}
html body .day-block.pursuit-board-day.fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2)::before,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2)::before {
  content: none !important;
  display: none !important;
}
html body .day-block.pursuit-board-day .task-count,
html body .day-block[data-date="2026-08-20"] .task-count,
html body .day-block.pursuit-board-day .task-count-badge,
html body .day-block[data-date="2026-08-20"] .task-count-badge,
html body .day-block.pursuit-board-day.fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card .task-count,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card .task-count,
html body .day-block.pursuit-board-day.fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card .add-task-sec,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card .add-task-sec,
html body .day-block.pursuit-board-day.fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card .card-add-task,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card .card-add-task {
  display: none !important;
}
html body .day-block.pursuit-board-day.fmt22 .sec-grid.pursuit-canvas > .canvas-oneoff,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-grid.pursuit-canvas > .canvas-oneoff {
  display: block !important;
}
html body .day-block.pursuit-board-day.fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card {
  display: flex !important;
}
html body .day-block.pursuit-board-day .zone-oneoff.canvas-oneoff,
html body .day-block[data-date="2026-08-20"] .zone-oneoff.canvas-oneoff {
  pointer-events: auto;
  position: absolute;
  padding: 0;
  overflow: hidden;
  background: #1c1814;
  box-shadow: 1px 2px 8px rgba(40,28,18,0.35);
  border-radius: 4px;
  cursor: grab;
  touch-action: none;
}
html body .day-block.pursuit-board-day .zone-oneoff.canvas-oneoff .zone-oneoff-img,
html body .day-block[data-date="2026-08-20"] .zone-oneoff.canvas-oneoff .zone-oneoff-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
}
html body .day-block.pursuit-board-day .zone-oneoff.canvas-oneoff .zone-oneoff-bar,
html body .day-block[data-date="2026-08-20"] .zone-oneoff.canvas-oneoff .zone-oneoff-bar {
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px 14px;
  text-align: center;
}
html body .day-block.pursuit-board-day .zone-oneoff.canvas-oneoff .zone-oneoff-t,
html body .day-block[data-date="2026-08-20"] .zone-oneoff.canvas-oneoff .zone-oneoff-t {
  font-family: "Reenie Beanie", cursive;
  font-size: 34px;
  line-height: 0.95;
  color: #f7f1e6;
  -webkit-text-fill-color: #f7f1e6;
  text-shadow: 0 1px 8px rgba(0,0,0,0.55);
  text-align: center;
}
html body .day-block.pursuit-board-day .zone-oneoff.canvas-oneoff .zone-oneoff-del,
html body .day-block[data-date="2026-08-20"] .zone-oneoff.canvas-oneoff .zone-oneoff-del {
  position: absolute;
  top: 4px;
  right: 4px;
  z-index: 3;
  border: 0;
  background: rgba(20,16,12,0.45);
  color: #f7f1e6;
  cursor: pointer;
  font-size: 16px;
  line-height: 1;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  padding: 0;
}


/* from #timeline-date-visibility */

/* Timeline dates: dark type on the photo — no cream chips, no white glow */
html body .day-block.fmt22 .day-date,
html body .day-block.fmt22.collapsed .day-date,
html body .day-block.fmt22.today-block .day-date,
html body .day-block.fmt22.featured-block .day-date,
html body .day-block.fmt22.past .day-date,
html body.enh-dark .day-block.fmt22 .day-date,
html body.enh-dark .day-block.fmt22.collapsed .day-date {
  color: #1c140e !important;
  -webkit-text-fill-color: #1c140e !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  opacity: 1 !important;
  letter-spacing: 0.12em !important;
  background: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  text-shadow:
    0 1px 2px rgba(20,12,6,0.55),
    0 2px 10px rgba(20,12,6,0.35) !important;
}
html body .day-block.fmt22 .day-count,
html body .day-block.fmt22.collapsed .day-count,
html body.enh-dark .day-block.fmt22 .day-count {
  color: #1c140e !important;
  -webkit-text-fill-color: #1c140e !important;
  opacity: 1 !important;
  font-weight: 600 !important;
  text-shadow:
    0 1px 2px rgba(20,12,6,0.5),
    0 2px 8px rgba(20,12,6,0.3) !important;
}
html body .day-block.fmt22.collapsed .day-card-header {
  justify-content: flex-start !important;
  text-align: left !important;
}
html body .day-block.fmt22 .day-dot {
  width: 10px !important;
  height: 10px !important;
  left: -29px !important;
  top: 16px !important;
  border-width: 2px !important;
}
html body .day-block.fmt22.collapsed .day-dot {
  background: #2a1c12 !important;
  border-color: #f3e6d0 !important;
  box-shadow: 0 1px 6px rgba(20,12,6,0.45) !important;
}
html body .day-block.fmt22.today-block .day-dot {
  background: #5a8a4a !important;
  border-color: #f3e6d0 !important;
  box-shadow: 0 0 10px rgba(90,138,74,0.7) !important;
}
html body .timeline::before {
  background: rgba(28, 20, 14, 0.45) !important;
  box-shadow: 0 0 6px rgba(20,12,6,0.25);
}
html body .jul-rail-fixed {
  opacity: 0.92 !important;
}
html body .rail-day,
html body .rail-dow,
html body .rail-header {
  color: #1c140e !important;
  text-shadow: 0 1px 2px rgba(20,12,6,0.45) !important;
}


/* from #header-mist-contrast */

/* Keep floating type — no cream boxes. Dark ink so it reads on mist. */
html body header .eyebrow,
html body .schedule-header .eyebrow,
html body header .subtitle,
html body .schedule-header .sub,
html body .progress-label,
html body.enh-dark header .eyebrow,
html body.enh-dark .schedule-header .eyebrow,
html body.enh-dark header .subtitle,
html body.enh-dark .schedule-header .sub,
html body.enh-dark .progress-label {
  color: #1c140e !important;
  -webkit-text-fill-color: #1c140e !important;
  opacity: 1 !important;
  font-weight: 600 !important;
  background: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
  text-shadow:
    0 1px 2px rgba(20,12,6,0.5),
    0 2px 10px rgba(20,12,6,0.32) !important;
}
html body .progress-label,
html body.enh-dark .progress-label {
  font-size: 11px !important;
}
html body header h1,
html body .schedule-header h2,
html body.enh-dark header h1,
html body.enh-dark .schedule-header h2 {
  color: #1c140e !important;
  -webkit-text-fill-color: #1c140e !important;
  font-weight: 400 !important;
  opacity: 1 !important;
  background: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
  display: block;
  text-shadow:
    0 1px 2px rgba(20,12,6,0.45),
    0 3px 14px rgba(20,12,6,0.32) !important;
}
html body header .divider,
html body .schedule-header .divider,
html body.enh-dark header .divider,
html body.enh-dark .schedule-header .divider {
  background: #1c140e !important;
  opacity: 0.5;
}
html body .progress-bar,
html body.enh-dark .progress-bar {
  background: rgba(28, 20, 14, 0.35) !important;
}
html body .progress-fill,
html body.enh-dark .progress-fill {
  background: #3d5c34 !important;
}
html body #hamburger-menu span,
html body.enh-dark #hamburger-menu span {
  background: #1c140e !important;
  box-shadow: 0 1px 3px rgba(20,12,6,0.45);
}
html body .day-block.collapsed .day-date,
html body.enh-dark .day-date,
html body.enh-dark .day-block.collapsed .day-date,
html body .day-block.fmt22.collapsed .day-date {
  color: #1c140e !important;
  -webkit-text-fill-color: #1c140e !important;
  opacity: 1 !important;
  background: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  text-shadow:
    0 1px 2px rgba(20,12,6,0.5),
    0 2px 8px rgba(20,12,6,0.3) !important;
}


/* from #photo-caption-contrast */

/* Photo-card task text: cream handwriting with a dark outline so it reads on
   light photos (Text Mom), white graphic type (Elevate), and documents. */
html body .day-block.today-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-t,
html body .day-block.today-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items .j22-t,
html body .day-block.today-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item .j22-t,
html body .day-block.zone-board-day.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-t,
html body .day-block.pursuit-board-day.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-t,
html body .day-block.pursuit-board-day.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items .j22-t,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-t,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items .j22-t,
html body .day-block.pursuit-board-day.fmt22 .sec-grid.pursuit-canvas > .sec-card.loose-card.has-tasks:not(.card-collapsed) .j22-t,
html body .sec-card.loose-card.has-tasks:not(.card-collapsed) .j22-t {
  color: #fff8ee !important;
  -webkit-text-fill-color: #fff8ee !important;
  -webkit-text-stroke: 0.7px rgba(14,8,4,0.95) !important;
  paint-order: stroke fill;
  text-shadow:
    0 0 2px rgba(10,6,3,1),
    0 1px 1px rgba(10,6,3,0.95),
    0 1px 3px rgba(10,6,3,0.9),
    0 2px 10px rgba(10,6,3,0.75),
    0 0 18px rgba(10,6,3,0.45) !important;
  font-weight: 400 !important;
  opacity: 1 !important;
}
html body .day-block.today-block.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2),
html body .day-block.zone-board-day.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2),
html body .day-block.pursuit-board-day.fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2),
html body .day-block[data-date="2026-08-20"].fmt22 .sec-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2),
html body .sec-card.loose-card.has-tasks:not(.card-collapsed) .j22-section-items > .j22-item:not(.j22-sub):not(.j22-sub2) {
  overflow: visible !important;
  background: radial-gradient(ellipse at center, rgba(8,5,3,0.55) 0%, rgba(8,5,3,0.22) 48%, rgba(8,5,3,0) 76%) !important;
}
html body .day-block.pursuit-board-day.fmt22 .sec-card.caption-large.has-tasks:not(.card-collapsed) .j22-t,
html body .day-block[data-date="2026-08-20"].fmt22 .sec-card.caption-large.has-tasks:not(.card-collapsed) .j22-t {
  font-size: 23px !important;
  line-height: 1.1 !important;
}


/* from #zoomed-section-title */

/* Zoomed section keeps its name (AMBITION, LIFESTYLE, etc.) */
html body .day-block .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed > .pursuit-zone-head,
html body .day-block.today-block .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed > .pursuit-zone-head,
html body .day-block.zone-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed > .pursuit-zone-head,
html body .day-block.pursuit-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed > .pursuit-zone-head,
html body .day-block[data-date="2026-08-20"] .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed > .pursuit-zone-head {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: 0 !important;
  width: 100% !important;
  height: auto !important;
  min-height: 58px !important;
  z-index: 80 !important;
  pointer-events: auto !important;
  background: linear-gradient(180deg, rgba(12,8,4,0.78) 0%, rgba(12,8,4,0.32) 68%, transparent 100%) !important;
}
html body .day-block .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed > .pursuit-zone-head > .pursuit-zone-title,
html body .day-block.today-block .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .pursuit-zone-title,
html body .day-block.zone-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .pursuit-zone-title,
html body .day-block.pursuit-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .pursuit-zone-title,
html body .day-block[data-date="2026-08-20"] .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .pursuit-zone-title {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  color: #fff8ee !important;
  -webkit-text-fill-color: #fff8ee !important;
  font-family: "Cinzel", "Newsreader", Georgia, serif !important;
  font-size: 28px !important;
  font-weight: 600 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  padding: 16px 22px 14px !important;
  margin: 0 !important;
  text-shadow:
    0 1px 2px rgba(0,0,0,0.95),
    0 2px 12px rgba(0,0,0,0.7) !important;
  z-index: 81 !important;
}
html body .day-block.pursuit-board-day .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .pursuit-zone-grid,
html body .day-block[data-date="2026-08-20"] .sec-grid.zone-zoomed > .pursuit-zone.is-zoomed .pursuit-zone-grid {
  inset: 64px 16px 16px 16px !important;
  overflow: hidden !important;
}

/* copied-page shell */
.copied-page header { text-align:center; margin-bottom:36px; }
.copied-page header .eyebrow { font-family:'DM Mono',monospace; font-size:10px; letter-spacing:0.25em; color:var(--dusty); text-transform:uppercase; margin-bottom:8px; }
.copied-page header h1 { font-size:clamp(36px,8vw,64px); font-weight:400; font-style:italic; color:#1c140e; line-height:1.1; }
.copied-page .page-note { font-family:'DM Mono',monospace; font-size:9px; letter-spacing:0.16em; text-transform:uppercase; color:var(--sage); margin-top:10px; }
html body.copied-page #hamburger-menu span { background:#1c140e !important; box-shadow:0 1px 3px rgba(20,12,6,0.45); }
.dimensions-host,
.grids-host { margin:0 !important; }
.dimensions-host .sec-grid,
.grids-host .sec-grid {
  width:100%;
  display:flex !important;
  flex-wrap:wrap !important;
  gap:10px !important;
  height:auto !important;
  position:relative !important;
}
.dimensions-host .sec-card,
.grids-host .sec-card {
  position:relative !important;
  top:auto !important;
  left:auto !important;
  right:auto !important;
}

/* Agenda: sections are full-width containers; cards stay square; one-off tasks are landscape chips */
html body.agenda-copy-page .day-block.fmt22 .tv-panel.tv-pursuits,
html body.agenda-copy-page .day-block.fmt22.today-block .tv-panel.tv-pursuits,
html body.agenda-copy-page .day-block.fmt22.today-block .tv-panel.tv-pursuits.active {
  display: flex !important;
  flex-direction: column !important;
  overflow: visible !important;
}
html body.agenda-copy-page .day-block.fmt22.today-block .day-card,
html body.agenda-copy-page .day-block.fmt22.today-block .day-tasks {
  overflow: visible !important;
}
html body.agenda-copy-page .day-block.fmt22 .sec-grid,
html body.agenda-copy-page .day-block.fmt22 .sec-grid.freeform,
html body.agenda-copy-page .day-block.fmt22.today-block .sec-grid,
html body.agenda-copy-page .day-block.fmt22.today-block .sec-grid.freeform {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: flex-start !important;
  align-content: flex-start !important;
  justify-content: center !important;
  gap: 22px !important;
  columns: auto !important;
  column-count: auto !important;
  position: relative !important;
  height: auto !important;
  min-height: 220px !important;
  overflow-x: auto;
  overflow-y: visible;
  padding: 4px 6px 18px !important;
}
html body.agenda-copy-page .agenda-section {
  --sec-ink: #5c4638;
  --sec-wash: #d9c4a8;
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 0 0 236px;
  width: 236px;
  min-width: 236px;
  box-sizing: border-box;
  margin-top: 10px;
  padding: 22px 16px 28px;
  background:
    repeating-linear-gradient(
      transparent 0 31px,
      rgba(92,70,48,0.13) 31px 32px
    ),
    linear-gradient(180deg, #fbf6ea 0%, #f3e6d0 100%);
  border: 1px solid rgba(120,92,62,0.22);
  border-radius: 2px 2px 10px 10px;
  box-shadow:
    0 1px 0 rgba(255,255,255,0.7) inset,
    2px 10px 22px rgba(40,28,18,0.22);
  position: relative;
}
html body.agenda-copy-page .agenda-section[data-section="GLOW UP"] { --sec-ink:#8a4a58; --sec-wash:#e7c4c2; }
html body.agenda-copy-page .agenda-section[data-section="LIFESTYLE"] { --sec-ink:#5a6e52; --sec-wash:#cdd8c6; }
html body.agenda-copy-page .agenda-section[data-section="FINANCES"] { --sec-ink:#8a6a32; --sec-wash:#e4d2a4; }
html body.agenda-copy-page .agenda-section[data-section="POWER"] { --sec-ink:#7a4336; --sec-wash:#e0c0b0; }
html body.agenda-copy-page .agenda-section[data-section="AMBITION"] { --sec-ink:#3d4a62; --sec-wash:#c5cde0; }
html body.agenda-copy-page .agenda-section[data-section="QUANTUM"] { --sec-ink:#6a5478; --sec-wash:#d5c8e0; }
html body.agenda-copy-page .agenda-section::before {
  content: "";
  position: absolute;
  top: -32px;
  left: 50%;
  width: 16px;
  height: 28px;
  margin-left: -8px;
  border: 2.5px solid #b08a4a;
  border-bottom: 0;
  border-radius: 12px 12px 0 0;
  box-shadow: 0 1px 0 rgba(255,220,160,0.35) inset;
  pointer-events: none;
}
html body.agenda-copy-page .agenda-section::after {
  content: "";
  position: absolute;
  top: -8px;
  left: 50%;
  width: 42px;
  height: 11px;
  margin-left: -21px;
  background: var(--sec-wash);
  opacity: 0.82;
  transform: rotate(-8deg);
  box-shadow: 0 1px 2px rgba(40,28,18,0.18);
  pointer-events: none;
}
html body.agenda-copy-page .agenda-section:nth-child(3n+1) { transform: rotate(-0.7deg); }
html body.agenda-copy-page .agenda-section:nth-child(3n+2) { transform: rotate(0.55deg); }
html body.agenda-copy-page .agenda-section:nth-child(3n) { transform: rotate(-0.25deg); }
html body.agenda-copy-page .agenda-section-title {
  margin: 0 0 8px;
  padding: 0 4px 8px;
  font-family: "Reenie Beanie", cursive;
  font-size: 32px;
  letter-spacing: 0.02em;
  line-height: 0.9;
  text-transform: lowercase;
  text-align: center;
  color: var(--sec-ink);
  text-shadow: none;
  border-bottom: 1px dashed rgba(92,70,48,0.28);
}
html body.agenda-copy-page .agenda-section-items {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 2px;
}
html body.agenda-copy-page .agenda-section-items > .sec-card,
html body.agenda-copy-page .agenda-section-items > .agenda-oneoff {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
}
html body.agenda-copy-page .sec-card:not(.is-section) .card-visual .j22-group::before {
  content: "card";
  display: block;
  font-family: "DM Mono", monospace;
  font-size: 7px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-style: normal;
  opacity: 0.8;
  margin-bottom: 2px;
}
html body.agenda-copy-page .agenda-oneoff {
  position: relative !important;
  width: 228px !important;
  height: 88px !important;
  max-width: 228px !important;
  max-height: 88px !important;
  min-width: 228px !important;
  min-height: 88px !important;
  flex: 0 0 228px !important;
  aspect-ratio: auto !important;
  overflow: visible;
  border-radius: 6px;
  background: #f1e2c8;
  box-shadow: 1px 2px 8px rgba(40,28,18,0.28);
  isolation: isolate;
}
html body.agenda-copy-page .agenda-oneoff-img {
  display: none !important;
}
html body.agenda-copy-page .agenda-oneoff-bar {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px 28px 8px 12px;
  background: linear-gradient(180deg, rgba(12,8,6,0.15), rgba(12,8,6,0.45));
}
html body.agenda-copy-page .agenda-oneoff-kicker {
  position: absolute;
  top: 6px;
  left: 10px;
  font-family: "DM Mono", monospace;
  font-size: 8px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #f7f1e6;
  text-shadow: 0 1px 6px rgba(0,0,0,0.7);
  pointer-events: none;
}
html body.agenda-copy-page .agenda-oneoff-t {
  font-family: "Reenie Beanie", cursive;
  font-size: 28px;
  line-height: 0.95;
  color: #f7f1e6;
  -webkit-text-fill-color: #f7f1e6;
  text-shadow: 0 1px 8px rgba(0,0,0,0.55), 0 0 16px rgba(0,0,0,0.7);
  text-align: center;
  max-width: 86%;
}
html body.agenda-copy-page .agenda-oneoff.is-done .agenda-oneoff-t {
  text-decoration: line-through;
  opacity: 0.65;
}
html body.agenda-copy-page .agenda-oneoff-check {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
}
html body.agenda-copy-page .agenda-oneoff-check .agenda-check {
  appearance: none;
  width: 16px;
  height: 16px;
  margin: 0;
  border: 1.5px solid rgba(247,241,230,0.85);
  border-radius: 3px;
  background: rgba(20,16,12,0.35);
  cursor: pointer;
}
html body.agenda-copy-page .agenda-oneoff-check .agenda-check:checked {
  background: rgba(247,241,230,0.9);
}
html body.agenda-copy-page .agenda-oneoff-del {
  position: absolute;
  top: 4px;
  right: 4px;
  z-index: 3;
  border: 0;
  background: rgba(20,16,12,0.45);
  color: #f7f1e6;
  cursor: pointer;
  font-size: 16px;
  line-height: 1;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  padding: 0;
}
html body.agenda-copy-page .sec-picker-opt.is-oneoff-dest {
  font-style: italic;
}

/* In-zone one-off tasks on the Aug 20 / pursuit board */
html body .day-block.pursuit-board-day .zone-oneoffs,
html body .day-block[data-date="2026-08-20"] .zone-oneoffs {
  position: absolute;
  inset: 0;
  z-index: 4;
  pointer-events: none;
}
html body .day-block.pursuit-board-day .zone-oneoff,
html body .day-block[data-date="2026-08-20"] .zone-oneoff {
  pointer-events: auto;
  position: absolute;
  left: var(--ff-x, 12px);
  top: var(--ff-y, 52px);
  width: var(--card-w, 220px);
  height: var(--card-h, 88px);
  display: block;
  padding: 0;
  overflow: hidden;
  background: #1c1814;
  box-shadow: 1px 2px 8px rgba(40,28,18,0.35);
  border-radius: 4px;
  cursor: grab;
  touch-action: none;
  z-index: 5;
}
html body .day-block.pursuit-board-day .zone-oneoff-img,
html body .day-block[data-date="2026-08-20"] .zone-oneoff-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
}
html body .day-block.pursuit-board-day .zone-oneoff-bar,
html body .day-block[data-date="2026-08-20"] .zone-oneoff-bar,
html body .day-block.today-block .zone-oneoff-bar {
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  bottom: auto;
  transform: translateY(-50%);
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px 14px;
  background: none;
  text-align: center;
}
html body .day-block.pursuit-board-day .zone-oneoff-t,
html body .day-block[data-date="2026-08-20"] .zone-oneoff-t {
  flex: 0 1 auto;
  min-width: 0;
  font-family: "Reenie Beanie", cursive;
  font-size: 28px;
  line-height: 0.95;
  color: #f7f1e6;
  -webkit-text-fill-color: #f7f1e6;
  text-shadow: 0 1px 8px rgba(0,0,0,0.55);
  overflow: hidden;
  text-align: center;
}
html body .day-block.pursuit-board-day .zone-oneoff.need-halo .zone-oneoff-t,
html body .day-block[data-date="2026-08-20"] .zone-oneoff.need-halo .zone-oneoff-t {
  text-shadow:
    0 1px 2px #000,
    0 0 8px #000,
    0 0 16px rgba(0,0,0,0.95),
    0 0 28px rgba(0,0,0,0.7);
}
html body .day-block.pursuit-board-day .zone-oneoff-kicker,
html body .day-block[data-date="2026-08-20"] .zone-oneoff-kicker,
html body .day-block.today-block .zone-oneoff-kicker {
  position: absolute;
  top: 6px;
  left: 10px;
  z-index: 3;
  font-family: "DM Mono", monospace;
  font-size: 8px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #f7f1e6;
  text-shadow: 0 1px 6px rgba(0,0,0,0.75);
  pointer-events: none;
}
html body .day-block.pursuit-board-day .zone-oneoff-check,
html body .day-block[data-date="2026-08-20"] .zone-oneoff-check,
html body .day-block.today-block .zone-oneoff-check {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
}
html body .day-block.pursuit-board-day .zone-oneoff-check .agenda-check,
html body .day-block[data-date="2026-08-20"] .zone-oneoff-check .agenda-check,
html body .day-block.today-block .zone-oneoff-check .agenda-check {
  appearance: none;
  width: 15px;
  height: 15px;
  margin: 0;
  border: 1.5px solid rgba(247,241,230,0.9);
  border-radius: 3px;
  background: rgba(20,16,12,0.35);
  cursor: pointer;
}
html body .day-block.pursuit-board-day .zone-oneoff-check .agenda-check:checked,
html body .day-block[data-date="2026-08-20"] .zone-oneoff-check .agenda-check:checked,
html body .day-block.today-block .zone-oneoff-check .agenda-check:checked {
  background: rgba(247,241,230,0.92);
}
html body .day-block.pursuit-board-day .zone-oneoff.is-done .zone-oneoff-t,
html body .day-block[data-date="2026-08-20"] .zone-oneoff.is-done .zone-oneoff-t,
html body .day-block.today-block .zone-oneoff.is-done .zone-oneoff-t {
  text-decoration: line-through;
  opacity: 0.65;
}
html body .day-block.pursuit-board-day .zone-oneoff-n,
html body .day-block[data-date="2026-08-20"] .zone-oneoff-n {
  display: none !important;
}
html body .day-block.pursuit-board-day .zone-oneoff-del,
html body .day-block[data-date="2026-08-20"] .zone-oneoff-del {
  position: absolute;
  top: 4px;
  right: 4px;
  z-index: 3;
  border: 0;
  background: rgba(20,16,12,0.45);
  color: #f7f1e6;
  cursor: pointer;
  font-size: 16px;
  line-height: 1;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  padding: 0;
}
html body .day-block.pursuit-board-day .pursuit-zone.zone-collapsed .zone-oneoffs,
html body .day-block[data-date="2026-08-20"] .pursuit-zone.zone-collapsed .zone-oneoffs {
  display: none !important;
}
html body .day-block.pursuit-board-day.fmt22 .pursuit-zone-grid > .sec-card .card-visual .j22-group::before,
html body .day-block[data-date="2026-08-20"].fmt22 .pursuit-zone-grid > .sec-card .card-visual .j22-group::before {
  content: "card";
  display: block;
  font-family: "DM Mono", monospace;
  font-size: 7px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-style: normal;
  opacity: 0.85;
  margin-bottom: 2px;
}

/* Cards stay polaroids. One-off tasks are paper tickets, not cropped photo tiles. */
html body .day-block.pursuit-board-day .zone-oneoff,
html body .day-block[data-date="2026-08-20"] .zone-oneoff,
html body .day-block.today-block .zone-oneoff,
html body .day-block.pursuit-board-day .zone-oneoff.canvas-oneoff,
html body .day-block[data-date="2026-08-20"] .zone-oneoff.canvas-oneoff,
html body.agenda-copy-page .agenda-oneoff {
  width: var(--card-w, 252px) !important;
  height: var(--card-h, 76px) !important;
  min-width: 220px !important;
  min-height: 70px !important;
  background:
    linear-gradient(90deg, transparent 18px, rgba(90,70,48,0.38) 18px, rgba(90,70,48,0.38) 19px, transparent 19px),
    repeating-linear-gradient(180deg, transparent 0 6px, rgba(90,70,48,0.22) 6px 8px) 18px 10px / 2px calc(100% - 20px) no-repeat,
    linear-gradient(180deg, #f7efe0, #f1e2c8) !important;
  background-color: #f1e2c8 !important;
  border-radius: 2px 11px 11px 2px !important;
  overflow: visible !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,0.55) inset,
    1px 3px 10px rgba(40,28,18,0.28) !important;
  border: 1px solid rgba(92,72,50,0.22) !important;
  transform: rotate(var(--slip-rot, -1.2deg));
  isolation: isolate;
}
html body .day-block.pursuit-board-day .zone-oneoff:nth-child(even),
html body .day-block[data-date="2026-08-20"] .zone-oneoff:nth-child(even),
html body.agenda-copy-page .agenda-oneoff:nth-child(even) {
  --slip-rot: 1.15deg;
}
html body .day-block.pursuit-board-day .zone-oneoff::before,
html body .day-block[data-date="2026-08-20"] .zone-oneoff::before,
html body .day-block.today-block .zone-oneoff::before,
html body.agenda-copy-page .agenda-oneoff::before {
  content: "";
  position: absolute;
  top: -7px;
  left: 42%;
  width: 54px;
  height: 15px;
  z-index: 5;
  pointer-events: none;
  background: rgba(186, 132, 84, 0.48);
  box-shadow: 0 1px 2px rgba(40,28,18,0.18);
  transform: rotate(-9deg);
}
html body .day-block.pursuit-board-day .zone-oneoff-img,
html body .day-block[data-date="2026-08-20"] .zone-oneoff-img,
html body .day-block.today-block .zone-oneoff-img,
html body .day-block.pursuit-board-day .zone-oneoff.canvas-oneoff .zone-oneoff-img,
html body .day-block[data-date="2026-08-20"] .zone-oneoff.canvas-oneoff .zone-oneoff-img,
html body.agenda-copy-page .agenda-oneoff-img {
  display: none !important;
}
html body .day-block.pursuit-board-day .zone-oneoff-bar,
html body .day-block[data-date="2026-08-20"] .zone-oneoff-bar,
html body .day-block.today-block .zone-oneoff-bar,
html body .day-block.pursuit-board-day .zone-oneoff.canvas-oneoff .zone-oneoff-bar,
html body .day-block[data-date="2026-08-20"] .zone-oneoff.canvas-oneoff .zone-oneoff-bar,
html body.agenda-copy-page .agenda-oneoff-bar {
  left: 24px !important;
  right: 8px !important;
  top: 16px !important;
  bottom: 8px !important;
  transform: none !important;
  justify-content: flex-start !important;
  align-items: center !important;
  padding: 0 22px 0 6px !important;
  background: none !important;
  text-align: left !important;
}
html body .day-block.pursuit-board-day .zone-oneoff-t,
html body .day-block[data-date="2026-08-20"] .zone-oneoff-t,
html body .day-block.today-block .zone-oneoff-t,
html body .day-block.pursuit-board-day .zone-oneoff.canvas-oneoff .zone-oneoff-t,
html body .day-block[data-date="2026-08-20"] .zone-oneoff.canvas-oneoff .zone-oneoff-t,
html body .day-block.pursuit-board-day .zone-oneoff.need-halo .zone-oneoff-t,
html body .day-block[data-date="2026-08-20"] .zone-oneoff.need-halo .zone-oneoff-t,
html body.agenda-copy-page .agenda-oneoff-t {
  color: #3a2c24 !important;
  -webkit-text-fill-color: #3a2c24 !important;
  text-shadow: none !important;
  text-align: left !important;
  font-size: 24px !important;
  line-height: 0.95 !important;
  max-width: none !important;
  white-space: normal !important;
}
html body .day-block.pursuit-board-day .zone-oneoff-kicker,
html body .day-block[data-date="2026-08-20"] .zone-oneoff-kicker,
html body .day-block.today-block .zone-oneoff-kicker,
html body.agenda-copy-page .agenda-oneoff-kicker {
  left: auto !important;
  right: 26px !important;
  top: 5px !important;
  color: #8a3a32 !important;
  text-shadow: none !important;
  letter-spacing: 0.2em !important;
  font-size: 7px !important;
  border: 1px solid rgba(138,58,50,0.5);
  padding: 1px 5px;
  transform: rotate(12deg);
  background: rgba(255,248,236,0.35);
}
html body .day-block.pursuit-board-day .zone-oneoff-check .agenda-check,
html body .day-block[data-date="2026-08-20"] .zone-oneoff-check .agenda-check,
html body .day-block.today-block .zone-oneoff-check .agenda-check,
html body.agenda-copy-page .agenda-oneoff-check .agenda-check {
  border-color: rgba(90,70,48,0.55) !important;
  background: rgba(255,250,240,0.7) !important;
  border-radius: 2px !important;
}
html body .day-block.pursuit-board-day .zone-oneoff-check .agenda-check:checked,
html body .day-block[data-date="2026-08-20"] .zone-oneoff-check .agenda-check:checked,
html body .day-block.today-block .zone-oneoff-check .agenda-check:checked,
html body.agenda-copy-page .agenda-oneoff-check .agenda-check:checked {
  background: #8a3a32 !important;
}
html body .day-block.pursuit-board-day .zone-oneoff-del,
html body .day-block[data-date="2026-08-20"] .zone-oneoff-del,
html body .day-block.today-block .zone-oneoff-del,
html body.agenda-copy-page .agenda-oneoff-del {
  background: transparent !important;
  color: #6a5648 !important;
}
html body.agenda-copy-page .agenda-oneoff {
  width: 252px !important;
  height: 76px !important;
  max-width: 252px !important;
  max-height: 76px !important;
  min-width: 252px !important;
  min-height: 76px !important;
  flex-basis: 252px !important;
}

/* Agenda: hang each domain as a paper strip, write tasks on the page */
html body.agenda-copy-page .day-block.fmt22 .tv-pursuits .flow-chart-card,
html body.agenda-copy-page .day-block.fmt22.today-block .tv-pursuits .flow-chart-card {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: none !important;
  box-shadow: none !important;
  padding: 32px 4px 8px !important;
  position: relative;
}
html body.agenda-copy-page .day-block.fmt22 .tv-pursuits .flow-chart-card::before {
  content: "";
  position: absolute;
  top: 10px;
  left: 3%;
  right: 3%;
  height: 13px;
  z-index: 2;
  border-radius: 3px;
  background:
    linear-gradient(180deg, #d8b888 0%, #b08958 45%, #8e6a3e 100%);
  box-shadow:
    0 1px 0 rgba(255,230,190,0.45) inset,
    0 3px 8px rgba(40,28,18,0.28);
  pointer-events: none;
}
html body.agenda-copy-page .agenda-section-items > .sec-card,
html body.agenda-copy-page .agenda-section-items > .agenda-oneoff {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
}
html body.agenda-copy-page .agenda-section-items > .sec-card {
  align-self: center;
  margin: 10px auto 8px !important;
  width: 148px !important;
  height: 148px !important;
  max-width: 148px !important;
  max-height: 148px !important;
  flex: 0 0 148px !important;
}
html body.agenda-copy-page .agenda-section-items > .agenda-oneoff,
html body.agenda-copy-page .agenda-section-items > .agenda-oneoff:nth-child(even) {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 32px !important;
  max-height: none !important;
  flex: 0 0 auto !important;
  flex-basis: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transform: none !important;
  overflow: visible !important;
}
html body.agenda-copy-page .agenda-section-items > .agenda-oneoff::before {
  display: none !important;
}
html body.agenda-copy-page .agenda-section-items > .agenda-oneoff .agenda-oneoff-kicker {
  display: none !important;
}
html body.agenda-copy-page .agenda-section-items > .agenda-oneoff .agenda-oneoff-bar {
  position: relative !important;
  inset: auto !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  display: flex !important;
  align-items: baseline !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  padding: 2px 22px 2px 2px !important;
  min-height: 32px;
}
html body.agenda-copy-page .agenda-section-items > .agenda-oneoff .agenda-oneoff-t {
  font-family: "Reenie Beanie", cursive !important;
  font-size: 26px !important;
  line-height: 1.15 !important;
  color: #3a2c24 !important;
  -webkit-text-fill-color: #3a2c24 !important;
}
html body.agenda-copy-page .agenda-section-items > .agenda-oneoff .agenda-oneoff-check {
  display: flex !important;
  align-items: center;
  flex: 0 0 auto;
}
html body.agenda-copy-page .agenda-section-items > .agenda-oneoff .agenda-check {
  display: inline-block !important;
  appearance: none;
  width: 13px !important;
  height: 13px !important;
  margin: 0 2px 0 0 !important;
  border: 1.5px solid rgba(90,70,48,0.5) !important;
  border-radius: 2px !important;
  background: rgba(255,250,240,0.7) !important;
  cursor: pointer;
}
html body.agenda-copy-page .agenda-section-items > .agenda-oneoff .agenda-check:checked {
  background: #8a3a32 !important;
}
html body.agenda-copy-page .agenda-section-items > .agenda-oneoff .agenda-oneoff-del {
  top: 4px !important;
  right: 0 !important;
  opacity: 0;
}
html body.agenda-copy-page .agenda-section-items > .agenda-oneoff:hover .agenda-oneoff-del {
  opacity: 1;
}
html body.agenda-copy-page .agenda-section-items > .agenda-oneoff .agenda-oneoff-del {
  top: 4px !important;
  right: 0 !important;
}
html body.agenda-copy-page .agenda-section-items > .agenda-oneoff.is-done .agenda-oneoff-t {
  text-decoration: line-through;
  opacity: 0.55;
}
@media (max-width: 720px) {
  html body.agenda-copy-page .day-block.fmt22 .sec-grid,
  html body.agenda-copy-page .day-block.fmt22 .sec-grid.freeform {
    justify-content: flex-start !important;
    padding-left: 8px !important;
  }
}

html body .card-resize::before,
html body .card-resize::after,
html body .oneoff-resize::before,
html body .oneoff-resize::after,
html body .zone-resize::before,
html body .zone-resize::after,
html body .day-block .sec-card:hover .card-resize::after,
html body .day-block .sec-card.resizing .card-resize::after {
  display: none !important;
  content: none !important;
  opacity: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  background: none !important;
}
html body .card-resize,
html body .oneoff-resize,
html body .zone-resize {
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}
