/* Les directions de style en lice (2026-10-07), écrites à la main pour les gabarits du site simplifié : les deux retenues
   par Mathieu (« Pochette de jazz » et « Flyer punk ») et 20 croisements des deux. Chaque style tient sous
   body[data-design="<id>"] : une palette, des polices, puis ses règles. Liste : config/designs.php.
   Un croisement = sa palette + des « ingrédients » partagés pris à la pochette ou au flyer (plus bas) + quelques règles à lui.
   Le style actuel du site (washi) vit dans design-washi.css et n'est pas touché par ce fichier. */

/* ——— Base commune : la palette de chaque style devient les jetons du site ——— */
body:where([data-design]:not([data-design="washi"])) {
  --color-ground: var(--bg); --color-surface: var(--surface);
  --color-surface-2: color-mix(in srgb, var(--ink) 5%, var(--bg)); --color-surface-3: color-mix(in srgb, var(--ink) 10%, var(--bg));
  --color-ink: var(--ink); --color-text-2: var(--muted); --color-text-muted: var(--muted);
  --color-accent: var(--acc); --color-accent-text: var(--acc-text, var(--acc)); --color-focus: var(--acc-text, var(--acc));
  --color-accent-soft: color-mix(in srgb, var(--acc) 16%, var(--bg));
  --color-border: var(--line); --color-border-card: var(--line); --color-border-strong: var(--line-strong, var(--line));
  --font-display: var(--fd), system-ui, sans-serif; --font-body: var(--fb), system-ui, sans-serif; --font-mono: var(--fm, var(--fb)), ui-monospace, monospace;
  --radius-sm: var(--r); --radius-md: var(--r); --radius-lg: var(--r-lg, var(--r)); --radius-pill: var(--pill, 999px);
  --shadow-card: 0 18px 40px -22px color-mix(in srgb, var(--ink) 40%, transparent);
  /* Disciplines : une teinte par défaut, ou six couleurs (--c1 à --c6) quand le style est multicolore. */
  --tint: color-mix(in srgb, var(--acc) 16%, var(--bg));
  --disc-musique-bg: var(--c1, var(--tint)); --disc-quiz-bg: var(--c1, var(--tint));
  --disc-soirees-bg: var(--c2, var(--tint)); --disc-cabaret-bg: var(--c2, var(--tint));
  --disc-humour-bg: var(--c3, var(--tint)); --disc-karaoke-bg: var(--c3, var(--tint));
  --disc-danse-bg: var(--c4, var(--tint)); --disc-arts-visuels-bg: var(--c4, var(--tint));
  --disc-theatre-bg: var(--c5, var(--tint)); --disc-litterature-bg: var(--c5, var(--tint));
  --disc-cirque-bg: var(--c6, var(--tint)); --disc-cinema-bg: var(--c6, var(--tint)); --disc-autre-bg: var(--tint);
  --disc-musique-ink: var(--cink, var(--ink)); --disc-quiz-ink: var(--cink, var(--ink)); --disc-soirees-ink: var(--cink, var(--ink));
  --disc-cabaret-ink: var(--cink, var(--ink)); --disc-humour-ink: var(--cink, var(--ink)); --disc-karaoke-ink: var(--cink, var(--ink));
  --disc-danse-ink: var(--cink, var(--ink)); --disc-arts-visuels-ink: var(--cink, var(--ink)); --disc-theatre-ink: var(--cink, var(--ink));
  --disc-litterature-ink: var(--cink, var(--ink)); --disc-cirque-ink: var(--cink, var(--ink)); --disc-cinema-ink: var(--cink, var(--ink));
  --disc-autre-ink: var(--ink);

  .sday h1, .splacehead h1, .sevpage h1, .sev__title, .scity__name, .stop__name, .stop__count b, .sstrip__day b, .sblock h2, .sgroup, .sempty h2, .sevpage__when { font-weight: var(--fd-w, 700); }
  .ssearch button, .sbtn:not(.sbtn--quiet), .speriods__btn.is-on, .sstrip__day.is-on, .sstrip__day.is-on small, .sstrip__day.is-on b, .temoins-accepter { color: var(--on-acc, var(--bg)); }
  .ssearch button:hover, .sbtn:not(.sbtn--quiet):hover { background: var(--acc); filter: brightness(0.9); }
  /* Le logo provisoire cède la place à un monogramme dessiné par chaque style. */
  .stop__brand img { display: none; }
  .stop__brand::before { content: "?!"; flex: 0 0 auto; display: grid; place-items: center; width: 2.5em; height: 2.5em; font: var(--fd-w, 700) 1.5rem/1 var(--font-display); letter-spacing: 0; background: var(--ink); color: var(--bg); border-radius: var(--r); }
  .slist > li { max-width: none; }
  .sev__img--none { display: flex; text-decoration: none; }
  .scats { flex-wrap: wrap; }
  .scats a { flex: 0 1 auto; }
  .schip--free { background: var(--free-bg, var(--color-accent-soft)); color: var(--free-ink, var(--ink)); }
}

/* ——— Mise en page « rangées » : une ligne par spectacle (heure, titre et lieu, prix), sans image ——— */
body:where([data-design="fanzine"], [data-design="setlist"], [data-design="dactylo"]) {
  .slist { grid-template-columns: 1fr; gap: 0; }
  .sev { padding: 0.95rem 0; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: none; }
  .sev__img { display: none; }
  .sev__body { flex: 1; display: grid; grid-template-columns: 6.5rem minmax(0, 1fr) auto; column-gap: 1.5rem; align-items: baseline; }
  .sev__when { grid-column: 1; grid-row: 1 / span 4; margin: 0; font-size: 1.0625rem; }
  .sev__title, .sev__artists, .sev__meta, .stags { grid-column: 2; }
  .sev__title { font-size: 1.3125rem; }
  .sev__foot { grid-column: 3; grid-row: 1 / span 4; flex-direction: column; align-items: flex-end; gap: 4px; margin: 0; padding: 0; }
  .sev__tickets { margin-left: 0; }
  @media (max-width: 640px) {
    .sev__body { grid-template-columns: 4.4rem minmax(0, 1fr); column-gap: 0.9rem; }
    .sev__when { font-size: 0.9375rem; }
    .sev__foot { grid-column: 2; grid-row: auto; flex-direction: row; align-items: center; gap: 4px 12px; padding-top: 6px; }
  }
}

/* ——— Mise en page « affiches » : une grille de cartes verticales, l'image en haut ——— */
body:where([data-design="cbgb"], [data-design="punkbleu"], [data-design="pochettecollee"], [data-design="bandebleue"], [data-design="afficheclub"], [data-design="serigraphie"], [data-design="ruban"], [data-design="hardbop"], [data-design="collage"], [data-design="rayures"], [data-design="grandformat"]) {
  .slist { grid-template-columns: repeat(auto-fill, minmax(15.5rem, 1fr)); gap: 1.5rem; }
  .sev { flex-direction: column; gap: 0; padding: 0; overflow: hidden; }
  .sev__img { flex: 0 0 auto; width: 100%; height: auto; aspect-ratio: 4 / 3; border-radius: 0; }
  .sev__img--none { padding: 0.9rem 1rem; }
  .sev__img--none span { font-family: var(--font-display); font-size: 1.5rem; font-weight: var(--fd-w, 700); letter-spacing: 0; text-transform: none; line-height: 1; }
  .sev__body { flex: 1; padding: 0.9rem 1rem 1rem; }
  @media (max-width: 560px) { .slist { grid-template-columns: 1fr 1fr; gap: 0.75rem; } .sev__body { padding: 0.7rem; } .sev__title { font-size: 1rem; } }
}


/* ═════ 01 · Pochette de jazz ═════ */
body[data-design="bluenote"] {
  --bg: #F4F1E9; --surface: #FFFFFF; --ink: #0F1B2A; --muted: #47525F; --acc: #0A6FD6; --on-acc: #FFFFFF; --line: #0F1B2A; --line-strong: #0F1B2A; --r: 0; --pill: 0;
  --fd: "Oswald"; --fb: "Barlow"; --fm: "Barlow"; --fd-w: 700; --tracking-mono: 0.1em; --tint: #0A6FD6; --cink: #FFFFFF; --disc-autre-ink: #FFFFFF;
  .stop { border-bottom: 0; background: none; overflow: hidden; }
  .stop__inner { padding-block: 0; }
  .stop__brand, .stop__name { color: #FFFFFF; }
  .stop__brand { padding: 2.2rem 2.4rem 2.2rem 0; background: #0A6FD6; box-shadow: -100vw 0 0 #0A6FD6; }
  .stop__brand::before { background: #F4F1E9; color: #0A6FD6; border-radius: 50%; }
  .stop__name { text-transform: uppercase; font-size: clamp(1.24rem, 0.74rem + 2.11vw, 2.23rem); line-height: 0.98; max-width: 11em; }
  .stop__name small { color: #D6E8FB; }
  .stop__count b { font-size: clamp(2.6rem, 1.6rem + 4vw, 4.6rem); line-height: 0.9; color: #0F1B2A; }
  .stop__nav a { text-transform: uppercase; letter-spacing: 0.12em; font-size: 0.8125rem; color: #0F1B2A; }
  .sday { display: grid; grid-template-columns: auto auto; justify-content: space-between; column-gap: 1.2rem; align-items: end; border-bottom: 10px solid #0F1B2A; margin-bottom: 1.2rem; }
  .sday .eyebrow { grid-column: 1 / -1; color: #0A6FD6; font-weight: 700; }
  .sday h1 { font-size: clamp(3rem, 1.4rem + 8vw, 7.5rem); text-transform: uppercase; line-height: 0.88; letter-spacing: -0.02em; margin: 0; }
  .sday__count { padding-bottom: 0.4rem; white-space: nowrap; text-transform: uppercase; letter-spacing: 0.1em; font-size: 0.8125rem; font-weight: 700; }
  .scats a, .speriods__btn, .stools .sfree label { border: 0; background: none; text-transform: uppercase; letter-spacing: 0.1em; font-size: 0.8125rem; padding-inline: 8px; }
  .scats a.is-on, .speriods__btn.is-on { background: #0A6FD6; color: #FFFFFF; }
  .speriods__btn { color: #0F1B2A; }
  .sstrip__day { border: 0; border-top: 4px solid #0F1B2A; background: none; }
  .sstrip__day.is-on { border-top-color: #0A6FD6; background: #0A6FD6; }
  .slist { gap: 2rem 2.5rem; }
  .sev { padding: 0; border: 0; background: none; gap: 1.1rem; }
  .sev__img { flex-basis: 9.5rem; height: 9.5rem; background: #0A6FD6; }
  .sev__img img { filter: grayscale(1) contrast(1.25); mix-blend-mode: multiply; }
  .sev__img--none { align-items: flex-start; }
  .sev__img--none span { font-family: var(--font-display); font-size: 1.5rem; letter-spacing: 0; line-height: 1; }
  .sev:nth-child(3n + 2) .sev__img { background: #0F1B2A; }
  .sev:nth-child(3n + 2) .sev__img--none { background: #0F1B2A; color: #F4F1E9; }
  .sev__body { border-top: 4px solid #0F1B2A; padding-top: 0.5rem; }
  .sev__when { color: #0A6FD6; font-family: var(--font-display); font-size: 1.125rem; }
  .sev__title { font-size: 1.625rem; text-transform: uppercase; line-height: 1; }
  .stag { border: 0; background: none; padding: 0; margin-right: 8px; text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.75rem; }
  .stag--disc { background: none; color: #0A6FD6; }
  .sfoot { background: #0F1B2A; color: #C9D3DE; border-top: 0; --color-ink: #FFFFFF; --color-text-2: #C9D3DE; --color-accent-text: #6DB4FF; --color-border: #2C3B4E; }
  @media (max-width: 760px) { .stop__brand { padding: 1.6rem 1rem; box-shadow: -100vw 0 0 #0A6FD6, 100vw 0 0 #0A6FD6; } .stop__name { max-width: none; } .sday { display: block; } .sday__count { white-space: normal; } }
}

/* ═════ 02 · Flyer punk ═════ */
body[data-design="cbgb"] {
  --bg: #EFEDE6; --surface: #FFFFFF; --ink: #0B0B0B; --muted: #3F3F3F; --acc: #E6007E; --on-acc: #FFFFFF; --line: #0B0B0B; --line-strong: #0B0B0B; --r: 0; --pill: 0;
  --fd: "Archivo Black"; --fb: "Space Mono"; --fm: "Space Mono"; --fd-w: 400; --tracking-mono: 0; --text-base: 16px; --tint: #0B0B0B; --cink: #FFFFFF; --disc-autre-ink: #FFFFFF;
  background-image: radial-gradient(#0B0B0B14 1px, transparent 1.3px); background-size: 5px 5px;
  .stop { background: none; border-bottom: 5px solid #0B0B0B; }
  .stop__brand::before { background: #E6007E; color: #0B0B0B; transform: rotate(-7deg); box-shadow: 4px 4px 0 #0B0B0B; }
  .stop__name { text-transform: uppercase; font-size: clamp(1.24rem, 0.68rem + 2.85vw, 2.73rem); letter-spacing: -0.04em; line-height: 0.9; }
  .stop__name small { display: inline-block; padding: 2px 8px; background: #0B0B0B; color: #EFEDE6; transform: rotate(-1.5deg); }
  .stop__count { transform: rotate(4deg); padding: 6px 12px; border: 3px solid #E6007E; color: #E6007E; }
  .stop__count b, .stop__count span { color: #E6007E; }
  .stop__nav a { text-transform: uppercase; text-decoration: underline; text-decoration-thickness: 3px; color: #0B0B0B; }
  .sday h1 { display: inline; padding: 0 0.15em; background: #0B0B0B; color: #EFEDE6; font-size: clamp(2.2rem, 1.2rem + 5vw, 5rem); text-transform: uppercase; line-height: 1.12; letter-spacing: -0.03em; box-decoration-break: clone; -webkit-box-decoration-break: clone; }
  .sday__count { margin-top: 0.9rem; }
  .scats a, .speriods__btn, .stools .sfree label, .sstrip__day, .sstrip__arrow, .ssearch input { border: 2px solid #0B0B0B; text-transform: uppercase; }
  .speriods__btn { color: #0B0B0B; }
  .scats a.is-on { background: #E6007E; border-color: #0B0B0B; color: #0B0B0B; }
  .slist { gap: 2rem 1.6rem; padding-top: 1rem; }
  .sev { overflow: visible; position: relative; border: 3px solid #0B0B0B; background: #FFFFFF; box-shadow: 6px 6px 0 #0B0B0B; transform: rotate(-0.8deg); }
  .sev:nth-child(3n + 2) { transform: rotate(1deg); background: #FFE94A; }
  .sev:nth-child(3n) { transform: rotate(-0.3deg); background: #FF9BCF; }
  .sev::before { content: ""; position: absolute; z-index: 2; top: -13px; left: 50%; width: 5.5rem; height: 24px; margin-left: -2.75rem; background: #F4E9B8CC; border-inline: 1px dashed #0B0B0B33; transform: rotate(-3deg); }
  .sev__img img { filter: grayscale(1) contrast(1.5); }
  .sev__img--none { aspect-ratio: 16 / 6; background: repeating-linear-gradient(135deg, #0B0B0B 0 10px, transparent 10px 20px); border-bottom: 3px solid #0B0B0B; }
  .sev__img--none span { padding: 2px 8px; background: #0B0B0B; color: #FFFFFF; font-size: 1.125rem; text-transform: uppercase; }
  .sev__when { display: inline-block; align-self: flex-start; padding: 1px 8px; border: 2px solid #0B0B0B; color: #0B0B0B; transform: rotate(-2deg); }
  .sev__title { font-size: 1.5rem; text-transform: uppercase; line-height: 1; letter-spacing: -0.02em; }
  .stag { border: 0; background: none; padding: 0; margin-right: 6px; text-decoration: underline; }
  .stag--disc { background: #0B0B0B; color: #FFFFFF; padding: 1px 7px; text-decoration: none; text-transform: uppercase; }
  .sev__meta a { color: #0B0B0B; }
  .schip, .schip--free { background: #0B0B0B; color: #FFFFFF; }
  .sev__tickets { color: #0B0B0B; background: #FFFFFF; padding: 0 6px; border: 2px solid #0B0B0B; }
  .sfoot { background: #0B0B0B; color: #D8D6CF; --color-ink: #FFFFFF; --color-text-2: #D8D6CF; --color-accent-text: #FF6FB8; --color-border: #333333; }
  .sad__link { background: #0B0B0B; color: #FFFFFF; border: 3px solid #0B0B0B; box-shadow: 6px 6px 0 #E6007E; transform: rotate(-0.4deg); }
  .sad__label { padding: 1px 6px; background: #FFE94A; color: #0B0B0B; opacity: 1; transform: rotate(-3deg); }
  .sad__title { text-transform: uppercase; letter-spacing: -0.02em; }
  .sad__go { background: #E6007E; color: #0B0B0B; border: 2px solid #FFFFFF; text-transform: uppercase; }
  /* Téléphone : un en-tête ramassé (compteur sur une ligne) et une affiche par rangée, pour que les titres ne se coupent pas. */
  @media (max-width: 560px) {
    .stop__inner { gap: 0.5rem; padding-block: 0.8rem; }
    .stop__brand { gap: 0.5rem; }
    .stop__brand::before { width: 2em; height: 2em; font-size: 1.125rem; }
    .stop__count { width: fit-content; margin-inline: auto; padding: 2px 10px; border-width: 2px; transform: rotate(-1.5deg); }
    .stop__count b { display: inline; font-size: 1.125rem; }
    .slist { grid-template-columns: 1fr; gap: 1.6rem; }
    .sev__body { padding: 0.9rem 1rem 1rem; }
    .sev__title { font-size: 1.375rem; }
    .sev__img { aspect-ratio: 16 / 10; }
  }
}


/* ═════ Les croisements : ce qu'ils ont tous en commun ═════ */
body:where([data-design="jazzxerox"], [data-design="punkbleu"], [data-design="deuxencres"], [data-design="pochettecollee"], [data-design="bandebleue"], [data-design="rosemarine"], [data-design="afficheclub"], [data-design="fanzine"], [data-design="tampon"], [data-design="serigraphie"], [data-design="ruban"], [data-design="hardbop"], [data-design="trame"], [data-design="setlist"], [data-design="collage"], [data-design="rosefranc"], [data-design="noirbleu"], [data-design="dactylo"], [data-design="rayures"], [data-design="grandformat"]) {
  --r: 0; --pill: 0; --line: var(--ink); --line-strong: var(--ink); --surface: #FFFFFF; --tracking-mono: 0.06em;
  .stop__name { text-transform: uppercase; line-height: 0.98; max-width: 13em; }
  .sday h1 { text-transform: uppercase; letter-spacing: -0.02em; }
  .sev__title { text-transform: uppercase; line-height: 1; font-size: 1.5rem; }
  .stop__nav a { text-transform: uppercase; letter-spacing: 0.1em; font-size: 0.8125rem; color: var(--ink); }
  .scats a, .speriods__btn, .stools .sfree label { text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.8125rem; }
  .speriods__btn { color: var(--ink); }
  .stag { border: 0; background: none; padding: 0; margin-right: 8px; text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.75rem; }
  .stag--disc { background: none; color: var(--acc-text); }
  .sev__img--none { align-items: flex-start; }
  .sev__img--none span { font-family: var(--font-display); font-size: 1.5rem; letter-spacing: 0; line-height: 1; text-transform: uppercase; }
  .sfoot { background: var(--ink); color: #D5D5D0; border-top: 0; --color-ink: #FFFFFF; --color-text-2: #D5D5D0; --color-text-muted: #D5D5D0; --color-accent-text: #FFFFFF; --color-border: #3A3A3A; }
}

/* Ingrédient : grain de photocopie */
body:where([data-design="jazzxerox"], [data-design="punkbleu"], [data-design="pochettecollee"], [data-design="fanzine"], [data-design="collage"], [data-design="dactylo"]) {
  background-image: radial-gradient(color-mix(in srgb, var(--ink) 9%, transparent) 1px, transparent 1.3px); background-size: 5px 5px;
}
/* Ingrédient : en-tête en bloc de couleur (pochette) */
body:where([data-design="jazzxerox"], [data-design="deuxencres"], [data-design="pochettecollee"], [data-design="rosemarine"], [data-design="tampon"], [data-design="ruban"], [data-design="hardbop"], [data-design="rosefranc"], [data-design="rayures"]) {
  .stop { border-bottom: 0; background: none; overflow: hidden; }
  .stop__inner { padding-block: 0; }
  .stop__brand, .stop__name { color: var(--on-acc); }
  .stop__brand { padding: 2.2rem 2.4rem 2.2rem 0; background: var(--acc); box-shadow: -100vw 0 0 var(--acc); }
  .stop__brand::before { background: var(--bg); color: var(--ink); border-radius: 50%; }
  .stop__name small { color: var(--on-acc); }
  .stop__count b { font-size: clamp(2.6rem, 1.6rem + 4vw, 4.6rem); line-height: 0.9; color: var(--ink); }
  @media (max-width: 760px) { .stop__brand { padding: 1.6rem 1rem; box-shadow: -100vw 0 0 var(--acc), 100vw 0 0 var(--acc); } .stop__name { max-width: none; } }
}
/* Ingrédient : en-tête sur filet épais (flyer) */
body:where([data-design="punkbleu"], [data-design="bandebleue"], [data-design="afficheclub"], [data-design="fanzine"], [data-design="serigraphie"], [data-design="trame"], [data-design="setlist"], [data-design="collage"], [data-design="noirbleu"], [data-design="dactylo"], [data-design="grandformat"]) {
  .stop { background: none; border-bottom: 5px solid var(--ink); }
  .stop__brand::before { background: var(--acc); color: var(--on-acc); transform: rotate(-7deg); box-shadow: 4px 4px 0 var(--ink); }
  .stop__name small { display: inline-block; padding: 2px 8px; background: var(--ink); color: var(--bg); transform: rotate(-1.5deg); }
}
/* Ingrédient : compteur tamponné de travers */
body:where([data-design="punkbleu"], [data-design="fanzine"], [data-design="tampon"], [data-design="collage"], [data-design="grandformat"]) {
  .stop__count { transform: rotate(4deg); padding: 6px 12px; border: 3px solid var(--stamp, var(--acc-text)); }
  .stop__count b, .stop__count span { color: var(--stamp, var(--acc-text)); }
  .stop__count b { font-size: clamp(1.5rem, 1.1rem + 1.8vw, 2.25rem); }
}
/* Ingrédient : date énorme sur règle épaisse (pochette) */
body:where([data-design="jazzxerox"], [data-design="deuxencres"], [data-design="pochettecollee"], [data-design="rosemarine"], [data-design="afficheclub"], [data-design="tampon"], [data-design="ruban"], [data-design="setlist"], [data-design="collage"], [data-design="noirbleu"], [data-design="rayures"], [data-design="grandformat"]) {
  .sday { display: grid; grid-template-columns: auto auto; justify-content: space-between; column-gap: 1.2rem; align-items: end; border-bottom: 10px solid var(--ink); margin-bottom: 1.2rem; }
  .sday .eyebrow { grid-column: 1 / -1; color: var(--acc-text); font-weight: 700; }
  .sday h1 { font-size: clamp(2.6rem, 1.2rem + 7vw, var(--day-max, 7rem)); line-height: 0.9; margin: 0; }
  .sday__count { padding-bottom: 0.4rem; white-space: nowrap; text-transform: uppercase; letter-spacing: 0.1em; font-size: 0.8125rem; font-weight: 700; }
  @media (max-width: 760px) { .sday { display: block; } .sday__count { white-space: normal; } }
}
/* Ingrédient : date en bandes (flyer) */
body:where([data-design="punkbleu"], [data-design="bandebleue"], [data-design="fanzine"], [data-design="serigraphie"], [data-design="hardbop"], [data-design="trame"], [data-design="rosefranc"], [data-design="dactylo"]) {
  .sday h1 { display: inline; padding: 0 0.15em; background: var(--band, var(--ink)); color: var(--band-ink, var(--bg)); font-size: clamp(2.2rem, 1.2rem + 5vw, 5rem); line-height: 1.12; box-decoration-break: clone; -webkit-box-decoration-break: clone; }
  .sday__count { margin-top: 0.9rem; }
}
/* Ingrédient : filtres à plat (pochette) */
body:where([data-design="deuxencres"], [data-design="pochettecollee"], [data-design="rosemarine"], [data-design="afficheclub"], [data-design="tampon"], [data-design="ruban"], [data-design="hardbop"], [data-design="setlist"], [data-design="rosefranc"], [data-design="dactylo"], [data-design="grandformat"]) {
  .scats a, .speriods__btn, .stools .sfree label { border: 0; background: none; padding-inline: 8px; }
  .scats a.is-on, .speriods__btn.is-on { background: var(--acc); color: var(--on-acc); }
  .sstrip__day { border: 0; border-top: 4px solid var(--ink); background: none; }
  .sstrip__day.is-on { border-top-color: var(--acc); background: var(--acc); }
}
/* Ingrédient : filtres encadrés (flyer) */
body:where([data-design="jazzxerox"], [data-design="punkbleu"], [data-design="bandebleue"], [data-design="fanzine"], [data-design="serigraphie"], [data-design="trame"], [data-design="collage"], [data-design="noirbleu"], [data-design="rayures"]) {
  .scats a, .speriods__btn, .stools .sfree label, .sstrip__day, .sstrip__arrow, .ssearch input { border: 2px solid var(--ink); }
  .scats a.is-on { background: var(--acc); border-color: var(--ink); color: var(--on-acc); }
}
/* Ingrédient : carte sans contour, règle en tête (pochette) */
body:where([data-design="jazzxerox"], [data-design="deuxencres"], [data-design="rosemarine"], [data-design="afficheclub"], [data-design="tampon"], [data-design="rosefranc"], [data-design="rayures"], [data-design="grandformat"]) {
  .slist { gap: 2rem 2.5rem; }
  .sev { padding: 0; border: 0; background: none; gap: 1.1rem; }
  .sev__img { flex-basis: 9.5rem; }
  .sev__body { border-top: 4px solid var(--ink); padding-top: 0.5rem; }
  .sev__when { color: var(--acc-text); font-family: var(--font-display); font-size: 1.125rem; }
}
/* Ingrédient : carte à contour épais et ombre franche (flyer) */
body:where([data-design="punkbleu"], [data-design="pochettecollee"], [data-design="bandebleue"], [data-design="serigraphie"], [data-design="trame"], [data-design="collage"], [data-design="noirbleu"]) {
  .slist { gap: 2rem 1.6rem; padding-top: 1rem; }
  .sev { border: 3px solid var(--ink); background: var(--surface); box-shadow: 6px 6px 0 var(--shadow, var(--ink)); }
}
/* Ingrédient : images en deux tons (pochette) */
body:where([data-design="jazzxerox"], [data-design="deuxencres"], [data-design="pochettecollee"], [data-design="rosemarine"], [data-design="afficheclub"], [data-design="tampon"], [data-design="serigraphie"], [data-design="rosefranc"], [data-design="grandformat"]) {
  .sev__img, .sev__img--none { background: var(--acc); color: var(--on-acc); }
  .sev__img img { filter: grayscale(1) contrast(1.25); mix-blend-mode: multiply; }
  .sev:nth-child(3n + 2) :is(.sev__img, .sev__img--none) { background: var(--duo2, color-mix(in srgb, var(--acc) 55%, var(--bg))); }
}
/* Ingrédient : images en noir et blanc (flyer) */
body:where([data-design="punkbleu"], [data-design="bandebleue"], [data-design="ruban"], [data-design="hardbop"], [data-design="trame"], [data-design="collage"], [data-design="noirbleu"], [data-design="rayures"]) {
  .sev__img img { filter: grayscale(1) contrast(1.4); }
}
/* Ingrédient : cartes de travers (flyer) */
body:where([data-design="punkbleu"], [data-design="pochettecollee"], [data-design="collage"]) {
  .sev { overflow: visible; position: relative; transform: rotate(-0.8deg); }
  .sev:nth-child(3n + 2) { transform: rotate(1deg); }
  .sev:nth-child(3n) { transform: rotate(-0.3deg); }
}
/* Ingrédient : ruban adhésif (flyer) */
body:where([data-design="punkbleu"], [data-design="pochettecollee"], [data-design="ruban"], [data-design="collage"]) {
  .sev { overflow: visible; position: relative; }
  .sev::before { content: ""; position: absolute; z-index: 2; top: -13px; left: 50%; width: 5.5rem; height: 24px; margin-left: -2.75rem; background: #F4E9B8CC; border-inline: 1px dashed #0B0B0B33; transform: rotate(-3deg); }
}
/* Ingrédient : cartes de couleurs alternées (flyer) */
body:where([data-design="punkbleu"], [data-design="collage"]) {
  .sev:nth-child(3n + 2) { background: var(--alt1); }
  .sev:nth-child(3n) { background: var(--alt2); }
}
/* Ingrédient : hachures quand il n’y a pas d’image (flyer) */
body:where([data-design="punkbleu"], [data-design="collage"], [data-design="rayures"]) {
  .sev__img--none { background: repeating-linear-gradient(135deg, var(--hatch, var(--ink)) 0 10px, transparent 10px 20px); border-bottom: 3px solid var(--ink); }
  .sev__img--none span { padding: 2px 8px; background: var(--ink); color: #FFFFFF; font-size: 1.125rem; }
}
/* Ingrédient : heure encadrée de travers (flyer) */
body:where([data-design="punkbleu"], [data-design="tampon"], [data-design="dactylo"]) {
  .sev__when { display: inline-block; align-self: flex-start; justify-self: start; padding: 1px 8px; border: 2px solid var(--ink); color: var(--ink); transform: rotate(-2deg); }
}
/* Ingrédient : heure sur bande pleine */
body:where([data-design="fanzine"], [data-design="rosefranc"]) {
  .sev__when { display: inline-block; align-self: flex-start; justify-self: start; padding: 1px 8px; background: var(--ink); color: var(--bg); }
}
/* Ingrédient : pastilles noires (flyer) */
body:where([data-design="punkbleu"], [data-design="bandebleue"], [data-design="fanzine"], [data-design="trame"], [data-design="collage"], [data-design="noirbleu"]) {
  .schip, .schip--free { background: var(--ink); color: #FFFFFF; }
  .sev__tickets { color: var(--ink); background: var(--surface); padding: 0 6px; border: 2px solid var(--ink); }
  .sev__meta a { color: var(--ink); }
}
/* Ingrédient : discipline sur bande noire (flyer) */
body:where([data-design="punkbleu"], [data-design="fanzine"], [data-design="setlist"], [data-design="grandformat"]) {
  .stag--disc { background: var(--ink); color: #FFFFFF; padding: 1px 7px; }
}

/* ═════ 03 · Jazz photocopié ═════ */
body[data-design="jazzxerox"] {
  --bg: #F4F1E9; --ink: #0B0B0B; --muted: #3F3F3F; --acc: #0A6FD6; --on-acc: #FFFFFF; --acc-text: #0A6FD6;
  --fd: "Oswald"; --fb: "Space Mono"; --fm: "Space Mono"; --fd-w: 700; --tint: var(--acc); --cink: var(--on-acc); --disc-autre-ink: var(--on-acc);
}

/* ═════ 04 · Punk en bleu ═════ */
body[data-design="punkbleu"] {
  --bg: #EFEDE6; --ink: #0B0B0B; --muted: #3F3F3F; --acc: #0A6FD6; --on-acc: #FFFFFF; --acc-text: #0A6FD6;
  --fd: "Archivo Black"; --fb: "Space Mono"; --fm: "Space Mono"; --fd-w: 400; --tint: var(--ink); --cink: #FFFFFF; --disc-autre-ink: #FFFFFF; --alt1: #BFDCFF; --alt2: #FFE94A;
}

/* ═════ 05 · Deux encres ═════ */
body[data-design="deuxencres"] {
  --bg: #F4F1E9; --ink: #0F1B2A; --muted: #47525F; --acc: #0A6FD6; --on-acc: #FFFFFF; --acc-text: #0A6FD6;
  --fd: "Oswald"; --fb: "Barlow"; --fm: "Barlow"; --fd-w: 700; --tint: var(--acc); --cink: var(--on-acc); --disc-autre-ink: var(--on-acc); --duo2: #E6007E;
  .sday { border-bottom-color: #E6007E; }
}

/* ═════ 06 · Pochette collée ═════ */
body[data-design="pochettecollee"] {
  --bg: #F4F1E9; --ink: #0F1B2A; --muted: #47525F; --acc: #0A6FD6; --on-acc: #FFFFFF; --acc-text: #0A6FD6;
  --fd: "Oswald"; --fb: "Barlow"; --fm: "Barlow"; --fd-w: 700; --tint: var(--acc); --cink: var(--on-acc); --disc-autre-ink: var(--on-acc); --shadow: #0A6FD6;
}

/* ═════ 07 · Bande bleue ═════ */
body[data-design="bandebleue"] {
  --bg: #EFEDE6; --ink: #0B0B0B; --muted: #3F3F3F; --acc: #0A6FD6; --on-acc: #FFFFFF; --acc-text: #0A6FD6;
  --fd: "Archivo Black"; --fb: "Barlow"; --fm: "Barlow"; --fd-w: 400; --tint: var(--ink); --cink: #FFFFFF; --disc-autre-ink: #FFFFFF; --band: #0A6FD6; --band-ink: #FFFFFF;
}

/* ═════ 08 · Rose sur marine ═════ */
body[data-design="rosemarine"] {
  --bg: #F4F1E9; --ink: #0F1B2A; --muted: #47525F; --acc: #E6007E; --on-acc: #0F1B2A; --acc-text: #B8005F;
  --fd: "Oswald"; --fb: "Barlow"; --fm: "Barlow"; --fd-w: 700; --tint: var(--acc); --cink: var(--on-acc); --disc-autre-ink: var(--on-acc);
}

/* ═════ 09 · Affiche de club ═════ */
body[data-design="afficheclub"] {
  --bg: #F7F5F0; --ink: #0B0B0B; --muted: #3F3F3F; --acc: #E6007E; --on-acc: #0B0B0B; --acc-text: #B8005F;
  --fd: "Barlow Condensed"; --fb: "Barlow"; --fm: "Barlow"; --fd-w: 700; --tint: var(--acc); --cink: var(--on-acc); --disc-autre-ink: var(--on-acc); --duo2: #0A6FD6;
  .sev__title { font-size: 1.75rem; } .sev__body { padding-inline: 0; }
}

/* ═════ 10 · Fanzine ═════ */
body[data-design="fanzine"] {
  --bg: #EFEDE6; --ink: #0B0B0B; --muted: #3F3F3F; --acc: #0A6FD6; --on-acc: #FFFFFF; --acc-text: #0A6FD6;
  --fd: "Archivo Black"; --fb: "Space Mono"; --fm: "Space Mono"; --fd-w: 400; --tint: var(--ink); --cink: #FFFFFF; --disc-autre-ink: #FFFFFF;
  .sev { border-bottom: 3px solid #0B0B0B; }
}

/* ═════ 11 · Coup de tampon ═════ */
body[data-design="tampon"] {
  --bg: #F4F1E9; --ink: #0F1B2A; --muted: #47525F; --acc: #0A6FD6; --on-acc: #FFFFFF; --acc-text: #0A6FD6;
  --fd: "Oswald"; --fb: "Barlow"; --fm: "Barlow"; --fd-w: 700; --tint: var(--acc); --cink: var(--on-acc); --disc-autre-ink: var(--on-acc); --stamp: #B8005F;
  .sev__when { border-color: #B8005F; color: #B8005F; font-family: var(--font-body); font-size: 0.8125rem; }
}

/* ═════ 12 · Sérigraphie ═════ */
body[data-design="serigraphie"] {
  --bg: #F4F1E9; --ink: #0F1B2A; --muted: #47525F; --acc: #0A6FD6; --on-acc: #FFFFFF; --acc-text: #0A6FD6;
  --fd: "Oswald"; --fb: "Barlow"; --fm: "Barlow"; --fd-w: 700; --tint: var(--acc); --cink: var(--on-acc); --disc-autre-ink: var(--on-acc); --band: #0A6FD6; --band-ink: #FFFFFF; --shadow: #E6007E;
  .sev { border-color: #0A6FD6; } .stop { border-bottom-color: #0A6FD6; }
}

/* ═════ 13 · Ruban adhésif ═════ */
body[data-design="ruban"] {
  --bg: #F4F1E9; --ink: #0F1B2A; --muted: #47525F; --acc: #0A6FD6; --on-acc: #FFFFFF; --acc-text: #0A6FD6;
  --fd: "Space Grotesk"; --fb: "Barlow"; --fm: "Barlow"; --fd-w: 700; --tint: var(--ink); --cink: #FFFFFF; --disc-autre-ink: #FFFFFF;
  .sev { background: #FFFFFF; border: 0; border-top: 6px solid #0A6FD6; } .slist { gap: 2.2rem 1.6rem; padding-top: 1rem; }
}

/* ═════ 14 · Hard bop ═════ */
body[data-design="hardbop"] {
  --bg: #F4F1E9; --ink: #0F1B2A; --muted: #47525F; --acc: #0A6FD6; --on-acc: #FFFFFF; --acc-text: #0A6FD6;
  --fd: "Archivo Black"; --fb: "Barlow"; --fm: "Barlow"; --fd-w: 400; --tint: var(--ink); --cink: #FFFFFF; --disc-autre-ink: #FFFFFF;
  .stop__name { font-size: clamp(1rem, 0.7rem + 1.1vw, 1.45rem); line-height: 1.05; }
  .sev { border: 0; background: #0A6FD6; --color-ink: #FFFFFF; --color-text-2: #E3EEFA; --color-text-muted: #E3EEFA; --color-accent-text: #FFFFFF; --acc-text: #FFFFFF; color: #FFFFFF; }
  .sev:nth-child(3n + 2) { background: #0F1B2A; }
  .sev:nth-child(3n) { background: #FFFFFF; --color-ink: #0F1B2A; --color-text-2: #47525F; --color-text-muted: #47525F; --color-accent-text: #0A6FD6; --acc-text: #0A6FD6; color: #0F1B2A; }
  .sev:not(:nth-child(3n)) .schip { background: #FFFFFF; color: #0F1B2A; }
  .sev__title { font-size: 1.375rem; }
}

/* ═════ 15 · Trame de points ═════ */
body[data-design="trame"] {
  --bg: #F6F4EE; --ink: #0B0B0B; --muted: #3F3F3F; --acc: #0A6FD6; --on-acc: #FFFFFF; --acc-text: #0A6FD6;
  --fd: "Oswald"; --fb: "Space Mono"; --fm: "Space Mono"; --fd-w: 700; --tint: var(--ink); --cink: #FFFFFF; --disc-autre-ink: #FFFFFF; --free-bg: #E6007E; --free-ink: #FFFFFF;
  background-image: radial-gradient(#0A6FD633 2.6px, transparent 3px); background-size: 14px 14px;
  .schip--free { background: #E6007E; color: #0B0B0B; }
  .sev__img { flex-basis: 9.5rem; }
}

/* ═════ 16 · Setlist ═════ */
body[data-design="setlist"] {
  --bg: #F4F1E9; --ink: #0B0B0B; --muted: #3F3F3F; --acc: #E6007E; --on-acc: #0B0B0B; --acc-text: #B8005F;
  --fd: "Oswald"; --fb: "Space Mono"; --fm: "Space Mono"; --fd-w: 700; --tint: var(--ink); --cink: #FFFFFF; --disc-autre-ink: #FFFFFF;
  .sev { border-bottom: 4px solid #0B0B0B; }
  .sev__when { font-family: var(--font-display); font-size: 1.75rem; line-height: 1; color: #0B0B0B; }
  .sev__title { font-size: 1.75rem; }
}

/* ═════ 17 · Collage ═════ */
body[data-design="collage"] {
  --bg: #EFEDE6; --ink: #0B0B0B; --muted: #3F3F3F; --acc: #E6007E; --on-acc: #0B0B0B; --acc-text: #B8005F;
  --fd: "Oswald"; --fb: "Space Mono"; --fm: "Space Mono"; --fd-w: 700; --tint: var(--ink); --cink: #FFFFFF; --disc-autre-ink: #FFFFFF; --alt1: #9CCBFF; --alt2: #FFE94A; --stamp: #B8005F;
}

/* ═════ 18 · Rose franc ═════ */
body[data-design="rosefranc"] {
  --bg: #F7F3EE; --ink: #0B0B0B; --muted: #3F3F3F; --acc: #E6007E; --on-acc: #0B0B0B; --acc-text: #B8005F;
  --fd: "Archivo Black"; --fb: "Barlow"; --fm: "Barlow"; --fd-w: 400; --tint: var(--acc); --cink: var(--on-acc); --disc-autre-ink: var(--on-acc);
  .stop__name { font-size: clamp(1rem, 0.7rem + 1.1vw, 1.45rem); line-height: 1.05; }
  .sev__title { font-size: 1.375rem; }
}

/* ═════ 19 · Noir et bleu ═════ */
body[data-design="noirbleu"] {
  --bg: #FAFAF7; --ink: #0B0B0B; --muted: #3F3F3F; --acc: #0A6FD6; --on-acc: #FFFFFF; --acc-text: #0A6FD6;
  --fd: "Space Grotesk"; --fb: "Space Mono"; --fm: "Space Mono"; --fd-w: 700; --tint: var(--ink); --cink: #FFFFFF; --disc-autre-ink: #FFFFFF;
  .sev { border-width: 2px; box-shadow: none; }
  .stop { border-bottom-width: 2px; }
  .stop__brand::before { transform: none; box-shadow: none; color: #FFFFFF; }
  .sday { border-bottom-width: 2px; }
  .sev__img { flex-basis: 9.5rem; }
}

/* ═════ 20 · Tapé à la machine ═════ */
body[data-design="dactylo"] {
  --bg: #EFEDE6; --ink: #0B0B0B; --muted: #3F3F3F; --acc: #0A6FD6; --on-acc: #FFFFFF; --acc-text: #0A6FD6;
  --fd: "Oswald"; --fb: "Courier Prime"; --fm: "Courier Prime"; --fd-w: 700; --tint: var(--ink); --cink: #FFFFFF; --disc-autre-ink: #FFFFFF;
  .sev__title a { text-decoration: underline; text-decoration-color: #0A6FD6; text-decoration-thickness: 3px; text-underline-offset: 4px; }
  .sev { border-bottom: 1px dashed #0B0B0B; }
}

/* ═════ 21 · Rayures ═════ */
body[data-design="rayures"] {
  --bg: #F4F1E9; --ink: #0F1B2A; --muted: #47525F; --acc: #0A6FD6; --on-acc: #FFFFFF; --acc-text: #0A6FD6;
  --fd: "Barlow Condensed"; --fb: "Barlow"; --fm: "Barlow"; --fd-w: 700; --tint: var(--ink); --cink: #FFFFFF; --disc-autre-ink: #FFFFFF; --hatch: #0A6FD6;
  .stop__brand { background: repeating-linear-gradient(135deg, #0A6FD6 0 14px, #085DB5 14px 28px); }
  .sev__title { font-size: 1.75rem; }
  .sev__body { padding-inline: 0; }
}

/* ═════ 22 · Grand format ═════ */
body[data-design="grandformat"] {
  --bg: #F4F1E9; --ink: #0B0B0B; --muted: #3F3F3F; --acc: #0A6FD6; --on-acc: #FFFFFF; --acc-text: #0A6FD6;
  --fd: "Archivo Black"; --fb: "Space Mono"; --fm: "Space Mono"; --fd-w: 400; --tint: var(--acc); --cink: var(--on-acc); --disc-autre-ink: var(--on-acc); --duo2: #E6007E; --stamp: #B8005F; --day-max: 5.5rem;
  .sday { border-bottom-color: #E6007E; }
  .slist { grid-template-columns: repeat(auto-fill, minmax(21rem, 1fr)); }
  .sev__body { padding-inline: 0; }
  @media (max-width: 560px) { .slist { grid-template-columns: 1fr; } }
}