/* The Brain Dump sidebar (js/brain-dump-sidebar/).

   Replaced styles/power-brain-dump.css + power-brain-dump-revisit.css on
   2026-08-08. The rows are borrowed and already loaded: the board card from
   styles/goal-board.css (the `.gb-card` contract). What is here is only what is
   genuinely this surface's: the panel body, the week label, the list's rhythm,
   the indent, and the row geometry the shared card cannot know about.

   The panel keeps the ids and classes it has always had (`#brain-dump-panel` /
   `#brain-dump-body`), so the topbar button, the nav drawer entry and the React
   panel header need no change. */

/* ── Panel shell ──────────────────────────────────────────────────── */

/* One flat surface, not a card inside a panel. The list used to sit on the
   Undated Daily sidebar's raised `.undated-goals-card`, which read as a second
   panel inside the first; the body IS the surface now and the rows are the only
   things on it. (That sidebar and its card rule went on 2026-08-12.)

   🔴 `--bg`, the BODY colour, not a panel or card colour — and opaque, never a
   tint. This surface is a page you write on: in dark mode that is Obsidian's
   near-black sheet, in light mode the plain light one, and in both it is the same
   flat ground from the top of the list to the bottom. It was `#191919` here and
   `--card` in light mode, i.e. a PANEL under the words, which is what made the
   dump read as a component rather than a page. */
.brain-dump-panel {
  background: var(--bg);
}

.brain-dump-body {
  position: relative;
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 12px;
}

/* ── Google Tasks footer (`brain_dump_tasks_inbox.js::mountTasksStatus`) ── */

/* One quiet line under the outline: which Google Tasks list feeds this week,
   or a Connect button. `[hidden]` must win, because `display: flex` beats it. */
.bds-gtasks {
  display: flex;
  align-items: center;
  flex: none;
  padding: 8px 12px 12px;
  border-top: 1px solid var(--border, rgba(127, 127, 127, 0.2));
  font-size: 12px;
  color: var(--text-muted);
}

.bds-gtasks[hidden] {
  display: none;
}

.bds-gtasks-line--error {
  color: var(--danger, #c0392b);
}

.bds-gtasks-connect {
  border: 1px solid var(--border, rgba(127, 127, 127, 0.35));
  border-radius: 6px;
  background: transparent;
  color: inherit;
  font: inherit;
  padding: 4px 10px;
  cursor: pointer;
}

.bds-gtasks-connect:hover {
  color: var(--text, inherit);
  border-color: var(--text-muted);
}

/* ── The same outline, as a ROUTE ─────────────────────────────────── */

/* The left rail's "Brain dump" row (`views/brain-dump/`). Everything inside is
   the panel's markup unchanged — `.bds-*` is deliberately unscoped for exactly
   this reason — so the only thing here is the shape of the space around it.

   A column of centred, readable width rather than the full window: a dump line is
   a sentence, and a textarea the width of a desktop monitor is a worse place to
   write one than the 320px sidebar it came from. This is the widest a line can be
   and still be scanned as a list. */
.brain-dump-view {
  display: flex;
  justify-content: center;
  height: 100%;
  min-height: 0;
  overflow-y: auto;
  padding: 24px 16px 48px;
}

/* 🔴 The sheet is painted on the CONTAINER, not on `.brain-dump-view`.

   Both are opaque for the same reason: the route is otherwise transparent down to
   `.backdrop`, whose gradient then moves under the words as the page scrolls, and
   a page you write on does not shimmer. But `.brain-dump-view` cannot be the one
   that carries it — `#view-container` is an auto-height block, so the view's
   `height: 100%` resolves against CONTENT and a three-line dump painted a
   three-line sheet with the gradient taking the rest of the window.

   The container also owns `padding-bottom: max(42vh, 320px)` (styles/layout.css)
   — the room to put the caret under the last line — and that scroll pad is part
   of the page here, not a margin around it. Painting it here is what makes the
   two agree.

   `--bg` is the BODY colour: near-black in dark mode, the plain light ground in
   light mode. Not `--card` or `--panel-bg`, which would be a panel under the
   words — the thing that made the dump read as a component rather than a page. */
#view-container[data-view="brain-dump"] {
  background: var(--bg);
}

.brain-dump-view-body {
  position: relative;
  flex: 1;
  max-width: 680px;
  min-width: 0;
}

.brain-dump-sidebar-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-height: 0;
}

/* ── The week nav ─────────────────────────────────────────────────── */

/* `‹ Week 1 of August ›`. A label until 2026-08-12, when the arrows arrived: the
   dump is week-scoped, and a week-scoped list with no way back is one that
   expires every Sunday night. The arrows step WEEKS, not days — nothing here is
   dated, they only choose which undated outline is on screen.

   Three columns with the arrows fixed and the label flexible, so the label stays
   centred whatever it says and the arrows never move between weeks. */
.bds-week-nav {
  align-items: center;
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) 24px;
  padding: 2px 0 4px;
}

/* Quiet — it names what the list is, then gets out of the way. A button in every
   week so the header keeps one shape; it only LOOKS pressable when there is
   somewhere to go back to (`--away`), which is the whole signal that you are not
   looking at this week. */
.bds-week-label {
  background: none;
  border: none;
  color: var(--text-secondary);
  cursor: default;
  font-family: inherit;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.02em;
  overflow: hidden;
  padding: 2px 4px;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bds-week-label--away {
  color: var(--text-primary);
  cursor: pointer;
  text-decoration: underline;
  text-decoration-style: dotted;
  text-underline-offset: 3px;
}

/* The no-arrow header (the left rail's route, js/brain-dump-sidebar/brain_dump_view.js):
   the same row with the two 24px arrow tracks collapsed, so the caption sits in the
   same place as the label it replaces rather than shifting between the two ways in. */
.bds-week-nav--static {
  grid-template-columns: minmax(0, 1fr);
}

/* Deliberately NOT `.bds-week-label`: that one is a button that grows a dotted
   underline when you are away from this week, and there is nowhere to be away
   from here. Same weight and colour, no affordance. */
.bds-week-static {
  color: var(--text-secondary);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.02em;
  overflow: hidden;
  padding: 2px 4px;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bds-week-arrow {
  align-items: center;
  background: none;
  border: none;
  border-radius: 6px;
  color: var(--text-secondary);
  cursor: pointer;
  display: flex;
  height: 22px;
  justify-content: center;
  padding: 0;
  width: 22px;
}

.bds-week-arrow:hover {
  background: rgba(var(--overlay-rgb), 0.1);
  color: var(--text-primary);
}

/* The chevron is a stroked path, exactly as the shared sidebar date header draws
   it, so the two controls read as the same thing at two scales. */
.bds-week-arrow svg {
  fill: none;
  height: 14px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
  width: 14px;
}

/* ── The list: ONE document, not a stack of cards ─────────────────── */

/* 🔴 This surface used to draw a bordered, filled, rounded card per line, and
   that is what it is defined by NOT drawing now. The borders were not only noise:
   a box per line is what a stack of separate things looks like, and it made every
   real editing gesture read as wrong — a selection dragged down three lines drew
   three disconnected highlight bands, and the eye had to reassemble them into
   "some text is selected". Take the boxes away and the same selection is one
   continuous run, which is all "make it feel like Obsidian" ever meant.

   The list is the one contenteditable (`brain_dump_outline.js`). Its outline is
   removed because the focus ring would be drawn around the WHOLE dump — a box
   around everything, which is the thing being removed — and the caret inside it
   is the honest indicator that it has focus. */
.bds-list {
  caret-color: var(--text-primary);
  display: flex;
  flex-direction: column;
  gap: 0;
  outline: none;
  padding: 2px 0;
}

/* One line of a document. No background, no border, no radius — the row is a
   layout box for the grip and the tick, and nothing that is drawn.

   🔴 THREE classes, and every one of them is load-bearing. The row is
   `class="ltg-row gd-daily-group gb-card bds-row"`, so it is matched by a rule in
   four other stylesheets, and this one has to outrank all of them:

     · `.gb-card` (styles/goal-board.css) ties with a plain `.bds-row` at 0-1-0
       and is loaded LATER, so it won the tie silently — border gone, fill kept;
     · `body.theme-light .ltg-row` (views/week/shared/long-term-popup.css) paints
       `--utility-surface-accent` at 0-2-1, which OUTRANKS `.bds-row.gb-card` at
       0-2-0. That is the light-mode bug reported on 2026-08-31: dark mode looked
       right and light mode drew a pale blue band per line, which is the "dividing
       lines" this surface was supposed to have removed.

   `.bds-list .bds-row.gb-card` is 0-3-0 and beats both. 🔴 Anything below that
   re-declares a property one of those files also sets needs the same three
   classes — and it has to be checked in BOTH themes, because the rule that
   ambushed this one only exists under `body.theme-light`. */
.bds-list .bds-row.gb-card {
  background: none;
  border: 0;
  border-radius: 0;
  box-sizing: border-box;
  margin: 0;
  /* The air between two lines. A dump is read as a column of sentences, so the
     spacing is the line-height's plus this — Obsidian's rhythm, not a table's.
     It was 1px, which put six lines in the space four belong in. */
  padding: 3px 4px 3px 2px;
}

/* 🔴 THREE tracks, one per child — grip · tick · words.
   Four until the × was removed. Grid auto-placement fills tracks in order, so a
   count that disagrees with the child count does not overflow, it silently puts
   the words in the wrong track and sizes them to their own content. Track COUNT
   is load-bearing: add a child to the row and add a track here in the same breath.

   🔴 And the extra `.gb-card` is load-bearing too, not decoration. `.bds-row X`
   and `.gb-card X` have the SAME specificity, and styles/goal-board.css is loaded
   AFTER this file in index.html — so every plain `.bds-row` override of a shared
   card rule silently lost the tie. Anything below that re-declares something
   goal-board.css also sets has to carry both classes. */
.bds-list .bds-row.gb-card .gd-daily-line {
  align-items: start;
  gap: 6px;
  grid-template-columns: auto auto minmax(0, 1fr);
}

/* One continuous run down the page. Painted explicitly because the rows are
   separate elements: without a shared highlight colour a multi-row selection
   reads as several selections rather than one. */
.bds-list ::selection {
  background: var(--accent-soft, rgba(94, 129, 244, 0.28));
}

/* ── The grip ─────────────────────────────────────────────────────── */

/* Six dots, 2 across × 3 down, drawn as ONE tiled radial-gradient rather than six
   nodes — this list can be long, and the dot size then lives in one place.
   `background-size` is the cell; the box is exactly two cells wide and three
   tall, so the tiling IS the grid.

   🔴 It is the MECHANISM now, not an advertisement. The card used to be the drag
   surface with the controls carved back out; on a surface where the words are
   live text, that rule had to decide between "a press here starts a drag" and "a
   press here puts a caret" every time, and it decided by whether the field
   already had focus — so the same press did different things depending on what
   you had done before it. The grip drags, the words take the caret, and neither
   has to guess (`brain_dump_row_drag.js`).

   Faded until the row is under the pointer: a column of six-dot handles down the
   left of every line is exactly the chrome this surface removed. It never
   disappears entirely, because a control you cannot find is not a control. */
.bds-grip {
  align-self: center;
  background-image: radial-gradient(currentColor 1.1px, transparent 1.4px);
  background-position: 0 0;
  background-size: 5px 5px;
  color: var(--text-muted, #5f6368);
  cursor: grab;
  height: 15px;
  opacity: 0.25;
  transition: opacity 0.12s ease;
  user-select: none;
  width: 10px;
}

.bds-list .bds-row.gb-card:hover .bds-grip {
  color: var(--text-secondary, #9aa0a6);
  opacity: 1;
}

/* Sub-rows have their own grip: the indent says how a thought is filed, not who
   owns it, and the step written under an outcome is usually the thing you want on
   the calendar. This hides the dots where there is no drag AT ALL — a phone,
   where the panel covers the calendar. The element stays, invisible, because
   removing it would slide that row's tick out of line with every other row's. */
.bds-grip--off {
  cursor: default;
  visibility: hidden;
}

/* The card's own padding is the row's; the shared body/content wrappers must not
   add a second inset, or the words start further right on every level of indent. */
.bds-list .bds-row.gb-card .gd-daily-body,
.bds-list .bds-row.gb-card .gd-daily-content {
  gap: 0;
  min-width: 0;
  width: 100%;
}

/* The indent, as a step count rather than a rule per level — `--bds-indent` is
   stamped by the row builder, so MAX_INDENT can change without this following it. */
/* 🔴 Three classes again, and here it is a fix rather than a precaution: the row
   rule above sets `margin: 0` at 0-3-0, so a plain `.bds-row--sub` at 0-1-0 lost
   and EVERY indented line drew flush left — the outline was still an outline in
   the model and a flat list on screen. Both are `margin`, so this has to outrank
   it, not merely differ from it. */
.bds-list .bds-row--sub.gb-card {
  margin-left: calc(var(--bds-indent, 1) * 16px);
}

/* ── The words ────────────────────────────────────────────────────── */

/* A span inside the list's editable, not a field of its own — that is what lets a
   selection cross rows (`brain_dump_outline.js`). So it must read as text on a
   page and carry none of a control's furniture: no background, no border, no
   ring when it has the caret.

   `white-space: pre-wrap` is load-bearing rather than typographic: a thought
   typed with a run of spaces keeps them, and — since the model round-trips
   `textContent` — a line that lost its spacing on screen would be SAVED without
   it. `word-break` stops one pasted URL from pushing the row wider than the panel.

   The min-height is one line: a blank row still has to be tall enough to hold a
   caret and to be clicked into. */
.bds-list .bds-row.gb-card .ltg-text {
  background: none;
  border: 0;
  cursor: text;
  display: block;
  /* Reading size, not control size. `.ltg-text` is 13px because it is a FIELD on
     the goal boards — one short title in a card. Here it is the body text of a
     page, and 13px at 1.5 packed six lines into the space four belong in, which
     is what "the lines are too close together" was. The rhythm is the landing
     page's in Delta Drills (`styles/how-it-works.css`, 1.7), at the size a
     680px measure wants rather than that page's 985px one. */
  font-size: 15px;
  line-height: 1.7;
  margin: 0;
  min-height: 1.7em;
  outline: none;
  overflow-wrap: anywhere;
  padding: 0;
  /* The positioning context for the placeholder below. Without it the absolutely
     positioned hint escapes to the nearest positioned ancestor — the panel — and
     lands somewhere unrelated to the line it belongs to. */
  position: relative;
  white-space: pre-wrap;
  width: 100%;
}

/* 🔴 No focus treatment at all, deliberately. The field used to take a surface
   and a border when it had the caret, which on a one-editor surface would paint a
   box around whichever line you were in — a card, drawn one line at a time, which
   is the thing this surface removed. The caret says where you are. */
.bds-list .bds-row.gb-card .ltg-text:focus,
.bds-list .bds-row.gb-card .ltg-text:focus-visible {
  background: none;
  border-color: transparent;
  outline: none;
}

/* The placeholder. 🔴 Not `:empty` — the span always holds a text node so it can
   be addressed by a Range, so it is never `:empty` even with no words in it; the
   row builder and `onInput` toggle the class instead. `pointer-events: none` so
   clicking the hint puts the caret in the line rather than selecting the hint. */
.bds-list .bds-row--empty.gb-card .ltg-text::before {
  color: var(--text-muted);
  content: attr(data-placeholder);
  left: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
}

/* The tick is a single-line control beside words that may be several lines tall.
   It sits with the FIRST line, which is the line it is about. */
.bds-list .bds-row.gb-card .gd-daily-check {
  align-self: start;
  margin-top: 2px;
  user-select: none;
}

/* An unlinked line has no parent to inherit a colour from and no chips to show,
   so its footer is an empty row taking a gap. Collapsed rather than removed: the
   card is shared with the board, where the footer holds the parent chip. */
.bds-list .bds-row.gb-card .gd-daily-foot,
.bds-list .bds-row.gb-card .gd-link-tags {
  display: none;
}

/* ── Add a line ───────────────────────────────────────────────────── */

/* Enter already adds a line, but only once the caret is in one. This is the same
   act for a pointer, and what it adds is an ordinary top-level line — so it can be
   dragged onto the calendar, the Daily tab or the goal tree like any other. */
/* 🔴 No box. It was a dashed rounded panel the full width of the list, which is
   the last piece of card chrome on a surface whose whole point is that it has
   none — and it drew a hard rule right under the words, which is exactly the
   "dividing lines" being removed. A quiet line that lights up when you reach for
   it says the same thing without drawing a container.

   Indented to the words, not to the row edge: it adds a LINE, so it belongs in
   the column the lines are in rather than out under the grips. 38px is the grip
   and tick tracks plus their gaps — the same offset the row grid produces. */
.bds-add {
  background: none;
  border: 0;
  border-radius: 6px;
  color: var(--text-muted);
  cursor: pointer;
  font-size: 13px;
  padding: 4px 8px 4px 38px;
  text-align: left;
  transition: background 0.12s ease, color 0.12s ease;
  width: 100%;
}

.bds-add:hover {
  background: rgba(var(--overlay-rgb), 0.06);
  color: var(--text-primary);
}

/* ── The card you are holding mid-drag ────────────────────────────────
   Built (not cloned) by js/brain-dump-sidebar/brain_dump_drag_carry.js and moved
   under the pointer by the calendar's drag_carry.js. Until 2026-09-05 this drag
   declared no carry at all, so the row dimmed in place, the target lit up, and
   nothing was in your hand — on a surface whose whole job is to be emptied onto
   boards that have usually scrolled the sidebar away.

   Deliberately PLAIN: the words on a card, no grip, no tick, no indent. It is a
   preview of the goal about to be minted, not a photograph of the row it came
   from — and a plain goal with those words is exactly what every target mints.

   Mounted on the BODY, so it is scoped by its own class only and none of the
   theme variables reach it by inheritance — they are all restated below. That is
   the same arrangement `.gb-subgoal-carry` uses in styles/goal-board.css, and for
   the same reason: a fixed node inside a view is positioned against whatever
   ancestor holds a transform, which is the trap drag_carry.js documents. */
.bds-drag-carry {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 9999;
  box-sizing: border-box;
  padding: 6px 10px;
  border-radius: 8px;
  /* A long line drags as wide as the sidebar row it came from, which near the
     right-hand column of a board puts most of the thing in your hand off screen.
     The words wrap instead. */
  max-width: min(320px, 60vw);
  /* The RESOLVED opaque card colour, never a tint: this flies over the calendar
     grid and over four boards' columns, and a translucent floor reads their rows
     straight through the goal's own words. The text colour is restated for the
     same reason — on the body, the clone inherits none of the card's. */
  background: var(--card-surface-strong, var(--card-surface, var(--card, var(--bg))));
  color: var(--text-primary);
  border: 1px solid rgba(var(--overlay-rgb), 0.22);
  /* Same treatment as the period boards' `.gb-drag-carry` and the Daily tab's
     `.dlg-drag-carry`: enough transparency to see the surface you are aiming at
     through the thing in your hand, and a shadow that says it is above that
     surface rather than in it. No rotation and no scale — the other boards never
     tilt, and one gesture must not look like two things. */
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.42);
  opacity: 0.92;
  font-size: 14px;
  line-height: 1.35;
  /* `elementFromPoint` is how every drop target under it is resolved, so the
     card must never be what the pointer hits. */
  pointer-events: none;
  will-change: transform;
}

.bds-drag-carry-text {
  display: block;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

/* A blank line still drags, and it says so rather than flying as an empty box. */
.bds-drag-carry--empty .bds-drag-carry-text {
  color: var(--text-muted);
  font-style: italic;
}

/* Stood down over the goal tree, which draws its OWN copy of the goal under the
   pointer (js/goals-dashboard/goals_dashboard_drop_preview.js) because the branch
   it runs to the parent has to attach to something. Two cards under one pointer
   is the gesture promising two drops. `visibility`, not `display`: the node keeps
   its box, so drag_carry.js's origin measurement still reads a real rect and the
   card comes back exactly where it left. */
.bds-drag-carry--hidden {
  visibility: hidden;
}