/* Vordenk — Professionals code cards (see vk-code.js): a header bar over every code block, and a tray under the reply. */
.vkc-head, .vkc-tray{ display:none; }
:root[data-mode="professionals"] .vkc{
  position:relative; margin:8px 0; border:1px solid var(--navy-700); border-left:2px solid var(--teal-400); border-radius:6px; background:var(--navy-800); overflow:visible;
}
:root[data-mode="professionals"] .vkc-head{
  display:flex; align-items:center; gap:6px; min-height:34px; padding:3px 6px 3px 4px; background:var(--navy-900); border-bottom:1px solid var(--navy-700);
  font:500 12px/1.2 var(--pt-mono); border-radius:5px 5px 0 0;
}
:root[data-mode="professionals"] .vkc.closed .vkc-head{ border-bottom:0; }
:root[data-mode="professionals"] .vkc-lab{
  flex:1 1 auto; min-width:0; display:flex; align-items:baseline; gap:7px; padding:5px 6px; background:none; border:0; border-radius:4px;
  color:var(--foam); font:inherit; text-align:start; cursor:pointer;
}
:root[data-mode="professionals"] .vkc-lab:hover{ background:var(--navy-700); }
.vkc-caret{ flex:none; color:var(--pt-dim); transition:transform .15s; font-size:11px; }
.vkc.closed .vkc-caret{ transform:rotate(-90deg); }
.vkc-name{ font-weight:700; color:var(--foam); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0; }
.vkc-meta{ flex:none; color:var(--pt-dim); font-weight:400; font-size:11px; white-space:nowrap; }
.vkc-acts{ flex:none; display:flex; align-items:center; gap:4px; }
:root[data-mode="professionals"] .vkc-b, :root[data-mode="professionals"] .vkc .code-run-btn.vkc-b{
  position:static; display:inline-flex; align-items:center; min-height:26px; padding:3px 9px; border-radius:5px;
  border:1px solid var(--navy-600); background:var(--navy-800); color:var(--foam); font:500 11.5px/1 var(--pt-mono); cursor:pointer; white-space:nowrap;
}
:root[data-mode="professionals"] .vkc-b:hover{ background:var(--navy-700); color:var(--teal-300); }
:root[data-mode="professionals"] .vkc-b[aria-pressed="true"], :root[data-mode="professionals"] .vkc-b.vkc-go{ border-color:var(--teal-400); color:var(--teal-300); background:rgba(var(--accent-rgb),.12); }
:root[data-mode="professionals"] .vkc pre{ margin:0 !important; border:0 !important; border-radius:0 !important; background:transparent !important; max-height:360px; overflow:auto; }
:root[data-mode="professionals"] .vkc pre.code-runnable{ padding-top:10px; }
:root[data-mode="professionals"] .vkc.closed pre{ display:none; }
:root[data-mode="professionals"] .vkc.picked{ border-color:var(--teal-400); box-shadow:0 0 0 1px rgba(var(--accent-rgb),.35); }
:root[data-mode="professionals"] .vkc .code-sandbox-frame{ display:block; width:100%; border:0; border-top:1px solid var(--navy-700); background:#fff; min-height:200px; }

.vkc-menu{
  position:absolute; right:6px; top:36px; z-index:5; min-width:190px; padding:3px; display:flex; flex-direction:column; gap:2px;
  background:var(--navy-900); border:1px solid var(--navy-600); border-radius:8px; box-shadow:0 14px 30px -14px rgba(0,0,0,.75);
}
.vkc-mi{ padding:6px 10px; border:0; border-radius:5px; background:none; color:var(--foam); font:500 12px/1.2 var(--pt-mono); text-align:start; cursor:pointer; white-space:nowrap; }
.vkc-mi:hover{ background:var(--navy-700); color:var(--teal-300); }

:root[data-mode="professionals"] .vkc-tray{
  display:flex; flex-wrap:wrap; align-items:center; gap:5px; margin:4px 0 2px; padding:5px 6px; border:1px solid var(--navy-700); border-radius:6px; background:var(--navy-900);
}
.vkc-count{ flex:1 1 100%; color:var(--pt-dim); font:400 11.5px/1.3 var(--pt-mono); padding:0 2px; }
@media (min-width:520px){ .vkc-count{ flex:1 1 auto; } }
@media (max-width:420px){
  :root[data-mode="professionals"] .vkc-meta{ display:none; }
  :root[data-mode="professionals"] .vkc-b{ padding:3px 7px !important; }
}