/* ── Health page ─────────────────────────────────────────────────────────────
   Leans on the shared Tasks chrome (.sec-card / .task-list / .task / .task-text
   / .add-trig) so rows match the Tasks page. The category tabs live in the real
   top bar (.health-sub), so the page body starts cleanly with no top gap. */
#page-health{overflow:visible;box-sizing:border-box;}

.health-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:10px;height:60vh;color:var(--t2);font-family:var(--font);font-size:14px;}
.health-spinner{width:22px;height:22px;border-radius:50%;border:2.5px solid var(--sep);
  border-top-color:var(--acc);animation:health-spin .7s linear infinite;margin:4px 0;}
@keyframes health-spin{to{transform:rotate(360deg);}}

/* Note preview on a collapsed task (like the Tasks page) */
.health-note-preview{font-family:var(--font);font-size:12px;color:var(--t2);line-height:1.4;
  padding:0 0 8px;white-space:pre-wrap;word-break:break-word;}

/* The view switcher is a real tasks-rail in the top bar (same chips, same mail +
   bell), shown only while Health is the active page. */
#top-bar[data-page=health] .health-sub{display:flex;}
.health-sub::before{
  display:none;
  content:'';
}
.top-bar.tasks-scrolled .health-sub::before{opacity:0;}

/* ── Top rail (#2/#11) ───────────────────────────────────────────────────────
   Uses the shared .tasks-rail 3-column grid (col1 | col2 centred | col3) so the
   view chips stay centred like the Tasks page — NO flex override. Left col holds
   the freeze countdown + day stepper; all of it is themed with the same
   sidebar-control tokens as the nav chips, and stretches to the chip height. */
.health-rail-left{grid-column:1;justify-self:start;display:flex;align-items:center;gap:10px;min-width:0;}
.health-freeze-timer{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;
  align-self:stretch;min-height:42px;gap:3px;font-family:var(--font);line-height:1;padding:0 13px;border-radius:10px;
  background:var(--sidebar-control-bg);border:1px solid var(--sidebar-control-border);white-space:nowrap;flex:0 0 auto;}
.health-freeze-label{font-size:8px;font-weight:800;letter-spacing:.13em;color:var(--t3);}
.health-freeze-time{font-size:15px;font-weight:700;color:var(--sidebar-control-text);font-variant-numeric:tabular-nums;letter-spacing:.02em;}
.health-panel-switcher{display:inline-flex;align-items:center;min-height:42px;border-radius:10px;
  background:var(--sidebar-control-bg);border:1px solid var(--sidebar-control-border);padding:0 8px;}
.health-panel-select{max-width:160px;border:0;background:transparent;color:var(--sidebar-control-text);
  font:700 12px var(--font);outline:none;cursor:pointer;}
.health-panel-select option{background:var(--card);color:var(--t1);}
.health-panel-mobile-switch{display:none;margin:0 0 12px;width:max-content;max-width:100%;}
.health-panel-manage-btn{width:auto!important;min-width:74px;padding:0 12px!important;font:700 12px var(--font)!important;}
.health-gate{width:min(480px,calc(100vw - 48px));margin:80px auto;display:grid;gap:12px;color:var(--t2);}
.health-gate-title{font:800 24px var(--font);letter-spacing:-.03em;color:var(--t1);}
.health-gate-copy{font:500 13px/1.6 var(--font);color:var(--t2);}
.health-gate-card{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px;border-radius:14px;
  background:var(--card);border:1px solid rgba(255,255,255,.08);}
.health-gate-meta{min-width:0;}
.health-gate-card-title{font:750 14px var(--font);color:var(--t1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.health-gate-card-sub{font:500 11px var(--font);color:var(--t3);margin-top:3px;}
.health-gate-actions{display:flex;align-items:center;gap:8px;flex:0 0 auto;}
.health-gate-primary{width:auto;min-width:86px;margin:0;padding:9px 12px;}
.health-create-inline{justify-self:start;}
.health-create-form .hosted-field input{background:rgba(0,0,0,.22);}
.health-panel-card{max-width:620px;}
.health-panel-manage-body{display:grid;gap:14px;min-width:min(520px,calc(100vw - 80px));}
.health-panel-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:end;}
.health-panel-form .admin-output{grid-column:1/-1;margin-top:0;}
.health-panel-section-title{margin-top:4px;margin-bottom:0;}
/* Day stepper: a themed pill (arrows + FIXED-WIDTH date so arrows never shift)
   plus an integrated Today button. */
.health-day-stepper{display:flex;align-items:center;gap:8px;flex:0 0 auto;}
.health-day-pill{display:flex;align-items:center;align-self:stretch;min-height:42px;overflow:hidden;
  background:var(--sidebar-control-bg);border:1px solid var(--sidebar-control-border);border-radius:10px;}
.health-day-arrow{flex:0 0 auto;width:34px;align-self:stretch;border:none;background:transparent;color:var(--t2);
  display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .14s,color .14s;}
.health-day-arrow:hover{background:var(--sidebar-hover-bg);color:var(--sidebar-hover-text);}
.health-day-stepper.is-disabled .health-day-arrow,
.health-day-arrow:disabled{cursor:default;color:color-mix(in srgb,var(--t3) 62%,transparent);}
.health-day-stepper.is-disabled .health-day-arrow:hover,
.health-day-arrow:disabled:hover{background:transparent;color:color-mix(in srgb,var(--t3) 62%,transparent);}
.health-day-label{width:166px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  font-family:var(--font);font-size:13px;font-weight:700;color:var(--sidebar-control-text);letter-spacing:-.01em;}
.health-day-stepper.is-disabled .health-day-label{color:color-mix(in srgb,var(--sidebar-control-text) 72%,transparent);}

.health-body{padding:10px 24px 92px;max-width:1320px;margin:0 auto;
  min-height:calc(100vh - var(--top-h) - var(--safe-t) - 92px);box-sizing:border-box;}

.health-momentum{position:fixed;left:calc(var(--side-w) + var(--safe-l));right:0;bottom:0;z-index:690;
  min-height:76px;padding:13px 34px 14px;border-top:1px solid rgba(255,255,255,.09);
  border-left:1px solid rgba(255,255,255,.05);background:color-mix(in srgb,var(--bg) 78%,#202020);
  box-shadow:0 -10px 28px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.025);
  backdrop-filter:blur(18px) saturate(128%);-webkit-backdrop-filter:blur(18px) saturate(128%);
  transform:translateY(0);}
.health-momentum-content{height:100%;display:flex;flex-direction:column;justify-content:center;gap:9px;}
.health-momentum-top{display:flex;align-items:center;justify-content:space-between;gap:12px;}
.health-momentum-copy{display:flex;flex-direction:column;gap:0;min-width:0;}
.health-momentum-title{font-family:var(--font);font-size:11.5px;font-weight:850;letter-spacing:.055em;text-transform:uppercase;color:color-mix(in srgb,var(--t2) 84%,#fff);}
.health-momentum-state{display:flex;align-items:baseline;justify-content:flex-end;gap:9px;flex:0 0 176px;min-width:176px;font-family:var(--font);font-weight:800;color:var(--t1);}
.health-momentum-state-label{font-size:12.5px;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:right;}
.health-momentum-percent{font-size:17px;font-variant-numeric:tabular-nums;color:color-mix(in srgb,var(--acc) 78%,#fff);min-width:42px;text-align:right;}
.health-momentum-rail{height:11px;border-radius:999px;overflow:hidden;background:rgba(255,255,255,.07);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.035);}
.health-momentum-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,#55c279,#7fa4ff);
  box-shadow:0 0 12px rgba(85,194,121,.18);transition:width .58s cubic-bezier(.22,.9,.25,1);will-change:width;}
.health-momentum-sub{font-family:var(--font);font-size:11.5px;color:var(--t3);}
.health-momentum-sub:empty{display:none;}
.health-cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;align-items:start;}
.health-setup-cols{grid-template-columns:repeat(3,minmax(0,1fr));}
.health-setup-protocol{display:flex;flex-direction:column;gap:11px;min-width:0;}
.health-setup-head{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0;padding:0 2px;}
.health-setup-title{font-family:var(--font);font-size:11.5px;font-weight:850;letter-spacing:.055em;text-transform:uppercase;color:color-mix(in srgb,var(--t2) 86%,#fff);padding:0 2px;}
.health-setup-nav{display:flex;align-items:center;gap:6px;flex:0 0 auto;}
.health-setup-nav-btn{position:relative;width:32px;height:30px;border:1px solid rgba(255,255,255,.11);border-radius:8px;
  background:rgba(255,255,255,.045);color:var(--t2);display:inline-flex;align-items:center;justify-content:center;
  padding:0;cursor:pointer;transition:background .14s,border-color .14s,color .14s,opacity .14s;}
.health-setup-nav-btn svg{width:17px;height:17px;}
.health-setup-nav-btn:hover{background:rgba(255,255,255,.075);border-color:rgba(127,164,255,.28);color:var(--t1);}
.health-setup-nav-btn:disabled{cursor:default;opacity:.38;color:var(--t3);}
.health-setup-nav-btn:disabled:hover{background:rgba(255,255,255,.045);border-color:rgba(255,255,255,.11);color:var(--t3);}
.health-week-grid{display:grid;grid-template-columns:repeat(7,minmax(310px,330px));gap:12px;align-items:start;
  min-width:0;overflow-x:auto;overflow-y:visible;scroll-snap-type:none;scroll-padding:0 2px;
  padding:0 2px 12px;margin:0 -2px;scrollbar-width:none;}
.health-week-grid::-webkit-scrollbar{display:none;}
.health-week-grid.is-panning{cursor:grabbing;}
.health-weekday-col{min-width:0;scroll-snap-align:start;}
.health-weekday-col>.health-col-head{height:42px;padding:0 12px;cursor:grab;}
.health-week-grid.is-panning .health-weekday-col>.health-col-head{cursor:grabbing;}

/* Column header */
.health-col{display:flex;flex-direction:column;min-width:0;}
.health-col-head{display:flex;align-items:center;gap:8px;padding:0 2px 11px;height:39px;box-sizing:border-box;}
.health-profile-col{position:relative;z-index:1;}
.health-profile-col:hover{z-index:60;}
.health-profile-col>.health-col-head{position:relative;height:98px;padding:14px 14px 12px;display:grid;grid-template-columns:32px minmax(0,1fr)32px;
  align-items:center;gap:10px;border:1px solid var(--sep);border-bottom:none;border-radius:12px 12px 0 0;
  background:var(--card);box-shadow:none;margin-bottom:-1px;z-index:2;}
.health-profile-col>.health-col-head,
.health-setup-col>.health-col-head{border-bottom:1px solid var(--sep);}
.health-setup-col>.health-col-head{height:56px;padding:0 14px;position:relative;z-index:2;
  border:1px solid var(--sep);border-radius:12px 12px 0 0;background:var(--card);margin-bottom:-1px;
  box-shadow:none;}
.health-setup-col.health-weekday-col>.health-col-head{height:42px;padding:0 12px;}
.health-profile-head{isolation:isolate;overflow:visible;}
.health-profile-head::before{content:'';position:absolute;inset:0;border-radius:inherit;z-index:3;pointer-events:none;opacity:0;
  background:linear-gradient(90deg,rgba(0,0,0,0),rgba(70,54,8,.38),rgba(0,0,0,.18));}
.health-profile-head>.health-profile-side,
.health-profile-head>.health-profile-main{position:relative;z-index:1;}
.health-col-titlewrap{display:flex;align-items:center;gap:8px;min-width:0;flex:1;}
.health-setup-col .health-col-titlewrap{height:100%;}
.health-profile-main{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;text-align:center;align-self:center;}
.health-profile-side{min-width:0;display:flex;align-items:center;justify-content:center;}
.health-profile-head .health-profile-side{align-self:stretch;flex-direction:column;gap:6px;}
.health-profile-badges{gap:5px;flex-wrap:wrap;align-content:center;}
.health-profile-drag{position:relative;width:30px;height:30px;display:flex;align-items:center;justify-content:center;color:var(--t3);
  opacity:0;visibility:hidden;cursor:grab;border-radius:8px;transform:scale(.96);
  transition:opacity .14s,color .14s,background .14s,transform .14s,visibility 0s linear .14s;touch-action:none;}
.health-profile-head:hover .health-profile-drag,
.health-profile-drag:hover{opacity:1;visibility:visible;transform:scale(1);transition-delay:0s;}
.health-profile-drag:hover{color:var(--t2);background:rgba(255,255,255,.045);}
.health-profile-col.health-col-dragging .health-profile-drag{opacity:1;color:var(--t1);cursor:grabbing;}
.health-col-ico{display:inline-flex;color:var(--t2);}
.health-av{border-radius:50%;object-fit:cover;flex:0 0 auto;background:var(--rh);
  display:inline-flex;align-items:center;justify-content:center;
  -webkit-user-drag:none;user-select:none;}
/* An <img> avatar must be a block flex-item so it centres in the header without
   baseline drift (was shifting headers in Setup — #12). */
img.health-av{display:block;}
.health-av-fallback{font-size:10px;font-weight:700;color:var(--t1);font-family:var(--font);}
.health-avatar-wrap{position:relative;display:inline-flex;align-items:center;justify-content:center;line-height:0;}
.health-presence{position:absolute;right:-1px;bottom:-1px;width:12px;height:12px;border-radius:50%;
  border:2px solid var(--card);box-sizing:border-box;pointer-events:auto;overflow:hidden;}
.health-presence-online{background:#44b96b;}
.health-presence-offline{background:#8c8f99;}
.health-presence-idle{background:#ffc24d;}
.health-presence-idle::after{content:'';position:absolute;right:-2px;top:-2px;width:8px;height:8px;border-radius:50%;background:var(--card);}
.health-col-title{font-family:var(--font);font-size:15px;font-weight:600;color:var(--t1);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.01em;}
.health-profile-head .health-col-title{max-width:100%;font-size:14px;font-weight:750;}
.health-col-you .health-col-title{color:color-mix(in srgb,var(--acc) 82%,#fff);}
.health-col-badge{font-family:var(--font);font-size:10.5px;font-weight:700;letter-spacing:.02em;
  padding:2px 7px;border-radius:6px;text-transform:uppercase;display:inline-flex;align-items:center;gap:4px;line-height:1.25;}
.health-col-badge-ico{display:inline-flex;align-items:center;justify-content:center;}
.health-col-badge-ico svg{width:12px;height:12px;}
.health-col-badge.shared{color:var(--urgent);background:rgba(228,58,58,.1);}
.health-col-badge.personal{color:var(--done);background:rgba(85,194,121,.1);}
/* "You" marker on the signed-in user's own column */
.health-col-you-tag{font-family:var(--font);font-size:10px;font-weight:700;letter-spacing:.04em;
  text-transform:uppercase;color:var(--acc);background:color-mix(in srgb,var(--acc) 16%,transparent);
  padding:2px 6px;border-radius:6px;flex:0 0 auto;}
/* On desktop, outline the signed-in user's own column in accent blue so it's
   instantly clear which card is theirs (light-gray like everyone else's was easy
   to lose). Mobile is a single-column carousel, so the cue isn't needed there. */
@media (min-width:961px){
  .health-col-you>.health-col-head{border-color:color-mix(in srgb,var(--acc) 72%,var(--sep));border-bottom-color:var(--sep);}
  .health-col-you .health-col-card{border-color:color-mix(in srgb,var(--acc) 72%,var(--sep));}
}
.health-ping-btn,.health-mini-badge{position:relative;width:31px;height:31px;border-radius:10px;display:inline-flex;
  align-items:center;justify-content:center;box-sizing:border-box;}
.health-ping-btn{width:30px;height:30px;border:0;background:transparent;color:var(--t3);
  padding:0;border-radius:8px;}
.health-ping-btn{cursor:pointer;transition:color .14s,background .14s;}
.health-ping-btn:hover{background:rgba(255,255,255,.09);color:var(--t1);}
.health-ping-btn:disabled{opacity:1;cursor:default;transform:none;color:color-mix(in srgb,var(--t3) 58%,transparent);}
.health-ping-btn.is-sent{color:#55c279;background:transparent;}
.health-mini-badge{width:30px;height:30px;border:0;background:transparent;color:var(--t2);padding:0;border-radius:8px;}
.health-ping-btn svg{width:16px;height:16px;}
.health-mini-badge svg{width:16px;height:16px;}
.health-mini-badge-pace{color:#7fa4ff;}
.health-mini-badge-streak{color:#f7d774;}
.health-mini-badge-comeback{color:#55c279;}
.health-col-ping-focus>.health-col-head{animation:healthPingFocus 1.15s ease both;}
@keyframes healthPingFocus{0%{filter:none}22%{filter:drop-shadow(0 0 14px rgba(111,151,246,.45))}100%{filter:none}}
.health-profile-head.health-day-complete{animation:healthDayHead 2.6s ease both;}
.health-profile-head.health-day-complete::before{animation:healthDayTint 2.35s .08s cubic-bezier(.2,.8,.2,1) both;}
.health-profile-head.health-day-complete-reduced{box-shadow:inset 0 0 0 1px rgba(247,215,116,.38),inset 0 0 0 999px rgba(0,0,0,.16);}
.health-day-crown,.health-day-avatar-crown{pointer-events:none;color:#f7d774;}
.health-day-crown{filter:drop-shadow(0 6px 12px rgba(0,0,0,.42)) drop-shadow(0 0 8px rgba(247,215,116,.22));}
.health-day-avatar-crown{filter:drop-shadow(0 0 5px rgba(247,215,116,.18));}
.health-day-crown::before,.health-day-avatar-crown::before{content:'';display:block;width:100%;height:100%;background:currentColor;
  -webkit-mask:url('../assets/health-crown.svg') center/contain no-repeat;mask:url('../assets/health-crown.svg') center/contain no-repeat;}
.health-day-crown{position:fixed;left:var(--crown-start-x,50vw);top:var(--crown-start-y,50vh);z-index:1450;width:96px;height:96px;
  display:inline-flex;align-items:center;justify-content:center;transform-origin:center center;
  animation:healthDayCrown 3s cubic-bezier(.18,.85,.22,1) forwards;will-change:left,top,transform;}
.health-day-avatar-crown{position:absolute;left:50%;top:-18px;z-index:4;width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;
  transform:translateX(-50%);}
.health-day-avatar-crown-pending{visibility:hidden;}
@keyframes healthDayHead{
  0%{box-shadow:none;filter:none}
  10%,78%{box-shadow:inset 0 0 0 999px rgba(0,0,0,.24);filter:saturate(1.04)}
  100%{box-shadow:none;filter:none}
}
@keyframes healthDayTint{
  0%{opacity:0;clip-path:inset(0 100% 0 0)}
  12%{opacity:1}
  42%,68%{opacity:1;clip-path:inset(0 0 0 0)}
  100%{opacity:0;clip-path:inset(0 100% 0 0)}
}
@keyframes healthDayCrown{
  0%{opacity:0;left:var(--crown-start-x,50vw);top:var(--crown-start-y,50vh);transform:translate(-50%,-50%) scale(.25) rotate(-7deg)}
  16%{opacity:1;left:var(--crown-start-x,50vw);top:var(--crown-start-y,50vh);transform:translate(-50%,-50%) scale(1.06) rotate(0)}
  28%,62%{opacity:1;left:var(--crown-start-x,50vw);top:var(--crown-start-y,50vh);transform:translate(-50%,-50%) scale(1) rotate(0)}
  84%{filter:drop-shadow(0 0 5px rgba(247,215,116,.16))}
  100%{opacity:1;left:var(--crown-end-x,50vw);top:var(--crown-end-y,50vh);transform:translate(-50%,-50%) scale(.25) rotate(0);filter:drop-shadow(0 0 0 rgba(0,0,0,0)) drop-shadow(0 0 5px rgba(247,215,116,.16))}
}
body:not(.no-tooltips) .health-profile-drag[data-tip]:hover::after,
body:not(.no-tooltips) .health-ping-btn[data-tip]:hover::after,
body:not(.no-tooltips) .health-mini-badge[data-tip]:hover::after,
body:not(.no-tooltips) .health-setup-nav-btn[data-tip]:hover::after{
  content:attr(data-tip);position:absolute;bottom:calc(100% + 7px);left:50%;transform:translateX(-50%);
  background:#252525;border:1px solid rgba(255,255,255,.12);color:var(--t1);font-family:var(--font);
  font-size:11px;font-weight:500;padding:3px 7px;border-radius:5px;white-space:nowrap;pointer-events:none;
  z-index:2600;opacity:1;box-shadow:none;}

/* Fixed height (= head min-height) so the dropdown never grows the column header
   and pushes "My protocol" below the others in Setup (#16). */
.health-weekday-select{margin-left:auto;font-family:var(--font);font-size:12px;font-weight:500;color:var(--t1);
  background:var(--chip-bg);border:1px solid var(--chip-border);border-radius:8px;height:28px;box-sizing:border-box;
  padding:0 8px;cursor:pointer;}
.health-weekday-select:hover{border-color:var(--chip-hover-border);}

/* Cards hug their content — no fixed min-height that left dead space under the
   add-row in sparse columns (#13). */
.health-col-card{min-height:0;}
.health-profile-col>.health-col-head+.health-section .health-col-card,
.health-profile-col>.health-col-card,
.health-setup-col>.health-col-head+.health-section .health-col-card,
.health-setup-col>.health-col-card{border-top-left-radius:0;border-top-right-radius:0;box-shadow:0 10px 26px rgba(0,0,0,.14);}
.health-profile-col>.health-col-head+.health-section .health-list>.health-task:first-child,
.health-profile-col>.health-col-card .health-list>.health-task:first-child,
.health-setup-col>.health-col-head+.health-section .health-list>.health-task:first-child,
.health-setup-col>.health-col-card .health-list>.health-task:first-child{border-top-left-radius:0;border-top-right-radius:0;}
.health-col-empty{color:var(--t3);font-family:var(--font);font-size:13px;padding:16px 12px;text-align:center;}
.health-preset-hint{font-family:var(--font);font-size:11px;color:var(--t3);padding:7px 4px 0;line-height:1.4;}

/* Read-only columns (other users) still allow selection/right-click copy, but
   never expose the editable text cursor. */
.health-col-ro .health-col-card,.health-col-ro .health-task,
.health-col-ro .health-task .task-text,.health-col-ro .health-txt-row{cursor:default;}
.health-col-ro .task{user-select:none;}

/* ── Task row ───────────────────────────────────────────────────────────────
   stripe | text | (hover) status dots. Expands to show the inline editor. */
.health-list{position:relative;}
.health-task{position:relative;display:flex;align-items:flex-start;gap:0;padding:0 12px;
  border-bottom:1px solid var(--sep);}
.health-list>.health-task:first-child{border-top-left-radius:12px;border-top-right-radius:12px;}
.health-list>.health-task:last-child{border-bottom-left-radius:12px;border-bottom-right-radius:12px;}
.health-list>.health-task:last-child .health-status-line{border-bottom-left-radius:12px;}
.health-task:last-child{border-bottom:none;}
.health-task .task-body{flex:1;min-width:0;}
.health-txt-row{display:flex;align-items:center;min-height:38px;}
/* The title fills the line so the whole name area is a click/edit target. A
   collapsed task shows the pointer cursor (click to open, #6); an OPEN task is an
   editable text field with the I-beam across the line (#5). */
.health-task .task-text{line-height:1.4;padding:9px 0;flex:1 1 auto;min-width:0;}
.health-task.open .task-text,.health-task.open .health-txt-row{cursor:text;}
.health-status-line{position:absolute;left:0;top:0;bottom:0;width:3px;pointer-events:none;z-index:4;}
.health-list>.health-task:first-child .health-status-line{
  border-top-left-radius:0;clip-path:none;}
.health-extra-wrap .health-list>.health-task:first-child .health-status-line{
  clip-path:polygon(100% 4px,100% 100%,0 100%,0 12px);}

/* Status row tints (health 3-state) — all three get a visible overlay (#11);
   the 'missed' id is now "Skipped" and tinted orange to match its dot (#13). */
.health-task[data-status=done]{background:rgba(85,194,121,.12);}
.health-task[data-status=skipped]{background:rgba(224,179,65,.12);}
.health-task[data-status=missed]{background:rgba(239,101,52,.16);}
.health-task.selected{background:rgba(111,151,246,.16);box-shadow:inset 0 0 0 1px rgba(111,151,246,.4);}
.health-task.ctx-target{background:rgba(111,151,246,.18)!important;box-shadow:inset 0 0 0 1px rgba(111,151,246,.48)!important;}
.health-task.open{background:rgba(255,255,255,.025);}
/* Keep the status tint visible while the editor is open — the plain .open
   background was hiding it for Skipped/Partial, leaving only Done tinted (#8). */
.health-task.open[data-status=done]{background:rgba(85,194,121,.14);}
.health-task.open[data-status=skipped]{background:rgba(224,179,65,.14);}
.health-task.open[data-status=missed]{background:rgba(239,101,52,.18);}
.health-task.health-task-unique::after{
  content:'';position:absolute;right:0;top:0;width:0;height:0;z-index:6;pointer-events:none;
  border-top:10px solid color-mix(in srgb,#f7d774 78%,var(--acc));
  border-left:10px solid transparent;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.24));
}

.health-section-divider{align-items:center;gap:0;padding:5px 10px 5px 8px;min-height:34px;
  background:linear-gradient(90deg,rgba(127,164,255,.075),rgba(255,255,255,0))!important;}
.health-section-divider:hover{background:linear-gradient(90deg,rgba(127,164,255,.12),rgba(255,255,255,.025))!important;}
.health-section-divider-body{width:100%;display:grid;grid-template-columns:15px minmax(0,1fr) auto;
  align-items:center;column-gap:4px;min-width:0;}
.health-section-toggle{width:15px;height:18px;border:0;background:transparent;color:var(--t3);
  display:inline-flex;align-items:center;justify-content:center;padding:0;pointer-events:none;}
.health-section-toggle svg{width:14px;height:14px;}
.health-section-divider .health-section-title{padding:2px 2px;min-width:28px;max-width:100%;
  font-family:var(--font);font-size:11.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;
  color:color-mix(in srgb,var(--t2) 88%,#fff);line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.health-section-count{font-family:var(--font);font-size:10.5px;font-weight:700;color:var(--t3);white-space:nowrap;}
.health-section-divider.is-collapsed .health-section-count{color:color-mix(in srgb,var(--acc) 58%,var(--t3));}
.health-section-divider .health-status-line{display:none!important;}

/* Hover affordance: gradient fade + red/yellow/green dots, on the first line */
.health-quick{position:absolute;right:0;top:0;height:38px;display:flex;align-items:center;gap:10px;
  padding:0 12px 0 34px;opacity:0;pointer-events:none;transition:opacity .12s;
  background:linear-gradient(90deg,transparent,var(--card) 42%);}
.health-task:hover .health-quick,.health-task.open .health-quick{opacity:1;pointer-events:auto;}
.health-dot{position:relative;width:17px;height:17px;border-radius:50%;cursor:pointer;padding:0;
  border:1.6px solid var(--dot);background:transparent;transition:background .1s,transform .1s;}
.health-status-trigger{position:relative;display:none;border-radius:50%;cursor:pointer;padding:0;
  border:1.6px solid var(--dot);background:transparent;transition:background .1s,transform .1s;}
.health-dot:hover{transform:scale(1.18);background:color-mix(in srgb,var(--dot) 35%,transparent);}
.health-status-trigger:hover{transform:scale(1.12);background:color-mix(in srgb,var(--dot) 28%,transparent);}
.health-dot:focus-visible,.health-status-trigger:focus-visible{outline:2px solid var(--acc);outline-offset:2px;}
.health-dot.on{background:var(--dot);}
.health-status-trigger.on{background:var(--dot);}
.health-status-trigger.is-empty{border-color:rgba(255,255,255,.22);background:rgba(255,255,255,.025);}
.health-dot-pop{animation:healthDotPop .32s cubic-bezier(.2,.9,.25,1.25);}
.health-done-glow{animation:healthDoneGlow .82s ease;}
@keyframes healthDotPop{0%{transform:scale(1)}45%{transform:scale(1.45)}100%{transform:scale(1)}}
@keyframes healthDoneGlow{0%{box-shadow:inset 0 0 0 1px rgba(85,194,121,.08)}35%{box-shadow:inset 0 0 0 1px rgba(85,194,121,.55),0 0 18px rgba(85,194,121,.18)}100%{box-shadow:none}}
.health-confetti{position:fixed;width:1px;height:1px;z-index:1400;pointer-events:none;}
.health-confetti-piece{position:absolute;left:0;top:0;width:5px;height:8px;border-radius:2px;
  animation:healthConfetti .68s cubic-bezier(.18,.78,.25,1) forwards;}
@keyframes healthConfetti{
  0%{opacity:1;transform:translate(-50%,-50%) scale(.7) rotate(0deg)}
  100%{opacity:0;transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) scale(.4) rotate(190deg)}
}
/* App-style tooltip on the dots (#9) — there was no rule matching .health-dot,
   so data-tip did nothing. Respects the global no-tooltips setting. */
body:not(.no-tooltips) .health-dot[data-tip]:hover::after{content:attr(data-tip);
  position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);
  background:#252525;border:1px solid rgba(255,255,255,.12);color:var(--t1);font-family:var(--font);
  font-size:11px;font-weight:500;padding:3px 7px;border-radius:5px;white-space:nowrap;pointer-events:none;
  z-index:2600;opacity:1;box-shadow:none;}
/* While dragging, don't show hover dots on the task underneath (#14). */
body.health-dragging .health-task .health-quick{opacity:0!important;pointer-events:none;}
/* Force the grabbing cursor everywhere while dragging so it doesn't flip when the
   dragged task passes over another (#3/#4). */
body.health-dragging,body.health-dragging *{cursor:grabbing!important;}
/* Lift the hovered row so its dot tooltip paints ABOVE sibling rows/cards, and
   stop the card / first row from clipping it (#5). */
.health-task:hover{z-index:30;}
.health-col-card{overflow:visible;}
.health-list>.health-task:first-child{overflow:visible;}
/* A new task being titled (open + empty) shows no status dots — they used to
   flash for a frame (#7); they return once you type a title. */
.health-task.open:has(.task-text.task-text-empty) .health-quick{opacity:0;pointer-events:none;}

/* Inline editor (reuses .task-opts / .opt-field / .opt-a). Tighter than the Tasks
   page: less gap between the title, the divider, and the note (#17). */
.health-opts{margin-top:4px;padding-top:6px;padding-bottom:8px;}
.health-opts .opt-field-row{margin-top:4px;}
.health-task.open .health-txt-row{display:flex;align-items:center;min-height:38px;}
.health-task.open .task-text{padding:9px 0;}
/* Note auto-sizes to its content — no manual resize handle (#9). */
.health-opts .health-note{width:100%;box-sizing:border-box;min-height:38px;resize:none;overflow:hidden;margin:2px 0 8px;}
.opt-a-danger{color:var(--urgent)!important;}
.opt-a-danger:hover{background:rgba(228,58,58,.1)!important;border-color:rgba(228,58,58,.25)!important;}
/* Editor actions (#10): Clear bottom-left, red trash Delete bottom-right. */
.health-opts-acts{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.health-del-btn{display:inline-flex;align-items:center;justify-content:center;padding:6px;}
.health-del-btn svg{width:15px;height:15px;}

.health-add-row{display:block;}
.health-add-row .add-trig{min-width:0;}
.health-add-row .add-trig:hover{background:rgba(255,255,255,.045);color:var(--t1);}

.task-list.health-list.health-drop-active{box-shadow:inset 0 0 0 1.5px var(--acc);border-radius:12px;}
.health-task.health-drag-source{position:absolute;left:0;right:0;box-sizing:border-box;pointer-events:none;
  z-index:1!important;opacity:.38;background:rgba(255,255,255,.035);box-shadow:none;filter:saturate(.82);}
.health-task.health-drag-source .health-quick{display:none!important;}
.health-task.health-drag-placeholder{opacity:.38;background:rgba(255,255,255,.035);box-shadow:none;filter:saturate(.82);}
.health-task.health-drag-placeholder .health-quick{display:none!important;}
.health-task.health-drag-overlay{position:fixed;box-sizing:border-box;pointer-events:none;margin:0;z-index:1600!important;
  will-change:transform;backface-visibility:hidden;transform:translate3d(0,0,0);}
body.health-dragging .health-list>.health-task:not(.dragging){z-index:2;}
.health-task.dragging{background:#232323;box-shadow:0 4px 18px rgba(0,0,0,.45);z-index:60;border-radius:6px;
  cursor:grabbing;touch-action:none;will-change:transform;backface-visibility:hidden;}
.health-task.dragging.drag-copy{outline:1px solid color-mix(in srgb,var(--acc,#6f97f6) 42%,rgba(255,255,255,.12));
  box-shadow:0 8px 24px rgba(0,0,0,.48),0 0 0 1px rgba(111,151,246,.18);}
.health-task.dragging.health-dragging-multi,
.health-task.health-drag-overlay.health-dragging-multi{z-index:1601;}
.health-task.dragging.health-dragging-multi::before,
.health-task.dragging.health-dragging-multi::after,
.health-task.health-drag-overlay.health-dragging-multi::before,
.health-task.health-drag-overlay.health-dragging-multi::after{
  content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  border:1px solid rgba(127,164,255,.13);background:rgba(22,22,22,.82);z-index:-1;
}
.health-task.dragging.health-dragging-multi::before,
.health-task.health-drag-overlay.health-dragging-multi::before{transform:translate(4px,4px);opacity:.66;}
.health-task.dragging.health-dragging-multi::after,
.health-task.health-drag-overlay.health-dragging-multi::after{transform:translate(8px,8px);opacity:.4;}
.health-drag-badge{
  position:absolute;right:-8px;top:-8px;min-width:24px;height:24px;padding:0 7px;border-radius:999px;
  display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--acc) 86%,#fff);
  color:#eef4ff;border:1px solid rgba(255,255,255,.18);box-shadow:0 6px 18px rgba(0,0,0,.38);
  font-family:var(--font);font-size:11px;font-weight:800;letter-spacing:.02em;pointer-events:none;z-index:8;
}
.health-task.health-drag-peer{opacity:.34;background:rgba(127,164,255,.045);transform:scale(.985);transition:opacity .15s,transform .15s;}
.health-task.drag-armed{background:#252525;}
/* Folders: the small gutter created by child indentation is filled with the same
   subtle accent family as the divider header (membership is explicit). */
.health-folder-child{margin-left:8px;}
.health-folder-child::before{content:'';position:absolute;left:-8px;top:-1px;bottom:-1px;width:8px;z-index:3;
  background:color-mix(in srgb,var(--acc) 7.5%,var(--card));pointer-events:none;}
.health-task.dragging.health-folder-child,
.health-task.health-drag-overlay.health-folder-child{margin-left:0;}
.health-task.dragging.health-folder-child::before,
.health-task.health-drag-overlay.health-folder-child::before{display:none;}
/* Photoshop-style insertion line shown while dragging; JS offsets it right (left:8px)
   when the drop will NEST, so you see the level before releasing. */
.health-drop-line{position:absolute;left:0;right:6px;height:2px;margin-top:-1px;z-index:1702;pointer-events:none;
  background:var(--acc);border-radius:2px;box-shadow:0 0 0 1px rgba(127,164,255,.18),0 0 10px rgba(127,164,255,.28);}
.health-drop-line::before{content:'';position:absolute;left:-1px;top:-3px;width:8px;height:8px;border-radius:50%;background:var(--acc);
  box-shadow:0 0 0 2px rgba(127,164,255,.18),0 0 10px rgba(127,164,255,.32);}

@media(pointer:coarse){
  .health-task:not(.open){touch-action:pan-x pan-y;}
  .health-task.open{touch-action:pan-y;}
  .health-task.drag-armed,
  .health-task.dragging{touch-action:none;}
}

/* Setup Manual: a shared floating library that can be copied into Tasks or any
   weekday protocol without removing the source entry. */
.health-manual-dock{position:fixed;bottom:24px;z-index:980;display:flex;flex-direction:column-reverse;gap:12px;
  align-items:flex-end;pointer-events:none;transition:transform .32s cubic-bezier(.22,.9,.25,1);}
.health-manual-dock.is-right{right:24px;}
.health-manual-dock.is-left{left:calc(var(--side-w,0px) + var(--safe-l,0px) + 24px);align-items:flex-start;}
.health-manual-dock.is-dragging{transition:none;}
.health-manual-bubble{pointer-events:auto;position:relative;width:54px;height:54px;border:1px solid rgba(127,164,255,.42);
  border-radius:50%;background:linear-gradient(145deg,#4678ec,#234da9);color:#fff;display:flex;align-items:center;justify-content:center;
  padding:0;cursor:pointer;box-shadow:0 14px 30px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.16);
  transition:transform .2s cubic-bezier(.22,.9,.25,1),border-color .14s,box-shadow .14s;}
.health-manual-bubble:hover{transform:none;border-color:rgba(169,194,255,.62);box-shadow:0 16px 34px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.18);}
.health-manual-bubble.is-dragging,.health-manual-bubble.is-pickup{transition:none;cursor:grabbing;transform:none;}
.health-manual-bubble span{position:absolute;display:flex;align-items:center;justify-content:center;transition:opacity .2s ease,transform .28s cubic-bezier(.22,.9,.25,1);}
.health-manual-bubble-book svg,.health-manual-bubble-close svg{width:23px;height:23px;}
.health-manual-bubble-close{opacity:0;transform:scale(.72) rotate(38deg);}
.health-manual-dock.is-open .health-manual-bubble-book{opacity:0;transform:scale(.72) rotate(-38deg);}
.health-manual-dock.is-open .health-manual-bubble-close{opacity:1;transform:scale(1) rotate(0);}
.health-manual-panel{pointer-events:auto;width:min(360px,calc(100vw - 42px));max-height:min(620px,70vh);
  display:flex;flex-direction:column;overflow:visible;border-radius:10px;background:var(--card);
  animation:healthManualPanelIn .22s cubic-bezier(.22,.9,.25,1) both;}
.health-manual-dock.is-right .health-manual-panel{transform-origin:bottom right;}
.health-manual-dock.is-left .health-manual-panel{transform-origin:bottom left;}
@keyframes healthManualPanelIn{from{opacity:0;transform:translateY(10px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes healthManualPanelOut{from{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(8px) scale(.97)}}
.health-manual-panel.is-closing{pointer-events:none;animation:healthManualPanelOut .18s cubic-bezier(.3,0,.35,1) forwards;}
.health-manual-panel-refresh{animation:none;}
.health-manual-panel-head{height:36px;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;
  padding:0 10px;border:1px solid var(--sep);border-bottom-color:rgba(255,255,255,.08);
  border-radius:10px 10px 0 0;background:var(--card);}
.health-manual-panel-title{display:flex;align-items:center;gap:8px;min-width:0;font-family:var(--font);font-size:12px;
  font-weight:850;letter-spacing:.055em;text-transform:uppercase;color:color-mix(in srgb,var(--t2) 88%,#fff);}
.health-manual-panel-ico{display:inline-flex;color:#7fa4ff;}
.health-manual-panel-ico svg{width:16px;height:16px;}
.health-manual-shared{font-size:10px;font-weight:800;letter-spacing:.04em;color:#7fa4ff;background:rgba(127,164,255,.12);
  border:1px solid rgba(127,164,255,.18);border-radius:6px;padding:2px 6px;}
.health-manual-card{overflow:hidden;max-height:calc(min(620px,70vh) - 36px);display:flex;flex-direction:column;
  border-top-left-radius:0!important;border-top-right-radius:0!important;}
.health-manual-card .health-list{overflow:auto;max-height:calc(min(620px,70vh) - 94px);}
.health-manual-row-actions{gap:6px;padding-left:30px;}
.health-manual-action{position:relative;width:27px;height:27px;border-radius:8px;border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.045);display:inline-flex;align-items:center;justify-content:center;padding:0;
  cursor:pointer;color:var(--t2);transition:background .12s,border-color .12s,color .12s;}
.health-manual-action svg{width:14px;height:14px;}
.health-manual-action:hover{background:rgba(255,255,255,.075);color:var(--t1);}
.health-manual-action-tasks{color:#9bb7ff;border-color:rgba(127,164,255,.2);}
.health-manual-action-tasks:hover{background:rgba(127,164,255,.14);border-color:rgba(127,164,255,.36);color:#dbe5ff;}
.health-manual-action-protocol{color:#ead06d;border-color:rgba(224,179,65,.22);}
.health-manual-action-protocol:hover{background:rgba(224,179,65,.14);border-color:rgba(224,179,65,.38);color:#fff0a8;}
.health-manual-week-pop{position:fixed;z-index:1300;display:flex;gap:5px;padding:7px;border:1px solid rgba(255,255,255,.12);
  border-radius:9px;background:#252525;box-shadow:0 12px 28px rgba(0,0,0,.32);animation:healthManualPanelIn .16s cubic-bezier(.22,.9,.25,1) both;}
.health-manual-week-btn{min-width:42px;height:30px;border:1px solid rgba(255,255,255,.1);border-radius:7px;background:rgba(255,255,255,.045);
  color:var(--t1);font-family:var(--font);font-size:11px;font-weight:750;cursor:pointer;transition:background .12s,border-color .12s,color .12s;}
.health-manual-week-btn:hover{background:rgba(127,164,255,.15);border-color:rgba(127,164,255,.38);color:#dfe8ff;}
body:not(.no-tooltips) .health-manual-bubble[data-tip]:hover::after{
  content:attr(data-tip);position:absolute;bottom:calc(100% + 7px);left:50%;transform:translateX(-50%);
  background:#252525;border:1px solid rgba(255,255,255,.12);color:var(--t1);font-family:var(--font);
  font-size:11px;font-weight:500;padding:3px 7px;border-radius:5px;white-space:nowrap;pointer-events:none;
  z-index:2600;opacity:1;box-shadow:none;}
.health-manual-dock.is-open .health-manual-bubble[data-tip]:hover::after{display:none;}
.health-floating-tip{position:fixed;transform:translate(-50%,-100%);background:#252525;border:1px solid rgba(255,255,255,.12);
  color:var(--t1);font-family:var(--font);font-size:11px;font-weight:500;padding:3px 7px;border-radius:5px;
  white-space:nowrap;pointer-events:none;z-index:2600;box-shadow:none;}
#ctx-menu{z-index:1300;}

body.health-momentum-visible .undo-toast{bottom:calc(98px + var(--safe-b));}
body.health-manual-side-left .undo-toast{left:auto;right:22px;}
body.health-manual-side-right .undo-toast{right:auto;left:calc(var(--side-w) + 22px + var(--safe-l));}

.health-editable{outline:none;}
.health-editable[contenteditable="true"]{caret-color:var(--acc);}

.health-admin-av{width:18px;height:18px;border-radius:50%;vertical-align:-4px;margin-right:7px;}

/* ── Protocols v3: stacked sections (main protocol + planned-extras) ──────── */
.health-section{display:flex;flex-direction:column;}
/* Planned-extras holding area, beneath the main protocol */
.health-extra-wrap{margin-top:14px;}
.health-plan-wrap{margin-top:10px;}
.health-extra-label{font-family:var(--font);font-size:10.5px;font-weight:700;letter-spacing:.04em;
  text-transform:uppercase;color:var(--t3);padding:0 2px 6px;}
.health-extra-wrap .health-col-card{min-height:0;}

/* Future days: read-only live preset preview (no completion, never locks early) */
.health-col-preview{opacity:.82;}
.health-col-preview .task,.health-col-preview .task-text{cursor:default;}
.health-col-preview .health-status-line{display:none;}

/* Past days: status-only backfill — completion toggles, but the text isn't an
   editable field. */
.health-card-status .task-text{cursor:default;}

/* "View only" tag on another participant's (read-only) column */
.health-col-view-tag{font-family:var(--font);font-size:10px;font-weight:700;letter-spacing:.04em;
  text-transform:uppercase;color:var(--t3);background:var(--rh);padding:2px 6px;border-radius:6px;flex:0 0 auto;}

/* "Today" button in the rail — themed like the nav chips, accent text (#2). */
.health-jump-today{align-self:stretch;min-height:42px;padding:0 14px;border-radius:10px;cursor:pointer;
  background:var(--sidebar-control-bg);border:1px solid var(--sidebar-control-border);color:var(--acc);
  font-family:var(--font);font-size:12px;font-weight:700;transition:background .14s,border-color .14s;}
.health-jump-today:hover{background:var(--sidebar-hover-bg);border-color:var(--sidebar-active-bg);}
.health-jump-today:disabled{cursor:default;color:var(--t3);opacity:.72;}
.health-jump-today:disabled:hover{background:var(--sidebar-control-bg);border-color:var(--sidebar-control-border);}

/* Chrome text isn't selectable/highlightable (#16) — names, tags, hints, labels,
   the date, the timer, empty/placeholder messages. Task titles stay selectable. */
.health-col-title,.health-col-you-tag,.health-col-view-tag,.health-col-badge,.health-col-ico,
.health-col-empty,.health-preset-hint,.health-extra-label,.health-day-label,.health-jump-today,
.health-profile-main,.health-profile-side,.health-momentum,.health-mini-badge,.health-profile-drag,
.health-day-arrow,.health-freeze-timer,.health-freeze-label,.health-freeze-time,
.health-setup-head,.health-setup-title,.health-setup-nav,.health-manual-dock,.health-manual-week-pop{
  user-select:none;-webkit-user-select:none;}

/* Per-viewer column reordering (Protocols tab): drag a column header to change
   how YOU see participants. Saved to your own settings — never affects others. */
.health-profile-col>.health-col-head{cursor:default;}
.health-profile-col.health-col-dragging{opacity:.96;z-index:30;will-change:transform;
  filter:drop-shadow(0 14px 28px rgba(0,0,0,.38));}
.health-profile-col.health-col-dragging .health-profile-drag{cursor:grabbing;}

/* Cold-load error + retry card (reuses .health-empty layout) */
.health-err-msg{font-family:var(--font);font-size:13.5px;color:var(--t2);}
.health-retry{font-family:var(--font);font-size:13px;font-weight:600;color:var(--t1);
  background:var(--chip-bg);border:1px solid var(--chip-border);border-radius:9px;padding:7px 16px;
  cursor:pointer;margin-top:4px;transition:background .14s,border-color .14s;}
.health-retry:hover{background:var(--chip-hover-bg);border-color:var(--chip-hover-border);}

/* Tasks tab is a single personal column now (private), centered and narrow. */
.health-cols.health-tasks-solo{grid-template-columns:minmax(0,560px);justify-content:center;}

@media (max-width:960px){
  .health-cols.health-tasks-solo{grid-template-columns:1fr;}
  .health-cols,.health-setup-cols{grid-template-columns:1fr;}
  .health-cols.health-mobile-carousel{
    --health-carousel-peek:28px;
    display:flex;
    flex-wrap:nowrap;
    gap:10px;
    align-items:start;
    width:calc(100% + 48px);
    margin-inline:-24px;
    padding:0 calc(var(--health-carousel-peek) / 2) 10px;
    overflow-x:auto;
    overflow-y:visible;
    scroll-snap-type:x mandatory;
    scroll-padding-inline:calc(var(--health-carousel-peek) / 2);
    overscroll-behavior-x:contain;
    scrollbar-width:none;
    -ms-overflow-style:none;
    -webkit-overflow-scrolling:touch;
  }
  .health-cols.health-mobile-carousel::-webkit-scrollbar{display:none;}
  .health-cols.health-mobile-carousel>.health-profile-col{
    flex:0 0 calc(100% - var(--health-carousel-peek));
    width:auto;
    min-width:0;
    scroll-snap-align:center;
  }
  body.health-dragging .health-cols.health-mobile-carousel{overflow-x:hidden;scroll-snap-type:none;}
  .health-week-grid{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(260px,86vw);
    overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 2px;padding:0 2px 10px;margin:0 -2px;}
  .health-weekday-col{scroll-snap-align:start;}
  /* Mobile keeps one calm status affordance visible; tapping it opens the row's
     three choices in place. */
  .health-task .task-body{padding-right:48px;box-sizing:border-box;}
  .health-task.open .task-body{padding-right:0;}
  .health-task.open .health-txt-row{padding-right:48px;box-sizing:border-box;}
  .health-task.health-status-picker-open:not(.open) .task-body{padding-right:116px;}
  .health-task.open.health-status-picker-open .health-txt-row{padding-right:116px;}
  .health-quick.health-status-compact{
    opacity:1;pointer-events:auto;right:0;top:0;width:40px;height:38px;
    justify-content:center;gap:0;padding:0;box-sizing:border-box;
    background:transparent;border-radius:0;overflow:visible;
  }
  .health-status-trigger{display:inline-flex;}
  .health-status-compact .health-status-choice{display:none;}
  .health-task.health-status-picker-open .health-status-compact .health-status-trigger{display:none;}
  .health-task.health-status-picker-open .health-status-compact .health-status-choice{display:inline-flex;}
  .health-task.health-status-picker-open .health-status-compact{
    width:114px;gap:0;padding:0;
    background:transparent;
  }
  .health-dot,.health-status-trigger{
    width:38px;height:38px;border:0;background:transparent!important;
    display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;
    touch-action:manipulation;-webkit-tap-highlight-color:transparent;overflow:visible;isolation:isolate;
  }
  .health-dot::after,.health-status-trigger::after{
    content:'';position:absolute;left:50%;top:50%;width:30px;height:30px;border-radius:50%;
    transform:translate(-50%,-50%);background:transparent;filter:blur(5px);opacity:0;
    pointer-events:none;z-index:0;
  }
  .health-dot::before,.health-status-trigger::before{
    content:'';position:relative;z-index:1;width:22px;height:22px;border-radius:50%;box-sizing:border-box;
    border:2px solid var(--dot);background:transparent;
    box-shadow:0 0 0 1px rgba(255,255,255,.025);
  }
  .health-dot.on::after,.health-status-trigger.on::after{
    background:color-mix(in srgb,var(--dot) 55%,transparent);opacity:.28;
  }
  .health-dot.on::before,.health-status-trigger.on::before{
    background:var(--dot);
    box-shadow:inset 0 -1px 0 rgba(0,0,0,.14),0 0 0 1px color-mix(in srgb,var(--dot) 16%,transparent);
  }
  .health-status-trigger.is-empty::before{
    border-color:rgba(255,255,255,.22);background:rgba(255,255,255,.025);
    box-shadow:0 0 0 1px rgba(255,255,255,.018);
  }
  .health-dot:hover,.health-status-trigger:hover{transform:none;background:transparent!important;}
  .health-manual-dock{bottom:18px;}
  .health-manual-dock.is-right{right:18px;}
  .health-manual-dock.is-left{left:18px;}
  .health-manual-panel{width:min(340px,calc(100vw - 36px));max-height:min(560px,68vh);}
  .health-manual-card{max-height:calc(min(560px,68vh) - 36px);}
  .health-manual-card .health-list{max-height:calc(min(560px,68vh) - 94px);}
  /* Columns stack to one per row on mobile — no horizontal reorder. */
  .health-profile-drag{display:none;}
}

/* ── PHONE ≤540px ─────────────────────────────────────────────────────────────
   The date control moves into the mobile app bar, leaving this rail as a single
   compact Protocols / Missions / Setup row. The freeze countdown is dropped to
   reclaim space. */
@media (max-width:540px){
  #top-bar[data-page=health]::before,
  #top-bar[data-page=health]::after{display:none;}
  #top-bar[data-page=health] .top-sub{border-bottom:0;}
  #top-bar[data-page=health]{height:var(--top-h);}
  #top-bar[data-page=health] .health-sub{
    top:0;height:var(--top-h);min-height:var(--top-h);align-items:center;
  }
  #top-bar[data-page=health] .tasks-top-tools{
    height:var(--top-h);min-height:var(--top-h);padding:6px 12px 0;
  }
  #top-bar[data-page=health] .tasks-rail-wrap{
    height:100%;min-height:0;align-items:center;padding:0 4px;
  }
  #health-rail{height:100%;padding:0 2px;flex-wrap:nowrap;align-items:center;}
  #health-rail .tasks-rail-main{order:1;flex:1 1 auto;min-width:0;justify-content:center;
    overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;}
  #health-rail .tasks-rail-main::-webkit-scrollbar{display:none;}
  #health-rail .health-rail-left,
  #health-rail .tasks-rail-side{display:none;}
  .health-freeze-timer{display:none;}
  .tasks-rail-mail{display:none;}
  .health-day-stepper{flex:1 1 auto;min-width:0;gap:8px;}
  .health-day-pill{flex:1 1 auto;min-width:0;}
  .health-day-label{width:auto;flex:1 1 auto;min-width:0;}
  /* Clear the single Health tab rail; the date lives in the mobile app bar. */
  #page-health{padding-top:calc(var(--m-topbar-h) + var(--safe-t) + var(--top-h) - 2px);}
  .health-body{padding:4px 10px 96px;}
  .health-panel-mobile-switch{display:inline-flex;}
  .health-panel-form{grid-template-columns:1fr;}
  .health-panel-form .hosted-primary-inline{width:100%;}
  .health-cols.health-mobile-carousel{
    width:calc(100% + 20px);
    margin-inline:-10px;
  }
  .health-momentum{padding:11px 14px 12px;}
  .health-momentum-state{flex-basis:auto;min-width:0;}
  .health-opts{padding-top:4px;padding-bottom:6px;}
  .health-opts .opt-field-row{margin-top:2px;}
  .health-opts-acts{gap:8px;}
  .health-opts .opt-a{min-height:28px;padding:5px 10px;border-radius:7px;font-size:12px;}
  .health-del-btn{width:36px;min-width:36px;padding:5px;}
  .health-del-btn svg{width:15px;height:15px;}
}
