:root {
  --bg: #f6f8f4;
  --panel: #ffffff;
  --text: #142018;
  --muted: #66736a;
  --primary: #136f3a;
  --primary-2: #0d5a2e;
  --soft: #e9f5ee;
  --border: #dfe7e1;
  --danger: #b42318;
  --warning: #9a6700;
  --shadow: 0 12px 32px rgba(28, 56, 39, .08);
}
* { box-sizing: border-box; }
html { color-scheme: light; }
body {
  margin: 0;
  background: linear-gradient(180deg, #f0f7f2 0, var(--bg) 320px);
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  min-height: 100vh;
}
button, input, select { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .55; }
a { color: inherit; }
.hidden { display: none !important; }
.topbar {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 12px max(16px, env(safe-area-inset-left));
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--border);
}
.brand-wrap { display:flex; align-items:center; gap:10px; }
.brand-mark {
  width: 42px; height: 42px; border-radius: 14px;
  background: var(--primary); color: white;
  display:grid; place-items:center; font-weight:800;
}
.brand { font-weight:800; letter-spacing:-.02em; }
.tagline { color:var(--muted); font-size:12px; }
.topbar-actions { display:flex; align-items:center; gap:10px; }
.header-statuses { display:flex; align-items:center; gap:7px; flex-wrap:wrap; justify-content:flex-end; }
.review-link,.review-cta {
  text-decoration:none; background:#fff7d6; color:#6b4d00; border:1px solid #efd77c;
  border-radius:999px; padding:9px 13px; font-size:12px; font-weight:900; letter-spacing:.03em;
  box-shadow:0 4px 14px rgba(107,77,0,.08);
}
.review-link:hover,.review-cta:hover { transform:translateY(-1px); background:#ffefad; }
.shell { width:min(960px, 100%); margin:0 auto; padding:24px 16px 80px; }
.panel {
  background:var(--panel); border:1px solid var(--border); border-radius:24px;
  padding:22px; box-shadow:var(--shadow); margin-bottom:18px;
}
.hero { padding:34px 24px; overflow:hidden; position:relative; }
.hero::after { content:""; position:absolute; width:260px; height:260px; border-radius:50%; background:rgba(34,197,94,.07); right:-110px; top:-110px; pointer-events:none; }
.hero h1 { max-width:680px; font-size:clamp(32px, 7vw, 56px); line-height:1.02; letter-spacing:-.045em; margin:8px 0 16px; }
.lead { color:var(--muted); font-size:18px; max-width:700px; }
.eyebrow { margin:0; color:var(--primary); text-transform:uppercase; font-size:12px; letter-spacing:.14em; font-weight:800; }
.hero-grid { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr); gap:26px; align-items:center; }
.hero-copy { position:relative; z-index:1; }
.hero-quote { display:inline-flex; margin-top:10px; padding:10px 14px; border-radius:999px; background:#edf8f0; color:#0d5a2e; font-weight:900; font-size:14px; }
.donation-visual { position:relative; min-height:300px; border-radius:26px; background:linear-gradient(145deg,#fbfffc,#e8f6ec); border:1px solid #cde5d4; display:grid; place-items:center; padding:10px; overflow:hidden; box-shadow:inset 0 0 40px rgba(19,111,58,.05); }
.donation-svg { width:100%; height:auto; max-height:310px; }
.visual-caption { position:absolute; left:18px; right:18px; bottom:14px; display:flex; justify-content:space-between; gap:12px; align-items:center; padding:10px 13px; border-radius:14px; background:rgba(255,255,255,.9); backdrop-filter:blur(8px); border:1px solid rgba(209,225,214,.9); }
.visual-caption span { color:var(--muted); font-size:12px; }
.food-box { transform-origin:center; animation:foodHandoff 3.4s ease-in-out infinite; }
.handoff-arrow { animation:dashMove 2s linear infinite; }
.heart-pop { transform-origin:238px 80px; animation:heartFloat 2.7s ease-in-out infinite; }
.waste-bin { animation:binFade 3.4s ease-in-out infinite; }
@keyframes foodHandoff { 0%,100%{transform:translateX(-18px)} 50%{transform:translateX(18px)} }
@keyframes dashMove { to{stroke-dashoffset:-64} }
@keyframes heartFloat { 0%,100%{transform:translateY(4px) scale(.92);opacity:.65} 50%{transform:translateY(-8px) scale(1.08);opacity:1} }
@keyframes binFade { 0%,100%{opacity:.18} 50%{opacity:.42} }
.impact-ribbon { margin:24px 0 0; display:flex; gap:9px; overflow:auto; scrollbar-width:none; padding-bottom:2px; }
.impact-ribbon::-webkit-scrollbar { display:none; }
.impact-ribbon span { flex:0 0 auto; padding:9px 12px; border-radius:999px; background:#f4f8f4; border:1px solid #dce8df; color:#345043; font-size:12px; font-weight:800; }
.impact-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:16px 0 4px; }
.impact-cards article { border:1px solid var(--border); border-radius:18px; padding:15px; background:linear-gradient(180deg,#fff,#fbfdfb); }
.impact-cards strong { display:block; margin:5px 0 4px; }
.impact-cards p { margin:0; color:var(--muted); font-size:13px; line-height:1.45; }
.impact-icon { font-size:24px; }
.role-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:22px; }
.role-card {
  min-height:170px; text-align:left; border:1px solid var(--border); border-radius:20px;
  background:#fff; padding:22px; display:flex; flex-direction:column; align-items:flex-start; gap:10px;
}
.role-card:hover { transform:translateY(-1px); border-color:#b7c9bc; }
.role-card strong { font-size:22px; }
.role-card small { color:var(--muted); font-size:14px; line-height:1.4; }
.primary-card { background:var(--soft); border-color:#b8d9c4; }
.role-icon { font-size:30px; }
.section-header,.section-row,.composer-head,.location-box { display:flex; align-items:center; justify-content:space-between; gap:14px; }
.section-header { margin:6px 0 18px; }
.section-header h2,.panel h3 { margin:4px 0; }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin:18px 0; }
.form-grid .full { grid-column:1/-1; }
label { display:flex; flex-direction:column; gap:7px; font-weight:700; font-size:14px; }
.optional { color:var(--muted); font-weight:500; }
input,select {
  width:100%; border:1px solid var(--border); background:#fff; color:var(--text); border-radius:13px;
  padding:13px 14px; outline:none;
}
input:focus,select:focus { border-color:#7bb492; box-shadow:0 0 0 3px rgba(19,111,58,.08); }
button { border:0; border-radius:13px; padding:12px 16px; font-weight:800; }
.primary { background:var(--primary); color:white; }
.primary:hover { background:var(--primary-2); }
.secondary { background:var(--soft); color:var(--primary-2); border:1px solid #c5dfce; }
.ghost { background:transparent; color:var(--primary); border:1px solid var(--border); }
.danger { background:#fee4e2; color:var(--danger); }
.full-width { width:100%; }
.location-box { border:1px dashed #b8c9bc; background:#fafcf9; padding:14px; border-radius:16px; margin:16px 0; }
.location-box.compact { margin-top:8px; }
.muted { color:var(--muted); }
.fineprint { color:var(--muted); font-size:12px; line-height:1.5; }
.quality { border-radius:12px; padding:10px 12px; background:#f0f7f2; color:#245b37; font-size:13px; }
.confirm-row {
  display:flex; flex-direction:row; align-items:center; gap:10px; margin:12px 0 16px;
  padding:12px 14px; border:1px solid #cfe0d4; border-radius:14px; background:#fbfdfb;
}
.confirm-row input { width:auto; margin:0; accent-color:var(--primary); }
.notice { padding:13px 15px; border-radius:14px; margin-bottom:16px; }
.notice.warning { background:#fff7db; color:#6d4c00; border:1px solid #f0d88d; }
.badge { display:inline-flex; align-items:center; white-space:nowrap; border-radius:999px; padding:6px 10px; font-size:12px; font-weight:800; }
.badge.neutral { color:#526059; background:#edf1ee; }
.badge.online { color:#075a2b; background:#dcfce7; }
.badge.offline { color:#606a63; background:#ecefed; }
.badge.reserved { color:#3446a5; background:#e6e9ff; }
.camera-shell { border:1px solid var(--border); border-radius:20px; overflow:hidden; background:#111; margin:18px 0; }
.camera-preview { width:100%; max-height:430px; object-fit:cover; display:block; background:#111; }
.camera-placeholder { min-height:240px; display:grid; place-items:center; align-content:center; gap:8px; text-align:center; color:#fff; padding:30px; }
.camera-placeholder span { font-size:42px; }
.camera-placeholder small { color:#cdd3cf; }
.camera-actions { padding:12px; display:flex; justify-content:center; gap:10px; background:#171a18; }
.cards { display:grid; gap:12px; margin-top:14px; }
.card { border:1px solid var(--border); border-radius:18px; padding:14px; background:#fff; }
.food-card { display:grid; grid-template-columns:112px 1fr; gap:14px; }
.food-image { width:112px; height:112px; border-radius:14px; object-fit:cover; background:#eef2ef; }
.card-head { display:flex; justify-content:space-between; align-items:flex-start; gap:10px; }
.card-title { margin:0; font-size:18px; }
.meta { display:flex; flex-wrap:wrap; gap:7px 12px; color:var(--muted); font-size:13px; margin-top:7px; }
.card-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.card-actions button { padding:9px 12px; font-size:13px; }
.filter-block { margin:18px 0; }
#radiusSlider { accent-color:var(--primary); }
.quick-radii { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.quick-radii button { padding:8px 10px; background:#f0f3f1; color:#4c5a51; }
.quick-radii button.active { background:var(--primary); color:white; }
.filters-inline { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:18px 0; }
.dialog { border:0; padding:0; border-radius:20px; width:min(92vw, 460px); box-shadow:0 24px 70px rgba(0,0,0,.25); }
.dialog::backdrop { background:rgba(18,30,22,.55); backdrop-filter:blur(2px); }
.dialog-card { padding:22px; display:grid; gap:16px; }
.dialog-card h3 { margin:0; }
.dialog-actions { display:flex; justify-content:flex-end; gap:10px; flex-wrap:wrap; }
.call-card { text-align:center; }
.speaker-box { text-align:left; border:1px solid var(--border); border-radius:15px; padding:12px; background:#fafcf9; display:grid; gap:7px; }
.speaker-box label { font-size:12px; text-transform:uppercase; letter-spacing:.08em; color:#536158; }
.speaker-row { display:grid; grid-template-columns:1fr auto; gap:8px; }
.speaker-row select { min-width:0; }
.speaker-row button { padding:10px 12px; }
.toast { position:fixed; left:50%; bottom:24px; transform:translateX(-50%); background:#18231c; color:white; padding:12px 16px; border-radius:12px; z-index:100; max-width:min(90vw,540px); box-shadow:0 12px 30px rgba(0,0,0,.2); }
.empty { padding:28px 14px; text-align:center; color:var(--muted); border:1px dashed var(--border); border-radius:16px; }
.status-dot { width:8px; height:8px; border-radius:50%; display:inline-block; background:#9ba59e; margin-right:5px; }
.status-dot.online { background:#16a34a; }
.sync-pending { color:#946200; }
.interest-row { display:flex; align-items:center; justify-content:space-between; gap:10px; border-top:1px solid var(--border); padding-top:10px; margin-top:10px; }
.mission-panel { display:flex; align-items:center; justify-content:space-between; gap:24px; background:linear-gradient(135deg,#103c25,#136f3a); color:#fff; border-color:transparent; }
.mission-copy { max-width:670px; }
.mission-copy .eyebrow { color:#bfe8cc; }
.mission-copy h2 { margin:6px 0 8px; }
.mission-copy p:last-child { color:#d9eadf; margin-bottom:0; line-height:1.55; }
.review-cta { flex:0 0 auto; }
@media (prefers-reduced-motion: reduce) {
  .food-box,.handoff-arrow,.heart-pop,.waste-bin { animation:none !important; }
  .role-card,.review-link,.review-cta { transition:none; }
}
@media (max-width: 760px) {
  .hero-grid { grid-template-columns:1fr; }
  .donation-visual { min-height:260px; }
  .impact-cards { grid-template-columns:1fr; }
  .mission-panel { flex-direction:column; align-items:flex-start; }
}
@media (max-width: 680px) {
  .shell { padding:16px 12px 70px; }
  .panel { border-radius:18px; padding:16px; }
  .role-grid,.form-grid,.filters-inline { grid-template-columns:1fr; }
  .form-grid .full { grid-column:auto; }
  .section-header,.location-box,.composer-head { align-items:flex-start; }
  .location-box { flex-direction:column; }
  .location-box > .card-actions { width:100%; }
  .location-box > .card-actions button { flex:1 1 140px; }
  .food-card { grid-template-columns:88px 1fr; }
  .food-image { width:88px; height:88px; }
  .topbar { align-items:flex-start; }
  .topbar-actions { align-items:flex-end; flex-direction:column; gap:6px; }
  .topbar .badge { max-width:105px; overflow:hidden; text-overflow:ellipsis; }
  .review-link { padding:7px 10px; font-size:11px; }
  .speaker-row { grid-template-columns:1fr; }
}

/* Visibility hardening: state logic may intentionally use .hidden, but every active control stays inside the viewport. */
button,.review-link,.review-cta { max-width:100%; min-width:0; }
.panel,.card,.section-header,.section-row,.composer-head,.location-box,.card-actions,.dialog-actions,.camera-actions,.topbar-actions,.header-statuses { min-width:0; }
.card-actions,.dialog-actions,.camera-actions,.topbar-actions,.header-statuses { flex-wrap:wrap; }
.card-actions button:not(.hidden),.dialog-actions button:not(.hidden),.camera-actions button:not(.hidden),.quick-radii button:not(.hidden),.section-header>button:not(.hidden),.section-row>button:not(.hidden),.review-link,.review-cta {
  min-height:44px;
  white-space:normal;
  overflow-wrap:anywhere;
}
.dialog { max-height:min(92dvh,760px); overflow:auto; overscroll-behavior:contain; }
.shell { padding-bottom:max(130px,calc(94px + env(safe-area-inset-bottom))); }

@media (max-width:760px) {
  .topbar { flex-wrap:wrap; align-items:flex-start; gap:10px; padding-inline:12px; }
  .brand-wrap { min-width:0; }
  .topbar-actions { width:100%; flex-direction:row; align-items:stretch; justify-content:flex-start; flex-wrap:wrap; gap:8px; }
  .header-statuses { flex:1 1 100%; justify-content:flex-start; min-width:0; }
  .topbar .badge { max-width:100%; overflow:visible; text-overflow:clip; white-space:normal; }
  .review-link { display:inline-flex; align-items:center; justify-content:center; min-height:44px; }

  .section-header,.section-row,.composer-head,.location-box { flex-direction:column; align-items:stretch; }
  .section-header>*,.section-row>*,.composer-head>*,.location-box>* { width:100%; max-width:100%; }
  .section-header>button:not(.hidden),.section-row>button:not(.hidden) { width:100%; }

  .card-actions,.dialog-actions,.camera-actions { display:grid; grid-template-columns:1fr; width:100%; gap:8px; }
  .card-actions button:not(.hidden),.dialog-actions button:not(.hidden),.camera-actions button:not(.hidden) { width:100%; }
  .quick-radii { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); width:100%; }
  .quick-radii button:not(.hidden) { width:100%; }
  .role-grid,.form-grid,.filters-inline,.speaker-row { grid-template-columns:1fr!important; }
  .food-card { grid-template-columns:1fr; }
  .food-image { width:100%; height:min(46vw,220px); }
  .mission-panel { align-items:stretch; }
  .mission-panel .review-cta { width:100%; text-align:center; }
  .shell { padding-left:12px; padding-right:12px; padding-bottom:max(170px,calc(130px + env(safe-area-inset-bottom))); }
  .fn-action-dock { left:10px!important; right:10px!important; bottom:max(10px,env(safe-area-inset-bottom))!important; display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px!important; }
  .fn-action-dock button { width:100%; min-width:0; min-height:44px; white-space:normal; }
}

@media (max-width:420px) {
  .quick-radii,.fn-action-dock { grid-template-columns:1fr!important; }
  .visual-caption { left:10px; right:10px; flex-direction:column; align-items:flex-start; }
}

/* === FoodNearby centralized runtime/component styles (Task 1) === */
/* Kindness wallpaper: visual-only; JS owns markup and timing data. */
body{position:relative;isolation:isolate;overflow-x:hidden}
      .topbar,.shell{position:relative;z-index:2}
      .shell{padding-bottom:max(130px,calc(94px + env(safe-area-inset-bottom)))}

      /* Keep the app readable, but do not completely hide the motivational story. */
      .panel:not(.mission-panel):not(.impact-hero),.card,.location-box{
        background-color:rgba(255,255,255,.94)!important;
      }
      .impact-hero{background-color:rgba(255,255,255,.80)!important;backdrop-filter:blur(1.5px)}
      .impact-hero .role-card,.impact-hero .donation-visual,.impact-hero .impact-cards article{
        background-color:rgba(255,255,255,.84)!important;backdrop-filter:blur(1px)
      }
      .camera-shell,.dialog-card{position:relative;z-index:3}

      .fn-kindness-wallpaper{
        position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;contain:strict;
        opacity:.68;background:
          radial-gradient(circle at 10% 16%,rgba(255,153,51,.22),transparent 25%),
          radial-gradient(circle at 90% 20%,rgba(19,111,58,.18),transparent 25%),
          radial-gradient(circle at 50% 84%,rgba(30,85,141,.07),transparent 31%),
          linear-gradient(180deg,#fbfcf8 0%,#f3f8f4 52%,#f8faf8 100%);
      }
      .fn-help-tree{
        position:absolute;left:50%;top:54%;width:min(1060px,96vw);height:min(800px,91vh);
        transform:translate(-50%,-50%);overflow:visible;opacity:.72;
        filter:drop-shadow(0 10px 28px rgba(35,72,47,.10));
      }
      .fn-help-side{
        position:absolute;top:10%;width:clamp(250px,23vw,430px);height:80%;overflow:visible;opacity:.96;
        filter:drop-shadow(0 8px 24px rgba(35,72,47,.10));
      }
      .fn-help-side.left{left:max(8px,1.2vw)}
      .fn-help-side.right{right:max(8px,1.2vw)}
      .fn-help-side .fn-help-branch{stroke:#5e8f70;stroke-width:7;opacity:.52}
      .fn-help-side .fn-stage-caption,.fn-help-side .fn-help-caption{fill:rgba(28,70,44,.64)}
      .fn-help-side .fn-bharat-watermark{fill:rgba(19,111,58,.10)}
      .fn-help-side .fn-node-halo{fill:rgba(255,255,255,.92)}

      .fn-help-title{
        position:absolute;left:50%;top:max(78px,9vh);transform:translateX(-50%);white-space:nowrap;
        font-size:clamp(15px,2vw,28px);font-weight:1000;letter-spacing:.04em;
        color:rgba(28,55,37,.34);text-transform:uppercase;text-align:center;
      }
      .fn-help-title::after{content:'  •  One act inspires many more';font-weight:850;color:rgba(19,111,58,.28)}
      .fn-help-branch{
        fill:none;stroke:url(#fnHelpGradient);stroke-width:7;stroke-linecap:round;
        stroke-dasharray:20 15;opacity:.38;animation:fnBranchFlow 2.7s linear infinite;
      }
      .fn-help-branch.stage1{animation-name:fnBranchFlow,fnStage1Branch;animation-duration:2.7s,12s}
      .fn-help-branch.stage2{animation-name:fnBranchFlow,fnStage2Branch;animation-duration:2.7s,12s}

      .fn-helper-node .fn-node-halo{fill:rgba(255,255,255,.88);stroke:rgba(19,111,58,.23);stroke-width:3}
      .fn-helper-node .fn-person-head{stroke:#31558d;stroke-width:3}
      .fn-helper-node .fn-person-body{fill:none;stroke:#31558d;stroke-width:8;stroke-linecap:round;stroke-linejoin:round}
      .fn-helper-node .fn-person-sash{fill:none;stroke:#ff9933;stroke-width:6;stroke-linecap:round;opacity:.85}
      .fn-helper-node .fn-person-sash-green{fill:none;stroke:#138443;stroke-width:4;stroke-linecap:round;opacity:.85}
      .fn-helper-anim{transform-box:fill-box;transform-origin:center}
      .fn-helper-node.root .fn-helper-anim{animation:fnRootActivate 12s ease-in-out infinite}
      .fn-helper-node.mid .fn-helper-anim{animation:fnMidActivate 12s ease-in-out infinite}
      .fn-helper-node.leaf .fn-helper-anim{animation:fnLeafActivate 12s ease-in-out infinite}
      .fn-node-heart{font-size:30px;opacity:0}
      .fn-helper-node.root .fn-node-heart{animation:fnRootHeart 12s ease-out infinite}
      .fn-helper-node.mid .fn-node-heart{animation:fnMidHeart 12s ease-out infinite}
      .fn-helper-node.leaf .fn-node-heart{animation:fnLeafHeart 12s ease-out infinite}

      .fn-help-packet{filter:drop-shadow(0 6px 9px rgba(0,0,0,.18));opacity:0}
      .fn-help-packet circle{fill:rgba(255,255,255,.98);stroke:rgba(19,111,58,.32);stroke-width:3}
      .fn-help-packet text{font-size:30px;text-anchor:middle;dominant-baseline:central}
      .fn-help-caption{font-size:20px;font-weight:950;fill:rgba(30,64,43,.58);text-anchor:middle}
      .fn-stage-caption{font-size:18px;font-weight:900;fill:rgba(49,85,141,.54);text-anchor:middle}
      .fn-bharat-watermark{font-size:72px;font-weight:1000;letter-spacing:.14em;fill:rgba(19,111,58,.07);text-anchor:middle}
      .fn-tricolor-ribbon{opacity:.34;animation:fnRibbonDrift 15s ease-in-out infinite alternate;transform-origin:center}

      @keyframes fnBranchFlow{to{stroke-dashoffset:-70}}
      @keyframes fnStage1Branch{0%,5%,34%,100%{opacity:.24}10%,28%{opacity:.82}}
      @keyframes fnStage2Branch{0%,34%,74%,100%{opacity:.22}42%,68%{opacity:.76}}
      @keyframes fnRootActivate{
        0%,100%{transform:scale(1);filter:none}
        5%,18%{transform:scale(1.12);filter:drop-shadow(0 0 15px rgba(255,153,51,.72))}
        28%{transform:scale(1.02);filter:none}
      }
      @keyframes fnMidActivate{
        0%,26%,100%{transform:scale(1);filter:none}
        31%,46%{transform:scale(1.12);filter:drop-shadow(0 0 16px rgba(19,132,67,.66))}
        54%{transform:scale(1.02);filter:none}
      }
      @keyframes fnLeafActivate{
        0%,66%,100%{transform:scale(1);filter:none}
        72%,89%{transform:scale(1.12);filter:drop-shadow(0 0 17px rgba(49,85,141,.58))}
        96%{transform:scale(1.02);filter:none}
      }
      @keyframes fnRootHeart{0%,4%,20%,100%{opacity:0;transform:translateY(8px) scale(.7)}9%{opacity:1;transform:translateY(-4px) scale(1.12)}}
      @keyframes fnMidHeart{0%,29%,51%,100%{opacity:0;transform:translateY(8px) scale(.7)}37%{opacity:1;transform:translateY(-5px) scale(1.12)}}
      @keyframes fnLeafHeart{0%,70%,94%,100%{opacity:0;transform:translateY(8px) scale(.7)}80%{opacity:1;transform:translateY(-6px) scale(1.12)}}
      @keyframes fnRibbonDrift{from{transform:translateX(-18px)}to{transform:translateX(24px)}}

      @media(max-width:1320px){
        .fn-help-side{opacity:.66;width:29vw}
        .fn-help-tree{opacity:.84;width:112vw}
      }
      @media(max-width:980px){
        .fn-help-side{display:none}
        .fn-help-tree{opacity:.92;top:55%;width:122vw;height:90vh}
        .impact-hero{background-color:rgba(255,255,255,.76)!important}
      }
      @media(max-width:760px){
        .fn-kindness-wallpaper{opacity:.58}
        .fn-help-tree{top:55%;width:142vw;height:89vh;opacity:.95}
        .fn-help-title{top:88px;font-size:13px}.fn-help-title::after{display:none}
        .fn-help-branch{stroke-width:9}.fn-bharat-watermark{font-size:56px}
        .fn-help-caption{font-size:17px}.fn-stage-caption{font-size:15px}
        .impact-hero{background-color:rgba(255,255,255,.74)!important}
        .impact-hero .role-card,.impact-hero .donation-visual,.impact-hero .impact-cards article{background-color:rgba(255,255,255,.82)!important}
      }
      @media(prefers-reduced-motion:reduce){
        .fn-kindness-wallpaper{opacity:.20}
        .fn-help-branch,.fn-helper-anim,.fn-node-heart,.fn-tricolor-ribbon{animation:none!important}
        .fn-help-packet{display:none}
      }

/* Receiver/enhancement UI. */
body{position:relative;isolation:isolate;overflow-x:hidden}
      .topbar,.shell{position:relative;z-index:2}
      .fn-impact-wallpaper{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;opacity:.18;background:
        radial-gradient(circle at 12% 18%,rgba(255,153,51,.26),transparent 24%),
        radial-gradient(circle at 88% 22%,rgba(19,111,58,.22),transparent 25%),
        radial-gradient(circle at 54% 78%,rgba(255,255,255,.82),transparent 30%),
        linear-gradient(135deg,rgba(255,153,51,.06),rgba(255,255,255,.02) 45%,rgba(19,111,58,.07));}
      .fn-wall-icon{position:absolute;display:grid;place-items:center;width:68px;height:68px;border-radius:22px;background:rgba(255,255,255,.82);border:1px solid rgba(19,111,58,.12);box-shadow:0 12px 34px rgba(19,70,41,.08);font-size:32px;animation:fnFloat 8s ease-in-out infinite;filter:saturate(.95)}
      .fn-wall-icon:nth-child(2n){animation-duration:10s;animation-direction:alternate-reverse}.fn-wall-icon:nth-child(3n){animation-duration:12s}
      .fn-w1{left:3%;top:16%}.fn-w2{right:4%;top:18%}.fn-w3{left:7%;top:58%}.fn-w4{right:8%;top:62%}.fn-w5{left:42%;top:10%}.fn-w6{left:48%;bottom:6%}.fn-w7{right:28%;top:42%}.fn-w8{left:27%;top:38%}
      .fn-india-orbit{position:absolute;right:-42px;top:34%;width:245px;height:245px;border:2px dashed rgba(19,111,58,.32);border-radius:50%;display:grid;place-items:center;animation:fnSpin 28s linear infinite}
      .fn-india-orbit::before{content:'🇮🇳';font-size:80px;animation:fnCounterSpin 28s linear infinite;filter:drop-shadow(0 8px 12px rgba(0,0,0,.08))}
      .fn-india-orbit::after{content:'🍱  →  💚';position:absolute;top:14px;left:50%;transform:translateX(-50%);white-space:nowrap;font-weight:900;color:#136f3a;background:rgba(255,255,255,.88);padding:7px 10px;border-radius:999px}
      .fn-motion-story{position:relative;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;margin:18px 0 4px;padding:14px 16px;border:1px solid #dce8df;border-radius:18px;background:linear-gradient(90deg,#fff8e8,#fff,#edf8f0);overflow:hidden}
      .fn-motion-person{font-size:34px;z-index:2}.fn-motion-lane{height:54px;position:relative;border-radius:999px;background:linear-gradient(90deg,rgba(255,153,51,.12),rgba(19,111,58,.12));overflow:hidden}
      .fn-moving-food{position:absolute;top:8px;left:0;font-size:34px;animation:fnDonateTrip 4.2s ease-in-out infinite;filter:drop-shadow(0 6px 6px rgba(0,0,0,.12))}
      .fn-route-dot{position:absolute;top:25px;left:8%;right:8%;border-top:3px dashed rgba(19,111,58,.28)}
      .fn-motion-tags{position:absolute;left:50%;bottom:3px;transform:translateX(-50%);display:flex;gap:6px;white-space:nowrap;font-size:10px;font-weight:900;color:#2f5e40;text-transform:uppercase;letter-spacing:.05em}
      .fn-no-waste{display:inline-flex;align-items:center;gap:5px}
      .fn-range-note{margin-top:9px;padding:9px 11px;border-radius:12px;background:#f5f8f5;border:1px solid #e0e8e2;color:#526059;font-size:12px;line-height:1.4}
      .fn-range-note.warning{background:#fff8e8;border-color:#eed59a;color:#745719}
      .fn-india-range{background:linear-gradient(90deg,#fff1d6,#fff,#e6f5eb)!important;border:1px solid #e8c56e!important;color:#795400!important;font-weight:900!important}
      .fn-action-dock{position:fixed;right:16px;bottom:max(16px,env(safe-area-inset-bottom));z-index:70;display:flex;gap:8px;align-items:center}
      .fn-action-dock button{border-radius:999px;box-shadow:0 10px 30px rgba(15,70,38,.18);padding:11px 14px;border:1px solid rgba(19,111,58,.16);font-weight:900}
      .fn-review-btn{background:#fff1ae;color:#684a00}.fn-support-btn{background:#136f3a;color:#fff}.fn-linkedin-btn{background:#0a66c2;color:#fff;border-color:#0a66c2!important}
      .impact-cards p{display:none}.impact-cards article{min-height:86px;display:flex;flex-direction:column;justify-content:center}.lead{max-width:560px}
      .mission-copy p:last-child{display:none}
      @keyframes fnFloat{0%,100%{transform:translate3d(0,0,0) rotate(-2deg)}50%{transform:translate3d(0,-18px,0) rotate(3deg)}}
      @keyframes fnDonateTrip{0%{left:1%;transform:rotate(-7deg) scale(.9)}45%,55%{transform:rotate(4deg) scale(1.08)}100%{left:calc(100% - 44px);transform:rotate(-4deg) scale(.92)}}
      @keyframes fnSpin{to{transform:rotate(360deg)}} @keyframes fnCounterSpin{to{transform:rotate(-360deg)}}
      @media(max-width:760px){.fn-impact-wallpaper{opacity:.12}.fn-wall-icon{width:54px;height:54px;font-size:26px}.fn-india-orbit{width:180px;height:180px;right:-70px}.fn-india-orbit::before{font-size:58px}.fn-motion-story{grid-template-columns:auto 1fr auto;padding:11px}.fn-action-dock{right:10px;bottom:max(10px,env(safe-area-inset-bottom));max-width:calc(100vw - 20px);flex-wrap:wrap;justify-content:flex-end}.fn-action-dock button{padding:9px 11px;font-size:12px}}
      @media(prefers-reduced-motion:reduce){.fn-wall-icon,.fn-india-orbit,.fn-india-orbit::before,.fn-moving-food{animation:none!important}}

/* UX hardening/component rules. The retired .fn-help-layer selectors are harmless
   compatibility rules; no JS creates that duplicate wallpaper anymore. */
.fn-help-layer{position:fixed;inset:0;pointer-events:none;z-index:1;overflow:hidden;opacity:.14}
      .fn-help{position:absolute;font-size:clamp(26px,3vw,44px);filter:drop-shadow(0 8px 12px rgba(0,0,0,.08));will-change:transform;animation:fnHelpFloat 11s ease-in-out infinite}
      .fn-help:nth-child(2n){animation-duration:14s;animation-direction:alternate-reverse}.fn-help:nth-child(3n){animation-duration:17s}
      .fn-help-1{left:2%;top:28%}.fn-help-2{right:3%;top:32%}.fn-help-3{left:12%;bottom:13%}.fn-help-4{right:13%;bottom:18%}.fn-help-5{left:46%;top:4%}.fn-help-6{right:32%;top:55%}
      @keyframes fnHelpFloat{0%,100%{transform:translate3d(0,0,0) rotate(-4deg)}50%{transform:translate3d(18px,-24px,0) rotate(5deg)}}
      body.fn-page-hidden .fn-help{animation-play-state:paused}
      #nearbyList .card-actions [data-fn-navigate]{background:#eef8f0;color:#0d5a2e;border:1px solid #b9d9c4}
      #nearbyList .card-actions [data-call]:not(:disabled){box-shadow:0 0 0 2px rgba(19,111,58,.08)}
      @media(max-width:760px){
        .shell{padding-left:10px!important;padding-right:10px!important}.panel{padding:15px!important;border-radius:18px!important}
        .section-header,.section-row,.composer-head,.location-box{align-items:stretch!important;flex-direction:column!important}
        .location-box .card-actions,.card-actions{width:100%}.location-box .card-actions button{flex:1 1 145px}
        .food-card{grid-template-columns:86px minmax(0,1fr)!important;gap:10px!important;padding:11px!important}
        .food-image{width:86px!important;height:86px!important}.card-head{gap:6px}.card-title{font-size:16px!important}
        #nearbyList .card-actions{grid-column:1/-1;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}
        #nearbyList .card-actions button{width:100%!important;min-height:42px}
        .filters-inline,.form-grid{grid-template-columns:1fr!important}.form-grid .full{grid-column:auto!important}
        .topbar{padding:9px 10px!important;gap:8px}.brand-mark{width:36px!important;height:36px!important}.tagline{display:none}
        .header-statuses{max-width:145px}.topbar .badge{font-size:10px!important;padding:5px 7px!important;max-width:140px!important}
        .review-link{display:none}.fn-action-dock{max-width:calc(100vw - 20px);flex-wrap:wrap;justify-content:flex-end}
      }
      @media(max-width:420px){
        .food-card{grid-template-columns:72px minmax(0,1fr)!important}.food-image{width:72px!important;height:72px!important}
        #nearbyList .card-actions{grid-template-columns:1fr!important}.meta{font-size:12px!important}
      }
      @media(min-width:1200px){.shell{width:min(1160px,100%)!important}.cards{gap:14px}.food-card{grid-template-columns:132px 1fr}.food-image{width:132px;height:132px}}
      @media(prefers-reduced-motion:reduce){.fn-help{animation:none!important}}

/* Map picker responsive component rules. */
#mapPickerDialog{width:min(96vw,1040px);max-width:1040px;height:min(calc(var(--fn-map-vh,100dvh) - 18px),820px);max-height:calc(var(--fn-map-vh,100dvh) - 10px);margin:auto;border:0;border-radius:20px;padding:0;overflow:hidden;overscroll-behavior:contain;box-shadow:0 24px 90px rgba(0,0,0,.35)}
    #mapPickerDialog::backdrop{background:rgba(7,18,11,.68);backdrop-filter:blur(3px)}
    .fn-map-card{display:grid;grid-template-rows:auto minmax(0,1fr);height:100%;min-height:0;background:#fff;color:#142018}
    .fn-map-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding:14px 16px 11px;border-bottom:1px solid #e6ece7;background:#fff}.fn-map-head>div{min-width:0}.fn-map-head h3{margin:0 0 4px;line-height:1.2}.fn-map-head p{margin:0;color:#66736a;font-size:13px;line-height:1.4;overflow-wrap:anywhere}
    .fn-map-close{border:0;background:#eef3ef;border-radius:999px;width:44px;height:44px;min-width:44px;min-height:44px;font-size:22px;line-height:1;cursor:pointer;flex:0 0 auto}
    .fn-map-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,360px);min-height:0;height:100%}
    .fn-map-map-pane{min-width:0;min-height:0;display:flex;background:#eef3ef}
    .fn-map-wrap{position:relative;min-width:0;min-height:0;width:100%;height:100%;overflow:hidden}#foodnearbyMap{width:100%;height:100%;min-height:360px;background:#e8eee9}
    .fn-map-crosshair{position:absolute;z-index:5;left:50%;top:50%;width:18px;height:18px;transform:translate(-50%,-50%);pointer-events:none;opacity:.7}.fn-map-crosshair::before,.fn-map-crosshair::after{content:'';position:absolute;background:#136f3a;border-radius:3px;box-shadow:0 0 0 2px rgba(255,255,255,.85)}.fn-map-crosshair::before{width:18px;height:2px;left:0;top:8px}.fn-map-crosshair::after{width:2px;height:18px;left:8px;top:0}
    .fn-map-controls{min-width:0;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scrollbar-gutter:stable;display:flex;flex-direction:column;border-left:1px solid #e3ebe5;background:#fff}
    .fn-map-toolbar{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:12px 14px 8px}.fn-map-toolbar button,.fn-map-actions button,.fn-map-coord-row button{border:0;border-radius:12px;padding:10px 12px;min-height:44px;font:inherit;font-weight:700;cursor:pointer;white-space:normal;line-height:1.2}.fn-map-toolbar .fn-map-india{grid-column:1/-1}
    .fn-map-gps{background:#edf5ff;color:#0b4a84}.fn-map-center{background:#eef8f0;color:#136f3a}.fn-map-india{background:#fff5df;color:#7a5700}.fn-map-confirm{background:#136f3a;color:#fff;flex:1}.fn-map-confirm:disabled{opacity:.5;cursor:not-allowed}.fn-map-cancel{background:#eef3ef;color:#25352b}
    .fn-map-status{padding:2px 14px 8px;font-size:13px;line-height:1.42;color:#59665e;min-height:42px;overflow-wrap:anywhere}
    .fn-map-coords{margin:0 14px 6px;padding:11px 12px;background:#f2faf4;border:1px solid #cfe4d5;border-radius:12px;font:700 13px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;overflow-wrap:anywhere;color:#125b32}
    .fn-map-auto{margin:0 14px 11px;font-size:12px;font-weight:700;line-height:1.4;color:#136f3a}
    .fn-map-advanced{margin:0 14px 12px;border:1px solid #e2e8e3;border-radius:12px;background:#fafcfa}.fn-map-advanced summary{padding:10px 11px;cursor:pointer;font-size:12px;line-height:1.35;color:#657068}.fn-map-coord-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:0 10px 10px}.fn-map-coord-row input{min-width:0;width:100%;border:1px solid #ccd8cf;border-radius:10px;padding:10px 11px;font:600 13px ui-monospace,SFMono-Regular,Menlo,monospace;background:#fff;color:#142018}.fn-map-coord-row button{grid-column:1/-1;background:#fff3d9;color:#6d4c00;border:1px solid #f0d18d}
    .fn-map-actions{position:sticky;bottom:0;z-index:4;display:flex;gap:10px;margin-top:auto;padding:11px 14px max(14px,env(safe-area-inset-bottom));border-top:1px solid #e4ebe6;background:rgba(255,255,255,.97);backdrop-filter:blur(10px)}.fn-map-actions button{min-width:0}
    .fn-map-pin{width:30px;height:30px;border-radius:50% 50% 50% 0;background:#136f3a;border:3px solid white;box-shadow:0 2px 10px rgba(0,0,0,.35);transform:rotate(-45deg)}.fn-map-pin::after{content:'';display:block;width:8px;height:8px;border-radius:50%;background:white;margin:8px}
    .fn-map-fallback{display:flex;align-items:center;justify-content:center;text-align:center;padding:28px;color:#516158;font-weight:700;line-height:1.5}
    @media(max-width:780px){#mapPickerDialog{width:min(96vw,720px);height:min(calc(var(--fn-map-vh,100dvh) - 12px),900px);max-height:calc(var(--fn-map-vh,100dvh) - 6px);border-radius:16px}.fn-map-card{grid-template-rows:auto minmax(0,1fr)}.fn-map-layout{grid-template-columns:1fr;grid-template-rows:minmax(250px,46%) minmax(0,1fr)}.fn-map-map-pane{min-height:0}.fn-map-controls{border-left:0;border-top:1px solid #e3ebe5}#foodnearbyMap{min-height:250px}.fn-map-toolbar{grid-template-columns:repeat(3,minmax(0,1fr))}.fn-map-toolbar .fn-map-india{grid-column:auto}}
    @media(max-width:560px){#mapPickerDialog{width:100vw;max-width:none;height:var(--fn-map-vh,100dvh);max-height:var(--fn-map-vh,100dvh);border-radius:0}.fn-map-head{padding:10px 12px 8px}.fn-map-head p{font-size:12px}.fn-map-layout{grid-template-rows:minmax(220px,42%) minmax(0,1fr)}#foodnearbyMap{min-height:220px}.fn-map-toolbar{grid-template-columns:1fr 1fr;padding:10px 12px 7px}.fn-map-toolbar .fn-map-india{grid-column:1/-1}.fn-map-status{padding-left:12px;padding-right:12px}.fn-map-coords,.fn-map-auto,.fn-map-advanced{margin-left:12px;margin-right:12px}.fn-map-actions{padding-left:12px;padding-right:12px}.fn-map-close{width:42px;height:42px;min-width:42px;min-height:42px}}
    @media(max-width:380px){.fn-map-head p{display:none}.fn-map-layout{grid-template-rows:minmax(205px,40%) minmax(0,1fr)}#foodnearbyMap{min-height:205px}.fn-map-toolbar{grid-template-columns:1fr}.fn-map-toolbar .fn-map-india{grid-column:auto}.fn-map-coord-row{grid-template-columns:1fr}.fn-map-actions{gap:7px}.fn-map-actions button{padding-left:9px;padding-right:9px}}
    @media(max-height:560px) and (min-width:620px){#mapPickerDialog{width:100vw;max-width:none;height:var(--fn-map-vh,100dvh);max-height:var(--fn-map-vh,100dvh);border-radius:0}.fn-map-head{padding:7px 11px}.fn-map-head p{display:none}.fn-map-layout{grid-template-columns:minmax(0,1fr) minmax(280px,40%);grid-template-rows:1fr}.fn-map-controls{border-top:0;border-left:1px solid #e3ebe5}#foodnearbyMap{min-height:0}.fn-map-toolbar{padding-top:8px}.fn-map-status{min-height:34px}.fn-map-actions{padding-bottom:max(8px,env(safe-area-inset-bottom))}}

/* Chat component rules. */
#foodnearbyChatLauncher{position:fixed;right:18px;bottom:18px;z-index:80;border:0;border-radius:999px;padding:13px 17px;background:#136f3a;color:#fff;font-weight:800;box-shadow:0 12px 32px rgba(0,0,0,.2);display:flex;gap:8px;align-items:center}
    #foodnearbyChatLauncher .chat-badge{min-width:20px;height:20px;border-radius:999px;background:#fff;color:#136f3a;display:grid;place-items:center;font-size:11px;padding:0 5px}
    #foodnearbyChatDialog{border:0;padding:0;border-radius:20px;width:min(94vw,560px);height:min(82vh,680px);box-shadow:0 24px 70px rgba(0,0,0,.28)}
    #foodnearbyChatDialog::backdrop{background:rgba(18,30,22,.55);backdrop-filter:blur(2px)}
    .fn-chat-shell{height:100%;display:grid;grid-template-rows:auto 1fr;background:#fff;color:#142018}.fn-chat-head{padding:14px 16px;border-bottom:1px solid #dfe7e1;display:flex;align-items:center;justify-content:space-between;gap:10px}.fn-chat-head h3{margin:0}
    .fn-chat-head button,.fn-chat-thread,.fn-chat-send{border:0;border-radius:12px;font:inherit;font-weight:800;cursor:pointer}.fn-chat-head button{padding:8px 11px;background:#f0f3f1;color:#345043}.fn-chat-view{min-height:0;overflow:hidden;display:grid;grid-template-rows:1fr}
    .fn-chat-threads{padding:12px;overflow:auto;display:grid;align-content:start;gap:9px}.fn-chat-thread{width:100%;text-align:left;padding:12px;background:#fff;border:1px solid #dfe7e1;display:grid;gap:4px}.fn-chat-thread-row{display:flex;justify-content:space-between;gap:10px;align-items:center}.fn-chat-thread small,.fn-chat-muted{color:#66736a}.fn-chat-count{background:#dcfce7;color:#075a2b;border-radius:999px;padding:3px 7px;font-size:11px}.fn-chat-route{font-size:10px;font-weight:800;color:#136f3a}
    .fn-chat-conversation{min-height:0;display:grid;grid-template-rows:auto 1fr auto}.fn-chat-conversation.hidden,.fn-chat-threads.hidden{display:none}.fn-chat-subhead{padding:10px 14px;border-bottom:1px solid #dfe7e1;display:flex;align-items:center;gap:10px}.fn-chat-subhead button{border:0;background:transparent;font-size:18px;cursor:pointer}.fn-chat-messages{padding:14px;overflow:auto;display:flex;flex-direction:column;gap:8px;background:#f7faf7;contain:content}.fn-chat-bubble{max-width:82%;padding:9px 11px;border-radius:14px;background:#fff;border:1px solid #dfe7e1;align-self:flex-start;word-break:break-word;content-visibility:auto;contain-intrinsic-size:56px}.fn-chat-bubble.me{align-self:flex-end;background:#e9f5ee;border-color:#c5dfce}.fn-chat-bubble.pending{opacity:.7}.fn-chat-bubble small{display:block;margin-top:4px;color:#66736a;font-size:10px}
    .fn-chat-form{display:grid;grid-template-columns:1fr auto;gap:8px;padding:12px;border-top:1px solid #dfe7e1}.fn-chat-form textarea{resize:none;min-height:44px;max-height:110px;border:1px solid #dfe7e1;border-radius:12px;padding:10px 12px;font:inherit}.fn-chat-send{background:#136f3a;color:#fff;padding:0 16px}.fn-chat-empty{padding:28px 16px;text-align:center;color:#66736a}.fn-chat-error{padding:10px 12px;margin:10px;border-radius:12px;background:#fff7db;color:#6d4c00;border:1px solid #f0d88d}
    @media(max-width:600px){#foodnearbyChatLauncher{right:12px;bottom:12px}#foodnearbyChatDialog{width:100vw;height:100dvh;max-width:none;max-height:none;border-radius:0;margin:0}.fn-chat-bubble{max-width:88%}}