:root {
  /* Fun pastel theme */
  --bg: #ffe7f1;            /* pastel pink */
  --card: #fff5fa;          /* lighter pink card */
  --text: #1e3a8a;          /* blue */
  --muted: #3b82f6;         /* softer blue for secondary text/links */
  --accent: #0ea5e9;        /* cyan accent */
  --accent-2: #22c55e;      /* green accent */
}
* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font: 24px/1.5 system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
}
.site-header, .site-footer {
  background: var(--card);
  padding: 10px 16px;
  border-bottom: 1px solid #f5b0c6;
}
.site-footer { border-top: 1px solid #f5b0c6; border-bottom: none; }
.nav {
  display: flex;
  align-items: center;
  gap: 12px;
}
.nav-brand {
  font-weight: 700;
  color: var(--text);
  text-decoration: none;
  margin-right: 8px;
}
.nav-link {
  color: var(--muted);
  text-decoration: none;
}
.nav-link:hover { color: var(--accent); }
.spacer { flex: 1; }
.btn-link {
  background: transparent;
  border: none;
  color: var(--muted);
  cursor: pointer;
}
.btn-link:hover { color: var(--accent-2); }
.content {
  padding: 20px 16px 40px;
  max-width: 820px;
  margin: 0 auto;
}
.outings { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }
.outing {
  background: var(--card);
  padding: 12px;
  border: 1px solid #f5b0c6;
  border-radius: 8px;
}
.outing-title { color: var(--text); }
.outing-meta { color: var(--muted); display: flex; gap: 12px; font-size: 16px; margin-top: 4px; }
.outing-description { margin-top: 8px; }
.outing-description { overflow-wrap: anywhere; word-break: break-word; }
.outing-description a {
  display: inline;
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
  white-space: normal;
}
h1, h2 { margin: 8px 0 12px; }
a { color: var(--accent); }
label { display: block; margin-top: 10px; }
input, textarea {
  width: 100%;
  background: #fff0f6;
  color: var(--text);
  border: 1px solid #f5b0c6;
  border-radius: 6px;
  padding: 8px;
}
button { background: var(--accent); color: #001018; border: none; padding: 8px 12px; border-radius: 6px; cursor: pointer; }
button:hover { filter: brightness(1.1); }