/* ============================================================
   TOWN 360 — CONCEPT FACE (v25, staged)
   Owner art direction, Oct 31 2026: bright green + black + white,
   matched to the letter of the approved concept.
   Green: #3DDC4E · BG: #000 · Cards: #fff · Safety red: #E5484D
   ============================================================ */
@font-face{
  font-family:'Inter'; src:url('../fonts/Inter-Variable.woff2') format('woff2');
  font-weight:100 900; font-display:swap;
}
:root{
  --green:#3DDC4E; --green-hi:#55E668; --green-deep:#22B83B;
  --green-ink:#04150A;
  --bg:#000000; --panel:#12140F; --panel2:#171A15; --panel3:#1E221C;
  --line:rgba(255,255,255,.10); --line-soft:rgba(255,255,255,.06);
  --ink:#FFFFFF; --ink2:#B9BDB9; --ink3:#7E847E;
  --card:#FFFFFF; --card-ink:#101418; --card-ink2:#3C434B; --card-ink3:#5F6873;
  --card-line:#ECEEF0;
  --red:#E5484D; --red-deep:#C62F35;
  --blue:#2E6BE6; --purple:#A855F7; --amber:#FFB020;
  --col:min(480px,100vw);
  --tabbar-h:64px;
  --r-card:20px;
}
*{box-sizing:border-box; -webkit-tap-highlight-color:transparent}
[hidden]{display:none !important}
html{background:#000}
body{
  margin:0; background:#000; color:var(--ink);
  font-family:'Inter',system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}
button{font:inherit; color:inherit; background:none; border:0; cursor:pointer; padding:0}
input,textarea,select{font:inherit}
#phone{margin:0 auto; max-width:var(--col); min-height:100vh; position:relative; background:#000}
svg.ic{width:24px; height:24px; display:block}
svg.ic *{vector-effect:non-scaling-stroke}

/* ---------------- WELCOME ---------------- */
#view-welcome{
  min-height:100vh; display:flex; flex-direction:column; position:relative;
  background:
    linear-gradient(180deg, rgba(0,0,0,.30) 0%, rgba(0,0,0,.05) 30%, rgba(0,0,0,.55) 58%, #000 78%),
    url('../assets/hero-night.webp') center 18% / cover no-repeat #04140a;
  padding:34px 22px 0;
}
.w-hero{text-align:center; margin-top:8px}
.w-logo{display:flex; flex-direction:column; align-items:center; justify-content:center}
.w-logo svg{width:148px; height:auto; filter:drop-shadow(0 6px 22px rgba(61,220,78,.35))}
.w-tag{margin-top:2px; font-size:15px; font-weight:600; letter-spacing:.14em; color:#fff; text-transform:none}
.w-head{margin:34px 0 0; font-size:37px; line-height:1.12; font-weight:800; letter-spacing:-.01em; text-shadow:0 2px 18px rgba(0,0,0,.65)}
.w-head-g{color:var(--green)}
.w-sub{margin:12px auto 0; max-width:320px; font-size:15.5px; line-height:1.5; color:#EDEFEA; text-shadow:0 1px 10px rgba(0,0,0,.8)}
.w-tiles{display:grid; grid-template-columns:repeat(4,1fr); gap:9px; margin-top:30px}
.w-tile{
  background:rgba(8,18,10,.78); border:1px solid rgba(61,220,78,.22); border-radius:16px;
  padding:13px 4px 11px; display:flex; flex-direction:column; align-items:center; gap:8px;
  font-size:11px; line-height:1.25; font-weight:600; color:#fff; text-align:center;
  backdrop-filter:blur(3px);
}
.w-tile-ic{color:var(--green); display:grid; place-items:center}
.w-tile-ic svg{width:27px; height:27px}
.w-tile:active{border-color:var(--green); background:rgba(20,40,22,.9)}
.w-actions{margin-top:24px; display:flex; flex-direction:column; gap:12px}
.w-cta{
  height:56px; border-radius:999px; font-size:17px; font-weight:800; color:var(--green-ink);
  background:linear-gradient(180deg, var(--green-hi), var(--green) 55%, var(--green-deep));
  box-shadow:0 10px 28px -8px rgba(61,220,78,.55);
}
.w-signin{
  height:56px; border-radius:999px; font-size:17px; font-weight:700; color:#fff;
  border:1.6px solid rgba(255,255,255,.85); background:rgba(0,0,0,.35);
}
.w-browse{align-self:center; font-size:13.5px; font-weight:600; color:var(--ink2); text-decoration:underline; text-underline-offset:3px; padding:2px 8px}
.w-foot{margin-top:auto; padding-top:26px; text-align:center}
.w-foot-line{
  display:flex; align-items:center; gap:12px; font-size:13px; font-weight:600; letter-spacing:.06em; color:#DFF5E2;
}
.w-foot-line::before,.w-foot-line::after{content:""; flex:1; height:1.6px; background:var(--green); opacity:.85; border-radius:2px}
.w-skyline{margin-top:8px; line-height:0}
.w-skyline svg{width:100%; height:34px; display:block}

/* ---------------- APP FRAME ---------------- */
#app{min-height:100vh; display:flex; flex-direction:column}
#topbar{
  position:sticky; top:0; z-index:60; background:rgba(0,0,0,.92); backdrop-filter:blur(10px);
  display:flex; align-items:center; justify-content:space-between;
  padding:10px 14px 8px; border-bottom:1px solid var(--line-soft);
}
.tb-brand{display:flex; align-items:center; gap:8px; cursor:pointer}
.tb-brand svg.mark{width:40px; height:auto}
.tb-word{font-size:23px; font-weight:800; letter-spacing:-.02em; color:#fff}
.tb-word b{color:var(--green); font-weight:800}
.tb-actions{display:flex; align-items:center; gap:6px}
.tb-btn{position:relative; width:40px; height:40px; display:grid; place-items:center; border-radius:50%; color:#fff}
.tb-btn svg{width:25px; height:25px}
.tb-badge{
  position:absolute; top:1px; right:0; min-width:17px; height:17px; padding:0 4px;
  border-radius:999px; background:#C81E1E; color:#fff; font-size:10.5px; font-weight:800;
  display:grid; place-items:center; border:2px solid #000;
}
.tb-badge-bar{top:-3px; right:6px}
#main{flex:1; padding-bottom:calc(var(--tabbar-h) + 14px)}
.view{animation:viewIn .18s ease}
@keyframes viewIn{from{opacity:0; transform:translateY(4px)} to{opacity:1; transform:none}}
#tabbar{
  position:fixed; bottom:0; left:50%; transform:translateX(-50%); width:var(--col); max-width:100vw;
  height:var(--tabbar-h); z-index:60; background:rgba(4,5,4,.96); backdrop-filter:blur(10px);
  border-top:1px solid var(--line-soft);
  display:grid; grid-template-columns:repeat(6,1fr); align-items:start; padding:7px 6px 0;
}
.tab-btn{position:relative; display:flex; flex-direction:column; align-items:center; gap:3px; font-size:10.5px; font-weight:600; color:#C9CCC9; padding-top:2px}
.tab-btn svg{width:24px; height:24px}
.tab-btn.is-active{color:var(--green)}
/* Bottom bar (owner order Nov 6 ~23:03 CST, town-boot-bar): POST sits
 * ALL the way LEFT (first in the bar), HOME took Post's old center
 * spot, and POST is now the SAME size as every other bar button —
 * the old 52px raised circle is gone. POST blinks SLOWLY (~3s gentle
 * pulse); the pulse is off under prefers-reduced-motion. */
.tab-post{position:relative; display:flex; flex-direction:column; align-items:center; gap:3px; font-size:10.5px; font-weight:600; color:#C9CCC9; padding-top:2px; animation:postBlink 3s ease-in-out infinite}
.tab-post>span:first-child{display:grid; place-items:center; color:var(--green)}
.tab-post svg{width:24px; height:24px}
.tab-post-label{margin-top:0}
@keyframes postBlink{0%,100%{opacity:1} 50%{opacity:.38}}
@media (prefers-reduced-motion: reduce){ .tab-post{animation:none} }

/* ---------------- BOOT HOLD (town-boot-bar, Nov 6 2026) ----------------
 * Returning-session splash: index.html's inline head script sets
 * html.boot-hold BEFORE first paint when town360.face.entered==='1',
 * so the welcome/sign-in door never flashes on refresh. face.js init
 * releases the hold after the restore decision; the inline script's
 * 5s failsafe releases it if the app script never arrives. */
#boot-splash{display:none}
html.boot-hold #boot-splash{
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px;
  position:fixed; inset:0; z-index:200; background:#000;
}
html.boot-hold #view-welcome, html.boot-hold #app{visibility:hidden}
.boot-mark{font-size:30px; font-weight:800; letter-spacing:-.02em; color:#fff}
.boot-mark b{color:var(--green); font-weight:800}
.boot-pulse{width:44px; height:44px; border-radius:50%; border:3px solid rgba(61,220,78,.25); border-top-color:var(--green); animation:bootSpin .9s linear infinite}
@keyframes bootSpin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion: reduce){ .boot-pulse{animation:none} }

/* ---------------- FEED ---------------- */
.tabrail{
  display:flex; gap:8px; overflow-x:auto; padding:12px 14px 4px; scrollbar-width:none;
  position:sticky; top:57px; z-index:50; background:rgba(0,0,0,.92); backdrop-filter:blur(10px);
}
.tabrail::-webkit-scrollbar{display:none}
.pill{
  flex:0 0 auto; height:35px; padding:0 15px; border-radius:999px; font-size:14px; font-weight:600;
  background:#1D201D; color:#ECEEEC; display:inline-flex; align-items:center; gap:5px;
}
.pill.is-active{background:var(--green); color:var(--green-ink); font-weight:700}
.pill svg{width:15px; height:15px}
.composer{
  margin:12px 14px 2px; display:flex; align-items:center; gap:10px;
}
.composer-pill{
  flex:1; display:flex; align-items:center; gap:8px; background:#EDEEF0; border-radius:999px;
  height:46px; padding:0 8px 0 16px; color:#59616E; font-size:14px; text-align:left;
}
.composer-pill .cp-txt{flex:1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.composer-pill .cp-ic{width:34px; height:34px; display:grid; place-items:center; color:#3C434B; border-radius:50%}
.composer-pill .cp-ic svg{width:21px; height:21px}
.avatar{
  flex:0 0 auto; border-radius:50%; display:grid; place-items:center; color:#fff;
  font-weight:800; letter-spacing:.01em; overflow:hidden;
}
.av-embed{background:#20262c;color:#fff;font-weight:700}

.avatar.a44{width:44px; height:44px; font-size:15px}
.avatar.a38{width:38px; height:38px; font-size:13.5px}
.avatar.a34{width:34px; height:34px; font-size:12.5px}
.feed-list{padding:6px 12px 4px; display:flex; flex-direction:column; gap:12px}
.post{
  background:var(--card); color:var(--card-ink); border-radius:var(--r-card);
  padding:14px 15px 8px; box-shadow:0 6px 22px -12px rgba(0,0,0,.8);
}
.post-head{display:flex; align-items:flex-start; gap:10px}
.post-id{flex:1; min-width:0}
.post-name{font-size:15px; font-weight:700; display:flex; align-items:center; gap:7px; flex-wrap:wrap}
.hood-chip{font-size:10.5px; font-weight:700; color:#0B6B22; background:#DFF7E3; padding:2px 7px; border-radius:999px}
.post-meta{font-size:12.5px; color:var(--card-ink3); margin-top:1px}
.post-dots{width:32px; height:32px; display:grid; place-items:center; color:#3C434B; border-radius:50%; margin:-4px -6px 0 0}
.post-dots svg{width:20px; height:20px}
.cat-label{display:flex; align-items:center; gap:8px; margin:10px 0 2px; font-size:14px; font-weight:800}
.cat-label .cl-ic{width:30px; height:30px; border-radius:9px; display:grid; place-items:center; color:#fff}
.cat-label .cl-ic svg{width:19px; height:19px}
.cat-label.safety{color:var(--red-deep)} .cat-label.safety .cl-ic{background:var(--red)}
.cat-label.events{color:var(--red-deep)} .cat-label.events .cl-ic{background:#20242a}
.cat-label .cl-time{margin-left:auto; font-size:12.5px; font-weight:600; color:var(--card-ink3)}
.post-body{font-size:14.8px; line-height:1.48; color:#1D232B; margin-top:6px; overflow-wrap:break-word}
.post-body .p-title{font-weight:800; color:#0D1117}
.price-chip{
  display:inline-block; margin-top:9px; font-size:13px; font-weight:800; color:var(--green-ink);
  background:var(--green); padding:4px 11px; border-radius:999px;
}
.post-actions{
  display:flex; align-items:center; gap:4px; margin-top:10px; padding-top:8px;
  border-top:1px solid var(--card-line);
}
.act-btn{display:inline-flex; align-items:center; gap:6px; font-size:13.5px; font-weight:600; color:#3C434B; padding:7px 9px; border-radius:10px}
.act-btn svg{width:20px; height:20px}
.act-btn.is-on{color:#0B6B22}
.act-btn.is-on svg{fill:var(--green); color:#0B6B22}
.act-share{margin-left:auto}
.comments{border-top:1px solid var(--card-line); margin-top:2px; padding-top:10px; display:flex; flex-direction:column; gap:10px}
.comment{display:flex; gap:9px}
.comment .c-body{background:#F3F5F3; border-radius:13px; padding:8px 11px; flex:1}
.comment .c-name{font-size:13px; font-weight:700}
.comment .c-time{font-weight:600; color:var(--card-ink3); font-size:11.5px; margin-left:6px}
.comment .c-txt{font-size:13.8px; line-height:1.42; color:#232A32; margin-top:1px}
.comment-form{display:flex; gap:8px; align-items:center}
.comment-form input{
  flex:1; height:40px; border-radius:999px; border:1px solid var(--card-line); background:#F7F8F7;
  padding:0 14px; font-size:14px; color:var(--card-ink); outline:none;
}
.comment-form input:focus{border-color:var(--green-deep)}
.comment-send{height:40px; padding:0 15px; border-radius:999px; background:var(--green); color:var(--green-ink); font-weight:800; font-size:13.5px}
.empty{
  margin:14px 12px; padding:26px 18px; text-align:center; border:1.4px dashed rgba(255,255,255,.22);
  border-radius:18px; color:var(--ink2);
}
.empty .e-ic{color:var(--green); display:grid; place-items:center; margin-bottom:9px}
.empty .e-ic svg{width:30px; height:30px}
.empty .e-title{font-size:15.5px; font-weight:700; color:#fff}
.empty .e-sub{font-size:13.5px; line-height:1.5; margin-top:4px}
.empty.on-card{border-color:#D8DCD8; color:var(--card-ink2)}
.empty.on-card .e-title{color:var(--card-ink)}

/* ---------------- MAP ---------------- */
.map-wrap{position:relative}
#leafletMap{height:46vh; min-height:320px; width:100%; background:#DCE5D8; z-index:1}
.leaflet-container{font-family:inherit}
.locate-btn{
  position:absolute; right:14px; bottom:14px; z-index:500; width:48px; height:48px; border-radius:50%;
  background:#fff; color:#20242a; display:grid; place-items:center;
  box-shadow:0 6px 18px rgba(0,0,0,.35);
}
.locate-btn svg{width:24px; height:24px}
.pin-house{
  width:34px; height:34px; border-radius:50% 50% 50% 4px; transform:rotate(-45deg);  background:#14181f; border:2px solid var(--green); display:grid; place-items:center;
  box-shadow:0 4px 10px rgba(0,0,0,.4);
}
.pin-house svg{transform:rotate(45deg); width:17px; height:17px; color:var(--green)}
.raw-pin{background:none !important; border:0 !important}
.pin-alert{
  width:32px; height:32px; display:grid; place-items:center; color:#fff;
  filter:drop-shadow(0 3px 6px rgba(0,0,0,.45));
}
.pin-alert svg{width:32px; height:32px}
.you-dot{
  width:20px; height:20px; border-radius:50%; background:#2E6BE6; border:3.5px solid #fff;
  box-shadow:0 0 0 9px rgba(46,107,230,.28), 0 2px 8px rgba(0,0,0,.4);
}
.leaflet-popup-content-wrapper{border-radius:14px; box-shadow:0 10px 30px rgba(0,0,0,.35)}
.leaflet-popup-content{margin:11px 13px; font-size:13.5px; line-height:1.4}
.pop-alert .pa-head{display:flex; align-items:center; gap:7px; font-weight:800; color:var(--red-deep); font-size:14px}
.pop-alert .pa-head svg{width:19px; height:19px; color:var(--red)}
.pop-alert .pa-title{font-weight:700; color:#14181f; margin-top:4px}
.pop-alert .pa-btn{margin-top:8px; display:inline-block; background:var(--green); color:var(--green-ink); font-weight:800; font-size:12.5px; padding:6px 12px; border-radius:999px}
.map-panel{padding:16px 14px 6px}
.mp-head{display:flex; align-items:baseline; justify-content:space-between; margin:4px 2px 12px}
.mp-title{font-size:17.5px; font-weight:800}
.see-all{font-size:13px; font-weight:700; color:var(--green); display:inline-flex; align-items:center; gap:2px}
.see-all svg{width:15px; height:15px}
.circles{display:grid; grid-template-columns:repeat(4,1fr); gap:8px}
.circle-door{display:flex; flex-direction:column; align-items:center; gap:7px; font-size:11.5px; font-weight:600; line-height:1.25; text-align:center; color:#fff}
.circle-door .cd-dot{width:60px; height:60px; border-radius:50%; display:grid; place-items:center; color:#fff; box-shadow:inset 0 -6px 12px rgba(0,0,0,.25)}
.circle-door .cd-dot svg{width:29px; height:29px}
.cd-blue{background:var(--blue)} .cd-green{background:#1FA84A} .cd-green2{background:#23B14D}
.qa-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:9px}
.qa-card{
  background:var(--panel2); border:1px solid var(--line-soft); border-radius:15px;
  padding:13px 4px 11px; display:flex; flex-direction:column; align-items:center; gap:8px;
  font-size:11.5px; font-weight:600; line-height:1.25; text-align:center; color:#fff;
}
.qa-card svg{width:26px; height:26px}
.qa-red{color:#FF5A5F} .qa-blue{color:#5B9BFF} .qa-green{color:var(--green)} .qa-purple{color:#C084FC}

/* incident rows + door cards */
.inc-card{
  background:var(--panel); border:1px solid var(--line-soft); border-radius:17px; padding:14px 15px; margin:0 12px 11px;
}
.inc-head{display:flex; gap:10px; align-items:flex-start}
.inc-ic{width:40px; height:40px; border-radius:12px; background:var(--panel3); display:grid; place-items:center; font-size:20px; flex:0 0 auto}
.inc-title{font-size:15px; font-weight:750; line-height:1.35; flex:1}
.inc-status{font-size:11px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; padding:4px 9px; border-radius:999px; flex:0 0 auto}
.st-reported{background:rgba(229,72,77,.18); color:#FF8A8E}
.st-confirmed{background:rgba(255,176,32,.16); color:var(--amber)}
.st-resolved{background:rgba(61,220,78,.15); color:var(--green)}
.inc-detail{font-size:13.8px; line-height:1.5; color:var(--ink2); margin-top:8px}
.inc-life{display:flex; align-items:center; gap:0; margin-top:12px}
.inc-step{flex:1; text-align:center; position:relative}
.inc-step::before{content:""; position:absolute; top:5px; left:-50%; width:100%; height:2px; background:var(--panel3)}
.inc-step:first-child::before{display:none}
.inc-step.done::before{background:var(--green-deep)}
.inc-step .dot{width:11px; height:11px; border-radius:50%; background:var(--panel3); margin:0 auto; position:relative; z-index:1}
.inc-step.done .dot{background:var(--green)}
.inc-step .s-lab{font-size:10.5px; font-weight:700; color:var(--ink3); margin-top:5px; text-transform:uppercase; letter-spacing:.03em}
.inc-step.done .s-lab{color:#DFF5E2}
.inc-step .s-note{font-size:10.5px; color:var(--ink3)}
.inc-meta{display:flex; gap:12px; margin-top:10px; font-size:12px; color:var(--ink3); flex-wrap:wrap}

/* door scaffolding */
.door-head{
  display:flex; align-items:center; gap:10px; padding:12px 14px 6px;
  position:sticky; top:57px; z-index:50; background:rgba(0,0,0,.92); backdrop-filter:blur(10px);
}
.back-btn{width:38px; height:38px; border-radius:50%; background:var(--panel2); display:grid; place-items:center; color:#fff}
.back-btn svg{width:21px; height:21px}
.door-title{font-size:19px; font-weight:800}
.door-sub{font-size:12.5px; color:var(--ink3)}
.section-note{margin:8px 14px 2px; font-size:13px; line-height:1.5; color:var(--ink2)}
.biz-card{
  background:var(--card); color:var(--card-ink); border-radius:var(--r-card); padding:14px 15px; margin:0 12px 11px;
  box-shadow:0 6px 22px -12px rgba(0,0,0,.8);
}
.biz-top{display:flex; gap:11px; align-items:flex-start}
.biz-id{flex:1; min-width:0}
.biz-name{font-size:15.5px; font-weight:750; display:flex; align-items:center; gap:7px; flex-wrap:wrap}
.feat-chip{font-size:10.5px; font-weight:800; color:var(--green-ink); background:var(--green); border-radius:999px; padding:2.5px 8px}
.biz-meta{font-size:12.5px; color:var(--card-ink3); margin-top:1px}
.biz-rate{display:flex; align-items:center; gap:6px; margin-top:5px; font-size:13px; font-weight:700}
.stars{color:var(--amber); letter-spacing:1.5px; font-size:13px}
.biz-rate .rv{color:var(--card-ink3); font-weight:600}
.biz-blurb{font-size:14px; line-height:1.5; color:#232A32; margin-top:8px}
.biz-actions{display:flex; gap:8px; margin-top:11px}
.btn-green{height:42px; padding:0 16px; border-radius:999px; background:var(--green); color:var(--green-ink); font-weight:800; font-size:13.5px; display:inline-flex; align-items:center; gap:6px}
.btn-ghost{height:42px; padding:0 15px; border-radius:999px; border:1.4px solid #D8DCD8; color:#232A32; font-weight:700; font-size:13.5px; display:inline-flex; align-items:center; gap:6px}
.btn-ghost.is-on{border-color:var(--green-deep); color:#0B6B22; background:#EFFBEF}
.btn-ghost svg,.btn-green svg{width:17px; height:17px}
.prod-grid{display:grid; grid-template-columns:1fr 1fr; gap:11px; padding:4px 12px}
.prod{
  background:var(--card); color:var(--card-ink); border-radius:17px; padding:12px; text-align:left;
  box-shadow:0 6px 22px -12px rgba(0,0,0,.8);
}
.prod .p-glyph{height:74px; border-radius:12px; background:#F0F6F0; display:grid; place-items:center; font-size:36px}
.prod .p-name{font-size:14px; font-weight:700; margin-top:9px; line-height:1.3}
.prod .p-price{font-size:14.5px; font-weight:800; color:#0B6B22; margin-top:3px}
.prod .p-seller{font-size:12px; color:var(--card-ink3); margin-top:2px}

/* ---------------- SHEETS ---------------- */
#backdrop{position:fixed; inset:0; background:rgba(0,0,0,.62); z-index:940}
.sheet{
  position:fixed; left:50%; transform:translateX(-50%); bottom:0; width:var(--col); max-width:100vw;
  max-height:88vh; overflow-y:auto; z-index:950; background:#101208; background:var(--panel);
  border-radius:22px 22px 0 0; border-top:1px solid var(--line); padding:10px 18px calc(20px + env(safe-area-inset-bottom));
  animation:sheetIn .22s ease;
}
@keyframes sheetIn{from{transform:translate(-50%,26px); opacity:.4} to{transform:translate(-50%,0); opacity:1}}
.sheet .grab{width:42px; height:4.5px; border-radius:99px; background:rgba(255,255,255,.25); margin:2px auto 12px}
.sheet h3{margin:2px 0 4px; font-size:18.5px; font-weight:800}
.sheet .sh-sub{font-size:13.5px; line-height:1.55; color:var(--ink2)}
.sheet .sh-sub b{color:#fff}
.field-lab{font-size:12px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:var(--ink3); margin:16px 0 8px}
.chip-row{display:flex; flex-wrap:wrap; gap:8px}
.chip{
  height:36px; padding:0 13px; border-radius:999px; background:var(--panel3); color:#E8EAE8;
  font-size:13.5px; font-weight:600; display:inline-flex; align-items:center; gap:6px;
}
.chip.is-on{background:var(--green); color:var(--green-ink); font-weight:800}
.sheet textarea, .sheet input[type="text"], .sheet input[type="email"], .sheet select{
  width:100%; background:var(--panel2); border:1px solid var(--line); border-radius:14px;
  color:#fff; padding:12px 13px; font-size:15px; outline:none;
}
.sheet textarea{min-height:104px; resize:vertical; line-height:1.5}
.sheet textarea:focus,.sheet input:focus,.sheet select:focus{border-color:var(--green-deep)}
.sheet select option{background:#171A15}
/* ---- Dark form fields, app-wide (owner fix, Nov 3 2026: "ugly white
 * boxes — do better"). Every text-like field on the dark theme gets the
 * Town field treatment (the same values the sheets already used). The
 * profile door, sell / claim / advertise detail forms and portal forms
 * render outside .sheet and were falling back to plain browser-white
 * boxes; the sheet password field was uncovered too. Checkboxes, radios
 * and file inputs are not text fields and stay untouched. ---- */
#phone input[type="text"], #phone input[type="email"], #phone input[type="password"],
#phone input[type="number"], #phone input[type="tel"], #phone input[type="url"],
#phone input[type="search"], #phone input[type="date"], #phone input[type="time"],
#phone textarea, #phone select{
  width:100%; background:var(--panel2); border:1px solid var(--line); border-radius:14px;
  color:#fff; padding:12px 13px; font-size:15px; outline:none; color-scheme:dark;
}
#phone textarea{min-height:104px; resize:vertical; line-height:1.5}
#phone input::placeholder, #phone textarea::placeholder{color:var(--ink3); opacity:1}
#phone input:focus, #phone textarea:focus, #phone select:focus{border-color:var(--green-deep)}
#phone select option{background:#171A15}
/* Exceptions that keep their own design: the light comment pill on the
   white post cards, and the transparent search-bar field. */
#phone .comment-form input{
  flex:1; width:auto; height:40px; border-radius:999px; border:1px solid var(--card-line); background:#F7F8F7;
  padding:0 14px; font-size:14px; color:var(--card-ink); color-scheme:light;
}
#phone .comment-form input:focus{border-color:var(--green-deep)}
/* The comment pill is a light surface in BOTH themes (it sits on the
   white post cards), but its placeholder inherited the dark app's
   --ink3 (#7E847E) from the #phone-wide placeholder rule = 3.59:1 on
   #F7F8F7 (readability-forms, Nov 6 2026). Use the card ink ramp. */
#phone .comment-form input::placeholder{color:var(--card-ink3); opacity:1}
#phone .search-bar input{flex:1; width:auto; background:none; border:0; border-radius:0; padding:0; color:#fff; font-size:15px; color-scheme:dark}
.btn-big{
  width:100%; height:52px; border-radius:999px; margin-top:18px; font-size:16px; font-weight:800;
  background:linear-gradient(180deg, var(--green-hi), var(--green-deep)); color:var(--green-ink);
}
.btn-big[disabled]{background:var(--panel3); color:var(--ink3); box-shadow:none}
.btn-quiet{width:100%; height:48px; border-radius:999px; margin-top:10px; font-size:14.5px; font-weight:700; color:#fff; border:1.4px solid rgba(255,255,255,.35)}
.btn-quiet[disabled]{color:var(--ink3); border-color:var(--line)}
.btn-house-aa{display:flex; align-items:center; justify-content:center; width:100%; height:48px; border-radius:999px; margin-top:10px; font-size:14.5px; font-weight:800; color:#ffd76a; background:#0d0d0f; border:1.6px solid #e0243c; text-decoration:none}
.note-box{
  margin-top:14px; background:rgba(61,220,78,.08); border:1px solid rgba(61,220,78,.3);
  border-radius:14px; padding:12px 13px; font-size:13.5px; line-height:1.55; color:#DFF5E2;
}
.note-box b{color:#fff}
.terms-row{display:flex; gap:10px; align-items:flex-start; margin-top:16px; font-size:13px; line-height:1.55; color:var(--ink2)}
.terms-row input{width:20px; height:20px; accent-color:var(--green-deep); flex:0 0 auto; margin-top:1px}
.terms-row a{color:var(--green); font-weight:600}
.menu-list{display:flex; flex-direction:column; margin-top:6px}
.menu-row{
  display:flex; align-items:center; gap:12px; width:100%; text-align:left; padding:13px 2px;
  border-bottom:1px solid var(--line-soft); font-size:15px; font-weight:600; color:#fff;
}
.menu-row:last-child{border-bottom:0}
.menu-row .m-ic{width:38px; height:38px; border-radius:12px; background:var(--panel3); display:grid; place-items:center; color:var(--green); flex:0 0 auto}
.menu-row .m-ic svg{width:20px; height:20px}
.menu-row .m-txt{flex:1; min-width:0}
.menu-row .m-sub{display:block; font-size:12.5px; font-weight:500; color:var(--ink3); margin-top:1px}
.menu-row .m-chev{color:var(--ink3)} .menu-row .m-chev svg{width:18px; height:18px}
.menu-row.danger{color:#FF8A8E} .menu-row.danger .m-ic{color:#FF8A8E}
.seg{display:inline-flex; background:var(--panel3); border-radius:999px; padding:3px; gap:2px}
.seg button{height:30px; padding:0 13px; border-radius:999px; font-size:13px; font-weight:700; color:var(--ink2)}
.seg button.is-on{background:var(--green); color:var(--green-ink)}
.detail-hero{height:120px; border-radius:16px; display:grid; place-items:center; font-size:52px; margin-top:6px}
.kv{display:flex; justify-content:space-between; gap:14px; padding:9px 0; border-bottom:1px solid var(--line-soft); font-size:14px}
.kv .k{color:var(--ink3)} .kv .v{font-weight:650; text-align:right}
#toast{
  position:fixed; left:50%; transform:translateX(-50%); bottom:calc(var(--tabbar-h) + 18px); z-index:990;
  background:#E9FBE9; color:#0A2E12; font-size:14px; font-weight:700; padding:11px 18px; border-radius:999px;
  box-shadow:0 10px 30px rgba(0,0,0,.5); max-width:88vw; text-align:center;
}
.search-bar{display:flex; align-items:center; gap:9px; margin:12px 14px 4px; background:var(--panel2); border:1px solid var(--line); border-radius:999px; padding:0 8px 0 15px; height:48px}
.search-bar svg{width:20px; height:20px; color:var(--ink3); flex:0 0 auto}
.search-bar input{flex:1; background:none; border:0; outline:none; color:#fff; font-size:15px}
.search-bar .sb-x{width:34px; height:34px; display:grid; place-items:center; color:var(--ink2)}
.search-sec{margin:14px 14px 6px; font-size:12.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--ink3)}
@media (min-width:520px){ #phone{border-left:1px solid var(--line-soft); border-right:1px solid var(--line-soft)} }
@media (prefers-reduced-motion:reduce){ .view,.sheet{animation:none} }

.post-flex{display:flex; gap:12px; align-items:flex-start}
.post-flex-main{flex:1; min-width:0}
.post-photo{width:102px; height:102px; border-radius:14px; object-fit:cover; flex:none}
.p-photo{width:64px; height:64px; border-radius:14px; object-fit:cover}
.detail-photo{width:100%; height:170px; object-fit:cover; border-radius:16px; display:block}

/* ---- town360-fix (Nov 1, 2026): location engine, market, shorts, ads, pages ---- */
.ring-divider{padding:16px 16px 2px;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--green,#3DDC4E)}
.guest-bar{margin:10px 12px 0;padding:11px 12px;border:1px solid var(--green,#3DDC4E);border-radius:14px;display:flex;gap:10px;align-items:center;justify-content:space-between;font-size:13px;color:var(--ink2,#B9C4B9);background:rgba(61,220,78,.07)}
.btn-mini{background:var(--green,#3DDC4E);color:#04160a;border:none;border-radius:999px;padding:7px 13px;font-weight:800;font-size:12.5px;cursor:pointer;white-space:nowrap}
.post-video{width:100%;max-height:420px;border-radius:14px;margin-top:8px;background:#000}
.post-photo-full{width:100%;border-radius:14px;margin-top:8px;display:block}
.link-card{display:block;margin-top:9px;padding:12px;border:1px solid #2A332A;border-radius:14px;text-decoration:none;background:#12160F}
.lc-host{display:block;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink3,#7d8a7d)}
.lc-title{display:block;font-size:15.5px;font-weight:800;color:#fff;margin-top:3px;line-height:1.3}
.lc-note{display:block;font-size:12px;color:var(--green,#3DDC4E);margin-top:5px}
.sponsored-row{margin:2px 0 6px}
.sponsored-chip{display:inline-block;font-size:10.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:#0B0F0A;background:var(--green,#3DDC4E);padding:3px 8px;border-radius:6px}
.shorts-head{display:flex;align-items:center;justify-content:space-between;padding:16px 16px 4px}
.shorts-rail{display:flex;gap:10px;overflow-x:auto;padding:8px 16px 4px;scrollbar-width:none}
.shorts-rail::-webkit-scrollbar{display:none}
.short-card{position:relative;flex:0 0 108px;width:108px;height:172px;border-radius:16px;overflow:hidden;border:1px solid #2A332A;background:#000;padding:0;cursor:pointer}
.short-card video{width:100%;height:100%;object-fit:cover;pointer-events:none}
.short-card-cap{position:absolute;left:8px;right:8px;bottom:7px;font-size:11px;font-weight:700;color:#fff;text-align:left;text-shadow:0 1px 6px #000}
/* ---- Facebook-feed clone (Nov 4 2026): create tiles, welcome card,
 * stories strip, mid-feed reels rail, discovery + follow ---- */
.create-tiles{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:10px 16px 2px}
.create-tile{display:flex;align-items:center;gap:9px;border:0;border-radius:14px;padding:13px 14px;cursor:pointer;color:#fff;font-weight:800;font-size:15px;text-align:left;box-shadow:0 2px 10px rgba(0,0,0,.35)}
.create-tile .ct-ic{font-size:19px;line-height:1;font-weight:900}
.ct-story{background:linear-gradient(135deg,#2b7fff,#0d5cb6)}
.ct-reel{background:linear-gradient(135deg,#f02849,#f5533d 55%,#fa7a1a)}
.welcome-card{position:relative;margin:10px 16px 2px;padding:14px 34px 13px 14px;border:1px solid #2A332A;border-radius:16px;background:#14181a}
.wc-title{font-weight:800;font-size:15px;color:#e8f0e8}
.wc-sub{margin-top:4px;font-size:13px;line-height:1.45;color:#a9b8ab}
.wc-x{position:absolute;top:6px;right:8px;border:0;background:none;color:#8fa393;font-size:19px;cursor:pointer;padding:4px}
.stories-strip{display:flex;gap:12px;overflow-x:auto;padding:10px 16px 2px;scrollbar-width:none}
.stories-strip::-webkit-scrollbar{display:none}
.story-ring{display:flex;flex-direction:column;align-items:center;gap:5px;background:none;border:0;cursor:pointer;flex:0 0 auto;padding:0}
.story-ring .story-av{display:flex;border-radius:50%;padding:2px;background:linear-gradient(135deg,#f02849,#fa7a1a)}
.story-ring .story-av .avatar{border:2px solid #0c0f0d}
.story-name{font-size:11px;font-weight:700;color:#cfe0d2;max-width:64px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.reels-rail-wrap{margin:6px 0 2px}
.reels-badge{font-size:11px;font-weight:800;color:#ffb03a;border:1px solid #6b4d16;border-radius:999px;padding:3px 9px}
.reels-rail{display:flex;gap:10px;overflow-x:auto;padding:8px 16px 4px;scrollbar-width:none}
.reels-rail::-webkit-scrollbar{display:none}
.reel-card{position:relative;flex:0 0 46%;max-width:190px;height:264px;border-radius:16px;overflow:hidden;border:1px solid #2A332A;background:#000;padding:0;cursor:pointer}
.reel-card video{width:100%;height:100%;object-fit:cover;pointer-events:none}
.reel-frame{width:100%;height:100%;border:0;display:block;background:#000}
.embed-frame-wrap{position:relative;width:100%;aspect-ratio:16/9;background:#000}
.embed-frame{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;background:#000}
.embed-srcrow{padding:8px 2px 0;font-size:13px}
.embed-srcrow a{color:#7cc4ff;text-decoration:none;font-weight:600}
.embed-fallback{display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-height:120px;padding:16px;box-sizing:border-box;background:#141a22;color:#e8ecf1;text-align:center;text-decoration:none;font-size:14px;line-height:1.45}
/* ---- Full-screen player (owner reference, Nov 8 2026): when a person
 * plays a video it fills the whole frame edge to edge, dark cinematic
 * edges, controls minimal down the right edge, timestamp unobtrusive,
 * no boxes/borders/panels shrinking the picture, no like box. ---- */
.hero-fs{position:relative;width:calc(100% + 30px);margin:0 -15px 10px;cursor:pointer}
.hero-fs .post-hero-media{width:100%;margin:0}
.fsp-expand{position:absolute;top:8px;right:8px;width:34px;height:34px;border-radius:50%;border:0;background:rgba(10,12,10,.55);backdrop-filter:blur(4px);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:2}
.fsp-expand svg{width:17px;height:17px}
.fsp-expand-hero{top:10px;right:10px}
.fsp{position:fixed;inset:0;z-index:3000;background:#000}
.fsp[hidden]{display:none}
.fsp-stage{position:absolute;inset:0;background:#000}
.fsp-video{position:absolute;inset:0;width:100%;height:100%;display:block;background:#000}
.fsp-fit-cover{object-fit:cover}
.fsp-fit-contain{object-fit:contain}
.fsp-frame{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;background:#000}
.fsp-stage .embed-fallback{position:absolute;inset:0}
.fsp-stage .post-video-fallback{position:absolute;inset:0;width:100%;margin:0;border-radius:0}
.fsp-btn{position:relative;width:48px;height:48px;border-radius:50%;border:0;background:rgba(18,22,18,.55);backdrop-filter:blur(6px);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;cursor:pointer}
.fsp-btn svg{width:23px;height:23px}
.fsp-count{font-size:10.5px;font-weight:800;line-height:1}
.fsp-close{position:absolute;top:calc(12px + env(safe-area-inset-top,0px));right:10px;z-index:4}
.fsp-rail{position:absolute;right:10px;bottom:104px;display:flex;flex-direction:column;gap:14px;z-index:3}
.fsp-meta{position:absolute;left:14px;right:78px;bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:2;color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.9)}
.fsp-author{font-size:15px;font-weight:800}
.fsp-cap{font-size:13.5px;line-height:1.42;margin-top:3px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.fsp-src{display:inline-block;margin-bottom:8px;padding:6px 11px;border-radius:999px;background:rgba(18,22,18,.6);backdrop-filter:blur(6px);color:#7cc4ff;font-size:12.5px;font-weight:700;text-decoration:none}
.fsp-time{position:absolute;right:16px;bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:2;color:rgba(255,255,255,.85);font-size:11.5px;font-weight:600;text-shadow:0 1px 6px rgba(0,0,0,.9)}
.embed-post .post-body{padding:10px 14px 4px}
.reel-cap{position:absolute;left:8px;right:8px;bottom:7px;font-size:11px;font-weight:700;color:#fff;text-align:left;text-shadow:0 1px 6px #000;pointer-events:none;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.reels-empty{margin:2px 16px 6px;padding:12px 14px;border:1px dashed #2A332A;border-radius:14px;color:#a9b8ab;font-size:13px;line-height:1.45}
.discover-row{padding:10px 14px 0;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#ffb03a}
.follow-btn{flex:0 0 auto;border:1px solid #2f7d3b;background:#17351d;color:#7ee787;border-radius:999px;font-size:12px;font-weight:800;padding:5px 11px;cursor:pointer}
.follow-btn.is-on{background:#232a24;color:#a9b8ab;border-color:#2A332A}
.story-media{width:100%;height:100%;object-fit:cover}

/* --- Unified inbox (owner order Nov 4 2026) --- */
.thread-list{display:flex;flex-direction:column}
.thread-row{display:flex;align-items:center;gap:11px;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid #232a24;padding:12px 16px;cursor:pointer;color:inherit}
.tr-main{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px}
.tr-name{font-weight:800;font-size:14px;color:#e8f0e8}
.tr-last{font-size:12.5px;color:#a9b8ab;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tr-side{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.tr-time{font-size:11px;color:#8fa393}
.unread-badge{background:#2fbf71;color:#04150a;font-size:11px;font-weight:900;border-radius:999px;min-width:19px;height:19px;display:flex;align-items:center;justify-content:center;padding:0 5px}
.bubbles{display:flex;flex-direction:column;gap:8px;padding:14px 16px}
.bubble-row{display:flex}
.bubble-row.is-me{justify-content:flex-end}
.bubble{max-width:78%;padding:9px 12px;border-radius:16px;font-size:14px;line-height:1.4;background:#232a24;color:#e8f0e8}
.bubble-row.is-me .bubble{background:#14532d;color:#eafff0}
.bubble-time{font-size:10px;opacity:.65;margin-top:3px;text-align:right}
.bubble-img{display:block;max-width:220px;max-height:260px;border-radius:10px;margin-bottom:4px}
.msg-composer{display:flex;gap:8px;padding:10px 16px;border-top:1px solid #232a24}
.msg-composer input{flex:1 1 auto}
.inbox-note{padding:12px 16px;font-size:12px;line-height:1.5;color:#8fa393}
.short-thumb{position:relative;display:block;width:100%;max-width:300px;margin:9px auto 0;border-radius:18px;overflow:hidden;border:1px solid #2A332A;background:#000;padding:0;cursor:pointer}
.short-thumb video{width:100%;height:400px;object-fit:cover;pointer-events:none;display:block}
.short-badge{position:absolute;top:10px;left:10px;background:var(--green,#3DDC4E);color:#04160a;font-size:11px;font-weight:800;padding:4px 9px;border-radius:999px}
/* ---- Discover-style feed (owner directive, Nov 3 2026): LARGE hero
 * media on top of the card, bold headline, one-line subline, source
 * row + like/comment/share under it; pinned info chips on Home.
 * Town green/black branding kept — layout borrowed, not the skin. */
.post.has-hero{padding-top:0}
.post-hero{width:calc(100% + 30px);margin:0 -15px 10px;aspect-ratio:16/9;object-fit:cover;display:block;border-radius:var(--r-card) var(--r-card) 0 0;background:#0B0E11}
.post-hero-media{width:calc(100% + 30px);margin:0 -15px 10px;max-height:420px;display:block;background:#000;border-radius:var(--r-card) var(--r-card) 0 0}
.post-video-fallback{width:calc(100% + 30px);margin:0 -15px 10px;min-height:180px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:#0B0E11;border-radius:var(--r-card) var(--r-card) 0 0;cursor:pointer;color:#C9D4DC;text-align:center;padding:18px;box-sizing:border-box}
.post-video-fallback .pvf-art{max-width:100%;max-height:240px;border-radius:8px;object-fit:cover;display:block}
.post-video-fallback .pvf-art-none{font-size:38px;line-height:1;color:#7FB069}
.post-video-fallback .pvf-label{font-size:14px;opacity:.85}
.post-hero-thumb{max-width:none;width:calc(100% + 30px);margin:0 -15px 10px;border:none;border-radius:var(--r-card) var(--r-card) 0 0}
.post-hero-thumb video{height:auto;aspect-ratio:16/9}
.p-headline{font-size:17px;font-weight:800;line-height:1.28;color:#0D1117;margin-top:7px;overflow-wrap:break-word}
.p-sub{font-size:14px;line-height:1.4;color:var(--card-ink2);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.info-chips{display:flex;gap:8px;overflow-x:auto;padding:10px 2px 2px;scrollbar-width:none}
.info-chips::-webkit-scrollbar{display:none}
.info-chips[hidden]{display:none}
.info-chip{flex:none;display:inline-flex;align-items:center;gap:5px;background:#10151C;color:#EAF7EC;border:1px solid rgba(61,220,78,.45);padding:8px 13px;border-radius:999px;font-size:13px;font-weight:600}
.info-chip b{color:var(--green-hi);font-weight:800}
.shorts-wrap{display:flex;flex-direction:column;gap:22px;padding:14px 16px 30px;align-items:center}
.short-frame{width:100%;max-width:340px}
.short-frame video{width:100%;height:520px;max-height:68vh;object-fit:cover;border-radius:20px;background:#000;border:1px solid #2A332A}
.short-meta{margin-top:8px;font-size:13.5px;color:var(--ink2,#B9C4B9)}
.short-author{font-weight:800;color:#fff}
.short-cap{margin-top:4px;line-height:1.45}
.safety-pin{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:15px;border:2px solid #fff;box-shadow:0 2px 8px rgba(0,0,0,.5)}
.pin-wx{background:#B7791F}
.pin-usgs{background:#6B4FA1}
.pin-cad{background:#2456A6}
.pa-meta{margin-top:6px;font-size:11.5px;color:var(--ink3,#7d8a7d)}
.claim-row{display:flex;gap:10px;align-items:center;justify-content:space-between;padding:11px 0;border-bottom:1px solid #222822}
.claim-info{min-width:0}
.camp-row{padding:10px 0;border-bottom:1px solid #222822}
.camp-name{font-size:14.5px;font-weight:700;color:#fff}
.camp-meta{font-size:12.5px;color:var(--ink3,#7d8a7d);margin-top:2px}
.radio-row{display:flex;gap:9px;align-items:flex-start;font-size:14px;color:var(--ink2,#B9C4B9);padding:7px 0;line-height:1.4}
.radio-row input{margin-top:3px}
#view-market input[type="text"]{background:#12160F;border:1px solid #2A332A;border-radius:12px;padding:11px 13px;color:#fff;font-size:15px}
#view-market input[type="text"]:focus{border-color:var(--green,#3DDC4E);outline:none}

/* ---- town360-fix Round 2 (Nov 1, 2026): hoodline, map vision, dock ---- */
#hoodline{
  display:flex; align-items:center; gap:8px; padding:6px 16px 7px;
  font-size:12.5px; font-weight:650; color:#C9E7CD; background:rgba(6,14,7,.96);
  border-bottom:1px solid var(--line-soft); position:relative; z-index:55;
}
#hoodline .hl-dot{
  width:8px; height:8px; border-radius:50%; background:var(--green); flex:0 0 auto;
  box-shadow:0 0 0 0 rgba(61,220,78,.55); animation:hlPulse 2.2s ease-out infinite;
}
#hoodline .hl-dot.hl-off{background:#8A8F8A; box-shadow:none; animation:none}
#hoodline .hl-txt{flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
#hoodline.is-off{color:#C9E7CD}
.hl-set{
  flex:0 0 auto; font-size:12px; font-weight:800; color:var(--green-ink);
  background:var(--green); border-radius:999px; padding:4px 11px;
}
@keyframes hlPulse{
  0%{box-shadow:0 0 0 0 rgba(61,220,78,.5)} 70%{box-shadow:0 0 0 8px rgba(61,220,78,0)} 100%{box-shadow:0 0 0 0 rgba(61,220,78,0)}
}
.hl-on{font-size:11px; font-weight:800; color:var(--green-ink); background:var(--green); border-radius:999px; padding:3px 9px; flex:0 0 auto}

/* fuller map on the Nearby chip; other chips keep the panel layout */
#view-map.map-full{display:flex; flex-direction:column; height:calc(100dvh - 163px)}
#view-map.map-full .map-wrap{flex:1; min-height:0}
#view-map.map-full #leafletMap{height:100%; min-height:0}
#view-map.map-full .map-panel{padding:0}
.leaflet-container{background:#0B0F0B}

.map-base-toggle{
  position:absolute; top:12px; right:12px; z-index:600; display:flex; gap:2px;
  background:rgba(10,12,10,.82); border:1px solid rgba(255,255,255,.16); border-radius:999px; padding:3px;
  backdrop-filter:blur(6px);
}
.map-base-toggle button{
  height:29px; padding:0 13px; border-radius:999px; font-size:12.5px; font-weight:700; color:#D8DCD8;
  display:inline-flex; align-items:center; gap:5px;
}
.map-base-toggle button.is-on{background:var(--green); color:var(--green-ink); font-weight:800}
.shield-toggle{
  position:absolute; top:12px; left:12px; z-index:600; height:35px; padding:0 13px 0 10px;
  border-radius:999px; background:rgba(10,12,10,.82); border:1px solid rgba(255,255,255,.16);
  color:#D8DCD8; font-size:12.5px; font-weight:700; display:inline-flex; align-items:center; gap:7px;
  backdrop-filter:blur(6px);
}
.shield-toggle svg{width:17px; height:17px}
.shield-toggle.is-on{background:var(--green); color:var(--green-ink); font-weight:800; border-color:var(--green)}
#view-map.map-full .locate-btn{bottom:122px}

/* floating dock: Our Community + Quick Actions, dock form */
.map-dock{
  position:absolute; left:10px; right:10px; bottom:10px; z-index:590;
  background:rgba(8,10,8,.88); border:1px solid rgba(255,255,255,.13); border-radius:20px;
  padding:9px 10px 8px; backdrop-filter:blur(9px); box-shadow:0 12px 30px rgba(0,0,0,.5);
}
.dock-circles{display:grid; grid-template-columns:repeat(4,1fr); gap:6px}
.map-dock .circle-door{font-size:10px; gap:4px}
.map-dock .circle-door .cd-dot{width:42px; height:42px}
.map-dock .circle-door .cd-dot svg{width:21px; height:21px}
.dock-qa{display:grid; grid-template-columns:repeat(4,1fr); gap:6px; margin-top:8px}
.dock-qa-btn{
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.08); border-radius:12px;
  padding:7px 2px 6px; display:flex; flex-direction:column; align-items:center; gap:4px;
  font-size:9.5px; font-weight:650; line-height:1.2; text-align:center; color:#EDEFEA;
}
.dock-qa-btn svg{width:19px; height:19px}

/* vision pins: teardrop per type color + clusters */
.vpin{position:relative; width:30px; height:38px}
.vpin::before{
  content:""; position:absolute; left:50%; top:0; width:26px; height:26px;
  transform:translateX(-50%) rotate(45deg); border-radius:50% 50% 50% 6px;
  background:var(--vpin); border:2px solid #fff; box-shadow:0 4px 10px rgba(0,0,0,.45);
}
.vpin-dot{
  position:absolute; left:50%; top:2px; transform:translateX(-50%);
  width:26px; height:26px; display:grid; place-items:center; color:#fff;
}
.vpin-dot svg{width:15px; height:15px}
.vcluster{
  width:38px; height:38px; border-radius:50%; background:rgba(10,14,10,.88);
  border:2px solid var(--green); color:#fff; display:grid; place-items:center;
  font-size:14px; font-weight:800; box-shadow:0 0 0 5px rgba(61,220,78,.25), 0 4px 12px rgba(0,0,0,.5);
}

/* vision card */
.vision-card{
  position:absolute; left:10px; right:10px; bottom:12px; z-index:620;
  background:rgba(9,11,9,.96); border:1.6px solid var(--green); border-radius:18px;
  padding:13px 14px 11px; color:#fff; box-shadow:0 16px 40px rgba(0,0,0,.6);
  backdrop-filter:blur(8px); max-height:62%; overflow-y:auto;
}
#view-map.map-full .vision-card{bottom:122px}
.vc-head{display:flex; align-items:center; gap:9px}
.vc-ic{width:34px; height:34px; border-radius:50%; display:grid; place-items:center; color:#fff; flex:0 0 auto}
.vc-ic svg{width:19px; height:19px}
.vc-type{font-size:12px; font-weight:800; letter-spacing:.07em; text-transform:uppercase; color:#DFF5E2; flex:1}
.vc-x{width:30px; height:30px; border-radius:50%; background:rgba(255,255,255,.1); color:#fff; font-size:14px; flex:0 0 auto}
.vc-back{display:flex; align-items:center; gap:3px; background:rgba(255,255,255,.1); color:#fff; font-size:13px; font-weight:700; padding:6px 11px 6px 7px; border-radius:999px; flex:0 0 auto}
.vc-back svg{width:15px; height:15px}
.vc-shield-badge{display:flex; align-items:center; gap:6px; margin-top:8px; color:#9BE15D; font-size:12px; font-weight:700}
.map-backbar{display:flex; align-items:center; justify-content:space-between; gap:10px; padding:2px 2px 8px}
.map-back-btn{display:flex; align-items:center; gap:4px; background:var(--panel2); color:#fff; font-size:14px; font-weight:700; padding:8px 14px 8px 9px; border-radius:999px; border:1px solid var(--line)}
.map-back-btn svg{width:17px; height:17px}
.map-credit{font-size:11.5px; color:var(--ink3); font-weight:600; white-space:nowrap}
.vc-title{font-size:16.5px; font-weight:800; line-height:1.3; margin-top:9px}
.vc-detail{font-size:13.5px; line-height:1.5; color:var(--ink2); margin-top:5px}
.vc-media{margin-top:10px}
.vc-video{width:100%; max-height:220px; border-radius:12px; background:#000; display:block}
.vc-camwrap{position:relative}
.vc-cam-status{position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); display:flex; align-items:center; gap:8px; background:rgba(0,0,0,.72); color:#fff; font-size:12.5px; font-weight:700; padding:7px 13px; border-radius:999px; pointer-events:none; white-space:nowrap}
.vc-cam-status[hidden]{display:none}
.vc-cam-spin{width:13px; height:13px; border-radius:50%; border:2px solid rgba(255,255,255,.35); border-top-color:#9BE15D; animation:vcspin .8s linear infinite; flex:0 0 auto}
@keyframes vcspin{to{transform:rotate(360deg)}}
.vc-cam-note{margin-left:auto; font-size:11.5px; color:var(--ink3); font-weight:600}
.vc-live-row{display:flex; align-items:center; gap:8px; margin-top:8px; font-size:12.5px; font-weight:700}
.vc-live-dot{width:8px; height:8px; border-radius:50%; background:#FF4D4D; box-shadow:0 0 0 4px rgba(255,77,77,.25)}
.vc-btn{
  margin-left:auto; background:var(--green); color:var(--green-ink); font-weight:800; font-size:12.5px;
  padding:7px 14px; border-radius:999px; display:inline-block; text-decoration:none; text-align:center;
}
.vc-btn-wide{margin-left:0; width:100%; padding:10px 14px}
.vc-ad{background:rgba(255,209,102,.1); border:1px solid rgba(255,209,102,.4); border-radius:12px; padding:10px 12px}
.vc-ad-body{font-size:13.5px; line-height:1.5; margin-top:7px}
.vc-meta{
  display:flex; gap:10px; flex-wrap:wrap; margin-top:10px; padding-top:9px;
  border-top:1px solid var(--line-soft); font-size:11.5px; color:var(--ink3);
}
.vc-meta a{color:var(--green); font-weight:700; text-decoration:none}
article.post.flash{animation:postFlash 1.6s ease}
@keyframes postFlash{0%{box-shadow:0 0 0 3px var(--green)} 100%{box-shadow:0 6px 22px -12px rgba(0,0,0,.8)}}

/* ---- Round 2 addenda: claim card, verified profile, business portal ---- */
.claim-card{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:linear-gradient(120deg,#3DDC4E,#23b83a);color:#06130a;border:none;border-radius:16px;padding:14px 16px;margin:10px 0 4px;cursor:pointer}
.claim-card .cc-ic{font-size:26px}
.claim-card .cc-tx{flex:1;display:flex;flex-direction:column}
.claim-card .cc-tx b{font-size:16px}
.claim-card .cc-tx small{font-size:12px;opacity:.85}
.claim-card .cc-go{font-size:24px;font-weight:700}
.claim-mine{display:block;width:100%;background:var(--panel2);color:var(--green);border:1px solid var(--line);border-radius:12px;padding:9px 12px;margin:6px 0;cursor:pointer;font-weight:600}
.or-div{display:flex;align-items:center;gap:10px;margin:14px 0 10px;color:var(--ink3);font-size:12px}
.or-div:before,.or-div:after{content:'';flex:1;height:1px;background:var(--line)}
.char-count{text-align:right;font-size:11px;color:var(--ink3);margin-top:2px}
.qr-btn{border-color:var(--green);color:var(--green);font-weight:700}
.claim-row.is-picked{outline:2px solid var(--green);border-radius:12px}
.biz-cover{height:92px;border-radius:0 0 18px 18px;margin:-6px -16px 0}
.biz-head2{display:flex;gap:12px;align-items:flex-end;margin-top:-26px}
.biz-logo{width:64px;height:64px;font-size:21px;border-radius:50%;border:3px solid var(--bg);flex:none;display:flex;align-items:center;justify-content:center;color:#fff}
.biz-tt{flex:1;min-width:0}
.biz-name2{font-size:19px;font-weight:800;color:#fff}
.biz-handle{font-size:12.5px;color:var(--ink3)}
.vbadge{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;background:var(--green);color:#06130a;font-size:11px;font-weight:900;vertical-align:middle}
.biz-follow{flex:none;background:var(--green);color:#06130a;font-weight:800}
.biz-follow.is-on{background:var(--panel3);color:#fff}
.biz-tagline{color:var(--ink2);font-size:13.5px;margin:10px 0 4px}
.stat-tiles{display:flex;gap:8px;margin:10px 0}
.stat-tile{flex:1;background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:9px 6px;text-align:center}
.stat-tile b{display:block;font-size:16px;color:#fff}
.stat-tile span{font-size:11px;color:var(--ink3)}
.biz-actrow{display:flex;gap:8px;margin-top:6px}
.act-pill{flex:1;background:var(--panel3);color:#fff;border:1px solid var(--line);border-radius:999px;padding:8px 4px;font-weight:700;font-size:13px;text-align:center;cursor:pointer;text-decoration:none}
.biz-tabs{display:flex;gap:2px;border-bottom:1px solid var(--line);margin-top:14px;overflow-x:auto}
.biz-tab{background:none;border:none;color:var(--ink3);font-weight:700;font-size:13.5px;padding:9px 10px;cursor:pointer;white-space:nowrap}
.biz-tab.is-on{color:var(--green);box-shadow:inset 0 -2px 0 var(--green)}
.biz-tabbody{padding-top:12px}
.portal-id{display:flex;gap:12px;align-items:center;padding:6px 0 10px}
.pid-tx{min-width:0}
.pid-name{font-size:16.5px;font-weight:800;color:#fff}
.pid-ver{font-size:12.5px;color:var(--ink3)}
.portal-menu{margin-top:6px}
.portal-nav{position:sticky;bottom:0;display:flex;background:var(--panel);border-top:1px solid var(--line);margin:16px -16px -16px;padding:6px 4px calc(6px + env(safe-area-inset-bottom))}
.pnav-btn{flex:1;background:none;border:none;color:var(--ink3);display:flex;flex-direction:column;align-items:center;gap:2px;font-size:10.5px;cursor:pointer;padding:4px 0}
.pnav-btn svg{width:20px;height:20px}
.pnav-btn.is-on{color:var(--green)}
.portal-gate{text-align:center;padding:22px 6px}
.pg-mark{font-size:44px}
.pg-title{color:#fff;font-size:20px;margin:8px 0 4px}
.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.stat-card{background:var(--panel2);border:1px solid var(--line);border-radius:14px;padding:12px;text-align:center}
.stat-n{font-size:20px;font-weight:800;color:#fff}
.stat-l{font-size:11.5px;color:var(--ink3)}
.act-row{display:flex;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line)}
.svc-card{display:flex;gap:11px;background:var(--panel2);border:1px solid var(--line);border-radius:14px;padding:11px;margin-top:9px;align-items:flex-start}
.svc-tx{flex:1;min-width:0}
.svc-name{font-weight:700;color:#fff;font-size:14.5px}
.svc-meta{font-size:12px;color:var(--ink3)}
.svc-price{color:var(--green);font-weight:700;font-size:13px;margin-top:2px}
.svc-state{font-size:11.5px;color:var(--ink3);margin-top:3px;display:flex;align-items:center;gap:5px}
.pub-dot{width:8px;height:8px;border-radius:50%;background:var(--green);display:inline-block}
.svc-acts{display:flex;flex-direction:column;gap:7px;align-items:flex-end}
.ptgl{width:42px;height:24px;border-radius:999px;background:var(--panel3);border:1px solid var(--line);position:relative;cursor:pointer;flex:none}
.ptgl:after{content:'';position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;transition:left .15s}
.ptgl.is-on{background:var(--green)}
.ptgl.is-on:after{left:20px;background:#06130a}
.seg-tabs{display:flex;gap:6px;margin:8px 0 4px}
.seg-tab{flex:1;background:var(--panel2);border:1px solid var(--line);color:var(--ink2);border-radius:999px;padding:7px 4px;font-weight:700;font-size:12.5px;cursor:pointer}
.seg-tab.is-on{background:var(--green);color:#06130a;border-color:var(--green)}
.lead-card{background:var(--panel2);border:1px solid var(--line);border-radius:14px;padding:12px;margin-top:9px}
.lead-top{display:flex;justify-content:space-between;gap:8px;color:#fff;font-size:14.5px}
.lead-when{font-size:11.5px;color:var(--ink3)}
.lead-name{font-size:13px;color:var(--ink2);margin-top:3px}
.lead-where{color:var(--ink3)}
.lead-btns{display:flex;gap:7px;margin-top:10px;flex-wrap:wrap}
.rev-summary{display:flex;gap:14px;align-items:center;margin:8px 0 12px}
.rev-big{font-size:40px;font-weight:800;color:#fff}
.verified-panel{display:flex;gap:11px;align-items:center;background:rgba(61,220,78,.1);border:1px solid var(--green);border-radius:14px;padding:12px;margin:10px 0;color:#fff}
.verified-panel .vbadge{width:22px;height:22px;font-size:14px}
.earn-card{background:linear-gradient(120deg,#3DDC4E,#1d9e31);color:#06130a;border-radius:16px;padding:18px;text-align:center}
.earn-lab{font-size:12.5px;font-weight:700;opacity:.8}
.earn-n{font-size:30px;font-weight:900}
.txn-plus{color:var(--green);font-weight:800}

/* ---- Addendum 6: master-board visual standard (glow green) ---- */
.sheet{border-top:2px solid var(--green);box-shadow:0 -6px 44px rgba(61,220,78,.28),0 -2px 14px rgba(61,220,78,.35)}
.grab{background:var(--green);box-shadow:0 0 10px rgba(61,220,78,.7)}
.menu-list .menu-row,a.menu-row,button.menu-row{background:var(--panel2);border:1px solid var(--line);border-radius:14px;margin:0 0 8px;padding:11px 12px;width:100%}
.m-ic{background:rgba(61,220,78,.13);border-radius:10px;width:38px;height:38px;min-width:38px;display:flex;align-items:center;justify-content:center;color:var(--green)}
.m-ic svg{width:20px;height:20px}
.btn-big{box-shadow:0 4px 18px rgba(61,220,78,.32)}
.avatar-photo{width:52px;height:52px;border-radius:50%;object-fit:cover;border:2px solid var(--green);box-shadow:0 0 12px rgba(61,220,78,.5);flex:none}
.more-head{display:flex;gap:12px;align-items:center;padding:4px 0 12px}
.more-tt{flex:1;min-width:0}
.more-name{font-size:17px;font-weight:800;color:#fff}
.more-sub{font-size:13px;color:var(--ink3)}
.manage-pill{background:transparent;border:1.5px solid var(--green);color:var(--green);border-radius:999px;padding:8px 13px;font-weight:700;cursor:pointer;white-space:nowrap;font-size:13px}
.logout-btn{width:100%;margin-top:14px;background:var(--panel2);border:1.5px solid var(--green);color:#fff;border-radius:14px;padding:13px;font-size:15px;font-weight:700;cursor:pointer}
.pin-biz{width:36px;height:36px;background:var(--green);border-radius:50% 50% 50% 0;transform:rotate(-45deg);display:flex;align-items:center;justify-content:center;box-shadow:0 3px 10px rgba(0,0,0,.5),0 0 12px rgba(61,220,78,.55);border:2px solid #0a0f0a}
.pin-biz span{transform:rotate(45deg);font-size:16px}
.pop-biz{min-width:215px}
.pop-rate{color:#FFC53D;font-weight:700}
.pop-open{color:var(--green);font-weight:600}
.pop-dist{color:var(--ink2)}
.pop-btns{display:flex;gap:6px;margin-top:9px;flex-wrap:wrap}
.pop-drive{background:var(--green);color:#06130a;font-weight:800}
#view-map{position:relative}
#driveCard{position:absolute;left:10px;right:10px;bottom:84px;z-index:900}
#driveCard:empty{display:none}
.drive-card{background:var(--panel);border:1px solid var(--green);border-radius:18px;padding:14px;box-shadow:0 8px 34px rgba(0,0,0,.55),0 0 18px rgba(61,220,78,.22);position:relative}
.dc-x{position:absolute;top:8px;right:10px;background:none;border:none;color:var(--ink3);font-size:16px;cursor:pointer}
.dc-name{font-size:17px;font-weight:800;color:#fff}
.dc-addr{color:var(--ink3);font-size:13px;margin-top:2px}
.dc-sum{margin-top:7px;color:#fff;font-size:14px}
.dc-btns{display:flex;gap:8px;margin-top:12px}
.dc-go{flex:1}
.dc-img{width:100%;height:290px;object-fit:cover;border-radius:12px;background:#12240f}
.dc-media{margin-bottom:9px}
.dc-media .dc-photo{width:100%;height:110px;object-fit:cover;border-radius:10px;display:block}
.dc-media .dc-logo{height:46px;max-width:170px;object-fit:contain;display:block;background:#fff;border-radius:8px;padding:5px}
.dc-chip{margin-top:8px;color:#fff}
.dc-chip span{display:block;color:var(--ink3);font-size:12.5px}
.dc-banner{background:#0d1f10;border:1px solid var(--green);border-radius:14px;padding:12px}
.dc-turn{font-size:23px;font-weight:900;color:#fff}
.dc-instr{font-size:15.5px;color:#fff}
.dc-bar{display:flex;justify-content:space-between;align-items:center;margin-top:10px;color:#fff;gap:8px}
.dc-arr{text-align:center}
.dc-check{width:74px;height:74px;border-radius:50%;background:var(--green);color:#06130a;font-size:40px;display:flex;align-items:center;justify-content:center;margin:8px auto;box-shadow:0 0 30px rgba(61,220,78,.6)}
.dc-arrived{font-size:22px;font-weight:900;color:#fff}
.nb-row{display:flex;gap:11px;align-items:center;background:var(--panel2);border:1px solid var(--line);border-radius:14px;padding:10px 12px;margin-top:8px}
.nb-tx{flex:1;display:flex;flex-direction:column;min-width:0}
.nb-name{font-weight:700;color:#fff}
.nb-meta{font-size:12px;color:var(--ink3)}
.nb-dist{color:var(--ink2);font-size:12.5px}
.nb-go{background:var(--green);border:none;color:#06130a;width:34px;height:34px;border-radius:50%;font-size:15px;cursor:pointer;flex:none}
.ship-box{background:rgba(61,220,78,.08);border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-top:12px}
.ship-t{color:#fff;font-weight:700;font-size:13.5px}
.qty-row{display:flex;justify-content:space-between;align-items:center;margin-top:14px;color:#fff}
.qty-ctl{display:flex;gap:12px;align-items:center}

/* ---- Addendum 7: profile setup flow ---- */
.pf-steps{font-size:12px;color:var(--green);font-weight:800;letter-spacing:.04em;margin-top:6px}
.pf-title{color:#fff;font-size:19px;margin:6px 0 10px}
.pf-photo-row{display:flex;gap:14px;align-items:center;margin:8px 0 4px}
.pf-photo{width:64px;height:64px;font-size:20px}
.pf-photo-btns{display:flex;flex-direction:column;gap:7px}
.avatar-img{border-radius:50%;object-fit:cover;border:2px solid var(--green)}
/* Default-ant + photo imgs size exactly like the old initials discs
   (owner ruling Nov 3 2026: the Town ant is every member's default). */
.avatar-img.a44{width:44px;height:44px;flex:none}
.avatar-img.a38{width:38px;height:38px;flex:none}
.avatar-img.a34{width:34px;height:34px;flex:none}
.avatar-img.pf-photo{width:64px;height:64px}
.avatar-img.pf-age-photo{width:96px;height:96px}
.av-btn{background:none;border:none;padding:0;cursor:pointer;border-radius:50%}
.int-chips{display:flex;gap:7px;flex-wrap:wrap;margin:6px 0}
.int-chip{background:var(--panel2);border:1px solid var(--line);color:var(--ink2);border-radius:999px;padding:8px 13px;font-weight:700;font-size:13px;cursor:pointer}
.int-chip.is-on{background:var(--green);color:#06130a;border-color:var(--green)}
.pf-err{color:#ff8a8a;font-size:13.5px;margin-top:10px}
.pf-preview{background:var(--panel2);border:1px solid var(--line);border-radius:16px;padding:16px;text-align:center;margin-top:10px}
.pf-preview .avatar-img,.pf-preview .avatar{display:inline-flex}
.pf-pname{font-size:17px;font-weight:800;color:#fff;margin-top:8px}
.pf-age-av{position:relative;width:96px;margin:16px auto 8px}
.pf-age-photo{width:96px;height:96px;font-size:34px;border:3px solid var(--green);box-shadow:0 0 24px rgba(61,220,78,.45)}
.pf-shield-badge{position:absolute;right:-4px;bottom:2px;width:32px;height:32px;border-radius:50%;background:var(--green);color:#06130a;display:flex;align-items:center;justify-content:center;font-weight:900;border:3px solid var(--bg);font-size:16px}
.pf-age-title{text-align:center;color:#fff;font-size:24px;font-weight:900;line-height:1.25}
.pf-age-title span{color:var(--green);display:block}
.pf-age-sub{text-align:center;margin-top:8px}
.pf-agree{text-align:center;font-size:13px;color:var(--ink2);margin-top:16px;line-height:1.55}
.pf-link{color:var(--green);text-decoration:underline}

/* ---- Deals map layer (Nov 2) ---- */
.deal-pin-wrap{background:none;border:none}
.deal-pin{background:#3DDC4E;color:#0B1F0E;font-weight:800;border-radius:999px;padding:6px 11px;font-size:13px;line-height:1;white-space:nowrap;box-shadow:0 3px 10px rgba(0,0,0,.35);text-align:center}
.deal-pin span{font-size:10px;font-weight:700;margin-left:2px;text-transform:uppercase}
.deals-note{color:#5C665C;font-size:12.5px;margin:0 2px 12px;line-height:1.45}
.deal-cards{display:flex;flex-direction:column;gap:10px;padding-bottom:14px}
.deal-card{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:#fff;border:1px solid #E4E9E4;border-radius:14px;padding:12px;cursor:pointer;font:inherit;color:#101410}
.deal-badge{background:#3DDC4E;color:#0B1F0E;font-weight:800;border-radius:10px;padding:9px 10px;font-size:14px;white-space:nowrap}
.deal-main{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}
.deal-name{font-weight:700;font-size:15px;color:#101410}
.deal-text{color:#5C665C;font-size:13px}
.deal-side{display:flex;flex-direction:column;align-items:flex-end;gap:5px}
.dist-badge{background:#EDF7ED;color:#1D7A2E;border-radius:999px;padding:3px 9px;font-size:11.5px;font-weight:700;white-space:nowrap}
.sample-chip{font-size:10.5px;color:#8A6D1A;background:#FDF3D8;border-radius:999px;padding:2px 8px;font-weight:700;white-space:nowrap}

/* ---- Directory (Order 2): photo rows, chips, notes, pins ---- */
.nb-thumb{width:52px;height:52px;border-radius:12px;overflow:hidden;flex:none;background:#222}
.nb-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.nb-main{display:flex;gap:11px;align-items:center;flex:1;min-width:0;background:none;border:none;padding:0;text-align:left;cursor:pointer;color:inherit;font:inherit}
.nb-addr{display:block;font-size:12px;color:var(--ink3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nb-call{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:rgba(61,220,78,.14);border:1.5px solid var(--green);font-size:16px;text-decoration:none;flex:none;cursor:pointer}
.open-yes{color:#3ddc4e;font-weight:700}
.open-no{color:#ff7a70}
.dir-note{margin:10px 2px 0;font-size:13px;color:var(--ink2)}
.dir-src{margin:2px 2px 0;font-size:11px;color:var(--ink3)}
.dir-chips{display:flex;gap:6px;overflow-x:auto;padding:8px 0 0;scrollbar-width:none}
.dir-chips::-webkit-scrollbar{display:none}
.pin-dir{width:30px;height:30px;background:#fff;border-radius:50% 50% 50% 0;transform:rotate(-45deg);display:flex;align-items:center;justify-content:center;box-shadow:0 3px 10px rgba(0,0,0,.5);border:2px solid #14532d}
.pin-dir span{transform:rotate(45deg);font-size:14px}
.pop-img{width:100%;height:92px;object-fit:cover;border-radius:8px;margin-bottom:6px;display:block}

/* ---- One-map merge (Nov 3 2026): Deals layer pins, category sheets,
 * Top Stories rail, Messages door ---- */
.deal-pin-biz{width:40px;height:40px;border-radius:50%;overflow:hidden;border:2px solid #fff;box-shadow:0 3px 10px rgba(0,0,0,.4);background:#fff}
.deal-pin-biz img{width:100%;height:100%;object-fit:cover;display:block}
.deal-sheet-list{display:flex;flex-direction:column;max-height:52vh;overflow-y:auto}
.tabrail-sub{margin-top:2px}
.pill-deals{font-weight:700}
.top-stories{padding:10px 12px 2px}
.ts-head{display:flex;align-items:baseline;gap:8px;margin-bottom:8px}
.ts-brand{color:#C8102E;font-weight:900;letter-spacing:.04em;font-size:13px}
.ts-title{font-weight:800;font-size:15px;color:#101410}
.ts-rail{display:flex;gap:10px;overflow-x:auto;padding-bottom:8px;scroll-snap-type:x mandatory}
.ts-card{flex:0 0 168px;scroll-snap-align:start;display:flex;flex-direction:column;gap:6px;text-align:left;background:#fff;border:1px solid #E4E9E4;border-radius:14px;padding:8px;cursor:pointer;font:inherit;color:#101410}
.ts-img{width:100%;height:88px;object-fit:cover;border-radius:9px;background:#EEF1EE}
.ts-img-none{display:flex;align-items:center;justify-content:center;color:#5A6B5A}
.ts-img-none svg{width:30px;height:30px}
.ts-card-title{font-weight:700;font-size:13px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ts-meta{font-size:11px;color:#5A6B5A;font-weight:600}
.ts-flash{outline:3px solid #C8102E;outline-offset:2px;transition:outline-color .3s}
.msg-empty{display:flex;flex-direction:column;align-items:center;gap:8px;padding:34px 22px;text-align:center}
.msg-empty-ic{width:54px;height:54px;border-radius:50%;background:#EEF1EE;display:flex;align-items:center;justify-content:center;color:#5A6B5A}
.msg-empty-ic svg{width:26px;height:26px}
.msg-empty .btn-big{margin-top:8px}

/* v56 MAPS PARITY — PlacesMap (place search, food/gas layers, gas banner) */
.map-search{position:relative;display:flex;gap:8px;margin:2px 0 10px}
.map-search input{flex:1;min-width:0;background:var(--panel2);border:1px solid var(--line);border-radius:14px;color:#F2F0EA;padding:11px 14px;font-size:15px;outline:none}
.map-search input:focus{border-color:var(--green)}
.map-search-btn{display:flex;align-items:center;justify-content:center;width:44px;border-radius:14px;background:var(--green);color:var(--green-ink);border:0;cursor:pointer}
.map-search-btn svg{width:20px;height:20px}
.map-search-pop{position:absolute;top:52px;left:0;right:0;z-index:1300;background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:0 14px 34px rgba(0,0,0,.55)}
.map-search-pop .ms-head{padding:9px 14px 4px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted,#9A9D94)}
.ms-row{display:flex;flex-direction:column;align-items:flex-start;gap:1px;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--line-soft);padding:10px 14px;cursor:pointer;color:#F2F0EA}
.ms-row:last-child{border-bottom:0}
.ms-name{font-size:15px;font-weight:650}
.ms-sub{font-size:12px;color:var(--muted,#9A9D94);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.map-area-btn{position:absolute;top:12px;left:50%;transform:translateX(-50%);z-index:900;background:var(--green);color:var(--green-ink);border:0;border-radius:999px;padding:9px 16px;font-size:13.5px;font-weight:800;cursor:pointer;box-shadow:0 8px 22px rgba(0,0,0,.5)}
.pl-pin{width:28px;height:28px;border-radius:50% 50% 50% 4px;transform:rotate(-45deg);background:var(--pl,#E5484D);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(0,0,0,.5);border:2px solid rgba(255,255,255,.85)}
.pl-pin svg{transform:rotate(45deg)}
.gas-banner{background:linear-gradient(160deg,#1d2413,#12140F);border:1px solid rgba(200,240,96,.35);border-radius:16px;padding:12px 14px;margin-bottom:10px}
.gas-line{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:2px 0;color:#F2F0EA;font-size:14px}
.gas-line b{font-size:20px;color:var(--green)}
.gas-src{font-size:11.5px;color:var(--muted,#9A9D94);margin-top:4px}

/* Business profiles + claim build (Nov 4 2026): page-photo cover, portal
 * photo picker. */
.biz-cover-img{width:100%;height:100%;object-fit:cover;display:block;border-radius:inherit}
.pf-photos{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 6px}
.pf-ph{width:64px;height:64px;border-radius:12px;overflow:hidden;border:2px solid transparent;background:var(--panel2,#14251a);padding:0;cursor:pointer;display:flex;align-items:center;justify-content:center}
.pf-ph img{width:100%;height:100%;object-fit:cover;display:block}
.pf-ph.is-on{border-color:#57e389;box-shadow:0 0 0 2px rgba(87,227,137,.35)}
.pf-none{font-size:10px;line-height:1.25;text-align:center;padding:4px;color:var(--mut,#9db8a4)}

/* Map layers + composer simplification (Nov 4 2026). */
.layers-btn{position:absolute;top:55px;left:12px;z-index:600;height:35px;padding:0 13px;border-radius:999px;background:rgba(10,12,10,.82);border:1px solid rgba(255,255,255,.16);color:#D8DCD8;font-size:12.5px;font-weight:700;backdrop-filter:blur(6px);cursor:pointer}
.pin-cam{width:24px;height:24px;border-radius:50%;background:#123a8f;border:2px solid #bcd3ff;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(0,0,0,.55)}
.pin-cam-cluster{min-width:34px;height:34px;padding:0 6px;border-radius:17px;background:rgba(18,58,143,.92);border:2px solid #bcd3ff;color:#eaf2ff;font:700 12px/30px system-ui,sans-serif;text-align:center;box-shadow:0 2px 10px rgba(0,0,0,.55);cursor:pointer}
.lyr-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 2px;border-bottom:1px solid rgba(255,255,255,.07)}
.lyr-tx{font-size:14.5px;font-weight:600}
.lyr-sw{width:48px;height:28px;border-radius:999px;background:rgba(255,255,255,.14);border:0;position:relative;cursor:pointer;flex:none;padding:0}
.lyr-knob{position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#cfd6cf;transition:left .15s ease,background .15s ease}
.lyr-sw.is-on{background:var(--green)}
.lyr-sw.is-on .lyr-knob{left:23px;background:#0a0f0a}
.comp-attach{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:10px 0 2px}
.ca-btn{display:inline-flex;align-items:center;gap:7px;padding:9px 14px;border-radius:999px;background:var(--panel2,#14251a);border:1px solid rgba(255,255,255,.16);color:inherit;font-size:13.5px;font-weight:700;cursor:pointer}
.comp-prev{display:inline-flex;align-items:center;gap:8px}
.comp-prev img,.comp-prev video{width:44px;height:44px;object-fit:cover;border-radius:10px;display:block}
.comp-prev-tx{font-size:12px;color:var(--mut,#9db8a4);max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Row call buttons carry ONE rule (above, Directory section). The v56
   text-style override that lived here fought it — padding squeezed into
   a fixed 34px circle, glyph shrunk to 12.5px, dark panel background —
   and made LIVE call buttons read as disabled. Removed Nov 6 2026. */

/* Lane A (Nov 4 2026): business-kind cards, Call button, age gate */
.kind-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:2px 0 6px}
.kind-chip{display:inline-block;font-size:10.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;padding:3px 8px;border-radius:6px;background:#0B0F0A;color:var(--green,#3DDC4E)}
.kind-chip.kind-job{background:#123B7A;color:#BFD9FF}
.kind-chip.kind-bid{background:#4A2A7A;color:#E3D4FF}
.kind-biz{font-weight:700;font-size:13.5px}
.kind-meta{font-size:12.5px;color:var(--ink2,#52627a);font-weight:600}
.act-call{text-decoration:none;color:#0B6B22;font-weight:700}
.bid-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:8px 0 2px}
.bid-count{font-size:12.5px;font-weight:700;color:var(--ink2,#52627a)}
.bid-mine{font-size:12.5px;font-weight:700;color:#4A2A7A}
.bid-btn{border:1px solid #4A2A7A;color:#4A2A7A;background:transparent;border-radius:999px;padding:5px 14px;font-weight:700;cursor:pointer}

.agegate{max-width:440px;margin:26px auto;padding:28px 22px;text-align:center}
.agegate-ic{display:inline-flex;width:56px;height:56px;border-radius:50%;background:var(--panel2,#eef2f7);align-items:center;justify-content:center}
.agegate-ic svg{width:30px;height:30px}
.agegate-t{font-size:19px;margin:14px 0 8px}
.agegate-s{font-size:14.5px;line-height:1.55;color:var(--ink2,#52627a);margin:0 0 16px}

/* v62: profile preferences alive (picture tiles, floating 3D, house video band) */
.pf3d-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:8px 0 4px;perspective:700px}
.pf3d-tile{position:relative;overflow:hidden;border-radius:16px;min-height:86px;padding:0;border:1px solid var(--line);background:linear-gradient(140deg,var(--panel3),var(--panel2));color:#fff;cursor:pointer;text-align:left;transform:translateZ(0);box-shadow:0 10px 22px rgba(0,0,0,.38),0 3px 7px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.22);transition:transform .18s ease,box-shadow .18s ease;animation:pf3dFloat 5.2s ease-in-out infinite;animation-delay:calc(var(--pfd,0)*.65s)}
.pf3d-tile:hover,.pf3d-tile:active{transform:translateY(-4px) translateZ(26px) scale(1.02);box-shadow:0 18px 34px rgba(0,0,0,.48),0 6px 12px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.30)}
.pf3d-tile.is-on{border-color:var(--green);box-shadow:0 14px 28px rgba(0,0,0,.44),0 0 0 2px var(--green),inset 0 1px 0 rgba(255,255,255,.30)}
.pf3d-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pf3d-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(4,10,6,.06) 30%,rgba(4,10,6,.78));pointer-events:none}
.pf3d-tile .pf3d-shade{background:linear-gradient(180deg,rgba(4,10,6,.10) 34%,rgba(4,10,6,.80))}
.pf3d-label{position:absolute;left:11px;right:30px;bottom:9px;font-weight:800;font-size:13.5px;text-shadow:0 1px 5px rgba(0,0,0,.65)}
.pf3d-check{position:absolute;top:8px;right:9px;width:21px;height:21px;border-radius:50%;background:var(--green);color:#06130a;font-size:12.5px;font-weight:900;display:none;align-items:center;justify-content:center;box-shadow:0 3px 8px rgba(0,0,0,.4)}
.pf3d-tile.is-on .pf3d-check{display:flex}
.pf3d-row{position:relative;overflow:hidden;display:flex;align-items:center;gap:10px;border-radius:14px;min-height:54px;padding:10px 12px;margin:7px 0;border:1px solid var(--line);background:linear-gradient(140deg,var(--panel3),var(--panel2));box-shadow:0 8px 18px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.18);transform:translateZ(0)}
.pf3d-rowlab{position:relative;flex:1;font-weight:750;font-size:14px;color:#fff;text-shadow:0 1px 5px rgba(0,0,0,.65)}
.pf3d-tgl{position:relative;flex:none;width:48px;height:27px;box-shadow:0 4px 10px rgba(0,0,0,.45),inset 0 1px 2px rgba(0,0,0,.35)}
.pf3d-tgl:after{width:21px;height:21px}
.pf3d-tgl.is-on:after{left:23px}
@keyframes pf3dFloat{0%,100%{transform:translateY(0) translateZ(0)}50%{transform:translateY(-3px) translateZ(10px)}}
@media (prefers-reduced-motion: reduce){.pf3d-tile{animation:none;transition:none}.pf3d-tile:hover,.pf3d-tile:active{transform:none}}
.pf3d-band{position:relative;overflow:hidden;border-radius:16px;height:96px;margin:2px 0 10px;border:1px solid var(--line);background:linear-gradient(140deg,var(--panel3),var(--panel2));box-shadow:0 10px 22px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.22)}
.pf3d-band video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media (prefers-reduced-motion: reduce){.pf3d-band video{display:none}}

/* ---- business reviews (owner order Nov 6 2026) ---- */
.rev-big{color:var(--ink)}
.rev-card{background:var(--panel2);border:1px solid var(--line);border-radius:14px;padding:11px 12px;margin-top:9px}
.rev-card-head{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.rev-name{font-weight:700;color:var(--ink)}
.rev-date{color:var(--ink2);font-size:12px;margin-left:auto}
.rev-text{margin:6px 0 0;color:var(--ink);line-height:1.45}
.rev-pend{font-size:11px;font-weight:700;letter-spacing:.04em;color:var(--amber);border:1px solid var(--amber);border-radius:999px;padding:2px 8px}
.rev-dist{margin:2px 0 10px;max-width:220px}
.rev-dist-row{display:flex;justify-content:space-between;gap:10px;font-size:12.5px;color:var(--ink2);padding:1.5px 0}
.rev-dist-n{font-weight:700;color:var(--ink)}
.rev-form{margin-top:12px}
.rev-picker{display:flex;gap:4px;margin:2px 0 8px}
.rev-star{background:none;border:0;padding:2px 3px;font-size:31px;line-height:1;color:var(--ink3);cursor:pointer}
.rev-star.is-on{color:var(--amber)}
.rev-err{color:#ff8a8a;font-weight:600;margin:8px 0 0}
html[data-theme="light"] .rev-err{color:#b3261e}

/* ---- business page section separation (owner order Nov 6 2026:
   reviews / neighbor posts / comments get hard split marks — own
   header band, divider rules, distinct zone tint, Nextdoor-style) ---- */
.biz-sec{margin:0 -16px;padding:14px 16px 16px;border-top:3px solid var(--line)}
.biz-sec:first-child{border-top:0;padding-top:2px}
.biz-sec-head{display:flex;align-items:center;gap:8px;margin:0 0 10px;padding-bottom:8px;border-bottom:1px solid var(--line)}
.biz-sec-ic{font-size:16px;line-height:1}
.biz-sec-title{font-size:15px;font-weight:800;letter-spacing:.02em;color:var(--ink);text-transform:uppercase}
.biz-sec-sub{margin-left:auto;font-size:12px;color:var(--ink2);font-weight:600}
.biz-sec-reviews{background:linear-gradient(180deg,rgba(255,176,32,.07),transparent 130px)}
.biz-sec-neighbors{background:linear-gradient(180deg,rgba(61,220,78,.08),transparent 130px)}
.biz-sec-posts{background:linear-gradient(180deg,rgba(120,170,255,.07),transparent 130px)}
html[data-theme="light"] .biz-sec-reviews{background:linear-gradient(180deg,rgba(217,119,6,.08),transparent 130px)}
html[data-theme="light"] .biz-sec-neighbors{background:linear-gradient(180deg,rgba(29,158,51,.09),transparent 130px)}
html[data-theme="light"] .biz-sec-posts{background:linear-gradient(180deg,rgba(37,99,235,.07),transparent 130px)}
.cmt-lab{font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ink3);margin:10px 0 2px;padding-top:8px;border-top:1px dashed var(--line)}

/* MAP BRAND-MATCH (Nov 6 2026): real business logos — Google-style
 * white rounded tile pins; same marks in popups + phone-book rows.
 * Text/logos stay readable in both themes (white tile behind the
 * mark in dark AND light). */
.pin-logo { width:34px; height:34px; border-radius:9px; background:#fff; border:1px solid rgba(15,23,42,.18); box-shadow:0 3px 10px rgba(2,6,23,.35); display:flex; align-items:center; justify-content:center; position:relative; }
.pin-logo::after { content:''; position:absolute; left:50%; bottom:-5px; transform:translateX(-50%); border:5px solid transparent; border-top-color:#fff; border-bottom:0; }
.pin-logo img { width:26px; height:26px; object-fit:contain; display:block; }
/* REAL-LOGO FIX (Nov 9 2026): photo pin — a business with no logo of
 * its own wears a real photograph in the same tile (never an emoji). */
.pin-photo { width:36px; height:36px; border-radius:9px; background:#fff; border:1px solid rgba(15,23,42,.18); box-shadow:0 3px 10px rgba(2,6,23,.35); position:relative; }
.pin-photo::after { content:''; position:absolute; left:50%; bottom:-5px; transform:translateX(-50%); border:5px solid transparent; border-top-color:#fff; border-bottom:0; }
.pin-photo img { width:100%; height:100%; object-fit:cover; display:block; border-radius:8px; }
.pin-photo.pin-dir { width:30px; height:30px; }
.pin-neutral { width:18px; height:18px; border-radius:50% 50% 50% 0; transform:rotate(-45deg); background:#64748b; border:2px solid #fff; box-shadow:0 2px 6px rgba(2,6,23,.4); }
.pop-biz { position:relative; }
.pop-logo { position:absolute; right:8px; bottom:8px; width:44px; height:44px; object-fit:contain; background:#fff; border-radius:10px; padding:4px; box-shadow:0 2px 8px rgba(2,6,23,.3); }
.nb-thumb.nb-logo { background:#fff; }
.nb-thumb.nb-logo img { object-fit:contain; padding:5px; }
img.biz-logo-img { object-fit:cover; padding:0; }
img.biz-logo-img.biz-logo-brand { object-fit:contain; background:#fff; padding:6px; }

/* ANT MARKER (ant-marker crew, Nov 6 2026): full-body ant my-location
 * marker. Halo behind him, ground ring at his feet so the exact point
 * still reads; the old .you-dot circle is retired (kept above, unused). */
.you-ant{position:relative; width:100%; height:100%}
/* Accuracy halo — FAINT, red/white palette (owner Addendum 2: NOT blue); the character is the hero. */
.you-ant::before{content:""; position:absolute; left:50%; top:38%; width:190%; height:96%; transform:translate(-50%,-50%); border-radius:50%; background:radial-gradient(circle, rgba(255,84,60,.20), rgba(255,84,60,0) 66%)}
/* Ground shadow ellipse + exact-point ring at his feet — he stands ON the spot. */
.you-ant::after{content:""; position:absolute; left:50%; bottom:-1px; width:58%; height:9%; transform:translateX(-50%); border:2px solid rgba(255,255,255,.92); border-radius:50%; background:rgba(255,60,48,.16); box-shadow:0 0 0 2px rgba(15,25,45,.28), inset 0 -3px 6px rgba(0,0,0,.35)}
.you-ant img{position:relative; z-index:1; width:100%; height:100%; object-fit:contain; display:block; filter:drop-shadow(0 2px 3px rgba(0,0,0,.45)); animation:youAntBreathe 3.2s ease-in-out infinite; transform-origin:50% 100%}
@keyframes youAntBreathe{0%,100%{transform:scale(1)}50%{transform:scale(1.018) translateY(-0.6px)}}

/* LAYER STATE LAW (owner Addendum 10, Nov 6 2026): every map layer
 * toggle reads at a glance — OFF = RED, ON = GREEN. Never gray.
 * Color + label treatment: the toggle's own text/knob carries it.
 * Both themes. */
.pill[data-act="mapchip"], .pill[data-act="dealchip"], .pill[data-act="dirchip"]{
  background:#2A1518; color:#FFD9DB; border:1.5px solid #E5484D; font-weight:700;
}
.pill[data-act="mapchip"].is-active, .pill[data-act="dealchip"].is-active, .pill[data-act="dirchip"].is-active{
  background:var(--green); color:var(--green-ink); border-color:var(--green);
}
html[data-theme="light"] .pill[data-act="mapchip"], html[data-theme="light"] .pill[data-act="dealchip"], html[data-theme="light"] .pill[data-act="dirchip"]{
  background:#FDECEC; color:#B3261E; border-color:#E5484D;
}
html[data-theme="light"] .pill[data-act="mapchip"].is-active, html[data-theme="light"] .pill[data-act="dealchip"].is-active, html[data-theme="light"] .pill[data-act="dirchip"].is-active{
  background:var(--green); color:var(--green-ink); border-color:var(--green);
}
.lyr-sw{background:#E5484D; border:1.5px solid rgba(255,255,255,.55); box-shadow:inset 0 0 0 1px rgba(0,0,0,.18)}
.lyr-sw .lyr-knob{background:#fff}
.lyr-sw.is-on{background:var(--green); border-color:rgba(255,255,255,.55)}
.lyr-state{font-size:11px; font-weight:800; letter-spacing:.05em; text-transform:uppercase}
.lyr-state.off{color:#FF8A8E}
.lyr-state.on{color:#3DDC5A}
html[data-theme="light"] .lyr-state.off{color:#B3261E}
html[data-theme="light"] .lyr-state.on{color:#157A2E}

/* ---- "Have AI do it" job/business post builder (Nov 6 2026) ---- */
.ca-btn-ai{background:linear-gradient(135deg,#1e40af,#0369a1);border:1px solid rgba(125,211,252,.55);color:#fff}
.ca-btn-ai:active{filter:brightness(1.18)}
#compAiPanel{margin:10px 0 4px;padding:12px;background:var(--panel2);border:1px solid var(--line);border-radius:16px}
.jobai-slots{display:flex;gap:8px;flex-wrap:wrap;margin:2px 0 8px}
.jobai-slot{position:relative;width:58px;height:58px;border-radius:12px;overflow:hidden;border:1px solid var(--line)}
.jobai-slot img{width:100%;height:100%;object-fit:cover;display:block}
.jobai-slot-x{position:absolute;top:2px;right:2px;width:20px;height:20px;border-radius:50%;border:none;background:rgba(0,0,0,.65);color:#fff;font-size:14px;line-height:1;cursor:pointer;display:grid;place-items:center;padding:0}
.jobai-err{color:#f87171;font-weight:700;font-size:.88rem;margin:8px 0 0}
html[data-theme="light"] .jobai-err{color:#b91c1c}
.jobai-note{font-size:.85rem;color:var(--ink2);margin:8px 0 0}
.jobai-build{margin-top:12px;background:linear-gradient(135deg,#1e40af,#0369a1);color:#fff;border:1px solid rgba(125,211,252,.55)}
.jobai-post{margin-top:12px}
.jobai-preview-h{font-weight:800;font-size:.95rem;margin:14px 0 8px}
.jobai-preview-card{border:1px solid var(--line);border-radius:16px;overflow:hidden}
#compPay.jobai-suggested{outline:2px dashed #d97706;outline-offset:2px}
.jobai-think{margin-top:12px;border:1px solid var(--line);border-radius:14px;background:var(--panel);overflow:hidden}
.jobai-think-h{display:flex;align-items:center;gap:8px;width:100%;padding:10px 12px;background:none;border:none;color:inherit;font:inherit;font-weight:700;cursor:pointer;text-align:left}
.jobai-think-t{flex:1}
.jobai-think-el{color:var(--ink2);font-size:12.5px;font-variant-numeric:tabular-nums}
.jobai-think-chev{color:var(--ink2)}
.jobai-think-b{padding:2px 12px 12px}
.jobai-plan{list-style:none;margin:4px 0;padding:0}
.jobai-plan li{display:flex;align-items:center;gap:9px;padding:3px 0;color:var(--ink2);font-size:13.5px}
.jobai-plan li.is-done{color:var(--ink)}
.jobai-plan li.is-skipped{color:var(--ink3)}
.jobai-pm{flex:none;width:17px;height:17px;border-radius:50%;border:1.5px solid var(--ink3);display:grid;place-items:center;font-size:11px;color:#22c55e}
.jobai-plan li.is-active .jobai-pm{border-color:#38bdf8;background:#38bdf8;animation:jobaiPulse 1.1s ease-in-out infinite}
.jobai-plan li.is-done .jobai-pm{border-color:#22c55e}
@keyframes jobaiPulse{0%,100%{opacity:1}50%{opacity:.35}}
.jobai-tx{margin-top:6px}
.jobai-tx-line{font-size:13px;color:var(--ink2);padding:2px 0}
.jobai-sum{margin-top:8px;font-size:12.5px;color:var(--ink2);font-weight:700}
@media (prefers-reduced-motion: reduce){.jobai-plan li.is-active .jobai-pm{animation:none}}
.kind-chip.kind-selfpromo{background:#0C3A54;color:#A5E3FF}

/* BUSINESS PAGES AT SCALE (Nov 6 2026): post-about-business card +
 * Pro locked rows. Token colors only. */
.post-biz-card{display:flex;align-items:center;gap:10px;width:100%;text-align:left;margin:8px 0;padding:8px 10px;border:1px solid var(--line,#2a3a2a);border-radius:12px;background:var(--card2,rgba(127,160,127,.08));cursor:pointer}
.post-biz-logo{width:40px;height:40px;border-radius:9px;object-fit:contain;background:#fff;flex:0 0 auto}
.post-biz-logo.post-biz-cat{object-fit:cover;background:transparent}
.post-biz-tx{display:flex;flex-direction:column;min-width:0;flex:1}
.post-biz-tag{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink3)}
.post-biz-name{font-weight:700;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.post-biz-meta{font-size:12px;color:var(--ink3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.post-biz-go{font-size:12px;font-weight:600;color:var(--green);flex:0 0 auto}

/* BUSINESS JOBS SECTION (Addendum 13) + claim rows (Addendum 5/12) */
.biz-sec-jobs{background:linear-gradient(180deg,rgba(64,156,255,.08),transparent 130px)}
html[data-theme="light"] .biz-sec-jobs{background:linear-gradient(180deg,rgba(37,99,235,.08),transparent 130px)}
.job-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 2px;border-bottom:1px solid var(--line)}
.job-title{font-weight:700;font-size:15px}
.job-meta{font-size:12.5px;color:var(--ink3);margin-top:1px}
.job-acts{display:flex;gap:6px;flex:none}
.hiring-chip{background:#E5484D;color:#fff;border-color:#E5484D;font-size:10.5px;padding:2.5px 8px;vertical-align:middle}
.claim-row .nb-thumb{width:40px;height:40px;border-radius:10px}
.biz-tabbody .claim-row .camp-name{color:var(--ink)}
.biz-tabbody .claim-row .camp-meta{color:var(--ink3)}

/* Sheet Back (owner, Nov 7 2026): visible Back on slide-over panels. */
.sheet-back{display:inline-flex;align-items:center;gap:6px;background:none;border:none;color:var(--green-deep);font-weight:800;font-size:14.5px;padding:2px 4px 10px;cursor:pointer}
.sheet-back svg{width:18px;height:18px;flex:0 0 auto}
/* More menu: claim banner pinned at the top (owner, Nov 7 2026). */
.claim-banner{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:linear-gradient(120deg,#3DDC4E,#23b83a);color:#06130a;border:none;border-radius:16px;padding:14px 16px;margin:12px 0 4px;cursor:pointer}
.claim-banner .cc-ic{font-size:26px}
.claim-banner .cc-tx{flex:1;display:flex;flex-direction:column}
.claim-banner .cc-tx b{font-size:16px}
.claim-banner .cc-tx small{font-size:12px;opacity:.85}
.claim-banner .cc-go{font-size:24px;font-weight:700}
/* Inline comments on feed cards (owner, Nov 7 2026). */
.cmt-more{background:none;border:none;color:var(--green-deep);font-weight:700;font-size:13px;padding:4px 0;cursor:pointer}
/* Brand-match avatars (owner, Nov 7 2026). */
.avatar-ini{display:inline-flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:12.5px;border-radius:50%;vertical-align:middle}
.avatar-outlet{display:inline-flex;align-items:center;justify-content:center;font-size:15px;border-radius:50%;vertical-align:middle}

/* Business page gallery (real photos on the record) */
.biz-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.biz-gal-img{width:100%;height:150px;object-fit:cover;border-radius:10px;display:block}

/* Nextdoor-model signup spine (Nov 9 2026): progress bar, peek card,
 * get-involved rails, verify banner, town-name feed header, nearby
 * badge. Colors ride the theme variables so the light theme holds. */
.su-prog{height:4px;border-radius:99px;background:var(--line,#263026);margin:2px 0 14px;overflow:hidden}
.su-prog span{display:block;height:100%;background:var(--green,#3DDC4E);border-radius:99px;transition:width .3s ease}
.peek-pin{width:52px;height:52px;border-radius:50%;background:rgba(61,220,78,.12);border:1px solid var(--green,#3DDC4E);display:flex;align-items:center;justify-content:center;margin-bottom:10px;color:var(--green,#3DDC4E)}
.peek-pin svg{width:26px;height:26px}
.rail-row{display:flex;gap:10px;overflow-x:auto;padding:6px 2px 12px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
.rail-card{scroll-snap-align:start;flex:0 0 138px;border:1px solid var(--line,#263026);border-radius:16px;padding:12px 10px;display:flex;flex-direction:column;align-items:flex-start;gap:6px;background:var(--panel2,#12160F)}
.rail-logo{width:44px;height:44px;border-radius:50%;object-fit:cover;background:#fff}
.rail-name{font-weight:800;font-size:13.5px;line-height:1.25;color:var(--ink,#fff)}
.rail-sub{font-size:11.5px;color:var(--ink2,#B9C4B9);line-height:1.3;min-height:28px}
.rail-card .follow-btn{margin-top:auto}
.feed-town-head{display:flex;align-items:center;gap:10px;padding:12px 16px 2px;position:relative;z-index:6}
.fth-name{font-size:21px;font-weight:900;letter-spacing:.01em;color:var(--ink,#fff)}
.fth-verified{font-size:11px;font-weight:800;color:var(--green,#3DDC4E);border:1px solid var(--green,#3DDC4E);border-radius:999px;padding:3px 9px}
.fth-verify{font-size:11.5px;font-weight:800;color:#04160a;background:var(--green,#3DDC4E);border:none;border-radius:999px;padding:5px 11px;cursor:pointer}
.verify-banner{position:relative;z-index:6;margin:10px 12px 0;padding:11px 12px;border:1px solid var(--green,#3DDC4E);border-radius:14px;display:flex;gap:10px;align-items:center;justify-content:space-between;font-size:13px;color:var(--ink2,#B9C4B9);background:rgba(61,220,78,.07)}
.nearby-badge{display:inline-block;margin-left:6px;font-size:10.5px;font-weight:700;color:var(--ink2,#B9C4B9);border:1px solid var(--line,#263026);border-radius:999px;padding:2px 8px;vertical-align:middle;white-space:nowrap}