/* Bascuñana · le partage (27/10/2026), d'après la « rangée B » du #PIC : la couleur du réseau dans un disque,
   le libellé à l'encre du site. Les couleurs de marque des réseaux ne se modifient pas ; tout le reste puise
   dans la charte « marbre et lave » et suit la nuit « insomnie ». */

.bsc-partage, .bsc-p-pop, .bsc-p-colonne, .bsc-p-bouton, .bsc-p-volet, .bsc-p-avis {
  --p-encre: var(--encre); --p-doux: var(--doux); --p-filet: var(--filet); --p-surface: var(--marbre);
  --p-carte: var(--velin); --p-survol: var(--velin); --p-lave: var(--lave);
  --p-ombre: 0 18px 40px rgba(31, 28, 25, .16), 0 2px 6px rgba(31, 28, 25, .08);
}
html.insomnie .bsc-partage, html.insomnie .bsc-p-pop, html.insomnie .bsc-p-colonne, html.insomnie .bsc-p-volet { --p-ombre: 0 18px 40px rgba(0, 0, 0, .5), 0 2px 6px rgba(0, 0, 0, .35); }

/* La rangée sous le texte */
.bsc-partage { margin: 3rem 0 2.4rem; padding: 26px 0; border-top: 1px solid var(--p-filet); border-bottom: 1px solid var(--p-filet); }
html body .bsc-partage .bsc-partage-label { font-family: var(--mono); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--p-doux); margin: 0 0 12px !important; }
.bsc-partage .bsc-partage-btn { display: inline-block; margin: 0 14px 8px 0; font-family: var(--mono); font-size: 13px; color: var(--p-encre); }
.bsc-partage .bsc-partage-donnees { display: none; }
.bsc-partage.bsc-p-pret { display: grid; grid-template-columns: repeat(auto-fill, minmax(146px, 1fr)); gap: 10px; }
.bsc-partage.bsc-p-pret .bsc-partage-label { display: none; }
html body .bsc-partage p, html body .bsc-p-volet p, html body .bsc-p-pop p { margin: 0 !important; padding: 0; }
.bsc-p-tete { grid-column: 1 / -1; order: 0; display: flex; flex-direction: column; gap: 6px; margin-bottom: 12px; }
.bsc-p-oeil { display: flex; align-items: center; gap: 10px; margin: 0; font: 500 12px/1.2 var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--p-lave); }
.bsc-p-point { width: 8px; height: 8px; border-radius: 999px; background: var(--p-lave); flex-shrink: 0; }
.bsc-p-ti { font-family: var(--titre); }
.bsc-p-titre { margin: 0; font: 600 26px/1.15 var(--titre); color: var(--p-encre); }
.bsc-p-note { margin: 0; font: 400 15px/1.5 var(--lecture); color: var(--p-doux); }
.bsc-partage.bsc-p-pret .bsc-partage-btn { display: flex; align-items: center; gap: 10px; height: 46px; min-width: 0; box-sizing: border-box; margin: 0; padding: 0 12px 0 8px;
  border: 1px solid var(--p-filet); border-radius: 999px; background: var(--p-surface); color: var(--p-encre); font: 500 12px/1 var(--mono); letter-spacing: .06em; text-transform: uppercase;
  text-decoration: none; white-space: nowrap; cursor: pointer; transition: border-color .15s, transform .15s, box-shadow .15s; }
.bsc-partage.bsc-p-pret .bsc-partage-btn:hover { border-color: var(--bsc-p-marque, var(--p-doux)); transform: translateY(-2px); box-shadow: 0 6px 16px rgba(31, 28, 25, .12); color: var(--p-encre); }
.bsc-partage .bsc-partage-btn:focus-visible, .bsc-p-colonne button:focus-visible, .bsc-p-pop button:focus-visible, .bsc-p-volet button:focus-visible, .bsc-p-bouton:focus-visible { outline: 2px solid var(--p-lave); outline-offset: 3px; }
.bsc-p-lab { overflow: hidden; text-overflow: ellipsis; }
.bsc-p-car { margin-left: auto; display: flex; color: var(--p-doux); }
.bsc-p-disc { width: 30px; height: 30px; flex-shrink: 0; border-radius: 999px; display: flex; align-items: center; justify-content: center; color: #fff; }
.bsc-p-d-x { background: var(--p-encre); color: var(--papier); }
.bsc-p-d-email { background: var(--penser); color: #fff; }
html.insomnie .bsc-p-d-email { color: #1B1815; }
.bsc-p-d-cp { background: var(--p-carte); color: var(--p-encre); }

/* Les deux choix (X, Copier) et les autres réseaux */
.bsc-p-pop { position: fixed; z-index: 99995; width: 370px; max-width: calc(100vw - 24px); max-height: calc(100vh - 24px); overflow: auto; box-sizing: border-box; padding: 16px; border-radius: 14px; background: var(--p-surface); border: 1px solid var(--p-filet);
  box-shadow: var(--p-ombre); display: flex; flex-direction: column; gap: 10px; font: 400 15px/1.45 var(--lecture); color: var(--p-encre); }
.bsc-p-poph { display: flex; align-items: center; gap: 8px; font-size: 21px; font-weight: 600; }
.bsc-p-fermer { margin-left: auto; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 999px; background: transparent; color: var(--p-doux); display: flex; align-items: center; justify-content: center; cursor: pointer; }
.bsc-p-xo, .bsc-p-xf { -webkit-appearance: none; appearance: none; margin: 0; display: flex; flex-direction: column; gap: 8px; width: 100%; box-sizing: border-box; text-align: left; padding: 12px; border-radius: 12px;
  border: 1px solid var(--p-filet); background: var(--p-surface); color: var(--p-encre); font: 400 15px/1.45 var(--lecture); text-transform: none; letter-spacing: normal; cursor: pointer; transition: border-color .15s, background .15s, transform .15s; }
.bsc-p-xf { padding: 14px; gap: 10px; border: 1.5px solid var(--p-lave); }
.bsc-p-xo:hover { border-color: var(--p-doux); background: var(--p-survol); }
.bsc-p-xf:hover { background: var(--p-survol); transform: translateY(-1px); }
.bsc-p-xh { display: flex; align-items: center; gap: 10px; width: 100%; }
.bsc-p-xh .bsc-p-disc { width: 28px; height: 28px; }
.bsc-p-xt { font: 600 15px/1.2 var(--mono); letter-spacing: .04em; text-transform: uppercase; font-size: 12.5px; }
.bsc-p-xf .bsc-p-xt { font: 600 21px/1.1 var(--titre); letter-spacing: 0; text-transform: none; }
.bsc-p-tag { margin-left: auto; padding: 3px 8px; border-radius: 999px; border: 1px solid var(--p-filet); font: 400 11px/1.3 var(--mono); color: var(--p-doux); white-space: nowrap; }
.bsc-p-tagc { border: 0; background: var(--p-lave); color: var(--papier); font-weight: 500; }
.bsc-p-xd { font-size: 13.5px; line-height: 1.5; color: var(--p-doux); }
.bsc-p-xd.bsc-p-encre { color: var(--p-encre); }
.bsc-p-apercu { position: relative; display: flex; flex-direction: column; gap: 6px; height: 132px; overflow: hidden; box-sizing: border-box; padding: 10px 12px; border-radius: 8px; background: var(--p-carte); font-size: 12.5px; line-height: 1.5; color: var(--p-encre); }
.bsc-p-apercu b { font: 600 17px/1.15 var(--titre); }
.bsc-p-apercu i { position: absolute; left: 0; right: 0; bottom: 0; height: 46px; background: linear-gradient(to bottom, transparent, var(--p-carte)); }
.bsc-p-xs { font-size: 12px; color: var(--p-doux); }
.bsc-p-plus { width: 220px; padding: 8px; gap: 2px; }
.bsc-p-pl { display: flex; align-items: center; gap: 10px; height: 44px; padding: 0 10px; margin: 0; border: 0; border-radius: 10px; background: transparent; color: var(--p-encre); font: 500 12.5px/1 var(--mono); letter-spacing: .06em; text-transform: uppercase; text-align: left; cursor: pointer; }
.bsc-p-pl:hover { background: var(--p-survol); }
.bsc-p-pl .bsc-p-disc { width: 28px; height: 28px; }

/* La colonne flottante (ordinateur, à droite du texte) */
.bsc-p-colonne { position: fixed; right: 32px; top: 50%; z-index: 99990; width: 64px; box-sizing: border-box; padding: 10px; border-radius: 999px; background: var(--p-surface); border: 1px solid var(--p-filet); box-shadow: var(--p-ombre);
  display: flex; flex-direction: column; align-items: center; gap: 10px; transform: translate(120px, -50%); opacity: 0; pointer-events: none; transition: transform .35s cubic-bezier(.2, .8, .2, 1), opacity .25s; }
.bsc-p-colonne.bsc-p-montre { transform: translate(0, -50%); opacity: 1; pointer-events: auto; }
.bsc-p-ctete { width: 44px; height: 44px; border-radius: 999px; background: var(--p-lave); color: var(--papier); display: flex; align-items: center; justify-content: center; }
.bsc-p-csep { width: 28px; height: 1px; background: var(--p-filet); }
.bsc-p-ci { position: relative; width: 44px; height: 44px; padding: 0; margin: 0; border: 0; border-radius: 999px; background: transparent; color: var(--p-encre); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: transform .15s; }
.bsc-p-ci:hover { transform: scale(1.08); }
.bsc-p-ci .bsc-p-disc { width: 44px; height: 44px; }
.bsc-p-co { border: 1px solid var(--p-filet); }
.bsc-p-ccar { position: absolute; right: -3px; bottom: -3px; width: 19px; height: 19px; box-sizing: border-box; border-radius: 999px; border: 2px solid var(--p-surface); background: var(--p-lave); color: var(--papier); display: flex; align-items: center; justify-content: center; }

/* Le bouton et le volet (téléphone) */
.bsc-p-bouton { position: fixed; right: 16px; bottom: calc(20px + env(safe-area-inset-bottom, 0px)); z-index: 99990; height: 54px; box-sizing: border-box; padding: 0 20px 0 18px; margin: 0; border: 0; border-radius: 999px;
  background: var(--lave); color: var(--papier); display: flex; align-items: center; gap: 10px; font: 500 13px/1 var(--mono); letter-spacing: .1em; text-transform: uppercase; box-shadow: var(--p-ombre); cursor: pointer;
  transform: translateY(140%); opacity: 0; pointer-events: none; transition: transform .3s cubic-bezier(.2, .8, .2, 1), opacity .2s; }
.bsc-p-bouton.bsc-p-montre { transform: none; opacity: 1; pointer-events: auto; }
.bsc-p-bouton.bsc-p-montre.bsc-p-loin { transform: translateY(140%); opacity: 0; pointer-events: none; }
.bsc-p-voletcadre { position: fixed; inset: 0; z-index: 99996; }
.bsc-p-voile { position: absolute; inset: 0; background: rgba(27, 24, 21, .55); opacity: 0; transition: opacity .25s; }
.bsc-p-volet { position: absolute; left: 0; right: 0; bottom: 0; max-width: 560px; max-height: 88vh; margin: 0 auto; overflow: auto; box-sizing: border-box; padding: 10px 20px calc(24px + env(safe-area-inset-bottom, 0px));
  border-radius: 22px 22px 0 0; background: var(--p-surface); box-shadow: var(--p-ombre); display: flex; flex-direction: column; gap: 14px; font: 400 15px/1.45 var(--lecture); color: var(--p-encre); transform: translateY(100%); transition: transform .3s cubic-bezier(.2, .8, .2, 1); }
.bsc-p-ouvert .bsc-p-voile { opacity: 1; }
.bsc-p-ouvert .bsc-p-volet { transform: none; }
.bsc-p-poignee { align-self: center; width: 40px; height: 5px; border-radius: 999px; background: var(--p-filet); }
.bsc-p-volet .bsc-p-titre { font-size: 22px; }
.bsc-p-grille, .bsc-p-panneau { display: flex; flex-direction: column; gap: 18px; }
.bsc-p-panneau { gap: 12px; }
.bsc-p-grille[hidden], .bsc-p-panneau[hidden] { display: none !important; }
.bsc-p-natif { height: 52px; margin: 0; border: 0; border-radius: 12px; background: var(--penser); color: #fff; display: flex; align-items: center; justify-content: center; gap: 10px; font: 500 15px/1 var(--lecture); cursor: pointer; }
html.insomnie .bsc-p-natif { color: #1B1815; }
.bsc-p-tuiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px 6px; }
.bsc-p-tuile { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 4px 0; margin: 0; border: 0; background: transparent; color: var(--p-encre); font: 400 11.5px/1.2 var(--mono); letter-spacing: .02em; cursor: pointer; }
.bsc-p-tuile .bsc-p-disc { width: 52px; height: 52px; }
.bsc-p-rang2 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.bsc-p-out { height: 48px; margin: 0; padding: 0 6px; border: 1px solid var(--p-filet); border-radius: 10px; background: transparent; color: var(--p-encre); display: flex; align-items: center; justify-content: center; gap: 7px; font: 500 11.5px/1.1 var(--mono); letter-spacing: .02em; text-align: center; cursor: pointer; }
.bsc-p-retour { align-self: flex-start; display: flex; align-items: center; gap: 8px; height: 40px; padding: 0 10px 0 4px; margin: 0; border: 0; background: transparent; color: var(--p-doux); font: 400 14px/1 var(--lecture); cursor: pointer; }
.bsc-p-pt { margin: 0; font-size: 22px; font-weight: 600; }
html.bsc-p-fige { overflow: hidden; }

/* L'avis « copié » (en bas, au centre ; rien ne le recouvre) */
.bsc-p-avis { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); z-index: 999999; max-width: min(520px, calc(100vw - 32px)); box-sizing: border-box; background: var(--bistre, #1B1815); color: #F2ECE0;
  padding: 14px 18px; border-radius: 10px; box-shadow: 0 6px 24px rgba(0, 0, 0, .3); font: 400 15px/1.5 var(--lecture); text-align: center; }
html.insomnie .bsc-p-avis { background: #F2ECE0; color: #1B1815; }

/* Le bandeau « Partager cette page » des pages graphiques */
.bsc-partage-bande { background: var(--papier); padding: clamp(28px, 5vw, 56px) 0 clamp(20px, 3vw, 36px); }
.bsc-partage-bande .bsc-partage { margin: 0; }

@media (prefers-color-scheme: dark) {
  html:not(.jour) .bsc-p-d-email, html:not(.jour) .bsc-p-natif { color: #1B1815; }
  html:not(.jour) .bsc-p-avis { background: #F2ECE0; color: #1B1815; }
}
@media (max-width: 640px) {
  .bsc-partage.bsc-p-pret { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bsc-p-titre { font-size: 23px; }
}
@media (prefers-reduced-motion: reduce) {
  .bsc-p-colonne, .bsc-p-bouton, .bsc-p-volet, .bsc-p-voile, .bsc-partage .bsc-partage-btn, .bsc-p-xf, .bsc-p-ci { transition: none !important; }
}
@media print { .bsc-partage, .bsc-partage-bande, .bsc-p-colonne, .bsc-p-bouton { display: none !important; } }