/* Blaine County Sheriff's Office: shared styles (public site + Deputy Portal) */
:root {
  --night: #070d08;
  --pine: #0b160d;
  --pine-2: #10200f;
  --pine-3: #172c17;
  --moss: #22401f;
  --line: rgba(193, 137, 63, .18);
  --line-soft: rgba(236, 228, 210, .08);
  --brass: #c1893f;
  --brass-hi: #e0ab62;
  --brass-lo: #8a5f28;
  --paper: #ece4d2;
  --paper-dim: #b9b19f;
  --muted: #8a8a78;
  --sky: #7fc6e4;
  --good: #7fbf6a;
  --warn: #e0a64b;
  --bad: #d9675c;
  --radius: 14px;
  --slab: 'Zilla Slab', 'Rockwell', Georgia, serif;
  --sans: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color-scheme: dark;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; }
body {
  margin: 0; background: var(--pine); color: var(--paper);
  font: 15px/1.6 var(--sans); -webkit-font-smoothing: antialiased; overflow-x: hidden;
}
a { color: var(--brass-hi); text-decoration: none; }
a:hover { text-decoration: underline; }
img { max-width: 100%; }
h1, h2, h3, h4 { font-family: var(--slab); font-weight: 700; line-height: 1.15; margin: 0 0 .4em; letter-spacing: .01em; }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--brass-hi); outline-offset: 2px; }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5em; cursor: pointer;
  border: 1px solid var(--brass); background: var(--brass); color: #1a1206; font-weight: 700;
  padding: .7em 1.25em; border-radius: 999px; letter-spacing: .02em; text-decoration: none !important;
  transition: background .15s, transform .15s, border-color .15s;
}
.btn:hover { background: var(--brass-hi); border-color: var(--brass-hi); }
.btn:active { transform: translateY(1px); }
.btn.ghost { background: transparent; color: var(--paper); border-color: rgba(236, 228, 210, .3); }
.btn.ghost:hover { border-color: var(--brass-hi); color: var(--brass-hi); background: transparent; }
.btn.sm { padding: .42em .9em; font-size: 13px; }
.btn.danger { background: transparent; border-color: rgba(217, 103, 92, .5); color: #f0a49b; }
.btn.danger:hover { background: rgba(217, 103, 92, .12); }
.btn[disabled] { opacity: .45; cursor: not-allowed; }
.discord-ico { width: 18px; height: 18px; flex: none; }

.eyebrow { font: 600 12px/1 var(--sans); letter-spacing: .22em; text-transform: uppercase; color: var(--brass); }
.chip {
  display: inline-flex; align-items: center; gap: .35em; padding: .18em .65em; border-radius: 999px;
  font-size: 12px; font-weight: 600; border: 1px solid var(--line); color: var(--paper-dim); background: rgba(193, 137, 63, .06);
  white-space: nowrap;
}
.chip.brass { color: var(--brass-hi); border-color: rgba(224, 171, 98, .45); }
.chip.good { color: var(--good); border-color: rgba(127, 191, 106, .4); background: rgba(127, 191, 106, .07); }
.chip.warn { color: var(--warn); border-color: rgba(224, 166, 75, .4); }
.chip.bad { color: var(--bad); border-color: rgba(217, 103, 92, .4); }
.muted { color: var(--muted); }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* topographic contour backdrop: Blaine County is hills, desert and lake */
.topo {
  background-color: var(--pine);
  background-image:
    radial-gradient(1200px 600px at 75% -10%, rgba(193, 137, 63, .12), transparent 60%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='600' viewBox='0 0 600 600'%3E%3Cg fill='none' stroke='%23c1893f' stroke-opacity='.07' stroke-width='1.2'%3E%3Cpath d='M-20 120c80-40 150 30 240 0s160-80 260-30 120 40 160 10'/%3E%3Cpath d='M-20 160c90-40 150 40 250 5s170-70 260-20 110 40 150 10'/%3E%3Cpath d='M-20 200c90-30 160 45 255 12s170-60 255-15 120 35 150 8'/%3E%3Cpath d='M210 330c40-60 140-70 190-20s20 120-50 130-180-40-140-110z'/%3E%3Cpath d='M240 335c30-40 100-50 135-15s15 85-35 92-130-28-100-77z'/%3E%3Cpath d='M270 340c20-22 60-28 82-8s8 50-20 54-80-16-62-46z'/%3E%3Cpath d='M-20 470c100-50 170 20 260-10s150-60 250-20 100 30 130 10'/%3E%3Cpath d='M-20 510c100-40 170 30 260 0s160-50 250-15 100 25 130 5'/%3E%3Cpath d='M-20 550c100-35 170 35 260 5s160-45 250-10 100 20 130 3'/%3E%3C/g%3E%3C/svg%3E");
  background-size: auto, 600px 600px;
}

.card {
  background: linear-gradient(180deg, rgba(23, 44, 23, .75), rgba(16, 32, 15, .75));
  border: 1px solid var(--line-soft); border-radius: var(--radius); padding: 20px;
}
.empty { text-align: center; color: var(--muted); padding: 28px 12px; }
.toast {
  position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%) translateY(20px); opacity: 0;
  background: var(--pine-3); border: 1px solid var(--brass); color: var(--paper); padding: 10px 18px; border-radius: 10px;
  z-index: 100; transition: .25s; pointer-events: none; max-width: calc(100vw - 32px); box-shadow: 0 10px 40px rgba(0, 0, 0, .5);
}
.toast.show { opacity: 1; transform: translateX(-50%); }
.toast.err { border-color: var(--bad); }
