/* Vordenk — Professionals as a terminal window (Claude Code look): traffic-light bar, chat tabs, "> " prompt,
   "●" replies, "⎿" tool lines, live "✻ Pondering… (12s · esc to interrupt)" status, diff colours, side panes.
   Everything is scoped to :root[data-mode="professionals"]; other modes are untouched. Works in dark and light. */

:root[data-mode="professionals"]{
  --pt-mono:ui-monospace,"SF Mono","JetBrains Mono",Menlo,Consolas,"Liberation Mono",monospace;
  --pt-green:#3fb950; --pt-red:#f85149; --pt-add:rgba(46,160,67,.28); --pt-del:rgba(248,81,73,.28); --pt-dim:var(--slate-500);
  --pt-yellow:#febc2e; --pt-r:#ff5f57; --pt-g:#28c840;
}
:root[data-mode="professionals"][data-pro-theme="light"]{ --pt-green:#1a7f37; --pt-red:#cf222e; --pt-add:rgba(46,160,67,.18); --pt-del:rgba(207,34,46,.16); }

/* ------------------------------------------------ window chrome (injected by vk-pro.js) */
.pt-chrome{ display:none; }
:root[data-mode="professionals"] .pt-chrome{ display:block; flex:none; background:var(--navy-800); border-bottom:1px solid var(--navy-700); user-select:none; }
.pt-title{ display:flex; align-items:center; gap:10px; padding:calc(8px + env(safe-area-inset-top)) 12px 6px; }
.pt-lights{ display:block; width:18px; height:18px; flex:none; }
.pt-lights svg{ display:block; width:100%; height:100%; overflow:visible; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.pt-lights g{ opacity:0; transform-box:fill-box; transform-origin:center; animation:pt-sym 7s linear infinite; }
.pt-lights .c0{ color:var(--pt-r); } .pt-lights .c1{ color:var(--pt-yellow); } .pt-lights .c2{ color:var(--pt-g); }
.pt-lights g:nth-child(1){ animation-delay:0.0s; }
.pt-lights g:nth-child(2){ animation-delay:0.7s; }
.pt-lights g:nth-child(3){ animation-delay:1.4s; }
.pt-lights g:nth-child(4){ animation-delay:2.1s; }
.pt-lights g:nth-child(5){ animation-delay:2.8s; }
.pt-lights g:nth-child(6){ animation-delay:3.5s; }
.pt-lights g:nth-child(7){ animation-delay:4.2s; }
.pt-lights g:nth-child(8){ animation-delay:4.9s; }
.pt-lights g:nth-child(9){ animation-delay:5.6s; }
.pt-lights g:nth-child(10){ animation-delay:6.3s; }
@keyframes pt-sym{ 0%{ opacity:0; transform:scale(.6); } 1.5%,8.5%{ opacity:1; transform:scale(1); } 10%,100%{ opacity:0; transform:scale(.6); } }
@media (prefers-reduced-motion:reduce){ .pt-lights g{ animation:none; } .pt-lights g:first-child{ opacity:1; } }
.pt-wtitle{ flex:1; min-width:0; text-align:center; font:500 12px/1 var(--pt-mono); color:var(--slate-400); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pt-split-btn{ appearance:none; flex:none; width:26px; height:22px; border-radius:5px; border:1px solid var(--navy-600); background:transparent; color:var(--slate-400); cursor:pointer; display:none; place-items:center; padding:0; }
.pt-split-btn svg{ width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; }
.pt-split-btn:hover, :root.pt-split .pt-split-btn{ color:var(--teal-300); border-color:var(--teal-400); }
@media (min-width:1000px){ .pt-split-btn{ display:grid; } }
.pt-tabs{ display:flex; gap:2px; padding:0 8px; overflow-x:auto; scrollbar-width:none; }
.pt-tabs::-webkit-scrollbar{ display:none; }
.pt-tab{
  appearance:none; flex:0 1 auto; max-width:170px; min-width:70px; height:26px; padding:0 12px; border:0; border-radius:6px 6px 0 0; cursor:pointer;
  background:transparent; color:var(--slate-500); font:500 11.5px/1 var(--pt-mono); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; text-align:center;
}
.pt-tab:hover{ color:var(--foam); background:rgba(127,127,127,.1); }
.pt-tab.on{ background:var(--navy-900); color:var(--foam); box-shadow:inset 0 1px 0 rgba(var(--accent-rgb),.55); }
.pt-tab.plus{ min-width:30px; max-width:30px; padding:0; font-size:15px; }

:root[data-mode="professionals"] .chat-header{ border-bottom:1px solid var(--navy-700); }
:root[data-mode="professionals"] #app{ border-radius:0; }
@media (min-width:700px){
  :root[data-mode="professionals"] #app{ border:1px solid var(--navy-700); border-radius:10px; height:calc(100dvh - 24px); margin-top:12px; overflow:hidden; box-shadow:0 30px 80px -30px rgba(0,0,0,.8); }
}

/* ------------------------------------------------ everything speaks in monospace */
:root[data-mode="professionals"] #chat-log,
:root[data-mode="professionals"] .composer-pill textarea,
:root[data-mode="professionals"] .pt-hint{ font-family:var(--pt-mono); }
:root[data-mode="professionals"] #chat-log{ gap:12px; }

/* you: a "> " prompt line on a quiet bar */
:root[data-mode="professionals"] .msg-user{
  max-width:100%; align-self:stretch; border-radius:3px; box-shadow:none; background:var(--navy-700); color:var(--foam);
  padding:5px 10px 5px 24px; position:relative; font:400 13px/1.55 var(--pt-mono); white-space:pre-wrap; overflow-wrap:anywhere;
}
:root[data-mode="professionals"] .msg-user::before{ content:">"; position:absolute; left:10px; top:5px; color:var(--pt-dim); }
:root[data-mode="professionals"] .msg-user .msg-text a{ color:var(--teal-300); }

/* Vordenk: a "●" bullet, plain text, no bubble */
:root[data-mode="professionals"] .msg-assistant:not(.msg-typing):not(.act-done){ position:relative; padding-left:18px; }
:root[data-mode="professionals"] .msg-assistant:not(.msg-typing):not(.act-done)::before{ content:"\25CF"; position:absolute; left:2px; top:0; font-size:11px; line-height:1.9; color:var(--foam); }
:root[data-mode="professionals"] .msg-assistant .msg-text{ font:400 13px/1.6 var(--pt-mono); letter-spacing:0; }
:root[data-mode="professionals"] .msg-assistant .msg-text h1, :root[data-mode="professionals"] .msg-assistant .msg-text h2, :root[data-mode="professionals"] .msg-assistant .msg-text h3{ font-size:13px; font-weight:700; margin:12px 0 4px; }
:root[data-mode="professionals"] .msg-assistant .msg-text ul{ list-style:none; padding-left:2px; }
:root[data-mode="professionals"] .msg-assistant .msg-text ul > li{ position:relative; padding-left:16px; }
:root[data-mode="professionals"] .msg-assistant .msg-text ul > li::before{ content:"\2013"; position:absolute; left:2px; color:var(--pt-dim); }
:root[data-mode="professionals"] .msg-assistant .msg-text :not(pre) > code{ font-family:var(--pt-mono); font-size:12.5px; padding:1px 5px; border-radius:3px; background:var(--navy-700); color:var(--teal-300); }
:root[data-mode="professionals"] .msg-assistant .msg-text table{ font-family:var(--pt-mono); font-size:12px; border-radius:3px; }
:root[data-mode="professionals"] .msg-assistant .msg-text pre{
  border-radius:3px; font:400 12.5px/1.55 var(--pt-mono); background:var(--navy-800); border:1px solid var(--navy-700); border-left:2px solid var(--teal-400);
}
.pt-ln{ display:block; margin:0 -1em; padding:0 1em; min-height:1.55em; }
.pt-ln.add{ background:var(--pt-add); } .pt-ln.del{ background:var(--pt-del); }

:root[data-mode="professionals"] .msg-actions{ opacity:.45; }
:root[data-mode="professionals"] .msg-took{ font-family:var(--pt-mono); font-size:11px; }

/* ------------------------------------------------ work log: ● Read(file)  ⎿ detail */
:root[data-mode="professionals"] .act-feed{ margin:0; }
:root[data-mode="professionals"] .act-list{ gap:3px; }
:root[data-mode="professionals"] .act-step{ font:400 12.5px/1.5 var(--pt-mono); gap:8px; color:var(--slate-400); align-items:baseline; }
:root[data-mode="professionals"] .act-ic{ display:none; }
:root[data-mode="professionals"] .act-step::before{ content:"\25CF"; flex:none; font-size:10px; color:var(--pt-green); transform:translateY(-1px); }
:root[data-mode="professionals"] .act-step.act-run::before{ color:var(--teal-400); }
:root[data-mode="professionals"] .act-body{ flex-direction:row; flex-wrap:wrap; align-items:baseline; gap:0 4px; }
:root[data-mode="professionals"] .act-text{ font-weight:700; color:var(--foam); }
:root[data-mode="professionals"] .act-arg{ color:var(--slate-400); overflow-wrap:anywhere; }
:root[data-mode="professionals"] .act-detail{ flex-basis:100%; background:none; padding:0 0 0 14px; font:400 12px/1.5 var(--pt-mono); color:var(--pt-dim); position:relative; }
:root[data-mode="professionals"] .act-detail::before{ content:"\23BF"; position:absolute; left:0; }
:root[data-mode="professionals"] .act-done{ font-family:var(--pt-mono); font-size:12px; }
:root[data-mode="professionals"] .act-done > summary{ font-weight:500; }
:root[data-mode="professionals"] .act-done > summary::before{ content:"\25B8"; color:var(--pt-green); }

/* ✻ Pondering… (12s · esc to interrupt) */
:root[data-mode="professionals"] .msg-typing .typing-label,
:root[data-mode="professionals"] .msg-typing .think-dots,
:root[data-mode="professionals"] .msg-typing .think-spin,
:root[data-mode="professionals"] .msg-typing .typing-time{ display:none; }
.pt-status{ display:none; }
:root[data-mode="professionals"] .pt-status{ display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; font:400 12.5px/1.5 var(--pt-mono); margin-top:4px; color:var(--teal-300); }
.pt-star{ display:inline-block; width:1.1em; text-align:center; color:var(--teal-400); }
.pt-verb{ font-weight:600; }
.pt-meta{ color:var(--pt-dim); }
:root[data-mode="professionals"] .msg-typing{ animation:none; }

/* ------------------------------------------------ prompt box + shortcuts row */
:root[data-mode="professionals"] .composer-pill{ border-radius:4px; border:1px solid var(--navy-600); background:transparent; box-shadow:none; }
:root[data-mode="professionals"] .composer-pill:focus-within{ border-color:var(--teal-400); }
:root[data-mode="professionals"] .composer-pill textarea{ font-size:13.5px; caret-shape:block; caret-color:var(--teal-300); }
:root[data-mode="professionals"] .composer-pill textarea::placeholder{ color:var(--pt-dim); }
.pt-hint{ display:none; }
:root[data-mode="professionals"] .pt-hint{
  display:flex; justify-content:space-between; gap:12px; padding:5px 14px 0; font-size:11.5px; color:var(--pt-dim); white-space:nowrap; overflow:hidden;
}
.pt-hint span{ overflow:hidden; text-overflow:ellipsis; }
.pt-hint button{ all:unset; flex:none; cursor:pointer; color:inherit; }
.pt-hint button:hover, .pt-hint button:focus-visible{ color:var(--teal-300); text-decoration:underline; }

/* ------------------------------------------------ side panes (split view, wide screens) */
.pt-panes{ display:none; }
@media (min-width:1000px){
  :root[data-mode="professionals"].pt-split .pt-panes{ display:block; }
}
.pt-pane{
  position:fixed; top:12px; bottom:12px; display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--navy-700); border-radius:10px;
  background:var(--navy-900); box-shadow:0 20px 60px -30px rgba(0,0,0,.8); cursor:pointer; z-index:2; transition:border-color .2s, transform .2s;
  font-family:var(--pt-mono); color:var(--foam);
}
.pt-pane:hover{ border-color:var(--teal-400); }
.pt-pane-h{ flex:none; display:flex; align-items:center; gap:8px; padding:8px 12px; background:var(--navy-800); border-bottom:1px solid var(--navy-700); font-size:11.5px; color:var(--slate-400); }
.pt-pane-h i{ width:9px; height:9px; border-radius:50%; background:var(--pt-r); box-shadow:14px 0 0 var(--pt-yellow), 28px 0 0 var(--pt-g); margin-right:32px; flex:none; }
.pt-pane-h span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pt-pane-b{ flex:1; overflow:hidden; padding:10px 12px; font-size:12px; line-height:1.55; -webkit-mask-image:linear-gradient(transparent, #000 14%); mask-image:linear-gradient(transparent, #000 14%); display:flex; flex-direction:column; justify-content:flex-end; gap:8px; }
.pt-pane-b .u{ background:var(--navy-700); padding:2px 8px; border-radius:3px; white-space:pre-wrap; overflow-wrap:anywhere; }
.pt-pane-b .u::before{ content:"> "; color:var(--pt-dim); }
.pt-pane-b .a{ padding-left:14px; position:relative; white-space:pre-wrap; overflow-wrap:anywhere; color:var(--slate-400); }
.pt-pane-b .a::before{ content:"\25CF"; position:absolute; left:0; font-size:9px; line-height:2; color:var(--foam); }
.pt-pane-foot{ flex:none; padding:6px 12px; font-size:11px; color:var(--pt-dim); border-top:1px solid var(--navy-700); }

@media (prefers-reduced-motion:reduce){ .pt-star{ animation:none; } }