:root{--bg:#fbf7f0;--card:#fffdf9;--ink:#2a231d;--muted:#6f655b;--line:#e7dccb;--pri:#2f5d50;--pri-ink:#fff;--pri-soft:#e3eee9;--gold:#b7822f;--gold-soft:#f6ead2;--warn:#a5521e;--warn-soft:#fbe7d8;--ok:#2e7d4f;--shadow:0 1px 2px rgba(60,40,10,.06),0 4px 14px rgba(60,40,10,.06);--r:16px;--heat0:#efe6d6;--heat1:#c6dccf;--heat2:#8fbca6;--heat3:#4f8f76;--heat4:#2f5d50;color-scheme:light}
[data-theme=dark]{--bg:#17140f;--card:#221e18;--ink:#efe7da;--muted:#a99d8d;--line:#3a332a;--pri:#7fbfa8;--pri-ink:#10221b;--pri-soft:#22362f;--gold:#e0b062;--gold-soft:#3a2f1c;--warn:#f0a070;--warn-soft:#3b2619;--ok:#7fd3a0;--shadow:0 1px 2px rgba(0,0,0,.3);--heat0:#2b261f;--heat1:#2f4a3f;--heat2:#3f6e5c;--heat3:#5c9a82;--heat4:#8fd0b5;color-scheme:dark}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans","Noto Sans Hebrew",sans-serif;padding-bottom:calc(76px + var(--sab,env(safe-area-inset-bottom)))}
button,input,select,textarea{font:inherit;color:inherit}
a{color:var(--pri);text-decoration:none}   /* update #23 (Bezalel): no underlines anywhere */
.skip{position:absolute;top:-999px;left:8px}.skip:focus{left:8px;top:8px;background:var(--card);padding:8px;z-index:99}
:focus-visible{outline:none}
/* update #20: the focus ring is for the keyboard only (html.kbd, set by ripple.js on Tab / arrows), and for text fields */
html.kbd :focus-visible,input:not([type=checkbox]):not([type=radio]):focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid color-mix(in srgb,var(--pri) 75%,transparent);outline-offset:2px;box-shadow:0 0 0 5px color-mix(in srgb,var(--pri) 18%,transparent)}
.sheet:focus,.sheet:focus-visible,html.kbd .sheet:focus-visible{outline:none;box-shadow:0 -8px 30px rgba(0,0,0,.2)}
.top{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;padding:calc(10px + env(safe-area-inset-top)) 16px 10px;background:color-mix(in srgb,var(--bg) 92%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid transparent}
.brand{display:flex;gap:8px;align-items:center;font-weight:700;font-size:20px;letter-spacing:.2px}.brand img{border-radius:8px}
.top-right{display:flex;gap:8px;align-items:center;font-size:14px;color:var(--muted)}
main{max-width:640px;margin:0 auto;padding:4px 16px 24px}
.boot{padding:40vh 0;text-align:center;color:var(--muted)}
h1{font-size:28px;line-height:1.15;margin:8px 0 2px}h2{font-size:20px;margin:22px 0 10px}h3{font-size:18px;margin:0 0 6px}
.sub{color:var(--muted);font-size:15px;margin:0}
.he{font-family:"Noto Serif Hebrew","Noto Sans Hebrew","David",serif;direction:rtl;unicode-bidi:isolate}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px;margin:12px 0;box-shadow:var(--shadow)}
.card.done{border-color:color-mix(in srgb,var(--ok) 45%,var(--line))}
.row{display:flex;gap:10px;align-items:center}.row.wrap{flex-wrap:wrap}.grow{flex:1;min-width:0}.between{justify-content:space-between}
.tag{display:inline-block;font-size:12px;font-weight:600;letter-spacing:.3px;text-transform:uppercase;color:var(--gold);background:var(--gold-soft);border-radius:99px;padding:2px 9px}
.chip{display:inline-flex;align-items:center;gap:4px;font-size:14px;background:var(--pri-soft);color:var(--ink);border-radius:99px;padding:4px 10px}
.chip.gold{background:var(--gold-soft)}
.piece{font-size:26px;font-weight:700;line-height:1.2;margin:8px 0 2px;overflow-wrap:anywhere}.piece-he{font-size:20px;color:var(--muted);margin:0 0 6px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:10px 18px;border-radius:14px;border:1px solid var(--line);background:var(--card);font-weight:600;cursor:pointer;text-decoration:none;color:var(--ink);touch-action:manipulation}
.btn.pri{background:var(--pri);border-color:var(--pri);color:var(--pri-ink)}
.btn.big{width:100%;min-height:60px;font-size:20px;border-radius:16px}
.btn.ghost{background:transparent;border-color:transparent;color:var(--pri)}
.btn.warn{color:var(--warn);border-color:color-mix(in srgb,var(--warn) 40%,var(--line))}
.btn.small{min-height:40px;padding:6px 12px;font-size:15px}
.btn[disabled]{opacity:.5;pointer-events:none}
.btn.done{background:var(--pri-soft);color:var(--ok);border-color:transparent}
.btns{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}.btns.three{grid-template-columns:1fr 1fr 1fr}
.bar{height:8px;border-radius:99px;background:var(--heat0);overflow:hidden;margin:10px 0 6px}.bar>i{display:block;height:100%;background:var(--pri);border-radius:99px}
.stats{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:14px;color:var(--muted)}.stats b{color:var(--ink)}
.banner{border-radius:12px;padding:10px 12px;margin-top:10px;background:var(--warn-soft);color:var(--ink);display:flex;gap:10px;align-items:center;justify-content:space-between;font-size:15px}
.banner.info{background:var(--pri-soft)}
.list{list-style:none;padding:0;margin:0}.list li{padding:10px 0;border-bottom:1px solid var(--line);display:flex;gap:10px;align-items:center;justify-content:space-between}.list li:last-child{border-bottom:0}
.muted{color:var(--muted)}.small{font-size:14px}.center{text-align:center}
.empty{text-align:center;padding:28px 12px}.empty p{color:var(--muted)}
label.field{display:block;margin:14px 0}label.field>span{display:block;font-weight:600;margin-bottom:6px}
input[type=text],input[type=search],input[type=date],input[type=time],input[type=number],select,textarea{width:100%;min-height:48px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--card)}
.seg{display:flex;background:var(--heat0);border-radius:12px;padding:4px;gap:4px}.seg button{flex:1;min-height:42px;border:0;border-radius:9px;background:transparent;font-weight:600;cursor:pointer}.seg button[aria-pressed=true]{background:var(--card);box-shadow:var(--shadow)}
.switch{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}.switch:last-child{border-bottom:0}
.switch input{appearance:none;width:52px;height:32px;border-radius:99px;background:var(--line);position:relative;flex:none;cursor:pointer;transition:.2s}.switch input::after{content:"";position:absolute;top:3px;left:3px;width:26px;height:26px;border-radius:50%;background:#fff;transition:.2s;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.sw-t{display:flex;flex-direction:column;gap:2px;min-width:0}.sw-t .small{line-height:1.35}
.switch input:checked{background:var(--pri)}.switch input:checked::after{left:23px}
.stepper{display:flex;align-items:center;gap:8px}.stepper button{width:48px;height:48px;border-radius:12px;border:1px solid var(--line);background:var(--card);font-size:24px;cursor:pointer}.stepper input{text-align:center;width:80px}
.picks{display:grid;grid-template-columns:1fr 1fr;gap:10px}.pick{text-align:start;padding:14px;border-radius:14px;border:1px solid var(--line);background:var(--card);cursor:pointer;min-height:96px}.pick b{display:block;font-size:17px}.pick span{font-size:14px;color:var(--muted)}.pick[aria-pressed=true]{border-color:var(--pri);box-shadow:0 0 0 2px var(--pri) inset}
/* calendar */
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}.cal .dh{font-size:12px;text-align:center;color:var(--muted);padding:4px 0}
.cal button{position:relative;aspect-ratio:1/1.12;border:1px solid var(--line);border-radius:10px;background:var(--card);padding:3px 2px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;cursor:pointer;min-width:0}
.cal button .g{font-weight:700;font-size:15px}.cal button .h{font-size:11px;color:var(--muted)}
.cal button.out{opacity:.35}.cal button.today{border-color:var(--pri);box-shadow:0 0 0 2px var(--pri) inset}.cal button.sel{background:var(--pri-soft)}
.cal button.skipd{background:repeating-linear-gradient(135deg,transparent 0 6px,var(--heat0) 6px 8px)}
.cal .dots{display:flex;gap:2px;margin-top:auto;margin-bottom:2px;flex-wrap:wrap;justify-content:center}.cal .dots i{width:6px;height:6px;border-radius:50%;background:var(--gold)}.cal .dots i.ok{background:var(--ok)}
.cal button.hol .g{color:var(--warn)}
.heat{display:grid;grid-auto-flow:column;grid-template-rows:repeat(7,1fr);gap:3px;overflow-x:auto;padding-bottom:4px}.heat i{width:13px;height:13px;border-radius:3px;background:var(--heat0)}
.heat i.l1{background:var(--heat1)}.heat i.l2{background:var(--heat2)}.heat i.l3{background:var(--heat3)}.heat i.l4{background:var(--heat4)}.heat i.f{opacity:.3}
/* nav */
.tabs{position:fixed;left:0;right:0;bottom:0;z-index:6;display:flex;justify-content:space-around;background:var(--card);border-top:1px solid var(--line);padding:6px 4px max(6px,calc(var(--sab,env(safe-area-inset-bottom)) - 12px))}
/* update #27 (iPhone home-screen app, Bezalel Oct 26 8:00 PM: the tab bar sat raised): the bar's own colour continues below it, so if iOS
   ever places the bar above the very bottom (the standalone safe-area quirk) there is no gap of page colour under it; the icons sit just
   above the home indicator (inset − 12px: clear of the indicator, which is ~13px tall from the edge; Android, inset 0: 6px as before). --sab only exists for QA (emulating the inset). */
.tabs::after{content:"";position:absolute;left:0;right:0;top:100%;height:120px;background:var(--card);pointer-events:none}
.tabs a{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;min-height:52px;justify-content:center;text-decoration:none;color:var(--muted);font-size:12px;font-weight:600;border-radius:12px}
.tabs svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.tabs a[aria-current=page]{color:var(--pri);background:var(--pri-soft)}
/* sheets */
.scrim{position:fixed;inset:0;background:rgba(20,14,6,.45);z-index:20;opacity:0;transition:opacity .2s}.scrim.show{opacity:1}
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:21;max-height:92vh;overflow:auto;overscroll-behavior:contain;background:var(--card);border-radius:22px 22px 0 0;padding:10px 18px calc(20px + env(safe-area-inset-bottom));transform:translateY(100%);transition:transform .25s ease;max-width:640px;margin:0 auto;box-shadow:0 -8px 30px rgba(0,0,0,.2)}
.sheet.show{transform:none}.sheet.full{top:0;max-height:none;border-radius:0}
.sheet .grab{width:42px;height:5px;border-radius:9px;background:var(--line);margin:0 auto 10px}
.sheet h3{font-size:21px;margin:4px 0 8px}.sheet .acts{display:grid;gap:10px;margin-top:16px}
.sheet .x{position:absolute;inset-inline-end:10px;top:8px}
.toast{position:fixed;left:50%;bottom:calc(88px + env(safe-area-inset-bottom));transform:translate(-50%,20px);background:var(--ink);color:var(--bg);padding:12px 16px;border-radius:12px;opacity:0;pointer-events:none;transition:.25s;z-index:30;display:flex;gap:12px;align-items:center;max-width:92vw;font-size:15px}
.toast.show{opacity:1;transform:translate(-50%,0);pointer-events:auto}.toast button{background:none;border:0;color:var(--gold);font-weight:700;padding:6px;cursor:pointer}
/* reader */
.reader p{margin:0 0 14px}.reader .he{font-size:22px;line-height:1.7}.reader .en{font-size:17px}.reader .num{color:var(--gold);font-weight:700;font-size:13px;margin-inline-end:6px}
.reader .seg{position:sticky;top:0;z-index:1}
/* auth */
.hero{text-align:center;padding:28px 0 8px}.hero img{border-radius:22px}.hero h1{font-size:34px}.hero p{color:var(--muted);max-width:30em;margin:8px auto}
.code{font:600 22px/1.4 ui-monospace,Menlo,Consolas,monospace;letter-spacing:1px;text-align:center;background:var(--gold-soft);border-radius:12px;padding:14px;word-break:break-all;user-select:all}
/* siyum */
.siyum{text-align:center;padding:30px 10px}.siyum h3{font-size:30px}.siyum .he{font-size:28px;color:var(--gold)}
@media (prefers-reduced-motion:reduce){.sheet,.toast,.scrim{transition:none}}
@media (min-width:700px){body{font-size:17px}.picks{grid-template-columns:1fr 1fr 1fr}}
.offline{font-size:13px;color:var(--warn)}
.hidden{display:none!important}
.toast.ontop{bottom:auto;top:calc(14px + env(safe-area-inset-top))}

.fhead{margin:14px 0 2px;font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
[dir=rtl] .switch input::after{left:auto;right:3px}[dir=rtl] .switch input:checked::after{right:23px}

/* new-seder flow: one step per page */
body.inwz{padding-bottom:0}body.inwz main{overflow-x:clip}
.wz{min-height:calc(100dvh - 64px);display:flex;flex-direction:column}
.wz-top{display:flex;align-items:center;gap:14px;margin:4px 0 6px}
.wz-back{width:46px;height:46px;border-radius:50%;border:1px solid var(--line);background:var(--card);color:var(--ink);display:grid;place-items:center;cursor:pointer;flex:none;padding:0}
.wz-back svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
[dir=rtl] .wz-back svg{transform:scaleX(-1)}
.wz-dots{display:flex;gap:6px;flex:1}.wz-dots i{height:6px;flex:1;border-radius:99px;background:var(--line)}.wz-dots i.done{background:color-mix(in srgb,var(--pri) 45%,var(--line))}.wz-dots i.on{background:var(--pri)}
.wz-body{flex:1}
.wz-foot{position:sticky;bottom:0;padding:14px 0 calc(14px + env(safe-area-inset-bottom));background:linear-gradient(to bottom,transparent,var(--bg) 26%);margin-top:14px;z-index:2}
.wz-foot .btn{width:100%}
.picks.one{grid-template-columns:1fr}.picks.one .pick{min-height:78px;padding:16px 18px}.pick.small{min-height:56px;padding:12px}
@keyframes wzInR{from{transform:translateX(100%)}to{transform:none}}@keyframes wzInL{from{transform:translateX(-100%)}to{transform:none}}
.wz.in-fwd{animation:wzInR .3s cubic-bezier(.2,.8,.2,1) both}.wz.in-back{animation:wzInL .3s cubic-bezier(.2,.8,.2,1) both}
[dir=rtl] .wz.in-fwd{animation-name:wzInL}[dir=rtl] .wz.in-back{animation-name:wzInR}
@media (prefers-reduced-motion:reduce){.wz.in-fwd,.wz.in-back{animation:none}}
.list.rv li{align-items:center}.rv-val{font-weight:600}
/* seder settings: one card per section */
.fsec{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:4px 16px 8px;margin:14px 0;box-shadow:var(--shadow)}
.fsec-h{display:flex;align-items:center;gap:8px;margin:0 -16px 4px;padding:12px 16px 10px;border-bottom:1px solid var(--line);font-size:13px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--pri)}
.fsec-h .nt{font-size:16px;letter-spacing:0}
.secs>.acts{margin-top:4px}
/* settings extras */
details.extras>summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:6px}details.extras>summary::-webkit-details-marker{display:none}
details.extras>summary::after{content:"▾";margin-inline-start:auto;color:var(--muted);transition:transform .2s}details.extras[open]>summary::after{transform:rotate(180deg)}
details.extras[open]>summary{margin-bottom:8px}
/* Hebrew date first */
.dbig{font-size:22px;font-weight:700;margin:2px 0 0;color:var(--ink)}
.cal button .g.he{font-size:16px}
body.inwz .tabs{display:none}
/* update #16 (M7): signed out = no tab bar (the hidden attribute lost to display:flex, so it covered Sign in on small phones) */
.tabs[hidden],body.out .tabs{display:none}
.wlang button{padding:4px 14px;font-size:14px;min-height:44px}
html[dir=ltr] .dbig{text-align:left;direction:rtl;unicode-bidi:plaintext}

/* buttons use the app's font; Today's Read / More row */
button,input,select,textarea{font-family:inherit}
.btns.row2{grid-template-columns:1fr 1fr}
.btn.ol{background:transparent;color:var(--pri);border:1.5px solid color-mix(in srgb,var(--pri) 55%,transparent);min-height:48px;font-size:17px;font-weight:600;white-space:nowrap;line-height:1.1}
.btn.ol:active{background:var(--pri-soft)}
.banner.owe{background:var(--gold-soft)}.banner.owe .btn{flex:none}
/* "Yasher koach" celebration (pure CSS, ~1.8 s) */
.yk{position:fixed;inset:0;z-index:40;pointer-events:none;display:grid;place-items:center}
.yk-msg{display:flex;flex-direction:column;align-items:center;gap:2px;background:var(--card);color:var(--ink);padding:16px 28px;border-radius:22px;box-shadow:0 12px 40px rgba(0,0,0,.25);animation:ykPop 1.8s ease forwards;margin-top:-8vh;text-align:center}
.yk-msg b{font-size:28px;color:var(--pri)}.yk-msg .he{color:var(--gold)}
.yk-star{font-size:34px;line-height:1;color:var(--gold);animation:ykSpin .9s ease}
@keyframes ykPop{0%{transform:scale(.4);opacity:0}14%{transform:scale(1.08);opacity:1}24%{transform:scale(1)}80%{opacity:1}100%{opacity:0;transform:scale(.97)}}
@keyframes ykSpin{from{transform:rotate(-140deg) scale(.2)}to{transform:none}}
.yk.calm .yk-msg{animation:ykFade 1.6s ease forwards}.yk.calm .yk-star{animation:none}
@keyframes ykFade{0%{opacity:0}12%{opacity:1}80%{opacity:1}100%{opacity:0}}
/* streak rewards */
.rw-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}
.rw{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:2px;padding:14px 10px;border-radius:16px;border:1px dashed var(--line);background:var(--card);opacity:.7}
.rw.on{opacity:1;border:1px solid color-mix(in srgb,var(--gold) 60%,transparent);background:linear-gradient(160deg,var(--gold-soft),var(--card));box-shadow:var(--shadow)}
.rw-icon{font-size:34px;line-height:1.2;filter:grayscale(1)}.rw.on .rw-icon{filter:none}.rw-icon.he{font-weight:800;color:var(--gold)}
.rw-pop{position:relative;display:flex;flex-direction:column;align-items:center}.rw-pop .rw{width:100%;max-width:260px;padding:22px 12px;animation:rwIn .5s cubic-bezier(.2,.9,.3,1.3) both}.rw-pop .rw-icon{font-size:56px}
@keyframes rwIn{from{transform:scale(.6) rotate(-6deg);opacity:0}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.rw-pop .rw{animation:none}}

/* skipped days: greyed, crossed out, "make up" until made up */
.cal button.skipd{background:var(--heat0);border-style:dashed}
.cal button.skipd::after{content:"";position:absolute;inset:4px;pointer-events:none;opacity:.55;background:linear-gradient(to top right,transparent calc(50% - 1px),var(--muted) calc(50% - 1px),var(--muted) calc(50% + 1px),transparent calc(50% + 1px)),linear-gradient(to top left,transparent calc(50% - 1px),var(--muted) calc(50% - 1px),var(--muted) calc(50% + 1px),transparent calc(50% + 1px))}
.cal button.skipd .g,.cal button.skipd .h{color:var(--muted);text-decoration:line-through}
.cal button.skipd.plan::after{opacity:.35}
.cal .mk{font-size:8.5px;line-height:1;font-weight:700;letter-spacing:.01em;white-space:nowrap;color:var(--warn);margin-bottom:2px;position:relative;z-index:1}
.cal button.skipd.owe{border-color:color-mix(in srgb,var(--warn) 60%,transparent)}
.cal .mk.ok{color:var(--ok);font-weight:600;opacity:.9}
.xk{font-weight:800;color:var(--muted)}
.tag.owe,.tag.ok{font-size:12px;padding:1px 8px;border-radius:99px;margin-inline-start:4px;font-weight:600}
.tag.owe{background:var(--warn-soft);color:var(--warn)}.tag.ok{background:var(--pri-soft);color:var(--ok)}
.hskip.owed b.xd{color:var(--muted);text-decoration:line-through}
.tag.owe,.tag.ok{text-transform:none;letter-spacing:0}

/* offline downloads */
.offl{vertical-align:-2px;color:var(--pri);flex:none}.offl.part{opacity:.5}
.offl-b{display:inline-flex;margin-inline-start:6px;vertical-align:middle}
.btn .offl{margin-inline-end:6px}
.offl-note{display:flex;align-items:center;gap:6px}
.offl-card .btn{display:inline-flex;align-items:center;white-space:nowrap}

/* Oct 25: skip & keep ("owed": amber outline until made up), day panel buttons, skip kinds, make-ups, pace dates, Shabbos reminder */
.cal button.owed{border:2px solid var(--gold);background:color-mix(in srgb,var(--gold) 10%,transparent)}
.cal button.owed.ahead{border-style:dashed;background:transparent}
.cal button.owed .mk{color:var(--gold)}
.owekey{display:inline-block;width:10px;height:10px;border-radius:3px;border:2px solid var(--gold);vertical-align:-1px}
.dbtns{display:flex;gap:6px;flex:none;align-items:center}
.skipkinds .kind{display:flex;flex-direction:column;align-items:flex-start;text-align:start;gap:3px;padding:14px 16px;height:auto;white-space:normal}
.skipkinds .kind span{font-weight:400;font-size:13.5px;opacity:.85;line-height:1.35}
.skipkinds .kind.keep{border:2px solid var(--gold)}
.banner.pickskip{align-items:flex-start}
.makeups li .btn{flex:none}
.pdates{display:grid;gap:10px;margin-top:10px}
.pdate{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:var(--card)}
.pdate .pi{font-size:22px;width:30px;text-align:center;flex:none;color:var(--muted);display:inline-flex;align-items:center;justify-content:center}
.pdate .pi .ico{width:22px;height:22px}
.pdate label{display:flex;flex-direction:column;gap:4px;flex:1;margin:0}
.pdate label>span{font-weight:700;font-size:14px}
.pdate input[type=date]{width:100%}
.psum{margin:12px 0 0;padding:10px 12px;border-radius:12px;background:var(--pri-soft);font-weight:600;line-height:1.4}
.shabrem{margin-top:12px;padding:12px;border-radius:14px;border:1px solid var(--line);background:color-mix(in srgb,var(--gold) 6%,var(--card))}
.shabrem .fhead{margin:0 0 4px}
.shabrem select,.shabrem input[type=time]{margin-top:8px}
.linkbtn{background:none;border:0;padding:0;color:var(--pri);font:inherit;font-weight:600;text-decoration:none;cursor:pointer}
.trouble{margin-top:10px}
.trouble summary{cursor:pointer;color:var(--muted);font-size:13.5px}

/* toast: centred with left:50% shrank to half the screen and wrapped short messages — size it to its words */
.toast{width:max-content;max-width:min(92vw,440px)}

/* How often (Oct 25) */
.freq{display:flex;flex-direction:column;gap:8px;margin-top:6px}
.freq>span{font-weight:600}
.seg.seg4{flex-wrap:wrap}.seg.seg4 button{flex:1 1 45%;min-width:0}
.fqrow .stepper>span:first-child{margin-inline-end:6px}
.wdays{display:flex;gap:6px;justify-content:space-between}
.wdays button{flex:1;aspect-ratio:1;max-width:48px;border-radius:50%;border:1.5px solid var(--line,#d8d0c2);background:var(--card,#fff);color:var(--ink);font-weight:700;font-size:15px;cursor:pointer;padding:0}
.wdays button[aria-pressed=true]{background:var(--pri);border-color:var(--pri);color:#fff}

/* Taps (Oct 25): no blue tap square, no focus ring on tap (keyboard still gets :focus-visible), a small press instead — like Run Coach */
html,body,a,button,label,summary,select,input,[role=button],[data-act],[tabindex]{-webkit-tap-highlight-color:transparent}
:focus:not(:focus-visible){outline:none}
a,button,summary,label,[role=button]{touch-action:manipulation}
.btn,.pick,.seg button,.wdays button,.kind,.linkbtn,.chip,.icon-btn,[data-m],.dbtns button,#ynBanner button{transition:transform .08s ease,filter .08s ease}
.btn:active:not([disabled]),.pick:active,.seg button:active,.wdays button:active,.kind:active,.linkbtn:active,.chip:active,.icon-btn:active,[data-m]:active,.dbtns button:active,#ynBanner button:active:not([disabled]){transform:scale(.98)}
#tabs a:active,.cal button:active,summary:active,.row-link:active,.sheet .list button:active,.cardlink:active{filter:brightness(.93)}
@media (prefers-reduced-motion:reduce){.btn:active:not([disabled]),.pick:active,.seg button:active,.wdays button:active,.kind:active,.linkbtn:active,.chip:active,.icon-btn:active,[data-m]:active,.dbtns button:active,#ynBanner button:active:not([disabled]){transform:none;filter:brightness(.93)}}

/* badges (update #6): streak ladder + siyum shields, drawn as inline SVG (site/js/badges.js) */
.bentry{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit}
.bentry-art svg{display:block;width:52px;height:52px}
.bstreaks{display:flex;gap:6px;overflow-x:auto;padding:10px 2px 4px;margin:0 -4px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
.bcoin,.bdg{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:2px;background:none;border:0;padding:4px 2px;color:inherit;font:inherit;cursor:pointer;scroll-snap-align:start;border-radius:12px}
.bcoin svg{width:84px;height:84px;display:block}.bcoin span{white-space:nowrap;color:var(--muted)}.bcoin.on span{color:var(--ink);font-weight:700}
.bcoin.next{background:var(--gold-soft)}
.bgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:10px 0 4px}
.bdg svg{width:96px;height:96px;max-width:100%;display:block}.bdg span{color:var(--muted)}.bdg.done span{color:var(--gold);font-weight:700}.bdg.progress span{color:var(--ink);font-weight:600}
.bgroup h3{font-size:1rem}
.bsheet{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px}.bsheet svg{width:220px;height:220px;max-width:70vw;animation:bIn .45s cubic-bezier(.2,.9,.3,1.3) both}
.bsheet h3{margin:6px 0 2px}.bsheet p{margin:2px 0;color:var(--muted)}
.bpop{position:relative;display:flex;justify-content:center;gap:10px;padding:8px 0 4px;flex-wrap:wrap}
.bpop-one{display:flex;flex-direction:column;align-items:center;gap:8px;animation:bPop .7s cubic-bezier(.18,.9,.25,1.35) both}
.bpop-one svg{width:210px;height:210px;max-width:62vw;filter:drop-shadow(0 6px 14px rgba(60,40,10,.18))}
.bpop.multi .bpop-one svg{width:130px;height:130px}
.bpop-one b{font-size:1.15rem;text-align:center}
@keyframes bPop{0%{transform:scale(.2) rotate(-14deg);opacity:0}60%{transform:scale(1.08) rotate(3deg);opacity:1}100%{transform:none;opacity:1}}
@keyframes bIn{from{transform:scale(.7);opacity:0}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.bpop-one,.bsheet svg{animation:none}}

/* Day-complete animations (update #7, from the demo's done-anims.css) */
.yd-host{position:relative}.yd-ov{position:absolute;pointer-events:none;z-index:4}
.yd-ring svg{display:block;overflow:visible}.yd-ring circle{fill:none}
.yd-cf{position:absolute;display:block;pointer-events:none;z-index:4;will-change:transform,opacity}
.yd-star{position:absolute;width:16px;height:16px;margin:-8px 0 0 -8px;pointer-events:none;z-index:4}.yd-star svg{display:block;width:100%;height:100%;overflow:visible}
.yd-num{display:inline-block;position:relative;overflow:hidden;vertical-align:bottom;line-height:inherit}.yd-num>.yd-old{position:absolute;left:0;top:0}.yd-num>.yd-new{display:inline-block}
.yd-fire{display:inline-block;transform-origin:50% 90%}
.bpop.still .bpop-one{animation:none!important}

/* update #8: Settings sections, Today's calendar line, long-press reordering */
html[dir=ltr] .dbig[data-calmode=en]{direction:ltr;unicode-bidi:normal}
.dsmall{font-size:14px;margin-top:2px}

.sedercards>article{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
/* update #23: one lifted card (no fade in or out: the shadow is there while lifted and gone at the drop), the others slide around a plain gap */
.sedercards>article.dragging{position:relative;z-index:5;box-shadow:0 12px 28px rgba(0,0,0,.2)!important;cursor:grabbing;will-change:transform}
.sedercards>article.dragging .y-press,.sedercards>article.dragging.y-press{background-image:none!important}
.sedercards.reordering>article{-webkit-tap-highlight-color:transparent}
#dataCard .row{gap:12px}

/* update #9: Reminders master switch off dims the reminder cards; own-sefer page */
.remoff{opacity:.45}
.remoff #pushCard,.remoff #shabCard{pointer-events:none}
/* update #9: streak pill — shields and the at-risk (make-up pending) state; the pill opens the streak sheet */
#streakPill{cursor:pointer;-webkit-tap-highlight-color:transparent}
#streakPill .shield{margin-inline-start:6px;font-size:.92em;opacity:.9}#streakPill .shield b{margin-inline-start:1px;font-weight:600}
#streakPill.risk{background:#ffe1a8;color:#7a4b00;box-shadow:0 0 0 1.5px #d98e04 inset}
[data-theme=dark] #streakPill.risk{background:#4a3a14;color:#f3cd7c;box-shadow:0 0 0 1px #9c7424 inset}
.mu-risk .grow .small{color:#8a5a00}[data-theme=dark] .mu-risk .grow .small{color:#f3cd7c}
.streak-rules li{align-items:flex-start;gap:8px}.risk-line{color:#8a5a00;margin:6px 0 0}[data-theme=dark] .risk-line{color:#f3cd7c}
.quiet-skip{color:var(--muted);font-weight:500;align-self:center}
.heat i.td{box-shadow:0 0 0 1.5px var(--pri)}

/* update #13: Settings as headers that open pages, ⓘ explanations, switches that open up */
.srows{padding:0 16px}.srow{display:flex;align-items:center;gap:12px;min-height:58px;padding:6px 0;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink);font-size:17px;font-weight:600;-webkit-tap-highlight-color:transparent}.srow:last-child{border-bottom:0}.srow:active{opacity:.6}
.sic{width:1.6em;text-align:center;font-size:20px;flex:none;color:var(--muted);display:inline-flex;align-items:center;justify-content:center}.sval{color:var(--muted);font-weight:500;font-size:15px;max-width:40%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chev{color:var(--muted);font-size:26px;line-height:1;flex:none}[dir=rtl] .chev{display:inline-block} /* › mirrors itself in RTL (bidi), so it points left there */
.sp-top{display:flex;align-items:center;gap:12px;margin:4px 0 8px}.sp-top h1{margin:0}
.ibtn{display:inline-grid;place-items:center;width:30px;height:30px;margin:-7px -2px;padding:0;border:0;background:none;color:var(--muted);cursor:pointer;vertical-align:middle;border-radius:50%;-webkit-tap-highlight-color:transparent}.ibtn:active{background:var(--pri-soft)}
.ibtn svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}.ibtn svg .dot{fill:currentColor;stroke-width:1.4}
.infotext p{margin:0 0 10px;line-height:1.5}.infotext .streak-rules{margin:0}
.xp{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .28s ease,opacity .28s ease}.xp.open{grid-template-rows:1fr;opacity:1}
.xp>.xpi{overflow:hidden;min-height:0;visibility:hidden;transition:visibility 0s linear .28s}.xp.open>.xpi{visibility:visible;transition:visibility 0s}
@media (prefers-reduced-motion:reduce){.xp,.xp>.xpi{transition:none}}
#remBlock>.xpi>.card:first-child{margin-top:0}
#shabCard .shabrem{border:0;background:none;padding:0;margin:0;box-shadow:none}
.switch:has(+ .xp:not(.open)){border-bottom:0}.card>.switch:only-child{border-bottom:0;padding:4px 0}

/* update #14: monochrome line icons (currentColor) instead of colour emoji in Settings */
.ico{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none;vertical-align:-.14em}
.sic .ico{width:22px;height:22px}
.fsec-h .fsec-ic{display:inline-flex;align-items:center}.fsec-h .fsec-ic .ico{width:18px;height:18px}
.swic{display:inline-flex;vertical-align:-3px;margin-inline-end:6px;color:var(--muted)}.swic .ico{width:19px;height:19px}
/* update #14: the "Read with no connection" Download button is the word alone, centred (the icon was green on green, so the word looked off-centre) */
.offl-card #sedOffl{min-width:112px;justify-content:center;text-align:center}
.btn.pri .offl{color:currentColor}
/* update #14: chazara "When you finish" picker (one select; "every few" opens a small stepper) */
.chz{padding:6px 0 4px}.chz-row{gap:12px;align-items:center;min-height:52px}.chz-row .sw-t{flex:1}.chz select{width:auto;max-width:60%;min-width:42%}
.chz-n{gap:8px;align-items:center;margin:2px 0 8px}.chz-n input[type=number]{width:72px;text-align:center;padding:8px}.chz-n .btn{min-width:44px;padding:8px}

/* ---------- update #15: "+", commitments, per-item 🔥, Badges | Medals tabs ---------- */
.addrow{display:flex;justify-content:center;margin:10px 0 2px}
.btn.plus{width:56px;height:56px;min-height:0;padding:0;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:var(--card);color:var(--pri);border:1.5px solid var(--line);box-shadow:var(--shadow)}
.btn.plus .ico{width:28px;height:28px;stroke-width:2}
.btn.plus.sm{width:42px;height:42px}.btn.plus.sm .ico{width:22px;height:22px}
.cic{display:inline-flex;align-items:center;justify-content:center;width:1.25em;height:1.25em;margin-inline-end:8px;color:var(--muted);vertical-align:-.2em}
.cic .ico{width:100%;height:100%}.cic.sm{width:1.05em;height:1.05em;margin-inline-end:6px}.cic.lg{width:1.1em;height:1.1em;margin-inline-end:10px}
.card.cmt .piece.cwhy{font-size:18px;margin:10px 0 2px}
.cweek{margin:8px 0 10px}
.btns.row1{grid-template-columns:1fr}
.ifire{white-space:nowrap}.ifire.zero{color:var(--muted)}.ifire.zero .yd-fire{filter:grayscale(1);opacity:.55}
.ifire .shield{margin-inline-start:6px}
.cicons{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.cicons.big{grid-template-columns:repeat(4,1fr);gap:12px}
.cicon{aspect-ratio:1;border-radius:14px;border:1.5px solid var(--line);background:var(--card);color:var(--muted);display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.cicon .ico{width:26px;height:26px}.cicons.big .cicon .ico{width:32px;height:32px}
.cicon[aria-pressed=true]{border-color:var(--pri);color:var(--pri);background:var(--pri-soft);border-width:2px}
.csugs{display:flex;flex-wrap:wrap;gap:8px}
.chip.csug{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border:1px solid var(--line);background:var(--card);cursor:pointer;font:inherit;color:var(--ink)}
.chip.csug .ico{width:18px;height:18px;color:var(--muted)}
.addpick .pick b{display:flex;align-items:center;gap:10px}
.pkic{display:inline-flex;color:var(--pri)}.pkic .ico{width:24px;height:24px}
.btabs{margin:6px 0 4px}
.bstreaks.sm .bcoin svg{width:60px;height:60px}
.card.ibadges h3{display:flex;align-items:center}
.card.ibadges.gone{opacity:.8}
/* Segmented controls (Bezalel 12:16 AM): the selected option in the accent colour, clearly visible in light and dark */
.seg button{color:var(--muted)}
.seg button[aria-pressed=true]{background:var(--pri);color:var(--pri-ink);box-shadow:var(--shadow)}
.wdays button[aria-pressed=true]{color:var(--pri-ink)}
/* "Your learning days" (Bezalel 12:05 AM): room around the grid so the newest column and today's ring aren't clipped, LTR and RTL */
.heat{padding:4px 6px 6px;margin-inline:-6px;scroll-padding-inline:6px}
.heat i.td{box-shadow:0 0 0 2px var(--pri)}
/* Username + Edit (Bezalel 12:16 AM) */
.unrow{display:flex;align-items:center;gap:10px}.unrow .grow{min-width:0;overflow:hidden;text-overflow:ellipsis}
.btn.edit{display:inline-flex;align-items:center;gap:6px}.btn.edit .ico{width:16px;height:16px}

/* ---------- update #16 ---------- */
/* M6: a finished card folds to one line: title ✓ 🔥 — the whole row opens it */
.card.compact{padding:0}
.card.compact .crow{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:10px;width:100%;padding:14px 16px;cursor:pointer;font-weight:650;font-size:16px;color:var(--ink);-webkit-tap-highlight-color:transparent;border-radius:inherit}
.card.compact .crow:focus-visible{outline:2px solid var(--pri);outline-offset:2px}
.card.compact .ctitle{display:flex;align-items:center;gap:8px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.card.compact .ck{color:var(--pri);font-weight:800;font-size:17px}
.card.compact .ifire{margin:0}
.cfold{display:block;margin:10px auto 0}
/* the 🔥 sits top-right of every card head (top-left in Hebrew) */
.chead{align-items:flex-start;gap:10px}
.chead .ifire{flex:none;margin-top:2px}
/* H3 / M9 notes */
.skipnote{color:var(--muted)}
.runnote{margin:8px 0 0;padding:8px 10px;border-radius:10px;background:var(--pri-soft);color:var(--ink)}
/* M3: one make-up list */
.mu-gap{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.mu-gap .grow{min-width:60%}
.gapbtns{display:flex;gap:8px;flex-wrap:wrap}
.mu-older details summary{cursor:pointer;padding:8px 0;list-style-position:inside}
.mu-older .list{margin-top:6px}
/* polish 9 */
.fhint{color:var(--warn);font-size:14px;margin:6px 2px 0}
/* polish 6: Sefaria sub-sections folded under their text */
.sfgroup details>summary{list-style:none;cursor:pointer}
.sfgroup details>summary::-webkit-details-marker{display:none}
.sfgroup details>summary::after{content:"▾";margin-inline-start:auto;opacity:.6}
.sfgroup details[open]>summary::after{content:"▴"}
.sfgroup .list{padding-inline-start:14px}

/* update #17: welcome fits 360×640 (Create + Sign in on screen in EN / HE / Aא) */
.wtop{display:flex;justify-content:flex-end}
.whero{display:flex;align-items:center;gap:14px;text-align:start;padding:10px 0 2px}.whero img{border-radius:16px;flex:none}
.whero h1{font-size:30px;margin:0;line-height:1.15}.whero h1 .he{font-size:22px;color:var(--muted);margin-inline-start:6px;font-weight:600}
.whero p{margin:4px 0 0;max-width:none}
.wacts{display:grid;gap:10px;margin-top:14px}
.wfeat{margin:14px 0 2px}.wfeat li{gap:10px;padding:7px 0;align-items:flex-start;border:0}.wfeat .sic{margin-top:1px}
.wlost{width:100%;min-height:44px}.wnote{margin-top:6px}
.bpop.many{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 6px;max-height:60vh;overflow:auto}.bpop.many .bpop-one{min-width:0}.bpop.many .bpop-art{width:88px;height:auto;max-width:100%}.bpop.many b{font-size:12px;line-height:1.25;overflow-wrap:anywhere}
/* update #17: Today's make-ups summary, Done all, streak-ended note, siyum note */
.mksum{padding:0}.mksum>summary{list-style:none;display:flex;align-items:center;gap:10px;min-height:48px;padding:10px 16px;cursor:pointer}.mksum>summary::-webkit-details-marker{display:none}
.mksum .mkdot{width:10px;height:10px;border-radius:50%;background:var(--muted);flex:none}.mksum.risk .mkdot{background:#d99a1e}
.mksum .mkv,.mksum .mkh{color:var(--pri);font-weight:600}.mksum .mkh{display:none}.mksum[open] .mkv{display:none}.mksum[open] .mkh{display:inline}
.mksum .mkbody{padding:0 16px 10px}.mksum .mkhelp{margin:0 0 4px;display:flex;align-items:center;gap:4px}
.doneall{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:4px 2px 8px}.doneall .btn{min-height:44px}
.endnote ul{margin:0}.endnote li{border:0;padding:4px 0}.endnote .btns{margin-top:8px}
.siyumnote .ck{color:var(--pri);font-weight:700}
/* update #17 (UX A) */
.quickgo{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;margin:4px 0 2px;text-decoration:none}.quickgo .ico{width:22px;height:22px}.qor{margin:6px 0 12px}
.qlist{padding:4px 12px}.qrow{display:flex;align-items:center;gap:12px;min-height:56px;padding:8px 2px;border-bottom:1px solid var(--line);cursor:pointer}.qrow:last-child{border-bottom:0}
.qrow input{width:24px;height:24px;flex:none;accent-color:var(--pri)}
/* update #17: masechta multi-pick */
.ymadd{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:10px}.ymadd .ico{width:20px;height:20px}
.ypicked li{min-height:44px}.yx{min-width:44px;min-height:44px;font-size:20px;line-height:1}
.mplist{max-height:52vh;overflow:auto;margin:6px 0;border:1px solid var(--line);border-radius:12px;padding:0 10px}
.mpg h4{margin:12px 0 4px;font-size:14px;color:var(--muted);display:flex;gap:6px;align-items:baseline}
.mprow{display:flex;align-items:center;gap:12px;min-height:44px;padding:4px 0;border-bottom:1px solid var(--line);cursor:pointer}.mpg .mprow:last-child{border-bottom:0}
.mprow input{width:22px;height:22px;flex:none;accent-color:var(--pri)}.mprow[hidden],.mpg[hidden]{display:none}
.mptot{margin:4px 0 0;font-weight:600}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* update #17 (Bezalel 8:30 AM): no text selection or long-press callout anywhere in the app, except the sefer text itself (the reader)
   and the fields you type in (and the one-time recovery code, which can be long-pressed to copy) */
html,body{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
input,textarea,select,[contenteditable="true"]{-webkit-user-select:text;user-select:text;-webkit-touch-callout:default}
.reader,.reader *{-webkit-user-select:text;user-select:text;-webkit-touch-callout:default}
.code{-webkit-user-select:all;user-select:all;-webkit-touch-callout:default}
/* update #17 (C): tap targets at least 44 px, and layouts that wrap at 200% text */
.ibtn{width:44px;height:44px;margin:-14px -9px}
#cPrev,#cNext{min-width:44px;min-height:44px}
.btn.small{min-height:44px}.seg button{min-height:44px}.chip[role=button],button.chip{min-height:44px}
.linkbtn{min-height:44px;display:inline-flex;align-items:center}
.tabs a{min-width:0;padding:4px 2px}.tabs a span{max-width:100%;text-align:center;line-height:1.15;overflow-wrap:anywhere;hyphens:auto}
.bcoin span{white-space:normal;text-align:center;overflow-wrap:anywhere;max-width:100%;line-height:1.2}.bgrid>*{min-width:0}.bcoin svg{max-width:100%;height:auto;aspect-ratio:1}
.stats{flex-wrap:wrap;row-gap:4px}.chead h3{overflow-wrap:anywhere}

/* update #18: New seder chooser (daily cycles first), the main sefarim grid, the join page's Start / Customize foot */
.picks.one.cyc .pick{min-height:62px;padding:12px 16px}
.picks.mains{grid-template-columns:1fr 1fr 1fr}
.picks.mains .pick.small{min-height:52px;padding:10px 12px;display:flex;align-items:center}
.picks.mains .pick.small b{font-size:15px;line-height:1.2}
.wz-foot .wz-more{margin-top:6px;font-size:15px;min-height:44px}
/* update #18: reader text size (A− / A+) */
.rd-tools{gap:8px;align-items:stretch}.rd-tools .seg{flex:1;min-width:0}
.rsz{display:flex;gap:4px;background:var(--heat0);border-radius:12px;padding:4px}
.rsz button{min-width:44px;min-height:40px;border:0;border-radius:9px;background:transparent;font-weight:700;cursor:pointer;color:var(--ink)}
.rsz button[disabled]{opacity:.35}.rsz .a1{font-size:13px}.rsz .a2{font-size:18px}
.reader .he{font-size:calc(22px * var(--rs,1))}.reader .en{font-size:calc(17px * var(--rs,1))}.reader .num{font-size:calc(13px * var(--rs,1))}
.credits p{font-size:15px;line-height:1.55}   /* update #28: Settings → Sources & credits */
/* update #18: Recently deleted → 🗑 delete forever */
.dellist li{gap:6px}.icon-btn.trash{width:44px;height:44px;display:inline-grid;place-items:center;border-radius:12px;color:var(--muted);background:transparent;border:0}
.icon-btn.trash svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media (hover:hover){.icon-btn.trash:hover{color:var(--warn)}}.icon-btn.trash:focus-visible{color:var(--warn)}
/* update #18: app text size (Settings → Display). Zoom scales text and layout together, so nothing overlaps at Large. */
html[data-ts=s] body{zoom:.9}
html[data-ts=l] body{zoom:1.15}
.seg.tsz button{flex:1}
/* update #18 (Bezalel: "like the Run Coach"): the soft press glow. A wash spreads from the finger (site/js/ripple.js, an overlay laid
   over the element, never inside it) and a soft green halo shows around it while pressed; focus gets the same halo. No blue tap flash. */
html,body,*,*::before,*::after{-webkit-tap-highlight-color:transparent}
/* update #23 (Bezalel 3:29 PM): a quick press flash instead of the glow: the element itself dims a touch (lightens in dark mode) the
   moment it's pressed (a light wash over its own background, inside its own corners) and steps back out within 120 ms; nothing is drawn outside it, so nothing can carry onto the next screen */
.y-press{background-image:linear-gradient(rgba(0,0,0,.09),rgba(0,0,0,.09))!important}
html[data-theme=dark] .y-press{background-image:linear-gradient(rgba(255,255,255,.13),rgba(255,255,255,.13))!important}
.y-unpress{background-image:linear-gradient(rgba(0,0,0,.04),rgba(0,0,0,.04))!important}
html[data-theme=dark] .y-unpress{background-image:linear-gradient(rgba(255,255,255,.06),rgba(255,255,255,.06))!important}
.btn,.pick,.chip,.icon-btn,.seg button,.card[href],.srow,.cicon,.linkbtn,.tabs a{transition:box-shadow .25s ease-out,transform .08s ease,filter .08s ease}

.upnext{margin:10px 4px;line-height:1.6}.upnext a{color:inherit;font-weight:600}
/* update #18: commitment "More options" (monthly, every N, yearly) */
.cfmorebox{margin-top:4px}.cfsub{margin-top:10px;gap:8px;flex-wrap:wrap;align-items:center}.cfsub select{min-height:44px}
.seg.sm button{font-size:15px}.cfnext{margin:12px 0 0;color:var(--pri);font-weight:600}
#fCF .stepper{flex-wrap:wrap;gap:8px}
.cfsub[hidden],.cfmorebox.hidden{display:none!important}
/* update #19: the bell and its inbox */
.bellbtn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;margin:-6px -8px -6px 0;border:0;background:none;color:var(--ink);border-radius:99px;cursor:pointer;-webkit-tap-highlight-color:transparent}
[dir=rtl] .bellbtn{margin:-6px 0 -6px -8px}
.bellbtn .ico{width:23px;height:23px;stroke-width:1.6}
.bellbtn .bdot{position:absolute;top:6px;inset-inline-end:5px;min-width:17px;height:17px;padding:0 4px;border-radius:99px;background:var(--pri);color:var(--pri-ink);font-size:11px;font-weight:700;line-height:17px;text-align:center;box-shadow:0 0 0 2px var(--bg)}
.bellbtn.has .ico{animation:bellnod .6s ease-out 1}
@keyframes bellnod{0%,100%{transform:rotate(0)}30%{transform:rotate(14deg)}60%{transform:rotate(-10deg)}}
@media (prefers-reduced-motion:reduce){.bellbtn.has .ico{animation:none}}
.inbox{list-style:none;margin:10px 0 0;padding:0}
.inbox li+li{border-top:1px solid var(--line)}
.nrow{display:flex;gap:12px;align-items:flex-start;width:100%;min-height:56px;padding:12px 2px;border:0;background:none;text-align:start;cursor:pointer;border-radius:12px}
.nrow .nic{flex:none;display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:99px;background:var(--pri-soft);color:var(--pri)}
.nrow .nic .ico{width:19px;height:19px}
.nrow .ntxt{display:flex;flex-direction:column;gap:2px;min-width:0;overflow-wrap:anywhere}
.nrow .ntxt b{font-weight:600}
.nrow:not(.unread) .ntxt b{font-weight:500}
.nrow .nwhen{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:6px;white-space:nowrap}
.nrow .udot{display:block;width:9px;height:9px;border-radius:99px;background:var(--pri)}
.inbox-empty{text-align:center;padding:28px 8px 18px;color:var(--muted)}
.inbox-empty>.ico{width:40px;height:40px;stroke-width:1.3;margin-bottom:6px}
.inbox-empty p{margin:4px 0}.inbox-empty b{color:var(--ink)}
/* update #19: reminder times and tefillah sets */
.remtimes{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.remrow{display:flex;gap:8px;align-items:center}.remrow input[type=time]{flex:1}
.remdel{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--muted);cursor:pointer}
.remdel .ico{width:18px;height:18px}
.remadd{margin-top:6px;min-height:44px}
.zrow{display:grid;grid-template-columns:1fr 1.2fr;gap:8px;margin-top:8px}.zrow select{min-width:0;min-height:44px;font-size:16px;padding-inline:10px 6px}
.zprev{margin:8px 0 0}
.tefpicks{display:flex;flex-direction:column;gap:10px}
.tefpick{display:flex;align-items:center;gap:12px;width:100%;min-height:58px;padding:12px 16px;border:1.5px solid var(--line);border-radius:var(--r);background:var(--card);cursor:pointer;text-align:start}
.tefpick .tpk{flex:none;width:24px;height:24px;border-radius:7px;border:2px solid var(--line);display:inline-flex;align-items:center;justify-content:center;color:transparent}
.tefpick[aria-pressed=true]{border-color:var(--pri);background:var(--pri-soft)}
.tefpick[aria-pressed=true] .tpk{background:var(--pri);border-color:var(--pri);color:var(--pri-ink)}
.tefpick b{font-size:19px}
.tefrem{border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;margin-bottom:10px;background:var(--card)}
.tgroup .trows{list-style:none;margin:8px 0 0;padding:0}
.tgroup .trow{display:flex;align-items:center;gap:10px;min-height:56px;padding:6px 0;border-top:1px solid var(--line)}
.tgroup .trow a.tname{flex:1;min-width:0;color:inherit;text-decoration:none;display:flex;flex-direction:column}
.tgroup .trow a.tname b{font-size:19px}
.tgroup .trow .btn{min-width:96px;min-height:44px}
.tgroup .trow.tdone a.tname b{color:var(--muted)}
.tgroup .tnote{margin:6px 0 0}

/* update #20: reader "Aa" (opens A− / slider / A+) and pinch-to-zoom on the text only (pinch.js); the page itself never zooms */
.rd-h{min-width:0;overflow-wrap:anywhere}.rd-hbtns{gap:8px;flex:none}
.rd-aa{min-width:48px;font-weight:700;letter-spacing:-.02em}.rd-aa .aa1{font-size:17px}.rd-aa .aa2{font-size:13px}.rd-aa.on{background:var(--pri-soft);color:var(--pri)}
.rsz2{align-items:center;gap:6px;margin-top:10px}.rsz2 input[type=range]{flex:1;min-width:0;accent-color:var(--pri);height:32px}
.rsz2 .rpct{min-width:46px;text-align:center;font-weight:700;font-size:14px;color:var(--muted)}
.rd-tip{margin:6px 2px 0}
.reader{touch-action:pan-x pan-y}.reader.pinching,.reader.pinching *{-webkit-user-select:none;user-select:none}
/* update #20: Settings → Feedback (Report a bug / Suggest a feature) */
.fbtext{width:100%;min-height:150px;resize:vertical;font:inherit;font-size:16px;line-height:1.45;padding:12px;border:1px solid var(--line);border-radius:14px;background:var(--bg);color:var(--ink);box-sizing:border-box}
.fbcount{text-align:end;margin:4px 2px 0}
.fbshot{display:flex;align-items:center;gap:10px;margin-top:12px}.fbshot img{width:64px;height:64px;object-fit:cover;border-radius:10px;border:1px solid var(--line)}
.fbshot .btn{display:inline-flex;align-items:center;gap:8px}.fbshot .ico{width:20px;height:20px}
.fbinc{display:flex;align-items:center;gap:4px;margin-top:12px}
.fbdone{text-align:center;padding:26px 6px 6px}.fbdone .fbok{display:inline-grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--pri-soft);color:var(--pri);margin-bottom:10px}
.fbdone .fbok .ico{width:30px;height:30px}
.fberr{color:var(--warn);margin:8px 2px 0}
button.srow{width:100%;background:none;border:0;border-bottom:1px solid var(--line);font:inherit;font-size:17px;font-weight:600;color:var(--ink);text-align:start;cursor:pointer;box-sizing:border-box}
button.srow:last-child{border-bottom:0}
.fbhead{font-size:15px;font-weight:700;color:var(--muted);margin:22px 4px 8px;text-transform:none}

/* update #20: which translation the English is (Bezalel 11:54 AM) */
.reader .rd-tr{margin:6px 0 18px;font-size:.78rem;line-height:1.4;opacity:.85}
/* update #20 (Bezalel 12:36 PM): "Start at": a caption over each box; Hebrew names show their beginning */
.sa-row{align-items:flex-end;gap:8px}.sa-col{display:flex;flex-direction:column;gap:3px;min-width:0}.sa-col>span{padding-inline-start:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sa-col select{width:100%;min-width:0;text-overflow:ellipsis}select[dir=rtl]{text-align:right}
/* update #20 (Bezalel 12:35 PM): "Create your own" row */
.mine-card{margin-top:12px}.mine-btn{width:100%;justify-content:flex-start;gap:8px;text-align:start;background:transparent;border:1px solid var(--line,rgba(127,127,127,.35));color:var(--pri);box-shadow:none;font-weight:500;min-width:0}
.mine-btn svg{flex:none}.mine-l{flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.mine-l b{font-weight:700}
/* update #22: a quiet "More ▾" (no green, no underline), zman reminder rows, the location box, Yomi's own time picker, no blue selection */
.cfmore{display:inline-flex;align-items:center;gap:4px;margin:8px 0 2px;min-height:44px;padding:0 2px;background:none;border:0;color:var(--muted);font:inherit;font-size:15px;font-weight:600;text-decoration:none;cursor:pointer}
.cfmore .chev{display:inline-block;transition:transform .2s ease;font-size:12px}.cfmore[aria-expanded=true] .chev{transform:rotate(180deg)}
@media (prefers-reduced-motion:reduce){.cfmore .chev{transition:none}}
.remtimes{display:grid;gap:10px}
.remrow{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.remrow .seg.xs{flex:0 0 auto;padding:3px;gap:3px}.remrow .seg.xs button{flex:0 0 auto;min-height:40px;padding:0 12px;font-size:14.5px}
.remrow .remdel{margin-inline-start:auto}
.remrow .zrow{flex:1 1 100%;margin-top:0}
.remrow .zprev{flex:1 1 100%;margin:0}
.tbtn{flex:1 1 7.5em;min-height:44px;padding:0 14px;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink);font:inherit;font-size:17px;font-weight:600;text-align:start;cursor:pointer;-webkit-user-select:none;user-select:none}
.tbtn.hidden,.remrow .hidden{display:none!important}
.shabrem .tbtn{margin-top:8px;width:100%}
.zloc:empty{display:none}.zloc{margin-top:10px}.zlocline{margin:0;display:flex;flex-wrap:wrap;align-items:center;gap:4px}
.linkbtn.quiet{color:var(--muted);text-decoration:none;font-weight:600;min-height:32px}
.locprompt{border:1px solid var(--line);border-radius:14px;padding:12px}
.locbox{display:grid;gap:8px}.locbox .locme{width:100%}
.loclist{display:grid;gap:6px}.locpick{display:flex;justify-content:space-between;gap:8px;align-items:center;min-height:46px;padding:8px 12px;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink);font:inherit;text-align:start;cursor:pointer}
.zlist{display:grid;grid-template-columns:1fr auto;gap:6px 12px;margin:0}.zlist dt{color:var(--muted)}.zlist dd{margin:0;font-weight:600;font-variant-numeric:tabular-nums}
.tpick .wheels{position:relative;display:flex;justify-content:center;align-items:center;gap:6px;height:220px;margin:6px auto 0;max-width:300px}
.wheel{flex:1;height:220px;overflow-y:auto;scroll-snap-type:y mandatory;scrollbar-width:none;-webkit-mask-image:linear-gradient(transparent,#000 30%,#000 70%,transparent);mask-image:linear-gradient(transparent,#000 30%,#000 70%,transparent);position:relative;z-index:1;outline:none}
.wheel::-webkit-scrollbar{display:none}.wpad{height:88px}
.witem{height:44px;line-height:44px;text-align:center;font-size:22px;font-variant-numeric:tabular-nums;scroll-snap-align:center;color:var(--muted);cursor:pointer}
.witem[aria-selected=true]{color:var(--ink);font-weight:700}
.wcolon{font-size:22px;font-weight:700;z-index:1}
.wband{position:absolute;left:0;right:0;top:88px;height:44px;border-radius:12px;background:var(--pri-soft);z-index:0}
input::selection,textarea::selection{background:color-mix(in srgb,var(--pri) 28%,transparent)}
input[type=number]::selection{background:transparent}
input:not([type=checkbox]):not([type=radio]):focus,select:focus,textarea:focus{outline:none;border-color:var(--pri)}
html.kbd input:not([type=checkbox]):not([type=radio]):focus-visible,html.kbd select:focus-visible{outline:2px solid color-mix(in srgb,var(--pri) 75%,transparent);outline-offset:2px}
input::-webkit-datetime-edit-hour-field:focus,input::-webkit-datetime-edit-minute-field:focus,input::-webkit-datetime-edit-ampm-field:focus{background:transparent;color:inherit}
/* update #22 (Bezalel 1:48 PM): an opened done card folds when its body is tapped; the swap eases in */
article[data-fold]{cursor:pointer;-webkit-tap-highlight-color:transparent}
article[data-fold]:focus-visible{outline:2px solid color-mix(in srgb,var(--pri) 70%,transparent);outline-offset:2px}
.card.cswap{animation:cswap .22s ease-out;transform-origin:50% 0}
@keyframes cswap{from{opacity:.35;transform:scaleY(.97)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.card.cswap{animation:none}}
/* update #22 (Bezalel 1:54 PM): the Calendar day card's done mark is Today's green check */
.dname{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}.dname .dck,.list .dck{color:var(--pri);font-weight:800;font-size:17px;line-height:1}

/* update #24: sign-in sheets and the Account page */
.ordiv{display:flex;align-items:center;gap:10px;margin:14px 0 4px}.ordiv::before,.ordiv::after{content:"";flex:1;border-top:1px solid var(--line)}
.btn.wide{width:100%;display:flex;align-items:center;justify-content:center;gap:8px}.btn.wide .ico{width:20px;height:20px}
input[type=email],input[type=password],input[type=tel]{width:100%;min-height:48px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--card)}
input.codein{font-size:26px;letter-spacing:8px;text-align:center;font-variant-numeric:tabular-nums}
.acnudge{border:1px solid var(--line)}
.emline{margin:0 0 4px;overflow-wrap:anywhere;text-align:start;unicode-bidi:isolate}[dir=rtl] .emline,html[dir=rtl] .emline{text-align:end}
.srow .sval{max-width:55%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
button.srow{width:100%;background:none;border:0;border-bottom:1px solid var(--line);font:inherit;font-size:17px;font-weight:600;text-align:start;cursor:pointer}button.srow:last-child{border-bottom:0}

/* update #26: Shnayim Mikra reader — each pasuk twice, then Targum Onkelos (and Rashi) */
.reader .sm-how{margin:0 0 12px}.reader .sm-src{margin-top:18px;opacity:.85}
.reader .sm-al{margin:18px 0 6px;color:var(--gold);font-size:.9rem;font-weight:700}
.reader .sm-ch{margin:12px 0 4px}
.reader .sm-p{padding:4px 0 10px;margin:0 0 8px;border-bottom:1px solid var(--line)}.reader .sm-p:last-of-type{border-bottom:0}
.reader .sm-p p{margin:0 0 6px}
.reader .he.sm-t{font-size:calc(19px * var(--rs,1));line-height:1.65;padding-inline-start:10px;border-inline-start:3px solid var(--line)}
.reader .sm-r{padding-inline-start:10px;border-inline-start:3px solid var(--gold-soft);margin-top:4px}
.reader .sm-r .he{font-size:calc(17px * var(--rs,1));line-height:1.6;color:var(--muted)}.reader .sm-r b{color:var(--ink);font-weight:700}
.reader .sm-lb{font-size:.6em;color:var(--muted);font-weight:700;margin-inline-end:8px;letter-spacing:.02em}

/* update #28: the hidden iOS haptic switch (app.js iosTick): no layout, no taps, no focus ring */
.ios-hap{position:fixed;left:0;top:0;width:1px;height:1px;overflow:hidden;opacity:0;pointer-events:none;clip-path:inset(50%);z-index:-1}
