:root{color-scheme:dark;font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;--bg:#031b14;--fg:#f5fff8;--muted:#bed6c8;--border:#447d60;--accent:#308b5c}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#03170f;color:var(--fg)}button,input,select,textarea{font:inherit}button{cursor:pointer}.app{width:100%;max-width:600px;margin:auto;height:100dvh;min-height:0;display:flex;flex-direction:column;overflow:hidden;background:radial-gradient(at 50% 30%,#0a3928,#031b14 65%)}header{height:clamp(195px,26dvh,300px);min-height:0;flex-shrink:0;position:relative;display:flex;align-items:flex-end;padding:18px 22px 22px;background:linear-gradient(0deg,#031b14 0%,#031b1400 49%),url('/sunset_background_clean.png') center 23%/cover no-repeat}.wordmark{position:relative;z-index:1;display:flex;align-items:center;gap:10px;flex-wrap:wrap}header b{font-size:clamp(34px,8vw,48px);line-height:1;letter-spacing:.11em;font-weight:720}.brand-star{font-size:30px;color:#73e1a2}header small{flex-basis:100%;display:block;color:#fff;font-size:clamp(15px,3.7vw,18px);margin-top:6px;text-shadow:0 1px 8px #042319}#settings{position:absolute;top:20px;right:20px;width:51px;height:51px;border-radius:50%;border:1px solid #8fbf9e;background:#092f22;color:white;font-size:26px}main{flex:1;display:flex;flex-direction:column;min-height:0;gap:0;padding:11px 16px max(12px,env(safe-area-inset-bottom))}.filters{display:grid;grid-template-columns:1fr 1.18fr 1.42fr;gap:10px;width:100%;flex-shrink:0;margin:0 0 13px}.filters button,.filters select{width:100%;min-width:0;border:1px solid #477d5e;border-radius:18px;padding:12px 7px;min-height:48px;background:#092a20;color:#f3faf5;font-size:clamp(14px,3.7vw,17px);text-align:center}.filters select{text-align-last:center;appearance:none;background-image:linear-gradient(45deg,transparent 50%,#a6d9b6 50%),linear-gradient(135deg,#a6d9b6 50%,transparent 50%);background-position:calc(100% - 15px) 21px,calc(100% - 10px) 21px;background-size:5px 5px;background-repeat:no-repeat;padding-right:17px}.filters .active{background:#2d8556;border-color:#9addb4;box-shadow:0 0 14px #55bd8740}.step-bar{display:flex;align-items:center;gap:10px;min-height:59px;flex-shrink:0;margin-bottom:14px}.step-circle{--step-progress:16.6667%;height:55px;width:55px;flex-shrink:0;border-radius:50%;display:grid;place-items:center;font-size:23px;font-weight:720;background:radial-gradient(closest-side,#08271e 76%,transparent 79%),conic-gradient(#53cd8a var(--step-progress),#204e3a 0)}.step-bar .muted{font-size:clamp(13px,3.4vw,16px);color:#e3eee7;white-space:nowrap}.step-progress{display:grid;grid-template-columns:repeat(12,1fr);gap:3px;flex:1;min-width:40px;max-width:165px}.step-progress i{height:7px;border-radius:6px;background:#245240}.step-progress i.complete{background:#50cd89}#all-steps{margin-left:auto;flex-shrink:0;padding:12px 11px;border:1px solid #528568;border-radius:22px;background:#103f2d;color:white;font-size:13px}.card{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden;position:relative;border-radius:22px;border:1px solid #3c8d60;padding:19px 19px 15px;background:linear-gradient(180deg,#07382166,#063022a9 44%,#05291ce6 85%),url('/topographic_background_clean.png') center/cover no-repeat;box-shadow:inset 0 1px #a8eac821}.card-head{display:flex;align-items:center;justify-content:space-between;flex-shrink:0}.tag{display:flex;align-items:center;gap:12px;font-size:14px;letter-spacing:.13em;text-transform:uppercase;font-weight:650;color:#d6eee0}.tag:before{content:attr(data-icon);display:grid;place-items:center;border-radius:50%;border:1px solid #5d9e76;background:#195239;font-size:22px;width:43px;height:43px;color:white}#fav{height:43px;width:43px;border-radius:50%;border:1px solid #659678;background:#082d22;color:#fff;font-size:27px}h1{font-weight:760;font-size:clamp(28px,6.6vw,41px);line-height:1.11;letter-spacing:-.025em;margin:clamp(16px,3vh,30px) 0 11px;color:#fff}.card>p{font-size:clamp(16px,4vw,19px);line-height:1.46;color:#c7ded0;white-space:pre-line;margin:0 0 19px}.bottom{margin-top:auto;border-top:1px solid #4b8061;padding-top:14px;font-size:14px;color:#a7ccb2}.reach{border:1px solid #41775a;border-radius:18px;padding:15px;background:#072d22e8;margin:5px 0 0}.reach label,.send-label{display:block;font-size:15px;color:#d6eadf;margin-bottom:10px}.reach select{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}.draft-options,.reach-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.draft-options button,.reach-buttons button{min-width:0;min-height:49px;border-radius:12px;background:#113e2e;border:1px solid #4c8463;color:white;font-size:clamp(11px,2.9vw,15px)}.draft-options button.selected{background:#297a51;border-color:#91cda7}.reach-buttons button{display:flex;align-items:center;justify-content:center;gap:7px;padding:4px}.reach-buttons button span{display:grid;place-items:center;flex-shrink:0;background:#4aa578;color:white;border-radius:50%;height:33px;width:33px;font-size:16px}.reach-divider{height:1px;background:#3f6f55;margin:15px 0}.link-button{background:none;border:none;text-decoration:underline;color:#a8d6b9;font-size:12px;padding:9px 0 0}.reach-note{font-size:12px;color:#b2cebd;margin:7px 0 0}.card:has(.reach:not([hidden])) h1{font-size:clamp(23px,5.6vw,34px);margin:15px 0 8px}.card:has(.reach:not([hidden]))>p{font-size:clamp(13px,3.3vw,16px);line-height:1.33;margin:0 0 9px}.card:has(.reach:not([hidden])) .bottom{display:none}.actions{display:grid;grid-template-columns:1.2fr 1.15fr .78fr;gap:9px;flex-shrink:0;margin-top:14px}.actions button{display:flex;align-items:center;justify-content:center;gap:5px;padding:11px 6px;min-height:62px;border:1px solid #4a8261;border-radius:16px;background:#0b3628;color:#fff;font-size:clamp(13px,3.3vw,16px)}.actions button.primary{background:#2f8a5a;border-color:#66b588}.actions button span{white-space:nowrap}.foot,main>.muted{display:none}dialog{width:min(94vw,530px);max-height:88dvh;overflow:auto;border:1px solid #397856;border-radius:20px;background:#092d22;padding:20px;color:white}dialog::backdrop{background:#00150ebd}dialog label{display:block;margin:12px 0;color:#deece3;font-size:14px}dialog input,dialog select,dialog textarea{display:block;width:100%;margin-top:6px;background:#133f2e;border:1px solid #588b6c;border-radius:9px;padding:11px;color:white}dialog textarea{min-height:100px}dialog button{background:#184b35;color:white;border:1px solid #598b6b;border-radius:10px;padding:9px}.settings-section{border:1px solid #376c4f;border-radius:12px;margin:11px 0}.settings-section summary{padding:12px;cursor:pointer}.settings-section .settings-content{padding:12px}.settings-section .subtitle{display:block;font-size:12px;color:#acd0b6}.muted,.notice,.settings-help{color:#b3d3c0}.entry{padding:10px 0;border-bottom:1px solid #386b4e}.entry button{margin:3px}#library{max-height:38dvh;overflow:auto}@media(max-height:840px){header{height:clamp(155px,23dvh,210px)}main{padding-top:7px}.filters{margin-bottom:7px}.filters button,.filters select{min-height:40px;padding-top:8px;padding-bottom:8px}.step-bar{min-height:42px;margin-bottom:7px}.step-circle{height:42px;width:42px;font-size:19px}.step-progress i{height:5px}.card{padding:12px}.tag:before,#fav{width:34px;height:34px;font-size:19px}.card h1{margin:10px 0 7px;font-size:clamp(23px,6vw,32px)}.card>p{font-size:clamp(13px,3.5vw,16px);margin-bottom:8px}.reach{padding:9px}.reach label,.send-label{font-size:12px;margin-bottom:5px}.draft-options button,.reach-buttons button{min-height:35px}.reach-divider{margin:7px 0}.reach-buttons button span{height:25px;width:25px;font-size:12px}.link-button{padding-top:4px}.reach-note{margin-top:4px;font-size:10px}.actions{margin-top:8px}.actions button{min-height:44px}.card:has(.reach:not([hidden])) h1{margin:8px 0 5px}.card:has(.reach:not([hidden]))>p{font-size:13px;margin-bottom:6px}}@media(max-width:370px){.filters{gap:5px}.filters button,.filters select{font-size:12px}.step-bar{gap:5px}.step-progress{gap:2px}.actions button{font-size:11px}}
/* v21: visible menu affordance, tactile progress, category icons, contained reach-out */
.category-select-wrap{position:relative;min-width:0;width:100%}
.category-select-wrap select{width:100%;display:block;padding-right:30px!important;background-image:none!important;appearance:none!important;-webkit-appearance:none!important}
.category-select-wrap::after{content:"⌄";position:absolute;right:13px;top:50%;transform:translateY(-58%);font-size:23px;line-height:1;color:#c4efd3;pointer-events:none;font-weight:700}
.step-circle{cursor:pointer;border:0;color:#fff;font-family:inherit;box-shadow:0 0 0 1px #3e7654}
.step-circle:focus-visible{outline:2px solid #a1eabc;outline-offset:3px}
.tag:before{font-family:"Segoe UI Emoji","Noto Color Emoji",system-ui,sans-serif;font-size:21px}
.action-icon{font-size:24px;line-height:1;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}
.card:has(.reach:not([hidden])){min-height:0;overflow:hidden}
.card:has(.reach:not([hidden])) .reach{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#4c8463 transparent}
.card:has(.reach:not([hidden])) h1{flex-shrink:0}
.card:has(.reach:not([hidden]))>p{flex-shrink:0}
@media(max-width:600px){
.card:has(.reach:not([hidden])){padding:12px 13px!important}
.card:has(.reach:not([hidden])) h1{font-size:clamp(23px,5.7vw,30px);margin:10px 0 5px}
.card:has(.reach:not([hidden]))>p{font-size:clamp(13px,3.2vw,15px);line-height:1.28;margin-bottom:7px}
.card:has(.reach:not([hidden])) .reach{padding:9px}
.card:has(.reach:not([hidden])) .reach label,.card:has(.reach:not([hidden])) .send-label{font-size:13px;margin-bottom:6px}
.card:has(.reach:not([hidden])) .draft-options button,.card:has(.reach:not([hidden])) .reach-buttons button{min-height:39px}
.card:has(.reach:not([hidden])) .reach-divider{margin:8px 0}
.card:has(.reach:not([hidden])) .link-button{padding-top:5px}
.card:has(.reach:not([hidden])) .reach-note{margin-top:3px}
}

/* v22 - visual viewport bounds after browser/PWA pull-to-refresh */
html,body{height:100%;height:100dvh;min-height:0;overflow:hidden;overscroll-behavior-y:none}
.app{height:var(--anchor-viewport-height,100dvh);max-height:var(--anchor-viewport-height,100dvh);min-height:0;overflow:hidden}
main{flex:1 1 auto;min-height:0;overflow:hidden}
.card{min-height:0}
header{flex-shrink:0}
.actions{flex-shrink:0}
@supports (height:100svh){.app{height:var(--anchor-viewport-height,100svh);max-height:var(--anchor-viewport-height,100svh)}}
@supports (padding:env(safe-area-inset-top)){header{padding-top:max(18px,env(safe-area-inset-top))}}

.tag::before{display:none!important;content:none!important}.category-icon{width:43px;height:43px;padding:10px;flex-shrink:0;border-radius:50%;background:#195239;border:1px solid #5d9e76;fill:none;stroke:white;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.actions{grid-template-columns:repeat(2,minmax(0,1fr))!important}.actions button{gap:12px;font-size:clamp(15px,3.8vw,18px)}.actions .action-icon{width:27px;height:27px;fill:none;stroke:white;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}@media(max-height:840px){.category-icon{width:35px;height:35px;padding:8px}}
/* v24: custom SMS composer, only show contact setup if incomplete */
#set-contacts[hidden]{display:none!important}
.reach .custom-label{font-size:13px;color:#d6eadf;margin:9px 0 5px;display:block}
.reach #custom-message{box-sizing:border-box;display:block;position:static;width:100%;min-height:52px;max-height:92px;resize:vertical;background:#0b3528;color:#f6fff8;border:1px solid #4c8463;border-radius:11px;padding:9px 11px;font-size:14px;line-height:1.3;opacity:1;pointer-events:auto}
.reach #custom-message::placeholder{color:#9fc4ae}
.card:has(.reach:not([hidden])) .reach{overflow-y:auto}
@media(max-height:840px){.reach .custom-label{margin:6px 0 4px;font-size:12px}.reach #custom-message{min-height:43px;max-height:70px;font-size:13px;padding:7px 9px}}

/* Swipe horizontally to navigate anchors; preserve vertical scrolling of long tool content. */
.card{touch-action:pan-y}

/* v26: dedicated keyboard composition layout; keep recipients visible */
.app:has(#custom-message:focus) header,
.app:has(#custom-message:focus) .filters,
.app:has(#custom-message:focus) .step-bar,
.app:has(#custom-message:focus) .actions{display:none!important}
.app:has(#custom-message:focus) main{padding:8px 12px max(6px,env(safe-area-inset-bottom))!important;min-height:0}
.app:has(#custom-message:focus) .card{flex:1 1 auto!important;min-height:0!important;padding:12px!important;overflow:hidden}
.app:has(#custom-message:focus) .card-head{flex-shrink:0}
.app:has(#custom-message:focus) .card h1{font-size:clamp(20px,5vw,27px)!important;margin:9px 0 8px!important;flex-shrink:0}
.app:has(#custom-message:focus) .card>p{display:none!important}
.app:has(#custom-message:focus) .reach{display:flex!important;flex-direction:column;gap:6px;min-height:0;flex:1 1 auto;overflow-y:auto;padding:10px!important;margin:0!important}
.app:has(#custom-message:focus) .reach>label[for="reach-message"],
.app:has(#custom-message:focus) .draft-options,
.app:has(#custom-message:focus) .reach-divider,
.app:has(#custom-message:focus) .link-button{display:none!important}
.app:has(#custom-message:focus) .reach .custom-label{order:0;margin:0!important;font-size:13px!important}
.app:has(#custom-message:focus) .reach #custom-message{order:1;display:block!important;flex:0 0 auto;height:clamp(57px,14dvh,100px);min-height:48px!important;max-height:105px!important;font-size:16px!important;resize:none}
.app:has(#custom-message:focus) .reach .send-label{order:2;flex-shrink:0;margin:4px 0 1px!important;font-size:13px!important}
.app:has(#custom-message:focus) .reach .reach-buttons{order:3;flex:0 0 auto;gap:6px!important}
.app:has(#custom-message:focus) .reach .reach-buttons button{min-height:42px!important}
.app:has(#custom-message:focus) .reach .reach-note{display:none!important}
@media(max-height:480px){
 .app:has(#custom-message:focus) .card-head{display:none}
 .app:has(#custom-message:focus) .card h1{font-size:18px!important;margin:0 0 5px!important}
 .app:has(#custom-message:focus) .reach #custom-message{height:48px!important}
}

/* v27: contact links and always-visible keyboard editor exit */
.reach-buttons a{display:flex;align-items:center;justify-content:center;gap:7px;min-height:49px;padding:4px;min-width:0;border-radius:12px;background:#113e2e;border:1px solid #4c8463;color:white;text-decoration:none;font-size:clamp(11px,2.9vw,15px)}
.reach-buttons a span{display:grid;place-items:center;flex-shrink:0;background:#4aa578;color:white;border-radius:50%;height:33px;width:33px;font-size:16px}
#exit-compose{display:none}
.app:has(#custom-message:focus) .reach #exit-compose{display:grid!important;place-items:center;position:absolute;right:8px;top:8px;z-index:10;width:38px;height:38px;border-radius:50%;background:#164d37;border:1px solid #77aa88;color:#fff;font-size:28px;line-height:1;cursor:pointer}
.app:has(#custom-message:focus) .reach{position:relative;padding-top:12px!important}
.app:has(#custom-message:focus) .reach .custom-label{padding-right:48px}
@media(max-height:840px){.reach-buttons a{min-height:35px}.reach-buttons a span{height:25px;width:25px;font-size:12px}}
.app:has(#custom-message:focus) .reach .reach-buttons a{min-height:42px!important}

/* v31 verse meditation: separate italic Scripture passage below takeaway. */
.scripture-quote[hidden]{display:none!important}
.scripture-quote{font-size:clamp(15px,3.8vw,19px);line-height:1.48;font-style:italic;color:#e3efdf;margin:clamp(18px,4vh,35px) 0 15px;padding:16px 18px 15px;border-left:3px solid #69ba87;border-radius:0 10px 10px 0;background:#092f2390;overflow-y:auto;min-height:0;max-height:50%;flex:0 1 auto}
.card:has(.scripture-quote:not([hidden])) .bottom{flex-shrink:0}
.card:has(.scripture-quote:not([hidden])){overflow:hidden}
@media(max-height:800px){.scripture-quote{margin:12px 0 9px;padding:10px 12px;font-size:14px;max-height:42%}}

.scripture-quote[role="link"]{cursor:pointer;text-decoration:underline;text-underline-offset:4px}.scripture-quote[role="link"]:focus-visible{outline:2px solid #8fdbb0;outline-offset:3px}

/* Respect the associated-step field's hidden state for non-Step categories. */
#anchor-step-row[hidden]{display:none!important}