@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Fraunces:opsz,wght@9..144,600;9..144,700&display=swap');

:root {
  --forest: #173a33;
  --forest-2: #245a4d;
  --cream: #f5f0e6;
  --paper: #fffdf8;
  --ink: #17211d;
  --muted: #5d6b65;
  --coral: #e86f51;
  --coral-dark: #bf4f36;
  --sun: #f5c95c;
  --sage: #dce8dd;
  --line: #d7d9d2;
  --danger: #a8352a;
  --focus: #186bba;
  --shadow: 0 16px 44px rgba(23,58,51,.14);
  --radius: 18px;
}
* { box-sizing: border-box; }
html { background: var(--cream); color: var(--ink); font-family: "DM Sans", sans-serif; font-size: 100%; }
html.large-text { font-size: 125%; }
body { margin: 0; min-height: 100vh; background: var(--cream); }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, a:focus-visible {
  outline: 3px solid var(--focus); outline-offset: 3px;
}
.skip-link { position: fixed; left: 12px; top: -80px; z-index: 100; background: var(--paper); padding: 12px 18px; }
.skip-link:focus { top: 12px; }
.app-shell { width: 100%; min-height: 100vh; padding-bottom: 90px; }
.topbar { height: 76px; padding: 0 clamp(18px, 4vw, 54px); display:flex; align-items:center; justify-content:space-between; background:var(--paper); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:20; }
.brand { border:0; background:none; display:flex; align-items:center; gap:10px; font-weight:800; letter-spacing:.06em; font-size:1rem; cursor:pointer; }
.brand-mark { width:36px; height:36px; border-radius:50%; display:grid; place-items:center; color:var(--paper); background:var(--coral); font-size:1.5rem; }
.top-actions { display:flex; align-items:center; gap:12px; }
.access-button { min-width:44px; min-height:44px; padding:8px 11px; border:1px solid var(--forest); border-radius:10px; background:var(--paper); color:var(--forest); font-weight:800; cursor:pointer; }
.access-button span { margin-left:4px; }
.help-link { border:0; background:none; color:var(--forest-2); text-decoration:underline; text-underline-offset:4px; font-weight:700; cursor:pointer; }
.profile-chip { width:42px; height:42px; border:0; border-radius:50%; background:var(--sun); font-weight:800; cursor:pointer; }
main { max-width:1180px; margin:0 auto; padding:clamp(28px, 5vw, 64px) clamp(18px, 5vw, 64px); }
.bottom-nav { position:fixed; bottom:0; left:50%; translate:-50% 0; z-index:30; width:min(680px,100%); min-height:72px; background:var(--paper); border:1px solid var(--line); border-bottom:0; border-radius:22px 22px 0 0; display:grid; grid-template-columns:repeat(5,1fr); box-shadow:0 -8px 28px rgba(23,58,51,.09); }
.bottom-nav button { border:0; background:none; min-width:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; cursor:pointer; color:var(--muted); padding:8px 3px; }
.bottom-nav button span { font-size:1.35rem; line-height:1; }
.bottom-nav button small { font-size:.72rem; }
.bottom-nav button.active { color:var(--forest); font-weight:800; }
.bottom-nav .nav-create span { background:var(--coral); color:var(--paper); width:38px; height:38px; display:grid; place-items:center; border-radius:50%; margin-top:-22px; box-shadow:0 6px 16px rgba(191,79,54,.28); }

.eyebrow { color:var(--coral-dark); text-transform:uppercase; font-weight:800; letter-spacing:.09em; font-size:.78rem; margin:0 0 10px; }
h1, h2, h3 { font-family:"Fraunces", Georgia, serif; line-height:1.05; margin-top:0; color:var(--forest); }
h1 { font-size:clamp(2.5rem, 7vw, 5.4rem); letter-spacing:-.04em; margin-bottom:18px; }
h2 { font-size:clamp(2rem, 5vw, 3.4rem); letter-spacing:-.035em; margin-bottom:14px; }
h3 { font-size:clamp(1.35rem, 2.5vw, 1.8rem); margin-bottom:8px; }
p { line-height:1.62; }
.lede { color:var(--muted); font-size:clamp(1.05rem, 2vw, 1.3rem); max-width:650px; margin:0; }
.page-head { margin-bottom:36px; display:flex; justify-content:space-between; align-items:end; gap:24px; }
.page-head h1 { font-size:clamp(2.5rem,6vw,4.3rem); }

.hero { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr); gap:clamp(28px,6vw,80px); align-items:center; min-height:390px; }
.hero-copy { position:relative; }
.hero-copy::before { content:""; position:absolute; width:130px; height:10px; border-radius:50%; background:var(--sun); left:2px; bottom:-30px; rotate:-2deg; }
.hero-note { background:var(--forest); color:var(--paper); padding:30px; border-radius:50% 50% 48% 52% / 45% 48% 52% 55%; min-height:300px; display:grid; place-items:center; text-align:center; rotate:2deg; box-shadow:var(--shadow); }
.hero-note strong { display:block; font-family:"Fraunces",serif; font-size:2rem; margin-bottom:10px; }
.hero-note p { max-width:260px; margin:0; }
.action-grid { margin-top:72px; display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.action-tile { min-height:210px; border:0; padding:24px; cursor:pointer; text-align:left; border-radius:var(--radius); background:var(--paper); border:1px solid var(--line); display:flex; flex-direction:column; justify-content:space-between; transition:transform .18s ease, box-shadow .18s ease; }
.action-tile:hover { transform:translateY(-4px); box-shadow:var(--shadow); }
.action-tile.primary { background:var(--coral); color:var(--paper); border-color:transparent; }
.action-tile.dark { background:var(--forest); color:var(--paper); border-color:transparent; }
.action-tile h3 { color:inherit; }
.tile-icon { font-size:2rem; }
.tile-arrow { font-size:1.8rem; align-self:flex-end; }
.safety-strip { margin-top:42px; display:flex; align-items:center; gap:16px; padding:18px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.safety-strip strong { color:var(--forest); }
.safety-strip p { margin:0; color:var(--muted); }

.filter-row { display:flex; flex-wrap:wrap; gap:10px; margin:24px 0 32px; }
.filter { border:1px solid var(--line); background:var(--paper); border-radius:999px; padding:11px 17px; cursor:pointer; }
.filter.active { background:var(--forest); color:var(--paper); border-color:var(--forest); }
.activity-list { display:grid; gap:18px; }
.activity-card { background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); display:grid; grid-template-columns:180px 1fr auto; overflow:hidden; min-height:190px; }
.activity-visual { display:grid; place-items:center; font-size:3.4rem; background:var(--sage); }
.activity-card:nth-child(2n) .activity-visual { background:#f1dfd3; }
.activity-card:nth-child(3n) .activity-visual { background:#f8eab9; }
.activity-info { padding:24px; }
.activity-info h3 { margin-bottom:6px; }
.meta { color:var(--muted); margin:5px 0; }
.badges { display:flex; flex-wrap:wrap; gap:7px; margin-top:14px; }
.badge { font-size:.78rem; background:var(--sage); color:var(--forest); border-radius:999px; padding:6px 9px; font-weight:700; }
.badge.new { background:#f4e8c6; }
.activity-side { min-width:150px; padding:24px; display:flex; flex-direction:column; justify-content:space-between; align-items:flex-end; border-left:1px solid var(--line); }
.spots { font-weight:800; color:var(--forest-2); }

.btn { border:0; border-radius:999px; padding:13px 21px; font-weight:800; cursor:pointer; min-height:48px; display:inline-flex; align-items:center; justify-content:center; gap:8px; text-decoration:none; }
.btn-primary { background:var(--coral); color:var(--paper); }
.btn-primary:hover { background:var(--coral-dark); }
.btn-secondary { background:var(--forest); color:var(--paper); }
.btn-quiet { background:var(--sage); color:var(--forest); }
.btn-outline { background:transparent; border:1px solid var(--forest); color:var(--forest); }
.btn-danger { background:#f5d8d3; color:var(--danger); }
.btn-wide { width:100%; }
.text-btn { border:0; background:none; text-decoration:underline; text-underline-offset:4px; cursor:pointer; color:var(--forest-2); font-weight:700; }

.detail-grid { display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:42px; }
.detail-hero { min-height:260px; background:var(--sage); border-radius:32px; display:grid; place-items:center; font-size:5rem; margin-bottom:30px; }
.detail-facts { display:grid; grid-template-columns:repeat(2,1fr); gap:0; border-top:1px solid var(--line); }
.fact { padding:20px 0; border-bottom:1px solid var(--line); }
.fact:nth-child(odd) { padding-right:22px; }
.fact span { display:block; color:var(--muted); font-size:.85rem; margin-bottom:4px; }
.host-block { margin-top:30px; padding:24px 0; border-top:1px solid var(--line); }
.avatar-row { display:flex; align-items:center; gap:14px; }
.avatar { width:54px; height:54px; border-radius:50%; background:var(--sun); display:grid; place-items:center; font-weight:800; flex:0 0 auto; }
.join-panel { background:var(--paper); border:1px solid var(--line); padding:26px; border-radius:24px; position:sticky; top:100px; align-self:start; box-shadow:var(--shadow); }
.join-panel ul { padding-left:20px; line-height:1.7; }
.safety-callout { background:#fff5d9; border-radius:14px; padding:16px; margin:18px 0; }
.safety-callout strong { display:block; margin-bottom:4px; }

.form-layout { max-width:760px; }
.progress { display:flex; align-items:center; gap:8px; margin-bottom:30px; }
.progress span { height:6px; flex:1; border-radius:99px; background:var(--line); }
.progress span.done { background:var(--coral); }
.field { margin-bottom:24px; }
.field label, .field legend { display:block; font-weight:800; margin-bottom:9px; color:var(--forest); }
.field input, .field select, .field textarea { width:100%; border:1px solid #afb9b2; border-radius:12px; min-height:52px; padding:13px 14px; background:var(--paper); color:var(--ink); }
.field textarea { min-height:110px; resize:vertical; }
.field small { display:block; color:var(--muted); margin-top:7px; line-height:1.5; }
.choice-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
.choice { border:1px solid var(--line); border-radius:14px; padding:14px; background:var(--paper); cursor:pointer; text-align:left; }
.choice.selected { border:2px solid var(--forest); background:var(--sage); }
.form-actions { display:flex; justify-content:space-between; gap:12px; margin-top:32px; }
.check-row { display:flex; align-items:flex-start; gap:11px; padding:14px; border:1px solid var(--line); border-radius:12px; background:var(--paper); }
.check-row input { width:20px; height:20px; margin-top:2px; }

.people-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.person-card { background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); padding:24px; }
.person-card .avatar { width:72px; height:72px; font-size:1.2rem; margin-bottom:18px; }
.person-card p { color:var(--muted); }

.chat-layout { display:grid; grid-template-columns:270px 1fr; min-height:620px; background:var(--paper); border:1px solid var(--line); border-radius:22px; overflow:hidden; }
.chat-list { border-right:1px solid var(--line); padding:12px; }
.chat-item { width:100%; border:0; background:none; text-align:left; padding:15px; border-radius:12px; cursor:pointer; }
.chat-item.active { background:var(--sage); }
.chat-item strong, .chat-item small { display:block; }
.chat-item small { color:var(--muted); margin-top:3px; }
.chat-main { display:flex; flex-direction:column; min-width:0; }
.chat-head { padding:18px 22px; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; }
.chat-messages { flex:1; padding:24px; display:flex; flex-direction:column; gap:14px; overflow:auto; background:#fbfaf5; }
.message { max-width:72%; padding:12px 15px; border-radius:16px 16px 16px 4px; background:var(--paper); border:1px solid var(--line); }
.message.mine { align-self:flex-end; background:var(--forest); color:var(--paper); border-radius:16px 16px 4px 16px; border-color:var(--forest); }
.message small { display:block; opacity:.68; margin-top:6px; }
.chat-compose { padding:16px; border-top:1px solid var(--line); display:flex; gap:10px; }
.chat-compose input { flex:1; border:1px solid #afb9b2; border-radius:999px; padding:0 17px; min-width:0; }

.modal-backdrop { position:fixed; inset:0; z-index:60; background:rgba(13,29,25,.62); display:grid; place-items:center; padding:18px; }
.modal { width:min(560px,100%); max-height:90vh; overflow:auto; background:var(--paper); border-radius:24px; padding:28px; box-shadow:var(--shadow); }
.modal-head { display:flex; justify-content:space-between; gap:20px; align-items:start; }
.modal-close { border:0; background:var(--sage); width:40px; height:40px; border-radius:50%; cursor:pointer; font-size:1.2rem; }
.modal .option { display:block; width:100%; border:1px solid var(--line); background:var(--paper); padding:15px; text-align:left; margin:9px 0; border-radius:12px; cursor:pointer; }
.modal .option:hover { background:var(--sage); }
.warning-box { background:#fae0dc; color:#6f211a; padding:16px; border-radius:12px; margin:16px 0; }
.toast { position:fixed; left:50%; bottom:92px; translate:-50% 20px; opacity:0; pointer-events:none; z-index:100; background:var(--forest); color:var(--paper); border-radius:999px; padding:12px 18px; transition:.2s ease; box-shadow:var(--shadow); }
.toast.show { opacity:1; translate:-50% 0; }
.empty { padding:70px 20px; text-align:center; }
.empty .big { font-size:4rem; display:block; margin-bottom:16px; }

@media (max-width:900px) {
  .hero { grid-template-columns:1fr; }
  .hero-note { min-height:220px; border-radius:30px; rotate:0deg; }
  .action-grid { grid-template-columns:repeat(2,1fr); margin-top:48px; }
  .activity-card { grid-template-columns:120px 1fr; }
  .activity-side { grid-column:1/-1; border-left:0; border-top:1px solid var(--line); flex-direction:row; align-items:center; }
  .detail-grid { grid-template-columns:1fr; }
  .join-panel { position:static; }
  .people-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:650px) {
  .topbar { height:66px; padding:0 14px; }
  .help-link { font-size:.85rem; }
  main { padding:28px 16px 110px; }
  .page-head { align-items:start; flex-direction:column; }
  .hero { min-height:0; }
  .hero-copy::before { display:none; }
  .action-grid { grid-template-columns:1fr; gap:10px; }
  .action-tile { min-height:145px; }
  .activity-card { grid-template-columns:82px 1fr; }
  .activity-visual { font-size:2.4rem; }
  .activity-info { padding:18px 14px; }
  .activity-side { padding:14px; }
  .detail-facts { grid-template-columns:1fr; }
  .fact:nth-child(odd) { padding-right:0; }
  .people-grid { grid-template-columns:1fr; }
  .choice-grid { grid-template-columns:1fr; }
  .chat-layout { grid-template-columns:1fr; }
  .chat-list { border-right:0; border-bottom:1px solid var(--line); display:flex; overflow:auto; }
  .chat-item { min-width:180px; }
  .message { max-width:88%; }
  .bottom-nav button small { font-size:.63rem; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior:auto !important; transition:none !important; }
}

/* Warm, homelike welcome direction */
.welcome-hero { display:grid; grid-template-columns:minmax(0,.88fr) minmax(380px,1.12fr); gap:clamp(32px,6vw,78px); align-items:center; min-height:540px; }
.welcome-copy h1 { max-width:700px; font-size:clamp(3rem,6.7vw,5.8rem); }
.welcome-actions { display:flex; align-items:center; gap:22px; flex-wrap:wrap; margin-top:32px; }
.btn-large { min-height:58px; padding:16px 28px; font-size:1.05rem; }
.welcome-reassurance { margin-top:30px; display:flex; align-items:center; gap:12px; max-width:570px; color:var(--muted); }
.welcome-reassurance span { width:34px; height:34px; display:grid; place-items:center; border-radius:50%; background:var(--sage); color:var(--forest); font-weight:900; flex:0 0 auto; }
.welcome-reassurance p { margin:0; }
.welcome-picture { margin:0; position:relative; }
.welcome-picture img { width:100%; display:block; border-radius:48% 48% 18px 18px / 30% 30% 18px 18px; box-shadow:var(--shadow); background:#e7d8c1; }
.welcome-picture figcaption { position:absolute; left:24px; bottom:20px; background:rgba(255,253,248,.92); color:var(--forest); padding:10px 14px; border-radius:10px; font-weight:700; backdrop-filter:blur(4px); }
.comfort-row { margin-top:60px; padding:30px 0; border-top:1px solid #c9ccbf; display:grid; grid-template-columns:repeat(3,1fr); gap:32px; }
.comfort-row article { display:flex; align-items:flex-start; gap:14px; }
.comfort-row article > span { width:36px; height:36px; display:grid; place-items:center; border-radius:50%; background:var(--sun); color:var(--forest); font-weight:900; flex:0 0 auto; }
.comfort-row h3 { font-size:1.2rem; margin:0 0 4px; }
.comfort-row p { color:var(--muted); margin:0; }
.activity-visual { overflow:hidden; padding:0; }
.activity-visual img { width:100%; height:100%; object-fit:cover; display:block; }
.detail-hero { overflow:hidden; padding:0; }
.detail-hero img { width:100%; height:100%; object-fit:cover; display:block; }
.sr-only { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
@media (max-width:900px) { .welcome-hero { grid-template-columns:1fr; } .welcome-picture { max-width:680px; } }
@media (max-width:650px) { .welcome-hero { min-height:0; } .welcome-copy h1 { font-size:clamp(2.8rem,14vw,4.2rem); } .welcome-picture img { border-radius:28px 28px 14px 14px; } .welcome-picture figcaption { position:static; border-radius:0 0 14px 14px; background:var(--paper); } .comfort-row { grid-template-columns:1fr; gap:24px; margin-top:40px; } }


/* Low-vision support: user-controlled, persistent and independent of colour alone. */
html.high-contrast {
  --forest:#082a22; --forest-2:#0b3d31; --cream:#ffffff; --paper:#ffffff;
  --ink:#000000; --muted:#252525; --coral:#a62c14; --coral-dark:#7f1c09;
  --sun:#ffd43b; --sage:#d7ede1; --line:#545454; --danger:#7e1008;
  --focus:#005fcc;
}
html.high-contrast .activity-card,
html.high-contrast .action-tile,
html.high-contrast .join-panel,
html.high-contrast .person-card,
html.high-contrast .chat-layout { border-width:2px; }
html.high-contrast .meta, html.high-contrast small { color:#202020; }
html.large-text .activity-card { grid-template-columns:150px 1fr; }
html.large-text .activity-side { grid-column:1/-1; border-left:0; border-top:1px solid var(--line); flex-direction:row; align-items:center; }
html.large-text .bottom-nav { min-height:84px; }
html.large-text .bottom-nav small { font-size:.78rem; }
@media (max-width:760px) {
  .access-button span { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
  .top-actions { gap:7px; }
  .access-button { min-width:44px; padding:6px; }
  .help-link { min-height:44px; }
}
@media (max-width:430px) {
  .profile-chip { display:none; }
}
.trust-badge { background:#e4eddf; border:1px solid #b7c9b2; }
.trust-badge span[aria-hidden="true"] { font-weight:900; margin-right:2px; }
html.high-contrast .trust-badge { background:#ffffff; border:2px solid #153d31; color:#000000; }

/* Local partner listings */
.partner-card { border:2px solid var(--sun); }
.partner-tag { position:absolute; left:10px; bottom:10px; background:var(--sun); color:#3a2c00; font-weight:800; font-size:.72rem; padding:5px 10px; border-radius:999px; }
.activity-visual { position:relative; }

/* Calendar */
.calendar-month { background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); padding:22px; }
.calendar-weekdays { display:grid; grid-template-columns:repeat(7,1fr); gap:4px; margin:14px 0 6px; font-weight:800; color:var(--muted); font-size:.78rem; text-align:center; }
.calendar-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:4px; }
.cal-cell { display:grid; place-items:center; min-height:40px; border-radius:8px; font-weight:700; position:relative; }
.cal-cell.empty { visibility:hidden; }
.cal-cell.has-plan { background:var(--sage); color:var(--forest); }
.cal-cell.has-plan::after { content:""; position:absolute; bottom:4px; width:6px; height:6px; border-radius:50%; background:var(--coral); }
.cal-cell.today { border:2px solid var(--forest); }
html.high-contrast .partner-tag { background:#ffd43b; color:#000000; }
html.high-contrast .cal-cell.has-plan { border:2px solid #153d31; }

/* Private location and discovery area */
.page-head-actions,.strip-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.location-layout { display:grid; grid-template-columns:minmax(220px,.9fr) minmax(260px,1.1fr); gap:20px; align-items:stretch; margin:18px 0; }
.private-map { position:relative; min-height:260px; overflow:hidden; border:2px solid var(--forest); border-radius:18px; background:#e5edda; }
.map-road { position:absolute; display:block; width:140%; height:22px; background:#fffdf8; border:1px solid #c8c1b5; rotate:-18deg; left:-20%; top:35%; }
.map-road.two { rotate:26deg; top:67%; }
.map-water { position:absolute; width:45px; height:140%; top:-20%; right:14%; background:#a9d5dd; rotate:12deg; }
.area-ring { position:absolute; width:var(--ring); aspect-ratio:1; max-width:210px; border-radius:50%; border:2px solid var(--coral); background:rgba(232,111,81,.13); left:50%; top:50%; translate:-50% -50%; }
.my-location-dot { position:absolute; width:20px; height:20px; border:5px solid var(--paper); border-radius:50%; background:#1466c3; box-shadow:0 0 0 2px #0b3f7c,0 3px 10px rgba(0,0,0,.25); left:50%; top:50%; translate:-50% -50%; }
.map-label { position:absolute; left:50%; top:calc(50% + 25px); translate:-50% 0; white-space:nowrap; background:var(--paper); padding:5px 9px; border-radius:8px; font-weight:800; font-size:.78rem; box-shadow:0 2px 8px rgba(0,0,0,.14); }
.privacy-note,.empty-state { background:var(--sage); color:var(--forest); border-radius:14px; padding:16px; margin:14px 0; }
.privacy-note p { margin:5px 0 0; }
#area-radius { width:100%; min-height:44px; accent-color:var(--coral); }
html.high-contrast .private-map { background:#fff; border-width:3px; }
html.high-contrast .area-ring { background:transparent; border-width:4px; }
@media (max-width:700px) { .location-layout { grid-template-columns:1fr; } .private-map { min-height:220px; } .strip-actions { width:100%; } }

/* Profile, history and wider-area discovery */
.area-search { background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); padding:18px; margin:0 0 18px; }
.area-search > label { display:block; font-weight:800; color:var(--forest); margin-bottom:8px; }
.area-search > div:first-of-type { display:grid; grid-template-columns:1fr auto; gap:8px; }
.area-search input { width:100%; min-height:50px; border:1px solid #afb9b2; border-radius:12px; padding:11px 13px; background:var(--paper); color:var(--ink); }
.quick-areas { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.quick-areas button { min-height:44px; border:1px solid var(--forest); border-radius:999px; background:transparent; color:var(--forest); padding:7px 14px; font-weight:800; cursor:pointer; }
.hobby-match { background:#f4e8c6; border-left:5px solid var(--sun); border-radius:12px; padding:14px 16px; margin-bottom:18px; }
.hobby-match p { margin:4px 0 0; }
.profile-form { display:grid; grid-template-columns:minmax(190px,.38fr) minmax(300px,1fr); gap:30px; align-items:start; }
.profile-photo-panel { background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); padding:22px; display:grid; justify-items:center; gap:14px; text-align:center; }
.profile-photo { width:150px; height:150px; border-radius:50%; overflow:hidden; display:grid; place-items:center; background:var(--sun); color:var(--forest); font-size:2.5rem; font-weight:900; }
.profile-photo img { width:100%; height:100%; object-fit:cover; }
.hobby-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:8px; }
.hobby-choice { position:relative; }
.hobby-choice input { position:absolute; opacity:0; }
.hobby-choice span { display:block; min-height:44px; border:1px solid var(--line); border-radius:12px; padding:11px 12px; background:var(--paper); cursor:pointer; }
.hobby-choice input:checked + span { border:2px solid var(--forest); background:var(--sage); font-weight:800; }
.hobby-choice input:focus-visible + span { outline:3px solid var(--focus); outline-offset:2px; }
.history-summary { display:flex; gap:18px; flex-wrap:wrap; margin-bottom:22px; }
.history-summary > * { background:var(--sage); color:var(--forest); border-radius:999px; padding:10px 16px; font-weight:800; }
html.high-contrast .hobby-match,.hobby-choice input:checked + span { border-color:#000; }
@media (max-width:760px) { .profile-form { grid-template-columns:1fr; } .area-search > div:first-of-type { grid-template-columns:1fr; } }
@media (max-width:430px) { .hobby-grid { grid-template-columns:1fr; } }

/* Shared activity taxonomy */
.filter-section { margin:24px 0 32px; }
.filter-section > strong { display:block; color:var(--forest); margin-bottom:10px; }
.filter-section .filter-row { margin:0 0 12px; }
.subfilter-row { display:flex; flex-wrap:wrap; gap:8px; padding:14px; border-radius:14px; background:var(--sage); }
.subfilter { min-height:44px; border:1px solid var(--forest); border-radius:999px; padding:8px 13px; background:var(--paper); color:var(--forest); font-weight:700; cursor:pointer; }
.subfilter.active { background:var(--forest); color:var(--paper); }
.master-choice-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
.subactivity-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.interest-groups { display:grid; gap:16px; }
.interest-group { padding:16px; border:1px solid var(--line); border-radius:14px; background:var(--paper); }
.interest-group h3 { font-size:1.15rem; margin-bottom:12px; }
.interest-group .hobby-grid { grid-template-columns:repeat(3,1fr); }
html.high-contrast .subfilter-row { border:2px solid #000; }
@media (max-width:760px) { .subactivity-grid,.interest-group .hobby-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:430px) { .master-choice-grid,.subactivity-grid,.interest-group .hobby-grid { grid-template-columns:1fr; } }

/* Visible travel-distance control */
.travel-distance { margin:0 0 18px; padding:22px; border:2px solid var(--forest); border-radius:var(--radius); background:var(--paper); }
.travel-distance-head { display:flex; align-items:start; justify-content:space-between; gap:20px; }
.travel-distance-head h2 { margin-bottom:7px; font-size:clamp(1.45rem,3vw,2rem); }
.travel-distance-head p { margin:0; color:var(--muted); }
.travel-distance output { flex:0 0 auto; min-width:104px; padding:10px 14px; border-radius:999px; background:var(--forest); color:var(--paper); text-align:center; font-weight:900; }
.distance-presets { display:flex; flex-wrap:wrap; gap:8px; margin:20px 0 16px; }
.distance-choice { min-height:46px; padding:9px 16px; border:1px solid var(--forest); border-radius:999px; background:var(--paper); color:var(--forest); font-weight:800; cursor:pointer; }
.distance-choice.active { border-color:var(--forest); background:var(--forest); color:var(--paper); }
.range-label { display:grid; gap:7px; color:var(--forest); font-weight:800; }
#find-radius { width:100%; min-height:44px; accent-color:var(--coral); cursor:pointer; }
.range-ends { display:flex; justify-content:space-between; color:var(--muted); font-weight:600; }
html.high-contrast .travel-distance { border-width:3px; }
html.high-contrast .distance-choice.active { outline:3px solid var(--focus); outline-offset:2px; }
@media (max-width:600px) { .travel-distance-head { flex-direction:column; } .travel-distance output { align-self:flex-start; } .distance-choice { flex:1 1 calc(33.333% - 8px); } }
.distance-choice.wide-choice { padding-inline:22px; border-width:2px; }
.muted-range { opacity:.72; }
.muted-range:hover,.muted-range:focus-within { opacity:1; }

/* Safety centre and activity-day controls */
.activity-day-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:10px; }
.safety-dashboard { display:grid; gap:38px; }
.safety-dashboard section { min-width:0; }
.safety-dashboard h2 { font-size:clamp(1.65rem,3vw,2.35rem); margin-bottom:16px; }
.safety-action-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.option-card { min-height:132px; border:1px solid var(--line); border-radius:16px; padding:18px; background:var(--paper); text-align:left; cursor:pointer; display:flex; flex-direction:column; justify-content:space-between; }
.option-card strong { color:var(--forest); font-family:"Fraunces",Georgia,serif; font-size:1.35rem; }
.option-card span { color:var(--muted); line-height:1.45; }
.option-card.danger { background:#fae0dc; border-color:#d99d94; }
.case-list { display:grid; border-top:1px solid var(--line); }
.case-list article { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:17px 0; border-bottom:1px solid var(--line); }
.case-list article strong { display:inline-block; margin-left:8px; color:var(--forest); }
.case-list article p { margin:5px 0 0; color:var(--muted); }
.case-status { flex:0 0 auto; font-weight:800; color:var(--forest-2); }
.report-summary { display:flex; justify-content:space-between; gap:12px; padding:14px; margin:10px 0 22px; border-radius:12px; background:var(--sage); }
.two-fields { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
html.high-contrast .option-card, html.high-contrast .case-list { border-width:2px; border-color:#000; }
@media (max-width:700px) { .safety-action-grid { grid-template-columns:1fr; } .two-fields { grid-template-columns:1fr; } .case-list article { align-items:flex-start; flex-direction:column; } }

/* Browsable calendar and private diary */
.calendar-toolbar { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:14px; }
.calendar-toolbar h2 { margin:0; font-size:clamp(1.7rem,4vw,2.6rem); text-align:center; }
.calendar-jumps { display:flex; gap:7px; flex-wrap:wrap; }
.calendar-jumps:last-child { justify-content:flex-end; }
.calendar-nav { min-height:44px; border:1px solid var(--forest); border-radius:999px; padding:8px 13px; background:var(--paper); color:var(--forest); font-weight:800; cursor:pointer; }
.calendar-legend { display:flex; justify-content:center; flex-wrap:wrap; gap:20px; margin:18px 0 8px; color:var(--muted); font-weight:700; font-size:.88rem; }
.calendar-legend span { display:flex; align-items:center; gap:7px; }
.cal-cell { border:1px solid transparent; background:transparent; color:var(--ink); cursor:pointer; min-height:58px; align-content:center; gap:5px; }
.cal-cell:hover { background:#eee7d9; }
.cal-cell.has-plan { background:var(--sage); }
.cal-cell.has-diary { box-shadow:inset 0 -4px 0 var(--sun); }
.cal-cell.has-plan::after { display:none; }
.plan-dot,.diary-dot { display:inline-block; width:8px; height:8px; border-radius:50%; }
.plan-dot { background:var(--coral); }
.diary-dot { background:#b98912; }
.cal-cell .plan-dot,.cal-cell .diary-dot { position:absolute; bottom:7px; }
.cal-cell .plan-dot { left:calc(50% - 10px); }
.cal-cell .diary-dot { left:calc(50% + 2px); }
.cal-cell .plan-dot:only-of-type,.cal-cell .diary-dot:only-of-type { left:calc(50% - 4px); }
.calendar-help { text-align:center; color:var(--muted); margin:14px 0 0; }
.diary-timeline { margin-top:38px; }
.timeline-head { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:14px; }
.timeline-head h2 { margin:0; }
.timeline-head > strong { background:var(--sage); color:var(--forest); border-radius:999px; padding:9px 14px; }
.timeline-entry { display:grid; grid-template-columns:74px 1fr auto; gap:20px; align-items:center; padding:20px 0; border-top:1px solid var(--line); }
.timeline-entry:last-child { border-bottom:1px solid var(--line); }
.timeline-date { display:grid; justify-items:center; padding:10px; border-radius:14px; background:var(--paper); border:1px solid var(--line); }
.timeline-date strong { font-family:"Fraunces",Georgia,serif; font-size:1.8rem; color:var(--forest); }
.timeline-date span,.entry-type { color:var(--muted); font-size:.78rem; font-weight:800; text-transform:uppercase; letter-spacing:.06em; }
.timeline-copy h3 { margin:5px 0; }
.timeline-copy p { margin:0; color:var(--muted); white-space:pre-wrap; }
.timeline-actions { display:flex; align-items:center; gap:12px; }
html.high-contrast .cal-cell { border-color:#555; }
html.high-contrast .cal-cell.has-diary { box-shadow:inset 0 -5px 0 #805b00; }
@media (max-width:760px) { .calendar-toolbar { grid-template-columns:1fr; } .calendar-toolbar h2 { grid-row:1; } .calendar-jumps,.calendar-jumps:last-child { justify-content:center; } .cal-cell { min-height:48px; padding:3px; } .timeline-entry { grid-template-columns:62px 1fr; } .timeline-actions { grid-column:2; } }
@media (max-width:430px) { .calendar-month { padding:14px 8px; } .calendar-weekdays { font-size:.68rem; } .calendar-nav { padding:7px 10px; } .timeline-entry { gap:12px; } }

/* Advanced diary tools */
.diary-tools { display:grid; grid-template-columns:auto minmax(240px,1fr) auto; gap:14px; align-items:center; margin:-12px 0 24px; }
.view-switch { display:flex; padding:4px; border-radius:999px; background:var(--sage); }
.view-switch button { min-height:40px; padding:7px 15px; border:0; border-radius:999px; background:transparent; color:var(--forest); font-weight:800; cursor:pointer; }
.view-switch button.active { background:var(--forest); color:var(--paper); }
.diary-search { display:flex; gap:8px; }
.diary-search input { width:100%; min-height:46px; border:1px solid var(--line); border-radius:999px; padding:9px 15px; background:var(--paper); }
.diary-menu { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:7px; }
.diary-menu .btn { min-height:42px; padding:8px 14px; }
.week-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:8px; margin-top:15px; }
.week-day { min-height:120px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:6px; border:1px solid var(--line); border-radius:14px; background:var(--paper); cursor:pointer; }
.week-day strong { font:700 1.8rem "Fraunces",Georgia,serif; color:var(--forest); }
.week-day span,.week-day small { color:var(--muted); }
.week-day.today { border:3px solid var(--forest); }
.year-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-top:18px; }
.year-month { min-height:104px; border:1px solid var(--line); border-radius:14px; background:var(--paper); cursor:pointer; display:flex; flex-direction:column; justify-content:center; gap:8px; }
.year-month strong { color:var(--forest); font-family:"Fraunces",Georgia,serif; font-size:1.25rem; }
.year-month span { color:var(--muted); }
.timeline-entry:has(.timeline-photo) { grid-template-columns:74px 78px 1fr auto; }
.timeline-photo { width:78px; height:78px; border-radius:12px; object-fit:cover; }
.diary-photo-preview { display:grid; grid-template-columns:120px 1fr; gap:14px; align-items:center; margin:-8px 0 24px; }
.diary-photo-preview img { width:120px; height:100px; object-fit:cover; border-radius:12px; }
.compact-check { padding:10px 12px; margin-bottom:18px; }
.reminder-label { display:inline-block; margin-top:8px; color:var(--coral-dark); font-weight:800; }
.is-hidden { display:none!important; }
@media (max-width:980px) { .diary-tools { grid-template-columns:1fr; } .diary-menu { justify-content:flex-start; } .week-grid { grid-template-columns:repeat(4,1fr); } .year-grid { grid-template-columns:repeat(3,1fr); } }
@media (max-width:650px) { .week-grid,.year-grid { grid-template-columns:repeat(2,1fr); } .timeline-entry:has(.timeline-photo) { grid-template-columns:62px 64px 1fr; } .timeline-photo { width:64px;height:64px; } .timeline-entry:has(.timeline-photo) .timeline-actions { grid-column:3; } }
@media print { .topbar,.bottom-nav,.diary-tools,.calendar-toolbar button,.calendar-help,.timeline-actions,.page-head .btn,.privacy-note { display:none!important; } body,html { background:#fff!important; } main { max-width:none; padding:0; } .calendar-month { break-inside:avoid; } .timeline-entry { break-inside:avoid; } }

/* Simple control centre for people with low digital confidence */
.simple-home { max-width:980px; margin:auto; }
.simple-home > h1 { max-width:760px; }
.main-control-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; margin:38px 0 28px; }
.main-control { min-height:176px; padding:25px; border:2px solid var(--forest); border-radius:22px; background:var(--paper); color:var(--forest); cursor:pointer; text-align:left; display:grid; grid-template-columns:auto 1fr; grid-template-rows:auto auto; column-gap:18px; align-content:center; }
.main-control > span { grid-row:1/3; align-self:center; width:58px; height:58px; border-radius:50%; background:var(--sage); display:grid; place-items:center; font-size:2rem; }
.main-control strong { font:700 clamp(1.45rem,3vw,2rem) "Fraunces",Georgia,serif; }
.main-control small { font-size:1rem; margin-top:6px; }
.main-control.primary { background:var(--coral); color:var(--paper); border-color:var(--coral-dark); }
.main-control.dark { background:var(--forest); color:var(--paper); }
.main-control.primary > span,.main-control.dark > span { background:rgba(255,255,255,.2); }
.next-plan { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:24px; border-radius:20px; background:var(--sun); margin:20px 0; }
.next-plan h2,.next-plan p { margin-bottom:6px; }
.home-links { display:flex; flex-wrap:wrap; gap:12px 22px; justify-content:center; padding:20px 0; }
.control-quick { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:38px; }
.control-quick button { min-height:110px; padding:18px; border:1px solid var(--forest); border-radius:16px; background:var(--paper); text-align:left; cursor:pointer; }
.control-quick strong,.control-quick span { display:block; }
.control-quick strong { color:var(--forest); font-size:1.15rem; margin-bottom:7px; }
.control-section { margin:34px 0; }
.control-section h2 { font-size:clamp(1.7rem,4vw,2.5rem); }
.control-plan { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:20px 0; border-top:1px solid var(--line); }
.control-plan:last-child { border-bottom:1px solid var(--line); }
.control-plan h3 { margin:9px 0 4px; }
.control-plan p { margin:0; color:var(--muted); }
@media (max-width:700px) { .main-control-grid,.control-quick { grid-template-columns:1fr; } .main-control { min-height:138px; } .next-plan,.control-plan { align-items:flex-start; flex-direction:column; } .control-plan .btn { width:100%; } }
html.large-text .main-control-grid,html.large-text .control-quick { grid-template-columns:1fr; }
html.high-contrast .main-control,.control-quick button { border-width:2px; }

/* Keep every intended circle perfectly round at all text sizes and app widths. */
.brand-mark,
.profile-chip,
.bottom-nav .nav-create span,
.avatar,
.modal-close,
.welcome-reassurance span,
.comfort-row article > span,
.my-location-dot,
.profile-photo,
.main-control > span {
  aspect-ratio:1 / 1;
  flex:none;
  flex-shrink:0;
  min-width:var(--circle-size);
  width:var(--circle-size);
  max-width:var(--circle-size);
  min-height:var(--circle-size);
  height:var(--circle-size);
  max-height:var(--circle-size);
  padding:0;
  border-radius:50%;
  line-height:1;
  overflow:hidden;
}
.brand-mark { --circle-size:36px; }
.profile-chip { --circle-size:42px; }
.bottom-nav .nav-create span { --circle-size:38px; }
.avatar { --circle-size:54px; }
.person-card .avatar { --circle-size:72px; }
.modal-close { --circle-size:44px; display:grid; place-items:center; }
.welcome-reassurance span { --circle-size:34px; }
.comfort-row article > span { --circle-size:36px; }
.my-location-dot { --circle-size:20px; }
.profile-photo { --circle-size:150px; }
.main-control > span { --circle-size:58px; }
.plan-dot,.diary-dot,.cal-cell.has-plan::after {
  aspect-ratio:1 / 1;
  flex:none;
  flex-shrink:0;
  min-width:var(--dot-size,8px);
  width:var(--dot-size,8px);
  min-height:var(--dot-size,8px);
  height:var(--dot-size,8px);
  border-radius:50%;
  padding:0;
}
.cal-cell.has-plan::after { --dot-size:6px; }
.area-ring { aspect-ratio:1 / 1; height:auto; max-height:210px; flex:none; }
.modal-head > :first-child { min-width:0; }
.modal-head .modal-close { align-self:flex-start; }
@media (max-width:430px) {
  .modal { padding:22px 18px; }
  .modal-head { gap:12px; }
}

/* Simplified core journey and optional tools */
.simple-filter-note { display:flex; justify-content:space-between; gap:18px; align-items:center; padding:15px 18px; margin:-12px 0 24px; border-radius:14px; background:var(--sage); color:var(--forest); }
.simple-filter-note span { color:var(--muted); text-align:right; }
.notification-list { display:grid; border-top:1px solid var(--line); }
.notification-list article { display:grid; grid-template-columns:auto 1fr auto; gap:15px; align-items:center; padding:19px 0; border-bottom:1px solid var(--line); }
.notification-list article > span { color:var(--coral); }
.notification-list strong,.notification-list small { display:block; }
.notification-list small { margin-top:6px; color:var(--muted); }
.more-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.more-grid section { padding:24px; border:1px solid var(--line); border-radius:var(--radius); background:var(--paper); }
.more-grid h2 { font-size:clamp(1.55rem,3vw,2.1rem); }
.more-grid section > button { width:100%; min-height:76px; margin-top:9px; padding:14px 16px; border:1px solid var(--line); border-radius:14px; background:var(--cream); text-align:left; cursor:pointer; }
.more-grid section > button strong,.more-grid section > button span { display:block; }
.more-grid section > button strong { color:var(--forest); font-size:1.05rem; }
.more-grid section > button span { margin-top:4px; color:var(--muted); }
@media (max-width:700px) { .simple-filter-note { align-items:flex-start; flex-direction:column; } .simple-filter-note span { text-align:left; } .notification-list article { grid-template-columns:auto 1fr; } .notification-list article .btn { grid-column:2; justify-self:start; } .more-grid { grid-template-columns:1fr; } }
.advanced-details { margin:8px 0 24px; padding:16px; border:1px solid var(--line); border-radius:14px; background:var(--paper); }
.advanced-details summary { cursor:pointer; color:var(--forest); font-weight:800; }
.advanced-details[open] summary { margin-bottom:22px; }

/* Automatic Home activity carousel */
.home-intro { display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,430px); gap:clamp(26px,5vw,64px); align-items:center; }
.home-intro-copy { min-width:0; }
.home-activity-carousel { min-width:0; }
.carousel-picture { position:relative; display:block; width:100%; padding:0; overflow:hidden; border:0; border-radius:30px 30px 30px 8px; background:var(--paper); box-shadow:var(--shadow); cursor:pointer; text-align:left; }
.carousel-picture img { display:block; width:100%; aspect-ratio:9 / 6.5; object-fit:cover; transition:transform .35s ease; }
.carousel-picture:hover img { transform:scale(1.015); }
.carousel-label { position:absolute; inset:auto 12px 12px; padding:13px 15px; border-radius:15px; background:rgba(255,253,248,.94); color:var(--forest); backdrop-filter:blur(5px); }
.carousel-label span,.carousel-label strong,.carousel-label small,.carousel-label b { display:block; }
.carousel-label span { color:var(--coral-dark); font-size:.72rem; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.carousel-label strong { margin:3px 0; font:700 1.2rem "Fraunces",Georgia,serif; }
.carousel-label small { overflow:hidden; color:var(--muted); text-overflow:ellipsis; white-space:nowrap; }
.carousel-label b { margin-top:8px; color:var(--forest-2); font-size:.9rem; text-decoration:underline; text-underline-offset:3px; }
html.high-contrast .carousel-label { border:2px solid #000; background:var(--paper); }
@media (prefers-reduced-motion:reduce) { .carousel-picture img { transition:none; } }
@media (max-width:780px) { .home-intro { grid-template-columns:1fr; } .home-activity-carousel { width:100%; max-width:520px; } }