/* Miya client dashboard — design system.
   Calm, spacious, friendly: the QuickBooks/TurboTax school of small-business
   software. One friendly workhorse sans (weight does the hierarchy), white
   cards on a cool light-gray ground, hairline borders over floaty shadows.
   Deliberately NOT the AI look (no display serif, no cream paper, no coral). */

:root{
  --ink:#1F2D36; --paper:#F5F6F8; --card:#fff;
  --teal:#156B63; --teal-ink:#0C4742; --teal-wash:#EAF2F0;
  --amber:#C5841A;
  --rose-wash:#FAEDEA;
  --mist:#E3ECE9; --line:#DCE3E1; --muted:#5A6B68;
  --gold:#B98A2F; --gold-wash:#F7EFDC;
  --red-ink:#9B3A2D; --red-line:#F5C4BD;
  --shadow:0 1px 2px rgba(16,24,32,.05),0 2px 6px rgba(16,24,32,.04);
  --radius:12px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Nunito Sans',-apple-system,'Segoe UI',sans-serif;background:var(--paper);color:var(--ink);line-height:1.55;font-size:15.5px}
a{color:var(--teal)}
button{font-family:'Nunito Sans',-apple-system,'Segoe UI',sans-serif}

.logo{font-weight:800;font-size:23px;letter-spacing:-.01em}
.dot{color:var(--amber)}
.logosub{display:block;font-size:10px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);margin-top:2px;line-height:1.3}

/* ── welcome (prototype login) ── */
.welcome{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 24px;text-align:center}
.welcome h1{font-weight:800;font-size:34px;letter-spacing:-.015em;margin:18px 0 10px}
.welcome .sub{color:var(--muted);max-width:460px;margin:0 auto 36px;font-size:16px}
.wcards{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;max-width:760px}
.wcard{background:var(--card);border:1.5px solid var(--line);border-radius:var(--radius);padding:26px 30px;min-width:230px;cursor:pointer;box-shadow:var(--shadow);text-align:left;transition:transform .12s ease,border-color .12s ease}
.wcard:hover{transform:translateY(-2px);border-color:var(--teal)}
.wcard .nm{font-size:18px;font-weight:700;margin-bottom:4px}
.wcard .hint{font-size:13.5px;color:var(--muted)}
.wcard.add{border-style:dashed;box-shadow:none;display:flex;align-items:center;justify-content:center;color:var(--teal);font-weight:600}
.wfoot{margin-top:34px;font-size:12.5px;color:var(--muted)}

/* ── app shell ── */
.shell{display:flex;min-height:100vh}
.sidebar{width:232px;flex-shrink:0;background:var(--card);border-right:1px solid var(--line);padding:26px 16px;display:flex;flex-direction:column;gap:4px;position:sticky;top:0;height:100vh}
.sidebar .logo{padding:0 12px 18px}
.navitem{display:flex;align-items:center;gap:11px;border:none;background:transparent;width:100%;text-align:left;font-size:15px;font-weight:500;color:var(--muted);padding:11px 12px;border-radius:10px;cursor:pointer}
.navitem svg{width:19px;height:19px;flex-shrink:0}
.navitem span:first-of-type{min-width:0}
.nav-badge{margin-left:auto;background:var(--gold-wash);color:var(--gold);border:1px solid rgba(185,138,47,.22);border-radius:99px;padding:3px 7px;font-size:9px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.navitem:hover{background:var(--paper);color:var(--ink)}
.navitem.on{background:var(--teal-wash);color:var(--teal-ink);font-weight:600}
.sidegap{flex:1}
.whoami{border-top:1px solid var(--line);padding:14px 12px 2px;font-size:13px;color:var(--muted)}
.whoami b{display:block;color:var(--ink);font-size:14px;margin-bottom:2px}
.switchlink{border:none;background:none;color:var(--teal);font-size:13px;font-weight:600;cursor:pointer;padding:4px 0 0}

.content{flex:1;padding:44px 48px 80px;max-width:980px}
.content.view-referrals{max-width:1320px;padding-right:36px}
.pagehead h1{font-weight:800;font-size:28px;letter-spacing:-.015em;margin-bottom:6px}
.pagehead h1 .pill{vertical-align:middle;margin-left:10px;position:relative;top:-3px}
.pagehead .sub{color:var(--muted);max-width:620px;margin-bottom:28px;font-size:15.5px}

/* ── cards & stats ── */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:26px 28px;box-shadow:var(--shadow);margin-bottom:20px}
.card h3{font-size:18px;font-weight:700;margin-bottom:6px}
.card .lead{color:var(--muted);font-size:14.5px;margin-bottom:14px;max-width:600px}
.statrow{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:20px}
.stat{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:20px 22px;box-shadow:var(--shadow)}
.stat .l{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.stat .v{font-size:28px;font-weight:800;margin-top:6px}
.stat .v small{font-size:13.5px;color:var(--muted);font-weight:400}
.stat .g{font-size:13px;color:var(--muted);margin-top:4px}
.plain{font-size:15.5px;max-width:680px}
.plain b{color:var(--teal-ink)}
.note{font-size:13px;color:var(--muted);margin-top:8px}
.empty{text-align:center;color:var(--muted);padding:44px 20px;border:1.5px dashed var(--line);border-radius:var(--radius)}

/* ── buttons & fields ── */
.btn{display:inline-block;background:var(--teal);color:#fff;border:none;cursor:pointer;font-weight:700;font-size:14.5px;padding:12px 22px;border-radius:10px;white-space:nowrap}
.btn:hover{background:var(--teal-ink)}
.btn:disabled{background:var(--mist);color:var(--muted);cursor:wait}
.btn.ghost{background:transparent;color:var(--teal);border:1.5px solid var(--teal);padding:9px 16px;font-size:13.5px}
.btn.danger{background:transparent;color:var(--red-ink);border:1.5px solid var(--red-line);padding:8px 13px;font-size:13px}
.field label{display:block;font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin-bottom:5px}
.field input,.field select,.field textarea{width:100%;padding:11px 12px;border:1.5px solid var(--line);border-radius:10px;font-family:'Nunito Sans',sans-serif;font-size:14.5px;background:#fff;color:var(--ink)}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--teal)}
.formrow{display:grid;gap:14px;align-items:end}
.grid2{grid-template-columns:1fr 1fr}
.grid3{grid-template-columns:1fr 1fr 1fr}
.grid4{grid-template-columns:repeat(4,1fr)}

/* ── chips ── */
.chips{display:flex;gap:7px;flex-wrap:wrap;align-items:center}
.chip{font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;border-radius:99px;padding:5px 12px;white-space:nowrap}
.chip.impact-high{background:var(--teal);color:#fff}
.chip.impact-medium{background:var(--teal-wash);color:var(--teal-ink)}
.chip.impact-low{background:var(--mist);color:var(--muted)}
.chip.conf-high{background:var(--teal-wash);color:var(--teal-ink)}
.chip.conf-medium{background:var(--gold-wash);color:var(--gold)}
.chip.conf-low{background:#F6E4E0;color:var(--red-ink)}
.chip.found{background:var(--gold-wash);color:var(--gold)}
.chip.plainc{background:var(--mist);color:var(--muted)}

/* ── action-plan checklist ── */
.progresswrap{display:flex;align-items:center;gap:18px}
.progressbar{flex:1;height:10px;background:var(--mist);border-radius:99px;overflow:hidden}
.progressbar .fill{height:100%;background:linear-gradient(90deg,var(--teal),#2C9085);border-radius:99px;transition:width .3s ease}
.progresslabel{font-size:18px;font-weight:700;white-space:nowrap}
.tienum{color:var(--teal-ink);border-radius:6px;padding:0 2px}
.tienum.pulse{animation:tiepulse 1.4s ease 1}
@keyframes tiepulse{0%{background:var(--gold-wash)}45%{background:var(--gold-wash)}100%{background:transparent}}
.planimpact{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:18px;padding-top:18px;border-top:1px dashed var(--line)}
.planimpact .pi .n{font-size:32px;font-weight:800;color:var(--teal-ink);line-height:1.1}
.planimpact .pi .n small{font-size:13px;font-weight:600;color:var(--muted);margin-left:7px}
.planimpact .pi .d{font-size:13px;color:var(--muted);margin-top:5px;max-width:300px}
@media(max-width:560px){.planimpact{grid-template-columns:1fr}}
.phase-h{font-size:11.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:26px 0 12px}
.step{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:18px 20px;box-shadow:var(--shadow);margin-bottom:12px;display:flex;gap:16px;align-items:flex-start}
.step.done{background:#F4F8F6;border-color:var(--mist)}
.step.skipped{opacity:.5}
.checkbox{width:26px;height:26px;border:2px solid var(--line);border-radius:8px;background:#fff;cursor:pointer;flex-shrink:0;margin-top:2px;display:flex;align-items:center;justify-content:center;color:transparent;font-size:15px;font-weight:700}
.checkbox:hover{border-color:var(--teal)}
.step.done .checkbox{background:var(--teal);border-color:var(--teal);color:#fff}
.s-main{flex:1}
.s-title{font-weight:600;font-size:15.5px}
.step.done .s-title{color:var(--muted)}
.s-detail{font-size:13.5px;color:var(--muted);margin-top:3px;max-width:600px}
.s-timing{font-size:13px;color:var(--muted);margin-top:8px}
.s-chips{margin-top:10px}
.whybtn{border:none;background:transparent;color:var(--teal);font-weight:600;font-size:12.5px;cursor:pointer;padding:0;margin-top:10px}
.whybox{display:none;background:var(--paper);border:1px dashed var(--line);border-radius:10px;padding:14px 16px;font-size:13.5px;color:var(--muted);margin-top:10px}
.whybox.open{display:block}
.whybox .evrow{margin-top:8px}
.skiplink{border:none;background:none;color:var(--muted);font-size:12px;cursor:pointer;text-decoration:underline;padding:0;margin-top:10px;margin-left:14px}
.donewhen{font-size:12.5px;color:var(--muted);margin-top:8px}
.donewhen input{border:1.5px solid var(--line);border-radius:8px;padding:5px 8px;font-family:'Nunito Sans',sans-serif;font-size:12.5px;margin-left:6px}

/* ── home & growth: the fill-your-practice bar ── */
.capbar{height:18px;background:var(--mist);border-radius:99px;overflow:hidden;margin-top:4px;position:relative}
.capbar .fill{height:100%;background:linear-gradient(90deg,var(--teal),#2C9085);border-radius:99px;transition:width .4s ease;position:relative}
.capbar .proj{position:absolute;top:0;left:0;height:100%;border-radius:99px;background:repeating-linear-gradient(135deg,#BFD8D2 0 6px,#D5E5E1 6px 12px)}
.caplabels{display:flex;justify-content:space-between;align-items:baseline;font-size:13px;color:var(--muted);margin-top:9px}
.caplabels b{font-size:16px;color:var(--teal-ink);font-weight:800}

/* ── inquiries ── */
.inqrow{display:flex;gap:16px;align-items:flex-start;justify-content:space-between;border:1px solid var(--line);border-radius:12px;padding:16px 18px;margin-bottom:12px;background:var(--card)}
.inqrow.stale{border-color:var(--red-line);background:#FFFBF9}
.inq-main{flex:1;min-width:0}
.inq-top{font-size:14.5px}
.inq-top b{font-size:15px}
.inq-when{color:var(--muted)}
.inq-when.hot{color:var(--red-ink);font-weight:600}
.inq-note{font-size:13.5px;color:var(--muted);margin-top:3px;max-width:520px}
.inq-acts{display:flex;flex-direction:column;align-items:flex-end;gap:8px;flex-shrink:0}
.inq-acts .skiplink{margin:0}
.chip.st-new{background:var(--rose-wash);color:var(--red-ink)}
.chip.st-replied{background:var(--gold-wash);color:var(--gold)}
.chip.st-consult{background:var(--teal-wash);color:var(--teal-ink)}
.chip.st-client{background:var(--teal);color:#fff}
.chip.st-closed{background:var(--mist);color:var(--muted)}

/* the reach-out → client funnel */
.funnel{display:flex;flex-direction:column;align-items:center;margin-top:14px;max-width:560px}
.fbar{display:flex;align-items:center;justify-content:center;gap:7px;min-height:46px;border-radius:10px;font-size:14px;padding:6px 14px;text-align:center}
.fbar b{font-size:20px;font-weight:800}
.fbar .fpct{font-size:12.5px;opacity:.75;font-weight:600}
.fjoin{height:16px;background:var(--mist)}

/* ── website analytics ── */
.webtools{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px;flex-wrap:wrap}
.seg{display:inline-flex;background:var(--card);border:1.5px solid var(--line);border-radius:10px;padding:3px;gap:2px}
.segbtn{border:none;background:transparent;color:var(--muted);font-weight:600;font-size:13.5px;padding:8px 14px;border-radius:8px;cursor:pointer}
.segbtn:hover{color:var(--ink)}
.segbtn.on{background:var(--teal-wash);color:var(--teal-ink)}
.statrow.four{grid-template-columns:repeat(4,1fr)}
@media(max-width:920px){.statrow.four{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.statrow.four{grid-template-columns:1fr}}
.delta.up{color:var(--teal-ink);font-weight:700}
.delta.down{color:var(--gold);font-weight:700}
.pill.plainp{background:var(--gold-wash);color:var(--gold)}
.webgrid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:26px;margin-top:8px}
@media(max-width:920px){.webgrid3{grid-template-columns:1fr}}
.minihead{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.webgrid3 .srcbars .lab{width:110px}

/* report subtabs (Traffic / Engagement groups) */
.subtabs{display:flex;gap:6px;flex-wrap:wrap;margin:-6px 0 18px}
.subtab{border:1.5px solid var(--line);background:var(--card);color:var(--muted);font-weight:600;font-size:13px;padding:7px 13px;border-radius:99px;cursor:pointer}
.subtab:hover{color:var(--ink)}
.subtab.on{background:var(--teal-wash);border-color:var(--teal);color:var(--teal-ink)}
.cardtools{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.seg.small .segbtn{font-size:12.5px;padding:6px 11px}
.webgrid2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
@media(max-width:920px){.webgrid2{grid-template-columns:1fr}}
table.wtable{width:100%;border-collapse:collapse;font-size:14px;margin-top:8px}
table.wtable th{text-align:left;font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);padding:8px 10px;border-bottom:1.5px solid var(--line)}
table.wtable td{padding:10px;border-bottom:1px solid var(--mist)}
table.wtable tr:last-child td{border-bottom:none}
table.wtable th.num,table.wtable td.num{text-align:right;white-space:nowrap}
.donutwrap{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:8px}
.donutlegend{flex:1;min-width:180px}
.dlrow{display:flex;align-items:center;gap:9px;font-size:13.5px;margin-bottom:7px}
.dlrow .dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.dlrow .lab{color:var(--muted);flex:1}
.dlrow .n{font-weight:600;white-space:nowrap}
details.geo{border-bottom:1px solid var(--mist);padding:4px 0}
details.geo:last-of-type{border-bottom:none}
details.geo summary{display:flex;align-items:center;gap:12px;cursor:pointer;padding:8px 2px;font-size:14px;list-style:none}
details.geo summary::-webkit-details-marker{display:none}
details.geo summary::before{content:'▸';color:var(--muted);font-size:11px;transition:transform .15s}
details.geo[open] > summary::before{transform:rotate(90deg)}
details.geo .geoname{font-weight:600;min-width:150px}
details.geo .geobar{flex:1;height:9px;background:var(--mist);border-radius:99px;overflow:hidden;max-width:340px}
details.geo .geobar .fill{display:block;height:100%;background:linear-gradient(90deg,var(--teal),#2C9085);border-radius:99px}
details.geo .geon{margin-left:auto;color:var(--muted);font-size:13px;white-space:nowrap}
details.geo.sub{margin-left:22px;border-bottom:none}
.georow{display:flex;align-items:center;padding:6px 2px 6px 40px;font-size:13.5px;color:var(--muted)}
.georow .geon{margin-left:auto}
details.actlog{border-bottom:1px dashed var(--mist);padding:3px 0}
details.actlog:last-of-type{border-bottom:none}
details.actlog summary{display:flex;align-items:center;gap:14px;cursor:pointer;padding:9px 2px;font-size:13.5px;list-style:none;flex-wrap:wrap}
details.actlog summary::-webkit-details-marker{display:none}
details.actlog .when{color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
details.actlog .place{font-weight:600}
details.actlog .src{color:var(--muted)}
details.actlog .inner{padding:4px 2px 12px 2px;font-size:13.5px}

.actrow{display:flex;align-items:center;gap:10px;padding:11px 2px;border-bottom:1px dashed var(--mist);font-size:14px}
.actrow:last-child{border-bottom:none}
.actdot{width:8px;height:8px;border-radius:50%;background:var(--teal);flex-shrink:0;opacity:.55}
.acttext{flex:1;min-width:0}
.actwhen{color:var(--muted);font-size:12.5px;white-space:nowrap}

/* ── documents ── */
.docrow{display:flex;align-items:center;gap:14px;padding:13px 4px;border-bottom:1px solid var(--mist)}
.docrow:last-child{border-bottom:none}
.docicon{width:26px;height:26px;color:var(--teal);flex-shrink:0}
.docmain{flex:1;min-width:0}
.docname{font-weight:600;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.docmeta{display:flex;align-items:center;gap:10px;margin-top:5px}
.docrow .btn{text-decoration:none}

/* ── tracking ── */
.srcbars .row{display:flex;align-items:center;gap:12px;margin-bottom:9px;font-size:13.5px}
.srcbars .lab{width:180px;color:var(--muted)}
.srcbars .bar{flex:1;height:10px;background:var(--mist);border-radius:99px;overflow:hidden}
.srcbars .fill{height:100%;background:linear-gradient(90deg,var(--teal),#2C9085);border-radius:99px}
.srcbars .n{width:30px;text-align:right;font-weight:600}
table.entries{width:100%;border-collapse:collapse;font-size:14px;margin-top:8px}
table.entries th{text-align:left;font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);padding:8px 10px;border-bottom:1.5px solid var(--line)}
table.entries td{padding:10px;border-bottom:1px solid var(--line)}
table.entries .del{border:none;background:transparent;color:var(--red-ink);cursor:pointer;font-size:13px}
.insight{background:var(--teal-wash);border-radius:12px;padding:15px 18px;font-size:14.5px;margin-top:16px}

/* ── referral partners & tracking (sheet-style trackers) ── */
.tablewrap{overflow-x:auto;margin-top:4px}
table.sheet{width:100%;min-width:1075px;border-collapse:collapse;font-size:14px;table-layout:fixed}
table.sheet.trk{min-width:680px}
.tr-col-month{width:160px}
.tr-col-source{width:200px}
.tr-col-who{width:130px}
.tr-col-actions{width:84px}
.rp-col-partner{width:225px}
.rp-col-kind{width:175px}
.rp-col-status{width:155px}
.rp-col-owner{width:100px}
.rp-col-step{width:225px}
.rp-col-clients{width:85px}
.rp-col-actions{width:110px}
table.sheet th{text-align:left;font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);padding:8px 6px;border-bottom:1.5px solid var(--line)}
table.sheet td{padding:5px 3px;border-bottom:1px solid var(--line);vertical-align:middle}
table.sheet tr.dim{opacity:.45}
table.sheet tr.addrow td{border-bottom:none;padding-top:12px}
.sheetempty{text-align:center;color:var(--muted);padding:26px 10px !important;font-size:13.5px}
.cell{border:1.5px solid transparent;border-radius:8px;background:transparent;width:100%;padding:8px;font-family:'Nunito Sans',sans-serif;font-size:13.5px;color:var(--ink)}
.cell:hover{border-color:var(--line)}
.cell:focus{outline:none;border-color:var(--teal);background:#fff}
.addrow .cell{border-color:var(--line);background:#fff}
select.cellsel{border:1.5px solid transparent;border-radius:8px;background:transparent;padding:8px 4px;font-family:'Nunito Sans',sans-serif;font-size:13px;color:var(--ink);cursor:pointer;width:100%;max-width:100%}
select.cellsel:hover{border-color:var(--line)}
select.cellsel:focus{outline:none;border-color:var(--teal)}
.addrow select.cellsel{border-color:var(--line);background:#fff}
select.stsel{border-radius:99px;border:none;font-weight:600;font-size:12px;padding:7px 8px;-webkit-appearance:none;appearance:none;text-align:center}
select.stsel.stage-idea{background:var(--mist);color:var(--ink)}
select.stsel.stage-reached{background:var(--gold-wash);color:var(--gold)}
select.stsel.stage-talking{background:var(--teal-wash);color:var(--teal-ink)}
select.stsel.stage-referring{background:var(--teal);color:#fff}
select.stsel.stage-pass{background:var(--mist);color:var(--muted)}
.cellnum{white-space:nowrap;text-align:center;font-weight:600}
.plusone{border:1.5px solid var(--line);background:#fff;color:var(--teal);border-radius:8px;font-weight:700;font-size:12px;padding:4px 8px;cursor:pointer;margin-left:7px}
.plusone:hover{border-color:var(--teal);background:var(--teal-wash)}
.rowact{white-space:nowrap;text-align:right}
.rowact .planlink{border:none;background:none;color:var(--teal);font-weight:600;font-size:12.5px;cursor:pointer;padding:4px}
.rowact .planon{color:var(--muted);font-size:12.5px}
.rowact .del{border:none;background:transparent;color:var(--muted);cursor:pointer;font-size:16px;padding:2px 6px;line-height:1}
.rowact .del:hover{color:var(--red-ink)}
.idearow{border:1.5px dashed var(--line);border-radius:12px;padding:14px 16px;margin-top:12px;display:flex;gap:16px;align-items:center}
.idearow .meat{flex:1}
.idearow .ttl{font-weight:600;font-size:14.5px}
.idearow .ttl .kind{font-weight:500;color:var(--muted);font-size:12.5px;margin-left:8px}
.idearow .why{font-size:13.5px;color:var(--muted);margin-top:3px;max-width:560px}

/* ── charts & legends ── */
.chartbox{margin-top:8px}
.legend{display:flex;gap:18px;font-size:12.5px;color:var(--muted);margin-top:10px;flex-wrap:wrap}
.legend span{display:inline-flex;align-items:center;gap:6px}
.sw{width:14px;height:14px;border-radius:4px;display:inline-block}

/* ── details / methodology ── */
details.method{margin-top:10px}
details.method summary{cursor:pointer;font-weight:600;color:var(--teal);font-size:14px}
details.method .inner{font-size:14px;color:var(--muted);margin-top:10px;max-width:720px}
details.method .inner p{margin-bottom:8px}

/* ── status pills, rows & toggles ── */
.pill{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;border-radius:99px;padding:6px 13px;white-space:nowrap}
.pill.ok{background:var(--teal-wash);color:var(--teal-ink)}
.pill.off{background:var(--mist);color:var(--muted)}
.row{display:flex;gap:10px;align-items:center;margin-top:14px;flex-wrap:wrap}
/* toggle switch */
.switch{position:relative;width:46px;height:26px;flex-shrink:0;cursor:pointer}
.switch input{opacity:0;width:0;height:0}
.slider{position:absolute;inset:0;background:var(--mist);border-radius:99px;transition:.15s}
.slider:before{content:"";position:absolute;height:20px;width:20px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.15s;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.switch input:checked + .slider{background:var(--teal)}
.switch input:checked + .slider:before{transform:translateX(20px)}
.cfgrow{display:flex;align-items:center;gap:14px;padding:13px 0;border-bottom:1px dashed var(--line)}
.cfgrow:last-child{border-bottom:none}
.cfgrow .lab{flex:1}
.cfgrow .lab b{display:block;font-size:14.5px}
.cfgrow .lab span{font-size:13px;color:var(--muted)}
.cfgrow select,.cfgrow input[type=email]{padding:9px 11px;border:1.5px solid var(--line);border-radius:9px;font-family:'Nunito Sans',sans-serif;font-size:13.5px}

/* ── settings ── */
.ltvbig{font-size:24px;font-weight:800;color:var(--teal-ink)}
.errbox{display:none;background:var(--rose-wash);color:var(--red-ink);border:1px solid var(--red-line);border-radius:10px;padding:12px 14px;font-size:13.5px;margin-top:12px}
.errbox.show{display:block}
/* background save/delete failed — a quiet, self-dismissing notice (see store.js) */
.sync-banner{position:fixed;left:50%;bottom:24px;transform:translate(-50%,8px);background:var(--rose-wash);color:var(--red-ink);border:1px solid var(--red-line);border-radius:10px;padding:11px 16px;font-size:13.5px;box-shadow:var(--shadow);opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease;z-index:60;max-width:min(92vw,480px);text-align:center}
.sync-banner.show{opacity:1;transform:translate(-50%,0)}

/* ── modal ── */
.overlay{display:none;position:fixed;inset:0;background:rgba(17,39,46,.45);z-index:50;padding:40px 20px;overflow:auto}
.overlay.open{display:block}
.modal{max-width:660px;margin:0 auto;background:var(--card);border-radius:14px;padding:30px;box-shadow:0 12px 40px -12px rgba(16,24,32,.25)}
.modal h2{font-size:21px;font-weight:700;margin-bottom:6px}
.modal .sub{color:var(--muted);font-size:14.5px;margin-bottom:16px}
.modal .field{margin-bottom:14px}

/* ── responsive ── */
@media(max-width:920px){
  .shell{flex-direction:column}
  .sidebar{width:100%;height:auto;position:static;flex-direction:row;align-items:center;overflow-x:auto;padding:12px 14px;gap:2px;border-right:none;border-bottom:1px solid var(--line)}
  .sidebar .logo{padding:0 12px 0}
  .navitem{width:auto;white-space:nowrap;padding:9px 11px}
  .navitem svg{display:none}
  .sidegap{display:none}
  .whoami{border:none;padding:0 6px;white-space:nowrap}
  .whoami b{display:inline;margin-right:8px}
  .content{padding:28px 18px 60px}
  .content.view-referrals{padding:28px 18px 60px}
  .statrow{grid-template-columns:1fr}
  .formrow{grid-template-columns:1fr 1fr !important}
}
@media(max-width:560px){.formrow{grid-template-columns:1fr !important}.welcome h1{font-size:28px}
  .inqrow{flex-direction:column}.inq-acts{flex-direction:row;flex-wrap:wrap;align-items:center}}

/* ── sign-in screen ──
   Just the login and calm decoration: never a list of who uses the dashboard. */
.welcome{ background:
    radial-gradient(560px 360px at 18% 12%, var(--teal-wash) 0%, transparent 70%),
    radial-gradient(640px 420px at 85% 88%, #FBF3E4 0%, transparent 70%); }
.signin-card{ background:var(--card); border:1.5px solid var(--line); border-radius:18px;
  box-shadow:0 10px 34px rgba(12,71,66,.09); padding:44px 48px 38px; max-width:430px; width:100%; }
.signin-foot{ margin-top:22px; font-size:13px; color:var(--muted); }
.signin-wrap{ margin-top:26px; display:flex; flex-direction:column; align-items:center; gap:14px; }
.signin-google{ display:inline-flex; align-items:center; gap:10px; font-weight:700; text-decoration:none; }
.dev-note{ font-size:13px; color:#6B7280; background:#F3F4F6; border:1px solid #E5E7EB; border-radius:8px; padding:8px 12px; }
.welcome-err{ margin:0 auto 18px; max-width:520px; padding:12px 16px; background:#FEF3C7; border:1px solid #FCD34D; border-radius:10px; color:#92400E; font-size:14px; text-align:center; }
/* magic-link sign-in (no passwords — the email is the login) */
.signin-or{ display:flex; align-items:center; gap:12px; width:280px; color:var(--muted); font-size:13px; }
.signin-or::before,.signin-or::after{ content:""; flex:1; height:1px; background:var(--line); }
.magic-form{ display:flex; flex-direction:column; align-items:center; gap:12px; }
.magic-input{ width:280px; box-sizing:border-box; padding:11px 14px; border:1.5px solid var(--line); border-radius:10px; font:inherit; font-size:14.5px; }
.magic-input:focus{ outline:none; border-color:var(--teal); }
.magic-sent{ max-width:400px; padding:14px 18px; background:var(--teal-wash); border:1px solid var(--teal); border-radius:10px; color:var(--teal-ink); font-size:14px; line-height:1.5; }
.magic-sent .linklike{ display:block; margin:8px auto 0; }
.linklike{ background:none; border:none; padding:0; font:inherit; font-size:13.5px; color:var(--teal); cursor:pointer; text-decoration:underline; }
.linklike.danger{ color:#B0483A; }
/* Settings → Client access (admin only) */
.accessrow{ display:flex; align-items:center; gap:14px; padding:9px 2px; border-bottom:1px solid var(--line); font-size:14.5px; }
.accessrow:last-child{ border-bottom:none; }
.accessemail{ font-weight:600; }
.accessrole{ color:var(--muted); font-size:13px; flex:1; }

/* ── topbar + profile menu ── */
.maincol{ flex:1; display:flex; flex-direction:column; min-width:0; }
.topbar{ display:flex; align-items:center; justify-content:flex-end; padding:10px 22px; border-bottom:1px solid #EEF0F2; background:#fff; }
.topbar-spacer{ flex:1; }
.profilemenu{ position:relative; }
.avatar-btn{ width:34px; height:34px; border-radius:50%; border:1px solid #E5E7EB; background:#F3F4F6; cursor:pointer; display:flex; align-items:center; justify-content:center; padding:0; overflow:hidden; }
.avatar-img{ width:100%; height:100%; object-fit:cover; }
.avatar-ltr{ font-weight:800; color:#374151; }
.pm-pop{ position:absolute; right:0; top:42px; width:240px; background:#fff; border:1px solid #E5E7EB; border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,.12); padding:8px; display:none; z-index:40; }
.profilemenu.open .pm-pop{ display:block; }
.pm-head{ padding:8px 10px 10px; border-bottom:1px solid #F1F2F4; }
.pm-name{ font-weight:700; }
.pm-email{ font-size:12px; color:#6B7280; }
.pm-section{ padding:6px 0; border-bottom:1px solid #F1F2F4; }
.pm-section:last-child{ border-bottom:0; }
.pm-label{ font-size:11px; text-transform:uppercase; letter-spacing:.04em; color:#9CA3AF; padding:4px 10px; }
.pm-item{ display:block; width:100%; text-align:left; background:none; border:0; padding:8px 10px; border-radius:8px; cursor:pointer; font:inherit; color:#111827; }
.pm-item:hover{ background:#F3F4F6; }
.pm-item.on{ background:#EEF6F0; font-weight:700; }
.pm-item.danger{ color:#B91C1C; }
