/* Caregiver Today + menu refresh, Layout A (approved by the CEO Oct 29, 2026; design/caregiver-today-refresh-brief.md).
   The deep teal block (#0F3A36, radius 18) is the only colored block on Today; everything under it is plain rows on white.
   Same look as the office Dashboard refresh (office.css, "Dashboard refresh"). */
body.skin .cgn { --deep: #0F3A36; --mint: #7ED9AE; --mint-ink: #0B2C29; --mint-label: #8FD9B6; --coral: #C9452F; max-width: 1200px; }

/* ---------- 1. the deep block ---------- */
body.skin .cgd { position: relative; overflow: hidden; background: var(--deep); color: #fff; border-radius: 18px; padding: 22px 20px 20px; margin: 0 0 30px; }
body.skin .cgd::after { content: ""; position: absolute; right: -70px; top: -90px; width: 240px; height: 240px; border-radius: 50%; border: 38px solid rgba(126, 217, 174, .07); pointer-events: none; }
body.skin .cgd > * { position: relative; z-index: 1; }
body.skin .cgd-top { display: flex; flex-direction: column; gap: 0; }
body.skin .cgd-tx { min-width: 0; flex: 1; }
body.skin .cgd-lab { margin: 0; font: 700 11.5px/1.3 var(--f-ui); letter-spacing: .1em; text-transform: uppercase; color: var(--mint-label); }
body.skin .cgd-t { margin: 6px 0 8px; font-family: var(--f-display); font-weight: 500; font-size: 32px; line-height: 1.08; letter-spacing: -.01em; color: #fff; text-wrap: balance; overflow-wrap: anywhere; }
body.skin .cgd-line { display: flex; align-items: center; gap: 9px; margin: 0; font-size: 15px; color: rgba(255, 255, 255, .78); }
body.skin .cgd-dot { width: 9px; height: 9px; border-radius: 50%; flex: none; position: relative; background: rgba(255, 255, 255, .5); }
body.skin .cgd-dot.live { background: var(--mint); }
body.skin .cgd-dot.bad { background: #FF9A84; }
body.skin .cgd-dot.pulse::after { content: ""; position: absolute; inset: -5px; border-radius: 50%; border: 2px solid var(--mint); opacity: .5; animation: cgd-pulse 2s ease-out infinite; }
@keyframes cgd-pulse { from { transform: scale(.6); opacity: .7; } to { transform: scale(1.5); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { body.skin .cgd-dot.pulse::after { animation: none; } }
body.skin .cgd-sub { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 14px 0 0; padding-top: 12px; border-top: 1px solid rgba(255, 255, 255, .12); font-size: 13.5px; color: rgba(255, 255, 255, .66); }
body.skin .cgd-sub b { color: #fff; font-weight: 600; }
body.skin .cgd-sub .link, body.skin .cgd-links .link { color: var(--mint); font-weight: 600; background: none; border: 0; padding: 0; font-size: 13.5px; cursor: pointer; }
body.skin .cgd-btns { display: flex; gap: 10px; margin-top: 18px; }
body.skin .cgd-b { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 44px; padding: 0 18px; border-radius: 10px; border: 1px solid rgba(255, 255, 255, .28); background: rgba(255, 255, 255, .1); color: #fff; font: 700 15px/1 var(--f-ui); white-space: nowrap; cursor: pointer; text-decoration: none; }
body.skin .cgd-b:hover { background: rgba(255, 255, 255, .16); text-decoration: none; }
body.skin .cgd-b.pri { background: var(--mint); border-color: var(--mint); color: var(--mint-ink); }
body.skin .cgd-b.pri:hover { background: #95E2BD; }
body.skin .cgd-b[aria-disabled="true"], body.skin .cgd-b:disabled { opacity: .55; cursor: default; }
body.skin .cgd-b:focus-visible, body.skin .cgd .link:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
body.skin .cgd .done-line, body.skin .cgd .cgd-done { margin: 14px 0 0; color: var(--mint); font-weight: 600; }
body.skin .cgd .done-line > .i { color: var(--mint); }
body.skin .cgd .done-line + .done-line { margin-top: 6px; }
body.skin .cgd-links { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 18px; margin: 14px 0 0; font-size: 13.5px; color: rgba(255, 255, 255, .72); }
body.skin .cgd .cm-line { margin: 10px 0 0; font-size: 13.5px; color: rgba(255, 255, 255, .72); }
body.skin .cgd .cm-line .link { color: rgba(255, 255, 255, .8); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; font-size: 13.5px; background: none; border: 0; padding: 0; cursor: pointer; }
body.skin .cgd .cm-line .ok-chip { display: inline-flex; align-items: center; gap: 6px; color: var(--mint); font-weight: 600; margin-right: 6px; }
body.skin .cgd .cm-line .ok-chip .i { width: 14px; height: 14px; }
body.skin .cgd .sh-with span { color: rgba(255, 255, 255, .78); }
body.skin .cgn-route { margin: -14px 0 30px; }

/* ---------- the plain part ---------- */
body.skin .cgn-cols { display: block; }
body.skin .cgn-main, body.skin .cgn-side { min-width: 0; }
body.skin .cgn .cgn-sec { margin: 0 0 30px; }
body.skin .cgn .cgt-sh { margin: 0 0 4px; gap: 8px; }
body.skin .cgn .cgt-sh h2 { font-size: 19px; }
body.skin .cgn .cgt-sh .cnt { font-weight: 700; color: var(--ink-3); }
body.skin .cgn .cgt-sh .cnt.bad { color: var(--coral); }
body.skin .cgn .cgt-sh .r .link { font-weight: 700; color: var(--deep); }
body.skin .cgn .cgt-row { min-height: 60px; }
body.skin .cgn .cgt-rows > .cgt-row:last-child { border-bottom: 0; }
body.skin .cgn .cgt-u.bad { background: var(--coral); }
body.skin .cgn .cgt-u.g { background: var(--line-2, #D5D2CB); }
body.skin .cgn .cgt-u.ok { background: #1B7A4E; }
body.skin .cgu-k { display: block; margin-bottom: 1px; font: 700 11px/1.3 var(--f-ui); letter-spacing: .07em; text-transform: uppercase; color: var(--coral); }
body.skin .cgu-k.warn { color: #8A5A00; }
body.skin .cgu-k.ok { color: var(--ink-3); }
body.skin .cgn .cgu-row .t small { white-space: normal; }
body.skin .cgn .cgt-row .t small.cgu-said { display: flex; align-items: center; gap: 6px; color: #1B7A4E; font-weight: 600; }
body.skin .cgu-said .i { width: 14px; height: 14px; flex: none; }
body.skin .cgu-row .eg-ans { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
body.skin .cgu-calm { display: flex; align-items: center; gap: 10px; margin: 0; padding: 14px 0; color: #1B7A4E; font-weight: 600; }
body.skin .cgu-calm .i { width: 18px; height: 18px; }
body.skin .cgn-tm { width: 58px; flex: none; font-size: 13.5px; font-weight: 700; color: var(--ink-2, #4A5553); line-height: 1.25; }
body.skin .cgn-tm small { display: block; font-weight: 500; color: var(--ink-3); }
body.skin .cgn-st { font-size: 13px; font-weight: 700; color: var(--ink-2, #4A5553); white-space: nowrap; }
body.skin .cgn-st.live { color: #1B7A4E; } body.skin .cgn-st.bad { color: var(--coral); } body.skin .cgn-st.done { color: var(--ink-3); font-weight: 600; }
body.skin .cgn-bar { display: flex; gap: 4px; margin: 10px 0 2px; }
body.skin .cgn-bar i { flex: 1; height: 6px; border-radius: 3px; background: var(--well, #F2F1ED); }
body.skin .cgn-bar i.on { background: var(--deep); }
body.skin .cgn-month .fine { margin: 6px 0 4px; }
@media (max-width: 899px) {
  body.skin .cgn .cgu-row { align-items: flex-start; }
  body.skin .cgn .cgu-row > .cgt-u { margin-top: 6px; }
  body.skin .cgn .cgu-row .e { padding-top: 14px; }
}
@media (max-width: 380px) { body.skin .cgd-t { font-size: 28px; } body.skin .cgd-b { padding: 0 12px; } }

@media (min-width: 1024px) {
  body.skin .cgd { padding: 28px 32px; margin-bottom: 36px; }
  body.skin .cgd-top { flex-direction: row; align-items: flex-start; gap: 24px; }
  body.skin .cgd-t { font-size: 38px; }
  body.skin .cgd-btns { margin-top: 4px; flex: none; }
  body.skin .cgd-b { flex: none; }
  body.skin .cgn-cols { display: grid; grid-template-columns: minmax(0, 1fr) 380px; column-gap: 56px; align-items: start; }
  body.skin .cgn .cgn-sec { margin-bottom: 36px; }
}

/* ---------- the menu: More sheet and the desktop rail ---------- */
.cgm .cgm-who { display: flex; align-items: center; gap: 12px; padding: 8px 4px 16px; border-bottom: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.cgm .cgm-who:hover { text-decoration: none; }
.cgm .cgm-who .av { width: 44px; height: 44px; font-size: 15px; }
.cgm .cgm-who .t { flex: 1; min-width: 0; }
.cgm .cgm-who b { display: block; font-size: 17px; font-weight: 700; }
.cgm .cgm-who small { display: block; color: var(--ink-3); font-size: 13.5px; }
.cgm .cgm-who .chev, .cgm .cgm-who .i { width: 16px; height: 16px; color: var(--line-2, #D5D2CB); flex: none; }
body.skin .ams-more.cgm .rail-h { margin: 18px 0 2px; }
.cgm .nv > span:not(.nv-i):not(.cgm-x) { flex: 1; min-width: 0; }
.cgm-x { margin-left: auto; padding-left: 8px; font-size: 13px; font-weight: 600; color: var(--ink-3); white-space: nowrap; }
.cgm-x.bad { color: #C9452F; }
.cgm-foot { border-top: 1px solid var(--line); margin-top: 16px; padding-top: 6px; }
.cgm .cgm-out, .cgm .cgm-out .nv-i, .cgm .cgm-out span { color: #C9452F; }
@media (min-width: 900px) {
  body.skin:not(.is-admin) .rail .cgm-grp { gap: 2px; }
  body.skin:not(.is-admin) .rail .cgm-grp .rail-h { padding: 22px 10px 6px; margin: 0; }
  body.skin:not(.is-admin) .rail .nv[aria-current="page"] { background: #0F3A36; color: #fff; }
  body.skin:not(.is-admin) .rail .nv[aria-current="page"] .nv-i, body.skin:not(.is-admin) .rail .nv[aria-current="page"] span { color: #fff; }
  body.skin:not(.is-admin) .rail .nv[aria-current="page"] .nv-badge { background: #fff; color: #0F3A36; }
}
/* review pass: Urgent rows keep the dot by the kind label; the More sheet's icons are plain, as in the prototype */
body.skin .cgn .cgu-row { align-items: flex-start; }
body.skin .cgn .cgu-row > .cgt-u { margin-top: 6px; }
body.skin .cgn .cgu-row > .e { align-self: center; padding-top: 0; }
.cgm .nv .nv-i, body.skin .ams-more.cgm .nv .nv-i { width: 24px; height: 24px; background: none; color: var(--ink-3); border-radius: 0; }
.cgm .nv { min-height: 50px; }