.toast-container{bottom:var(--space-6);right:var(--space-6);gap:var(--space-3);z-index:var(--z-toast);pointer-events:none;flex-direction:column;display:flex;position:fixed}.toast{align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-5);border-radius:var(--radius-lg);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);pointer-events:auto;min-width:280px;max-width:400px;display:flex}.toast-success{border-color:#10b9814d}.toast-success .toast-icon{color:var(--color-green)}.toast-error{border-color:#ef44444d}.toast-error .toast-icon{color:var(--color-red)}.toast-info{border-color:#3b82f64d}.toast-info .toast-icon{color:var(--color-blue)}.toast-message{color:var(--color-text-primary);flex:1}.toast-close{border-radius:var(--radius-sm);width:24px;height:24px;color:var(--color-text-muted);cursor:pointer;transition:all var(--transition-fast);flex-shrink:0;justify-content:center;align-items:center;display:flex}.toast-close:hover{color:var(--color-text-primary);background:var(--color-bg-glass)}@media (width<=768px){.toast-container{left:var(--space-4);right:var(--space-4);bottom:var(--space-4)}.toast{min-width:0;max-width:none}}:root{--color-bg-primary:#050a18;--color-bg-secondary:#0a1128;--color-bg-tertiary:#0f1a36;--color-bg-card:#0f173799;--color-bg-glass:#0f173766;--color-bg-elevated:#141e4680;--color-surface:#111b3c;--color-surface-hover:#162050;--color-border:#3b82f626;--color-border-subtle:#ffffff0f;--color-border-strong:#3b82f64d;--color-text-primary:#f1f5f9;--color-text-secondary:#94a3b8;--color-text-muted:#64748b;--color-text-inverse:#050a18;--color-blue:#3b82f6;--color-blue-light:#60a5fa;--color-blue-dark:#2563eb;--color-violet:#8b5cf6;--color-violet-light:#a78bfa;--color-cyan:#06b6d4;--color-cyan-light:#22d3ee;--color-green:#10b981;--color-green-light:#34d399;--color-red:#ef4444;--color-red-light:#f87171;--color-amber:#f59e0b;--color-amber-light:#fbbf24;--gradient-primary:linear-gradient(135deg, #3b82f6, #8b5cf6);--gradient-accent:linear-gradient(135deg, #8b5cf6, #06b6d4);--gradient-hero:linear-gradient(135deg, #3b82f6 0%, #8b5cf6 50%, #06b6d4 100%);--gradient-card:linear-gradient(135deg, #3b82f61a, #8b5cf60d);--gradient-glow:radial-gradient(circle, #3b82f626 0%, transparent 70%);--font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-size-xs:.75rem;--font-size-sm:.875rem;--font-size-base:1rem;--font-size-lg:1.125rem;--font-size-xl:1.25rem;--font-size-2xl:1.5rem;--font-size-3xl:1.875rem;--font-size-4xl:2.25rem;--font-size-5xl:3rem;--font-size-6xl:3.75rem;--font-size-7xl:4.5rem;--font-weight-light:300;--font-weight-regular:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--font-weight-extrabold:800;--line-height-tight:1.1;--line-height-snug:1.25;--line-height-normal:1.5;--line-height-relaxed:1.625;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;--space-20:5rem;--space-24:6rem;--radius-sm:.375rem;--radius-md:.5rem;--radius-lg:.75rem;--radius-xl:1rem;--radius-2xl:1.25rem;--radius-full:9999px;--shadow-sm:0 1px 2px #0000004d;--shadow-md:0 4px 12px #0006;--shadow-lg:0 8px 32px #00000080;--shadow-xl:0 16px 48px #0009;--shadow-glow-blue:0 0 20px #3b82f64d;--shadow-glow-violet:0 0 20px #8b5cf64d;--shadow-glow-cyan:0 0 20px #06b6d44d;--transition-fast:.15s ease;--transition-base:.25s ease;--transition-slow:.35s ease;--transition-spring:.4s cubic-bezier(.34, 1.56, .64, 1);--sidebar-width:260px;--topbar-height:64px;--max-width:1280px;--max-width-narrow:640px;--z-dropdown:100;--z-modal-backdrop:200;--z-modal:300;--z-toast:400;--z-tooltip:500}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px}body{font-family:var(--font-family);font-size:var(--font-size-base);line-height:var(--line-height-normal);color:var(--color-text-primary);background-color:var(--color-bg-primary);min-height:100vh;overflow-x:hidden}body:before{content:"";pointer-events:none;z-index:0;background-image:linear-gradient(#3b82f608 1px,#0000 1px),linear-gradient(90deg,#3b82f608 1px,#0000 1px);background-size:60px 60px;position:fixed;inset:0}#root{z-index:1;min-height:100vh;position:relative}a{color:var(--color-blue-light);transition:color var(--transition-fast);text-decoration:none}a:hover{color:var(--color-blue)}img,svg{max-width:100%;display:block}button{cursor:pointer;font-family:inherit;font-size:inherit;color:inherit;background:0 0;border:none}input,textarea,select{font-family:inherit;font-size:inherit;color:inherit;background:0 0;border:none;outline:none}ul,ol{list-style:none}h1,h2,h3,h4,h5,h6{font-weight:var(--font-weight-bold);line-height:var(--line-height-tight);color:var(--color-text-primary)}.glass{background:var(--color-bg-glass);-webkit-backdrop-filter:blur(16px);border:1px solid var(--color-border)}.glass-strong{background:var(--color-bg-card);-webkit-backdrop-filter:blur(24px);border:1px solid var(--color-border-strong)}.gradient-border{position:relative}.gradient-border:before{content:"";border-radius:inherit;background:var(--gradient-primary);-webkit-mask-composite:xor;pointer-events:none;padding:1px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.text-gradient{background:var(--gradient-hero);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.container{width:100%;max-width:var(--max-width);padding:0 var(--space-6);margin:0 auto}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--color-border-strong);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--color-blue)}::selection{color:var(--color-text-primary);background:#3b82f64d}:focus-visible{outline:2px solid var(--color-blue);outline-offset:2px}.btn{justify-content:center;align-items:center;gap:var(--space-2);border-radius:var(--radius-lg);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-base);white-space:nowrap;display:inline-flex;position:relative;overflow:hidden}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-sm{padding:var(--space-2) var(--space-4);font-size:var(--font-size-sm)}.btn-md{padding:var(--space-3) var(--space-6);font-size:var(--font-size-base)}.btn-lg{padding:var(--space-4) var(--space-8);font-size:var(--font-size-lg)}.btn-primary{background:var(--gradient-primary);color:#fff;box-shadow:var(--shadow-glow-blue)}.btn-primary:hover:not(:disabled){box-shadow:0 0 30px #3b82f680}.btn-secondary{background:var(--color-bg-card);color:var(--color-text-primary);border:1px solid var(--color-border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.btn-secondary:hover:not(:disabled){border-color:var(--color-border-strong);background:var(--color-surface-hover)}.btn-ghost{color:var(--color-text-secondary);background:0 0}.btn-ghost:hover:not(:disabled){background:var(--color-bg-glass);color:var(--color-text-primary)}.btn-danger{color:var(--color-red-light);background:#ef444426;border:1px solid #ef444433}.btn-danger:hover:not(:disabled){background:#ef444440;border-color:#ef444466}.btn-spinner{border:2px solid #0000;border-top-color:currentColor;border-radius:50%;width:16px;height:16px;animation:.6s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.navbar{z-index:50;border-bottom:1px solid var(--color-border-subtle);position:fixed;top:0;left:0;right:0}.navbar-inner{height:var(--topbar-height);justify-content:space-between;align-items:center;display:flex}.navbar-logo{align-items:center;gap:var(--space-2);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-text-primary);text-decoration:none;display:flex}.navbar-logo svg{color:var(--color-blue)}.navbar-links{align-items:center;gap:var(--space-8);display:flex}.navbar-links a{color:var(--color-text-secondary);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);transition:color var(--transition-fast);text-decoration:none}.navbar-links a:hover{color:var(--color-text-primary)}.navbar-actions{align-items:center;gap:var(--space-3);display:flex}@media (width<=768px){.navbar-links{display:none}}.feature-card{padding:var(--space-8);border-radius:var(--radius-xl);transition:all var(--transition-base);position:relative;overflow:hidden}.feature-card:after{content:"";background:var(--gradient-primary);opacity:0;height:2px;transition:opacity var(--transition-base);position:absolute;top:0;left:0;right:0}.feature-card:hover:after{opacity:1}.feature-card:hover{border-color:var(--color-border-strong);box-shadow:var(--shadow-glow-blue)}.feature-card-icon{border-radius:var(--radius-lg);background:var(--gradient-primary);color:#fff;width:48px;height:48px;margin-bottom:var(--space-5);justify-content:center;align-items:center;display:flex}.feature-card-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin-bottom:var(--space-3);color:var(--color-text-primary)}.feature-card-desc{font-size:var(--font-size-sm);color:var(--color-text-secondary);line-height:var(--line-height-relaxed)}.landing{overflow-x:hidden}.hero{min-height:100vh;padding-top:calc(var(--topbar-height) + var(--space-16));padding-bottom:var(--space-16);align-items:center;display:flex;position:relative}.hero-glow{pointer-events:none;background:radial-gradient(#3b82f61f 0%,#8b5cf60f 40%,#0000 70%);width:800px;height:600px;position:absolute;top:-200px;left:50%;transform:translate(-50%)}.hero-content{text-align:center;align-items:center;gap:var(--space-12);flex-direction:column;display:flex}.hero-text{max-width:800px}.hero-headline{font-size:clamp(2.5rem, 6vw, var(--font-size-7xl));font-weight:var(--font-weight-extrabold);line-height:var(--line-height-tight);margin-bottom:var(--space-6);letter-spacing:-.02em}.hero-subheadline{font-size:var(--font-size-lg);color:var(--color-text-secondary);line-height:var(--line-height-relaxed);max-width:600px;margin:0 auto var(--space-8)}.hero-actions{gap:var(--space-4);flex-wrap:wrap;justify-content:center;display:flex}.hero-visual{perspective:1200px;width:100%;max-width:900px}.mock-dashboard{border-radius:var(--radius-2xl);transition:transform var(--transition-slow);overflow:hidden;transform:rotateX(4deg)}.mock-dashboard:hover{transform:rotateX(0)}.mock-topbar{align-items:center;gap:var(--space-4);padding:var(--space-3) var(--space-5);border-bottom:1px solid var(--color-border-subtle);display:flex}.mock-dots{gap:6px;display:flex}.mock-dots span{border-radius:50%;width:10px;height:10px}.mock-dots span:first-child{background:#ef4444}.mock-dots span:nth-child(2){background:#f59e0b}.mock-dots span:nth-child(3){background:#10b981}.mock-title{font-size:var(--font-size-xs);color:var(--color-text-muted);font-weight:var(--font-weight-medium)}.mock-body{grid-template-columns:60px 1fr 1fr;min-height:260px;display:grid}.mock-sidebar{border-right:1px solid var(--color-border-subtle);padding:var(--space-4) var(--space-3);gap:var(--space-2);flex-direction:column;display:flex}.mock-nav-item{border-radius:var(--radius-sm);background:var(--color-bg-tertiary);height:8px}.mock-nav-item.active{background:#3b82f64d}.mock-content{padding:var(--space-5);gap:var(--space-4);border-right:1px solid var(--color-border-subtle);flex-direction:column;display:flex}.mock-note-card{padding:var(--space-4);border-radius:var(--radius-lg);background:var(--color-bg-glass);border:1px solid var(--color-border-subtle)}.mock-note-title{background:var(--color-border-strong);border-radius:var(--radius-sm);width:50%;height:12px;margin-bottom:var(--space-3)}.mock-note-line{background:var(--color-bg-tertiary);border-radius:var(--radius-sm);width:90%;height:8px;margin-bottom:var(--space-2)}.mock-note-line.short{width:60%}.mock-graph{padding:var(--space-4);justify-content:center;align-items:center;display:flex}.mock-graph-svg{width:100%;height:auto}.tech-strip{padding:var(--space-12) 0;border-top:1px solid var(--color-border-subtle);border-bottom:1px solid var(--color-border-subtle)}.tech-strip .container{align-items:center;gap:var(--space-5);flex-direction:column;display:flex}.tech-strip-label{font-size:var(--font-size-sm);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.1em;font-weight:var(--font-weight-medium)}.tech-strip-items{gap:var(--space-3);flex-wrap:wrap;justify-content:center;display:flex}.tech-chip{padding:var(--space-2) var(--space-5);border-radius:var(--radius-full);background:var(--color-bg-glass);border:1px solid var(--color-border);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-secondary)}.section-header{text-align:center;margin-bottom:var(--space-12)}.section-header h2{font-size:clamp(1.75rem, 4vw, var(--font-size-4xl));font-weight:var(--font-weight-bold);margin-bottom:var(--space-4)}.section-header p{font-size:var(--font-size-lg);color:var(--color-text-secondary);max-width:500px;margin:0 auto}.features-section{padding:var(--space-24) 0}.features-grid{gap:var(--space-6);grid-template-columns:repeat(auto-fit,minmax(320px,1fr));display:grid}.how-section{padding:var(--space-24) 0}.steps-grid{gap:var(--space-8);counter-reset:step;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));display:grid}.step-card{text-align:center;position:relative}.step-number{background:var(--gradient-primary);color:#fff;width:32px;height:32px;font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);margin:0 auto var(--space-5);border-radius:50%;justify-content:center;align-items:center;display:flex}.step-icon-wrap{border-radius:var(--radius-xl);background:var(--color-bg-glass);border:1px solid var(--color-border);width:64px;height:64px;color:var(--color-blue-light);margin:0 auto var(--space-5);justify-content:center;align-items:center;display:flex}.step-card h3{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin-bottom:var(--space-3)}.step-card p{font-size:var(--font-size-sm);color:var(--color-text-muted);line-height:var(--line-height-relaxed)}.cta-section{padding:var(--space-24) 0}.cta-card{text-align:center;padding:var(--space-16) var(--space-8);border-radius:var(--radius-2xl);position:relative;overflow:hidden}.cta-glow{pointer-events:none;background:radial-gradient(#3b82f626 0%,#8b5cf614 40%,#0000 70%);width:500px;height:300px;position:absolute;top:-100px;left:50%;transform:translate(-50%)}.cta-card h2{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);margin-bottom:var(--space-4);position:relative}.cta-card p{color:var(--color-text-secondary);font-size:var(--font-size-lg);margin-bottom:var(--space-8);position:relative}.landing-footer{padding:var(--space-8) 0;border-top:1px solid var(--color-border-subtle);text-align:center}.landing-footer p{font-size:var(--font-size-sm);color:var(--color-text-muted)}@media (width<=768px){.hero{padding-top:calc(var(--topbar-height) + var(--space-8))}.mock-body{grid-template-columns:1fr}.mock-sidebar,.mock-graph{display:none}.features-grid{grid-template-columns:1fr}.steps-grid{grid-template-columns:1fr 1fr}}.auth-page{min-height:100vh;padding:var(--space-8);justify-content:center;align-items:center;display:flex;position:relative}.auth-glow{pointer-events:none;background:radial-gradient(#3b82f61a 0%,#8b5cf60d 40%,#0000 70%);width:500px;height:400px;position:absolute;top:20%;left:50%;transform:translate(-50%)}.auth-card{width:100%;max-width:420px;padding:var(--space-10);border-radius:var(--radius-2xl);text-align:center}.auth-logo{align-items:center;gap:var(--space-2);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-text-primary);margin-bottom:var(--space-8);text-decoration:none;display:inline-flex}.auth-logo svg{color:var(--color-blue)}.auth-card h1{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin-bottom:var(--space-2)}.auth-subtitle{color:var(--color-text-muted);font-size:var(--font-size-sm);margin-bottom:var(--space-6)}.auth-error{color:var(--color-red-light);padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);font-size:var(--font-size-sm);margin-bottom:var(--space-5);text-align:left;background:#ef44441a;border:1px solid #ef444433}.auth-form{gap:var(--space-5);text-align:left;flex-direction:column;display:flex}.auth-submit{width:100%;margin-top:var(--space-2)}.auth-switch{margin-top:var(--space-6);font-size:var(--font-size-sm);color:var(--color-text-muted)}.auth-switch a{color:var(--color-blue-light);font-weight:var(--font-weight-medium)}.note-card{padding:var(--space-6);border-radius:var(--radius-xl);cursor:default;transition:all var(--transition-base)}.note-card:hover{border-color:var(--color-border-strong)}.note-card-header{justify-content:space-between;align-items:flex-start;gap:var(--space-3);margin-bottom:var(--space-3);display:flex}.note-card-title{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);cursor:pointer;transition:color var(--transition-fast);text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.note-card-title:hover{color:var(--color-blue-light)}.note-badge{font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);border-radius:var(--radius-full);flex-shrink:0;padding:2px 8px}.note-badge-owner{color:var(--color-blue-light);background:#3b82f626}.note-badge-shared{color:var(--color-violet-light);background:#8b5cf626}.note-badge-viewer{color:var(--color-green-light);background:#10b98126}.note-card-preview{font-size:var(--font-size-sm);color:var(--color-text-muted);line-height:var(--line-height-relaxed);margin-bottom:var(--space-4);-webkit-line-clamp:3;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.note-card-footer{justify-content:space-between;align-items:center;display:flex}.note-card-meta{align-items:center;gap:var(--space-1);font-size:var(--font-size-xs);color:var(--color-text-muted);display:flex}.note-card-actions{align-items:center;gap:var(--space-1);opacity:0;transition:opacity var(--transition-fast);display:flex}.note-card:hover .note-card-actions{opacity:1}.note-action{border-radius:var(--radius-md);width:28px;height:28px;color:var(--color-text-muted);transition:all var(--transition-fast);cursor:pointer;justify-content:center;align-items:center;display:flex}.note-action:hover{background:var(--color-bg-glass);color:var(--color-text-primary)}.note-action-danger:hover{color:var(--color-red-light);background:#ef44441a}.modal-backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:var(--z-modal-backdrop);padding:var(--space-4);background:#0009;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{border-radius:var(--radius-2xl);width:100%;max-width:560px;padding:var(--space-8);z-index:var(--z-modal);max-height:90vh;overflow-y:auto}.modal-header{margin-bottom:var(--space-6);justify-content:space-between;align-items:center;display:flex}.modal-header h2{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold)}.modal-close{border-radius:var(--radius-md);width:36px;height:36px;color:var(--color-text-muted);transition:all var(--transition-fast);cursor:pointer;justify-content:center;align-items:center;display:flex}.modal-close:hover{background:var(--color-bg-glass);color:var(--color-text-primary)}.modal-error{color:var(--color-red-light);padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);font-size:var(--font-size-sm);margin-bottom:var(--space-4);background:#ef44441a;border:1px solid #ef444433}.modal-form{gap:var(--space-5);flex-direction:column;display:flex}.form-group{gap:var(--space-2);flex-direction:column;display:flex}.form-group label{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-secondary)}.form-input{padding:var(--space-3) var(--space-4);background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg);color:var(--color-text-primary);font-size:var(--font-size-base);transition:border-color var(--transition-fast)}.form-input:focus{border-color:var(--color-blue);box-shadow:0 0 0 3px #3b82f61a}.form-input::placeholder{color:var(--color-text-muted)}.form-textarea{resize:vertical;min-height:160px;line-height:var(--line-height-relaxed)}.modal-actions{justify-content:flex-end;gap:var(--space-3);padding-top:var(--space-2);display:flex}.share-modal{max-width:440px}.share-note-title{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:var(--space-5)}.share-note-title strong{color:var(--color-text-primary)}.share-success{text-align:center;padding:var(--space-8) var(--space-4);color:var(--color-green-light);font-size:var(--font-size-lg);font-weight:var(--font-weight-medium)}.skeleton-grid{gap:var(--space-5);grid-template-columns:repeat(auto-fill,minmax(300px,1fr));display:grid}.skeleton-card{padding:var(--space-6);border-radius:var(--radius-xl)}.skeleton-line{background:linear-gradient(90deg, var(--color-bg-tertiary) 0%, var(--color-surface) 50%, var(--color-bg-tertiary) 100%);border-radius:var(--radius-sm);background-size:200% 100%;animation:1.5s ease-in-out infinite shimmer}.skeleton-title{width:60%;height:20px;margin-bottom:var(--space-4)}.skeleton-text{width:100%;height:14px;margin-bottom:var(--space-2)}.skeleton-text.short{width:75%}.skeleton-footer{margin-top:var(--space-4)}.skeleton-meta{width:30%;height:12px}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.loading-spinner-wrap{padding:var(--space-16);justify-content:center;align-items:center;display:flex}.loading-spinner{border:3px solid var(--color-border);border-top-color:var(--color-blue);border-radius:50%;width:40px;height:40px;animation:.8s linear infinite spin}.empty-state{text-align:center;padding:var(--space-16) var(--space-8);flex-direction:column;justify-content:center;align-items:center;min-height:300px;display:flex}.empty-state-icon{border-radius:var(--radius-2xl);background:var(--gradient-card);border:1px solid var(--color-border);width:80px;height:80px;color:var(--color-text-muted);margin-bottom:var(--space-6);justify-content:center;align-items:center;display:flex}.empty-state-title{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin-bottom:var(--space-3)}.empty-state-desc{font-size:var(--font-size-sm);color:var(--color-text-muted);max-width:400px;line-height:var(--line-height-relaxed);margin-bottom:var(--space-6)}.empty-state-action{margin-top:var(--space-2)}.dashboard{max-width:1100px}.dashboard-header{justify-content:space-between;align-items:flex-start;gap:var(--space-4);margin-bottom:var(--space-8);flex-wrap:wrap;display:flex}.dashboard-header h1{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold)}.dashboard-count{font-size:var(--font-size-sm);color:var(--color-text-muted);margin-top:var(--space-1)}.dashboard-actions{align-items:center;gap:var(--space-3);display:flex}.search-box{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);border-radius:var(--radius-lg);color:var(--color-text-muted);display:flex}.search-box input{width:180px;font-size:var(--font-size-sm);color:var(--color-text-primary)}.search-box input::placeholder{color:var(--color-text-muted)}.dashboard-error{align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-5);border-radius:var(--radius-lg);color:var(--color-amber-light);margin-bottom:var(--space-6);font-size:var(--font-size-sm);border-color:#f59e0b33;display:flex}.notes-grid{gap:var(--space-5);grid-template-columns:repeat(auto-fill,minmax(300px,1fr));display:grid}.delete-modal{text-align:center;max-width:400px}.delete-modal h3{font-size:var(--font-size-lg);margin-bottom:var(--space-3)}.delete-modal p{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:var(--space-6)}@media (width<=768px){.dashboard-header{flex-direction:column}.dashboard-actions{width:100%}.search-box{flex:1}.search-box input{width:100%}.notes-grid{grid-template-columns:1fr}}.graph-page{height:calc(100vh - var(--space-16));margin:calc(-1 * var(--space-8));position:relative;overflow:hidden}.graph-canvas{width:100%;height:100%}.graph-canvas canvas{outline:none!important}.graph-controls{top:var(--space-4);left:var(--space-4);z-index:10;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);border-radius:var(--radius-xl);flex-wrap:wrap;display:flex;position:absolute}.strength-control{align-items:center;gap:var(--space-2);font-size:var(--font-size-xs);color:var(--color-text-muted);padding:0 var(--space-2);display:flex}.strength-control input[type=range]{appearance:none;background:var(--color-border);border-radius:2px;outline:none;width:80px;height:4px}.strength-control input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:var(--color-blue);cursor:pointer;border-radius:50%;width:14px;height:14px}.graph-hint{bottom:var(--space-4);z-index:10;align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-5);border-radius:var(--radius-lg);font-size:var(--font-size-sm);color:var(--color-amber-light);text-align:center;border-color:#f59e0b33;max-width:600px;display:flex;position:absolute;left:50%;transform:translate(-50%)}.graph-panel{top:var(--space-4);right:var(--space-4);z-index:10;width:320px;max-height:calc(100% - var(--space-8));padding:var(--space-6);border-radius:var(--radius-xl);position:absolute;overflow-y:auto}.graph-panel-header{justify-content:space-between;align-items:flex-start;gap:var(--space-3);margin-bottom:var(--space-4);display:flex}.graph-panel-header h3{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);flex:1}.graph-panel-preview{font-size:var(--font-size-sm);color:var(--color-text-secondary);line-height:var(--line-height-relaxed);margin-bottom:var(--space-4)}.graph-panel-meta{align-items:center;gap:var(--space-3);font-size:var(--font-size-xs);color:var(--color-text-muted);margin-bottom:var(--space-3);display:flex}.graph-panel-date{font-size:var(--font-size-xs);color:var(--color-text-muted);margin-bottom:var(--space-1)}.graph-rebuild-btn{width:100%;margin-top:var(--space-4)}@media (width<=768px){.graph-page{margin:calc(-1 * var(--space-4));height:calc(100vh - var(--space-8))}.graph-controls{flex-direction:column;align-items:flex-start}.graph-panel{width:calc(100% - var(--space-8));right:var(--space-4)}}.search-page{max-width:900px}.search-page h1{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin-bottom:var(--space-2)}.search-subtitle{color:var(--color-text-muted);font-size:var(--font-size-sm);margin-bottom:var(--space-8)}.search-input-wrap{align-items:center;gap:var(--space-3);padding:var(--space-4) var(--space-6);border-radius:var(--radius-xl);margin-bottom:var(--space-8);color:var(--color-text-muted);display:flex}.search-input-wrap input{font-size:var(--font-size-lg);color:var(--color-text-primary);flex:1}.search-input-wrap input::placeholder{color:var(--color-text-muted)}.search-results-count{font-size:var(--font-size-sm);color:var(--color-text-muted);margin-bottom:var(--space-5)}.about-page{max-width:900px}.about-page h1{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin-bottom:var(--space-2)}.about-subtitle{color:var(--color-text-muted);font-size:var(--font-size-sm);margin-bottom:var(--space-8)}.about-grid{gap:var(--space-6);grid-template-columns:repeat(auto-fit,minmax(280px,1fr));display:grid}.about-card{padding:var(--space-6);border-radius:var(--radius-xl)}.about-card-icon{border-radius:var(--radius-lg);background:var(--gradient-primary);color:#fff;width:40px;height:40px;margin-bottom:var(--space-4);justify-content:center;align-items:center;display:flex}.about-card h3{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);margin-bottom:var(--space-3)}.about-card p{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:var(--space-4);line-height:var(--line-height-relaxed)}.about-details{gap:var(--space-2);flex-direction:column;display:flex}.about-row{justify-content:space-between;gap:var(--space-4);font-size:var(--font-size-sm);padding:var(--space-2) 0;border-bottom:1px solid var(--color-border-subtle);display:flex}.about-key{color:var(--color-text-muted)}.about-value{color:var(--color-text-primary);font-weight:var(--font-weight-medium);text-align:right;word-break:break-all}.about-link{align-items:center;gap:var(--space-2);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-blue-light);display:inline-flex}.about-chips{gap:var(--space-2);flex-wrap:wrap;display:flex}.sidebar{width:var(--sidebar-width);padding:var(--space-6);z-index:40;border-right:1px solid var(--color-border-subtle);flex-direction:column;display:flex;position:fixed;top:0;bottom:0;left:0}.sidebar-logo{align-items:center;gap:var(--space-3);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-text-primary);margin-bottom:var(--space-10);padding:var(--space-2) 0;display:flex}.sidebar-logo svg{color:var(--color-blue)}.sidebar-nav{gap:var(--space-1);flex-direction:column;flex:1;display:flex}.sidebar-link{align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-radius:var(--radius-lg);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);transition:all var(--transition-fast);text-decoration:none;display:flex}.sidebar-link:hover{background:var(--color-bg-glass);color:var(--color-text-primary)}.sidebar-link-active{color:var(--color-blue-light);background:#3b82f61f}.sidebar-link-active svg{color:var(--color-blue)}.sidebar-footer{border-top:1px solid var(--color-border-subtle);padding-top:var(--space-4)}.sidebar-logout{cursor:pointer;width:100%;color:var(--color-text-muted)}.sidebar-logout:hover{color:var(--color-red-light);background:#ef444414}.sidebar-mobile-toggle{top:var(--space-4);left:var(--space-4);z-index:50;border-radius:var(--radius-lg);background:var(--color-bg-card);border:1px solid var(--color-border);width:44px;height:44px;color:var(--color-text-primary);justify-content:center;align-items:center;display:none;position:fixed}.sidebar-overlay{z-index:35;background:#00000080;display:none;position:fixed;inset:0}@media (width<=768px){.sidebar{transition:transform var(--transition-base);transform:translate(-100%)}.sidebar-open{transform:translate(0)}.sidebar-mobile-toggle{display:flex}.sidebar-overlay{display:block}}.app-shell{min-height:100vh;display:flex}.app-main{margin-left:var(--sidebar-width);min-height:100vh;padding:var(--space-8);flex:1;overflow-y:auto}@media (width<=768px){.app-main{padding:var(--space-4);padding-top:calc(var(--topbar-height) + var(--space-4));margin-left:0}}