/* Scoped Material 3 surfaces for the restored dialog analysis and reports UI. */
body[data-karma-view="dialogs"] #root [data-karma-analysis] {
  --ka-canvas: #f4f7f8;
  --ka-surface: #fff;
  --ka-raised: #edf3f3;
  --ka-hover: #e6efef;
  --ka-line: #dfe8e8;
  --ka-ink: #21313b;
  --ka-muted: #637985;
  --ka-accent: #487b89;
  background: var(--ka-canvas) !important;
  color: var(--ka-ink);
}
html.dark body[data-karma-view="dialogs"] #root [data-karma-analysis] {
  --ka-canvas: #111b29;
  --ka-surface: #1d2b3a;
  --ka-raised: #263747;
  --ka-hover: #2c4050;
  --ka-line: #324453;
  --ka-ink: #edf4f8;
  --ka-muted: #b3c4d0;
  --ka-accent: #94b9c4;
}
body[data-karma-view="dialogs"] #root [data-karma-analysis-part="header"] {
  flex-shrink: 0;
  padding: 15px 20px !important;
  border-color: var(--ka-line) !important;
  background: var(--ka-surface) !important;
}
body[data-karma-view="dialogs"] #root [data-karma-analysis-part="header"] h2 {
  color: var(--ka-ink) !important;
  font-size: 18px;
  font-weight: 650;
  letter-spacing: -.015em;
}
body[data-karma-view="dialogs"] #root [data-karma-analysis-part="header"] button {
  min-height: 38px;
  padding-inline: 14px;
  border: 1px solid var(--ka-line) !important;
  border-radius: 12px;
  background: var(--ka-raised) !important;
  color: var(--ka-ink) !important;
  box-shadow: none !important;
}
body[data-karma-view="dialogs"] #root [data-karma-analysis-part="header"] button:hover {
  background: var(--ka-hover) !important;
}
/* Preserve the uploaded v7 player composition: play on the left, wave on top, time below. */
body[data-karma-view="dialogs"] #root [data-karma-analysis-part="player"] {
  flex-shrink: 0;
  border-color: var(--ka-line) !important;
  background: var(--ka-canvas) !important;
}
body[data-karma-view="dialogs"] #root [data-karma-analysis-part="player"] > div {
  padding: 11px 20px !important;
  background: transparent !important;
}
body[data-karma-view="dialogs"] #root [data-karma-analysis-part="player"] > div > div[class~="items-center"] {
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) !important;
  grid-template-rows: 30px 16px !important;
  align-items: center;
  column-gap: 14px !important;
  min-height: 54px !important;
  padding: 2px 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body[data-karma-view="dialogs"] #root [data-karma-analysis-part="player"] > div > div[class~="items-center"] > button {
  grid-column: 1;
  grid-row: 1 / 3;
  width: 42px;
  min-width: 42px;
  height: 42px;
  padding: 0;
  border-radius: 12px;
  background: #3e7894 !important;
  color: #fff !important;
  box-shadow: none !important;
}
body[data-karma-view="dialogs"] #root [data-karma-analysis-part="player"] > div > div[class~="items-center"] > button:hover { background: #326781 !important; }
body[data-karma-view="dialogs"] #root [data-karma-analysis-part="player"] > div > div[class~="items-center"] > .font-mono {
  grid-column: 2;
  grid-row: 2;
  align-self: end;
  color: var(--ka-muted) !important;
  font-size: 12px;
  line-height: 15px;
  font-variant-numeric: tabular-nums;
}
body[data-karma-view="dialogs"] #root [data-karma-analysis-part="player"] > div > div[class~="items-center"] > div[class~="relative"] {
  grid-column: 2;
  grid-row: 1;
  width: 100%;
  min-width: 0;
  height: 30px;
  min-height: 30px;
  background: transparent;
}
body[data-karma-view="dialogs"] #root [data-karma-analysis-part="player"] [role="application"] {
  width: 100%;
  height: 30px;
  background: transparent !important;
}
body[data-karma-view="dialogs"] #root [data-karma-analysis-part="body"] {
  min-height: 0;
  padding: 18px 20px 26px !important;
  background: var(--ka-canvas) !important;
  scrollbar-width: thin;
  scrollbar-color: var(--ka-muted) transparent;
}
body[data-karma-view="dialogs"] #root [data-karma-analysis-part="body"] > section + section { margin-top: 25px; }
body[data-karma-view="dialogs"] #root [data-karma-analysis-part="body"] > section:first-child:not([data-karma-analysis-section]) {
  border-color: var(--ka-line) !important;
  border-radius: 16px;
  background: var(--ka-surface) !important;
}
body[data-karma-view="dialogs"] #root [data-karma-analysis-part="body"] > section:first-child:not([data-karma-analysis-section]) .grid > div {
  border-color: var(--ka-line) !important;
  border-radius: 12px;
  background: var(--ka-raised) !important;
}
body[data-karma-view="dialogs"] #root [data-karma-analysis-part="body"] > section > h3 {
  margin-bottom: 11px;
  color: var(--ka-ink) !important;
  font-size: 15px;
  font-weight: 650;
}
/* The zip uses a continuous transcript. Keep its timing, speakers and seeking. */
body[data-karma-view="dialogs"] #root [data-karma-analysis-section="transcription"] > div {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
body[data-karma-view="dialogs"] #root [data-karma-analysis-section="transcription"] [data-active] {
  position: relative;
  margin: 0;
  padding: 8px 12px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: transparent !important;
  box-shadow: none !important;
}
body[data-karma-view="dialogs"] #root [data-karma-analysis-section="transcription"] [data-active]:hover {
  background: var(--ka-raised) !important;
}
body[data-karma-view="dialogs"] #root [data-karma-analysis-section="transcription"] [data-active="true"] {
  background: var(--ka-surface) !important;
  box-shadow: inset 3px 0 0 var(--ka-accent) !important;
}
body[data-karma-view="dialogs"] #root [data-karma-analysis-section="transcription"] [data-active] [class~="text-xs"] {
  color: var(--ka-muted) !important;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}
body[data-karma-view="dialogs"] #root [data-karma-analysis-section="transcription"] [data-active] p {
  color: var(--ka-ink) !important;
  font-size: 14px;
  line-height: 1.55;
}
body[data-karma-view="dialogs"] #root [data-karma-analysis-section="transcription"] [data-active="true"] .animate-pulse { display: none; }
/* Soft metric surfaces carry status by a single muted icon. */
body[data-karma-view="dialogs"] #root [data-karma-analysis-section="metrics"] .grid > div[class~="rounded-lg"] {
  padding: 14px;
  border: 0 !important;
  border-radius: 16px;
  background: var(--ka-surface) !important;
  box-shadow: none !important;
}
body[data-karma-view="dialogs"] #root [data-karma-analysis-section="metrics"] .grid > div[class~="rounded-lg"]:hover {
  background: var(--ka-raised) !important;
}
body[data-karma-view="dialogs"] #root [data-karma-analysis-section="metrics"] .font-medium { color: var(--ka-ink) !important; }
body[data-karma-view="dialogs"] #root [data-karma-analysis-section="metrics"] [class~="text-xs"] { color: var(--ka-muted) !important; font-size: 12px; }
body[data-karma-view="dialogs"] #root [data-karma-analysis-section="metrics"] [class*="bg-green-"] { background: #e2eee7 !important; color: #4b7962 !important; }
body[data-karma-view="dialogs"] #root [data-karma-analysis-section="metrics"] [class*="bg-red-"] { background: #f3e8e9 !important; color: #956b6e !important; }
html.dark body[data-karma-view="dialogs"] #root [data-karma-analysis-section="metrics"] [class*="bg-green-"] { background: #314b42 !important; color: #a7d1b8 !important; }
html.dark body[data-karma-view="dialogs"] #root [data-karma-analysis-section="metrics"] [class*="bg-red-"] { background: #533e47 !important; color: #edb9bd !important; }

/* Reports: tonal panels and controls. The PDF preview and generation stay intact. */
body[data-karma-view="reports"] #root [class~="h-screen"][class~="overflow-hidden"] {
  --kr-canvas: #f4f7f8;
  --kr-surface: #fff;
  --kr-tonal: #eef3f3;
  --kr-line: #dde7e7;
  --kr-ink: #23343d;
  --kr-muted: #647782;
  --kr-accent: #397285;
  color: var(--kr-ink);
}
html.dark body[data-karma-view="reports"] #root [class~="h-screen"][class~="overflow-hidden"] {
  --kr-canvas: #111b29;
  --kr-surface: #1d2b3a;
  --kr-tonal: #263747;
  --kr-line: #324453;
  --kr-ink: #edf4f8;
  --kr-muted: #b3c4d0;
  --kr-accent: #9ac1cc;
}
body[data-karma-view="reports"] #root [class~="h-screen"][class~="overflow-hidden"] > [class~="border-b"] {
  background: var(--kr-surface) !important;
  border-color: var(--kr-line) !important;
}
body[data-karma-view="reports"] #root [class~="h-screen"][class~="overflow-hidden"] > [class~="border-b"] h1 { color: var(--kr-ink) !important; font-weight: 650; }
body[data-karma-view="reports"] #root [class~="h-screen"][class~="overflow-hidden"] > [class~="border-b"] h2 { color: var(--kr-muted) !important; }
body[data-karma-view="reports"] #root [class~="h-screen"][class~="overflow-hidden"] > [class~="flex-1"] { background: var(--kr-canvas); }
body[data-karma-view="reports"] #root [class~="h-screen"][class~="overflow-hidden"] [class~="w-72"] {
  background: var(--kr-surface) !important;
  border-color: var(--kr-line) !important;
}
body[data-karma-view="reports"] #root [class~="h-screen"][class~="overflow-hidden"] [class~="w-72"] > [class~="p-4"] > p {
  font-size: 16px;
  color: var(--kr-ink) !important;
}
body[data-karma-view="reports"] #root [class~="w-72"] [class~="uppercase"] { font-size: 12px; color: var(--kr-muted) !important; }
body[data-karma-view="reports"] #root [class~="w-72"] button[class~="border"],
body[data-karma-view="reports"] #root [class~="w-72"] [role="combobox"] {
  min-height: 40px;
  border-color: var(--kr-line) !important;
  border-radius: 12px;
  background: var(--kr-tonal) !important;
  color: var(--kr-ink) !important;
  box-shadow: none;
}
body[data-karma-view="reports"] #root [class~="w-72"] [class~="h-8"][class~="border"] {
  min-height: 40px;
  border-radius: 12px;
  border-color: var(--kr-line) !important;
  background: var(--kr-tonal) !important;
}
body[data-karma-view="reports"] #root [class~="w-72"] [class~="h-8"][class~="border"] button {
  border-radius: 10px;
}
body[data-karma-view="reports"] #root [class~="w-72"] [class~="h-8"][class~="border"] button[class~="bg-primary"] {
  background: var(--kr-surface) !important;
  color: var(--kr-ink) !important;
  box-shadow: 0 1px 5px rgb(24 48 57 / 9%);
}
body[data-karma-view="reports"] #root [class~="w-72"] > [class~="border-t"] { border-color: var(--kr-line) !important; background: var(--kr-surface); }
body[data-karma-view="reports"] #root [class~="w-72"] > [class~="border-t"] > button {
  min-height: 44px;
  border-radius: 14px;
  background: #397285 !important;
  color: #fff !important;
  font-weight: 650;
  box-shadow: none;
}
body[data-karma-view="reports"] #root [class~="w-72"] > [class~="border-t"] > button:hover:not(:disabled) { background: #2d6072 !important; }
body[data-karma-view="reports"] #root [class~="w-72"] > [class~="border-t"] > button:disabled { opacity: .55; }
body[data-karma-view="reports"] #root [class~="h-screen"][class~="overflow-hidden"] [class~="min-w-0"][class~="flex-col"] {
  background: var(--kr-canvas) !important;
}
body[data-karma-view="reports"] #root [class~="h-screen"][class~="overflow-hidden"] [class~="min-w-0"][class~="flex-col"] > [class~="border-b"] {
  background: var(--kr-surface) !important;
  border-color: var(--kr-line) !important;
}
body[data-karma-view="reports"] #root [class~="h-screen"][class~="overflow-hidden"] [class~="min-w-0"][class~="flex-col"] > [class~="border-b"] p { color: var(--kr-ink) !important; }
body[data-karma-view="reports"] #root [class~="h-screen"][class~="overflow-hidden"] [class~="min-w-0"][class~="flex-col"] > [class~="border-b"] button {
  min-height: 38px;
  border-radius: 12px;
  border-color: var(--kr-line) !important;
  background: var(--kr-tonal) !important;
  color: var(--kr-ink) !important;
}
body[data-karma-view="reports"] #root [class~="h-screen"][class~="overflow-hidden"] [class~="min-w-0"][class~="flex-col"] [class~="text-center"] > p { color: var(--kr-muted) !important; }
body[data-karma-view="reports"] #root [class~="h-screen"][class~="overflow-hidden"] [class~="min-w-0"][class~="flex-col"] iframe {
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 10px 30px rgb(21 42 48 / 10%);
}
body[data-karma-view="reports"] #root [class~="min-w-0"][class~="flex-col"] > [class~="flex-1"][class~="relative"] > [class~="h-full"]:has(> svg) {
  color: var(--kr-muted) !important;
}
body[data-karma-view="reports"] [data-radix-popper-content-wrapper] [data-radix-select-content],
body[data-karma-view="reports"] [data-radix-popper-content-wrapper] [data-radix-popover-content] {
  border: 1px solid var(--kr-line, #dce6e6) !important;
  border-radius: 16px;
  background: var(--kr-surface, #fff) !important;
  box-shadow: 0 10px 28px rgb(21 42 48 / 12%);
}
html.dark body[data-karma-view="reports"] [data-radix-popper-content-wrapper] [data-radix-select-content],
html.dark body[data-karma-view="reports"] [data-radix-popper-content-wrapper] [data-radix-popover-content] {
  border-color: #324453 !important;
  background: #1d2b3a !important;
}