/* ==========================================================================
   CCFC shared engine styles: accounts, feed, composer, dashboards.
   Themed entirely through each site's own tokens; the --k-* variables below
   map CCFC (paper/navy), Koinonia (poster paper) and Worship Connect (stage
   black + gold) onto one component vocabulary. Source: ccfc-site/css/core.css
   ========================================================================== */
:root{
  --k-accent:var(--orange,#F15A29);--k-accent-2:var(--orange-2,#FF7A45);--k-on-accent:var(--on-accent,#fff);
  --k-ink:var(--ink,var(--white,#12123A));--k-muted:var(--ink-2,var(--muted,#4A4C6E));--k-faint:var(--ink-3,var(--faint,#8A8CA8));
  --k-panel:var(--panel,#fff);--k-ground:var(--paper-2,var(--ground-2,#EBEDF7));--k-line:var(--line,rgba(14,0,119,.12));
  --k-head:var(--head,var(--navy,#0E0077));--k-soft:var(--soft,rgba(14,0,119,.06));--k-shadow:var(--shadow,0 30px 60px -40px rgba(14,0,119,.35));
  --k-radius:var(--radius,20px);
}
.eyebrow{display:block;font-size:.74rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--k-accent);margin-bottom:.6rem}
.mt-1{margin-top:.6rem}.mt-2{margin-top:1.2rem}.mt-3{margin-top:2rem}.mb-1{margin-bottom:.6rem}.mb-2{margin-bottom:1.2rem}
.row{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center}
.ava{width:40px;height:40px;flex:none;border-radius:50%;background:var(--k-head);color:#fff;display:inline-grid;place-items:center;font-family:var(--font-display);font-weight:700;font-size:.85rem;object-fit:cover;overflow:hidden;letter-spacing:.02em}
.ava--s{width:32px;height:32px;font-size:.7rem}
.ava--l{width:56px;height:56px;font-size:1.1rem}
.pill{display:inline-flex;align-items:center;gap:.35rem;padding:.35rem .8rem;border-radius:999px;font-size:.74rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;background:var(--k-soft);color:var(--k-head);white-space:nowrap;line-height:1.2}
.pill--orange{background:var(--k-accent);color:var(--k-on-accent)}
.pill--danger{background:rgba(184,50,26,.1);color:#B8321A}
.pill svg{width:14px;height:14px}
.chip{display:inline-flex;align-items:center;gap:.4rem;padding:.55rem 1rem;border-radius:999px;font-size:.88rem;font-weight:600;background:var(--k-soft);color:var(--k-ink);cursor:pointer;transition:background .25s,color .25s,transform .25s;white-space:nowrap}
.chip:hover{transform:translateY(-1px)}
.chip.is-on{background:var(--k-head);color:#fff}
.chip i{font-style:normal;opacity:.6;font-size:.8em}
.chip input{position:absolute;opacity:0;pointer-events:none}
.link{display:inline-flex;align-items:center;gap:.4rem;font-weight:600;color:var(--k-head)}

/* ---- nav account ---- */
.nav__account{display:flex;align-items:center}
.nav__signin{font-size:.93rem;font-weight:600;padding:.6rem .9rem;border-radius:999px;opacity:.95}
.nav__signin:hover{background:rgba(255,255,255,.12)}
.nav.is-solid .nav__signin:hover{background:var(--k-soft)}
.nav__user{position:relative}
.nav__avatar{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;padding:0;overflow:hidden;box-shadow:0 0 0 2px rgba(255,255,255,.25)}
.nav__avatar .ava{width:40px;height:40px;background:var(--k-accent);color:var(--k-on-accent)}
[hidden]{display:none!important}
.nav__menu{animation:navMenuIn .22s var(--ease) both;transform-origin:top right;position:absolute;right:0;top:calc(100% + 10px);min-width:230px;background:var(--k-panel);color:var(--k-ink);border:1px solid var(--k-line);padding:1rem 1.1rem;display:grid;gap:.4rem;box-shadow:var(--k-shadow);z-index:80;border-radius:14px}
.nav__menu b{font-family:var(--font-display);color:var(--k-head)}
.nav__menu a,.nav__menu button{text-align:left;padding:.4rem 0;font-size:.95rem;color:var(--k-ink);font-weight:500}
.nav__menu a:hover,.nav__menu button:hover{color:var(--k-accent)}
.nav__menu .pill{justify-self:start}
@keyframes navMenuIn{from{opacity:0;transform:translateY(-6px) scale(.98)}to{opacity:1;transform:none}}
.menu__account{display:grid;gap:.4rem;padding-top:1rem;margin-top:1rem;border-top:1px solid var(--k-line)}
.menu__account .nav__signin{justify-self:start;background:var(--k-accent);color:var(--k-on-accent);padding:.75rem 1.2rem}
.menu__account a{font-weight:500;padding:.35rem 0}
.drawer__user{display:flex;align-items:center;gap:.8rem;margin-bottom:.6rem}
.drawer__user b{display:block;font-family:var(--font-display)}
@media (max-width:1023px){.nav__account .nav__signin{display:none}}

/* ---- auth modal ---- */
.auth{position:fixed;inset:0;z-index:96;background:rgba(8,3,71,.7);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:grid;place-items:center;padding:var(--gutter,20px);opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s;overflow:auto}
.auth.is-open{opacity:1;visibility:visible}
.auth__box{position:relative;width:min(100%,440px);background:var(--k-panel);color:var(--k-ink);padding:2.2rem;display:grid;gap:1.1rem;transform:translateY(16px);transition:transform .6s var(--ease);border-radius:var(--k-radius);border:1px solid var(--k-line);margin:auto}
.auth.is-open .auth__box{transform:none}
.auth__close{position:absolute;top:.8rem;right:.8rem;width:40px;height:40px;border-radius:999px;display:grid;place-items:center;color:var(--k-head)}
.auth__close svg{width:18px;height:18px}
.auth__logo{width:56px}
.auth__site{font-family:var(--font-display);font-weight:700;font-size:1.25rem;color:var(--k-head);line-height:1.1}
.auth__site small{display:block;font-family:var(--font-body);font-weight:500;font-size:.8rem;color:var(--k-faint);margin-top:.3rem}
.auth__social{display:grid;gap:.6rem}
.auth__oauth{display:flex;align-items:center;justify-content:center;gap:.7rem;padding:.8rem 1rem;border-radius:999px;background:#fff;color:#12123A;font-weight:600;font-size:.93rem;box-shadow:inset 0 0 0 1.5px var(--k-line);transition:box-shadow .25s,transform .25s}
.auth__oauth:hover{box-shadow:inset 0 0 0 1.5px var(--k-head)}
.auth__oauth:active{transform:scale(.985)}
.auth__oauth svg{width:20px;height:20px}
.auth__or{display:flex;align-items:center;gap:.8rem;font-size:.78rem;color:var(--k-faint);margin-top:.3rem}
.auth__or i{flex:1;height:1px;background:var(--k-line)}
.auth__tabs{display:flex;gap:.3rem;background:var(--k-soft);padding:.3rem;border-radius:999px}
.auth__tabs button{flex:1;padding:.6rem;border-radius:999px;font-weight:600;font-size:.92rem;color:var(--k-ink)}
.auth__tabs button.is-on{background:var(--k-head);color:#fff}
.auth__form{display:grid;gap:1rem}
.auth__msg{font-size:.9rem;color:var(--k-muted);min-height:1.2em}
.auth__forgot{font-size:.85rem;color:var(--k-head);text-decoration:underline;justify-self:start}
.auth__fine{font-size:.8rem;color:var(--k-faint)}
.toast{position:fixed;left:50%;bottom:1.5rem;transform:translate(-50%,20px);background:var(--k-head);color:#fff;padding:.8rem 1.2rem;border-radius:999px;font-size:.92rem;font-weight:600;opacity:0;transition:opacity .3s,transform .3s;z-index:99;pointer-events:none;box-shadow:var(--k-shadow)}
.toast.is-on{opacity:1;transform:translate(-50%,0)}
.toast.is-err{background:#B8321A}

/* ---- feed layout ---- */
.feed__grid{display:grid;gap:2rem}
@media (min-width:1000px){.feed__grid{grid-template-columns:minmax(0,1fr) 340px;align-items:start}}
.feed__filters{display:flex;flex-wrap:wrap;gap:.45rem}
.feed__list{display:grid;gap:1.2rem}
.feed__side{display:grid;gap:1.2rem;position:sticky;top:calc(var(--nav-h,72px) + 20px)}
.side{background:var(--k-panel);border:1px solid var(--k-line);padding:1.4rem;display:grid;gap:.6rem;border-radius:var(--k-radius)}
.side h3{font-size:1.1rem;color:var(--k-head)}
.side p{color:var(--k-muted);font-size:.92rem}
.feed__more{justify-self:center}
.empty{background:var(--k-panel);border:1px dashed var(--k-line);padding:2.5rem;text-align:center;display:grid;gap:.5rem;border-radius:var(--k-radius)}
.empty h3{color:var(--k-head)}
.empty p{color:var(--k-muted);max-width:40ch;margin-inline:auto}
.skel{height:170px;border-radius:var(--k-radius);background:linear-gradient(90deg,var(--k-ground),var(--k-panel),var(--k-ground));background-size:200% 100%;animation:skel 1.2s linear infinite}
@keyframes skel{to{background-position:-200% 0}}

/* ---- post card ---- */
.post{background:var(--k-panel);border:1px solid var(--k-line);padding:1.3rem 1.4rem;display:grid;gap:.85rem;border-radius:var(--k-radius);position:relative;transition:box-shadow .3s}
.post:hover{box-shadow:var(--k-shadow)}
.post.is-pinned{border-color:var(--k-accent);box-shadow:inset 4px 0 0 var(--k-accent)}
.post__head{display:flex;align-items:center;gap:.8rem}
.post__who{min-width:0;flex:1}
.post__who b{display:block;font-family:var(--font-display);color:var(--k-head);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.post__who span{font-size:.8rem;color:var(--k-muted)}
.post__pinned{font-style:normal;color:var(--k-accent);display:inline-flex;align-items:center;gap:.2rem}
.post__pinned svg{width:12px;height:12px}
.kind{font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700;padding:.35rem .7rem;border-radius:999px;background:var(--k-soft);color:var(--k-head);white-space:nowrap}
.kind--announcement{background:var(--k-accent);color:var(--k-on-accent)}
.kind--video,.kind--music{background:var(--k-head);color:#fff}
.post__menu{position:relative}
.post__more{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;color:var(--k-faint)}
.post__more:hover{background:var(--k-soft);color:var(--k-head)}
.post__more svg{width:18px;height:18px}
.post__menuList{position:absolute;right:0;top:calc(100% + 6px);background:var(--k-panel);border:1px solid var(--k-line);border-radius:12px;display:grid;min-width:180px;box-shadow:var(--k-shadow);z-index:5;overflow:hidden}
.post__menuList button{text-align:left;padding:.7rem 1rem;font-size:.9rem;font-weight:500;color:var(--k-ink)}
.post__menuList button:hover{background:var(--k-soft)}
.post__menuList .post__del{color:#B8321A}
.post__title{font-size:1.3rem;line-height:1.2;color:var(--k-ink)}
.post__body{color:var(--k-ink);font-size:1rem;line-height:1.6}
.post__body p{margin-bottom:.6rem}.post__body p:last-child{margin-bottom:0}
.post__body ul{padding-left:1.2rem;margin:.4rem 0}
.post__body h2,.post__body h3{font-size:1.1rem;margin:.6rem 0 .3rem;color:var(--k-head)}
.post__body a{color:var(--k-accent);text-decoration:underline}
.post__body.is-clamped{max-height:9.6em;overflow:hidden;-webkit-mask-image:linear-gradient(#000 70%,transparent);mask-image:linear-gradient(#000 70%,transparent)}
.post__readmore{justify-self:start;font-size:.9rem}
.pm{display:grid;gap:4px;border-radius:14px;overflow:hidden}
.pm--two{grid-template-columns:1fr 1fr}
.pm--three{grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr}
.pm--three .pm__img:first-child{grid-row:1/3}
.pm--four{grid-template-columns:1fr 1fr}
.pm__img{position:relative;display:block;padding:0;aspect-ratio:4/3;overflow:hidden;background:var(--k-ground);cursor:zoom-in}
.pm--one .pm__img{aspect-ratio:auto;max-height:640px}
.pm--three .pm__img:first-child{aspect-ratio:auto;height:100%}
.pm__img img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.pm__img:hover img{transform:scale(1.03)}
.pm__more{position:absolute;inset:0;display:grid;place-items:center;background:rgba(8,3,71,.55);color:#fff;font-family:var(--font-display);font-weight:700;font-size:2rem}
.pm__yt{position:relative;display:block;width:100%;padding:0;aspect-ratio:16/9;overflow:hidden;border-radius:14px;background:#000;margin-top:4px}
.pm__yt img{width:100%;height:100%;object-fit:cover;opacity:.85;transition:transform .8s var(--ease),opacity .3s}
.pm__yt:hover img{transform:scale(1.03);opacity:1}
.pm__play{position:absolute;left:50%;top:50%;width:68px;height:68px;transform:translate(-50%,-50%);border-radius:50%;background:var(--k-accent);color:var(--k-on-accent);display:grid;place-items:center;box-shadow:0 20px 50px -10px rgba(0,0,0,.6)}
.pm__play svg{width:28px;height:28px;margin-left:3px}
.pm__frame{aspect-ratio:16/9;border-radius:14px;overflow:hidden;margin-top:4px}
.pm__frame iframe,.post video{width:100%;height:100%;border:0;display:block}
.post video{border-radius:14px;max-height:520px;background:#000;margin-top:4px}
.post__foot{display:flex;gap:.4rem;align-items:center;border-top:1px solid var(--k-line);padding-top:.8rem}
.post__foot button{display:inline-flex;align-items:center;gap:.45rem;padding:.5rem .85rem;border-radius:999px;font-size:.88rem;font-weight:600;color:var(--k-muted);transition:background .25s,color .25s}
.post__foot button:hover{background:var(--k-soft);color:var(--k-head)}
.post__foot button svg{width:17px;height:17px}
.post__like.is-on{color:var(--k-accent)}
.post__like.is-on svg{fill:currentColor}
.post__like.is-pop svg{animation:pop .4s var(--ease)}
@keyframes pop{40%{transform:scale(1.45)}}
.post__share{margin-left:auto}
.post__comments{display:grid;gap:.8rem;border-top:1px solid var(--k-line);padding-top:.9rem}
.cmt{display:grid;grid-template-columns:32px 1fr auto;gap:.7rem;align-items:start}
.cmt b{font-size:.9rem;color:var(--k-head)}.cmt span{font-size:.78rem;color:var(--k-faint);margin-left:.3rem}
.cmt p{font-size:.95rem;margin-top:.1rem;color:var(--k-ink)}
.cmt__del{color:var(--k-faint);font-size:1.2rem;line-height:1}
.cmt__form{display:grid;grid-template-columns:32px 1fr auto;gap:.6rem;align-items:end}
.cmt__form textarea{font:inherit;color:var(--k-ink);padding:.6rem .9rem;border:1.5px solid var(--k-line);border-radius:18px;background:var(--k-panel);resize:none;min-height:40px;line-height:1.4}
.cmt__form textarea:focus{outline:none;border-color:var(--k-head)}
.cmt__form .btn{padding:.6rem 1rem;font-size:.85rem}

/* ---- image lightbox ---- */
.ilb{position:fixed;inset:0;z-index:97;background:rgba(5,3,30,.94);display:grid;place-items:center;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s;padding:3rem 1rem}
.ilb.is-open{opacity:1;visibility:visible}
.ilb img{max-width:min(96vw,1400px);max-height:86vh;object-fit:contain;border-radius:10px;box-shadow:0 40px 100px -30px #000}
.ilb__close,.ilb__prev,.ilb__next{position:absolute;width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;display:grid;place-items:center;transition:background .25s}
.ilb__close:hover,.ilb__prev:hover,.ilb__next:hover{background:rgba(255,255,255,.28)}
.ilb__close{top:1rem;right:1rem}.ilb__prev{left:1rem;top:50%;transform:translateY(-50%) rotate(180deg)}.ilb__next{right:1rem;top:50%;transform:translateY(-50%)}
.ilb__close svg,.ilb__prev svg,.ilb__next svg{width:20px;height:20px}
.ilb__cap{position:absolute;bottom:1.2rem;left:0;right:0;text-align:center;color:rgba(255,255,255,.7);font-size:.85rem}

/* ---- composer ---- */
.cmp{background:var(--k-panel);border:1px solid var(--k-line);border-radius:var(--k-radius);padding:1rem 1.2rem;display:grid;gap:.9rem;transition:box-shadow .3s}
.cmp:focus-within{box-shadow:var(--k-shadow)}
.cmp__collapsed{display:flex;align-items:center;gap:.8rem}
.cmp__open{flex:1;text-align:left;padding:.85rem 1.1rem;border-radius:999px;background:var(--k-soft);color:var(--k-muted);font-size:.95rem;transition:background .25s}
.cmp__open:hover{background:var(--k-ground);color:var(--k-ink)}
.cmp__hint{display:flex;gap:.3rem;color:var(--k-faint)}.cmp__hint svg{width:20px;height:20px}
.cmp__body{display:grid;gap:.8rem}
.cmp__head{display:flex;align-items:center;gap:.8rem}
.cmp__head b{display:block;font-family:var(--font-display);color:var(--k-head)}
.cmp__head span{font-size:.8rem;color:var(--k-muted)}
.cmp__close{margin-left:auto;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;color:var(--k-faint)}
.cmp__close svg{width:16px;height:16px}
.cmp__kinds{display:flex;flex-wrap:wrap;gap:.4rem}
.cmp__kinds .chip{position:relative}
.cmp__title{font:inherit;font-family:var(--font-display);font-weight:700;font-size:1.3rem;color:var(--k-ink);background:transparent;border:0;border-bottom:1.5px solid var(--k-line);padding:.5rem 0;width:100%;letter-spacing:-.01em}
.cmp__title:focus{outline:none;border-color:var(--k-head)}
.cmp__text{font:inherit;color:var(--k-ink);background:transparent;border:0;padding:.2rem 0;width:100%;resize:none;line-height:1.55;min-height:70px}
.cmp__text:focus{outline:none}
.cmp__title::placeholder,.cmp__text::placeholder,.cmp__yt input::placeholder{color:var(--k-faint)}
.cmp__yt{display:flex;align-items:center;gap:.6rem;background:var(--k-soft);border-radius:12px;padding:.4rem .6rem .4rem .9rem}
.cmp__yt span{display:flex;color:#E62117}.cmp__yt svg{width:20px;height:20px}
.cmp__yt input{flex:1;font:inherit;background:transparent;border:0;color:var(--k-ink);padding:.5rem 0}
.cmp__yt input:focus{outline:none}
.cmp__ytx{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;color:var(--k-faint)}
.cmp__ytprev{position:relative;aspect-ratio:16/9;max-width:420px;border-radius:12px;overflow:hidden;background:#000}
.cmp__ytprev img{width:100%;height:100%;object-fit:cover;opacity:.85}
.cmp__ytprev span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:54px;height:54px;border-radius:50%;background:var(--k-accent);color:var(--k-on-accent);display:grid;place-items:center}
.cmp__ytprev svg{width:22px;height:22px;margin-left:2px}
.cmp__drop{display:grid;gap:.6rem;border:1.5px dashed var(--k-line);border-radius:14px;padding:.8rem;transition:border-color .25s,background .25s}
.cmp__drop.is-over{border-color:var(--k-accent);background:var(--k-soft)}
.cmp__preview{display:flex;flex-wrap:wrap;gap:.6rem}
.cmp__preview:empty{display:none}
.cmp__thumb{position:relative;width:108px}
.cmp__thumb img,.cmp__vid{width:108px;height:108px;object-fit:cover;border-radius:10px;background:var(--k-ground)}
.cmp__vid{display:grid;place-items:center;align-content:center;gap:.3rem;color:var(--k-head);padding:.4rem;text-align:center}
.cmp__vid svg{width:26px;height:26px}.cmp__vid small{font-size:.65rem;word-break:break-all;color:var(--k-muted)}
.cmp__thumb button{position:absolute;top:-6px;right:-6px;width:24px;height:24px;border-radius:50%;background:var(--k-head);color:#fff;display:grid;place-items:center;box-shadow:0 4px 10px rgba(0,0,0,.3)}
.cmp__thumb button svg{width:12px;height:12px}
.cmp__thumb span{display:block;font-size:.7rem;color:var(--k-faint);margin-top:.25rem;text-align:center}
.cmp__add{display:flex;align-items:center;gap:.5rem;padding:.6rem .8rem;border-radius:10px;color:var(--k-muted);font-weight:600;font-size:.9rem}
.cmp__add:hover{background:var(--k-soft);color:var(--k-head)}
.cmp__add svg{width:20px;height:20px}.cmp__add small{font-weight:500;color:var(--k-faint)}
.cmp__bar{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;border-top:1px solid var(--k-line);padding-top:.8rem}
.cmp__tools{display:flex;gap:.2rem;flex:1;flex-wrap:wrap}
.cmp__tool{display:inline-flex;align-items:center;gap:.4rem;padding:.5rem .75rem;border-radius:999px;font-size:.86rem;font-weight:600;color:var(--k-muted);cursor:pointer;transition:background .25s,color .25s}
.cmp__tool:hover{background:var(--k-soft);color:var(--k-head)}
.cmp__tool svg{width:18px;height:18px}
.cmp__pin input{position:absolute;opacity:0;pointer-events:none}
.cmp__pin:has(input:checked){background:var(--k-accent);color:var(--k-on-accent)}
.cmp__count{font-size:.8rem;color:var(--k-faint)}
.cmp__status{font-size:.88rem;color:var(--k-muted);min-height:1.2em}
.cmp__status.is-err{color:#B8321A}
.cmp__submit{padding:.75rem 1.3rem}
@media (max-width:600px){.cmp__tool span{display:none}.cmp__tool{padding:.5rem}}

/* ---- dashboard ---- */
.dash__head{display:grid;gap:.5rem;margin-bottom:2rem;max-width:70ch}
.dash__head h1{font-size:clamp(2.2rem,5vw,4rem);color:var(--k-head)}
.dash__who{display:flex;align-items:center;gap:.8rem;flex-wrap:wrap;margin-top:1rem;font-family:var(--font-display);font-size:1.05rem}
.dash__who b{display:block;color:var(--k-head)}
.dash__others{display:flex;gap:.6rem;flex-wrap:wrap;margin-left:auto}
.dash__others a{display:inline-flex;align-items:center;gap:.3rem;font-size:.8rem;font-family:var(--font-body);font-weight:600;padding:.45rem .8rem;border-radius:999px;background:var(--k-soft);color:var(--k-head)}
.dash__others a svg{width:14px;height:14px}
.dash__stats{display:grid;gap:1px;background:var(--k-line);border:1px solid var(--k-line);grid-template-columns:repeat(2,1fr);margin-bottom:2rem;border-radius:var(--k-radius);overflow:hidden}
@media (min-width:800px){.dash__stats{grid-template-columns:repeat(5,1fr)}}
.dash__stats .stat,.dash__kpis .stat{background:var(--k-panel);padding:1.2rem}
.stat b{display:block;font-family:var(--font-display);font-weight:700;font-size:clamp(1.8rem,3vw,2.6rem);letter-spacing:-.03em;color:var(--k-head);line-height:1}
.stat span{display:block;color:var(--k-muted);margin-top:.5rem;font-size:.85rem}
.dash__kpis{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--k-line);border:1px solid var(--k-line);border-radius:14px;overflow:hidden;margin-bottom:1.2rem}
@media (min-width:800px){.dash__kpis{grid-template-columns:repeat(4,1fr)}}
.dash__kpis .stat b{font-size:1.4rem}
.stat small{display:block;margin-top:.25rem;font-size:.74rem;color:var(--k-faint)}
/* Koinonia registrations at a glance: momentum, where people come from, who comes which day, ages, dietary needs */
.kreg{margin:0 0 1.2rem}
.kreg > summary{display:inline-flex;align-items:center;gap:.55rem;cursor:pointer;list-style:none;font-weight:700;font-size:.92rem;color:var(--k-head);padding:.2rem 0}
.kreg > summary::-webkit-details-marker{display:none}
.kreg > summary::before{content:"";width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg);transition:transform .2s;margin:0 .15rem}
.kreg[open] > summary::before{transform:rotate(45deg)}
.kreg__grid{display:grid;gap:.8rem;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));margin-top:.8rem}
.kreg__card{background:var(--k-panel);border:1px solid var(--k-line);border-radius:14px;padding:1rem 1.1rem;display:grid;gap:.85rem;align-content:start;min-width:0}
.kreg__card--wide{grid-column:1/-1}
.kreg__h{display:flex;align-items:baseline;justify-content:space-between;gap:.6rem;flex-wrap:wrap}
.kreg__h h4{font-size:.92rem;color:var(--k-head);margin:0}
.kreg__h span{font-size:.78rem;color:var(--k-faint)}
.kreg__spark{display:flex;align-items:flex-end;gap:3px;height:84px}
.kreg__spark i{flex:1;height:var(--h);min-height:3px;background:var(--k-head);border-radius:3px 3px 0 0;opacity:.85;transition:opacity .2s,background .2s}
.kreg__spark i.is-zero{background:var(--k-line);min-height:2px;opacity:1}
.kreg__spark i:hover{opacity:1;background:var(--k-accent)}
.kreg__axis{display:flex;justify-content:space-between;font-size:.74rem;color:var(--k-faint);margin-top:-.4rem}
.kreg__bars{list-style:none;margin:0;padding:0;display:grid;gap:.6rem}
.kreg__bars li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.25rem .6rem;font-size:.86rem;align-items:baseline}
.kreg__bars span{color:var(--k-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kreg__bars b{color:var(--k-head);font-weight:700;font-variant-numeric:tabular-nums}
.kreg__bars i{grid-column:1/-1;height:6px;border-radius:99px;background:var(--k-soft);position:relative;overflow:hidden}
.kreg__bars i::before{content:"";position:absolute;inset:0 auto 0 0;width:var(--w);background:var(--k-head);border-radius:inherit}
.kreg__foot{margin:0;font-size:.78rem;color:var(--k-muted);line-height:1.5}
.kreg__none{margin:0;font-size:.85rem;color:var(--k-faint)}
.kreg__views{margin:0 0 .9rem}
.kreg__views[hidden],.kreg[hidden]{display:none}
.pill.pill--warn{background:rgba(196,128,0,.15);color:#7A4E00}
.pill.pill--stage{background:rgba(22,112,74,.12);color:#135E3E}
.drow b i.pill{font-style:normal}
.apps__share{justify-content:center;margin-top:.5rem}
@media (prefers-reduced-motion:reduce){.kreg > summary::before,.kreg__spark i{transition:none}}
.dash__tabs{display:flex;gap:.3rem;flex-wrap:wrap;margin-bottom:1.6rem;border-bottom:1px solid var(--k-line);padding-bottom:.6rem}
.dash__tab{padding:.65rem 1.1rem;border-radius:999px;font-weight:600;font-size:.9rem;color:var(--k-muted);transition:background .25s,color .25s}
.dash__tab:hover{background:var(--k-soft);color:var(--k-head)}
.dash__tab.is-on{background:var(--k-head);color:#fff}
.dash__toolbar{display:flex;gap:.8rem;align-items:center;flex-wrap:wrap;margin-bottom:1rem}
.dash__toolbar h3{color:var(--k-head);margin-right:auto}
.dash__search{font:inherit;padding:.7rem 1rem;border:1.5px solid var(--k-line);border-radius:999px;min-width:min(100%,280px);flex:1;background:var(--k-panel);color:var(--k-ink)}
.dash__search:focus{outline:none;border-color:var(--k-head)}
.rolesel{font:inherit;padding:.55rem .9rem;border:1.5px solid var(--k-line);border-radius:999px;background:var(--k-panel);color:var(--k-ink);font-size:.9rem}
.dash__list{display:grid;gap:1px;background:var(--k-line);border:1px solid var(--k-line);border-radius:14px;overflow:hidden}
.drow{display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:center;background:var(--k-panel);padding:.9rem 1.1rem}
.drow > div:first-child:not(.ava){grid-column:1/3}
.drow.is-off{opacity:.6}
.drow b{display:block;font-family:var(--font-display);color:var(--k-head);font-size:1rem}
.drow b .pill{font-size:.62rem;padding:.2rem .55rem;vertical-align:middle;margin-left:.3rem}
.drow span{font-size:.82rem;color:var(--k-muted)}
/* The registration number names the Drive file, so it is read and typed, not just glanced at. */
.drow span .ref{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.02em;color:var(--k-ink)}
.drow small{font-size:.75rem;color:var(--k-faint);max-width:20ch}
.drow .pill{cursor:pointer}
.drow .pill[disabled]{opacity:.3;cursor:default}
.drow__thumb{width:56px;height:56px;border-radius:10px;object-fit:cover;background:var(--k-ground)}
.drow__thumb--k{display:grid;place-items:center;font-family:var(--font-display);font-weight:700;color:var(--k-head)}
.lrow__thumb{position:relative;display:block;width:48px;height:64px;padding:0;border:0;overflow:hidden;cursor:pointer}
.lrow__thumb img{width:100%;height:100%;object-fit:cover}
.lrow__thumb .lcov__art i{font-size:.58rem;padding:.15rem .3rem}
.drow--exp{display:block;padding:0}
.drow--exp summary{display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:center;padding:.9rem 1.1rem;cursor:pointer;list-style:none}
.drow--exp summary::-webkit-details-marker{display:none}
.drow--exp[open] summary{background:var(--k-soft)}
.drow__body{padding:.4rem 1.1rem 1.1rem;display:grid;gap:.8rem}
.drow__dl{display:grid;grid-template-columns:auto 1fr;gap:.35rem 1rem;padding:.4rem 1.1rem 1rem;font-size:.9rem;margin:0}
.drow__dl dt{color:var(--k-faint);font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;font-weight:600;padding-top:.15rem}
.drow__dl dd{margin:0;color:var(--k-ink)}
.drow .field{display:grid;gap:.35rem}
.drow .field span{font-size:.8rem;font-weight:600;color:var(--k-head)}
.drow .field textarea{font:inherit;padding:.6rem .9rem;border:1.5px solid var(--k-line);border-radius:12px;background:var(--k-panel);color:var(--k-ink);resize:vertical}
.dash__gate{max-width:56ch;display:grid;gap:.6rem}
.dash__gate h2{color:var(--k-head)}
.values{display:grid;border-top:1px solid var(--k-line)}
.value{display:grid;gap:.6rem;padding:1.4rem 0;border-bottom:1px solid var(--k-line)}
.value h3{color:var(--k-head)}.value p{color:var(--k-muted);max-width:60ch}
/* Portal roles (admin panel): chips for what a person holds, a tick-box picker to change it; Master Admin is dark and locked */
.proles__intro{max-width:72ch;margin-bottom:1.1rem}
.proles{display:flex;flex-wrap:wrap;gap:.35rem;justify-content:flex-end}
.proles .pill{cursor:default;font-size:.62rem;padding:.25rem .6rem;color:var(--k-head)}
.proles .pill--master{background:var(--k-head);color:#fff}
.proles .pill--quiet{background:transparent;box-shadow:inset 0 0 0 1px var(--k-line);color:var(--k-faint)}
.proles__pick{display:grid;gap:.5rem;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));border:0;margin:0;padding:0;min-width:0}
.proles__opt{display:grid;grid-template-columns:auto 1fr;gap:.15rem .6rem;align-items:start;align-content:start;padding:.7rem .85rem;border:1.5px solid var(--k-line);border-radius:12px;background:var(--k-panel);cursor:pointer;transition:border-color .2s,background .2s}
.proles__opt:hover{border-color:var(--k-muted)}
.proles__opt:has(input:checked){border-color:var(--k-head);background:var(--k-soft)}
.proles__opt:has(input:disabled){opacity:.45;cursor:not-allowed}
.proles__opt input{margin:.2rem 0 0;width:1rem;height:1rem;accent-color:var(--k-head)}
.proles__opt b{font-size:.92rem}
.drow .proles__opt small{grid-column:2;max-width:none;font-size:.76rem;line-height:1.4;color:var(--k-muted)}
.proles__foot{display:flex;gap:.8rem;align-items:center;flex-wrap:wrap}
.drow .proles__foot small{font-size:.78rem;color:var(--k-faint);max-width:none}
.proles__foot .btn[disabled]{opacity:.4;pointer-events:none}
.proles__lock{display:flex;gap:.5rem;align-items:center;margin:0;font-size:.88rem;color:var(--k-muted)}
.proles__lock svg{width:16px;height:16px;flex:none}
.proles__none{padding:1rem 1.1rem;background:var(--k-panel)}
.plog__title{color:var(--k-head);margin:2rem 0 .8rem;font-size:1.05rem}
@media (max-width:640px){.drow--exp summary:has(.proles){grid-template-columns:auto 1fr}.drow--exp summary .proles{grid-column:1/-1;justify-content:flex-start}}
/* ---- team editor (Worship Connect team page): the form with a live tile, then the list ---- */
.team__editor .compose__row{display:grid;gap:1rem}
@media (min-width:700px){.team__editor .compose__row{grid-template-columns:1fr 1fr}}
.teamform{gap:1.2rem;padding:1.2rem 1.3rem;scroll-margin-top:calc(var(--nav-h,64px) + 16px)}
.teamform .cmp__head span{display:block;margin-top:.15rem}
.teamform__grid{display:grid;gap:1.3rem}
.teamform__side{display:grid;gap:.7rem;justify-items:start}
.teamform__eyebrow{font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--k-faint)}
/* the member's tile, coloured as the dark team page shows it */
.tm-prev{--p-ground:#0A0A0B;--p-panel:#17171A;--p-ink:#F7F3EA;--p-gold:#E7B84A;--p-muted:rgba(247,243,234,.66);width:100%;max-width:220px;display:grid;gap:.2rem;padding:10px 10px 14px;border-radius:16px;background:var(--p-ground);box-shadow:0 18px 40px -26px rgba(0,0,0,.55);transition:box-shadow .25s,transform .25s}
.tm-prev.is-over{box-shadow:0 0 0 3px var(--k-accent),0 18px 40px -26px rgba(0,0,0,.55);transform:scale(1.015)}
.tm-prev__ph{aspect-ratio:4/5;border-radius:8px;overflow:hidden;background:var(--p-panel);display:grid;place-items:center}
.tm-prev__ph img{width:100%;height:100%;object-fit:cover}
.tm-prev__mono{font-family:var(--font-display);font-weight:700;font-size:2.6rem;letter-spacing:.02em;color:var(--p-gold)}
.tm-prev__name{margin-top:.55rem;font-family:var(--font-display);font-size:1rem;line-height:1.25;color:var(--p-ink);overflow-wrap:anywhere}
.tm-prev__role{font-size:.8rem;font-weight:600;color:var(--p-gold)}
.tm-prev__bio{font-size:.78rem;line-height:1.45;color:var(--p-muted);overflow-wrap:anywhere}
.tm-prev .is-empty{opacity:.38}
.teamform__photo{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .9rem}
.teamform__pick{position:relative;cursor:pointer;padding:.6rem 1rem;font-size:.86rem}
.teamform__pick svg{width:16px;height:16px}
.teamform__pick input,.seg input{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden;pointer-events:none}
.teamform__pick:has(input:focus-visible),.seg:has(input:focus-visible){outline:2px solid var(--k-accent);outline-offset:3px}
.teamform__unphoto{font-size:.84rem;font-weight:600;color:#B8321A}
.teamform__unphoto:hover{text-decoration:underline;text-underline-offset:3px}
.teamform__note{max-width:30ch;font-size:.76rem;line-height:1.45;color:var(--k-faint)}
.teamform__fields{display:grid;gap:1.1rem;min-width:0;align-content:start}
.teamform .field{display:grid;gap:.4rem}
.teamform .field span{font-size:.86rem;font-weight:600;color:var(--k-head)}
.teamform .field span em{font-style:normal;font-weight:500;color:var(--k-faint);margin-left:.35rem}
.teamform .field input{font:inherit;width:100%;padding:.72rem .95rem;border:1.5px solid var(--k-line);border-radius:12px;background:var(--k-panel);color:var(--k-ink);transition:border-color .2s,box-shadow .2s}
.teamform .field input::placeholder{color:var(--k-faint)}
.teamform .field input:focus{outline:none;border-color:var(--k-head);box-shadow:0 0 0 4px var(--k-soft)}
.teamform .field input[aria-invalid="true"]{border-color:#B8321A;box-shadow:0 0 0 4px rgba(184,50,26,.1)}
.teamform__count{justify-self:end;margin-top:-.1rem;font-size:.74rem;color:var(--k-faint);font-variant-numeric:tabular-nums}
.teamform__count.is-near{color:#B8321A}
.teamform__tab{border:0;margin:0;padding:0;min-width:0}
.teamform__tab legend{padding:0;margin-bottom:.45rem;font-size:.86rem;font-weight:600;color:var(--k-head)}
.teamform__segs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem}
.seg{position:relative;display:flex;align-items:flex-start;gap:.65rem;padding:.8rem .95rem;border:1.5px solid var(--k-line);border-radius:12px;background:var(--k-panel);cursor:pointer;transition:border-color .2s,background .2s}
.seg::before{content:'';flex:none;box-sizing:border-box;width:18px;height:18px;margin-top:.1rem;border-radius:50%;border:1.5px solid var(--k-faint);background:var(--k-panel);transition:border .2s}
.seg:hover{border-color:color-mix(in srgb,var(--k-accent) 45%,var(--k-line))}
.seg:has(input:checked){border-color:var(--k-accent);background:color-mix(in srgb,var(--k-accent) 7%,var(--k-panel))}
.seg:has(input:checked)::before{border:5.5px solid var(--k-accent)}
.seg b{display:block;font-size:.93rem;line-height:1.3;color:var(--k-head)}
.seg small{display:block;margin-top:.1rem;font-size:.78rem;line-height:1.35;color:var(--k-muted)}
.teamform__switch{display:flex;align-items:flex-start;gap:.85rem;cursor:pointer}
.teamform__switch input{-webkit-appearance:none;appearance:none;flex:none;position:relative;width:42px;height:24px;margin:.1rem 0 0;border:0;border-radius:999px;background:color-mix(in srgb,var(--k-ink) 22%,transparent);cursor:pointer;transition:background .2s}
.teamform__switch input::after{content:'';position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.28);transition:transform .22s var(--ease,ease)}
.teamform__switch input:checked{background:var(--k-accent)}
.teamform__switch input:checked::after{transform:translateX(18px)}
.teamform__switch input:focus-visible{outline:2px solid var(--k-accent);outline-offset:3px}
.teamform__switch b{display:block;font-size:.93rem;line-height:1.3;color:var(--k-head)}
.teamform__switch small{display:block;margin-top:.1rem;font-size:.78rem;color:var(--k-muted)}
.teamform__bar{border-top:1px solid var(--k-line);padding-top:1rem}
.teamform__bar .btn[disabled]{opacity:.6;cursor:progress}
@media (min-width:860px){.teamform__grid{grid-template-columns:220px minmax(0,1fr);gap:2rem;align-items:start}}
@media (max-width:859px){
  .teamform__side{grid-template-columns:132px minmax(0,1fr);column-gap:1.1rem;align-items:start;justify-items:start}
  .teamform__eyebrow{grid-column:1/-1}
  .tm-prev{grid-row:span 2;padding:8px 8px 10px;border-radius:12px}
  .tm-prev__mono{font-size:1.8rem}.tm-prev__name{font-size:.86rem}.tm-prev__role,.tm-prev__bio{font-size:.7rem}
  .teamform__photo{flex-direction:column;align-items:flex-start}
}
@media (max-width:520px){.teamform{padding:1rem}.teamform__segs{grid-template-columns:1fr}}
.team__head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:.8rem 1.5rem;margin:2.2rem 0 .9rem}
.team__head h3{font-size:1.15rem}
.team__all:first-child .team__head{margin-top:0}
.team__tools{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem}
.team__add{padding:.6rem 1.05rem;font-size:.86rem}
.team__add svg{width:16px;height:16px}
.team__head .sub{margin-top:.2rem;font-size:.85rem;color:var(--k-muted)}
.team__filters{display:flex;flex-wrap:wrap;gap:.35rem}
.team__filters .chip{padding:.45rem .85rem;font-size:.84rem}
.team__filters .chip i{font-style:normal;font-variant-numeric:tabular-nums;opacity:.6;margin-left:.1rem}
.team__none{background:var(--k-panel);padding:1.3rem 1.1rem;color:var(--k-muted);font-size:.9rem}
.team__row .drow__thumb{width:52px;height:52px}
.team__acts{gap:.35rem;justify-content:flex-end}
.team__swap{background:transparent;box-shadow:inset 0 0 0 1.5px var(--k-line);color:var(--k-muted)}
.team__swap svg{width:13px;height:13px}
.team__swap.is-media{box-shadow:none;background:color-mix(in srgb,var(--k-accent) 14%,transparent);color:var(--k-accent)}
.team__swap:hover{box-shadow:inset 0 0 0 1.5px var(--k-accent);color:var(--k-accent)}
.team__row.is-new{animation:team-new 1.8s var(--ease,ease)}
@keyframes team-new{0%,35%{background:color-mix(in srgb,var(--k-accent) 14%,var(--k-panel))}100%{background:var(--k-panel)}}
.team__acts .edit svg,.team__acts .del svg{display:none}
/* phones: the row's buttons go under the name on one line; Edit and Remove become icons (their labels stay for screen readers) */
@media (max-width:640px){.team__row{grid-template-columns:auto minmax(0,1fr)}.team__row .team__acts{grid-column:1/-1;justify-content:flex-start;gap:.3rem}.team__acts .pill{padding:.38rem .6rem}
  .team__acts .edit svg,.team__acts .del svg{display:block}.team__acts .edit span,.team__acts .del span{display:none}.team__acts .del{margin-left:auto}}
@media (max-width:380px){.team__row .team__acts{gap:.22rem}.team__acts .pill{padding:.38rem .48rem}}
@media (prefers-reduced-motion:reduce){.team__row.is-new{animation:none}.tm-prev,.teamform__switch input::after{transition:none}}

/* ---- public team page ---- */
.team__grid{display:grid;gap:1.4rem;grid-template-columns:repeat(2,1fr)}
@media (min-width:800px){.team__grid{grid-template-columns:repeat(4,1fr)}}
.tm{display:grid;gap:.3rem}
.tm .ph{aspect-ratio:4/5;overflow:hidden;background:var(--k-ground);border-radius:6px}
.tm .ph img{width:100%;height:100%;object-fit:cover;cursor:zoom-in;transition:transform .8s var(--ease)}
.tm .ph img:hover{transform:scale(1.04)}
.tm__mono{display:grid;place-items:center;font-family:var(--font-display);font-weight:700;font-size:2.4rem;color:var(--k-head)}
.tm b{font-family:var(--font-display);margin-top:.5rem;color:var(--k-ink)}
.tm span{font-size:.85rem;color:var(--k-accent);font-weight:600}
.tm p{font-size:.85rem;color:var(--k-muted)}
/* ---- account center ---- */
.ava--xl{width:120px;height:120px;font-size:2.2rem}
.acct__grid{display:grid;gap:1.2rem}
@media (min-width:900px){.acct__grid{grid-template-columns:1fr 1fr}.acct__photo{grid-row:1/3}}
.acct__card{background:var(--k-panel);border:1px solid var(--k-line);border-radius:var(--k-radius);padding:1.6rem;display:grid;gap:1rem;align-content:start}
.acct__card h2{font-size:1.35rem;color:var(--k-head)}
.acct__photo{text-align:center;justify-items:center}
.acct__photo b{font-family:var(--font-display);font-size:1.3rem;color:var(--k-head)}
.acct__photo .sub{margin:0}
.acct__avatar{position:relative;width:120px;height:120px}
.acct__avatar .ava{width:120px;height:120px;box-shadow:0 0 0 4px var(--k-panel),0 0 0 6px var(--k-line)}
.acct__camera{position:absolute;right:-2px;bottom:-2px;width:40px;height:40px;border-radius:50%;background:var(--k-accent);color:var(--k-on-accent);display:grid;place-items:center;cursor:pointer;box-shadow:0 8px 20px -8px rgba(0,0,0,.5)}
.acct__camera svg{width:18px;height:18px}
.acct__note{font-size:.8rem;color:var(--k-faint);max-width:32ch}
.acct__form,.acct__email,.acct__pass{display:grid;gap:1rem}
.acct__meta .drow__dl{padding:0}
.form__status{font-size:.9rem;min-height:1.3em}.form__status.is-err{color:#B8321A}.form__status.is-ok{color:#1E6B3A}

/* announcement bar (site_settings.announcement) */
.announce{background:var(--k-accent,#F15A29);color:#fff;transform:translateY(-100%);transition:transform .6s cubic-bezier(.16,1,.3,1);position:relative;z-index:5}
.announce.is-in{transform:none}
.announce .wrap{display:flex;align-items:center;gap:.8rem;padding:.7rem 0;font-size:.92rem;font-weight:500}
.announce p{margin:0;flex:1;line-height:1.35}
.announce__dot{width:9px;height:9px;border-radius:50%;background:#fff;flex:none;box-shadow:0 0 0 0 rgba(255,255,255,.6);animation:announce-dot 2s infinite}
@keyframes announce-dot{70%{box-shadow:0 0 0 7px rgba(255,255,255,0)}100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}}
.announce__x{width:30px;height:30px;border-radius:50%;background:rgba(0,0,0,.18);color:#fff;font-size:1.2rem;line-height:1;flex:none}
.announce__x:hover{background:rgba(0,0,0,.32)}
/* Site text settings */
.settings{display:grid;gap:.8rem}
.setting{background:var(--k-panel);border:1px solid var(--k-line);border-radius:var(--k-radius);padding:1rem 1.1rem;display:grid;gap:.5rem}
.setting label b{display:block;color:var(--k-head);font-size:.95rem}
.setting label small{color:var(--k-muted);font-family:ui-monospace,monospace;font-size:.72rem}
.setting textarea{font:inherit;font-size:.93rem;padding:.6rem .8rem;border:1.5px solid var(--k-line);border-radius:12px;background:var(--k-soft);color:inherit;resize:vertical}
.setting.is-dirty .save{background:var(--k-accent,#F15A29);color:#fff}
.setting .row{display:flex;gap:.8rem;align-items:center}

/* cookie consent (shared, themed by each site's tokens) */
.consent{position:fixed;left:1.2rem;bottom:1.2rem;z-index:96;width:min(440px,calc(100vw - 2.4rem));opacity:0;transform:translateY(24px);transition:opacity .45s cubic-bezier(.16,1,.3,1),transform .6s cubic-bezier(.16,1,.3,1);pointer-events:none}
.consent.is-in{opacity:1;transform:none;pointer-events:auto}
.consent__card{background:var(--k-panel);color:var(--k-ink);border:1px solid var(--k-line);border-radius:22px;padding:1.2rem 1.25rem 1.1rem;box-shadow:0 30px 80px -30px rgba(0,0,0,.45);display:grid;gap:.75rem}
.consent__head{display:flex;align-items:center;gap:.6rem}
.consent__head b{font-family:var(--font-display);font-size:1.05rem;color:var(--k-head)}
.consent__ico{width:34px;height:34px;border-radius:50%;background:var(--k-soft);color:var(--k-accent);display:grid;place-items:center;flex:none}
.consent__ico svg{width:19px;height:19px}
.consent p{margin:0;font-size:.88rem;line-height:1.5;color:var(--k-muted)}
.consent p a{color:var(--k-head);text-decoration:underline;text-underline-offset:2px}
.consent__opts{display:grid;gap:.45rem}
.consent__opt{display:flex;gap:.7rem;align-items:flex-start;padding:.65rem .75rem;border-radius:14px;background:var(--k-soft);cursor:pointer}
.consent__opt input{margin-top:.2rem;width:18px;height:18px;accent-color:var(--k-accent);flex:none}
.consent__opt b{display:block;font-size:.88rem;color:var(--k-head)}
.consent__opt small{display:block;font-size:.78rem;color:var(--k-muted);line-height:1.4}
.consent__btns{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.consent__btns .btn{padding:.62rem 1.05rem;font-size:.86rem}
.consent__more{background:none;border:0;color:var(--k-head);font:inherit;font-size:.86rem;font-weight:600;text-decoration:underline;text-underline-offset:3px;cursor:pointer;padding:.4rem .3rem}
@media (max-width:640px){.consent{left:.75rem;right:.75rem;bottom:.75rem;width:auto}.consent__btns .btn{flex:1 1 auto;justify-content:center}.has-consent .mz--widget{opacity:0;pointer-events:none}}
/* consent-gated map */
.cgate{position:absolute;inset:0;display:grid;place-items:center;padding:1.2rem;text-align:center;background:var(--k-ground) radial-gradient(circle at 30% 20%,var(--k-soft),transparent 60%);border-radius:inherit;z-index:2}
.cgate > div{max-width:34ch;display:grid;gap:.6rem;justify-items:center}
.cgate b{font-family:var(--font-display);font-size:1.2rem;color:var(--k-head)}
.cgate p{margin:0;color:var(--k-muted);font-size:.9rem}
.cgate__btns{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center;align-items:center}
.cgate__open{font-weight:600;color:var(--k-head);text-decoration:underline;text-underline-offset:3px;font-size:.9rem}
.cgate__remember{display:flex;gap:.4rem;align-items:center;font-size:.8rem;color:var(--k-muted);cursor:pointer}
.cgate__remember input{accent-color:var(--k-accent)}
/* legal links row used in every footer */
.legal{display:flex;flex-wrap:wrap;gap:.35rem .9rem;align-items:center}
.legal a,.legal button{color:inherit;opacity:.8;font:inherit;background:none;border:0;padding:0;cursor:pointer;text-decoration:none}
.legal a:hover,.legal button:hover{opacity:1;text-decoration:underline;text-underline-offset:3px}
/* visible keyboard focus everywhere */
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:2.5px solid var(--k-accent);outline-offset:3px;border-radius:6px}
/* skip link becomes visible when focused */
a.sr:focus,a.sr:focus-visible{position:fixed;left:1rem;top:1rem;width:auto;height:auto;clip:auto;overflow:visible;z-index:300;background:var(--k-accent);color:var(--k-on-accent);padding:.7rem 1.1rem;border-radius:999px;font-weight:700;box-shadow:0 10px 30px -10px rgba(0,0,0,.5)}

/* ---------- Upper Room: upload pop-up, file previews, visual shelves, preview viewer ---------- */
.lib__tools{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;margin:1.6rem 0 .8rem}
.lib__tools .lib__search{flex:1 1 260px}
.lib__add{margin-left:auto}
.lib__chips{margin-bottom:1.2rem}
.upl{position:fixed;inset:0;z-index:110;background:rgba(8,6,40,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:grid;place-items:center;padding:1rem;opacity:0;transition:opacity .25s}
.upl.is-in{opacity:1}
.upl__card{width:min(640px,100%);max-height:calc(100dvh - 2rem);overflow:auto;background:var(--k-panel);color:var(--k-ink);border-radius:24px;box-shadow:0 40px 100px -30px rgba(0,0,0,.55);padding:1.3rem 1.4rem;display:grid;gap:1rem;transform:translateY(16px) scale(.98);transition:transform .45s cubic-bezier(.16,1,.3,1)}
.upl.is-in .upl__card{transform:none}
.upl__head{display:flex;gap:1rem;align-items:flex-start;justify-content:space-between}
.upl__head h2{font-size:1.45rem;color:var(--k-head);line-height:1.15}
.upl__head p{margin:.25rem 0 0;color:var(--k-muted);font-size:.9rem}
.upl__x{width:38px;height:38px;flex:none;border-radius:50%;border:0;background:var(--k-soft);color:var(--k-head);font-size:1.5rem;line-height:1;cursor:pointer;transition:transform .35s cubic-bezier(.16,1,.3,1)}
.upl__x:hover{transform:rotate(90deg)}
.upl__drop{display:grid;justify-items:center;gap:.35rem;text-align:center;padding:2rem 1rem;border:2px dashed var(--k-line);border-radius:18px;background:var(--k-soft);cursor:pointer;transition:border-color .25s,background .25s,padding .35s}
.upl__drop input{position:absolute;width:1px;height:1px;opacity:0}
.upl__drop:hover,.upl__drop.is-over{border-color:var(--k-accent);background:color-mix(in srgb,var(--k-accent) 8%,var(--k-panel))}
.upl__drop:focus-within{outline:2.5px solid var(--k-accent);outline-offset:3px}
.upl__drop.is-compact{padding:.9rem 1rem}
.upl__drop.is-compact .upl__dropico,.upl__drop.is-compact small{display:none}
.upl__dropico{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:var(--k-panel);color:var(--k-accent);box-shadow:var(--k-shadow)}
.upl__dropico svg{width:24px;height:24px}
.upl__drop b{color:var(--k-head)}
.upl__drop u{color:var(--k-accent)}
.upl__drop small{color:var(--k-muted)}
.upl__files{display:grid;gap:.6rem}
.upl__shared{display:grid;gap:.8rem}
.upl__shared .field small{font-weight:400;color:var(--k-muted)}
.upl__foot{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;justify-content:flex-end;padding-top:.4rem;border-top:1px solid var(--k-line)}
.upl__status{margin-right:auto;font-size:.88rem;color:var(--k-muted)}
.upf{position:relative;display:grid;grid-template-columns:64px 1fr auto;gap:.8rem;align-items:center;padding:.55rem .6rem .55rem .55rem;border:1px solid var(--k-line);border-radius:16px;background:var(--k-panel);opacity:0;transform:translateY(8px);transition:opacity .35s,transform .45s cubic-bezier(.16,1,.3,1),border-color .3s}
.upf.is-in{opacity:1;transform:none}
.upf.is-done{border-color:#2E9E5B}
.upf.is-error{border-color:#D64545}
.upf__thumb{position:relative;width:64px;height:78px;border-radius:10px;overflow:hidden;background:var(--k-soft);display:grid;place-items:center}
.upf__thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;animation:upf-fade .4s ease both}
@keyframes upf-fade{from{opacity:0}to{opacity:1}}
.upf__spin{position:absolute;width:22px;height:22px;border-radius:50%;border:2.5px solid rgba(0,0,0,.1);border-top-color:var(--k-accent);animation:upf-spin .8s linear infinite;opacity:0}
.upf.is-rendering .upf__spin{opacity:1}
@keyframes upf-spin{to{transform:rotate(360deg)}}
.upf__body{min-width:0;display:grid;gap:.3rem}
.upf__title{width:100%;font:inherit;font-weight:600;font-size:.95rem;color:var(--k-head);background:transparent;border:1px solid transparent;border-radius:8px;padding:.2rem .35rem;margin-left:-.35rem}
.upf__title:hover,.upf__title:focus{border-color:var(--k-line);background:var(--k-soft);outline:none}
.upf__meta{display:flex;flex-wrap:wrap;gap:.3rem .7rem;align-items:center;font-size:.78rem;color:var(--k-muted)}
.upf__kind{font:inherit;font-size:.78rem;border:1px solid var(--k-line);border-radius:999px;padding:.12rem .5rem;background:var(--k-panel);color:var(--k-head)}
.upf.is-error .upf__extra{color:#D64545}
.upf__bar{height:4px;border-radius:4px;background:var(--k-soft);overflow:hidden;opacity:0;transition:opacity .3s}
.upf.is-uploading .upf__bar,.upf.is-done .upf__bar{opacity:1}
.upf__bar i{display:block;height:100%;width:0;background:var(--k-accent);transition:width .25s}
.upf.is-done .upf__bar i{background:#2E9E5B}
.upf__rm{width:32px;height:32px;border-radius:50%;border:0;background:transparent;color:var(--k-muted);font-size:1.3rem;cursor:pointer}
.upf__rm:hover{background:var(--k-soft);color:var(--k-head)}
.upf.is-done .upf__rm{visibility:hidden}
/* file-type cover art (used when there is no rendered cover) */
.lcov__art{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(150deg,#5B6CFF,#2A2F8F)}
.lcov__art i{font-style:normal;font-family:var(--font-display);font-weight:800;font-size:.8rem;letter-spacing:.06em;color:#fff;background:rgba(255,255,255,.18);padding:.2rem .45rem;border-radius:6px}
.lcov__art--pdf{background:linear-gradient(150deg,#FF6B5A,#C0322A)}
.lcov__art--slides{background:linear-gradient(150deg,#FFB35C,#E0662A)}
.lcov__art--doc{background:linear-gradient(150deg,#5A9BFF,#2553B8)}
.lcov__art--sheet{background:linear-gradient(150deg,#4CC38A,#1E7A4E)}
.lcov__art--audio{background:linear-gradient(150deg,#B67CFF,#6A35C9)}
.lcov__art--video{background:linear-gradient(150deg,#FF7AB6,#B8326E)}
.lcov__art--image{background:linear-gradient(150deg,#39C5D6,#1B7C8F)}
/* shelves */
.lshelf{margin-bottom:2.6rem}
.lshelf__h{display:flex;align-items:center;gap:.6rem;font-size:1.25rem;color:var(--k-head);margin-bottom:1rem}
.lshelf__h span{font-family:var(--font-body);font-size:.75rem;font-weight:600;padding:.15rem .55rem;border-radius:999px;background:var(--k-soft);color:var(--k-muted)}
.lgrid{display:grid;gap:1.4rem 1.1rem;grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
@media (min-width:900px){.lgrid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}}
.lcard{position:relative;display:grid;gap:.35rem;align-content:start}
.lcov{position:relative;display:block;width:100%;aspect-ratio:3/4;border:0;padding:0;border-radius:14px;overflow:hidden;background:var(--k-soft);cursor:pointer;box-shadow:0 18px 30px -22px rgba(0,0,0,.5);transition:transform .5s cubic-bezier(.16,1,.3,1),box-shadow .4s}
.lcov:hover,.lcov:focus-visible{transform:translateY(-6px) rotate(-.6deg);box-shadow:0 30px 40px -24px rgba(0,0,0,.55)}
.lcov img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top}
.lcov__kind{position:absolute;left:.5rem;top:.5rem;font-size:.66rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:.18rem .5rem;border-radius:999px;background:rgba(255,255,255,.92);color:#12123A}
.lcov__open{position:absolute;left:50%;bottom:.7rem;transform:translate(-50%,8px);padding:.4rem .9rem;border-radius:999px;background:#fff;color:#12123A;font-weight:600;font-size:.8rem;opacity:0;transition:opacity .3s,transform .4s cubic-bezier(.16,1,.3,1)}
.lcov:hover .lcov__open,.lcov:focus-visible .lcov__open{opacity:1;transform:translate(-50%,0)}
.lcard b{font-family:var(--font-display);font-size:.98rem;line-height:1.25;color:var(--k-head);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.lcard__meta{font-size:.76rem;color:var(--k-muted)}
.lcard__del{position:absolute;right:.4rem;top:.4rem;width:28px;height:28px;border-radius:50%;border:0;background:rgba(0,0,0,.55);color:#fff;font-size:1.1rem;line-height:1;cursor:pointer;opacity:0;transition:opacity .25s}
.lcard:hover .lcard__del,.lcard__del:focus-visible{opacity:1}
.lcard--skel .lcov{animation:lsk 1.2s ease-in-out infinite alternate}
.lcard--skel b,.lcard--skel span{display:block;height:.8rem;border-radius:6px;background:var(--k-soft);width:80%}
.lcard--skel span{width:50%}
@keyframes lsk{from{opacity:.55}to{opacity:1}}
/* preview viewer */
.lpv__card{width:min(980px,100%);height:calc(100dvh - 2rem);grid-template-rows:auto 1fr}
.lpv__kind{font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--k-accent)}
.lpv__acts{display:flex;gap:.5rem;align-items:center;flex:none}
.lpv__acts .btn small{opacity:.75;font-weight:500;margin-left:.3rem}
.lpv__body{min-height:0;border-radius:14px;overflow:hidden;background:var(--k-soft);display:grid;place-items:center}
.lpv__body iframe{width:100%;height:100%;border:0;background:#fff}
.lpv__body img,.lpv__body video{max-width:100%;max-height:100%;object-fit:contain}
.lpv__audio,.lpv__none{display:grid;gap:1rem;justify-items:center;padding:2rem;text-align:center;color:var(--k-muted)}
.lpv__audio .lcov__art,.lpv__none .lcov__art{position:relative;width:140px;height:180px;border-radius:14px}
.lpv__none img{max-width:220px;border-radius:12px}
@media (max-width:640px){.upl{padding:0;place-items:end stretch}.upl__card{border-radius:22px 22px 0 0;max-height:92dvh}.lpv__card{height:92dvh}.upl__head{flex-wrap:wrap}}
@media (prefers-reduced-motion:reduce){.upl,.upl__card,.upf,.lcov{transition:none}.lcard--skel .lcov,.upf__spin{animation:none}}

/* never allow sideways panning on phones (off-canvas menus live outside the viewport) */
html{overflow-x:clip}

/* compact header call to action on phones and tablets */
.nav__cta-short{display:none}
@media (max-width:959px){.nav .nav__cta{display:inline-flex;padding:.55rem .9rem;font-size:.84rem;gap:.35rem;min-height:40px}.nav__cta-long{display:none}.nav__cta-short{display:inline}.nav .nav__cta svg{width:14px;height:14px}}
@media (max-width:370px){.nav .nav__cta{display:none}}

/* ---------- feed announcements ---------- */
.feed__announce{margin-bottom:1.4rem;border-radius:var(--k-radius);background:var(--k-panel);border:1px solid var(--k-line);box-shadow:var(--k-shadow);overflow:hidden}
.ann__head{display:flex;align-items:center;gap:.6rem;padding:.9rem 1.1rem;border-bottom:1px solid var(--k-line);background:linear-gradient(90deg,color-mix(in srgb,var(--k-accent) 10%,var(--k-panel)),var(--k-panel))}
.ann__head h2{font-size:1.1rem;color:var(--k-head);margin:0;letter-spacing:-.01em}
.ann__ico{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--k-accent);color:var(--k-on-accent);flex:none;animation:ann-pulse 2.8s ease-in-out infinite}
.ann__ico svg{width:17px;height:17px}
@keyframes ann-pulse{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--k-accent) 40%,transparent)}50%{box-shadow:0 0 0 7px transparent}}
.ann__add{margin-left:auto;cursor:pointer}
.ann__list{display:grid}
.ann{display:grid;grid-template-columns:1fr auto;gap:.6rem 1rem;align-items:start;padding:1rem 1.1rem;border-top:1px solid var(--k-line)}
.ann:first-child{border-top:0}
.ann.is-pinned{background:color-mix(in srgb,var(--k-accent) 5%,var(--k-panel))}
.ann.is-off{opacity:.55}
.ann__body{display:grid;gap:.35rem;min-width:0}
.ann__body b{font-family:var(--font-display);font-size:1.05rem;color:var(--k-head);line-height:1.25}
.ann__text{color:var(--k-muted);font-size:.93rem;line-height:1.55}
.ann__text p{margin:0 0 .4rem}
.ann__link{display:inline-flex;align-items:center;gap:.3rem;font-weight:600;color:var(--k-accent);font-size:.9rem;justify-self:start}
.ann__link svg{width:15px;height:15px}
.ann__meta{font-size:.75rem;color:var(--k-faint)}
.ann__acts{display:flex;gap:.35rem;flex-wrap:wrap;justify-content:flex-end}
.ann__acts .pill{cursor:pointer}
.ann__empty{padding:1rem 1.1rem;color:var(--k-muted);font-size:.92rem;margin:0}
.ann--form{grid-template-columns:1fr;gap:.8rem;background:var(--k-soft)}
.ann__row{display:grid;gap:.8rem}
@media (min-width:640px){.ann__row{grid-template-columns:1fr 1fr;align-items:end}}
.ann__check{display:flex;gap:.5rem;align-items:center;font-size:.9rem;font-weight:600;color:var(--k-head);padding-bottom:.6rem}
.ann__check input{accent-color:var(--k-accent);width:18px;height:18px}
@media (max-width:560px){.ann{grid-template-columns:1fr}.ann__acts{justify-content:flex-start}}
@media (prefers-reduced-motion:reduce){.ann__ico{animation:none}}

/* account centre: connected apps (Mazar) */
.acct__app{display:flex;align-items:center;gap:.8rem}
.acct__app > div{display:grid;line-height:1.3}
.acct__app-status{font-size:.88rem;color:var(--k-muted)}
.acct__app-ico{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;flex:none;color:#E8C170;background:radial-gradient(circle at 50% 35%,#2A2416,#050505)}
.acct__app-ico svg{width:30px;height:30px}
.acct__app-list:empty{display:none}
.acct__connect{grid-column:1/-1;margin-bottom:1rem;padding:1rem 1.2rem;border-radius:var(--k-radius);background:var(--k-soft);border:1px solid var(--k-line);color:var(--k-ink)}

/* ---------- "Are you sure?" (core.js sure()): replaces the browser's confirm on every site. Sits above every other
   layer: the Upper Room dialogs (110), Mazar Prime full screen (200). Card on desktop, bottom sheet on phones. ---------- */
.sure{position:fixed;inset:0;z-index:250;display:grid;place-items:center;padding:1rem;background:rgba(8,6,40,.5);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:0;transition:opacity .22s ease;overscroll-behavior:contain}
.sure.is-in{opacity:1}
.sure__card{position:relative;width:min(440px,100%);max-height:calc(100dvh - 2rem);overflow:auto;display:grid;grid-template-columns:auto minmax(0,1fr);gap:.2rem 1rem;align-items:start;padding:1.4rem 1.4rem 1.2rem;background:var(--k-panel);color:var(--k-ink);border:1px solid var(--k-line);border-radius:22px;box-shadow:0 40px 100px -30px rgba(0,0,0,.55);transform:translateY(14px) scale(.97);transition:transform .42s cubic-bezier(.16,1,.3,1);outline:none;text-align:left}
.sure.is-in .sure__card{transform:none}
.sure__ico{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;flex:none;background:color-mix(in srgb,var(--k-accent) 14%,transparent);color:var(--k-accent)}
.sure__ico svg{width:22px;height:22px}
.sure--danger .sure__ico{background:rgba(208,69,42,.14);color:#D0452A}
.sure__text{display:grid;gap:.4rem;padding-top:.45rem}
.sure__title{margin:0;font-family:var(--font-display);font-size:1.18rem;font-weight:650;line-height:1.25;letter-spacing:-.01em;text-transform:none;color:var(--k-head);overflow-wrap:anywhere;font-variation-settings:normal}
.sure__title::after{content:none;display:none}
.sure[data-site="koinonia"] .sure__title{font-family:var(--font-body);font-weight:700}
.sure__body{margin:0;font-size:.93rem;line-height:1.55;color:var(--k-muted)}
.sure__btns{grid-column:1/-1;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.6rem;margin-top:1.1rem}
.sure .sure__btns .btn{justify-content:center;padding:.72rem 1.2rem;font-size:.92rem;cursor:pointer}
.sure .sure__btns .btn:disabled{opacity:.7;cursor:default}
.sure--danger .sure__btns .sure__ok{background:#B8321A;color:#fff;box-shadow:0 12px 28px -14px rgba(184,50,26,.75)}
.sure--danger .sure__btns .sure__ok:hover{background:#9C2A15;color:#fff}
/* opened from Mazar Prime: its own night and gold, legible over the Prime workspace in any site theme */
.sure--prime{background:rgba(0,0,0,.62)}
.sure--prime .sure__card{background:linear-gradient(180deg,#1C1912,#0A0907);color:#F1EBDD;border-color:rgba(232,193,112,.24);box-shadow:0 40px 100px -30px rgba(0,0,0,.95),inset 0 1px 0 rgba(255,255,255,.06)}
.sure--prime .sure__title{color:#FFF3D6}
.sure--prime .sure__body{color:#BDB5A4}
.sure--prime .sure__ico{background:rgba(232,193,112,.12);color:#E8C170}
.sure--prime.sure--danger .sure__ico{background:rgba(240,138,112,.13);color:#F08A70}
.sure--prime .sure__btns .sure__no{background:transparent;color:#F1EBDD;box-shadow:inset 0 0 0 1.5px rgba(232,193,112,.42)}
.sure--prime .sure__btns .sure__no:hover{background:rgba(232,193,112,.1);color:#FFF3D6}
.sure--prime .sure__btns .sure__ok{background:linear-gradient(180deg,#F6E3B0,#E8C170);color:#16110A;box-shadow:none}
.sure--prime .sure__btns .sure__ok:hover{background:linear-gradient(180deg,#FFF0C8,#F0CF85);color:#16110A}
.sure--prime.sure--danger .sure__btns .sure__ok{background:#B8321A;color:#fff}
.sure--prime.sure--danger .sure__btns .sure__ok:hover{background:#CC3B20;color:#fff}
.sure--prime :focus-visible{outline-color:#E8C170}
@media (max-width:640px){
  .sure{padding:0;place-items:end stretch}
  .sure__card{width:100%;max-height:92dvh;border-radius:22px 22px 0 0;border-width:1px 0 0;padding:1.3rem 1.2rem calc(1.1rem + env(safe-area-inset-bottom,0px));transform:translateY(100%)}
  .sure__btns{flex-direction:column-reverse;margin-top:1rem}
  .sure .sure__btns .btn{width:100%;padding:.9rem 1.2rem;font-size:1rem}
}
@media (prefers-reduced-motion:reduce){.sure,.sure__card{transition:none}.sure__card{transform:none}}

/* ---- page editor view (?edit=1, Master Administrator only): outlines, the key badge and the bar ---- */
.pe-on [data-edit]{outline:1px dashed rgba(241,90,41,.6);outline-offset:2px;cursor:copy}
.pe-on [data-edit].pe-cur{outline:2px solid #F15A29;outline-offset:2px}
.pe-on section[data-edit]{outline-color:rgba(120,120,160,.45);outline-offset:-4px}
.pe-on section[data-edit].pe-cur{outline:2px solid #3B3BD6;outline-offset:-4px}
.pe-on section.pe-hidden{outline:3px dashed #E0492C;outline-offset:-8px}
.pe-on section.pe-hidden>*{opacity:.35;filter:grayscale(1)}
.pe-bar{position:fixed;left:50%;top:.6rem;transform:translateX(-50%);z-index:2147483000;display:flex;align-items:center;gap:.7rem;max-width:calc(100vw - 1.2rem);padding:.4rem .45rem .4rem 1rem;border-radius:999px;background:#16110A;color:#E9E2D0;font:600 .82rem/1.3 system-ui,-apple-system,"Segoe UI",sans-serif;box-shadow:0 18px 40px -18px rgba(0,0,0,.75),0 0 0 1px rgba(232,193,112,.25)}
.pe-bar b{color:#E8C170;letter-spacing:.03em;white-space:nowrap}
.pe-bar__t{font-weight:500;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pe-bar__pick,.pe-bar__x{flex:none;padding:.42rem .85rem;border:0;border-radius:999px;background:rgba(255,255,255,.1);color:#fff;font:inherit;text-decoration:none;cursor:pointer}
.pe-bar__pick[aria-pressed="true"]{background:#E8C170;color:#16110A}
.pe-bar__pick:focus-visible,.pe-bar__x:focus-visible{outline:2px solid #E8C170;outline-offset:2px}
.pe-badge{position:fixed;z-index:2147483001;pointer-events:none;max-width:min(92vw,560px);padding:.22rem .5rem;border-radius:6px;background:#F15A29;color:#fff;font:600 .72rem/1.35 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:0 6px 16px -8px rgba(0,0,0,.6)}
@media (max-width:640px){.pe-bar{top:auto;bottom:.6rem;left:.6rem;transform:none}.pe-bar__t{display:none}}

/* ---- Mazar Prime: a photo attached for the page editor ---- */
.mzp .mzp__form{flex-wrap:wrap}
.mzp__atts{flex:1 0 100%;display:flex;flex-wrap:wrap;gap:.4rem;padding:.25rem 0 .1rem}
.mzp__attach{flex:none;width:38px;height:40px;margin-left:-.55rem;display:grid;place-items:center;border:0;border-radius:50%;background:none;color:var(--mz-mute,#B9B0A0);cursor:pointer;transition:color .25s,background .25s}
.mzp__attach:hover{color:var(--mz-light,#FFF7DC);background:rgba(255,255,255,.08)}
.mzp__attach svg{width:19px;height:19px}
.mzp.is-busy .mzp__attach{opacity:.5;pointer-events:none}
.mzp__att{display:inline-flex;align-items:center;gap:.55rem;max-width:min(100%,360px);padding:.3rem .35rem;border-radius:14px;background:rgba(255,255,255,.07);border:1px solid rgba(235,200,114,.22);color:var(--mz-light,#FFF7DC);font-size:.78rem}
.mzp__att img{width:40px;height:40px;flex:none;border-radius:10px;object-fit:cover}
.mzp__att-t{display:grid;min-width:0;gap:.05rem}
.mzp__att-t b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mzp__att-t small{color:var(--mz-dim,#9C927F);font-size:.72rem}
.mzp__att.is-up img{opacity:.55;animation:mzpAttUp 1.1s ease-in-out infinite}
.mzp__att.is-err{border-color:rgba(232,90,60,.6)}
.mzp__att.is-err small{color:#F3A48F}
.mzp__att-x{flex:none;width:24px;height:24px;display:grid;place-items:center;border:0;border-radius:50%;background:none;color:var(--mz-dim,#9C927F);cursor:pointer}
.mzp__att-x:hover{color:#fff;background:rgba(255,255,255,.1)}
.mzp__att-x svg{width:12px;height:12px}
.mzp__sent{display:block;width:120px;height:120px;margin-top:.5rem;border-radius:14px;object-fit:cover;border:1px solid rgba(235,200,114,.25)}

/* ---- Mazar Prime plan card: the exact before and after of a page edit ---- */
.mzp__notice{margin:0;padding:.55rem 1rem;border-bottom:1px solid rgba(255,255,255,.07);background:rgba(232,90,60,.14);color:#FFC9B8;font-size:.8rem;font-weight:600}
.mzp__diff{grid-column:2/-1;display:grid;gap:.35rem;margin-top:.15rem;padding:.55rem .65rem;border-radius:12px;background:rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.06);font-size:.8rem;line-height:1.45}
.mzp__dr{display:grid;grid-template-columns:5.6rem minmax(0,1fr);gap:.6rem;align-items:start}
.mzp__dk{padding-top:.1rem;font-size:.66rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--mz-dim,#9C927F)}
.mzp__dr.is-chg .mzp__dk{color:var(--mz-glow,#EBC872)}
.mzp__dv{min-width:0;display:flex;flex-wrap:wrap;align-items:center;gap:.35rem .5rem;color:var(--mz-ink,#EDE6D6)}
.mzp__dt{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}
.mzp__dt del{background:rgba(255,120,110,.22);color:#FFB4AC;text-decoration:line-through;text-decoration-thickness:1px;border-radius:3px}
.mzp__dt ins{background:rgba(123,216,143,.22);color:#B9F2C6;text-decoration:none;border-radius:3px}
.mzp__lk{display:inline-flex;flex-wrap:wrap;align-items:center;gap:.3rem}
.mzp__href{display:inline-flex;flex-wrap:wrap;align-items:baseline;gap:.35rem;max-width:100%;padding:.12rem .45rem;border-radius:8px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1)}
.mzp__href code{font:500 .76rem/1.4 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#F4EEDF;overflow-wrap:anywhere}
.mzp__href em{font-style:normal;font-size:.7rem;color:var(--mz-dim,#9C927F)}
.mzp__href.is-off{background:rgba(220,60,45,.18);border-color:rgba(255,110,95,.6)}
.mzp__href.is-off em{color:#FF8A7A;font-weight:700}
.mzp__ph{display:flex;align-items:flex-start;gap:.6rem;margin:0;min-width:0}
.mzp__ph img,.mzp__ph-none{width:96px;height:64px;flex:none;border-radius:8px;object-fit:cover;background:rgba(255,255,255,.06)}
.mzp__ph-none{display:grid;place-items:center;font-size:.66rem;color:var(--mz-dim,#9C927F)}
.mzp__ph figcaption{display:grid;gap:.15rem;min-width:0}
.mzp__ph code{font:500 .72rem/1.35 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:var(--mz-dim,#9C927F);overflow-wrap:anywhere}
.mzp__vis{padding:.12rem .55rem;border-radius:999px;font-size:.72rem;font-weight:700}
.mzp__vis.is-on{background:rgba(123,216,143,.2);color:#9FE7B2}
.mzp__vis.is-off{background:rgba(255,120,110,.2);color:#FFB4AC}
.mzp__to{color:var(--mz-dim,#9C927F)}
@media (max-width:640px){.mzp__dr{grid-template-columns:minmax(0,1fr);gap:.15rem}}
@keyframes mzpAttUp{50%{opacity:.95}}
@media (prefers-reduced-motion:reduce){.mzp__att.is-up img{animation:none}}
/* Unified feed editing, including migrated teaching drafts. */
.feed-editor{width:min(720px,calc(100% - 32px));max-height:90vh;overflow:auto;border:1px solid #9aa9bb;border-radius:18px;background:#fff;color:#0a203d;padding:clamp(20px,4vw,40px)}
.feed-editor::backdrop{background:#06172acc;backdrop-filter:blur(4px)}
.feed-editor form{display:grid;gap:1.2rem}.feed-editor .field{display:grid;gap:.4rem}.feed-editor input,.feed-editor textarea{width:100%;padding:.8rem;border:1px solid #9aa9bb;border-radius:8px;font:inherit;background:#fff;color:#0a203d}.feed-editor .row{flex-wrap:wrap}

.feed-editor h2{color:#0a203d}

/* ---- guided tour for new accounts (Tour in core.js): a spotlight on one thing at a time, and a card that says what it is.
   Takes each site's own colours through the --k-* tokens, like the "Are you sure?" dialog. On phones the card docks at the bottom. */
.tour{position:fixed;inset:0;z-index:2147483000;opacity:0;transition:opacity .2s ease}
.tour.is-in{opacity:1}
.tour.is-center{background:rgba(8,6,40,.55);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.tour__hole{position:fixed;border-radius:14px;box-shadow:0 0 0 9999px rgba(8,6,40,.55),0 0 0 2px var(--k-accent);pointer-events:none;transition:top .28s ease,left .28s ease,width .28s ease,height .28s ease}
.tour__card{position:fixed;width:min(360px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto;padding:1.15rem 1.2rem 1rem;background:var(--k-panel);color:var(--k-ink);border:1px solid var(--k-line);border-radius:18px;box-shadow:0 30px 80px -24px rgba(0,0,0,.55)}
.tour.is-center .tour__card{top:50%;left:50%;transform:translate(-50%,-50%);width:min(420px,calc(100vw - 24px))}
.tour.is-sheet .tour__card{top:auto;left:12px;right:12px;bottom:12px;width:auto}
.tour__count{margin:0 0 .3rem;font-size:.72rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--k-accent)}
.tour__count:empty{display:none}
.tour__title{margin:0 0 .4rem;font-family:var(--font-display);font-size:1.12rem;font-weight:650;line-height:1.25;letter-spacing:-.01em;text-transform:none;color:var(--k-head);font-variation-settings:normal}
.tour__title::after{content:none;display:none}
.tour[data-site="koinonia"] .tour__title{font-family:var(--font-body);font-weight:700}
.tour__body{font-size:.92rem;line-height:1.55;color:var(--k-muted)}
.tour__body p{margin:0 0 .5rem}
.tour__body p:last-child{margin:0}
.tour__body b{color:var(--k-ink)}
.tour__body .tour__role{display:grid;gap:.2rem;margin:.1rem 0 0;padding:.6rem .75rem;border:1px solid var(--k-line);border-radius:12px;background:color-mix(in srgb,var(--k-accent) 6%,transparent);color:var(--k-ink)}
.tour__role b{font-size:.7rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--k-accent)}
.tour__btns{display:flex;align-items:center;gap:.5rem;margin-top:1rem}
.tour__gap{flex:1}
.tour .tour__btns .btn{padding:.6rem 1.05rem;font-size:.88rem;justify-content:center;cursor:pointer}
.tour__skip,.tour__off{background:none;border:0;padding:.4rem .15rem;font:inherit;font-size:.86rem;color:var(--k-muted);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.tour__skip:hover,.tour__off:hover{color:var(--k-ink)}
.tour__off{display:block;margin:.55rem 0 0;font-size:.78rem}
.tour button:focus-visible{outline:2px solid var(--k-accent);outline-offset:2px}
@media (prefers-reduced-motion:reduce){.tour,.tour__hole{transition:none}}
