/* ============================================================================================
   VOLURR — SOVEREIGN UI · V2-D · the CHART-FIRST WORKSPACE
   (app/static/css/sovereign-chart.css — loads after sovereign-room.css; tokens only)
   ============================================================================================
   The chart is the spatial anchor. The room is one of four contextual states around it, all of
   which the product already has: DOCKED (the dock beside the chart, the chart gives it width),
   OVERLAY (the dock detached and floating over the chart, the chart keeps its width), MAXIMIZED
   (the dock over the whole workspace), COLLAPSED (the reopen pill). This file gives those states
   one grammar and keeps every chart pixel a chart pixel: nothing here touches chart geometry,
   coordinates, or the direction of the time axis.                                                */

/* ── COLLAPSED: the reopen pill — quiet, precise, red only for the identity mark ─────────── */
.lrd-fab{ background:var(--sv-surface-floating); color:var(--sv-text-primary); border:1px solid var(--sv-border-subtle);
  padding:0 var(--sv-5) 0 var(--sv-3); min-height:36px; border-radius:var(--sv-r-pill); font:var(--sv-t-label);
  box-shadow:var(--sv-el-floating); animation:none; inset-block-start:calc(var(--sv-topbar-h) + 10px);
  /* liverooms.css sets `bottom:74px` on the pill whenever the dock is closed; with a top as well the
     pill stretched to the floor (measured 197x930). A pill has a height. */
  bottom:auto; height:36px; }
@media (max-width:760px){ .lrd-fab{ inset-block-start:auto; bottom:calc(var(--lr-sheet, 55dvh) + 12px); height:auto; min-height:var(--sv-target-touch); } }
.lrd-fab::before{ content:""; width:8px; height:8px; border-radius:50%; background:var(--sv-red); flex:0 0 auto; margin-inline-end:2px; }
.lrd-fab svg{ width:var(--sv-ic-s); height:var(--sv-ic-s); color:var(--sv-text-secondary); }
.lrd-fab:hover{ border-color:var(--sv-border-active); }
.lrd-fab.lrd-drag{ box-shadow:var(--sv-el-overlay); }
body.sv-rail-on .lrd-fab{ inset-inline-end:calc(var(--sv-rail-w) + 12px); }
@media (pointer:coarse){ .lrd-fab{ min-height:var(--sv-target-touch); } }

/* ── OVERLAY: the detached window ───────────────────────────────────────────────────────── */
.lrd-dock.lrd-dock-free{ border:1px solid var(--sv-border-subtle); border-radius:var(--sv-r-l); box-shadow:var(--sv-el-overlay); }
.lrd-dock.lrd-dock-free .lrd-head{ cursor:grab; }
.lrd-dock.lrd-dock-free .lrd-head:active{ cursor:grabbing; }

/* ── MAXIMIZED: over the whole workspace, the same chrome ───────────────────────────────── */
.lrd-dock.lrd-dock-max{ border:1px solid var(--sv-border-subtle); border-radius:var(--sv-r-l); box-shadow:var(--sv-el-overlay); }
body.sv-rail-on .lrd-dock.lrd-dock-max{ inset-inline-end:calc(var(--sv-rail-w) + 14px) !important; }

/* ── the resize handles: invisible until the pointer is there, never a decoration ────────── */
.lrd-rz{ opacity:0; transition:opacity var(--sv-fast) var(--sv-ease); }
.lrd-dock:hover .lrd-rz, .lrd-rz:active{ opacity:1; }
.lrd-rz-e::before, .lrd-rz-w::before{ content:""; position:absolute; inset-block:40%; inset-inline:4px; width:3px; border-radius:3px; background:var(--sv-border-active); opacity:.6; }
@media (hover:none){ .lrd-rz{ opacity:.35; } }

/* ── the chart's own overlays from Room OS: pins, cursors, laser — restrained, legible ─────── */
.lr-pins .lr-pin-b{ background:var(--sv-surface-floating); border:1px solid var(--sv-border-subtle); box-shadow:var(--sv-el-floating);
  border-radius:var(--sv-r-m); border-end-start-radius:3px; padding:var(--sv-2) var(--sv-4); }
.lr-pins .lr-pin-au{ font:var(--sv-t-caption); letter-spacing:var(--sv-caption-track); text-transform:uppercase; color:var(--sv-red); }
.lr-pins .lr-pin-tx{ font:var(--sv-t-secondary); color:var(--sv-text-primary); }
.lr-pins .lr-pin-x{ background:transparent; color:var(--sv-text-muted); width:18px; height:18px; }
.lr-pins .lr-pin-x:hover{ color:var(--sv-danger); background:var(--sv-danger-soft); }
.lr-pins .lr-pin-stem{ background:linear-gradient(var(--sv-red), transparent); }
.lr-pins .lr-pin-stem::after{ background:var(--sv-red); box-shadow:none; }
.lr-pins .lr-pin-in{ background:var(--sv-surface-floating); border:1px solid var(--sv-border-active); color:var(--sv-text-primary); font:var(--sv-t-secondary); border-radius:var(--sv-r-s); }
.lr-pins .lr-pin-in:focus{ outline:none; box-shadow:0 0 0 3px var(--sv-red-soft); }
.lr-pins .lr-pin-send{ background:var(--sv-red); border-radius:var(--sv-r-s); width:30px; height:30px; }
.lr-lasers .lr-laser-pt{ box-shadow:0 0 0 2px var(--sv-surface-0); }

/* ── FOCUS: the chart's own toolbar breathes; nothing else changes (the chart is the chart) ── */
body[data-sv-mode="focus"] .lrd-fab{ opacity:.92; }
body[data-sv-mode="focus"] .agi-launcher{ opacity:.85; }
body[data-sv-mode="focus"] .agi-launcher:hover{ opacity:1; }

/* ── the dock's edge against the chart: one hairline, no glow, no blur ─────────────────── */
.lrd-dock:not(.lrd-dock-free):not(.lrd-dock-max){ border-inline-start:1px solid var(--sv-border-subtle); box-shadow:none; }
