:root {
  --bg: #f5f7f6;
  --surface: #ffffff;
  --surface-2: #f8fafb;
  --line: #dce4e2;
  --text: #17252a;
  --muted: #68777b;
  --faint: #819694;
  --ink: #17252a;
  --teal: #168b84;
  --teal-2: #106f69;
  --teal-soft: #e3f4f1;
  --red: #fe2c55;
  --green: #12915b;
  --amber: #b06a00;
  --blue: #2c6bed;
  --shadow: 0 8px 22px rgba(17, 42, 45, 0.06);
  --radius: 3px;
  --report-table-sticky-top: 78px;
  --report-table-sticky-left: 256px;
  --paper: var(--bg);
  --panel: var(--surface);
  --accent: var(--teal);
  --accent-soft: var(--teal-soft);
  --good: var(--green);
  --warn: var(--amber);
  --danger: var(--red);
  font-family: Inter, "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
  color: var(--text);
  background: var(--bg);
}
* { box-sizing: border-box; }
html, body { height: 100%; overflow: hidden; }
body { margin: 0; min-width: 320px; background: var(--paper); color: var(--ink); }
button, input, select { font: inherit; }
a { color: var(--accent); }
[hidden] { display: none !important; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.page-workspace { min-width: 0; background: var(--bg); }
.report-filters { position: sticky; top: 0; z-index: 8; display: flex; align-items: end; gap: .62rem; min-height: 56px; padding: .52rem 1.1rem; background: rgba(255,255,255,.97); border-bottom: 1px solid var(--line); box-shadow: 0 4px 14px rgba(17,42,45,.04); overflow-x: auto; }
.report-filters label { flex: 0 0 auto; display: grid; gap: .22rem; color: var(--muted); font-size: .72rem; font-weight: 700; white-space: nowrap; }
.report-filters input, .report-filters select, .table-tools input { min-width: 118px; height: 34px; padding: 0 .62rem; color: var(--text); background: #fff; border: 1px solid #cdd8d6; border-radius: 3px; outline: none; }
.report-filters input:focus, .report-filters select:focus, .table-tools input:focus { border-color: var(--teal); box-shadow: 0 0 0 3px rgba(0,166,166,.12); }
.report-filters button, .secondary-button { flex: 0 0 auto; height: 34px; padding: 0 .88rem; border: 1px solid var(--teal); border-radius: 3px; background: var(--teal); color: #fff; font-weight: 800; cursor: pointer; }
.report-filters button:disabled { opacity: .6; cursor: wait; }
.secondary-button { background: #fff; color: var(--teal-2); }
.report-main { padding: 1rem 1.25rem 2rem; }
.report-view { animation: view-in .18s ease-out; }
@keyframes view-in { from { opacity: .45; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.heading-link { flex: 0 0 auto; font-weight: 800; }
.section-no { margin: 0; color: var(--accent); font: 800 .7rem Consolas, monospace; letter-spacing: .12em; }
.integrity-rail { display: grid; grid-template-columns: minmax(160px, .8fr) minmax(220px, 2fr) minmax(180px, .9fr); align-items: center; gap: 1.2rem; padding: .85rem 1rem; background: #18383c; color: #eef7f5; border-radius: var(--radius); box-shadow: var(--shadow); }
.integrity-rail h3 { margin: .25rem 0 0; }
.rail-track { height: 8px; overflow: hidden; background: rgba(255,255,255,.15); }
.rail-track span { display: block; width: 0; height: 100%; background: var(--teal); transition: width .25s ease; }
.rail-copy { display: grid; gap: .2rem; text-align: right; }
.rail-copy strong { font-size: 1.45rem; }
.rail-copy span { color: #b8ccca; font-size: .76rem; }
.metric-grid, .dictionary-summary, .raw-order-source-status { display: grid; grid-template-columns: repeat(5, minmax(150px, 1fr)); gap: 1px; margin-top: .9rem; background: var(--line); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.metric { min-width: 0; padding: 1rem; background: var(--panel); }
.metric span { display: block; color: var(--muted); font-size: .75rem; }
.metric strong { display: block; margin-top: .4rem; overflow: hidden; color: var(--ink); font-size: clamp(.92rem, 1.35vw, 1.25rem); text-overflow: ellipsis; white-space: nowrap; }
.metric[data-tone="good"] strong { color: var(--good); }
.metric[data-tone="warn"] strong { color: var(--warn); }
.overview-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; margin-top: 1.25rem; }
.profit-structure-card { margin-top: 1.25rem; }
.profit-structure-table-shell table { min-width: 980px; }
.profit-structure-table-shell tbody tr[data-state="missing"] td { color: var(--muted); }
.configuration-panel { margin-top: 1.25rem; }
.profit-breakdown-inline { position: relative; display: block; width: min(180px, 22vw); min-width: 110px; height: 10px; overflow: hidden; background: #e8efed; border-radius: 999px; }
.profit-breakdown-fill { position: absolute; inset: 0 auto 0 0; width: var(--w); min-width: 2px; background: var(--accent); border-radius: inherit; }
.profit-breakdown-fill[data-tone="expense"] { background: #d36a62; }
.profit-breakdown-fill[data-tone="profit"] { background: var(--good); }
tr[data-state="missing"] .profit-breakdown-inline { background: repeating-linear-gradient(90deg, #edf2f1 0 8px, #f8faf9 8px 14px); }
.panel-card { min-width: 0; padding: 1rem; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 8px 24px rgba(18,22,29,.04); }
.panel-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: .9rem; }
.panel-heading span { color: var(--muted); font-size: .72rem; letter-spacing: .08em; }
.panel-heading h3 { margin: .2rem 0 0; }
.panel-heading a { font-size: .8rem; font-weight: 800; }
.queue-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .65rem; }
.queue-grid article { min-width: 0; padding: .85rem; background: #f7faf9; border-left: 3px solid #d2dddb; }
.queue-grid span { color: var(--muted); font-size: .75rem; }
.queue-grid strong { display: block; margin: .3rem 0; font-size: 1.35rem; }
.queue-grid p { margin: 0; color: var(--muted); font-size: .75rem; line-height: 1.5; }
.table-tools { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: .55rem; }
.table-tools input { min-width: min(320px, 50vw); }
.table-tools span { color: var(--muted); font-size: .8rem; }
.table-tools div { display: flex; gap: 1rem; font-size: .8rem; font-weight: 800; }
.table-shell { width: 100%; overflow-x: auto; overflow-y: visible; border: 1px solid var(--line); border-radius: 0; background: var(--surface); box-shadow: none; }
.wide-table table, .dictionary-shell table { min-width: 1450px; }
.order-profit-table-shell table { min-width: 2020px; }
.freeze-table { max-height: none; }
.table-shell.freeze-table { overflow: auto; }
.freeze-table th { position: sticky; top: 0; z-index: 4; }
.freeze-table th:first-child, .freeze-table td:first-child { position: sticky; left: 0; min-width: 156px; max-width: 220px; z-index: 3; box-shadow: 10px 0 14px -14px rgba(23,37,42,.55); }
.freeze-table th:first-child { position: sticky; left: 0; top: 0; z-index: 6; background: #edf4f3; color: #1d3d41; }
.freeze-table td:first-child { background: #fff; }
.freeze-table tbody tr:hover > td:first-child { background: #f2f8f7; }
.freeze-table .order-detail-row > td, .freeze-table .empty-row > td { position: static; max-width: none; box-shadow: none; }
table { width: 100%; border-collapse: collapse; font-size: .8rem; }
th, td { padding: .72rem .75rem; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
th { position: sticky; top: 0; z-index: 1; color: #1d3d41; background: #edf4f3; font-size: .73rem; font-weight: 800; white-space: nowrap; box-shadow: inset 0 -1px 0 #cfe0dd; }
tbody tr:hover > td { background: #f2f8f7; }
.empty-row td { padding: 2.4rem 1rem; color: var(--muted); text-align: center; }
.cell-truncate { display: block; max-width: 14rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cell-truncate.wide { max-width: 26rem; }
.cell-truncate.money { color: #244f51; font-family: Consolas, monospace; }
.cell-truncate.status { max-width: 18rem; color: var(--warn); font-weight: 800; }
.cell-sub-ratio,
.cell-sub-metric,
.identity-subline {
  display: block;
  max-width: 13rem;
  margin-top: 5px;
  overflow: hidden;
  color: #68777d;
  font-size: 10px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cell-sub-ratio { font-family: Consolas, Menlo, monospace; }
.cell-sub-metric { color: #8b5a13; font-weight: 800; }
.identity-subline { color: #68727f; font-weight: 600; }
.expand-button { flex: 0 0 auto; width: 24px; height: 24px; padding: 0; border: 1px solid #b8cac7; background: #fff; color: var(--accent); cursor: pointer; }
.order-id-wrapper { display: flex; align-items: center; gap: .45rem; min-width: 0; }
.order-id-text { max-width: 10rem; font-family: Consolas, monospace; font-weight: 800; }
.order-detail-row td { padding: 0; background: #edf5f3; }
.order-item-details { padding: 1rem 1.5rem 1.25rem 3.5rem; }
.order-item-details > strong { display: block; margin-bottom: .65rem; }
.order-item-details table { max-width: 640px; background: #fff; }
.fixture-warning { padding: .75rem .9rem; color: #885819; background: #fff8e9; border: 1px solid #ead4aa; font: 700 .78rem/1.5 Consolas, monospace; }
.source-boundaries { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 1rem; }
.source-boundaries article { min-width: 0; padding: 1rem; background: var(--panel); border: 1px solid var(--line); }
.source-boundaries span { display: block; margin-bottom: .4rem; color: var(--muted); font-size: .75rem; }
.source-boundaries strong { font: 700 .8rem Consolas, monospace; }
.dictionary-tags { display: flex; flex-wrap: wrap; gap: .5rem; margin: .8rem 0; }
.dictionary-tags span, .review-pill { padding: .34rem .6rem; color: #44605f; background: #edf4f3; border: 1px solid #d6e2e0; border-radius: 999px; font-size: .72rem; }
.data-panel { margin-top: 1.2rem; }
.real-field-review-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: .75rem; }
.real-field-review-heading div { display: grid; gap: .25rem; }
.real-field-review-heading div span { color: var(--muted); font-size: .72rem; }
.source-note { margin: .8rem 0 0; color: var(--muted); font-size: .76rem; }
.field-guide { width: min(760px, calc(100vw - 2rem)); padding: 0; border: 0; box-shadow: 0 20px 80px rgba(12,34,36,.3); }
.field-guide::backdrop { background: rgba(8,25,28,.58); }
.dialog-heading { display: flex; align-items: center; justify-content: space-between; padding: 1rem 1.2rem; color: #fff; background: #1d3d41; }
.dialog-heading span { color: #71d0ca; font: 700 .7rem Consolas, monospace; }
.dialog-heading h2 { margin: .15rem 0 0; }
.dialog-heading button { border: 0; background: transparent; color: #fff; font-size: 1.5rem; cursor: pointer; }
.field-guide > p, .field-guide > .table-shell { margin: 1rem 1.2rem; }
@media (max-width: 1180px) { .metric-grid, .dictionary-summary, .raw-order-source-status { grid-template-columns: repeat(3, minmax(145px, 1fr)); } .overview-grid { grid-template-columns: 1fr; } }
@media (max-width: 760px) { .integrity-rail { grid-template-columns: 1fr; } .rail-copy { text-align: left; } .metric-grid, .dictionary-summary, .raw-order-source-status, .queue-grid, .source-boundaries { grid-template-columns: 1fr; } .table-tools { align-items: flex-start; flex-direction: column; } .table-tools input { min-width: 100%; width: 100%; } }
.order-detail-block { margin-top: 1rem; overflow-x: auto; }
.order-detail-block > strong { display: block; margin-bottom: .5rem; color: var(--ink); }
.order-item-details .muted-note { margin: .75rem 0 0; color: var(--muted); font: 700 .76rem/1.5 Consolas, monospace; }
.order-item-details .fixture-warning { margin: 0 0 .85rem; }
.order-item-details .order-detail-block table { width: max-content; min-width: 640px; max-width: none; }

/* Restored legacy report center layout */
.legacy-report-workspace { padding: 1.15rem 1.4rem 2rem; }
.legacy-report-header { display: grid; gap: .82rem; margin-bottom: .86rem; }
.legacy-brand-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.legacy-brand { display: inline-flex; align-items: center; gap: .7rem; color: var(--ink); text-decoration: none; }
.legacy-brand-mark { width: 34px; height: 34px; display: grid; place-items: center; background: #151515; color: #fff; border-radius: 0; font: 900 .86rem/1 Consolas, monospace; }
.legacy-brand strong { display: block; font-size: 1.08rem; letter-spacing: .01em; }
.legacy-brand small { display: block; margin-top: .12rem; color: var(--muted); font-size: .72rem; }
.management-links { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .42rem; }
.management-links a { padding: .44rem .62rem; color: #1f5352; background: #fff; border: 1px solid var(--line); text-decoration: none; font-size: .76rem; font-weight: 800; }
.management-links a:hover, .management-links a.active { color: #fff; background: #151515; border-color: #151515; }
.legacy-report-summary { display: grid; grid-template-columns: minmax(270px, .72fr) minmax(0, 1.45fr); gap: 1px; overflow: hidden; background: var(--line); border: 1px solid var(--line); box-shadow: var(--shadow); }
.legacy-summary-copy { padding: 1rem 1.05rem; background: #fff; }
.legacy-summary-copy h1 { margin: .16rem 0 .24rem; font-size: 1.56rem; line-height: 1.12; }
.legacy-summary-copy p:last-child { margin: 0; color: var(--muted); font-size: .82rem; line-height: 1.55; }
.legacy-summary-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; background: var(--line); }
.legacy-summary-cards .metric { padding: .9rem .95rem; }
.legacy-summary-cards .metric strong { font-size: clamp(.95rem, 1.28vw, 1.34rem); }
.legacy-report-nav { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 1px; background: var(--line); border: 1px solid var(--line); box-shadow: var(--shadow); }
.legacy-report-nav a { min-width: 0; display: flex; align-items: center; gap: .58rem; padding: .78rem .88rem; color: var(--ink); background: #fff; text-decoration: none; }
.legacy-report-nav a span { flex: 0 0 auto; color: var(--teal); font: 900 .78rem/1 Consolas, monospace; letter-spacing: .04em; }
.legacy-report-nav a strong { display: block; overflow: hidden; font-size: .88rem; text-overflow: ellipsis; white-space: nowrap; }
.legacy-report-nav a:hover { background: #f2f8f7; }
.legacy-report-nav a.active { color: #fff; background: #151515; }
.legacy-report-nav a.active span { color: #5ed8cd; }
.legacy-report-workspace .report-filters { position: static; z-index: auto; min-height: 0; margin-bottom: .88rem; padding: .72rem .82rem; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow); }
.legacy-report-workspace .report-main { padding: 0; }
.legacy-report-workspace .report-view > h2.visually-hidden + .table-tools,
.legacy-report-workspace .report-view > h2.visually-hidden + .integrity-rail,
.legacy-report-workspace .report-view > h2.visually-hidden + .table-tools.data-access-tools { margin-top: 0; }
.legacy-report-workspace .integrity-rail { background: #fff; color: var(--ink); border: 1px solid var(--line); box-shadow: var(--shadow); }
.legacy-report-workspace .rail-track { background: #e8efed; }
.legacy-report-workspace .rail-copy span { color: var(--muted); }
.legacy-report-workspace .panel-card { box-shadow: var(--shadow); }
.legacy-report-workspace .compact-summary { grid-template-columns: repeat(5, minmax(145px, 1fr)); margin: .7rem 0; }
.legacy-report-workspace .table-tools { padding: .78rem .85rem; margin: 0 0 .7rem; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow); }
.legacy-report-workspace .table-shell { box-shadow: var(--shadow); }
@media (max-width: 1100px) {
  .legacy-report-summary { grid-template-columns: 1fr; }
  .legacy-report-nav { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .legacy-summary-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .legacy-report-workspace { padding: .85rem; }
  .legacy-brand-row { align-items: flex-start; flex-direction: column; }
  .management-links { justify-content: flex-start; }
  .legacy-report-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .legacy-summary-cards { grid-template-columns: 1fr; }
}
/* Restored deployed report shell: left sidebar + top filters + content summary. */
.app {
  height: 100vh;
  min-height: 100vh;
  display: grid;
  grid-template-columns: 232px minmax(0, 1fr);
  background: #f4f6f8;
}
.app > main { grid-column: 2; min-width: 0; height: 100vh; overflow: hidden; display: flex; flex-direction: column; }
.app .sidebar {
  position: fixed;
  left: 0;
  top: 0;
  bottom: 0;
  width: 232px;
  height: 100vh;
  overflow-y: auto;
  padding: 22px 16px;
  display: flex;
  flex-direction: column;
  gap: 22px;
  background: #101318;
  color: #fff;
  z-index: 10;
}
.app .brand {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  padding: 0 4px 16px;
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 255, 255, .12);
}
.app .brand-mark {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  background:
    linear-gradient(135deg, transparent 0 35%, #fff 36% 48%, transparent 49%),
    radial-gradient(circle at 66% 32%, #fe2c55 0 12%, transparent 13%),
    radial-gradient(circle at 35% 70%, #00a6a6 0 15%, transparent 16%),
    #1b2027;
  border: 1px solid rgba(255, 255, 255, .12);
}
.app .brand strong,
.app .brand small { display: block; }
.app .brand strong { color: #fff; font-size: 15px; line-height: 1.25; letter-spacing: .02em; }
.app .brand small { margin-top: 6px; color: #96a1ad; font-size: 12px; }
.app .nav { display: grid; gap: 6px; }
.app .nav a {
  width: 100%;
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 10px;
  color: rgba(255, 255, 255, .72);
  background: transparent;
  border: 0;
  border-radius: 8px;
  text-align: left;
  text-decoration: none;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
}
.app .nav a:hover,
.app .nav a.active { color: #fff; background: rgba(255, 255, 255, .11); }
.app .nav-icon {
  color: #00a6a6;
  font-family: Consolas, Menlo, monospace;
  font-size: 13px;
  font-weight: 900;
}
.app .sidebar-note {
  margin-top: auto;
  padding: 14px 10px 0;
  color: rgba(255, 255, 255, .62);
  border-top: 1px solid rgba(255, 255, 255, .12);
  font-size: 12px;
  line-height: 1.7;
}
.top-filter.report-filters {
  position: sticky;
  top: 0;
  z-index: 8;
  min-height: 70px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  overflow-x: auto;
  background: rgba(255, 255, 255, .94);
  border-bottom: 1px solid #dfe5e8;
  box-shadow: none;
  backdrop-filter: blur(10px);
}
.top-filter.report-filters label {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #12161d;
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
}
.top-filter.report-filters input,
.top-filter.report-filters select {
  height: 34px;
  padding: 0 10px;
  color: #12161d;
  background: #fff;
  border: 1px solid #dfe5e8;
  border-radius: 8px;
}
.top-filter.report-filters button {
  height: 34px;
  padding: 0 14px;
  color: #fff;
  background: #101318;
  border: 1px solid #101318;
  border-radius: 8px;
  font-weight: 800;
}
.content.report-main { padding: 22px 24px 46px; flex: 1; min-height: 0; overflow: hidden; display: flex; flex-direction: column; }
.page-head {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 18px;
}
.eyebrow {
  margin: 0 0 8px;
  color: #00a6a6;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .16em;
}
.page-head h1 {
  margin: 0;
  color: #12161d;
  font-size: 30px;
  line-height: 1.16;
  letter-spacing: 0;
}
.page-subtitle {
  max-width: 860px;
  margin: 10px 0 0;
  color: #68727f;
  font-size: 14px;
  line-height: 1.55;
}
.kpi-grid.legacy-summary-cards,
.metric-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(160px, 1fr));
  gap: 14px;
  margin: 0 0 18px;
  background: transparent;
  border: 0;
  border-radius: 0;
  overflow: visible;
}
.metric {
  min-width: 0;
  padding: 18px;
  background: #fff;
  border: 1px solid #dfe5e8;
  border-radius: 8px;
  box-shadow: 0 14px 34px rgba(22, 29, 37, .08);
}
.metric span { color: #68727f; font-size: 12px; font-weight: 800; }
.metric strong { margin-top: 8px; color: #12161d; font-size: 24px; letter-spacing: 0; }
.integrity-rail,
.panel-card,
.table-tools,
.table-shell { border-radius: 8px; box-shadow: 0 14px 34px rgba(22, 29, 37, .08); }
.integrity-rail { margin-bottom: 18px; background: #fff; color: #12161d; border: 1px solid #dfe5e8; }
.rail-track { background: #e5f8f7; }
.rail-copy span { color: #68727f; }
.table-tools { padding: 14px 16px; margin-bottom: 14px; background: #fff; border: 1px solid #dfe5e8; }
.order-profit-toolbar { justify-content: flex-start; align-items: center; }
.order-profit-toolbar .order-share-note { padding: 7px 9px; color: #087f79; background: #e7f4f1; border: 1px solid #cde8e2; border-radius: 4px; font-size: 11px; font-weight: 900; }
.order-profit-toolbar > button { margin-left: auto; }
.order-currency-control { white-space: nowrap; }
.share-basis-control { display: flex; align-items: center; gap: 7px; white-space: nowrap; color: #52616c; font-size: 12px; font-weight: 800; }
.share-basis-control select { height: 34px; padding: 0 28px 0 9px; color: #173d3d; background: #f6fbfa; border: 1px solid #b9d5d1; border-radius: 5px; font-weight: 800; }
.dimension-table-tools { justify-content: flex-start; }
.dimension-table-tools > input { margin-left: auto; }
.dimension-data-table { min-width: 1320px !important; }
.order-profit-table-shell th.order-fulfillment-total,
.order-profit-table-shell td.order-fulfillment-total { background: #cde8e2 !important; }
.order-profit-table-shell th.order-fulfillment-part,
.order-profit-table-shell td.order-fulfillment-part { background: #e7f4f1 !important; }
.order-profit-table-shell th.order-platform-total,
.order-profit-table-shell td.order-platform-total { background: #f4d8a8 !important; }
.order-profit-table-shell th.order-platform-part,
.order-profit-table-shell td.order-platform-part { background: #fff3df !important; }
.order-profit-table-shell th.order-fulfillment-total,
.order-profit-table-shell th.order-platform-total,
.order-profit-table-shell td.order-fulfillment-total .cell-truncate,
.order-profit-table-shell td.order-platform-total .cell-truncate { color: #12161d; font-weight: 900; }
.report-metric-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 12px;
  margin-bottom: 12px;
}
.report-metric-card {
  position: relative;
  min-width: 0;
  min-height: 138px;
  padding: 15px 16px;
  overflow: hidden;
  background: #fff;
  border: 1px solid #dfe5e8;
  border-top: 3px solid #00a6a6;
  border-radius: 8px;
  box-shadow: 0 10px 24px rgba(22, 29, 37, .06);
}
.report-metric-card[data-status="partial"] { border-top-color: #b77818; }
.report-metric-card[data-status="missing"],
.report-metric-card[data-status="unavailable"] { border-top-color: #c54b55; }
.report-metric-card-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.report-metric-card-header > span { min-width: 0; color: #68727f; font-size: 12px; font-weight: 800; }
.metric-tooltip {
  flex: 0 0 auto;
  width: 19px;
  height: 19px;
  display: grid;
  place-items: center;
  color: #52616c;
  background: #f2f6f6;
  border: 1px solid #cfdadb;
  border-radius: 50%;
  font: 800 11px/1 Consolas, monospace;
  cursor: help;
}
.metric-tooltip:focus-visible { outline: 2px solid #00a6a6; outline-offset: 2px; }
.report-metric-card > strong {
  display: block;
  margin-top: 10px;
  overflow-wrap: anywhere;
  color: #12161d;
  font: 800 25px/1.15 Consolas, Menlo, monospace;
  letter-spacing: 0;
}
.report-metric-card > strong[data-tone="negative"] { color: #b2333f; }
.report-metric-card > small { display: block; margin-top: 8px; color: #68727f; font-size: 12px; line-height: 1.45; }
.metric-status-badge {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  margin-top: 10px;
  padding: 2px 7px;
  color: #765012;
  background: #fff5df;
  border: 1px solid #edd6a8;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 800;
}
.metric-status-badge[data-status="missing"],
.metric-status-badge[data-status="unavailable"] { color: #9b303b; background: #fff0f1; border-color: #efc9cd; }
.report-metric-empty { grid-column: 1 / -1; margin: 0; padding: 18px; color: #68727f; background: #fff; border: 1px solid #dfe5e8; border-radius: 8px; }
.data-quality-status-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 1px;
  margin-bottom: 12px;
  overflow: hidden;
  background: #dfe5e8;
  border: 1px solid #dfe5e8;
  border-radius: 8px;
}
.top-filter.report-filters input { width: 132px; min-width: 132px; }
.top-filter.report-filters select { width: 112px; min-width: 112px; }
.top-filter.report-filters #recent-days { width: 72px; min-width: 72px; }
.top-filter.report-filters #shop-filter { width: 132px; }
.data-quality-status-item { flex: 1 1 145px; min-width: 0; padding: 8px 10px; background: #f7faf9; }
.data-quality-status-item small { display: block; overflow: hidden; color: #68727f; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.data-quality-status-item strong { display: block; margin-top: 3px; overflow-wrap: anywhere; color: #263039; font: 800 12px/1.25 Consolas, Menlo, monospace; letter-spacing: 0; }
.data-quality-status-item[data-tone="warn"] strong { color: #9b303b; }
th { background: #edf4f3; color: #12161d; }
@media (max-width: 980px) {
  :root { --report-table-sticky-left: 24px; }
  .app { grid-template-columns: 1fr; }
  .app > main { grid-column: auto; }
  .app .sidebar { position: static; width: auto; height: auto; }
  .app .nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kpi-grid.legacy-summary-cards,
  .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  :root { --report-table-sticky-left: 16px; }
  .content.report-main { padding: 16px; }
  .app .nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kpi-grid.legacy-summary-cards,
  .metric-grid { grid-template-columns: 1fr; }
}

.page-workspace { height: 100vh; overflow: hidden; }
.report-view { min-height: 0; }
.report-view:not([hidden]) { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.table-shell.freeze-table { flex: 0 0 auto; min-height: 280px; max-height: 520px; overflow: auto; }
.report-view:not([hidden]) { overflow-x: hidden; overflow-y: auto; padding-bottom: 18px; }
.table-shell.freeze-table.order-profit-table-shell { min-height: 280px; }
.order-profit-real-summary { display: none; }

.unified-quality-status { flex: 0 0 auto; }
.overview-metric-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}
.overview-metric-grid .report-metric-card { min-height: 132px; }
.report-band-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px; }
.report-band { min-width: 0; margin-bottom: 18px; padding-top: 14px; border-top: 2px solid #cddbd8; }
.report-band .panel-heading { margin-bottom: 10px; }
.report-band .panel-heading h3 { margin: 0; font-size: 16px; }
.country-performance { display: grid; gap: 8px; }
.country-performance-row {
  position: relative;
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  gap: 10px;
  min-height: 50px;
  padding: 9px 10px 16px;
  overflow: hidden;
  text-align: left;
  color: #17252a;
  background: #fff;
  border: 1px solid #dfe5e8;
  cursor: pointer;
}
.country-performance-row strong { font: 900 13px/1.4 Consolas, Menlo, monospace; }
.country-performance-row > span { overflow: hidden; color: #52616c; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.country-performance-row i { position: absolute; left: 0; bottom: 0; width: var(--bar-width); height: 5px; background: #168b84; }
.compact-stat-strip { display: flex; flex-wrap: wrap; gap: 1px; margin-bottom: 12px; overflow: hidden; background: #dfe5e8; border: 1px solid #dfe5e8; }
.product-tools { justify-content: flex-start; }
.product-tools label, .time-tools label { display: flex; align-items: center; gap: 6px; color: #52616c; font-size: 12px; font-weight: 800; }
.product-tools select, .time-tools select { height: 34px; padding: 0 9px; background: #fff; border: 1px solid #cfd8dc; }
.product-tools #product-search { margin-left: auto; }
.product-expand-button, .dimension-expand-button { width: auto; min-width: 24px; padding: 0 6px; white-space: nowrap; }
.product-sku-row td { background: #f7faf9; }
.product-sku-row td:first-child { padding-left: 22px; background: #f7faf9; }
.shop-detail-row td, .country-detail-row td { position: static !important; max-width: none !important; padding: 14px 18px; color: #3e5559; background: #f3f8f7 !important; box-shadow: none !important; white-space: normal; }
.table-link { padding: 0; color: #106f69; background: transparent; border: 0; font-weight: 800; cursor: pointer; }
.table-link:hover { text-decoration: underline; }
.table-shell td:has(.money), .table-shell td:has(.number), .table-shell td:has(.ratio) { text-align: right; }
.cell-truncate.number, .cell-truncate.ratio { color: #263039; font-family: Consolas, Menlo, monospace; text-align: right; }
.report-empty-state { margin: 0; padding: 22px; color: #68727f; text-align: center; background: #fff; border: 1px dashed #cfd8dc; }
.time-tools { justify-content: space-between; }
.segmented-control { display: inline-flex !important; gap: 1px !important; padding: 2px; background: #e7eeec; }
.segmented-control button { min-height: 30px; padding: 0 10px; color: #31484b; background: #fff; border: 0; cursor: pointer; font-size: 12px; font-weight: 800; }
.segmented-control button:hover, .segmented-control button:focus-visible { color: #fff; background: #168b84; }
.trend-chart {
  display: flex;
  align-items: end;
  gap: 5px;
  width: 100%;
  height: 220px;
  margin-bottom: 14px;
  padding: 18px 14px 34px;
  overflow-x: auto;
  background: #fff;
  border: 1px solid #dfe5e8;
}
.trend-chart > span { position: relative; flex: 1 0 18px; min-width: 18px; max-width: 52px; height: var(--trend-height); min-height: 4px; background: #168b84; }
.trend-chart > span.is-negative { background: #b33a3a; }
.trend-chart > span.is-missing { min-height: 0; border-top: 2px dashed #9ca8ad; background: transparent; }
.trend-chart > span small { position: absolute; left: 50%; bottom: -24px; width: 72px; overflow: hidden; color: #68727f; font-size: 9px; text-align: center; text-overflow: ellipsis; white-space: nowrap; transform: translateX(-50%); }
.dimension-order-link { margin-left: 14px; }
.trend-chart > .report-empty-state { flex: 1 0 100%; max-width: none; height: auto; }

#overview-metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.overview-section { min-width: 0; margin-bottom: 18px; padding: 16px 18px; background: #fff; border: 1px solid #dfe5e8; border-radius: 8px; box-shadow: 0 10px 24px rgba(22, 29, 37, .06); }
.overview-section-heading { margin-bottom: 12px; }
.overview-section-heading > span, .overview-section-heading > div > span { color: #087f79; font: 900 10px/1 Consolas, Menlo, monospace; }
.overview-section-heading h3 { margin: 5px 0 0; color: #12161d; font-size: 17px; }
.overview-leader-heading, .overview-pending-heading { display: flex; align-items: end; justify-content: space-between; gap: 12px; }
.overview-leader-heading small { padding: 4px 7px; color: #765012; background: #fff5df; border: 1px solid #edd6a8; border-radius: 4px; font-size: 10px; font-weight: 800; }
.overview-leader-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.overview-leader-groups h4 { margin: 0 0 7px; font-size: 13px; }
.overview-leader-items { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; overflow: hidden; background: #dfe5e8; border: 1px solid #dfe5e8; border-radius: 6px; }
.overview-leader-items article { min-width: 0; padding: 13px 14px; background: #f8fbfa; }
.overview-leader-items small { color: #68727f; font-size: 10px; }
.overview-leader-items strong, .overview-leader-items em { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.overview-leader-items strong { margin-top: 8px; font-size: 17px; }
.overview-leader-items em { margin-top: 6px; color: #087f79; font: normal 900 13px/1.3 Consolas, Menlo, monospace; }
.overview-leader-items p { margin: 7px 0 0; overflow: hidden; color: #68727f; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.overview-pending-heading a { color: #087f79; font-size: 11px; font-weight: 900; text-decoration: none; }
.overview-pending-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; background: #dfe5e8; }
.overview-pending-actions article { min-width: 0; padding: 14px 15px; background: #f8fbfa; }
.overview-pending-actions span { color: #68727f; font-size: 11px; }
.overview-pending-actions strong { display: block; margin-top: 12px; font: 900 18px/1 Consolas, Menlo, monospace; }
.overview-pending-actions p { margin: 10px 0 0; color: #68727f; font-size: 10px; line-height: 1.5; }
.overview-structure-bar { display: block; width: 150px; max-width: 100%; height: 6px; overflow: hidden; background: #e3eceb; border-radius: 3px; }
.overview-structure-bar i { display: block; width: var(--structure-width); height: 100%; background: #087f79; }

.sort-button { display: inline-flex; align-items: center; gap: 5px; padding: 3px 5px; color: inherit; background: transparent; border: 0; border-radius: 4px; font-size: inherit; font-weight: inherit; cursor: pointer; }
.sort-button span { min-width: 14px; color: #65757c; font-family: Consolas, Menlo, monospace; }
.sort-button.active { color: #fff; background: #087f79; }
.sort-button.active span { color: #fff; }
.sort-button:disabled { color: #8f999e; background: #e2e7e8; cursor: not-allowed; }

.dimension-trend { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) 310px; gap: 16px; margin-bottom: 14px; padding: 16px; background: #fff; border: 1px solid #dfe5e8; border-radius: 8px; box-shadow: 0 10px 24px rgba(22, 29, 37, .06); }
.dimension-trend-main { min-width: 0; }
.dimension-trend-heading { display: flex; align-items: end; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.dimension-trend-heading > div:first-child > span { color: #087f79; font: 900 10px/1 Consolas, Menlo, monospace; }
.dimension-trend-heading h3 { margin: 5px 0 0; font-size: 17px; }
.dimension-trend-metric button.active { color: #fff; background: #087f79; }
.dimension-trend-chart { min-height: 282px; padding: 10px; overflow-x: auto; background: #fbfcfc; border: 1px solid #e1e7e8; border-radius: 6px; }
.dimension-trend-chart svg { display: block; width: 100%; min-width: 680px; height: 238px; }
.dimension-trend-legend { min-width: 680px; display: flex; flex-wrap: wrap; gap: 12px; margin: 0 0 6px; }
.dimension-trend-legend span { display: inline-flex; align-items: center; gap: 5px; min-width: 0; color: #52616c; font-size: 10px; }
.dimension-trend-legend b { max-width: 150px; overflow: hidden; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.dimension-trend-legend i, .dimension-trend-option i { flex: 0 0 auto; width: 8px; height: 8px; background: var(--trend-color); border-radius: 50%; }
.trend-grid-line { stroke: #e3e8ea; stroke-width: 1; }
.trend-axis-label { fill: #68727f; font: 10px Consolas, Menlo, monospace; }
.dimension-trend-selector { min-width: 0; padding: 13px; background: #f8fbfa; border: 1px solid #dfe5e8; border-radius: 6px; }
.dimension-selector-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
.dimension-selector-heading strong { font-size: 13px; }
.dimension-selector-heading span { color: #68727f; font-size: 10px; }
.dimension-trend-selector > input { width: 100%; height: 34px; padding: 0 10px; background: #fff; border: 1px solid #cfd8dc; border-radius: 5px; }
.dimension-trend-options { max-height: 178px; margin: 10px 0; overflow-y: auto; }
.dimension-trend-option { min-width: 0; display: grid; grid-template-columns: 18px minmax(0, 1fr) 10px; align-items: center; gap: 7px; min-height: 34px; color: #263039; font-size: 11px; font-weight: 800; cursor: pointer; }
.dimension-trend-option input { width: 16px; height: 16px; margin: 0; accent-color: #087f79; }
.dimension-trend-option span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dimension-trend-option:has(input:disabled) { color: #90999e; cursor: not-allowed; }
.trend-apply-button { width: 100%; min-height: 34px; color: #fff; background: #12161d; border: 0; border-radius: 5px; font-size: 11px; font-weight: 800; cursor: pointer; }
.product-country-row td { background: #f7faf9; }
.product-country-row td:first-child { padding-left: 22px; background: #f7faf9; }

@media (max-width: 1180px) {
  .overview-metric-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .report-band-grid { grid-template-columns: 1fr; }
  .dimension-trend { grid-template-columns: minmax(0, 1fr) 260px; }
}
@media (max-width: 980px) {
  html, body { height: auto; overflow: auto; }
  .app { display: block; height: auto; min-height: 100vh; }
  .app > main, .page-workspace { height: auto; min-height: 100vh; overflow: visible; }
  .content.report-main { overflow: visible; }
  .report-view:not([hidden]) { overflow: visible; }
  .top-filter.report-filters { top: 0; }
  .overview-metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #overview-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .overview-leader-groups, .dimension-trend { grid-template-columns: 1fr; }
  .dimension-trend-options { max-height: 210px; }
}
@media (max-width: 620px) {
  .overview-metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .overview-metric-grid .report-metric-card { min-height: 150px; padding: 12px; }
  .overview-metric-grid .report-metric-card > strong { font-size: 20px; }
  .data-quality-status-item { flex-basis: calc(50% - 1px); }
  .report-metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .report-metric-card { min-height: 145px; padding: 12px; }
  .report-metric-card > strong { font-size: 18px; }
  .overview-leader-items, .overview-pending-actions { grid-template-columns: 1fr; }
  .overview-leader-heading, .overview-pending-heading, .dimension-trend-heading { align-items: flex-start; flex-direction: column; }
  .dimension-trend { padding: 12px; }
  .dimension-trend-metric { width: 100%; }
  .dimension-trend-metric button { flex: 1; }
  .report-band-grid { gap: 0; }
  .time-tools, .product-tools { align-items: stretch; }
  .dimension-table-tools { align-items: stretch; }
  .dimension-table-tools > input { margin-left: 0; }
  .share-basis-control { justify-content: space-between; }
  .product-tools #product-search { margin-left: 0; }
  .segmented-control { width: 100%; overflow-x: auto; }
  .segmented-control button { flex: 1 0 auto; }
  .trend-chart { height: 190px; }
}