/* v201: moved verbatim out of faq.html's inline <style> — the strict CSP
   (style-src 'self') refuses <style> elements. Loaded at the same point in the
   cascade (after app.css, before canvas.css). Edit here, not in the page. */
.legal{max-width:680px;margin:0 auto;padding:48px 5% 64px}
.legal h1{font-size:clamp(26px,3.2vw,36px);font-weight:600;margin:0 0 6px}
.legal .updated{font-size:12.5px;color:var(--text3);margin-bottom:32px}
/* R149 — owner: include FAQ in this round's light-refresh pass. The list was
   plain hairline-divided text, the one page on the site with no card
   treatment at all even though .glass is the app's established language for
   grouped content everywhere else (catalog cards, curriculum rows,
   dashboard cards). Each question is now its own light card instead of a
   row in one long bordered list — same content, same order, just given the
   same visual unit the rest of the site already uses. */
/* R185: questions and sections open on tap (native <details>, works
   without JavaScript and with the keyboard). */
.faq-item,.faq-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-obj);box-shadow:var(--shadow);margin-bottom:12px}
.faq-card{padding:20px 22px}
.faq-card-t{font-size:16px;font-weight:700;margin:0 0 14px}
.faq-a{font-size:14px;line-height:1.7;color:var(--text2)}
.faq-a a{color:var(--brand)}
details.faq-item{padding:0}
details.faq-item>summary{list-style:none;cursor:pointer;display:block;position:relative;padding:17px 50px 17px 22px;margin:0;font-size:15px;font-weight:700;line-height:1.4;color:var(--text);border-radius:var(--r-obj)}
details.faq-item>summary::-webkit-details-marker{display:none}
details.faq-item>summary::after{content:"";position:absolute;right:22px;top:50%;width:8px;height:8px;border-right:2px solid var(--text3);border-bottom:2px solid var(--text3);transform:translateY(-75%) rotate(45deg);transition:transform .15s}
details.faq-item[open]>summary::after{transform:translateY(-25%) rotate(-135deg)}
details.faq-item>summary:hover{color:var(--brand)}
details.faq-item>summary:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
details.faq-item>summary h2{display:inline;font-size:15px;font-weight:700;margin:0;color:inherit;line-height:inherit}
details.faq-item>.faq-a{padding:0 22px 20px}
details.faq-item>.faq-a>p:last-child,details.faq-item>.faq-a>ul:last-child{margin-bottom:0}
.legal h3{font-size:14.5px;font-weight:700;margin:18px 0 8px;color:var(--text)}
.tbl-wrap{overflow-x:auto;margin:0 0 14px}
.tbl-wrap table{margin:0}
@media (max-width:480px){.tbl-wrap th,.tbl-wrap td{padding:7px 6px;font-size:12.5px}}
@media (prefers-reduced-motion:reduce){details.faq-item>summary::after{transition:none}}
