:root {
  --rx-navy: #0b2f6b;
  --rx-blue: #1f5fd6;
  --rx-orange: #e8622c;
  --rx-line: #e2e6ec;
  --rx-bg: #f4f6f9;
  --rx-ink: #1b2430;
  --rx-slate: #5a6472;
  --rx-green: #1a7a52;
}

* { box-sizing: border-box; }

body.report-app {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  background: var(--rx-bg);
  color: var(--rx-ink);
  height: 100vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.rx-disclosure {
  background: #fff8e6;
  color: #7a5b00;
  font-size: 0.78rem;
  text-align: center;
  padding: 0.4rem 1rem;
  border-bottom: 1px solid #f0dca0;
  flex-shrink: 0;
}
.rx-disclosure a { color: #7a5b00; }

/* HEADER */
.rx-header {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  padding: 0.7rem 1.25rem;
  background: #fff;
  border-bottom: 1px solid var(--rx-line);
  flex-shrink: 0;
}
.rx-brand { display: flex; align-items: center; gap: 0.6rem; }
.rx-brand .stars { color: var(--rx-navy); font-size: 0.9rem; letter-spacing: 2px; }
.rx-brand .word { display: flex; flex-direction: column; line-height: 1.05; }
.rx-brand .word b { font-size: 1.15rem; color: var(--rx-navy); letter-spacing: 0.02em; }
.rx-brand .word span { font-size: 0.55rem; color: var(--rx-slate); letter-spacing: 0.08em; }

.rx-title { font-size: 1.3rem; font-weight: 700; display: flex; align-items: center; gap: 0.4rem; white-space: nowrap; }
.rx-datenote { font-size: 0.78rem; color: var(--rx-blue); font-weight: 600; white-space: nowrap; }

.rx-tabs { display: flex; gap: 0.4rem; margin-left: auto; }
.rx-tab-btn {
  border: none; border-radius: 6px; padding: 0.55rem 1.3rem;
  font-size: 0.92rem; font-weight: 600; cursor: pointer;
  background: #eef1f5; color: var(--rx-ink);
  border-bottom: 3px solid transparent;
}
.rx-tab-btn.active { background: var(--rx-navy); color: #fff; }

.rx-reset {
  background: var(--rx-navy); color: #fff; border: none; border-radius: 6px;
  padding: 0.55rem 1.1rem; font-size: 0.85rem; font-weight: 700; cursor: pointer;
  display: flex; align-items: center; gap: 0.4rem;
}
.rx-reset:hover { background: #123a80; }

/* LAYOUT */
.rx-body { flex: 1; display: flex; overflow: hidden; }

.rx-sidebar {
  width: 250px; flex-shrink: 0; background: #fff; border-right: 1px solid var(--rx-line);
  padding: 1rem; overflow-y: auto;
}
.rx-source-toggle { display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem; }
.rx-source-btn {
  border: 2px solid var(--rx-orange); border-radius: 8px; padding: 0.7rem;
  background: #fff; color: var(--rx-ink); font-weight: 700; font-size: 0.9rem;
  cursor: pointer; text-align: center;
}
.rx-source-btn.active { background: var(--rx-navy); border-color: var(--rx-navy); color: #fff; }

.rx-mini-table { width: 100%; border-collapse: collapse; font-size: 0.78rem; margin-bottom: 1rem; }
.rx-mini-table th { text-align: left; padding: 0.35rem 0.3rem; border-bottom: 2px solid var(--rx-navy); color: var(--rx-slate); }
.rx-mini-table td { padding: 0.32rem 0.3rem; border-bottom: 1px solid var(--rx-line); }
.rx-mini-table td.num { text-align: right; font-variant-numeric: tabular-nums; }

.rx-bu-header { background: var(--rx-orange); color: #fff; font-weight: 700; padding: 0.5rem 0.7rem; border-radius: 6px; font-size: 0.85rem; margin-bottom: 0.5rem; }
.rx-bu-list label { display: flex; align-items: center; gap: 0.5rem; font-size: 0.85rem; padding: 0.3rem 0.2rem; cursor: pointer; }
.rx-bu-list input { flex-shrink: 0; }

.rx-funnel { margin-top: 1.2rem; }
.rx-funnel-bar { border-radius: 4px; padding: 0.5rem 0.7rem; font-weight: 700; font-size: 0.85rem; color: #fff; margin-bottom: 0.35rem; display: flex; justify-content: space-between; }
.rx-funnel-bar.total { background: var(--rx-blue); width: 100%; }
.rx-funnel-bar.closed { background: var(--rx-green); }
.rx-funnel-bar.open { background: var(--rx-orange); }

/* MAIN */
.rx-main { flex: 1; overflow-y: auto; padding: 1.5rem 1.75rem; }
.rx-kpi { font-size: 1.7rem; font-weight: 700; color: var(--rx-ink); margin-bottom: 0.5rem; }
.rx-kpi .accent { color: var(--rx-blue); }
.rx-kpi-rule { height: 3px; width: 260px; background: var(--rx-navy); margin-bottom: 1.5rem; }

/* FILTER TAB */
.rx-filter-grid { display: grid; grid-template-columns: 1fr 1fr 1.3fr; gap: 1rem; align-items: start; }
.rx-panel { background: #fff; border: 1px solid var(--rx-line); border-radius: 8px; overflow: hidden; }
.rx-panel-head { background: var(--rx-navy); color: #fff; font-weight: 700; padding: 0.55rem 0.9rem; font-size: 0.85rem; }
.rx-panel-body { padding: 0.75rem 0.9rem; max-height: 260px; overflow-y: auto; }
.rx-search { display: flex; align-items: center; border: 1px solid var(--rx-line); border-radius: 6px; padding: 0.4rem 0.6rem; margin-bottom: 0.5rem; gap: 0.4rem; }
.rx-search input { border: none; outline: none; flex: 1; font-size: 0.85rem; }
.rx-check-row { display: flex; justify-content: space-between; align-items: center; padding: 0.28rem 0; font-size: 0.83rem; }
.rx-check-row label { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rx-check-row .val { color: var(--rx-slate); font-variant-numeric: tabular-nums; flex-shrink: 0; margin-left: 0.5rem; }
.rx-daterange-panel { grid-column: 1 / -1; background: #fff; border: 1px solid var(--rx-line); border-radius: 8px; overflow: hidden; margin-top: 1rem; }
.rx-daterange-body { padding: 1rem 1.2rem; }
.rx-date-inputs { display: flex; gap: 1rem; margin-bottom: 1rem; }
.rx-date-inputs input { border: 1px solid var(--rx-line); border-radius: 6px; padding: 0.5rem 0.7rem; font-size: 0.9rem; }
.rx-slider-wrap { position: relative; height: 34px; }
.rx-slider-wrap input[type=range] {
  position: absolute; width: 100%; top: 10px; pointer-events: none;
  -webkit-appearance: none; appearance: none; background: transparent; margin: 0;
}
.rx-slider-wrap input[type=range]::-webkit-slider-thumb {
  pointer-events: auto; -webkit-appearance: none; width: 18px; height: 18px;
  border-radius: 50%; background: var(--rx-blue); border: 2px solid #fff; box-shadow: 0 0 0 1px var(--rx-blue); cursor: pointer;
}
.rx-slider-track { position: absolute; top: 15px; left: 0; right: 0; height: 4px; background: var(--rx-line); border-radius: 2px; }
.rx-slider-fill { position: absolute; top: 15px; height: 4px; background: var(--rx-blue); border-radius: 2px; }

/* TABLE TAB */
.rx-subtabs { display: flex; gap: 0.5rem; margin-bottom: 1rem; }
.rx-subtab-btn { border: 1px solid var(--rx-navy); background: #fff; color: var(--rx-navy); font-weight: 700; padding: 0.4rem 1rem; border-radius: 6px; cursor: pointer; font-size: 0.85rem; }
.rx-subtab-btn.active { background: var(--rx-navy); color: #fff; }

table.rx-table { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid var(--rx-line); border-radius: 8px; overflow: hidden; font-size: 0.85rem; }
table.rx-table th { text-align: left; background: #f4f6f9; padding: 0.6rem 0.8rem; border-bottom: 2px solid var(--rx-navy); cursor: pointer; white-space: nowrap; user-select: none; }
table.rx-table th.num, table.rx-table td.num { text-align: right; font-variant-numeric: tabular-nums; }
table.rx-table td { padding: 0.5rem 0.8rem; border-bottom: 1px solid var(--rx-line); }
table.rx-table tr.rx-total-row td { font-weight: 700; border-top: 2px solid var(--rx-navy); }
table.rx-table tr.rx-sub-row td { color: var(--rx-slate); background: #fafbfc; }
.rx-expand-btn { border: 1px solid var(--rx-line); background: #fff; width: 18px; height: 18px; border-radius: 3px; cursor: pointer; font-size: 0.75rem; line-height: 1; margin-right: 0.4rem; }
td.num.open-col { color: var(--rx-orange); }
td.num.closed-col { color: var(--rx-green); }

/* GRAPHICS TAB */
.rx-graphics-subtabs { display: flex; gap: 0.5rem; margin-bottom: 1rem; }
.rx-graphics-layout { display: grid; grid-template-columns: 1fr 320px; gap: 1rem; }
.rx-chart-card { background: #fff; border: 1px solid var(--rx-line); border-radius: 8px; padding: 1.1rem 1.2rem; }
.rx-legend { display: flex; flex-wrap: wrap; gap: 0.9rem; margin-bottom: 0.8rem; font-size: 0.8rem; }
.rx-legend .item { display: flex; align-items: center; gap: 0.35rem; cursor: pointer; opacity: 1; }
.rx-legend .item.off { opacity: 0.35; }
.rx-legend .sw { width: 11px; height: 11px; border-radius: 2px; display: inline-block; }
.rx-side-col { display: flex; flex-direction: column; gap: 1rem; }
.rx-side-panel { background: #fff; border: 1px solid var(--rx-line); border-radius: 8px; overflow: hidden; }
.rx-side-panel .rx-panel-head { font-size: 0.8rem; }
table.rx-side-table { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
table.rx-side-table th { text-align: left; padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rx-line); color: var(--rx-slate); font-weight: 600; }
table.rx-side-table td { padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--rx-line); }
table.rx-side-table td.num { text-align: right; font-variant-numeric: tabular-nums; }
.rx-spark { display: inline-block; height: 20px; }

.rx-orders-toggle { display: flex; gap: 0.4rem; margin-bottom: 0.9rem; }
.rx-orders-toggle button { border: none; background: #eef1f5; padding: 0.4rem 1rem; border-radius: 6px; cursor: pointer; font-weight: 600; font-size: 0.82rem; }
.rx-orders-toggle button.active { background: var(--rx-blue); color: #fff; }

.rx-annot-label { font-size: 0.68rem; fill: var(--rx-navy); font-family: monospace; }

@media (max-width: 1100px) {
  .rx-filter-grid { grid-template-columns: 1fr; }
  .rx-graphics-layout { grid-template-columns: 1fr; }
}