@import"https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,700;0,800;0,900;1,700&family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;1,9..40,400&family=JetBrains+Mono:wght@400;500&display=swap";:root{--color-primary: #000000;--color-primary-deep: #1a1a1a;--color-primary-light: #f5f5f5;--color-primary-mid: #e8e8e8;--color-accent: #FDD017;--color-accent-deep: #C8A000;--color-accent-light: #FFF8DC;--color-surface: #FAFAFA;--color-surface-2: #F5F5F5;--color-surface-3: #EBEBEB;--color-white: #FFFFFF;--color-border: #E5E7EB;--color-border-strong: #D4D4D4;--color-text: #000000;--color-text-muted: #6b7280;--color-text-faint: #9ca3af;--color-success: #15803D;--color-success-bg: #F0FDF4;--color-error: #B91C1C;--color-error-bg: #FEF2F2;--color-warning: #92400E;--color-warning-bg: #FFFBEB;--sidebar-bg: #000000;--sidebar-border: #1a1a1a;--sidebar-text: #9ca3af;--sidebar-text-active: #FDD017;--sidebar-active-bg: rgba(253, 208, 23, .12);--sidebar-hover-bg: rgba(255, 255, 255, .05);--sidebar-width: 256px;--font-display: "Playfair Display", Georgia, serif;--font-body: "DM Sans", system-ui, -apple-system, sans-serif;--font-mono: "JetBrains Mono", "Fira Code", monospace;--text-xs: clamp(.7rem, .65rem + .25vw, .75rem);--text-sm: clamp(.8rem, .75rem + .25vw, .875rem);--text-base: clamp(.95rem, .9rem + .25vw, 1rem);--text-lg: clamp(1.05rem, 1rem + .3vw, 1.125rem);--text-xl: clamp(1.15rem, 1.1rem + .4vw, 1.25rem);--text-2xl: clamp(1.3rem, 1.2rem + .6vw, 1.5rem);--text-3xl: clamp(1.5rem, 1.4rem + 1vw, 1.875rem);--text-4xl: clamp(1.8rem, 1.6rem + 1.5vw, 2.25rem);--text-5xl: clamp(2.2rem, 1.8rem + 2.5vw, 3rem);--text-6xl: clamp(2.8rem, 2.2rem + 3.5vw, 3.75rem);--text-7xl: clamp(3.2rem, 2.8rem + 4.5vw, 4.5rem);--radius-sm: 4px;--radius-md: 10px;--radius-lg: 16px;--radius-xl: 24px;--radius-pill: 100px;--radius-card: 16px 4px 16px 4px;--radius-card-alt: 4px 16px 4px 16px;--shadow-xs: 0 1px 2px rgba(0, 0, 0, .06);--shadow-sm: 0 1px 4px rgba(0, 0, 0, .08), 0 1px 2px rgba(0, 0, 0, .04);--shadow-md: 0 4px 16px rgba(0, 0, 0, .1), 0 1px 4px rgba(0, 0, 0, .06);--shadow-lg: 0 12px 40px rgba(0, 0, 0, .12), 0 4px 12px rgba(0, 0, 0, .08);--shadow-card: 0 2px 12px rgba(0, 0, 0, .06), 0 1px 3px rgba(0, 0, 0, .04);--shadow-hover: 0 8px 28px rgba(0, 0, 0, .14), 0 2px 8px rgba(0, 0, 0, .08);--ease-out-expo: cubic-bezier(.19, 1, .22, 1);--ease-in-out: cubic-bezier(.4, 0, .2, 1);--ease-spring: cubic-bezier(.34, 1.56, .64, 1);--duration-fast: .15s;--duration-base: .28s;--duration-slow: .5s}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-body);background-color:var(--color-surface);color:var(--color-text);min-height:100vh;overflow-x:hidden;line-height:1.6}img,video{max-width:100%;display:block}a{color:inherit;text-decoration:none}button,input,select,textarea{font-family:var(--font-body)}.container{max-width:1200px;margin:0 auto;padding:0 2rem}.container-narrow{max-width:760px;margin:0 auto;padding:0 2rem}.flex{display:flex}.flex-col{display:flex;flex-direction:column}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.flex-1{flex:1}.w-full{width:100%}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.gap-12{gap:3rem}.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.mb-12{margin-bottom:3rem}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.p-2{padding:.5rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-5{padding:1.25rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.text-center{text-align:center}.text-muted{color:var(--color-text-muted)}.text-faint{color:var(--color-text-faint)}.font-display{font-family:var(--font-display)}.font-body{font-family:var(--font-body)}.title{font-family:var(--font-display);font-size:var(--text-2xl);font-weight:800;letter-spacing:-.03em;color:var(--color-text)}.section-title{font-family:var(--font-body);font-size:var(--text-xl);font-weight:600;color:var(--color-text)}.subtitle{font-size:var(--text-sm);color:var(--color-text-muted);font-weight:400}.btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--color-primary);color:var(--color-white);border:2px solid transparent;padding:11px 22px;border-radius:var(--radius-md);font-family:var(--font-body);font-size:var(--text-sm);font-weight:600;letter-spacing:.01em;cursor:pointer;transition:background var(--duration-fast) var(--ease-in-out),transform var(--duration-fast) var(--ease-in-out),box-shadow var(--duration-fast) var(--ease-in-out),border-color var(--duration-fast) var(--ease-in-out);box-shadow:0 1px 3px #00000040}.btn-primary:hover:not(:disabled){background:var(--color-primary-deep);border-color:var(--color-accent);transform:translateY(-1px);box-shadow:0 4px 12px #0003}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-primary:disabled{opacity:.55;cursor:not-allowed}.btn-secondary{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--color-white);color:var(--color-text);border:1.5px solid var(--color-border);padding:10px 22px;border-radius:var(--radius-md);font-family:var(--font-body);font-size:var(--text-sm);font-weight:500;cursor:pointer;transition:border-color var(--duration-fast) var(--ease-in-out),background var(--duration-fast) var(--ease-in-out),transform var(--duration-fast) var(--ease-in-out)}.btn-secondary:hover:not(:disabled){background:var(--color-surface-2);border-color:var(--color-border-strong);transform:translateY(-1px)}.btn-ghost{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:transparent;color:var(--color-text-muted);border:none;padding:8px 16px;border-radius:var(--radius-md);font-family:var(--font-body);font-size:var(--text-sm);font-weight:500;cursor:pointer;transition:background var(--duration-fast),color var(--duration-fast)}.btn-ghost:hover{background:var(--color-surface-2);color:var(--color-text)}.input-field{width:100%;background:var(--color-white);border:1.5px solid var(--color-border);color:var(--color-text);padding:10px 14px;border-radius:var(--radius-md);font-family:var(--font-body);font-size:var(--text-base);outline:none;transition:border-color var(--duration-fast) var(--ease-in-out),box-shadow var(--duration-fast) var(--ease-in-out)}.input-field::placeholder{color:var(--color-text-faint)}.input-field:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #fdd01740}.input-field.error{border-color:var(--color-error);box-shadow:0 0 0 3px #b91c1c1a}.form-label{display:block;margin-bottom:6px;color:var(--color-text);font-size:var(--text-sm);font-weight:500}.card{background:var(--color-white);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:box-shadow var(--duration-base) var(--ease-in-out),transform var(--duration-base) var(--ease-in-out)}.card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.card-asymmetric{background:var(--color-white);border:1px solid var(--color-border);border-radius:var(--radius-card);box-shadow:var(--shadow-card)}.glass-panel{background:var(--color-white);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm)}.panel-hover{transition:box-shadow var(--duration-base) var(--ease-in-out),transform var(--duration-base) var(--ease-in-out)}.panel-hover:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.badge{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:var(--radius-pill);font-size:var(--text-xs);font-weight:600;letter-spacing:.03em}.badge-amber{background:var(--color-accent);color:#000}.badge-success{background:var(--color-success-bg);color:var(--color-success)}.badge-error{background:var(--color-error-bg);color:var(--color-error)}.badge-warning{background:var(--color-warning-bg);color:var(--color-warning)}.badge-muted{background:var(--color-surface-3);color:var(--color-text-muted)}.dashboard-layout{display:flex;min-height:100vh}.sidebar{width:var(--sidebar-width);background:var(--sidebar-bg);border-right:1px solid var(--sidebar-border);display:flex;flex-direction:column;position:fixed;top:0;left:0;bottom:0;padding:1.5rem 1rem;z-index:10;overflow-y:auto}.main-content{flex:1;margin-left:var(--sidebar-width);padding:2.5rem 3rem;background-color:var(--color-surface);min-height:100vh}.nav-item{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:var(--radius-md);width:100%;text-align:left;background:transparent;color:var(--sidebar-text);border:none;cursor:pointer;transition:background var(--duration-fast),color var(--duration-fast);font-family:var(--font-body);font-size:var(--text-sm);font-weight:500}.nav-item:hover{background:var(--sidebar-hover-bg);color:#fff}.nav-item.active{background:var(--sidebar-active-bg);color:var(--sidebar-text-active);font-weight:600}.code-block{background:#0a0a0a;padding:1.25rem 1.5rem;border-radius:var(--radius-md);border:1px solid #2a2a2a;position:relative;overflow-x:auto}.code-block code{color:#fdd017;font-family:var(--font-mono);font-size:var(--text-sm);white-space:pre;line-height:1.7}.copy-btn{position:absolute;top:.75rem;right:.75rem;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);color:#c8c3bc;padding:5px 10px;border-radius:var(--radius-sm);cursor:pointer;transition:background var(--duration-fast),color var(--duration-fast);font-size:var(--text-xs);font-family:var(--font-body);display:flex;align-items:center;gap:4px}.copy-btn:hover{background:#ffffff1f;color:#fff}.copy-btn.copied{color:#86efac}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:4rem 2rem;gap:1rem}.empty-state-icon{width:64px;height:64px;background:var(--color-primary-light);border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;margin-bottom:.5rem}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#1c191780;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:none;backdrop-filter:none}.modal-content{width:100%;max-width:520px;padding:2rem;background:var(--color-white);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg)}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}.modal-close{background:transparent;border:none;color:var(--color-text-muted);cursor:pointer;font-size:1.25rem;line-height:1;padding:4px;border-radius:var(--radius-sm);transition:color var(--duration-fast),background var(--duration-fast)}.modal-close:hover{color:var(--color-text);background:var(--color-surface-2)}.drag-drop-area{border:2px dashed var(--color-border);border-radius:var(--radius-lg);padding:3rem 2rem;text-align:center;cursor:pointer;transition:border-color var(--duration-base),background var(--duration-base);background:var(--color-surface)}.drag-drop-area:hover{border-color:var(--color-primary);background:var(--color-primary-light)}.phone-mockup{width:300px;height:560px;background:var(--color-white);border-radius:36px;border:6px solid var(--color-border-strong);position:relative;overflow:hidden;box-shadow:var(--shadow-lg)}.phone-notch{position:absolute;top:0;left:50%;transform:translate(-50%);width:100px;height:22px;background:var(--color-border-strong);border-bottom-left-radius:10px;border-bottom-right-radius:10px;z-index:10}.phone-screen{width:100%;height:100%;background:var(--color-surface);position:relative}.alert{display:flex;align-items:flex-start;gap:10px;padding:12px 16px;border-radius:var(--radius-md);font-size:var(--text-sm);line-height:1.5}.alert-error{background:var(--color-error-bg);color:var(--color-error);border:1px solid rgba(185,28,28,.2)}.alert-success{background:var(--color-success-bg);color:var(--color-success);border:1px solid rgba(21,128,61,.2)}.alert-warning{background:var(--color-warning-bg);color:var(--color-warning);border:1px solid rgba(146,64,14,.2)}.divider{display:flex;align-items:center;gap:1rem;color:var(--color-text-faint);font-size:var(--text-sm)}.divider:before,.divider:after{content:"";flex:1;height:1px;background:var(--color-border)}.reveal{opacity:0;transform:translateY(24px);transition:opacity var(--duration-slow) var(--ease-out-expo),transform var(--duration-slow) var(--ease-out-expo)}.reveal-delay-1{transition-delay:80ms}.reveal-delay-2{transition-delay:.16s}.reveal-delay-3{transition-delay:.24s}.reveal-delay-4{transition-delay:.32s}@keyframes fadeUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}@keyframes bounce3dot{0%,80%,to{transform:translateY(0)}40%{transform:translateY(-6px)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.animate-fade-in{animation:fadeIn .3s var(--ease-out-expo) forwards}.animate-fade-up{animation:fadeUp .5s var(--ease-out-expo) forwards}.animate-spin{animation:spin 1s linear infinite}.animate-pulse{animation:pulse 1.5s ease infinite}.skeleton{background:linear-gradient(90deg,var(--color-surface-2) 25%,var(--color-surface-3) 50%,var(--color-surface-2) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:var(--radius-sm)}@media (max-width: 1024px){.main-content{padding:2rem}}@media (max-width: 768px){.dashboard-layout{flex-direction:column}.sidebar{width:100%;position:relative;border-right:none;border-bottom:1px solid var(--sidebar-border);padding:1rem;flex-direction:row;align-items:center;overflow-x:auto;overflow-y:visible}.main-content{margin-left:0;padding:1.5rem 1rem}.container,.container-narrow{padding:0 1.25rem}}.hidden-mobile{display:flex}@media (max-width: 768px){.hero-grid{text-align:center}}.hero-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:4rem;align-items:center}.nav-link{font-size:.95rem;font-weight:500;transition:color .2s}.nav-link:hover{color:var(--color-text)}.playground-form{display:flex;gap:12px;background:var(--color-surface);border:1.5px solid var(--color-border);border-radius:var(--radius-pill);padding:6px 6px 6px 20px;transition:border-color .2s}.playground-form:focus-within{border-color:var(--color-primary)}@keyframes fadeUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes floatSlow{0%{transform:translateY(0) rotate(0)}50%{transform:translateY(-15px) rotate(1deg)}to{transform:translateY(0) rotate(0)}}@keyframes drawPath{to{stroke-dashoffset:0}}@keyframes pulseRipple{0%{box-shadow:0 0 #fdd01766}70%{box-shadow:0 0 0 15px #fdd01700}to{box-shadow:0 0 #fdd01700}}.animate-float{animation:floatSlow 6s ease-in-out infinite}.animate-draw{stroke-dasharray:1000;stroke-dashoffset:1000;animation:drawPath 2s ease-out forwards}.reveal{opacity:0;transform:translateY(30px);transition:all .8s var(--ease-out-expo)}.reveal.visible{opacity:1;transform:translateY(0)}.reveal-delay-1{transition-delay:.1s}.reveal-delay-2{transition-delay:.2s}.reveal-delay-3{transition-delay:.3s}.text-primary{color:var(--color-primary)}.text-accent{color:var(--color-accent-deep)}.bg-accent{background:var(--color-accent);color:#000}.sidebar-overlay{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:9}@media (max-width: 768px){.sidebar-overlay.open{display:block}.sidebar{position:fixed!important;left:-100%!important;transition:left .3s var(--ease-out-expo);z-index:10!important;width:256px!important;height:100vh!important;flex-direction:column!important;overflow-y:auto!important;overflow-x:hidden!important}.sidebar.open{left:0!important}.mobile-header{display:flex!important}.main-content{margin-left:0!important;padding:1.5rem 1rem!important;padding-top:72px!important}}.mobile-header{display:none;position:fixed;top:0;left:0;right:0;height:60px;background:var(--sidebar-bg);border-bottom:1px solid var(--sidebar-border);z-index:8;align-items:center;padding:0 1rem;justify-content:space-between}.hamburger-btn{background:transparent;border:none;color:#fff;cursor:pointer;padding:8px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;transition:background var(--duration-fast)}.hamburger-btn:hover{background:var(--sidebar-hover-bg)}@media (max-width: 768px){.conversations-grid{grid-template-columns:1fr!important;height:auto!important}.conversations-right-pane{height:70vh}.hero-grid{grid-template-columns:1fr!important;gap:2rem!important}.modal-content{margin:1rem;max-width:calc(100vw - 2rem)}}@media (max-width: 480px){.main-content{padding:1rem .75rem!important;padding-top:72px!important}}.bot-settings-grid{display:grid;grid-template-columns:1fr 380px;gap:2rem;align-items:start}@media (max-width: 1200px){.bot-settings-grid{grid-template-columns:1fr 340px;gap:1.5rem}}@media (max-width: 900px){.bot-settings-grid{grid-template-columns:1fr;gap:1.5rem}}.install-top-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;align-items:start}.install-mid-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:1.5rem;align-items:start}@media (max-width: 960px){.install-top-grid,.install-mid-grid{grid-template-columns:1fr}}.playground-layout{display:grid;grid-template-columns:260px 1fr;gap:1.5rem;align-items:start}.playground-chat{border:1px solid var(--color-border);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;height:calc(100vh - 200px);min-height:500px;background:var(--color-white);box-shadow:var(--shadow-md)}.playground-sidebar-desktop{display:flex;flex-direction:column;gap:1rem;position:sticky;top:1rem}.playground-mobile-bar{display:none}@media (max-width: 900px){.playground-layout{grid-template-columns:1fr;gap:.75rem}.playground-chat{height:calc(100dvh - 220px);min-height:420px}.playground-sidebar-desktop{display:none}.playground-mobile-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 14px;background:#fffbdc;border:1.5px solid #FDD017;border-radius:10px;width:100%}}@media (max-width: 600px){.install-code-block{font-size:.72rem!important}.install-checklist-grid{grid-template-columns:1fr!important}}.profile-layout{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;align-items:start}@media (max-width: 900px){.profile-layout{grid-template-columns:1fr}}