/* ==========================================================================
   Szekely Design — Vetítés player (random-post-slideshow v4)
   Loaded only where a slideshow is used (includes/vetites.php). The player
   script (random-post-slideshow/js/slideshow.js) builds the markup.

   Stage fills the viewport under the header (--rps-stage-h, measured by the
   script); image as large as possible (contain), blurred ambient copy
   behind it, 987ms cross-fades + subtle Ken Burns, one frosted-glass bar,
   thin top progress bar, "Beállítások" sheet. Calm motion; everything
   still with prefers-reduced-motion (plain fade, no zoom).
   ========================================================================== */

.has-global-padding:has(.rps-player) {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.wp-block-group:has(> .rps-player) {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.rps-player {
    --rps-glass: rgba(10, 22, 34, 0.55);
    --rps-glass-light: rgba(255, 255, 255, 0.13);
    --rps-glass-line: rgba(255, 255, 255, 0.21);
    --rps-ease: var(--sd-ease, cubic-bezier(0.21, 0.55, 0.34, 1));
    position: relative;
    isolation: isolate;
    box-sizing: border-box;
    width: 100%;
    height: var(--rps-stage-h, calc(100dvh - 89px));
    min-height: 377px;
    overflow: hidden;
    background: #06111c;
    color: #fff;
    font-size: var(--sd-16, 16px);
    line-height: 1.618;
    -webkit-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    outline: none;
}

.rps-player:focus-visible {
    box-shadow: inset 0 0 0 var(--sd-3, 3px) rgba(255, 255, 255, 0.55);
}

@media (max-width: 767px) {
    .rps-player {
        height: var(--rps-stage-h, calc(100dvh - 89px - 68px));
    }
}

/* Fullscreen (TV mode), pseudo-fullscreen (iPhone) and the overlay player. */
.rps-player.rps-fs,
.rps-player.rps-pseudo-fs,
.rps-player--overlay {
    --rps-stage-h: 100dvh;
    height: 100dvh;
}

.rps-player.rps-pseudo-fs,
.rps-player--overlay {
    position: fixed;
    inset: 0;
    z-index: 100001;
}

.rps-player:fullscreen {
    --rps-stage-h: 100vh;
    height: 100vh;
}

html.rps-lock-scroll,
html.rps-lock-scroll body {
    overflow: hidden !important;
}

/* TV mode: the cursor hides with the controls. */
.rps-player.rps-fs.rps-idle,
.rps-player.rps-fs.rps-idle *,
.rps-player.rps-pseudo-fs.rps-idle,
.rps-player.rps-pseudo-fs.rps-idle * {
    cursor: none !important;
}

.rps-noscript {
    padding: var(--sd-34, 34px);
    text-align: center;
}

/* --------------------------------------------------------------------------
   Ambient background: a heavily blurred, darkened copy of the image.
   -------------------------------------------------------------------------- */

.rps-ambient,
.rps-viewport {
    position: absolute;
    inset: 0;
}

.rps-ambient {
    z-index: 0;
    overflow: hidden;
}

.rps-ambient__layer {
    position: absolute;
    inset: -13%;
    background-position: center;
    background-size: cover;
    filter: blur(55px) brightness(0.45) saturate(1.3);
    opacity: 0;
    transform: scale(1.05);
    transition: opacity 987ms var(--rps-ease);
}

.rps-ambient__layer--brand {
    background: radial-gradient(ellipse at 34% 21%, var(--color-four, #02497C), transparent 62%), linear-gradient(160deg, var(--color-two, #013A63), #06111c);
    filter: none;
}

.rps-ambient__layer.is-visible {
    opacity: 1;
}

/* --------------------------------------------------------------------------
   Slides: stacked, cross-fading.
   -------------------------------------------------------------------------- */

.rps-viewport {
    z-index: 1;
}

.rps-slide {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    padding: var(--sd-8, 8px);
    opacity: 0;
    transition: opacity 987ms var(--rps-ease);
}

.rps-slide.is-visible {
    opacity: 1;
}

.rps-media {
    position: relative;
    margin: 0;
    max-width: 100%;
    line-height: 0;
    overflow: hidden;
    border-radius: var(--sd-8, 8px);
    box-shadow: 0 var(--sd-21, 21px) var(--sd-55, 55px) rgba(0, 0, 0, 0.34);
}

/* As large as the stage allows, never cropped; width/height attributes keep
   the aspect ratio reserved while loading (no layout jump). */
.rps-media__img {
    display: block;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: calc(var(--rps-stage-h, 100dvh) - 16px);
    object-fit: contain;
    opacity: 1;
    transform-origin: center;
    transition: opacity 610ms var(--rps-ease);
}

.rps-slide.is-loading .rps-media__img,
.rps-slide.is-loading .rps-caption {
    opacity: 0;
}

/* Ken Burns: 1 → 1.05 over the slide's duration. */
.rps-slide--image.is-visible:not(.is-loading) .rps-media__img {
    animation: rps-kenburns var(--rps-dur, 8s) linear forwards;
}

@keyframes rps-kenburns {
    from { transform: scale(1); }
    to   { transform: scale(1.05); }
}

/* Caption: bottom of the image, soft dark gradient, ≤ 1/3 of the image. */
.rps-caption {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    max-height: 33.333%;
    box-sizing: border-box;
    padding: var(--sd-55, 55px) var(--sd-21, 21px) var(--sd-21, 21px);
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.55) 55%, rgba(0, 0, 0, 0.72));
    line-height: 1.3;
    text-align: center;
    overflow: hidden;
    pointer-events: none;
}

.rps-caption__text {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    color: #fff !important;
    font-size: var(--sd-21, 21px);
    font-weight: 600;
    text-decoration: none !important;
    text-shadow: 0 1px var(--sd-3, 3px) rgba(0, 0, 0, 0.55);
    pointer-events: auto;
}

.rps-caption__text:hover,
.rps-caption__text:focus-visible {
    text-decoration: underline !important;
}

/* "Felirat a képen: Ki" (Beállítások). */
.rps-player.rps-no-caption .rps-caption {
    display: none;
}

/* Text-only posts: a typographic slide on the ambient background. */
.rps-slide--text {
    flex-direction: column;
    gap: var(--sd-21, 21px);
    padding: var(--sd-55, 55px) var(--sd-89, 89px);
    text-align: center;
}

.rps-textslide__main {
    max-width: var(--sd-987, 987px);
    margin: 0;
    color: #fff !important;
    font-size: var(--sd-34, 34px);
    font-weight: 700;
    line-height: 1.3;
    text-decoration: none !important;
    text-wrap: balance;
}

.rps-textslide__sub {
    max-width: var(--sd-610, 610px);
    margin: 0;
    font-size: var(--sd-21, 21px);
    opacity: 0.89;
}

/* Loading shimmer (never a layout jump: the slide box is fixed). */
.rps-shimmer {
    position: absolute;
    inset: var(--sd-21, 21px);
    border-radius: var(--sd-13, 13px);
    background: linear-gradient(100deg, rgba(255, 255, 255, 0.05) 38%, rgba(255, 255, 255, 0.13) 50%, rgba(255, 255, 255, 0.05) 62%);
    background-size: 200% 100%;
    animation: rps-shimmer 1597ms linear infinite;
    pointer-events: none;
}

.rps-slide:not(.is-loading):not(.rps-slide--shimmer) > .rps-shimmer {
    display: none;
}

@keyframes rps-shimmer {
    from { background-position: 150% 0; }
    to   { background-position: -50% 0; }
}

.rps-player.rps-loading .rps-viewport {
    opacity: 0.55;
    transition: opacity 377ms var(--rps-ease);
}

/* --------------------------------------------------------------------------
   Click / tap zones (left 34% · middle · right 34%)
   -------------------------------------------------------------------------- */

.rps-zones {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: flex;
    touch-action: pan-y;
}

.rps-zone {
    position: relative;
    flex: 0 0 34%;
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    cursor: pointer;
}

.rps-zone--mid {
    flex: 1 1 auto;
}

.rps-zone__chevron {
    position: absolute;
    top: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--sd-55, 55px);
    height: var(--sd-55, 55px);
    border: 1px solid var(--rps-glass-line);
    border-radius: 50%;
    background: var(--rps-glass);
    -webkit-backdrop-filter: blur(var(--sd-13, 13px));
    backdrop-filter: blur(var(--sd-13, 13px));
    color: #fff;
    font-size: var(--sd-21, 21px);
    opacity: 0;
    transform: translateY(-50%);
    transition: opacity 233ms var(--rps-ease), transform 233ms var(--rps-ease);
}

.rps-zone--prev .rps-zone__chevron { left: var(--sd-21, 21px); }
.rps-zone--next .rps-zone__chevron { right: var(--sd-21, 21px); }

@media (hover: hover) and (pointer: fine) {
    .rps-zone--prev:hover .rps-zone__chevron {
        opacity: 1;
        transform: translate(calc(var(--sd-5, 5px) * -1), -50%);
    }

    .rps-zone--next:hover .rps-zone__chevron {
        opacity: 1;
        transform: translate(var(--sd-5, 5px), -50%);
    }
}

/* --------------------------------------------------------------------------
   Auto-hiding UI (bar, pill, close) — hidden after 3 s of inactivity.
   -------------------------------------------------------------------------- */

.rps-ui {
    transition: opacity 377ms var(--rps-ease), transform 377ms var(--rps-ease);
}

.rps-player:not(.rps-show-ui) .rps-ui {
    opacity: 0;
    pointer-events: none;
}

.rps-player:not(.rps-show-ui) .rps-bar {
    transform: translate(-50%, var(--sd-13, 13px));
}

/* Top progress bar (autoplay timer). */
.rps-progress {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    z-index: 4;
    height: var(--sd-3, 3px);
    background: rgba(255, 255, 255, 0.13);
    pointer-events: none;
}

.rps-progress__fill {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, var(--color-four, #02497C), #9fd3ff);
    box-shadow: 0 0 var(--sd-8, 8px) rgba(159, 211, 255, 0.55);
    transform: scaleX(0);
    transform-origin: left center;
    will-change: transform;
}

.rps-player.rps-paused .rps-progress__fill {
    opacity: 0.55;
}

/* Category pill (top left). */
.rps-pill {
    position: absolute;
    top: var(--sd-13, 13px);
    left: var(--sd-13, 13px);
    z-index: 4;
    display: inline-flex;
    align-items: center;
    gap: var(--sd-8, 8px);
    max-width: calc(100% - var(--sd-89, 89px));
    min-height: var(--sd-34, 34px);
    padding: var(--sd-5, 5px) var(--sd-13, 13px);
    border: 1px solid var(--rps-glass-line);
    border-radius: var(--sd-34, 34px);
    background: var(--rps-glass);
    -webkit-backdrop-filter: blur(var(--sd-21, 21px)) saturate(1.618);
    backdrop-filter: blur(var(--sd-21, 21px)) saturate(1.618);
    color: #fff;
    font: inherit;
    font-size: var(--sd-13, 13px);
    font-weight: 600;
    cursor: pointer;
}

.rps-pill__text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Close (overlay player). */
.rps-close {
    position: absolute;
    top: var(--sd-13, 13px);
    right: var(--sd-13, 13px);
    z-index: 4;
    width: var(--sd-34, 34px);
    height: var(--sd-34, 34px);
    border: 1px solid var(--rps-glass-line);
    border-radius: 50%;
    background: var(--rps-glass);
    color: #fff;
    font-size: var(--sd-16, 16px);
    cursor: pointer;
}

/* The control bar: one frosted-glass pill. */
.rps-bar {
    position: absolute;
    bottom: max(var(--sd-21, 21px), env(safe-area-inset-bottom));
    left: 50%;
    z-index: 4;
    display: flex;
    align-items: center;
    gap: var(--sd-3, 3px);
    max-width: calc(100% - var(--sd-21, 21px));
    padding: var(--sd-5, 5px);
    border: 1px solid var(--rps-glass-line);
    border-radius: var(--sd-34, 34px);
    background: var(--rps-glass);
    -webkit-backdrop-filter: blur(var(--sd-21, 21px)) saturate(1.618);
    backdrop-filter: blur(var(--sd-21, 21px)) saturate(1.618);
    box-shadow: 0 var(--sd-13, 13px) var(--sd-34, 34px) rgba(0, 0, 0, 0.34);
    transform: translate(-50%, 0);
}

.rps-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    box-sizing: border-box;
    min-width: var(--sd-34, 34px);
    height: var(--sd-34, 34px);
    padding: 0;
    border: 0;
    border-radius: var(--sd-34, 34px);
    background: transparent;
    color: #fff;
    font: inherit;
    font-size: var(--sd-16, 16px);
    cursor: pointer;
    transition: background 233ms var(--rps-ease), transform 233ms var(--rps-ease);
}

.rps-btn:hover,
.rps-btn:focus-visible {
    background: var(--rps-glass-light);
}

.rps-btn:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 2px;
}

.rps-btn:active {
    transform: scale(0.95);
}

.rps-btn--play {
    min-width: var(--sd-55, 55px);
    background: #fff;
    color: var(--color-two, #013A63);
}

.rps-btn--play:hover,
.rps-btn--play:focus-visible {
    background: #fff;
    transform: scale(1.05);
}

.rps-btn--speed {
    padding: 0 var(--sd-8, 8px);
    font-size: var(--sd-13, 13px);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.rps-counter {
    white-space: nowrap;
    min-width: var(--sd-55, 55px);
    padding: 0 var(--sd-8, 8px);
    font-size: var(--sd-13, 13px);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    text-align: center;
    opacity: 0.89;
}

.rps-bar__sep {
    width: 1px;
    height: var(--sd-21, 21px);
    margin: 0 var(--sd-3, 3px);
    background: var(--rps-glass-line);
}

/* Toast ("A link a vágólapra került"). */
.rps-toast {
    position: absolute;
    top: var(--sd-55, 55px);
    left: 50%;
    z-index: 5;
    padding: var(--sd-8, 8px) var(--sd-21, 21px);
    border-radius: var(--sd-34, 34px);
    background: var(--rps-glass);
    -webkit-backdrop-filter: blur(var(--sd-21, 21px));
    backdrop-filter: blur(var(--sd-21, 21px));
    font-size: var(--sd-13, 13px);
    font-weight: 600;
    transform: translateX(-50%);
    animation: rps-rise 377ms var(--rps-ease);
}

.rps-toast[hidden] {
    display: none;
}

@keyframes rps-rise {
    from { opacity: 0; transform: translate(-50%, var(--sd-8, 8px)); }
    to   { opacity: 1; transform: translate(-50%, 0); }
}

/* --------------------------------------------------------------------------
   Beállítások sheet: slides up on mobile, pops over the bar on desktop.
   -------------------------------------------------------------------------- */

.rps-sheet {
    position: absolute;
    inset: 0;
    z-index: 10;
    background: rgba(1, 10, 18, 0.34);
    -webkit-backdrop-filter: blur(var(--sd-5, 5px));
    backdrop-filter: blur(var(--sd-5, 5px));
    animation: rps-fade 233ms var(--rps-ease);
    -webkit-user-select: text;
    user-select: text;
}

.rps-sheet[hidden] {
    display: none;
}

@keyframes rps-fade {
    from { opacity: 0; }
    to   { opacity: 1; }
}

.rps-sheet__panel {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    gap: var(--sd-21, 21px);
    box-sizing: border-box;
    max-height: 78%;
    overflow-y: auto;
    padding: var(--sd-21, 21px) var(--sd-21, 21px) max(var(--sd-21, 21px), env(safe-area-inset-bottom));
    border-radius: var(--sd-21, 21px) var(--sd-21, 21px) 0 0;
    background: rgba(255, 255, 255, 0.89);
    -webkit-backdrop-filter: blur(var(--sd-21, 21px)) saturate(1.618);
    backdrop-filter: blur(var(--sd-21, 21px)) saturate(1.618);
    color: var(--color-two, #013A63);
    box-shadow: 0 calc(var(--sd-13, 13px) * -1) var(--sd-34, 34px) rgba(0, 0, 0, 0.21);
    animation: rps-sheet-up 377ms var(--rps-ease);
}

@keyframes rps-sheet-up {
    from { transform: translateY(var(--sd-55, 55px)); opacity: 0; }
    to   { transform: none; opacity: 1; }
}

@media (min-width: 768px) {
    .rps-sheet__panel {
        right: auto;
        bottom: var(--sd-89, 89px);
        left: 50%;
        width: min(calc(100% - var(--sd-34, 34px)), var(--sd-610, 610px));
        max-height: calc(100% - var(--sd-144, 144px));
        border-radius: var(--sd-21, 21px);
        transform: translateX(-50%);
        animation: rps-sheet-pop 377ms var(--rps-ease);
    }

    @keyframes rps-sheet-pop {
        from { transform: translate(-50%, var(--sd-13, 13px)) scale(0.95); opacity: 0; }
        to   { transform: translate(-50%, 0); opacity: 1; }
    }
}

.rps-sheet__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.rps-sheet__title {
    margin: 0;
    font-size: var(--sd-21, 21px);
    line-height: 1.3;
    color: inherit;
}

.rps-sheet__close {
    width: var(--sd-34, 34px);
    height: var(--sd-34, 34px);
    border: 0;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.08);
    color: inherit;
    font-size: var(--sd-16, 16px);
    cursor: pointer;
}

.rps-sheet__label {
    margin: 0 0 var(--sd-8, 8px);
    font-size: var(--sd-13, 13px);
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    opacity: 0.89;
}

/* Count: segmented control. */
.rps-seg {
    display: inline-flex;
    gap: var(--sd-3, 3px);
    padding: var(--sd-3, 3px);
    border-radius: var(--sd-34, 34px);
    background: rgba(0, 0, 0, 0.08);
}

.rps-seg__btn {
    min-width: var(--sd-55, 55px);
    min-height: var(--sd-34, 34px);
    border: 0;
    border-radius: var(--sd-34, 34px);
    background: transparent;
    color: inherit;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
    transition: background 233ms var(--rps-ease), color 233ms var(--rps-ease);
}

.rps-seg__btn.is-active {
    background: var(--color-four, #02497C);
    color: #fff;
}

/* Category search + grouped pills (the category page's style). */
.rps-search {
    display: flex;
    align-items: center;
    gap: var(--sd-8, 8px);
    margin-bottom: var(--sd-13, 13px);
    padding: var(--sd-8, 8px) var(--sd-13, 13px);
    border: 1px solid rgba(0, 0, 0, 0.13);
    border-radius: var(--sd-21, 21px);
    background: #fff;
    color: #555;
}

.rps-search__input {
    flex: 1 1 auto;
    min-width: 0;
    border: 0;
    background: none;
    outline: none;
    color: var(--color-two, #013A63);
    font: inherit;
    font-size: var(--sd-16, 16px);
}

.rps-cats {
    display: flex;
    flex-direction: column;
    gap: var(--sd-13, 13px);
}

.rps-cats__group[hidden],
.rps-cat[hidden],
.rps-cats__empty[hidden] {
    display: none;
}

.rps-cats__label {
    margin: 0 0 var(--sd-8, 8px);
    font-size: var(--sd-16, 16px);
    font-weight: 700;
    color: inherit;
}

.rps-cats__pills {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sd-8, 8px);
}

.rps-cat {
    display: inline-flex;
    align-items: center;
    gap: var(--sd-5, 5px);
    min-height: var(--sd-34, 34px);
    padding: var(--sd-3, 3px) var(--sd-13, 13px);
    border: 1px solid rgba(2, 73, 124, 0.13);
    border-radius: var(--sd-34, 34px);
    background: #fff;
    color: var(--color-two, #013A63);
    font: inherit;
    font-size: var(--sd-13, 13px);
    font-weight: 600;
    cursor: pointer;
    transition: background 233ms var(--rps-ease), color 233ms var(--rps-ease), transform 233ms var(--rps-ease);
}

.rps-cat:hover,
.rps-cat:focus-visible {
    transform: translateY(calc(var(--sd-3, 3px) * -1));
}

.rps-cat__count {
    font-weight: 400;
    opacity: 0.55;
}

.rps-cat.is-active {
    border-color: var(--color-four, #02497C);
    background: var(--color-four, #02497C);
    color: #fff;
}

.rps-cats__empty {
    margin: 0;
    font-style: italic;
    opacity: 0.89;
}

/* --------------------------------------------------------------------------
   Mobile
   -------------------------------------------------------------------------- */

@media (max-width: 767px) {
    .rps-slide {
        padding: var(--sd-3, 3px);
    }

    .rps-media {
        border-radius: var(--sd-5, 5px);
    }

    .rps-caption__text {
        font-size: var(--sd-16, 16px);
    }

    .rps-caption {
        padding: var(--sd-34, 34px) var(--sd-13, 13px) var(--sd-13, 13px);
    }

    .rps-slide--text {
        padding: var(--sd-34, 34px) var(--sd-21, 21px) var(--sd-89, 89px);
    }

    .rps-textslide__main {
        font-size: var(--sd-21, 21px);
    }

    .rps-textslide__sub {
        font-size: var(--sd-16, 16px);
    }

    .rps-bar {
        gap: 0;
        bottom: var(--sd-13, 13px);
        padding: var(--sd-3, 3px);
    }

    .rps-btn--play {
        min-width: var(--sd-34, 34px);
    }

    .rps-bar__sep {
        display: none;
    }

    .rps-counter {
        min-width: 0;
        padding: 0 var(--sd-5, 5px);
    }

    .rps-btn--speed {
        padding: 0 var(--sd-5, 5px);
    }
}

/* --------------------------------------------------------------------------
   Reduced motion: plain fade, no zoom, no shimmer movement.
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
    .rps-slide--image.is-visible:not(.is-loading) .rps-media__img,
    .rps-shimmer,
    .rps-sheet,
    .rps-sheet__panel,
    .rps-toast {
        animation: none;
    }

    .rps-ui,
    .rps-zone__chevron,
    .rps-btn,
    .rps-cat,
    .rps-seg__btn {
        transition: none;
    }

    .rps-player:not(.rps-show-ui) .rps-bar {
        transform: translate(-50%, 0);
    }
}

/* --------------------------------------------------------------------------
   Trigger icon ([rps_slideshow]) — category archives (template column
   .rps_slideshow_category) and author archives (under the query title,
   .rps-author-trigger). 34px frosted-glass circle, hover 233ms.
   Round 12 fix: the old random-post-slideshow/css/slideshow.css (removed
   with the v4 player) was the only thing colouring the icon; without it
   emoji-rating.css ".emoji i { color: var(--color-one) }" made it white
   on white — present in the HTML, invisible on the page.
   -------------------------------------------------------------------------- */
.rps_slideshow_category,
.rps-author-trigger {
    display: flex;
    align-items: center;
    justify-content: center;
}

.rps-author-trigger {
    margin: 0 0 var(--sd-21, 21px);
}

.slideshow-icon #rps-slideshow-trigger {
    display: inline-grid;
    place-items: center;
    box-sizing: border-box;
    width: var(--sd-34, 34px);
    height: var(--sd-34, 34px);
    margin: 0;
    padding: 0;
    border: 1px solid var(--sd-glass-border, rgba(2, 133, 186, 0.13));
    border-radius: 50%;
    background: var(--sd-glass-strong, rgba(255, 255, 255, 0.89));
    -webkit-backdrop-filter: blur(var(--sd-13, 13px));
    backdrop-filter: blur(var(--sd-13, 13px));
    box-shadow: var(--sd-shadow, 0 3px 8px rgba(0, 0, 0, 0.06));
    color: var(--color-two, #013A63);
    line-height: 1;
    cursor: pointer;
    transition: transform var(--sd-hover, 233ms) var(--sd-ease, ease), background-color var(--sd-hover, 233ms) var(--sd-ease, ease), color var(--sd-hover, 233ms) var(--sd-ease, ease), box-shadow var(--sd-hover, 233ms) var(--sd-ease, ease);
}

.slideshow-icon #rps-slideshow-trigger i {
    color: inherit;
    font-size: var(--sd-16, 16px);
    transform: none;
}

/* Pages cached from before the one-line markup still have wpautop's <br>s. */
.slideshow-icon #rps-slideshow-trigger br {
    display: none;
}

.slideshow-icon #rps-slideshow-trigger:hover,
.slideshow-icon #rps-slideshow-trigger:focus-visible {
    background: var(--color-four, #0285BA);
    color: var(--color-one, #fff);
    box-shadow: var(--sd-shadow-raised, 0 8px 21px rgba(0, 0, 0, 0.1));
    transform: scale(1.05);
}

.slideshow-icon #rps-slideshow-trigger:focus-visible {
    outline: 2px solid var(--color-four, #0285BA);
    outline-offset: 2px;
}

/* --------------------------------------------------------------------------
   Quote card — text-only posts (no image). No title: only the text, sized by
   slideshow.js (fitQuote: largest 21–144px that fits 89% × 76% of the
   stage), words floating in (55ms apart, 610ms each), a slowly drifting
   brand gradient (21s, alternate; angle / glow differ per slide), soft
   cross-fade + zoom 0.987 → 1 (610ms). Image slides are unchanged.
   -------------------------------------------------------------------------- */
.rps-slide--quote {
    overflow: hidden;
    isolation: isolate;
    padding: 0;
    transform: scale(0.987);
    transition: opacity 610ms var(--rps-ease), transform 610ms var(--rps-ease);
}

.rps-slide--quote.is-visible {
    transform: none;
}

/* Drifting gradient: an oversized layer moved with transform only. */
.rps-slide--quote::before {
    content: '';
    position: absolute;
    inset: -21%;
    z-index: -1;
    background:
        radial-gradient(ellipse at var(--rps-glow-x, 34%) 21%, rgba(2, 133, 186, 0.34), transparent 55%),
        linear-gradient(var(--rps-angle, 135deg), #013A63, #02497C 55%, #013A63);
    animation: rps-quote-drift 21s ease-in-out infinite alternate;
}

@keyframes rps-quote-drift {
    from { transform: translate3d(-5%, -3%, 0) rotate(0deg) scale(1); }
    to   { transform: translate3d(5%, 3%, 0) rotate(3deg) scale(1.05); }
}

.rps-quote {
    position: relative;
    display: block;
    box-sizing: border-box;
    color: #fff !important;
    font-size: var(--sd-34, 34px); /* replaced by fitQuote() */
    text-align: center;
    text-decoration: none !important;
}

.rps-quote__text {
    margin: 0;
    font-size: 1em;
    font-weight: 600;
    line-height: 1.382;
    text-wrap: balance;
    overflow-wrap: break-word;
}

/* Big, faint decorative quote mark behind the text. */
.rps-quote__mark {
    position: absolute;
    top: -0.618em;
    left: 50%;
    z-index: -1;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 4.236em;
    font-weight: 700;
    line-height: 1;
    opacity: 0.08;
    transform: translateX(-50%);
    pointer-events: none;
    user-select: none;
}

.rps-quote__author {
    display: none;
    margin: 0.618em 0 0;
    font-size: max(var(--sd-16, 16px), 0.382em);
    font-weight: 400;
    opacity: 0.89;
}

.rps-player.rps-show-author .rps-quote__author {
    display: block;
}

/* Words float in one by one once the slide is visible. */
.rps-word {
    display: inline-block;
}

.rps-slide--quote.is-visible .rps-word {
    animation: rps-word-in 610ms var(--rps-ease) both;
    animation-delay: calc(var(--i, 0) * 55ms);
}

@keyframes rps-word-in {
    from { opacity: 0; transform: translateY(13px); }
    to   { opacity: 1; transform: none; }
}

/* Reduced motion: no word animation, no drifting background — plain fade. */
@media (prefers-reduced-motion: reduce) {
    .rps-slide--quote {
        transform: none;
        transition: opacity 610ms linear;
    }

    .rps-slide--quote::before,
    .rps-slide--quote.is-visible .rps-word {
        animation: none;
    }

    .slideshow-icon #rps-slideshow-trigger {
        transition: none;
    }

    .slideshow-icon #rps-slideshow-trigger:hover,
    .slideshow-icon #rps-slideshow-trigger:focus-visible {
        transform: none;
    }
}

/* --------------------------------------------------------------------------
   Székely Napló "Napló" mode (szekely-naplo/includes/vetites.php)
   No category to pick, no "new random set" to shuffle — hidden rather than
   left non-functional. Same stage/quote-card mechanics as everything else.
   -------------------------------------------------------------------------- */

.rps-naplo .rps-pill,
.rps-naplo .rps-btn--shuffle,
.rps-naplo .rps-btn--settings {
    display: none;
}

/* Small label above the quote mark + a source line below the text/author
   — only present on Napló entries (data.section/.year/.sourceTitle), so
   this never affects an ordinary random-post quote card. */
.rps-quote__section {
    display: block;
    margin: 0 0 var(--sd-8, 8px);
    font-size: max(var(--sd-13, 13px), 0.28em);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    opacity: 0.68;
}

.rps-quote__source {
    margin: 0.618em 0 0;
    font-size: max(var(--sd-13, 13px), 0.3em);
    font-weight: 400;
    opacity: 0.68;
}

/* --------------------------------------------------------------------------
   Székely Napló info slides: title (date/weekday/name days), jeles nap
   (feast + regula) and closing ("Holnap: …"). Same card-on-brand-gradient
   background as the quote card (.rps-slide--quote::before, reused here),
   fixed comfortable sizes instead of fitQuote()'s binary search — these
   are short, known-shape strings, not arbitrary-length post text.
   -------------------------------------------------------------------------- */

.rps-slide--naplo-title,
.rps-slide--naplo-feast,
.rps-slide--naplo-closing {
    overflow: hidden;
    isolation: isolate;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--sd-34, 34px);
    box-sizing: border-box;
    transform: scale(0.987);
    transition: opacity 610ms var(--rps-ease), transform 610ms var(--rps-ease);
}

.rps-slide--naplo-title.is-visible,
.rps-slide--naplo-feast.is-visible,
.rps-slide--naplo-closing.is-visible {
    transform: none;
}

.rps-slide--naplo-title::before,
.rps-slide--naplo-feast::before,
.rps-slide--naplo-closing::before {
    content: '';
    position: absolute;
    inset: -21%;
    z-index: -1;
    background:
        radial-gradient(ellipse at 34% 21%, rgba(2, 133, 186, 0.34), transparent 55%),
        linear-gradient(135deg, #013A63, #02497C 55%, #013A63);
    animation: rps-quote-drift 21s ease-in-out infinite alternate;
}

.rps-naplo-card {
    max-width: 89%;
    text-align: center;
    color: #fff;
}

.rps-naplo-card__eyebrow {
    margin: 0 0 var(--sd-13, 13px);
    font-size: var(--sd-16, 16px);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    opacity: 0.68;
}

.rps-naplo-card__date {
    margin: 0;
    font-size: var(--sd-55, 55px);
    font-weight: 700;
    line-height: 1.2;
    text-wrap: balance;
}

.rps-naplo-card__weekday {
    margin: var(--sd-8, 8px) 0 0;
    font-size: var(--sd-21, 21px);
    opacity: 0.89;
}

.rps-naplo-card__names {
    margin: var(--sd-21, 21px) 0 0;
    font-size: var(--sd-21, 21px);
    line-height: 1.618;
}

.rps-naplo-card__regula {
    margin: var(--sd-21, 21px) 0 0;
    padding: 0;
    border: none;
    font-size: var(--sd-34, 34px);
    font-weight: 600;
    font-style: italic;
    line-height: 1.382;
    text-wrap: balance;
}

@media (max-width: 767px) {
    .rps-naplo-card__date {
        font-size: var(--sd-34, 34px);
    }

    .rps-naplo-card__regula {
        font-size: var(--sd-21, 21px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .rps-slide--naplo-title,
    .rps-slide--naplo-feast,
    .rps-slide--naplo-closing {
        transform: none;
        transition: opacity 610ms linear;
    }

    .rps-slide--naplo-title::before,
    .rps-slide--naplo-feast::before,
    .rps-slide--naplo-closing::before {
        animation: none;
    }
}