/* DubiLook website v3 — reading.css (LR-16 package D): the few rules the three reading pages (How it works, Rules, FAQ)
   need on top of orbit.css / pages.css. The look is the design's; this only covers what the static design never had:
   language links instead of buttons (one URL per language), the rulebook's h3 sections, tables and anchored list
   items, a sheet text that carries a link, and the FAQ folds. */
.langs a{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border-radius:999px;font:700 14px/1 var(--f-body);color:var(--muted);text-decoration:none}
.langs a[aria-current="page"]{background:var(--ink);color:#fff}
.prose>h3{margin:26px 0 8px;font:700 clamp(18px,2vw,21px)/1.3 var(--f-body);letter-spacing:-.015em;scroll-margin-top:100px}
[lang="fa"] .prose>h3,[lang="ar"] .prose>h3{letter-spacing:0}
.prose h2:target,.prose>h3:target{color:var(--purple)}
.prose li[id],.prose p[id]{scroll-margin-top:100px}
.prose li:target,.prose p:target{background:#fff7e8;border-radius:12px;box-shadow:0 0 0 6px #fff7e8}
.prose hr{border:0;height:1px;margin:28px 0;background:#e6e4f2}
.prose code{font:600 .92em/1.2 var(--f-body);padding:.1em .45em;border-radius:6px;background:var(--mist);color:var(--ink)}
.prose strong{color:var(--ink)}
.prose .upd{margin:0 0 18px}
.rules{margin:0 0 16px}
.rule h3{color:var(--ink)}
.tbl{overflow-x:auto;margin:0 0 16px;border-radius:18px;background:#fff;box-shadow:0 6px 22px rgba(40,30,120,.07)}
.tbl table{width:100%;border-collapse:collapse;font-size:15.5px;min-width:320px}
.tbl th,.tbl td{padding:11px 14px;text-align:start;border-bottom:1px solid #eeedf6;vertical-align:top;color:#34334f}
.tbl th{font-weight:700;background:var(--mist);color:var(--ink)}
.tbl tr:last-child td{border-bottom:0}
.osheet [data-msg-text] a{color:var(--purple);font-weight:600}
.faq{margin:0 0 10px;border-radius:22px;background:#fff;box-shadow:0 6px 20px rgba(40,30,120,.07);scroll-margin-top:100px}
.faq summary{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:56px;padding:12px 18px;font:700 16px/1.35 var(--f-body);color:var(--ink);cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary .ic{flex:none;color:var(--purple);transition:transform .2s}
.faq[open] summary .ic{transform:rotate(180deg)}
.faq .a{padding:0 18px 16px}
.faq .a p{margin:0;font-size:16px}
.endnote{display:flex;gap:8px;align-items:flex-start;margin:18px 0 0;color:var(--muted);font-size:14.5px}
.endnote .ic{width:18px;height:18px;margin-top:3px;color:var(--purple)}
@media (prefers-reduced-motion:reduce){.faq summary .ic{transition:none}}