/* Corrections ciblées : les fonds, couleurs et animations restent propres aux pages. */
html .retour-blog {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  margin: 12px 0;
  padding: 6px;
  text-decoration: none;
}
html .retour-blog img {
  position: static;
  float: none;
  margin: 0;
  width: 50px;
  height: 35px;
}
html .retour-blog p { margin: 0; overflow: visible; }
html a:focus-visible, html summary:focus-visible,
html input:focus-visible, html button:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
}
html[data-page] img { max-width: 100%; }
html[data-page] body { overflow-wrap: anywhere; }
html[data-page] .dropdown summary { display: block; list-style: none; cursor: pointer; }
html[data-page] .dropdown summary::-webkit-details-marker { display: none; }
html[data-page] .dropdown[open] .dropdown-content { display: block; }
html[data-page] .dropdown-content { z-index: 20; }
html[data-page] .dropdown-content [aria-disabled] {
  display: block;
  padding: 12px 16px;
  opacity: .7;
}
html[data-page="accueil"] .chat-input input,
html[data-page="accueil"] .user-settings input { min-width: 0; }
html[data-page="accueil"] .chat-messages { overflow-wrap: anywhere; }
html[data-page="accueil"] .chat-status { margin: 8px 0; font-size: 14px; }
html[data-page="accueil"] .chat-status[data-error="true"] { color: #79132b; }
html[data-page="accueil"] .chat-input button:disabled { opacity: .6; cursor: wait; }
html[data-page="sommaire"] body { height: auto; min-height: 100vh; }
html[data-page="sommaire"] .mood-box img { float: none; }
html[data-page="article"] .ascii-cascade { overflow: hidden; }
html[data-page="pics"] .retour-blog { color: #f7e9c7; text-shadow: 0 1px 3px #000; }
html[data-page="galerie"] .retour-blog { color: #fff; }
@media (min-width: 1101px) {
  html[data-page="accueil"] body > p { max-width: calc(100% - 380px); }
}
html[data-page="galerie"] .cigarette {
  display: block;
  position: static !important;
  margin-left: auto;
}
@media (max-width: 1100px) {
  html[data-page="accueil"] body {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    justify-items: center;
    gap: 24px;
    padding: 24px 16px;
  }
  html[data-page="accueil"] body > .animated-block {
    order: 0;
    box-sizing: border-box;
    width: min(90%, 580px) !important;
    margin: 10px auto !important;
  }
  html[data-page="accueil"] body > center { order: 1; }
  html[data-page="accueil"] .container { order: 2; margin: 0; }
  html[data-page="accueil"] .info-block {
    order: 3;
    position: relative;
    top: auto;
    left: auto;
    width: min(200px, calc(100% - 80px));
    margin: 30px 35px;
  }
  html[data-page="accueil"] .chatbox {
    order: 4;
    position: static;
    box-sizing: border-box;
    width: min(100%, 380px);
  }
  html[data-page="accueil"] body > a { order: 5; }
  html[data-page="accueil"] body > p { order: 6; max-width: 600px; text-align: center; }
  html[data-page="accueil"] body > br { display: none; }
  html[data-page="accueil"] .hidden-iframe { position: absolute; }
  html[data-page="sommaire"] .mood-box {
    position: relative;
    bottom: auto;
    left: auto;
    box-sizing: border-box;
    max-width: 90%;
    margin: 20px auto 30px;
    z-index: auto;
  }
  html[data-page="sommaire"] .mois-box { width: min(94%, 650px); }
  html[data-page="sommaire"] .mois-box ul { padding: 0 6px; }
  html[data-page="sommaire"] .mois-box p { overflow: visible; overflow-wrap: anywhere; }
  html[data-page="article"] .video-box {
    position: relative;
    bottom: auto;
    right: auto;
    box-sizing: border-box;
    width: min(360px, calc(100% - 32px));
    margin: 90px auto 30px;
  }
  html[data-page="article"] .video-frame-wrapper { max-width: 100%; }
  html[data-page="article"] .floating-sticker { position: relative; display: block; margin: 20px auto; top: auto; right: auto; }
}
@media (max-width: 600px) {
  html[data-page] body { overflow-wrap: anywhere; }
  html[data-page] .dropdown-content { position: static; min-width: 0; }
  html[data-page="sommaire"] h1 font { font-size: clamp(30px, 9vw, 48px); }
  html[data-page="article"] .text-box { box-sizing: border-box; width: 100%; }
  html[data-page="article"] blockquote { margin-left: 12px; margin-right: 12px; }
  html[data-page="article"] img { height: auto; }
  html[data-page="article"] .retour-blog img { height: 35px; }
  html[data-page="article"] iframe:not(.hidden-iframe),
  html[data-page="article"] video { max-width: 100%; }
  html[data-page="article"] .ascii-cascade { overflow: hidden; }
  html[data-page="galerie"] p img { width: min(100%, 440px) !important; height: auto; }
}

/* Téléphones et tablettes : les cadres se replient sans masquer le contenu. */
@media (max-width: 1100px) {
  html[data-page] { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
  html[data-page] body {
    padding-bottom: max(64px, calc(env(safe-area-inset-bottom) + 48px));
  }
  html[data-page] img, html[data-page] video {
    max-width: 100%;
    height: auto;
  }
  html[data-page] .retour-blog img { width: 50px; height: 35px; }
  html[data-page] .dropdown,
  html[data-page] .dropdown-content { max-width: 100%; }
  html[data-page] .dropdown-content a,
  html[data-page="interets"] li a {
    box-sizing: border-box;
    display: inline-block;
    min-height: 44px;
    padding: 10px 6px;
    line-height: 1.5;
  }
  html[data-page] .dropdown-content a { display: block; }
  html[data-page="accueil"] body {
    padding-left: max(16px, env(safe-area-inset-left));
    padding-right: max(16px, env(safe-area-inset-right));
  }
  html[data-page="accueil"] body > * { min-width: 0; }
  html[data-page="accueil"] h1 { font-size: clamp(24px, 6vw, 32px); }
  html[data-page="accueil"] .chatbox { margin: 0; }
  html[data-page="accueil"] .chatbox iframe { display: block; max-width: 100%; }
  html[data-page="sommaire"] .mois-box {
    width: min(100%, 650px);
    padding: 14px clamp(8px, 3vw, 20px);
  }
  html[data-page="sommaire"] .mois-box ul { font-size: 16px; line-height: 1.6; }
  html[data-page="sommaire"] .mois-box li { margin-block: 16px; }
  html[data-page="sommaire"] .mois-box a { padding-block: 5px; }
  html[data-page="sommaire"] .gif-bottom-right {
    position: static;
    float: none;
    display: block;
    width: min(75%, 320px);
    margin: 24px auto;
  }
  html[data-page="article"] body,
  html[data-page="interets"] body {
    font-size: 17px;
    line-height: 1.55;
  }
  html[data-page="article"] .text-box {
    box-sizing: border-box;
    width: min(100%, 760px);
    margin-inline: auto;
  }
  html[data-page="article"] .text-box > div {
    padding: clamp(10px, 2.5vw, 20px) !important;
  }
  html[data-page="article"] blockquote { margin-inline: clamp(8px, 2vw, 20px); }
  html[data-page="article"] iframe:not(.hidden-iframe) {
    box-sizing: border-box;
    max-width: 100%;
  }
  html[data-page="article"] iframe[src*="youtube.com/embed"] {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
  }
  html[data-page="article"] audio { max-width: 100%; }
  html[data-page="article"] pre { max-width: 100%; overflow-x: auto; }
  html[data-page="article"] .ascii-cascade pre { overflow: hidden; }
  html[data-page="interets"] ul { padding-inline-start: 24px; }
  html[data-page="galerie"] p img {
    width: min(100%, 440px) !important;
    height: auto;
    margin-block: 8px;
  }
}

/* Les effets au survol ne doivent pas déplacer les cartes après un toucher. */
@media (hover: none) {
  html[data-page] .info-block:hover,
  html[data-page] .dropbtn:hover { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  html[data-page] *, html[data-page] *::before, html[data-page] *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}