/*
 * Horoscop Space — mobile-first accessibility layer (1.8.0.0)
 *
 * This file is enqueued last. It does not replace the visual system or any
 * calculation code; it establishes the final responsive and accessibility
 * contract for the theme and its page-specific tools.
 */

:root {
    --hs-mobile-gutter: clamp(16px, 4.5vw, 24px);
    --hs-touch-target: 44px;
    --hs-touch-comfort: 48px;
    --hs-focus-ring: #7a4d00;
    --hs-focus-ring-soft: rgba(122, 77, 0, .28);
}

html {
    min-width: 320px;
    text-size-adjust: 100%;
    scroll-padding-top: calc(76px + env(safe-area-inset-top, 0px));
}

body {
    min-width: 320px;
    overflow-x: hidden;
    overflow-x: clip;
}

/* Never allow long translated labels, URLs or chart values to widen a grid. */
*, *::before, *::after { min-width: 0; }
button, input, select, textarea { max-width: 100%; }
img, video, canvas, svg, iframe { max-width: 100%; }

/* A consistent visible focus indicator is required for keyboard and switch
 * users. It is intentionally independent of the decorative gold palette. */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 3px solid var(--hs-focus-ring);
    outline-offset: 3px;
    box-shadow: 0 0 0 5px var(--hs-focus-ring-soft);
}

:where(button, input[type="button"], input[type="submit"], input[type="reset"],
    select, summary, [role="button"]) {
    touch-action: manipulation;
}

/* Comfortable controls without making inline text links into large blocks. */
.hs-btn,
.button,
.hs-icon-btn,
.hs-location-btn,
.hs-submenu-toggle,
.hs-natal__submit,
.hs-natal__purchase-submit,
.hs-natal__geo-btn,
.hs-bazi-submit,
.hs-synastry__button,
.hs-sky-events-filters button,
.hs-btn--quiet {
    min-height: var(--hs-touch-comfort);
}

.hs-icon-btn { min-width: var(--hs-touch-target); }
.hs-submenu-toggle { min-width: var(--hs-touch-target); }

/* Text and spacing contract for narrow screens. */
@media (max-width: 760px) {
    .hs-container,
    .shell {
        width: min(calc(100% - (2 * var(--hs-mobile-gutter))), var(--hs-max, 1180px));
    }

    .site-header__inner,
    .hs-header-row {
        min-height: 64px;
        gap: 8px;
        padding-inline: max(0px, env(safe-area-inset-left, 0px)) max(0px, env(safe-area-inset-right, 0px));
    }

    .hs-header-actions { gap: 4px; }
    .hs-brand-name { font-size: clamp(.94rem, 4.7vw, 1.14rem); }
    .hs-brand-tagline { display: none; }
    .hs-language select { min-height: var(--hs-touch-target); font-size: .875rem; }

    .hs-header .site-nav,
    .site-nav {
        inset-inline: var(--hs-mobile-gutter);
        top: calc(100% + 8px);
        max-height: calc(100dvh - 88px - env(safe-area-inset-top, 0px));
        padding: 12px;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }

    .hs-header .site-nav a,
    .site-nav a {
        min-height: var(--hs-touch-target);
        display: flex;
        align-items: center;
        padding: 10px 12px;
        white-space: normal;
        overflow-wrap: anywhere;
        line-height: 1.35;
    }

    .hs-header .site-nav .sub-menu a,
    .site-nav .sub-menu a {
        min-height: var(--hs-touch-target);
        white-space: normal;
    }

    .hs-header .site-nav__list > .menu-item-has-children > a {
        min-height: var(--hs-touch-comfort);
    }

    .hs-header .nav-mega__column a,
    .nav-mega__column a { min-height: var(--hs-touch-target); }

    .hs-hero-copy { padding-inline: 0; }
    .hs-hero-actions,
    .hero__actions { align-items: stretch; }
    .hs-hero-actions > .hs-btn,
    .hero__actions > .button { width: 100%; }

    .hs-trust-row,
    .hero__trust { gap: 12px; }
    .hs-trust-item,
    .hero__trust > * { min-height: 44px; }

    .section,
    .hs-section { padding-block: clamp(40px, 9vw, 58px); }
    .section--compact { padding-block: clamp(32px, 8vw, 46px); }

    .section-heading,
    .section-heading--split,
    .sign-dashboard__heading,
    .hs-blog-heading { margin-bottom: 24px; }

    .section-heading h2,
    .personal-card h2,
    .newsletter-card h2,
    .hs-blog-heading h2 { line-height: 1.08; }

    .zodiac-selector__mobile,
    .hs-zodiac-grid {
        padding-block: 4px 8px;
        overscroll-behavior-inline: contain;
        scroll-snap-type: x proximity;
        -webkit-overflow-scrolling: touch;
    }

    .zodiac-mobile-sign,
    .hs-zodiac {
        min-height: 84px;
        scroll-snap-align: center;
    }

    .zodiac-mobile-sign small,
    .hs-zodiac small { font-size: .75rem; }

    .hs-feature-grid,
    .feature-grid { gap: 14px; }
    .hs-feature,
    .feature-card { min-height: 0; }

    .hs-latest,
    .hs-blog-toolbar,
    .personal-card,
    .newsletter-card,
    .compatibility-picker,
    .forecast-main,
    .forecast-premium,
    .sign-summary-card { border-radius: 18px; }

    .hs-latest { padding: 20px var(--hs-mobile-gutter); }
    .hs-latest-head { gap: 14px; }
    .hs-latest-all { min-height: var(--hs-touch-target); display: inline-flex; align-items: center; }
    .hs-latest-item {
        grid-template-columns: 28px 56px minmax(0, 1fr) 20px;
        gap: 10px;
        min-height: 72px;
        padding-block: 12px;
    }
    .hs-latest-thumb img { width: 56px; height: 50px; }
    .hs-latest-copy strong { font-size: 1rem; line-height: 1.3; }
    .hs-latest-copy small { display: -webkit-box; margin-top: 4px; font-size: .875rem; line-height: 1.35; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }

    .hs-footer { padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px)); }
    .hs-footer p,
    .hs-footer a,
    .site-footer li a { font-size: .875rem; line-height: 1.45; }
    .hs-footer-nav a,
    .site-footer li a { min-height: var(--hs-touch-target); display: inline-flex; align-items: center; }

    .hs-search-overlay { padding: max(18px, env(safe-area-inset-top, 0px)) var(--hs-mobile-gutter); place-items: start center; }
    .hs-search-box { width: 100%; margin-top: 8vh; padding: 16px; }
    .hs-search-form input { min-height: var(--hs-touch-comfort); font-size: 16px; }

    /* Forms use a 16px input size to prevent mobile browser auto-zoom. */
    .hs-blog-search input,
    .hs-synastry__fields input,
    .hs-synastry__fields select,
    .hs-synastry__order input,
    .hs-natal__field input,
    .hs-natal__field select,
    .hs-bazi-person input,
    .hs-bazi-person select,
    .hs-bazi-settings select,
    .hs-mobile-sign-select select { min-height: var(--hs-touch-comfort); font-size: 16px; }

    .hs-blog-search { display: grid; gap: 10px; }
    .hs-blog-search input { width: 100%; margin: 0; }
    .hs-blog-search .hs-btn { width: 100%; }
    .hs-blog-topics { gap: 8px; overflow-x: auto; flex-wrap: nowrap; padding-block: 14px 4px; scrollbar-width: thin; }
    .hs-blog-topic { min-height: var(--hs-touch-target); flex: 0 0 auto; padding-inline: 14px; font-size: .875rem; }
    .hs-blog-card__meta { font-size: .875rem; letter-spacing: .04em; }
    .hs-blog-card__body > p { font-size: .96rem; line-height: 1.6; }
    .hs-blog-card__read,
    .hs-blog-clear { min-height: var(--hs-touch-target); display: inline-flex; align-items: center; font-size: .9375rem; }

    .hs-natal__row,
    .hs-bazi-person-grid,
    .hs-synastry__profiles { grid-template-columns: 1fr; }
    .hs-natal__row { gap: 12px; }
    .hs-natal__form,
    .hs-bazi-person,
    .hs-bazi-settings,
    .hs-bazi-result__inner,
    .hs-synastry__profile { padding: 18px; }
    .hs-natal__submit,
    .hs-natal__purchase-submit,
    .hs-bazi-submit,
    .hs-synastry__button { width: 100%; justify-content: center; }
    .hs-natal__purchase { padding: 20px 18px; }

    .hs-bazi-inline-fields,
    .hs-bazi-settings { grid-template-columns: 1fr; }
    .hs-bazi-settings legend { grid-column: auto; }
    .hs-bazi-pillar-table { min-width: 560px; font-size: .9rem; }
    .hs-bazi-result { overflow-x: auto; }

    .hs-synastry-hero__inner,
    .hs-synastry__body { width: min(calc(100% - (2 * var(--hs-mobile-gutter))), 600px); }
    .hs-synastry-hero h1 { font-size: clamp(2.35rem, 12vw, 3.2rem); line-height: 1.03; }
    .hs-synastry-hero p { font-size: 1rem; line-height: 1.6; }
    .hs-synastry__fields { grid-template-columns: 1fr; gap: 12px; }
    .hs-synastry__fields label,
    .hs-synastry__order label { font-size: .9375rem; }
    .hs-synastry__fields label small,
    .hs-synastry__order label small { font-size: .875rem; line-height: 1.45; }
    .hs-synastry__privacy,
    .hs-synastry__server-note { font-size: .9375rem; line-height: 1.55; }
    .hs-synastry__planet-strip,
    .hs-synastry__aspects { grid-template-columns: 1fr 1fr; }
    .hs-synastry__map { min-height: 230px; }
    .hs-synastry__chart-legend { gap: 14px; flex-wrap: wrap; font-size: .875rem; }
    .hs-synastry__purchase { padding: 20px 18px; }
    .hs-synastry__purchase-copy ul { font-size: .9375rem; line-height: 1.5; }
    .hs-synastry__disclaimer { font-size: .875rem; line-height: 1.55; }

    .hs-sky-events-board { margin-inline: var(--hs-mobile-gutter); padding-inline: 16px; }
    .hs-sky-events-location { width: 100%; }
    .hs-sky-events-filters { gap: 8px; overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px; }
    .hs-sky-events-filters button { min-height: var(--hs-touch-target); flex: 0 0 auto; font-size: .875rem; }
    .hs-sky-events-grid { grid-template-columns: 1fr; }
    .hs-sky-event-card__type,
    .hs-sky-event-card__date,
    .hs-sky-event-card__visibility,
    .hs-sky-event-card__row dt,
    .hs-sky-event-card__row dd { font-size: .875rem; line-height: 1.45; }
    .hs-sky-event-card__content h3 { font-size: clamp(1.45rem, 7vw, 2rem); line-height: 1.08; }
    .hs-sky-events-method { grid-template-columns: 1fr; margin-inline: var(--hs-mobile-gutter); padding: 26px 20px; }
    .hs-sky-events-method p,
    .hs-sky-events-method__privacy { font-size: .9375rem; line-height: 1.6; }

    .hs-lunar-observatory .hs-lunar-kicker,
    .hs-lunar-observatory .hs-lunar-live,
    .hs-lunar-observatory .hs-lunar-eyebrow,
    .hs-lunar-observatory .hs-lunar-reading span:first-child,
    .hs-lunar-observatory .hs-lunar-disclaimer { font-size: .875rem; line-height: 1.45; }
    .hs-lunar-observatory .hs-lunar-reading strong { font-size: .9375rem; }
    .hs-lunar-observatory .hs-moon-phase-label { font-size: .875rem; }
    .hs-lunar-observatory .hs-location-btn { min-height: var(--hs-touch-comfort); font-size: .9375rem; }

    .hs-sky-strip__cell { min-height: 44px; }
    .hs-sky-strip__name,
    .hs-sky-strip__retro { font-size: .8125rem; }
    .hs-sky-strip__pos { font-size: .9375rem; }

    .forecast-main__topline,
    .forecast-main__scope,
    .sign-summary-card small,
    .forecast-premium small,
    .sign-scope-card__copy small { font-size: .875rem; letter-spacing: .04em; }
    .sign-scope-card { min-height: 72px; padding: 12px; }
    .sign-scope-card__copy strong { font-size: .9375rem; }
    .sign-scope-card__copy small { line-height: 1.45; }
    .forecast-copy { font-size: 1rem; line-height: 1.7; }
    .forecast-quote { gap: 12px; padding: 16px; }

    /* Tables remain readable: scroll the table, never the whole page. */
    .entry-content table,
    .hs-bazi-result__inner table,
    .hs-sky-now__table { display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .entry-content pre,
    .entry-content code { max-width: 100%; overflow-x: auto; }
}

@media (max-width: 430px) {
    .hs-brand-name { font-size: .92rem; }
    .hs-header-actions { gap: 2px; }
    .hs-icon-btn { width: var(--hs-touch-target); height: var(--hs-touch-target); }
    .hs-language select { width: 58px; padding-inline: 8px 22px; }
    .hs-mobile-toggle { width: var(--hs-touch-target); }
    .hs-latest-item { grid-template-columns: 24px 50px minmax(0, 1fr) 18px; gap: 8px; }
    .hs-latest-thumb img { width: 50px; height: 46px; }
    .hs-latest-copy strong { font-size: .9375rem; }
    .hs-synastry__planet-strip,
    .hs-synastry__aspects { grid-template-columns: 1fr; }
    .hs-sky-events-board { margin-inline: 10px; padding-inline: 12px; }
}

@media (max-width: 360px) {
    .hs-container,
    .shell { width: calc(100% - 32px); }
    .hs-brand-name { font-size: .88rem; }
    .hs-language select { width: 54px; }
    .hs-trust-row { grid-template-columns: 1fr; }
    .hs-feature { grid-template-columns: 92px minmax(0, 1fr); }
}

/* RTL keeps logical spacing and places the mobile controls correctly. */
[dir="rtl"] .hs-header-actions { justify-content: flex-start; }
[dir="rtl"] .hs-blog-search__icon { left: auto; right: 17px; }
[dir="rtl"] .hs-blog-search input { padding-inline: 47px 20px; }
[dir="rtl"] .hs-synastry__aspect { border-left: 0; border-right: 3px solid var(--aspect-color); border-radius: 12px 0 0 12px; }

/* High-contrast and forced-colour users should not lose borders or focus. */
@media (prefers-contrast: more) {
    :root { --hs-focus-ring: #4d2600; --hs-focus-ring-soft: transparent; }
    .hs-card,
    .hs-blog-card,
    .hs-blog-toolbar,
    .hs-natal__form,
    .hs-bazi-person,
    .hs-bazi-settings,
    .hs-synastry__profile { border-color: currentColor; }
    a { text-decoration-thickness: .12em; }
}

@media (forced-colors: active) {
    *, *::before, *::after { box-shadow: none !important; text-shadow: none !important; }
    :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible { outline: 2px solid Highlight; box-shadow: none; }
    .hs-btn, .button, .hs-icon-btn, .hs-submenu-toggle { border: 1px solid ButtonText; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
}