/* ===== Consigliere · Dossiê & Lacre · tokens ===== */
@font-face{font-family:'Fraunces';src:url('/static/fonts/Fraunces-SemiBold.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'IBM Plex Sans';src:url('/static/fonts/IBMPlexSans-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'IBM Plex Sans';src:url('/static/fonts/IBMPlexSans-Medium.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'IBM Plex Sans';src:url('/static/fonts/IBMPlexSans-SemiBold.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'IBM Plex Mono';src:url('/static/fonts/IBMPlexMono-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'IBM Plex Mono';src:url('/static/fonts/IBMPlexMono-Medium.woff2') format('woff2');font-weight:500;font-display:swap}

:root{
  --paper:#F6F7F8; --card:#FFFFFF; --ink:#131C26; --ink-soft:#5A6573;
  --line:#DCE1E6; --line-soft:#E9ECEF;
  --lacre:#8C2F39; --lacre-deep:#6E2129;
  --oxford:#1E5945; --oxford-bg:#EAF2EE;
  --warn:#8A6D1F; --warn-bg:#F6F0DD;
  --font-display:'Fraunces',Georgia,serif;
  --font-body:'IBM Plex Sans',system-ui,sans-serif;
  --font-mono:'IBM Plex Mono',ui-monospace,monospace;
  --fs-0:.75rem; --fs-1:.875rem; --fs-2:1rem; --fs-3:1.25rem; --fs-4:1.75rem; --fs-5:2.5rem;
  --sp-1:.25rem; --sp-2:.5rem; --sp-3:1rem; --sp-4:1.5rem; --sp-5:2.5rem; --sp-6:4rem;
  --radius:6px; --shadow:0 1px 2px rgba(19,28,38,.06),0 4px 16px rgba(19,28,38,.05);
  --err:#6E2129;          /* = lacre-deep no claro; o dark precisa de tom próprio (AA) */
  color-scheme:light;     /* widgets nativos (select/checkbox/scrollbar) seguem o tema */
}
/* dark: MESMOS nomes de token, só re-mapeados (componentes não sabem do tema) */
html[data-theme="dark"]{
  --paper:#11161C; --card:#1A212A; --ink:#E6E9EC; --ink-soft:#9AA4AF;
  --line:#303943; --line-soft:#252D36;
  --lacre:#C25862; --lacre-deep:#A03F4A;
  --oxford:#5FAD8C; --oxford-bg:#1C2B26;  /* 5.5:1 sobre oxford-bg, 6.1:1 sobre card (AA) */
  --warn:#C9A84C; --warn-bg:#2A2517;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 4px 16px rgba(0,0,0,.35);
  --err:#D27780;          /* lacre-deep dark = 2.55:1 (reprova); este dá 5.17:1 no card */
  color-scheme:dark;
}
*{box-sizing:border-box}
/* author-origin display em .btn/.topbar etc. NÃO pode derrotar o atributo hidden
   (regra de UA perde por origem) — reset consagrado: */
[hidden]{display:none!important}
body{margin:0;background:var(--paper);color:var(--ink);font:400 var(--fs-2)/1.55 var(--font-body);
  -webkit-font-smoothing:antialiased;transition:background .15s,color .15s}
h1,h2,.wordmark{font-family:var(--font-display);font-weight:600;letter-spacing:-.01em}
a{color:var(--ink);text-decoration-color:var(--line)}
a:hover{text-decoration-color:var(--lacre)}
:focus-visible{outline:2px solid var(--lacre);outline-offset:2px;border-radius:2px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}
  .card-hoverable:hover{transform:none!important}}

/* eyebrow: rótulo mono caixa-alta — usar pra PROJETO, seções, metadados */
.eyebrow{font:500 var(--fs-0)/1 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}

/* selo-lacre (logo): classes via var() → funciona nos 2 temas */
.seal-wax{fill:var(--lacre)}
.seal-ring{fill:none;stroke:var(--lacre-deep);stroke-width:1}
.seal-letter{font-family:var(--font-display);font-weight:600;fill:var(--paper)}
.seal{flex-shrink:0;display:block}

/* toggle de tema: botão ghost; o glifo certo aparece via data-theme */
.theme-btn{display:inline-flex;align-items:center;justify-content:center;cursor:pointer;
  background:transparent;border:none;color:var(--ink-soft);padding:var(--sp-1);
  border-radius:var(--radius)}
.theme-btn:hover{color:var(--ink)}
.theme-btn .icon-moon{display:none}
html[data-theme="dark"] .theme-btn .icon-sun{display:none}
html[data-theme="dark"] .theme-btn .icon-moon{display:block}
.theme-corner{position:fixed;top:var(--sp-3);right:var(--sp-3)}

/* carimbo de protocolo (ASSINATURA — badge de indexação) */
.stamp{display:inline-flex;align-items:center;gap:.4em;font:500 var(--fs-0)/1 var(--font-mono);
  letter-spacing:.08em;text-transform:uppercase;padding:.35em .7em;border-radius:3px;
  border:1.5px solid currentColor}
.stamp--indexed{color:var(--oxford);background:var(--oxford-bg)}
.stamp--pending{color:var(--ink-soft);border-style:dashed;background:transparent}
.stamp--failed{color:var(--err);background:transparent}

/* ===== componentes (derivados SÓ dos tokens acima) ===== */

/* topbar: faixa card com hairline inferior; wordmark com ponto-lacre antes */
.topbar{background:var(--card);border-bottom:1px solid var(--line);
  padding:var(--sp-3) var(--sp-4)}
.topbar-inner{max-width:960px;margin:0 auto;display:flex;align-items:center;
  gap:var(--sp-4);flex-wrap:wrap}
.wordmark{font-size:var(--fs-3);color:var(--ink);text-decoration:none;white-space:nowrap;
  display:inline-flex;align-items:center;gap:.45em}
.topbar nav{display:flex;align-items:center;gap:var(--sp-3);margin-left:auto;
  font-size:var(--fs-1);flex-wrap:wrap;row-gap:var(--sp-2)}
.topbar nav a{text-decoration:none;color:var(--ink-soft)}
.topbar nav a:hover{color:var(--ink)}
.topbar-proj{display:flex;flex-direction:column;gap:var(--sp-1)}
.topbar-proj select{font:500 var(--fs-1)/1.3 var(--font-body);color:var(--ink);
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:var(--sp-1) var(--sp-2)}
.topbar form{margin:0}

/* botões: outline ink; hover inverte. Ação primária = ink sólido (NUNCA lacre em ação) */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;cursor:pointer;
  font:500 var(--fs-1)/1 var(--font-body);color:var(--ink);background:var(--card);
  border:1px solid var(--ink);border-radius:var(--radius);padding:.6em 1.1em;
  text-decoration:none;transition:background .12s,color .12s}
.btn:hover{background:var(--ink);color:var(--paper)}
.btn--primary{background:var(--ink);color:var(--paper)}
.btn--primary:hover{background:var(--ink-soft);border-color:var(--ink-soft)}

/* card de superfície */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:var(--sp-4)}
/* hover unificado (cards clicáveis + cards da home); reduced-motion zera o transform */
.card-hoverable{transition:transform .15s,border-color .15s,box-shadow .15s}
.card-hoverable:hover{transform:translateY(-3px) scale(1.015);border-color:var(--lacre);
  box-shadow:var(--shadow)}

/* papel timbrado: moldura dupla do login */
.frame-letterhead{background:var(--card);border:1px solid var(--line);
  outline:1px solid var(--line-soft);outline-offset:4px;border-radius:var(--radius);
  box-shadow:var(--shadow);padding:var(--sp-5)}

/* tabela base: hairlines SÓ horizontais */
table{border-collapse:collapse;width:100%}
th{font:500 var(--fs-0)/1 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-soft);text-align:left;padding:var(--sp-2) var(--sp-3);
  border-bottom:1px solid var(--line)}
td{padding:var(--sp-2) var(--sp-3);border-bottom:1px solid var(--line-soft);
  font-size:var(--fs-1)}
tbody tr:hover td{background:var(--line-soft)}

/* inputs: hairline, foco lacre */
.input,input[type=text],input[type=email],input[type=password],input[type=tel]{
  width:100%;font:400 var(--fs-2)/1.4 var(--font-body);color:var(--ink);
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:.55em .8em}
.input:focus,input[type=text]:focus,input[type=email]:focus,input[type=password]:focus,
input[type=tel]:focus{border-color:var(--lacre)}
/* anel só some no foco de MOUSE; teclado mantém o :focus-visible global de 2px */
.input:focus:not(:focus-visible),input[type=text]:focus:not(:focus-visible),
input[type=email]:focus:not(:focus-visible),input[type=password]:focus:not(:focus-visible),
input[type=tel]:focus:not(:focus-visible){outline:none}
/* escopado ao frame de auth: label bare vazaria pro toolbar do explorer (labels-botão) */
.auth-card label{display:block;margin-top:var(--sp-3)}
.auth-card label .eyebrow{display:block;margin-bottom:var(--sp-1)}

/* a régua do dossiê: proporção de indexação por versão */
.bar-ruler{display:flex;height:18px;border:1px solid var(--line);border-radius:3px;
  overflow:hidden;background:var(--card)}
.bar-ruler .seg{height:100%}
.bar-ruler .seg+.seg{border-left:1px solid var(--card)}  /* fronteira seg↔seg sempre visível */
.bar-ruler .seg--na{background:var(--line)}
.bar-ruler .seg--v{background:var(--oxford)}
.bar-legend{display:flex;gap:var(--sp-3);flex-wrap:wrap;margin-top:var(--sp-2)}
.bar-legend .mark{display:inline-flex;align-items:center;gap:.45em;
  font:500 var(--fs-0)/1 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-soft)}
.bar-legend .sw{display:inline-block;width:.7rem;height:.7rem;border-radius:2px;
  border:1px solid var(--line)}

/* texto auxiliar */
.muted{color:var(--ink-soft);font-size:var(--fs-1)}
.err{color:var(--err);font-size:var(--fs-1);white-space:pre-line}

/* ===== páginas internas (explorer/uso/instruções/conta) ===== */
.page h1{font-size:var(--fs-4);margin:var(--sp-4) 0 var(--sp-3)}
.page h2{font-size:var(--fs-3);margin:var(--sp-4) 0 var(--sp-2)}
.table-wrap{overflow-x:auto;margin-top:var(--sp-3)}
td.num{text-align:right;font-variant-numeric:tabular-nums;
  font-family:var(--font-mono);font-size:var(--fs-1)}
td.dt{font-family:var(--font-mono);font-size:var(--fs-1);white-space:nowrap}
/* "← Voltar ao dossiê" acima do h1 do explorer */
.backlink{margin:var(--sp-4) 0 calc(-1 * var(--sp-3))}
.backlink a{color:var(--ink-soft);text-decoration:none}
.backlink a:hover{color:var(--ink)}
/* bloco copiável de instruções de Projeto Claude (e result_md dos rounds — PC-1) */
.instr-block{width:100%;font:400 var(--fs-1)/1.6 var(--font-mono);color:var(--ink);
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:var(--sp-2) var(--sp-3);resize:vertical;margin-top:var(--sp-2)}
pre.instr-block{white-space:pre-wrap;overflow-wrap:anywhere;max-height:32rem;
  overflow-y:auto;box-sizing:border-box}

/* publicação do contexto (PC-3): grid de chaves do profile + pendência em warn */
.pkg-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-2) var(--sp-3);
  margin-top:var(--sp-3)}
@media (max-width:640px){.pkg-grid{grid-template-columns:1fr}}
.input--warn{border-color:var(--warn);background:var(--warn-bg)}

/* rounds de entrevista (/context) */
.round-head{display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap}
.round-head h2{margin:0;font-size:var(--fs-3)}
.round-files{list-style:none;padding:0;margin:var(--sp-3) 0 var(--sp-2)}
.round-files li{padding:var(--sp-1) 0;border-bottom:1px solid var(--line-soft);
  font-size:var(--fs-1);overflow-wrap:anywhere}
code{font-family:var(--font-mono);font-size:.9em;background:var(--line-soft);
  padding:.1rem .35rem;border-radius:3px}
#urlhint{word-break:break-all}  /* URL MCP inquebrável transborda viewport ≤375px */
input[type=checkbox]{accent-color:var(--lacre)}
.selcol{width:2rem}

/* breadcrumb do explorer */
.crumbs{font:500 var(--fs-1)/1.5 var(--font-mono);overflow-wrap:anywhere}
.crumbs a{text-decoration:none;color:var(--ink-soft)}
.crumbs a:hover{color:var(--ink)}
.crumbs .sep{color:var(--ink-soft);margin:0 .45em}
.crumbs .cur{color:var(--ink)}

/* toolbar do explorer (botões do sistema) */
.toolbar{display:flex;gap:var(--sp-2);align-items:center;margin-top:var(--sp-3);flex-wrap:wrap}
.btn--del:hover{background:var(--card);color:var(--err);border-color:var(--err)}

/* linha de pasta: âncora real (focável), glifo + nome */
a.folder-link{display:inline-flex;align-items:center;gap:.5em;text-decoration:none;
  color:var(--ink)}
a.folder-link svg{color:var(--ink-soft);flex-shrink:0}

/* credencial exibida 1× (instruções) */
.cred{display:none;background:var(--warn-bg);border:1px solid var(--warn);
  border-radius:var(--radius);padding:var(--sp-3);margin-top:var(--sp-3)}
.cred .eyebrow{color:var(--warn)}
.fld{margin-top:var(--sp-2)}
.fld label{display:block;font:500 var(--fs-0)/1 var(--font-mono);letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-soft);margin-bottom:var(--sp-1)}
.fld code{display:inline-block;background:var(--card);border:1px solid var(--line);
  padding:.3rem .5rem;word-break:break-all;max-width:90%}

/* forms inline (instruções/conta) */
.form-row{display:flex;gap:var(--sp-2);margin-top:var(--sp-2);flex-wrap:wrap;align-items:center}
.form-row .input{flex:1;min-width:12rem;width:auto}
.form-row select{font:400 var(--fs-1)/1.4 var(--font-body);color:var(--ink);
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:.55em .8em}
.card+.card{margin-top:var(--sp-4)}

/* ===== layout (mesmos tokens) ===== */
.page{max-width:960px;margin:0 auto;padding:var(--sp-4) var(--sp-4) var(--sp-6)}

/* frame de autenticação (login/cadastro/recuperação compartilham) */
.auth-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;
  padding:var(--sp-4)}
.auth-card{max-width:420px;width:100%}
.auth-card h1{font-size:var(--fs-3);margin:0 0 var(--sp-3)}
.auth-card button{width:100%;margin-top:var(--sp-4);display:inline-flex;align-items:center;
  justify-content:center;cursor:pointer;font:500 var(--fs-1)/1 var(--font-body);
  color:var(--paper);background:var(--ink);border:1px solid var(--ink);
  border-radius:var(--radius);padding:.7em 1.1em;transition:background .12s}
.auth-card button:hover{background:var(--ink-soft);border-color:var(--ink-soft)}
.auth-brand{text-align:center;margin-bottom:var(--sp-4)}
.auth-brand .seal{margin:0 auto var(--sp-2)}
.auth-brand .wordmark{font-size:var(--fs-4);display:block}
.auth-brand .eyebrow{display:block;margin-top:var(--sp-2)}
.auth-links{margin-top:var(--sp-3);font-size:var(--fs-1);text-align:center;color:var(--ink-soft)}
.auth-links a{color:var(--ink-soft)}
.auth-alt{margin-top:var(--sp-4);border-top:1px solid var(--line-soft);
  padding-top:var(--sp-3);color:var(--ink-soft);font-size:var(--fs-1)}

/* home institucional */
.hero{margin:var(--sp-6) 0 var(--sp-5)}
.hero h1{font-size:clamp(var(--fs-4),5.5vw,var(--fs-5));margin:var(--sp-3) 0;max-width:24ch}
.hero-tese{font-size:var(--fs-3);color:var(--ink-soft);max-width:46rem;margin:0 0 var(--sp-4)}
.hero-ctas{display:flex;gap:var(--sp-3);flex-wrap:wrap}
.caps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-4);margin-top:var(--sp-5)}
@media (max-width:900px){.caps-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.caps-grid{grid-template-columns:1fr}}
.caps-grid .card{height:100%}
.caps-grid .card .glyph{color:var(--ink-soft)}
.caps-grid .card h2{font-size:var(--fs-3);margin:var(--sp-2) 0 var(--sp-1)}
.caps-grid .card p{margin:0;color:var(--ink-soft);font-size:var(--fs-1)}

/* landing do dossiê */
.dossier-head{display:flex;align-items:baseline;gap:var(--sp-3);margin:var(--sp-5) 0 var(--sp-3)}
.dossier-head h1{margin:0;font-size:var(--fs-4)}
.dossier-head .eyebrow{margin-left:auto}
/* grid (não flex): alturas uniformes por linha — flex+min-width deixava os cards
   do dossiê com alturas diferentes dos da home */
.cards-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-4);
  margin-top:var(--sp-5)}
@media (max-width:640px){.cards-grid{grid-template-columns:1fr}}
.card-link{text-decoration:none;display:block;height:100%}
.card-link .glyph{color:var(--ink-soft)}
.card-link h2{margin:var(--sp-2) 0 var(--sp-1);font-size:var(--fs-3)}
.card-link p{margin:0;color:var(--ink-soft);font-size:var(--fs-1)}
/* dentro de um grid, os cards são colunas-irmãs: a regra global .card+.card
   (margin-top empilhado) desalinhava a 1ª linha — neutralizar só nos grids */
.cards-grid .card + .card, .caps-grid .card + .card { margin-top: 0; }
/* ---- contexto ativo: card READ-ONLY na /context (F3); herda tokens de tema ---- */
.ctx-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:var(--sp-3) var(--sp-4);margin-bottom:var(--sp-4)}
.ctx-card-title{margin:0 0 var(--sp-1)}
.ctx-card-meta{color:var(--ink-soft);font-size:var(--fs-1);margin:0 0 var(--sp-3)}
.ctx-sec{margin:var(--sp-2) 0}
.ctx-sec>summary{cursor:pointer;font-weight:600}
.ctx-body{padding:var(--sp-2) 0 var(--sp-1) var(--sp-3)}
.ctx-list{margin:var(--sp-1) 0;padding-left:var(--sp-4)}
.ctx-kv-row{display:flex;gap:var(--sp-2);margin:.15rem 0}
.ctx-kv-key{color:var(--ink-soft);min-width:11rem}
.ctx-theme,.ctx-actor-grp{margin:.35rem 0}
.ctx-theme>summary,.ctx-actor-grp>summary{cursor:pointer}
.ctx-actor-name{font-weight:600}
.ctx-actor-tags{color:var(--ink-soft)}
.ctx-actor-alias{color:var(--ink-soft);font-style:italic}
.ctx-rounds-note{background:var(--warn-bg);border-left:3px solid var(--warn);padding:var(--sp-2) var(--sp-3);margin:var(--sp-2) 0 var(--sp-3);font-size:var(--fs-1)}
