/* Fonts are served from /fonts (both SIL OFL 1.1, licences beside them): no request leaves the site. */
@font-face{font-family:Amiri;font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/Amiri-400-arabic.woff2) format("woff2");unicode-range:U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1}
@font-face{font-family:Amiri;font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/Amiri-400-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:Amiri;font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/Amiri-400-latin.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:Amiri;font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/Amiri-700-arabic.woff2) format("woff2");unicode-range:U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1}
@font-face{font-family:Amiri;font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/Amiri-700-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:Amiri;font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/Amiri-700-latin.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:Inter;font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/Inter-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:Inter;font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/Inter-latin.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
/* Ṣalāh study app. Paper-and-ink palette; light / dark / auto.
   Scales: space --s1..--s6 (4 8 12 16 24 32), type --t-xs..--t-2xl, radius --r1..--r3. */
:root{color-scheme:light dark;
--s1:.25rem;--s2:.5rem;--s3:.75rem;--s4:1rem;--s5:1.5rem;--s6:2rem;
--t-xs:.75rem;--t-sm:.8125rem;--t-base:1rem;--t-md:1.0625rem;--t-lg:1.25rem;--t-xl:1.55rem;--t-2xl:2rem;
--r1:.5rem;--r2:.75rem;--r3:1rem;--tap:max(44px,2.75rem);
--bg:#f6f1e7;--card:#fffdf8;--ink:#2a2620;--mute:#5f5546;--line:#e4dcc9;--line2:#c9bd9f;
--acc:#1f6f5c;--acc-ink:#fff;--acc-soft:#e4efe9;--arbg:#fbf6ea;--warn:#8f4f0c;--good:#2a6f47;--sel:#fff1c4;--shadow:0 1px 2px rgba(60,45,20,.06);
--b-req:#14573f;--b-reqbg:#d6ece3;--b-sun:#1d4f8a;--b-sunbg:#dce8f7;--b-ok:#554e41;--b-okbg:#ebe4d4;--b-dis:#7d4300;--b-disbg:#fbe6c2;--b-no:#9c241c;--b-nobg:#f8d9d4;--b-dsp:#62288a;--b-dspbg:#ecdcf6;--ar-scale:1}
:root[data-theme=dark]{--bg:#14120f;--card:#1d1a15;--ink:#ece6d8;--mute:#aea48d;--line:#332f28;--line2:#5a5346;--acc:#58bda2;--acc-ink:#0c1a16;--acc-soft:#1a2b25;--arbg:#17150f;--warn:#e0a35c;--good:#6fcf95;--sel:#332e14;--shadow:none;
--b-req:#8fe0c3;--b-reqbg:#1b3a30;--b-sun:#9cc4f5;--b-sunbg:#1c2c44;--b-ok:#cfc6b0;--b-okbg:#2e2a22;--b-dis:#f5c070;--b-disbg:#43310f;--b-no:#ff9d92;--b-nobg:#472320;--b-dsp:#d9b0f2;--b-dspbg:#3a2748}
@media(prefers-color-scheme:dark){:root[data-theme=auto]{--bg:#14120f;--card:#1d1a15;--ink:#ece6d8;--mute:#aea48d;--line:#332f28;--line2:#5a5346;--acc:#58bda2;--acc-ink:#0c1a16;--acc-soft:#1a2b25;--arbg:#17150f;--warn:#e0a35c;--good:#6fcf95;--sel:#332e14;--shadow:none;
--b-req:#8fe0c3;--b-reqbg:#1b3a30;--b-sun:#9cc4f5;--b-sunbg:#1c2c44;--b-ok:#cfc6b0;--b-okbg:#2e2a22;--b-dis:#f5c070;--b-disbg:#43310f;--b-no:#ff9d92;--b-nobg:#472320;--b-dsp:#d9b0f2;--b-dspbg:#3a2748}}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:9.375rem}
html,body{margin:0;background:var(--bg);color:var(--ink);font:var(--t-base)/1.5 Inter,system-ui,-apple-system,sans-serif}
main{max-width:47.5rem;margin:0 auto;padding:calc(var(--s2) + env(safe-area-inset-top)) max(var(--s4),env(safe-area-inset-right)) calc(6rem + env(safe-area-inset-bottom)) max(var(--s4),env(safe-area-inset-left))}
body::before{content:'';position:fixed;top:0;left:0;right:0;height:env(safe-area-inset-top);background:var(--bg);z-index:26}
h1{font-size:var(--t-xl);line-height:1.2;margin:0 0 var(--s2);letter-spacing:-.01em}
h2{font-size:var(--t-lg);line-height:1.25;margin:0 0 var(--s2)}
h3{font-size:var(--t-md);margin:0 0 var(--s1)}
a{color:var(--acc)}
.skip{position:absolute;left:-999px}.skip:focus{left:var(--s4);top:var(--s2);z-index:60;background:var(--card);padding:var(--s2) var(--s3);border-radius:var(--r1)}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r3);padding:var(--s4);margin:0 0 var(--s3);box-shadow:var(--shadow)}
.muted{color:var(--mute);font-size:var(--t-sm)}.row{display:flex;gap:var(--s2);align-items:center;flex-wrap:wrap}.sp{flex:1;min-width:0}
button,select,input[type=search],input[type=text]{font:inherit;color:var(--ink);background:var(--card);border:1px solid var(--line2);border-radius:var(--r2);min-height:max(44px,2.75rem);padding:0 var(--s3)}
input[type=search]{width:100%;min-height:max(48px,3rem);font-size:var(--t-md)}
button{cursor:pointer;font-weight:600;font-size:var(--t-sm)}
button:active{background:var(--acc-soft)}
button.pri,button.on{background:var(--acc);color:var(--acc-ink);border-color:var(--acc)}
button.pri:active,button.on:active{filter:brightness(.92);background:var(--acc)}
button.sm{padding:0 var(--s3);font-size:var(--t-sm)}
button:disabled{opacity:.4;cursor:default}
:focus-visible{outline:3px solid var(--acc);outline-offset:2px}
.seg{display:inline-flex}.seg button{border-radius:0;margin-left:-1px}.seg button:first-child{border-radius:var(--r2) 0 0 var(--r2);margin:0}.seg button:last-child{border-radius:0 var(--r2) var(--r2) 0}
.seg button.on{position:relative;z-index:1}
/* bottom nav */
#nav{position:fixed;left:0;right:0;bottom:0;display:flex;background:var(--card);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom);z-index:30}
#nav a{flex:1;min-width:0;min-height:max(56px,3.5rem);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:.6875rem;color:var(--mute);text-decoration:none;font-weight:600;position:relative}
#nav a svg{width:1.375rem;height:1.375rem;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#nav a.act{color:var(--acc)}#nav a.act::before{content:'';position:absolute;top:0;left:30%;right:30%;height:3px;border-radius:0 0 3px 3px;background:var(--acc)}
/* Arabic: the star */
.ar,.ar-run{font-family:Amiri,"Amiri Quran","Noto Naskh Arabic","Geeza Pro","Scheherazade New",serif}
.ar{direction:rtl;text-align:right;unicode-bidi:plaintext;white-space:pre-line;font-size:calc(2.05rem*var(--ar-scale));line-height:2.45;padding:.2em 0;margin:0;overflow-wrap:anywhere}
.ar.sm{font-size:calc(1.6rem*var(--ar-scale));line-height:2.3}
.ar.q{font-size:calc(1.4rem*var(--ar-scale));line-height:2.2}
.ar-run{font-size:calc(1.18em*var(--ar-scale));line-height:1.1;unicode-bidi:isolate}
.arpanel{background:var(--arbg);border:1px solid var(--line);border-radius:var(--r3);padding:var(--s3) var(--s4) var(--s4);margin:var(--s3) 0}
.arpanel .top{display:flex;align-items:flex-start;gap:var(--s3)}.arpanel .top .ar{flex:1;min-width:0}
.tr{font-style:italic;color:var(--mute);margin:var(--s2) 0 0;font-size:.95rem;line-height:1.55;max-width:64ch}
.en{margin:var(--s1) 0 0;font-size:var(--t-base);line-height:1.6;max-width:64ch}
/* step head */
.rail{display:flex;gap:var(--s1);overflow-x:auto;padding:var(--s1) var(--s4) var(--s2);scrollbar-width:none;margin:0 calc(-1*var(--s4));scroll-snap-type:x proximity}.rail::-webkit-scrollbar{display:none}
.rail a{flex:0 0 auto;width:max(44px,2.75rem);min-height:max(60px,3.75rem);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:1px solid var(--line);border-radius:var(--r2);background:var(--card);color:var(--mute);text-decoration:none;font-size:.7rem;font-weight:700;scroll-snap-align:center}
.rail a svg{width:1.875rem;height:1.875rem}
.rail a.cur{background:var(--acc);color:var(--acc-ink);border-color:var(--acc)}
.rail .gap{flex:0 0 var(--s2)}
.rail a.topics{width:auto;padding:0 var(--s3);flex-direction:row;gap:0.375rem;font-size:var(--t-sm);color:var(--acc);border-style:dashed;border-color:var(--acc)}
.rail a.topics svg{width:1.25rem;height:1.25rem;stroke:currentColor;fill:none;stroke-width:1.8}
.glyph{width:1em;height:1em;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.glyph .f{fill:currentColor;stroke:none}.glyph .g{stroke-width:1.6;opacity:.4}
.hero{display:flex;gap:var(--s4);align-items:center;margin:var(--s3) 0}
.hero .fig{width:4.75rem;height:4.75rem;flex:none;border-radius:var(--r3);background:var(--acc-soft);color:var(--acc);display:flex;align-items:center;justify-content:center;border:1px solid var(--line)}
.hero .fig svg{width:3.875rem;height:3.875rem}
.hero .tt{flex:1;min-width:0}
.eyebrow{font-size:var(--t-xs);font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--acc);margin:0 0 var(--s1)}
.hero .ar{font-size:calc(1.7rem*var(--ar-scale));line-height:1.9;text-align:left;padding:0;margin-top:2px}
.hero .pose{color:var(--mute);font-size:var(--t-sm);margin:var(--s1) 0 0}
.phase{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center;margin:0 0 var(--s3)}
.phase .pill{display:inline-flex;align-items:center;gap:0.375rem;border:1px solid var(--line2);border-radius:62.4375rem;padding:4px 0.75rem;font-size:var(--t-sm);background:var(--card);color:var(--ink);font-weight:600}
.phase .pill b{color:var(--acc)}
.show{display:flex;gap:var(--s2);align-items:center;flex-wrap:wrap;margin:0 0 var(--s4)}
.show .muted{margin-right:var(--s1)}
/* sticky controls */
.stk{position:sticky;top:env(safe-area-inset-top);z-index:25;background:var(--bg);margin:0 calc(-1*var(--s4)) var(--s3);padding:var(--s1) var(--s4) var(--s2);border-bottom:1px solid var(--line);transition:transform .2s ease}
.stk.hide{transform:translateY(-120%)}
.mini{display:flex;align-items:center;gap:var(--s1);position:relative}
.mini .where{flex:1;min-width:0;min-height:max(44px,2.75rem);display:flex;align-items:center;justify-content:center;gap:var(--s2);background:transparent;border:0;font-size:var(--t-base);font-weight:700;padding:0 var(--s2)}
.mini .where span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mini .where .n{color:var(--acc);flex:none;overflow:visible}.mini .where .caret{color:var(--mute);flex:none;font-weight:400}
.mini .ic{width:max(44px,2.75rem);padding:0;flex:none;font-size:1.15rem;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;border:1px solid var(--line2);border-radius:var(--r2);background:var(--card);color:var(--ink)}
.mini .ic[aria-disabled=true]{opacity:.35;pointer-events:none}
.prog{position:absolute;left:0;right:0;bottom:-3px;height:3px;background:var(--line);border-radius:3px;overflow:hidden}.prog i{display:block;height:100%;background:var(--acc)}
.ctl{display:flex;gap:var(--s2);align-items:stretch;margin-top:var(--s3)}
.lab{font-size:.625rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--mute);display:block;line-height:1}
.schoolbtn{flex:0 0 auto;min-width:6rem;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:3px;padding:0 var(--s3);text-align:left}
.schoolbtn .v{font-size:var(--t-base);font-weight:700}
.schoolbtn .v::after{content:' ▾';color:var(--mute);font-weight:400}
.depth{flex:1;min-width:0;display:flex}.depth .seg{flex:1}.depth .seg button{flex:1;padding:0 2px;font-size:.78rem;line-height:1.1}
.depth .seg button b{display:block;font-size:.625rem;letter-spacing:.05em;opacity:.75;font-weight:700}
.chips{display:none;gap:0.375rem;flex-wrap:wrap;align-items:center}
.chips button{padding:0 var(--s3)}
.wide{display:none}
@media(min-width:640px){
 .schoolbtn{display:none}.wide{display:block}
 .ctl{flex-direction:column;gap:var(--s2)}
 .chips{display:flex}
 .ctl .lab{margin:0 0 4px}
 .depth{flex:none;display:block}.depth .seg{display:inline-flex}.depth .seg button{padding:0 var(--s4);font-size:var(--t-sm)}
 .depth .seg button b{display:inline;margin-right:0.375rem}
 .mini .where{justify-content:flex-start}
}
/* badges: colour + shape + text */
.bd{display:inline-flex;align-items:center;gap:4px;border-radius:var(--r1);padding:2px 0.5rem;font-size:var(--t-sm);font-weight:700;line-height:1.3;white-space:nowrap;border:1.5px solid currentColor}
.bd i{font-style:normal;font-size:.95em}
.bd.req{color:var(--b-req);background:var(--b-reqbg)}.bd.sun{color:var(--b-sun);background:var(--b-sunbg)}.bd.ok{color:var(--b-ok);background:var(--b-okbg)}
.bd.dis{color:var(--b-dis);background:var(--b-disbg)}.bd.no{color:var(--b-no);background:var(--b-nobg)}.bd.dsp{color:var(--b-dsp);background:var(--b-dspbg)}
.bd.none{color:var(--mute);background:transparent;border-style:dashed}
.bd.sm{padding:3px 5px;font-size:.7rem;white-space:normal;text-align:center;justify-content:center;flex-direction:column;gap:0;min-width:max(58px,3.625rem)}
/* sections */
.sect{margin:0 0 var(--s5)}
.sect>.sh,details.sect>summary{display:flex;gap:var(--s2);font-size:var(--t-lg);font-weight:700;margin:0 0 var(--s2);list-style:none;cursor:pointer;min-height:max(44px,2.75rem);align-items:center}
.sect>.sh{cursor:default}
details.sect>summary::-webkit-details-marker{display:none}
details.sect>summary::before{content:'▾';color:var(--mute);font-size:.9rem;width:1em}
details.sect:not([open])>summary::before{content:'▸'}
.ct{font-size:var(--t-sm);font-weight:600;color:var(--mute);margin-left:auto}
.sect .lead{margin:0 0 var(--s3);color:var(--mute);font-size:var(--t-sm);max-width:64ch}
.lvl{border-left:3px solid var(--acc);padding-left:var(--s3)}
.empty{border:1px dashed var(--line2);border-radius:var(--r2);padding:var(--s3) var(--s4);color:var(--mute);font-size:var(--t-sm)}
.tools{display:flex;gap:var(--s2);margin:0 0 var(--s2)}.tools button{color:var(--acc);background:transparent}
/* prose */
.md{max-width:66ch;font-size:var(--t-md);line-height:1.68}
.md p{margin:.55em 0}.md p:first-child{margin-top:0}.md p:last-child{margin-bottom:0}
.md ul,.md ol{padding-left:1.3em}.md li{margin:.25em 0}
.md blockquote{margin:.6em 0;padding:.1em var(--s3);border-left:3px solid var(--line2);color:var(--mute)}
.md table{border-collapse:collapse;display:block;overflow-x:auto;font-size:var(--t-sm)}.md th,.md td{border:1px solid var(--line);padding:4px 0.5rem}
.md.sm{font-size:var(--t-base);line-height:1.62}
/* rulings */
.rcard{padding:0;overflow:hidden}
.grid-hint{padding:var(--s2) var(--s3);font-size:var(--t-sm);color:var(--mute);border-top:1px solid var(--line)}
.grid-hint .sw{display:none;font-weight:700;color:var(--acc)}.gridwrap.more+.grid-hint .sw{display:inline}
.grid thead th .fn{display:none}
@media(min-width:640px){.grid thead th .fn{display:inline}.grid thead th .ab{display:none}}
.gridwrap{overflow-x:auto;-webkit-overflow-scrolling:touch;background:
 linear-gradient(to left,var(--card) 30%,transparent) 100% 0/28px 100% no-repeat local,
 radial-gradient(farthest-side at 100% 50%,rgba(0,0,0,.2),transparent) 100% 0/10px 100% no-repeat scroll}
table.grid{border-collapse:separate;border-spacing:0;width:100%;font-size:var(--t-sm)}
.grid th,.grid td{padding:var(--s2) 4px;border-bottom:1px solid var(--line);vertical-align:middle;text-align:center}
.grid tr:last-child th,.grid tr:last-child td{border-bottom:0}
.grid thead th{font-size:var(--t-xs);color:var(--mute);font-weight:700;background:var(--card)}
.grid thead th abbr{text-decoration:none;border-bottom:1px dotted var(--mute);cursor:help}
.grid .el{position:sticky;left:0;background:var(--card);text-align:left;min-width:7.25rem;max-width:8.75rem;z-index:2;border-right:1px solid var(--line);padding-left:var(--s3)}
.grid td{min-width:4.25rem}
.grid td button.cell{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;justify-content:center;min-width:4rem;min-height:max(44px,2.75rem);border-radius:var(--r1);width:100%}
.grid td button.cell:focus-visible,.grid .elb:focus-visible,.flag:focus-visible{outline:3px solid var(--acc)}
.grid .elb{all:unset;box-sizing:border-box;cursor:pointer;min-height:max(44px,2.75rem);font-weight:600;line-height:1.25;padding:var(--s1) 0;display:flex;align-items:center;flex:1;min-width:0;font-size:var(--t-sm)}
.grid .elb:focus-visible{outline:3px solid var(--acc)}
.grid .none{color:var(--mute)}
.flag{all:unset;box-sizing:border-box;cursor:pointer;color:var(--b-dsp);font-size:1.15rem;min-width:max(44px,2.75rem);min-height:max(44px,2.75rem);display:inline-flex;align-items:center;justify-content:center;flex:none}
.srow{padding:var(--s3) 0;border-bottom:1px solid var(--line)}.srow:last-child{border:0}
.srow .h{display:flex;gap:var(--s2);align-items:center;flex-wrap:wrap;margin-bottom:var(--s1)}.srow .h b{flex:1;min-width:8ch}
.srow .md{font-size:var(--t-base)}
.rcard .in{padding:var(--s4)}
/* variants */
.vc{border:1px solid var(--line);border-radius:var(--r3);padding:var(--s4);margin:0 0 var(--s3);background:var(--card)}
.vc.pref{border:2px solid var(--acc);background:var(--acc-soft)}
.vc .vh{display:flex;gap:var(--s2);align-items:center;flex-wrap:wrap;margin-bottom:var(--s2)}.vc .vh h3{flex:1;min-width:12ch;margin:0}
.vc .prefs{display:flex;flex-wrap:wrap;gap:0.375rem;align-items:center;margin:0 0 var(--s2)}
.pc{display:inline-block;border:1px solid var(--acc);color:var(--acc);border-radius:62.4375rem;padding:2px 0.625rem;font-size:var(--t-xs);font-weight:700}
.pc.me{background:var(--acc);color:var(--acc-ink)}
.vc .arbox{background:var(--arbg);border-radius:var(--r2);padding:var(--s1) var(--s3);margin:var(--s2) 0}
.vc.pref .arbox{background:var(--card)}
details.more{margin-top:var(--s2);border-top:1px solid var(--line);padding-top:var(--s1)}
details.more>summary{cursor:pointer;min-height:max(44px,2.75rem);display:flex;align-items:center;gap:var(--s2);list-style:none;color:var(--mute);font-size:var(--t-sm)}
details.more>summary::-webkit-details-marker{display:none}
details.more>summary::before{content:'▸';flex:none;width:1em}details.more[open]>summary::before{content:'▾'}
details.more>summary b{color:var(--ink);flex:none}
details.more>summary span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
details.more[open]>summary span{display:none}
/* audio */
.audio{display:flex;align-items:center;gap:var(--s2);flex-wrap:wrap}
.play{display:inline-flex;align-items:center;justify-content:center;gap:0.375rem;min-width:max(44px,2.75rem);padding:0 var(--s3);border-radius:62.4375rem;color:var(--acc);border-color:var(--acc);background:var(--card);white-space:nowrap}
.play .pi{font-size:.8rem;line-height:1}
.play.on{background:var(--acc);color:var(--acc-ink)}
.play.on .pi{animation:pulse 1.2s ease-in-out infinite}
@keyframes pulse{50%{opacity:.45}}
.aw{font-size:var(--t-xs);color:var(--mute);min-width:0;flex:1 1 14ch}
.arpanel .audio{margin-top:var(--s1)}
/* evidence & inner notes */
details.note{border:1px solid var(--line);border-radius:var(--r2);background:var(--card);margin:0 0 var(--s2)}
details.note>summary{cursor:pointer;list-style:none;display:flex;gap:var(--s2);align-items:flex-start;padding:var(--s3);min-height:max(48px,3rem);font-size:var(--t-base);line-height:1.4}
details.note>summary::-webkit-details-marker{display:none}
details.note>summary::before{content:'▸';color:var(--mute);flex:none;width:1em;margin-top:.1em}
details.note[open]>summary::before{content:'▾'}
details.note>summary .nt{font-weight:600;flex:1;min-width:0}
details.note>summary .nt small{display:block;font-weight:400;color:var(--mute);font-size:var(--t-sm);margin-top:2px}
details.note>.nb{padding:0 var(--s3) var(--s3) calc(var(--s3) + 1em + var(--s2))}
details.note[open]{border-color:var(--line2)}
details.au{margin:0 0 var(--s3)}
details.au>summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:var(--s2);min-height:max(48px,3rem);font-weight:700;font-size:var(--t-md);padding:var(--s1) 0;border-bottom:2px solid var(--acc-soft);margin-bottom:var(--s2)}
details.au>summary::-webkit-details-marker{display:none}
details.au>summary::before{content:'▾';color:var(--mute);font-size:.9rem;width:1em}
details.au:not([open])>summary::before{content:'▸'}
.qline{font-size:var(--t-sm);color:var(--mute);margin:var(--s1) 0 var(--s2)}
.fl{color:var(--b-dsp);font-weight:700}
/* source chips */
.src{display:flex;gap:0.375rem;flex-wrap:wrap;margin-top:var(--s3)}
.sc{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;min-height:2rem;padding:0 0.625rem;border-radius:62.4375rem;border:1px solid var(--line2);font-size:var(--t-xs);font-weight:700;color:var(--ink);background:var(--bg);position:relative}
.sc::after{content:'';position:absolute;inset:-6px -2px}
.sc.o{border-color:var(--good);color:var(--good)}.sc.u{border-style:dashed}.sc.x{border-color:var(--warn);color:var(--warn)}
.sc:focus-visible{outline:3px solid var(--acc)}
/* deeper hint, related, nav */
.deeper{display:flex;gap:var(--s2);flex-wrap:wrap;align-items:center;border:1px dashed var(--line2);border-radius:var(--r2);padding:var(--s2) var(--s3);margin:0 0 var(--s4);font-size:var(--t-sm);color:var(--mute)}
.deeper button{color:var(--acc)}
.related{margin:var(--s5) 0 var(--s3)}
.related h2{font-size:var(--t-md)}
.rl{display:flex;gap:var(--s2);flex-wrap:wrap}
.rl a{display:inline-flex;align-items:center;gap:0.375rem;min-height:max(44px,2.75rem);padding:0 var(--s3);border:1px solid var(--line2);border-radius:var(--r2);background:var(--card);color:var(--ink);text-decoration:none;font-weight:600;font-size:var(--t-sm)}
.nav2{display:flex;gap:var(--s3);margin:var(--s5) 0 var(--s3)}
.nav2 button{flex:1;min-height:max(60px,3.75rem);display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:var(--s2) var(--s4);text-align:left;gap:2px;min-width:0}
.nav2 button.next{align-items:flex-end;text-align:right}
.nav2 button small{font-size:var(--t-xs);font-weight:600;opacity:.85}
.nav2 button span{font-size:var(--t-sm);font-weight:700;line-height:1.25;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.sample{background:var(--sel);border:1px dashed var(--warn);border-radius:var(--r2);padding:var(--s2) var(--s3);font-size:var(--t-sm);margin:0 0 var(--s3)}
/* topics, lists, headers */
.tcard{display:block;text-decoration:none;color:var(--ink)}
.tcard:hover,.tcard:focus-visible{border-color:var(--acc)}
.tcard .tt{display:flex;gap:var(--s3);align-items:baseline;flex-wrap:wrap;margin-bottom:var(--s1)}.tcard .tt b{font-size:var(--t-md)}
.tcard p{margin:var(--s1) 0 0;color:var(--mute);font-size:var(--t-sm);max-width:64ch}
.tcard .where2{margin-top:var(--s2);font-size:var(--t-xs);font-weight:700;color:var(--acc)}
.hd{display:flex;align-items:center;gap:var(--s2);margin:0 0 var(--s3)}.hd h1{margin:0;flex:1}
.hd button{min-width:max(44px,2.75rem)}
.steplist a{display:flex;align-items:center;gap:var(--s3);min-height:max(48px,3rem);padding:var(--s1) var(--s2);border-radius:var(--r2);text-decoration:none;color:var(--ink)}
.steplist a svg{width:1.875rem;height:1.875rem;color:var(--mute);flex:none}
.steplist a.cur{background:var(--acc-soft);font-weight:700}.steplist a.cur svg{color:var(--acc)}
.steplist .n{width:1.6em;color:var(--mute);font-variant-numeric:tabular-nums;flex:none;text-align:right}
.steplist .ph{font-size:var(--t-xs);font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--acc);margin:var(--s3) 0 var(--s1) var(--s2)}
.opt{display:flex;width:100%;align-items:flex-start;gap:var(--s3);text-align:left;margin:0 0 var(--s2);padding:var(--s3);min-height:max(56px,3.5rem)}
.opt .tick{width:1.4em;flex:none;color:var(--acc);font-weight:700}
.opt small{display:block;font-weight:400;color:var(--mute);font-size:var(--t-sm);margin-top:2px}
.opt.on small,.opt.on .tick{color:var(--acc-ink)}
.lg{display:grid;grid-template-columns:minmax(0,auto) 1fr;gap:var(--s2) var(--s3);align-items:start;margin:0}
.lg .bd{justify-self:start}.lg dd{margin:0;font-size:var(--t-sm);padding-top:2px}.lg dt{margin:0}
.lgh{font-size:var(--t-xs);font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);margin:var(--s4) 0 var(--s2)}
.lgh:first-child{margin-top:0}
/* sheet, toast */
#pop{position:fixed;inset:0;z-index:40;background:rgba(10,8,4,.5);display:flex;align-items:flex-end;justify-content:center}
#pop[hidden]{display:none}
#pop .sheet{background:var(--card);color:var(--ink);width:min(45rem,100%);max-height:86vh;max-height:86dvh;overflow:auto;border-radius:1.25rem 1.25rem 0 0;padding:var(--s4) var(--s4) calc(var(--s5) + env(safe-area-inset-bottom));border:1px solid var(--line);overscroll-behavior:contain}
#pop .sheet .top{display:flex;align-items:center;gap:var(--s2);margin-bottom:var(--s3);position:sticky;top:calc(-1*var(--s4));margin-top:calc(-1*var(--s4));padding-top:var(--s4);background:var(--card);z-index:1}#pop .sheet .top h2{flex:1;margin:0;font-size:var(--t-lg)}
@media(min-width:760px){#pop{align-items:center}#pop .sheet{border-radius:1.25rem;max-height:80vh}}
#toast{position:fixed;left:50%;bottom:calc(4.75rem + env(safe-area-inset-bottom));transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:0.625rem 1rem;border-radius:var(--r2);z-index:50;max-width:90%;font-size:var(--t-sm)}
#toast[hidden]{display:none}
.srcitem{padding:var(--s3) 0;border-bottom:1px solid var(--line)}.srcitem:last-child{border:0}.srcitem .h{display:flex;gap:var(--s2);align-items:center;flex-wrap:wrap;margin-bottom:var(--s1)}
.srcitem .t{overflow-wrap:anywhere}
details.refstep{padding:0 var(--s4)}
details.refstep>summary{cursor:pointer;min-height:max(56px,3.5rem);display:flex;align-items:center;gap:var(--s3);font-weight:700;list-style:none;padding:var(--s2) 0}
details.refstep>summary::-webkit-details-marker{display:none}
details.refstep>summary::before{content:'▸';color:var(--mute)}details.refstep[open]>summary::before{content:'▾'}
details.refstep summary svg{width:1.875rem;height:1.875rem;flex:none;color:var(--acc)}
details.refstep summary .st{flex:1;min-width:0}
details.refstep summary .st small{display:block;font-weight:400;color:var(--mute);font-size:var(--t-sm);line-height:1.4;margin-top:2px}
mark{background:var(--sel);color:inherit;border-radius:3px;padding:0 1px}
details.refstep .b{padding-bottom:var(--s3)}
.tag{font-size:.625rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;border:1px solid var(--line2);border-radius:62.4375rem;padding:1px 0.4375rem;color:var(--mute);margin-left:0.375rem;vertical-align:middle}
/* welcome */
#welcome{position:fixed;inset:0;z-index:70;background:var(--bg);display:flex;flex-direction:column;overflow:auto;padding:calc(var(--s2) + env(safe-area-inset-top)) var(--s4) calc(var(--s4) + env(safe-area-inset-bottom))}
#welcome[hidden]{display:none}
#welcome .in{width:min(35rem,100%);margin:0 auto;flex:1;display:flex;flex-direction:column}
#welcome .skipb{align-self:flex-end;color:var(--mute);background:transparent;border:0}
#welcome .pane{flex:1;padding:var(--s2) 0 var(--s4)}
#welcome h1{font-size:var(--t-xl);margin:var(--s3) 0}
#welcome p{font-size:var(--t-md);line-height:1.6;margin:0 0 var(--s3)}
#welcome .strip{display:flex;gap:0.375rem;justify-content:center;flex-wrap:wrap;color:var(--acc);margin:var(--s3) 0 var(--s4)}
#welcome .strip div{width:max(52px,3.25rem);height:4rem;border:1px solid var(--line);border-radius:var(--r2);background:var(--card);display:flex;align-items:center;justify-content:center}
#welcome .strip svg{width:2.375rem;height:2.375rem}
#welcome .foot{display:flex;align-items:center;gap:var(--s3);padding-top:var(--s3)}
#welcome .dots{display:flex;gap:0.5rem;flex:1}#welcome .dots i{width:0.5625rem;height:0.5625rem;border-radius:50%;background:var(--line2)}#welcome .dots i.on{background:var(--acc);width:1.5rem;border-radius:5px}
#welcome .foot button{min-width:6rem}
#welcome .depths{display:grid;gap:var(--s2);margin-bottom:var(--s4)}
#welcome .depths button{text-align:left;display:block;width:100%;padding:var(--s2) var(--s3)}
#welcome .depths small{display:block;font-weight:400;opacity:.9;font-size:var(--t-sm)}
#welcome .chips{display:flex}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
@media(forced-colors:active){.bd,.sc,.pc,.cite{border:1.5px solid CanvasText}}
@media print{#nav,.stk,.rail,.nav2,#toast,#welcome{display:none!important}}

.own{display:inline-block;font-size:.625rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--mute);border:1px dotted var(--mute);border-radius:62.4375rem;padding:1px 0.4375rem;vertical-align:middle;cursor:help}
.vc.flash{animation:fl 2.4s ease-out}@keyframes fl{0%{box-shadow:0 0 0 4px var(--acc)}100%{box-shadow:0 0 0 0 transparent}}
.ph2{font-size:var(--t-md);margin:var(--s5) 0 var(--s2);display:flex;flex-direction:column;gap:2px}.ph2 small{font-weight:400;color:var(--mute);font-size:var(--t-sm)}
.shp{display:flex;align-items:center;gap:var(--s3);padding:var(--s3);margin:0 0 var(--s2);background:var(--card);border:1px solid var(--line);border-radius:var(--r2);text-decoration:none;color:var(--ink);min-height:4rem}
.shp:hover,.shp:focus-visible{border-color:var(--acc)}
.shp .fig{width:max(44px,2.75rem);height:max(44px,2.75rem);flex:none;color:var(--acc);display:flex;align-items:center;justify-content:center}.shp .fig svg{width:2.5rem;height:2.5rem}
.shp .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.shp .t1{display:flex;gap:var(--s2);align-items:baseline}.shp .n{color:var(--acc);font-weight:700;min-width:1.4em}.shp b{line-height:1.3}
.shp .meta{display:flex;gap:var(--s2);flex-wrap:wrap;align-items:center}.shp .bd{font-size:var(--t-xs)}
.shp .vt,.shp .said{font-size:var(--t-sm);color:var(--mute)}.shp .said .ar-run{color:var(--ink)}
.shp .go{color:var(--mute);font-size:1.4rem}
.lab2{display:flex;align-items:center;gap:var(--s2);font-size:var(--t-sm);font-weight:600}
.rl2{display:inline-flex;align-items:center;min-height:max(44px,2.75rem);padding:0 var(--s3);border:1px solid var(--line2);border-radius:var(--r2);background:var(--card);color:var(--ink);text-decoration:none;font-weight:600;font-size:var(--t-sm)}
.ar-run{line-height:1.6}
.shp .tx>.ar-run{align-self:flex-start;font-size:1.25rem;line-height:1.7}
.shp .said .ar-run{display:inline-block;line-height:1.9;font-size:1.15rem}
.mini .ic{min-height:max(44px,2.75rem)}

/* ---- citations: author + short title + locator, ID small ---- */
.srch{font-size:var(--t-xs);font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);margin:var(--s3) 0 var(--s1)}
.cites{display:flex;flex-direction:column;gap:var(--s1);margin:var(--s1) 0 0;min-width:0}
.cite{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:flex-start;gap:var(--s2);min-height:var(--tap);padding:var(--s1) var(--s3);border:1px solid var(--line2);border-left-width:4px;border-radius:var(--r2);background:var(--bg);color:var(--ink);min-width:0;max-width:100%}
.cite.o{border-left-color:var(--good)}.cite.u{border-left-color:var(--line2);border-style:dashed;border-left-width:4px}.cite.x{border-color:var(--warn)}
.cite:focus-visible{outline:3px solid var(--acc);outline-offset:2px}
.cite:active{background:var(--acc-soft)}
.cite .ck{flex:none;width:1.1em;font-weight:700;line-height:1.5;color:var(--mute)}.cite.o .ck{color:var(--good)}
.cite .cb{display:flex;flex-direction:column;min-width:0;flex:1}
.cite .cn{font-size:var(--t-sm);font-weight:600;line-height:1.35;overflow-wrap:anywhere}
.cite .cloc{font-weight:500;color:var(--mute)}
.cite .cm{font-size:.6875rem;line-height:1.4;color:var(--mute);display:flex;flex-wrap:wrap;gap:0 var(--s2);align-items:center}
.cid{font-variant-numeric:tabular-nums;letter-spacing:.02em;font-weight:700;font-size:.6875rem;color:var(--mute)}.cid.big{font-size:var(--t-sm);border:1px solid var(--line2);border-radius:var(--r1);padding:2px 8px;color:var(--ink)}
.ctag{display:inline-block;font-size:.625rem;font-weight:700;letter-spacing:.05em;color:var(--warn);border:1px solid var(--warn);border-radius:999px;padding:0 6px;line-height:1.5}
details.cites-d>summary{min-height:var(--tap)}
.byline{display:flex;flex-wrap:wrap;gap:0 var(--s2);align-items:baseline;font-size:var(--t-sm);margin:0 0 var(--s2);padding-bottom:var(--s1);border-bottom:1px solid var(--line)}
.byline b{font-size:var(--t-base)}.byline span{color:var(--mute)}
details.note>summary .nt small.wk{font-style:normal}
figure.qt{margin:var(--s2) 0;padding:0}
figure.qt figcaption{margin:0;padding:0 0 0 var(--s2);border-left:3px solid var(--acc-soft)}
figure.qt figcaption .srch{margin-top:var(--s1)}
figure.qt .ar.q{border-right:3px solid var(--acc);padding-right:var(--s3)}
.basis{font-size:var(--t-sm);color:var(--mute);margin:var(--s1) 0;line-height:1.4}.basis b{color:var(--ink);font-size:var(--t-xs);letter-spacing:.05em;text-transform:uppercase;margin-right:var(--s1)}
.aq{display:inline;padding:0 var(--s1);background:var(--arbg);border-radius:var(--r1);direction:rtl;unicode-bidi:isolate}
.aq.blk{display:block;margin:var(--s2) 0;padding:var(--s1) var(--s3);border-right:3px solid var(--acc);text-align:right}
.aq .ar-run{font-size:calc(1.3em*var(--ar-scale));line-height:2}
.fullref,.urlline{overflow-wrap:anywhere}.urlline{font-size:var(--t-xs)}
.srcnote{border:1px dashed var(--warn);border-radius:var(--r2);padding:var(--s1) var(--s3);margin-top:var(--s3);font-size:var(--t-sm)}.srcnote p{margin:var(--s2) 0}
.schnote{border-left:3px solid var(--acc);padding:var(--s1) var(--s3);margin:var(--s3) 0 0;font-size:var(--t-sm)}
.howsrc p{font-size:var(--t-sm);margin:0 0 var(--s3)}
.howsrc .cite{display:inline-flex}
a.rl2{color:var(--acc)}
.srcitem .h .cite{max-width:100%}
/* ---- text size sheet ---- */
.szrow{margin:0 0 var(--s4)}.szl{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:var(--s2)}.szl output{color:var(--mute);font-variant-numeric:tabular-nums}
.stepper{display:flex;align-items:center;gap:var(--s3)}
.stepper button{min-width:var(--tap);min-height:var(--tap);padding:0;font-size:1.1rem;display:inline-flex;align-items:baseline;justify-content:center;line-height:var(--tap)}
.stepper button small{font-size:.7em}.stepper button big{font-size:1.25em}
.stepper .dots{flex:1;display:flex;justify-content:space-between;align-items:center;padding:0 var(--s2)}
.stepper .dots i{width:.6rem;height:.6rem;border-radius:50%;background:var(--line2)}.stepper .dots i.lo{background:var(--acc);opacity:.45}.stepper .dots i.on{background:var(--acc);width:1.1rem;height:1.1rem}
.szprev{margin:var(--s3) 0}
.mini .ic.aa{font-weight:700;font-family:Georgia,serif;font-size:1.1rem}.mini .ic.aa small{font-size:.75em}
/* ---- small phones and landscape ---- */
@media(max-width:379px){
 .mini .ic.q{display:none}
 .mini{gap:2px}
 .hero{gap:var(--s3)}.hero .fig{width:4rem;height:4rem}.hero .fig svg{width:3.2rem;height:3.2rem}
 .nav2{gap:var(--s2)}.nav2 button{padding:var(--s2) var(--s3)}
 .card{padding:var(--s3)}
 .vc{padding:var(--s3)}
 .depth .seg button{font-size:.72rem}
 .schoolbtn{min-width:5rem}
}
@media(max-height:520px) and (orientation:landscape){
 .stk{position:static}
 .stk.hide{transform:none}
 main{padding-bottom:calc(4rem + env(safe-area-inset-bottom))}
 #nav a{min-height:var(--tap);flex-direction:row;gap:6px;font-size:.75rem}
 #nav a svg{width:1.25rem;height:1.25rem}
 .rail a{min-height:3rem}
 #pop .sheet{max-height:94vh;max-height:94dvh;border-radius:var(--r3) var(--r3) 0 0}
 #toast{bottom:calc(60px + env(safe-area-inset-bottom))}
 .hero{margin:var(--s2) 0}
}
@media(max-height:520px) and (orientation:landscape) and (min-width:700px){.ctl{flex-direction:row;flex-wrap:wrap}.ctl .depth{display:flex}}
main,.card,.vc,.md,details.note,.nb{min-width:0}
.md,.nb,.vc .vh,.srow .h,.tcard p{overflow-wrap:anywhere}
img,svg{max-width:100%}

code{overflow-wrap:anywhere;white-space:pre-wrap}
.seg.wrap{display:flex;flex-wrap:wrap;gap:var(--s1)}.seg.wrap button{border-radius:var(--r2)!important;margin:0!important;min-width:var(--tap)}
.shp .bd{white-space:normal}.shp .meta,.shp .t1{min-width:0}.shp .meta>*{min-width:0;max-width:100%}.shp .t1 b{overflow-wrap:anywhere}
.depth .seg button{min-width:0;overflow:hidden;text-overflow:ellipsis}
.big .ctl{flex-wrap:wrap}.big .schoolbtn{flex:1 1 7rem}.big .depth{flex:1 1 100%}
@media(max-height:700px){.big .stk{position:static}}
.hd{flex-wrap:wrap}.hd h1{min-width:0;overflow-wrap:anywhere}
details.refstep>summary{flex-wrap:wrap;row-gap:0}
details.refstep>summary .st{flex:1 1 10rem}
.sect>.sh{flex-wrap:wrap;row-gap:0}.sect>.sh,details.au>summary{overflow-wrap:anywhere}details.au>summary{flex-wrap:wrap}
#nav a{font-size:min(.6875rem,3.5vw);overflow:hidden;padding:0 2px}#nav a svg{width:min(1.375rem,6vw);height:min(1.375rem,6vw)}
.hero{flex-wrap:wrap}.hero .tt{flex:1 1 11rem}h1,h2,h3{overflow-wrap:anywhere}

/* ===== design-review pass (31 Oct 2026) ===== */
:root{--navh:calc(max(56px,3.5rem) + env(safe-area-inset-bottom))}
#banner{display:flex;gap:var(--s2);align-items:center;flex-wrap:wrap;padding:var(--s2) max(var(--s4),env(safe-area-inset-left));background:var(--acc-soft);border-bottom:1px solid var(--line);font-size:var(--t-sm)}
#banner[hidden]{display:none}#banner span{flex:1 1 14rem}#banner .x{min-width:var(--tap)}
.skel i{display:block;height:1rem;border-radius:var(--r1);background:var(--line);margin:var(--s3) 0;animation:pulse 1s ease-in-out infinite alternate}
@keyframes pulse{from{opacity:.4}to{opacity:.9}}
.figslot{display:inline-flex;align-items:center;justify-content:center;flex:none;color:inherit}
.figslot svg{width:1.5em;height:1.5em}
.rl a .figslot svg{width:1.5rem;height:1.5rem}
/* toggles are check chips, never primary buttons */
button.tog{background:var(--card);color:var(--ink);border-color:var(--line2)}
button.tog.on{background:var(--acc-soft);color:var(--acc);border-color:var(--acc)}
button.tog.on::before{content:'✓ '}
/* hero: one row, no box */
.hero{gap:var(--s3);margin:var(--s2) 0 var(--s3);flex-wrap:nowrap}
.hero .fig{width:auto;height:auto;border:0;background:none;border-radius:0;padding:0}
.hero .fig svg{width:3.25rem;height:3.25rem}
.hero .tt{flex:1 1 0}
.hero h1{margin:0}
.hero .pose{margin:var(--s1) 0 0}
.hero .voice{margin:var(--s1) 0 0;font-size:var(--t-sm)}
button.varies{min-height:var(--tap);padding:0 var(--s2);font-size:var(--t-xs);color:var(--b-dsp);border-color:var(--b-dsp);background:var(--b-dspbg)}
@media(max-width:379px){.hero .fig svg{width:2.75rem;height:2.75rem}.mini .ic.q{display:inline-flex}}
/* in-page index */
.secnav{display:flex;gap:var(--s1);overflow-x:auto;scrollbar-width:none;margin-top:var(--s2)}.secnav::-webkit-scrollbar{display:none}
.secnav button{flex:none;min-height:var(--tap);font-size:var(--t-sm)}
.secnav button.on{background:var(--acc-soft);color:var(--acc);border-color:var(--acc)}
/* docked previous / next above the tab bar */
.dock{position:fixed;left:0;right:0;bottom:var(--navh);max-width:47.5rem;margin:0 auto;z-index:29;display:flex;align-items:stretch;background:var(--card);border:1px solid var(--line);border-bottom:0;border-radius:var(--r2) var(--r2) 0 0;height:max(52px,3.25rem);transition:transform .2s ease}
.dock.hide{transform:translateY(120%)}
.dock .dk{display:flex;align-items:center;gap:var(--s1);min-width:0;color:var(--ink);text-decoration:none;border:0;background:transparent;border-radius:0;font-size:var(--t-sm);font-weight:600;padding:0 var(--s3);min-height:0}
.dock .prev,.dock .next{flex:1 1 0}.dock .next{justify-content:flex-end;text-align:right}
.dock .dt{min-width:0;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:.78rem;line-height:1.2}
.dock .arr{font-size:1.5rem;color:var(--acc);flex:none}
.dock .mid{flex:none;min-width:5rem;justify-content:center;border-left:1px solid var(--line);border-right:1px solid var(--line);color:var(--acc);font-weight:800}
.dock [aria-disabled=true]{opacity:.35;pointer-events:none}
.dockpad{height:3.5rem}
@media print{.dock{display:none!important}}
/* rulings: table from 600px, one card per row below */
.rcards{display:none}
@media(max-width:599px){.rcard{display:none}.rcards{display:block;margin:0 0 var(--s3)}}
.rc{background:var(--card);border:1px solid var(--line);border-radius:var(--r2);padding:var(--s2) var(--s3);margin:0 0 var(--s2)}
.rch{display:flex;align-items:center;gap:var(--s1);flex-wrap:wrap}
.rch .elb{all:unset;box-sizing:border-box;cursor:pointer;flex:1;min-width:0;min-height:var(--tap);display:flex;align-items:center;font-weight:700;font-size:var(--t-sm);line-height:1.25}
.rch .elb:focus-visible{outline:3px solid var(--acc)}
.rcg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s1)}
.rcell{box-sizing:border-box;display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-height:var(--tap);padding:var(--s1) var(--s2);border:1px solid var(--line);border-radius:var(--r1);background:transparent;text-align:left;font-weight:400;min-width:0}
span.rcell.none{color:var(--mute)}
.rcell .sa{font-size:var(--t-xs);color:var(--mute);font-weight:700}
.rcell .bd{white-space:normal;font-size:.72rem;max-width:100%}
.neq{display:inline-flex;color:var(--b-dsp);font-weight:800;margin-right:.35em}
.grid thead th .fn{display:inline}
.grid thead th abbr{text-decoration:none;border-bottom:0;cursor:default}
.grid .elb{text-align:left}
.seepur{font-size:var(--t-xs);font-weight:700;white-space:nowrap;margin-left:var(--s2)}
button.moreRows{margin:0 0 var(--s3)}
/* Basic */
.kindlab{margin:0 0 var(--s1);font-size:var(--t-xs);font-weight:800;letter-spacing:.07em;text-transform:uppercase}
.kindlab.say{color:var(--acc)}.kindlab.text{color:var(--mute)}.kindlab small{display:block;text-transform:none;letter-spacing:0;font-weight:400}
.arpanel.isText{background:transparent;border-style:dashed}
.schoolbox{border-color:var(--acc)}.schoolbox h3{margin:0 0 var(--s2);color:var(--acc)}
.sbrow{display:flex;gap:var(--s3);align-items:flex-start}.sbtx{flex:1;min-width:0}
.sbfig{flex:none;display:flex;flex-direction:column;align-items:center;width:4.5rem;color:var(--acc);text-align:center}.sbfig svg{width:3.5rem;height:3.5rem}.sbfig small{font-size:var(--t-xs);color:var(--mute)}
h3.across{margin:0 0 var(--s2);font-size:var(--t-sm);color:var(--mute);text-transform:uppercase;letter-spacing:.06em}
.basedon{margin:var(--s2) 0 0;font-size:var(--t-sm);color:var(--mute)}
.purlink,.aftercard,.contcard{display:block;text-decoration:none;color:var(--ink);border-color:var(--acc)}
.purlink b,.aftercard b,.contcard b{display:block;color:var(--acc)}.purlink span,.aftercard small,.contcard small{color:var(--mute);font-size:var(--t-sm)}
.vshare{margin:var(--s2) 0 0}
button.term{all:unset;cursor:pointer;border-bottom:1px dotted var(--acc);color:inherit}
button.term:focus-visible{outline:3px solid var(--acc);outline-offset:2px}
mark,mark.hit{background:var(--sel);color:inherit;border-radius:2px;outline:1px solid var(--acc)}
.flag{font-size:1.25rem;border:1px solid var(--line2);border-radius:var(--r1);margin-left:var(--s1)}
.cid,.grid-hint{font-size:.8125rem}
@media(prefers-contrast:more){.cid,.grid-hint,.muted{color:var(--ink)}}
/* index rows */
.said-l{font-size:var(--t-xs);font-weight:800;text-transform:uppercase;color:var(--acc);margin-right:var(--s2)}
.ph3{font-size:var(--t-base);margin:var(--s4) 0 var(--s2)}.ph3 small{display:block;font-weight:400;color:var(--mute);font-size:var(--t-sm)}
.ph3.stp{display:flex;align-items:center;gap:var(--s2);margin:var(--s4) 0 var(--s1);color:var(--acc)}
.vlink{display:block;color:inherit;text-decoration:none;min-height:var(--tap);padding:var(--s2) 0}
.limbstrip{display:flex;gap:var(--s2);flex-wrap:wrap;color:var(--acc);margin:var(--s2) 0}.limbstrip svg{width:2rem;height:2rem}
.purcard .ct{font-size:var(--t-sm);color:var(--mute);font-weight:400;margin-left:var(--s2)}
.tcard{padding:var(--s4)}.tcard .tl{display:block;text-decoration:none;color:var(--ink)}
.where2 a{display:inline-flex;align-items:center;min-height:var(--tap);padding:0 var(--s1)}
/* search results */
.rescard{display:block;text-decoration:none;color:var(--ink);text-align:left;width:100%;font-weight:400;min-height:0;padding:var(--s3) var(--s4)}
.rescard:hover,.rescard:focus-visible{border-color:var(--acc)}
.rt{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:baseline}.rt b{font-weight:700}
.snip{margin:var(--s1) 0 0;color:var(--mute);font-size:var(--t-sm);display:block}
.searchlinks{margin-top:var(--s5)}
/* sources */
.srcgrp>summary{display:flex;justify-content:space-between;align-items:center;min-height:var(--tap);cursor:pointer}
.srcgrp .ct{color:var(--mute);font-weight:400}
.citedin a{font-size:var(--t-sm)}
.gl h2{font-size:var(--t-md)}
/* posture by school */
.vstrip{display:grid;grid-template-columns:repeat(auto-fill,minmax(8.5rem,1fr));gap:var(--s2)}
.vs{display:flex;flex-direction:column;align-items:center;gap:2px;padding:var(--s2);height:auto;text-align:center;font-weight:400;color:var(--acc)}
.vs b{color:var(--ink)}.vs small{color:var(--mute);font-size:var(--t-xs)}.vs .vfig svg{width:3rem;height:3rem}
/* welcome */
#welcome .strip{align-items:flex-start;flex-wrap:nowrap}
#welcome .strip figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:2px;width:max(46px,2.9rem)}
#welcome .strip figure .figslot{width:100%;height:3.4rem;border:1px solid var(--line);border-radius:var(--r2);background:var(--card)}
#welcome .strip figcaption{font-size:.7rem;color:var(--mute);text-align:center}
.notfatwa{border-left:3px solid var(--warn);padding-left:var(--s3)}
/* swipe between steps */
@keyframes slideL{from{transform:translateX(28px);opacity:.3}to{transform:none;opacity:1}}
@keyframes slideR{from{transform:translateX(-28px);opacity:.3}to{transform:none;opacity:1}}
#view.slide-l{animation:slideL .12s ease-out}#view.slide-r{animation:slideR .12s ease-out}
/* wide screens: tab bar becomes a left rail */
@media(min-width:1024px){
 :root{--navh:0px}
 #nav{top:0;bottom:0;right:auto;width:5.5rem;flex-direction:column;justify-content:flex-start;padding-top:var(--s5);border-top:0;border-right:1px solid var(--line)}
 #nav a{flex:none;width:100%;min-height:4.5rem}
 #nav a.act::before{top:20%;bottom:20%;left:0;right:auto;width:3px;height:auto;border-radius:0 3px 3px 0}
 .dock{border-bottom:1px solid var(--line);bottom:var(--s3);border-radius:var(--r2)}
 .stk{margin-left:0}
}
/* compact walk header: content starts higher on a phone */
.rail{padding-top:0;padding-bottom:var(--s1)}
.rail a{min-height:max(52px,3.25rem)}.rail a svg{width:1.6rem;height:1.6rem}
.rail a .figslot svg{width:1.6rem;height:1.6rem}
.stk{margin-bottom:var(--s2)}
.hero h1{font-size:1.3rem}.hero{margin:var(--s1) 0 var(--s2)}
.hero .ar{font-size:calc(1.4rem*var(--ar-scale));line-height:1.6}
.sect>.sh{min-height:0;margin-bottom:var(--s1)}
.sect{margin-bottom:var(--s4)}
@media(max-width:340px){.depth .seg button{font-size:.6rem;letter-spacing:-.01em}.schoolbtn{min-width:4rem}.mini .where{padding:0 var(--s1)}}
.ph2 .ct{font-weight:400;color:var(--mute);font-size:var(--t-sm);margin-left:var(--s1)}

/* AI posture figures (raster, cream plate #f6f1e7 baked in, so they sit on light and dark themes) */
.figslot img{display:block;width:1.5em;height:1.5em;object-fit:contain;border-radius:.3em}
.rail a .figslot img{width:1.875rem;height:1.875rem;border-radius:5px}
.rl a .figslot img{width:1.5rem;height:1.5rem}
.shp .fig img{width:2.5rem;height:2.5rem}
.limbstrip img{width:2rem;height:2rem}
.sbfig img{width:3.5rem;height:3.5rem}
#welcome .strip figure .figslot img{width:auto;height:100%}
.ph3.stp .figslot img{width:1.75rem;height:1.75rem}
.hero .fig:has(img){flex:1 1 100%;width:100%}
.hero .fig:has(img) .figslot{width:100%}
.hero .fig .figslot img{width:100%;max-width:18rem;height:auto;aspect-ratio:4/3;margin:0 auto;border-radius:var(--r3);border:1px solid var(--line)}
.hero .fig .figslot img[src*=".rail."]{max-width:6rem;aspect-ratio:1}
@media(min-width:760px){.hero .fig:has(img){flex:0 0 17rem;width:17rem}}
.hero:has(.fig img){flex-wrap:wrap}
.hero:has(.fig img) .tt{flex:1 1 100%}
@media(min-width:760px){.hero:has(.fig img){flex-wrap:nowrap}.hero:has(.fig img) .tt{flex:1 1 0}}