/* The Sisterhood: portal-only components on top of site.css (blueprint 04 rule zero).
   Tokens come from site.css; no new hex values except the two danger reds the site
   already uses for form errors. */

/* quick exit (blueprint 08 §1): lives in the header bar, top right, next to the profile seat.
   44px target, readable over footage and over the solid header. Phones use the sticky bar. */
.hdr .quick-exit{display:inline-flex;align-items:center;gap:7px;min-height:40px;padding:8px 14px;margin-left:10px;border-radius:var(--r-pill);
  background:rgba(255,255,255,.14);color:#FFF1EA;border:1.5px solid rgba(255,241,234,.55);
  font-weight:600;font-size:.86rem;text-decoration:none;letter-spacing:.01em;white-space:nowrap;flex:none}
.hdr[data-solid] .quick-exit,.hdr-plain .quick-exit{background:var(--ivory,#FCF8F3);color:var(--accent-deep);border-color:var(--accent-deep)}
.hdr .quick-exit:hover,.hdr .quick-exit:focus-visible{background:var(--accent-deep);color:var(--text-on-dark);border-color:var(--accent-deep);outline-offset:3px}
.hdr .quick-exit span{font-size:.85em}
.hdr .quick-exit .qe-ico{width:18px;height:18px;color:#FF5A5A;flex:none}
.hdr[data-solid] .quick-exit .qe-ico,.hdr-plain .quick-exit .qe-ico{color:#C8102E}
.hdr .quick-exit:hover .qe-ico,.hdr .quick-exit:focus-visible .qe-ico{color:#FFD6D6}
@media (max-width:1180px){.hdr .quick-exit{padding:8px 10px}.hdr .quick-exit span{display:none}}
/* on phones the exit stays in the header as a red-marked pill beside the menu button */
@media (max-width:900px){.hdr .quick-exit{display:inline-flex;margin-left:auto;margin-right:10px;padding:8px 10px;min-height:40px}.hdr .quick-exit span{display:none}.hdr .hdr-cta.hdr-me{display:none}}
@media (max-width:900px){.hdr .burger{margin-left:0}}

/* sticky bar variant */
.sticky-portal .s-exit{background:var(--accent-deep);color:var(--text-on-dark);font-weight:600}

/* header, signed in */
.hdr-me{gap:10px;padding-left:8px}
.avi{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;font-size:.78rem;font-weight:700;letter-spacing:.02em;
  color:var(--text-on-dark);background:linear-gradient(135deg,var(--rose-400,#B5847A),var(--wine-700,#6B2230))}
.inline-form{display:inline;margin:0}
.inline-form .btn{cursor:pointer;font:inherit}
.drawer-foot .inline-form{display:block}
.drawer-foot .inline-form .btn{width:100%}

/* layout helpers that replace inline styles (portal pages ship a CSP) */
.actions{display:flex;gap:14px;flex-wrap:wrap;align-items:center;margin-top:18px}
.actions-center{justify-content:center;margin-top:32px}
.lede-center{margin-inline:auto}
.phero-vid{width:100%;height:100%;object-fit:cover}
.phero-less{padding-top:calc(var(--hdr-h,76px) + var(--sect))}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}
.hero-actions .btn svg{margin-right:6px}
.muted{color:var(--text-muted)}
.quiet{margin-top:18px;font-size:.92rem;color:var(--text-muted)}
.quiet a,.textbtn{color:var(--accent-deep);text-decoration:underline;text-underline-offset:3px;background:none;border:0;border-radius:0;box-shadow:none;padding:0;min-height:0;font:inherit;font-size:.9rem;cursor:pointer;display:inline}
.textbtn:hover{color:var(--accent)}
/* Boxes never touch. Any card, notice or form that follows another gets air. */
.portal :is(.card+.card,.card+.notice,.notice+.card,.notice+.notice,.form+.notice,.actions+.notice,.prose+.notice,.card+.form,.notice+.form,.grid2+.notice,.tenets+.notice,.stack+.notice,.actions+.card,.notice+.actions,.card+.actions){margin-top:28px}
.portal :is(.tenets,.grid2,.doors,.stack,.tiles,.split,.rooms,.shots,.cats,.latest-stack,.rooms-grid)>:is(.card+.card,.notice+.notice,.card+.notice,.notice+.card,.form+.notice,*+*){margin-top:0}
/* Boxes in one grid are one size: rows stretch to the tallest card, and cards fill their cell. */
.portal :is(.tenets,.grid2,.tiles,.cats,.rooms-grid,.doors){grid-auto-rows:1fr}
.portal :is(.tenets,.grid2,.tiles,.cats,.rooms-grid,.doors)>.card{height:100%}
.portal :is(.res-cat,.latest-stack,.cats,.rooms-grid,.tenets,.grid2,.stack,.split,.doors,.tiles,.card,.notice)+:is(.card,.notice,.form,form,.actions,.res-cat,details){margin-top:28px}
.check{display:flex;gap:10px;align-items:flex-start;font-size:.95rem;color:var(--text-soft)}
.check input{margin-top:4px;width:18px;height:18px;accent-color:var(--accent-deep)}
.prose-p{color:var(--text-soft);margin:0 0 18px}

/* chips */
.chip{display:inline-block;padding:3px 10px;border-radius:var(--r-pill);font-size:.74rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;
  background:var(--petal-100,#FAECE8);color:var(--espresso-800);border:1px solid var(--border-gold);vertical-align:middle}
.chip-open{background:var(--gold-300,#E3C98A);border-color:var(--gold-500,#C59D56)}
.rooms .tenet{position:relative;padding-top:46px}
.rooms .tenet .chip{position:absolute;top:14px;left:16px}

/* doors */
.doors{display:grid;gap:clamp(14px,2vw,22px);grid-template-columns:1fr;margin-top:clamp(24px,3vw,38px)}
@media (min-width:760px){.doors{grid-template-columns:1fr 1fr}}
.door h3{margin-bottom:8px}
.door .btn{margin-top:auto;align-self:flex-start}
.doors-pick{margin-top:14px}
@media (min-width:760px){.doors-pick{grid-template-columns:repeat(3,1fr)}}
.door-pick{display:flex;gap:12px;align-items:flex-start;padding:16px 18px;border:1px solid var(--border-soft);border-radius:16px;background:#FFFFFF;cursor:pointer;
  transition:border-color var(--t-base) var(--ease-out),box-shadow var(--t-base) var(--ease-out)}
.door-pick input{margin-top:4px;width:18px;height:18px;accent-color:var(--accent-deep);flex:none}
.door-pick span{display:grid;gap:4px}
.door-pick strong{color:var(--espresso-800);font-size:1.05rem}
.door-pick small{color:var(--text-muted);font-size:.86rem;line-height:1.5}
.door-pick:has(input:checked){border-color:var(--gold-500,#C59D56);box-shadow:0 0 0 4px rgba(197,157,86,.18);background:var(--petal-100,#FAECE8)}
.door-pick:has(input:focus-visible){outline:2px solid var(--gold-500,#C59D56);outline-offset:2px}
.tax{margin-top:clamp(20px,3vw,32px);max-width:760px}

/* steps on the join form */
.portal-form{margin-top:8px}
.step{border:1px solid var(--border-soft);border-radius:var(--r-card);padding:clamp(18px,3vw,28px);margin:0;min-width:0;background:#FFFFFF;display:grid;gap:16px}
.step legend{font-family:var(--font-display);font-size:1.45rem;font-weight:600;color:var(--espresso-800);padding:0 8px;display:flex;align-items:center;gap:10px}
.step-n{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;font-size:1rem;background:var(--petal-100,#FAECE8);border:1px solid var(--border-gold)}
.step[hidden]{display:none}
.amounts{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.amt{position:relative;display:block}
.amt input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.amt span{display:grid;place-items:center;min-height:52px;border:1px solid var(--border-soft);border-radius:14px;font-family:var(--font-display);font-size:1.35rem;font-weight:600;color:var(--espresso-800);background:#FFFFFF;
  transition:border-color var(--t-base) var(--ease-out),background var(--t-base) var(--ease-out)}
.amt-custom span{font-family:var(--font-text);font-size:.95rem;font-weight:600}
.amt input:checked + span{border-color:var(--gold-500,#C59D56);background:var(--petal-100,#FAECE8);box-shadow:0 0 0 4px rgba(197,157,86,.18)}
.amt input:focus-visible + span{outline:2px solid var(--gold-500,#C59D56);outline-offset:2px}
.field-custom[hidden]{display:none}
.err:empty{display:none}
.formstatus:empty{display:none}
.formstatus.is-error{color:#8C2B26}
.formstatus.is-ok{color:var(--accent-deep)}
.portal-form.is-busy .btn{opacity:.6;pointer-events:none}

/* cards on the dashboard / profile */
.card h3{margin-bottom:10px}
.card .actions{margin-top:14px}
.checklist{margin:0;padding-left:22px;display:grid;gap:10px;color:var(--text-soft)}
.checklist li a{color:var(--accent-deep);font-weight:600}
.checklist .hint{display:block;font-size:.86rem;color:var(--text-muted)}
.danger summary{cursor:pointer;font-family:var(--font-display);font-size:1.3rem;font-weight:600;color:var(--espresso-800)}
.danger[open] summary{margin-bottom:12px}
.btn-danger,.btn.btn-danger,.s-dark .btn.btn-danger{background:#8C2B26;border-color:#8C2B26;color:#FFF3EC}
.btn-danger:hover{background:#A3352F;color:#FFFFFF}

/* the Sister Fund */
.fund{padding:clamp(20px,3vw,30px);border-radius:var(--r-card);background:var(--petal-100,#FAECE8);border:1px solid var(--border-gold);box-shadow:var(--shadow-2)}
.fund .fund-label{font-size:.8rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);margin:0 0 6px}
.fund .fund-total,.card.fund .fund-total{font-family:var(--font-display);font-size:clamp(2.6rem,1.8rem + 3vw,4.2rem);font-weight:600;line-height:1;color:var(--espresso-800);margin:0 0 14px}
.fund-bar{height:10px;border-radius:var(--r-pill);background:#FFFFFF;border:1px solid var(--border-gold);overflow:hidden}
.fund-fill{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,var(--gold-500,#C59D56),var(--gold-300,#E3C98A));transition:width .9s var(--ease-out)}
.fund .fund-goal{margin:8px 0 0;font-size:.9rem;color:var(--text-muted)}
/* the Sister Fund panel on /give: photo on top, the number and the bar beneath, one tall card */
.fund-panel{padding:0;overflow:hidden;display:flex;flex-direction:column}
.fund-art{display:block;aspect-ratio:4/3;overflow:hidden}
.fund-art img{width:100%;height:100%;object-fit:cover;display:block}
.fund-body{padding:clamp(22px,3vw,34px);display:flex;flex-direction:column;gap:6px}
.fund-body .fund-purpose{font-size:1.05rem;color:var(--espresso-800);margin:14px 0 0}
.fund-body .fund-note{font-size:.92rem;color:var(--text-soft);margin:6px 0 0}
.fund-body .actions{margin-top:18px}
.split.split-top{align-items:start}

/* safety page */
.hotlines{list-style:none;padding:0;margin:18px 0 26px;display:grid;gap:12px}
.hotlines li{padding:14px 18px;border-radius:14px;background:#FFFFFF;border:1px solid var(--border-soft);color:var(--text-soft)}
.hotlines a{color:var(--accent-deep);font-weight:600;white-space:nowrap}
.crisis{margin-top:22px}

/* reset form */
.reset{margin-top:26px;padding:clamp(18px,3vw,26px);border-radius:var(--r-card);background:var(--petal-100,#FAECE8);border:1px solid var(--border-gold)}
.reset[hidden]{display:none}
.reset h3{margin:0 0 6px}

@media (prefers-reduced-motion:reduce){.fund-fill{transition:none}}

/* ---- the rooms ---------------------------------------------------------- */
.nav-member a{font-size:.92rem}
@media (min-width:901px){.hdr-in{position:relative}.nav.nav-member{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);margin:0}.hdr .hdr-me{margin-left:auto}}
@media (min-width:901px) and (max-width:1139px){.hdr .nav.nav-member{position:absolute}}
.split-wide{grid-template-columns:1fr}
@media (min-width:900px){.split-wide{grid-template-columns:1.4fr 1fr;align-items:start}}
.rooms-grid{display:grid;gap:14px;grid-template-columns:repeat(2,1fr);grid-auto-rows:1fr}
@media (min-width:700px){.rooms-grid{grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.8vw,22px)}}
.rooms-grid .room{padding:20px;gap:6px;display:flex;flex-direction:column}
.rooms-grid .room h3{font-size:1.15rem;margin:0}
.rooms-grid .room p{font-size:.86rem;color:var(--text-muted);margin:0}
.rooms-grid .room .room-open{margin-top:auto;padding-top:12px;display:inline-flex;align-items:center;gap:6px;font-size:.86rem;font-weight:700;color:var(--accent-deep)}
.rooms-grid .room .room-open svg{width:14px;height:14px}
.rooms-grid .room:hover .room-open{color:var(--accent)}
.cats{display:grid;gap:16px}
.latest-stack{display:grid;gap:16px}
.cat{flex-direction:row;align-items:stretch;gap:18px;padding:16px;min-height:150px}
@media (min-width:700px){.cat,.latest-stack .postcard{height:186px;min-height:0}}
.cat-art{flex:none;width:112px;aspect-ratio:1;border-radius:14px;overflow:hidden;background:var(--petal-100)}
.cat-art img{width:100%;height:100%;object-fit:cover;display:block;transition:transform var(--t-base) var(--ease-out)}
.cat:hover .cat-art img{transform:scale(1.05)}
.cat-body{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}
.cat h3{margin:0;font-size:1.3rem}
.cat .meta{margin-top:auto}
.cat .room-open{display:inline-flex;align-items:center;gap:6px;font-size:.86rem;font-weight:700;color:var(--accent-deep);margin-top:6px}
.cat .room-open svg{width:14px;height:14px}
.cat:hover .room-open{color:var(--accent)}
@media (max-width:480px){.cat-art{width:84px;border-radius:12px}.cat{gap:14px;padding:14px;min-height:0}}
.latest-stack .postcard{min-height:150px;justify-content:center;gap:6px}
.latest-stack .postcard>p:not(.meta){line-height:1.5;font-size:.95rem}
.latest-stack .postcard>p:not(.meta){display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.latest-stack .postcard h3{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.meta{font-size:.84rem;color:var(--text-muted);margin:6px 0 0}
.eyebrow{font-size:.78rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);margin:0 0 8px}
.postcard{gap:6px}
.postcard h3{margin:0;font-size:1.25rem}
.postcard p{margin:0}
.is-pending{opacity:.75;border-style:dashed}
.back{margin-bottom:14px;display:inline-flex}
.back svg{transform:rotate(180deg)}
.post h1{font-size:clamp(1.8rem,1.3rem + 1.6vw,2.6rem)}
.ugc{margin-top:14px;overflow-wrap:anywhere}
.ugc p:last-child{margin-bottom:0}
.ugc blockquote{margin:14px 0;padding:10px 18px;border-left:3px solid var(--gold-500);background:var(--petal-100);border-radius:0 12px 12px 0;font-family:var(--font-display);font-size:1.15rem}
.ugc ul,.ugc ol{padding-left:22px}
.ugc a{color:var(--accent-deep)}
.h-comments{font-size:1.4rem;margin:32px 0 14px}
.comments .comment{gap:2px}
.react{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:16px}
.react-btn{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:6px 12px;border-radius:var(--r-pill);border:1px solid var(--border-soft);background:#FFFFFF;font:inherit;font-size:.86rem;font-weight:600;color:var(--text-soft);cursor:pointer;transition:border-color var(--t-base) var(--ease-out),background var(--t-base) var(--ease-out)}
.react-btn.is-on{border-color:var(--gold-500);background:var(--petal-100);color:var(--espresso-800)}
.react-ico{width:14px;height:14px;border-radius:50%;display:inline-block}
.react-heart{background:var(--rose-500)}
.react-praying{background:var(--gold-500)}
.react-strength{background:var(--wine-700)}
.react-n:empty{display:none}
.report{margin-left:auto;font-size:.82rem}
.rules ol{padding-left:20px;color:var(--text-soft);display:grid;gap:8px;font-size:.92rem}
.plain{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.plain li{color:var(--text-soft)}
.chip a,a.chip{text-decoration:none}
a.card,a.card:hover,a.card *,a.tenet,a.tenet *,a.tile,a.tile *{text-decoration:none}
a.card h3,a.tenet h3{color:var(--espresso-800)}
a.card p,a.tenet p{color:var(--text-soft)}
a.card:hover h3{color:var(--accent-deep)}
.filters{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0}
.res-cat{margin-top:34px}
.res h3{margin-bottom:6px}
/* every resource card lines up: title and description in a fixed-height head, the contact lines
   start at the same height across a row, and the checked stamp and flag sit at the bottom */
.res{display:flex;flex-direction:column}
.res-head{min-height:13.5rem}
.res-head h3{min-height:2.6em}
.res-lines{margin-top:0}
.res-foot{margin-top:auto;padding-top:14px}
.res-foot .flag{margin-top:8px}
@media (max-width:899px){.res-head{min-height:0}.res-head h3{min-height:0}}
.res-lines{list-style:none;padding:0;margin:10px 0 0;display:grid;gap:6px;font-size:.92rem;color:var(--text-soft)}
.res-lines li{display:flex;gap:8px;align-items:center}
.res-lines li>span{min-width:0}
.res-check{margin:12px 0 0;font-size:.8rem;color:var(--text-soft);display:flex;gap:6px;align-items:center}
.res-check.is-checked{color:var(--accent-deep);font-weight:600}
.res-check svg{width:14px;height:14px;flex:none}
.res-lines a{color:var(--accent-deep);font-weight:600;overflow-wrap:anywhere;word-break:break-word}
.res{min-width:0}
.res-emergency{border-color:var(--gold-500);background:var(--petal-100)}
.flag{font-size:.82rem;align-self:flex-start}
.crisis-strip{margin:26px 0 0;padding:14px 18px;border-radius:14px;background:var(--espresso-800);color:var(--text-on-dark);font-size:.9rem;line-height:1.7}
.crisis-strip a{color:#F1DFB0;font-weight:700;white-space:nowrap}
.storycard{gap:6px}
.notes{display:flex;flex-wrap:wrap;gap:6px;margin:0}
.notes-pick{border:0;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px}
.notes-pick legend{font-size:.9rem;font-weight:600;color:var(--espresso-800);margin-bottom:8px;width:100%}
.check-inline{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid var(--border-soft);border-radius:var(--r-pill);font-size:.86rem;color:var(--text-soft);background:#FFFFFF}
.check-inline input{accent-color:var(--accent-deep)}
.story-body{font-size:1.08rem;line-height:1.8}
.story h1{font-size:clamp(1.9rem,1.4rem + 1.8vw,2.8rem)}
/* learning */
.courses .course{align-items:flex-start}
.ring{--pct:0;width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--gold-500) calc(var(--pct) * 1%),var(--petal-200,#F5DEDA) 0);position:relative;flex:none}
.ring::before{content:"";position:absolute;inset:7px;border-radius:50%;background:#FFFFFF}
.ring span{position:relative;font-family:var(--font-display);font-weight:600;font-size:1rem;color:var(--espresso-800)}
.progress-card{display:flex;gap:16px;align-items:center;flex-direction:row}
.lesson-list{padding-left:20px;display:grid;gap:6px;color:var(--text-soft);font-size:.95rem}
.lesson-list li.is-done{color:var(--text-muted)}
.lesson-list li.is-done::marker{color:var(--gold-500)}
.lesson-list a{color:var(--espresso-800);text-decoration:none}
.lesson h1{font-size:clamp(1.9rem,1.4rem + 1.8vw,2.8rem)}
.lesson-body{font-size:1.06rem;line-height:1.8}
.lesson-body h2{margin-top:1.6em;font-size:1.5rem}
.reflection{margin-top:32px}
.lesson-done{margin-top:24px}
.certificate{text-align:center;padding:clamp(28px,5vw,56px);border:2px solid var(--gold-500);border-radius:var(--r-card);background:#FFFFFF;box-shadow:var(--shadow-2)}
.cert-eyebrow{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted)}
.certificate h1{font-size:clamp(2.2rem,1.6rem + 2.4vw,3.6rem);margin:8px 0}
.cert-line{color:var(--text-muted);margin:0}
.cert-course{font-family:var(--font-display);font-size:1.6rem;font-weight:600;color:var(--espresso-800);margin:8px 0}
.cert-date{color:var(--text-soft)}
.cert-verse{font-family:var(--font-display);font-size:1.1rem;margin-top:22px;color:var(--text-soft)}
/* tools */
.tool-split{align-items:start}
.tool-form h2{font-size:1.3rem;margin:14px 0 4px}
.money-in{display:flex;align-items:center;gap:6px;border:1px solid var(--border-soft);border-radius:14px;background:#FFFFFF;padding-left:12px}
.money-in span{color:var(--text-muted);font-weight:600}
.money-in input{border:0;background:transparent;flex:1;min-width:0;padding:12px 12px 12px 0;font:inherit;font-size:1.05rem}
.money-in input:focus{outline:0}
.field.money:focus-within .money-in{border-color:var(--gold-500);box-shadow:0 0 0 4px rgba(197,157,86,.18)}
.tool-side{position:sticky;top:calc(var(--hdr-h,76px) + 14px)}
.tool-result{padding:clamp(20px,3vw,30px);margin-bottom:14px}
.tool-result[hidden]{display:none}
.tool-result .fund-label{font-size:.8rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-on-dark-soft,#E9D4CC);margin:0 0 6px}
.tool-result .fund-total{font-family:var(--font-display);font-size:clamp(2.4rem,1.6rem + 2.4vw,3.6rem);font-weight:600;line-height:1;margin:0 0 12px;color:#FFF7F3}
.tool-line{color:var(--text-on-dark);margin:0 0 10px}
.tool-result details{margin-top:10px;color:var(--text-on-dark)}
.tool-result summary{cursor:pointer;font-weight:600}
.tool-table{width:100%;border-collapse:collapse;font-size:.9rem;margin-top:8px;color:var(--text-on-dark)}
.tool-table th{text-align:left;font-weight:400;padding:5px 0;border-bottom:1px solid rgba(255,255,255,.12)}
.tool-table td{text-align:right;padding:5px 0;border-bottom:1px solid rgba(255,255,255,.12);white-space:nowrap}
.tool-table td:not(:last-child):not(:only-child),.tool-table th{white-space:normal;overflow-wrap:anywhere}
.tool-table tr>td:nth-child(2):not(:last-child){text-align:left;padding-inline:8px}
.tool-result{min-width:0}
@media (max-width:600px){.tool-table{display:block;overflow-x:auto}.tool-table td{white-space:normal}}
.tool-table .is-total th,.tool-table .is-total td{font-weight:700}
.tool-table .is-short td{color:#F1DFB0}
.tool-table .is-likely th{color:#F1DFB0}
.what-changes{margin-top:16px}
.what-changes h3{font-size:1.05rem;color:#FFF7F3;margin-bottom:6px}
.what-changes ul{padding-left:18px;margin:0;color:var(--text-on-dark)}
.what-changes a{color:#F1DFB0}
.notice+.actions{margin-top:24px}
.tool-result a{color:#F1DFB0;text-decoration-color:rgba(241,223,176,.6)}
.tool-result a:hover{color:#FFF6DA}
.tool-result .notice{background:rgba(255,255,255,.08);border-color:rgba(241,223,176,.4);color:var(--text-on-dark)}
.tool-actions .hint{margin-top:8px}
.rows{display:grid;gap:10px}
.bill-row{display:grid;grid-template-columns:1.4fr 1fr 1fr auto;gap:8px;align-items:center}
.bill-row input,.bill-row select{min-width:0;padding:10px;border:1px solid var(--border-soft);border-radius:12px;font:inherit}
.bill-row input[name="balance"],.bill-row input[name="amount"],.bill-row input[name="minimum"],.bill-row input[name="apr"]{text-align:right}
.sources{margin-top:26px}
.sources summary{cursor:pointer;font-weight:600}
/* volunteer, events, walk, messages */
.need h3,.event h3,.match h3,.thread h3{margin-bottom:4px}
.hours{margin-top:14px;font-size:.9rem}
.boundaries{background:var(--petal-100);border-color:var(--border-gold)}
.msgs .msg{gap:2px}
.msgs .is-mine{background:var(--petal-100)}
.badges{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px}
.badge{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:var(--r-pill);background:var(--petal-100);border:1px solid var(--border-gold);font-size:.86rem;font-weight:600;color:var(--espresso-800)}
.badge.is-private{opacity:.7}
.badge-ico{font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;color:var(--gold-600,#A8823B)}
.notes-list li.is-new{font-weight:600;color:var(--espresso-800)}
.vis-field{position:relative}
.vis{font-size:.82rem;color:var(--text-muted);margin-top:4px}
.avi.big{width:56px;height:56px;font-size:1.1rem;margin-bottom:10px}
.socials-inline{display:flex;gap:10px;flex-wrap:wrap;margin:0}
.socials-inline .btn svg{width:16px;height:16px}
.notice a svg{width:14px;height:14px;vertical-align:-2px}
/* bylines: photo and name as one unit, everywhere a name appears */
.byline{display:inline-flex;align-items:center;gap:8px;vertical-align:middle}
.byline .avi{width:26px;height:26px;font-size:.7rem}
.byline .avi.big{width:44px;height:44px;font-size:.95rem;margin:0}
.avi-anon{background:var(--petal-100,#FAECE8);color:var(--accent-deep);display:inline-grid;place-items:center}
.avi-anon svg{width:60%;height:60%}
.office-table .byline .avi{width:30px;height:30px}
a.wholink{text-decoration:none}a.wholink .byline-name{text-decoration:underline;text-underline-offset:3px}
img.avi{object-fit:cover;object-position:center;display:inline-block;border:2px solid rgba(255,255,255,.7);box-shadow:0 1px 4px rgba(60,30,20,.18)}
img.avi.big{width:72px;height:72px}
.headshot-row{display:flex;gap:18px;align-items:flex-start}
.headshot-row .avi.big{width:96px;height:96px;font-size:1.6rem;flex:none;margin:0}
.headshot-pick{cursor:pointer;margin-top:8px}
.headshot-card .textbtn{margin-left:12px}
.sister{align-items:flex-start;gap:6px}
.profile-card h1{margin:0 0 6px}
.tags{display:flex;flex-wrap:wrap;gap:6px}
.office-card{background:var(--espresso-800);color:var(--text-on-dark);border-color:var(--espresso-800)}
.office-card h3,.office-card p{color:inherit}
.shout{background:var(--petal-100);border-color:var(--border-gold)}
/* insights bars */
.bars{display:grid;gap:8px;margin-top:10px}
.bar-row{display:grid;grid-template-columns:64px 1fr auto;gap:10px;align-items:center;font-size:.9rem}
.bar-label{color:var(--text-muted)}
.bar-track{position:relative;height:14px;border-radius:999px;background:var(--petal-100);overflow:hidden}
.bar-fill{position:absolute;inset:0 auto 0 0;border-radius:999px;background:linear-gradient(90deg,#F1DFB0,#C59D56)}
.bar-fill-2{background:rgba(255,255,255,.55)}
.bar-val{font-weight:600;white-space:nowrap}
.bar-val .hint{font-weight:400;margin-left:4px}
/* the Office */
.office-sect{padding-top:calc(var(--hdr-h,76px) + 24px)}
.office-shell{display:grid;gap:24px;grid-template-columns:1fr}
.office-shell>*{min-width:0}
.office-main .tiles,.office-main .grid2{min-width:0}
.office-main .card{min-width:0;overflow-wrap:anywhere}
@media (min-width:900px){.office-shell{grid-template-columns:200px 1fr;align-items:start}}
.office-rail{display:flex;flex-wrap:wrap;gap:6px;padding:12px;border-radius:16px;background:#FFFFFF;border:1px solid var(--border-soft)}
@media (min-width:900px){.office-rail{position:sticky;top:calc(var(--hdr-h,76px) + 14px);flex-direction:column;gap:2px}}
.office-rail .eyebrow{width:100%;margin:4px 6px 8px}
.office-rail a{padding:8px 12px;border-radius:10px;text-decoration:none;color:var(--text-soft);font-size:.92rem;font-weight:600}
.office-rail a[aria-current="page"]{background:var(--petal-100);color:var(--espresso-800)}
.office-main h1{font-size:clamp(1.7rem,1.3rem + 1.2vw,2.3rem);margin-bottom:18px}
.office-main h2{font-size:1.3rem;margin:28px 0 10px}
.office-main .card{margin-bottom:14px}
.office-main .card h3{margin-bottom:8px}
.tiles{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));margin-bottom:18px}
.tile{padding:16px;gap:2px;text-decoration:none}
.tile .num{font-family:var(--font-display);font-size:2rem;font-weight:600;line-height:1;margin:0;color:var(--espresso-800)}
.tile p{font-size:.86rem;color:var(--text-muted);margin:0}
.tablewrap{overflow-x:auto;border:1px solid var(--border-soft);border-radius:14px;background:#FFFFFF;margin-bottom:14px}
.office-table{width:100%;border-collapse:collapse;font-size:.9rem}
.office-table th{position:sticky;top:0;background:var(--petal-100);text-align:left;padding:10px 12px;font-weight:600;color:var(--espresso-800);white-space:nowrap}
.office-table td{padding:10px 12px;border-top:1px solid var(--border-soft);vertical-align:top;color:var(--text-soft)}
.office-table tr.is-new td{font-weight:600;color:var(--espresso-800)}
.office-table .inline-form{display:inline-block;margin:2px 4px 2px 0}
.office-search{display:flex;gap:8px;margin-bottom:14px}
.office-search input{flex:1;min-width:0;padding:10px 14px;border:1px solid var(--border-soft);border-radius:var(--r-pill);font:inherit}
.tabs{display:flex;gap:6px;margin-bottom:14px;flex-wrap:wrap}
.tabs a{padding:8px 14px;border-radius:var(--r-pill);border:1px solid var(--border-soft);text-decoration:none;color:var(--text-soft);font-weight:600;font-size:.9rem;background:#FFFFFF}
.tabs a[aria-current="page"]{background:var(--espresso-800);color:var(--text-on-dark);border-color:var(--espresso-800)}
.mod{gap:6px}
.mod.is-crisis{border-color:#8C2B26;box-shadow:0 0 0 3px rgba(140,43,38,.12)}
.mod.is-focus{outline:2px solid var(--gold-500);outline-offset:2px}
.quoted{padding:10px 14px;border-left:3px solid var(--gold-500);background:var(--petal-100);border-radius:0 12px 12px 0}
.grid2{display:grid;gap:12px;grid-template-columns:1fr}
@media (min-width:760px){.grid2{grid-template-columns:1fr 1fr}}
.guidance{background:var(--petal-100);border-color:var(--border-gold)}
.office .quick-exit{display:none}
/* print: discreet (blueprint 09), no logo, generic title */
@media print{
  .print-plain .hdr,.print-plain .drawer,.print-plain .ftr,.print-plain .sticky,.print-plain .quick-exit,.print-plain .phero,.print-plain .vband,.print-plain .tool-form,.print-plain .tool-actions,.print-plain .crisis-strip,.print-plain .sources,.print-plain .actions{display:none !important}
  .print-plain .tool-result{background:#fff !important;color:#000 !important;box-shadow:none;border:1px solid #000}
  .print-plain .tool-result *{color:#000 !important}
  .print-plain main::before{content:"Household budget worksheet";display:block;font:600 18px/1.4 Georgia,serif;margin:0 0 12px}
  .print-plain .certificate{border-color:#000}
  .no-print{display:none !important}
  .office-rail{display:none}
}
