/* Illuminated page rendering and the builder layout. */
:root{--gold:#a67c2e;--gold-deep:#7d5a1c;--red:#8b2f27;--parchment:#efe5cf;--page-ink:#2b2219}
.builder{max-width:72rem;margin:0 auto;padding:2.5rem 1.5rem 4rem;display:grid;gap:2.5rem;grid-template-columns:1fr}
@media(min-width:900px){.builder{grid-template-columns:minmax(0,26rem) minmax(0,1fr);align-items:start}.preview{position:sticky;top:1.5rem}}
.steps h2{font-size:1.05rem;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);margin:2.25rem 0 .75rem}
.steps h2:first-child{margin-top:0}
.steps p.help{color:var(--muted);font-size:.95rem;margin:0 0 .75rem}
.field{display:block;margin:.6rem 0}
.field span{display:block;font-size:.9rem;color:var(--muted);margin-bottom:.2rem}
.field input,.field textarea,.field select{width:100%;font:inherit;font-size:1rem;padding:.55rem .7rem;border:1px solid var(--rule);border-radius:4px;background:transparent;color:var(--ink)}
.field input:focus,.field textarea:focus,.field select:focus{outline:2px solid var(--accent);outline-offset:2px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}
.prayer-list{list-style:none;padding:0;margin:0;border-top:1px solid var(--rule)}
.prayer-list li{display:flex;align-items:center;gap:.6rem;padding:.55rem 0;border-bottom:1px solid var(--rule)}
.prayer-list input[type=checkbox]{width:1.1rem;height:1.1rem;accent-color:var(--accent);flex:none}
.prayer-list .name{flex:1;min-width:0}
.prayer-list .name small{display:block;color:var(--muted);font-size:.8rem}
.prayer-list .move{display:flex;gap:.25rem}
.btn,.move button{font:inherit;font-size:.95rem;padding:.5rem .9rem;border:1px solid var(--ink);border-radius:4px;background:transparent;color:var(--ink);cursor:pointer}
.move button{padding:.2rem .55rem;line-height:1}
.btn.primary{background:var(--ink);color:var(--paper)}
.btn:focus-visible,.move button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.btn[disabled]{opacity:.5;cursor:default}
.actions{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1rem}
.status{margin-top:.75rem;font-size:.95rem}
.status.ok{color:#2f6b3a}.status.err{color:var(--red)}
.preview-head{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;margin-bottom:.75rem}
.preview-head small{color:var(--muted)}
.pages{display:grid;gap:1.5rem;justify-items:center}
/* The page: a 3:4 leaf, parchment, gilded gothic frame from the Spinola Hours. */
.page{position:relative;width:100%;max-width:26rem;aspect-ratio:3/4;background:#3b2a12 url(/art/frame.jpg) center/100% 100% no-repeat;color:var(--page-ink);box-shadow:0 1px 2px rgba(0,0,0,.18),0 12px 32px rgba(0,0,0,.12);overflow:hidden;font-family:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;container-type:inline-size}
.page .inner{position:absolute;left:22.3%;right:16%;top:5.5%;bottom:25.5%;padding:11% 7% 6%;background:var(--parchment) url(/art/parchment.jpg) center/200px repeat;border-radius:48% 48% 0 0/22% 22% 0 0;box-shadow:inset 0 0 0 2px rgba(125,90,28,.5),inset 0 0 38px rgba(60,40,10,.28);display:flex;flex-direction:column;justify-content:center;text-align:center;text-wrap:pretty;overflow:hidden}
.page::after{content:"";position:absolute;left:83%;right:10.2%;top:59%;bottom:25.5%;background:var(--parchment) url(/art/parchment.jpg) center/200px repeat;box-shadow:inset 0 0 12px rgba(60,40,10,.25)}
.page.cover::after{content:none}
.page .heading{font-size:3.6cqw;letter-spacing:.14em;text-transform:uppercase;color:var(--red);margin:0 0 .9em}
.page .text{font-size:3.9cqw;line-height:1.42;margin:0}
.page.long .text{font-size:3cqw;line-height:1.36;text-align:left;hyphens:auto}
.page.long .text .line{display:inline}
.page.long .text .line::after{content:" "}
.page.long .heading{font-size:3cqw;margin-bottom:.6em}
.page.long .text .cap{font-size:2.4em}
.page.longer .text{font-size:2.6cqw;line-height:1.32}
.page.longer .heading{font-size:2.8cqw}
.page .text .line{display:block}
.page .text .cap{float:left;font-size:3.1em;line-height:.8;padding:.06em .12em 0 0;color:var(--gold-deep);font-weight:400}
.page.cover{background:#1d1b18}
.page.cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.92}
.page.cover .band{position:absolute;left:0;right:0;bottom:8%;padding:1.4cqw 2cqw;text-align:center;color:#f3e7c7}
.page.cover .band .t{display:block;font-size:6cqw;letter-spacing:.06em;text-shadow:0 1px 3px rgba(0,0,0,.8)}
.page.cover .band .s{display:block;font-size:3.4cqw;letter-spacing:.12em;text-transform:uppercase;margin-top:.6em;text-shadow:0 1px 3px rgba(0,0,0,.8)}
.page .dedication{font-size:4cqw;line-height:1.6}
.page .dedication .who{font-size:5.4cqw;color:var(--gold-deep);display:block;margin:.3em 0 .5em}
.page .folio{position:absolute;bottom:27%;left:22.3%;right:16%;text-align:center;font-size:2.6cqw;color:var(--gold-deep);letter-spacing:.2em}
.credit{font-size:.85rem;color:var(--muted);margin-top:1rem}
@media print{
  @page{size:6in 8in;margin:0}
  body>*{display:none}
  body>.print-root{display:block}
  .pages{display:block}
  .page{max-width:none;width:6in;height:8in;aspect-ratio:auto;box-shadow:none;page-break-after:always;break-after:page;border-radius:0}
  .page.cover{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}