/* public/css/saisons.css — faces de carte des saisons du passe (docs/CALENDRIER-ANNUEL.md § 5).
   Feuille à part, chargée aussi depuis rami51.com par l'app mobile (1.5.0+) : une face
   ajoutée ici arrive sur mobile sans mise à jour. Même structure que les faces du passe
   à vie (.face-pass-*) de style.css : fond, filet intérieur en ::before, couleurs des
   enseignes. Les teintes d'une face sont posées une fois en variables. */

:root {
  /* Palettes des faces de saison : les seules couleurs brutes de ce fichier (charte, règle 1). */
  --givre-paper-1: #fbfdff;
  --givre-paper-2: #edf4fb;
  --givre-paper-3: #dce9f5;
  --givre-silver: rgba(132, 162, 194, .78);
  --givre-frost: rgba(255, 255, 255, .95);
  --givre-red: #a3203a;
  --givre-black: #1d3557;
  --faience-paper-1: #fffdf6;
  --faience-paper-2: #f6f0e1;
  --faience-blue: #2a5ea8;
  --faience-blue-soft: #6f95cf;
  --faience-red: #c0452b;
  --faience-black: #1f3b6b;
  --deco-paper-1: #fffaf0;
  --deco-paper-2: #f3ead6;
  --deco-gold: rgba(184, 141, 58, .85);
  --deco-sea: rgba(28, 120, 140, .14);
  --deco-red: #b3262f;
  --deco-black: #12343d;
  --salon-paper-1: #fffaf2;
  --salon-paper-2: #f4e7d6;
  --salon-wine: #7a1f2b;
  --salon-gold: rgba(201, 158, 74, .9);
  --salon-red: #a01c2c;
  --salon-black: #2a1a14;
}

/* Saison Chalet (janvier-mars) : Givre — papier glacé blanc-bleu, givre aux coins, filet d'argent. */
.card.face-chalet-givre, .swatch-preview.face-chalet-givre {
  background:
    radial-gradient(circle at 0 0, var(--givre-frost) 0 calc(var(--cw) * .10), transparent calc(var(--cw) * .32)),
    radial-gradient(circle at 100% 100%, var(--givre-frost) 0 calc(var(--cw) * .10), transparent calc(var(--cw) * .32)),
    repeating-linear-gradient(60deg, rgba(160, 190, 220, .10) 0 1px, transparent 1px calc(var(--cw) * .09)),
    repeating-linear-gradient(-60deg, rgba(160, 190, 220, .10) 0 1px, transparent 1px calc(var(--cw) * .09)),
    linear-gradient(160deg, var(--givre-paper-1) 0%, var(--givre-paper-2) 55%, var(--givre-paper-3) 100%);
  box-shadow: 0 2px 6px rgba(0, 0, 0, .45), inset 0 0 0 max(1px, calc(var(--cw) * .018)) var(--givre-silver);
  font-family: Georgia, serif;
  font-weight: 800;
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.card.face-chalet-givre::before, .swatch-preview.face-chalet-givre::before {
  content: ""; position: absolute; inset: max(2px, calc(var(--cw) * .045));
  border: max(1px, calc(var(--cw) * .012)) solid var(--givre-silver);
  border-radius: max(3px, calc(var(--cw) * .07));
  box-shadow: inset 0 0 0 max(1px, calc(var(--cw) * .02)) rgba(255, 255, 255, .7);
  pointer-events: none; z-index: 0;
}
.card.face-chalet-givre .corner, .card.face-chalet-givre .pip { z-index: 1; }
.card.face-chalet-givre.red, .swatch-preview.face-chalet-givre.mini-card-face.red { color: var(--givre-red); }
.card.face-chalet-givre.black, .swatch-preview.face-chalet-givre.mini-card-face.black { color: var(--givre-black); }
.card.face-chalet-givre.joker .joker-svg, .card.face-chalet-givre.joker .joker-label { color: var(--givre-silver); }

/* Saison Orangerie (avril-juin) : Faïence — émail crème, double filet bleu, et deux carreaux d'azulejo
   (fleur blanche à quatre pétales sur fond bleu) en haut à droite et en bas à gauche, loin des index. */
.card.face-orangerie-faience, .swatch-preview.face-orangerie-faience {
  background: linear-gradient(160deg, var(--faience-paper-1) 0%, var(--faience-paper-2) 100%);
  box-shadow:
    0 2px 6px rgba(0, 0, 0, .45),
    inset 0 0 0 max(1px, calc(var(--cw) * .02)) var(--faience-blue),
    inset 0 0 0 max(2px, calc(var(--cw) * .045)) var(--faience-paper-1),
    inset 0 0 0 max(3px, calc(var(--cw) * .055)) var(--faience-blue-soft);
  font-family: Georgia, serif;
  font-weight: 800;
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.card.face-orangerie-faience::before, .swatch-preview.face-orangerie-faience::before,
.card.face-orangerie-faience::after, .swatch-preview.face-orangerie-faience::after {
  content: "";
  position: absolute;
  width: calc(var(--cw) * .22);
  aspect-ratio: 1;
  border-radius: max(2px, calc(var(--cw) * .025));
  background:
    radial-gradient(circle at 50% 50%, var(--faience-blue) 0 12%, var(--faience-paper-1) 13% 17%, transparent 18%),
    radial-gradient(ellipse 18% 24% at 50% 24%, var(--faience-paper-1) 0 96%, transparent 100%),
    radial-gradient(ellipse 18% 24% at 50% 76%, var(--faience-paper-1) 0 96%, transparent 100%),
    radial-gradient(ellipse 24% 18% at 24% 50%, var(--faience-paper-1) 0 96%, transparent 100%),
    radial-gradient(ellipse 24% 18% at 76% 50%, var(--faience-paper-1) 0 96%, transparent 100%),
    radial-gradient(circle at 0 0, var(--faience-blue-soft) 0 22%, transparent 23%),
    radial-gradient(circle at 100% 0, var(--faience-blue-soft) 0 22%, transparent 23%),
    radial-gradient(circle at 0 100%, var(--faience-blue-soft) 0 22%, transparent 23%),
    radial-gradient(circle at 100% 100%, var(--faience-blue-soft) 0 22%, transparent 23%),
    var(--faience-blue);
  box-shadow: 0 0 0 max(1px, calc(var(--cw) * .012)) var(--faience-paper-1);
  pointer-events: none;
  z-index: 0;
}
.card.face-orangerie-faience::before, .swatch-preview.face-orangerie-faience::before { top: calc(var(--cw) * .1); right: calc(var(--cw) * .1); }
.card.face-orangerie-faience::after, .swatch-preview.face-orangerie-faience::after { bottom: calc(var(--cw) * .1); left: calc(var(--cw) * .1); }
.card.face-orangerie-faience .corner, .card.face-orangerie-faience .pip { z-index: 1; }
.card.face-orangerie-faience.red, .swatch-preview.face-orangerie-faience.mini-card-face.red { color: var(--faience-red); }
.card.face-orangerie-faience.black, .swatch-preview.face-orangerie-faience.mini-card-face.black { color: var(--faience-black); }
.card.face-orangerie-faience.joker .joker-svg, .card.face-orangerie-faience.joker .joker-label { color: var(--faience-blue); }

/* Saison Riviera (juillet-septembre) : Art déco — ivoire, double filet or, éventail en tête et en pied. */
.card.face-riviera-artdeco, .swatch-preview.face-riviera-artdeco {
  background:
    repeating-conic-gradient(from -45deg at 50% 0, var(--deco-sea) 0 6deg, transparent 6deg 12deg) top / 100% calc(var(--cw) * .22) no-repeat,
    repeating-conic-gradient(from 135deg at 50% 100%, var(--deco-sea) 0 6deg, transparent 6deg 12deg) bottom / 100% calc(var(--cw) * .22) no-repeat,
    linear-gradient(180deg, var(--deco-paper-1) 0%, var(--deco-paper-2) 100%);
  box-shadow: 0 2px 6px rgba(0, 0, 0, .45), inset 0 0 0 max(1px, calc(var(--cw) * .018)) var(--deco-gold);
  font-family: Georgia, serif;
  font-weight: 800;
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.card.face-riviera-artdeco::before, .swatch-preview.face-riviera-artdeco::before {
  content: ""; position: absolute; inset: max(2px, calc(var(--cw) * .045));
  border: max(1px, calc(var(--cw) * .01)) solid var(--deco-gold);
  outline: max(1px, calc(var(--cw) * .006)) solid var(--deco-gold);
  outline-offset: max(1px, calc(var(--cw) * .02));
  border-radius: max(2px, calc(var(--cw) * .03));
  pointer-events: none; z-index: 0;
}
.card.face-riviera-artdeco .corner, .card.face-riviera-artdeco .pip { z-index: 1; }
.card.face-riviera-artdeco.red, .swatch-preview.face-riviera-artdeco.mini-card-face.red { color: var(--deco-red); }
.card.face-riviera-artdeco.black, .swatch-preview.face-riviera-artdeco.mini-card-face.black { color: var(--deco-black); }
.card.face-riviera-artdeco.joker .joker-svg, .card.face-riviera-artdeco.joker .joker-label { color: var(--deco-gold); }

/* Saison Grand Salon (octobre-décembre) : Bordeaux et or — papier crème chaud, cadre bordeaux, coins dorés. */
.card.face-salon-bordeaux, .swatch-preview.face-salon-bordeaux {
  background:
    radial-gradient(circle at 0 0, var(--salon-gold) 0 calc(var(--cw) * .05), transparent calc(var(--cw) * .055)),
    radial-gradient(circle at 100% 0, var(--salon-gold) 0 calc(var(--cw) * .05), transparent calc(var(--cw) * .055)),
    radial-gradient(circle at 0 100%, var(--salon-gold) 0 calc(var(--cw) * .05), transparent calc(var(--cw) * .055)),
    radial-gradient(circle at 100% 100%, var(--salon-gold) 0 calc(var(--cw) * .05), transparent calc(var(--cw) * .055)),
    linear-gradient(150deg, var(--salon-paper-1) 0%, var(--salon-paper-2) 100%);
  box-shadow: 0 2px 6px rgba(0, 0, 0, .45), inset 0 0 0 max(2px, calc(var(--cw) * .03)) var(--salon-wine);
  font-family: Georgia, serif;
  font-weight: 800;
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.card.face-salon-bordeaux::before, .swatch-preview.face-salon-bordeaux::before {
  content: ""; position: absolute; inset: max(3px, calc(var(--cw) * .06));
  border: max(1px, calc(var(--cw) * .01)) solid var(--salon-gold);
  border-radius: max(3px, calc(var(--cw) * .05));
  pointer-events: none; z-index: 0;
}
.card.face-salon-bordeaux .corner, .card.face-salon-bordeaux .pip { z-index: 1; }
.card.face-salon-bordeaux.red, .swatch-preview.face-salon-bordeaux.mini-card-face.red { color: var(--salon-red); }
.card.face-salon-bordeaux.black, .swatch-preview.face-salon-bordeaux.mini-card-face.black { color: var(--salon-black); }
.card.face-salon-bordeaux.joker .joker-svg, .card.face-salon-bordeaux.joker .joker-label { color: var(--salon-wine); }