/* v172 reading trail · self-contained, optional and local-only */
.sbs172,.sbs172 *{box-sizing:border-box}
.sbs172{max-width:1110px;margin:26px auto 42px;border:1px solid #c9d9c7;border-radius:30px;overflow:hidden;background:#fffaf0;color:#283b32;box-shadow:0 16px 48px #263d2b1d;scroll-margin-top:110px}
.sbs172>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:18px;padding:20px 24px;min-height:114px;background:linear-gradient(110deg,#f6eddd,#eef4e8 65%,#fbf1dc)}
.sbs172>summary::-webkit-details-marker{display:none}.sbs172 :is(summary,button):focus-visible{outline:3px solid #b08230;outline-offset:3px}
.sbs172-mark{flex:0 0 100px;display:grid;place-items:center;min-height:88px;padding:5px 9px;border:2px solid #cbb980;border-radius:22px;background:#305d4b;color:#fff1d5;font:700 2.5rem/1.6 'Noto Naskh Arabic','Amiri',serif;direction:rtl}
.sbs172-sumcopy{display:grid;gap:5px;min-width:0;flex:1}.sbs172-kicker{font-size:.71rem;letter-spacing:.13em;text-transform:uppercase;font-weight:850;color:#9b6f31}.sbs172-sumcopy strong{font-size:clamp(1.3rem,2.4vw,1.95rem);line-height:1.25;color:#264a3a}.sbs172-sumcopy small{font-size:.9rem;line-height:1.55;color:#556759}.sbs172-opener{font-weight:780;font-size:.85rem;color:#49654e;white-space:nowrap}
.sbs172[open] .sbs172-opener{font-size:0}.sbs172[open] .sbs172-opener:after{content:'Close ↑';font-size:.85rem}
.sbs172-content{padding:clamp(16px,3.1vw,34px);background:radial-gradient(circle at 96% 1%,#e2ebe4 0%,transparent 38%),radial-gradient(circle at 0 50%,#fbedd8,transparent 56%),#fffaf1}
.sbs172-lead{max-width:72ch;margin:0 0 18px!important;line-height:1.75!important;font-size:1.04rem!important;color:#465b4b}
.sbs172-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin:0 0 22px}
.sbs172-step{display:flex;align-items:center;gap:11px;padding:14px;border:1px solid #dce3d9;border-radius:17px;background:#ffffffcf}.sbs172-step b{display:grid;place-items:center;width:36px;height:36px;flex:0 0 36px;background:#dbe8dc;border-radius:50%;color:#2b6249}.sbs172-step span{font-size:.87rem;line-height:1.4;color:#3b5947}
.sbs172-ar{font-family:'Noto Naskh Arabic','Amiri','Scheherazade New',serif;direction:rtl;unicode-bidi:isolate;line-height:1.7}
.sbs172-play{background:#fff;border:1px solid #d6ddce;border-radius:26px;overflow:hidden;box-shadow:0 12px 38px #2f3b2520}
.sbs172-progressline{background:#345b4a;color:#fff6dc;padding:13px 19px;display:flex;align-items:center;justify-content:space-between;gap:9px;flex-wrap:wrap}.sbs172-progressline strong{font-size:.84rem}.sbs172-progressline span{font-size:.78rem;opacity:.9}
.sbs172-columns{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(260px,.85fr)}
.sbs172-reading{padding:22px clamp(15px,3.5vw,33px);background:radial-gradient(ellipse at 90% 25%,#f9eace,#fff9ef 50%,#f0f5ed)}
.sbs172-overline{letter-spacing:.13em;font-size:.7rem;font-weight:850;color:#8a6835;text-transform:uppercase}
.sbs172-reading h3,.sbs172-help h3{margin:8px 0 10px;color:#2d4d3c;font-size:clamp(1.2rem,2.6vw,1.55rem)}
.sbs172-whole{font:700 clamp(3.6rem,8vw,6.2rem)/1.5 'Noto Naskh Arabic','Amiri',serif;text-align:center;margin:6px 0 2px;color:#2c624b;word-break:normal}
.sbs172-pieces{display:flex;direction:rtl;justify-content:center;gap:12px;margin:0 0 10px;flex-wrap:wrap}
.sbs172-pieces button{min-width:70px;min-height:98px;border:2px solid #b9cdbd;border-radius:18px;background:#fffdf8;color:#234b40;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;padding:7px;box-shadow:0 4px 0 #d6dfd2;transition:background .15s,transform .15s;direction:ltr}
.sbs172-pieces button:hover:not(:disabled){background:#eef7eb;transform:translateY(-2px)}
.sbs172-pieces button:disabled{cursor:default}.sbs172-pieces button[data-open="true"]{background:#e0f2e4;border-color:#33795b;box-shadow:0 3px 0 #98c5a2}
.sbs172-pieces .sbs172-letter{display:block;font:700 clamp(2.2rem,5vw,3.1rem)/1.5 'Noto Naskh Arabic','Amiri',serif;direction:rtl;color:#225945;white-space:nowrap}
.sbs172-pieces .sbs172-cue{display:block;font-size:.87rem;min-height:22px;font-weight:850;color:#8a5f27;letter-spacing:.02em}
.sbs172-feedback{min-height:58px;font-size:.94rem;line-height:1.5;color:#325542;margin:9px 0!important;text-align:center;font-weight:650}
.sbs172-help{padding:25px;background:#f0f4e9;display:flex;flex-direction:column;justify-content:center}
.sbs172-help p{line-height:1.7;color:#476451;margin:4px 0 14px!important;font-size:.95rem}
.sbs172-reveal{border-radius:16px;border:1px solid #c1d4c5;padding:15px;background:#ffffffc8;min-height:133px;display:flex;flex-direction:column;justify-content:center;gap:5px}
.sbs172-reveal b{font-size:1.05rem;color:#2e654c}.sbs172-reveal span{font-size:.9rem;line-height:1.55;color:#445a46}
.sbs172-buttons{display:flex;gap:9px;flex-wrap:wrap;padding:14px 20px;background:#f8faf5;border-top:1px solid #dbe3d6;align-items:center}
.sbs172-buttons button{border:1px solid #becfbf;padding:11px 15px;min-height:44px;border-radius:12px;background:#fff;font-weight:750;font-size:.89rem;color:#3a614b;cursor:pointer;font-family:inherit}
.sbs172-buttons button:disabled{opacity:.5;cursor:not-allowed}.sbs172-buttons .sbs172-next{margin-left:auto;background:#315e48;color:#fff;border-color:#315e48}
.sbs172-note{margin:19px 0 0!important;font-size:.87rem!important;line-height:1.7!important;color:#50624f;background:#fff3df;border-left:4px solid #c89e50;border-radius:9px;padding:12px 15px}
.sbs172-note a{color:#27596c;text-decoration:underline}
@media(max-width:710px){.sbs172-columns{grid-template-columns:1fr}.sbs172-steps{grid-template-columns:1fr;gap:7px}.sbs172-step{padding:8px 12px}.sbs172-help{padding:17px}.sbs172-reveal{min-height:80px}}
@media(max-width:450px){.sbs172>summary{gap:11px;padding:15px}.sbs172-mark{flex-basis:64px;min-height:76px;font-size:1.8rem;padding:4px}.sbs172-opener{display:none}.sbs172-pieces{gap:7px}.sbs172-pieces button{min-width:60px;min-height:80px;padding:5px}.sbs172-whole{font-size:3.8rem}.sbs172-buttons{padding:12px}.sbs172-buttons button{padding:9px 11px}}
@media(max-width:342px){.sbs172-whole{font-size:3.1rem}.sbs172-pieces .sbs172-letter{font-size:2rem}.sbs172-pieces button{min-width:55px}}
@media(prefers-reduced-motion:reduce){.sbs172 *{transition:none!important}}