/* Mishna Berura (v3, Oct 20 2026): Instinct's Siman 1 pages in the Daf Quest look.
   Learn = the Shulchan Aruch only, one card per piece; a note opens underneath its card like Rashi/Tosafot on a Gemara part.
   Wide screens: the cards on one side, the current printed page on the other (the Gemara's Learn | Tzurat HaDaf split).
   Phones in portrait: Learn | Printed page switch; on the printed page notes dock at the bottom (no dimmed backdrop).
   A Shaar HaTziyun is added under its Mishna Berura note (.mb-att), never in place of it. */
#view-mb{--c-sa:#5478ff;--c-mb:#a55eea;--c-bh:#ff7a45;--c-sht:#14b8a6;--c-beh:#10b981;--c-st:#ff5c7a}
.mb-c-sa{--c:#5478ff;--cbg:#eef2ff;--cbd:#dfe6ff}.mb-c-mb{--c:#a55eea;--cbg:#f6efff;--cbd:#eadcff}.mb-c-bh{--c:#ff7a45;--cbg:#fff3ec;--cbd:#ffe0d2}
.mb-c-sht{--c:#0f9e8f;--cbg:#e9fbf8;--cbd:#c8f1ea}.mb-c-beh{--c:#10b981;--cbg:#eafbf3;--cbd:#c9f2df}.mb-c-st{--c:#ff5c7a;--cbg:#fff0f3;--cbd:#ffd6de}
.mb-hero .about-p .demo{pointer-events:none}
.mb-bar{display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between;align-items:center;margin:0 0 12px}
.mb-bar .seg button{font-size:14.5px}
.mb-h{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:0 0 6px;font-size:16px}
.mb-h .mb-he{font-family:var(--he);font-size:19px;font-weight:800;direction:rtl}
.mb-h .mb-en{font-size:14px;font-weight:700;color:var(--muted);white-space:nowrap}
.mb-sa{margin-bottom:14px}
.mb-sa>.mb-h{padding:0 4px}
.mb-sat{font-family:var(--he);font-weight:800;text-align:center;font-size:18px;margin:2px 0 10px;color:#3b4bb8}
/* one card per Shulchan Aruch piece (the Gemara's .segc look) */
.mb-plist{display:flex;flex-direction:column;gap:12px}
.mb-pcard{position:relative;background:#fff;border-radius:20px;box-shadow:var(--shadow);padding:12px 14px 10px;transition:box-shadow .25s}
.mb-pcard.open{box-shadow:0 0 0 2px #dfe6ff,var(--shadow)}
.mb-ptx{font-family:var(--he);font-size:21px;line-height:2;text-align:right;cursor:pointer;border-radius:10px;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}
.mb-pcard.rama .mb-ptx{font-size:18px;color:#4a4566}
.mb-sn{display:inline-grid;place-items:center;min-width:28px;height:28px;border-radius:50%;background:var(--yellow);font-weight:800;font-size:16px;margin:0 2px 0 4px;vertical-align:middle}
.mb-cont{color:var(--muted);margin-left:4px}
.mb-bg{font-size:11px;color:var(--muted);margin:0 1px}
.mbk{display:inline-flex;align-items:center;justify-content:center;min-width:28px;height:24px;padding:0 6px;margin:0 2px;border-radius:999px;font-family:var(--he);font-size:13.5px;font-weight:800;line-height:1;vertical-align:middle;color:#fff;cursor:pointer;box-shadow:0 2px 0 rgba(0,0,0,.12);transition:transform .12s}
.mbk:active{transform:scale(.92)}
.mbk.on{outline:3px solid #ffd84d;outline-offset:1px}
.mbk.off{opacity:.45;cursor:default}
.mbk-mb{background:var(--c-mb,#a55eea)}
.mbk-bh{background:#fff3ec;color:#ff7a45;border:1.5px solid #ffcfb8;font-size:12px;min-width:26px;height:22px;box-shadow:none}
.mbk-sht{background:var(--c-sht,#14b8a6);font-size:12.5px;height:22px;min-width:26px}
.mbk-beh{background:var(--c-beh,#10b981);font-size:12.5px;height:22px;min-width:26px}.mbk-st{background:var(--c-st,#ff5c7a);font-size:12.5px;height:22px;min-width:26px}
.mb-prow{display:flex;gap:7px;flex-wrap:wrap;margin-top:8px;direction:ltr}
.mb-pill{display:inline-flex;align-items:center;gap:5px;padding:5px 11px;border-radius:999px;font-weight:700;font-size:13px;border:2px solid var(--cbd);background:var(--cbg);color:var(--c);min-height:34px;transition:background .15s,color .15s}
.mb-pill .he{font-family:var(--he);font-size:14.5px}
.mb-pill[aria-expanded="true"]{background:var(--c);border-color:var(--c);color:#fff}
.mb-pill-more{--c:#10b981;--cbg:#f4fbf7;--cbd:#d4f0e2;font-size:13px}
.mb-ramanote{margin:10px 4px 0;font-size:12px}
/* the panel (same feel as .comm under a Gemara part) */
.mb-slot:empty{display:none}
.mb-panel{margin-top:10px;border-radius:16px;padding:10px 12px 12px;background:var(--cbg);border-right:4px solid var(--c);animation:rise .25s}
.mb-pn-top{display:flex;align-items:center;gap:8px}
.mb-pn-t{flex:1;font-size:15px;line-height:1.3;min-width:0}
.mb-pn-t b{color:var(--c)}
.mb-pn-e{font-size:18px}
.mb-x{flex:none;width:32px;height:32px;border-radius:50%;background:#fff;color:var(--muted);font-size:15px;display:grid;place-items:center;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.mb-pn-sub{margin:6px 0 2px;font-size:14px;color:#4a4566}
.mb-pn-he{font-family:var(--he);direction:rtl;text-align:right;font-size:18.5px;line-height:1.85;background:#fff;border-radius:12px;padding:10px 12px;margin-top:8px;-webkit-touch-callout:none}
.mb-pn-he b{color:var(--c)}
.mb-pgjump{display:inline-block;font-family:"Fredoka",system-ui,sans-serif;font-size:12px;color:var(--muted);background:var(--cbg);border-radius:999px;padding:0 8px;margin:0 4px}
.mb-shtrow{margin-top:10px}
.mb-shtrow-h{display:block;font-size:12.5px;font-weight:700;color:#0f9e8f;margin-bottom:6px}
.mb-shtrow-h .muted{font-weight:500}
.mb-shtbtns{display:flex;flex-wrap:wrap;gap:6px;direction:rtl;justify-content:flex-start}
.mb-kid{margin-top:10px;background:linear-gradient(135deg,#fffaf0,#fff3d6);border-radius:14px;padding:9px 12px;border:2px solid #ffe8b0}
.mb-kid-h{font-weight:700;font-size:13.5px;color:#b7791f}
.mb-kid p{margin:3px 0 0;font-size:15.5px;line-height:1.5}
.mb-pn-en{font-size:15px;line-height:1.55;margin-top:10px;color:#3d3758}
.mb-links{margin-top:12px;display:flex;flex-direction:column;gap:7px}
.mb-links-h{font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.mb-link{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:8px 12px;border-radius:12px;background:#fff;border:2px solid var(--cbd);color:var(--ink);font-size:14.5px}
.mb-link b{color:var(--c)}
.mb-link .mb-le{font-size:18px}
.mb-link .wc-go{margin-left:auto;color:var(--c);font-size:20px}
.mb-dh{font-family:var(--he);font-weight:800;margin-left:4px}
.mb-link .mb-dh{font-weight:600;font-size:15.5px}
.mb-pn-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 10px;margin-top:12px}
.mb-findp{padding:6px 12px;border-radius:999px;background:#fff;border:2px solid #f1dfa8;font-weight:700;font-size:13.5px;color:#7a5a12}
/* the Printed page: a docked panel at the bottom of the screen, no backdrop */
.mb-dock{position:fixed;z-index:60;left:0;right:0;margin:0 auto;bottom:calc(var(--tabh) + 10px + env(safe-area-inset-bottom));width:min(640px,calc(100vw - 20px));max-height:min(54vh,520px);overflow:auto;border-radius:20px;background:#fff;box-shadow:0 12px 40px rgba(40,30,80,.28),0 0 0 1px rgba(0,0,0,.04);animation:up .26s cubic-bezier(.2,.9,.3,1.1);overscroll-behavior:contain}
.mb-dock>.mb-panel{margin:0;border-radius:20px}
.mb-printwrap{padding:8px;overflow:hidden}
.mb-print{display:block;width:100%;height:70vh;border:0;border-radius:14px;background:#fff}
.mb-printnote{margin:8px 4px 2px;text-align:center}
.mb-pfbox{position:relative;overflow:hidden;margin:0 auto;background:#fff;border-radius:12px;box-shadow:var(--shadow);direction:ltr}
.mb-pfbox .mb-print{position:absolute;top:0;left:0;width:760px;height:900px;transform-origin:0 0;border-radius:0}
.mb-done{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;align-items:center;margin:12px 0 4px}
.mb-plus{font-size:14px;background:rgba(255,255,255,.25);border-radius:999px;padding:2px 8px}
.mb-hero h2 .ch-heb{display:block;font-size:16px;margin-top:2px}
@media (min-width:700px){.mb-ptx{font-size:23px}.mb-pcard.rama .mb-ptx{font-size:19.5px}}
/* press and hold */
.mb-ptx.lp-hold,.mb-pn-he.lp-hold{background:rgba(255,216,77,.35);transition:background .3s}
.mb-ptx.lp-fired{animation:none;background:rgba(255,216,77,.5)}
@media (hover:hover) and (pointer:fine){
  .mb-ptx>.lp-ico{position:absolute;top:-10px;left:22px;z-index:1;box-shadow:0 2px 0 rgba(0,0,0,.08)}
  .mb-pcard:hover .mb-ptx>.lp-ico{opacity:1}
}
/* v3: a Shaar HaTziyun (or a Ba'er Heitev / Sha'arei Teshuvah from 🌿) added under the open note, nested inside it */
.mb-shtbtns .mb-pill[aria-pressed="true"]{background:var(--c);border-color:var(--c);color:#fff}
.mb-link.on{border-color:var(--c);box-shadow:0 0 0 2px var(--cbd)}
.mb-att{margin:10px 14px 2px 0;padding:8px 10px 10px;border-radius:14px;background:var(--cbg);border:2px solid var(--cbd);border-right:4px solid var(--c);animation:rise .22s}
.mb-att-top{display:flex;align-items:center;gap:6px}
.mb-att-t{flex:1;min-width:0;font-size:14px;line-height:1.3}
.mb-att-t b{color:var(--c)}
.mb-att-t bdi{font-family:var(--he)}
.mb-att-find{flex:none;width:30px;height:30px;border-radius:50%;background:#fff;font-size:14px;display:grid;place-items:center;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.mb-x-sm{width:30px;height:30px;font-size:13px}
.mb-att-he{font-family:var(--he);direction:rtl;text-align:right;font-size:17.5px;line-height:1.8;background:#fff;border-radius:10px;padding:8px 10px;margin-top:6px;-webkit-touch-callout:none}
.mb-att .mb-kid{margin-top:8px}.mb-att .mb-kid p{font-size:15px}
.mb-att .mb-pn-en{font-size:14.5px;margin-top:8px}
.mb-att-he.lp-hold{background:rgba(255,216,77,.35);transition:background .3s}
.mb-pcard.mb-hl{animation:mbHl 1.6s ease-out}
@keyframes mbHl{0%,40%{box-shadow:0 0 0 4px #ffd84d,var(--shadow)}100%{box-shadow:0 0 0 0 #ffd84d,var(--shadow)}}
/* v3: side by side, the cards on one side and the printed page on the other (the Gemara's own split: 1000px, or a phone turned sideways) */
.mb-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;align-items:start}
.mb-split .mb-main{min-width:0}
.mb-tzpane{position:sticky;top:calc(66px + env(safe-area-inset-top));margin-bottom:14px}
.mb-tzbox{max-height:calc(100vh - 66px - var(--tabh) - 120px);min-height:300px;overflow:auto;overscroll-behavior:contain;border-radius:12px;background:#fff}
.mb-tzbox .mb-pfbox{box-shadow:none;border-radius:0;margin:0}
@media (min-width:1000px){main:has(#view-mb.mb-is-split:not([hidden])){max-width:1380px}}
@media (orientation:landscape) and (max-width:999px){
  main:has(#view-mb.mb-is-split:not([hidden])){max-width:none}
  .mb-split{gap:10px}
  .mb-tzpane{top:calc(58px + env(safe-area-inset-top));padding:6px 4px}
  .mb-tzpane .tz-head{padding:0 6px 4px}.mb-tzpane .tz-head .muted{display:none}
  .mb-tzpane .tz-credit{display:none}
  .mb-tzbox{max-height:calc(100vh - 58px - var(--tabh) - 52px);min-height:160px}
  .mb-split .mb-ptx{font-size:19px}
}