/* DVIZHUHA 3.0: shared visual primitives, loaded after page layout styles.
   Keep chart geometry, trading states and responsive table modes in app/radar.css. */
:root {
  --r-s: 6px;
  --r-m: 8px;
  --r-l: 12px;
  --r-xl: 16px;
  --pad-x: clamp(16px, 2.25vw, 36px);
  --page-width: 1600px;
  --control-height: 40px;
  --heading-size: clamp(26px, 2.1vw, 30px);
}
[hidden] { display: none !important; }
[data-hints="hidden"] [data-hint] { display: none !important; }
.header-tools { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.hints-toggle { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 40px; padding: 0 10px; background: var(--panel); border: 1px solid var(--line); color: var(--muted); cursor: pointer; }
.hints-toggle[aria-pressed="true"] { color: var(--text); }
.hints-toggle:hover { background: var(--panel-2); border-color: var(--line-strong); }
.hints-toggle svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
@media (max-width: 760px) {
  .header-tools { order: 1; margin-left: auto; gap: 6px; }
  .hints-toggle { width: 44px; height: 44px; padding: 0; }
  .hints-toggle span { display: none; }
}

:root {
  color-scheme: dark;
  --candle-up: #4ac7ad;
  --candle-down: #d8827b;
  --resistance: #ef9984;
  --chart-exit: #7fc8ff;
}
:root[data-theme="light"] {
  color-scheme: light;
  --bg: #f4f6f8;
  --panel: #ffffff;
  --panel-2: #edf1f5;
  --bg-deep: #e9eef3;
  --text: #202b36;
  --muted: #586777;
  --line: #d3dce5;
  --line-strong: #9aaaba;
  --line-soft: rgba(85,105,125,.22);
  --accent: #48651a;
  --accent-lite: #3d5713;
  --accent-dark: #3d5713;
  --accent-deep: #30450f;
  --on-accent: #ffffff;
  --long: #137b4c;
  --short: #c03832;
  --warn: #956000;
  --warning: var(--warn);
  --violet: #7352bd;
  --watch: #586777;
  --long-bg: rgba(19,123,76,.08);
  --long-line: rgba(19,123,76,.3);
  --short-bg: rgba(192,56,50,.08);
  --short-line: rgba(192,56,50,.3);
  --warn-bg: rgba(149,96,0,.08);
  --warn-line: rgba(149,96,0,.3);
  --accent-bg: rgba(72,101,26,.09);
  --accent-line: rgba(72,101,26,.32);
  --focus-ring: rgba(72,101,26,.2);
  --shadow-soft: rgba(30,45,60,.1);
  --chart-bg: #ffffff;
  --chart-grid: rgba(85,105,125,.12);
  --chart-grid-strong: rgba(85,105,125,.23);
  --chart-text: #586777;
  --chart-range-bg: rgba(72,101,26,.08);
  --chart-range-line: rgba(72,101,26,.6);
  --chart-long-soft: rgba(19,123,76,.42);
  --chart-short-soft: rgba(192,56,50,.42);
  --candle-up: var(--long);
  --candle-down: var(--short);
  --resistance: var(--short);
  --chart-exit: #2269aa;
}
.theme-toggle {
  display: inline-flex; align-items: center; justify-content: center;
  flex: 0 0 40px; width: 40px; height: 40px; padding: 0;
  background: var(--panel); color: var(--text); border: 1px solid var(--line);
  cursor: pointer;
}
.theme-toggle:hover { background: var(--panel-2); border-color: var(--line-strong); }
.theme-toggle svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.theme-toggle .theme-moon, [data-theme="light"] .theme-toggle .theme-sun { display: none; }
[data-theme="light"] .theme-toggle .theme-moon { display: block; }
.login-theme { position: absolute; top: 16px; right: 16px; }
.site-guide { margin: 0 0 24px; border: 1px solid var(--line); border-radius: var(--r-l); background: var(--panel); }
.site-guide summary { padding: 13px 16px; cursor: pointer; color: var(--text); font-size: var(--fs-m); font-weight: 600; }
.site-guide summary span { margin-left: 8px; color: var(--muted); font-weight: 400; }
.site-guide summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: var(--r-m); }
.site-guide-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; padding: 8px 16px 0; }
.site-guide a { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
.site-guide-grid > div > a { font-weight: 650; }
.site-guide-grid p, .site-guide-note { font-size: var(--fs-m); line-height: 1.6; color: var(--muted); }
.site-guide-note { margin: 0; padding: 0 16px 16px; }
input::placeholder, textarea::placeholder { color: var(--muted); opacity: 1; }
@media (max-width: 760px) {
  .top .theme-toggle { order: 1; margin-left: auto; flex-basis: 44px; width: 44px; height: 44px; }
  .site-guide-grid { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .state-tabs { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin; }
  .state-tabs button { flex-shrink: 0; white-space: nowrap; }
}

body { font-family: var(--sans); font-variant-numeric: tabular-nums; }
.top { gap: 24px; }
.top nav a.vpn-cta, .top nav a.tg-cta {
  height: 36px; padding: 0 12px; margin-left: 0;
  border: 1px solid var(--line); border-radius: var(--r-m);
  background: var(--panel); color: var(--muted); font-size: var(--fs-m); font-weight: 550;
  display: inline-flex; align-items: center; box-sizing: border-box; flex-shrink: 0;
  white-space: nowrap; line-height: 1;
  transition: color var(--t), background var(--t), border-color var(--t);
}
.top nav a.vpn-cta { margin-left: auto; }
.top nav a.vpn-cta:hover, .top nav a.tg-cta:hover {
  background: var(--panel-2); color: var(--text); border-color: var(--line-strong);
}
.top nav a.vpn-cta.on {
  background: var(--accent-bg); color: var(--accent); border-color: var(--accent-line);
  height: 36px; padding: 0 12px; font-size: var(--fs-m); font-weight: 550;
}
main, main:has(.cab-app), main:has(.trade-public) {
  max-width: var(--page-width); margin-inline: auto;
  padding: 24px var(--pad-x) 48px;
}
.cab-app, .trade-public { max-width: none; margin: 0; }
.page-hero { padding: 0; margin-bottom: 24px; gap: 24px; }
.page-hero h1, .radar-heading h1, .trade-public-head h1 {
  font: 700 var(--heading-size)/1.2 var(--sans); letter-spacing: -.025em;
  margin: 0 0 8px;
}
.page-hero p, .radar-heading p, .trade-public-head p {
  color: var(--muted); font-size: var(--fs-base); line-height: 1.55; opacity: 1;
}
.radar-heading { margin-bottom: 24px; }
.eyebrow, .trade-public-kicker { display: block; margin-bottom: 8px; }

/* Text controls share one shape. Checkboxes, switches, chart hit areas and
   underlined navigation retain their own geometry and semantic colors. */
button, select, input, textarea { font-family: var(--sans); }
button, select, input:not([type=checkbox]):not([type=radio]):not([type=range]), textarea {
  border-radius: var(--r-m); font-size: var(--fs-m);
}
input:not([type=checkbox]):not([type=radio]):not([type=range]), select, textarea {
  background: var(--panel-2); border: 1px solid var(--line); min-height: var(--control-height);
}
.search-label input, .oi-search input, .oi-board-tools input { min-height: var(--control-height); border-radius: var(--r-m); }
.tabs button, .state-tabs button, .view-switch button, .radar-filters select,
.price-control button, .page-controls button, .page-controls select,
.detail-toolbar button, .detail-levels button, .oi-switch button,
.cab-settings-actions button, .cab-form-grid input, .cab-form-grid select {
  min-height: var(--control-height); font: 500 var(--fs-m)/1.4 var(--sans);
  border-radius: var(--r-m);
}
.tabs { flex-wrap: wrap; gap: 8px; }
.tabs button { letter-spacing: 0; text-transform: none; }
.tabs button.on, .state-tabs button.on, .view-switch button.on, .detail-tf button.on {
  background: var(--accent); color: var(--on-accent); border-color: var(--accent); box-shadow: none;
}
button:disabled { cursor: not-allowed; }
a:focus-visible, button:focus-visible, [tabindex]:focus-visible {
  outline: 2px solid var(--accent); outline-offset: 3px;
}

.panel, .card, .quote-card, .table-scroll, .empty, #error,
.oi-terminal, .oi-board, .oi-method, .oi-tile, .home-cabinet,
.cab-block, .cab-summary, .cab-activity-summary,
.trade-public-positions, .trade-public-deals, .trade-result-breakdown,
.trade-public-history, .vpn-plan {
  border-radius: var(--r-l); box-shadow: none;
}
.panel > h2, .cab-block-head, .trade-public-section-head, .oi-board-head {
  padding: 14px 16px;
}
.panel > h2 { font: 650 var(--fs-l)/1.4 var(--sans); letter-spacing: 0; }
.panel-body { padding: 16px; }
.cab-block-head, .oi-head { border-radius: var(--r-l) var(--r-l) 0 0; }
.cab-block-head h3, .trade-public-section-head h2, .oi-board-head h2 {
  font: 650 var(--fs-l)/1.4 var(--sans);
}
.cab-summary, .cab-activity-summary { overflow: hidden; }
.cab-toggle-grid input[role=switch] {
  flex: 0 0 40px; width: 40px; height: 22px; min-height: 22px; padding: 2px; border-radius: 999px;
}
.cab-hint, .cab-block > .cab-exit-hint {
  margin: 0; padding: 12px 16px; color: var(--muted); font-size: var(--fs-s); line-height: 1.55;
}
.cab-settings-actions { gap: 8px; }
.cab-block > .cab-settings-actions { padding: 12px 16px; }
.trade-detail-block { white-space: normal; overflow-wrap: anywhere; }
#cab-bot-block .cab-toggle-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cab-tradebar { border-radius: var(--r-l) var(--r-l) 0 0; background: var(--cab-surface); flex-wrap: wrap; }
.cab-tradebar-controls { flex-wrap: wrap; }
.cab-shell { border-radius: 0 0 var(--r-l) var(--r-l); }
.cab-nav { border-bottom-left-radius: var(--r-l); }
.cab-segment, .trade-cabinet-picker, .cab-alert, .trade-public-alert { border-radius: var(--r-m); }
.trade-history-tabs { border-radius: var(--r-m); }
.trade-history-tabs button { font: 500 var(--fs-s)/1.4 var(--sans); min-height: 34px; }
.cab-segment button, .trade-cabinet-picker button { font-family: var(--sans); }
.cab-title-block h1 { font: 700 var(--fs-xl)/1.2 var(--sans); }
.trade-public-head { border-radius: var(--r-l) var(--r-l) 0 0; padding: 20px; }
.trade-public-summary { border-radius: 0 0 var(--r-l) var(--r-l); padding: 14px 20px; }
.trade-public-head h1 { margin-top: 0; }
.trade-public-head p { margin: 0; }

/* UI labels use the same readable face; code and secret fields may stay mono. */
.oi-label, .oi-code, .oi-free, .oi-hero-status, .oi-legend, .eyebrow,
.trade-public-kicker, .trade-public-section-head > span, .cab-nav-foot b,
.oi-table th, .trade-public-table th, .cab-table th {
  font-family: var(--sans); letter-spacing: 0; font-size: var(--fs-s);
}
.quote-value, .oi-readout-main strong, .oi-tile strong,
.cab-summary strong, .cab-activity-summary strong, .trade-public-stat strong,
.trade-result-cards strong, .vpn-plan-price { font-family: var(--sans); }
.vpn-app, .vpn-support, .vpn-warn, .cab-dialog, .cab-bot-invite { border-radius: var(--r-m); }
.site-footer { max-width: var(--page-width); margin-inline: auto; padding-inline: var(--pad-x); }

@media (max-width: 760px) {
  .top { gap: 4px 10px; }
  main, main:has(.cab-app), main:has(.trade-public) { padding: 20px var(--pad-x) 32px; }
  .page-hero { gap: 16px; }
  .page-hero h1, .radar-heading h1, .trade-public-head h1 { font-size: var(--heading-size); }
  .radar-filters select { font-size: var(--fs-s); padding-inline: 8px; }
  .trade-public-head, .trade-public-summary, .trade-public-positions,
  .trade-public-deals, .trade-result-breakdown, .trade-public-history {
    border-left: 1px solid var(--line); border-right: 1px solid var(--line);
  }
  .cab-title-block { min-width: 0; flex-wrap: wrap; gap: 8px 16px; }
  #cab-bot-block .cab-block-head { flex-wrap: wrap; }
  #cab-bot-block .cab-toggle-grid { grid-template-columns: minmax(0, 1fr); }
  .cab-workspace { padding: 16px 12px; }
  .cab-tradebar-controls { justify-content: flex-start; }
  .cab-shell { min-width: 0; }
  .oi-switches { min-width: 0; }
  .oi-switch { flex-wrap: wrap; }
  .oi-method-grid { grid-template-columns: minmax(0, 1fr); }
}

@media (min-width: 761px) and (max-width: 1100px) {
  .top nav a.tg-cta {
    align-self: center; height: 38px; margin-left: auto; padding: 0 16px;
    border: 1px solid var(--line); border-radius: var(--r-m);
  }
}
/* Значки разделов в шапке: помогают запомнить короткие имена. */
.nav-ico { margin-right:4px; font-size:.95em; }