/* Généré par bin/design-defaut à partir de designs.css : ne pas retoucher ici. */
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)); }
}
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; } }
}
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; }
  /* 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; }
  }
}
body[data-design] .stop__brand:has(.stop__logo)::before { display: none; }
body[data-design] .stop__brand .stop__logo { display: block; }
body[data-design] .stop__name { font-size: 0.95rem; }
body[data-design="cbgb"] .sthemes a { border: 2px solid #0B0B0B; text-transform: uppercase; }
body[data-design="cbgb"] .sthemes a:hover { background: #FFE94A; }
body[data-design="cbgb"] .sthemes__title { text-transform: uppercase; letter-spacing: -0.02em; }
body[data-design="cbgb"] .stheme__intro { margin-top: 0.9rem; color: #0B0B0B; }
