/**
 * [RKR GLOSSARY TOOLTIP] — Front office styles
 *
 * Term underlines, tooltips (9 effects × 5 positions), lazy cards, glossary
 * A-Z page, term pages, related products and messages.
 *
 * Every colour/radius/shadow comes from the CSS custom properties written by
 * the Theme Studio (views/css/generated/rkrgl-theme.css) with hard fallbacks,
 * so the module renders correctly even when that file cannot be written.
 */

/* ============================================================== terms == */

.rkrgl-term {
    cursor: help;
    padding: 0 1px;
    border-radius: 3px;
    background: var(--rkrgl-term-bg, rgba(119, 166, 50, 0.1));
    border-bottom: 2px var(--rkrgl-underline-style, dotted) var(--rkrgl-underline-color, #77a632);
    transition: background 0.18s ease, box-shadow 0.18s ease;
    text-decoration: none;
    color: inherit;
}

a.rkrgl-term {
    color: var(--rkrgl-link, #5c8026);
}

.rkrgl-term:hover,
.rkrgl-term.is-open {
    box-shadow: 0 0 0 3px var(--rkrgl-term-bg, rgba(119, 166, 50, 0.16));
}

body[data-rkrgl-ul="dashed"] .rkrgl-term { border-bottom-style: dashed; }
body[data-rkrgl-ul="solid"] .rkrgl-term { border-bottom-style: solid; }
body[data-rkrgl-ul="double"] .rkrgl-term { border-bottom-style: double; border-bottom-width: 3px; }

body[data-rkrgl-ul="highlight"] .rkrgl-term {
    border-bottom: 0;
    background-image: linear-gradient(var(--rkrgl-underline-color, #77a632), var(--rkrgl-underline-color, #77a632));
    background-size: 100% 2px;
    background-position: 0 100%;
    background-repeat: no-repeat;
}

body[data-rkrgl-ul="background"] .rkrgl-term {
    border-bottom: 0;
    background: var(--rkrgl-underline-color, #77a632);
    color: var(--rkrgl-tooltip-fg, #fff);
    padding: 1px 5px;
    border-radius: var(--rkrgl-radius, 10px);
}

/* term highlight effects (anchors from the glossary page) */

.rkrgl-te-pulse { animation: rkrgl-te-pulse 1.4s ease 2; }
.rkrgl-te-glow { animation: rkrgl-te-glow 1.6s ease 2; }
.rkrgl-te-flash { animation: rkrgl-te-flash 1.1s steps(2, end) 3; }
.rkrgl-te-highlight { animation: rkrgl-te-highlight 2.2s ease 1 forwards; }

@keyframes rkrgl-te-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(119, 166, 50, 0); }
    50% { box-shadow: 0 0 0 6px rgba(119, 166, 50, 0.28); }
}

@keyframes rkrgl-te-glow {
    0%, 100% { text-shadow: none; }
    50% { text-shadow: 0 0 10px var(--rkrgl-accent, #77a632); }
}

@keyframes rkrgl-te-flash {
    0%, 100% { background-color: var(--rkrgl-term-bg, rgba(119, 166, 50, 0.1)); }
    50% { background-color: var(--rkrgl-accent, #77a632); }
}

@keyframes rkrgl-te-highlight {
    from { background-color: rgba(255, 214, 102, 0.75); }
    to { background-color: transparent; }
}

/* ============================================================= tooltip == */

.rkrgl-tooltip {
    position: absolute;
    /* Above sticky headers / mega-menus of Classic, Hummingbird and most themes. */
    z-index: 100000;
    box-sizing: border-box;
    max-width: var(--rkrgl-mw, 360px);
    max-width: min(var(--rkrgl-mw, 360px), calc(100vw - 12px));
    min-width: 200px;
    min-width: min(200px, calc(100vw - 12px));
    padding: 14px 16px;
    border-radius: var(--rkrgl-radius, 10px);
    background: var(--rkrgl-tooltip-bg, #fff);
    color: var(--rkrgl-tooltip-fg, #2b2f26);
    border: 1px solid var(--rkrgl-tooltip-border, #dfe8d2);
    box-shadow: var(--rkrgl-tooltip-shadow, 0 12px 32px rgba(15, 23, 42, 0.18));
    backdrop-filter: blur(var(--rkrgl-tooltip-blur, 0px));
    -webkit-backdrop-filter: blur(var(--rkrgl-tooltip-blur, 0px));
    font-size: 13px;
    line-height: 1.55;
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
    transform: translate3d(0, 0, 0);
    font-family: var(--rkrgl-font, inherit);
    text-align: left;
}

.rkrgl-tooltip.is-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

/* Scroll area: the card never grows past the viewport; the arrow stays
   outside it so overflow does not clip it. */
.rkrgl-tooltip-inner {
    max-height: 70vh;
    max-height: min(70vh, 480px);
    overflow: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    overflow-wrap: break-word;
    word-wrap: break-word;
}

.rkrgl-term:focus {
    outline: 2px solid var(--rkrgl-underline-color, #77a632);
    outline-offset: 2px;
}

.rkrgl-term:focus:not(:focus-visible) {
    outline: 0;
}

.rkrgl-tooltip-close:focus-visible,
.rkrgl-tooltip a:focus-visible {
    outline: 2px solid var(--rkrgl-accent, #77a632);
    outline-offset: 2px;
}

.rkrgl-tooltip-arrow {
    position: absolute;
    width: 10px;
    height: 10px;
    background: inherit;
    border: inherit;
    transform: rotate(45deg);
}

.rkrgl-pos-top .rkrgl-tooltip-arrow { bottom: -6px; left: calc(50% - 5px); border-top: 0; border-left: 0; }
.rkrgl-pos-bottom .rkrgl-tooltip-arrow { top: -6px; left: calc(50% - 5px); border-bottom: 0; border-right: 0; }
.rkrgl-pos-left .rkrgl-tooltip-arrow { right: -6px; top: calc(50% - 5px); border-bottom: 0; border-left: 0; }
.rkrgl-pos-right .rkrgl-tooltip-arrow { left: -6px; top: calc(50% - 5px); border-top: 0; border-right: 0; }

.rkrgl-tooltip-head {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 7px;
}

.rkrgl-tooltip-title {
    font-weight: 700;
    font-size: 13.5px;
    margin: 0;
    flex: 1 1 auto;
    word-break: break-word;
}

.rkrgl-tooltip-close {
    flex: 0 0 auto;
    border: 0;
    background: transparent;
    color: inherit;
    opacity: 0.55;
    cursor: pointer;
    font-size: 16px;
    line-height: 1;
    padding: 0 2px;
}

.rkrgl-tooltip-close:hover { opacity: 1; }

.rkrgl-tooltip-cat {
    display: inline-block;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    padding: 2px 8px;
    border-radius: 999px;
    background: var(--rkrgl-term-bg, rgba(119, 166, 50, 0.14));
    color: var(--rkrgl-accent, #5c8026);
    font-weight: 700;
    margin-bottom: 7px;
}

.rkrgl-tooltip-image {
    width: 100%;
    max-height: 120px;
    object-fit: cover;
    border-radius: calc(var(--rkrgl-radius, 10px) * 0.6);
    margin-bottom: 8px;
}

.rkrgl-tooltip-body {
    font-size: 12.6px;
    opacity: 0.94;
    word-break: break-word;
}

.rkrgl-tooltip-body p { margin: 0 0 6px; }
.rkrgl-tooltip-body p:last-child { margin-bottom: 0; }

.rkrgl-tooltip-syn {
    margin-top: 8px;
    font-size: 11.5px;
    opacity: 0.8;
}

.rkrgl-tooltip-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 10px;
    padding-top: 9px;
    border-top: 1px solid rgba(128, 128, 128, 0.22);
    font-size: 11.8px;
}

.rkrgl-tooltip-link {
    font-weight: 700;
    color: var(--rkrgl-accent, #77a632);
    text-decoration: none;
}

.rkrgl-tooltip-link:hover { text-decoration: underline; }

.rkrgl-tooltip-count {
    opacity: 0.75;
}

.rkrgl-tooltip-loading {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12.3px;
    opacity: 0.8;
}

.rkrgl-spinner {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 2px solid rgba(128, 128, 128, 0.3);
    border-top-color: var(--rkrgl-accent, #77a632);
    animation: rkrgl-spin 0.8s linear infinite;
    flex: 0 0 auto;
}

@keyframes rkrgl-spin {
    to { transform: rotate(360deg); }
}

/* lazy card extras */

.rkrgl-tooltip-source {
    margin-top: 10px;
}

.rkrgl-tooltip-source-thumb {
    float: right;
    width: 72px;
    height: auto;
    border-radius: 6px;
    margin: 0 0 6px 10px;
}

.rkrgl-tooltip-source-extract {
    font-size: 11.8px;
    opacity: 0.85;
    margin: 0;
}

.rkrgl-tooltip-source-link {
    display: inline-block;
    margin-top: 5px;
    font-size: 11px;
    color: var(--rkrgl-accent, #77a632);
}

.rkrgl-tooltip-video {
    position: relative;
    margin-top: 10px;
    padding-bottom: 56.25%;
    height: 0;
    border-radius: calc(var(--rkrgl-radius, 10px) * 0.6);
    overflow: hidden;
}

.rkrgl-tooltip-video iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.rkrgl-tooltip-related {
    margin-top: 10px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
}

.rkrgl-tooltip-related a {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11.3px;
    color: inherit;
    text-decoration: none;
    border: 1px solid rgba(128, 128, 128, 0.25);
    border-radius: calc(var(--rkrgl-radius, 10px) * 0.5);
    padding: 5px 7px;
    min-width: 0;
}

.rkrgl-tooltip-related a:hover {
    border-color: var(--rkrgl-accent, #77a632);
}

.rkrgl-tooltip-related img {
    width: 26px;
    height: 26px;
    object-fit: contain;
    flex: 0 0 auto;
    background: rgba(128, 128, 128, 0.08);
    border-radius: 4px;
}

.rkrgl-tooltip-related span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* tooltip effects (9) */

.rkrgl-fx-fade { transition: opacity 0.18s ease, visibility 0.18s ease; }

.rkrgl-fx-zoom { transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease; transform: scale(0.92); }
.rkrgl-fx-zoom.is-visible { transform: scale(1); }

.rkrgl-fx-slide-up { transition: opacity 0.22s ease, transform 0.22s ease, visibility 0.22s ease; transform: translateY(10px); }
.rkrgl-fx-slide-up.is-visible { transform: translateY(0); }

.rkrgl-fx-slide-down { transition: opacity 0.22s ease, transform 0.22s ease, visibility 0.22s ease; transform: translateY(-10px); }
.rkrgl-fx-slide-down.is-visible { transform: translateY(0); }

.rkrgl-fx-pulse.is-visible { animation: rkrgl-fx-pulse 1.6s ease 0s infinite; }
@keyframes rkrgl-fx-pulse {
    0%, 100% { box-shadow: var(--rkrgl-tooltip-shadow, 0 12px 32px rgba(15, 23, 42, 0.18)); }
    50% { box-shadow: 0 0 0 7px var(--rkrgl-term-bg, rgba(119, 166, 50, 0.16)), var(--rkrgl-tooltip-shadow, 0 12px 32px rgba(15, 23, 42, 0.18)); }
}

.rkrgl-fx-glow.is-visible { animation: rkrgl-fx-glow 1.8s ease 0s infinite; }
@keyframes rkrgl-fx-glow {
    0%, 100% { box-shadow: var(--rkrgl-tooltip-shadow, 0 12px 32px rgba(15, 23, 42, 0.18)); }
    50% { box-shadow: 0 0 22px 2px var(--rkrgl-accent, #77a632); }
}

.rkrgl-fx-bounce.is-visible { animation: rkrgl-fx-bounce 0.45s cubic-bezier(0.28, 0.84, 0.42, 1) 1; }
@keyframes rkrgl-fx-bounce {
    0% { transform: translateY(16px) scale(0.96); opacity: 0.4; }
    60% { transform: translateY(-5px) scale(1.01); opacity: 1; }
    100% { transform: translateY(0) scale(1); }
}

.rkrgl-fx-flip { transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s ease; transform: perspective(600px) rotateX(-14deg); transform-origin: top center; }
.rkrgl-fx-flip.is-visible { transform: perspective(600px) rotateX(0); }

.rkrgl-fx-elastic.is-visible { animation: rkrgl-fx-elastic 0.55s cubic-bezier(0.68, -0.55, 0.27, 1.55) 1; }
@keyframes rkrgl-fx-elastic {
    0% { transform: scale(0.6); opacity: 0; }
    70% { transform: scale(1.06); opacity: 1; }
    100% { transform: scale(1); }
}

/* =========================================================== glossary == */

.rkrgl-glossary-page {
    --rkrgl-g-fg: var(--rkrgl-fg, #2b2f26);
    max-width: 1080px;
    margin: 0 auto;
    padding: 26px 16px 46px;
    color: var(--rkrgl-g-fg);
    font-family: var(--rkrgl-font, inherit);
}

.rkrgl-breadcrumb ol {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    list-style: none;
    margin: 0 0 16px;
    padding: 0;
    font-size: 12.5px;
    color: var(--rkrgl-muted, #6b7264);
}

.rkrgl-breadcrumb li + li::before {
    content: "/";
    margin-right: 6px;
    opacity: 0.55;
}

.rkrgl-breadcrumb a {
    color: var(--rkrgl-link, #5c8026);
    text-decoration: none;
}

.rkrgl-breadcrumb a:hover { text-decoration: underline; }

.rkrgl-glossary-head {
    margin-bottom: 20px;
}

.rkrgl-glossary-title {
    margin: 0 0 8px;
    font-size: 30px;
    line-height: 1.2;
    color: var(--rkrgl-g-fg);
}

.rkrgl-glossary-intro {
    font-size: 14.5px;
    line-height: 1.7;
    color: var(--rkrgl-muted, #6b7264);
    max-width: 780px;
}

.rkrgl-glossary-intro p { margin: 0 0 8px; }

/* search */

.rkrgl-search {
    display: flex;
    gap: 8px;
    margin-bottom: 18px;
    max-width: 560px;
}

.rkrgl-search-input {
    flex: 1 1 auto;
    padding: 10px 14px;
    border: 1px solid var(--rkrgl-border, #dfe8d2);
    border-radius: var(--rkrgl-radius, 10px);
    background: var(--rkrgl-surface, #f4f8ee);
    color: var(--rkrgl-g-fg);
    font-size: 13.5px;
    font-family: inherit;
}

.rkrgl-search-input:focus {
    outline: 0;
    border-color: var(--rkrgl-accent, #77a632);
    box-shadow: 0 0 0 3px var(--rkrgl-term-bg, rgba(119, 166, 50, 0.15));
}

.rkrgl-search-submit {
    padding: 10px 18px;
    border: 0;
    border-radius: var(--rkrgl-radius, 10px);
    background: var(--rkrgl-accent, #77a632);
    color: #fff;
    font-weight: 700;
    font-size: 13px;
    cursor: pointer;
    font-family: inherit;
    transition: filter 0.15s ease, transform 0.1s ease;
}

.rkrgl-search-submit:hover { filter: brightness(1.07); }
.rkrgl-search-submit:active { transform: translateY(1px); }

/* letters */

.rkrgl-letters {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-bottom: 16px;
}

.rkrgl-letter {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 34px;
    padding: 0 8px;
    border-radius: calc(var(--rkrgl-radius, 10px) * 0.8);
    border: 1px solid var(--rkrgl-border, #dfe8d2);
    background: var(--rkrgl-surface, #f4f8ee);
    color: var(--rkrgl-g-fg);
    font-size: 13.5px;
    font-weight: 700;
    text-decoration: none;
    transition: transform 0.14s ease, background 0.14s ease, color 0.14s ease;
}

a.rkrgl-letter:hover {
    transform: translateY(-2px) scale(1.05);
    border-color: var(--rkrgl-accent, #77a632);
    color: var(--rkrgl-accent, #77a632);
}

.rkrgl-letter.is-active {
    background: var(--rkrgl-accent, #77a632);
    border-color: var(--rkrgl-accent, #77a632);
    color: #fff;
    animation: rkrgl-letter-pop 0.28s ease;
}

@keyframes rkrgl-letter-pop {
    0% { transform: scale(0.8); }
    70% { transform: scale(1.1); }
    100% { transform: scale(1); }
}

.rkrgl-letter.is-disabled {
    opacity: 0.38;
    cursor: default;
}

.rkrgl-letter-count {
    position: absolute;
    top: -6px;
    right: -5px;
    min-width: 15px;
    height: 15px;
    padding: 0 3px;
    border-radius: 999px;
    background: var(--rkrgl-accent-2, #5c8026);
    color: #fff;
    font-size: 9px;
    font-weight: 700;
    line-height: 15px;
    text-align: center;
}

/* categories */

.rkrgl-categories {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-bottom: 18px;
}

.rkrgl-cat {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 13px;
    border-radius: 999px;
    border: 1px solid var(--rkrgl-border, #dfe8d2);
    background: var(--rkrgl-bg, #fff);
    color: var(--rkrgl-g-fg);
    font-size: 12.5px;
    font-weight: 600;
    text-decoration: none;
    transition: transform 0.14s ease, border-color 0.14s ease;
}

/* The category chips reuse the letter badge, inline inside the chip (as an
   absolute badge it escaped to the page edge and widened the page on mobile). */
.rkrgl-cat .rkrgl-letter-count {
    position: static;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.rkrgl-cat:hover {
    transform: translateY(-1px);
    border-color: var(--rkrgl-accent, #77a632);
}

.rkrgl-cat.is-active {
    background: var(--rkrgl-accent, #77a632);
    border-color: var(--rkrgl-accent, #77a632);
    color: #fff;
}

.rkrgl-results-note {
    margin: 0 0 14px;
    font-size: 13px;
    color: var(--rkrgl-muted, #6b7264);
}

/* term list */

.rkrgl-term-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 14px;
    margin-bottom: 8px;
}

.rkrgl-term-item {
    background: var(--rkrgl-surface, #f4f8ee);
    border: 1px solid var(--rkrgl-border, #dfe8d2);
    border-radius: var(--rkrgl-radius, 10px);
    padding: 16px 18px;
    transition: transform 0.16s ease, box-shadow 0.16s ease;
    scroll-margin-top: 90px;
}

.rkrgl-term-item:hover {
    transform: translateY(-2px);
    box-shadow: var(--rkrgl-shadow, 0 6px 18px rgba(15, 23, 42, 0.1));
}

.rkrgl-term-name {
    margin: 0 0 4px;
    font-size: 16px;
    line-height: 1.3;
}

.rkrgl-term-name a {
    color: var(--rkrgl-g-fg);
    text-decoration: none;
    border-bottom: 2px var(--rkrgl-underline-style, dotted) var(--rkrgl-underline-color, #77a632);
}

.rkrgl-term-name a:hover { color: var(--rkrgl-accent, #77a632); }

.rkrgl-term-cat {
    display: inline-block;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    font-weight: 700;
    color: var(--rkrgl-accent, #5c8026);
    background: var(--rkrgl-term-bg, rgba(119, 166, 50, 0.12));
    padding: 2px 9px;
    border-radius: 999px;
    margin-bottom: 8px;
}

.rkrgl-term-excerpt {
    margin: 0 0 10px;
    font-size: 13px;
    line-height: 1.6;
    color: var(--rkrgl-muted, #6b7264);
}

.rkrgl-term-more {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--rkrgl-link, #5c8026);
    text-decoration: none;
}

.rkrgl-term-more:hover { text-decoration: underline; }

.rkrgl-empty {
    grid-column: 1 / -1;
    text-align: center;
    padding: 44px 12px;
    color: var(--rkrgl-muted, #6b7264);
    font-size: 14px;
}

/* pagination */

.rkrgl-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    margin-top: 22px;
}

.rkrgl-page-link {
    padding: 9px 16px;
    border: 1px solid var(--rkrgl-border, #dfe8d2);
    border-radius: var(--rkrgl-radius, 10px);
    background: var(--rkrgl-surface, #f4f8ee);
    color: var(--rkrgl-g-fg);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    transition: transform 0.14s ease, border-color 0.14s ease;
}

.rkrgl-page-link:hover {
    transform: translateY(-1px);
    border-color: var(--rkrgl-accent, #77a632);
    color: var(--rkrgl-accent, #77a632);
}

.rkrgl-page-info {
    font-size: 12.8px;
    color: var(--rkrgl-muted, #6b7264);
}

/* ========================================================== term page == */

.rkrgl-term-card {
    background: var(--rkrgl-surface, #f4f8ee);
    border: 1px solid var(--rkrgl-border, #dfe8d2);
    border-radius: var(--rkrgl-radius, 10px);
    padding: 26px 28px;
    margin-bottom: 22px;
}

.rkrgl-term-image {
    float: right;
    width: 150px;
    height: auto;
    border-radius: calc(var(--rkrgl-radius, 10px) * 0.8);
    margin: 0 0 12px 20px;
    border: 1px solid var(--rkrgl-border, #dfe8d2);
}

.rkrgl-term-title {
    margin: 0 0 10px;
    font-size: 27px;
    line-height: 1.2;
}

.rkrgl-term-synonyms {
    margin: 0 0 14px;
    font-size: 12.8px;
    color: var(--rkrgl-muted, #6b7264);
}

.rkrgl-chip {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 999px;
    background: var(--rkrgl-term-bg, rgba(119, 166, 50, 0.12));
    border: 1px solid var(--rkrgl-border, #dfe8d2);
    font-size: 11.5px;
    margin: 2px 3px 2px 0;
    color: var(--rkrgl-g-fg);
}

.rkrgl-term-definition {
    font-size: 14.5px;
    line-height: 1.75;
}

.rkrgl-term-definition p { margin: 0 0 12px; }
.rkrgl-term-definition ul, .rkrgl-term-definition ol { margin: 0 0 12px; padding-left: 22px; }
.rkrgl-term-definition a { color: var(--rkrgl-link, #5c8026); }
.rkrgl-term-definition img { max-width: 100%; height: auto; border-radius: 8px; }

.rkrgl-term-nodef {
    color: var(--rkrgl-muted, #6b7264);
    font-style: italic;
}

.rkrgl-source {
    margin-top: 18px;
    padding: 14px 16px;
    border-left: 3px solid var(--rkrgl-accent, #77a632);
    background: var(--rkrgl-bg, #fff);
    border-radius: 0 calc(var(--rkrgl-radius, 10px) * 0.8) calc(var(--rkrgl-radius, 10px) * 0.8) 0;
    overflow: hidden;
}

.rkrgl-source-thumb {
    float: right;
    width: 90px;
    height: auto;
    border-radius: 8px;
    margin: 0 0 8px 12px;
}

.rkrgl-source-extract {
    font-size: 12.8px;
    line-height: 1.6;
    color: var(--rkrgl-muted, #6b7264);
    margin: 0;
}

.rkrgl-source-link {
    display: inline-block;
    margin-top: 8px;
    font-size: 12px;
    font-weight: 700;
    color: var(--rkrgl-link, #5c8026);
}

.rkrgl-source-video {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
}

.rkrgl-source-video iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    border-radius: calc(var(--rkrgl-radius, 10px) * 0.8);
}

.rkrgl-term-external {
    margin-top: 14px;
}

.rkrgl-term-external a {
    font-weight: 700;
    color: var(--rkrgl-link, #5c8026);
}

/* related products */

.rkrgl-related {
    margin-bottom: 24px;
}

.rkrgl-related-title,
.rkrgl-see-also-title {
    font-size: 16px;
    margin: 0 0 12px;
}

.rkrgl-related-grid {
    list-style: none;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
    gap: 12px;
    margin: 0;
    padding: 0;
}

.rkrgl-related-card a {
    display: flex;
    flex-direction: column;
    gap: 7px;
    height: 100%;
    padding: 12px;
    background: var(--rkrgl-surface, #f4f8ee);
    border: 1px solid var(--rkrgl-border, #dfe8d2);
    border-radius: var(--rkrgl-radius, 10px);
    text-decoration: none;
    color: var(--rkrgl-g-fg);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.rkrgl-related-card a:hover {
    transform: translateY(-3px);
    box-shadow: var(--rkrgl-shadow, 0 6px 18px rgba(15, 23, 42, 0.1));
}

.rkrgl-related-card img {
    width: 100%;
    height: 110px;
    object-fit: contain;
    background: rgba(128, 128, 128, 0.06);
    border-radius: calc(var(--rkrgl-radius, 10px) * 0.6);
}

.rkrgl-related-name {
    font-size: 12.8px;
    line-height: 1.4;
    flex: 1 1 auto;
}

.rkrgl-related-price {
    font-size: 14px;
    color: var(--rkrgl-accent, #5c8026);
}

/* see also + back */

.rkrgl-see-also {
    margin-bottom: 22px;
}

.rkrgl-see-also ul {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
}

.rkrgl-see-also a {
    display: inline-block;
    padding: 6px 13px;
    border-radius: 999px;
    border: 1px solid var(--rkrgl-border, #dfe8d2);
    background: var(--rkrgl-surface, #f4f8ee);
    color: var(--rkrgl-g-fg);
    font-size: 12.5px;
    font-weight: 600;
    text-decoration: none;
    transition: transform 0.14s ease, border-color 0.14s ease;
}

.rkrgl-see-also a:hover {
    transform: translateY(-1px);
    border-color: var(--rkrgl-accent, #77a632);
    color: var(--rkrgl-accent, #77a632);
}

.rkrgl-term-back { margin: 0; }

.rkrgl-back {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 700;
    color: var(--rkrgl-link, #5c8026);
    text-decoration: none;
}

.rkrgl-back::before { content: "←"; }
.rkrgl-back:hover { text-decoration: underline; }

/* messages */

.rkrgl-message {
    text-align: center;
    padding: 54px 20px;
}

.rkrgl-message p {
    font-size: 15px;
    color: var(--rkrgl-muted, #6b7264);
    margin: 0 0 16px;
}

/* ================================================== product terms tab == */

.rkrgl-product-terms {
    margin: 14px 0;
}

.rkrgl-product-terms-title {
    font-size: 15px;
    margin: 0 0 8px;
}

.rkrgl-product-terms-list {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin: 0;
    padding: 0;
}

.rkrgl-product-term {
    display: inline-flex;
    align-items: baseline;
    gap: 4px;
    padding: 5px 12px;
    border-radius: 999px;
    border: 1px solid var(--rkrgl-border, #dfe8d2);
    background: var(--rkrgl-surface, #f4f8ee);
    font-size: 12.3px;
}

.rkrgl-product-term a {
    color: var(--rkrgl-link, #5c8026);
    font-weight: 700;
    text-decoration: none;
    border-bottom: 1px var(--rkrgl-underline-style, dotted) var(--rkrgl-underline-color, #77a632);
}

.rkrgl-product-term-short {
    color: var(--rkrgl-muted, #6b7264);
}

/* ============================================================ helpers == */

.rkrgl-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.rkrgl-front-root {
    display: none !important;
}

@media (prefers-reduced-motion: reduce) {
    .rkrgl-tooltip,
    .rkrgl-term,
    .rkrgl-letter,
    .rkrgl-term-item,
    .rkrgl-related-card a,
    .rkrgl-te-pulse,
    .rkrgl-te-glow,
    .rkrgl-te-flash,
    .rkrgl-te-highlight {
        animation: none !important;
        transition: none !important;
    }

    /* Static stand-in for the anchor effects: the target stays findable. */
    .rkrgl-te-pulse,
    .rkrgl-te-glow,
    .rkrgl-te-flash,
    .rkrgl-te-highlight {
        outline: 2px solid var(--rkrgl-accent, #77a632);
        outline-offset: 2px;
    }

    .rkrgl-tooltip {
        transform: none !important;
    }
}

@media (max-width: 640px) {
    .rkrgl-glossary-title { font-size: 24px; }
    .rkrgl-term-card { padding: 18px 16px; }
    .rkrgl-term-image { width: 100px; }
    .rkrgl-term-list { grid-template-columns: minmax(0, 1fr); }
    .rkrgl-tooltip { max-width: calc(100vw - 12px) !important; }
}

/* ---------------------------------------------------------------------- */
/* Public widget (v1.1) — displayHome / displayLeftColumn / displayRight   */
/* ---------------------------------------------------------------------- */
.rkrgl-widget {
    margin: 0 0 24px;
    padding: 18px 20px;
    background: var(--rkrgl-surface, #ffffff);
    border: 1px solid var(--rkrgl-border, #e3e6da);
    border-radius: var(--rkrgl-radius, 12px);
    box-shadow: var(--rkrgl-shadow, 0 6px 18px rgba(31, 41, 20, 0.06));
    color: var(--rkrgl-fg, #23281c);
    font-family: var(--rkrgl-font, inherit);
}

.rkrgl-widget-title {
    margin: 0 0 12px;
    font-size: 17px;
    font-weight: 700;
    letter-spacing: 0.01em;
    color: var(--rkrgl-fg, #23281c);
}

.rkrgl-widget-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.rkrgl-widget-item {
    margin: 0;
    padding: 0;
}

.rkrgl-widget-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background: var(--rkrgl-term-bg, rgba(119, 166, 50, 0.1));
    border: 1px solid var(--rkrgl-border, #e3e6da);
    border-radius: 999px;
    color: var(--rkrgl-link, #5c8026);
    font-size: 13px;
    line-height: 1.35;
    text-decoration: none;
    transition: background-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.rkrgl-widget-link:hover,
.rkrgl-widget-link:focus {
    background: var(--rkrgl-accent, #77a632);
    border-color: var(--rkrgl-accent, #77a632);
    color: #ffffff;
    transform: translateY(-1px);
}

.rkrgl-widget-count {
    display: inline-block;
    min-width: 18px;
    padding: 1px 6px;
    background: var(--rkrgl-accent, #77a632);
    border-radius: 999px;
    color: #ffffff;
    font-size: 11px;
    font-weight: 700;
    text-align: center;
}

.rkrgl-widget-link:hover .rkrgl-widget-count {
    background: rgba(255, 255, 255, 0.28);
}

.rkrgl-widget-more {
    display: inline-block;
    margin-top: 12px;
    color: var(--rkrgl-accent, #77a632);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
}

.rkrgl-widget-more:hover,
.rkrgl-widget-more:focus {
    text-decoration: underline;
}

@media (prefers-reduced-motion: reduce) {
    .rkrgl-widget-link {
        transition: none;
    }
}

/* ---------------------------------------------------- footer link (rule 37) */
/* Standalone block rendered by hookDisplayFooter; when the front JS detects
   a theme footer link list the anchor is moved inside it and this wrapper
   disappears, so these rules only style the no-list fallback. Colours are
   inherited so the block blends with any theme footer. */
.rkrgl-footer-linkblock {
    margin: 12px 0;
}

.rkrgl-footer-linkblock .rkrgl-footer-link {
    color: inherit;
    text-decoration: underline;
}

.rkrgl-footer-linkblock .rkrgl-footer-link:hover,
.rkrgl-footer-linkblock .rkrgl-footer-link:focus {
    color: var(--rkrgl-link, inherit);
}

li.rkrgl-footer-linkitem {
    list-style: none;
}