:root{
  --ink:#1d2230; --muted:#6b7280; --line:#e6e8ee; --bg:#fbfbfd;
  --brand:#5b8def; --brand-d:#3f6fd6; --accent:#16a3a3; --rx:#16a34a; --sup:#b8860b;
  --radius:14px; --shadow:0 2px 10px rgba(30,40,80,.06);
}
*{box-sizing:border-box} html{-webkit-text-size-adjust:100%}
body{margin:0;font:16px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:var(--ink);background:var(--bg)}
a{color:var(--brand-d);text-decoration:none} a:hover{text-decoration:underline}
main{max-width:960px;margin:0 auto;padding:28px 20px 60px}
h1{font-size:1.9rem;line-height:1.2;margin:.2em 0 .3em} h2{font-size:1.3rem;margin:1.6em 0 .6em}
.sub{color:var(--muted);max-width:60ch}

.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:14px 20px;background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}
.brand{font-weight:800;font-size:1.25rem;color:var(--ink)} .brand span{color:var(--brand)}
.nav nav a{margin-left:18px;color:var(--ink);font-weight:500}
.nav .cta{background:var(--brand);color:#fff;padding:8px 14px;border-radius:999px}
.nav .cta:hover{background:var(--brand-d);text-decoration:none}

.btn{display:inline-block;padding:11px 20px;border-radius:999px;font-weight:600;cursor:pointer;border:1px solid transparent}
.btn.primary{background:var(--brand);color:#fff} .btn.primary:hover{background:var(--brand-d);text-decoration:none}
.btn.ghost{background:#fff;border-color:var(--line);color:var(--ink)} .btn.ghost:hover{border-color:var(--brand);text-decoration:none}
.btn+.btn{margin-left:10px}

.hero{padding:30px 0 10px} .hero h1{font-size:2.3rem;max-width:18ch}
.hero .sub{font-size:1.1rem;margin:0 0 22px}
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow)}
.card h3{margin:.1em 0 .4em} .why{margin-top:34px}
.ticks{list-style:none;padding:0;display:grid;gap:8px;max-width:60ch}
.ticks li{padding-left:28px;position:relative}
.ticks li:before{content:"✓";position:absolute;left:4px;color:var(--rx);font-weight:800}

footer{border-top:1px solid var(--line);background:#fff;color:var(--muted);font-size:.85rem}
footer p{max-width:80ch;margin:18px auto;padding:0 20px}

/* chips / finder */
.chips{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0}
.chip{position:relative} .chip input{position:absolute;opacity:0}
.chip span{display:inline-block;padding:9px 14px;border:1px solid var(--line);border-radius:999px;background:#fff;cursor:pointer}
.chip input:checked+span{background:var(--brand);color:#fff;border-color:var(--brand)}
.postcode{display:block;margin:10px 0} .postcode input{margin-left:8px;padding:8px 10px;border:1px solid var(--line);border-radius:10px}
.provlist{display:grid;gap:14px;margin-top:12px}
.prov{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow)}
.prov h3{display:flex;align-items:center;gap:10px;margin:.1em 0}
.meta{color:var(--muted);font-size:.9rem;margin:.2em 0 .5em}
.badge{font-size:.72rem;font-weight:700;padding:3px 9px;border-radius:999px;color:#fff}
.badge.rx{background:var(--rx)} .badge.sup{background:var(--sup)}
.empty{color:var(--muted)}

/* forms */
.vform,.areaform{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow);max-width:680px}
fieldset{border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin:0 0 18px}
legend{font-weight:700;padding:0 6px}
.vform label{display:block;margin:10px 0;font-weight:500}
.vform input,.vform select,.vform textarea{width:100%;padding:10px;border:1px solid var(--line);border-radius:10px;font:inherit;margin-top:4px}
.vform .radio,.vform .att{display:flex;gap:10px;align-items:flex-start;font-weight:500}
.vform .radio input,.vform .att input{width:auto;margin-top:5px}
.sub-fields{margin:6px 0 14px 28px;padding-left:12px;border-left:2px solid var(--line)}
.gate{background:#fcfdff;border-color:#d7e2fb}
.caveat{background:#f4f8ff;border:1px solid #d7e2fb;border-radius:10px;padding:12px 14px;font-size:.92rem;margin-bottom:12px}
.caveat p{margin:.4em 0}
.att{margin:10px 0;font-size:.92rem}
.fineprint{color:var(--muted);font-size:.82rem;margin-top:8px}
.error{background:#fff0f0;border:1px solid #f3c2c2;color:#a02020;padding:10px 14px;border-radius:10px}
@media(max-width:520px){.hero h1{font-size:1.8rem}.btn+.btn{margin:10px 0 0;display:block;text-align:center}}

/* auth/dashboard/thread */
.narrow{max-width:520px} .alt{color:var(--muted);font-size:.9rem;margin-top:14px}
.dash h2{display:flex;align-items:center;gap:10px} .count{background:var(--line);border-radius:999px;font-size:.8rem;padding:2px 10px;color:var(--muted)}
.threads{display:grid;gap:10px;margin:12px 0}
.trow{display:grid;grid-template-columns:1.1fr 1fr 2fr auto;gap:12px;align-items:center;
  background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px;color:var(--ink);box-shadow:var(--shadow)}
.trow:hover{border-color:var(--brand);text-decoration:none}
.trow .who{font-weight:600;display:flex;align-items:center;gap:8px}
.trow .areas,.trow .prev{color:var(--muted);font-size:.9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.trow .when{color:var(--muted);font-size:.78rem;white-space:nowrap}
.trow.needs{border-left:3px solid var(--brand)}
.dot{width:9px;height:9px;border-radius:50%;background:var(--brand);display:inline-block}
@media(max-width:640px){.trow{grid-template-columns:1fr;gap:4px}.trow .when{font-size:.72rem}}

.thread .back{display:inline-block;margin-bottom:6px;color:var(--muted)}
.msgs{display:flex;flex-direction:column;gap:10px;margin:16px 0;max-width:680px}
.msg{display:flex;flex-direction:column;max-width:80%}
.msg.mine{align-self:flex-end;align-items:flex-end}
.msg.theirs{align-self:flex-start;align-items:flex-start}
.bubble{padding:10px 14px;border-radius:16px;line-height:1.45}
.msg.mine .bubble{background:var(--brand);color:#fff;border-bottom-right-radius:4px}
.msg.theirs .bubble{background:#fff;border:1px solid var(--line);border-bottom-left-radius:4px}
.msg .when{font-size:.72rem;color:var(--muted);margin-top:3px}
.composer{display:flex;gap:10px;align-items:flex-end;max-width:680px;margin-top:8px}
.composer textarea{flex:1;padding:10px;border:1px solid var(--line);border-radius:12px;font:inherit;resize:vertical}

/* profile editor + avatars */
.ok{background:#eef9f0;border:1px solid #bfe4c6;color:#1d6b32;padding:10px 14px;border-radius:10px}
.avatar-row{display:flex;align-items:center;gap:16px;margin:6px 0 4px}
.avatar{width:84px;height:84px;border-radius:50%;overflow:hidden;flex:0 0 auto;background:#eef1f7;
  display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:.8rem;border:1px solid var(--line)}
.avatar img{width:100%;height:100%;object-fit:cover}
.avatar.sm{width:52px;height:52px;font-size:1.2rem;font-weight:700;color:var(--brand-d)}
.prov-head{display:flex;align-items:center;gap:14px}
.prov-head h3{margin:0}
fieldset.readonly{background:#fafbfc} .reg .back{display:inline-block;margin-bottom:6px;color:var(--muted)}

/* public profile */
.phead{display:flex;align-items:center;gap:20px;margin-bottom:10px}
.avatar.lg{width:108px;height:108px;font-size:2rem;font-weight:700;color:var(--brand-d)}
.profile .bio{max-width:62ch;margin:10px 0 18px}
.chips.static .chip span{cursor:default}
.cta-row{margin:22px 0 8px}

/* photo journey */
.photos .back{display:inline-block;margin-bottom:6px;color:var(--muted)}
.consent .caveat{font-size:.95rem}
.urow{display:flex;gap:14px;flex-wrap:wrap} .urow label{flex:1;min-width:140px}
.ptimeline{display:flex;gap:14px;flex-wrap:wrap;margin:8px 0 18px}
.pcard{margin:0;width:180px;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:var(--shadow)}
.pcard img{width:100%;height:180px;object-fit:cover;display:block;background:#eef1f7}
.pcard figcaption{display:flex;align-items:center;gap:8px;padding:8px 10px;font-size:.8rem}
.stage{font-weight:700;padding:2px 8px;border-radius:999px;color:#fff;font-size:.7rem}
.stage.baseline{background:#64748b} .stage.review{background:var(--brand)} .stage.followup{background:var(--accent)}
.pcard .when{color:var(--muted)} .pcard form{margin:0 0 0 auto}
.pcard .del{border:none;background:none;color:#b04; cursor:pointer;font-size:.9rem;padding:2px 4px}

/* matcher */
.needbox{display:block;margin:10px 0} .needbox input{width:100%;max-width:520px;padding:9px 11px;border:1px solid var(--line);border-radius:10px;margin-top:4px}
.match{background:#f4f8ff;border:1px solid #d7e2fb;border-radius:10px;padding:8px 12px;font-size:.92rem;margin:.4em 0}
.match .why{font-weight:700;color:var(--brand-d);margin-right:6px;font-size:.78rem;text-transform:uppercase;letter-spacing:.02em}

/* verified badge + admin verify console */
.badge.verified{background:#0f9d58;color:#fff}
.admin .adhead{display:flex;justify-content:space-between;align-items:center;gap:12px}
.vrow{display:flex;gap:16px;justify-content:space-between;align-items:flex-start;
  background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin:10px 0;box-shadow:var(--shadow)}
.vrow.isv{border-left:3px solid #0f9d58}
.vrow h3{margin:.1em 0;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.vrow .areas{color:var(--muted);font-size:.9rem;margin:.3em 0}
.vact{display:flex;flex-direction:column;gap:8px;min-width:230px}
.vact input{padding:9px 10px;border:1px solid var(--line);border-radius:10px;font:inherit}
@media(max-width:640px){.vrow{flex-direction:column}.vact{min-width:0;width:100%}}

/* reviews + star input */
.stars{display:inline-flex;flex-direction:row-reverse;gap:4px;font-size:1.8rem;line-height:1}
.stars input{position:absolute;opacity:0;width:0}
.stars label{color:#d2d6df;cursor:pointer}
.stars input:checked ~ label,.stars label:hover,.stars label:hover ~ label{color:#f5b301}
.reviews{display:grid;gap:12px;margin:10px 0}
.review{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 16px;box-shadow:var(--shadow)}
.review .rstars,.rstars{color:#f5b301;letter-spacing:2px}
.review p{margin:.4em 0}

/* Google sign-in */
.btn.google{display:inline-flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);color:var(--ink);width:100%;justify-content:center}
.btn.google:hover{border-color:var(--brand);text-decoration:none}
.btn.google .g{font-weight:800;color:#4285F4;font-family:Arial,sans-serif}
.orline{display:flex;align-items:center;text-align:center;color:var(--muted);font-size:.85rem;margin:14px 0}
.orline:before,.orline:after{content:"";flex:1;height:1px;background:var(--line)}
.orline span{padding:0 12px}

/* practitioner onboarding wizard */
.wizard{max-width:560px;margin:0 auto}
.wz-progress{height:7px;background:var(--line);border-radius:999px;overflow:hidden;margin:4px 0 26px}
.wz-bar{height:100%;width:0;background:linear-gradient(90deg,var(--brand),var(--accent));border-radius:999px;transition:width .35s ease}
.wzform{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}
.wz-step{animation:wzfade .3s ease}
@keyframes wzfade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.wz-step h2{margin:.1em 0 .5em;font-size:1.45rem}
.wz-step .opt{color:var(--muted);font-weight:400;font-size:.9rem}
.wzform label{display:block;margin:12px 0;font-weight:500}
.wzform input,.wzform select,.wzform textarea{width:100%;padding:11px;border:1px solid var(--line);border-radius:10px;font:inherit;margin-top:4px}
.choices{display:grid;gap:12px;margin-top:8px}
.choice{display:block;border:1px solid var(--line);border-radius:12px;padding:14px 16px;cursor:pointer;margin:0;transition:.15s}
.choice:hover{border-color:var(--brand)}
.choice input{width:auto;margin:0 8px 0 0}
.choice b{display:inline} .choice span{display:block;color:var(--muted);font-size:.9rem;margin-top:4px;font-weight:400}
.choice:has(input:checked){border-color:var(--brand);background:#f4f8ff;box-shadow:0 0 0 2px rgba(91,141,239,.15)}
.wz-nav{display:flex;gap:10px;justify-content:space-between;margin-top:22px}
.wz-nav #wznext,.wz-nav #wzdone{margin-left:auto}
.wizard .att{display:flex;gap:10px;align-items:flex-start;font-size:.95rem;font-weight:500}
.wizard .att input{width:auto;margin-top:4px}