:root{--color-primary: #4F46E5;--color-primary-light: #6366F1;--color-primary-lighter: #818CF8;--color-primary-dark: #4338CA;--color-primary-darker: #3730A3;--color-secondary: #818CF8;--color-secondary-light: #A5B4FC;--color-accent: #EA580C;--color-accent-light: #F97316;--color-accent-lighter: #FBA247;--color-background: #EEF2FF;--color-background-alt: #F5F8FE;--color-surface: #FFFFFF;--color-surface-secondary: #F9FAFB;--color-surface-tertiary: #F3F4F6;--color-foreground: #1E1B4B;--color-foreground-secondary: #4B5563;--color-foreground-muted: #6B7280;--color-muted: #E5E7EB;--color-muted-light: #F3F4F6;--color-border: #C7D2FE;--color-border-light: #DDD6FE;--color-ring: #4F46E5;--color-success: #10B981;--color-warning: #F59E0B;--color-error: #EF4444;--color-info: #4F46E5;--font-family-display: "Baloo 2", system-ui, sans-serif;--font-family-body: "Comic Neue", cursive;--font-family-mono: "Courier New", monospace;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extra-bold: 800;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-size-4xl: 2.25rem;--font-size-5xl: 3rem;--space-0: 0;--space-1: .5rem;--space-2: 1rem;--space-3: 1.5rem;--space-4: 2rem;--space-5: 2.5rem;--space-6: 3rem;--space-8: 4rem;--space-10: 5rem;--space-12: 6rem;--radius-sm: 12px;--radius-md: 16px;--radius-lg: 24px;--radius-xl: 32px;--radius-2xl: 40px;--radius-full: 9999px;--shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, .1), 0 1px 2px 0 rgba(0, 0, 0, .06);--shadow-base: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--shadow-md: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--shadow-clay: 0 8px 32px rgba(79, 70, 229, .15), inset 0 1px 0 rgba(255, 255, 255, .5);--shadow-clay-hover: 0 12px 48px rgba(79, 70, 229, .25), inset 0 1px 0 rgba(255, 255, 255, .6);--shadow-clay-press: inset 0 2px 4px rgba(79, 70, 229, .2), inset 0 -2px 4px rgba(0, 0, 0, .05);--border-width-sm: 1px;--border-width-md: 2px;--border-width-lg: 3px;--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-base: .2s cubic-bezier(.34, 1.56, .64, 1);--transition-slow: .3s cubic-bezier(.4, 0, .2, 1);--transition-slowest: .5s cubic-bezier(.4, 0, .2, 1);--z-base: 0;--z-dropdown: 1000;--z-sticky: 1020;--z-fixed: 1030;--z-modal-backdrop: 1040;--z-modal: 1050;--z-popover: 1060;--z-tooltip: 1070}@media(prefers-color-scheme:dark){:root{--color-background: #0F172A;--color-background-alt: #1E293B;--color-surface: #1E293B;--color-surface-secondary: #334155;--color-surface-tertiary: #475569;--color-foreground: #F1F5F9;--color-foreground-secondary: #CBD5E1;--color-foreground-muted: #94A3B8;--color-muted: #334155;--color-muted-light: #475569;--color-border: #64748B}}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{background:linear-gradient(135deg,var(--color-background) 0%,var(--color-background-alt) 100%);color:var(--color-foreground);font-family:var(--font-family-display);font-size:var(--font-size-base);line-height:1.6;min-height:100vh;overflow-x:hidden;transition:background-color var(--transition-base)}h1,h2,h3,h4,h5,h6{font-weight:var(--font-weight-bold);line-height:1.2;margin-bottom:var(--space-3);color:var(--color-foreground)}h1{font-size:var(--font-size-5xl);background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary-dark) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:var(--space-4)}h2{font-size:var(--font-size-4xl);background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-accent) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}h3{font-size:var(--font-size-3xl)}h4{font-size:var(--font-size-2xl)}h5{font-size:var(--font-size-xl)}h6{font-size:var(--font-size-lg)}p{margin-bottom:var(--space-3);color:var(--color-foreground-secondary);line-height:1.8}small{font-size:var(--font-size-sm);color:var(--color-foreground-muted)}a{color:var(--color-primary);text-decoration:none;transition:color var(--transition-fast),text-decoration var(--transition-fast);font-weight:var(--font-weight-semibold)}a:hover{color:var(--color-accent);text-decoration:underline}a:focus-visible{outline:var(--border-width-lg) solid var(--color-accent);outline-offset:2px;border-radius:var(--radius-sm)}button,[role=button],.btn{font-family:var(--font-family-display);font-weight:var(--font-weight-bold);font-size:var(--font-size-base);border:var(--border-width-lg) solid var(--color-primary);border-radius:var(--radius-md);padding:var(--space-2) var(--space-4);background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary-light) 100%);color:#fff;cursor:pointer;box-shadow:var(--shadow-clay);transition:all var(--transition-base);position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);-webkit-user-select:none;user-select:none;white-space:nowrap}button:hover,[role=button]:hover,.btn:hover{transform:translateY(-3px);box-shadow:var(--shadow-clay-hover)}button:active,[role=button]:active,.btn:active{transform:translateY(-1px);box-shadow:var(--shadow-clay-press)}button:focus-visible,[role=button]:focus-visible,.btn:focus-visible{outline:var(--border-width-md) solid var(--color-accent);outline-offset:3px}button:disabled,[role=button]:disabled,.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}button.secondary,.btn.secondary{background:linear-gradient(135deg,var(--color-secondary) 0%,var(--color-secondary-light) 100%);border-color:var(--color-secondary);color:var(--color-foreground)}button.accent,.btn.accent{background:linear-gradient(135deg,var(--color-accent) 0%,var(--color-accent-light) 100%);border-color:var(--color-accent);color:#000}button.outline,.btn.outline{background:transparent;color:var(--color-primary);border-color:var(--color-primary)}button.outline:hover,.btn.outline:hover{background:var(--color-primary);color:#fff}.card,[role=region],.panel{background:var(--color-surface);border:var(--border-width-lg) solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-6);box-shadow:var(--shadow-clay);transition:all var(--transition-base)}.card:hover,[role=region]:hover,.panel:hover{transform:translateY(-6px);box-shadow:var(--shadow-clay-hover)}.card.compact{padding:var(--space-4)}.container{max-width:1200px;margin:0 auto;padding:0 var(--space-4)}@media(max-width:768px){.container{padding:0 var(--space-3)}}.grid{display:grid;gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}@media(max-width:768px){.grid{grid-template-columns:1fr;gap:var(--space-3)}}.flex{display:flex;gap:var(--space-3)}.flex.items-center{align-items:center}.flex.justify-center{justify-content:center}.flex.justify-between{justify-content:space-between}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}*:focus-visible{outline:var(--border-width-lg) solid var(--color-accent);outline-offset:4px;border-radius:var(--radius-sm)}.skip-to-main{position:absolute;top:-40px;left:0;background:var(--color-primary);color:#fff;padding:var(--space-2) var(--space-3);text-decoration:none;z-index:var(--z-popover);font-weight:var(--font-weight-bold)}.skip-to-main:focus{top:0}@media(max-width:375px){body{font-size:var(--font-size-sm)}h1{font-size:var(--font-size-3xl)}h2{font-size:var(--font-size-2xl)}button,.btn{padding:var(--space-1) var(--space-3)}}@media(max-width:768px){h1{font-size:var(--font-size-4xl)}h2{font-size:var(--font-size-3xl)}}@media(min-width:1024px){.container{padding:0 var(--space-6)}}
