/* Lakewood Hunting — Cloudflare rebuild design overrides.
   Owner directions (Nov 14, 2026):
   1. Camo is the ENTIRE background: the greenish woodland camo is the
      ground of every page, edge to edge. Content keeps sitting on its
      solid cards / panels / reading surfaces, which stay untouched.
   2. The camo pattern itself has NO straight lines anywhere: fully
      organic curved woodland blobs, seamless tiling (pattern generated
      by tools/gen_camo.py — curves-only paths, wrap-stamped; verified
      over large multi-tile renders).
   The same pattern replaces the band treatment so bands and ground
   agree.

   Owner fixes (Nov 14, late — from his phone screenshot):
   3. "The camo isn't coming through enough, a lot more green than
      anything": the pattern's tones were raised (see gen_camo.py) AND
      the camo is now painted on the app root itself — before, the app
      root's flat --bg covered the html pattern, so the ground read as
      flat green and camo only whispered inside the wordmark pill.
   4. "Lines are everywhere": the header's 2px accent rule is gone,
      the header wears the camo with no bottom border, and the divider
      line drawn across the footer camo is removed. Bands sit on the
      same camo ground with no borders, so no straight band edges or
      column seams cross the pattern.
   5. Text that sits directly on the camo ground (section headings,
      ledes, hints, kickers, labels, plain paragraphs/lists outside
      any solid card/panel) is set in light ground tones so it stays
      crisp on the pattern in BOTH colour schemes; text inside solid
      surfaces keeps the app's own colours.

   Owner direction (Nov 15, 2026, later): "apex real tree camo" —
   the ground is now a REALISTIC PHOTOGRAPHIC woodland texture
   (/camo-photo.jpg, built by tools/make_camo_photo.py from original
   generated artwork: oak leaves, pine needles, bark and moss on a
   dark forest floor — in the Realtree APX style class, not copied
   from any proprietary pattern). Graded to the same deep band the
   owner accepted for the vector pass (mean luminance ~43, matte,
   nothing bright), seamless by border-blend construction, crisp
   photographic detail — NO blur. The vector camo-bg.svg is retired
   as the ground (the file stays for the band artwork history). */

/* --- the camo ground --- */
html {
  background-color: #152116;
  background-image: url("/camo-photo.jpg");
  background-repeat: repeat;
  background-size: 800px 800px;
}
body,
.hatch-space-root[data-hatch-space-root] {
  background: transparent !important;
}
[data-generated-space-root] .min-h-screen {
  background-color: #152116 !important;
  background-image: url("/camo-photo.jpg") !important;
  background-repeat: repeat !important;
  background-size: 800px 800px !important;
}

/* --- bands wear the same pattern at the same scale --- */
.camo-band,
.wm-band,
.wm-band-inline {
  background-image: url("/camo-photo.jpg") !important;
  background-size: 800px 800px;
}

/* --- header: camo, borderless (the 2px rule under the search is gone) --- */
[data-generated-space-root] header {
  background-color: #152116 !important;
  background-image: url("/camo-photo.jpg") !important;
  background-repeat: repeat !important;
  background-size: 800px 800px !important;
  border-bottom: none !important;
  box-shadow: none !important;
}
[data-generated-space-root] header small {
  color: #c3d0be !important;
}
[data-generated-space-root] header nav button {
  color: #edf2e4 !important;
}

/* --- no divider line drawn across the footer camo --- */
[data-generated-space-root] footer p[style*="border-top"] {
  border-top: none !important;
}

/* --- ground text: light tones for anything that sits on the camo
       itself (i.e. NOT inside a solid card / panel / band / control).
       :not() chains use complex selectors (Selectors 4) so text inside
       solid surfaces is never touched. --- */
[data-generated-space-root] :is(h2, h3):not(.panel :is(h2, h3)):not(.card :is(h2, h3)):not(.faq-item :is(h2, h3)):not(.tblwrap :is(h2, h3)):not(.check-item :is(h2, h3)):not(.success-box :is(h2, h3)):not(.note-box :is(h2, h3)):not(.scanbox :is(h2, h3)):not(.camo-band :is(h2, h3)):not(header :is(h2, h3)):not(footer :is(h2, h3)) {
  color: #edf2e4 !important;
}
[data-generated-space-root] p:not(.panel p):not(.card p):not(.faq-item p):not(.tblwrap p):not(.check-item p):not(.success-box p):not(.note-box p):not(.scanbox p):not(.camo-band p):not(header p):not(footer p) {
  color: #dde7d2 !important;
}
[data-generated-space-root] li:not(.panel li):not(.card li):not(.faq-item li):not(.tblwrap li):not(.check-item li):not(.success-box li):not(.note-box li):not(.scanbox li):not(.camo-band li):not(header li):not(footer li) {
  color: #dde7d2 !important;
}
[data-generated-space-root] .lede:not(.panel .lede):not(.card .lede):not(.faq-item .lede):not(.tblwrap .lede):not(.check-item .lede):not(.success-box .lede):not(.note-box .lede):not(.scanbox .lede):not(.camo-band .lede):not(header .lede):not(footer .lede) {
  color: #ccd9c1 !important;
}
[data-generated-space-root] .hint:not(.panel .hint):not(.card .hint):not(.faq-item .hint):not(.tblwrap .hint):not(.check-item .hint):not(.success-box .hint):not(.note-box .hint):not(.scanbox .hint):not(.camo-band .hint):not(header .hint):not(footer .hint) {
  color: #b7c7ab !important;
}
[data-generated-space-root] .kicker:not(.panel .kicker):not(.card .kicker):not(.faq-item .kicker):not(.tblwrap .kicker):not(.check-item .kicker):not(.success-box .kicker):not(.note-box .kicker):not(.scanbox .kicker):not(.camo-band .kicker):not(header .kicker):not(footer .kicker),
[data-generated-space-root] .steplabel:not(.panel .steplabel):not(.card .steplabel):not(.faq-item .steplabel):not(.tblwrap .steplabel):not(.check-item .steplabel):not(.success-box .steplabel):not(.note-box .steplabel):not(.scanbox .steplabel):not(.camo-band .steplabel):not(header .steplabel):not(footer .steplabel) {
  color: #f0b35e !important;
}
[data-generated-space-root] .field-label:not(.panel .field-label):not(.card .field-label) {
  color: #e6eedd !important;
}
[data-generated-space-root] .linkbtn:not(.panel .linkbtn):not(.card .linkbtn):not(.camo-band .linkbtn) {
  color: #a9cc8e !important;
}

/* --- patriotic layer (owner, Nov 15, 2026): patriotism on this page
       is the camo US flag itself (the club's own E1 artwork, given
       real presence in the hero), the "American Owned · Florida, USA"
       treatment, and the footer honour band naming the four branches
       in type (no seals). NO red/white/blue graphic devices — the
       owner rejected a tricolour stripe the same night ("no red white
       and blue doesn't sense"); the flag's own camo tones carry it. --- */
.hero-flag svg {
  width: 64px !important;
  height: 34px !important;
}

/* --- wind compass (owner, Nov 15, 2026): a small live instrument up
       top beside the wordmark, the way the Zulu pill sits on the
       Aviation site. Brass ring, the club's photographic camo on the
       face, cardinal letters, and a gold arrow on the bearing the
       Sarasota wind is coming FROM — spelled out under the dial
       ("FROM NW" / "8 MPH", plus a gold STALE line when the cached
       reading is old) so it can't be misread. Data is the same
       Open-Meteo feed Field Tools uses (getFieldConditions, Sarasota).
       Tapping the dial offers the phone's own compass
       (DeviceOrientation, permission asked in the tap); denied or
       unavailable simply leaves the wind reading in place. --- */
.wind-compass {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  flex: 0 0 auto;
  font-family: inherit;
  color: #edf2e4;
}
.wind-compass-dial {
  width: 40px;
  height: 40px;
  display: block;
}
.wind-compass-cap {
  display: block;
  text-align: center;
  font-size: 0.52rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  line-height: 1.3;
  text-transform: uppercase;
  color: #edf2e4;
  white-space: nowrap;
}
.wind-compass-cap > span {
  display: block;
}
.wind-compass-cap .wc-stale {
  color: #f0b35e;
  font-size: 0.46rem;
}
@media (min-width: 1024px) {
  .wind-compass-dial {
    width: 46px;
    height: 46px;
  }
}
@media (max-width: 1023.5px) {
  /* Phones: row 1 (wordmark + Join) is already a perfect fit and
     stays untouched — the compass docks at the left of the nav row,
     under the wordmark, dial beside its reading; the nav keeps the
     rest of the row and scrolls as it already did. */
  .wind-compass {
    order: 3;
    flex-direction: row;
    gap: 6px;
    margin-right: 2px;
  }
  .wind-compass-cap {
    text-align: left;
  }
  [data-generated-space-root] header nav {
    width: auto;
    flex: 1 1 0%;
    min-width: 0;
  }
}