@font-face { font-family:'Inter'; font-style:normal; font-weight:400 700; font-display:swap; src:url(/assets/fonts/inter-latin.woff2) format('woff2'); }
@font-face { font-family:'Outfit'; font-style:normal; font-weight:500 700; font-display:swap; src:url(/assets/fonts/outfit-latin.woff2) format('woff2'); }
:root { --bg:#f5f1e6; --fg:#1f2a1f; --muted:#5d6656; --card:#fffdf7; --line:#d8d0b8; --accent:#2f5d3a; --accent-fg:#fff; --khaki:#b8a46a; --bar:#22402a; --err:#9b1c1c; --ok:#1b6b3a; }
@media (prefers-color-scheme: dark) { :root { --bg:#141a15; --fg:#e8e6df; --muted:#a3ab9a; --card:#1d251e; --line:#34402f; --accent:#7fbf8b; --accent-fg:#10210f; --khaki:#c9b77a; --bar:#0f1a12; --err:#ff8a8a; --ok:#7bd8a0; } }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--fg); font:16px/1.6 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; -webkit-font-smoothing:antialiased; }
h1, h2, h3, .brand, .btn, .nav-toggle { font-family:'Outfit', 'Inter', system-ui, sans-serif; letter-spacing:-.01em; }
h1 { font-size:clamp(1.9rem,4.5vw,2.6rem); line-height:1.15; font-weight:700; } h2 { font-weight:600; letter-spacing:-.015em; } h3 { font-weight:600; }
.site-header { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.75rem 1rem; background:var(--card); border-bottom:1px solid var(--line); flex-wrap:wrap; }
.brand { font-weight:700; color:var(--accent); text-decoration:none; font-size:1.3rem; letter-spacing:.02em; }
nav { display:flex; gap:1rem; align-items:center; flex-wrap:wrap; }
nav a { color:var(--fg); text-decoration:none; font-weight:500; } nav a.active { color:var(--accent); font-weight:600; }
.container { max-width:900px; margin:0 auto; padding:1rem; }
.card { background:var(--card); border:1px solid var(--line); border-radius:8px; padding:1rem; margin:1rem 0; }
.narrow { max-width:380px; } .cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:1rem; }
.big { font-size:2rem; margin:.25rem 0; } .muted, small { color:var(--muted); }
label { display:block; margin:.75rem 0; font-weight:600; } label small { display:block; font-weight:400; }
input, select { display:block; width:100%; padding:.5rem; margin-top:.25rem; font:inherit; color:var(--fg); background:var(--bg); border:1px solid var(--line); border-radius:6px; }
button { padding:.55rem 1.1rem; font:inherit; font-weight:600; color:var(--accent-fg); background:var(--accent); border:0; border-radius:8px; cursor:pointer; }
button.danger { background:#b3261e; } button.danger:hover { background:#8c1d18; }
button.secondary { background:transparent; color:var(--fg); border:1px solid var(--line); } button.secondary:hover { background:var(--line); }
form.inline { display:inline; margin:0; } .linklike { background:none; color:var(--fg); padding:0; }
fieldset { border:1px solid var(--line); border-radius:6px; margin:1rem 0; } legend { padding:0 .4rem; font-weight:700; }
.error { color:var(--err); } .notice { color:var(--ok); }
.site-footer { text-align:center; color:var(--muted); padding:2rem 1rem; }
table.data { width:100%; border-collapse:collapse; margin:1rem 0; }
table.data th, table.data td { text-align:left; padding:.4rem .5rem; border-bottom:1px solid var(--line); vertical-align:top; font-size:.9rem; }
.inline-form { display:inline; }
input[type=checkbox], input[type=radio] { display:inline-block; width:auto; margin:0 .5rem 0 0; vertical-align:middle; }
textarea { display:block; width:100%; padding:.5rem; margin-top:.25rem; font:inherit; color:var(--fg); background:var(--bg); border:1px solid var(--line); border-radius:6px; }

.card-fields-wrap { margin-top: 1rem; }
.card-field-group { margin-bottom: .75rem; }
.card-field-group label { font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.card-field-host { min-height: 44px; background: var(--bg); border: 1px solid var(--line); border-radius: 6px; }
.card-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
#card-pay-btn:disabled { opacity: .5; cursor: not-allowed; }

.vehicle-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:1rem; margin:1rem 0; }
.vehicle-card, .photo-card { border:1px solid var(--line); border-radius:8px; padding:.75rem; background:var(--bg); }
.vehicle-card h3, .vehicle-card .card-title { margin:.25rem 0; font-size:1.17rem; }
.thumb { display:block; width:100%; max-width:240px; aspect-ratio:4/3; object-fit:cover; border-radius:6px; background:var(--line); }
.photo-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:.75rem; margin:1rem 0; }
.badge { display:inline-block; padding:.05rem .5rem; margin-left:.25rem; font-size:.75rem; border-radius:999px; background:var(--line); color:var(--fg); }

/* event gallery */
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.88);display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:50}
.lightbox[hidden]{display:none}
.lightbox img{max-width:92vw;max-height:80vh}
.lightbox button{position:absolute;background:none;border:0;color:#fff;font-size:2.4rem;cursor:pointer;padding:.5rem 1rem}
.lightbox .lb-close{top:.5rem;right:.5rem}.lightbox .lb-prev{left:.5rem;top:45%}.lightbox .lb-next{right:.5rem;top:45%}
.lightbox .lb-cap{color:#fff;margin:.75rem 1rem 0;text-align:center}
.gallery-grid figure{margin:0}

/* public site */
.site-header { background:var(--bar); color:#f3efe2; border-bottom:3px solid var(--khaki); }
.site-header .brand { color:#f3efe2; display:flex; align-items:center; gap:.6rem; } .brand-logo { border-radius:4px; }
.site-header nav a { color:#f3efe2; } .site-header nav a.active { color:var(--khaki); }
.nav-toggle { display:none; background:transparent; border:1px solid var(--khaki); color:#f3efe2; }
.account-bar { background:var(--card); border-bottom:1px solid var(--line); padding:.35rem 1rem; font-size:.9rem; } .account-bar nav { gap:.9rem; }
.hero { background:linear-gradient(rgba(16,30,18,.55), rgba(16,30,18,.6)), var(--hero, #2f5d3a) center/cover; color:#fff; text-align:center; padding:5rem 1rem; }
.hero h1 { font-size:clamp(2.4rem,7vw,4rem); margin:.2rem 0; font-weight:700; letter-spacing:-.02em; } .hero p { max-width:40rem; margin:.5rem auto 1.25rem; font-size:1.1rem; }
.btn { display:inline-block; padding:.7rem 1.4rem; border-radius:999px; letter-spacing:.01em; background:var(--accent); color:var(--accent-fg); text-decoration:none; font-weight:600; }
.btn.light { background:#f3efe2; color:#22402a; }
.section { max-width:900px; margin:0 auto; padding:1.5rem 1rem; } .section h2 { border-bottom:2px solid var(--khaki); padding-bottom:.25rem; }
.two-col { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:1.25rem; }
.strip { display:grid; grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:.5rem; } .strip img { width:100%; aspect-ratio:1; object-fit:cover; border-radius:6px; }
.prose p { margin:.75rem 0; } .event-date { font-weight:700; color:var(--accent); }
.sponsor-strip { display:flex; flex-wrap:wrap; gap:1.25rem; align-items:center; justify-content:center; margin-bottom:1rem; } .sponsor-strip img { max-height:48px; width:auto; }
.site-footer a { color:var(--accent); }
a { color:var(--accent); }
@media (max-width: 1000px) {
  .site-header.js-nav { align-items:flex-start; } .site-header.js-nav .nav-toggle { display:block; }
  .site-header.js-nav nav { display:none; width:100%; flex-direction:column; align-items:flex-start; gap:.5rem; }
  .site-header.js-nav.open nav { display:flex; }
}

/* hero lettering: a black outline keeps the white text readable over any photo */
.hero h1, .hero .hero-sub { -webkit-text-stroke:2px #000; paint-order:stroke fill; text-shadow:0 2px 6px rgba(0,0,0,.55); }
.hero .hero-sub { font-family:'Outfit','Inter',system-ui,sans-serif; font-size:clamp(.9rem,2.2vw,1.1rem); font-weight:600; letter-spacing:.08em; text-transform:uppercase; margin:.1rem auto .9rem; -webkit-text-stroke-width:1.5px; }
.hero .btn { text-transform:uppercase; letter-spacing:.06em; font-weight:700; }

.check { display:flex; gap:.5rem; align-items:flex-start; font-weight:600; }
[hidden] { display:none !important; }

/* account bar dropdowns (native <details>) */
.account-bar nav { align-items:center; }
.menu { position:relative; }
.menu > summary { cursor:pointer; list-style:none; padding:.25rem .65rem; border-radius:6px; font-weight:600; user-select:none; }
.menu > summary::-webkit-details-marker { display:none; }
.menu > summary::after { content:' \25BE'; font-size:.8em; }
.menu > summary:hover, .menu[open] > summary { background:var(--line); }
.menu > summary.active { color:var(--accent); }
.menu-panel { position:absolute; z-index:40; top:calc(100% + 4px); left:0; min-width:230px; display:flex; flex-direction:column; background:var(--card); border:1px solid var(--line); border-radius:10px; box-shadow:0 8px 24px rgba(0,0,0,.18); padding:.35rem; }
.menu-panel a { padding:.4rem .65rem; border-radius:6px; text-decoration:none; color:var(--fg); }
.menu-panel a:hover { background:var(--line); } .menu-panel a.active { color:var(--accent); font-weight:600; }
.menu-head { font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); padding:.55rem .65rem .15rem; }
.menu-head:first-child { padding-top:.2rem; }
.account-bar .me { margin-left:auto; } .account-bar .me .menu-panel { left:auto; right:0; }
@media (max-width: 800px) {
  .account-bar nav { flex-wrap:wrap; } .menu-panel { position:static; box-shadow:none; margin-top:.25rem; } .account-bar .me { margin-left:0; } .account-bar .me .menu-panel { right:auto; }
}

.card .btn { margin:.15rem .25rem .15rem 0; }
.photo-grid figure{margin:0}
.photo-grid figcaption{font-size:.85rem;margin-top:.25rem;overflow-wrap:anywhere}
.garage-owner h2{margin-top:2rem}

.account-tabs { display:flex; flex-wrap:wrap; gap:.25rem .5rem; margin:0 0 1rem; padding:0 0 .6rem; border-bottom:1px solid var(--line); }
.account-tabs a { padding:.55rem .85rem; border-radius:8px; text-decoration:none; color:var(--fg); font-weight:500; }
.account-tabs a:hover { background:var(--line); } .account-tabs a[aria-current=page] { background:var(--accent); color:var(--accent-fg); font-weight:600; }
.welcome { margin:0 0 1rem; padding:.75rem 1rem; background:var(--card); border:1px solid var(--line); border-radius:8px; }
.req { color:var(--err); font-weight:700; } .next-step { margin-top:.75rem; }

.save-bar { position:sticky; bottom:0; display:flex; align-items:center; gap:1rem; margin:1rem -1rem -1rem; padding:.75rem 1rem; background:var(--card); border-top:1px solid var(--line); border-radius:0 0 8px 8px; }
.save-state { color:var(--muted); font-size:.9rem; }
details.advanced { margin:1rem 0 .25rem; padding:.25rem .75rem; border:1px dashed var(--line); border-radius:8px; } details.advanced > summary { cursor:pointer; font-weight:600; padding:.4rem 0; }

.table-scroll { position:relative; overflow-x:auto; -webkit-overflow-scrolling:touch; margin:1rem 0; max-width:100%; } .table-scroll > table.data { margin:0; }
details.past-tlca > summary { cursor:pointer; font-weight:600; padding:.5rem 0; }
@media (max-width: 640px) {
  table.stack, table.stack tbody, table.stack tr, table.stack td { display:block; width:100%; }
  table.stack thead { position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden; }
  table.stack tr { margin:.75rem 0; padding:.75rem; border:1px solid var(--line); border-radius:8px; background:var(--card); }
  table.stack td { border:0; padding:.35rem 0; }
  table.stack td[data-label]::before { content:attr(data-label); display:block; font-size:.75rem; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); }
  table.stack td input, table.stack td select { width:100%; margin:.25rem 0; }
}

.cards.dashboard .card h2 { font-size:1rem; margin:0 0 .25rem; } .card.attention { border-left:5px solid var(--accent); }

.page-head { display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; } .page-head h1 { margin-block:.5rem; } .page-head .btn { white-space:nowrap; }
.filter-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:0 1rem; } .filter-checks { display:flex; flex-wrap:wrap; gap:0 1.5rem; }
.badge.tone-ok { background:rgba(46,125,50,.16); color:var(--ok); } .badge.tone-bad { background:rgba(179,38,30,.14); color:var(--err); }
.badge.tone-warn { background:rgba(200,140,0,.2); color:#6f4800; } .badge.tone-muted { background:var(--line); color:var(--fg); }
@media (prefers-color-scheme: dark) { .badge.tone-warn { color:#f0c060; } }

details.new-form { margin:1rem 0; } details.new-form > summary { display:inline-block; cursor:pointer; list-style:none; } details.new-form > summary::-webkit-details-marker { display:none; }
details.new-form[open] > summary { margin-bottom:.75rem; }

details.tlca-card > summary { cursor:pointer; padding:.25rem 0; }

.attention-note { margin:1rem 0; padding:.6rem 1rem; border:1px solid #d9b45a; border-left-width:5px; border-radius:8px; background:rgba(200,140,0,.12); } .attention-note ul { margin:.35rem 0 0; padding-left:1.2rem; }

/* quick polish: skip link, tap targets, footer */
.skip-link { position:absolute; left:-9999px; top:0; z-index:100; padding:.6rem 1rem; background:var(--accent); color:var(--accent-fg); border-radius:0 0 8px 0; font-weight:600; text-decoration:none; } .skip-link:focus { left:0; }
main:focus { outline:none; }
.account-bar a, .account-bar summary, .account-bar button.linklike { display:inline-flex; align-items:center; min-height:40px; padding:0 .25rem; }
.account-bar .menu-panel a { min-height:44px; }
.site-footer .footer-links { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:0 1.25rem; margin:0; }
.site-footer .footer-links a { display:inline-flex; align-items:center; min-height:44px; white-space:nowrap; }
@media (max-width: 1000px) { .site-header.js-nav nav a { display:flex; align-items:center; min-height:44px; } .nav-toggle { min-height:44px; } }

.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

.account-form { max-width:640px; }
details.more-details { margin:.75rem 0; } details.more-details > summary { cursor:pointer; font-weight:600; padding:.4rem 0; }

/* public pages polish */
.join-strip { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:.75rem 1.5rem; margin:2rem auto 0; padding:1.25rem 1rem; background:var(--card); border-top:1px solid var(--line); border-bottom:1px solid var(--line); text-align:center; }
.join-strip .btn { white-space:nowrap; }
nav a.nav-login { padding:.25rem .9rem; border:1px solid var(--khaki); border-radius:999px; }
.gallery-grid { grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); } .gallery-grid figure { margin:0; }
@media (max-width: 640px) { .gallery-grid { grid-template-columns:repeat(2,1fr); gap:.6rem; } }

a.btn-link { display:inline-block; padding:.55rem 1.1rem; font:inherit; font-weight:600; color:var(--accent-fg); background:var(--accent); border:1px solid transparent; border-radius:8px; text-decoration:none; cursor:pointer; }
a.btn-link:hover { filter:brightness(.92); }

/* phone tap targets: title links in cards and lists, a full-width Apply button */
@media (max-width: 640px) {
  main h2 > a, main h3 > a { display:inline-flex; align-items:center; min-height:44px; }
  form.join-form button[type=submit] { width:100%; min-height:44px; }
}

/* admin sidebar: open beside the page on a desktop, a slide-over panel on a phone (assets/admin-side.js) */
.admin-shell { display:flex; align-items:flex-start; }
.admin-shell > main { flex:1 1 0; min-width:0; max-width:1100px; margin:0 auto; }
.admin-side { flex:0 0 240px; width:240px; box-sizing:border-box; position:sticky; top:0; max-height:100vh; overflow-y:auto; padding:.75rem .6rem; background:var(--card); border-right:1px solid var(--line); }
.admin-side a { display:flex; align-items:center; justify-content:space-between; gap:.5rem; min-height:40px; padding:0 .65rem; border-radius:6px; text-decoration:none; color:var(--fg); }
.admin-side a:hover { background:var(--line); } .admin-side a.active { background:var(--accent); color:var(--accent-fg); font-weight:600; }
.admin-side .menu-head { display:block; }
.count { min-width:1.4rem; padding:0 .4rem; border-radius:999px; background:var(--khaki); color:#1f2a1f; font-size:.75rem; font-weight:700; line-height:1.4rem; text-align:center; }
.side-backdrop { display:none; }
.account-bar .side-toggle { cursor:pointer; font:inherit; font-weight:600; }
@media (min-width: 1001px) {
  .admin-shell.js-side .admin-side { transition:margin-left .2s ease, visibility 0s; }
  .admin-shell.js-side:not(.side-open) .admin-side { margin-left:-240px; visibility:hidden; transition:margin-left .2s ease, visibility 0s linear .2s; }
}
@media (max-width: 1000px) {
  .admin-shell:not(.js-side) { display:block; } .admin-shell:not(.js-side) .admin-side { position:static; width:auto; max-height:none; border-right:0; border-bottom:1px solid var(--line); }
  .admin-shell.js-side .admin-side { position:fixed; top:0; bottom:0; left:0; width:min(300px,85vw); max-height:none; z-index:45; transform:translateX(-100%); visibility:hidden; transition:transform .2s ease, visibility 0s linear .2s; box-shadow:0 0 24px rgba(0,0,0,.3); }
  .admin-shell.js-side.side-open .admin-side { transform:none; visibility:visible; transition:transform .2s ease, visibility 0s; }
  .admin-shell.js-side.side-open .side-backdrop { display:block; position:fixed; inset:0; z-index:44; background:rgba(0,0,0,.45); }
  .admin-side a { min-height:44px; }
}
@media (prefers-reduced-motion: reduce) { .admin-side { transition:none !important; } }
.audit-detail { overflow-wrap:anywhere; max-width:34rem; font-size:.9rem; }