:root {
    --l99-font-family-base: 'Open Sans', Helvetica, Arial, sans-serif;
    --l99-font-family-accent: 'Caveat', cursive;

    --l99-font-size-xs: 0.82rem;
    --l99-font-size-sm: 0.875rem;
    --l99-font-size-md: 0.95rem;
    --l99-font-size-lg: 1.05rem;
    --l99-font-size-xl: 1.25rem;
    --l99-font-size-2xl: 1.7rem;
    --l99-font-size-hero: 2.4rem;

    --l99-font-weight-regular: 400;
    --l99-font-weight-semibold: 600;
    --l99-font-weight-bold: 700;
    --l99-font-weight-black: 800;

    --l99-color-primary: #133a78;
    --l99-color-primary-strong: #0f2e61;
    --l99-color-primary-soft: #eef4ff;
    --l99-color-accent: #fbc12a;
    --l99-color-accent-soft: #ffd166;
    --l99-color-accent-strong: #efb200;
    --l99-color-accent-border: #d88a09;
    --l99-color-accent-text: #3a2400;
    --l99-color-accent-script: #cb4e1b;
    --l99-color-info: #2176ff;
    --l99-color-info-strong: #1a66db;
    --l99-color-info-soft: #2b8cff;
    --l99-color-success: #117a45;
    --l99-color-success-soft: #e8f8ef;
    --l99-color-warning: #f2a10a;
    --l99-color-warning-soft: #fff8df;
    --l99-color-danger: #e64942;
    --l99-color-danger-strong: #d9413a;
    --l99-color-danger-soft: #ffe8e6;

    --l99-color-text: #222222;
    --l99-color-text-strong: #111827;
    --l99-color-text-muted: #5f6980;
    --l99-color-text-subtle: #6b7280;
    --l99-color-text-light: #596273;
    --l99-color-surface: #ffffff;
    --l99-color-surface-soft: #fafbff;
    --l99-color-surface-muted: #f7f9fc;
    --l99-color-surface-tint: #eef2f7;
    --l99-color-border: #e4e8f0;
    --l99-color-border-soft: #e7eaf2;
    --l99-color-border-strong: #d8dbe7;
    --l99-color-divider: #edf0f6;
    --l99-color-overlay-dark: rgba(0, 0, 0, 0.55);
    --l99-color-overlay-mid: rgba(0, 0, 0, 0.28);
    --l99-color-overlay-light: rgba(0, 0, 0, 0.05);

    --l99-space-1: 4px;
    --l99-space-2: 8px;
    --l99-space-3: 12px;
    --l99-space-4: 16px;
    --l99-space-5: 20px;
    --l99-space-6: 24px;
    --l99-space-7: 32px;
    --l99-space-8: 40px;

    --l99-radius-sm: 6px;
    --l99-radius-md: 8px;
    --l99-radius-lg: 14px;
    --l99-radius-xl: 18px;
    --l99-radius-2xl: 20px;
    --l99-radius-3xl: 24px;
    --l99-radius-pill: 999px;

    --l99-shadow-nav: 0 10px 22px -24px rgba(0, 0, 0, 0.75);
    --l99-shadow-sm: 0 4px 10px rgba(33, 118, 255, 0.3);
    --l99-shadow-md: 0 18px 32px rgba(15, 23, 42, 0.06);
    --l99-shadow-lg: 0 18px 34px rgba(15, 23, 42, 0.06);
    --l99-shadow-xl: 0 18px 36px rgba(15, 23, 42, 0.08);
    --l99-shadow-accent: 0 7px 16px rgba(173, 99, 10, 0.35);
    --l99-shadow-accent-hover: 0 10px 18px rgba(173, 99, 10, 0.4);

    --l99-breakpoint-sm: 576px;
    --l99-breakpoint-md: 768px;
    --l99-breakpoint-lg: 992px;
    --l99-breakpoint-xl: 1200px;
}

body {
    font-family: var(--l99-font-family-base);
    color: var(--l99-color-text);
}

.l99-btn,
.l99-btn-primary,
.l99-btn-secondary,
.l99-btn-ghost {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--l99-space-2);
    border-radius: var(--l99-radius-pill);
    font-size: var(--l99-font-size-sm);
    font-weight: var(--l99-font-weight-bold);
    padding: 0.75rem 1.6rem;
    text-decoration: none;
    transition: background-color .2s ease, border-color .2s ease, color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.l99-btn-primary {
    background: var(--l99-color-accent-soft);
    color: var(--l99-color-primary);
}

.l99-btn-secondary {
    background: linear-gradient(90deg, var(--l99-color-info) 0%, var(--l99-color-info-soft) 100%);
    color: #fff;
    box-shadow: var(--l99-shadow-sm);
}

.l99-btn-ghost {
    color: #fff;
    border: 1.5px solid rgba(255, 255, 255, 0.55);
}

.l99-card-surface,
.l99-card-elevated,
.l99-card-muted,
.l99-trust-card-system {
    background: var(--l99-color-surface);
    border: 1px solid var(--l99-color-border);
    border-radius: var(--l99-radius-2xl);
}

.l99-card-elevated {
    background: linear-gradient(180deg, var(--l99-color-surface), var(--l99-color-surface-soft));
    box-shadow: var(--l99-shadow-lg);
}

.l99-card-muted {
    background: var(--l99-color-surface-muted);
    border-color: var(--l99-color-border-soft);
}

.l99-trust-card-system {
    padding: var(--l99-space-4) var(--l99-space-5);
    display: flex;
    gap: var(--l99-space-3);
    align-items: flex-start;
    box-shadow: var(--l99-shadow-md);
}

.l99-trust-icon-system {
    width: 42px;
    height: 42px;
    border-radius: var(--l99-radius-lg);
    background: var(--l99-color-primary-soft);
    color: var(--l99-color-primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.l99-tab-shell {
    background: var(--l99-color-surface);
    border: 1px solid var(--l99-color-border-soft);
    border-radius: var(--l99-radius-3xl);
    padding: var(--l99-space-5);
    box-shadow: var(--l99-shadow-xl);
}

.l99-tab-shell .nav-tabs {
    border-bottom: 1px solid var(--l99-color-border-soft);
}

.l99-tab-shell .nav-tabs .nav-link {
    border: 0;
    border-radius: var(--l99-radius-pill);
    color: var(--l99-color-text-muted);
    font-weight: var(--l99-font-weight-semibold);
    padding: 10px 16px;
}

.l99-tab-shell .nav-tabs .nav-link.active {
    color: var(--l99-color-primary);
    background: var(--l99-color-primary-soft);
}

.l99-form-control,
.l99-search-panel input,
.l99-search-panel select,
.l99-modal-shell input,
.l99-modal-shell textarea,
.l99-modal-shell select {
    border: 1px solid var(--l99-color-border);
    border-radius: var(--l99-radius-lg);
    background: var(--l99-color-surface);
}

.l99-surface-note {
    background: var(--l99-color-surface-muted);
    border: 1px solid var(--l99-color-border-soft);
    border-radius: var(--l99-radius-xl);
    color: var(--l99-color-text-subtle);
    padding: var(--l99-space-4);
}