/* Matched up / home / down controls; page and menu scrolling remain native. */
.site-scroll-controls {
    position: fixed;
    right: max(22px, env(safe-area-inset-right));
    bottom: calc(max(28px, env(safe-area-inset-bottom)) + var(--cookie-control-clearance, 0px));
    z-index: 40;
    display: flex;
    flex-direction: column;
    gap: 10px;
    font-family: var(--font-family-sans, 'Kodchasan', sans-serif);
}
.site-scroll-controls[hidden] { display: none; }
/* Leave the permanent footer credit readable beside the floating controls. */
.site-theme:has(.site-scroll-controls:not([hidden]), .cc-root:not([hidden]) .cc-reopen:not([hidden])) .site-copyright { padding-right: 88px; }
.site-scroll-controls .site-scroll-button {
    position: relative;
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    padding: 0;
    border: 1px solid #b99a54;
    border-radius: 18px;
    background: linear-gradient(145deg, #223d51, #102a3b);
    color: #ecd08a;
    box-shadow: 0 7px 20px #0c243226, inset 0 1px 0 #ffffff18;
    cursor: pointer;
    text-decoration: none;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, color .18s ease;
}
.site-scroll-button svg { width: 23px; height: 23px; pointer-events: none; }
.site-scroll-controls .site-scroll-home {
    background: linear-gradient(145deg, #f4e5bb, #d5b875);
    border-color: #e1c789;
    color: #193747;
    box-shadow: 0 7px 20px #0c243226, inset 0 1px 0 #fff8df;
}
.site-scroll-controls .site-scroll-button[aria-disabled="true"] {
    color: #b1a783;
    border-color: #8e815e;
    background: linear-gradient(145deg, #293e4a, #1c303e);
    box-shadow: 0 4px 12px #0c243219, inset 0 1px 0 #ffffff10;
    cursor: default;
}
.site-scroll-controls .site-scroll-button:focus-visible { outline: 2px solid #b39348; outline-offset: 4px; }
.site-scroll-controls .site-scroll-button:active:not([aria-disabled="true"]) { transform: scale(.96); }
.site-scroll-tooltip {
    position: absolute;
    right: calc(100% + 12px);
    top: 50%;
    padding: 8px 13px;
    border: 1px solid #b99a5470;
    border-radius: 11px;
    background: #142f42;
    color: #f5e5b9;
    box-shadow: 0 5px 16px #102a3b20;
    font-size: 12px;
    line-height: 1.7;
    white-space: nowrap;
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
    transform: translate(5px, -50%);
    transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
}
.site-scroll-button:focus-visible .site-scroll-tooltip { opacity: 1; visibility: visible; transform: translate(0, -50%); }
@media (hover: hover) {
    .site-scroll-controls .site-scroll-button:hover:not([aria-disabled="true"]) {
        color: #ffe6a6;
        border-color: #e5c67f;
        box-shadow: 0 9px 24px #0c243238, inset 0 0 0 1px #d3b57325;
        transform: translateY(-2px);
    }
    .site-scroll-button:hover .site-scroll-tooltip { opacity: 1; visibility: visible; transform: translate(0, -50%); }
    .site-scroll-controls .site-scroll-home:hover { background: linear-gradient(145deg, #fff0c9, #e1c488); color: #102a3b; }
}
body:is([data-reading-contrast="dark"], [data-reading-contrast="light"]) .site-scroll-controls { background: transparent !important; }
body:is([data-reading-contrast="dark"], [data-reading-contrast="light"]) .site-scroll-button[aria-disabled="true"] { border-style: dashed; }
@media (max-width: 600px) {
    .site-scroll-controls { right: max(12px, env(safe-area-inset-right)); bottom: calc(max(18px, env(safe-area-inset-bottom)) + var(--cookie-control-clearance, 0px)); gap: 8px; }
    .site-scroll-controls .site-scroll-button { width: 44px; height: 44px; border-radius: 15px; }
    .site-scroll-button svg { width: 21px; height: 21px; }
    .site-theme:has(.site-scroll-controls:not([hidden])) .footer-statistics { padding-right: 64px; }
}
@media (prefers-reduced-motion: reduce) {
    .site-scroll-controls .site-scroll-button, .site-scroll-tooltip { transition: none; }
}
@media (forced-colors: active) {
    .site-scroll-controls .site-scroll-button, .site-scroll-tooltip { background: Canvas; color: ButtonText; border-color: ButtonText; }
    .site-scroll-controls .site-scroll-button:focus-visible { outline-color: Highlight; }
}
@media print {
    .site-scroll-controls { display: none !important; }
    .site-theme:has(.site-scroll-controls) .site-copyright { padding-right: 0 !important; }
    .site-theme:has(.site-scroll-controls) .footer-statistics { padding-right: 0 !important; }
}
