/* Base reset (from the original prototype shell) */
body{margin:0;padding:0}img{max-width:100%}[hidden]:not([hidden=until-found i]){display:none!important}

/* Layout: an app shell. Neon sign header, then one of five views (Near you, Events, Journey, Advisers, Leads). Phone gets a bottom tab bar. */
:root{
  --bg:#F2F6F7; --surface:#FFFFFF; --ink:#102231; --muted:#566673; --line:#D8E1E5;
  --navy:#0E1F2E; --teal:#12606B; --teal-soft:#E1EFEF; --neon:#FF8A3D; --neon-core:#FFE3C8;
  --action:#F27A2A; --action-ink:#13202B; --good:#1E7A5B; --err:#B3261E; --gold:#E7A928;
  --sign-fg:#F3F7F8;
  --display:"Bricolage Grotesque","Avenir Next","Segoe UI",system-ui,sans-serif;
  --body:"Figtree","Segoe UI",system-ui,-apple-system,sans-serif;
  --script:"Yellowtail","Brush Script MT","Segoe Script",cursive;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#0B1620; --surface:#14232F; --ink:#E7EEF1; --muted:#9DAEB9; --line:#263A48;
  --teal:#5DB7C1; --teal-soft:#183740; --action:#FF9147; --good:#5CC79D; --err:#FF8A80; --gold:#F2C14E; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0B1620; --surface:#14232F; --ink:#E7EEF1; --muted:#9DAEB9; --line:#263A48;
  --teal:#5DB7C1; --teal-soft:#183740; --action:#FF9147; --good:#5CC79D; --err:#FF8A80; --gold:#F2C14E; color-scheme:dark}
*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.5}
.pad{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.wrap{max-width:1140px;margin:0 auto}
h1,h2,h3{font-family:var(--display);line-height:1.12;margin:0;text-wrap:balance}
h2{font-size:1.35rem}
p{margin:0}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--neon);outline-offset:2px;border-radius:6px}
.muted{color:var(--muted)}
.eyebrow{font-size:.74rem;letter-spacing:.09em;text-transform:uppercase;font-weight:700;color:var(--teal)}
.ex{display:inline-block;font-size:.66rem;letter-spacing:.07em;text-transform:uppercase;font-weight:700;color:var(--muted);border:1px solid var(--line);border-radius:4px;padding:0 5px}

/* Neon sign header */
.sign{background:var(--navy);color:var(--sign-fg);position:relative;overflow:hidden}
.sign::after{content:"";position:absolute;inset:0;background:radial-gradient(60% 120% at 20% 0%,rgba(255,138,61,.16),transparent 60%);pointer-events:none}
.signrow{display:flex;align-items:center;justify-content:space-between;gap:14px;padding-block:14px;position:relative;z-index:1;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:16px;flex-wrap:wrap;min-width:0}
.brandtag{display:flex;flex-direction:column;gap:2px;border-left:1px solid rgba(255,255,255,.18);padding-left:16px;min-width:0}
.brandtag span{font-size:.98rem;font-weight:600;color:var(--sign-fg)}
.brandtag small{font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;font-weight:700;color:#FFB27A}
@media (max-width:520px){.brandtag{border-left:none;padding-left:0}}
.neon{font-family:var(--script);font-size:3rem;line-height:1;color:var(--neon-core);background:none;border:none;cursor:pointer;padding:0 6px 6px;
  text-shadow:0 0 2px #fff,0 0 6px var(--neon),0 0 14px var(--neon),0 0 28px var(--neon),0 0 48px rgba(255,138,61,.7)}
@media (prefers-reduced-motion:no-preference){.neon{animation:flick 7s infinite}
  @keyframes flick{0%,92%,100%{opacity:1}93%{opacity:.55}94%{opacity:1}96%{opacity:.7}97%{opacity:1}}}
.area{display:flex;align-items:center;gap:8px;font-size:.9rem}
.area select{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.22);color:var(--sign-fg);border-radius:999px;padding:7px 12px}
.area select option{color:#102231}
.pts{display:flex;align-items:center;gap:6px;background:rgba(255,138,61,.14);border:1px solid rgba(255,138,61,.45);border-radius:999px;padding:6px 12px;font-weight:700;font-variant-numeric:tabular-nums}

nav.tabs{background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:env(safe-area-inset-top,0px);z-index:15}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:16;background:var(--surface)}
.tabrow{display:flex;gap:4px}
.tab{background:none;border:none;border-bottom:3px solid transparent;padding:13px 14px 11px;font-weight:600;cursor:pointer;color:var(--muted);display:flex;gap:7px;align-items:center}
.tab svg{flex:none}
.tab[aria-current="page"]{color:var(--ink);border-bottom-color:var(--neon)}

main{padding-block:24px 64px}
.grid2{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:24px;align-items:start}
.stack{display:flex;flex-direction:column;gap:16px}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px}
.sechead{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:12px}
.link{background:none;border:none;color:var(--teal);font-weight:700;cursor:pointer;padding:0}

/* Find (home) */
#v-find{padding-top:0}
.hero{background:linear-gradient(180deg,var(--teal-soft),var(--bg));padding-block:34px 30px;border-bottom:1px solid var(--line)}
.hero h1{font-size:clamp(1.75rem,4vw,2.6rem);font-weight:800;letter-spacing:-.01em;max-width:24ch}
.herosub{font-size:1.05rem;color:var(--muted);margin-top:10px;max-width:62ch}
.typetoggle{display:inline-flex;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:4px;margin-top:22px;gap:4px;flex-wrap:wrap}
.typetoggle button{border:none;background:none;border-radius:999px;padding:9px 18px;font-weight:700;cursor:pointer;color:var(--muted)}
.typetoggle button[aria-pressed="true"]{background:var(--navy);color:var(--neon-core)}
.hero .searchrow{margin-top:14px}
.trustrow{display:flex;gap:8px 22px;flex-wrap:wrap;margin-top:16px;font-size:.88rem}
.trustrow span{display:flex;gap:6px;align-items:center}
.trustrow b{color:var(--good)}
.results{padding-block:24px 4px}
.type-pill{display:inline-block;font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;font-weight:800;border-radius:4px;padding:1px 6px;margin-left:6px;background:var(--navy);color:var(--neon-core)}

/* Journey summary */
.journey{display:flex;gap:18px;align-items:center}
.ring{flex:none;width:96px;height:96px}
.lvl{font-family:var(--display);font-weight:800;font-size:1.3rem}
.bar{height:8px;border-radius:8px;background:var(--line);overflow:hidden;margin-top:8px}
.bar span{display:block;height:100%;background:var(--neon);border-radius:8px}

/* Events */
.ev{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:14px;align-items:start;padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.date{border-radius:10px;background:var(--teal-soft);text-align:center;padding:8px 0;font-variant-numeric:tabular-nums}
.date b{display:block;font-family:var(--display);font-size:1.5rem;line-height:1}
.date small{font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;font-weight:700;color:var(--teal)}
.ev h3{font-size:1.02rem;font-family:var(--body);font-weight:700}
.meta{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:.84rem;color:var(--muted);margin-top:4px}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.tag{font-size:.75rem;font-weight:700;border-radius:999px;padding:2px 9px;background:var(--teal-soft);color:var(--teal)}
.tag.pro{background:var(--navy);color:var(--neon-core)}
.tag.ms{background:transparent;border:1px dashed var(--neon);color:var(--ink)}
.going{display:flex;flex-direction:column;align-items:flex-end;gap:6px;min-width:112px}
.gbtn{border:1.5px solid var(--action);background:transparent;color:var(--ink);border-radius:999px;padding:8px 14px;font-weight:700;cursor:pointer;white-space:nowrap}
.gbtn[aria-pressed="true"]{background:var(--action);color:var(--action-ink)}
.faces{display:flex;align-items:center;font-size:.78rem;color:var(--muted);gap:6px}
.faces i{display:inline-block;width:20px;height:20px;border-radius:50%;border:2px solid var(--surface);margin-left:-7px;background:var(--teal)}
.faces i:nth-child(2){background:var(--gold)}.faces i:nth-child(3){background:var(--neon)}
.faces i:first-child{margin-left:0}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.chipbtn{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:7px 13px;font-weight:600;cursor:pointer;font-size:.88rem}
.chipbtn[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.notice{font-size:.8rem;color:var(--muted);border-left:3px solid var(--neon);padding-left:10px;margin-top:14px}

/* Walks */
.walks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.walk{border-radius:12px;overflow:hidden;background:var(--surface);border:1px solid var(--line);cursor:pointer;text-align:left;padding:0;display:flex;flex-direction:column}
.thumb{aspect-ratio:4/5;max-width:100%;position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:12px;color:#fff}
.thumb .pin{align-self:flex-start;background:rgba(0,0,0,.35);border-radius:999px;padding:3px 10px;font-size:.76rem;font-weight:700;backdrop-filter:blur(3px)}
.thumb .q{font-family:var(--display);font-weight:800;font-size:1.12rem;line-height:1.15;text-shadow:0 1px 8px rgba(0,0,0,.4)}
.play{position:absolute;top:50%;left:50%;transform:translate(-50%,-60%);width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.88);display:grid;place-items:center}
.walk .cap{padding:10px 12px;font-size:.86rem}
.walk .cap b{display:block}

/* Activity */
.feed{display:flex;flex-direction:column}
.item{display:flex;gap:10px;padding:10px 0;border-bottom:1px solid var(--line);font-size:.9rem}
.item:last-child{border-bottom:none}
.dot{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-size:.8rem;font-weight:800;color:#fff;background:var(--teal)}
.board{display:flex;flex-direction:column;gap:8px;font-size:.9rem}
.brow{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:8px;align-items:center}
.brow .b{height:7px;border-radius:7px;background:var(--line);grid-column:2/4}
.brow .b span{display:block;height:100%;background:var(--teal);border-radius:7px}
.brow.you .b span{background:var(--neon)}

/* Milestones */
.ms-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.ms{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:10px}
.ms.done{border-color:var(--neon);box-shadow:0 0 0 1px var(--neon) inset}
.mshead{display:flex;gap:12px;align-items:center}
.badge{flex:none;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;font-family:var(--display);font-weight:800;background:var(--teal-soft);color:var(--teal)}
.ms.done .badge{background:var(--navy);color:var(--neon-core);text-shadow:0 0 6px var(--neon)}
.ms h3{font-size:1.02rem}
.ms ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.ms li button{width:100%;display:flex;gap:9px;align-items:center;text-align:left;background:none;border:1px solid var(--line);border-radius:9px;padding:7px 9px;cursor:pointer;font-size:.86rem}
.ms li button[aria-pressed="true"]{border-color:var(--good);color:var(--good);font-weight:600}
.box{flex:none;width:16px;height:16px;border-radius:4px;border:1.5px solid currentColor;display:grid;place-items:center;font-size:.7rem}
.levels{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.lv{border:1px solid var(--line);border-radius:10px;padding:8px 12px;font-size:.84rem;background:var(--surface)}
.lv.on{border-color:var(--neon);font-weight:700}

/* Advisers */
.searchrow{display:flex;gap:12px;flex-wrap:wrap;align-items:stretch}
.sfield{display:flex;flex-direction:column;justify-content:center;background:var(--surface);border:1.5px solid var(--line);border-radius:8px;padding:6px 12px;min-height:52px;flex:1 1 200px;min-width:0}
.sfield label{font-size:.72rem;color:var(--muted);font-weight:700}
.sfield select,.sfield input{border:none;background:transparent;outline:none;width:100%;padding:2px 0}
.btn{border-radius:8px;padding:11px 16px;font-weight:700;cursor:pointer;text-align:center;border:none}
.btn.primary{background:var(--action);color:var(--action-ink)}
.btn.dark{background:var(--navy);color:var(--sign-fg)}
.btn.secondary{background:var(--surface);color:var(--ink);border:1.5px solid var(--ink)}
.cards{display:flex;flex-direction:column;gap:14px;margin-top:16px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px;display:grid;grid-template-columns:84px minmax(0,1fr) minmax(0,1fr) 170px;gap:16px;align-items:start}
.photo{width:84px;height:84px;border-radius:12px;display:grid;place-items:center;font-family:var(--display);font-weight:800;font-size:1.5rem;color:#fff;background:var(--teal)}
.card h3{font-size:1.08rem;font-family:var(--body);font-weight:700}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;font-size:.84rem}
.stats small{display:block;color:var(--muted)}
.stats b{font-variant-numeric:tabular-nums}
.chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px}
.chip{background:var(--teal-soft);font-size:.76rem;font-weight:600;border-radius:4px;padding:2px 7px}
.chip::before{content:"✓ ";color:var(--teal)}
.ctas{display:flex;flex-direction:column;gap:8px}
.nextev{font-size:.82rem;border-top:1px solid var(--line);padding-top:10px;grid-column:2/-1;display:flex;gap:14px;flex-wrap:wrap;color:var(--muted)}
.nextev b{color:var(--ink)}

/* Modal */
.scrim{position:fixed;inset:0;background:rgba(6,14,20,.6);display:flex;align-items:flex-start;justify-content:center;overflow-y:auto;z-index:30;
  padding:max(24px,env(safe-area-inset-top,0px)) max(16px,env(safe-area-inset-right,0px)) 24px max(16px,env(safe-area-inset-left,0px))}
.modal{background:var(--surface);border-radius:14px;max-width:560px;width:100%;padding:22px;margin-block:auto}
.mhead{display:flex;justify-content:space-between;gap:12px;margin-bottom:12px}
.x{background:none;border:none;font-size:1.5rem;cursor:pointer;color:var(--muted);line-height:1;padding:4px}
.field{display:flex;flex-direction:column;gap:5px;margin-bottom:11px;min-width:0}
.field label{font-weight:600;font-size:.86rem}
.field input,.field select,.field textarea{border:1.5px solid var(--line);background:var(--bg);border-radius:8px;padding:10px;width:100%}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.consent{display:flex;gap:9px;font-size:.84rem;color:var(--muted);margin:4px 0}
.consent input{flex:none;margin-top:3px}
.err{color:var(--err);font-size:.86rem;min-height:1.2em;margin:6px 0}
.videofake{aspect-ratio:9/12;max-width:100%;border-radius:12px;display:flex;flex-direction:column;justify-content:flex-end;padding:16px;color:#fff;margin-bottom:12px}
.qs{display:flex;flex-direction:column;gap:6px;margin-top:8px;padding-left:18px}

.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(84px + env(safe-area-inset-bottom,0px));background:var(--navy);color:var(--neon-core);border:1px solid var(--neon);border-radius:999px;padding:9px 18px;font-weight:700;z-index:40;box-shadow:0 0 18px rgba(255,138,61,.4)}

/* Leads */
.statrow{display:flex;gap:10px;flex-wrap:wrap}
.stat{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:10px 16px;min-width:100px}
.stat b{display:block;font-family:var(--display);font-size:1.5rem;font-variant-numeric:tabular-nums}
.stat span{font-size:.8rem;color:var(--muted)}
.tablewrap{overflow-x:auto;background:var(--surface);border:1px solid var(--line);border-radius:12px;margin-top:16px}
table{width:100%;border-collapse:collapse;font-size:.88rem;min-width:860px}
th,td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
th{font-size:.72rem;text-transform:uppercase;letter-spacing:.07em;color:var(--muted)}
.pill{display:inline-block;padding:2px 9px;border-radius:999px;font-size:.75rem;font-weight:700;background:var(--teal-soft)}
.pill.New{background:var(--action);color:var(--action-ink)}
.pill.Matched{background:var(--good);color:var(--surface)}
td select{border:1px solid var(--line);background:var(--bg);border-radius:6px;padding:3px 6px;margin-top:6px}
.empty{padding:36px 18px;text-align:center;color:var(--muted)}

footer{border-top:1px solid var(--line);padding-block:24px 40px;font-size:.8rem;color:var(--muted)}
footer p{max-width:88ch;margin-bottom:6px}

@media (max-width:960px){
  .grid2{grid-template-columns:1fr}
  .ms-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .card{grid-template-columns:72px minmax(0,1fr)}
  .photo{width:72px;height:72px}
  .card .stats,.card .ctas,.nextev{grid-column:1/-1}
  .card .ctas{flex-direction:row}.card .ctas .btn{flex:1}
}
@media (max-width:720px){
  nav.tabs{position:fixed;top:auto;bottom:0;left:0;right:0;border-top:1px solid var(--line);border-bottom:none;padding-bottom:env(safe-area-inset-bottom,0px)}
  .tabrow{justify-content:space-around}
  .tab{flex-direction:column;gap:2px;font-size:.72rem;padding:9px 4px 8px;border-bottom:none;border-top:3px solid transparent}
  .tab[aria-current="page"]{border-top-color:var(--neon)}
  body{padding-bottom:calc(70px + env(safe-area-inset-bottom,0px))}
  .walks{grid-template-columns:repeat(2,minmax(0,1fr))}
  .neon{font-size:2.5rem}
}
@media (max-width:520px){
  .ms-grid,.row2{grid-template-columns:1fr}
  .ev{grid-template-columns:54px minmax(0,1fr)}
  .going{grid-column:1/-1;flex-direction:row;align-items:center;justify-content:space-between}
  .walks .walk:nth-child(3){display:none}
}
