@import"https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300;400;500&display=swap";.playground-auth *,.playground-app *{font-family:JetBrains Mono,monospace!important;box-sizing:border-box!important;margin:0!important;padding:0!important}:root{--mono-black: #000;--mono-gray-900: #111;--mono-gray-800: #222;--mono-gray-700: #333;--mono-gray-600: #666;--mono-gray-500: #999;--mono-gray-400: #bbb;--mono-gray-300: #ddd;--mono-gray-200: #eee;--mono-gray-100: #f8f8f8;--mono-white: #fff}.playground-auth,.playground-app{font-size:11px!important;line-height:1.4!important;color:var(--mono-black)!important;background:var(--mono-white)!important;-webkit-font-smoothing:antialiased!important}.playground-auth{min-height:100vh!important;display:flex!important;align-items:center!important;justify-content:center!important}.auth-container{width:280px!important}.auth-card{padding:24px!important;background:var(--mono-white)!important;border:1px solid var(--mono-gray-300)!important;box-shadow:none!important;border-radius:0!important}.auth-card h1{font-size:12px!important;font-weight:400!important;text-align:center!important;margin-bottom:20px!important;text-transform:uppercase!important;letter-spacing:.1em!important}.form-group{margin-bottom:16px!important}.form-group label{display:block!important;font-size:9px!important;color:var(--mono-gray-600)!important;margin-bottom:4px!important;text-transform:uppercase!important;letter-spacing:.05em!important}.form-group input{width:100%!important;padding:6px 8px!important;font-size:11px!important;border:1px solid var(--mono-gray-300)!important;background:var(--mono-white)!important;border-radius:0!important}.form-group input:focus{outline:none!important;border-color:var(--mono-black)!important;box-shadow:none!important}.playground-app{height:100vh!important;display:grid!important;grid-template-rows:32px 1fr!important;overflow:hidden!important;background:var(--mono-white)!important}.playground-header{background:var(--mono-white)!important;border-bottom:1px solid var(--mono-gray-200)!important;display:flex!important;align-items:center!important;justify-content:space-between!important;padding:0 12px!important;box-shadow:none!important}.header-left{display:flex!important;align-items:center!important;gap:16px!important}.back-link{color:var(--mono-gray-500)!important;text-decoration:none!important;font-size:10px!important;padding:4px!important;border-radius:0!important}.back-link:hover{color:var(--mono-black)!important;background:transparent!important}.tenant-info{display:flex!important;align-items:center!important;gap:8px!important;background:transparent!important;border:none!important;padding:0!important}.tenant-name{font-size:10px!important;color:var(--mono-gray-700)!important;font-weight:400!important}.user-id{font-size:9px!important;color:var(--mono-gray-500)!important}.playground-content{display:flex!important;height:100%!important;overflow:hidden!important;background:var(--mono-white)!important}.notes-sidebar{width:200px!important;flex-shrink:0!important;background:var(--mono-gray-100)!important;border-right:1px solid var(--mono-gray-200)!important;display:flex!important;flex-direction:column!important;box-shadow:none!important}.sidebar-header{padding:8px 12px!important;background:var(--mono-white)!important;border-bottom:1px solid var(--mono-gray-200)!important;display:flex!important;align-items:center!important;justify-content:space-between!important}.sidebar-header:after{display:none!important}.sidebar-header h2{font-size:10px!important;font-weight:400!important;text-transform:uppercase!important;letter-spacing:.05em!important;color:var(--mono-gray-600)!important}.notes-list{flex:1!important;overflow-y:auto!important;padding:4px!important}.notes-list::-webkit-scrollbar{width:3px!important}.notes-list::-webkit-scrollbar-thumb{background:var(--mono-gray-400)!important}.note-item{background:var(--mono-white)!important;border:1px solid var(--mono-gray-300)!important;border-radius:0!important;padding:6px 8px!important;margin-bottom:2px!important;cursor:pointer!important;transition:all .15s ease!important;box-shadow:none!important;animation:none!important}.note-item:before,.note-item:after{display:none!important}.note-item:hover{border-color:var(--mono-gray-600)!important;background:var(--mono-gray-100)!important;transform:none!important;box-shadow:none!important}.note-item.selected{background:var(--mono-black)!important;border-color:var(--mono-black)!important;color:var(--mono-white)!important}.note-item h3{font-size:10px!important;font-weight:500!important;margin-bottom:2px!important}.note-item p{font-size:9px!important;color:var(--mono-gray-600)!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}.note-item.selected p{color:var(--mono-gray-400)!important}.note-date{font-size:8px!important;color:var(--mono-gray-500)!important}.note-item.selected .note-date{color:var(--mono-gray-500)!important}.empty-state{padding:24px!important;text-align:center!important;background:transparent!important;border:1px dashed var(--mono-gray-400)!important;margin:8px!important}.empty-state:before{display:none!important}.empty-state p{font-size:10px!important;color:var(--mono-gray-500)!important}.note-editor{flex:1!important;background:var(--mono-white)!important;display:flex!important;flex-direction:column!important;margin:0!important;border-radius:0!important;box-shadow:none!important;border:none!important;overflow:hidden!important;min-width:0!important}.editor-header{padding:8px 16px!important;border-bottom:1px solid var(--mono-gray-200)!important;background:var(--mono-gray-100)!important;display:flex!important;align-items:center!important;justify-content:space-between!important;position:relative!important}.editor-header:after{content:"100% ▼"!important;position:absolute!important;left:50%!important;transform:translate(-50%)!important;font-size:9px!important;color:var(--mono-gray-600)!important;letter-spacing:.05em!important}.editor-header:before{display:none!important}.editor-header h2{font-size:12px!important;font-weight:500!important;color:var(--mono-black)!important}.note-content-display{flex:1!important;padding:0!important;overflow-y:auto!important;overflow-x:hidden!important;background:var(--mono-gray-300)!important;border-bottom:1px solid var(--mono-gray-200)!important;display:flex!important;justify-content:center!important;align-items:flex-start!important}.note-content-display:before{display:none!important}.note-content-display::-webkit-scrollbar{width:3px!important}.note-content-display::-webkit-scrollbar-thumb{background:var(--mono-gray-400)!important}.markdown-content{font-size:11px!important;line-height:1.6!important;color:var(--mono-black)!important;width:100%!important;max-width:650px!important;padding:48px 64px!important;margin:24px!important;font-family:JetBrains Mono,monospace!important;background:var(--mono-white)!important;box-shadow:0 2px 8px #00000026!important;min-height:calc(100vh - 200px)!important;position:relative!important}.markdown-content:before{content:"DOCUMENT"!important;position:absolute!important;top:16px!important;left:64px!important;font-size:8px!important;color:var(--mono-gray-500)!important;letter-spacing:.2em!important;text-transform:uppercase!important}.markdown-content:after{content:"PAGE 1"!important;position:absolute!important;bottom:16px!important;right:64px!important;font-size:8px!important;color:var(--mono-gray-500)!important;letter-spacing:.1em!important}.markdown-content h1,.markdown-content h2,.markdown-content h3{font-weight:600!important;margin-top:24px!important;margin-bottom:12px!important;color:var(--mono-black)!important;border-bottom:1px solid var(--mono-gray-200)!important;padding-bottom:4px!important}.markdown-content h1{font-size:14px!important}.markdown-content h2{font-size:13px!important}.markdown-content h3{font-size:12px!important}.markdown-content p{margin-bottom:16px!important;text-align:justify!important}.markdown-content code{background:var(--mono-gray-100)!important;padding:2px 4px!important;border-radius:0!important;font-size:10px!important;border:1px solid var(--mono-gray-200)!important}.markdown-content pre{background:var(--mono-gray-900)!important;color:var(--mono-gray-200)!important;padding:12px!important;border-radius:0!important;margin:12px 0!important;font-size:9px!important;border:1px solid var(--mono-gray-300)!important}.markdown-content pre code{background:transparent!important;padding:0!important;color:inherit!important}.markdown-content ul,.markdown-content ol{margin:16px 0!important;padding-left:24px!important}.markdown-content li{margin-bottom:4px!important;line-height:1.6!important}.markdown-content a{color:var(--mono-black)!important;text-decoration:underline!important}.ai-controls{padding:12px 16px!important;background:var(--mono-gray-100)!important;border-top:1px solid var(--mono-gray-200)!important}.ai-controls:before{display:none!important}.ai-controls h3{font-size:10px!important;font-weight:400!important;text-transform:uppercase!important;letter-spacing:.05em!important;color:var(--mono-gray-600)!important;margin-bottom:8px!important}.message-input{display:flex!important;gap:4px!important;margin-bottom:8px!important}.message-input input{flex:1!important;padding:6px 8px!important;font-size:11px!important;border:1px solid var(--mono-gray-300)!important;background:var(--mono-white)!important;border-radius:0!important;box-shadow:none!important}.message-input input:focus{outline:none!important;border-color:var(--mono-black)!important;box-shadow:none!important}.ai-actions{display:flex!important;gap:4px!important;flex-wrap:wrap!important}.playground-auth .btn,.playground-app .btn{padding:4px 8px!important;font-size:10px!important;font-weight:400!important;text-transform:uppercase!important;letter-spacing:.05em!important;border:1px solid var(--mono-gray-300)!important;background:var(--mono-white)!important;color:var(--mono-black)!important;cursor:pointer!important;transition:all .15s ease!important;text-decoration:none!important;border-radius:0!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;width:auto!important;line-height:1!important}.playground-auth .btn:hover,.playground-app .btn:hover{background:var(--mono-gray-100)!important;border-color:var(--mono-black)!important;transform:none!important;box-shadow:none!important}.playground-auth .btn:active,.playground-app .btn:active{transform:translateY(1px)!important}.playground-auth .btn-primary,.playground-app .btn-primary{background:var(--mono-black)!important;color:var(--mono-white)!important;border-color:var(--mono-black)!important}.playground-auth .btn-primary:hover,.playground-app .btn-primary:hover{background:var(--mono-gray-800)!important;border-color:var(--mono-gray-800)!important}.playground-auth .btn-secondary,.playground-app .btn-secondary{background:var(--mono-white)!important;color:var(--mono-black)!important;border:1px solid var(--mono-gray-300)!important}.playground-auth .btn-danger,.playground-app .btn-danger{width:20px!important;height:20px!important;padding:0!important;font-size:12px!important;color:var(--mono-gray-600)!important;background:var(--mono-white)!important;border:1px solid var(--mono-gray-300)!important}.playground-auth .btn-danger:hover,.playground-app .btn-danger:hover{color:var(--mono-black)!important;border-color:var(--mono-black)!important;background:var(--mono-gray-100)!important}.playground-auth .btn-small,.playground-app .btn-small{padding:2px 6px!important;font-size:9px!important}.playground-auth .btn-icon,.playground-app .btn-icon{width:20px!important;height:20px!important;padding:0!important;font-size:12px!important}.playground-auth .btn:disabled,.playground-app .btn:disabled{opacity:.4!important;cursor:not-allowed!important}.playground-auth .btn:disabled:hover,.playground-app .btn:disabled:hover{background:var(--mono-white)!important;border-color:var(--mono-gray-300)!important}.playground-auth .btn:disabled:active,.playground-app .btn:disabled:active{transform:none!important}.empty-editor{display:flex!important;align-items:center!important;justify-content:center!important;height:100%!important}.empty-editor:before{display:none!important}.empty-editor p{font-size:11px!important;color:var(--mono-gray-500)!important;opacity:1!important}.error-message{background:transparent!important;border:1px solid var(--mono-gray-600)!important;color:var(--mono-black)!important;padding:8px!important;font-size:10px!important;margin-top:8px!important;border-radius:0!important}.auth-help{text-align:center!important;margin-top:16px!important;border:none!important;padding:0!important}.auth-help p{font-size:10px!important;color:var(--mono-gray-600)!important}.auth-help a{color:var(--mono-black)!important;text-decoration:underline!important}.auth-help a:hover{text-decoration:none!important}@keyframes slideIn{0%{opacity:1}to{opacity:1}}@keyframes fadeIn{0%{opacity:1}to{opacity:1}}@keyframes pulse{0%{opacity:1}to{opacity:1}}*:focus-visible{outline:1px solid var(--mono-black)!important;outline-offset:1px!important}::selection{background:var(--mono-black)!important;color:var(--mono-white)!important}.MatrixBackground,.ActivityIndicator,.ProgressBar,.KeyboardShortcuts,.WelcomeMessage{display:none!important}:root{--white: #fafaf9;--black: #000000;--bg-primary: #fafaf9;--gray-50: #f5f5f4;--gray-100: #e7e5e4;--gray-200: #d6d3d1;--gray-300: #a8a29e;--gray-400: #78716c;--gray-500: #57534e;--gray-600: #44403c;--gray-700: #292524;--gray-800: #1c1917;--gray-900: #0c0a09;--brand-blue: #0066ff;--brand-blue-dark: #0052cc;--brand-green: #10b981;--brand-purple: #8b5cf6;--brand-gradient: linear-gradient(135deg, var(--brand-blue) 0%, var(--brand-purple) 100%);--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", "Arial", sans-serif;--font-serif: "Georgia", "Cambria", "Times New Roman", Times, serif;--font-mono: "JetBrains Mono", "SF Mono", "Monaco", "Cascadia Code", "Roboto Mono", monospace;--font-xs: .75rem;--font-sm: .875rem;--font-base: 1rem;--font-lg: 1.125rem;--font-xl: 1.25rem;--font-2xl: 1.5rem;--font-3xl: 1.875rem;--font-4xl: 2.25rem;--font-5xl: 3rem;--font-6xl: 3.75rem;--leading-none: 1;--leading-tight: 1.25;--leading-snug: 1.375;--leading-normal: 1.5;--leading-relaxed: 1.625;--leading-loose: 1.75;--leading-extra: 2;--tracking-tighter: -.05em;--tracking-tight: -.025em;--tracking-normal: 0;--tracking-wide: .025em;--tracking-wider: .05em;--tracking-widest: .1em;--font-thin: 100;--font-extralight: 200;--font-light: 300;--font-normal: 400;--font-medium: 500;--font-semibold: 600;--font-bold: 700;--font-extrabold: 800;--font-black: 900;--reading-width-narrow: 45ch;--reading-width-normal: 65ch;--reading-width-wide: 75ch;--reading-width-full: 100%;--paragraph-spacing-tight: 1rem;--paragraph-spacing-normal: 1.5rem;--paragraph-spacing-loose: 2rem;--space-px: 1px;--space-0: 0;--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;--space-32: 8rem;--max-width: 1200px;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 16px;--radius-xl: 24px;--radius-full: 9999px;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1);--shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, .25);--transition-fast: .15s ease;--transition-base: .2s ease;--transition-slow: .3s ease;--z-base: 0;--z-dropdown: 10;--z-sticky: 20;--z-fixed: 30;--z-modal-backdrop: 40;--z-modal: 50;--z-popover: 60;--z-tooltip: 70}*,*:before,*:after{box-sizing:border-box}*{margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;scroll-behavior:smooth}.page-transitioning main{animation:pageSlideIn .3s ease-out}@keyframes pageSlideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}body{font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;font-size:var(--font-base);line-height:1.6;color:var(--gray-900);background:var(--white);min-height:100vh;position:relative;overflow-x:hidden;font-feature-settings:"kern" 1,"liga" 1,"calt" 1;-webkit-font-variant-ligatures:common-ligatures;font-variant-ligatures:common-ligatures}.grid-overlay{position:fixed;inset:0;background-image:linear-gradient(rgba(0,102,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(0,102,255,.03) 1px,transparent 1px);background-size:100px 100px;pointer-events:none;z-index:-1}.nav{position:fixed;top:0;left:0;right:0;z-index:var(--z-sticky);background:#fafaf9d9;backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border-bottom:1px solid rgba(0,0,0,.05)}.nav-inner{max-width:var(--max-width);margin:0 auto;padding:var(--space-4) var(--space-6);display:flex;align-items:center;justify-content:space-between}.logo{display:flex;align-items:baseline;font-size:var(--font-xl);font-weight:700;letter-spacing:-.02em;text-decoration:none;color:inherit}.logo-accent{font-size:var(--font-sm);color:var(--brand-blue);margin-left:2px}.nav-link{display:inline-flex;align-items:center;gap:var(--space-1);color:var(--gray-600);text-decoration:none;font-size:var(--font-sm);font-weight:500;padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);transition:all var(--transition-base)}.nav-link:hover{color:var(--gray-900);background:var(--gray-100)}.nav-api{color:var(--brand-blue)}.nav-api:hover{color:var(--brand-blue-dark);background:#0066ff1a}.nav-link svg{transition:transform var(--transition-base)}.nav-link:hover svg{transform:translate(2px,-2px)}main{padding-top:calc(60px + var(--space-16))}.hero{max-width:var(--max-width);margin:0 auto;padding:0 var(--space-6) var(--space-24);text-align:center}.hero-badge{display:inline-block;font-size:var(--font-xs);font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--brand-blue);padding:var(--space-2) var(--space-4);background:#0066ff1a;border-radius:var(--radius-full);margin-bottom:var(--space-6)}.hero-title{font-size:var(--font-5xl);font-weight:900;letter-spacing:-.04em;line-height:1;margin-bottom:var(--space-8)}.title-line{display:block}.title-accent{background:var(--brand-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero-subtitle{font-size:var(--font-xl);color:var(--gray-600);line-height:1.5;max-width:600px;margin:0 auto var(--space-12)}.metric-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-4);max-width:600px;margin:0 auto}.metric{padding:var(--space-6) var(--space-4);background:var(--gray-50);border-radius:var(--radius-lg);border:1px solid var(--gray-200);transition:all var(--transition-base)}.metric:hover{transform:translateY(-2px);border-color:var(--gray-300);box-shadow:var(--shadow-md)}.metric-hero{background:var(--gray-900);color:var(--white);border-color:var(--gray-900)}.metric-hero:hover{background:var(--black);border-color:var(--black)}.metric-value{font-size:var(--font-3xl);font-weight:700;letter-spacing:-.02em;line-height:1;display:flex;align-items:baseline;justify-content:center;gap:2px}.metric-unit{font-size:var(--font-lg);font-weight:400;opacity:.7}.metric-label{font-size:var(--font-sm);color:var(--gray-500);margin-top:var(--space-2)}.metric-hero .metric-label{color:var(--gray-400)}.code-preview{max-width:900px;margin:0 auto var(--space-24);padding:0 var(--space-6)}.code-header{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-3) var(--space-6);background:var(--gray-900);border-radius:var(--radius-lg) var(--radius-lg) 0 0}.code-dots{display:flex;gap:var(--space-2)}.code-dots span{width:12px;height:12px;border-radius:var(--radius-full);background:var(--gray-700)}.code-dots span:nth-child(1){background:#ff5f56}.code-dots span:nth-child(2){background:#ffbd2e}.code-dots span:nth-child(3){background:#27c93f}.code-title{font-family:var(--font-mono);font-size:var(--font-sm);color:var(--gray-400)}.code-content{background:var(--gray-900);padding:var(--space-8);border-radius:0 0 var(--radius-lg) var(--radius-lg);overflow-x:auto;font-family:var(--font-mono);font-size:var(--font-sm);line-height:1.6;color:var(--gray-300)}.code-content .code-comment,.bot-code .code-comment{color:#6a737d}.code-content .code-keyword,.bot-code .code-keyword{color:#f97583}.code-content .code-class,.bot-code .code-class{color:#b392f0}.code-content .code-property,.bot-code .code-property{color:#79b8ff}.code-content .code-string,.bot-code .code-string{color:#9ecbff}.code-content .code-method,.bot-code .code-method{color:#b392f0}.code-content .code-number,.bot-code .code-number{color:#79b8ff}.code-content .code-env,.bot-code .code-env{color:#ffab70}.section-header{max-width:600px;margin:0 auto var(--space-12);text-align:center}.section-header h2{font-size:var(--font-3xl);font-weight:700;letter-spacing:-.02em;margin-bottom:var(--space-4)}.section-header p{font-size:var(--font-lg);color:var(--gray-600)}.features-section{max-width:var(--max-width);margin:0 auto;padding:var(--space-24) var(--space-6)}.feature-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--space-6)}.feature-card{padding:var(--space-8);background:var(--white);border:1px solid var(--gray-200);border-radius:var(--radius-lg);transition:all var(--transition-base);position:relative;overflow:hidden}.feature-card:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--brand-gradient);opacity:0;transition:opacity var(--transition-base)}.feature-card:hover{border-color:var(--gray-300);box-shadow:var(--shadow-lg);transform:translateY(-4px)}.feature-card:hover:before{opacity:1}.feature-card-wide{grid-column:span 2}.feature-icon{position:relative;width:60px;height:60px;margin-bottom:var(--space-6)}.icon-bg{position:absolute;inset:0;background:var(--gray-100);border-radius:var(--radius-lg);transition:all var(--transition-base)}.feature-card:hover .icon-bg{transform:rotate(45deg);background:var(--brand-gradient);opacity:.1}.feature-icon span{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:var(--font-2xl)}.feature-card h3{font-size:var(--font-xl);font-weight:600;margin-bottom:var(--space-3)}.feature-card p{color:var(--gray-600);line-height:1.6;margin-bottom:var(--space-6)}.feature-stat{font-size:var(--font-sm);font-weight:600;color:var(--brand-blue);padding:var(--space-2) var(--space-3);background:#0066ff1a;border-radius:var(--radius-md);display:inline-block}.transform-section{background:var(--gray-50);padding:var(--space-24) var(--space-6)}.transform-demo{max-width:var(--max-width);margin:0 auto;display:grid;grid-template-columns:1fr auto 1fr;gap:var(--space-8);align-items:stretch}.transform-input,.transform-output{background:var(--white);border-radius:var(--radius-lg);border:1px solid var(--gray-200);overflow:hidden}.transform-label{font-size:var(--font-sm);font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--gray-600);padding:var(--space-4) var(--space-6);background:var(--gray-50);border-bottom:1px solid var(--gray-200)}.note-content{padding:var(--space-8);color:var(--gray-700);line-height:1.8}.transform-arrow{display:flex;align-items:center;justify-content:center;color:var(--gray-400)}.enhanced-content{padding:var(--space-6)}.enhanced-section{padding:var(--space-4);border-radius:var(--radius-md);margin-bottom:var(--space-4);background:var(--gray-50)}.enhanced-section:last-child{margin-bottom:0}.enhanced-section h4{font-size:var(--font-base);font-weight:600;margin-bottom:var(--space-3);display:flex;align-items:center;gap:var(--space-2)}.enhanced-section p{font-size:var(--font-sm);color:var(--gray-600);line-height:1.6}.enhanced-section ul{list-style:none;padding:0;margin:0}.enhanced-section li{font-size:var(--font-sm);color:var(--gray-600);padding:var(--space-2) 0;padding-left:var(--space-6);position:relative}.enhanced-section li:before{content:"→";position:absolute;left:0;color:var(--brand-blue);font-weight:600}.bot-section{max-width:var(--max-width);margin:0 auto;padding:var(--space-24) var(--space-6)}.bot-showcase{display:grid;grid-template-columns:1.5fr 1fr;gap:var(--space-12);align-items:start}.bot-code{background:var(--gray-900);border-radius:var(--radius-lg);padding:var(--space-8);font-family:var(--font-mono);font-size:var(--font-sm);line-height:1.8;overflow-x:auto}.bot-code pre{margin:0;color:var(--gray-300);white-space:pre;overflow-x:auto}.bot-code code{white-space:pre;display:block}.bot-platforms{display:grid;gap:var(--space-4)}.platform-item{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-4);background:var(--gray-50);border-radius:var(--radius-lg);border:1px solid var(--gray-200);transition:all var(--transition-base)}.platform-item:hover{border-color:var(--brand-blue);background:#0066ff0d;transform:translate(4px)}.platform-icon{font-size:var(--font-2xl);flex-shrink:0}.platform-item h4{font-size:var(--font-base);font-weight:600;margin-bottom:var(--space-1)}.platform-item p{font-size:var(--font-sm);color:var(--gray-600);margin:0}.pricing-section{background:var(--gray-50);padding:var(--space-24) var(--space-6)}.pricing-grid{max-width:1000px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-6);align-items:start}.pricing-card{background:var(--white);border:2px solid var(--gray-200);border-radius:var(--radius-lg);padding:var(--space-8);position:relative;transition:all var(--transition-base)}.pricing-card:hover{border-color:var(--gray-300);transform:translateY(-4px);box-shadow:var(--shadow-xl)}.pricing-featured{border-color:var(--brand-blue);transform:scale(1.05);box-shadow:var(--shadow-xl)}.pricing-featured:hover{transform:scale(1.05) translateY(-4px)}.pricing-badge{position:absolute;top:-12px;left:50%;transform:translate(-50%);background:var(--brand-blue);color:var(--white);font-size:var(--font-xs);font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:var(--space-1) var(--space-4);border-radius:var(--radius-full)}.pricing-header{text-align:center;padding-bottom:var(--space-6);border-bottom:1px solid var(--gray-200);margin-bottom:var(--space-6)}.pricing-header h3{font-size:var(--font-xl);font-weight:600;margin-bottom:var(--space-4)}.price{display:flex;align-items:baseline;justify-content:center;gap:var(--space-1)}.price-currency{font-size:var(--font-xl);color:var(--gray-500)}.price-value{font-size:var(--font-4xl);font-weight:700;letter-spacing:-.02em}.price-period{font-size:var(--font-base);color:var(--gray-500)}.pricing-features{list-style:none;padding:0;margin:0 0 var(--space-8)}.pricing-features li{padding:var(--space-3) 0;color:var(--gray-600);font-size:var(--font-sm);display:flex;align-items:center;gap:var(--space-2)}.pricing-features li:before{content:"✓";color:var(--brand-green);font-weight:600;flex-shrink:0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-4) var(--space-8);font-size:var(--font-base);font-weight:600;text-decoration:none;border-radius:var(--radius-lg);border:2px solid transparent;transition:all var(--transition-base);cursor:pointer;width:auto}.btn-primary{background:var(--gray-900);color:var(--white);border-color:var(--gray-900)}.btn-primary:hover{background:var(--black);border-color:var(--black);transform:translateY(-2px);box-shadow:var(--shadow-lg)}.btn-secondary{background:var(--white);color:var(--gray-900);border-color:var(--gray-300)}.btn-secondary:hover{border-color:var(--gray-900);transform:translateY(-2px)}.btn-large{padding:var(--space-4) var(--space-8);font-size:var(--font-lg);white-space:nowrap}.cta-section{max-width:800px;margin:0 auto;padding:var(--space-32) var(--space-6);text-align:center}.cta-content h2{font-size:var(--font-4xl);font-weight:700;letter-spacing:-.02em;margin-bottom:var(--space-4)}.cta-content p{font-size:var(--font-xl);color:var(--gray-600);margin-bottom:var(--space-8)}.cta-buttons{display:inline-flex;gap:var(--space-4);align-items:center}.cta-link{display:inline-flex;align-items:center;gap:var(--space-1);color:var(--gray-600);text-decoration:none;font-size:var(--font-sm);font-weight:500;padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);transition:all var(--transition-base)}.cta-link:hover{color:var(--gray-900);background:var(--gray-100);transform:translateY(-1px)}.footer{background:var(--gray-900);color:var(--white);padding:var(--space-16) var(--space-6) var(--space-8)}.footer-content{max-width:var(--max-width);margin:0 auto;display:flex;justify-content:space-between;align-items:start;gap:var(--space-12);margin-bottom:var(--space-12)}.footer-brand p{color:var(--gray-400);font-size:var(--font-sm);margin-top:var(--space-2)}.footer-links{display:flex;gap:var(--space-8)}.footer-links a{color:var(--gray-400);text-decoration:none;font-size:var(--font-sm);transition:color var(--transition-base)}.footer-links a:hover{color:var(--white)}.footer-bottom{max-width:var(--max-width);margin:0 auto;text-align:center;padding-top:var(--space-8);border-top:1px solid var(--gray-800)}.footer-bottom p{color:var(--gray-500);font-size:var(--font-sm)}@media (max-width: 1024px){.feature-card-wide{grid-column:span 1}.bot-showcase{grid-template-columns:1fr}}@media (max-width: 768px){.hero-title{font-size:var(--font-4xl)}.metric-grid{grid-template-columns:1fr;max-width:300px}.transform-demo{grid-template-columns:1fr;gap:var(--space-4)}.transform-arrow{transform:rotate(90deg)}.pricing-grid{grid-template-columns:1fr;gap:var(--space-8)}.pricing-featured{transform:none}.cta-buttons{flex-direction:column}.footer-content{flex-direction:column;gap:var(--space-8)}.footer-links{flex-direction:column;gap:var(--space-2)}}.playground-auth{min-height:100vh;display:flex;flex-direction:column;background:var(--gray-50)}.back-link{display:inline-flex;align-items:center;gap:var(--space-2);color:var(--gray-600);text-decoration:none;font-size:var(--font-sm);padding:var(--space-4);transition:color var(--transition-base)}.back-link:hover{color:var(--gray-900)}.auth-container{flex:1;display:flex;align-items:center;justify-content:center;padding:var(--space-4)}.auth-card{background:var(--white);padding:var(--space-8);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);max-width:400px;width:100%}.auth-card h1{font-size:var(--font-2xl);font-weight:700;margin-bottom:var(--space-2)}.auth-card p{color:var(--gray-600);margin-bottom:var(--space-6)}.auth-form{display:flex;flex-direction:column;gap:var(--space-4)}.form-group{display:flex;flex-direction:column;gap:var(--space-2)}.form-group label{font-size:var(--font-sm);font-weight:500;color:var(--gray-700)}.form-group input{padding:var(--space-3);border:1px solid var(--gray-300);border-radius:var(--radius-md);font-size:var(--font-base);transition:all var(--transition-base)}.form-group input:focus{outline:none;border-color:var(--brand-blue);box-shadow:0 0 0 3px #0066ff1a}.error-message{background:#ef44441a;color:#dc2626;padding:var(--space-3);border-radius:var(--radius-md);font-size:var(--font-sm)}.auth-help{text-align:center;margin-top:var(--space-6);padding-top:var(--space-6);border-top:1px solid var(--gray-200)}.auth-help p{font-size:var(--font-sm);color:var(--gray-600);margin:0}.auth-help a{color:var(--brand-blue);text-decoration:none}.auth-help a:hover{text-decoration:underline}.playground-app{height:100vh;display:flex;flex-direction:column;background:var(--gray-50)}.playground-header{background:var(--white);border-bottom:1px solid var(--gray-200);padding:var(--space-4) var(--space-6);display:flex;justify-content:space-between;align-items:center;box-shadow:0 1px 3px #0000000d}.header-left{display:flex;align-items:center;gap:var(--space-8)}.tenant-info{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-3) var(--space-4);background:var(--gray-50);border-radius:var(--radius-lg);border:1px solid var(--gray-200)}.tenant-name{font-weight:600;color:var(--gray-900);font-size:var(--font-sm)}.user-id{color:var(--gray-500);font-size:var(--font-xs);padding-left:var(--space-3);border-left:1px solid var(--gray-300)}.playground-header .back-link{padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);transition:all var(--transition-base);font-weight:500}.playground-header .back-link:hover{background:var(--gray-100)}.playground-content{flex:1;display:flex;overflow:hidden}.notes-sidebar{width:320px;background:linear-gradient(180deg,var(--white) 0%,var(--gray-50) 100%);border-right:1px solid var(--gray-200);display:flex;flex-direction:column;box-shadow:inset -1px 0 #0066ff1a}.sidebar-header{padding:var(--space-6);border-bottom:1px solid var(--gray-200);display:flex;justify-content:space-between;align-items:center;background:var(--white);position:relative}.sidebar-header:after{content:"";position:absolute;bottom:0;left:var(--space-6);right:var(--space-6);height:1px;background:var(--brand-gradient);opacity:.3}.sidebar-header h2{font-size:var(--font-lg);font-weight:700;margin:0;color:var(--gray-900);letter-spacing:-.02em;display:flex;align-items:center;gap:var(--space-2)}.sidebar-header h2:before{content:"";display:none}.notes-list{flex:1;overflow-y:auto;padding:var(--space-4);background:transparent}.note-item{padding:var(--space-4);margin-bottom:var(--space-3);background:var(--white);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-base);border:1px solid var(--gray-200);box-shadow:var(--shadow-sm);position:relative;overflow:hidden}.note-item:hover{background:var(--white);border-color:var(--brand-blue);transform:translate(2px);box-shadow:var(--shadow-md)}.note-item:hover:before{opacity:1}.note-item:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--brand-gradient);opacity:0;transition:opacity var(--transition-base)}.note-item.selected{background:var(--white);border-color:var(--brand-blue);box-shadow:var(--shadow-md);transform:translate(4px)}.note-item.selected:before{opacity:1}.note-item h3{font-size:var(--font-base);font-weight:600;margin-bottom:var(--space-2);color:var(--gray-900);letter-spacing:-.01em}.note-item p{font-size:var(--font-sm);color:var(--gray-600);margin:0 0 var(--space-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.5}.note-date{font-size:var(--font-xs);color:var(--gray-400);font-weight:500;text-transform:uppercase;letter-spacing:.05em}.empty-state{padding:var(--space-12);text-align:center;color:var(--gray-500);background:linear-gradient(135deg,var(--gray-50) 0%,var(--white) 100%);border-radius:var(--radius-lg);margin:var(--space-4);border:1px dashed var(--gray-300);position:relative}.empty-state:before{content:"";display:none}.empty-state p{font-size:var(--font-base);font-weight:500;margin:0;color:var(--gray-600)}.note-editor{flex:1;display:flex;flex-direction:column;overflow:hidden;background:var(--white);margin:var(--space-4);border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);border:1px solid var(--gray-200);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.editor-header{display:flex;justify-content:space-between;align-items:center;padding:var(--space-6) var(--space-8);border-bottom:1px solid var(--gray-200);background:linear-gradient(135deg,var(--white) 0%,var(--gray-50) 100%);border-radius:var(--radius-xl) var(--radius-xl) 0 0;position:relative;overflow:hidden}.editor-header h2{font-size:var(--font-xl);font-weight:700;margin:0;color:var(--gray-900);letter-spacing:-.02em;display:flex;align-items:center;gap:var(--space-2)}.editor-header h2:before{content:"";display:none}.editor-header:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--brand-gradient);opacity:.8}.note-content-display{flex:1;padding:var(--space-8);overflow-y:auto;background:var(--white);border-bottom:1px solid var(--gray-200);position:relative}.note-content-display:before{content:"";position:absolute;top:0;left:0;width:4px;height:100%;background:var(--brand-gradient);opacity:.3}.note-content-display pre{margin:0;white-space:pre-wrap;font-family:Inter,sans-serif;line-height:1.8;color:var(--gray-700);font-size:var(--font-base);padding-left:var(--space-4);min-height:200px}.markdown-content{padding-left:var(--space-4);min-height:200px;font-family:var(--font-sans);line-height:var(--leading-loose);color:var(--gray-700);font-size:var(--font-base)}.markdown-content>*:first-child{margin-top:0!important}.markdown-content h1,.markdown-content h2,.markdown-content h3,.markdown-content h4,.markdown-content h5,.markdown-content h6{color:var(--gray-900);font-weight:600;margin-top:var(--space-6);margin-bottom:var(--space-3);line-height:1.3}.markdown-content h1{font-size:var(--font-2xl);border-bottom:2px solid var(--gray-200);padding-bottom:var(--space-2)}.markdown-content h2{font-size:var(--font-xl);border-bottom:1px solid var(--gray-200);padding-bottom:var(--space-1)}.markdown-content h3{font-size:var(--font-lg)}.markdown-content p{margin-bottom:var(--space-4);color:var(--gray-700)}.markdown-content ul,.markdown-content ol{margin-bottom:var(--space-4);padding-left:var(--space-6)}.markdown-content li{margin-bottom:var(--space-2);color:var(--gray-700)}.markdown-content blockquote{border-left:4px solid var(--brand-blue);padding-left:var(--space-4);margin:var(--space-4) 0;background:var(--gray-50);padding:var(--space-4);border-radius:var(--radius-md);font-style:italic;color:var(--gray-600)}.markdown-content code{background:var(--gray-100);padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);font-family:var(--font-mono);font-size:var(--font-sm);color:var(--gray-800)}.markdown-content pre{background:var(--gray-900);color:var(--gray-200);padding:var(--space-4);border-radius:var(--radius-md);overflow-x:auto;margin:var(--space-4) 0;font-family:var(--font-mono);font-size:var(--font-sm);line-height:1.6}.markdown-content pre code{background:transparent;padding:0;color:inherit}.markdown-content a{color:var(--brand-blue);text-decoration:none;border-bottom:1px solid transparent;transition:border-color var(--transition-base)}.markdown-content a:hover{border-bottom-color:var(--brand-blue)}.markdown-content table{width:100%;border-collapse:collapse;margin:var(--space-4) 0;border:1px solid var(--gray-200);border-radius:var(--radius-md);overflow:hidden}.markdown-content th,.markdown-content td{padding:var(--space-3);text-align:left;border-bottom:1px solid var(--gray-200)}.markdown-content th{background:var(--gray-50);font-weight:600;color:var(--gray-900)}.markdown-content hr{border:none;height:1px;background:var(--gray-200);margin:var(--space-8) 0}.ai-controls{padding:var(--space-6) var(--space-8);background:linear-gradient(135deg,var(--gray-50) 0%,var(--white) 100%);border-radius:0 0 var(--radius-xl) var(--radius-xl);border-top:1px solid var(--gray-200);position:relative}.ai-controls:before{content:"";position:absolute;top:0;left:var(--space-8);right:var(--space-8);height:1px;background:var(--brand-gradient);opacity:.2}.ai-controls h3{font-size:var(--font-base);font-weight:600;margin-bottom:var(--space-4);color:var(--gray-900);display:flex;align-items:center;gap:var(--space-2)}.ai-controls h3:before{content:"";display:none}.message-input{display:flex;gap:var(--space-3);margin-bottom:var(--space-4);align-items:stretch}.message-input input{flex:1;padding:var(--space-4);border:1px solid var(--gray-300);border-radius:var(--radius-lg);font-size:var(--font-sm);transition:all var(--transition-base);background:var(--white);box-shadow:inset 0 1px 2px #0000000d}.message-input .btn{flex:0 0 auto;width:auto!important;white-space:nowrap}.message-input input:focus{outline:none;border-color:var(--brand-blue);box-shadow:0 0 0 3px #0066ff1a}.message-input input::placeholder{color:var(--gray-400)}.ai-actions{display:flex;gap:var(--space-3);flex-wrap:wrap}.ai-actions .btn{flex:0 0 auto;width:auto!important;padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);font-size:var(--font-sm);font-weight:500;transition:all var(--transition-base);white-space:nowrap}.ai-actions .btn:not(:disabled):hover{transform:translateY(-1px);box-shadow:var(--shadow-sm)}.playground-app .btn{width:auto!important}.empty-editor{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:var(--gray-500);text-align:center;padding:var(--space-8)}.empty-editor:before{content:"";display:none}.empty-editor p{font-size:var(--font-lg);font-weight:500;margin:0;color:var(--gray-600);opacity:.8}.btn-small{padding:var(--space-2) var(--space-3);font-size:var(--font-sm)}.btn-danger{background:var(--white);color:#ef4444;border:2px solid #ef4444;font-weight:500}.btn-danger:hover{background:#ef4444;color:var(--white);transform:translateY(-2px);box-shadow:var(--shadow-md)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn:disabled:hover{transform:none}@media (max-width: 768px){.playground-content{flex-direction:column}.notes-sidebar{width:100%;height:200px;border-right:none;border-bottom:1px solid var(--gray-200)}.note-editor{margin:var(--space-2)}}@media print{.nav,.grid-overlay,.cta-section,.footer{display:none}body{color:#000}.feature-card,.pricing-card{break-inside:avoid}}.blog-container{min-height:100vh;background:var(--bg-primary)}.reading-progress{position:fixed;top:60px;left:0;width:100%;height:3px;background:var(--gray-200);z-index:var(--z-sticky);transition:opacity var(--transition-base)}.reading-progress-bar{height:100%;background:var(--brand-gradient);width:0%;transition:width 50ms ease-out;box-shadow:0 0 10px #0066ff80}.focus-mode{overflow:hidden}.focus-mode .nav,.focus-mode .footer,.focus-mode .blog-back-link{opacity:.2;transition:opacity var(--transition-slow)}.focus-mode .nav:hover,.focus-mode .footer:hover,.focus-mode .blog-back-link:hover{opacity:1}.focus-mode-toggle{position:fixed;bottom:var(--space-8);right:var(--space-8);background:var(--white);border:1px solid var(--gray-300);border-radius:var(--radius-full);width:48px;height:48px;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:var(--shadow-lg);transition:all var(--transition-base);z-index:var(--z-sticky)}.focus-mode-toggle:hover{transform:translateY(-2px);box-shadow:var(--shadow-xl);border-color:var(--brand-blue)}.focus-mode-toggle svg{width:20px;height:20px;color:var(--gray-600);transition:color var(--transition-base)}.focus-mode-toggle:hover svg{color:var(--brand-blue)}.focus-mode .focus-mode-toggle{background:var(--gray-900);border-color:var(--gray-900)}.focus-mode .focus-mode-toggle svg{color:var(--white)}.bookmark-button{position:absolute;top:var(--space-4);right:var(--space-4);background:var(--white);border:1px solid var(--gray-300);border-radius:var(--radius-md);padding:var(--space-2);cursor:pointer;transition:all var(--transition-base);opacity:0}.blog-card:hover .bookmark-button{opacity:1}.bookmark-button:hover{border-color:var(--brand-blue);background:#0066ff0d;transform:scale(1.1)}.bookmark-button svg{width:16px;height:16px;color:var(--gray-500);transition:all var(--transition-base)}.bookmark-button.bookmarked svg{color:var(--brand-blue);fill:var(--brand-blue)}.bookmark-button.bookmarked{animation:bookmarkPulse .3s ease-out}@keyframes bookmarkPulse{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}.scroll-to-top{position:fixed;bottom:var(--space-8);right:var(--space-8);background:var(--white);border:1px solid var(--gray-300);border-radius:var(--radius-full);width:48px;height:48px;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:var(--shadow-lg);transition:all var(--transition-base);opacity:0;transform:translateY(20px);pointer-events:none;z-index:var(--z-sticky)}.scroll-to-top.visible{opacity:1;transform:translateY(0);pointer-events:all}.scroll-to-top:hover{transform:translateY(-2px);box-shadow:var(--shadow-xl);border-color:var(--brand-blue)}.scroll-to-top svg{width:20px;height:20px;color:var(--gray-600);transition:color var(--transition-base)}.scroll-to-top:hover svg{color:var(--brand-blue)}.blog-hero{padding:var(--space-20) var(--space-6) var(--space-16);background:linear-gradient(135deg,var(--gray-50) 0%,var(--white) 100%);border-bottom:1px solid var(--gray-200)}.blog-title{font-size:var(--font-5xl);font-weight:700;letter-spacing:-.02em;margin-bottom:var(--space-4);color:var(--gray-900)}.blog-subtitle{font-size:var(--font-xl);color:var(--gray-600);margin:0}.blog-list{padding:var(--space-16) var(--space-6)}.blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(400px,1fr));gap:var(--space-8);max-width:var(--max-width);margin:0 auto}.blog-card{background:var(--white);border-radius:var(--radius-xl);border:1px solid var(--gray-200);transition:all var(--transition-slow) cubic-bezier(.4,0,.2,1);overflow:hidden;position:relative;transform-style:preserve-3d}.blog-card:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 0%,rgba(0,102,255,.02) 100%);opacity:0;transition:opacity var(--transition-base);pointer-events:none}.blog-card:hover:before{opacity:1}.blog-card:hover{transform:translateY(-8px) rotateX(2deg);box-shadow:0 30px 60px -15px #0000001a,0 10px 40px -10px #0066ff26;border-color:#0066ff4d}.blog-card{animation:fadeInUp .6s ease-out backwards}.blog-card:nth-child(1){animation-delay:0ms}.blog-card:nth-child(2){animation-delay:.1s}.blog-card:nth-child(3){animation-delay:.2s}.blog-card:nth-child(4){animation-delay:.3s}.blog-card:nth-child(5){animation-delay:.4s}.blog-card:nth-child(6){animation-delay:.5s}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.blog-card-link{display:block;text-decoration:none;color:inherit}.blog-card-content{padding:var(--space-8)}.blog-card-meta{display:flex;align-items:center;gap:var(--space-2);font-size:var(--font-sm);color:var(--gray-500);margin-bottom:var(--space-3)}.blog-card-divider{color:var(--gray-300)}.blog-card-title{font-size:var(--font-2xl);font-weight:700;color:var(--gray-900);margin-bottom:var(--space-3);letter-spacing:-.01em;line-height:1.3}.blog-card-excerpt{font-size:var(--font-base);color:var(--gray-600);line-height:1.6;margin-bottom:var(--space-4)}.blog-card-cta{font-size:var(--font-sm);font-weight:600;color:var(--brand-blue);display:inline-flex;align-items:center;gap:var(--space-1);transition:all var(--transition-base);position:relative}.blog-card-cta:after{content:"→";position:absolute;right:-20px;opacity:0;transition:all var(--transition-base)}.blog-card:hover .blog-card-cta{gap:var(--space-2);padding-right:20px}.blog-card:hover .blog-card-cta:after{right:0;opacity:1}.blog-post-container{min-height:100vh;background:var(--bg-primary);padding:var(--space-8) var(--space-6)}.blog-post-container .container{max-width:800px;margin:0 auto}.blog-back-link{display:inline-flex;align-items:center;gap:var(--space-2);color:var(--gray-600);text-decoration:none;font-size:var(--font-sm);font-weight:500;padding:var(--space-2) var(--space-3);margin-bottom:var(--space-8);border-radius:var(--radius-md);transition:all var(--transition-base)}.blog-back-link:hover{color:var(--gray-900);background:var(--gray-100)}.blog-post{background:var(--white);border-radius:var(--radius-xl);padding:var(--space-12);box-shadow:var(--shadow-lg);border:1px solid var(--gray-200)}.blog-post-loading,.blog-post-error{text-align:center;padding:var(--space-16)}.blog-post-error h1{font-size:var(--font-3xl);color:var(--gray-900);margin-bottom:var(--space-6)}.blog-post{max-width:var(--reading-width-normal);margin-left:auto;margin-right:auto}.blog-post-title{font-size:clamp(var(--font-3xl),4vw,var(--font-5xl));font-weight:var(--font-bold);color:var(--gray-900);margin-bottom:var(--space-8);letter-spacing:var(--tracking-tight);line-height:var(--leading-tight);font-family:var(--font-sans);animation:fadeInDown .6s ease-out}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.table-of-contents{position:sticky;top:100px;max-height:calc(100vh - 140px);overflow-y:auto;padding:var(--space-4);background:var(--gray-50);border-radius:var(--radius-lg);border:1px solid var(--gray-200);margin-bottom:var(--space-8)}.toc-title{font-size:var(--font-sm);font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--gray-600);margin-bottom:var(--space-3)}.toc-list{list-style:none;padding:0;margin:0}.toc-item{margin-bottom:var(--space-2)}.toc-link{color:var(--gray-600);text-decoration:none;font-size:var(--font-sm);display:block;padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);transition:all var(--transition-base);position:relative;padding-left:calc(var(--space-2) + var(--toc-indent, 0px))}.toc-link:hover{color:var(--gray-900);background:var(--gray-100)}.toc-link.active{color:var(--brand-blue);background:#0066ff1a;font-weight:500}.toc-link.active:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--brand-blue);border-radius:var(--radius-sm)}::selection{background:#06f3;color:var(--gray-900)}::-webkit-scrollbar{width:12px;height:12px}::-webkit-scrollbar-track{background:var(--gray-100)}::-webkit-scrollbar-thumb{background:var(--gray-400);border-radius:var(--radius-full);border:3px solid var(--gray-100);transition:background var(--transition-base)}::-webkit-scrollbar-thumb:hover{background:var(--gray-500)}:focus-visible{outline:2px solid var(--brand-blue);outline-offset:2px;border-radius:var(--radius-sm)}.heading-anchor{position:relative}.heading-anchor-link{position:absolute;left:-1.5em;top:50%;transform:translateY(-50%);color:var(--gray-400);text-decoration:none;opacity:0;transition:opacity var(--transition-base)}.heading-anchor:hover .heading-anchor-link{opacity:1}.heading-anchor-link:hover{color:var(--brand-blue)}.blog-post-heading{font-size:clamp(var(--font-xl),2.5vw,var(--font-3xl));font-weight:var(--font-semibold);color:var(--gray-900);margin-top:var(--space-16);margin-bottom:var(--space-6);letter-spacing:var(--tracking-tight);line-height:var(--leading-snug);position:relative;padding-top:var(--space-4)}.blog-post-subheading{font-size:clamp(var(--font-lg),2vw,var(--font-xl));font-weight:var(--font-semibold);color:var(--gray-800);margin-top:var(--space-12);margin-bottom:var(--space-4);letter-spacing:var(--tracking-normal);line-height:var(--leading-snug)}.blog-post-paragraph{font-size:var(--font-base);line-height:var(--leading-loose);color:var(--gray-700);margin-bottom:var(--paragraph-spacing-normal);font-family:var(--font-sans);letter-spacing:var(--tracking-normal);hyphens:auto;-webkit-hyphens:auto;-moz-hyphens:auto;text-rendering:optimizeLegibility}.blog-post-paragraph:first-of-type{font-size:var(--font-lg);color:var(--gray-600);line-height:var(--leading-relaxed)}.blog-post-paragraph:first-of-type:first-letter{float:left;font-size:3.5em;line-height:.8;font-weight:var(--font-bold);margin-right:.05em;margin-top:.1em;color:var(--brand-blue)}.blog-post-meta{display:flex;align-items:center;gap:var(--space-4);color:var(--gray-500);font-size:var(--font-sm);font-weight:var(--font-medium);letter-spacing:var(--tracking-wide);text-transform:uppercase;margin-bottom:var(--space-6);padding-bottom:var(--space-6);border-bottom:1px solid var(--gray-200)}.blog-post-meta time{font-weight:var(--font-normal)}.blog-link{color:var(--brand-blue);text-decoration:none;position:relative;display:inline-block;transition:color var(--transition-base)}.blog-link:after{content:"";position:absolute;bottom:-1px;left:0;width:0;height:2px;background:var(--brand-blue);transition:width var(--transition-base) cubic-bezier(.4,0,.2,1)}.blog-link:hover:after{width:100%}.blog-link:hover{color:var(--brand-blue-dark)}.blog-link[target=_blank]:before{content:"↗";position:absolute;top:-.5em;right:-1em;font-size:.8em;opacity:0;transition:all var(--transition-base)}.blog-link[target=_blank]:hover:before{opacity:1;transform:translate(2px,-2px)}.blog-list{margin:var(--paragraph-spacing-normal) 0;padding-left:var(--space-8)}.blog-list-ordered{list-style-type:decimal}.blog-list-unordered{list-style-type:none;position:relative}.blog-list-item{margin-bottom:var(--space-3);line-height:var(--leading-relaxed);font-size:var(--font-base);color:var(--gray-700);position:relative}.blog-list-unordered .blog-list-item:before{content:"•";position:absolute;left:-1.5em;color:var(--brand-blue);font-weight:var(--font-bold)}.blog-blockquote{border-left:3px solid var(--brand-blue);padding:var(--space-6) var(--space-8);margin:var(--space-12) var(--space-4);background:linear-gradient(135deg,var(--gray-50) 0%,rgba(0,102,255,.02) 100%);border-radius:var(--radius-md);font-style:italic;color:var(--gray-600);font-size:var(--font-base);line-height:var(--leading-relaxed);position:relative}.blog-blockquote:before{content:'"';position:absolute;top:-10px;left:20px;font-size:4em;color:var(--brand-blue);opacity:.1;font-family:var(--font-serif)}.blog-blockquote p{margin:0}.blog-code-block{margin:var(--space-6) 0;border-radius:var(--radius-lg);overflow:hidden;background:var(--gray-900);box-shadow:var(--shadow-lg);position:relative;transition:all var(--transition-base)}.blog-code-block:hover{box-shadow:var(--shadow-xl);transform:translateY(-2px)}.code-copy-button{position:absolute;top:var(--space-2);right:var(--space-2);background:var(--gray-700);border:1px solid var(--gray-600);border-radius:var(--radius-md);padding:var(--space-2);cursor:pointer;opacity:0;transition:all var(--transition-base);z-index:1}.blog-code-block:hover .code-copy-button{opacity:1}.code-copy-button:hover{background:var(--gray-600);transform:scale(1.05)}.code-copy-button svg{width:16px;height:16px;color:var(--gray-300)}.code-copy-button.copied{background:var(--brand-green);border-color:var(--brand-green);animation:copySuccess .3s ease-out}.code-copy-button.copied svg{color:var(--white)}@keyframes copySuccess{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}.blog-code-block.expandable{max-height:400px;overflow:hidden}.blog-code-block.expanded{max-height:none}.code-expand-button{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to bottom,transparent 0%,var(--gray-900) 100%);padding:var(--space-8) var(--space-4) var(--space-4);text-align:center;cursor:pointer}.code-expand-button button{background:var(--gray-800);border:1px solid var(--gray-700);color:var(--gray-300);padding:var(--space-2) var(--space-4);border-radius:var(--radius-md);font-size:var(--font-sm);cursor:pointer;transition:all var(--transition-base)}.code-expand-button button:hover{background:var(--gray-700);color:var(--white);transform:translateY(-1px)}.blog-code-header{background:#16161e;color:var(--gray-400);padding:var(--space-3) var(--space-6);font-size:var(--font-xs);font-weight:var(--font-medium);text-transform:uppercase;letter-spacing:var(--tracking-wider);font-family:var(--font-mono);display:flex;justify-content:space-between;align-items:center}.blog-code-block pre{margin:0;padding:var(--space-6);overflow-x:auto;background:#1a1b26;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.1) transparent}.blog-code-block pre::-webkit-scrollbar{height:8px}.blog-code-block pre::-webkit-scrollbar-track{background:transparent}.blog-code-block pre::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:4px}.blog-code-block code{color:#a9b1d6;font-family:var(--font-mono);font-size:var(--font-sm);line-height:var(--leading-relaxed);font-weight:var(--font-normal);font-variant-ligatures:none;-webkit-font-feature-settings:"liga" 0;font-feature-settings:"liga" 0}.blog-inline-code{background:#0066ff14;padding:.125em .375em;border-radius:var(--radius-sm);font-family:var(--font-mono);font-size:.875em;color:var(--brand-blue-dark);font-weight:var(--font-medium);white-space:nowrap;border:1px solid rgba(0,102,255,.1)}.blog-divider{border:none;height:1px;background:linear-gradient(90deg,transparent,var(--gray-200) 20%,var(--gray-200) 80%,transparent);margin:var(--space-16) auto;width:50%;position:relative}.blog-divider:after{content:"• • •";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--white);padding:0 var(--space-4);color:var(--gray-300);font-size:var(--font-lg);letter-spacing:var(--tracking-widest)}.blog-image-wrapper{margin:var(--space-8) 0;border-radius:var(--radius-lg);overflow:hidden;position:relative;cursor:zoom-in;transition:all var(--transition-base)}.blog-image-wrapper:hover{box-shadow:var(--shadow-xl);transform:scale(1.02)}.blog-image{width:100%;height:auto;display:block;transition:all var(--transition-slow)}.blog-image-wrapper.loading{background:var(--gray-100);min-height:200px}.blog-image-wrapper.loading .blog-image{filter:blur(20px);transform:scale(1.1)}.blog-image-wrapper.loaded .blog-image{filter:blur(0);transform:scale(1)}.image-zoom-modal{position:fixed;inset:0;background:#000000e6;display:flex;align-items:center;justify-content:center;z-index:var(--z-modal);opacity:0;pointer-events:none;transition:opacity var(--transition-base);cursor:zoom-out}.image-zoom-modal.active{opacity:1;pointer-events:all}.image-zoom-modal img{max-width:90%;max-height:90%;object-fit:contain;transform:scale(.9);transition:transform var(--transition-base)}.image-zoom-modal.active img{transform:scale(1)}.keyboard-nav-hint{position:fixed;bottom:var(--space-4);left:var(--space-4);background:var(--gray-900);color:var(--white);padding:var(--space-3) var(--space-4);border-radius:var(--radius-lg);font-size:var(--font-sm);opacity:0;transform:translateY(10px);pointer-events:none;transition:all var(--transition-base);z-index:var(--z-tooltip)}.keyboard-nav-hint.visible{opacity:1;transform:translateY(0)}.keyboard-nav-hint kbd{background:var(--gray-800);padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);margin:0 var(--space-1);font-family:var(--font-mono);font-size:var(--font-xs);border:1px solid var(--gray-700)}.blog-emphasis{font-style:italic;color:var(--gray-800);font-weight:var(--font-medium)}.blog-strong{font-weight:var(--font-semibold);color:var(--gray-900)}.blog-table{width:100%;margin:var(--space-8) 0;font-size:var(--font-sm);border-collapse:collapse;box-shadow:var(--shadow-sm);border-radius:var(--radius-lg);overflow:hidden}.blog-table th{background:var(--gray-50);font-weight:var(--font-semibold);text-align:left;padding:var(--space-4);font-size:var(--font-sm);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--gray-700)}.blog-table td{padding:var(--space-4);border-bottom:1px solid var(--gray-100);font-size:var(--font-sm);color:var(--gray-700)}.blog-caption{font-size:var(--font-sm);color:var(--gray-500);text-align:center;margin-top:var(--space-2);font-style:italic}.blog-pullquote{font-size:var(--font-xl);font-weight:var(--font-light);line-height:var(--leading-relaxed);color:var(--gray-700);text-align:center;margin:var(--space-12) 0;padding:var(--space-8) 0;border-top:1px solid var(--gray-200);border-bottom:1px solid var(--gray-200);font-family:var(--font-serif);letter-spacing:var(--tracking-tight)}@media (max-width: 768px){:root{--font-base: 1rem;--font-lg: 1.125rem;--font-xl: 1.25rem;--font-2xl: 1.5rem;--font-3xl: 1.75rem;--font-4xl: 2rem;--font-5xl: 2.5rem}.blog-grid{grid-template-columns:1fr}.blog-post{padding:var(--space-4);max-width:100%}.blog-post-paragraph{font-size:var(--font-base);line-height:var(--leading-relaxed)}.blog-code-block{margin-left:calc(var(--space-4) * -1);margin-right:calc(var(--space-4) * -1);border-radius:0}.blog-blockquote{margin-left:0;margin-right:0;padding:var(--space-4)}.table-of-contents{position:static;margin-bottom:var(--space-8)}.focus-mode-toggle,.scroll-to-top{width:40px;height:40px;bottom:var(--space-4);right:var(--space-4)}.scroll-to-top{right:calc(var(--space-4) + 48px)}}@media print{body{font-size:12pt;line-height:1.5;color:#000;background:#fff}.blog-post{max-width:100%}.blog-post-title{font-size:24pt;margin-bottom:12pt}.blog-post-heading{font-size:18pt;margin-top:18pt;margin-bottom:6pt}.blog-post-paragraph{font-size:11pt;line-height:1.5;text-align:justify}.blog-code-block{break-inside:avoid;border:1px solid #ddd}}.blog-post-layout{display:grid;grid-template-columns:1fr 280px;gap:var(--space-12);align-items:start;max-width:1200px;margin:0 auto}@media (max-width: 1280px){.blog-post-layout{grid-template-columns:1fr}.blog-post-sidebar{display:none}}.blog-post-sidebar{position:sticky;top:100px;max-height:calc(100vh - 120px);overflow-y:auto}.blog-post-footer{margin-top:var(--space-12);padding-top:var(--space-12);border-top:1px solid var(--gray-200)}:root{--blog-bg: #fafaf9;--blog-text: #0c0a09;--blog-text-secondary: #57534e;--blog-text-muted: #78716c;--blog-accent: #0066ff;--blog-accent-light: #218bff;--blog-ui: #e7e5e4;--blog-ui-hover: #d6d3d1;--blog-ui-light: #f5f5f4;--blog-font-primary: "Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--blog-font-mono: "SF Mono", "Monaco", "Cascadia Code", "Roboto Mono", monospace;--blog-text-xs: .75rem;--blog-text-sm: .875rem;--blog-text-base: 1.125rem;--blog-text-lg: 1.25rem;--blog-text-xl: 1.5rem;--blog-text-2xl: 2rem;--blog-text-3xl: 3rem;--blog-space-1: .5rem;--blog-space-2: .75rem;--blog-space-3: 1rem;--blog-space-4: 1.5rem;--blog-space-5: 2rem;--blog-space-6: 2.5rem;--blog-space-8: 4rem;--blog-content-width: 65ch;--blog-line-height: 1.6;--blog-heading-line-height: 1.2;--blog-transition: .2s ease}.blog-container,.blog-container *{font-family:var(--blog-font-primary);color:var(--blog-text);line-height:var(--blog-line-height)}.blog-container{background:var(--blog-bg);min-height:100vh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.blog-layout{max-width:var(--blog-content-width);margin:0 auto;padding:var(--blog-space-3) var(--blog-space-1)}@media (min-width: 768px){.blog-layout{padding:var(--blog-space-4) var(--blog-space-2)}}@media (min-width: 1024px){.blog-layout{padding:var(--blog-space-5) var(--blog-space-1)}}.blog-layout--has-sidebar{max-width:var(--blog-content-width);margin:0 auto}.blog-toc,.blog-annotations,.table-of-contents{display:none}.blog-back-link{display:inline-flex;align-items:center;gap:var(--blog-space-1);color:var(--blog-text-secondary);text-decoration:none;font-size:var(--blog-text-sm);font-weight:600;margin-bottom:var(--blog-space-4);transition:color var(--blog-transition)}.blog-back-link:hover{color:var(--blog-accent);transform:translate(-2px)}.blog-list{max-width:var(--blog-content-width);margin:0 auto;padding:var(--blog-space-4) var(--blog-space-1)}.blog-list__header{margin-bottom:var(--blog-space-8)}.blog-list__title{font-size:var(--blog-text-3xl);font-weight:700;color:var(--blog-accent);margin-bottom:var(--blog-space-2);letter-spacing:-.02em}.blog-list__subtitle{font-size:var(--blog-text-base);color:var(--blog-text-secondary);font-weight:600}.blog-list__grid{display:grid;gap:var(--blog-space-6)}.blog-card,.article-card{border:none;background:transparent;border-radius:0;box-shadow:none;padding:0;margin:0;transition:none;position:relative}.blog-card:hover,.article-card:hover{transform:none;box-shadow:none;border-color:transparent}.blog-card-link,.article-card-link{display:block;padding:var(--blog-space-4) 0;text-decoration:none;color:inherit;border-bottom:1px solid var(--blog-ui);transition:border-color var(--blog-transition)}.blog-card-link:hover,.article-card-link:hover{border-bottom-color:var(--blog-accent)}.article-accent,.article-number,.article-pattern,.blog-card-gradient,.blog-card:before{display:none}.blog-card-content,.article-content{padding:0}.blog-card-meta,.article-meta{display:flex;align-items:center;gap:var(--blog-space-2);margin-bottom:var(--blog-space-2)}.blog-card-date,.article-date,.blog-card-read-time,.article-read-time{font-size:var(--blog-text-sm);color:var(--blog-text-secondary);font-weight:600}.blog-card-title,.article-title{font-size:var(--blog-text-xl);font-weight:700;color:var(--blog-text);margin-bottom:var(--blog-space-2);line-height:var(--blog-heading-line-height);transition:color var(--blog-transition)}.blog-card-link:hover .blog-card-title,.article-card-link:hover .article-title{color:var(--blog-accent)}.blog-card-excerpt,.article-excerpt{font-size:var(--blog-text-base);color:var(--blog-text-secondary);line-height:var(--blog-line-height);margin:0}.blog-card-cta,.article-cta,.blog-card-footer{display:none}.blog-content{max-width:var(--blog-content-width);margin:0 auto;padding:0}.blog-post,.blog-article{background:transparent;border:none;border-radius:0;box-shadow:none;padding:0;margin:0}.blog-post-title,.blog-content h1{font-size:var(--blog-text-3xl);font-weight:700;color:var(--blog-accent);margin:var(--blog-space-6) 0 var(--blog-space-4) 0;line-height:var(--blog-heading-line-height);letter-spacing:-.02em}.blog-post-heading,.blog-content h2{font-size:var(--blog-text-2xl);font-weight:700;color:var(--blog-text);margin:var(--blog-space-6) 0 var(--blog-space-3) 0;line-height:var(--blog-heading-line-height);letter-spacing:-.01em}.blog-post-subheading,.blog-content h3{font-size:var(--blog-text-lg);font-weight:600;color:var(--blog-text);margin:var(--blog-space-5) 0 var(--blog-space-2) 0;line-height:var(--blog-heading-line-height)}.blog-content h1:before,.blog-content h2:before,.blog-post-heading:before{display:none}.blog-post-paragraph,.blog-content p{font-size:var(--blog-text-base);line-height:var(--blog-line-height);color:var(--blog-text);margin-bottom:var(--blog-space-4);-webkit-hyphens:auto;hyphens:auto}.blog-content>p:first-of-type:first-letter,.blog-post-paragraph:first-of-type:first-letter{float:none;font-size:inherit;font-weight:inherit;margin:0;color:inherit}.blog-link,.blog-content a{color:var(--blog-accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px;font-weight:inherit;transition:color var(--blog-transition)}.blog-link:hover,.blog-content a:hover{color:var(--blog-accent-light)}.blog-content a:after,.blog-link:after{display:none}.blog-list,.blog-content ul,.blog-content ol{margin:var(--blog-space-4) 0;padding-left:var(--blog-space-4)}.blog-list-item,.blog-content li{margin-bottom:var(--blog-space-1);line-height:var(--blog-line-height);color:var(--blog-text)}.blog-content ul li::marker{color:var(--blog-accent)}.blog-blockquote,.blog-content blockquote{border-left:2px solid var(--blog-accent);padding-left:var(--blog-space-4);margin:var(--blog-space-5) 0;font-style:italic;color:var(--blog-text-secondary);background:none;border-radius:0}.blog-blockquote:before,.blog-content blockquote:before{display:none}.blog-inline-code,.blog-content code{background:var(--blog-ui);color:var(--blog-accent);padding:.2em .4em;border-radius:4px;font-family:var(--blog-font-mono);font-size:.9em;border:none}.blog-code-block,.blog-content pre{background:var(--blog-ui);border-radius:4px;padding:var(--blog-space-3);margin:var(--blog-space-4) 0;overflow-x:auto;border:none;box-shadow:none}.blog-code-block code,.blog-content pre code{background:transparent;color:var(--blog-text);padding:0;font-family:var(--blog-font-mono);font-size:var(--blog-text-sm);line-height:var(--blog-line-height)}.blog-code-header,.code-window-header,.code-copy-button{display:none}.blog-post-meta{font-size:var(--blog-text-sm);color:var(--blog-text-secondary);font-weight:600;margin-bottom:var(--blog-space-4);padding-bottom:var(--blog-space-3);border-bottom:1px solid var(--blog-ui)}.author-bio,.related-posts,.newsletter-signup,.highlight-section,.blog-fab,.blog-fab-container,.progress-bar,.reading-progress,.mobile-toc,.tag-cloud,.tag-badge,.quote-block,.code-block-container,.share-buttons,.bookmark-button,.focus-mode-toggle{display:none}@media (max-width: 768px){:root{--blog-text-3xl: 2rem;--blog-text-2xl: 1.5rem;--blog-space-4: 1rem;--blog-space-6: 1.5rem}.blog-layout{padding:var(--blog-space-2) 4px}.blog-list{padding:var(--blog-space-3) 4px}}.blog-container .grid-overlay{display:none}.blog-container *{transform:none!important;animation:none!important;transition:color var(--blog-transition),border-color var(--blog-transition)!important}.blog-container a{transition:color var(--blog-transition)!important}.blog-container *:before,.blog-container *:after{background:none!important;background-image:none!important}.blog-container a:focus,.blog-container button:focus{outline:2px solid var(--blog-accent);outline-offset:2px}@media print{.blog-container{background:#fff;color:#000}.blog-back-link{display:none}}