.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-sm);font-family:var(--font-inter),sans-serif;font-weight:500;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-base);transform:translateY(0);user-select:none;text-decoration:none;white-space:nowrap;position:relative;border:none}.btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:var(--shadow-md)}.btn:active:not(:disabled){transform:translateY(0);transition:all var(--transition-fast)}.btn:focus-visible{outline:2px solid var(--color-brand);outline-offset:2px}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important;box-shadow:none!important}.btn-loading{cursor:wait}.btn-loading .btn-label{opacity:.7}.btn-sm{padding:6px 12px;font-size:13px;min-height:32px}.btn-md{padding:10px 20px;font-size:14px;min-height:40px}.btn-lg{padding:12px 24px;font-size:16px;min-height:48px;font-weight:600}.btn-primary{background:var(--color-brand);color:white;border:1px solid var(--color-brand)}.btn-primary:hover:not(:disabled){background:var(--color-brand-hover);border-color:var(--color-brand-hover);box-shadow:0 4px 12px rgba(76,110,245,.3)}.btn-secondary{background:transparent;color:var(--color-brand);border:1px solid var(--color-brand)}.btn-secondary:hover:not(:disabled){background:rgba(76,110,245,.08);border-color:var(--color-brand-hover)}.btn-ghost{background:transparent;color:var(--color-text-primary);border:1px solid transparent}.btn-ghost:hover:not(:disabled){background:var(--color-surface-hover);box-shadow:none}.btn-danger{background:var(--color-error);color:white;border:1px solid var(--color-error)}.btn-danger:hover:not(:disabled){background:#fa5252;border-color:#fa5252;box-shadow:0 4px 12px rgba(255,107,107,.3)}.btn-icon{display:inline-flex;align-items:center;font-size:1.1em}.btn-spinner{position:absolute;left:12px;display:inline-flex}.spinner{width:16px;height:16px;animation:spin .8s linear infinite}.spinner-circle{stroke:currentColor;opacity:.3;stroke-dasharray:60;stroke-dashoffset:15;animation:spinnerDash 1.5s ease-in-out infinite}@keyframes spin{to{transform:rotate(1turn)}}@keyframes spinnerDash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:90,200;stroke-dashoffset:-35px}to{stroke-dasharray:90,200;stroke-dashoffset:-125px}}[data-theme=dark] .btn-ghost{color:var(--color-text-primary)}[data-theme=dark] .btn-ghost:hover:not(:disabled){background:var(--color-surface-hover)}[data-theme=dark] .btn-secondary{background:rgba(92,124,250,.1)}[data-theme=dark] .btn-secondary:hover:not(:disabled){background:rgba(92,124,250,.15)}.skeleton{background-color:var(--color-surface);display:block}.skeleton,.skeleton-text{border-radius:var(--radius-sm)}.skeleton-text{height:1em;margin-bottom:.5em;transform-origin:0 55%;transform:scaleY(.6)}.skeleton-text:last-child{margin-bottom:0}.skeleton-circular{border-radius:50%}.skeleton-pulse{animation:skeleton-pulse 1.5s ease-in-out infinite}@keyframes skeleton-pulse{0%,to{opacity:1}50%{opacity:.5}}.skeleton-wave{position:relative;overflow:hidden;background:linear-gradient(90deg,var(--color-surface) 0,var(--color-surface-hover) 40%,var(--color-surface) 80%);background-size:200% 100%;animation:skeleton-wave 1.5s linear infinite}@keyframes skeleton-wave{0%{background-position:200% 0}to{background-position:-200% 0}}[data-theme=dark]{.skeleton{background-color:var(--color-surface)}.skeleton-wave{background:linear-gradient(90deg,var(--color-surface) 0,var(--color-surface-hover) 40%,var(--color-surface) 80%);background-size:200% 100%}}@media (prefers-reduced-motion:reduce){.skeleton-pulse,.skeleton-wave{animation:none}.skeleton-pulse{opacity:.7}}.skeleton-card{padding:var(--spacing-lg);background:white;border-radius:var(--radius-lg);border:1px solid var(--color-border)}[data-theme=dark]{.skeleton-card{background:var(--color-surface)}}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:var(--spacing-2xl) var(--spacing-lg);min-height:300px;animation:fadeIn .3s cubic-bezier(.4,0,.2,1)}.empty-state-icon{font-size:64px;line-height:1;margin-bottom:var(--spacing-lg);opacity:.8;animation:floatIcon 3s ease-in-out infinite}@keyframes floatIcon{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.empty-state-title{font-size:20px;font-weight:600;color:var(--color-text-primary);margin:0 0 var(--spacing-sm) 0;line-height:1.3}.empty-state-description{font-size:15px;color:var(--color-text-secondary);margin:0 0 var(--spacing-lg) 0;max-width:400px;line-height:1.5}.empty-state-action{margin-top:var(--spacing-md)}@media (max-width:768px){.empty-state{padding:var(--spacing-xl) var(--spacing-md);min-height:240px}.empty-state-icon{font-size:48px;margin-bottom:var(--spacing-md)}.empty-state-title{font-size:18px}.empty-state-description{font-size:14px}}[data-theme=dark]{.empty-state-icon{opacity:.7}}.app-header{position:sticky;top:0;left:0;right:0;z-index:1000;background:rgba(255,255,255,.95);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid rgba(0,0,0,.06);box-shadow:0 1px 3px rgba(0,0,0,.04);transition:all var(--transition-base)}.header-inner{max-width:1200px;margin:0 auto;padding:var(--spacing-md) var(--spacing-lg);justify-content:space-between;gap:var(--spacing-lg)}.brand-button,.header-inner{display:flex;align-items:center}.brand-button{gap:var(--spacing-sm);background:none;border:none;padding:var(--spacing-xs);border-radius:var(--radius-md);transition:all var(--transition-base);flex-shrink:0}.brand-button:hover{background:var(--color-surface-hover);transform:translateY(-1px)}.brand-button:active{transform:translateY(0)}.brand-icon{font-size:28px;line-height:1}.brand-text{display:flex;flex-direction:column;align-items:flex-start;text-align:left}.brand-text h1{font-size:20px;font-weight:600;line-height:1.2;color:var(--color-text-primary);margin:0}.brand-text span{font-size:11px;color:var(--color-text-secondary);line-height:1}.main-nav{display:flex;gap:var(--spacing-xs);flex:1;justify-content:center}.nav-button{display:inline-flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-md);background:transparent;border:1px solid transparent;border-radius:var(--radius-md);color:var(--color-text-secondary);font-size:14px;font-weight:500;font-family:var(--font-inter),sans-serif;transition:all var(--transition-base);white-space:nowrap}.nav-button:hover{background:var(--color-surface-hover);color:var(--color-text-primary);transform:translateY(-1px)}.nav-button:active{transform:translateY(0)}.nav-button.active{background:var(--color-brand);color:white;border-color:var(--color-brand)}.nav-button.active:hover{background:var(--color-brand-hover);border-color:var(--color-brand-hover);box-shadow:0 2px 8px rgba(76,110,245,.25)}.nav-button.ghost{color:var(--color-text-tertiary)}.nav-button.ghost:hover{color:var(--color-error);background:rgba(255,107,107,.08)}.header-actions{display:flex;gap:var(--spacing-sm);align-items:center;flex-shrink:0}.mobile-menu-toggle{display:none;background:none;border:none;padding:var(--spacing-sm);color:var(--color-text-primary);border-radius:var(--radius-md);transition:all var(--transition-base)}.mobile-menu-toggle:hover{background:var(--color-surface-hover)}.mobile-menu-toggle:active{transform:scale(.95)}.mobile-menu-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.5);z-index:9999;animation:fadeIn var(--transition-base)}.mobile-menu{position:fixed;top:60px;right:var(--spacing-md);background:white;border-radius:var(--radius-lg);box-shadow:0 8px 24px rgba(0,0,0,.15);min-width:240px;overflow:hidden;animation:slideDown .2s cubic-bezier(.4,0,.2,1);z-index:10000}@keyframes slideDown{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.mobile-menu-item{display:flex;align-items:center;gap:var(--spacing-md);width:100%;padding:var(--spacing-md) var(--spacing-lg);background:none;border:none;font-size:15px;font-weight:500;font-family:var(--font-inter),sans-serif;color:var(--color-text-primary);text-align:left;transition:all var(--transition-base);min-height:48px}.mobile-menu-item:hover{background:var(--color-surface-hover)}.mobile-menu-item:active{background:var(--color-surface)}.mobile-menu-item.active{background:var(--color-brand-light);color:var(--color-brand)}.mobile-menu-item.danger{color:var(--color-error)}.mobile-menu-item.danger:hover{background:rgba(255,107,107,.08)}.mobile-menu-divider{height:1px;background:var(--color-border);margin:var(--spacing-xs) 0}.mobile-bottom-bar{display:none;position:fixed;bottom:0;left:0;right:0;z-index:1000;background:rgba(255,255,255,.98);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid rgba(0,0,0,.06);box-shadow:0 -2px 8px rgba(0,0,0,.08);padding:var(--spacing-xs) var(--spacing-md);padding-bottom:max(var(--spacing-xs),env(safe-area-inset-bottom))}.bottom-bar-button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;flex:1;background:none;border:none;padding:var(--spacing-sm);color:var(--color-text-secondary);font-size:11px;font-weight:500;font-family:var(--font-inter),sans-serif;transition:all var(--transition-base);border-radius:var(--radius-md);min-height:56px;min-width:56px}.bottom-bar-button:active{background:var(--color-surface);transform:scale(.95)}.bottom-bar-button.active,.bottom-bar-button.active svg{color:var(--color-brand)}.desktop-only{display:flex}.mobile-only{display:none}@media (max-width:768px){.header-inner{padding:var(--spacing-sm) var(--spacing-md)}.brand-text h1{font-size:18px}.brand-text span{font-size:10px}.desktop-nav,.desktop-only{display:none}.mobile-menu-toggle,.mobile-only{display:flex}.mobile-bottom-bar{display:flex;justify-content:space-around;align-items:center}}@media (max-width:480px){.brand-icon{font-size:24px}.brand-text h1{font-size:16px}.bottom-bar-button{font-size:10px}}[data-theme=dark] .app-header{background:rgba(26,26,26,.95);border-bottom-color:rgba(255,255,255,.06);box-shadow:0 1px 3px rgba(0,0,0,.3)}[data-theme=dark] .brand-button:hover,[data-theme=dark] .nav-button:hover{background:var(--color-surface-hover)}[data-theme=dark] .nav-button.active{background:var(--color-brand);border-color:var(--color-brand)}.card{background:var(--color-background);border-radius:var(--radius-lg);padding:var(--spacing-lg);transition:all var(--transition-base);animation:fadeIn .3s cubic-bezier(.4,0,.2,1)}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.card-elevated{box-shadow:var(--shadow-md);border:1px solid var(--color-border)}.card-glass{background:rgba(255,255,255,.95);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(0,0,0,.06);box-shadow:0 4px 16px rgba(0,0,0,.08)}[data-theme=dark]{.card-glass{background:rgba(42,42,42,.95);border-color:rgba(255,255,255,.06);box-shadow:0 4px 16px rgba(0,0,0,.3)}}