/* Sessions side by side (split.js), as many as can be read. Wide screens with a mouse only. A window made narrower than its views keeps
   each at its readable width and scrolls sideways, with a thin bar to say so (the panes' own bars are hidden, panel.css). */
.panel-pane.pane-new.split-on { display: grid; grid-template-columns: var(--split-cols, 1fr 6px 1fr); grid-template-rows: auto minmax(0, 1fr); overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; padding-left: 0; padding-right: 0; }
.panel-pane.pane-new.split-on > .mine-drop { grid-column: 1 / -1; grid-row: 1; margin-left: 0; margin-right: 0; }
.split-on > .split-pane, .split-on > .split-divider { grid-row: 2; min-height: 0; }
.split-pane { position: relative; min-width: 0; box-sizing: border-box; }
.split-on > .split-pane { overflow: hidden; display: flex; flex-direction: column; padding: 0 12px; border-top: 2px solid transparent; }
.split-on > .split-pane.on { border-top-color: var(--gold); }
.split-on > .split-pane.first { overflow-y: auto; }
.split-head { display: flex; align-items: center; gap: 8px; padding: 4px 0 6px; flex: 0 0 auto; }
.split-title { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12.5px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.split-body { position: relative; flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
.split-body > .work-pane { flex: 1 1 auto; min-height: 0; }
.split-pane.second .work-strip, .split-pane.second .work-proposals, .split-pane.second .work-prop-dock { display: none !important; }
.split-divider { position: relative; cursor: col-resize; background: var(--line); touch-action: none; }
.split-divider::before { content: ''; position: absolute; top: 0; bottom: 0; left: -6px; right: -6px; }
.split-divider:hover, .split-divider:focus-visible, .split-sizing > .split-divider { background: var(--gold); outline: none; }
.split-sizing { user-select: none; }
.split-zones { position: absolute; inset: 0; z-index: 30; pointer-events: none; }
.split-zone { position: absolute; top: 0; bottom: 0; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px dashed rgba(255, 255, 255, 0.28); border-radius: 10px; background: rgba(255, 255, 255, 0.04); transition: background 0.12s, border-color 0.12s; }
.split-zone.z-l3, .split-zone.z-r3 { z-index: 2; }
.split-zone.hot { border-color: var(--gold); background: rgba(224, 163, 63, 0.16); }
.split-zone:not(.hot) .split-zone-label { opacity: 0.55; }
.split-zone-label { padding: 4px 10px; border-radius: 999px; background: var(--panel); color: var(--text); font-size: 13px; font-weight: 600; }
.split-ghost { position: fixed; left: 0; top: 0; z-index: 9999; max-width: 260px; padding: 8px 14px; border: 1px solid var(--gold); border-radius: 12px; background: var(--panel); color: var(--text); font-size: 14px; box-shadow: 0 10px 26px rgba(0, 0, 0, 0.4); pointer-events: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.split-dragging, .split-dragging * { cursor: grabbing !important; user-select: none; }
@media (prefers-reduced-motion: reduce) { .split-zone { transition: none; } }
/* Nothing on a lane card is dragged by the browser: the card's own pull-out is split.js's. */
.work-strip-item img, .work-strip-item svg { -webkit-user-drag: none; user-select: none; }
.split-btn:disabled { opacity: 0.3; cursor: default; }
/* The whole lane dropped over the views, and the chosen card's ghost over their tops (split.js, Chris, 30 Oct). */
.split-sheet { position: absolute; z-index: 40; box-sizing: border-box; display: flex; flex-direction: column; padding: 12px 16px 16px; background: var(--panel); border-top: 1px solid var(--line); box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35); animation: split-sheet-drop 0.22s cubic-bezier(0.2, 0.8, 0.3, 1); }
@keyframes split-sheet-drop { from { transform: translate3d(0, -14px, 0); opacity: 0; } to { transform: none; opacity: 1; } }
.split-sheet-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex: 0 0 auto; margin-bottom: 10px; }
.split-sheet-title { font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.split-sheet-grid { flex: 1 1 auto; min-height: 0; overflow-y: auto; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; align-content: start; scrollbar-width: thin; }
.detail .split-sheet-card { width: auto; }
.split-pick { position: absolute; left: 0; top: 0; z-index: 45; box-sizing: border-box; padding: 8px 14px; border: 1px solid var(--gold); border-radius: 12px; background: var(--panel); color: var(--text); font: 600 14px/1.3 var(--font); text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; opacity: 0.92; box-shadow: 0 10px 26px rgba(0, 0, 0, 0.45), 0 0 0 3px rgba(224, 163, 63, 0.25); transition: transform 0.45s cubic-bezier(0.2, 0.8, 0.3, 1), width 0.45s cubic-bezier(0.2, 0.8, 0.3, 1); }
.split-pick:hover, .split-pick:focus-visible { opacity: 1; background: var(--gold-soft, var(--panel)); outline: none; }
.picking > .split-pane { outline: 1px dashed rgba(255, 255, 255, 0.22); outline-offset: -2px; }
.picking > .split-pane.pick-here { outline: 2px solid var(--gold); background: rgba(224, 163, 63, 0.06); }
@media (prefers-reduced-motion: reduce) { .split-sheet { animation: none; } .split-pick { transition: none; } }
/* Every card whole, as on a full screen (Chris, 5 Nov): one height for all, the title's two lines and the line under it; the sheet scrolls. */
.split-sheet-grid > .split-sheet-card { height: 84px; min-height: 0; overflow: hidden; box-sizing: border-box; }
.split-sheet-grid > .split-sheet-card .work-strip-meta { max-width: 100%; }

/* A card held still lifts (Chris, 5 Nov: hold and drag should be plain): it grows, the cursor grips, and from then on it goes any way. Let go
   in place, it opens its settings. The same on the lane's cards and on the All sessions sheet's. */
.work-strip-item.split-lifted { transform: scale(1.05); border-color: var(--gold); box-shadow: 0 10px 24px rgba(0, 0, 0, 0.45); position: relative; z-index: 3; transition: transform 0.14s, box-shadow 0.14s; }
body.split-lifting, body.split-lifting .work-strip-item { cursor: grabbing; user-select: none; }
body.split-dragging { cursor: grabbing; user-select: none; }
.split-ghost { display: flex; flex-direction: column; gap: 2px; max-width: 320px; }
.split-ghost-name { overflow: hidden; text-overflow: ellipsis; }
.split-ghost-hint { font-size: 12px; color: var(--muted); }
@media (prefers-reduced-motion: reduce) { .work-strip-item.split-lifted { transition: none; } }