/* Shared black canvas and rounded panels. Page styles own their content. */
:root {
    --frame-bg: #121212;
    --frame-gap: 10px;
    --frame-radius: 28px;
    --frame-width: 1320px;
    --bg: var(--frame-bg);
    --dark: var(--frame-bg);
    --gap: var(--frame-gap);
    --r: var(--frame-radius);
}

body { background: var(--frame-bg); }

.nav {
    width: calc(100% - var(--frame-gap) * 2);
    max-width: calc(var(--frame-width) - var(--frame-gap) * 2);
    margin: var(--frame-gap) auto 0;
    padding: 1.1rem 2.5rem;
    position: sticky;
    top: var(--frame-gap);
    border-radius: var(--frame-radius);
    background: #fff;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

/* Keep content visible, including older generated article pages. */
.js [data-a], .js [data-a].v { opacity: 1; transform: none; transition: none; }

.nav-logo {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    min-height: 40px;
    color: var(--frame-bg);
    font: 800 1.1rem/1 var(--display);
    letter-spacing: -0.045em;
    text-decoration: none;
}

.nav-logo__symbol {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    flex-shrink: 0;
    border-radius: 13px;
    background: var(--frame-bg);
    transition: background 0.2s;
}

.nav-logo__symbol img { display: block; width: 28px; height: 28px; }
.nav-logo__name { white-space: nowrap; }
.nav-logo:hover .nav-logo__symbol { background: #0d7377; }
.nav-logo:focus-visible { outline: 3px solid #0d7377; outline-offset: 5px; border-radius: 13px; }

.bento {
    max-width: var(--frame-width);
    padding: var(--frame-gap);
    background: var(--frame-bg);
}

.bento > .row:last-child { margin-bottom: 0; }
.card-dark { background: #242424; }

.footer {
    max-width: var(--frame-width);
    margin: 0 auto;
    padding: 2rem 1.5rem 2.5rem;
    background: transparent;
    color: #b9b9b9;
}

/* A shared footer, with navigation ahead of business details. */
.site-footer {
    display: block;
    width: calc(100% - var(--frame-gap) * 2);
    max-width: calc(var(--frame-width) - var(--frame-gap) * 2);
    padding: 2.5rem 2.5rem 1.25rem;
    font: 400 0.95rem/1.6 var(--sans, var(--body));
    color: #b9b9b9;
}

.site-footer a {
    color: #f5f5f5;
    text-decoration: none;
    transition: color 0.2s;
}

/* Only the lower edge takes over the browser's native overscroll. */
html.footer-at-end { overscroll-behavior-y: none; }
.site-footer--elastic { position: relative; }
.site-footer--elastic > :not(.site-footer__peek) {
    transform: translateY(calc(var(--footer-pull, 0px) * -0.45));
}
.site-footer--elastic > .site-footer__bottom {
    transform: translateY(calc(var(--footer-pull, 0px) * -0.7));
}
.site-footer__peek {
    position: absolute;
    inset: auto 0 0;
    height: 78px;
    overflow: hidden;
    pointer-events: none;
    opacity: var(--footer-peek, 0);
}
.site-footer__cat {
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 180px;
    height: 76px;
    transform: translate(-50%, calc((1 - var(--footer-peek, 0)) * 78px));
}
.site-footer__cat-coat { fill: #242424; stroke: #f8a892; stroke-width: 1.8; }
.site-footer__cat-ear, .site-footer__cat-nose { fill: #f8a892; stroke: none; }
.site-footer__cat-eye { fill: none; stroke: #f5f5f5; stroke-width: 2.5; }
.site-footer__cat-detail { fill: none; stroke: #f8a892; stroke-width: 1.4; }
.site-footer__cat-copy { fill: #b9b9b9; font: 400 13px var(--sans, var(--body)); }
.site-footer__cat-paw {
    --paw-direction: 1;
    transform-box: fill-box;
    transform-origin: 50% 70%;
    animation: footer-cat-scrabble 0.42s infinite;
    animation-play-state: paused;
}
.site-footer__cat-paw--right {
    --paw-direction: -1;
    animation-delay: -0.21s;
}
.site-footer__peek:not([hidden]) .site-footer__cat-paw { animation-play-state: running; }
@keyframes footer-cat-scrabble {
    0%, 100% { transform: translateY(3px) rotate(calc(var(--paw-direction) * 9deg)); }
    30% { transform: translateY(-11px) rotate(calc(var(--paw-direction) * -14deg)); animation-timing-function: ease-in; }
    65% { transform: translateY(3px) rotate(calc(var(--paw-direction) * 9deg)); animation-timing-function: ease-out; }
}

.site-footer a:hover { color: #f8a892; }
.site-footer :is(a, summary):focus-visible {
    outline: 3px solid #f8a892;
    outline-offset: 5px;
    border-radius: 8px;
}

.site-footer__main {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr);
    gap: 2rem 3rem;
    padding-bottom: 2rem;
}

.site-footer__brand {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    min-height: 44px;
    font: 800 1.4rem/1 var(--display);
    letter-spacing: -0.045em;
}

.site-footer__mark {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    flex-shrink: 0;
    border: 1px solid #454545;
    border-radius: 14px;
}

.site-footer__mark img { display: block; width: 28px; height: 28px; }
.site-footer__description { max-width: 330px; margin: 1rem 0 0; }
.site-footer__label { margin: 0 0 0.65rem; color: #b9b9b9; font-size: 0.8rem; }
.site-footer__links { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.site-footer__links a { display: inline-flex; align-items: center; min-height: 44px; padding: 0.45rem 0; }
.site-footer__links a[aria-current="page"] { color: #f8a892; text-decoration: underline; text-underline-offset: 0.3em; }
.site-footer__external { min-width: 0; }
.site-footer__github { display: inline-flex; align-items: center; gap: 0.5rem; min-height: 44px; }
.site-footer__github svg { width: 15px; height: 15px; }

.site-footer__bottom {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 0.5rem 2rem;
    padding-top: 1rem;
    border-top: 1px solid #353535;
    font-size: 0.8rem;
}

.site-footer__copyright { margin: 0; padding-block: 0.7rem; }
.site-footer__legal { max-width: 500px; }
.site-footer__legal summary {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.6rem;
    min-height: 44px;
    padding-block: 0.6rem;
    color: #d4d4d4;
    cursor: pointer;
    list-style: none;
}

.site-footer__legal summary::-webkit-details-marker { display: none; }
.site-footer__legal summary::marker { content: ''; }
.site-footer__legal summary:hover { color: #f8a892; }
.site-footer__legal summary svg { width: 16px; height: 16px; flex-shrink: 0; }
.site-footer__legal[open] summary svg { transform: rotate(180deg); }
.site-footer__requisites { padding: 0.8rem 1rem; border: 1px solid #353535; border-radius: 14px; background: #1d1d1d; }
.site-footer__requisites p { margin: 0 0 0.65rem; color: #f5f5f5; font-size: 0.9rem; }
.site-footer__requisites dl { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0.4rem 1.2rem; margin: 0; }
.site-footer__requisites dt { color: #b9b9b9; }
.site-footer__requisites dd { margin: 0; color: #f5f5f5; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.site-footer__registry { display: inline-flex; align-items: center; min-height: 44px; margin-top: 0.5rem; }

.site-footer__data {
    display: flex;
    align-items: start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.75rem 2rem;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid #353535;
    font-size: 0.8rem;
}
.site-footer__data .footer-source { display: flex; align-items: center; gap: 0.3rem; }
.site-footer__data .footer-source a { display: inline-flex; align-items: center; min-height: 44px; }

/* Each article and the reader navigation sit on the same black canvas. */
.reader-shell {
    max-width: var(--frame-width);
    padding: var(--frame-gap);
    gap: var(--frame-gap);
    min-height: 100vh;
    background: var(--frame-bg);
}

.reader-toolbar {
    top: var(--frame-gap);
    height: calc(100vh - var(--frame-gap) * 2);
    border-radius: var(--frame-radius);
    background: var(--card);
}

.reader-page {
    margin-bottom: var(--frame-gap);
    border-radius: var(--frame-radius);
}

.reader-feed { background: transparent; container-type: inline-size; }
.reader-copy figure { width: min(980px, calc(100cqw - 3rem)); }

.reader-page:last-child { margin-bottom: 0; }

/* The calendar keeps its chart colors and control sizes. */
#main-content {
    width: min(var(--frame-width), 100%);
    padding: var(--frame-gap);
    background: var(--frame-bg);
}

#main-content > .hero.overview,
#main-content > .calendar-section,
#main-content > .supporting-analysis,
#main-content > .method {
    border: 0;
    border-radius: var(--frame-radius);
}

#main-content > .hero.overview { margin-bottom: var(--frame-gap); }
#main-content > .supporting-analysis,
#main-content > .method { margin-top: var(--frame-gap); }

.calendar-filterbar.calendar-tools {
    top: calc(var(--nav-height) + var(--frame-gap) * 2);
}

.month-label {
    top: calc(var(--nav-height) + var(--filter-height) + var(--frame-gap) * 2 + 14px);
}

@media (max-width: 1180px) {
    .reader-toolbar {
        height: auto;
        margin-bottom: var(--frame-gap);
    }
}

@media (max-width: 1100px) {
    .nav { padding-inline: 1.5rem; }
    .nav-link { padding-inline: 0.85rem; }
}

@media (max-width: 860px) {
    .site-footer__main { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .site-footer__identity { grid-column: 1 / -1; }
    .site-footer__description { max-width: 440px; }
}

@media (max-width: 768px) {
    :root { --frame-gap: 8px; --frame-radius: 24px; }
    .nav { padding: 0.75rem 1rem; }
    .nav-logo { gap: 0.5rem; font-size: 0.93rem; }
    .nav-logo__symbol { width: 34px; height: 34px; border-radius: 11px; }
    .nav-logo__symbol img { width: 24px; height: 24px; }
    .nav:has(.nav-center) {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 0.65rem 0.5rem;
    }
    .nav:has(.nav-center) .nav-right { display: contents; }
    .nav:has(.nav-center) .nav-logo { justify-self: start; }
    .nav:has(.nav-center) .nav-cta { grid-column: 2; grid-row: 1; }
    .nav .nav-center { display: flex; grid-column: 1 / -1; grid-row: 2; width: 100%; }
    .nav .nav-center .nav-link {
        display: inline-flex;
        min-height: 44px;
        align-items: center;
        justify-content: center;
        flex: 1;
        padding: 0.65rem 0.4rem;
        font-family: var(--sans, var(--body));
        font-size: 0.82rem;
        letter-spacing: 0.01em;
        text-align: center;
        white-space: nowrap;
    }
    html { scroll-padding-top: calc(var(--nav-height, 125px) + 20px); }
    html:has(.reader-open) { scroll-padding-top: 80px; }
    .site-footer { padding: 2rem 1.25rem 1.25rem; }
    .reader-copy figure { width: 100cqw; }
}

@media (max-width: 540px) {
    .site-footer__main { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; padding-bottom: 1.5rem; }
    .site-footer__identity { grid-column: auto; }
    .site-footer__brand { font-size: 1.2rem; }
    .site-footer__description { margin-top: 0.75rem; font-size: 0.9rem; }
    .site-footer__links { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 1rem; }
    .site-footer__bottom { grid-template-columns: minmax(0, 1fr); gap: 0; }
    .site-footer__legal { width: 100%; max-width: none; }
    .site-footer__legal summary { justify-content: space-between; }
    .site-footer__data { display: grid; font-size: 0.78rem; }
}

@media (max-width: 360px) {
    .nav .nav-center:has(.nav-link:nth-child(4)) .nav-link { font-size: 0.72rem; padding-inline: 0.2rem; }
    .nav-logo { gap: 0.4rem; font-size: 0.82rem; }
    .nav-cta { padding-inline: 1rem; }
}

@media (prefers-reduced-motion: reduce) {
    .site-footer--elastic > :not(.site-footer__peek) { transform: none; }
    .site-footer__peek { display: none; }
    .site-footer__cat-paw { animation: none; }
    .nav-logo__symbol { transition: none; }
    .site-footer a { transition: none; }
}