/* Reset minimal.
   Le preflight de Tailwind est desactive dans tailwind.config.js pour ne pas
   ecraser le CSS maison des autres pages. Cette page ne charge plus
   product-pages.css : elle doit donc porter elle-meme le box-sizing, sinon
   width:100% + padding deborde du conteneur. */
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0}
body{font-family:'Inter',system-ui,sans-serif}
h1,h2,h3,p,ul,ol,figure,dialog{margin:0}
ul,ol{list-style:none;padding:0}
/* Sans preflight, un <button> garde le fond gris clair du navigateur
   (buttonface). Sur fond sombre, le texte blanc devenait illisible et les
   puces mobiles apparaissaient toutes en gris clair. */
button{background:transparent;border:0;padding:0;cursor:pointer}
button,input,select,textarea{font:inherit;color:inherit}
input,select,textarea{background:transparent;border:0}
select{-webkit-appearance:none;appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%23a6b4c6' stroke-width='1.6' d='m1 1.5 5 5 5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;background-size:11px;padding-right:32px}
input[type=checkbox]{appearance:auto;-webkit-appearance:auto}
img,svg{display:block;max-width:100%}

/* Tool Center — le strict complement de Tailwind.
   Tout le reste de la page est en classes utilitaires. */

/* L'onglet actif de la sidebar : un liseré cyan a gauche plutot qu'une
   bordure complete, pour ne pas multiplier les cadres visibles. */
.tool-tab[data-active="1"]{
  background:rgba(32,213,239,.06);
  box-shadow:inset 2px 0 0 #20d5ef;
}
.tool-tab:focus-visible{outline:2px solid #20d5ef;outline-offset:2px}

/* Transition sobre a l'ouverture d'un outil : le contenu arrive, il ne
   glisse pas. Coupee si l'utilisateur demande moins de mouvement. */
.tool-panel{animation:toolIn .22s ease-out}
@keyframes toolIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){
  .tool-panel{animation:none}
  .animate-pulse{animation:none}
}

/* Le selecteur mobile ne doit pas montrer sa barre de defilement. */
.overflow-x-auto::-webkit-scrollbar{height:0}

dialog::backdrop{backdrop-filter:blur(2px)}