/* Daily Life Doc, round 6: the rows of Today (js/today/parts-view.js, parts-rows.js, parts-extra.js, team-lines.js),
   compact, as the agreed page draws them (docs/artifact/next/next.txt, "Today"). Round 12 (zone X): the new Today's
   blocks mount these rows (js/home/home-rows.js); the old Today's week row, its hosts and its sheet's own box went.
   The experiment's sheet: Measure, Actions (round 8: two parts) and the quiet lines. Tokens, the
   place colour (--pc-bg, --pc, --pc-d) and the shared type scale only. No :hover rule here: nothing on Today may
   move or change under a mouse. Also here: the small quiet word `.qw` and the Update sheet's box (js/today/update.js). */

/* Round 3, no waiting screens. `.qw` is the small quiet word that sits where the AI's result will appear
   ("Sorting…", "Reading…", "Writing…": DD.later.word, js/core/later.js), the same on every page; it breathes with
   the shared `.m-wait`. `.td-sub` is the one line under Today's title: the count of answers, then the quiet word. */
.qw { font-size: var(--t-sm); font-weight: 500; color: var(--ink3); white-space: nowrap; }

/* ---------- The experiment's sheet (js/today/parts-view.js) ----------
   Round 12 (fixer CL): the sheet's head (the experiment's line, the reason, "Day 4 · v4", the sentence about
   yesterday) went with js/today/parts-head.js; each block of the new Today draws its own head. `tp-bare` still marks
   a sheet with no experiment (js/today/parts-rows.js). */

/* The two parts. A line is a circle, the words and the value:
     open       an empty ring; the value is a grey hint word ("Yes No", "hours", "mood") in the normal weight
     answered   the ring is green with a tick; the words step back to the second ink and the value is ink, semibold
   Nothing is underlined and nothing is boxed. Every line is at least 44 px tall, so a finger finds the line. */
.tp-part { margin-top: 14px; }
.tp-bare .tp-part:first-child { margin-top: 0; }
.tp-h { margin: 0; font-size: var(--t-sm); font-weight: 600; line-height: 24px; letter-spacing: .02em; color: var(--ink2); }
.tp-rows { display: flex; flex-direction: column; }
/* Round 8: Actions holds two blocks under its one heading: the actions the experiment asks for, then everything else
   that is noted (the things of `sections.tracking`, then the things said for that day only). Nothing stands between
   the two: no gap, no second heading, no rule, no box (the first walk of round 8 read the gap of 10 px with no
   heading as uneven spacing). A block with no row takes no room. */
.tp-rows:empty { display: none; }
.tp-row { gap: 12px; min-height: 44px; padding: 8px 0; border-radius: 10px; transition: background-color 420ms ease, box-shadow 420ms ease; }
/* Several changed rows one after another are one soft block, not a pile of pills (as in Atlas, css/atlas.css). */
.tp-row.tinted:has(+ .tp-row.tinted) { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
.tp-row.tinted + .tp-row.tinted { border-top-left-radius: 0; border-top-right-radius: 0; }
.tp-row.can { cursor: pointer; -webkit-tap-highlight-color: transparent; }
.tp-o { flex: none; width: 22px; height: 22px; margin-top: 3px; border-radius: 50%; display: grid; place-items: center; color: transparent;
  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--ink3) 62%, var(--surface)); transition: background-color var(--m-step) ease, box-shadow var(--m-step) ease, color var(--m-step) ease, transform var(--m-add) var(--ease-spring); }
.tp-o svg { width: 13px; height: 13px; }
.tp-row.is-done .tp-o { background: var(--done); box-shadow: none; color: #fff; }
/* A line with words only (nothing to answer): a small dot, so the line never reads as open. */
/* Round 12, DF1 (DESIGN-1 finding 12): a No is answered, but not the green tick of a Yes: a grey circle with a dash. */
.tp-row.is-done.is-no .tp-o { background: color-mix(in srgb, var(--ink3) 30%, var(--soft)); color: transparent; }
.tp-row.is-no .tp-o svg { display: none; }
.tp-row.is-no .tp-o::before { content: ''; width: 10px; height: 2.5px; border-radius: 2px; background: var(--ink2); }
.tp-row.is-plain .tp-o { box-shadow: none; }
.tp-row.is-plain .tp-o::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--ink3); }
.tp-row.is-plain .tp-o svg { display: none; }
.tp-row .ln-t { transition: color var(--m-step) ease; }
.tp-row.is-done .ln-t { color: var(--ink2); }
.tp-row .cc { margin-left: 6px; }
.tp-row .cc-sp { word-spacing: 6px; }
.tp-row .cc-sp + .cc { margin-left: 0; }
.tp-row .cc .x { color: var(--ink3); font-weight: 400; }
.tp-row .cc .v { color: var(--ink); font-weight: 600; }

/* What a line shows besides its words and its value (js/today/parts-extra.js). */
/* The word New, on a line the other side or the app wrote since this account last saw Today: the last thing of the
   line, after a space, so a full line moves only this small word down and never the value. */
.tp-new { margin-left: 2px; font-size: var(--t-2xs); font-weight: 400; color: var(--ink3); white-space: nowrap; } /* F4 (WALK-3 fault 11): plain and quiet, never read as a third choice */
/* The last value and the word New in one piece that never breaks (a browser may break right after a button). */
.tp-tie { white-space: nowrap; }
.tp-row .cc-sp + .tp-tie > .cc { margin-left: 0; }
/* A line tracked for one day only (round 7): the grey word "today" after its value says that the line does not
   come back tomorrow. "Every day": plain quiet words under such a line whose words stood on an earlier day; a tap
   makes the line a line of the experiment. No box, no underline. */
.tp-day { font-size: var(--t-sm); font-weight: 400; color: var(--ink3); white-space: nowrap; }
.tp-keep { position: relative; display: block; height: 24px; padding: 0; font-size: var(--t-xs); line-height: 24px; font-weight: 600; color: var(--pc-d); text-align: left; white-space: nowrap; cursor: pointer; -webkit-tap-highlight-color: transparent; animation: dd-fade 240ms ease both; }
.tp-keep::after { content: ''; position: absolute; inset: -8px -12px; }
.tp-keep:active { opacity: .6; }
/* The reason of the day: one small grey line under the answer. "Type here" stands there until a reason is typed. */
.tp-why { min-height: 20px; font-size: var(--t-sm); line-height: 20px; color: var(--ink3); overflow-wrap: anywhere; outline: none; border-radius: 4px; }
.tp-why.can { cursor: text; }
.tp-why.is-ask { opacity: .8; }
.tp-why.is-typing { color: var(--ink); caret-color: var(--pc-d); }
.tp-why.is-typing:empty::before { content: attr(data-ph); color: var(--ink3); pointer-events: none; }
/* Help that stays: one row of quiet links with chevrons under the line. */
.tp-help { display: flex; flex-wrap: wrap; gap: 0 16px; margin-top: 2px; }
.tp-hp { position: relative; display: inline-flex; align-items: flex-start; gap: 5px; min-height: 24px; max-width: 100%; padding: 0; font-size: var(--t-sm); font-weight: 500; line-height: 24px; color: var(--ink2); text-align: left; transition: opacity var(--m-press) ease; }
.tp-hp::after { content: ''; position: absolute; inset: -8px -6px -8px; }
.tp-hp svg { flex: none; width: 15px; height: 15px; margin-top: 4.5px; }
/* A long label wraps onto a second line (text is never cut at 340 px). */
.tp-hp span { min-width: 0; overflow-wrap: anywhere; }
.tp-hp .chev { align-self: center; margin: 0 .2em 0 .3em; }
.tp-hp:active { opacity: .55; }

/* ---------- The quiet lines under the parts (js/today/team-lines.js) ----------
   Notes, Research, "2 with the care team"; for the care team the small heading "Care team" and three lines. */
.tp-tail { margin-top: 8px; display: flex; flex-direction: column; align-items: flex-start; }
.tp-tail[hidden] { display: none; }
/* A sheet that holds only the quiet lines (a patient with a chat and no experiment): no gap above the first line. */
.tp-bare .tp-parts:empty + .tp-tail { margin-top: 0; }
.tp-q { position: relative; display: inline-flex; align-items: center; min-height: 40px; padding: 0; font-size: var(--t-s); font-weight: 500; line-height: 26px; color: var(--ink2); text-align: left; transition: opacity var(--m-press) ease; }
.tp-q::after { content: ''; position: absolute; inset: 0 -14px; }
.tp-q:active { opacity: .55; }
.tp-q b { font-weight: 600; }
.tp-q .chev { margin-bottom: 0; }
.tp-q.team { color: var(--care-d); font-weight: 600; }
.tp-q.team + .tp-q.team, .tp-tail .tp-h + .tp-q { margin-top: 0; }
.tp-tail .tp-h { margin-top: 10px; font-size: var(--t-xs); letter-spacing: 0; }
/* A chat with a new message. */

.sheet .sh-actions .btn[disabled] { cursor: default; }
/* The sheet behind the words of a line tracked for one day: Remove, Every day, Done, each on one line at 340 px. */
.sheet.tp-own-sheet .sh-actions { gap: 8px; }
.sheet.tp-own-sheet .sh-actions .btn { min-width: 0; padding-left: 8px; padding-right: 8px; white-space: nowrap; }

@media (prefers-reduced-motion: reduce) {
  .tp-o, .tp-row { transition: none; }
}

/* (Round 8: the count no longer steps aside for the quiet word at 340 px: the word stands on the row of
   "Day 4 · v4", see the grid of the sheet above.) */

/* Round 11 (zone T1b; DF1, design review findings 8, 9, 25): the order of Today by the part of the day
   (js/today/parts-order.js). All quiet: the Time word and Next share one small word at the right end of the name's
   line ("Evening · Next"; Next in the place's deep colour), so a row stays one line high; one row "Night · N" in the
   morning, with the chevron of "The rest of today". */
.tp-tw { float: right; margin: 0 0 0 12px; font-size: var(--t-sm); font-weight: 500; line-height: inherit; color: var(--ink3); white-space: nowrap; }
.tp-tw .tp-nextw { font-weight: 600; color: var(--pc-d); }
.tp-parts > .tp-fold { margin-top: 14px; }
@media (prefers-reduced-motion: reduce) { .tp-rows > * { animation: none !important; } }

/* Kept from round 11's css/today-layout.css when the theme's Layout went (round 12, zone X): the heading of a part,
   a part that is hidden, and the soft change of a row's colour and padding. */
.tp-parts .tp-h { display: flex; align-items: baseline; gap: 8px; }
.tp-part[hidden] { display: none; }
.tp-row { transition: background-color 320ms ease, box-shadow 420ms ease, padding 320ms var(--ease-out), margin 320ms var(--ease-out), border-radius 320ms ease; }

/* The row "Night · N" that opens the Night rows of the morning (js/today/parts-order.js): quiet, full width, 44 px,
   its chevron turns when open. Kept from round 11's css/today-layout.css (round 12, zone X). */
.tp-fold { display: flex; align-items: center; width: 100%; min-height: 44px; margin-top: 12px; padding: 0 14px; border: 0; border-radius: 14px;
  background: var(--soft); color: var(--ink); font: inherit; font-size: var(--t-s); font-weight: 500; text-align: left; cursor: pointer;
  -webkit-tap-highlight-color: transparent; transition: background-color var(--m-step) ease, transform var(--m-press) var(--ease-out); }
.tp-fold:active { transform: scale(.985); }
.tp-fold i { margin-left: auto; display: grid; place-items: center; font-style: normal; color: var(--ink3); transition: transform var(--m-add) var(--ease-out); }
.tp-fold i svg { width: 16px; height: 16px; }
.tp-fold[aria-expanded="true"] i { transform: rotate(90deg); }

/* The chart of this week under a 1–10 measure of the Measures block (js/home/home-trend.js); the averages stay on the
   document's Chart. Kept from round 11's css/today-cards.css (round 12, zone X). */
.tdc-chart { margin: 10px 0 2px; padding: 10px 12px 6px; border-radius: 14px; background: color-mix(in srgb, var(--soft) 70%, var(--surface)); cursor: default; }
.tdc-chart .dch-avg, .tdc-chart .dch-lvl { display: none; }
.tp-row:has(> .tdc-chart) { flex-wrap: wrap; }
.tp-row > .tdc-chart.is-under { flex: 1 0 calc(100% - 34px); min-width: 0; margin: 0 0 2px 34px; }
.tdc-chart .dch-day { min-height: 20px; margin-top: 4px; font-size: var(--t-xs); gap: 2px 6px; }
.tdc-chart .dch-day .dch-d::after { content: ' ·'; font-weight: 400; color: var(--ink3); }
.tdc-chart .dch-path { stroke: var(--today); }
.tdc-chart .dch-pt { stroke: var(--today-d); }
.tdc-chart .dch-pt.on { fill: var(--today-d); }
@media (prefers-reduced-motion: reduce) { .tp-fold i, .tp-fold { transition: none; } }