
.mb-wrap{max-width:100%;margin:18px auto;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}
.mb-note{padding:12px;border:1px solid #ddd;background:#fafafa}

.mb-cover-screen{display:flex;justify-content:center;align-items:center;padding:0}
.mb-cover-inner{display:flex;flex-direction:column;gap:12px;align-items:center}
.mb-cover-img{width:550px;max-width:90vw;height:auto;border-radius:0;box-shadow:0 12px 30px rgba(0,0,0,.18);background:transparent;display:block}
.mb-open-btn{appearance:none;border:1px solid #111;background:#111;color:#fff;padding:10px 14px;border-radius:8px;cursor:pointer;font-weight:600}

.mb-book-screen{display:block}
.mb-toolbar{display:flex;gap:8px;align-items:center;margin-bottom:10px}
.mb-btn{appearance:none;border:1px solid #111;background:#fff;color:#111;padding:6px 10px;border-radius:8px;cursor:pointer;font-weight:700}
.mb-btn:active{transform:translateY(1px)}
.mb-spacer{flex:1}

.mb-stage{position:relative;display:flex;justify-content:center;align-items:center;overflow:hidden;border-radius:0;box-shadow:0 12px 30px rgba(0,0,0,.14);background:transparent;padding:0}
.mb-book{position:relative}
.mb-gutter{position:absolute;left:50%;top:0;bottom:0;width:26px;transform:translateX(-50%);pointer-events:none;opacity:.25;mix-blend-mode:multiply;background:linear-gradient(to right, rgba(0,0,0,0), rgba(0,0,0,.25), rgba(0,0,0,0));}
.mb-shine{position:absolute;inset:0;pointer-events:none;opacity:0;mix-blend-mode:screen;border-radius:0;
  background:linear-gradient(115deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.35) 35%, rgba(255,255,255,0) 60%);
  transform:translateX(-30%) skewX(-14deg);
}
.mb-stage.mb-shine-active .mb-shine{opacity:var(--mb-shine-opacity, .7); animation: mbShine .45s ease-out both;}
@keyframes mbShine { from { transform:translateX(-35%) skewX(-14deg);} to { transform:translateX(40%) skewX(-14deg);} }

.mb-wrap:fullscreen, .mb-wrap:-webkit-full-screen{
  background:#111;
  display:flex;
  justify-content:center;
  align-items:center;
  padding:16px;
}
.mb-wrap:fullscreen .mb-stage, .mb-wrap:-webkit-full-screen .mb-stage{
  background:transparent;
  box-shadow:none;
}

/* Remove any default white "paper" background from the flip engine */
.mb-stage .stf__wrapper,
.mb-stage .stf__block,
.mb-stage .stf__page{
  background:transparent !important;
}

/* Force images to fully cover the page area (no letterboxing borders) */
.mb-stage .stf__page img,
.mb-stage .stf__page canvas,
.mb-stage .stf__page > div img{
  width:100% !important;
  height:100% !important;
  display:block !important;
  object-fit:cover !important;
}

/* === Custom black theme + BW controls (patched) === */

/* Ensure cover is visible and sits on black, even when the page theme is light */
.mb-wrap .mb-cover-screen{
  background:#000 !important;
  min-height: min(100vh, 900px);
}
.mb-wrap .mb-cover-inner{
  padding:18px 12px;
}

/* Fullscreen: remove any “white frame” (backdrop/margins/padding) */
.mb-wrap:fullscreen,
.mb-wrap:-webkit-full-screen{
  background:#000 !important;
  margin:0 !important;
  padding:0 !important;
  width:100vw !important;
  height:100vh !important;
  max-width:100vw !important;
}
.mb-wrap:fullscreen::backdrop,
.mb-wrap:-webkit-full-screen::backdrop{
  background:#000 !important;
}

/* Fullscreen layout: make the stage fill available height */
.mb-wrap:fullscreen .mb-book-screen,
.mb-wrap:-webkit-full-screen .mb-book-screen{
  background:#000 !important;
  height:100% !important;
  display:flex !important;
  flex-direction:column !important;
}
.mb-wrap:fullscreen .mb-stage,
.mb-wrap:-webkit-full-screen .mb-stage{
  background:#000 !important;
  box-shadow:none !important;
  flex:1 1 auto !important;
  margin:0 !important;
}

/* Kill remaining light backgrounds inside the flip engine */
.mb-stage .stf__wrapper,
.mb-stage .stf__block,
.mb-stage .stf__page{
  background:#000 !important;
}

/* “Ouvrir le magazine” button: Bebas Neue + white text */
.mb-open-btn{
  background:#000 !important;
  color:#fff !important;
  border:1px solid #fff !important;
  font-family:'Bebas Neue', sans-serif !important;
  font-weight:400 !important;
  box-shadow:none !important;
}
.mb-open-btn:hover{
  filter: brightness(1.1);
}
.mb-open-btn:focus,
.mb-open-btn:focus-visible{
  outline:2px solid #fff !important;
  outline-offset:2px !important;
  box-shadow:none !important;
}

/* Toolbar buttons (prev/next/fullscreen): black & white */
.mb-btn{
  background:#000 !important;
  color:#fff !important;
  border-color:#fff !important;
}
.mb-btn:hover{
  filter: brightness(1.1);
}
.mb-btn:focus{
  outline:2px solid #fff;
  outline-offset:2px;
}


/* --- Bayside BW patch: harden black backgrounds + missing pages --- */
html.mb-is-fullscreen,
body.mb-is-fullscreen{
  background:#000 !important;
  margin:0 !important;
}

.mb-wrap,
.mb-cover-screen,
.mb-book-screen,
.mb-stage,
.mb-book{
  background:#000 !important;
}

.mb-wrap:fullscreen{
  background:#000 !important;
  margin:0 !important;
  padding:0 !important;
  width:100vw !important;
  height:100vh !important;
  max-width:100vw !important;
  max-height:100vh !important;
}

.mb-wrap:fullscreen::backdrop{
  background:#000 !important;
}

.mb-book img,
.mb-cover-img,
.mb-img-placeholder{
  background:#000 !important;
}


a.mb-open-btn{ text-decoration:none !important; }
