.recommended-creators-section { margin: 0 0 28px; }
        .rec-creators-head { margin-bottom: 14px; }
        .rec-creators-title { font-family: var(--serif, Georgia, serif); font-size: clamp(1.25rem, 2vw, 1.55rem); color: var(--text); margin: 0; letter-spacing: .01em; }
        .rec-creators-sub { font-size: 13px; color: var(--muted); margin: 6px 0 0; line-height: 1.55; }

        .rec-creators-viewport {
          position: relative;

          overflow-x: auto;
          overflow-y: hidden;
          scrollbar-width: none;
          -ms-overflow-style: none;
          overscroll-behavior-inline: contain;
          -webkit-overflow-scrolling: touch;
          touch-action: auto;
          scroll-snap-type: x proximity;
          scroll-padding-inline: 2px;

          mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 28px), transparent 100%);
          -webkit-mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 28px), transparent 100%);
        }
        .rec-creators-viewport:focus-within {
          mask-image: none;
          -webkit-mask-image: none;
        }
        .rec-creators-viewport::-webkit-scrollbar { display: none; width: 0 !important; height: 0 !important; }

        .rec-creators-track {
          display: flex;
          gap: 14px;
          width: max-content;
          padding: 2px 0 4px;
        }
        .rec-creator-card {
          flex: 0 0 290px;
          display: flex; align-items: center; gap: 12px;
          padding: 12px 14px;
          background: var(--surface);
          border: 1px solid var(--border);
          border-radius: 14px;
          text-decoration: none;
          color: inherit;
          transition: border-color .2s ease, color .2s ease;
          scroll-snap-align: start;
        }
        .rec-creator-card:hover { border-color: rgba(201,168,76,.45); }
        .rec-creator-card:focus-visible { outline: 2px solid rgba(201,168,76,.55) !important; outline-offset: -2px !important; border-color: rgba(201,168,76,.55); box-shadow: 0 0 0 2px rgba(201,168,76,.32); }
        .rec-creator-avatar {
          position: relative; isolation: isolate;
          flex: 0 0 44px; width: 44px; height: 44px; border-radius: 50%;
          display: inline-flex; align-items: center; justify-content: center;
          background:
            radial-gradient(circle at 30% 22%, rgba(201,168,76,.24), transparent 52%),
            linear-gradient(145deg, rgba(201,168,76,.15), rgba(8,8,8,.56));
          border: 1px solid rgba(201,168,76,.32);
          box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
          overflow: hidden;
          transition: border-color .2s ease, box-shadow .2s ease;
        }
        .rec-creator-card:hover .rec-creator-avatar,
        .rec-creator-card:focus-visible .rec-creator-avatar { border-color: rgba(201,168,76,.65); box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 0 18px rgba(201,168,76,.14); }
        .rec-creator-avatar.has-image .rec-creator-avatar-initials {
          opacity: 0;
          transition: opacity .16s ease;
        }
        .rec-creator-avatar.has-image.is-fallback .rec-creator-avatar-initials,
        .rec-creator-avatar:not(.has-image) .rec-creator-avatar-initials {
          opacity: 1;
        }
        .rec-creator-avatar.has-image:not(.is-loaded):not(.is-fallback)::after {
          content: "";
          position: absolute; inset: 11px; border-radius: 999px; z-index: 1;
          border: 1px solid rgba(201,168,76,.22);
          border-top-color: rgba(201,168,76,.58);
          animation: a2-rec-avatar-spin .85s linear infinite;
        }
        @keyframes a2-rec-avatar-spin { to { transform: rotate(360deg); } }
        .rec-creator-avatar-img {
          position: absolute; inset: 0; z-index: 2;
          width: 100%; height: 100%; object-fit: cover; display: block;
          opacity: 0; transition: opacity .18s ease;
        }
        .rec-creator-avatar-img.is-loaded { opacity: 1; }
        .rec-creator-avatar-img.has-failed { display: none; }
        .rec-creator-avatar-initials { position: relative; z-index: 1; font: 800 13px/1 var(--sans, Inter, system-ui, sans-serif); color: var(--gold); letter-spacing: .04em; text-shadow: 0 0 14px rgba(201,168,76,.28); }
        html.light .rec-creator-avatar,
        html[data-theme="light"] .rec-creator-avatar,
        body.light .rec-creator-avatar {
          background:
            radial-gradient(circle at 30% 22%, rgba(201,168,76,.22), transparent 56%),
            linear-gradient(145deg, rgba(255,255,255,.95), rgba(247,240,225,.84));
          box-shadow: inset 0 1px 0 rgba(255,255,255,.72);
        }
        .rec-creator-meta { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
        .rec-creator-name { font-size: 13px; font-weight: 700; color: var(--text); white-space: normal; overflow-wrap: anywhere; transition: color .2s ease; }
        .rec-creator-note { font-size: 11px; color: var(--muted); white-space: normal; overflow-wrap: anywhere; line-height: 1.35; }
        .rec-creator-card:hover .rec-creator-name,
        .rec-creator-card:focus-visible .rec-creator-name { color: var(--gold); }
        .rec-creator-yt { font-size: 10px; color: var(--muted); letter-spacing: .04em; flex-shrink: 0; transition: color .2s ease; }
        .rec-creator-card:hover .rec-creator-yt,
        .rec-creator-card:focus-visible .rec-creator-yt { color: var(--gold); }
        @media (max-width: 640px) {
          .rec-creator-card { flex: 0 0 260px; padding: 10px 12px; }
          .rec-creator-avatar { flex-basis: 40px; width: 40px; height: 40px; }
        }

        @media (prefers-reduced-motion: reduce) {
          .rec-creator-avatar.has-image:not(.is-loaded):not(.is-fallback)::after { animation: none; }
        }

/* Automatic Education rails expose a permanent motion control for pointer, touch, and keyboard users. */
html body #education .a2-rail-is-running {
  scroll-snap-type: none !important;
  scroll-behavior: auto !important;
  overflow-anchor: none;
}