:root { --orange:#EB5930; --yellow:#F4B143; --cream:#fff7ef; --ink:#2a211f; }
* { box-sizing:border-box; }
html, body { width:100%; height:100%; margin:0; overflow:hidden; }
body { font-family:"Catamaran",system-ui,sans-serif; }
.presentation-screen { background:var(--presentation-background,#181312); color:var(--presentation-text,var(--cream)); }
#presentation { height:100vh; overflow:hidden; }
.all-mode { height:100%; overflow:hidden; padding:10vh 2vw; }
.scroll-track { animation:prayer-scroll var(--scroll-duration,60s) linear infinite; will-change:transform; }
.prayer-cycle { display:grid; gap:12vh; padding-bottom:12vh; }
.prayer-block { width:calc(var(--presentation-content-width,82) * 1vw); margin:0 auto; }
.prayer-block h2,.focus-mode h1 { margin:0 0 3vh; color:var(--presentation-text,var(--cream)); font-size:var(--presentation-font-size,54px); line-height:1; }
.prayer-block ul,.focus-list ul { display:grid; gap:1.3vh; margin:0; padding-left:1.1em; font-size:calc(var(--presentation-font-size,54px) * .58); line-height:1.25; }
.highlighted { color:var(--presentation-highlight,var(--yellow))!important; font-weight:700; }
@keyframes prayer-scroll { to { transform:translateY(-50%); } }
.focus-mode { display:grid; height:100%; grid-template-rows:auto minmax(0,1fr); gap:4vh; padding:10vh 2vw; }
.focus-mode h1,.focus-list { width:calc(var(--presentation-content-width,82) * 1vw); margin-right:auto; margin-left:auto; }
.focus-list { min-height:0; overflow:hidden; }
.focus-list.is-scrolling ul { animation:focus-scroll var(--focus-duration,30s) ease-in-out infinite alternate; }
@keyframes focus-scroll { to { transform:translateY(calc(-1 * var(--focus-distance))); } }
.is-paused .scroll-track,.is-paused .focus-list ul { animation-play-state:paused; }
.presentation-controls { position:fixed; right:2vw; bottom:2vh; left:2vw; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.65rem; border:1px solid rgba(255,255,255,.2); border-radius:14px; background:rgba(15,11,10,.86); opacity:1; transition:opacity .25s; }
.presentation-controls.is-hidden { opacity:0; pointer-events:none; }
.control-row { display:flex; align-items:center; gap:.4rem; }
.presentation-controls button,.presentation-controls select { min-height:2.75rem; padding:.45rem .75rem; border:1px solid rgba(255,255,255,.25); border-radius:9px; background:#332724; color:#fff; font:inherit; }
.speed-control { display:flex; align-items:center; gap:.5rem; }
.presentation-empty { display:grid; height:100%; margin:0; place-items:center; color:var(--presentation-text,var(--cream)); font-size:clamp(1.5rem,3vw,3rem); }
.presentation-logo { position:fixed; right:var(--presentation-logo-right,0vw); bottom:var(--presentation-logo-bottom,-10vh); z-index:1; width:min(50vw,calc(var(--presentation-logo-size,28) * 1vw)); max-height:80vh; object-fit:contain; object-position:bottom right; opacity:var(--presentation-logo-opacity,.12); pointer-events:none; }
.pairing-screen { display:grid; min-height:100vh; padding:2rem; place-items:center; background:#2a211f; color:var(--cream); }
.pairing-card { width:min(100%,44rem); padding:clamp(2rem,6vw,4rem); border:1px solid rgba(255,255,255,.18); border-radius:18px; text-align:center; }
.pairing-card h1 { font-size:clamp(2.5rem,7vw,5rem); }
.presentation-eyebrow { color:var(--orange); font-weight:700; letter-spacing:.15em; text-transform:uppercase; }
.pairing-code { margin:2rem 0; color:var(--yellow); font-size:clamp(3.5rem,12vw,8rem); font-weight:700; letter-spacing:.12em; }
@media (max-width:50rem) { .presentation-controls { align-items:stretch; flex-direction:column; } .control-row { overflow-x:auto; } .speed-control { justify-content:center; } }