/* Bulletin de la Commu — feuille sortie de la page pour être mise en cache (30 jours)
   au lieu d'être renvoyée à chaque visite dans le HTML. */
    /* ==== Le Bulletin de la Commu — recréation fidèle du handoff (écrans 2a/2b) ==== */
    *{ margin:0; padding:0; box-sizing:border-box; }
    body{ background:#141416; color:#f2efe8; font-family:'Archivo',sans-serif; -webkit-font-smoothing:antialiased; }
    a{ color:inherit; text-decoration:none; }
    button{ font:inherit; cursor:pointer; }
    .courier{ font-family:'Courier Prime',monospace; }

    /* Header/footer : ceux du site (style.css). La barre du site n'est plus fixe
       (le bandeau méta la coiffe et prend le relais) : plus rien à compenser. */
    body{ padding-top:0; }
    .topbar{ position:static; }

    /* Bureau sombre + feuille */
    .desk{ background:radial-gradient(1100px 520px at 50% 0%, #1e1e22, #141416); padding:clamp(26px,5vw,54px) clamp(14px,4vw,62px) clamp(90px,10vw,110px); }
    .sheet{ max-width:1020px; margin:0 auto; background:#f2ecdd; color:#221d14; border-radius:3px;
      box-shadow:0 30px 80px rgba(0,0,0,.55); padding:clamp(18px,3.4vw,34px) clamp(16px,3.8vw,38px) clamp(22px,3.4vw,34px); }
    .sheet__meta{ display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap;
      font-family:'Courier Prime',monospace; font-size:11px; letter-spacing:.12em; color:#5c5343; margin-bottom:16px; }

    .sheet__grid{ display:grid; grid-template-columns:1fr 320px; gap:38px; }
    @media (max-width:880px){ .sheet__grid{ grid-template-columns:1fr; gap:26px; } }

    .masthead{ font-weight:900; font-size:clamp(38px,7vw,72px); line-height:.94; text-transform:uppercase; letter-spacing:-.01em;
      border-top:6px solid #221d14; border-bottom:6px solid #221d14; padding:14px 0 16px; margin-bottom:14px; }
    @media (max-width:600px){ .masthead{ border-width:4px; } }
    .chapo{ font-family:'Courier Prime',monospace; font-size:13.5px; line-height:1.6; color:#3d362a; margin-bottom:12px; }
    .edito{ font-size:15px; line-height:1.65; margin-bottom:22px; }

    /* Bulletin d'adhésion — « l'affichette arrachée » (v2) : papier déchiré scotché sur la feuille */
    .join{ position:relative; margin:24px 0 22px; transform:rotate(-1.6deg);
      filter:drop-shadow(4px 6px 0 rgba(34,29,20,.18)); transition:transform .18s; }
    .join:hover{ transform:rotate(-.4deg); }
    .join__paper{ background:#fffdf4; padding:22px 24px 20px; text-align:center;
      clip-path:polygon(1.2% 4%, 6% 1%, 13% 3.4%, 21% .6%, 30% 2.8%, 39% .4%, 48% 3%, 57% .8%, 66% 3.2%, 75% .6%, 84% 2.6%, 92% .4%, 98.8% 3%, 99.6% 12%, 98% 24%, 99.8% 37%, 98.2% 52%, 99.6% 66%, 98% 80%, 99.4% 91%, 98.6% 97%, 92% 99.6%, 83% 97.2%, 73% 99.4%, 62% 97%, 51% 99.6%, 40% 97.4%, 29% 99.2%, 19% 97%, 10% 99.4%, 3% 97.6%, .4% 90%, 1.8% 78%, .2% 64%, 1.6% 50%, .4% 36%, 2% 22%, .6% 11%); }
    .join__sur{ font-family:'Courier Prime',monospace; font-size:11px; letter-spacing:.12em; color:#5c5343; }
    .join__t{ font-weight:900; font-size:20px; margin:6px 0 8px; }
    .join__sub{ font-family:'Courier Prime',monospace; font-size:12px; color:#3d362a; margin-bottom:14px; }
    .join__btns{ display:flex; justify-content:center; gap:9px; flex-wrap:wrap; }
    .join__tape{ position:absolute; background:rgba(212,200,165,.78);
      border-left:1px dashed rgba(34,29,20,.2); border-right:1px dashed rgba(34,29,20,.2); }
    .join__tape--l{ top:-12px; left:8%; width:96px; height:26px; transform:rotate(-4deg); }
    .join__tape--r{ top:-10px; right:10%; width:82px; height:24px; transform:rotate(5deg); background:rgba(212,200,165,.72); }
    .jbtn{ display:inline-flex; align-items:center; gap:8px; font-weight:800; font-size:13px; padding:9px 18px; border-radius:4px; transition:.15s; }
    .jbtn--full{ background:#221d14; color:#f2ecdd; border:2px solid #221d14; }
    .jbtn--full:hover{ background:#40d971; border-color:#40d971; color:#0c130e; }
    .jbtn--line{ border:2px solid #221d14; color:#221d14; }
    .jbtn--line:hover{ background:#221d14; color:#f2ecdd; }
    @media (max-width:600px){ .jbtn{ width:100%; justify-content:center; } }

    /* Vient de paraître */
    .fresh{ background:#fffdf4; border:1.5px solid #221d14; box-shadow:5px 5px 0 rgba(34,29,20,.16); padding:16px 18px;
      display:flex; align-items:center; gap:16px; }
    .fresh__txt{ min-width:0; flex:1; }
    .fresh__label{ font-family:'Courier Prime',monospace; font-size:11px; font-weight:700; letter-spacing:.1em; color:#1c5c33; }
    .fresh__title{ font-weight:900; font-size:18px; margin:3px 0 4px; }
    .fresh__meta{ font-family:'Courier Prime',monospace; font-size:12px; color:#3d362a; }
    .pbtn{ display:inline-flex; align-items:center; gap:8px; background:#221d14; color:#f2ecdd; font-weight:900; font-size:12.5px;
      padding:11px 16px; border:none; border-radius:3px; transition:.15s; flex:none; }
    .pbtn:hover{ background:#40d971; color:#0c130e; }

    /* Colonne droite : polaroid + tampon + ours */
    .aside{ display:flex; flex-direction:column; gap:22px; }
    .pola{ background:#fffdf4; border:1px solid rgba(34,29,20,.25); padding:12px 12px 14px; transform:rotate(-3deg);
      box-shadow:4px 6px 0 rgba(34,29,20,.13); position:relative; align-self:center; width:min(100%,270px); }
    .pola::before{ content:''; position:absolute; top:-12px; left:50%; transform:translateX(-50%) rotate(2deg);
      width:92px; height:24px; background:rgba(242,236,221,.6); border:1px solid rgba(34,29,20,.12); }
    .pola img{ width:100%; display:block; filter:grayscale(1) contrast(1.12); }
    .pola figcaption{ font-family:'Courier Prime',monospace; font-size:11px; color:#5c5343; margin-top:9px; text-align:center; }
    .stamp{ align-self:center; border:3px solid #40d971; color:#1c5c33; border-radius:6px; padding:8px 16px; transform:rotate(-8deg);
      font-weight:900; letter-spacing:.08em; font-size:14px; text-align:center; }
    .stamp small{ display:block; font-family:'Courier Prime',monospace; font-weight:400; font-size:10px; letter-spacing:.04em; margin-top:2px; }
    .ours{ font-family:'Courier Prime',monospace; font-size:11px; line-height:1.8; color:#5c5343; border-top:1px solid rgba(34,29,20,.25); padding-top:12px; }

    /* Top 3 */
    .top3{ background:#ece4cf; border-top:2px solid #221d14; margin:26px calc(clamp(16px,3.8vw,38px) * -1) 0;
      padding:20px clamp(16px,3.8vw,38px) 24px; }
    .top3__head{ display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; margin-bottom:16px; }
    .top3__t{ font-weight:900; font-size:19px; }
    .top3__note{ font-family:'Courier Prime',monospace; font-size:11px; color:#5c5343; }
    .top3__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
    @media (max-width:880px){ .top3__grid{ grid-template-columns:1fr; } }
    .t3{ background:#fffdf4; border:1.5px solid #221d14; box-shadow:4px 4px 0 rgba(34,29,20,.16); padding:14px 16px; }
    .t3__rank{ font-weight:900; font-size:42px; line-height:1; color:#40d971; -webkit-text-stroke:1.5px #221d14; }
    .t3__label{ font-family:'Courier Prime',monospace; font-size:10px; font-weight:700; letter-spacing:.1em; color:#1c5c33; margin:6px 0 2px; }
    .t3__title{ font-weight:900; font-size:16.5px; }
    .t3__tag{ font-family:'Courier Prime',monospace; font-size:12px; color:#3d362a; margin:4px 0 10px; }
    .t3__row{ display:flex; align-items:center; gap:10px; }
    .t3__row img{ width:56px; height:56px; object-fit:cover; filter:grayscale(1) contrast(1.12); border:1px solid rgba(34,29,20,.3); flex:none; }
    .t3__foot{ display:flex; flex-direction:column; gap:4px; font-size:12px; }
    .tplay{ background:none; border:none; padding:0; text-align:left; font-weight:900; font-size:12.5px; color:#1c5c33; }
    .tplay:hover{ color:#0c130e; text-decoration:underline; }
    .alink{ font-family:'Courier Prime',monospace; font-size:11.5px; color:#2743b8; text-decoration:underline; }

    /* Petites annonces */
    .ads__head{ background:#221d14; color:#f2ecdd; margin:0 calc(clamp(16px,3.8vw,38px) * -1);
      padding:14px clamp(16px,3.8vw,38px); display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; }
    .ads__t{ font-weight:900; font-size:19px; }
    .ads{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; padding-top:20px; }
    @media (max-width:880px){ .ads{ grid-template-columns:1fr; } }
    .ad{ background:#fffdf4; border:1.5px solid #221d14; box-shadow:4px 4px 0 rgba(34,29,20,.16); padding:14px 15px;
      display:flex; flex-direction:column; gap:7px; }
    .ad__top{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
    .ad__no{ font-family:'Courier Prime',monospace; font-size:10.5px; font-weight:700; border:2px solid #40d971; border-radius:99px;
      padding:2px 9px; transform:rotate(-3deg); }
    .ad__meta{ font-family:'Courier Prime',monospace; font-size:11px; color:#5c5343; }
    .ad__title{ font-weight:900; font-size:16px; line-height:1.25; }
    .ad__tag{ font-family:'Courier Prime',monospace; font-size:12px; color:#3d362a; flex:1; }
    .ad__row{ display:flex; align-items:center; gap:10px; }
    .ad__row img{ width:56px; height:56px; object-fit:cover; filter:grayscale(1) contrast(1.12); border:1px solid rgba(34,29,20,.3); flex:none; }
    .ad__star{ font-family:'Courier Prime',monospace; font-size:10px; font-weight:700; letter-spacing:.08em; color:#1c5c33; }
    .ad__live{ font-family:'Courier Prime',monospace; font-size:10px; font-weight:700; letter-spacing:.06em; color:#1c5c33;
      animation:cmPulse 1.2s ease-in-out infinite; display:none; }
    .ad.is-live .ad__live{ display:block; }
    @keyframes cmPulse{ 0%,100%{ opacity:1; } 50%{ opacity:.35; } }
    .ad__foot{ display:flex; align-items:center; justify-content:space-between; gap:10px; }

    .sheet__foot{ font-family:'Courier Prime',monospace; font-size:12px; color:#5c5343; border-top:1px solid rgba(34,29,20,.25);
      margin-top:24px; padding-top:14px; display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap; }
    .sheet__foot a{ text-decoration:underline; }

    /* LE TRANSISTOR */
    .tr{ position:fixed; left:0; right:0; bottom:0; z-index:5; background:#1b1b1f; border-top:3px solid #40d971;
      display:none; align-items:center; gap:14px; padding:10px clamp(14px,3vw,26px); }
    .tr.on{ display:flex; }
    .tr__btn{ width:46px; height:46px; border-radius:99px; background:#40d971; color:#0c130e; border:none; font-size:16px; flex:none; }
    .tr__art{ width:42px; height:42px; object-fit:cover; border-radius:3px; flex:none; }
    .tr__mid{ flex:1; min-width:0; }
    .tr__line{ font-family:'Courier Prime',monospace; font-size:11.5px; letter-spacing:.04em; white-space:nowrap; overflow:hidden;
      text-overflow:ellipsis; display:flex; justify-content:space-between; gap:12px; }
    .tr__time{ color:#a7a29a; flex:none; }
    .tr__bar{ margin-top:7px; height:5px; border-radius:99px; background:rgba(242,239,232,.18); cursor:pointer; position:relative; }
    .tr__fill{ position:absolute; left:0; top:0; bottom:0; width:0; border-radius:99px; background:#40d971; }
    .tr__page{ font-family:'Courier Prime',monospace; font-size:11px; color:#a7a29a; flex:none; }
    .tr__page:hover{ color:#40d971; }
    .tr__x{ background:none; border:none; color:#a7a29a; font-size:15px; flex:none; }
    .tr__x:hover{ color:#f2efe8; }
    @media (max-width:600px){ .tr__art, .tr__page{ display:none; } .tr__btn{ width:44px; height:44px; } }