:root{--bg-primary: #0d1117;--bg-secondary: #161b22;--bg-tertiary: #21262d;--border-color: #30363d;--text-primary: #e6edf3;--text-secondary: #8b949e;--accent-primary: #e85563;--accent-secondary: #f97c7c;--accent-light: #ff9399;--success: #3fb950;--warning: #d29922;--purple: #8957e5;--cyan: #58a6ff;--gradient-accent: linear-gradient(135deg, #e85563 0%, #f97c7c 100%);--gradient-bg: linear-gradient(135deg, #161b22 0%, #1a1f27 100%);--gradient-icon-accent: linear-gradient( 135deg, rgba(232, 85, 99, .2), rgba(249, 124, 124, .1) );--shadow-accent-hover: 0 12px 24px rgba(232, 85, 99, .15);--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px;--transition-fast: .2s cubic-bezier(.2, .8, .2, 1);--transition-slow: .3s cubic-bezier(.2, .8, .2, 1);--header-z: 100;--backdrop-blur: blur(10px)}html{background-color:var(--bg-secondary)}body,#root{background-color:var(--gradient-bg)}*{box-sizing:border-box}body{margin:0;color:var(--text-primary);background:var(--gradient-bg);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}::selection{background:#e8556340}a{color:var(--cyan);text-decoration:none}a:hover{color:var(--text-primary)}.container{width:100%;max-width:1100px;margin:0 auto;padding:0 20px}.card{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:0 2px 12px #0000004d}.button-row{display:flex;flex-wrap:wrap;gap:12px}.button-primary{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 18px;background:var(--gradient-accent);color:#fff;border:none;border-radius:var(--radius-md);cursor:pointer;transition:transform var(--transition-fast),box-shadow var(--transition-fast),filter var(--transition-fast);box-shadow:0 6px 16px #e855632e}.button-primary:hover{transform:translateY(-1px);box-shadow:var(--shadow-accent-hover)}.button-secondary{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 18px;background:transparent;color:var(--text-primary);border:1px solid var(--border-color);border-radius:var(--radius-md);cursor:pointer;transition:box-shadow var(--transition-fast),background-color var(--transition-fast),transform var(--transition-fast)}.button-secondary:hover{background:#e855630a;transform:translateY(-1px);box-shadow:0 4px 12px #e8556326}.text-muted{color:var(--text-secondary)}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.app-header{position:sticky;top:0;z-index:var(--header-z);-webkit-backdrop-filter:var(--backdrop-blur);backdrop-filter:var(--backdrop-blur);background:#161b2299;border-bottom:1px solid var(--border-color)}.header-inner{display:flex;align-items:center;justify-content:space-between;height:64px}.brand{display:inline-flex;gap:10px;align-items:center;color:var(--text-primary)}.brand-icon{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:999px;background:var(--gradient-icon-accent);border:1px solid var(--border-color)}.brand-name{font-weight:700;letter-spacing:.2px;background:var(--gradient-accent);-webkit-background-clip:text;background-clip:text;color:transparent}.nav{display:flex;gap:6px}.nav-link{color:var(--text-secondary);padding:8px 12px;border:1px solid transparent;border-radius:var(--radius-sm);transition:color var(--transition-fast),box-shadow var(--transition-fast),background-color var(--transition-fast),transform var(--transition-fast)}.nav-link:hover{color:var(--text-primary);background:#e855630a;transform:translateY(-1px);box-shadow:0 2px 8px #e855631f}.nav-link.active{color:var(--text-primary);border-color:var(--border-color)}.home{padding-bottom:48px}.hero{padding:48px 0}.hero-inner{padding:48px}.hero-content{display:flex;flex-direction:column;align-items:center;gap:32px}.hero-text{text-align:center}.hero-mascot{display:flex;justify-content:center;align-items:center}.mascot-image{width:200px;height:200px;object-fit:contain;animation:float 3s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.hero-badge{display:inline-block;padding:6px 12px;border:1px solid var(--border-color);border-radius:var(--radius-sm);color:var(--text-secondary);background:#ffffff05;margin-bottom:12px;letter-spacing:.3px;font-size:13px;font-weight:500}.hero-title{margin:8px 0 10px;font-size:28px;line-height:1.2;background:linear-gradient(135deg,var(--text-primary) 0%,var(--accent-secondary) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero-subtitle{max-width:600px;margin:0 auto 24px;line-height:1.6}.button-row{justify-content:center}.features{padding:32px 0}.features-grid{display:grid;grid-template-columns:1fr;gap:20px}.feature-card{padding:32px;text-align:center;transition:transform var(--transition-fast),box-shadow var(--transition-fast)}.feature-card:hover{transform:translateY(-2px);box-shadow:0 4px 16px #e855631f,0 2px 12px #0000004d}.feature-icon{font-size:48px;margin-bottom:16px}.feature-title{margin:0 0 12px;font-size:20px;color:var(--text-primary)}.feature-description{margin:0;line-height:1.6}.about{padding:32px 0}.about-card{padding:40px;text-align:center}.about-title{margin:0 0 16px;font-size:24px;color:var(--text-primary)}.about-text{line-height:1.7;max-width:700px;margin:0 auto}.about-text strong{color:var(--accent-primary);font-weight:600}.about-text em{color:var(--cyan);font-style:italic}@media (min-width: 768px){.hero-title{font-size:40px}.hero-inner{padding:64px}.hero-content{flex-direction:row;justify-content:space-between;gap:48px}.hero-text{flex:1;text-align:left}.hero-mascot{flex-shrink:0}.mascot-image{width:240px;height:240px}.button-row{justify-content:flex-start}.features-grid{grid-template-columns:repeat(3,1fr);gap:24px}.about-card{padding:48px 56px}}@media (min-width: 1024px){.hero-title{font-size:48px}}.signin{padding:48px 0}.signin-card{margin:0 auto;max-width:420px;padding:32px;display:flex;flex-direction:column;gap:16px}.signin-card h1{margin:0 0 4px}.signin-mascot{display:flex;justify-content:center;margin-bottom:8px}.signin-mascot-image{width:120px;height:120px;object-fit:contain;animation:gentle-bounce 2s ease-in-out infinite}@keyframes gentle-bounce{0%,to{transform:translateY(0) rotate(0)}25%{transform:translateY(-8px) rotate(-2deg)}75%{transform:translateY(-4px) rotate(2deg)}}