/* Shared styles for Auctionscope standalone legal pages (privacy-policy, terms-of-service, disclaimer). Self-contained — these pages do not load the SPA's styles.css. Theme variables mirror 404.html so the light/dark toggle set on stays consistent. */ :root { --ink: #0f172a; --ink-soft: #334155; --muted: #64748b; --paper: #f8fafc; --paper-2: #f1f5f9; --card: #ffffff; --border: #e2e8f0; --border-strong: #cbd5e1; --accent: #2563eb; --accent-hover: #1d4ed8; --accent-soft: #eff6ff; --on-accent: #ffffff; --shadow: 0 1px 3px rgba(15,23,42,0.08), 0 1px 2px rgba(15,23,42,0.04); --shadow-md: 0 6px 16px -6px rgba(15,23,42,0.12), 0 2px 6px -2px rgba(15,23,42,0.06); color-scheme: light; } [data-theme="dark"] { --ink: #f1f5f9; --ink-soft: #cbd5e1; --muted: #94a3b8; --paper: #0b1120; --paper-2: #1a2334; --card: #111827; --border: #243044; --border-strong: #33415c; --accent: #3b82f6; --accent-hover: #60a5fa; --accent-soft: #172033; --on-accent: #0b1220; --shadow: 0 1px 3px rgba(0,0,0,0.5), 0 1px 2px rgba(0,0,0,0.4); --shadow-md: 0 6px 18px -6px rgba(0,0,0,0.6), 0 2px 6px -2px rgba(0,0,0,0.4); color-scheme: dark; } * { box-sizing: border-box; } html, body { margin: 0; padding: 0; min-height: 100%; } body { background: var(--paper); color: var(--ink); font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; font-size: 15px; line-height: 1.6; -webkit-font-smoothing: antialiased; display: flex; flex-direction: column; min-height: 100vh; } a { color: var(--accent); text-decoration: none; } a:hover { color: var(--accent-hover); text-decoration: underline; } :focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 2px; } /* Header */ .topbar { display: flex; align-items: center; justify-content: space-between; padding: 12px 24px; border-bottom: 1px solid var(--border); background: var(--paper); position: sticky; top: 0; z-index: 10; } .brand { display: inline-flex; align-items: center; gap: 9px; font-size: 18px; font-weight: 700; letter-spacing: -0.02em; color: var(--ink); text-decoration: none; } .brand:hover { text-decoration: none; } .brand-mark { width: 28px; height: 28px; border-radius: 8px; flex-shrink: 0; background: var(--accent); display: grid; place-items: center; box-shadow: var(--shadow), inset 0 1px 0 rgba(255,255,255,0.18); } .brand-name span { color: var(--muted); font-weight: 500; } .topbar-link { font-size: 14px; font-weight: 600; color: var(--ink-soft); border: 1px solid var(--border-strong); border-radius: 8px; padding: 7px 14px; background: var(--card); transition: background 150ms ease, color 150ms ease; } .topbar-link:hover { background: var(--paper-2); color: var(--ink); text-decoration: none; } /* Content */ main { flex: 1; } .legal { max-width: 800px; margin: 0 auto; padding: 40px 24px 64px; } .legal .eyebrow { font-size: 13px; font-weight: 600; color: var(--accent); letter-spacing: 0.02em; text-transform: uppercase; } .legal h1 { margin: 8px 0 6px; font-size: clamp(28px, 4.4vw, 38px); font-weight: 700; letter-spacing: -0.025em; line-height: 1.12; } .legal .updated { font-size: 13px; color: var(--muted); margin: 0 0 28px; } .legal .intro { font-size: 16px; color: var(--ink-soft); border-left: 3px solid var(--accent); background: var(--accent-soft); padding: 14px 18px; border-radius: 0 8px 8px 0; margin: 0 0 32px; } .legal h2 { margin: 34px 0 10px; font-size: 20px; font-weight: 650; letter-spacing: -0.01em; scroll-margin-top: 72px; } .legal h2 .num { color: var(--muted); font-weight: 600; margin-right: 8px; } .legal h3 { margin: 22px 0 8px; font-size: 16px; font-weight: 600; } .legal p { margin: 0 0 14px; color: var(--ink-soft); } .legal ul { margin: 0 0 16px; padding-left: 22px; color: var(--ink-soft); } .legal li { margin: 0 0 7px; } .legal strong { color: var(--ink); font-weight: 600; } .legal hr { border: none; border-top: 1px solid var(--border); margin: 36px 0; } /* Table of contents */ .toc { border: 1px solid var(--border); border-radius: 10px; background: var(--card); box-shadow: var(--shadow); padding: 18px 20px; margin: 0 0 36px; } .toc-title { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: var(--muted); margin-bottom: 10px; } .toc ol { margin: 0; padding-left: 20px; columns: 2; column-gap: 28px; font-size: 14px; } .toc li { margin: 0 0 6px; break-inside: avoid; } @media (max-width: 560px) { .toc ol { columns: 1; } } /* Footer */ .site-footer { border-top: 1px solid var(--border); background: var(--paper-2); padding: 28px 24px; } .site-footer-inner { max-width: 800px; margin: 0 auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; } .footer-links { display: flex; flex-wrap: wrap; gap: 16px; } .footer-links a { color: var(--ink-soft); font-size: 14px; font-weight: 500; } .footer-links a:hover { color: var(--accent); } .footer-copy { font-size: 13px; color: var(--muted); }