/* Brand layer (placeholder brand handover v0.2), additive to subleeva-tokens.css --
   kept as its own file so tokens.css stays an unmodified copy of the supplied
   source of truth. Rust appears only where identity or human judgement lives:
   the wordmark's lifted 'e', the mark, masthead accents, and the gate
   sign-off flourish. Never a control, state, or chart colour. */
:root {
  --brand: #A84B24;       /* 5.2:1 on ivory, 5.7:1 on white */
  --brand-tint: #F3E4DB;  /* optional shell backgrounds only */
}

/* Thin, persistently-visible scrollbar for internally-scrolling pane content
   (Provenance/Pipeline side panes, the centre workspace's fields region) --
   mirrors command_deck_mockup_v2.html's .fields/.right-full scrollbar-width:
   thin treatment, so "there's more below" stays visible rather than relying
   on OS auto-hide scrollbar behaviour. */
.pane-scroll {
  scrollbar-width: thin;
  scrollbar-color: var(--border-strong) transparent;
}
.pane-scroll::-webkit-scrollbar {
  width: 4px;
}
.pane-scroll::-webkit-scrollbar-track {
  background: transparent;
}
.pane-scroll::-webkit-scrollbar-thumb {
  background: var(--border-strong);
  border-radius: 2px;
}

/* "There's more below" affordance, visible at rest -- review-integrity, not
   polish: a user must never be able to leave a proposition's fields
   half-read because the cutoff wasn't obvious. Reported twice as too subtle
   at 18px/0.18 opacity; this is deliberately bolder (32px, 0.4 opacity) so
   it reads unmistakably as "more below," not a faint colour seam.
   Standard CSS-only scroll-shadow technique (two stacked background layers,
   no JS, no scroll-position tracking):
     - layer 1 (attachment: local) is a solid-canvas-coloured fade anchored
       to the bottom edge of the SCROLLING CONTENT, so it scrolls together
       with it;
     - layer 2 (attachment: scroll) is the visible shadow, anchored to the
       bottom edge of the BOX itself, and never moves.
   While there is more content below, layer 1 sits off-screen further down
   (content continues past the visible box), so only layer 2's shadow shows.
   Once scrolled to the true end, layer 1 arrives at the visible bottom edge
   and its solid colour exactly overlaps and cancels layer 2 -- the shadow
   disappears precisely when there is nothing left below. */
.fade-below {
  background:
    linear-gradient(rgba(0, 0, 0, 0), var(--canvas) 65%) center bottom / 100% 64px local no-repeat,
    radial-gradient(farthest-side at 50% 100%, rgba(20, 16, 8, 0.4), rgba(20, 16, 8, 0)) center bottom / 100% 32px scroll no-repeat var(--canvas);
}
