/* ════════════════════════════════════════════════════════════════
   ta-canvas-v0.1.1.css
   INBXIFY T-A Studio — Production Canvas (8th panel) · W0
   Companion: ta-canvas-v0.1.1.js (matched pair — bump in lockstep)
   Scope: Stages 1–3 live (Canvas-Transition-Scoping v0.4, W0).

   v0.1.1 — COLOR PASS (Jeff: "we need colors!"):
   • Lane identity accents — each stage gets a color: 01 gold /
     02 blue / 03 teal / 04 violet. 3px top bar + tinted lane head
     + colored eyebrow, keyed off [data-cvs-lane] (JS emits it).
   • Stage-3 slot codes become SECTION-COLORED pills (fa/ts/ba/
     tf/ev/re/sb — universal platform slot codes, cosmetic map,
     HC-CVS-005 candidate). Keyed off data-sec (NEW in JS v0.1.1).
   • Stage-2 asset badges get tinted pill backgrounds derived from
     --tc via color-mix; left border 3px → 4px.
   • Plan bar title gets a gold underline accent.
   • Complete replacement of v0.1.0 — remove the old <link>.

   Conventions:
   • Everything namespaced .ixcv- ; root class .ixcv-root.
   • T-A chrome cascade defeat: `section.publisher-wrapper *` sets
     background-color !important at specificity 0,1,1 — all our
     background-bearing rules use `.ixcv-root .ixcv-*` (0,2,0)
     + !important. (Studio MR chrome-war lesson.)
   • Tokens mirror ix-buttons v1.0.4 / ix-form-controls v1.0.0 /
     title-admin-page-design v1.4.13. Reuses .ix-btn / .ix-chip /
     .ix-revert from already-loaded ix sheets where possible.
   ════════════════════════════════════════════════════════════════ */

.ixcv-root{
  --ixcv-gold:#C4A35A; --ixcv-gold-glow:rgba(196,163,90,.12);
  --ixcv-blue:#5b7fff; --ixcv-blue-deep:#4060dd;
  --ixcv-blue-ghost:rgba(91,127,255,.06);
  --ixcv-cream:#FAF9F5; --ixcv-cream-warm:#f5f0e4;
  --ixcv-teal:#1A3A3A;
  --ixcv-border:#e4e0d4; --ixcv-border-soft:#eee9dc; --ixcv-input:#ddd9c8;
  --ixcv-ink:#28241c; --ixcv-ink-2:#5d5748; --ixcv-ink-3:#8b8471;
  --ixcv-ok:#27ae60; --ixcv-danger:#c0392b;
  /* tile roster colors — single source, HC-CVS-004 */
  --ixcv-t-txt:#1f7a6d; --ixcv-t-img:#4a6fd4; --ixcv-t-vid:#c2410c;
  --ixcv-t-aud:#7a5ae0; --ixcv-t-fld:#C4A35A;
  font-family:'DM Sans',system-ui,sans-serif;
  font-size:14px; line-height:1.45; color:var(--ixcv-ink);
  display:flex; flex-direction:column; gap:10px;
  min-height:0; height:100%;
}

/* ── PubPlan bar ─────────────────────────────────────────── */
.ixcv-root .ixcv-planbar{display:flex;align-items:baseline;gap:14px;padding:2px 4px;position:relative;background:transparent !important}
.ixcv-root .ixcv-pb-kick{font-size:10px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ixcv-ink-3)}
.ixcv-root .ixcv-pb-title{appearance:none;border:0;cursor:pointer;display:inline-flex;align-items:center;gap:8px;
  font-family:'Fraunces',Georgia,serif;font-size:20px;font-weight:600;color:var(--ixcv-ink);
  padding:2px 6px;border-radius:8px;background:transparent !important}
.ixcv-root .ixcv-pb-title:hover{background:var(--ixcv-gold-glow) !important}
.ixcv-root .ixcv-pb-caret{font-size:12px;color:var(--ixcv-gold)}
.ixcv-root .ixcv-pb-sub{font-size:12px;color:var(--ixcv-ink-3)}
.ixcv-root .ixcv-pb-menu{position:absolute;left:64px;top:calc(100% + 4px);z-index:120;
  border:1px solid var(--ixcv-border);border-radius:8px;box-shadow:0 12px 32px rgba(0,0,0,.14);
  min-width:300px;padding:5px 0;display:none;background:#fff !important}
.ixcv-root .ixcv-pb-menu[data-open="true"]{display:block}
.ixcv-root .ixcv-pb-item{display:flex;align-items:center;gap:10px;width:100%;appearance:none;border:0;
  padding:9px 14px;font:500 13px/1.2 'DM Sans',sans-serif;color:var(--ixcv-ink);cursor:pointer;
  text-align:left;background:transparent !important}
.ixcv-root .ixcv-pb-item:hover{background:var(--ixcv-cream) !important}
.ixcv-root .ixcv-pb-item .nm{font-weight:600;flex:1}
.ixcv-root .ixcv-pb-next{font-size:9.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:#8a6f35;border:1px solid var(--ixcv-gold);border-radius:20px;padding:2px 8px;
  background:var(--ixcv-gold-glow) !important}

/* ── Lanes ───────────────────────────────────────────────── */
.ixcv-root .ixcv-lanes{flex:1;min-height:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.ixcv-root .ixcv-lane{border:1px solid var(--ixcv-border);border-radius:12px;display:flex;
  flex-direction:column;min-height:0;overflow:hidden;background:#fff !important}
.ixcv-root .ixcv-lane-head{display:flex;align-items:flex-end;justify-content:space-between;gap:8px;
  padding:12px 14px 9px;border-bottom:1px solid var(--ixcv-border-soft);background:#fff !important}
.ixcv-root .ixcv-kick{font-size:10px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ixcv-ink-3)}
.ixcv-root .ixcv-lane-head h2{font-family:'Fraunces',Georgia,serif;font-size:18px;font-weight:600;margin:1px 0 0;line-height:1.1}
.ixcv-root .ixcv-sub{display:flex;gap:5px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;
  align-items:center;padding:9px 14px;min-height:45px;border-bottom:1px solid var(--ixcv-border-soft);background:#fff !important}
.ixcv-root .ixcv-sub::-webkit-scrollbar{display:none}
.ixcv-root .ixcv-body{flex:1;min-height:0;overflow-y:auto;padding:11px 12px 14px;display:flex;
  flex-direction:column;gap:8px;scrollbar-width:thin;background:#fff !important}
.ixcv-root .ixcv-body>*{flex:none}
.ixcv-root .ixcv-empty{text-align:center;color:var(--ixcv-ink-3);font-size:12.5px;padding:24px 8px;background:transparent !important}

/* chips (scoped compact) */
.ixcv-root .ixcv-chip{appearance:none;border:1px solid var(--ixcv-input);color:var(--ixcv-ink-2);
  font:500 11px/1 'DM Sans',sans-serif;padding:4px 8px;border-radius:20px;cursor:pointer;flex:none;
  background:#fff !important;transition:all .2s ease}
.ixcv-root .ixcv-chip[data-active="true"]{border-color:var(--ixcv-teal);color:#fff;background:var(--ixcv-teal) !important}
.ixcv-root .ixcv-chip:hover:not([data-active="true"]){border-color:var(--ixcv-blue)}

/* ── Stage 1 · MEDIA cards + folder tiles ────────────────── */
.ixcv-root .ixcv-card{display:flex;align-items:center;gap:9px;padding:8px 10px;border:1px solid var(--ixcv-border-soft);
  border-radius:8px;cursor:pointer;user-select:none;background:#fff !important;transition:all .2s ease}
.ixcv-root .ixcv-card:hover{border-color:var(--ixcv-blue)}
.ixcv-root .ixcv-card[data-sel="true"]{border-color:var(--ixcv-blue);box-shadow:0 0 0 1px var(--ixcv-blue);
  background:var(--ixcv-blue-ghost) !important}
.ixcv-root .ixcv-card[data-attached="true"]{opacity:.62;cursor:default}
.ixcv-root .ixcv-check{width:15px;height:15px;flex:none;border:1.5px solid var(--ixcv-input);border-radius:5px;
  display:flex;align-items:center;justify-content:center;font-size:9px;color:#fff;background:#fff !important}
.ixcv-root .ixcv-card[data-sel="true"] .ixcv-check{border-color:var(--ixcv-blue);background:var(--ixcv-blue) !important}
.ixcv-root .ixcv-tile{width:29px;height:29px;flex:none;border-radius:6px;display:flex;align-items:center;
  justify-content:center;font:500 8.5px/1 'DM Mono',monospace;letter-spacing:.05em;color:#fff;cursor:zoom-in}
.ixcv-root .ixcv-tile[data-t="text"]{background:var(--ixcv-t-txt) !important}
.ixcv-root .ixcv-tile[data-t="image"]{background:var(--ixcv-t-img) !important}
.ixcv-root .ixcv-tile[data-t="video"]{background:var(--ixcv-t-vid) !important}
.ixcv-root .ixcv-tile[data-t="audio"]{background:var(--ixcv-t-aud) !important}
.ixcv-root .ixcv-tile[data-t="fld"]{background:var(--ixcv-t-fld) !important;font-size:12px;cursor:pointer}
.ixcv-root .ixcv-meta{min-width:0;flex:1}
.ixcv-root .ixcv-name{font-weight:500;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ixcv-root .ixcv-mline{font-size:10.5px;color:var(--ixcv-ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ixcv-root .ixcv-status{margin-left:auto;flex:none;font-size:9px;font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;border-radius:20px;padding:3px 7px}
.ixcv-root .ixcv-status[data-s="available"]{color:#1e7a45;background:rgba(39,174,96,.1) !important}
.ixcv-root .ixcv-status[data-s="attached"]{color:var(--ixcv-ink-3);background:var(--ixcv-cream-warm) !important}
.ixcv-root .ixcv-status[data-s="other"]{color:var(--ixcv-ink-3);background:var(--ixcv-cream-warm) !important}

.ixcv-root .ixcv-folder{border:1px solid var(--ixcv-gold);border-radius:8px;overflow:hidden;background:#fffdf6 !important}
.ixcv-root .ixcv-fhead{display:flex;align-items:center;gap:9px;padding:8px 10px;cursor:pointer;
  user-select:none;background:transparent !important}
.ixcv-root .ixcv-fhead:hover{background:var(--ixcv-gold-glow) !important}
.ixcv-root .ixcv-folder[data-sel="all"]{box-shadow:0 0 0 1px var(--ixcv-gold)}
.ixcv-root .ixcv-fcheck{width:15px;height:15px;flex:none;border:1.5px solid var(--ixcv-gold);border-radius:5px;
  display:flex;align-items:center;justify-content:center;font-size:9px;color:#fff;background:#fff !important}
.ixcv-root .ixcv-folder[data-sel="all"] .ixcv-fcheck{background:var(--ixcv-gold) !important}
.ixcv-root .ixcv-folder[data-sel="some"] .ixcv-fcheck{background:linear-gradient(180deg,var(--ixcv-gold) 50%,#fff 50%) !important}
.ixcv-root .ixcv-fname{font-weight:600;font-size:12px;color:#7a5f2a}
.ixcv-root .ixcv-fsub{font-size:10px;color:var(--ixcv-ink-3)}
.ixcv-root .ixcv-fx{margin-left:auto;appearance:none;border:0;color:var(--ixcv-ink-3);font-size:11px;
  cursor:pointer;padding:4px 6px;border-radius:6px;background:transparent !important;transition:transform .2s ease}
.ixcv-root .ixcv-folder[data-open="true"] .ixcv-fx{transform:rotate(90deg)}
.ixcv-root .ixcv-fmembers{display:none;border-top:1px dashed var(--ixcv-gold);padding:7px 8px 8px 26px;
  flex-direction:column;gap:6px;background:#fffdf9 !important}
.ixcv-root .ixcv-folder[data-open="true"] .ixcv-fmembers{display:flex}

/* ── BundleBar ───────────────────────────────────────────── */
.ixcv-bundlebar{position:fixed;left:50%;bottom:44px;transform:translateX(-50%);z-index:9060;
  color:#fff;border-radius:14px;box-shadow:0 12px 34px rgba(26,58,58,.35);
  display:flex;align-items:center;gap:9px;padding:10px 12px 10px 16px;background:#1A3A3A !important;
  font-family:'DM Sans',system-ui,sans-serif}
.ixcv-bundlebar .cnt{font-size:13px;font-weight:600;white-space:nowrap}
.ixcv-bundlebar .lbl{font-size:11px;color:rgba(255,255,255,.55);white-space:nowrap}
.ixcv-bb-type{appearance:none;border:1px solid rgba(255,255,255,.25);color:#fff;
  font:600 12px/1 'DM Sans',sans-serif;padding:8px 12px;border-radius:8px;cursor:pointer;
  background:rgba(255,255,255,.06) !important;transition:all .2s ease;display:inline-flex;align-items:center;gap:7px}
.ixcv-bb-type:hover:not(:disabled){background:rgba(255,255,255,.16) !important}
.ixcv-bb-type:disabled{opacity:.45;cursor:not-allowed}
.ixcv-bb-clear{appearance:none;border:0;color:rgba(255,255,255,.6);font-size:11px;text-decoration:underline;
  text-underline-offset:2px;cursor:pointer;background:transparent !important}
.ixcv-bb-clear:hover{color:#fff}

/* ── Preview panel ───────────────────────────────────────── */
.ixcv-preview{position:fixed;z-index:9070;border:1px solid var(--ixcv-border,#e4e0d4);border-radius:12px;
  box-shadow:-14px 0 44px rgba(26,58,58,.18);display:flex;flex-direction:column;overflow:hidden;
  background:#fff !important;font-family:'DM Sans',system-ui,sans-serif;color:#28241c}
.ixcv-preview .ph{display:flex;align-items:center;gap:10px;padding:11px 16px;border-bottom:1px solid #eee9dc;background:#fff !important}
.ixcv-preview .pn{font-family:'Fraunces',Georgia,serif;font-size:15px;font-weight:600;flex:1;min-width:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ixcv-preview .ps{font-size:11px;color:#8b8471;white-space:nowrap}
.ixcv-preview .px{appearance:none;border:0;font-size:16px;color:#8b8471;cursor:pointer;width:26px;height:26px;
  border-radius:6px;background:transparent !important}
.ixcv-preview .px:hover{background:#FAF9F5 !important;color:#28241c}
.ixcv-preview .pb{flex:1;min-height:0;overflow-y:auto;padding:16px;display:flex;justify-content:center;background:#fff !important}
.ixcv-preview img{max-width:100%;max-height:100%;object-fit:contain;border-radius:8px;align-self:center}
.ixcv-preview .ptext{max-width:680px;font-size:14px;line-height:1.65}
.ixcv-preview .pfoot{border-top:1px solid #eee9dc;padding:7px 16px;font-size:10.5px;color:#8b8471;
  font-style:italic;background:#FAF9F5 !important}

/* ── Stage 2 asset cards ─────────────────────────────────── */
.ixcv-root .ixcv-acard{border:1px solid var(--ixcv-border-soft);border-left:3px solid var(--tc,#3d6b9e);
  border-radius:8px;padding:9px 11px;background:#fff !important;transition:all .2s ease}
.ixcv-root .ixcv-acard:hover{border-color:var(--ixcv-blue);border-left-color:var(--tc,#3d6b9e)}
.ixcv-root .ixcv-abadge{font-size:9.5px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--tc,#3d6b9e)}
.ixcv-root .ixcv-atitle{font-family:'Fraunces',Georgia,serif;font-size:14px;font-weight:600;line-height:1.25;margin-top:3px}
.ixcv-root .ixcv-afoot{display:flex;align-items:center;gap:7px;margin-top:8px}

/* ── Stage 3 plan slots ──────────────────────────────────── */
.ixcv-root .ixcv-slot{display:flex;align-items:center;gap:9px;padding:8px 10px;border:1px solid var(--ixcv-border-soft);
  border-radius:8px;font-size:12px;background:#fff !important}
.ixcv-root .ixcv-slot .k{font-family:'DM Mono',monospace;font-size:10.5px;color:var(--ixcv-ink-3)}
.ixcv-root .ixcv-slot .v{font-weight:500;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ── shared: spinner · toast (single canonical) ──────────── */
.ixcv-spin{width:13px;height:13px;border-radius:50%;flex:none;border:2px solid rgba(0,0,0,.14);
  border-top-color:currentColor;animation:ixcvspin .7s linear infinite;display:inline-block}
@keyframes ixcvspin{to{transform:rotate(360deg)}}
.ixcv-toastrack{position:fixed;bottom:44px;right:20px;z-index:9200;display:flex;flex-direction:column;gap:8px;align-items:flex-end}
.ixcv-toast{display:flex;align-items:center;gap:9px;color:#fff;border-radius:10px;padding:10px 15px;
  font:500 12.5px/1.4 'DM Sans',sans-serif;box-shadow:0 10px 28px rgba(26,58,58,.3);max-width:380px;
  background:#1A3A3A !important;animation:ixcvin .22s ease}
.ixcv-toast[data-kind="warn"]{background:#7a5c1e !important}
.ixcv-toast[data-kind="fail"]{background:#6e2018 !important}
@keyframes ixcvin{from{transform:translateY(8px);opacity:0}to{transform:none;opacity:1}}
.ixcv-root .ixcv-refresh{margin-left:auto}
.ixcv-root .ixcv-loading{display:flex;align-items:center;gap:9px;justify-content:center;padding:26px;color:var(--ixcv-ink-3);font-size:12.5px;background:transparent !important}

/* ════════════════════════════════════════════════════════════════
   v0.1.1 COLOR PASS — appended layer (wins by cascade order at
   equal/greater specificity; all background rules keep the
   .ixcv-root .ixcv-* + !important chrome-war pattern)
   ════════════════════════════════════════════════════════════════ */

/* ── Lane identity accents ───────────────────────────────────
   01 Components = gold · 02 Assets = blue · 03 PubPlans = teal ·
   04 Newsletters = violet. --lc set per lane, consumed below. */
.ixcv-root .ixcv-lane[data-cvs-lane="cmp"]{--lc:#C4A35A;--lc-wash:rgba(196,163,90,.09)}
.ixcv-root .ixcv-lane[data-cvs-lane="ast"]{--lc:#5b7fff;--lc-wash:rgba(91,127,255,.07)}
.ixcv-root .ixcv-lane[data-cvs-lane="pln"]{--lc:#1f7a6d;--lc-wash:rgba(31,122,109,.08)}
.ixcv-root .ixcv-lane[data-cvs-lane="nls"]{--lc:#7a5ae0;--lc-wash:rgba(122,90,224,.07)}

.ixcv-root .ixcv-lane{border-top:3px solid var(--lc,var(--ixcv-border))}
.ixcv-root .ixcv-lane .ixcv-lane-head{
  background:linear-gradient(180deg,var(--lc-wash,transparent),rgba(255,255,255,0)) #fff !important}
.ixcv-root .ixcv-lane .ixcv-kick{color:var(--lc,var(--ixcv-ink-3))}
.ixcv-root .ixcv-lane-head h2{position:relative}

/* Active filter chips pick up the lane color instead of flat teal */
.ixcv-root .ixcv-lane .ixcv-chip[data-active="true"]{
  border-color:var(--lc,var(--ixcv-teal));background:var(--lc,var(--ixcv-teal)) !important}

/* Empty-lane copy sits on the lane wash so Stage 04 isn't a white void */
.ixcv-root .ixcv-lane[data-cvs-lane="nls"] .ixcv-body{
  background:linear-gradient(180deg,rgba(122,90,224,.04),rgba(255,255,255,0)) #fff !important}

/* ── Plan bar accent ─────────────────────────────────────────── */
.ixcv-root .ixcv-pb-title{box-shadow:inset 0 -2px 0 var(--ixcv-gold)}

/* ── Stage 2 · asset badges as tinted pills ─────────────────── */
.ixcv-root .ixcv-acard{border-left-width:4px}
.ixcv-root .ixcv-abadge{
  display:inline-block;padding:2px 8px;border-radius:20px;
  background:color-mix(in srgb, var(--tc,#3d6b9e) 12%, #fff) !important}
@supports not (background: color-mix(in srgb, red 10%, white)){
  .ixcv-root .ixcv-abadge{background:var(--ixcv-cream-warm) !important}
}

/* ── Stage 3 · section-colored slot pills ────────────────────
   Universal platform slot section codes (cosmetic color map —
   HC-CVS-005 candidate, tenant-independent):
   fa blue · ts violet · ba gold · tf pink · ev green · re rust ·
   sb slate. Keyed off data-sec emitted by JS v0.1.1. */
.ixcv-root .ixcv-slot .k{
  display:inline-block;min-width:44px;text-align:center;
  padding:3px 8px;border-radius:6px;font-weight:500;
  color:var(--sc,#5d5748);
  background:var(--sc-bg,var(--ixcv-cream-warm)) !important}
.ixcv-root .ixcv-slot[data-sec="fa"] .k{--sc:#3557c0;--sc-bg:rgba(74,111,212,.12)}
.ixcv-root .ixcv-slot[data-sec="ts"] .k{--sc:#6243c9;--sc-bg:rgba(122,90,224,.12)}
.ixcv-root .ixcv-slot[data-sec="ba"] .k{--sc:#8a6f35;--sc-bg:rgba(196,163,90,.16)}
.ixcv-root .ixcv-slot[data-sec="tf"] .k{--sc:#b0447f;--sc-bg:rgba(212,88,158,.12)}
.ixcv-root .ixcv-slot[data-sec="ev"] .k{--sc:#1a6b5f;--sc-bg:rgba(31,122,109,.12)}
.ixcv-root .ixcv-slot[data-sec="re"] .k{--sc:#a33a0f;--sc-bg:rgba(194,65,12,.12)}
.ixcv-root .ixcv-slot[data-sec="sb"] .k{--sc:#5d5748;--sc-bg:rgba(93,87,72,.12)}
/* Left accent on each slot row in its section color */
.ixcv-root .ixcv-slot{border-left:3px solid var(--sc,var(--ixcv-border-soft))}
.ixcv-root .ixcv-slot[data-sec="fa"]{--sc:#4a6fd4}
.ixcv-root .ixcv-slot[data-sec="ts"]{--sc:#7a5ae0}
.ixcv-root .ixcv-slot[data-sec="ba"]{--sc:#C4A35A}
.ixcv-root .ixcv-slot[data-sec="tf"]{--sc:#d4589e}
.ixcv-root .ixcv-slot[data-sec="ev"]{--sc:#1f7a6d}
.ixcv-root .ixcv-slot[data-sec="re"]{--sc:#c2410c}
.ixcv-root .ixcv-slot[data-sec="sb"]{--sc:#8b8471}
