/* VISUAL-POLISH-003 · readability and responsive layer over 2c153ff.
 * Uses only existing tokens from polish.css (--ink, --ink2, --mute, --line, --line2, --st-*).
 * No new colours, no new motion. Nothing here signals activity, presence or message transfer. */

/* ---------- map labels: legible halo, priority culling, on-demand reveal ---------- */
.node .label { stroke:#080b10; stroke-width:4px; stroke-linejoin:round; }
.node .slabel { stroke:#080b10; stroke-width:3.5px; stroke-linejoin:round; }
.lbl-name .slabel { display:none; }
.lbl-off { display:none; }
/* a hidden label returns only on explicit attention: hover, keyboard focus, selection */
.node:hover .lbl-off, .node:focus-visible .lbl-off, .node.selected .lbl-off { display:inline; }
.node:hover .lbl-name .slabel, .node:focus-visible .lbl-name .slabel, .node.selected .lbl-name .slabel { display:inline; }
.node.selected .label { fill:var(--ink); font-weight:550; }
/* muted context keeps its structure but steps back typographically, not by fading to illegible */
.node.context-muted .lbl .label { fill:var(--ink2); }

/* ---------- desktop: legend never sits on top of spheres ---------- */
.map-key { max-width:min(420px,40vw); }

/* ---------- tablet 761–1200: one calm header instead of a stacked column ---------- */
@media (max-width:1200px) and (min-width:761px) {
  .topbar { grid-template-columns:auto minmax(160px,1fr) auto; grid-template-areas:"brand search modes" "views views views" "right right right"; row-gap:8px; }
  .mode-contemplation .topbar { grid-template-areas:"brand search modes" "right right right"; }
  .topbar .top-right { flex-wrap:wrap; justify-content:flex-end; gap:6px; }
  .topbar .top-right .btn.small, .topbar .top-right .dec-badge, .topbar .top-right .fresh-pill { min-height:40px; }
  .views { flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; }
  .views button { flex:none; }
  .data-modes { justify-self:end; }
  .map-caption h1 { font-size:26px; }
  .map-key { left:24px; bottom:100px; max-width:min(380px,48vw); }
  .map-key-line { font-size:13px; }
}

/* ---------- phones ≤760: give the map its space back ---------- */
@media (max-width:760px) {
  /* Header: same controls, tighter rhythm (44px targets kept). */
  .topbar { padding:6px; gap:6px; }
  .views { padding-top:2px; }
  .status-chips { gap:6px; }
  .chip { min-height:40px; padding:0 10px; }
  /* Map tools: compact right-aligned row; drag-mode toggle only in Работа, where editing happens. */
  .map-tools { gap:2px; padding:3px; border-radius:10px; }
  .mode-contemplation #branch-mode { display:none; }
  /* Legend: two quiet lines instead of a block over the map. */
  .map-key { padding:6px 10px; bottom:150px; left:12px; max-width:calc(100% - 24px); }
  .map-key-line { font-size:13px; gap:2px 8px; }
  .map-key-line span:last-child { flex-basis:auto; }
  .map-signal { font-size:13px; margin-top:4px; }
  /* Sheet: a little less than half so the selected sphere and its label stay visible above it. */
  .panel.sheet[data-sheet=half] { height:48dvh !important; }
  .insp-name { font-size:22px; line-height:1.2; }
  .panel-body { padding:14px; }
}
@media (max-width:360px) {
  .search input::placeholder { font-size:15px; }
  .map-key-line { font-size:12.5px; }
}

/* VISUAL-POLISH-003a candidate: selected label above spheres, on a quiet plate (existing tokens only) */
.lbl-raised { visibility:hidden; }
#labels-top { pointer-events:none; }
#labels-top .label { text-anchor:middle; font-family:var(--sans); font-weight:550; letter-spacing:-.02em; fill:var(--ink); stroke:none; }
#labels-top .slabel { text-anchor:middle; font-size:14px; stroke:none; }
.raised-plate { fill:rgba(8,11,16,.86); stroke:var(--line2); stroke-width:1; }
