/* ═══════════════════════════════════════════════
   BOARD VIEW — dressed up (Phase 3)
   Lane colour rides each card as a top strip + tints the lane header, so the
   board reads at a glance. Lane colour is passed in as --lane per column/card.
═══════════════════════════════════════════════ */

/* Card top strip in the lane's colour. */
.idb-card::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;
  background:var(--lane,var(--bd2));border-radius:var(--r-md) var(--r-md) 0 0}
.idb-card{padding-top:11px}

/* Lane header gets a faint colour wash + a colour-matched count pill. */
.idb-bcol-h{background:color-mix(in srgb,var(--lane,var(--bd2)) 8%,var(--sur2));
  border-bottom:1px solid color-mix(in srgb,var(--lane,var(--bd2)) 22%,var(--bd))}
.idb-bcol-ct{margin-left:auto;font-size:10px;color:color-mix(in srgb,var(--lane,var(--mu)) 75%,var(--tx));
  background:color-mix(in srgb,var(--lane,var(--bd2)) 16%,transparent);
  padding:1px 8px;border-radius:var(--r-pill);min-width:18px;text-align:center}

/* Lane name: click to rename in place (not the "No <prop>" placeholder lane). */
.idb-bcol-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:1px 5px;margin:-1px -5px;border-radius:var(--r-sm);outline:none;cursor:text;transition:background var(--t-fast),box-shadow var(--t-fast)}
.idb-bcol-name:hover{background:color-mix(in srgb,var(--lane,var(--bd2)) 16%,transparent)}
.idb-bcol-name.none{cursor:default}
.idb-bcol-name.none:hover{background:none}
.idb-bcol-name.editing{background:var(--sur);box-shadow:0 0 0 1.5px color-mix(in srgb,var(--lane,var(--ac)) 70%,var(--ac));text-overflow:clip;overflow:auto;cursor:text}

/* Lane reorder: grab the header (not the "No <prop>" lane). The lane's slot becomes a
   dashed placeholder; a tilted, lifted ghost follows the pointer. touch-action:none
   lets a finger drag the header instead of panning the board. */
.idb-bcol-h.movable{cursor:grab;touch-action:none}
.idb-bcol-h.movable .idb-bcol-name{cursor:pointer}
.idb-bcol.idb-bcol-placeholder{background:color-mix(in srgb,var(--lane,var(--bd2)) 6%,transparent);
  border:1.5px dashed color-mix(in srgb,var(--lane,var(--bd2)) 55%,var(--bd2));box-shadow:none}
.idb-bcol.idb-bcol-placeholder>*{visibility:hidden}
.idb-bcol-ghost{position:fixed;z-index:1500;margin:0;pointer-events:none;opacity:.97;
  transform:rotate(1.6deg) scale(1.02);box-shadow:var(--elev-3);animation:laneLift .14s cubic-bezier(.2,.8,.2,1)}
@keyframes laneLift{from{transform:none;box-shadow:none}to{transform:rotate(1.6deg) scale(1.02)}}
body.idb-lane-dragging,body.idb-lane-dragging *{cursor:grabbing!important;user-select:none!important}

/* The drop-target lane echoes its own hue instead of the generic accent. */
.idb-bcol.idb-bcol-drop .idb-bcol-b{background:color-mix(in srgb,var(--lane,var(--ac)) 12%,transparent)}

/* ── Side-peek polish (Phase 3): a springier entrance + a touch more focus ── */
.doc-peek-backdrop{background:rgba(0,0,0,.52)}
/* Gentle, unhurried entrance — eases in slowly at the start, then a soft settle. */
.doc-peek.mode-side .doc-peek-panel{animation:peekSlideSpring .85s cubic-bezier(.38,.05,.2,1)}
@keyframes peekSlideSpring{0%{transform:translateX(48px);opacity:0}72%{transform:translateX(-4px)}100%{transform:translateX(0);opacity:1}}
.doc-peek.mode-center .doc-peek-panel{animation:peekPopSpring .55s cubic-bezier(.38,.05,.2,1)}
@keyframes peekPopSpring{0%{transform:translate(-50%,-46%) scale(.94);opacity:0}74%{transform:translate(-50%,-50%) scale(1.012)}100%{transform:translate(-50%,-50%) scale(1);opacity:1}}