* {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: Inter, Arial, sans-serif;
  background: #08111f;
  color: #f5f7fb;
}

.page-shell {
  max-width: 1280px;
  margin: 0 auto;
  padding: 24px;
}

.site-header {
  margin-bottom: 24px;
}

.eyebrow {
  margin: 0 0 8px;
  color: #8ab4ff;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: .08em;
}

h1 {
  margin: 0 0 12px;
  font-size: 42px;
  line-height: 1.1;
}

.lead {
  margin: 0;
  color: rgba(255,255,255,.78);
  line-height: 1.7;
  font-size: 17px;
}

.content-stack {
  display: grid;
  gap: 20px;
}

.panel {
  border-radius: 24px;
  border: 1px solid rgba(255,255,255,.08);
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  padding: 22px;
}

.panel-heading h2 {
  margin: 0;
  font-size: 28px;
}

.section-kicker {
  margin: 0 0 8px;
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(255,255,255,.58);
}

.ideas-updated-at {
  margin: 0 0 18px;
  font-size: 13px;
  color: rgba(255,255,255,.72);
}

.ideas-container {
  display: grid;
  gap: 24px;
}

.ideas-loading,
.idea-chart-missing {
  padding: 20px;
  border-radius: 16px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
}

.idea-card {
  border-radius: 28px;
  border: 1px solid rgba(255,255,255,.08);
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  box-shadow: 0 24px 70px rgba(0,0,0,.24);
  padding: 24px;
}

.idea-card-top {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-start;
}

.idea-card-meta {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.idea-instrument {
  display: inline-flex;
  width: fit-content;
  padding: 7px 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  background: rgba(99,102,241,.18);
  color: #c7d2fe;
  border: 1px solid rgba(99,102,241,.26);
}

.idea-title {
  margin: 0;
  font-size: 26px;
  line-height: 1.2;
}

.idea-news-line {
  font-size: 14px;
  opacity: .78;
  line-height: 1.6;
  overflow-wrap: anywhere;
}

.idea-warning {
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(251, 191, 36, .45);
  background: rgba(251, 191, 36, .12);
  color: #fde68a;
  font-size: 13px;
  line-height: 1.5;
}

.idea-label {
  padding: 10px 14px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
  border: 1px solid rgba(255,255,255,.12);
}

.idea-label-buy {
  background: rgba(34,197,94,.16);
  color: #86efac;
}

.idea-label-sell {
  background: rgba(239,68,68,.16);
  color: #fca5a5;
}

.idea-label-watch {
  background: rgba(234,179,8,.16);
  color: #fde68a;
}

.idea-key-levels {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin-top: 18px;
}

.idea-key-levels div {
  padding: 12px;
  border-radius: 14px;
  border: 1px solid rgba(95,156,230,.22);
  background: rgba(3,14,28,.62);
}

.idea-key-levels span {
  display: block;
  margin-bottom: 5px;
  color: rgba(255,255,255,.58);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.idea-key-levels strong {
  color: #f5f7fb;
  font-size: 15px;
  overflow-wrap: anywhere;
}

.idea-summary,
.idea-card__description {
  display: block;
  min-height: 120px;
  margin-top: 18px;
  padding: 16px 18px;
  border-radius: 18px;
  border: 1px solid rgba(95,156,230,.22);
  background: rgba(3,14,28,.58);
  color: rgba(255,255,255,.94);
  font-size: 16px;
  line-height: 1.65;
  white-space: normal;
  overflow-wrap: anywhere;
}

.idea-chart-wrap {
  margin-top: 20px;
  overflow: hidden;
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.08);
  background: #0b1222;
}

.idea-chart-image {
  display: block;
  width: 100%;
  height: auto;
  max-height: 720px;
  object-fit: contain;
}

.idea-chart-svg {
  aspect-ratio: 900 / 260;
}

.idea-chart-path {
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 8px rgba(34,211,238,.32));
}

.idea-chart-level {
  stroke: rgba(255,255,255,.32);
  stroke-dasharray: 8 6;
}

.idea-chart-level-label {
  fill: rgba(255,255,255,.82);
  font-size: 13px;
  font-weight: 800;
  paint-order: stroke;
  stroke: rgba(0,0,0,.72);
  stroke-width: 3px;
}

.idea-sentiment-badge {
  margin: 8px 0;
  padding: 8px 12px;
  border-radius: 12px;
  background: rgba(3,14,28,.72);
  border: 1px solid rgba(95,156,230,.32);
  color: rgba(244,248,255,.9);
  font-size: 12px;
  font-weight: 800;
}

.idea-analysis-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 20px;
}

.idea-section {
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 20px;
  padding: 18px;
}

.idea-section h4 {
  margin: 0 0 10px;
  font-size: 17px;
}

.idea-section p {
  margin: 0;
  font-size: 14px;
  line-height: 1.8;
  opacity: .92;
  white-space: normal;
  overflow-wrap: anywhere;
}

.idea-section-plan {
  margin-top: 16px;
}

.idea-criteria {
  margin-top: 16px;
  border-color: rgba(69,202,255,.22);
  background: linear-gradient(180deg, rgba(69,202,255,.07), rgba(255,255,255,.025));
}

.idea-criteria-note {
  margin-bottom: 14px !important;
  color: rgba(255,255,255,.72);
  font-size: 13px !important;
}

.idea-criteria-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.idea-criteria-item {
  min-width: 0;
  padding: 12px;
  border-radius: 14px;
  border: 1px solid rgba(95,156,230,.2);
  background: rgba(3,14,28,.62);
}

.idea-criteria-item span {
  display: block;
  margin-bottom: 6px;
  color: #8ab4ff;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .07em;
}

.idea-criteria-item strong {
  display: block;
  color: rgba(255,255,255,.88);
  font-size: 13px;
  line-height: 1.55;
  font-weight: 600;
  white-space: normal;
  overflow-wrap: anywhere;
}

.trade-plan-list {
  margin: 0;
  padding-left: 18px;
  line-height: 1.85;
  font-size: 14px;
  overflow-wrap: anywhere;
}

@media (max-width: 860px) {
  .idea-analysis-grid,
  .idea-criteria-grid,
  .idea-key-levels {
    grid-template-columns: 1fr;
  }

  .idea-card-top {
    flex-direction: column;
    align-items: flex-start;
  }

  h1 {
    font-size: 32px;
  }

  .idea-title {
    font-size: 22px;
  }

  .idea-card {
    padding: 18px;
  }
}

.ai-status-card {
  display: grid;
  gap: 14px;
  margin: 0 0 18px;
  padding: 18px 20px;
  border-radius: 22px;
  border: 1px solid rgba(95, 156, 230, 0.24);
  background: rgba(3, 14, 28, 0.72);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.22);
}
.ai-status-card__head { display: flex; align-items: center; gap: 12px; }
.ai-status-card__dot { font-size: 1.25rem; }
.ai-status-card__kicker { margin: 0 0 4px; color: #45caff; text-transform: uppercase; letter-spacing: .16em; font-size: .72rem; }
.ai-status-card__head strong { color: #f4f8ff; font-size: 1.15rem; }
.ai-status-card__grid { display: flex; flex-wrap: wrap; gap: 10px; color: #9bb8d8; }
.ai-status-card__grid span, .ai-source-chip, .ai-generated-line { padding: 8px 10px; border: 1px solid rgba(95,156,230,.24); border-radius: 999px; background: rgba(8,25,48,.72); }
.ai-status-card--active { border-color: rgba(84, 255, 181, 0.42); }
.ai-status-card--offline { border-color: rgba(255, 93, 122, 0.46); }
.ai-source-row { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin: 12px 0 4px; color:#9bb8d8; font-size:12px; font-weight:800; }
.ai-source-chip { color:#07111f; font-weight:900; }
.ai-source-chip--grok { background: linear-gradient(180deg, #54ffb5, #31f59d); border-color: rgba(84,255,181,.82); }
.ai-source-chip--fallback { background: linear-gradient(180deg, #ffd166, #fbbf24); border-color: rgba(251,191,36,.82); }
.ai-source-chip--rule { background: linear-gradient(180deg, #ff8a8a, #ef4444); border-color: rgba(239,68,68,.82); color:#fff; }
.ai-generated-line { color:#cfe7ff; border-radius: 14px; font-size:12px; }
.controls {
  margin: 0 0 18px;
}
.analysis-mode-row,
.view-mode-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px;
  border: 1px solid rgba(95, 156, 230, 0.24);
  border-radius: 20px;
  background: rgba(3, 14, 28, 0.62);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.22);
}
.view-mode-title {
  color: #e8f3ff;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.view-mode-toggle { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; min-width: min(100%, 390px); }
.view-mode-btn {
  border: 1px solid rgba(95,156,230,.42);
  background: rgba(8,25,48,.86);
  color: #dbeeff;
  border-radius: 999px;
  min-height: 38px;
  width: 100%;
  padding: 9px 14px;
  font-size: 13px;
  font-weight: 900;
  cursor: pointer;
}
.view-mode-btn.active {
  border-color: rgba(84,255,181,.88);
  background: linear-gradient(180deg,#54ffb5,#31f59d);
  color: #06111f;
}
.analysis-card-body { display: grid; gap: 14px; margin-top: 16px; }
.factor-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(160px,1fr)); gap: 10px; }
.factor-item {
  padding: 11px 12px;
  border-radius: 14px;
  border: 1px solid rgba(95,156,230,.25);
  background: rgba(8,25,48,.72);
}
.factor-item span { display:block; color:#9bb8d8; font-size:12px; }
.factor-item strong { display:block; margin-top:4px; color:#fff; }
.factor-подтверждает { border-color: rgba(49,245,157,.45); }
.factor-противоречит { border-color: rgba(255,95,122,.52); }
.factor-недоступно, .factor-в-разработке { opacity: .78; }
.analysis-details {
  border: 1px solid rgba(95,156,230,.24);
  border-radius: 16px;
  background: rgba(3,14,28,.52);
  padding: 12px;
}
.analysis-details summary { cursor: pointer; color:#e8f3ff; font-weight:900; }
.risk-list { display:grid; gap:8px; margin-top:10px; }
@media(max-width:720px){ .analysis-mode-row,.view-mode-row{align-items:stretch;flex-direction:column;} .view-mode-toggle{min-width:0;width:100%;} }
