/* Yellow-Sub — navigation phpBB mobile uniquement. */
#ysfm, #ysfm-spacer { display: none !important; }
@media (max-width: 767px) {
  html.ysfm-ready { --ysfm-height: 76px; }
  html.ysfm-ready #ysfm {
    --ysfm-accent: #fecc59;
    --ysfm-dark: #26292b;
    display: block !important;
    position: fixed; inset: auto 0 0; z-index: 43;
    width: 100%; margin: 0; padding: 0; border: 0;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    font-size: 16px; line-height: 1.4; color: #fff;
    text-align: left; isolation: isolate;
  }
  #ysfm *, #ysfm *::before, #ysfm *::after { box-sizing: border-box; }
  #ysfm [hidden] { display: none !important; }
  html.ysfm-ready #ysfm-spacer { display: block !important; height: var(--ysfm-height); }
  /* Les commandes natives de phpBB restent accessibles. */
  #ysfm button, #ysfm a {
    margin: 0; min-width: 0; max-width: none; min-height: 0; height: auto;
    padding: 0; border: 0; border-radius: 0; box-shadow: none;
    background: transparent; color: inherit; opacity: 1;
    font: inherit; font-weight: 500; letter-spacing: 0; text-transform: none;
    text-decoration: none; text-shadow: none; cursor: pointer;
    -webkit-tap-highlight-color: transparent; touch-action: manipulation;
  }
  #ysfm a::before, #ysfm a::after, #ysfm button::before, #ysfm button::after { content: none; }
  #ysfm svg { display: block; flex: 0 0 auto; width: 26px; height: 26px; pointer-events: none; }
  #ysfm .ysfm-dock {
    position: relative; z-index: 2; padding-bottom: env(safe-area-inset-bottom);
    background: var(--ysfm-accent); color: var(--ysfm-dark);
    box-shadow: 0 -2px 12px rgb(0 0 0 / 12%);
  }
  #ysfm .ysfm-bar {
    position: relative; z-index: 2; display: grid; grid-template-columns: repeat(5,minmax(0,1fr));
    align-items: stretch; gap: 2px; width: 100%; margin: 0;
    height: 48px; padding: 2px max(4px,env(safe-area-inset-right)) 2px max(4px,env(safe-area-inset-left));
    background: var(--ysfm-accent); color: var(--ysfm-dark);
  }
  #ysfm .ysfm-tab {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 2px; height: 44px; min-height: 44px; padding: 2px 1px; border-radius: 8px;
    font-size: clamp(9px,2.8vw,12px); line-height: 1.2; white-space: nowrap;
    transition: background-color .16s, color .16s;
  }
  #ysfm .ysfm-tab > svg { width: 22px; height: 22px; }
  #ysfm .ysfm-history {
    display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); height: 28px;
    border-top: 1px solid rgb(38 41 43 / 30%);
    padding: 0 max(4px,env(safe-area-inset-right)) 0 max(4px,env(safe-area-inset-left));
  }
  #ysfm .ysfm-history button {
    display: flex; align-items: center; justify-content: center; gap: 10px;
    height: 27px; min-height: 27px; padding: 0 8px; font-size: 12px; line-height: 1;
  }
  #ysfm .ysfm-history button + button { border-left: 1px solid rgb(38 41 43 / 30%); }
  #ysfm .ysfm-history svg { width: 21px; height: 21px; }
  #ysfm .ysfm-history button:hover { background: rgb(38 41 43 / 8%); }
  #ysfm .ysfm-tab.is-current, #ysfm .ysfm-tab[aria-expanded="true"] {
    background: var(--ysfm-dark); color: var(--ysfm-accent);
  }
  #ysfm.ysfm-open .ysfm-tab.is-current:not([aria-expanded="true"]) { background: transparent; color: var(--ysfm-dark); }
  #ysfm .ysfm-shade { position: fixed; inset: 0; z-index: 0; background: rgb(0 0 0 / 58%); touch-action: none; }
  #ysfm .ysfm-sheet {
    position: relative; z-index: 1; width: 100%; margin: 0; padding: 0 20px 9px;
    padding-left: max(20px,env(safe-area-inset-left)); padding-right: max(20px,env(safe-area-inset-right));
    border-radius: 24px 24px 0 0; background: var(--ysfm-dark); color: #fff;
    box-shadow: 0 -8px 30px rgb(0 0 0 / 18%);
    max-height: calc(100vh - var(--ysfm-height) - 55px);
    max-height: calc(100dvh - var(--ysfm-height) - 55px);
    overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
    animation: ysfm-reveal .2s ease-out;
  }
  #ysfm .ysfm-grip { width: 42px; height: 4px; margin: 12px auto 8px; border-radius: 3px; background: #858789; }
  #ysfm .ysfm-heading { display: flex; align-items: center; gap: 13px; min-height: 64px; border-bottom: 1px solid #474a4c; }
  #ysfm .ysfm-heading > svg { color: var(--ysfm-accent); width: 29px; height: 29px; }
  #ysfm h2 { flex: 1; margin: 0; padding: 0; color: #fff; font: inherit; font-size: 23px; font-weight: 650; line-height: 1.25; letter-spacing: 0; text-transform: none; }
  #ysfm .ysfm-close { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; flex: 0 0 44px; border-radius: 8px; }
  #ysfm .ysfm-row { display: flex; align-items: center; gap: 15px; min-height: 60px; padding: 14px 2px; border-bottom: 1px solid #474a4c; font-size: 17px; line-height: 1.35; }
  #ysfm .ysfm-row:last-child { border-bottom: 0; }
  #ysfm .ysfm-row > svg:first-child { color: var(--ysfm-accent); }
  #ysfm .ysfm-row > svg:last-child { width: 17px; height: 17px; margin-left: auto; }
  #ysfm .ysfm-row[aria-current="page"] { color: var(--ysfm-accent); }
  #ysfm :is(a,button):focus-visible { outline: 2px solid currentColor; outline-offset: -3px; }
  #ysfm .ysfm-row:hover, #ysfm .ysfm-close:hover { background: #35383a; }
  @keyframes ysfm-reveal { from { transform: translateY(14px); opacity: .4; } to { transform: translateY(0); opacity: 1; } }
  @media (prefers-reduced-motion: reduce) { #ysfm * { animation: none !important; transition: none !important; } }
}
@media (max-width: 359px) {
  #ysfm .ysfm-bar { gap: 0; padding-left: max(2px,env(safe-area-inset-left)); padding-right: max(2px,env(safe-area-inset-right)); }
  #ysfm .ysfm-tab { letter-spacing: -.12px; }
}