/* ==========================================================
   Essai « années 2000 » : ?annees2000 l'active sur ce téléphone, ?normal revient au thème habituel.
   Polices système d'époque (Trebuchet, Georgia, Verdana), coins ronds, encadrés à bordure,
   boutons brillants, fond à petits points, et un peu de travers par endroits, comme fait à la main.
   ========================================================== */
:root[data-theme="annees2000"] {
  --bg: #eef3f8;
  --surface: #ffffff;
  --surface-2: #e4ecf4;
  --line: #b9cde0;
  --text: #1d2733;
  --muted: #5d6f82;
  --dek: #33475c;
  --accent: #e2660b;
  --brand: #d4142f;
  --link: #1f3bff;
  --tabbar-bg: #dde8f3;
  --serif: Georgia, 'Times New Roman', serif;
  --sans: 'Trebuchet MS', Verdana, Tahoma, sans-serif;
  --radius: 12px;
  --box: 2px solid #9db8d2;
}
:root[data-theme="annees2000"] body {
  background-color: var(--bg);
  background-image: radial-gradient(#cfdcea 1px, transparent 1.2px);
  background-size: 14px 14px;
  font: 15px/1.5 var(--sans);
}

/* Logo : bleu électrique avec ombre décalée façon autocollant */
:root[data-theme="annees2000"] .home-logo .wordmark {
  text-shadow: 3px 3px 0 #ffd23f, 4px 4px 0 #1d2733;
}

/* Le texte d'accueil sur un post-it légèrement de travers */
:root[data-theme="annees2000"] .hero-lead {
  display: inline-block; margin: 4px 0 0; padding: 12px 14px;
  background: #fff6a8; border: 1px solid #e7d66a; border-radius: 4px;
  box-shadow: 2px 3px 0 rgba(0,0,0,.12);
  font: 400 17px/1.4 var(--sans);
  transform: rotate(-1.2deg);
}

/* Chaque section devient un encadré arrondi, avec un en-tête en dégradé */
:root[data-theme="annees2000"] .section {
  margin-top: 26px; padding: 0 14px 12px;
  background: var(--surface); border: var(--box); border-radius: 14px;
  box-shadow: 3px 4px 0 rgba(29,39,51,.10);
  overflow: hidden;
}
:root[data-theme="annees2000"] .section:nth-of-type(odd) { transform: rotate(-.35deg); }
:root[data-theme="annees2000"] .section:nth-of-type(even) { transform: rotate(.3deg); }
:root[data-theme="annees2000"] .section-title {
  margin: 0 -14px 10px; padding: 9px 14px;
  background: linear-gradient(#ffffff, #d6e4f2); border-bottom: var(--box);
  font: bold 13px/1.3 var(--sans); letter-spacing: .02em; text-transform: none; color: #1b3f6b;
}
:root[data-theme="annees2000"] .section-title::after { display: none; }
:root[data-theme="annees2000"] .section-title::before { content: '\2605'; margin-right: 6px; color: var(--accent); }
:root[data-theme="annees2000"] .section-title { justify-content: flex-start; }
:root[data-theme="annees2000"] .section-title .see-all { margin-left: auto; }
:root[data-theme="annees2000"] .section.contact { transform: none; }

/* Liens soulignés, bien bleus */
:root[data-theme="annees2000"] .see-all,
:root[data-theme="annees2000"] .link-btn,
:root[data-theme="annees2000"] .how-link { color: var(--link); text-decoration: underline; font-family: var(--sans); font-style: normal; }
:root[data-theme="annees2000"] .see-all::after { content: ' \00bb'; }

/* Lignes de cafés séparées par des pointillés, titres en Georgia gras */
:root[data-theme="annees2000"] .row { border-bottom: 1px dashed var(--line); padding: 11px 0; }
:root[data-theme="annees2000"] .row-title { font: bold 17px/1.2 var(--serif); }
:root[data-theme="annees2000"] .row-meta { font: 11px var(--sans); letter-spacing: 0; text-transform: none; }
:root[data-theme="annees2000"] .row-meta.reco-why { font: italic 12.5px/1.35 var(--sans); }
:root[data-theme="annees2000"] .kicker { font: bold 10.5px var(--sans); letter-spacing: .06em; color: var(--accent); }

/* Vignettes arrondies avec un petit cadre blanc, comme des photos collées */
:root[data-theme="annees2000"] .cover { border-radius: 8px; }
:root[data-theme="annees2000"] .cover-thumb,
:root[data-theme="annees2000"] .cover-lib,
:root[data-theme="annees2000"] .cover-rail { border: 3px solid #fff; box-shadow: 1px 2px 3px rgba(0,0,0,.25); }
:root[data-theme="annees2000"] .row:nth-child(odd) .cover-thumb { transform: rotate(-2deg); }
:root[data-theme="annees2000"] .row:nth-child(even) .cover-thumb { transform: rotate(1.5deg); }

/* Score : une pastille ronde orange */
:root[data-theme="annees2000"] .row-score .match {
  display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #ffb35c, #e2660b); color: #fff;
  font: bold 16px/1 var(--sans); text-shadow: 0 1px 0 rgba(0,0,0,.3);
  box-shadow: 0 2px 0 #a8480a;
}
:root[data-theme="annees2000"] .match-big { font: bold 44px/1 var(--sans); color: var(--accent); }

/* Boutons brillants et arrondis */
:root[data-theme="annees2000"] .btn {
  border-radius: 999px; border: 1px solid #b04f08;
  background: linear-gradient(#ffb766, #f07a12 55%, #e2660b);
  color: #fff; text-shadow: 0 1px 0 rgba(0,0,0,.3);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.6), 0 2px 0 #a8480a;
  font: bold 14px var(--sans); letter-spacing: .02em; text-transform: none;
}
:root[data-theme="annees2000"] .btn-ghost {
  border-color: #7f9fc0; color: #1b3f6b; text-shadow: none;
  background: linear-gradient(#ffffff, #d6e4f2); box-shadow: inset 0 1px 0 #fff, 0 2px 0 #9db8d2;
}

/* Étiquettes en pilules à dégradé */
:root[data-theme="annees2000"] .chip {
  border: 1px solid #9db8d2; background: linear-gradient(#ffffff, #e4eef8); color: #1b3f6b; font: 13px var(--sans);
}
:root[data-theme="annees2000"] .chip.toggle:has(input:checked) { background: linear-gradient(#ffb766, #e2660b); border-color: #b04f08; color: #fff; }

/* Champs de saisie avec un léger creux */
:root[data-theme="annees2000"] input,
:root[data-theme="annees2000"] select,
:root[data-theme="annees2000"] textarea { border: 2px solid #b9cde0; border-radius: 8px; box-shadow: inset 1px 2px 3px rgba(0,0,0,.08); font-family: var(--sans); }
:root[data-theme="annees2000"] .search-field { border-radius: 999px; border: 2px solid #9db8d2; background: #fff; box-shadow: inset 1px 2px 3px rgba(0,0,0,.08); }
:root[data-theme="annees2000"] legend { font: bold 12px var(--sans); letter-spacing: .02em; text-transform: none; color: #1b3f6b; border-bottom: 1px dashed var(--line); }

/* Titres de page en Georgia gras avec une ombre douce */
:root[data-theme="annees2000"] .page-head h1 { font: bold 32px/1.1 var(--serif); color: #1b3f6b; text-shadow: 2px 2px 0 #fff, 3px 3px 0 #c7d7e8; }

/* « Comment ça marche » dans une bulle */
:root[data-theme="annees2000"] .how-fold[open] {
  padding: 12px 14px; background: #fff; border: var(--box); border-radius: 14px;
}

/* Barre d'onglets brillante, arrondie en haut */
:root[data-theme="annees2000"] .tabbar {
  background: linear-gradient(#ffffff, #cfdeee); border-top: 2px solid #9db8d2;
  border-radius: 16px 16px 0 0; box-shadow: 0 -2px 6px rgba(29,39,51,.12);
}
:root[data-theme="annees2000"] .tabbar a { color: #4a6584; }
:root[data-theme="annees2000"] .tabbar span { font: bold 9px var(--sans); letter-spacing: 0; text-transform: none; }
:root[data-theme="annees2000"] .tabbar a.active { color: var(--link); }
:root[data-theme="annees2000"] .tabbar a.active::before { background: var(--link); }

/* Petits mots, notes et cartes de la bibliothèque */
:root[data-theme="annees2000"] .quote-text { font: italic 16px/1.45 var(--serif); }
:root[data-theme="annees2000"] .my-note { background: #fff6a8; border-color: #e7d66a; border-radius: 4px; }
:root[data-theme="annees2000"] .lib-card { border-bottom: 1px dashed var(--line); }
:root[data-theme="annees2000"] .lib-card-info b { font: bold 17px/1.2 var(--serif); }
:root[data-theme="annees2000"] .menu-link { font: bold 16px var(--sans); color: #1b3f6b; border-bottom: 1px dashed var(--line); }
:root[data-theme="annees2000"] .community-card { border: var(--box); border-radius: 14px; }
:root[data-theme="annees2000"] .search-field input { border: 0; box-shadow: none; border-radius: 0; background: none; font-style: normal; }

/* Fiche café */
:root[data-theme="annees2000"] .cover-hero { border: 4px solid #fff; box-shadow: 2px 4px 0 rgba(29,39,51,.12); border-radius: 14px; }
:root[data-theme="annees2000"] .product-head h1 { font: bold 32px/1.1 var(--serif); color: #1b3f6b; text-shadow: 2px 2px 0 #fff, 3px 3px 0 #c7d7e8; }
:root[data-theme="annees2000"] .product-sub { font-family: var(--sans); }
:root[data-theme="annees2000"] .product-notes { display: flex; flex-wrap: wrap; gap: 6px; font: bold 12px var(--sans); color: #8a3b00; }
:root[data-theme="annees2000"] .forme-block {
  padding: 12px 14px; background: #fff6a8; border: 1px solid #e7d66a; border-radius: 4px;
  box-shadow: 2px 3px 0 rgba(0,0,0,.1); transform: rotate(.6deg);
}
:root[data-theme="annees2000"] .forme-text,
:root[data-theme="annees2000"] .dek { font: 15px/1.5 var(--sans); font-style: normal; }
:root[data-theme="annees2000"] .price-strip { border-bottom: 1px dashed var(--line); }
:root[data-theme="annees2000"] .price-strip b { font: bold 24px var(--sans); color: var(--accent); }
:root[data-theme="annees2000"] .facts dd { font: 15px var(--sans); }
:root[data-theme="annees2000"] .cover-name { font-family: var(--serif); }