/* Centred, gently scaled cards — shared by both language versions. */
.bard-magnifier { position: fixed; left: 0; top: 0; width: 180px; height: 180px; box-sizing: border-box; border-radius: 50%; border: 2px solid #fff; outline: 1px solid rgba(0,0,0,.28); box-shadow: 0 8px 30px rgba(0,0,0,.22); overflow: hidden; pointer-events: none; z-index: 10000; background: var(--bg, #f4f4f1); }
.bard-magnifier[hidden] { display: none; }
.bard-magnifier img { position: absolute; max-width: none; max-height: none; pointer-events: none; }
.bard-magnifying .bard-cursor { visibility: hidden !important; }
.bard-magnifying .other-grid .other-media, .bard-magnifying .other-grid .other-media * { cursor: none !important; }
.reel-enhanced { overflow: hidden; padding-top: 24px; }
.reel-enhanced .reel-track { position: relative; width: 100%; display: block; animation: none; transform: none; touch-action: pan-y pinch-zoom; cursor: grab; user-select: none; -webkit-user-select: none; min-height: 320px; }
.reel-enhanced .rc-media image-slot:not([data-reframe])::part(image) { touch-action: pan-y pinch-zoom; }
.reel-enhanced .reel-track.is-dragging { cursor: grabbing; }
.reel-enhanced .reel-track:focus-visible { outline: 2px solid var(--ink); outline-offset: -2px; }
.reel-enhanced .reel-card { position: absolute; top: 0; left: 0; width: clamp(300px, 45vw, 640px); margin: 0; opacity: 1 !important; transform-origin: center 38%; will-change: transform; transition: none; }
.reel-enhanced .rc-media { aspect-ratio: 16 / 10; border-radius: 3px; }
.reel-enhanced .rc-media image-slot, .reel-enhanced .reel-card:hover .rc-media image-slot { transform: translateX(var(--reel-image-x, 0%)) scale(1.045); transition: none; }
.reel-enhanced .rc-cap { opacity: .5; transition: opacity .35s ease; padding: 18px 2px 0; }
.reel-enhanced .is-current .rc-cap { opacity: 1; }
.reel-enhanced .rc-meta { flex-wrap: wrap; gap: 8px 14px; }
.reel-enhanced .rc-cat { font-size: 12px; white-space: normal; line-height: 1.5; }
.reel-enhanced .rc-summary, .reel-enhanced .reel-card:hover .rc-summary { display: block; max-height: none; opacity: 1; transform: none; font-size: 14px; line-height: 1.55; max-width: 52ch; transition: none; }
.reel-controls { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 22px 0 4px; }
.reel-hint { font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: .1em; color: var(--grey); }
.reel-actions { display: flex; align-items: center; gap: 8px; }
.reel-actions button { display: inline-flex; justify-content: center; align-items: center; min-width: 44px; height: 44px; border: 1px solid var(--ink); background: transparent; color: var(--ink); font: 20px var(--mono); cursor: pointer; border-radius: 0; }
.reel-actions button:hover { background: var(--ink); color: var(--bg, #f4f4f1); }
.reel-actions button:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
.reel-actions .reel-pause { font-size: 12px; min-width: 68px; padding: 0 12px; margin-left: 8px; }
.reel-count { min-width: 64px; text-align: center; font: 12px var(--mono); }
.reel-announcement { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (max-width: 760px) {
  .reel-enhanced .reel-card { width: 78vw; }
  .reel-enhanced .rc-media { aspect-ratio: 4 / 3; }
  .reel-enhanced .rc-name { font-size: 20px; }
  .reel-controls { flex-wrap: wrap; }
  .reel-hint { font-size: 12px; letter-spacing: .03em; }
}
@media (prefers-reduced-motion: reduce) {
  .reel-enhanced .rc-cap { transition: none; }
  .reel-enhanced .rc-media image-slot { transform: none !important; }
}
