/* ─── Workspace v2 (DC runtime) — alias bridge ──────────────────────────────
   The mockup's inline styles (Workspace.dc.html) use generic --bg/--card/...
   var names. Scope them here to the existing --ibv-* tokens so the mockup's
   ~380 inline style="...var(--bg)..." occurrences need no rewriting. */
.ibv-ws2-root {
    --bg: var(--ibv-bg);
    --card: var(--ibv-card);
    --border: var(--ibv-border);
    --warm: var(--ibv-bg-soft);
    --accent: var(--ibv-accent);
    --accent2: var(--ibv-accent-2);
    --text: var(--ibv-text);
    --muted: var(--ibv-muted);
    --ink: var(--ibv-ink);
    --peach: var(--ibv-accent-soft);
    --blue: var(--ibv-info-soft);
    --mint: var(--ibv-success-soft);
    --lav: color-mix(in srgb, var(--ibv-accent-2) 12%, var(--ibv-card));
    font-size: 14px;
    line-height: 1.7;
}

/* ─── animation/hover rules from Workspace.dc.html <helmet><style> ──────────
   (the :root{--bg...} and .dark{...} variable blocks are replaced by the
   alias bridge above and intentionally omitted) */
.ibv-ws2-root *::-webkit-scrollbar { width: 8px; height: 8px; }
.ibv-ws2-root *::-webkit-scrollbar-thumb { background: var(--border); border-radius: 4px; }
.ibv-ws2-root *::-webkit-scrollbar-thumb:hover { background: var(--accent); }
.ibv-ws2-root textarea:focus, .ibv-ws2-root input:focus, .ibv-ws2-root select:focus { box-shadow: 0 0 0 3px rgba(200,90,52,.16); outline: none; }
.ibv-ws2-root textarea::placeholder { color: var(--muted); opacity: .7; }
.ibv-ws2-root input[type=range] { accent-color: var(--accent); }

@keyframes ibvShimmer { 0%{background-position:-200% 0;} 100%{background-position:200% 0;} }
@keyframes ibvSpin { to{ transform:rotate(360deg);} }
@keyframes ibvPop { from{ opacity:0; transform:scale(.96) translateY(6px);} to{ opacity:1; transform:none;} }
@keyframes ibvPulse { 0%,100%{ opacity:1;} 50%{ opacity:.45;} }

.ibv-actions { opacity: 0; transition: opacity .14s ease; }
.ibv-histrow:hover .ibv-actions, .ibv-histrow:focus-within .ibv-actions { opacity: 1; }
.ibv-tab-x { opacity: 0; transition: opacity .12s ease; }
.ibv-tab:hover .ibv-tab-x { opacity: 1; }
.ibv-card:hover .ibv-actions, .ibv-card:focus-within .ibv-actions { opacity: 1; }
.ibv-gcard .ibv-gactions { opacity: 0; transition: opacity .16s; }
.ibv-gcard:hover .ibv-gactions { opacity: 1; }
.ibv-gcard { transition: transform .18s cubic-bezier(.4,0,.2,1), box-shadow .18s; }
.ibv-gcard:hover { transform: scale(1.04); box-shadow: 0 6px 24px rgba(0,0,0,.12); }
@media (hover:none) { .ibv-gcard .ibv-gactions { opacity: 1; } }
.ibv-grip { opacity: 0; transition: opacity .14s ease; }
.ibv-histrow:hover .ibv-grip { opacity: .85; }
.ibv-noscroll { scrollbar-width: none; }
.ibv-noscroll::-webkit-scrollbar { height: 0; width: 0; display: none; }
@media (hover:none) { .ibv-tab-x, .ibv-card .ibv-actions, .ibv-grip { opacity: 1; } }

/* ─── Bay tab tile grid — ibv-tabs.css integration ──────────────────────────
   ibv-tabs.css uses --ibv-* tokens directly; inside .ibv-ws2-root the --ibv-*
   tokens resolve correctly from ibv-tokens.css.  No bridge needed for the token
   names — the .ibv-bay-tabs / .ibv-bay-tab classes from ibv-tabs.css apply
   globally so they pick up --ibv-* tokens from the theme root.
   The rules below ensure the tile grid fits the existing sidebar layout. */
.ibv-bay-tabs {
    max-width: 100%;      /* override draft's 560px cap — use full sidebar width */
}

/* The dialog overlay uses --card/--border/--bg/--ink/--muted/--peach/--accent
   (short aliases) but sits outside .ibv-ws2-root.  Patch those on :root so the
   fixed overlay inherits sensible values. */
:root {
    --card: var(--ibv-card, #1e1e2e);
    --border: var(--ibv-border, rgba(255,255,255,.12));
    --bg: var(--ibv-bg, #12121c);
    --ink: var(--ibv-ink, #f0ede8);
    --muted: var(--ibv-muted, #7e7e96);
    --peach: var(--ibv-accent-soft, rgba(200,90,52,.12));
    --accent: var(--ibv-accent, #C85A34);
}

/* Full-screen file-drag overlay split zones (left = reference, right = Bay).
   Side-by-side on desktop; stacked top/bottom on narrow viewports where a
   left/right split would leave each half too cramped to read. */
.ibv-filedrag-split {
    flex-direction: row;
}
@media (max-width: 640px) {
    .ibv-filedrag-split {
        flex-direction: column;
    }
}