/* "Get the app" pages (/party/app, /prayer/app) and the app buttons on /party and /prayer. Loaded after site.css. */
.t-party { --bg:#2a1aa8; --surface:#3321c4; --ink:#ffffff; --muted:#d9d3ff; --line:#4a39d6; --brand:#ffd23f; --hl:#ffd23f; --hl-ink:#1b1240; --panel:#1b1240; --panel-ink:#ffffff; --panel-muted:#c9c2f2; --cta:#ffd23f; --cta-ink:#1b1240; --tint:#4433d9; --shadow:20 10 80; }
.t-party .top .mark, .t-party .back { color: #fff; }
.t-party .eyebrow { background: #ffd23f; color: #1b1240; }
.t-party h1, .t-party h2 { color: #fff; }
.t-party .faq summary, .t-party .faq p { color: #1b1240; }
.t-party .foot, .t-party .foot a, .t-party .foot .d { color: #d9d3ff; }
.app-hero { display: grid; gap: 22px; padding-block: 8px 24px; }
.app-hero .logo { width: 104px; height: 104px; border-radius: 24px; box-shadow: 0 20px 40px -18px rgb(0 0 0 / .5); }
.app-box { max-width: 560px; padding: 24px 22px; border-radius: 26px; background: var(--panel); color: var(--panel-ink); }
.app-lead { font-family: var(--display); font-size: 22px; line-height: 1.25; }
.app-box .badges { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-top: 16px; }
.app-box .badge { display: inline-block; line-height: 0; }
.app-box .badge img { width: auto; }
.app-box .badge .ios { height: 54px; }
.app-box .badge .gp { height: 80px; margin: -13px -9px; } /* Google's badge file carries its own clear space */
.app-box .qr { display: flex; align-items: center; gap: 16px; margin-top: 18px; padding: 12px; border-radius: 16px; background: #fff; color: #111; max-width: 340px; }
.app-box .qr img { width: 132px; height: 132px; flex: none; }
.app-box .qr p { font-size: 16px; line-height: 1.35; }
.app-box .form-wrap { margin-top: 22px; padding-top: 18px; border-top: 1px solid rgb(255 255 255 / .18); }
.app-box .form-wrap h3 { color: var(--panel-ink); font-size: 20px; }
.app-box .consent-note, .app-box .consent-note a { color: var(--panel-muted); }
.app-box .form-err { color: #ffb4a8; }
.app-box #app-ok { margin-top: 12px; font-weight: 700; }
.app-list { display: grid; gap: 12px; margin-top: 22px; }
.app-list > div { padding: 18px 20px; border-radius: 18px; background: var(--surface); border: 1px solid var(--line); }
.t-party .app-list > div { background: rgb(255 255 255 / .1); border-color: transparent; color: #fff; }
.app-list b { display: block; font-family: var(--display); font-size: 20px; margin-bottom: 4px; }
.app-list span { color: var(--muted); font-size: 17px; line-height: 1.45; }
.t-party .app-list span { color: #d9d3ff; }
.app-alt { margin-top: 22px; font-size: 16px; color: var(--muted); }
.app-alt a { font-weight: 700; }
/* app button on section pages */
.btn.app { gap: 8px; }
.t-party .btn.app, .t-prayer .btn.app { box-shadow: 0 1px 0 rgb(0 0 0 / .12), 0 10px 24px -12px rgb(var(--shadow) / .55); }
.app-strip { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; margin-top: 0; padding: 16px 18px; border-radius: var(--r-box); background: var(--panel); color: var(--panel-ink); }
.app-strip b { font-family: var(--display); font-size: 20px; font-weight: 400; flex: 1 1 220px; line-height: 1.25; }
.app-strip b small { display: block; font: 400 15px var(--body); color: var(--panel-muted); margin-top: 2px; }
.app-strip .btn { min-height: 48px; font-size: 16px; }
.top .back.app-link { font-weight: 800; color: var(--ink); text-decoration: underline; text-underline-offset: 4px; }
@media (max-width: 479px) { .top .back.all { display: none; } }
@media (min-width: 960px) { .app-hero { grid-template-columns: 1fr auto; align-items: center; } .app-hero .logo { width: 160px; height: 160px; border-radius: 36px; } }