/* Vordenk — Professionals terminal colours, sampled from the reference screenshot (dark terminal, cream text, red/green diff blocks, gold + salmon accents). Load AFTER vk-pro.css. Scoped to Professionals, dark theme only; the light theme keeps its own colours. Backgrounds / diff blocks are measured values; thin-text colours are the closest match the anti-aliased screenshot allows. */ :root[data-mode="professionals"]:not([data-pro-theme="light"]){ --pt-bg:#282828; /* terminal body */ --pt-bar:#30302e; /* title bar */ --pt-tab:#363430; /* active tab */ --pt-rule:#3c3c3c; /* pane dividers */ --pt-box:#5b5b5b; /* prompt box border */ --pt-text:#e5e1d5; /* body text (cream) */ --pt-bold:#efead9; /* bold text, e.g. "Verdict:" */ --pt-dim:#999999; /* dim / italic "Thinking…" / line numbers */ --pt-gold:#d4c17e; /* "Bypassing Permissions" */ --pt-caret:#ebe4c9; /* block cursor */ --pt-salmon:#d4856f; /* ✻ Elucidating… spinner */ --pt-path-g:#8fc79b; /* git branch / path, green */ --pt-path-r:#e0788a; /* git branch / path, ruby-pink */ --pt-ruby:#d4707a; /* ruby version */ --pt-cyan:#b4f0fc; /* 💎 */ --pt-add:#225c2a; /* diff added line */ --pt-del:#7a2a37; /* diff removed line */ --pt-add-w:#38a662; /* diff added word */ --pt-del-w:#b4586c; /* diff removed word */ --pt-green:var(--pt-path-g); --pt-red:var(--pt-path-r); /* re-point the site's own tokens so every Professionals rule picks the terminal palette up */ --navy-900:var(--pt-bg); --navy-800:var(--pt-bg); --navy-700:var(--pt-rule); --navy-600:var(--pt-box); --foam:var(--pt-text); --slate-400:var(--pt-dim); --slate-500:var(--pt-dim); --teal-400:var(--pt-gold); --teal-300:var(--pt-gold); --accent-rgb:212,193,126; } :root[data-mode="professionals"]:not([data-pro-theme="light"]) body, :root[data-mode="professionals"]:not([data-pro-theme="light"]) #app, :root[data-mode="professionals"]:not([data-pro-theme="light"]) #stage-chat, :root[data-mode="professionals"]:not([data-pro-theme="light"]) .chat-log-wrap{ background:var(--pt-bg); color:var(--pt-text); } :root[data-mode="professionals"]:not([data-pro-theme="light"]) .pt-chrome{ background:var(--pt-bar); border-bottom-color:var(--pt-rule); } :root[data-mode="professionals"]:not([data-pro-theme="light"]) .pt-tab.on{ background:var(--pt-tab); box-shadow:none; } :root[data-mode="professionals"]:not([data-pro-theme="light"]) .msg-user{ background:var(--pt-tab); } :root[data-mode="professionals"]:not([data-pro-theme="light"]) .msg-assistant .msg-text strong{ color:var(--pt-bold); text-decoration:none; } :root[data-mode="professionals"]:not([data-pro-theme="light"]) .msg-assistant .msg-text em{ color:var(--pt-dim); } :root[data-mode="professionals"]:not([data-pro-theme="light"]) .composer-pill{ border-color:var(--pt-box); } :root[data-mode="professionals"]:not([data-pro-theme="light"]) .composer-pill textarea{ caret-color:var(--pt-caret); color:var(--pt-text); } :root[data-mode="professionals"]:not([data-pro-theme="light"]) .pt-star, :root[data-mode="professionals"]:not([data-pro-theme="light"]) .pt-status{ color:var(--pt-salmon); } :root[data-mode="professionals"]:not([data-pro-theme="light"]) .pt-hint button{ color:var(--pt-gold); } /* code blocks: same body as the terminal, no frame; numbered lines; solid red / green diff rows */ :root[data-mode="professionals"]:not([data-pro-theme="light"]) .msg-assistant .msg-text pre{ background:var(--pt-bg); border:0; border-radius:0; color:var(--pt-text); counter-reset:ptl; } :root[data-mode="professionals"]:not([data-pro-theme="light"]) .msg-assistant .msg-text :not(pre) > code{ background:var(--pt-tab); color:var(--pt-text); } :root[data-mode="professionals"]:not([data-pro-theme="light"]) .pt-ln{ counter-increment:ptl; position:relative; padding-left:3.2em; } :root[data-mode="professionals"]:not([data-pro-theme="light"]) .pt-ln::before{ content:counter(ptl); position:absolute; left:0; width:2.2em; text-align:right; color:var(--pt-dim); opacity:.85; } :root[data-mode="professionals"]:not([data-pro-theme="light"]) .pt-ln.add{ background:var(--pt-add); } :root[data-mode="professionals"]:not([data-pro-theme="light"]) .pt-ln.del{ background:var(--pt-del); } :root[data-mode="professionals"]:not([data-pro-theme="light"]) .pt-ln.add::before{ content:counter(ptl) " +"; } :root[data-mode="professionals"]:not([data-pro-theme="light"]) .pt-ln.del::before{ content:"-"; } :root[data-mode="professionals"]:not([data-pro-theme="light"]) .pt-w-add{ background:var(--pt-add-w); color:#fff; } :root[data-mode="professionals"]:not([data-pro-theme="light"]) .pt-w-del{ background:var(--pt-del-w); color:#fff; } :root[data-mode="professionals"]:not([data-pro-theme="light"]) .pt-pane{ background:var(--pt-bg); border-color:var(--pt-rule); } :root[data-mode="professionals"]:not([data-pro-theme="light"]) .pt-pane-h{ background:var(--pt-bar); border-color:var(--pt-rule); } /* system surfaces (settings, menus, dialogs, Help library) are NOT recoloured here: they keep the fixed teal + gold system colours in every mode (see vk-dialogs.css / vk-system.css) */ :root[data-mode="professionals"]:not([data-pro-theme="light"]) :is(.btn-secondary,.btn-ghost):not(:is(.overlay,.settings-panel,.vkd-back,.vkp-plug,.vkp-sbx,.vk-del-back,.vk-sbx-back,.storage-notice,.composer-menu,.style-menu,.tag-menu,.camera-menu,.vkv-back,.vk-t-ov,.download-menu,.source-pop,.vkh,.source-modes,.model-overlay) *){ background:var(--pt-bar); border-color:var(--pt-rule); color:var(--pt-text); } :root[data-mode="professionals"]:not([data-pro-theme="light"]) :is(.btn-secondary,.btn-ghost):not(:is(.overlay,.settings-panel,.vkd-back,.vkp-plug,.vkp-sbx,.vk-del-back,.vk-sbx-back,.storage-notice,.composer-menu,.style-menu,.tag-menu,.camera-menu,.vkv-back,.vk-t-ov,.download-menu,.source-pop,.vkh,.source-modes,.model-overlay) *):hover{ border-color:var(--pt-gold); } :root[data-mode="professionals"]:not([data-pro-theme="light"]) :is(.btn-primary,.btn-send,.mode-go,.btn-tiny.mode-go):not(:is(.overlay,.settings-panel,.vkd-back,.vkp-plug,.vkp-sbx,.vk-del-back,.vk-sbx-back,.storage-notice,.composer-menu,.style-menu,.tag-menu,.camera-menu,.vkv-back,.vk-t-ov,.download-menu,.source-pop,.vkh,.source-modes,.model-overlay) *){ color:var(--pt-bg); } :root[data-mode="professionals"]:not([data-pro-theme="light"]) select:not(:is(.overlay,.settings-panel,.vkd-back,.vkp-plug,.vkp-sbx,.vk-del-back,.vk-sbx-back,.storage-notice,.composer-menu,.style-menu,.tag-menu,.camera-menu,.vkv-back,.vk-t-ov,.download-menu,.source-pop,.vkh,.source-modes,.model-overlay) *), :root[data-mode="professionals"]:not([data-pro-theme="light"]) input:not(:is(.overlay,.settings-panel,.vkd-back,.vkp-plug,.vkp-sbx,.vk-del-back,.vk-sbx-back,.storage-notice,.composer-menu,.style-menu,.tag-menu,.camera-menu,.vkv-back,.vk-t-ov,.download-menu,.source-pop,.vkh,.source-modes,.model-overlay) *), :root[data-mode="professionals"]:not([data-pro-theme="light"]) textarea:not(:is(.overlay,.settings-panel,.vkd-back,.vkp-plug,.vkp-sbx,.vk-del-back,.vk-sbx-back,.storage-notice,.composer-menu,.style-menu,.tag-menu,.camera-menu,.vkv-back,.vk-t-ov,.download-menu,.source-pop,.vkh,.source-modes,.model-overlay) *){ background:var(--pt-bar); border-color:var(--pt-rule); color:var(--pt-text); } :root[data-mode="professionals"]:not([data-pro-theme="light"]) ::selection{ background:rgba(212,193,126,.35); color:#fff; } :root[data-mode="professionals"]:not([data-pro-theme="light"]) ::-webkit-scrollbar-thumb{ background:var(--pt-box); } /* ============ light theme: same structure, paper-cream version of the terminal palette ============ */ :root[data-mode="professionals"][data-pro-theme="light"]{ --pt-bg:#f7f3e8; /* terminal body */ --pt-bar:#ebe6d8; /* title bar */ --pt-tab:#f7f3e8; /* active tab */ --pt-rule:#d9d3c1; /* pane dividers */ --pt-box:#b9b2a0; /* prompt box border */ --pt-text:#282828; /* body text (cream) */ --pt-bold:#111111; /* bold text, e.g. "Verdict:" */ --pt-dim:#7a776d; /* dim / italic "Thinking…" / line numbers */ --pt-gold:#8a6d1a; /* "Bypassing Permissions" */ --pt-caret:#282828; /* block cursor */ --pt-salmon:#c0583f; /* ✻ Elucidating… spinner */ --pt-path-g:#2f7d4a; /* git branch / path, green */ --pt-path-r:#b83a52; /* git branch / path, ruby-pink */ --pt-ruby:#b8323f; /* ruby version */ --pt-cyan:#2a8fb0; /* 💎 */ --pt-add:#cfeadb; /* diff added line */ --pt-del:#f6d3d9; /* diff removed line */ --pt-add-w:#6cc58b; /* diff added word */ --pt-del-w:#ee95a6; /* diff removed word */ --pt-green:var(--pt-path-g); --pt-red:var(--pt-path-r); /* re-point the site's own tokens so every Professionals rule picks the terminal palette up */ --navy-900:var(--pt-bg); --navy-800:var(--pt-bg); --navy-700:var(--pt-rule); --navy-600:var(--pt-box); --foam:var(--pt-text); --slate-400:var(--pt-dim); --slate-500:var(--pt-dim); --teal-400:var(--pt-gold); --teal-300:var(--pt-gold); --accent-rgb:138,109,26; } :root[data-mode="professionals"][data-pro-theme="light"] body, :root[data-mode="professionals"][data-pro-theme="light"] #app, :root[data-mode="professionals"][data-pro-theme="light"] #stage-chat, :root[data-mode="professionals"][data-pro-theme="light"] .chat-log-wrap{ background:var(--pt-bg); color:var(--pt-text); } :root[data-mode="professionals"][data-pro-theme="light"] .pt-chrome{ background:var(--pt-bar); border-bottom-color:var(--pt-rule); } :root[data-mode="professionals"][data-pro-theme="light"] .pt-tab.on{ background:var(--pt-tab); box-shadow:none; } :root[data-mode="professionals"][data-pro-theme="light"] .msg-user{ background:var(--pt-tab); } :root[data-mode="professionals"][data-pro-theme="light"] .msg-assistant .msg-text strong{ color:var(--pt-bold); text-decoration:none; } :root[data-mode="professionals"][data-pro-theme="light"] .msg-assistant .msg-text em{ color:var(--pt-dim); } :root[data-mode="professionals"][data-pro-theme="light"] .composer-pill{ border-color:var(--pt-box); } :root[data-mode="professionals"][data-pro-theme="light"] .composer-pill textarea{ caret-color:var(--pt-caret); color:var(--pt-text); } :root[data-mode="professionals"][data-pro-theme="light"] .pt-star, :root[data-mode="professionals"][data-pro-theme="light"] .pt-status{ color:var(--pt-salmon); } :root[data-mode="professionals"][data-pro-theme="light"] .pt-hint button{ color:var(--pt-gold); } /* code blocks: same body as the terminal, no frame; numbered lines; solid red / green diff rows */ :root[data-mode="professionals"][data-pro-theme="light"] .msg-assistant .msg-text pre{ background:var(--pt-bg); border:0; border-radius:0; color:var(--pt-text); counter-reset:ptl; } :root[data-mode="professionals"][data-pro-theme="light"] .msg-assistant .msg-text :not(pre) > code{ background:var(--pt-tab); color:var(--pt-text); } :root[data-mode="professionals"][data-pro-theme="light"] .pt-ln{ counter-increment:ptl; position:relative; padding-left:3.2em; } :root[data-mode="professionals"][data-pro-theme="light"] .pt-ln::before{ content:counter(ptl); position:absolute; left:0; width:2.2em; text-align:right; color:var(--pt-dim); opacity:.85; } :root[data-mode="professionals"][data-pro-theme="light"] .pt-ln.add{ background:var(--pt-add); } :root[data-mode="professionals"][data-pro-theme="light"] .pt-ln.del{ background:var(--pt-del); } :root[data-mode="professionals"][data-pro-theme="light"] .pt-ln.add::before{ content:counter(ptl) " +"; } :root[data-mode="professionals"][data-pro-theme="light"] .pt-ln.del::before{ content:"-"; } :root[data-mode="professionals"][data-pro-theme="light"] .pt-w-add{ background:var(--pt-add-w); color:#10331c; } :root[data-mode="professionals"][data-pro-theme="light"] .pt-w-del{ background:var(--pt-del-w); color:#4a1020; } :root[data-mode="professionals"][data-pro-theme="light"] .pt-pane{ background:var(--pt-bg); border-color:var(--pt-rule); } :root[data-mode="professionals"][data-pro-theme="light"] .pt-pane-h{ background:var(--pt-bar); border-color:var(--pt-rule); } /* system surfaces (settings, menus, dialogs, Help library) are NOT recoloured here: they keep the fixed teal + gold system colours in every mode (see vk-dialogs.css / vk-system.css) */ :root[data-mode="professionals"][data-pro-theme="light"] :is(.btn-secondary,.btn-ghost):not(:is(.overlay,.settings-panel,.vkd-back,.vkp-plug,.vkp-sbx,.vk-del-back,.vk-sbx-back,.storage-notice,.composer-menu,.style-menu,.tag-menu,.camera-menu,.vkv-back,.vk-t-ov,.download-menu,.source-pop,.vkh,.source-modes,.model-overlay) *){ background:var(--pt-bar); border-color:var(--pt-rule); color:var(--pt-text); } :root[data-mode="professionals"][data-pro-theme="light"] :is(.btn-secondary,.btn-ghost):not(:is(.overlay,.settings-panel,.vkd-back,.vkp-plug,.vkp-sbx,.vk-del-back,.vk-sbx-back,.storage-notice,.composer-menu,.style-menu,.tag-menu,.camera-menu,.vkv-back,.vk-t-ov,.download-menu,.source-pop,.vkh,.source-modes,.model-overlay) *):hover{ border-color:var(--pt-gold); } :root[data-mode="professionals"][data-pro-theme="light"] :is(.btn-primary,.btn-send,.mode-go,.btn-tiny.mode-go):not(:is(.overlay,.settings-panel,.vkd-back,.vkp-plug,.vkp-sbx,.vk-del-back,.vk-sbx-back,.storage-notice,.composer-menu,.style-menu,.tag-menu,.camera-menu,.vkv-back,.vk-t-ov,.download-menu,.source-pop,.vkh,.source-modes,.model-overlay) *){ color:#fffdf4; } :root[data-mode="professionals"][data-pro-theme="light"] select:not(:is(.overlay,.settings-panel,.vkd-back,.vkp-plug,.vkp-sbx,.vk-del-back,.vk-sbx-back,.storage-notice,.composer-menu,.style-menu,.tag-menu,.camera-menu,.vkv-back,.vk-t-ov,.download-menu,.source-pop,.vkh,.source-modes,.model-overlay) *), :root[data-mode="professionals"][data-pro-theme="light"] input:not(:is(.overlay,.settings-panel,.vkd-back,.vkp-plug,.vkp-sbx,.vk-del-back,.vk-sbx-back,.storage-notice,.composer-menu,.style-menu,.tag-menu,.camera-menu,.vkv-back,.vk-t-ov,.download-menu,.source-pop,.vkh,.source-modes,.model-overlay) *), :root[data-mode="professionals"][data-pro-theme="light"] textarea:not(:is(.overlay,.settings-panel,.vkd-back,.vkp-plug,.vkp-sbx,.vk-del-back,.vk-sbx-back,.storage-notice,.composer-menu,.style-menu,.tag-menu,.camera-menu,.vkv-back,.vk-t-ov,.download-menu,.source-pop,.vkh,.source-modes,.model-overlay) *){ background:var(--pt-bar); border-color:var(--pt-rule); color:var(--pt-text); } :root[data-mode="professionals"][data-pro-theme="light"] ::selection{ background:rgba(138,109,26,.3); color:#111; } :root[data-mode="professionals"][data-pro-theme="light"] ::-webkit-scrollbar-thumb{ background:var(--pt-box); } :root[data-mode="professionals"]:not([data-pro-theme="light"]) .scroll-bottom-btn{ background:var(--pt-bar); border-color:var(--pt-rule); color:var(--pt-text); } :root[data-mode="professionals"][data-pro-theme="light"] .scroll-bottom-btn{ background:var(--pt-bar); border-color:var(--pt-rule); color:var(--pt-text); } :root[data-mode="professionals"]:not([data-pro-theme="light"]) .composer-pill textarea, :root[data-mode="professionals"]:not([data-pro-theme="light"]) .composer-pill input{ background:transparent; border:0; } :root[data-mode="professionals"][data-pro-theme="light"] .composer-pill textarea, :root[data-mode="professionals"][data-pro-theme="light"] .composer-pill input{ background:transparent; border:0; } /* no rainbow / glow rings in the terminal: they are tinted and the terminal is flat */ :root[data-mode="professionals"] .composer-pill::after, :root[data-mode="professionals"] #chat-form::after, :root[data-mode="professionals"] .msg-user.msg-rainbow::after{ display:none !important; } :root[data-mode="professionals"] .rainbow-fx{ display:none !important; } :root[data-mode="professionals"] :is(.btn-send,.btn-secondary,.icon-btn,.scroll-bottom-btn,.btn-primary)::before{ display:none !important; }