/* GENERATED by the design-system pass (12 Sep 2026) — re-cuts every rounded
   element on the search, add-a-lake and rate pages as a chamfer whose
   outline follows the cut. Fill/outline colours are lifted from each page's
   own rules; hover states map to --kc-bg/--kc-line. Do not hand-edit the
   generated blocks; regenerate. Loaded after the page's inline <style>. */

/* ═══ paddlingout/search.html ═══ */








body .btn-gps { position: relative; isolation: isolate; border-color: transparent !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; clip-path: var(--clip-md); --kc-clip: var(--clip-md); --kc-line: var(--line); --kc-bg: var(--surface); }
body .btn-gps::before, body .btn-gps::after { content: ''; position: absolute; z-index: -1; clip-path: var(--kc-clip); pointer-events: none; transition: background 0.18s ease; }
body .btn-gps::before { inset: 0; background: var(--kc-line); }
body .btn-gps::after  { inset: 1px; background: var(--kc-bg); -webkit-backdrop-filter: var(--kc-blur, none); backdrop-filter: var(--kc-blur, none); }
body .btn-gps:hover { background: transparent !important; border-color: transparent !important; --kc-bg: var(--surface-2); --kc-line: var(--gold); }

body .covered-card { position: relative; isolation: isolate; border-color: transparent !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; clip-path: var(--clip-md); --kc-clip: var(--clip-md); --kc-line: rgba(181,147,90,0.34); --kc-bg: linear-gradient(135deg, rgba(181,147,90,0.12), rgba(181,147,90,0.03)); }
body .covered-card::before, body .covered-card::after { content: ''; position: absolute; z-index: -1; clip-path: var(--kc-clip); pointer-events: none; transition: background 0.18s ease; }
body .covered-card::before { inset: 0; background: var(--kc-line); }
body .covered-card::after  { inset: 1px; background: var(--kc-bg); -webkit-backdrop-filter: var(--kc-blur, none); backdrop-filter: var(--kc-blur, none); }
body .covered-card:hover { background: transparent !important; border-color: transparent !important; --kc-line: #b5935a; }
body .covered-card:focus-visible { background: transparent !important; border-color: transparent !important; --kc-line: #b5935a; }


body .water-card { position: relative; isolation: isolate; border-color: transparent !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; clip-path: var(--clip-md); --kc-clip: var(--clip-md); --kc-line: rgba(181,147,90,0.16); --kc-bg: linear-gradient(135deg, rgba(13,12,10,0.9), rgba(16,17,13,0.9)); }
body .water-card::before, body .water-card::after { content: ''; position: absolute; z-index: -1; clip-path: var(--kc-clip); pointer-events: none; transition: background 0.18s ease; }
body .water-card::before { inset: 0; background: var(--kc-line); }
body .water-card::after  { inset: 1px; background: var(--kc-bg); -webkit-backdrop-filter: var(--kc-blur, none); backdrop-filter: var(--kc-blur, none); }
body .water-card:hover { background: transparent !important; border-color: transparent !important; --kc-bg: linear-gradient(135deg, rgba(181,147,90,0.06), rgba(181,147,90,0.03)); --kc-line: var(--gold); }

body .tour-go { position: relative; isolation: isolate; border-color: transparent !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; clip-path: var(--clip-md); --kc-clip: var(--clip-md); --kc-line: transparent; --kc-bg: linear-gradient(135deg, var(--gold-bright), var(--gold)); color: var(--gold-ink); }
body .tour-go::before, body .tour-go::after { content: ''; position: absolute; z-index: -1; clip-path: var(--kc-clip); pointer-events: none; transition: background 0.18s ease; }
body .tour-go::before { inset: 0; background: var(--kc-line); }
body .tour-go::after  { inset: 1px; background: var(--kc-bg); -webkit-backdrop-filter: var(--kc-blur, none); backdrop-filter: var(--kc-blur, none); }
body .tour-go:hover { background: transparent !important; border-color: transparent !important; --kc-bg: linear-gradient(135deg, #e6cd8e, var(--gold)); }

body .tour-box { position: relative; isolation: isolate; border-color: transparent !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; clip-path: var(--clip-lg); --kc-clip: var(--clip-lg); --kc-line: rgba(217,189,123,0.34); --kc-bg: linear-gradient(150deg,#0d0c0a,#111); }
body .tour-box::before, body .tour-box::after { content: ''; position: absolute; z-index: -1; clip-path: var(--kc-clip); pointer-events: none; transition: background 0.18s ease; }
body .tour-box::before { inset: 0; background: var(--kc-line); }
body .tour-box::after  { inset: 1px; background: var(--kc-bg); -webkit-backdrop-filter: var(--kc-blur, none); backdrop-filter: var(--kc-blur, none); }

body .search-map { border-radius: 0 !important; clip-path: var(--clip-lg); }
body .skel { border-radius: 0 !important; clip-path: var(--clip-sm); }

/* ═══ paddlingout/submitentry.html ═══ */


body .loc-lock { position: relative; isolation: isolate; border-color: transparent !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; clip-path: var(--clip-sm); --kc-clip: var(--clip-sm); --kc-line: rgba(143,188,106,0.32); --kc-bg: rgba(49,109,67,0.12); }
body .loc-lock::before, body .loc-lock::after { content: ''; position: absolute; z-index: -1; clip-path: var(--kc-clip); pointer-events: none; transition: background 0.18s ease; }
body .loc-lock::before { inset: 0; background: var(--kc-line); }
body .loc-lock::after  { inset: 1px; background: var(--kc-bg); -webkit-backdrop-filter: var(--kc-blur, none); backdrop-filter: var(--kc-blur, none); }



body .mini-btn { position: relative; isolation: isolate; border-color: transparent !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; clip-path: var(--clip-md); --kc-clip: var(--clip-md); --kc-line: var(--line); --kc-bg: var(--surface); }
body .mini-btn::before, body .mini-btn::after { content: ''; position: absolute; z-index: -1; clip-path: var(--kc-clip); pointer-events: none; transition: background 0.18s ease; }
body .mini-btn::before { inset: 0; background: var(--kc-line); }
body .mini-btn::after  { inset: 1px; background: var(--kc-bg); -webkit-backdrop-filter: var(--kc-blur, none); backdrop-filter: var(--kc-blur, none); }
body .mini-btn:hover { background: transparent !important; border-color: transparent !important; --kc-bg: var(--surface-2); --kc-line: var(--gold); }

body .ghost-btn { position: relative; isolation: isolate; border-color: transparent !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; clip-path: var(--clip-md); --kc-clip: var(--clip-md); --kc-line: var(--line); --kc-bg: var(--surface); }
body .ghost-btn::before, body .ghost-btn::after { content: ''; position: absolute; z-index: -1; clip-path: var(--kc-clip); pointer-events: none; transition: background 0.18s ease; }
body .ghost-btn::before { inset: 0; background: var(--kc-line); }
body .ghost-btn::after  { inset: 1px; background: var(--kc-bg); -webkit-backdrop-filter: var(--kc-blur, none); backdrop-filter: var(--kc-blur, none); }
body .ghost-btn:hover { background: transparent !important; border-color: transparent !important; --kc-bg: var(--surface-2); --kc-line: var(--gold); }

body .submit-btn { position: relative; isolation: isolate; border-color: transparent !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; clip-path: var(--clip-md); --kc-clip: var(--clip-md); --kc-line: transparent; --kc-bg: linear-gradient(135deg, var(--gold-bright), var(--gold)); color: var(--gold-ink); }
body .submit-btn::before, body .submit-btn::after { content: ''; position: absolute; z-index: -1; clip-path: var(--kc-clip); pointer-events: none; transition: background 0.18s ease; }
body .submit-btn::before { inset: 0; background: var(--kc-line); }
body .submit-btn::after  { inset: 1px; background: var(--kc-bg); -webkit-backdrop-filter: var(--kc-blur, none); backdrop-filter: var(--kc-blur, none); }
body .submit-btn:hover { background: transparent !important; border-color: transparent !important; --kc-bg: linear-gradient(135deg, #e6cd8e, var(--gold)); }
body .submit-btn.is-incomplete { background: transparent !important; border-color: transparent !important; --kc-bg: rgba(181,147,90,0.14); --kc-line: rgba(181,147,90,0.34); }

body .success-panel { position: relative; isolation: isolate; border-color: transparent !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; clip-path: var(--clip-md); --kc-clip: var(--clip-md); --kc-line: rgba(143,188,106,0.32); --kc-bg: rgba(49,109,67,0.12); }
body .success-panel::before, body .success-panel::after { content: ''; position: absolute; z-index: -1; clip-path: var(--kc-clip); pointer-events: none; transition: background 0.18s ease; }
body .success-panel::before { inset: 0; background: var(--kc-line); }
body .success-panel::after  { inset: 1px; background: var(--kc-bg); -webkit-backdrop-filter: var(--kc-blur, none); backdrop-filter: var(--kc-blur, none); }

body .image-drop { isolation: isolate; border-color: transparent !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; clip-path: var(--clip-md); --kc-clip: var(--clip-md); --kc-line: rgba(181,147,90,0.38); --kc-bg: rgba(181,147,90,0.06); }
body .image-drop::before, body .image-drop::after { content: ''; position: absolute; z-index: -1; clip-path: var(--kc-clip); pointer-events: none; transition: background 0.18s ease; }
body .image-drop::before { inset: 0; background: var(--kc-line); }
body .image-drop::after  { inset: 1px; background: var(--kc-bg); -webkit-backdrop-filter: var(--kc-blur, none); backdrop-filter: var(--kc-blur, none); }
body .image-drop:hover { background: transparent !important; border-color: transparent !important; --kc-bg: rgba(181,147,90,0.11); --kc-line: var(--gold); }
body .image-drop.dragging { background: transparent !important; border-color: transparent !important; --kc-bg: rgba(181,147,90,0.11); --kc-line: var(--gold); }

body .submit-card { position: relative; isolation: isolate; border-color: transparent !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; clip-path: var(--clip-lg); --kc-clip: var(--clip-lg); --kc-line: var(--line); --kc-bg: linear-gradient(135deg, var(--panel), var(--panel-soft)); }
body .submit-card::before, body .submit-card::after { content: ''; position: absolute; z-index: -1; clip-path: var(--kc-clip); pointer-events: none; transition: background 0.18s ease; }
body .submit-card::before { inset: 0; background: var(--kc-line); }
body .submit-card::after  { inset: 1px; background: var(--kc-bg); -webkit-backdrop-filter: var(--kc-blur, none); backdrop-filter: var(--kc-blur, none); }

body .pin-map { border-radius: 0 !important; clip-path: var(--clip-md); }
body .image-preview { border-radius: 0 !important; clip-path: var(--clip-sm); }

/* ═══ paddlingout/rate.html ═══ */



body .wx-cell { position: relative; isolation: isolate; border-color: transparent !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; clip-path: var(--clip-sm); --kc-clip: var(--clip-sm); --kc-line: transparent; --kc-bg: var(--surface); }
body .wx-cell::before, body .wx-cell::after { content: ''; position: absolute; z-index: -1; clip-path: var(--kc-clip); pointer-events: none; transition: background 0.18s ease; }
body .wx-cell::before { inset: 0; background: var(--kc-line); }
body .wx-cell::after  { inset: 1px; background: var(--kc-bg); -webkit-backdrop-filter: var(--kc-blur, none); backdrop-filter: var(--kc-blur, none); }


body .submit-error { position: relative; isolation: isolate; border-color: transparent !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; clip-path: var(--clip-md); --kc-clip: var(--clip-md); --kc-line: rgba(189,59,43,0.5); --kc-bg: rgba(189,59,43,0.12); }
body .submit-error::before, body .submit-error::after { content: ''; position: absolute; z-index: -1; clip-path: var(--kc-clip); pointer-events: none; transition: background 0.18s ease; }
body .submit-error::before { inset: 0; background: var(--kc-line); }
body .submit-error::after  { inset: 1px; background: var(--kc-bg); -webkit-backdrop-filter: var(--kc-blur, none); backdrop-filter: var(--kc-blur, none); }

body .rate-btn { position: relative; isolation: isolate; border-color: transparent !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; clip-path: var(--clip-md); --kc-clip: var(--clip-md); --kc-line: var(--line-gold); --kc-bg: linear-gradient(135deg, #0d0c0a, #10110d); }
body .rate-btn::before, body .rate-btn::after { content: ''; position: absolute; z-index: -1; clip-path: var(--kc-clip); pointer-events: none; transition: background 0.18s ease; }
body .rate-btn::before { inset: 0; background: var(--kc-line); }
body .rate-btn::after  { inset: 1px; background: var(--kc-bg); -webkit-backdrop-filter: var(--kc-blur, none); backdrop-filter: var(--kc-blur, none); }
body .rate-btn:hover { background: transparent !important; border-color: transparent !important; --kc-line: var(--gold); }
body .rate-btn.selected { background: transparent !important; border-color: transparent !important; --kc-bg: rgba(181,147,90,0.12); --kc-line: var(--gold-bright); }

body .submit-btn { position: relative; isolation: isolate; border-color: transparent !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; clip-path: var(--clip-md); --kc-clip: var(--clip-md); --kc-line: transparent; --kc-bg: linear-gradient(135deg, var(--gold-bright), var(--gold)); color: var(--gold-ink); }
body .submit-btn::before, body .submit-btn::after { content: ''; position: absolute; z-index: -1; clip-path: var(--kc-clip); pointer-events: none; transition: background 0.18s ease; }
body .submit-btn::before { inset: 0; background: var(--kc-line); }
body .submit-btn::after  { inset: 1px; background: var(--kc-bg); -webkit-backdrop-filter: var(--kc-blur, none); backdrop-filter: var(--kc-blur, none); }


body .thank-prediction { position: relative; isolation: isolate; border-color: transparent !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; clip-path: var(--clip-md); --kc-clip: var(--clip-md); --kc-line: var(--line); --kc-bg: var(--surface); }
body .thank-prediction::before, body .thank-prediction::after { content: ''; position: absolute; z-index: -1; clip-path: var(--kc-clip); pointer-events: none; transition: background 0.18s ease; }
body .thank-prediction::before { inset: 0; background: var(--kc-line); }
body .thank-prediction::after  { inset: 1px; background: var(--kc-bg); -webkit-backdrop-filter: var(--kc-blur, none); backdrop-filter: var(--kc-blur, none); }


body .onboard-step { position: relative; isolation: isolate; border-color: transparent !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; clip-path: var(--clip-md); --kc-clip: var(--clip-md); --kc-line: var(--line); --kc-bg: var(--surface); }
body .onboard-step::before, body .onboard-step::after { content: ''; position: absolute; z-index: -1; clip-path: var(--kc-clip); pointer-events: none; transition: background 0.18s ease; }
body .onboard-step::before { inset: 0; background: var(--kc-line); }
body .onboard-step::after  { inset: 1px; background: var(--kc-bg); -webkit-backdrop-filter: var(--kc-blur, none); backdrop-filter: var(--kc-blur, none); }

body .onboard-go { position: relative; isolation: isolate; border-color: transparent !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; clip-path: var(--clip-md); --kc-clip: var(--clip-md); --kc-line: transparent; --kc-bg: linear-gradient(135deg, var(--gold-bright), var(--gold)); color: var(--gold-ink); }
body .onboard-go::before, body .onboard-go::after { content: ''; position: absolute; z-index: -1; clip-path: var(--kc-clip); pointer-events: none; transition: background 0.18s ease; }
body .onboard-go::before { inset: 0; background: var(--kc-line); }
body .onboard-go::after  { inset: 1px; background: var(--kc-bg); -webkit-backdrop-filter: var(--kc-blur, none); backdrop-filter: var(--kc-blur, none); }
body .onboard-go:hover { background: transparent !important; border-color: transparent !important; --kc-bg: linear-gradient(135deg, #e6cd8e, var(--gold)); }


body .update-banner { position: relative; isolation: isolate; border-color: transparent !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; clip-path: var(--clip-md); --kc-clip: var(--clip-md); --kc-line: var(--line-gold); --kc-bg: rgba(181,147,90,0.08); }
body .update-banner::before, body .update-banner::after { content: ''; position: absolute; z-index: -1; clip-path: var(--kc-clip); pointer-events: none; transition: background 0.18s ease; }
body .update-banner::before { inset: 0; background: var(--kc-line); }
body .update-banner::after  { inset: 1px; background: var(--kc-bg); -webkit-backdrop-filter: var(--kc-blur, none); backdrop-filter: var(--kc-blur, none); }

body .rate-card { position: relative; isolation: isolate; border-color: transparent !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; clip-path: var(--clip-lg); --kc-clip: var(--clip-lg); --kc-line: var(--line-gold); --kc-bg: linear-gradient(135deg, #0d0c0a, #10110d); }
body .rate-card::before, body .rate-card::after { content: ''; position: absolute; z-index: -1; clip-path: var(--kc-clip); pointer-events: none; transition: background 0.18s ease; }
body .rate-card::before { inset: 0; background: var(--kc-line); }
body .rate-card::after  { inset: 1px; background: var(--kc-bg); -webkit-backdrop-filter: var(--kc-blur, none); backdrop-filter: var(--kc-blur, none); }


/* ═══ hand-tuned ═══ */
/* Submit button 'N items left' state stays readable on the muted fill */
body .submit-btn.is-incomplete { --kc-bg: rgba(181,147,90,0.14); --kc-line: rgba(181,147,90,0.34); color: var(--gold-bright); }
body .submit-btn.is-incomplete:hover { --kc-line: var(--gold); }
/* Dashed drop zone → soft outline (dashes cannot follow a chamfer) */
body .image-drop { --kc-line: rgba(181,147,90,0.38); --kc-bg: rgba(181,147,90,0.06); }
body .image-drop:hover, body .image-drop.dragging { --kc-line: var(--gold); --kc-bg: rgba(181,147,90,0.11); }
/* Search: the map container and its floating control */
body .search-map { overflow: hidden; }
/* Floating "Search this area" — primary, keeps its absolute placement */
body .search-here-btn { isolation: isolate; border-radius: 0 !important; background: transparent !important; box-shadow: 0 4px 16px rgba(0,0,0,0.5) !important; clip-path: var(--clip-md); --kc-clip: var(--clip-md); --kc-line: transparent; --kc-bg: linear-gradient(135deg, var(--gold-bright), var(--gold)); color: var(--gold-ink); }
body .search-here-btn::before, body .search-here-btn::after { content: ''; position: absolute; z-index: -1; clip-path: var(--kc-clip); pointer-events: none; }
body .search-here-btn::before { inset: 0; background: var(--kc-line); }
body .search-here-btn::after  { inset: 1px; background: var(--kc-bg); }
body .search-here-btn:hover { --kc-bg: linear-gradient(135deg, #e6cd8e, var(--gold)); }

/* ═══ Fields and the section label — moved from po-tokens.css (12 Sep 2026) ═══ */
/* ── Fields: filled, chamfered, underlined. Inputs cannot carry pseudo
      elements, so instead of an outline that would be cut at the corners the
      field is a soft gold fill with a gold hairline along the bottom. ── */
.po-field,
.po-page input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]),
.po-page textarea,
.po-page select {
  border: 0 !important;
  border-bottom: 1px solid var(--line) !important;
  border-radius: 0 !important;
  clip-path: var(--clip-sm);
  background: var(--surface) !important;
  color: var(--fg);
  box-shadow: none !important;
  transition: background 0.18s var(--ease), border-color 0.18s var(--ease);
}
.po-page input:focus, .po-page textarea:focus, .po-page select:focus, .po-field:focus {
  outline: none;
  border-bottom-color: var(--gold-bright) !important;
  background: var(--surface-2) !important;
}
.po-page input::placeholder, .po-page textarea::placeholder { color: rgba(237, 232, 223, 0.32); }

/* ── Section label ("PREP", "THE SPOT", "UNITS"): one size, one tracking ── */
.po-kicker {
  font-family: var(--font-sans);
  font-size: 0.66rem;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--gold);
}