/*
 * Meraly Délice — couche « skin » (chargée avant premium.css).
 * Tout le système de design vit dans premium.css ; ce fichier ne porte que les
 * jetons de marque partagés et trois utilitaires signature (cadre de planche,
 * script orange, prix jaune) réutilisés par plusieurs pages.
 */
:root {
  --mdl-ink: #07120b;
  --mdl-ink-2: #0d1c12;
  --mdl-ink-3: #13271a;
  --mdl-cream: #fff4e0;
  --mdl-paper: #f4ecd8;
  --mdl-orange: #ff7a00;
  --mdl-orange-2: #ff9a1f;
  --mdl-red: #e6421d;
  --mdl-yellow: #ffd23f;
  --mdl-leaf: #2f9e5b;
  --mdl-line: rgba(255, 244, 224, 0.14);
  --mdl-line-dark: rgba(7, 18, 11, 0.16);
  --mdl-shadow: 0 24px 70px rgba(0, 0, 0, 0.5);
  --mdl-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

* { box-sizing: border-box; }

/* Cadre de planche : bord orange 3px, coins arrondis — le motif des menus */
.mdl-frame {
  border: 3px solid var(--mdl-orange);
  border-radius: var(--radius-lg);
}

/* Script « Meraly » : dégradé orange → rouge, comme le lettrage des bols */
.mdl-script {
  font-family: var(--font-family-accent);
  font-weight: 400;
  background: linear-gradient(180deg, #ffb000 0%, var(--mdl-orange) 45%, var(--mdl-red) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  filter: drop-shadow(0 2px 0 rgba(0, 0, 0, 0.35));
}

/* Prix « planche » : jaune, condensé, tabulaire */
.mdl-price {
  font-family: var(--font-family-condensed);
  font-weight: 800;
  color: var(--mdl-yellow);
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.01em;
}