/* Brand: navy #113352, teal #256b75, gold #d9a85a; dark ground #0b1624. */
:root {
  --bg:#f5f7f9; --band:#ffffff; --card:#ffffff; --ink:#113352; --muted:#5b6b7b; --rule:#d9e0e6;
  --accent:#256b75; --gold:#d9a85a; --button:#113352; --button-ink:#ffffff; --on:#256b75; --on-ink:#ffffff;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg:#0b1624; --band:#0b1624; --card:#12233a; --ink:#eef2f6; --muted:#a3b3c4; --rule:#223a57;
    --accent:#5cc6c9; --gold:#e7ae44; --button:#e7ae44; --button-ink:#0b1624; --on:#5cc6c9; --on-ink:#0b1624;
  }
}
* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body { margin:0; background:var(--bg); color:var(--ink); font:16px/1.45 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  padding-bottom:calc(72px + env(safe-area-inset-bottom)); }
.serif { font-family:Georgia, "Times New Roman", serif; }

.brand { background:var(--band); border-bottom:1px solid var(--rule); text-align:center; padding:calc(6px + env(safe-area-inset-top)) 16px 6px; }
.brand img { display:block; height:118px; width:auto; margin:0 auto; }
.brand h1 { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }

main { max-width:640px; margin:0 auto; padding:16px 16px 24px; }
h2 { font:600 22px/1.2 Georgia, "Times New Roman", serif; margin:4px 0 4px; }
.lede { color:var(--muted); margin:0 0 16px; font-size:15px; }
h3.day { font-size:13px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); margin:22px 0 8px; font-weight:600; }
h3.sub { font:600 17px/1.3 Georgia, "Times New Roman", serif; margin:24px 0 8px; }

.card { background:var(--card); border:1px solid var(--rule); border-radius:12px; padding:13px 14px; margin-bottom:8px; }
.promise { border-left:4px solid var(--gold); padding:14px 16px; margin-bottom:14px; }
.promise strong { display:block; font:600 17px/1.3 Georgia, "Times New Roman", serif; margin-bottom:4px; }
.promise span { color:var(--muted); font-size:15px; }

a.obit { display:block; color:inherit; text-decoration:none; }
a.obit:active { border-color:var(--accent); }
.name { font:600 18px/1.25 Georgia, "Times New Roman", serif; }
.meta { color:var(--muted); font-size:14px; margin-top:3px; }
.cta { color:var(--accent); font-size:14px; margin-top:6px; }
.new { display:inline-block; background:var(--gold); color:#0b1624; font:700 11px/1 -apple-system, "Segoe UI", sans-serif; letter-spacing:.05em;
  text-transform:uppercase; border-radius:999px; padding:4px 8px; margin-left:8px; vertical-align:3px; }

.chips { display:flex; gap:8px; overflow-x:auto; padding:2px 0 12px; margin:0 -16px; padding-left:16px; padding-right:16px; scrollbar-width:none; }
.chips::-webkit-scrollbar { display:none; }
.chip { flex:none; border:1px solid var(--rule); background:var(--card); color:var(--ink); border-radius:999px; padding:8px 14px; font:inherit; font-size:14px; min-height:38px; }
.chip[aria-pressed="true"] { background:var(--on); border-color:var(--on); color:var(--on-ink); font-weight:600; }
.status { color:var(--muted); font-size:13px; min-height:20px; margin:0 0 4px; }

button, select, input { font:inherit; color:var(--ink); }
.btn, select, input[type="search"] { background:var(--card); border:1px solid var(--rule); border-radius:10px; padding:10px 14px; min-height:44px; }
.btn { white-space:nowrap; flex:none; }
.btn.primary { background:var(--button); border-color:var(--button); color:var(--button-ink); font-weight:600; }
.btn.quiet { color:var(--muted); min-height:38px; padding:6px 12px; font-size:14px; }
.btn:disabled { opacity:.55; }
.row { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.row > select, .row > input { flex:1 1 150px; min-width:0; }
.search { margin-bottom:14px; flex-wrap:nowrap; }
.search input { flex:1 1 auto; min-width:0; }
.between { display:flex; gap:12px; align-items:center; justify-content:space-between; }
.between > div:first-child { min-width:0; }
.title { font-weight:600; }
.small { color:var(--muted); font-size:14px; }

.choice { display:flex; border:1px solid var(--rule); border-radius:10px; overflow:hidden; margin-top:10px; }
.choice button { flex:1; border:0; background:transparent; padding:10px 8px; min-height:44px; font-size:14px; color:var(--muted); }
.choice button + button { border-left:1px solid var(--rule); }
.choice button[aria-pressed="true"] { background:var(--on); color:var(--on-ink); font-weight:600; }
.muted-firm .title, .muted-firm .small { opacity:.6; }

.results { margin-top:8px; }
.results button { display:block; width:100%; text-align:left; background:var(--card); border:1px solid var(--rule); border-radius:10px; padding:11px 14px; margin-bottom:6px; min-height:44px; }

label.opt { display:flex; gap:12px; align-items:flex-start; padding:12px 14px; }
label.opt input { margin-top:4px; width:18px; height:18px; accent-color:var(--accent); }
.note { color:var(--muted); padding:8px 0 16px; }
footer.fine { color:var(--muted); font-size:13px; margin-top:24px; border-top:1px solid var(--rule); padding-top:14px; }

.tabs { position:fixed; left:0; right:0; bottom:0; display:flex; background:var(--band); border-top:1px solid var(--rule);
  padding-bottom:env(safe-area-inset-bottom); z-index:5; }
.tabs button { flex:1; border:0; background:transparent; color:var(--muted); font-size:11px; padding:8px 2px 7px; min-height:58px;
  display:flex; flex-direction:column; align-items:center; gap:3px; }
.tabs svg { width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.tabs button[aria-current="page"] { color:var(--accent); font-weight:600; }
