.dos-dashboard-shell {
  --dos-ink: #081d3d;
  --dos-blue: #2563eb;
  --dos-cyan: #4bbcf3;
  --dos-muted: #7d8eaa;
  --dos-line: #e2e9f2;
  --dos-page: #f2f6fb;
  --dos-card: #ffffff;
  --dos-green: #10a875;
  --dos-amber: #f59e0b;
  --dos-red: #ef5b5b;
  --dos-shadow: 0 18px 48px rgba(15, 42, 79, .08);
  min-height: calc(100vh - 210px);
  overflow: hidden;
  border: 1px solid var(--dos-line);
  border-radius: 11px;
  background: var(--dos-card);
  color: var(--dos-ink);
  font-family: "Aptos Display", "Microsoft YaHei UI", "PingFang SC", sans-serif;
}

#appView:has(#dosView:not(.hidden)) > .control-strip {
  display: none;
}

.dos-dashboard-shell *,
.dos-dashboard-shell *::before,
.dos-dashboard-shell *::after {
  box-sizing: border-box;
}

.dos-dashboard-shell button,
.dos-dashboard-shell input {
  font: inherit;
}

.dos-dashboard-header {
  min-height: 112px;
  padding: 22px 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  border-bottom: 1px solid var(--dos-line);
  background: #fff;
}

.dos-dashboard-header h2,
.dos-dashboard-header p {
  margin: 0;
}

.dos-dashboard-header h2 {
  margin-top: 7px;
  font-size: 27px;
  line-height: 1.1;
  letter-spacing: -.03em;
}

.dos-dashboard-header p {
  margin-top: 6px;
  color: var(--dos-muted);
  font-size: 15px;
  line-height: 1.45;
}

.dos-eyebrow {
  color: #7789a7;
  font-size: 11px;
  font-weight: 1000;
  letter-spacing: .04em;
}

.dos-data-stamp {
  flex: 0 0 auto;
  display: grid;
  gap: 4px;
  max-width: 260px;
  padding: 11px 15px;
  overflow: hidden;
  border: 1px solid #dbe8e3;
  border-radius: 9px;
  background: #f3fbf8;
  text-align: right;
}

.dos-data-stamp strong {
  color: #087f5b;
  font-size: 13px;
}

.dos-data-stamp span {
  overflow: hidden;
  color: #6f829b;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dos-refresh-button {
  cursor: pointer;
}

.dos-refresh-button:disabled {
  cursor: progress;
  opacity: .62;
}

.dos-dashboard-main {
  display: grid;
  gap: 0;
  padding: 19px 23px 24px;
  background: var(--dos-page);
}

.dos-refresh-message {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
  padding: 11px 14px;
  border: 1px solid var(--dos-line);
  border-radius: 8px;
  background: #fff;
  color: var(--dos-muted);
}

.dos-refresh-message strong { color: var(--dos-ink); }
.dos-refresh-message div { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px 14px; font-size: 12px; }
.dos-refresh-message.success { border-color: rgba(16, 168, 117, .35); background: rgba(16, 168, 117, .08); }
.dos-refresh-message.error { border-color: rgba(239, 91, 91, .35); background: rgba(239, 91, 91, .08); }
.dos-refresh-message.info { border-color: rgba(37, 99, 235, .28); background: rgba(37, 99, 235, .07); }

.dos-command {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.dos-scope-tabs,
.dos-view-tabs {
  display: flex;
  padding: 3px;
  border: 1px solid var(--dos-line);
  border-radius: 8px;
  background: #fff;
}

.dos-scope-tabs button,
.dos-view-tabs button {
  min-width: 112px;
  padding: 9px 14px;
  border: 0;
  border-radius: 6px;
  color: var(--dos-muted);
  background: transparent;
  font-weight: 1000;
  cursor: pointer;
}

.dos-scope-tabs button.active,
.dos-view-tabs button.active {
  color: #fff;
  background: var(--dos-ink);
}

.dos-crumb-bar {
  min-height: 58px;
  display: flex;
  align-items: center;
  gap: 14px;
}

.dos-back-button {
  padding: 7px 11px;
  border: 1px solid var(--dos-line);
  border-radius: 6px;
  color: var(--dos-ink);
  background: #fff;
  font-weight: 900;
  cursor: pointer;
}

.dos-back-button:disabled {
  color: #99a6b8;
  background: rgba(255, 255, 255, .75);
  cursor: default;
}

.dos-crumbs {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  overflow: auto;
  color: #a5b0c1;
  font-size: 14px;
  font-weight: 900;
  white-space: nowrap;
}

.dos-crumbs button {
  padding: 0;
  border: 0;
  color: var(--dos-ink);
  background: transparent;
  font-weight: 900;
  cursor: pointer;
}

.dos-crumbs button.active { color: #667a98; }

.dos-analysis-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 365px;
  gap: 16px;
  align-items: start;
}

.dos-panel {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--dos-line);
  border-radius: 9px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(15, 35, 66, .045);
}

.dos-detail-panel {
  padding: 21px 20px 20px;
}

.dos-detail-title span {
  color: var(--dos-muted);
  font-size: 12px;
  font-weight: 900;
}

.dos-detail-title h2 {
  margin: 5px 0;
  font-size: 22px;
}

.dos-detail-title p {
  margin: 0 0 17px;
  color: var(--dos-muted);
  font-size: 14px;
}

.dos-trend-card {
  overflow: hidden;
  border: 1px solid var(--dos-line);
  border-radius: 9px;
  background: linear-gradient(180deg, #fff, #fcfdff);
}

.dos-trend-head {
  padding: 17px 19px 8px;
  display: flex;
  justify-content: space-between;
  gap: 20px;
}

.dos-trend-head h3 { margin: 0 0 4px; font-size: 17px; }
.dos-trend-head > div > span { color: var(--dos-muted); font-size: 12px; }

.dos-coverage {
  align-self: flex-start;
  padding: 6px 9px;
  border-radius: 14px;
  background: #f1f5fa;
  color: #677a97;
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
}

.dos-coverage.warn { color: #9a5a06; background: #fff6df; }

.dos-scenario-controls {
  margin: 5px 19px 9px;
  padding: 12px 13px;
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr) 230px;
  align-items: center;
  gap: 13px;
  border: 1px solid #dce6f2;
  border-radius: 9px;
  background: linear-gradient(120deg, #f6faff, #fff);
}

.dos-scenario-label small,
.dos-scenario-output small {
  display: block;
  color: var(--dos-muted);
  font-size: 10px;
  font-weight: 900;
}

.dos-scenario-label strong,
.dos-scenario-output strong {
  display: block;
  margin-top: 3px;
  font-size: 13px;
}

.dos-scenario-action-wrap { min-width: 0; }

.dos-scenario-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.dos-scenario-actions > button,
.dos-scenario-custom button {
  padding: 7px 9px;
  border: 1px solid #dbe3ee;
  border-radius: 7px;
  color: #526581;
  background: #fff;
  font-size: 12px;
  font-weight: 1000;
  cursor: pointer;
}

.dos-scenario-actions > button.active {
  border-color: var(--dos-ink);
  color: #fff;
  background: var(--dos-ink);
  box-shadow: 0 6px 14px rgba(7, 27, 58, .15);
}

.dos-scenario-custom {
  display: flex;
  overflow: hidden;
  border: 1px solid #dbe3ee;
  border-radius: 7px;
  background: #fff;
}

.dos-scenario-custom input {
  width: 48px;
  padding: 7px 2px 7px 7px;
  border: 0;
  outline: 0;
  color: var(--dos-ink);
  background: #fff;
  font-size: 12px;
  font-weight: 1000;
}

.dos-scenario-custom > span { padding: 7px 3px; color: var(--dos-muted); font-size: 11px; }
.dos-scenario-custom button { border-width: 0 0 0 1px; border-radius: 0; }

.dos-scenario-output {
  min-width: 0;
  padding-left: 13px;
  border-left: 1px solid #dce5f0;
}

.dos-scenario-output strong { color: #c45d13; }

.dos-scenario-months {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(108px, 1fr));
  gap: 6px;
  margin-top: 9px;
}

.dos-scenario-months[hidden] { display: none; }

.dos-scenario-months label {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 5px;
  padding: 5px 7px;
  border: 1px solid #e0e7f0;
  border-radius: 7px;
  color: #667a98;
  background: #fff;
  font-size: 10px;
  font-weight: 900;
}

.dos-scenario-months label.missing { opacity: .55; }

.dos-scenario-month-ratio {
  display: inline-flex;
  align-items: center;
  overflow: hidden;
  border: 1px solid #d8e1ed;
  border-radius: 6px;
  background: #f8fafc;
}

.dos-scenario-months input {
  width: 44px;
  padding: 4px 5px;
  border: 0;
  outline: 0;
  color: var(--dos-ink);
  background: transparent;
  font-size: 11px;
  font-weight: 900;
  text-align: right;
}

.dos-scenario-month-ratio b {
  padding-right: 6px;
  color: #7c8da7;
  font-size: 10px;
}

.dos-chart-legend {
  padding: 3px 19px 0;
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
}

.dos-chart-legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 8px;
  border-radius: 14px;
  background: #f5f8fc;
  color: #657691;
  font-size: 10px;
  font-weight: 900;
}

.dos-chart-legend i { width: 9px; height: 9px; border-radius: 3px; background: #6b87b4; }
.dos-chart-legend .actual i { background: var(--dos-green); }
.dos-chart-legend .current i { background: var(--dos-amber); }
.dos-chart-legend .adjust i { background: var(--dos-ink); }
.dos-chart-legend .dos i { width: 15px; height: 3px; background: var(--dos-blue); }
.dos-chart-legend .sales i { width: 15px; height: 3px; background: #94a3b8; }

.dos-chart-wrap {
  overflow-x: auto;
  padding: 4px 15px 2px;
}

.dos-chart {
  display: block;
  width: 100%;
  min-width: 820px;
  height: 450px;
}

.dos-chart-gridline { stroke: #edf1f6; stroke-width: 1; }
.dos-chart-standard { stroke: #bed0e7; stroke-width: 2; stroke-dasharray: 8 8; }
.dos-chart-separator { stroke: #dfe7f1; }
.dos-scenario-line { fill: none; stroke: var(--dos-blue); stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; }
.dos-sales-line { fill: none; stroke: #94a3b8; stroke-width: 2.5; stroke-dasharray: 7 6; }
.dos-chart-dot { fill: var(--dos-amber); stroke: #fff; stroke-width: 4; }
.dos-chart-dot.good { fill: var(--dos-green); }
.dos-chart-dot.low { fill: var(--dos-blue); }
.dos-chart-dot.severe { fill: var(--dos-red); }
.dos-chart-sales-dot { fill: #fff; stroke: #94a3b8; stroke-width: 2.5; }
.dos-line-end-label line { stroke-width: 1.5; }
.dos-line-end-label rect { stroke-width: 1; }
.dos-line-end-label text { font-size: 10px; font-weight: 1000; }
.dos-line-end-label.adjusted line,
.dos-line-end-label.adjusted rect { stroke: #8ab7ff; }
.dos-line-end-label.adjusted rect { fill: #eaf3ff; }
.dos-line-end-label.adjusted text { fill: #1765d8; }
.dos-line-end-label.sales line,
.dos-line-end-label.sales rect { stroke: #cbd5e1; }
.dos-line-end-label.sales rect { fill: #f8fafc; }
.dos-line-end-label.sales text { fill: #66758d; }
.dos-chart-point-label { fill: #63748e; font-size: 12px; font-weight: 900; text-anchor: middle; paint-order: stroke; stroke: #fff; stroke-width: 3px; }
.dos-chart-month-label { fill: #8996aa; font-size: 12px; text-anchor: middle; }
.dos-chart-section-label { fill: #405270; font-size: 12px; font-weight: 1000; }
.dos-chart-axis-note { fill: #91a0b5; font-size: 10px; }
.dos-bar-actual { fill: var(--dos-green); }
.dos-bar-current { fill: var(--dos-amber); }
.dos-bar-sales { fill: #9aabc2; }
.dos-bar-adjust { fill: var(--dos-ink); }
.dos-chart-bar-label { fill: #63748e; font-size: 9px; font-weight: 900; text-anchor: middle; }

.dos-matrix-card {
  margin-top: 16px;
  overflow: hidden;
  border: 1px solid var(--dos-line);
  border-radius: 9px;
  background: #fff;
}

.dos-matrix-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 13px 17px 10px;
}

.dos-matrix-head h3 { margin: 0; font-size: 15px; }
.dos-matrix-head > div:first-child > span { display: block; margin-top: 3px; color: var(--dos-muted); font-size: 10px; }

.dos-matrix-key { display: flex; align-items: center; gap: 14px; color: #6f8099; font-size: 11px; font-weight: 900; }
.dos-matrix-key span { display: inline-flex; align-items: center; gap: 6px; }
.dos-matrix-key i { width: 8px; height: 8px; border-radius: 50%; background: var(--dos-blue); }
.dos-matrix-key .sales i { background: #9aa9bd; }

.dos-matrix-scroll { overflow: auto; }

.dos-matrix-card table {
  width: 100%;
  min-width: 1000px;
  border-collapse: collapse;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

.dos-matrix-card th,
.dos-matrix-card td {
  padding: 12px 10px;
  border-top: 1px solid var(--dos-line);
  text-align: center;
  white-space: nowrap;
}

.dos-matrix-card thead th { color: #7487a5; background: #f0f5fb; }
.dos-matrix-card thead th strong { display: block; color: #536681; font-size: 11px; }
.dos-matrix-card thead th small { display: inline-block; margin-top: 4px; color: #8797ad; font-size: 9px; }
.dos-matrix-card thead th small.actual { color: #087f5b; }
.dos-matrix-card thead th small.current { color: #b76406; }

.dos-matrix-card th:first-child,
.dos-matrix-card td:first-child {
  position: sticky;
  left: 0;
  z-index: 2;
  width: 128px;
  text-align: left;
  color: var(--dos-ink);
  background: #f5f8fb;
  font-weight: 1000;
}

.dos-matrix-actual-cell { background: #f1fbf7; }
.dos-matrix-scenario-value { display: block; color: var(--dos-blue); font-weight: 1000; }
.dos-matrix-sales-value { display: flex; align-items: center; justify-content: center; gap: 5px; margin-top: 4px; color: #8797ad; font-size: 10px; }
.dos-matrix-sales-value::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: #9aa9bd; }

.dos-matrix-dos {
  display: inline-block;
  min-width: 44px;
  padding: 5px 8px;
  border-radius: 8px;
  color: #b85b0c;
  background: #fff3df;
  font-weight: 1000;
}

.dos-matrix-dos.good { color: #087d5b; background: #e7f8f1; }
.dos-matrix-dos.low { color: #1d4ed8; background: #eef5ff; }
.dos-matrix-dos.severe { color: #a33f3f; background: #feeeee; }

.dos-method-note {
  margin-top: 15px;
  padding: 12px 14px;
  border: 1px solid var(--dos-line);
  border-radius: 8px;
  background: #f8fafc;
  color: #71829d;
  font-size: 11px;
  line-height: 1.65;
}

.dos-method-note b { color: var(--dos-ink); }

.dos-list-panel { overflow: hidden; }

.dos-next-head {
  padding: 24px 19px 20px;
  background: #eef6ff;
}

.dos-next-head span { color: #7f91ae; font-size: 12px; font-weight: 900; }
.dos-next-head h2 { margin: 7px 0 4px; font-size: 20px; }
.dos-next-head p { margin: 0; color: #8798b2; font-size: 14px; }

.dos-next-list {
  max-height: 720px;
  overflow: auto;
}

.dos-next-card {
  width: 100%;
  min-height: 58px;
  padding: 12px 16px 12px 19px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border: 0;
  border-top: 1px solid var(--dos-line);
  border-left: 3px solid transparent;
  background: #fff;
  color: var(--dos-ink);
  text-align: left;
  cursor: pointer;
}

.dos-next-card:hover { border-left-color: var(--dos-blue); background: #f7faff; }
.dos-next-card strong {
  min-width: 0;
  overflow: hidden;
  color: #102a4f;
  font-size: 14px;
  font-weight: 900;
  line-height: 1.35;
  text-overflow: ellipsis;
}
.dos-next-card b { color: var(--dos-blue); font-size: 20px; font-weight: 600; }

.dos-empty,
.dos-loading {
  min-height: 260px;
  padding: 42px 22px;
  display: grid;
  place-items: center;
  color: var(--dos-muted);
  text-align: center;
}

.dos-empty strong { color: var(--dos-ink); font-size: 18px; }
.dos-empty span { margin-top: 8px; }

@media (max-width: 1300px) {
  .dos-analysis-grid { grid-template-columns: minmax(0, 1fr) 320px; }
  .dos-scenario-controls { grid-template-columns: 135px minmax(0, 1fr) 190px; }
}

@media (max-width: 1120px) {
  .dos-analysis-grid { grid-template-columns: 1fr; }
  .dos-next-list { max-height: none; }
}

@media (max-width: 820px) {
  .dos-dashboard-header,
  .dos-command,
  .dos-trend-head,
  .dos-matrix-head { align-items: stretch; flex-direction: column; }
  .dos-dashboard-main,
  .dos-dashboard-header { padding-left: 14px; padding-right: 14px; }
  .dos-scope-tabs,
  .dos-view-tabs { width: 100%; }
  .dos-scope-tabs button,
  .dos-view-tabs button { flex: 1; min-width: 0; }
  .dos-scenario-controls { grid-template-columns: 1fr; }
  .dos-scenario-output { padding: 10px 0 0; border-top: 1px solid #dce5f0; border-left: 0; }
}