/*
 * runtime-collapsed.css — generated by Phase 3 PR #22.
 *
 * Concatenation of the 6 runtime-injected <style> blocks that previously
 * lived inside app/app.js inject*Styles() helpers (sites 1-5) and the
 * trailing injectFinalLearnQAFinalFramekiller IIFE (site 6).
 *
 * BLOCK ORDER IS LOAD-BEARING: it matches the original CALL order, NOT
 * the original declaration order. Sites 1, 2, 3, 4, 5 all target
 * #learnView #learnExplainToolbar descendants with equal-specificity
 * !important chains, so last-declared wins. Site #4 was called AFTER
 * site #5 (app.js L2447 vs L2446 in the pre-PR file), so its rules
 * must come AFTER site #5's in this file. DO NOT REORDER without
 * reading docs/phase3_plan.md §5.5.
 *
 * Effective load chain after PR #22:
 *   style.css -> ui-friction-v123.css -> inline-styles.css
 *   -> runtime-collapsed.css
 *
 * No template-literal interpolations existed in the original blocks
 * (dynamicCss: false per the plan inventory); the one var(...) reference
 * resolves via the normal cascade.
 */

/* ============================================================
 * Site #1 -- injectStampPaginationStyles
 * Originally app/app.js L1019-1561 (pre-PR #22).
 * ============================================================ */
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToolbar,
    #learnView #learnBody.chapter-overview-split-active #learnExplainToolbar {
      display: block !important;
      position: relative !important;
      padding: 14px 24px !important;
      min-height: 104px !important;
      overflow: visible !important;
    }
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToolbar .learn-toolbar-center,
    #learnView #learnBody.chapter-overview-split-active #learnExplainToolbar .learn-toolbar-center {
      overflow: visible !important;
    }
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToolbar .learn-toolbar-center,
    #learnView #learnBody.chapter-overview-split-active #learnExplainToolbar .learn-toolbar-center {
      display: grid !important;
      position: absolute !important;
      left: 50% !important;
      top: 50% !important;
      transform: translate(-50%, -50%) !important;
      width: 320px !important;
      max-width: 100% !important;
      grid-template-columns: 42px 220px 42px !important;
      gap: 8px !important;
      align-items: center !important;
      justify-content: center !important;
      justify-items: center !important;
      padding: 8px 8px 12px 4px !important;
      z-index: 40 !important;
    }
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToolbar .learn-view-selector,
    #learnView #learnBody.chapter-overview-split-active #learnExplainToolbar .learn-view-selector {
      grid-column: 2 !important;
      grid-row: 1 !important;
      width: 220px !important;
      min-width: 220px !important;
      max-width: 224px !important;
      flex: 0 0 220px !important;
      box-sizing: border-box !important;
      justify-self: center !important;
      display: grid !important;
      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    }
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToolbar .learn-view-btn,
    #learnView #learnBody.chapter-overview-split-active #learnExplainToolbar .learn-view-btn {
      min-width: 0 !important;
      padding: 0 18px !important;
      font-size: 15px !important;
    }
    #learnView .stamp-page-btn,
    #learnView #learnExplainToolbar .stamp-page-btn.lecture-overlay-btn,
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToolbar .stamp-page-btn.lecture-overlay-btn,
    #learnView #learnBody.chapter-overview-split-active #learnExplainToolbar .stamp-page-btn.lecture-overlay-btn {
      position: relative !important;
      inset: auto !important;
      width: 40px !important;
      min-width: 40px !important;
      max-width: 40px !important;
      height: 40px !important;
      min-height: 40px !important;
      max-height: 40px !important;
      padding: 0 !important;
      border-radius: 50% !important;
      background: #fde047 !important;
      border: 3px solid #1e293b !important;
      color: #1e293b !important;
      box-shadow: 3px 3px 0 #1e293b !important;
      display: flex !important;
      align-items: center !important;
      justify-content: center !important;
      cursor: pointer !important;
      transform: none !important;
      opacity: 1 !important;
      filter: none !important;
      overflow: visible !important;
      margin: 0 5px 5px 0 !important;
      grid-row: 1 !important;
      pointer-events: auto !important;
      z-index: 2 !important;
    }
    #learnView .stamp-page-btn.lecture-overlay-btn-left { grid-column: 1 !important; }
    #learnView .stamp-page-btn.lecture-overlay-btn-right { grid-column: 3 !important; }
    #learnView .stamp-page-btn::before,
    #learnView #learnExplainToolbar .stamp-page-btn.lecture-overlay-btn::before {
      content: "" !important;
      position: absolute !important;
      inset: 3px !important;
      left: 3px !important;
      top: 3px !important;
      width: auto !important;
      height: auto !important;
      border: 2px dashed #1e293b !important;
      border-radius: 50% !important;
      background: transparent !important;
      opacity: 0.3 !important;
      transform: none !important;
      transition: transform 0.3s ease !important;
      pointer-events: none !important;
    }
    #learnView .stamp-page-btn::after,
    #learnView #learnExplainToolbar .stamp-page-btn.lecture-overlay-btn::after {
      content: none !important;
      display: none !important;
    }    #learnView .stamp-page-btn:hover:not(:disabled) {
      transform: translate(-2px, -2px) scale(1.04) !important;
      box-shadow: 5px 5px 0 #1e293b !important;
      background: #fff38a !important;
    }
    #learnView .stamp-page-btn:hover:not(:disabled)::before { transform: rotate(15deg) !important; }
    #learnView #learnExplainToolbar .stamp-page-btn.is-flipping,
    #learnView #learnExplainToolbar .lecture-overlay-btn-left.is-flipping,
    #learnView #learnExplainToolbar .lecture-overlay-btn-right.is-flipping {
      transform: translate(2px, 2px) scale(0.96) !important;
      box-shadow: 1px 1px 0 #1e293b !important;
      background: #fff38a !important;
    }
    #learnView .stamp-page-btn:active:not(:disabled) {
      transform: translate(4px, 4px) !important;
      box-shadow: 0 0 0 #1e293b !important;
    }
    #learnView .stamp-page-btn:disabled {
      background: #f1f5f9 !important;
      color: #94a3b8 !important;
      border-color: #cbd5e1 !important;
      box-shadow: 3px 3px 0 #e2e8f0 !important;
      cursor: not-allowed !important;
      opacity: 1 !important;
      filter: none !important;
    }
    #learnView .stamp-page-btn:disabled::before { border-color: #cbd5e1 !important; }
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToggleBtn.learn-explain-toggle-btn,

    #learnView #learnBody.chapter-overview-split-active #learnExplainToggleBtn.learn-explain-toggle-btn{
      position: relative !important;
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
      width: auto !important;
      min-width: 0 !important;
      max-width: none !important;
      border: 3px solid #1e293b !important;
      background: #fdfbf7 !important;
      color: #1e293b !important;
      cursor: pointer !important;
      overflow: visible !important;
      font-family: "Quicksand", "Nunito", sans-serif !important;
      transition: transform 0.15s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.15s cubic-bezier(0.34, 1.56, 0.64, 1), background-color 0.2s ease !important;
      z-index: 45 !important;
    }
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToggleBtn.learn-explain-toggle-btn,
    #learnView #learnBody.chapter-overview-split-active #learnExplainToggleBtn.learn-explain-toggle-btn {
      position: absolute !important;
      top: 50% !important;
      transform: translateY(-50%) rotate(2deg) !important;
    }
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToggleBtn.learn-explain-toggle-btn::before,

    #learnView #learnBody.chapter-overview-split-active #learnExplainToggleBtn.learn-explain-toggle-btn::before{
      content: "" !important;
      position: absolute !important;
      border: 0 !important;
      border-left: 2px dashed rgba(0, 0, 0, 0.1) !important;
      border-radius: 0 !important;
      opacity: 0.9 !important;
      mix-blend-mode: multiply !important;
      transform: rotate(-15deg) !important;
      pointer-events: none !important;
    }
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToggleBtn.learn-explain-toggle-btn::after,

    #learnView #learnBody.chapter-overview-split-active #learnExplainToggleBtn.learn-explain-toggle-btn::after{
      content: none !important;
      display: none !important;
    }
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToggleBtn.learn-explain-toggle-btn .learn-edge-toggle-label,

    #learnView #learnBody.chapter-overview-split-active #learnExplainToggleBtn.learn-explain-toggle-btn .learn-edge-toggle-label{
      position: relative !important;
      z-index: 2 !important;
      display: inline-block !important;
      color: #1e293b !important;
      white-space: nowrap !important;
      letter-spacing: 0 !important;
      text-transform: none !important;
    }
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToggleBtn.learn-explain-toggle-btn .learn-edge-toggle-label::after,

    #learnView #learnBody.chapter-overview-split-active #learnExplainToggleBtn.learn-explain-toggle-btn .learn-edge-toggle-label::after{
      content: "" !important;
      position: absolute !important;
      left: -5% !important;
      width: 110% !important;
      border-radius: 3px !important;
      background: #fde047 !important;
      transform: rotate(-2deg) !important;
      transition: background-color 0.3s ease !important;
      z-index: -1 !important;
      pointer-events: none !important;
    }
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToggleBtn.learn-explain-toggle-btn .learn-edge-toggle-icon,

    #learnView #learnBody.chapter-overview-split-active #learnExplainToggleBtn.learn-explain-toggle-btn .learn-edge-toggle-icon{
      position: relative !important;
      z-index: 2 !important;
      flex: 0 0 auto !important;
      width: 24px !important;
      height: 24px !important;
      border: 0 !important;
      border-radius: 0 !important;
      background: transparent !important;
      color: #1e293b !important;
      box-shadow: none !important;
      transition: transform 0.3s ease !important;
    }
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToggleBtn.learn-explain-toggle-btn .learn-edge-toggle-icon svg,

    #learnView #learnBody.chapter-overview-split-active #learnExplainToggleBtn.learn-explain-toggle-btn .learn-edge-toggle-icon svg{
      width: 24px !important;
      height: 24px !important;
      stroke: currentColor !important;
    }
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToggleBtn.learn-explain-toggle-btn:hover .learn-edge-toggle-label::after,

    #learnView #learnBody.chapter-overview-split-active #learnExplainToggleBtn.learn-explain-toggle-btn:hover .learn-edge-toggle-label::after{
      background: #6ee7b7 !important;
    }
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToggleBtn.learn-explain-toggle-btn:hover .learn-edge-toggle-icon,
    #learnView #learnBody.chapter-overview-split-active #learnExplainToggleBtn.learn-explain-toggle-btn:hover .learn-edge-toggle-icon {
      transform: translateX(6px) !important;
    }
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToggleBtn.learn-explain-toggle-btn:active,
    #learnView #learnBody.chapter-overview-split-active #learnExplainToggleBtn.learn-explain-toggle-btn:active {
      transform: translateY(calc(-50% + 4px)) rotate(0deg) !important;
      box-shadow: 0 0 0 #1e293b !important;
    }

    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToggleBtn.learn-explain-toggle-btn .learn-edge-toggle-label,

    #learnView #learnBody.chapter-overview-split-active #learnExplainToggleBtn.learn-explain-toggle-btn .learn-edge-toggle-label{
      font-weight: 800 !important;
    }
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToggleBtn.learn-explain-toggle-btn .learn-edge-toggle-icon svg,

    #learnView #learnBody.chapter-overview-split-active #learnExplainToggleBtn.learn-explain-toggle-btn .learn-edge-toggle-icon svg{
      stroke-width: 3.2 !important;
    }
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToggleBtn.learn-explain-toggle-btn,

    #learnView #learnBody.chapter-overview-split-active #learnExplainToggleBtn.learn-explain-toggle-btn{
      gap: 5px !important;
      height: 32px !important;
      min-height: 32px !important;
      padding: 5px 9px !important;
      border-width: 2px !important;
      border-radius: 9px !important;
      box-shadow: 2px 2px 0 #1e293b !important;
    }
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToggleBtn.learn-explain-toggle-btn,
    #learnView #learnBody.chapter-overview-split-active #learnExplainToggleBtn.learn-explain-toggle-btn {
      left: 12px !important;
      right: auto !important;
    }
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToggleBtn.learn-explain-toggle-btn::before,

    #learnView #learnBody.chapter-overview-split-active #learnExplainToggleBtn.learn-explain-toggle-btn::before{
      top: -6px !important;
      left: -6px !important;
      width: 30px !important;
      height: 11px !important;
      background: repeating-linear-gradient(90deg, #f9a8d4, #f9a8d4 4px, rgba(255,255,255,0.42) 4px, rgba(255,255,255,0.42) 8px) !important;
    }
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToggleBtn.learn-explain-toggle-btn .learn-edge-toggle-label,

    #learnView #learnBody.chapter-overview-split-active #learnExplainToggleBtn.learn-explain-toggle-btn .learn-edge-toggle-label{
      font-size: 12px !important;
      line-height: 1 !important;
    }
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToggleBtn.learn-explain-toggle-btn .learn-edge-toggle-label::after,

    #learnView #learnBody.chapter-overview-split-active #learnExplainToggleBtn.learn-explain-toggle-btn .learn-edge-toggle-label::after{
      bottom: 0 !important;
      height: 7px !important;
    }
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToggleBtn.learn-explain-toggle-btn .learn-edge-toggle-icon,

    #learnView #learnBody.chapter-overview-split-active #learnExplainToggleBtn.learn-explain-toggle-btn .learn-edge-toggle-icon,

    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToggleBtn.learn-explain-toggle-btn .learn-edge-toggle-icon svg,

    #learnView #learnBody.chapter-overview-split-active #learnExplainToggleBtn.learn-explain-toggle-btn .learn-edge-toggle-icon svg{
      width: 14px !important;
      height: 14px !important;
    }
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToggleBtn.learn-explain-toggle-btn:hover,
    #learnView #learnBody.chapter-overview-split-active #learnExplainToggleBtn.learn-explain-toggle-btn:hover {
      transform: translateY(calc(-50% - 1px)) rotate(0deg) !important;
      box-shadow: 3px 3px 0 #1e293b !important;
    }
    #learnView #learnBody:not(.chapter-overview-active) .learn-chat-topbar,
    #learnView #learnBody.chapter-overview-split-active .learn-chat-topbar {
      position: absolute !important;
      top: 18px !important;
      left: auto !important;
      right: 12px !important;
      width: max-content !important;
      min-width: 0 !important;
      max-width: calc(100% - 24px) !important;
      display: flex !important;
      justify-content: flex-end !important;
      align-items: center !important;
      padding: 0 !important;
      margin: 0 !important;
      background: transparent !important;
      border: 0 !important;
      border-bottom: 0 !important;
      box-shadow: none !important;
      backdrop-filter: none !important;
      -webkit-backdrop-filter: none !important;
      pointer-events: none !important;
      transform: none !important;
    }
    #learnView #learnBody:not(.chapter-overview-active) .learn-chat-topbar::before,
    #learnView #learnBody:not(.chapter-overview-active) .learn-chat-topbar::after,
    #learnView #learnBody.chapter-overview-split-active .learn-chat-topbar::before,
    #learnView #learnBody.chapter-overview-split-active .learn-chat-topbar::after {
      content: none !important;
      display: none !important;
    }

    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToolbar .learn-toolbar-center,
    #learnView #learnBody.chapter-overview-split-active #learnExplainToolbar .learn-toolbar-center {
      pointer-events: none !important;
    }
    #learnView #learnExplainToolbar {
      position: relative !important;
      z-index: 120 !important;
      pointer-events: none !important;
      isolation: isolate !important;
    }
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToolbar .learn-view-selector,
    #learnView #learnBody.chapter-overview-split-active #learnExplainToolbar .learn-view-selector,
    #learnView #learnExplainToolbar .learn-view-selector {
      position: relative !important;
      z-index: 90 !important;
      pointer-events: auto !important;
      isolation: isolate !important;
    }
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToolbar .learn-view-btn,
    #learnView #learnBody.chapter-overview-split-active #learnExplainToolbar .learn-view-btn,
    #learnView #learnExplainToolbar .learn-view-btn {
      position: relative !important;
      z-index: 91 !important;
      pointer-events: auto !important;
      cursor: pointer !important;
    }
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToolbar .lecture-overlay-btn-left,

    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToolbar .lecture-overlay-btn-right,

    #learnView #learnBody.chapter-overview-split-active #learnExplainToolbar .lecture-overlay-btn-left,

    #learnView #learnBody.chapter-overview-split-active #learnExplainToolbar .lecture-overlay-btn-right,

    #learnView #learnExplainToolbar .lecture-overlay-btn-left,

    #learnView #learnExplainToolbar .lecture-overlay-btn-right,

    #learnView #learnExplainToolbar #learnExplainToggleBtn{
      position: relative !important;
      z-index: 80 !important;
      pointer-events: auto !important;
    }

/* ============================================================
 * Site #2 -- injectFinalScrapbookToolbarStyles
 * Originally app/app.js L1575-1784 (pre-PR #22).
 * ============================================================ */
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToolbar,
    #learnView #learnBody.chapter-overview-split-active #learnExplainToolbar,
    #learnView #learnExplainToolbar {
      grid-template-columns: 1fr auto auto auto 1fr !important;
      align-items: center !important;
      column-gap: 14px !important;
    }

    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToolbar .learn-toolbar-center,
    #learnView #learnBody.chapter-overview-split-active #learnExplainToolbar .learn-toolbar-center,
    #learnView #learnExplainToolbar .learn-toolbar-center {
      position: absolute !important;
      left: calc(50% + 36px) !important;
      top: 50% !important;
      transform: translate(-50%, -50%) !important;
      align-items: center !important;
      justify-content: center !important;
      gap: 14px !important;
      width: auto !important;
      max-width: none !important;
      padding: 0 !important;
      margin: 0 !important;
      overflow: visible !important;
      z-index: 70 !important;
    }

    #learnView #learnBody:not(.chapter-overview-active) #learnViewSelector,
    #learnView #learnBody.chapter-overview-split-active #learnViewSelector,
    #learnView #learnViewSelector {
      grid-column: auto !important;
      justify-self: auto !important;
      order: 2 !important;
      position: relative !important;
    }

    #learnView #learnExplainToolbar .learn-kp-nav,
    #learnView #learnExplainToolbar #learnKpPrevBtn,
    #learnView #learnExplainToolbar #learnKpNextBtn {
      display: none !important;
      visibility: hidden !important;
      pointer-events: none !important;
    }











/* ============================================================
 * Site #3 -- injectFinalPagerArrowStyles
 * Originally app/app.js L1796-1868 (pre-PR #22).
 * ============================================================ */
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToolbar .lecture-overlay-btn-left::before,
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToolbar .lecture-overlay-btn-right::before,
    #learnView #learnBody.chapter-overview-split-active #learnExplainToolbar .lecture-overlay-btn-left::before,
    #learnView #learnBody.chapter-overview-split-active #learnExplainToolbar .lecture-overlay-btn-right::before,
    #learnView .stamp-page-btn::before {
      content: none !important;
      display: none !important;
      border: 0 !important;
      background: transparent !important;
      opacity: 0 !important;
    }/* ============================================================
 * Site #5 -- injectCenteredLectureToolbarStyles
 * Originally app/app.js L2031-2433 (pre-PR #22).
 * ============================================================ */
    #learnView #learnExplainCol {
      position: relative !important;
      overflow: visible !important;
    }

    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToolbar,
    #learnView #learnBody.chapter-overview-split-active #learnExplainToolbar,
    #learnView #learnExplainToolbar {
      position: relative !important;
      display: none !important;
      height: 0 !important;
      min-height: 0 !important;
      max-height: 0 !important;
      padding: 0 !important;
      margin: 0 !important;
      border: 0 !important;
      overflow: hidden !important;
      pointer-events: none !important;
    }

    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToolbar .learn-toolbar-center,
    #learnView #learnBody.chapter-overview-split-active #learnExplainToolbar .learn-toolbar-center,
    #learnView #learnExplainToolbar .learn-toolbar-center {
      display: none !important;
      pointer-events: none !important;
    }

    #learnView #learnBody:not(.chapter-overview-active) #learnViewSelector,
    #learnView #learnBody.chapter-overview-split-active #learnViewSelector,
    #learnView #learnViewSelector {
      width: auto !important;
      min-width: 0 !important;
      max-width: none !important;
      flex: 0 0 auto !important;
      pointer-events: auto !important;
      z-index: 92 !important;
    }











    #learnView #learnExplainToggleBtn.learn-explain-toggle-btn {
      pointer-events: auto !important;
      z-index: 94 !important;
    }

    @container lecture-panel (max-width: 720px) {
      #learnView #learnBody:not(.chapter-overview-active) #learnExplainToolbar .learn-toolbar-center,
      #learnView #learnBody.chapter-overview-split-active #learnExplainToolbar .learn-toolbar-center,
      #learnView #learnExplainToolbar .learn-toolbar-center {
        grid-template-columns: 72px clamp(188px, 48cqi, 260px) 72px !important;
        gap: 10px !important;
        max-width: calc(100% - 112px) !important;
      }

      #learnView #learnBody:not(.chapter-overview-active) #learnViewSelector,
      #learnView #learnBody.chapter-overview-split-active #learnViewSelector,
      #learnView #learnViewSelector {
        width: clamp(188px, 48cqi, 260px) !important;
        min-width: 188px !important;
        max-width: 260px !important;
      }


    }    @container lecture-panel (max-width: 760px) {
      #learnView #learnExplainToggleBtn.learn-explain-toggle-btn {
        left: 12px !important;
        width: 34px !important;
        min-width: 34px !important;
        max-width: 34px !important;
        height: 34px !important;
        min-height: 34px !important;
        max-height: 34px !important;
        padding: 0 !important;
        border-radius: 9px !important;
        overflow: visible !important;
      }

      #learnView #learnExplainToggleBtn.learn-explain-toggle-btn .learn-edge-toggle-label {
        display: none !important;
        visibility: hidden !important;
      }

      #learnView #learnExplainToggleBtn.learn-explain-toggle-btn .learn-edge-toggle-icon,
      #learnView #learnExplainToggleBtn.learn-explain-toggle-btn .learn-edge-toggle-icon svg {
        width: 16px !important;
        height: 16px !important;
      }
    }

    #learnView #learnExplainToolbar .learn-toolbar-center,
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToolbar .learn-toolbar-center,
    #learnView #learnBody.chapter-overview-split-active #learnExplainToolbar .learn-toolbar-center {
      grid-template-columns: 64px clamp(216px, 24vw, 300px) 64px !important;
    }

    #learnView #learnViewSelector,
    #learnView #learnBody:not(.chapter-overview-active) #learnViewSelector,
    #learnView #learnBody.chapter-overview-split-active #learnViewSelector {
      width: clamp(216px, 24vw, 300px) !important;
      min-width: 216px !important;
      max-width: 300px !important;
    }








    #learnView #learnExplainCol {
      container-type: inline-size !important;
      container-name: lecture-panel !important;
    }

    @container lecture-panel (max-width: 760px) {
      #learnView #learnExplainToolbar .learn-toolbar-center,
      #learnView #learnBody:not(.chapter-overview-active) #learnExplainToolbar .learn-toolbar-center,
      #learnView #learnBody.chapter-overview-split-active #learnExplainToolbar .learn-toolbar-center {
        grid-template-columns: 84px clamp(188px, 45cqi, 228px) 58px !important;
        gap: 8px !important;
        max-width: calc(100% - 64px) !important;
      }

      #learnView #learnViewSelector,
      #learnView #learnBody:not(.chapter-overview-active) #learnViewSelector,
      #learnView #learnBody.chapter-overview-split-active #learnViewSelector {
        width: clamp(188px, 45cqi, 228px) !important;
        min-width: 188px !important;
        max-width: 228px !important;
      }





      #learnView #learnExplainToggleBtn.learn-explain-toggle-btn,
      #learnView #learnBody:not(.chapter-overview-active) #learnExplainToggleBtn.learn-explain-toggle-btn,
      #learnView #learnBody.chapter-overview-split-active #learnExplainToggleBtn.learn-explain-toggle-btn {
        left: 12px !important;
        width: 34px !important;
        min-width: 34px !important;
        max-width: 34px !important;
        height: 34px !important;
        min-height: 34px !important;
        max-height: 34px !important;
        padding: 0 !important;
        gap: 0 !important;
      }

      #learnView #learnExplainToggleBtn.learn-explain-toggle-btn .learn-edge-toggle-label,
      #learnView #learnBody:not(.chapter-overview-active) #learnExplainToggleBtn.learn-explain-toggle-btn .learn-edge-toggle-label,
      #learnView #learnBody.chapter-overview-split-active #learnExplainToggleBtn.learn-explain-toggle-btn .learn-edge-toggle-label {
        display: none !important;
        visibility: hidden !important;
        width: 0 !important;
        max-width: 0 !important;
        overflow: hidden !important;
      }    }

/* ============================================================
 * Site #4 -- injectFinalPagerTextArrowFix
 * Originally app/app.js L1880-2021 (pre-PR #22).
 * ============================================================ */
    #learnView #learnExplainToolbar .learn-toolbar-center,
    #learnView #learnBody:not(.chapter-overview-active) #learnExplainToolbar .learn-toolbar-center,
    #learnView #learnBody.chapter-overview-split-active #learnExplainToolbar .learn-toolbar-center {
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
      gap: clamp(12px, 1.4vw, 18px) !important;
      width: auto !important;
      max-width: calc(100% - 96px) !important;
      overflow: visible !important;
    }







/* ============================================================
 * Site #6 -- injectFinalLearnQAFinalFramekiller (IIFE)
 * Originally app/app.js L10449-11120 (pre-PR #22).
 * ============================================================ */
    #learnView #learnChatCol,
    #learnView #learnBody:not(.chapter-overview-active) #learnChatCol,
    #learnView #learnBody.chapter-overview-split-active #learnChatCol,
    #learnView #learnBody[data-panel-focus="normal"] #learnChatCol,
    #learnView #learnBody[data-panel-focus="qa-wide"] #learnChatCol,
    #learnView #learnBody[data-panel-focus="qa-full"] #learnChatCol {
      position: relative !important;
      isolation: isolate !important;
      display: flex !important;
      flex-direction: column !important;
      min-width: 0 !important;
      min-height: 0 !important;
      padding: 0 !important;
      gap: 0 !important;
      overflow: hidden !important;
      border: 0 !important;
      border-left: 0 !important;
      border-radius: 0 !important;
      box-shadow: none !important;
      background: var(--theme-page-surface-soft) !important;
      background-image: var(--theme-page-surface-soft) !important;
    }

    #learnView #learnBody.chat-collapsed #learnChatCol {
      display: none !important;
      width: 0 !important;
      min-width: 0 !important;
      max-width: 0 !important;
      padding: 0 !important;
      margin: 0 !important;
      border: 0 !important;
      box-shadow: none !important;
      background: none !important;
      background-image: none !important;
      opacity: 0 !important;
      pointer-events: none !important;
      overflow: hidden !important;
    }

    #learnView #learnBody.chat-collapsed #learnChatCol::before,
    #learnView #learnBody.chat-collapsed #learnChatCol::after,
    #learnView #learnChatCol::before,
    #learnView #learnChatCol::after {
      content: none !important;
      display: none !important;
    }

    #learnView #learnChatCol .ambient-background,
    #learnView #learnChatCol .orb-edu-blue,
    #learnView #learnChatCol .orb-edu-green,
    #learnView #learnChatCol .learn-chat-topbar {
      display: none !important;
    }

    #learnView #learnChatCol .learn-chat-scroll,
    #learnView #learnChatCol.is-chat-active #learnChatScroll,
    #learnView #learnChatScroll.is-chat-active {
      position: relative !important;
      z-index: 1 !important;
      flex: 1 1 auto !important;
      width: 100% !important;
      max-width: none !important;
      min-height: 0 !important;
      margin: 0 !important;
      padding: clamp(96px, 14vh, 156px) clamp(24px, 5vw, 72px) 24px !important;
      display: flex !important;
      flex-direction: column !important;
      align-items: stretch !important;
      justify-content: center !important;
      overflow-y: auto !important;
      overflow-x: visible !important;
      background: transparent !important;
      background-image: none !important;
      border: 0 !important;
      border-radius: 0 !important;
      box-shadow: none !important;
      backdrop-filter: none !important;
      -webkit-backdrop-filter: none !important;
    }

    #learnView #learnChatCol .learn-chat-empty-state,
    #learnView #learnChatCol #learnChatEmptyState,
    #learnView #learnChatCol .edu-tutor-empty {
      position: relative !important;
      inset: auto !important;
      z-index: 2 !important;
      width: 100% !important;
      max-width: none !important;
      min-height: 0 !important;
      height: auto !important;
      margin: auto 0 !important;
      padding: 0 !important;
      display: flex !important;
      flex-direction: column !important;
      align-items: center !important;
      justify-content: center !important;
      gap: 0 !important;
      text-align: center !important;
      color: #0f172a !important;
      background: transparent !important;
      background-image: none !important;
      border: 0 !important;
      border-radius: 0 !important;
      box-shadow: none !important;
      pointer-events: none !important;
    }

    #learnView #learnChatCol #learnChatEmptyState.hidden,
    #learnView #learnChatCol.is-chat-active #learnChatEmptyState,
    #learnView #learnChatCol.is-chat-active .learn-chat-empty-state {
      display: none !important;
      visibility: hidden !important;
      opacity: 0 !important;
      pointer-events: none !important;
      width: 0 !important;
      height: 0 !important;
      min-height: 0 !important;
      padding: 0 !important;
      margin: 0 !important;
    }

    #learnView #learnChatCol .widget-icon {
      width: 28px !important;
      height: 28px !important;
      margin: 0 0 18px !important;
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
      color: #0284c7 !important;
      background: transparent !important;
      border: 0 !important;
      box-shadow: none !important;
    }

    #learnView #learnChatCol .qa-hero-icon,
    #learnView #learnChatCol .qa-hero-icon svg {
      width: 28px !important;
      height: 28px !important;
      display: block !important;
    }

    #learnView #learnChatCol .empty-title {
      margin: 0 !important;
      color: #0f172a !important;
      font-family: "Source Serif 4", "Bricolage Grotesque", "Inter", sans-serif !important;
      font-size: clamp(24px, 2vw, 30px) !important;
      line-height: 1.14 !important;
      font-weight: 650 !important;
      letter-spacing: 0 !important;
    }

    #learnView #learnChatCol .empty-subtitle {
      margin: 12px 0 0 !important;
      max-width: 560px !important;
      color: #64748b !important;
      font-size: clamp(13px, 0.92vw, 16px) !important;
      line-height: 1.45 !important;
      font-weight: 500 !important;
      letter-spacing: 0 !important;
    }

    #learnView #learnChatCol .tag-group {
      display: flex !important;
      align-items: center !important;
      justify-content: center !important;
      flex-wrap: wrap !important;
      gap: 10px !important;
      margin-top: 16px !important;
    }

    #learnView #learnChatCol .edu-tag {
      min-height: 30px !important;
      display: inline-flex !important;
      align-items: center !important;
      gap: 6px !important;
      padding: 0 13px !important;
      border: 2px solid rgba(255, 255, 255, 0.92) !important;
      border-radius: 999px !important;
      background: rgba(255, 255, 255, 0.62) !important;
      box-shadow: 0 1px 0 rgba(255, 255, 255, 0.92) inset !important;
      font-size: clamp(12px, 0.82vw, 14px) !important;
      font-weight: 750 !important;
      line-height: 1 !important;
      letter-spacing: 0 !important;
      text-transform: none !important;
    }

    #learnView #learnChatCol .edu-tag svg,
    #learnView #learnChatCol .edu-tag .qa-inline-icon,
    #learnView #learnChatCol .edu-tag .qa-inline-icon svg {
      width: 14px !important;
      height: 14px !important;
      margin: 0 !important;
    }

    #learnView #learnChatCol .tag-formula { color: #0369a1 !important; }
    #learnView #learnChatCol .tag-screenshot { color: #7e22ce !important; }
    #learnView #learnChatCol .tag-trap { color: #c2410c !important; }

    #learnView #learnChatCol #learnFollowupBar,
    #learnView #learnBody #learnChatCol #learnFollowupBar,
    #learnView #learnBody[data-panel-focus] #learnChatCol #learnFollowupBar,
    #learnView #learnChatCol #learnFollowupBar:focus-within {
      position: relative !important;
      z-index: 3 !important;
      width: min(820px, calc(100% - 36px)) !important;
      max-width: 820px !important;
      min-height: 112px !important;
      margin: 0 auto clamp(14px, 2.4vh, 26px) !important;
      padding: 14px 18px 16px !important;
      display: block !important;
      overflow: visible !important;
      border: 1px solid rgba(255, 255, 255, 0.66) !important;
      border-radius: 18px !important;
      background: linear-gradient(135deg, rgba(255, 255, 255, 0.46), rgba(255, 255, 255, 0.18)) !important;
      background-image: linear-gradient(135deg, rgba(255, 255, 255, 0.46), rgba(255, 255, 255, 0.18)) !important;
      box-shadow:
        0 30px 78px rgba(20, 118, 156, 0.16),
        0 12px 30px rgba(15, 23, 42, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.86),
        inset 0 -1px 0 rgba(255, 255, 255, 0.22) !important;
      backdrop-filter: blur(34px) saturate(190%) brightness(1.05) !important;
      -webkit-backdrop-filter: blur(34px) saturate(190%) brightness(1.05) !important;
    }

    #learnView #learnChatCol #learnFollowupBar::before,
    #learnView #learnChatCol #learnFollowupBar::after {
      content: "" !important;
      position: absolute !important;
      inset: 1px !important;
      border-radius: inherit !important;
      pointer-events: none !important;
      background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.72), rgba(255, 255, 255, 0.10) 42%, rgba(255, 255, 255, 0.34) 100%) !important;
      opacity: 0.46 !important;
      mix-blend-mode: screen !important;
    }

    #learnView #learnChatCol #learnFollowupBar::after {
      inset: 0 !important;
      background:
        radial-gradient(520px 120px at 18% 0%, rgba(255, 255, 255, 0.48), transparent 70%),
        radial-gradient(420px 120px at 92% 100%, rgba(255, 255, 255, 0.22), transparent 72%) !important;
      opacity: 0.72 !important;
    }

    #learnView #learnChatCol #learnFollowupBar .attach-preview,
    #learnView #learnChatCol #learnFollowupBar .input-wrapper,
    #learnView #learnChatCol #learnFollowupBar .bottom-actions {
      position: relative !important;
      z-index: 1 !important;
    }

    #learnView #learnChatCol #learnFollowupBar .input-wrapper,
    #learnView #learnChatCol #learnFollowupBar .input-wrapper:focus-within {
      display: grid !important;
      grid-template-columns: 40px minmax(0, 1fr) 40px !important;
      align-items: center !important;
      gap: 10px !important;
      width: 100% !important;
      min-height: 44px !important;
      margin: 0 !important;
      padding: 0 !important;
      background: transparent !important;
      background-image: none !important;
      border: 0 !important;
      border-radius: 0 !important;
      box-shadow: none !important;
      outline: 0 !important;
    }

    #learnView #learnChatCol #learnFollowupBar .btn-clip,
    #learnView #learnChatCol #learnFollowupBar .btn-send {
      width: 38px !important;
      min-width: 38px !important;
      height: 38px !important;
      min-height: 38px !important;
      padding: 0 !important;
      border-radius: 12px !important;
      box-shadow: none !important;
      transform: none !important;
    }

    #learnView #learnChatCol #learnFollowupBar .btn-clip {
      color: #94a3b8 !important;
      background: transparent !important;
      border: 0 !important;
    }

    #learnView #learnChatCol #learnFollowupBar .btn-send {
      position: relative !important;
      top: auto !important;
      right: auto !important;
      color: #ffffff !important;
      border: 1px solid rgba(255, 255, 255, 0.46) !important;
      background: linear-gradient(135deg, rgba(14, 165, 233, 0.78), rgba(37, 99, 235, 0.58)) !important;
      box-shadow: 0 14px 28px rgba(14, 165, 233, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.42) !important;
      backdrop-filter: blur(18px) saturate(160%) !important;
      -webkit-backdrop-filter: blur(18px) saturate(160%) !important;
    }

    #learnView #learnChatCol #learnFollowupBar .input-field {
      min-height: 40px !important;
      max-height: 96px !important;
      padding: 8px 6px !important;
      color: #0f172a !important;
      font-size: clamp(14px, 0.95vw, 16px) !important;
      font-weight: 500 !important;
      line-height: 1.35 !important;
      background: transparent !important;
      border: 0 !important;
      outline: 0 !important;
      box-shadow: none !important;
      resize: none !important;
    }

    #learnView #learnChatCol #learnFollowupBar .input-field::placeholder {
      color: #94a3b8 !important;
      font-weight: 600 !important;
    }

    #learnView #learnChatCol #learnFollowupBar .bottom-actions {
      display: flex !important;
      align-items: center !important;
      justify-content: flex-end !important;
      gap: 10px !important;
      flex-wrap: wrap !important;
      margin-top: 8px !important;
      padding: 0 !important;
      overflow: visible !important;
    }

    #learnView #learnChatCol #learnFollowupBar .edu-mode-toggle,
    #learnView #learnChatCol #learnFollowupBar #webSearchToggleBtnLearn {
      height: 38px !important;
      min-height: 38px !important;
      padding: 0 15px !important;
      border: 1px solid rgba(255, 255, 255, 0.62) !important;
      border-radius: 14px !important;
      background: linear-gradient(135deg, rgba(255, 255, 255, 0.50), rgba(255, 255, 255, 0.22)) !important;
      background-image: linear-gradient(135deg, rgba(255, 255, 255, 0.50), rgba(255, 255, 255, 0.22)) !important;
      box-shadow:
        0 14px 34px rgba(148, 47, 62, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.78),
        inset 0 -1px 0 rgba(255, 255, 255, 0.18) !important;
      backdrop-filter: blur(22px) saturate(175%) !important;
      -webkit-backdrop-filter: blur(22px) saturate(175%) !important;
    }

    #learnView #learnChatCol #learnFollowupBar .edu-mode-toggle {
      color: #475569 !important;
      gap: 6px !important;
    }

    #learnView #learnChatCol #learnFollowupBar #webSearchToggleBtnLearn {
      width: 44px !important;
      min-width: 44px !important;
      padding: 0 !important;
    }

    #learnView #learnChatCol .edu-mode-menu {
      width: min(292px, calc(100vw - 48px)) !important;
      min-width: 256px !important;
      right: 58px !important;
      bottom: calc(100% + 14px) !important;
      padding: 10px !important;
      border-radius: 22px !important;
      background: linear-gradient(135deg, rgba(255, 255, 255, 0.58), rgba(255, 255, 255, 0.24)) !important;
      background-image: linear-gradient(135deg, rgba(255, 255, 255, 0.58), rgba(255, 255, 255, 0.24)) !important;
      backdrop-filter: blur(30px) saturate(190%) brightness(1.05) !important;
      -webkit-backdrop-filter: blur(30px) saturate(190%) brightness(1.05) !important;
      border: 1px solid rgba(255, 255, 255, 0.68) !important;
      box-shadow:
        0 26px 62px rgba(20, 118, 156, 0.18),
        0 10px 26px rgba(15, 23, 42, 0.10),
        inset 0 1px 0 rgba(255, 255, 255, 0.86),
        inset 0 -1px 0 rgba(255, 255, 255, 0.20) !important;
      display: flex !important;
      flex-direction: column !important;
      gap: 7px !important;
      opacity: 0 !important;
      pointer-events: none !important;
      transform: translateY(10px) scale(0.96) !important;
      transform-origin: bottom right !important;
      transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
      z-index: 300 !important;
    }

    #learnView #learnChatCol .edu-mode-menu.show {
      opacity: 1 !important;
      pointer-events: auto !important;
      transform: translateY(0) scale(1) !important;
    }

    #learnView #learnChatCol .edu-mode-option {
      width: 100% !important;
      display: flex !important;
      align-items: flex-start !important;
      gap: 13px !important;
      min-height: 66px !important;
      padding: 12px 14px !important;
      border: 1px solid transparent !important;
      border-radius: 16px !important;
      background: transparent !important;
      text-align: left !important;
      cursor: pointer !important;
      transition: all 0.2s ease !important;
    }

    #learnView #learnChatCol .edu-mode-option:hover:not(.selected) {
      border-color: rgba(255, 255, 255, 0.42) !important;
      background: linear-gradient(135deg, rgba(255, 255, 255, 0.38), rgba(255, 255, 255, 0.14)) !important;
    }

    #learnView #learnChatCol .edu-mode-option.selected {
      border-color: rgba(255, 255, 255, 0.58) !important;
      background: linear-gradient(135deg, rgba(255, 255, 255, 0.54), rgba(224, 242, 254, 0.36)) !important;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.78),
        0 10px 24px rgba(14, 165, 233, 0.10) !important;
    }

    #learnView #learnChatCol .edu-mode-icon {
      width: 20px !important;
      min-width: 20px !important;
      height: 20px !important;
      min-height: 20px !important;
      display: flex !important;
      align-items: center !important;
      justify-content: center !important;
      font-size: 20px !important;
      line-height: 1 !important;
      flex-shrink: 0 !important;
    }

    #learnView #learnChatCol .edu-mode-icon i {
      display: block !important;
      font-size: 20px !important;
      line-height: 1 !important;
    }

    #learnView #learnChatCol .icon-fast { color: #f59e0b !important; }
    #learnView #learnChatCol .icon-balanced { color: #0284c7 !important; }
    #learnView #learnChatCol .icon-detailed { color: #8b5cf6 !important; }

    #learnView #learnChatCol .edu-mode-text {
      display: flex !important;
      flex-direction: column !important;
      gap: 4px !important;
      min-width: 0 !important;
    }

    #learnView #learnChatCol .edu-mode-text strong {
      color: #0f172a !important;
      font-size: 14px !important;
      font-weight: 700 !important;
      line-height: 1.16 !important;
    }

    #learnView #learnChatCol .edu-mode-text small {
      color: #64748b !important;
      font-size: 12px !important;
      font-weight: 500 !important;
      line-height: 1.3 !important;
    }

    #learnView #learnChatCol #learnFollowupBar .edu-mode-toggle:hover {
      color: #0284c7 !important;
      border-color: #bae6fd !important;
      box-shadow: 0 4px 8px rgba(2, 132, 199, 0.08) !important;
    }

    #learnView #learnChatCol #webSearchToggleBtnLearn.network-on,
    #learnView #learnChatCol .network-on {
      background: #e0f2fe !important;
      border-color: #bae6fd !important;
      color: #0284c7 !important;
      box-shadow: 0 2px 8px rgba(2, 132, 199, 0.15) !important;
    }

    #learnView #learnChatCol #webSearchToggleBtnLearn.network-off,
    #learnView #learnChatCol .network-off {
      background: rgba(255, 255, 255, 0.4) !important;
      border-color: transparent !important;
      color: #94a3b8 !important;
      box-shadow: none !important;
    }

    #learnView #learnChatCol #webSearchToggleBtnLearn .qa-inline-icon,
    #learnView #learnChatCol #learnModeCurrentIcon {
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
      line-height: 1 !important;
      transform: none !important;
    }

    #learnView #learnChatCol.is-chat-active {
      padding: 0 0 18px !important;
      overflow: hidden !important;
    }

    #learnView #learnChatCol.is-chat-active #learnChatScroll {
      justify-content: flex-start !important;
      padding-top: 24px !important;
      padding-inline: 0 !important;
    }

    #learnView #learnChatCol.is-chat-active #learnChatContent {
      display: flex !important;
      flex: 1 1 auto !important;
      width: 100% !important;
      max-width: none !important;
      min-height: 0 !important;
      margin: 0 !important;
      align-self: stretch !important;
      justify-content: flex-start !important;
      align-items: stretch !important;
      gap: 18px !important;
      box-sizing: border-box !important;
      padding: 0 clamp(24px, 4vw, 48px) 18px !important;
    }

    #learnView #learnChatContent.is-chat-active .followup-bubble,
    #learnView #learnChatCol.is-chat-active #learnChatContent .followup-bubble {
      width: 100% !important;
      margin: 0 !important;
    }

    #learnView #learnChatCol.is-chat-active .followup-bubble::before,
    #learnView #learnChatCol.is-chat-active .followup-bubble .fub-a::before {
      content: none !important;
      display: none !important;
    }

    #learnView #learnChatCol.is-chat-active .followup-bubble .fub-a {
      padding: 0 !important;
      border: 0 !important;
      border-radius: 0 !important;
      background: transparent !important;
      background-image: none !important;
      box-shadow: none !important;
      overflow: visible !important;
    }

    #learnView#learnView #learnBody#learnBody #learnChatCol#learnChatCol #learnFollowupBar#learnFollowupBar,
    #learnView#learnView #learnBody#learnBody:not(.explain-collapsed):not(.chat-collapsed) #learnChatCol#learnChatCol #learnFollowupBar#learnFollowupBar,
    #learnView#learnView #learnBody#learnBody.explain-collapsed:not(.chat-collapsed) #learnChatCol#learnChatCol #learnFollowupBar#learnFollowupBar,
    #learnView#learnView #learnBody#learnBody[data-panel-focus="normal"] #learnChatCol#learnChatCol #learnFollowupBar#learnFollowupBar,
    #learnView#learnView #learnBody#learnBody[data-panel-focus="qa-wide"] #learnChatCol#learnChatCol #learnFollowupBar#learnFollowupBar,
    #learnView#learnView #learnBody#learnBody[data-panel-focus="qa-full"] #learnChatCol#learnChatCol #learnFollowupBar#learnFollowupBar {
      position: relative !important;
      width: min(820px, calc(100% - 36px)) !important;
      max-width: 820px !important;
      min-height: 112px !important;
      margin: 0 auto clamp(14px, 2.4vh, 26px) !important;
      padding: 14px 18px 16px !important;
      display: block !important;
      overflow: visible !important;
      border: 1px solid rgba(255, 255, 255, 0.66) !important;
      border-radius: 18px !important;
      background: linear-gradient(135deg, rgba(255, 255, 255, 0.46), rgba(255, 255, 255, 0.18)) !important;
      background-image: linear-gradient(135deg, rgba(255, 255, 255, 0.46), rgba(255, 255, 255, 0.18)) !important;
      box-shadow:
        0 30px 78px rgba(20, 118, 156, 0.16),
        0 12px 30px rgba(15, 23, 42, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.86),
        inset 0 -1px 0 rgba(255, 255, 255, 0.22) !important;
      backdrop-filter: blur(34px) saturate(190%) brightness(1.05) !important;
      -webkit-backdrop-filter: blur(34px) saturate(190%) brightness(1.05) !important;
      filter: none !important;
      transform: none !important;
    }

    #learnView#learnView #learnBody#learnBody #learnChatCol#learnChatCol .empty-title.empty-title {
      font-size: clamp(24px, 2vw, 30px) !important;
    }

    #learnView#learnView #learnBody#learnBody #learnChatCol#learnChatCol #learnFollowupBar#learnFollowupBar .input-wrapper,
    #learnView#learnView #learnBody#learnBody #learnChatCol#learnChatCol #learnFollowupBar#learnFollowupBar .input-wrapper:focus-within {
      display: grid !important;
      grid-template-columns: 40px minmax(0, 1fr) 40px !important;
      min-height: 44px !important;
      padding: 0 !important;
      background: transparent !important;
      border: 0 !important;
      box-shadow: none !important;
    }

    #learnView#learnView #learnBody#learnBody #learnChatCol#learnChatCol #learnFollowupBar#learnFollowupBar .input-field {
      min-height: 40px !important;
      max-height: 86px !important;
      font-size: 14px !important;
      font-weight: 500 !important;
    }

    #learnView#learnView #learnBody#learnBody #learnChatCol#learnChatCol #learnFollowupBar#learnFollowupBar .bottom-actions {
      position: relative !important;
      right: auto !important;
      bottom: auto !important;
      margin-top: 8px !important;
      gap: 10px !important;
    }

    #learnView #learnBody:not(.chat-collapsed) #learnChatCol:not(.is-chat-active) #learnChatEmptyState,
    #learnView #learnBody:not(.chat-collapsed) #learnChatCol:not(.is-chat-active) .learn-chat-empty-state.edu-tutor-empty,
    #learnView#learnView #learnBody#learnBody:not(.chat-collapsed) #learnChatCol#learnChatCol:not(.is-chat-active) #learnChatEmptyState {
      transform: translateY(clamp(38px, 5.2vh, 62px)) !important;
    }

    #learnView #learnChatCol #learnFollowupBar,
    #learnView #learnBody #learnChatCol #learnFollowupBar,
    #learnView #learnBody[data-panel-focus] #learnChatCol #learnFollowupBar,
    #learnView#learnView #learnBody#learnBody #learnChatCol#learnChatCol #learnFollowupBar#learnFollowupBar {
      transform: none !important;
      will-change: translate, box-shadow, border-color !important;
    }

    #learnView #learnChatCol #learnFollowupBar:focus-within,
    #learnView #learnBody #learnChatCol #learnFollowupBar:focus-within,
    #learnView #learnBody[data-panel-focus] #learnChatCol #learnFollowupBar:focus-within,
    #learnView#learnView #learnBody#learnBody #learnChatCol#learnChatCol #learnFollowupBar#learnFollowupBar:focus-within {
      border-color: rgba(255, 255, 255, 0.78) !important;
      box-shadow:
        0 30px 74px rgba(20, 118, 156, 0.18),
        0 12px 30px rgba(15, 23, 42, 0.09),
        inset 0 1px 0 rgba(255, 255, 255, 0.90),
        inset 0 -1px 0 rgba(255, 255, 255, 0.26) !important;
      animation: learn-qa-composer-focus-bounce 360ms cubic-bezier(0.2, 0.9, 0.22, 1.18) both !important;
    }

    @keyframes learn-qa-composer-focus-bounce {
      0% {
        translate: 0 0;
      }

      38% {
        translate: 0 -5px;
      }

      72% {
        translate: 0 1.5px;
      }

      100% {
        translate: 0 0;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      #learnView #learnChatCol #learnFollowupBar:focus-within,
      #learnView #learnBody #learnChatCol #learnFollowupBar:focus-within,
      #learnView #learnBody[data-panel-focus] #learnChatCol #learnFollowupBar:focus-within,
      #learnView#learnView #learnBody#learnBody #learnChatCol#learnChatCol #learnFollowupBar#learnFollowupBar:focus-within {
        animation: none !important;
      }
    }

    #learnView #learnBody #learnChatCol #learnChatEmptyState .tag-group,
    #learnView #learnBody #learnChatCol .learn-chat-empty-state.edu-tutor-empty .tag-group,
    #learnView #learnChatCol #learnChatEmptyState .tag-group,
    #learnView #learnChatCol .edu-tutor-empty .tag-group {
      margin-top: 12px !important;
      transform: translateY(-22px) !important;
    }

    #learnView #learnBody #learnChatCol #learnChatEmptyState .edu-tag,
    #learnView #learnBody #learnChatCol .learn-chat-empty-state.edu-tutor-empty .edu-tag,
    #learnView #learnChatCol #learnChatEmptyState .edu-tag,
    #learnView #learnChatCol .edu-tutor-empty .edu-tag {
      transform: none !important;
    }

