/* Pleine page (main.js setPanelFull, details.js setFull) : le panneau de lore ou la fiche « Détails » couvre tout l'écran,
   texte en colonne centrée. Boutons : pleine page ⇄ panneau, copie du lien « …/page ». */

/* Boutons communs : icône « agrandir » / « réduire » selon l'état, bulle « Lien copié ». */
#pfull .ico-off,#details .dt-full .ico-off{display:none;}
body.panel-full #pfull .ico-on,#details.full .dt-full .ico-on{display:none;}
body.panel-full #pfull .ico-off,#details.full .dt-full .ico-off{display:block;}
#plink,#details .dt-link{position:relative;}
#plink.copied::after,#details .dt-link.copied::after{content:attr(data-msg);position:absolute;top:calc(100% + 6px);right:0;white-space:nowrap;padding:5px 10px;
  background:rgba(3,8,16,.95);border:1px solid var(--gold-dim);color:var(--gold-hi);font-family:var(--ui);font-size:12px;letter-spacing:.08em;pointer-events:none;}

/* ---------- Panneau ---------- */
.ptools{gap:8px;}
.ptools>span{flex:1;}
body.panel-full #panel{left:0;width:100%;top:0;height:auto;bottom:0;z-index:45;border-left:0;border-top:0;box-shadow:none;transition:none;
  background:radial-gradient(ellipse at 50% 0%,#10203a 0%,var(--navy) 45%,#050c18 100%);animation:pf-in .35s cubic-bezier(.2,.85,.25,1);}
body.panel-full #panel::before{display:none;}
/* Colonne de lecture centrée, 780 px depuis le 11/11 (les fiches sont écrites pour ~460 px : bannières et cartes s'élargissent avec elle). */
body.panel-full #pbody{padding-left:max(0px,calc((100% - 780px) / 2));padding-right:max(0px,calc((100% - 780px) / 2));}
body.panel-full #pbody .splash{height:clamp(230px,38vh,420px);}
body.panel-full #pbody .phead{padding-left:40px;padding-right:40px;}
body.panel-full .ptools{left:max(14px,calc((100% - 780px) / 2 - 56px));right:max(14px,calc((100% - 780px) / 2 - 56px));}
@keyframes pf-in{from{opacity:.4;transform:scale(.99);}to{opacity:1;transform:none;}}
@media (max-width:860px){
  body.panel-full #pbody .phead{padding-left:20px;padding-right:20px;}
  body.panel-full .ptools{left:14px;right:14px;}
}

/* ---------- Fiche « Détails » ---------- */
/* Boutons à gauche de la croix, collés en haut au défilement comme elle ; la barre d'onglets leur laisse la place. */
#details .dt-xtools{position:sticky;top:9px;float:right;margin:9px 57px -47px 0;z-index:3;display:flex;gap:6px;}
#details .dt-xtools button{width:38px;height:38px;display:grid;place-items:center;padding:0;border:1px solid var(--gold-dim);background:rgba(3,8,16,.8);color:var(--gold-hi);cursor:pointer;}
#details .dt-xtools button:hover{border-color:var(--gold);color:#fff;}
#details .dt-xtools button[hidden]{display:none;}
#details .dt-xtools svg{width:16px;height:16px;fill:currentColor;}
#details .dt-sheet .dt-navbar{padding-right:100px;}
#details.full .dt-sheet .dt-navbar{padding-right:max(146px,calc((100% - 900px) / 2));padding-left:max(8px,calc((100% - 900px) / 2));}

#details.full .dt-sheet{width:100%;border-left:0;box-shadow:none;}
#details.full .dt-back{background:#03070e;}
#details.full .dt-hero{height:min(58vh,600px);}
/* Colonne centrée de 900 px : marges internes calculées sur la largeur de la fiche (même rythme que la fiche latérale). */
#details.full .dt-hero-txt,#details.full .dt-sec{padding-left:max(34px,calc((100% - 900px) / 2 + 34px));padding-right:max(34px,calc((100% - 900px) / 2 + 34px));}
#details.full .dt-lead,#details.full .dt-zone-sep{margin-left:max(34px,calc((100% - 900px) / 2 + 34px));margin-right:max(34px,calc((100% - 900px) / 2 + 34px));}
@media (max-width:700px){
  #details .dt-xtools{margin:9px 50px -43px 0;}
  #details .dt-xtools button{width:34px;height:34px;}
  #details .dt-sheet .dt-navbar{padding-right:90px;}
  #details.full .dt-sheet .dt-navbar{padding-right:130px;padding-left:0;}
  #details.full .dt-hero-txt,#details.full .dt-sec{padding-left:16px;padding-right:16px;}
  #details.full .dt-lead,#details.full .dt-zone-sep{margin-left:16px;margin-right:16px;}
}

/* Bannières de la colonne : bords fondus dans le fond de la page. */
body.panel-full #pbody .splash,body.panel-full #pbody .lb-hero,body.panel-full #pbody .ihero{-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);}
