/* Tokens: estrutura do design system Candy Studio (design-system/candy-studio)
   com o azul e os neutros da marca Candydate (candydate-vert.vercel.app).
   Azul #28AAF0 nos destaques sem texto; #0E7AB8 nos botões com texto branco
   e #166F9F em textos e links (contraste AA). Verde/âmbar/vermelho só para
   status. Geist nos títulos, Inter no corpo, bordas de 1px, sombras mínimas.
   Usado pela ToolsKit e pelo BP (o BP copia este arquivo no build). Os nomes
   das variáveis são os antigos, para não mexer nos componentes. */
:root {
  --navy: #383a47;
  --teal: #28aaf0; /* azul Candydate, acento não textual */
  --primary: #28aaf0; /* abas, indicadores, barras, realces */
  --primary-ink: #166f9f; /* texto e links em azul (AA) */
  --secondary: #6b6e76;
  --cta: #0e7ab8; /* ação principal (texto branco, AA) */
  --cta-hover: #0b6699;
  --on-cta: #ffffff;
  --focus: #0e7ab8;
  --ring: rgba(40, 170, 240, 0.28); /* anel de brilho de 4px */
  --accent-soft: #eaf6fe;
  --brand-gradient: linear-gradient(135deg, #28aaf0 0%, #5860a9 100%);
  --bg: #f6f8fa;
  --surface: #ffffff;
  --ink: #383a47;
  --muted: #6b6e76;
  --border: #e2e6eb;
  --border-strong: #d5dae1;
  --success: #15a66b;
  --warning-bg: #fef6e7;
  --warning-ink: #4a3208;
  --danger: #d93a3f;
  /* Sombras mínimas: a borda faz a separação. */
  --shadow: 0 1px 2px rgba(56, 58, 71, 0.04);
  --shadow-hover: 0 4px 12px rgba(40, 170, 240, 0.12), 0 2px 4px rgba(56, 58, 71, 0.04);
  /* Raios: 8 (controles pequenos), 12 (inputs, tags), 16 (cartões). */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius: 16px;
  /* Barra superior: branca translúcida com desfoque, como a navbar do site. */
  --header-bg: rgba(255, 255, 255, 0.85);
  --header-fg: #383a47;
  --header-accent: #0e7ab8;
  --header-border: #e2e6eb;
  --header-hover: #eaf6fe;
  --font-body: "Inter", "Geist", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-display: "Geist", "Inter", system-ui, sans-serif;
  --font-mono: "Geist Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  color-scheme: light;
}

/* Tema escuro: automático pelo sistema, ou forçado em Configurações
   (data-theme="dark" | "light" no <html>, ver theme-init.js). */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --navy: #f4f6f8;
    --primary-ink: #5cc0f5;
    --secondary: #a1a6ae;
    --cta: #0e7ab8;
    --cta-hover: #1690d2;
    --on-cta: #ffffff;
    --focus: #28aaf0;
    --ring: rgba(40, 170, 240, 0.32);
    --accent-soft: rgba(40, 170, 240, 0.14);
    --bg: #0d1117;
    --surface: #161b22;
    --ink: #f4f6f8;
    --muted: #a1a6ae;
    --border: #262c36;
    --border-strong: #343b47;
    --success: #3ccf8e;
    --warning-bg: rgba(245, 166, 35, 0.14);
    --warning-ink: #ffc163;
    --danger: #ff7a7e;
    --shadow: none;
    --shadow-hover: 0 12px 32px rgba(0, 0, 0, 0.45);
    --header-bg: rgba(13, 17, 23, 0.85);
    --header-fg: #d6dae0;
    --header-accent: #5cc0f5;
    --header-border: #262c36;
    --header-hover: rgba(40, 170, 240, 0.14);
    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --navy: #f4f6f8;
  --primary-ink: #5cc0f5;
  --secondary: #a1a6ae;
  --cta: #0e7ab8;
  --cta-hover: #1690d2;
  --on-cta: #ffffff;
  --focus: #28aaf0;
  --ring: rgba(40, 170, 240, 0.32);
  --accent-soft: rgba(40, 170, 240, 0.14);
  --bg: #0d1117;
  --surface: #161b22;
  --ink: #f4f6f8;
  --muted: #a1a6ae;
  --border: #262c36;
  --border-strong: #343b47;
  --success: #3ccf8e;
  --warning-bg: rgba(245, 166, 35, 0.14);
  --warning-ink: #ffc163;
  --danger: #ff7a7e;
  --shadow: none;
  --shadow-hover: 0 12px 32px rgba(0, 0, 0, 0.45);
  --header-bg: rgba(13, 17, 23, 0.85);
  --header-fg: #d6dae0;
  --header-accent: #5cc0f5;
  --header-border: #262c36;
  --header-hover: rgba(40, 170, 240, 0.14);
  color-scheme: dark;
}

* {
  box-sizing: border-box;
}

/* Componentes com display próprio (flex/grid) não podem vencer o atributo hidden. */
[hidden] {
  display: none !important;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font: 400 14px/22px var(--font-body);
  -webkit-font-smoothing: antialiased;
}

main {
  padding: 20px 16px 40px;
}

.page main {
  max-width: 640px;
  margin: 0 auto;
}

a {
  color: var(--primary-ink);
}

code {
  font-family: var(--font-mono);
  font-size: 13px;
}

/* Barra superior como a navbar do Candy Studio: clara e translúcida, com
   desfoque e borda de 1px. No tema escuro, o logo da empresa ganha um fundo
   branco (logos costumam ser feitos para fundo claro). */
.topbar {
  position: sticky;
  top: 0;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 60px;
  padding: 10px 16px;
  background: var(--header-bg);
  -webkit-backdrop-filter: saturate(180%) blur(12px);
  backdrop-filter: saturate(180%) blur(12px);
  border-bottom: 1px solid var(--header-border);
  color: var(--header-fg);
}

.topbar__logo {
  display: block;
  height: 32px;
  width: auto;
  max-width: 170px;
  border-radius: var(--radius-sm);
  object-fit: contain;
}

:root[data-theme="dark"] .topbar__logo:not(.topbar__logo--marca) {
  padding: 4px 8px;
  background: #fff;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .topbar__logo:not(.topbar__logo--marca) {
    padding: 4px 8px;
    background: #fff;
  }
}

/* Marca Candydate: sem cantos arredondados (não corta o "C" nem o "e"). */
.topbar__logo--marca {
  border-radius: 0;
  max-width: 150px;
}

.topbar__brand {
  font: 600 16px/24px var(--font-display);
  letter-spacing: -0.02em;
  color: var(--ink);
}

.topbar__actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface);
  color: var(--header-fg);
  cursor: pointer;
  transition: background-color 120ms var(--ease-out), color 120ms var(--ease-out);
}

.theme-toggle:hover {
  background: var(--header-hover);
  color: var(--ink);
}

.theme-toggle:focus-visible,
.topbar__link:focus-visible {
  outline: none;
  box-shadow: 0 0 0 4px var(--ring);
}

.theme-toggle svg {
  width: 16px;
  height: 16px;
}

.topbar__link {
  display: inline-flex;
  align-items: center;
  height: 32px;
  padding: 0 10px;
  border-radius: var(--radius-sm);
  color: var(--header-fg);
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
  transition: background-color 120ms var(--ease-out);
}

.topbar__link:hover {
  background: var(--header-hover);
  color: var(--ink);
}

.eyebrow {
  margin: 0 0 6px;
  font-size: 11px;
  line-height: 16px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--primary-ink);
}

.title {
  margin: 0 0 8px;
  font: 600 22px/30px var(--font-display);
  letter-spacing: -0.02em;
}

.subtitle {
  margin: 0 0 8px;
  font: 600 16px/24px var(--font-display);
  letter-spacing: -0.01em;
}

.lead {
  margin: 0 0 20px;
  color: var(--muted);
}

.banner {
  margin-bottom: 20px;
  padding: 12px 14px;
  border-radius: var(--radius-md);
  background: var(--warning-bg);
  color: var(--warning-ink);
}

.banner a {
  color: inherit;
  font-weight: 600;
}

/* Formulário */
.field {
  margin-bottom: 16px;
}

.field__row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
}

label,
legend {
  display: block;
  margin-bottom: 6px;
  font-weight: 600;
  font-size: 13px;
}

.group {
  margin: 0 0 16px;
  padding: 14px 14px 2px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
}

.group legend {
  padding: 0 4px;
}

section.group {
  margin-top: 28px;
  padding-bottom: 8px;
}

.optional {
  font-weight: 400;
  color: var(--muted);
}

input[type="text"],
input[type="password"],
textarea {
  width: 100%;
  padding: 9px 12px;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-md);
  background: var(--surface);
  color: var(--ink);
  font: inherit;
}

textarea {
  resize: vertical;
  min-height: 80px;
}

/* Foco: anel suave de 4px (nunca contorno duro). */
input:focus-visible,
textarea:focus-visible,
button:focus-visible,
a:focus-visible {
  outline: none;
  box-shadow: 0 0 0 4px var(--ring);
}

input[type="text"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus,
input[type="number"]:focus,
input[type="date"]:focus,
input[type="search"]:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 4px var(--ring);
}

.hint {
  margin: 6px 0 0;
  font-size: 12px;
  line-height: 18px;
  color: var(--muted);
}

.consent {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin: 4px 0 16px;
  font-weight: 400;
  font-size: 13px;
  line-height: 20px;
  cursor: pointer;
}

.consent input {
  margin-top: 3px;
  accent-color: var(--cta);
  flex: none;
}

.error {
  margin: 0 0 12px;
  padding: 10px 12px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--danger);
  color: var(--danger);
  font-size: 13px;
}

/* Aviso de "clique no ícone": texto + imagem do ícone na barra do Chrome. */
.icon-hint {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}

.icon-hint__img {
  display: block;
  width: 112px;
  height: auto;
  margin-top: 6px;
}

/* Botões */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 7px 14px;
  border-radius: var(--radius-md);
  border: 1px solid transparent;
  font: 600 13.5px/20px var(--font-body);
  cursor: pointer;
  transition: background-color 120ms var(--ease-out), border-color 120ms var(--ease-out), transform 120ms var(--ease-out);
}

.btn--primary {
  width: 100%;
  background: var(--cta);
  color: var(--on-cta);
}

.btn--primary:hover {
  background: var(--cta-hover);
  transform: translateY(-1px);
}

.btn--primary:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.btn--ghost {
  background: var(--surface);
  color: var(--ink);
  border-color: var(--border-strong);
}

.btn--ghost:hover {
  border-color: var(--primary);
}

.btn-link {
  padding: 0;
  border: 0;
  background: none;
  color: var(--primary-ink);
  font: 500 13px/20px var(--font-body);
  cursor: pointer;
}

.btn-link:hover {
  text-decoration: underline;
}

.actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 8px;
}

.actions .btn--primary {
  width: auto;
  flex: 1 1 auto;
}

/* Processando */
.loading {
  padding: 64px 0;
  text-align: center;
}

.loading__title {
  margin: 16px 0 4px;
  font: 600 16px/24px var(--font-display);
}

.loading .btn {
  margin-top: 20px;
}

.spinner {
  width: 36px;
  height: 36px;
  margin: 0 auto;
  border-radius: 50%;
  border: 3px solid var(--border);
  border-top-color: var(--primary);
  animation: spin 0.9s linear infinite;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .spinner {
    animation-duration: 3s;
  }
}

/* Resultado */
#result {
  margin-top: 16px;
}

.card {
  margin-bottom: 12px;
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow);
}

.card h2 {
  margin: 0 0 8px;
  font: 600 16px/24px var(--font-display);
  letter-spacing: -0.01em;
}

.card p {
  margin: 0;
  white-space: pre-line;
}

.empty {
  color: var(--muted);
  font-style: italic;
}

.list {
  margin: 0;
  padding-left: 18px;
}

.list li + li {
  margin-top: 8px;
}

.item + .item {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
}

.item__title {
  font-weight: 600;
}

.item__meta {
  color: var(--muted);
  font-size: 13px;
}

.quote {
  margin: 6px 0 0;
  padding-left: 10px;
  border-left: 2px solid var(--border-strong);
  color: var(--muted);
  font-size: 13px;
  font-style: italic;
}

.tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.tags li {
  padding: 2px 10px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--ink);
  font-size: 13px;
  line-height: 22px;
}

.facts {
  margin: 0;
}

.facts dt {
  font-weight: 600;
  font-size: 13px;
}

.facts dd {
  margin: 2px 0 12px;
}

.facts dd:last-child {
  margin-bottom: 0;
}

.disclaimer {
  margin: 16px 0;
  font-size: 12px;
  line-height: 18px;
  color: var(--muted);
}

/* Gravação */
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.segmented {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  margin: 0 0 20px;
  padding: 4px;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: var(--surface);
}

.segmented__option {
  position: relative;
  margin: 0;
  cursor: pointer;
}

.segmented__option input {
  position: absolute;
  opacity: 0;
}

.segmented__option span {
  display: block;
  padding: 7px 8px;
  border-radius: var(--radius-sm);
  text-align: center;
  font-weight: 500;
  color: var(--muted);
}

.segmented__option input:checked + span {
  background: var(--cta);
  color: var(--on-cta);
}

.segmented__option input:focus-visible + span {
  outline: 2px solid var(--focus);
  outline-offset: 2px;
}

.note {
  margin: 0 0 16px;
  padding: 12px 14px;
  border-radius: var(--radius);
  background: var(--accent-soft);
  font-size: 13px;
  line-height: 20px;
}

.note__title {
  margin: 0 0 6px;
  font-weight: 600;
}

.note .list li + li {
  margin-top: 4px;
}

.recorder {
  margin-bottom: 12px;
  text-align: center;
}

.recorder__status {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-weight: 600;
}

.dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--danger);
  animation: pulse 1.6s ease-in-out infinite;
}

.is-paused .dot {
  background: var(--muted);
  animation: none;
}

@keyframes pulse {
  50% {
    opacity: 0.35;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dot {
    animation: none;
  }
}

.recorder__timer {
  margin: 8px 0 12px;
  font: 500 40px/48px var(--font-mono);
  font-variant-numeric: tabular-nums;
}

.health {
  display: grid;
  gap: 4px;
  margin: 0 0 8px;
  padding: 0;
  list-style: none;
  font-size: 13px;
  text-align: left;
}

.health li::before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-right: 8px;
  border-radius: 50%;
  background: var(--border-strong);
  vertical-align: 1px;
}

.health li.ok::before {
  background: var(--success);
}

.health li.warn::before {
  background: #f59e0b;
}

.warnings {
  margin: 0 0 12px;
  padding: 0;
  list-style: none;
}

.warnings li {
  margin-bottom: 8px;
  padding: 10px 12px;
  border-radius: var(--radius-sm);
  background: var(--warning-bg);
  color: var(--warning-ink);
  font-size: 13px;
}

.actions--split {
  margin-top: 8px;
}

.actions--split .btn {
  flex: 1;
}

.btn--danger {
  color: var(--danger);
}

.btn--danger:hover {
  border-color: var(--danger);
}

.transcript summary {
  cursor: pointer;
  font: 600 15px/22px var(--font-display);
}

.transcript pre {
  max-height: 360px;
  margin: 12px 0;
  overflow: auto;
  white-space: pre-wrap;
  font: 400 13px/20px var(--font-body);
}

/* Configurações: identidade dos currículos */
.label {
  display: block;
  margin-bottom: 6px;
  font-weight: 600;
  font-size: 13px;
}

.branding-intro {
  margin: -4px 0 16px;
}

.logo-picker {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}

.logo-preview {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 200px;
  height: 72px;
  padding: 8px;
  border: 1px dashed var(--border-strong);
  border-radius: var(--radius-sm);
  background: #fff;
}

.logo-preview img {
  max-width: 100%;
  max-height: 100%;
}

.logo-picker__actions {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}

.model-picker {
  padding: 12px 14px;
  border: 1px dashed var(--border-strong);
  border-radius: var(--radius-sm);
}

.model-picker > .hint {
  margin: 0 0 8px;
}

.model-picker__sections {
  margin: 0 0 12px;
  padding-left: 20px;
  font-size: 13px;
  line-height: 20px;
}

.color-row {
  display: flex;
  align-items: center;
  gap: 10px;
}

input[type="color"] {
  width: 44px;
  height: 34px;
  padding: 2px;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  background: var(--surface);
  cursor: pointer;
}

/* Abas do painel */
/* Navegação no formato das abas do kit: faixa branca com borda, itens
   compactos e o ativo preenchido com a cor da ação principal. */
.tabs {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 4px;
  margin: 12px 16px 0;
  padding: 4px;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: var(--surface);
  box-shadow: var(--shadow);
}

.tabs__tab {
  height: 32px;
  padding: 0 2px;
  border: 0;
  border-radius: var(--radius-sm);
  background: none;
  color: var(--muted);
  font: 500 12.5px/18px var(--font-body);
  white-space: nowrap;
  cursor: pointer;
  transition: background-color 0.15s ease, color 0.15s ease;
}

.tabs__tab[aria-selected="true"] {
  background: var(--cta);
  color: var(--on-cta);
}

.tabs__tab:hover {
  background: var(--bg);
  color: var(--ink);
}

.tabs__tab[aria-selected="true"]:hover {
  background: var(--cta);
  color: var(--on-cta);
}

/* Currículos */
.brand-strip {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
}

.brand-strip img {
  max-width: 96px;
  max-height: 32px;
  padding: 2px 4px;
  border-radius: 4px;
  background: #fff;
}

.brand-strip__name {
  flex: 1;
  min-width: 0;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.brand-strip__edit {
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
}

.dropzone {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  margin: 0 0 16px;
  padding: 28px 16px;
  border: 2px dashed var(--border-strong);
  border-radius: var(--radius);
  background: var(--surface);
  text-align: center;
  font-weight: 400;
  cursor: pointer;
  transition: border-color 0.15s ease, background-color 0.15s ease;
}

.dropzone:hover,
.dropzone.is-dragging {
  border-color: var(--primary);
  background: var(--accent-soft);
}

.dropzone:focus-within {
  outline: 2px solid var(--focus);
  outline-offset: 2px;
}

.dropzone__title {
  font: 600 15px/22px var(--font-display);
}

.cv-list-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 8px;
}

.cv-list-header .hint {
  margin: 0;
}

.cv-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.cv-item {
  margin-bottom: 8px;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
}

.cv-item__top {
  display: flex;
  align-items: flex-start;
  gap: 8px;
}

.cv-item__text {
  flex: 1;
  min-width: 0;
}

.cv-item__name {
  margin: 0;
  font-weight: 600;
  overflow-wrap: anywhere;
}

.cv-item__status {
  margin: 2px 0 0;
  font-size: 12px;
  line-height: 18px;
  color: var(--muted);
  overflow-wrap: anywhere;
}

.cv-item__status.is-error {
  color: var(--danger);
}

.cv-item__status.is-working::before {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  margin-right: 6px;
  border-radius: 50%;
  border: 2px solid var(--border);
  border-top-color: var(--primary);
  vertical-align: -1px;
  animation: spin 0.9s linear infinite;
}

.cv-item__remove {
  flex: none;
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: var(--radius-sm);
  background: none;
  color: var(--muted);
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
}

.cv-item__remove:hover {
  background: var(--bg);
  color: var(--ink);
}

.cv-item__actions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));
  gap: 6px;
  margin-top: 10px;
}

.cv-item__actions .btn {
  width: auto;
}

.cv-item__summary {
  margin: 12px 0 0;
  padding-top: 12px;
  border-top: 1px solid var(--border);
  font-size: 13px;
  line-height: 20px;
  color: var(--muted);
}

.cv-item__summary p {
  margin: 0;
}

.cv-item__summary-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}

.cv-item__summary-title {
  font-weight: 600;
  color: var(--ink);
}

.cv-item__summary .btn {
  width: auto;
  flex-shrink: 0;
}

/* Idioma do currículo (Português · English · Español). */
.segmented--3 {
  grid-template-columns: repeat(3, 1fr);
}

.cv-item__idioma {
  margin: 10px 0 0;
  font-size: 13px;
}

.cv-item__idioma .segmented__option span {
  padding: 5px 4px;
}

.segmented__option input:disabled + span {
  opacity: 0.55;
  cursor: progress;
}

.btn--sm {
  min-height: 32px;
  padding: 5px 12px;
  font-size: 13px;
}

/* Componentes compartilhados das ferramentas */
select {
  width: 100%;
  padding: 9px 11px;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-md);
  background: var(--surface);
  color: var(--ink);
  font: inherit;
}

input[type="number"],
input[type="date"],
input[type="search"] {
  width: 100%;
  padding: 9px 12px;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-md);
  background: var(--surface);
  color: var(--ink);
  font: inherit;
}

.field-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  column-gap: 12px;
}

.dropzone--compact {
  padding: 16px;
  margin-bottom: 8px;
}

.attached,
.file-list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin: 8px 0 0;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface);
  font-size: 13px;
  overflow-wrap: anywhere;
}

.file-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.file-list li + li {
  margin-top: 6px;
}

/* Comparativo */
.rank {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 4px 12px;
  align-items: center;
}

.rank__score {
  grid-row: span 2;
  min-width: 64px;
  font: 500 24px/28px "JetBrains Mono", ui-monospace, monospace;
  font-variant-numeric: tabular-nums;
  color: var(--primary-ink);
}

.rank__name {
  margin: 0;
  font-weight: 600;
}

.bar {
  height: 6px;
  border-radius: 999px;
  background: var(--border);
  overflow: hidden;
}

.bar__fill {
  height: 100%;
  border-radius: inherit;
  background: var(--brand-gradient);
}

.card details {
  margin-top: 10px;
}

.card summary {
  cursor: pointer;
  font-weight: 600;
  font-size: 13px;
}

.card h3 {
  margin: 12px 0 4px;
  font-size: 13px;
}

.matrix-wrap {
  overflow-x: auto;
}

.matrix {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
  line-height: 16px;
}

.matrix th,
.matrix td {
  padding: 6px 4px;
  border-bottom: 1px solid var(--border);
  text-align: left;
  vertical-align: top;
}

.matrix th[scope="col"] {
  text-align: center;
  font-weight: 600;
}

.matrix td.level {
  text-align: center;
  font-size: 15px;
}

.level--atende {
  color: var(--success);
}

.level--parcial {
  color: #b45309;
}

.level--nao_evidenciado {
  color: var(--muted);
}

.tag {
  display: inline-block;
  margin-left: 4px;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--bg);
  color: var(--muted);
  font-size: 11px;
  line-height: 18px;
}

.legend {
  margin: 8px 0 0;
  font-size: 12px;
  color: var(--muted);
}

/* Salários */
.range {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  text-align: center;
}

.range dt {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted);
}

.range dd {
  margin: 2px 0 0;
  font: 500 15px/22px "JetBrains Mono", ui-monospace, monospace;
  font-variant-numeric: tabular-nums;
}

.range .is-mid dd {
  color: var(--primary-ink);
  font-size: 18px;
}

.source-item + .source-item {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--border);
}

.source-item__values {
  margin: 4px 0;
  font-family: var(--font-mono);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

/* Turnover */
.calc h2 {
  margin: 0 0 12px;
  font: 600 15px/22px var(--font-display);
}

.calc__subtitle {
  margin: 8px 0 8px;
  font-size: 13px;
}

.metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 8px;
}

.metric {
  padding: 10px;
  border-radius: var(--radius-sm);
  background: var(--bg);
}

.metric__label {
  margin: 0;
  font-size: 12px;
  color: var(--muted);
}

.metric__value {
  margin: 2px 0 0;
  font: 500 20px/26px "JetBrains Mono", ui-monospace, monospace;
  font-variant-numeric: tabular-nums;
}

.breakdown {
  width: 100%;
  margin: 12px 0;
  border-collapse: collapse;
  font-size: 13px;
}

.breakdown th,
.breakdown td {
  padding: 6px 0;
  border-bottom: 1px solid var(--border);
  text-align: left;
  font-weight: 400;
}

.breakdown td {
  text-align: right;
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.breakdown .group-row th {
  padding-top: 12px;
  font-weight: 600;
  font-size: 12px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
}

.breakdown .total-row th,
.breakdown .total-row td {
  border-bottom: 0;
  font-weight: 700;
  font-size: 14px;
}

/* Prompts */
.chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 12px;
}

.chip {
  padding: 4px 10px;
  border: 1px solid var(--border-strong);
  border-radius: 999px;
  background: var(--surface);
  color: var(--ink);
  font: 500 12px/18px var(--font-body);
  cursor: pointer;
}

.chip[aria-pressed="true"] {
  border-color: var(--cta);
  background: var(--cta);
  color: var(--on-cta);
}

.prompt-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.prompt-item {
  margin-bottom: 8px;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
}

.prompt-item__title {
  margin: 0;
  font-weight: 600;
}

.prompt-item__cat {
  margin: 2px 0 4px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--primary-ink);
}

.prompt-item__desc {
  margin: 0;
  font-size: 13px;
  color: var(--muted);
}

.prompt-item pre {
  margin: 8px 0;
  padding: 10px;
  border-radius: var(--radius-sm);
  background: var(--bg);
  white-space: pre-wrap;
  font: 400 12px/18px var(--font-body);
}

.prompt-item__actions {
  display: flex;
  gap: 8px;
  align-items: center;
  margin-top: 8px;
}

.prompt-item__actions .btn {
  width: auto;
}

.calc__header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 12px;
}

.calc__header h2 {
  margin: 0;
}

.keys-intro {
  margin: 0 0 12px;
}

.file-list li .btn-link,
.attached .btn-link {
  flex: none;
  white-space: nowrap;
}

.segmented--3 {
  grid-template-columns: repeat(3, 1fr);
}

.welcome {
  margin-bottom: 16px;
  font-size: 14px;
  line-height: 22px;
}

.welcome p {
  margin: 0;
}

.welcome .note__title {
  margin-bottom: 4px;
}


.lang-label {
  margin: 16px 0 6px;
}

.lang-switch {
  margin: 0 0 4px;
}

.lang-switch:disabled .segmented__option {
  cursor: progress;
  opacity: 0.7;
}

.linkedin-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
}

.linkedin-status .hint {
  margin: 0;
}

.linkedin-status .is-ok {
  color: var(--success);
  font-weight: 600;
}

/* Shortlist */
.steps {
  margin: 0 0 16px;
  padding: 0;
  list-style: none;
  counter-reset: step;
}

.steps > li {
  position: relative;
  margin-bottom: 16px;
  padding-left: 34px;
  counter-increment: step;
}

.steps > li::before {
  content: counter(step);
  position: absolute;
  left: 0;
  top: 0;
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--cta);
  color: var(--on-cta);
  font: 600 12px/1 var(--font-body);
}

.steps__title {
  margin: 2px 0 8px;
  font-weight: 600;
}

.steps .btn-link {
  margin-top: 6px;
}

.steps .chips {
  margin-top: 8px;
}

.sl-score {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-weight: 500;
}

.cv-item__status.is-ok {
  color: var(--success);
}

ol.cv-list {
  padding-left: 0;
  list-style: none;
}

.sl-rank {
  display: inline-block;
  min-width: 28px;
  color: var(--primary-ink);
  font-weight: 700;
}

.sl-url a {
  color: var(--primary-ink);
  overflow-wrap: anywhere;
}

.sl-reqs {
  margin-top: 8px;
  font-size: 13px;
}

.sl-reqs > summary {
  cursor: pointer;
  color: var(--primary-ink);
  font-weight: 600;
}

.sl-reqs__list {
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 6px;
}

.sl-req {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 8px;
  line-height: 18px;
}

.sl-req__level {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--muted);
}

.sl-req.is-atende .sl-req__level {
  color: var(--success);
}

.sl-req.is-parcial .sl-req__level {
  color: var(--warning, #b45309);
}

.sl-req__evidence {
  grid-column: 2;
  color: var(--muted);
}

.sl-below {
  margin-top: 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: var(--surface);
  padding: 12px 14px;
}

.sl-below > summary {
  cursor: pointer;
  font-weight: 600;
}

.sl-below > .hint {
  margin: 8px 0;
}

.sl-gap {
  color: var(--ink);
}

.steps__header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}

.steps__header .btn-link {
  margin-top: 0;
}

/* Favoritos */
.prompt-item__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.fav-toggle {
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: var(--radius-sm);
  background: none;
  color: var(--muted);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
}

.fav-toggle[aria-pressed="true"] {
  color: #f59e0b;
}

.fav-toggle:hover {
  background: var(--bg);
}

.chip--fav {
  border-color: #f59e0b;
}

/* Chat */
.chat {
  display: flex;
  flex-direction: column;
  min-height: calc(100vh - 160px);
}

.chat__header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
}

.chat__title {
  margin: 0 0 8px;
}

.chat__messages {
  flex: 1;
  padding-bottom: 12px;
}

.chat__empty {
  padding: 24px 0 8px;
  text-align: center;
}

.chat__empty .title {
  font-size: 18px;
  line-height: 26px;
}

.chat__empty .chips {
  justify-content: center;
}

.msg {
  margin: 12px 0;
}

.msg--user {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.msg--user .msg__bubble {
  max-width: 88%;
  padding: 10px 12px;
  border-radius: 14px 14px 4px 14px;
  background: var(--cta);
  color: var(--on-cta);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.msg__files {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 4px;
  margin-bottom: 4px;
}

.msg__file {
  padding: 2px 8px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface);
  font-size: 12px;
}

.msg--assistant .msg__bubble {
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: 14px 14px 14px 4px;
  background: var(--surface);
  overflow-wrap: anywhere;
}

.msg__bubble > :first-child {
  margin-top: 0;
}

.msg__bubble > :last-child {
  margin-bottom: 0;
}

.msg__bubble h1,
.msg__bubble h2,
.msg__bubble h3 {
  margin: 12px 0 6px;
  font: 600 15px/22px var(--font-display);
}

.msg__bubble p {
  margin: 0 0 8px;
}

.msg__bubble ul,
.msg__bubble ol {
  margin: 0 0 8px;
  padding-left: 20px;
}

.msg__bubble pre {
  padding: 10px;
  border-radius: var(--radius-sm);
  background: var(--bg);
  overflow-x: auto;
  font-size: 12px;
}

.msg__bubble code {
  font-family: var(--font-mono);
  font-size: 12px;
}

.msg__bubble table {
  display: block;
  overflow-x: auto;
  border-collapse: collapse;
  font-size: 13px;
}

.msg__bubble th,
.msg__bubble td {
  padding: 4px 8px;
  border: 1px solid var(--border);
}

.msg__meta {
  display: flex;
  gap: 12px;
  align-items: center;
  margin-top: 4px;
  font-size: 12px;
  color: var(--muted);
}

.msg__typing::after {
  content: "…";
  animation: pulse 1.2s ease-in-out infinite;
}

.chat__composer {
  position: sticky;
  bottom: 0;
  padding: 8px 0 4px;
  background: var(--bg);
}

.chat__box {
  display: flex;
  align-items: flex-end;
  gap: 6px;
  padding: 6px;
  border: 1px solid var(--border-strong);
  border-radius: 14px;
  background: var(--surface);
}

.chat__box:focus-within {
  border-color: var(--focus);
}

.chat__box textarea {
  flex: 1;
  overflow-y: auto;
  scrollbar-width: thin;
  min-height: 36px;
  max-height: 180px;
  padding: 8px 4px;
  border: 0;
  resize: none;
  background: transparent;
}

.chat__box textarea:focus,
.chat__box textarea:focus-visible {
  outline: none;
}

.chat__icon,
.chat__send {
  flex: none;
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: var(--radius-md);
  cursor: pointer;
}

.chat__icon {
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--ink);
  font-size: 20px;
}

.chat__send {
  border: 0;
  background: var(--cta);
  color: var(--on-cta);
}

.chat__send svg {
  width: 18px;
  height: 18px;
}

.chat__send:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.chat__send.is-stop {
  background: var(--danger);
  color: #fff;
}

.chat__foot {
  margin: 6px 0 0;
  text-align: center;
}

.chat__attachments {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 0 6px;
  padding: 0;
  list-style: none;
}

.chat__attachments li {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 6px 4px 10px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface);
  font-size: 12px;
}

.chat__attachments button {
  width: 22px;
  height: 22px;
  border: 0;
  border-radius: 50%;
  background: var(--bg);
  color: var(--muted);
  cursor: pointer;
}

.chat-menu,
.slash {
  position: absolute;
  left: 0;
  right: 0;
  bottom: calc(100% - 4px);
  z-index: 5;
  max-height: 300px;
  overflow-y: auto;
  padding: 6px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
  box-shadow: 0 8px 24px rgba(56, 58, 71, 0.12);
}

.chat-menu {
  right: auto;
  min-width: 250px;
}

.chat-menu button,
.slash__item {
  display: block;
  width: 100%;
  padding: 8px 10px;
  border: 0;
  border-radius: var(--radius-sm);
  background: none;
  color: var(--ink);
  text-align: left;
  font: 500 13px/18px var(--font-body);
  cursor: pointer;
}

.chat-menu button:hover,
.slash__item:hover,
.slash__item[aria-selected="true"] {
  background: var(--accent-soft);
}

.slash__cat {
  display: block;
  font-size: 11px;
  font-weight: 600;
  color: var(--primary-ink);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.slash__empty {
  margin: 0;
  padding: 8px 10px;
  font-size: 13px;
  color: var(--muted);
}

.msg__sources {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 10px;
  margin-top: 6px;
  font-size: 12px;
  color: var(--muted);
}

.msg__sources a {
  color: var(--primary-ink);
}

/* Elevação de hover do kit nos itens clicáveis de lista. */
.cv-item,
.prompt-item {
  transition: box-shadow 0.15s ease;
}

.cv-item:hover,
.prompt-item:hover {
  box-shadow: var(--shadow-hover);
}

/* Acesso (login, código por e-mail, esqueci a senha) */
html.is-locked body > :not(.auth) {
  display: none !important;
}

.auth {
  display: grid;
  place-items: center;
  min-height: 100vh;
  padding: 24px 16px;
  background: var(--bg);
}

.auth__card {
  width: 100%;
  max-width: 380px;
  padding: 28px 24px 24px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow-hover);
}

/* Marca Candydate: funciona em fundo claro e escuro, sem moldura. */
.auth__logo {
  display: block;
  height: 34px;
  width: auto;
  margin: 0 0 18px;
}

.auth__eyebrow {
  margin-bottom: 2px;
}

.auth__title {
  margin-bottom: 4px;
  font-size: 22px;
}

.auth__lead {
  margin-bottom: 18px;
  font-size: 13px;
}

.auth__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin: 4px 0 16px;
}

.auth__row:last-child {
  margin: 14px 0 0;
}

.auth__row .consent {
  margin: 0;
}

.auth .btn--primary {
  width: 100%;
}

.auth input[type="email"] {
  width: 100%;
  padding: 9px 12px;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-md);
  background: var(--surface);
  color: var(--ink);
  font: inherit;
}

.auth input[type="email"]:focus,
.auth__code:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 4px var(--ring);
}

.auth__code {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-md);
  background: var(--surface);
  color: var(--ink);
  font: 500 24px/32px "JetBrains Mono", ui-monospace, monospace;
  letter-spacing: 0.4em;
  text-align: center;
}

.auth__error {
  margin: 14px 0 0;
  padding: 10px 12px;
  border-radius: var(--radius-md);
  background: color-mix(in srgb, var(--danger) 10%, transparent);
  color: var(--danger);
  font-size: 13px;
}

.auth__sociais {
  display: grid;
  gap: 8px;
  margin-top: 14px;
}

.auth__social {
  width: 100%;
}

.auth__ou {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 6px 0 10px;
  color: var(--muted);
  font-size: 12px;
}

.auth__ou::before,
.auth__ou::after {
  content: "";
  flex: 1;
  border-top: 1px solid var(--border);
}

.auth__rodape {
  margin: 14px 0 0;
  color: var(--muted);
  font-size: 13px;
  text-align: center;
}

.auth a.btn {
  display: block;
  text-align: center;
  text-decoration: none;
}

/* Marca Candydate: botões em pílula e realces em azul, como no site. */
.btn {
  border-radius: 999px;
}
.btn--ghost:hover {
  border-color: var(--primary);
  color: var(--primary-ink);
  background: var(--accent-soft);
}
.eyebrow {
  color: var(--primary-ink);
}