/* ==========================================================================
   BOOTH AI STUDIO — guest.css : pages des invités : galerie, photo, TV, mondes, page de marque d'un organisateur
   
   Architecture et règles : docs/CSS-ARCHITECTURE.md (i278).
   Chaque section ci-dessous est « portée » : ses sélecteurs commencent par
   :where(.css-<paquet>-<nom>) et ne s'appliquent que sur les pages qui
   appellent css_use('<paquet>/<nom>'). Spécificité inchangée (:where = 0).
   
   Sections :
     guest/gallery                      ← ancien parts/galerie_chrome.css
     guest/brand                        ← ancien pages/brand.css
     guest/feedback                     ← ancien pages/feedback.css
     guest/my-photos                    ← ancien pages/my-photos.css
     guest/parent                       ← ancien pages/parent.css
     guest/photo                        ← ancien pages/photo.css
     guest/shop-merci                   ← ancien pages/shop/merci.css
     guest/tv                           ← ancien pages/tv.css
     guest/world-c                      ← ancien pages/world/c.css
     guest/world-index                  ← ancien pages/world/index.css
   ========================================================================== */

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   @section guest/gallery
   Ancien fichier : parts/galerie_chrome.css
   Activée par css_use('guest/gallery') dans : src/galerie_chrome.php
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* Styles de src/galerie_chrome.php — sortis de la page (i102b). */

:where(.css-guest-gallery) *,
*:where(.css-guest-gallery) {box-sizing:border-box}
:where(.css-guest-gallery) body {margin:0;font-family:"Inter",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
:where(.css-guest-gallery) .wrap {max-width:1320px;margin:0 auto;padding:0 20px}
:where(.css-guest-gallery) .g-hero {text-align:center;padding:64px 20px 34px}
:where(.css-guest-gallery) .g-eyebrow {font-size:.72rem;letter-spacing:.42em;text-transform:uppercase;opacity:.6}
:where(.css-guest-gallery) .g-title {font-family:"Cormorant Garamond",serif;font-weight:500;font-size:clamp(2.4rem,6vw,4.4rem);line-height:1.02;margin:.3em 0 .15em}
:where(.css-guest-gallery) .g-title em {font-style:italic}
:where(.css-guest-gallery) .g-sub {font-size:.82rem;letter-spacing:.24em;text-transform:uppercase;opacity:.55}
:where(.css-guest-gallery) .g-rule {width:54px;height:1px;margin:18px auto;background:currentColor;opacity:.35}
:where(.css-guest-gallery) .g-back {position:fixed;top:18px;inset-inline-start:18px;z-index:40;text-decoration:none;font-size:.8rem;letter-spacing:.14em;
  padding:.45rem .9rem;border-radius:2rem;backdrop-filter:blur(6px)}
/* Grille justifiée : chaque ligne remplie edge-to-edge (style Pixieset) */
:where(.css-guest-gallery) .g-grid {display:flex;flex-wrap:wrap;gap:12px;margin-bottom:60px}
:where(.css-guest-gallery) .g-grid::after {content:"";flex-grow:1000000000}   /* absorbe l'espace : la dernière ligne ne s'étire pas */
:where(.css-guest-gallery) .g-item {position:relative;height:260px;flex-grow:1;border-radius:12px;overflow:hidden;cursor:zoom-in;
  box-shadow:0 8px 26px rgba(0,0,0,.16)}
:where(.css-guest-gallery) .g-item img {width:100%;height:100%;display:block;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
:where(.css-guest-gallery) .g-item:hover img {transform:scale(1.06)}
:where(.css-guest-gallery) .g-item::after {content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 62%,rgba(0,0,0,.3));opacity:0;transition:.3s;pointer-events:none}
:where(.css-guest-gallery) .g-item:hover::after {opacity:1}
@media(max-width:640px){:where(.css-guest-gallery) .g-item {height:170px}}
/* Cartes liste */
:where(.css-guest-gallery) .g-cards {display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:22px;margin-bottom:60px}
:where(.css-guest-gallery) .g-card {text-decoration:none;color:inherit;display:block}
:where(.css-guest-gallery) .g-cover-wrap {position:relative;border-radius:14px;overflow:hidden;aspect-ratio:4/5}
:where(.css-guest-gallery) .g-cover {width:100%;height:100%;object-fit:cover;transition:transform .6s}
:where(.css-guest-gallery) .g-card:hover .g-cover {transform:scale(1.05)}
:where(.css-guest-gallery) .g-blur {filter:blur(16px) brightness(.7);transform:scale(1.1)}
:where(.css-guest-gallery) .g-lock {position:absolute;top:12px;inset-inline-end:12px;background:rgba(0,0,0,.5);color:#fff;border-radius:2rem;padding:.2rem .7rem;font-size:.74rem;backdrop-filter:blur(4px)}
:where(.css-guest-gallery) .g-cname {font-family:"Cormorant Garamond",serif;font-size:1.5rem;margin:.5rem 0 0}
:where(.css-guest-gallery) .g-cmeta {font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;opacity:.55}
/* LE PIED DE PAGE EST LA SEULE INVITATION DU PARCOURS INVITÉ — IL ÉTAIT
   RÉGLÉ SUR PRESQUE INVISIBLE. Mesuré avant : 11,8 px, opacité 0,45,
   majuscules très espacées. C'est-à-dire la typographie d'une mention
   légale appliquée à la seule phrase qui demande quelque chose.
   La règle ne change pas : rien ne s'interpose entre l'invité et sa photo,
   ceci reste APRÈS les photos, et ce n'est ni une fenêtre ni un formulaire.
   Mais « ne pas s'interposer » et « chuchoter » sont deux choses
   différentes. 14 px, opacité 0,8 : lisible, toujours discret. */
:where(.css-guest-gallery) .g-foot {text-align:center;font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;opacity:.8;padding:26px 0 46px}
/* La marque était un <b> ; c'est un <a> depuis qu'on peut cliquer dessus.
   La règle suit, sinon l'or disparaissait du pied de page. */
:where(.css-guest-gallery) .g-foot b,
:where(.css-guest-gallery) .g-foot a {color:var(--gold-soft);font-weight:500;text-decoration:none}
:where(.css-guest-gallery) .g-foot a:hover {text-decoration:underline}
/* L'invitation elle-même sort du gris : c'est la seule chose de cette page
   qui s'adresse à l'invité plutôt qu'à ses souvenirs. Elle reste sur la même
   ligne, au même endroit, dans la même couleur que la marque. */
:where(.css-guest-gallery) .g-foot .g-cta {font-size:.88rem;letter-spacing:.14em;border-bottom:1px solid rgba(var(--gold-soft-rgb),.45);padding-bottom:2px}
:where(.css-guest-gallery) .g-foot .g-cta:hover {border-bottom-color:var(--gold-soft);text-decoration:none}
:where(.css-guest-gallery) .g-foot-logo {display:inline-block;vertical-align:middle;margin-inline-end:8px}
:where(.css-guest-gallery) .g-foot-logo img {width:26px;height:26px;object-fit:contain;display:block;opacity:.95}
/* La porte des parents : un encadré calme, au-dessus des photos, qui
   ressemble à une entrée et non à une bannière. Sur une fête d'enfants
   c'est le contenu principal de la page publique — les photos qui restent
   sont l'ambiance, les enfants sont derrière cette porte. */
:where(.css-guest-gallery) .g-porte {max-width:560px;margin:0 auto 54px;padding:30px 28px;text-align:center;
  border:1px solid rgba(var(--gold-soft-rgb),.3);border-radius:16px;background:rgba(var(--gold-soft-rgb),.045)}
:where(.css-guest-gallery) .g-porte-ico {font-size:1.9rem;line-height:1;margin-bottom:12px;opacity:.85}
:where(.css-guest-gallery) .g-porte h2 {font-family:"Cormorant Garamond",serif;font-weight:500;font-size:1.5rem;margin:0 0 8px}
:where(.css-guest-gallery) .g-porte p {font-size:.9rem;opacity:.68;margin:0 0 18px;line-height:1.55}
/* Champ et bouton empilés et de MÊME largeur : sur un écran étroit une
   rangée se casse de travers, et sur un large le bouton s'étire tout seul.
   Une colonne étroite et centrée se comporte pareil partout. */
:where(.css-guest-gallery) .g-porte form {display:flex;flex-direction:column;gap:10px;align-items:center}
:where(.css-guest-gallery) .g-porte input,
:where(.css-guest-gallery) .g-porte .g-btn {width:100%;max-width:270px}
:where(.css-guest-gallery) .g-porte input {padding:.8rem 1rem;border-radius:10px;text-align:center;
  font-size:1rem;letter-spacing:.14em;border:1px solid rgba(var(--gold-soft-rgb),.35);
  background:rgba(255,255,255,.04);color:inherit}
:where(.css-guest-gallery) .g-porte-err {color:var(--danger);font-size:.84rem;margin:0 0 12px}
:where(.css-guest-gallery) body.g-light .g-porte {background:rgba(var(--gold-soft-rgb),.09);border-color:rgba(160,130,60,.35)}
:where(.css-guest-gallery) body.g-light .g-porte input {background:#fff;border-color:rgba(160,130,60,.3)}
/* « TÉLÉCHARGER TOUTES LES PHOTOS » — sous la couverture, avant la grille.
   C'est le premier geste d'un parent qui ouvre la galerie de son enfant :
   tout prendre, et regarder plus tard. Le mettre en bas obligerait à
   traverser quarante vignettes pour trouver le bouton qu'on cherchait en
   arrivant. */
:where(.css-guest-gallery) .g-album {text-align:center;margin:0 auto 34px}
:where(.css-guest-gallery) .g-album a {display:inline-flex;align-items:center;gap:9px;text-decoration:none;
  border:1px solid rgba(var(--gold-soft-rgb),.45);border-radius:999px;padding:.72em 1.6em;
  color:var(--gold-soft);font-size:.92rem;letter-spacing:.04em;transition:background .18s,color .18s}
:where(.css-guest-gallery) .g-album a:hover {background:var(--gold-soft);color:var(--black-2)}
:where(.css-guest-gallery) .g-album small {display:block;margin-top:9px;opacity:.5;font-size:.76rem}
:where(.css-guest-gallery) body.g-light .g-album a {border-color:rgba(160,130,60,.5);color:#8a6d2f}
:where(.css-guest-gallery) body.g-light .g-album a:hover {background:var(--gold-soft);color:#fff}
:where(.css-guest-gallery) .g-pass {max-width:340px;margin:6vh auto;text-align:center}
:where(.css-guest-gallery) .g-field {width:100%;padding:.85rem 1rem;border-radius:10px;text-align:center;font-size:1rem;letter-spacing:.15em;border:1px solid;margin-bottom:.6rem}
:where(.css-guest-gallery) .g-btn {display:inline-block;width:100%;padding:.85rem;border:none;border-radius:10px;background:var(--gold-soft);color:#111;font-weight:600;letter-spacing:.12em;cursor:pointer;text-decoration:none}
/* Thème ÉDITORIAL (sombre & or) */
:where(.css-guest-gallery) body.g-editorial {background:#0b0b12;color:#f4f0e8}
:where(.css-guest-gallery) body.g-editorial .g-eyebrow,
:where(.css-guest-gallery) body.g-editorial .g-sub {color:var(--gold-soft);opacity:.85}
:where(.css-guest-gallery) body.g-editorial .g-back {background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);color:#f4f0e8}
:where(.css-guest-gallery) body.g-editorial .g-cover-wrap,
:where(.css-guest-gallery) body.g-editorial .g-item {background:#15151f}
:where(.css-guest-gallery) body.g-editorial .g-field {background:#15151f;border-color:#2a2a37;color:#f4f0e8}
/* Thème ÉPURÉ (clair) */
:where(.css-guest-gallery) body.g-light {background:#f6f4ef;color:#1e1c1a}
:where(.css-guest-gallery) body.g-light .g-eyebrow,
:where(.css-guest-gallery) body.g-light .g-sub {color:#9a8352}
:where(.css-guest-gallery) body.g-light .g-back {background:rgba(0,0,0,.05);border:1px solid rgba(0,0,0,.1);color:#1e1c1a}
:where(.css-guest-gallery) body.g-light .g-item,
:where(.css-guest-gallery) body.g-light .g-cover-wrap {background:#e9e5dc;box-shadow:0 8px 26px rgba(0,0,0,.08)}
:where(.css-guest-gallery) body.g-light .g-field {background:#fff;border-color:#d9d2c6;color:#1e1c1a}
/* Lightbox */
:where(.css-guest-gallery) #lb {position:fixed;inset:0;background:rgba(7,7,11,.97);display:none;z-index:9999;align-items:center;justify-content:center;touch-action:none}
:where(.css-guest-gallery) #lb.open {display:flex}
:where(.css-guest-gallery) #lb img {max-width:94vw;max-height:86vh;object-fit:contain;border-radius:6px;box-shadow:0 24px 70px rgba(0,0,0,.7)}
:where(.css-guest-gallery) .lb-btn {position:absolute;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);color:#fff;width:52px;height:52px;
  border-radius:50%;font-size:1.7rem;display:grid;place-items:center;cursor:pointer;user-select:none;transition:background .2s}
:where(.css-guest-gallery) .lb-btn:hover {background:rgba(255,255,255,.22)}
:where(.css-guest-gallery) .lb-prev {inset-inline-start:2vw;top:50%;transform:translateY(-50%)}
:where(.css-guest-gallery) .lb-next {inset-inline-end:2vw;top:50%;transform:translateY(-50%)}
:where(.css-guest-gallery) .lb-close {top:2.4vh;inset-inline-end:2vw}
:where(.css-guest-gallery) .lb-bar {position:absolute;bottom:3vh;left:50%;transform:translateX(-50%);display:flex;gap:16px;align-items:center}
:where(.css-guest-gallery) .lb-count {color:#cbb98f;font-size:.86rem;letter-spacing:.18em}
:where(.css-guest-gallery) .lb-dl {background:var(--gold-soft);color:#111;text-decoration:none;padding:.5rem 1.2rem;border-radius:2rem;font-weight:600;font-size:.86rem}
/* Diaporama (i158) : ▶ / ⏸, la cadence, le fondu ; au repos, les commandes s'effacent. */
:where(.css-guest-gallery) .lb-play {background:rgba(255,255,255,.08);border:1px solid rgba(var(--gold-soft-rgb),.6);color:#f2dfae;padding:.5rem 1.1rem;border-radius:2rem;
  font:600 .86rem/1.2 inherit;cursor:pointer;white-space:nowrap}
:where(.css-guest-gallery) .lb-play:hover,
:where(.css-guest-gallery) .lb-play:focus-visible {background:rgba(var(--gold-soft-rgb),.22);outline:none}
:where(.css-guest-gallery) .lb-play[aria-pressed="true"] {background:var(--gold-soft);color:#111;border-color:var(--gold-soft)}
:where(.css-guest-gallery) .lb-speed {padding:.5rem .8rem;display:none}
:where(.css-guest-gallery) #lb.lb-playing .lb-speed {display:inline-block}
:where(.css-guest-gallery) #lb img {transition:opacity .4s ease}
:where(.css-guest-gallery) #lb img.lb-fade {opacity:0}
:where(.css-guest-gallery) #lb .lb-btn,
:where(.css-guest-gallery) #lb .lb-bar {transition:opacity .5s}
:where(.css-guest-gallery) #lb.lb-playing.lb-idle {cursor:none}
:where(.css-guest-gallery) #lb.lb-playing.lb-idle .lb-btn,
:where(.css-guest-gallery) #lb.lb-playing.lb-idle .lb-bar {opacity:0;pointer-events:none}
@media(max-width:640px){:where(.css-guest-gallery) .lb-prev,
:where(.css-guest-gallery) .lb-next {width:44px;height:44px;font-size:1.4rem}}
/* Couverture plein écran (façon Pic-Time / Pixieset) */
html:where(.css-guest-gallery) {scroll-behavior:smooth}
:where(.css-guest-gallery) .g-cover-hero {position:relative;height:100vh;height:100svh;min-height:520px;display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;overflow:hidden}
:where(.css-guest-gallery) .g-cover-media {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
:where(.css-guest-gallery) .g-cover-media.kb {animation:kb 20s ease-out both}
@keyframes kb{from{transform:scale(1.09)}to{transform:scale(1)}}
:where(.css-guest-gallery) .g-scrim {position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(0,0,0,.5) 0%,rgba(0,0,0,.12) 34%,rgba(0,0,0,.22) 66%,rgba(0,0,0,.74) 100%)}
/* LE LOGO DE L'OPÉRATEUR, AU-DESSUS DU TITRE.
   « Votre marque, pas la mienne » est ce que promet l'argumentaire aux
   photographes ; la galerie ne l'honorait nulle part. Il est posé au-dessus
   du nom de la fête, discrètement : c'est sa galerie, pas une affiche. */
:where(.css-guest-gallery) .g-logo {max-height:74px;max-width:210px;object-fit:contain;margin:0 auto 18px;display:block;
  filter:drop-shadow(0 2px 16px rgba(0,0,0,.45))}
@media(max-width:640px){:where(.css-guest-gallery) .g-logo {max-height:56px;max-width:160px;margin-bottom:14px}}
:where(.css-guest-gallery) .g-cover-inner {position:relative;z-index:2;padding:24px;max-width:920px}
:where(.css-guest-gallery) .g-cover-hero.has-media .g-cover-inner {color:#fff}
:where(.css-guest-gallery) .g-cover-hero.has-media .g-title {color:#fff;text-shadow:0 2px 34px rgba(0,0,0,.55)}
:where(.css-guest-gallery) .g-cover-hero.has-media .g-eyebrow {color:var(--gold-pale);opacity:.95}
:where(.css-guest-gallery) .g-cover-hero.has-media .g-rule {background:var(--gold-pale);opacity:.75}
:where(.css-guest-gallery) .g-cover-hero .g-title {margin:.12em 0 .1em}
:where(.css-guest-gallery) .g-count {margin-top:12px;font-size:.82rem;letter-spacing:.28em;text-transform:uppercase;opacity:.9}
:where(.css-guest-gallery) .g-cover-hero.has-media .g-count {color:#f2ecdd}
:where(.css-guest-gallery) .g-scrolldown {position:absolute;bottom:26px;left:50%;transform:translateX(-50%);z-index:3;text-decoration:none;
  width:48px;height:48px;border-radius:50%;display:grid;place-items:center;font-size:1.5rem;line-height:1;
  color:#fff;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.3);backdrop-filter:blur(6px);
  animation:bob 1.9s ease-in-out infinite}
:where(.css-guest-gallery) .g-scrolldown:hover {background:rgba(255,255,255,.24)}
@keyframes bob{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(8px)}}
/* Repli sans média : dégradé selon le thème */
:where(.css-guest-gallery) body.g-editorial .g-cover-hero {background:radial-gradient(125% 92% at 50% 0,#1a1a28 0%,#0b0b12 60%)}
:where(.css-guest-gallery) body.g-light .g-cover-hero {background:radial-gradient(125% 92% at 50% 0,#fdfbf7 0%,#efe9df 60%)}
:where(.css-guest-gallery) body.g-light .g-scrolldown {color:#1e1c1a;background:rgba(0,0,0,.06);border-color:rgba(0,0,0,.16)}
:where(.css-guest-gallery) body.g-light .g-cover-hero.has-media .g-scrolldown {color:#fff;background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.32)}
/* ── Boutique ── */
:where(.css-guest-gallery) .g-buy {position:absolute;inset-inline-end:8px;bottom:8px;z-index:3;width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.35);
  background:rgba(var(--black-rgb),.72);color:#fff;font-size:1rem;cursor:pointer;opacity:0;transition:.2s;backdrop-filter:blur(6px)}
:where(.css-guest-gallery) .g-item:hover .g-buy {opacity:1}@media(hover:none){:where(.css-guest-gallery) .g-buy {opacity:1}}
:where(.css-guest-gallery) .g-buy:hover {background:var(--gold-soft);color:#111;border-color:var(--gold-soft)}
:where(.css-guest-gallery) .lb-buy {background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.3);cursor:pointer}
:where(.css-guest-gallery) .lb-fav {background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.3);cursor:pointer}
:where(.css-guest-gallery) .lb-fav.on {background:var(--gold-soft);color:#111;border-color:var(--gold-soft)}
:where(.css-guest-gallery) .cart-fab {position:fixed;inset-inline-end:18px;bottom:18px;z-index:900;border:0;border-radius:999px;padding:14px 22px;background:var(--gold-soft);color:#111;
  font-weight:600;font-size:.95rem;letter-spacing:.04em;box-shadow:0 12px 34px rgba(0,0,0,.4);cursor:pointer}
:where(.css-guest-gallery) .cart-fab[hidden] {display:none}
:where(.css-guest-gallery) .sheet {position:fixed;inset:0;z-index:9998;background:rgba(7,7,11,.72);display:none;align-items:flex-end;justify-content:center;backdrop-filter:blur(4px)}
:where(.css-guest-gallery) .sheet.open {display:flex}
:where(.css-guest-gallery) .sheet-box {width:min(560px,100%);max-height:92vh;overflow:auto;background:#15151f;color:#f4f0e8;border-radius:18px 18px 0 0;box-shadow:0 -20px 60px rgba(0,0,0,.6)}
@media(min-width:640px){:where(.css-guest-gallery) .sheet {align-items:center}:where(.css-guest-gallery) .sheet-box {border-radius:18px}}
:where(.css-guest-gallery) .sheet-wide {width:min(680px,100%)}
:where(.css-guest-gallery) body.g-light .sheet-box {background:#fff;color:#1e1c1a}
:where(.css-guest-gallery) .sheet-head {display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid rgba(var(--gold-soft-rgb),.25);font-family:"Cormorant Garamond",serif;font-size:1.35rem}
:where(.css-guest-gallery) .sheet-x {background:none;border:0;color:inherit;font-size:1.6rem;cursor:pointer;line-height:1}
:where(.css-guest-gallery) .sheet-foot {display:flex;gap:10px;padding:14px 20px;border-top:1px solid rgba(var(--gold-soft-rgb),.25);position:sticky;bottom:0;background:inherit}
:where(.css-guest-gallery) .sheet-btn {flex:1;padding:12px 14px;border-radius:999px;border:1px solid rgba(var(--gold-soft-rgb),.45);background:none;color:inherit;font:inherit;font-weight:600;cursor:pointer}
:where(.css-guest-gallery) .sheet-btn-gold {background:var(--gold-soft);color:#111;border-color:var(--gold-soft)}
:where(.css-guest-gallery) .sheet-body {padding:18px 20px 22px}
:where(.css-guest-gallery) .prod-img {width:100%;max-height:220px;object-fit:contain;border-radius:10px;background:#0b0b12;margin-bottom:14px}
:where(.css-guest-gallery) .prod-img[hidden] {display:none}
:where(.css-guest-gallery) body.g-light .prod-img {background:#e9e5dc}
/* La bande des photos choisies : on voit ce qu'on commande, pas un exemple. */
:where(.css-guest-gallery) .prod-strip {display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px;align-items:center}
:where(.css-guest-gallery) .prod-strip[hidden] {display:none}
:where(.css-guest-gallery) .prod-strip img {width:54px;height:54px;object-fit:cover;border-radius:8px;background:#0b0b12}
:where(.css-guest-gallery) .prod-strip-plus {font-size:.86rem;opacity:.65;padding:0 4px}
:where(.css-guest-gallery) .prod {display:grid;grid-template-columns:1fr auto auto auto;gap:10px;align-items:center;padding:12px 0;border-bottom:1px solid rgba(var(--gold-soft-rgb),.16)}
:where(.css-guest-gallery) .prod:last-child {border-bottom:0}
:where(.css-guest-gallery) .prod-txt small {display:block;opacity:.6;font-size:.78rem}
:where(.css-guest-gallery) .prod-price {font-weight:600;color:var(--gold-soft);white-space:nowrap}
:where(.css-guest-gallery) .qty {display:flex;align-items:center;gap:4px}:where(.css-guest-gallery) .qty button {width:30px;height:30px;border-radius:50%;border:1px solid rgba(var(--gold-soft-rgb),.45);background:none;color:inherit;cursor:pointer;font-size:1rem}
:where(.css-guest-gallery) .qty span {min-width:22px;text-align:center}
:where(.css-guest-gallery) .prod-add {border:0;border-radius:999px;padding:9px 16px;background:var(--gold-soft);color:#111;font-weight:600;cursor:pointer;white-space:nowrap}
:where(.css-guest-gallery) .prod-add.ok {background:#8fd6a7}
@media(max-width:520px){:where(.css-guest-gallery) .prod {grid-template-columns:1fr auto}:where(.css-guest-gallery) .prod-price {grid-column:2}:where(.css-guest-gallery) .qty {grid-column:1}:where(.css-guest-gallery) .prod-add {grid-column:2}}
:where(.css-guest-gallery) .ci {display:grid;grid-template-columns:56px 1fr auto auto;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid rgba(var(--gold-soft-rgb),.16)}
:where(.css-guest-gallery) .ci img {width:56px;height:56px;object-fit:cover;border-radius:8px}
:where(.css-guest-gallery) .ci small {display:block;opacity:.6}:where(.css-guest-gallery) .ci .rm {background:none;border:0;color:inherit;opacity:.6;cursor:pointer;font-size:1.2rem}
/* Sur téléphone la ligne se replie : la quantité et la croix passent
   dessous. La croix se cale alors à droite, sinon elle flotte au milieu du
   vide et on ne sait plus à quelle ligne elle appartient. */
@media(max-width:520px){:where(.css-guest-gallery) .ci {grid-template-columns:56px 1fr auto}:where(.css-guest-gallery) .ci .rm {justify-self:end}}
:where(.css-guest-gallery) .cart-sum {margin:14px 0;font-size:.95rem}:where(.css-guest-gallery) .cart-sum>div {display:flex;justify-content:space-between;padding:5px 0}
:where(.css-guest-gallery) .cart-sum .tot {font-weight:600;color:var(--gold-soft);font-size:1.1rem;border-top:1px solid rgba(var(--gold-soft-rgb),.25);margin-top:4px;padding-top:10px}
:where(.css-guest-gallery) .cart-sum small {opacity:.6;margin-inline-start:6px}
:where(.css-guest-gallery) .cart-form .f2 {display:grid;grid-template-columns:1fr 1fr;gap:10px}@media(max-width:520px){:where(.css-guest-gallery) .cart-form .f2 {grid-template-columns:1fr}}
:where(.css-guest-gallery) .cart-form .g-field {width:100%;margin:0 0 10px;padding:12px 14px;border-radius:10px;border:1px solid #2a2a37;font:inherit}
:where(.css-guest-gallery) .cart-go {width:100%;border:0;border-radius:999px;padding:15px;background:var(--gold-soft);color:#111;font-weight:600;font-size:1rem;cursor:pointer}
:where(.css-guest-gallery) .cart-go[disabled] {opacity:.6;cursor:wait}
:where(.css-guest-gallery) .cart-note {display:block;text-align:center;opacity:.6;margin-top:10px;font-size:.78rem}
:where(.css-guest-gallery) .cart-err {background:rgba(224,119,119,.15);border:1px solid rgba(224,119,119,.5);border-radius:10px;padding:10px 12px;margin-bottom:10px;font-size:.9rem}
:where(.css-guest-gallery) .cart-empty {opacity:.6;text-align:center;padding:20px 0}
/* ── Favoris ──────────────────────────────────────────────────────────
   Le cœur est en HAUT À GAUCHE : le panier occupe déjà le bas à droite, et
   deux ronds au même coin se touchent au doigt. Il reste visible en
   permanence sur écran tactile — un bouton qui n'apparaît qu'au survol
   n'existe pas sur un téléphone. */
:where(.css-guest-gallery) .g-fav {position:absolute;inset-inline-start:8px;top:8px;z-index:3;width:38px;height:38px;border-radius:50%;
  border:1px solid rgba(255,255,255,.35);background:rgba(var(--black-rgb),.72);color:#fff;font-size:1rem;
  cursor:pointer;opacity:0;transition:opacity .2s,background .2s,transform .18s;backdrop-filter:blur(6px);
  display:grid;place-items:center;line-height:1}
:where(.css-guest-gallery) .g-item:hover .g-fav {opacity:1}
@media(hover:none){:where(.css-guest-gallery) .g-fav {opacity:1}}
:where(.css-guest-gallery) .g-fav:hover {background:rgba(var(--gold-soft-rgb),.9);color:#111}
/* Choisie : le cœur reste allumé, sans survol — c'est un état, pas un survol. */
:where(.css-guest-gallery) .g-fav.on {opacity:1;background:var(--gold-soft);color:#111;border-color:var(--gold-soft)}
:where(.css-guest-gallery) .g-fav.on:active {transform:scale(.88)}
/* La barre des favoris fait face au panier : à gauche, même hauteur. */
:where(.css-guest-gallery) .fav-bar {position:fixed;inset-inline-start:18px;bottom:18px;z-index:900;display:flex;gap:8px;align-items:center;
  flex-wrap:wrap;max-width:calc(100vw - 36px);
  background:rgba(var(--black-rgb),.88);border:1px solid rgba(var(--gold-soft-rgb),.4);border-radius:999px;
  padding:9px 10px 9px 18px;box-shadow:0 12px 34px rgba(0,0,0,.45);backdrop-filter:blur(8px)}
:where(.css-guest-gallery) .fav-bar[hidden] {display:none}
:where(.css-guest-gallery) body.g-light .fav-bar {background:rgba(255,255,255,.94);border-color:rgba(var(--gold-soft-rgb),.55);color:#1e1c1a}
:where(.css-guest-gallery) .fav-bar b {font-size:.92rem;font-weight:600;color:var(--gold-soft);white-space:nowrap}
:where(.css-guest-gallery) .fav-bar a,
:where(.css-guest-gallery) .fav-bar button {border:1px solid rgba(var(--gold-soft-rgb),.45);background:none;color:inherit;
  font:inherit;font-size:.86rem;border-radius:999px;padding:8px 14px;cursor:pointer;text-decoration:none;
  white-space:nowrap;min-height:38px;display:inline-flex;align-items:center}
:where(.css-guest-gallery) .fav-bar .gold {background:var(--gold-soft);color:#111;border-color:var(--gold-soft);font-weight:600}
:where(.css-guest-gallery) .fav-bar .vider {border:0;opacity:.6;padding:8px 10px}
/* Sur un téléphone la barre prend toute la largeur en bas : le panier doit
   donc MONTER au-dessus d'elle, sinon les deux se recouvrent et l'un des
   deux devient intouchable. La marge vaut la hauteur de la barre. */
@media(max-width:560px){
  :where(.css-guest-gallery) .fav-bar {inset-inline-start:12px;inset-inline-end:12px;bottom:12px;max-width:none;border-radius:16px;padding:12px 14px;
    justify-content:center}
  /* Le compte prend sa ligne, les deux actions se partagent la suivante :
     autrement « 1 photo choisie ⬇ Télécharger 🛒 Commander × » se replie
     n'importe où et les boutons changent de place selon le nombre. */
  :where(.css-guest-gallery) .fav-bar b {width:100%;text-align:center;order:-1}
  :where(.css-guest-gallery) .fav-bar a,
:where(.css-guest-gallery) .fav-bar button {flex:1;justify-content:center}
  :where(.css-guest-gallery) .fav-bar .vider {flex:0 0 auto}
  /* LA HAUTEUR EST MESURÉE, PAS DEVINÉE. Un nombre écrit en dur ici a déjà
     échoué : la barre se replie en deux lignes dès qu'il y a deux actions,
     et le panier revenait se poser dessus. `--fav-h` est posée par le script
     des favoris à chaque changement, donc elle est toujours juste. */
  :where(.css-guest-gallery) body.a-favoris .cart-fab {bottom:calc(var(--fav-h, 74px) + 24px)}
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   @section guest/brand
   Ancien fichier : pages/brand.css
   Activée par css_use('guest/brand') dans : brand.php
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* Styles de public/brand.php — sortis de la page (i102b). */

:root:where(.css-guest-brand) {
  --ink:#F2E8D8; --ink-dim:#A89878; --bg:var(--black-warm); --surface:#151119;
  --hair:rgba(242,232,216,.12);
}
:where(.css-guest-brand) *,
*:where(.css-guest-brand) {box-sizing:border-box}
:where(.css-guest-brand) body {margin:0;background:var(--bg);color:var(--ink);
     font-family:"Inter",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
:where(.css-guest-brand) a {color:inherit}
:where(.css-guest-brand) .wrap {max-width:1320px;margin:0 auto;padding:0 20px}
:where(.css-guest-brand) .serif {font-family:"Cormorant Garamond",serif;font-weight:500}

/* ── LA BARRE ── discrète, collante, et elle disparaît s'il n'y a qu'une section */
:where(.css-guest-brand) .b-nav {position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:22px;flex-wrap:wrap;
  padding:12px 20px;background:rgba(var(--black-warm-rgb),.82);backdrop-filter:blur(12px);border-bottom:1px solid var(--hair)}
:where(.css-guest-brand) .b-nav .marque {font-family:"Cormorant Garamond",serif;font-size:1.22rem;margin-inline-end:auto;
  display:flex;align-items:center;gap:10px;text-decoration:none}
:where(.css-guest-brand) .b-nav .marque img {max-height:34px;max-width:120px;object-fit:contain}
:where(.css-guest-brand) .b-nav a.lien {font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-dim);text-decoration:none}
:where(.css-guest-brand) .b-nav a.lien:hover {color:var(--accent)}
:where(.css-guest-brand) .b-nav .devis {border:1px solid var(--accent);color:var(--accent);border-radius:999px;padding:8px 18px;
  font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;text-decoration:none}
:where(.css-guest-brand) .b-nav .devis:hover {background:var(--accent);color:var(--bg)}

:where(.css-guest-brand) .b-hero {text-align:center;padding:78px 20px 40px;position:relative;overflow:hidden}
/* Une lueur à la couleur de la marque : la page appartient à quelqu'un dès la première seconde. */
:where(.css-guest-brand) .b-hero::before {content:"";position:absolute;inset:-40% 20% auto;height:520px;pointer-events:none;
  background:radial-gradient(60% 60% at 50% 0%, color-mix(in srgb, var(--accent) 22%, transparent), transparent 72%)}
:where(.css-guest-brand) .b-hero > * {position:relative}
:where(.css-guest-brand) .b-logo {max-width:190px;max-height:110px;margin:0 auto 22px;display:block;object-fit:contain}
:where(.css-guest-brand) .b-eyebrow {font-size:.72rem;letter-spacing:.42em;text-transform:uppercase;color:var(--accent);opacity:.85}
:where(.css-guest-brand) .b-title {font-family:"Cormorant Garamond",serif;font-weight:500;
         font-size:clamp(2.4rem,6vw,4.4rem);line-height:1.02;margin:.24em 0 .1em;text-wrap:balance}
:where(.css-guest-brand) .b-tag {font-size:.84rem;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-dim)}
:where(.css-guest-brand) .b-rule {width:54px;height:1px;margin:22px auto;background:var(--accent);opacity:.6}
:where(.css-guest-brand) .b-intro {max-width:62ch;margin:0 auto;color:var(--ink-dim);line-height:1.75;white-space:pre-line}
:where(.css-guest-brand) .b-cta {display:inline-flex;margin-top:26px;background:var(--accent);color:var(--bg);text-decoration:none;
  border-radius:999px;padding:14px 30px;font-size:.76rem;letter-spacing:.2em;text-transform:uppercase}
:where(.css-guest-brand) .b-cta:hover {filter:brightness(1.12)}

/* La barre est collante : sans cette marge, un lien d'ancre place le titre de
   la section DERRIÈRE elle, et on arrive sur un texte coupé. */
:where(.css-guest-brand) .b-sec {padding:64px 0;scroll-margin-top:72px}
:where(.css-guest-brand) .b-sec + .b-sec {border-top:1px solid var(--hair)}
:where(.css-guest-brand) .b-sec-t {font-family:"Cormorant Garamond",serif;font-size:clamp(1.7rem,3.4vw,2.5rem);
  text-align:center;margin:0 0 6px}
:where(.css-guest-brand) .b-sec-s {text-align:center;color:var(--ink-dim);font-size:.78rem;letter-spacing:.2em;
  text-transform:uppercase;margin:0 0 34px}

:where(.css-guest-brand) .b-cards {display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:24px}
:where(.css-guest-brand) .b-card {text-decoration:none;display:block}
:where(.css-guest-brand) .b-cover-wrap {position:relative;aspect-ratio:4/3;border-radius:14px;overflow:hidden;background:var(--surface);
              box-shadow:0 10px 30px rgba(0,0,0,.35)}
:where(.css-guest-brand) .b-cover {width:100%;height:100%;object-fit:cover;display:block;
         transition:transform .6s cubic-bezier(.2,.7,.2,1)}
:where(.css-guest-brand) .b-card:hover .b-cover {transform:scale(1.05)}
:where(.css-guest-brand) .b-nocover {position:absolute;inset:0;display:grid;place-items:center;font-size:2.6rem;opacity:.55;
  background:radial-gradient(120% 90% at 50% 0%, color-mix(in srgb, var(--accent) 28%, transparent), transparent 70%)}
:where(.css-guest-brand) .b-lock {position:absolute;top:10px;inset-inline-end:10px;font-size:.7rem;letter-spacing:.1em;
        background:rgba(var(--black-warm-rgb),.72);padding:.3rem .6rem;border-radius:1rem;backdrop-filter:blur(6px)}
:where(.css-guest-brand) .b-cname {font-family:"Cormorant Garamond",serif;font-size:1.35rem;margin:.7rem 0 .1rem}
:where(.css-guest-brand) .b-cmeta {font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-dim)}

/* ── FORMULES ── */
:where(.css-guest-brand) .b-offres {display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:22px;align-items:start}
:where(.css-guest-brand) .b-offre {border:1px solid var(--hair);border-radius:18px;padding:30px 28px;background:var(--surface);
  display:flex;flex-direction:column;gap:14px;position:relative}
:where(.css-guest-brand) .b-offre.vedette {border-color:var(--accent);box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 40%,transparent),0 18px 48px rgba(0,0,0,.45)}
:where(.css-guest-brand) .b-offre .etiq {position:absolute;top:-11px;inset-inline-start:28px;background:var(--accent);color:var(--bg);
  font-size:.64rem;letter-spacing:.18em;text-transform:uppercase;padding:4px 12px;border-radius:999px}
:where(.css-guest-brand) .b-offre h3 {font-family:"Cormorant Garamond",serif;font-weight:500;font-size:1.65rem;margin:0}
:where(.css-guest-brand) .b-prix {font-family:"Cormorant Garamond",serif;font-size:1.9rem;color:var(--accent);line-height:1}
:where(.css-guest-brand) .b-offre p {margin:0;color:var(--ink-dim);line-height:1.7;font-size:.94rem}
:where(.css-guest-brand) .b-offre ul {margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:9px}
:where(.css-guest-brand) .b-offre li {display:flex;gap:10px;font-size:.92rem;color:var(--ink-dim);line-height:1.5}
:where(.css-guest-brand) .b-offre li::before {content:"✦";color:var(--accent);flex:none}
:where(.css-guest-brand) .b-offre .b-ph {width:calc(100% + 56px);margin:-30px -28px 4px;max-width:none;aspect-ratio:16/10;max-height:300px;object-fit:cover;border-radius:18px 18px 0 0;display:block}
:where(.css-guest-brand) .b-prods {display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));gap:22px;align-items:stretch}
:where(.css-guest-brand) .b-prod {border:1px solid var(--hair);border-radius:18px;overflow:hidden;background:var(--surface);display:flex;flex-direction:column}
:where(.css-guest-brand) .b-prod__ph {width:100%;aspect-ratio:4/3;max-height:300px;object-fit:cover;display:block}
:where(.css-guest-brand) .b-prod__body {padding:22px 24px 26px;display:flex;flex-direction:column;gap:10px;flex:1}
:where(.css-guest-brand) .b-prod h3 {font-family:"Cormorant Garamond",serif;font-weight:500;font-size:1.5rem;margin:0}
:where(.css-guest-brand) .b-prod p {margin:0;color:var(--ink-dim);line-height:1.65;font-size:.93rem}
:where(.css-guest-brand) .b-prod__cta {margin-top:auto;align-self:flex-start;color:var(--accent);text-decoration:none;border-bottom:1px solid currentColor;font-size:.9rem;padding-bottom:2px}

/* ── CONTACT ── */
:where(.css-guest-brand) .b-contact {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:46px;max-width:1000px;margin:0 auto}
@media(max-width:760px){:where(.css-guest-brand) .b-contact {grid-template-columns:1fr;gap:28px}}
:where(.css-guest-brand) .b-side {display:flex;flex-direction:column;gap:26px;min-width:0}
/* i322g — le portrait est à gauche du formulaire (plus de bloc « Qui suis-je ») ; sans formulaire, tout tient sur une colonne */
:where(.css-guest-brand) .b-portrait {width:100%;aspect-ratio:4/5;max-height:520px;object-fit:cover;border-radius:18px;display:block;
  box-shadow:0 18px 48px rgba(0,0,0,.5)}
:where(.css-guest-brand) .b-contact.sans-form {grid-template-columns:minmax(0,1fr);max-width:520px}
:where(.css-guest-brand) .b-contact.avec-portrait {align-items:start}
:where(.css-guest-brand) .b-coord {display:flex;flex-direction:column;gap:16px}
:where(.css-guest-brand) .b-coord a,
:where(.css-guest-brand) .b-coord span {color:var(--ink-dim);text-decoration:none;display:flex;gap:11px;align-items:center;font-size:.98rem}
:where(.css-guest-brand) .b-coord a:hover {color:var(--accent)}
:where(.css-guest-brand) .b-form {display:grid;gap:14px}
:where(.css-guest-brand) .b-form label {font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-dim);display:block;margin-bottom:6px}
:where(.css-guest-brand) .b-form input,
:where(.css-guest-brand) .b-form textarea {width:100%;background:rgba(242,232,216,.04);border:1px solid var(--hair);
  border-radius:11px;padding:13px 15px;color:var(--ink);font:inherit;font-size:.96rem}
:where(.css-guest-brand) .b-form input:focus,
:where(.css-guest-brand) .b-form textarea:focus {outline:none;border-color:var(--accent)}
:where(.css-guest-brand) .b-form .duo {display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:560px){:where(.css-guest-brand) .b-form .duo {grid-template-columns:1fr}}
:where(.css-guest-brand) .b-form button {background:var(--accent);color:var(--bg);border:0;border-radius:999px;padding:15px 30px;
  font:inherit;font-size:.76rem;letter-spacing:.2em;text-transform:uppercase;cursor:pointer;justify-self:start}
:where(.css-guest-brand) .b-form button:hover {filter:brightness(1.12)}
:where(.css-guest-brand) .b-note {font-size:.78rem;color:var(--ink-dim);line-height:1.6}
:where(.css-guest-brand) .b-flash {border-radius:12px;padding:14px 18px;font-size:.94rem;line-height:1.6;margin-bottom:8px}
:where(.css-guest-brand) .b-flash.ok {border:1px solid color-mix(in srgb,var(--accent) 60%,transparent);color:var(--ink)}
:where(.css-guest-brand) .b-flash.ko {border:1px solid rgba(229,139,139,.5);color:#e5a0a0}
:where(.css-guest-brand) .piege {position:absolute;inset-inline-start:-9999px;width:1px;height:1px;overflow:hidden}

:where(.css-guest-brand) .b-empty {text-align:center;color:var(--ink-dim);padding:60px 20px 90px;line-height:1.8}
:where(.css-guest-brand) .b-foot {border-top:1px solid var(--hair);padding:34px 20px;text-align:center;
        font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-dim)}
:where(.css-guest-brand) .b-foot a {color:var(--accent);text-decoration:none}
:where(.css-guest-brand) .b-soc {display:flex;gap:18px;justify-content:center;margin-bottom:18px;flex-wrap:wrap}
:where(.css-guest-brand) .b-soc a {font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-dim);text-decoration:none}
:where(.css-guest-brand) .b-soc a:hover {color:var(--accent)}
/* Le choix de langue du pied de page (i174) : discret, mais atteignable —
   sur un sous-domaine, c'est le seul endroit où un visiteur peut corriger
   la langue que son navigateur a annoncée. */
:where(.css-guest-brand) .b-lang {display:inline-flex;align-items:center;gap:7px;margin-bottom:16px;
        border:1px solid var(--hair);border-radius:2rem;padding:6px 14px}
:where(.css-guest-brand) .b-lang select {background:none;border:0;color:var(--ink-dim);font:inherit;
        letter-spacing:.1em;text-transform:none;cursor:pointer}
:where(.css-guest-brand) .b-lang select:focus-visible {outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
@media(prefers-reduced-motion:reduce){:where(.css-guest-brand) *,
*:where(.css-guest-brand) {transition:none!important}}

/* ── LA TÊTE DE PAGE (i108) : couverture + médaillon, comme une page Facebook ── */
:where(.css-guest-brand) .b-tete {position:relative;padding-bottom:30px;border-bottom:1px solid var(--hair)}
:where(.css-guest-brand) .b-banniere {position:relative;height:clamp(200px,34vw,420px);overflow:hidden;
  background:radial-gradient(120% 140% at 15% 0%, color-mix(in srgb, var(--accent) 55%, transparent), transparent 62%),
             radial-gradient(90% 120% at 100% 100%, color-mix(in srgb, var(--accent) 22%, transparent), transparent 60%),
             linear-gradient(135deg,#1b1712,var(--bg))}
:where(.css-guest-brand) .b-banniere img {width:100%;height:100%;object-fit:cover;display:block}
/* Un voile bas : le nom posé sous l'image reste lisible, l'image se fond dans la page. */
:where(.css-guest-brand) .b-banniere::after {content:"";position:absolute;inset:auto 0 0;height:45%;
  background:linear-gradient(to bottom, transparent, color-mix(in srgb, var(--bg) 85%, transparent))}
:where(.css-guest-brand) .b-ident {position:relative;display:flex;align-items:flex-end;gap:26px;margin-top:-74px;flex-wrap:wrap}
:where(.css-guest-brand) .b-medaillon {width:148px;height:148px;border-radius:50%;flex:none;overflow:hidden;display:grid;place-items:center;
  background:var(--surface);border:5px solid var(--bg);box-shadow:0 0 0 2px var(--accent),0 18px 40px rgba(0,0,0,.5)}
:where(.css-guest-brand) .b-medaillon img {width:100%;height:100%;object-fit:contain;background:#fff;padding:12%}
:where(.css-guest-brand) .b-medaillon span {font-family:"Cormorant Garamond",serif;font-size:4.2rem;color:var(--accent);line-height:1}
:where(.css-guest-brand) .b-idtxt {flex:1 1 280px;min-width:0;padding-bottom:6px}
:where(.css-guest-brand) .b-idtxt .b-title {text-align:start;margin:0 0 .12em;font-size:clamp(2.1rem,4.6vw,3.6rem)}
:where(.css-guest-brand) .b-faits {margin-top:10px;font-size:.84rem;color:var(--ink-dim)}
:where(.css-guest-brand) .b-gestes {display:flex;gap:12px;flex-wrap:wrap;padding-bottom:10px}
:where(.css-guest-brand) .b-gestes .b-cta {margin-top:0}
:where(.css-guest-brand) .b-cta--ligne {background:transparent;color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
:where(.css-guest-brand) .b-cta--ligne:hover {background:color-mix(in srgb, var(--accent) 14%, transparent);filter:none}
:where(.css-guest-brand) .b-intro--tete {margin:26px 0 0;max-width:80ch;text-align:start}
@media(max-width:760px){
  :where(.css-guest-brand) .b-ident {margin-top:-58px;gap:16px;flex-direction:column;align-items:flex-start}
  :where(.css-guest-brand) .b-idtxt {flex:none;width:100%}
  :where(.css-guest-brand) .b-medaillon {width:112px;height:112px}
  :where(.css-guest-brand) .b-medaillon span {font-size:3.2rem}
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   @section guest/feedback
   Ancien fichier : pages/feedback.css
   Activée par css_use('guest/feedback') dans : feedback.php
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* Styles de public/feedback.php — sortis de la page (i102b). */

:root:where(.css-guest-feedback) {--or:var(--gold-soft);--noir:var(--black);--ivoire:var(--cream);--hair:rgba(var(--gold-soft-rgb),.28);--muted:#a9a396}
:where(.css-guest-feedback) *,
*:where(.css-guest-feedback) {box-sizing:border-box}
:where(.css-guest-feedback) body {margin:0;background:var(--noir);color:var(--ivoire);font:16px/1.6 system-ui,Segoe UI,Arial,sans-serif;
     -webkit-font-smoothing:antialiased}
:where(.css-guest-feedback) .wrap {max-width:620px;margin:0 auto;padding:44px 20px 64px}
:where(.css-guest-feedback) .eyebrow {font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;color:var(--or);margin-bottom:10px}
:where(.css-guest-feedback) h1 {font-family:Cormorant Garamond,Georgia,serif;font-weight:500;font-size:clamp(1.8rem,5vw,2.6rem);margin:0 0 10px;line-height:1.15}
:where(.css-guest-feedback) .sub {color:var(--muted);font-size:.95rem;margin:0 0 34px}
:where(.css-guest-feedback) .q {margin-bottom:30px}
:where(.css-guest-feedback) .q-lib {font-size:1.02rem;margin-bottom:12px;display:block}
:where(.css-guest-feedback) .q-aide {color:var(--muted);font-size:.82rem;margin:-6px 0 12px}
/* Les étoiles sont des vraies cases à cocher : au clavier comme au doigt. */
:where(.css-guest-feedback) .notes {display:flex;gap:8px;flex-wrap:wrap}
:where(.css-guest-feedback) .notes input {position:absolute;opacity:0;width:0;height:0}
:where(.css-guest-feedback) .notes label {cursor:pointer;border:1px solid var(--hair);border-radius:12px;padding:12px 0;width:62px;text-align:center;
             background:rgba(var(--gold-soft-rgb),.05);transition:.15s;line-height:1.25}
:where(.css-guest-feedback) .notes label span {display:block;font-size:1.35rem}
:where(.css-guest-feedback) .notes label small {display:block;font-size:.62rem;color:var(--muted);letter-spacing:.02em}
:where(.css-guest-feedback) .notes label:hover {border-color:var(--or)}
:where(.css-guest-feedback) .notes input:focus-visible + label {outline:2px solid var(--or);outline-offset:2px}
:where(.css-guest-feedback) .notes input:checked + label {background:var(--or);border-color:var(--or);color:#1a1712}
:where(.css-guest-feedback) .notes input:checked + label small {color:#4a3f24}
:where(.css-guest-feedback) textarea {width:100%;min-height:112px;padding:13px 15px;border-radius:11px;border:1px solid var(--hair);
         background:rgba(255,255,255,.03);color:var(--ivoire);font:inherit;font-size:.97rem;resize:vertical}
:where(.css-guest-feedback) textarea:focus {outline:none;border-color:var(--or)}
:where(.css-guest-feedback) .choix {display:flex;gap:8px;flex-wrap:wrap}
:where(.css-guest-feedback) .choix input {position:absolute;opacity:0;width:0;height:0}
:where(.css-guest-feedback) .choix label {cursor:pointer;border:1px solid var(--hair);border-radius:2rem;padding:11px 22px;
             background:rgba(var(--gold-soft-rgb),.05);transition:.15s}
:where(.css-guest-feedback) .choix label:hover {border-color:var(--or)}
:where(.css-guest-feedback) .choix input:focus-visible + label {outline:2px solid var(--or);outline-offset:2px}
:where(.css-guest-feedback) .choix input:checked + label {background:var(--or);border-color:var(--or);color:#1a1712;font-weight:600}
:where(.css-guest-feedback) .btn {display:inline-block;border:0;border-radius:11px;padding:15px 34px;background:var(--or);color:#1a1712;
     font-weight:600;font-size:1rem;cursor:pointer;text-decoration:none}
:where(.css-guest-feedback) .foot {margin-top:46px;padding-top:20px;border-top:1px solid var(--hair);font-size:.78rem;color:var(--muted)}
:where(.css-guest-feedback) .foot a {color:#a98d4f}
:where(.css-guest-feedback) .merci {border:1px solid var(--hair);border-radius:14px;padding:26px 24px;background:rgba(var(--gold-soft-rgb),.06)}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   @section guest/my-photos
   Ancien fichier : pages/my-photos.css
   Activée par css_use('guest/my-photos') dans : my-photos.php
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* Styles de public/my-photos.php — sortis de la page (i102b). */

:root:where(.css-guest-my-photos) {--or:var(--gold-soft);--noir:var(--black);--ivoire:var(--cream);--ivoire2:#b6a98f;--trait:rgba(var(--gold-soft-rgb),.28)}
:where(.css-guest-my-photos) *,
*:where(.css-guest-my-photos) {box-sizing:border-box}
:where(.css-guest-my-photos) body {margin:0;min-height:100vh;display:grid;place-items:center;padding:26px;
  background:radial-gradient(120% 90% at 50% 0,#1a1610,var(--black) 70%);color:var(--ivoire);
  font:16px/1.6 ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
:where(.css-guest-my-photos) .carte {width:100%;max-width:440px;text-align:center}
:where(.css-guest-my-photos) h1 {font-family:Georgia,"Times New Roman",serif;font-weight:500;font-size:clamp(1.5rem,6vw,2rem);
  line-height:1.15;margin:0 0 10px}
:where(.css-guest-my-photos) p.sous {color:var(--ivoire2);margin:0 0 26px;font-size:.98rem}
/* Le champ est le sujet de la page : grand, centré, en majuscules, avec un
   interligne qui laisse compter les caractères à l'œil. */
:where(.css-guest-my-photos) input[type=text] {width:100%;padding:18px 14px;border-radius:14px;text-align:center;
  background:rgba(255,255,255,.04);border:1px solid var(--trait);color:var(--ivoire);
  font:600 1.6rem/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:.32em;text-transform:uppercase}
:where(.css-guest-my-photos) input[type=text]:focus {outline:none;border-color:var(--or);background:rgba(var(--gold-soft-rgb),.07)}
:where(.css-guest-my-photos) input[type=text]::placeholder {letter-spacing:.2em;font-size:1.1rem;color:#6d6455;font-weight:400}
:where(.css-guest-my-photos) button {width:100%;margin-top:14px;padding:16px;border-radius:14px;border:0;cursor:pointer;
  background:var(--or);color:#171410;font-size:1.02rem;font-weight:600;letter-spacing:.03em}
:where(.css-guest-my-photos) button:hover {filter:brightness(1.08)}
:where(.css-guest-my-photos) .err {margin:16px 0 0;padding:13px 15px;border-radius:12px;font-size:.92rem;line-height:1.5;
  background:rgba(224,119,119,.1);border:1px solid rgba(224,119,119,.4);color:#f0b9b9}
:where(.css-guest-my-photos) .aide {margin-top:26px;color:var(--ivoire2);font-size:.86rem;line-height:1.6}
:where(.css-guest-my-photos) .pied {margin-top:34px;font-size:.78rem;color:#6d6455}
:where(.css-guest-my-photos) .pied a {color:#8a7f6b;text-decoration:none}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   @section guest/parent
   Ancien fichier : pages/parent.css
   Activée par css_use('guest/parent') dans : parent.php
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* Styles de public/parent.php — sortis de la page (i102b). */

:where(.css-guest-parent) .p-mail {max-width:760px;margin:26px auto 0;padding:14px 18px;border-radius:14px;
        border:1px solid rgba(var(--gold-soft-rgb),.30);background:rgba(var(--gold-soft-rgb),.07)}
:where(.css-guest-parent) .p-mail-t {font-size:.95rem;margin:0 0 3px}
:where(.css-guest-parent) .p-mail-s {font-size:.8rem;opacity:.62;margin:0 0 11px;line-height:1.5}
:where(.css-guest-parent) .p-mail-f {display:flex;gap:8px;flex-wrap:wrap;align-items:center}
:where(.css-guest-parent) .p-mail-f input[type=email] {flex:1 1 240px;min-width:0;padding:10px 13px;border-radius:10px;
        border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.20);color:inherit;font:inherit;font-size:.92rem}
:where(.css-guest-parent) .p-mail-f button {padding:10px 18px;border-radius:10px;border:0;cursor:pointer;font:inherit;font-size:.9rem}
:where(.css-guest-parent) .p-mail-ok {background:var(--gold-soft);color:var(--surface-2);font-weight:600}
:where(.css-guest-parent) .p-mail-non {background:none;border:1px solid rgba(255,255,255,.16);color:inherit;opacity:.62}
:where(.css-guest-parent) .p-mail-err {color:var(--danger);font-size:.82rem;margin:8px 0 0}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   @section guest/photo
   Ancien fichier : pages/photo.css
   Activée par css_use('guest/photo') dans : photo.php
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* Styles de public/photo.php — sortis de la page (i102b). */

:where(.css-guest-photo) *,
*:where(.css-guest-photo) {box-sizing:border-box}
:where(.css-guest-photo) body {margin:0;background:#0b0b12;color:#f2efe9;font-family:"Inter",system-ui,-apple-system,Segoe UI,sans-serif;
     -webkit-font-smoothing:antialiased;display:flex;flex-direction:column;min-height:100vh}
:where(.css-guest-photo) main {flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:22px 18px 8px;gap:18px}
:where(.css-guest-photo) .p-title {font-size:.74rem;letter-spacing:.28em;text-transform:uppercase;opacity:.55;text-align:center;margin:0}
:where(.css-guest-photo) .p-shot {max-width:min(760px,100%);border-radius:14px;overflow:hidden;box-shadow:0 18px 50px rgba(0,0,0,.55);line-height:0}
:where(.css-guest-photo) .p-shot img {display:block;width:100%;height:auto}
:where(.css-guest-photo) .p-dl {display:inline-block;background:var(--gold-soft);color:#14120d;text-decoration:none;font-weight:600;
      padding:14px 30px;border-radius:999px;font-size:1rem}
:where(.css-guest-photo) .p-dl:active {transform:translateY(1px)}
/* La marque : sous la photo, sous le bouton, en petit. Elle se remarque si on
   la cherche et ne gêne jamais si on ne la cherche pas. */
:where(.css-guest-photo) .p-foot {text-align:center;padding:26px 18px 34px;font-size:.78rem;opacity:.5;line-height:1.7}
:where(.css-guest-photo) .p-foot a {color:var(--gold-soft);text-decoration:none}
:where(.css-guest-photo) .p-foot a:hover {text-decoration:underline}
:where(.css-guest-photo) .p-gone {text-align:center;max-width:440px;line-height:1.7}
:where(.css-guest-photo) .p-gone h1 {font-size:1.3rem;font-weight:500;margin:0 0 10px}
/* i307 — la photo n'est pas encore arrivée : page d'attente qui se rafraîchit seule */
:where(.css-guest-photo) .p-wait {text-align:center;max-width:440px;line-height:1.7}
:where(.css-guest-photo) .p-wait h1 {font-size:1.3rem;font-weight:500;margin:18px 0 10px}
:where(.css-guest-photo) .p-wait p {opacity:.8;margin:0 0 20px}
:where(.css-guest-photo) .p-wait .p-late {font-size:.85rem;opacity:.6}
:where(.css-guest-photo) .d-none {display:none}
:where(.css-guest-photo) .p-spin {width:46px;height:46px;margin:0 auto;border-radius:50%;border:3px solid rgba(255,255,255,.14);
      border-top-color:var(--gold-soft);animation:p-spin 1s linear infinite}
@keyframes p-spin {to {transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce) {:where(.css-guest-photo) .p-spin {animation:none}}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   @section guest/shop-merci
   Ancien fichier : pages/shop/merci.css
   Activée par css_use('guest/shop-merci') dans : shop/merci.php
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* Styles de public/shop/merci.php — sortis de la page (i102b). */

:where(.css-guest-shop-merci) *,
*:where(.css-guest-shop-merci) {box-sizing:border-box} :where(.css-guest-shop-merci) body {margin:0;font-family:"Inter",system-ui,sans-serif;background:var(--black);color:var(--cream);-webkit-font-smoothing:antialiased}
:where(.css-guest-shop-merci) .wrap {max-width:640px;margin:0 auto;padding:60px 20px}
:where(.css-guest-shop-merci) .eyebrow {font-size:.72rem;letter-spacing:.42em;text-transform:uppercase;color:var(--gold-soft)}
:where(.css-guest-shop-merci) h1 {font-family:"Cormorant Garamond",serif;font-weight:500;font-size:clamp(2rem,5vw,3rem);line-height:1.05;margin:.3em 0 .4em}
:where(.css-guest-shop-merci) p {color:var(--ivory-2);line-height:1.6}
:where(.css-guest-shop-merci) .card {background:#15130f;border:1px solid rgba(var(--gold-soft-rgb),.25);border-radius:16px;padding:22px;margin-top:26px}
:where(.css-guest-shop-merci) .row {display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid rgba(var(--gold-soft-rgb),.12);font-size:.95rem}
:where(.css-guest-shop-merci) .row:last-child {border-bottom:0}:where(.css-guest-shop-merci) .tot {font-weight:600;color:#f6d57a;font-size:1.05rem}
:where(.css-guest-shop-merci) .badge {display:inline-block;padding:5px 12px;border-radius:999px;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;border:1px solid rgba(var(--gold-soft-rgb),.45);color:#f6d57a}
:where(.css-guest-shop-merci) a.btn {display:inline-block;margin-top:26px;padding:14px 24px;border-radius:999px;background:var(--gold-soft);color:var(--black);text-decoration:none;font-weight:600;letter-spacing:.06em}
:where(.css-guest-shop-merci) .thumbs {display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}:where(.css-guest-shop-merci) .thumbs img {width:64px;height:64px;object-fit:cover;border-radius:8px;border:1px solid rgba(var(--gold-soft-rgb),.3)}
:where(.css-guest-shop-merci) .foot {text-align:center;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;opacity:.45;padding:30px 0}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   @section guest/tv
   Ancien fichier : pages/tv.css
   Activée par css_use('guest/tv') dans : tv.php, w.php
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* Monde sur TV (i157) — la page du téléviseur (/tv) et celle du téléphone (/tv?c=). */
html:where(.css-guest-tv),
:where(.css-guest-tv) body { margin: 0; background: var(--black-warm); color: var(--ivory); font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
:where(.css-guest-tv) a { color: var(--gold-light); }
:where(.css-guest-tv) main { max-width: 1100px; margin: 0 auto; padding: 28px 20px 40px; }

/* TV : lisible à 3 mètres */
:where(.css-guest-tv) .tv-screen main { min-height: 100vh; box-sizing: border-box; display: flex; flex-direction: column; justify-content: center; padding: 4vh 5vw; max-width: none; }
:where(.css-guest-tv) .tv-brand { margin: 0 0 1vh; color: var(--gold); letter-spacing: .25em; text-transform: uppercase; font-size: 2.2vh; }
:where(.css-guest-tv) .tv-screen h1 { margin: 0 0 5vh; font-weight: 600; font-size: 5vh; line-height: 1.15; }
:where(.css-guest-tv) .tv-pair { display: flex; align-items: center; gap: 5vw; }
:where(.css-guest-tv) .tv-qr { flex: 0 0 auto; background: #fff; border-radius: 16px; min-width: 20vh; min-height: 20vh; }
:where(.css-guest-tv) .tv-qr img { display: block; width: 36vh; height: 36vh; image-rendering: pixelated; }
:where(.css-guest-tv) .tv-how { flex: 1 1 auto; }
:where(.css-guest-tv) .tv-step { font-size: 3.2vh; line-height: 1.35; margin: 0 0 2.4vh; }
:where(.css-guest-tv) .tv-code-l { font-size: 2.4vh; color: #BFB19C; margin: 4vh 0 1vh; }
:where(.css-guest-tv) .tv-code { font-size: 11vh; font-weight: 700; letter-spacing: .12em; color: var(--gold-light); margin: 0; font-variant-numeric: tabular-nums; }
:where(.css-guest-tv) .tv-screen .tv-status { font-size: 2.6vh; }

/* Téléphone */
:where(.css-guest-tv) .tv-phone main { max-width: 640px; }
:where(.css-guest-tv) .tv-phone h1 { font-size: 24px; font-weight: 600; margin: 0 0 18px; }
:where(.css-guest-tv) .tv-l { display: block; font-size: 14px; color: #BFB19C; margin: 0 0 6px; }
:where(.css-guest-tv) .tv-code-in { width: 100%; box-sizing: border-box; font-size: 30px; letter-spacing: .15em; text-transform: uppercase; text-align: center;
  padding: 12px; border-radius: 14px; border: 1px solid rgba(var(--gold-rgb),.55); background: #17120d; color: var(--gold-light); margin-bottom: 18px; }
:where(.css-guest-tv) .tv-find { width: 100%; box-sizing: border-box; font-size: 16px; padding: 10px 14px; border-radius: 12px; border: 1px solid rgba(var(--gold-rgb),.35);
  background: #17120d; color: var(--ivory); margin-bottom: 12px; }
:where(.css-guest-tv) .tv-owner { font-size: 15px; color: var(--gold); margin: 18px 0 6px; font-weight: 600; }
:where(.css-guest-tv) .tv-item { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; margin-bottom: 8px;
  border-radius: 14px; background: #17120d; border: 1px solid rgba(var(--gold-rgb),.22); }
:where(.css-guest-tv) .tv-item b { display: block; font-weight: 600; }
:where(.css-guest-tv) .tv-item small { display: block; color: #BFB19C; font-size: 13px; margin-top: 2px; }
:where(.css-guest-tv) .tv-item .tv-tag { display: inline-block; color: #E6B8B8; }
:where(.css-guest-tv) .tv-btn { display: inline-block; flex: 0 0 auto; border: 0; border-radius: 999px; padding: 10px 16px; font-size: 15px; font-weight: 600; cursor: pointer;
  background: linear-gradient(135deg, #ecd6a3, var(--gold-sand) 55%, #c9a35c); color: var(--black-brown); text-decoration: none; }
:where(.css-guest-tv) .tv-btn:disabled { opacity: .6; }
:where(.css-guest-tv) .tv-m { color: #BFB19C; }
:where(.css-guest-tv) .tv-status { min-height: 1.4em; margin-top: 16px; }
:where(.css-guest-tv) .tv-status.ok { color: #9fd3a0; }
:where(.css-guest-tv) .tv-status.err,
:where(.css-guest-tv) .tv-err { color: #E6B8B8; }
@media (max-width: 480px) { :where(.css-guest-tv) .tv-item { flex-direction: column; align-items: stretch; } :where(.css-guest-tv) .tv-btn { text-align: center; } }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   @section guest/world-c
   Ancien fichier : pages/world/c.css
   Activée par css_use('guest/world-c') dans : world/c.php
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* Styles de public/world/c.php — sortis de la page (i102b). */

:root:where(.css-guest-world-c) { --gold2: var(--gold-light); --ink: var(--black-warm); }   /* --gold, --ivory, --pink, --aqua : tokens.css */
:where(.css-guest-world-c) *,
*:where(.css-guest-world-c) { box-sizing: border-box; }
:where(.css-guest-world-c) body {
  margin: 0; min-height: 100vh; background: radial-gradient(120% 80% at 50% 0%, #241a2e 0%, var(--ink) 60%);
  color: var(--ivory); font: 16px/1.5 Inter, system-ui, sans-serif;
  padding: max(20px, env(safe-area-inset-top)) 20px max(28px, env(safe-area-inset-bottom));
}
:where(.css-guest-world-c) main { max-width: 520px; margin: 0 auto; }
:where(.css-guest-world-c) h1 { font: 700 2rem/1.1 "Cormorant Garamond", Georgia, serif; margin: 8px 0 4px; }
:where(.css-guest-world-c) .lead { color: rgba(var(--ivory-rgb),.72); margin: 0 0 22px; }
:where(.css-guest-world-c) .btn {
  display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%;
  min-height: 56px; border-radius: 28px; border: 0; font: 600 1.05rem Inter, sans-serif; cursor: pointer;
}
:where(.css-guest-world-c) .btn-main { background: linear-gradient(135deg, var(--gold2), var(--gold)); color: #1a1206; box-shadow: 0 8px 28px rgba(var(--gold-rgb),.35); }
:where(.css-guest-world-c) .btn-soft { background: transparent; color: var(--ivory); border: 1px solid rgba(var(--ivory-rgb),.3); margin-top: 12px; }
:where(.css-guest-world-c) .btn:focus-visible { outline: 2px solid var(--gold2); outline-offset: 3px; }
:where(.css-guest-world-c) .btn[disabled] { opacity: .5; }
:where(.css-guest-world-c) input[type=file] { position: absolute; width: 1px; height: 1px; opacity: 0; }
:where(.css-guest-world-c) .stage { display: none; }
:where(.css-guest-world-c) .stage.on { display: block; }
:where(.css-guest-world-c) .tips { margin: 22px 0 0; padding: 0; list-style: none; color: rgba(var(--ivory-rgb),.72); font-size: .92rem; }
:where(.css-guest-world-c) .tips li { padding-inline-start: 26px; position: relative; margin: 6px 0; }
:where(.css-guest-world-c) .tips li::before { content: "✦"; position: absolute; inset-inline-start: 4px; color: var(--gold); }
:where(.css-guest-world-c) .preview {
  background: radial-gradient(circle at 50% 40%, #3a2c4a, #15101c); border-radius: 22px;
  display: grid; place-items: center; min-height: 260px; padding: 18px; margin-bottom: 16px;
}
:where(.css-guest-world-c) .preview canvas { max-width: 100%; max-height: 52vh; filter: drop-shadow(0 10px 18px rgba(0,0,0,.45)); }
:where(.css-guest-world-c) label.range { display: block; font-size: .92rem; color: rgba(var(--ivory-rgb),.8); margin: 4px 0 16px; }
:where(.css-guest-world-c) label.range input { width: 100%; accent-color: var(--gold); }
:where(.css-guest-world-c) .err { background: rgba(var(--pink-rgb),.12); border: 1px solid rgba(var(--pink-rgb),.45); border-radius: 16px; padding: 14px 16px; margin: 0 0 16px; }
:where(.css-guest-world-c) .picks { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; margin: 12px 0; }
:where(.css-guest-world-c) .picks button { min-height: 52px; border-radius: 14px; border: 1px solid rgba(var(--gold-rgb),.45); background: rgba(var(--gold-rgb),.08); color: var(--ivory); font: 600 1rem Inter, sans-serif; }
:where(.css-guest-world-c) .spinner { width: 54px; height: 54px; margin: 40px auto 16px; border-radius: 50%; border: 3px solid rgba(var(--gold-rgb),.2); border-top-color: var(--gold2); animation: spin 1s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
:where(.css-guest-world-c) .center { text-align: center; }
:where(.css-guest-world-c) .done-star { font-size: 64px; margin-top: 30px; }
@media (prefers-reduced-motion: reduce) { :where(.css-guest-world-c) .spinner { animation-duration: 3s; } }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   @section guest/world-index
   Ancien fichier : pages/world/index.css
   Activée par css_use('guest/world-index') dans : world/index.php
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* Styles de public/world/index.php — sortis de la page (i102b). */

html:where(.css-guest-world-index),
:where(.css-guest-world-index) body { margin: 0; height: 100%; background: var(--black-warm); overflow: hidden; }
:where(.css-guest-world-index) canvas { display: block; }
:where(.css-guest-world-index) #fs {
  position: fixed; inset-inline-end: 18px; bottom: 18px; z-index: 2;
  width: 48px; height: 48px; border-radius: 50%; border: 1px solid rgba(var(--gold-rgb),.6);
  background: rgba(var(--black-warm-rgb),.55); color: var(--gold-light); font-size: 22px; cursor: pointer;
  transition: opacity .4s;
}
:where(.css-guest-world-index) #fs:focus-visible { outline: 2px solid var(--gold-light); outline-offset: 3px; }
:where(.css-guest-world-index) body.idle { cursor: none; }
:where(.css-guest-world-index) body.idle #fs { opacity: 0; pointer-events: none; }

/* i109 : « Touchez l'écran pour les nourrir » — quelques secondes, puis s'efface. */
:where(.css-guest-world-index) canvas { touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
:where(.css-guest-world-index) #feed-hint {
  position: fixed; inset-inline-start: 50%; bottom: 22px; z-index: 2; transform: translate(-50%, 12px);
  padding: 10px 20px; border-radius: 999px; background: rgba(var(--black-warm-rgb),.55); color: var(--ivory);
  font: 600 clamp(15px, 2.2vh, 24px)/1.2 system-ui, sans-serif; letter-spacing: .02em;
  border: 1px solid rgba(var(--gold-rgb),.45); opacity: 0; pointer-events: none;
  transition: opacity .6s, transform .6s; white-space: nowrap;
}
:where(.css-guest-world-index) #feed-hint.on { opacity: 1; transform: translate(-50%, 0); }
@media (prefers-reduced-motion: reduce) { :where(.css-guest-world-index) #feed-hint { transition: none; } }

/* i322g — « Demander des informations » sous chaque formule + fenêtre modale */
:where(.css-guest-brand) .b-ask {margin-top:auto;align-self:flex-start;background:transparent;color:var(--accent);border:1px solid var(--accent);
  border-radius:999px;padding:11px 20px;font:inherit;font-size:.86rem;letter-spacing:.04em;cursor:pointer;text-decoration:none;line-height:1.2;text-align:center}
:where(.css-guest-brand) .b-ask:hover {background:var(--accent);color:var(--bg)}
:where(.css-guest-brand) .b-offre ul + .b-ask, :where(.css-guest-brand) .b-offre p + .b-ask {margin-top:8px}
.css-guest-brand .b-modal, .b-modal {border:1px solid var(--hair,rgba(242,232,216,.18));border-radius:20px;background:var(--surface,#14141c);color:var(--ink,#f2e8d8);
  padding:0;width:min(560px,calc(100vw - 32px));max-height:calc(100vh - 32px);overflow:auto;box-shadow:0 30px 90px rgba(0,0,0,.65)}
.b-modal::backdrop {background:rgba(5,5,10,.72);backdrop-filter:blur(3px)}
.b-modal .b-form {display:grid;gap:14px;padding:30px 28px 26px;position:relative}
.b-modal .b-form label {font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-dim,#b9ad9a);display:block;margin-bottom:6px}
.b-modal .b-form input, .b-modal .b-form textarea {width:100%;box-sizing:border-box;background:rgba(242,232,216,.04);border:1px solid var(--hair,rgba(242,232,216,.18));
  border-radius:10px;padding:12px 14px;color:inherit;font:inherit}
.b-modal .b-form input:focus, .b-modal .b-form textarea:focus {outline:none;border-color:var(--accent)}
.b-modal .b-form .duo {display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:560px){.b-modal .b-form .duo {grid-template-columns:1fr}}
.b-modal .b-form button[type=submit], .b-modal .b-form > button[data-ask-close]:not(.b-modal__x) {background:var(--accent);color:var(--bg,#0b0b12);border:0;border-radius:999px;padding:15px 30px;font:inherit;font-weight:500;cursor:pointer}
.b-modal .piege {position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.b-modal .b-note {margin:0;font-size:.78rem;color:var(--ink-dim,#b9ad9a)}
.b-modal__t {font-family:"Cormorant Garamond",serif;font-weight:500;font-size:1.7rem;margin:0;padding-inline-end:36px}
.b-modal__svc {margin:-6px 0 0;color:var(--accent);font-size:1rem}
.b-modal__svc:empty {display:none}
.b-modal__x {position:absolute;top:14px;inset-inline-end:16px;width:36px;height:36px;border-radius:50%;border:1px solid var(--hair,rgba(242,232,216,.18));background:transparent;color:inherit;font-size:1.4rem;line-height:1;cursor:pointer}
.b-modal .b-flash {border-radius:12px;padding:14px 18px;font-size:.94rem;line-height:1.6}
.b-modal .b-flash.ok {border:1px solid color-mix(in srgb,var(--accent) 60%,transparent)}
.b-modal .b-flash.ko {border:1px solid rgba(229,139,139,.5);color:#e5a0a0}
.b-modal .b-form .b-modal__x {position:absolute;top:14px;inset-inline-end:16px;width:36px;height:36px;padding:0;display:grid;place-items:center;border-radius:50%;
  border:1px solid var(--hair,rgba(242,232,216,.18));background:transparent;color:inherit;font-size:1.4rem;line-height:1;font-weight:400}
.b-modal .b-form .b-modal__x:hover {background:rgba(242,232,216,.08);filter:none}

/* i322h — adresse de la fête + verdict de zone */
.b-addr {display:block}
.b-zone {margin-top:10px;border-radius:12px;padding:12px 16px;font-size:.9rem;line-height:1.55;border:1px solid var(--hair,rgba(242,232,216,.18));color:var(--ink,#f2e8d8)}
.b-zone[hidden] {display:none}
.b-zone p {margin:0 0 6px}
.b-zone a {display:block;margin-top:6px;color:var(--accent);text-decoration:none;border-bottom:1px solid currentColor;width:fit-content;max-width:100%}
.b-zone.is-in {border-color:color-mix(in srgb,var(--accent) 60%,transparent)}
.b-zone.is-out {border-color:rgba(229,170,110,.6);background:rgba(229,170,110,.07)}
.b-zone.is-wait, .b-zone.is-none {color:var(--ink-dim,#b9ad9a)}