/* iSkvalp legal pages — tokens mirror design-system/MASTER.md (light+dark+forced-colors).
 * Shared visual DNA with wwwroot/admin.css: Figtree stack, cyan/teal palette, 4pt spacing.
 * No scripts, no cookies, no third-party fetches — these URLs are cited by App Store listings.
 */

:root {
    color-scheme: light dark;
    --color-primary: #0891B2;
    --color-primary-soft: #CFFAFE;
    --color-background: #F8FAFC;
    --color-surface: #FFFFFF;
    --color-text: #0F172A;
    --color-text-muted: #475569;
    --color-border: #E2E8F0;

    --space-xs: 4px;
    --space-sm: 8px;
    --space-md: 12px;
    --space-base: 16px;
    --space-lg: 24px;
    --space-xl: 32px;
    --space-2xl: 48px;

    --radius-card: 16px;
    --measure: 68ch;
}

@media (prefers-color-scheme: dark) {
    :root {
        --color-primary: #22D3EE;
        --color-primary-soft: #164E63;
        --color-background: #020617;
        --color-surface: #0F172A;
        --color-text: #F8FAFC;
        --color-text-muted: #94A3B8;
        --color-border: #334155;
    }
}

@media (forced-colors: active) {
    :root {
        --color-background: Canvas;
        --color-surface: Canvas;
        --color-text: CanvasText;
        --color-text-muted: CanvasText;
        --color-primary: LinkText;
        --color-primary-soft: Canvas;
        --color-border: CanvasText;
    }
}

*, *::before, *::after { box-sizing: border-box; }

html { font-size: 16px; }

body {
    margin: 0;
    font-family: "Figtree", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 16px;
    line-height: 1.55;
    color: var(--color-text);
    background: var(--color-background);
    -webkit-font-smoothing: antialiased;
    overflow-wrap: break-word;
    word-break: break-word;
}

main {
    max-width: min(var(--measure), 100%);
    margin: 0 auto;
    padding: var(--space-2xl) var(--space-base) var(--space-xl);
}

h1, h2, h3, h4 {
    font-weight: 600;
    line-height: 1.25;
    margin: var(--space-xl) 0 var(--space-md);
    color: var(--color-text);
    letter-spacing: -0.01em;
}

h1 {
    font-size: 2rem;
    margin-top: 0;
}

h2 { font-size: 1.375rem; margin-top: var(--space-2xl); }
h3 { font-size: 1.125rem; }
h4 { font-size: 1rem; }

p, ul, ol, blockquote {
    margin: 0 0 var(--space-base);
}

ul, ol { padding-left: var(--space-lg); }

li + li { margin-top: var(--space-xs); }

blockquote {
    border-left: 3px solid var(--color-primary);
    padding-left: var(--space-base);
    color: var(--color-text-muted);
}

a {
    color: var(--color-primary);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
}

a:focus-visible {
    outline: 3px solid var(--color-primary-soft);
    outline-offset: 2px;
    border-radius: 2px;
}

code, pre {
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 0.925em;
}

pre {
    padding: var(--space-base);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
    overflow-x: auto;
    max-width: 100%;
}

hr {
    border: 0;
    border-top: 1px solid var(--color-border);
    margin: var(--space-xl) 0;
}

footer {
    max-width: min(var(--measure), 100%);
    margin: 0 auto;
    padding: var(--space-lg) var(--space-base) var(--space-2xl);
    border-top: 1px solid var(--color-border);
    font-size: 0.8125rem;
    color: var(--color-text-muted);
    overflow-wrap: anywhere;
}

footer a {
    color: inherit;
    text-decoration: underline;
}

.skip-link {
    position: absolute;
    left: -9999px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
    background: var(--color-surface);
    color: var(--color-text);
    padding: var(--space-sm) var(--space-base);
    border: 2px solid var(--color-primary);
    border-radius: var(--radius-card);
}

.skip-link:focus {
    left: var(--space-base);
    top: var(--space-base);
    width: auto;
    height: auto;
    z-index: 10;
}
