:root{--paper:#F5F5F0;--paper-2:#EAEBE4;--ink:#1B1F2A;--ink-2:#4F5462;--rule:#C8CAC0;--accent:#A8391F;--ok:#0B6E75;--part:#8A5A00;--ko:#7E1E4E;--var:#4B3496;--note:#8A5A00;--sheet:#3E5872;--health:#B0362B;--healthy:#2F7A3B;--stress:#8A6400;--breakdown:#4B3B52;--f-display:'Barlow Condensed','Arial Narrow',sans-serif;--plaque:#14171E;--plaque-fg:#E5E6E1;--plaque-acc:#E8896A}
:root[data-genre="grimoire"]{--paper:#F0E7D3;--paper-2:#E5D9BF;--ink:#2A2118;--ink-2:#5E4E3A;--rule:#CDBE9F;--accent:#8C2B1B;--ok:#3F6B3A;--part:#85600F;--ko:#6E2350;--var:#4E3A7E;--note:#85600F;--sheet:#4D5566;--health:#9A2E22;--healthy:#3F6B3A;--stress:#85600F;--breakdown:#4A3550;--f-display:'Cormorant Garamond',Garamond,'Times New Roman',serif;--plaque:#1C1813;--plaque-fg:#EAE0CC;--plaque-acc:#E0866E}
:root[data-genre="pulp"]{--paper:#EDEBE4;--paper-2:#E0DDD3;--ink:#111418;--ink-2:#4A4E55;--rule:#BDBAB0;--accent:#2A5D93;--ok:#1F6E5A;--part:#8F5A00;--ko:#A8231C;--var:#4B3496;--note:#8F5A00;--sheet:#33506E;--health:#A8231C;--healthy:#2E6E37;--stress:#8F5A00;--breakdown:#3F3247;--f-display:'Anton',Impact,'Arial Narrow',sans-serif;--plaque:#121519;--plaque-fg:#E6E3DA;--plaque-acc:#8AB4E8}
:root[data-genre="neon"]{--paper:#EEF1F5;--paper-2:#E1E6EE;--ink:#10131A;--ink-2:#4A5262;--rule:#C3CAD6;--accent:#007480;--ok:#0B7A4B;--part:#8F6200;--ko:#B01552;--var:#5E35B1;--note:#8F6200;--sheet:#2E4A66;--health:#B3261E;--healthy:#0B7A4B;--stress:#8F6200;--breakdown:#42305A;--f-display:'Chakra Petch','Barlow Condensed','Arial Narrow',sans-serif;--plaque:#0B0D12;--plaque-fg:#E4F2F5;--plaque-acc:#00E5FF}
:root[data-genre="archives"]{--paper:#E8E8E1;--paper-2:#DADBD2;--ink:#1D211E;--ink-2:#545A55;--rule:#B9BCB3;--accent:#7A1C1C;--ok:#3D5E52;--part:#7F6420;--ko:#5A2D6B;--var:#3E4F7A;--note:#7F6420;--sheet:#3E4F5E;--health:#7A1C1C;--healthy:#3D5E3A;--stress:#7F6420;--breakdown:#3C2E42;--f-display:'Special Elite','Courier New',monospace;--plaque:#121412;--plaque-fg:#DCDDD4;--plaque-acc:#D9776F}
@media screen and (prefers-color-scheme: dark){
:root:not([data-theme="light"]){--paper:#14171E;--paper-2:#1D2129;--ink:#E5E6E1;--ink-2:#A7ABB5;--rule:#363B47;--accent:#E8896A;--ok:#6FBDBD;--part:#E1B15A;--ko:#E58AB3;--var:#AB97EE;--note:#E1B15A;--sheet:#9FB6CD;--health:#E58A80;--healthy:#7CC488;--stress:#E1B15A;--breakdown:#C3AECB;color-scheme:dark}
:root[data-genre="grimoire"]:not([data-theme="light"]){--paper:#1C1813;--paper-2:#26201A;--ink:#EAE0CC;--ink-2:#B5A88F;--rule:#3F3529;--accent:#E0866E;--ok:#9CC48F;--part:#E0B55E;--ko:#D98AB8;--var:#B3A1E0;--note:#E0B55E;--sheet:#A9B3C4;--health:#E08A72;--healthy:#9CC48F;--stress:#E0B55E;--breakdown:#C4AACD;color-scheme:dark}
:root[data-genre="pulp"]:not([data-theme="light"]){--paper:#121519;--paper-2:#1B1F25;--ink:#E6E3DA;--ink-2:#A6A9AF;--rule:#343941;--accent:#8AB4E8;--ok:#6FC2A8;--part:#E1B15A;--ko:#F08A80;--var:#AB97EE;--note:#E1B15A;--sheet:#9DB7D3;--health:#F08A80;--healthy:#7FC98B;--stress:#E1B15A;--breakdown:#C1ABCB;color-scheme:dark}
:root[data-genre="neon"]:not([data-theme="light"]){--paper:#0B0D12;--paper-2:#141823;--ink:#E4F2F5;--ink-2:#8C9AAE;--rule:#263042;--accent:#00E5FF;--ok:#4BE3A0;--part:#FFC857;--ko:#FF4FA3;--var:#B48CFF;--note:#FFC857;--sheet:#8FB8DE;--health:#FF6B6B;--healthy:#4BE3A0;--stress:#FFC857;--breakdown:#C9A8FF;color-scheme:dark}
:root[data-genre="archives"]:not([data-theme="light"]){--paper:#121412;--paper-2:#1A1D1A;--ink:#DCDDD4;--ink-2:#9A9E95;--rule:#303530;--accent:#D9776F;--ok:#8FB8A8;--part:#D6B66A;--ko:#C39AD6;--var:#9DB0DB;--note:#D6B66A;--sheet:#9FB3C4;--health:#D9776F;--healthy:#9DBF8F;--stress:#D6B66A;--breakdown:#BBA3C6;color-scheme:dark}}
@media screen{
:root[data-theme="dark"]{--paper:#14171E;--paper-2:#1D2129;--ink:#E5E6E1;--ink-2:#A7ABB5;--rule:#363B47;--accent:#E8896A;--ok:#6FBDBD;--part:#E1B15A;--ko:#E58AB3;--var:#AB97EE;--note:#E1B15A;--sheet:#9FB6CD;--health:#E58A80;--healthy:#7CC488;--stress:#E1B15A;--breakdown:#C3AECB;color-scheme:dark}
:root[data-theme="dark"][data-genre="grimoire"]{--paper:#1C1813;--paper-2:#26201A;--ink:#EAE0CC;--ink-2:#B5A88F;--rule:#3F3529;--accent:#E0866E;--ok:#9CC48F;--part:#E0B55E;--ko:#D98AB8;--var:#B3A1E0;--note:#E0B55E;--sheet:#A9B3C4;--health:#E08A72;--healthy:#9CC48F;--stress:#E0B55E;--breakdown:#C4AACD;color-scheme:dark}
:root[data-theme="dark"][data-genre="pulp"]{--paper:#121519;--paper-2:#1B1F25;--ink:#E6E3DA;--ink-2:#A6A9AF;--rule:#343941;--accent:#8AB4E8;--ok:#6FC2A8;--part:#E1B15A;--ko:#F08A80;--var:#AB97EE;--note:#E1B15A;--sheet:#9DB7D3;--health:#F08A80;--healthy:#7FC98B;--stress:#E1B15A;--breakdown:#C1ABCB;color-scheme:dark}
:root[data-theme="dark"][data-genre="neon"]{--paper:#0B0D12;--paper-2:#141823;--ink:#E4F2F5;--ink-2:#8C9AAE;--rule:#263042;--accent:#00E5FF;--ok:#4BE3A0;--part:#FFC857;--ko:#FF4FA3;--var:#B48CFF;--note:#FFC857;--sheet:#8FB8DE;--health:#FF6B6B;--healthy:#4BE3A0;--stress:#FFC857;--breakdown:#C9A8FF;color-scheme:dark}
:root[data-theme="dark"][data-genre="archives"]{--paper:#121412;--paper-2:#1A1D1A;--ink:#DCDDD4;--ink-2:#9A9E95;--rule:#303530;--accent:#D9776F;--ok:#8FB8A8;--part:#D6B66A;--ko:#C39AD6;--var:#9DB0DB;--note:#D6B66A;--sheet:#9FB3C4;--health:#D9776F;--healthy:#9DBF8F;--stress:#D6B66A;--breakdown:#BBA3C6;color-scheme:dark}}

:root{--co:#0B6E75;--ve:#8A5A00;--bo:#2A5D93;--ar:#A3225F;--no:#4B3496;--on-acte:#FFFFFF}
@media screen and (prefers-color-scheme: dark){:root:not([data-theme="light"]){--co:#62C3C7;--ve:#E1B15A;--bo:#8AB4E8;--ar:#EB7FAE;--no:#AB97EE;--on-acte:#14171E}}
@media screen{:root[data-theme="dark"]{--co:#62C3C7;--ve:#E1B15A;--bo:#8AB4E8;--ar:#EB7FAE;--no:#AB97EE;--on-acte:#14171E}}

/* Layout: an RPG manual. Sticky table of contents on the left, full-width text column, GM notes in the right margin on a wide screen. */
/* Colours and heading font: tokens generated from data/site/genres.yaml (accent, ok, part, ko, var, note…).
   The tinted backgrounds derive from them. No synthetic bold: a single-weight heading font stays crisp. */
:root{
  --f-label:'Barlow','Helvetica Neue',Arial,sans-serif;
  --f-body:'Source Serif 4',Georgia,'Times New Roman',serif;
  --accent-bg:color-mix(in srgb,var(--accent) 12%,var(--paper));
  --ok-bg:color-mix(in srgb,var(--ok) 12%,var(--paper));
  --part-bg:color-mix(in srgb,var(--part) 14%,var(--paper));
  --ko-bg:color-mix(in srgb,var(--ko) 13%,var(--paper));
  --var-bg:color-mix(in srgb,var(--var) 12%,var(--paper));
  --note-bg:color-mix(in srgb,var(--note) 14%,var(--paper));
  font-synthesis-weight:none;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}
body{background:var(--paper);color:var(--ink);font-family:var(--f-body);font-size:17px;line-height:1.6;margin:0;padding-inline:16px;padding-block:0 64px}
.livre{--marge:260px;--gouttiere:40px;max-width:1300px;margin:0 auto;display:grid;grid-template-columns:200px minmax(0,1fr);column-gap:48px}
@media (max-width:900px){.livre{grid-template-columns:minmax(0,1fr);gap:0}}

/* Table of contents */
.sommaire{position:sticky;top:env(safe-area-inset-top,0px);align-self:start;padding-block:16px 24px;font-family:var(--f-label);font-size:14px}
.sommaire .marque{font-family:var(--f-display);font-weight:700;font-size:34px;letter-spacing:.06em;line-height:1}
.sommaire .ver{color:var(--ink-2);font-size:13px;margin-top:2px}
.sommaire ol{list-style:none;margin:24px 0 0;padding:0;display:flex;flex-direction:column;gap:2px;counter-reset:ch}
.sommaire a{display:flex;gap:10px;color:var(--ink-2);text-decoration:none;padding:4px 6px;border-radius:4px}
.sommaire a:hover,.sommaire a:focus-visible{color:var(--ink);background:var(--paper-2)}.sommaire a:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.sommaire a span{font-variant-numeric:tabular-nums;color:var(--accent);font-weight:700;width:18px}
@media (max-width:900px){.sommaire{position:static;padding-block:12px 8px}
  .sommaire ol{flex-direction:row;flex-wrap:wrap;gap:4px}.sommaire a{border:1px solid var(--rule);padding:3px 8px}.sommaire a span{width:auto}}

/* Text */
main{min-width:0;padding-top:16px}
.couverture{border-bottom:3px solid var(--ink);padding-bottom:28px;margin-bottom:8px}
.couverture .surtitre{font-family:var(--f-label);font-weight:600;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.couverture h1{font-family:var(--f-display);font-weight:700;font-size:clamp(56px,10vw,104px);line-height:.9;letter-spacing:.02em;margin:8px 0 0;text-transform:uppercase}
.couverture h1 small{display:block;font-size:34px;letter-spacing:.08em;color:var(--ink-2);font-weight:600;margin-top:10px}
.couverture p{font-size:19px;margin:20px 0 0}
.couverture .note{margin:20px 0 0}
.couv-regles > .surtitre,.couv-regles > h1{text-align:center}
.couv-regles > h1 .logo-plaque{display:block;margin-inline:auto}

section.chap{padding-top:56px;scroll-margin-top:12px}
.chap-tete{display:flex;align-items:baseline;gap:16px;border-bottom:1.5px solid var(--ink);padding-bottom:8px;margin-bottom:20px}
.chap-tete .num{font-family:var(--f-display);font-weight:700;font-size:64px;line-height:.8;color:var(--accent);font-variant-numeric:tabular-nums lining-nums}
.chap-tete h2{font-family:var(--f-display);font-weight:700;font-size:40px;line-height:1;margin:0;text-transform:uppercase;letter-spacing:.03em;text-wrap:balance}
h3{font-family:var(--f-display);font-weight:700;font-size:24px;text-transform:uppercase;letter-spacing:.04em;margin:36px 0 8px;line-height:1.1;text-wrap:balance}
h4{font-family:var(--f-label);font-weight:700;font-size:15px;text-transform:uppercase;letter-spacing:.08em;margin:22px 0 4px;color:var(--ink)}
p{margin:0 0 12px}
.chapo{font-size:19px;color:var(--ink)}
strong{font-weight:600}
/* Variant names: Blockbuster in the identity colour (that of its default card), Raw in that of the variant boxes. */
strong.v-blockbuster{font-weight:700;color:var(--accent)}strong.v-raw{font-weight:700;color:var(--var)}
.terme{font-family:var(--f-label);font-weight:700;font-size:.92em;letter-spacing:.01em}

/* Right margin: the GM notes (and the variant notes) float outside the text column, level
   with the passage they go with. In a duo, the note comes before the text in the HTML;
   in a single column, it goes back after. */
.duo{display:flex;flex-direction:column}
.duo > .note{order:1}
@media (min-width:1181px){
  main{padding-right:calc(var(--marge) + var(--gouttiere))}
  .duo{display:block}
  .partie > .note,.duo > .note{float:right;clear:right;width:var(--marge);margin:4px calc(-1 * (var(--marge) + var(--gouttiere))) 16px 0}
  /* Variant notes stay in the text column; a section holds its margin notes. */
  .partie > .note.ton{float:none;clear:none;width:auto;margin:6px 0 16px}
  section.chap .partie{display:flow-root}
}

/* Boxes */
.encart{border:2px solid var(--ink);background:var(--paper);margin:20px 0;position:relative}
.encart > .titre{display:inline-block;background:var(--ink);color:var(--paper);font-family:var(--f-display);font-weight:700;font-size:18px;letter-spacing:.06em;text-transform:uppercase;padding:3px 12px}
.encart > .corps{padding:12px 18px 6px}
.encart.regle{border-color:var(--accent)}.encart.regle > .titre{background:var(--accent)}
.encart.regle > .corps{background:var(--accent-bg)}
.encart.ton{border-color:var(--var)}.encart.ton > .titre{background:var(--var)}
.encart.ton > .corps{background:var(--var-bg)}

.note{font-family:var(--f-label);font-size:14.5px;line-height:1.5;border-top:3px solid var(--note);background:var(--note-bg);padding:10px 14px 12px;margin:6px 0 16px}
.note .eti{display:block;font-family:var(--f-display);font-weight:700;font-size:15px;letter-spacing:.1em;text-transform:uppercase;color:var(--note);margin-bottom:4px}
.note table{font-size:13px}.note th,.note td{padding:4px 6px}.note th{font-size:13px}
.note p{margin:0 0 6px}.note p:last-child{margin:0}

.exemple{border-left:4px solid var(--ink-2);padding:4px 0 4px 16px;margin:16px 0;font-style:italic;color:var(--ink)}
.exemple .eti{font-family:var(--f-label);font-style:normal;font-weight:700;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2);display:block;margin-bottom:2px}
.exemple p:last-child{margin-bottom:0}
.lire{border-left:4px solid var(--ink-2);background:var(--paper-2);padding:10px 18px 10px 20px;margin:14px 0 18px;font-size:1.04em;line-height:1.65;font-style:italic}
.lire .eti{font-family:var(--f-label);font-style:normal;font-weight:700;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2);display:block;margin-bottom:4px}
.lire p{margin:0 0 8px}.lire p:last-child{margin-bottom:0}

.note.ton{border-top-color:var(--var);background:var(--var-bg)}.note.ton .eti{color:var(--var)}
.encart.ton .corps h4{margin-top:14px;color:var(--var)}
.jp{white-space:nowrap}
.renvois{margin:10px 0 6px;font-family:var(--f-label);font-size:13px;color:var(--ink-2)}
.renvois .renvoi{white-space:normal}
.profil .carte{margin:6px 0 0}
.renvoi{font-family:var(--f-label);font-size:13px;font-weight:600;color:var(--var);white-space:nowrap}

/* Tables */
.tab{overflow-x:auto;margin:14px 0 18px;max-width:100%}
table{border-collapse:collapse;font-family:var(--f-label);font-size:15px;line-height:1.4;min-width:100%}
th{font-family:var(--f-display);font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:15px;text-align:left;background:var(--ink);color:var(--paper);padding:6px 10px}
td{padding:6px 10px;border-bottom:1px solid var(--rule);vertical-align:top}
tbody tr:nth-child(even) td{background:var(--paper-2)}
td.n,th.n{text-align:center;font-variant-numeric:tabular-nums;white-space:nowrap}
td b{font-weight:700}
.tab.etroit table{min-width:0}

/* Dice */
.des{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:12px 0 18px}
.de{width:44px;height:44px}
.de rect{fill:var(--paper);stroke:var(--ink-2);stroke-width:2.5}
.de circle{fill:var(--ink-2)}
.de.hit rect{fill:var(--ok);stroke:var(--ok)}
.de.hit circle{fill:var(--paper)}
.des .leg{font-family:var(--f-label);font-weight:600;font-size:14px;color:var(--ok);margin-left:6px}

/* Results */
.resultats{display:grid;gap:0;margin:14px 0 18px;border:2px solid var(--ink)}
.resultats > div{display:grid;grid-template-columns:150px minmax(0,1fr);border-top:1px solid var(--rule)}
.resultats > div:first-child{border-top:0}
.resultats .k{font-family:var(--f-display);font-weight:700;font-size:19px;text-transform:uppercase;letter-spacing:.04em;padding:10px 12px;color:var(--paper)}
.resultats .v{padding:10px 14px}
.resultats .v p{margin:0}
.r-ok .k{background:var(--ok)}.r-part .k{background:var(--part)}.r-ko .k{background:var(--ko)}
@media (max-width:520px){.resultats > div{grid-template-columns:minmax(0,1fr)}}

/* Gauges */
.jauge{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:3px;margin:14px 0 20px;max-width:560px;font-family:var(--f-label)}
.jauge .c{border:2px solid var(--ink);text-align:center;font-family:var(--f-display);font-weight:700;font-size:22px;padding:6px 0;font-variant-numeric:tabular-nums}
.jauge .l{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;padding:4px 4px 0;border-top:3px solid;line-height:1.25}
@media (max-width:520px){.jauge .l{font-size:10px;letter-spacing:0;padding:4px 1px 0;overflow-wrap:anywhere;hyphens:auto}}
.jauge .c.z1{background:var(--paper)}.jauge .l.z1{border-color:var(--ok);color:var(--ok)}
.jauge .c.z2{background:var(--part-bg)}.jauge .l.z2{border-color:var(--part);color:var(--part)}
.jauge .c.z3{background:var(--ok);color:var(--paper);border-color:var(--ok)}.jauge .l.z3{border-color:var(--ok);color:var(--ok)}
.sante .c.z3{background:var(--ko-bg);color:var(--ink);border-color:var(--ink)}.sante .l.z3{border-color:var(--ko);color:var(--ko)}
.jauge .c.z4{background:var(--ink);color:var(--paper)}.jauge .l.z4{border-color:var(--ink);color:var(--ink)}

/* Cards side by side: variants, item benchmarks */
.formes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:14px 0 18px}
.formes.reperes{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:760px){.formes{grid-template-columns:minmax(0,1fr)}}
/* The usable width of an A4 page goes under 760 px: the benchmarks of the Équipement chapter keep their columns on paper. */
@media print{.formes.reperes{grid-template-columns:repeat(2,minmax(0,1fr))}}
.forme{display:flex;flex-direction:column;border:2px solid var(--ink);padding:10px 14px 12px;font-family:var(--f-label);font-size:15px;line-height:1.45}
.forme h5{font-family:var(--f-display);font-weight:700;font-size:22px;text-transform:uppercase;letter-spacing:.05em;margin:0 0 4px;color:var(--accent)}
.forme p{margin:0 0 6px}p.lim{margin:6px 0 0;color:var(--ink-2);font-size:15px;line-height:1.45}.forme .lim{color:var(--ink-2);font-size:14px}
.forme p:has(> small:only-child){margin:auto 0 0;padding-top:8px}
.forme small{display:block;border-top:1px solid var(--rule);padding-top:6px;color:var(--ink-2);font-size:14px;font-style:italic}
.forme.defaut{position:relative;border-color:var(--accent);border-width:3px;padding:9px 13px 11px}
.forme.raw{border-color:var(--var)}.forme.raw h5{color:var(--var)}
.forme h5 .eti{position:absolute;top:-10px;right:10px;padding:1px 6px;background:var(--accent);color:var(--paper);font-family:var(--f-label);font-size:11px;letter-spacing:.08em}

/* Numbered steps (real sequences) */
ol.etapes{list-style:none;padding:0;margin:8px 0 12px;counter-reset:e;display:flex;flex-direction:column;gap:6px}
ol.etapes li{counter-increment:e;display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;align-items:baseline}
ol.etapes li::before{content:counter(e);font-family:var(--f-display);font-weight:700;font-size:16px;width:24px;height:24px;line-height:24px;text-align:center;border-radius:50%;background:var(--ink);color:var(--paper)}
.regle ol.etapes li::before{background:var(--accent)}

/* Formula */
.formule{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-family:var(--f-display);font-weight:700;font-size:22px;text-transform:uppercase;letter-spacing:.03em;margin:10px 0 14px}
.formule .t{border:2px solid var(--ink);padding:2px 12px;background:var(--paper)}
.formule .op{color:var(--accent);font-size:26px}

/* Resource ladder */
.echelle{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-family:var(--f-display);font-weight:700;font-size:22px;margin:10px 0 16px}
.echelle span{border:2px solid var(--ink);padding:2px 10px;min-width:52px;text-align:center}
.echelle span:nth-child(1){background:var(--accent);color:var(--paper);border-color:var(--accent)}
.echelle i{font-style:normal;color:var(--ink-2);font-size:18px}
.echelle span.vide{border-style:dashed;color:var(--ink-2);font-size:16px;text-transform:uppercase;letter-spacing:.05em}

/* Profile block (NPC, Menace) */
.profil{border-top:4px solid var(--ink);border-bottom:4px solid var(--ink);padding:10px 0;margin:18px 0;font-family:var(--f-label);font-size:15px;line-height:1.5}
.profil .nom{font-family:var(--f-display);font-weight:700;font-size:26px;text-transform:uppercase;letter-spacing:.04em;line-height:1}
.profil .type{color:var(--ink-2);font-style:italic;font-family:var(--f-body);margin-bottom:8px}
.profil-tete{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.profil-tete .etat{display:flex;flex-direction:column;align-items:flex-end;white-space:nowrap;font-weight:600}
.profil dl{display:grid;grid-template-columns:130px minmax(0,1fr);gap:4px 12px;margin:0}
.profil dt{font-weight:700;text-transform:uppercase;font-size:12.5px;letter-spacing:.08em;padding-top:2px}
.profil dd{margin:0}
@media (max-width:520px){.profil dl{grid-template-columns:minmax(0,1fr)}.profil dt{padding-top:6px}}
.profils{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:4px 28px}
.profils .profil{margin:10px 0}
.profils .profil dl{grid-template-columns:120px minmax(0,1fr)}
.profil .etat{font-weight:600;margin-bottom:4px}
.objets-univ td:last-child{white-space:nowrap}
.profil .note-profil{margin:6px 0 0;color:var(--ink-2);font-style:italic;font-family:var(--f-body)}

/* Principles */
.credo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;background:var(--ink);border:2px solid var(--ink);margin:12px 0}
.credo div{background:var(--paper);padding:14px 16px}
.credo div:first-child{grid-column:1 / -1}
.credo div:first-child:nth-last-child(even){grid-column:auto}
@media (max-width:600px){.credo{grid-template-columns:minmax(0,1fr)}}
.credo b{display:block;font-family:var(--f-display);font-size:20px;text-transform:uppercase;letter-spacing:.03em;line-height:1.1;margin-bottom:4px}
.credo p{margin:0;font-size:16px}

ul.simple{margin:6px 0 12px;padding-left:20px}
ul.simple li{margin-bottom:4px}
a{color:var(--accent)}
a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.pied{margin-top:56px;border-top:1.5px solid var(--ink);padding-top:12px;font-family:var(--f-label);font-size:13px;color:var(--ink-2)}

/* Logo */
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.logo{display:block;height:auto;max-width:100%}
.logo-plaque{width:min(100%,560px);margin-top:12px}
.logo-plaque .lg-bg{fill:var(--plaque)}.logo-plaque .lg-acc{fill:var(--plaque-acc)}.logo-plaque .lg-fg{fill:var(--plaque-fg)}
.logo-nu{width:150px}
.logo-nu .lg-acc{fill:var(--accent)}.logo-nu .lg-fg{fill:var(--ink)}
.sommaire a.marque,.sommaire a.marque:hover{display:block;padding:0;background:none}
@media (max-width:900px){.logo-nu{width:120px}.sommaire a.marque{border:0}}
@media (max-width:520px){.couverture h1 small{font-size:24px}}

/* Character card: booklet pregens, enCORE archetypes, Tools library (characterCard). */
.perso{border:2px solid var(--ink);margin:28px 0;padding:0 20px 14px}
.perso > header{background:var(--ink);color:var(--paper);margin:0 -20px 14px;padding:10px 20px}
.perso h3{margin:0;color:var(--paper)}
.perso .role{font-family:var(--f-body);font-style:italic;font-size:16px;opacity:.85}
.stats{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;max-width:520px;margin:10px 0 8px}
.stats div{border:2px solid var(--ink);text-align:center;padding:4px 0 2px}
.stats span{display:block;font-family:var(--f-label);font-weight:700;font-size:12px;letter-spacing:.1em;color:var(--ink-2)}
.stats b{font-family:var(--f-display);font-size:28px;line-height:1}
.identite{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:2px 12px;margin:0 0 10px}
.identite dt{font-family:var(--f-label);font-weight:700;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);padding-top:2px}
.identite dd{margin:0}
.specs{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}
.specs span{font-family:var(--f-label);font-weight:600;font-size:14px;border:1.5px solid var(--accent);color:var(--accent);padding:2px 10px}
table.equip tr.monde td{border-top:2px solid var(--ink)}
table.equip tbody tr:first-child td{border-top:0}
table.equip tbody tr:nth-child(even) td{background:transparent}
table.equip td:first-child{width:150px}

/* Web build: layouts of the directives, and print. */
td strong{font-weight:700}
.formes > .tab,.formes > .note{margin:0}
.duo > div > .tab:first-child{margin-top:6px}
.couverture > .logo-plaque + .surtitre{margin-top:22px}

/* Print and PDF: A4, without table of contents. */
@page{size:A4;margin:12mm 13mm}
@media print{
  /* White paper, whatever the genre; the role colours stay. */
  :root{color-scheme:light;--paper:#fff !important;--paper-2:#f3f3f0 !important}
  body{padding:0}
  .livre{display:block;max-width:none}
  .sommaire{display:none}
  /* Links to the site's tools mean nothing on paper. */
  .renvoi.ecran{display:none}
  main{padding-top:0;padding-right:0}
  /* Colours printed as they are (table headers, boxes, chips). */
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  /* Slightly smaller text, chapters one after the other: less paper. The text
     runs from one page to the next; the figures (tables, boxes, gauges, grids)
     stay in one piece when they fit on a page, and a heading stays with what
     follows it. */
  section.chap{padding-top:22px}
  section.chap,.couverture{zoom:.8}
  .doc-livret section.chap{zoom:.77}
  .chap-tete{margin-bottom:12px;padding-bottom:5px}
  .chap-tete .num{font-size:40px}
  .chap-tete h2,.livret .chap-tete h2{font-size:28px}
  h3{font-size:18px;margin:16px 0 5px}
  .chap-tete,.tab,table,.credo,.formes,.forme,.jauge,.des,.frise,.phases,.profil,.profils,.encart,.note,.exemple,.lire,.resultats,.perso,.stats,tr{break-inside:avoid}
  .acte-tete,.chap-tete,h3,h4,h5,.eti,.encart > .titre{break-after:avoid}
  /* Long blocks split across pages rather than leave a gap; their rows and parts stay whole. */
  :is(.doc-regles,.doc-livret) :is(.credo,.formes,.encart,.note,.exemple,.lire,.perso),:is(.doc-regles,.doc-livret) :is(.tab,table):has(tbody tr:nth-child(6)){break-inside:auto}
  :is(.doc-regles,.doc-livret) :is(.credo > div,.forme,.encart li,.exemple p,.perso > *){break-inside:avoid}
  .perso > header{break-after:avoid}
  .encart:is(.presse,.sortie){break-inside:avoid}
  a{color:inherit;text-decoration:none}
  /* Cover alone on its sheet. Each chapter opens a page, except those marked
     « chained » in their header: they follow the previous one. */
  :is(.doc-regles,.doc-livret) .couverture{break-after:page}
  :is(.doc-regles,.doc-livret) .pied{display:none}
  :is(.doc-regles,.doc-livret) .flot{break-before:page}
  :is(.doc-regles,.doc-livret) section.chap.enchaine{padding-top:28px}
  /* Bordered blocks stay inside the printable area: the edge pixel can be clipped. */
  :is(.doc-regles,.doc-livret) section.chap{padding-inline:2px}
  /* enCORE: each universe sheet fits on a two-sided sheet (npm run pdf checks it).
     Profiles in two columns, tightened; a profile drawn from the data elsewhere in enCORE (.fiche-univ) is too. */
  .doc-encore .fiche-univers .profils{grid-template-columns:1fr 1fr;gap:0 18px;break-inside:auto}
  .doc-encore .fiche-univ .profil{font-size:12.5px;line-height:1.35;padding:5px 0;margin:5px 0;border-width:3px}
  .doc-encore .fiche-univ .profil .nom{font-size:17px}
  .doc-encore .fiche-univ .profil .type{margin-bottom:3px}
  .doc-encore .fiche-univ .profil dl{grid-template-columns:78px minmax(0,1fr);gap:1px 8px}
  .doc-encore .fiche-univ .profil dt{font-size:10.5px}
  .doc-encore .fiche-univers .objets-univ{font-size:12.5px;line-height:1.3}
  .doc-encore .fiche-univers .objets-univ td:first-child{white-space:nowrap}
  /* Rule book: book line spacing and tightened blocks (npm run pdf's cap). */
  .doc-regles section.chap{line-height:1.45}
  .doc-regles h3{margin:12px 0 4px}
  .doc-regles p{margin:0 0 7px}
  .doc-regles .chapo{font-size:17px}
  .doc-regles .encart{margin:10px 0}
  .doc-regles .encart > .corps{padding:8px 12px 2px}
  .doc-regles .note{margin:6px 0 10px;padding:7px 10px 8px}
  .doc-regles .exemple{margin:10px 0}
  .doc-regles :is(.tab,.resultats,.formes){margin:8px 0 10px}
  .doc-regles .jauge{margin:8px 0 12px}
  .doc-regles .credo div{padding:8px 12px}
  .doc-regles table{line-height:1.3}
  .doc-regles :is(td,th){padding:4px 7px}
  :is(.doc-regles,.doc-livret) .tab.insecable:has(tbody tr){break-inside:avoid}
  /* Glossary: two columns of unbreakable entries; the cross-reference keeps the chapter's number. */
  .doc-regles #glossaire{break-before:page;padding-top:0}
  .doc-regles #glossaire .tab{columns:2;column-gap:20px;overflow:visible}
  .doc-regles #glossaire :is(table,tbody){display:block;min-width:0}
  .doc-regles #glossaire thead{display:none}
  .doc-regles #glossaire tr{display:block;break-inside:avoid;margin:0 0 5px;padding:0;border:0;background:none;font-size:13px;line-height:1.35}
  .doc-regles #glossaire td{display:inline;padding:0;border:0;background:none}
  .doc-regles #glossaire td:first-child::after{content:" : "}
  .doc-regles #glossaire td:last-child{color:var(--ink-2);white-space:nowrap}
  .doc-regles #glossaire td:last-child::before{content:" → "}
}

/* Booklet: act colours (--co, --ve, --bo, --ar, --no, --on-acte), generated from data/fractures/worlds.yaml */

.chip{display:inline-block;font-family:var(--f-display);font-weight:700;font-size:14px;letter-spacing:.06em;text-transform:uppercase;padding:1px 8px;color:var(--on-acte);background:var(--ink);white-space:nowrap;line-height:1.4}
.chip.co{background:var(--co)}.chip.ve{background:var(--ve)}.chip.bo{background:var(--bo)}.chip.ar{background:var(--ar)}.chip.no{background:var(--no)}
td .chip{font-size:12.5px;margin:1px 2px 1px 0}

.sommaire .ver{margin-top:6px}
.pastille{width:8px!important;height:8px;border-radius:50%;background:var(--rule);flex:none;align-self:center}
.pastille.co{background:var(--co)}.pastille.ve{background:var(--ve)}.pastille.bo{background:var(--bo)}.pastille.ar{background:var(--ar)}.pastille.no{background:var(--no)}

.titre-livret{font-family:var(--f-display);font-weight:700;font-size:clamp(64px,12vw,128px);line-height:.85;text-transform:uppercase;letter-spacing:.01em;margin:6px 0 0}
.frise{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin-top:24px}
.frise .etape{display:flex;flex-direction:column;gap:4px;text-decoration:none;color:var(--ink);border-top:4px solid var(--ink);padding-top:8px}
.frise .etape b{font-family:var(--f-display);font-size:22px;text-transform:uppercase;letter-spacing:.03em;line-height:1}
.frise .etape small{font-family:var(--f-label);color:var(--ink-2);font-size:13px}
.frise .etape .chip{align-self:flex-start}
.frise .co{border-color:var(--co)}.frise .ve{border-color:var(--ve)}.frise .bo{border-color:var(--bo)}.frise .ar{border-color:var(--ar)}.frise .no{border-color:var(--no)}
.frise .etape:hover b,.frise .etape:focus-visible b{text-decoration:underline}
@media (max-width:640px){.frise{grid-template-columns:repeat(2,minmax(0,1fr))}}

.acte-tete{border-top:8px solid var(--ink);padding-top:12px;margin-bottom:20px}
.acte-tete.co{border-color:var(--co)}.acte-tete.ve{border-color:var(--ve)}.acte-tete.bo{border-color:var(--bo)}.acte-tete.ar{border-color:var(--ar)}.acte-tete.no{border-color:var(--no)}
.acte-eti{display:flex;gap:12px;align-items:center;font-family:var(--f-label);font-size:14px;color:var(--ink-2);font-weight:600}
.acte-tete h2{font-family:var(--f-display);font-weight:700;font-size:clamp(34px,7vw,68px);overflow-wrap:break-word;line-height:.95;text-transform:uppercase;letter-spacing:.02em;margin:8px 0 0;text-wrap:balance}
.acte-tete .genre{font-family:var(--f-body);font-style:italic;font-size:19px;color:var(--ink-2);margin-top:4px}
.chap-tete h2{font-size:40px}
h3 small,h4 small{font-family:var(--f-label);font-weight:500;text-transform:none;letter-spacing:0;color:var(--ink-2);font-size:13px}

/* Boxes of the booklet */
.encart.presse{border-color:var(--ko)}.encart.presse > .titre{background:var(--ko);color:var(--paper)}.encart.presse > .corps{background:var(--ko-bg)}
.encart.sortie{border-color:var(--ink)}.encart.sortie > .titre{background:var(--ink)}
.encart.sortie > .corps{background:var(--paper-2)}
.encart .corps p:last-child{margin-bottom:6px}
ul.regles{margin:0 0 8px;padding-left:18px}
ul.regles li{margin-bottom:8px}
.legende{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:12px;align-items:start;margin:8px 0 12px}
.legende .encart,.legende .note{margin:0}
.encart.mini > .titre{font-size:15px}
.encart.mini > .corps{padding:8px 12px 4px;font-size:15px}

/* Three-box credo */
.credo.trois{grid-template-columns:repeat(3,minmax(0,1fr))}
.credo.trois div:first-child{grid-column:auto}
@media (max-width:760px){.credo.trois{grid-template-columns:minmax(0,1fr)}}

p.moment{border-left:4px solid var(--accent);padding-left:12px;font-style:italic}
p.moment span{display:block;font-family:var(--f-label);font-style:normal;font-weight:700;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}

/* Boss phases */
.phases{display:flex;flex-direction:column;gap:0;margin:12px 0 18px;border-left:4px solid var(--bo)}
.phases > div{display:grid;grid-template-columns:200px minmax(0,1fr);gap:12px;padding:8px 14px}
.phases .phase b{font-family:var(--f-display);font-size:18px;text-transform:uppercase;letter-spacing:.04em}
.phases .coup{background:var(--ko-bg)}
.phases .coup b{font-family:var(--f-label);font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--ko)}
@media (max-width:600px){.phases > div{grid-template-columns:minmax(0,1fr);gap:2px}}

/* NPC profiles */
.profil .type .chip{font-size:12.5px}

.specs em{font-family:var(--f-label);font-style:normal;font-weight:700;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2);align-self:center;margin-right:2px}

/* Act banners */
.bandeau{display:block;width:100%;height:clamp(120px,20vw,240px);margin:0 0 14px}

/* Game kit after the booklet: A4 sheets (styles/kit-sheets.css), one per printed page. */
.kit-annexe{margin-top:56px;font:16px/normal 'Barlow','Helvetica Neue',Arial,sans-serif;letter-spacing:normal;color:var(--ink)}
.kit-titre{font-family:var(--f-display);font-weight:700;text-transform:uppercase;font-size:clamp(34px,6vw,56px);line-height:.95;margin:0}
.kit-annexe .intro{max-width:64ch;color:var(--ink-2);margin:10px 0 0;line-height:1.5}
@media print{.kit-annexe{margin:0}.kit-titre,.kit-annexe .intro{display:none}}

/* Settings of the web pages: theme (genre) and light or dark mode, top right, across the whole grid. Hidden in print. */
.reglages{grid-column:1 / -1;display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:8px 12px;padding-top:12px;font-family:'Barlow','Helvetica Neue',Arial,sans-serif;font-size:13px}
.reg-genre{display:flex;align-items:center;gap:8px;color:var(--ink-2);font-weight:600}
.reg-genre select{font:inherit;font-weight:600;color:var(--ink);background:var(--paper);border:1px solid var(--ink-2);border-radius:4px;padding:3px 6px}
.reg-theme{display:flex;border:1px solid var(--ink-2);border-radius:4px;overflow:hidden}
.reg-theme button{font:inherit;font-weight:600;color:var(--ink-2);background:var(--paper);border:0;border-left:1px solid var(--rule);padding:3px 10px;cursor:pointer}
.reg-theme button:first-child{border-left:0}
.reg-theme button:hover{color:var(--ink)}
.reg-theme button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.reg-genre select:focus-visible,.reg-theme button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
@media print{.reglages{display:none}}

/* A4 sheets of the kit, shared by the print export and the site's kit page:
   each sheet keeps its A4 size and its print colours; on screen,
   the frame shrinks it to the available width. */
:root{--sheet-shadow:0 1px 3px rgba(0,0,0,.18),0 8px 24px rgba(0,0,0,.08)}
@media screen and (prefers-color-scheme: dark){:root:not([data-theme="light"]){--sheet-shadow:0 1px 3px rgba(0,0,0,.5),0 8px 24px rgba(0,0,0,.4)}}
@media screen{:root[data-theme="dark"]{--sheet-shadow:0 1px 3px rgba(0,0,0,.5),0 8px 24px rgba(0,0,0,.4)}}
.groupe{scroll-margin-top:12px}
.grp-t{font-family:var(--f-display);font-weight:700;text-transform:uppercase;letter-spacing:.04em;font-size:28px;margin:48px 0 0;border-bottom:2px solid var(--ink);padding-bottom:6px}
.feuille{margin-top:28px;scroll-margin-top:12px}
.feuille-t{display:flex;gap:12px;align-items:baseline;margin-bottom:8px;font-family:var(--f-label,'Barlow',sans-serif)}
.feuille-t b{font-family:var(--f-display);font-size:20px;text-transform:uppercase;letter-spacing:.03em}
.feuille-t span{font-size:12px;color:var(--ink-2)}
.cadre{width:calc(var(--w) * 1px * var(--k,1));height:calc(var(--h) * 1px * var(--k,1));max-width:100%;overflow:hidden;box-shadow:var(--sheet-shadow);background:#fff}
.page{width:calc(var(--w) * 1px);height:calc(var(--h) * 1px);transform-origin:0 0;transform:scale(var(--k,1));background:#fff}

/* Print: one A4 sheet per document, at 100 %, without margin; the whole kit, or
   only the group named by the address (#g-2). */
@page kit{size:A4 portrait;margin:0}
@page kit-paysage{size:A4 landscape;margin:0}
@media print{
  .kit-tete,.grp-t,.feuille-t{display:none}
  body:has(.groupe:target) .groupe:not(:target){display:none}
  .feuille{margin:0;break-after:page;page:kit}
  .feuille.paysage{page:kit-paysage}
  .cadre{--k:1 !important;width:210mm;height:297mm;max-width:none;box-shadow:none}
  .paysage .cadre{width:297mm;height:210mm}
}

/* Site (dist/site/): shared bar, local table of contents, breadcrumb, neighbouring chapters, home.
   The bar also serves on the kit page: its fonts have a fallback. */

/* Shared bar */
.site-barre{margin-inline:-16px;padding-inline:16px;background:var(--paper-2);border-bottom:1px solid var(--rule);font-family:var(--f-label,'Barlow','Helvetica Neue',Arial,sans-serif)}
.site-barre > div{max-width:1300px;margin:0 auto;display:flex;flex-wrap:wrap;align-items:center;gap:6px 24px;padding-block:8px}
.site-marque{display:flex;align-items:center;min-height:44px;padding:4px 2px}
.site-marque .site-logo{display:block;width:auto;height:36px}
.site-marque .lg-acc{fill:var(--accent)}.site-marque .lg-fg{fill:var(--ink)}
.site-nav{display:flex;flex-wrap:wrap;gap:0 4px;font-weight:600;font-size:14px;letter-spacing:.06em;text-transform:uppercase}
.site-nav .casse{text-transform:none}
.site-nav .menu-note{margin-left:.4em;font-weight:400;font-style:italic;letter-spacing:0;text-transform:lowercase}
.site-nav a{display:flex;align-items:center;min-height:44px;padding:0 10px;color:var(--ink);text-decoration:none}
.site-menu{position:relative}
.site-menu summary{display:flex;align-items:center;gap:6px;min-height:44px;padding:0 10px;color:var(--ink);cursor:pointer;list-style:none}
.site-menu summary::-webkit-details-marker{display:none}
.site-menu summary::after{content:"";border:5px solid transparent;border-top-color:currentColor;border-bottom:0}
.site-menu summary:hover,.site-menu[open] summary{color:var(--accent)}
.site-menu.actif summary{color:var(--accent);box-shadow:inset 0 -3px 0 var(--accent)}
.site-menu ul{position:absolute;left:0;top:100%;z-index:10;min-width:240px;margin:0;padding:6px 0;list-style:none;background:var(--paper);border:1px solid var(--ink);box-shadow:0 6px 18px rgba(0,0,0,.18)}
.site-menu li a{box-shadow:none !important;white-space:nowrap}
.site-menu li a:hover{background:var(--paper-2)}
/* Small screen: the open menu takes the bar's width, whatever its title. */
@media (max-width:600px){.site-nav{position:relative}.site-menu{position:static}.site-menu ul{right:0;min-width:0}}
.site-nav a:hover{color:var(--accent)}
.site-nav a[aria-current="page"]{color:var(--accent);box-shadow:inset 0 -3px 0 var(--accent)}
.site-barre .reglages{margin-left:auto;padding-top:0}
.site-recherche{position:relative;flex:0 1 240px;min-width:140px}
.site-recherche input{width:100%;box-sizing:border-box;min-height:36px;padding:0 10px;font:inherit;font-size:14px;color:var(--ink);background:var(--paper);border:1px solid var(--ink-2);border-radius:3px}
.site-recherche input:focus{outline:2px solid var(--accent);outline-offset:1px}
.site-recherche ul{position:absolute;left:0;top:calc(100% + 4px);z-index:20;width:min(460px,calc(100vw - 32px));max-height:70vh;overflow:auto;margin:0;padding:4px 0;list-style:none;background:var(--paper);border:1px solid var(--ink);box-shadow:0 6px 18px rgba(0,0,0,.18)}
.site-recherche ul[hidden]{display:none}
.site-recherche li a{display:block;padding:8px 12px;color:var(--ink);text-decoration:none}
.site-recherche li a:hover,.site-recherche li a.sel{background:var(--paper-2)}
.site-recherche li b{display:block;font-size:14px}
.site-recherche .rech-doc{display:block;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}
.site-recherche small{display:block;margin-top:2px;font-size:13px;line-height:1.35;opacity:.8}
.site-recherche mark{background:transparent;color:var(--accent);font-weight:700}
.site-recherche .rech-vide{padding:8px 12px;font-size:14px}
.site-pied{max-width:1300px;margin:56px auto 0;border-top:1px solid var(--rule);padding-top:16px;text-align:center;font-family:var(--f-label,'Barlow',sans-serif);font-size:14px;color:var(--ink-2)}

/* Document pages: table of contents of the document, current chapter unfolded */
.site .sommaire .doc-titre{display:block;font-family:var(--f-display);font-weight:700;font-size:26px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink);padding:0 6px}
.site .sommaire a[aria-current="page"]{color:var(--ink);background:var(--paper-2);font-weight:700}
.site .sommaire ol.local{margin:2px 0 6px 28px;gap:0;font-size:13px}
.site .sommaire ol.local a{padding:2px 6px}
@media (max-width:900px){.site .sommaire ol.local{display:none}}
.site section.chap{padding-top:16px}
.ariane{margin:0;font-family:var(--f-label);font-size:14px;color:var(--ink-2)}
.ariane a{color:var(--ink-2)}
.voisins{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:12px;margin-top:48px}
.voisins a{display:flex;flex-direction:column;gap:2px;padding:14px 18px;border:1px solid var(--rule);border-radius:4px;text-decoration:none;color:var(--ink);font-family:var(--f-label)}
.voisins a:hover{border-color:var(--ink)}
.voisins a span{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2)}
.voisins a b{font-size:18px}
.voisins a.suiv{align-items:flex-end;text-align:right}

/* Memo sheets: columns, blocks, choice of the variant. */
.fm{margin:36px 0 0;border-top:3px solid var(--ink);padding-top:10px}
.fm-tete h3{font-family:var(--f-display);font-weight:700;font-size:30px;line-height:1.05;text-transform:uppercase;letter-spacing:.02em;margin:0}
.fm-sous{margin:4px 0 6px;font-family:var(--f-label);font-size:14px;color:var(--ink-2)}
.fm-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:0 24px;align-items:start}
.fm-bloc{font-family:var(--f-label);font-size:14.5px;line-height:1.45}
.fm-bloc h4{margin:14px 0 6px;padding:3px 8px;background:var(--ink);color:var(--paper);font-family:var(--f-display);font-size:17px;letter-spacing:.05em}
.fm-bloc p{margin:0 0 6px}
.fm-bloc .tab{margin:6px 0 8px}
.fm-bloc table{font-size:14px}.fm-bloc th{font-size:13px}.fm-bloc th,.fm-bloc td{padding:4px 8px}
.fm-bloc ul.simple,.fm-bloc ol.etapes{margin:4px 0 8px}

/* Choice of the variant (::choix-variante), without script: only the versions
   of the checked variant stay visible. */
.choix-variante{display:flex;flex-wrap:wrap;gap:6px 18px;border:2px solid var(--var);background:var(--var-bg);padding:8px 14px 10px;margin:18px 0 0;font-family:var(--f-label);font-weight:600}
.choix-variante legend{padding:0 6px;font-family:var(--f-display);font-weight:700;font-size:15px;letter-spacing:.1em;text-transform:uppercase;color:var(--var)}
.choix-variante input{accent-color:var(--var)}
.pm-reglages{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:flex-start}
.pm-reglages .choix-variante{margin:0;padding:4px 12px 6px}
.pm-imprimer{cursor:pointer;border:1.5px solid var(--ink);min-height:36px;padding:0 14px;font-size:13px;align-self:flex-end}
.fm-config{display:none}
.selon-variante{display:none}
.selon-variante.pour-blockbuster{display:revert}
body:has(.choix-variante [value="raw"]:checked) .selon-variante.pour-blockbuster{display:none}
body:has(.choix-variante [value="raw"]:checked) .selon-variante.pour-raw{display:revert}

/* Colours of the sheets: banners and headers in the genre's accent, whatever
   the chosen variant (only the content changes). */
.fm-bloc h4{background:var(--accent);color:var(--paper)}
.fm-bloc th{background:var(--accent-bg);color:var(--ink)}
.fm-bloc ol.etapes li::before{background:var(--accent)}

/* Memo pages: full width; the GM screen in loose columns. */
.page-memo{max-width:1600px;margin:0 auto;padding-top:20px}
.pm-tete{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 32px;border-bottom:3px solid var(--ink);padding-bottom:12px}
.pm-tete h1{margin:0;font-family:var(--f-display);font-weight:700;font-size:clamp(36px,6vw,56px);line-height:1;text-transform:uppercase;letter-spacing:.02em}
.pm-tete .choix-variante{margin:0}
.pm-logo{display:none}
.pm-logo .lg-acc{fill:var(--accent)}.pm-logo .lg-fg{fill:var(--ink)}
.fm.fm-page{margin:0;border-top:0;padding-top:4px}
.fm-flux{columns:300px auto;column-gap:28px}
.fm-flux .fm-groupe{break-inside:avoid}
.fm-impression{display:none}
.fm-flux .fm-bloc:has(> h4){padding-top:2px}

/* Kit in the Fractures section */
.kit-site .grp-t{margin-top:40px}
.kit-site .chapo{max-width:64ch}

/* Chapter cards (home, entry pages of the documents) */
.cartes{list-style:none;margin:28px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:12px}
.cartes a{display:flex;gap:16px;height:100%;padding:16px 18px;background:var(--paper-2);border:1px solid var(--rule);border-radius:4px;text-decoration:none;color:var(--ink)}
.cartes a:hover{border-color:var(--ink)}
.cartes .num{flex:0 0 34px;font-family:var(--f-display);font-weight:700;font-size:32px;line-height:1;color:var(--accent)}
.cartes .pastille{margin-top:7px}
.cartes b{display:block;font-family:var(--f-label);font-size:17px}
.cartes small{display:block;margin-top:4px;font-size:15px;line-height:1.45;color:var(--ink-2)}

/* Home */
.accueil{max-width:1300px;margin:0 auto}
.accueil h2{font-family:var(--f-display);font-weight:700;font-size:clamp(32px,5vw,44px);line-height:1;text-transform:uppercase;letter-spacing:.02em;margin:0}
.accueil .surtitre{font-family:var(--f-label);font-weight:600;font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
.acc-hero{display:flex;flex-direction:column;align-items:center;text-align:center;gap:24px;padding:72px 0 64px;border-bottom:1px solid var(--rule)}
.acc-hero h1{margin:0;width:min(100%,560px)}
.acc-hero h1 svg{display:block;width:100%;height:auto}
.acc-intro{max-width:680px}
.acc-intro .partie > p{margin:0;font-size:19px;line-height:1.55}
.acc-intro .partie > p:first-child{font-size:21px}
.acc-intro .partie > p + p{margin-top:18px}
.acc-intro .partie > p.lim{margin:12px 0 0;font-size:15px;line-height:1.45}.acc-intro .note{margin:20px 0 0;text-align:left}
.acc-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
.bouton{display:inline-flex;align-items:center;min-height:48px;padding:0 22px;border-radius:3px;background:var(--accent);color:var(--paper);text-decoration:none;font-family:var(--f-label);font-weight:700;font-size:15px;letter-spacing:.06em;text-transform:uppercase}
.bouton.second{background:none;color:var(--ink);border:1.5px solid var(--ink)}
.acc-regles{padding:48px 0}
.acc-fractures{padding:32px clamp(16px,4vw,40px);background:var(--paper-2);border:1px solid var(--rule);border-radius:6px}
.acc-fr-tete{display:flex;flex-wrap:wrap;gap:24px 32px}
.acc-fr-tete > div{flex:999 1 420px;min-width:0}
.acc-fr-tete h2{margin:10px 0 12px;font-size:clamp(40px,7vw,56px)}
.acc-fr-tete p{margin:0;max-width:680px}
.acc-docs{flex:1 1 240px;display:flex;flex-direction:column;gap:8px}
.acc-docs a{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:52px;padding:0 18px;background:var(--paper);border:1px solid var(--rule);border-radius:3px;text-decoration:none;color:var(--ink);font-family:var(--f-label);font-weight:700;font-size:16px}
.acc-docs a:hover{border-color:var(--ink)}
.acc-docs span{font-weight:500;font-size:13px;color:var(--ink-2)}
.acc-fractures .frise{margin-top:28px}
.acc-foundry{margin-top:48px;padding:28px;border:1.5px solid var(--ink);border-radius:4px}
.acc-foundry p{max-width:680px;margin:12px 0 18px}
.acc-imprimer{padding:48px 0 0}
.acc-imprimer > p{max-width:720px;color:var(--ink-2);margin:14px 0 18px}
.acc-imprimer ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}
.acc-imprimer a,.acc-imprimer button{display:flex;flex-wrap:wrap;align-items:center;gap:4px 24px;min-height:56px;padding:10px 4px;border-bottom:1px solid var(--rule);text-decoration:none;color:var(--ink)}
.acc-imprimer button{width:100%;font:inherit;text-align:left;background:none;border-width:0 0 1px;cursor:pointer}
.acc-imprimer a b,.acc-imprimer button b{flex:1 1 260px;font-family:var(--f-label);font-size:18px}
.acc-imprimer a span,.acc-imprimer button span{flex:1 1 260px;font-size:15px;color:var(--ink-2)}
.acc-imprimer a span.action,.acc-imprimer button span.action{flex:0 0 auto;font-family:var(--f-label);font-weight:600;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}
@media (max-width:600px){.accueil .frise{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Printing in a variant from the home page: the choice of the variant, in the boxes of the rules. */
.variante-dialogue{width:min(760px,calc(100vw - 32px));max-height:calc(100dvh - 32px);padding:16px 20px 20px;border:2px solid var(--ink);background:var(--paper);color:var(--ink);overflow:auto}
.variante-dialogue::backdrop{background:rgb(0 0 0 / .55)}
.variante-tete{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:8px;border-bottom:2px solid var(--ink)}
.variante-tete h2{margin:0;font-size:26px}
.variante-annuler{min-width:40px;min-height:40px;font:inherit;font-size:18px;color:var(--ink);background:var(--paper-2);border:1px solid var(--ink-2);border-radius:3px;cursor:pointer}
.variante-dialogue > p{color:var(--ink-2);margin:12px 0 0}
.variante-dialogue .formes{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:600px){.variante-dialogue .formes{grid-template-columns:minmax(0,1fr)}}
.variante-imprimer{margin-top:12px;align-self:flex-start;border:0;cursor:pointer;font:inherit;font-weight:700;font-size:15px;letter-spacing:.06em;text-transform:uppercase}
.forme.raw .variante-imprimer{background:var(--var);color:var(--paper)}

@media print{
  .site-barre,.site-pied,.ariane,.voisins{display:none}
  /* Home page: the blank sheet of the chosen variant alone, otherwise none. */
  html:not([data-vierge]) .vierge-feuilles,html[data-vierge] .vierge-feuilles .fp-impression:not(.choisie){display:none}
  html[data-vierge] .accueil > :not(.vierge-feuilles){display:none !important}
  html[data-vierge] .accueil{padding:0;margin:0;max-width:none}
  /* Memo pages: in the format of their sheets, in the chosen variant. */
  .choix-variante,.pm-reglages{display:none}
  .fm-config{display:block;margin:0;font-family:var(--f-label);font-size:9pt}
  .fm-cols{grid-template-columns:repeat(var(--cols),minmax(0,1fr));gap:0 14px}
  .fm-tete h3{font-size:22pt}
  .fm-bloc{font-size:9pt;line-height:1.3;break-inside:avoid}
  .fm-bloc h4{font-size:11pt;margin:7pt 0 3pt;padding:1pt 5pt}
  .fm-bloc table{font-size:8.5pt}.fm-bloc th{font-size:8pt}.fm-bloc th,.fm-bloc td{padding:2pt 4pt}
  .fm-bloc p{margin:0 0 3pt}
  .fm-bloc ol.etapes{gap:2pt}
  .fm-bloc ol.etapes li{grid-template-columns:16pt minmax(0,1fr);gap:4pt}
  .fm-bloc ol.etapes li::before{width:14pt;height:14pt;line-height:14pt;font-size:9pt}
  /* The body's bottom padding would make a blank page after a full sheet. */
  body:has(.page-memo){padding:0}
  .page-memo{padding:0;max-width:none}
  .page-memo:has(.fm.paysage){page:paysage}
  /* Header on one line: logo, title and chosen configuration (variant and options). */
  .pm-tete{flex-direction:row;flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:6mm;border-bottom-width:2px;padding-bottom:2mm;text-align:center}
  .pm-tete h1{flex:1}
  .fm-config{flex:none;max-width:38%;text-align:right}
  .pm-logo{display:block;height:11mm;width:auto}
  .pm-tete h1{font-size:20pt}
  /* Several sheets: each on its own page, with its header. */
  .page-memo:has(.fm-impression) > .pm-tete,.fm-flux{display:none}
  .fm-impression{display:block}
  .fm-feuille{break-after:page}
  .fm-feuille:last-child{break-after:auto}
}
@page paysage{size:A4 landscape;margin:10mm 12mm}

/* Printable sheets shared by the Tools page and the kit (build/shared/sheets.cjs):
   A4 character sheet (.fp) and A6 NPC card (.cp). Fixed colours:
   these sheets follow neither the genre nor the theme. */

/* A4 sheet: 794 × 1123 px. Header: the portrait and, beside it, name, Inspiration, then Santé and Stress side by
   side on one grid (CoreEngine.gaugeGrid). Then characteristics with their specialties, gear, identity, notes.
   Structure in slate; a few colour touches: Santé, Stress (gold up to the Coup d'éclat, plum up to the Rupture),
   Inspiration. */
.fp{--fp-ink:#1B1F2A;--fp-ink2:#4A4F5C;--fp-rule:#8C91A0;--fp-light:#C9CCD6;--fp-sheet:#3E5872;--fp-health:#B0362B;--fp-gold:#C28A00;
  --fp-st:#8A6400;--fp-st-z2:#F6ECCF;--fp-st-ext:#C28A00;
  --fp-h-z1:#DFF0DA;--fp-h-z2:#F2E5CB;--fp-h-z3:#F4D3CE;
  --g-zone:3px;--g-sep:14px;
  box-sizing:border-box;width:794px;height:100%;padding:30px 36px;display:flex;flex-direction:column;gap:14px;background:#fff;color:var(--fp-ink);font-family:'Barlow',sans-serif;font-size:14px;line-height:1.3;overflow:hidden}
.fp *{box-sizing:border-box}
.fp,.cp{-webkit-print-color-adjust:exact;print-color-adjust:exact}
article.fp :is(h2,h3,h4,p,figure){margin:0;padding:0;line-height:inherit}
.fp .fp-ft{margin:0;border:0;padding:0;font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:20px;line-height:1.2;letter-spacing:.01em;text-transform:none;color:var(--fp-sheet)}
.fp-lb{font-size:12px;color:var(--fp-ink2);white-space:nowrap}
.fp-lb-fort{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:14px;letter-spacing:.05em;text-transform:uppercase;color:var(--fp-ink)}
.fp-ligne{flex:1;min-height:20px;border-bottom:1px solid var(--fp-ink);font-size:13px;line-height:19px}
.fp-champ{display:flex;align-items:flex-end;gap:6px;min-width:0}
.fp-gr{color:var(--fp-rule)}
/* Header */
.fp-tete{display:grid;grid-template-columns:140px minmax(0,1fr);gap:16px}
.fp-illu{width:140px;height:186px;border:2px solid var(--fp-ink);border-radius:14px;overflow:hidden;display:flex;align-items:flex-end;justify-content:center}
.fp-illu img{display:block;width:100%;height:100%;object-fit:cover}
.fp-illu figcaption{font-family:'Barlow Condensed',sans-serif;font-weight:600;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--fp-rule);padding-bottom:8px}
.fp-tete-d{display:flex;flex-direction:column;gap:10px;min-width:0}
.fp-ligne1{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.fp-ident{flex:1;min-width:0}
.fp .fp-ident h2{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:38px;line-height:1;text-transform:uppercase;letter-spacing:.02em}
.fp .fp-ident p{font-size:13px;color:var(--fp-ink2);margin-top:3px}
.fp-ident-vierge{display:flex;flex-direction:column;gap:12px}
.fp-ident-vierge .fp-ligne{min-height:28px}
.fp-inspi{flex:none;display:flex;flex-direction:column;align-items:center;gap:1px;font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--fp-gold)}
.fp-inspi .fp-var{font-family:'Barlow',sans-serif;font-weight:600;font-size:11px;letter-spacing:.02em;text-transform:none;color:var(--fp-ink2);white-space:nowrap}
/* Star to blacken: an outline (two clipped layers), filled when the Inspiration is held. Shared with the Tools sheet. */
.fp-etoile{--etoile:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);position:relative;display:inline-block;width:32px;height:32px;background:var(--fp-gold,var(--stress));clip-path:var(--etoile);-webkit-print-color-adjust:exact;print-color-adjust:exact}
.fp-etoile::after{content:'';position:absolute;inset:6px 6px 5px;background:var(--paper,#fff);clip-path:var(--etoile)}
.fp .fp-etoile::after{background:#fff}
.fp-etoile.on::after{background:var(--fp-ink,var(--ink))}
/* Gauges: one grid; each gauge and each zone takes its columns (subgrid), so every box has the same width. */
.fp-jauges{display:grid;column-gap:3px;margin-top:auto}
.fp-g{display:grid;grid-template-columns:subgrid;row-gap:3px;align-content:start}
.fp-g > .fp-ft,.fp-g > .fp-champ{grid-column:1 / -1}
.fp-g > .fp-champ{margin-top:6px}
.fp-z{display:grid;grid-template-columns:subgrid;row-gap:2px}
.fp-zl{grid-column:1 / -1;font-family:'Barlow Condensed',sans-serif;font-weight:600;font-size:11.5px;line-height:1.1;color:var(--fp-ink2)}
.fp-z.ext .fp-zl{white-space:nowrap}
.fp .fp-g > .fp-ft{font-size:18px}
.fp .fp-g.health > .fp-ft{color:var(--fp-health)}
.fp .fp-g.stress > .fp-ft{color:var(--fp-st)}
.fp-g.rupture{--fp-st:#4B3B52;--fp-st-z2:#E4DDE8;--fp-st-ext:#2E2234}
.fp-case{display:flex;align-items:center;justify-content:center;height:26px;border:1px solid var(--fp-ink);border-radius:3px;background:#fff;font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:14px}
.fp-g.health .z1 .fp-case{background:var(--fp-h-z1)}
.fp-g.health .z2 .fp-case{background:var(--fp-h-z2)}
.fp-g.health .z3 .fp-case{background:var(--fp-h-z3)}
.fp-g.health .z4 .fp-case{background:var(--fp-ink);color:#fff}
.fp-g.health .z4 .fp-zl{color:var(--fp-ink)}
.fp-g.stress .z2 .fp-case{background:var(--fp-st-z2)}
.fp-g.stress .ext .fp-case{background:var(--fp-st-ext);border-color:var(--fp-st-ext);color:#fff}
.fp-g.stress .ext .fp-zl{color:var(--fp-st-ext)}
/* Characteristics: two columns of three; big underlined value, abbreviation in a slate pill, then the
   specialty lines hung on a slate rule. */
.fp-sec{display:flex;flex-direction:column;gap:6px}
.fp-caracs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px 24px}
.fp-rang{display:grid;grid-template-columns:130px minmax(0,1fr);gap:10px;align-items:start}
.fp-ok{display:grid;grid-template-areas:"v ab" "v nm";grid-template-columns:44px minmax(0,1fr);align-items:center;column-gap:8px;padding-top:4px}
.fp-ok b{grid-area:ab;align-self:end;justify-self:start;font-family:'Barlow Condensed',sans-serif;font-size:16px;letter-spacing:.03em;line-height:1.15;background:var(--fp-sheet);color:#fff;border-radius:10px;padding:0 9px;margin-bottom:2px}
.fp-val{grid-area:v;height:40px;font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:36px;line-height:38px;text-align:center;border-bottom:3px solid var(--fp-sheet)}
.fp .fp-ok small{grid-area:nm;align-self:start;font-size:12px;color:var(--fp-ink2);white-space:nowrap}
.fp-spes{border-left:2px solid var(--fp-sheet);padding-left:8px}
.fp-spe{height:22px;border-bottom:1px solid var(--fp-light);font-size:13.5px;font-weight:500;display:flex;align-items:flex-end;justify-content:space-between;gap:6px;padding-bottom:1px;white-space:nowrap}
.fp-bonus{font-size:11px;font-weight:600;color:var(--fp-rule)}
/* Gear: a light list, rules between rows only. */
.fp .fp-t{border-collapse:collapse;width:100%;margin:0;font-size:14px}
.fp .fp-t th,.fp .fp-t td{border:0;border-bottom:1px solid var(--fp-light);padding:3px 8px 3px 0;text-align:left;vertical-align:middle;color:var(--fp-ink);background:none}
.fp .fp-t th{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:14px;color:var(--fp-ink2);border-bottom-color:var(--fp-sheet);padding-bottom:1px}
.fp .fp-t th:first-child,.fp .fp-t th:nth-child(2){width:31%}
.fp .fp-libre td{height:26px;font-size:12px}
.fp-res{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px}
.fp-res b{font-weight:600;min-width:88px}
.fp-piste{display:inline-flex;gap:3px;vertical-align:middle}
.fp-d{display:inline-block;min-width:24px;height:19px;border-bottom:1px solid var(--fp-ink);text-align:center;font-size:12px;font-weight:600;line-height:18px}
.fp-d.on{border-bottom:2.5px solid var(--fp-sheet);font-weight:700}
.fp-d.hors{visibility:hidden}
.fp-res-nom{display:inline-block;width:88px;height:19px;border-bottom:1px solid var(--fp-ink)}
/* Identity: three description lines (smaller lines if the text is longer, fitLines), level with trait, weakness
   and motivation. */
.fp-id{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px}
.fp-desc{height:66px}
.fp-idc{display:grid;grid-template-columns:max-content minmax(0,1fr);grid-auto-rows:22px;align-items:end;gap:0 6px}
.fp-idc .fp-ligne{min-height:0;border-color:var(--fp-light)}
.fp-notes{flex:1;min-height:0}
.fp-notes .fp-lignes{flex:1;min-height:22px}
/* Lines as an SVG pattern: crisp even reduced (a gradient blurs); their height follows --lh. */
.fp-lignes{--lh:22px;overflow:hidden;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='22' viewBox='0 0 8 22' preserveAspectRatio='none'%3E%3Crect y='21' width='8' height='1' fill='%23C9CCD6'/%3E%3C/svg%3E") 0 0/8px var(--lh) repeat}
.fp .fp-lignes p{font-size:calc(var(--lh) * .6);line-height:var(--lh)}

/* NPC card: A6, 397 × 559 px (105 × 148 mm). The colour follows the type. */
.cp{--k:#24477A;--kc:#E6ECF5;box-sizing:border-box;width:397px;height:559px;border-radius:14px;background:var(--k);padding:8px;font-family:'Barlow',sans-serif;font-size:14.5px;line-height:1.28;color:#1B1F2A}
.cp *{box-sizing:border-box}
.cp.t-groupe{--k:#0F5E66;--kc:#E2F0F1}
.cp.t-boss{--k:#9A3324;--kc:#F6E5E2}
.cp.t-allie{--k:#3D6B2E;--kc:#E7F0E3}
.cp.t-calamite{--k:#5E2D6E;--kc:#EFE5F2}
.cp-in{height:100%;background:#fff;border-radius:8px;display:flex;flex-direction:column;overflow:hidden}
.cp-tete{flex:none;display:flex;align-items:center;gap:9px;padding:8px 12px 6px}
.cp-type,.cp-nom,.cp-menace,.cp-lb,.cp-lbi,.cp-ligne i,.cp-ligne em{font-family:'Barlow Condensed',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.cp-type{flex:none;font-size:11.5px;color:#fff;background:var(--k);border-radius:10px;padding:2px 9px}
.cp-nom{flex:1;min-width:0;font-size:25px;line-height:1.02}
.cp-menace{flex:none;font-size:11.5px;color:var(--k);line-height:1}
.cp-menace b{font-size:36px;margin-left:3px;vertical-align:-6px}
.cp-illu{flex:none;height:150px;margin:0 12px;border:3px solid var(--k);border-radius:4px;overflow:hidden;background:var(--kc)}
.cp-illu img{display:block;width:100%;height:100%;object-fit:cover}
.cp-sous{flex:none;margin:0 12px;padding:3px 9px;font-size:13px;font-style:italic;color:#fff;background:var(--k)}
.cp-sans-illu .cp-sous{background:none;color:#5A6070;padding:0 0 4px;border-bottom:2px solid var(--k)}
.cp-grp{flex:none;margin:0 12px;padding:7px 0}
.cp-grp+.cp-grp{border-top:1px solid #C9CCD6}
.cp-suivi{display:flex;flex-direction:column;gap:6px;padding-top:9px}
.cp-rang{display:flex;align-items:center;gap:8px}
.cp-lb{flex:none;width:58px;font-size:12px;color:var(--k)}
.cp-cases{flex:1;display:flex;flex-wrap:wrap;align-items:center;gap:3px}
.cp-hp{width:20px;height:20px;border:2px solid #1B1F2A;background:#fff}
.cp-ph{border-radius:50%}
.cp-at{width:24px;height:24px;border:2.5px solid #1B1F2A;border-radius:50%}
.cp-p{font-size:12.5px;color:#5A6070;margin-left:2px}
.cp-ligne{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:3px 0}
.cp-ligne+.cp-ligne{border-top:1px dotted #C9CCD6}
.cp-ligne>span:first-child{font-weight:600}
.cp-ligne small{font-weight:400;font-size:12px;color:#5A6070}
.cp-ligne>span:last-child{flex:none}
.cp-ligne b{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:22px;color:var(--k)}
.cp-ligne i{font-style:normal;font-size:11.5px;color:#5A6070;margin-right:5px}
.cp-ligne em{font-style:normal;font-size:14px;color:var(--k)}
.cp-textes{display:flex;flex-direction:column;gap:5px}
.cp-lbi{font-size:12px;color:var(--k);margin-right:4px}
.cp-note{flex:none;margin-top:auto;padding:7px 12px 9px;background:var(--kc);border-top:2px solid var(--k);font-size:12.5px;line-height:1.25}
.cp.cp-d1{font-size:13.5px;line-height:1.22}
.cp.cp-d1 .cp-note{font-size:12px}
.cp.cp-d1 .cp-grp{padding:5px 0}
.cp.cp-d1 .cp-hp{width:18px;height:18px}
.cp.cp-d1 .cp-at{width:21px;height:21px}
.cp.cp-d2{font-size:12.5px;line-height:1.18}
.cp.cp-d2 .cp-note{font-size:11.5px}
.cp.cp-d2 .cp-suivi{gap:4px;padding-top:6px}

/* Sheet of cards: four per A4, at 95 % to stay inside the print margins. */
.cp-planche{box-sizing:border-box;width:794px;height:1123px;display:grid;grid-template-columns:repeat(2,377px);grid-auto-rows:531px;justify-content:center;align-content:center}
.cp-planche>.cp{zoom:.95}
/* Kit sheet of cards: nine cards per A4 (3 × 3), at 62 %, inside the print margins. */
.cp-planche.cp-neuf{grid-template-columns:repeat(3,246px);grid-auto-rows:347px;gap:8px}
.cp-planche.cp-neuf>.cp{zoom:.62}

/* Printing from the Tools page: the sheet or the sheet of cards alone, on A4 without margin. Off screen
   but laid out, so the sheet's text can be fitted (fitLines). */
.fp-impression{position:absolute;left:-10000px;top:0;visibility:hidden;pointer-events:none}
.fp-impression > .fp{height:1123px}
/* The cards are measured here, off screen, before being placed on the sheet. */
.cp-mesure{position:absolute;left:-9999px;top:0;visibility:hidden}
.cp-trop{outline:3px dashed #D0021B;outline-offset:4px}
@media print{
  @page fiche{size:A4;margin:0}
  .fp-impression{position:static;visibility:visible;page:fiche}
  .fp-impression .cp-planche{break-after:page}
  .cp-trop{outline:0}
}

/* Isolation from the site's styles (sections, tables, headings). */
.fp .fp-sec{margin:0;padding:0;border:0}

/* Tools page: character sheet and its roll dialog, guided creation. Colours by role: --ok, --part, --ko, --var, --note. */
.page-outils{max-width:1300px;margin:0 auto;padding-top:20px;font-family:var(--f-label)}
.page-outils .pm-tete{margin-bottom:22px}
.page-outils .chapo{font-family:var(--f-body);max-width:68ch}
.page-outils h2{font-family:var(--f-display);font-weight:700;text-transform:uppercase;letter-spacing:.03em;margin:0}
.page-outils h3{font-size:22px;margin:24px 0 8px}
.page-outils input,.page-outils select,.page-outils textarea{font:inherit;font-size:16px;color:var(--ink);background:var(--paper);border:1px solid var(--ink-2);border-radius:3px;padding:6px 8px;min-height:40px;max-width:100%}
.page-outils textarea{width:100%;resize:vertical}
.page-outils input[type="checkbox"],.page-outils input[type="radio"]{min-height:0;width:18px;height:18px;accent-color:var(--accent);vertical-align:-3px}
.page-outils :focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.page-outils input[type="number"]{width:100%;max-width:120px}
.cache{display:none}

.panneau[hidden]{display:none}
/* Tabs of a tool with several panels (library, creation, sheet, cards). */
.outils-onglets{display:flex;flex-wrap:wrap;gap:4px;border-bottom:3px solid var(--ink);margin:0 0 20px}
.outils-onglets a{display:inline-flex;align-items:center;min-height:44px;padding:6px 16px;border:1.5px solid var(--ink);border-bottom:0;color:var(--ink);text-decoration:none;font-weight:700;font-size:15px;letter-spacing:.06em;text-transform:uppercase}
.outils-onglets a[aria-current="page"]{background:var(--ink);color:var(--paper)}
.page-outils .page-contenu{padding-top:0}

/* Buttons */
.page-outils .bouton{border:0;cursor:pointer;font:inherit;font-weight:700;font-size:15px;letter-spacing:.06em;text-transform:uppercase}
.page-outils .bouton.second{border:1.5px solid var(--ink);background:none}
.page-outils .bouton:disabled{opacity:.45;cursor:not-allowed}
.petit{font:inherit;font-size:14px;font-weight:600;min-height:40px;padding:0 12px;color:var(--ink);background:var(--paper-2);border:1px solid var(--ink-2);border-radius:3px;cursor:pointer}
.petit:hover{border-color:var(--ink)}
.petit.danger{color:var(--ko);border-color:var(--ko)}
.jet-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:14px}

/* Fields */
.ch{display:flex;flex-direction:column;gap:3px;margin:0 0 12px}
.ch-l{font-weight:700;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2)}
.ch small,.page-outils small{font-size:13px;color:var(--ink-2);line-height:1.35}
.ch-case{flex-direction:row;align-items:center;gap:8px;font-size:16px}
fieldset{border:1px solid var(--rule);margin:0 0 14px;padding:8px 12px 10px}
fieldset legend{font-weight:700;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2);padding:0 6px}
fieldset label{display:block;padding:3px 0}

/* Roll */
.jet-grille{display:grid;grid-template-columns:minmax(0,1fr);gap:24px}
@media (min-width:900px){.jet-grille{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:40px}}
.jet-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:0 20px;align-items:start}
.jet-form > fieldset,.jet-form > .ch-case{grid-column:1 / -1}
.jet-resultat{padding:16px 18px;border:2px solid var(--ink);background:var(--paper)}
.jet-resultat p{margin:0 0 8px}
.jet-ligne{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;font-weight:600}
.jet-ligne small{font-weight:400}
.jet-etq{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2)}
.jet-etq.res{color:var(--var)}
.de-rangee{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 12px;align-items:flex-start}
.de-c{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:2.5px solid var(--ink-2);border-radius:8px;background:var(--paper);font-family:var(--f-display);font-weight:700;font-size:24px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.de-c.hit{background:var(--ok);border-color:var(--ok);color:var(--paper)}
.de-c.res{border-color:var(--var);background:var(--var-bg);color:var(--var);border-style:dashed}
.res-bloc{display:flex;flex-direction:column;align-items:center;gap:2px;max-width:110px;text-align:center}
.jet-verdict{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 16px;padding:10px 14px;margin:6px 0 10px;color:var(--paper)}
.jet-verdict b{font-family:var(--f-display);font-weight:700;font-size:26px;letter-spacing:.04em;text-transform:uppercase}
.jet-verdict span{font-weight:600}
.jet-verdict.r-ok{background:var(--ok)}.jet-verdict.r-part{background:var(--part)}.jet-verdict.r-ko{background:var(--ko)}
.jet-degats{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;padding:8px 12px;border:2px solid var(--ink)}
.jet-degats b{font-family:var(--f-display);font-weight:700;font-size:22px;text-transform:uppercase;letter-spacing:.03em}
.jet-degats.r-ko{border-style:dashed;color:var(--ink-2)}
.jet-relance{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center}
.jet-note{font-size:14.5px;padding:6px 10px;background:var(--note-bg);border-left:3px solid var(--note)}
.jet-histo{margin-top:20px}
.page-outils .jet-histo h3{font-size:15px;letter-spacing:.08em;margin:0 0 4px}
.jet-histo ul{margin:0;padding-left:18px;font-size:14px;color:var(--ink-2)}
/* Roll dialog of the sheet: centred, a drawer from the bottom on a small screen. */
.jet-dialogue{width:min(760px,calc(100vw - 32px));max-height:calc(100dvh - 32px);padding:0;border:2px solid var(--ink);background:var(--paper);color:var(--ink);overflow:auto;overscroll-behavior:contain}
.jet-dialogue::backdrop{background:rgb(0 0 0 / .55)}
.jd-corps{padding:14px 18px 18px}
.jd-tete{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;padding-bottom:8px;border-bottom:2px solid var(--ink)}
.page-outils .jd-tete h2{font-size:24px;overflow-wrap:anywhere}
.jet-dialogue .jet-resultat{border:0;padding:0}
.jd-quoi{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:0 16px}
.jd-quoi select{width:100%}
.jd-ligne{display:flex;flex-wrap:wrap;gap:0 28px}
.jd-groupe,.jd-pas{margin:0 0 14px}
.jd-groupe > .ch-l,.jd-pas > .ch-l{display:block;margin-bottom:6px}
.jd-puces{display:flex;flex-wrap:wrap;gap:6px}
.jd-puce{display:inline-flex;align-items:baseline;gap:6px;font:inherit;font-size:15px;font-weight:600;min-height:40px;padding:8px 14px;border:1.5px solid var(--ink-2);border-radius:20px;background:none;color:var(--ink);cursor:pointer;text-align:left}
.jd-puce:hover{border-color:var(--ink)}
.jd-puce[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.jd-bascules{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:2px 16px}
.jd-groupe.eclat{padding:4px 12px;border:2px solid var(--ok);background:var(--ok-bg)}
.page-outils .f-switch small{font-weight:400;color:var(--ink-2)}
.jd-puce:disabled{opacity:.45;cursor:not-allowed}
.page-outils .jd-puce small{font-weight:400;color:inherit;opacity:.8}
.jd-pas-c{display:inline-flex;align-items:center;border:1.5px solid var(--ink-2);border-radius:4px}
.jd-pas-c button{width:40px;min-height:40px;border:0;background:none;color:var(--ink);font:inherit;font-size:20px;cursor:pointer}
.jd-pas-c button:disabled{opacity:.35;cursor:not-allowed}
.jd-pas-c output{min-width:28px;text-align:center;font-weight:700;font-size:18px}
.page-outils .jd-aide{display:block;margin:-6px 0 14px}
.jd-pied{position:sticky;bottom:0;display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px -18px -18px;padding:12px 18px;background:var(--paper-2);border-top:2px solid var(--ink)}
.jd-reserve{display:flex;flex-direction:column;min-width:0}
.jd-reserve b{font-family:var(--f-display);font-size:28px;line-height:1}
@media (max-width:600px){
  .jet-dialogue{width:100%;max-width:100%;max-height:92dvh;margin:auto 0 0;border-width:2px 0 0}
  .jd-corps{padding:12px 16px 16px}
  .jd-pied{margin:8px -16px -16px;padding:12px 16px}
}

/* Sheet */
/* Above the sheet: tabs of the open sheets, play or modify switch, menus. */
.f-barre{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;margin-bottom:14px}
.f-onglets,.f-commandes{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.f-commandes{gap:16px}
/* Switch of the modify mode: a checkbox drawn as a track and its knob. */
.f-switch{display:inline-flex;align-items:center;gap:10px;min-height:40px;font-weight:600;font-size:15px;cursor:pointer}
.page-outils .f-switch input{appearance:none;-webkit-appearance:none;position:relative;flex:none;width:46px;height:26px;margin:0;border:1.5px solid var(--ink-2);border-radius:13px;background:var(--paper-2);cursor:pointer;transition:background .15s,border-color .15s;vertical-align:middle}
.page-outils .f-switch input::before{content:"";position:absolute;top:3px;left:3px;width:17px;height:17px;border-radius:50%;background:var(--ink-2);transition:transform .15s,background .15s}
.page-outils .f-switch input:checked{background:var(--accent);border-color:var(--accent)}
.page-outils .f-switch input:checked::before{transform:translateX(20px);background:var(--paper)}
@media (prefers-reduced-motion:reduce){.page-outils .f-switch input,.page-outils .f-switch input::before{transition:none}}
/* Drop-down menu: <details>, its list over the page. */
.f-menu{position:relative;display:inline-block}
.f-menu > summary{list-style:none;display:inline-flex;align-items:center;gap:6px}
.f-menu > summary::-webkit-details-marker{display:none}
.f-menu > summary::after{content:"▾";font-size:12px}
.f-menu[open] > summary{border-color:var(--ink)}
.f-menu-l{position:absolute;z-index:20;top:calc(100% + 4px);right:0;width:max-content;min-width:220px;max-width:calc(100vw - 32px);display:flex;flex-direction:column;padding:6px;background:var(--paper);border:1.5px solid var(--ink);box-shadow:0 6px 18px rgb(0 0 0 / .25)}
.f-menu.gauche .f-menu-l{right:auto;left:0}
.f-menu-l > button{text-align:left;font:inherit;font-size:15px;font-weight:600;min-height:40px;padding:6px 10px;border:0;background:none;color:var(--ink);cursor:pointer}
.f-menu-l > button:hover,.f-menu-l > button:focus-visible{background:var(--paper-2)}
.f-menu-l > button.danger{color:var(--ko)}
.f-menu-l hr{width:100%;border:0;border-top:1px solid var(--rule);margin:4px 0}
.f-menu-l .f-boutons{padding:2px 4px;margin:0;flex-wrap:nowrap}
.importer{display:inline-block}
/* Characteristics and specialties of the creation steps. */
.f-caracs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:10px}
.f-carac{display:grid;grid-template-columns:auto minmax(0,1fr);gap:0 8px;align-items:center;padding:8px;border:1px solid var(--rule);background:var(--paper-2)}
.f-carac b{font-family:var(--f-display);font-size:24px;letter-spacing:.04em;color:var(--sheet)}
.f-carac span{font-size:13px;color:var(--ink-2)}
.f-carac input,.f-carac select{grid-column:1 / -1;margin-top:4px;width:100%;max-width:none}
.f-specs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,400px),1fr));gap:0 28px}
.f-spec{display:grid;grid-template-columns:minmax(0,1fr) 76px auto auto;gap:8px;align-items:center;margin-bottom:8px}
.f-spec input{width:100%;max-width:none}
@media (max-width:520px){.f-spec{grid-template-columns:minmax(0,1fr) 76px}.f-spec .petit{grid-column:1 / -1}}
/* Sheet: as the printed sheet. At the top, the portrait and, beside it, name, concept, Inspiration, then Santé and
   Stress side by side (grid of sheets.css); then characteristics with their specialties, gear, identity, notes.
   Colours: the genre's sheet roles (sheet, health, healthy, stress, breakdown). */
.f-fiche{border:2px solid var(--ink);padding:16px clamp(12px,3vw,24px) 20px;background:var(--paper)}
.f-fiche h3{margin:22px 0 8px;font-family:var(--f-display);font-weight:700;font-size:22px;letter-spacing:.01em;text-transform:none;color:var(--sheet);border-bottom:1px solid var(--rule);padding-bottom:2px}
.f-tete{display:grid;grid-template-columns:160px minmax(0,1fr);gap:16px 22px}
.f-portrait{display:flex;flex-direction:column;gap:6px}
.f-illu{margin:0;width:160px;height:213px;border:2px solid var(--ink);border-radius:14px;overflow:hidden;display:flex;align-items:flex-end;justify-content:center;background:repeating-linear-gradient(135deg,var(--paper-2) 0 10px,var(--paper) 10px 11px)}
.f-illu img{display:block;width:100%;height:100%;object-fit:cover}
.f-illu figcaption{font-family:var(--f-display);font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);padding-bottom:10px}
.f-portrait .f-boutons{margin:0}
.f-portrait small{color:var(--ink-2);font-size:13px}
.f-droite{display:flex;flex-direction:column;gap:14px;min-width:0}
.f-id{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1.3fr) auto;gap:4px 14px;align-items:end}
.f-id .ch{margin:0}
.f-id input{width:100%;max-width:none}
.f-id .f-nom{font-family:var(--f-display);font-weight:700;font-size:26px;text-transform:uppercase;letter-spacing:.02em}
.f-inspi-b{display:flex;flex-direction:column;align-items:center;gap:0;border:0;background:none;padding:0 4px;cursor:pointer;font-family:var(--f-label);font-weight:700;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--stress)}
.f-inspi-b .fp-etoile{width:30px;height:30px}
.f-var{font-weight:700;font-size:12px;letter-spacing:.06em;color:var(--var)}
/* Gauges (layout in sheets.css): clickable boxes, each zone in its role colour. */
.f-fiche .fp-jauges{--g-zone:4px;--g-sep:16px;margin:0}
.f-fiche .fp-ft{margin:0;border:0;padding:0;font-size:22px;color:var(--health)}
.f-fiche .fp-g.stress{--st:var(--stress)}
.f-fiche .fp-g.rupture{--st:var(--breakdown)}
.f-fiche .fp-g.stress > .fp-ft{color:var(--st)}
.f-n{font-family:var(--f-label);font-size:15px;font-weight:600;color:var(--ink-2)}
.f-fiche .fp-zl{font-family:var(--f-label);font-size:12px;color:var(--ink-2)}
.f-c{min-width:0;min-height:40px;padding:0;font-family:var(--f-display);font-weight:700;font-size:19px;border:1.5px solid var(--ink);border-radius:4px;background:var(--paper);color:var(--ink);cursor:pointer}
.fp-g.health .z1 .f-c{background:color-mix(in srgb,var(--healthy) 20%,var(--paper))}
.fp-g.health .z2 .f-c{background:color-mix(in srgb,var(--part) 20%,var(--paper))}
.fp-g.health .z3 .f-c{background:color-mix(in srgb,var(--health) 20%,var(--paper))}
.fp-g.health .z4 .f-c{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.fp-g.stress .z2 .f-c{background:color-mix(in srgb,var(--st) 22%,var(--paper))}
.fp-g.stress .ext .f-c{background:var(--st);border-color:var(--st);color:var(--paper)}
.f-fiche .fp-g.health .z4 .fp-zl{color:var(--ink)}
.f-fiche .fp-g.stress .ext .fp-zl{color:var(--st)}
.f-c[aria-pressed="true"]{outline:3px solid var(--sheet);outline-offset:1px;position:relative;z-index:1;box-shadow:inset 0 -5px 0 var(--sheet)}
.fp-g > .f-sous{grid-column:1 / -1;min-width:0}
.f-etat{margin:8px 0 6px;font-size:15px}
.f-aide{font-size:14px;color:var(--ink-2)}
.f-blessures{display:grid;gap:4px;margin:0 0 6px}
.f-blessures input{width:100%}
.f-encart{display:flex;flex-direction:column;gap:6px;margin-top:8px;padding:8px 12px 10px;border:2px solid var(--stress);border-radius:8px;background:color-mix(in srgb,var(--stress) 12%,var(--paper))}
.f-encart.rupture{border-color:var(--breakdown);background:color-mix(in srgb,var(--breakdown) 12%,var(--paper))}
.f-encart h4{margin:0;font-family:var(--f-display);font-weight:700;font-size:20px;color:var(--stress)}
.f-encart.rupture h4{color:var(--breakdown)}
.f-encart p{margin:0;font-size:15px}
.f-encart .f-boutons{margin:0}
.f-encart:not(.rupture){flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:space-between}
.f-etat-l{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 10px}
.f-id h2.f-nom{margin:0;overflow-wrap:anywhere}
.f-concept{margin:0;font-size:17px;color:var(--ink-2)}
/* Characteristics: two columns of three; the abbreviation rolls, the specialties hang on a rule. */
.f-caracs2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 28px}
.f-rang{display:grid;grid-template-columns:156px minmax(0,1fr);gap:12px;align-items:start}
.f-ok{display:grid;grid-template-areas:"ab ab" "v nm";grid-template-columns:58px minmax(0,1fr);gap:4px 8px;align-items:center}
.f-ab{grid-area:ab;justify-self:start;font-family:var(--f-display);font-weight:700;font-size:16px;letter-spacing:.05em;background:var(--sheet);color:var(--paper);border-radius:10px;padding:2px 12px}
.f-v{grid-area:v;height:46px;line-height:46px;font-family:var(--f-display);font-weight:700;font-size:30px;text-align:center;border-bottom:3px solid var(--sheet)}
/* Played: a characteristic, a specialty or an item rolls on a click. */
button.f-ok,.f-spe-j,.f-objet-j{font:inherit;color:inherit;background:none;cursor:pointer;text-align:left}
button.f-ok{width:100%;border:1.5px solid transparent;border-radius:10px;padding:4px 6px}
button.f-ok:hover,.f-spe-j:hover,.f-objet-j:hover{background:color-mix(in srgb,var(--sheet) 10%,var(--paper))}
button.f-ok:hover{border-color:var(--sheet)}
.f-spe-j{border:0;border-bottom:1px solid var(--rule);padding:4px 4px 4px 0;min-height:40px}
.f-spe-n{font-weight:600}
.f-objet-j{display:inline-flex;align-items:center;gap:8px;border:0;border-radius:4px;padding:4px 6px 4px 0;min-height:40px}
.f-ok input{grid-area:v;width:100%;max-width:none;height:46px;padding:0;font-family:var(--f-display);font-weight:700;font-size:30px;text-align:center;border:0;border-bottom:3px solid var(--sheet);border-radius:0;background:none}
.f-ok small{grid-area:nm;font-size:13px;color:var(--ink-2);white-space:nowrap}
.f-spes{display:flex;flex-direction:column;gap:2px;border-left:2px solid var(--sheet);padding-left:10px;min-width:0}
.f-spe{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:6px;align-items:center;border-bottom:1px solid var(--rule)}
.f-spe input{width:100%;max-width:none;border-color:transparent;background:none;padding:4px 2px;font-weight:600}
.f-bonus{font-size:13px;font-weight:600;color:var(--ink-2)}
.f-spe-j{grid-template-columns:minmax(0,1fr) auto}
.f-de{display:inline-flex;align-items:center;justify-content:center;min-width:36px;min-height:32px;padding:0;border:1.5px solid var(--sheet);border-radius:4px;background:none;color:var(--sheet);font-size:16px;cursor:pointer}
.f-x{min-width:32px;min-height:32px;padding:0;border:0;background:none;color:var(--ink-2);cursor:pointer}
.f-lien{align-self:flex-start;border:0;background:none;padding:6px 0;min-height:32px;font:inherit;font-size:14px;font-weight:600;color:var(--sheet);cursor:pointer}
.f-textes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}
.f-textes > .ch{display:flex;flex-direction:column;margin-top:0}
.f-textes textarea{width:100%;max-width:none;flex:1;resize:vertical}
.f-identite .ch{margin-top:0}
.f-identite .ch + .ch{margin-top:8px}
.f-identite input{width:100%;max-width:none}
.f-notes{width:100%;max-width:none;resize:vertical}
.f-desc p{margin:0 0 6px}
.f-identite-j{margin:0}
.f-identite-j dt{font-weight:700;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2)}
.f-identite-j dd{margin:0 0 8px}
@media (max-width:820px){
  .f-tete{grid-template-columns:minmax(0,1fr)}
  .f-id{grid-template-columns:minmax(0,1fr) auto}
  .f-id > :nth-child(2){grid-column:1 / -1;grid-row:2}
  .f-id h2.f-nom{font-size:22px}
  .f-caracs2{grid-template-columns:minmax(0,1fr)}
}
/* Phone: Stress under Santé (each gauge keeps its own grid). */
@media (max-width:640px){
  .f-fiche .fp-jauges{grid-template-columns:minmax(0,1fr) !important;row-gap:16px}
  .f-fiche .fp-g{grid-column:1 / -1 !important;grid-template-columns:var(--cols)}
  .f-textes{grid-template-columns:minmax(0,1fr)}
  .f-rang{grid-template-columns:minmax(0,1fr);gap:6px}
  .f-ok{grid-template-areas:"ab v nm";grid-template-columns:auto 52px minmax(0,1fr)}
}
.f-boutons{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:6px 0}
.f-boutons input[type="number"]{width:72px}
.f-table{overflow-x:auto}
.f-objets{width:100%;min-width:560px;border-collapse:collapse}
.f-objets th,.f-objets td{padding:8px 8px 8px 0;border-bottom:1px solid var(--rule);text-align:left;vertical-align:middle}
.f-objets th{background:none;font-family:var(--f-display);font-weight:700;font-size:16px;color:var(--ink-2);border-bottom:1.5px solid var(--sheet)}
.f-res{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;font-size:15px}
.f-piste{display:inline-flex;flex-wrap:wrap;gap:4px}
.f-d{min-width:42px;min-height:36px;padding:0 4px;border:0;border-bottom:1.5px solid var(--ink);background:none;color:var(--ink);font-weight:600;cursor:pointer}
.f-d.on{border-bottom:3px solid var(--sheet);color:var(--sheet);font-weight:700}
.f-ajout{margin:12px 0}
.f-ajout summary{cursor:pointer;font-weight:700;min-height:40px;display:flex;align-items:center;color:var(--sheet)}
.f-libre{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:8px;margin-top:10px}
.f-libre small{grid-column:1 / -1}

/* Creation */
.cr-prets{margin:10px 0 16px}
.cr-etape{max-width:760px}
.cr-etape legend{color:var(--accent);font-size:15px}
.cr-etape .f-caracs{grid-template-columns:repeat(3,minmax(0,1fr))}
.cr-etape .f-carac{cursor:default}
.cr-objets{list-style:none;margin:8px 0 0;padding:0}
.cr-objets li{padding:3px 0}
.cr-controles{list-style:none;margin:0 0 6px;padding:0}
.cr-controles li{padding:4px 0;font-size:15px}
.cr-controles .ok{color:var(--ok)}.cr-controles .ko{color:var(--ko)}
.cr-controles li span{display:inline-block;width:1.2em;font-weight:700}
/* Advice of the rules on the right of each step; below in a single column. */
.cr-ligne{display:grid;grid-template-columns:minmax(0,1fr);gap:0 40px;align-items:start}
.cr-ligne > .cr-etape{min-width:0}
.cr-aide .note{margin:0 0 16px}
.cr-aide .note ul{margin:4px 0 0;padding-left:18px}
.cr-aide .note li{margin:0 0 4px}
.cr-fin{margin-top:16px}
@media (min-width:1181px){
  .cr-ligne{grid-template-columns:minmax(0,760px) 260px}
  .cr-aide .note{margin:14px 0 0}
}

/* NPC cards */
.pnj-liste{list-style:none;margin:8px 0 16px;padding:0;display:flex;flex-wrap:wrap;gap:6px 14px}
.pnj-liste li{display:flex;align-items:center;gap:6px}
.pnj-liste .petit.actif{border-color:var(--accent);box-shadow:inset 0 -3px 0 var(--accent)}
.pnj-apercu{overflow-x:auto;padding:4px 0}

/* Print: only the printable sheet (A4 sheet or sheet of cards, see sheets.css),
   without the controls. */
@media print{
  .page-outils .pm-tete,.no-print,noscript{display:none !important}
  .outils-onglets{display:none !important}
  .page-outils:has(.panneau-fiche) .panneau:not(.panneau-fiche){display:none !important}
  .panneau-fiche,.panneau-fiche[hidden]{display:block !important}
  .page-outils{padding:0;max-width:none}
  .panneau-fiche > :not(.fp-impression){display:none !important}
}

/* Creation: six characteristics on two lines, at 400 px too. */
.cr-etape .f-carac{min-width:0;padding:6px}
.cr-etape .f-carac select{min-width:0;padding-left:4px;padding-right:2px}
.cr-etape .f-carac span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Game settings: the variant. */
.outils-reglages{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:flex-start}
.outils-reglages .choix-variante{margin:0;padding:4px 12px 6px}
.page-outils .outils-variante input{accent-color:var(--var)}

/* Content section of the site: pregens, equipment catalogue and adversaries. */
.acc-contenu{padding:0 0 48px}
.page-contenu{max-width:1300px;margin:0 auto;padding-top:20px}
.pc-tete{border-bottom:3px solid var(--ink);padding-bottom:12px;margin-bottom:24px}
.pc-tete h1{margin:0 0 10px;font-family:var(--f-display);font-weight:700;font-size:clamp(36px,6vw,56px);line-height:1;text-transform:uppercase;letter-spacing:.02em}
.pc-tete .chapo{max-width:72ch;margin:0}
.pc-sommaire{margin-top:10px;font-family:var(--f-label);font-weight:600}
.page-contenu h2{font-family:var(--f-display);font-weight:700;font-size:clamp(28px,4vw,38px);text-transform:uppercase;letter-spacing:.02em;margin:32px 0 8px}
.page-pretires .pc-tete .chapo{max-width:80ch}
.page-pretires .perso{scroll-margin-top:80px}
.pc-ouvrir{font-family:var(--f-label);font-size:15px;margin:10px 0 0}
.pc-ouvrir > span{color:var(--ink-2)}
.pc-ouvrir button{font:inherit;font-size:14px;color:var(--accent);background:none;border:0;padding:4px 0;margin-left:14px;cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.pc-ouvrir button:first-child{margin-left:0}
.pc-univers{display:inline-block;margin-left:10px;padding:1px 8px;border:1px solid currentColor;border-radius:10px;font-family:var(--f-label);font-style:normal;font-size:13px;letter-spacing:.04em}
.pc-objets{margin:8px 0 0;padding-left:18px;font-family:var(--f-label);font-size:15px}
.pc-liste .perso{margin:0 0 20px}
.pc-liste .perso h3{margin:0}
/* Adversaries: the A6 card of the NPC tool, reduced, in a grid. */
.adv-liste{display:grid;grid-template-columns:repeat(auto-fill,minmax(318px,1fr));gap:24px 20px;align-content:start}
.adv{display:flex;flex-direction:column;align-items:center;scroll-margin-top:80px}
.adv[hidden]{display:none}
.adv .cp{zoom:.8;flex:none}
.adv-meta{align-self:stretch;margin:0 0 6px;font-family:var(--f-label);font-size:14px;color:var(--ink-2)}
.adv-meta .pc-univers{margin:0 4px 0 0}
.adv .pc-ouvrir{align-self:stretch}
.adv .pc-ouvrir button:first-child{margin-left:0}
.adv:target .cp{outline:3px solid var(--accent);outline-offset:3px}
.page-adversaires:not(.js) .pc-ouvrir{display:none}
.page-pretires:not(.js) .pc-export,.page-catalogue:not(.js) .cat-actions{display:none}
.cat-json{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.cat-json .bouton{min-height:40px;padding:0 12px;font-size:13px;justify-content:center;cursor:pointer;font-family:var(--f-label)}
.cat-json small{color:var(--ink-2);font-size:13px;line-height:1.4}
.cat-actions{margin:10px 0 0;display:flex;flex-wrap:wrap;gap:8px}
.cat-actions .bouton{min-height:36px;padding:0 12px;font-size:13px;cursor:pointer;font-family:var(--f-label)}
.cat-fiches .cat-actions{display:none}

/* Catalogue: filters, list and sheet; a single column on a small screen. */
.cat{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;align-items:start}
.cat-filtres{font-family:var(--f-label)}
.cat-recherche{display:flex;flex-direction:column;gap:4px;margin-bottom:12px;font-weight:600}
.cat-recherche input{font:inherit;font-weight:400;font-size:16px;color:var(--ink);background:var(--paper);border:1px solid var(--ink-2);border-radius:3px;padding:6px 8px;min-height:40px;width:100%}
.cat-filtre{border:1px solid var(--rule);border-radius:4px;margin:0 0 12px;padding:6px 12px 10px;display:flex;flex-wrap:wrap;gap:4px 14px}
.cat-filtre legend{font-weight:700;color:var(--accent);padding:0 4px}
.cat-filtre label{display:flex;align-items:center;gap:6px;min-height:32px;font-size:15px;cursor:pointer}
.page-contenu:not(.js) .cat-filtres{display:none}
.cat-option{display:flex;align-items:center;gap:2px}
.cat-tout,.cat-seul{font:inherit;font-size:13px;color:var(--accent);background:none;border:0;padding:4px 6px;cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.cat-tout{flex-basis:100%;text-align:left;padding-left:0;font-weight:700}
.cat-seul{color:var(--ink-2)}
.cat-seul:hover,.cat-seul:focus-visible{color:var(--accent)}
@media (hover:hover){.cat-seul{opacity:0}.cat-option:hover .cat-seul,.cat-seul:focus-visible{opacity:1}}
.cat-filtre input{width:18px;height:18px;accent-color:var(--accent)}
.cat-compte{margin:0;color:var(--ink-2);font-size:15px}
.cat-table{width:100%;font-family:var(--f-label);font-size:15px}
.cat-table th{padding:0}
.cat-table th button{all:unset;box-sizing:border-box;display:block;width:100%;padding:8px;cursor:pointer;font-weight:700}
.cat-table th button:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.cat-table th[aria-sort="ascending"] button::after{content:" ▲";font-size:11px}
.cat-table th[aria-sort="descending"] button::after{content:" ▼";font-size:11px}
.cat-table td{vertical-align:top}
.cat-table .cat-nom a{font-weight:700;color:var(--ink);text-decoration:none}
.cat-table .cat-nom small{display:none;color:var(--ink-2);font-size:13px}
.page-catalogue.js .cat-table tbody tr{cursor:pointer}
.cat-table tbody tr:hover td{background:var(--accent-bg)}
.cat-table tbody tr.choisi td{background:var(--accent-bg);box-shadow:inset 0 -2px 0 var(--accent)}
.cat-detail{display:none}
.page-catalogue.js .cat-detail{display:block}
.page-catalogue.js .cat-fiches{display:none}
.cat-vide{color:var(--ink-2);font-family:var(--f-label);margin:0}
.cat-objet{border:2px solid var(--ink);background:var(--paper);padding:0 16px 12px;margin:0 0 16px;scroll-margin-top:80px}
.cat-objet header{background:var(--ink);color:var(--paper);margin:0 -16px 12px;padding:8px 16px}
.cat-objet h3{margin:0;color:var(--paper);font-family:var(--f-display);font-size:24px;text-transform:uppercase;letter-spacing:.02em}
.cat-meta{margin:2px 0 0;font-family:var(--f-label);font-size:14px;opacity:.85}
.cat-objet dl{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:4px 12px;margin:0 0 10px;font-family:var(--f-label);font-size:15px}
.cat-objet dt{font-weight:700;color:var(--ink-2)}
.cat-objet dd{margin:0}
.cat-desc{margin:0;font-style:italic}
.cat-fiches{margin-top:24px}
.cat-fiches .cat-objet{max-width:640px}
/* One column: the chosen sheet goes above the list. */
@media (max-width:960px){
  .cat-filtres{order:1}.cat-detail{order:2;scroll-margin-top:12px}.cat-liste{order:3}
  .page-catalogue.js .cat-detail:has(.cat-vide){display:none}
}
@media (max-width:700px){
  .cat-col-type,.cat-col-univers{display:none}
  .cat-table .cat-nom small{display:block}
}
@media (min-width:961px){
  .cat{grid-template-columns:220px minmax(0,1fr) 300px}
  .cat.cat-persos{grid-template-columns:220px minmax(0,1fr)}
  .cat-persos .cat-filtres{position:sticky;top:76px;max-height:calc(100vh - 90px);overflow-y:auto}
  .cat-filtre{display:block}
  .cat-filtre label{min-height:28px;flex:1}
  .cat-detail{position:sticky;top:76px}
}
@media print{
  .cat-filtres,.cat-detail{display:none !important}
  .page-catalogue.js .cat-fiches{display:block}
  .cat{display:block}
}