@charset "UTF-8";
/* ==========================================================================
   footer.css — full-width #site-footer, the frontend's .app-footer.
   ========================================================================== */

#site-footer {
    width: 100%;
    box-sizing: border-box;
    background: rgb(var(--c-surface));
    color: rgb(var(--c-fg-subtle));
    border-top: 1px solid rgb(var(--c-line));
    padding: 1.5rem 3rem;
    font-size: .75rem;
}

@media (min-width: 48em) {
    #site-footer {
        flex: 0 0 100%;
    }
}

.footer-inner {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem 1.25rem;
}

.footer-brand {
    font-size: .875rem;
    font-weight: 600;
    letter-spacing: -0.025em;
    color: rgb(var(--c-fg));
}
.footer-sep { display: none; }
.footer-license { color: rgb(var(--c-fg-subtle)); }

.footer-link,
.footer-license a {
    color: rgb(var(--c-fg-muted));
    text-decoration: none;
    text-underline-offset: 4px;
    transition: color .15s;
}
.footer-link:hover,
.footer-license a:hover {
    color: rgb(var(--c-fg));
    text-decoration: underline;
}

.footer-bottom {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid rgb(var(--c-line));
}

.footer-tagline {
    font-style: italic;
    color: rgb(var(--c-fg-subtle));
}

.retro-toggle-btn {
    padding: .375rem .75rem;
    font: 500 .75rem/1.2 var(--font-sans);
    color: rgb(var(--c-fg-muted));
    background: transparent;
    border: 1px solid rgb(var(--c-line));
    border-radius: var(--radius-control);
    cursor: pointer;
    transition: color .15s, border-color .15s;
}
.retro-toggle-btn:hover {
    color: rgb(var(--c-fg));
    border-color: rgb(var(--c-line-strong));
}
.retro-toggle-btn .retro-label-off { display: none; }
[data-retro='1'] .retro-toggle-btn .retro-label-on { display: none; }
[data-retro='1'] .retro-toggle-btn .retro-label-off { display: inline; }

@media (max-width: 47.99em) {
    #site-footer { padding: 1.5rem 1rem; }
}
