/* Gainix public legal pages. * * Deliberately dependency-free: no framework, no webfont, no build step. These * pages are read once by a store reviewer and occasionally by a user, and they * must render on anything. Everything here is logical-property based so the * Arabic pages need no separate stylesheet — only dir="rtl" on . */ :root { --bg: #ffffff; --surface: #f6f7f9; --text: #1a1d21; --muted: #5c6470; --rule: #e3e6ea; --accent: #1f6f4f; --accent-soft: #eaf3ee; --warn-bg: #fdf4e7; --warn-rule: #e0b071; --measure: 44rem; } @media (prefers-color-scheme: dark) { :root { --bg: #14171a; --surface: #1c2024; --text: #e8eaed; --muted: #9aa3ad; --rule: #2c3238; --accent: #6cc39a; --accent-soft: #1a2b23; --warn-bg: #2a2318; --warn-rule: #7d6337; } } *, *::before, *::after { box-sizing: border-box; } body { margin: 0; padding: 0 1.25rem 5rem; background: var(--bg); color: var(--text); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; font-size: 17px; line-height: 1.65; -webkit-text-size-adjust: 100%; } html[dir="rtl"] body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Naskh Arabic", "Geeza Pro", Tahoma, Arial, sans-serif; line-height: 1.85; } .wrap { max-width: var(--measure); margin: 0 auto; } header.masthead { border-block-end: 1px solid var(--rule); padding-block: 2.5rem 1.5rem; margin-block-end: 2.5rem; } .brand { font-size: 1.05rem; font-weight: 700; letter-spacing: 0.01em; color: var(--accent); text-decoration: none; display: inline-block; margin-block-end: 1.25rem; } h1 { font-size: 1.9rem; line-height: 1.25; margin: 0 0 0.5rem; letter-spacing: -0.01em; } h2 { font-size: 1.2rem; margin: 2.75rem 0 0.75rem; padding-block-start: 1.5rem; border-block-start: 1px solid var(--rule); line-height: 1.35; } h2:first-of-type { border-block-start: 0; padding-block-start: 0; } h3 { font-size: 1rem; margin: 1.75rem 0 0.4rem; } p, li { margin: 0 0 0.9rem; } ul { padding-inline-start: 1.35rem; } li { margin-block-end: 0.5rem; } a { color: var(--accent); } strong { font-weight: 650; } .updated { color: var(--muted); font-size: 0.9rem; margin: 0; } .langswitch { font-size: 0.9rem; } .langswitch a { text-decoration: none; } .langswitch a:hover { text-decoration: underline; } .callout { background: var(--accent-soft); border-inline-start: 3px solid var(--accent); padding: 1rem 1.15rem; margin: 1.5rem 0; border-radius: 0 6px 6px 0; } html[dir="rtl"] .callout { border-radius: 6px 0 0 6px; } .callout p:last-child, .callout ul:last-child { margin-block-end: 0; } .callout--warn { background: var(--warn-bg); border-inline-start-color: var(--warn-rule); } .tablewrap { overflow-x: auto; margin: 1.25rem 0; } table { border-collapse: collapse; width: 100%; font-size: 0.94rem; min-width: 30rem; } th, td { text-align: start; padding: 0.6rem 0.75rem; border-block-end: 1px solid var(--rule); vertical-align: top; } th { font-weight: 650; background: var(--surface); } footer.foot { margin-block-start: 4rem; padding-block-start: 1.5rem; border-block-start: 1px solid var(--rule); color: var(--muted); font-size: 0.9rem; } footer.foot a { color: var(--muted); } .btn { display: inline-block; background: var(--accent); color: #fff; text-decoration: none; font-weight: 650; padding: 0.85rem 1.5rem; border-radius: 8px; margin: 0.5rem 0 0.25rem; } .btn:hover { filter: brightness(1.08); } @media (prefers-color-scheme: dark) { .btn { color: #10241b; } } .cardlinks { display: grid; gap: 0.75rem; margin: 2rem 0; } .cardlink { display: block; padding: 1.15rem 1.25rem; border: 1px solid var(--rule); border-radius: 10px; text-decoration: none; color: var(--text); background: var(--surface); } .cardlink:hover { border-color: var(--accent); } .cardlink b { display: block; color: var(--accent); margin-block-end: 0.15rem; } .cardlink span { color: var(--muted); font-size: 0.92rem; }