/*
 * AgenticLevel by Bailder — design system.
 * Marca Bailder "clean tech": bege quente + Inter + detalhes NEON LED (acento, nunca tudo).
 * O "B" e o número do score usam a fita de LED (--b-grad). Zero hex solto em componente — só var().
 */

/* ---------- Fontes (self-host Inter via Propshaft — url() bare é resolvida pelo asset pipeline) ---------- */
@font-face { font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/inter-400-1e94a563.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url("/assets/inter-500-5949f5fc.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url("/assets/inter-600-a957bd0d.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 700; font-display: swap; src: url("/assets/inter-700-cbc762c0.woff2") format("woff2"); }

/* ---------- Tokens da marca (EXATOS) ---------- */
:root {
  --white:  #fffefb;
  --paper:  #f1eee5;
  --ink:    #191714;
  --gray-700: #47423a;
  --gray-500: #5f5a51;
  --gray-400: #736d63;
  --gray-200: #d7d1c2;
  --gray-100: #e9e5d9;

  --neon-cyan:    #00e0ff;
  --neon-blue:    #4d7cff;
  --neon-violet:  #8a45ff;
  --neon-magenta: #c837ff;
  --neon-pink:    #ff2d9b;
  --led-base:     #14120f;

  --neon-grad: linear-gradient(115deg, var(--neon-cyan), var(--neon-blue) 26%, var(--neon-violet) 50%, var(--neon-magenta) 72%, var(--neon-pink));
  --b-grad: linear-gradient(122deg, var(--led-base) 0%, var(--led-base) 30%, #4b4b54 35%, #8f8f9c 39%, #dcdce4 42.5%, var(--neon-cyan) 47%, var(--neon-blue) 54%, var(--neon-violet) 62%, var(--neon-magenta) 72%, var(--neon-pink) 84%, var(--neon-pink) 100%);

  --accent:      #2f7dff;
  --accent-text: #175cd3;
  --tier-verde: #16a34a; --tier-amarelo: #d9a400; --tier-vermelho: #e5484d;

  --color-bg: var(--paper);
  --color-card: var(--white);
  --color-surface: var(--gray-100);
  --color-border: var(--gray-200);
  --color-text: var(--ink);
  --color-muted: var(--gray-500);
  --color-faded: var(--gray-400);

  --space-sm: 8px; --space-md: 16px; --space-lg: 24px; --space-xl: 32px; --space-2xl: 48px;
  --space-3xl: clamp(48px, 9vw, 80px); --space-4xl: clamp(64px, 12vw, 120px);

  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 22px; --radius-full: 9999px;

  --shadow-sm: 0 1px 2px rgba(20,15,10,.06), 0 8px 22px rgba(20,15,10,.04);
  --shadow-md: 0 8px 30px rgba(20,15,10,.08);
  --shadow-lg: 0 18px 48px rgba(10,10,20,.10);
  --ring: 0 0 0 3px rgba(45,130,255,.20);

  --ease-out: cubic-bezier(.22, 1, .36, 1);
  --ease-inout: cubic-bezier(.65, 0, .35, 1);
  --t-fast: 140ms var(--ease-out); --t-normal: 240ms var(--ease-out); --t-slow: 420ms var(--ease-out);

  --container-max: 1120px; --container-narrow: 720px;

  --font-sans: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: ui-monospace, "SF Mono", "JetBrains Mono", "Menlo", "Consolas", monospace;
}

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
img, svg, video { max-width: 100%; }
img { display: block; height: auto; }
input, button, textarea, select { font: inherit; color: inherit; }
a { color: var(--accent-text); text-decoration: none; }
a:hover { text-decoration: underline; }

body {
  background: var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-sans);
  font-size: 17px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.visually-hidden {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip-link {
  position: absolute; left: -999px; top: 8px; z-index: 500;
  background: var(--ink); color: var(--white); padding: 10px 16px; border-radius: var(--radius-full);
}
.skip-link:focus { left: 8px; }

:focus-visible { outline: none; box-shadow: var(--ring); border-radius: var(--radius-sm); }

/* ---------- Layout ---------- */
.container { width: 100%; max-width: var(--container-max); margin-inline: auto; padding-inline: clamp(20px, 5vw, 40px); }
.container--narrow { max-width: var(--container-narrow); }
.section { padding-block: var(--space-4xl); }
.section__head { max-width: 640px; margin-bottom: var(--space-2xl); }
.section__head h2 { font-size: clamp(1.6rem, 3.4vw, 2.4rem); font-weight: 700; letter-spacing: -.02em; }
.section__head h1 { font-size: clamp(2rem, 5vw, 3rem); font-weight: 700; letter-spacing: -.03em; }
.section__head p { margin-top: 10px; color: var(--color-muted); font-size: 1.05rem; }

.eyebrow {
  font-family: var(--font-mono); font-size: .74rem; font-weight: 600;
  letter-spacing: .16em; text-transform: uppercase; color: var(--color-faded); margin-bottom: 14px;
}
.block-title { font-size: 1.05rem; font-weight: 600; letter-spacing: -.01em; margin-bottom: var(--space-md); }

/* ---------- O "B" de LED (assinatura) ---------- */
.brand__b {
  font-weight: 700; font-size: 1.5em; line-height: 1;
  background: var(--b-grad); background-size: 260% 100%; background-position: 0% 0%;
  -webkit-background-clip: text; background-clip: text; color: transparent;
  animation: bshift 7s var(--ease-inout) infinite;
}
.brand__b--sm { font-size: 1.2em; }
@keyframes bshift { 0%,100% { background-position: 0% 0%; } 50% { background-position: 100% 0%; } }

/* ---------- Nav ---------- */
.nav {
  position: sticky; top: 0; z-index: 100;
  background: color-mix(in srgb, var(--paper) 86%, transparent);
  backdrop-filter: saturate(140%) blur(10px);
  border-bottom: 1px solid var(--color-border);
}
.nav__inner { display: flex; align-items: center; justify-content: space-between; height: 64px; }
.brand { display: inline-flex; align-items: baseline; gap: 8px; color: var(--ink); font-weight: 700; letter-spacing: -.01em; }
.brand:hover { text-decoration: none; }
.brand__name { font-size: 1.05rem; }
.nav__links { display: flex; align-items: center; gap: clamp(14px, 3vw, 28px); }
.nav__links a { color: var(--gray-700); font-weight: 500; font-size: .95rem; }
.nav__links a:hover { color: var(--ink); text-decoration: none; }
.nav__actions { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.nav__cta {
  padding: 8px 16px; border-radius: var(--radius-full);
  background: var(--ink); color: var(--white) !important;
  white-space: nowrap;
}
.nav__cta:hover { background: #000; }

/* Hambúrguer — só existe no mobile (ver breakpoint 860px). */
.nav__toggle {
  display: none; align-items: center; justify-content: center;
  width: 42px; height: 42px; flex: 0 0 auto; padding: 0;
  border: 1px solid var(--color-border); border-radius: var(--radius-md);
  background: var(--color-card); color: var(--ink); cursor: pointer;
}
.nav__burger { display: grid; gap: 4px; width: 18px; }
.nav__burger i { display: block; height: 2px; border-radius: 2px; background: currentColor; transition: transform var(--t-fast), opacity var(--t-fast); }
.nav.is-open .nav__burger i:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.nav.is-open .nav__burger i:nth-child(2) { opacity: 0; }
.nav.is-open .nav__burger i:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* Mobile: os links viram painel dropdown; brand + CTA + hambúrguer cabem em 320px. */
@media (max-width: 860px) {
  .nav__toggle { display: inline-flex; }
  .nav__inner { gap: 10px; }
  .nav__links {
    display: none; position: absolute; left: 0; right: 0; top: 100%;
    flex-direction: column; align-items: stretch; gap: 0;
    padding: 8px clamp(20px, 5vw, 40px) 16px;
    background: var(--color-bg); border-bottom: 1px solid var(--color-border);
    box-shadow: var(--shadow-md);
  }
  .nav.is-open .nav__links { display: flex; }
  .nav__links > a, .nav__links > .langsw, .nav__links > form {
    padding-block: 12px; border-top: 1px solid var(--color-border);
  }
  .nav__links > a { font-size: 1rem; }
  .nav__links > *:first-child { border-top: 0; }
  .nav__cta { padding: 8px 14px; font-size: .9rem; }
  .brand__name { font-size: 1rem; }
}
@media (max-width: 400px) {
  .nav__inner { height: 60px; }
  .nav__cta { padding: 7px 12px; font-size: .82rem; }
}

/* ---------- Botões ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 12px 22px; border-radius: var(--radius-full); font-weight: 600; font-size: .95rem;
  border: 1px solid transparent; cursor: pointer; transition: transform var(--t-fast), background var(--t-fast), box-shadow var(--t-fast);
}
.btn:hover { text-decoration: none; transform: translateY(-1px); }
.btn--primary { background: var(--ink); color: var(--white); }
.btn--primary:hover { background: #000; box-shadow: var(--shadow-md); }
.btn--ghost { background: var(--color-card); color: var(--ink); border-color: var(--color-border); }
.btn--ghost:hover { border-color: var(--ink); }
.btn--share { background: var(--color-card); border-color: var(--color-border); color: var(--gray-700); padding: 10px 18px; }
.btn--share:hover { border-color: var(--accent); color: var(--accent-text); }

/* ---------- Grade + arquétipo pill ---------- */
.grade {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 2.4em; padding: 3px 12px; border-radius: var(--radius-full);
  font-weight: 700; font-family: var(--font-mono); letter-spacing: .02em;
  border: 1.5px solid currentColor; background: var(--color-card);
}
.grade--sm { font-size: .8rem; padding: 2px 10px; }
.grade--lg { font-size: 1.3rem; padding: 6px 18px; }
.grade--a, .grade--ap, .grade--am { color: var(--tier-verde); }
.grade--b, .grade--bp, .grade--bm { color: var(--accent-text); }
.grade--c, .grade--cp, .grade--cm { color: var(--neon-violet); }
.grade--d { color: var(--neon-magenta); }
.grade--f { color: var(--tier-vermelho); }

.archetype-pill {
  display: inline-flex; align-items: center; padding: 4px 14px; border-radius: var(--radius-full);
  background: var(--color-surface); color: var(--gray-700);
  font-size: .82rem; font-weight: 600; letter-spacing: -.01em;
}

/* ---------- O número do score (fita de LED) ---------- */
.score-number {
  font-weight: 700; letter-spacing: -.04em; line-height: .95; font-size: clamp(3rem, 8vw, 4.4rem);
  background: var(--b-grad); background-size: 220% 100%;
  -webkit-background-clip: text; background-clip: text; color: transparent;
  font-variant-numeric: tabular-nums;
}
.score-number--xl { font-size: clamp(4.5rem, 16vw, 9rem); }

/* ---------- Hero ---------- */
/* O respiro depois do hero somava padding-bottom + padding-top da próxima seção
   (~240px no desktop) e abria uma faixa vazia entre o hero e o "How to". */
.hero { position: relative; overflow: clip; padding-block: clamp(40px, 7vw, 84px) clamp(28px, 4vw, 48px); }
.hero + .section { padding-top: clamp(36px, 5vw, 64px); }
.hero::before {
  content: ""; position: absolute; z-index: 0;
  top: -12%; right: -8%; width: min(640px, 72vw); aspect-ratio: 1;
  background: radial-gradient(circle at 50% 50%, rgba(77,124,255,.16), rgba(138,69,255,.10) 42%, rgba(255,45,155,.05) 60%, transparent 70%);
  pointer-events: none; animation: aurora 16s var(--ease-inout) infinite alternate;
}
@keyframes aurora {
  from { transform: translate(0, 0) scale(1); opacity: .85; }
  to   { transform: translate(-3%, 4%) scale(1.08); opacity: 1; }
}
.hero__grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(32px, 5vw, 64px); align-items: center; }
.hero__title { font-size: clamp(2.4rem, 6vw, 4rem); font-weight: 700; line-height: 1.04; letter-spacing: -.035em; }
.hero__sub { margin-top: var(--space-lg); font-size: 1.15rem; color: var(--gray-700); max-width: 32ch; }
.hero__cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: var(--space-xl); }

.install {
  display: flex; align-items: center; gap: 10px; margin-top: var(--space-xl); max-width: 640px;
  padding: 12px 12px 12px 18px; border-radius: var(--radius-md);
  background: var(--ink); color: var(--white); box-shadow: var(--shadow-md);
  transition: box-shadow var(--t-normal), transform var(--t-fast);
}
.install:hover { box-shadow: var(--shadow-lg); transform: translateY(-1px); }
.install__prompt { flex: 0 0 auto; color: var(--neon-cyan); font-family: var(--font-mono); font-weight: 600; }
.install__cmd {
  flex: 1 1 auto; min-width: 0; font-family: var(--font-mono); font-size: .92rem;
  white-space: nowrap; overflow-x: auto; scrollbar-width: none;
}
.install__cmd::-webkit-scrollbar { display: none; }
.install__copy {
  flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; border-radius: var(--radius-sm);
  background: rgba(255,255,255,.08); color: var(--white); border: 0; cursor: pointer;
  transition: background var(--t-fast), color var(--t-fast);
}
.install__copy:hover { background: rgba(255,255,255,.18); }
.install__copy .icon-done { display: none; }
.install.is-copied .install__copy { color: var(--neon-cyan); background: rgba(0,224,255,.14); }
.install.is-copied .icon-idle { display: none; }
.install.is-copied .icon-done { display: block; }
.install__note {
  margin-top: 12px; font-size: .85rem; color: var(--color-faded);
  display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap;
}
.install__badge {
  font-family: var(--font-mono); font-weight: 600; font-size: .72rem; letter-spacing: .04em;
  color: var(--accent-text); background: rgba(45,130,255,.10); padding: 2px 10px; border-radius: var(--radius-full);
}

.hero__card {
  position: relative; overflow: hidden;
  background: var(--color-card); border: 1px solid var(--color-border); border-radius: var(--radius-xl);
  padding: var(--space-xl); box-shadow: var(--shadow-lg); text-align: center;
}
.hero__card::before {
  content: ""; position: absolute; inset: 0 0 auto 0; height: 3px;
  background: var(--b-grad); background-size: 200% 100%;
  animation: bshift 7s var(--ease-inout) infinite;
}
.card__eyebrow { font-family: var(--font-mono); font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--color-faded); }
.hero__card .score-number { margin-block: 6px 12px; }
.score-meta { display: flex; align-items: center; justify-content: center; gap: 10px; flex-wrap: wrap; }
.hero__radar { margin-top: var(--space-md); display: flex; justify-content: center; }

/* ---------- Radar / hexágono LED ---------- */
.radar { display: block; overflow: visible; }
.radar__ring { fill: none; stroke: var(--color-border); stroke-width: 1; }
.radar__spoke { stroke: var(--color-border); stroke-width: 1; }
.radar__data { filter: drop-shadow(0 0 8px rgba(77,124,255,.35)); }
.radar__dot { fill: var(--white); stroke: var(--neon-blue); stroke-width: 1.5; }
.radar__label { font-family: var(--font-mono); font-size: 11px; font-weight: 600; fill: var(--color-muted); text-transform: uppercase; letter-spacing: .04em; }

/* ---------- Mini leaderboard (home) ---------- */
.board-preview { background: var(--color-surface); border-block: 1px solid var(--color-border); }
.mini-board { list-style: none; display: grid; gap: 10px; margin-bottom: var(--space-xl); }
.mini-row {
  display: grid; grid-template-columns: 2.5em 44px 1fr auto auto auto; align-items: center; gap: 14px;
  padding: 12px 18px; background: var(--color-card); border: 1px solid var(--color-border); border-radius: var(--radius-lg);
  transition: border-color var(--t-fast), transform var(--t-fast);
}
.mini-row:hover { border-color: var(--accent); transform: translateX(2px); }
.mini-row__rank { font-family: var(--font-mono); font-weight: 700; color: var(--color-faded); }
.mini-row__hex { display: inline-flex; }
.mini-row__handle { font-weight: 600; color: var(--ink); }
.mini-row__arch { color: var(--color-muted); font-size: .9rem; }
.mini-row__score { font-family: var(--font-mono); font-weight: 700; font-variant-numeric: tabular-nums; }

/* ---------- Pilares (home grid) ---------- */
.pillar-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-md); }
.pillar-card {
  position: relative; overflow: hidden; display: flex; flex-direction: column;
  background: var(--color-card); border: 1px solid var(--color-border);
  border-radius: var(--radius-lg); padding: var(--space-lg);
  transition: border-color var(--t-fast), transform var(--t-normal), box-shadow var(--t-normal);
}
.pillar-card::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
  background: var(--neon-grad); transform: scaleY(0); transform-origin: top; transition: transform var(--t-normal);
}
.pillar-card:hover { border-color: var(--accent); transform: translateY(-2px); box-shadow: var(--shadow-sm); }
.pillar-card:hover::before { transform: scaleY(1); }
.pillar-card__cap {
  display: inline-block; align-self: flex-start; font-family: var(--font-mono); font-size: .74rem; font-weight: 600;
  color: var(--accent-text); background: rgba(45,130,255,.10); padding: 2px 10px; border-radius: var(--radius-full); margin-bottom: 12px;
}
.pillar-card h3 { font-size: 1.1rem; font-weight: 600; letter-spacing: -.01em; }
.pillar-card p { flex: 1; margin-top: 8px; color: var(--color-muted); font-size: .95rem; }
.pillar-card__weight { margin-top: 16px; height: 5px; border-radius: var(--radius-full); background: var(--color-surface); overflow: hidden; }
.pillar-card__weight i { display: block; height: 100%; background: var(--neon-grad); }

/* ---------- Manifesto ---------- */
.manifesto { text-align: center; }
.manifesto__title { font-size: clamp(1.8rem, 4.5vw, 2.8rem); font-weight: 700; letter-spacing: -.03em; }
.manifesto__lede { margin: var(--space-md) auto 0; max-width: 52ch; color: var(--gray-700); font-size: 1.1rem; }
.faceoff {
  display: grid; grid-template-columns: 1fr auto 1fr; gap: var(--space-lg);
  align-items: center; max-width: 720px; margin: var(--space-2xl) auto;
}
.faceoff__card {
  padding: var(--space-xl) var(--space-lg); border-radius: var(--radius-lg);
  border: 1px solid var(--color-border); background: var(--color-card); text-align: center;
  display: flex; flex-direction: column; gap: 6px;
}
.faceoff__card--them { opacity: .72; }
.faceoff__card--us { border-color: var(--neon-magenta); box-shadow: 0 0 0 1px rgba(200,55,255,.22), var(--shadow-md); }
.faceoff__big { font-family: var(--font-mono); font-weight: 700; line-height: 1; font-size: clamp(2.8rem, 9vw, 4.2rem); letter-spacing: -.03em; }
.faceoff__card--them .faceoff__big { color: var(--gray-400); text-decoration: line-through; text-decoration-thickness: 3px; }
.faceoff__card--us .faceoff__big { background: var(--b-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.faceoff__k { font-family: var(--font-mono); font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: var(--color-faded); }
.faceoff__v { font-weight: 600; font-size: 1rem; }
.faceoff__card--us .faceoff__v { color: var(--accent-text); }
.faceoff__vs {
  width: 52px; height: 52px; border-radius: var(--radius-full); display: grid; place-items: center;
  font-family: var(--font-mono); font-weight: 700; font-size: .9rem; color: var(--color-muted);
  background: var(--color-card); box-shadow: inset 0 0 0 1.5px var(--color-border), var(--shadow-sm);
}
.manifesto__punch { font-size: 1.3rem; font-weight: 600; letter-spacing: -.02em; margin-bottom: var(--space-xl); }

/* ---------- Onboarding "Como rodar" (run-sec) ---------- */
.run-sec__head { max-width: 640px; }

/* Comando único, protagonista */
.cmd {
  position: relative; display: flex; align-items: center; gap: 12px;
  max-width: 760px; margin-top: var(--space-lg);
  padding: 16px 16px 16px 20px; border-radius: var(--radius-md);
  background: var(--ink); color: var(--white); box-shadow: var(--shadow-lg);
  border: 1px solid rgba(77,124,255,.28);
}
.cmd__dots { flex: 0 0 auto; display: inline-flex; gap: 5px; }
.cmd__dots i { width: 9px; height: 9px; border-radius: 50%; background: rgba(255,255,255,.22); }
.cmd__prompt { flex: 0 0 auto; color: var(--neon-cyan); font-family: var(--font-mono); font-weight: 600; }
.cmd__code {
  flex: 1 1 auto; min-width: 0; font-family: var(--font-mono); font-size: .95rem;
  white-space: nowrap; overflow-x: auto; scrollbar-width: none;
}
.cmd__code::-webkit-scrollbar { display: none; }
.cmd__copy {
  flex: 0 0 auto; display: inline-flex; align-items: center; padding: 8px 14px; border-radius: var(--radius-full);
  background: rgba(255,255,255,.10); border: 1px solid rgba(255,255,255,.22);
  color: var(--white); font-weight: 600; font-size: .85rem; cursor: pointer;
  transition: background var(--t-fast), border-color var(--t-fast), transform var(--t-fast);
}
.cmd__copy:hover { background: rgba(255,255,255,.20); transform: translateY(-1px); }
.cmd__copy:active { transform: translateY(0); }
.cmd__copy-face { display: inline-flex; align-items: center; gap: 6px; }
.cmd__copy-done { display: none; }
.cmd.is-copied .cmd__copy-idle { display: none; }
.cmd.is-copied .cmd__copy-done { display: inline-flex; }
.cmd.is-copied .cmd__copy { color: var(--neon-cyan); border-color: rgba(0,224,255,.55); background: rgba(0,224,255,.14); }
.cmd__note { margin-top: 10px; font-size: .9rem; color: var(--color-muted); }

/* Passos como caminho */
.steps {
  list-style: none; margin-top: var(--space-3xl);
  display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(20px, 3vw, 34px); position: relative;
}
.step { position: relative; display: flex; flex-direction: column; gap: 8px; }
.step + .step::before {
  content: ""; position: absolute; top: 24px; left: calc(-1 * clamp(20px, 3vw, 34px) / 2 - 1px);
  width: clamp(20px, 3vw, 34px); height: 2px;
  background: linear-gradient(90deg, var(--neon-blue), var(--neon-violet)); opacity: .5;
}
.step__num {
  display: inline-flex; align-items: center; justify-content: center;
  width: 48px; height: 48px; border-radius: var(--radius-full);
  font-family: var(--font-mono); font-weight: 700; font-size: 1.25rem; color: transparent;
  background: var(--b-grad); background-size: 220% 100%;
  -webkit-background-clip: text; background-clip: text;
  box-shadow: inset 0 0 0 1.5px var(--color-border);
}
.step__title { margin-top: 6px; font-size: 1.12rem; font-weight: 600; letter-spacing: -.01em; }
.step__desc { color: var(--gray-700); font-size: .98rem; }
.step__viz {
  margin-top: auto; padding: 12px 14px; border-radius: var(--radius-md);
  border: 1px solid var(--color-border); background: var(--color-card);
  font-family: var(--font-mono); font-size: .82rem; box-shadow: var(--shadow-sm);
}
.step__viz--term { background: var(--ink); color: var(--gray-200); white-space: nowrap; overflow: hidden; }
.term__prompt { color: var(--neon-cyan); font-weight: 600; }
.term__cursor {
  display: inline-block; width: 7px; height: 1em; margin-left: 3px;
  background: var(--neon-cyan); vertical-align: -2px; animation: blink 1.1s steps(1) infinite;
}
@keyframes blink { 50% { opacity: 0; } }
.step__viz--device { display: flex; flex-direction: column; gap: 6px; }
.device__url { color: var(--color-muted); font-size: .76rem; }
.device__code {
  font-size: 1.15rem; font-weight: 700; letter-spacing: .18em;
  background: var(--neon-grad); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.step__viz--profile { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.profile-pill { padding: 3px 12px; border-radius: var(--radius-full); background: var(--color-surface); color: var(--gray-700); font-weight: 600; }
.profile-score {
  font-weight: 700; font-size: 1.1rem; font-variant-numeric: tabular-nums;
  background: var(--b-grad); -webkit-background-clip: text; background-clip: text; color: transparent;
}

/* Garantias */
.assure { list-style: none; display: flex; flex-wrap: wrap; gap: 10px; margin-top: var(--space-2xl); }
.assure__chip {
  display: inline-flex; align-items: center; gap: 8px; padding: 8px 16px; border-radius: var(--radius-full);
  background: var(--color-card); border: 1px solid var(--color-border);
  font-size: .9rem; font-weight: 500; color: var(--gray-700);
}
.assure__dot { width: 7px; height: 7px; border-radius: 50%; background: var(--neon-cyan); box-shadow: 0 0 0 3px rgba(0,224,255,.22); }
.assure__chip:nth-child(2) .assure__dot { background: var(--neon-violet); box-shadow: 0 0 0 3px rgba(138,69,255,.22); }
.assure__chip:nth-child(3) .assure__dot { background: var(--neon-pink); box-shadow: 0 0 0 3px rgba(255,45,155,.22); }

/* Alternativa Claude Code */
.run-sec__alt {
  margin-top: var(--space-2xl); padding-top: var(--space-lg);
  border-top: 1px solid var(--color-border); color: var(--gray-700); font-size: .98rem;
}
.run-sec__alt code {
  font-family: var(--font-mono); font-size: .9em; padding: 2px 8px; border-radius: var(--radius-sm);
  background: var(--color-surface); color: var(--accent-text); font-weight: 600;
}

/* ---------- Perfil ---------- */
.profile__grid {
  display: grid; gap: var(--space-2xl);
  grid-template-columns: 1fr 1fr;
  grid-template-areas:
    "head   head"
    "score  radar"
    "pillars stats"
    "share  share";
  padding-block: var(--space-3xl);
}
.profile__head { grid-area: head; text-align: center; }
.profile__ident { display: inline-flex; align-items: center; gap: 12px; }
.avatar { border-radius: var(--radius-full); border: 2px solid var(--color-border); }
.avatar--xs { width: 24px; height: 24px; border-width: 1px; }
.profile__handle { font-size: 1.4rem; font-weight: 700; letter-spacing: -.01em; }
.verified { color: var(--accent-text); font-size: .9em; }
.profile__name { color: var(--color-muted); font-size: .95rem; text-align: left; }
.archetype-headline { margin-top: var(--space-md); font-size: clamp(1.8rem, 5vw, 3rem); font-weight: 700; letter-spacing: -.03em; background: var(--neon-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.archetype-tagline { margin-top: 8px; color: var(--gray-700); font-size: 1.1rem; }

.profile__score { grid-area: score; align-self: center; text-align: center; }
.score-row { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: var(--space-md); }
.percentile { font-family: var(--font-mono); font-weight: 600; color: var(--color-muted); }
.profile__radar { grid-area: radar; display: flex; justify-content: center; align-items: center; }

.profile__pillars { grid-area: pillars; }
.pillar-bars { list-style: none; display: grid; gap: 14px; }
.pbar { display: grid; grid-template-columns: 8.5em 1fr auto; align-items: center; gap: 12px; }
.pbar__name { font-size: .92rem; font-weight: 500; color: var(--gray-700); }
.pbar__track { height: 8px; border-radius: var(--radius-full); background: var(--color-surface); overflow: hidden; }
.pbar__fill { display: block; height: 100%; border-radius: var(--radius-full); background: var(--neon-grad); transition: width var(--t-slow); }
.pbar__val { font-family: var(--font-mono); font-size: .85rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.pbar__cap { color: var(--color-faded); font-weight: 500; }

.profile__stats { grid-area: stats; }
.stat-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-md); }
.stat { background: var(--color-card); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--space-lg); text-align: center; }
.stat__v { display: block; font-family: var(--font-mono); font-size: 2rem; font-weight: 700; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.stat__k { display: block; margin-top: 4px; font-size: .78rem; letter-spacing: .06em; text-transform: uppercase; color: var(--color-faded); }

.profile__share { grid-area: share; text-align: center; padding-top: var(--space-md); border-top: 1px solid var(--color-border); }
.share-row { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; }
.profile__inspector { display: inline-block; margin-top: var(--space-lg); font-size: .9rem; color: var(--color-muted); }

/* ---------- Leaderboard ---------- */
.tabs { display: inline-flex; gap: 4px; padding: 4px; background: var(--color-surface); border-radius: var(--radius-full); margin-bottom: var(--space-md); }
.tab { padding: 8px 18px; border-radius: var(--radius-full); font-weight: 600; font-size: .9rem; color: var(--gray-700); }
.tab:hover { text-decoration: none; color: var(--ink); }
.tab.is-active { background: var(--color-card); color: var(--ink); box-shadow: var(--shadow-sm); }
.optin-note { color: var(--color-faded); font-size: .88rem; margin-bottom: var(--space-lg); }
.empty { color: var(--color-muted); padding-block: var(--space-2xl); text-align: center; }

.table-wrap { overflow-x: auto; border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-card); }
.board-table { width: 100%; border-collapse: collapse; min-width: 620px; }
.board-table th, .board-table td { padding: 14px 16px; text-align: left; }
.board-table thead th { font-family: var(--font-mono); font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; color: var(--color-faded); border-bottom: 1px solid var(--color-border); font-weight: 600; }
.board-table tbody tr + tr td { border-top: 1px solid var(--color-border); }
.board-table tbody tr:hover { background: color-mix(in srgb, var(--accent) 5%, transparent); }
.col-rank { width: 3em; }
.rank-num { font-family: var(--font-mono); font-weight: 700; color: var(--color-faded); }
.col-arch { width: 40px; }
.mini-hex { display: inline-flex; }
.user-cell { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; color: var(--ink); }
.user-cell:hover { text-decoration: none; color: var(--accent-text); }
.flag { font-size: .85rem; }
.col-score { font-family: var(--font-mono); font-weight: 700; font-variant-numeric: tabular-nums; }

/* ---------- Footer ---------- */
.foot { border-top: 1px solid var(--color-border); padding-block: var(--space-2xl); background: var(--color-surface); }
.foot__inner { display: grid; gap: 8px; text-align: center; }
.foot__brand { display: inline-flex; align-items: baseline; gap: 8px; justify-content: center; font-weight: 700; color: var(--ink); }
.foot__tag { font-family: var(--font-mono); font-size: .82rem; letter-spacing: .04em; color: var(--gray-700); }
.foot__meta { color: var(--color-muted); font-size: .85rem; max-width: 60ch; margin-inline: auto; }
.foot__copy { color: var(--color-faded); font-size: .8rem; }

/* ---------- Sheen neon (controller shimmer) ---------- */
[data-controller~="shimmer"] { position: relative; overflow: hidden; }
[data-controller~="shimmer"]::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 1;
  background: linear-gradient(115deg, transparent 42%, rgba(0,224,255,.10) 48%, rgba(138,69,255,.12) 52%, rgba(255,45,155,.08) 56%, transparent 62%);
  transform: translateX(-130%); opacity: 0;
}
[data-controller~="shimmer"].is-shimmering::after { animation: sheen 1.5s var(--ease-out) forwards; }
@keyframes sheen { 0% { transform: translateX(-130%); opacity: 0; } 18% { opacity: 1; } 100% { transform: translateX(130%); opacity: 0; } }

/* ---------- Responsivo ---------- */
@media (max-width: 860px) {
  .hero__grid { grid-template-columns: minmax(0, 1fr); }
  .hero__card { order: -1; }
  .pillar-grid { grid-template-columns: minmax(0, 1fr); }
  .steps { grid-template-columns: minmax(0, 1fr); gap: var(--space-lg); }
  .step + .step::before { display: none; }
  .profile__grid {
    grid-template-columns: 1fr;
    grid-template-areas: "head" "score" "radar" "pillars" "stats" "share";
  }
  .mini-row { grid-template-columns: 2em 40px 1fr auto; row-gap: 4px; }
  .mini-row__arch, .mini-row__score { grid-column: 3 / -1; }
}
@media (max-width: 560px) {
  .faceoff { grid-template-columns: 1fr; }
  .faceoff__vs { justify-self: center; }
}
/* Leaderboard no celular: a NOTA é o conteúdo — some com hexágono e nome do
   arquétipo (ambos vivem no perfil) pra rank/regente/nota/grade caberem sem
   precisar arrastar a tabela de lado. */
@media (max-width: 620px) {
  .board-table { min-width: 0; }
  .board-table th, .board-table td { padding: 12px 8px; font-size: .92rem; }
  .col-arch, .col-arch-name { display: none; }
  .user-cell__handle { overflow-wrap: anywhere; }
  .tabs, .boards { flex-wrap: wrap; }
}
@media (max-width: 520px) {
  body { font-size: 16px; }
  .stat-grid { grid-template-columns: 1fr 1fr; }
  .pbar { grid-template-columns: 6.5em 1fr auto; }
  .cmd { flex-wrap: wrap; }
  .cmd__code { flex-basis: 100%; order: 3; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  .brand__b { animation: none; background-position: 0% 0%; }
  [data-controller~="shimmer"]::after { display: none; }
  .hero::before, .hero__card::before, .term__cursor { animation: none; }
}

/* Profile pending / empty / not-found states */
.state { padding: clamp(4.5rem, 14vh, 9rem) 0; text-align: center; }
.state__inner { display: flex; flex-direction: column; align-items: center; gap: 0.85rem; }
.state__title { margin: 0; font-size: clamp(1.9rem, 4.2vw, 2.7rem); letter-spacing: -0.02em; }
.state__body { margin: 0; max-width: 44ch; color: var(--gray-700); font-size: 1.1rem; line-height: 1.55; }
.state__cta { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin-top: 1.25rem; }

/* ===== PROFILE (recruiter-grade) ===== */
/* =====================================================================
   PERFIL X-RAY (v2, recruiter-grade) — bloco APENDADO.
   Só classes .xray__* + o tema escuro do site (tokens). Nada acima muda.
   ===================================================================== */

.xray { padding-block: var(--space-2xl) var(--space-3xl); }
/* minmax(0,…): sem isso o mínimo automático da faixa é o min-content do MAIOR
   filho, e uma tabela/código largo estica TODAS as seções do perfil pra fora da tela. */
.xray__wrap { display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(48px, 8vw, 88px); }

/* cabeçalhos de seção */
.xray__shead { max-width: 640px; }
.xray__h { font-size: clamp(1.35rem, 2.8vw, 1.9rem); font-weight: 700; letter-spacing: -.02em; }
.xray__sub { margin-top: 6px; color: var(--color-muted); font-size: .98rem; }

/* 1 · masthead: identidade + tese + score */
.xray__mast { display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(28px, 5vw, 64px); align-items: center; }
.xray__id { display: flex; align-items: center; gap: 16px; }
.xray__avatar { width: 72px; height: 72px; border-radius: var(--radius-full); border: 2px solid var(--color-border); }
.xray__handle { font-size: 1.5rem; font-weight: 700; letter-spacing: -.01em; }
.xray__name { color: var(--color-muted); font-size: .95rem; }
.xray__arch {
  margin-top: var(--space-lg); font-size: clamp(1.8rem, 4.4vw, 2.8rem); font-weight: 700;
  letter-spacing: -.03em; line-height: 1.08;
  background: var(--neon-grad); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.xray__tagline { margin-top: 6px; font-size: 1.08rem; color: var(--gray-700); }
.xray__thesis {
  margin-top: var(--space-lg); padding-left: 14px; border-left: 3px solid var(--color-border);
  color: var(--gray-700); font-size: 1.02rem; max-width: 58ch;
}
.xray__scorecard {
  position: relative; overflow: hidden; text-align: center;
  background: var(--color-card); border: 1px solid var(--color-border);
  border-radius: var(--radius-xl); padding: var(--space-xl); box-shadow: var(--shadow-lg);
}
.xray__scorecard::before {
  content: ""; position: absolute; inset: 0 0 auto 0; height: 3px;
  background: var(--b-grad); background-size: 200% 100%;
  animation: bshift 7s var(--ease-inout) infinite;
}

/* 2 · a frota (o destaque forte da página — banda escura constante nos 2 temas) */
:root {
  --xr-band-bg: #191714;
  --xr-band-ink: #fffefb;
  --xr-band-muted: rgba(255, 254, 251, .62);
  --xr-band-line: rgba(255, 254, 251, .16);
}
.xray__fleet {
  position: relative; overflow: hidden;
  background: var(--xr-band-bg); color: var(--xr-band-ink);
  border-radius: var(--radius-xl); padding: clamp(28px, 5vw, 56px); box-shadow: var(--shadow-lg);
}
.xray__fleet::before {
  content: ""; position: absolute; top: -30%; right: -10%; width: min(560px, 70%); aspect-ratio: 1;
  background: radial-gradient(circle at 50% 50%, rgba(77,124,255,.28), rgba(138,69,255,.16) 45%, rgba(255,45,155,.08) 62%, transparent 72%);
  pointer-events: none; animation: aurora 16s var(--ease-inout) infinite alternate;
}
.xray__fleet-eyebrow {
  position: relative; font-family: var(--font-mono); font-size: .74rem; font-weight: 600;
  letter-spacing: .16em; text-transform: uppercase; color: var(--neon-cyan); margin-bottom: 14px;
}
.xray__fleet-row { position: relative; display: flex; flex-wrap: wrap; align-items: flex-end; gap: clamp(24px, 4vw, 56px); }
.xray__fleet-num {
  display: block; font-weight: 700; font-size: clamp(3.6rem, 11vw, 7.5rem); line-height: .95;
  letter-spacing: -.04em; font-variant-numeric: tabular-nums;
  background: var(--neon-grad); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.xray__fleet-label { display: block; margin-top: 10px; font-size: 1.05rem; font-weight: 500; }
.xray__fleet-side { display: flex; gap: clamp(20px, 3vw, 40px); padding-left: clamp(20px, 3vw, 40px); border-left: 1px solid var(--xr-band-line); }
.xray__fleet-subv { display: block; font-family: var(--font-mono); font-size: clamp(1.5rem, 3vw, 2.1rem); font-weight: 700; font-variant-numeric: tabular-nums; }
.xray__fleet-subk { display: block; margin-top: 2px; font-size: .82rem; color: var(--xr-band-muted); max-width: 13ch; }
.xray__fleet-astr { color: var(--neon-cyan); font-weight: 700; }
.xray__fleet-note { position: relative; margin-top: var(--space-lg); font-size: .85rem; color: var(--xr-band-muted); max-width: 64ch; }

/* 3 · radar + pilares com evidência */
.xray__analysis { display: grid; grid-template-columns: minmax(280px, 400px) 1fr; gap: clamp(28px, 5vw, 72px); align-items: center; }
.xray__radar { display: flex; justify-content: center; }
.xray__pillars { list-style: none; padding: 0; margin-top: var(--space-lg); display: grid; gap: 18px; }
.xray__pillar-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.xray__pillar-name { font-weight: 600; font-size: .98rem; }
.xray__pillar-val { font-family: var(--font-mono); font-size: .88rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.xray__pillar-cap { color: var(--color-faded); font-weight: 500; }
.xray__pillar .pbar__track { display: block; margin-top: 7px; }
.xray__pillar-why { margin-top: 6px; font-size: .85rem; color: var(--color-muted); }

/* 4 · estatísticas de assinatura */
.xray__statgrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-md); margin-top: var(--space-lg); }
.xray__stat {
  background: var(--color-card); border: 1px solid var(--color-border);
  border-radius: var(--radius-lg); padding: 18px 16px 16px;
  transition: border-color var(--t-fast), transform var(--t-fast);
}
.xray__stat:hover { border-color: var(--accent); transform: translateY(-1px); }
.xray__stat-v { display: block; font-family: var(--font-mono); font-size: 1.55rem; font-weight: 700; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.xray__stat-k { display: block; margin-top: 4px; font-size: .84rem; font-weight: 500; color: var(--color-muted); line-height: 1.35; }
.xray__stat-hint { display: block; margin-top: 4px; font-family: var(--font-mono); font-size: .7rem; color: var(--color-faded); }

/* 5 · deep-dive do arquétipo */
.xray__archcard {
  margin-top: var(--space-lg); display: grid; grid-template-columns: 1.25fr .75fr;
  gap: clamp(24px, 4vw, 56px);
  background: var(--color-card); border: 1px solid var(--color-border);
  border-radius: var(--radius-xl); padding: clamp(24px, 4vw, 44px);
}
.xray__archmeaning { font-size: 1.12rem; }
.xray__archsub {
  margin-top: var(--space-lg); font-family: var(--font-mono); font-size: .74rem; font-weight: 600;
  letter-spacing: .14em; text-transform: uppercase; color: var(--color-faded);
}
.xray__archside .xray__archsub { margin-top: 0; }
.xray__archhow { margin-top: 8px; color: var(--gray-700); font-size: .98rem; }
.xray__strengths { list-style: none; padding: 0; margin-top: 10px; display: grid; gap: 10px; }
.xray__strengths li { position: relative; padding-left: 20px; font-size: .95rem; font-weight: 500; color: var(--gray-700); }
.xray__strengths li::before { content: ""; position: absolute; left: 0; top: .48em; width: 8px; height: 8px; border-radius: 50%; background: var(--neon-grad); }

/* 6 · ecossistema de ferramentas */
.xray__ecocard {
  margin-top: var(--space-lg); display: grid; grid-template-columns: auto 1fr;
  gap: clamp(24px, 4vw, 56px); align-items: center;
  background: var(--color-surface); border: 1px solid var(--color-border);
  border-radius: var(--radius-xl); padding: clamp(24px, 4vw, 44px);
}
.xray__econums { display: flex; gap: clamp(24px, 3vw, 44px); }
.xray__econum-v {
  display: block; font-family: var(--font-mono); font-size: clamp(1.9rem, 4vw, 2.6rem); font-weight: 700;
  font-variant-numeric: tabular-nums;
  background: var(--neon-grad); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.xray__econum-k { display: block; margin-top: 2px; font-size: .82rem; color: var(--color-muted); max-width: 12ch; }
.xray__ecobody { color: var(--gray-700); font-size: .98rem; max-width: 52ch; }

/* 7 · leitura pra recrutador */
.xray__reads { margin-top: var(--space-lg); display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-md); }
.xray__read {
  position: relative; overflow: hidden;
  background: var(--color-card); border: 1px solid var(--color-border);
  border-radius: var(--radius-lg); padding: var(--space-lg);
}
.xray__read::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--neon-grad); opacity: .85; }
.xray__read-t { font-size: 1.02rem; font-weight: 600; letter-spacing: -.01em; }
.xray__read-b { margin-top: 6px; font-size: .93rem; color: var(--color-muted); }

/* 8 · rodapé do perfil */
.xray__foot { text-align: center; padding-top: var(--space-xl); border-top: 1px solid var(--color-border); }
.xray__method { margin-top: var(--space-lg); font-size: .85rem; color: var(--color-faded); max-width: 56ch; margin-inline: auto; }

/* responsivo */
@media (max-width: 960px) {
  .xray__mast { grid-template-columns: 1fr; }
  .xray__analysis { grid-template-columns: 1fr; }
  .xray__statgrid { grid-template-columns: repeat(2, 1fr); }
  .xray__archcard, .xray__ecocard { grid-template-columns: 1fr; }
  .xray__reads { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .xray__fleet-side { flex-wrap: wrap; border-left: 0; padding-left: 0; width: 100%; border-top: 1px solid var(--xr-band-line); padding-top: var(--space-md); }
  .xray__econums { flex-wrap: wrap; }
}

/* movimento reduzido */
@media (prefers-reduced-motion: reduce) {
  .xray__scorecard::before, .xray__fleet::before { animation: none; }
  .xray__stat, .xray__stat:hover { transform: none; transition: none; }
}

/* =====================================================================
   TEMA ESCURO — bege quente vira "estúdio apagado" (mesma marca, LED aceso).
   Respeita o SO (prefers-color-scheme) e um toggle explícito via
   :root[data-theme="dark"] / :root[data-theme="light"] (o data-theme vence).
   Só re-mapeia tokens — todos os componentes (deste bloco e os antigos)
   herdam. --led-base clareia pra fita de LED (--b-grad) ler no escuro.
   ===================================================================== */
:root[data-theme="dark"] {
  --paper:  #171512;
  --white:  #201d18;
  --ink:    #f0ede3;
  --gray-700: #c9c3b5;
  --gray-500: #a29b8d;
  --gray-400: #8a8375;
  --gray-200: #3a352c;
  --gray-100: #26221c;
  --led-base: #e8e5db;
  --accent-text: #7aa5ff;
  --tier-verde: #35c46b; --tier-amarelo: #e6b41e; --tier-vermelho: #ff6b70;
  --shadow-sm: 0 1px 2px rgba(0,0,0,.35), 0 8px 22px rgba(0,0,0,.25);
  --shadow-md: 0 8px 30px rgba(0,0,0,.40);
  --shadow-lg: 0 18px 48px rgba(0,0,0,.50);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --paper:  #171512;
    --white:  #201d18;
    --ink:    #f0ede3;
    --gray-700: #c9c3b5;
    --gray-500: #a29b8d;
    --gray-400: #8a8375;
    --gray-200: #3a352c;
    --gray-100: #26221c;
    --led-base: #e8e5db;
    --accent-text: #7aa5ff;
    --tier-verde: #35c46b; --tier-amarelo: #e6b41e; --tier-vermelho: #ff6b70;
    --shadow-sm: 0 1px 2px rgba(0,0,0,.35), 0 8px 22px rgba(0,0,0,.25);
    --shadow-md: 0 8px 30px rgba(0,0,0,.40);
    --shadow-lg: 0 18px 48px rgba(0,0,0,.50);
  }
}

/* ===== INSPECTOR (X-ray / transparency) ===== */

/* =====================================================================
   X-RAY — /u/:handle/inspector (página de transparência)
   Bloco APENDÁVEL. Tudo escopado em .xray / .xray__* — zero colisão.
   Tema claro E escuro via variáveis locais --x-* :
   prefers-color-scheme como sinal default + :root[data-theme] vencendo
   nas duas direções. Motion respeita o bloco global de reduced-motion.
   ===================================================================== */

.xray {
  --x-bg: var(--paper);
  --x-card: var(--white);
  --x-surface: var(--gray-100);
  --x-border: var(--gray-200);
  --x-ink: var(--ink);
  --x-soft: var(--gray-700);
  --x-muted: var(--gray-500);
  --x-faded: var(--gray-400);
  --x-link: var(--accent-text);
  --x-chip-bg: rgba(45, 130, 255, .10);
  background: var(--x-bg);
  color: var(--x-ink);
  padding-block: var(--space-3xl);
}
@media (prefers-color-scheme: dark) {
  .xray {
    --x-bg: #14120f;
    --x-card: #1e1b17;
    --x-surface: #26221c;
    --x-border: #38322a;
    --x-ink: #f1eee5;
    --x-soft: #cfc9bb;
    --x-muted: #a49d8f;
    --x-faded: #8a8375;
    --x-link: #8fb0ff;
    --x-chip-bg: rgba(77, 124, 255, .18);
  }
}
:root[data-theme="light"] .xray {
  --x-bg: var(--paper);
  --x-card: var(--white);
  --x-surface: var(--gray-100);
  --x-border: var(--gray-200);
  --x-ink: var(--ink);
  --x-soft: var(--gray-700);
  --x-muted: var(--gray-500);
  --x-faded: var(--gray-400);
  --x-link: var(--accent-text);
  --x-chip-bg: rgba(45, 130, 255, .10);
}
:root[data-theme="dark"] .xray {
  --x-bg: #14120f;
  --x-card: #1e1b17;
  --x-surface: #26221c;
  --x-border: #38322a;
  --x-ink: #f1eee5;
  --x-soft: #cfc9bb;
  --x-muted: #a49d8f;
  --x-faded: #8a8375;
  --x-link: #8fb0ff;
  --x-chip-bg: rgba(77, 124, 255, .18);
}

/* Overrides mínimos de componentes globais DENTRO do escopo .xray (tema) */
.xray a { color: var(--x-link); }
.xray .eyebrow { color: var(--x-faded); }
.xray .block-title { color: var(--x-ink); }
.xray .grade { background: var(--x-card); }

.xray__wrap { display: grid; gap: var(--space-3xl); }

/* ---------- Cabeçalho ---------- */
.xray__head { max-width: 760px; }
.xray__title { font-size: clamp(1.9rem, 4.6vw, 3rem); font-weight: 700; letter-spacing: -.03em; line-height: 1.06; }
.xray__lede { margin-top: var(--space-md); color: var(--x-soft); font-size: 1.08rem; max-width: 62ch; }
.xray__meta { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-top: var(--space-lg); }
.xray__back { font-weight: 600; font-size: .95rem; }
.xray__scorenum {
  font-family: var(--font-mono); font-weight: 700; font-size: 1.15rem; letter-spacing: -.02em;
  font-variant-numeric: tabular-nums;
  background: var(--b-grad); background-size: 220% 100%;
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.xray__pill {
  display: inline-flex; align-items: center; padding: 3px 12px; border-radius: var(--radius-full);
  background: var(--x-surface); border: 1px solid var(--x-border);
  color: var(--x-muted); font-size: .8rem; font-weight: 500;
}
.xray__pill--mono { font-family: var(--font-mono); font-size: .74rem; letter-spacing: .04em; }

.xray__sub { color: var(--x-muted); font-size: .98rem; max-width: 68ch; margin-bottom: var(--space-lg); }

/* ---------- Manifesto de privacidade ---------- */
.xray__pgrid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-md); }
.xray__pcard {
  position: relative; overflow: hidden;
  background: var(--x-card); border: 1px solid var(--x-border);
  border-radius: var(--radius-lg); padding: var(--space-lg) var(--space-lg) var(--space-md);
  box-shadow: var(--shadow-md);
}
.xray__pcard::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 3px; }
.xray__pcard--never::before { background: linear-gradient(90deg, var(--neon-magenta), var(--neon-pink)); }
.xray__pcard--sent::before  { background: linear-gradient(90deg, var(--neon-cyan), var(--neon-blue)); }
.xray__pcard-title { font-size: 1rem; font-weight: 700; letter-spacing: -.01em; margin-bottom: var(--space-md); }
.xray__plist { list-style: none; padding: 0; display: grid; gap: 10px; }
.xray__plist li {
  position: relative; padding-left: 22px;
  color: var(--x-soft); font-size: .95rem; line-height: 1.45;
}
.xray__plist li::before {
  content: ""; position: absolute; left: 4px; top: .52em;
  width: 7px; height: 7px; border-radius: 50%;
}
.xray__plist--never li::before { background: var(--neon-pink); box-shadow: 0 0 0 3px rgba(255, 45, 155, .18); }
.xray__plist--sent li::before  { background: var(--neon-cyan); box-shadow: 0 0 0 3px rgba(0, 224, 255, .18); }

/* ---------- A frota, em números ---------- */
.xray__stats { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: var(--space-md); align-items: stretch; }
.xray__stat {
  display: flex; flex-direction: column; gap: 4px;
  background: var(--x-card); border: 1px solid var(--x-border);
  border-radius: var(--radius-lg); padding: var(--space-lg);
}
.xray__stat--hero { position: relative; overflow: hidden; box-shadow: var(--shadow-md); }
.xray__stat--hero::before {
  content: ""; position: absolute; inset: 0 0 auto 0; height: 3px;
  background: var(--b-grad); background-size: 200% 100%;
  animation: bshift 7s var(--ease-inout) infinite;
}
.xray__stat-v {
  font-family: var(--font-mono); font-weight: 700; font-size: 2rem;
  letter-spacing: -.02em; font-variant-numeric: tabular-nums; line-height: 1.1;
}
.xray__stat-v--led {
  font-size: clamp(2.6rem, 6vw, 3.6rem);
  background: var(--b-grad); background-size: 220% 100%;
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.xray__stat-k { font-size: .78rem; letter-spacing: .06em; text-transform: uppercase; color: var(--x-faded); font-weight: 600; }
.xray__stat-hint { margin-top: 4px; font-size: .82rem; color: var(--x-muted); line-height: 1.4; }

/* ---------- Como a nota foi calculada ---------- */
.xray__pillars { display: grid; gap: var(--space-lg); }
.xray__pillar {
  background: var(--x-card); border: 1px solid var(--x-border);
  border-radius: var(--radius-xl); padding: var(--space-xl);
}
.xray__pillar-head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-md); flex-wrap: wrap; }
.xray__pillar-name { font-size: 1.2rem; font-weight: 700; letter-spacing: -.02em; }
.xray__pillar-pts { font-family: var(--font-mono); font-weight: 700; font-size: .95rem; color: var(--x-soft); font-variant-numeric: tabular-nums; }
.xray__pillar-track { display: block; height: 7px; border-radius: var(--radius-full); background: var(--x-surface); overflow: hidden; margin-top: 12px; }
.xray__pillar-fill { display: block; height: 100%; border-radius: var(--radius-full); background: var(--neon-grad); transition: width var(--t-slow); }
.xray__craftnote { margin-top: var(--space-md); font-size: .9rem; color: var(--x-muted); }

.xray__terms { list-style: none; padding: 0; margin-top: var(--space-md); }
.xray__term {
  display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) auto;
  gap: var(--space-lg); align-items: start;
  padding-block: var(--space-md); border-top: 1px solid var(--x-border);
}
.xray__term:first-child { border-top: 0; }
.xray__term-name { font-weight: 600; font-size: .98rem; letter-spacing: -.01em; }
.xray__term-how { margin-top: 3px; font-size: .88rem; color: var(--x-muted); line-height: 1.45; }
.xray__flag {
  margin-top: 8px; padding: 8px 12px; border-left: 3px solid var(--neon-violet);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  background: var(--x-surface); color: var(--x-soft); font-size: .82rem; line-height: 1.45;
}
.xray__term-io { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.xray__chips { display: flex; flex-wrap: wrap; gap: 6px; }
.xray__chip {
  display: inline-flex; align-items: center; gap: 4px;
  font-family: var(--font-mono); font-size: .76rem; font-weight: 500;
  padding: 2px 10px; border-radius: var(--radius-full);
  background: var(--x-chip-bg); color: var(--x-link);
  font-variant-numeric: tabular-nums; cursor: help;
}
.xray__chip b { font-weight: 700; }
.xray__formula {
  display: block; font-family: var(--font-mono); font-size: .78rem; color: var(--x-soft);
  background: var(--x-surface); border: 1px solid var(--x-border);
  padding: 6px 10px; border-radius: var(--radius-sm);
  white-space: nowrap; overflow-x: auto; scrollbar-width: none;
}
.xray__formula::-webkit-scrollbar { display: none; }
.xray__term-pts {
  font-family: var(--font-mono); font-weight: 700; font-size: 1.05rem;
  font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap;
  color: var(--x-ink);
}
.xray__term-pts em { display: block; font-style: normal; font-weight: 500; font-size: .72rem; color: var(--x-faded); }
.xray__term-pts--pen { color: var(--tier-vermelho); }

/* ---------- Sinais agregados ---------- */
.xray__siggrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: var(--space-md); }
.xray__sig {
  display: flex; flex-direction: column; align-items: center; gap: 2px; text-align: center;
  background: var(--x-card); border: 1px solid var(--x-border);
  border-radius: var(--radius-md); padding: var(--space-md);
}
.xray__sig-v { font-family: var(--font-mono); font-weight: 700; font-size: 1.5rem; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.xray__sig-k { font-size: .72rem; letter-spacing: .05em; text-transform: uppercase; color: var(--x-faded); font-weight: 600; line-height: 1.35; }
.xray__badge {
  margin-top: 6px; font-family: var(--font-mono); font-size: .62rem; font-weight: 600;
  letter-spacing: .08em; text-transform: uppercase;
  padding: 2px 8px; border-radius: var(--radius-full);
  background: var(--x-surface); border: 1px solid var(--x-border); color: var(--x-muted);
}

/* ---------- Amostra por-sessão ---------- */
.xray__tablewrap { overflow-x: auto; border: 1px solid var(--x-border); border-radius: var(--radius-lg); background: var(--x-card); }
.xray__table { width: 100%; border-collapse: collapse; min-width: 560px; }
.xray__table th, .xray__table td { padding: 11px 14px; text-align: left; font-size: .88rem; }
.xray__table thead th {
  font-family: var(--font-mono); font-size: .68rem; letter-spacing: .08em; text-transform: uppercase;
  color: var(--x-faded); border-bottom: 1px solid var(--x-border); font-weight: 600;
}
.xray__table tbody tr + tr td { border-top: 1px solid var(--x-border); }
.xray__mono { font-family: var(--font-mono); font-size: .8rem; color: var(--x-soft); white-space: nowrap; }
.xray__num { text-align: right; font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
th.xray__num { text-align: right; }
.xray__more { margin-top: 10px; font-size: .85rem; color: var(--x-muted); }
.xray__empty { color: var(--x-muted); padding-block: var(--space-lg); }

/* ---------- Download do JSON cru ---------- */
.xray__dl {
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-lg); flex-wrap: wrap;
  background: var(--ink); color: var(--paper);
  border: 1px solid rgba(77, 124, 255, .30);
  border-radius: var(--radius-xl); padding: var(--space-xl); box-shadow: var(--shadow-lg);
}
.xray__dl-txt { max-width: 56ch; }
.xray__dl-title { font-size: 1.25rem; font-weight: 700; letter-spacing: -.02em; color: var(--paper); }
.xray__dl-body { margin-top: 6px; color: var(--gray-200); font-size: .95rem; }
.xray__dl-btn { background: var(--paper); color: var(--ink); border: 1px solid transparent; }
.xray__dl-btn:hover { background: var(--white); box-shadow: 0 0 0 3px rgba(0, 224, 255, .25); }
.xray__footnote { margin-top: var(--space-md); text-align: center; font-size: .85rem; color: var(--x-faded); max-width: 70ch; margin-inline: auto; }

/* ---------- Responsivo ---------- */
@media (max-width: 900px) {
  .xray__stats { grid-template-columns: 1fr 1fr; }
  .xray__stat--hero { grid-column: 1 / -1; }
}
@media (max-width: 860px) {
  .xray__pgrid { grid-template-columns: 1fr; }
  .xray__term { grid-template-columns: 1fr; gap: var(--space-sm); }
  .xray__term-pts { text-align: left; }
  .xray__term-pts em { display: inline; margin-left: 6px; }
}
@media (max-width: 520px) {
  .xray__pillar { padding: var(--space-lg); }
  .xray__siggrid { grid-template-columns: repeat(auto-fill, minmax(124px, 1fr)); }
  .xray__dl { padding: var(--space-lg); }
}

/* ---------- Reduced motion (redundância local ao bloco global) ---------- */
@media (prefers-reduced-motion: reduce) {
  .xray__stat--hero::before { animation: none; }
  .xray__pillar-fill { transition: none; }
}

/* ===== Leaderboard: anonymous (blurred) row ===== */
.user-cell--anon { display: inline-flex; align-items: center; gap: 8px; cursor: default; }
.avatar--anon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 24px; height: 24px; border-radius: 50%;
  background: var(--gray-200, #e7e3d8); font-size: 12px; line-height: 1;
  filter: saturate(0.6);
}
.user-cell__handle--redacted {
  font-family: var(--font-mono, monospace); letter-spacing: 0.02em;
  color: var(--gray-500, #8a857a);
  padding: 1px 7px; border-radius: var(--radius-full, 999px);
  background: repeating-linear-gradient(90deg,
    color-mix(in srgb, var(--ink) 9%, transparent) 0 6px,
    transparent 6px 10px);
  filter: blur(0.35px);
}
@media (prefers-color-scheme: dark) {
  .user-cell__handle--redacted { color: var(--gray-400, #b8b2a6); }
}

/* ===== Nav: language switcher + contact ===== */
.nav__contact { opacity: 0.85; }
.nav__contact:hover { opacity: 1; }
.langsw { display: inline-flex; align-items: center; gap: 6px; font-size: 0.85rem; font-weight: 600; }
.langsw a { padding: 2px 5px; border-radius: var(--radius-sm, 6px); color: var(--gray-500, #8a857a); text-decoration: none; transition: color 120ms var(--ease-out, ease); }
.langsw a:hover { color: var(--ink); }
.langsw a[aria-current="true"] { color: var(--ink); background: color-mix(in srgb, var(--ink) 8%, transparent); }
.langsw__sep { color: var(--gray-400, #b8b2a6); }
.foot__contact { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
/* Sem override de tema escuro aqui: os tokens já se remapeiam (--ink clareia,
   --paper escurece). O bloco antigo pintava o idioma ATIVO de var(--paper) —
   ou seja, escuro sobre escuro: o "EN" sumia no dark mode. */


/* ---- per-harness capability disclosure (profile) ---- */
.xray__harnesses { margin-top: 40px; }
.hcap { margin-top: 20px; overflow-x: auto; }
.hcap__table { width: 100%; border-collapse: collapse; font-size: .92rem; min-width: 520px; }
.hcap__table th, .hcap__table td {
  padding: 10px 8px; text-align: center; border-bottom: 1px solid var(--color-border);
}
.hcap__hname, .hcap__name { text-align: left; }
.hcap__hcol { color: var(--color-faded); font-weight: 600; letter-spacing: .04em;
  text-transform: uppercase; font-size: .72rem; }
.hcap__name { font-weight: 700; color: var(--ink); white-space: nowrap; }
.hcap__cell { color: var(--color-muted); }
.hcap__lvl { display: inline-block; font-size: .78rem; margin-left: 6px; vertical-align: middle; }
.hcap__dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%;
  vertical-align: middle; background: var(--color-border); }
.hcap__dot--full    { background: #17c07f; box-shadow: 0 0 8px color-mix(in srgb, #17c07f 60%, transparent); }
.hcap__dot--partial { background: #e0a020; box-shadow: 0 0 8px color-mix(in srgb, #e0a020 55%, transparent); }
.hcap__dot--none    { background: color-mix(in srgb, var(--color-faded) 70%, transparent); box-shadow: none; }
.hcap__cell--full .hcap__lvl    { color: #0f9a63; }
.hcap__cell--partial .hcap__lvl { color: #b07d10; }
.hcap__cell--none .hcap__lvl    { color: var(--color-faded); }
.hcap__foot { margin-top: 14px; }

/* ================= AI working-style analysis ================= */
.ai { margin-top: 44px; }
.ai__badge { display: inline-block; margin-left: 8px; font-size: .68rem; font-weight: 600;
  letter-spacing: .04em; text-transform: uppercase; padding: 3px 8px; border-radius: 999px;
  background: color-mix(in srgb, var(--neon-cyan, #22d3ee) 16%, transparent);
  color: color-mix(in srgb, var(--neon-blue, #3b82f6) 88%, var(--ink)); vertical-align: middle; }
.ai__badge--det { background: color-mix(in srgb, var(--color-faded) 18%, transparent); color: var(--gray-700); }

.ai__mirror { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 22px; }
.ai__mcard { background: var(--color-card); border: 1px solid var(--color-border); border-radius: 16px;
  padding: 20px; }
.ai__mcard h3 { font-size: .74rem; letter-spacing: .08em; text-transform: uppercase; color: var(--color-faded);
  margin-bottom: 10px; }
.ai__mcard p { font-size: 1.02rem; line-height: 1.5; color: var(--color-text); }
.ai__mcard--edge { border-color: color-mix(in srgb, var(--neon-cyan, #22d3ee) 40%, var(--color-border)); }
.ai__mcard--frontier { border-color: color-mix(in srgb, #e0a020 45%, var(--color-border)); }

.ai__zones { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 20px; }
.ai__zone { border-radius: 14px; padding: 16px; border: 1px solid var(--color-border); background: color-mix(in srgb, var(--paper) 60%, transparent); }
.ai__zone-h { font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; margin-bottom: 12px; }
.ai__zone--mastery .ai__zone-h { color: #0f9a63; }
.ai__zone--competent .ai__zone-h { color: var(--gray-700); }
.ai__zone--blindspot .ai__zone-h { color: #b07d10; }
.ai__zone--mastery { border-color: color-mix(in srgb, #17c07f 35%, var(--color-border)); }
.ai__zone--blindspot { border-color: color-mix(in srgb, #e0a020 40%, var(--color-border)); }
.ai__zrow { margin-bottom: 12px; }
.ai__zpill { display: inline-block; font-weight: 700; font-size: .92rem; }
.ai__zline { display: block; font-size: .88rem; color: var(--color-muted); margin-top: 2px; }
.ai__cta { display: block; font-size: .82rem; color: color-mix(in srgb, var(--neon-blue, #3b82f6) 80%, var(--ink)); margin-top: 4px; }

.ai__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 20px; }
.ai__panel { border: 1px solid var(--color-border); border-radius: 16px; padding: 20px; background: var(--color-card); }
.ai__panel h3 { font-size: 1.05rem; margin-bottom: 10px; }
.ai__panel--blind { border-color: color-mix(in srgb, #e0a020 45%, var(--color-border)); }
.ai__panel p { line-height: 1.55; color: var(--color-text); }
.ai__sig { display: inline-block; margin-top: 12px; font-family: ui-monospace, monospace; font-size: .82rem;
  background: color-mix(in srgb, #e0a020 14%, transparent); color: #8a6410; padding: 3px 8px; border-radius: 6px; }
.ai__fitdom { font-size: 1rem; margin-bottom: 8px; }
.ai__fitlist { margin: 8px 0 0 0; padding-left: 18px; color: var(--color-muted); }
.ai__fitlist li { margin-bottom: 4px; }
.ai__fitrel { margin-top: 12px; font-size: .9rem; }
.ai__rel { font-weight: 700; }
.ai__rel--plus { color: #0f9a63; }
.ai__rel--minus { color: #b07d10; }

.ai__mission { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 20px;
  padding: 22px 24px; border-radius: 16px; background: var(--ink); color: var(--white);
  box-shadow: 0 0 40px color-mix(in srgb, var(--neon-violet, #8b5cf6) 22%, transparent); }
.ai__mission-eyebrow { font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; opacity: .7; margin-bottom: 6px; }
.ai__mission-text { font-size: 1.12rem; line-height: 1.45; font-weight: 500; }
.ai__mission-badge { display: flex; align-items: center; gap: 8px; white-space: nowrap; padding: 10px 16px;
  border-radius: 999px; background: color-mix(in srgb, var(--neon-violet, #8b5cf6) 30%, transparent); font-weight: 600; }
.ai__badge-icon { color: var(--neon-cyan, #22d3ee); }

@media (max-width: 760px) {
  .ai__mirror, .ai__zones, .ai__grid { grid-template-columns: 1fr; }
  .ai__mission { flex-direction: column; align-items: flex-start; }
}

/* ================= Recruiter — public profile ================= */
.rp-pub { margin: 24px 0 8px; padding: 24px; border: 1px solid var(--color-border); border-radius: 18px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--neon-cyan,#22d3ee) 6%, var(--color-card)), var(--color-card)); }
.rp-pub__headline { font-size: 1.35rem; line-height: 1.3; margin-bottom: 8px; }
.rp-pub__bio { color: var(--color-muted); line-height: 1.55; max-width: 60ch; }
.rp-pub__meta { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.rp-pub__chip { font-size: .82rem; padding: 4px 10px; border-radius: 999px; background: var(--paper); border: 1px solid var(--color-border); color: var(--gray-700); }
.rp-pub__chip--open { background: color-mix(in srgb, #17c07f 16%, transparent); color: #0f9a63; border-color: transparent; }
.rp-pub__stack { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.rp-pub__tag { font-size: .8rem; padding: 3px 9px; border-radius: 6px; background: var(--ink); color: var(--white); }
.rp-pub__links { display: flex; gap: 14px; margin-top: 14px; }
.rp-pub__link { font-weight: 600; text-transform: capitalize; }
.rp-pub__proof { margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--color-border); }
.rp-pub__proof-h { font-size: .74rem; text-transform: uppercase; letter-spacing: .07em; color: var(--color-faded); margin-bottom: 12px; }
.rp-pub__facts { display: flex; flex-wrap: wrap; gap: 12px; }
.rp-pub__fact { display: flex; flex-direction: column; padding: 12px 16px; border-radius: 12px; background: var(--paper);
  border: 1px solid var(--color-border); min-width: 130px; transition: border-color .15s; }
.rp-pub__fact:hover { border-color: var(--ink); text-decoration: none; }
.rp-pub__fact-v { font-size: 1.5rem; font-weight: 800; letter-spacing: -.02em; }
.rp-pub__fact-l { font-size: .78rem; color: var(--color-muted); margin-top: 2px; }
.rp-pub__verified { margin-top: 12px; font-size: .82rem; color: #0f9a63; }
.rp-pub__cta { display: inline-block; margin-top: 18px; padding: 13px 26px; border-radius: 999px;
  background: var(--ink); color: var(--white) !important; font-weight: 700; }
.rp-pub__cta:hover { text-decoration: none; box-shadow: 0 0 30px color-mix(in srgb, var(--neon-cyan,#22d3ee) 40%, transparent); }

/* ================= Recruiter — manage form ================= */
.rp { margin-top: 40px; padding-top: 28px; border-top: 1px solid var(--color-border); }
.rp__form { margin-top: 16px; }
.rp__input { width: 100%; max-width: 34rem; padding: .55rem .7rem; border: 1px solid var(--color-border);
  border-radius: 8px; font: inherit; background: var(--color-card); color: var(--color-text); }
.rp__input--sm { max-width: 16rem; }
.rp__row { display: flex; gap: 20px; flex-wrap: wrap; }
.rp__row > .field { flex: 1; min-width: 200px; }
.rp__links { display: flex; flex-wrap: wrap; gap: 8px; }
.rp__checks { display: flex; flex-wrap: wrap; gap: 12px; }
.rp__check { display: inline-flex; align-items: center; gap: 5px; font-size: .92rem; }
.rp__completeness { font-size: .82rem; padding: 2px 8px; border-radius: 999px; background: var(--paper); border: 1px solid var(--color-border); }
.rp__save { margin-top: 16px; padding: 12px 24px; border: none; border-radius: 999px; background: var(--ink);
  color: var(--white); font-weight: 700; cursor: pointer; }

/* ================= Score trajectory ================= */
.traj { display: flex; align-items: center; gap: 12px; margin-top: 14px; }
.traj .spark { display: block; }
.traj__badge { display: inline-flex; align-items: center; gap: 5px; font-weight: 700; font-size: .9rem;
  padding: 4px 10px; border-radius: 999px; }
.traj__badge--up { color: #0f9a63; background: color-mix(in srgb, #17c07f 15%, transparent); }
.traj__badge--down { color: #b07d10; background: color-mix(in srgb, #e0a020 15%, transparent); }
.traj__label { font-weight: 500; opacity: .8; font-size: .82rem; }

/* ============ Per-harness score cards (profile) ============ */
.hs { margin-top: 32px; }
.hs__grid { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 18px; }
.hs__card { flex: 1; min-width: 150px; max-width: 220px; padding: 18px; border-radius: 16px;
  border: 1px solid var(--color-border); background: var(--color-card); transition: border-color .15s, transform .15s; }
.hs__card:hover { border-color: var(--ink); transform: translateY(-2px); text-decoration: none; }
.hs__head { display: flex; align-items: center; justify-content: space-between; }
.hs__harness { font-weight: 700; font-size: .92rem; }
.hs__score { font-size: 2.2rem; font-weight: 800; letter-spacing: -.03em; margin-top: 8px; line-height: 1; }
.hs__arch { font-size: .84rem; color: var(--color-muted); margin-top: 4px; }
.hs__meta { display: flex; gap: 8px; align-items: center; margin-top: 10px; flex-wrap: wrap; }
.hs__rank { font-size: .8rem; font-weight: 700; color: #0f9a63; }
.hs__kappa { font-size: .74rem; color: var(--color-faded); font-family: ui-monospace, monospace;
  padding: 2px 6px; border-radius: 6px; background: var(--paper); }

/* ============ Leaderboard harness boards ============ */
.boards { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.board-pill { padding: 7px 16px; border-radius: 999px; border: 1px solid var(--color-border);
  font-weight: 600; font-size: .9rem; color: var(--gray-700); }
.board-pill.is-active { background: var(--ink); color: var(--white); border-color: var(--ink); }
.board-pill:hover { border-color: var(--ink); text-decoration: none; }
.board-note { font-size: .88rem; color: var(--color-muted); margin: 4px 0 16px; }

/* ================= Discoveries (traits/sub-archetype/badges) ================= */
.disc { margin-top: 32px; padding: 24px; border-radius: 18px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--neon-violet, #8b5cf6) 4%, var(--color-card)); }
.disc__sub { margin: 14px 0; }
.disc__sub-eyebrow { font-size: .72rem; text-transform: uppercase; letter-spacing: .07em; color: var(--color-faded); margin-right: 8px; }
.disc__sub-label { font-size: 1.15rem; font-weight: 700; }
.disc__traits { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0; }
.disc__trait { font-size: .84rem; font-weight: 600; padding: 5px 12px; border-radius: 999px;
  background: color-mix(in srgb, var(--neon-cyan,#22d3ee) 14%, transparent); color: color-mix(in srgb, var(--neon-blue,#3b82f6) 85%, var(--ink)); }
.disc__badges { display: flex; flex-wrap: wrap; gap: 10px; margin: 16px 0; }
.disc__badge { display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border-radius: 12px;
  font-weight: 600; font-size: .88rem; border: 1px solid var(--color-border); }
.disc__badge-icon { font-size: .8rem; }
.disc__badge--bronze { background: color-mix(in srgb, #cd7f32 16%, transparent); }
.disc__badge--bronze .disc__badge-icon { color: #cd7f32; }
.disc__badge--silver { background: color-mix(in srgb, #9ca3af 20%, transparent); }
.disc__badge--silver .disc__badge-icon { color: #6b7280; }
.disc__badge--gold { background: color-mix(in srgb, #e0a020 22%, transparent); }
.disc__badge--gold .disc__badge-icon { color: #d4920a; }
.disc__next { margin-top: 14px; }
.disc__next-h { font-size: .9rem; color: var(--color-muted); margin-bottom: 8px; }
.disc__next-crit { font-family: ui-monospace, monospace; font-size: .8rem; color: var(--color-faded); margin-left: 6px; }
.disc__bar { display: block; height: 8px; border-radius: 999px; background: var(--color-border); overflow: hidden; max-width: 340px; }
.disc__bar-fill { display: block; height: 100%; border-radius: 999px; background: var(--b-grad, #8b5cf6); }

/* ============ Home: supported harnesses row ============ */
.hero__harnesses { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 22px; }
.hero__harnesses-label { font-size: .82rem; color: var(--color-faded); font-weight: 600; }
.hero__hchip { font-size: .82rem; font-weight: 600; padding: 4px 11px; border-radius: 999px;
  background: var(--color-card); border: 1px solid var(--color-border); color: var(--gray-700); }
.hero__hchip--any { background: color-mix(in srgb, var(--neon-cyan,#22d3ee) 12%, transparent);
  border-color: transparent; color: color-mix(in srgb, var(--neon-blue,#3b82f6) 82%, var(--ink)); }

/* ================= Archetype catalog (index) ================= */
.archidx__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 18px; margin-top: 28px; }
.archidx__card { display: block; padding: 26px; border-radius: 20px; border: 1px solid var(--color-border);
  background: var(--color-card); transition: transform .15s, border-color .15s, box-shadow .15s; }
.archidx__card:hover { transform: translateY(-3px); border-color: var(--ink); text-decoration: none;
  box-shadow: 0 12px 40px color-mix(in srgb, var(--neon-violet,#8b5cf6) 14%, transparent); }
.archidx__sigil { font-size: 2.6rem; line-height: 1; }
.archidx__name { font-size: 1.4rem; margin: 12px 0 6px; }
.archidx__tagline { color: var(--color-muted); line-height: 1.5; font-size: .96rem; }
.archidx__more { display: inline-block; margin-top: 14px; font-weight: 700; font-size: .88rem;
  color: color-mix(in srgb, var(--neon-blue,#3b82f6) 80%, var(--ink)); }
.archidx__cta { text-align: center; margin-top: 40px; }
.archidx__cta h2 { margin-bottom: 16px; }

/* ================= Archetype page ================= */
.arch__hero { padding: 64px 0 40px; text-align: center;
  background: linear-gradient(180deg, color-mix(in srgb, var(--neon-violet,#8b5cf6) 8%, var(--paper)), var(--paper)); }
.arch__eyebrow { text-transform: uppercase; letter-spacing: .14em; font-size: .78rem; color: var(--color-faded); }
.arch__sigil { font-size: 4.5rem; line-height: 1; margin: 14px 0; }
.arch__name { font-size: clamp(2.2rem, 6vw, 3.6rem); letter-spacing: -.03em; line-height: 1.05; }
.arch__tagline { font-size: 1.25rem; color: var(--color-muted); max-width: 30ch; margin: 16px auto 0; line-height: 1.4; }
.arch__cta { margin-top: 26px; }
.arch__body { max-width: 760px; padding-top: 40px; padding-bottom: 60px; }
.arch__essence { font-size: 1.35rem; line-height: 1.55; font-weight: 500; }
.arch__grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin: 30px 0; }
.arch__panel { padding: 24px; border-radius: 18px; border: 1px solid var(--color-border); background: var(--color-card); }
.arch__panel h2 { font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; color: var(--color-faded); margin-bottom: 12px; }
.arch__panel p { line-height: 1.6; }
.arch__panel--super { border-color: color-mix(in srgb, #17c07f 40%, var(--color-border)); }
.arch__panel--blind, .arch__panel--minus { border-color: color-mix(in srgb, #e0a020 42%, var(--color-border)); }
.arch__panel--plus { border-color: color-mix(in srgb, var(--neon-cyan,#22d3ee) 40%, var(--color-border)); }
.arch__block { margin: 34px 0; }
.arch__block h2 { font-size: 1.5rem; margin-bottom: 12px; }
.arch__block p { font-size: 1.08rem; line-height: 1.65; color: var(--color-text); }
.arch__block--evolve { padding: 24px; border-radius: 18px; background: var(--ink); color: var(--white); }
.arch__block--evolve h2, .arch__block--evolve p { color: var(--white); }
.arch__list { margin-top: 8px; padding-left: 4px; list-style: none; }
.arch__list li { position: relative; padding-left: 26px; margin-bottom: 12px; line-height: 1.55; }
.arch__list li::before { content: "✦"; position: absolute; left: 0; color: color-mix(in srgb, var(--neon-violet,#8b5cf6) 80%, var(--ink)); }
.arch__subs { display: grid; gap: 14px; }
.arch__sub { padding: 18px 20px; border-radius: 14px; border: 1px solid var(--color-border); background: color-mix(in srgb, var(--paper) 60%, transparent); }
.arch__sub h3 { font-size: 1.05rem; margin-bottom: 6px; }
.arch__sub p { color: var(--color-muted); line-height: 1.55; }
.arch__evidence { margin: 34px 0; padding: 22px 24px; border-radius: 16px;
  border: 1px dashed var(--color-border); background: color-mix(in srgb, var(--neon-cyan,#22d3ee) 5%, transparent); }
.arch__evidence-eyebrow { font-size: .75rem; text-transform: uppercase; letter-spacing: .06em; color: color-mix(in srgb, var(--neon-blue,#3b82f6) 75%, var(--ink)); margin-bottom: 8px; font-weight: 700; }
.arch__evidence p { line-height: 1.6; }
.arch__cta-block { text-align: center; margin: 44px 0; }
.arch__cta-block h2 { margin-bottom: 16px; }
.arch__cta-block .btn { margin: 4px; }
.arch__related { margin-top: 40px; border-top: 1px solid var(--color-border); padding-top: 24px; }
.arch__related-h { font-size: .8rem; text-transform: uppercase; letter-spacing: .07em; color: var(--color-faded); margin-bottom: 12px; }
.arch__related-row { display: flex; flex-wrap: wrap; gap: 10px; }
.arch__chip { padding: 8px 15px; border-radius: 999px; border: 1px solid var(--color-border); background: var(--color-card); font-weight: 600; font-size: .92rem; }
.arch__chip:hover { border-color: var(--ink); text-decoration: none; }
@media (max-width: 680px) { .arch__grid2 { grid-template-columns: 1fr; } }

/* ===== Profile: archetype-as-hero header ===== */
.xray__archhero { display: flex; align-items: center; gap: 12px; margin-top: 8px; }
.xray__sigil { font-size: 2.4rem; line-height: 1; }
.xray__arch--hero { font-size: clamp(1.8rem, 4vw, 2.6rem); font-weight: 800; letter-spacing: -.02em;
  line-height: 1.05; color: var(--ink); background: var(--b-grad); -webkit-background-clip: text;
  background-clip: text; -webkit-text-fill-color: transparent; }
.xray__arch--hero:hover { text-decoration: none; opacity: .85; }

/* ================= v4 identity blend (profile) ================= */
.blend { margin: 20px 0 8px; padding: 20px 22px; border-radius: 16px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--neon-violet,#8b5cf6) 4%, var(--color-card)); }
.blend__badges { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 14px; }
.blend__sig { font-family: ui-monospace, monospace; font-weight: 800; font-size: 1.05rem; letter-spacing: .04em;
  padding: 5px 12px; border-radius: 8px; background: var(--ink); color: var(--white); }
.blend__tier { font-weight: 700; font-size: .82rem; padding: 4px 12px; border-radius: 999px;
  background: var(--paper); border: 1px solid var(--color-border); }
.blend__tier--master { background: color-mix(in srgb,#e0a020 22%,transparent); color:#8a6410; border-color:transparent; }
.blend__tier--adept { background: color-mix(in srgb,#17c07f 18%,transparent); color:#0f9a63; border-color:transparent; }
.blend__pole { font-size: .82rem; font-weight: 600; padding: 4px 12px; border-radius: 999px;
  background: color-mix(in srgb,var(--neon-cyan,#22d3ee) 14%,transparent); color: color-mix(in srgb,var(--neon-blue,#3b82f6) 82%,var(--ink)); }
.blend__eyebrow { font-size: .74rem; text-transform: uppercase; letter-spacing: .07em; color: var(--color-faded); margin-bottom: 12px; }
.blend__lowconf { text-transform: none; letter-spacing: 0; color: #b07d10; margin-left: 6px; font-weight: 600; }
.blend__bars { display: flex; flex-direction: column; gap: 9px; }
.blend__row { display: grid; grid-template-columns: 180px 1fr 44px; align-items: center; gap: 12px; }
.blend__row:hover { text-decoration: none; }
.blend__row:hover .blend__label { color: var(--ink); }
.blend__label { font-weight: 600; font-size: .92rem; color: var(--color-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.blend__track { height: 12px; border-radius: 999px; background: var(--color-border); overflow: hidden; }
.blend__fill { display: block; height: 100%; border-radius: 999px; background: var(--b-grad,#8b5cf6); }
.blend__fill--maestro_paralelo { background: linear-gradient(90deg,#22d3ee,#3b82f6); }
.blend__fill--regente_metodico { background: linear-gradient(90deg,#17c07f,#0f9a63); }
.blend__fill--piloto_autonomo { background: linear-gradient(90deg,#8b5cf6,#6366f1); }
.blend__fill--luthier { background: linear-gradient(90deg,#e0a020,#d4920a); }
.blend__fill--solista { background: linear-gradient(90deg,#f472b6,#ec4899); }
.blend__fill--explorador { background: linear-gradient(90deg,#94a3b8,#64748b); }
.blend__pct { font-weight: 800; font-size: .95rem; text-align: right; }
@media (max-width: 560px) { .blend__row { grid-template-columns: 130px 1fr 40px; } }

/* ===== Profile identity-first masthead (v4 style-first) ===== */
.xray__mast--identity { display: block; max-width: 68ch; }
.xray__mast--identity .xray__id { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.xray__mast--identity .xray__avatar { width: 56px; height: 56px; border-radius: 50%; }
.xray__mast--identity .xray__handle { font-size: 1.15rem; font-weight: 700; }
.xray__mast--identity .xray__name { font-weight: 400; color: var(--color-muted); }
.xray__mast--identity .xray__archhero { display: flex; align-items: center; gap: 14px; margin: 4px 0 10px; }
.xray__mast--identity .xray__sigil { font-size: 3rem; }
.xray__tending { font-size: .8rem; font-weight: 600; color: #b07d10; text-transform: uppercase; letter-spacing: .05em; }
.xray__monogram { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 18px; }
.xray__sigbtn { font-family: ui-monospace, monospace; font-weight: 800; font-size: 1.1rem; letter-spacing: .06em;
  padding: 7px 14px; border-radius: 10px; background: var(--ink); color: var(--white); border: none; cursor: pointer;
  position: relative; }
.xray__sigbtn::after { content: "⧉"; margin-left: 8px; opacity: .5; font-size: .85em; }
.xray__sigbtn:hover { opacity: .9; }
.xray__tierpill { font-weight: 700; font-size: .82rem; padding: 6px 14px; border-radius: 999px;
  background: var(--paper); border: 1px solid var(--color-border); }
.xray__tierpill--master { background: color-mix(in srgb,#e0a020 22%,transparent); color:#8a6410; border-color:transparent; }
.xray__tierpill--adept { background: color-mix(in srgb,#17c07f 18%,transparent); color:#0f9a63; border-color:transparent; }
.xray__scorechip { display: inline-flex; align-items: center; gap: 8px; font-size: .84rem; color: var(--color-muted);
  padding: 6px 4px; }
.xray__scorechip strong { color: var(--color-text); font-weight: 700; }
.xray__scorechip:hover { color: var(--ink); text-decoration: none; }
.xray__chipspark { display: inline-flex; opacity: .7; }
.xray__chipspark .spark { width: 60px; height: 20px; }

/* ===== Archetype catalog: duos ===== */
.archidx__duos { margin-top: 56px; }
.archidx__duogrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; margin-top: 24px; }
.archidx__duo { display: block; padding: 18px; border-radius: 14px; border: 1px solid var(--color-border); background: var(--color-card); transition: border-color .15s, transform .15s; }
.archidx__duo:hover { border-color: var(--ink); transform: translateY(-2px); text-decoration: none; }
.archidx__duoemoji { font-size: 1.5rem; }
.archidx__duoname { display: block; font-weight: 700; font-size: 1.05rem; margin: 6px 0 4px; }
.archidx__duotag { display: block; font-size: .86rem; color: var(--color-muted); line-height: 1.4; }
.arch__sigil--duo { display: flex; align-items: center; justify-content: center; gap: 4px; }
.arch__plus { font-size: 2rem; color: var(--color-faded); font-weight: 300; }
.arch__duoparents { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 14px; }
.arch__parent { display: flex; flex-direction: column; gap: 4px; padding: 18px; border-radius: 14px; border: 1px solid var(--color-border); background: var(--color-card); }
.arch__parent:hover { border-color: var(--ink); text-decoration: none; }
.arch__parent-emoji { font-size: 2rem; }
.arch__parent-role { font-size: .72rem; text-transform: uppercase; letter-spacing: .07em; color: var(--color-faded); }
.arch__parent-name { font-weight: 700; font-size: 1.1rem; }
.arch__parent-tag { font-size: .88rem; color: var(--color-muted); line-height: 1.4; }
.arch__pop { text-align: center; font-weight: 600; color: #0f9a63; margin: 20px 0; }
.arch__sub-meta { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--color-border); }
.arch__sub-meta p { font-size: .9rem; line-height: 1.5; margin-bottom: 6px; }
.arch__sub-lbl { font-weight: 800; }
.arch__sub-lbl--super { color: #0f9a63; }
.arch__sub-lbl--front { color: #b07d10; }
.arch__sub-ev { color: var(--color-faded); font-size: .82rem !important; }
@media (max-width: 560px) { .arch__duoparents { grid-template-columns: 1fr; } }

/* ================= Flash messages ================= */
.flash { display: flex; gap: 10px; align-items: flex-start; max-width: var(--container-max);
  margin: 16px auto 0; padding: 12px 16px; border-radius: var(--radius-md); font-weight: 600;
  border: 1px solid var(--color-border); background: var(--color-card); }
.flash--notice { border-color: color-mix(in srgb, #17c07f 45%, transparent); color: #0f9a63; }
.flash--alert { border-color: color-mix(in srgb, #e5484d 45%, transparent); color: #c23539; }

/* ================= Sign in ================= */
.auth-box { margin-top: 28px; padding: 24px; border-radius: var(--radius-lg);
  border: 1px solid var(--color-border); background: var(--color-card); max-width: 34rem; }
.auth-box__github form { margin: 0; }
.auth-box .btn { border: none; cursor: pointer; font: inherit; }
.auth-box__note { margin-top: 12px; font-size: .86rem; color: var(--color-muted); }
.auth-admin { margin-top: 28px; max-width: 34rem; font-size: .92rem; }
.auth-admin summary { cursor: pointer; color: var(--color-muted); }
.auth-admin__hint { margin-top: 8px; color: var(--color-faded); font-size: .86rem; }
.auth-admin__form { margin-top: 14px; }
.auth-admin__form .field { display: block; margin-bottom: 14px; }
.auth-admin__form label { display: block; font-weight: 600; margin-bottom: 4px; }
.auth-admin__form input[type=text], .auth-admin__form input[type=password] {
  width: 100%; max-width: 22rem; padding: .55rem .7rem; border-radius: 10px;
  border: 1px solid var(--color-border); background: var(--color-bg); color: inherit; font: inherit; }
.auth-admin__form .field--check { display: flex; align-items: center; gap: 8px; }
.auth-admin__form input[type=submit] { cursor: pointer; }
.nav__auth { font-weight: 600; }
.nav__signout { display: inline; }
.nav__signout button { border: none; background: none; padding: 0; font: inherit; color: inherit;
  cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }

/* ================= /me + admin (fundação) ================= */
.panel { margin-top: 24px; padding: 20px; border-radius: var(--radius-lg);
  border: 1px solid var(--color-border); background: var(--color-card); }
.panel h2 { font-size: 1.1rem; font-weight: 700; margin-bottom: 12px; }
.panel table { width: 100%; border-collapse: collapse; font-size: .92rem; }
.panel th, .panel td { text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--color-border); }
.panel th { color: var(--color-muted); font-weight: 600; }
.admin-nav { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 20px; font-weight: 600; }
.admin-nav a[aria-current] { color: var(--accent-text); }
.admin-stats { display: flex; flex-wrap: wrap; gap: 14px; }
.admin-stat { flex: 1; min-width: 150px; padding: 16px; border-radius: var(--radius-md);
  border: 1px solid var(--color-border); background: var(--color-card); }
.admin-stat__v { font-size: 1.6rem; font-weight: 800; letter-spacing: -.02em; }
.admin-stat__l { font-size: .82rem; color: var(--color-muted); margin-top: 2px; }
