/* =====================================================================================================
   HOME B2 + THE TASK HELPER (Ava, 15 Oct 2026). Mock-up: https://claude.ai/artifact/NnaPSrRtmbgUmorcZQbhxt (v9).
   Her rules for this page (memory: feedback_calm_pages_one_focus):
   - each part in its own white box with a navy-ruled heading; nothing shown twice
   - the right-hand boxes are EQUAL and never grow: they scroll inside
   - both columns end on the SAME line; the page scrolls first, then a box (home2.js wheel handler)
   - two columns on a phone too, compact
   Every class here starts h2- so nothing in index.html, tools.css or brand.css can collide with it.
   ===================================================================================================== */

#home2{--h2-navy:var(--b-navy,#131b2d);--h2-navy-mid:var(--b-navy-mid,#243b5e);--h2-navy-light:var(--b-navy-light,#7c93b8);
  --h2-ink:#1c2538;--h2-body:var(--b-body,#2c384c);--h2-muted:#7a8291;--h2-faint:#a9afba;
  --h2-paper:var(--b-paper,#fbfaf8);--h2-white:#fff;--h2-meet:#eceff5;--h2-mist:var(--b-mist,#eef0f4);
  --h2-rule:rgba(19,27,45,.13);--h2-hair:rgba(19,27,45,.07);
  --h2-rose:var(--b-rose,#c07873);--h2-rose-tint:#f8efed;--h2-plat:#7f97b3;--h2-ox:var(--b-oxblood,#6e2a22);
  --h2-display:var(--b-display,'Cormorant Garamond',Garamond,serif);--h2-text:var(--b-text,'EB Garamond',Garamond,Georgia,serif);
  --h2-sans:var(--b-sans,Jost,'Avenir Next','Segoe UI',sans-serif);
  font-family:var(--h2-sans);color:var(--h2-ink);container-type:inline-size}
#home2 button{cursor:pointer;background:none;border:0;padding:0}
/* 17/10: font and colour reset at the LOWEST weight. Written as "#home2 button" it outranked every class rule below, so the task
   names were never in Garamond, links never 13px, the inactive tabs never faint, and the phone sizes never applied at all. */
:where(#home2) button{font:inherit;color:inherit}
#home2 button:focus-visible,#home2 input:focus-visible,#home2 [contenteditable]:focus-visible{outline:2px solid var(--h2-rose);outline-offset:2px}

/* When the new Home is on, the old Home's own layout steps aside. Its live parts are MOVED into the new boxes
   (home2.js adopt()), so their renderers keep working; only the empty shells are hidden. */
#view-dashboard.h2-on>.hm-acts,#view-dashboard.h2-on>.hm-grid,#view-dashboard.h2-on>.rk-ticker{display:none!important}

/* ---------- the photo band: greeting and one headline at a time ---------- */
.h2-band{position:relative;background:var(--h2-navy) center 40%/cover;color:#fff}
.h2-band::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(19,27,45,.35),rgba(19,27,45,.74))}
.h2-band>*{position:relative}
.h2-bi{max-width:1200px;margin:0 auto;padding:46px 28px 24px}
.h2-date{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.75)}
.h2-hello{font-family:var(--h2-display);font-weight:400;font-size:52px;line-height:1.02;margin:8px 0 0;color:#fff;letter-spacing:-.01em}
.h2-lead{font-family:var(--h2-text);font-size:19px;line-height:1.5;color:rgba(255,255,255,.88);margin:12px 0 0;max-width:40em}
.h2-news{display:flex;align-items:center;gap:14px;max-width:1200px;margin:0 auto;padding:11px 28px 14px;border-top:1px solid rgba(255,255,255,.18);font-size:13px}
.h2-news .nl{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.6);flex:none}
.h2-news a{color:#fff;text-decoration:none;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.h2-news a:hover{text-decoration:underline;text-underline-offset:3px}
.h2-news a span{color:rgba(255,255,255,.6)}
.h2-news .ct{flex:none;font-size:11.5px;color:rgba(255,255,255,.6);font-variant-numeric:tabular-nums}
.h2-news .nx{flex:none;width:28px;height:28px;border-radius:50%!important;border:1px solid rgba(255,255,255,.4)!important;color:#fff;font-size:13px}

/* ---------- the two-column frame ---------- */
.h2-frame{--fh:1040px;max-width:1200px;margin:0 auto;padding:26px 28px 40px;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:22px;height:calc(var(--fh) + 66px)}
.h2-frame.h2-help{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
.h2-box{background:var(--h2-white);border:1px solid var(--h2-rule);display:flex;flex-direction:column;min-height:0;min-width:0}
.h2-bh{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;margin:0 20px;padding:16px 0 9px;border-bottom:1px solid var(--h2-navy)}
.h2-bh h3{font-family:var(--h2-display);font-weight:500;font-size:24px;margin:0;color:var(--h2-navy)}
.h2-links{display:flex;gap:16px;flex-wrap:wrap}
.h2-body{flex:1;min-height:0;overflow:auto;padding:12px 20px 14px;scrollbar-width:thin;scrollbar-color:rgba(19,27,45,.2) transparent}
.h2-body.more{-webkit-mask-image:linear-gradient(180deg,#000 calc(100% - 34px),transparent);mask-image:linear-gradient(180deg,#000 calc(100% - 34px),transparent)}
.h2-foot{padding:10px 20px 14px;border-top:1px solid var(--h2-hair);display:flex;gap:16px;flex-wrap:wrap;align-items:baseline;font-size:12px;color:var(--h2-faint)}
.h2-stack{display:grid;gap:22px;min-height:0}
.h2-stack.n3{grid-template-rows:repeat(3,minmax(0,1fr))}
.h2-stack.n4{grid-template-rows:repeat(4,minmax(0,1fr))}

/* text links and buttons */
.h2-q{font-size:13px;color:var(--h2-muted);text-decoration:underline;text-decoration-color:var(--h2-faint);text-underline-offset:4px}
.h2-q:hover{color:var(--h2-ink)}
.h2-go{background:var(--h2-navy)!important;color:#fff!important;border-radius:999px!important;padding:10px 20px!important;font-size:13.5px}
.h2-go:hover{background:var(--h2-navy-mid)!important}
.h2-lbl{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--h2-rose)}
.h2-acts{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:16px}

/* ---------- the day ---------- */
.h2-hour{display:grid;grid-template-columns:64px minmax(0,1fr);min-height:64px;border-top:1px solid var(--h2-hair)}
.h2-hour .t{font-size:12px;color:var(--h2-faint);padding-top:9px;font-variant-numeric:tabular-nums}
.h2-hour .t small{display:block;font-size:10px;opacity:.85}
.h2-hour .c{padding:7px 0 9px;display:grid;gap:6px;align-content:start;min-width:0}
.h2-hour.past .t,.h2-hour.past .c{opacity:.45}
.h2-mtg{background:var(--h2-meet);padding:9px 13px;display:flex;justify-content:space-between;gap:12px;align-items:baseline;min-width:0}
.h2-mtg.theirs{background:var(--h2-mist)}
.h2-mtg .n{font-family:var(--h2-text);font-size:16.5px;color:var(--h2-navy);min-width:0;text-align:left}
.h2-mtg.theirs .n{color:var(--h2-muted)}
.h2-mtg .w{font-size:12px;color:var(--h2-muted);white-space:nowrap}
.h2-mtg .j{font-size:12.5px;color:var(--h2-navy);text-decoration:underline;text-underline-offset:3px;margin-left:12px}
.h2-mtg .br{display:none}
.h2-tk{display:grid;grid-template-columns:18px minmax(0,1fr) auto;gap:12px;align-items:center;padding:5px 0}
.h2-ring{width:18px;height:18px;border-radius:50%!important;border:1.5px solid var(--h2-navy-light)!important;display:grid;place-items:center}
.h2-ring:hover{border-color:var(--h2-navy)!important;background:var(--h2-meet)}
.h2-tk.plat .h2-ring{border-color:var(--h2-plat)!important;border-style:dashed!important}
.h2-tk.late .h2-ring{border-color:var(--h2-rose)!important}
.h2-tk .n{font-family:var(--h2-text);font-size:17px;line-height:1.35;color:var(--h2-ink);text-align:left;min-width:0}
.h2-tk .n:hover{color:var(--h2-navy-mid)}
.h2-tk .m{font-size:12px;color:var(--h2-faint);white-space:nowrap}
.h2-tk.focus .h2-ring{border-color:var(--h2-rose)!important;background:var(--h2-rose-tint)}
.h2-tk.done .n{color:var(--h2-faint);text-decoration:line-through;text-decoration-color:var(--h2-faint)}
.h2-tk.done .h2-ring{background:var(--h2-navy-light);border-color:var(--h2-navy-light)!important}
.h2-next{margin:2px 0 8px 30px;padding:14px 16px;background:var(--h2-rose-tint);display:grid;gap:8px}
.h2-next .src{font-family:var(--h2-text);font-style:italic;font-size:15.5px;color:var(--h2-muted);margin:0}
.h2-next .h2-acts{margin-top:4px}
.h2-now{position:relative;height:0;border-top:1px solid var(--h2-rose);margin:2px 0}
.h2-now::before{content:"";position:absolute;left:-4px;top:-4px;width:7px;height:7px;border-radius:50%!important;background:var(--h2-rose)}
.h2-free{font-size:12px;color:var(--h2-faint);text-align:left;padding:2px 0}
.h2-free:hover{color:var(--h2-navy-mid)}
.h2-legend{display:flex;gap:22px;flex-wrap:wrap;margin-top:14px;font-size:12px;color:var(--h2-faint)}
.h2-legend span{display:inline-flex;align-items:center;gap:8px}
.h2-legend i{width:12px;height:12px;border-radius:50%!important;border:1.5px solid var(--h2-navy-light)}
.h2-legend i.p{border-color:var(--h2-plat);border-style:dashed}
.h2-foot .h2-phone{display:none}
.h2-note{font-family:var(--h2-text);font-size:15px;color:var(--h2-muted);padding:10px 0}

/* ---------- the right-hand boxes ---------- */
.h2-row{display:flex;gap:12px;align-items:baseline;padding:10px 0;border-top:1px solid var(--h2-hair);font-family:var(--h2-text);font-size:15.5px;color:var(--h2-body)}
.h2-row:first-child{border-top:0}
.h2-row>span{flex:1;min-width:0}
.h2-row small{display:block;font-family:var(--h2-sans);font-size:11.5px;color:var(--h2-muted);margin-top:2px}
.h2-row .dot{flex:none;width:6px;height:6px;border-radius:50%!important;background:var(--h2-rose);transform:translateY(-2px)}
.h2-empty{font-family:var(--h2-text);font-size:15.5px;color:var(--h2-faint);margin:6px 0}
.h2-tabs{display:flex;gap:16px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
.h2-tabs button{font-family:var(--h2-display);font-size:22px;color:var(--h2-faint);white-space:nowrap}
.h2-tabs button.on{color:var(--h2-navy)}
.h2-pane[hidden]{display:none!important}
.h2-hosted{min-width:0}
.h2-hosted .hm-card,.h2-hosted section{border:0!important;box-shadow:none!important;padding:0!important;margin:0!important;background:none!important}
.h2-hosted .hm-h2{display:none!important}

/* ---------- Task Helper ---------- */
.h2-htop{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:12.5px;color:var(--h2-muted)}
.h2-htitle{font-family:var(--h2-display);font-weight:500;font-size:36px;line-height:1.08;margin:14px 0 0;color:var(--h2-navy);text-wrap:balance}
.h2-htitle span{color:var(--h2-rose)}
.h2-hsrc{font-family:var(--h2-text);font-style:italic;font-size:16px;color:var(--h2-muted);margin:6px 0 0}
.h2-prog{display:flex;gap:6px;margin:18px 0 8px}
.h2-prog i{flex:1;height:2px;background:var(--h2-hair)}
.h2-prog i.ok{background:var(--h2-navy-light)}.h2-prog i.on{background:var(--h2-rose)}
.h2-hs{font-family:var(--h2-display);font-weight:500;font-size:26px;margin:4px 0 14px;color:var(--h2-navy)}
.h2-sheet{border:1px solid var(--h2-hair);padding:20px 22px;background:var(--h2-white)}
.h2-letter{font-family:var(--h2-text);font-size:17.5px;line-height:1.62;color:var(--h2-ink);white-space:pre-wrap;outline:none;min-height:120px}
.h2-gap{background:var(--h2-rose-tint);color:#8e4a46;padding:0 4px;font-style:italic}
.h2-hint{font-family:var(--h2-text);font-style:italic;font-size:15px;color:var(--h2-muted);margin:12px 0 0}
.h2-hdr{display:grid;gap:4px;font-size:13px;color:var(--h2-muted);padding-bottom:14px;border-bottom:1px solid var(--h2-hair);margin-bottom:16px}
.h2-hdr b{font-weight:400;color:var(--h2-ink)}
.h2-hdr input{font:13px var(--h2-sans);border:0;border-bottom:1px solid var(--h2-hair);background:none;color:var(--h2-ink);padding:2px 0;min-width:0;width:100%}
.h2-step{display:grid;grid-template-columns:24px minmax(0,1fr);gap:10px;padding:9px 0;border-top:1px solid var(--h2-hair);text-align:left;width:100%;align-items:baseline}
.h2-step:first-child{border-top:0}
.h2-step i{width:20px;height:20px;border-radius:50%!important;border:1.5px solid var(--h2-faint);display:grid;place-items:center;font-style:normal;font-size:11px;color:var(--h2-muted);transform:translateY(3px)}
.h2-step.ok i{background:var(--h2-navy-light);border-color:var(--h2-navy-light);color:#fff}
.h2-step.on i{border-color:var(--h2-rose);color:var(--h2-rose)}
.h2-step span{font-family:var(--h2-text);font-size:16px;color:var(--h2-ink)}
.h2-step.ok span{color:var(--h2-faint);text-decoration:line-through}
.h2-quote{font-family:var(--h2-text);font-size:16px;line-height:1.55;color:var(--h2-body);margin:0}
.h2-cap{font-size:12px;color:var(--h2-muted);margin:8px 0 0}
.h2-person{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;padding:12px 0;border-top:1px solid var(--h2-hair);align-items:baseline}
.h2-person:first-child{border-top:0}
.h2-person .n{font-family:var(--h2-text);font-size:17px}
.h2-person .f{font-size:12.5px;color:var(--h2-muted);display:block;margin-top:2px}
.h2-person .s{font-size:12.5px;color:var(--h2-muted);white-space:nowrap}
.h2-done{font-family:var(--h2-display);font-weight:400;font-size:64px;line-height:1;color:var(--h2-navy);margin:30px 0 0}
.h2-away{position:sticky;top:0;z-index:5;background:var(--h2-navy);color:#fff;padding:11px 18px;font-size:13.5px;display:flex;gap:14px;align-items:center;justify-content:center;flex-wrap:wrap}
.h2-away button{background:#fff!important;color:var(--h2-navy)!important;border-radius:999px!important;padding:6px 14px!important;font-size:13px}

/* sheets (move a task, due dates, owners, the team) */
.h2-veil{position:fixed;inset:0;background:rgba(19,27,45,.28);z-index:900;display:flex;align-items:flex-end;justify-content:center}
.h2-sheetw{background:var(--h2-paper);width:100%;max-width:640px;max-height:86vh;overflow:auto;padding:28px 30px calc(26px + env(safe-area-inset-bottom,0px));font-family:var(--h2-sans);color:var(--h2-ink)}
.h2-sheetw h3{font-family:var(--h2-display);font-weight:500;font-size:28px;margin:6px 0 4px;color:var(--h2-navy)}
.h2-sheetw p{font-family:var(--h2-text);font-size:16px;color:var(--h2-body);margin:0 0 12px}
.h2-opt{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-top:1px solid var(--h2-hair);font-family:var(--h2-text);font-size:17px;text-align:left;width:100%}
.h2-opt small{font-family:var(--h2-sans);font-size:12px;color:var(--h2-muted)}
.h2-sheetw select,.h2-sheetw input[type=date],.h2-sheetw input[type=text]{font:15px var(--h2-text);border:0;border-bottom:1px solid var(--h2-navy-light);background:none;color:var(--h2-ink);padding:4px 0}
.h2-sheetw button{font:inherit;cursor:pointer;background:none;border:0;padding:0;color:inherit}

/* ---------- a phone: keep two columns, compact ---------- */
@container (max-width:560px){
  .h2-bi{padding:16px 16px 10px}.h2-hello{font-size:28px;margin-top:4px}.h2-lead{display:none}
  .h2-news{padding:8px 16px 10px;gap:10px}.h2-news .nl,.h2-news .ct{display:none}
  .h2-frame{--fh:600px;padding:10px 8px 24px;gap:8px;grid-template-columns:minmax(0,58fr) minmax(0,42fr)}
  .h2-frame.h2-help{grid-template-columns:minmax(0,42fr) minmax(0,58fr)}
  .h2-stack{gap:8px}
  .h2-bh{margin:0 10px;padding:9px 0 5px;gap:4px}.h2-bh h3{font-size:16px}.h2-links{display:none}
  .h2-body{padding:6px 10px 8px}.h2-foot{padding:6px 10px 8px;gap:8px;font-size:10.5px}
  .h2-row{font-size:12.5px;padding:7px 0;gap:4px;flex-direction:column}.h2-row .dot{display:none}.h2-row .h2-q{font-size:11px}
  .h2-hour{grid-template-columns:30px minmax(0,1fr);min-height:0}.h2-hour .t{font-size:10px;padding-top:6px}.h2-hour .t small{display:none}
  .h2-tk{grid-template-columns:14px minmax(0,1fr);gap:6px}.h2-ring{width:13px;height:13px}.h2-tk .n{font-size:13px;line-height:1.3}.h2-tk .m{display:none}
  .h2-mtg{padding:5px 7px;flex-direction:column;gap:2px}.h2-mtg .n{font-size:13px}.h2-mtg .w{font-size:10.5px;white-space:normal;display:flex;flex-wrap:wrap}
  .h2-mtg .br{display:block;flex-basis:100%;height:4px}.h2-mtg .j{font-size:10.5px;margin:0 8px 0 0}
  .h2-free{font-size:10.5px}
  .h2-next{margin-left:0;padding:8px;gap:4px}.h2-next .src{font-size:12px}.h2-next .h2-go{padding:7px 12px!important;font-size:11.5px}.h2-next .h2-acts{gap:8px}
  .h2-legend{display:none}
  .h2-tabs{gap:8px}.h2-tabs button{font-size:13.5px}
  .h2-htop{flex-direction:column;gap:2px;font-size:11px}
  .h2-htitle{font-size:20px;margin-top:8px}.h2-hsrc{font-size:12px}.h2-hs{font-size:17px;margin:2px 0 8px}
  .h2-sheet{padding:10px}.h2-letter{font-size:13px;line-height:1.5}.h2-hdr{font-size:11px}.h2-hint{font-size:12px}
  .h2-acts{gap:10px;margin-top:10px}.h2-go{padding:8px 14px!important;font-size:12px}.h2-acts .h2-q{font-size:11px}
  .h2-person{grid-template-columns:1fr;gap:0;padding:8px 0}.h2-person .n{font-size:14px}.h2-person .s{white-space:normal;font-size:11px}
  .h2-step{grid-template-columns:16px minmax(0,1fr);gap:6px;padding:6px 0}.h2-step i{width:14px;height:14px;font-size:9px}.h2-step span{font-size:12.5px}
  .h2-quote{font-size:13px}
  .h2-sheetw{padding:22px 18px}
}
@media (prefers-reduced-motion:no-preference){#home2 .h2-in{animation:h2in .35s ease both}@keyframes h2in{from{transform:translateY(4px)}to{transform:none}}}

/* ---------- 15/10 21:30 fixes from Ava's recording ---------- */
.h2-over{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:baseline;margin-top:12px;padding:10px 12px;background:var(--h2-mist);font-family:var(--h2-text);font-size:15px;color:var(--h2-body)}
.h2-late{display:grid;gap:3px;padding:10px 0;border-top:1px solid var(--h2-hair)}
.h2-late:first-of-type{border-top:0}
.h2-late .n{font-family:var(--h2-text);font-size:15.5px;line-height:1.35;color:var(--h2-ink)}
.h2-late .w{font-size:11.5px;color:var(--h2-muted)}
.h2-late .a{display:flex;gap:16px;flex-wrap:wrap;margin-top:2px}
.h2-row .who{font-family:var(--h2-sans);font-weight:500;font-size:12.5px;color:var(--h2-navy-mid);margin-right:4px}
/* Ask Seeker, moved in from the old Home: plain on white, not a navy card inside a box */
#h2-slot-ask .b-ask{background:none!important;color:var(--h2-ink)!important;padding:0!important;margin:0!important;border:0!important;box-shadow:none!important;min-height:0!important;height:auto!important}
#h2-slot-ask .b-ask .tag{display:none!important}
#h2-slot-ask .b-ask h3{font-family:var(--h2-display)!important;font-weight:500!important;font-size:21px!important;color:var(--h2-navy)!important;margin:2px 0 10px!important;line-height:1.2!important}
#h2-slot-ask .askbox{display:flex!important;align-items:center;gap:8px;background:none!important;border:0!important;border-bottom:1px solid var(--h2-navy-light)!important;padding:4px 0!important;border-radius:0!important}
#h2-slot-ask .askbox .in{flex:1;min-width:0}
#h2-slot-ask .askbox input{width:100%;border:0!important;background:none!important;font:16px var(--h2-text)!important;color:var(--h2-ink)!important;padding:4px 0!important;outline:none}
#h2-slot-ask .askbox .send{background:var(--h2-navy)!important;color:#fff!important;border-radius:50%!important;width:30px;height:30px;display:grid;place-items:center}
#h2-slot-ask .askbox .send svg{width:15px;height:15px;stroke:currentColor}
#h2-slot-ask .sug-row{display:flex!important;flex-wrap:wrap;gap:6px 14px;margin-top:10px!important}
#h2-slot-ask .sug{background:none!important;border:0!important;padding:0!important;color:var(--h2-muted)!important;font:13px var(--h2-sans)!important;text-decoration:underline;text-decoration-color:var(--h2-faint);text-underline-offset:4px;border-radius:0!important}
/* Documents, moved in from the old Home */
#h2-slot-docs .hm-tabs{display:inline-flex;border:1px solid var(--h2-hair);border-radius:999px!important;overflow:hidden;margin-bottom:6px}
#h2-slot-docs .hm-tabs button{font:12px var(--h2-sans);padding:3px 12px;color:var(--h2-muted);background:none;border:0;border-radius:0!important}
#h2-slot-docs .hm-tabs button.on{background:var(--h2-navy);color:#fff}
#h2-slot-docs .hm-doc{display:flex;gap:10px;align-items:flex-start;width:100%;text-align:left;padding:8px 0;border-top:1px solid var(--h2-hair);background:none}
#h2-slot-docs .hm-doc:first-of-type{border-top:0}
#h2-slot-docs .hm-doc .pg-i{flex:none;width:16px;height:20px;border:1px solid var(--h2-rule);margin-top:3px}
#h2-slot-docs .hm-doc .w{min-width:0;flex:1;font-family:var(--h2-text);font-size:15px;line-height:1.3;color:var(--h2-ink);white-space:normal;overflow-wrap:anywhere}
#h2-slot-docs .hm-doc .w small{display:block;font-family:var(--h2-sans);font-size:11px;color:var(--h2-muted);margin-top:2px}
#h2-slot-docs .hm-newdoc{margin-top:8px;font:13px var(--h2-sans);color:var(--h2-muted);text-decoration:underline;text-underline-offset:4px;background:none;border:0}
@container (max-width:560px){
  .h2-over{font-size:12px;padding:7px 8px}.h2-over .h2-links{display:flex!important;gap:10px}.h2-foot .h2-phone{display:inline!important}.h2-late .n{font-size:12.5px}.h2-late .a{gap:10px}
  #h2-slot-ask .b-ask h3{font-size:15px!important}#h2-slot-ask .askbox input{font-size:13px!important}
  #h2-slot-docs .hm-doc .w{font-size:12.5px}
}

/* ---------- 16/10 fixes from Ava's screenshot ---------- */
/* Room for what each box holds, and a quiet "More" cue instead of fading the last line into a ghost. */
.h2-box{position:relative}
.h2-bh{padding:13px 0 7px}
.h2-bh h3{font-size:22px}
.h2-body{padding:10px 18px 12px}
.h2-body.more{-webkit-mask-image:none!important;mask-image:none!important}
.h2-box.more .h2-body{margin-bottom:24px}
.h2-box.more::after{content:"More below ↓";position:absolute;left:0;right:0;bottom:0;height:24px;line-height:24px;text-align:center;font:11px var(--h2-sans);color:var(--h2-muted);border-top:1px solid var(--h2-hair);background:var(--h2-white);pointer-events:none}
/* After the meeting: one row in the box, not a box inside the box */
#h2-slot-needs .mtgq{border:0!important;box-shadow:none!important;background:none!important;padding:2px 0 10px!important;margin:0!important;border-bottom:1px solid var(--h2-hair)!important;border-radius:0!important}
/* The Task Matrix count: a plain row like its neighbours, not a rose strip */
#h2-slot-needs .tm-homewait{display:flex!important;gap:10px;align-items:baseline;background:none!important;border:0!important;border-bottom:1px solid var(--h2-hair)!important;border-radius:0!important;box-shadow:none!important;padding:10px 0!important;margin:0!important;font-family:var(--h2-text)!important;font-size:15.5px!important;color:var(--h2-body)!important;text-decoration:none}
#h2-slot-needs .tm-homewait .n{background:none!important;color:var(--h2-navy-mid)!important;font-family:var(--h2-sans)!important;font-weight:500!important;font-size:13px!important;padding:0!important;border-radius:0!important;min-width:0!important}
#h2-slot-needs .tm-homewait .go{margin-left:auto;color:var(--h2-muted)!important;background:none!important}
/* Ask Seeker: a smaller heading so the box shows the question and the suggestions */
#h2-slot-ask .b-ask h3{font-size:18px!important;margin:0 0 8px!important}
@container (max-width:560px){
  .h2-frame{--fh:640px}
  .h2-bh{padding:9px 0 5px}.h2-bh h3{font-size:16px}.h2-body{padding:6px 10px 8px}
  .h2-box.more .h2-body{margin-bottom:18px}.h2-box.more::after{content:"More ↓";height:18px;line-height:18px;font-size:10px}
  #h2-slot-needs .tm-homewait{font-size:12.5px!important}
  #h2-slot-needs .mtgq,#h2-slot-needs .mtgq *{font-size:12.5px!important;line-height:1.35!important}#h2-slot-needs .mtgq .k{font-size:9.5px!important}
  #h2-slot-ask .b-ask h3{font-size:14px!important}
}

/* ---------- 16/10 fixes from Ava's 00:35 recording ---------- */
.h2-bh{flex-wrap:nowrap}.h2-bh h3{white-space:nowrap}.h2-links{flex-wrap:nowrap;white-space:nowrap}
.h2-tz{font-family:var(--h2-sans);font-size:11.5px;color:var(--h2-muted);margin-left:10px;letter-spacing:.02em}
.h2-frame.h2-help{--fh:720px}
/* The Google warning on Your day: one calm, readable band */
#h2-slot-warn .hx-warn{display:block;background:var(--h2-rose-tint)!important;border:0!important;border-radius:0!important;padding:10px 12px!important;margin:0 0 10px!important;font:13.5px/1.5 var(--h2-text)!important;color:#7a3b37!important}
#h2-slot-warn .hx-warn b,#h2-slot-warn .hx-warn strong{font-weight:500}
#h2-slot-warn .hx-warn button,#h2-slot-warn .hx-warn a{font:12.5px var(--h2-sans)!important;color:#7a3b37!important;text-decoration:underline;text-underline-offset:3px;background:none!important;border:0!important;padding:0!important;margin:6px 12px 0 0!important}
/* Comms Hub: "Pick what you want to do" is one quiet line at every width (Ava 16/10: an empty card pushed the diary down) */
html #view-comms #ch-empty{padding:10px 16px!important;min-height:0!important}
html #view-comms #ch-empty .cx-empty{padding:0!important;font-size:0!important;line-height:0!important;text-align:left!important;min-height:0!important}
html #view-comms #ch-empty .cx-empty svg{display:none!important}
html #view-comms #ch-empty .cx-empty>b{display:block;font-size:13px!important;line-height:1.45!important;margin:0!important;font-weight:500;color:var(--cx-ink3,#5a6475)}
@container (max-width:560px){ .h2-tz{display:block;margin:2px 0 0} }

/* ---------- 16/10 01:00 — from Ava's 26-minute recording ---------- */
/* Home: the faint lines must still be readable */
.h2-free{color:var(--h2-muted)!important}
.h2-legend{color:var(--h2-muted)!important;font-size:12.5px!important}
.h2-tk .m{color:var(--h2-muted)}
/* People to add: the band already says "People to add"; the page's own title under it was a second copy */
#view-peopletoadd .pta-hl>.eyebrow-row,#view-peopletoadd .pta-hl>h1{display:none!important}
/* "121 tasks have gone quiet" repeats the Late tasks box: hidden (16/10 — the row restyle above had forced it back on) */
#h2-slot-needs .tm-homewait.quiet{display:none!important}

/* ---------- THE PLAN (16 Oct 2026): how-to text, checklist, Claude brief, "This plan is wrong", the strip on other pages ---------- */
.h2-how{font-family:var(--h2-text);font-size:17px;line-height:1.6;color:var(--h2-body);margin:0 0 10px}
.h2-how:last-child{margin-bottom:0}
.h2-check{margin-top:12px;border-top:1px solid var(--h2-hair);padding-top:10px;display:flex;flex-direction:column;gap:7px}
.h2-check label{display:flex;gap:10px;align-items:flex-start;font-size:14px;line-height:1.45;color:var(--h2-body);cursor:pointer}
.h2-check input{margin-top:3px;accent-color:var(--h2-navy)}
.h2-donewhen{font-family:var(--h2-text);font-size:15px;color:var(--h2-body);margin:6px 0 4px}
.h2-donewhen b{font-family:var(--h2-sans);font-weight:500;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--h2-rose);margin-right:8px}
.h2-planerr{color:var(--h2-ox)}
.h2-brief{margin-top:12px;border:1px solid var(--h2-hair);background:var(--h2-white);padding:12px 16px}
.h2-brief summary{cursor:pointer;font-size:13px;color:var(--h2-navy-mid)}
.h2-brief p{font-family:var(--h2-text);font-size:15px;line-height:1.55;color:var(--h2-body);margin:10px 0 0;max-height:260px;overflow:auto}
.h2-sent{color:var(--h2-navy-mid)}
.h2-fixbox{width:100%;font:16px var(--h2-text);border:0;border-bottom:1px solid var(--h2-navy-light);padding:6px 0;background:none;resize:vertical;color:var(--h2-ink)}
#home2 .h2-wrong{color:var(--h2-faint)}
a.h2-q{display:inline-flex;align-items:center}
.h2-strip{position:sticky;top:0;z-index:40;display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin:0 0 14px;padding:10px 18px;
  background:var(--b-navy,#131b2d);color:#fff;font-family:var(--b-sans,Jost,'Avenir Next','Segoe UI',sans-serif);font-size:13.5px}
.h2-strip-l{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:#c9d2e3}
.h2-strip-t{flex:1;min-width:0}
.h2-strip-t em{font-style:normal;color:#c9d2e3}
.h2-strip button{font:inherit;font-size:13px;background:#fff;color:var(--b-navy,#131b2d);border:0;border-radius:999px;padding:6px 14px;cursor:pointer}
@container (max-width: 560px){ .h2-how{font-size:13.5px} .h2-check label{font-size:12px} .h2-donewhen{font-size:12.5px} }
@media (max-width: 560px){ .h2-strip{font-size:12px;padding:8px 12px} .h2-strip-t em{display:none} }

/* ---------- 17/10 — from the click-test at laptop, mid and phone widths ---------- */
/* Mid widths (a half-screen window, a tablet): a box heading too narrow for its links puts them on a second line, not off the edge */
@container (min-width:561px) and (max-width:900px){
  .h2-bh{flex-wrap:wrap;row-gap:4px}.h2-links{flex-wrap:wrap;white-space:normal;gap:4px 14px}
}
/* "Show them · Move them to Monday" wraps inside the box on a phone */
.h2-over .h2-links{flex-wrap:wrap;white-space:normal}
/* the Task Matrix count: the number and the words never run together ("110things") */
#h2-slot-needs .tm-homewait .n{margin-right:6px!important}
/* a long sheet (Who should do these? lists 15) keeps Save in reach at the foot */
.h2-sheetw>.h2-acts:last-child{position:sticky;bottom:calc(-26px - env(safe-area-inset-bottom,0px));background:var(--h2-paper);margin:0 -30px calc(-26px - env(safe-area-inset-bottom,0px));padding:12px 30px calc(14px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--h2-hair)}
.h2-htitle{cursor:default}
@container (max-width:560px){
  .h2-sheetw>.h2-acts:last-child{bottom:-22px;margin:0 -18px -22px;padding:10px 18px 12px}
  /* the Google warning on a phone: smaller, so the day still shows under it */
  #h2-slot-warn .hx-warn{font-size:11.5px!important;line-height:1.4!important;padding:7px 8px!important}
  /* a long task title folds to four lines on a phone so the step is on the first screen; tap it to read it all */
  .h2-htitle{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;cursor:pointer}
  .h2-htitle.open{display:block;-webkit-line-clamp:unset}
}
/* The line for now (Ava 17/10: "accurate to the minute"): across the hour at its minute, the time beside it in the hour column */
.h2-hour{position:relative}
.h2-hour .h2-now{position:absolute;left:64px;right:0;height:0;margin:0;border-top:1.5px solid var(--h2-rose);z-index:2;pointer-events:none;transition:top .6s ease}
.h2-hour .h2-now::before{left:-4px;top:-4.5px}
.h2-hour .h2-now b{position:absolute;left:-64px;top:-8px;width:56px;font:500 11px/16px var(--h2-sans);color:var(--h2-rose);background:var(--h2-white);font-variant-numeric:tabular-nums}
.h2-hour.now{min-height:64px}
@container (max-width:560px){
  .h2-hour .h2-now{left:30px}.h2-hour .h2-now b{left:-30px;width:28px;font-size:9.5px;top:-7px;line-height:14px}
  .h2-hour.now{min-height:40px}
}
/* under the step: the two quiet ways out (17/10) */
.h2-after{display:flex;gap:18px;flex-wrap:wrap;margin-top:22px;padding-top:12px;border-top:1px solid var(--h2-hair)}
/* the step's checklist on the strip that follows you to another page */
.h2-strip-c{flex-basis:100%;display:flex;flex-wrap:wrap;gap:6px 18px;padding-top:6px;border-top:1px solid rgba(255,255,255,.18)}
.h2-strip-c label{display:flex;gap:7px;align-items:center;font-size:12.5px;color:#e4e9f2;cursor:pointer}
.h2-strip-c input{accent-color:#fff;margin:0}
@container (max-width:560px){ .h2-after{gap:10px;margin-top:14px} }

/* ---------- 18/10 — Ava: the right-hand boxes "look messy and not conducive to read from" ----------
   One pattern for every row: a small label line (who / when / what kind) with its links on the right, the words in
   Garamond under it, and at most one quiet line below. No dots, no pills, no big numbers, no coloured strips. */
.h2-it{padding:11px 0 12px;border-top:1px solid var(--h2-hair)}
.h2-body>.h2-it:first-child,.h2-hosted+.h2-it,.h2-cap+.h2-it{border-top:0}
.h2-it-k{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font:500 10.5px/1.4 var(--h2-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--h2-muted)}
.h2-it-k>span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.h2-it-a{display:flex;gap:14px;flex:none;letter-spacing:0;text-transform:none}
.h2-it-a .h2-q{font-size:12.5px}
.h2-it-t{font-family:var(--h2-text);font-size:16px;line-height:1.4;color:var(--h2-ink);margin-top:4px}
.h2-it-s{font-size:11.5px;color:var(--h2-muted);margin-top:3px}
/* the old Home pieces these rows now stand for: their shut lines step aside (the question form still opens in place) */
#h2-slot-needs .mtgq.mtgq-shut,#h2-slot-needs #home-tm-wait{display:none!important}
#h2-slot-needs .mtgq:not(.mtgq-shut){padding:4px 0 12px!important}
/* Ask Seeker: the prompt is one quiet line over the full width, not a heading that wraps at half the box */
#h2-slot-ask .b-ask h3{font-family:var(--h2-sans)!important;font-size:13px!important;font-weight:400!important;color:var(--h2-muted)!important;margin:2px 0 6px!important;max-width:none!important;width:auto!important}
#h2-slot-ask .b-ask{max-width:none!important;width:100%!important}
.h2-tabs button{font-size:20px}
.h2-tabs{gap:18px}
/* the line for now: its time replaces the hour's own label, so the two never print on top of each other */
.h2-hour.now>.t{color:transparent}
.h2-hour.now>.t small{color:transparent}
.h2-hour .h2-now b{background:transparent}
@container (max-width:560px){
  .h2-it{padding:7px 0 8px}.h2-it-k{font-size:9px;letter-spacing:.1em;flex-direction:column;gap:2px}.h2-it-a{gap:10px}.h2-it-a .h2-q{font-size:11px}
  .h2-it-t{font-size:12.5px;margin-top:2px}.h2-it-s{font-size:10px}
  #h2-slot-ask .b-ask h3{font-size:11px!important}
  .h2-tabs button{font-size:14px}.h2-tabs{gap:10px}
}

/* ---------- 18/10 — After the meeting on the day, Friday's plan-next-week page, the reminders sheet ---------- */
.h2-afterbox{background:var(--h2-rose-tint);padding:12px 14px;display:grid;gap:8px;margin:4px 0 6px}
.h2-afterbox .src{font-family:var(--h2-text);font-style:italic;font-size:15px;color:var(--h2-muted);margin:0}
.h2-after-q{font-family:var(--h2-text);font-size:16px;color:var(--h2-ink)}
.h2-chips{display:flex;flex-wrap:wrap;gap:7px}
#home2 .h2-chip{border:1px solid var(--h2-rule);background:var(--h2-white);padding:6px 12px;font:13px var(--h2-sans);color:var(--h2-body)}
#home2 .h2-chip.on{background:var(--h2-navy);color:#fff;border-color:var(--h2-navy)}
/* 23/10 — "Which deck was shown?" inside this box (register.js draws it in Home's look: the same chips, a quiet note) */
.h2-afterbox .rg-deck{display:grid;gap:8px}
.h2-afterbox .rg-deck .h2-cap{margin:0}
#home2 .h2-chip i{font-style:normal;margin-left:6px;font-size:11px;opacity:.7}
.h2-found{display:grid;gap:4px}
.h2-found label{display:flex;gap:9px;align-items:flex-start;font-family:var(--h2-text);font-size:15px;color:var(--h2-body);cursor:pointer}
.h2-found small{font-family:var(--h2-sans);font-size:11.5px;color:var(--h2-muted);margin-left:6px}
.h2-found input{margin-top:5px;accent-color:var(--h2-navy)}
.h2-frame.h2-one{grid-template-columns:minmax(0,1fr);height:auto;max-width:860px}
.h2-frame.h2-one .h2-body{overflow:visible}
.h2-week{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:14px 0 4px}
.h2-wd{border:1px solid var(--h2-hair);background:var(--h2-white);padding:8px 10px;min-height:110px}
.h2-wd h4{margin:0 0 6px;font:500 11px var(--h2-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--h2-muted)}
.h2-wd .m{font-size:11.5px;background:var(--h2-meet);color:var(--h2-navy);padding:3px 6px;margin-bottom:4px}
.h2-wd .k{font-family:var(--h2-text);font-size:13.5px;color:var(--h2-ink);padding:3px 0;border-top:1px solid var(--h2-hair)}
.h2-sheetw .h2-tog{width:40px;height:22px;border-radius:999px!important;background:var(--h2-mist);border:1px solid var(--h2-rule);position:relative;flex:none}
.h2-sheetw .h2-tog::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:left .2s}
.h2-sheetw .h2-tog[aria-pressed="true"]{background:var(--h2-navy);border-color:var(--h2-navy)}
.h2-sheetw .h2-tog[aria-pressed="true"]::after{left:20px}
@container (max-width:560px){
  .h2-afterbox{padding:8px}.h2-afterbox .src,.h2-after-q{font-size:12.5px}#home2 .h2-chip{font-size:11px;padding:4px 8px}.h2-found label{font-size:12.5px}
  .h2-week{grid-template-columns:1fr}.h2-wd{min-height:0}
}

/* ---------- 18/10 — Your day as TWO LANES (version C, Ava's pick) ---------- */
.h2-lanes{position:relative;margin-top:2px}
.h2-lh{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding-right:0;font:500 10.5px var(--h2-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--h2-muted);margin:2px 0 6px}
.h2-canvas{position:relative}
.h2-hl{position:absolute;left:0;right:0;height:0;border-top:1px solid var(--h2-hair)}
.h2-hl span{position:absolute;left:0;top:3px;font-size:12px;color:var(--h2-muted);font-variant-numeric:tabular-nums;line-height:1.25}
.h2-hl span small{display:block;font-size:10px;color:var(--h2-faint)}
.h2-hl.past span{opacity:.55}
.h2-blk{position:absolute;box-sizing:border-box;overflow:hidden;padding:6px 10px;min-width:0}
.h2-blk.m{background:var(--h2-meet);display:flex;flex-direction:column;gap:2px}
.h2-blk.m.theirs{background:var(--h2-mist)}
.h2-blk.m .n{font-family:var(--h2-text);font-size:15px;line-height:1.25;color:var(--h2-navy);text-align:left;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.h2-blk.m.theirs .n{color:var(--h2-muted)}
.h2-blk .w{font-size:11.5px;color:var(--h2-muted);white-space:nowrap}
.h2-blk .a{display:flex;gap:10px;flex-wrap:wrap}
#home2 .h2-blk .a button{font-size:12px;color:var(--h2-navy);text-decoration:underline;text-underline-offset:3px}
.h2-blk.t{background:var(--h2-white);border:1px solid var(--h2-rule);display:grid;grid-template-columns:18px minmax(0,1fr);gap:9px;align-items:start}
.h2-blk.t .h2-ring{margin-top:2px}
.h2-blk.t .b{display:flex;flex-direction:column;gap:1px;min-width:0}
.h2-blk.t .n{font-family:var(--h2-text);font-size:15px;line-height:1.25;color:var(--h2-ink);text-align:left;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.h2-blk.t .m{font-size:11.5px;color:var(--h2-muted);text-align:left;white-space:nowrap}
.h2-blk.t.focus{border-color:var(--h2-rose);background:var(--h2-rose-tint)}
.h2-blk.t.plat .h2-ring{border-color:var(--h2-plat)!important;border-style:dashed!important}
.h2-blk.t.late .h2-ring{border-color:var(--h2-rose)!important}
.h2-blk.t.done .n{color:var(--h2-faint);text-decoration:line-through}
.h2-blk.t.done .h2-ring{background:var(--h2-navy-light);border-color:var(--h2-navy-light)!important}
.h2-blk.past{opacity:.55}
.h2-blk:hover{z-index:2}
#home2 .h2-freeblk{position:absolute;border:1px dashed var(--h2-rule);color:var(--h2-muted);font-size:12px;display:flex;align-items:center;justify-content:center;box-sizing:border-box}
#home2 .h2-freeblk:hover{color:var(--h2-navy-mid);border-color:var(--h2-navy-light)}
.h2-lnow{position:absolute;right:0;height:0;border-top:1.5px solid var(--h2-rose);z-index:3;pointer-events:none;transition:top .6s ease}
.h2-lnow::before{content:"";position:absolute;left:-4px;top:-4.5px;width:7px;height:7px;border-radius:50%;background:var(--h2-rose)}
.h2-lnow b{position:absolute;right:100%;margin-right:4px;top:-8px;font:500 11px/16px var(--h2-sans);color:var(--h2-rose);background:var(--h2-white);padding:0 2px;font-variant-numeric:tabular-nums}
.h2-under{margin-top:14px;padding-top:10px;border-top:1px solid var(--h2-hair)}
.h2-under .h2-next{margin-left:0}
@container (max-width:560px){
  .h2-lh{font-size:8.5px;letter-spacing:.1em;gap:6px}
  .h2-hl span{font-size:9.5px}
  .h2-blk{padding:4px 6px}
  .h2-blk.m .n,.h2-blk.t .n{font-size:11.5px}
  .h2-blk .w,.h2-blk.t .m{font-size:9.5px}
  #home2 .h2-blk .a button{font-size:9.5px}#home2 .h2-blk .a{gap:6px}
  .h2-blk.t{grid-template-columns:12px minmax(0,1fr);gap:5px}.h2-blk.t .h2-ring{width:12px;height:12px}
  #home2 .h2-freeblk{font-size:9.5px}
  .h2-lnow b{font-size:9px}
  .h2-under{margin-top:10px;padding-top:6px}
}
/* a block's words never shrink away: the title keeps its lines, the links go first when there is no room */
.h2-blk.m>*{flex:none}
#home2 .h2-blk .n{display:block;max-height:2.5em;overflow:hidden;text-overflow:ellipsis}
.h2-blk.t .b>*{flex:none}
/* up to two lines of title per block (Ava's device check, 21/10); relax() in home2.js grows a block whose words need the room,
   so the time, Move and Prepare / Join / Open still show under them */
#home2 .h2-blk .n{white-space:normal;max-height:2.5em}
#home2 .h2-blk.m .n{white-space:nowrap;max-height:1.35em}
@container (max-width:560px){ .h2-it-k>span:first-child{white-space:normal} }
/* the whole day fits the box: the meeting's time and its links share one line, so a short block still shows them */
.h2-blk.m .a{align-items:baseline}
.h2-blk.m .a .w{margin-right:4px}

/* ===== DAY · WEEK · MONTH (Ava 21/10, mock-up 2jHbu4v81JT4pSyUTmMPSu) ===== */
.h2-vnav{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:0 20px;padding:10px 0 2px}
.h2-seg{display:flex;gap:18px}
#home2 .h2-seg button{font-family:var(--h2-sans);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--h2-faint);padding-bottom:3px;border-bottom:1px solid transparent}
#home2 .h2-seg button[aria-pressed="true"]{color:var(--h2-navy);border-bottom-color:var(--h2-navy)}
.h2-vstep{display:flex;align-items:center;gap:14px}
#home2 .h2-arrow{width:28px;height:28px;border-radius:50%!important;border:1px solid var(--h2-rule);display:grid;place-items:center;color:var(--h2-navy);font-size:16px;line-height:1}
#home2 .h2-arrow:hover{background:var(--h2-mist)}
#home2 .h2-vstep .h2-q[disabled]{opacity:.35;cursor:default;text-decoration:none}
/* the week */
.h2-wk{display:grid;grid-template-columns:40px repeat(5,minmax(0,1fr));gap:0 6px;margin-top:4px}
.h2-wdh{padding:2px 2px 8px;border-bottom:1px solid var(--h2-hair)}
#home2 .h2-wdh button{text-align:left}
.h2-wdh i{display:block;font-style:normal;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--h2-muted)}
.h2-wdh b{display:block;font-family:var(--h2-display);font-weight:500;font-size:20px;color:var(--h2-navy);line-height:1.05}
.h2-wdh.now b{color:var(--h2-rose)}
.h2-wkhrs{position:relative}
.h2-wkhrs span{position:absolute;left:0;font-size:10.5px;color:var(--h2-faint);font-variant-numeric:tabular-nums;transform:translateY(-6px)}
.h2-wcol{position:relative;border-left:1px solid var(--h2-hair)}
.h2-wcol.now{background:linear-gradient(var(--h2-paper),var(--h2-paper))}
.h2-drop{background:var(--h2-rose-tint)!important}
#home2 .h2-wb{position:absolute;left:3px;right:3px;padding:3px 6px;overflow:hidden;font-size:11.5px;line-height:1.25;text-align:left;display:block}
#home2 .h2-wb.m{background:var(--h2-meet);border-left:2px solid var(--h2-navy-light);color:var(--h2-body)}
#home2 .h2-wb.m.theirs{background:none;border:1px dashed var(--h2-rule);border-left:2px solid var(--h2-faint);color:var(--h2-muted)}
#home2 .h2-wb.t{background:var(--h2-white);border:1px solid var(--h2-rule);color:var(--h2-ink);font-family:var(--h2-text);font-size:13px;cursor:grab}
#home2 .h2-wb.past{opacity:.5}
.h2-wb .tm{display:block;font-family:var(--h2-sans);font-size:10px;color:var(--h2-muted);font-variant-numeric:tabular-nums}
.h2-wnow{position:absolute;left:0;right:0;border-top:1px solid var(--h2-rose);pointer-events:none}
.h2-wun{grid-column:2/-1;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin-top:10px}
.h2-wun>.h2-cap{grid-column:1/-1;font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--h2-faint)}
.h2-wun>div{display:grid;gap:4px;align-content:start;min-height:34px;min-width:0}
#home2 .h2-chipt{display:block;width:100%;text-align:left;font-family:var(--h2-text);font-size:13px;line-height:1.3;color:var(--h2-ink);padding:5px 7px;border:1px dashed var(--h2-rule);background:var(--h2-white);cursor:grab;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;white-space:normal;overflow-wrap:anywhere}
/* the month */
.h2-mo{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border-top:1px solid var(--h2-hair);border-left:1px solid var(--h2-hair);margin-top:4px}
.h2-mo .wd{font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--h2-faint);padding:6px;border-right:1px solid var(--h2-hair);border-bottom:1px solid var(--h2-hair)}
#home2 .h2-cell{min-height:96px;padding:6px 6px 8px;border-right:1px solid var(--h2-hair);border-bottom:1px solid var(--h2-hair);text-align:left;display:flex;flex-direction:column;gap:3px;min-width:0;align-items:flex-start}
#home2 .h2-cell:hover{background:var(--h2-mist)}
.h2-cell.we{background:var(--h2-paper)}
.h2-cell .d{font-family:var(--h2-display);font-size:18px;font-weight:500;color:var(--h2-navy);line-height:1}
.h2-cell.out .d{color:var(--h2-faint)}
.h2-cell.now .d{color:#fff;background:var(--h2-rose);border-radius:50%!important;width:26px;height:26px;display:grid;place-items:center;font-size:15px}
.h2-cell .l{font-size:11px;line-height:1.3;color:var(--h2-body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.h2-cell .l::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:5px;transform:translateY(-1px)}
.h2-cell .l.m::before{background:var(--h2-navy-light)}
.h2-cell .l.t::before{border:1px solid var(--h2-navy-light)}
.h2-cell .more{font-size:10.5px;color:var(--h2-muted)}
.h2-cell .dots{display:none;gap:3px;flex-wrap:wrap}
.h2-cell .dots i{width:5px;height:5px;border-radius:50%;background:var(--h2-navy-light)}
.h2-cell .dots i.t{background:none;border:1px solid var(--h2-navy-light)}
@container (max-width:560px){
  .h2-vnav{margin:0 10px;padding-top:6px}.h2-seg{gap:12px}
  .h2-wk{grid-template-columns:26px repeat(5,minmax(0,1fr));gap:0 2px}
  #home2 .h2-wb{font-size:9.5px;padding:2px 3px}#home2 .h2-wb .tm{display:none}#home2 .h2-wb.t,#home2 .h2-chipt{font-size:11px}
  .h2-wdh i{font-size:9px;letter-spacing:.02em}.h2-wdh b{font-size:17px}.h2-mo .wd{font-size:9px;letter-spacing:0;padding:4px 2px;overflow:hidden}
  #home2 .h2-cell{min-height:54px;padding:4px}.h2-cell .l,.h2-cell .more{display:none}.h2-cell .dots{display:flex}
}

/* pass 21/10: a week block keeps its words whole, wrapping onto the lines its height allows */
#home2 .h2-wb{overflow-wrap:anywhere;hyphens:auto}
/* pass 21/10: an older button rule kept the week's chips on one line; these win */
#home2 .h2-wun .h2-chipt{display:-webkit-box!important;-webkit-line-clamp:2;-webkit-box-orient:vertical;white-space:normal!important;overflow:hidden}
#home2 .h2-wk .h2-wb{white-space:normal!important}

/* ---------- a phone, from 21/10 (Ava): ONE column on Home. Your day (day, week or month) first, full width; Needs you,
   Waiting on others, Ask Seeker and Late tasks under it, each its own box. This replaces "keep two columns" (15/10) on
   Home only; the Task Helper keeps its two. ---------- */
@container (max-width:560px){
  .h2-frame:not(.h2-help):not(.h2-one){grid-template-columns:minmax(0,1fr);height:auto;gap:12px;padding:10px 8px 24px}
  .h2-frame:not(.h2-help):not(.h2-one)>.h2-box{height:min(680px,calc(100svh - 120px))}
  .h2-frame:not(.h2-help):not(.h2-one)>.h2-stack{grid-template-rows:none;gap:12px}
  .h2-frame:not(.h2-help):not(.h2-one)>.h2-stack>.h2-box{height:320px}
  .h2-frame:not(.h2-help):not(.h2-one) .h2-bh h3{font-size:19px}
  .h2-frame:not(.h2-help):not(.h2-one) .h2-stack .h2-links{display:flex}
  .h2-frame:not(.h2-help):not(.h2-one) .h2-stack .h2-it-t{font-size:15px}
}

/* ---------- third pass of Home, 21/10 (laptop and phone) ---------- */
/* The old "#home2 button{padding:0;border:0}" reset outranked these, so the Move sheet's rows and the Task Helper's steps
   lost their spacing and dividing lines. */
#home2 .h2-opt{padding:12px 0;border-top:1px solid var(--h2-hair)}
#home2 .h2-step{padding:9px 0;border-top:1px solid var(--h2-hair)}
#home2 .h2-step:first-child{border-top:0}
/* A sheet sits in the middle of a laptop screen (it was pinned to the bottom edge and ran off it); a phone keeps the bottom sheet. */
@media (min-width:700px){ .h2-veil{align-items:center;padding:24px} }
/* "More below" sits on the body's lower edge, above the box's foot, never on top of it. */
.h2-box.more::after{bottom:var(--h2-foot,0px)}
/* Week chips: two whole lines, never a slice of a third. */
#home2 .h2-wun .h2-chipt{display:block!important;white-space:normal!important}
#home2 .h2-chipt .tx{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* Month dots are round (a global radius rule squared them). */
.h2-cell .dots i,.h2-cell .l::before{border-radius:50%!important}
@container (max-width:560px){
  /* Waiting on others: its two links go under the heading instead of running out of the box. */
  .h2-frame:not(.h2-help):not(.h2-one) .h2-stack .h2-bh{flex-wrap:wrap}
  .h2-frame:not(.h2-help):not(.h2-one) .h2-stack .h2-bh .h2-links{flex-basis:100%;gap:14px;font-size:12px}
  /* Week and Month take the height they need, with no white space under the calendar. */
  .h2-frame:not(.h2-help):not(.h2-one)>.h2-box.h2-v-month,.h2-frame:not(.h2-help):not(.h2-one)>.h2-box.h2-v-week{height:auto}
  .h2-box.h2-v-month>.h2-body,.h2-box.h2-v-week>.h2-body{overflow:visible}
}

/* ---------- visual pass, 21/10 (impeccable audit, laptop + phone) ---------- */
/* Contrast: muted text measured 3.4–3.9:1 on white; a slightly deeper slate keeps the look and reads at 4.5:1 or better.
   Tabs not chosen (Week, Month, People, Documents) used the faint grey at 2.2:1 — they now use the muted tone. */
#home2{--h2-muted:#666e7e}
#home2 .h2-seg button[aria-pressed="false"],#home2 .h2-tabs button:not(.on){color:var(--h2-muted)}
#home2 .h2-arrow svg{display:block}
@container (max-width:560px){
  /* Nothing under 11px on a phone (labels were 9–10px). */
  .h2-it-k,.h2-it-k span,.h2-it-s,.h2-blk .m,.h2-lnow b,.h2-wdh i{font-size:11px!important}
  /* Fingers, not pointers: bigger tap areas without changing the look. */
  #home2 .h2-ring{position:relative}
  #home2 .h2-ring::after{content:"";position:absolute;inset:-12px}
  #home2 .h2-arrow{width:38px;height:38px}
  #home2 .h2-seg button{padding:10px 0 6px}
  .h2-frame:not(.h2-help):not(.h2-one) .h2-q{padding-block:6px;display:inline-block}
}