@media (max-width:520px){
    .founder-byline{ font-size:0.62rem; padding:4px 11px; text-align:center; }
  }

  @media (max-width: 900px){ .torch{ display:none; } }

  @media (max-width: 640px){ .shift-badge{ font-size:0.48rem; top:2px; right:3px; } }

  @media (max-width:640px){
    .race-text{ font-size:1.4rem; line-height:1.85; }
    .race-countdown{ font-size:3rem; }
    .race-result-grid{ grid-template-columns:1fr 1fr; }
  }

  @media (prefers-reduced-motion: reduce){
    .race-panel, .race-result-overlay, .race-result-card, .race-countdown.pulse, .race-ember,
    .race-track-fill, .race-toggle-btn{ animation:none !important; transition:none !important; }
  }

  /* Quick Guide Dock - Fixed Obsidian HUD Anchor (Stays firmly in place) */
  .guide-dock{
    display:flex;
    position:fixed;
    left:14px;
    top:72px;
    width:min(320px, calc(100vw - 28px));
    max-height:calc(100vh - 86px);
    z-index:90;
    margin:0;
    box-sizing:border-box;
    contain:layout style;
    overscroll-behavior:contain;
    box-shadow:0 24px 60px rgba(0,0,0,0.85), 0 0 0 1px rgba(255,209,102,0.22);
  }

  @media(min-width:1200px){
    .guide-dock{
      left:18px;
      top:88px;
      width:300px;
      max-height:calc(100vh - 108px);
      z-index:60;
      box-shadow:0 20px 50px rgba(0,0,0,0.75), 0 0 0 1px rgba(255,209,102,0.14), 0 0 32px rgba(255,209,102,0.06);
    }
  }

  @media(max-width:640px){
    .guide-dock{
      left:10px;
      right:10px;
      width:auto;
      max-width:none;
      top:60px;
      max-height:calc(100vh - 74px);
      z-index:100;
    }
  }

  @media(min-width:1024px){
    .lesson-strip{
      position:fixed;
      right:18px;
      top:90px;
      bottom:auto;
      max-height:calc(100vh - 106px);
      width:360px;
      margin:0;
      z-index:60;
      overflow:hidden;
      backdrop-filter:blur(12px);
      -webkit-backdrop-filter:blur(12px);
      box-shadow:0 12px 40px rgba(0,0,0,0.5), 0 0 0 1px rgba(255,209,102,0.18);
      border-color:rgba(255,209,102,0.25);
      transition:width .28s cubic-bezier(.22,1,.36,1), top .28s ease, bottom .28s ease, max-height .28s ease, box-shadow .28s ease, border-color .28s ease;
    }
    .lesson-strip.expanded{
      top:64px;
      bottom:14px;
      max-height:calc(100vh - 78px);
      width:min(660px, calc(100vw - 760px));
      box-shadow:0 18px 54px rgba(0,0,0,0.7), 0 0 0 1px rgba(255,209,102,0.24);
      border-color:rgba(255,209,102,0.35);
    }
    @media(min-width:1600px){
      .lesson-strip.expanded{
        width:700px;
      }
    }
    html.focus-mode .lesson-strip,
    html.focus-mode .lesson-strip.expanded{
      display:flex !important;
      visibility:visible !important;
      pointer-events:auto !important;
      right:14px !important;
      top:54px !important;
      bottom:auto !important;
      width:258px !important;
      max-height:min(465px, calc(100vh - 70px)) !important;
    }
  }

  @media (max-width: 640px){
    .lesson-char-row{ font-size:1.7rem; }
  }

  @media (max-width: 640px){
    .keyboard{ width:94vw; gap:5px;}
    .manuscript{ width:94vw;}
    .row{ --key-gap:5px; gap:5px;}
    .key{ height:40px; font-size:0.85rem; border-radius:7px;}
    .key.mod, .key.label-key{ font-size:0.6rem;}
    h1{ font-size:1.9rem;}
    .tooltip{ font-size:0.6rem; white-space:normal; max-width:150px;}
  }

  @media (max-width: 640px){
    .session-bar{ width:94vw; }
    .session-stat{ padding:8px 3px; }
    .session-stat-val{ font-size:0.86rem; }
    .session-stat-label{ font-size:0.46rem; }
  }

  @media (prefers-reduced-motion: reduce){
    html:not(.motion-override) *, html:not(.motion-override) *::before, html:not(.motion-override) *::after{
      animation-duration:0.001ms !important;
      animation-iteration-count:1 !important;
      transition-duration:0.001ms !important;
    }
  }

  @media (max-width:1120px) and (min-width:641px){
    html:not(.focus-mode) body{
      padding-top:20px !important;
    }
    html:not(.focus-mode) .top-actions{
      position:relative !important;
      top:auto !important;
      right:auto !important;
      left:auto !important;
      justify-content:center;
      margin:0 auto 20px !important;
      max-width:96vw;
      overflow-x:auto;
      scrollbar-width:none;
    }
    html:not(.focus-mode) .top-actions::-webkit-scrollbar{ display:none; }
  }

  @media (max-width:640px){
    html:not(.focus-mode) body{
      padding-top:76px !important;
    }
    .top-actions{
      position:absolute !important;
      top:10px !important;
      left:8px !important;
      right:8px !important;
      justify-content:flex-start;
      gap:5px;
      z-index: 40 !important;
      margin-bottom:0 !important;
      overflow-x:auto;
      scrollbar-width:none;
      -webkit-overflow-scrolling:touch;
      padding:4px 6px;
      transform:none !important;
    }
    .top-actions::-webkit-scrollbar{ display:none; }
    .top-actions button,
    .top-actions .auth-account-chip{
      padding:0 8px;
      font-size:0.68rem;
      min-height:30px;
      height:30px;
      flex-shrink:0;
      transform:none !important;
    }
  }

  @media (max-width:480px){
    .auth-card{ padding:18px 18px 20px; }
    .auth-row-between{ flex-direction:column; align-items:flex-start; gap:10px; }
    .acc-stats-grid{ grid-template-columns:repeat(2, 1fr); }
  }

  @media (max-width:480px){
    .terms-top{ padding:20px 18px 14px; }
    .terms-body{ padding:16px 18px 4px; }
    .terms-ack-btn{ width:calc(100% - 36px); margin:14px 18px 20px; }
  }

  @media (prefers-reduced-motion: reduce){
    .auth-card, .auth-panel, .auth-submit-spinner{ animation:none !important; transition:none !important; }
  }

  @media (max-width:560px){
    .stats-grid{ grid-template-columns:repeat(2, 1fr); padding:16px 18px 4px; }
    .stats-header{ padding:20px 18px 16px; }
    .stats-levels-head{ padding:18px 18px 8px; }
    #statsLessonBars{ padding:0 18px 20px; }
    .stats-bar-name{ min-width:96px; font-size:0.66rem; }
    #statsRaceRecords{ padding:0 18px 20px; grid-template-columns:1fr; }
  }

  @media (max-width:520px){
    .profile-banner{ padding:24px 18px 18px 116px; min-height:104px; }
    .profile-avatar-wrap{ left:16px; width:80px; height:80px; font-size:1.9rem; }
    .profile-name{ font-size:1.5rem; }
    .profile-level-badge{ min-width:22px; height:22px; font-size:0.58rem; }
  }

  @media (min-width:1300px){
    .profile-sidebar{ position:fixed; left:24px; top:100px; width:264px; }
    .profile-sidebar.collapsed{ width:auto; max-width:264px; }
    .profile-sidebar .profile-banner{
      flex-direction:column; align-items:flex-start;
      padding:106px 20px 18px 20px;
      min-height:0;
    }
    .profile-sidebar .profile-avatar-wrap{ left:20px; top:22px; transform:none; width:72px; height:72px; font-size:1.55rem; }
    .profile-sidebar .profile-level-badge{ min-width:22px; height:22px; font-size:0.58rem; }
    .profile-sidebar .profile-name{ font-size:1.3rem; }
    .profile-sidebar .profile-name-row{ flex-wrap:wrap; }
    .profile-sidebar .stats-grid{ grid-template-columns:1fr 1fr; padding:16px 20px 20px; gap:10px; }
    .profile-sidebar .stat-tile{ padding:12px 8px; }
    .profile-sidebar .stat-tile-val{ font-size:1.15rem; }
    .profile-sidebar.collapsed .profile-banner{ flex-direction:row; align-items:center; gap:12px; padding:12px 18px 12px 12px; }
    .profile-sidebar.collapsed .profile-avatar-wrap{ position:static; left:auto; top:auto; transform:none; }
  }

  @media (max-width:1299px){
    .profile-sidebar{ width:min(94vw, 440px); margin:0 0 20px; align-self:flex-start; }
    .profile-sidebar.collapsed{ width:auto; }
  }

  @media (max-width:600px){
    .board-chassis-bar{ flex-wrap:wrap; gap:8px; }
  }

  /* Universal Reduced Motion Accessibility for all Popups & Modals */
  @media (prefers-reduced-motion: reduce){
    .modal-backdrop, .modal-card, .settings-modal-card, .shortcuts-card,
    .stats-card, .auth-card, .terms-card, .temple-confirm-card, .dev-note-card,
    .lesson-complete-overlay, .lesson-complete-card, .pk-fb-complete-card,
    .race-result-overlay, .race-result-card, .toast {
      animation: none !important;
      transition: none !important;
      transform: none !important;
    }
  }