/* OneNIOS performance + stable chapter navigation layer. */

/* Avoid GPU-heavy scrolling effects across PYQ pages. */
html{scroll-behavior:auto!important;overflow-x:hidden}
img{max-width:100%;height:auto}
iframe{max-width:100%}

/* Keep long solved papers layout-stable. content-visibility:auto is intentionally
   not used here because some older/mobile Chromium builds can show skipped
   content as blank/black while scrolling. */
.onenios-pyq-page .question-card,
.onenios-pyq-page .q-block,
.onenios-pyq-page .q-body,
.onenios-pyq-page .solution,
.onenios-pyq-page .pyq-card,
.onenios-pyq-page .pyq-paper,
.onenios-pyq-page .pyq-lesson-group,
.onenios-pyq-page .question-block,
.onenios-pyq-page .paper-section,
.onenios-pyq-page .answer-box,
.onenios-pyq-page .answer-content,
.onenios-pyq-page .practice-question,
.onenios-pyq-page .mcq-item{contain:style}
.onenios-pyq-page .question-card,
.onenios-pyq-page .q-block,
.onenios-pyq-page .q-body,
.onenios-pyq-page .solution,
.onenios-pyq-page .pyq-card,
.onenios-pyq-page .pyq-paper,
.onenios-pyq-page .pyq-lesson-group,
.onenios-pyq-page .question-block,
.onenios-pyq-page .paper-section,
.onenios-pyq-page .answer-box,
.onenios-pyq-page .answer-content,
.onenios-pyq-page .practice-question,
.onenios-pyq-page .mcq-item{content-visibility:visible!important;contain-intrinsic-size:auto!important}

/* Shared navigation for all multi-page chapter lessons. */
.chapter-navigation{width:min(100%,1100px);margin:30px auto 10px;padding:0 1px;display:grid;grid-template-columns:1fr 1fr;gap:12px;clear:both}
.chapter-nav-btn{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:52px;padding:11px 14px;border:1px solid rgba(127,127,127,.32);border-radius:10px;background:rgba(127,127,127,.06);color:inherit!important;text-decoration:none!important;font:inherit;line-height:1.35;cursor:pointer;transition:border-color .14s,background .14s,transform .14s}
.chapter-nav-btn:hover{border-color:rgba(59,158,255,.75);background:rgba(59,158,255,.10);transform:translateY(-1px)}
.chapter-nav-btn .nav-dir{flex:0 0 auto;font-size:.78em;opacity:.7;white-space:nowrap}
.chapter-nav-btn .nav-label{min-width:0;font-size:.9em;font-weight:700;overflow-wrap:anywhere}
.chapter-nav-btn.nav-next .nav-label{text-align:right}
.chapter-nav-btn.disabled{opacity:.35;cursor:default;pointer-events:none}

/* Light-themed chapter pages need an explicit high-contrast nav surface. */
.light-chapter-theme .chapter-navigation .chapter-nav-btn{background:#fff!important;color:#1f2937!important;border-color:#d6d9df!important;box-shadow:0 4px 16px rgba(0,0,0,.07)}
.light-chapter-theme .chapter-navigation .chapter-nav-btn:hover{background:#fff7ed!important;color:#111827!important;border-color:#f59e0b!important}
.light-chapter-theme .chapter-navigation .chapter-nav-btn .nav-dir{color:#6b7280!important}
.light-chapter-theme .chapter-navigation .chapter-nav-btn .nav-label{color:#1f2937!important;-webkit-text-fill-color:#1f2937!important}

/* In-page navigation for Business Studies / Computer Science single-page hubs. */
.chapter-hub-navigation{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:20px 0 4px}
.chapter-hub-nav-btn{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:50px;padding:10px 13px;border:1px solid rgba(127,127,127,.32);border-radius:9px;background:rgba(127,127,127,.06);color:inherit;cursor:pointer;font:inherit;text-align:left}
.chapter-hub-nav-btn span:nth-child(2){text-align:center;flex:1;font-weight:700;font-size:.88rem}
.chapter-hub-nav-btn small{display:block;opacity:.65;font-weight:500;font-size:.75rem;line-height:1.35;margin-top:2px}
.chapter-hub-nav-btn:hover{border-color:rgba(59,158,255,.75);background:rgba(59,158,255,.10)}
.chapter-hub-nav-btn.disabled{opacity:.35;pointer-events:none}

/* Stable, non-blurred PYQ surfaces prevent black/blank scroll artefacts and
   substantially reduce compositing cost on phones and older GPUs. */
.onenios-pyq-page{overflow-x:hidden;background-attachment:scroll!important;background-image:none!important}
.onenios-pyq-page header,.onenios-pyq-page .topbar{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:rgba(8,9,12,.97)!important}
.onenios-pyq-page .glass-card{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:rgba(22,16,44,.96)!important}
.onenios-pyq-page .ambient{position:absolute!important}

/* Low-end devices: remove large GPU/raster effects, shadows and ambient art. */
html.onenios-low-end body{background-image:none!important;background-attachment:scroll!important}
html.onenios-low-end .ambient,
html.onenios-low-end body::before,
html.onenios-low-end #bgCanvas,
html.onenios-low-end .hero::before,
html.onenios-low-end .hero-art::before{display:none!important}
html.onenios-low-end header,
html.onenios-low-end .topbar,
html.onenios-low-end .glass-card,
html.onenios-low-end .glass-card-hover{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html.onenios-low-end .glass-card{box-shadow:none!important}
html.onenios-low-end [class*="backdrop-blur"]{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html.onenios-low-end [class*="shadow-"]{box-shadow:none!important}
html.onenios-low-end *{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
html.onenios-low-end .chapter-nav-btn:hover{transform:none}

@media(max-width:900px){
  .onenios-pyq-page .ambient{display:none!important}
  .onenios-pyq-page .glass-card{box-shadow:none!important}
  .onenios-pyq-page [class*="backdrop-blur"]{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
}
@media(max-width:600px){.chapter-navigation{gap:8px;margin-top:24px}.chapter-nav-btn{min-height:48px;padding:9px 10px;border-radius:9px}.chapter-nav-btn .nav-label{font-size:.82em}.chapter-nav-btn .nav-dir{font-size:.72em}.chapter-hub-navigation{gap:8px}.chapter-hub-nav-btn{padding:9px 10px}.chapter-hub-nav-btn span:nth-child(2){font-size:.8rem}.chapter-hub-nav-btn small{font-size:.7rem}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.chapter-nav-btn{transition:none!important}}


/* Lightweight Solved PYQ loading gate. Keeps the unfinished Tailwind/CDN
   skeleton out of view until the page's main scripts/styles have settled. */
#onenios-pyq-loader{
  position:fixed;inset:0;z-index:2147483000;display:none;align-items:center;justify-content:center;
  flex-direction:column;gap:12px;padding:24px;background:#080614;color:#e2e8f0;
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Ubuntu,Cantarell,"Noto Sans",sans-serif;
  text-align:center;isolation:isolate;
}
html.onenios-pyq-loading #onenios-pyq-loader{display:flex}
html.onenios-pyq-loading body{overflow:hidden!important}
html.onenios-pyq-loading body>*:not(#onenios-pyq-loader){visibility:hidden!important}
#onenios-pyq-loader .pyq-loader-ring{
  width:30px;height:30px;border:3px solid rgba(255,255,255,.14);border-top-color:#c084fc;border-radius:50%;
  animation:onenios-pyq-spin .9s linear infinite;box-sizing:border-box;
}
#onenios-pyq-loader .pyq-loader-title{font-size:15px;font-weight:700;letter-spacing:.01em}
#onenios-pyq-loader .pyq-loader-subtitle{font-size:12px;color:#a1a1aa}
#onenios-pyq-loader.is-hidden{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .16s ease}
@keyframes onenios-pyq-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){#onenios-pyq-loader .pyq-loader-ring{animation:none}}

/* Mobile header normalization — keeps navigation readable and touch-friendly
   across the home, study, practical, PYQ hub, 2026 selector, and solved-paper pages. */
@media (max-width: 640px) {
  /* Home / 2026 selector / shared topbar layouts */
  .onenios-premium .topbar {
    min-height: 60px !important;
    height: auto !important;
    padding: 8px 12px !important;
    gap: 8px !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  .onenios-premium .topbar > .brand {
    min-width: 0;
    flex: 1 1 auto;
  }
  .onenios-premium .topbar > .brand span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .onenios-premium .topbar .nav-center,
  .onenios-premium .topbar .nav {
    display: none !important;
  }
  .onenios-home .nav-right .status-badges,
  .onenios-home .nav-right > .btn-primary {
    display: none !important;
  }
  .onenios-home .menu-btn {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
  }
  .onenios-premium .topbar .menu {
    width: 42px !important;
    min-width: 42px;
    height: 42px !important;
    flex: 0 0 42px;
  }

  /* Solved 2026 subject papers: compact title + icon-only actions. */
  .onenios-pyq-page > header:not(.topbar) {
    min-height: 60px !important;
    padding: calc(8px + env(safe-area-inset-top)) 10px 8px !important;
    overflow: visible !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  .onenios-pyq-page > header:not(.topbar) > div {
    width: 100% !important;
    min-height: 42px !important;
    height: auto !important;
    padding: 0 !important;
    gap: 8px !important;
  }
  .onenios-pyq-page > header:not(.topbar) > div > div:first-child {
    min-width: 0 !important;
    flex: 1 1 auto !important;
    gap: 9px !important;
    overflow: hidden !important;
  }
  .onenios-pyq-page > header:not(.topbar) > div > div:first-child > div:first-child {
    min-width: 0 !important;
    gap: 6px !important;
  }
  .onenios-pyq-page > header:not(.topbar) > div > div:first-child > div:first-child > span:first-child {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
  .onenios-pyq-page > header:not(.topbar) > div > div:first-child > div:first-child > span:nth-child(2) {
    display: none !important;
  }
  .onenios-pyq-page > header:not(.topbar) > div > div:first-child > h1 {
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: 14px !important;
    line-height: 1.25 !important;
  }
  .onenios-pyq-page > header:not(.topbar) > div > div:last-child {
    flex: 0 0 auto !important;
    gap: 6px !important;
  }
  .onenios-pyq-page > header:not(.topbar) > div > div:last-child > button {
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 !important;
    border-radius: 11px !important;
    justify-content: center !important;
    flex: 0 0 42px !important;
    box-shadow: none !important;
  }
  .onenios-pyq-page > header:not(.topbar) > div > div:last-child > button > span {
    display: none !important;
  }
  .onenios-pyq-page > header:not(.topbar) > div > div:last-child > button > svg {
    width: 17px !important;
    height: 17px !important;
    flex: 0 0 17px !important;
  }

  /* Practical landing page: clean 2x2 action grid instead of squeezed pills. */
  .onenios-practical .topbar {
    align-items: center !important;
    flex-wrap: wrap !important;
    min-height: 60px !important;
  }
  .onenios-practical .nav-right {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }
  .onenios-practical .nav-right .btn {
    width: 100% !important;
    min-height: 40px !important;
    padding: 8px 7px !important;
    font-size: 11px !important;
    line-height: 1.15 !important;
    white-space: normal !important;
    text-align: center !important;
  }

  /* Study hub: keep the nav usable with one touch-scrollable row. */
  .onenios-study-hub header {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    padding: 9px 0 !important;
    margin-bottom: 18px !important;
  }
  .onenios-study-hub .nav {
    display: flex !important;
    width: 100% !important;
    max-width: 100% !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: 2px 0 4px !important;
    gap: 4px !important;
  }
  .onenios-study-hub .nav::-webkit-scrollbar { display: none; }
  .onenios-study-hub .nav a {
    flex: 0 0 auto !important;
    padding: 8px 11px !important;
    font-size: 12px !important;
    white-space: nowrap !important;
  }

  /* Older PYQ hub: prevent top controls from crowding the brand. */
  .onenios-pyq-hub .topbar {
    margin: 10px 12px 0 !important;
    min-height: 58px !important;
    height: auto !important;
    gap: 8px !important;
    padding: 9px 10px !important;
  }
  .onenios-pyq-hub .top-tools {
    min-width: 0 !important;
    gap: 6px !important;
    justify-content: flex-end !important;
  }
  .onenios-pyq-hub .home-link,
  .onenios-pyq-hub .status {
    height: 38px !important;
    padding: 0 10px !important;
    font-size: 11px !important;
  }
}

@media (max-width: 380px) {
  .onenios-premium .topbar { padding-left: 9px !important; padding-right: 9px !important; }
  .onenios-premium .brand img { width: 32px !important; height: 32px !important; }
  .onenios-premium .brand { gap: 8px !important; font-size: 14px !important; }
  .onenios-pyq-page > header:not(.topbar) > div > div:last-child > button {
    width: 39px !important;
    min-width: 39px !important;
    height: 39px !important;
    min-height: 39px !important;
    flex-basis: 39px !important;
  }
  .onenios-pyq-page > header:not(.topbar) > div > div:first-child > h1 { font-size: 13px !important; }
  .onenios-practical .nav-right .btn { font-size: 10.5px !important; padding-left: 5px !important; padding-right: 5px !important; }
}