/* NOMOAR shared design tokens and utilities */
:root {
    --nomoar-bp-sm: 640px;
    --nomoar-bp-md: 768px;
    --nomoar-bp-lg: 900px;
    --nomoar-touch-min: 44px;
    --nomoar-font-body: 'Source Sans 3', system-ui, sans-serif;
    --nomoar-font-display: 'Eveleth', Georgia, serif;
    --nomoar-bg: #000000;
    --nomoar-surface: #16161a;
    --nomoar-elevated: #1c1c22;
    --nomoar-border: #2a2a32;
    --nomoar-text: #e8e6e3;
    --nomoar-muted: #9a9690;
    --nomoar-accent: #c9a227;
    --nomoar-accent-soft: rgba(201, 162, 39, 0.15);
    --nomoar-link: #d4b84a;
    --nomoar-link-readable: #9ecfff;
    --nomoar-link-readable-hover: #cfe8ff;
    --nomoar-orange: #ff6b00;
}

.nomoar-input,
input.nomoar-input,
textarea.nomoar-input,
select.nomoar-input {
    width: 100%;
    max-width: 100%;
    padding: 0.6rem 0.75rem;
    background: var(--nomoar-bg);
    border: 1px solid var(--nomoar-border);
    color: var(--nomoar-text);
    border-radius: 4px;
    font-family: inherit;
}

.nomoar-auth-card {
    max-width: 28rem;
    margin: 0 auto;
    background: var(--nomoar-elevated);
    border: 1px solid var(--nomoar-border);
    border-radius: 10px;
    padding: 1.75rem;
}

.nomoar-auth-card h1 {
    margin-top: 0;
    font-size: 1.5rem;
}

.nomoar-auth-card .row {
    margin-bottom: 1rem;
}

.nomoar-auth-card label {
    display: block;
    margin-bottom: 0.35rem;
    font-weight: 500;
}

.nomoar-auth-card .helptext,
.nomoar-auth-card .errorlist {
    font-size: 0.82rem;
    color: var(--nomoar-muted);
    margin: 0.35rem 0 0;
    padding-left: 1rem;
}

.nomoar-auth-card .errorlist {
    color: #f87171;
    list-style: none;
    padding-left: 0;
}

.nomoar-home-grid {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 1.25rem;
    margin-top: 1rem;
}

@media (min-width: 576px) {
    .nomoar-home-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 900px) {
    .nomoar-home-grid { grid-template-columns: repeat(3, 1fr); }
}

/* Shared archive event cards (homepage + timeline on smaller screens) */
.nomoar-archive-grid {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 1.25rem;
}

@media (min-width: 576px) {
    .nomoar-archive-grid { grid-template-columns: repeat(2, 1fr); }
}

.nomoar-archive-card,
.nomoar-home-grid-card {
    display: flex;
    flex-direction: column;
    background: var(--nomoar-elevated);
    border: 1px solid var(--nomoar-border);
    border-radius: 10px;
    overflow: hidden;
    text-decoration: none !important;
    color: inherit;
    transition: border-color 0.2s, transform 0.2s;
    height: 100%;
}

.nomoar-archive-card:hover,
.nomoar-home-grid-card:hover {
    border-color: var(--nomoar-accent);
    transform: translateY(-2px);
}

.nomoar-archive-card .nomoar-card-photo img,
.nomoar-home-grid-card .nomoar-card-photo img {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    background: #1a1a22;
}

.nomoar-archive-placeholder,
.nomoar-home-grid-card .nomoar-grid-placeholder {
    aspect-ratio: 4 / 3;
    background: linear-gradient(160deg, #2a2418, #1a1a22);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--nomoar-font-display);
    font-size: 2rem;
    font-weight: 700;
    color: var(--nomoar-accent);
    opacity: 0.75;
    text-decoration: none;
}

.nomoar-archive-caption,
.nomoar-home-grid-caption {
    padding: 0.9rem 1rem 1rem;
    flex: 1;
}

.nomoar-archive-caption .year,
.nomoar-home-grid-caption .year,
.nomoar-archive-caption .nomoar-tl-card-date,
.nomoar-home-grid-caption .nomoar-tl-card-date {
    font-family: var(--nomoar-font-display);
    color: var(--nomoar-accent);
    font-weight: 700;
    font-size: 0.8rem;
}

.nomoar-home-grid-caption h3,
.nomoar-home-grid-caption .nomoar-tl-card-title {
    font-family: var(--nomoar-font-display);
    font-size: 0.95rem;
    font-weight: 700;
    line-height: 1.3;
    margin: 0.35rem 0 0.5rem;
    border: none;
    padding: 0;
}

.nomoar-archive-caption p,
.nomoar-home-grid-caption p,
.nomoar-archive-caption .nomoar-tl-card-desc {
    margin: 0;
    font-size: 0.82rem;
    color: var(--nomoar-muted);
    line-height: 1.45;
}

.nomoar-stats-row {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
    margin: 2rem 0;
}

@media (min-width: 992px) {
    .nomoar-stats-row { grid-template-columns: repeat(4, 1fr); }
}

.nomoar-stat-card {
    background: var(--nomoar-elevated);
    border: 1px solid var(--nomoar-border);
    border-radius: 8px;
    padding: 1.25rem;
    text-align: center;
}

.nomoar-stat-card .stat-value {
    font-family: var(--nomoar-font-display);
    font-size: 1.85rem;
    font-weight: 700;
    color: var(--nomoar-accent);
}

.nomoar-stat-card .stat-label {
    font-size: 0.8rem;
    color: var(--nomoar-muted);
    margin-top: 0.35rem;
}

.nomoar-cta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1rem;
    justify-content: center;
    margin: 1.5rem 0;
}

.btn:focus-visible,
.nomoar-header a:focus-visible,
.nomoar-main a:focus-visible {
    outline: 2px solid var(--nomoar-accent);
    outline-offset: 2px;
}

/* Shared mobile polish */
html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

@media (max-width: 639px) {
    .nomoar-main {
        padding: 1.25rem 1rem 2.5rem;
    }

    .nomoar-cta-row {
        gap: 0.65rem;
    }

    .nomoar-cta-row .btn {
        min-height: var(--nomoar-touch-min);
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    .site-footer {
        padding: 1.5rem 1rem;
    }

    .nomoar-site-disclaimer {
        padding: 1rem 1rem 0;
    }

    .nomoar-legal-footer {
        padding: 0 0.5rem 1.5rem;
    }

    .nomoar-editorial-banner {
        font-size: 0.82rem;
        padding: 0.75rem 1rem;
    }

    h2 {
        font-size: 1.25rem;
        margin-top: 2rem;
    }
}