/* KLCM Leadership Platform — approved design restyle (Jul 2026)
   Same selectors as before; visual language updated to match the approved
   "KLCM Platform" design: #eef1f5 canvas, #075083→#053a61 sidebar, solid
   white topbar, gradient KPI tiles, fused calendar grid, softer shadows. */

/* Any element with a display: rule also beats the hidden attribute, which
   silently un-hides things meant to stay hidden — filter panels, count badges,
   action bars. Fix it once, here. */
[hidden]{display:none!important}

:root{
  --bg:#eef1f5;--card:#fff;--ink:#15181c;--muted:#5b6673;--line:#e4e7ec;
  --accent:#064c7f;--accent-soft:#e7eef5;--accent-ink:#063b62;
  --gold:#c3ab58;--gold-soft:#f7f1de;--gold-ink:#8a7325;
  --green:#1f7a4d;--green-soft:#e4f3ea;--red:#a4322b;--red-soft:#f7e6e4;--slate-soft:#eceef1;--slate-ink:#586069;
  --shadow:0 1px 2px rgba(21,24,28,.04),0 6px 20px rgba(6,76,127,.05);
  --radius:16px;--font:'Montserrat',Arial,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--font);background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;line-height:1.5}
.hide{display:none!important}
.boot{padding:80px;text-align:center;color:var(--muted)}
.ico{width:18px;height:18px;stroke:currentColor;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round;vertical-align:-3px;flex:none}
.ico .ico-fill{fill:currentColor;stroke:none}
.ico-sm{width:14px;height:14px}
.ico-mi{width:22px;height:22px;vertical-align:middle}
.ico-xl{width:40px;height:40px;stroke-width:1.4;vertical-align:middle}
.btn .ico,.navlink .ico,.chip .ico{margin-right:2px}
.app{max-width:940px;margin:0 auto;padding:0 20px 90px}
a{color:var(--accent)}

/* Auth */
.auth-wrap{min-height:100vh;display:grid;place-items:center;padding:24px}
.auth-card{background:var(--card);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);padding:34px;max-width:400px;width:100%}
.auth-card img{height:34px;margin-bottom:22px}
.auth-card h1{font-size:20px;font-weight:800;letter-spacing:-.3px}
.auth-card p.sub{color:var(--muted);font-size:13.5px;margin-top:5px;margin-bottom:20px}
.auth-toggle{margin-top:16px;font-size:13.5px;color:var(--muted);text-align:center}
.auth-toggle button{background:none;border:none;color:var(--accent);font-weight:700;cursor:pointer;font-family:inherit;font-size:13.5px}
.err{background:var(--red-soft);color:var(--red);font-size:13px;border-radius:9px;padding:9px 12px;margin-bottom:14px;font-weight:600}
.ok{background:var(--green-soft);color:var(--green);font-size:13px;border-radius:9px;padding:9px 12px;margin-bottom:14px;font-weight:600;line-height:1.45}
.auth-resend{margin-top:9px;font-size:12.5px;color:var(--muted);text-align:center}
.auth-resend button{background:none;border:none;color:var(--accent);font-weight:700;cursor:pointer;font-family:inherit;font-size:12.5px}

/* Header */
header.top{position:sticky;top:0;z-index:30;background:rgba(244,246,248,.9);backdrop-filter:saturate(160%) blur(10px);-webkit-backdrop-filter:saturate(160%) blur(10px);border-bottom:1px solid var(--line);padding:12px 20px;display:flex;align-items:center;gap:8px}
header.top .inner{max-width:940px;margin:0 auto;width:100%;display:flex;align-items:center;gap:8px}
.brand{display:flex;align-items:center;gap:11px;cursor:pointer}
.brand img{height:26px}
.navlink{appearance:none;border:none;background:none;font-family:inherit;color:var(--muted);font-size:13.5px;font-weight:600;padding:8px 11px;border-radius:9px;cursor:pointer;transition:.15s;display:inline-flex;align-items:center;gap:6px}
.navlink:hover{background:#fff;color:var(--ink)}
.navlink.active{background:var(--accent-soft);color:var(--accent-ink)}
.spacer{flex:1}
.iconbtn{position:relative;appearance:none;border:1px solid var(--line);background:var(--card);width:36px;height:36px;border-radius:10px;cursor:pointer;display:grid;place-items:center;font-size:17px;color:#3a4149;transition:border-color .15s}
.iconbtn:hover{border-color:#9fb4c6;background:#fff}
.dot{position:absolute;top:-5px;right:-5px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:var(--gold);color:#3a3008;font-size:10.5px;font-weight:800;display:grid;place-items:center;border:2px solid var(--bg)}

/* Buttons */
.btn{appearance:none;font-family:inherit;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:11px;padding:10px 16px;font-size:14px;font-weight:600;cursor:pointer;transition:.15s;display:inline-flex;align-items:center;gap:8px;text-decoration:none}
.btn:hover{background:#fbfcfd;border-color:#d3d9e0}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.primary:hover{background:#053a61}
.btn.danger{color:var(--red);border-color:#eccecb}.btn.danger:hover{background:var(--red-soft)}
.btn.ghost{background:transparent}
.btn.sm{padding:7px 12px;font-size:13px;border-radius:9px}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn.full{width:100%;justify-content:center}

.hero{padding:26px 2px 4px;display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap}
.hero h1{font-size:22px;font-weight:800;letter-spacing:-.3px}
.hero p{color:var(--muted);font-size:13px;margin-top:5px;max-width:62ch}
.section-label{font-size:11px;font-weight:800;letter-spacing:1.1px;text-transform:uppercase;color:#8a93a0;margin:22px 2px 12px}

.badge{font-size:11.5px;font-weight:800;letter-spacing:.3px;padding:4px 10px;border-radius:99px;white-space:nowrap;display:inline-flex;align-items:center;gap:5px}
.b-draft{background:var(--slate-soft);color:var(--slate-ink)}
.b-review{background:var(--gold-soft);color:var(--gold-ink)}
.b-approved{background:var(--green-soft);color:var(--green)}
.b-changes{background:var(--red-soft);color:var(--red)}

/* info hub */
.info-aud{margin-bottom:2px}
.info-aud-staff{background:var(--gold-soft);color:var(--gold-ink)}
.info-aud-leaders{background:var(--accent-soft);color:var(--accent-ink)}
.check-inline-wrap{margin-bottom:2px}

.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.chip{appearance:none;font-family:inherit;border:1px solid var(--line);background:var(--card);color:var(--muted);border-radius:99px;padding:6px 14px;font-size:13px;font-weight:600;cursor:pointer}
.chip.active{background:var(--accent);border-color:var(--accent);color:#fff}

.maprow{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;box-shadow:var(--shadow);display:flex;align-items:center;gap:16px;cursor:pointer;transition:.16s;margin-bottom:12px;text-align:left;width:100%;font-family:inherit;color:inherit}
.maprow:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(6,76,127,.1)}
.maprow .mi{width:46px;height:46px;border-radius:12px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;flex:none}
.maprow .mbody{flex:1;min-width:0}
.maprow h3{font-size:16px;font-weight:700}
.maprow .msub{color:var(--muted);font-size:13px;margin-top:3px}
.maprow .mright{display:flex;flex-direction:column;align-items:flex-end;gap:7px;flex:none}
.maprow .mdate{font-size:11.5px;color:#6b7280}
.empty{text-align:center;padding:54px 20px;color:var(--muted)}
.empty .big{font-size:38px;margin-bottom:10px}
.pillar-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:18px}
@media(max-width:720px){.pillar-cards{grid-template-columns:repeat(2,1fr)}}
.pcard2{appearance:none;font-family:inherit;text-align:left;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px 14px;cursor:pointer;transition:.15s;display:flex;justify-content:space-between;align-items:center;gap:8px;box-shadow:var(--shadow)}
.pcard2:hover{border-color:#c9d3dd;transform:translateY(-1px)}
.pcard2.active{border-color:var(--accent);background:var(--accent-soft)}
.pcard2 .pc-name{font-size:13px;font-weight:700;color:var(--ink)}
.pcard2 .pc-count{font-size:12px;font-weight:800;color:var(--accent);background:var(--accent-soft);border-radius:99px;padding:2px 9px;flex:none}
.pcard2.active .pc-count{background:#fff}
.lib-controls{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.lead-select{width:auto;min-width:180px;font-size:13px;padding:8px 12px}
.report-filters{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end;margin:18px 0 8px;padding:14px;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow)}
.rf{display:flex;flex-direction:column;gap:4px}
.rf span{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.4px}
.rf select{width:auto;min-width:150px;font-size:13px;padding:8px 10px}

/* Reports 3-column dashboard layout (fits inside the content column) */
.reports-layout{display:grid;grid-template-columns:190px minmax(0,1fr) 210px;gap:18px;align-items:start;margin-top:14px}
.rail{position:sticky;top:80px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px;box-shadow:var(--shadow);max-height:calc(100vh - 100px);overflow:auto}
.rail-title{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);margin-bottom:12px}
.rail-filters{display:flex;flex-direction:column;gap:12px}
.rail-filters .rf{width:100%}
.rail-filters .rf select{width:100%;min-width:0}
.palette-label{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;margin:16px 0 8px}
.palette{display:flex;flex-direction:column;gap:8px}
.palette-item{display:flex;align-items:center;gap:9px;width:100%;text-align:left;font-family:inherit;background:#fcfdfe;border:1px solid var(--line);border-radius:10px;padding:9px 11px;cursor:pointer;transition:.15s}
.palette-item:hover{border-color:var(--accent);background:var(--accent-soft)}
.palette-item .pi-ic{font-size:15px}
.palette-item .pi-t{flex:1;font-size:12.5px;font-weight:600}
.palette-item .pi-plus{color:var(--accent);font-weight:800}
.reports-main{min-width:0}
.wg-main{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
/* Tablet: filters + main side by side, add-widget drops below full width */
@media(max-width:1040px){
  .reports-layout{grid-template-columns:180px minmax(0,1fr)}
  .rail-right{grid-column:1 / -1}
  .rail-right .palette{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px}
}
/* Mobile: single column stack, rails not sticky */
@media(max-width:720px){
  .reports-layout{grid-template-columns:1fr}
  .rail{position:static;max-height:none;overflow:visible}
  .rail-right{grid-column:auto}
  .rail-right .palette{grid-template-columns:1fr}
}
.admin-row{align-items:flex-start}
.stages-row{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}
.stchip{font-size:11px;font-weight:700;padding:4px 9px;border-radius:7px;display:inline-flex;gap:5px;align-items:center;white-space:nowrap}
.st-approved{background:var(--green-soft);color:var(--green)}
.st-pending{background:var(--gold-soft);color:var(--gold-ink)}
.st-changes{background:var(--red-soft);color:var(--red)}
.st-waiting{background:var(--slate-soft);color:var(--slate-ink)}
.legend{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}

/* Ministry page */
.mp2{max-width:940px;margin:0 auto}
.mp-head{background:var(--accent);border-radius:16px 16px 0 0;padding:22px 24px;color:#fff}
.mp-pill{display:inline-block;background:rgba(255,255,255,.16);font-size:11px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;padding:3px 10px;border-radius:99px;margin-bottom:10px}
.mp-title{font-size:25px;font-weight:800;letter-spacing:-.4px;margin:0}
.mp-sub{font-size:13.5px;color:#cfe0ee;margin-top:6px}
.mp-actions{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}
.mp-btn{font-size:13px;font-weight:600;border-radius:9px;padding:7px 13px;border:1px solid rgba(255,255,255,.4);background:transparent;color:#fff;cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;gap:6px}
.mp-btn.solid{background:#fff;color:var(--accent);border-color:#fff}
.mp-btn .ico{stroke:currentColor}
/* On a phone the two ministry columns stack, so the rail — team, quick links,
   events — lands below all the prose. Actions that live in the rail on desktop
   get a copy in the header, which is at the top on every surface. */
.on-mobile{display:none!important}
@media(max-width:720px){ .on-mobile{display:inline-flex!important} }
.mp-body{background:var(--bg);border:1px solid var(--line);border-top:none;border-radius:0 0 16px 16px;padding:16px;display:grid;grid-template-columns:1.6fr 1fr;gap:14px}
@media(max-width:720px){.mp-body{grid-template-columns:1fr}}
.mp-card{background:var(--card);border:1px solid var(--line);border-radius:13px;padding:15px 16px;box-shadow:var(--shadow)}
.mp-card+.mp-card{margin-top:14px}
.mp-h{font-size:11px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:var(--accent);margin:0 0 10px;display:flex;justify-content:space-between;align-items:center;gap:8px}
.mp-add{font-size:11.5px;font-weight:700;color:var(--accent);background:var(--accent-soft);border:none;border-radius:7px;padding:3px 9px;cursor:pointer;font-family:inherit}
.lnk-edit{border:none;background:none;color:#b9c3cd;cursor:pointer;padding:2px;border-radius:6px}
.lnk-edit:hover{color:var(--accent)}
.mp-quote{font-size:13.5px;line-height:1.6;border-left:3px solid var(--gold);background:var(--gold-soft);padding:10px 13px;border-radius:0 8px 8px 0;font-style:italic;color:var(--gold-ink)}
.mp-ptext{font-size:13.5px;line-height:1.6;white-space:pre-wrap}
.mp-empty{font-size:12.5px;color:#6b7280;font-style:italic}
.mp-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:520px){.mp-2{grid-template-columns:1fr}}
.mp-glab{font-size:11px;font-weight:700;color:var(--muted);margin-bottom:4px}
.mp-gtext{font-size:13px;line-height:1.55}
.mi-row{display:flex;gap:9px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line);font-size:13px}
.mi-row:last-child{border-bottom:none}
.mi-row .ico{stroke:var(--accent);flex:none}
.mi-dot{width:7px;height:7px;border-radius:50%;background:var(--accent);flex:none}
.mi-rb{flex:1;min-width:0}.mi-rb b{font-weight:700}.mi-rb span{color:var(--muted)}.mi-rb a{color:var(--accent);font-weight:600}
.mi-st{font-size:10px;font-weight:800;text-transform:uppercase;border-radius:6px;padding:2px 7px}
.mi-del{border:none;background:none;color:#cdd5dd;cursor:pointer;padding:2px;border-radius:6px;flex:none}
.mi-del:hover{color:var(--red);background:var(--red-soft)}
.ql-row{display:flex;align-items:center;gap:4px}
.ql-row .ql{flex:1}
.mp-fund{font-size:12.5px;color:var(--muted);margin-top:10px;padding-top:10px;border-top:1px solid var(--line)}
.mp-lock{font-size:10px;background:var(--slate-soft);color:var(--slate-ink);border-radius:5px;padding:1px 6px;margin-left:4px;text-transform:uppercase;font-weight:700}
.ev{display:flex;gap:11px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line)}
.ev:last-child{border-bottom:none}
.ev-d{width:42px;flex:none;text-align:center;background:var(--accent-soft);border-radius:8px;padding:5px 0;color:var(--accent-ink)}
.ev-d .d{font-size:16px;font-weight:800;line-height:1}.ev-d .m{font-size:9.5px;font-weight:700;text-transform:uppercase}
.ev-t{font-size:13px;font-weight:600}.ev-s{font-size:11.5px;color:var(--muted)}
.mp-body .row{display:flex;justify-content:space-between;font-size:12.5px;padding:6px 0;border-bottom:1px solid var(--line)}
.mp-body .row:last-child{border-bottom:none}.mp-body .row .k{color:var(--muted)}.mp-body .row .v{font-weight:600}

/* Resource Library */
.res-toolbar{margin:16px 0 12px}
.res-searchwrap{display:flex;align-items:center;gap:8px;background:var(--card);border:1px solid var(--line);border-radius:11px;padding:0 12px;max-width:420px;color:var(--muted)}
.res-search{border:none;background:none;padding:11px 0;font-size:14px;width:100%}
.res-search:focus{outline:none;box-shadow:none}
.res-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px;margin-top:14px}
.res-card{display:flex;gap:13px;align-items:flex-start;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px;box-shadow:var(--shadow)}
.res-ic{width:42px;height:42px;border-radius:11px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;flex:none}
.res-body{flex:1;min-width:0}
.res-title{font-size:15px;font-weight:700;letter-spacing:-.2px}
.res-desc{font-size:13px;color:var(--muted);margin-top:4px}
.res-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:10px;font-size:11.5px;color:#6b7280}
.res-tag{background:var(--gold-soft);color:var(--gold-ink);font-weight:800;letter-spacing:.3px;border-radius:6px;padding:2px 8px;font-size:10.5px;text-transform:uppercase}
.res-actions{display:flex;align-items:center;gap:6px;flex:none}
.rp-wrap{max-width:760px;margin:0 auto;padding-top:8px}
.rp-top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.mi-link{border:none;background:none;font-family:inherit;color:var(--accent);font-weight:600;cursor:pointer;padding:0;font-size:13px;text-align:left}
.mi-link:hover{text-decoration:underline}
.rp-article{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:34px 40px;margin-top:14px}
@media(max-width:640px){.rp-article{padding:24px 20px}}
.rp-cat{display:inline-block;background:var(--gold-soft);color:var(--gold-ink);font-size:11px;font-weight:800;letter-spacing:.4px;text-transform:uppercase;border-radius:6px;padding:3px 9px;margin-bottom:14px}
.rp-article h1{font-size:26px;font-weight:800;letter-spacing:-.5px;margin-bottom:14px}
.rp-article h2{font-size:18px;font-weight:800;color:var(--accent);margin:24px 0 10px}
.rp-article h3{font-size:15px;font-weight:700;margin:18px 0 8px}
.rp-article p{font-size:14.5px;line-height:1.7;margin:10px 0;color:var(--ink)}
.rp-article ul,.rp-article ol{margin:10px 0 10px 22px}
.rp-article li{font-size:14.5px;line-height:1.7;margin:4px 0}
.rp-article strong{font-weight:700}
.rp-article blockquote{border-left:3px solid var(--gold);background:var(--gold-soft);margin:14px 0;padding:12px 16px;border-radius:0 10px 10px 0;color:var(--gold-ink);font-style:italic;font-size:14px;line-height:1.6}
.rp-article a{color:var(--accent);font-weight:600}
.rp-foot{text-align:center;color:#6b7280;font-size:11.5px;margin:18px 0}

/* Executive Admin sub-nav */
.exec-subnav{display:flex;gap:6px;flex-wrap:wrap;margin:4px 0 4px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.subnav-link{appearance:none;font-family:inherit;border:1px solid var(--line);background:var(--card);color:var(--muted);font-size:13px;font-weight:600;padding:7px 13px;border-radius:10px;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:.15s}
.subnav-link:hover{background:#fbfcfd;border-color:#d3d9e0;color:var(--ink)}
.subnav-link.active{background:var(--accent);border-color:var(--accent);color:#fff}

/* Overview */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:18px}
@media(max-width:720px){.kpis{grid-template-columns:repeat(2,1fr)}}
.kpi{background:linear-gradient(135deg,#075083,#053a61);border:none;border-radius:14px;padding:16px 18px;box-shadow:none}
.kpi-val{font-size:26px;font-weight:800;letter-spacing:-.5px;color:#fff}
.kpi-label{font-size:12px;font-weight:700;margin-top:4px;color:rgba(255,255,255,.85)}
.kpi-sub{font-size:11px;font-weight:600;color:#e7d59f;margin-top:2px}
.ov-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:16px;margin-top:16px}
@media(max-width:720px){.ov-grid{grid-template-columns:1fr}}
.fbar{margin-bottom:14px}
.fbar-top{display:flex;justify-content:space-between;gap:10px;font-size:12.5px;margin-bottom:5px}
.fbar-name{font-weight:600}.fbar-name .fnum{font-weight:800;color:var(--gold-ink);margin-right:6px}
.fbar-amt{font-weight:800;color:var(--accent-ink);white-space:nowrap}
.fbar-track{height:9px;border-radius:99px;background:#e7ebf0;overflow:hidden}
.fbar-track > i{display:block;height:100%;background:linear-gradient(90deg,var(--accent),#0a5e9c);border-radius:99px;transition:width .5s ease}
.famini{display:inline-grid;place-items:center;width:19px;height:19px;border-radius:5px;background:var(--gold-soft);color:var(--gold-ink);font-size:11px;font-weight:800;margin-right:4px}
.up-row{display:flex;gap:12px;align-items:center;padding:9px 0;border-bottom:1px solid var(--line)}
.up-row:last-child{border-bottom:none}
.up-date{width:46px;flex:none;text-align:center;background:var(--accent-soft);border-radius:9px;padding:5px 0;color:var(--accent-ink)}
.up-date .d{font-size:17px;font-weight:800;line-height:1}.up-date .m{font-size:10px;font-weight:700;text-transform:uppercase}
.up-t{font-size:13.5px;font-weight:700}.up-s{font-size:12px;color:var(--muted)}
.kpi-btn{cursor:pointer;font-family:inherit;text-align:left;transition:.15s}
.kpi-btn:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(5,58,97,.3)}
.home-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:18px;margin-top:8px;align-items:start}
@media(max-width:860px){.home-grid{grid-template-columns:1fr}}
.home-main,.home-side{min-width:0}
.home-main>.section-label:first-child{margin-top:0}
.home-side .panel{margin-bottom:16px}
.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.home-empty{color:var(--muted);font-size:13.5px;padding:10px 0}
.ann{padding:11px 0;border-bottom:1px solid var(--line)}
.ann:last-child{border-bottom:none}
.ann-t{font-weight:700;font-size:14px}
.ann-b{font-size:13px;color:var(--muted);margin-top:3px;white-space:pre-wrap}
.ann-m{font-size:11.5px;color:#6b7280;margin-top:5px}
.qlinks{display:flex;flex-direction:column;gap:8px}
.qlink{display:flex;align-items:center;gap:9px;width:100%;text-align:left;font-family:inherit;font-size:13.5px;font-weight:600;color:var(--ink);background:#fcfdfe;border:1px solid var(--line);border-radius:10px;padding:10px 12px;cursor:pointer;transition:.15s}
.qlink:hover{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-ink)}

/* Calendar grid */
.cal-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:18px 0 14px}
.cal-nav{display:flex;align-items:center;gap:8px}
.cal-label{font-size:16px;font-weight:800;min-width:150px;text-align:center}
.cal-views{display:flex;gap:6px}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:16px;overflow:hidden}
.cal-wd{font-size:10px;font-weight:800;color:#8a93a0;text-transform:uppercase;text-align:center;padding:9px 0;letter-spacing:1px;background:var(--card)}
.cal-cell{min-height:96px;background:var(--card);border:none;border-radius:0;padding:7px 8px;display:flex;flex-direction:column;gap:3px;overflow:hidden}
.cal-cell.empty{background:#fbfcfd}
.cal-cell.today{box-shadow:inset 0 0 0 2px var(--accent)}
.cal-daynum{font-size:11.5px;font-weight:700;color:var(--muted);width:22px;height:22px;border-radius:99px;display:grid;place-items:center;margin-bottom:2px}
.cal-cell.today .cal-daynum{color:#fff;background:var(--accent);font-weight:800}
.cal-chip{display:block;width:100%;text-align:left;font-family:inherit;font-size:10px;font-weight:700;line-height:1.25;color:#064c7f;background:var(--accent-soft);border:none;border-radius:6px;padding:3px 6px;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cal-chip:hover{filter:brightness(.96)}
.cal-chip.cc-church{background:var(--gold-soft);color:var(--gold-ink)}
.cal-chip.cc-blackout{background:var(--slate-soft);color:var(--slate-ink)}
.cal-chip.cc-leader{background:#eceef1;color:#3a4149}
.cal-chip.cc-pending{border:1.5px dashed var(--gold-ink);background:#fff8e6}
.cal-chip.cc-declined{border:1.5px dashed var(--red);background:var(--red-soft);opacity:.75}
.chip-badge{font-size:8px;font-weight:800;text-transform:uppercase;letter-spacing:.3px;padding:1px 4px;border-radius:4px;background:rgba(0,0,0,.08);vertical-align:middle}
.cal-event.cc-pending{border-style:dashed;border-color:var(--gold-ink)}
.cal-event.cc-declined{border-style:dashed;border-color:var(--red);opacity:.75}
.cal-legend{display:flex;gap:16px;flex-wrap:wrap;margin:0 0 14px;font-size:12px;color:var(--muted)}
.cl-item{display:inline-flex;align-items:center;gap:6px}
.cl-dot{width:11px;height:11px;border-radius:3px;display:inline-block}
.cl-min{background:var(--accent-soft);border:1px solid #b9cddd}.cl-chu{background:var(--gold-soft);border:1px solid #dcc98a}.cl-bla{background:var(--slate-soft);border:1px solid #c9cfd6}.cl-lea{background:#eceef1;border:1px solid #c9cfd6}.cl-pen{background:#fff8e6;border:1.5px dashed var(--gold-ink)}
.cal-sub-section{border-top:1px solid var(--line);margin-top:16px;padding-top:14px}
.cal-sub-section h3{font-size:14px;font-weight:800;margin-bottom:4px}
.cal-sub-section .hint{margin-bottom:8px}
.cal-sub-section #calSubUrl{font-size:12px}
.cal-layout{width:94vw;max-width:1500px;margin-left:50%;transform:translateX(-50%);display:grid;grid-template-columns:220px minmax(0,1fr);gap:22px;align-items:start;margin-top:14px}
.cal-main{min-width:0}
.cal-main .cal-toolbar{margin-top:0}
@media(max-width:980px){.cal-layout{width:auto;max-width:none;margin-left:0;transform:none;grid-template-columns:1fr}}
.qf-group{margin-bottom:15px}
.qf-glabel{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);margin-bottom:7px}
.qf-chips{display:flex;flex-wrap:wrap;gap:6px}
.rail .chip{padding:5px 10px;font-size:12px}
.rail .lead-select{width:100%;min-width:0;padding:7px 10px}
.cal-right{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.cal-export{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.exp-lbl{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;color:var(--muted)}
.exp-check{display:flex;align-items:center;gap:5px;font-size:12.5px;color:var(--muted);cursor:pointer}
.exp-check input{accent-color:var(--accent)}
.cal-more{font-size:10px;font-weight:700;color:var(--accent);background:none;border:none;cursor:pointer;text-align:left;padding:1px 4px;font-family:inherit}
@media(max-width:640px){.cal-cell{min-height:74px}.cal-chip{font-size:9px}}
.cal-event{width:100%;text-align:left;font-family:inherit;color:inherit;cursor:pointer}

/* Reports widgets */
.widget-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:8px}
@media(max-width:720px){.widget-grid{grid-template-columns:1fr}}
.widget{background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:16px 18px;min-height:120px}
.w-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:10px}
.w-title{font-size:14px;font-weight:700}
.w-x{border:none;background:none;color:#b9c3cd;cursor:pointer;font-size:15px;padding:2px 6px;border-radius:6px}
.w-x:hover{color:var(--red);background:var(--red-soft)}
.w-chart{position:relative;height:240px}
.w-kpi{font-size:34px;font-weight:800;color:var(--accent);letter-spacing:-.5px;padding:14px 0 6px}

.stepper{display:flex;gap:6px;overflow-x:auto;padding:4px 0 14px}
.stepnode{appearance:none;font-family:inherit;border:1px solid var(--line);background:var(--card);color:var(--muted);border-radius:99px;padding:8px 14px;font-size:12.5px;font-weight:700;cursor:pointer;white-space:nowrap;display:inline-flex;align-items:center;gap:7px}
.stepnode .n{width:19px;height:19px;border-radius:50%;background:#e7ebf0;color:var(--muted);font-size:11px;display:grid;place-items:center;font-weight:800}
.stepnode.active{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}
.stepnode.active .n{background:var(--accent);color:#fff}
.stepnode.complete .n{background:var(--green);color:#fff}

.panel{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:24px;margin-bottom:16px}
.panel h2{font-size:18px;font-weight:800;letter-spacing:-.3px}
.panel .lead{color:var(--muted);font-size:13.5px;margin-top:5px;margin-bottom:18px}
.field{margin-bottom:16px}
.field label{display:block;font-size:13px;font-weight:700;margin-bottom:6px}
.field .hint{font-weight:500;color:var(--muted);font-size:12px}
input:not([type]),input[type=text],input[type=email],input[type=password],input[type=date],input[type=time],input[type=number],input[type=tel],input[type=url],input[type=search],select,textarea{width:100%;font-family:inherit;font-size:15px;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:10px;padding:11px 13px;transition:.15s;line-height:1.35}
input::placeholder,textarea::placeholder{color:#aab2bb}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
textarea{resize:vertical;min-height:78px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.row3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px}
@media(max-width:640px){.row2,.row3{grid-template-columns:1fr}}
.focusgrid{display:grid;gap:9px}
.focusopt{display:flex;gap:11px;align-items:flex-start;border:1px solid var(--line);border-radius:11px;padding:11px 13px;cursor:pointer}
.focusopt.on{border-color:var(--accent);background:var(--accent-soft)}
.focusopt .box{width:21px;height:21px;border-radius:6px;border:2px solid #c5cdd6;background:#fff;flex:none;display:grid;place-items:center;margin-top:1px;font-size:12px;color:#fff}
.focusopt.on .box{background:var(--accent);border-color:var(--accent)}
.focusopt .ftxt{font-size:13.5px;font-weight:600}
.focusopt .fnum{font-weight:800;color:var(--gold-ink);margin-right:5px}
.subcard{border:1px solid var(--line);border-radius:13px;padding:16px;margin-bottom:12px;position:relative;background:#fcfdfe}
.subcard .scnum{font-size:11px;font-weight:800;color:var(--gold-ink);text-transform:uppercase;letter-spacing:.5px;margin-bottom:11px}
.subcard .del{position:absolute;top:12px;right:12px;border:none;background:none;color:#b9c3cd;cursor:pointer;font-size:18px;padding:4px;border-radius:6px}
.subcard .del:hover{color:var(--red);background:var(--red-soft)}
.addrow{width:100%;border:1.5px dashed #cdd5dd;background:transparent;color:var(--accent);font-weight:700;border-radius:12px;padding:13px;cursor:pointer;font-family:inherit;font-size:13.5px}
.addrow:hover{background:var(--accent-soft);border-color:var(--accent)}
.importbar{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.check-inline{display:flex;align-items:center;gap:9px;font-size:13.5px;font-weight:600;cursor:pointer}
.check-inline input{width:17px;height:17px;accent-color:var(--accent)}
.totalbar{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;background:var(--accent-soft);border-radius:12px;font-weight:800;color:var(--accent-ink);margin-top:4px}
.totalbar .amt{font-size:18px}
.attach{display:flex;align-items:center;gap:11px;border:1px solid var(--line);border-radius:11px;padding:11px 13px;margin-bottom:9px;background:#fcfdfe}
.attach .ai{font-size:18px}.attach .an{flex:1;font-size:13.5px;font-weight:600;word-break:break-all}.attach .as{font-size:12px;color:var(--muted)}
.formnav{display:flex;justify-content:space-between;gap:12px;margin-top:6px}
.req{color:var(--red)}
/* People directory */
.filterbar{margin:16px 0 4px}
.search{width:100%;max-width:420px;padding:10px 14px;border:1px solid var(--line);border-radius:10px;font-family:inherit;font-size:14px;background:var(--card)}
.muted{color:var(--muted)}
.pchip{display:inline-block;background:#eef1f4;color:var(--gray);border-radius:6px;padding:2px 9px;font-size:11.5px;font-weight:600;margin:2px 3px 2px 0;white-space:nowrap}
.pchip.pl1{background:var(--accent-soft);color:var(--accent);font-weight:800}
.pchip.pl2{background:var(--gold-soft);color:var(--gold-ink);font-weight:700}
/* Ministry team section */
.mp-count{display:inline-block;background:var(--accent-soft);color:var(--accent);border-radius:20px;padding:1px 9px;font-size:12px;font-weight:800;margin-left:6px}
.tm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px}
.tm-rail{display:flex;flex-direction:column;gap:8px}
.tm-row{display:flex;align-items:center;gap:10px;padding:7px 9px;border:1px solid var(--line);border-radius:11px;background:#fcfdfe}
.tm-av{flex:none;width:34px;height:34px;border-radius:50%;background:#e7ebef;color:var(--gray);display:grid;place-items:center;font-size:12px;font-weight:800}
.tm-av.tm-l1{background:var(--accent);color:#fff}
.tm-av.tm-l2{background:var(--gold);color:#fff}
.tm-b{min-width:0;display:flex;flex-direction:column;line-height:1.25}
.tm-b b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tm-role{font-size:11px;color:var(--muted);font-weight:600}
.form-tag{display:inline-block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--accent);background:var(--accent-soft);border-radius:20px;padding:4px 11px;margin-bottom:16px}
.tag-pub{background:#e3f4ea;color:#1c7a45}
.tag-warn{background:#fdeecf;color:#8a5a00}
.tag-arch{background:#eceef1;color:#6b7280}
.mp-sec{position:relative;border:1px dashed var(--gold);border-radius:14px;padding:8px;margin-bottom:14px;background:#fffdf6}
.mp-sec>.mp-card{margin-bottom:0}
.mp-lc{display:flex;gap:6px;align-items:center;margin-bottom:8px}
.mp-lc .iconbtn.sm{width:28px;height:28px;padding:0;display:inline-flex;align-items:center;justify-content:center}
.mp-tray{display:flex;flex-wrap:wrap;gap:8px;align-items:center;border:1px dashed var(--line);border-radius:12px;padding:12px;margin-top:6px;background:var(--panel)}
.mp-tray-h{font-weight:800;font-size:12px;color:var(--ink-soft)}
.dash-cust{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:0 2px 14px}
.dw-sec{position:relative;border:1px dashed var(--gold);border-radius:14px;padding:8px;background:#fffdf6}
.dw-lc{display:flex;gap:6px;align-items:center;margin-bottom:8px}
.dw-lc .iconbtn.sm{width:28px;height:28px;padding:0;display:inline-flex;align-items:center;justify-content:center}
.home-wgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;align-items:start;margin-top:4px}
.home-w{grid-column:1/-1}
.home-wgrid .widget{margin:0}
.home-wgrid .widget-wide,.home-wgrid .dw-sec:has(.widget-wide){grid-column:1/-1}
.ha-row{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;text-align:left;background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-bottom:8px;cursor:pointer}
.ha-row:hover{border-color:var(--gold)}
.collapse-more{margin-top:2px}
.collapse-more>summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;color:var(--brand,#064c7f);padding:8px 2px;user-select:none}
.collapse-more>summary::-webkit-details-marker{display:none}
.collapse-more>summary:hover{text-decoration:underline}
.collapse-more>summary .c-hide{display:none}
.collapse-more[open]>summary .c-show{display:none}
.collapse-more[open]>summary .c-hide{display:inline}
.fhelp{font-size:12.5px;color:var(--muted);margin:-2px 0 7px}
.fill-section{margin:22px 0 6px;border-top:1px solid var(--line);padding-top:16px}
.fill-section h3{font-size:16px;font-weight:800;color:var(--accent)}
.fill-section p{font-size:13px;color:var(--muted);margin-top:3px}
.opt-list{display:flex;flex-direction:column;gap:8px}
.opt-row{display:flex;align-items:center;gap:9px;font-size:14px;cursor:pointer}
.opt-row input{width:17px;height:17px;accent-color:var(--accent)}
.rating{display:flex;gap:4px}
.rating .star{background:none;border:none;cursor:pointer;color:#cfd6dd;padding:2px}
.rating .star.on,.rating .star:hover{color:var(--gold)}
.rating .star .ico{width:26px;height:26px}
.file-in{font-size:13px}
/* form builder */
.fb-layout{display:grid;grid-template-columns:1fr 250px;gap:20px;max-width:1100px;margin:0 auto;align-items:start}
.fb-rail{position:sticky;top:16px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px;box-shadow:var(--shadow)}
.fb-rail-h{font-size:13px;font-weight:800;color:var(--ink)}
.fb-pal{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:10px;padding:9px 11px;margin-bottom:8px;font-size:13px;font-weight:600;background:#fcfdfe;cursor:grab;user-select:none}
.fb-pal:hover{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}
.fb-pal:active{cursor:grabbing}
.fb-canvas{display:flex;flex-direction:column;gap:12px;min-height:120px;border:2px dashed transparent;border-radius:14px;transition:border-color .15s}
.fb-canvas.drop-empty{border-color:var(--accent);background:var(--accent-soft)}
.fb-empty{text-align:center;color:var(--muted);padding:46px 20px;border:2px dashed #cfd6dd;border-radius:14px}
.fb-empty .ico{color:#cfd6dd;margin-bottom:8px}
.fb-field{background:var(--card);border:1px solid var(--line);border-radius:13px;padding:14px;box-shadow:var(--shadow)}
.fb-field.dragging{opacity:.45}
.fb-field.drop-before{box-shadow:0 -3px 0 0 var(--accent),var(--shadow)}
.fb-field.drop-after{box-shadow:0 3px 0 0 var(--accent),var(--shadow)}
.fb-fh{display:flex;align-items:center;gap:8px;margin-bottom:9px}
.fb-grip{cursor:grab;color:#b9c3cd}.fb-grip:active{cursor:grabbing}
.fb-ftag{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;color:var(--accent);background:var(--accent-soft);border-radius:6px;padding:3px 8px}
.fb-fh-sp{flex:1}
.fb-req{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--muted);cursor:pointer}
.fb-req input{width:15px;height:15px;accent-color:var(--accent)}
.fb-x{border:none;background:none;color:#b9c3cd;cursor:pointer;padding:3px;border-radius:6px}
.fb-x:hover{color:var(--red);background:var(--red-soft)}
.fb-label{width:100%;font-size:14.5px;font-weight:600;padding:9px 11px;border:1px solid var(--line);border-radius:9px;margin-bottom:7px}
.fb-help{width:100%;font-size:12.5px;padding:7px 11px;border:1px solid var(--line);border-radius:9px;color:var(--muted)}
.fb-sec-h{font-size:16px;font-weight:800}
.fb-opts{margin-top:9px;display:flex;flex-direction:column;gap:7px}
.fb-opt{display:flex;align-items:center;gap:8px}
.fb-opt-ic{color:#6b7280;flex:none}
.fb-opt input{flex:1;font-size:13px;padding:7px 10px;border:1px solid var(--line);border-radius:8px}
.fb-opt-x{border:none;background:none;color:#b9c3cd;cursor:pointer;padding:2px}
.fb-opt-x:hover{color:var(--red)}
.fb-opt-add{align-self:flex-start;border:none;background:none;color:var(--accent);font-weight:700;font-size:12.5px;cursor:pointer;display:inline-flex;align-items:center;gap:5px;padding:4px 2px}
.fb-prev,.fb-pv{margin-top:10px;width:100%}
.fb-pv{padding:8px 11px;border:1px dashed var(--line);border-radius:9px;background:#f7f9fb;color:#6b7280;font-size:13px}
.fb-pv-opts{margin-top:10px;display:flex;flex-direction:column;gap:6px;color:#6b7280;font-size:13px}
.fb-pv-opts .opt-row{cursor:default}
.fb-pv-stars{margin-top:10px;color:#cfd6dd;display:flex;gap:3px}
.fb-pv-stars .ico{width:22px;height:22px}
.fb-pv-file{display:flex;align-items:center;gap:7px}
.fb-pubrow{display:flex;gap:10px;align-items:flex-start;margin-top:6px;font-size:13px;background:#f7f9fb;border:1px solid var(--line);border-radius:10px;padding:11px 13px}
.fb-pubrow input{width:17px;height:17px;margin-top:1px;accent-color:var(--accent)}
.fb-logic{margin-top:10px;padding-top:10px;border-top:1px dashed var(--line);font-size:12.5px;color:var(--muted);display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.fb-logic .lnk{font-size:12.5px;font-weight:700}
.fb-logic b{color:var(--ink)}
.fb-logic .hint{width:100%;margin:2px 0 0}
/* A real, visible control rather than a text link — as a bare underlined link at
   the bottom of a busy card, nobody found it. */
/* Three controller classes were used in markup but never given rules. They are
   modifiers rather than layout, so nothing looked obviously broken — which is
   exactly why they were easy to miss. */
.lsc-page{padding-bottom:40px}
.lsc-public .lsc-run{max-width:820px;margin:0 auto}
.lsc-att.lsc-sermon{border-color:var(--gold,#C3AB58);background:var(--gold-soft,#f7f1de);color:var(--gold-ink,#8a6d1f)}

.fb-logic-btn{display:inline-flex;align-items:center;gap:6px;background:#f4f7fb;border:1px solid var(--line);
  border-radius:8px;padding:6px 11px;font:700 12.5px inherit;color:var(--accent);cursor:pointer}
.fb-logic-btn:hover{background:#e9f0f8;border-color:var(--accent)}
.fb-logic-btn.is-off{opacity:.5;cursor:default;color:var(--muted)}
.fb-logic.has-rule{background:var(--gold-soft,#f7f1de);border:1px solid #e6d9a8;border-top:1px solid #e6d9a8;
  border-radius:10px;padding:9px 11px;margin-top:12px}
.fb-logic-said{display:inline-flex;align-items:center;gap:6px;color:var(--gold-ink,#8a6d1f);font-weight:600}
.fb-logic.has-rule b{color:var(--gold-ink,#8a6d1f)}
@media(max-width:760px){.fb-layout{grid-template-columns:1fr}.fb-rail{position:static;display:flex;flex-wrap:wrap;gap:8px}.fb-rail-h,.fb-rail .hint{width:100%}.fb-pal{margin-bottom:0}}
/* public form page */
.pubwrap{min-height:100vh;background:#eef1f5;padding:30px 16px 60px}
.pub-top{text-align:center;margin-bottom:18px}
.pub-logo{height:46px}
.pub-card{max-width:640px;margin:0 auto;background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);padding:30px}
.pub-card h2{font-size:22px;font-weight:800;letter-spacing:-.3px}
.pub-foot{text-align:center;color:var(--muted);font-size:12px;margin-top:22px}
.pub-thanks{text-align:center;padding:24px 10px}
.pub-thanks .ico{color:#1c7a45;margin-bottom:8px}
.lnk{background:none;border:none;color:var(--accent);text-decoration:underline;cursor:pointer;font:inherit;padding:0}
/* ---- Sidebar layout ---- */
.layout{display:flex;min-height:100vh}
.sidebar{position:fixed;top:0;left:0;bottom:0;width:236px;background:linear-gradient(180deg,#075083 0%,#053a61 100%);border-right:1px solid rgba(255,255,255,.06);display:flex;flex-direction:column;padding:14px 12px;overflow-y:auto;z-index:50}
.sb-brand{display:flex;align-items:center;padding:10px 8px 16px;cursor:pointer}
.sb-brand img{height:42px}
.sb-nav{display:flex;flex-direction:column;gap:1px}
.sb-group{font-size:10px;font-weight:800;letter-spacing:1.1px;text-transform:uppercase;color:rgba(255,255,255,.45);margin:15px 11px 5px}
.sb-link{display:flex;align-items:center;gap:11px;width:100%;text-align:left;border:none;background:none;font-family:inherit;font-size:14px;font-weight:600;color:#b9cee0;padding:9px 11px;border-radius:9px;cursor:pointer;transition:.12s}
.sb-link .ico{flex:none;width:18px;height:18px}
.sb-link:hover{background:rgba(255,255,255,.1);color:#fff}
.sb-link.active{background:rgba(255,255,255,.12);color:#fff;box-shadow:inset 3px 0 0 var(--gold)}
.sb-link.active .ico{color:var(--gold)}
.sb-overlay{display:none}
.main{flex:1;min-width:0;margin-left:236px;display:flex;flex-direction:column}
.topbar{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:10px;padding:9px 22px;background:#fff;border-bottom:1px solid var(--line);min-height:62px}
.main .app{width:100%;max-width:1080px;padding-top:8px;padding-bottom:96px}
.va-banner + .layout .sidebar{top:38px}
.reports-layout,.cal-layout{width:100%;max-width:none;margin-left:0;transform:none}
.navham{display:none}
@media(max-width:900px){
  .sidebar{transform:translateX(-100%);transition:transform .2s ease;box-shadow:0 0 50px rgba(0,0,0,.25)}
  .sidebar.open{transform:translateX(0)}
  .sidebar.open + .sb-overlay{display:block;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:45}
  .main{margin-left:0;width:100%;min-width:0}
  .topbar{width:100%;max-width:100%;box-sizing:border-box}
  .navham{display:grid}
}
/* density + pill polish */
.maprow{padding:10px 13px}
.notif{padding:11px 14px}
.badge,.frb,.hflag,.pt-st,.pt-cat{letter-spacing:.3px}
.badge,.frb{font-size:11px;font-weight:800;border-radius:20px;padding:3px 10px}
/* ---- View-as banner + picker ---- */
.va-banner{position:sticky;top:0;z-index:40;background:var(--gold-ink);color:#fff;font-size:13px;font-weight:600;padding:8px 16px;display:flex;align-items:center;justify-content:center;gap:10px}
.va-banner .ico{color:#fff}
.va-banner b{font-weight:800}
.va-banner .btn.sm{background:rgba(255,255,255,.18);border-color:transparent;color:#fff}
.va-row{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;text-align:left;border:1px solid var(--line);background:var(--card);border-radius:11px;padding:11px 13px;margin-bottom:8px;cursor:pointer}
.va-row:hover{border-color:var(--accent)}
.va-sub{font-size:12px;color:var(--muted);margin-top:2px}
.exp-modal-btns{display:flex;gap:10px;flex-wrap:wrap}
.exp-modal-btns .btn{flex:1;justify-content:center;min-width:90px}
.at-actions{white-space:nowrap;display:flex;gap:6px;flex-wrap:wrap}
.at-actions .btn.sm{padding:5px 9px}
table.data select{padding:6px 9px;font-size:13px}
/* ---- Personal dashboard ---- */
.dash-mgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px;margin-bottom:6px}
.dash-mcard{display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-align:left;background:var(--card);border:1px solid var(--line);border-radius:13px;padding:15px;box-shadow:var(--shadow);cursor:pointer}
.dash-mcard:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(6,76,127,.1)}
.dm-ic{width:38px;height:38px;border-radius:10px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center}
.dm-name{font-size:14.5px;font-weight:700;letter-spacing:-.2px;line-height:1.25}
.dm-sub{font-size:12px;color:var(--muted)}
.acc-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 2px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.acc-row:last-child{border-bottom:none}
.acc-t{font-size:13.5px}
.acc-btns{display:flex;gap:8px}
.gate{max-width:520px;margin:40px auto;text-align:center;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:40px 28px;box-shadow:var(--shadow)}
.gate-ic{color:#cfd6dd;margin-bottom:8px}
.gate h1{font-size:22px;font-weight:800}
.gate-pillar{color:var(--muted);font-size:13px;margin-top:4px}
.gate .lead{margin:14px 0 18px}
.gate-denied{color:var(--muted);font-size:12.5px;margin-top:12px}
/* ---- Sunday Service ----
   Number of columns is whatever service_times() returns — one, two, three, or
   more. auto-fit lets a third (or fourth) track wrap onto its own row on
   desktop/tablet instead of squeezing three into a row that was tuned for two;
   the phone breakpoint always stacks to a single column regardless of count. */
.svc-tracks{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin-top:14px}
@media(max-width:760px){.svc-tracks{grid-template-columns:1fr}}
.svc-track{background:#f4f6f8;border:1px solid var(--line);border-radius:14px;padding:12px}
.svc-track-h{font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.6px;color:var(--gray);margin:2px 4px 10px}
.seg-card{background:var(--card);border:1px solid var(--line);border-left:4px solid var(--line);border-radius:10px;padding:11px 13px;margin-bottom:9px;box-shadow:var(--shadow)}
.seg-card.seg-blue{border-left-color:var(--accent)}
.seg-card.seg-gold{border-left-color:var(--gold)}
.seg-card.seg-gray{border-left-color:#c0c8d0}
.seg-h{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.seg-h b{font-size:14px}
.seg-time{font-size:12px;color:var(--muted);white-space:nowrap}
.seg-meta{font-size:12px;color:var(--gray);margin-top:4px;display:flex;align-items:center;gap:5px}
.seg-songs,.seg-notes{font-size:12.5px;color:var(--muted);margin-top:4px;white-space:pre-wrap}
.seg-actions{display:flex;gap:6px;margin-top:9px}
.seg-actions .btn.sm{padding:5px 9px}
/* present / live full-screen */
.present{min-height:100vh;background:var(--bg);padding:18px 22px 60px;max-width:1100px;margin:0 auto}
.pc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.pc-card{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px 14px;box-shadow:var(--shadow)}
.pc-av{flex:none;width:40px;height:40px;border-radius:50%;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;font-weight:800;font-size:14px}
.pc-cb{flex:1;min-width:0}
.pc-name{font-weight:700;font-size:14px}
.pc-role{font-size:12px;color:var(--muted)}
/* --- serving panel on the Sunday Service page --- */
.svc-serve-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.svc-serve-team{background:#f4f6f8;border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.svc-serve-teamname{font-size:12.5px;font-weight:800;letter-spacing:.3px;color:var(--gray);margin-bottom:9px}
.svc-serve-role{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin-bottom:7px}
.svc-serve-role:last-child{margin-bottom:0}
.svc-serve-rn{font-size:12px;font-weight:700;color:var(--muted);min-width:74px}
.pchip.open{background:transparent;border:1px dashed var(--line);color:var(--muted)}
/* --- Service Planning role surface: gold "your team" lane, slot chips, wizard step chips, serving-request card --- */
.sp-lane{border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:11px}
.sp-lane.mine{border:1.5px solid var(--gold);background:var(--gold-soft)}
.sp-lane.dim{opacity:.62}
.sp-lane-head{display:flex;align-items:center;gap:8px;margin-bottom:9px;flex-wrap:wrap}
.sp-lane-head b{font-size:13px}
.sp-chip-gold{background:#f7f1de;color:var(--gold-ink);font-size:10px;font-weight:800;padding:2px 8px;border-radius:999px}
.sp-chip-mine{background:var(--accent-soft);color:var(--accent-ink)}
.sp-chip-cur{background:var(--green-soft);color:var(--green)}
.sp-chip-lock{background:var(--slate-soft);color:var(--muted)}
.sp-slot{display:flex;align-items:center;gap:9px;padding:6px 0;border-top:1px dashed var(--line);font-size:12.5px;flex-wrap:wrap}
.sp-slot-role{min-width:96px;color:var(--muted);font-size:11.5px;font-weight:700}
.sp-slot-chip{display:inline-flex;align-items:center;gap:7px;border-radius:9px;padding:5px 9px;font-size:12.5px;font-weight:600}
.sp-slot-chip.ok{background:var(--green-soft);border:1px solid #bfe6cf}
.sp-slot-chip.wait{background:var(--gold-soft);border:1px solid #ecdfb0}
.sp-slot-chip.open{border:1px dashed var(--line);color:var(--muted);font-weight:600}
.sp-ok-txt{color:var(--green);font-size:11px;font-weight:700}
.sp-wait-txt{color:var(--gold-ink);font-size:11px;font-weight:700}
.sp-req{border:1px solid var(--line);border-radius:12px;padding:13px 15px;margin-bottom:11px;display:flex;gap:13px;align-items:center;flex-wrap:wrap}
.sp-req-dt{background:var(--accent);color:#fff;border-radius:10px;text-align:center;padding:7px 11px;min-width:56px}
.sp-req-dt b{display:block;font-size:17px;line-height:1.1}
.sp-req-dt span{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#cfe0f0}
.sp-req-bd{flex:1;min-width:180px}
.sp-req-bd b{font-size:13.5px}
.sp-req-bd span{display:block;font-size:12px;color:var(--muted)}
.lockmsg{display:flex;gap:9px;align-items:center;background:var(--slate-soft);border:1px dashed var(--line);border-radius:10px;padding:10px 13px;font-size:12px;color:var(--muted);margin-top:4px}
/* --- Home: My calendar mini-month grid --- */
/* --- Position clearance matrix (qm-) --- */
.qm-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:14px;background:#fff}
.qm{border-collapse:separate;border-spacing:0;width:100%;min-width:460px}
.qm th,.qm td{border-bottom:1px solid var(--line)}
.qm tbody tr:last-child th,.qm tbody tr:last-child td{border-bottom:0}
.qm-corner{font-size:10.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.qm-role{padding:10px 8px;text-align:center;background:var(--gold-soft);border-left:1px solid var(--line)}
.qm-role span{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:800;color:var(--gold-ink);white-space:nowrap}
.qm-name{position:sticky;left:0;background:#fff;text-align:left;padding:9px 12px;font-size:12.5px;font-weight:700;color:var(--ink);min-width:150px;max-width:210px;z-index:1}
.qm-name span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qm-na{display:block;font-style:normal;font-size:10px;font-weight:700;color:var(--muted);letter-spacing:.03em}
.qm-c{text-align:center;padding:6px 8px;border-left:1px solid var(--line)}
.qm tbody tr:nth-child(even) td,.qm tbody tr:nth-child(even) th{background:#fafbfc}
.qm tbody tr:hover td,.qm tbody tr:hover th{background:var(--accent-soft)}
.qm-tick{display:inline-flex;cursor:pointer;padding:4px}
.qm-tick input{position:absolute;opacity:0;pointer-events:none}
.qm-tick span{width:20px;height:20px;border:1.5px solid var(--line);border-radius:6px;background:#fff;display:grid;place-items:center;transition:all .12s}
.qm-tick:hover span{border-color:var(--accent)}
.qm-tick input:checked+span{background:var(--accent);border-color:var(--accent)}
.qm-tick input:checked+span::after{content:'';width:10px;height:6px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg) translate(1px,-1px)}
.qm-on{color:var(--green);display:inline-flex}
.qm-div td{background:var(--slate-soft)!important;font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:6px 12px;text-align:left}
.qm-extra th span{color:var(--muted)}
.qm-empty{padding:18px 14px;text-align:center;font-size:12.5px;color:var(--muted)}
.qm-bar{display:flex;align-items:center;gap:10px;margin-top:10px;background:var(--accent);color:#fff;border-radius:12px;padding:10px 14px;font-size:13px;animation:qmIn .18s ease}
@keyframes qmIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.qm-bar .btn.ghost{color:#fff;border-color:rgba(255,255,255,.4)}
.qm-bar .btn.primary{background:var(--gold);border-color:var(--gold);color:#2c2508}

/* --- Home "My calendar" widget (hcx-) --- */
.hcx{display:flex;flex-direction:column;gap:12px}
.hcx-top{display:flex;align-items:center;gap:9px}
.hcx-month{flex:1;display:flex;align-items:baseline;gap:6px}
.hcx-month b{font-size:16px;font-weight:800;letter-spacing:-.2px}
.hcx-month span{font-size:13px;color:var(--muted);font-weight:600}
.hcx-today{border:1px solid var(--line);background:var(--gold-soft);color:var(--gold-ink);font:inherit;font-size:11px;font-weight:800;letter-spacing:.04em;border-radius:99px;padding:4px 11px;cursor:pointer}
.hcx-navs{display:flex;gap:5px}
.hcx-navs button{width:30px;height:30px;border:1px solid var(--line);background:#fff;border-radius:9px;display:grid;place-items:center;cursor:pointer;color:var(--accent)}
.hcx-navs button:hover{border-color:var(--accent)}
.hcx-seg{display:flex;gap:5px;background:var(--slate-soft,#eef1f5);border-radius:11px;padding:4px;overflow-x:auto;scrollbar-width:none}
.hcx-seg::-webkit-scrollbar{display:none}
.hcx-seg-b{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;background:none;border-radius:8px;padding:6px 9px;font:inherit;font-size:11.5px;font-weight:700;color:var(--muted);cursor:pointer;white-space:nowrap}
.hcx-seg-b.on{background:#fff;color:var(--ink);box-shadow:0 1px 3px rgba(4,37,63,.14)}
i.hcx-k-serve,i.hcx-k-church,i.hcx-k-min{width:7px;height:7px;border-radius:50%;display:inline-block;flex:none}
.hcx-k-serve{background:var(--gold)}.hcx-k-church{background:var(--accent)}.hcx-k-min{background:#1f7a4d}
.hcx-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;text-align:center}
.hcx-dow{font-size:9.5px;font-weight:800;letter-spacing:.09em;color:var(--muted);text-transform:uppercase;padding:2px 0 5px}
.hcx-d{position:relative;min-height:35px;padding:5px 0 12px;border-radius:9px;font-size:12.5px;font-weight:600;color:var(--ink)}
.hcx-d.out{color:#c3ccd5;font-weight:500}
.hcx-d.evt{cursor:pointer}
.hcx-d.evt:hover{background:var(--accent-soft)}
.hcx-d.today{box-shadow:inset 0 0 0 1.5px var(--accent);color:var(--accent);font-weight:800}
.hcx-d.sel{background:var(--accent);color:#fff}
.hcx-d.sel i{outline:1.5px solid #fff}
.hcx-dots{position:absolute;left:0;right:0;bottom:4px;display:flex;gap:3px;justify-content:center}
.hcx-dots i{width:5px;height:5px;border-radius:50%;display:inline-block}
.hcx-uphead{display:flex;align-items:center;gap:8px;font-size:10.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);border-top:1px solid var(--line);padding-top:11px}
.hcx-clear{margin-left:auto;display:inline-flex;align-items:center;gap:3px;border:0;background:none;font:inherit;font-size:11px;font-weight:700;color:var(--accent);cursor:pointer;text-transform:none;letter-spacing:0}
.hcx-list{display:flex;flex-direction:column}
.hcx-row{display:flex;align-items:center;gap:10px;padding:8px 4px 8px 0;border:0;border-bottom:1px solid var(--line);background:none;font:inherit;text-align:left;cursor:pointer;color:var(--ink);width:100%}
.hcx-row:last-child{border-bottom:0}
.hcx-row:hover{background:var(--accent-soft);border-radius:9px}
.hcx-bar{width:3.5px;align-self:stretch;border-radius:3px;flex:none}
.hcx-date{width:40px;flex:none;text-align:center;line-height:1.05}
.hcx-date b{display:block;font-size:16px;font-weight:800;color:var(--accent-ink)}
.hcx-date span{font-size:9.5px;font-weight:700;text-transform:uppercase;color:var(--muted)}
.hcx-body{flex:1;min-width:0}
.hcx-body b{display:block;font-size:12.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hcx-body span{display:block;font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hcx-row>svg{color:var(--muted);flex:none}
.hcx-empty{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--muted);padding:12px 2px}
.hcx-foot{display:flex;gap:8px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:12px}
@media(max-width:480px){ .sp-slot-role{min-width:100%} }
/* --- service template editor modal --- */
.modal:has(.svc-tpl-editor){max-width:640px}
/* ==========================================================================
   Live Service Controller — #/service/present/<id> (coordinator, gated on
   can_run) and #/live[/<org>] (signed-out congregation, read-only). Prefixed
   lsc- throughout so it can't collide with anything else in the app; this
   fully replaces the old .pr-* present/tick-box styling. */
.lsc-head{background:linear-gradient(160deg,var(--accent),var(--accent-ink));color:#fff;border-radius:16px;padding:20px 24px;position:relative;overflow:hidden;margin-bottom:16px}
.lsc-head::after{content:'';position:absolute;right:-60px;top:-90px;width:320px;height:320px;border-radius:50%;background:radial-gradient(circle,rgba(195,171,88,.22),transparent 65%)}
.lsc-headtop{display:flex;align-items:flex-start;gap:14px;flex-wrap:wrap;position:relative}
.lsc-crumb{font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.lsc-title{margin:6px 0 0;font-size:clamp(20px,3vw,28px);font-weight:800;letter-spacing:-.5px}
.lsc-when{margin:6px 0 0;color:#c8d8e6;font-size:14px}
.lsc-pill{display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);border-radius:99px;padding:6px 12px;font-size:12px;font-weight:700;margin-left:auto}
.lsc-dot{width:8px;height:8px;border-radius:50%;background:#4ade80;box-shadow:0 0 0 0 rgba(74,222,128,.7);animation:lscPulse 2s infinite}
@keyframes lscPulse{0%{box-shadow:0 0 0 0 rgba(74,222,128,.6)}70%{box-shadow:0 0 0 8px rgba(74,222,128,0)}100%{box-shadow:0 0 0 0 rgba(74,222,128,0)}}
.lsc-pill.stale .lsc-dot{background:#fbbf24;animation:none}
.lsc-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px;position:relative}
.lsc-tab{appearance:none;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.08);color:#fff;border-radius:9px;padding:8px 13px;font:inherit;font-size:12.5px;font-weight:700;cursor:pointer}
.lsc-tab.active{background:var(--gold);border-color:var(--gold);color:#2b2410}
.lsc-now{background:var(--accent);color:#fff;border-radius:14px;padding:16px 20px;margin:0 0 16px;display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.lsc-now-empty{justify-content:space-between}
.lsc-nowlab{font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.lsc-nowcur{font-size:22px;font-weight:800;line-height:1.2;margin-top:2px}
.lsc-nowsub{font-size:13px;color:#c3d6e6;margin-top:2px}
.lsc-clock{margin-left:auto;text-align:right}
.lsc-elapsed{font-size:26px;font-weight:800;font-variant-numeric:tabular-nums}
.lsc-drift{font-size:12px;font-weight:700;color:#86efac}
.lsc-drift.over{color:#fca5a5}
.lsc-startsvc{margin-left:auto;white-space:nowrap}
.lsc-changes{background:var(--gold-soft);border:1px solid #e6d9a8;border-radius:12px;padding:12px 16px;margin-bottom:16px}
.lsc-changes h3{margin:0 0 6px;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-ink);display:flex;gap:8px;align-items:center}
.lsc-chg{font-size:13px;color:var(--gold-ink);padding:4px 0;display:flex;gap:8px}
.lsc-chg .lsc-ago{color:#9c8845;font-size:11.5px;white-space:nowrap;margin-left:auto}
.lsc-ackbtn{margin-left:auto;appearance:none;border:1px solid #d9c893;background:#fff;border-radius:7px;padding:4px 10px;font:inherit;font-size:11.5px;font-weight:700;color:var(--gold-ink);cursor:pointer}
.lsc-card{background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);margin-bottom:16px;overflow:hidden}
.lsc-cardh{margin:0;padding:14px 18px;font-size:13px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--accent);border-bottom:1px solid var(--line)}
.lsc-cardbody{padding:6px 18px 12px}
.lsc-seg{display:flex;gap:12px;padding:11px 0;border-bottom:1px solid var(--line);align-items:flex-start}
.lsc-seg:last-child{border-bottom:none}
.lsc-seg.done{opacity:.55}
.lsc-seg.running{background:#f2f8ff;margin:0 -18px;padding-left:18px;padding-right:18px;border-left:4px solid var(--accent)}
.lsc-seg.changed{background:#fffaf0}
.lsc-t{flex:0 0 64px;font-size:13px;font-weight:700;color:var(--accent);padding-top:2px}
.lsc-actual{font-size:11px;font-weight:600;color:var(--muted);margin-top:2px}
.lsc-m{flex:1;min-width:0}
.lsc-m b{font-size:14px;font-weight:650}
.lsc-sub{font-size:12.5px;color:var(--muted);margin-top:1px}
.lsc-atts{margin-top:6px}
.lsc-att{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:700;color:var(--accent);border:1px solid var(--line);border-radius:6px;padding:3px 8px;margin:0 6px 6px 0;background:#fcfdfe;text-decoration:none;cursor:pointer;font-family:inherit}
.lsc-att:hover{background:var(--accent-soft)}
.lsc-rowbtn{white-space:nowrap;flex:none}
.lsc-tagchg{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;background:var(--gold);color:#2b2410;border-radius:4px;padding:2px 6px;margin-left:6px}
.lsc-exitbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end;margin-bottom:20px}
.lsc-footeracts{display:flex;gap:8px;margin-right:auto}
@media(max-width:640px){
  .lsc-now{flex-direction:column;align-items:flex-start}
  .lsc-clock{margin-left:0;text-align:left;width:100%}
  .lsc-t{flex:0 0 auto;min-width:56px}
  .lsc-seg{flex-wrap:wrap}
  .lsc-rowbtn{margin-left:auto}
}
/* ---- Funds requests ---- */
.frb{display:inline-flex;align-items:center;font-size:11.5px;font-weight:800;letter-spacing:.3px;border-radius:99px;padding:4px 10px}
.fr-draft{background:#eceef1;color:var(--slate-ink)}
.fr-submitted{background:var(--gold-soft);color:var(--gold-ink)}
.fr-approved{background:var(--green-soft);color:var(--green)}
.fr-denied{background:var(--red-soft);color:var(--red)}
.fr-paid{background:var(--accent-soft);color:var(--accent)}
.fr-linetotal{font-size:12.5px;color:var(--muted);margin-top:8px;text-align:right}
.fr-linetotal b{color:var(--ink);font-weight:800}
.fr-taxfield{max-width:240px;margin-top:6px}
.fr-taxrow{display:flex;gap:8px}
.fr-taxmode{width:64px;flex:none;text-align:center}
.fr-totalbar{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;background:var(--accent-soft);border-radius:12px;padding:14px 18px;margin:14px 0;font-weight:700;color:var(--accent-ink)}
.fr-subline{font-size:13px;font-weight:600;color:var(--accent-ink)}
.fr-subline b{font-weight:800}
.fr-grand strong{font-size:22px;color:var(--accent);margin-left:6px}
.fr-totalbar strong{font-size:22px;color:var(--accent)}
.fr-subrow td{color:var(--muted);font-weight:600}
.fr-related{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--gray);background:#f7f9fb;border:1px solid var(--line);border-radius:10px;padding:10px 13px;margin-bottom:14px}
.fr-related .ico{color:var(--accent);flex:none}
.fr-related a{cursor:pointer}
.fr-total{font-size:22px;font-weight:800;color:var(--accent);text-align:right;white-space:nowrap}
.fr-total span{display:block;font-size:11px;font-weight:600;color:var(--muted)}
.fr-btns{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.fr-chiprow{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
.fr-sumamt{margin-left:auto;font-size:12.5px;color:var(--muted);font-weight:600}
/* ---- Projects ---- */
.hflag{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;border-radius:20px;padding:3px 10px}
.hflag span{background:rgba(0,0,0,.12);border-radius:10px;padding:0 6px;font-size:11px}
.h-ontrack{background:#e3f4ea;color:#1c7a45}
.h-atrisk{background:var(--gold-soft);color:var(--gold-ink)}
.h-blocked{background:var(--red-soft);color:var(--red)}
.h-done{background:var(--accent-soft);color:var(--accent)}
.pj-board{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:16px}
@media(max-width:900px){.pj-board{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.pj-board{grid-template-columns:1fr}}
.pj-col{background:#f4f6f8;border:1px solid var(--line);border-radius:14px;padding:10px;min-height:80px}
.pj-colh{width:100%;justify-content:space-between;margin-bottom:10px}
.pj-cempty{text-align:center;color:#b9c3cd;padding:14px 0;font-size:13px}
.pj-card{display:block;width:100%;text-align:left;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:13px;margin-bottom:10px;box-shadow:var(--shadow);cursor:pointer}
.pj-card:hover{border-color:#9fb4c6;box-shadow:0 4px 14px rgba(6,76,127,.08)}
.pj-top{display:flex;justify-content:flex-end;margin-bottom:4px}
.pj-date{font-size:11px;color:var(--muted);display:inline-flex;align-items:center;gap:4px}
.pj-name{font-size:14.5px;font-weight:700;letter-spacing:-.2px;line-height:1.25}
.pj-sub{font-size:12px;color:var(--muted);margin-top:3px}
.pj-bar{height:6px;background:#e7ebef;border-radius:6px;overflow:hidden;margin-top:10px}
.pj-bar.big{height:10px;flex:1}
.pj-fill{height:100%;background:linear-gradient(90deg,#075083,#0a6bad);border-radius:6px}
.pj-prog{font-size:11px;color:var(--muted);margin-top:6px}
.pj-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;max-width:880px;margin:6px auto 16px;flex-wrap:wrap}
.pj-headmain h1{font-size:24px;font-weight:800;letter-spacing:-.4px;margin-top:8px}
.pj-headsub{color:var(--muted);font-size:13.5px;margin-top:5px}
.pj-leads{font-size:12.5px;color:var(--gray);margin-top:4px}
.pj-headact{display:flex;gap:8px;flex-wrap:wrap}
.pj-statpanel{max-width:880px;margin:0 auto 16px}
.pj-statrow{display:flex;align-items:center;gap:18px}
.pj-statn{font-size:26px;font-weight:800;color:var(--accent);white-space:nowrap}
.pj-statn span{display:block;font-size:11.5px;font-weight:600;color:var(--muted)}
.pj-note{display:flex;gap:8px;align-items:flex-start;margin-top:14px;font-size:13px;color:var(--gray);background:#f7f9fb;border-radius:10px;padding:10px 12px}
.pj-note .ico{color:var(--gold-ink);flex:none;margin-top:1px}
.pj-tasks{max-width:880px;margin:0 auto}
.ph-group{margin-bottom:18px}
.ph-head{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.7px;color:var(--accent);margin:0 2px 8px}
.ph-ct{background:var(--accent-soft);color:var(--accent);border-radius:20px;padding:1px 8px;font-size:11px}
.pt-row{display:flex;align-items:flex-start;gap:11px;background:var(--card);border:1px solid var(--line);border-radius:11px;padding:11px 13px;margin-bottom:8px}
.pt-cb{width:18px;height:18px;margin-top:1px;accent-color:var(--accent);flex:none;cursor:pointer}
.pt-main{flex:1;min-width:0}
.pt-title{background:none;border:none;text-align:left;font:inherit;font-size:14px;font-weight:600;color:var(--ink);cursor:pointer;padding:0}
.pt-title:hover{color:var(--accent)}
.pt-title.done{text-decoration:line-through;color:#6b7280;font-weight:500}
.pt-meta{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:5px;font-size:11.5px;color:var(--muted)}
.pt-cat{background:#eef1f4;color:var(--gray);border-radius:5px;padding:1px 7px;font-weight:700;font-size:10.5px}
.pt-as,.pt-due{display:inline-flex;align-items:center;gap:4px}
.pt-st{border-radius:5px;padding:1px 7px;font-weight:700;font-size:10.5px}
.st-inprogress{background:var(--gold-soft);color:var(--gold-ink)}
.st-blocked{background:var(--red-soft);color:var(--red)}
.pt-side{display:flex;align-items:center;gap:6px;flex:none}
.cm-list{display:flex;flex-direction:column;gap:10px;margin-bottom:12px;max-height:260px;overflow-y:auto}
.cm{background:#f7f9fb;border-radius:10px;padding:9px 12px}
.cm-h{display:flex;justify-content:space-between;font-size:12px;margin-bottom:3px}
.cm-h b{font-weight:700}
.cm-h span{color:var(--muted)}
.cm-b{font-size:13.5px;white-space:pre-wrap}
.btn.danger.ghost{color:var(--red);border-color:transparent;background:none}
.spacer{flex:1}
/* reporting strip + create picker */
.rep-strip{display:flex;gap:12px;margin-top:16px;flex-wrap:wrap}
.rep-cell{flex:1;min-width:120px;background:var(--card);border:1px solid var(--line);border-radius:13px;padding:14px 16px;box-shadow:var(--shadow)}
.rep-n{font-size:26px;font-weight:800;color:var(--accent);letter-spacing:-.5px}
.rep-l{font-size:12px;color:var(--muted);font-weight:600;margin-top:2px}
.pj-tag{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;color:var(--accent);background:var(--accent-soft);border-radius:5px;padding:1px 7px}
.pj-type{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:var(--gray);background:#eef1f4;border-radius:5px;padding:2px 8px;margin-left:8px;vertical-align:middle}
.pick-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:6px}
@media(max-width:560px){.pick-row{grid-template-columns:1fr}}
.pick-card{display:flex;flex-direction:column;align-items:flex-start;gap:5px;text-align:left;border:1.5px solid var(--line);border-radius:13px;padding:16px;background:#fcfdfe;cursor:pointer}
.pick-card:hover{border-color:var(--accent);background:var(--accent-soft)}
.pick-card b{font-size:15px}.pick-card span:last-child{font-size:12.5px;color:var(--muted)}
.pick-ic{color:var(--accent)}
/* kanban */
.pj-head,.pj-statpanel{max-width:none}
.kb-wrap{display:grid;grid-template-columns:1fr 240px;gap:18px;align-items:start}
@media(max-width:820px){.kb-wrap{grid-template-columns:1fr}}
.kb-board{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
@media(max-width:1000px){.kb-board{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.kb-board{grid-template-columns:1fr}}
.kb-col{background:#f4f6f8;border:1px solid var(--line);border-radius:13px;padding:10px;min-height:90px}
.kb-col.over{border-color:var(--accent);background:var(--accent-soft)}
.kb-colh{display:flex;align-items:center;gap:7px;width:100%;background:none;border:none;cursor:pointer;font-family:inherit;padding:0;margin-bottom:9px;color:var(--gray)}
.kb-coltitle{flex:1;text-align:left;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.5px}
.kb-chev{display:inline-flex;color:var(--muted);transition:transform .15s}
.kb-col.collapsed .kb-chev{transform:rotate(-90deg)}
.kb-col.collapsed{min-height:0}
.kb-col.collapsed .kb-colh{margin-bottom:0}
.kb-ct{background:#e3e8ed;border-radius:10px;padding:0 7px;font-size:11px}
.kb-cards{display:flex;flex-direction:column;gap:8px;min-height:30px}
.kb-empty{text-align:center;color:#c0c8d0;font-size:12px;padding:10px 0;border:1.5px dashed #d6dde3;border-radius:9px}
.kb-add{width:100%;margin-top:8px;border:none;background:none;color:var(--accent);font-weight:700;font-size:12.5px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:5px;padding:7px;border-radius:8px}
.kb-add:hover{background:var(--accent-soft)}
.kb-card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:10px 11px;box-shadow:var(--shadow);cursor:grab}
.kb-card:hover{border-color:#9fb4c6;box-shadow:0 4px 14px rgba(6,76,127,.08)}
.kb-card.dragging{opacity:.45}
/* app-wide pointer-based drag-to-reorder (dragSort()) */
.drag-grip{display:inline-flex;align-items:center;justify-content:center;padding:4px;color:#aab4bd;cursor:grab;touch-action:none;flex:none}
.drag-grip:hover{color:var(--muted)}
.drag-grip:active{cursor:grabbing}
.dragging{opacity:.9;box-shadow:0 12px 28px rgba(21,24,28,.18);transform:scale(1.02);cursor:grabbing}
.drag-ph{border:2px dashed var(--accent);border-radius:10px;background:var(--accent-soft);opacity:.7}
.drag-noselect,.drag-noselect *{user-select:none}
.kb-ctitle{font-size:13px;font-weight:600;line-height:1.3}
.kb-cmeta{display:flex;flex-wrap:wrap;gap:7px;align-items:center;margin-top:7px;font-size:11px;color:var(--muted)}
.kb-cfoot{display:flex;justify-content:space-between;align-items:center;margin-top:9px}
.kb-cc{font-size:11px;color:var(--muted);display:inline-flex;align-items:center;gap:4px}
.kb-rail{position:sticky;top:16px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px;box-shadow:var(--shadow);max-height:80vh;overflow-y:auto}
.rail-top{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:2px}
.rail-top .btn.sm{padding:5px 10px;font-size:12px}
.rail-grp{margin-bottom:12px}
.rail-gh{font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin:0 0 6px}
.rail-step{display:flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:9px;padding:7px 9px;margin-bottom:6px;font-size:12px;background:#fcfdfe;cursor:grab}
.rail-step:hover{border-color:var(--accent);background:var(--accent-soft)}
.rail-step .ico{color:#b9c3cd;flex:none}
.rail-step.added{opacity:.5;cursor:default;background:#f4f6f8}
.rail-step.added .ico{color:#1c7a45}
.rail-step span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* ---- responsive nav ---- */
.mainnav{display:flex;gap:2px;margin-left:8px;flex-wrap:wrap}
.navham{display:none}
header.top .inner{position:relative;flex-wrap:nowrap}
@media(max-width:1040px){.navlink{padding:8px 9px;font-size:13px}}
@media(max-width:920px){.mainnav .navlink .ico{display:none}.navlink{padding:8px 8px}}
@media(max-width:820px){
  .navham{display:grid}
  .mainnav{display:none;position:absolute;top:calc(100% + 8px);left:0;right:0;flex-direction:column;flex-wrap:nowrap;background:var(--card);border:1px solid var(--line);border-radius:13px;padding:8px;gap:2px;box-shadow:0 14px 40px rgba(6,76,127,.16);z-index:60;margin-left:0}
  .mainnav.open{display:flex}
  .mainnav .navlink{width:100%;justify-content:flex-start;font-size:15px;padding:12px 13px}
  .mainnav .navlink .ico{display:inline-block}
  .kb-rail{position:static;max-height:none}
}
/* ---- mobile polish ---- */
@media(max-width:640px){
  .app{padding:0 13px 84px}
  header.top{padding:10px 13px}
  .hero{padding:18px 0 2px}
  .hero h1{font-size:20px}
  .hero p{font-size:13px}
  .panel{padding:18px 16px}
  .modal{padding:18px;border-radius:14px}
  .modal-bg{padding:10px}
  .modal-actions{flex-wrap:wrap}
  .pj-statrow{flex-direction:column;align-items:stretch;gap:10px}
  .pj-statn{font-size:22px}
  .pj-head h1,.pj-headmain h1{font-size:21px}
  .pj-headact{width:100%}
  .pj-headact .btn{flex:1;justify-content:center}
  .rep-cell{min-width:0}
  .rep-n{font-size:22px}
  table.data{font-size:12px}
  table.data th,table.data td{padding:8px 8px}
  .pub-card{padding:22px 18px}
  .exp-row{flex-wrap:wrap}
  h1{font-size:22px}
  .tm-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:400px){.tm-grid{grid-template-columns:1fr}}
.note-box{font-size:12.5px;color:var(--gold-ink);background:var(--gold-soft);border-radius:10px;padding:10px 13px;margin-top:6px}
.recap-line{display:flex;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px solid var(--line);font-size:13.5px}
.recap-line:last-child{border-bottom:none}
.recap-line .rk{color:var(--muted);font-weight:600}

/* Artifact */
.artifact{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
.art-head{padding:26px 28px;border-bottom:1px solid var(--line);display:flex;align-items:flex-start;justify-content:space-between;gap:18px}
.art-head img{height:30px}
.art-head h1{font-size:21px;font-weight:800;letter-spacing:-.3px;margin-top:14px}
.art-head .sub{color:var(--muted);font-size:13.5px;margin-top:4px}
.art-body{padding:8px 28px 28px}
.art-sec{padding:20px 0;border-bottom:1px solid var(--line)}
.art-sec:last-child{border-bottom:none}
.art-sec h3{font-size:12.5px;font-weight:800;letter-spacing:.7px;text-transform:uppercase;color:var(--accent);margin-bottom:13px}
.kv{margin-bottom:13px}.kv .k{font-size:12px;font-weight:700;color:var(--muted);margin-bottom:3px}.kv .v{font-size:14px;white-space:pre-wrap}
.goalpill{display:inline-block;background:var(--accent-soft);color:var(--accent-ink);border-radius:8px;padding:5px 11px;font-size:13px;font-weight:600;margin:0 6px 6px 0}
.focuschip{display:inline-flex;gap:6px;background:var(--gold-soft);color:var(--gold-ink);border-radius:8px;padding:5px 11px;font-size:12.5px;font-weight:700;margin:0 6px 6px 0}
table.data{width:100%;border-collapse:collapse;font-size:13px}
table.data th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);font-weight:800;padding:8px 10px;border-bottom:2px solid var(--line)}
table.data td{padding:10px;border-bottom:1px solid var(--line);vertical-align:top}
table.data tr:last-child td{border-bottom:none}
table.data .num{text-align:right;white-space:nowrap}
.table-wrap{overflow-x:auto}
/* per-column filter row on the submission tables — always visible under the header */
.colf-row th{background:var(--bg);padding:6px 8px;border-bottom:1px solid var(--line);text-transform:none;letter-spacing:normal;font-weight:400}
.colf-ctl{width:100%;font-size:12.5px;padding:6px 8px;border-radius:8px;min-width:88px}
.colf-date{display:flex;gap:4px}
.colf-date .colf-ctl{min-width:0}
.sub-colf-count{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:10px 2px}
@media(max-width:640px){ .colf-ctl{font-size:12px;padding:6px 6px} }
.budget-total td{font-weight:800;color:var(--accent-ink);border-top:2px solid var(--line)}
.review-item{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}
.review-item:last-child{border-bottom:none}
.review-item .ri-ic{width:32px;height:32px;border-radius:50%;flex:none;display:grid;place-items:center;font-size:15px}
.ri-approved{background:var(--green-soft);color:var(--green)}.ri-changes{background:var(--red-soft);color:var(--red)}
.cal-event .chev{color:#b9c3cd}
.review-item .ri-by{font-weight:700;font-size:13.5px}.review-item .ri-meta{font-size:12px;color:var(--muted)}.review-item .ri-c{font-size:13.5px;margin-top:5px}
.actionbar{position:sticky;bottom:0;z-index:20;background:rgba(244,246,248,.92);backdrop-filter:blur(8px);border-top:1px solid var(--line);margin:18px -20px 0;padding:14px 20px;display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.art-foot{text-align:center;color:#6b7280;font-size:11.5px;padding:16px;border-top:1px solid var(--line)}

/* Calendar */
.cal-month{font-size:14px;font-weight:800;color:var(--accent);margin:22px 2px 12px;letter-spacing:.3px}
.cal-event{display:flex;gap:14px;background:var(--card);border:1px solid var(--line);border-radius:13px;padding:14px 16px;margin-bottom:10px;box-shadow:var(--shadow)}
.cal-date{width:54px;flex:none;text-align:center;background:var(--accent-soft);border-radius:10px;padding:7px 0;color:var(--accent-ink)}
.cal-date .d{font-size:19px;font-weight:800;line-height:1}.cal-date .m{font-size:10.5px;font-weight:700;text-transform:uppercase}
.cal-event .ce-body{flex:1;min-width:0}
.cal-event h4{font-size:15px;font-weight:700}
.cal-event .ce-sub{font-size:12.5px;color:var(--muted);margin-top:3px}

/* Notifications */
.notif{display:flex;gap:13px;background:var(--card);border:1px solid var(--line);border-radius:13px;padding:15px 16px;margin-bottom:11px;box-shadow:var(--shadow)}
.notif.unread{border-left:3px solid var(--gold)}
.notif .nic{width:38px;height:38px;border-radius:10px;flex:none;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent)}
.notif .ntitle{font-weight:700;font-size:14px}.notif .nmsg{font-size:13px;color:var(--muted);margin-top:3px}.notif .ntime{font-size:11.5px;color:#6b7280;white-space:nowrap}

/* Modal + toast */
.modal-bg{position:fixed;inset:0;background:rgba(21,24,28,.45);z-index:50;display:none;align-items:center;justify-content:center;padding:20px}
.modal-bg.show{display:flex}
.modal{background:#fff;border-radius:18px;max-width:460px;width:100%;padding:24px;box-shadow:0 20px 60px rgba(0,0,0,.3);max-height:88vh;overflow:auto}
.modal h2{font-size:18px;font-weight:800;margin-bottom:6px}.modal .lead{color:var(--muted);font-size:13.5px;margin-bottom:16px}
.modal-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:18px}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#15181c;color:#fff;padding:11px 18px;border-radius:11px;font-size:13.5px;font-weight:600;z-index:80;box-shadow:0 8px 30px rgba(0,0,0,.3);opacity:0;transition:.2s;pointer-events:none}
.toast.show{opacity:1}

@media print{
  @page{margin:14mm}
  body{background:#fff}
  header.top,.actionbar,.no-print,.iconbtn{display:none!important}
  .app{max-width:none;padding:0}
  .artifact{border:none;box-shadow:none}
  .art-sec{break-inside:avoid}
}

/* ---- Onboarding / course checklist rows ---- */
.onb-row{display:flex;align-items:flex-start;gap:12px;padding:13px 4px;border-bottom:1px solid var(--line)}
.onb-row:last-child{border-bottom:none}
.onb-row .pt-cb{margin-top:2px;width:18px;height:18px;flex:none}
.onb-b{flex:1;min-width:0}
.onb-t{font-weight:600;color:var(--ink)}
.onb-row.done .onb-t{color:var(--muted);text-decoration:line-through}
.onb-d{display:block;color:var(--muted);font-size:13px;margin-top:2px;text-decoration:none}
a.onb-d{color:var(--accent);text-decoration:none}
a.onb-d:hover{text-decoration:underline}

/* ---- Prayer wall ---- */
.pray-card{padding:16px 18px}
.pray-body{color:var(--ink);line-height:1.55;white-space:pre-wrap}
.pray-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;flex-wrap:wrap}
.pray-by{color:var(--muted);font-size:13px}
.pray-actions{display:flex;gap:8px;align-items:center}

/* ---- Avatars ---- */
.ava{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background-size:cover;background-position:center;background-color:var(--accent);color:#fff;font-weight:700;flex:none;overflow:hidden;line-height:1}
.ava.ini{font-weight:700}
.ava.sm{width:30px;height:30px;font-size:12px}
.ava.md{width:64px;height:64px;font-size:22px}
.ava.lg{width:84px;height:84px;font-size:30px}
.iconbtn.avbtn{padding:0;width:34px;height:34px;border-radius:50%;overflow:hidden}
.iconbtn.avbtn.active{box-shadow:0 0 0 2px var(--accent)}

/* ---- Profile page ---- */
.prof-head{display:flex;align-items:center;gap:16px}
.prof-name{font-weight:700;font-size:19px;color:var(--ink)}
.prof-sub{color:var(--muted);font-size:14px;margin-top:2px;text-transform:capitalize}
.prof-photo{display:flex;align-items:center;gap:18px}
.prof-photo-actions{display:flex;flex-direction:column;gap:6px}
.prof-photo-btns{display:flex;gap:8px;flex-wrap:wrap}
.prof-hr{border:none;border-top:1px solid var(--line);margin:18px 0}
.prof-signout{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;color:var(--muted)}
.tog-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:13px 2px;border-bottom:1px solid var(--line);cursor:pointer}
.tog-row:last-of-type{border-bottom:none}
.tog-t{font-weight:600;color:var(--ink)}
.tog-d{color:var(--muted);font-size:13px;margin-top:2px;max-width:46ch}
.tog-row input[type=checkbox]{width:20px;height:20px;flex:none}

/* ---- Invite / share sidebar button ---- */
.sb-link.sb-invite{margin-top:10px;border-top:1px solid rgba(255,255,255,.08);border-radius:0;padding-top:14px;color:#b9cee0}
.sb-link.sb-invite:hover{color:var(--gold)}

/* ---- Beta banner ---- */
.beta-banner{display:flex;align-items:center;gap:10px;justify-content:center;flex-wrap:wrap;background:var(--accent);color:#fff;padding:8px 16px;font-size:13.5px;font-weight:500}
.beta-banner svg{flex:none}
.beta-banner span{opacity:.95}
.beta-banner .btn.sm{background:#fff;color:var(--accent);border:none;font-weight:600}
.beta-banner .btn.sm:hover{background:rgba(255,255,255,.9)}

/* ---- Feedback list ---- */
.fb-item{padding:14px 16px}
.fb-top{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:6px;flex-wrap:wrap}
.fb-body{color:var(--ink);line-height:1.55;white-space:pre-wrap}

/* ---- Beta banner layout offsets (fixed sidebar) ---- */
.beta-banner{position:sticky;top:0;z-index:55}
.beta-banner + .layout .sidebar{top:38px}
.va-banner ~ .beta-banner{top:38px}
.va-banner + .beta-banner + .layout .sidebar{top:76px}

/* ---- Admin feedback inbox ---- */
.at-badge{display:inline-block;background:var(--gold-ink,#9a7b1f);color:#fff;font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;margin-left:6px;vertical-align:middle}
td.fb-cell{white-space:pre-wrap;max-width:520px}

/* ---- Reports: control bar ---- */
.rpt-bar{display:flex;flex-wrap:wrap;align-items:flex-end;gap:14px;margin:6px 0 16px}
.rpt-ctl{display:flex;flex-direction:column;gap:5px}
.rpt-ctl>span{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:var(--muted)}
.rpt-ctl select{min-width:190px}
.rpt-bar-actions{display:flex;gap:8px;flex-wrap:wrap;margin-left:auto;align-items:center}
@media(max-width:640px){ .rpt-ctl select{min-width:0;width:100%} .rpt-ctl{flex:1 1 100%} .rpt-bar-actions{margin-left:0;width:100%} }

/* ---- Reports: widget grid + cards ---- */
.wg-main{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;margin-top:4px}
@media(max-width:680px){ .wg-main{grid-template-columns:1fr} }
.widget{background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:14px 16px;min-height:150px;display:flex;flex-direction:column}
.w-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.w-title{font-weight:700;color:var(--ink);font-size:14.5px}
.w-x{background:none;border:none;color:var(--muted);cursor:pointer;padding:2px;border-radius:6px}
.w-x:hover{color:var(--danger,#a4322b);background:#f4f6f8}
.w-body{flex:1;min-height:120px}
.w-chart{position:relative;height:240px}
.w-kpi{font-size:40px;font-weight:800;color:var(--accent);padding:18px 0;text-align:center}
.w-empty{color:var(--muted);font-size:13px;display:flex;align-items:center;justify-content:center;height:120px}

/* ---- Reports: builder modal ---- */
.seg-toggle{display:flex;gap:0;border:1px solid var(--line);border-radius:10px;overflow:hidden;margin-bottom:16px}
.seg-btn{flex:1;background:#fff;border:none;padding:10px;font-family:inherit;font-weight:600;font-size:13.5px;color:var(--muted);cursor:pointer}
.seg-btn.on{background:var(--accent);color:#fff}
.bld-series-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);margin:8px 0 8px}
.bld-series{display:flex;gap:8px;align-items:center;margin-bottom:8px}
.bld-series select{flex:1;min-width:0}
.bld-sp{width:30px;flex:none}

/* ---- Permissions matrix ---- */
.perm-matrix th.pm-role{text-align:center;font-size:12px;white-space:nowrap}
.perm-matrix td.pm-cell{text-align:center}
.perm-matrix td.pm-cell input{width:18px;height:18px;cursor:pointer}
.perm-matrix tr.pm-group td{background:#f4f6f8;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);padding:8px 10px}

/* ---- Handbook accordions ---- */
.hb{padding:6px 8px}
.hb-item{border-bottom:1px solid var(--line)}
.hb-item:last-child{border-bottom:none}
.hb-item summary{cursor:pointer;padding:13px 10px;font-weight:600;color:var(--ink);list-style:none;display:flex;align-items:center;gap:8px}
.hb-item summary::-webkit-details-marker{display:none}
.hb-item summary::before{content:"+";color:var(--accent);font-weight:800;font-size:16px;width:14px;display:inline-block}
.hb-item[open] summary::before{content:"\2013"}
.hb-item summary:hover{color:var(--accent)}
.hb-body{padding:2px 12px 16px 32px;color:var(--ink);font-size:14px;line-height:1.6}
.hb-body p{margin:0 0 10px}
.hb-body ul{margin:0 0 10px;padding-left:20px}
.hb-body li{margin-bottom:5px}
.hb-body code{background:#f4f6f8;padding:2px 6px;border-radius:5px;font-size:13px}

/* ---- Multi-role checkboxes ---- */
.role-chks{display:flex;flex-wrap:wrap;gap:6px 14px}
.role-chk{display:inline-flex;align-items:center;gap:5px;font-size:13px;white-space:nowrap;cursor:pointer}
.role-chk input{width:15px;height:15px}

/* ---- Drill-down table widgets ---- */
.drill-tbl tr{cursor:pointer}
.drill-tbl tr:hover td{background:var(--accent-soft,#eef4f9)}

/* ---- Help & data assistant (chatbot) ---- */
.chat-fab{position:fixed;right:22px;bottom:22px;width:56px;height:56px;border-radius:50%;border:none;background:var(--accent);color:#fff;box-shadow:0 6px 22px rgba(6,76,127,.4);cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:200}
.chat-fab:hover{filter:brightness(1.07)}
.chat-fab.hide{display:none}
.chat-panel{position:fixed;right:22px;bottom:22px;width:370px;max-width:calc(100vw - 32px);height:540px;max-height:calc(100vh - 100px);background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:0 16px 50px rgba(0,0,0,.28);z-index:201;display:none;flex-direction:column;overflow:hidden}
.chat-panel.open{display:flex}
.chat-head{display:flex;align-items:center;justify-content:space-between;background:var(--accent);color:#fff;padding:13px 15px;font-weight:700;font-size:14.5px}
.chat-head span{display:flex;align-items:center;gap:8px}
.chat-x{background:none;border:none;color:#fff;cursor:pointer;opacity:.85;padding:2px}
.chat-x:hover{opacity:1}
.chat-msgs{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px;background:#f7f9fb}
.cm{max-width:85%;padding:9px 13px;border-radius:14px;font-size:14px;line-height:1.5}
.cm.bot{background:#fff;border:1px solid var(--line);align-self:flex-start;border-bottom-left-radius:4px;color:var(--ink)}
.cm.user{background:var(--accent);color:#fff;align-self:flex-end;border-bottom-right-radius:4px}
.cm.bot ul{margin:6px 0 2px;padding-left:18px}
.cm.bot li{margin-bottom:3px}
.chat-link{display:inline-block;margin-top:8px;background:var(--accent-soft,#eef4f9);color:var(--accent);border:1px solid var(--line);border-radius:8px;padding:5px 10px;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit}
.chat-link:hover{background:var(--accent);color:#fff}
.chat-typing{letter-spacing:2px;color:var(--muted);animation:chatblink 1s infinite}
@keyframes chatblink{50%{opacity:.4}}
.chat-quick{display:flex;gap:6px;overflow-x:auto;padding:8px 10px;border-top:1px solid var(--line);background:var(--card)}
.chat-chip{flex:none;background:#fff;border:1px solid var(--line);border-radius:999px;padding:6px 11px;font-size:12.5px;cursor:pointer;font-family:inherit;color:var(--ink);white-space:nowrap}
.chat-chip:hover{border-color:var(--accent);color:var(--accent)}
.chat-input{display:flex;gap:8px;padding:10px;border-top:1px solid var(--line);background:var(--card)}
.chat-input input{flex:1;min-width:0}
.chat-input .btn{flex:none}
@media(max-width:640px){ .chat-panel{right:8px;left:8px;bottom:8px;width:auto;height:70vh} .chat-fab{right:16px;bottom:16px} }

.hb-foot{padding:14px 16px;color:var(--ink);font-size:14px}

.al-act{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;background:#f4f6f8;color:var(--accent);padding:2px 7px;border-radius:6px}

/* ---- Brand & Design page ---- */
.bk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px;margin-top:4px}
.bk-asset{background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);overflow:hidden}
.bk-logo{height:120px;display:flex;align-items:center;justify-content:center;padding:18px;background:#fff}
.bk-logo.on-dark{background:var(--accent)}
.bk-logo img{max-width:100%;max-height:80px;object-fit:contain}
.bk-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;border-top:1px solid var(--line);font-size:13px}
.bk-colors{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-top:4px}
.bk-color{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:8px 10px;cursor:pointer;font-family:inherit;text-align:left}
.bk-color:hover{border-color:var(--accent)}
.bk-swatch{width:34px;height:34px;border-radius:8px;border:1px solid rgba(0,0,0,.1);flex:none}
.bk-cname{font-weight:600;font-size:13px;color:var(--ink);flex:1}
.bk-hex{font-family:ui-monospace,Menlo,monospace;font-size:12px;color:var(--muted)}
.bk-type{display:flex;align-items:center}
.bk-font{font-weight:800;font-size:26px;color:var(--ink)}
.dt-thumb{height:130px;background:#f4f6f8;background-size:cover;background-position:center;display:flex;align-items:center;justify-content:center;color:#b9c3cd}
.dt-actions{display:flex;align-items:center;gap:8px;margin-top:10px}
.res-card.dt-card{display:flex;flex-direction:column;align-items:stretch;padding:0;overflow:hidden;cursor:default}
.res-card.dt-card .res-body{padding:12px 14px}
.dt-noimg{font-size:0}

/* ---- Mobile compaction: beta banner ---- */
@media(max-width:640px){
  .beta-banner{font-size:12px;padding:6px 12px;gap:7px}
  .beta-extra{display:none}
  .beta-banner .btn.sm{padding:5px 10px;font-size:12px}
}

/* ---- Blended report widget spans full dashboard width ---- */
.widget.widget-wide{grid-column:1 / -1}

/* ---- Sidebar footer group (Get Started / Help / Invite) ---- */
.sb-foot{border-top:1px solid rgba(255,255,255,.08);margin-top:12px;padding-top:6px}
.sb-link.sb-invite{border-top:none;margin-top:0;padding-top:9px}

/* ---- Form QR code modal ---- */
.qr-grid{display:flex;gap:16px;flex-wrap:wrap;margin-top:6px}
.qr-card{flex:1 1 220px;min-width:200px;border:1px solid var(--line);border-radius:14px;padding:16px 14px;background:#fcfdfe;display:flex;flex-direction:column;align-items:center;text-align:center}
.qr-kind{font-size:11px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:var(--accent);background:var(--accent-soft);border-radius:6px;padding:3px 10px}
.qr-desc{font-size:12px;color:var(--muted);margin:8px 0 12px;line-height:1.45;min-height:34px}
.qr-canvas-wrap{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px;line-height:0;box-shadow:var(--shadow);width:200px;height:200px;display:grid;place-items:center}
.qr-canvas-wrap svg{display:block;width:180px;height:180px}
.qr-loading{font-size:12px;color:var(--muted);line-height:1.4}
.qr-url{font-size:11px;color:var(--muted);margin:11px 0 12px;word-break:break-all;max-width:100%;line-height:1.4}
.qr-card-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;margin-top:auto}
@media(max-width:560px){.qr-card{flex:1 1 100%}}

/* ---- Collapsible form groups ---- */
.form-group{border:1px solid var(--line);border-radius:13px;background:var(--card);margin-top:14px;box-shadow:var(--shadow);overflow:hidden}
.form-group>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:11px;padding:14px 18px;font-size:12px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;color:var(--ink);user-select:none}
.form-group>summary::-webkit-details-marker{display:none}
.form-group>summary:hover{background:#fbfcfd}
.fg-chev{color:var(--muted);transition:transform .18s;flex:none}
.form-group[open]>summary .fg-chev{transform:rotate(90deg)}
.fg-label{flex:1}
.fg-count{background:var(--accent-soft);color:var(--accent);font-weight:800;font-size:11px;border-radius:20px;padding:2px 10px;letter-spacing:0}
.form-group .res-grid{margin:0;padding:2px 16px 18px}

/* ---- "Is this you?" account claim ---- */
.claim-panel{border-left:4px solid var(--gold);background:var(--gold-soft)}
.claim-h{display:flex;align-items:center;gap:8px;font-weight:800;font-size:15px;color:var(--gold-ink)}
.claim-sub{font-size:13px;color:var(--gold-ink);margin:4px 0 12px;opacity:.9}
.claim-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;background:#fff;border:1px solid var(--line);border-radius:10px;margin-top:8px;flex-wrap:wrap}
/* activity log — a readable feed, not a table of codes */
.al-panel{padding:4px 16px}
.al-row{display:flex;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);align-items:flex-start}
.al-row:last-child{border-bottom:none}
.al-when{flex:0 0 130px;display:flex;flex-direction:column;font-size:12.5px}
.al-when b{font-weight:700}
.al-when span{color:var(--muted);font-size:11.5px}
.al-what{flex:1;min-width:0;font-size:14px;line-height:1.5}
.al-raw{font-size:11px;color:#98a2ae;font-family:ui-monospace,Menlo,monospace;margin-top:3px}
@media(max-width:640px){ .al-row{flex-direction:column;gap:4px} .al-when{flex:none;flex-direction:row;gap:8px;align-items:baseline} }

/* the event bar on a service page */
.occ-bar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:space-between}
.occ-bar-b{display:flex;flex-direction:column;min-width:0}
.occ-bar-b b{font-size:15px}
.occ-bar-b .muted{font-size:12.5px}
.occ-bar-a{display:flex;gap:8px;flex-wrap:wrap}
@media(max-width:640px){ .occ-bar-a{width:100%} .occ-bar-a .btn{flex:1} }

/* merging duplicate people */
.ppl-tick{width:34px;text-align:center}
.ppl-tick input{width:17px;height:17px;cursor:pointer}
.mrg-bar{position:sticky;bottom:12px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:12px 2px 0;
  padding:11px 14px;border-radius:12px;background:var(--accent);color:#fff;box-shadow:0 8px 24px rgba(6,76,127,.28);font-size:13.5px}
.mrg-bar .spacer{flex:1}
.mrg-bar .btn.ghost{background:rgba(255,255,255,.16);color:#fff;border-color:transparent}
.mrg-opt{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-bottom:6px;cursor:pointer;font-size:13.5px}
.mrg-opt.on{border-color:var(--accent);background:var(--accent-soft)}
.mrg-opt input{margin-top:3px;flex:none}

/* the two halves of a Sunday, above whichever one you're looking at */
.svcnav{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 4px}
.svcnav .chip{display:inline-flex;align-items:center;gap:7px}
.svcnav .chip.active{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-ink)}
@media(max-width:640px){ .svcnav{margin-bottom:10px} .svcnav .chip{flex:1;justify-content:center} }

/* managing a ministry's team */
.tmm-list{max-height:300px;overflow-y:auto;border:1px solid var(--line);border-radius:11px;padding:6px 10px}
.tmm-row{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--line)}
.tmm-row:last-child{border-bottom:none}
.tmm-b{flex:1;min-width:0;display:flex;flex-direction:column;font-size:13.5px}
.tmm-b .muted{font-size:12px}
.tmm-row select{max-width:150px}
.tmm-tabs{display:flex;gap:8px;margin-bottom:12px;flex-wrap:wrap}
.tmm-tabs .chip.active{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-ink)}
@media(max-width:640px){ .tmm-row{flex-wrap:wrap} .tmm-row select{max-width:none;flex:1} }

/* forms grouped by purpose — the hint explains the group without a tooltip */
.fg-hint{font-weight:500;font-size:12.5px;color:var(--muted);margin-left:2px}
@media(max-width:640px){ .fg-hint{display:none} }

/* the card you arrived at from an action item, so you can see which one it was */
@keyframes kbFlash{0%{box-shadow:0 0 0 0 rgba(6,76,127,.45)}70%{box-shadow:0 0 0 10px rgba(6,76,127,0)}100%{box-shadow:0 0 0 0 rgba(6,76,127,0)}}
.kb-card-flash{animation:kbFlash 1.4s var(--ease-out) 2;border-color:var(--accent)!important}

/* Admin Tools: a search box on every table */
.at-search{display:flex;align-items:center;gap:10px;margin:0 2px 10px}
.at-search-in{flex:1;display:flex;align-items:center;gap:8px;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:0 11px;max-width:420px}
.at-search-in:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.at-search-in svg{color:var(--muted);flex:none}
.at-search-in input{flex:1;border:0;background:none;padding:9px 0;font:inherit;font-size:13.5px;outline:none;min-width:0}
.at-count{font-size:12.5px;color:var(--muted);white-space:nowrap}

/* MAP library: one year at a time */
.yeartabs{display:flex;gap:2px;margin:0 0 16px;border-bottom:1px solid var(--line)}
/* every tab the same width, so the strip doesn't jump about as labels differ */
.yeartab{flex:1 1 0;max-width:190px;min-width:0;appearance:none;font:inherit;font-size:14px;font-weight:700;
  display:inline-flex;align-items:center;justify-content:center;gap:7px;border:0;border-bottom:3px solid transparent;
  background:none;color:var(--muted);padding:16px 10px 11px;cursor:pointer;margin-bottom:-1px;position:relative;white-space:nowrap}
.yeartab:hover{color:var(--ink)}
.yeartab.active{color:var(--accent-ink);border-bottom-color:var(--accent)}
.yt-n{background:var(--slate-soft);color:var(--slate-ink);border-radius:99px;min-width:20px;height:20px;display:grid;place-items:center;font-size:11px;font-weight:800;padding:0 6px;flex:none}
.yeartab.active .yt-n{background:var(--accent);color:#fff}
/* the planning marker sits above the label so it can't change the tab's width */
.yt-now{position:absolute;top:1px;left:50%;transform:translateX(-50%);font-size:8.5px;font-weight:800;letter-spacing:.5px;
  text-transform:uppercase;color:var(--gold-ink);line-height:1;pointer-events:none}
@media(max-width:640px){ .yeartab{font-size:13px;padding:15px 6px 10px;gap:5px} }

/* Build your ministry — checklist on the ministry page */
.mset{border-left:4px solid var(--gold);background:linear-gradient(180deg,var(--gold-soft),#fff 70%);margin-bottom:16px}
.mset-h{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:10px}
.mset-h b{font-size:15.5px}
.mset-sub{font-size:12.5px;color:var(--gold-ink);margin-top:2px}
.mset-bar{height:6px;border-radius:99px;background:#eadfc0;overflow:hidden;margin-bottom:12px}
.mset-bar span{display:block;height:100%;background:var(--gold);border-radius:99px;transition:width .4s}
.mset-row{display:flex;align-items:center;gap:11px;padding:10px 0;border-top:1px solid rgba(195,171,88,.28)}
.mset-row:first-of-type{border-top:none}
.mset-tick{width:22px;height:22px;border-radius:50%;border:2px solid #d9c893;flex:none;display:grid;place-items:center;color:#fff;background:#fff}
.mset-row.done .mset-tick{background:var(--green);border-color:var(--green)}
.mset-b{flex:1;min-width:0}
.mset-t{font-size:14px;font-weight:700}
.mset-row.done .mset-t{color:var(--muted);font-weight:600}
.mset-d{font-size:12.5px;color:var(--muted);margin-top:2px;line-height:1.5}
.mset-ok{font-size:12px;font-weight:700;color:var(--green)}
.mset-added{background:var(--green-soft);border-radius:10px;padding:10px 12px;margin-bottom:12px}
.mset-added-row{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--green);padding:2px 0}
@media(max-width:640px){ .mset-h .btn{width:100%} }

/* People: search first, filters tucked behind a button */
.pplbar{display:flex;gap:10px;align-items:center;margin-bottom:10px;flex-wrap:wrap}
.pplbar-search{flex:1;min-width:220px;display:flex;align-items:center;gap:9px;background:var(--card);border:1px solid var(--line);border-radius:11px;padding:0 12px;transition:.15s}
.pplbar-search:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.pplbar-search svg{color:var(--muted);flex:none}
.pplbar-search input{flex:1;border:0;background:none;padding:12px 0;font:inherit;font-size:14px;outline:none;min-width:0}
.pplbar-clear{border:0;background:none;color:var(--muted);cursor:pointer;padding:4px;border-radius:6px;display:flex}
.pplbar-clear:hover{background:var(--slate-soft);color:var(--ink)}
.pplbar-more{appearance:none;font:inherit;font-size:13.5px;font-weight:700;display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:11px;padding:11px 15px;cursor:pointer;white-space:nowrap}
.pplbar-more:hover{background:var(--accent-soft)}
.pplbar-more.on{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-ink)}
.pplbar-n{background:var(--accent);color:#fff;border-radius:99px;min-width:19px;height:19px;display:grid;place-items:center;font-size:11px;font-weight:800;padding:0 5px}
.pplfilters{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end;padding:14px;border:1px solid var(--line);border-radius:12px;background:#fafbfc;margin-bottom:12px}
.pplf{display:flex;flex-direction:column;gap:5px;flex:1;min-width:150px}
.pplf span{font-size:11.5px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:var(--muted)}
.pplf select{width:100%}
@media(max-width:640px){ .pplbar-more{width:100%;justify-content:center} .pplf{min-width:100%} }

/* self-enrolment wizard */
.enr-card{max-width:720px}
.enr-group{margin-bottom:14px}
.enr-ph{font-size:11.5px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:var(--gold-ink);margin:0 0 6px}
.enr-min{display:flex;align-items:center;gap:10px;padding:9px 12px;border:1px solid var(--line);border-radius:10px;margin-bottom:6px;cursor:pointer;background:#fff}
.enr-min.on{border-color:var(--accent);background:var(--accent-soft)}
.enr-min input[type=checkbox]{width:18px;height:18px;flex:none}
.enr-name{flex:1;font-size:13.5px;font-weight:600}
.enr-min select{max-width:210px;font-size:12.5px}
.enr-min select:disabled{opacity:.45}
/* admin reconciliation */
.enr-row{display:flex;gap:12px;align-items:flex-start;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line);flex-wrap:wrap}
.enr-row:last-child{border-bottom:none}
.enr-who{flex:1;min-width:220px;font-size:13.5px}
.enr-mins{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}
.enr-acts{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.enr-opt{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-bottom:6px;cursor:pointer;font-size:13.5px}
.enr-opt.on{border-color:var(--accent);background:var(--accent-soft)}
.enr-opt input{margin-top:3px;flex:none}
.enr-claim{border:1px solid var(--line);border-radius:11px;padding:12px 13px;margin-bottom:8px;background:#fcfdfe}
.enr-claim.clash{border-color:var(--red);background:var(--red-soft)}
.enr-claim-h{display:flex;align-items:center;gap:8px;font-size:14px;margin-bottom:3px}
.enr-claim-m{font-size:12.5px;color:var(--muted)}
.enr-claim-w{display:flex;gap:6px;align-items:flex-start;font-size:12.5px;color:var(--gold-ink);margin:7px 0 9px}
.enr-claim select{width:100%;max-width:260px}

/* ministry preview for people who aren't on the team */
.mprev{max-width:760px;margin:0 auto}
.mprev-head{text-align:center;padding:8px 0 18px}
.mprev-head h1{font-size:26px;font-weight:800;letter-spacing:-.4px;margin-top:6px}
.mprev-lead{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}
.mprev-lead:last-child{border-bottom:none}
.mprev-av{width:38px;height:38px;border-radius:50%;background:var(--accent-soft);color:var(--accent-ink);display:grid;place-items:center;font-weight:800;font-size:15px;flex:none}
.mprev-who{flex:1;min-width:0}
.mprev-who b{display:block;font-size:14px}
.mprev-who span{font-size:12.5px;color:var(--muted)}
.mprev-gate{margin-top:16px;padding:18px;border:1px dashed var(--line);border-radius:12px;text-align:center;background:#fafbfc}
.mprev-gate .lead{margin-bottom:12px}

/* "your access" on My Account */
.acc-panel{padding:4px 16px}
.acc-row{display:flex;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);flex-wrap:wrap}
.acc-row:last-child{border-bottom:none}
.acc-k{flex:0 0 190px;font-size:13px;font-weight:700;color:var(--muted)}
.acc-v{flex:1;min-width:200px;display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:13.5px}
.acc-note{font-size:12.5px;color:var(--muted)}
.acc-none{font-size:13px;color:var(--muted)}
.acc-chip{appearance:none;font:inherit;font-size:12.5px;font-weight:600;border:1px solid var(--line);background:var(--card);color:var(--accent-ink);border-radius:99px;padding:5px 12px;cursor:pointer}
.acc-chip:hover{background:var(--accent-soft)}
.acc-chip.static{cursor:default;color:var(--muted)}
.acc-chip.static:hover{background:var(--card)}
.acc-cta{margin:4px 0 14px;padding:11px 13px;background:var(--gold-soft);color:var(--gold-ink);border-radius:10px;font-size:13px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
@media(max-width:640px){ .acc-k{flex:1 0 100%} }

/* "you have an account, your access is coming" — the first screen a new leader sees */
.pending-panel{border-left:4px solid var(--accent);background:var(--accent-soft)}
.pending-h{display:flex;align-items:center;gap:8px;font-weight:800;font-size:15px;color:var(--accent-ink)}
.pending-h svg{color:var(--green)}
.pending-sub{font-size:13.5px;line-height:1.55;color:var(--accent-ink);margin:6px 0 10px}
.pending-list{margin:0 0 10px;padding-left:20px}
.pending-list li{font-size:13.5px;line-height:1.6;color:var(--accent-ink);margin-bottom:3px}
.pending-foot{font-size:12.5px;color:var(--muted);margin:0 0 12px}
.pending-acts{display:flex;gap:8px;flex-wrap:wrap}
.claim-info b{font-size:14px}
.claim-min{font-size:12px;color:var(--muted);margin-top:2px}
.link-yes{display:inline-flex;align-items:center;gap:5px;color:var(--green);font-weight:700;font-size:12.5px}
.enr-sug{font-size:12.5px;color:var(--ink);margin-top:3px}
.enr-sug.muted{color:var(--muted)}

/* ---- Guests journey status ---- */
.stage-summary{display:flex;flex-wrap:wrap;gap:8px;margin:6px 2px 4px}
.stage-chip{font-size:12px;font-weight:700;border-radius:20px;padding:4px 11px}
.stage-chip b{font-weight:800}
.stage-sel{font-family:inherit;font-size:12.5px;font-weight:700;border:1px solid var(--line);border-radius:20px;padding:5px 10px;cursor:pointer;background:var(--card);max-width:150px}
.stage-guest{background:var(--gold-soft);color:var(--gold-ink)}
.stage-contacted,.stage-mvp{background:var(--accent-soft);color:var(--accent)}
.stage-assessed{background:#efe7fb;color:#6d2bb0}
.stage-interested{background:#e2f3f4;color:#0f6b78}
.stage-serving,.stage-confirmed{background:var(--green-soft);color:var(--green)}
.stage-unresponsive{background:var(--red-soft);color:var(--red)}
.stage-inactive{background:var(--slate-soft);color:var(--slate-ink)}
.stage-all{background:var(--slate-soft);color:var(--slate-ink)}
select.stage-sel{border-color:transparent}
.chip-btn{cursor:pointer;border:1px solid transparent;font-family:inherit}
.chip-btn:hover{filter:brightness(.97)}
.chip-btn.on{box-shadow:0 0 0 2px var(--accent)}
.guide-box{margin-top:16px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px 16px;box-shadow:var(--shadow)}
.guide-box>summary{cursor:pointer;font-weight:800;font-size:13px;color:var(--accent);list-style:none}
.guide-box>summary::-webkit-details-marker{display:none}
.guide-box>summary::before{content:"▸ ";color:var(--gold)}
.guide-box[open]>summary::before{content:"▾ "}
.legend-grid{display:flex;flex-direction:column;gap:9px;margin-top:12px}
.legend-item{display:flex;gap:11px;align-items:flex-start;font-size:13px;color:var(--ink);line-height:1.45}
.legend-item .stage-chip{flex:none;min-width:104px;text-align:center}
/* ---- Guest activity timeline ---- */
.jev-list{display:flex;flex-direction:column;gap:2px;margin-top:6px;max-height:280px;overflow:auto}
.jev{display:flex;gap:10px;align-items:flex-start;padding:9px 2px;border-bottom:1px solid var(--line)}
.jev:last-child{border-bottom:none}
.jev-ic{flex:none;width:26px;height:26px;border-radius:50%;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center}
.jev-b{flex:1;min-width:0}
.jev-t{font-size:13.5px;color:var(--ink)}
.jev-m{font-size:11.5px;color:var(--muted);margin-top:2px}
.em-preview{background:#f4f6f8;border:1px solid var(--line);border-radius:12px;padding:16px;max-height:360px;overflow:auto}
.howto{background:var(--accent-soft);border-radius:12px;padding:10px 14px;margin-bottom:16px}
.howto>summary{cursor:pointer;font-weight:800;font-size:12.5px;color:var(--accent);list-style:none}
.howto>summary::-webkit-details-marker{display:none}
.howto>summary::before{content:"▸ "}
.howto[open]>summary::before{content:"▾ "}
.howto ol{margin:10px 0 2px 18px;font-size:13px;color:var(--ink);line-height:1.55}
.howto li{margin-bottom:5px}
.howto code{background:#fff;border:1px solid var(--line);border-radius:5px;padding:1px 5px;font-size:12px}
.var-palette{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:2px 0 8px}
.var-lbl{font-size:12px;font-weight:700;color:var(--muted);margin-right:2px}
.var-chip{font-size:12px;font-weight:700;background:var(--gold-soft);color:var(--gold-ink);border-radius:8px;padding:4px 10px;cursor:grab;user-select:none;border:1px solid #ecdcae}
.var-chip:hover{background:var(--gold);color:#fff}
.var-chip:active{cursor:grabbing}
.var-date{display:inline-flex;align-items:center;gap:6px;margin-left:auto}
.var-date input[type=date]{font-size:12.5px;padding:5px 8px;width:auto}
/* ---- Follow-up tasks ---- */
.task-row{display:flex;gap:11px;align-items:flex-start;padding:9px 2px;border-bottom:1px solid var(--line)}
.task-row:last-child{border-bottom:none}
.task-chk{width:18px;height:18px;margin-top:2px;accent-color:var(--green);cursor:pointer;flex:none}
.task-b{flex:1;min-width:0}
.task-t{font-size:13.5px;color:var(--ink)}
.task-m{font-size:11.5px;color:var(--muted);margin-top:2px}
.task-row.overdue .task-t{font-weight:600}
.task-row.overdue .task-m b{color:var(--red)}
.task-row.task-done{opacity:.55}
.task-row.task-done .task-t{text-decoration:line-through}
/* ---- Family badge + config lists ---- */
.fam-badge{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:700;color:var(--accent);background:var(--accent-soft);border-radius:8px;padding:2px 8px;margin-top:4px}
.rt-list{display:flex;flex-direction:column;gap:2px}
.rt-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 2px;border-bottom:1px solid var(--line)}
.rt-row:last-child{border-bottom:none}
.rt-stage{flex:none;min-width:120px}
.rt-people{display:flex;flex-wrap:wrap;gap:6px;flex:1;justify-content:flex-end}
.rt-chip{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;background:#eef2f6;color:var(--ink);border-radius:20px;padding:3px 6px 3px 11px}
.rt-chip button{border:none;background:none;color:var(--muted);cursor:pointer;font-size:15px;line-height:1;padding:0 4px}
.rt-chip button:hover{color:var(--red)}

/* ---- Public Ministry Catalog (gallery) ---- */
.pub-catalog{max-width:1080px;margin:0 auto;padding:0 18px 60px}
.cat-hero{text-align:center;max-width:680px;margin:8px auto 26px}
.cat-hero h1{font-size:34px;font-weight:800;color:var(--accent);letter-spacing:-.5px}
.cat-hero p{font-size:15px;color:var(--muted);margin-top:8px;line-height:1.5}
.cat-section{margin-bottom:30px}
.cat-sec-h{font-size:13px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--gold-ink);border-bottom:2px solid var(--gold-soft);padding-bottom:8px;margin-bottom:16px}
.cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px}
.cat-card{background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column}
.cat-img{height:140px;background-size:cover;background-position:center}
.cat-img-ph{display:grid;place-items:center;color:#fff}
.cat-img-ph span{color:#fff;font-size:40px;font-weight:800;letter-spacing:1px;opacity:.92}
.cat-ico{width:52px;height:52px;stroke-width:1.5;opacity:.96}
.cat-body{padding:15px 16px 16px;display:flex;flex-direction:column;flex:1}
.cat-name{font-size:17px;font-weight:800;letter-spacing:-.2px;color:var(--ink)}
.cat-pillar{font-size:11px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;margin-top:3px}
.cat-blurb{font-size:13.5px;color:var(--muted);line-height:1.5;margin:9px 0 0;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.cat-lead{font-size:12.5px;color:var(--ink);display:flex;align-items:center;gap:6px;margin-top:10px;font-weight:600}
.cat-btn{margin-top:14px}
.btn.full{width:100%;justify-content:center}

/* ---- Catalog manager (internal) ---- */
.cat-share{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.cat-url{font-family:monospace;font-size:12.5px;color:var(--accent-ink);word-break:break-all}
.cat-share-btns{display:flex;gap:8px;flex-wrap:wrap}
.int-meta{font-size:12px;color:var(--muted);margin-top:3px}
.acc-row.int-done{opacity:.6}
.cat-edit-list{display:flex;flex-direction:column;gap:12px}
.cat-edit{background:var(--card);border:1px solid var(--line);border-radius:13px;padding:14px;box-shadow:var(--shadow)}
.cat-edit-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:9px}
.cat-toggle{margin-left:auto;font-size:12.5px;font-weight:600;color:var(--ink);display:inline-flex;align-items:center;gap:6px;cursor:pointer}
.cat-blurb-in{width:100%;min-height:56px}
.cat-ic-label{font-size:12px;font-weight:700;color:var(--ink);margin:10px 0 6px}
.cat-ic-row{display:flex;flex-wrap:wrap;gap:6px}
.cat-ic-btn{width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--line);background:var(--card);border-radius:9px;cursor:pointer;color:var(--muted)}
.cat-ic-btn:hover{border-color:var(--accent);color:var(--accent)}
.cat-ic-btn.active{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}
.cat-edit-foot{display:flex;gap:10px;align-items:center;margin-top:11px}
.cat-img-in{flex:1}
@media(max-width:560px){.cat-hero h1{font-size:27px}}

/* ============================================================
   Responsive optimization pass — phone / tablet / desktop
   (appended last so it refines the rules above)
   ============================================================ */
html{-webkit-text-size-adjust:100%}
/* Guard against stray horizontal scroll. overflow-x:clip is the iOS-Safari-
   reliable version (hidden alone lets the layout viewport widen on pinch-zoom
   and, unlike clip, can break position:sticky). hidden is kept as a fallback
   for engines that don't support clip. See the hardening block at end of file. */
html{overflow-x:hidden;overflow-x:clip}
body{overflow-x:hidden;overflow-x:clip}

/* iPad / tablet: let content use the available width beside (or without) the sidebar */
@media(max-width:1024px){
  .main .app{max-width:none}
}

/* Phone */
@media(max-width:640px){
  /* 16px controls so iOS Safari doesn't auto-zoom when a field is focused */
  input:not([type]),input[type=text],input[type=email],input[type=password],input[type=date],
  input[type=time],input[type=number],input[type=tel],input[type=url],input[type=search],
  select,textarea,.search,.res-search,.lead-select,.rf select{font-size:16px}

  /* Comfortable touch targets */
  .btn.sm{padding:9px 13px;font-size:13.5px}
  .iconbtn{width:40px;height:40px}
  .subnav-link{padding:9px 13px}
  .cat-ic-btn{width:38px;height:38px}

  /* Hero action buttons full-width & easy to tap */
  .hero{align-items:stretch}
  .hero>.btn{width:100%;justify-content:center}

  /* Modal footer buttons stack full-width */
  .modal-actions{gap:8px}
  .modal-actions .spacer{display:none}
  .modal-actions .btn{flex:1 1 auto;justify-content:center}

  /* Full-bleed sticky bar shouldn't exceed the 13px page padding */
  .actionbar{margin-left:-13px;margin-right:-13px;padding-left:13px;padding-right:13px}

  /* Catalog gallery: single column, shorter covers */
  .cat-grid{grid-template-columns:1fr}
  .cat-img{height:122px}
  .cat-share-btns{width:100%}
  .cat-share-btns .btn{flex:1;justify-content:center}

  /* QR cards stack */
  .qr-card{flex:1 1 100%}

  /* Queue rows (claims / enrollees / interests / access requests):
     action buttons drop below the text and fill the width evenly */
  .acc-btns{width:100%}
  .acc-btns .btn{flex:1;justify-content:center}

  /* Tighten table cells a touch more on very small screens */
  table.data th,table.data td{padding:7px 7px}
}


/* ---- Approved-design topbar: date, search, + New ---- */
.tb-date{font-size:12.5px;font-weight:700;color:var(--muted);flex:none;white-space:nowrap}
.tb-date b{color:var(--ink);font-weight:800}
.tb-search{flex:1;max-width:520px;margin:0 auto;display:flex;align-items:center;gap:10px;background:#eef1f5;border:1px solid #e0e5eb;border-radius:11px;padding:9px 14px;font-family:inherit;font-size:12.5px;color:#7a8490;cursor:pointer;text-align:left;transition:border-color .15s,box-shadow .15s;min-width:0}
.tb-search:hover{border-color:#9fb4c6;box-shadow:0 0 0 3px rgba(6,76,127,.08)}
.tb-search .ico{flex:none;width:14px;height:14px}
.tb-lbl{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tb-kbd{font-size:10px;font-weight:700;background:#fff;border:1px solid #e0e5eb;border-radius:5px;padding:2px 6px;flex:none}
.btn.tb-new{background:var(--gold);border-color:var(--gold);color:#2e2606;font-weight:800;border-radius:10px;padding:9px 15px;font-size:12.5px;flex:none}
.btn.tb-new:hover{background:#b59c48;border-color:#b59c48;color:#2e2606}
@media(max-width:900px){.tb-date{display:none}}
@media(max-width:600px){.tb-lbl,.tb-kbd{display:none}.tb-search{flex:none;width:38px;height:36px;justify-content:center;padding:0;border-radius:10px;margin:0 auto 0 0}}

/* ---- Command palette (⌘K) ---- */
.pal-bg{position:fixed;inset:0;background:rgba(9,24,38,.45);z-index:90;display:none;align-items:flex-start;justify-content:center;padding:12vh 16px 16px}
.pal-bg.show{display:flex}
.pal{width:100%;max-width:560px;background:#fff;border-radius:16px;box-shadow:0 24px 70px rgba(4,22,37,.35);overflow:hidden;animation:palpop .18s ease}
@keyframes palpop{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
.pal-in{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line);color:var(--muted)}
.pal-in .ico{flex:none;width:16px;height:16px}
.pal-in input{border:none!important;box-shadow:none!important;padding:0!important;border-radius:0;font-size:15px;background:none}
.pal-list{max-height:340px;overflow-y:auto;padding:8px}
.pal-item{display:flex;align-items:center;gap:11px;width:100%;text-align:left;border:none;background:none;border-radius:10px;padding:10px 12px;font-family:inherit;font-size:13.5px;font-weight:600;color:var(--ink);cursor:pointer}
.pal-item:hover,.pal-item.sel{background:var(--accent-soft);color:var(--accent-ink)}
.pal-item .ico{color:var(--accent);width:16px;height:16px;flex:none}
.pal-t{flex:1}
.pal-k{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;background:var(--gold-soft);color:var(--gold-ink);border-radius:5px;padding:2px 7px}
.pal-empty{padding:22px;text-align:center;color:var(--muted);font-size:13px}

/* ---- Home KPI strip ---- */
.home-kpis{margin:14px 0 4px}
.home-kpis .kpi{text-align:left}
.home-kpis .kpi-label{font-size:10.5px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:rgba(255,255,255,.65);margin-top:0}
.home-kpis .kpi-val{margin-top:5px}

/* ---- Admin Tools: collapsible sections ---- */
.adm-sec{background:var(--card);border:1px solid var(--line);border-radius:14px;margin-bottom:12px;overflow:hidden}
.adm-sec>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:8px;padding:14px 16px;font-weight:800;font-size:13.5px;user-select:none}
.adm-sec>summary::-webkit-details-marker{display:none}
.adm-chev{margin-left:auto;color:var(--muted);transition:transform .18s;display:inline-flex}
.adm-sec[open]>summary .adm-chev{transform:rotate(180deg)}
.adm-body{padding:2px 16px 16px}
.adm-body>.panel:first-child,.adm-body>p:first-child{margin-top:0}
@media(max-width:640px){ .adm-body{padding:2px 10px 12px} .adm-sec>summary{padding:12px 12px} }

/* ---- Event types: manager swatch + guessed-events review ---- */
.et-swatch{display:inline-block;width:16px;height:16px;border-radius:50%;border:1px solid rgba(0,0,0,.12);vertical-align:middle}
.etr-list{display:flex;flex-direction:column;gap:12px}
.etr-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.etr-controls-bottom{margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.etr-change{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap;margin-bottom:14px;padding:10px;background:var(--bg);border-radius:10px}
.etr-change .field{margin-bottom:0;min-width:160px}
.etr-rows{display:flex;flex-direction:column;gap:6px}
.etr-row{display:flex;align-items:flex-start;gap:12px;border:1px solid var(--line);border-radius:10px;padding:12px;cursor:pointer}
.etr-row:hover{background:#f4f8fb}
.etr-row input{margin-top:3px;flex:none;width:20px;height:20px}
.etr-rb{display:flex;flex-direction:column;gap:2px}
.etr-title{font-weight:700;font-size:14px}
.etr-sub{color:var(--muted);font-size:12.5px}
@media(max-width:640px){
  .etr-row{padding:14px}
  .etr-controls,.etr-change{flex-direction:column;align-items:stretch}
  .etr-controls .btn,.etr-change .btn{width:100%}
}

/* ---- Requests kanban ---- */
.kb-col-h{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin-bottom:9px}
.kb-count{background:#fff;border:1px solid var(--line);border-radius:999px;font-size:11px;padding:1px 8px;color:var(--muted)}
.ar-card{display:flex;flex-direction:column;gap:5px}
.ar-type{align-self:flex-start;background:var(--accent-soft);color:var(--accent-ink);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;padding:2px 8px;border-radius:999px}
.ar-subj{font-weight:700;font-size:13px;line-height:1.3}
.ar-meta{font-size:11px;color:var(--muted);font-weight:600}

/* ---- People: edit-person rows ---- */
.pe-list{display:flex;flex-direction:column;gap:8px}
.pe-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pe-min{flex:1 1 130px;font-weight:700;font-size:13px;min-width:110px}
.pe-role{flex:1 1 130px;min-width:110px}
.pe-row select,.pe-row input{padding:7px 9px;border:1px solid var(--line);border-radius:8px;font-family:inherit;font-size:13px;background:#fff}

/* ---- Permission group builder ---- */
.pg-area{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin:12px 0 6px}
.pg-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:6px}
.pg-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;font-family:inherit;font-size:12.5px;font-weight:600;cursor:pointer;background:var(--surface-2,#fff);border:1px solid var(--line,#e4e7ec);color:var(--muted,#5b6673)}
.pg-chip.on{background:var(--accent-soft,#e7eef5);border-color:var(--accent,#064c7f);color:var(--accent-ink,#063b62)}
.pg-chip:disabled{cursor:default}
.pg-scope{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:999px;border:1px solid var(--line,#e4e7ec);background:var(--slate-soft,#eceef1);color:var(--slate-ink,#586069);font-family:inherit;font-size:11px;font-weight:700;cursor:pointer}
.pchip{display:inline-block;background:var(--accent-soft,#e7eef5);color:var(--accent-ink,#063b62);border-radius:999px;padding:2px 9px;font-size:11px;font-weight:700;margin:1px 0}

/* ---- People: person page + name links ---- */
.lnk-name{background:none;border:none;cursor:pointer;color:var(--accent,#064c7f);font-family:inherit;font-size:13px;font-weight:800;padding:0;text-align:left}
.lnk-name:hover{text-decoration:underline}
.pchip.gold{background:var(--gold-soft,#f7f1de);color:var(--gold-ink,#8a7325)}

/* ---- AI sermon notes ---- */
.serm-doc{max-width:760px;margin:0 auto}
.serm-doc .serm-sec{margin:0 0 22px}
.serm-doc .serm-sec h3{font-size:16px;font-weight:800;color:#064c7f;margin:0 0 8px;border-bottom:2px solid #eef1f5;padding-bottom:5px}
.serm-doc p{font-size:15px;line-height:1.7;margin:0 0 10px;color:#1f2a37}
.serm-scrip{margin:0 0 8px}
.serm-scrip b{color:#064c7f;font-size:14px}
.serm-verse{font-style:italic;color:#3a4a5a;margin-top:2px;padding-left:10px;border-left:2px solid #e4e7ec}
.serm-co{border-radius:8px;padding:11px 14px;margin:10px 0}
.serm-co-h{font-weight:800;font-size:12.5px;text-transform:uppercase;letter-spacing:.4px;margin-bottom:3px;display:inline-flex;align-items:center;gap:6px}
.serm-co-h .ico{width:15px;height:15px}
.serm-co div{font-size:14.5px;line-height:1.6}
.serm-co ul{margin:6px 0 0;padding-left:20px}
.serm-doc ul,.serm-doc ol{margin:0 0 10px;padding-left:22px}
.serm-doc li{font-size:15px;line-height:1.6;margin-bottom:4px}
.serm-pub-head{text-align:center;border-bottom:2px solid #c3ab58;padding-bottom:16px;margin-bottom:22px}
.serm-pub-head h1{font-size:26px;font-weight:800;color:#064c7f;margin:0}
.serm-sub{font-size:16px;color:#8a7325;font-weight:600;margin:4px 0 0}
.serm-meta{font-size:13px;color:#646464;font-weight:600;margin:8px 0 0}
.serm-summary{font-size:14.5px;color:#3a4a5a;font-style:italic;margin:10px auto 0;max-width:600px}
@media print{ .serm-noprint,.pub-top,.pub-foot{display:none!important} .pubwrap{padding:0!important;background:#fff!important} .serm-doc{max-width:100%} }

/* ---- sermon series folders ---- */
.serm-thumb{width:56px;height:56px;border-radius:8px;background-size:cover;background-position:center;flex-shrink:0}
.serm-scard .res-body{align-self:center}
.serm-banner{height:200px;border-radius:14px;background-size:cover;background-position:center;margin-bottom:12px;border:1px solid var(--line,#e4e7ec)}

/* ---- projects portfolio drag + bulk subtask selection (July 2026) ---- */
.pj-card.dragging{opacity:.45}
.pj-col.over{outline:2px dashed var(--accent);outline-offset:-3px;background:var(--accent-soft)}
.kb-card{position:relative}
.kb-selbox{position:absolute;top:8px;right:8px;width:16px;height:16px;cursor:pointer;accent-color:var(--accent);z-index:2}
.kb-card .kb-ctitle{padding-right:24px}
.kb-card.sel{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft)}
.bulkbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;background:var(--accent);color:#fff;border-radius:12px;padding:10px 14px;margin:14px 0}
.bulkbar .bulkn{font-weight:800;font-size:13px}
.bulkbar .bulk-lbl{font-size:12px;opacity:.85}
.bulkbar .bulk-moves{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.bulkbar .btn.sm{background:#fff;color:var(--accent);border:none}
.bulkbar .btn.sm.ghost{background:rgba(255,255,255,.18);color:#fff}
.bulkbar .btn.sm.ghost.danger{background:rgba(255,255,255,.18);color:#ffdcd7}

/* ---------- standalone public MAP wizard ---------- */
.pw-wide .pub-card{max-width:880px}
.pw-head h2{font-size:24px;font-weight:800;letter-spacing:-.3px}
.pw-head p.lead{margin:2px 0 10px}
.pw-wide .panel{border:none;box-shadow:none;padding:6px 0 0;background:transparent}

/* collapsible vision / mission / priorities panel — shown on every wizard step */
.pwid{border:1px solid var(--line);border-radius:12px;background:linear-gradient(180deg,#f8fafc,#fff);margin:4px 0 16px;overflow:hidden}
.pwid.open{border-color:var(--gold);background:var(--card)}
.pwid-head{width:100%;appearance:none;font:inherit;cursor:pointer;background:transparent;border:0;padding:12px 14px;display:flex;align-items:center;justify-content:space-between;gap:10px;text-align:left;color:var(--ink)}
.pwid-head:hover{background:var(--accent-soft)}
.pwid-t{display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:14px;letter-spacing:-.2px}
.pwid-t svg{color:var(--accent)}
.pwid-c{display:inline-flex;align-items:center;gap:4px;font-size:12.5px;font-weight:700;color:var(--muted);white-space:nowrap}
.pwid.open .pwid-c svg{transform:rotate(180deg)}
.pwid-body{padding:2px 16px 16px;border-top:1px solid var(--line)}
.pwid-sec{margin-top:14px}
.pwid-sec h4{display:flex;align-items:center;gap:7px;font-size:11.5px;font-weight:800;letter-spacing:.7px;text-transform:uppercase;color:var(--gold-ink);margin-bottom:5px}
.pwid-sec p{font-size:14px;line-height:1.5;color:var(--ink);margin:0}
.pwid-path{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.pwid-step{display:inline-flex;align-items:center;gap:6px;background:var(--accent-soft);color:var(--accent-ink);border-radius:99px;padding:5px 12px;font-size:12.5px;font-weight:700}
.pwid-step b{display:inline-flex;align-items:center;justify-content:center;width:17px;height:17px;border-radius:50%;background:var(--accent);color:#fff;font-size:10.5px}
.pwid-arrow{color:var(--muted);font-weight:700}
.pwid-list{margin:0;padding-left:20px}
.pwid-list li{font-size:13.5px;line-height:1.5;color:var(--ink);margin-bottom:2px}
.pwid-tip{margin-top:7px!important;font-size:12.5px!important;color:var(--muted)!important}
.pwid-dl{display:flex;align-items:center;gap:10px;margin:0 16px 16px;padding:11px 13px;border:1px solid var(--gold);background:var(--gold-soft);border-radius:10px;text-decoration:none;color:var(--gold-ink);font-size:12.5px;line-height:1.45}
.pwid-dl:hover{background:#f2e9cf}
.pwid-dl svg{flex:none}
.pwid-dl b{font-size:13px}
@media(max-width:640px){ .pwid-body{padding:2px 13px 14px} .pwid-arrow{display:none} }

/* the rail is a plain stack on a phone; the direction panel stays on top there */
.pw-rail{display:flex;flex-direction:column}
.pw-rail .pwid{order:-1}

/* ---------- MAP wizard: desktop / laptop layout ----------
   Two columns from 1060px up. The rail (step list + church-direction panel)
   sticks as one unit beside the form, so nothing overlaps as the page scrolls
   and the form column keeps its own height. */
@media(min-width:1060px){
  .pw-wide .pub-card{
    max-width:1180px;padding:32px 36px;
    display:grid;column-gap:34px;
    grid-template-columns:290px minmax(0,1fr);
    grid-template-areas:"head head" "rail body" "rail nav";
    align-items:start}
  .pw-wide .pw-head{grid-area:head;margin-bottom:22px}
  .pw-wide .pw-head h2{font-size:28px}
  .pw-wide .pw-rail{grid-area:rail;position:sticky;top:24px;max-height:calc(100vh - 48px);overflow:visible}
  .pw-wide .pw-rail .pwid{order:0;margin:14px 0 0;min-height:0}
  .pw-wide .stepper{flex-direction:column;gap:4px;overflow:visible;padding:0}
  .pw-wide .stepnode{border-radius:10px;justify-content:flex-start;padding:11px 14px;font-size:13.5px;width:100%}
  /* the panel scrolls inside the rail on shorter laptops — the fade tells you so */
  .pw-wide .pwid{position:relative}
  .pw-wide .pwid-body{max-height:calc(100vh - 340px);overflow-y:auto;scrollbar-width:thin}
  .pw-wide .pwid::after{content:'';position:absolute;left:2px;right:2px;bottom:2px;height:24px;border-radius:0 0 11px 11px;background:linear-gradient(rgba(255,255,255,0),#fff);pointer-events:none}
  .pw-wide .pwid-sec p{font-size:13.5px}
  .pw-wide .pwid-sec{margin-top:12px}
  .pw-wide .pwid-path{gap:5px}
  .pw-wide .pwid-arrow{display:none}
  .pw-wide .pwid-step{font-size:12px;padding:4px 10px}
  .pw-wide .panel{grid-area:body;padding:0;margin-bottom:18px}
  .pw-wide .panel h2{font-size:20px}
  .pw-wide .formnav{grid-area:nav;margin:0;padding-top:16px;border-top:1px solid var(--line)}
  /* the direction panel is already open in the rail — the pointer to it is
     only useful on a phone, where the panel is collapsed above the form */
  .pw-wide .panel .note-box.pw-hint{display:none}
  /* the form column has room now — let the writing fields breathe */
  .pw-wide .panel textarea{min-height:104px}
  .pw-wide .focusgrid{grid-template-columns:1fr 1fr;gap:10px}
  .pw-wide .subcard{padding:18px 20px}
  .pw-wide .recap-line{font-size:14px;padding:11px 0}
}
/* wide desktops: a little more room again, capped so lines stay readable */
@media(min-width:1400px){
  .pw-wide .pub-card{max-width:1280px;grid-template-columns:310px minmax(0,1fr)}
}

/* ---------- bulletin board: pinned banner ---------- */
/* --- sermon series theme + assets --- */
.tmpl-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.tmpl-card{display:flex;flex-direction:column;gap:6px;align-items:flex-start;text-align:left;border:1px solid var(--line);border-radius:12px;padding:10px;background:#fff;cursor:pointer;font:inherit;transition:.15s}
.tmpl-card:hover{border-color:var(--gold)}
.tmpl-card.on{border-color:var(--accent);background:var(--accent-soft);box-shadow:0 0 0 1px var(--accent) inset}
.tmpl-card b{font-size:13px;color:var(--accent)}
.tmpl-card .tmpl-d{font-size:11.5px;color:var(--muted);line-height:1.4}
.tmpl-prev{display:block;width:100%;aspect-ratio:16/9;border-radius:7px;border:1px solid var(--line);overflow:hidden}
.tp-bold{background:linear-gradient(100deg,#07203a 0%,#07203a 46%,#3d5871 100%)}
.tp-classic{background:linear-gradient(90deg,#07203a 0 46%,#8ba6bd 46% 100%)}
.tp-minimal{background:#eef1f5;border-left:5px solid var(--gold)}
@media(max-width:640px){.tmpl-row{grid-template-columns:1fr}}
.sa-group{margin-bottom:12px}
.sa-gh{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-ink);margin-bottom:6px}
.sa-grid{display:grid;gap:7px}
.sa-item{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:9px;padding:7px 9px;background:#fff}
.sa-thumb{width:56px;height:32px;border-radius:5px;background-size:cover;background-position:center;background-color:#eef1f5;flex:none;display:grid;place-items:center;color:var(--muted)}
.sa-thumb.sa-file{background:#f5f7fa}
.sa-name{flex:1;min-width:0;font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sa-acts{display:flex;gap:5px;align-items:center;flex:none}
/* Claude-designed slide */
.ai-design{display:flex;gap:14px;align-items:flex-start;flex-wrap:wrap;border:1px solid var(--gold);background:linear-gradient(150deg,#fffdf6,#f9f5e8);border-radius:12px;padding:15px 16px}
.ai-d-body{flex:1;min-width:220px;display:flex;flex-direction:column;gap:5px}
.ai-d-body b{font-size:14px;color:var(--accent)}
.ai-d-body span{font-size:12.5px;color:var(--muted);line-height:1.5}
.ai-d-cur{font-size:12px !important;color:var(--gold-ink) !important;background:#fff;border:1px solid #e3d5a8;border-radius:8px;padding:7px 9px;margin-top:3px}
.ai-d-acts{display:flex;gap:7px;align-items:center;flex-wrap:wrap}
.ai-prev{position:fixed;inset:0;background:rgba(10,16,22,.78);z-index:80;display:grid;place-items:center;padding:24px}
.ai-prev-in{max-width:1100px;width:100%;background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.45)}
.ai-prev-in img{display:block;width:100%;height:auto}
.ai-prev-acts{display:flex;gap:8px;align-items:center;padding:12px 14px;border-top:1px solid var(--line)}

/* live QR: what's on screen right now */
.live-chip{display:inline-flex;align-items:center;gap:4px;margin-left:8px;background:var(--green-soft);color:var(--green);font-size:10.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;border-radius:20px;padding:3px 9px;vertical-align:middle}
.live-now{display:flex;gap:12px;align-items:center;border:2px solid var(--gold);border-radius:12px;padding:12px 14px;background:#fbfcfd;margin-top:12px}
.live-now .ln-thumb{width:64px;height:36px;border-radius:6px;background-size:cover;background-position:center;background-color:#eef1f5;flex:none;display:grid;place-items:center;color:var(--muted)}
.live-now .ln-body{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1}
.live-now .ln-k{font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.live-now b{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.live-now .ln-sub{font-size:12px;color:var(--muted)}
.live-now .ln-tmpl{font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-ink);background:var(--gold-soft);border-radius:20px;padding:4px 9px;flex:none}
.live-now.live-none{border-color:#e3d5a8;background:var(--gold-soft);color:var(--gold-ink)}
.live-now.live-none .ln-sub{color:#6b551a}

/* the series editor carries a template picker + asset manager, so it needs room */
.modal:has(.tmpl-row){max-width:760px}
.ser-jump{display:flex;gap:7px;flex-wrap:wrap;position:sticky;top:-24px;background:#fff;padding:10px 0 8px;margin:-4px 0 4px;z-index:2;border-bottom:1px solid var(--line)}
.ser-jump button{background:var(--gold-soft);border:1px solid #e3d5a8;color:var(--gold-ink);font:700 11.5px inherit;border-radius:20px;padding:6px 13px;cursor:pointer}
.ser-jump button:hover{background:var(--gold);color:#fff;border-color:var(--gold)}
.serm-scard{position:relative;padding:0;overflow:hidden}
.serm-scard-hit{display:flex;align-items:center;gap:12px;width:100%;background:none;border:0;padding:12px;text-align:left;cursor:pointer;font:inherit;color:inherit}
.serm-scard-hit:hover{background:#fbfcfd}
.serm-theme-btn{position:absolute;right:10px;bottom:10px}
@media(max-width:640px){ .serm-theme-btn{position:static;margin:0 12px 12px} }
.sa-drop{border:2px dashed #c9d3dd;border-radius:12px;background:#fafbfc;padding:20px 16px;text-align:center;cursor:pointer;transition:.18s;margin-bottom:8px}
.sa-drop:hover{border-color:var(--gold);background:var(--gold-soft)}
.sa-drop.over{border-color:var(--accent);background:var(--accent-soft)}
.sa-drop-in{display:flex;flex-direction:column;align-items:center;gap:5px;color:var(--muted);pointer-events:none}
.sa-drop-in b{font-size:14px;color:var(--accent)}
.sa-drop-in span{font-size:12px}
.sa-drop svg{color:var(--gold)}
.sa-add{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:6px}
.sa-add select{max-width:190px}
.serm-assets{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 0}
.serm-assets a{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:20px;padding:6px 12px;font-size:12.5px;font-weight:600;text-decoration:none;color:var(--ink);background:#fff}
.serm-assets a:hover{border-color:var(--gold);color:var(--gold-ink)}

.auth-forgot{text-align:center;margin-top:12px}
.auth-forgot button{background:none;border:0;color:var(--muted);font:600 13px inherit;cursor:pointer;text-decoration:underline;text-underline-offset:3px;padding:0}
.auth-forgot button:hover{color:var(--accent)}

/* --- public event registration page --- */
.reg-wrap .reg-card{padding:0;overflow:hidden}
.reg-hero{height:190px;background-size:cover;background-position:center;background-color:#dbe4ec}
.reg-hero-plain{display:grid;place-items:center;background:linear-gradient(150deg,#064c7f,#053a61);color:rgba(255,255,255,.5)}
.reg-body{padding:26px 30px 32px}
.reg-chip{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;border-radius:20px;padding:5px 13px;margin-bottom:12px}
.rc-open{background:#e7f4ed;color:#1f7a4d}
.rc-wait{background:var(--gold-soft,#f6efd8);color:var(--gold-ink,#8a6d1f)}
.rc-closed{background:#f1f3f5;color:#6b7280}
.rc-soon{background:#e8f0f7;color:#064c7f}
.reg-title{font-size:26px;font-weight:800;line-height:1.25;color:var(--accent,#064c7f);margin:0 0 6px}
.reg-sub{font-size:15px;color:var(--muted);margin:0 0 18px}
.reg-metas{display:grid;gap:12px;padding:16px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:18px}
.reg-meta{display:flex;gap:11px;align-items:flex-start;font-size:14px}
.reg-meta .rm-ic{flex:0 0 auto;width:28px;height:28px;border-radius:8px;background:var(--gold-soft,#f6efd8);color:var(--gold-ink,#8a6d1f);display:grid;place-items:center}
.reg-meta .rm-sub{font-size:13px;color:var(--muted);font-weight:500}
.reg-details{font-size:14.5px;line-height:1.7;margin-bottom:22px}
.reg-details p{margin:0 0 10px}
.reg-formwrap{border-top:2px solid var(--gold,#c3ab58);padding-top:20px}
.reg-h2{font-size:18px;font-weight:800;color:var(--accent,#064c7f);margin:0 0 14px}
.reg-req{color:#c0392b;font-weight:800}
.reg-checks{display:grid;gap:7px}
.reg-party-row{display:flex;gap:8px;align-items:center;margin-bottom:8px}
.reg-party-row input{flex:1}
.reg-note{background:#f5f7fa;border:1px solid var(--line);border-radius:10px;padding:13px 15px;font-size:13.5px;color:var(--muted)}
.reg-note-wait{background:var(--gold-soft,#f6efd8);border-color:#e3d5a8;color:var(--gold-ink,#8a6d1f);margin-bottom:16px}
.reg-fine{font-size:12px;color:#8a97a2;margin-top:12px;text-align:center}
.btn-lgx{padding:15px;font-size:16px;margin-top:6px}
.reg-join{margin:20px auto 4px;max-width:460px;background:#f2f7fb;border:2px solid var(--accent,#064c7f);border-radius:14px;padding:18px 20px;text-align:center}
.reg-join .rj-h{display:flex;align-items:center;justify-content:center;gap:7px;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--accent,#064c7f);margin-bottom:8px}
.reg-join .rj-p{font-size:13.5px;color:var(--muted);margin-bottom:14px;line-height:1.55}
.reg-join .rj-btn{display:inline-block;background:var(--accent,#064c7f);color:#fff;font-weight:800;font-size:14.5px;text-decoration:none;border-radius:10px;padding:12px 26px}
.reg-join .rj-url{font-size:11.5px;color:#6b7280;word-break:break-all;margin:12px 0 10px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;background:#fff;border:1px solid var(--line);border-radius:8px;padding:8px 10px}
.reg-code{margin:16px auto 0;background:#f5f7fa;border:1px dashed #c5cdd6;border-radius:12px;padding:12px 20px;display:inline-block;font-size:11.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.reg-code span{display:block;font-size:24px;letter-spacing:.18em;color:var(--accent,#064c7f);margin-top:4px}
@media(max-width:640px){ .reg-body{padding:22px 18px 26px} .reg-title{font-size:22px} .reg-hero{height:150px} }

/* --- add-to-home-screen banner --- */
.a2hs{display:flex;gap:14px;align-items:center;background:linear-gradient(135deg,#f2f7fb,#eaf1f7);border:1px solid #cfe0ee;border-left:4px solid var(--accent,#064c7f);border-radius:12px;padding:13px 16px;margin:0 0 14px;box-shadow:var(--shadow)}
.a2hs .a2-ic{flex:0 0 auto;width:34px;height:34px;border-radius:50%;background:var(--accent,#064c7f);color:#fff;display:grid;place-items:center}
.a2hs .a2-body{flex:1;min-width:0}
.a2hs .a2-t{font-weight:800;font-size:14.5px;color:var(--accent,#064c7f);letter-spacing:-.2px}
.a2hs .a2-b{font-size:13px;color:var(--muted);margin-top:2px}
.a2hs .a2-actions{display:flex;gap:8px;align-items:center;flex:0 0 auto}
.a2-steps{margin:0;padding-left:20px;font-size:14px;line-height:1.75}
.a2-steps li{margin-bottom:7px}
@media (max-width:640px){ .a2hs{flex-wrap:wrap} .a2hs .a2-actions{width:100%;justify-content:flex-end} }
.pinbar{display:flex;gap:14px;align-items:flex-start;background:linear-gradient(135deg,#fdf8ec,#faf3dd);border:1px solid #e3d5a8;border-left:4px solid var(--gold,#c3ab58);border-radius:12px;padding:14px 16px;margin:0 0 14px;box-shadow:var(--shadow)}
.pinbar .pin-ic{flex:0 0 auto;width:34px;height:34px;border-radius:50%;background:var(--accent,#064c7f);color:#fff;display:grid;place-items:center}
.pinbar .pin-body{flex:1;min-width:0}
.pinbar .pin-t{font-weight:800;font-size:15px;color:var(--accent,#064c7f);letter-spacing:-.2px}
.pinbar .pin-b{font-size:13.5px;margin-top:3px;white-space:pre-wrap}
.pinbar .pin-m{font-size:12px;color:var(--muted);margin-top:5px}
.pinbar .pin-actions{display:flex;gap:8px;align-items:center;flex:0 0 auto}
@media (max-width:640px){ .pinbar{flex-wrap:wrap} .pinbar .pin-actions{width:100%;justify-content:flex-end} }

/* apostle office */
.ap-item{display:grid;grid-template-columns:2fr 1fr 150px auto;gap:8px;align-items:center;border:1px solid var(--line);border-radius:11px;padding:9px 11px;margin-bottom:8px;background:#fcfdfe}
.ap-item input{border:1px solid var(--line);border-radius:8px;padding:8px 10px;font:inherit;font-size:13px;width:100%}
@media (max-width:640px){ .ap-item{grid-template-columns:1fr} }

/* map locks */
.lock-pill{display:inline-block;background:var(--gold-soft);color:var(--gold-ink);font-size:12px;font-weight:600;padding:4px 8px;border-radius:6px;margin-left:8px;vertical-align:middle}

/* training unlock */
.crs-locked{opacity:.65;cursor:not-allowed!important;background:var(--line)}.crs-locked:hover{background:var(--line)}.crs-locked .res-ic{background:var(--line);color:var(--muted)}.crs-locked .res-title{color:var(--muted)}
.lesson-locked{opacity:.6;pointer-events:none}.lesson-locked .onb-t{color:var(--muted)}.lesson-locked .onb-d{display:none}

/* ============================================================
   Mobile header / horizontal-overflow hardening (Jul 2026)
   -----------------------------------------------------------
   Symptom: on iPhone, pinch-zooming out to see the whole page
   revealed empty space beside the sticky header ("weird header
   spacing"). Cause: some page content was a little wider than the
   screen, so iOS Safari widened the *layout viewport*; the width:100%
   sticky header then only covered the screen width, leaving a gap.
   The root guard (overflow-x:clip on html/body, above) stops the
   viewport from widening. The rules below remove the actual sources
   of that stray width so nothing important gets clipped.
   ============================================================ */

/* 1. Long unbreakable strings (emails, URLs, tokens, long names/titles)
      must wrap instead of pushing the page wider than the screen. */
body{overflow-wrap:break-word}

/* 2. Embedded media can never be wider than its container. (Icons keep
      their own explicit .ico sizing; capping max-width is harmless.) */
img,video,canvas,svg,iframe{max-width:100%}

/* 3. Shell + full-width bars: pin them to the screen edges and never let a
      child stretch them past it. min-width:0 lets flex/grid children shrink
      (grid/flex items default to min-width:auto, a common overflow source). */
.va-banner,.beta-banner,.topbar,.main{max-width:100%;min-width:0}
.main .app{max-width:min(1080px,100%);min-width:0}

/* 4. Non-data tables can't exceed the screen. (Wide .data tables are left
      alone — they scroll inside their own .table-wrap{overflow-x:auto}. The
      root html/body clip contains any remaining stray width, so we avoid
      putting overflow on .app itself, which would turn it into a scroll
      container and break the sticky .actionbar.) */
table:not(.data){max-width:100%}

/* ---------- help center v2 ---------- */
.help-hero{background:linear-gradient(135deg,var(--accent),#043a62);border-radius:var(--radius,16px);padding:34px 30px;color:#fff;margin-bottom:16px;position:relative;overflow:hidden}
.help-hero::after{content:'';position:absolute;right:-90px;top:-90px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(195,171,88,.32),transparent 65%)}
.help-hero h1{font-size:26px;font-weight:800;letter-spacing:-.3px;position:relative;z-index:1}
.help-hero p{color:#cfe0ee;margin-top:4px;font-size:14px;position:relative;z-index:1}
.help-search{display:flex;align-items:center;gap:8px;background:#fff;border-radius:12px;padding:2px 6px 2px 14px;margin-top:16px;max-width:560px;color:var(--muted);position:relative;z-index:1;box-shadow:0 8px 24px rgba(0,0,0,.18)}
.help-search input{flex:1;border:none;outline:none;font:inherit;font-size:15px;padding:12px 6px;background:transparent;color:#1d2b38}
.help-start{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px;margin:0 0 22px}
.hs-card{appearance:none;font-family:inherit;text-align:left;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px 18px;cursor:pointer;display:grid;grid-template-columns:34px 1fr;grid-template-rows:auto auto;column-gap:12px;align-items:center;box-shadow:var(--shadow);transition:transform .15s ease,border-color .15s ease}
.hs-card:hover{transform:translateY(-2px);border-color:var(--gold,#c3ab58)}
.hs-card .ico{grid-row:1/3;width:26px;height:26px;color:var(--accent)}
.hs-card b{font-size:14.5px;color:var(--ink)}
.hs-card span{font-size:12.5px;color:var(--muted)}
.hb-fig{margin:14px 0 8px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 4px 14px rgba(6,76,127,.07)}
.hb-shot{display:block;width:100%}
.hb-fig figcaption{font-size:12.5px;color:var(--muted);padding:9px 14px;border-top:1px solid var(--line);background:#fafbfd}
.hb-item summary{font-size:14.5px;padding:15px 10px}
.hb-body{font-size:14px;line-height:1.65}
.hb-none{text-align:center;color:var(--muted);font-size:14px}
@media (max-width:640px){ .help-hero{padding:24px 18px} .help-start{grid-template-columns:1fr} }

/* ============================================================
   MOTION & POLISH LAYER (Jul 2026) — appended last so it wins.
   Design language: calm, weighted, 150–260ms, one easing curve.
   Everything here is presentation-only and reduced-motion safe.
   ============================================================ */
:root{--ease-out:cubic-bezier(.22,.61,.36,1);--dur-1:150ms;--dur-2:220ms;--dur-3:280ms}

/* --- route transitions: content breathes in on navigation --- */
@keyframes viewIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
.view-anim{animation:viewIn var(--dur-3) var(--ease-out) both}
/* content replacing this page's own skeleton, or a filter re-render: settle in
   rather than sliding, so the page doesn't appear to arrive twice */
@keyframes viewFill{from{opacity:0}to{opacity:1}}
.view-fill{animation:viewFill var(--dur-2) var(--ease-out) both}

/* --- sidebar: fully-realized nav feel --- */
.sb-link{position:relative;transition:background var(--dur-1) var(--ease-out),color var(--dur-1) var(--ease-out),transform var(--dur-1) var(--ease-out)}
.sb-link:hover{transform:translateX(2px)}
.sb-link .ico{transition:transform var(--dur-1) var(--ease-out),color var(--dur-1) var(--ease-out)}
.sb-link:hover .ico{transform:scale(1.12)}
.sb-link.active{box-shadow:none;background:linear-gradient(90deg,rgba(255,255,255,.16),rgba(255,255,255,.07))}
@keyframes navBar{from{transform:scaleY(0)}to{transform:scaleY(1)}}
.sb-link.active::before{content:'';position:absolute;left:0;top:18%;bottom:18%;width:3px;border-radius:3px;background:var(--gold);animation:navBar var(--dur-2) var(--ease-out);transform-origin:center}
.sb-group{transition:color var(--dur-1)}
.sb-link:active{transform:translateX(2px) scale(.985)}

/* --- buttons & chips: weight and response --- */
.btn,.iconbtn,.chip,.stepnode,.tb-new,.qlink,.mp-add,.addrow{transition:background var(--dur-1) var(--ease-out),color var(--dur-1) var(--ease-out),border-color var(--dur-1) var(--ease-out),box-shadow var(--dur-2) var(--ease-out),transform var(--dur-1) var(--ease-out)}
.btn:hover,.tb-new:hover{transform:translateY(-1px)}
.btn:active,.tb-new:active,.chip:active,.iconbtn:active{transform:translateY(0) scale(.97)}
.btn.primary:hover{box-shadow:0 8px 20px rgba(6,76,127,.30)}
.btn.danger:hover{box-shadow:0 8px 20px rgba(160,40,40,.22)}
.chip:hover{transform:translateY(-1px)}

/* --- rows, cards, tiles: gentle lift --- */
.maprow,.res-card,.kpi-btn,.dash-mcard,.pick-card,.cal-event,.acc-row,.claim-row,.hs-card,.va-row{transition:background var(--dur-1) var(--ease-out),border-color var(--dur-1) var(--ease-out),box-shadow var(--dur-2) var(--ease-out),transform var(--dur-1) var(--ease-out)}
.maprow:hover,.cal-event:hover{transform:translateX(3px)}
.res-card:hover,.dash-mcard:hover,.pick-card:hover,.kpi-btn:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(6,76,127,.14)}
.cal-chip{transition:transform var(--dur-1) var(--ease-out),box-shadow var(--dur-1) var(--ease-out)}
.cal-chip:hover{transform:scale(1.03)}
tbody tr{transition:background var(--dur-1)}
table.data tbody tr:hover{background:#f4f8fb}

/* --- modals: fade + settle --- */
.modal-bg{display:flex;visibility:hidden;opacity:0;pointer-events:none;transition:opacity var(--dur-2) var(--ease-out),visibility 0s linear var(--dur-2)}
.modal-bg.show{visibility:visible;opacity:1;pointer-events:auto;transition:opacity var(--dur-2) var(--ease-out)}
.modal{transform:translateY(12px) scale(.97);opacity:.6;transition:transform var(--dur-3) var(--ease-out),opacity var(--dur-2) var(--ease-out)}
.modal-bg.show .modal{transform:none;opacity:1}

/* --- toast: rise in --- */
.toast{transform:translate(-50%,10px);transition:opacity var(--dur-2) var(--ease-out),transform var(--dur-2) var(--ease-out)}
.toast.show{transform:translate(-50%,0)}

/* --- chat: inviting, alive --- */
.chat-fab{transition:transform var(--dur-2) var(--ease-out),box-shadow var(--dur-2) var(--ease-out)}
.chat-fab:hover{transform:scale(1.09)}
.chat-fab:active{transform:scale(.96)}
@keyframes fabHello{0%{box-shadow:0 6px 22px rgba(6,76,127,.4),0 0 0 0 rgba(195,171,88,.55)}100%{box-shadow:0 6px 22px rgba(6,76,127,.4),0 0 0 18px rgba(195,171,88,0)}}
.chat-fab{animation:fabHello 1.6s var(--ease-out) .8s 2}
.chat-panel{display:flex;visibility:hidden;opacity:0;transform:translateY(16px) scale(.98);transform-origin:bottom right;pointer-events:none;transition:opacity var(--dur-2) var(--ease-out),transform var(--dur-3) var(--ease-out),visibility 0s linear var(--dur-3)}
.chat-panel.open{visibility:visible;opacity:1;transform:none;pointer-events:auto;transition:opacity var(--dur-2) var(--ease-out),transform var(--dur-3) var(--ease-out)}
.cm{animation:viewIn var(--dur-2) var(--ease-out) both}

/* --- accordions & details: content eases in --- */
.hb-item .hb-body{animation:viewIn var(--dur-2) var(--ease-out)}
.hb-item summary{transition:color var(--dur-1),background var(--dur-1);border-radius:8px}
.hb-item summary:hover{background:#f5f8fb}

/* --- pinned bulletin: settles on arrival --- */
@keyframes pinIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.pinbar{animation:pinIn var(--dur-3) var(--ease-out)}

/* --- inputs: focused, not startled --- */
input,select,textarea{transition:border-color var(--dur-1) var(--ease-out),box-shadow var(--dur-2) var(--ease-out)}
input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(6,76,127,.12)}
:focus-visible{outline:2.5px solid var(--gold);outline-offset:2px}
.sb-link:focus-visible,.btn:focus-visible{outline-offset:1px}

/* --- KPI tiles: quiet shine --- */
.kpi{position:relative;overflow:hidden}
.kpi-btn:hover::after{content:'';position:absolute;inset:0;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.08) 50%,transparent 60%);animation:kpiShine .7s var(--ease-out)}
@keyframes kpiShine{from{transform:translateX(-100%)}to{transform:translateX(100%)}}

/* --- progress bars fill on view --- */
@keyframes barGrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.pj-fill{transform-origin:left;animation:barGrow .7s var(--ease-out)}

/* --- respect reduced motion everywhere --- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}
}

/* wonder funnel dashboard */
.wf-row{display:grid;grid-template-columns:190px 1fr 44px;gap:12px;align-items:center;margin-bottom:10px}
.wf-lbl{font-size:13px;font-weight:600;color:var(--ink)}
.wf-lbl .hint{font-weight:500}
.wf-track{background:#edf1f5;border-radius:99px;height:14px;overflow:hidden}
.wf-fill{height:100%;background:var(--accent);border-radius:99px;transform-origin:left;animation:barGrow .7s var(--ease-out)}
.wf-fill.gold{background:var(--gold)}
.wf-n{font-size:13px;font-weight:800;color:var(--accent);text-align:right}
.wf-spark{display:flex;gap:6px;align-items:flex-end;height:110px;padding-top:6px}
.wf-bar{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:4px}
.wf-bar i{display:block;width:100%;max-width:34px;background:linear-gradient(180deg,#2c6a9e,var(--accent));border-radius:6px 6px 3px 3px;transform-origin:bottom;animation:barGrow .6s var(--ease-out)}
.wf-bar span{font-size:10px;color:var(--muted);font-weight:700}

/* ============================================================
   WAVE 2 (Jul 2026) — skeleton loaders, friendly dialogs.
   Appended last so it wins the cascade. Reduced-motion safe.
   ============================================================ */

/* --- skeleton shimmer system --- */
/* ============================================================
   SURFACES — the three widths every screen in this app is built for.
   Check a new view at all three before shipping it.

     phone    <=640px    one column, controls go full width
     tablet   <=1024px   sidebar collapses, .app drops its max-width
     desktop  >=1025px   sidebar pinned, .app fills .main up to 1080px

   The rule that makes desktop work is `.main .app{width:100%}`. Without it
   .app is a flex item with margin:0 auto inside a column flex container,
   which sizes it to its CONTENT — so a page of cards rendered narrow while a
   page with a wide table rendered wide, and the same page changed width
   depending which section you expanded. If a view ever looks phone-sized on a
   monitor, measure .app against .main first; that is almost always it.
   ============================================================ */
/* .app used to shrink-to-fit inside flex-column .main — margin:0 auto on a
   flex item sizes it to its content. .main .app now sets width:100% outright,
   which fixes it for every view rather than only while a skeleton is showing. */
@keyframes skShimmer{0%{background-position:-360px 0}100%{background-position:360px 0}}
.sk{position:relative;display:block;border-radius:8px;background-color:#e7ebf0;background-image:linear-gradient(90deg,#e7ebf0 0px,#f1f4f7 120px,#e7ebf0 240px);background-size:600px 100%;background-repeat:no-repeat;animation:skShimmer 1.5s ease-in-out infinite}
.sk-line{height:13px;margin-bottom:9px;border-radius:6px;width:100%}
.sk-line.w-80{width:80%}
.sk-line.w-60{width:60%}
.sk-line.w-40{width:40%}
.sk-title{height:20px;width:45%;border-radius:7px;margin-bottom:14px}
.sk-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:24px;margin-bottom:16px}
.sk-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:18px}
@media(max-width:720px){.sk-kpis{grid-template-columns:repeat(2,1fr)}}
.sk-kpi{height:84px;border-radius:14px}
.sk-row{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px 18px;display:flex;align-items:center;gap:16px;margin-bottom:12px}
.sk-avatar{width:46px;height:46px;border-radius:12px;flex:none}
.sk-row-body{flex:1;min-width:0}
.sk-grid-block{height:440px;border-radius:16px;margin-top:16px}
@media (prefers-reduced-motion:reduce){
  .sk{animation:none;background-image:none;background-color:#e9ecf1}
}

/* --- in-app confirm/prompt dialogs --- */
.dlg-title{display:flex;align-items:center;gap:8px}
.dlg-danger{color:var(--red)}
#dlgInput{width:100%}
@media (max-width:640px){ .wf-row{grid-template-columns:1fr 44px} .wf-track{grid-column:1/3} }

/* --- empty-state pattern (item 4) --- */
.empty{text-align:center;padding:34px 20px;color:var(--muted)}
/* calendar filler cells share the .empty class — keep grid geometry intact */
.cal-cell.empty{text-align:left;padding:7px 8px}
.empty-ic{width:44px;height:44px;border-radius:50%;background:var(--accent-soft);color:var(--accent);display:flex;align-items:center;justify-content:center;margin:0 auto 14px}
.empty-ic .ico{width:21px;height:21px}
.empty-title{font-size:15px;font-weight:700;color:var(--ink)}
.empty-body{font-size:13.5px;color:var(--muted);margin:6px auto 0;max-width:40ch;line-height:1.5}
.empty .btn{margin-top:16px}
.empty.sm{padding:22px 16px}
.empty.sm .empty-ic{width:34px;height:34px;margin-bottom:9px}
.empty.sm .empty-ic .ico{width:16px;height:16px}
.empty.sm .empty-title{font-size:13.5px}
.empty.sm .empty-body{font-size:12.5px;margin-top:4px}
.empty.sm .btn{margin-top:12px;padding:7px 12px;font-size:12.5px}

/* ============================================================
   WAVE 2 item 5 — first-visit welcome overlay + per-page tip strips.
   Reuses existing modal / pick-card / hs-card visual language.
   ============================================================ */

/* --- per-page first-run tip strip (.frt) --- */
.frt{display:flex;align-items:center;gap:10px;background:var(--gold-soft);border:1px solid var(--gold);border-radius:12px;padding:10px 14px;margin:0 0 14px;font-size:13px;color:var(--gold-ink)}
.frt .ico{color:var(--gold-ink);flex:none}
.frt-txt{flex:1;line-height:1.4}
.frt-more{color:var(--accent);font-weight:700;white-space:nowrap;text-decoration:none}
.frt-more:hover{text-decoration:underline}
.frt-x{background:none;border:none;cursor:pointer;color:var(--gold-ink);opacity:.7;display:flex;align-items:center;padding:2px;flex:none}
.frt-x:hover{opacity:1}
.frt-x .ico{width:14px;height:14px}
@media(max-width:560px){.frt{flex-wrap:wrap}.frt-txt{flex:1 1 100%}}

/* --- welcome overlay cards --- */
.modal:has(.welcome-cards){max-width:640px}
.welcome-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:6px 0 4px}
@media(max-width:640px){.welcome-cards{grid-template-columns:1fr}}
.welcome-card{display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-align:left;border:1.5px solid var(--line);border-radius:13px;padding:16px;background:#fcfdfe}
.welcome-card .wc-ic{width:34px;height:34px;border-radius:50%;background:var(--accent-soft);color:var(--accent);display:flex;align-items:center;justify-content:center;flex:none}
.welcome-card .wc-ic .ico{width:17px;height:17px}
.welcome-card b{font-size:14px}
.welcome-card span:last-child{font-size:12.5px;color:var(--muted);line-height:1.45}
@media (prefers-reduced-motion:reduce){
  .welcome-card,.frt{transition:none}
}

/* ============================================================
   Serving Schedules v2 (Jul 2026) — on-brand combobox + public
   "Who's Serving" page. Reduced-motion respected globally above.
   ============================================================ */

/* --- reusable searchable combobox (kills native <select> "OS control" look) --- */
.combo{position:relative;min-width:150px}
.combo-input{cursor:text}
/* single shared floating panel, appended to <body> so it always escapes clipping/transformed
   ancestors like .modal (which animates with transform) or a table wrapped in overflow:auto */
#comboPanel{position:fixed;z-index:70;display:none;max-height:260px;overflow-y:auto;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow),0 14px 34px rgba(6,20,33,.16);padding:6px;opacity:0;transform:translateY(-6px) scale(.98);transform-origin:top;transition:opacity var(--dur-2) var(--ease-out),transform var(--dur-2) var(--ease-out)}
#comboPanel.show{display:block;opacity:1;transform:none}
.combo-item{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:8px 10px;border-radius:8px;font-size:13.5px;font-weight:600;color:var(--ink);cursor:pointer}
.combo-item:hover,.combo-item.active{background:var(--accent-soft);color:var(--accent-ink)}
.combo-sub{font-size:11px;font-weight:600;color:var(--muted);white-space:nowrap;flex:none}
.combo-item:hover .combo-sub,.combo-item.active .combo-sub{color:var(--accent)}
.combo-empty{padding:14px 10px;text-align:center;color:var(--muted);font-size:12.5px}
@media (prefers-reduced-motion:reduce){ #comboPanel{transition:none} }

/* --- public "Who's Serving" page (#/serve) --- */
.srv-wrap{max-width:520px;margin:0 auto}
.srv-wrap .pub-card{max-width:none}
.srv-head{text-align:center;margin-bottom:14px}
.srv-head h1{font-size:22px;font-weight:800;letter-spacing:-.3px}
.srv-date{font-size:15px;font-weight:700;color:var(--accent-ink);margin-top:4px}
.srv-datebar{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:16px}
.srv-dateselect{width:auto;flex:none;max-width:230px;font-size:13px;font-weight:600;padding:9px 12px}
.srv-team{border-top:1px solid var(--line);padding:16px 0}
.srv-team:first-child{border-top:none;padding-top:0}
.srv-team-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px;margin-bottom:8px}
.srv-team-h b{font-size:15px;color:var(--accent-ink)}
.srv-role{display:flex;justify-content:space-between;gap:14px;padding:6px 0;font-size:13.5px}
.srv-role-name{font-weight:700;flex:none}
.srv-role-names{color:var(--muted);text-align:right}
.srv-open{color:#aab2bb;font-style:italic}
@media(max-width:480px){ .srv-role{flex-direction:column;gap:2px} .srv-role-names{text-align:left} }

/* --- "Plan my serving" claim-ahead view (#/planserving) & recurring-schedule setup --- */
.ps-filterbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:16px}
.ps-rangebar{display:flex;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.ps-team-card{margin-bottom:12px}
.ps-team-h{font-weight:800;font-size:14px;margin-bottom:2px}
.ps-role-row{display:flex;gap:10px;padding:9px 0;border-top:1px solid var(--line);flex-wrap:wrap;align-items:center}
.ps-role-row:first-of-type{border-top:none}
.ps-role-name{width:150px;font-weight:700;font-size:13px;flex-shrink:0}
.ps-slots{display:flex;gap:8px;flex-wrap:wrap;flex:1}
.ps-slot{display:inline-flex;align-items:center;gap:7px;border-radius:9px;padding:5px 9px;font-size:12.5px;font-weight:700}
.ps-slot.mine{background:var(--green-soft);border:1px solid #bfe6cf}
.ps-slot.filled{background:var(--slate-soft);border:1px solid var(--line);color:var(--muted);font-weight:600}
.ps-av{width:22px;height:22px;border-radius:50%;color:#fff;font-size:9px;font-weight:800;display:flex;align-items:center;justify-content:center;flex:none}
.ps-open-locked{display:inline-block;border:1px dashed var(--line);border-radius:9px;padding:6px 10px;color:var(--muted);font-size:12px;font-weight:600}
@media(max-width:640px){ .ps-role-name{width:100%} }


/* ---------- Presentations module ---------- */
.pres-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 14px;margin-bottom:8px}
.pres-thumb{flex:0 0 auto;width:80px;height:45px;border-radius:6px;overflow:hidden;background:#0b1622;border:1px solid #e3e8ee}
.pres-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.pres-name{flex:1;min-width:200px}
.pres-name b{display:block;font-size:15px;line-height:1.25}
.pres-name span{font-size:12px;color:#6b7683}
.pres-acts{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.pres-bulk{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 4px}
.pres-drop{border:1.5px dashed #c3ab58;border-radius:12px;padding:28px 16px;text-align:center;cursor:pointer;
  background:#fdfbf5;transition:border-color .18s,background .18s}
.pres-drop:hover,.pres-drop.over{border-color:#064c7f;background:#f4f8fc}
.pres-drop b{display:block;font-size:17px;margin:8px 0 4px}
.pres-drop span{display:block;font-size:13px;color:#6b7683;line-height:1.5;max-width:44em;margin:0 auto}
.pres-queue{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.pres-queue .pq{position:relative;width:84px;height:48px;border-radius:5px;overflow:hidden;border:1px solid #e3e8ee;background:#0b1622}
.pres-queue .pq img{width:100%;height:100%;object-fit:cover;display:block}
.pres-queue .pq b{position:absolute;left:3px;bottom:2px;font-size:10px;color:#fff;background:rgba(0,0,0,.6);border-radius:3px;padding:0 4px}
.pres-bar{margin-top:12px;height:5px;border-radius:3px;background:#e6ebf1;overflow:hidden}
.pres-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#064c7f,#c3ab58);transition:width .25s}
.pres-qr{display:flex;justify-content:center;padding:14px;background:#fdfbf5;border:1px solid #e9e2cd;border-radius:12px;margin-bottom:12px}
.pres-qr svg{width:190px;height:190px}
@media (max-width:640px){.pres-acts{width:100%}.pres-acts .btn{flex:1 1 auto;text-align:center}}

/* mode switch + outline builder */
.pres-modes{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px}
.pres-mode{font-family:inherit;text-align:left;cursor:pointer;padding:14px 16px;border-radius:12px;
  border:1.5px solid #e3e8ee;background:#fff;transition:border-color .18s,background .18s,box-shadow .18s}
.pres-mode:hover{border-color:#c3ab58}
.pres-mode.on{border-color:#064c7f;background:#f4f8fc;box-shadow:0 0 0 3px rgba(6,76,127,.08)}
.pres-mode b{display:block;font-size:15px;margin-bottom:3px;color:#1f2a37}
.pres-mode span{display:block;font-size:12.5px;color:#6b7683;line-height:1.45}
#presOutline{width:100%;font:inherit;font-size:14px;line-height:1.6;padding:12px 14px;border-radius:10px;
  border:1.5px solid #e3e8ee;background:#fff;color:#1f2a37;resize:vertical;min-height:230px;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
#presOutline:focus{outline:none;border-color:#064c7f}
.pres-preview{margin-top:10px}
.pres-plan{font-size:12.5px;color:#6b7683;background:#f7f9fb;border:1px solid #e9edf2;
  border-radius:9px;padding:9px 12px}
.pres-plan b{color:#064c7f}
@media (max-width:640px){.pres-modes{grid-template-columns:1fr}}

.pres-drop.sm{padding:20px 16px}
.pres-drop.sm b{font-size:15px}
.pres-drop.sm span{font-size:12.5px}
.pres-carry:empty{display:none}

/* composer review */
.pres-draft{margin-top:12px;border:1px solid #e3e8ee;border-radius:12px;background:#fff;overflow:hidden}
.pres-draft-top{display:flex;align-items:center;gap:10px;padding:10px 14px;background:#f7f9fb;
  border-bottom:1px solid #e9edf2;flex-wrap:wrap}
.pres-draft-top b{font-size:14px;color:#064c7f}
.pres-draft-top span{font-size:12px;color:#6b7683}
.pres-draft-top .spacer{flex:1}
.pres-draft-row{display:flex;gap:10px;align-items:flex-start;padding:9px 14px;border-top:1px solid #f0f3f6}
.pres-draft-row:first-of-type{border-top:none}
.pres-draft-row .n{flex:0 0 auto;font-size:11px;font-weight:700;color:#a8b2bd;padding-top:2px}
.pres-draft-row .ly{flex:0 0 74px;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:#8a7530;padding-top:3px}
.pres-draft-row .tx{flex:1;min-width:0;font-size:13.5px;line-height:1.45;color:#1f2a37}
.pres-draft-row .tx i{display:block;font-style:normal;font-size:12px;color:#6b7683;margin-top:2px}
@media (max-width:640px){.pres-draft-row .ly{flex:0 0 60px}}

/* series asset marked as the QR slide background */
.badge.gold{background:#f6efd8;color:#8a6d1f;border:1px solid #e3d5a8}

/* baptisms & child dedications */
.hero-acts{display:flex;gap:8px;flex-wrap:wrap}
.badge.st-done{background:#e7f4ed;color:#1f7a4d;border:1px solid #bfe3cf}
.badge.st-wait{background:#eef2f7;color:#4b5a68;border:1px solid #d8e0e9}
.badge.st-off{background:#f4f5f6;color:#8b939c;border:1px solid #e2e5e9}
.warn-txt{color:#c0392b}
@media(max-width:640px){.hero-acts{width:100%}.hero-acts .btn{flex:1}}

/* A quiet aside inside a panel — used for the standing crew slide, where the
   point is "this is different from the thing above it", not "look at me". */
.callout-soft{background:#f7f9fc;border:1px solid var(--line,#e3e8ee);border-left:3px solid var(--gold,#C3AB58);border-radius:10px;padding:12px 14px}
.callout-soft b{display:block;font-size:13px;letter-spacing:.02em}
.callout-soft .mp-ptext{font-size:13.5px}

/* ---------- EVENT COUNTS ----------
   Used standing up, one-handed, in a room with the lights down. Everything here
   is sized for a thumb first and a desktop pointer second: 60px targets, numbers
   big enough to read at arm's length, and no horizontal scroll at 375px. */
.badge.st-out{background:var(--gold-soft,#f7f1de);color:var(--gold-ink,#8a7325);border:1px solid #e8dcb4}

.cnt-switch{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 18px;
  background:var(--card,#fff);border:1px solid var(--line,#e4e7ec);border-radius:12px;padding:10px 14px}
.cnt-switch label{margin:0;white-space:nowrap}
.cnt-switch select{flex:1;min-width:0;font-family:inherit;font-size:14px;font-weight:600;color:var(--ink);
  border:1px solid var(--line,#e4e7ec);border-radius:9px;padding:9px 10px;background:#fff}

.cnt-takes{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 20px}
.cnt-take{flex:1 1 auto;min-width:104px;min-height:48px;padding:12px 16px;border-radius:12px;cursor:pointer;
  border:1.5px solid var(--line,#e4e7ec);background:var(--card,#fff);color:var(--muted,#5b6673);
  font-family:inherit;font-size:15px;font-weight:700;transition:all .12s ease}
.cnt-take:hover{border-color:var(--accent,#064c7f);color:var(--accent,#064c7f)}
.cnt-take.on{background:var(--accent,#064c7f);border-color:var(--accent,#064c7f);color:#fff;
  box-shadow:0 2px 10px rgba(6,76,127,.22)}

.cnt-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;margin-bottom:20px}
.cnt-card{min-width:0;background:var(--card,#fff);border:1px solid var(--line,#e4e7ec);border-radius:var(--radius,16px);
  box-shadow:var(--shadow);padding:18px 14px 14px;text-align:center}
.cnt-name{display:block;font-size:13px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;
  color:var(--muted,#5b6673)}
.cnt-stepper{display:flex;align-items:center;gap:8px;margin:12px 0 10px}
.cnt-btn{flex:none;width:60px;height:60px;border-radius:50%;cursor:pointer;
  border:1.5px solid var(--accent,#064c7f);background:var(--accent-soft,#e7eef5);color:var(--accent,#064c7f);
  font-family:inherit;font-size:30px;font-weight:700;line-height:1;
  display:flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent;
  transition:transform .08s ease,background .12s ease}
.cnt-btn:hover{background:var(--accent,#064c7f);color:#fff}
.cnt-btn:active{transform:scale(.93)}
.cnt-val{flex:1;min-width:0;width:100%;height:60px;text-align:center;font-family:inherit;
  font-size:36px;font-weight:800;letter-spacing:-.02em;color:var(--accent,#064c7f);
  background:transparent;border:none;border-bottom:2px dashed #dbe3ec;border-radius:0;padding:0}
.cnt-val::placeholder{color:#c3ccd6;font-weight:700}
.cnt-val:focus{outline:none;border-bottom-color:var(--gold,#c3ab58);background:#fcfaf3}
/* the spinners are useless at this size and steal thumb room */
.cnt-val::-webkit-outer-spin-button,.cnt-val::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.cnt-val[type=number]{-moz-appearance:textfield}
.cnt-last{font-size:12px;color:var(--muted,#5b6673);line-height:1.4}
.cnt-last.muted{color:#a7b0ba}

.cnt-derived{background:linear-gradient(180deg,#fbfcfe,#f4f7fb)}
.cnt-dval{font-size:42px;font-weight:800;letter-spacing:-.02em;color:var(--accent,#064c7f);margin:10px 0 2px}
.cnt-cap{font-size:12px;color:var(--muted,#5b6673)}
.cnt-ovr{margin-top:10px;background:none;border:none;cursor:pointer;font-family:inherit;
  font-size:12.5px;font-weight:700;color:var(--accent,#064c7f);text-decoration:underline;padding:6px 8px}

.cnt-savebar{position:sticky;bottom:12px;z-index:5;display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  background:var(--card,#fff);border:1px solid var(--line,#e4e7ec);border-radius:14px;padding:12px 14px;
  box-shadow:0 6px 24px rgba(21,24,28,.12)}
.cnt-saveinfo{flex:1;min-width:140px;font-size:13.5px;font-weight:600;color:var(--muted,#5b6673)}
.cnt-savebtn{min-height:48px;padding:0 26px;font-size:15px}
.cnt-savebtn[disabled]{opacity:.45;cursor:not-allowed}

.cnt-done{text-align:center;padding:30px 20px}
.cnt-done-ic{color:var(--green,#1f7a4d);margin-bottom:6px}
.cnt-done h2{font-size:21px;font-weight:800;letter-spacing:-.3px}
.cnt-sum{max-width:340px;margin:18px auto;text-align:left}
.cnt-sum-row{display:flex;justify-content:space-between;gap:14px;padding:9px 2px;border-bottom:1px solid var(--line,#e4e7ec);font-size:14.5px}
.cnt-sum-row:last-child{border-bottom:none}
.cnt-sum-row b{color:var(--accent,#064c7f);font-size:16px}
.cnt-done .hint{max-width:420px;margin:0 auto 18px}
.cnt-survey{text-align:center}
.cnt-qrbox{width:210px;max-width:100%;margin:0 auto;border:1px solid var(--line,#e4e7ec);border-radius:14px;padding:12px;background:#fff}
.cnt-qrbox svg{width:100%;height:auto;display:block}

/* Counts as they read on the event hub and in the admin catalog */
.cnt-grid{display:flex;flex-direction:column;gap:2px}
.cnt-grid-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  padding:9px 2px;border-bottom:1px solid var(--line,#e4e7ec)}
.cnt-grid-row:last-child{border-bottom:none}
.cnt-grid-n{font-size:13.5px;font-weight:700;color:var(--ink)}
.cnt-grid-v{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.cnt-pill{display:inline-block;background:var(--accent-soft,#e7eef5);color:var(--accent-ink,#063b62);
  border-radius:999px;padding:3px 11px;font-size:12px;font-weight:600}
.cnt-pill b{font-size:13.5px}
.cnt-cfg{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px 16px;margin:10px 0 4px}
.cnt-addrow{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:12px;padding-top:12px;border-top:1px solid var(--line,#e4e7ec)}
.cnt-addrow input{flex:1;min-width:180px;font-family:inherit;font-size:13.5px;
  border:1px solid var(--line,#e4e7ec);border-radius:9px;padding:10px 12px}
.cnt-capture .cnt-cap-line{font-size:16px;font-weight:700;color:var(--ink)}
.cnt-capture .cnt-cap-line b{color:var(--accent,#064c7f)}

/* Count chips — the compact "Attendance 168 · First Time Guests 5" line that
   rides along with an event on calendars, service lists and MAPs. The row keeps
   its height while the numbers are still loading so nothing jumps. */
.cnt-chips{display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-height:20px;margin-top:6px}
.cnt-chip{display:inline-flex;align-items:baseline;gap:5px;background:var(--accent-soft,#e7eef5);
  color:var(--accent-ink,#063b62);border-radius:999px;padding:2px 10px;font-size:11.5px;font-weight:600;
  line-height:1.7;white-space:nowrap}
.cnt-chip b{font-size:12.5px;font-weight:800}
.cnt-chips-none{font-size:11.5px;color:var(--muted,#6b7480)}
.cnt-chips .badge{font-size:11px}
.ce-counts,.res-counts{margin-top:2px}
.cnt-chipline .cnt-chips{margin-top:0}

@media(max-width:520px){
  .cnt-cards{grid-template-columns:1fr}
  .cnt-take{min-width:88px;font-size:14px}
  .cnt-savebar{position:sticky;bottom:8px}
  .cnt-savebtn{flex:1}
  .cnt-cfg{grid-template-columns:1fr}
}


/* ---- Guest Journey v2 (Aug 2026) ---- */
.jkpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:14px 0}
.jkpi{background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:12px 14px;cursor:pointer;border-top:3px solid var(--line)}
.jkpi .n{font-size:22px;font-weight:800;line-height:1.1}
.jkpi .l{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;margin-top:2px}
.jkpi.red{border-top-color:var(--red)}.jkpi.red .n{color:var(--red)}
.jkpi.amber{border-top-color:var(--gold)}.jkpi.amber .n{color:var(--gold-ink)}
.jkpi.navy{border-top-color:var(--accent)}.jkpi.navy .n{color:var(--accent)}
.jkpi.green{border-top-color:var(--green)}.jkpi.green .n{color:var(--green)}
.jtabs{display:flex;gap:5px;background:#e3e9f0;padding:5px;border-radius:12px;margin:0 0 16px;max-width:560px}
.jtab{flex:1;padding:9px 6px;border-radius:9px;font-size:13px;font-weight:700;color:var(--muted);text-align:center;border:none;background:none;font-family:inherit;cursor:pointer}
.jtab.on{background:var(--accent);color:#fff;box-shadow:0 2px 6px rgba(6,76,127,.3)}
.jtab .cnt{display:inline-block;background:#d2dbe4;color:var(--muted);border-radius:20px;padding:0 7px;font-size:11px;margin-left:4px}
.jtab.on .cnt{background:rgba(255,255,255,.25);color:#fff}
.jview{display:none}.jview.on{display:block}
.jq-h{display:flex;align-items:center;gap:8px;margin:14px 0 8px;font-size:14px;font-weight:800}
.jq-pill{font-size:11px;font-weight:700;padding:2px 9px;border-radius:20px;background:var(--slate-soft);color:var(--slate-ink)}
.jq-pill.red{background:var(--red-soft);color:var(--red)}
.jq-pill.amber{background:var(--gold-soft);color:var(--gold-ink)}
.jq-card{background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:12px 14px;margin-bottom:8px;display:flex;gap:12px;align-items:center;border-left:4px solid transparent;flex-wrap:wrap}
.jq-card.overdue{border-left-color:var(--red)}
.jq-card.today{border-left-color:var(--gold)}
.jq-chk{width:26px;height:26px;flex:none;accent-color:var(--green);cursor:pointer}
.jq-main{flex:1;min-width:180px}
.jq-name{font-weight:800;font-size:14.5px}
.jq-t{font-size:13px;margin-top:1px}
.jq-m{font-size:12px;color:var(--muted);margin-top:2px}
.jq-m .ov{color:var(--red);font-weight:700}
.jq-m .td{color:var(--gold-ink);font-weight:700}
.jq-acts{display:flex;gap:7px}
.jq-act{width:40px;height:40px;border-radius:11px;display:inline-flex;align-items:center;justify-content:center;background:var(--accent-soft);color:var(--accent);border:none;cursor:pointer;text-decoration:none}
.jq-act:hover{background:var(--accent);color:#fff}
.jq-act.gold{background:var(--gold-soft);color:var(--gold-ink)}
.jq-act.gold:hover{background:var(--gold);color:#fff}
.jq-empty{background:var(--green-soft);border:1.5px dashed var(--green);border-radius:14px;padding:22px;text-align:center;color:var(--green);font-weight:600}
.jrm{background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);padding:22px 16px 12px;position:relative}
.jrm-track{display:flex;align-items:flex-start;justify-content:space-between;position:relative;padding:0 6px}
.jrm-track:before{content:'';position:absolute;left:24px;right:24px;top:23px;height:4px;background:var(--line);border-radius:2px}
.jrm-stop{position:relative;z-index:1;flex:1;background:none;border:none;font-family:inherit;cursor:pointer;text-align:center;padding:0}
.jrm-n{display:inline-flex;align-items:center;justify-content:center;width:50px;height:50px;border-radius:50%;color:#fff;font-weight:800;font-size:16px;border:3px solid #fff;box-shadow:0 1px 4px rgba(21,24,28,.18);transition:.15s}
.jrm-stop:hover .jrm-n{transform:scale(1.12)}
.jrm-l{display:block;font-size:12px;font-weight:700;margin-top:7px}
.jrm-p{display:block;font-size:11px;color:var(--muted)}
.jrm-side{display:flex;gap:8px;justify-content:center;margin:16px 0 4px;flex-wrap:wrap}
.jrm-tip{position:absolute;background:var(--ink);color:#fff;border-radius:11px;padding:10px 13px;font-size:12px;max-width:240px;box-shadow:0 10px 28px rgba(0,0,0,.3);opacity:0;pointer-events:none;transition:opacity .12s;z-index:20}
.jrm-tip.on{opacity:1}
.jrm-tip b{display:block;font-size:13px;margin-bottom:2px}
.jboard{display:flex;gap:10px;overflow-x:auto;padding-bottom:10px}
.jb-col{min-width:200px;max-width:200px;flex:none}
.jb-h{display:flex;align-items:center;gap:6px;padding:8px 11px;border-radius:10px 10px 0 0;color:#fff;font-weight:800;font-size:12.5px}
.jb-h .cnt{margin-left:auto;background:rgba(255,255,255,.25);border-radius:20px;padding:0 7px;font-size:11px}
.jb-body{background:#e8ecf1;border-radius:0 0 10px 10px;padding:7px;min-height:90px;display:flex;flex-direction:column;gap:7px}
.jb-card{background:var(--card);border-radius:9px;padding:9px 11px;box-shadow:0 1px 2px rgba(0,0,0,.08)}
.jb-name{font-weight:700;font-size:13px;background:none;border:none;font-family:inherit;color:var(--ink);cursor:pointer;padding:0;text-align:left}
.jb-m{font-size:11px;color:var(--muted);margin-top:2px;display:flex;justify-content:space-between;gap:6px}
.jb-own{background:var(--accent-soft);color:var(--accent);border-radius:20px;padding:0 7px;font-weight:600;white-space:nowrap}
.jb-flag{color:var(--red);font-weight:700}
.jb-adv{margin-top:7px;width:100%;padding:6px;border-radius:8px;background:var(--accent-soft);color:var(--accent);font-size:11.5px;font-weight:700;border:none;cursor:pointer;font-family:inherit}
.jb-adv:hover{background:var(--accent);color:#fff}
.jdir-card{background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:11px 14px;margin-bottom:7px;display:flex;align-items:center;gap:11px;flex-wrap:wrap}
.jdir-av{width:38px;height:38px;border-radius:50%;background:var(--accent-soft);color:var(--accent);font-weight:800;font-size:13px;display:inline-flex;align-items:center;justify-content:center;flex:none}
.jdir-main{flex:1;min-width:150px}
.jdir-name{font-weight:700;font-size:14px;background:none;border:none;font-family:inherit;color:var(--ink);cursor:pointer;padding:0}
.jdir-sub{font-size:12px;color:var(--muted)}
.jdots{display:flex;gap:4px;align-items:center}
.jdot{width:8px;height:8px;border-radius:50%;background:#dbe3ea}
.jdot.f{background:var(--gold)}
.jdot.cur{background:var(--accent);width:10px;height:10px;box-shadow:0 0 0 3px var(--accent-soft)}
.jtools{position:relative}
.jtools-menu{position:absolute;right:0;top:44px;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 30px rgba(0,0,0,.18);padding:5px;z-index:40;min-width:230px;display:none}
.jtools-menu.on{display:block}
.jtools-menu button{display:flex;gap:9px;align-items:center;width:100%;text-align:left;padding:10px 11px;border-radius:8px;font-size:13px;font-weight:600;color:var(--ink);border:none;background:none;font-family:inherit;cursor:pointer}
.jtools-menu button:hover{background:var(--accent-soft)}
.jstep{display:flex;gap:4px;align-items:center;margin:6px 0 14px;flex-wrap:wrap}
.jstep-n{width:26px;height:26px;border-radius:50%;background:var(--slate-soft);color:var(--slate-ink);display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;flex:none}
.jstep-n.done{background:var(--gold);color:#fff}
.jstep-n.cur{background:var(--accent);color:#fff;box-shadow:0 0 0 3px var(--accent-soft)}
.jstep-b{flex:none;height:2px;width:14px;background:var(--line)}
.jstep-b.done{background:var(--gold)}
.jstep-adv{margin-left:auto;padding:7px 12px;border-radius:9px;background:var(--accent);color:#fff;font-size:12px;font-weight:700;border:none;cursor:pointer;font-family:inherit}
@media(max-width:680px){
  .jkpis{grid-template-columns:repeat(2,1fr)}
  .jtab .cnt{display:none}
  .jq-acts{width:100%;justify-content:flex-end}
  .jrm-n{width:36px;height:36px;font-size:13px}
  .jrm-l{font-size:10px}
  .jrm-track:before{top:16px}
  .jb-col{min-width:170px;max-width:170px}
}