/* The legal pages of the OTP site (terms, privacy, acceptable use, reporting abuse): plain reading pages in the site's colours. Text here can be selected
   and copied (the app's own pages lock it; these do not use that stylesheet). No script, no outside file. */
:root { color-scheme: dark; --bg: #0a0a0a; --surface: #131313; --line: #2b2b2b; --fg: #f2f2f2; --fg-2: #d4d4d4; --muted: #9a9a9a; --brand: #25d366; }
* { box-sizing: border-box; }
html, body { margin: 0; background: var(--bg); color: var(--fg); }
body { font-family: "Cairo", "Segoe UI", Tahoma, system-ui, sans-serif; line-height: 1.85; -webkit-text-size-adjust: 100%; }
@font-face { font-family: "Cairo"; src: url("/vendor/fonts/cairo-arabic.woff2") format("woff2"); font-display: swap; }
.top { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 12px 16px; background: rgba(10, 10, 10, .94); border-bottom: 1px solid var(--line); }
.brand { display: inline-flex; align-items: center; gap: 10px; color: var(--fg); text-decoration: none; font-weight: 800; }
.brand img { width: 30px; height: 30px; border-radius: 9px; }
.links { display: flex; flex-wrap: wrap; gap: 6px; margin-inline-start: auto; }
.links a { padding: 4px 11px; border-radius: 999px; border: 1px solid var(--line); color: var(--fg-2); text-decoration: none; font-size: .82rem; }
.links a[aria-current="page"] { border-color: var(--brand); color: var(--brand); }
main { width: min(820px, 100%); margin: 0 auto; padding: 24px 16px 60px; }
.lang { padding: 22px 22px 8px; margin-bottom: 22px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); }
.lang[dir="ltr"] { font-family: "Segoe UI", system-ui, sans-serif; line-height: 1.7; }
h1 { margin: 0 0 4px; font-size: 1.5rem; }
h2 { margin: 26px 0 6px; font-size: 1.08rem; color: var(--brand); }
p, li { color: var(--fg-2); }
ul { padding-inline-start: 22px; }
.date { margin: 0 0 14px; color: var(--muted); font-size: .85rem; }
a { color: var(--brand); }
strong { color: var(--fg); }
footer { padding: 18px 16px 30px; text-align: center; color: var(--muted); font-size: .85rem; }
@media (max-width: 480px) { .lang { padding: 18px 16px 6px; } h1 { font-size: 1.3rem; } }
