/* generated at startup from brands/arise.json (colors, fonts) + public/themes/newsroom.css */
:root{--r1:#15708F;--r2:#15708F;--grad:linear-gradient(90deg,#15708F,#15708F);--grad-hover:linear-gradient(90deg,#0F5C77,#0F5C77);--accent:#15708F;--accent-hover:#0F5C77;--accent-ink:#0F5C77;--tint:#EAF3F6;--tint-2:#CFE3EA;--ink:#212225;--ink2:#4B4F54;--muted:#6B6E73;--faint:#9A9DA1;--line:#E1E2E4;--soft:#F4F5F6;--soft-2:#F4F5F6;--warm:#F4F5F6;--bar:#FFFFFF;--label:#9C2A5E;--surface:#2B3D47;--font-display:"Source Serif 4", Georgia, "Times New Roman", serif;--font-head:"Open Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;font-family:"Open Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;}
/* Newsroom theme (Arise UpWard, Oct 2026). Loaded after style.css as /static/theme.css, only for brands whose JSON sets
   "theme": "newsroom". The :root colors and fonts above this file come from the brand JSON (see src/theme.js); this file
   holds the structural look: white top bar with a thin rule and a teal underline tab, near-square 4px cards, flat solid
   teal buttons, serif headings, a teal "today" circle, plum date headers and Sundays, slate instead of black surfaces. */
@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/source-serif-4-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/source-serif-4-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/source-serif-4-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Open Sans";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/open-sans-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Open Sans";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/open-sans-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Open Sans";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/open-sans-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Open Sans";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/open-sans-latin-700-normal.woff2) format("woff2")}
:root{--surface-2:#1C2A31;--surface-glow:rgba(21,112,143,.55);--rule-strong:#C9CBCE}

/* ---------- type ---------- */
body{color:var(--ink)}
h1,h2,h3,.band-id h1,.signin-card h2,.bcal-month,.pcard .hi,.cover-body h1,.ecard-title,.mo-big b{font-family:var(--font-display);font-weight:600;letter-spacing:0}
label{color:var(--ink2);font-weight:600}
a{color:var(--accent-ink)}

/* ---------- top bar: white, thin rule, teal underline on the active tab ---------- */
.topbar{background:var(--bar);height:56px;border-bottom:1px solid var(--line)}
.topbar .logo{height:36px}
.topnav{gap:2px}
.topnav a{color:var(--ink);font-size:13.5px;font-weight:500;border-radius:0;padding:17px 11px 16px;position:relative}
.topnav a:hover{color:var(--accent-ink)}
.topnav a.on{background:none;color:var(--accent-ink);font-weight:600}
.topnav a.on::after{content:"";position:absolute;left:11px;right:11px;bottom:-1px;height:3px;background:var(--accent)}
.topright .who{color:var(--muted)}
.btn-signout{background:#fff;color:var(--ink);border:1px solid var(--rule-strong);border-radius:3px;font-weight:600;padding:6px 14px}
.btn-signout:hover{background:var(--soft)}
/* phone: the 56px bar height above is desktop-only. On phones the header is two rows (logo + Sign out, then the tabs)
   and must grow to fit them, or the tab row spills out below the bar and draws over the hero card. Solid white, a thin
   rule and a soft shadow so it reads as a floating header while the page scrolls under it. */
@media (max-width:720px){
  .topbar{height:auto;box-shadow:0 2px 10px -4px rgba(33,34,37,.18)}
  .topbar .logo{height:32px}
  .topnav{padding:0;margin:4px -14px 0;padding:0 6px;gap:0}
  .topnav a{padding:11px 10px 12px;font-size:13px}
  .topnav a.on::after{left:10px;right:10px;bottom:0}
}

/* ---------- buttons + forms: understated, square-ish, flat ---------- */
.btn{border-radius:3px;font-weight:600}
.btn-primary{background:var(--accent);box-shadow:none}
.btn-primary:hover{background:var(--accent-hover)}
.btn-soft{background:#fff;color:var(--accent-ink);box-shadow:inset 0 0 0 1px var(--tint-2)}
.btn-soft:hover{background:var(--tint)}
.btn-outline{border-width:1px;border-color:var(--rule-strong)}
.btn-icon{background:var(--accent)}
.btn-icon:hover{background:var(--accent-hover)}
.fab{background:var(--accent);border-radius:4px;box-shadow:0 2px 8px rgba(0,0,0,.18)}
.fab:hover{background:var(--accent-hover)}
input:not([type=file]):not([type=checkbox]),select,textarea{border-radius:3px;border-color:var(--rule-strong)}
input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--tint)}
.check-blue input,.check-small input,.who-opt input[type=radio],.boy input,.radio-label input[type=radio]{accent-color:var(--accent)}
.toggle input:checked+.tgl{background:var(--accent)}

/* ---------- sign-in ---------- */
.signin-body{background:var(--soft)}
.signin{padding-top:44px}
.brand-lg .logo{border:0;border-radius:0;background:transparent;height:104px}
.signin-card{border-radius:4px;border:1px solid var(--line);box-shadow:0 1px 3px rgba(0,0,0,.10);padding:30px 30px 26px}
.signin-card h2{font-size:26px;margin-bottom:18px}
.signin-card input:not([type=file]){border-radius:3px;border:1px solid var(--rule-strong);padding:11px 12px}
.signin-card .btn{border-radius:3px;padding:12px 16px}
.signin-brand-grad{border-radius:4px;background:var(--accent);box-shadow:none}
.demo{background:#fff;border:1px solid var(--line);border-radius:4px}
.demo code{background:var(--soft);color:var(--accent-ink);border-radius:2px}
.signin-domain a{color:var(--muted)}

/* ---------- cards, panels, chips: 4px corners ---------- */
.gcard,.card{border-radius:4px}
.feed-cal.gcard,.gcard.bcal-big{background:#fff;border:1px solid var(--line);box-shadow:0 1px 3px rgba(0,0,0,.08)}
.pc,.composer{border-radius:4px;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.pc-photo,.pc-callout,.pc-evlink,.composer textarea,.pc-menu .menu{border-radius:3px}
.pc-private{background:#FBFBFC}
.pc-pinned{box-shadow:0 0 0 1px var(--tint-2)}
.pc-check,.check{background:var(--accent)}
.check.ink{background:var(--surface)}
.pc-role{color:var(--label);background:#F7E9EF;border-radius:2px}
.pc-foot{border-top-color:var(--line)}
.pc-more{border-radius:3px}
.pc-more-arrow{border-color:var(--tint-2)}
.rx,.qr{border-radius:3px}
.rsvp-b{border-radius:3px}
.rsvp-going.on{background:var(--accent)}
.empty{border-radius:4px}
.fchips a,.subtabs a,.ptab,.chip,.tagp,.pill{border-radius:3px}
.fchips a.on,.subtabs a.on{background:var(--ink);border-color:transparent;color:#fff}
.tag-featured{background:var(--accent);border-radius:2px}
.poll-opt{border-radius:3px}
.poll-bar{background:var(--tint)}
.flash{border-radius:4px}
.flash.rankup{background:var(--surface);border-left-color:var(--accent)}
.note-box,.remind-note,.push-box,.rsvp-msg,.mo-strip,.pin-reveal{border-radius:4px}
.step-num{border-radius:50%}
.step.is-done .step-num,.stepper li.on .stp-n{background:var(--accent)}
.step-link{border-radius:3px}
.step-video{border-radius:4px;background:var(--surface)}
.bar-fg{fill:var(--accent)}
.mo-big b{background:none;-webkit-text-fill-color:currentColor;color:var(--accent-ink)}

/* ---------- left column: slate welcome card, teal active rail ---------- */
.pcard{border-radius:4px;background:var(--surface);box-shadow:none}
.pcard .sub{color:#D3DDE2}
.pcard .dot{background:#7FB8CB}
.avatar-card{border-radius:4px;background:var(--surface-2)}
.avatar{background:var(--tint);color:var(--accent-ink)}
.sidenav li a{color:var(--ink2);border-bottom-color:var(--line)}
.sidenav li a.on{color:var(--accent-ink);font-weight:600}
.sidenav li a.on svg{color:var(--accent-ink)}
.sidenav li a.on::before{background:var(--accent);border-radius:0}
.sidenav .count{background:var(--soft);color:var(--ink2);border-radius:2px}
.col-left{border-right-color:var(--line)}.col-right{border-left-color:var(--line)}
.stat-row,.bprog-list li,.tpl-mini a,.col-center .up-list a,.mcal td{border-color:var(--line)}

/* ---------- rank arches ---------- */
.a-done .face{background:linear-gradient(180deg,#2A88A8,var(--accent))}
.a-done .badge{background:var(--accent)}
.a-now .face{background:radial-gradient(120% 80% at 50% 0%,var(--surface-glow),transparent 70%),var(--surface)}
.a-now .badge{background:var(--surface)}
.a-next{color:var(--ink)}
.a-next .face{background:linear-gradient(180deg,var(--tint),var(--tint-2))}
.a-far{color:var(--ink2)}
.a-far .face{background:linear-gradient(180deg,#F4F5F6,#E6E7E9)}
.a-photo .face{background:var(--surface-2)}
.a-photo .face::after{background:linear-gradient(180deg,rgba(28,42,49,.15) 20%,rgba(28,42,49,.78))}

/* ---------- group header, tabs ---------- */
.band-logo{border-radius:4px;box-shadow:none;border:1px solid var(--line)}
.band-id h1{font-size:22px}
.band-group{background:none;-webkit-text-fill-color:currentColor;color:var(--accent-ink)}
.band-tabs a.on::after,.utabs a.on::after{background:var(--accent);border-radius:0}

/* ---------- profile: cover default + tabs ---------- */
.cover-card{border-radius:4px}
.cover{background:var(--surface)}
.cover::after{background:linear-gradient(90deg,rgba(28,42,49,.72),rgba(21,112,143,.28) 60%,rgba(28,42,49,.5))}
.cover-custom::after{background:linear-gradient(180deg,transparent 40%,rgba(28,42,49,.55))}
.cover-plain{background:radial-gradient(70% 130% at 85% 0%,rgba(42,136,168,.75) 0%,transparent 62%),radial-gradient(60% 120% at 40% 130%,rgba(21,112,143,.45) 0%,transparent 60%),var(--surface)}
.cover-plain::after{background:none}
.avatar-xl{border-radius:50%}
.ptab.on{background:var(--ink);color:#fff}
.ptab.on .n{color:#D3DDE2}
.medal.blue{background:radial-gradient(circle at 35% 30%,#4FA3C0,var(--accent))}
.medal.ink{background:radial-gradient(circle at 35% 30%,#4B5D66,var(--surface))}

/* ---------- events ---------- */
.ecard{border-radius:4px;background:#fff;border:1px solid var(--line)}
.ecard-body{border-left:1px solid var(--line)}
.ecard-pic,.ed-pic{background:var(--surface-2)}
.ev-pic-empty{background:radial-gradient(120% 90% at 100% 0%,rgba(42,136,168,.7) 0%,transparent 60%),linear-gradient(160deg,var(--accent),var(--surface) 85%)}
.dbadge{border-radius:3px}
.dbadge span{background:var(--accent)}
.dbadge-ink span{background:var(--surface)}
.loc-ic{background:linear-gradient(160deg,var(--accent),var(--surface))}
.loc-list a:hover{background:var(--tint)}
.cal-big td.today .dnum{background:var(--accent)}
.cal-evs a{border-radius:2px}
.cal-evs a:hover{background:var(--accent)}
.mcal td.has a{background:var(--accent)}
.ev-time{color:var(--label)}

/* ---------- calendars + agenda: teal today circle, plum Sundays and date headers ---------- */
.bcal{--sun:var(--label)}
.bcal-grid td.today .bd{background:var(--accent);color:#fff}
.bcal-grid td.out .bd{color:#C4C6C9}
.bcal-grid td.out.sun .bd{color:#D9AFC2}
.bcal-grid td a{border-radius:3px}
.bcal-grid th{font-weight:600;letter-spacing:.04em}
.bcal-today{border-radius:3px}
.ag-day,.mini-head{color:var(--label);font-weight:600;letter-spacing:.08em}
.ag-item a{border-radius:0 3px 3px 0;background:#fff;border:1px solid var(--line);border-left:4px solid var(--cc,var(--accent))}
.up-list a:hover b,.feat-list a:hover b,.mini-list a:hover,.sidenav li a:hover{color:var(--accent-ink)}
/* event categories: same hues, calmer */
.cat-activity{--cc:#15708F}.cat-service{--cc:#2E7D5B}.cat-temple{--cc:#6B5B95}.cat-sports{--cc:#B5703A}.cat-devotional{--cc:#3D8FB0}
.cat-campout{--cc:#5E8A3A}.cat-fireside{--cc:#9C2A5E}.cat-meeting{--cc:#6B6E73}.cat-other{--cc:#8A8D91}
/* skill category covers (when a skill has no photo): calmer editorial tones */
.cat-reading{--g1:#C9A25A;--g2:#7A5A24}
.cat-scripture{--g1:#3D7FA0;--g2:#173F55}
.cat-coding{--g1:#3B9A82;--g2:#1C5446}
.cat-service{--g1:#B4566E;--g2:#6A2338}
.cat-outdoors{--g1:#5E9A62;--g2:#2C5130}
.cat-skills{--g1:#7E6FB0;--g2:#3E3470}
.cat-other{--g1:#6B7884;--g2:#2F3940}
.bcover{border-radius:inherit}

/* ---------- near-square corners everywhere a card or panel lives (pills, toggles, circles keep their shape) ---------- */
.bubble,.bubble .pic,.empty,.status li,.code-box,.cover-card,.edetail,.ed-desc,.mcal,.cal-big,.bcard,.rq,.bdetail,.bstate,
.step-img,.step-video,.step-form,.step-done,.wbform,.mo-strip,.tpl,.who-opt,.boy-pick,.remind,.devices,.album-cover,
.side-block,.ecard,.loc-list a,.composer,.pc,.note-box,.flash,.demo,.gcard,.card{border-radius:4px}
.file input[type=file],.step-ans-pic,.step-will,.ipk-in,.wbtile-in,.album-photos img,.push-help,.poll-opt,.boy,
.cmt-bubble,.pc-callout,.pc-evlink,.pc-photo,.pc-more,.pc-menu .menu,.composer textarea,.dbadge{border-radius:3px}

/* ---------- footer ---------- */
.foot,.foot a{color:var(--muted)}
