/* Custom subtle animations and British civic styling */
    body {
      background-color: #f8fafc;
      background-image: radial-gradient(#e2e8f0 1px, transparent 1px);
      background-size: 24px 24px;
    }

    .crown-gradient {
      background: linear-gradient(135deg, #0f172a 0%, #1e3a8a 60%, #1d4ed8 100%);
    }

    .union-accent-bar {
      height: 5px;
      background: linear-gradient(90deg, #1e3a8a 0%, #1e3a8a 40%, #ffffff 42%, #dc2626 45%, #dc2626 55%, #ffffff 58%, #1e3a8a 60%, #1e3a8a 100%);
    }

    @keyframes popIn {
      0% { transform: scale(0.95); opacity: 0; }
      100% { transform: scale(1); opacity: 1; }
    }

    .animate-pop {
      animation: popIn 0.25s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    }

    @keyframes pulseFlame {
      0%, 100% { transform: scale(1); }
      50% { transform: scale(1.14); }
    }

    .flame-active {
      animation: pulseFlame 1.5s infinite ease-in-out;
    }

    /* Custom Scrollbar for Category Tabs on Mobile */
    .no-scrollbar::-webkit-scrollbar {
      display: none;
    }
    .no-scrollbar {
      -ms-overflow-style: none;
      scrollbar-width: none;
    }

    .mobile-exam-only,
    .mobile-more-sheet,
    .mobile-sheet-backdrop {
      display: none;
    }

    @media (max-width: 767px) {
      body {
        padding-bottom: calc(4.25rem + env(safe-area-inset-bottom, 0px));
      }

      body.exam-focus .mobile-exam-only {
        display: flex;
      }

      #mobileBottomNav {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 40;
        background: #ffffff;
        border-top: 1px solid #e2e8f0;
        box-shadow: 0 -8px 24px rgba(15, 23, 42, 0.08);
        padding-bottom: env(safe-area-inset-bottom, 0px);
      }

      .mobile-nav-btn {
        min-height: 4.25rem;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 0.15rem;
        padding: 0.35rem 0.15rem;
        font-size: 10px;
        font-weight: 700;
        color: #334155;
        line-height: 1.1;
      }

      .mobile-nav-btn.is-active {
        color: #1e3a8a;
      }

      #mobileExamBar {
        min-height: 4.25rem;
      }

      body.exam-focus #mobileBrowseBar {
        display: none;
      }

      body.exam-focus #mobileExamBar {
        display: flex;
      }

      body.exam-focus #questionCardFooter {
        display: none;
      }

      #questionToolsSection {
        position: fixed;
        left: 0.75rem;
        right: 0.75rem;
        bottom: calc(4.25rem + env(safe-area-inset-bottom, 0px) + 0.75rem);
        z-index: 45;
        max-height: min(70vh, 32rem);
        overflow-y: auto;
        margin: 0;
        transform: translateY(calc(100% + 6rem));
        visibility: hidden;
        pointer-events: none;
        transition: transform 0.22s ease, visibility 0.22s;
      }

      #questionToolsSection.sheet-open {
        transform: translateY(0);
        visibility: visible;
        pointer-events: auto;
      }

      .mobile-more-sheet {
        display: block;
        position: fixed;
        left: 0.75rem;
        right: 0.75rem;
        bottom: calc(4.25rem + env(safe-area-inset-bottom, 0px) + 0.75rem);
        z-index: 45;
        transform: translateY(calc(100% + 6rem));
        visibility: hidden;
        pointer-events: none;
        transition: transform 0.22s ease, visibility 0.22s;
      }

      .mobile-more-sheet.is-open {
        transform: translateY(0);
        visibility: visible;
        pointer-events: auto;
      }

      .mobile-sheet-backdrop.is-open {
        display: block;
        position: fixed;
        inset: 0;
        background: rgba(15, 23, 42, 0.45);
        z-index: 35;
      }

      #cookieConsentBanner {
        bottom: calc(4.25rem + env(safe-area-inset-bottom, 0px));
      }

      .timer-warning {
        color: #b45309;
      }

      .timer-urgent {
        color: #b91c1c;
        animation: mobileTimerPulse 1s ease-in-out infinite;
      }
    }

    @keyframes mobileTimerPulse {
      0%, 100% { opacity: 1; }
      50% { opacity: 0.55; }
    }

    html {
      scroll-behavior: smooth;
    }

    .chapter-section {
      scroll-margin-top: 6.5rem;
    }

    .study-topic.is-hidden {
      display: none !important;
    }

    .chapter-section.is-filtered-empty .chapter-empty {
      display: block;
    }

    .chapter-empty {
      display: none;
    }

    .chapter-nav-link.is-active {
      background: #fbbf24;
      color: #020617;
      border-color: #fbbf24;
    }

    .era-timeline {
      position: relative;
    }

    .era-timeline::before {
      content: "";
      position: absolute;
      left: 1.15rem;
      top: 0.5rem;
      bottom: 0.5rem;
      width: 3px;
      border-radius: 999px;
      background: linear-gradient(180deg, #1e3a8a, #fbbf24, #dc2626);
    }

    @media (min-width: 768px) {
      .era-timeline::before {
        left: 1.4rem;
      }
    }

    .era-dot {
      width: 0.85rem;
      height: 0.85rem;
      border-radius: 999px;
      background: #1e3a8a;
      border: 3px solid #fff;
      box-shadow: 0 0 0 2px #1e3a8a;
      flex-shrink: 0;
      margin-top: 0.45rem;
      position: relative;
      z-index: 1;
    }

    .pop-bar {
      height: 1.35rem;
      border-radius: 999px;
      background: linear-gradient(90deg, #1e3a8a, #3b82f6);
    }