600;700&display=swap");

:root {
  --bg: #0d1b1e;
  --panel: rgba(14, 33, 38, 0.92);
  --panel-2: rgba(25, 55, 63, 0.75);
  --accent: #ffb100;
  --accent-2: #00d0b2;
  --text: #e8f3f3;
  --muted: #99b5b8;
  --danger: #ff6b6b;
  --ok: #39d98a;
  --hold: #f6c453;
  --shadow: 0 20px 40px rgba(0, 0, 0, 0.35);
  --radius: 16px;
}

* {
  box-sizing: border-box;
}

.layout > *, .panel, .card, .table-wrap, .table-scroll,
.content, .workspace, .forecast-panel, .signal-panel {
  min-width: 0;
  max-width: 100%;
}

.table-wrap, .table-scroll {
  overflow-x: auto;
  overscroll-behavior-x: contain;
}

svg, canvas { max-width: 100%; }

@media (max-width: 700px) {
  .layout { grid-template-columns: minmax(0, 1fr) !important; }
  .site-header, .panel-header, .controls { flex-wrap: wrap; }
  .panel { overflow-wrap: anywhere; }
  input, select, button { max-width: 100%; }
  .bg-orb { max-width: 100%; right: 0; left: auto; }
}

body {
  margin: 0;
  min-height: 100vh;
  font-family: "Space Grotesk", "Segoe UI", sans-serif;
  color: var(--text);
  background: radial-gradient(circle at top, #16323a 0%, #0d1b1e 55%, #081316 100%);
  display: flex;
  flex-direction: column;
  gap: 32px;
  padding: 28px clamp(20px, 4vw, 60px) 40px;
  position: relative;
  overflow-x: hidden;
}

.bg-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(0px);
  opacity: 0.35;
  mix-blend-mode: screen;
}

.orb-1 {
  width: 420px;
  height: 420px;
  background: radial-gradient(circle, rgba(255, 177, 0, 0.7), transparent 70%);
  top: -120px;
  right: 5%;
}

.orb-2 {
  width: 320px;
  height: 320px;
  background: radial-gradient(circle, rgba(0, 208, 178, 0.65), transparent 70%);
  bottom: 80px;
  left: -120px;
}

.orb-3 {
  width: 240px;
  height: 240px;
  background: radial-gradient(circle, rgba(70, 130, 180, 0.5), transparent 70%);
  top: 40%;
  right: 0;
}

.site-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
}

.eyebrow {
  text-transform: uppercase;
  letter-spacing: 0.2em;
  font-size: 0.75rem;
  margin: 0 0 8px;
  color: var(--muted);
}

h1 {
  font-size: clamp(2rem, 3vw, 3.2rem);
  margin: 0;
}

.sub {
  margin: 12px 0 0;
  color: var(--muted);
  max-width: 520px;
}

.stat-pill {
  background: var(--panel-2);
  padding: 10px 16px;
  border-radius: 999px;
  font-size: 0.85rem;
  box-shadow: var(--shadow);
}

.layout {
  display: grid;
  grid-template-columns: minmax(260px, 320px) minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

.prediction-alert-center,
.market-event-center {
  grid-column: 1 / -1;
  min-width: 0;
}

.prediction-alert-scroll {
  max-height: 560px;
  overflow: auto;
  scrollbar-gutter: stable both-edges;
  overscroll-behavior: contain;
}

.prediction-alert-scroll table {
  min-width: 1500px;
}

.prediction-alert-scroll thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: rgb(14, 33, 38);
}

.table-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  margin-top: 12px;
}

.table-pagination span {
  color: var(--muted);
  min-width: 110px;
  text-align: center;
}

.shortlist {
  grid-column: 1 / -1;
}

.daily-brief {
  grid-column: 1 / -1;
}

.live-feed {
  grid-column: 1 / -1;
}

.live-feed-table-scroll {
  max-height: 520px;
  overflow: scroll;
  scrollbar-gutter: stable both-edges;
  overscroll-behavior: contain;
}

.live-feed-table-scroll table {
  min-width: 1250px;
}

.live-feed-table-scroll thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: rgb(14, 33, 38);
}

.paged-table-scroll {
  max-height: 520px;
  overflow: scroll;
  scrollbar-gutter: stable both-edges;
  overscroll-behavior: contain;
}

.paged-table-scroll table {
  min-width: 1200px;
}

.paged-table-scroll thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: rgb(14, 33, 38);
}

.table-pagination[hidden] {
  display: none;
}

.page-number-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px;
}

.page-number-list button {
  min-width: 40px;
  padding: 9px 12px;
}

.page-number-list button.active {
  background: var(--accent-2);
  color: #071b1a;
  font-weight: 700;
}

.table-pagination button:disabled {
  cursor: not-allowed;
  opacity: 0.45;
  transform: none;
}

.hidden {
  display: none !important;
}

.tab-row {
  display: flex;
  gap: 8px;
  margin: 4px 0 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.tab-btn {
  border-radius: 8px 8px 0 0;
  background: transparent;
  color: var(--muted);
  padding: 10px 14px;
  margin-bottom: -1px;
}

.tab-btn.active {
  background: rgba(0, 208, 178, 0.14);
  color: var(--text);
  border: 1px solid rgba(0, 208, 178, 0.28);
  border-bottom-color: rgba(14, 33, 38, 0.92);
}

.selected-script-view {
  display: grid;
  gap: 12px;
}

.action-field {
  justify-content: end;
}

.paper-trading {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(280px, 360px) minmax(0, 1fr);
  gap: 16px 24px;
}

.holding-risk {
  grid-column: 1 / -1;
}

.learning-patterns {
  grid-column: 1 / -1;
}

.market-news {
  grid-column: 1 / -1;
}

.learning-rules {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
  margin-top: 14px;
}

.learning-rule {
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 8px;
  padding: 12px;
  background: rgba(0, 0, 0, 0.22);
}

.learning-rule h4 {
  margin: 0 0 8px;
}

.learning-rule p {
  color: var(--muted);
  margin: 6px 0 0;
  line-height: 1.4;
}

.paper-trading > .summary-head {
  grid-column: 1 / -1;
}

.paper-entry {
  grid-column: 1;
}

.paper-results {
  grid-column: 2;
  display: grid;
  gap: 14px;
  align-content: start;
}

.paper-results .summary-grid {
  margin-top: 0;
}

.shortlist-track {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  padding: 6px 4px 2px;
  scroll-snap-type: x mandatory;
}

.shortlist-card {
  min-width: 190px;
  background: var(--panel-2);
  border-radius: 14px;
  padding: 12px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  color: var(--text);
  text-align: left;
  cursor: pointer;
  scroll-snap-align: start;
  transition: transform 0.15s ease, border-color 0.15s ease;
}

.shortlist-card:hover {
  transform: translateY(-2px);
  border-color: rgba(255, 255, 255, 0.18);
}

.shortlist-rank {
  font-size: 0.75rem;
  color: var(--muted);
}

.shortlist-symbol {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 6px;
  font-weight: 700;
  font-size: 1rem;
}

.shortlist-score {
  margin-top: 6px;
  font-size: 0.85rem;
  color: var(--muted);
}

.shortlist-tags {
  margin-top: 6px;
  font-size: 0.75rem;
  color: #9fb2b6;
}

.floorsheet-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(260px, 1fr));
  gap: 16px;
  margin-top: 12px;
}

.fs-card h3 {
  margin: 0 0 10px;
  font-size: 1rem;
}

.status.warn {
  color: #ffb657;
}

.status.inline {
  padding: 6px 10px;
}

.floorsheet-filters {
  grid-template-columns: repeat(6, minmax(140px, 1fr));
}

.floorsheet-calendar-legend {
  margin-top: 8px;
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.legend-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.82rem;
  color: var(--muted);
}

.legend-item::before {
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: inline-block;
}

.legend-item.trading::before {
  background: var(--ok);
}

.legend-item.holiday::before {
  background: var(--danger);
}

.floorsheet-calendar {
  margin-top: 8px;
  display: grid;
  grid-template-columns: repeat(12, minmax(28px, 1fr));
  gap: 6px;
}

.fs-day {
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(0, 0, 0, 0.28);
  color: var(--text);
  font-size: 0.78rem;
  border-radius: 8px;
  padding: 5px 0;
  line-height: 1;
  cursor: pointer;
}

.fs-day.trading {
  border-color: rgba(57, 217, 138, 0.45);
  color: #b9ffd7;
}

.fs-day.holiday,
.fs-day.non_trading {
  border-color: rgba(255, 107, 107, 0.55);
  color: #ffb6b6;
}

.fs-day.future {
  color: var(--muted);
  border-color: rgba(255, 255, 255, 0.08);
}

.fs-day.active {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}

@media (max-width: 1200px) {
  .floorsheet-filters {
    grid-template-columns: repeat(3, minmax(160px, 1fr));
  }
}

.screener,
.settings,
.smc-window,
.indexes,
.floorsheet,
.manipulation,
.preburst,
.decision-console,
.broker-holdings,
.broker-summary,
.broker-focus,
.portfolio-manager,
.news-sentiment,
.investment-picks,
.reference-guide,
.horizon {
  grid-column: 1 / -1;
}

.daily-scrip {
  grid-column: 1 / -1;
  margin-bottom: 8px;
}

.company-actions {
  margin-top: 8px;
}

.index-metrics {
  margin-top: 12px;
}

.index-coverage {
  margin-top: 6px;
  font-size: 0.85rem;
  color: var(--muted);
}

.index-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  margin-top: 12px;
}

.index-controls {
  margin-top: 10px;
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.index-asof {
  margin-top: 8px;
  color: var(--muted);
  font-size: 0.85rem;
}

.index-card {
  background: rgba(0, 0, 0, 0.35);
  border-radius: 12px;
  padding: 12px 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.index-card h4 {
  margin: 0 0 6px;
  font-size: 0.9rem;
}

.index-card .meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: var(--muted);
  font-size: 0.8rem;
}

.index-card .delta {
  font-weight: 600;
}

.index-card .delta.up {
  color: var(--ok);
}

.index-card .delta.down {
  color: var(--danger);
}

.index-card .delta.neutral {
  color: var(--muted);
}

.left-stack {
  grid-column: 1;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.panel {
  background: var(--panel);
  border-radius: var(--radius);
  padding: 20px;
  box-shadow: var(--shadow);
  backdrop-filter: blur(12px);
}

.controls h2,
.summary h2 {
  margin-top: 0;
}

.field {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 16px;
  font-size: 0.9rem;
}

.field.checkbox {
  flex-direction: row;
  align-items: center;
  gap: 10px;
  margin-top: 20px;
}

select,
input {
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(0, 0, 0, 0.35);
  color: var(--text);
  font-size: 1rem;
}

.button-row {
  display: flex;
  gap: 12px;
  margin-bottom: 12px;
  flex-wrap: wrap;
  align-items: center;
}

.controls .button-row button {
  flex: 1 1 132px;
  min-width: 128px;
}

.pagination-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 12px;
  flex-wrap: wrap;
}

.pagination-row button {
  min-width: 110px;
}

button {
  border: none;
  border-radius: 12px;
  padding: 12px 16px;
  background: rgba(255, 255, 255, 0.1);
  color: var(--text);
  cursor: pointer;
  font-size: 0.95rem;
}

button.primary {
  background: linear-gradient(130deg, var(--accent), #ff7b00);
  color: #1b1003;
  font-weight: 600;
}

.danger-btn {
  background: rgba(255, 107, 107, 0.18);
  color: var(--danger);
}

.mini-btn {
  padding: 7px 10px;
  border-radius: 8px;
  font-size: 0.78rem;
  margin-right: 6px;
  white-space: nowrap;
}

.primary-mini {
  background: rgba(255, 177, 0, 0.9);
  color: #1b1003;
  font-weight: 700;
}

button:hover {
  transform: translateY(-1px);
}

.link-btn {
  background: none;
  border: none;
  color: var(--accent-2);
  cursor: pointer;
  font-weight: 600;
  padding: 0;
}

.hint {
  color: var(--muted);
  font-size: 0.85rem;
}

.status {
  margin-top: 12px;
  font-size: 0.85rem;
  color: var(--muted);
}

.summary-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}

.summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 16px;
  margin-top: 12px;
}

.metric span {
  font-size: 0.75rem;
  color: var(--muted);
}

.metric strong {
  display: block;
  margin-top: 6px;
  font-size: 1.1rem;
}

.metric-delta {
  margin-left: 6px;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.3px;
}

.metric-delta.up {
  color: #4bd37b;
}

.metric-delta.down {
  color: #ff6b6b;
}

.portfolio-action-plan {
  margin-top: 18px;
  display: grid;
  gap: 10px;
}

.portfolio-action-plan h3 {
  margin: 0;
}

.compact-actions {
  align-items: end;
  margin: 0;
}

.mini-field {
  min-width: 140px;
}

.mini-field input {
  max-width: 140px;
}

.chart-wrap {
  margin: 20px 0;
  background: rgba(6, 10, 12, 0.6);
  border-radius: 14px;
  padding: 14px;
  height: 360px;
  position: relative;
}

.range-grid {
  display: flex;
  gap: 12px;
  margin: 16px 0 8px;
  overflow-x: auto;
}

.range-card {
  background: rgba(0, 0, 0, 0.35);
  border-radius: 12px;
  padding: 12px 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  min-width: 220px;
}

.range-card h4 {
  margin: 0 0 6px;
  font-size: 0.85rem;
}

.range-card p {
  margin: 0;
  color: var(--muted);
  font-size: 0.8rem;
  line-height: 1.4;
}

.decision-card {
  background: rgba(0, 0, 0, 0.35);
  border-radius: 12px;
  padding: 12px 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  margin-top: 12px;
}

.follow-decision-card {
  border-color: rgba(77, 184, 141, 0.32);
  background: rgba(8, 26, 23, 0.72);
}

.follow-metrics {
  margin-top: 12px;
}

.follow-command {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 6px 10px;
  margin-bottom: 8px;
  border-radius: 6px;
  font-weight: 800;
  letter-spacing: 0;
}

.follow-command.buy {
  background: rgba(36, 143, 91, 0.26);
  color: #7ee2aa;
}

.follow-command.hold {
  background: rgba(255, 177, 0, 0.18);
  color: #ffd27a;
}

.follow-command.sell {
  background: rgba(220, 76, 70, 0.2);
  color: #ff9a96;
}

.decision-metrics .metric strong {
  font-size: 1rem;
}

.compact-grid {
  grid-template-columns: repeat(2, minmax(280px, 1fr));
}

.decision-list {
  display: grid;
  gap: 8px;
  color: var(--muted);
  font-size: 0.9rem;
}

.reference-guide {
  opacity: 0.88;
}

.reference-guide details {
  margin-top: 8px;
}

.decision-line {
  padding: 8px 10px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.07);
  background: rgba(0, 0, 0, 0.22);
}

.decision-line.positive {
  border-color: rgba(57, 217, 138, 0.35);
  color: #bdf4d8;
}

.decision-line.negative {
  border-color: rgba(255, 107, 107, 0.35);
  color: #ffc4c4;
}

.decision-line.neutral {
  border-color: rgba(246, 196, 83, 0.28);
  color: #f6e2ad;
}

.company-details summary {
  cursor: pointer;
  list-style: none;
}

.company-details summary::-webkit-details-marker {
  display: none;
}

.company-details summary::after {
  content: "▸";
  margin-left: 8px;
  color: var(--muted);
}

.company-details[open] summary::after {
  content: "▾";
}

.company-details ul {
  margin: 10px 0 0;
  padding-left: 18px;
  color: var(--text);
}

.company-details li {
  margin-bottom: 6px;
}

.practical-card {
  background: rgba(0, 0, 0, 0.35);
  border-radius: 12px;
  padding: 12px 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  margin-top: 10px;
}

.decision-title {
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
}

.decision-body {
  margin-top: 8px;
  font-size: 0.9rem;
  line-height: 1.4;
  white-space: pre-line;
}

#price-chart,
#index-chart {
  width: 100%;
  height: 100%;
}

.chart-controls {
  position: absolute;
  top: 12px;
  right: 12px;
  display: flex;
  gap: 8px;
  z-index: 2;
}

.chart-btn {
  padding: 6px 10px;
  font-size: 0.75rem;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.4);
}

.signal-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
}

.guide details {
  background: rgba(0, 0, 0, 0.3);
  border-radius: 12px;
  padding: 10px 12px;
  margin-bottom: 10px;
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.guide summary {
  cursor: pointer;
  font-weight: 600;
}

.guide p {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 0.85rem;
  line-height: 1.5;
}

.filter-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  margin-bottom: 12px;
}

.pagination-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 12px 0;
}

.page-info {
  font-size: 0.9rem;
  color: var(--muted);
}

.page-size {
  margin-bottom: 0;
  max-width: 140px;
}

.tag-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  font-size: 0.85rem;
  color: var(--muted);
  margin-bottom: 12px;
}

.tag-filters label {
  display: flex;
  gap: 8px;
  align-items: center;
}

.table-wrap {
  overflow-x: auto;
}

.shortlist-table {
  margin-top: 12px;
}

.shortlist-row {
  cursor: pointer;
}

.shortlist-row:hover {
  background: rgba(255, 255, 255, 0.04);
}

.live-new-row {
  background: rgba(57, 217, 138, 0.08);
}

.live-new-row:hover {
  background: rgba(57, 217, 138, 0.14);
}

.link-button {
  background: none;
  color: var(--accent-2);
  border: none;
  padding: 0;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.muted {
  display: block;
  color: var(--muted);
  font-size: 0.78rem;
  margin-top: 4px;
}

.profit {
  color: var(--ok);
}

.loss {
  color: var(--danger);
}

table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
}

thead th {
  text-align: left;
  color: var(--muted);
  font-weight: 600;
  padding: 10px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.table-filters th {
  padding: 8px 10px 12px;
}

.table-filters input,
.table-filters select {
  width: 100%;
  padding: 8px 10px;
  font-size: 0.8rem;
  border-radius: 10px;
}

tbody td {
  padding: 10px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.shortlist-row {
  cursor: pointer;
}

.shortlist-row:hover {
  background: rgba(255, 255, 255, 0.04);
}

.sector-group-row td {
  background: rgba(66, 211, 176, 0.12);
  color: var(--text);
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
}

.symbol-cell {
  color: var(--accent);
  font-weight: 800;
}

.basis-cell {
  min-width: 220px;
  max-width: 380px;
  white-space: normal;
  line-height: 1.35;
  color: var(--text);
}

.summary-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 104px;
  padding: 6px 10px;
  border-radius: 6px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}

.summary-bullish,
.risk-medium {
  background: rgba(60, 132, 197, 0.92);
  color: #ffffff;
}

.summary-bearish,
.risk-high,
.action-sell {
  background: rgba(220, 76, 70, 0.92);
  color: #ffffff;
}

.summary-neutral,
.action-hold {
  background: rgba(145, 154, 166, 0.35);
  color: var(--text);
}

.risk-low,
.action-buy {
  background: rgba(82, 178, 83, 0.95);
  color: #ffffff;
}

.action-watch {
  background: rgba(246, 196, 83, 0.95);
  color: #1b1b1b;
}

.horizon tbody tr {
  cursor: pointer;
}

.sort-btn {
  background: none;
  border: none;
  color: inherit;
  font: inherit;
  padding: 0;
  cursor: pointer;
}

.sort-btn::after {
  content: " ↕";
  color: var(--muted);
  font-size: 0.75rem;
}

.sort-btn.asc::after {
  content: " ↑";
}

.sort-btn.desc::after {
  content: " ↓";
}

.tag-badge {
  display: inline-flex;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  margin-right: 6px;
  margin-bottom: 4px;
  font-size: 0.75rem;
}

.settings-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 12px;
}

.dual-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(240px, 1fr));
  gap: 16px;
  overflow-x: auto;
}

.dual-grid h3 {
  margin-top: 0;
}

.dual-grid > div {
  min-width: 240px;
}

.signal-card {
  position: relative;
  background: rgba(0, 0, 0, 0.35);
  border-radius: 12px;
  padding: 12px 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.signal-card h4 {
  margin: 0 0 6px;
  font-size: 0.9rem;
}

.signal-desc {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 0.8rem;
  line-height: 1.4;
}

.signal-card[data-tip]::after {
  content: attr(data-tip);
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: calc(100% + 10px);
  background: rgba(8, 16, 18, 0.95);
  color: var(--text);
  padding: 10px 12px;
  border-radius: 12px;
  font-size: 0.78rem;
  line-height: 1.4;
  box-shadow: var(--shadow);
  opacity: 0;
  pointer-events: none;
  transform: translateY(6px);
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.signal-card[data-tip]:hover::after {
  opacity: 1;
  transform: translateY(0);
}

.pill {
  padding: 6px 14px;
  border-radius: 999px;
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  background: rgba(255, 255, 255, 0.1);
}

.pill.buy {
  background: rgba(57, 217, 138, 0.25);
  color: var(--ok);
}

.pill.sell {
  background: rgba(255, 107, 107, 0.25);
  color: var(--danger);
}

.pill.hold {
  background: rgba(246, 196, 83, 0.25);
  color: var(--hold);
}

.pill.technical-bias {
  color: var(--text);
  background: rgba(255, 255, 255, 0.08);
  font-size: 0.75rem;
}

.forward-model-card .model-status {
  margin: 8px 0 12px;
  font-weight: 600;
}

.model-ready {
  color: var(--ok);
}

.model-unavailable {
  color: var(--hold);
}

.forward-model-card .metric strong {
  overflow-wrap: anywhere;
}

.portfolio-decision {
  min-width: 280px;
  max-width: 520px;
  white-space: normal;
}

.forecast-detail {
  margin-top: 8px;
  color: var(--muted);
  font-size: 0.8rem;
  line-height: 1.5;
}

.site-footer {
  color: var(--muted);
  font-size: 0.8rem;
}

@media (max-width: 960px) {
  .layout {
    grid-template-columns: 1fr;
  }
  .paper-trading {
    grid-template-columns: 1fr;
  }
  .paper-trading > .summary-head,
  .paper-entry,
  .paper-results {
    grid-column: 1;
  }
  .site-header {
    flex-direction: column;
    align-items: flex-start;
  }
  .floorsheet-grid {
    grid-template-columns: repeat(2, minmax(220px, 1fr));
  }
}

@media (max-width: 720px) {
  .floorsheet-grid {
    grid-template-columns: 1fr;
  }
}

.indexes {
  grid-column: 1 / -1;
}

.field.inline {
  margin-bottom: 0;
}

.field.inline span {
  font-size: 0.7rem;
  color: var(--muted);
}

.field.inline select {
  padding: 8px 10px;
  font-size: 0.8rem;
}
.guide {
  grid-column: 1;
}
/* Forms remain within narrow screens; dialogs contain recorded fill details. */
.research-form, .trade-record-dialog form { display: grid; gap: 12px; padding: 16px; }
.research-form label, .trade-record-dialog label { display: grid; gap: 5px; }
.research-form input, .research-form textarea, .trade-record-dialog input { min-width: 0; width: 100%; box-sizing: border-box; }
.research-form input[type="checkbox"] { width: auto; }
.trade-record-dialog { width: min(480px, 90vw); max-height: 90vh; overflow: auto; border-radius: 14px; }
.trade-record-dialog::backdrop { background: #0008; }
#research-panel { grid-column: 1 / -1; min-width: 0; overflow-wrap: anywhere; }
.integrated-evidence { margin-top: 18px; min-width: 0; overflow-wrap: anywhere; }
.activity-alert-center { grid-column: 1 / -1; min-width: 0; }
.activity-filters { grid-template-columns: repeat(auto-fit, minmax(165px, 1fr)); }
.activity-alerts { display: grid; gap: 12px; margin-top: 16px; }
.activity-alert { border: 1px solid var(--border); border-left: 4px solid var(--muted); border-radius: 10px; padding: 14px; min-width: 0; overflow-wrap: anywhere; }
.activity-alert.activity-high { border-left-color: #f49d68; }
.activity-alert.activity-watch { border-left-color: #d8c26b; }
.activity-alert summary { cursor: pointer; line-height: 1.5; }
.activity-alert p, .activity-alert li { line-height: 1.55; }
.activity-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.activity-tag { font-size: .75rem; border: 1px solid var(--border); padding: 3px 7px; border-radius: 20px; color: var(--muted); }
.activity-summary { margin: 10px 0; color: var(--muted); }
.activity-measurements { display: grid; grid-template-columns: minmax(120px, 1fr) minmax(80px, 1fr); gap: 7px 15px; max-width: 650px; }
.activity-measurements dd { margin: 0; }
.activity-new { padding: 12px; margin: 12px 0; border: 1px solid var(--accent); border-radius: 8px; }
.activity-coverage summary { cursor: pointer; }
.activity-alert .button-row { margin-top: 10px; }
.evidence-group { border-top: 1px solid var(--border, #cbd5e1); padding: 12px 0; }
.evidence-group summary { cursor: pointer; font-weight: 600; line-height: 1.6; }
.evidence-group p, .evidence-group li { line-height: 1.6; }
.evidence-group table { min-width: 620px; }
@media (max-width: 700px) {
  .tab-row { flex-wrap: wrap; }
  .floorsheet-calendar { grid-template-columns: repeat(7, minmax(0, 1fr)); }
  .fs-day { min-width: 0; padding-inline: 2px; }
}