/* ============================================================
ProfitData — Common styles
============================================================ */
/* Тёмная тема — ЧЁРНО-БЕЛАЯ. С 13 сентября 2026 по просьбе владельца («уход в
чб… где-то остался синий»): синевы нет ни в подложках, ни в буквах, ни в
выделении. Одна тема на весь продукт — и сайт, и платформа, и график берут
один и тот же чёрный и один и тот же белый.
Селектор [data-theme="black"] оставлен псевдонимом, чтобы не сломать
сохранённый в браузере выбор. */
:root, [data-theme="dark"], [data-theme="black"] {
/* ── ТЁМНАЯ ТЕМА: БЕЛЕЕ И ЯРЧЕ ──
Владелец попросил убрать голубизну и поднять яркость. Синева сидела не в
одном месте, а в трёх сразу: в подложках (#111827 и #1c2030 — это синий,
а не серый), в приглушённом тексте (#9ca8ba, #4a5568) и в градиенте с
бирюзовым концом. Поэтому подложки переведены в НЕЙТРАЛЬНЫЙ серый, а
текст поднят по яркости — особенно --text3, который был так тёмен, что
подписи под числами читались с трудом. */
/* Самый нижний слой тоже был синим: #060810 — это r6 g8 b16, синева видна
на больших площадях (график, рабочий стол) как холодный налёт, хотя по
отдельной точке кажется чёрным. Нейтральный чёрный. */
--bg: #08080b;
--bg2: #0d0d10;
--bg3: #15161d;
--bg4: #23252e;
--border: rgba(255,255,255,.10);
--text: #f4f5f7;
--text2: #c2c7cf;
--text3: #838b96;
--green: #2dd8a3;
--red: #f75a5a;
--yellow: #f9c74f;
/* ── БЕЗ СИНЕГО ВООБЩЕ ──
Владелец: «уход в чб ты сделал не на всем сайте, где-то остался синий».
Синий сидел в самом ПОНЯТИИ «выделенное»: ссылки, активные вкладки,
кольцо фокуса, ползунки — всё красилось --accent #1a6cf5. Теперь
выделенное — это СВЕТЛОЕ, а не синее. Ссылку в тексте отличает
подчёркивание (см. ниже): цветом её больше не отличить, и без
подчёркивания она слилась бы с текстом. */
--blue: #c6c6ca;
--accent: #e8e8ea;
/* Цвет первого ряда на графике: одиночная линия рисуется им. Светлый на
тёмном, тёмный на светлом — см. js/pine/chart.js. */
--series-1: #d8d8dc;
--accent-hover: #ffffff;
--radius: 8px;
--font: 'Inter', 'Segoe UI', system-ui, sans-serif;
/* Display face, echoing the logo's wordmark. Deliberately NOT used for body
copy, tables or prices: Jost's figures are geometric and non-tabular, and
this site is dense with numbers, where Inter is the more legible choice. */
/* Sora первой: она повторяет скруглённо-квадратную геометрию знака, тогда
как Jost — это Futura с кругами, и владелец справедливо назвал её чужой.
Jost оставлен ВТОРЫМ, а не выброшен: кириллицы у Sora нет, и русский
заголовок возьмёт его, а не свалится в Inter. См. css/fonts/sora.css. */
--font-display: 'Sora', 'Jost', 'Century Gothic', 'Futura', 'Inter', system-ui, sans-serif;
--header-h: 68px; /* сайтовая шапка; терминал ниже возвращает 42 */
}
/* Шапка — стекло: сквозь неё видно, что страница под ней прокручивается. */
[data-theme="dark"] .app-header { background: var(--glass-bg);
backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur);
border-bottom-color: var(--glass-line); }
/* Рабочие поверхности держали СВОЙ белый — синеватый #e2e6f0. Он и оказался
самой стойкой синевой на сайте: не заливка и не рамка, а цвет БУКВ, то есть
добрая половина заметных пикселей. 13 сентября владелец попросил чёрно-белое
на всём сайте, и это исключение отменяется — белый теперь один на весь
продукт. */
/* ── Light theme ── */
[data-theme="light"] {
--bg: #f5f6f8;
--bg2: #ebedf2;
--bg3: #dfe2e8;
--bg4: #cdd1da;
--border: rgba(0,0,0,.1);
--text: #1a1d26;
--text2: #2d3342;
--text3: #7a8294;
--green: #089981;
--red: #f23645;
--yellow: #d4960a;
--accent: #2563eb;
--series-1: #3f3f46;
--accent-hover: #1d4fd8;
}
[data-theme="light"] .app-header { box-shadow: 0 1px 3px rgba(0,0,0,.08); }
[data-theme="light"] .btn { border-color: rgba(0,0,0,.12); }
[data-theme="light"] .btn-primary { background: rgba(0,0,0,.05); color: var(--text); }
[data-theme="light"] .btn-primary:hover { background: rgba(0,0,0,.1); }
[data-theme="light"] .u-under { background: var(--bg); }
[data-theme="light"] .u-cursor-x { border-right: 1px solid rgba(0,0,0,.12); }
[data-theme="light"] .u-cursor-y { border-bottom: 1px solid rgba(0,0,0,.12); }
/* Theme toggle group */
.theme-group {
display: flex; align-items: center; gap: 2px;
background: var(--bg3); border-radius: 6px; padding: 2px;
}
.theme-toggle {
width: 32px; height: 32px; border: none; border-radius: 5px;
background: transparent; color: var(--text3); cursor: pointer;
display: flex; align-items: center; justify-content: center;
transition: all .15s;
}
.theme-toggle:hover { color: var(--text2); }
.theme-toggle.active { background: var(--bg); color: var(--text); box-shadow: 0 1px 3px rgba(0,0,0,.2); }
/* theme group visible on all screen sizes */
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }
body {
background: var(--bg);
color: var(--text);
font-family: var(--font);
font-size: 13px;
line-height: 1.5;
-webkit-font-smoothing: antialiased;
}
a { color: var(--accent); text-decoration: none; }
/* ── ССЫЛКА В ТЕКСТЕ ПОДЧЁРКИВАЕТСЯ ──
Пока ссылки были синими, их отличал цвет. В чёрно-белом отличать нечем:
ссылка того же цвета, что и текст вокруг, — это просто текст. Подчёркивание
возвращает ей вид ссылки. Берём ТОЛЬКО ссылки внутри прозы (абзац, список):
пункты меню и карточки — тоже , и подчёркивать их незачем. */
p a, li a { text-decoration: underline; text-underline-offset: .18em;
text-decoration-thickness: 1px;
text-decoration-color: color-mix(in srgb, currentColor 45%, transparent); }
p a:hover, li a:hover { text-decoration-color: currentColor; }
button { cursor: pointer; font-family: var(--font); }
.green { color: var(--green) !important; }
.red { color: var(--red) !important; }
.yellow { color: var(--yellow) !important; }
.muted { color: var(--text2) !important; }
.up { color: var(--green) !important; }
.down { color: var(--red) !important; }
/* ── HEADER ──
Платформа и график — рабочие поверхности, там каждый пиксель по вертикали
уходит из графика, поэтому шапка у них остаётся прежней высоты. Воздух
добавлен только сайтовым страницам. */
body.platform-page, body.chart-page { --header-h: 42px; }
/* В терминале поле слева ВДВОЕ УЖЕ сайтового — там дорог каждый пиксель. */
body.platform-page .header-inner, body.chart-page .header-inner { padding-left: 16px; }
body.platform-page .header-right, body.chart-page .header-right { gap: 8px; }
body.platform-page .btn, body.chart-page .btn {
padding: 4px 14px; font-size: 11px; line-height: normal;
}
body.platform-page .badge-live, body.chart-page .badge-live { font-size: 10px; }
body.platform-page .theme-toggle, body.chart-page .theme-toggle { width: 26px; height: 26px; }
.app-header {
position: fixed; top: 0; left: 0; right: 0; z-index: 200;
height: var(--header-h);
/* У шапки край только снизу: рамка по кругу у полосы во всю ширину
рисует вертикальные чёрточки у самых краёв экрана. */
background: var(--glass-bg);
backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur);
border-bottom: 1px solid var(--glass-line);
display: flex; align-items: center;
}
.header-inner {
/* Слева поле вдвое шире правого: логотип начинается не от самого края. */
width: 100%; display: flex; align-items: center; padding: 0 12px 0 32px; gap: 0;
}
.logo {
display: flex; align-items: center; gap: 6px;
font-size: 14px; font-weight: 700; letter-spacing: -.3px;
color: var(--text); white-space: nowrap; margin-right: 32px;
}
.logo-img { height: 24px; width: auto; display: block; }
.app-nav { display: flex; align-items: center; gap: 1px; flex: 1; }
/* Часть пунктов — , часть —