/**
 * DINO FINDER design tokens — 로그인 v2 기준 브랜드·UI 톤
 */
:root {
    /* Brand purple */
    --primary-purple: #9b7fc7;
    --primary-purple-light: #b8a5d6;
    --primary-purple-pale: #e8e0f5;
    --primary-purple-dark: #483d8b;
    --primary-purple-deep: #5b4e9d;
    --primary-purple-muted: #7c6aa8;

    /* Brand gradients (login aside / CTA) */
    --brand-aside-gradient: linear-gradient(155deg, #1a1430 0%, #2b2350 42%, #5b4e9d 78%, #7c6aa8 100%);
    --brand-sidebar-gradient: linear-gradient(175deg, #1a1430 0%, #2b2350 38%, #1f1a36 100%);
    --brand-cta-gradient: linear-gradient(135deg, #483d8b 0%, #9b7fc7 55%, #7c6aa8 100%);
    --brand-cta-shadow: 0 4px 14px rgba(91, 78, 157, 0.35);
    --brand-cta-shadow-hover: 0 8px 22px rgba(91, 78, 157, 0.4);

    /* Surfaces */
    --bg-page: #f8fafc;
    --bg-main: #f8fafc;
    --bg-card: #ffffff;
    --bg-light-purple: #f5f3f7;
    --bg-elevated: #ffffff;
    --bg-input: #fafbfc;
    --bg-subtle: #f1f5f9;

    /* Text */
    --text-primary: #334155;
    --text-secondary: #64748b;
    --text-dark: #0f172a;
    --text-heading: #0f172a;
    --text-purple: #483d8b;
    --text-muted: #94a3b8;
    --text-on-brand: #ffffff;

    /* Borders */
    --border-light: #e2e8f0;
    --border-purple: #e8e0f5;
    --border-accent: #9b7fc7;
    --border-strong: #cbd5e1;
    --border-card: rgba(226, 232, 240, 0.9);

    /* Focus / interaction */
    --focus-border: var(--primary-purple);
    --focus-ring: 0 0 0 4px rgba(155, 127, 199, 0.18);

    /* Shadows */
    --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.06);
    --shadow-md: 0 4px 12px rgba(15, 23, 42, 0.08);
    --shadow-lg: 0 12px 40px rgba(15, 23, 42, 0.1);
    --shadow-purple: 0 4px 16px rgba(155, 127, 199, 0.12);
    --shadow-card:
        0 0 0 1px rgba(15, 23, 42, 0.04),
        0 20px 50px -12px rgba(15, 23, 42, 0.12),
        0 8px 24px -8px rgba(91, 78, 157, 0.1);

    /* Spacing scale */
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-8: 32px;
    --space-10: 40px;
    --space-12: 48px;

    /* Radius (login v2) */
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 14px;
    --radius-xl: 18px;
    --radius-2xl: 20px;
    --radius-pill: 999px;

    /* Typography */
    --font-base: 18px;
    --font-base-app: 16px;
    --font-display: 1.75rem;
    --font-section: 1.25rem;
    --font-body: 1rem;
    --font-caption: 0.875rem;
    --font-small: 0.8125rem;
    --leading-tight: 1.25;
    --leading-normal: 1.55;
    --leading-relaxed: 1.65;
    --letter-tight: -0.02em;

    /* Login feature chips — 동일 너비 (가장 긴 라벨 기준) */
    --login-feature-chip-width: 17rem;

    /* 로고: DINO 제외 영역 — 옅은 형광 라임 (글로우 없음) */
    --brand-neon: #d4f08a;
    --brand-neon-bright: #e4f7b8;
    --brand-neon-glow: transparent;
    --logo-neon-filter: brightness(0) saturate(100%) invert(94%) sepia(18%) saturate(650%) hue-rotate(34deg) brightness(1.42);
    /* logo.png: DINO 좌측 흰색 | 우측 형광 (rest가 좌측을 살짝 겹쳐 흰 테두리 잔상 제거) */
    --logo-dino-split: 36%;
    --logo-rest-overlap: 1.4%;

    /* Layout */
    --sidebar-width: 380px;
    --content-max: 1600px;
    --z-modal-backdrop: 9999;
    --z-modal: 10000;
    --z-tooltip: 10001;

    /* App aliases (sidebar / CTA) */
    --app-ui-purple: var(--primary-purple);
    --app-ui-purple-hover: #8b72b8;
    --app-ui-purple-border: #7d6699;
}

@media (prefers-reduced-motion: reduce) {
    :root {
        --motion-duration: 0.01ms;
    }
}