:root{--primary: #6366f1;--primary-dark: #4f46e5;--primary-light: #818cf8;--secondary: #64748b;--secondary-dark: #475569;--accent: #f1f5f9;--accent-dark: #e2e8f0;--gradient-primary: linear-gradient(135deg, #667eea 0%, #764ba2 100%);--gradient-accent: linear-gradient(135deg, #667eea 0%, #4f46e5 100%);--shadow-sm: 0 2px 4px rgba(0, 0, 0, .05);--shadow-md: 0 4px 12px rgba(0, 0, 0, .08);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .12);--shadow-primary: 0 4px 12px rgba(99, 102, 241, .15);--border-radius-sm: 8px;--border-radius-md: 12px;--border-radius-lg: 16px;--border-radius-xl: 24px}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;overflow:hidden;background:var(--accent)}#root{min-height:100vh}.app{min-height:100vh;display:flex;position:relative;background:var(--accent)}.app-main{flex:1;display:flex;flex-direction:column;overflow:hidden;background:var(--accent)}.card{background:#fff;border-radius:var(--border-radius-lg);padding:2rem;box-shadow:var(--shadow-md);border:1px solid var(--accent-dark);transition:all .3s ease}.card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.card h2{color:var(--secondary);margin-bottom:1.5rem;font-size:1.5rem;font-weight:600}.card h3{color:var(--secondary);margin-bottom:1rem;font-size:1.25rem;font-weight:600}button{background:var(--primary);color:#fff;border:none;padding:.75rem 1.5rem;border-radius:var(--border-radius-md);font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s ease;width:100%;box-shadow:var(--shadow-sm)}button:hover:not(:disabled){background:var(--primary-dark);transform:translateY(-2px);box-shadow:var(--shadow-primary)}button:active:not(:disabled){transform:translateY(0);box-shadow:var(--shadow-sm)}button:disabled{opacity:.5;cursor:not-allowed}.sidebar{overflow-y:auto;background:linear-gradient(180deg,#1e293b,#0f172a);box-shadow:2px 0 16px #0000001a}.sidebar::-webkit-scrollbar{width:6px}.sidebar::-webkit-scrollbar-track{background:#0000001a}.sidebar::-webkit-scrollbar-thumb{background:#fff3;border-radius:3px}.sidebar::-webkit-scrollbar-thumb:hover{background:#ffffff4d}.nav-button:hover{background:#6366f126!important;transform:translate(4px)}.nav-active{background:var(--gradient-accent)!important;color:#fff!important;box-shadow:0 2px 8px #6366f140}input[type=text],input[type=number],textarea{border-radius:var(--border-radius-md);transition:all .2s ease;font-family:inherit}input[type=text]:focus,input[type=number]:focus,textarea:focus{outline:none;border-color:var(--primary)!important;box-shadow:0 0 0 3px #6366f11a}.gradient-text{background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}@keyframes typing{0%,60%,to{opacity:.3}30%{opacity:1}}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes slideIn{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.fade-in{animation:fadeIn .4s ease-out}.slide-in{animation:slideIn .3s ease-out}@media (max-width: 768px){.app-header{padding:.75rem 1rem!important}.app-header h1{font-size:1rem!important}.card{padding:1.5rem;border-radius:var(--border-radius-md)}.card h2{font-size:1.25rem}.card h3{font-size:1.1rem}button{padding:.625rem 1.25rem;font-size:.8125rem}}