/* Prisma 0.20: a visual layer only. Section/group tokens remain owned by personal.css and paintArea(). */
body{--prisma-hero-ink:#fff;--prisma-start:#196df4;--prisma-end:#6a40d4;--prisma-accent:#c4f6ff;--prisma-accent-ink:#143a59;--prisma-tint:#eaf2ff;--prisma-surface:#fff;--bg:#f0f6ff;--surface:#fff;--text:#183342;--muted:#536878;--stroke:#dce7f1;--shadow:0 12px 32px #143d7010;background:var(--bg);color:var(--text)}
body[data-theme=dark],body[data-theme=dark][data-area]{--prisma-tint:#172e4b;--prisma-surface:#172a40;--bg:#0d1d30;--surface:#172a40;--text:#f0f5ff;--muted:#bdcce0;--stroke:#324960;--shadow:0 12px 32px #0002;color-scheme:dark}
body[data-authenticated=true]{--prisma-hero-ink:var(--area-ink,#fff);--prisma-start:var(--area-deep);--prisma-end:var(--area);--prisma-accent:var(--area-light);--prisma-accent-ink:var(--area-deep);--prisma-tint:color-mix(in srgb,var(--area) 10%,var(--surface))}
body[data-theme=dark][data-authenticated=true]{--prisma-tint:color-mix(in srgb,var(--area-light) 12%,var(--surface))}
.app-frame{background:var(--bg)}
.app-header{padding:calc(12px + env(safe-area-inset-top)) 18px 12px;gap:10px;background:var(--surface);border:0;backdrop-filter:none;box-shadow:none;min-height:82px;z-index:50}
.brand{gap:10px;min-width:0}.brand>span:last-child{display:flex;flex-direction:column;min-width:0}.brand strong{order:-1;font:750 19px/1.2 -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;letter-spacing:-.6px;overflow-wrap:anywhere}.brand-overline{font-size:11px;font-weight:500;letter-spacing:.3px;line-height:1.6}
.brand-mark{width:44px;height:44px;flex-shrink:0;background:#fff!important;padding:1px;border:0;overflow:visible}.brand-mark img{object-fit:contain;width:100%;height:100%;clip-path:none;transform:none;border-radius:50%}
.header-actions{gap:7px;flex-shrink:0}.header-actions .icon-btn{display:grid;place-items:center;min-width:44px;width:44px;min-height:44px;height:44px;border-radius:50%;background:var(--prisma-tint);border:0;color:var(--green);box-shadow:none}.header-actions .icon-btn svg{width:21px;height:21px}
.portal-quick-services{gap:5px;padding:7px 16px 12px;border:0;background:var(--surface);flex-wrap:nowrap}.portal-quick-services button{flex:1;min-width:0;min-height:44px;border:0;background:var(--prisma-tint);color:var(--text);border-radius:15px;font:650 12px/1.3 -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;padding:10px 7px;overflow-wrap:anywhere}
.view{padding:22px 18px 32px}.home-greeting:empty{display:none}body[data-authenticated=false] .home-greeting{display:none}body[data-authenticated=false] #connection-label{display:none}.today-strip{margin:0 4px 7px}.today-strip:has(button[hidden]){display:none}body[data-authenticated=true] .today-strip:has(button[hidden]){display:flex}.home-greeting{font-size:17px;font-weight:650;line-height:1.4;color:var(--text);margin:2px 4px 2px}.today-strip .icon-btn{border-radius:50%;background:var(--surface);color:var(--green)}
body[data-area] #view-home .hero,body[data-authenticated=false] #view-home .hero,body[data-authenticated=true] #view-home .hero{padding:27px 22px 22px;border-radius:32px;background:linear-gradient(132deg,var(--prisma-start),var(--prisma-end) 74%,color-mix(in srgb,var(--prisma-end) 68%,#d138d2));min-height:0;color:#fff;box-shadow:none;isolation:isolate;position:relative;overflow:hidden}
#view-home .hero-copy{position:relative;z-index:2;max-width:100%;width:100%}
#view-home .hero-halo{display:block;position:absolute;top:45px;right:-148px;width:290px;height:290px;opacity:1;border:46px solid #80e8ff3b;box-shadow:0 0 0 30px #ffffff12;border-radius:50%;background:none;transform:translate(var(--prisma-x,0),var(--prisma-y,0)) rotate(-15deg);transition:transform .7s cubic-bezier(.2,.8,.2,1);pointer-events:none;z-index:0}
#view-home .hero-copy .eyebrow{display:block;font-size:10px;letter-spacing:1.2px;font-weight:600;line-height:1.6;max-width:100%;color:var(--prisma-hero-ink);overflow-wrap:anywhere}
body[data-area] #view-home .hero h1,body[data-authenticated=true] #view-home .hero h1{font-size:clamp(35px,9.8vw,44px);font-weight:750;line-height:1.04;letter-spacing:-1.8px;color:var(--prisma-hero-ink);margin:26px 0 18px;max-width:13ch;overflow-wrap:normal;word-break:normal}
body[data-authenticated=true] #view-home .hero h1{font-size:clamp(31px,8.5vw,42px);max-width:18ch}
body[data-area] #view-home .hero p{font-size:14px;line-height:1.6;max-width:30ch;margin:0 0 27px;color:var(--prisma-hero-ink)}
body[data-area] #view-home .hero h1 em{font-style:normal;color:inherit}
body[data-area] #view-home .hero-link{display:flex;align-items:center;justify-content:space-between;text-align:left;gap:14px;width:100%;min-height:65px;padding:17px 16px;border:1px solid #ffffff55;border-radius:22px;background:#ffffff20;color:var(--prisma-hero-ink);font-size:15px;line-height:1.4;font-weight:650;box-shadow:0 8px 25px #0d245818;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
#view-home .hero-link svg{width:24px;height:24px;flex-shrink:0;background:var(--prisma-accent);color:#143a59;padding:9px;box-sizing:content-box;border-radius:14px}
#view-home .visitor-login{display:inline-flex;align-items:center;min-height:44px;margin:13px 0 0;padding:9px 4px;color:var(--prisma-hero-ink);font-size:13px;font-weight:550;background:transparent;border:0;text-align:left}
/* The complete original emblem is in the compact header; avoid a second logo over the hero text. */
#view-home .hero-seal,#view-home .hero-bottom{display:none}
.prisma-moments{display:flex;align-items:center;gap:14px;padding:10px;margin:17px 0 20px;border-radius:25px;background:var(--surface);color:var(--text);border:1px solid var(--stroke);box-shadow:var(--shadow);min-width:0}
.prisma-moments>img{display:block;width:91px;height:104px;object-fit:cover;border-radius:18px;flex-shrink:0}.prisma-moments>div{min-width:0;flex:1}.prisma-moments h2{font-size:19px;line-height:1.2;margin:0 0 5px;letter-spacing:-.5px}.prisma-moments p{font-size:12px;line-height:1.5;color:var(--muted);margin:0}.prisma-moments button{display:inline-flex;align-items:center;gap:7px;font-family:inherit;font-size:13px;line-height:1.4;font-weight:650;min-height:44px;padding:7px 0;border:0;background:transparent;color:var(--green);text-align:left}.prisma-moments button svg{width:18px;height:18px}
/* Existing navigation, editors, group cards, galleries and server panels keep their actions and color sources. */
.home-services{background:var(--prisma-tint);padding:6px;border-radius:22px;overflow:visible;flex-wrap:wrap}.service-card,.service-card:only-child{border-radius:17px;min-height:47px;background:var(--surface);color:var(--green)}
.experience-panel,.home-albums{border-radius:26px}.experience-panel{border-color:var(--stroke);box-shadow:var(--shadow)}
.home-groups .personal-action,.action-grid .personal-action{border-radius:18px;padding:16px 12px!important;margin:5px 0;background:var(--surface);border-bottom:0!important}
.personal-action-icon,.link-list .mini-icon{border-radius:15px}.action-card.teal{color:var(--text)}.page-heading h1{font-weight:750;letter-spacing:-1.5px}.section-head h2,.group-title{font-weight:700}
.feature{border-radius:25px}.feature-bulletin{background:linear-gradient(135deg,var(--area-deep),var(--area));color:#fff}.feature-homily{background:var(--prisma-tint);color:var(--text)}
body[data-theme=dark] .feature-homily{background:var(--prisma-tint);color:var(--text)}
.album-card{border-radius:25px;box-shadow:var(--shadow)}.album-open{color:var(--green)}.album-refresh{border-radius:15px}.album-photo-control{background:color-mix(in srgb,var(--area-deep) 88%,transparent)}
.tabbar{left:50%;transform:translateX(-50%);width:calc(100% - 24px);max-width:1096px;bottom:calc(8px + env(safe-area-inset-bottom));padding:7px;border:1px solid var(--stroke);border-radius:25px;background:var(--surface);backdrop-filter:none;box-shadow:0 8px 35px #1030541a;gap:2px}
.tab{padding:10px 1px;min-height:60px;gap:5px;border-radius:18px;color:var(--muted)}.tab span{font-size:11px;line-height:1.3;font-weight:650}.tab.active{background:var(--prisma-tint);color:var(--green);border-radius:18px}.tab svg{width:21px;height:21px}
body[data-authenticated=false] .tab.active{background:#c4f6ff;color:#143a59}
#main-content{padding-bottom:calc(110px + env(safe-area-inset-bottom))}
.icon-btn,.hero-link,.primary-btn,.secondary-btn,.tab,.portal-quick-services button,.personal-action,.album-card{transition:transform .2s cubic-bezier(.2,.8,.2,1),box-shadow .2s,background-color .2s}
button:active,.hero-link:active{transform:scale(.97)}
@media(hover:hover) and (pointer:fine){.icon-btn:hover,.primary-btn:hover,.secondary-btn:hover,.hero-link:hover,.personal-action:hover{transform:translateY(-2px);box-shadow:var(--shadow)}.album-card:hover{transform:translateY(-3px)}}
.view.active{animation:prisma-view .3s cubic-bezier(.2,.75,.2,1)}
.prisma-moments{animation:prisma-view .4s cubic-bezier(.2,.75,.2,1)}
@keyframes prisma-view{from{transform:translateY(10px)}to{transform:translateY(0)}}
body.prisma-change #view-home .hero-halo{transform:translate(10px,15px) rotate(12deg)}
body[data-large-text=true] :is(.portal-quick-services button,.tab span,.prisma-moments p){font-size:1rem;white-space:normal}
body[data-large-text=true] .prisma-moments{flex-wrap:wrap}body[data-large-text=true] .prisma-moments>div{flex-basis:170px}
body[data-large-text=true] .tabbar{align-items:stretch}body[data-large-text=true] .tab{min-height:70px;overflow-wrap:anywhere}body[data-large-text=true] .tab span{white-space:normal}
body[data-large-text=true] .brand-overline{font-size:13px}
@media(min-width:760px){.view{padding:28px 32px 38px}.app-header{padding-left:32px;padding-right:32px}.portal-quick-services{padding:6px 32px 16px;gap:8px}.portal-quick-services button{flex:0 1 140px}.brand strong{font-size:22px}body[data-area] #view-home .hero,body[data-authenticated=true] #view-home .hero{padding:38px 38px 30px;min-height:0}body[data-area] #view-home .hero h1{font-size:52px;max-width:17ch}body[data-area] #view-home .hero p{max-width:52ch}#view-home .hero-link{max-width:480px}#view-home .hero-halo{width:370px;height:370px;right:-90px;top:-60px;border-width:58px}.prisma-moments{max-width:570px}.prisma-moments>img{width:130px;height:105px}.prisma-moments h2{font-size:22px}}
@media(max-width:360px){.app-header{padding-left:12px;padding-right:12px;gap:5px}.brand{gap:7px}.brand strong{font-size:16px;letter-spacing:-.5px}.brand-mark{width:39px;height:39px}.brand-overline{font-size:10px}.header-actions{gap:4px}.view{padding-left:14px;padding-right:14px}.portal-quick-services{padding-left:12px;padding-right:12px}.portal-quick-services button{font-size:11px}body[data-area] #view-home .hero{padding:24px 20px 20px;border-radius:28px}body[data-area] #view-home .hero h1{font-size:35px;letter-spacing:-1.5px}body[data-authenticated=true] #view-home .hero h1{font-size:32px}.prisma-moments{gap:10px}.prisma-moments>img{width:76px;height:103px}.prisma-moments h2{font-size:17px}.tabbar{width:calc(100% - 16px);padding:6px}.tab span{font-size:10px}}
@media(prefers-reduced-motion:reduce){.view.active,.prisma-moments{animation:none}.hero-halo,.icon-btn,.hero-link,.primary-btn,.secondary-btn,.tab,.portal-quick-services button,.personal-action,.album-card{transition:none!important}button:active,.hero-link:active{transform:none}body.prisma-change #view-home .hero-halo{transform:none}}
@media print{.tabbar,.prisma-moments,.portal-quick-services{display:none}}

/* Custom group palettes can be light: retain their computed contrast color. */
body[data-authenticated=true]:is([data-area=caritas],[data-area=choirs],[data-area=prayer],[data-area=oratory],[data-area=catechism],[data-area=mission]){--prisma-start:color-mix(in srgb,var(--area) 96%,var(--area-ink));--prisma-end:var(--area)}
body[data-authenticated=true]:is([data-area=caritas],[data-area=choirs],[data-area=prayer],[data-area=oratory],[data-area=catechism],[data-area=mission]) #view-home .hero{background:linear-gradient(135deg,var(--prisma-start),var(--prisma-end))}
/* Public home: sampled original logo colors, petrol #337a86 and yellow #ebe10d. */
body[data-authenticated=false]{--prisma-start:#195c68;--prisma-end:#337a86;--prisma-accent:#ebe10d;--prisma-accent-ink:#153b42;--prisma-tint:#e1efee;--bg:#eff7f6;--surface:#fff;--text:#183b42;--muted:#536d72;--stroke:#d7e7e5;--green:#246b73}
body[data-authenticated=false][data-theme=dark]{--prisma-tint:#243f43;--bg:#10262c;--surface:#19353d;--text:#edf7f5;--muted:#bbd2d3;--stroke:#36555b;--green:#a5d8d8}
body[data-authenticated=false] #view-home .hero{background:linear-gradient(132deg,#195c68,#337a86 74%,#246c68)}
body[data-authenticated=false] #view-home .hero-halo{border-color:#ebe10d29;box-shadow:0 0 0 30px #ebe10d12}
body[data-authenticated=false] #view-home .hero-link svg{background:#ebe10d;color:#153b42}
body[data-authenticated=false] .tab.active{background:#ebe10d;color:#153b42}

/* The complete original emblem becomes a soft half-logo at the right edge. */
#view-home .hero-halo{top:50%;right:-175px;width:350px;height:350px;border:0;box-shadow:none;background:transparent url('mobile-parish-logo.png') center/contain no-repeat;opacity:.13;transform:translate(var(--prisma-x,0),calc(-50% + var(--prisma-y,0)));border-radius:50%}
body[data-authenticated=false] #view-home .hero-halo{border:0;box-shadow:none}
body.prisma-change #view-home .hero-halo{transform:translate(8px,calc(-50% + 8px)) rotate(4deg)}
.app-header{border-bottom:3px solid #174d3e}.brand-overline{color:var(--muted)}
.portal-quick-services{border-radius:20px;border:1px solid var(--stroke);padding:7px;background:var(--surface)}
#view-home .hero h1,#view-home .hero p,#visitor-news h2,#prisma-moments-title,#home-albums-title{white-space:pre-line}
body[data-area] #view-home .hero h1{max-width:100%;font-size:clamp(30px,8.5vw,42px);overflow-wrap:anywhere}
body[data-area] #view-home .hero p{max-width:100%}
#theme-toggle svg{width:22px;height:22px;overflow:visible;flex-shrink:0}
@media(min-width:760px){#view-home .hero-halo{width:460px;height:460px;right:-230px;top:50%;border:0}body[data-area] #view-home .hero h1{max-width:25ch;font-size:48px}}
@media(prefers-reduced-motion:reduce){#view-home .hero-halo,body.prisma-change #view-home .hero-halo{transform:translateY(-50%)!important}}

/* Shared content rails: every full-width home card follows the same edges. */
.app-header{height:auto;min-height:82px;align-items:center}.brand{flex:1;min-width:0}.header-actions{margin-left:auto;align-items:center;justify-content:flex-end}.header-actions .icon-btn{position:relative;flex:none}.header-actions .icon-btn[hidden]{display:none!important}
.header-actions .inbox-badge{position:absolute;top:-3px;right:-3px;min-width:18px;height:18px;display:grid;place-items:center;padding:0 4px;margin:0;background:var(--green);color:var(--surface);font-size:10px;line-height:1;border:2px solid var(--surface)}.header-actions .inbox-badge[hidden]{display:none}
#view-home .home-greeting,#view-home .today-strip{margin-left:0;margin-right:0}#view-home .today-strip{margin-bottom:18px;min-height:18px}body[data-authenticated=false] #view-home .today-strip{display:none}
#view-home :is(.prisma-moments,.prisma-faith,.home-services,.portal-quick-services,.home-albums,.experience-panel){width:100%;max-width:none;margin-left:0;margin-right:0}
#view-home .portal-quick-services{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}#view-home .portal-quick-services button{width:100%;min-width:0}
#view-home :is(.prisma-moments,.prisma-faith){text-align:left}#view-home .home-services:empty{display:none}
@media(max-width:360px){.header-actions{gap:3px}.header-actions .icon-btn{min-width:40px;width:40px;height:40px;min-height:40px}.brand strong{font-size:15px}.brand-overline{font-size:10px}.brand-mark{width:33px;height:33px}.brand{gap:6px}}
/* Short entrance and scroll reveals; no perpetual repaint or hidden content without JS. */
@keyframes prisma-arrive{from{opacity:.35;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
@keyframes prisma-glint{0%,35%{transform:translateX(-150%) skewX(-16deg);opacity:0}45%{opacity:.16}100%{transform:translateX(220%) skewX(-16deg);opacity:0}}
@media(prefers-reduced-motion:no-preference){#view-home.active .hero{animation:prisma-arrive .55s cubic-bezier(.2,.75,.2,1) both}#view-home.active .hero:after{content:"";position:absolute;inset:0;width:45%;background:linear-gradient(90deg,transparent,#fff,transparent);pointer-events:none;z-index:1;animation:prisma-glint 1.7s ease-out both}#view-home .prisma-reveal{animation:prisma-arrive .5s cubic-bezier(.2,.75,.2,1) both}.prisma-moments>img{transition:transform .35s}.prisma-moments:active>img{transform:scale(.97)}}
@media(prefers-reduced-motion:reduce){#view-home .hero,#view-home .prisma-reveal{animation:none!important}#view-home .hero:after{display:none}}
/* Fixed dock: visible viewport anchoring for Safari and embedded mobile browsers. */
.app-frame{min-height:100dvh}
.tabbar{position:fixed;left:0;right:0;margin-inline:auto;transform:none;transition:none;bottom:calc(8px + env(safe-area-inset-bottom,0px))}
html[data-visual-dock=true] .tabbar{top:calc(var(--app-visual-bottom) - var(--app-tab-height) - 8px - env(safe-area-inset-bottom,0px));bottom:auto}
#main-content{padding-bottom:calc(var(--app-tab-height,76px) + 32px + env(safe-area-inset-bottom,0px))}
@media print{.tabbar{display:none!important}}

/* 0.26: floating glass dock, anchored by viewport.js, with full touch targets. */
.tabbar{width:calc(100% - 28px);max-width:720px;padding:4px;gap:2px;border-radius:22px;background:color-mix(in srgb,var(--surface) 78%,transparent);border:1px solid color-mix(in srgb,var(--text) 12%,transparent);-webkit-backdrop-filter:blur(24px) saturate(155%);backdrop-filter:blur(24px) saturate(155%);box-shadow:0 8px 30px #0a272925,inset 0 1px 0 #ffffff25}
.tabbar .tab{min-height:48px;padding:6px 2px;gap:3px;border-radius:17px;background:transparent}.tabbar .tab span{font-size:10px}.tabbar .tab svg{width:21px;height:21px}.tabbar .tab.active{background:color-mix(in srgb,var(--green) 15%,transparent);color:var(--text);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--green) 18%,transparent)}
.tabbar .tab.active svg{stroke-width:2.4}.tabbar .tab:active{transform:scale(.94)}
body[data-large-text=true] .tabbar .tab{min-height:62px}body[data-large-text=true] .tabbar .tab span{font-size:13px}
body{isolation:isolate}body::before,body::after{content:"";position:fixed;z-index:-1;pointer-events:none;width:100vw;height:72vh;left:-30vw;top:12vh;border-radius:40% 60% 45% 55%;background:radial-gradient(ellipse,color-mix(in srgb,var(--green) 10%,transparent),transparent 70%);transform:rotate(-24deg)}body::after{left:35vw;top:52vh;transform:rotate(22deg);background:radial-gradient(ellipse,color-mix(in srgb,var(--green) 15%,transparent),transparent 70%)}
.app-frame{background:transparent}#view-home>section,#view-home>.prisma-moments{position:relative}
@keyframes redentore-wave{to{transform:translate(5vw,-3vh) rotate(-12deg)}}
@media(prefers-reduced-motion:no-preference){body::before{animation:redentore-wave 20s ease-in-out infinite alternate}body::after{animation:redentore-wave 26s ease-in-out infinite alternate-reverse}.tab.active svg{animation:prisma-arrive .25s ease-out}}
@media(prefers-reduced-motion:reduce){body::before,body::after{animation:none}.tabbar .tab:active{transform:none}}
@media(prefers-reduced-transparency:reduce){.tabbar{background:var(--surface);backdrop-filter:none;-webkit-backdrop-filter:none}}

/* 0.32: server-managed headings grow with their content. */
.brand strong,.brand-overline,#home-title,#home-description,#visitor-news h2,#prisma-moments-title,#home-albums-title,#faith-title,#faith-description,#home-community-heading,#home-groups-heading{overflow-wrap:anywhere;word-break:normal;white-space:pre-line;max-height:none;-webkit-line-clamp:unset;line-clamp:unset;text-overflow:clip}
.brand strong,.brand-overline{display:block;min-width:0}.brand-overline{letter-spacing:.06em}#view-home .hero{height:auto;min-height:0}#view-home .hero :is(h1,p){max-height:none;overflow:visible}#view-home :is(.prisma-faith,.prisma-moments,.home-albums){height:auto}#view-home :is(button,a){overflow-wrap:anywhere;white-space:normal}
#view-home .prisma-moments p,#view-home .album-intro,#view-home .feature :is(strong,.feature-label,.feature-caption),#view-home .link-list strong{overflow-wrap:anywhere;white-space:pre-line;min-width:0;max-height:none;-webkit-line-clamp:unset;overflow:visible}
#view-home .feature{height:auto;min-height:180px}#view-home .feature>span{min-width:0}#view-home .link-list button{height:auto}body[data-area] #view-home #home-title{overflow-wrap:anywhere}
