* {
  box-sizing: border-box;
}

:root {
  --bg: #eef3f9;
  --card: #ffffff;
  --line: #dbe4f0;
  --line-soft: #edf2f7;
  --text: #071225;
  --muted: #64748b;
  --blue: #2563eb;
  --green: #10b981;
  --red: #ef1111;
  --purple: #7c3aed;
  --navy: #071528;
  --navy-2: #0b1f3a;
  --shadow: 0 14px 34px rgba(15, 23, 42, 0.08);
  --radius-lg: 24px;
  --radius-md: 18px;
  --radius-sm: 14px;
}

html,
body {
  margin: 0;
  min-height: 100%;
  overflow-x: hidden;
  background:
    radial-gradient(circle at 20% 0%, rgba(37, 99, 235, 0.12), transparent 28%),
    radial-gradient(circle at 90% 10%, rgba(16, 185, 129, 0.12), transparent 24%),
    var(--bg);
  color: var(--text);
  font-family: Arial, "Malgun Gothic", "맑은 고딕", sans-serif;
}

h1,
h2,
h3,
h4,
p {
  margin: 0;
}

.layout {
  display: grid;
  grid-template-columns: 250px minmax(0, 1fr);
  gap: 20px;
  min-height: 100vh;
  padding: 20px;
}

.side {
  position: sticky;
  top: 20px;
  height: calc(100vh - 40px);
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.main {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.brand,
.side-card,
.card,
.hero,
.kpi {
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(219, 228, 240, 0.9);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
}

.brand {
  padding: 16px;
  display: flex;
  align-items: center;
  gap: 13px;
}

.brand-icon {
  width: 46px;
  height: 46px;
  border-radius: 16px;
  background: linear-gradient(135deg, var(--blue), var(--green));
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: 900;
}

.brand strong {
  display: block;
  font-size: 18px;
}

.brand span {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 13px;
}

.nav {
  background: linear-gradient(180deg, var(--navy), var(--navy-2));
  border-radius: var(--radius-lg);
  padding: 10px;
  box-shadow: var(--shadow);
}

.nav a {
  display: block;
  color: #b8c6da;
  padding: 12px 14px;
  border-radius: 15px;
  font-size: 14px;
  font-weight: 800;
  text-decoration: none;
  margin-bottom: 4px;
}

.nav a.active,
.nav a:hover {
  background: rgba(37, 99, 235, 0.95);
  color: #fff;
}

.side-card {
  padding: 16px;
}

.side-card.dark {
  margin-top: auto;
  min-height: 132px;
  background: linear-gradient(135deg, var(--navy), #0f2f72);
  color: #fff;
}

.side-card.dark span,
.side-card.dark em {
  color: #b8c6da;
}

.side-card.dark strong {
  display: block;
  font-size: 32px;
  margin: 8px 0;
}

.side-label {
  display: block;
  color: var(--muted);
  font-size: 13px;
  font-weight: 900;
  margin-bottom: 10px;
}

input,
select,
button {
  border: 1px solid #cbd5e1;
  border-radius: var(--radius-sm);
  padding: 12px 13px;
  font-size: 14px;
  background: #fff;
  color: var(--text);
}

input,
.side-card button {
  width: 100%;
}

button {
  background: linear-gradient(135deg, #0f172a, #1d4ed8);
  border: none;
  color: #fff;
  font-weight: 900;
  cursor: pointer;
}

button:hover {
  filter: brightness(1.04);
}

.side-card button {
  margin-top: 10px;
}

.hero {
  min-height: 142px;
  padding: 26px 30px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  overflow: hidden;
  position: relative;
}

.hero::after {
  content: "";
  position: absolute;
  right: 230px;
  top: 28px;
  width: 360px;
  height: 112px;
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(37, 99, 235, 0.10), rgba(16, 185, 129, 0.08));
  transform: rotate(-5deg);
  opacity: 0.85;
}

.eyebrow,
h1,
#pageSub,
.complete-card {
  position: relative;
  z-index: 1;
}

.eyebrow {
  color: var(--blue);
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0.12em;
  margin-bottom: 10px;
}

h1 {
  font-size: 32px;
  letter-spacing: -0.06em;
  margin-bottom: 10px;
}

#pageSub {
  color: var(--muted);
}

.complete-card {
  min-width: 220px;
  display: flex;
  align-items: center;
  gap: 14px;
  background: #f8fbff;
  border: 1px solid #bfdbfe;
  border-radius: 22px;
  padding: 16px;
}

.check {
  width: 46px;
  height: 46px;
  border-radius: 999px;
  background: var(--green);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  font-weight: 900;
}

.complete-card strong {
  display: block;
  font-size: 22px;
}

.complete-card span {
  color: var(--muted);
  font-size: 13px;
}

.kpi-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.kpi {
  min-height: 104px;
  padding: 18px 20px;
  display: flex;
  align-items: center;
  gap: 15px;
}

.kpi-icon {
  width: 48px;
  height: 48px;
  border-radius: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  font-size: 22px;
}

.kpi-icon.green { color: #047857; background: #d1fae5; }
.kpi-icon.blue { color: #1d4ed8; background: #dbeafe; }
.kpi-icon.purple { color: #6d28d9; background: #ede9fe; }
.kpi-icon.navy { color: #0f172a; background: #e2e8f0; }

.kpi span,
.kpi em {
  display: block;
  color: var(--muted);
  font-size: 13px;
  font-style: normal;
}

.kpi strong {
  display: block;
  font-size: 28px;
  margin: 4px 0;
}

.dashboard-grid {
  display: grid;
  grid-template-columns: 300px minmax(560px, 1fr) 320px;
  grid-template-areas:
    "summary leaders watch"
    "breakout leaders watch"
    "theme supply supply"
    "minervini minervini minervini"
    "valuation valuation valuation";
  gap: 18px;
  align-items: start;
}

.card { padding: 20px; }
.market-summary { grid-area: summary; }
.leaders-card { grid-area: leaders; }
.watch-card-wrap { grid-area: watch; }
.breakout-card { grid-area: breakout; }
.theme-card { grid-area: theme; min-height: 230px; }
.supply-card { grid-area: supply; min-height: 230px; }
.minervini-card { grid-area: minervini; }
.valuation-card { grid-area: valuation; }

.card-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 16px;
}

.card-head h2 {
  font-size: 21px;
  letter-spacing: -0.04em;
  margin-bottom: 5px;
}

.card-head p {
  color: var(--muted);
  font-size: 14px;
}

.pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #f1f5f9;
  color: #334155;
  border-radius: 999px;
  padding: 7px 12px;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}

.pill.blue { background: #dbeafe; color: #1d4ed8; }
.pill.green { background: #d1fae5; color: #047857; }
.pill.orange { background: #ffedd5; color: #c2410c; }

.summary-box {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  margin-bottom: 16px;
}

.summary-box div {
  min-height: 54px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 17px;
  padding: 14px;
}

.summary-box span { color: var(--muted); font-size: 12px; font-weight: 800; }
.summary-box strong { display: block; font-size: 22px; }

.insight-list {
  padding-left: 18px;
  margin: 4px 0 0;
  color: #475569;
  font-size: 13px;
  line-height: 1.75;
}

.table-wrap {
  width: 100%;
  overflow: auto;
  border: 1px solid #dfe7f1;
  border-radius: var(--radius-md);
  background: #fff;
}

table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 13px;
  table-layout: fixed;
}

th,
td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--line-soft);
  white-space: nowrap;
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
}

th {
  position: sticky;
  top: 0;
  z-index: 10;
  background: linear-gradient(180deg, #f8fafc, #f1f5f9);
  color: #334155;
  font-size: 12px;
  font-weight: 900;
}

tbody tr:nth-child(even) { background: #fcfdff; }
td strong { font-weight: 900; }
td small { color: var(--muted); font-size: 11px; font-weight: 800; }

.pos { color: var(--red); font-weight: 900; }
.neg { color: var(--blue); font-weight: 900; }

.score {
  display: inline-flex;
  min-width: 50px;
  justify-content: center;
  border-radius: 999px;
  padding: 5px 9px;
  background: linear-gradient(135deg, #d1fae5, #ecfdf5);
  color: #047857;
  font-weight: 900;
}

.leaders-card .table-wrap,
.supply-card .table-wrap,
.valuation-card .table-wrap {
  max-height: 560px;
  overflow-y: auto;
  overflow-x: auto;
}

.leaders-card th,
.supply-card th,
.valuation-card th {
  position: sticky;
  top: 0;
  z-index: 20;
}

.leaders-card table,
.supply-card table,
.valuation-card table {
  min-width: 760px;
}

.valuation-card table { min-width: 1180px; }

.leaders-card th:nth-child(1), .leaders-card td:nth-child(1) { width: 60px; }
.leaders-card th:nth-child(2), .leaders-card td:nth-child(2) { width: 170px; white-space: normal; }
.leaders-card th:nth-child(3), .leaders-card td:nth-child(3) { width: 90px; }
.leaders-card th:nth-child(4), .leaders-card td:nth-child(4) { width: 100px; }
.leaders-card th:nth-child(5), .leaders-card td:nth-child(5) { width: 100px; }
.leaders-card th:nth-child(6), .leaders-card td:nth-child(6) { width: 120px; }
.leaders-card th:nth-child(7), .leaders-card td:nth-child(7) { width: 90px; }

.supply-card th:nth-child(1), .supply-card td:nth-child(1) { width: 60px; }
.supply-card th:nth-child(2), .supply-card td:nth-child(2) { width: 170px; white-space: normal; }
.supply-card th:nth-child(3), .supply-card td:nth-child(3),
.supply-card th:nth-child(4), .supply-card td:nth-child(4),
.supply-card th:nth-child(5), .supply-card td:nth-child(5),
.supply-card th:nth-child(6), .supply-card td:nth-child(6) { width: 120px; }
.supply-card th:nth-child(7), .supply-card td:nth-child(7) { width: 90px; }

.valuation-card th:nth-child(1), .valuation-card td:nth-child(1) { width: 58px; }
.valuation-card th:nth-child(2), .valuation-card td:nth-child(2) { width: 170px; white-space: normal; }
.valuation-card th:nth-child(3), .valuation-card td:nth-child(3) { width: 190px; white-space: normal; }
.valuation-card th:nth-child(4), .valuation-card td:nth-child(4) { width: 88px; }
.valuation-card th:nth-child(5), .valuation-card td:nth-child(5) { width: 110px; }
.valuation-card th:nth-child(6), .valuation-card td:nth-child(6),
.valuation-card th:nth-child(7), .valuation-card td:nth-child(7),
.valuation-card th:nth-child(8), .valuation-card td:nth-child(8),
.valuation-card th:nth-child(9), .valuation-card td:nth-child(9),
.valuation-card th:nth-child(10), .valuation-card td:nth-child(10) { width: 100px; }

th[data-sort] {
  cursor: pointer;
  user-select: none;
  position: sticky;
  top: 0;
  padding-right: 24px;
}

th[data-sort]::after {
  content: "↕";
  position: absolute;
  right: 8px;
  color: #94a3b8;
  font-size: 11px;
}

th[data-sort].sort-asc::after { content: "▲"; color: var(--blue); }
th[data-sort].sort-desc::after { content: "▼"; color: var(--blue); }

.leaders-card .table-wrap::-webkit-scrollbar,
.supply-card .table-wrap::-webkit-scrollbar,
.valuation-card .table-wrap::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

.leaders-card .table-wrap::-webkit-scrollbar-thumb,
.supply-card .table-wrap::-webkit-scrollbar-thumb,
.valuation-card .table-wrap::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 999px;
}

.watch-list,
.breakout-list,
.theme-list,
.supply-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.watch-card,
.breakout-item,
.theme-row {
  border: 1px solid #dfe7f1;
  border-radius: var(--radius-md);
  padding: 14px;
  background: linear-gradient(135deg, #fff, #f7fbff);
}

.watch-card h4 { font-size: 15px; margin-bottom: 8px; }
.watch-card .rank {
  display: inline-flex;
  width: 28px;
  height: 28px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #06142b;
  color: #fff;
  font-weight: 900;
  margin-right: 8px;
}
.watch-card p,
.breakout-item p { color: #5b677a; font-size: 12.5px; line-height: 1.45; }

.tags,
.breakout-meta,
.theme-meta,
.valuation-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.tag,
.breakout-meta span,
.theme-meta span {
  display: inline-flex;
  border-radius: 999px;
  background: #eff6ff;
  color: #1d4ed8;
  padding: 4px 8px;
  font-size: 12px;
  font-weight: 900;
}

.tag.muted {
  background: #f1f5f9;
  color: #64748b;
}

.breakout-main,
.theme-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 8px;
}

.breakout-main strong,
.theme-top strong { display: block; font-size: 15px; font-weight: 900; }
.breakout-main small,
.theme-top span { display: block; color: var(--muted); font-size: 11px; font-weight: 800; margin-top: 2px; }
.signal-label { white-space: nowrap; border-radius: 999px; padding: 5px 9px; font-size: 12px; font-weight: 900; }
.label-red { background: #fee2e2; color: #b91c1c; }
.label-orange { background: #ffedd5; color: #c2410c; }
.label-blue { background: #dbeafe; color: #1d4ed8; }
.label-gray { background: #f1f5f9; color: #475569; }

.theme-bar {
  width: 100%;
  height: 10px;
  border-radius: 999px;
  background: #e2e8f0;
  overflow: hidden;
  margin: 10px 0;
}
.theme-bar b { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, var(--blue), var(--green)); }
.theme-top em { color: var(--blue); font-style: normal; font-weight: 900; }

.valuation-card-head { align-items: flex-start; }
.valuation-head-tools {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}
.valuation-scope-tabs {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.valuation-scope-btn {
  width: auto;
  border: 1px solid #cbd5e1;
  background: #fff;
  color: #334155;
  border-radius: 999px;
  padding: 9px 12px;
  font-size: 12px;
  font-weight: 900;
  box-shadow: none;
}
.valuation-scope-btn.active {
  border-color: #2563eb;
  background: #eff6ff;
  color: #1d4ed8;
}
.valuation-market-select {
  width: 112px;
  height: 38px;
  padding: 8px 10px;
  font-size: 13px;
  font-weight: 900;
}
.empty {
  color: var(--muted);
  text-align: center;
  padding: 28px;
}
.footer-note {
  text-align: center;
  color: var(--muted);
  padding: 12px 0 22px;
  font-size: 13px;
}

@media (max-width: 1500px) {
  .dashboard-grid {
    grid-template-columns: minmax(0, 1fr) 340px;
    grid-template-areas:
      "leaders watch"
      "summary watch"
      "breakout watch"
      "theme supply"
      "minervini minervini"
      "valuation valuation";
  }
}

@media (max-width: 1300px) {
  .layout { grid-template-columns: 1fr; }
  .side { position: static; height: auto; display: grid; grid-template-columns: 1fr 1fr; }
  .brand, .nav { grid-column: span 2; }
  .side-card.dark { margin-top: 0; }
  .kpi-row { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 1200px) {
  .dashboard-grid {
    grid-template-columns: 1fr;
    grid-template-areas:
      "summary"
      "leaders"
      "watch"
      "breakout"
      "theme"
      "supply"
      "minervini"
      "valuation";
  }
}

@media (max-width: 760px) {
  .layout { padding: 12px; }
  .side, .kpi-row { grid-template-columns: 1fr; }
  .brand, .nav { grid-column: span 1; }
  .hero { flex-direction: column; align-items: flex-start; }
  .hero::after { display: none; }
  h1 { font-size: 28px; }
  .complete-card { min-width: 0; width: 100%; }
  .card-head { flex-direction: column; }
  .valuation-head-tools { justify-content: flex-start; }
}


/* ===============================
   Final numeric/table polish
   - sticky headers
   - right aligned numeric values
   - no duplicated unit text in cells
================================ */
.unit-note {
  display: inline-flex;
  margin-left: 8px;
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}

.leaders-card .table-wrap,
.supply-card .table-wrap,
.valuation-card .table-wrap {
  max-height: 560px !important;
  overflow-y: auto !important;
  overflow-x: auto !important;
  position: relative;
}

.leaders-card table,
.supply-card table,
.valuation-card table {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  table-layout: fixed !important;
}

.leaders-card thead th,
.supply-card thead th,
.valuation-card thead th,
.leaders-card th[data-sort],
.supply-card th[data-sort],
.valuation-card th[data-sort] {
  position: sticky !important;
  top: 0 !important;
  z-index: 50 !important;
  background: linear-gradient(180deg, #f8fafc, #f1f5f9) !important;
  box-shadow: 0 1px 0 #dbe4f0;
}

.leaders-card td.num,
.supply-card td.num,
.valuation-card td.num,
.leaders-card th:nth-child(4),
.leaders-card th:nth-child(5),
.leaders-card th:nth-child(6),
.leaders-card th:nth-child(7),
.supply-card th:nth-child(3),
.supply-card th:nth-child(4),
.supply-card th:nth-child(5),
.supply-card th:nth-child(6),
.supply-card th:nth-child(7),
.valuation-card th:nth-child(5),
.valuation-card th:nth-child(6),
.valuation-card th:nth-child(7),
.valuation-card th:nth-child(8),
.valuation-card th:nth-child(9),
.valuation-card th:nth-child(10) {
  text-align: right !important;
}

.leaders-card td:nth-child(2),
.supply-card td:nth-child(2),
.valuation-card td:nth-child(2),
.valuation-card td:nth-child(3) {
  white-space: normal;
}

.score {
  min-width: 42px;
}


/* ===============================
   Stock chart modal
================================ */
.stock-link {
  display: inline-block;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  font: inherit;
  cursor: pointer;
}
.stock-link:hover strong {
  color: var(--blue);
  text-decoration: underline;
}

.chart-modal.hidden {
  display: none !important;
}

.chart-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
}

.chart-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.50);
}

.chart-modal-card {
  position: relative;
  z-index: 1;
  width: min(1380px, calc(100vw - 28px));
  height: min(920px, calc(100vh - 28px));
  margin: 14px auto;
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.30);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.chart-modal-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  padding: 16px 18px 10px;
  border-bottom: 1px solid #e5e7eb;
}

.chart-modal-head h3 {
  margin: 0 0 6px;
  font-size: 24px;
  letter-spacing: -0.04em;
}

.chart-modal-meta {
  color: #475569;
  font-size: 13px;
  line-height: 1.75;
}

.chart-modal-controls {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.chart-modal-controls label {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.chart-modal-controls label span {
  color: #64748b;
  font-size: 12px;
}

.chart-modal-controls select {
  width: 92px;
  padding: 10px 12px;
}

.chart-modal-controls input {
  width: 110px;
  padding: 10px 12px;
}

.chart-modal-controls button {
  width: auto;
  padding: 10px 13px;
  border-radius: 10px;
}

.chart-modal-close {
  min-width: 42px;
  background: #fff;
  color: #111827;
  border: 1px solid #cbd5e1;
}

.chart-modal-note {
  padding: 10px 18px 0;
  color: #64748b;
  font-size: 12px;
}

.chart-popup {
  width: 100%;
  flex: 1;
  min-height: 0;
}

.break {
  color: #16a34a;
  font-weight: 900;
}

.fail {
  color: #dc2626;
  font-weight: 900;
}

@media (max-width: 900px) {
  .chart-modal-card {
    height: calc(100vh - 16px);
    width: calc(100vw - 16px);
    margin: 8px auto;
  }

  .chart-modal-head {
    flex-direction: column;
  }

  .chart-popup {
    min-height: 660px;
  }
}

/* ===============================
   Valuation load-more paging
================================ */
.valuation-more-wrap {
  display: flex;
  justify-content: center;
  padding: 12px 0 2px;
}

.valuation-more-btn {
  width: auto;
  min-width: 180px;
  border-radius: 999px;
  padding: 10px 18px;
  font-size: 13px;
  font-weight: 900;
  background: linear-gradient(135deg, #0f172a, #1d4ed8);
  color: #fff;
}

.valuation-more-btn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.hidden {
  display: none !important;
}

/* =========================================================
   A안: 리포트형 원페이지 대시보드 레이아웃 오버라이드
   - 좌측 사이드바 제거
   - 상단 타이틀/날짜 컨트롤
   - 첫 화면 밀도 개선
========================================================= */
.report-layout {
  display: block !important;
  max-width: 1880px;
  margin: 0 auto;
  padding: 20px 24px 28px;
  min-height: 100vh;
}

.report-main {
  width: 100%;
  gap: 14px;
}

.report-topbar {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 18px;
  margin-bottom: 12px;
}

.report-title-wrap {
  display: flex;
  align-items: center;
  gap: 16px;
  min-width: 0;
}

.report-logo {
  width: 58px;
  height: 58px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: 900;
  font-size: 28px;
  transform: rotate(-20deg);
  background: linear-gradient(135deg, #2563eb, #1d4ed8 55%, #10b981);
  box-shadow: 0 14px 28px rgba(37, 99, 235, 0.25);
}

.report-topbar h1 {
  margin: 0 0 6px;
  font-size: 36px;
  line-height: 1.05;
  letter-spacing: -0.06em;
}

.report-topbar p {
  color: #64748b;
  font-size: 15px;
}

.report-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
  min-width: 330px;
}

.date-control {
  height: 44px;
  display: flex;
  align-items: center;
  gap: 9px;
  border: 1px solid #cbd5e1;
  background: rgba(255, 255, 255, 0.9);
  border-radius: 12px;
  padding: 0 12px;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.04);
}

.date-control input {
  width: 120px;
  padding: 0;
  border: 0;
  background: transparent;
  font-weight: 900;
  text-align: center;
  outline: none;
}

.refresh-btn {
  width: auto;
  height: 44px;
  padding: 0 16px;
  border: 1px solid #cbd5e1;
  color: #0f172a;
  background: rgba(255, 255, 255, 0.92);
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.04);
}

.report-kpis {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 14px;
}

.report-kpis .kpi {
  min-height: 96px;
  padding: 17px 18px;
}

.report-kpis .kpi strong {
  font-size: 28px;
}

.report-grid {
  display: grid;
  grid-template-columns: 1.06fr 1.25fr 1.25fr 1.05fr;
  grid-template-areas:
    "summary leaders leaders watch"
    "breakout leaders leaders watch"
    "theme supply supply supply"
    "minervini minervini minervini minervini"
    "valuation valuation valuation valuation";
  gap: 14px;
  align-items: start;
}

.card {
  padding: 16px 18px;
  border-radius: 18px;
}

.compact-head {
  margin-bottom: 12px;
}

.card-head h2 {
  font-size: 19px;
  margin-bottom: 4px;
}

.card-head p {
  font-size: 12.5px;
  line-height: 1.45;
}

.unit-note {
  display: inline;
  margin-left: 5px;
  font-size: 11.5px;
}

.compact-summary {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}

.compact-summary div {
  min-height: 58px;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 4px;
  padding: 10px 12px;
}

.compact-summary strong {
  font-size: 22px;
}

.insight-list {
  font-size: 12.5px;
  line-height: 1.6;
}

.leaders-card .table-wrap {
  max-height: 380px !important;
}

.supply-card .table-wrap {
  max-height: 340px !important;
}

.valuation-card .table-wrap {
  max-height: 420px !important;
}

.watch-list,
.breakout-list,
.theme-list {
  gap: 9px;
}

.watch-card,
.breakout-item,
.theme-row {
  padding: 12px 13px;
  border-radius: 15px;
}

.watch-card h4,
.breakout-main strong,
.theme-top strong {
  font-size: 14px;
}

.watch-card p,
.breakout-item p {
  font-size: 12px;
}

.watch-card-wrap .watch-list,
.breakout-card .breakout-list,
.theme-card .theme-list {
  max-height: 370px;
  overflow-y: auto;
  padding-right: 3px;
}

.theme-card .theme-list {
  max-height: 380px;
}

.valuation-card-head {
  align-items: center;
}

.valuation-head-tools {
  gap: 7px;
}

.valuation-scope-tabs {
  gap: 5px;
}

.valuation-scope-btn {
  padding: 8px 10px;
  font-size: 11.5px;
}

.valuation-market-select {
  height: 36px;
  padding: 7px 10px;
}

.footer-note {
  margin-top: 0;
  border-radius: 14px;
  background: rgba(255,255,255,.65);
}

/* 테이블 밀도 조정 */
th, td {
  padding: 9px 10px;
  font-size: 12.5px;
}

.score {
  min-width: 38px;
  padding: 4px 8px;
}

/* 기존 사이드바가 없는 A안에서 불필요한 여백/그리드 보정 */
.hero,
.side,
.brand,
.nav,
.side-card {
  /* HTML에서 제거했지만 구버전 캐시 대비 */
}

@media (max-width: 1500px) {
  .report-grid {
    grid-template-columns: 1fr 1.35fr 1fr;
    grid-template-areas:
      "summary leaders watch"
      "breakout leaders watch"
      "theme supply supply"
      "valuation valuation valuation";
  }
  .report-kpis {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 1200px) {
  .report-topbar {
    flex-direction: column;
  }
  .report-actions {
    width: 100%;
    justify-content: flex-start;
  }
  .report-grid {
    grid-template-columns: 1fr;
    grid-template-areas:
      "summary"
      "leaders"
      "watch"
      "breakout"
      "theme"
      "supply"
      "minervini"
      "valuation";
  }
  .report-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  .report-layout {
    padding: 12px;
  }
  .report-title-wrap {
    align-items: flex-start;
  }
  .report-logo {
    width: 48px;
    height: 48px;
    font-size: 22px;
  }
  .report-topbar h1 {
    font-size: 27px;
  }
  .report-kpis {
    grid-template-columns: 1fr !important;
  }
  .date-control,
  .refresh-btn {
    width: 100%;
  }
  .date-control input {
    width: 100%;
    text-align: left;
  }
  .valuation-card-head {
    align-items: flex-start;
  }
}

/* =========================================================
   Layout Align v2
   - 주도주는 약 15행 기준으로 제한
   - 좌측 시장요약 + 신고가 후보는 주도주 높이에 맞춤
   - 테마·섹터와 기관·외국인 수급 높이 동기화
   - 과도한 공백 제거
========================================================= */
.report-main {
  gap: 14px;
}

.report-topbar {
  margin-bottom: 0;
}

.report-kpis {
  gap: 12px !important;
}

.report-kpis .kpi {
  min-height: 88px;
  padding: 14px 16px;
}

.report-kpis .kpi-icon {
  width: 44px;
  height: 44px;
  border-radius: 16px;
}

.report-kpis .kpi strong {
  font-size: 25px;
  line-height: 1.05;
}

/* 4컬럼 리포트 레이아웃: 상단 2개 row 합계가 주도주/관심종목 높이 */
.report-grid {
  align-items: start !important;
  gap: 14px;
  grid-template-columns: 0.92fr 1.18fr 1.18fr 0.88fr;
  grid-template-rows: 240px 386px 360px auto;
  grid-template-areas:
    "summary leaders leaders watch"
    "breakout leaders leaders watch"
    "theme supply supply supply"
    "minervini minervini minervini minervini"
    "valuation valuation valuation valuation";
}

.report-grid > .card {
  min-height: 0;
}

.market-summary,
.breakout-card,
.theme-card,
.leaders-card,
.watch-card-wrap,
.supply-card,
.valuation-card {
  display: flex;
  flex-direction: column;
}

.market-summary .card-head,
.breakout-card .card-head,
.theme-card .card-head,
.leaders-card .card-head,
.watch-card-wrap .card-head,
.supply-card .card-head,
.valuation-card .card-head {
  flex: 0 0 auto;
}

/* 좌측 상단: 시장요약은 고정 높이 내에서 간결하게 */
.market-summary {
  height: 240px;
  overflow: hidden;
}

.market-summary .compact-summary {
  margin-bottom: 8px;
}

.market-summary .insight-list {
  font-size: 12px;
  line-height: 1.5;
}

/* 신고가 후보: 시장요약 아래에서만 내부 스크롤 */
.breakout-card {
  height: 386px;
}

.breakout-card .breakout-list {
  flex: 1 1 auto;
  min-height: 0;
  max-height: none !important;
  overflow-y: auto;
  padding-right: 4px;
}

/* 주도주/관심종목: 약 15행 수준의 높이 */
.leaders-card,
.watch-card-wrap {
  height: 640px;
}

.leaders-card .table-wrap,
.watch-card-wrap .watch-list {
  flex: 1 1 auto;
  min-height: 0;
  max-height: none !important;
  overflow-y: auto;
  padding-right: 4px;
}

/* 행 높이를 줄여 주도주가 약 15행 정도 보이게 */
.leaders-card tbody tr,
.supply-card tbody tr,
.valuation-card tbody tr {
  height: 38px;
}

.leaders-card th,
.leaders-card td,
.supply-card th,
.supply-card td,
.valuation-card th,
.valuation-card td {
  padding-top: 7px;
  padding-bottom: 7px;
}

/* 관심종목 카드도 주도주 높이에 맞춰 내부 스크롤 */
.watch-card-wrap .watch-list {
  gap: 10px;
}

.watch-card,
.breakout-item,
.theme-row {
  padding: 11px 12px;
}

/* 테마와 수급 높이 정렬 */
.theme-card,
.supply-card {
  height: 360px;
}

.theme-card .theme-list,
.supply-card .table-wrap {
  flex: 1 1 auto;
  min-height: 0;
  max-height: none !important;
}

.theme-card .theme-list {
  overflow-y: auto;
  padding-right: 4px;
}

.supply-card .table-wrap {
  overflow-y: auto !important;
  overflow-x: auto !important;
}

/* 밸류에이션은 하단에서 과하게 길어지지 않게 */
.valuation-card .table-wrap {
  max-height: 430px !important;
  overflow-y: auto !important;
  overflow-x: auto !important;
}

/* 카드 내부 스크롤바 통일 */
.watch-card-wrap .watch-list::-webkit-scrollbar,
.breakout-card .breakout-list::-webkit-scrollbar,
.theme-card .theme-list::-webkit-scrollbar,
.leaders-card .table-wrap::-webkit-scrollbar,
.supply-card .table-wrap::-webkit-scrollbar,
.valuation-card .table-wrap::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

.watch-card-wrap .watch-list::-webkit-scrollbar-thumb,
.breakout-card .breakout-list::-webkit-scrollbar-thumb,
.theme-card .theme-list::-webkit-scrollbar-thumb,
.leaders-card .table-wrap::-webkit-scrollbar-thumb,
.supply-card .table-wrap::-webkit-scrollbar-thumb,
.valuation-card .table-wrap::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 999px;
}

/* 1500px 이하 3컬럼에서도 같은 높이 정책 유지 */
@media (max-width: 1500px) {
  .report-grid {
    align-items: start !important;
    grid-template-columns: 0.95fr 1.35fr 0.95fr;
    grid-template-rows: 240px 386px 360px auto;
    grid-template-areas:
      "summary leaders watch"
      "breakout leaders watch"
      "theme supply supply"
      "valuation valuation valuation";
  }

  .market-summary { height: 240px; }
  .breakout-card { height: 386px; }
  .leaders-card,
  .watch-card-wrap { height: 640px; }
  .theme-card,
  .supply-card { height: 360px; }
}

/* 모바일/좁은 화면에서는 고정 높이 해제 */
@media (max-width: 1200px) {
  .report-grid {
    align-items: start !important;
    grid-template-columns: 1fr;
    grid-template-rows: none;
    grid-template-areas:
      "summary"
      "leaders"
      "watch"
      "breakout"
      "theme"
      "supply"
      "minervini"
      "valuation";
  }

  .market-summary,
  .breakout-card,
  .leaders-card,
  .watch-card-wrap,
  .theme-card,
  .supply-card {
    height: auto;
  }

  .leaders-card .table-wrap,
  .watch-card-wrap .watch-list,
  .breakout-card .breakout-list,
  .theme-card .theme-list,
  .supply-card .table-wrap {
    max-height: 420px !important;
    min-height: 0;
  }
}


/* =========================================================
   Report date selector v1
   - 생성된 리포트 날짜만 선택
   - 이전/다음 리포트 이동
========================================================= */
.report-date-actions {
  gap: 8px;
  min-width: 520px;
}

.date-select-control {
  min-width: 176px;
  padding: 0 10px;
}

.date-select-control select {
  width: 128px;
  height: 40px;
  padding: 0 4px;
  border: 0;
  background: transparent;
  font-weight: 900;
  text-align: center;
  outline: none;
  cursor: pointer;
}

.date-nav-btn {
  width: auto;
  height: 44px;
  padding: 0 14px;
  border: 1px solid #cbd5e1;
  color: #0f172a;
  background: rgba(255, 255, 255, 0.92);
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.04);
  font-size: 13px;
}

.date-nav-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  filter: grayscale(0.3);
}

@media (max-width: 760px) {
  .report-date-actions {
    min-width: 0;
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .date-select-control {
    grid-column: span 2;
    width: 100%;
  }

  .date-select-control select {
    width: 100%;
    text-align: left;
  }

  .refresh-btn {
    grid-column: span 2;
  }
}


/* =========================================================
   Header/date/calendar + KPI alignment v3
   - 시장온도 KPI = 시장요약 폭
   - 주도주/관심/상태 KPI 합계 = 오늘의 주도주 폭
   - 실행시간 KPI = 내일 관심종목 폭
========================================================= */
.header-sub-hidden {
  display: none !important;
}

.report-logo {
  transform: none !important;
  font-size: 0 !important;
}

.report-logo svg {
  width: 34px;
  height: 34px;
  color: #fff;
  display: block;
}

.report-topbar h1 {
  margin-bottom: 0 !important;
}

.date-select-control {
  position: relative;
  gap: 8px;
}

.calendar-btn {
  width: 28px;
  height: 28px;
  min-width: 28px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #2563eb;
  box-shadow: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  cursor: pointer;
}

.calendar-btn:hover {
  filter: none;
  transform: translateY(-1px);
}

.calendar-native-input {
  position: absolute;
  left: 8px;
  top: 8px;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.date-select-control select {
  min-width: 150px;
}

/* 4컬럼 본문과 같은 기준으로 KPI 폭 배분 */
.report-kpis {
  display: grid !important;
  grid-template-columns: 0.92fr 0.786fr 0.786fr 0.786fr 0.88fr !important;
  gap: 14px !important;
}

.report-kpis .kpi {
  width: auto !important;
  min-width: 0;
}

/* 시장요약/신고가/테마 헤더 배지 제거 후 여백 정돈 */
.market-summary .card-head,
.breakout-card .card-head,
.theme-card .card-head {
  align-items: flex-start;
}

.market-summary .card-head > div,
.breakout-card .card-head > div,
.theme-card .card-head > div {
  width: 100%;
}

@media (max-width: 1500px) {
  .report-kpis {
    grid-template-columns: 0.95fr 0.45fr 0.45fr 0.45fr 0.95fr !important;
  }
}

@media (max-width: 1200px) {
  .report-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  .report-kpis {
    grid-template-columns: 1fr !important;
  }
  .date-select-control select {
    min-width: 0;
    width: 100%;
  }
}


/* ===============================
   Clickable stock names in side cards
   - 내일 관심종목 / 신고가·눌림목 후보 차트 팝업 연결
================================ */
.watch-card h4 {
  display: flex;
  align-items: center;
  gap: 8px;
}

.watch-card h4 .rank {
  flex: 0 0 auto;
}

.watch-card h4 .stock-link,
.breakout-main .stock-link {
  display: inline-block;
  width: auto;
  line-height: 1.25;
}

.breakout-stock-name {
  min-width: 0;
}

.breakout-main .stock-link strong,
.watch-card h4 .stock-link strong {
  font-size: 15px;
}

.breakout-main .stock-link small,
.watch-card h4 .stock-link small {
  display: block;
  margin-top: 2px;
}

/* 신고가·눌림목 카드 종목명/코드 간격 보정 */
.breakout-card .stock-link {
  line-height: 1.15;
}

.breakout-card .stock-link strong {
  display: block;
  margin-bottom: 0;
}

.breakout-card .stock-link small {
  display: block;
  margin-top: 0;
  line-height: 1.1;
}

/* 신고가·눌림목 카드 종목명/코드 간격 보정 */
.breakout-card .stock-link {
  width: auto;
  line-height: 1.15;
}

.breakout-card .stock-link br {
  display: none;
}

.breakout-card .stock-link strong {
  display: block;
  margin: 0 0 1px 0;
  line-height: 1.15;
}

.breakout-card .stock-link small {
  display: block;
  margin: 0;
  line-height: 1.1;
}
/* =========================================================
   Market index cards + mini stock charts v1
   - 최종본 위에 추가 적용
========================================================= */
.index-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.index-card {
  min-height: 112px;
  padding: 14px 16px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(219, 228, 240, 0.95);
  box-shadow: var(--shadow);
  overflow: hidden;
}

.index-card-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 6px;
}

.index-name {
  color: #334155;
  font-size: 13px;
  font-weight: 900;
}

.index-card-top strong {
  font-size: 22px;
  line-height: 1;
  letter-spacing: -0.03em;
}

.index-change {
  min-height: 18px;
  font-size: 12px;
  font-weight: 900;
  color: var(--muted);
}

.index-mini {
  height: 42px;
  margin-top: 6px;
}

.index-mini svg {
  width: 100%;
  height: 42px;
}

.index-mini-empty {
  height: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #94a3b8;
  background: #f8fafc;
  border-radius: 12px;
}

.index-supply-card {
  display: flex;
  flex-direction: column;
}

.index-supply-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  margin-top: 8px;
}

.index-supply-grid span {
  padding: 8px 9px;
  border-radius: 12px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.index-supply-grid b {
  display: block;
  margin-top: 3px;
  color: var(--text);
  font-size: 14px;
}

.index-supply-note {
  margin-top: 8px;
  color: var(--muted);
  font-size: 11.5px;
}

.mini-chart-th,
.mini-chart-td {
  text-align: center !important;
}

.mini-chart-td {
  padding-top: 6px !important;
  padding-bottom: 6px !important;
}

.mini-chart-pair {
  width: 108px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 2px 4px;
  border-radius: 11px;
  background: #f8fafc;
  border: 1px solid #edf2f7;
}

.mini-candle-one {
  width: 24px;
  height: 34px;
  flex: 0 0 24px;
}

.mini-sparkline {
  width: 74px;
  height: 34px;
  flex: 0 0 74px;
}

.mini-candle-svg,
.mini-line-svg {
  width: 100%;
  height: 100%;
  display: block;
  overflow: visible;
}

.mini-candle-svg line {
  stroke: #64748b;
  stroke-width: 1.7;
  stroke-linecap: round;
}

.mini-candle-svg rect {
  stroke-width: 0;
}

.mini-candle-svg.up rect {
  fill: #ef4444;
}

.mini-candle-svg.down rect {
  fill: #2563eb;
}

.mini-line-svg polyline,
.mini-line-svg path {
  fill: none;
  stroke: #2563eb;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.mini-chart-empty {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 108px;
  height: 38px;
  color: #94a3b8;
  border-radius: 11px;
  background: #f8fafc;
  border: 1px solid #edf2f7;
}

/* 차트 컬럼 추가에 따른 테이블 폭/컬럼 재보정 */
.leaders-card table,
.supply-card table {
  min-width: 900px !important;
}

.valuation-card table {
  min-width: 1300px !important;
}

.leaders-card th:nth-child(1), .leaders-card td:nth-child(1) { width: 56px !important; }
.leaders-card th:nth-child(2), .leaders-card td:nth-child(2) { width: 160px !important; white-space: normal; }
.leaders-card th:nth-child(3), .leaders-card td:nth-child(3) { width: 126px !important; }
.leaders-card th:nth-child(4), .leaders-card td:nth-child(4) { width: 84px !important; }
.leaders-card th:nth-child(5), .leaders-card td:nth-child(5) { width: 94px !important; }
.leaders-card th:nth-child(6), .leaders-card td:nth-child(6) { width: 94px !important; }
.leaders-card th:nth-child(7), .leaders-card td:nth-child(7) { width: 112px !important; }
.leaders-card th:nth-child(8), .leaders-card td:nth-child(8) { width: 76px !important; }

.supply-card th:nth-child(1), .supply-card td:nth-child(1) { width: 56px !important; }
.supply-card th:nth-child(2), .supply-card td:nth-child(2) { width: 160px !important; white-space: normal; }
.supply-card th:nth-child(3), .supply-card td:nth-child(3) { width: 126px !important; }
.supply-card th:nth-child(4), .supply-card td:nth-child(4),
.supply-card th:nth-child(5), .supply-card td:nth-child(5),
.supply-card th:nth-child(6), .supply-card td:nth-child(6),
.supply-card th:nth-child(7), .supply-card td:nth-child(7) { width: 112px !important; }
.supply-card th:nth-child(8), .supply-card td:nth-child(8) { width: 76px !important; }

.valuation-card th:nth-child(1), .valuation-card td:nth-child(1) { width: 54px !important; }
.valuation-card th:nth-child(2), .valuation-card td:nth-child(2) { width: 160px !important; white-space: normal; }
.valuation-card th:nth-child(3), .valuation-card td:nth-child(3) { width: 126px !important; }
.valuation-card th:nth-child(4), .valuation-card td:nth-child(4) { width: 180px !important; white-space: normal; }
.valuation-card th:nth-child(5), .valuation-card td:nth-child(5) { width: 82px !important; }
.valuation-card th:nth-child(6), .valuation-card td:nth-child(6) { width: 100px !important; }
.valuation-card th:nth-child(7), .valuation-card td:nth-child(7),
.valuation-card th:nth-child(8), .valuation-card td:nth-child(8),
.valuation-card th:nth-child(9), .valuation-card td:nth-child(9),
.valuation-card th:nth-child(10), .valuation-card td:nth-child(10),
.valuation-card th:nth-child(11), .valuation-card td:nth-child(11) { width: 96px !important; }

/* 숫자 컬럼 오른쪽 정렬 보정: 차트 컬럼 추가 후 위치 변경 */
.leaders-card th:nth-child(5),
.leaders-card th:nth-child(6),
.leaders-card th:nth-child(7),
.leaders-card th:nth-child(8),
.supply-card th:nth-child(4),
.supply-card th:nth-child(5),
.supply-card th:nth-child(6),
.supply-card th:nth-child(7),
.supply-card th:nth-child(8),
.valuation-card th:nth-child(6),
.valuation-card th:nth-child(7),
.valuation-card th:nth-child(8),
.valuation-card th:nth-child(9),
.valuation-card th:nth-child(10),
.valuation-card th:nth-child(11) {
  text-align: right !important;
}

@media (max-width: 1200px) {
  .index-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .index-strip {
    grid-template-columns: 1fr;
  }
}


/* =========================================================
   Mini chart speed/color v2
   - 종목 미니 선차트: 당일 종가 >= 시가이면 빨강, 아니면 파랑
========================================================= */
.mini-line-svg.up polyline,
.mini-line-svg.up path {
  stroke: var(--red) !important;
}

.mini-line-svg.down polyline,
.mini-line-svg.down path {
  stroke: var(--blue) !important;
}


/* =========================================================
   Fix v3: index fallback UI + compact leaders table
   - 주도주 종가/거래대금 폭 축소로 전체 컬럼 노출
   - 시장요약 2줄 표시 안정화
========================================================= */
.market-summary .insight-list {
  display: block;
  margin-top: 8px;
  padding-left: 16px;
  font-size: 12.2px;
  line-height: 1.55;
  max-height: 44px;
  overflow: hidden;
}

.leaders-card table {
  min-width: 760px !important;
}

.leaders-card th:nth-child(1),
.leaders-card td:nth-child(1) { width: 44px !important; }

.leaders-card th:nth-child(2),
.leaders-card td:nth-child(2) { width: 132px !important; white-space: normal; }

.leaders-card th:nth-child(3),
.leaders-card td:nth-child(3) { width: 116px !important; }

.leaders-card th:nth-child(4),
.leaders-card td:nth-child(4) { width: 64px !important; }

.leaders-card th:nth-child(5),
.leaders-card td:nth-child(5) { width: 76px !important; }

.leaders-card th:nth-child(6),
.leaders-card td:nth-child(6) { width: 82px !important; }

.leaders-card th:nth-child(7),
.leaders-card td:nth-child(7) { width: 78px !important; }

.leaders-card th:nth-child(8),
.leaders-card td:nth-child(8) { width: 54px !important; }

.leaders-card th,
.leaders-card td {
  padding-left: 8px !important;
  padding-right: 8px !important;
}

.leaders-card .score {
  min-width: 34px;
  padding-left: 6px;
  padding-right: 6px;
}

.index-card .index-value {
  font-variant-numeric: tabular-nums;
}


/* =========================================================
   MarketBrief v6 polish
   - 종목 미니차트는 단일 일봉만 표시
   - 지수 카드는 숫자 중심 표시
   - 시장 수급 탭 UI
========================================================= */
.index-mini {
  display: none !important;
}

.index-card {
  min-height: 104px !important;
}

.index-card-top strong {
  font-size: 25px !important;
}

.index-change {
  margin-top: 8px;
  font-size: 13px !important;
}

.market-supply-tabs {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
  margin-top: 7px;
}

.market-supply-tab {
  width: auto;
  padding: 5px 8px;
  border-radius: 999px;
  border: 1px solid #cbd5e1;
  background: #fff;
  color: #475569;
  font-size: 11px;
  font-weight: 900;
  box-shadow: none;
}

.market-supply-tab.active {
  border-color: #2563eb;
  background: #eff6ff;
  color: #1d4ed8;
}

.mini-chart-pair.candle-only {
  width: 46px !important;
  height: 40px !important;
  gap: 0 !important;
  padding: 1px 2px !important;
}

.mini-chart-pair.candle-only .mini-candle-one {
  width: 28px !important;
  height: 38px !important;
  flex-basis: 28px !important;
}

.mini-chart-pair.candle-only .mini-sparkline,
.mini-sparkline {
  display: none !important;
}

.mini-chart-empty {
  width: 46px !important;
  height: 40px !important;
}

.leaders-card table,
.supply-card table {
  min-width: 820px !important;
}

.valuation-card table {
  min-width: 1220px !important;
}

.leaders-card th:nth-child(1), .leaders-card td:nth-child(1) { width: 52px !important; }
.leaders-card th:nth-child(2), .leaders-card td:nth-child(2) { width: 150px !important; }
.leaders-card th:nth-child(3), .leaders-card td:nth-child(3) { width: 64px !important; }
.leaders-card th:nth-child(4), .leaders-card td:nth-child(4) { width: 78px !important; }
.leaders-card th:nth-child(5), .leaders-card td:nth-child(5) { width: 82px !important; }
.leaders-card th:nth-child(6), .leaders-card td:nth-child(6) { width: 88px !important; }
.leaders-card th:nth-child(7), .leaders-card td:nth-child(7) { width: 92px !important; }
.leaders-card th:nth-child(8), .leaders-card td:nth-child(8) { width: 66px !important; }

.supply-card th:nth-child(1), .supply-card td:nth-child(1) { width: 52px !important; }
.supply-card th:nth-child(2), .supply-card td:nth-child(2) { width: 150px !important; }
.supply-card th:nth-child(3), .supply-card td:nth-child(3) { width: 64px !important; }
.supply-card th:nth-child(4), .supply-card td:nth-child(4),
.supply-card th:nth-child(5), .supply-card td:nth-child(5),
.supply-card th:nth-child(6), .supply-card td:nth-child(6),
.supply-card th:nth-child(7), .supply-card td:nth-child(7) { width: 102px !important; }
.supply-card th:nth-child(8), .supply-card td:nth-child(8) { width: 66px !important; }

.valuation-card th:nth-child(3), .valuation-card td:nth-child(3) { width: 64px !important; }

/* =========================================================
   MarketBrief v7 final layout
   - 리포트상태/실행시간 제거 후 지수+시장수급 상단 통합
   - 지수 카드는 숫자 중심 compact 표시
   - 시장요약 2줄 잘림 방지
   - 주도주 테이블 폭 재압축
========================================================= */
.report-kpis-v7 {
  display: grid !important;
  grid-template-columns: 0.72fr 0.72fr 0.72fr 2.05fr 1.25fr !important;
  gap: 12px !important;
  align-items: stretch !important;
}

.report-kpis-v7 .kpi {
  min-width: 0;
  min-height: 96px !important;
  padding: 14px 16px !important;
}

.report-kpis-v7 .kpi-compact strong {
  font-size: 25px !important;
}

.index-combo-card,
.index-supply-card {
  display: block !important;
  min-height: 96px !important;
}

.index-combo-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  width: 100%;
  height: 100%;
}

.index-mini-item {
  min-width: 0;
  border-right: 1px solid #e2e8f0;
  padding: 0 10px 0 0;
}
.index-mini-item:last-child { border-right: 0; padding-right: 0; }

.index-mini-item .index-name,
.index-supply-card .index-name {
  display: block;
  color: #0f172a;
  font-size: 13px;
  font-weight: 900;
  margin-bottom: 5px;
}

.index-mini-item strong,
.index-supply-card #idxSupplyTotal {
  display: block;
  color: #020617;
  font-size: 24px;
  line-height: 1.08;
  text-align: right;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}

.index-mini-item .index-change {
  display: block;
  margin-top: 6px;
  font-size: 12.5px !important;
  font-style: normal;
  font-weight: 900;
  text-align: left;
}

.index-combo-card .index-mini,
.index-strip,
.index-mini-empty {
  display: none !important;
}

.index-supply-card .index-card-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 5px;
}

.index-supply-card #idxSupplyTotal {
  font-size: 23px;
  white-space: nowrap;
}

.market-supply-tabs {
  margin: 4px 0 8px !important;
  gap: 5px !important;
}

.market-supply-tab {
  padding: 4px 8px !important;
  font-size: 10.5px !important;
}

.index-supply-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px !important;
}

.index-supply-grid span {
  min-height: 44px !important;
  padding: 8px 9px !important;
  font-size: 12px !important;
}

.index-supply-grid b {
  display: block;
  margin-top: 4px;
  font-size: 14px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}

.index-supply-note {
  margin-top: 7px !important;
  font-size: 11.5px !important;
  line-height: 1.25 !important;
  color: #64748b !important;
}

.index-change.pos,
.index-mini-item strong.pos,
.index-supply-card .pos,
.index-supply-grid b.pos { color: var(--red) !important; }
.index-change.neg,
.index-mini-item strong.neg,
.index-supply-card .neg,
.index-supply-grid b.neg { color: var(--blue) !important; }

.market-summary {
  height: 240px !important;
  overflow: hidden !important;
  padding: 18px 20px !important;
}

.market-summary .card-head {
  margin-bottom: 10px !important;
}

.market-summary .compact-summary {
  margin-bottom: 8px !important;
  gap: 7px !important;
}

.market-summary .compact-summary div {
  min-height: 50px !important;
  padding: 8px 10px !important;
}

.market-summary .compact-summary strong {
  font-size: 20px !important;
}

.market-summary .insight-list {
  display: block !important;
  max-height: none !important;
  overflow: visible !important;
  margin: 6px 0 0 !important;
  padding-left: 15px !important;
  font-size: 11.8px !important;
  line-height: 1.42 !important;
}

.market-summary .insight-list li {
  margin-bottom: 3px;
}

.leaders-card table {
  min-width: 680px !important;
  table-layout: fixed !important;
}

.leaders-card th,
.leaders-card td {
  padding-left: 7px !important;
  padding-right: 7px !important;
  font-size: 12.5px !important;
}

.leaders-card th:nth-child(1), .leaders-card td:nth-child(1) { width: 44px !important; }
.leaders-card th:nth-child(2), .leaders-card td:nth-child(2) { width: 132px !important; white-space: normal !important; }
.leaders-card th:nth-child(3), .leaders-card td:nth-child(3) { width: 50px !important; }
.leaders-card th:nth-child(4), .leaders-card td:nth-child(4) { width: 62px !important; }
.leaders-card th:nth-child(5), .leaders-card td:nth-child(5) { width: 76px !important; }
.leaders-card th:nth-child(6), .leaders-card td:nth-child(6) { width: 78px !important; }
.leaders-card th:nth-child(7), .leaders-card td:nth-child(7) { width: 82px !important; }
.leaders-card th:nth-child(8), .leaders-card td:nth-child(8) { width: 52px !important; }

.leaders-card .mini-chart-pair.candle-only,
.leaders-card .mini-chart-empty {
  width: 38px !important;
  height: 36px !important;
}

.leaders-card .mini-chart-pair.candle-only .mini-candle-one {
  width: 24px !important;
  height: 34px !important;
}

.leaders-card .score {
  min-width: 32px !important;
  padding: 4px 6px !important;
}

@media (max-width: 1500px) {
  .report-kpis-v7 {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  .index-combo-card {
    grid-column: span 2;
  }
}

@media (max-width: 900px) {
  .report-kpis-v7 {
    grid-template-columns: 1fr !important;
  }
  .index-combo-card {
    grid-column: auto;
  }
  .index-combo-row {
    grid-template-columns: 1fr;
  }
  .index-mini-item {
    border-right: 0;
    border-bottom: 1px solid #e2e8f0;
    padding: 0 0 8px 0;
  }
}


/* ===============================
   Hotfix v7.1 - removed KPI null safety + compact restore
================================ */
.market-summary .insight-list {
  max-height: none !important;
  overflow: visible !important;
  display: block !important;
  margin-top: 8px !important;
  line-height: 1.62 !important;
}
.market-summary {
  overflow: visible !important;
}
.leaders-card table {
  min-width: 760px !important;
}
.leaders-card th:nth-child(1), .leaders-card td:nth-child(1) { width: 44px !important; }
.leaders-card th:nth-child(2), .leaders-card td:nth-child(2) { width: 148px !important; }
.leaders-card th:nth-child(3), .leaders-card td:nth-child(3) { width: 72px !important; }
.leaders-card th:nth-child(4), .leaders-card td:nth-child(4) { width: 70px !important; }
.leaders-card th:nth-child(5), .leaders-card td:nth-child(5) { width: 84px !important; }
.leaders-card th:nth-child(6), .leaders-card td:nth-child(6) { width: 86px !important; }
.leaders-card th:nth-child(7), .leaders-card td:nth-child(7) { width: 92px !important; }
.leaders-card th:nth-child(8), .leaders-card td:nth-child(8) { width: 66px !important; }
.mini-chart-td { text-align: center !important; }

/* ===============================
   Layout grid v8 polish
   - index card first/left, KPI center, market supply right
   - fix summary clipping
   - compact leaders columns
   - first-load mini candle cache fix is in JS
================================ */
.report-kpis-v7 {
  display: grid !important;
  grid-template-columns: 300px repeat(3, minmax(0, 1fr)) 320px !important;
  grid-auto-rows: 128px !important;
  gap: 14px !important;
  align-items: stretch !important;
}

.report-kpis-v7 .index-combo-card {
  order: 1 !important;
  grid-column: 1 / 2 !important;
  min-width: 0 !important;
  height: 128px !important;
  padding: 12px 16px !important;
}
.report-kpis-v7 .kpi-compact:nth-of-type(1) { order: 2 !important; grid-column: 2 / 3 !important; }
.report-kpis-v7 .kpi-compact:nth-of-type(2) { order: 3 !important; grid-column: 3 / 4 !important; }
.report-kpis-v7 .kpi-compact:nth-of-type(3) { order: 4 !important; grid-column: 4 / 5 !important; }
.report-kpis-v7 .index-supply-card {
  order: 5 !important;
  grid-column: 5 / 6 !important;
  min-width: 0 !important;
  height: 128px !important;
}

/* index combo: 3 rows in a market-summary-width card */
.index-combo-card .index-combo-row {
  height: 100% !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: repeat(3, 1fr) !important;
  gap: 0 !important;
}
.index-combo-card .index-mini-item {
  display: grid !important;
  grid-template-columns: 74px 1fr !important;
  grid-template-rows: auto auto !important;
  column-gap: 10px !important;
  align-items: center !important;
  padding: 4px 0 !important;
  border-right: 0 !important;
  border-bottom: 1px solid #e2e8f0 !important;
}
.index-combo-card .index-mini-item:last-child { border-bottom: 0 !important; }
.index-combo-card .index-name {
  grid-row: 1 / 3 !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  color: #0f172a !important;
}
.index-combo-card .index-mini-item strong {
  font-size: 20px !important;
  line-height: 1.0 !important;
  text-align: right !important;
}
.index-combo-card .index-change {
  font-size: 12px !important;
  line-height: 1.0 !important;
  text-align: right !important;
  font-weight: 900 !important;
}
.index-combo-card .index-mini { display: none !important; }
.index-change.pos, .index-combo-card .pos { color: var(--red) !important; }
.index-change.neg, .index-combo-card .neg { color: var(--blue) !important; }

/* center KPI cards: combined width equals leaders column */
.report-kpis-v7 .kpi-compact {
  min-width: 0 !important;
  height: 128px !important;
  padding: 16px 18px !important;
}
.report-kpis-v7 .kpi-compact .kpi-icon {
  flex: 0 0 44px !important;
  width: 44px !important;
  height: 44px !important;
}
.report-kpis-v7 .kpi-compact strong { font-size: 26px !important; }

/* right market supply card width aligns with watch card */
.index-supply-card {
  padding: 12px 14px !important;
}
.index-supply-card .index-card-top {
  margin-bottom: 6px !important;
}
.index-supply-card .index-card-top strong {
  font-size: 24px !important;
  line-height: 1 !important;
}
.index-supply-card .index-supply-grid {
  gap: 6px !important;
}
.index-supply-card .index-supply-grid span {
  padding: 8px 9px !important;
  min-height: 42px !important;
}
.index-supply-card .index-supply-note {
  margin-top: 6px !important;
  font-size: 11.5px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.index-supply-card .pos { color: var(--red) !important; }
.index-supply-card .neg { color: var(--blue) !important; }

/* market summary should show exactly the two summary lines without clipping */
.market-summary {
  overflow: visible !important;
}
.market-summary .insight-list {
  max-height: none !important;
  overflow: visible !important;
  display: block !important;
  margin-top: 8px !important;
  line-height: 1.55 !important;
  font-size: 12.5px !important;
}
.market-summary .insight-list li {
  margin-bottom: 4px !important;
}
.market-summary .compact-summary {
  margin-bottom: 8px !important;
}
.market-summary .summary-box div {
  min-height: 50px !important;
  padding: 11px 12px !important;
}

/* leaders: squeeze columns so all fields fit in one row */
.leaders-card table {
  min-width: 640px !important;
  table-layout: fixed !important;
}
.leaders-card th,
.leaders-card td {
  padding-left: 8px !important;
  padding-right: 8px !important;
}
.leaders-card th:nth-child(1), .leaders-card td:nth-child(1) { width: 50px !important; }
.leaders-card th:nth-child(2), .leaders-card td:nth-child(2) { width: 135px !important; white-space: normal !important; }
.leaders-card th:nth-child(3), .leaders-card td:nth-child(3) { width: 60px !important; text-align: center !important; }
.leaders-card th:nth-child(4), .leaders-card td:nth-child(4) { width: 66px !important; }
.leaders-card th:nth-child(5), .leaders-card td:nth-child(5) { width: 84px !important; text-align: right !important; }
.leaders-card th:nth-child(6), .leaders-card td:nth-child(6) { width: 82px !important; text-align: right !important; }
.leaders-card th:nth-child(7), .leaders-card td:nth-child(7) { width: 88px !important; text-align: right !important; }
.leaders-card th:nth-child(8), .leaders-card td:nth-child(8) { width: 56px !important; text-align: right !important; }
.leaders-card .mini-chart-pair.candle-only,
.supply-card .mini-chart-pair.candle-only,
.valuation-card .mini-chart-pair.candle-only {
  width: 42px !important;
  min-width: 42px !important;
  justify-content: center !important;
  margin: 0 auto !important;
}
.leaders-card .mini-candle-one,
.supply-card .mini-candle-one,
.valuation-card .mini-candle-one {
  width: 34px !important;
}
.mini-candle-svg.up rect,
.mini-candle-svg.up line { stroke: var(--red) !important; fill: var(--red) !important; }
.mini-candle-svg.down rect,
.mini-candle-svg.down line { stroke: var(--blue) !important; fill: var(--blue) !important; }

@media (max-width: 1500px) {
  .report-kpis-v7 {
    grid-template-columns: 300px repeat(3, minmax(0, 1fr)) 320px !important;
  }
}
@media (max-width: 1200px) {
  .report-kpis-v7 {
    grid-template-columns: 1fr 1fr !important;
    grid-auto-rows: auto !important;
  }
  .report-kpis-v7 .index-combo-card,
  .report-kpis-v7 .kpi-compact,
  .report-kpis-v7 .index-supply-card {
    grid-column: auto !important;
    height: auto !important;
  }
}

/* ===============================
   Layout grid v9
   - KOSPI/KOSDAQ only
   - top row aligns to summary/leaders/watch columns
================================ */
.report-kpis-v7 {
  display: grid !important;
  grid-template-columns: 0.92fr 2.36fr 0.88fr !important;
  grid-template-areas: "index center supply" !important;
  grid-auto-rows: 128px !important;
  gap: 14px !important;
  align-items: stretch !important;
}

.report-kpis-v7 .index-combo-card {
  grid-area: index !important;
  order: 0 !important;
  grid-column: auto !important;
  height: 128px !important;
  min-width: 0 !important;
  padding: 14px 16px !important;
  overflow: hidden !important;
}

.kpi-center-group {
  grid-area: center !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 14px !important;
  min-width: 0 !important;
}

.report-kpis-v7 .kpi-center-group .kpi-compact {
  order: 0 !important;
  grid-column: auto !important;
  height: 128px !important;
  min-width: 0 !important;
}

.report-kpis-v7 .index-supply-card {
  grid-area: supply !important;
  order: 0 !important;
  grid-column: auto !important;
  height: 128px !important;
  min-width: 0 !important;
  overflow: hidden !important;
}

.index-combo-card .index-combo-row {
  height: 100% !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: repeat(2, minmax(0, 1fr)) !important;
  gap: 0 !important;
}

.index-combo-card .index-mini-item {
  display: grid !important;
  grid-template-columns: 82px 1fr !important;
  grid-template-rows: auto auto !important;
  column-gap: 10px !important;
  align-items: center !important;
  padding: 7px 0 !important;
  border-right: 0 !important;
  border-bottom: 1px solid #e2e8f0 !important;
}

.index-combo-card .index-mini-item:last-child { border-bottom: 0 !important; }
.index-combo-card .index-name {
  grid-row: 1 / 3 !important;
  font-size: 12.5px !important;
  font-weight: 900 !important;
  color: #0f172a !important;
}
.index-combo-card .index-mini-item strong {
  font-size: 23px !important;
  line-height: 1 !important;
  text-align: right !important;
}
.index-combo-card .index-change {
  font-size: 12px !important;
  line-height: 1.05 !important;
  text-align: right !important;
  font-weight: 900 !important;
}
.index-combo-card .index-mini { display: none !important; }
.index-combo-card .pos,
.index-combo-card .index-change.pos { color: var(--red) !important; }
.index-combo-card .neg,
.index-combo-card .index-change.neg { color: var(--blue) !important; }

/* market summary: keep the two summary bullets visible inside 240px */
.market-summary {
  height: 240px !important;
  overflow: hidden !important;
  padding: 14px 16px !important;
}
.market-summary .card-head {
  margin-bottom: 7px !important;
}
.market-summary .card-head h2 {
  font-size: 18px !important;
}
.market-summary .compact-summary {
  margin-bottom: 7px !important;
  gap: 6px !important;
}
.market-summary .compact-summary div {
  min-height: 44px !important;
  padding: 7px 9px !important;
}
.market-summary .compact-summary span {
  font-size: 11px !important;
}
.market-summary .compact-summary strong {
  font-size: 19px !important;
}
.market-summary .insight-list {
  max-height: none !important;
  overflow: visible !important;
  margin: 4px 0 0 !important;
  padding-left: 14px !important;
  font-size: 11.2px !important;
  line-height: 1.32 !important;
}
.market-summary .insight-list li {
  margin-bottom: 2px !important;
}

/* leaders: keep all columns inside the leaders card */
.leaders-card table {
  min-width: 620px !important;
  table-layout: fixed !important;
}
.leaders-card th,
.leaders-card td {
  padding-left: 6px !important;
  padding-right: 6px !important;
  font-size: 12.2px !important;
}
.leaders-card th:nth-child(1), .leaders-card td:nth-child(1) { width: 42px !important; }
.leaders-card th:nth-child(2), .leaders-card td:nth-child(2) { width: 126px !important; white-space: normal !important; }
.leaders-card th:nth-child(3), .leaders-card td:nth-child(3) { width: 48px !important; text-align: center !important; }
.leaders-card th:nth-child(4), .leaders-card td:nth-child(4) { width: 58px !important; }
.leaders-card th:nth-child(5), .leaders-card td:nth-child(5) { width: 74px !important; text-align: right !important; }
.leaders-card th:nth-child(6), .leaders-card td:nth-child(6) { width: 78px !important; text-align: right !important; }
.leaders-card th:nth-child(7), .leaders-card td:nth-child(7) { width: 82px !important; text-align: right !important; }
.leaders-card th:nth-child(8), .leaders-card td:nth-child(8) { width: 52px !important; text-align: right !important; }

@media (max-width: 1200px) {
  .report-kpis-v7 {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "index"
      "center"
      "supply" !important;
    grid-auto-rows: auto !important;
  }
  .kpi-center-group {
    grid-template-columns: 1fr !important;
  }
  .report-kpis-v7 .index-combo-card,
  .report-kpis-v7 .kpi-center-group .kpi-compact,
  .report-kpis-v7 .index-supply-card {
    height: auto !important;
  }
}


/* ===============================
   Layout grid v10 polish
   - market supply fits inside top card
   - sortable header arrows align to the right
   - color positive/negative values in cards
================================ */
.report-kpis-v7 {
  grid-auto-rows: 136px !important;
}
.report-kpis-v7 .index-combo-card,
.report-kpis-v7 .kpi-center-group .kpi-compact,
.report-kpis-v7 .index-supply-card {
  height: 136px !important;
}

/* market supply compact enough not to clip */
.index-supply-card {
  padding: 10px 12px !important;
}
.index-supply-card .index-card-top {
  margin-bottom: 4px !important;
  align-items: center !important;
}
.index-supply-card .index-card-top .index-name {
  font-size: 13px !important;
}
.index-supply-card .index-card-top strong,
.index-supply-card #idxSupplyTotal {
  font-size: 22px !important;
  line-height: 1 !important;
}
.market-supply-tabs {
  margin: 2px 0 5px !important;
  gap: 4px !important;
}
.market-supply-tab {
  padding: 3px 7px !important;
  font-size: 10px !important;
  line-height: 1.1 !important;
}
.index-supply-grid {
  gap: 5px !important;
}
.index-supply-grid span {
  min-height: 36px !important;
  padding: 5px 7px !important;
  font-size: 11px !important;
  line-height: 1.1 !important;
}
.index-supply-grid b {
  margin-top: 2px !important;
  font-size: 13px !important;
  line-height: 1.1 !important;
}
.index-supply-note {
  margin-top: 4px !important;
  font-size: 10.5px !important;
  line-height: 1.15 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.index-supply-card .pos,
.index-supply-grid b.pos { color: var(--red) !important; }
.index-supply-card .neg,
.index-supply-grid b.neg { color: var(--blue) !important; }

/* sortable headers: keep triangle at the far right of each header */
th[data-sort] {
  position: sticky !important;
  padding-right: 18px !important;
}
th[data-sort]::after {
  right: 5px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  line-height: 1 !important;
}
.leaders-card th:nth-child(1),
.leaders-card th:nth-child(2),
.supply-card th:nth-child(1),
.supply-card th:nth-child(2),
.valuation-card th:nth-child(1),
.valuation-card th:nth-child(2),
.valuation-card th:nth-child(3) {
  text-align: left !important;
}
.leaders-card th:nth-child(4),
.leaders-card th:nth-child(5),
.leaders-card th:nth-child(6),
.leaders-card th:nth-child(7),
.leaders-card th:nth-child(8),
.supply-card th:nth-child(3),
.supply-card th:nth-child(4),
.supply-card th:nth-child(5),
.supply-card th:nth-child(6),
.supply-card th:nth-child(7),
.valuation-card th:nth-child(5),
.valuation-card th:nth-child(6),
.valuation-card th:nth-child(7),
.valuation-card th:nth-child(8),
.valuation-card th:nth-child(9),
.valuation-card th:nth-child(10) {
  text-align: right !important;
}
.leaders-card th:nth-child(3),
.supply-card th:nth-child(3),
.valuation-card th:nth-child(3) {
  text-align: center !important;
}

/* breakout/theme/watch cards positive/negative colors */
.breakout-card .pos,
.theme-card .pos,
.watch-card .pos { color: var(--red) !important; font-weight: 900 !important; }
.breakout-card .neg,
.theme-card .neg,
.watch-card .neg { color: var(--blue) !important; font-weight: 900 !important; }
.breakout-meta .pos,
.breakout-meta .neg,
.theme-meta .pos,
.theme-meta .neg {
  background: #eff6ff !important;
}
.breakout-meta .pos,
.theme-meta .pos { color: var(--red) !important; }
.breakout-meta .neg,
.theme-meta .neg { color: var(--blue) !important; }

/* keep market summary bullets visible */
.market-summary .insight-list {
  max-height: none !important;
  overflow: visible !important;
}

@media (max-width: 1200px) {
  .report-kpis-v7,
  .report-kpis-v7 .index-combo-card,
  .report-kpis-v7 .kpi-center-group .kpi-compact,
  .report-kpis-v7 .index-supply-card {
    height: auto !important;
    grid-auto-rows: auto !important;
  }
}

/* ===============================
   Layout grid v11 final polish
   - market supply unit moves to title
   - hide bottom note to avoid clipping
   - lift KOSPI row content slightly while divider stays centered
================================ */
.index-supply-card .index-card-top .index-name::after {
  content: "단위:억원";
  display: inline-block;
  margin-left: 6px;
  color: #64748b;
  font-size: 10.5px;
  font-weight: 900;
  letter-spacing: -0.02em;
  vertical-align: baseline;
}

.index-supply-note,
#indexSupplyNote {
  display: none !important;
}

.index-supply-card {
  padding: 10px 12px 9px !important;
}

.index-supply-card .index-card-top {
  margin-bottom: 5px !important;
}

.market-supply-tabs {
  margin: 1px 0 5px !important;
}

.index-supply-grid span {
  min-height: 38px !important;
  padding: 5px 7px !important;
}

/* KOSPI/KOSDAQ card: keep divider centered, lift only first row contents */
.index-combo-card .index-mini-item {
  align-content: center !important;
}

.index-combo-card .index-mini-item:first-child > * {
  transform: translateY(-4px);
}

.index-combo-card .index-mini-item:last-child > * {
  transform: translateY(2px);
}


/* ===============================
   Help button + modal
================================ */
.help-btn {
  width: auto;
  min-width: 92px;
  height: 44px;
  padding: 0 16px;
  border: 1px solid #cbd5e1;
  color: #0f172a;
  background: rgba(255, 255, 255, 0.94);
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.04);
}

body.modal-open {
  overflow: hidden;
}

.help-modal.hidden {
  display: none !important;
}

.help-modal {
  position: fixed;
  inset: 0;
  z-index: 10000;
}

.help-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.52);
  backdrop-filter: blur(3px);
}

.help-modal-card {
  position: relative;
  z-index: 1;
  width: min(1080px, calc(100vw - 28px));
  height: min(860px, calc(100vh - 28px));
  margin: 14px auto;
  background: #fff;
  border: 1px solid #dbe4f0;
  border-radius: 22px;
  box-shadow: 0 26px 80px rgba(15, 23, 42, 0.34);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.help-modal-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  padding: 20px 24px 16px;
  border-bottom: 1px solid #e5edf7;
  background: linear-gradient(135deg, #f8fbff, #eef6ff);
}

.help-modal-head h3 {
  margin: 0 0 6px;
  font-size: 25px;
  letter-spacing: -0.04em;
}

.help-modal-head p {
  color: #64748b;
  font-size: 13px;
  line-height: 1.5;
}

.help-modal-close {
  width: 42px;
  height: 42px;
  min-width: 42px;
  padding: 0;
  border-radius: 13px;
  border: 1px solid #cbd5e1;
  background: #fff;
  color: #0f172a;
  box-shadow: none;
}

.help-modal-body {
  padding: 18px 24px 24px;
  overflow-y: auto;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.help-section {
  border: 1px solid #e2e8f0;
  background: linear-gradient(135deg, #fff, #f8fbff);
  border-radius: 16px;
  padding: 15px 16px;
}

.help-section.help-notice {
  grid-column: 1 / -1;
  background: linear-gradient(135deg, #eff6ff, #ecfdf5);
  border-color: #bfdbfe;
}

.help-section h4 {
  margin: 0 0 9px;
  font-size: 16px;
  letter-spacing: -0.03em;
}

.help-section p,
.help-section li {
  color: #475569;
  font-size: 13px;
  line-height: 1.65;
}

.help-section ul {
  margin: 0;
  padding-left: 18px;
}

.help-section li + li {
  margin-top: 4px;
}

.help-section strong {
  color: #0f172a;
}

.help-section .pos { color: var(--red) !important; }
.help-section .neg { color: var(--blue) !important; }

.help-modal-body::-webkit-scrollbar {
  width: 8px;
}

.help-modal-body::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 999px;
}

/* ===============================
   Tablet / mobile responsive polish
================================ */
@media (max-width: 1280px) {
  .report-layout {
    padding: 16px;
  }

  .report-topbar {
    align-items: flex-start;
    gap: 12px;
  }

  .report-topbar h1 {
    font-size: 30px;
  }

  .report-kpis-v7 {
    grid-template-columns: 300px minmax(0, 1fr) 300px !important;
    gap: 12px !important;
  }

  .report-grid {
    grid-template-columns: 300px minmax(0, 1fr) 300px !important;
    grid-template-areas:
      "summary leaders watch"
      "breakout leaders watch"
      "theme supply supply"
      "minervini minervini minervini"
      "valuation valuation valuation" !important;
    gap: 12px !important;
  }

  .leaders-card .table-wrap {
    max-height: 390px !important;
  }
}

@media (max-width: 1024px) {
  html,
  body {
    overflow-x: hidden;
  }

  .report-layout {
    padding: 14px;
  }

  .report-topbar {
    flex-direction: column;
    align-items: stretch;
  }

  .report-title-wrap {
    gap: 12px;
  }

  .report-logo {
    width: 50px;
    height: 50px;
    flex: 0 0 50px;
  }

  .report-topbar h1 {
    font-size: 28px;
    line-height: 1.18;
  }

  .report-actions {
    width: 100%;
    min-width: 0;
    justify-content: flex-start;
    gap: 8px;
  }

  .date-select-control {
    flex: 1 1 210px;
    min-width: 190px;
  }

  #reportDateSelect {
    width: 100%;
    min-width: 0;
  }

  .date-nav-btn,
  .help-btn {
    min-width: 74px;
    padding: 0 12px;
  }

  .report-kpis-v7 {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
  }

  .report-kpis-v7 .index-combo-card,
  .report-kpis-v7 .index-supply-card,
  .report-kpis-v7 .kpi-center-group {
    grid-column: 1 / -1;
    width: 100% !important;
  }

  .kpi-center-group {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }

  .report-grid {
    grid-template-columns: 1fr 1fr !important;
    grid-template-areas:
      "summary watch"
      "leaders leaders"
      "breakout theme"
      "supply supply"
      "minervini minervini"
      "valuation valuation" !important;
    gap: 12px !important;
  }

  .market-summary,
  .watch-card-wrap,
  .breakout-card,
  .theme-card,
  .leaders-card,
  .supply-card,
  .valuation-card {
    height: auto !important;
    min-height: 0 !important;
  }

  .watch-card-wrap .watch-list,
  .breakout-card .breakout-list,
  .theme-card .theme-list {
    max-height: 360px !important;
  }

  .leaders-card .table-wrap,
  .supply-card .table-wrap,
  .valuation-card .table-wrap {
    max-height: 420px !important;
  }
}

@media (max-width: 760px) {
  .report-layout {
    padding: 10px;
  }

  .report-main {
    gap: 10px;
  }

  .report-title-wrap {
    align-items: flex-start;
  }

  .report-logo {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
  }

  .report-topbar h1 {
    font-size: 23px;
    letter-spacing: -0.05em;
  }

  .report-actions {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 7px;
  }

  .date-select-control {
    grid-column: 1 / -1;
    order: -1;
    width: 100%;
    height: 42px;
  }

  .date-nav-btn,
  .help-btn {
    height: 40px;
    min-width: 0;
    padding: 0 10px;
    font-size: 13px;
  }

  .date-nav-btn:nth-of-type(2) {
    justify-self: end;
  }

  .report-kpis-v7 {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .index-combo-row {
    grid-template-columns: 1fr !important;
  }

  .index-combo-card .index-mini-item:first-child > *,
  .index-combo-card .index-mini-item:last-child > * {
    transform: none !important;
  }

  .kpi-center-group {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .kpi,
  .kpi-compact,
  .index-combo-card,
  .index-supply-card {
    min-height: auto !important;
    height: auto !important;
    padding: 14px !important;
  }

  .index-supply-grid {
    grid-template-columns: 1fr !important;
  }

  .report-grid {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "summary"
      "leaders"
      "watch"
      "breakout"
      "theme"
      "supply"
      "minervini"
      "valuation" !important;
    gap: 10px !important;
  }

  .card {
    padding: 14px;
    border-radius: 16px;
  }

  .compact-summary {
    grid-template-columns: 1fr 1fr 1fr !important;
    gap: 6px;
  }

  .compact-summary div {
    padding: 9px 8px;
  }

  .compact-summary span {
    font-size: 11px;
  }

  .compact-summary strong {
    font-size: 20px;
  }

  .card-head {
    gap: 8px;
  }

  .card-head h2 {
    font-size: 18px;
  }

  .card-head p,
  .unit-note {
    font-size: 11.5px;
  }

  .leaders-card table,
  .supply-card table {
    min-width: 760px !important;
  }

  .valuation-card table {
    min-width: 1080px !important;
  }

  .valuation-card-head {
    align-items: flex-start !important;
  }

  .valuation-head-tools {
    width: 100%;
    justify-content: flex-start;
  }

  .valuation-scope-tabs {
    width: 100%;
    justify-content: flex-start;
  }

  .valuation-scope-btn {
    padding: 8px 9px;
    font-size: 11px;
  }

  .valuation-market-select {
    width: 120px;
  }

  .footer-note {
    font-size: 12px;
    padding-bottom: 16px;
  }

  .help-modal-card,
  .chart-modal-card {
    width: calc(100vw - 12px);
    height: calc(100vh - 12px);
    margin: 6px auto;
    border-radius: 16px;
  }

  .help-modal-head,
  .chart-modal-head {
    padding: 14px;
  }

  .help-modal-head h3,
  .chart-modal-head h3 {
    font-size: 20px;
  }

  .help-modal-body {
    grid-template-columns: 1fr;
    padding: 12px 14px 16px;
    gap: 10px;
  }

  .help-section {
    padding: 13px;
  }

  .help-section p,
  .help-section li {
    font-size: 12.5px;
  }

  .chart-modal-head {
    flex-direction: column;
  }

  .chart-modal-controls {
    width: 100%;
    justify-content: flex-start;
  }
}

@media (max-width: 420px) {
  .report-topbar h1 {
    font-size: 21px;
  }

  .compact-summary {
    grid-template-columns: 1fr !important;
  }

  .market-supply-tabs {
    gap: 4px;
  }

  .market-supply-tab {
    padding: 5px 7px !important;
    font-size: 10.5px !important;
  }

  .valuation-scope-btn {
    font-size: 10.5px;
    padding: 7px 8px;
  }
}

/* =========================================================
   Mobile calendar + scroll hotfix v3
   - 모바일에서 native date picker가 안 뜨는 경우 커스텀 달력 사용
   - 모바일/태블릿에서 카드 내부 가로/세로 스크롤 허용
========================================================= */
.calendar-modal.hidden {
  display: none !important;
}

.calendar-modal {
  position: fixed;
  inset: 0;
  z-index: 10050;
}

.calendar-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.48);
}

.calendar-modal-card {
  position: relative;
  z-index: 1;
  width: min(430px, calc(100vw - 24px));
  margin: 72px auto 0;
  background: #fff;
  border: 1px solid #dbe4f0;
  border-radius: 22px;
  box-shadow: 0 28px 70px rgba(15, 23, 42, 0.28);
  overflow: hidden;
}

.calendar-modal-head {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) 42px 42px;
  gap: 8px;
  align-items: center;
  padding: 16px;
  border-bottom: 1px solid #e5edf6;
  background: linear-gradient(180deg, #f8fbff, #fff);
}

.calendar-modal-head h3 {
  margin: 0;
  font-size: 18px;
  letter-spacing: -0.04em;
}

.calendar-modal-head p {
  margin-top: 3px;
  color: #64748b;
  font-size: 12px;
  font-weight: 900;
}

.calendar-month-btn,
.calendar-modal-close {
  width: 42px;
  height: 42px;
  padding: 0;
  border-radius: 14px;
  border: 1px solid #d4deea;
  background: #fff;
  color: #0f172a;
  box-shadow: none;
  font-size: 20px;
}

.calendar-modal-close {
  font-size: 15px;
}

.calendar-weekdays,
.calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
  padding: 10px 16px 0;
}

.calendar-weekdays span {
  text-align: center;
  color: #94a3b8;
  font-size: 11px;
  font-weight: 900;
}

.calendar-grid {
  padding-top: 8px;
  padding-bottom: 14px;
}

.calendar-day {
  aspect-ratio: 1;
  width: 100%;
  padding: 0;
  border-radius: 14px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  color: #94a3b8;
  box-shadow: none;
  font-size: 13px;
  font-weight: 900;
}

.calendar-day.available {
  background: #fff;
  color: #0f172a;
  border-color: #bfdbfe;
}

.calendar-day.available:hover {
  background: #eff6ff;
  color: #1d4ed8;
}

.calendar-day.selected {
  background: linear-gradient(135deg, #1d4ed8, #2563eb);
  color: #fff;
  border-color: #1d4ed8;
}

.calendar-day:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

.empty-day {
  display: block;
}

.calendar-modal-note {
  padding: 0 16px 16px;
  color: #64748b;
  font-size: 12px;
  line-height: 1.45;
}

@media (max-width: 1024px) {
  html,
  body:not(.modal-open) {
    overflow-x: auto !important;
    overflow-y: auto !important;
    height: auto !important;
  }

  .report-layout,
  .report-main,
  .card,
  .dashboard-grid,
  .report-grid,
  .report-kpis-v7 {
    overflow: visible !important;
    min-width: 0 !important;
  }

  .leaders-card .table-wrap,
  .supply-card .table-wrap,
  .valuation-card .table-wrap,
  .table-wrap {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    touch-action: pan-x pan-y;
  }

  .leaders-card .table-wrap,
  .supply-card .table-wrap {
    max-height: 62vh !important;
  }

  .valuation-card .table-wrap {
    max-height: 64vh !important;
  }

  .watch-card-wrap .watch-list,
  .breakout-card .breakout-list,
  .theme-card .theme-list {
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    touch-action: pan-y;
    max-height: 58vh !important;
  }

  .help-modal-body,
  .chart-modal-card,
  .help-modal-card {
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }
}

@media (max-width: 760px) {
  .calendar-modal-card {
    width: calc(100vw - 18px);
    margin-top: 54px;
    border-radius: 18px;
  }

  .calendar-modal-head {
    grid-template-columns: 38px minmax(0, 1fr) 38px 38px;
    padding: 14px;
  }

  .calendar-month-btn,
  .calendar-modal-close {
    width: 38px;
    height: 38px;
    border-radius: 12px;
  }

  .calendar-weekdays,
  .calendar-grid {
    gap: 5px;
    padding-left: 12px;
    padding-right: 12px;
  }

  .calendar-day {
    border-radius: 12px;
    font-size: 12px;
  }

  .calendar-modal-note {
    padding-left: 12px;
    padding-right: 12px;
  }

  .report-actions {
    overflow: visible !important;
  }

  .date-select-control {
    overflow: visible !important;
  }

  .leaders-card table,
  .supply-card table {
    min-width: 780px !important;
  }

  .valuation-card table {
    min-width: 1120px !important;
  }
}

.note-link-btn {
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  padding: 0 16px;
  border-radius: 12px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  background: linear-gradient(135deg, #071528, #1d4ed8);
  color: #fff;
  font-size: 14px;
  font-weight: 900;
  text-decoration: none;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
  white-space: nowrap;
}

.note-link-btn:hover {
  filter: brightness(1.05);
}

@media (max-width: 760px) {
  .note-link-btn {
    height: 40px;
    padding: 0 13px;
    font-size: 13px;
  }
}
/* =========================================================
   Mobile chart modal scroll fix
   - 모바일에서 종목 차트 팝업 내부를 상하/좌우로 스크롤 가능하게 함
   - 리서치 브리핑과 준비노트 공통 보정
========================================================= */
body.chart-modal-open {
  overflow: hidden;
}

@media (max-width: 900px) {
  .chart-modal {
    overflow: hidden !important;
    touch-action: none;
  }

  .chart-modal-card {
    width: calc(100vw - 10px) !important;
    height: calc(100dvh - 10px) !important;
    max-width: none !important;
    max-height: none !important;
    margin: 5px auto !important;
    border-radius: 14px !important;
    overflow: auto !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    touch-action: pan-x pan-y;
    display: block !important;
  }

  .chart-modal-head,
  .chart-modal-note,
  .chart-popup {
    min-width: 1040px !important;
  }

  .chart-modal-head {
    position: sticky;
    top: 0;
    z-index: 5;
    background: #fff;
    flex-direction: row !important;
    align-items: flex-start !important;
  }

  .chart-modal-controls {
    width: auto !important;
    justify-content: flex-end !important;
    flex-wrap: nowrap !important;
  }

  .chart-modal-note {
    padding: 8px 16px 0 !important;
    white-space: nowrap;
  }

  .chart-popup {
    width: 1040px !important;
    height: 760px !important;
    min-height: 760px !important;
    flex: 0 0 auto !important;
  }
}

@media (max-width: 520px) {
  .chart-modal-head,
  .chart-modal-note,
  .chart-popup {
    min-width: 980px !important;
  }

  .chart-popup {
    width: 980px !important;
    height: 740px !important;
    min-height: 740px !important;
  }

  .chart-modal-head h3 {
    font-size: 20px !important;
  }

  .chart-modal-meta {
    font-size: 12px !important;
  }

  .chart-modal-controls select,
  .chart-modal-controls input,
  .chart-modal-controls button {
    height: 38px !important;
    padding: 8px 10px !important;
  }
}


/* ===============================
   Minervini Trend Template Scanner
================================ */
.minervini-card .table-wrap {
  max-height: 520px !important;
  overflow-y: auto !important;
  overflow-x: auto !important;
  position: relative;
}
.minervini-card table {
  min-width: 1720px;
  table-layout: fixed !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}
.minervini-card thead th,
.minervini-card th[data-sort] {
  position: sticky !important;
  top: 0 !important;
  z-index: 50 !important;
  background: linear-gradient(180deg, #f8fafc, #f1f5f9) !important;
  box-shadow: 0 1px 0 #dbe4f0;
}
.minervini-card th:nth-child(1), .minervini-card td:nth-child(1) { width: 58px; }
.minervini-card th:nth-child(2), .minervini-card td:nth-child(2) { width: 170px; white-space: normal; }
.minervini-card th:nth-child(3), .minervini-card td:nth-child(3) { width: 90px; }
.minervini-card th:nth-child(4), .minervini-card td:nth-child(4) { width: 88px; }
.minervini-card th:nth-child(5), .minervini-card td:nth-child(5) { width: 110px; }
.minervini-card th:nth-child(6), .minervini-card td:nth-child(6) { width: 96px; }
.minervini-card th:nth-child(7), .minervini-card td:nth-child(7) { width: 92px; }
.minervini-card th:nth-child(8), .minervini-card td:nth-child(8),
.minervini-card th:nth-child(9), .minervini-card td:nth-child(9),
.minervini-card th:nth-child(10), .minervini-card td:nth-child(10) { width: 76px; }
.minervini-card th:nth-child(11), .minervini-card td:nth-child(11),
.minervini-card th:nth-child(12), .minervini-card td:nth-child(12),
.minervini-card th:nth-child(13), .minervini-card td:nth-child(13) { width: 92px; }
.minervini-card th:nth-child(14), .minervini-card td:nth-child(14) { width: 100px; }
.minervini-card th:nth-child(15), .minervini-card td:nth-child(15) { width: 120px; }
.minervini-card th:nth-child(16), .minervini-card td:nth-child(16) { width: 86px; }
.minervini-card th:nth-child(17), .minervini-card td:nth-child(17) { width: 190px; white-space: normal; }
.minervini-card td.num,
.minervini-card th:nth-child(5),
.minervini-card th:nth-child(6),
.minervini-card th:nth-child(7),
.minervini-card th:nth-child(8),
.minervini-card th:nth-child(9),
.minervini-card th:nth-child(10),
.minervini-card th:nth-child(11),
.minervini-card th:nth-child(12),
.minervini-card th:nth-child(13),
.minervini-card th:nth-child(14),
.minervini-card th:nth-child(15),
.minervini-card th:nth-child(16) {
  text-align: right !important;
}
.minervini-card-head { align-items: flex-start; }
.minervini-head-tools {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}
.minervini-scope-tabs {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.minervini-scope-btn {
  width: auto;
  border: 1px solid #cbd5e1;
  background: #fff;
  color: #334155;
  border-radius: 999px;
  padding: 9px 12px;
  font-size: 12px;
  font-weight: 900;
  box-shadow: none;
}
.minervini-scope-btn.active {
  border-color: #2563eb;
  background: #eff6ff;
  color: #1d4ed8;
}
.minervini-market-select {
  width: 112px;
  height: 38px;
  padding: 8px 10px;
  font-size: 13px;
  font-weight: 900;
}
.template-badge {
  display: inline-flex;
  min-width: 48px;
  justify-content: center;
  border-radius: 999px;
  padding: 5px 8px;
  font-weight: 900;
  background: #f1f5f9;
  color: #64748b;
}
.template-badge.template-pass { background: #d1fae5; color: #047857; }
.template-badge.template-interest { background: #dbeafe; color: #1d4ed8; }
.template-badge.template-watch { background: #ffedd5; color: #c2410c; }
.score.score-hot { background: #fee2e2; color: #b91c1c; }
.score.score-warm { background: #ffedd5; color: #c2410c; }
.minervini-more-wrap {
  display: flex;
  justify-content: center;
  padding-top: 12px;
}
.minervini-more-btn {
  width: auto;
  min-width: 160px;
  height: 42px;
  border-radius: 999px;
  padding: 0 18px;
}
.minervini-more-btn:disabled { opacity: .55; cursor: not-allowed; }

/* Minervini help detail box */
.help-subbox {
  margin: 10px 0 12px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #f8fafc;
}
.help-subbox > strong {
  display: block;
  margin-bottom: 8px;
}
.help-subbox ol {
  margin: 0;
  padding-left: 20px;
}
.help-subbox li {
  margin: 4px 0;
}

/* ===============================
   Kullamagi Price Momentum Template
================================ */
.dashboard-grid {
  grid-template-areas:
    "summary leaders watch"
    "breakout leaders watch"
    "theme supply supply"
    "minervini minervini minervini"
    "kullamagi kullamagi kullamagi"
    "valuation valuation valuation";
}
.kullamagi-card { grid-area: kullamagi; }
.kullamagi-card .table-wrap {
  max-height: 520px !important;
  overflow-y: auto !important;
  overflow-x: auto !important;
  position: relative;
}
.kullamagi-card table {
  min-width: 1360px;
  table-layout: fixed !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}
.kullamagi-card thead th,
.kullamagi-card th[data-sort] {
  position: sticky !important;
  top: 0 !important;
  z-index: 50 !important;
  background: linear-gradient(180deg, #f8fafc, #f1f5f9) !important;
  box-shadow: 0 1px 0 #dbe4f0;
}
.kullamagi-card th:nth-child(1), .kullamagi-card td:nth-child(1) { width: 58px; }
.kullamagi-card th:nth-child(2), .kullamagi-card td:nth-child(2) { width: 170px; white-space: normal; }
.kullamagi-card th:nth-child(3), .kullamagi-card td:nth-child(3) { width: 90px; }
.kullamagi-card th:nth-child(4), .kullamagi-card td:nth-child(4) { width: 88px; }
.kullamagi-card th:nth-child(5), .kullamagi-card td:nth-child(5) { width: 110px; }
.kullamagi-card th:nth-child(6), .kullamagi-card td:nth-child(6),
.kullamagi-card th:nth-child(7), .kullamagi-card td:nth-child(7),
.kullamagi-card th:nth-child(8), .kullamagi-card td:nth-child(8),
.kullamagi-card th:nth-child(9), .kullamagi-card td:nth-child(9),
.kullamagi-card th:nth-child(10), .kullamagi-card td:nth-child(10) { width: 92px; }
.kullamagi-card th:nth-child(11), .kullamagi-card td:nth-child(11) { width: 80px; }
.kullamagi-card th:nth-child(12), .kullamagi-card td:nth-child(12) { width: 86px; }
.kullamagi-card th:nth-child(13), .kullamagi-card td:nth-child(13) { width: 230px; white-space: normal; }
.kullamagi-card td.num,
.kullamagi-card th:nth-child(5),
.kullamagi-card th:nth-child(6),
.kullamagi-card th:nth-child(7),
.kullamagi-card th:nth-child(8),
.kullamagi-card th:nth-child(9),
.kullamagi-card th:nth-child(10),
.kullamagi-card th:nth-child(11),
.kullamagi-card th:nth-child(12) {
  text-align: right !important;
}
.kullamagi-card-head { align-items: flex-start; }
.kullamagi-head-tools {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}
.kullamagi-scope-tabs {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.kullamagi-scope-btn {
  width: auto;
  border: 1px solid #cbd5e1;
  background: #fff;
  color: #334155;
  border-radius: 999px;
  padding: 9px 12px;
  font-size: 12px;
  font-weight: 900;
  box-shadow: none;
}
.kullamagi-scope-btn.active {
  border-color: #2563eb;
  background: #eff6ff;
  color: #1d4ed8;
}
.kullamagi-market-select {
  width: 112px;
  height: 38px;
  padding: 8px 10px;
  font-size: 13px;
  font-weight: 900;
}
.kullamagi-more-wrap {
  display: flex;
  justify-content: center;
  padding-top: 12px;
}
.kullamagi-more-btn {
  width: auto;
  min-width: 160px;
  height: 42px;
  border-radius: 999px;
  padding: 0 18px;
}
.kullamagi-more-btn:disabled { opacity: .55; cursor: not-allowed; }
.kullamagi-setup-badge {
  display: inline-flex;
  min-width: 52px;
  justify-content: center;
  border-radius: 999px;
  padding: 5px 8px;
  font-weight: 900;
  background: #f1f5f9;
  color: #64748b;
}
.kullamagi-setup-badge.hot,
.kullamagi-setup-badge.breakout {
  background: #d1fae5;
  color: #047857;
  border: 1px solid #bbf7d0;
}
.kullamagi-setup-badge.near {
  background: #dbeafe;
  color: #1d4ed8;
  border: 1px solid #bfdbfe;
}
.kullamagi-setup-badge.warm {
  background: #ffedd5;
  color: #c2410c;
  border: 1px solid #fed7aa;
}
.kullamagi-setup-badge.cool {
  background: #f1f5f9;
  color: #475569;
  border: 1px solid #e2e8f0;
}
.kullamagi-setup-badge { cursor: help; }
.kullamagi-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #eff6ff;
  color: #1d4ed8;
  padding: 4px 8px;
  font-size: 12px;
  font-weight: 900;
  line-height: 1.15;
}
.kullamagi-tag.hot,
.kullamagi-tag.near,
.kullamagi-tag.warm,
.kullamagi-tag.green {
  background: #eff6ff;
  color: #1d4ed8;
}
.kullamagi-table .valuation-tags { gap: 6px; align-items: center; }
.kullamagi-help-box {
  border-color: #bfdbfe;
  background: linear-gradient(180deg, #f8fbff, #eff6ff);
}

@media (max-width: 900px) {
  .kullamagi-card-head { flex-direction: column; }
  .kullamagi-head-tools { justify-content: flex-start; width: 100%; }
  .kullamagi-scope-tabs { justify-content: flex-start; }
}


/* =========================================================
   Layout alignment hotfix v12
   - 상단 KPI 폭을 아래 3컬럼 카드 폭과 정확히 맞춤
   - KOSPI/KOSDAQ = 시장요약 폭
   - 시장온도+주도주+내일관심종목 = 오늘의 주도주 폭
   - 시장수급 = 내일 관심종목 폭
   - 미너비니 옵션 순서: 주도주를 첫 번째로 표시
========================================================= */
.report-main {
  --tm-left-col: 360px;
  --tm-right-col: 420px;
  --tm-gap: 14px;
}

.report-kpis-v7 {
  display: grid !important;
  grid-template-columns: var(--tm-left-col) minmax(0, 1fr) var(--tm-right-col) !important;
  grid-template-areas: "index center supply" !important;
  gap: var(--tm-gap) !important;
  align-items: stretch !important;
  grid-auto-rows: 136px !important;
}

.report-kpis-v7 .index-combo-card {
  grid-area: index !important;
  grid-column: auto !important;
  width: auto !important;
  min-width: 0 !important;
  height: 136px !important;
}

.report-kpis-v7 .kpi-center-group {
  grid-area: center !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: var(--tm-gap) !important;
  width: auto !important;
  min-width: 0 !important;
}

.report-kpis-v7 .kpi-center-group .kpi-compact {
  width: auto !important;
  min-width: 0 !important;
  height: 136px !important;
}

.report-kpis-v7 .index-supply-card {
  grid-area: supply !important;
  grid-column: auto !important;
  width: auto !important;
  min-width: 0 !important;
  height: 136px !important;
}

.report-grid,
.dashboard-grid.report-grid {
  display: grid !important;
  grid-template-columns: var(--tm-left-col) minmax(0, 1fr) var(--tm-right-col) !important;
  grid-template-rows: 240px 386px 360px auto auto auto !important;
  grid-template-areas:
    "summary leaders watch"
    "breakout leaders watch"
    "theme supply supply"
    "minervini minervini minervini"
    "kullamagi kullamagi kullamagi"
    "valuation valuation valuation" !important;
  gap: var(--tm-gap) !important;
  align-items: start !important;
}

.market-summary { grid-area: summary !important; }
.leaders-card { grid-area: leaders !important; }
.watch-card-wrap { grid-area: watch !important; }
.breakout-card { grid-area: breakout !important; }
.theme-card { grid-area: theme !important; }
.supply-card { grid-area: supply !important; }
.minervini-card { grid-area: minervini !important; }
.kullamagi-card { grid-area: kullamagi !important; }
.valuation-card { grid-area: valuation !important; }

/* 하단 전체 폭 스캐너 카드들이 위 3컬럼 폭을 자연스럽게 꽉 채우도록 */
.minervini-card,
.kullamagi-card,
.valuation-card {
  width: 100% !important;
  min-width: 0 !important;
}

/* 쿨라매기/미너비니 헤더 버튼은 한 줄에서 넘치면 자연스럽게 줄바꿈 */
.minervini-card-head,
.kullamagi-card-head,
.valuation-card-head {
  gap: 12px !important;
}

.minervini-head-tools,
.kullamagi-head-tools,
.valuation-head-tools {
  min-width: 0 !important;
}

@media (max-width: 1600px) {
  .report-main {
    --tm-left-col: 320px;
    --tm-right-col: 340px;
  }
}

@media (max-width: 1280px) {
  .report-main {
    --tm-left-col: 300px;
    --tm-right-col: 300px;
  }
}

@media (max-width: 1024px) {
  .report-kpis-v7 {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "index"
      "center"
      "supply" !important;
    grid-auto-rows: auto !important;
  }

  .report-kpis-v7 .index-combo-card,
  .report-kpis-v7 .kpi-center-group,
  .report-kpis-v7 .index-supply-card,
  .report-kpis-v7 .kpi-center-group .kpi-compact {
    height: auto !important;
  }

  .report-grid,
  .dashboard-grid.report-grid {
    grid-template-columns: 1fr 1fr !important;
    grid-template-rows: none !important;
    grid-template-areas:
      "summary watch"
      "leaders leaders"
      "breakout theme"
      "supply supply"
      "minervini minervini"
      "kullamagi kullamagi"
      "valuation valuation" !important;
  }
}

@media (max-width: 760px) {
  .report-kpis-v7 {
    grid-template-columns: 1fr !important;
  }

  .kpi-center-group {
    grid-template-columns: 1fr !important;
  }

  .report-grid,
  .dashboard-grid.report-grid {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "summary"
      "leaders"
      "watch"
      "breakout"
      "theme"
      "supply"
      "minervini"
      "kullamagi"
      "valuation" !important;
  }
}


/* =========================================================
   Official theme/industry ranking + heatmap
========================================================= */
.rank-center-group {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
}
.report-kpis-v7 .rank-center-group .kpi-rank-card,
.kpi-rank-card {
  min-height: 126px;
  padding: 16px 18px;
  display: block;
}
.rank-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}
.rank-card-head span {
  color: #0f172a;
  font-size: 14px;
  font-weight: 900;
}
.rank-heatmap-btn,
.theme-heatmap-btn,
.theme-mini-heatmap {
  width: auto;
  height: 30px;
  border-radius: 999px;
  padding: 0 10px;
  border: 1px solid #bfdbfe;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 12px;
  font-weight: 900;
  box-shadow: none;
}
.rank-mini-list {
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.rank-mini-list em {
  color: #64748b;
  font-style: normal;
  font-size: 12px;
}
.rank-mini-row {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) 62px;
  align-items: center;
  gap: 7px;
  min-width: 0;
  font-size: 12px;
}
.rank-mini-row b {
  width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  color: #fff;
  background: #06142b;
  font-size: 11px;
}
.rank-mini-row span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 900;
}
.rank-mini-row em {
  text-align: right;
  font-style: normal;
  font-weight: 900;
  font-size: 12px;
}
.theme-rank-section + .theme-rank-section {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px dashed #dbe4f0;
}
.theme-rank-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}
.theme-rank-title strong {
  font-size: 13px;
  color: #334155;
}
.official-theme-row .theme-meta span {
  max-width: 100%;
}
.heatmap-modal.hidden { display: none !important; }
.heatmap-modal {
  position: fixed;
  inset: 0;
  z-index: 9998;
}
.heatmap-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.52);
}
.heatmap-modal-card {
  position: relative;
  z-index: 1;
  width: min(1280px, calc(100vw - 28px));
  height: min(820px, calc(100vh - 28px));
  margin: 14px auto;
  background: #fff;
  border-radius: 22px;
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.30);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.heatmap-modal-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 20px 12px;
  border-bottom: 1px solid #e5e7eb;
}
.heatmap-modal-head h3 {
  font-size: 24px;
  letter-spacing: -0.04em;
  margin-bottom: 6px;
}
.heatmap-modal-head p {
  color: #64748b;
  font-size: 13px;
}
.heatmap-controls {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.heatmap-tab,
.heatmap-close {
  width: auto;
  height: 38px;
  border-radius: 12px;
  padding: 0 13px;
  border: 1px solid #cbd5e1;
  background: #fff;
  color: #334155;
  font-size: 13px;
}
.heatmap-tab.active {
  border-color: #2563eb;
  background: #eff6ff;
  color: #1d4ed8;
}
.heatmap-grid {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 18px;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  grid-auto-rows: minmax(104px, auto);
  gap: 12px;
}
.heatmap-tile {
  border: 1px solid #dbe4f0;
  border-radius: 18px;
  padding: 14px;
  background: #f8fafc;
  transform: scale(var(--tile-scale, 1));
  transform-origin: center;
  min-width: 0;
}
.heatmap-tile.up5 { background: #fee2e2; border-color: #fecaca; }
.heatmap-tile.up2 { background: #fff1f2; border-color: #fecdd3; }
.heatmap-tile.up { background: #fff7ed; border-color: #fed7aa; }
.heatmap-tile.down5 { background: #dbeafe; border-color: #bfdbfe; }
.heatmap-tile.down2 { background: #eff6ff; border-color: #bfdbfe; }
.heatmap-tile.down { background: #f0f9ff; border-color: #bae6fd; }
.heatmap-tile.flat { background: #f8fafc; border-color: #e2e8f0; }
.heatmap-tile-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}
.heatmap-tile-top strong {
  font-size: 16px;
  letter-spacing: -0.03em;
  word-break: keep-all;
}
.heatmap-tile-top b {
  white-space: nowrap;
  color: #ef1111;
  font-size: 15px;
}
.heatmap-tile.down .heatmap-tile-top b,
.heatmap-tile.down2 .heatmap-tile-top b,
.heatmap-tile.down5 .heatmap-tile-top b { color: #2563eb; }
.heatmap-tile-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 8px;
}
.heatmap-tile-meta span {
  border-radius: 999px;
  padding: 4px 8px;
  background: rgba(255,255,255,.65);
  color: #334155;
  font-size: 11px;
  font-weight: 900;
}
.heatmap-tile p {
  margin: 0;
  color: #475569;
  font-size: 12px;
  line-height: 1.45;
}
@media (max-width: 900px) {
  .rank-center-group { grid-template-columns: 1fr !important; }
  .heatmap-modal-card { width: calc(100vw - 16px); height: calc(100vh - 16px); margin: 8px auto; }
  .heatmap-modal-head { flex-direction: column; }
  .heatmap-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
}

/* =========================================================
   Official rank cards + stock treemap heatmap refinement
========================================================= */
.report-kpis-v7 {
  grid-template-columns: 300px minmax(560px, 1fr) 320px !important;
}
.index-combo-row {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
.rank-center-group {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
}
.report-kpis-v7 .rank-center-group .kpi-rank-card,
.kpi-rank-card {
  min-height: 126px !important;
  padding: 14px 16px !important;
}
.rank-mini-list {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px 12px !important;
}
.rank-mini-row {
  display: grid !important;
  grid-template-columns: 24px minmax(0, 1fr) 58px !important;
  align-items: center;
  gap: 7px;
  min-width: 0;
}
.rank-mini-row span { min-width: 0; }
.rank-mini-row em.pos { color: var(--red) !important; }
.rank-mini-row em.neg { color: var(--blue) !important; }

.theme-rank-title { justify-content: flex-start !important; }
.theme-mini-heatmap { display: none !important; }

.heatmap-modal-card {
  width: min(1480px, calc(100vw - 28px)) !important;
  height: min(900px, calc(100vh - 28px)) !important;
}
.heatmap-grid {
  display: flex !important;
  flex-direction: column;
  gap: 16px !important;
  padding: 16px !important;
  overflow: auto !important;
}
.heatmap-group-card {
  border: 1px solid #dbeafe;
  background: #f8fbff;
  border-radius: 18px;
  padding: 12px;
  min-width: 960px;
}
.heatmap-group-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 10px;
}
.heatmap-group-head strong {
  display: block;
  font-size: 18px;
  letter-spacing: -0.04em;
}
.heatmap-group-head span {
  display: block;
  margin-top: 4px;
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}
.heatmap-group-head b {
  font-size: 18px;
  white-space: nowrap;
}
.stock-heat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(108px, 1fr));
  grid-auto-rows: minmax(62px, auto);
  gap: 5px;
}
.stock-heat-tile {
  min-height: calc(56px * var(--stock-scale, 1));
  border-radius: 6px;
  padding: 7px 8px;
  color: #fff;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.18);
  overflow: hidden;
}
.stock-heat-tile strong {
  font-size: 13px;
  line-height: 1.2;
  font-weight: 900;
  word-break: keep-all;
  overflow: hidden;
  text-overflow: ellipsis;
}
.stock-heat-tile em {
  margin-top: 4px;
  font-style: normal;
  font-size: 15px;
  font-weight: 900;
}
.stock-heat-tile.hm-up5 { background: #ef1111; }
.stock-heat-tile.hm-up4 { background: #f43f3f; }
.stock-heat-tile.hm-up3 { background: #fb6a6a; }
.stock-heat-tile.hm-up2 { background: #fca5a5; color: #7f1d1d; }
.stock-heat-tile.hm-down5 { background: #1d4ed8; }
.stock-heat-tile.hm-down4 { background: #2563eb; }
.stock-heat-tile.hm-down2 { background: #60a5fa; color: #082f49; }
.stock-heat-tile.hm-flat { background: #64748b; }

.minervini-card table { min-width: 1640px !important; }
.minervini-card th:nth-child(15), .minervini-card td:nth-child(15) { width: 150px !important; }
.minervini-card th:nth-child(16), .minervini-card td:nth-child(16) { width: 150px !important; }
.minervini-card th:nth-child(17), .minervini-card td:nth-child(17) { width: 86px !important; }
.minervini-card th:nth-child(18), .minervini-card td:nth-child(18) { width: 190px !important; white-space: normal; }

@media (max-width: 1200px) {
  .report-kpis-v7 { grid-template-columns: 1fr !important; }
  .rank-center-group { grid-template-columns: 1fr !important; }
  .rank-mini-list { grid-template-columns: 1fr 1fr !important; }
  .heatmap-group-card { min-width: 720px; }
}
@media (max-width: 760px) {
  .rank-mini-list { grid-template-columns: 1fr !important; }
  .heatmap-group-card { min-width: 620px; }
  .stock-heat-grid { grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); }
}

/* =========================================================
   Final fix: official market ranks, card alignment, scanner overlap
========================================================= */
.report-main {
  --tm-left-col: 360px !important;
  --tm-right-col: 420px !important;
  --tm-gap: 14px !important;
}
.report-kpis-v7 {
  display: grid !important;
  grid-template-columns: var(--tm-left-col) minmax(0, 1fr) var(--tm-right-col) !important;
  grid-template-areas: "index center supply" !important;
  gap: var(--tm-gap) !important;
  align-items: stretch !important;
}
.report-kpis-v7 .index-combo-card { grid-area: index !important; width: auto !important; min-width: 0 !important; }
.report-kpis-v7 .rank-center-group { grid-area: center !important; width: auto !important; min-width: 0 !important; display:grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: var(--tm-gap) !important; }
.report-kpis-v7 .index-supply-card { grid-area: supply !important; width: auto !important; min-width: 0 !important; }
.report-kpis-v7 .index-combo-card,
.report-kpis-v7 .rank-center-group .kpi-rank-card,
.report-kpis-v7 .index-supply-card { height: 138px !important; min-height: 138px !important; }

.report-grid,
.dashboard-grid.report-grid {
  display: grid !important;
  grid-template-columns: var(--tm-left-col) minmax(0, 1fr) var(--tm-right-col) !important;
  grid-template-rows: 250px 450px 540px auto auto auto !important;
  grid-template-areas:
    "summary leaders watch"
    "breakout leaders watch"
    "theme supply supply"
    "minervini minervini minervini"
    "kullamagi kullamagi kullamagi"
    "valuation valuation valuation" !important;
  gap: var(--tm-gap) !important;
  align-items: stretch !important;
}
.market-summary { grid-area: summary !important; }
.leaders-card { grid-area: leaders !important; }
.watch-card-wrap { grid-area: watch !important; }
.breakout-card { grid-area: breakout !important; }
.theme-card { grid-area: theme !important; }
.supply-card { grid-area: supply !important; }
.minervini-card { grid-area: minervini !important; }
.kullamagi-card { grid-area: kullamagi !important; }
.valuation-card { grid-area: valuation !important; }

.leaders-card,
.watch-card-wrap,
.breakout-card,
.theme-card,
.supply-card { height: 100% !important; min-height: 0 !important; }
.leaders-card .table-wrap { max-height: calc(100% - 74px) !important; height: calc(100% - 74px) !important; }
.watch-card-wrap .watch-list { max-height: none !important; height: calc(100% - 58px) !important; overflow-y: hidden !important; }
.breakout-card .breakout-list { max-height: none !important; height: calc(100% - 58px) !important; overflow-y: auto !important; }
.theme-card .theme-list { max-height: none !important; height: calc(100% - 58px) !important; overflow-y: hidden !important; }
.supply-card .table-wrap { max-height: calc(100% - 68px) !important; height: calc(100% - 68px) !important; }

.rank-card-head { margin-bottom: 8px !important; }
.rank-mini-list {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px 12px !important;
}
.rank-mini-market { min-width: 0; }
.rank-mini-market > strong {
  display: block;
  color: #64748b;
  font-size: 11px;
  font-weight: 900;
  margin-bottom: 4px;
}
.rank-mini-row {
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr) 58px !important;
  gap: 6px !important;
  align-items: center !important;
  font-size: 12px !important;
  margin-bottom: 3px;
}
.rank-mini-row b { width: 20px !important; height: 20px !important; font-size: 11px !important; }
.rank-mini-row span { min-width: 0 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; font-weight: 900 !important; }
.rank-mini-row em { text-align: right !important; font-style: normal !important; font-weight: 900 !important; }

.theme-card .theme-list { display: grid !important; grid-template-columns: 1fr !important; gap: 8px !important; }
.theme-rank-section { min-width: 0; }
.theme-rank-title { margin: 0 0 5px; color: #334155; font-size: 12px; }
.theme-card .theme-row { padding: 9px 12px !important; border-radius: 15px !important; margin-bottom: 7px !important; }
.theme-card .theme-top { margin-bottom: 5px !important; }
.theme-card .theme-top strong { font-size: 14px !important; }
.theme-card .theme-top span { font-size: 11px !important; }
.theme-card .theme-bar { height: 8px !important; margin: 7px 0 !important; }
.theme-card .theme-meta { gap: 5px !important; }
.theme-card .theme-meta span { font-size: 11px !important; padding: 3px 7px !important; }
.theme-heatmap-btn { display: none !important; }

.group-rank-text { display: inline-block; max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; }
.scanner-name-cell.scanner-overlap .stock-link {
  background: linear-gradient(135deg, #eef6ff, #ecfdf5) !important;
  border: 1px solid #bfdbfe !important;
  border-radius: 12px !important;
  padding: 6px 8px !important;
}
.scanner-name-cell.scanner-overlap .stock-link strong { color: #0f4fb8 !important; }

.heatmap-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)) !important;
  gap: 12px !important;
  align-items: start !important;
}
.heatmap-group-card {
  border: 1px solid #bfdbfe;
  background: #f8fbff;
  border-radius: 18px;
  padding: 12px;
  min-width: 0;
}
.heatmap-group-head { display:flex; justify-content:space-between; gap:10px; align-items:flex-start; margin-bottom:10px; }
.heatmap-group-head strong { display:block; font-size:16px; letter-spacing:-.03em; }
.heatmap-group-head span { display:block; color:#64748b; font-size:12px; margin-top:3px; }
.stock-heat-grid { display:grid; grid-template-columns: repeat(auto-fill, minmax(82px, 1fr)); gap:4px; }
.stock-heat-tile { min-height:58px; border-radius:4px; padding:6px; color:#fff; overflow:hidden; display:flex; flex-direction:column; justify-content:center; }
.stock-heat-tile strong { display:block; font-size:12px; line-height:1.15; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.stock-heat-tile em { font-style:normal; font-weight:900; font-size:13px; margin-top:3px; }
.hm-up5 { background:#dc2626; }
.hm-up4 { background:#ef4444; }
.hm-up3 { background:#f87171; }
.hm-up2 { background:#fb923c; }
.hm-down5 { background:#1d4ed8; }
.hm-down4 { background:#2563eb; }
.hm-down2 { background:#60a5fa; }
.hm-flat { background:#475569; }

@media (max-width: 1600px) {
  .report-main { --tm-left-col: 340px !important; --tm-right-col: 380px !important; }
}
@media (max-width: 1280px) {
  .report-main { --tm-left-col: 300px !important; --tm-right-col: 320px !important; }
}
@media (max-width: 1024px) {
  .report-kpis-v7 { grid-template-columns: 1fr !important; grid-template-areas: "index" "center" "supply" !important; }
  .report-kpis-v7 .index-combo-card,
  .report-kpis-v7 .rank-center-group .kpi-rank-card,
  .report-kpis-v7 .index-supply-card { height: auto !important; min-height: 120px !important; }
  .report-grid,
  .dashboard-grid.report-grid {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto !important;
    grid-template-areas:
      "summary" "leaders" "watch" "breakout" "theme" "supply" "minervini" "kullamagi" "valuation" !important;
  }
  .leaders-card .table-wrap,
  .watch-card-wrap .watch-list,
  .breakout-card .breakout-list,
  .theme-card .theme-list,
  .supply-card .table-wrap { height: auto !important; max-height: 65vh !important; overflow-y: auto !important; }
}
@media (max-width: 760px) {
  .rank-mini-list { grid-template-columns: 1fr !important; }
  .heatmap-grid { grid-template-columns: 1fr !important; }
}


/* =========================================================
   v6 layout/data polish
========================================================= */
.report-main {
  --tm-left-col: 360px !important;
  --tm-right-col: 420px !important;
  --tm-gap: 14px !important;
}
.report-kpis-v7 {
  grid-template-columns: var(--tm-left-col) minmax(0, 1fr) var(--tm-right-col) !important;
  grid-template-areas: "index center supply" !important;
  align-items: stretch !important;
}
.report-kpis-v7 .index-combo-card,
.report-kpis-v7 .rank-center-group .kpi-rank-card,
.report-kpis-v7 .index-supply-card {
  height: 154px !important;
  min-height: 154px !important;
}
.index-combo-card .index-name {
  font-size: 13px !important;
  line-height: 1.15 !important;
  letter-spacing: -0.02em !important;
}
.index-combo-card strong {
  font-size: 25px !important;
  line-height: 1.05 !important;
}
.index-combo-card .index-change {
  font-size: 12px !important;
  line-height: 1.25 !important;
}
.index-combo-row { gap: 4px !important; }
.index-mini-item { padding: 7px 0 !important; }
.report-kpis-v7 .rank-center-group {
  display:grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: var(--tm-gap) !important;
}
.kpi-rank-card { padding: 14px 16px !important; }
.rank-card-head { margin-bottom: 7px !important; }
.rank-mini-market > strong {
  font-size: 13px !important;
  line-height: 1.1 !important;
  margin-bottom: 5px !important;
  color:#64748b !important;
}
.rank-mini-row { font-size: 12px !important; grid-template-columns: 22px minmax(0,1fr) 64px !important; margin-bottom: 4px !important; }
.rank-mini-row span { font-size: 12px !important; }
.rank-mini-row em { font-size: 12px !important; }

.report-grid,
.dashboard-grid.report-grid {
  grid-template-columns: var(--tm-left-col) minmax(0, 1fr) var(--tm-right-col) !important;
  grid-template-rows: 255px 535px 665px auto auto auto !important;
  grid-template-areas:
    "summary leaders watch"
    "breakout leaders watch"
    "theme supply supply"
    "minervini minervini minervini"
    "kullamagi kullamagi kullamagi"
    "valuation valuation valuation" !important;
  gap: var(--tm-gap) !important;
  align-items: stretch !important;
}
.leaders-card .table-wrap { max-height: calc(100% - 76px) !important; height: calc(100% - 76px) !important; }
.watch-card-wrap .watch-list { height: calc(100% - 58px) !important; overflow-y: hidden !important; gap: 10px !important; }
.watch-card { padding: 13px !important; }
.watch-card p { line-height: 1.42 !important; }
.breakout-card .breakout-list { height: calc(100% - 58px) !important; overflow-y: auto !important; }
.breakout-item { padding: 12px !important; }
.theme-card .theme-list { height: calc(100% - 58px) !important; overflow-y: hidden !important; gap: 11px !important; }
.supply-card .table-wrap { max-height: calc(100% - 68px) !important; height: calc(100% - 68px) !important; }
.theme-card .theme-row { padding: 11px 12px !important; margin-bottom: 8px !important; }
.theme-card .theme-top strong { font-size: 14px !important; }
.theme-card .theme-top span { font-size: 11px !important; }
.theme-card .theme-bar { height: 8px !important; margin: 7px 0 !important; }
.theme-card .theme-meta span { font-size: 11px !important; padding: 3px 7px !important; }
.theme-heatmap-btn { display: none !important; }

/* 종목명 배경 강조 제거 */
.scanner-name-cell.scanner-overlap .stock-link,
.scanner-name-cell .stock-link {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
}
.scanner-name-cell.scanner-overlap .stock-link strong { color: inherit !important; }

/* 네이버식에 가까운 종목 타일형 히트맵 */
.heatmap-modal-card {
  width: min(1600px, calc(100vw - 28px)) !important;
  height: min(940px, calc(100vh - 28px)) !important;
  background: #111827 !important;
  color: #fff !important;
}
.heatmap-modal-head {
  background: #0f172a !important;
  color: #fff !important;
  border-bottom-color: #1f2937 !important;
}
.heatmap-modal-head p { color: #cbd5e1 !important; }
.heatmap-tab,
.heatmap-modal-close { background:#fff !important; color:#0f172a !important; border:1px solid #cbd5e1 !important; }
.heatmap-tab.active { background:#2563eb !important; color:#fff !important; }
.heatmap-grid {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(180px, 1fr)) !important;
  grid-auto-rows: minmax(146px, auto) !important;
  gap: 6px !important;
  padding: 10px !important;
  background: #111827 !important;
  overflow: auto !important;
  align-items: stretch !important;
}
.heatmap-sector-card {
  min-width: 0 !important;
  border: 1px solid #263244 !important;
  border-radius: 2px !important;
  padding: 4px !important;
  background: #1f2937 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}
.heatmap-sector-card:nth-child(1) { grid-column: span 2; grid-row: span 2; }
.heatmap-sector-card:nth-child(2),
.heatmap-sector-card:nth-child(3) { grid-column: span 2; }
.heatmap-sector-card:nth-child(4),
.heatmap-sector-card:nth-child(5),
.heatmap-sector-card:nth-child(6) { grid-column: span 1; }
.heatmap-sector-head {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) auto !important;
  gap: 3px 6px !important;
  align-items: start !important;
  padding: 3px 4px !important;
  color: #e5e7eb !important;
}
.heatmap-sector-head strong { font-size: 12px !important; line-height: 1.1 !important; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.heatmap-sector-head b { font-size: 12px !important; white-space:nowrap; }
.heatmap-sector-head span { grid-column:1 / -1; font-size:10px !important; color:#9ca3af !important; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.stock-heat-grid {
  flex: 1 !important;
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(48px, 1fr)) !important;
  grid-auto-rows: minmax(38px, 1fr) !important;
  gap: 3px !important;
  min-height: 92px !important;
}
.stock-heat-tile {
  min-height: 38px !important;
  border-radius: 2px !important;
  padding: 4px !important;
  color: #fff !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
}
.stock-heat-tile.big { grid-column: span 2; grid-row: span 2; }
.stock-heat-tile.mid { grid-column: span 2; }
.stock-heat-tile strong { display:block; max-width:100%; font-size:11px !important; line-height:1.08 !important; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.stock-heat-tile em { font-style:normal; font-size:11px !important; font-weight:900; margin-top:2px; }
.hm-up5 { background:#dc2626 !important; }
.hm-up4 { background:#ef4444 !important; }
.hm-up3 { background:#f87171 !important; }
.hm-up2 { background:#924248 !important; }
.hm-down5 { background:#1d4ed8 !important; }
.hm-down4 { background:#2563eb !important; }
.hm-down2 { background:#315277 !important; }
.hm-flat { background:#374151 !important; }

@media (max-width: 1300px) {
  .heatmap-grid { grid-template-columns: repeat(3, minmax(180px, 1fr)) !important; }
}
@media (max-width: 760px) {
  .heatmap-grid { grid-template-columns: repeat(2, minmax(150px, 1fr)) !important; }
  .heatmap-sector-card:nth-child(n) { grid-column: span 1; grid-row: span 1; }
}


/* =========================================================
   v9: top rank fill + ECharts treemap polish
========================================================= */
.report-kpis-v7 {
  margin-bottom: 18px !important;
}
.report-grid,
.dashboard-grid.report-grid {
  margin-top: 0 !important;
}
.heatmap-modal-card {
  width: min(1660px, calc(100vw - 24px)) !important;
  height: min(920px, calc(100vh - 24px)) !important;
  background: #111827 !important;
  color: #fff !important;
}
.heatmap-modal-head {
  min-height: 68px !important;
  padding: 14px 18px !important;
  background: #0f172a !important;
  color: #fff !important;
  border-bottom: 1px solid #273244 !important;
}
.heatmap-modal-head h3 {
  color: #fff !important;
  font-size: 22px !important;
  line-height: 1.2 !important;
}
.heatmap-modal-head p {
  color: #cbd5e1 !important;
  font-size: 13px !important;
}
.heatmap-grid.heatmap-echarts-grid,
.heatmap-echarts-grid {
  display: block !important;
  width: 100% !important;
  height: calc(100% - 68px) !important;
  min-height: 620px !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #111827 !important;
}
.heatmap-grid.heatmap-echarts-grid > div {
  max-width: none !important;
}
@media (max-width: 900px) {
  .report-kpis-v7 { margin-bottom: 14px !important; }
  .heatmap-grid.heatmap-echarts-grid { min-height: 70vh !important; }
}


/* =========================================================
   v11 restore: keep v9 layout + corrected heatmap data display
========================================================= */
.report-kpis-v7 {
  margin-bottom: 18px !important;
}
.report-grid,
.dashboard-grid.report-grid {
  grid-template-columns: var(--tm-left-col) minmax(0, 1fr) var(--tm-right-col) !important;
  grid-template-rows: 230px 560px 500px auto auto auto !important;
  grid-template-areas:
    "summary leaders watch"
    "breakout leaders watch"
    "theme supply supply"
    "minervini minervini minervini"
    "kullamagi kullamagi kullamagi"
    "valuation valuation valuation" !important;
  gap: var(--tm-gap) !important;
  align-items: stretch !important;
}
.breakout-card .breakout-list {
  height: calc(100% - 58px) !important;
  overflow-y: auto !important;
}
.theme-card .theme-list {
  height: calc(100% - 58px) !important;
  overflow-y: auto !important;
  gap: 10px !important;
}
.supply-card .table-wrap {
  max-height: calc(100% - 68px) !important;
  height: calc(100% - 68px) !important;
}
.leaders-card table,
.supply-card table {
  font-size: 13px !important;
}
.leaders-card th,
.leaders-card td {
  font-size: 13px !important;
}

/* 미너비니 가로 스크롤 최소화 */
.minervini-card .table-wrap {
  overflow-x: auto !important;
}
.minervini-card table {
  min-width: 1500px !important;
  font-size: 12.5px !important;
}
.minervini-card th,
.minervini-card td {
  padding-left: 7px !important;
  padding-right: 7px !important;
}
.minervini-card th:nth-child(1), .minervini-card td:nth-child(1) { width: 46px !important; }
.minervini-card th:nth-child(2), .minervini-card td:nth-child(2) { width: 135px !important; }
.minervini-card th:nth-child(3), .minervini-card td:nth-child(3) { width: 66px !important; }
.minervini-card th:nth-child(4), .minervini-card td:nth-child(4) { width: 64px !important; }
.minervini-card th:nth-child(5), .minervini-card td:nth-child(5) { width: 88px !important; }
.minervini-card th:nth-child(6), .minervini-card td:nth-child(6) { width: 78px !important; }
.minervini-card th:nth-child(7), .minervini-card td:nth-child(7) { width: 70px !important; }
.minervini-card th:nth-child(8), .minervini-card td:nth-child(8),
.minervini-card th:nth-child(9), .minervini-card td:nth-child(9),
.minervini-card th:nth-child(10), .minervini-card td:nth-child(10) { width: 56px !important; }
.minervini-card th:nth-child(11), .minervini-card td:nth-child(11),
.minervini-card th:nth-child(12), .minervini-card td:nth-child(12),
.minervini-card th:nth-child(13), .minervini-card td:nth-child(13) { width: 76px !important; }
.minervini-card th:nth-child(14), .minervini-card td:nth-child(14) { width: 84px !important; }
.minervini-card th:nth-child(15), .minervini-card td:nth-child(15),
.minervini-card th:nth-child(16), .minervini-card td:nth-child(16) { width: 112px !important; }
.minervini-card th:nth-child(17), .minervini-card td:nth-child(17) { width: 68px !important; }
.minervini-card th:nth-child(18), .minervini-card td:nth-child(18) { width: 150px !important; white-space: normal !important; }

/* 배경 강조 제거 유지 */
.scanner-name-cell.scanner-overlap .stock-link,
.scanner-name-cell .stock-link {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
}
.scanner-name-cell.scanner-overlap .stock-link strong { color: inherit !important; }

/* v9 스타일의 ECharts 히트맵 유지 */
.heatmap-modal-card {
  width: min(1660px, calc(100vw - 24px)) !important;
  height: min(920px, calc(100vh - 24px)) !important;
  background: #111827 !important;
  color: #fff !important;
}
.heatmap-modal-head {
  min-height: 68px !important;
  padding: 14px 18px !important;
  background: #0f172a !important;
  color: #fff !important;
  border-bottom: 1px solid #273244 !important;
}
.heatmap-modal-head h3 { color:#fff !important; font-size:22px !important; line-height:1.2 !important; }
.heatmap-modal-head p { color:#cbd5e1 !important; font-size:13px !important; }
.heatmap-grid.heatmap-echarts-grid,
.heatmap-echarts-grid {
  display:block !important;
  width:100% !important;
  height:calc(100% - 68px) !important;
  min-height:620px !important;
  padding:0 !important;
  overflow:hidden !important;
  background:#111827 !important;
}
.heatmap-grid.heatmap-echarts-grid > div { max-width:none !important; }
@media (max-width: 900px) {
  .report-kpis-v7 { margin-bottom: 14px !important; }
  .heatmap-grid.heatmap-echarts-grid { min-height: 70vh !important; }
}


/* ===============================
   v27 scope button grouping + Minervini header polish
================================ */
.scope-tabs-grouped {
  align-items: center;
}
.scope-divider {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  height: 28px;
  padding: 0 2px;
  color: #94a3b8;
  font-weight: 900;
  line-height: 1;
  user-select: none;
}
.minervini-card th[data-sort] {
  padding-right: 22px !important;
}
.minervini-card th[data-sort]::after {
  right: 7px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  line-height: 1 !important;
}
.minervini-card thead th {
  vertical-align: middle !important;
  line-height: 1.25 !important;
}
.minervini-card th:nth-child(2),
.minervini-card th:nth-child(4) {
  text-align: left !important;
}
.minervini-card th:nth-child(3) {
  text-align: center !important;
}
.minervini-card th:nth-child(5),
.minervini-card th:nth-child(6),
.minervini-card th:nth-child(7),
.minervini-card th:nth-child(8),
.minervini-card th:nth-child(9),
.minervini-card th:nth-child(10),
.minervini-card th:nth-child(11),
.minervini-card th:nth-child(12),
.minervini-card th:nth-child(13),
.minervini-card th:nth-child(14),
.minervini-card th:nth-child(15),
.minervini-card th:nth-child(16),
.minervini-card th:nth-child(17) {
  text-align: right !important;
}


/* v29: env watchlist limit display fix */
.watch-card-wrap .watch-list {
  overflow-y: auto !important;
  overflow-x: hidden !important;
}
.watch-card-wrap .watch-list::-webkit-scrollbar {
  width: 6px;
}
.watch-card-wrap .watch-list::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 999px;
}

/* ===============================
   v30: watchlist uses env limit + vertical scroll
   - keep card size
   - show all rows returned by API
   - scroll when rows exceed visible area
================================ */
.watch-card-wrap {
  min-height: 0 !important;
  overflow: hidden !important;
}
.watch-card-wrap .watch-list {
  max-height: none !important;
  height: calc(100% - 58px) !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding-right: 4px !important;
}
.watch-card-wrap .watch-list::-webkit-scrollbar {
  width: 6px !important;
}
.watch-card-wrap .watch-list::-webkit-scrollbar-thumb {
  background: #cbd5e1 !important;
  border-radius: 999px !important;
}


/* =========================================================
   v32 final: watchlist count/scroll + mobile one-column fix
   - Desktop: watch card scrolls inside the right panel.
   - Tablet/mobile: whole report stacks vertically; wide tables scroll inside their own boxes.
========================================================= */
html,
body {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
}

.report-layout,
.layout.report-layout,
.report-main,
.main.report-main {
  min-width: 0 !important;
  max-width: 100% !important;
}

.report-grid,
.dashboard-grid.report-grid {
  min-width: 0 !important;
}

.report-grid > .card,
.dashboard-grid.report-grid > .card {
  min-width: 0 !important;
}

/* Desktop/tablet right watchlist card: keep fixed card height and scroll rows inside */
.watch-card-wrap {
  min-height: 0 !important;
  overflow: hidden !important;
}

.watch-card-wrap .watch-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  min-height: 0 !important;
  height: calc(100% - 58px) !important;
  max-height: none !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding-right: 4px !important;
}

.watch-card {
  flex: 0 0 auto !important;
}

.watch-card-wrap .watch-list::-webkit-scrollbar {
  width: 6px !important;
}

.watch-card-wrap .watch-list::-webkit-scrollbar-thumb {
  background: #cbd5e1 !important;
  border-radius: 999px !important;
}

/* 1024px 이하에서는 오른쪽으로 밀리지 않고 세로로 쭉 쌓이게 고정 */
@media (max-width: 1024px) {
  .layout,
  .layout.report-layout {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 14px !important;
  }

  .main,
  .main.report-main {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  .report-topbar {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
  }

  .report-actions,
  .report-date-actions {
    justify-content: flex-start !important;
    width: 100% !important;
  }

  .report-kpis,
  .kpi-row.report-kpis,
  .report-kpis-v7 {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "index"
      "center"
      "supply" !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .report-grid,
  .dashboard-grid.report-grid,
  .dashboard-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: none !important;
    grid-auto-rows: auto !important;
    grid-template-areas:
      "summary"
      "leaders"
      "watch"
      "breakout"
      "theme"
      "supply"
      "minervini"
      "kullamagi"
      "valuation" !important;
    gap: 14px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow: visible !important;
  }

  .market-summary,
  .leaders-card,
  .watch-card-wrap,
  .breakout-card,
  .theme-card,
  .supply-card,
  .minervini-card,
  .kullamagi-card,
  .valuation-card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  .leaders-card .table-wrap,
  .supply-card .table-wrap,
  .minervini-card .table-wrap,
  .kullamagi-card .table-wrap,
  .valuation-card .table-wrap {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 65vh !important;
    overflow-x: auto !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .watch-card-wrap .watch-list,
  .breakout-card .breakout-list,
  .theme-card .theme-list {
    height: auto !important;
    max-height: 65vh !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
  }
}

@media (max-width: 760px) {
  .layout,
  .layout.report-layout {
    padding: 10px !important;
  }

  h1,
  #pageTitle {
    font-size: 24px !important;
    line-height: 1.2 !important;
  }

  .report-logo {
    width: 40px !important;
    height: 40px !important;
    flex: 0 0 40px !important;
  }

  .report-title-wrap {
    align-items: center !important;
    min-width: 0 !important;
  }

  .report-actions,
  .report-date-actions {
    display: grid !important;
    grid-template-columns: 1fr 1.35fr 1fr !important;
    gap: 8px !important;
  }

  .date-control,
  .date-select-control,
  #reportDateSelect,
  #btnTradingNote,
  #btnHelp {
    width: 100% !important;
    min-width: 0 !important;
  }

  #btnTradingNote,
  #btnHelp {
    grid-column: span 1 !important;
  }

  .card {
    padding: 14px !important;
    border-radius: 18px !important;
  }

  .card-head {
    flex-direction: row !important;
    align-items: flex-start !important;
  }

  .watch-card-wrap .watch-list,
  .breakout-card .breakout-list,
  .theme-card .theme-list {
    max-height: 70vh !important;
  }

  .watch-card {
    padding: 12px !important;
  }

  .watch-card h4 {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    min-width: 0 !important;
  }

  .watch-card h4 .stock-link {
    min-width: 0 !important;
  }
}

/* =========================================================
   Final mobile fix: 업종별/테마별 순위 카드를 모바일에서 1열 전체폭으로 표시
   - 데스크톱/태블릿 레이아웃은 유지
   - 모바일에서 업종별 카드, 테마별 카드가 각각 가로 전체폭을 차지
========================================================= */
@media (max-width: 760px) {
  .report-kpis,
  .kpi-row.report-kpis,
  .report-kpis-v7 {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas:
      "index"
      "center"
      "supply" !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow: visible !important;
  }

  .report-kpis-v7 .rank-center-group,
  .rank-center-group {
    grid-area: center !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  .report-kpis-v7 .rank-center-group .kpi-rank-card,
  .kpi-rank-card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 14px 16px !important;
  }

  .kpi-rank-card .rank-mini-list {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px 12px !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  .kpi-rank-card .rank-mini-market {
    min-width: 0 !important;
  }

  .kpi-rank-card .rank-mini-row {
    display: grid !important;
    grid-template-columns: 22px minmax(0, 1fr) 58px !important;
    gap: 6px !important;
    min-width: 0 !important;
  }

  .kpi-rank-card .rank-mini-row span {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
}


/* =========================================================
   iPhone Home Screen(PWA) market supply card fix
   - 홈화면 추가 실행 시 iOS standalone viewport에서 시장 수급 카드가 136px 고정 높이에 잘리는 현상 방지
   - 외국인/기관/개인 영역과 안내 문구가 카드 높이에 맞춰 자연스럽게 확장되도록 처리
========================================================= */
@media (max-width: 760px) {
  .report-kpis-v7 .index-supply-card,
  .index-supply-card {
    height: auto !important;
    min-height: 168px !important;
    overflow: visible !important;
    padding: 14px 16px !important;
  }

  .index-supply-card .index-card-top {
    margin-bottom: 7px !important;
  }

  .index-supply-card .market-supply-tabs,
  .market-supply-tabs {
    margin: 5px 0 8px !important;
  }

  .index-supply-card .index-supply-grid,
  .index-supply-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }

  .index-supply-card .index-supply-grid span,
  .index-supply-grid span {
    min-height: 44px !important;
    padding: 7px 8px !important;
    overflow: visible !important;
  }

  .index-supply-card .index-supply-grid b,
  .index-supply-grid b {
    font-size: 13px !important;
    line-height: 1.15 !important;
    white-space: nowrap !important;
  }

  .index-supply-card .index-supply-note,
  .index-supply-note {
    margin-top: 8px !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    line-height: 1.3 !important;
  }
}

@media (max-width: 760px) and (display-mode: standalone) {
  .report-kpis-v7 .index-supply-card,
  .index-supply-card {
    min-height: 178px !important;
    padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px)) !important;
  }
}