:root{--bg-primary:oklch(0.97 0.018 85);--bg-secondary:oklch(0.94 0.020 85);--bg-card:oklch(0.94 0.020 85);--bg-card-hover:oklch(0.91 0.022 85);--bg-elevated:oklch(0.91 0.022 85);--bg-input:oklch(0.94 0.020 85);--glass-bg:oklch(0.97 0.018 85/0.92);--glass-border:oklch(0.87 0.018 85);--glass-shadow:0 8px 40px oklch(0 0 0/0.06);--text-primary:oklch(0.18 0.025 70);--text-secondary:oklch(0.38 0.022 70);--text-muted:oklch(0.50 0.020 70);--text-inverted:oklch(0.97 0.018 85);--accent-primary:oklch(0.42 0.12 145);--accent-primary-hover:oklch(0.36 0.13 145);--accent-primary-glow:oklch(0.42 0.12 145/0.20);--accent-secondary:oklch(0.48 0.10 200);--accent-pink:oklch(0.62 0.20 340);--accent-gradient:linear-gradient(135deg,oklch(0.42 0.12 145),oklch(0.48 0.10 200));--accent-gradient-subtle:linear-gradient(135deg,oklch(0.42 0.12 145/0.08),oklch(0.48 0.10 200/0.05));--accent-dim:oklch(0.42 0.12 145/0.10);--accent-glow:oklch(0.42 0.12 145/0.20);--color-success:oklch(0.42 0.12 145);--color-success-bg:oklch(0.42 0.12 145/0.10);--color-warning:oklch(0.80 0.18 60);--color-warning-bg:oklch(0.80 0.18 60/0.10);--color-error:oklch(0.70 0.20 20);--color-error-bg:oklch(0.70 0.20 20/0.10);--color-info:oklch(0.48 0.10 200);--color-info-bg:oklch(0.48 0.10 200/0.10);--border-color:oklch(0.87 0.018 85);--border-active:oklch(0.42 0.12 145/0.5);--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:48px;--space-3xl:64px;--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-xl:24px;--radius-full:9999px;--font-family:"Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,sans-serif;--font-tight:"Plus Jakarta Sans",sans-serif;--font-mono:"Geist Mono","JetBrains Mono",monospace;--transition-fast:150ms cubic-bezier(0.4,0,0.2,1);--transition-normal:250ms cubic-bezier(0.4,0,0.2,1);--transition-slow:400ms cubic-bezier(0.4,0,0.2,1)}*,:after,:before{margin:0;padding:0;box-sizing:border-box}html{font-size:16px;scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-family);background:var(--bg-primary);color:var(--text-primary);line-height:1.6;min-height:100vh;overflow-x:hidden}body:before{content:"";position:fixed;inset:0;background-image:linear-gradient(oklch(.18 .025 70/.04) 1px,transparent 0),linear-gradient(90deg,oklch(.18 .025 70/.04) 1px,transparent 0);background-size:60px 60px;pointer-events:none;z-index:0}#root{position:relative;z-index:1;min-height:100vh}a{color:var(--accent-primary);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--accent-primary-hover)}::selection{background:var(--accent-primary);color:var(--bg-primary)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--accent-primary)}.container{max-width:1280px;margin:0 auto;padding:0 var(--space-lg)}.glass-card{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-lg);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:var(--glass-shadow)}.gradient-text{background:var(--accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.status-badge{display:inline-block;padding:2px 8px;border-radius:var(--radius-full);font-size:.72rem;font-weight:700;letter-spacing:.03em}.status-2xx{background:var(--color-success-bg);color:var(--color-success)}.status-3xx{background:oklch(.5 .18 240/.1);color:oklch(.5 .18 240)}.status-4xx{background:var(--color-error-bg);color:var(--color-error)}.status-5xx{background:var(--color-warning-bg);color:var(--color-warning)}.status-0xx{background:oklch(.6 .012 265/.1);color:var(--text-muted)}.status-ok{background:var(--color-success-bg);color:var(--color-success)}.status-error{background:var(--color-error-bg);color:var(--color-error)}.btn-primary{display:inline-flex;align-items:center;gap:8px;padding:11px 22px;border-radius:var(--radius-md);background:var(--accent-primary);color:var(--bg-primary);font-weight:700;font-size:.9rem;border:none;cursor:pointer;transition:all var(--transition-fast);text-decoration:none;box-shadow:0 4px 15px var(--accent-glow)}.btn-primary:hover{background:var(--accent-primary-hover);box-shadow:0 6px 24px var(--accent-glow);transform:translateY(-1px);color:var(--bg-primary)}.btn-secondary{display:inline-flex;align-items:center;gap:8px;padding:10px 20px;border-radius:var(--radius-md);background:transparent;color:var(--text-secondary);font-weight:500;font-size:.875rem;border:1px solid var(--border-color);cursor:pointer;transition:all var(--transition-fast);text-decoration:none}.btn-secondary:hover{background:var(--bg-card-hover);border-color:var(--border-active);color:var(--text-primary)}.data-table{width:100%;border-collapse:collapse;font-size:.85rem}.data-table th{padding:12px 16px;text-align:left;font-weight:600;font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);background:var(--bg-secondary)}.data-table td,.data-table th{border-bottom:1px solid var(--border-color)}.data-table td{padding:11px 16px;color:var(--text-secondary);vertical-align:middle}.data-table tbody tr:hover{background:var(--bg-card-hover)}.data-table tbody tr:last-child td{border-bottom:none}.spinner{animation:spin 1s linear infinite}.missing{color:var(--color-error);font-style:italic;font-size:.8em}@keyframes fadeIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes slideIn{0%{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:none}}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(.85)}}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}@keyframes marquee{0%{transform:translateX(0)}to{transform:translateX(-50%)}}.fade-in{animation:fadeIn .5s ease-out}.slide-in{animation:slideIn .5s ease-out}.reveal{opacity:0;transform:translateY(20px);transition:opacity .55s ease,transform .55s ease}.reveal.visible{opacity:1;transform:none}.app-layout{min-height:100vh;display:flex;flex-direction:column}.app-header{position:fixed;top:0;left:0;right:0;z-index:200;padding:0 48px;height:64px;display:flex;align-items:center;border-bottom:1px solid var(--border-color);background:oklch(.97 .018 85/.92);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);transition:box-shadow var(--transition-fast)}.app-header.scrolled{box-shadow:0 1px 20px oklch(0 0 0/.06)}.header-inner{width:100%;max-width:1280px;margin:0 auto;gap:40px}.header-brand,.header-inner{display:flex;align-items:center}.header-brand{gap:8px;text-decoration:none;flex-shrink:0}.nav-logo-dot{width:8px;height:8px;border-radius:50%;background:var(--accent-primary);box-shadow:0 0 10px var(--accent-glow);animation:pulse 2s ease-in-out infinite;flex-shrink:0}.brand-name{font-family:var(--font-tight);font-size:1.1rem;font-weight:800;color:var(--text-primary);letter-spacing:-.02em}.header-nav{display:flex;align-items:center;gap:4px;flex:1 1}.header-nav a{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:var(--radius-md);font-size:.875rem;font-weight:400;color:var(--text-muted);text-decoration:none;transition:color var(--transition-fast);letter-spacing:.01em}.header-nav a.active,.header-nav a:hover{color:var(--text-primary)}.header-nav a.active{font-weight:500}.tools-menu{position:relative}.tools-menu-trigger{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:var(--radius-md);font-size:.875rem;font-weight:400;color:var(--text-muted);background:transparent;border:none;cursor:pointer;transition:color var(--transition-fast);font-family:var(--font-family);letter-spacing:.01em}.tools-menu-trigger.active,.tools-menu-trigger:hover{color:var(--text-primary);font-weight:500}.tools-chevron{transition:transform var(--transition-fast);opacity:.5}.tools-chevron.open{transform:rotate(180deg)}.tools-dropdown{position:absolute;top:calc(100% + 8px);left:0;min-width:240px;background:var(--bg-primary);border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:0 16px 48px oklch(0 0 0/.12);padding:6px;z-index:200;animation:dropdownIn .15s ease}@keyframes dropdownIn{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.tools-dropdown-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--radius-md);color:var(--text-secondary);text-decoration:none;transition:all var(--transition-fast)}.tools-dropdown-item.active,.tools-dropdown-item:hover{background:var(--accent-dim);color:var(--text-primary)}.tools-dropdown-item svg{flex-shrink:0;color:var(--accent-primary)}.tools-item-label{font-size:.85rem;font-weight:600;color:var(--text-primary);line-height:1.2}.tools-item-desc{font-size:.75rem;color:var(--text-muted);margin-top:1px}.header-right{display:flex;align-items:center;gap:12px;flex-shrink:0}.app-main{flex:1 1;padding-top:64px}.btn-login{display:inline-flex;align-items:center;gap:7px;padding:8px 18px;border-radius:var(--radius-md);background:var(--accent-primary);border:none;color:var(--bg-primary);font-size:.875rem;font-weight:500;cursor:pointer;transition:all var(--transition-fast);white-space:nowrap}.btn-login:hover{background:var(--accent-primary-hover);box-shadow:0 4px 16px var(--accent-glow)}.google-icon{flex-shrink:0}.user-menu{position:relative}.user-menu-trigger{display:flex;align-items:center;gap:8px;padding:4px 10px 4px 4px;border-radius:var(--radius-full);background:var(--bg-secondary);border:1px solid var(--border-color);cursor:pointer;transition:all var(--transition-fast)}.user-menu-trigger:hover{border-color:var(--accent-primary);background:var(--bg-card-hover)}.user-avatar{object-fit:cover}.user-avatar,.user-avatar-fallback{width:26px;height:26px;border-radius:50%}.user-avatar-fallback{background:var(--accent-primary);display:flex;align-items:center;justify-content:center;color:var(--bg-primary)}.user-name{font-size:.82rem;font-weight:500;color:var(--text-primary);max-width:90px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-chevron{color:var(--text-muted);transition:transform var(--transition-fast)}.user-chevron.open{transform:rotate(180deg)}.user-menu-skeleton{width:80px;height:34px;border-radius:var(--radius-full);background:var(--bg-secondary)}.user-dropdown,.user-menu-skeleton{border:1px solid var(--border-color)}.user-dropdown{position:absolute;top:calc(100% + 10px);right:0;min-width:260px;background:var(--bg-primary);border-radius:var(--radius-lg);box-shadow:0 16px 48px oklch(0 0 0/.12);overflow:hidden;z-index:300;animation:fadeIn .12s ease}.user-dropdown-header{display:flex;align-items:center;gap:12px;padding:16px}.user-avatar-lg{object-fit:cover}.user-avatar-fallback-lg,.user-avatar-lg{width:42px;height:42px;border-radius:50%;flex-shrink:0}.user-avatar-fallback-lg{background:var(--accent-primary);display:flex;align-items:center;justify-content:center;color:var(--bg-primary)}.user-dropdown-name{font-weight:700;font-size:.88rem;color:var(--text-primary)}.user-dropdown-email{font-size:.75rem;color:var(--text-muted);margin-top:2px}.user-dropdown-plan{font-size:.68rem;font-weight:700;color:var(--accent-primary);background:var(--accent-dim);padding:2px 8px;border-radius:var(--radius-full);display:inline-block;margin-top:4px;text-transform:uppercase;letter-spacing:.05em}.user-dropdown-divider{height:1px;background:var(--border-color)}.user-dropdown-item{display:flex;align-items:center;gap:10px;width:100%;padding:11px 16px;font-size:.85rem;color:var(--text-secondary);background:transparent;border:none;cursor:pointer;transition:all var(--transition-fast);text-align:left;font-family:var(--font-family)}.user-dropdown-item:hover{background:var(--bg-card-hover);color:var(--text-primary)}.user-dropdown-logout{color:var(--color-error)}.user-dropdown-logout:hover{background:var(--color-error-bg);color:var(--color-error)}.hamburger-btn{display:none;align-items:center;justify-content:center;width:38px;height:38px;border-radius:var(--radius-md);background:var(--bg-secondary);border:1px solid var(--border-color);color:var(--text-primary);cursor:pointer;transition:background var(--transition-fast);flex-shrink:0}.hamburger-btn:hover{background:var(--bg-card-hover)}.mobile-overlay{display:none;position:fixed;inset:0;background:oklch(0 0 0/.3);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:290}.mobile-drawer{display:none;position:fixed;top:0;right:0;width:min(300px,85vw);height:100dvh;background:var(--bg-primary);border-left:1px solid var(--border-color);z-index:300;transform:translateX(100%);transition:transform .28s cubic-bezier(.4,0,.2,1);overflow-y:auto;box-shadow:-12px 0 40px oklch(0 0 0/.08)}.mobile-drawer.open{transform:translateX(0)}.mobile-drawer-inner{padding:72px 0 32px;display:flex;flex-direction:column}.mobile-user-row{padding:0 16px 16px}.mobile-divider{height:1px;background:var(--border-color);margin:8px 0}.mobile-nav-item{display:flex;align-items:center;gap:12px;padding:13px 20px;font-size:.93rem;font-weight:500;color:var(--text-secondary);text-decoration:none;transition:background var(--transition-fast),color var(--transition-fast);border:none;background:transparent;cursor:pointer;width:100%;text-align:left;font-family:var(--font-family)}.mobile-nav-item.active,.mobile-nav-item:hover{background:var(--accent-dim);color:var(--accent-primary)}.mobile-section-toggle{font-weight:600}.mobile-sub-items{background:var(--bg-secondary)}.mobile-sub-item{padding-left:44px;font-size:.87rem}@media (max-width:768px){.app-header{padding:0 20px}.desktop-nav,.desktop-user{display:none!important}.hamburger-btn{display:flex}.mobile-overlay{display:block}.mobile-drawer{display:flex;flex-direction:column}}