
:root{
  color-scheme: light;
  --paper:#fbfaf7; --ink:#151515; --muted:#716b63; --line:#ded7cc; --card:#fff;
  --torah:#8B0F24; --history:#CD7F32; --poetry:#E5C53A; --prophets:#2E7D32;
  --gospels:#89CFF0; --epistles:#0F52BA; --revelation:#5B2A86;
  --shadow:0 16px 44px rgba(0,0,0,.08);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
button,input,textarea,select{font:inherit}
button,a{touch-action:manipulation}
button{cursor:pointer}
.app-header{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 18px;background:rgba(251,250,247,.96);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:14px;color:inherit;text-decoration:none;min-width:max-content}
.signet{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;position:relative;overflow:hidden;background:linear-gradient(to bottom,var(--torah) 0 14.28%,var(--history) 14.28% 28.56%,var(--poetry) 28.56% 42.84%,var(--prophets) 42.84% 57.12%,var(--gospels) 57.12% 71.4%,var(--epistles) 71.4% 85.68%,var(--revelation) 85.68% 100%);box-shadow:inset 0 0 0 1px rgba(0,0,0,.2)}
.signet span{font:800 36px/1 Georgia,serif;color:#fff;text-shadow:0 1px 4px #000}
.brand-copy{display:flex;flex-direction:column}
.brand-copy strong{font:700 24px/1 Georgia,serif;letter-spacing:.05em}
.brand-copy small{letter-spacing:.18em;color:#6b6259;margin-top:5px}
.top-nav{display:flex;gap:8px;align-items:center;overflow-x:auto;padding-bottom:2px}
.top-nav button,.top-nav a,footer button{border:0;background:transparent;color:inherit;padding:10px 12px;border-radius:999px;font-weight:650;white-space:nowrap}
.top-nav button:hover,.top-nav button:focus-visible,footer button:hover{background:#eee9e1}
.top-nav .bless{background:#111;color:#fff;text-decoration:none}
main{max-width:1520px;margin:auto;padding:34px 18px 60px}
.reader-hero{display:grid;grid-template-columns:1fr minmax(290px,420px);gap:36px;align-items:end;margin:28px 0 20px}
.eyebrow{font-size:.78rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:#9b6c18;margin:0 0 10px}
h1{font:700 clamp(2.35rem,6vw,6.2rem)/.94 Georgia,serif;margin:0;max-width:980px}
.lede{font:400 clamp(1.15rem,2.3vw,2rem)/1.4 Georgia,serif;color:#514b44;max-width:900px}
.today-card{background:#fff;border:1px solid var(--line);border-radius:28px;padding:22px;box-shadow:var(--shadow)}
.today-card input{width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:12px;background:#fff}
.mini{font-weight:800;letter-spacing:.12em;font-size:.8rem}
.day-label{font:700 3.3rem/1 Georgia,serif;margin-top:17px}
.date-label{font-size:1.15rem;color:#5e5750;margin-top:8px}
.page-label{margin-top:14px;color:#756f68}
.reader-toolbar,.page-bottom{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;align-items:center;margin:20px 0}
.reader-toolbar button,.page-bottom button,.selection-tools button,.panel-dialog button,.panel-dialog .buttonlike{border:1px solid #cfc7bb;background:#fff;border-radius:999px;padding:10px 15px;color:#191919;text-decoration:none}
button.primary,.panel-dialog button.primary{background:#111;color:#fff;border-color:#111}
.status-bar{padding:10px 14px;border-radius:12px;background:#f0ece5;color:#5d554c;margin:14px 0}
.scripture-page{display:flex;flex-direction:column;gap:0;border-radius:24px;overflow:hidden;box-shadow:var(--shadow);border:1px solid #d9d3c9;background:#fff}
.seal{padding:22px 24px 26px;border-bottom:1px solid #ded7cc;border-left:8px solid transparent;position:relative;background:#fff;color:#151515}
.seal:last-child{border-bottom:0}
.seal-head{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;align-items:flex-start;margin-bottom:14px;padding-bottom:10px;border-bottom:2px solid #ece7df}
.seal-title{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.seal-title h2{margin:0;font-size:.9rem;letter-spacing:.13em}
.seal-title strong{font:700 1.25rem Georgia,serif}
.seal-tools{display:flex;gap:6px;flex-wrap:wrap}
.seal-tools button{border:0;background:rgba(255,255,255,.68);padding:7px 9px;border-radius:999px}
.scripture-text{font:400 clamp(1.05rem,1.55vw,1.34rem)/1.68 Georgia,"Times New Roman",serif;white-space:pre-wrap}
.scripture-text mark{background:#ffe66d;color:#111!important;padding:0 .08em;border-radius:.15em;box-shadow:inset 0 -1px 0 rgba(0,0,0,.12)}
.seal-torah{border-left-color:var(--torah)}
.seal-history{border-left-color:var(--history)}
.seal-poetry{border-left-color:var(--poetry)}
.seal-prophets{border-left-color:var(--prophets)}
.seal-gospels{border-left-color:var(--gospels)}
.seal-epistles{border-left-color:var(--epistles)}
.seal-revelation{border-left-color:var(--revelation)}

.seal-torah .seal-head{border-bottom-color:color-mix(in srgb,var(--torah) 35%,white)}
.seal-history .seal-head{border-bottom-color:color-mix(in srgb,var(--history) 45%,white)}
.seal-poetry .seal-head{border-bottom-color:color-mix(in srgb,var(--poetry) 55%,white)}
.seal-prophets .seal-head{border-bottom-color:color-mix(in srgb,var(--prophets) 35%,white)}
.seal-gospels .seal-head{border-bottom-color:color-mix(in srgb,var(--gospels) 55%,white)}
.seal-epistles .seal-head{border-bottom-color:color-mix(in srgb,var(--epistles) 35%,white)}
.seal-revelation .seal-head{border-bottom-color:color-mix(in srgb,var(--revelation) 35%,white)}

.seal-torah .seal-title h2{color:var(--torah)}
.seal-history .seal-title h2{color:#9b5618}
.seal-poetry .seal-title h2{color:#8a7410}
.seal-prophets .seal-title h2{color:var(--prophets)}
.seal-gospels .seal-title h2{color:#217694}
.seal-epistles .seal-title h2{color:var(--epistles)}
.seal-revelation .seal-title h2{color:var(--revelation)}

.seal-tools button{background:#f7f4ef;color:#151515;border:1px solid #ded7cc}
.scripture-page{background:#fff;color:#151515}
.scripture-text{color:#151515}
.selection-tools{position:fixed;z-index:70;left:50%;bottom:24px;transform:translateX(-50%);display:flex;gap:7px;align-items:center;flex-wrap:wrap;background:#111;color:#fff;padding:9px 12px;border-radius:18px;box-shadow:0 10px 35px rgba(0,0,0,.3)}
.selection-tools[hidden]{display:none}
.selection-tools button{background:#fff}
.panel-dialog{width:min(880px,94vw);max-height:88vh;border:0;border-radius:26px;padding:0;box-shadow:0 30px 90px rgba(0,0,0,.3);background:#fff;color:#151515}
.panel-dialog::backdrop{background:rgba(0,0,0,.5)}
.panel-dialog.compact{width:min(650px,94vw)}
.dialog-head{position:sticky;top:0;z-index:2;background:#fff;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 24px;border-bottom:1px solid #eee}
.dialog-head h2{margin:0;font:700 2rem Georgia,serif}
.icon-btn{width:42px;height:42px;padding:0!important}
#dialogBody{padding:22px 24px 30px}
.feature-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.feature-card{border:1px solid #e0dad0;border-radius:18px;padding:16px;background:#fbfaf7;text-align:left}
.feature-card strong{display:block;font-size:1.05rem}
.feature-card span{display:block;color:#6c655e;margin-top:5px;line-height:1.35}
.stack{display:grid;gap:12px}
.panel-dialog label{display:grid;gap:6px;font-weight:650;margin:12px 0}
.panel-dialog input,.panel-dialog textarea,.panel-dialog select{width:100%;padding:11px 12px;border:1px solid #cfc8bd;border-radius:12px;background:#fff;color:#111}
.list{display:grid;gap:10px;margin-top:15px}
.list-item{border:1px solid #e2ddd5;border-radius:16px;padding:13px;background:#fff}
.list-item small{color:#726b64}
.badge{display:inline-flex;align-items:center;gap:6px;border-radius:999px;background:#eee9e2;padding:5px 9px;font-size:.78rem;font-weight:700}
.badge.private{background:#e8f2e8}
.notice{background:#fff8dc;border:1px solid #efdf9c;padding:12px 14px;border-radius:14px;line-height:1.45}
.progress-meter{height:12px;background:#eee;border-radius:999px;overflow:hidden;margin:7px 0 4px}
.progress-meter span{display:block;height:100%;background:#111}
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.tabs button.active{background:#111;color:#fff}
.share-preview{aspect-ratio:9/16;max-height:480px;margin:18px auto;border-radius:20px;background:#111;color:#fff;display:grid;place-items:center;padding:26px;text-align:center}
footer{display:flex;justify-content:center;gap:16px;align-items:center;flex-wrap:wrap;padding:26px 18px;color:#706961;border-top:1px solid var(--line)}
@media(max-width:900px){
  .app-header{align-items:flex-start;flex-direction:column}
  .top-nav{width:100%}
  .reader-hero{grid-template-columns:1fr}
  .feature-grid{grid-template-columns:1fr}
}
@media(max-width:560px){
  main{padding:18px 10px 50px}
  .brand-copy small{font-size:.64rem}
  .signet{width:48px;height:48px}
  .seal{padding:18px 15px 22px}
  .selection-tools{width:calc(100vw - 18px);justify-content:center;bottom:9px}
}

body,.today-card,.scripture-page,.panel-dialog,.dialog-head,.feature-card,.list-item,
.panel-dialog input,.panel-dialog textarea,.panel-dialog select{
  color-scheme:light;
}
