:root{--color-primary: #0a84ff;--color-primary-hover: #0070e0;--color-primary-active: #005cc5;--color-primary-light: rgba(10, 132, 255, .1);--color-secondary: #5e5ce6;--color-secondary-hover: #4c4ad4;--color-secondary-active: #3a38c2;--color-success: #30d158;--color-success-light: rgba(48, 209, 88, .1);--color-warning: #ffd60a;--color-warning-light: rgba(255, 214, 10, .1);--color-error: #ff453a;--color-error-light: rgba(255, 69, 58, .1);--color-info: #64d2ff;--color-info-light: rgba(100, 210, 255, .1);--color-text-primary: #000000;--color-text-secondary: #3c3c43;--color-text-tertiary: #8e8e93;--color-text-disabled: #c7c7cc;--color-bg-primary: #ffffff;--color-bg-secondary: #f2f2f7;--color-bg-tertiary: #e5e5ea;--color-bg-elevated: #ffffff;--color-border: #d1d1d6;--color-border-light: #e5e5ea;--color-divider: rgba(60, 60, 67, .12);--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 24px;--space-xl: 32px;--space-2xl: 48px;--space-3xl: 64px;--font-primary: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", Arial, sans-serif;--font-mono: "SF Mono", Monaco, "Cascadia Code", "Roboto Mono", Consolas, "Courier New", monospace;--font-size-xs: 12px;--font-size-sm: 14px;--font-size-base: 16px;--font-size-lg: 18px;--font-size-xl: 20px;--font-size-2xl: 24px;--font-size-3xl: 32px;--font-size-4xl: 40px;--font-weight-light: 300;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--line-height-tight: 1.2;--line-height-normal: 1.5;--line-height-relaxed: 1.75;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-2xl: 24px;--radius-full: 9999px;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1);--transition-fast: .15s ease;--transition-base: .2s ease;--transition-slow: .3s ease;--z-dropdown: 1000;--z-sticky: 1020;--z-fixed: 1030;--z-modal-backdrop: 1040;--z-modal: 1050;--z-popover: 1060;--z-tooltip: 1070;--breakpoint-sm: 480px;--breakpoint-md: 768px;--breakpoint-lg: 1024px;--breakpoint-xl: 1280px}[data-theme=dark]{--color-text-primary: #ffffff;--color-text-secondary: #ebebf5;--color-text-tertiary: #8e8e93;--color-text-disabled: #48484a;--color-bg-primary: #000000;--color-bg-secondary: #1c1c1e;--color-bg-tertiary: #2c2c2e;--color-bg-elevated: #1c1c1e;--color-border: #38383a;--color-border-light: #2c2c2e;--color-divider: rgba(235, 235, 245, .12);--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .4);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .5);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .6)}.m-xs{margin:var(--space-xs)}.m-sm{margin:var(--space-sm)}.m-md{margin:var(--space-md)}.m-lg{margin:var(--space-lg)}.m-xl{margin:var(--space-xl)}.p-xs{padding:var(--space-xs)}.p-sm{padding:var(--space-sm)}.p-md{padding:var(--space-md)}.p-lg{padding:var(--space-lg)}.p-xl{padding:var(--space-xl)}.text-primary{color:var(--color-text-primary)}.text-secondary{color:var(--color-text-secondary)}.text-tertiary{color:var(--color-text-tertiary)}.text-xs{font-size:var(--font-size-xs)}.text-sm{font-size:var(--font-size-sm)}.text-base{font-size:var(--font-size-base)}.text-lg{font-size:var(--font-size-lg)}.text-xl{font-size:var(--font-size-xl)}.font-light{font-weight:var(--font-weight-light)}.font-normal{font-weight:var(--font-weight-normal)}.font-medium{font-weight:var(--font-weight-medium)}.font-semibold{font-weight:var(--font-weight-semibold)}.font-bold{font-weight:var(--font-weight-bold)}.rounded-sm{border-radius:var(--radius-sm)}.rounded-md{border-radius:var(--radius-md)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-full{border-radius:var(--radius-full)}.shadow-sm{box-shadow:var(--shadow-sm)}.shadow-md{box-shadow:var(--shadow-md)}.shadow-lg{box-shadow:var(--shadow-lg)}.shadow-xl{box-shadow:var(--shadow-xl)}:root{--breakpoint-mobile: 480px;--breakpoint-tablet: 768px;--breakpoint-desktop: 1024px;--breakpoint-wide: 1280px;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--container-mobile: 100%;--container-tablet: 720px;--container-desktop: 960px;--container-wide: 1200px}body{font-size:16px;line-height:1.5;padding:0;margin:0}.container{width:100%;max-width:var(--container-mobile);padding:0 var(--spacing-md);margin:0 auto}@media (min-width: 768px){:root{--spacing-md: 20px;--spacing-lg: 32px;--spacing-xl: 48px}.container{max-width:var(--container-tablet);padding:0 var(--spacing-lg)}body{font-size:17px}}@media (min-width: 1024px){:root{--spacing-md: 24px;--spacing-lg: 40px;--spacing-xl: 64px}.container{max-width:var(--container-desktop)}body{font-size:18px}}@media (min-width: 1280px){.container{max-width:var(--container-wide)}}@media (hover: none) and (pointer: coarse){button,a,input[type=button],input[type=submit],.clickable{min-height:44px;min-width:44px;padding:12px 16px}*:hover{transition:none}*{-webkit-tap-highlight-color:rgba(0,0,0,.1);-webkit-touch-callout:none}}@media (orientation: landscape) and (max-height: 500px){:root{--spacing-lg: 16px;--spacing-xl: 24px}}@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi){.border-thin{border-width:.5px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}@media print{body{background:#fff;color:#000}.no-print,nav,button,.sidebar{display:none!important}}.sr-only,.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.skip-link{position:absolute;top:-40px;left:0;background:var(--body-bg);color:var(--body-text);padding:8px 16px;text-decoration:none;z-index:10000;border:2px solid var(--color-primary);border-radius:4px}.skip-link:focus{top:0}*,*:focus,*:active,*:focus-visible,button,button:focus,button:active,a,a:focus,a:active,[role=button],[role=button]:focus,.nav-link,.nav-link:focus,.nav-link:active{outline:none!important;box-shadow:none!important}input:focus,textarea:focus,select:focus,input[type=text]:focus,input[type=email]:focus,input[type=password]:focus{outline:2px solid var(--color-primary)!important;outline-offset:2px}body.using-keyboard input:focus,body.using-keyboard textarea:focus,body.using-keyboard select:focus{outline:3px solid var(--color-primary)!important;outline-offset:2px;box-shadow:0 0 0 4px #0a84ff33!important}:root{--text-primary-light: #000000;--text-secondary-light: #3c3c3c;--bg-primary-light: #ffffff;--bg-secondary-light: #f5f5f5;--text-primary-dark: #ffffff;--text-secondary-dark: #d0d0d0;--bg-primary-dark: #000000;--bg-secondary-dark: #1a1a1a;--link-color-light: #0051a8;--link-color-dark: #5eb3ff;--link-hover-light: #003d7a;--link-hover-dark: #8fcdff}html[data-theme=light]{--body-text: var(--text-primary-light);--body-text-secondary: var(--text-secondary-light);--body-bg: var(--bg-primary-light);--body-bg-secondary: var(--bg-secondary-light)}html[data-theme=dark]{--body-text: var(--text-primary-dark);--body-text-secondary: var(--text-secondary-dark);--body-bg: var(--bg-primary-dark);--body-bg-secondary: var(--bg-secondary-dark)}a{color:var(--link-color-light);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:2px}html[data-theme=dark] a{color:var(--link-color-dark)}a:hover{color:var(--link-hover-light);text-decoration-thickness:3px}html[data-theme=dark] a:hover{color:var(--link-hover-dark)}button,[role=button],input[type=button],input[type=submit]{min-height:44px;min-width:44px;padding:12px 16px;cursor:pointer}button:disabled,[aria-disabled=true]{opacity:.5;cursor:not-allowed;filter:grayscale(50%)}[aria-busy=true]{cursor:wait}[aria-invalid=true],.error{border-color:#c70000;color:#c70000}html[data-theme=dark] [aria-invalid=true],html[data-theme=dark] .error{border-color:#ff6b6b;color:#ff6b6b}[aria-valid=true],.success{border-color:#060;color:#060}html[data-theme=dark] [aria-valid=true],html[data-theme=dark] .success{border-color:#4ade80;color:#4ade80}@media (prefers-contrast: high){:root{--color-primary: #0000ff;--body-text: #000000;--body-bg: #ffffff}html[data-theme=dark]{--color-primary: #00ffff;--body-text: #ffffff;--body-bg: #000000}button,a{border:2px solid currentColor}}@media (prefers-reduced-transparency: reduce){*{opacity:1!important;background-color:var(--body-bg)!important}}:focus-within{outline:2px solid var(--color-primary);outline-offset:2px}body.using-keyboard *:focus{outline:3px solid var(--color-primary);outline-offset:2px}body.using-mouse *:focus{outline:none}*{user-select:text;-webkit-user-select:text}button,[role=button]{user-select:none;-webkit-user-select:none}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:translate(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes heartBeat{0%,to{transform:scale(1)}10%,30%{transform:scale(.9)}20%,40%,60%,80%{transform:scale(1.1)}50%,70%{transform:scale(1.05)}}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.05)}}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-5px)}20%,40%,60%,80%{transform:translate(5px)}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-fade-in{animation:fadeIn .3s ease-out}.animate-fade-in-up{animation:fadeInUp .5s ease-out}.animate-fade-in-down{animation:fadeInDown .5s ease-out}.animate-slide-in-left{animation:slideInLeft .4s ease-out}.animate-slide-in-right{animation:slideInRight .4s ease-out}.animate-scale-in{animation:scaleIn .3s ease-out}.animate-heart-beat{animation:heartBeat .6s ease-in-out}.animate-pulse{animation:pulse 2s ease-in-out infinite}.animate-shake{animation:shake .5s ease-in-out}.animate-bounce{animation:bounce .6s ease-in-out}.animate-spin{animation:spin 1s linear infinite}.scroll-animate{opacity:0;transform:translateY(30px);transition:opacity .6s ease,transform .6s ease}.scroll-animate.visible{opacity:1;transform:translateY(0)}.stagger-item{opacity:0;transform:translateY(20px);transition:opacity .4s ease,transform .4s ease}.stagger-item.visible{opacity:1;transform:translateY(0)}.hover-scale{transition:transform .2s ease}.hover-scale:hover{transform:scale(1.05)}.hover-lift{transition:transform .2s ease,box-shadow .2s ease}.hover-lift:hover{transform:translateY(-4px);box-shadow:0 8px 16px #00000026}.hover-glow{transition:box-shadow .3s ease}.hover-glow:hover{box-shadow:0 0 20px #0a84ff66}.like-button{position:relative;transition:transform .1s ease}.like-button:active{transform:scale(.9)}.like-button.liked{animation:heartBeat .6s ease-in-out}.like-button .heart-particles{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none}.like-button .heart-particles:before,.like-button .heart-particles:after{content:"❤️";position:absolute;font-size:12px;opacity:0}.like-button.liked .heart-particles:before{animation:particle-up-left .6s ease-out}.like-button.liked .heart-particles:after{animation:particle-up-right .6s ease-out}@keyframes particle-up-left{0%{opacity:1;transform:translate(-10px)}to{opacity:0;transform:translate(-30px,-40px)}}@keyframes particle-up-right{0%{opacity:1;transform:translate(10px)}to{opacity:0;transform:translate(30px,-40px)}}.page-transition-enter{opacity:0;transform:translateY(20px)}.page-transition-enter-active{opacity:1;transform:translateY(0);transition:opacity .3s ease,transform .3s ease}.page-transition-exit{opacity:1;transform:translateY(0)}.page-transition-exit-active{opacity:0;transform:translateY(-20px);transition:opacity .3s ease,transform .3s ease}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.skeleton-shimmer{background:linear-gradient(90deg,var(--color-secondary) 0%,var(--color-border) 50%,var(--color-secondary) 100%);background-size:1000px 100%;animation:shimmer 2s infinite linear}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.scroll-animate,.stagger-item{opacity:1!important;transform:none!important}}
