@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&display=swap";
:root{--bg-deep:#f9ede0;--bg-panel:#ede8e1;--bg-sidebar:#e8e2da;--bg-input:#fff3;--border-color:#0a0a0a1f;--neon-cyan:#2a6b5e;--neon-purple:#6b4a8a;--neon-green:#3d7a4a;--text-main:#0a0a0a;--text-muted:#6b6b6b;--sidebar-width:64px;--frame-border-color:#d1c9be}*{box-sizing:border-box;margin:0;padding:0;font-family:Outfit,sans-serif}body{background:var(--bg-deep);color:var(--text-main);height:100vh;display:flex;position:relative;overflow:hidden}body:after{content:"";pointer-events:none;z-index:99999;border-top:6px solid var(--frame-border-color);border-bottom:6px solid var(--frame-border-color);position:fixed;inset:0;box-shadow:inset 0 8px 24px #0a0a0a1f,inset 0 -8px 24px #0a0a0a1f}body:before{content:"";pointer-events:none;z-index:9999;opacity:.03;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");position:fixed;inset:0}::selection{color:#fbf2e8;background:#0a0a0a}:focus-visible{outline-offset:3px;outline:2px solid #0a0a0a}html,body{height:100%;margin:0;overflow:hidden}.app-container{opacity:0;pointer-events:none;width:100%;height:100vh;padding-left:70px;transition:opacity .5s,padding-left .4s cubic-bezier(.4,0,.2,1);display:block;overflow:hidden}.app-container.active{opacity:1;pointer-events:all}.sidebar-icon-only{position:relative;background:linear-gradient(160deg,#fbf6ec 0%,#f5e8d0 60%,#eddab9 100%)!important;border-right:1px solid #8a7e6c33!important;box-shadow:inset -1px 0 #ffffffb3,inset 1px 0 4px #fff9,inset -2px 0 10px #e6d2b466,2px 0 16px #0a0a0a14,4px 0 32px #0a0a0a0f!important}.sidebar-icon-only:before{content:"";pointer-events:none;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");position:absolute;inset:0;z-index:1!important;opacity:.25!important}.sidebar-icon-only>*{position:relative;z-index:10!important}.sidebar{width:calc(var(--sidebar-width) - 24px);scrollbar-width:none;-ms-overflow-style:none;-webkit-backdrop-filter:blur(24px)saturate(150%);z-index:100;background:#e8e2daeb;border-right:1px solid #0a0a0a14;border-radius:0;flex-direction:column;grid-column:1;min-width:0;height:calc(100vh - 24px);margin:12px 0 12px 12px;padding:24px;transition:width .3s,background .3s;display:flex;position:relative;overflow:hidden auto;box-shadow:4px 0 24px #0a0a0a0f,inset -1px 0 #ffffff4d}.sidebar::-webkit-scrollbar{display:none}.brand{color:var(--text-main);align-items:center;gap:10px;margin-bottom:40px;font-family:Outfit,sans-serif;font-size:20px;font-weight:700;display:flex}.brand span{color:var(--neon-cyan)}.nav-menu{flex-direction:column;gap:8px;list-style:none;display:flex}.nav-item{cursor:pointer;color:var(--text-muted);transition:all var(--transition-fast,.15s ease);border-radius:0;align-items:center;gap:12px;padding:12px 16px;font-size:14px;font-weight:400;display:flex;position:relative}.nav-item:hover,.nav-item.active{color:var(--text-main);background:#0a0a0a0a}.nav-item.active{border-left:3px solid var(--text-main);background:#0a0a0a0f;font-weight:500}.nav-item i{text-align:center;min-width:24px;font-size:18px}.sidebar.collapsed{opacity:0;pointer-events:none;transform:translate(-100%)}.sidebar.collapsed .sidebar-toggle i{transform:rotate(180deg)}.app-container.sidebar-collapsed{padding-left:0;transition:opacity .5s,padding-left .4s cubic-bezier(.4,0,.2,1)}.app-container.sidebar-collapsed .inbox-header{padding-left:64px!important}.sidebar.collapsed .logo span,.sidebar.collapsed .nav-item span,.sidebar.collapsed .user-profile div{display:none}.sidebar.collapsed .logo{justify-content:center}.sidebar.collapsed .nav-item{justify-content:center;padding:12px}.sidebar.collapsed .user-profile{justify-content:center}.sidebar-toggle{background:var(--bg-deep);border:1px solid var(--border-color);cursor:pointer;width:24px;height:24px;color:var(--text-muted);z-index:100;border-radius:50%;justify-content:center;align-items:center;display:flex;position:absolute;top:50%;right:-12px;transform:translateY(-50%)}.sidebar-toggle:hover{color:var(--text-main);border-color:var(--text-main)}.user-profile{border-top:1px solid var(--border-color);align-items:center;gap:12px;margin-top:auto;padding-top:21px;display:flex}.nav-submenu .nav-item{opacity:.8;margin-top:2px;padding:8px 12px;font-size:13px}.nav-submenu .nav-item:hover{opacity:1;background:#0a0a0a08}.rotated{transform:rotate(180deg)}.avatar{color:#fbf2e8;background:#0a0a0a;border-radius:50%;justify-content:center;align-items:center;width:38px;height:38px;font-size:12px;font-weight:700;display:flex}.main-content{background:0 0;flex-direction:column;min-width:0;height:100vh;transition:padding-left .2s;display:flex;position:relative;overflow:hidden}.view-section{scrollbar-width:none;-ms-overflow-style:none;flex-direction:column;justify-content:flex-start;align-items:stretch;width:100%;min-width:0;height:100%;padding:40px;display:none;overflow:hidden auto}.view-section.active{display:flex}.view-section.edge-to-edge{align-items:stretch;padding:0;overflow:hidden}.content-container{flex-direction:column;flex:1;gap:30px;width:100%;min-width:0;max-width:none;margin:0;padding:0;display:flex}.content-container.row-layout{flex-flow:wrap;justify-content:flex-start;align-items:flex-start;gap:40px;max-width:100%}#view-chatbot{justify-content:flex-start!important;align-items:flex-start!important}#view-chatbot .content-container{flex-direction:row!important;justify-content:flex-start!important;align-items:flex-start!important;width:100%!important;max-width:none!important;margin:0!important}#view-chatbot .config-panel{margin-left:0!important;margin-right:auto!important}.view-header{justify-content:space-between;align-items:center;width:100%;margin-bottom:10px;display:flex}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes pageEnter{0%{opacity:0;filter:blur(3px);transform:translateY(12px)scale(.995)}to{opacity:1;filter:blur();transform:translateY(0)scale(1)}}.page-transition{will-change:opacity,transform,filter}.page-transition.entering{opacity:0;filter:blur(3px);transform:translateY(12px)scale(.995)}.page-transition.visible{animation:.45s cubic-bezier(.22,1,.36,1) forwards pageEnter}.sidebar-icon-only button{transition:all .25s cubic-bezier(.4,0,.2,1)!important}.sidebar-icon-only button:active{transform:scale(.92);transition:transform .1s!important}h2.page-title{color:var(--text-main);margin-bottom:24px;font-family:Outfit,sans-serif;font-size:28px;font-weight:700}.grid-dashboard{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:24px;margin-bottom:32px;display:grid}.stat-card{background:var(--bg-card,#e8e2da);box-shadow:var(--shadow-card);border:1px solid #ffffff73;border-radius:0;padding:24px;transition:all .3s}.stat-card:hover{box-shadow:var(--shadow-card-hover);transform:translateY(-3px)}.stat-val{color:var(--text-main);margin:8px 0;font-size:32px;font-weight:700}.stat-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:1px;font-size:12px;font-weight:500}.builder-layout{grid-template-columns:350px 1fr;gap:24px;height:calc(100vh - 100px);display:grid}.builder-sidebar{background:var(--bg-card,#e8e2da);box-shadow:var(--shadow-card);border:1px solid #ffffff73;border-radius:0;flex-direction:column;gap:20px;padding:20px;display:flex;overflow-y:auto}.builder-preview{background:#fafaf7;border:2px solid #0a0a0a1a;border-radius:0;position:relative;overflow:hidden}.preview-overlay{position:absolute;bottom:20px;right:20px}input[type=text],input[type=password],input[type=email],textarea,select{width:100%;color:var(--text-main);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#fff3;border:1px solid #0a0a0a1f;border-radius:0;margin-bottom:12px;padding:12px 16px;font-family:Outfit,sans-serif;font-size:15px;transition:all .2s}input[type=text]:focus,input[type=password]:focus,input[type=email]:focus,textarea:focus,select:focus{background:#fff6;border-color:#0a0a0a;outline:none;box-shadow:0 8px 20px #0a0a0a0f}input::placeholder,textarea::placeholder{color:var(--text-muted);transition:opacity .2s}input:focus::placeholder,textarea:focus::placeholder{opacity:0}label{text-transform:uppercase;letter-spacing:.08em;color:var(--text-main);margin-bottom:6px;font-size:.75rem;font-weight:500;display:block}.tabs{border-bottom:1px solid var(--border-color);gap:16px;margin-bottom:20px;display:flex}.tab-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-bottom:2px solid #0000;padding:8px 0;font-family:Outfit,sans-serif;font-size:14px;font-weight:500;transition:all .2s}.tab-btn.active{color:var(--text-main);border-bottom-color:var(--text-main)}.tab-btn:hover{color:var(--text-main)}.config-tabs{border-bottom:1px solid var(--border-color);flex-wrap:nowrap;gap:8px;margin-bottom:20px;padding-bottom:8px;display:flex;overflow-x:auto}.config-tabs .tab{color:var(--text-muted);cursor:pointer;white-space:nowrap;background:0 0;border:none;border-bottom:2px solid #0000;flex-shrink:0;padding:8px 12px;font-family:Outfit,sans-serif;font-size:13px;transition:all .2s}.config-tabs .tab:hover{color:var(--text-main)}.config-tabs .tab.active{color:var(--text-main);border-bottom-color:var(--text-main)}.tab-button{-webkit-user-select:none;user-select:none;color:var(--text-muted);white-space:nowrap;background:0 0;border:1px solid #0a0a0a26;border-radius:0;flex-shrink:0;padding:8px 14px;font-size:12px;font-weight:500;text-decoration:none;transition:all .2s;display:inline-block;pointer-events:auto!important;cursor:pointer!important;z-index:9999!important;position:relative!important}.tab-button:hover{color:var(--text-main);background:#0a0a0a0a;text-decoration:none}.tab-button.active{color:var(--text-main)!important;background:#0a0a0a14!important;border-color:#0a0a0a4d!important}#config-tabs-nav{isolation:isolate;pointer-events:auto!important;z-index:9998!important;position:relative!important}.btn{background:var(--text-main);color:var(--bg-deep);text-transform:uppercase;letter-spacing:.08em;cursor:pointer;border:none;border-radius:0;justify-content:center;align-items:center;padding:10px 20px;font-family:Outfit,sans-serif;font-size:.875rem;font-weight:500;transition:all .2s;display:inline-flex;position:relative}.btn:hover{background:#000;transform:translateY(-1px);box-shadow:0 4px 12px #0a0a0a26}.btn:active{transform:translateY(2px)}.btn-primary{background:var(--text-main);color:var(--bg-deep);cursor:pointer;border:none;border-radius:0;padding:10px 20px;font-family:Outfit,sans-serif;font-weight:500;transition:all .2s}.btn-primary:hover{background:#000;box-shadow:0 4px 12px #0a0a0a26}.btn-secondary{color:var(--text-main);cursor:pointer;background:0 0;border:1px solid #0a0a0a33;border-radius:0;padding:10px 20px;font-family:Outfit,sans-serif;font-weight:500;transition:all .2s}.btn-secondary:hover{color:var(--text-main);background:#0a0a0a0d;border-color:#0a0a0a66}.btn-outline{border:1px solid var(--border-color);color:var(--text-muted);background:0 0}.btn-outline:hover{border-color:var(--text-main);color:var(--text-main)}.user-table{border-collapse:collapse;width:100%}.user-table th{text-align:left;border-bottom:1.5px solid var(--text-main);color:var(--text-main);text-transform:uppercase;letter-spacing:.05em;padding:12px;font-size:12px;font-weight:600}.user-table td{border-bottom:1px solid var(--border-color);color:var(--text-main);padding:12px;font-size:14px}.user-table tr:hover td{background:#0a0a0a05}.status-badge{color:var(--neon-green);text-transform:uppercase;letter-spacing:.05em;background:#3d7a4a1a;border-radius:0;padding:4px 8px;font-size:11px;font-weight:600}.hidden{display:none}.glass-panel{background:var(--bg-card,#e8e2da);box-shadow:var(--shadow-card);border:1px solid #ffffff73;border-radius:0;padding:24px}.config-panel{z-index:50;pointer-events:auto;flex-direction:column;gap:20px;height:700px;min-height:700px;display:flex;position:relative;overflow-y:auto}.kpi-grid{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;width:100%;display:grid}.kpi-card{background:var(--bg-card,#e8e2da);box-shadow:var(--shadow-card);border:1px solid #ffffff73;border-radius:0;flex-direction:column;gap:8px;padding:20px;transition:all .3s;display:flex}.kpi-card:hover{box-shadow:var(--shadow-card-hover);transform:translateY(-3px)}.kpi-card h3{color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px;font-size:14px;font-weight:500}.kpi-card .value{color:var(--text-main);font-size:36px;font-weight:700}.kpi-card .trend{color:var(--text-muted);font-size:12px}.kpi-card .trend.positive{color:var(--neon-green)}.kpi-card .trend.negative{color:#8b3a3a}@keyframes typingPulse{0%,to{opacity:.3;transform:scale(.8)}50%{opacity:1;transform:scale(1)}}.luna-chip{border:1px solid var(--border-color);cursor:pointer;color:var(--text-muted);background:#0a0a0a08;border-radius:9999px;align-items:center;gap:8px;padding:10px 20px;font-size:14px;font-weight:500;transition:all .2s;display:flex}.luna-chip:hover{border-color:var(--text-main);color:var(--text-main);background:#0a0a0a0f}@keyframes textShimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.luna-greeting{background:linear-gradient(90deg,#0a0a0a 15%,#2a6b5e 35%,#0a0a0a 50%,#6b4a8a 65%,#0a0a0a 85%) 0 0/200%;-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;animation:12s linear infinite textShimmer}#view-luna{background:radial-gradient(circle at 50% 30%,#e8e2da66,#0000 70%)}.billing-container{max-width:1400px;color:var(--text-main);height:100%;margin:0 auto;padding:40px;overflow-y:auto}.billing-header{text-align:center;margin-top:21px;margin-bottom:60px}.billing-title{text-transform:uppercase;letter-spacing:.2em;color:var(--text-main);margin-bottom:16px;font-family:Outfit,sans-serif;font-size:40px;font-weight:700}.billing-subtitle{color:var(--text-muted);max-width:600px;margin:0 auto;font-size:16px}.pricing-grid{grid-template-columns:repeat(auto-fit,minmax(300px,350px));justify-content:center;gap:40px;padding-bottom:60px;display:grid}.price-card{background:var(--bg-card,#e8e2da);min-height:550px;box-shadow:var(--shadow-card);border:1px solid #ffffff73;border-radius:0;flex-direction:column;transition:all .3s;display:flex;position:relative;overflow:hidden}.price-card:hover{box-shadow:var(--shadow-card-hover);transform:translateY(-10px)}.card-top-label{text-align:center;letter-spacing:.25em;text-transform:uppercase;color:var(--text-muted);padding-top:30px;padding-bottom:20px;font-size:12px;font-weight:700}.ribbon-container{justify-content:center;align-items:center;width:100%;height:50px;margin-bottom:40px;display:flex;position:relative}.ribbon-bg{clip-path:polygon(0 0,100% 0,95% 50%,100% 100%,0 100%,5% 50%);width:100%;height:100%;position:absolute;top:0;left:0}.ribbon-text{z-index:2;color:var(--bg-deep);letter-spacing:.1em;text-transform:uppercase;font-family:Outfit,sans-serif;font-size:16px;font-weight:800;position:relative}.price-section{text-align:center;margin-bottom:40px;padding:0 30px}.price-amount{color:var(--text-main);font-family:Outfit,sans-serif;font-size:48px;font-weight:700;line-height:1}.price-period{color:var(--text-muted);letter-spacing:1px;margin-left:5px;font-size:14px;font-weight:400}.price-setup{color:var(--text-muted);margin-top:10px;font-size:13px}.features-list{flex-direction:column;flex:1;gap:15px;margin:0;padding:0 40px 40px;list-style:none;display:flex}.feature-item{color:var(--text-main);align-items:center;gap:15px;font-size:14px;display:flex}.action-btn{border:1.5px solid var(--text-main);text-transform:uppercase;letter-spacing:.15em;width:100%;color:var(--text-main);cursor:pointer;background:0 0;border-radius:0;margin-top:21px;padding:16px;font-size:14px;font-weight:700;transition:all .2s}.action-btn:hover{background:var(--text-main);color:var(--bg-deep);transform:scale(1.02)}.usage-bar-container{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:var(--shadow-card);background:#e8e2da99;border:1px solid #ffffff73;border-radius:0;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:30px;margin-bottom:60px;padding:24px;display:flex}.sidebar-floating-toggle{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);cursor:pointer;z-index:1000;background:#e8e2daf2;border:1px solid #0a0a0a1a;border-radius:0;justify-content:center;align-items:center;width:52px;height:52px;transition:all .3s;display:flex;position:fixed;top:21px;left:24px;box-shadow:0 4px 16px #0a0a0a14}.sidebar-floating-toggle:hover{background:#ded8d0fa;transform:scale(1.05)}#luna-pill-wrapper{z-index:2000;justify-content:center;transition:transform .4s cubic-bezier(.2,.8,.2,1);display:flex;position:fixed;bottom:30px;left:50%;transform:translate(-50%,150px)}#luna-pill-bar{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);cursor:pointer;background:#e8e2daf2;border:1.5px solid #0a0a0a1a;border-radius:50px;justify-content:space-between;align-items:center;width:300px;height:54px;padding:4px 6px 4px 20px;display:flex;box-shadow:0 8px 30px #0a0a0a1a}#luna-pill-bar:hover{transform:scale(1.02);box-shadow:0 8px 30px #0a0a0a26}#luna-floating-icon{z-index:2000;cursor:pointer;width:80px;height:80px;transition:transform .3s cubic-bezier(.175,.885,.32,1.275);display:none;position:fixed;bottom:30px;right:30px}#luna-floating-icon:hover{transform:scale(1.15)}.luna-bar-text{color:var(--text-main);letter-spacing:.3px;font-size:14px;font-weight:500}.luna-bar-icon{width:38px;height:38px;color:var(--text-main);background:#0a0a0a0f;border:1px solid #0a0a0a1a;border-radius:50%;justify-content:center;align-items:center;font-size:16px;transition:all .3s;display:flex}#luna-pill-bar:hover .luna-bar-icon{background:#0a0a0a1a}#login-overlay{background:var(--bg-deep);z-index:9999;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:fixed;top:0;left:0}.login-box{background:var(--bg-card,#e8e2da);text-align:center;width:100%;max-width:400px;box-shadow:var(--shadow-card);border:1px solid #ffffff73;border-radius:0;padding:40px}.login-title{color:var(--text-main);margin-bottom:24px;font-family:Outfit,sans-serif;font-size:24px;font-weight:700}@keyframes gradientFlow{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}.preview-gradient-bg{background:linear-gradient(-45deg,#fbf2e8,#e8e2da,#ede8e1,#e8e0d4,#fbf2e8,#fafaf7) 0 0/400% 400%;animation:15s infinite gradientFlow}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
