/*
 * Tela Network v2 — design tokens and base scope.
 * Sources: archive/visual_archive/20260822_v2a_lovable/source/src/styles.css
 *          docs/product/v2_color_system.md
 *          docs/product/v2_font_sizes.md (type floors)
 * Scope: .v2 on html (set in v2_base.html).
 */

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

.v2 {
    /* Typography stacks (Google Fonts link in v2 base template) */
    --v2-font-sans: "Archivo", ui-sans-serif, system-ui, sans-serif;
    --v2-font-serif: "Newsreader", Georgia, serif;
    --v2-font-mono: "IBM Plex Mono", ui-monospace, monospace;

    /* Type scale — floors in docs/product/v2_font_sizes.md */
    --v2-text-sm: 0.75rem;
    --v2-text-base: 1rem;
    --v2-text-md: 1rem;
    --v2-text-lg: 1.1875rem;
    --v2-text-logo: 1.3125rem;

    /* Canvas and ink */
    --v2-background: oklch(0.988 0.003 92);
    --v2-paper: oklch(1 0 0);
    --v2-foreground: oklch(0.255 0.008 265);
    --v2-muted-foreground: oklch(0.53 0.009 265);
    --v2-border: oklch(0.905 0.004 92);
    --v2-rule: oklch(0.868 0.005 92);
    --v2-secondary: oklch(0.962 0.004 92);
    --v2-input: oklch(0.885 0.005 92);

    /* Brand accent — labels and links, not primary button fills */
    --v2-accent: oklch(0.455 0.128 32);

    /* Evidence / status */
    --v2-settled: oklch(0.42 0.08 155);
    --v2-confirmed: oklch(0.4 0.05 250);
    --v2-claimed: oklch(0.52 0.01 265);
    --v2-disputed: oklch(0.5 0.16 28);

    /* Framer button hierarchy */
    --v2-btn-record-fill: oklch(0.15 0 0);
    --v2-btn-explore-fill: oklch(0.42 0.08 155);
    --v2-btn-on-fill: oklch(0.99 0.003 92);

    /* Layout */
    --v2-shell-max: 1240px;
    --v2-page-start: 3.5rem;
    --v2-radius: 2px;

    background-color: var(--v2-background);
    color: var(--v2-foreground);
    font-family: var(--v2-font-sans);
    font-feature-settings: "kern" 1;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

.v2 h1,
.v2 h2,
.v2 h3,
.v2 h4 {
    font-family: var(--v2-font-sans);
    letter-spacing: -0.018em;
}

@media (min-width: 768px) {
    .v2 {
        --v2-page-start: 5rem;
    }
}