/* sexanzeigen-bayern.de — registre « bleu bavarois & blanc cassé, losanges »
   Gabarit sexeannoncesastro, base skin-1 (bento) / compo-2 (hero + inscription côte à côte) / fiche-2 (bandeau photo,
   identité en chips) / dispo frise.
   Palette : accent bleu bavarois #1e5aa8 (favicon) · bleu profond #14294a (pied, bandeaux) · blanc cassé #f7f3ea (fond)
   · sable #ece5d4 (fond 2, bordures #dcd3bf) · surface #fffdf8 · encre #17233a · muet #4f5a6b (7:1 sur blanc cassé).
   Composition : en-tête en bande bleue semée de Rauten (damier de losanges) avec logo en losange, hero aéré sans tuile
   (titre serif + chaîne de losanges), formulaire en carte à coins opposés arrondis et bandeau de losanges, annonces en
   cartes « feuille » (coins 4/22) à liseré sable et zoom doux, étiquette « nouveau » en parallélogramme, thèmes en
   pilules à puce losange, régions en pastilles à puce, arrivées en avatars LOSANGE, magazine en cartes à filet bleu,
   pied bleu profond à Rauten. Fiche : photo en passe-partout, identité en chips sable, créneaux en barres biseautées,
   CTA en carte centrée sur cœur, pop-up et consentement à bandeau de losanges. Les pilules du skin sont remplacées
   partout par le coin 4/22 (feuille) — la forme signature du site avec le losange et le biseau. */

html:not(#_) .skin-1 {
  --sa-accent: #1e5aa8; --sa-accent-txt: #fffdf8;
  --by-prof: #14294a; --by-prof2: #0f1f38; --by-ciel: #e4ecf7; --by-creme: #fffdf8; --by-sable: #ece5d4; --by-sable2: #f1ebdd;
  --sa-fond: #f7f3ea; --sa-fond2: #ece5d4; --sa-surface: #fffdf8;
  --sa-texte: #17233a; --sa-muet: #4f5a6b; --sa-bord: #dcd3bf;
  --sa-secondaire: #14294a; --sa-secondaire-txt: #f7f3ea;
  --sa-pied: #14294a; --sa-pied-txt: #d6deeb; --sa-like: #1e5aa8;
  --sa-rayon: 22px; --sa-rayon-s: 12px;
  --sa-police: "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --sa-police-titre: "Palatino Linotype", Palatino, "Book Antiqua", "Iowan Old Style", Georgia, serif;
  --sa-ombre: 0 1px 2px rgba(30, 90, 168, .06), 0 16px 34px -18px rgba(30, 90, 168, .32);
  --by-rauten: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cpath d='M20 0 40 20 20 40 0 20z' fill='%23fff' fill-opacity='.09'/%3E%3C/svg%3E");
  --by-rauten-bleu: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cpath d='M20 0 40 20 20 40 0 20z' fill='%231e5aa8' fill-opacity='.07'/%3E%3C/svg%3E");
  --by-chaine: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 8'%3E%3Cpath d='M8 0 16 4 8 8 0 4z' fill='%231e5aa8'/%3E%3C/svg%3E");
  --by-coeur: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21s-8-5.3-8-11a4.5 4.5 0 0 1 8-2.8A4.5 4.5 0 0 1 20 10c0 5.7-8 11-8 11z' fill='%231e5aa8' fill-opacity='.08'/%3E%3C/svg%3E");
}
html:not(#_) body.skin-1 { background-color: #f7f3ea; background-image: linear-gradient(180deg, #eef2f8 0, #f7f3ea 34rem); background-repeat: no-repeat; }
html:not(#_) .skin-1 h1, html:not(#_) .skin-1 h2, html:not(#_) .skin-1 h3, html:not(#_) .skin-1 .sa-h1, html:not(#_) .skin-1 .sa-h2, html:not(#_) .skin-1 .sa-hero__h1, html:not(#_) .skin-1 .sa-fiche__titre, html:not(#_) .skin-1 .sa-tags__h, html:not(#_) .skin-1 .sa-side__h, html:not(#_) .skin-1 .sa-membres__h, html:not(#_) .skin-1 .sa-inscrire__h, html:not(#_) .skin-1 .sa-blog__titre, html:not(#_) .skin-1 .sa-carte__titre, html:not(#_) .skin-1 .sa-hero__form-h, html:not(#_) .skin-1 .sa-similaires__h, html:not(#_) .skin-1 .sa-popup__titre, html:not(#_) .skin-1 .sa-consent__titre { font-family: var(--sa-police-titre); font-weight: 700; letter-spacing: -.005em; }
html:not(#_) .skin-1 .sa-h1::after, html:not(#_) .skin-1 .sa-regions .sa-h2::after, html:not(#_) .skin-1 .sa-blog .sa-h2::after, html:not(#_) .skin-1 .sa-membres__h::after { content: ""; display: block; width: 64px; height: 8px; background: var(--by-chaine) 0 0 / 16px 8px repeat-x; margin-top: .5rem; }
html:not(#_) .skin-1 .sa-intro { color: var(--sa-muet); }

/* ---------- carte « feuille » : coins opposés arrondis, liseré sable, ombre bleutée ---------- */
html:not(#_) .skin-1 .sa-tags, html:not(#_) .skin-1 .sa-side, html:not(#_) .skin-1 .sa-blog__item, html:not(#_) .skin-1 .sa-similaires, html:not(#_) .skin-1 .sa-fiche, html:not(#_) .skin-1 .sa-recherche, html:not(#_) .skin-1 .sa-hero__form, html:not(#_) .skin-1 .sa-depot__bloc, html:not(#_) .skin-1 .sa-vide { background: var(--by-creme); border: 1px solid var(--sa-bord); border-radius: 4px 22px 4px 22px; box-shadow: var(--sa-ombre); }

/* ---------- en-tête : bande bleue à Rauten, logo en losange, nav claire ---------- */
html:not(#_) .skin-1 .sa-header { background: var(--sa-accent) var(--by-rauten) 0 0 / 40px 40px; color: #fffdf8; border: 0; padding: 0; box-shadow: 0 6px 22px -12px rgba(20, 41, 74, .6); }
html:not(#_) .skin-1 .sa-header::after { content: ""; display: block; height: 4px; background: linear-gradient(90deg, #fffdf8 0, #fffdf8 33%, #e4ecf7 33%, #e4ecf7 66%, #fffdf8 66%); opacity: .9; }
html:not(#_) .skin-1 .sa-header__in { background: transparent; backdrop-filter: none; border: 0; border-radius: 0; box-shadow: none; max-width: var(--sa-max); padding: .55rem var(--sa-gout); min-height: 66px; }
html:not(#_) .skin-1 .sa-logo { color: #fffdf8; font-size: 1.32rem; gap: .7rem; }
html:not(#_) .skin-1 .sa-logo__mark { width: 40px; height: 40px; border-radius: 0; clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); background: #fffdf8; color: var(--sa-accent); font-size: .95rem; font-family: var(--sa-police-titre); }
html:not(#_) .skin-1 .sa-burger { color: #fffdf8; }
html:not(#_) .skin-1 .sa-nav li a { color: #fffdf8; border-top-color: rgba(255, 253, 248, .22); font-weight: 600; }
html:not(#_) .skin-1 .sa-nav li a:hover, html:not(#_) .skin-1 .sa-nav li a.is-actif { color: #fffdf8; background: rgba(255, 253, 248, .16); text-decoration: none; }
@media (min-width: 900px) { html:not(#_) .skin-1 .sa-nav li a { border-radius: 4px 12px 4px 12px; padding: .42rem .42rem; font-size: .84rem; } html:not(#_) .skin-1 .sa-nav ul { flex: 0 0 auto; gap: 0; } html:not(#_) .skin-1 .sa-header__actions { gap: .4rem; } html:not(#_) .skin-1 .sa-header__actions .sa-btn { font-size: .84rem; padding: .45em .8em; min-height: 40px; } html:not(#_) .skin-1 .sa-nav { gap: .5rem; } }
@media (min-width: 1180px) { html:not(#_) .skin-1 .sa-nav li a { padding: .45rem .55rem; font-size: .88rem; } html:not(#_) .skin-1 .sa-header__actions .sa-btn { font-size: .88rem; } }
html:not(#_) .skin-1 .sa-header .sa-btn--ghost { color: #fffdf8; border-color: rgba(255, 253, 248, .6); background: transparent; }
html:not(#_) .skin-1 .sa-header .sa-btn--ghost:hover { background: rgba(255, 253, 248, .14); border-color: #fffdf8; color: #fffdf8; }
html:not(#_) .skin-1 .sa-header .sa-btn--accent { background: #fffdf8; color: var(--sa-accent); border-color: #fffdf8; box-shadow: 0 8px 18px -10px rgba(15, 31, 56, .8); }
html:not(#_) .skin-1 .sa-header .sa-btn--accent:hover { background: #fff; box-shadow: 0 0 0 3px rgba(255, 253, 248, .3); }

/* ---------- boutons : bleu profond → bleu, coin feuille, ombre colorée ---------- */
html:not(#_) .skin-1 .sa-btn { border-radius: 6px 14px 6px 14px; font-family: var(--sa-police); }
html:not(#_) .skin-1 .sa-btn--accent { background: linear-gradient(180deg, #2a6cc0, var(--sa-accent) 60%, #1a4f95); border-color: transparent; color: #fffdf8; box-shadow: 0 10px 22px -10px rgba(30, 90, 168, .75); }
html:not(#_) .skin-1 .sa-btn--accent:hover { box-shadow: 0 0 0 3px rgba(30, 90, 168, .22), 0 12px 24px -10px rgba(30, 90, 168, .8); }
html:not(#_) .skin-1 .sa-btn--carte { background: var(--by-ciel); color: var(--sa-accent); }
html:not(#_) .skin-1 .sa-btn--carte:hover { background: #d3e0f3; }
html:not(#_) .skin-1 .sa-btn--ghost { color: var(--sa-texte); border-color: color-mix(in srgb, var(--sa-accent) 45%, var(--sa-bord)); }
html:not(#_) .skin-1 .sa-btn--like { border-radius: 4px 12px 4px 12px; color: var(--sa-accent); border-color: color-mix(in srgb, var(--sa-accent) 45%, transparent); background: var(--by-creme); }
html:not(#_) .skin-1 .sa-btn--like:disabled { background: var(--by-ciel); }
html:not(#_) .skin-1 .sa-badge { background: var(--by-ciel); color: var(--by-prof); }
html:not(#_) .skin-1 .sa-badge--ok { background: #e2efe6; color: #24633e; }

/* ---------- hero (compo 2) : texte aéré, étapes en losanges, formulaire en carte à bandeau ---------- */
html:not(#_) .skin-1 .sa-hero { padding: clamp(1.6rem, 4vw, 3.2rem) 0 1.8rem; background: linear-gradient(180deg, rgba(247, 243, 234, 0) 0, rgba(247, 243, 234, .55) 55%, #f7f3ea 100%), var(--by-rauten-bleu) 0 0 / 40px 40px; position: relative; }
html:not(#_) .skin-1 .sa-hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: linear-gradient(90deg, transparent, var(--sa-bord), transparent); }
html:not(#_) .skin-1 .sa-hero__txt { background: none; border-radius: 0; padding: 0; box-shadow: none; }
html:not(#_) .skin-1 .sa-hero__h1 { font-size: clamp(2rem, 1.3rem + 3vw, 3.4rem); line-height: 1.08; color: var(--by-prof); }
html:not(#_) .skin-1 .sa-hero__h1::after { content: ""; display: block; width: 96px; height: 8px; background: var(--by-chaine) 0 0 / 16px 8px repeat-x; margin-top: .7rem; }
html:not(#_) .skin-1 .sa-hero__sous { color: var(--sa-muet); font-size: 1.12rem; }
html:not(#_) .skin-1 .sa-hero__etapes li::before { border: 0; border-radius: 0; clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); width: 2.1em; height: 2.1em; background: var(--sa-accent); color: #fffdf8; font-size: .85rem; }
html:not(#_) .skin-1 .sa-hero__form { position: relative; overflow: hidden; padding: 1.7rem 1.4rem 1.4rem; border-color: color-mix(in srgb, var(--sa-accent) 30%, var(--sa-bord)); }
html:not(#_) .skin-1 .sa-hero__form::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 12px; background: var(--sa-accent) var(--by-rauten) 0 -14px / 24px 24px; }
html:not(#_) .skin-1 .sa-hero__form-h { font-size: 1.35rem; color: var(--by-prof); }
html:not(#_) .skin-1 .sa-hero__form-p { color: var(--sa-muet); }

/* ---------- annonces : cartes feuille, photo en zoom doux, étiquette en parallélogramme ---------- */
html:not(#_) .skin-1 .sa-dernieres { padding-top: 1.6rem; }
html:not(#_) .skin-1 .sa-grille { gap: 1rem; }
html:not(#_) .skin-1 .sa-carte { background: var(--by-creme); border: 1px solid var(--sa-bord); border-radius: 4px 22px 4px 22px; box-shadow: var(--sa-ombre); transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
html:not(#_) .skin-1 .sa-carte:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--sa-accent) 40%, var(--sa-bord)); box-shadow: 0 2px 4px rgba(30, 90, 168, .08), 0 24px 40px -18px rgba(30, 90, 168, .45); }
html:not(#_) .skin-1 .sa-carte__img { background: var(--by-sable); }
html:not(#_) .skin-1 .sa-carte__img img { transition: transform .6s ease; }
html:not(#_) .skin-1 .sa-carte:hover .sa-carte__img img { transform: scale(1.05); }
html:not(#_) .skin-1 .sa-carte__new { top: .7rem; left: 0; border-radius: 0; clip-path: polygon(0 0, 100% 0, calc(100% - 9px) 100%, 0 100%); padding: .28rem 1rem .28rem .8rem; background: #fffdf8; color: var(--sa-accent); box-shadow: 0 4px 10px -4px rgba(15, 31, 56, .5); }
html:not(#_) .skin-1 .sa-carte__corps { padding: .9rem 1rem 1rem; }
html:not(#_) .skin-1 .sa-carte__qui { color: var(--sa-muet); }
html:not(#_) .skin-1 .sa-carte__pseudo { color: var(--sa-accent); }
html:not(#_) .skin-1 .sa-carte__titre { font-size: 1.05rem; line-height: 1.25; }
html:not(#_) .skin-1 .sa-carte__titre a { color: var(--by-prof); }
html:not(#_) .skin-1 .sa-carte__titre a:hover { color: var(--sa-accent); text-decoration: none; }
html:not(#_) .skin-1 .sa-carte__ville strong, html:not(#_) .skin-1 .sa-carte__extrait strong { color: var(--sa-accent); }
html:not(#_) .skin-1 .sa-carte__pied { border-top: 1px dashed var(--sa-bord); padding-top: .6rem; }
html:not(#_) .skin-1 .sa-carte__metas .sa-ico { color: var(--sa-accent); }
html:not(#_) .skin-1 .sa-dernieres__plus > span { color: var(--sa-muet); font-family: var(--sa-police-titre); font-style: italic; }
@media (min-width: 720px) { html:not(#_) .skin-1 .sa-grille > .sa-carte:nth-child(7n+1) .sa-carte__img, html:not(#_) .skin-1 .sa-grille > .sa-carte:nth-child(7n+5) .sa-carte__img { border-radius: 0 0 22px 0; } }

/* ---------- thèmes : pilules crème à puce losange ---------- */
html:not(#_) .skin-1 .sa-tags { padding: 1.2rem 1.3rem 1.3rem; }
html:not(#_) .skin-1 .sa-tags__h { color: var(--by-prof); }
html:not(#_) .skin-1 .sa-tags__liste a { background: var(--by-sable2); border-color: var(--sa-bord); color: var(--sa-texte); border-radius: 4px 12px 4px 12px; padding: .38rem .75rem .38rem .65rem; }
html:not(#_) .skin-1 .sa-tags__liste a::before { content: ""; width: .5em; height: .5em; background: var(--sa-accent); clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); flex: none; }
html:not(#_) .skin-1 .sa-tags__liste a:hover, html:not(#_) .skin-1 .sa-tags__liste li.is-actif a { background: var(--by-ciel); border-color: var(--sa-accent); color: var(--by-prof); }
html:not(#_) .skin-1 .sa-tags--nuage .sa-tags__liste a::before { display: none; }
html:not(#_) .skin-1 .sa-chip { background: var(--by-sable2); border: 1px solid var(--sa-bord); border-radius: 4px 12px 4px 12px; color: var(--sa-texte) !important; }
html:not(#_) .skin-1 a.sa-chip:hover { border-color: var(--sa-accent); background: var(--by-ciel); }
html:not(#_) .skin-1 label.sa-chip:has(input:checked) { background: var(--sa-accent); border-color: var(--sa-accent); color: #fffdf8 !important; }

/* ---------- régions : pastilles feuille à puce losange ---------- */
html:not(#_) .skin-1 .sa-pastille { border-radius: 4px 14px 4px 14px; border: 1px solid var(--sa-bord); background: var(--by-creme); box-shadow: 0 6px 16px -12px rgba(30, 90, 168, .4); padding-left: .7rem; }
html:not(#_) .skin-1 .sa-pastille::before { content: ""; width: .55em; height: .55em; background: var(--sa-accent); clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); flex: none; margin-right: .1rem; }
html:not(#_) .skin-1 .sa-pastille:hover { border-color: var(--sa-accent); background: var(--by-ciel); }
html:not(#_) .skin-1 .sa-regions__intro { color: var(--sa-muet); }

/* ---------- nouvelles arrivées : avatars en losange ---------- */
html:not(#_) .skin-1 .sa-membres { padding: 1.8rem 0 1.4rem; }
html:not(#_) .skin-1 .sa-membres__avatar { border-radius: 0; border: 0; box-shadow: none; clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); background: var(--sa-accent); padding: 3px; transition: transform .3s ease; }
html:not(#_) .skin-1 .sa-membres__avatar img { clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); }
html:not(#_) .skin-1 .sa-membres__liste li:hover .sa-membres__avatar { transform: scale(1.06); }
html:not(#_) .skin-1 .sa-membres__nom a { color: var(--by-prof); }

/* ---------- magazine : cartes feuille à filet bleu, date en étiquette ---------- */
html:not(#_) .skin-1 .sa-blog__item { border-top: 4px solid var(--sa-accent); border-radius: 4px 22px 4px 22px; padding: 1.2rem 1.3rem 1.3rem; }
html:not(#_) .skin-1 .sa-blog__titre a { color: var(--by-prof); }
html:not(#_) .skin-1 .sa-blog__date { display: inline-block; background: var(--by-ciel); color: var(--by-prof); font-weight: 700; font-size: .78rem; padding: .15rem .6rem; border-radius: 4px 10px 4px 10px; }
html:not(#_) .skin-1 .sa-blog__intro { color: var(--sa-muet); }

/* ---------- inscription en bandeau : bleu profond à Rauten, formulaire crème ---------- */
html:not(#_) .skin-1 .sa-inscrire { background: var(--by-prof) var(--by-rauten) 0 0 / 40px 40px; color: #e8edf5; border-radius: 4px 26px 4px 26px; margin: 1.2rem var(--sa-gout) 0; padding: 2rem 0 2.2rem; box-shadow: 0 24px 40px -24px rgba(15, 31, 56, .7); }
@media (min-width: 1240px) { html:not(#_) .skin-1 .sa-inscrire { max-width: var(--sa-max); margin-inline: auto; } }
html:not(#_) .skin-1 .sa-inscrire__h { color: #fffdf8; font-size: clamp(1.4rem, 1.1rem + 1.4vw, 2rem); }
html:not(#_) .skin-1 .sa-inscrire p { color: #dbe3f0; }
html:not(#_) .skin-1 .sa-inscrire .sa-form { background: var(--by-creme); color: var(--sa-texte); padding: 1.2rem 1.2rem 1.3rem; border-radius: 4px 22px 4px 22px; box-shadow: 0 0 0 5px rgba(255, 253, 248, .12), 0 20px 36px -20px rgba(0, 0, 0, .7); }
html:not(#_) .skin-1 .sa-inscrire .sa-form__lbl, html:not(#_) .skin-1 .sa-inscrire .sa-form__check { color: var(--sa-texte); }
html:not(#_) .skin-1 .sa-inscrire .sa-form__check a { color: var(--sa-accent); }
html:not(#_) .skin-1 .sa-inscrire .sa-form__lbl small { color: var(--sa-muet); }

/* ---------- pied de page : bleu profond à Rauten, colonnes sans tuile ---------- */
html:not(#_) .skin-1 .sa-footer { margin-top: 2rem; }
html:not(#_) .skin-1 .sa-liens { background: var(--by-prof) var(--by-rauten) 0 0 / 40px 40px; color: var(--sa-pied-txt); padding: 2.4rem 0 1.8rem; border-top: 4px solid var(--sa-accent); }
html:not(#_) .skin-1 .sa-liens__col { background: transparent; border-radius: 0; padding: 0; box-shadow: none; }
html:not(#_) .skin-1 .sa-liens__col + .sa-liens__col { border-left: 1px solid rgba(255, 253, 248, .12); padding-left: 1.2rem; }
@media (max-width: 767px) { html:not(#_) .skin-1 .sa-liens__col + .sa-liens__col { border-left: 0; padding-left: 0; } }
html:not(#_) .skin-1 .sa-liens__marque { color: #fffdf8; font-size: 1.5rem; padding-left: 1.1rem; position: relative; }
html:not(#_) .skin-1 .sa-liens__marque::before { content: ""; position: absolute; left: 0; top: .55em; width: .55em; height: .55em; background: #fffdf8; clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); }
html:not(#_) .skin-1 .sa-liens__h { color: #fffdf8; letter-spacing: .08em; }
html:not(#_) .skin-1 .sa-liens__h::after { content: ""; display: block; width: 32px; height: 3px; background: var(--sa-accent); margin-top: .35rem; }
html:not(#_) .skin-1 .sa-liens p { color: var(--sa-pied-txt); }
html:not(#_) .skin-1 .sa-liens a { color: #e8edf5; }
html:not(#_) .skin-1 .sa-liens a:hover { color: #fffdf8; }
html:not(#_) .skin-1 .sa-liens .sa-btn--ghost { color: #fffdf8; border-color: rgba(255, 253, 248, .45); background: transparent; }
html:not(#_) .skin-1 .sa-liens .sa-btn--ghost:hover { background: rgba(255, 253, 248, .12); border-color: #fffdf8; }
html:not(#_) .skin-1 .sa-footer__tail { background: var(--by-prof2); color: #b8c3d6; border-top: 1px solid rgba(255, 253, 248, .12); }
html:not(#_) .skin-1 .sa-footer__legal a, html:not(#_) .skin-1 .sa-footer__haut a { color: #e8edf5; }
html:not(#_) .skin-1 .sa-footer__important { color: #fffdf8; }

/* ---------- barre basse mobile (position intouchée) ---------- */
html:not(#_) .skin-1 .sa-barre-mobile { background: var(--sa-accent) var(--by-rauten) 0 0 / 40px 40px; color: #fffdf8; border-top: 2px solid #fffdf8; box-shadow: 0 -6px 18px rgba(15, 31, 56, .35); font-family: var(--sa-police-titre); font-size: 1.05rem; letter-spacing: .01em; }

/* ---------- listes : barre latérale, fil d'Ariane, pagination ---------- */
html:not(#_) .skin-1 .sa-side__h { color: var(--by-prof); padding-left: 1rem; position: relative; }
html:not(#_) .skin-1 .sa-side__h::before { content: ""; position: absolute; left: 0; top: .5em; width: .5em; height: .5em; background: var(--sa-accent); clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); }
html:not(#_) .skin-1 .sa-side__liste li { border-top-color: var(--by-sable); }
html:not(#_) .skin-1 .sa-side__liste a { color: var(--sa-texte); }
html:not(#_) .skin-1 .sa-crumbs li + li::before { content: "◆"; color: var(--sa-accent); font-size: .55em; margin: 0 .45rem 0 .1rem; }
html:not(#_) .skin-1 .sa-crumbs a { color: var(--sa-muet); }
html:not(#_) .skin-1 .sa-pagination li a, html:not(#_) .skin-1 .sa-pagination li span { border-radius: 4px 12px 4px 12px; background: var(--by-creme); border-color: var(--sa-bord); }
html:not(#_) .skin-1 .sa-pagination li.is-actif span { background: var(--sa-accent); border-color: var(--sa-accent); color: #fffdf8; }

/* ---------- fiche : photo en passe-partout, identité en chips sable, frise biseautée, CTA en carte sur cœur ---------- */
html:not(#_) .skin-1 .sa-fiche { padding: 1.4rem; border-radius: 4px 26px 4px 26px; }
html:not(#_) .skin-1 .sa-fiche__photo { border-radius: 4px 18px 4px 18px; padding: 6px; background: #fff; border: 1px solid var(--sa-bord); box-shadow: 0 0 0 4px var(--by-sable2), var(--sa-ombre); }
html:not(#_) .skin-1 .sa-fiche__photo img { border-radius: 2px 14px 2px 14px; transition: transform .6s ease; }
html:not(#_) .skin-1 .sa-fiche__photo:hover img { transform: scale(1.03); }
html:not(#_) .skin-1 .sa-fiche__sur { color: var(--sa-accent); font-weight: 700; text-transform: uppercase; letter-spacing: .06em; font-size: .78rem; }
html:not(#_) .skin-1 .sa-fiche__titre { color: var(--by-prof); font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.2rem); line-height: 1.12; }
html:not(#_) .skin-1 .sa-fiche--2 .sa-fiche__id > div { background: var(--by-sable2); border-color: var(--sa-bord); border-radius: 4px 14px 4px 14px; padding: .45rem .8rem; max-width: 100%; }
html:not(#_) .skin-1 .sa-fiche--2 .sa-fiche__id > div.sa-fiche__id-like { flex: 1 1 100%; }
html:not(#_) .skin-1 .sa-fiche--2 .sa-fiche__id > div.sa-fiche__id-like dd { flex: 1; justify-content: space-between; }
html:not(#_) .skin-1 .sa-fiche--2 .sa-fiche__id dt::after { content: none; }
html:not(#_) .skin-1 .sa-fiche__id dt { color: var(--sa-accent); font-size: .76rem; text-transform: uppercase; letter-spacing: .04em; white-space: nowrap; }
html:not(#_) .skin-1 .sa-fiche--2 .sa-fiche__id dt { padding-right: .5rem; border-right: 1px solid var(--sa-bord); margin-right: .1rem; }
html:not(#_) .skin-1 .sa-fiche--2 .sa-fiche__photo img { aspect-ratio: 1 / 1; object-position: center 30%; }
html:not(#_) .skin-1 .sa-fiche__id dd .sa-ico { color: var(--sa-accent); }
html:not(#_) .skin-1 .sa-fiche__id dd a { color: var(--sa-accent); font-weight: 700; }
html:not(#_) .skin-1 .sa-dispo { background: var(--by-sable2); border: 1px solid var(--sa-bord); border-radius: 4px 18px 4px 18px; padding: 1rem 1.1rem 1.1rem; }
html:not(#_) .skin-1 .sa-dispo__h { color: var(--by-prof); }
html:not(#_) .skin-1 .sa-dispo__nom { color: var(--sa-texte); }
html:not(#_) .skin-1 .sa-dispo__jour.is-aujourdhui .sa-dispo__nom { color: var(--sa-accent); }
html:not(#_) .skin-1 .sa-dispo--frise .sa-dispo__jour { display: flex; flex-direction: column; justify-content: flex-end; }
html:not(#_) .skin-1 .sa-dispo--frise .sa-dispo__creneaux li { background: var(--sa-bord); border-radius: 0; clip-path: polygon(5px 0, 100% 0, calc(100% - 5px) 100%, 0 100%); height: 13px; }
html:not(#_) .skin-1 .sa-dispo--frise .sa-dispo__creneaux li.is-on { background: var(--sa-accent); }
@media (max-width: 639px) {
  html:not(#_) .skin-1 .sa-fiche--2 .sa-fiche__id > div.sa-fiche__id-like { display: grid; grid-template-columns: 1fr; gap: .4rem; }
  html:not(#_) .skin-1 .sa-fiche--2 .sa-fiche__id > div.sa-fiche__id-like dt { border-right: 0; padding-right: 0; }
  html:not(#_) .skin-1 .sa-fiche--2 .sa-fiche__id > div.sa-fiche__id-like dd { display: grid; grid-template-columns: 1fr; gap: .5rem; }
  html:not(#_) .skin-1 .sa-fiche--2 .sa-fiche__id > div.sa-fiche__id-like .sa-btn--like { width: 100%; min-height: 44px; }
  html:not(#_) .skin-1 .sa-dispo--frise .sa-dispo__nom { font-size: .7rem; overflow-wrap: normal; line-height: 1.15; letter-spacing: -.01em; }
}
html:not(#_) .skin-1 .sa-dispo--chips .sa-dispo__jour { background: var(--by-creme); border-radius: 4px 14px 4px 14px; }
html:not(#_) .skin-1 .sa-fiche__texte h2, html:not(#_) .skin-1 .sa-fiche__tags h3 { color: var(--by-prof); }
html:not(#_) .skin-1 .sa-fiche__texte h2 .sa-ico, html:not(#_) .skin-1 .sa-fiche__tags h3 .sa-ico, html:not(#_) .skin-1 .sa-dispo__h .sa-ico, html:not(#_) .skin-1 .sa-h2 .sa-ico, html:not(#_) .skin-1 .sa-tags__h .sa-ico { color: var(--sa-accent); }
html:not(#_) .skin-1 .sa-fiche__texte p { font-size: 1.04rem; line-height: 1.65; }
html:not(#_) .skin-1 .sa-cta { position: relative; overflow: hidden; background: var(--by-creme); border: 1px solid color-mix(in srgb, var(--sa-accent) 35%, var(--sa-bord)); border-top: 4px solid var(--sa-accent); border-radius: 4px 26px 4px 26px; padding: 1.8rem 1.6rem 1.7rem; max-width: 540px; width: 100%; margin: .8rem auto; box-shadow: var(--sa-ombre); }
html:not(#_) .skin-1 .sa-cta::before { content: ""; position: absolute; right: -28px; top: -22px; width: 150px; height: 150px; background: var(--by-coeur) center / contain no-repeat; transform: rotate(-12deg); pointer-events: none; }
html:not(#_) .skin-1 .sa-cta::after { content: ""; position: absolute; left: -30px; bottom: -34px; width: 110px; height: 110px; background: var(--by-coeur) center / contain no-repeat; transform: rotate(14deg); pointer-events: none; }
html:not(#_) .skin-1 .sa-cta > * { position: relative; z-index: 1; }
html:not(#_) .skin-1 .sa-cta__q { color: var(--by-prof); font-family: var(--sa-police-titre); font-size: 1.35rem; }
html:not(#_) .skin-1 .sa-cta__fleche { color: var(--sa-muet); font-family: var(--sa-police); }
html:not(#_) .skin-1 .sa-cta .sa-btn { width: 100%; min-height: 52px; font-size: 1.05rem; }
html:not(#_) .skin-1 .sa-cta__aide { color: var(--sa-muet); }
html:not(#_) .skin-1 .sa-commentaires { border-top: 1px solid var(--sa-bord); }
html:not(#_) .skin-1 .sa-commentaires__aucun, html:not(#_) .skin-1 .sa-commentaires__note { color: var(--sa-muet); }
html:not(#_) .skin-1 .sa-commentaires__note { background: var(--by-sable2); border-radius: 4px 12px 4px 12px; }
html:not(#_) .skin-1 .sa-commentaire { border-bottom-color: var(--sa-bord); }
html:not(#_) .skin-1 .sa-similaires__img { border-radius: 4px 12px 4px 12px; background: var(--by-sable); }
html:not(#_) .skin-1 .sa-similaires__titre a { color: var(--by-prof); }
html:not(#_) .skin-1 .sa-similaires__meta, html:not(#_) .skin-1 .sa-similaires__intro { color: var(--sa-muet); }
@media (max-width: 767px) { html:not(#_) .skin-1 .sa-fiche__barre { background: var(--by-creme); border-top: 2px solid var(--sa-accent); box-shadow: 0 -6px 18px rgba(15, 31, 56, .18); } }

/* ---------- formulaires : champs crème à coin feuille, dépôt en blocs ---------- */
html:not(#_) .skin-1 .sa-form input[type="text"], html:not(#_) .skin-1 .sa-form input[type="email"], html:not(#_) .skin-1 .sa-form input[type="tel"], html:not(#_) .skin-1 .sa-form input[type="number"], html:not(#_) .skin-1 .sa-form input[type="search"], html:not(#_) .skin-1 .sa-form select, html:not(#_) .skin-1 .sa-form textarea { background: #fff; border-color: var(--sa-bord); border-radius: 4px 12px 4px 12px; color: var(--sa-texte); }
html:not(#_) .skin-1 .sa-form input:focus, html:not(#_) .skin-1 .sa-form select:focus, html:not(#_) .skin-1 .sa-form textarea:focus { outline-color: var(--sa-accent); border-color: var(--sa-accent); }
html:not(#_) .skin-1 .sa-form__lbl { color: var(--by-prof); }
html:not(#_) .skin-1 .sa-form__aide, html:not(#_) .skin-1 .sa-form__lbl small { color: var(--sa-muet); }
html:not(#_) .skin-1 .sa-depot__bloc { padding: 1.1rem 1.2rem 1.3rem; }
html:not(#_) .skin-1 .sa-depot__bloc legend { color: var(--sa-accent); font-family: var(--sa-police-titre); font-size: 1.15rem; padding: 0 .5rem; display: inline-flex; align-items: center; gap: .45rem; }
html:not(#_) .skin-1 .sa-depot__bloc legend::before { content: ""; width: .5em; height: .5em; background: var(--sa-accent); clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); flex: none; }
html:not(#_) .skin-1 .sa-depot__dispo th, html:not(#_) .skin-1 .sa-depot__dispo td { border-color: var(--sa-bord); }
html:not(#_) .skin-1 .sa-depot__dispo thead th { background: var(--by-ciel); color: var(--by-prof); }
html:not(#_) .skin-1 .sa-depot__dispo tbody th { background: var(--by-sable2); }
html:not(#_) .skin-1 .sa-depot__apercu img { border-radius: 4px 12px 4px 12px; }
html:not(#_) .skin-1 .sa-regles { color: var(--sa-texte); }
html:not(#_) .skin-1 .sa-recherche { padding: 1.1rem 1.2rem 1.2rem; }

/* ---------- pop-up d'inscription et consentement : boîte crème à bandeau de losanges ---------- */
html:not(#_) .skin-1 .sa-consent__box, html:not(#_) .skin-1 .sa-popup__box { border-radius: 4px 26px 4px 26px; background: var(--by-creme); border: 1px solid var(--sa-bord); padding-top: 2.6rem; }
html:not(#_) .skin-1 .sa-consent__box::before, html:not(#_) .skin-1 .sa-popup__box::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 12px; background: var(--sa-accent) var(--by-rauten) 0 -14px / 24px 24px; }
html:not(#_) .skin-1 .sa-popup__croix { top: 1rem; background: var(--by-sable2); color: var(--sa-texte); }
html:not(#_) .skin-1 .sa-popup__croix:hover, html:not(#_) .skin-1 .sa-popup__croix:focus-visible { background: var(--sa-accent); color: #fffdf8; }
html:not(#_) .skin-1 .sa-popup__titre, html:not(#_) .skin-1 .sa-consent__titre { color: var(--by-prof); }
html:not(#_) .skin-1 .sa-popup__titre span:last-child { color: var(--sa-accent); font-size: .78em; font-family: var(--sa-police); font-weight: 600; margin-top: .25rem; }
html:not(#_) .skin-1 .sa-popup__texte, html:not(#_) .skin-1 .sa-consent__texte { color: var(--sa-texte); }
html:not(#_) .skin-1 .sa-popup__refus a, html:not(#_) .skin-1 .sa-consent__quitter { color: var(--sa-muet); }
html:not(#_) .skin-1 .sa-spin { border-color: var(--by-sable); border-top-color: var(--sa-accent); }

@media (prefers-reduced-motion: reduce) {
  html:not(#_) .skin-1 .sa-carte, html:not(#_) .skin-1 .sa-carte__img img, html:not(#_) .skin-1 .sa-fiche__photo img, html:not(#_) .skin-1 .sa-membres__avatar { transition: none; }
  html:not(#_) .skin-1 .sa-carte:hover { transform: none; }
  html:not(#_) .skin-1 .sa-carte:hover .sa-carte__img img, html:not(#_) .skin-1 .sa-fiche__photo:hover img, html:not(#_) .skin-1 .sa-membres__liste li:hover .sa-membres__avatar { transform: none; }
}