:root{color-scheme:dark;--bg:#112023;--ink:#f2ecdf;--muted:#a7b8b5;--gold:#d3bb88;--line:#d3bb8829;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px)}
*{box-sizing:border-box}html{height:100%;background:var(--bg);overflow-x:clip}body{margin:0;height:100vh;height:100dvh;min-height:480px;padding-top:var(--safe-top);display:grid;grid-template-rows:58px minmax(0,1fr) 2px;background:radial-gradient(ellipse at 20% 5%,#253b3d 0,transparent 65%),var(--bg);color:var(--ink);font:14px/1.5 system-ui,sans-serif}
button,a,select{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;border:1px solid var(--line);border-radius:12px;background:transparent;min-height:44px;min-width:44px;padding:8px 14px;touch-action:manipulation}button:hover{background:#ffffff06;border-color:var(--gold)}button:focus-visible,a:focus-visible,select:focus-visible{outline:2px solid var(--gold);outline-offset:4px}button:disabled{opacity:.3;cursor:default}
header{width:100%;max-width:1168px;justify-self:center;padding:0 24px;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:16}.brand{display:flex;gap:10px;align-items:center;text-decoration:none;color:var(--gold);font:25px Georgia,serif}.brand span{font-size:18px;color:var(--ink)}.header-actions{display:flex;align-items:center;gap:8px}#mode{border-radius:24px;font-size:11px;letter-spacing:.5px;padding:6px 12px}#settings{border:0;font-size:22px;padding:0}
main{width:100%;max-width:680px;margin:0 auto;padding:14px 34px 132px;min-height:0;display:flex;flex-direction:column}.mystery-heading{text-align:center;flex-shrink:0;padding:10px 0 28px}.mystery-heading>span{font-size:9px;letter-spacing:2.5px;color:var(--gold)}.mystery-heading h1{font:32px/1.18 Georgia,serif;letter-spacing:-.5px;margin:10px 0}.mystery-heading p{font:italic 16px/1.5 Georgia,serif;color:var(--muted);margin:0}
.prayer,.guided .prayer{width:100%;min-height:0;flex:1;display:grid;grid-template-rows:24px minmax(0,1fr) 24px 46px;gap:12px;padding:0}.eyebrow{text-align:center;color:var(--gold);font-size:9px;letter-spacing:2px;text-transform:uppercase;align-self:center}
#scriptureCard,.guided .prayer>#scriptureCard,.prayer-heading,.phrase-row,.hint{display:none!important}
#guidedReader,.guided #guidedReader{display:block!important;position:relative;min-height:0;height:100%;overflow-x:hidden;overflow-y:auto;overflow-anchor:none;scroll-behavior:auto!important;scrollbar-width:none;border-top:1px solid var(--line);border-bottom:1px solid var(--line);pointer-events:none}
#guidedReader::-webkit-scrollbar{display:none}#readingTrack{display:block;width:100%;height:auto;transform:none!important;padding:24px 12px 48px}#readingState{display:none}
.reading-section{margin:0;padding:0}.reading-section+.reading-section{margin-top:36px;padding-top:28px;border-top:1px solid var(--line)}.reading-title{font:10px/1.5 system-ui,sans-serif;letter-spacing:2px;text-transform:uppercase;color:var(--gold);margin-bottom:14px}.reading-text{font:25px/1.65 Georgia,serif;letter-spacing:.05px;margin:0;color:var(--ink);text-align:left;text-wrap:pretty}.reading-reference{font:10px/1.5 system-ui;color:var(--muted);margin-top:16px;letter-spacing:.5px}
#holdReadState,.guided #holdReadState{display:block;position:static;min-height:24px;margin:0;color:var(--muted);font:10px/1.5 system-ui;text-align:center;align-self:center;letter-spacing:.25px;background:none;padding:0;pointer-events:none}
.controls{display:grid;grid-template-columns:44px 1fr 44px;align-items:center;gap:12px;position:relative;z-index:14}.controls button{height:44px;border-radius:50%;padding:0;font-size:19px;background:var(--bg)}.controls #play{border-radius:24px;background:#d3bb8810;color:var(--gold);border-color:#d3bb8845;font-size:12px;letter-spacing:.3px;font-weight:500}.controls #play:hover{background:#d3bb8820}
#progress{appearance:none;width:100%;height:2px;border:0;background:#ffffff06}#progress::-webkit-progress-bar{background:#ffffff06}#progress::-webkit-progress-value{background:#d3bb8860}#progress::-moz-progress-bar{background:#d3bb8860}footer{display:none}
.rosary{--stone-light:#b7e9f0;--stone-main:#4ba7bd;--stone-dark:#176078;--stone-edge:#102e3d;--metal-light:#eef5f4;--metal-main:#9aafb6;--metal-dark:#435960;position:fixed;right:max(0px,calc((100vw - 1168px)/2 - 25px));bottom:0;width:360px;height:260px;z-index:12;pointer-events:none;overflow:hidden}
#rosaryFallback{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none;overflow:visible}#beads{width:100%;height:100%;display:block;opacity:0;pointer-events:none}.rosary.rendered #beads{opacity:1}.rosary.rendered #rosaryFallback{opacity:0}.bead-grain,.skull-charm{display:none}
.rosary[data-theme=joyful]{--stone-light:#d5ad76;--stone-main:#a17a49;--stone-dark:#6b4b2c;--stone-edge:#3c291c;--metal-light:#f3dca5;--metal-main:#ba9559;--metal-dark:#67502d}.rosary[data-theme=joyful] .bead-grain{display:block}.rosary[data-theme=sorrowful]{--stone-light:#7d858b;--stone-main:#343b44;--stone-dark:#10151e;--stone-edge:#04080e;--metal-light:#d3d3db;--metal-main:#7d7b88;--metal-dark:#383743}.rosary[data-theme=sorrowful] .skull-charm{display:block}.rosary[data-theme=glorious]{--stone-light:#fffef5;--stone-main:#eee5ce;--stone-dark:#b5b0a1;--stone-edge:#696b68;--metal-light:#fff1b9;--metal-main:#d6b469;--metal-dark:#85632f}
#holdBead{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:82px;height:82px;min-width:82px;padding:0;border:0;border-radius:50%;background:transparent;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;pointer-events:auto}#holdBead[hidden]{display:none}.hold-ring{position:absolute;inset:0;width:100%;height:100%;overflow:visible;transform:rotate(-90deg);pointer-events:none}.hold-ring circle{fill:none;stroke:var(--gold);stroke-width:1.5;stroke-dasharray:289;stroke-dashoffset:calc(289 * (1 - var(--hold-progress,0)));opacity:.75}.hold-ring .hold-track{stroke-width:.7;stroke-dasharray:none;opacity:.3}#holdBead:after{content:'HOLD';position:absolute;top:calc(100% + 6px);left:0;right:0;text-align:center;font:8px/1.4 system-ui;letter-spacing:2px;color:var(--gold);pointer-events:none}#holdBead[aria-pressed=true]:after{content:'PRAY'}#holdBead[aria-pressed=true]{box-shadow:0 0 28px #e8cd9018}#holdStatus{display:none}.rosary-meta{position:absolute;left:6px;bottom:3px}.rosary-meta button{pointer-events:auto;background:#112023c0;color:var(--muted);font-size:9px;padding:0 8px;min-height:34px;min-width:0;border-color:transparent}.rosary-meta span{display:none}.rosary.wide{right:12px;bottom:70px;width:min(440px,calc(100vw - 24px));height:290px;background:#112023f5;border:1px solid var(--line);border-radius:18px;pointer-events:auto}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
dialog{width:calc(100% - 36px);max-width:480px;max-height:85dvh;overflow:auto;border:1px solid #d3bb8840;border-radius:20px;background:#182b2e;color:var(--ink);padding:28px;box-shadow:0 24px 80px #0008}dialog::backdrop{background:#061114b8;backdrop-filter:blur(5px)}dialog h2{font:27px/1.25 Georgia,serif;margin:8px 0 24px}dialog p{line-height:1.7;color:#c4ceca}.close{float:right;border:0;font-size:20px;padding:0}dialog label{display:block;margin:20px 0;color:var(--muted);font-size:12px}select{display:block;width:100%;margin-top:8px;padding:12px;border:1px solid var(--line);border-radius:10px;color:var(--ink);background:#102023;font:14px system-ui}.check{display:flex!important;gap:10px;align-items:center}input[type=checkbox]{accent-color:var(--gold);width:18px;height:18px}.small{font-size:11px}#expandedVerse,#fullPrayerText{font:23px/1.65 Georgia,serif}#panel button:not(.close){margin:5px 3px 5px 0;font-size:12px}.reader-check-label{font:9px system-ui;color:var(--gold)}
@media(max-width:700px){body{grid-template-rows:54px minmax(0,1fr) 2px}header{padding:0 18px}.brand{gap:8px}.brand span{font-size:16px}main{padding:10px 26px 138px}.mystery-heading{padding:8px 0 24px}.mystery-heading h1{font-size:28px}.mystery-heading p{font-size:15px}.prayer,.guided .prayer{gap:10px}.reading-text{font-size:23px;line-height:1.65}#readingTrack{padding:22px 4px 48px}.rosary{right:-50px;bottom:calc(-35px + var(--safe-bottom));width:340px;height:260px}.rosary-meta{left:auto;right:56px;bottom:43px}.rosary-meta button{font-size:8px;min-height:32px}.rosary.wide{right:12px;bottom:65px;width:calc(100vw - 24px)}}
@media(max-height:660px) and (orientation:portrait){body{grid-template-rows:48px minmax(0,1fr) 2px}main{padding:2px 22px 112px}.mystery-heading{padding:2px 0 14px}.mystery-heading h1{font-size:24px;margin:8px 0}.mystery-heading p{display:none}.prayer,.guided .prayer{grid-template-rows:18px minmax(0,1fr) 22px 44px;gap:6px}.reading-text{font-size:21px;line-height:1.55}#readingTrack{padding:16px 4px 36px}.reading-title{margin-bottom:10px}.rosary{right:-46px;bottom:calc(-35px + var(--safe-bottom));width:310px;height:230px}#holdBead{width:78px;height:78px;min-width:78px}.rosary-meta{right:51px;bottom:43px}}
@media(orientation:landscape) and (max-height:650px){body{grid-template-rows:44px minmax(0,1fr) 2px;min-height:320px}main{max-width:960px;display:grid;grid-template-columns:.7fr 1.3fr;gap:36px;padding:8px 100px 16px 24px}.mystery-heading{padding:0}.mystery-heading h1{font-size:25px}.prayer,.guided .prayer{height:100%;gap:5px;grid-template-rows:18px minmax(0,1fr) 20px 40px}.reading-text{font-size:20px;line-height:1.5}#readingTrack{padding:12px 8px 36px}.controls button{height:40px;min-height:40px}.rosary{right:-100px;bottom:-35px;width:240px;height:190px}.rosary-meta{display:none}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Pass 3: natural paragraphs and a gentle edge to the reading window. */
.reading-text p{margin:0}.reading-text p+p{margin-top:1.05em}
#guidedReader,.guided #guidedReader{border:0;mask-image:linear-gradient(to bottom,transparent 0,#000 10px,#000 calc(100% - 26px),transparent 100%);-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 10px,#000 calc(100% - 26px),transparent 100%)}
#readingTrack{padding-bottom:clamp(90px,15dvh,150px)}
.reading-title{font-size:9px;letter-spacing:2.3px;color:#d0b984}
.reading-reference{line-height:1.6;color:#afbfbb}
.prayer>.eyebrow{border-bottom:1px solid var(--line);padding-bottom:10px;align-self:stretch}
/* Pass 4: keep navigation outside the strand and give the overview a real target. */
@media(max-width:700px) and (orientation:portrait){
 .controls{width:calc(100% - 74px);gap:8px;grid-template-columns:40px minmax(0,1fr) 40px}
 .controls button{min-width:40px}.controls #play{font-size:11px;padding:0 6px}
 .rosary-meta{position:fixed;left:24px;right:auto;bottom:calc(20px + var(--safe-bottom))}
 .rosary-meta button{min-height:44px;min-width:108px;font-size:10px;letter-spacing:.3px;background:transparent;padding:0 12px;color:#adbbb6;border:1px solid #d3bb881c;border-radius:24px}
 .rosary.wide .rosary-meta{position:absolute;left:12px;bottom:8px}
 #holdReadState,.guided #holdReadState{font-size:10px;text-align:left;padding-left:4px}
 .prayer,.guided .prayer{grid-template-rows:28px minmax(0,1fr) 24px 46px}
}
@media(max-height:660px) and (orientation:portrait){
 .prayer,.guided .prayer{grid-template-rows:24px minmax(0,1fr) 22px 44px}
 .rosary-meta{bottom:calc(12px + var(--safe-bottom));left:22px}
 .reading-text{font-size:21px;line-height:1.6}
}

#holdBead{transform:translate(calc(-50% + var(--drag-x,0px)),calc(-50% + var(--drag-y,0px)))}
#holdBead:after{content:'HOLD · PULL ↓';letter-spacing:1px;font-size:8px;white-space:nowrap}
#holdBead[aria-pressed=true]:after{content:'PRAY'}

/* Deep mineral color and restrained, warm metal reflections. */
.rosary{--stone-light:#98d0dd;--stone-main:#267b93;--stone-dark:#124354;--stone-edge:#071b2b;--metal-light:#faf1d9;--metal-main:#a9b4b1;--metal-dark:#4c5a58}
.rosary[data-theme=joyful]{--stone-light:#c8a16b;--stone-main:#946638;--stone-dark:#5b3d25;--stone-edge:#30251c}
.rosary[data-theme=sorrowful]{--stone-light:#7e8993;--stone-main:#303b43;--stone-dark:#101920;--stone-edge:#050c12}
.rosary[data-theme=glorious]{--stone-light:#fffdf0;--stone-main:#e3d9c2;--stone-dark:#a69f8f;--stone-edge:#686b68}
.rosary[data-theme=sorrowful] .marian-monogram{display:none}
.hold-ring .hold-track{opacity:.2}.hold-ring circle{stroke-width:1.1}

.pater-skull,.pater-reliquary{display:none}
.fallback-bead[data-pater=true] .ordinary-bead{display:none}
.fallback-bead[data-pater=true] .pater-reliquary{display:block}
.rosary[data-theme=sorrowful] .fallback-bead[data-pater=true] .pater-reliquary{display:none}
.rosary[data-theme=sorrowful] .fallback-bead[data-pater=true] .pater-skull{display:block}
.rosary[data-theme=sorrowful] .medal-charm{display:none}

/* Distinct fallback materials mirror the three-dimensional rosaries. */
.theme-bead,.fallback-cord{display:none}
.rosary[data-theme=joyful] .mineral-bead,.rosary[data-theme=sorrowful] .mineral-bead,.rosary[data-theme=glorious] .mineral-bead{display:none}
.rosary[data-theme=joyful] .joyful-bead,.rosary[data-theme=sorrowful] .sorrowful-bead,.rosary[data-theme=glorious] .glorious-bead{display:block}
.rosary[data-theme=joyful] .fallback-cord,.rosary[data-theme=sorrowful] .fallback-cord{display:block}
.rosary[data-theme=joyful] .fallback-hardware,.rosary[data-theme=sorrowful] .fallback-hardware{display:none}
.rosary .fallback-bead[data-pater=true] .ordinary-bead{display:none}
.rosary[data-theme=joyful] .medal-charm,.rosary[data-theme=glorious] .medal-charm{display:none}

.pater-wood{display:none}
.rosary[data-theme=joyful] .fallback-bead[data-pater=true] .pater-reliquary{display:none}
.rosary[data-theme=joyful] .fallback-bead[data-pater=true] .pater-wood{display:block}

/* Keep the gesture cue in the clear space to the right of the strand. */
#holdBead:after{top:calc(100% + 5px);left:22px;right:auto;font-size:7px;letter-spacing:.7px;opacity:.8}
.rosary[data-theme=luminous]{--stone-light:#b1d7df;--stone-main:#529aad;--metal-main:#b8c8ce;--metal-dark:#50646c}
.rosary[data-theme=sorrowful]{--stone-light:#8c7962;--stone-main:#51483b;--stone-dark:#332e27;--stone-edge:#22241f}
.rosary .medal-charm{display:none}

#holdBead:after{font-size:9px;opacity:.9;letter-spacing:.3px}

/* Sorrowful uses antique silver chain; Joyful retains the knotted cord. */
.rosary[data-theme=sorrowful] .fallback-cord{display:none}
.rosary[data-theme=sorrowful] .fallback-hardware{display:block}

/* Fixed prayer position; separate adjacent targets lock gesture intent. */
#holdBead{transform:translate(-50%,-50%);width:68px;height:68px;min-width:68px}
#holdBead:after{content:'HOLD TO READ';left:0;right:0;font-size:8px;letter-spacing:1px}
.adjacent-bead{position:absolute;transform:translate(-50%,-50%);width:60px;height:60px;min-width:60px;min-height:60px;border:0;border-radius:50%;padding:0;background:transparent!important;pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.adjacent-bead[hidden]{display:none}.adjacent-bead:focus-visible{outline:1px solid var(--gold)}
#guidedReader,.guided #guidedReader{mask-image:linear-gradient(to bottom,transparent 0%,#000 16%,#000 80%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 16%,#000 80%,transparent 100%);overscroll-behavior:contain}
#readingTrack{padding-bottom:72px}#readingTrack .reading-section:first-child{padding-top:8px}
.controls{display:flex;justify-content:flex-start;width:65%}.controls #play{width:100%;background:transparent;border-color:var(--line)}
.controls #back,.controls #next{position:absolute;width:1px;height:1px;min-width:0;min-height:0;clip-path:inset(50%);overflow:hidden}
.controls #back:focus-visible,.controls #next:focus-visible{position:fixed;left:16px;bottom:80px;clip-path:none;width:44px;height:44px}.controls #next:focus-visible{left:72px}
@media(prefers-reduced-motion:reduce){#readingTrack{animation:none!important;transition:none!important}}

#holdBead .hold-ring{display:none}#holdBead{width:76px;height:96px;min-width:76px}#holdBead:before{content:"";position:absolute;inset:15% 6%;border-radius:45%;background:radial-gradient(ellipse,#ead39e0c,transparent 70%);pointer-events:none}#holdBead:after{top:calc(100% + 3px)}

/* Mystery selection stays separate from the physical prayer gesture. */
#openMysteries{font:500 12px/1.3 system-ui,sans-serif;letter-spacing:.05em;padding:7px 14px;margin:6px auto 0;color:var(--gold,#c7b78b);border:1px solid #c7b78b38;border-radius:24px;background:transparent}
#mysteryMenu{width:min(92vw,520px);max-height:85dvh;overflow:auto;padding:28px;box-sizing:border-box}
#mysteryMenu h2{padding-right:24px}#mysteryMenu h3{margin:22px 0 4px}#mysteryMenu .small{line-height:1.55}
.mystery-sets{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:20px 0}.mystery-sets button{min-height:44px}.mystery-sets button[aria-pressed="true"]{background:#c7b78b22;border-color:#c7b78b;color:#eee9db}
#mysteryList{display:grid;gap:0;margin:12px 0 20px}.mystery-choice{text-align:left;padding:14px 4px;border:0;border-bottom:1px solid #c7b78b25;border-radius:0;background:transparent;font:18px/1.35 Georgia,serif;min-height:48px}
#beginMysteries,#resumeMysteries,#suggestedSet{width:100%;min-height:44px;margin:5px 0}#resumeMysteries{background:#c7b78b20}#mysteryMenu [hidden],#scriptureCard[hidden]{display:none!important}

.fallback-crucifix,.fallback-center{display:none}.fallback-bead[data-kind=absent]{display:none}
.fallback-bead[data-kind=crucifix]>:not(.fallback-crucifix),.fallback-bead[data-kind=center]>:not(.fallback-center){display:none!important}
.fallback-bead[data-kind=crucifix]>.fallback-crucifix,.fallback-bead[data-kind=center]>.fallback-center{display:block}

/* The junction medal stays upright as the two bead strands turn. */
.fallback-center { transform:rotate(42deg) scale(1.6); }

/* Full-page threshold into prayer. */
#mysteryMenu{position:fixed;inset:0;width:100%;max-width:none;height:100dvh;max-height:none;margin:0;padding:0;border:0;border-radius:0;background:radial-gradient(ellipse at 50% 0%,#294044 0%,#102225 58%,#0e1d20 100%);box-sizing:border-box}
#mysteryMenu::backdrop{background:#102225}
.start-shell{max-width:840px;margin:auto;padding:48px 28px 32px;text-align:center}.start-mark{font-size:42px;color:var(--gold);margin-bottom:18px}.start-shell>.eyebrow{color:var(--gold);letter-spacing:.28em;font-size:10px}
#mysteryMenu h2{font:clamp(32px,5vw,48px)/1.15 Georgia,serif;margin:20px 0 16px;color:#f2ecdd}.start-intro{font:17px/1.65 Georgia,serif!important;color:#bbc9c6!important}.today-line{margin:28px 0 24px}.today-line p{font-size:12px;color:var(--gold)!important;margin:0 0 8px}#suggestedSet{border:0;padding:6px;background:none;font-size:11px;text-decoration:underline;text-underline-offset:5px;color:#bbc9c6}
#mysteryMenu .mystery-sets{grid-template-columns:repeat(4,1fr);gap:12px;margin:28px 0 32px}.set-card{position:relative;display:flex;flex-direction:column;align-items:center;padding:24px 8px 20px!important;border-radius:14px!important;background:#ffffff03!important;transition:background .2s,border-color .2s}.set-card[aria-pressed="true"]{background:#cdbb8b12!important;border-color:#cdbb8b!important;box-shadow:inset 0 0 24px #cdbb8b08}.set-name{font:22px Georgia,serif;margin:16px 0 9px}.set-material{font-size:10px;color:#bdc6be}.set-days{font-size:9px;color:#8da4a3;margin-top:7px}.set-art{height:52px;display:flex;align-items:center;gap:9px;position:relative;transform:rotate(-28deg);pointer-events:none}.set-art:before{content:'';position:absolute;left:0;right:0;top:25px;height:2px;background:#b0baba;opacity:.7}.set-art i{display:block;width:23px;height:23px;border-radius:50%;position:relative;background:radial-gradient(circle at 30% 25%,#a5d6dc,#25657b 45%,#102e3c);box-shadow:2px 4px 5px #0007,inset -2px -3px 4px #0005}.set-art i:nth-child(2){width:30px;height:40px;border-radius:7px}.joyful .set-art i{background:repeating-linear-gradient(83deg,#ffffff00 0 3px,#50361744 4px 5px),radial-gradient(circle at 30% 25%,#cdac72,#92633b 70%,#51361f)}.joyful .set-art:before{background:#bba77b;height:3px}.sorrowful .set-art i{background:radial-gradient(circle at 30% 25%,#65716f,#262d2c 48%,#101717)}.sorrowful .set-art i:nth-child(2){background:radial-gradient(circle at 32% 22%,#dfdfd5,#7a898b 48%,#344245);border-radius:12px 12px 8px 8px}.glorious .set-art i{background:radial-gradient(circle at 30% 25%,#fffef5,#dcd7c7 65%,#9d9785)}.glorious .set-art i:nth-child(2){border:1px solid #bb9b56;border-radius:50%;height:30px}.glorious .set-art:before{background:#bfa363}
.start-selection{border-top:1px solid #cdbb8b26;padding-top:24px;max-width:520px;margin:auto}.start-selection h3{font:24px Georgia,serif;margin:10px}.start-selection>.small{color:#93a8a5!important;margin:0 0 22px}.start-selection>.eyebrow{font-size:9px;letter-spacing:.24em;color:var(--gold)!important}#beginMysteries{width:100%;min-height:52px;background:#cdbb8b;color:#15282a;border:0;font-size:13px}#beginMysteries span{float:right}#resumeMysteries{margin:12px 0;min-height:42px;border:0;font-size:12px}.decade-picker{margin-top:12px;text-align:left;border-top:1px solid #cdbb8b20;padding:18px 0}.decade-picker summary{font-size:12px;color:#a9bbb7;cursor:pointer}.start-footer{font:italic 13px Georgia,serif;margin-top:22px;color:#8fa7a3!important}
@media(max-width:600px){.start-shell{padding:28px 22px 28px}.start-mark{font-size:32px;margin-bottom:10px}#mysteryMenu h2{margin-top:16px}.start-intro{font-size:15px!important}.today-line{margin:20px 0}#mysteryMenu .mystery-sets{grid-template-columns:1fr 1fr;gap:10px;margin:20px 0 26px}.set-card{padding:15px 8px!important}.set-art{height:42px;scale:.9}.set-name{font-size:21px;margin:10px 0 7px}.start-selection{padding-top:20px}}
@media(prefers-reduced-motion:reduce){.set-card{transition:none}}
.sorrowful .set-art i:nth-child(2){border-radius:45% 45% 28% 28%}.sorrowful .set-art i:nth-child(2):before{content:'';position:absolute;width:8px;height:9px;left:4px;top:13px;background:#172526;border-radius:50%;box-shadow:14px 0 #172526}.sorrowful .set-art i:nth-child(2):after{content:'';position:absolute;width:17px;height:6px;left:7px;bottom:4px;border-bottom:2px solid #435454;background:repeating-linear-gradient(90deg,transparent 0 3px,#435454 3px 4px)}

.silver-skull-bead{display:none}.rosary[data-theme=sorrowful] .fallback-bead[data-pater=true][data-kind=bead] .silver-skull-bead{display:block}
.sorrowful .set-art i:nth-child(2){width:35px;height:44px;background: url(assets/silver-skull-pater-v4.png) center/contain no-repeat;box-shadow:none;border-radius:0}.sorrowful .set-art i:nth-child(2):before,.sorrowful .set-art i:nth-child(2):after{display:none}
/* The longer junction drag must remain reachable above overview controls. */
.adjacent-bead{z-index:5}
#holdBead{z-index:6}

/* Keep the primary action visible independently of the scrollable selection. */
#mysteryMenu[open]{display:flex;flex-direction:column;overflow:hidden}
#mysteryMenu .start-shell{flex:1;min-height:0;overflow-y:auto;width:100%;box-sizing:border-box;overscroll-behavior:contain}
.start-actions{flex:none;width:100%;box-sizing:border-box;padding:12px max(22px,calc((100% - 520px)/2)) max(14px,env(safe-area-inset-bottom));background:#102225;border-top:1px solid #cdbb8b35;box-shadow:0 -12px 24px #10222588;text-align:center}
#startActionSet{font:14px Georgia,serif;color:var(--gold);margin:0 0 8px}
.start-actions #resumeMysteries{margin:3px 0 0;min-height:36px}
@media(max-width:600px){#mysteryMenu .start-shell{padding:16px 20px 24px}.start-mark{display:none}#mysteryMenu h2{font-size:30px;margin:10px 0}.start-intro{display:none}.today-line{margin:16px 0 12px}#mysteryMenu .mystery-sets{margin:12px 0 20px}.set-card{padding:12px 7px!important}.set-material{font-size:9px}.start-actions{padding-top:10px}.start-actions #beginMysteries{min-height:48px}}

/* Cast emblems are individual to the selected mystery set, including the no-WebGL view. */
.sacred-art{display:none}
.rosary[data-theme=joyful] .sacred-joyful{display:block}
.rosary[data-theme=luminous] .sacred-luminous{display:block}
.rosary[data-theme=sorrowful] .sacred-sorrowful{display:block}
.rosary[data-theme=glorious] .sacred-glorious{display:block}

/* Bright illustrated finishes: saturated color and gentle shading, without changing physics. */
.rosary[data-theme=luminous]{--stone-light:#b6f2ff;--stone-main:#30b8d6;--stone-dark:#1485ac;--stone-edge:#176080;--metal-main:#d3edf4;--metal-dark:#7998aa}
.rosary[data-theme=joyful]{--metal-main:#edc780;--metal-dark:#ab8145}
.rosary[data-theme=sorrowful]{--metal-main:#d0e2ed;--metal-dark:#8196a6}
.rosary[data-theme=glorious]{--stone-light:#fffff3;--stone-main:#fff0cd;--stone-dark:#ddcca0;--stone-edge:#baaa80;--metal-main:#f5ce70;--metal-dark:#b38a3c}

/* Prayer language is visible before the mystery cards, including on phones. */
.prayer-language{display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px 16px;max-width:420px;margin:24px auto;text-align:left;padding:16px 18px;border:1px solid rgba(192,161,101,.3);border-radius:16px;background:rgba(255,255,255,.035)}
.prayer-language label{font-size:.95rem;color:inherit}
.prayer-language select{font:inherit;color:inherit;background:#202321;border:1px solid rgba(192,161,101,.45);border-radius:9px;padding:10px 12px;min-height:44px;max-width:100%}
.prayer-language p{grid-column:1/-1;margin:0;font-size:.8rem;opacity:.75}
.prayer-language select:focus-visible{outline:2px solid #d8be85;outline-offset:3px}
@media(max-width:360px){.prayer-language{padding:12px;gap:8px}.prayer-language select{padding:9px 6px}}

/* Keep the opening heading as the dialog's accessible focus target. */
#menuTitle:focus{outline:none}
#mysteryMenu h2{padding-right:0}
#mysteryMenu .start-shell{scrollbar-gutter:stable both-edges}
