/* rating-lichess.css — as duas páginas de rating do Lichess (conteúdo vivo e calculadora de percentil).
 * Vive em cima do app.css do Xadrez Raio-X: só o que ele não cobre. Toda cor sai de token do site. */
:root{
  --serie-bullet:var(--gold-2);
  --serie-blitz:var(--green-2);
  --serie-rapid:var(--blue);
  --serie-classical:#bc8cff;
}
article.ev{padding-bottom:8px;}
article.ev .lead{margin:10px 0 0;}
.ev-bread{font-size:.78rem;color:var(--muted);margin:16px 0 10px;}
.ev-bread a{color:var(--muted);}
.ev h1{margin-top:10px;text-align:left;}

/* resposta no topo: o trecho que robô e pessoa copiam */
.ev .answer{font-size:clamp(1.05rem,2.6vw,1.22rem);line-height:1.55;color:var(--ink);max-width:62ch;margin:16px 0 0;}
.ev .answer b{color:var(--green-2);font-weight:700;white-space:nowrap;}
.ev-fresco{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;margin:14px 0 0;font-size:.82rem;color:var(--muted);}
.ev-fresco b{color:var(--ink-2);font-weight:600;}
.ev-selo{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line-2);border-radius:999px;padding:5px 12px;color:var(--ink-2);font-weight:600;}
.ev-selo::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--green-2);box-shadow:0 0 0 3px var(--green-dim);}
.ev-hero-cta{margin:20px 0 0;max-width:380px;}
.ev-hero-cta .btn{width:100%;}

/* índice: cartão lateral no desktop (app.css), chips rolando no celular */
.ev-chips{display:flex;gap:8px;overflow-x:auto;padding:14px 0 6px;margin:0 -20px;padding-left:20px;padding-right:20px;scrollbar-width:none;}
.ev-chips::-webkit-scrollbar{display:none;}
.ev-chips a{flex:none;font-family:var(--disp);font-weight:600;font-size:.82rem;color:var(--ink-2);border:1px solid var(--line-2);border-radius:999px;padding:8px 14px;white-space:nowrap;}
@media (min-width:960px){.ev-chips{display:none;}}

.ev .panel{scroll-margin-top:84px;}
.ev .panel p{font-size:.95rem;color:var(--ink-2);margin:10px 0;max-width:72ch;}
.ev .panel p b{color:var(--ink);}
.ev .panel h2{font-size:clamp(1.25rem,3.2vw,1.6rem);}
.ev-nota{font-size:.8rem !important;color:var(--muted) !important;}

/* tabelas: linhas de tabela no desktop, cartões no celular */
.ev-tb{width:100%;border-collapse:collapse;margin:14px 0 4px;font-size:.92rem;font-variant-numeric:tabular-nums;}
.ev-tb caption{text-align:left;font-size:.8rem;color:var(--muted);padding:0 0 8px;}
.ev-tb th,.ev-tb td{text-align:right;padding:10px 12px;border-bottom:1px solid var(--line);}
.ev-tb th:first-child,.ev-tb td:first-child{text-align:left;}
.ev-tb thead th{font-family:var(--disp);font-weight:600;font-size:.76rem;letter-spacing:.04em;color:var(--muted);text-transform:none;border-bottom:1px solid var(--line-2);}
.ev-tb tbody th{font-family:var(--disp);font-weight:700;color:var(--ink);}
.ev-tb td b{color:var(--ink);}
.ev-tb .sub{display:block;white-space:nowrap;font-size:.72rem;color:var(--muted);font-weight:400;}
.ev-tb .sobe::before{content:"▲ ";font-size:.7em;}
.ev-tb .desce::before{content:"▼ ";font-size:.7em;}
.ev-tb .igual::before{content:"= ";font-size:.8em;}
.ev-rolo{overflow-x:auto;-webkit-overflow-scrolling:touch;}
.ev-dot{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:8px;vertical-align:-1px;}
.ev-dot.s-bullet{background:var(--serie-bullet);} .ev-dot.s-blitz{background:var(--serie-blitz);}
.ev-dot.s-rapid{background:var(--serie-rapid);} .ev-dot.s-classical{background:var(--serie-classical);}
@media (max-width:640px){
  .ev-tb,.ev-tb tbody,.ev-tb tr,.ev-tb th,.ev-tb td{display:block;width:100%;}
  .ev-tb thead{position:absolute;left:-9999px;}
  .ev-tb tbody tr{background:var(--bg-2);border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin:0 0 10px;}
  .ev-tb tbody th{padding:0 0 8px;border:0;font-size:1.05rem;text-align:left;}
  .ev-tb td{display:flex;justify-content:space-between;align-items:baseline;gap:14px;border:0;border-bottom:1px solid var(--line);padding:8px 0;text-align:right;}
  .ev-tb td:last-child{border-bottom:0;}
  .ev-tb td::before{content:attr(data-rotulo);font-size:.8rem;color:var(--muted);text-align:left;font-weight:500;}
  .ev-tb td:first-child{text-align:right;}
  .ev-tb caption{display:block;width:100%;padding:0 0 10px;}
  .ev-tb .v{display:inline-flex;align-items:baseline;justify-content:flex-end;gap:10px;flex-wrap:wrap;}
  .ev-tb .v .sub{display:inline;}
  .ev-tb .v .ev-spark{align-self:center;}
}

/* gráfico: traço em SVG esticado, texto em HTML (px reais no celular) */
.cv{margin:14px 0 4px;}
.cv-leg{display:flex;flex-wrap:wrap;gap:6px 18px;list-style:none;padding:0;margin:0 0 6px 44px;font-size:.84rem;color:var(--ink-2);}
.cv-leg li{display:inline-flex;align-items:center;gap:8px;}
.cv-leg i{display:inline-block;width:22px;height:0;border-top:3px solid currentColor;border-radius:2px;}
.cv-leg i.s-classical,.cv path.cv-linha.s-classical{stroke-dasharray:7 4;}
.cv-leg i.s-classical{border-top-style:dashed;}
.cv .s-bullet{color:var(--serie-bullet);} .cv .s-blitz{color:var(--serie-blitz);}
.cv .s-rapid{color:var(--serie-rapid);} .cv .s-classical{color:var(--serie-classical);}
.cv-plot{position:relative;margin:10px 4px 30px 44px;}
.cv-plot svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;}
.cv-linha{fill:none;stroke:currentColor;stroke-width:2.4;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke;}
.cv-area{fill:currentColor;fill-opacity:.12;stroke:none;}
.cv-abaixo{fill:var(--green-2);fill-opacity:.38;stroke:none;}
.cv-grade{position:absolute;left:0;right:0;height:0;border-top:1px solid var(--line);}
.cv-y{position:absolute;left:-44px;width:38px;text-align:right;transform:translateY(50%);font-size:.74rem;color:var(--muted);font-variant-numeric:tabular-nums;}
.cv-x{position:absolute;bottom:-26px;transform:translateX(-50%);font-size:.76rem;color:var(--muted);font-variant-numeric:tabular-nums;}
.cv-ponto{position:absolute;width:11px;height:11px;border-radius:50%;background:currentColor;border:2px solid var(--panel);transform:translate(-50%,50%);}
.cv-voce{position:absolute;top:0;bottom:0;width:0;border-left:2px dashed var(--gold-2);}
.cv-voce-rotulo{position:absolute;top:-2px;transform:translate(8px,-100%);background:var(--gold-2);color:var(--gold-contrast);font-family:var(--disp);font-weight:700;font-size:.78rem;padding:3px 9px;border-radius:999px;white-space:nowrap;}
.cv-voce-rotulo.esq{transform:translate(calc(-100% - 8px),-100%);}
.cv-eixos{display:flex;justify-content:space-between;gap:12px;margin:0 4px 0 44px;font-size:.74rem;color:var(--muted);}
@media (max-width:520px){
  .cv-plot{margin-left:38px;height:220px !important;} .cv-leg,.cv-eixos{margin-left:38px;} .cv-y{left:-38px;width:32px;}
  .cv-eixos{flex-direction:column;gap:2px;}
}

/* linha de tendência nas linhas da tabela */
.ev-spark{display:inline-block;width:92px;height:26px;vertical-align:middle;}
.ev-spark svg{width:100%;height:100%;overflow:visible;}
.ev-spark path{fill:none;stroke:currentColor;stroke-width:2;stroke-linejoin:round;vector-effect:non-scaling-stroke;}
.ev-spark.s-bullet{color:var(--serie-bullet);} .ev-spark.s-blitz{color:var(--serie-blitz);}
.ev-spark.s-rapid{color:var(--serie-rapid);} .ev-spark.s-classical{color:var(--serie-classical);}

/* destaque de leitura */
.ev-leitura{border-left:3px solid var(--green);padding:2px 0 2px 16px;margin:16px 0 4px;}
.ev-leitura p{margin:6px 0 !important;color:var(--ink) !important;}

/* detalhes (curva em números, metodologia): fechados por padrão, nunca maiores que o CTA */
.ev details.ev-det{border-top:1px solid var(--line);margin-top:16px;}
.ev details.ev-det>summary{cursor:pointer;list-style:none;font-family:var(--disp);font-weight:600;font-size:.95rem;padding:14px 30px 14px 0;position:relative;color:var(--ink);}
.ev details.ev-det>summary::-webkit-details-marker{display:none;}
.ev details.ev-det>summary::after{content:"+";position:absolute;right:2px;top:50%;transform:translateY(-50%);font-size:1.4rem;color:var(--green);}
.ev details.ev-det[open]>summary::after{content:"\2212";}
.ev-det .ev-rolo{max-height:440px;overflow:auto;}
.ev-ml{padding-left:20px;} .ev-ml li{margin:6px 0;font-size:.92rem;color:var(--ink-2);}

/* faixa de CTA do fim (mesmo desenho dos guias) */
.ev .guia-cta-band{background:linear-gradient(180deg,var(--panel-2),var(--panel));color:var(--ink);border:1px solid rgba(210,153,34,.4);box-shadow:none;margin:16px 0 0;}
.ev .guia-cta-band::before{content:none;}
.ev .guia-cta-band h2{color:var(--ink);}
.ev .guia-cta-band p{color:var(--ink-2);opacity:1;max-width:none;margin-left:auto;margin-right:auto;}
.ev .guia-cta-band .btn{background:linear-gradient(180deg,var(--green-2),var(--green));color:var(--green-contrast);box-shadow:0 2px 0 rgba(0,0,0,.28),0 12px 26px rgba(46,160,67,.28);}
.ev .guia-cta-band .btn:hover{filter:brightness(1.08);}

.ev-rel a{display:block;padding:12px 0;border-bottom:1px solid var(--line);font-family:var(--disp);font-weight:600;font-size:.95rem;color:var(--ink);}
.ev-rel a:last-child{border-bottom:0;}
.ev-rel a span{display:block;font-family:var(--body);font-weight:400;font-size:.82rem;color:var(--muted);margin-top:2px;}
.ev-atualizado{font-size:.76rem;color:var(--muted);margin:20px 0 0;}

/* ---------- calculadora ---------- */
.calc{display:grid;gap:18px;}
.calc fieldset{border:0;padding:0;margin:0;min-width:0;}
.calc legend{font-family:var(--disp);font-weight:600;font-size:.82rem;letter-spacing:.02em;margin-bottom:8px;padding:0;}
.calc-ritmos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;}
.calc-ritmos input{position:absolute;opacity:0;pointer-events:none;}
.calc-ritmos label{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-align:center;font-family:var(--disp);font-weight:700;font-size:.92rem;color:var(--ink-2);background:var(--bg-2);border:1.5px solid var(--line-2);border-radius:11px;padding:11px 4px;cursor:pointer;box-shadow:0 2px 0 rgba(0,0,0,.28);transition:background .15s,border-color .15s,color .15s;}
.calc-ritmos label small{font-family:var(--body);font-weight:400;font-size:.68rem;color:var(--muted);}
.calc-ritmos label:hover{border-color:var(--green);color:var(--ink);}
.calc-ritmos input:checked+label{background:color-mix(in srgb, var(--green) 13%, transparent);border-color:var(--green);color:var(--ink);box-shadow:0 2px 0 rgba(0,0,0,.28),inset 0 0 0 1px var(--green);}
.calc-ritmos input:focus-visible+label{outline:2.5px solid var(--gold-2);outline-offset:3px;}
@media (max-width:420px){.calc-ritmos label small{display:none;} .calc-ritmos label{font-size:.85rem;padding:13px 2px;}}
.calc-linha{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:end;}
.calc-linha .btn{width:auto;white-space:nowrap;padding:16px 22px;}
@media (max-width:520px){.calc-linha{grid-template-columns:1fr;} .calc-linha .btn{width:100%;}}
.calc .field small{margin-top:6px;}
.calc-plat{display:flex;gap:10px;align-items:flex-start;background:var(--bg-2);border:1px solid var(--line);border-radius:11px;padding:10px 12px;font-size:.82rem;color:var(--ink-2);}
.calc-plat b{color:var(--ink);}
.calc-plat i{flex:none;font-style:normal;font-family:var(--disp);font-weight:700;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--green-contrast);background:var(--green-2);border-radius:999px;padding:3px 9px;}
.res{margin-top:22px;border-top:1px solid var(--line);padding-top:20px;}
.res[hidden]{display:none;}
.res-topo{font-family:var(--disp);font-weight:700;font-size:clamp(1.3rem,4.4vw,1.85rem);line-height:1.2;color:var(--ink);letter-spacing:-.01em;margin:0 !important;max-width:none !important;}
.res-topo b{color:var(--green-2);white-space:nowrap;}
.res-sub{margin:8px 0 0 !important;font-size:1rem !important;color:var(--ink-2) !important;}
.res-erro{color:var(--ink);background:var(--red-dim);border:1px solid color-mix(in srgb, var(--red) 40%, transparent);border-radius:11px;padding:12px 14px;font-size:.92rem;margin:0 !important;}
.res-vazio{color:var(--muted);font-size:.92rem;}
.res-cta{margin-top:20px;background:var(--bg-2);border:1px solid color-mix(in srgb, var(--green) 38%, transparent);border-radius:14px;padding:18px;}
.res-cta[hidden]{display:none;}
.res-cta p{margin:0 0 12px !important;color:var(--ink) !important;}
.res-cta .btn{max-width:380px;}
.ev-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}

/* ajustes da calculadora (especificidade acima de .ev .panel p) */
.ev .panel .res-topo{font-size:clamp(1.3rem,4.4vw,1.85rem);max-width:none;color:var(--ink);}
.ev .panel .res-sub{font-size:1rem;color:var(--ink-2);margin:8px 0 0;}
.ev .panel .res-cta p{font-size:.98rem;color:var(--ink);}
.ev .panel .res-erro{font-size:.92rem;}
.cv-plot:has(.cv-voce){margin-top:40px;}
.cv-plot:has(.cv-abaixo) .cv-area{fill:var(--ink-2);fill-opacity:.1;}
@media (max-width:640px){
  .ev-tb.compacta{display:table;}
  .ev-tb.compacta tbody{display:table-row-group;} .ev-tb.compacta thead{position:static;display:table-header-group;}
  .ev-tb.compacta tr{display:table-row;background:none;border:0;padding:0;margin:0;}
  .ev-tb.compacta th,.ev-tb.compacta td{display:table-cell;width:auto;padding:10px 6px;border-bottom:1px solid var(--line);text-align:right;}
  .ev-tb.compacta th:first-child{text-align:left;font-size:.92rem;}
  .ev-tb.compacta td::before{content:none;}
  .ev-tb.compacta caption{display:table-caption;}
}
.ev .doc-grid{grid-template-columns:minmax(0,1fr);} @media (min-width:960px){.ev .doc-grid{grid-template-columns:230px minmax(0,1fr);}} .ev .doc-grid>div{min-width:0;}
