/* LM Finder visual layer. Original implementation inspired by atmospheric app interfaces. */
.app{position:relative;isolation:isolate;background:var(--page);box-shadow:0 0 90px #091d3430}
.finder-atmosphere{position:fixed;inset:0 auto 0 50%;transform:translateX(-50%);width:min(540px,100%);overflow:hidden;pointer-events:none;z-index:-1;background:linear-gradient(165deg,var(--tint),var(--page) 72%)}
.ambient-glow{position:absolute;width:120%;height:620px;top:-210px;left:-20%;background:radial-gradient(ellipse,color-mix(in srgb,var(--accent) 20%,transparent),transparent 65%);opacity:.75}
.ambient-dots{position:absolute;inset:0;opacity:.32}
.ambient-dots i{position:absolute;width:3px;height:3px;border-radius:50%;background:var(--accent);opacity:.5;top:18%;left:8%}
.ambient-dots i:nth-child(2){left:88%;top:32%;width:4px;height:4px;animation-delay:-7s}
.ambient-dots i:nth-child(3){left:52%;top:8%;animation-delay:-13s}
.ambient-dots i:nth-child(4){left:93%;top:70%;animation-delay:-4s}
.ambient-dots i:nth-child(5){left:5%;top:84%;animation-delay:-17s}
.ambient-dots i:nth-child(6){left:68%;top:49%;animation-delay:-10s}
header{padding-top:18px;padding-bottom:14px}
.icon-button{border:1px solid var(--line);box-shadow:0 4px 14px #091d3407}
.wordmark{font-weight:800;letter-spacing:-.65px}
.offline-bar{padding-bottom:19px}
.offline-bar button{background:var(--surface);box-shadow:0 3px 10px #091d3405}
.home-intro{position:relative;border:1px solid var(--line);border-radius:22px;padding:18px 14px 14px;background:linear-gradient(130deg,var(--surface),var(--tint));box-shadow:0 8px 26px #091d3408;margin:1px 0 25px;overflow:hidden}
.home-tag{font-size:.875rem;line-height:1.5;margin:0 0 14px;text-align:left;color:var(--ink);max-width:90%}
.home-intro .searchbox{margin:0;border-radius:14px;box-shadow:0 3px 10px #091d3405}
.heading{margin-top:28px;margin-bottom:14px}
.heading h2{font-weight:750}
.tiles{gap:12px}
.tile{border-radius:20px;background:var(--surface);box-shadow:0 5px 18px #091d3407;padding-right:48px}
.pathway-card{min-height:88px;padding-left:15px;border-color:var(--item-line);background:linear-gradient(115deg,var(--surface) 28%,var(--item-tint));overflow:hidden}
.pathway-card::before{content:'';position:absolute;left:0;top:24%;height:52%;width:3px;border-radius:0 4px 4px 0;background:var(--item-accent);opacity:.65}
.pathway-card .nav-symbol{filter:drop-shadow(0 5px 5px #091d3420)}
.pathway-card .label{font-weight:750}
.tile .arrow{display:grid;place-items:center;right:12px;width:26px;height:26px;border-radius:50%;font-size:1.35rem;background:var(--item-tint);border:1px solid var(--item-line)}
.tile.topic{min-height:76px}
.full-choice,.layer-button{border-radius:18px;box-shadow:0 4px 14px #091d3406;background:var(--surface)}
.full-choice[aria-expanded=true],.layer-button[aria-expanded=true]{box-shadow:0 0 0 1px var(--accent);background:var(--tint)}
.full-choice .arrow,.layer-button .arrow{right:14px}
.layer{border-radius:18px;box-shadow:0 6px 20px #091d3406}
.section-switcher{border-radius:18px;padding:6px;background:var(--tint)}
.section-switcher button{border-radius:12px}
.answer,.verse{background:var(--tint)}
.home-prayer-invitation .tile{background:linear-gradient(115deg,var(--surface),var(--item-tint));min-height:88px}
nav{bottom:calc(8px + var(--safe));width:calc(min(540px,100%) - 20px);border:1px solid var(--line);border-radius:23px;padding:10px 12px 11px;background:var(--nav-surface);box-shadow:0 7px 30px #091d3429;backdrop-filter:blur(16px)}
nav button{min-width:72px;gap:4px}
nav .active:after{height:3px;width:20px;margin-top:1px}
main{padding-bottom:calc(7.5rem + var(--safe))}
#offlineDialog{background:var(--surface);color:var(--ink)}
html[data-appearance=bold] .app,html[data-appearance=midnight] .app{box-shadow:0 0 90px #00000050}
html[data-appearance=bold] .finder-atmosphere,html[data-appearance=midnight] .finder-atmosphere{background:linear-gradient(160deg,var(--tint),var(--page) 70%)}
html[data-appearance=bold] .tile,html[data-appearance=midnight] .tile{box-shadow:0 7px 20px #00000018}
html[data-appearance=bold] .ambient-glow,html[data-appearance=midnight] .ambient-glow{opacity:1}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.tile,.full-choice,.layer-button{transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}.tile:hover{transform:translateY(-2px);box-shadow:0 9px 22px #091d3414}.full-choice:hover,.layer-button:hover{border-color:var(--accent)}}
@media(prefers-reduced-motion:no-preference){html[data-motion=gentle] .ambient-glow{animation:finder-glow 24s ease-in-out infinite alternate}html[data-motion=gentle] .ambient-dots i{animation-name:finder-drift;animation-duration:22s;animation-timing-function:ease-in-out;animation-iteration-count:infinite}}
@keyframes finder-glow{from{transform:translate3d(-5%,-1%,0) scale(.95)}to{transform:translate3d(17%,11%,0) scale(1.12)}}
@keyframes finder-drift{0%,100%{transform:translate3d(0,0,0);opacity:.15}50%{transform:translate3d(8px,-25px,0);opacity:.65}}
html[data-motion=still] .ambient-glow,html[data-motion=still] .ambient-dots i{animation:none}
body[data-view=article] .ambient-dots{display:none}
@media(prefers-reduced-motion:reduce){.ambient-glow,.ambient-dots i{animation:none!important}.ambient-dots{display:none}}
@media(max-width:380px){header{padding-top:13px}.home-intro{padding:15px 12px}.pathway-card{min-height:81px}.tile{padding-right:43px}.tile .arrow{right:10px;width:24px;height:24px}.home-tag{font-size:.8125rem}}
