/*
  Crevyro 2026 visual redesign
  Bright creator-SaaS direction inspired by Zorcha's visual rhythm, without copying its assets.
  This file intentionally overrides the legacy stylesheet while preserving all existing IDs,
  forms, routes and JavaScript hooks.
*/

:root{
  --bg:#f7f7fb;
  --surface:#ffffff;
  --surface-soft:#f3f2f8;
  --text:#111016;
  --soft:#686572;
  --border:#e8e6ed;
  --primary:#7457ff;
  --primary-dark:#5d3fee;
  --primary-soft:#eeeaff;
  --danger:#d9415d;
  --success:#148f68;
  --warning:#a66310;
  --shadow:0 24px 80px rgba(38,29,68,.10);
  --radius-lg:28px;
  --radius-md:20px;
  --radius-sm:14px;
  --sidebar:278px;
  --pink:#ff83c5;
  --orange:#ffad67;
  --lime:#c9f27a;
  --ink:#15131b;
}

html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:"Rooftop",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
body::selection{background:#d9d0ff;color:#211a43}
h1,h2,h3,h4,strong{letter-spacing:-.035em}
h1,h2,h3{font-family:"Rooftop",sans-serif}
p{color:var(--soft)}
.eyebrow{color:#7657ef;font-size:.68rem;letter-spacing:.16em}

/* Shared brand */
.brand-mark{width:38px;height:38px}
.brand-mark:before{inset:0;border-radius:13px;background:linear-gradient(145deg,#ff85c8 0%,#8a64ff 48%,#5c3ce8 100%);transform:rotate(7deg);box-shadow:0 10px 24px rgba(105,74,236,.30)}
.brand-mark span{width:4px}
.brand-lockup strong{font-size:1.28rem}
.brand-copy small{font-weight:700;letter-spacing:.13em}

/* Global controls */
.button{min-height:48px;border-radius:14px;padding:0 21px;font-weight:800;letter-spacing:-.015em;box-shadow:none;transition:transform .18s ease,box-shadow .18s ease,background .18s ease}
.button:hover{transform:translateY(-2px)}
.button.primary{background:var(--ink);box-shadow:0 12px 28px rgba(18,16,23,.18)}
.button.primary:hover{background:#2b2732;box-shadow:0 16px 34px rgba(18,16,23,.22)}
.button.secondary{color:#292532;background:#efedf4}
.button.light{color:#251b52;background:#fff;box-shadow:0 12px 26px rgba(43,28,98,.13)}
.button.danger-outline{border-color:#f3cbd4;border-radius:14px}
.icon-button{width:43px;height:43px;border-radius:14px;border-color:#e7e4ed;box-shadow:0 7px 18px rgba(38,31,57,.04)}
.text-button{color:#6547e9}
.field input,.field select,.field textarea,.search-field,.reply-box textarea{border-color:#e4e1ea;border-radius:14px;background:#fff}
.field input,.field select{height:50px}
.field textarea{padding:15px}
.field input:focus,.field select:focus,.field textarea:focus,.search-field:focus-within,.reply-box textarea:focus{border-color:#8d73ff;box-shadow:0 0 0 4px rgba(116,87,255,.11)}

/* Loading */
.boot-screen{background:radial-gradient(circle at 50% 42%,#eee9ff 0,transparent 28%),#fff}
.boot-screen p{color:#544f5c}

/* Marketing shell */
.marketing-site{position:relative;overflow:hidden;background:#fffdfb}
.marketing-site::before{content:"";position:absolute;z-index:0;top:120px;left:-210px;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,#ffd7eb 0,rgba(255,215,235,0) 70%);pointer-events:none}
.marketing-site::after{content:"";position:absolute;z-index:0;top:500px;right:-230px;width:560px;height:560px;border-radius:50%;background:radial-gradient(circle,#ddd3ff 0,rgba(221,211,255,0) 70%);pointer-events:none}
.marketing-header{position:relative;z-index:50;width:min(1220px,calc(100% - 40px));height:76px;margin:18px auto 0;padding:0 15px 0 19px;border:1px solid rgba(229,225,235,.9);border-radius:24px;background:rgba(255,255,255,.82);box-shadow:0 14px 44px rgba(36,27,62,.07);backdrop-filter:blur(22px)}
.marketing-brand{border:0;background:transparent}
.marketing-brand .brand-copy small{color:#7d7785}
.marketing-auth-actions{gap:7px}
.marketing-login{background:transparent;color:#25212c}
.marketing-auth-actions .compact{min-height:45px;border-radius:13px;padding-inline:19px;background:var(--primary);box-shadow:0 10px 22px rgba(116,87,255,.22)}
.marketing-auth-actions .compact:hover{background:var(--primary-dark)}

.marketing-section{position:relative;z-index:1;width:min(1220px,calc(100% - 40px));margin-inline:auto}
.marketing-hero{min-height:780px;display:grid;grid-template-columns:minmax(0,.88fr) minmax(500px,1.12fr);align-items:center;gap:54px;padding:90px 0 88px}
.hero-copy{position:relative;z-index:4;max-width:610px}
.hero-badge{display:inline-flex;align-items:center;gap:9px;margin-bottom:23px;padding:9px 14px;border:1px solid #e4ddff;border-radius:999px;color:#563bc4;background:rgba(246,242,255,.9);font-size:.78rem;font-weight:800;box-shadow:0 8px 24px rgba(91,62,196,.06)}
.hero-badge i{width:8px;height:8px;border-radius:50%;background:#8a65ff;box-shadow:0 0 0 5px rgba(138,101,255,.13)}
.hero-copy h1{max-width:720px;margin:0 0 24px;font-size:clamp(3.25rem,6.2vw,6.25rem);line-height:.91;letter-spacing:-.075em}
.hero-copy h1::after{content:"";display:inline-block;width:.32em;height:.32em;margin-left:.07em;border-radius:50%;background:linear-gradient(135deg,var(--pink),var(--primary));vertical-align:.12em;box-shadow:0 7px 20px rgba(238,104,178,.3)}
.hero-copy>p{max-width:585px;margin-bottom:31px;color:#615d68;font-size:1.08rem;line-height:1.72}
.hero-actions{display:flex;flex-wrap:wrap;gap:11px}
.hero-primary{min-height:56px;padding-inline:25px;background:var(--primary)!important;box-shadow:0 16px 30px rgba(116,87,255,.25)!important}
.hero-primary:hover{background:var(--primary-dark)!important}
.hero-secondary{min-height:56px;border:1px solid #dfdbe5;color:#26222d;background:#fff;box-shadow:0 12px 30px rgba(40,33,57,.06)}
.hero-trust{display:flex;flex-wrap:wrap;gap:16px 21px;margin-top:27px}
.hero-trust span{position:relative;padding-left:18px;color:#706a76;font-size:.75rem;font-weight:700}
.hero-trust span::before{content:"✓";position:absolute;left:0;color:#7656ef;font-weight:900}

.hero-product{position:relative;min-height:600px;display:grid;place-items:center}
.hero-product::before{content:"";position:absolute;width:580px;height:580px;border-radius:42% 58% 58% 42%/50% 42% 58% 50%;background:linear-gradient(145deg,#ffcfad 0%,#ff96cf 37%,#9c7cff 76%,#6b4de8 100%);filter:saturate(1.05);transform:rotate(-6deg);box-shadow:0 40px 100px rgba(132,78,192,.22)}
.hero-product::after{content:"";position:absolute;inset:38px 15px 25px 65px;border:1px solid rgba(255,255,255,.35);border-radius:50%;transform:rotate(18deg);pointer-events:none}
.product-window{position:relative;z-index:2;width:min(710px,100%);overflow:hidden;border:1px solid rgba(255,255,255,.82);border-radius:29px;background:#fff;box-shadow:0 36px 95px rgba(46,27,86,.27);transform:rotate(1.1deg)}
.product-top{height:50px;padding:0 17px;border-bottom:1px solid #ece9f0;background:#fbfafc}
.product-top span{width:9px;height:9px}
.product-top small{margin-left:9px;padding:6px 13px;border-radius:999px;background:#f0edf4;color:#837c8a}
.product-body{min-height:420px}
.product-sidebar{width:88px;padding:20px 15px;background:#17141c}
.product-sidebar .mini-brand b{display:none}
.product-sidebar .brand-mark{width:31px;height:31px}
.product-sidebar i{height:35px;border-radius:10px;background:#2a2630}
.product-sidebar i.active{background:#7d60ff}
.product-content{padding:27px;background:#f8f7fb}
.product-heading strong{font-size:1.35rem}
.product-heading>b{padding:10px 13px;border-radius:11px;color:#fff;background:#16131b}
.product-stats{gap:10px}
.product-stats span{padding:15px;border:1px solid #ebe8ef;border-radius:16px;background:#fff}
.product-stats b{font-size:1.4rem}
.product-flow{padding:21px;border:1px solid #eae7ef;border-radius:20px;background:#fff}
.flow-node{border:1px solid #e7e2ed;border-radius:15px;box-shadow:0 7px 18px rgba(40,32,59,.045)}
.flow-node em{border-radius:12px;background:#eeeaff}
.floating-result{z-index:5;right:-15px;bottom:42px;padding:14px 18px;border:1px solid rgba(255,255,255,.9);border-radius:18px;background:rgba(255,255,255,.93);box-shadow:0 22px 50px rgba(45,29,82,.2);backdrop-filter:blur(16px);transform:rotate(-3deg)}
.floating-result>span{background:#d5f699;color:#25380a}
.hero-social-card{position:absolute;z-index:6;max-width:245px;display:flex;align-items:center;gap:11px;padding:13px 15px;border:1px solid rgba(255,255,255,.9);border-radius:18px;background:rgba(255,255,255,.94);box-shadow:0 22px 55px rgba(50,29,91,.18);backdrop-filter:blur(14px)}
.hero-social-card strong{display:block;font-size:.77rem}.hero-social-card small{display:block;margin-top:3px;color:#77717e;font-size:.68rem;line-height:1.35}
.hero-social-card .social-avatar{width:38px;height:38px;display:grid;place-items:center;flex:0 0 auto;border-radius:50%;background:linear-gradient(145deg,#ffb073,#ff7fbc 50%,#7d5dff);color:#fff;font-size:.82rem;font-weight:900}
.hero-social-card.comment-card{left:-8px;top:88px;transform:rotate(-4deg)}
.hero-social-card.dm-card{right:-8px;top:155px;transform:rotate(4deg)}

.creator-proof{position:relative;z-index:3;width:min(1220px,calc(100% - 40px));display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:10px;margin:0 auto 96px;padding:10px;border:1px solid #e9e5ed;border-radius:24px;background:#fff;box-shadow:0 18px 56px rgba(39,31,59,.06)}
.creator-proof>div{min-height:94px;display:flex;align-items:center;gap:14px;padding:17px 20px;border-radius:17px;background:#faf9fc}
.creator-proof>div:first-child{background:linear-gradient(135deg,#1c1823,#31283f);color:#fff}
.creator-proof strong{display:block;font:800 1.15rem/1.15 "Rooftop",sans-serif}.creator-proof small{display:block;margin-top:5px;color:#7a7480;font-size:.73rem}.creator-proof>div:first-child small{color:rgba(255,255,255,.65)}
.proof-icon{width:43px;height:43px;display:grid;place-items:center;flex:0 0 auto;border-radius:14px;background:#eeeaff;color:#6748df;font-weight:900}.creator-proof>div:first-child .proof-icon{background:#9a7dff;color:#fff}

.section-heading{max-width:760px;margin-bottom:45px}
.section-heading h2,.pricing-copy h2{margin:.15em 0 .36em;font-size:clamp(2.45rem,4.7vw,4.65rem);line-height:1.01;letter-spacing:-.065em}
.section-heading>p:last-child,.pricing-copy>p:last-child{max-width:650px;font-size:1rem;line-height:1.7}

.about-section{padding:42px 0 112px}
.about-section::before{content:"";position:absolute;right:0;top:110px;width:220px;height:220px;border-radius:50%;background:#e9e1ff;filter:blur(2px);opacity:.65}
.about-grid{position:relative;display:grid;grid-template-columns:1.14fr .93fr .93fr;gap:18px}
.about-grid article{min-height:290px;padding:30px;border:1px solid #e9e5ed;border-radius:28px;background:#fff;box-shadow:0 18px 48px rgba(38,30,56,.055);transition:transform .2s ease,box-shadow .2s ease}
.about-grid article:hover{transform:translateY(-6px);box-shadow:0 28px 65px rgba(38,30,56,.09)}
.about-grid article:first-child{color:#fff;background:linear-gradient(145deg,#17141d,#3c2d59)}
.about-grid article:nth-child(2){background:#fff1e4}
.about-grid article:nth-child(3){background:#efffd4}
.about-grid article>span{width:48px;height:48px;display:grid;place-items:center;margin-bottom:70px;border-radius:15px;background:#f1edff;color:#694ade;font-weight:900}
.about-grid article:first-child>span{background:#8b6bff;color:#fff}
.about-grid article h3{font-size:1.35rem}.about-grid article p{margin:0}.about-grid article:first-child p{color:rgba(255,255,255,.68)}

.feature-section{width:100%;padding:105px max(20px,calc((100% - 1220px)/2));background:#f5f2ff}
.feature-section .section-heading{margin-inline:auto;text-align:center}
.feature-section .section-heading>p:last-child{margin-inline:auto}
.marketing-card-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:18px}
.marketing-card{position:relative;overflow:hidden;min-height:270px;grid-column:span 4;padding:29px;border:1px solid rgba(225,219,237,.9);border-radius:28px;background:#fff;box-shadow:0 16px 42px rgba(59,43,92,.055);transition:transform .2s ease}
.marketing-card:hover{transform:translateY(-5px)}
.marketing-card.featured{grid-column:span 8;min-height:330px;color:#fff;background:linear-gradient(135deg,#6f4df4 0%,#8b65ff 52%,#ff8bc7 130%)}
.marketing-card:nth-child(2){background:#fff1e5}.marketing-card:nth-child(3){background:#eaffc8}.marketing-card:nth-child(4){grid-column:span 5;background:#fff}.marketing-card:nth-child(5){grid-column:span 3;background:#17141d;color:#fff}.marketing-card:nth-child(6){grid-column:span 4;background:#ffdcef}
.marketing-card>span{width:54px;height:54px;display:grid;place-items:center;margin-bottom:70px;border-radius:17px;background:#eee9ff;color:#6040d5;font-size:1.25rem;font-weight:900}
.marketing-card.featured>span{background:rgba(255,255,255,.17);color:#fff}.marketing-card:nth-child(5)>span{background:#302a38;color:#c9f27a}
.marketing-card h3{margin-bottom:11px;font-size:1.35rem}.marketing-card p{margin:0;max-width:460px;line-height:1.62}.marketing-card.featured p,.marketing-card:nth-child(5) p{color:rgba(255,255,255,.72)}
.marketing-card::after{content:"";position:absolute;right:-38px;top:-38px;width:135px;height:135px;border-radius:50%;border:24px solid rgba(116,87,255,.07)}
.marketing-card.featured::after{width:220px;height:220px;right:-40px;top:-55px;border:35px solid rgba(255,255,255,.11)}

.workflow-section{display:grid;grid-template-columns:.78fr 1.22fr;gap:65px;padding:120px 0}
.workflow-section .section-heading{position:sticky;top:120px;align-self:start;margin:0}
.workflow-list{display:grid;gap:13px}
.workflow-list article{min-height:155px;display:grid;grid-template-columns:62px 1fr;gap:19px;padding:25px;border:1px solid #e8e4ec;border-radius:24px;background:#fff;box-shadow:0 13px 36px rgba(38,30,56,.045)}
.workflow-list article>span{width:52px;height:52px;display:grid;place-items:center;border-radius:16px;color:#fff;background:#17141d;font-weight:900}
.workflow-list article:nth-child(2)>span{background:#7755f4}.workflow-list article:nth-child(3)>span{background:#ef77b2}.workflow-list article:nth-child(4)>span{background:#7ba535}
.workflow-list h3{margin:2px 0 8px;font-size:1.25rem}.workflow-list p{margin:0}

.pricing-section{width:min(1220px,calc(100% - 40px));display:grid;grid-template-columns:.92fr 1.08fr;align-items:center;gap:75px;margin-bottom:112px;padding:70px;border-radius:38px;background:linear-gradient(135deg,#efe9ff,#ffedf6 60%,#fff4e8);box-shadow:inset 0 0 0 1px rgba(210,198,235,.6)}
.pricing-copy{max-width:550px}
.pricing-card{position:relative;overflow:hidden;min-height:525px;padding:37px;border:1px solid rgba(255,255,255,.12);border-radius:31px;color:#fff;background:#17141d;box-shadow:0 34px 80px rgba(40,25,69,.22)}
.pricing-card::before{content:"";position:absolute;right:-70px;top:-80px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,#9b7aff,transparent 70%);opacity:.62}
.pricing-card>*{position:relative;z-index:1}
.pricing-label{display:inline-flex;padding:8px 11px;border-radius:999px;color:#2d214e;background:#d6f89a;font-size:.65rem;font-weight:900;letter-spacing:.12em}
.price{margin:35px 0 11px}.price strong{font:800 clamp(3.25rem,5vw,5.4rem)/.95 "Rooftop",sans-serif}.price span{color:rgba(255,255,255,.6)}
.pricing-card>p{color:rgba(255,255,255,.67)}
.pricing-card ul{display:grid;gap:13px;margin:28px 0 31px;padding:0;list-style:none}.pricing-card li{position:relative;padding-left:28px;color:rgba(255,255,255,.84)}.pricing-card li::before{content:"✓";position:absolute;left:0;width:19px;height:19px;display:grid;place-items:center;border-radius:50%;color:#17141d;background:#c9f27a;font-size:.7rem;font-weight:900}
.pricing-card .button{width:100%;min-height:55px;background:#8a67ff}.pricing-card .button:hover{background:#9b7fff}
.pricing-note{color:rgba(255,255,255,.48)!important;text-align:center}

.marketing-cta{width:min(1220px,calc(100% - 40px));min-height:390px;display:grid;place-items:center;margin:0 auto 30px;padding:55px;border-radius:38px;text-align:center;color:#fff;background:radial-gradient(circle at 15% 10%,rgba(255,134,197,.42),transparent 30%),radial-gradient(circle at 88% 86%,rgba(126,91,255,.5),transparent 36%),#18141e;box-shadow:0 28px 80px rgba(32,24,44,.2)}
.marketing-cta>div{max-width:800px}.marketing-cta h2{margin:0 0 18px;font-size:clamp(2.7rem,5vw,5.2rem);line-height:.98;letter-spacing:-.065em}.marketing-cta p{max-width:620px;margin:0 auto 27px;color:rgba(255,255,255,.68);font-size:1.03rem}.marketing-cta .button{background:#fff;color:#241a3f}
.marketing-footer{width:min(1220px,calc(100% - 40px));margin:0 auto;padding:35px 0 45px;border-top:1px solid #e9e5ed}

/* Login / signup */
.login-view{grid-template-columns:minmax(470px,1.07fr) minmax(430px,.93fr);background:#fff}
.login-visual{padding:62px;background:radial-gradient(circle at 18% 18%,rgba(255,148,204,.65),transparent 30%),radial-gradient(circle at 80% 78%,rgba(137,102,255,.72),transparent 40%),linear-gradient(145deg,#1b1721,#3a2b52 64%,#7251d9)}
.login-visual::before{content:"";position:absolute;right:-80px;top:12%;width:390px;height:510px;border:1px solid rgba(255,255,255,.2);border-radius:46% 54% 51% 49%/41% 42% 58% 59%;transform:rotate(15deg)}
.login-copy h1{max-width:740px;font-size:clamp(3.3rem,6vw,6.4rem);line-height:.91;letter-spacing:-.07em}
.login-copy>p{font-size:1.04rem;line-height:1.72}
.feature-pills span{padding:10px 14px;border-radius:999px;background:rgba(255,255,255,.1);font-weight:700}
.login-panel{padding:52px;background:#fff}
.login-card{width:min(440px,100%);gap:19px}
.login-card h2{font-size:2.4rem;letter-spacing:-.055em}
.google-login-card,.email-auth-tabs,.email-verification-panel{border-radius:20px}
.google-button{min-height:52px;border-radius:14px}
.email-auth-tabs{padding:5px;border-radius:15px}
.email-auth-tab{min-height:43px;border-radius:11px}
.login-note{font-size:.76rem;line-height:1.6}

/* Dashboard shell */
.app-shell{background:#f5f4f8}
.sidebar{inset:12px auto 12px 12px;width:calc(var(--sidebar) - 12px);height:calc(100vh - 24px);min-height:0;padding:21px 14px 14px;border:1px solid #e8e5ed;border-radius:24px;background:rgba(255,255,255,.94);box-shadow:0 18px 55px rgba(37,29,58,.075);backdrop-filter:blur(20px);overflow:hidden}
.sidebar-head{flex:0 0 auto;padding:2px 10px 19px}
.nav-list{min-height:0;flex:1 1 auto!important;display:flex;flex-direction:column;gap:4px;overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch;padding:3px 2px 18px;scrollbar-width:thin}
.nav-list::-webkit-scrollbar{width:5px}.nav-list::-webkit-scrollbar-thumb{border-radius:999px;background:#d9d3e3}
.nav-section-label{padding:14px 11px 6px;color:#a09aa6;font-size:.61rem;letter-spacing:.16em}
.nav-item{min-height:43px;border-radius:12px;padding:0 11px;color:#696370;font-size:.85rem;font-weight:700}
.nav-item:hover{color:#27222d;background:#f4f2f7}
.nav-item.active{color:#fff;background:#17141d;box-shadow:0 9px 22px rgba(25,21,30,.15)}
.nav-item.active .nav-icon{color:#cdbfff}
.nav-icon{color:#8a7eb7;font-size:.95rem}
.nav-badge{background:#7657ef}
.sidebar-foot{position:relative;z-index:2;flex:0 0 auto;margin-top:0;padding-top:9px;border-top:1px solid #eeebf1;background:rgba(255,255,255,.96)}
.sidebar-foot .nav-item.danger{min-height:46px;color:#b33d52;background:#fff4f5}
.sidebar-foot .nav-item.danger:hover{color:#9d2e43;background:#ffe9ed}
.ig-mini-card{border-radius:15px;background:#faf9fc}
.workspace{margin-left:var(--sidebar)}
.topbar{min-height:92px;padding:16px 35px 13px;border:0;background:rgba(245,244,248,.83);backdrop-filter:blur(18px)}
.topbar h1{font-size:1.65rem;letter-spacing:-.05em}
.topbar .eyebrow{color:#8f8798}
.plan-status-button{border-radius:999px;background:#ebe5ff;color:#5c3ed5}
.user-chip{padding:5px 12px 5px 5px;border:0;background:#fff;box-shadow:0 8px 22px rgba(34,28,46,.06)}
.user-chip>span{background:linear-gradient(145deg,#ff8fc8,#7357f5)}
.page-container{max-width:1550px;margin:0 auto;padding:20px 35px 55px}
.page-actions{align-items:center;margin-bottom:23px}
.page-actions h2{font-size:1.9rem;letter-spacing:-.055em}
.panel{border-color:#e8e5ed;border-radius:24px;box-shadow:0 14px 38px rgba(39,31,57,.045)}
.panel-head{padding:21px 23px}
.welcome-banner{min-height:245px;align-items:center;padding:37px;border-radius:30px;color:#17141d;background:radial-gradient(circle at 85% 10%,rgba(255,255,255,.55),transparent 25%),linear-gradient(120deg,#d9ff9c 0%,#eee9ff 47%,#ffd9eb 100%);box-shadow:0 23px 55px rgba(78,62,112,.11)}
.welcome-banner::before{content:"";position:absolute;right:7%;bottom:-38%;width:250px;height:250px;border:43px solid rgba(116,87,255,.16);border-radius:50%}
.welcome-banner::after{right:25%;top:18%;width:82px;height:82px;border-radius:25px;background:linear-gradient(145deg,#ff83c5,#7755f4);transform:rotate(16deg);opacity:.95}
.welcome-banner>div{position:relative;z-index:2;max-width:680px}.welcome-banner h2{font-size:clamp(2.1rem,4vw,4rem);line-height:1;letter-spacing:-.065em}.welcome-banner p{max-width:590px;color:#5d5665}.banner-label{color:#6548dd}
.stat-grid{gap:14px}.stat-card{min-height:126px;padding:21px;border-color:#e8e5ed;border-radius:22px;background:#fff;box-shadow:0 12px 34px rgba(39,31,57,.04)}
.stat-card:nth-child(2){background:#fff4e9}.stat-card:nth-child(3){background:#f1edff}.stat-card:nth-child(4){background:#efffda}
.stat-icon{width:44px;height:44px;border-radius:14px;background:#f0ecff;color:#6546dd}
.stat-card strong{font-size:2rem}
.overview-grid{gap:15px}.quick-template-grid{gap:11px}.quick-template{min-height:104px;border-radius:18px;border-color:#ebe8ef;background:#fbfafc}.quick-template:hover{border-color:#cfc2ff;background:#f7f4ff}.quick-template>span{width:43px;height:43px;border-radius:14px;background:#eeeaff}
.subscription-gate-banner{border-color:#dcd2ff;border-radius:20px;background:linear-gradient(100deg,#f0ebff,#fff4f9)}
.filter-row{gap:10px}.search-field{min-height:49px}.filter-row select{height:49px;border-radius:14px}
.automation-list{gap:12px}.automation-card,.conversation-row,.activity-row,.support-ticket-card,.notification-card{border-radius:18px}
.status-pill,.mini-status,.ticket-status{border-radius:999px}

/* Inbox */
.inbox-shell{min-height:680px;border-radius:25px;box-shadow:0 18px 50px rgba(38,30,56,.05)}
.conversation-pane{border-right-color:#ebe8ef}.inbox-search{padding:14px}.conversation-row{margin:0 9px 7px}.conversation-row.active{background:#eee9ff}
.chat-head{min-height:78px}.chat-pane{background:#f8f7fb}.message-list{padding:24px}.message-bubble{border-radius:18px}.reply-box{background:#fff}

/* Setup, billing, account and admin */
.setup-grid,.subscription-layout,.account-grid,.support-grid,.admin-ops-grid{gap:16px}
.setup-main,.setup-account-card,.subscription-summary-card,.billing-security-card,.billing-benefits,.danger-zone,.admin-billing-card,.admin-site-cms-card{border-radius:25px}
.setup-illustration{border-radius:24px;background:linear-gradient(145deg,#ede7ff,#ffdceb)}
.subscription-summary-card{color:#fff;background:radial-gradient(circle at 90% 10%,rgba(255,137,201,.42),transparent 32%),#17141d}
.subscription-price strong{font-size:4rem}
.admin-stat-grid .stat-card{background:#fff}
.table-panel{overflow:hidden;border-radius:24px}
.activity-table,.admin-users-table{border-collapse:separate;border-spacing:0}
.activity-table th,.admin-users-table th{background:#faf9fc}

/* Dialogs and automation builder */
dialog{border:0;background:transparent}
dialog::backdrop{background:rgba(20,16,28,.58);backdrop-filter:blur(8px)}
.dialog-card{border:1px solid rgba(255,255,255,.6);border-radius:28px;box-shadow:0 32px 100px rgba(30,22,46,.28)}
.dialog-head{padding:22px 24px}.dialog-body{padding:22px 24px}.dialog-foot{padding:17px 24px}
.template-choice{border-radius:20px}.template-icon{border-radius:16px}
.automation-dialog{width:min(1180px,calc(100% - 30px))}
.builder-head{border-radius:27px 27px 0 0}
.builder-layout{background:#f7f6fa}.builder-body{gap:14px;padding:20px}
.builder-section{border-color:#e9e5ed;border-radius:22px;background:#fff;box-shadow:0 11px 30px rgba(40,32,58,.035)}
.section-title>span{border-radius:13px;background:#17141d;color:#fff}
.trigger-grid{gap:10px}.trigger-option,.radio-card,.toggle-card{border-radius:16px}.trigger-option:has(input:checked),.radio-card:has(input:checked),.toggle-card:has(input:checked){border-color:#9e86ff;background:#f4f1ff;box-shadow:0 0 0 3px rgba(116,87,255,.08)}
.flow-preview{background:linear-gradient(180deg,#1e1925,#30263e)}
.preview-device{border-radius:28px;box-shadow:0 24px 60px rgba(0,0,0,.24)}
.preview-avatar{background:linear-gradient(145deg,#ff8fc8,#7457ff)}

/* Support ticket workspace */
.support-ticket-dialog-card{border-radius:27px}.ticket-scroll-content{background:#faf9fc}.ticket-admin-edit{border-radius:18px}.ticket-message{border-radius:18px}.ticket-message.admin{background:#eee9ff}.ticket-reply-form{background:rgba(255,255,255,.98)}

/* Public navigation and CMS pages */
.public-nav-drawer{padding:20px 15px;border:1px solid #e8e5ed;border-left:0;border-radius:0 26px 26px 0;background:rgba(255,255,255,.96);box-shadow:28px 0 90px rgba(25,19,43,.2);backdrop-filter:blur(24px)}
.public-nav-link{border-radius:13px}.public-nav-link:hover,.public-nav-link.active{color:#fff!important;background:#17141d}.public-nav-link.active .public-nav-icon{color:#cdbfff}.public-nav-workspace{min-height:51px;border-radius:14px;background:#7657ef}
.public-nav-close{border-radius:13px}
.cms-page-card{border-radius:30px;box-shadow:0 22px 65px rgba(37,31,60,.07)}
.cms-page-hero h1,.cms-policy-card h1{letter-spacing:-.065em}
.cms-contact-grid article,.cms-faq-grid article{border-radius:20px}
.cms-contact-panel{background:radial-gradient(circle at 90% 10%,rgba(255,130,196,.45),transparent 35%),#17141d}

/* Logged-in mobile access to public website */
.mobile-website-button{min-height:40px;align-items:center;justify-content:center;gap:7px;border:1px solid #ded8e8;border-radius:12px;padding:0 12px;color:#4b405f;background:#fff;font-size:.76rem;font-weight:800;box-shadow:0 7px 18px rgba(37,29,58,.06)}
.mobile-website-button span{color:#7657ef;font-size:1rem}.mobile-website-button strong{font-size:.76rem;letter-spacing:-.01em}

/* Responsive */
@media(max-width:1100px){
  .marketing-hero{grid-template-columns:1fr;gap:30px;padding-top:75px;text-align:center}
  .hero-copy{max-width:820px;margin-inline:auto}.hero-copy>p{margin-inline:auto}.hero-actions,.hero-trust{justify-content:center}
  .hero-product{width:min(760px,100%);margin-inline:auto}.hero-social-card.comment-card{left:0}.hero-social-card.dm-card{right:0}
  .creator-proof{grid-template-columns:repeat(2,1fr)}
  .about-grid{grid-template-columns:1fr 1fr}.about-grid article:first-child{grid-column:span 2}
  .marketing-card{grid-column:span 6}.marketing-card.featured{grid-column:span 12}.marketing-card:nth-child(4),.marketing-card:nth-child(5),.marketing-card:nth-child(6){grid-column:span 4}
  .workflow-section{grid-template-columns:1fr}.workflow-section .section-heading{position:static}
  .pricing-section{grid-template-columns:1fr;padding:55px}.pricing-copy{max-width:720px}
}

@media(max-width:900px){
  :root{--sidebar:0px}
  .marketing-header{width:calc(100% - 26px);margin-top:13px}
  .sidebar{inset:0 auto 0 0;width:min(320px,88vw);height:100dvh;max-height:100dvh;padding-bottom:max(14px,env(safe-area-inset-bottom));border-radius:0 24px 24px 0;transform:translateX(-108%);transition:transform .22s ease}
  .sidebar.open{transform:translateX(0)}
  .nav-list{flex:1 1 0!important;min-height:0}
  .sidebar-foot{padding-bottom:max(0px,env(safe-area-inset-bottom))}
  .mobile-website-button{display:inline-flex!important}
  .workspace{margin-left:0}.topbar{min-height:80px;padding:12px 18px}.page-container{padding:18px 18px 44px}
  .mobile-only{display:inline-grid}
  .user-chip div{display:none}.topbar-actions{gap:7px}
  .welcome-banner{padding:28px}.stat-grid{grid-template-columns:repeat(2,1fr)}
  .creator-proof{margin-bottom:70px}
}

@media(max-width:720px){
  .marketing-section,.creator-proof,.marketing-cta,.marketing-footer,.pricing-section{width:calc(100% - 26px)}
  .marketing-header{height:68px}.marketing-brand .brand-copy small{display:none}.marketing-login{display:none}
  .marketing-hero{min-height:auto;padding:68px 0 72px}.hero-copy h1{font-size:clamp(3rem,15vw,4.55rem)}.hero-copy>p{font-size:.98rem}.hero-actions{display:grid}.hero-actions .button{width:100%}
  .hero-product{min-height:475px}.hero-product::before{width:420px;height:420px}.product-window{border-radius:22px}.product-body{min-height:320px}.product-sidebar{width:64px;padding:14px 10px}.product-content{padding:17px}.product-stats span:nth-child(3){display:none}.product-flow{padding:13px}.flow-node{padding:10px}.flow-node b{font-size:.68rem}.floating-result{right:0;bottom:10px}.hero-social-card.comment-card{left:-4px;top:10px}.hero-social-card.dm-card{display:none}
  .creator-proof{grid-template-columns:1fr}.creator-proof>div{min-height:82px}
  .about-section{padding-bottom:80px}.about-grid{grid-template-columns:1fr}.about-grid article:first-child{grid-column:auto}.about-grid article{min-height:230px}.about-grid article>span{margin-bottom:45px}
  .feature-section{padding-block:80px}.marketing-card,.marketing-card.featured,.marketing-card:nth-child(4),.marketing-card:nth-child(5),.marketing-card:nth-child(6){grid-column:span 12;min-height:245px}.marketing-card>span{margin-bottom:50px}
  .workflow-section{padding:85px 0;gap:35px}.workflow-list article{grid-template-columns:50px 1fr;padding:20px}.workflow-list article>span{width:44px;height:44px}
  .pricing-section{padding:28px;border-radius:29px}.pricing-card{padding:29px;min-height:auto}.price strong{font-size:3.5rem}
  .marketing-cta{min-height:350px;padding:35px 24px;border-radius:30px}
  .login-view{grid-template-columns:1fr}.login-visual{display:none}.login-panel{padding:32px 22px}.mobile-brand{display:flex}
  .page-actions{align-items:flex-start;flex-direction:column}.page-actions .button-row{width:100%;display:grid;grid-template-columns:1fr 1fr}.page-actions .button{width:100%}
  .welcome-banner{min-height:290px;align-items:flex-start;flex-direction:column}.welcome-banner .button{width:100%}.stat-grid{grid-template-columns:1fr}.overview-grid{grid-template-columns:1fr}
  .topbar-title h1{font-size:1.3rem}.plan-status-button{max-width:125px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .dialog-card{border-radius:22px}.automation-dialog{width:calc(100vw - 20px);height:calc(100dvh - 20px);max-height:calc(100dvh - 20px)}.automation-dialog .dialog-card{height:100%;border-radius:20px}.builder-layout{grid-template-columns:1fr}.flow-preview{display:none}
}

@media(max-width:470px){
  .marketing-header{padding-left:12px}.marketing-auth-actions .compact{padding-inline:14px}.hero-product{min-height:405px}.hero-product::before{width:340px;height:340px}.product-top{height:42px}.product-sidebar{display:none}.product-content{padding:13px}.product-heading>b{font-size:.6rem}.product-stats span{padding:10px}.product-flow{gap:7px}.flow-node em{width:31px;height:31px}.floating-result{padding:10px 12px}.hero-social-card.comment-card{max-width:190px;padding:10px}.hero-social-card .social-avatar{width:33px;height:33px}
  .section-heading h2,.pricing-copy h2{font-size:2.55rem}.pricing-section{width:calc(100% - 18px)}
  .topbar{padding-inline:12px}.page-container{padding-inline:12px}.topbar-actions .icon-button{display:none}.topbar-actions .mobile-website-button{display:inline-flex!important}.welcome-banner{padding:23px}.stat-card{min-height:108px}.quick-template-grid{grid-template-columns:1fr}.button-row{grid-template-columns:1fr!important}
}

/* Keep mobile-only navigation controls hidden on desktop even though icon buttons are inline-grid. */
.mobile-only{display:none!important}
@media(max-width:900px){.mobile-only{display:inline-grid!important}}
@media(max-width:900px){.mobile-only.mobile-website-button{display:inline-flex!important}}


/* v17.2 — stable mobile dialogs and automation editor */
html.dialog-open,body.dialog-open{overscroll-behavior:none}
dialog[aria-hidden="true"]:not([open]){pointer-events:none}
.automation-dialog[open]{overflow:hidden}
.automation-dialog .builder-card{min-height:0;overflow:hidden}
.automation-dialog .builder-layout{min-height:0;overflow:hidden}
.automation-dialog .builder-body{min-height:0;overflow-y:auto!important;overflow-x:hidden;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;scrollbar-gutter:stable}
.automation-dialog .dialog-foot{position:relative;z-index:3;flex:0 0 auto}
.automation-dialog .toggle-card,.automation-dialog .radio-card,.automation-dialog .trigger-option{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.automation-dialog .toggle-card{position:relative;cursor:pointer;user-select:none}
.automation-dialog .toggle-card:focus-within{outline:3px solid rgba(109,73,245,.13);outline-offset:2px}

@media(max-width:900px){
  dialog.automation-dialog[open]{position:fixed!important;inset:0!important;width:calc(100vw - 20px)!important;max-width:calc(100vw - 20px)!important;height:calc(100dvh - 20px)!important;max-height:calc(100dvh - 20px)!important;margin:auto!important;border-radius:20px!important;overflow:hidden!important}
  .automation-dialog .builder-card{width:100%;height:100%;max-height:100%;grid-template-rows:auto minmax(0,1fr) auto;border-radius:20px!important}
  .automation-dialog .builder-layout{height:100%;min-height:0}
  .automation-dialog .builder-body{height:100%;padding-bottom:max(18px,env(safe-area-inset-bottom))}
  .automation-dialog .dialog-head{padding-top:max(16px,env(safe-area-inset-top))}
  .automation-dialog .dialog-foot{padding-bottom:max(14px,env(safe-area-inset-bottom));background:#fff}
}

/* SEO/internal-navigation additions: visible crawlable links without changing dashboard behavior. */
.seo-feature-links{max-width:1180px;margin:28px auto 0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.seo-feature-links a{min-width:0;display:grid;gap:5px;padding:15px;border:1px solid var(--border,#e8e5ef);border-radius:14px;color:var(--text,#181620);background:#fff;text-decoration:none}.seo-feature-links a:hover{border-color:#b9a9ff;transform:translateY(-1px)}.seo-feature-links strong{font-size:.82rem}.seo-feature-links span{color:var(--soft,#6f6b78);font-size:.7rem;line-height:1.35}.marketing-footer-links{display:flex;flex-wrap:wrap;gap:13px;margin-top:14px}.marketing-footer-links a{color:inherit;font-size:.78rem;font-weight:700}.marketing-site>section:not(.marketing-hero){content-visibility:auto;contain-intrinsic-size:900px}
@media(max-width:900px){.seo-feature-links{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.seo-feature-links{grid-template-columns:1fr}}