/* ══════════════════════════════════════════════════════
   No Code SaaS Method App CSS — Full Platform Stylesheet
   Covers: Auth, Dashboard, All Feature Pages, Admin
   ══════════════════════════════════════════════════════ */

/* ── BASE (shared with style.css variables) ── */
:root {
  --purple:#7c3aed;--purple-light:#a855f7;--blue:#2563eb;--blue-light:#60a5fa;
  --pink:#ec4899;--green:#10b981;--orange:#f59e0b;--teal:#14b8a6;--gold:#eab308;
  --dark:#0a0a0f;--dark-2:#111118;--dark-3:#1a1a2e;--card-bg:#15151f;
  --border:rgba(255,255,255,0.08);--text:#e2e8f0;--text-muted:#94a3b8;--text-dim:#64748b;
  --white:#ffffff;--grad-main:linear-gradient(135deg,#7c3aed 0%,#2563eb 50%,#ec4899 100%);
  --sidebar-w:260px;--topbar-h:64px;
  --radius-sm:8px;--radius-md:16px;--radius-lg:24px;--radius-xl:32px;
  --transition:0.3s cubic-bezier(0.4,0,0.2,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;font-size:16px;}
body{font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;background:var(--dark);color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased;}
h1,h2,h3,h4{font-family:'Space Grotesk','Inter',sans-serif;line-height:1.2;letter-spacing:-0.02em;}
a{text-decoration:none;color:inherit;}
input,select,textarea,button{font-family:inherit;font-size:inherit;}
.container{max-width:1200px;margin:0 auto;padding:0 24px;}
.gradient-text{background:var(--grad-main);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.gradient-text-light{background:linear-gradient(135deg,#c4b5fd,#93c5fd,#f9a8d4);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}

/* ── APP SHELL ── */
.app-body{overflow:hidden;}
.app-shell{display:flex;min-height:100vh;background:var(--dark);}
.app-main{flex:1;display:flex;flex-direction:column;min-width:0;margin-left:var(--sidebar-w);transition:margin-left var(--transition);}
.app-content{flex:1;padding:32px;overflow-y:auto;max-height:calc(100vh - var(--topbar-h));overflow-x:hidden;}

/* ── SIDEBAR ── */
.sidebar{position:fixed;left:0;top:0;bottom:0;width:var(--sidebar-w);background:#0d0d18;border-right:1px solid var(--border);display:flex;flex-direction:column;z-index:100;transition:transform var(--transition);}
.sidebar-header{display:flex;align-items:center;justify-content:space-between;padding:20px 20px 16px;border-bottom:1px solid var(--border);}
.sidebar-logo{display:flex;align-items:center;gap:10px;}
.logo-icon-sm{width:32px;height:32px;background:var(--grad-main);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:0.85rem;color:#fff;flex-shrink:0;}
.logo-text-sm{font-family:'Space Grotesk',sans-serif;font-weight:800;font-size:0.92rem;color:#fff;white-space:nowrap;letter-spacing:-0.02em;}
.logo-text-sm sup{font-size:0.5em;vertical-align:super;}
.sidebar-close{display:none;background:none;border:1px solid var(--border);color:var(--text-muted);padding:6px 10px;border-radius:6px;cursor:pointer;}
.sidebar-nav{flex:1;padding:12px 12px;overflow-y:auto;display:flex;flex-direction:column;gap:2px;}
.sidebar-link{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:var(--radius-sm);color:var(--text-muted);font-size:0.875rem;font-weight:500;transition:var(--transition);white-space:nowrap;}
.sidebar-link:hover{background:rgba(255,255,255,0.05);color:var(--text);}
.sidebar-link.active{background:rgba(124,58,237,0.15);color:#c4b5fd;border:1px solid rgba(124,58,237,0.25);}
.sidebar-link i{width:16px;text-align:center;font-size:0.9rem;flex-shrink:0;}
.sidebar-footer{padding:12px;border-top:1px solid var(--border);}
.sidebar-admin{color:var(--text-dim)!important;margin-bottom:8px;}
.sidebar-admin:hover{color:#a855f7!important;}
.sidebar-user{display:flex;align-items:center;gap:10px;padding:8px;background:rgba(255,255,255,0.03);border-radius:var(--radius-sm);border:1px solid var(--border);}
.sidebar-avatar{width:32px;height:32px;background:var(--grad-main);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:0.85rem;color:#fff;flex-shrink:0;}
.sidebar-user-info{flex:1;min-width:0;}
.sidebar-user-name{display:block;font-size:0.8rem;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.sidebar-user-plan{display:block;font-size:0.7rem;color:var(--text-dim);}
.sidebar-logout{color:var(--text-dim);transition:var(--transition);padding:4px;}
.sidebar-logout:hover{color:#ef4444;}
.sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.6);z-index:99;backdrop-filter:blur(4px);}

/* ── TOPBAR ── */
.app-topbar{height:var(--topbar-h);background:rgba(10,10,15,0.8);border-bottom:1px solid var(--border);backdrop-filter:blur(20px);display:flex;align-items:center;padding:0 24px;gap:16px;position:sticky;top:0;z-index:50;}
.topbar-menu-btn{display:none;background:none;border:1px solid var(--border);color:var(--text);padding:8px 10px;border-radius:6px;cursor:pointer;}
.topbar-breadcrumb{font-size:0.9rem;color:var(--text-muted);flex:1;}
.topbar-actions{display:flex;align-items:center;gap:8px;margin-left:auto;}
.topbar-btn{background:none;border:1px solid var(--border);color:var(--text-muted);width:36px;height:36px;border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:var(--transition);position:relative;}
.topbar-btn:hover{border-color:rgba(124,58,237,0.4);color:#c4b5fd;}
.topbar-avatar{width:36px;height:36px;background:var(--grad-main);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:0.85rem;color:#fff;cursor:pointer;}
.notif-dot{position:absolute;top:6px;right:6px;width:7px;height:7px;background:#ef4444;border-radius:50%;border:1px solid var(--dark);}

/* ── PAGE HEADER ── */
.page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:28px;flex-wrap:wrap;}
.page-title{font-size:clamp(1.5rem,3vw,2rem);font-weight:800;color:#fff;margin-bottom:4px;}
.page-subtitle{font-size:0.9rem;color:var(--text-muted);}
.header-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;}

/* ── STATS TILES ── */
.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px;}
.stat-tile{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-md);padding:20px;display:flex;align-items:center;gap:14px;transition:var(--transition);}
.stat-tile:hover{border-color:rgba(124,58,237,0.3);transform:translateY(-2px);}
.st-icon{width:44px;height:44px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;font-size:1.1rem;flex-shrink:0;}
.st-icon.purple{background:rgba(124,58,237,0.15);color:#c4b5fd;}
.st-icon.green{background:rgba(16,185,129,0.15);color:#10b981;}
.st-icon.blue{background:rgba(37,99,235,0.15);color:#60a5fa;}
.st-icon.orange{background:rgba(245,158,11,0.15);color:#f59e0b;}
.st-icon.gold{background:rgba(234,179,8,0.15);color:#eab308;}
.st-data{flex:1;}
.st-num{display:block;font-size:1.4rem;font-weight:800;color:#fff;font-family:'Space Grotesk',sans-serif;}
.st-label{font-size:0.78rem;color:var(--text-muted);}
.st-trend{font-size:0.72rem;display:flex;align-items:center;gap:4px;padding:2px 8px;border-radius:100px;white-space:nowrap;}
.st-trend.up{color:#10b981;background:rgba(16,185,129,0.1);}
.st-trend.down{color:#ef4444;background:rgba(239,68,68,0.1);}
.st-trend.neutral{color:var(--text-muted);background:rgba(255,255,255,0.05);}

/* ── BUTTONS ── */
.btn-primary{display:inline-flex;align-items:center;gap:8px;background:var(--grad-main);color:#fff;font-weight:700;font-size:0.9rem;padding:11px 22px;border-radius:100px;transition:var(--transition);border:none;cursor:pointer;white-space:nowrap;}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 30px rgba(124,58,237,0.45);}
.btn-primary.btn-large{font-size:1rem;padding:14px 28px;}
.btn-primary.btn-sm{font-size:0.82rem;padding:8px 16px;}
.btn-primary.btn-glow{animation:glowPulse 2.5s ease-in-out infinite;}
.btn-ghost{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,0.07);border:1px solid rgba(255,255,255,0.15);color:var(--text);font-weight:600;font-size:0.9rem;padding:11px 22px;border-radius:100px;transition:var(--transition);cursor:pointer;}
.btn-ghost:hover{background:rgba(255,255,255,0.12);transform:translateY(-2px);}
.btn-ghost.btn-large{font-size:1rem;padding:14px 28px;}
.btn-ghost-sm{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,0.06);border:1px solid var(--border);color:var(--text-muted);font-size:0.82rem;font-weight:500;padding:7px 14px;border-radius:8px;transition:var(--transition);cursor:pointer;}
.btn-ghost-sm:hover{background:rgba(255,255,255,0.1);color:#fff;border-color:rgba(255,255,255,0.2);}
.btn-ghost-sm.xs{padding:4px 10px;font-size:0.75rem;}
.btn-primary-sm{display:inline-flex;align-items:center;gap:6px;background:var(--grad-main);color:#fff;font-weight:600;font-size:0.82rem;padding:7px 14px;border-radius:8px;transition:var(--transition);cursor:pointer;}
.btn-primary-sm:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(124,58,237,0.4);}
.btn-danger{display:inline-flex;align-items:center;gap:6px;background:rgba(239,68,68,0.15);border:1px solid rgba(239,68,68,0.3);color:#ef4444;font-size:0.9rem;font-weight:600;padding:10px 20px;border-radius:8px;cursor:pointer;transition:var(--transition);}
.btn-danger:hover{background:rgba(239,68,68,0.25);}
.btn-danger-sm{background:none;border:none;color:#ef4444;cursor:pointer;padding:4px 8px;border-radius:4px;font-size:0.8rem;}
.btn-danger-sm:hover{background:rgba(239,68,68,0.1);}
.btn-warning{display:inline-flex;align-items:center;gap:6px;background:rgba(245,158,11,0.1);border:1px solid rgba(245,158,11,0.3);color:#f59e0b;font-size:0.9rem;font-weight:600;padding:10px 20px;border-radius:8px;cursor:pointer;transition:var(--transition);}
.btn-warning:hover{background:rgba(245,158,11,0.2);}
.icon-btn{background:none;border:none;color:var(--text-muted);cursor:pointer;padding:6px 8px;border-radius:6px;transition:var(--transition);}
.icon-btn:hover{background:rgba(255,255,255,0.08);color:#fff;}
.icon-btn.danger:hover{color:#ef4444;}
.w-full{width:100%;}
.mt-8{margin-top:8px;}.mt-12{margin-top:12px;}.mt-16{margin-top:16px;}.mt-20{margin-top:20px;}.mt-24{margin-top:24px;}.mb-16{margin-bottom:16px;}.ml-auto{margin-left:auto;}.ml-16{margin-left:16px;}

/* ── PANEL CARD ── */
.panel-card{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-md);padding:24px;}
.panel-card-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px;flex-wrap:wrap;}
.panel-card-header h3{font-size:1rem;font-weight:700;color:#fff;}
.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;}
.section-header h2{font-size:1.1rem;font-weight:700;color:#fff;}
.section-label{font-size:0.78rem;font-weight:700;text-transform:uppercase;letter-spacing:0.08em;color:var(--text-muted);margin-bottom:14px;display:block;}
.section-link{font-size:0.85rem;color:var(--purple-light);transition:var(--transition);}
.section-link:hover{color:#fff;}
.empty-state{text-align:center;padding:48px 24px;color:var(--text-muted);}
.empty-state.sm{padding:32px 16px;}
.empty-icon{width:56px;height:56px;background:rgba(124,58,237,0.1);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-size:1.4rem;color:#c4b5fd;margin:0 auto 16px;}
.empty-state h3{font-size:1rem;font-weight:700;color:#fff;margin-bottom:8px;}
.empty-state p{font-size:0.87rem;max-width:320px;margin:0 auto;}
.text-muted{color:var(--text-muted);}

/* ── FORMS ── */
.form-group{margin-bottom:16px;}
.form-group label{display:flex;align-items:center;justify-content:space-between;font-size:0.82rem;font-weight:600;color:var(--text-muted);margin-bottom:6px;}
.input-wrap{position:relative;display:flex;align-items:center;}
.input-wrap i:first-child{position:absolute;left:14px;color:var(--text-dim);font-size:0.85rem;pointer-events:none;}
.input-wrap input{width:100%;background:rgba(255,255,255,0.04);border:1px solid var(--border);border-radius:var(--radius-sm);padding:11px 14px 11px 40px;color:#fff;font-size:0.9rem;transition:var(--transition);}
.input-wrap input:focus{outline:none;border-color:rgba(124,58,237,0.6);background:rgba(124,58,237,0.05);}
.toggle-pw{position:absolute;right:12px;background:none;border:none;color:var(--text-dim);cursor:pointer;}
.toggle-pw:hover{color:var(--text-muted);}
input[type=text],input[type=email],input[type=password],input[type=url],input[type=number],select,textarea{background:rgba(255,255,255,0.04);border:1px solid var(--border);border-radius:var(--radius-sm);padding:10px 14px;color:#fff;font-size:0.9rem;transition:var(--transition);width:100%;}
input:focus,select:focus,textarea:focus{outline:none;border-color:rgba(124,58,237,0.6);background:rgba(124,58,237,0.05);}
select option{background:var(--dark-3);}
textarea{resize:vertical;}
.input-full{width:100%;}
.input-sm{padding:6px 10px;font-size:0.82rem;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.form-link{font-size:0.8rem;color:#c4b5fd;transition:var(--transition);}
.form-link:hover{color:#fff;}
.form-check,.form-remember{margin-bottom:16px;}
.checkbox-label{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:0.85rem;color:var(--text-muted);}
.checkbox-label input[type=checkbox]{width:16px;height:16px;accent-color:var(--purple);cursor:pointer;}

/* ── TOAST ── */
.toast{position:fixed;bottom:24px;right:24px;background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px 20px;font-size:0.875rem;color:#fff;z-index:9999;animation:slideInRight 0.3s ease,fadeOut 0.3s 2.7s ease forwards;box-shadow:0 8px 32px rgba(0,0,0,0.4);}
.toast-success{border-color:rgba(16,185,129,0.4);background:rgba(16,185,129,0.1);}
.toast-info{border-color:rgba(37,99,235,0.4);background:rgba(37,99,235,0.1);}
.toast-error{border-color:rgba(239,68,68,0.4);background:rgba(239,68,68,0.1);}
@keyframes slideInRight{from{transform:translateX(120%);opacity:0;}to{transform:translateX(0);opacity:1;}}
@keyframes fadeOut{to{opacity:0;transform:translateX(20px);}}
@keyframes glowPulse{0%,100%{box-shadow:0 8px 30px rgba(124,58,237,0.4);}50%{box-shadow:0 8px 50px rgba(124,58,237,0.75),0 0 80px rgba(168,85,247,0.3);}}
@keyframes fadeInDown{from{opacity:0;transform:translateY(-24px);}to{opacity:1;transform:translateY(0);}}
@keyframes fadeInUp{from{opacity:0;transform:translateY(32px);}to{opacity:1;transform:translateY(0);}}
@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}
@keyframes bounceDown{0%,100%{transform:translateY(0);}50%{transform:translateY(6px);}}
@keyframes blink{0%,100%{opacity:1;box-shadow:0 0 6px #10b981;}50%{opacity:0.4;box-shadow:none;}}
@keyframes orbFloat{0%,100%{transform:translateY(0) scale(1);}50%{transform:translateY(-40px) scale(1.05);}}
@keyframes marquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@keyframes scrollPulse{0%,100%{transform:scaleY(1);opacity:1;}50%{transform:scaleY(0.6);opacity:0.4;}}
@keyframes floatMockup{0%,100%{transform:translateY(0);}50%{transform:translateY(-12px);}}
@keyframes pulseBorder{0%,100%{border-color:rgba(124,58,237,0.4);box-shadow:none;}50%{border-color:rgba(124,58,237,0.8);box-shadow:0 0 20px rgba(124,58,237,0.2);}}
.animate-on-scroll{opacity:0;transform:translateY(30px);transition:opacity 0.7s ease,transform 0.7s ease;}
.animate-on-scroll.in-view{opacity:1;transform:translateY(0);}

/* ── AUTH PAGES ── */
.auth-body{min-height:100vh;overflow:auto;}
.auth-split{display:flex;min-height:100vh;}
.auth-left{flex:1;background:linear-gradient(135deg,#0d0a24,#12102a,#0d1830);padding:48px 56px;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden;}
.auth-left-orbs{position:absolute;inset:0;pointer-events:none;}
.auth-orb{position:absolute;border-radius:50%;filter:blur(80px);opacity:0.35;}
.ao1{width:400px;height:400px;background:radial-gradient(circle,#7c3aed,transparent 70%);top:-100px;left:-100px;animation:orbFloat 8s ease-in-out infinite;}
.ao2{width:300px;height:300px;background:radial-gradient(circle,#2563eb,transparent 70%);bottom:0;right:-50px;animation:orbFloat 10s ease-in-out infinite;}
.auth-left-content{position:relative;z-index:2;max-width:420px;}
.auth-logo{display:inline-flex;align-items:center;gap:10px;font-family:'Space Grotesk',sans-serif;font-weight:800;font-size:1.25rem;color:#fff;margin-bottom:40px;}
.auth-logo .logo-icon{width:40px;height:40px;background:var(--grad-main);border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1rem;color:#fff;}
.auth-logo .logo-text sup{font-size:0.5em;vertical-align:super;}
.auth-left h2{font-size:clamp(1.8rem,3vw,2.5rem);font-weight:900;color:#fff;margin-bottom:20px;line-height:1.2;}
.auth-left p{color:rgba(255,255,255,0.65);font-size:0.95rem;line-height:1.7;margin-bottom:32px;}
.auth-left-features{display:flex;flex-direction:column;gap:12px;margin-bottom:32px;}
.auth-feature{display:flex;align-items:center;gap:12px;font-size:0.9rem;color:rgba(255,255,255,0.75);}
.auth-feature i{color:#10b981;font-size:0.85rem;}
.auth-testi{background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.1);border-radius:var(--radius-sm);padding:16px;font-size:0.87rem;color:rgba(255,255,255,0.65);font-style:italic;}
.auth-testi strong{color:#fff;}
.pricing-teaser{display:flex;gap:12px;margin-bottom:20px;}
.pt-plan{flex:1;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.1);border-radius:var(--radius-sm);padding:16px;text-align:center;position:relative;}
.pt-plan.pt-featured{background:rgba(124,58,237,0.12);border-color:rgba(124,58,237,0.4);}
.pt-badge{position:absolute;top:-10px;left:50%;transform:translateX(-50%);background:var(--grad-main);color:#fff;font-size:0.65rem;font-weight:700;padding:3px 10px;border-radius:100px;white-space:nowrap;}
.pt-name{font-size:0.85rem;color:var(--text-muted);margin-bottom:6px;font-weight:600;}
.pt-price{font-size:1.4rem;font-weight:900;color:#fff;font-family:'Space Grotesk',sans-serif;}
.pt-price span{font-size:0.75rem;font-weight:400;color:var(--text-muted);}
.pt-note{font-size:0.72rem;color:var(--text-dim);margin-top:4px;}
.trial-note{display:flex;align-items:center;gap:10px;font-size:0.85rem;color:#10b981;background:rgba(16,185,129,0.08);border:1px solid rgba(16,185,129,0.2);border-radius:100px;padding:8px 16px;}
.trial-note i{flex-shrink:0;}
.auth-right{flex:1;display:flex;align-items:center;justify-content:center;padding:48px;background:var(--dark);}
.auth-form-card{width:100%;max-width:460px;}
.auth-title{font-size:1.8rem;font-weight:800;color:#fff;margin-bottom:8px;}
.auth-subtitle{font-size:0.9rem;color:var(--text-muted);margin-bottom:28px;}
.social-auth-btns{display:flex;flex-direction:column;gap:10px;margin-bottom:20px;}
.social-btn{display:flex;align-items:center;justify-content:center;gap:10px;background:rgba(255,255,255,0.05);border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px 20px;color:#fff;font-size:0.9rem;font-weight:500;cursor:pointer;transition:var(--transition);}
.social-btn:hover{background:rgba(255,255,255,0.09);border-color:rgba(255,255,255,0.2);}
.auth-divider{display:flex;align-items:center;gap:12px;margin-bottom:20px;}
.auth-divider::before,.auth-divider::after{content:'';flex:1;height:1px;background:var(--border);}
.auth-divider span{font-size:0.78rem;color:var(--text-dim);white-space:nowrap;}
.auth-form{display:flex;flex-direction:column;gap:0;}
.btn-auth{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:14px;border-radius:var(--radius-sm);background:var(--grad-main);color:#fff;font-weight:700;font-size:0.95rem;border:none;cursor:pointer;transition:var(--transition);margin-top:4px;}
.btn-auth:hover{transform:translateY(-2px);box-shadow:0 8px 30px rgba(124,58,237,0.45);}
.btn-auth:disabled{opacity:0.7;cursor:not-allowed;transform:none;}
.auth-error{color:#ef4444;font-size:0.82rem;margin-top:8px;min-height:20px;}
.auth-switch{text-align:center;font-size:0.875rem;color:var(--text-muted);margin-top:20px;}
.auth-switch a{color:#c4b5fd;}
.pw-strength{display:flex;align-items:center;gap:10px;margin-top:8px;}
.pw-bar{flex:1;height:4px;background:rgba(255,255,255,0.1);border-radius:2px;overflow:hidden;}
.pw-fill{height:100%;width:0;transition:width 0.3s,background 0.3s;border-radius:2px;}
#pwLabel{font-size:0.75rem;color:var(--text-dim);width:60px;flex-shrink:0;}
.plan-selector{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.plan-opt{border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px;cursor:pointer;transition:var(--transition);text-align:center;}
.plan-opt:hover{border-color:rgba(124,58,237,0.4);}
.plan-opt.active{border-color:rgba(124,58,237,0.6);background:rgba(124,58,237,0.1);}
.plan-opt strong{display:block;font-size:0.9rem;color:#fff;margin-bottom:4px;}
.plan-opt span{font-size:0.75rem;color:var(--text-muted);}
.pop-badge{background:var(--grad-main);color:#fff;font-size:0.6rem;padding:2px 6px;border-radius:100px;margin-left:4px;}
.auth-center{display:flex;align-items:center;justify-content:center;}
.auth-card-center{width:100%;max-width:480px;text-align:center;padding:24px;}
.verify-icon{width:80px;height:80px;background:rgba(124,58,237,0.15);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:2rem;color:#c4b5fd;margin:0 auto 24px;}
.verify-icon.success{background:rgba(16,185,129,0.15);color:#10b981;}
.auth-card-center h1{font-size:1.8rem;font-weight:800;color:#fff;margin-bottom:12px;}
.auth-card-center p{color:var(--text-muted);margin-bottom:16px;}
.otp-section{margin:24px 0;}
.otp-label{font-size:0.85rem;color:var(--text-muted);margin-bottom:12px;}
.otp-inputs{display:flex;gap:10px;justify-content:center;}
.otp-input{width:52px;height:56px;text-align:center;font-size:1.2rem;font-weight:700;background:rgba(255,255,255,0.05);border:1px solid var(--border);border-radius:var(--radius-sm);color:#fff;}
.otp-input:focus{outline:none;border-color:rgba(124,58,237,0.6);background:rgba(124,58,237,0.08);}
.centered{margin:0 auto 40px;display:flex;}

/* ── ONBOARDING ── */
.onboarding-body{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--dark);}
.onboarding-shell{width:100%;max-width:680px;margin:0 auto;padding:24px;position:relative;}
.onb-progress{height:3px;background:rgba(255,255,255,0.08);border-radius:2px;margin-bottom:24px;overflow:hidden;}
.onb-progress-bar{height:100%;background:var(--grad-main);border-radius:2px;transition:width 0.5s ease;}
.onb-step-indicators{display:flex;align-items:center;justify-content:center;gap:0;margin-bottom:40px;}
.onb-indicator{width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,0.08);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:0.8rem;font-weight:700;color:var(--text-dim);transition:var(--transition);flex-shrink:0;}
.onb-indicator.active{background:var(--grad-main);border-color:transparent;color:#fff;}
.onb-indicator.done{background:rgba(16,185,129,0.2);border-color:rgba(16,185,129,0.4);color:#10b981;}
.onb-indicator-line{flex:1;max-width:60px;height:1px;background:var(--border);}
.onb-step{display:none;text-align:center;animation:fadeInUp 0.4s ease;}
.onb-step.active{display:flex;flex-direction:column;align-items:center;}
.onb-emoji{font-size:3.5rem;margin-bottom:20px;}
.ready-emoji{animation:bounceDown 1s ease infinite;}
.onb-step h1{font-size:clamp(1.6rem,4vw,2.2rem);font-weight:900;color:#fff;margin-bottom:12px;}
.onb-desc{font-size:0.95rem;color:var(--text-muted);max-width:440px;margin:0 auto 32px;line-height:1.7;}
.onb-options-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;width:100%;max-width:540px;margin-bottom:32px;}
.onb-option{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-md);padding:16px;cursor:pointer;transition:var(--transition);display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;}
.onb-option:hover{border-color:rgba(124,58,237,0.4);background:rgba(124,58,237,0.05);}
.onb-option.active{border-color:rgba(124,58,237,0.6);background:rgba(124,58,237,0.12);}
.onb-option i{font-size:1.3rem;color:#c4b5fd;}
.onb-option span{font-size:0.82rem;font-weight:600;color:var(--text);}
.onb-welcome-stats{display:flex;gap:24px;margin-bottom:32px;flex-wrap:wrap;justify-content:center;}
.ows{text-align:center;}
.ows span{display:block;font-size:1.8rem;font-weight:900;color:#fff;font-family:'Space Grotesk',sans-serif;background:var(--grad-main);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.ows p{font-size:0.78rem;color:var(--text-muted);}
.onb-nav{display:flex;align-items:center;justify-content:space-between;width:100%;max-width:440px;gap:12px;}
.onb-btn{max-width:220px;}
.onb-ready-checklist{display:flex;flex-direction:column;gap:10px;margin-bottom:32px;text-align:left;width:100%;max-width:360px;}
.onb-check{display:flex;align-items:center;gap:12px;font-size:0.9rem;color:var(--text);}
.onb-check i{color:#10b981;font-size:1rem;}
.onb-check.done i{animation:fadeIn 0.3s ease;}

/* ── DASHBOARD ── */
.trial-alert{display:flex;align-items:center;justify-content:space-between;gap:16px;background:rgba(124,58,237,0.08);border:1px solid rgba(124,58,237,0.3);border-radius:var(--radius-md);padding:16px 20px;margin-bottom:24px;flex-wrap:wrap;}
.trial-alert-left{display:flex;align-items:center;gap:12px;}
.trial-alert-left i{color:#a855f7;font-size:1.2rem;}
.trial-alert strong{display:block;color:#fff;font-size:0.9rem;}
.trial-alert p{font-size:0.82rem;color:var(--text-muted);}
.quick-actions-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-bottom:24px;}
.qa-card{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-md);padding:20px 16px;text-align:center;transition:var(--transition);cursor:pointer;}
.qa-card:hover{transform:translateY(-4px);}
.qa-card.purple:hover{border-color:rgba(124,58,237,0.4);background:rgba(124,58,237,0.06);}
.qa-card.blue:hover{border-color:rgba(37,99,235,0.4);background:rgba(37,99,235,0.06);}
.qa-card.green:hover{border-color:rgba(16,185,129,0.4);background:rgba(16,185,129,0.06);}
.qa-card.pink:hover{border-color:rgba(236,72,153,0.4);background:rgba(236,72,153,0.06);}
.qa-card.orange:hover{border-color:rgba(245,158,11,0.4);background:rgba(245,158,11,0.06);}
.qa-card.teal:hover{border-color:rgba(20,184,166,0.4);background:rgba(20,184,166,0.06);}
.qa-icon{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1rem;margin:0 auto 10px;background:rgba(124,58,237,0.15);color:#c4b5fd;}
.qa-card.blue .qa-icon{background:rgba(37,99,235,0.15);color:#60a5fa;}
.qa-card.green .qa-icon{background:rgba(16,185,129,0.15);color:#10b981;}
.qa-card.pink .qa-icon{background:rgba(236,72,153,0.15);color:#f9a8d4;}
.qa-card.orange .qa-icon{background:rgba(245,158,11,0.15);color:#fcd34d;}
.qa-card.teal .qa-icon{background:rgba(20,184,166,0.15);color:#5eead4;}
.qa-card h3{font-size:0.8rem;font-weight:700;color:#fff;margin-bottom:4px;}
.qa-card p{font-size:0.72rem;color:var(--text-dim);}
.projects-list{display:flex;flex-direction:column;gap:12px;margin-bottom:24px;}
.project-card{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-md);padding:20px;display:flex;align-items:center;gap:16px;transition:var(--transition);}
.project-card:hover{border-color:rgba(124,58,237,0.3);transform:translateX(4px);}
.project-status-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;}
.project-status-dot.live{background:#10b981;box-shadow:0 0 8px #10b981;}
.project-status-dot.building{background:#f59e0b;box-shadow:0 0 8px #f59e0b;}
.project-status-dot.idea{background:#7c3aed;box-shadow:0 0 8px #7c3aed;}
.project-info{flex:1;}
.project-info h3{font-size:0.95rem;font-weight:700;color:#fff;margin-bottom:4px;}
.project-info p{font-size:0.82rem;color:var(--text-muted);margin-bottom:8px;}
.project-tags{display:flex;gap:6px;flex-wrap:wrap;}
.tag{font-size:0.7rem;padding:2px 8px;border-radius:100px;background:rgba(255,255,255,0.06);border:1px solid var(--border);color:var(--text-muted);}
.tag.blue{background:rgba(37,99,235,0.1);border-color:rgba(37,99,235,0.25);color:#60a5fa;}
.tag.yellow{background:rgba(245,158,11,0.1);border-color:rgba(245,158,11,0.25);color:#fcd34d;}
.tag.purple{background:rgba(124,58,237,0.1);border-color:rgba(124,58,237,0.25);color:#c4b5fd;}
.tag.green{background:rgba(16,185,129,0.1);border-color:rgba(16,185,129,0.25);color:#10b981;}
.project-actions{display:flex;align-items:center;gap:16px;flex-shrink:0;}
.project-progress{display:flex;align-items:center;gap:8px;font-size:0.75rem;color:var(--text-muted);}
.pp-label{font-size:0.72rem;}
.pp-bar{width:80px;height:5px;background:rgba(255,255,255,0.08);border-radius:3px;overflow:hidden;}
.pp-fill{height:100%;background:var(--grad-main);border-radius:3px;}
.ai-suggestions-card{background:linear-gradient(135deg,rgba(124,58,237,0.06),rgba(37,99,235,0.04));border:1px solid rgba(124,58,237,0.2);border-radius:var(--radius-md);padding:24px;}
.ai-card-header{display:flex;align-items:center;gap:12px;margin-bottom:16px;}
.ai-icon-sm{width:36px;height:36px;background:var(--grad-main);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:0.9rem;color:#fff;}
.ai-card-header h3{font-size:0.95rem;font-weight:700;color:#fff;}
.ai-suggestions-list{display:flex;flex-direction:column;gap:12px;}
.ai-sugg{display:flex;align-items:flex-start;gap:12px;padding:12px;background:rgba(255,255,255,0.02);border-radius:var(--radius-sm);}
.ai-sugg i{color:#a855f7;margin-top:2px;flex-shrink:0;}
.ai-sugg p{font-size:0.85rem;color:var(--text-muted);flex:1;line-height:1.6;}
.ai-sugg strong{color:var(--text);}
.ai-action-link{font-size:0.8rem;color:#c4b5fd;display:block;margin-top:4px;}

/* ── IDEAS / AI PAGES ── */
.idea-input-card{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-md);padding:24px;margin-bottom:24px;}
.idea-input-card h3{font-size:1rem;font-weight:700;color:#fff;margin-bottom:8px;}
.idea-input-card p{font-size:0.87rem;color:var(--text-muted);margin-bottom:16px;}
.idea-input-row{display:flex;gap:16px;flex-wrap:wrap;}
.idea-input-row textarea{flex:1;min-width:200px;min-height:80px;background:rgba(255,255,255,0.04);border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px;color:#fff;resize:vertical;}
.idea-input-row textarea:focus{outline:none;border-color:rgba(124,58,237,0.6);}
.idea-input-controls{display:flex;flex-direction:column;gap:10px;justify-content:flex-end;}
.idea-options{display:flex;align-items:center;gap:8px;font-size:0.82rem;color:var(--text-muted);}
.ideas-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;}
.idea-card{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-md);padding:20px;transition:var(--transition);}
.idea-card:hover{border-color:rgba(124,58,237,0.4);transform:translateY(-4px);}
.idea-score{display:inline-flex;align-items:center;gap:6px;background:rgba(16,185,129,0.1);border:1px solid rgba(16,185,129,0.25);color:#10b981;font-size:0.75rem;font-weight:700;padding:3px 10px;border-radius:100px;margin-bottom:12px;}
.idea-card h3{font-size:1rem;font-weight:700;color:#fff;margin-bottom:8px;}
.idea-card p{font-size:0.85rem;color:var(--text-muted);margin-bottom:16px;line-height:1.6;}
.idea-card-actions{display:flex;gap:8px;}
.ai-badge{display:inline-flex;align-items:center;gap:6px;background:rgba(124,58,237,0.1);border:1px solid rgba(124,58,237,0.25);color:#c4b5fd;font-size:0.72rem;font-weight:600;padding:4px 10px;border-radius:100px;}

/* ── BLUEPRINT ── */
.blueprint-layout{display:grid;grid-template-columns:320px 1fr;gap:20px;}
.blueprint-input-panel .panel-card{height:fit-content;}
.blueprint-output-panel{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-md);padding:24px;min-height:400px;}
.bp-section{margin-bottom:24px;}
.bp-section h4{font-size:0.9rem;font-weight:700;color:#fff;margin-bottom:12px;display:flex;align-items:center;gap:8px;}
.bp-section h4 i{color:#c4b5fd;}
.bp-features-list{display:flex;flex-direction:column;gap:6px;}
.bp-feature{display:flex;align-items:flex-start;gap:8px;font-size:0.85rem;color:var(--text-muted);}
.bp-feature i{color:#10b981;margin-top:2px;font-size:0.75rem;}
.bp-flow-steps{display:flex;flex-direction:column;gap:8px;}
.bp-flow-step{display:flex;align-items:center;gap:10px;font-size:0.85rem;}
.bp-step-num{width:24px;height:24px;background:rgba(124,58,237,0.15);border:1px solid rgba(124,58,237,0.3);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:0.7rem;font-weight:700;color:#c4b5fd;flex-shrink:0;}

/* ── MARKETING ── */
.marketing-layout{display:grid;grid-template-columns:260px 1fr;gap:20px;height:calc(100vh - 200px);}
.mkt-sidebar{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-md);padding:20px;display:flex;flex-direction:column;gap:8px;overflow-y:auto;}
.content-type-list{display:flex;flex-direction:column;gap:4px;margin-bottom:16px;}
.ct-btn{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--radius-sm);border:none;background:none;color:var(--text-muted);font-size:0.85rem;font-weight:500;cursor:pointer;transition:var(--transition);text-align:left;width:100%;}
.ct-btn:hover{background:rgba(255,255,255,0.05);color:#fff;}
.ct-btn.active{background:rgba(124,58,237,0.15);color:#c4b5fd;}
.ct-btn i{width:16px;text-align:center;}
.mkt-output{display:flex;flex-direction:column;background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden;}
.mkt-output-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border);flex-wrap:wrap;gap:8px;}
.mkt-output-header h3{font-size:0.95rem;font-weight:700;color:#fff;}
.mkt-output-actions{display:flex;gap:8px;}
.mkt-output-body{flex:1;padding:24px;overflow-y:auto;}
.mkt-content{font-size:0.87rem;color:var(--text);line-height:1.8;}
.mkt-content h4{color:#fff;font-weight:700;margin:16px 0 8px;}
.mkt-content p{margin-bottom:12px;color:var(--text-muted);}
.mkt-content strong{color:var(--text);}

/* ── BUILDER ── */
.builder-layout{display:grid;grid-template-columns:240px 1fr 220px;gap:0;height:calc(100vh - 160px);background:var(--dark-2);border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden;}
.builder-left{background:#0d0d18;border-right:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;}
.builder-tabs{display:flex;border-bottom:1px solid var(--border);}
.btab{flex:1;padding:12px;border:none;background:none;color:var(--text-muted);font-size:0.82rem;font-weight:600;cursor:pointer;transition:var(--transition);border-bottom:2px solid transparent;}
.btab.active{color:#c4b5fd;border-bottom-color:var(--purple);}
.builder-panel{padding:12px;overflow-y:auto;flex:1;}
.comp-group{margin-bottom:16px;}
.comp-group-label{font-size:0.68rem;text-transform:uppercase;letter-spacing:0.08em;color:var(--text-dim);padding:0 4px;margin-bottom:6px;font-weight:700;}
.comp-item{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:6px;cursor:grab;font-size:0.82rem;color:var(--text-muted);transition:var(--transition);user-select:none;}
.comp-item:hover{background:rgba(255,255,255,0.06);color:#fff;}
.comp-item:active{cursor:grabbing;}
.comp-item i{width:14px;text-align:center;font-size:0.8rem;color:#c4b5fd;}
.templates-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.template-card{cursor:pointer;border:1px solid var(--border);border-radius:8px;overflow:hidden;transition:var(--transition);}
.template-card:hover{border-color:rgba(124,58,237,0.5);}
.template-card span{display:block;font-size:0.72rem;padding:6px;text-align:center;color:var(--text-muted);}
.tc-preview{height:48px;background:linear-gradient(135deg,rgba(124,58,237,0.2),rgba(37,99,235,0.1));}
.builder-canvas-wrap{display:flex;flex-direction:column;background:#0a0a12;overflow:hidden;}
.canvas-toolbar{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;border-bottom:1px solid var(--border);gap:8px;flex-wrap:wrap;}
.canvas-device-btns{display:flex;gap:4px;}
.device-btn{background:none;border:1px solid var(--border);color:var(--text-muted);padding:6px 10px;border-radius:6px;cursor:pointer;transition:var(--transition);font-size:0.8rem;}
.device-btn.active{border-color:rgba(124,58,237,0.5);color:#c4b5fd;background:rgba(124,58,237,0.1);}
.canvas-app-name{font-size:0.82rem;color:var(--text-muted);}
.canvas-history{display:flex;gap:4px;}
.canvas-frame{flex:1;overflow:auto;padding:16px;display:flex;justify-content:center;align-items:flex-start;}
.canvas-area{width:100%;min-height:400px;background:rgba(255,255,255,0.02);border:2px dashed var(--border);border-radius:var(--radius-sm);padding:16px;transition:var(--transition);}
.canvas-area.drag-over{border-color:rgba(124,58,237,0.6);background:rgba(124,58,237,0.04);}
.canvas-empty-state{text-align:center;padding:48px 16px;color:var(--text-dim);}
.canvas-empty-state i{font-size:2.5rem;margin-bottom:12px;display:block;color:var(--text-dim);}
.canvas-component{border:1px solid rgba(255,255,255,0.08);border-radius:6px;padding:12px;margin-bottom:8px;background:rgba(255,255,255,0.03);cursor:pointer;transition:var(--transition);position:relative;}
.canvas-component:hover{border-color:rgba(124,58,237,0.4);}
.canvas-component.selected{border-color:rgba(124,58,237,0.7);background:rgba(124,58,237,0.06);}
.comp-delete-btn{position:absolute;top:6px;right:6px;background:rgba(239,68,68,0.15);border:none;color:#ef4444;width:20px;height:20px;border-radius:4px;cursor:pointer;font-size:0.65rem;display:none;}
.canvas-component:hover .comp-delete-btn{display:flex;align-items:center;justify-content:center;}
.builder-right{background:#0d0d18;border-left:1px solid var(--border);padding:16px;overflow-y:auto;}
.props-title{font-size:0.82rem;font-weight:700;color:#fff;margin-bottom:12px;}
.props-empty{text-align:center;padding:24px 8px;color:var(--text-dim);font-size:0.82rem;}
.props-empty i{font-size:1.5rem;display:block;margin-bottom:8px;}

/* ── MONETIZE ── */
.monetize-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.revenue-models{display:flex;flex-direction:column;gap:10px;}
.rev-model{display:flex;align-items:center;gap:14px;background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-sm);padding:16px;cursor:pointer;transition:var(--transition);}
.rev-model:hover{border-color:rgba(124,58,237,0.3);}
.rev-model.active{border-color:rgba(124,58,237,0.6);background:rgba(124,58,237,0.06);}
.rev-icon{width:40px;height:40px;background:rgba(124,58,237,0.1);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:1rem;color:#c4b5fd;flex-shrink:0;}
.rev-info h4{font-size:0.9rem;font-weight:700;color:#fff;margin-bottom:2px;}
.rev-info p{font-size:0.78rem;color:var(--text-muted);}
.rev-check{margin-left:auto;color:var(--text-dim);font-size:1rem;}
.rev-model.active .rev-check{color:#10b981;}
.pricing-tiers{display:flex;flex-direction:column;gap:12px;margin-bottom:12px;}
.tier-card{background:rgba(255,255,255,0.03);border:1px solid var(--border);border-radius:var(--radius-sm);padding:16px;}
.tier-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;}
.tier-name-input{background:none;border:none;color:#fff;font-size:0.95rem;font-weight:700;font-family:'Space Grotesk',sans-serif;width:100%;}
.tier-fields{display:grid;grid-template-columns:80px 1fr;gap:12px;}
.tier-price{text-align:center;}
.tier-features{resize:none;}
.stripe-connect{text-align:center;padding:8px;}
.stripe-logo{font-size:1.5rem;color:#635bff;margin-bottom:8px;display:flex;align-items:center;justify-content:center;gap:8px;font-family:'Space Grotesk',sans-serif;font-weight:700;}
.stripe-status{display:inline-flex;align-items:center;gap:6px;font-size:0.82rem;padding:6px 14px;border-radius:100px;margin:12px 0;}
.stripe-status.connected{background:rgba(16,185,129,0.1);border:1px solid rgba(16,185,129,0.3);color:#10b981;}
.payment-features{display:flex;flex-direction:column;gap:8px;}
.pf-item{display:flex;align-items:center;gap:8px;font-size:0.82rem;color:var(--text-muted);}
.pf-item i{color:#10b981;font-size:0.75rem;}
.revenue-projections{grid-column:span 2;}
.proj-inputs{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:20px;}
.proj-inputs input[type=range]{width:100%;accent-color:var(--purple);}
.proj-inputs span{display:block;font-size:0.78rem;color:var(--text-muted);margin-top:4px;}
.proj-results{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.proj-metric{text-align:center;background:rgba(255,255,255,0.03);border-radius:var(--radius-sm);padding:16px;border:1px solid var(--border);}
.pm-num{display:block;font-size:1.5rem;font-weight:800;color:#fff;font-family:'Space Grotesk',sans-serif;background:var(--grad-main);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.pm-label{font-size:0.75rem;color:var(--text-dim);margin-top:4px;}

/* ── DATABASE ── */
.database-layout{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.data-source-cards{display:flex;flex-direction:column;gap:12px;}
.ds-card{display:flex;align-items:center;gap:14px;background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-md);padding:16px;transition:var(--transition);}
.ds-card:hover{border-color:rgba(124,58,237,0.3);}
.ds-logo{width:44px;height:44px;background:rgba(255,255,255,0.04);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:1.2rem;flex-shrink:0;}
.ds-logo.airtable{color:#ffd200;}
.ds-logo.sheets{color:#10b981;}
.ds-logo.notion{color:#fff;}
.ds-logo.supabase{color:#3ecf8e;}
.ds-info h4{font-size:0.9rem;font-weight:700;color:#fff;margin-bottom:4px;}
.ds-info p{font-size:0.78rem;color:var(--text-muted);}

/* ── COMMUNITY ── */
.community-layout{display:grid;grid-template-columns:1fr 280px;gap:20px;}
.community-filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px;}
.cf-btn{padding:7px 16px;border-radius:100px;border:1px solid var(--border);background:none;color:var(--text-muted);font-size:0.82rem;cursor:pointer;transition:var(--transition);}
.cf-btn.active{background:rgba(124,58,237,0.15);border-color:rgba(124,58,237,0.4);color:#c4b5fd;}
.community-posts{display:flex;flex-direction:column;gap:12px;}
.community-post{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-md);padding:20px;transition:var(--transition);}
.community-post:hover{border-color:rgba(124,58,237,0.25);}
.post-author{display:flex;align-items:center;gap:10px;margin-bottom:12px;}
.post-av{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;color:#fff;font-size:0.9rem;}
.post-author-info{display:flex;flex-direction:column;gap:2px;}
.post-author-info strong{font-size:0.875rem;color:#fff;}
.post-badge{display:inline-flex;font-size:0.7rem;padding:2px 8px;border-radius:100px;}
.post-badge.live{background:rgba(16,185,129,0.1);color:#10b981;}
.post-badge.building{background:rgba(245,158,11,0.1);color:#f59e0b;}
.post-title{font-size:1rem;font-weight:700;color:#fff;margin-bottom:8px;}
.post-desc{font-size:0.87rem;color:var(--text-muted);margin-bottom:12px;line-height:1.6;}
.post-tags{display:flex;gap:6px;margin-bottom:14px;flex-wrap:wrap;}
.post-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.post-action{display:flex;align-items:center;gap:6px;background:none;border:1px solid var(--border);color:var(--text-muted);font-size:0.8rem;padding:6px 12px;border-radius:100px;cursor:pointer;transition:var(--transition);}
.post-action:hover{background:rgba(255,255,255,0.05);color:#fff;}
.trending-list{display:flex;flex-direction:column;gap:12px;margin-top:12px;}
.trend-item{display:flex;align-items:center;gap:10px;}
.trend-rank{width:24px;height:24px;background:var(--grad-main);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:0.7rem;font-weight:700;color:#fff;flex-shrink:0;}
.trend-item strong{font-size:0.85rem;color:#fff;display:block;}
.trend-item p{font-size:0.75rem;color:var(--text-dim);}
.comm-stats{display:flex;gap:16px;margin-top:12px;}
.cs-item{text-align:center;flex:1;}
.cs-item span{display:block;font-size:1.1rem;font-weight:800;color:#fff;font-family:'Space Grotesk',sans-serif;}
.cs-item p{font-size:0.72rem;color:var(--text-dim);}

/* ── COLLAB ── */
.collab-layout{display:grid;grid-template-columns:1fr 300px;gap:20px;}
.collab-project-card{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-md);padding:20px;margin-bottom:12px;transition:var(--transition);}
.collab-project-card:hover{border-color:rgba(124,58,237,0.25);}
.cp-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:12px;}
.cp-info h4{font-size:0.95rem;font-weight:700;color:#fff;margin-bottom:4px;}
.cp-info p{font-size:0.8rem;color:var(--text-muted);}
.cp-live{display:flex;align-items:center;gap:6px;font-size:0.78rem;color:#10b981;}
.live-dot{width:8px;height:8px;background:#10b981;border-radius:50%;animation:blink 1.5s ease infinite;}
.cp-collaborators{display:flex;margin-bottom:14px;}
.collab-av{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:0.75rem;color:#fff;border:2px solid var(--dark);margin-left:-6px;}
.collab-av:first-child{margin-left:0;}
.cp-actions{display:flex;gap:8px;flex-wrap:wrap;}
.version-list{display:flex;flex-direction:column;gap:8px;margin-top:8px;}
.version-item{display:flex;align-items:center;gap:10px;padding:8px;border-radius:6px;background:rgba(255,255,255,0.02);}
.vi-dot{width:10px;height:10px;border-radius:50%;background:var(--border);border:2px solid var(--text-dim);flex-shrink:0;}
.vi-dot.current{background:var(--purple);border-color:var(--purple);}
.vi-info strong{font-size:0.82rem;color:#fff;display:block;}
.vi-info p{font-size:0.72rem;color:var(--text-dim);}
.team-list{display:flex;flex-direction:column;gap:10px;margin-top:8px;}
.team-member{display:flex;align-items:center;gap:10px;}
.tm-av{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:0.8rem;color:#fff;}
.tm-info{flex:1;display:flex;align-items:center;gap:8px;}
.tm-info strong{font-size:0.85rem;color:#fff;}
.role-badge{font-size:0.65rem;padding:2px 8px;border-radius:100px;font-weight:600;}
.role-badge.owner{background:rgba(234,179,8,0.15);color:#eab308;border:1px solid rgba(234,179,8,0.3);}
.role-badge.editor{background:rgba(37,99,235,0.15);color:#60a5fa;border:1px solid rgba(37,99,235,0.3);}
.role-badge.viewer{background:rgba(100,116,139,0.15);color:var(--text-muted);border:1px solid var(--border);}

/* ── CODE INJECT ── */
.warning-banner{display:flex;align-items:flex-start;gap:14px;background:rgba(245,158,11,0.08);border:1px solid rgba(245,158,11,0.3);border-radius:var(--radius-sm);padding:14px 18px;margin-bottom:20px;}
.warning-banner i{color:#f59e0b;flex-shrink:0;margin-top:2px;}
.warning-banner strong{color:#fff;display:block;margin-bottom:4px;font-size:0.9rem;}
.warning-banner p{font-size:0.82rem;color:var(--text-muted);}
.code-layout{display:grid;grid-template-columns:200px 1fr;gap:20px;}
.code-sections{display:flex;flex-direction:column;gap:4px;}
.cs-btn{display:flex;align-items:center;gap:8px;padding:9px 12px;border-radius:6px;border:none;background:none;color:var(--text-muted);font-size:0.82rem;cursor:pointer;transition:var(--transition);text-align:left;width:100%;}
.cs-btn.active{background:rgba(124,58,237,0.15);color:#c4b5fd;}
.cs-btn:hover{background:rgba(255,255,255,0.05);color:#fff;}
.cs-btn i{width:14px;text-align:center;}
.integrations-list{display:flex;flex-direction:column;gap:4px;}
.integ-item{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:6px;cursor:pointer;font-size:0.82rem;color:var(--text-muted);transition:var(--transition);}
.integ-item:hover{background:rgba(255,255,255,0.05);color:#fff;}
.integ-add{margin-left:auto;color:var(--purple-light);}
.code-editor-wrap{background:#0a0a12;border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden;}
.editor-header{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;border-bottom:1px solid var(--border);background:#0d0d1a;flex-wrap:wrap;gap:8px;}
.editor-label{font-size:0.78rem;color:var(--text-muted);}
.editor-actions{display:flex;gap:6px;}
.code-editor{display:flex;min-height:300px;max-height:500px;}
.editor-gutter{padding:12px 8px;background:#080812;color:var(--text-dim);font-size:0.78rem;line-height:1.8;font-family:'Courier New',monospace;border-right:1px solid var(--border);min-width:36px;text-align:right;user-select:none;}
.editor-textarea{flex:1;background:#0a0a12;border:none;color:#e2e8f0;font-size:0.85rem;font-family:'Courier New',monospace;line-height:1.8;padding:12px;resize:none;outline:none;}
.editor-status{display:flex;align-items:center;justify-content:space-between;padding:8px 16px;border-top:1px solid var(--border);font-size:0.75rem;}
.status-ok{display:flex;align-items:center;gap:6px;color:#10b981;}
.editor-chars{color:var(--text-dim);}

/* ── ADMIN ── */
.admin-sidebar{background:#08080f!important;}
.admin-logo-icon{background:linear-gradient(135deg,#ef4444,#f59e0b)!important;}
.admin-topbar{border-bottom-color:rgba(239,68,68,0.2)!important;}
.admin-badge{display:flex;align-items:center;gap:6px;background:rgba(239,68,68,0.1);border:1px solid rgba(239,68,68,0.3);color:#ef4444;font-size:0.75rem;font-weight:600;padding:5px 12px;border-radius:100px;}
.admin-back-link{padding:8px 12px 4px;}
.admin-back-link a{display:flex;align-items:center;gap:6px;font-size:0.8rem;color:var(--text-dim);transition:var(--transition);}
.admin-back-link a:hover{color:#fff;}
.admin-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:20px;}
.live-indicator{display:flex;align-items:center;gap:6px;font-size:0.8rem;color:#10b981;}
.admin-table-wrap{overflow-x:auto;}
.admin-table{width:100%;border-collapse:collapse;font-size:0.85rem;}
.admin-table th{padding:10px 14px;text-align:left;font-size:0.72rem;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;color:var(--text-dim);border-bottom:1px solid var(--border);}
.admin-table td{padding:12px 14px;border-bottom:1px solid rgba(255,255,255,0.04);vertical-align:middle;}
.admin-table.full-table th:first-child{width:32px;}
.user-cell{display:flex;align-items:center;gap:10px;}
.uc-av{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:0.8rem;color:#fff;flex-shrink:0;}
.uc-av+div strong{display:block;font-size:0.87rem;color:#fff;}
.uc-av+div small{font-size:0.75rem;color:var(--text-dim);}
.plan-pill{font-size:0.68rem;font-weight:700;padding:2px 8px;border-radius:100px;text-transform:uppercase;letter-spacing:0.04em;}
.plan-pill.pro{background:rgba(124,58,237,0.15);color:#c4b5fd;border:1px solid rgba(124,58,237,0.3);}
.plan-pill.starter{background:rgba(37,99,235,0.12);color:#60a5fa;border:1px solid rgba(37,99,235,0.25);}
.plan-pill.trial{background:rgba(245,158,11,0.1);color:#fcd34d;border:1px solid rgba(245,158,11,0.2);}
.status-pill{font-size:0.72rem;font-weight:600;padding:3px 10px;border-radius:100px;}
.status-pill.active{background:rgba(16,185,129,0.1);color:#10b981;border:1px solid rgba(16,185,129,0.25);}
.status-pill.trial{background:rgba(245,158,11,0.1);color:#f59e0b;border:1px solid rgba(245,158,11,0.25);}
.status-pill.churned{background:rgba(239,68,68,0.1);color:#ef4444;border:1px solid rgba(239,68,68,0.25);}
.row-actions{display:flex;gap:4px;}
.table-pagination{display:flex;align-items:center;justify-content:space-between;padding-top:16px;flex-wrap:wrap;gap:8px;}
.table-info{font-size:0.8rem;color:var(--text-dim);}
.pagination-btns{display:flex;gap:4px;}
.page-btn{width:32px;height:32px;background:none;border:1px solid var(--border);color:var(--text-muted);border-radius:6px;cursor:pointer;font-size:0.82rem;transition:var(--transition);}
.page-btn.active{background:var(--purple);border-color:var(--purple);color:#fff;}
.page-btn:disabled{opacity:0.4;cursor:not-allowed;}
.users-toolbar{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap;}
.search-wrap{position:relative;flex:1;}
.search-wrap i{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--text-dim);font-size:0.85rem;}
.search-input{width:100%;padding:9px 14px 9px 36px;background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-sm);color:#fff;font-size:0.87rem;}
.filter-group{display:flex;gap:8px;flex-wrap:wrap;}
.feature-usage-list{display:flex;flex-direction:column;gap:10px;}
.fu-item{display:flex;align-items:center;gap:10px;font-size:0.82rem;color:var(--text-muted);}
.fu-name{display:flex;align-items:center;gap:6px;width:140px;flex-shrink:0;}
.fu-bar-wrap{flex:1;height:6px;background:rgba(255,255,255,0.06);border-radius:3px;overflow:hidden;}
.fu-bar{height:100%;background:var(--grad-main);border-radius:3px;}
.analytics-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:20px;}
.chart-card{padding:20px;}
.chart-container{position:relative;height:200px;}
.chart-container.short{height:150px;}
.chart-card.half{}

/* ── LAUNCH MONITOR ── */
.launch-kpis{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-bottom:20px;}
.kpi-card{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-md);padding:16px;transition:var(--transition);}
.kpi-card:hover{transform:translateY(-2px);}
.kpi-card.kpi-primary{background:linear-gradient(135deg,rgba(124,58,237,0.08),rgba(37,99,235,0.05));border-color:rgba(124,58,237,0.3);grid-column:span 2;}
.kpi-icon{width:36px;height:36px;border-radius:8px;background:rgba(124,58,237,0.1);display:flex;align-items:center;justify-content:center;font-size:0.9rem;color:#c4b5fd;margin-bottom:10px;}
.kpi-icon.green{background:rgba(16,185,129,0.1);color:#10b981;}
.kpi-icon.blue{background:rgba(37,99,235,0.1);color:#60a5fa;}
.kpi-icon.purple{background:rgba(124,58,237,0.1);color:#c4b5fd;}
.kpi-icon.gold{background:rgba(234,179,8,0.1);color:#eab308;}
.kpi-icon.orange{background:rgba(245,158,11,0.1);color:#f59e0b;}
.kpi-num{font-size:1.5rem;font-weight:900;font-family:'Space Grotesk',sans-serif;color:#fff;}
.kpi-num.green{color:#10b981;}
.kpi-num.blue{color:#60a5fa;}
.kpi-num.purple{color:#c4b5fd;}
.kpi-num.gold{color:#eab308;}
.kpi-num.orange{color:#f59e0b;}
.kpi-label{font-size:0.75rem;color:var(--text-muted);display:block;margin-top:2px;}
.kpi-delta{font-size:0.72rem;display:flex;align-items:center;gap:4px;margin-top:6px;}
.kpi-delta.up{color:#10b981;}
.kpi-delta.down-good{color:#10b981;}
.kpi-delta.down{color:#ef4444;}
.launch-timer{display:flex;align-items:center;gap:6px;background:rgba(124,58,237,0.1);border:1px solid rgba(124,58,237,0.3);color:#c4b5fd;font-size:0.85rem;padding:8px 16px;border-radius:100px;}
.chart-legend{display:flex;align-items:center;gap:8px;font-size:0.78rem;color:var(--text-muted);}
.legend-dot{width:8px;height:8px;border-radius:50%;}
.legend-dot.purple{background:var(--purple);}
.legend-dot.green{background:#10b981;}
.launch-bottom-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:20px;}
.mrr-breakdown{display:flex;flex-direction:column;gap:10px;}
.mrr-item{display:flex;align-items:center;justify-content:space-between;padding:8px 0;border-bottom:1px solid rgba(255,255,255,0.04);}
.mrr-item:last-child{border-bottom:none;}
.mrr-label{display:flex;align-items:center;gap:10px;font-size:0.85rem;color:var(--text-muted);}
.mrr-label span{font-size:0.8rem;color:var(--text-dim);}
.mrr-amount{font-size:0.9rem;font-weight:700;color:#fff;}
.mrr-divider{height:1px;background:var(--border);}
.mrr-total .mrr-amount{font-size:1rem;color:#10b981;}
.churn-chart-wrap{height:80px;margin-bottom:12px;}
.churn-reasons{display:flex;flex-direction:column;gap:6px;}
.cr-item{display:flex;align-items:center;gap:10px;font-size:0.82rem;color:var(--text-muted);}
.cr-pct{font-weight:700;color:#fff;width:32px;}
.launch-checklist{display:flex;flex-direction:column;gap:8px;}
.lc-item{display:flex;align-items:center;gap:10px;font-size:0.85rem;}
.lc-item.done{color:#10b981;}
.lc-item.done i{color:#10b981;}
.lc-item.pending{color:#f59e0b;}
.lc-item.pending i{color:#f59e0b;}
.lc-item.todo{color:var(--text-dim);}
.lc-item.todo i{color:var(--text-dim);}

/* ── AUDIT LOGS ── */
.audit-filters{display:flex;gap:10px;margin-bottom:16px;flex-wrap:wrap;align-items:center;}
.audit-log-list{display:flex;flex-direction:column;gap:2px;}
.audit-log-item{display:flex;align-items:flex-start;gap:14px;padding:14px;border-radius:var(--radius-sm);transition:var(--transition);}
.audit-log-item:hover{background:rgba(255,255,255,0.02);}
.al-icon{width:36px;height:36px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:0.85rem;flex-shrink:0;}
.al-content{flex:1;}
.al-main{display:flex;align-items:center;gap:10px;margin-bottom:4px;flex-wrap:wrap;}
.al-main strong{font-size:0.87rem;color:#fff;}
.al-user{font-size:0.78rem;color:var(--text-dim);}
.al-detail{font-size:0.82rem;color:var(--text-muted);}
.al-meta{display:flex;flex-direction:column;align-items:flex-end;gap:4px;flex-shrink:0;}
.al-time{font-size:0.75rem;color:var(--text-dim);}
.al-type{font-size:0.65rem;text-transform:uppercase;letter-spacing:0.06em;color:var(--text-dim);background:rgba(255,255,255,0.04);padding:2px 6px;border-radius:4px;}

/* ── SSO ── */
.sso-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.enterprise-badge{display:flex;align-items:center;gap:6px;background:rgba(234,179,8,0.1);border:1px solid rgba(234,179,8,0.3);color:#eab308;font-size:0.78rem;font-weight:600;padding:6px 14px;border-radius:100px;}
.sso-providers{display:flex;flex-direction:column;gap:10px;margin-top:16px;}
.sso-provider{display:flex;align-items:center;gap:14px;background:rgba(255,255,255,0.03);border:1px solid var(--border);border-radius:var(--radius-sm);padding:14px;}
.sso-prov-logo{width:40px;height:40px;background:rgba(255,255,255,0.05);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;flex-shrink:0;}
.sso-prov-logo.google{color:#4285f4;}
.sso-prov-logo.ms{color:#00a4ef;}
.sso-prov-logo.okta{color:#007dc1;}
.sso-prov-logo.gh{color:#fff;}
.sso-prov-info{flex:1;}
.sso-prov-info h4{font-size:0.9rem;font-weight:700;color:#fff;margin-bottom:4px;}
.sso-prov-info p{font-size:0.78rem;color:var(--text-muted);}
.toggle-btn{padding:6px 14px;border-radius:100px;font-size:0.78rem;font-weight:600;cursor:pointer;transition:var(--transition);}
.toggle-btn.active{background:rgba(16,185,129,0.15);border:1px solid rgba(16,185,129,0.35);color:#10b981;}
.toggle-btn:not(.active){background:rgba(255,255,255,0.05);border:1px solid var(--border);color:var(--text-muted);}
.security-settings{display:flex;flex-direction:column;gap:14px;}
.sec-setting{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid rgba(255,255,255,0.04);}
.sec-setting:last-child{border-bottom:none;}
.ss-info h4{font-size:0.87rem;font-weight:700;color:#fff;margin-bottom:4px;}
.ss-info p{font-size:0.78rem;color:var(--text-muted);}
.toggle-switch{position:relative;display:inline-block;width:44px;height:24px;flex-shrink:0;}
.toggle-switch input{opacity:0;width:0;height:0;}
.toggle-switch span{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background:rgba(255,255,255,0.1);border-radius:24px;transition:.3s;}
.toggle-switch span::before{position:absolute;content:'';height:18px;width:18px;left:3px;bottom:3px;background:#fff;border-radius:50%;transition:.3s;}
.toggle-switch input:checked+span{background:var(--purple);}
.toggle-switch input:checked+span::before{transform:translateX(20px);}

/* ── SETTINGS ── */
.settings-layout{display:grid;grid-template-columns:200px 1fr;gap:20px;}
.settings-nav{display:flex;flex-direction:column;gap:2px;}
.snav-btn{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--radius-sm);border:none;background:none;color:var(--text-muted);font-size:0.85rem;font-weight:500;cursor:pointer;transition:var(--transition);text-align:left;width:100%;}
.snav-btn:hover{background:rgba(255,255,255,0.05);color:#fff;}
.snav-btn.active{background:rgba(124,58,237,0.15);color:#c4b5fd;}
.snav-btn i{width:16px;text-align:center;}
.settings-panel{display:none;}
.settings-panel.active{display:block;}
.profile-header{display:flex;align-items:center;gap:16px;margin-bottom:20px;}
.profile-avatar-wrap{position:relative;}
.profile-big-av{width:64px;height:64px;background:var(--grad-main);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.5rem;color:#fff;}
.change-av-btn{position:absolute;bottom:-2px;right:-2px;width:22px;height:22px;background:var(--purple);border:2px solid var(--dark);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:0.55rem;color:#fff;cursor:pointer;}
.profile-name-wrap h2{font-size:1.2rem;font-weight:800;color:#fff;margin-bottom:8px;}
.current-plan-display{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;background:rgba(124,58,237,0.06);border:1px solid rgba(124,58,237,0.2);border-radius:var(--radius-sm);padding:16px;margin-bottom:20px;}
.cpd-left{display:flex;align-items:flex-start;gap:12px;}
.plan-icon-lg{width:44px;height:44px;background:var(--grad-main);border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;color:#fff;}
.cpd-left h3{font-size:1rem;font-weight:700;color:#fff;margin-bottom:4px;}
.cpd-left p{font-size:0.82rem;color:var(--text-muted);margin-bottom:6px;}
.trial-info-sm{font-size:0.78rem;color:var(--text-dim);display:flex;align-items:center;gap:6px;}
.plan-compare{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.plan-compare-card{background:rgba(255,255,255,0.02);border:1px solid var(--border);border-radius:var(--radius-sm);padding:16px;}
.plan-compare-card.selected{border-color:rgba(124,58,237,0.4);background:rgba(124,58,237,0.05);}
.current-badge{font-size:0.65rem;background:rgba(124,58,237,0.2);color:#c4b5fd;padding:2px 6px;border-radius:4px;margin-left:6px;}
.plan-compare-card h4{font-size:0.9rem;font-weight:700;color:#fff;margin-bottom:8px;}
.pc-price{font-size:1.4rem;font-weight:900;color:#fff;font-family:'Space Grotesk',sans-serif;margin-bottom:10px;}
.pc-price span{font-size:0.75rem;font-weight:400;color:var(--text-muted);}
.plan-compare-card ul{list-style:none;display:flex;flex-direction:column;gap:6px;}
.plan-compare-card li{font-size:0.8rem;color:var(--text-muted);display:flex;align-items:center;gap:6px;}
.plan-compare-card li i{color:#10b981;font-size:0.72rem;}
.payment-method{display:flex;align-items:center;justify-content:space-between;gap:14px;background:rgba(255,255,255,0.03);border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px 16px;}
.pm-card{display:flex;align-items:center;gap:10px;font-size:0.9rem;color:#fff;}
.pm-card i{font-size:1.5rem;color:#1a1fcf;}
.pm-expiry{font-size:0.78rem;color:var(--text-dim);}
.notif-list{display:flex;flex-direction:column;gap:0;}
.notif-item{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,0.04);}
.notif-item:last-child{border-bottom:none;}
.ni-info h4{font-size:0.87rem;font-weight:700;color:#fff;margin-bottom:4px;}
.ni-info p{font-size:0.78rem;color:var(--text-muted);}
.integrations-grid-full{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.integ-card{display:flex;align-items:center;gap:12px;background:rgba(255,255,255,0.02);border:1px solid var(--border);border-radius:var(--radius-sm);padding:14px;transition:var(--transition);}
.integ-card.connected{border-color:rgba(16,185,129,0.25);background:rgba(16,185,129,0.03);}
.integ-logo{width:36px;height:36px;background:rgba(255,255,255,0.04);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:1.2rem;flex-shrink:0;}
.integ-info{flex:1;}
.integ-info h4{font-size:0.85rem;font-weight:700;color:#fff;margin-bottom:4px;}
.integ-info p{font-size:0.75rem;color:var(--text-muted);}
.conn-badge{font-size:0.65rem;background:rgba(16,185,129,0.15);color:#10b981;padding:2px 6px;border-radius:4px;margin-left:4px;}
.domain-current{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,0.03);border:1px solid var(--border);border-radius:var(--radius-sm);padding:10px 14px;font-size:0.9rem;color:var(--text-muted);}
.dc-badge{background:rgba(37,99,235,0.15);color:#60a5fa;font-size:0.68rem;font-weight:600;padding:2px 8px;border-radius:4px;}
.dns-instructions{background:rgba(255,255,255,0.02);border:1px solid var(--border);border-radius:var(--radius-sm);padding:16px;}
.dns-instructions h4{font-size:0.87rem;font-weight:700;color:#fff;margin-bottom:10px;}
.dns-record{display:flex;gap:12px;background:rgba(0,0,0,0.3);border-radius:6px;padding:10px 14px;font-size:0.82rem;font-family:'Courier New',monospace;flex-wrap:wrap;}
.dns-type{color:#a855f7;font-weight:700;}
.dns-name{color:#60a5fa;}
.dns-value{color:#10b981;}
.api-key-item{background:rgba(255,255,255,0.02);border:1px solid var(--border);border-radius:var(--radius-sm);padding:14px;}
.ak-info h4{font-size:0.87rem;font-weight:700;color:#fff;margin-bottom:4px;}
.ak-info p{font-size:0.78rem;color:var(--text-muted);margin-bottom:10px;}
.ak-key-display{display:flex;align-items:center;gap:8px;background:rgba(0,0,0,0.3);border-radius:6px;padding:8px 12px;font-family:'Courier New',monospace;font-size:0.82rem;color:#c4b5fd;}
.ak-key-display span{flex:1;}
.danger-card{border-color:rgba(239,68,68,0.2)!important;}
.danger-card h3{color:#ef4444;}
.danger-actions{display:flex;flex-direction:column;gap:16px;}
.danger-item{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid rgba(239,68,68,0.1);}
.danger-item:last-child{border-bottom:none;}
.di-info h4{font-size:0.87rem;font-weight:700;color:#fff;margin-bottom:4px;}
.di-info p{font-size:0.78rem;color:var(--text-muted);}

/* ── MODALS ── */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.7);backdrop-filter:blur(6px);z-index:1000;display:flex;align-items:center;justify-content:center;padding:24px;}
.modal-card{background:#14141e;border:1px solid var(--border);border-radius:var(--radius-lg);width:100%;max-width:520px;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;}
.modal-card.large{max-width:780px;}
.modal-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid var(--border);}
.modal-header h3{font-size:1rem;font-weight:700;color:#fff;}
.modal-close{background:none;border:1px solid var(--border);color:var(--text-muted);width:32px;height:32px;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.modal-close:hover{border-color:rgba(255,255,255,0.2);color:#fff;}
.modal-body{padding:24px;overflow-y:auto;}

/* ── LANDING PAGE REUSE ── */
.section-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(124,58,237,0.15);border:1px solid rgba(124,58,237,0.35);color:#c4b5fd;font-size:0.75rem;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;padding:6px 16px;border-radius:100px;margin-bottom:20px;}
.section-badge.light{background:rgba(255,255,255,0.1);border-color:rgba(255,255,255,0.2);color:rgba(255,255,255,0.85);}
.section-title{font-size:clamp(2rem,4vw,3rem);font-weight:800;color:#fff;margin-bottom:16px;}
.section-subtitle{font-size:1.1rem;color:var(--text-muted);max-width:600px;margin:0 auto 64px;text-align:center;}
.section-subtitle.white{color:rgba(255,255,255,0.7);}
.nav{position:fixed;top:0;left:0;right:0;z-index:1000;padding:16px 0;transition:var(--transition);border-bottom:1px solid transparent;}
.nav.scrolled{background:rgba(10,10,15,0.85);backdrop-filter:blur(20px);border-bottom-color:var(--border);padding:12px 0;}
.nav-inner{max-width:1200px;margin:0 auto;padding:0 24px;display:flex;align-items:center;gap:40px;}
.nav-logo{display:flex;align-items:center;gap:10px;font-family:'Space Grotesk',sans-serif;font-weight:800;font-size:1.25rem;color:#fff;flex-shrink:0;}
.nav-logo .logo-icon{width:36px;height:36px;background:var(--grad-main);border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:0.9rem;color:#fff;}
.nav-logo .logo-text sup{font-size:0.5em;vertical-align:super;}
.nav-links{display:flex;list-style:none;gap:32px;flex:1;margin-left:8px;}
.nav-links a{color:var(--text-muted);font-size:0.9rem;font-weight:500;transition:var(--transition);}
.nav-links a:hover{color:#fff;}
.nav-cta-group{margin-left:auto;display:flex;gap:8px;align-items:center;}
.btn-nav-ghost{display:inline-flex;align-items:center;background:none;border:1px solid var(--border);color:var(--text-muted);font-weight:600;font-size:0.85rem;padding:8px 18px;border-radius:100px;transition:var(--transition);}
.btn-nav-ghost:hover{border-color:rgba(255,255,255,0.25);color:#fff;}
.btn-nav{display:inline-flex;align-items:center;background:var(--grad-main);color:#fff;font-weight:700;font-size:0.85rem;padding:10px 22px;border-radius:100px;transition:var(--transition);}
.btn-nav:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(124,58,237,0.5);}
.nav-mobile-toggle{display:none;background:none;border:1px solid var(--border);color:var(--text);padding:8px 12px;border-radius:var(--radius-sm);cursor:pointer;margin-left:auto;font-size:1rem;transition:var(--transition);}
.nav-mobile-menu{display:none;flex-direction:column;padding:16px 24px 20px;gap:4px;background:rgba(10,10,15,0.95);border-top:1px solid var(--border);}
.nav-mobile-menu.open{display:flex;}
.nav-mobile-menu a{padding:10px 0;color:var(--text-muted);font-size:0.95rem;border-bottom:1px solid var(--border);transition:var(--transition);}
.nav-mobile-menu a:hover{color:#fff;}
.btn-mobile-cta{margin-top:12px;background:var(--grad-main)!important;color:#fff!important;text-align:center;padding:12px 0!important;border-radius:var(--radius-sm);font-weight:700;border:none!important;}
.hero{position:relative;min-height:100vh;display:flex;align-items:center;padding:120px 0 80px;overflow:hidden;text-align:center;}
.hero-bg{position:absolute;inset:0;pointer-events:none;overflow:hidden;}
.hero-orb{position:absolute;border-radius:50%;filter:blur(80px);opacity:0.45;animation:orbFloat 8s ease-in-out infinite;}
.orb-1{width:600px;height:600px;background:radial-gradient(circle,#7c3aed,transparent 70%);top:-200px;left:-150px;animation-delay:0s;}
.orb-2{width:500px;height:500px;background:radial-gradient(circle,#2563eb,transparent 70%);top:-100px;right:-100px;animation-delay:-3s;}
.orb-3{width:400px;height:400px;background:radial-gradient(circle,#ec4899,transparent 70%);bottom:0;left:40%;animation-delay:-5s;opacity:0.25;}
.hero-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(124,58,237,0.06) 1px,transparent 1px),linear-gradient(90deg,rgba(124,58,237,0.06) 1px,transparent 1px);background-size:60px 60px;mask-image:radial-gradient(ellipse 80% 60% at 50% 40%,black,transparent);}
.hero-inner{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:24px;}
.hero-badge{display:inline-flex;align-items:center;gap:10px;background:rgba(124,58,237,0.12);border:1px solid rgba(124,58,237,0.4);padding:8px 18px;border-radius:100px;font-size:0.85rem;font-weight:500;color:#c4b5fd;animation:fadeInDown 0.8s ease both;}
.badge-dot{width:8px;height:8px;background:#10b981;border-radius:50%;animation:blink 1.5s ease-in-out infinite;flex-shrink:0;}
.hero-title{font-size:clamp(2.5rem,6vw,4.5rem);font-weight:900;color:#fff;animation:fadeInUp 0.8s ease 0.1s both;}
.hero-subtitle{font-size:clamp(1rem,2vw,1.2rem);color:var(--text-muted);max-width:640px;animation:fadeInUp 0.8s ease 0.2s both;}
.hero-cta-group{display:flex;gap:16px;flex-wrap:wrap;justify-content:center;animation:fadeInUp 0.8s ease 0.3s both;}
.hero-proof{display:flex;align-items:center;gap:12px;animation:fadeInUp 0.8s ease 0.4s both;}
.proof-avatars{display:flex;}
.avatar{width:36px;height:36px;border-radius:50%;border:2px solid var(--dark);background:var(--card-bg);display:flex;align-items:center;justify-content:center;font-size:1.1rem;margin-left:-8px;}
.avatar:first-child{margin-left:0;}
.hero-proof p{font-size:0.9rem;color:var(--text-muted);}
.hero-stats{display:flex;align-items:center;background:rgba(255,255,255,0.04);border:1px solid var(--border);border-radius:var(--radius-lg);padding:24px 40px;animation:fadeInUp 0.8s ease 0.5s both;}
.stat-card{display:flex;flex-direction:column;align-items:center;padding:0 40px;}
.stat-num{font-size:2rem;font-weight:900;font-family:'Space Grotesk',sans-serif;background:var(--grad-main);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.stat-label{font-size:0.8rem;color:var(--text-muted);margin-top:4px;text-align:center;}
.stat-divider{width:1px;height:50px;background:var(--border);}
.logo-bar{padding:36px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:rgba(255,255,255,0.015);overflow:hidden;}
.logo-bar-label{text-align:center;font-size:0.78rem;color:var(--text-dim);text-transform:uppercase;letter-spacing:0.1em;margin-bottom:20px;}
.logo-track-wrapper{overflow:hidden;}
.logo-track{display:flex;gap:32px;white-space:nowrap;animation:marquee 28s linear infinite;font-size:0.9rem;font-weight:600;color:var(--text-dim);}
.logo-track span{flex-shrink:0;}
.problem-section{padding:100px 0 60px;text-align:center;}
.problem-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:60px;text-align:left;}
.problem-card{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-md);padding:28px;transition:var(--transition);}
.problem-card:hover{border-color:rgba(124,58,237,0.4);transform:translateY(-4px);}
.problem-icon{width:48px;height:48px;background:rgba(236,72,153,0.15);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;font-size:1.1rem;color:#f472b6;margin-bottom:16px;}
.problem-card h3{font-size:1.3rem;font-weight:800;color:#fff;margin-bottom:10px;}
.problem-card p{font-size:0.9rem;color:var(--text-muted);line-height:1.7;}
.problem-bridge{display:flex;align-items:center;justify-content:center;gap:20px;color:var(--text-dim);margin-top:16px;}
.bridge-line{flex:1;max-width:200px;height:1px;background:var(--border);}
.bridge-text{display:flex;flex-direction:column;align-items:center;gap:8px;font-size:0.85rem;color:var(--text-muted);}
.bridge-text i{background:var(--grad-main);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-size:1.2rem;animation:bounceDown 1.5s ease infinite;}
.features-section{padding:60px 0 100px;text-align:center;}
.features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;text-align:left;}
.feature-card{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-md);padding:32px;transition:var(--transition);position:relative;overflow:hidden;}
.feature-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:var(--grad-main);opacity:0;transition:var(--transition);}
.feature-card:hover{transform:translateY(-6px);border-color:rgba(124,58,237,0.35);box-shadow:0 24px 48px rgba(0,0,0,0.4);}
.feature-card:hover::before{opacity:1;}
.feature-card.feature-large{grid-row:span 2;}
.feature-icon-wrap{width:52px;height:52px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;font-size:1.2rem;color:#fff;margin-bottom:20px;}
.feature-icon-wrap.purple{background:rgba(124,58,237,0.2);color:#c4b5fd;}
.feature-icon-wrap.blue{background:rgba(37,99,235,0.2);color:#93c5fd;}
.feature-icon-wrap.green{background:rgba(16,185,129,0.2);color:#6ee7b7;}
.feature-icon-wrap.orange{background:rgba(245,158,11,0.2);color:#fcd34d;}
.feature-icon-wrap.pink{background:rgba(236,72,153,0.2);color:#f9a8d4;}
.feature-icon-wrap.teal{background:rgba(20,184,166,0.2);color:#5eead4;}
.feature-card h3{font-size:1.15rem;font-weight:700;color:#fff;margin-bottom:12px;}
.feature-card p{font-size:0.9rem;color:var(--text-muted);line-height:1.7;margin-bottom:20px;}
.feature-perks{list-style:none;display:flex;flex-direction:column;gap:10px;}
.feature-perks li{display:flex;align-items:center;gap:10px;font-size:0.875rem;color:var(--text-muted);}
.feature-perks i{color:#10b981;font-size:0.75rem;}
.hiw-section{padding:100px 0;text-align:center;}
.hiw-steps{display:flex;align-items:flex-start;}
.hiw-step{flex:1;position:relative;text-align:left;}
.hiw-step-number{font-family:'Space Grotesk',sans-serif;font-size:5rem;font-weight:900;line-height:1;background:linear-gradient(135deg,rgba(124,58,237,0.3),rgba(37,99,235,0.1));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:-20px;}
.hiw-step-content{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-md);padding:32px;height:100%;transition:var(--transition);}
.hiw-step:hover .hiw-step-content{border-color:rgba(124,58,237,0.4);transform:translateY(-4px);}
.hiw-icon{width:52px;height:52px;background:var(--grad-main);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;font-size:1.2rem;color:#fff;margin-bottom:20px;}
.hiw-step-content h3{font-size:1.2rem;font-weight:700;color:#fff;margin-bottom:12px;}
.hiw-step-content p{font-size:0.9rem;color:var(--text-muted);line-height:1.7;}
.hiw-example{margin-top:20px;padding:14px;background:rgba(124,58,237,0.08);border:1px solid rgba(124,58,237,0.2);border-radius:var(--radius-sm);font-size:0.8rem;}
.example-label{display:block;font-size:0.7rem;text-transform:uppercase;letter-spacing:0.08em;color:#c4b5fd;margin-bottom:6px;font-weight:600;}
.hiw-example em{color:rgba(255,255,255,0.75);font-style:italic;}
.hiw-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px;}
.hiw-tag{background:rgba(37,99,235,0.12);border:1px solid rgba(37,99,235,0.25);color:#93c5fd;font-size:0.72rem;font-weight:600;padding:4px 12px;border-radius:100px;}
.hiw-result{display:flex;align-items:center;gap:10px;margin-top:20px;padding:12px 16px;background:rgba(16,185,129,0.08);border:1px solid rgba(16,185,129,0.2);border-radius:var(--radius-sm);font-size:0.85rem;color:#6ee7b7;font-weight:600;}
.hiw-result i{color:#f59e0b;}
.hiw-connector{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 8px;margin-top:80px;gap:8px;color:var(--text-dim);flex-shrink:0;}
.connector-line{width:1px;height:30px;background:var(--border);}
.connector-icon{width:32px;height:32px;background:rgba(124,58,237,0.15);border:1px solid rgba(124,58,237,0.3);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:0.65rem;color:#c4b5fd;}
.pricing-section{padding:100px 0;text-align:center;position:relative;overflow:hidden;}
.pricing-bg{position:absolute;inset:0;pointer-events:none;}
.pricing-orb{position:absolute;border-radius:50%;filter:blur(100px);opacity:0.2;}
.orb-a{width:600px;height:600px;background:#7c3aed;top:-200px;left:-200px;}
.orb-b{width:500px;height:500px;background:#2563eb;bottom:-150px;right:-150px;}
.trial-banner{display:inline-flex;align-items:center;gap:12px;background:rgba(16,185,129,0.1);border:1px solid rgba(16,185,129,0.3);color:#6ee7b7;font-size:0.9rem;padding:12px 28px;border-radius:100px;margin-bottom:56px;font-weight:500;}
.trial-banner strong{color:#10b981;font-weight:700;}
.pricing-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;max-width:920px;margin:0 auto 56px;text-align:left;}
.pricing-card{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-lg);padding:40px;position:relative;transition:var(--transition);}
.pricing-card:hover{transform:translateY(-6px);border-color:rgba(124,58,237,0.35);box-shadow:0 30px 60px rgba(0,0,0,0.4);}
.pricing-card-featured{background:linear-gradient(160deg,#1a1040,#12102a,#0d1a30);border-color:rgba(124,58,237,0.5);box-shadow:0 0 60px rgba(124,58,237,0.2);transform:scale(1.02);}
.pricing-card-featured:hover{transform:scale(1.02) translateY(-6px);}
.plan-badge{position:absolute;top:-14px;left:50%;transform:translateX(-50%);background:var(--grad-main);color:#fff;font-size:0.72rem;font-weight:700;padding:5px 18px;border-radius:100px;letter-spacing:0.05em;text-transform:uppercase;white-space:nowrap;}
.plan-header{margin-bottom:28px;}
.plan-icon{width:48px;height:48px;background:rgba(124,58,237,0.15);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;font-size:1.1rem;color:#c4b5fd;margin-bottom:16px;}
.pricing-card-featured .plan-icon{background:var(--grad-main);color:#fff;}
.plan-name{font-size:1.5rem;font-weight:800;color:#fff;margin-bottom:6px;}
.plan-desc{font-size:0.85rem;color:var(--text-muted);line-height:1.6;}
.plan-price{display:flex;align-items:flex-start;gap:2px;margin-bottom:8px;}
.price-currency{font-size:1.5rem;font-weight:700;color:#fff;margin-top:8px;}
.price-amount{font-size:4rem;font-weight:900;line-height:1;color:#fff;font-family:'Space Grotesk',sans-serif;}
.pricing-card-featured .price-amount{background:linear-gradient(135deg,#c4b5fd,#93c5fd);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.price-period{font-size:0.9rem;color:var(--text-muted);align-self:flex-end;padding-bottom:8px;}
.plan-trial{display:inline-flex;font-size:0.78rem;color:#10b981;background:rgba(16,185,129,0.08);border:1px solid rgba(16,185,129,0.2);padding:4px 12px;border-radius:100px;margin-bottom:28px;font-weight:500;}
.plan-features{list-style:none;display:flex;flex-direction:column;gap:12px;margin-bottom:32px;}
.plan-features li{display:flex;align-items:flex-start;gap:10px;font-size:0.9rem;color:var(--text-muted);}
.plan-features li i{margin-top:2px;font-size:0.8rem;flex-shrink:0;}
.plan-features li i.fa-check{color:#10b981;}
.plan-features li.disabled{opacity:0.35;}
.btn-plan{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:14px 24px;border-radius:100px;font-weight:700;font-size:0.95rem;background:rgba(255,255,255,0.07);border:1px solid rgba(255,255,255,0.15);color:#fff;transition:var(--transition);cursor:pointer;}
.btn-plan:hover{background:rgba(255,255,255,0.12);transform:translateY(-2px);}
.btn-plan-featured{background:var(--grad-main);border:none;}
.btn-plan-featured:hover{box-shadow:0 12px 40px rgba(124,58,237,0.5);}
.pricing-guarantee{display:inline-flex;align-items:center;gap:16px;background:rgba(255,255,255,0.04);border:1px solid var(--border);border-radius:var(--radius-md);padding:20px 32px;text-align:left;max-width:480px;margin:0 auto;}
.pricing-guarantee i{font-size:2rem;color:#10b981;flex-shrink:0;}
.pricing-guarantee strong{color:#fff;font-size:0.95rem;display:block;margin-bottom:4px;}
.pricing-guarantee p{font-size:0.83rem;color:var(--text-muted);}
.testimonials-section{padding:100px 0;text-align:center;}
.testimonials-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;text-align:left;}
.testi-card{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-md);padding:32px;transition:var(--transition);display:flex;flex-direction:column;gap:20px;}
.testi-card:hover{border-color:rgba(124,58,237,0.4);transform:translateY(-4px);}
.testi-card.testi-featured{grid-column:span 2;background:linear-gradient(135deg,rgba(124,58,237,0.1),rgba(37,99,235,0.08));border-color:rgba(124,58,237,0.3);}
.testi-stars{color:#f59e0b;font-size:1rem;letter-spacing:2px;}
.testi-quote{font-size:0.95rem;color:var(--text);line-height:1.8;font-style:italic;flex:1;}
.testi-author{display:flex;align-items:center;gap:14px;}
.testi-avatar{width:44px;height:44px;background:var(--dark-3);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.3rem;flex-shrink:0;border:2px solid var(--border);}
.testi-info{display:flex;flex-direction:column;gap:2px;}
.testi-info strong{font-size:0.9rem;color:#fff;}
.testi-info span{font-size:0.8rem;color:var(--text-dim);}
.testi-revenue{margin-left:auto;background:rgba(16,185,129,0.12);border:1px solid rgba(16,185,129,0.3);border-radius:var(--radius-sm);padding:8px 16px;font-size:1.2rem;font-weight:800;color:#10b981;font-family:'Space Grotesk',sans-serif;text-align:center;flex-shrink:0;}
.testi-revenue span{display:block;font-size:0.7rem;font-weight:400;color:#6ee7b7;}
.faq-section{padding:100px 0;text-align:center;}
.faq-grid{display:flex;flex-direction:column;gap:12px;max-width:800px;margin:60px auto 0;text-align:left;}
.faq-item{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden;transition:var(--transition);}
.faq-item:hover{border-color:rgba(124,58,237,0.3);}
.faq-item.open{border-color:rgba(124,58,237,0.45);}
.faq-question{display:flex;align-items:center;justify-content:space-between;padding:22px 28px;cursor:pointer;font-size:0.95rem;font-weight:600;color:#fff;gap:16px;transition:var(--transition);}
.faq-icon{color:var(--text-dim);font-size:0.85rem;transition:var(--transition);flex-shrink:0;}
.faq-item.open .faq-icon{transform:rotate(45deg);color:#c4b5fd;}
.faq-answer{max-height:0;overflow:hidden;transition:max-height 0.4s cubic-bezier(0.4,0,0.2,1);}
.faq-item.open .faq-answer{max-height:300px;}
.faq-answer p{padding:0 28px 24px;font-size:0.9rem;color:var(--text-muted);line-height:1.8;border-top:1px solid var(--border);padding-top:16px;}
.final-cta-section{padding:60px 0 100px;}
.final-cta-card{background:linear-gradient(135deg,#12102a,#1a1040,#0d1a30);border:1px solid rgba(124,58,237,0.3);border-radius:var(--radius-xl);padding:100px 60px;text-align:center;position:relative;overflow:hidden;}
.cta-orb{position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none;}
.cta-orb-1{width:400px;height:400px;background:rgba(124,58,237,0.2);top:-100px;left:-100px;}
.cta-orb-2{width:350px;height:350px;background:rgba(37,99,235,0.15);bottom:-100px;right:-100px;}
.cta-content{position:relative;z-index:2;}
.cta-icon{width:72px;height:72px;background:var(--grad-main);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-size:1.8rem;color:#fff;margin:0 auto 28px;box-shadow:0 20px 40px rgba(124,58,237,0.4);}
.cta-content h2{font-size:clamp(2rem,4vw,3rem);font-weight:900;color:#fff;margin-bottom:16px;}
.cta-content p{font-size:1.05rem;color:rgba(255,255,255,0.65);max-width:520px;margin:0 auto 40px;}
.cta-buttons{display:flex;flex-direction:column;align-items:center;gap:14px;}
.cta-subtext{font-size:0.82rem;color:rgba(255,255,255,0.4);}
.footer{background:var(--dark-2);border-top:1px solid var(--border);padding:72px 0 32px;}
.footer-top{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:60px;margin-bottom:60px;}
.footer-brand p{font-size:0.875rem;color:var(--text-muted);line-height:1.7;margin:16px 0 24px;max-width:260px;}
.footer-social{display:flex;gap:12px;}
.footer-social a{width:38px;height:38px;background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;color:var(--text-muted);font-size:0.9rem;transition:var(--transition);}
.footer-social a:hover{background:rgba(124,58,237,0.15);border-color:rgba(124,58,237,0.4);color:#c4b5fd;}
.footer-links-group h4{font-size:0.8rem;text-transform:uppercase;letter-spacing:0.1em;color:var(--text);font-weight:700;margin-bottom:20px;}
.footer-links-group ul{list-style:none;display:flex;flex-direction:column;gap:12px;}
.footer-links-group a{font-size:0.875rem;color:var(--text-muted);transition:var(--transition);}
.footer-links-group a:hover{color:#fff;}
.footer-bottom{border-top:1px solid var(--border);padding-top:32px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;}
.footer-bottom p{font-size:0.82rem;color:var(--text-dim);}
.footer-tagline{font-style:italic;}

/* ── RESPONSIVE ── */
@media(max-width:1200px){.launch-kpis{grid-template-columns:repeat(3,1fr);}.launch-kpis .kpi-card.kpi-primary{grid-column:span 1;}.launch-bottom-grid{grid-template-columns:1fr 1fr;}.analytics-grid{grid-template-columns:1fr;}}
@media(max-width:1024px){.app-main{margin-left:0;}.sidebar{transform:translateX(-100%);}.sidebar.open{transform:translateX(0);}.sidebar-close{display:flex;}.sidebar-overlay.visible{display:block;}.topbar-menu-btn{display:flex;}.quick-actions-grid{grid-template-columns:repeat(3,1fr);}.blueprint-layout{grid-template-columns:1fr;}.marketing-layout{grid-template-columns:1fr;grid-template-rows:auto 1fr;height:auto;}.builder-layout{grid-template-columns:1fr;height:auto;}.builder-left{max-height:200px;}.builder-right{display:none;}.monetize-grid{grid-template-columns:1fr;}.monetize-grid .revenue-projections{grid-column:auto;}.database-layout{grid-template-columns:1fr;}.community-layout{grid-template-columns:1fr;}.community-sidebar{display:none;}.collab-layout{grid-template-columns:1fr;}.code-layout{grid-template-columns:1fr;}.admin-grid-2{grid-template-columns:1fr;}.sso-grid{grid-template-columns:1fr;}.settings-layout{grid-template-columns:1fr;}.settings-nav{flex-direction:row;flex-wrap:wrap;}.problem-grid{grid-template-columns:repeat(2,1fr);}.features-grid{grid-template-columns:repeat(2,1fr);}.feature-card.feature-large{grid-row:auto;}.testimonials-grid{grid-template-columns:1fr;}.testi-card.testi-featured{grid-column:auto;}.pricing-grid{grid-template-columns:1fr;}.pricing-card-featured{transform:none;}.hero-stats{flex-direction:column;gap:0;padding:24px;}.stat-card{padding:16px 0;}.stat-divider{width:100%;height:1px;}.hiw-steps{flex-direction:column;gap:24px;}.hiw-connector{flex-direction:row;padding:0;margin-top:0;}.connector-line{width:60px;height:1px;}.footer-top{grid-template-columns:1fr 1fr;gap:40px;}}
@media(max-width:768px){.nav-links,.nav-cta-group{display:none;}.nav-mobile-toggle{display:flex;}.auth-split{flex-direction:column;}.auth-left{display:none;}.auth-right{padding:32px 20px;min-height:100vh;}.stats-row{grid-template-columns:repeat(2,1fr);}.quick-actions-grid{grid-template-columns:repeat(2,1fr);}.onb-options-grid{grid-template-columns:repeat(2,1fr);}.integrations-grid-full{grid-template-columns:1fr;}.plan-compare{grid-template-columns:1fr;}.form-row{grid-template-columns:1fr;}.launch-kpis{grid-template-columns:repeat(2,1fr);}.launch-bottom-grid{grid-template-columns:1fr;}.problem-grid{grid-template-columns:1fr;}.features-grid{grid-template-columns:1fr;}.hero-cta-group{flex-direction:column;align-items:center;}.final-cta-card{padding:60px 24px;}.footer-top{grid-template-columns:1fr;}.footer-bottom{flex-direction:column;text-align:center;}.analytics-grid{grid-template-columns:1fr;}}
@media(max-width:480px){.stats-row{grid-template-columns:1fr;}.quick-actions-grid{grid-template-columns:repeat(2,1fr);}.project-card{flex-direction:column;align-items:flex-start;}.project-actions{width:100%;}.admin-table{font-size:0.78rem;}}

/* ── BRAND LOGO REFINEMENTS ── */
.logo-method{background:linear-gradient(135deg,#7c3aed,#2563eb,#ec4899);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:900;}
.auth-logo{font-size:1.05rem!important;}

/* ── SKILL LEVEL SYSTEM ── */
.onb-skill-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:20px 0 24px;}
.onb-skill-card{border:2px solid var(--border);border-radius:16px;padding:24px 20px;cursor:pointer;transition:var(--transition);position:relative;text-align:left;}
.onb-skill-card:hover{border-color:var(--purple);transform:translateY(-2px);}
.onb-skill-card.active{border-color:var(--purple);background:rgba(124,58,237,0.06);}
.skill-badge-pop{position:absolute;top:-10px;right:16px;background:var(--gradient);color:#fff;font-size:0.7rem;font-weight:700;padding:3px 10px;border-radius:20px;}
.skill-icon{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;margin-bottom:12px;}
.skill-icon.beginner{background:rgba(16,185,129,0.15);color:#10b981;}
.skill-icon.intermediate{background:rgba(124,58,237,0.15);color:#7c3aed;}
.skill-icon.advanced{background:rgba(239,68,68,0.15);color:#ef4444;}
.onb-skill-card h4{font-size:0.95rem;font-weight:700;margin-bottom:6px;}
.onb-skill-card p{font-size:0.82rem;color:var(--text-muted);margin-bottom:12px;line-height:1.5;}
.skill-features{list-style:none;display:flex;flex-direction:column;gap:5px;}
.skill-features li{font-size:0.8rem;color:var(--text-muted);display:flex;align-items:center;gap:6px;}
.skill-features li i{color:#10b981;font-size:0.7rem;}
.skill-badge{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:20px;font-size:0.75rem;font-weight:600;}
.skill-badge.beginner{background:rgba(16,185,129,0.15);color:#10b981;}
.skill-badge.intermediate{background:rgba(124,58,237,0.15);color:#7c3aed;}
.skill-badge.advanced{background:rgba(239,68,68,0.15);color:#ef4444;}
.skill-adaptive-section{background:var(--surface-2);border-radius:12px;padding:16px;margin:12px 0;}
.skill-hint-box{font-size:0.82rem;color:var(--text-muted);padding:10px 12px;background:rgba(124,58,237,0.06);border-left:3px solid var(--purple);border-radius:0 8px 8px 0;margin-top:10px;line-height:1.5;}
.skill-hint-box:empty{display:none;}

/* ── IDEA GENERATOR TABS ── */
.idea-input-tabs{display:flex;gap:4px;border-bottom:1px solid var(--border);padding-bottom:0;margin-bottom:20px;}
.itab{background:none;border:none;padding:10px 16px;font-size:0.875rem;font-weight:500;color:var(--text-muted);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;transition:var(--transition);display:flex;align-items:center;gap:6px;}
.itab:hover{color:var(--text);}
.itab.active{color:var(--purple);border-bottom-color:var(--purple);}
.itab-panel{display:none;}
.itab-panel.active{display:block;}
.itab-panel h3{font-size:0.95rem;font-weight:700;margin-bottom:6px;display:flex;align-items:center;gap:8px;color:var(--text);}
.itab-panel p{font-size:0.85rem;color:var(--text-muted);margin-bottom:14px;}

/* ── SCRAPE INPUT ── */
.scrape-input-row{display:flex;gap:10px;margin-bottom:16px;}
.flex-1{flex:1;}
.scrape-result-card{background:var(--surface-2);border:1px solid var(--border);border-radius:12px;padding:20px;animation:fadeIn 0.3s ease;}
.scrape-status{display:flex;align-items:center;gap:8px;font-size:0.9rem;font-weight:600;margin-bottom:14px;color:var(--text);}
.scrape-fields{display:flex;flex-direction:column;gap:10px;margin-bottom:16px;}
.scrape-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px;}
.scrape-tag{background:rgba(124,58,237,0.1);color:var(--purple);border:1px solid rgba(124,58,237,0.2);border-radius:20px;padding:3px 10px;font-size:0.75rem;font-weight:500;}

/* ── NICHE SELECTOR ── */
.niche-selector-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:14px;}
.niche-preview-card{background:linear-gradient(135deg,rgba(124,58,237,0.06),rgba(37,99,235,0.06));border:1px solid rgba(124,58,237,0.2);border-radius:12px;padding:16px;}
.np-label{font-size:0.78rem;text-transform:uppercase;letter-spacing:0.08em;color:var(--purple);font-weight:700;margin-bottom:8px;display:flex;align-items:center;gap:6px;}

/* ── IDEA GENERATOR CONTROLS ── */
.idea-controls-row{margin-top:16px;border-top:1px solid var(--border);padding-top:16px;}
.idea-options-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:14px;}
.btn-generate-ideas{width:100%;}
.autofill-hint{font-size:0.8rem;color:var(--text-muted);margin-top:6px;}
.autofill-hint a{color:var(--purple);}

/* ── BLUEPRINT SKILL HINTS ── */
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.mt-8{margin-top:8px;}
.mt-12{margin-top:12px;}
.mt-20{margin-top:20px;}

/* ── MARKETING AUDIENCE DROPDOWN ── */
#mktAudienceCustom{transition:var(--transition);}

/* ── DASHBOARD SKILL BADGE ── */
#dashSkillBadge .skill-badge{font-size:0.8rem;}

/* ── RESPONSIVE ADDITIONS ── */
@media(max-width:1024px){
  .idea-options-grid{grid-template-columns:repeat(2,1fr);}
  .niche-selector-row{grid-template-columns:1fr;}
  .onb-skill-grid{grid-template-columns:1fr;}
}
@media(max-width:768px){
  .idea-options-grid{grid-template-columns:1fr 1fr;}
  .scrape-input-row{flex-direction:column;}
  .onb-skill-grid{grid-template-columns:1fr;}
}

/* ── MARKETING OUTPUT STYLES ── */
.mkt-output-card { display:flex; flex-direction:column; gap:0; }
.mkt-result-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; flex-wrap:wrap; gap:10px; }
.mkt-result-header h3 { font-size:1.1rem; font-weight:700; color:#fff; }
.lp-section { padding:20px 0; border-bottom:1px solid rgba(255,255,255,0.06); }
.lp-section:last-child { border-bottom:none; }
.lp-label { font-size:0.7rem; font-weight:700; text-transform:uppercase; letter-spacing:0.1em; color:#7c3aed; margin-bottom:10px; }
.lp-headline { font-size:1.5rem; font-weight:800; color:#fff; line-height:1.3; font-family:'Space Grotesk',sans-serif; margin-bottom:10px; }
.lp-sub { color:#94a3b8; font-size:0.95rem; margin-bottom:14px; }
.lp-cta { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.lp-testimonial { background:rgba(124,58,237,0.08); border-left:3px solid #7c3aed; padding:14px 18px; border-radius:0 10px 10px 0; font-size:0.9rem; color:#c4b5fd; font-style:italic; }
.lp-bullets { list-style:none; padding:0; display:flex; flex-direction:column; gap:8px; margin-top:8px; }
.lp-bullets li { font-size:0.9rem; color:#94a3b8; padding:10px 14px; background:rgba(255,255,255,0.03); border-radius:8px; }
.lp-pitch { font-size:0.95rem; color:#e2e8f0; line-height:1.7; padding:16px; background:rgba(255,255,255,0.03); border-radius:10px; }
.mkt-email { background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.06); border-radius:12px; overflow:hidden; }
.email-header { padding:14px 18px; background:rgba(255,255,255,0.04); font-size:0.875rem; color:#94a3b8; border-bottom:1px solid rgba(255,255,255,0.06); }
.email-body { padding:18px; font-size:0.875rem; color:#e2e8f0; line-height:1.8; }
.email-body p { margin-bottom:10px; }
.email-body ul { padding-left:20px; margin-bottom:10px; }
.email-body li { margin-bottom:4px; }
.email-body a { color:#a78bfa; }
.mt-16 { margin-top:16px; }
.mt-12 { margin-top:12px; }
.mt-8 { margin-top:8px; }
.social-post { background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.06); border-radius:12px; padding:18px; }
.social-post p { font-size:0.875rem; color:#e2e8f0; line-height:1.7; white-space:pre-wrap; margin-top:10px; }
.sp-platform { font-size:0.8rem; font-weight:700; color:#94a3b8; display:flex; align-items:center; gap:8px; }
.sp-platform i { font-size:1rem; }
.sp-platform i.fa-instagram { color:#e1306c; }
.sp-platform i.fa-tiktok { color:#fff; }
.sp-platform i.fa-twitter { color:#1da1f2; }
.sp-platform i.fa-linkedin { color:#0a66c2; }
.sp-platform i.fa-facebook { color:#1877f2; }
.ad-copy-item { background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.06); border-radius:12px; padding:18px; }
.ac-label { font-size:0.7rem; font-weight:700; text-transform:uppercase; letter-spacing:0.08em; color:#64748b; margin-bottom:8px; }
.ac-headline { font-size:1.05rem; font-weight:700; color:#fff; margin-bottom:8px; }
.ac-body { font-size:0.875rem; color:#94a3b8; line-height:1.6; margin-bottom:10px; }
.ac-desc { font-size:0.82rem; color:#94a3b8; line-height:1.5; }
.ac-cta { display:inline-block; background:linear-gradient(135deg,#7c3aed,#2563eb); color:#fff; padding:8px 18px; border-radius:100px; font-size:0.82rem; font-weight:700; margin-top:6px; }

/* ═══════════════════════════════════════════════════════════
   VIBE CODING ADVISOR
   ═══════════════════════════════════════════════════════════ */
.vibe-wizard { display:flex; flex-direction:column; gap:0; }
.vibe-phase { display:none; }
.vibe-phase.active { display:block; }
.vibe-phase-header { display:flex; align-items:flex-start; gap:16px; margin-bottom:24px; }
.vibe-phase-num { width:40px; height:40px; background:linear-gradient(135deg,#7c3aed,#2563eb); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1rem; font-weight:800; color:#fff; flex-shrink:0; font-family:'Space Grotesk',sans-serif; }
.vibe-phase-header h3 { font-size:1.1rem; font-weight:700; color:#fff; margin-bottom:4px; }
.required { color:#ef4444; }
.text-muted { font-size:0.85rem; color:#64748b; }
.feature-checkbox-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(200px,1fr)); gap:8px; margin-top:8px; }
.fcheck { display:flex; align-items:center; gap:8px; padding:10px 14px; background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.06); border-radius:8px; cursor:pointer; font-size:0.875rem; color:#94a3b8; transition:0.2s; }
.fcheck:hover { background:rgba(124,58,237,0.08); border-color:rgba(124,58,237,0.3); color:#c4b5fd; }
.fcheck input { width:16px; height:16px; accent-color:#7c3aed; flex-shrink:0; }

/* Tool Recommendation Cards */
.vibe-back-bar { display:flex; align-items:center; gap:12px; margin-bottom:16px; }
.vibe-app-label { font-size:0.875rem; color:#94a3b8; }
.vibe-tools-grid { display:flex; flex-direction:column; gap:16px; margin-bottom:20px; }
.vibe-tool-card { background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.08); border-radius:16px; padding:24px; position:relative; transition:0.2s; }
.vibe-tool-card.top-pick { border-color:rgba(124,58,237,0.5); background:rgba(124,58,237,0.06); }
.tool-top-badge { position:absolute; top:-12px; left:24px; background:linear-gradient(135deg,#7c3aed,#2563eb); color:#fff; font-size:0.75rem; font-weight:700; padding:4px 14px; border-radius:100px; }
.tool-rank-badge { position:absolute; top:16px; right:16px; background:rgba(255,255,255,0.06); color:#64748b; font-size:0.72rem; font-weight:700; padding:3px 10px; border-radius:100px; }
.tool-card-header { display:flex; align-items:center; gap:16px; margin-bottom:14px; }
.tool-emoji { font-size:2rem; flex-shrink:0; }
.tool-name { font-size:1.05rem; font-weight:700; color:#fff; }
.tool-tagline { font-size:0.8rem; color:#64748b; margin-top:2px; }
.tool-difficulty { font-size:0.72rem; font-weight:700; padding:4px 12px; border-radius:100px; margin-left:auto; flex-shrink:0; }
.tool-difficulty.easiest { background:rgba(16,185,129,0.1); color:#10b981; border:1px solid rgba(16,185,129,0.2); }
.tool-difficulty.easy { background:rgba(16,185,129,0.1); color:#10b981; border:1px solid rgba(16,185,129,0.2); }
.tool-difficulty.intermediate { background:rgba(245,158,11,0.1); color:#f59e0b; border:1px solid rgba(245,158,11,0.2); }
.tool-difficulty.easy-to-medium { background:rgba(245,158,11,0.08); color:#f59e0b; border:1px solid rgba(245,158,11,0.15); }
.tool-pricing { display:flex; align-items:center; gap:10px; margin-bottom:12px; flex-wrap:wrap; }
.tool-free-tag { font-size:0.78rem; font-weight:600; color:#10b981; padding:3px 10px; background:rgba(16,185,129,0.08); border:1px solid rgba(16,185,129,0.2); border-radius:100px; display:flex; align-items:center; gap:6px; }
.tool-paid-tag { font-size:0.78rem; color:#64748b; }
.tool-strengths { display:flex; flex-direction:column; gap:6px; margin-bottom:14px; }
.tool-strength { display:flex; align-items:center; gap:8px; font-size:0.82rem; color:#94a3b8; }
.tool-strength i { color:#10b981; font-size:0.72rem; flex-shrink:0; }
.tool-best-for { font-size:0.82rem; color:#94a3b8; padding:10px 14px; background:rgba(124,58,237,0.06); border-radius:8px; margin-bottom:14px; }
.tool-best-for i { color:#f59e0b; margin-right:6px; }
.tool-actions { display:flex; gap:10px; flex-wrap:wrap; }
.vibe-tool-note { display:flex; align-items:flex-start; gap:12px; padding:14px 18px; background:rgba(245,158,11,0.06); border:1px solid rgba(245,158,11,0.2); border-radius:10px; margin-top:4px; }
.vibe-tool-note i { color:#f59e0b; margin-top:2px; flex-shrink:0; }
.vibe-tool-note p { font-size:0.85rem; color:#94a3b8; }

/* Step-by-Step Prompts */
.vibe-progress-wrap { margin-bottom:20px; }
.vibe-prog-bar { height:6px; background:rgba(255,255,255,0.06); border-radius:100px; overflow:hidden; margin-bottom:8px; }
.vibe-prog-fill { height:100%; background:linear-gradient(90deg,#7c3aed,#10b981); border-radius:100px; transition:width 0.5s ease; }
.vibe-prog-label { font-size:0.8rem; color:#64748b; }
.vibe-how-to { display:flex; align-items:center; gap:8px; padding:16px; background:rgba(37,99,235,0.06); border:1px solid rgba(37,99,235,0.15); border-radius:12px; margin-bottom:20px; flex-wrap:wrap; }
.vht-item { display:flex; flex-direction:column; align-items:center; gap:6px; text-align:center; }
.vht-num { width:28px; height:28px; background:rgba(37,99,235,0.2); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:0.8rem; font-weight:700; color:#93c5fd; }
.vht-item p { font-size:0.78rem; color:#94a3b8; max-width:100px; }
.vht-arrow { color:#64748b; font-size:0.75rem; }
.vibe-step-card { border:1px solid rgba(255,255,255,0.08); border-radius:14px; padding:20px; margin-bottom:16px; transition:0.3s; }
.vibe-step-card.active-step { border-color:rgba(124,58,237,0.4); background:rgba(124,58,237,0.04); animation:fadeInUp 0.3s ease; }
.vibe-step-card.completed-step { opacity:0.6; border-color:rgba(16,185,129,0.2); background:rgba(16,185,129,0.03); }
.vibe-step-header { display:flex; align-items:center; gap:14px; margin-bottom:16px; }
.vibe-step-num { width:36px; height:36px; background:linear-gradient(135deg,#7c3aed,#2563eb); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:0.9rem; font-weight:800; color:#fff; flex-shrink:0; font-family:'Space Grotesk',sans-serif; }
.vibe-step-header h4 { font-size:0.95rem; font-weight:700; color:#fff; }
.vibe-step-status { font-size:0.72rem; font-weight:600; padding:3px 10px; border-radius:100px; display:flex; align-items:center; gap:5px; margin-left:auto; flex-shrink:0; }
.vibe-step-status.pending { background:rgba(245,158,11,0.1); color:#f59e0b; border:1px solid rgba(245,158,11,0.2); }
.vibe-step-status.done { background:rgba(16,185,129,0.1); color:#10b981; border:1px solid rgba(16,185,129,0.2); }
.vibe-prompt-box { background:rgba(0,0,0,0.3); border:1px solid rgba(124,58,237,0.3); border-radius:12px; padding:16px; margin-bottom:14px; }
.vpb-label { font-size:0.72rem; font-weight:700; text-transform:uppercase; letter-spacing:0.08em; color:#7c3aed; margin-bottom:10px; display:flex; align-items:center; gap:6px; }
.vibe-prompt-text { font-size:0.9rem; color:#e2e8f0; line-height:1.7; font-family:'Space Grotesk',sans-serif; }
.vibe-step-actions { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:12px; }
.btn-success-sm { padding:8px 16px; background:rgba(16,185,129,0.15); border:1px solid rgba(16,185,129,0.3); color:#10b981; border-radius:8px; font-size:0.8rem; font-weight:600; cursor:pointer; display:flex; align-items:center; gap:6px; transition:0.2s; }
.btn-success-sm:hover { background:rgba(16,185,129,0.25); }
.btn-success-sm:disabled { opacity:0.4; cursor:not-allowed; }
.btn-locked { opacity:0.5; cursor:not-allowed !important; }
.vibe-step-tip { display:flex; align-items:flex-start; gap:8px; font-size:0.78rem; color:#64748b; padding:10px; background:rgba(255,255,255,0.02); border-radius:8px; }
.vibe-step-tip i { color:#f59e0b; flex-shrink:0; margin-top:1px; }

/* Blueprint Document */
.vibe-loading-bp { display:flex; flex-direction:column; align-items:center; gap:16px; padding:60px 20px; text-align:center; }
.vibe-loading-bp h3 { color:#fff; font-size:1.1rem; }
.vibe-loading-bp p { color:#64748b; font-size:0.875rem; }
.vibe-complete-banner { display:flex; align-items:center; gap:16px; padding:18px 20px; background:linear-gradient(135deg,rgba(16,185,129,0.1),rgba(124,58,237,0.08)); border:1px solid rgba(16,185,129,0.2); border-radius:14px; margin-bottom:24px; flex-wrap:wrap; }
.vcb-icon { font-size:2rem; flex-shrink:0; }
.vibe-complete-banner h3 { font-size:1rem; font-weight:700; color:#fff; }
.vibe-complete-banner p { font-size:0.8rem; color:#64748b; margin-top:4px; }
.vibe-steps-summary { margin-bottom:24px; }
.vss-item { display:flex; align-items:center; gap:12px; padding:10px; background:rgba(255,255,255,0.02); border-radius:8px; margin-bottom:6px; }
.vss-num { width:24px; height:24px; background:rgba(16,185,129,0.15); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:0.72rem; font-weight:700; color:#10b981; flex-shrink:0; }
.vss-item p { font-size:0.78rem; color:#94a3b8; flex:1; }
.vibe-blueprint-doc { background:rgba(0,0,0,0.3); border:1px solid rgba(255,255,255,0.08); border-radius:16px; padding:28px; margin-bottom:24px; }
.vbd-header { display:flex; align-items:center; gap:20px; padding-bottom:20px; border-bottom:1px solid rgba(255,255,255,0.08); margin-bottom:20px; }
.vbd-icon { width:48px; height:48px; background:linear-gradient(135deg,#7c3aed,#2563eb); border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:1.3rem; color:#fff; flex-shrink:0; }
.vbd-header h2 { font-size:1.2rem; font-weight:800; color:#fff; }
.vbd-header p { font-size:0.8rem; color:#64748b; margin-top:4px; }
.vibe-next-steps h4 { font-size:0.95rem; font-weight:700; color:#fff; display:flex; align-items:center; gap:8px; margin-bottom:14px; }
.vns-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.vns-card { display:flex; flex-direction:column; align-items:center; gap:8px; padding:16px; background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.06); border-radius:12px; text-decoration:none; text-align:center; transition:0.2s; }
.vns-card:hover { border-color:rgba(124,58,237,0.4); background:rgba(124,58,237,0.06); transform:translateY(-2px); }
.vns-card i { font-size:1.2rem; color:#7c3aed; }
.vns-card strong { font-size:0.82rem; color:#fff; }
.vns-card p { font-size:0.75rem; color:#64748b; }
@media(max-width:768px){ .vns-grid{grid-template-columns:1fr 1fr;} .vibe-how-to{gap:6px;} .tool-card-header{flex-wrap:wrap;} }

/* ══════════════════════════════════════════════════════
   SIMPLE APP BUILDER — 5th grade friendly styles
   ══════════════════════════════════════════════════════ */
.simple-builder-wrap { display:grid; grid-template-columns:380px 1fr; gap:24px; align-items:start; }
.sb-left { display:flex; flex-direction:column; gap:16px; }
.sb-step-card { background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.08); border-radius:16px; padding:20px; }
.sb-step-header { display:flex; align-items:flex-start; gap:14px; margin-bottom:16px; }
.sb-step-num { width:34px; height:34px; min-width:34px; background:linear-gradient(135deg,#7c3aed,#2563eb); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:0.9rem; font-weight:800; color:#fff; }
.sb-step-header h3 { font-size:0.95rem; font-weight:700; color:#fff; margin:0 0 2px; }

/* App type buttons */
.sb-app-types { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.sb-type-btn { background:rgba(255,255,255,0.04); border:2px solid rgba(255,255,255,0.08); border-radius:12px; padding:12px 8px; display:flex; flex-direction:column; align-items:center; gap:4px; cursor:pointer; transition:0.2s; color:#94a3b8; font-size:1.3rem; }
.sb-type-btn span { font-size:0.72rem; font-weight:600; color:#94a3b8; }
.sb-type-btn:hover { border-color:rgba(124,58,237,0.4); background:rgba(124,58,237,0.06); }
.sb-type-btn.active { border-color:#7c3aed; background:rgba(124,58,237,0.12); }
.sb-type-btn.active span { color:#c4b5fd; }

/* Block buttons grid */
.sb-blocks-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.sb-block-btn { background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.08); border-radius:12px; padding:14px 8px 10px; display:flex; flex-direction:column; align-items:center; gap:3px; cursor:pointer; transition:0.2s; font-size:1.4rem; line-height:1; }
.sb-block-btn span { font-size:0.72rem; font-weight:700; color:#fff; margin-top:4px; }
.sb-block-btn small { font-size:0.62rem; color:#64748b; text-align:center; line-height:1.2; }
.sb-block-btn:hover { border-color:rgba(124,58,237,0.5); background:rgba(124,58,237,0.08); transform:translateY(-2px); box-shadow:0 4px 16px rgba(124,58,237,0.15); }
.sb-block-btn:active { transform:scale(0.96); }
@keyframes sbFlash { 0%,100%{background:rgba(255,255,255,0.04)} 50%{background:rgba(16,185,129,0.18);border-color:#10b981} }
.sb-btn-flash { animation:sbFlash 0.5s ease; }

/* Template row */
.sb-templates-row { display:flex; flex-wrap:wrap; gap:8px; }
.sb-tmpl-btn { background:rgba(124,58,237,0.08); border:1px solid rgba(124,58,237,0.25); border-radius:100px; padding:7px 14px; font-size:0.8rem; font-weight:600; color:#c4b5fd; cursor:pointer; transition:0.2s; white-space:nowrap; }
.sb-tmpl-btn:hover { background:rgba(124,58,237,0.18); border-color:#7c3aed; }

/* Right: canvas */
.sb-right { position:sticky; top:20px; background:rgba(255,255,255,0.02); border:1px solid rgba(255,255,255,0.08); border-radius:16px; overflow:hidden; min-height:500px; display:flex; flex-direction:column; }
.sb-canvas-header { display:flex; align-items:center; justify-content:space-between; padding:12px 16px; background:rgba(255,255,255,0.03); border-bottom:1px solid rgba(255,255,255,0.06); }
.sb-canvas-title { font-size:0.9rem; font-weight:700; color:#fff; }
.sb-canvas-actions { display:flex; gap:6px; }
.sb-canvas { flex:1; overflow-y:auto; padding:0; max-height:75vh; }
.sb-canvas-empty { display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:60px 32px; gap:12px; min-height:400px; }
.sb-canvas-empty h3 { font-size:1rem; font-weight:700; color:#fff; }
.sb-canvas-empty p { font-size:0.85rem; color:#64748b; }
.sb-canvas-count { display:flex; align-items:center; gap:8px; padding:10px 16px; background:rgba(255,255,255,0.02); border-top:1px solid rgba(255,255,255,0.06); font-size:0.8rem; color:#94a3b8; }

/* Section wrappers in canvas */
.sb-section-wrap { position:relative; border-bottom:1px solid rgba(255,255,255,0.04); }
.sb-section-bar { display:flex; align-items:center; justify-content:space-between; padding:6px 12px; background:rgba(124,58,237,0.06); border-bottom:1px solid rgba(124,58,237,0.1); }
.sb-section-bar span { font-size:0.72rem; font-weight:600; color:#c4b5fd; }
.sb-section-acts { display:flex; gap:4px; }
.sb-section-acts button { background:transparent; border:none; color:#64748b; cursor:pointer; padding:3px 6px; border-radius:4px; font-size:0.7rem; transition:0.15s; }
.sb-section-acts button:hover { color:#fff; background:rgba(255,255,255,0.08); }
.sb-del-btn:hover { color:#f87171 !important; background:rgba(248,113,113,0.1) !important; }

/* Preview block base */
.sb-preview-block { padding:20px 24px; background:rgba(10,10,20,0.6); }

/* Header block */
.sb-header-block { display:flex; align-items:center; justify-content:space-between; padding:16px 24px; background:rgba(15,15,30,0.9); border-bottom:1px solid rgba(255,255,255,0.06); }
.sb-prev-logo { font-size:0.95rem; font-weight:800; color:#fff; }
.sb-prev-nav { display:flex; gap:16px; }
.sb-prev-nav span { font-size:0.78rem; color:#94a3b8; cursor:pointer; }

/* Hero block */
.sb-hero-block { text-align:center; padding:40px 24px; background:linear-gradient(180deg,rgba(124,58,237,0.12) 0%,rgba(10,10,20,0) 100%); }
.sb-hero-block h2 { font-size:1.2rem; font-weight:800; color:#fff; margin-bottom:10px; line-height:1.4; }
.sb-hero-block p { font-size:0.85rem; color:#94a3b8; margin-bottom:20px; }
.sb-prev-btn { background:linear-gradient(135deg,#7c3aed,#2563eb); border:none; color:#fff; padding:10px 24px; border-radius:100px; font-size:0.85rem; font-weight:700; cursor:pointer; }

/* Features block */
.sb-features-block h3 { font-size:0.95rem; font-weight:700; color:#fff; margin-bottom:16px; text-align:center; }
.sb-prev-grid3 { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.sb-prev-feature { background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.06); border-radius:12px; padding:14px; text-align:center; }
.sb-feat-icon { font-size:1.5rem; margin-bottom:8px; }
.sb-prev-feature strong { font-size:0.8rem; font-weight:700; color:#fff; display:block; margin-bottom:4px; }
.sb-prev-feature p { font-size:0.72rem; color:#64748b; }

/* Pricing block */
.sb-pricing-block h3 { font-size:0.95rem; font-weight:700; color:#fff; margin-bottom:16px; text-align:center; }
.sb-prev-grid2 { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.sb-prev-plan { background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.08); border-radius:12px; padding:16px; text-align:center; position:relative; }
.sb-prev-plan.featured { border-color:rgba(124,58,237,0.5); background:rgba(124,58,237,0.07); }
.sb-plan-badge { font-size:0.65rem; font-weight:700; color:#c4b5fd; background:rgba(124,58,237,0.2); border-radius:100px; padding:3px 10px; display:inline-block; margin-bottom:8px; }
.sb-prev-plan h4 { font-size:0.85rem; font-weight:700; color:#fff; margin-bottom:8px; }
.sb-plan-price { font-size:1.6rem; font-weight:900; color:#fff; margin-bottom:10px; }
.sb-plan-price span { font-size:0.8rem; color:#94a3b8; font-weight:400; }
.sb-prev-plan ul { list-style:none; margin-bottom:14px; display:flex; flex-direction:column; gap:5px; }
.sb-prev-plan li { font-size:0.72rem; color:#94a3b8; }
.sb-prev-plan button { background:rgba(124,58,237,0.15); border:1px solid rgba(124,58,237,0.3); color:#c4b5fd; padding:7px 16px; border-radius:100px; font-size:0.75rem; font-weight:600; cursor:pointer; width:100%; }

/* Signup + Contact forms */
.sb-signup-block h3, .sb-contact-block h3 { font-size:0.95rem; font-weight:700; color:#fff; margin-bottom:16px; text-align:center; }
.sb-prev-form { max-width:380px; margin:0 auto; display:flex; flex-direction:column; gap:10px; }
.sb-prev-form input, .sb-prev-form textarea { background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.1); border-radius:8px; padding:10px 14px; color:#94a3b8; font-size:0.82rem; width:100%; box-sizing:border-box; }
.sb-prev-form textarea { resize:none; }

/* Testimonials */
.sb-testi-block h3 { font-size:0.95rem; font-weight:700; color:#fff; margin-bottom:16px; text-align:center; }
.sb-prev-testi { background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.06); border-radius:12px; padding:16px; }
.sb-testi-stars { color:#f59e0b; font-size:0.85rem; margin-bottom:8px; }
.sb-prev-testi p { font-size:0.78rem; color:#94a3b8; font-style:italic; margin-bottom:10px; }
.sb-prev-testi strong { font-size:0.72rem; color:#64748b; }

/* Gallery */
.sb-gallery-block h3 { font-size:0.95rem; font-weight:700; color:#fff; margin-bottom:16px; text-align:center; }
.sb-prev-gallery { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.sb-gal-thumb { aspect-ratio:4/3; background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.06); border-radius:8px; display:flex; align-items:center; justify-content:center; color:#334155; font-size:1.2rem; }

/* Table */
.sb-table-block h3 { font-size:0.95rem; font-weight:700; color:#fff; margin-bottom:16px; }
.sb-prev-table { width:100%; border-collapse:collapse; font-size:0.78rem; }
.sb-prev-table th { background:rgba(255,255,255,0.04); color:#94a3b8; font-weight:600; padding:8px 12px; text-align:left; border-bottom:1px solid rgba(255,255,255,0.06); }
.sb-prev-table td { padding:8px 12px; color:#94a3b8; border-bottom:1px solid rgba(255,255,255,0.04); }
.sb-badge { display:inline-block; font-size:0.65rem; font-weight:700; padding:2px 8px; border-radius:100px; }
.sb-badge.green { background:rgba(16,185,129,0.12); color:#10b981; border:1px solid rgba(16,185,129,0.2); }
.sb-badge.blue { background:rgba(37,99,235,0.12); color:#60a5fa; border:1px solid rgba(37,99,235,0.2); }

/* Video */
.sb-video-block h3 { font-size:0.95rem; font-weight:700; color:#fff; margin-bottom:16px; text-align:center; }
.sb-prev-video { background:rgba(0,0,0,0.4); border:1px solid rgba(255,255,255,0.06); border-radius:12px; padding:40px 24px; text-align:center; color:#64748b; }
.sb-prev-video i { font-size:2.5rem; margin-bottom:12px; display:block; }
.sb-prev-video p { font-size:0.82rem; }

/* FAQ */
.sb-faq-block h3 { font-size:0.95rem; font-weight:700; color:#fff; margin-bottom:16px; }
.sb-prev-faq { display:flex; flex-direction:column; gap:10px; }
.sb-faq-item { background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.06); border-radius:10px; padding:12px 16px; }
.sb-faq-item strong { font-size:0.82rem; color:#fff; display:block; margin-bottom:5px; }
.sb-faq-item p { font-size:0.75rem; color:#94a3b8; }

/* Footer */
.sb-footer-block { background:rgba(5,5,15,0.8); }
.sb-prev-footer { text-align:center; }
.sb-prev-footer strong { font-size:0.9rem; color:#fff; display:block; margin-bottom:12px; }
.sb-footer-links { display:flex; gap:16px; justify-content:center; margin-bottom:12px; }
.sb-footer-links span { font-size:0.75rem; color:#64748b; }
.sb-prev-footer p { font-size:0.72rem; color:#475569; }

/* Responsive */
@media(max-width:1024px){ .simple-builder-wrap{grid-template-columns:1fr;} .sb-right{position:static;} }
@media(max-width:600px){ .sb-blocks-grid{grid-template-columns:repeat(2,1fr);} .sb-app-types{grid-template-columns:repeat(2,1fr);} .sb-prev-grid3{grid-template-columns:1fr;} .sb-prev-grid2{grid-template-columns:1fr;} }

/* ══════════════════════════════════════════════════════
   VIBE ADVISOR — BLUEPRINT DOCUMENT STYLES
   ══════════════════════════════════════════════════════ */

/* Section wrapper */
.bp-section { margin-bottom:28px; background:rgba(255,255,255,0.02); border:1px solid rgba(255,255,255,0.07); border-radius:14px; padding:20px; }
.bp-section-success { border-color:rgba(16,185,129,0.25); background:rgba(16,185,129,0.04); }
.bp-section-warning { border-color:rgba(245,158,11,0.25); background:rgba(245,158,11,0.03); }
.bp-section-danger  { border-color:rgba(248,113,113,0.25); background:rgba(248,113,113,0.03); }
.bp-section-launch  { border-color:rgba(124,58,237,0.3); background:rgba(124,58,237,0.05); }

/* Section heading label */
.bp-section-label { display:flex; align-items:center; gap:8px; font-size:0.85rem; font-weight:800; text-transform:uppercase; letter-spacing:0.07em; color:#c4b5fd; margin-bottom:14px; }
.bp-section-label i { font-size:0.9rem; opacity:0.85; }

/* Section body (overview text) */
.bp-section-body { }

/* ── BUILD STEPS ── */
.bp-steps-list { display:flex; flex-direction:column; gap:10px; }
.bp-step-card { display:flex; align-items:flex-start; gap:14px; background:rgba(0,0,0,0.2); border:1px solid rgba(255,255,255,0.06); border-radius:12px; padding:14px 16px; }
.bp-step-num  { min-width:32px; height:32px; background:linear-gradient(135deg,#7c3aed,#2563eb); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:0.85rem; font-weight:800; color:#fff; font-family:'Space Grotesk',sans-serif; flex-shrink:0; }
.bp-step-body { flex:1; }
.bp-step-title { font-size:0.9rem; font-weight:700; color:#fff; margin-bottom:5px; }
.bp-step-what  { font-size:0.82rem; color:#94a3b8; line-height:1.6; margin-bottom:8px; }
.bp-step-hint  { display:flex; align-items:center; gap:6px; font-size:0.76rem; color:#f59e0b; background:rgba(245,158,11,0.07); border:1px solid rgba(245,158,11,0.15); border-radius:7px; padding:5px 10px; }
.bp-step-hint i { flex-shrink:0; }

/* ── API CARDS ── */
.bp-apis-list { display:flex; flex-direction:column; gap:12px; }
.bp-api-card  { background:rgba(0,0,0,0.25); border:1px solid rgba(255,255,255,0.08); border-radius:12px; padding:14px 16px; }
.bp-api-top   { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:8px; flex-wrap:wrap; }
.bp-api-name  { display:flex; align-items:center; gap:8px; font-size:0.9rem; font-weight:700; color:#fff; }
.bp-api-name i { color:#7c3aed; font-size:0.85rem; }
.bp-api-diff  { font-size:0.7rem; font-weight:700; padding:3px 10px; border-radius:100px; flex-shrink:0; }
.bp-api-purpose { font-size:0.82rem; color:#94a3b8; line-height:1.5; margin-bottom:8px; }
.bp-api-free  { display:flex; align-items:center; gap:6px; font-size:0.76rem; color:#10b981; margin-bottom:8px; }
.bp-api-free i { flex-shrink:0; }
.bp-api-link  { display:flex; align-items:center; gap:7px; font-size:0.78rem; color:#60a5fa; text-decoration:none; word-break:break-all; }
.bp-api-link:hover { color:#93c5fd; text-decoration:underline; }
.bp-api-link i { flex-shrink:0; font-size:0.72rem; }
.bp-no-api { display:flex; align-items:center; gap:12px; padding:14px 18px; background:rgba(16,185,129,0.08); border:1px solid rgba(16,185,129,0.2); border-radius:10px; font-size:0.85rem; color:#10b981; }
.bp-no-api i { font-size:1.1rem; flex-shrink:0; }

/* ── TECH STACK ── */
.bp-stack-list { display:flex; flex-direction:column; gap:10px; }
.bp-stack-item { display:flex; align-items:center; gap:14px; background:rgba(0,0,0,0.2); border:1px solid rgba(255,255,255,0.06); border-radius:10px; padding:12px 14px; }
.bp-stack-icon { width:34px; height:34px; background:rgba(124,58,237,0.15); border:1px solid rgba(124,58,237,0.25); border-radius:8px; display:flex; align-items:center; justify-content:center; color:#c4b5fd; font-size:0.85rem; flex-shrink:0; }
.bp-stack-item strong { font-size:0.88rem; font-weight:700; color:#fff; display:block; margin-bottom:2px; }
.bp-stack-item p { font-size:0.78rem; color:#64748b; margin:0; }

/* ── ERROR / WATCH-OUT CARDS ── */
.bp-errors-list { display:flex; flex-direction:column; gap:10px; }
.bp-error-card  { background:rgba(0,0,0,0.2); border:1px solid rgba(248,113,113,0.15); border-radius:12px; padding:14px 16px; }
.bp-err-top     { display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.bp-err-emoji   { font-size:1.3rem; flex-shrink:0; line-height:1; }
.bp-err-top strong { font-size:0.88rem; font-weight:700; color:#fca5a5; }
.bp-err-fix     { display:flex; align-items:flex-start; gap:8px; font-size:0.8rem; color:#94a3b8; line-height:1.5; margin:0; }
.bp-err-fix i   { color:#10b981; margin-top:2px; flex-shrink:0; }

/* ── LAUNCH CHECKLIST ── */
.bp-launch-list { display:flex; flex-direction:column; gap:8px; }
.bp-check-item  { display:flex; align-items:center; gap:12px; padding:10px 14px; background:rgba(0,0,0,0.2); border:1px solid rgba(255,255,255,0.06); border-radius:10px; cursor:pointer; transition:0.2s; user-select:none; }
.bp-check-item:hover { border-color:rgba(124,58,237,0.3); background:rgba(124,58,237,0.04); }
.bp-check-item.checked { border-color:rgba(16,185,129,0.3); background:rgba(16,185,129,0.05); }
.bp-check-item input[type=checkbox] { accent-color:#10b981; width:16px; height:16px; flex-shrink:0; cursor:pointer; }
.bp-check-item span { font-size:0.85rem; color:#e2e8f0; }
.bp-check-item.checked span { color:#64748b; text-decoration:line-through; }

/* ── RESPONSIVE ── */
@media(max-width:600px){
  .bp-step-card { flex-direction:column; }
  .bp-api-top   { flex-direction:column; align-items:flex-start; }
}

/* ══════════════════════════════════════════════════════
   BLUEPRINT — STEP-BY-STEP PROMPT CARDS (hero section)
   ══════════════════════════════════════════════════════ */

/* Hero steps section */
.bp-section-steps-hero { border:1px solid rgba(124,58,237,0.25); background:rgba(124,58,237,0.04); border-radius:16px; padding:20px; }

/* Steps legend row */
.bp-steps-legend { display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-bottom:18px; padding:10px 14px; background:rgba(0,0,0,0.2); border-radius:10px; }
.bsl-done { display:flex; align-items:center; gap:6px; font-size:0.78rem; font-weight:600; color:#10b981; }
.bsl-done i { color:#10b981; }
.bsl-next { display:flex; align-items:center; gap:6px; font-size:0.78rem; font-weight:600; color:#94a3b8; }
.bsl-next i { color:#94a3b8; }
.bsl-tip  { display:flex; align-items:center; gap:6px; font-size:0.78rem; color:#7c3aed; margin-left:auto; }
.bsl-tip i { flex-shrink:0; }
@media(max-width:600px){ .bsl-tip { margin-left:0; } }

/* Full-width steps list */
.bp-steps-list-full { display:flex; flex-direction:column; gap:14px; }

/* Enhanced step card with done/pending states */
.bp-step-card { display:flex; align-items:flex-start; gap:14px; background:rgba(0,0,0,0.25); border:1px solid rgba(255,255,255,0.07); border-radius:14px; padding:16px 18px; transition:0.2s; }
.bp-step-card:hover { border-color:rgba(124,58,237,0.3); }

/* Completed step */
.bp-step-done { background:rgba(16,185,129,0.05); border-color:rgba(16,185,129,0.25); }
.bp-step-done .bp-step-num { background:linear-gradient(135deg,#10b981,#059669); }
.bp-step-done .bp-step-num i { font-size:0.85rem; }

/* Step number circle */
.bp-step-num { min-width:36px; height:36px; background:linear-gradient(135deg,#7c3aed,#2563eb); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:0.85rem; font-weight:800; color:#fff; font-family:'Space Grotesk',sans-serif; flex-shrink:0; }

/* Step body */
.bp-step-body { flex:1; min-width:0; }

/* Header row: title + badge */
.bp-step-header-row { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:6px; }
.bp-step-title { font-size:0.95rem; font-weight:700; color:#fff; }
.bp-step-done-badge { display:inline-flex; align-items:center; gap:5px; font-size:0.68rem; font-weight:700; padding:3px 10px; background:rgba(16,185,129,0.12); color:#10b981; border:1px solid rgba(16,185,129,0.25); border-radius:100px; white-space:nowrap; }
.bp-step-pending-badge { display:inline-flex; align-items:center; gap:5px; font-size:0.68rem; font-weight:700; padding:3px 10px; background:rgba(124,58,237,0.12); color:#c4b5fd; border:1px solid rgba(124,58,237,0.25); border-radius:100px; white-space:nowrap; }

/* What this step does */
.bp-step-what { font-size:0.82rem; color:#94a3b8; line-height:1.6; margin:0 0 10px; }

/* Prompt box inside the step */
.bp-step-prompt { background:rgba(0,0,0,0.35); border:1px solid rgba(124,58,237,0.2); border-radius:10px; padding:12px 14px; position:relative; }
.bp-step-prompt-label { display:flex; align-items:center; gap:6px; font-size:0.7rem; font-weight:700; text-transform:uppercase; letter-spacing:0.07em; color:#7c3aed; margin-bottom:8px; }
.bp-step-prompt-label i { font-size:0.8rem; }
.bp-step-prompt-text { font-size:0.82rem; color:#e2e8f0; line-height:1.7; white-space:pre-wrap; word-break:break-word; }
.bp-copy-prompt-btn { display:inline-flex; align-items:center; gap:6px; margin-top:10px; padding:5px 14px; background:rgba(124,58,237,0.15); color:#c4b5fd; border:1px solid rgba(124,58,237,0.3); border-radius:8px; font-size:0.75rem; font-weight:600; cursor:pointer; transition:0.2s; }
.bp-copy-prompt-btn:hover { background:rgba(124,58,237,0.3); }

/* Completion banner progress bar */
.vcb-progress { margin-left:auto; text-align:right; min-width:100px; }
.vcb-prog-bar { height:8px; background:rgba(0,0,0,0.3); border-radius:100px; overflow:hidden; margin-bottom:5px; }
.vcb-prog-fill { height:100%; background:linear-gradient(90deg,#10b981,#059669); border-radius:100px; transition:width 0.5s; }
.vcb-progress span { font-size:0.72rem; font-weight:700; color:#10b981; }
@media(max-width:600px){ .vcb-progress { margin-left:0; } .bp-step-header-row { flex-wrap:wrap; } }

/* ══════════════════════════════════════════════════════
   VIBE ADVISOR — TOOL CATEGORY BADGE (top-3 cards)
   ══════════════════════════════════════════════════════ */
.tool-cat-badge { display:inline-block; font-size:0.68rem; font-weight:700; padding:3px 10px; border-radius:100px; border:1px solid; margin-bottom:4px; letter-spacing:0.04em; }
.tool-limitations { display:flex; flex-direction:column; gap:5px; margin-bottom:12px; }
.tool-limit { display:flex; align-items:center; gap:8px; font-size:0.78rem; color:#64748b; }
.tool-limit i { color:#f87171; font-size:0.7rem; flex-shrink:0; }

/* ══════════════════════════════════════════════════════
   VIBE ADVISOR — ALL TOOLS DIRECTORY
   ══════════════════════════════════════════════════════ */
.at-header { margin-bottom:20px; }
.at-header h3 { font-size:1rem; font-weight:800; color:#fff; margin-bottom:4px; }

/* Category groups */
.at-groups { display:flex; flex-direction:column; gap:20px; }
.at-group-header { display:flex; align-items:center; gap:10px; font-size:0.78rem; font-weight:800; text-transform:uppercase; letter-spacing:0.08em; color:#94a3b8; margin-bottom:10px; }
.at-group-dot { width:8px; height:8px; border-radius:50%; flex-shrink:0; }

/* Tool mini-cards grid */
.at-cards { display:grid; grid-template-columns:repeat(auto-fill, minmax(220px, 1fr)); gap:10px; }
.at-card { background:rgba(255,255,255,0.02); border:1px solid rgba(255,255,255,0.07); border-radius:12px; padding:14px; transition:0.2s; position:relative; }
.at-card:hover { border-color:rgba(124,58,237,0.35); background:rgba(124,58,237,0.05); transform:translateY(-2px); }
.at-card-rec { border-color:rgba(16,185,129,0.3); background:rgba(16,185,129,0.04); }
.at-card-rec:hover { border-color:rgba(16,185,129,0.5); }
.at-rec-star { position:absolute; top:-9px; left:12px; font-size:0.65rem; font-weight:700; background:linear-gradient(135deg,#10b981,#059669); color:#fff; padding:2px 10px; border-radius:100px; white-space:nowrap; }

/* Card top row */
.at-card-top { display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.at-emoji { font-size:1.5rem; flex-shrink:0; line-height:1; }
.at-name { font-size:0.85rem; font-weight:700; color:#fff; display:block; margin-bottom:3px; }
.at-diff { font-size:0.65rem; font-weight:700; padding:2px 8px; border-radius:100px; }
.at-diff.easiest { background:rgba(16,185,129,0.1); color:#10b981; border:1px solid rgba(16,185,129,0.2); }
.at-diff.easy { background:rgba(16,185,129,0.1); color:#10b981; border:1px solid rgba(16,185,129,0.2); }
.at-diff.intermediate { background:rgba(245,158,11,0.1); color:#f59e0b; border:1px solid rgba(245,158,11,0.2); }
.at-diff.easy-to-medium { background:rgba(245,158,11,0.08); color:#f59e0b; border:1px solid rgba(245,158,11,0.15); }

/* Tagline */
.at-tagline { font-size:0.75rem; color:#64748b; line-height:1.4; margin-bottom:10px; }

/* Pricing row */
.at-pricing { display:flex; align-items:center; gap:8px; margin-bottom:10px; flex-wrap:wrap; }
.at-free { font-size:0.7rem; font-weight:600; color:#10b981; padding:2px 8px; background:rgba(16,185,129,0.08); border:1px solid rgba(16,185,129,0.2); border-radius:100px; }
.at-paid-only { color:#f59e0b; background:rgba(245,158,11,0.08); border-color:rgba(245,158,11,0.2); }
.at-price-from { font-size:0.7rem; color:#475569; }

/* Actions */
.at-actions { display:flex; gap:6px; align-items:center; }
.at-build-btn { flex:1; justify-content:center; }

/* Responsive */
@media(max-width:768px){
  .at-cards { grid-template-columns:1fr 1fr; }
}
@media(max-width:480px){
  .at-cards { grid-template-columns:1fr; }
}
