/* SchoolEP V229.9 — Level 4 single first-paint shell/hero/breadcrumb/viewer authority. */
html[data-schoolep-resource] .viewer-hero,
html[data-schoolep-resource] .schoolep-level4-universal-hero{display:flex!important;visibility:visible!important;opacity:1!important;position:relative!important;overflow:hidden!important;min-height:108px!important;align-items:center!important;justify-content:center!important;flex-direction:column!important;isolation:isolate!important;transition:none!important;animation:none!important}
html[data-schoolep-resource] .viewer-hero[hidden],html[data-schoolep-resource] .schoolep-level4-universal-hero[hidden]{display:flex!important}
html[data-schoolep-resource] .viewer-hero-unit,html[data-schoolep-resource] .viewer-hero-item{position:relative!important;z-index:2!important;text-align:center!important;transition:none!important;animation:none!important}
html[data-schoolep-resource] .schoolep-resource-hero-bg-icon{display:flex!important;visibility:visible!important;opacity:.085!important;position:absolute!important;z-index:0!important;top:50%!important;transform:translateY(-50%)!important;inset-inline-end:7%!important;width:112px!important;height:112px!important;align-items:center!important;justify-content:center!important;pointer-events:none!important;transition:none!important;animation:none!important}
html[data-schoolep-resource] .schoolep-resource-hero-bg-icon>*,html[data-schoolep-resource] .schoolep-resource-hero-bg-glyph{display:flex!important;align-items:center!important;justify-content:center!important;font-size:86px!important;line-height:1!important;width:100%!important;height:100%!important;color:var(--accent,currentColor)!important;transform:none!important}




html[data-schoolep-resource] .viewer-container>#thumbsPanel,html[data-schoolep-resource] .viewer-container>#pdfPanel,html[data-schoolep-resource] .viewer-container>#otherFormatsPanel{display:flex!important;visibility:visible!important;opacity:1!important;flex-direction:column!important;transition:none!important;animation:none!important}
html[lang="ar"] .schoolep-i18n-fr,html[lang="fr"] .schoolep-i18n-ar{display:none!important}
html[lang="ar"] .schoolep-i18n-ar,html[lang="fr"] .schoolep-i18n-fr{display:inline!important}
@media(max-width:700px){
 html[data-schoolep-resource] .viewer-hero,html[data-schoolep-resource] .schoolep-level4-universal-hero{min-height:92px!important;padding-inline:58px!important}
 html[data-schoolep-resource] .schoolep-resource-hero-bg-icon{display:flex!important;top:50%!important;inset-inline-end:4%!important;width:76px!important;height:76px!important;opacity:.075!important}
 html[data-schoolep-resource] .schoolep-resource-hero-bg-icon>*,html[data-schoolep-resource] .schoolep-resource-hero-bg-glyph{font-size:58px!important}
 
 
}


/* V229.9 final: Level-4 sidebar uses the exact Level-3 shell state and never animates
   its geometry during mount/refresh. The state class is injected before insertion. */
html[data-schoolep-resource] #sidebar-slot .levels-sidebar,
html[data-schoolep-resource] #sidebar-slot .sidebar-card,
html[data-schoolep-resource] #sidebar-slot .level-group,
html[data-schoolep-resource] #sidebar-slot .level-group h4,
html[data-schoolep-resource] #sidebar-slot .level-btn,
html[data-schoolep-resource] #sidebar-slot .level-btn i,
html[data-schoolep-resource] #sidebar-slot .pc-collapse-btn,
html[data-schoolep-resource] #sidebar-slot .pc-collapse-btn i,
html[data-schoolep-resource] #sidebar-toggle-btn .sidebar-toggle-icon-stack,
html[data-schoolep-resource] #sidebar-toggle-btn .sidebar-toggle-icon {transition:none!important;animation:none!important}
html[data-schoolep-resource] #sidebar-slot .level-btn:hover,
html[data-schoolep-resource] #sidebar-slot .level-btn:active {transform:none!important}
html[data-schoolep-resource] #sidebar-toggle-btn:hover .sidebar-toggle-icon-stack,
html[data-schoolep-resource] #sidebar-toggle-btn:active .sidebar-toggle-icon-stack {transform:scale(1)!important}
html[data-schoolep-resource][dir="rtl"] #sidebar-slot .levels-sidebar.pc-collapsed .pc-collapse-btn i {transform:rotate(180deg)!important}
html[data-schoolep-resource][dir="ltr"] #sidebar-slot .levels-sidebar.pc-collapsed .pc-collapse-btn i {transform:rotate(0deg)!important}
html[data-schoolep-resource][data-schoolep-level4-server-ready="1"] .viewer-hero,
html[data-schoolep-resource][data-schoolep-level4-server-ready="1"] .schoolep-level4-universal-hero{display:flex!important;visibility:visible!important;opacity:1!important;height:auto!important;max-height:none!important}
html[data-schoolep-resource] .schoolep-resource-hero-bg-icon i{display:flex!important;align-items:center!important;justify-content:center!important;width:1em!important;height:1em!important;line-height:1!important}

@media(max-width:700px){
 html[data-schoolep-resource] .viewer-hero,html[data-schoolep-resource] .schoolep-level4-universal-hero{min-height:96px!important;padding-block:14px!important;padding-inline:64px!important}
 html[data-schoolep-resource] .schoolep-resource-hero-bg-icon{display:flex!important;visibility:visible!important;top:50%!important;bottom:auto!important;inset-inline-end:8px!important;transform:translateY(-50%)!important;width:72px!important;height:72px!important;opacity:.10!important}
 html[data-schoolep-resource] .schoolep-resource-hero-bg-icon>*{font-size:56px!important}
 
}


/* V229.10 final Level-4 geometry: server hero is the visible hero from the first paint. */
html[data-schoolep-resource][data-schoolep-level4-server-ready="1"] .viewer-hero{
  display:flex!important;visibility:visible!important;opacity:1!important;
  min-height:108px!important;height:108px!important;max-height:108px!important;
  margin-block:0 16px!important;contain:layout paint!important;
}
html[data-schoolep-resource] .viewer-hero .schoolep-resource-hero-bg-icon{
  top:50%!important;bottom:auto!important;transform:translateY(-50%)!important;
  opacity:.13!important;overflow:visible!important;
}
html[data-schoolep-resource] .viewer-hero .schoolep-resource-hero-bg-glyph{
  display:flex!important;visibility:visible!important;opacity:1!important;
  align-items:center!important;justify-content:center!important;
  width:100%!important;height:100%!important;line-height:1!important;
  margin:0!important;padding:0!important;position:static!important;
}

html[data-schoolep-resource] #sidebar-slot .levels-sidebar,
html[data-schoolep-resource] #sidebar-slot .levels-sidebar *{
  transition-property:none!important;animation:none!important;
}
@media(max-width:700px){
  html[data-schoolep-resource][data-schoolep-level4-server-ready="1"] .viewer-hero{
    min-height:96px!important;height:96px!important;max-height:96px!important;
    padding-block:12px!important;padding-inline:58px!important;
  }
  html[data-schoolep-resource] .viewer-hero .schoolep-resource-hero-bg-icon{
    display:flex!important;visibility:visible!important;opacity:.11!important;
    top:50%!important;bottom:auto!important;transform:translateY(-50%)!important;
    inset-inline-end:8px!important;width:72px!important;height:72px!important;
  }
  html[data-schoolep-resource] .viewer-hero .schoolep-resource-hero-bg-glyph{font-size:56px!important}
  
}

/* V229.11 canonical document stack: gallery -> PDF viewer -> PDF download -> Word/PPT. */
html[data-schoolep-resource] #pdfPanel{display:flex!important;visibility:visible!important;opacity:1!important;flex-direction:column!important}
html[data-schoolep-resource] #pdfViewerWrapper{position:relative!important}
html[data-schoolep-resource] #pdfMissingState{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:2;font-weight:800;color:var(--viewer-secondary);background:var(--surface);text-align:center;padding:20px}
html[data-schoolep-resource] #pdfPanel[data-pdf-available="1"] #pdfMissingState{display:none!important}
html[data-schoolep-resource] #pdfPanel[data-pdf-available="0"] #pdfFrame{visibility:hidden!important;opacity:0!important}
html[data-schoolep-resource] #pdfPanel>.toolbar{order:3;display:flex!important;justify-content:center!important}
html[data-schoolep-resource] #otherFormatsPanel .toolbar{display:flex!important;justify-content:center!important;gap:12px!important;flex-wrap:wrap!important}

/* V229.22 canonical Level-4 first-paint authority.
   One hero geometry and one watermark position for direct + short URLs. */
html[data-schoolep-resource] .content-area .viewer-hero,
html[data-schoolep-resource] .content-area .viewer-hero.schoolep-level4-universal-hero,
html[data-schoolep-resource] .content-area #schoolep-level4-hero {
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  position:relative!important;
  overflow:hidden!important;
  min-height:108px!important;
  height:108px!important;
  max-height:108px!important;
  margin:0 0 16px!important;
  padding:16px 72px!important;
  align-items:center!important;
  justify-content:center!important;
  flex-direction:column!important;
  gap:6px!important;
  contain:layout paint!important;
  transition:none!important;
  animation:none!important;
}
html[data-schoolep-resource] .viewer-hero .schoolep-resource-hero-bg-icon,
html[data-schoolep-resource] #schoolep-level4-hero .schoolep-resource-hero-bg-icon {
  display:flex!important;
  visibility:visible!important;
  position:absolute!important;
  z-index:0!important;
  top:50%!important;
  bottom:auto!important;
  inset-inline-start:6%!important;
  inset-inline-end:auto!important;
  width:96px!important;
  height:96px!important;
  transform:translateY(-50%)!important;
  opacity:.12!important;
  align-items:center!important;
  justify-content:center!important;
  color:var(--sp-breadcrumb-accent,var(--accent,currentColor))!important;
  pointer-events:none!important;
  transition:none!important;
  animation:none!important;
}
html[data-schoolep-resource] .viewer-hero .schoolep-resource-hero-bg-glyph,
html[data-schoolep-resource] #schoolep-level4-hero .schoolep-resource-hero-bg-glyph {
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
  position:static!important;
  color:inherit!important;
  font-size:76px!important;
  line-height:1!important;
  transform:none!important;
}
html[data-schoolep-resource] .viewer-hero-unit,
html[data-schoolep-resource] .viewer-hero-item {
  position:relative!important;
  z-index:2!important;
  text-align:center!important;
}
html[data-schoolep-resource] #pdfMissingState > .viewer-note {
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px;
  margin:auto;
}
@media (max-width:700px) {
  html[data-schoolep-resource] .content-area .viewer-hero,
  html[data-schoolep-resource] .content-area .viewer-hero.schoolep-level4-universal-hero,
  html[data-schoolep-resource] .content-area #schoolep-level4-hero {
    min-height:96px!important;
    height:96px!important;
    max-height:96px!important;
    padding:12px 58px!important;
  }
  html[data-schoolep-resource] .viewer-hero .schoolep-resource-hero-bg-icon,
  html[data-schoolep-resource] #schoolep-level4-hero .schoolep-resource-hero-bg-icon {
    top:50%!important;
    inset-inline-start:8px!important;
    inset-inline-end:auto!important;
    width:72px!important;
    height:72px!important;
    transform:translateY(-50%)!important;
    opacity:.11!important;
  }
  html[data-schoolep-resource] .viewer-hero .schoolep-resource-hero-bg-glyph,
  html[data-schoolep-resource] #schoolep-level4-hero .schoolep-resource-hero-bg-glyph {
    font-size:56px!important;
  }
}

/* V229.88 — pending is not failure. */
html[data-schoolep-resource] #pdfMissingState[aria-hidden="true"]{display:none}
/* V229.95: no failure copy exists in first-paint HTML. */
html[data-schoolep-resource] #pdfMissingState[aria-hidden="true"]{display:none}
html[data-schoolep-resource] #pdfMissingState[aria-hidden="false"]{display:flex}
html[data-schoolep-resource] .viewer-media-loader{z-index:4}



/* V230.04 — canonical Level-4 hero skin shared by viewer + quizzer.
   Geometry already lives above; this block owns the visible card skin so
   quizzer_ and viewer_ render the exact same hero container from first paint. */
html[data-schoolep-resource] .content-area .viewer-hero,
html[data-schoolep-resource] .content-area .viewer-hero.schoolep-level4-universal-hero,
html[data-schoolep-resource] .content-area #schoolep-level4-hero {
  box-sizing: border-box !important;
  width: 100% !important;
  border: 1px solid rgb(var(--resource-accent-rgb, 255 152 0) / .22) !important;
  border-radius: 18px !important;
  background:
    linear-gradient(135deg,
      rgb(var(--resource-accent-rgb, 255 152 0) / .12) 0%,
      rgb(var(--resource-accent-rgb, 255 152 0) / .035) 100%),
    var(--surface, var(--qz-surface, #fff)) !important;
  box-shadow: 0 4px 12px rgba(0,0,0,.03) !important;
}
html[data-schoolep-resource] .content-area .viewer-hero-unit,
html[data-schoolep-resource] .content-area #schoolep-level4-hero-unit {
  max-width: 100% !important;
  color: var(--txt-900, var(--qz-text-main, #0f172a)) !important;
  font-size: clamp(18px, 1.55vw, 26px) !important;
  font-weight: 900 !important;
  line-height: 1.3 !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}
html[data-schoolep-resource] .content-area .viewer-hero-item,
html[data-schoolep-resource] .content-area #schoolep-level4-hero-item {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  max-width: 100% !important;
  padding: 7px 14px 6px !important;
  border: 1px solid rgb(var(--resource-accent-rgb, 255 152 0) / .28) !important;
  border-radius: 999px !important;
  background: rgb(var(--resource-accent-rgb, 255 152 0) / .10) !important;
  color: var(--resource-accent-600, var(--qz-accent-600, #9a4300)) !important;
  font-size: clamp(12px, 1.1vw, 15px) !important;
  font-weight: 900 !important;
  line-height: 1.22 !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}
html[data-schoolep-resource] .content-area .viewer-hero-unit:empty,
html[data-schoolep-resource] .content-area .viewer-hero-item:empty,
html[data-schoolep-resource] .content-area #schoolep-level4-hero-unit:empty,
html[data-schoolep-resource] .content-area #schoolep-level4-hero-item:empty {
  display: none !important;
}
html.dark-mode[data-schoolep-resource] .content-area .viewer-hero,
html.dark-mode[data-schoolep-resource] .content-area #schoolep-level4-hero {
  background:
    linear-gradient(135deg,
      rgb(var(--resource-hero-tint-rgb, var(--resource-accent-rgb, 255 152 0)) / .14) 0%,
      rgb(var(--resource-hero-tint-rgb, var(--resource-accent-rgb, 255 152 0)) / .04) 100%),
    var(--surface, var(--qz-surface, #0f172a)) !important;
  border-color: rgb(var(--resource-hero-border-rgb, var(--resource-accent-rgb, 255 152 0)) / .22) !important;
  box-shadow: 0 8px 25px rgba(0,0,0,.24) !important;
}
html.dark-mode[data-schoolep-resource] .content-area .viewer-hero-item,
html.dark-mode[data-schoolep-resource] .content-area #schoolep-level4-hero-item {
  background: rgb(var(--resource-accent-rgb, 255 152 0) / .14) !important;
  border-color: rgb(var(--resource-accent-rgb, 255 152 0) / .26) !important;
  color: var(--resource-accent-dark, var(--qz-accent, #fb923c)) !important;
}
@media (max-width:700px) {
  html[data-schoolep-resource] .content-area .viewer-hero,
  html[data-schoolep-resource] .content-area #schoolep-level4-hero {
    border-radius: 15px !important;
  }
  html[data-schoolep-resource] .content-area .viewer-hero-unit,
  html[data-schoolep-resource] .content-area #schoolep-level4-hero-unit {
    font-size: 14px !important;
    line-height: 1.28 !important;
  }
  html[data-schoolep-resource] .content-area .viewer-hero-item,
  html[data-schoolep-resource] .content-area #schoolep-level4-hero-item {
    padding: 5px 10px 4px !important;
    font-size: 12px !important;
    line-height: 1.26 !important;
  }
}
