:root{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.6;font-weight:400;--navbar-height: 80px;--bg-primary: #ffffff;--bg-secondary: #f8fafc;--bg-tertiary: #f1f5f9;--blue-50: #eff6ff;--blue-100: #dbeafe;--blue-200: #bfdbfe;--blue-300: #93c5fd;--blue-400: #60a5fa;--blue-500: #3b82f6;--blue-600: #2563eb;--blue-700: #1d4ed8;--blue-800: #1e40af;--blue-900: #1e3a8a;--text-primary: #1e293b;--text-secondary: #64748b;--text-tertiary: #94a3b8;--border-light: #e2e8f0;--border-medium: #cbd5e1;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);color-scheme:light;color:var(--text-primary);background-color:var(--bg-primary);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:var(--blue-600);text-decoration:none;transition:all .2s ease;border-radius:6px;padding:2px 4px}a:hover{color:var(--blue-700);background-color:var(--blue-50)}body{margin:0;min-width:320px;min-height:100vh;background:linear-gradient(135deg,var(--bg-primary) 0%,var(--blue-50) 100%);background-attachment:fixed}html,body,#root,#root>div{height:100%;margin:0;padding:0}h1{font-size:3.2em;line-height:1.1;color:var(--text-primary);font-weight:700}h2{font-size:2.4em;line-height:1.2;color:var(--text-primary);font-weight:600}h3{font-size:1.8em;line-height:1.3;color:var(--text-primary);font-weight:600}button{border-radius:12px;border:2px solid transparent;padding:.75em 1.5em;font-size:1em;font-weight:600;font-family:inherit;background:linear-gradient(135deg,var(--blue-500),var(--blue-600));color:#fff;cursor:pointer;transition:all .3s ease;box-shadow:var(--shadow-md);position:relative;overflow:hidden}button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s ease}button:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);background:linear-gradient(135deg,var(--blue-600),var(--blue-700))}button:hover:before{left:100%}button:active{transform:translateY(0);box-shadow:var(--shadow-md)}button:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:var(--shadow-sm)}button:focus,button:focus-visible{outline:2px solid var(--blue-500);outline-offset:2px}button.secondary{background:var(--bg-primary);color:var(--blue-600);border:2px solid var(--blue-200)}button.secondary:hover{background:var(--blue-50);border-color:var(--blue-300);color:var(--blue-700)}input{border:2px solid var(--border-light);border-radius:12px;padding:.75em 1em;font-size:1em;font-family:inherit;background:var(--bg-primary);color:var(--text-primary);transition:all .3s ease;box-shadow:var(--shadow-sm)}input:focus{outline:none;border-color:var(--blue-400);box-shadow:0 0 0 3px #3b82f61a;transform:translateY(-1px)}input::placeholder{color:var(--text-tertiary)}.card{background:var(--bg-primary);border-radius:20px;padding:2rem;box-shadow:var(--shadow-xl);border:1px solid var(--border-light);transition:all .3s ease}.card:hover{transform:translateY(-4px);box-shadow:0 25px 50px -12px #00000026}.bubble{border-radius:20px;background:var(--bg-primary);box-shadow:var(--shadow-lg);border:1px solid var(--border-light)}.text-center{text-align:center}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}#root{max-width:1400px;margin:0 auto;padding:0;min-height:100vh;display:flex;flex-direction:column}.main-content{flex:1;padding-top:calc(var(--navbar-height) + 56px);display:flex;flex-direction:column;min-height:calc(100vh - var(--navbar-height));padding-bottom:40px}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em var(--blue-400))}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.floating{animation:float 3s ease-in-out infinite}.shimmer{background:linear-gradient(90deg,var(--blue-500) 0%,var(--blue-400) 50%,var(--blue-500) 100%);background-size:200% 100%;animation:shimmer 2s ease-in-out infinite;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.glass-card{background:#fffc;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.2);border-radius:24px;box-shadow:0 8px 32px #0000001a}.page-container{max-width:800px;margin:0 auto;padding:2rem}
