/*
 * Winchburgh Wombles 1.6 — the shared browser and Android visual system.
 * Loaded after app.css. Layout and component hooks retain the existing API,
 * forms, maps and management workflows. No remote assets are required.
 */

:root {
  --green: #20563f;
  --green-deep: #123b2d;
  --green-light: #edf4e8;
  --green-bright: #3d744c;
  --orange: #c45218;
  --orange-dark: #94400f;
  --orange-light: #fff0e3;
  --ink: #203e32;
  --muted: #596a60;
  --line: #dce6dc;
  --paper: #f1f5ee;
  --white: #fff;
  --red: #a22c36;
  --red-bg: #fff0f1;
  --yellow: #fff5d9;
  --radius: 24px;
  --side: 256px;
  --shadow: 0 3px 5px #173c2703, 0 12px 28px #173c2707, 0 1px 0 #ffffff inset;
  --shadow-raised: 0 7px 18px #173c2709, 0 24px 48px #173c270b;
  --lime: #d1ee91;
  --focus: #9d4a17;
  --dock-space: 112px;
}

html { scroll-padding-top: 108px; }
body {
  background: #f3f5ef;
  background: radial-gradient(ellipse at 100% 0, #e4efdf 0, transparent 36rem),
    radial-gradient(ellipse at 12% 95%, #fbf4e8 0, transparent 34rem), #f3f5ef;
  color: var(--ink);
  font-size: 15px;
  letter-spacing: -.12px;
}
::selection { color: #173c2b; background: #d1ee91; }
h1 { font-size: clamp(29px, 2.7vw, 38px); letter-spacing: -1.25px; font-weight: 780; }
h2 { letter-spacing: -.55px; }
h3 { letter-spacing: -.2px; }
button, input, select, textarea { letter-spacing: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
img, svg { max-width: 100%; }
.workspace { min-width: 0; }
.page { max-width: 1480px; padding: 34px 38px 38px; }
.page-head { margin-bottom: 28px; gap: 22px; }
.page-head p { font-size: 13px; line-height: 1.75; }
.page-head .eyebrow { margin-bottom: 9px; }
.eyebrow { font-size: 10px; font-weight: 800; letter-spacing: 1.8px; }
.page-footer { color: var(--muted); padding-top: 34px; font-size: 11px; line-height: 1.75; }
.page-footer a { text-decoration: underline; text-underline-offset: 4px; }
.hub-version { font-size: 10px; color: var(--muted); }

/* A focused desktop workspace, with a separate scrollable navigation region. */
.sidebar {
  padding: 29px 19px 20px;
  color: #f3f8ec;
  background: #183e30;
  background: radial-gradient(ellipse at 10% 0, #32684b 0, transparent 55%),
    linear-gradient(165deg, #204b37, #153b2d 62%, #123327);
  border: 0;
  box-shadow: 12px 0 40px #173b2407;
  overflow: hidden;
}
.sidebar-brand { padding: 0 6px 26px; flex: none; }
.sidebar .brand { color: #fff; gap: 11px; }
.sidebar .brand img {
  width: 51px; height: 51px; border-radius: 50%;
  box-shadow: 0 0 0 4px #ffffff0c, 0 6px 18px #09271f33;
}
.sidebar .brand-name { font-size: 17px; letter-spacing: -.45px; }
.sidebar .brand small { color: #bfceb9; letter-spacing: 1.7px; font-size: 9px; }
.sidebar-navigation { min-height: 0; overflow-y: auto; padding: 0 5px 16px; margin: 0 -5px; scrollbar-width: thin; scrollbar-color: #63876c transparent; }
.sidebar-navigation::-webkit-scrollbar { width: 5px; }
.sidebar-navigation::-webkit-scrollbar-thumb { background: #63876c; border-radius: 8px; }
.nav-label { padding: 22px 14px 10px; color: #a8bfa7; font-size: 9px; letter-spacing: 1.7px; }
.nav-primary-label { padding-top: 0; }
.nav-list { gap: 7px; }
.nav-link {
  color: #d7e4d3; min-height: 45px; padding: 12px 14px; gap: 12px;
  font-size: 13px; font-weight: 600; border-radius: 13px;
  transition: color .18s, background .18s, box-shadow .18s;
}
.nav-link svg { width: 19px; height: 19px; opacity: .85; }
.nav-link:hover { background: #ffffff0d; color: #fff; }
.nav-link.active {
  color: #153b2b; background: #d3ed9b;
  background: linear-gradient(115deg, #d9f0aa, #c7e78e);
  box-shadow: 0 4px 12px #0a2a2033, 0 1px 0 #ffffff66 inset;
  font-weight: 750;
}
.nav-link.active svg { opacity: 1; }
.nav-link.active::after { background: #315a36; right: 13px; width: 4px; height: 4px; }
.nav-link.pick-nav {
  color: #ffd0ab; background: #ffffff0a; border: 1px solid #ffffff14;
  margin: 5px 0; box-shadow: 0 1px 0 #ffffff05 inset;
}
.nav-link.pick-nav:hover { background: #ffffff12; color: #ffe8d6; }
.nav-link.pick-nav.active { color: #fff; background: linear-gradient(120deg, #c45319, #ad420e); border-color: #e7854640; }
.nav-link.pick-nav.active::after { background: #fff; }
.sidebar-management { display: grid; gap: 4px; }
.sidebar-management .nav-link { min-height: 39px; font-size: 12px; padding: 9px 13px; border-radius: 11px; }
.sidebar-management .nav-link svg { width: 17px; height: 17px; }
.sidebar-community { margin-bottom: 5px; }
.sidebar-bottom { padding-top: 18px; flex: none; }
.sidebar-note { background: #ffffff08; border-color: #ffffff15; color: #c3d3bc; border-radius: 17px; line-height: 1.7; font-size: 11px; }
.sidebar-note strong { color: #e2f0d0; font-size: 12px; }
.sidebar-links { padding: 16px 7px 0; gap: 14px; font-size: 10px; }
.sidebar-links a { color: #c3d2bc; }
.sidebar-profile {
  display: flex; align-items: center; gap: 11px; min-width: 0;
  color: #fff; background: #ffffff09; border: 1px solid #ffffff17;
  border-radius: 17px; padding: 12px; box-shadow: 0 1px 0 #ffffff05 inset;
}
.sidebar-profile .avatar { width: 37px; height: 37px; color: #203e2c; background: #d4e9b6; border: 1px solid #ffffff70; }
.sidebar-profile > div, .sidebar-profile-copy { min-width: 0; flex: 1; }
.sidebar-profile strong { display: block; font-size: 12px; font-weight: 650; overflow-wrap: anywhere; }
.sidebar-profile small, .sidebar-profile span:not(.avatar) { font-size: 10px; color: #becfb5; display: block; margin-top: 3px; }
.sidebar-profile > svg { width: 16px; height: 16px; color: #b7cfac; flex: none; }

.topbar {
  height: 83px; padding: 0 38px; position: sticky; top: 0; z-index: 25;
  background: #f7f9f3; background: #f7f9f3e8;
  border-bottom: 1px solid #dce5d9aa; backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px); box-shadow: 0 3px 12px #24433002;
}
.topbar-context { display: flex; align-items: center; gap: 10px; color: #607463; min-width: 0; font-size: 12px; }
.topbar-context svg { width: 16px; height: 16px; color: #698466; }
.topbar-context strong { color: var(--ink); font-size: 12px; font-weight: 700; }
.topbar-context .context-divider { color: #aab7a5; }
.topbar-title { color: #617764; font-size: 12px; }
.topbar-right { gap: 16px; flex: none; }
.topbar-right .user-button { gap: 10px; font-size: 12px; }
.avatar svg { width: 18px; height: 18px; }
.avatar { border: 1px solid #d5e4c9; color: #2d5b3b; background: linear-gradient(145deg, #eaf4da, #dce9cd); box-shadow: 0 2px 5px #163d2705; }
.user-button .avatar { width: 39px; height: 39px; }
.topbar .btn { min-height: 39px; border-radius: 12px; font-size: 12px; }

/* Buttons and elevated surfaces. Hover treatment only suggests real actions. */
.btn {
  min-height: 45px; padding: 11px 17px; border-radius: 13px;
  font-size: 12px; letter-spacing: -.05px; font-weight: 750;
  box-shadow: 0 1px 0 #ffffff18 inset;
  transition: background .18s, border-color .18s, box-shadow .18s, transform .18s;
}
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn-primary { background: #bd4b13; background: linear-gradient(130deg, #c45319, #ad410c); border-color: #a23d1120; color: #fff; box-shadow: 0 5px 12px #b149171f, 0 1px 0 #ffffff20 inset; }
.btn-primary:hover { background: #af4310; box-shadow: 0 7px 15px #b1491729; }
.btn-green { background: #24563d; background: linear-gradient(130deg, #2c6346, #1b4834); border-color: #153f2c40; color: #fff; box-shadow: 0 5px 12px #1c4c3520, 0 1px 0 #ffffff18 inset; }
.btn-green:hover { background: #1c4833; box-shadow: 0 7px 16px #1c4c352c; }
.btn-secondary, .btn-white { background: #fff; border-color: #dce5d6; color: #2b5339; box-shadow: 0 2px 4px #20402c05, 0 1px 0 #fff inset; }
.btn-secondary:hover, .btn-white:hover { background: #f5f9ee; border-color: #c5d7b9; box-shadow: 0 4px 10px #20402c0b; }
.btn-ghost { box-shadow: none; }
.btn-ghost:hover { background: #eaf0e3; box-shadow: none; }
.btn-danger { background: #fff1ef; border-color: #eccbc8; color: #9d2e32; box-shadow: 0 2px 4px #5b1b1f04; }
.btn-small { min-height: 38px; padding: 8px 12px; font-size: 11px; border-radius: 11px; }
.btn:disabled { transform: none; box-shadow: none; }
.icon-btn { width: 39px; height: 39px; border-radius: 12px; background: #fff; border-color: #dce5d8; }
.card, .stat-card, .admin-tile { border: 1px solid #dde6d9; background: #fff; border-radius: var(--radius); box-shadow: var(--shadow); }
.card { padding: 25px; }
.card-head { margin-bottom: 21px; }
.card-head h2 { font-size: 18px; font-weight: 750; }
.card-head p { font-size: 12px; line-height: 1.7; }
.card-head-icon { width: 40px; height: 40px; border-radius: 13px; color: #3b6d43; background: #eef4e6; border: 1px solid #e1ebd6; }
.card-head-icon svg { width: 21px; height: 21px; }
.section-heading h2 { font-size: 20px; font-weight: 750; }
.section-heading p { font-size: 12px; line-height: 1.65; }
.section-heading { margin: 29px 0 17px; }

/* Community home: a real welcome, a visual place to begin and personal totals. */
.home-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 26px; }
.home-heading > div { min-width: 0; }
.home-heading .eyebrow { margin-bottom: 7px; color: #53664e; }
.home-heading h1 { font-size: clamp(26px, 2.4vw, 34px); line-height: 1.25; overflow-wrap: anywhere; }
.home-heading p { font-size: 13px; color: var(--muted); margin-top: 7px; line-height: 1.7; }
.home-date, .date-badge { display: inline-flex; align-items: center; gap: 8px; padding: 9px 12px; border: 1px solid #dde6d6; background: #ffffffb3; border-radius: 12px; font-size: 11px; color: #62725b; white-space: nowrap; }
.home-date svg, .date-badge svg { width: 16px; height: 16px; }
.home-stage { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(290px, .95fr); gap: 22px; margin-bottom: 23px; }
.hero.hero-v160 {
  align-items: flex-start; min-height: 357px; margin: 0; padding: 35px 34px;
  border-radius: 28px; border: 1px solid #2e5e4129;
  background: #214b35;
  background: radial-gradient(ellipse at 92% 0, #4c7d504d, transparent 65%),
    linear-gradient(125deg, #264f38 0, #1a4632 60%, #123e2b 100%);
  box-shadow: 0 14px 30px #193e271a, 0 2px 0 #ffffff10 inset;
  isolation: isolate;
}
.hero.hero-v160::before { content: ""; position: absolute; width: 350px; height: 350px; right: -170px; top: -190px; border: 58px solid #d2ef9d09; border-radius: 50%; z-index: -1; }
.hero.hero-v160::after { width: 340px; height: 340px; top: auto; bottom: -260px; right: 5%; border: 70px solid #b5e1920a; z-index: -1; }
.hero-v160 .hero-copy { width: 100%; max-width: 590px; }
.hero-v160 .eyebrow { color: #d3e7b1; font-size: 9px; letter-spacing: 1.7px; margin-bottom: 16px; }
.hero-v160 .hero-title, .hero-v160 h1 { color: #fff; font-size: clamp(31px, 3.2vw, 46px); line-height: 1.08; letter-spacing: -1.65px; font-weight: 780; max-width: 440px; }
.hero-v160 .hero-title em, .hero-v160 .hero-title span { color: #d7edb1; font-style: normal; }
.hero-v160 p { max-width: 400px; font-size: 13px; color: #d0dfc8; line-height: 1.75; margin: 15px 0 22px; }
.hero-v160 .btn-primary { background: #d4ee9f; background: linear-gradient(130deg, #e0f5b6, #c8e88c); border-color: #ecffd050; color: #1b432c; box-shadow: 0 6px 16px #0c2c2652, 0 1px 0 #f6ffe0 inset; }
.hero-v160 .btn-primary:hover { background: #e1f4bc; box-shadow: 0 8px 20px #0c2c2666; }
.hero-v160 .btn-secondary, .hero-v160 .btn-ghost { border-color: #e1f3d52b; background: #ffffff0b; color: #e9f3df; box-shadow: none; }
.hero-v160 .btn-secondary:hover, .hero-v160 .btn-ghost:hover { background: #ffffff17; }
.hero-v160 .village-art { position: absolute; width: 72%; height: auto; max-width: 450px; bottom: -3px; right: -24px; opacity: .56; z-index: 0; pointer-events: none; }
.hero-promise { display: inline-flex; align-items: center; gap: 7px; font-size: 10px; font-weight: 600; color: #d2e3c7; }
.hero-promise svg { width: 15px; height: 15px; color: #d3ebaa; }
.hero-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-top: 24px; font-size: 10px; color: #d0e2c4; }
.hero-meta span { display: inline-flex; align-items: center; gap: 6px; }
.hero-meta svg { width: 14px; height: 14px; }
.home-personal {
  position: relative; overflow: hidden; display: flex; flex-direction: column; align-items: stretch;
  padding: 24px; margin: 0; min-width: 0;
  background: #fff; background: radial-gradient(ellipse at 50% 43%, #f5f9ee 0, transparent 70%), #fff;
  border: 1px solid #dce6d4; border-radius: 28px; box-shadow: var(--shadow);
}
.home-personal .card-head { margin-bottom: 8px; }
.home-personal .card-head h2 { font-size: 17px; }
.home-personal .eyebrow { font-size: 9px; color: #60744f; letter-spacing: 1.6px; }
.home-personal > p { font-size: 12px; color: var(--muted); line-height: 1.7; }
.personal-orbit {
  width: 157px; height: 157px; margin: 11px auto 16px;
  border: 11px solid #e6efd9; border-radius: 50%; display: grid; place-items: center;
  background: #f9fcf4; box-shadow: 0 0 0 1px #d9e6c7, 0 7px 20px #3d6b2d0b, 0 0 0 6px #f5f8ed;
  flex: none; position: relative;
}
.personal-orbit-core { text-align: center; padding: 10px; min-width: 0; }
.personal-orbit-core strong { display: block; font-size: 40px; font-weight: 800; line-height: 1; color: #294f32; letter-spacing: -1.8px; overflow-wrap: anywhere; }
.personal-orbit-core span { display: block; font-size: 10px; line-height: 1.5; margin-top: 7px; color: #65795c; }
.personal-orbit-core svg { width: 18px; height: 18px; color: #6f9157; margin-bottom: 6px; }
.personal-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0 0 15px; }
.personal-metrics > div { text-align: center; min-width: 0; padding: 2px 8px; }
.personal-metrics > div + div { border-left: 1px solid #e3eadc; }
.personal-metrics strong { display: block; font-size: 22px; letter-spacing: -.6px; font-weight: 750; }
.personal-metrics span, .personal-metrics dt { display: block; font-size: 10px; color: var(--muted); margin-top: 4px; }
.personal-metrics dd { margin: 0; }
.personal-latest, .latest-pick { border-top: 1px solid #e3eadc; padding-top: 14px; margin-top: auto; display: flex; align-items: flex-start; gap: 9px; font-size: 11px; color: var(--muted); line-height: 1.65; }
.personal-latest svg, .latest-pick svg { width: 17px; height: 17px; color: #648853; flex: none; margin-top: 2px; }
.personal-latest strong, .latest-pick strong { color: #3b5b40; font-weight: 650; }
.home-personal > .btn { margin-top: auto; }
.personal-guest { justify-content: center; }
.quick-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 0 0 31px; }
.quick-action { display: flex; align-items: center; gap: 13px; min-width: 0; min-height: 96px; padding: 19px; border: 1px solid #dce5d5; border-radius: 20px; background: #fff; box-shadow: 0 3px 6px #203f2303, 0 8px 20px #203f2305; color: var(--ink); transition: border-color .18s, box-shadow .18s, transform .18s; }
.quick-action:hover { border-color: #bccda9; box-shadow: 0 8px 22px #203f2310; transform: translateY(-2px); }
.quick-action-icon { width: 43px; height: 43px; flex: none; display: grid; place-items: center; background: #f9eee1; color: #a35322; border: 1px solid #efdfca; border-radius: 14px; }
.quick-action-icon svg { width: 22px; height: 22px; }
.quick-action:nth-child(2) .quick-action-icon { background: #eaf2e4; color: #527443; border-color: #dce8d1; }
.quick-action:nth-child(3) .quick-action-icon { background: #fcf4d8; color: #937127; border-color: #f0e6bb; }
.quick-action-copy { flex: 1; min-width: 0; }
.quick-action-copy strong { display: block; font-size: 13px; font-weight: 750; line-height: 1.4; }
.quick-action-copy span { display: block; margin-top: 4px; font-size: 11px; line-height: 1.5; color: var(--muted); }
.quick-action-arrow { width: 16px; height: 16px; color: #7d9070; flex: none; }
.impact-heading { margin-top: 0; }
.impact-heading .eyebrow { color: #53664e; margin-bottom: 6px; font-size: 9px; }
.period-control { font-size: 11px; }
.period-control input, .period-control select { min-height: 42px; border-radius: 12px; border-color: #7b8a71; box-shadow: 0 2px 4px #193b2304; font-size: 12px; }
.stats-grid { gap: 17px; margin-bottom: 26px; }
.stat-card { padding: 21px 22px 19px; border-radius: 21px; position: relative; background: linear-gradient(150deg, #fff 64%, #f6faef); }
.stat-card:nth-child(2) { background: linear-gradient(150deg, #fff 64%, #fff7ee); }
.stat-card:nth-child(3) { background: linear-gradient(150deg, #fff 64%, #faf8e8); }
.stat-card:nth-child(4) { background: linear-gradient(150deg, #fff 64%, #f0f6f2); }
.stat-top { margin-bottom: 16px; }
.stat-icon { width: 38px; height: 38px; border-radius: 12px; background: #ecf3e4; border: 1px solid #dfe8d5; color: #487147; box-shadow: 0 2px 4px #183c2604, 0 1px 0 #fff inset; }
.stat-icon svg { width: 20px; height: 20px; }
.stat-card:nth-child(2) .stat-icon { background: #fff0e4; border-color: #f2dfca; color: #a35a25; }
.stat-card:nth-child(3) .stat-icon { background: #f8f4df; border-color: #eae4c8; color: #8b7834; }
.stat-card:nth-child(4) .stat-icon { background: #edf3ef; border-color: #dde8df; color: #4f7362; }
.stat-number { font-size: clamp(30px, 2.6vw, 39px); letter-spacing: -1.4px; font-weight: 780; font-variant-numeric: tabular-nums; }
.stat-label { font-size: 12px; font-weight: 650; margin-top: 7px; }
.stat-context { color: #65765e; font-size: 10px; margin-top: 7px; }
.stat-top .eyebrow { font-size: 9px; color: #65765a; }
.dashboard-grid { gap: 23px; grid-template-columns: minmax(0, 1.14fr) minmax(0, 1fr); }
.list-row { padding: 17px 0; border-color: #e8ede3; }
.list-main strong { font-size: 13px; }
.list-main p { line-height: 1.6; color: #697b63; }
.list-value strong { font-size: 21px; letter-spacing: -.7px; color: #2d5637; }
.rank.top { background: #fff1cf; color: #8b6622; border: 1px solid #eddfb3; box-shadow: 0 2px 4px #8b662208; }
.rank { color: #627356; }
.activity-icon { background: #eef3e3; color: #668047; border: 1px solid #e3eacf; border-radius: 11px; height: 35px; width: 35px; }
.activity-list .list-main strong { line-height: 1.65; }
.bar-track { background: #edf2e6; height: 7px; box-shadow: 0 1px 2px #1b402509 inset; }
.bar-fill { background: linear-gradient(90deg, #729858, #abc779); }
.area-line { font-size: 12px; margin-bottom: 9px; }
.area-date { font-size: 10px; margin-top: 7px; }
.mini-stat { background: #f4f7ed; border: 1px solid #e7eddf; border-radius: 15px; padding: 17px; }
.mini-stat strong { color: #365c3c; font-size: 25px; }
.mini-stat span { font-size: 11px; }
.welcome-strip { background: linear-gradient(120deg, #edf3e1, #f7f7e9); border-color: #dbe5c8; box-shadow: 0 1px 0 #fff inset; border-radius: 22px; padding: 24px; }
.empty-icon { background: linear-gradient(145deg, #f3f8e9, #e7f0dc); border: 1px solid #dce8d0; border-radius: 18px; box-shadow: 0 5px 12px #2d5a2d08; }
.empty-state p { font-size: 12px; line-height: 1.75; }

/* The form system is tactile, but labels and selection states remain explicit. */
.form-layout { gap: 25px; }
.form-card { padding: 29px; }
.form-section { padding-bottom: 27px; margin-bottom: 27px; }
.form-section-title { margin-bottom: 21px; }
.step-number { width: 30px; height: 30px; border-radius: 10px; background: #edf3e2; border: 1px solid #dce7cc; color: #4c6d3b; font-size: 12px; box-shadow: 0 1px 0 #fff inset; }
.form-section h2 { font-size: 17px; }
.form-grid { gap: 19px; }
.field { gap: 8px; }
.field label, .field-label { color: #385340; font-size: 12px; font-weight: 700; }
.field input, .field select, .field textarea, .search-input {
  min-height: 48px; background: #fcfdf9; border: 1px solid #7b8a71;
  border-radius: 12px; padding: 12px 14px; color: #284432;
  box-shadow: 0 2px 3px #1e3f2503 inset, 0 1px 0 #fff;
  transition: background .16s, border-color .16s, box-shadow .16s;
}
.field input:hover, .field select:hover, .field textarea:hover, .search-input:hover { border-color: #66785f; }
.field input:focus, .field select:focus, .field textarea:focus, .search-input:focus { background: #fff; border-color: #73945b; box-shadow: 0 0 0 4px #99ba6f23; }
.field input::placeholder, .field textarea::placeholder, .search-input::placeholder { color: #65765d; opacity: 1; }
.field textarea { line-height: 1.7; }
.field-hint { font-size: 11px; line-height: 1.7; }
.check-row { font-size: 12px; line-height: 1.75; gap: 11px; padding: 8px 0; }
.check-row input { width: 19px; height: 19px; margin-top: 1px; }
.input-unit > span { top: 14px; }
.input-unit input { padding-right: 70px; }
.stepper { min-height: 48px; border-radius: 12px; border-color: #7b8a71; background: #fff; }
.stepper button { min-width: 45px; height: 47px; background: #f1f5e9; }
.stepper button:hover { background: #e7efd9; }
.stepper input { min-height: 46px; }
.notice, .form-error { border-radius: 15px; padding: 15px 17px; box-shadow: 0 1px 0 #ffffff77 inset; font-size: 12px; }
.notice { background: #eef5e6; border-color: #d9e6c7; color: #385931; }
.notice.warning { background: #fff7e0; border-color: #ecdfb8; color: #785e24; }
.form-error { background: #fff0ef; border-color: #eed3cf; }
.form-end { padding-top: 6px; margin-top: 18px; }
.summary-panel { background: radial-gradient(ellipse at 100% 0, #52774a55, transparent 75%), linear-gradient(150deg, #2c583d, #1b4631); border: 1px solid #244d350f; box-shadow: 0 9px 23px #234b2f18; border-radius: 24px; padding: 28px; }
.summary-panel h2 { color: #fff; font-size: 19px; }
.summary-panel p { color: #d7e4ca; font-size: 12px; }
.summary-panel dt { color: #d5e2c8; }
.summary-panel dd { color: #e6f1d5; font-size: 14px; }
.summary-panel dl { border-color: #ffffff25; }
.area-choices { background: #f5f8ee; border-color: #dfe7d5; border-radius: 16px; padding: 10px; gap: 8px; }
.area-choice { border: 1px solid #e3ead9; border-radius: 11px; min-height: 44px; padding: 10px 11px; font-size: 12px; }
.area-choice:has(input:checked) { background: #e5efd5; border-color: #9dba7f; box-shadow: 0 0 0 1px #bacd9b44; }
.chip { border-radius: 10px; border: 1px solid #d4e2c3; background: #edf3e1; }
.place-chip .chip-name, .place-chip .chip-remove { min-height: 36px; }
.place-chip .chip-remove { min-width: 34px; }
.place-choice-button { border-radius: 11px; min-height: 45px; padding: 11px 13px; }
.place-choice-button:hover { background: #f0f6e6; border-color: #c3d6ac; }
.place-feedback { border-radius: 14px; background: #eff6e8; border-color: #d7e5c7; padding: 14px 15px; }
.place-feedback.choice { background: #fff7e6; border-color: #eadbb9; }
.pick-map, .coverage-map { border-radius: 20px; border: 1px solid #d3dfc9; box-shadow: 0 3px 9px #26402908, 0 1px 0 #fff inset; background: #edf2e6; }
.pick-map { height: 330px; }
.coverage-map { height: 580px; }
.leaflet-control-zoom { border: 1px solid #d7e1cc !important; border-radius: 12px !important; box-shadow: 0 5px 16px #1e39251a !important; overflow: hidden; }
.leaflet-control-zoom a { color: #34543a !important; background: #fffef9 !important; width: 35px !important; height: 35px !important; line-height: 35px !important; }
.leaflet-control-attribution { border-radius: 5px 0 0 0; }
.leaflet-popup-content-wrapper { border-radius: 15px; box-shadow: 0 8px 24px #183b2626; }
.map-layout { gap: 25px; }
.map-banner { border-radius: 20px; background: #fffefa; border-color: #e0e6d4; box-shadow: var(--shadow); padding: 19px 22px; }
.map-area-item { padding: 16px 0; }
.map-area-item strong { font-size: 13px; }
.map-area-item small { line-height: 1.65; }
.map-key { font-size: 11px; line-height: 1.6; }

/* A warm, distinct Sun Token surface. Values and progress come from the API. */
.reward-feature { border-radius: 28px; padding: 32px; gap: 29px; background: radial-gradient(ellipse at 95% 0, #fff3c2, transparent 75%), linear-gradient(125deg, #fff9e8, #fcf5e1); border-color: #eadfb9; box-shadow: 0 1px 0 #fff inset, 0 10px 26px #7d62230b; }
.reward-feature h2 { font-size: 30px; line-height: 1.2; letter-spacing: -.9px; color: #4d542d; }
.reward-feature .eyebrow { color: #856827; }
.reward-feature p { color: #746f53; }
.reward-feature .sun-icon { width: 58px; height: 58px; border-radius: 19px; background: linear-gradient(145deg, #ffdf87, #f2c35d); color: #76531e; border: 1px solid #e8bc5666; box-shadow: 0 6px 14px #ad7d201a, 0 1px 0 #fff6d5 inset; }
.reward-feature .sun-icon svg { width: 31px; height: 31px; }
.reward-progress { background: #fffef8; border: 1px solid #e8dfc5; border-radius: 23px; padding: 27px; box-shadow: 0 7px 21px #8b6d2a0a, 0 1px 0 #fff inset; }
.token-total > strong { font-size: 57px; color: #3b5330; font-weight: 800; letter-spacing: -2px; }
.token-total > span { color: #4d6241; font-size: 13px; }
.token-recorded-time { border-color: #ece7d3; }
.token-progress-label strong { color: #49613a; }
.progress-track { background: #f0edda; height: 11px; box-shadow: 0 1px 3px #74642c0b inset; }
.progress-fill { background: linear-gradient(90deg, #c78f38, #e2b54e); box-shadow: 0 1px 0 #fff3 inset; }
.token-examples { gap: 12px; }
.token-examples > div { background: #fffdf4; border-color: #e9e1c5; border-radius: 15px; padding: 17px 12px; box-shadow: 0 3px 7px #755d2005; }
.token-examples strong { font-size: 18px; }
.fixed-token-rule { border-radius: 17px; background: #f0f5e6; border-color: #dce5ca; padding: 21px; }
.fixed-token-rule strong { color: #3a5d34; }
.legacy-reward-feature { background: #f5f5ec; border-color: #e1e3d4; }
.legacy-reward-feature .reward-progress { background: #fffefa; }
.legacy-reward-feature .token-total > strong { font-size: 36px; }
.badge { border-radius: 7px; padding: 5px 9px; font-size: 10px; letter-spacing: .04px; background: #ebf3de; color: #42633a; }
.badge.orange { background: #fff0df; color: #94501d; }
.badge.grey { background: #edf1e8; color: #64715d; }
.badge.amber { background: #fff3cf; color: #826322; }
.badge.red { background: #fff0ed; color: #a43438; }

/* Account and household information. */
.account-top { background: radial-gradient(ellipse at 100% 20%, #53804f5e, transparent 70%), linear-gradient(115deg, #28513a, #1b4531); color: #f4f8ed; border: 1px solid #1c493014; border-radius: 26px; padding: 27px; box-shadow: 0 12px 27px #23462c17; }
.account-top .avatar { width: 63px; height: 63px; font-size: 21px; color: #31512e; background: #deedbe; border: 1px solid #f4ffdaaa; box-shadow: 0 4px 11px #09251f33; }
.account-top h2 { color: #fff; font-size: 23px; }
.account-top p { color: #cddfc2; overflow-wrap: anywhere; }
.account-top .btn { color: #eaf2e2; background: #ffffff0f; border-color: #ffffff29; }
.account-top .btn:hover { background: #ffffff1c; }
.account-grid { gap: 24px; }
.tab-bar, .module-nav { padding: 6px; border: 1px solid #dce6d1; background: #eaf0e1; border-radius: 15px; gap: 5px; }
.tab-link, .module-nav a { padding: 10px 15px; border-radius: 11px; min-height: 40px; color: #607254; font-size: 12px; }
.tab-link.active, .module-nav a.active { background: #fff; color: #2f5537; box-shadow: 0 2px 7px #24442e0b, 0 1px 0 #fff inset; }
.pick-history-card { background: #fff; border: 1px solid #e0e7d7; border-radius: 18px; padding: 20px; box-shadow: 0 3px 6px #203e2204; }
.pick-figures { gap: 10px; }
.pick-figures span { background: #f3f6ec; border-radius: 8px; padding: 6px 9px; color: #607251; }
.signup-details { gap: 21px 25px; }
.signup-details dt { font-size: 11px; color: #647658; }
.signup-details dd { color: #35553b; font-size: 13px; line-height: 1.75; }
.signup-private-note { border-radius: 13px; background: #f0f6e6; border: 1px solid #dfebd0; color: #49663b; padding: 14px 16px; font-size: 12px; }
.signup-kit-summary { border-top-color: #e0e7d8; padding-top: 24px; margin-top: 26px; }

/* The same design carries through the complete management workspace. */
.admin-header > span { width: 49px; height: 49px; border-radius: 16px; background: #e6efd7; border: 1px solid #d5e1c1; box-shadow: 0 4px 10px #37532a08, 0 1px 0 #fff inset; color: #446c3b; }
.management-page-head { margin-bottom: 27px; }
.management-page-head .eyebrow { color: #53664e; }
.management-intro { position: relative; overflow: hidden; background: linear-gradient(120deg, #2c563b, #18442f); color: #fff; border-radius: 27px; padding: 30px 32px; margin-bottom: 23px; box-shadow: 0 10px 26px #20462b16, 0 1px 0 #ffffff12 inset; }
.management-intro::after { content: ""; position: absolute; width: 260px; height: 260px; border: 45px solid #d4ee9e0b; border-radius: 50%; right: -95px; top: -100px; pointer-events: none; }
.management-intro h2 { font-size: 28px; line-height: 1.23; letter-spacing: -.9px; max-width: 650px; color: #fff; position: relative; z-index: 1; }
.management-intro .eyebrow { color: #cbe49d; margin-bottom: 10px; }
.management-intro p { font-size: 13px; line-height: 1.75; color: #d0e0c6; max-width: 650px; margin-top: 12px; position: relative; z-index: 1; }
.management-intro .btn { position: relative; z-index: 1; }
.management-intro .btn-secondary { background: #ffffff0f; border-color: #ffffff2c; color: #eef5e5; }
.management-shortcuts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; margin-bottom: 28px; }
.management-shortcut { display: flex; align-items: flex-start; gap: 13px; border: 1px solid #dce5d5; border-radius: 21px; padding: 22px; background: #fff; box-shadow: var(--shadow); color: var(--ink); min-width: 0; transition: border-color .18s, box-shadow .18s, transform .18s; }
.management-shortcut:hover { border-color: #c0d3af; box-shadow: 0 10px 23px #23442b0f; transform: translateY(-2px); }
.management-shortcut-icon { display: grid; place-items: center; width: 42px; height: 42px; flex: none; border-radius: 13px; border: 1px solid #dae6ca; background: #edf4e3; color: #53733e; }
.management-shortcut-icon svg { width: 22px; height: 22px; }
.management-shortcut:nth-child(2) .management-shortcut-icon { background: #fff1dd; border-color: #efdfbf; color: #99703a; }
.management-shortcut:nth-child(3) .management-shortcut-icon { background: #edf2ee; border-color: #d9e5db; color: #4c7561; }
.management-shortcut-copy { min-width: 0; flex: 1; }
.management-shortcut-copy strong { display: block; font-size: 13px; font-weight: 750; line-height: 1.45; }
.management-shortcut-copy span, .management-shortcut-copy p { display: block; font-size: 11px; line-height: 1.7; color: var(--muted); margin-top: 5px; }
.management-shortcut-arrow { width: 16px; height: 16px; flex: none; color: #81936f; margin-top: 3px; }
.admin-grid { gap: 18px; }
.admin-tile { padding: 25px; transition: transform .18s, box-shadow .18s, border-color .18s; }
.admin-tile:hover { background: #fff; border-color: #bed0aa; transform: translateY(-2px); box-shadow: var(--shadow-raised); }
.admin-tile .stat-icon { width: 43px; height: 43px; border-radius: 14px; margin-bottom: 19px; }
.admin-tile h3 { font-size: 16px; margin-bottom: 8px; }
.admin-tile p { font-size: 12px; line-height: 1.75; }
.admin-tile .arrow-link { font-size: 11px; margin-top: 20px; }
.management-switcher { display: none; margin: 0 0 24px; padding: 0; border: 1px solid #d6e1ca; background: #fffef9; border-radius: 16px; box-shadow: 0 3px 9px #27432c05; }
.management-switcher > summary { display: flex; align-items: center; justify-content: space-between; gap: 15px; cursor: pointer; list-style: none; min-height: 54px; padding: 14px 17px; color: #355736; font-size: 12px; font-weight: 700; }
.management-switcher > summary::-webkit-details-marker { display: none; }
.management-switcher > summary > span { min-width: 0; display: inline-flex; align-items: center; gap: 9px; }
.management-switcher > summary svg { width: 17px; height: 17px; flex: none; }
.management-switcher > summary small { font-size: 10px; color: #627452; font-weight: 500; }
.management-switcher[open] > summary { border-bottom: 1px solid #e2ead7; }
.management-switcher .admin-nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; margin: 0; padding: 12px; border: 0; overflow: visible; }
.management-switcher .admin-nav a { padding: 11px; border-radius: 10px; min-height: 44px; white-space: normal; font-size: 11px; gap: 8px; color: #59714e; }
.management-switcher .admin-nav a.active { background: #e5efd5; color: #35552f; border: 1px solid #d7e4c4; font-weight: 750; }
.management-switcher .admin-nav a:hover:not(.active) { background: #f2f6eb; }
.module-heading { margin: 10px 0 24px; }
.module-heading h2 { font-size: 25px; }
.module-icon { width: 50px; height: 50px; border: 1px solid #efdfc5; border-radius: 16px; background: #fff0df; color: #a1692f; box-shadow: 0 3px 7px #69501f05; }
.module-heading p { font-size: 12px; line-height: 1.7; }
.toolbar { gap: 14px; margin-bottom: 23px; }
.search-box input { padding-left: 39px; min-height: 45px; }
.search-box svg { top: 14px; }
.settings-actions { border-radius: 19px; background: #fffffff2; backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border-color: #d9e3cd; box-shadow: 0 8px 28px #26402914, 0 1px 0 #fff inset; padding: 17px 22px; }
.settings-grid { gap: 24px; }
.data-table { font-size: 12px; }
.table-wrap { border-radius: 14px; }
.data-table th { background: #f0f5e8; color: #5d6d50; padding: 13px 14px; font-size: 10px; letter-spacing: .65px; }
.data-table th:first-child { border-radius: 12px 0 0 12px; }
.data-table th:last-child { border-radius: 0 12px 12px 0; }
.data-table td { padding: 17px 14px; border-color: #e5ecdd; }
.data-table tbody tr:hover { background: #fafcf6; }
.data-table td strong { font-size: 12px; }
.data-table td small { font-size: 11px; }
.data-table .btn-small { min-height: 36px; }
.person-option, .area-edit-row { border-radius: 16px; border-color: #dde6d4; box-shadow: 0 2px 4px #1f402703; }
.person-option:hover { background: #f2f7e9; border-color: #b9cf9f; }
.admin-selected { background: #edf4e2; border: 1px solid #dae5c8; border-radius: 16px; padding: 17px; }
.record-facts dt { font-size: 11px; color: #65765a; }
.record-facts dd { font-size: 13px; color: #38543c; }
.document-banner { background: #eff5e6; border-color: #d9e5ca; border-radius: 19px; padding: 21px 24px; }
.document-row-icon { background: #eff4e6; border: 1px solid #e1e9d5; border-radius: 12px; color: #557343; }
.saved-document-row { background: #fff; border-color: #e0e7d7; border-radius: 15px; padding: 17px 16px; }
.saved-document-row:hover, .saved-document-row.selected { background: #f5f9ed; border-color: #bacfa4; }
.invoice-sheet { border-radius: 24px; }
.invoice-total { background: #f2f6e9; border-radius: 14px; }
.invoice-total strong { color: #365932; }
.dialog-summary { border-radius: 16px; border-color: #dae5cd; background: #f4f8ed; }
.export-box { border-radius: 17px; background: #fbfdf7; border-color: #e1e8d6; }
.pagination { padding-top: 21px; border-color: #dfe7d4; }
.readiness-panel { border-radius: 19px; background: #fff5e8; border-color: #ebdbbd; box-shadow: 0 1px 0 #fff inset; padding: 21px 23px; }
.readiness-panel.ready { background: #f0f6e6; border-color: #d6e4c5; }
.readiness-icon { border-radius: 11px; border: 1px solid #f0d5b2; background: #ffe9ca; }
.readiness-panel.ready .readiness-icon { background: #e2efce; border-color: #cfdfb7; }
.readiness-panel strong { font-size: 14px; }
.readiness-panel p, .readiness-panel li { font-size: 12px; }
.journey-item, .care-person { background: #fcfdf8; border: 1px solid #dde6d4; border-radius: 18px; box-shadow: 0 3px 6px #26402503; }
.journey-item { padding: 21px 18px; }
.journey-item > span { background: #edf4df; border: 1px solid #dce8ca; border-radius: 10px; }
.journey-item strong { font-size: 13px; }
.journey-item p { line-height: 1.8; }
.care-person { padding: 23px; }
.care-person h3 { font-size: 15px; }
.care-person .record-facts dt, .care-person .record-facts dd { font-size: 11px; }
.kit-description, .care-note { background: #f6f9ef; border-color: #e0e8d3; border-radius: 14px; }
.message-row { padding: 19px 0; border-color: #e3ead9; }
.message-symbol { background: #edf4e4; border: 1px solid #dfe9d0; border-radius: 11px; height: 36px; width: 36px; }
.message-main p, .message-main small { font-size: 11px; line-height: 1.7; }
.message-main small { color: var(--muted); }
.message-preview { border-radius: 16px; background: #f7faf1; border-color: #e0e8d4; line-height: 1.9; }
.message-error { border-radius: 13px; }
.filter-banner { border-radius: 14px; background: #eef5e2; border-color: #d7e6c3; }
.template-panel { border-radius: 16px; border-color: #dce5d0; }
.template-panel summary { background: #f3f8e9; padding: 18px 21px; }
.template-help { border-radius: 14px; background: #f4f8ed; }
.email-cron-details, .email-last-test { border-radius: 16px; background: #f6f9ef; border-color: #dfe8d2; padding: 18px 20px; }
.email-cron-details summary { min-height: 22px; }
.email-cron-details code { border-radius: 11px; background: #fffefa; }
.emphasis-check { border-radius: 15px; border: 1px solid #d8e5c5; background: #eff6e5; }

/* Kit dispatch is deliberately consistent with the rest of management. */
.kit-summary-grid { gap: 16px; margin-bottom: 22px; }
.kit-summary { border-radius: 21px; padding: 22px; gap: 15px; }
.kit-summary strong { color: #355d38; font-size: 32px; letter-spacing: -1px; }
.kit-summary div > span { font-size: 11px; margin-top: 6px; }
.kit-stock-summary { margin-bottom: 23px; }
.kit-items { gap: 11px; }
.kit-items > div { border-radius: 13px; padding: 13px 15px; background: #f3f8e9; border-color: #dfe8d2; box-shadow: 0 1px 0 #ffffffdd inset; }
.kit-items dt { font-size: 11px; color: #5d6d50; }
.kit-items dd { color: #43673b; font-size: 22px; }
.kit-queue-filter { padding: 23px; border-radius: 21px; }
.kit-filter-form { gap: 17px; }
.kit-filter-form .btn { min-height: 48px; }
.kit-request-grid { gap: 22px; }
.kit-request-card { padding: 26px; }
.kit-request-head { margin-bottom: 21px; }
.kit-request-head h3 { font-size: 19px; letter-spacing: -.35px; }
.kit-request-head .eyebrow { color: #6a7c54; font-size: 9px; }
.kit-delivery-address { border-radius: 15px; padding: 15px; background: #fafcf6; border: 1px solid #e7eddf; gap: 12px; }
.kit-delivery-address .stat-icon { background: #edf4e4; border-color: #dfe8d2; }
.kit-delivery-address p { font-size: 13px; }
.kit-request-meta { font-size: 11px; line-height: 1.75; }
.kit-card-actions { border-color: #e1e8d6; padding-top: 19px; margin-top: 19px; }
.kit-notes { border: 1px solid #e1e8d6; background: #f5f8ed; border-radius: 15px; padding: 17px; }
.kit-signup-details { border-color: #dfe7d2; }
.kit-signup-details > summary { min-height: 42px; padding: 10px 0; }

/* A recognisable joining experience, rather than a bare login panel. */
.auth-wrap { border-radius: 29px; border-color: #dce5d4; box-shadow: 0 13px 35px #24412a0b, 0 1px 0 #fff inset; margin-top: 8px; max-width: 1020px; }
.auth-story { padding: 42px 35px; background: #224f36; background: radial-gradient(ellipse at 0 0, #557e4755, transparent 60%), linear-gradient(145deg, #2c583d, #153f2c); isolation: isolate; }
.auth-story::after { content: ""; position: absolute; width: 260px; height: 260px; border: 50px solid #d4ed9d09; border-radius: 50%; right: -150px; top: -130px; z-index: -1; }
.auth-story img { width: 80px; height: 80px; margin-bottom: 29px; float: none; filter: drop-shadow(0 6px 12px #0d2d2233); }
.auth-story h1 { color: #fff; font-size: 35px; line-height: 1.15; letter-spacing: -1.15px; max-width: 320px; position: relative; z-index: 1; }
.auth-story p { color: #d2e2c6; line-height: 1.85; font-size: 13px; margin-top: 18px; position: relative; z-index: 1; }
.auth-story .eyebrow, .auth-story-kicker { color: #cfe6a6; font-size: 9px; font-weight: 800; letter-spacing: 1.7px; text-transform: uppercase; margin-bottom: 12px; }
.auth-story-art { margin: 18px -28px -25px; position: relative; width: calc(100% + 56px); opacity: .66; pointer-events: none; }
.auth-story-art .village-art { width: 100%; height: auto; }
.auth-benefits { display: grid; gap: 14px; margin: 26px 0 0; padding: 0; list-style: none; }
.auth-benefits > li, .auth-benefits > div { display: flex; align-items: flex-start; gap: 10px; color: #d9e7ca; font-size: 12px; line-height: 1.65; }
.auth-benefits svg { width: 18px; height: 18px; flex: none; color: #d6e9a4; margin-top: 2px; }
.auth-benefits strong { color: #edf5df; display: block; font-size: 12px; }
.auth-story-bottom { color: #c6dcb7; margin-top: 30px; line-height: 1.65; }
.auth-form { padding: 43px; background: #fffefa; }
.auth-form h2 { font-size: 29px; color: #284b33; letter-spacing: -.9px; }
.auth-form > .muted { font-size: 13px; line-height: 1.75; margin-top: 9px; }
.auth-switch { color: #617452; font-size: 12px; line-height: 1.75; }
.auth-switch a { font-weight: 700; color: #355c38; text-decoration: underline; text-underline-offset: 3px; }
.auth-back { min-height: 32px; }
.signup-wrap { max-width: 1180px; grid-template-columns: minmax(250px, .68fr) minmax(0, 1.5fr); }
.signup-wrap .auth-story { padding: 36px 30px; }
.signup-wrap .auth-story h1 { font-size: 33px; }
.signup-wrap .auth-form { padding: 38px; }
.signup-section { border-color: #e1e8d6; padding-top: 27px; margin-top: 27px; }
.signup-section h3 { font-size: 17px; color: #365d38; margin-bottom: 20px; }
.signup-section > p { line-height: 1.75; }

/* Overlays remain ordinary, accessible dialogs with vertical scrolling. */
dialog { border: 1px solid #e0e7d6; border-radius: 27px; background: #fffefb; width: 510px; padding: 30px; box-shadow: 0 10px 25px #082a2026, 0 35px 100px #082a2040, 0 1px 0 #fff inset; max-height: calc(100dvh - 40px); overscroll-behavior: contain; }
dialog::backdrop { background: #0c2c235e; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.dialog-head { margin-bottom: 23px; gap: 16px; }
.dialog-head h2 { font-size: 22px; letter-spacing: -.55px; }
.dialog-head button { background: #f1f5e8; border: 1px solid #e2e9d7; min-width: 37px; }
.dialog-copy { font-size: 13px; line-height: 1.85; }
.dialog-actions { gap: 11px; margin-top: 25px; }
.profile-review-person, .profile-review-person > div { min-width: 0; }
.profile-review-person strong, .profile-review-person p, .profile-review-person small { overflow-wrap: anywhere; }
.profile-review-person small { display: block; color: #647058; margin-top: 5px; font-size: 11px; }
.profile-delete-section { margin-top: 27px; padding-top: 23px; border-top: 1px solid #e8d7d1; }
.profile-delete-section h3, .profile-delete-summary h3 { font-size: 15px; line-height: 1.5; margin: 0 0 8px; }
.profile-delete-section p, .profile-delete-summary p, .profile-delete-summary li, .profile-deletion-recovery p, .profile-delete-recovery p { font-size: 12px; line-height: 1.8; overflow-wrap: anywhere; }
.profile-delete-section p { margin-bottom: 15px; }
.profile-delete-summary { border: 1px solid #e4e8dc; border-radius: 15px; padding: 17px; margin: 17px 0; background: #f8faf4; }
.profile-delete-summary ul { padding-left: 19px; margin: 8px 0 18px; }
.profile-delete-summary li + li { margin-top: 7px; }
.profile-delete-summary p + p { margin-top: 10px; }
.profile-delete-confirm { margin-top: 20px; }
.profile-delete-confirm input { max-width: 100%; font-weight: 700; letter-spacing: .08em; }
.profile-deletion-recovery { min-width: 0; }
.profile-deletion-recovery p, .profile-delete-recovery p { margin: 7px 0 11px; }
.profile-delete-recovery { margin-top: 17px; }
.profile-delete-recovery[hidden] { display: none; }
#delete-profile-form, #delete-profile-form .notice > div { min-width: 0; }
#delete-profile-form .dialog-actions { flex-wrap: wrap; }
#delete-profile-form .dialog-actions .btn { max-width: 100%; white-space: normal; }
.toast { background: #234b35; border: 1px solid #ffffff24; border-radius: 16px; padding: 16px 20px; font-size: 12px; line-height: 1.65; box-shadow: 0 10px 30px #123c2c30; }
.toast.error { background: #912d35; }
.toast-region { bottom: 25px; }
.initial-loading { background: radial-gradient(ellipse at 50% 40%, #e6efd9, transparent 50%), #f5f7ef; }
.initial-loading img { filter: drop-shadow(0 8px 13px #2e5e2c1c); }
.initial-loading h1 { color: #325636; }
.error-page { padding: 20px 0; }
.faq details { border-color: #e3ead9; padding: 20px 0; }
.faq summary { font-size: 14px; line-height: 1.6; }
.faq p { line-height: 1.85; }
.help-grid .prose a:not(.btn), .help-grid .faq a:not(.btn), .signup-policy-intro a {
  color: var(--green); text-decoration: underline; text-underline-offset: 3px;
}

@media (min-width: 1600px) {
  :root { --side: 270px; }
  .page { padding: 42px 48px; }
  .topbar { padding: 0 48px; }
  .hero.hero-v160 { padding: 40px; min-height: 375px; }
  .hero-v160 .hero-title { font-size: 48px; }
  .home-personal { padding: 27px; }
}

@media (max-width: 1190px) {
  :root { --side: 228px; }
  .sidebar { padding: 25px 15px 18px; }
  .sidebar .brand img { width: 45px; height: 45px; }
  .sidebar .brand-name { font-size: 15px; }
  .sidebar .brand small { font-size: 8px; letter-spacing: 1.3px; }
  .topbar { padding: 0 28px; }
  .page { padding: 29px 28px 35px; }
  .home-stage { grid-template-columns: minmax(0, 1.4fr) minmax(260px, 1fr); gap: 18px; }
  .hero.hero-v160 { padding: 29px 28px; }
  .hero-v160 .hero-title { font-size: 36px; }
  .home-personal { padding: 21px; }
  .quick-actions, .management-shortcuts { gap: 12px; }
  .quick-action { padding: 16px; gap: 10px; }
  .quick-action-icon { width: 37px; height: 37px; border-radius: 12px; }
  .quick-action-arrow { display: none; }
  .management-shortcut { padding: 18px; gap: 10px; }
  .management-shortcut-arrow { display: none; }
  .management-shortcut-icon { width: 36px; height: 36px; }
  .stats-grid { gap: 13px; }
  .stat-card { padding: 19px 18px; }
  .stat-number { font-size: 32px; }
  .card { padding: 23px; }
  .admin-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-tile { padding: 23px; }
  .dashboard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
  .signup-wrap .auth-form { padding: 32px; }
  .signup-wrap .auth-story { padding: 32px 25px; }
}

@media (max-width: 1099px) {
  .sidebar-management { display: none; }
  .management-switcher { display: block; }
  .home-stage { grid-template-columns: 1fr; }
  .hero.hero-v160 { min-height: 325px; padding: 33px; }
  .hero-v160 .hero-title { font-size: 40px; max-width: 420px; }
  .hero-v160 .village-art { width: 55%; opacity: .68; }
  .home-personal { display: grid; grid-template-columns: 1fr auto; align-items: center; column-gap: 22px; padding: 23px 27px; }
  .home-personal .card-head { grid-column: 1; align-self: end; }
  .home-personal > .personal-orbit { grid-column: 2; grid-row: 1 / 4; width: 134px; height: 134px; margin: 0; border-width: 9px; }
  .personal-orbit-core strong { font-size: 35px; }
  .home-personal .personal-metrics { grid-column: 1; margin-top: 9px; margin-bottom: 15px; }
  .personal-metrics > div { text-align: left; padding: 0 15px 0 0; }
  .personal-metrics > div + div { padding-left: 19px; }
  .home-personal .personal-latest, .home-personal .latest-pick { grid-column: 1; }
  .home-personal.personal-guest { display: flex; }
  .management-shortcuts { grid-template-columns: 1fr; gap: 12px; }
  .management-shortcut { align-items: center; padding: 18px 21px; }
  .management-shortcut-icon { width: 41px; height: 41px; }
  .management-shortcut-arrow { display: block; }
  .signup-wrap { grid-template-columns: 1fr; max-width: 760px; }
  .signup-wrap .auth-story { display: block; padding: 28px 32px; }
  .signup-wrap .auth-story h1 { max-width: 520px; font-size: 30px; }
  .signup-wrap .auth-story p { max-width: 560px; font-size: 12px; margin-top: 11px; }
  .signup-wrap .auth-story img { float: right; width: 65px; height: 65px; margin: 0 0 12px 20px; }
  .signup-wrap .auth-benefits { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; margin-top: 22px; }
  .signup-wrap .auth-benefits > li, .signup-wrap .auth-benefits > div { font-size: 11px; }
  .signup-wrap .auth-story-art { position: absolute; width: 250px; right: 0; bottom: -45px; opacity: .15; margin: 0; }
  .signup-wrap .auth-story-bottom { display: none; }
}

@media (max-width: 900px) {
  :root { --side: 0px; }
  html { scroll-padding-top: 100px; scroll-padding-bottom: calc(var(--dock-space) + env(safe-area-inset-bottom)); }
  .sidebar { display: none; }
  .workspace { margin-left: 0; }
  .topbar { height: 79px; padding: 12px 25px; background: #f9faf4; background: #fafbf5ed; border-bottom: 1px solid #e2e8d9; box-shadow: 0 3px 13px #25432a05; }
  .topbar-context, .topbar-title { display: none; }
  .topbar .brand { display: flex; gap: 10px; }
  .topbar .brand img { width: 43px; height: 43px; }
  .topbar .brand-name { font-size: 14px; line-height: 1.2; letter-spacing: -.35px; }
  .topbar .brand-name span { display: inline; }
  .topbar .brand-name span + span::before { content: " "; }
  .topbar .brand small { color: #667950; letter-spacing: 1.6px; font-size: 8px; display: block; margin-top: 5px; }
  .topbar-right { gap: 10px; }
  .topbar-right .user-button > span:not(.avatar) { display: none; }
  .topbar-right > .btn { min-height: 36px; padding: 8px 11px; font-size: 11px; border-radius: 11px; }
  .topbar-right .guest-signup { display: none; }
  .topbar .user-button .avatar { width: 35px; height: 35px; font-size: 11px; }
  .page { padding: 29px 25px calc(var(--dock-space) + env(safe-area-inset-bottom)); min-height: calc(100dvh - 79px); }
  .page-head h1 { font-size: 32px; }
  .home-heading h1 { font-size: 30px; }
  .home-stage { grid-template-columns: minmax(0, 1.4fr) minmax(250px, 1fr); gap: 18px; }
  .hero.hero-v160 { padding: 29px; min-height: 365px; }
  .hero-v160 .hero-title { font-size: 37px; }
  .hero-v160 .village-art { width: 82%; opacity: .5; }
  .home-personal { display: flex; padding: 23px; }
  .home-personal > .personal-orbit { width: 145px; height: 145px; margin: 12px auto 17px; border-width: 10px; }
  .home-personal .personal-metrics { margin-top: 0; }
  .personal-metrics > div { text-align: center; padding: 0 8px; }
  .personal-metrics > div + div { padding-left: 8px; }
  .bottom-nav {
    position: fixed; z-index: 40; bottom: calc(14px + env(safe-area-inset-bottom)); left: 50%; right: auto;
    transform: translateX(-50%); width: min(520px, calc(100% - 36px)); height: 72px;
    display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); align-items: center; gap: 2px;
    padding: 8px 11px; background: #fffefa; background: #fffefaed;
    border: 1px solid #dbe4d0; border-radius: 24px; box-shadow: 0 4px 10px #294a2712, 0 18px 44px #294a2722, 0 1px 0 #fff inset;
    backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
  }
  .bottom-nav a { color: #60724f; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 5px; min-width: 0; min-height: 53px; font-size: 9px; font-weight: 650; line-height: 1.1; border-radius: 14px; padding: 6px 1px; }
  .bottom-nav a svg { width: 20px; height: 20px; stroke-width: 1.7; }
  .bottom-nav a.active { color: #2c5932; background: #edf3e3; }
  .bottom-nav a.log-pick { color: #4d6241; padding-top: 0; gap: 6px; font-size: 9px; font-weight: 700; }
  .bottom-nav a.log-pick svg { width: 40px; height: 35px; padding: 7px 10px; border-radius: 13px; background: linear-gradient(135deg, #dcf1ae, #c4e68a); color: #2b512f; border: 1px solid #b8d77b; box-shadow: 0 4px 8px #4c6b2422, 0 1px 0 #f8ffdc inset; }
  .bottom-nav a.log-pick.active { color: #2c5932; background: #edf3e3; }
  .bottom-nav a:hover { color: #2d5733; }
  .toast-region { left: 50%; bottom: calc(var(--dock-space) + env(safe-area-inset-bottom)); width: min(560px, calc(100vw - 32px)); }
  .settings-actions { bottom: calc(99px + env(safe-area-inset-bottom)); border-radius: 18px; }
  .management-shortcuts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .management-shortcut { align-items: flex-start; flex-wrap: wrap; padding: 20px; }
  .management-shortcut-copy { flex-basis: calc(100% - 55px); }
  .management-shortcut-arrow { display: none; }
  .management-switcher { margin-bottom: 25px; }
  .admin-nav { margin: 0; }
  .form-layout, .map-layout, .account-grid, .settings-grid { grid-template-columns: 1fr; }
  .form-aside { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
  .form-aside .card, .form-aside .card + .card { margin: 0; }
  .form-aside .summary-panel { grid-column: 1 / -1; }
  .settings-grid .span-full { grid-column: auto; }
  .map-area-list { max-height: 300px; }
  .coverage-map { height: 440px; }
  .reward-feature { padding: 30px; }
  .auth-wrap { grid-template-columns: minmax(0, .9fr) minmax(0, 1fr); }
  .auth-story { padding: 33px 27px; }
  .auth-story h1 { font-size: 32px; }
  .auth-form { padding: 34px 30px; }
  .signup-wrap { grid-template-columns: 1fr; }
}

@media (max-width: 680px) {
  :root { --radius: 22px; }
  .page { padding: 25px 20px calc(var(--dock-space) + env(safe-area-inset-bottom)); }
  .topbar { padding: 12px 20px; height: 77px; }
  .page-head { margin-bottom: 23px; gap: 16px; }
  .page-head h1 { font-size: 30px; }
  .page-head p { font-size: 12px; margin-top: 8px; }
  .page-head .eyebrow { font-size: 9px; margin-bottom: 9px; }
  .home-heading { align-items: flex-start; margin-bottom: 21px; }
  .home-heading h1 { font-size: 28px; line-height: 1.2; }
  .home-heading p { font-size: 12px; margin-top: 8px; }
  .home-date, .date-badge { padding: 7px 9px; font-size: 10px; white-space: normal; max-width: 110px; line-height: 1.5; gap: 5px; }
  .home-stage { grid-template-columns: 1fr; gap: 16px; margin-bottom: 18px; }
  .hero.hero-v160 { padding: 29px; min-height: 326px; border-radius: 26px; }
  .hero-v160 .hero-title { font-size: 39px; max-width: 390px; }
  .hero-v160 .eyebrow { font-size: 9px; margin-bottom: 14px; }
  .hero-v160 p { font-size: 12px; max-width: 330px; line-height: 1.8; margin: 14px 0 22px; }
  .hero-v160 .village-art { width: 65%; opacity: .52; right: -26px; }
  .hero-v160 .btn { min-height: 45px; font-size: 12px; }
  .hero-meta { gap: 10px; margin-top: 22px; }
  .hero-promise { font-size: 10px; }
  .home-personal { display: grid; grid-template-columns: 1fr auto; column-gap: 18px; padding: 23px; border-radius: 23px; }
  .home-personal > .personal-orbit { width: 126px; height: 126px; grid-column: 2; grid-row: 1 / 4; border-width: 8px; margin: 0; }
  .home-personal .card-head { grid-column: 1; margin-bottom: 8px; align-self: end; }
  .home-personal .card-head h2 { font-size: 16px; }
  .home-personal .card-head-icon { width: 32px; height: 32px; }
  .home-personal .personal-metrics { grid-column: 1; gap: 8px; margin-bottom: 12px; }
  .home-personal .personal-latest, .home-personal .latest-pick { grid-column: 1 / -1; margin-top: 15px; font-size: 11px; }
  .personal-metrics > div { text-align: left; padding: 0 7px 0 0; }
  .personal-metrics > div + div { padding-left: 12px; }
  .personal-metrics strong { font-size: 23px; }
  .personal-orbit-core strong { font-size: 32px; }
  .personal-orbit-core span { font-size: 9px; }
  .personal-orbit-core svg { width: 16px; height: 16px; margin-bottom: 4px; }
  .quick-actions { gap: 10px; margin-bottom: 26px; }
  .quick-action { flex-direction: column; align-items: flex-start; gap: 12px; padding: 17px 14px; border-radius: 18px; min-height: 137px; }
  .quick-action-icon { width: 38px; height: 38px; border-radius: 12px; }
  .quick-action-copy strong { font-size: 12px; }
  .quick-action-copy span { font-size: 10px; line-height: 1.55; }
  .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 21px; }
  .stat-card { padding: 19px; border-radius: 20px; }
  .stat-top { margin-bottom: 14px; }
  .stat-number { font-size: 36px; letter-spacing: -1.3px; }
  .stat-label { font-size: 12px; margin-top: 7px; }
  .stat-context { display: block; font-size: 10px; }
  .stat-top .eyebrow { display: none; }
  .stat-icon { width: 36px; height: 36px; }
  .section-heading { margin: 25px 0 16px; gap: 13px; align-items: flex-end; }
  .section-heading h2 { font-size: 20px; }
  .section-heading p { font-size: 11px; }
  .period-control { gap: 5px; font-size: 10px; }
  .period-control input, .period-control select { min-height: 39px; max-width: 155px; font-size: 11px; padding: 8px 9px; }
  .dashboard-grid { grid-template-columns: 1fr; gap: 19px; }
  .card { padding: 23px; }
  .card-head h2 { font-size: 18px; }
  .card-head p { font-size: 12px; }
  .card-head-icon { width: 37px; height: 37px; }
  .list-value strong { font-size: 21px; }
  .list-main p { font-size: 11px; }
  .list-row { gap: 12px; }
  .mini-summary { gap: 9px; }
  .mini-stat { padding: 15px 12px; border-radius: 13px; }
  .mini-stat strong { font-size: 23px; }
  .mini-stat span { font-size: 10px; }
  .welcome-strip { padding: 22px; flex-wrap: wrap; gap: 13px; }
  .welcome-strip .actions { margin: 3px 0 0; width: 100%; }
  .welcome-strip h3 { font-size: 15px; }
  .welcome-strip p { font-size: 12px; }
  .form-card { padding: 25px; }
  .form-section { padding-bottom: 25px; margin-bottom: 25px; }
  .form-grid { grid-template-columns: 1fr 1fr; gap: 16px; }
  .field input, .field select, .field textarea { font-size: 16px; min-height: 49px; padding: 12px 13px; }
  .field input[type="checkbox"], .field input[type="radio"] { min-height: 0; }
  .field label { font-size: 12px; }
  .field-hint { font-size: 11px; }
  .form-end { flex-direction: column; align-items: stretch; gap: 14px; }
  .form-end .field-hint { max-width: none; font-size: 11px; }
  .form-end .btn { width: 100%; }
  .form-aside { grid-template-columns: 1fr; gap: 18px; }
  .form-aside .side-note { display: block; }
  .summary-panel { padding: 25px; }
  .pick-map { height: 315px; border-radius: 17px; }
  .coverage-map { height: 385px; min-height: 320px; border-radius: 22px; }
  .map-banner { padding: 19px; }
  .map-banner p { font-size: 12px; }
  .map-key { gap: 13px; line-height: 1.6; }
  .area-choice { font-size: 12px; }
  .place-feedback { padding: 13px 14px; font-size: 11px; }
  .place-feedback strong { font-size: 12px; }
  .place-feedback .btn-inline, .place-candidate-list .btn { font-size: 11px; }
  .place-chip .chip-name { font-size: 11px; }
  .reward-feature { grid-template-columns: 1fr; padding: 25px; border-radius: 26px; gap: 23px; }
  .reward-feature h2 { font-size: 28px; }
  .reward-feature .sun-icon { float: right; margin: 0 0 10px 15px; width: 49px; height: 49px; border-radius: 16px; }
  .reward-progress { padding: 24px; border-radius: 20px; }
  .token-total > strong { font-size: 52px; }
  .token-examples { gap: 9px; }
  .token-examples > div { padding: 15px 9px; border-radius: 12px; }
  .token-examples strong { font-size: 16px; }
  .token-examples span { font-size: 10px; }
  .token-progress-label { gap: 12px; }
  .token-progress-label strong { font-size: 21px; }
  .account-top { padding: 24px; gap: 14px; border-radius: 24px; flex-wrap: wrap; }
  .account-top .avatar { width: 55px; height: 55px; font-size: 19px; }
  .account-top h2 { font-size: 21px; }
  .account-top p { font-size: 12px; }
  .account-top .actions { width: 100%; margin-left: 69px; margin-top: 2px; }
  .account-top .btn { min-height: 37px; font-size: 11px; }
  .tab-bar { width: 100%; margin-bottom: 22px; }
  .tab-link { flex: 1; padding: 10px 9px; font-size: 11px; min-height: 40px; }
  .pick-history-card { padding: 18px; }
  .pick-history-card strong { font-size: 13px; }
  .pick-history-card p { font-size: 11px; }
  .pick-figures { gap: 7px; font-size: 10px; }
  .pick-figures span { padding: 5px 7px; }
  .admin-header { gap: 12px; }
  .admin-header > span { width: 43px; height: 43px; border-radius: 14px; }
  .admin-header h1 { font-size: 28px; }
  .management-intro { padding: 26px; border-radius: 24px; margin-bottom: 19px; }
  .management-intro h2 { font-size: 27px; }
  .management-intro p { font-size: 12px; }
  .management-shortcuts { grid-template-columns: 1fr; gap: 12px; margin-bottom: 24px; }
  .management-shortcut { padding: 19px 20px; gap: 13px; flex-wrap: nowrap; align-items: center; }
  .management-shortcut-copy { flex-basis: auto; }
  .management-shortcut-arrow { display: block; }
  .management-shortcut-copy strong { font-size: 13px; }
  .management-shortcut-copy span, .management-shortcut-copy p { font-size: 11px; }
  .admin-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
  .admin-tile { padding: 21px 18px; border-radius: 20px; }
  .admin-tile .stat-icon { width: 37px; height: 37px; border-radius: 12px; margin-bottom: 16px; }
  .admin-tile h3 { font-size: 14px; }
  .admin-tile p { font-size: 11px; line-height: 1.75; }
  .admin-tile .arrow-link { font-size: 11px; }
  .management-switcher > summary { min-height: 55px; padding: 15px 16px; }
  .management-switcher .admin-nav { padding: 10px; gap: 6px; }
  .module-heading { gap: 14px; }
  .module-heading h2 { font-size: 23px; }
  .module-heading p { font-size: 12px; }
  .module-icon { width: 44px; height: 44px; border-radius: 14px; }
  .module-heading > .actions { margin-left: 59px; }
  .module-heading > .actions .btn { font-size: 11px; min-height: 39px; }
  .module-nav { margin-bottom: 22px; }
  .module-nav a { font-size: 11px; min-height: 40px; padding: 10px 12px; }
  .toolbar { gap: 11px; }
  .search-form { flex-basis: 100%; max-width: none; }
  .toolbar .period-control { margin-left: 0; }
  .search-box input { min-height: 45px; font-size: 13px; }
  .settings-actions { position: static; bottom: auto; padding: 15px 17px; gap: 11px; flex-wrap: wrap; }
  .settings-actions p { font-size: 11px; max-width: 240px; }
  .settings-actions .btn { min-height: 42px; font-size: 12px; }
  .data-table { font-size: 11px; }
  .data-table th { font-size: 10px; padding: 12px; }
  .data-table td { padding: 15px 12px; }
  .data-table td strong { font-size: 12px; }
  .data-table td small { font-size: 10px; }
  .record-facts { gap: 18px; }
  .record-facts dt { font-size: 10px; }
  .record-facts dd { font-size: 12px; }
  .document-banner { padding: 19px 20px; border-radius: 17px; }
  .saved-document-row { padding: 15px 13px; gap: 10px; }
  .saved-document-row .list-main small { font-size: 10px; }
  .care-shortcuts { grid-template-columns: 1fr; }
  .journey-list { grid-template-columns: 1fr 1fr; gap: 11px; }
  .journey-item { padding: 18px 16px; }
  .care-grid { grid-template-columns: 1fr; }
  .care-person { padding: 21px; }
  .readiness-panel { padding: 19px; gap: 12px; }
  .readiness-panel strong { font-size: 13px; }
  .readiness-panel p, .readiness-panel li { font-size: 11px; }
  .message-main p, .message-main small { font-size: 11px; }
  .message-row { gap: 10px; }
  .message-row > .btn { min-height: 37px; font-size: 11px; }
  .message-filters .field select { font-size: 14px; }
  .template-fields { padding: 20px; }
  .template-panel summary { padding: 17px 19px; }
  .kit-summary-grid { gap: 10px; }
  .kit-summary { display: block; padding: 17px 14px; border-radius: 19px; }
  .kit-summary > .stat-icon { width: 33px; height: 33px; margin-bottom: 12px; }
  .kit-summary strong { font-size: 28px; }
  .kit-summary div > span { font-size: 10px; line-height: 1.6; }
  .kit-stock-summary .kit-items { grid-template-columns: 1fr 1fr; }
  .kit-items > div { padding: 12px 13px; }
  .kit-items dd { font-size: 21px; }
  .kit-request-card { padding: 23px; }
  .kit-request-head h3 { font-size: 18px; }
  .kit-queue-filter { padding: 22px; }
  .kit-filter-form { grid-template-columns: 1fr; }
  .kit-filter-form .btn { justify-self: stretch; }
  .kit-card-actions { gap: 10px; }
  .kit-card-actions .btn { min-height: 42px; }
  .kit-delivery-address { padding: 14px; gap: 10px; }
  .auth-wrap { grid-template-columns: 1fr; border-radius: 25px; margin: 0; }
  .auth-story { display: block; padding: 28px; }
  .auth-story img { width: 64px; height: 64px; float: right; margin: 0 0 14px 18px; }
  .auth-story h1 { font-size: 30px; max-width: 360px; }
  .auth-story p { font-size: 12px; margin-top: 13px; max-width: 480px; }
  .auth-story .eyebrow, .auth-story-kicker { font-size: 8px; margin-bottom: 11px; }
  .auth-story-art { position: absolute; width: 260px; right: -10px; bottom: -55px; margin: 0; opacity: .15; }
  .auth-benefits { gap: 10px; margin-top: 20px; grid-template-columns: 1fr; }
  .auth-benefits > li, .auth-benefits > div { font-size: 11px; }
  .auth-story-bottom { display: none; }
  .auth-form { padding: 29px; }
  .auth-form h2 { font-size: 27px; }
  .auth-form > .muted { font-size: 12px; margin-bottom: 26px; }
  .signup-wrap .auth-story { padding: 28px; }
  .signup-wrap .auth-story h1 { font-size: 29px; }
  .signup-wrap .auth-benefits { grid-template-columns: 1fr; }
  .signup-wrap .auth-form { padding: 29px; }
  .signup-wrap .form-grid { grid-template-columns: 1fr; }
  .signup-section { padding-top: 24px; margin-top: 24px; }
  .signup-section h3 { font-size: 16px; }
  .signup-details { grid-template-columns: 1fr; gap: 18px; }
  .signup-private-note { padding: 13px 14px; font-size: 11px; }
  .page-footer { gap: 14px; font-size: 10px; line-height: 1.75; padding-top: 29px; }
  .toast { font-size: 12px; padding: 15px 18px; justify-content: flex-start; }
  dialog { padding: 27px; border-radius: 24px; max-width: calc(100vw - 28px); }
  .dialog-head h2 { font-size: 21px; }
  .dialog-copy { font-size: 12px; }
  .dialog-actions { flex-wrap: wrap; }
}

@media (max-width: 420px) {
  .topbar { padding: 11px 16px; height: 75px; gap: 9px; }
  .topbar .brand { gap: 8px; }
  .topbar .brand img { width: 37px; height: 37px; }
  .topbar .brand-name { font-size: 12px; max-width: 142px; }
  .topbar .brand small { font-size: 7px; letter-spacing: 1.4px; }
  .topbar-right { gap: 7px; }
  .topbar-right > .btn { min-height: 35px; padding: 7px 9px; font-size: 10px; gap: 5px; }
  .topbar-right > .btn svg { width: 16px; height: 16px; }
  .topbar .user-button .avatar { width: 31px; height: 31px; font-size: 10px; }
  .page { padding-left: 16px; padding-right: 16px; padding-top: 23px; }
  .page-head h1 { font-size: 28px; }
  .home-heading { gap: 10px; flex-wrap: wrap; margin-bottom: 19px; }
  .home-heading h1 { font-size: 28px; }
  .home-date, .date-badge { max-width: none; white-space: nowrap; padding: 6px 10px; font-size: 10px; }
  .hero.hero-v160 { padding: 26px 24px; min-height: 328px; border-radius: 24px; }
  .hero-v160 .hero-title { font-size: 36px; letter-spacing: -1.35px; }
  .hero-v160 p { font-size: 12px; line-height: 1.8; }
  .hero-v160 .eyebrow { font-size: 8px; line-height: 1.6; letter-spacing: 1.4px; }
  .hero-v160 .hero-copy { max-width: 100%; }
  .hero-v160 .village-art { width: 81%; opacity: .42; right: -34px; }
  .hero-meta { margin-top: 20px; gap: 8px; }
  .hero-promise { font-size: 9px; gap: 5px; }
  .hero-v160 .actions { gap: 9px; }
  .hero-v160 .actions .btn { font-size: 11px; padding: 10px 13px; min-height: 43px; }
  .home-personal { padding: 21px; column-gap: 14px; }
  .home-personal > .personal-orbit { width: 106px; height: 106px; border-width: 7px; box-shadow: 0 0 0 1px #d9e6c7, 0 4px 11px #3d6b2d0a, 0 0 0 4px #f5f8ed; }
  .personal-orbit-core { padding: 5px; }
  .personal-orbit-core strong { font-size: 29px; letter-spacing: -1.2px; }
  .personal-orbit-core span { font-size: 9px; margin-top: 4px; }
  .personal-orbit-core svg { width: 14px; height: 14px; margin-bottom: 3px; }
  .home-personal .card-head { gap: 7px; }
  .home-personal .card-head h2 { font-size: 15px; }
  .home-personal .card-head-icon { width: 29px; height: 29px; border-radius: 10px; }
  .home-personal .card-head-icon svg { width: 17px; height: 17px; }
  .home-personal .eyebrow { font-size: 8px; }
  .personal-metrics strong { font-size: 21px; }
  .personal-metrics span { font-size: 9px; }
  .personal-metrics > div + div { padding-left: 9px; }
  .home-personal .personal-latest, .home-personal .latest-pick { font-size: 10px; }
  .quick-actions { gap: 8px; margin-bottom: 25px; }
  .quick-action { padding: 15px 11px; min-height: 143px; border-radius: 16px; gap: 11px; }
  .quick-action-icon { width: 34px; height: 34px; border-radius: 11px; }
  .quick-action-icon svg { width: 19px; height: 19px; }
  .quick-action-copy strong { font-size: 11px; line-height: 1.5; }
  .quick-action-copy span { font-size: 10px; line-height: 1.5; }
  .section-heading { align-items: flex-start; }
  .section-heading h2 { font-size: 18px; }
  .section-heading p { font-size: 10px; line-height: 1.65; }
  .period-control { font-size: 10px; }
  .period-control input, .period-control select { max-width: 132px; font-size: 10px; min-height: 37px; padding: 7px 8px; }
  .stats-grid { gap: 11px; }
  .stat-card { padding: 17px 16px; border-radius: 19px; }
  .stat-number { font-size: 33px; }
  .stat-label { font-size: 11px; }
  .stat-context { font-size: 9px; line-height: 1.6; }
  .stat-icon { width: 33px; height: 33px; border-radius: 11px; }
  .stat-icon svg { width: 18px; height: 18px; }
  .card { padding: 21px; }
  .card-head { gap: 11px; }
  .card-head h2 { font-size: 17px; }
  .card-head p { font-size: 11px; }
  .card-head-icon { width: 33px; height: 33px; border-radius: 11px; }
  .card-head-icon svg { width: 18px; height: 18px; }
  .mini-summary { gap: 8px; }
  .mini-stat { padding: 13px 10px; }
  .mini-stat strong { font-size: 21px; }
  .mini-stat span { font-size: 9px; }
  .list-row { gap: 9px; }
  .list-main strong { font-size: 12px; }
  .list-main p { font-size: 10px; }
  .list-value strong { font-size: 19px; }
  .date-tag { font-size: 9px; }
  .area-line { gap: 10px; font-size: 11px; }
  .area-line span { font-size: 10px; }
  .form-card { padding: 22px; }
  .form-grid { grid-template-columns: 1fr; gap: 17px; }
  .inline-fields { gap: 10px; }
  .form-section h2 { font-size: 16px; }
  .form-section-title { gap: 9px; }
  .field input, .field select, .field textarea { font-size: 16px; padding: 12px; min-height: 48px; }
  .stepper input { padding: 8px; }
  .area-choices { grid-template-columns: 1fr; }
  .pick-map { height: 295px; }
  .coverage-map { height: 350px; min-height: 300px; }
  .map-banner { padding: 18px; gap: 10px; }
  .reward-feature { padding: 23px; gap: 21px; }
  .reward-feature h2 { font-size: 26px; }
  .reward-feature .sun-icon { width: 42px; height: 42px; border-radius: 14px; }
  .reward-feature .sun-icon svg { width: 25px; height: 25px; }
  .reward-progress { padding: 22px; }
  .token-total > strong { font-size: 47px; }
  .token-total > span { font-size: 12px; }
  .token-progress-label strong { font-size: 19px; }
  .token-progress-label span { font-size: 10px; }
  .token-examples { gap: 7px; }
  .token-examples > div { padding: 13px 7px; }
  .token-examples strong { font-size: 14px; }
  .token-examples span { font-size: 9px; }
  .fixed-token-rule { padding: 18px; }
  .fixed-token-rule strong { font-size: 18px; }
  .account-top { padding: 22px; gap: 12px; }
  .account-top h2 { font-size: 19px; }
  .account-top p { font-size: 11px; }
  .account-top .avatar { width: 48px; height: 48px; font-size: 17px; }
  .account-top .actions { margin-left: 60px; }
  .tab-link { font-size: 10px; padding: 10px 7px; }
  .admin-header h1 { font-size: 26px; }
  .admin-header > span { width: 39px; height: 39px; border-radius: 13px; }
  .admin-grid { gap: 12px; grid-template-columns: 1fr; }
  .admin-tile { padding: 22px; }
  .admin-tile h3 { font-size: 15px; }
  .admin-tile p { font-size: 12px; }
  .management-intro { padding: 24px; }
  .management-intro h2 { font-size: 25px; }
  .management-switcher > summary { font-size: 11px; gap: 9px; padding: 14px; }
  .management-switcher > summary small { font-size: 9px; }
  .management-shortcut { padding: 18px; gap: 11px; }
  .management-shortcut-icon { width: 37px; height: 37px; }
  .management-shortcut-copy strong { font-size: 12px; }
  .management-shortcut-copy span, .management-shortcut-copy p { font-size: 11px; }
  .module-heading h2 { font-size: 21px; }
  .module-heading-copy { gap: 11px; }
  .module-heading p { font-size: 11px; }
  .module-icon { width: 39px; height: 39px; border-radius: 13px; }
  .module-heading > .actions { margin-left: 50px; }
  .module-heading > .actions .btn { font-size: 11px; }
  .kit-summary-grid { gap: 8px; }
  .kit-summary { padding: 15px 11px; border-radius: 17px; }
  .kit-summary strong { font-size: 26px; }
  .kit-summary div > span { font-size: 10px; }
  .kit-summary > .stat-icon { width: 30px; height: 30px; margin-bottom: 11px; }
  .kit-stock-summary .kit-items, .kit-items { grid-template-columns: 1fr; }
  .kit-request-card, .kit-queue-filter { padding: 21px; }
  .kit-request-head h3 { font-size: 18px; }
  .kit-delivery-address { padding: 13px; }
  .kit-card-actions { flex-direction: column; align-items: stretch; }
  .kit-card-actions .btn { width: 100%; }
  .kit-pagination { gap: 8px; }
  .kit-pagination .btn { min-height: 40px; padding: 8px 10px; font-size: 11px; }
  .signup-wrap .auth-story, .auth-story { padding: 25px; }
  .signup-wrap .auth-story h1, .auth-story h1 { font-size: 28px; }
  .signup-wrap .auth-story img, .auth-story img { width: 55px; height: 55px; margin-left: 14px; }
  .signup-wrap .auth-form, .auth-form { padding: 25px; }
  .auth-form h2 { font-size: 26px; }
  .auth-benefits { gap: 11px; }
  .signup-section h3 { font-size: 15px; gap: 8px; }
  .signup-section h3 .step-number { width: 27px; height: 27px; font-size: 11px; }
  .bottom-nav { width: calc(100% - 26px); padding: 8px; border-radius: 22px; bottom: calc(12px + env(safe-area-inset-bottom)); }
  .bottom-nav a { font-size: 8px; gap: 5px; min-height: 53px; }
  .bottom-nav a.log-pick { font-size: 8px; }
  .bottom-nav a svg { width: 19px; height: 19px; }
  .bottom-nav a.log-pick svg { width: 37px; height: 34px; padding: 7px 9px; }
  dialog { padding: 24px; border-radius: 23px; max-width: calc(100vw - 22px); }
  .dialog-head h2 { font-size: 20px; }
  .dialog-head button { min-width: 35px; width: 35px; height: 35px; }
  .dialog-actions .btn { min-height: 44px; font-size: 11px; }
}

@media (max-width: 379px) {
  .topbar .brand-name { max-width: 112px; font-size: 11px; }
  .topbar .brand-name span { display: block; }
  .topbar .brand-name span + span::before { content: none; }
  .topbar .brand small { font-size: 6px; letter-spacing: 1.1px; }
  .page { padding-left: 14px; padding-right: 14px; }
  .hero.hero-v160 { padding: 24px 22px; }
  .hero-v160 .hero-title { font-size: 33px; }
  .home-heading h1 { font-size: 26px; }
  .home-personal { padding: 20px; gap: 13px; }
  .home-personal > .personal-orbit { width: 96px; height: 96px; border-width: 6px; }
  .home-personal .card-head-icon { display: none; }
  .personal-orbit-core strong { font-size: 27px; }
  .personal-metrics strong { font-size: 19px; }
  .quick-action { padding: 14px 9px; min-height: 147px; }
  .quick-action-copy strong { font-size: 10px; }
  .quick-action-copy span { font-size: 9px; }
  .stat-card { padding: 16px 15px; }
  .stat-number { font-size: 30px; }
  .stat-label { font-size: 10px; }
  .section-heading { flex-wrap: wrap; gap: 11px; }
  .section-heading .period-control { margin-left: auto; }
  .card { padding: 20px; }
  .form-card { padding: 21px; }
  .card-head h2 { font-size: 16px; }
  .mini-summary { gap: 7px; }
  .mini-stat { padding: 12px 8px; }
  .mini-stat strong { font-size: 20px; }
  .mini-stat span { font-size: 9px; }
  .management-switcher .admin-nav { grid-template-columns: 1fr; }
  .management-switcher > summary > span { gap: 7px; }
  .kit-summary { padding: 15px 10px; }
  .kit-summary strong { font-size: 25px; }
  .kit-summary div > span { font-size: 9px; }
  .account-top { padding: 21px; }
  .account-top .actions { margin-left: 0; }
  .tab-link { padding: 10px 6px; font-size: 9px; }
  .reward-feature { padding: 21px; }
  .reward-progress { padding: 20px; }
  .token-total > strong { font-size: 44px; }
  .token-progress-label { align-items: flex-start; }
  .token-progress-label strong { font-size: 18px; }
  .token-progress-label span { font-size: 10px; }
  .signup-wrap .auth-story, .auth-story, .signup-wrap .auth-form, .auth-form { padding: 23px; }
  .signup-wrap .auth-story h1, .auth-story h1 { font-size: 26px; }
  .management-page-head { flex-direction: column; align-items: flex-start; gap: 15px; }
  .module-heading > .actions { margin-left: 0; }
  .module-heading > .actions .btn { font-size: 11px; min-height: 41px; }
  .journey-list { grid-template-columns: 1fr; }
  .settings-actions .btn { width: 100%; }
  .settings-actions p { max-width: none; }
  dialog { padding: 22px; }
  .dialog-head h2 { font-size: 19px; }
}

@media (max-height: 720px) and (min-width: 901px) {
  .sidebar { padding-top: 20px; padding-bottom: 15px; }
  .sidebar-brand { padding-bottom: 19px; }
  .nav-label { padding-top: 16px; }
  .nav-primary-label { padding-top: 0; }
  .sidebar-bottom { padding-top: 12px; }
  .sidebar-links { padding-top: 12px; }
}

/* A short mobile viewport needs room for the form when the keyboard is open. */
@media (max-height: 560px) and (max-width: 900px) {
  html { scroll-padding-top: 20px; }
  .topbar { position: static; }
  .settings-actions { position: static; bottom: auto; }
}

/* Structural hooks shared by the home, guest and management compositions. */
.sidebar-note { display: flex; align-items: flex-start; gap: 10px; }
.sidebar-note > svg { width: 19px; height: 19px; margin-top: 2px; flex: none; color: #c5e293; }
.sidebar-profile { margin-top: 13px; }
.sidebar-profile .sidebar-profile-copy { display: block; margin-top: 0; }
.sidebar-profile strong { color: #f1f6e9; }
.topbar-context { flex-direction: column; align-items: flex-start; gap: 3px; }
.topbar-overline { font-size: 9px; text-transform: uppercase; letter-spacing: 1.5px; color: #667a51; }
.topbar-context strong { font-size: 13px; }
.topbar-help { display: inline-flex; align-items: center; gap: 7px; min-height: 40px; color: #60744f; font-size: 12px; }
.topbar-help svg { width: 18px; height: 18px; }
.topbar-right .user-button > span:not(.avatar) { max-width: 170px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.account-top > div:not(.actions) { min-width: 0; }
.account-top h2 { overflow-wrap: anywhere; }
.date-chip { display: inline-flex; align-items: center; gap: 8px; padding: 9px 12px; border: 1px solid #dde6d6; background: #ffffffb3; border-radius: 12px; font-size: 11px; color: #62725b; white-space: nowrap; }
.date-chip svg { width: 16px; height: 16px; }
.hero-status-dot { display: inline-block; flex: none; width: 6px; height: 6px; border-radius: 50%; background: #d6efab; box-shadow: 0 0 0 4px #d1e89a12; margin-right: 3px; }
.hero-text-link { display: inline-flex; align-items: center; gap: 7px; min-height: 43px; padding: 4px 0; color: #e1efce; font-size: 11px; font-weight: 650; }
.hero-text-link svg { width: 16px; height: 16px; }
.hero-text-link:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.hero-v160 .hero-promise { margin-top: 26px; }
.home-personal { display: flex; }
.personal-impact { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); align-items: center; gap: 18px; flex: 1; margin: 10px 0 20px; }
.personal-impact .personal-orbit { width: 139px; height: 139px; max-width: 100%; border-width: 10px; margin: 0 auto; }
.personal-impact .personal-orbit-core strong { font-size: 35px; }
.personal-impact .personal-metrics { display: grid; grid-template-columns: 1fr; gap: 13px; margin: 0; }
.personal-impact .personal-metrics > div { position: relative; text-align: left; padding: 0; min-width: 0; }
.personal-impact .personal-metrics > div + div { border-left: 0; border-top: 1px solid #e2ead7; padding: 13px 0 0; }
.personal-impact .personal-metrics strong { font-size: 25px; }
.personal-impact .personal-metric-icon { display: none; }
.personal-latest { margin-top: auto; padding-top: 17px; }
.personal-latest .activity-icon { width: 33px; height: 33px; border-radius: 11px; }
.personal-latest .activity-icon svg { width: 16px; height: 16px; margin: 0; }
.personal-latest p { font-size: 11px; line-height: 1.6; margin-top: 3px; }
.personal-latest small { display: block; font-size: 10px; margin-top: 4px; color: #677b54; }
.personal-first .arrow-link { margin-top: 7px; font-size: 11px; }
.welcome-steps { display: grid; gap: 20px; margin: 20px 0 24px; }
.welcome-steps > div { display: flex; align-items: flex-start; gap: 12px; }
.welcome-steps > div > span { width: 29px; height: 29px; display: grid; place-items: center; border-radius: 10px; background: #eef5e2; border: 1px solid #dce8cb; color: #58733e; font-size: 10px; font-weight: 750; flex: none; }
.welcome-steps strong { font-size: 12px; color: #365a36; }
.welcome-steps p { font-size: 11px; line-height: 1.7; margin-top: 4px; color: #60744f; }
.home-guest > .btn { margin-top: auto; }
.home-guest-note { margin-top: 13px; text-align: center; font-size: 10px !important; }
.home-guest-note a { font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.community-feed { margin-top: 24px; }
.community-feed .card-head .eyebrow { margin-bottom: 6px; font-size: 9px; color: #687b51; }
.feed-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 30px; }
.feed-grid .list-row { min-width: 0; padding: 17px 0; border-bottom: 1px solid #e7eddf; }
.feed-grid .list-row:nth-last-child(-n + 2) { border-bottom: 0; }
.management-intro { display: flex; align-items: center; justify-content: space-between; gap: 25px; }
.management-intro > div { min-width: 0; position: relative; z-index: 1; }
.management-intro-mark { display: grid; place-items: center; width: 106px; height: 106px; flex: none; border: 1px solid #e1f0c419; background: #f0ffd509; border-radius: 30px; color: #d5e7aa; transform: rotate(-7deg); }
.management-intro-mark svg { width: 61px; height: 61px; stroke-width: 1.2; }
.management-switcher > summary > .management-switcher-icon { display: grid; place-items: center; width: 29px; height: 29px; background: #edf4e2; border: 1px solid #dfe9d0; border-radius: 9px; flex: none; }
.management-switcher > summary > span:nth-child(2) { display: grid; gap: 2px; flex: 1; }
.management-switcher > summary strong { font-size: 12px; font-weight: 700; line-height: 1.5; }
.management-switcher > summary > svg { margin-left: auto; color: #738a60; }
.auth-story-kicker { display: flex; align-items: center; gap: 13px; text-transform: none; letter-spacing: -.1px; font-size: 13px; font-weight: 750; margin-bottom: 0; color: #eaf4d8; position: relative; z-index: 1; }
.auth-story-kicker img, .signup-wrap .auth-story-kicker img { width: 63px; height: 63px; float: none; margin: 0; flex: none; }
.auth-story-kicker small { display: block; font-size: 10px; font-weight: 400; color: #c9dcb6; letter-spacing: .1px; margin-top: 5px; }
.auth-story-copy { margin-top: 28px; position: relative; z-index: 1; }
.auth-story-copy h1 > span { color: #d4e9a5; }
.auth-story > .village-art { width: calc(100% + 56px); height: auto; max-width: none; margin: 22px -28px -15px; opacity: .6; pointer-events: none; }
.auth-story .auth-benefits { position: relative; z-index: 1; }

@media (max-width: 1099px) {
  .home-personal { display: grid; grid-template-columns: 1fr minmax(260px, 1fr); gap: 15px 28px; }
  .home-personal .card-head { grid-column: 1; align-self: end; margin: 0; }
  .home-personal .personal-impact { grid-column: 2; grid-row: 1 / 3; margin: 0; }
  .home-personal .personal-latest { grid-column: 1; margin-top: 0; align-self: start; }
  .home-personal.home-guest { display: flex; }
  .signup-wrap .auth-story > .village-art { position: absolute; width: 280px; right: -30px; bottom: -40px; margin: 0; opacity: .13; }
  .signup-wrap .auth-story-kicker { font-size: 12px; }
  .signup-wrap .auth-story-copy { margin-top: 21px; }
}
@media (max-width: 900px) {
  .home-stage { grid-template-columns: 1fr; }
  .hero.hero-v160 { min-height: 330px; }
  .hero-v160 .village-art { width: 57%; opacity: .64; }
  .topbar-help { min-height: 36px; width: 32px; justify-content: center; }
  .topbar-help span { display: none; }
}
@media (max-width: 680px) {
  .home-personal { display: flex; gap: 0; }
  .home-personal .card-head { margin-bottom: 9px; align-self: stretch; }
  .home-personal .personal-impact { margin: 10px 0 20px; gap: 24px; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .personal-impact .personal-orbit { width: 140px; height: 140px; margin: 0 auto; border-width: 9px; }
  .personal-impact .personal-metrics { gap: 13px; margin: 0; }
  .personal-impact .personal-metrics strong { font-size: 26px; }
  .personal-impact .personal-metrics > div + div { padding-top: 13px; }
  .home-personal .personal-latest { margin-top: auto; align-self: stretch; }
  .hero-v160 .village-art { width: 69%; opacity: .5; }
  .feed-grid { grid-template-columns: 1fr; }
  .feed-grid .list-row:nth-last-child(2) { border-bottom: 1px solid #e7eddf; }
  .date-chip { font-size: 10px; padding: 8px 10px; }
  .management-intro-mark { position: absolute; right: -11px; bottom: -30px; width: 145px; height: 145px; border-radius: 40px; opacity: .17; }
  .management-intro-mark svg { width: 90px; height: 90px; }
  .auth-story > .village-art { position: absolute; width: 290px; right: -30px; bottom: -45px; margin: 0; opacity: .13; }
  .auth-story-kicker { font-size: 12px; }
  .auth-story-kicker img, .signup-wrap .auth-story-kicker img { width: 55px; height: 55px; }
  .auth-story-copy { margin-top: 22px; }
}
@media (max-width: 420px) {
  .topbar-help { width: 26px; }
  .topbar-help svg { width: 17px; height: 17px; }
  .topbar .management-entry .desktop-label { display: none; }
  .topbar .management-entry { padding: 7px; width: 32px; }
  .date-chip { font-size: 10px; padding: 6px 10px; }
  .hero-text-link { font-size: 11px; }
  .hero-v160 .hero-promise { margin-top: 22px; }
  .hero-v160 .village-art { width: 84%; opacity: .4; }
  .home-personal .personal-impact { gap: 20px; margin: 11px 0 20px; }
  .personal-impact .personal-orbit { width: 119px; height: 119px; border-width: 8px; }
  .personal-impact .personal-orbit-core strong { font-size: 33px; }
  .personal-impact .personal-metrics strong { font-size: 25px; }
  .personal-impact .personal-metrics span { font-size: 10px; }
  .personal-latest p { font-size: 11px; }
  .auth-story-kicker, .signup-wrap .auth-story-kicker { font-size: 11px; gap: 12px; }
  .auth-story-kicker small { font-size: 9px; }
}
@media (max-width: 379px) {
  .topbar-right { gap: 5px; }
  .topbar-help { width: 23px; }
  .home-personal .personal-impact { gap: 17px; }
  .personal-impact .personal-orbit { width: 108px; height: 108px; border-width: 7px; }
  .personal-impact .personal-orbit-core strong { font-size: 30px; }
  .personal-impact .personal-metrics strong { font-size: 24px; }
  .personal-impact .personal-metrics span { font-size: 10px; }
  .auth-story-kicker img, .signup-wrap .auth-story-kicker img { width: 49px; height: 49px; }
}

/* On phones the joining story becomes a short banner above the actual form. */
@media (max-width: 680px) {
  .auth-story, .signup-wrap .auth-story { display: block; padding: 22px 24px; min-height: 130px; }
  .auth-story-kicker, .signup-wrap .auth-story-kicker { position: absolute; top: 23px; right: 23px; display: block; margin: 0; }
  .auth-story-kicker > span { display: none; }
  .auth-story-kicker img, .signup-wrap .auth-story-kicker img { display: block; width: 49px; height: 49px; margin: 0; float: none; }
  .auth-story-copy, .signup-wrap .auth-story-copy { margin-top: 0; }
  .auth-story-copy > .eyebrow { font-size: 8px; letter-spacing: 1.25px; line-height: 1.5; max-width: calc(100% - 61px); margin-bottom: 8px; }
  .auth-story h1, .signup-wrap .auth-story h1 { font-size: 27px; line-height: 1.12; letter-spacing: -.9px; max-width: calc(100% - 61px); }
  .auth-story-copy > p, .auth-story .auth-benefits, .auth-story-bottom { display: none; }
  .auth-story > .village-art, .signup-wrap .auth-story > .village-art { width: 250px; right: -25px; bottom: -58px; opacity: .12; }
}
@media (max-width: 379px) {
  .auth-story, .signup-wrap .auth-story { padding: 21px 23px; }
  .auth-story-kicker, .signup-wrap .auth-story-kicker { top: 23px; right: 21px; }
  .auth-story-kicker img, .signup-wrap .auth-story-kicker img { width: 43px; height: 43px; }
  .auth-story h1, .signup-wrap .auth-story h1 { font-size: 25px; max-width: calc(100% - 55px); }
  .auth-story-copy > .eyebrow { max-width: calc(100% - 55px); font-size: 7px; }
}

/* Visible focus is the last component override, including the dark sidebar. */
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible,
textarea:focus-visible, summary:focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 3px;
}
.sidebar a:focus-visible { outline-color: #e4efb0; outline-offset: 2px; }
.hero-v160 a:focus-visible, .account-top a:focus-visible, .account-top button:focus-visible { outline-color: #eef7cc; }
.bottom-nav a:focus-visible { outline-offset: 1px; }
.field input:focus-visible, .field select:focus-visible, .field textarea:focus-visible,
.search-input:focus-visible { outline-width: 2px; outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation: none !important;
    transition: none !important;
  }
  .btn:hover, .quick-action:hover, .management-shortcut:hover, .admin-tile:hover { transform: none; }
}
/* Historical imports keep source text private in management and contained on phones. */
.history-review-card,.history-table-wrap,.history-review-toolbar{min-width:0;max-width:100%}
.history-review-toolbar{display:flex;align-items:end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:20px 0 12px}
.history-review-toolbar .field{margin:0;min-width:180px}
.history-table{min-width:860px}
.history-table input[type="checkbox"]{width:22px;height:22px;min-width:22px;accent-color:#276345;cursor:pointer}
.history-table input[type="checkbox"]:disabled{cursor:default}
.history-table td small{display:block;line-height:1.5;margin-top:4px}
.history-source-text{max-width:280px;overflow-wrap:anywhere;white-space:normal}
.history-review-text{min-width:190px;max-width:310px;white-space:normal;overflow-wrap:anywhere}
.history-review-text p{font-size:12px;line-height:1.55;margin:7px 0}
.history-reviewed-totals{margin:24px 0 12px;padding-top:18px;border-top:1px solid #d6dfd5}
.history-reviewed-totals h3{font-size:16px;margin:0 0 12px}
#history-review-state{margin:18px 0;padding:14px 16px}
#history-upload-file{max-width:100%;width:100%;padding:12px;overflow:hidden}
#history-preview-slot:empty{display:none}
@media(max-width:600px){.history-review-toolbar{align-items:stretch}.history-review-toolbar .field{width:100%}.history-review-card .card-head{align-items:flex-start}.history-review-card .record-facts{grid-template-columns:1fr 1fr}}

/* Wombles Community: members' conversations beside the existing pick workflows. */
.mobile-community-bar { display: none; }
.community-home-link { display: flex; align-items: center; gap: 20px; margin: 24px 0 30px; padding: 22px 26px; color: #254a35; border: 1px solid #d5e3cb; border-radius: 22px; background: radial-gradient(ellipse at 95% 15%, #e0edbc 0, transparent 36%), #edf4e5; box-shadow: 0 7px 20px #214c2b06; text-decoration: none; }
.community-home-link > span:nth-child(2) { min-width: 0; display: grid; gap: 4px; }
.community-home-link small { font-size: 9px; letter-spacing: 1.5px; text-transform: uppercase; font-weight: 800; color: #4b6544; }
.community-home-link strong { font-size: 20px; letter-spacing: -.5px; }
.community-home-link > span:nth-child(2) > span { font-size: 12px; line-height: 1.65; color: #52654c; }
.community-entry-icon, .community-entry-arrow { display: grid; place-items: center; flex: none; }
.community-entry-icon { width: 56px; height: 56px; border: 1px solid #c9dbb4; border-radius: 19px; background: #ddeaaf80; box-shadow: 0 2px 0 #ffffff80 inset; color: #41632e; transform: rotate(-5deg); }
.community-entry-icon svg { width: 26px; height: 26px; }
.community-entry-arrow { margin-left: auto; width: 37px; height: 37px; border-radius: 50%; background: #fff9; }
.community-entry-arrow svg { width: 18px; height: 18px; }
.community-home-link:hover { border-color: #a4c189; box-shadow: 0 7px 24px #214c2b0c; }
.pick-share-link { display: flex; align-items: center; gap: 7px; width: fit-content; margin-top: 16px; padding-top: 13px; border-top: 1px solid #e3ebdf; font-size: 11px; font-weight: 700; color: #386543; text-decoration: underline; text-underline-offset: 3px; }
.pick-share-link svg { width: 15px; height: 15px; flex: none; }
.community-heading { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 19px; }
.community-heading h1 { margin: 7px 0 10px; }
.community-heading p { font-size: 13px; color: var(--muted); line-height: 1.8; }
.community-heading .btn { flex: none; }
.community-privacy-line { display: flex; align-items: center; gap: 7px; font-size: 11px; color: #536c52; margin-bottom: 26px; line-height: 1.65; }
.community-privacy-line svg { width: 16px; height: 16px; flex: none; }
.community-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(238px, 300px); gap: 28px; align-items: start; }
.community-main, .community-aside, .community-detail, .community-compose-layout, .community-compose-form { min-width: 0; max-width: 100%; }
.community-aside { position: sticky; top: 105px; }
.community-compose-prompt { display: flex; align-items: center; gap: 15px; padding: 22px 24px; background: #fffefa; border-color: #d7e4d1; text-decoration: none; }
.community-compose-prompt .avatar { width: 43px; height: 43px; background: #edf3df; color: #4c6a38; border: 1px solid #dae6ca; flex: none; }
.community-compose-prompt > span:nth-child(2) { min-width: 0; }
.community-compose-prompt strong { display: block; font-size: 13px; line-height: 1.6; }
.community-compose-prompt small { display: block; font-size: 11px; line-height: 1.6; color: var(--muted); margin-top: 2px; }
.community-compose-icon { margin-left: auto; display: grid; place-items: center; width: 38px; height: 38px; background: #eef4e7; border-radius: 12px; color: #557240; flex: none; }
.community-compose-icon svg { width: 20px; height: 20px; }
.community-feed-heading { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin: 24px 3px 14px; }
.community-feed-heading h2 { font-size: 17px; letter-spacing: -.3px; }
#community-feed-list { display: grid; gap: 22px; }
#community-feed-more { margin-top: 20px; }
.community-post { padding: 25px; overflow: hidden; border-color: #dce6d6; }
.community-post.is-pinned { border-color: #c5d9ac; background: linear-gradient(160deg, #fcfff7, #fffefb 50%); }
.community-pinned { display: flex; align-items: center; gap: 7px; color: #4f692e; font-size: 10px; font-weight: 750; padding-bottom: 15px; margin-bottom: 18px; border-bottom: 1px solid #e1ebd5; }
.community-pinned svg { width: 14px; height: 14px; }
.community-post-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.community-author { display: flex; align-items: center; gap: 11px; min-width: 0; }
.community-author > div { min-width: 0; }
.community-author .avatar { width: 40px; height: 40px; flex: none; font-size: 12px; color: #39603d; background: #ecf2e2; border: 1px solid #e0e8d2; }
.community-author strong { display: inline; color: #294c39; font-size: 12px; font-weight: 750; line-height: 1.6; overflow-wrap: anywhere; }
.community-author small { display: block; color: #63705e; font-size: 10px; line-height: 1.5; margin-top: 3px; }
.community-team-label { display: inline-block; margin-left: 7px; padding: 2px 7px; border-radius: 6px; font-size: 8px; font-weight: 800; letter-spacing: .1px; background: #e9f0d4; color: #4c652b; vertical-align: 1px; }
.community-post-text, .community-comment-text { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 14px; line-height: 1.85; color: #344e3e; margin: 21px 0 17px; }
.community-photo-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px; border-radius: 17px; overflow: hidden; margin: 19px 0; background: #e9efe5; }
.community-photo { display: block; min-width: 0; width: 100%; border: 0; padding: 0; position: relative; background: #e6eedd; cursor: zoom-in; text-align: left; overflow: hidden; aspect-ratio: 1.17; }
.community-photo img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .2s ease; }
.community-photo:hover img { transform: scale(1.025); }
.community-photo:focus-visible { outline-offset: -4px; z-index: 1; }
.community-photo-grid.photos-1 { grid-template-columns: 1fr; }
.community-photo-grid.photos-1 .community-photo { aspect-ratio: 1.5; max-height: 460px; }
.community-photo-grid.photos-3 .community-photo:first-child { grid-row: span 2; aspect-ratio: auto; }
.community-photo-caption { position: absolute; left: 0; right: 0; bottom: 0; padding: 26px 12px 10px; background: linear-gradient(transparent, #0b2919d9); color: #fff; font-size: 10px; line-height: 1.6; overflow-wrap: anywhere; pointer-events: none; }
.community-photo-viewer { margin: 0; }
.community-photo-viewer img { display: block; width: 100%; height: auto; max-height: 66dvh; object-fit: contain; border-radius: 15px; background: #eef3e8; }
.community-photo-viewer figcaption { margin-top: 15px; font-size: 13px; line-height: 1.7; overflow-wrap: anywhere; }
.community-pick { display: flex; align-items: flex-start; gap: 12px; border: 1px solid #dce6ce; background: #f3f7ec; border-radius: 15px; padding: 15px; margin: 20px 0; }
.community-pick-icon { display: grid; place-items: center; flex: none; width: 34px; height: 34px; border-radius: 10px; background: #e4edcd; color: #52712f; }
.community-pick-icon svg { width: 19px; height: 19px; }
.community-pick > div { min-width: 0; }
.community-pick strong { font-size: 11px; color: #436234; }
.community-pick p, .community-pick small { display: block; font-size: 11px; line-height: 1.7; margin-top: 3px; color: #5d7054; overflow-wrap: anywhere; }
.community-engagement { display: flex; align-items: center; gap: 17px; margin-top: 22px; padding-top: 16px; border-top: 1px solid #e5ecdd; }
.community-thanks, .community-comments-link, .community-open-link { display: inline-flex; align-items: center; gap: 7px; min-height: 40px; font-size: 11px; font-weight: 700; color: #596d4f; text-decoration: none; }
.community-thanks { border: 1px solid #e0e8d8; border-radius: 11px; padding: 8px 11px; background: #f8faf4; cursor: pointer; }
.community-thanks svg, .community-comments-link svg, .community-open-link svg { width: 17px; height: 17px; flex: none; }
.community-thanks b { font-size: 10px; font-weight: 750; background: #e9f0dc; min-width: 19px; padding: 2px 5px; border-radius: 5px; text-align: center; }
.community-thanks.is-liked { background: #eaf2d8; border-color: #c8daa8; color: #365c2d; }
.community-thanks.is-liked svg { fill: #cfdfa9; }
.community-thanks:disabled { opacity: .65; cursor: wait; }
.community-open-link { margin-left: auto; justify-content: center; width: 37px; border-radius: 50%; background: #f1f5eb; }
.community-post-tools { display: flex; align-items: center; flex-wrap: wrap; gap: 2px 6px; margin-top: 12px; padding-top: 7px; border-top: 1px solid #edf0e7; }
.community-post-tools button, .community-comment-tools button, .community-upload-preview .btn { display: inline-flex; align-items: center; gap: 6px; appearance: none; -webkit-appearance: none; border: 0; border-radius: 8px; background: transparent; color: #45653a; font-family: inherit; font-size: 12px; font-weight: 650; line-height: 1.4; min-height: 38px; padding: 6px 8px; text-align: left; cursor: pointer; }
.community-post-tools button:hover:not(:disabled), .community-comment-tools button:hover:not(:disabled), .community-upload-preview .btn:hover:not(:disabled) { background: #edf3e3; color: #2f5731; transform: none; }
.community-post-tools button:focus-visible, .community-comment-tools button:focus-visible, .community-upload-preview .btn:focus-visible { background: #edf3e3; color: #2f5731; }
.community-post-tools button svg { width: 14px; height: 14px; }
.community-welcome-card { padding: 27px; background: linear-gradient(145deg, #edf5df, #f9fbf3); border-color: #d9e5ca; }
.community-aside-mark { display: grid; place-items: center; width: 45px; height: 45px; margin-bottom: 23px; border: 1px solid #ceddb5; border-radius: 15px; color: #527337; background: #e3edca; }
.community-aside-mark svg { width: 23px; height: 23px; }
.community-welcome-card .eyebrow { font-size: 8px; letter-spacing: 1.3px; color: #637b47; margin-bottom: 9px; }
.community-welcome-card h2 { font-size: 25px; line-height: 1.25; letter-spacing: -.7px; max-width: 210px; }
.community-welcome-card p, .community-compose-note p { font-size: 12px; color: #5b7050; line-height: 1.85; margin-top: 16px; }
.community-welcome-card ul { margin: 20px 0; padding-left: 17px; font-size: 11px; line-height: 1.85; color: #536b46; }
.community-welcome-card li { margin: 8px 0; padding-left: 2px; }
.community-welcome-card .arrow-link { font-size: 11px; }
.community-welcome-card .field-hint { padding-top: 16px; border-top: 1px solid #d9e4cb; font-size: 10px; }
.community-moderation-link { display: flex; align-items: center; gap: 8px; border: 1px solid #dae4d2; border-radius: 14px; padding: 17px; margin-top: 16px; font-size: 11px; font-weight: 700; background: #f9fbf5; color: #4c6b3c; }
.community-moderation-link svg { width: 16px; height: 16px; flex: none; }
.community-moderation-link svg:last-child { margin-left: auto; }
.community-compose-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(230px, 285px); gap: 25px; align-items: start; }
.community-compose-form { padding: 30px; }
.community-compose-form > .community-author { padding-bottom: 25px; margin-bottom: 25px; border-bottom: 1px solid #e3ebdb; }
.community-compose-form .field { margin-bottom: 23px; }
.community-compose-form textarea { min-height: 158px; resize: vertical; line-height: 1.8; }
.community-compose-note { background: #eff5e7; border-color: #dce7cf; }
.community-compose-note h2 { font-size: 22px; line-height: 1.35; }
.community-upload-section { border-top: 1px solid #e2e9d9; padding-top: 22px; }
.community-upload-heading { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 17px; }
.community-upload-heading h2 { font-size: 17px; }
.community-upload-heading p { font-size: 11px; color: #617453; line-height: 1.8; margin-top: 6px; }
.community-upload-heading > span { margin-left: auto; font-size: 11px; font-weight: 700; padding: 6px 9px; background: #edf4e4; border-radius: 8px; flex: none; }
.community-photo-input { padding: 17px; background: #f6f9f1; border: 1px dashed #bfd0aa; border-radius: 14px; }
.community-photo-input label { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; margin-bottom: 12px; color: #3b6033; }
.community-photo-input label svg { width: 19px; height: 19px; }
.community-photo-input input { display: block; max-width: 100%; min-width: 0; width: 100%; font-size: 11px; border: 0; padding: 0; background: transparent; color: #4f6647; }
.community-photo-input input::file-selector-button { border: 1px solid #bccfa7; border-radius: 8px; background: #e5efd7; color: #38552c; padding: 10px 12px; margin-right: 8px; cursor: pointer; font: inherit; font-weight: 700; }
.community-photo-input input:disabled { opacity: .65; }
.community-photo-input .field-hint { display: block; margin-top: 12px; font-size: 10px; line-height: 1.75; }
.community-upload-previews { display: grid; gap: 12px; margin-top: 16px; }
.community-upload-preview { display: flex; align-items: flex-start; gap: 15px; padding: 13px; border: 1px solid #e0e7d8; border-radius: 15px; background: #fbfcf8; min-width: 0; }
.community-upload-preview > img { width: 105px; height: 105px; flex: none; object-fit: cover; border-radius: 10px; background: #e9f0de; }
.community-upload-preview > div { min-width: 0; flex: 1; }
.community-upload-preview label { display: block; font-size: 10px; line-height: 1.6; margin-bottom: 6px; font-weight: 700; }
.community-upload-preview input { display: block; width: 100%; min-width: 0; font-size: 12px; border: 1px solid #d5dfcb; padding: 10px; border-radius: 9px; background: #fff; color: #354b30; }
.community-upload-preview small { display: block; font-size: 9px; line-height: 1.6; margin-top: 5px; color: #68785e; overflow-wrap: anywhere; }
.community-upload-preview strong { font-size: 11px; }
.community-upload-preview p { font-size: 11px; line-height: 1.7; margin: 6px 0; overflow-wrap: anywhere; }
.community-upload-preview .btn { margin-top: 4px; }
.community-photo-consent { font-size: 12px; line-height: 1.8; margin: 20px 0 0; padding: 15px; border: 1px solid #d9e3cc; border-radius: 12px; background: #f3f7eb; align-items: flex-start; }
.community-photo-consent input { margin-top: 3px; flex: none; }
.community-compose-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 11px; border-top: 1px solid #e1e9d8; margin-top: 26px; padding-top: 23px; }
.community-compose-form > .field-hint { margin-top: 16px; font-size: 10px; line-height: 1.8; }
.community-preparing { display: flex; align-items: center; gap: 10px; font-size: 12px; color: #4e6d3e; padding: 16px 0; }
.community-preparing .spinner { width: 19px; height: 19px; }
.community-detail { max-width: 790px; margin: 0 auto; }
.community-comments { margin-top: 22px; }
.community-comments .card-head h2 { font-size: 20px; }
.community-comment-form { display: grid; gap: 11px; padding: 19px; border: 1px solid #dce6d0; border-radius: 16px; background: #f5f8ef; margin: 21px 0 13px; }
.community-comment-form > label { font-size: 12px; font-weight: 700; color: #3c5d35; }
.community-comment-form textarea { display: block; width: 100%; min-height: 99px; resize: vertical; border: 1px solid #d5dfca; border-radius: 11px; padding: 12px 14px; background: #fffefa; color: #334e35; font: inherit; font-size: 13px; line-height: 1.8; }
.community-comment-form > div:last-child { display: flex; align-items: center; gap: 12px; justify-content: flex-end; }
.community-comment { padding: 22px 0; border-bottom: 1px solid #e4ebdd; }
.community-comment:last-child { border-bottom: 0; padding-bottom: 3px; }
.community-comment .community-author .avatar { width: 34px; height: 34px; font-size: 10px; }
.community-comment-text { margin: 13px 0 6px 45px; font-size: 13px; }
.community-comment-tools { display: flex; flex-wrap: wrap; gap: 8px; margin-left: 45px; }
.community-moderation-summary { display: flex; align-items: center; justify-content: space-between; gap: 17px; margin: 0 0 24px; padding: 21px 24px; border: 1px solid #d8e4cb; border-radius: 18px; background: #edf5e4; }
.community-moderation-summary > div { display: flex; align-items: center; gap: 11px; }
.community-moderation-summary strong { font-size: 29px; color: #355e35; }
.community-moderation-summary span { font-size: 12px; color: #556d48; }
.community-moderation-list { display: grid; gap: 23px; }
.community-review-card { min-width: 0; }
.community-report-context { background: #f5f8ef; border: 1px solid #e0e8d5; padding: 17px; border-radius: 13px; margin-bottom: 22px; }
.community-report-context .badge { margin-right: 9px; }
.community-report-context > strong { font-size: 11px; overflow-wrap: anywhere; }
.community-report-context small { display: block; font-size: 10px; margin-top: 8px; color: #627358; }
.community-report-context p { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 13px; line-height: 1.85; margin-top: 12px; }
.community-review-card > .actions { margin-top: 19px; padding-top: 19px; border-top: 1px solid #e2ead9; }
.community-review-excerpt { margin: 17px 0; padding: 12px 15px; border-left: 3px solid #b6ca9b; background: #f1f6e9; max-height: 170px; overflow: auto; font-size: 12px; line-height: 1.8; white-space: pre-wrap; overflow-wrap: anywhere; }

@media (max-width: 1199px) {
  .community-layout { grid-template-columns: minmax(0, 1fr) 245px; gap: 20px; }
  .community-compose-layout { grid-template-columns: minmax(0, 1fr); }
  .community-compose-note { display: grid; grid-template-columns: 45px 1fr; gap: 6px 18px; }
  .community-compose-note .community-aside-mark { grid-row: 1 / 5; margin: 0; }
  .community-compose-note h2 { font-size: 19px; }
  .community-compose-note p { margin-top: 3px; }
  .community-welcome-card { padding: 23px; }
}
@media (max-width: 900px) {
  .community-layout { grid-template-columns: minmax(0, 1fr); }
  .community-aside { position: static; }
  .community-welcome-card { display: grid; grid-template-columns: 45px 1fr; gap: 6px 18px; }
  .community-welcome-card .community-aside-mark { grid-row: 1 / 8; margin: 0; }
  .community-welcome-card h2 { font-size: 23px; max-width: none; }
  .community-welcome-card .eyebrow { margin: 0; }
  .community-welcome-card p { margin-top: 4px; }
  .community-welcome-card ul { margin: 5px 0; }
  .community-heading h1 { font-size: 30px; }
}
@media (max-width: 900px) {
  .mobile-community-bar { display: block; padding: 0 25px; background: #edf3e5; border-bottom: 1px solid #dce6d0; }
  .mobile-community-bar a { display: flex; align-items: center; gap: 8px; min-height: 43px; text-decoration: none; color: #44603a; }
  .mobile-community-bar svg { width: 16px; height: 16px; flex: none; }
  .mobile-community-bar strong { font-size: 11px; font-weight: 700; }
  .mobile-community-bar span { font-size: 9px; margin-left: auto; color: #5d734f; }
  .mobile-community-bar a.active { color: #214e2c; }
}
@media (max-width: 680px) {
  .community-page-head { flex-direction: column; align-items: stretch; gap: 16px; }
  .community-page-head > div { min-width: 0; max-width: 100%; }
  .community-page-head > .actions { align-self: flex-start; flex-wrap: wrap; }
  .community-page-head .btn { max-width: 100%; white-space: normal; text-align: left; }
  .community-home-link { gap: 14px; padding: 20px; border-radius: 18px; margin: 21px 0 27px; }
  .community-entry-icon { width: 43px; height: 43px; border-radius: 14px; }
  .community-entry-icon svg { width: 21px; height: 21px; }
  .community-home-link strong { font-size: 17px; }
  .community-home-link small { font-size: 8px; letter-spacing: 1px; }
  .community-home-link > span:nth-child(2) > span { font-size: 11px; }
  .community-entry-arrow { display: none; }
  .community-heading { display: block; margin-bottom: 15px; }
  .community-heading h1 { font-size: 28px; letter-spacing: -.8px; }
  .community-heading .btn { margin-top: 18px; }
  .community-heading p { font-size: 12px; }
  .community-privacy-line { font-size: 10px; margin-bottom: 22px; align-items: flex-start; }
  .community-compose-prompt { padding: 18px; gap: 12px; border-radius: 18px; }
  .community-compose-prompt strong { font-size: 12px; }
  .community-compose-prompt small { font-size: 10px; }
  .community-compose-prompt .avatar { width: 35px; height: 35px; font-size: 10px; }
  .community-compose-icon { width: 31px; height: 35px; background: transparent; }
  .community-compose-icon svg { width: 18px; height: 18px; }
  .community-post { padding: 20px; border-radius: 20px; }
  .community-post-text { font-size: 13px; margin-top: 18px; }
  .community-author .avatar { width: 36px; height: 36px; font-size: 11px; }
  .community-author strong { font-size: 11px; }
  .community-author small { font-size: 9px; }
  .community-team-label { margin-left: 4px; font-size: 7px; padding: 2px 5px; }
  .community-photo-grid { border-radius: 12px; gap: 4px; margin: 17px -7px; }
  .community-photo-caption { font-size: 9px; padding: 22px 9px 8px; }
  .community-pick { gap: 10px; padding: 12px; border-radius: 12px; }
  .community-pick p, .community-pick small { font-size: 10px; }
  .community-engagement { gap: 12px; margin-top: 18px; padding-top: 13px; }
  .community-thanks, .community-comments-link { font-size: 10px; }
  .community-open-link { width: 29px; height: 34px; min-height: 34px; background: transparent; }
  .community-post-tools { gap: 2px 6px; }
  .community-compose-form { padding: 21px; border-radius: 20px; }
  .community-compose-form .field-hint { font-size: 10px; }
  .community-upload-preview { gap: 11px; padding: 11px; }
  .community-upload-preview > img { width: 72px; height: 85px; }
  .community-upload-preview label { font-size: 10px; }
  .community-upload-preview label .optional { display: block; }
  .community-upload-preview input { font-size: 11px; padding: 8px; }
  .community-photo-consent { font-size: 11px; padding: 12px; }
  .community-compose-actions .btn { min-height: 43px; font-size: 11px; }
  .community-compose-note, .community-welcome-card { padding: 21px; gap: 8px 12px; }
  .community-compose-note .community-aside-mark, .community-welcome-card .community-aside-mark { width: 38px; height: 38px; border-radius: 12px; }
  .community-welcome-card h2 { font-size: 21px; }
  .community-comments { padding: 21px; }
  .community-comment-form { margin: 18px -4px 8px; padding: 14px; }
  .community-comment-text, .community-comment-tools { margin-left: 0; }
  .community-comment { padding: 19px 0; }
  .community-moderation-summary { padding: 18px; flex-wrap: wrap; }
  .community-review-card { padding: 20px; }
  .community-report-context { padding: 14px; }
}
@media (max-width: 379px) {
  .mobile-community-bar { padding: 0 19px; }
  .mobile-community-bar span { display: none; }
  .mobile-community-bar svg:last-child { margin-left: auto; }
  .community-heading h1 { font-size: 26px; }
  .community-post, .community-compose-form, .community-comments { padding: 17px; }
  .community-compose-icon { display: none; }
  .community-post-tools { gap: 2px 6px; }
  .community-engagement { gap: 9px; }
  .community-photo-caption { font-size: 8px; }
  .community-upload-preview { display: block; }
  .community-upload-preview > img { width: 100%; height: 130px; margin-bottom: 10px; }
  .community-compose-note, .community-welcome-card { display: block; }
  .community-compose-note .community-aside-mark, .community-welcome-card .community-aside-mark { margin-bottom: 17px; }
}
@media (prefers-reduced-motion: reduce) { .community-photo:hover img { transform: none; } }


/* Village map controls and explanation stay within the available page width. */
.village-map-page { min-width: 0; max-width: 100%; }
.village-map-page > .page-head { flex-wrap: wrap; align-items: flex-start; }
.village-map-page > .page-head > div:first-child { flex: 1 1 340px; min-width: 0; }
.village-map-page > .page-head > .actions { flex: 0 1 auto; flex-wrap: wrap; min-width: 0; max-width: 100%; }
.village-map-page > .page-head .btn { max-width: 100%; white-space: normal; }
.village-map-page > .section-heading { flex-wrap: wrap; align-items: center; gap: 12px 20px; }
.village-map-page > .section-heading > div:first-child { flex: 1 1 200px; min-width: 0; }
.village-map-page .period-control { flex: 0 1 auto; min-width: 0; max-width: 100%; }
.village-map-page .period-control > svg { display: block; width: 17px; height: 17px; min-width: 17px; flex: 0 0 17px; }
.village-map-page .period-control input { flex: 1 1 165px; min-width: 0; width: 165px; max-width: calc(100% - 25px); box-sizing: border-box; }
.village-map-page .map-banner { align-items: flex-start; gap: 12px; }
.village-map-page .map-banner > svg { display: block; width: 24px; height: 24px; min-width: 24px; flex: 0 0 24px; margin-top: 1px; }
.village-map-page .map-banner p { flex: 1 1 auto; min-width: 0; font-size: 12px; line-height: 1.8; overflow-wrap: anywhere; }
.village-map-page .map-layout { grid-template-columns: minmax(0, 1.5fr) minmax(250px, .75fr); align-items: start; }
.village-map-page .map-layout > * { min-width: 0; max-width: 100%; }
.village-map-page .coverage-map { width: 100%; max-width: 100%; height: clamp(360px, 55vh, 540px); }
.village-map-page .map-area-list { min-width: 0; max-width: 100%; max-height: clamp(300px, 46vh, 450px); }
.village-map-page .map-area-item { min-width: 0; max-width: 100%; white-space: normal; }
.village-map-page .map-area-item strong { min-width: 0; align-items: flex-start; }
.village-map-page .map-area-item strong > svg { width: 16px; height: 16px; min-width: 16px; flex: 0 0 16px; margin-top: 2px; }
.village-map-page .map-area-name { min-width: 0; overflow-wrap: anywhere; }
.village-map-page .map-area-item small, .village-map-page .map-hint { overflow-wrap: anywhere; }
.village-map-page .map-key { min-width: 0; max-width: 100%; flex-wrap: wrap; }
.village-map-page .map-key > span { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
@media (max-width: 990px) {
  .village-map-page .map-layout { grid-template-columns: minmax(0, 1fr); }
  .village-map-page .map-area-list { max-height: 340px; }
}
@media (max-width: 680px) {
  .village-map-page > .page-head { flex-direction: column; align-items: stretch; gap: 15px; }
  .village-map-page > .page-head > div:first-child { flex: none; max-width: 100%; }
  .village-map-page > .page-head > .actions { align-self: flex-start; }
  .village-map-page > .section-heading { flex-direction: column; align-items: stretch; gap: 12px; }
  .village-map-page > .section-heading > div:first-child { flex: none; max-width: 100%; }
  .village-map-page .period-control { align-self: flex-start; width: min(220px, 100%); }
  .village-map-page .period-control input { flex-basis: 0; width: 100%; max-width: calc(100% - 22px); }
  .village-map-page .map-banner { padding: 16px; border-radius: 16px; gap: 11px; }
  .village-map-page .map-banner p { font-size: 11px; }
  .village-map-page .map-layout { gap: 18px; }
  .village-map-page .coverage-map { height: 360px; }
}
@media (max-width: 379px) {
  .village-map-page .coverage-map { height: 320px; }
}

/* Named group attendance keeps personal credit distinct from session totals. */
.group-pick-toggle { align-items: flex-start; padding: 16px; margin: 0 0 21px; border: 1px solid #cfdfbd; border-radius: 15px; background: #eff5e6; font-size: 12px; line-height: 1.75; }
.group-pick-toggle input { flex: none; margin-top: 3px; }
#group-pick-panel { min-width: 0; max-width: 100%; }
.group-pick-intro { display: flex; align-items: flex-start; gap: 12px; margin: 23px 0 17px; }
.group-pick-intro > span { display: grid; place-items: center; flex: none; width: 35px; height: 35px; border-radius: 11px; background: #e7efda; color: #4c6a37; }
.group-pick-intro > span svg { width: 19px; height: 19px; }
.group-pick-intro h3 { font-size: 15px; }
.group-pick-intro p { font-size: 11px; line-height: 1.8; color: #5c6e52; margin-top: 5px; }
.group-attendee-list { display: grid; gap: 12px; }
.group-attendee { min-width: 0; padding: 15px; border: 1px solid #dce5d0; border-radius: 14px; background: #fafcf6; }
.group-attendee-person { display: flex; align-items: center; gap: 10px; }
.group-attendee-person > div { min-width: 0; flex: 1; }
.group-attendee-person .avatar { width: 34px; height: 34px; font-size: 11px; flex: none; }
.group-attendee-person strong { display: block; font-size: 12px; color: #345833; overflow-wrap: anywhere; }
.group-attendee-person small { display: block; font-size: 10px; line-height: 1.65; color: #617354; margin-top: 3px; }
.group-attendee-person .icon-btn { flex: none; width: 35px; height: 35px; border-radius: 10px; }
.group-attendee-time { display: grid; grid-template-columns: minmax(90px, 1fr) minmax(0, 1.2fr) minmax(0, .85fr); align-items: center; gap: 10px; margin-top: 13px; padding-top: 12px; border-top: 1px solid #e1e9d7; }
.group-attendee-time > label { font-size: 10px; font-weight: 700; color: #526c44; }
.group-attendee-time select, .group-attendee-time input, .group-search-controls input { width: 100%; min-width: 0; max-width: 100%; min-height: 41px; padding: 9px 10px; border: 1px solid #c5d3b5; border-radius: 10px; background: #fffefa; color: #345335; font: inherit; font-size: 12px; }
.group-attendee-time .input-unit { min-width: 0; }
.group-attendee-time .input-unit > span { font-size: 9px; padding-right: 8px; }
.group-attendee-time .input-unit input { padding-right: 52px; }
.group-full-time { color: #5a7249; font-size: 11px; line-height: 1.6; }
.group-member-search { padding-top: 19px; margin-top: 18px; border-top: 1px solid #dee7d2; }
.group-member-search > label { font-size: 12px; font-weight: 700; color: #3e6137; display: block; margin-bottom: 9px; }
.group-search-controls { display: flex; align-items: stretch; gap: 9px; }
.group-search-controls input { flex: 1; }
.group-search-controls .btn { flex: none; }
.group-member-search .field-hint { display: block; margin-top: 10px; font-size: 10px; line-height: 1.75; }
.group-member-results { display: grid; gap: 7px; max-height: 300px; overflow: auto; margin-top: 12px; }
.group-member-option { display: flex; align-items: center; gap: 10px; width: 100%; min-width: 0; padding: 11px; min-height: 49px; border: 1px solid #dce6ce; border-radius: 11px; background: #f6f9ef; color: #3c5e32; text-align: left; cursor: pointer; }
.group-member-option:hover { background: #eaf2dc; border-color: #b9cda1; }
.group-member-option .avatar { width: 29px; height: 29px; font-size: 9px; flex: none; }
.group-member-option strong { min-width: 0; font-size: 12px; overflow-wrap: anywhere; }
.group-member-option > span:last-child { margin-left: auto; display: inline-flex; align-items: center; gap: 4px; font-size: 10px; font-weight: 700; flex: none; }
.group-member-option > span:last-child svg { width: 14px; height: 14px; }
.group-anonymous-note { display: flex; align-items: flex-start; gap: 10px; padding: 14px; margin-top: 17px; border-radius: 12px; background: #f0f5e8; border: 1px solid #dce5cc; }
.group-anonymous-note > svg { width: 18px; height: 18px; flex: 0 0 18px; margin-top: 2px; }
.group-anonymous-note p { font-size: 10px; line-height: 1.85; color: #586f49; }
.group-anonymous-note strong { color: #3f6234; }
.shared-pick-owner { display: block; font-size: 10px; margin-top: 7px; color: #5a6e4d; }
.pick-history-card .badge { margin-top: 8px; }
.pick-personal-time { color: #3c6735; font-weight: 700; }

/* Sun Token wallet and local offer store, with separate partner tools. */
.token-page-head { flex-wrap: wrap; }
.token-page-head > div { min-width: 0; }
.token-page-head > .actions { max-width: 100%; flex-wrap: wrap; }
.token-nav { display: flex; flex-wrap: wrap; align-items: stretch; gap: 6px; margin: 0 0 25px; padding: 6px; border: 1px solid #d9e4cb; border-radius: 16px; background: #f7faf1; width: fit-content; max-width: 100%; }
.token-nav a { display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 10px 15px; min-height: 42px; border-radius: 11px; font-size: 12px; color: #566f47; font-weight: 700; text-decoration: none; }
.token-nav a svg { width: 17px; height: 17px; }
.token-nav a.active { color: #edf7db; background: #2d5737; box-shadow: 0 3px 8px #1d422c12; }
.token-nav a:not(.active):hover { background: #eaf2dc; color: #31572f; }
.token-wallet-page, .token-wallet-page > *, .token-offer-grid, .token-claim-list, .vendor-desk-grid, .token-management-section { min-width: 0; max-width: 100%; }
.token-wallet-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(235px, .8fr); gap: 30px; align-items: center; padding: 34px; border-radius: 25px; background: radial-gradient(ellipse at 100% 0, #52723c77, transparent 60%), linear-gradient(140deg, #204e35, #173f2f); color: #f5fae9; box-shadow: 0 12px 30px #183d2711; }
.token-wallet-hero .eyebrow { color: #c3d7a1; font-size: 9px; }
.token-wallet-hero h2 { margin-top: 10px; font-size: 24px; color: #f0f6e0; overflow-wrap: anywhere; }
.wallet-balance { display: flex; align-items: baseline; flex-wrap: wrap; gap: 13px; margin: 20px 0 13px; }
.wallet-balance strong { font-size: 67px; font-weight: 760; letter-spacing: -2.5px; line-height: 1; color: #e3f2b9; overflow-wrap: anywhere; }
.wallet-balance > span { font-size: 15px; max-width: 145px; line-height: 1.6; color: #e4efce; }
.token-wallet-hero > div > p { color: #cbdcb6; font-size: 11px; line-height: 1.75; }
.wallet-rule { display: flex; align-items: center; gap: 7px; margin-top: 20px; font-size: 11px; color: #d2e3b8; }
.wallet-rule svg { width: 16px; height: 16px; flex: none; }
.wallet-progress-card { padding: 25px; border: 1px solid #e1efbd25; border-radius: 19px; background: #e7f1c70d; box-shadow: 0 1px 0 #ffffff08 inset; }
.wallet-progress-card > strong { display: block; font-size: 30px; line-height: 1.25; color: #edf6d6; letter-spacing: -.5px; }
.wallet-progress-card > span { display: block; font-size: 12px; line-height: 1.65; color: #cfdfb7; margin-top: 3px; }
.wallet-progress-card .progress-track { height: 9px; background: #e4efc929; margin: 21px 0 13px; border-radius: 8px; }
.wallet-progress-card .progress-fill { height: 100%; background: #d3e99e; border-radius: inherit; }
.wallet-progress-card p { color: #cdddb6; font-size: 11px; line-height: 1.8; }
.wallet-secondary-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(230px, .8fr); gap: 23px; margin: 25px 0; }
.wallet-secondary-grid > * { min-width: 0; }
.wallet-code-card { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.wallet-code-card > div:first-child { min-width: 0; }
.wallet-code-card .eyebrow { color: #627c44; font-size: 8px; letter-spacing: 1.2px; }
.wallet-code-card h2 { font-size: 24px; margin-top: 10px; line-height: 1.3; }
.wallet-code-card p, .wallet-explainer p { font-size: 11px; line-height: 1.85; margin-top: 13px; color: #5c7050; }
.wallet-code-card .btn { margin-top: 18px; }
.wallet-qr-preview { flex: 0 0 164px; width: 164px; max-width: 100%; border: 1px solid #d8e4c9; border-radius: 12px; padding: 8px; background: #fff; }
.token-qr { display: block; width: 100%; height: auto; max-width: 100%; aspect-ratio: 1; background: #fff; }
.wallet-explainer { background: #f0f6e7; border-color: #d8e4c9; }
.wallet-explainer > .card-head-icon { margin-bottom: 16px; }
.wallet-explainer h2 { font-size: 21px; line-height: 1.4; }
.wallet-claims, .wallet-receipts, .wallet-activity { margin-top: 24px; }
.wallet-claims .card-head, .wallet-receipts .card-head, .wallet-activity .card-head { flex-wrap: wrap; }
.token-claim-list { display: grid; gap: 15px; }
.token-claim-card { border: 1px solid #dce6cf; border-radius: 15px; background: #fbfdf7; padding: 19px; min-width: 0; }
.token-claim-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; }
.token-claim-head > div { min-width: 0; }
.token-claim-head .eyebrow { font-size: 8px; color: #657c4c; letter-spacing: 1px; }
.token-claim-head h3 { font-size: 17px; line-height: 1.45; margin-top: 7px; overflow-wrap: anywhere; }
.token-claim-head p { font-size: 12px; color: #526d43; margin-top: 6px; }
.token-claim-head .badge { flex: none; }
.token-claim-facts { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; font-size: 11px; margin: 15px 0 10px; color: #62774f; }
.token-claim-facts strong { font-size: 15px; color: #365d32; }
.token-claim-actions { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 14px; }
.token-reference { display: block; font-size: 9px; margin-top: 15px; color: #6a7b5d; overflow-wrap: anywhere; }
.token-code-dialog { text-align: center; min-width: 0; }
.token-code-dialog h3 { font-size: 21px; overflow-wrap: anywhere; }
.token-code-dialog p { font-size: 12px; line-height: 1.8; color: #5b704b; margin-top: 13px; }
.token-code-dialog .token-qr { width: 260px; max-width: 100%; margin: 23px auto; border: 1px solid #dce6d1; border-radius: 13px; padding: 7px; }
.token-code-dialog label { display: block; font-size: 11px; font-weight: 700; text-align: left; margin: 20px 0 8px; }
.token-code-input { width: 100%; min-width: 0; max-width: 100%; padding: 12px; border: 1px solid #c9d8b7; border-radius: 10px; color: #345633; background: #f5f9ef; font: 11px ui-monospace, monospace; }
.token-code-dialog .field-hint { font-size: 10px; text-align: left; }
.wallet-time-list > div { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 14px 0; border-bottom: 1px solid #e4ebdb; font-size: 12px; color: #5c724d; }
.wallet-time-list > div:last-child { border-bottom: 0; }
.wallet-time-list > div > span:first-child { display: inline-flex; align-items: center; gap: 9px; }
.wallet-time-list svg { width: 16px; height: 16px; flex: none; }
.store-balance-bar { display: flex; align-items: center; justify-content: space-between; gap: 15px; flex-wrap: wrap; margin-bottom: 21px; padding: 18px 22px; border: 1px solid #d2e0bf; border-radius: 15px; background: #eaf3dd; }
.store-balance-bar > span, .store-balance-bar a { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; color: #45683a; }
.store-balance-bar svg { width: 18px; height: 18px; flex: none; }
.store-balance-bar a { font-size: 11px; font-weight: 700; }
.store-intro { color: #5a6f4e; font-size: 12px; line-height: 1.8; max-width: 720px; margin-bottom: 22px; }
.token-offer-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 23px; }
.token-offer { display: flex; flex-direction: column; min-width: 0; padding: 25px; }
.token-offer-brand { display: flex; align-items: center; gap: 8px; color: #6a8050; font-size: 10px; line-height: 1.65; }
.token-offer-brand svg { width: 19px; height: 19px; flex: none; }
.token-offer-brand span { overflow-wrap: anywhere; }
.token-offer h2 { font-size: 23px; line-height: 1.4; margin-top: 21px; overflow-wrap: anywhere; }
.token-offer > p { font-size: 12px; line-height: 1.85; color: #617453; margin: 14px 0 23px; white-space: pre-wrap; overflow-wrap: anywhere; }
.token-offer-bottom { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; margin-top: auto; margin-bottom: 18px; }
.token-offer-bottom > strong { font-size: 29px; font-weight: 750; letter-spacing: -.5px; color: #365c2f; }
.token-offer-bottom > strong > span { display: block; font-size: 10px; font-weight: 600; letter-spacing: 0; margin-top: 3px; }
.token-offer-bottom .field-hint { font-size: 10px; }
.token-offer > .btn { font-size: 12px; white-space: normal; }
.token-partners { margin-top: 27px; }
.token-partner-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 30px; }
.token-partner-list > article { min-width: 0; padding: 14px 0; border-bottom: 1px solid #e4ebd9; }
.token-partner-list h3 { font-size: 15px; overflow-wrap: anywhere; }
.token-partner-list p { font-size: 11px; line-height: 1.85; color: #5b714c; margin-top: 9px; white-space: pre-wrap; overflow-wrap: anywhere; }
.token-partner-list a { display: inline-flex; align-items: center; gap: 7px; margin-top: 14px; font-size: 11px; font-weight: 700; color: #3f6635; text-decoration: underline; text-underline-offset: 3px; }
.token-partner-list a svg { width: 14px; height: 14px; }
.token-review-summary { padding: 18px; background: #f0f6e7; border: 1px solid #dce7ce; border-radius: 14px; margin-bottom: 23px; }
.token-review-summary .eyebrow { font-size: 8px; color: #66804a; }
.token-review-summary h3 { font-size: 21px; margin: 7px 0 10px; overflow-wrap: anywhere; }
.token-review-summary p { font-size: 12px; color: #5b704b; line-height: 1.85; white-space: pre-wrap; overflow-wrap: anywhere; }
.token-review-summary > strong { display: block; font-size: 17px; margin-top: 14px; color: #386132; }
.token-review-cost { display: flex; align-items: center; justify-content: space-between; gap: 15px; flex-wrap: wrap; padding: 17px 0; margin: 16px 0; border-top: 1px solid #e0e9d4; border-bottom: 1px solid #e0e9d4; }
.token-review-cost > span { font-size: 12px; color: #5d744c; }
.token-review-cost strong { font-size: 21px; color: #315b2b; }
#token-claim-form .check-row, #token-redeem-form .check-row, #token-refund-form .check-row { margin-top: 20px; }
.token-archive-intro { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin-bottom: 24px; }
.token-archive-intro > div:first-child { flex: 1 1 310px; min-width: 0; }
.token-archive-intro h2 { font-size: 21px; }
.token-archive-intro p { font-size: 12px; line-height: 1.85; color: #60744f; margin-top: 10px; }
.vendor-businesses { display: flex; align-items: center; justify-content: space-between; gap: 22px; flex-wrap: wrap; margin-bottom: 24px; background: #f0f6e7; border-color: #d9e4ca; }
.vendor-businesses > div { min-width: 0; }
.vendor-businesses h2 { font-size: 19px; }
.vendor-businesses p { font-size: 12px; line-height: 1.8; color: #566f46; margin-top: 8px; overflow-wrap: anywhere; }
.vendor-businesses .field { margin: 0; min-width: 170px; max-width: 100%; }
.vendor-desk-grid { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 24px; align-items: start; }
.vendor-desk-grid > * { min-width: 0; }
.token-vendor-form .card-head-icon { margin-bottom: 20px; }
.token-vendor-form h2 { font-size: 24px; line-height: 1.4; }
.token-vendor-form > p { font-size: 12px; line-height: 1.9; color: #5c7350; margin: 15px 0 22px; }
.token-vendor-form > .field-hint { font-size: 10px; margin-bottom: 0; }
.vendor-receipts { margin-top: 24px; min-width: 0; }
.vendor-receipts .card-head { flex-wrap: wrap; }
.token-receipt-table { min-width: 610px; }
.token-receipt-table td { white-space: normal; overflow-wrap: anywhere; max-width: 240px; }
.token-receipt-table small { font-size: 10px; line-height: 1.8; }
.token-management-value { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; padding: 20px 24px; border: 1px solid #d4e0c3; border-radius: 17px; background: #edf5e1; margin: 0 0 24px; }
.token-management-value > div { min-width: 0; }
.token-management-value strong { font-size: 13px; color: #3b6131; }
.token-management-value p { font-size: 11px; color: #5f764d; line-height: 1.85; margin-top: 6px; }
.token-management-section + .token-management-section { margin-top: 25px; }
.token-management-section .card-head { flex-wrap: wrap; align-items: flex-start; }
.token-admin-vendors > article, .token-admin-offers > article { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 20px 0; border-top: 1px solid #e1e9d6; }
.token-admin-vendors > article > div:first-child, .token-admin-offers > article > div:first-child { min-width: 0; flex: 1; }
.token-admin-vendors h3, .token-admin-offers h3 { font-size: 17px; line-height: 1.5; overflow-wrap: anywhere; }
.token-admin-vendors p, .token-admin-offers p { font-size: 12px; line-height: 1.8; color: #5f754e; margin-top: 10px; white-space: pre-wrap; overflow-wrap: anywhere; }
.token-admin-vendors small, .token-admin-offers small { display: block; font-size: 10px; line-height: 1.8; color: #60764e; margin-top: 7px; overflow-wrap: anywhere; }
.token-admin-vendors .badge { margin-top: 7px; }
.token-admin-vendors .actions { flex: none; flex-wrap: wrap; max-width: 250px; }
.token-admin-offers .eyebrow { font-size: 8px; letter-spacing: 1px; color: #637e48; margin-bottom: 6px; }
.token-staff-current { margin-bottom: 22px; }
.token-staff-current > div { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 11px; padding: 13px 0; border-bottom: 1px solid #e2ead7; }
.token-staff-current strong { display: block; font-size: 12px; overflow-wrap: anywhere; }
.token-staff-current small { display: block; font-size: 10px; line-height: 1.75; margin-top: 5px; color: #63774e; overflow-wrap: anywhere; }
.token-vendor-filter { max-width: 330px; margin: 22px 0; }
.token-admin-owner { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 22px; }
.partner-bottom-nav { grid-template-columns: repeat(3, minmax(0, 1fr)); }

@media (max-width: 1199px) {
  .wallet-secondary-grid { grid-template-columns: minmax(0, 1fr); }
  .wallet-code-card { justify-content: flex-start; }
  .wallet-qr-preview { margin-left: auto; }
  .token-offer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .vendor-desk-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 680px) {
  .group-attendee { padding: 13px; }
  .group-attendee-time { grid-template-columns: minmax(0, 1fr) minmax(0, .8fr); }
  .group-attendee-time > label { grid-column: 1 / -1; }
  .group-search-controls { flex-wrap: wrap; }
  .group-search-controls input { flex-basis: 190px; }
  .group-search-controls .btn { min-height: 40px; }
  .group-pick-toggle { font-size: 11px; padding: 14px; }
  .token-page-head { flex-direction: column; align-items: stretch; gap: 16px; }
  .token-page-head > .actions { align-self: flex-start; }
  .token-nav { width: 100%; gap: 4px; padding: 5px; }
  .token-nav a { flex: 1 1 90px; padding: 9px 8px; min-height: 42px; font-size: 11px; gap: 5px; }
  .token-nav a svg { width: 15px; height: 15px; }
  .token-wallet-hero { grid-template-columns: minmax(0, 1fr); padding: 25px; gap: 24px; border-radius: 22px; }
  .token-wallet-hero h2 { font-size: 22px; }
  .wallet-balance strong { font-size: 58px; }
  .wallet-balance > span { font-size: 13px; }
  .wallet-progress-card { padding: 19px; }
  .wallet-progress-card > strong { font-size: 27px; }
  .wallet-progress-card .progress-track { margin-top: 17px; }
  .wallet-code-card { flex-direction: column; align-items: stretch; gap: 20px; padding: 23px; }
  .wallet-code-card h2 { font-size: 23px; }
  .wallet-qr-preview { margin: 0 auto; flex-basis: auto; width: 190px; }
  .wallet-code-card .btn { white-space: normal; max-width: 100%; }
  .wallet-secondary-grid { gap: 20px; margin: 22px 0; }
  .wallet-claims, .wallet-receipts, .wallet-activity { padding: 21px; }
  .token-claim-card { padding: 15px; }
  .token-claim-head { flex-wrap: wrap; gap: 10px; }
  .token-claim-head h3 { font-size: 16px; }
  .token-claim-facts strong { font-size: 14px; }
  .token-claim-actions .btn { min-height: 40px; font-size: 11px; white-space: normal; max-width: 100%; }
  .token-reference { font-size: 8px; }
  .store-balance-bar { padding: 16px 18px; }
  .store-balance-bar > span { font-size: 12px; }
  .token-offer-grid { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .token-offer { padding: 23px; }
  .token-offer h2 { font-size: 23px; margin-top: 18px; }
  .token-partner-list { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .token-archive-intro { padding: 21px; }
  .token-archive-intro > div:first-child { flex-basis: 100%; }
  .vendor-businesses { padding: 22px; }
  .vendor-businesses .field { width: 100%; }
  .token-vendor-form, .token-vendor-results { padding: 22px; }
  .token-vendor-form h2 { font-size: 22px; }
  .token-admin-vendors > article, .token-admin-offers > article { flex-direction: column; gap: 15px; }
  .token-admin-vendors .actions { max-width: 100%; }
  .token-management-value { padding: 18px 20px; }
  .token-management-section { padding: 22px; }
  .token-staff-current > div { align-items: flex-start; }
  .token-code-dialog .token-qr { width: 230px; }
}
@media (max-width: 379px) {
  .token-wallet-hero { padding: 21px; }
  .wallet-balance { gap: 9px; }
  .wallet-balance strong { font-size: 52px; }
  .wallet-balance > span { max-width: 125px; }
  .wallet-code-card, .wallet-claims, .wallet-receipts, .wallet-activity, .token-offer { padding: 19px; }
  .token-nav a { flex-basis: 70px; font-size: 10px; flex-direction: column; gap: 6px; }
  .group-attendee-time { grid-template-columns: minmax(0, 1fr); }
  .group-search-controls .btn { width: 100%; }
}

.token-dialog-business { font-size: 13px; line-height: 1.8; color: #526b42; overflow-wrap: anywhere; margin: 0 0 18px; }
.token-recovery .actions { flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.token-recovery .btn { max-width: 100%; white-space: normal; }
.token-recovery > div { min-width: 0; }

/* v1.10: real local businesses, clear collection states and partner invitations. */
.token-business-showcase, .token-store-rewards { margin-top: 30px; min-width: 0; }
.token-section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 19px; }
.token-section-heading > div { min-width: 0; }
.token-section-heading .eyebrow, .wallet-claims .eyebrow { display: block; color: #5a7247; font-size: 9px; letter-spacing: 1.4px; margin-bottom: 8px; }
.token-section-heading h2 { font-size: 26px; line-height: 1.35; overflow-wrap: anywhere; }
.token-section-heading p { max-width: 670px; margin-top: 9px; font-size: 12px; line-height: 1.8; color: #526b48; }
.token-section-heading > .text-link { display: inline-flex; align-items: center; gap: 7px; flex: none; font-size: 11px; }
.token-section-heading > .text-link svg { width: 15px; height: 15px; }
.token-partner-total { flex: none; padding: 8px 11px; border-radius: 10px; border: 1px solid #d5e0ca; font-size: 10px; color: #4c6740; background: #edf3e5; }
.token-business-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(255px, 100%), 1fr)); gap: 20px; }
.token-business-card { min-width: 0; display: flex; flex-direction: column; overflow: hidden; border: 1px solid #d7e1cf; border-radius: 20px; background: #fff; box-shadow: 0 5px 22px #20452607; }
.token-business-banner { display: flex; align-items: center; gap: 12px; position: relative; overflow: hidden; min-height: 89px; padding: 18px 23px; color: #ebf3d6; background: linear-gradient(115deg, #315941, #466b4a); }
.token-business-banner > span:nth-child(2) { font-size: 9px; text-transform: uppercase; letter-spacing: 1.6px; font-weight: 750; z-index: 1; }
.token-business-symbol { display: grid; place-items: center; width: 43px; height: 43px; border: 1px solid #eef5dd54; border-radius: 13px; background: #eef6db12; flex: none; z-index: 1; }
.token-business-symbol svg { width: 24px; height: 24px; }
.token-business-flower { position: absolute; right: -11px; top: -26px; opacity: .13; transform: rotate(12deg); }
.token-business-flower svg { width: 145px; height: 145px; }
.token-business-tone-1 .token-business-banner { background: linear-gradient(115deg, #795c36, #967544); color: #fff2db; }
.token-business-tone-2 .token-business-banner { background: linear-gradient(115deg, #385e61, #577a75); color: #e7f5ec; }
.token-business-body { display: flex; flex-direction: column; flex: 1; padding: 22px 23px; min-width: 0; }
.token-business-status { display: flex; align-items: center; gap: 6px; font-size: 10px; font-weight: 700; color: #396131; margin-bottom: 10px; }
.token-business-status svg { width: 14px; height: 14px; flex: none; }
.token-business-status.is-waiting { color: #656d5e; font-weight: 500; }
.token-business-body h3 { font-size: 22px; line-height: 1.4; overflow-wrap: anywhere; }
.token-business-location { display: flex; align-items: flex-start; gap: 6px; margin-top: 10px; font-size: 11px; line-height: 1.7; color: #53694c; white-space: pre-line; overflow-wrap: anywhere; }
.token-business-location svg { width: 14px; height: 14px; flex: none; margin-top: 2px; }
.token-business-copy { margin: 13px 0 21px; font-size: 12px; color: #52664a; line-height: 1.8; overflow-wrap: anywhere; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
.token-business-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-top: auto; }
.token-business-actions .btn { font-size: 11px; min-height: 40px; }
.token-business-actions .text-link { font-size: 11px; }
.token-business-detail { min-width: 0; }
.token-detail-symbol { width: 54px; height: 54px; display: grid; place-items: center; border-radius: 16px; background: #edf4e4; color: #365c38; margin-bottom: 20px; }
.token-detail-symbol svg { width: 27px; height: 27px; }
.token-business-detail > .eyebrow { color: #597343; font-size: 9px; }
.token-business-full-copy { white-space: pre-wrap; font-size: 13px; line-height: 1.9; color: #455e3d; margin-top: 13px; overflow-wrap: anywhere; }
.token-detail-address { display: flex; align-items: flex-start; gap: 11px; padding: 17px 0; margin-top: 9px; color: #46613e; }
.token-detail-address > svg { width: 19px; height: 19px; flex: none; }
.token-detail-address strong { font-size: 11px; }
.token-detail-address p { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 12px; line-height: 1.7; margin-top: 5px; }
.token-business-detail > .text-link { display: inline-flex; align-items: center; gap: 7px; font-size: 12px; }
.token-business-detail > .text-link svg { width: 15px; height: 15px; }
.token-business-availability { padding: 17px 18px; border: 1px solid #dce5d2; border-radius: 13px; background: #f4f8ed; margin-top: 24px; }
.token-business-availability strong { font-size: 13px; }
.token-business-availability p { font-size: 12px; line-height: 1.8; color: #52694a; margin-top: 7px; }
.token-business-filter { min-width: 180px; max-width: 300px; width: 31%; margin: 0; }
.token-business-filter label { font-size: 10px; }
.token-business-filter select { min-height: 42px; font-size: 12px; }
.token-collection-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 18px 20px; margin: 0 0 22px; list-style: none; gap: 20px; border: 1px solid #dbe4d0; border-radius: 15px; background: #f8faf3; }
.token-collection-steps li { display: flex; gap: 10px; min-width: 0; }
.token-collection-steps li > span { display: grid; place-items: center; flex: 0 0 25px; width: 25px; height: 25px; border-radius: 50%; color: #47633b; background: #e8efdc; font-size: 10px; font-weight: 750; }
.token-collection-steps strong { display: block; font-size: 11px; line-height: 1.6; margin-top: 3px; }
.token-collection-steps p { font-size: 10px; line-height: 1.75; color: #5a6e4e; margin-top: 5px; }
.token-ready-empty, .token-offers-empty, .token-catalogue-empty { display: flex; align-items: center; gap: 17px; padding: 20px; border: 1px solid #dce6d1; border-radius: 15px; background: #f6f9f0; min-width: 0; }
.token-ready-empty > div, .token-offers-empty > div, .token-catalogue-empty > div { flex: 1; min-width: 0; }
.token-ready-empty h3, .token-offers-empty h3, .token-catalogue-empty h2 { font-size: 16px; line-height: 1.5; overflow-wrap: anywhere; }
.token-ready-empty p, .token-offers-empty p, .token-catalogue-empty p { font-size: 12px; line-height: 1.8; color: #52694a; margin-top: 5px; max-width: 620px; }
.token-ready-icon, .token-offers-empty > span, .token-catalogue-empty > span { display: grid; place-items: center; width: 43px; height: 43px; border-radius: 13px; color: #496840; background: #e7efda; flex: none; }
.token-ready-icon svg, .token-offers-empty > span svg, .token-catalogue-empty > span svg { width: 22px; height: 22px; }
.token-ready-empty > .btn, .token-offers-empty > .btn { flex: none; }
.token-catalogue-empty { margin-top: 25px; }
.token-section-count { display: inline-flex; vertical-align: middle; align-items: center; justify-content: center; font-size: 11px; width: 25px; height: 25px; border-radius: 50%; background: #eaf1dc; margin-left: 7px; letter-spacing: 0; }
.token-past-reservations { margin-top: 24px; padding: 22px 25px; }
.token-past-reservations > summary { display: flex; align-items: center; justify-content: space-between; gap: 15px; font-size: 13px; font-weight: 700; cursor: pointer; list-style: none; }
.token-past-reservations > summary::-webkit-details-marker { display: none; }
.token-past-reservations > summary span { display: inline-flex; align-items: center; gap: 9px; }
.token-past-reservations > summary svg { width: 17px; height: 17px; flex: none; }
.token-past-reservations[open] > .field-hint { margin: 17px 0; }
.token-past-reservations[open] > summary > span:last-child svg { transform: rotate(90deg); }
.token-activity-empty, .token-invitations-empty { font-size: 12px; line-height: 1.8; color: #536a49; margin: 4px 0 0; }
.token-catalogue-unavailable { margin: 25px 0; padding: 18px; border: 1px solid #dae4cf; border-radius: 13px; font-size: 12px; line-height: 1.8; }
.token-catalogue-unavailable a { display: inline-block; margin-top: 6px; }

.partner-management-intro { display: flex; align-items: center; justify-content: space-between; gap: 25px; padding: 27px 30px; margin-bottom: 24px; border: 1px solid #d4e1c9; border-radius: 22px; background: linear-gradient(110deg, #eef5e5, #e4efda); }
.partner-management-intro > div { min-width: 0; max-width: 680px; }
.partner-management-intro .eyebrow { color: #526e3e; font-size: 9px; }
.partner-management-intro h2 { font-size: 25px; margin-top: 10px; line-height: 1.35; }
.partner-management-intro p { font-size: 12px; line-height: 1.85; color: #506a43; margin-top: 10px; }
.partner-management-intro > .btn { flex: none; }
.token-partner-staff-summary > span { display: block; font-size: 11px; line-height: 1.75; margin-bottom: 7px; }
.token-partner-staff-summary > span small { display: inline; font-weight: 400; }
.token-staff-invite { display: flex; align-items: center; flex-wrap: wrap; gap: 15px; padding: 17px; margin: 20px 0; background: #edf4e4; border: 1px solid #dbe6cd; border-radius: 14px; }
.token-staff-invite > div { flex: 1 1 220px; }
.token-staff-invite strong { font-size: 13px; }
.token-staff-invite p { font-size: 11px; line-height: 1.8; margin-top: 6px; color: #516c43; }
#token-staff-form h3 { font-size: 17px; margin-bottom: 9px; }
#token-staff-form > .field-hint { margin-bottom: 20px; }
.token-invite-counts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 22px 0; }
.token-invite-counts > div { padding: 14px 17px; border: 1px solid #dde6d4; border-radius: 13px; background: #f6f9f0; min-width: 0; }
.token-invite-counts strong { display: block; font-size: 27px; letter-spacing: -.7px; color: #385d32; }
.token-invite-counts span { display: block; font-size: 10px; line-height: 1.6; color: #5a6d4d; margin-top: 6px; }
.token-invitation-filters { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 13px; margin: 20px 0 23px; }
.token-invitation-filters .field { flex: 1 1 210px; margin: 0; min-width: 0; }
.token-invitation-filters label { font-size: 11px; }
.token-invitation-filters select { font-size: 12px; min-height: 42px; }
.token-invitation-filters > button { min-height: 42px; }
.token-invitation-list > article { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 22px 0; border-top: 1px solid #dfe7d6; }
.token-invitation-list > article > div:first-child { min-width: 0; flex: 1; }
.token-invitation-list .eyebrow { display: block; font-size: 8px; color: #597241; margin-bottom: 8px; overflow-wrap: anywhere; }
.token-invitation-list h3 { font-size: 15px; line-height: 1.5; overflow-wrap: anywhere; }
.token-invitation-list p { font-size: 12px; line-height: 1.8; color: #536a48; margin-top: 6px; overflow-wrap: anywhere; }
.token-invitation-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-top: 13px; }
.token-invitation-meta > span:not(.badge) { font-size: 10px; color: #506742; }
.token-invitation-list small { display: block; font-size: 10px; line-height: 1.75; color: #566c4b; margin-top: 11px; overflow-wrap: anywhere; }
.token-invitation-list .token-invitation-error { font-size: 11px; color: #963929; }
.token-invitation-list .actions { flex: none; flex-wrap: wrap; max-width: 210px; }
.token-invite-result h3 { font-size: 20px; line-height: 1.4; overflow-wrap: anywhere; }
.token-invite-result > p { font-size: 12px; line-height: 1.8; color: #546c46; margin-top: 7px; overflow-wrap: anywhere; }
.token-invite-result > .badge { margin-top: 14px; }
.token-invite-delivery { border: 1px solid #dce6d1; border-radius: 13px; padding: 17px; background: #f6f9f0; margin: 20px 0; }
.token-invite-delivery strong { font-size: 12px; }
.token-invite-delivery p { font-size: 12px; color: #52694a; line-height: 1.8; margin-top: 7px; overflow-wrap: anywhere; }
#token-invite-link { font: 11px ui-monospace, monospace; padding: 13px; }
#token-invite-form .notice { margin: 18px 0; }

.vendor-invite-layout { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: 25px; max-width: 1050px; margin: 10px auto; }
.vendor-invite-layout > * { min-width: 0; }
.vendor-invite-story { padding: 37px 34px; color: #f2f7e9; background: radial-gradient(ellipse at 100% 0, #5f7c4966, transparent 68%), linear-gradient(145deg, #28543b, #1a402e); border-radius: 23px; }
.vendor-invite-emblem { display: grid; place-items: center; width: 65px; height: 65px; color: #e0f0ba; background: #ffffff0d; border: 1px solid #e5f1c73b; border-radius: 20px; margin-bottom: 29px; }
.vendor-invite-emblem svg { width: 34px; height: 34px; }
.vendor-invite-story .eyebrow { display: block; font-size: 8px; line-height: 1.8; color: #d3e5b7; letter-spacing: 1.3px; }
.vendor-invite-story h1 { color: #f0f6df; font-size: 34px; line-height: 1.28; margin-top: 16px; }
.vendor-invite-story > p { font-size: 12px; line-height: 1.75; margin-top: 28px; color: #d6e5c2; }
.vendor-invite-story h2 { font-size: 23px; color: #e3f1c5; line-height: 1.4; margin-top: 8px; overflow-wrap: anywhere; }
.vendor-invite-location { display: flex; align-items: flex-start; gap: 8px; font-size: 11px; color: #d4e2c0; line-height: 1.8; margin-top: 13px; white-space: pre-line; overflow-wrap: anywhere; }
.vendor-invite-location svg { width: 16px; height: 16px; flex: none; margin-top: 2px; }
.vendor-invite-purpose { padding-top: 27px; margin-top: 27px; border-top: 1px solid #dcebc12b; }
.vendor-invite-purpose strong { font-size: 13px; color: #e4edcf; }
.vendor-invite-purpose p { font-size: 12px; line-height: 1.85; color: #d0dfbc; margin-top: 9px; }
.vendor-invite-story > small { display: block; font-size: 10px; line-height: 1.8; color: #ccddb4; margin-top: 27px; }
.vendor-invite-content { padding: 34px; }
.vendor-invite-content > .eyebrow { font-size: 9px; color: #5c7447; }
.vendor-invite-content h2 { font-size: 27px; line-height: 1.4; margin-top: 13px; }
.vendor-invite-content > p { font-size: 12px; line-height: 1.85; color: #516948; margin-top: 14px; }
.vendor-invite-content .vendor-invite-lead { margin-bottom: 24px; }
.vendor-invite-content > .btn, #vendor-invitation-form > .btn { margin-top: 20px; }
#vendor-invitation-form .check-row { margin: 17px 0; align-items: flex-start; }
#vendor-invitation-form .check-row a { text-decoration: underline; text-underline-offset: 3px; }
#vendor-invitation-form .check-row input { flex: none; margin-top: 3px; }
#vendor-invite-recovery > p { margin: 20px 0 13px; }
.vendor-invitation-unavailable, .vendor-invitation-success { max-width: 680px; margin: 25px auto; padding: 34px; }
.vendor-invitation-unavailable > .eyebrow, .vendor-invitation-success > .eyebrow { font-size: 9px; color: #5b7248; }
.vendor-invitation-unavailable h1, .vendor-invitation-success h1 { font-size: 30px; line-height: 1.35; margin-top: 13px; }
.vendor-invitation-success h2 { font-size: 22px; line-height: 1.45; margin-top: 19px; overflow-wrap: anywhere; }
.vendor-invitation-unavailable p, .vendor-invitation-success p { font-size: 13px; color: #526c46; line-height: 1.9; margin: 19px 0 25px; }
.vendor-invitation-success .actions { flex-wrap: wrap; }

@media (max-width: 1199px) {
  .token-business-grid { grid-template-columns: repeat(auto-fit, minmax(min(225px, 100%), 1fr)); }
  .token-section-heading { align-items: flex-start; flex-wrap: wrap; gap: 14px; }
  .token-section-heading > .text-link { flex: auto; }
  .token-collection-steps { gap: 13px; padding: 16px; }
  .token-ready-empty { flex-wrap: wrap; }
  .token-ready-empty > .btn { margin-left: 60px; }
  .partner-management-intro { align-items: flex-start; flex-wrap: wrap; gap: 18px; }
  .vendor-invite-layout { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 20px; }
  .vendor-invite-story, .vendor-invite-content { padding: 28px 25px; }
  .vendor-invite-story h1 { font-size: 29px; }
}
@media (max-width: 767px) {
  .token-business-showcase, .token-store-rewards { margin-top: 27px; }
  .token-business-grid { grid-template-columns: minmax(0, 1fr); gap: 17px; }
  .token-section-heading h2 { font-size: 23px; }
  .token-section-heading p { font-size: 12px; }
  .token-business-banner { min-height: 77px; padding: 15px 21px; }
  .token-business-body { padding: 20px 21px; }
  .token-business-body h3 { font-size: 22px; }
  .token-business-copy { -webkit-line-clamp: 4; }
  .token-business-filter { width: 100%; max-width: none; }
  .token-collection-steps { grid-template-columns: minmax(0, 1fr); gap: 14px; padding: 18px; }
  .token-collection-steps p { margin-top: 2px; font-size: 11px; }
  .token-collection-steps strong { font-size: 12px; margin-top: 0; }
  .token-ready-empty, .token-offers-empty, .token-catalogue-empty { padding: 17px; gap: 13px; flex-wrap: wrap; align-items: flex-start; }
  .token-ready-empty > div, .token-offers-empty > div, .token-catalogue-empty > div { flex: 1 1 175px; }
  .token-ready-empty > .btn, .token-offers-empty > .btn { margin-left: 0; width: 100%; }
  .token-past-reservations { padding: 20px; }
  .partner-management-intro { padding: 24px 22px; }
  .partner-management-intro h2 { font-size: 24px; }
  .partner-management-intro > .btn { width: 100%; }
  .token-invite-counts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .token-invitation-list > article { flex-direction: column; gap: 15px; }
  .token-invitation-list .actions { max-width: 100%; }
  .token-invitation-filters { gap: 15px; }
  .token-invitation-filters .field { flex-basis: 100%; }
  .token-invitation-filters > .btn { width: 100%; }
  .token-partner-staff-summary > span small { display: block; margin-top: 0; }
  .vendor-invite-layout { grid-template-columns: minmax(0, 1fr); margin: 0; gap: 16px; }
  .vendor-invite-story { padding: 19px 21px; border-radius: 19px; }
  .vendor-invite-content { padding: 25px; }
  .vendor-invite-emblem, .vendor-invite-purpose { display: none; }
  .vendor-invite-story .eyebrow { line-height: 1.6; letter-spacing: .9px; }
  .vendor-invite-story h1 { font-size: 22px; line-height: 1.25; letter-spacing: -.5px; margin-top: 9px; }
  .vendor-invite-story > p { font-size: 11px; margin-top: 13px; }
  .vendor-invite-story h2 { font-size: 21px; line-height: 1.35; margin-top: 5px; }
  .vendor-invite-location { margin-top: 8px; line-height: 1.65; }
  .vendor-invite-story > small { margin-top: 12px; line-height: 1.65; }
  .vendor-invite-content h2 { font-size: 25px; }
  .vendor-invitation-unavailable, .vendor-invitation-success { padding: 25px; margin: 12px auto; }
  .vendor-invitation-unavailable h1, .vendor-invitation-success h1 { font-size: 27px; }
}

/* An alphabetical community roll remains readable without making Home unbounded. */
.community-recognition-list { max-height: 32rem; overflow-y: auto; overscroll-behavior: contain; }

/* Volunteer mobile readability and touch targets. Keep existing desktop and management layouts. */
@media (max-width: 900px) {
  #pick-form .field input, #pick-form .field select, #pick-form .field textarea,
  .auth-form .field input, .auth-form .field select, .auth-form .field textarea,
  .community-compose-form .field input, .community-compose-form .field select,
  .community-compose-form .field textarea, .community-upload-preview input,
  .community-comment-form textarea, #community-edit-comment-form textarea,
  #community-report-form textarea, .token-business-filter select,
  #token-claim-form .field input, .token-code-input {
    font-size: 16px;
    line-height: 1.5;
  }
  .community-upload-preview input { min-height: 44px; }
  .community-compose-form .field-hint, .community-photo-input .field-hint,
  .community-upload-heading p, .community-upload-preview label,
  .community-upload-preview small, .community-upload-preview p,
  .community-privacy-line, .community-compose-prompt small,
  .community-author small, .community-pick p, .community-pick small,
  .community-photo-caption, .community-comment-form > label,
  .token-code-dialog .field-hint, .token-code-dialog label,
  .token-business-filter label, .token-business-status,
  .token-collection-steps p {
    font-size: 12px;
    line-height: 1.65;
  }
  .community-author strong, .community-compose-prompt strong,
  .community-photo-consent { font-size: 13px; }
  .community-team-label { font-size: 10px; }
  .community-post-text, .community-comment-text { font-size: 14px; }
  .community-engagement, .community-comment-form > div:last-child { flex-wrap: wrap; }
  .community-thanks, .community-comments-link, .community-open-link,
  .community-post-tools button, .community-comment-tools button,
  .community-upload-preview .btn, .community-compose-actions .btn,
  .community-comment-form .btn, .token-nav a,
  .token-claim-actions .btn, .token-business-actions .btn {
    min-width: 44px;
    min-height: 44px;
    font-size: 12px;
  }
  .community-open-link { width: 44px; height: 44px; }
  .community-photo-input input::file-selector-button { min-height: 44px; font-size: 12px; }
  .token-business-actions .text-link {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    font-size: 12px;
  }
  #main:not(.management-page) .wallet-progress-card p,
  #main:not(.management-page) .token-wallet-hero > div > p,
  #main:not(.management-page) .wallet-rule,
  #main:not(.management-page) .wallet-code-card p,
  #main:not(.management-page) .wallet-explainer p,
  #main:not(.management-page) .token-claim-card .field-hint { font-size: 12px; }
  #main:not(.management-page) .token-reference { font-size: 11px; }
}

/* Optional member portraits reuse the established avatar sizes and initials fallback. */
.avatar.member-avatar { position: relative; overflow: hidden; flex-shrink: 0; isolation: isolate; }
.member-avatar-initials { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; line-height: 1; }
.member-avatar > img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center; border-radius: inherit; }
.member-community-badge { max-width: 100%; font-size: 10px; line-height: 1.5; white-space: normal; overflow-wrap: anywhere; }
.member-community-badge.is-developer { color: #44376d; background: #eee9f8; border: 1px solid #dcd2ee; }
.sidebar-profile .member-community-badge { display: inline-block; margin: 4px 0 1px; padding: 2px 6px; font-size: 10px; color: #304525; background: #edf2d9; }
.sidebar-profile .member-community-badge.is-developer { color: #44376d; background: #eee9f8; }
[data-own-badge]:empty { display: none; }
.account-top .member-community-badge { margin: 5px 0 1px; }
.community-recognition-list .member-community-badge, .community-feed .member-community-badge { margin: 3px 0 1px; }
.community-feed .member-avatar { width: 38px; height: 38px; }

/* A separate public-profile form keeps account/password edits independent. */
.profile-appearance-card { min-width: 0; margin-bottom: 24px; }
.profile-appearance-card .card-head { align-items: flex-start; }
.profile-appearance-card .card-head p { max-width: 48rem; }
.profile-appearance-layout { display: grid; grid-template-columns: 96px minmax(0, 1fr); align-items: start; gap: 24px; }
.profile-appearance-preview { width: 96px; max-width: 100%; }
.profile-appearance-preview .avatar { width: 96px; height: 96px; border-radius: 24px; font-size: 29px; }
.profile-appearance-controls { min-width: 0; }
.profile-appearance-name { display: block; font-size: 17px; overflow-wrap: anywhere; }
.profile-appearance-controls > .member-community-badge { margin: 7px 0 0; font-size: 11px; }
.profile-appearance-controls .field { margin-top: 16px; }
.profile-appearance-controls input[type="file"] { display: block; width: 100%; max-width: 100%; min-width: 0; font-size: 14px; }
.profile-appearance-controls input::file-selector-button { min-height: 44px; margin-right: 10px; padding: 8px 12px; font: inherit; border: 1px solid #c4d4b5; border-radius: 8px; color: #294c39; background: #edf3e4; cursor: pointer; }
.profile-appearance-card .field-hint { font-size: 12px; line-height: 1.65; overflow-wrap: anywhere; }
.profile-appearance-card .field-hint + .field-hint { margin-top: 7px; }
.profile-badge-field { margin-top: 24px; max-width: 35rem; }
.profile-badge-field select { max-width: 100%; }
.profile-appearance-status { display: flex; align-items: flex-start; gap: 9px; min-height: 1.5em; margin: 20px 0 15px; font-size: 13px; line-height: 1.6; color: #42573b; }
.profile-appearance-status > svg { width: 19px; height: 19px; flex: none; }
.profile-appearance-memory { margin-top: 16px; }
.profile-appearance-card .actions { flex-wrap: wrap; }
.profile-appearance-card .btn { min-height: 44px; max-width: 100%; white-space: normal; }
.profile-appearance-card .notice + .btn { margin-top: 16px; }
.profile-appearance-card .form-error { margin-bottom: 20px; }
@media (max-width: 600px) {
  .profile-appearance-layout { grid-template-columns: 72px minmax(0, 1fr); gap: 17px; }
  .profile-appearance-preview, .profile-appearance-preview .avatar { width: 72px; }
  .profile-appearance-preview .avatar { height: 72px; border-radius: 19px; font-size: 23px; }
  .profile-appearance-card input, .profile-appearance-card select { font-size: 16px; }
  .profile-appearance-card .member-community-badge, .community-author .member-community-badge { font-size: 11px; }
  .profile-appearance-card .actions > .btn { flex: 1 1 160px; }
}
@media (max-width: 400px) {
  .profile-appearance-layout { grid-template-columns: minmax(0, 1fr); gap: 15px; }
  .profile-appearance-card .card-head-icon { display: none; }
}

/* Organiser notification recipients: local list edits keep the rest of the form intact. */
.notification-recipients { min-width: 0; margin: 20px 0 0; padding: 0; border: 0; }
.notification-recipients legend { padding: 0; font-size: 14px; font-weight: 750; color: #294c39; }
.notification-recipients > .field-hint { margin: 8px 0 14px; line-height: 1.65; }
.notification-recipient-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: end; margin-bottom: 14px; }
.notification-recipient-row .field { min-width: 0; margin: 0; }
.notification-recipient-row input { min-width: 0; max-width: 100%; width: 100%; }
.notification-recipient-row input[aria-invalid="true"] { border-color: #a84539; outline-color: #a84539; }
.notification-remove-email { min-height: 44px; max-width: 100%; font-size: 12px; white-space: normal; }
.notification-recipient-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin: 4px 0 12px; }
.notification-recipient-actions .btn { min-height: 44px; }
.notification-recipient-actions .field-hint { flex: 1 1 150px; margin: 0; line-height: 1.65; }
.notification-settings-recovery:empty { display: none; }
.notification-settings-recovery { margin: 0 0 22px; }
.notification-settings-recovery > .btn { margin-top: 12px; min-height: 44px; max-width: 100%; white-space: normal; }
@media (max-width: 900px) {
  .notification-recipient-row input { font-size: 16px; min-height: 44px; }
  .notification-recipients .field-hint, .notification-recipient-row label { font-size: 12px; line-height: 1.65; }
}
@media (max-width: 600px) {
  .notification-recipient-row { grid-template-columns: minmax(0, 1fr); gap: 8px; padding-bottom: 15px; border-bottom: 1px solid #e2e9da; }
  .notification-remove-email { justify-self: end; }
}

/* Manual Sun Token credit ledger */
.token-adjustment-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.token-adjustment-row span{display:flex;flex-direction:column;gap:.2rem;min-width:0}
.token-adjustment-row small{color:var(--muted,#55695f);overflow-wrap:anywhere}
.token-manual-admin .card-head{align-items:center;gap:1rem;flex-wrap:wrap}
.wallet-manual-note{font-size:.85rem;line-height:1.5;overflow-wrap:anywhere}
@media(max-width:500px){.token-manual-admin .card-head button{width:100%}.token-adjustment-row{align-items:flex-start}.token-adjustment-row strong{max-width:100%}}