/* Ficha de jugador (rediseño «Marcador», sep 2026). Solo lo propio de la ficha; los
   componentes compartidos (.lbl, .cond, .score, .facts-strip, .chip, .rk, .ps, .role, .tabs2,
   .posb, .pc, .ovr, .btn) viven en app.css. Marcado único: el móvil reordena con grid-areas
   (cabecera) y display:contents + order (cuerpo). */

.jp .js{display:none}
@media(min-width:769px){.jp .jp-m-only{display:none}}
@media(max-width:768px){.jp .jp-d-only{display:none}}
.jp-up{color:var(--up)}
.jp-down{color:var(--down)}
.jp-muted{color:var(--text-3);font-size:var(--fs-1)}
.jbar{display:block;height:4px;border-radius:99px;background:var(--border);overflow:hidden}
.jbar i{display:block;height:100%;border-radius:inherit}
.jstars{display:inline-flex;gap:1px;letter-spacing:0}
.jstars i{font-style:normal;color:var(--border-strong)}
.jstars i.on,.jstar{font-style:normal;color:var(--gold)}
.jd{font-style:normal;font-weight:700;font-size:var(--fs-1);font-variant-numeric:tabular-nums}
.jd.up{color:var(--up)}
.jd.down{color:var(--down)}
.jd.eq{color:var(--text-3)}
.jp-chips{display:flex;flex-wrap:wrap;gap:var(--s2)}

/* ---------- cabecera ---------- */
.jp-crumbs{padding:var(--s4) 0 0;flex-wrap:wrap}
.jp-crumbs .jp-cur{color:var(--text-2)}
.jp-hd{display:grid;grid-template-columns:144px minmax(0,1fr) 460px;column-gap:var(--s6);align-items:start;padding-top:var(--s5);
  grid-template-areas:"photo name score" "photo links score" "photo acts prime" "faces faces faces" "game game game" "tags tags tags" "rk rk rk"}
.jp-photo{grid-area:photo;width:144px;height:144px;border-radius:var(--rad-3);background:var(--surface);overflow:hidden}
.jp-photo img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block}
.jp-name{grid-area:name;min-width:0}
.jp-name h1{margin:0;font-size:var(--fs-h1-ent);font-weight:800;line-height:.95;letter-spacing:-.015em;overflow-wrap:anywhere}
.jp-pos{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:var(--s3)}
.jp-when{margin-left:6px;font-size:var(--fs-1);color:var(--text-3)}
.jp-links{grid-area:links;display:flex;flex-direction:column;gap:var(--s3);margin-top:var(--s3);min-width:0}
.jp-ent{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2) var(--s4);font-size:var(--fs-2)}
.jp-ent a,.jp-ent>span{display:inline-flex;align-items:center;gap:var(--s2);color:var(--text-2)}
.jp-ent a:hover{color:var(--accent-ink)}
.jp-ent a.jp-club{color:var(--text);font-weight:600}
.jp-ent>i{width:1px;height:16px;background:var(--border-strong)}
.jp-free{font-weight:600;color:var(--text-2)}
.jp-bio{margin:0;font-size:var(--fs-2);line-height:1.5;color:var(--text-2)}
.jp-acts{grid-area:acts;display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:var(--s4)}

/* marcador + barra 40–99 (marca del prime) + valor/sueldo/cláusula */
.jp-score{grid-area:score;display:flex;flex-direction:column;gap:var(--s3);min-width:0}
.jp-score .score b.cond{display:block}
.jp-bar-t{position:relative;height:6px;border-radius:99px;background:var(--border)}
.jp-bar-t i{position:absolute;top:0;bottom:0;left:0;border-radius:99px}
.jp-bar-t .g{opacity:.3;border-radius:0 99px 99px 0}
.jp-bar-t .pm{top:-4px;bottom:auto;width:2px;height:14px;margin-left:-1px;border-radius:0;background:var(--gold)}
.jp-bar-s{display:flex;justify-content:space-between;margin-top:6px;font-size:var(--fs-1);color:var(--text-3);font-variant-numeric:tabular-nums}
.jp-bar-s .pm{color:var(--gold);font-weight:600}
.jp-money{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s5)}
.jp-money>span{display:inline-flex;align-items:baseline;gap:var(--s2)}
.jp-money b{font-size:var(--fs-3);font-weight:700;color:var(--text)}

/* PRIME (enlaza a su roster): fila dorada bajo el marcador, igual en escritorio y móvil
   (corona · qué/cuándo · media y potencial de su prime · chevron) */
.jp-prime{grid-area:prime;display:grid;grid-template-columns:22px minmax(0,1fr) auto auto 20px;align-items:center;gap:var(--s3);min-width:0;min-height:64px;margin-top:var(--s4);padding:var(--s2) var(--s4);border:1px solid var(--gold);border-radius:var(--rad-2);background:var(--gold-dim);color:var(--text);text-decoration:none}
a.jp-prime:hover{border-color:var(--gold-hi);color:var(--text)}
.jp-prime.is-cur{grid-template-columns:22px minmax(0,1fr)}
.jp-crown{flex:none;width:22px;height:22px;fill:var(--gold)}
.jp-prime-t{display:flex;flex-direction:column;gap:2px;min-width:0}
.jp-prime-t>b,.jp-prime-t>span{font-size:var(--fs-1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jp-prime-t>b{font-size:var(--fs-2);font-weight:700;color:var(--gold)}
.jp-prime-t>span{color:var(--text-2)}
a.jp-prime:hover .jp-prime-t>b{color:var(--gold-hi)}
.jp-prime-n{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:32px}
.jp-prime-n .lbl{font-size:var(--fs-lbl);line-height:1}
.jp-prime-n b{font-size:var(--fs-num-1);font-weight:800;line-height:1;color:var(--text)}
.jp-chev{flex:none;display:block;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2}
a.jp-prime:hover .jp-chev{color:var(--gold-hi)}

/* las 6 medias en UNA fila */
.jp-faces{grid-area:faces;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);column-gap:var(--s5);margin-top:var(--s4);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.jp-faces>div{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:baseline;row-gap:var(--s2);padding:var(--s3) 0 var(--s4);min-width:0}
.jp-faces b{justify-self:end;font-size:var(--fs-num-2);font-weight:800;line-height:1}
.jp-faces .jbar{grid-column:1/-1}
.jp-game{grid-area:game;border-top:0}
.jp-game .v{font-size:var(--fs-3);font-weight:700}
.jp-tags{grid-area:tags;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:var(--s4) var(--s7);padding-top:var(--s5)}
.jp-tags>div{display:flex;flex-direction:column;gap:var(--s2)}
.jp-rk{grid-area:rk;display:flex;align-items:center;flex-wrap:wrap;gap:var(--s3);padding-top:var(--s5)}

/* pestañas + mini-cabecera (aparece al dejar atrás el marcador) */
.jp-tabs{margin-top:var(--s5)}
.jp-mini{margin-left:auto;display:flex;align-items:center;gap:var(--s2);font-size:var(--fs-1);color:var(--text-2);opacity:0;pointer-events:none;transition:opacity .18s ease}
.jp-mini.show{opacity:1}
.jp-mini b{color:var(--text);white-space:nowrap}
.jp-mini-pot{font-weight:700}
@media(prefers-reduced-motion:reduce){.jp-mini{transition:none}}

/* ---------- cuerpo: principal (8/12) + lateral (4/12) ---------- */
.jp-body{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:var(--s7);align-items:start;padding:var(--s6) 0 var(--s7)}
.jp-main{display:flex;flex-direction:column;gap:var(--s7);min-width:0}
.jp-aside{display:flex;flex-direction:column;gap:var(--s6);min-width:0}
.jp [id]{scroll-margin-top:72px}
.jp-sh{margin-bottom:var(--s4)}
.jp-sh .more{margin-left:auto}
.jp-sh .sub{margin:0}
.jp-sh-col{flex-direction:column;align-items:flex-start;gap:var(--s1)}
.jp-sh p.sub b{font-weight:700}
.jp-empty,.jp-note{margin:var(--s2) 0 0;font-size:var(--fs-1);color:var(--text-3)}

/* atributos: 3 grupos por fila; deltas vs inicio de temporada / vs prime */
.jp-seg{margin-left:auto;display:inline-flex;border:1px solid var(--border-strong);border-radius:var(--rad-2);overflow:hidden}
.jp-seg button{height:var(--ctl-sm);padding:0 var(--s3);border:0;border-left:1px solid var(--border-strong);background:transparent;color:var(--text-2);font:inherit;font-size:var(--fs-1);font-weight:600;cursor:pointer;white-space:nowrap}
.jp-seg button:first-child{border-left:0}
.jp-seg button[aria-pressed=true]{background:var(--surface-2);color:var(--text)}
.jp-seg button.gold[aria-pressed=true]{background:var(--gold-dim);color:var(--gold)}
.jp-attrs .jd{display:none}
.jp-attrs[data-cmp=start] .jd.d-s,.jp-attrs[data-cmp=prime] .jd.d-p{display:inline}
.jp-groups{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s6)}
.jp-grp{min-width:0}
.jp-grp-h{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s2);padding-bottom:var(--s2);border-bottom:1px solid var(--border-strong)}
.jp-grp-h h3{margin:0;font-size:var(--fs-1);font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.jp-grp-h>span{display:inline-flex;align-items:baseline;gap:var(--s2)}
.jp-grp-h b{font-size:var(--fs-5);font-weight:800}
.ar{display:grid;grid-template-columns:minmax(0,1fr) 56px 28px 34px;align-items:center;gap:var(--s2);min-height:34px;border-bottom:1px solid var(--border)}
.ar .an{font-size:var(--fs-1);color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ar .av{font-size:var(--fs-2);font-weight:650;text-align:right;font-variant-numeric:tabular-nums}
.ar .ad{text-align:right}

/* valoración por posición: campo + hexágono + mejores posiciones */
.jp-posgrid{display:grid;grid-template-columns:300px minmax(0,1fr);gap:var(--s7);align-items:start}
.jp-pitch pitch-board{display:block;border-radius:var(--rad-3);overflow:hidden}
.jp-posside{display:flex;flex-direction:column;gap:var(--s4);min-width:0}
.jp-radar svg{display:block;width:100%;max-width:340px;height:auto;overflow:visible}
.jp-radar .rg{fill:none;stroke:var(--border-strong);stroke-width:1}
.jp-radar .ra{stroke:var(--border);stroke-width:1}
.jp-radar .rp{fill:none;stroke:var(--gold);stroke-width:2;stroke-dasharray:5 4}
.jp-radar .rc0{fill:color-mix(in oklab,var(--r5t) 16%,transparent);stroke:var(--r5t);stroke-width:2}
.jp-radar .rl{font-size:var(--fs-lbl);font-weight:600;letter-spacing:.08em;fill:var(--text-3)}
.jp-radar .rv{font-size:var(--fs-2);font-weight:700;fill:var(--text)}
.jp-legend{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s4);margin-top:var(--s2);font-size:var(--fs-1);color:var(--text-2)}
.jp-legend span{display:inline-flex;align-items:center;gap:6px}
.jp-legend i{display:block;width:16px}
.jp-legend .lc{height:3px;background:var(--r5t)}
.jp-legend .lp{border-top:2px dashed var(--gold)}
.jp-bestpos{border-top:1px solid var(--border)}
.jp-bestpos .bp{display:grid;grid-template-columns:96px minmax(0,1fr) auto;align-items:center;gap:var(--s3);min-height:42px;border-bottom:1px solid var(--border)}
.jp-bestpos .pc{font-size:var(--fs-2);font-weight:650}

/* edición a edición: fila con scroll horizontal */
.jp-eds{display:flex;gap:var(--s4);overflow-x:auto;padding-bottom:var(--s1);scroll-snap-type:x proximity;scrollbar-width:thin}
.jp-ed{flex:0 0 260px;scroll-snap-align:start;display:grid;grid-template-columns:72px minmax(0,1fr);gap:var(--s3) var(--s4);padding:var(--s4);border:1px solid var(--border-strong);border-radius:var(--rad-3);color:var(--text);text-decoration:none}
a.jp-ed:hover{border-color:var(--text-3);color:var(--text)}
.jp-ed.is-prime{border-color:var(--gold);background:var(--gold-dim)}
.jp-ed-h{grid-column:1/-1;display:flex;align-items:center;gap:var(--s2)}
.jp-ed-h b{font-size:var(--fs-num-1);font-weight:800;line-height:1;margin-right:auto}
.jp-ed .tag{font-size:var(--fs-lbl);font-weight:700;letter-spacing:.06em;padding:var(--s1) var(--s2);border-radius:var(--rad-1)}
.jp-ed .tag.cur{color:var(--accent-ink);background:var(--accent-dim)}
.jp-ed .tag.prime{color:var(--gold);background:var(--gold-dim)}
.jp-ed-ph{position:relative;width:72px;height:72px;border-radius:var(--rad-2);background:var(--surface-2)}
.jp-ed-ph>img{width:72px;height:72px;border-radius:var(--rad-2);object-fit:cover;object-position:top center;display:block}
.jp-ed-ph .cr{position:absolute;right:-8px;bottom:-6px;padding:2px;border-radius:99px;background:var(--surface)}
.jp-ed-b{display:flex;flex-direction:column;gap:6px;min-width:0;font-size:var(--fs-1);color:var(--text-2)}
.jp-ed-b>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jp-ed-n{display:flex;align-items:center;gap:var(--s2)}
.jp-ed-n .pl{color:var(--text-3)}
.jp-ed-n b{font-size:var(--fs-4);font-weight:700}
.jp-ed-n .jd{margin-left:auto}
.jp-ed-f{grid-column:1/-1;display:flex;justify-content:space-between;gap:var(--s2);padding-top:var(--s3);border-top:1px solid var(--border);font-size:var(--fs-1);color:var(--text-3)}

/* historial de cambios */
.jp-hist{list-style:none;margin:0;padding:0;border-top:1px solid var(--border)}
.jp-hist>li{display:grid;grid-template-columns:200px minmax(0,1fr);gap:var(--s5);padding:var(--s4) 0;border-bottom:1px solid var(--border)}
.jh-when{display:flex;flex-direction:column;gap:2px}
.jh-when a{color:var(--text)}
.jh-when a:hover{color:var(--accent-ink)}
.jh-when b{font-size:var(--fs-2);font-weight:700}
.jh-when>span:not(.jh-ovr){font-size:var(--fs-1);color:var(--text-3)}
.jh-what{display:flex;flex-direction:column;gap:var(--s3);min-width:0}
.jh-what p{margin:0;font-size:var(--fs-2);line-height:1.6}
.jh-none{color:var(--text-3)}
/* cambios de una actualización (includes/hist-changes.html.twig): marcadores, caras, atributos y etiquetas */
.jh-what em{font-style:normal;font-weight:700;font-size:var(--fs-1);font-variant-numeric:tabular-nums}
.jh-what em.up{color:var(--up)}
.jh-what em.down{color:var(--down)}
.hx-head{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s6)}
.hx-k{display:flex;flex-direction:column;gap:2px;min-width:0}
.hx-v{display:inline-flex;align-items:baseline;gap:6px;min-width:0;font-size:var(--fs-2);white-space:nowrap}
.hx-v b{font-weight:700;color:var(--text)}
.hx-v s{text-decoration:none;color:var(--text-3)}
.hx-v i{font-style:normal;color:var(--text-3)}
.hx-k.num .hx-v b{font-family:var(--font-display);font-stretch:75%;font-size:var(--fs-5);font-weight:800;line-height:1}
.hx-k.add b{color:var(--up)}
.hx-k.rm b{color:var(--text-3);text-decoration:line-through}
.hx-face{display:flex;flex-wrap:wrap;gap:var(--s2)}
.hx-f{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 var(--s3);border:1px solid var(--border);border-radius:var(--rad-1);background:var(--surface)}
.hx-f .lbl{letter-spacing:.04em}
.hx-f b{font-family:var(--font-display);font-stretch:80%;font-size:var(--fs-4);font-weight:700;line-height:1;font-variant-numeric:tabular-nums}
.hx-attr{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));column-gap:var(--s6);row-gap:2px}
.hx-attr li{display:grid;grid-template-columns:minmax(0,1fr) 26px 32px;gap:var(--s2);align-items:baseline;padding:3px 0;font-size:var(--fs-1)}
.hx-attr li>span{color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hx-attr b{font-weight:700;text-align:right;font-variant-numeric:tabular-nums;color:var(--text)}
.hx-attr em{text-align:right}
.hx-more>summary{list-style:none;display:inline-block;margin-top:var(--s1);font-size:var(--fs-1);font-weight:600;color:var(--accent-ink);cursor:pointer}
.hx-more>summary::-webkit-details-marker{display:none}
.hx-more[open]>summary{display:none}
.hx-tags{display:flex;flex-wrap:wrap;gap:var(--s2)}
.hx-tags .ps,.hx-tags .role{height:32px;gap:6px}
.hx-op{display:inline-block;font-style:normal;font-weight:800;font-size:var(--fs-2);line-height:1}
.hx-add .hx-op,.hx-up .hx-op{color:var(--up)}
.hx-rm .hx-op,.hx-down .hx-op{color:var(--down)}
.hx-add:not(.plus){border-color:color-mix(in oklab,var(--up) 55%,transparent)}
.hx-rm{color:var(--text-3);border-style:dashed;text-decoration:line-through;text-decoration-color:var(--text-3)}
.hx-rm.plus{background:none;color:var(--text-3)}
.ps.hx-rm::before{background:var(--text-3)}
.role em s{text-decoration:none;color:var(--text-3);letter-spacing:0}
.role em i{font-style:normal;color:var(--text-3);margin:0 2px;letter-spacing:0}
.hx-g{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 var(--s3);border:1px solid var(--border-strong);border-radius:var(--rad-1);font-size:var(--fs-1);white-space:nowrap}
.hx-g .lbl{margin-right:2px}
.hx-g s{text-decoration:none;color:var(--text-3)}
.hx-g i{font-style:normal;color:var(--text-3)}
.hx-g b{font-weight:650}
.hx-g.hx-up b{color:var(--up)}
.hx-g.hx-down b{color:var(--down)}
.hx-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* guía editorial + FAQ */
.pguide{display:flex;flex-direction:column;gap:var(--s4);max-width:700px}
.pguide .pg-k{color:var(--gold)}
.pg-h{margin:0;font-size:var(--fs-6);font-weight:800;line-height:1.1}
.pg-tldr{margin:0;font-size:var(--fs-4);line-height:1.6}
.pg-tldr b{font-weight:800}
.pg-by{margin:0;font-size:var(--fs-1);color:var(--text-3)}
.pg-by b{color:var(--text-2);font-weight:700}
.pg-sec{display:flex;flex-direction:column;gap:var(--s2)}
.pg-q{margin:0;font-size:var(--fs-3);font-weight:700}
.pg-a{margin:0;font-size:var(--fs-3);line-height:1.65;color:var(--text-2)}
.pg-a b{color:var(--text);font-weight:700}
.pg-faq{border-top:1px solid var(--border)}
.pg-fq{border-bottom:1px solid var(--border)}
.pg-fq summary{display:flex;justify-content:space-between;align-items:center;gap:var(--s3);min-height:52px;cursor:pointer;list-style:none;font-size:var(--fs-2);font-weight:600;color:var(--text)}
.pg-fq summary::-webkit-details-marker{display:none}
.pg-fq summary::after{content:'+';flex:none;font-size:var(--fs-4);font-weight:400;color:var(--text-3)}
.pg-fq[open] summary::after{content:'–'}
.pg-fq p{margin:0 0 var(--s3);font-size:var(--fs-2);line-height:1.6;color:var(--text-2)}
.pg-fq p b{color:var(--text)}

/* lateral: Modo Carrera, ficha, especialidades, similares */
.jp-cm{display:flex;flex-direction:column;gap:var(--s3);padding:var(--s5);border:1px solid var(--border);border-radius:var(--rad-3);background:var(--surface)}
.jp-cm .jp-cm-k{color:var(--accent-ink)}
.jp-cm-big{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s4)}
.jp-cm-big>div{display:flex;flex-direction:column;gap:2px;min-width:0}
.jp-cm-big b{font-size:var(--fs-num-1);font-weight:800;line-height:1;white-space:nowrap}
.jp-cm-t{margin:0;font-size:var(--fs-1);line-height:1.5;color:var(--text-2)}
.jp-cm-a{display:flex;gap:var(--s2)}
.jp-cm-a .btn.pri{flex:1}
.jdl{margin:0;border-top:1px solid var(--border)}
.jdl>div{display:flex;justify-content:space-between;align-items:center;gap:var(--s3);min-height:42px;border-bottom:1px solid var(--border);font-size:var(--fs-1)}
.jdl dt{color:var(--text-2)}
.jdl dd{margin:0;font-weight:600;text-align:right;color:var(--text)}
.jdl dd a{color:var(--text)}
.jdl dd a:hover{color:var(--accent-ink)}
.jp-side{display:flex;flex-direction:column;gap:var(--s3)}
.jp-side-h{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s3)}
.jp-side-h a{font-size:var(--fs-1);font-weight:600}
.jp-h3{margin:0;font-family:var(--font-display);font-size:var(--fs-5);font-weight:760;font-stretch:85%}
.jp-traits-h{margin-top:var(--s2)}
.jp-simlist{border-top:1px solid var(--border)}
.jp-sim .sr{display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:var(--s3);min-height:60px;border-bottom:1px solid var(--border);color:var(--text);text-decoration:none}
.jp-sim .sr:hover{background:var(--surface-2);color:var(--text)}
.jp-sim .sp{width:40px;height:40px;border-radius:99px;background:var(--surface-2);overflow:hidden}
.jp-sim .sp img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block}
.jp-sim .sn{display:flex;flex-direction:column;gap:2px;min-width:0}
.jp-sim .sn b{font-size:var(--fs-2);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jp-sim .sn>span{display:flex;align-items:center;gap:6px;min-width:0;font-size:var(--fs-1);color:var(--text-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jp-sim .sn .pc{font-weight:650}
.jp-cmts{min-width:0}
.jp-sim .jp-side-h{flex-direction:column;align-items:flex-start;gap:var(--s1)}
/* comentarios: sin caja propia y con la cabecera como título de sección (.sh h2) */
.jp-cmts .cmts{padding:0;border-top:0}
.jp-cmts .cmts-head .mo{font-family:var(--font-display);font-size:var(--fs-h2);font-weight:760;font-stretch:85%;letter-spacing:-.005em;line-height:1.15;text-transform:none;color:var(--text)}
.jp-cmts .cmts-head .mo::before{display:none}

/* ---------- historial completo (/player/{slug}/history) ---------- */
.jh-hd{display:grid;grid-template-columns:96px minmax(0,1fr) auto;align-items:center;gap:var(--s5);padding-top:var(--s5)}
.jh-photo{width:96px;height:96px;border-radius:var(--rad-3);background:var(--surface);overflow:hidden}
.jh-photo img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block}
.jh-id{min-width:0}
.jh-id h1{margin:0;font-size:var(--fs-num-2);font-weight:800;line-height:1;letter-spacing:-.01em}
.jh-now{display:flex;align-items:center;gap:var(--s5)}
.jh-now>span{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s1)}
.jh-now b{font-size:var(--fs-5);font-weight:800}
.jh-lead{max-width:760px;margin:var(--s5) 0 0;font-size:var(--fs-3);line-height:1.6;color:var(--text-2)}
.jh-ed{padding-top:var(--s7)}
.jh-ed .sh h2 a{color:var(--text)}
.jh-ed .sh h2 a:hover{color:var(--accent-ink)}
.jh-ovr{display:inline-flex;align-items:center;gap:var(--s2);margin-top:var(--s1)}
.jh-ovr b{font-size:var(--fs-2);font-weight:700}
.jh-quiet .jh-when b{font-weight:600;color:var(--text-2)}
.jh-foot{margin:var(--s6) 0 var(--s7)}

/* ---------- escritorio estrecho ---------- */
@media(max-width:1100px){
  .jp-hd{grid-template-columns:120px minmax(0,1fr);grid-template-areas:"photo name" "photo links" "photo acts" "score score" "prime prime" "faces faces" "game game" "tags tags" "rk rk"}
  .jp-photo{width:120px;height:120px}
  .jp-score{margin-top:var(--s5)}
  .jp-mini{display:none}
  .jp-groups{grid-template-columns:repeat(2,minmax(0,1fr))}
}
/* una columna: el lateral se intercala con el principal (orden de la maqueta móvil) */
@media(max-width:960px){
  .jp-body{display:flex;flex-direction:column;align-items:stretch;gap:var(--s7)}
  .jp-main,.jp-aside{display:contents}
  #atributos{order:1}
  #posiciones{order:2}
  #ediciones{order:3}
  #historial{order:4}
  .jp-cm{order:5}
  #guia{order:6}
  .jp-facts{order:7}
  .jp-specs{order:8}
  .jp-sim{order:9}
  .jp-cmts{order:10}
}

/* ---------- móvil ---------- */
@media(max-width:768px){
  .jp .jl{display:none}
  .jp .js{display:inline}
  .jp-crumbs .jp-home{display:none}
  .jp-hd{grid-template-columns:84px minmax(0,1fr);column-gap:var(--s3);align-items:center;padding-top:var(--s3);
    grid-template-areas:"photo name" "links links" "score score" "prime prime" "faces faces" "acts acts" "game game" "tags tags" "rk rk"}
  .jp-photo{width:84px;height:84px;border-radius:var(--rad-3)}
  .jp-pos{margin-top:var(--s2)}
  .jp-when{flex-basis:100%;margin:var(--s1) 0 0}
  .jp-links{margin-top:var(--s3)}
  .jp-ent{font-size:var(--fs-1);gap:var(--s2) var(--s3)}
  .jp-ent>i{display:none}
  .jp-bio{font-size:var(--fs-1)}
  .jp-score{margin-top:var(--s4)}
  .jp-bar{display:none}
  .jp-money{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s2)}
  .jp-money>span{flex-direction:column;align-items:flex-start;gap:2px}
  .jp-money b{font-size:var(--fs-4)}
  .jp-prime{gap:var(--s2);margin-top:var(--s3);padding:0 var(--s3)}
  .jp-prime-t>b{font-size:var(--fs-1)}
  .jp-prime-n{min-width:0}
  .jp-prime-n .lbl{display:none}
  .jp-faces{column-gap:var(--s2);margin-top:var(--s3)}
  .jp-faces>div{display:flex;flex-direction:column;align-items:center;gap:6px;padding:var(--s2) 0 var(--s3)}
  .jp-faces .lbl{letter-spacing:.04em}
  .jp-faces b{font-size:var(--fs-num-1);justify-self:auto}
  .jp-faces .jbar{width:100%;height:3px}
  .jp-acts{display:grid;grid-template-columns:minmax(0,1fr) auto;margin-top:var(--s3)}
  .jp-game{margin-top:var(--s4);border-top:1px solid var(--border)}
  .jp-game>.d{display:none}
  .jp-game>div{flex:1 1 0;padding:var(--s2) var(--s2)}
  .jp-game>div:first-child{padding-left:0}
  .jp-game .v{font-size:var(--fs-3);white-space:normal;line-height:1.2}
  .jp-tags{grid-template-columns:minmax(0,1fr);gap:var(--s4);padding-top:var(--s5)}
  .jp-rk{flex-direction:column;align-items:flex-start;gap:var(--s2)}
  .jp-rk a.rk{max-width:100%}
  .jp-rk a.rk span{overflow:hidden;text-overflow:ellipsis}

  .jp-body{padding-top:var(--s5)}
  .jp-seg{margin-left:0}
  .jp-groups{grid-template-columns:minmax(0,1fr);gap:var(--s5)}
  .jp-rows{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--s4)}
  .ar{grid-template-columns:minmax(0,1fr) auto auto;grid-template-areas:"n d v" "b b b";row-gap:5px;min-height:0;padding:var(--s2) 0}
  .ar .an{grid-area:n}
  .ar .ad{grid-area:d}
  .ar .av{grid-area:v;font-size:var(--fs-3);font-weight:700}
  .ar .jbar{grid-area:b;height:3px}
  .jp-posgrid{grid-template-columns:minmax(0,1fr);gap:var(--s5)}
  .jp-posside{order:-1}
  .jp-radar svg{margin:0 auto}
  .jp-legend{justify-content:center}
  .jp-pitch pitch-board{max-width:420px;margin:0 auto}
  .jp-eds-sec .jp-eds{margin-inline:calc(var(--s4) * -1);padding-inline:var(--s4);scroll-padding-inline:var(--s4);scroll-snap-type:x mandatory}
  .jp-ed{flex-basis:164px;grid-template-columns:minmax(0,1fr);padding:var(--s3)}
  .jp-ed-ph,.jp-ed-ph>img{width:64px;height:64px}
  .jp-ed-h b{font-size:var(--fs-5)}
  .jp-ed-f{flex-direction:column;gap:2px;padding-top:var(--s2)}
  .jp-hist>li{grid-template-columns:minmax(0,1fr);gap:var(--s1);padding:var(--s3) 0}
  .jh-when{flex-direction:row;flex-wrap:wrap;gap:0 var(--s2);align-items:baseline}
  .jh-what p{font-size:var(--fs-2)}
  .hx-head{gap:var(--s2) var(--s5)}
  .hx-attr{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--s4)}
  .hx-g{white-space:normal;height:auto;min-height:32px;padding:var(--s1) var(--s3);flex-wrap:wrap}
  .pg-h{font-size:var(--fs-5)}
  .pg-tldr{font-size:var(--fs-3);color:var(--text-2)}
  .jp-cm{padding:var(--s4)}
  .jh-hd{grid-template-columns:72px minmax(0,1fr);gap:var(--s3)}
  .jh-photo{width:72px;height:72px}
  .jh-id h1{font-size:var(--fs-num-1)}
  .jh-now{grid-column:1/-1;gap:var(--s4)}
  .jh-now .btn{margin-left:auto}
  .jh-ed{padding-top:var(--s6)}
}