/*
 * Crevyro interface refinement
 * Final, presentation-only layer shared by the public site, authentication,
 * customer workspace and owner workspace. Product behaviour is unchanged.
 */

:root{
  --ac-ui-ink:#101828;
  --ac-ui-body:#344054;
  --ac-ui-muted:#667085;
  --ac-ui-faint:#98a2b3;
  --ac-ui-line:#e4e7ec;
  --ac-ui-line-strong:#d0d5dd;
  --ac-ui-canvas:#f5f6f8;
  --ac-ui-surface:#fff;
  --ac-ui-purple:#6d4aff;
  --ac-ui-purple-dark:#5335db;
  --ac-ui-pink:#f320df;
  --ac-ui-blue:#0875e8;
  --ac-ui-blue-dark:#0064cc;
  --ac-ui-shadow-xs:0 2px 8px rgba(16,24,40,.04);
  --ac-ui-shadow-sm:0 10px 30px rgba(16,24,40,.065);
  --ac-ui-shadow-md:0 22px 58px rgba(16,24,40,.10);
  --ac-ui-ease:cubic-bezier(.22,.8,.22,1);
}

html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{text-rendering:optimizeLegibility}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
button,a{touch-action:manipulation}
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible{
  outline:3px solid rgba(109,74,255,.28)!important;
  outline-offset:3px!important;
}

/* -------------------------------------------------------------------------- */
/* Shared public navigation                                                    */
/* -------------------------------------------------------------------------- */

.mcv2-header,
body.acx-landing-page .mcv2-header{
  border-bottom:1px solid rgba(16,24,40,.07)!important;
  box-shadow:0 1px 0 rgba(255,255,255,.7),0 8px 28px rgba(16,24,40,.035)!important;
}
.mcv2-brand-logo{
  filter:drop-shadow(0 5px 10px rgba(16,24,40,.08));
  transition:transform .28s var(--ac-ui-ease),filter .28s ease;
}
.mcv2-brand:hover .mcv2-brand-logo{transform:rotate(-4deg) scale(1.04);filter:drop-shadow(0 8px 15px rgba(16,24,40,.14))}
.mcv2-nav a{position:relative;transition:color .2s ease}
.mcv2-nav a::after{
  content:"";
  position:absolute;
  right:0;
  bottom:-8px;
  left:0;
  height:2px;
  border-radius:999px;
  background:currentColor;
  transform:scaleX(0);
  transform-origin:right;
  transition:transform .28s var(--ac-ui-ease);
}
.mcv2-nav a:hover::after,.mcv2-nav a[aria-current="page"]::after{transform:scaleX(1);transform-origin:left}
.mcv2-login{transition:color .2s ease,transform .2s var(--ac-ui-ease)}
.mcv2-login:hover{transform:translateY(-1px)}

/* -------------------------------------------------------------------------- */
/* Homepage                                                                    */
/* -------------------------------------------------------------------------- */

#landing-view.acx-homepage .mcv2-hero-shade{
  background:
    linear-gradient(90deg,rgba(4,5,8,.82) 0%,rgba(5,7,12,.58) 39%,rgba(5,7,12,.15) 72%),
    linear-gradient(0deg,rgba(3,4,7,.62),transparent 58%)!important;
}
#landing-view.acx-homepage .mcv2-hero-copy h1{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  text-shadow:0 3px 30px rgba(0,0,0,.30);
}
#landing-view.acx-homepage .mcv2-hero-copy .mcv2-mini{
  color:#fff!important;
  opacity:.84;
}
#landing-view.acx-homepage .mcv2-hero-copy .mcv2-lead{
  color:rgba(255,255,255,.92)!important;
  text-wrap:pretty;
}
#landing-view.acx-homepage .mcv2-pill{
  box-shadow:0 16px 34px rgba(243,32,223,.22);
  transition:transform .25s var(--ac-ui-ease),box-shadow .25s ease,filter .25s ease;
}
#landing-view.acx-homepage .mcv2-pill:hover{
  transform:translateY(-3px);
  box-shadow:0 22px 44px rgba(243,32,223,.3);
  filter:saturate(1.08);
}
#landing-view.acx-homepage .mcv2-hero-chat .mcv2-bubble{
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 18px 44px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(14px);
}
#landing-view.acx-homepage .mcv2-bubble-dark{background:rgba(20,20,22,.9)!important}
#landing-view.acx-homepage .mcv2-bubble-purple,
#landing-view.acx-homepage .mcv2-bubble-purple *{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}
#landing-view.acx-homepage .mcv2-phone{
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 32px 80px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.09);
}
#landing-view.acx-homepage .mcv2-platform-list a{
  border-radius:22px!important;
  box-shadow:var(--ac-ui-shadow-xs);
}
#landing-view.acx-homepage .mcv2-platform-list a:hover{
  box-shadow:0 22px 44px rgba(0,0,0,.13)!important;
}
#landing-view.acx-homepage .mcv2-before-card,
#landing-view.acx-homepage .mcv2-after-card{border-radius:38px!important}
#landing-view.acx-homepage .mcv2-before-card li,
#landing-view.acx-homepage .mcv2-after-card li{align-items:center}
#landing-view.acx-homepage .mcv2-blue-copy h2,
#landing-view.acx-homepage .mcv2-after-card h3,
#landing-view.acx-homepage .mcv2-faq-title h2{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}
#landing-view.acx-homepage .mcv2-faq-list summary{
  transition:color .2s ease,padding-left .25s var(--ac-ui-ease);
}
#landing-view.acx-homepage .mcv2-faq-list summary:hover{color:var(--mcv2-yellow);padding-left:8px}
#landing-view.acx-homepage .mcv2-footer-links a{transition:opacity .2s ease,transform .2s var(--ac-ui-ease)}
#landing-view.acx-homepage .mcv2-footer-links a:hover{opacity:.72;transform:translateX(3px)}

/* -------------------------------------------------------------------------- */
/* Editorial landing pages                                                     */
/* -------------------------------------------------------------------------- */

body.acx-landing-page{background:#f7f7f2!important}
body.acx-landing-page .breadcrumbs{padding-top:25px;padding-bottom:18px}
body.acx-landing-page main.page>.hero,
body.acx-landing-page main.mc-editorial-page>.hero{
  min-height:580px!important;
  padding:clamp(48px,6vw,80px)!important;
  gap:clamp(32px,5vw,70px)!important;
  border:1px solid rgba(255,255,255,.08)!important;
  border-radius:38px!important;
  box-shadow:0 24px 70px rgba(16,24,40,.12)!important;
}
body.acx-landing-page main.page>.hero::before,
body.acx-landing-page main.mc-editorial-page>.hero::before{
  animation:acUiAmbientGrid 18s ease-in-out infinite alternate;
}
body.acx-landing-page .hero h1{
  max-width:820px;
  font-size:clamp(3.45rem,5.7vw,6.7rem)!important;
  line-height:.88!important;
  letter-spacing:-.072em!important;
  text-wrap:balance;
}
body.acx-landing-page .hero .lead,
body.acx-landing-page .hero>p:not(:first-child){
  max-width:720px;
  color:rgba(255,255,255,.8)!important;
  text-wrap:pretty;
}
body.acx-landing-page .hero-card{
  border-radius:28px!important;
  box-shadow:0 34px 80px rgba(0,0,0,.32)!important;
  animation:acUiHeroCardFloat 7s ease-in-out infinite;
}
body.acx-landing-page .hero-card .metric{padding:19px 0}
body.acx-landing-page .hero-card small{color:rgba(255,255,255,.76)!important}
body.acx-landing-page .actions{gap:10px}
body.acx-landing-page .button{
  min-height:52px;
  box-shadow:none;
  transition:transform .24s var(--ac-ui-ease),box-shadow .24s ease,filter .24s ease;
}
body.acx-landing-page .button:hover{transform:translateY(-3px);filter:saturate(1.05)}
body.acx-landing-page .button.primary:hover{box-shadow:0 20px 42px rgba(243,32,223,.3)!important}

body.acx-landing-page main.page>.section,
body.acx-landing-page main.mc-editorial-page>.section{
  padding-top:clamp(72px,7.5vw,108px)!important;
  padding-bottom:clamp(72px,7.5vw,108px)!important;
}
body.acx-landing-page .section-head h2,
body.acx-landing-page .section h2{
  font-size:clamp(2.8rem,5.45vw,6rem)!important;
  line-height:.9!important;
  text-wrap:balance;
}
body.acx-landing-page .section-head>p:last-child{color:#615d58;font-size:1.05rem;text-wrap:pretty}
body.acx-landing-page .grid{gap:18px;margin-top:34px}
body.acx-landing-page .grid>.card,
body.acx-landing-page .grid>article,
body.acx-landing-page .faq article{
  min-height:205px;
  padding:27px!important;
  border-radius:22px!important;
  box-shadow:var(--ac-ui-shadow-xs)!important;
  transition:transform .28s var(--ac-ui-ease),box-shadow .28s ease,border-color .28s ease;
}
body.acx-landing-page .grid>.card:hover,
body.acx-landing-page .grid>article:hover,
body.acx-landing-page .faq article:hover{
  transform:translateY(-5px);
  border-color:rgba(109,74,255,.26)!important;
  box-shadow:var(--ac-ui-shadow-sm)!important;
}
body.acx-landing-page .grid p,
body.acx-landing-page .faq article p{color:#5f5b56!important}
body.acx-landing-page main.page>.section:nth-of-type(4n) .grid p,
body.acx-landing-page main.mc-editorial-page>.section:nth-of-type(4n) .grid p{color:rgba(255,255,255,.74)!important}
body.acx-landing-page .step{padding:27px 0}
body.acx-landing-page .step p{color:#5f5b56!important}
body.acx-landing-page .note{
  border-radius:20px!important;
  box-shadow:0 14px 34px rgba(0,0,0,.10);
}
body.acx-landing-page main.page>.cta,
body.acx-landing-page main.mc-editorial-page>.cta{
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 26px 64px rgba(16,24,40,.14);
}

/* Pricing: compact horizontal catalogue, clean scrolling and readable FAQ. */
body.acx-landing-page .pricing-hero{
  min-height:500px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:38px;
  box-shadow:0 24px 70px rgba(16,24,40,.12);
}
body.acx-landing-page .pricing-hero h1{
  max-width:980px;
  font-size:clamp(3.9rem,7.2vw,7.2rem);
  line-height:.84;
  text-wrap:balance;
}
body.acx-landing-page.mc-pricing-page .pricing-shell{padding-top:38px!important;padding-bottom:38px!important}
body.acx-landing-page.mc-pricing-page .seo-pricing-grid{
  gap:14px!important;
  padding:4px 2px 10px!important;
  scrollbar-width:none!important;
  scroll-behavior:smooth;
}
body.acx-landing-page.mc-pricing-page .seo-pricing-grid::-webkit-scrollbar{display:none}
body.acx-landing-page.mc-pricing-page .seo-pricing-grid .price-card,
body.acx-landing-page.mc-pricing-page .seo-pricing-grid .price-card.recommended{
  flex-basis:clamp(294px,30vw,342px)!important;
  width:clamp(294px,30vw,342px)!important;
  padding:20px!important;
  border-radius:22px!important;
  box-shadow:0 14px 34px rgba(16,24,40,.10)!important;
  transition:transform .28s var(--ac-ui-ease),box-shadow .28s ease;
}
body.acx-landing-page.mc-pricing-page .seo-pricing-grid .price-card>p{
  font-size:.9rem!important;
  line-height:1.45!important;
}
body.acx-landing-page.mc-pricing-page .seo-pricing-grid .price-card:hover{
  transform:translateY(-5px);
  box-shadow:0 22px 46px rgba(16,24,40,.15)!important;
}
body.acx-landing-page.mc-pricing-page .seo-pricing-grid .feature-list li{
  padding:9px 4px 9px 38px!important;
  font-size:.88rem!important;
}
body.acx-landing-page.mc-pricing-page .seo-pricing-grid .feature-list li::before{width:23px!important;height:23px!important}
body.acx-landing-page.mc-pricing-page .pricing-comparison{padding-top:clamp(68px,7vw,98px)!important;padding-bottom:clamp(68px,7vw,98px)!important}
body.acx-landing-page.mc-pricing-page .pricing-comparison h2{
  font-size:clamp(2.9rem,5.3vw,5.65rem);
  line-height:.9;
  text-wrap:balance;
}
body.acx-landing-page.mc-pricing-page .comparison{
  overflow:hidden;
  border:1px solid rgba(16,24,40,.11);
  border-radius:22px;
  box-shadow:var(--ac-ui-shadow-sm);
}
body.acx-landing-page.mc-pricing-page .pricing-comparison .faq{gap:18px!important}
body.acx-landing-page.mc-pricing-page .pricing-comparison .faq article{
  padding:27px 26px!important;
  border-radius:22px!important;
  box-shadow:0 12px 28px rgba(16,24,40,.08)!important;
}
body.acx-landing-page.mc-pricing-page .pricing-comparison .faq h3{font-size:clamp(1.45rem,2.1vw,2rem)!important}
body.acx-landing-page.mc-pricing-page .pricing-editorial-cta{box-shadow:none}

/* Policies and support copy keep a comfortable reading measure. */
body.acx-landing-page .mc-policy-page>.card,
body.acx-landing-page main>.card{
  border:1px solid rgba(16,24,40,.07)!important;
  box-shadow:0 18px 52px rgba(16,24,40,.07)!important;
}
body.acx-landing-page .mc-policy-page>.card h1,
body.acx-landing-page main>.card h1{
  max-width:920px;
  font-size:clamp(3.15rem,5.8vw,6.3rem);
  line-height:.88;
  text-wrap:balance;
}
body.acx-landing-page .mc-policy-page>.card>p,
body.acx-landing-page .mc-policy-page>.card>ul,
body.acx-landing-page main>.card>p,
body.acx-landing-page main>.card>ul{max-width:850px}
body.acx-landing-page .footer-grid a{transition:opacity .2s ease,transform .2s var(--ac-ui-ease)}
body.acx-landing-page .footer-grid a:hover{opacity:.72;transform:translateX(3px)}

/* -------------------------------------------------------------------------- */
/* Authentication                                                              */
/* -------------------------------------------------------------------------- */

#login-view.login-view{background:#fff}
#login-view .login-visual{
  background:
    radial-gradient(circle at 16% 18%,rgba(255,137,199,.62),transparent 30%),
    radial-gradient(circle at 82% 80%,rgba(112,85,245,.78),transparent 42%),
    linear-gradient(145deg,#17131f,#39294f 62%,#6847d0)!important;
}
#login-view .login-visual::after{opacity:.09}
#login-view .login-copy h1,
#login-view .login-copy .eyebrow,
#login-view .login-visual .brand-lockup strong,
#login-view .login-visual .brand-copy strong{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}
#login-view .login-copy h1{text-shadow:0 4px 30px rgba(0,0,0,.18);text-wrap:balance}
#login-view .login-copy>p{color:rgba(255,255,255,.8)!important}
#login-view .feature-pills span{
  border-color:rgba(255,255,255,.24);
  color:#fff;
  background:rgba(255,255,255,.10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
#login-view .login-panel{padding:clamp(30px,5vw,64px)}
#login-view .login-card{width:min(460px,100%)}
#login-view .auth-tabs{padding:5px;border:1px solid var(--ac-ui-line);background:#f7f7fa}
#login-view .auth-tabs button{border-radius:12px}
#login-view .google-button,
#login-view .field input{min-height:50px;border-color:var(--ac-ui-line-strong)}
#login-view .login-card .button{min-height:50px;border-radius:12px}
#login-view .auth-assurances{border:1px solid #ebe7f2;background:#f8f7fb}

/* -------------------------------------------------------------------------- */
/* Customer and owner application shell                                        */
/* -------------------------------------------------------------------------- */

#app-view{
  --ui-text:var(--ac-ui-ink);
  --ui-muted:var(--ac-ui-muted);
  --ui-line:var(--ac-ui-line);
  color:var(--ac-ui-ink);
  background:var(--ac-ui-canvas)!important;
}
#app-view .sidebar{
  inset:14px auto 14px 14px;
  width:272px!important;
  height:calc(100dvh - 28px);
  padding:17px 12px 12px;
  border:1px solid rgba(208,213,221,.92);
  border-radius:24px;
  background:rgba(255,255,255,.97)!important;
  box-shadow:0 22px 58px rgba(16,24,40,.09);
  backdrop-filter:blur(22px);
}
#app-view .sidebar-head{padding:4px 10px 16px}
#app-view .mc-workspace-switcher{
  min-height:74px;
  margin:0 -2px 8px;
  padding:12px 10px;
  border:1px solid #edf0f3;
  border-radius:15px;
  background:#fafbfc;
}
#app-view .mc-workspace-switcher:hover{border-color:#ddd6fe;background:#f8f6ff}
#app-view .mc-workspace-switcher>span:nth-child(2){min-width:0}
#app-view .mc-workspace-switcher strong{color:var(--ac-ui-ink)}
#app-view .mc-workspace-switcher small{color:var(--ac-ui-muted)}
#app-view .nav-list{padding:8px 2px 16px;scrollbar-width:none}
#app-view .nav-list::-webkit-scrollbar{display:none}
#app-view .nav-item{
  min-height:45px!important;
  border-radius:12px!important;
  color:var(--ac-ui-body)!important;
  transition:color .18s ease,background .18s ease,transform .18s var(--ac-ui-ease),box-shadow .18s ease;
}
#app-view .nav-item:hover{color:var(--ac-ui-ink)!important;background:#f2f4f7!important;transform:translateX(2px)}
#app-view .nav-item.active{
  color:#fff!important;
  background:linear-gradient(180deg,#292238 0%,#15111d 100%)!important;
  box-shadow:0 9px 22px rgba(16,24,40,.16),inset 0 1px 0 rgba(255,255,255,.13)!important;
}
#app-view .nav-item.active:hover{transform:none}
#app-view .nav-item.active .nav-icon{color:#cfc4ff!important}
#app-view .sidebar-foot{background:rgba(255,255,255,.98)!important}
#app-view .mc-plan-meter{border-color:#e4e7ec;background:#fafbfc}
#app-view .mc-upgrade-button{
  border-radius:12px;
  box-shadow:0 7px 18px rgba(8,117,232,.16);
  transition:transform .2s var(--ac-ui-ease),box-shadow .2s ease;
}
#app-view .mc-upgrade-button:hover{transform:translateY(-2px);box-shadow:0 12px 24px rgba(8,117,232,.22)}

#app-view .workspace{margin-left:300px!important;background:var(--ac-ui-canvas)!important}
#app-view .topbar{
  min-height:84px!important;
  padding:14px 32px!important;
  border-bottom:1px solid rgba(228,231,236,.92)!important;
  background:rgba(245,246,248,.9)!important;
  box-shadow:0 7px 24px rgba(16,24,40,.025)!important;
  backdrop-filter:blur(20px);
}
#app-view .topbar h1{color:var(--ac-ui-ink)!important;font-size:1.48rem!important}
#app-view .topbar .eyebrow{color:var(--ac-ui-muted)!important}
#app-view .topbar-actions>.icon-button{
  width:42px;
  height:42px;
  border:1px solid var(--ac-ui-line)!important;
  border-radius:12px!important;
  background:#fff!important;
  box-shadow:var(--ac-ui-shadow-xs)!important;
}
#app-view .topbar-actions>.icon-button:hover{border-color:#cfc6ff!important;background:#f8f6ff!important}
#app-view .user-chip{border:1px solid var(--ac-ui-line)!important;box-shadow:var(--ac-ui-shadow-xs)!important}
#app-view .page-container{max-width:1480px;padding:30px 32px 72px!important}
#app-view .page{color:var(--ac-ui-ink)}
#app-view .page-actions{gap:20px;margin-bottom:22px}
#app-view .page-actions .button{min-width:max-content;white-space:nowrap}
#app-view .page-actions h2{color:var(--ac-ui-ink)!important;font-size:clamp(1.75rem,2.3vw,2.1rem)!important;line-height:1.05}
#app-view .page-actions p{max-width:760px;color:var(--ac-ui-muted)!important;line-height:1.6}
#app-view .muted{color:var(--ac-ui-muted)!important}

#app-view .panel{
  border:1px solid var(--ac-ui-line)!important;
  border-radius:22px!important;
  background:#fff!important;
  box-shadow:0 10px 32px rgba(16,24,40,.045)!important;
}
#app-view .panel-head{padding:20px 22px!important;border-bottom-color:#eaecf0!important}
#app-view .panel-head h2,
#app-view .panel-head h3{color:var(--ac-ui-ink)!important}
#app-view .stat-grid{gap:14px}
#app-view .stat-card{
  min-height:124px;
  border:1px solid var(--ac-ui-line)!important;
  border-radius:20px!important;
  box-shadow:0 8px 24px rgba(16,24,40,.045)!important;
  transition:transform .23s var(--ac-ui-ease),box-shadow .23s ease,border-color .23s ease;
}
#app-view .stat-card:hover{
  transform:translateY(-3px);
  border-color:#d9d2ff!important;
  box-shadow:0 16px 32px rgba(16,24,40,.075)!important;
}
#app-view .stat-card small{color:var(--ac-ui-muted)!important}
#app-view .stat-card strong{color:var(--ac-ui-ink)!important;font-variant-numeric:tabular-nums}

#app-view .button{
  min-height:44px;
  border-radius:11px!important;
  font-weight:750!important;
  transition:transform .18s var(--ac-ui-ease),box-shadow .18s ease,background .18s ease,border-color .18s ease;
}
#app-view .button:hover:not(:disabled){transform:translateY(-2px)}
#app-view .button.primary{box-shadow:0 8px 18px rgba(8,117,232,.16)!important}
#app-view .button.primary:hover:not(:disabled){box-shadow:0 12px 24px rgba(8,117,232,.23)!important}
#app-view .button.secondary{border-color:var(--ac-ui-line-strong)!important;color:var(--ac-ui-body)!important;background:#fff!important}
#app-view .button.secondary:hover:not(:disabled){border-color:#b9abff!important;color:#4831b8!important;background:#f8f6ff!important}
#app-view .text-button{font-weight:700!important;text-underline-offset:4px}

/* Inputs and form rhythm */
#app-view .stack-form{gap:18px}
#app-view .form-grid{gap:14px}
#app-view .field{gap:7px}
#app-view .field>span{color:var(--ac-ui-body)!important;font-weight:700!important}
#app-view .field>span small,
#app-view .field small{color:var(--ac-ui-muted)!important}
#app-view .field input,
#app-view .field select,
#app-view .field textarea,
#app-view .search-field,
#app-view .filter-row select,
#app-view .reply-box textarea{
  border-color:var(--ac-ui-line-strong)!important;
  color:var(--ac-ui-ink)!important;
  background:#fff!important;
  box-shadow:inset 0 1px 2px rgba(16,24,40,.02);
}
#app-view .field input,
#app-view .field select{min-height:48px}
#app-view .field textarea{line-height:1.55}
#app-view input::placeholder,
#app-view textarea::placeholder{color:var(--ac-ui-faint)!important;opacity:1}
#app-view .field input:focus,
#app-view .field select:focus,
#app-view .field textarea:focus,
#app-view .search-field:focus-within{
  border-color:#8f79f4!important;
  box-shadow:0 0 0 4px rgba(109,74,255,.10)!important;
}
#app-view .filter-row{
  gap:10px;
  margin-bottom:18px;
  padding:10px;
  border:1px solid var(--ac-ui-line);
  border-radius:16px;
  background:#fff;
  box-shadow:var(--ac-ui-shadow-xs);
}

/* Customer overview */
#page-overview .mc-home-intro{margin-bottom:52px}
#page-overview .mc-home-intro h2{color:var(--ac-ui-ink);line-height:.92;letter-spacing:-.065em}
#page-overview .mc-home-meta{color:var(--ac-ui-body)}
#page-overview .mc-home-section{margin-bottom:40px}
#page-overview .mc-section-title{margin-bottom:16px}
#page-overview .mc-section-title h3{color:var(--ac-ui-ink);letter-spacing:-.045em}
#page-overview .mc-template-carousel{
  gap:12px!important;
  padding:2px 2px 6px!important;
  scroll-padding-inline:2px;
  scroll-snap-type:x proximity;
  scroll-behavior:smooth;
  scrollbar-width:none!important;
}
#page-overview .mc-template-carousel::-webkit-scrollbar{display:none}
#page-overview .mc-template-carousel .quick-template{
  min-height:168px;
  border:1px solid var(--ac-ui-line)!important;
  border-radius:18px!important;
  background:#fff!important;
  box-shadow:var(--ac-ui-shadow-xs);
  scroll-snap-align:start;
  transition:transform .24s var(--ac-ui-ease),box-shadow .24s ease,border-color .24s ease;
}
#page-overview .mc-template-carousel .quick-template:hover{
  transform:translateY(-4px);
  border-color:#cfc6ff!important;
  box-shadow:0 16px 34px rgba(16,24,40,.08)!important;
}
#page-overview .mc-next-moves{padding:26px!important}
#page-overview .mc-next-moves>h3{max-width:820px;color:var(--ac-ui-ink);text-wrap:balance}
#page-overview .mc-move-list button{border-color:var(--ac-ui-line)!important;background:#fff!important;transition:background .18s ease,transform .18s var(--ac-ui-ease)}
#page-overview .mc-move-list button:hover{background:#f8f6ff!important;transform:translateX(3px)}

/* Settings, detail pages, tables and lists */
#app-view .mc-settings-index,
#app-view .mc-automation-menu{
  border:1px solid var(--ac-ui-line);
  border-radius:18px;
  background:#fff;
  box-shadow:var(--ac-ui-shadow-xs);
}
#app-view .profile-detail,
#app-view .usage-detail,
#app-view .customer-info-grid>div{border:1px solid #eceff2;background:#fafbfc!important}
#app-view .automation-card,
#app-view .conversation-row,
#app-view .activity-row,
#app-view .support-ticket-card,
#app-view .notification-card{
  border:1px solid var(--ac-ui-line)!important;
  border-radius:18px!important;
  background:#fff!important;
  box-shadow:var(--ac-ui-shadow-xs);
  transition:transform .2s var(--ac-ui-ease),box-shadow .2s ease,border-color .2s ease;
}
#app-view .automation-card:hover,
#app-view .conversation-row:hover,
#app-view .support-ticket-card:hover,
#app-view .notification-card:hover{
  transform:translateY(-2px);
  border-color:#d5cdff!important;
  box-shadow:var(--ac-ui-shadow-sm);
}
#app-view .table-panel{overflow:hidden!important}
#app-view .activity-table,
#app-view .admin-users-table,
#app-view .coupon-admin-list,
#app-view .admin-support-list{
  scrollbar-width:thin;
  scrollbar-color:#c2c7d0 #f2f4f7;
}
#app-view .activity-table::-webkit-scrollbar,
#app-view .admin-users-table::-webkit-scrollbar,
#app-view .coupon-admin-list::-webkit-scrollbar{height:8px;width:8px}
#app-view .activity-table::-webkit-scrollbar-thumb,
#app-view .admin-users-table::-webkit-scrollbar-thumb,
#app-view .coupon-admin-list::-webkit-scrollbar-thumb{border:2px solid #f2f4f7;border-radius:999px;background:#b5bbc5}
#app-view .activity-table::-webkit-scrollbar-track,
#app-view .admin-users-table::-webkit-scrollbar-track,
#app-view .coupon-admin-list::-webkit-scrollbar-track{background:#f2f4f7}
#app-view .activity-row:hover,
#app-view .admin-user-row:not(.header):hover,
#app-view .coupon-admin-row:hover{background:#faf9ff}
#app-view .empty-state{color:var(--ac-ui-muted)!important}

/* Inbox */
#page-inbox .inbox-shell{
  border:1px solid var(--ac-ui-line)!important;
  border-radius:22px!important;
  box-shadow:var(--ac-ui-shadow-sm)!important;
}
#page-inbox .conversation-pane{min-height:0;overflow:hidden;border-right-color:var(--ac-ui-line)!important}
#page-inbox .conversation-list{
  min-height:0;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior-y:contain;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-y!important;
}
#page-inbox .conversation-item{touch-action:pan-y!important}
#page-inbox .conversation-row.active{border-color:#cfc4ff!important;background:#f2efff!important}
#page-inbox .chat-pane{background:#f8f9fb!important}
#page-inbox .chat-head,
#page-inbox .reply-box{border-color:var(--ac-ui-line)!important;background:#fff!important}
#page-inbox .message-bubble{box-shadow:0 5px 16px rgba(16,24,40,.07)}

/* Subscription and usage */
#page-subscription .subscription-summary-card{
  border-color:#d9d1ff!important;
  color:var(--ac-ui-ink)!important;
  background:
    radial-gradient(circle at 100% 0%,rgba(108,76,255,.17),transparent 280px),
    linear-gradient(145deg,#fff 0%,#f8f6ff 58%,#f3efff 100%)!important;
  box-shadow:0 20px 55px rgba(73,55,142,.11)!important;
}
#page-subscription .subscription-summary-card h2,
#page-subscription .subscription-summary-card h3,
#page-subscription .subscription-summary-card strong{color:var(--ac-ui-ink)!important}
#page-subscription .subscription-summary-card p,
#page-subscription .subscription-summary-card small{color:var(--ac-ui-muted)!important}
#page-subscription .subscription-summary-card .eyebrow{color:#5c43cc!important}
#page-subscription .subscription-price span{color:#475467!important}
#page-subscription .subscription-coupon-box{border-color:#ddd6fe!important;background:rgba(255,255,255,.84)!important}
#page-subscription .coupon-entry-head strong{color:#1d2939!important}
#page-subscription .subscription-plan-option{border-radius:18px!important;transition:transform .2s var(--ac-ui-ease),box-shadow .2s ease,border-color .2s ease}
#page-subscription .subscription-plan-option:hover:not(:disabled){transform:translateY(-3px);box-shadow:var(--ac-ui-shadow-sm)}

/* Owner workspace: fix token collision, tighten long forms, and clarify data. */
#page-admin .admin-stat-grid .stat-card,
#page-admin-coupons .admin-stat-grid .stat-card,
#page-admin-support .admin-stat-grid .stat-card{background:#fff!important}
#app-view .admin-site-cms-card,
#app-view .admin-billing-card{margin-bottom:22px}
#app-view .cms-toolbar{
  align-items:end;
  gap:16px;
  padding:16px;
  border:1px solid var(--ac-ui-line)!important;
  border-radius:18px!important;
  background:#f7f8fa!important;
  color:var(--ac-ui-ink)!important;
}
#app-view .cms-toolbar .field>span{color:var(--ac-ui-body)!important}
#app-view .cms-editor{gap:16px}
#app-view .cms-collection{
  border-color:var(--ac-ui-line)!important;
  border-radius:18px!important;
  background:#f8f9fb!important;
}
#app-view .cms-collection-item{border-color:var(--ac-ui-line)!important;border-radius:16px!important;box-shadow:var(--ac-ui-shadow-xs)}
#app-view .cms-save-bar{
  bottom:14px;
  border-color:#d8d1f4!important;
  border-radius:16px!important;
  background:rgba(255,255,255,.97)!important;
  box-shadow:0 18px 42px rgba(16,24,40,.12)!important;
}
#app-view .admin-plan-manager{gap:20px}
#app-view .admin-plan-list-item{border-color:var(--ac-ui-line)!important;background:#fafbfc!important;transition:transform .18s var(--ac-ui-ease),border-color .18s ease,background .18s ease}
#app-view .admin-plan-list-item:hover{transform:translateY(-2px);border-color:#cfc6ff!important;background:#f8f6ff!important}
#app-view .admin-billing-note{border-color:#e1dcf6!important;border-radius:16px!important;background:#f8f6ff!important;color:#4f4664!important}
#app-view .plan-feature-fieldset{border-color:var(--ac-ui-line)!important;border-radius:18px!important}
#app-view .plan-feature-grid label{border-color:var(--ac-ui-line)!important;border-radius:14px!important;background:#fafbfc!important}
#app-view .customer-filter-panel{
  gap:12px;
  margin-bottom:16px;
  padding:14px;
  border:1px solid var(--ac-ui-line);
  border-radius:18px;
  background:#fff;
  box-shadow:var(--ac-ui-shadow-xs);
}
#app-view .customer-filter-panel-optimized{
  grid-template-columns:minmax(320px,1.6fr) repeat(4,minmax(136px,.7fr));
}
#app-view .customer-filter-field>span{color:var(--ac-ui-muted)!important}
#app-view .customer-filter-field select{border-color:var(--ac-ui-line-strong)!important;color:var(--ac-ui-body)!important;background:#fff!important}
#app-view .admin-user-row,
#app-view .coupon-admin-row,
#app-view .blocked-identity-row{border-color:#eceff2!important}
#app-view .admin-row-actions{gap:7px!important}
#app-view .admin-row-actions .button,
#app-view .coupon-admin-actions .button{min-height:38px;padding-inline:12px}
#app-view .panel-head .button.compact{min-width:max-content;white-space:nowrap}
#app-view .backup-warning{border-radius:16px!important}
#app-view .backup-card{padding-bottom:20px}

/* Dialogs and builders */
#app-view dialog::backdrop{background:rgba(15,12,22,.62)!important;backdrop-filter:blur(10px)}
#app-view .dialog-card{
  border:1px solid rgba(255,255,255,.72)!important;
  border-radius:24px!important;
  box-shadow:0 38px 110px rgba(16,12,26,.34)!important;
}
#app-view .dialog-head{padding:20px 22px!important;border-bottom-color:var(--ac-ui-line)!important;background:#fff!important}
#app-view .dialog-body{padding:20px 22px!important}
#app-view .dialog-foot{padding:15px 22px!important;border-top-color:var(--ac-ui-line)!important;background:rgba(255,255,255,.98)!important}
#app-view .builder-layout{background:#f6f7f9!important}
#app-view .builder-body{gap:14px!important;padding:18px!important}
#app-view .builder-section{
  border:1px solid var(--ac-ui-line)!important;
  border-radius:20px!important;
  background:#fff!important;
  box-shadow:var(--ac-ui-shadow-xs)!important;
}
#app-view .trigger-option,
#app-view .radio-card,
#app-view .toggle-card{border-color:var(--ac-ui-line)!important;border-radius:15px!important;background:#fff!important}
#app-view .trigger-option:has(input:checked),
#app-view .radio-card:has(input:checked),
#app-view .toggle-card:has(input:checked){border-color:#9b86f2!important;background:#f6f3ff!important;box-shadow:0 0 0 3px rgba(109,74,255,.08)!important}
#app-view .flow-preview{background:linear-gradient(180deg,#1b1721,#2d2538)!important}
#app-view .preview-note{color:rgba(255,255,255,.68)!important}
#app-view .toast{border-color:var(--ac-ui-line)!important;border-radius:14px!important;box-shadow:var(--ac-ui-shadow-md)!important}

/* -------------------------------------------------------------------------- */
/* Responsive refinement                                                       */
/* -------------------------------------------------------------------------- */

@media(max-width:1200px){
  #app-view .form-grid.four{grid-template-columns:repeat(2,minmax(0,1fr))}
  #app-view .admin-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  #app-view .customer-filter-panel-optimized{grid-template-columns:repeat(2,minmax(0,1fr))}
  #app-view .customer-filter-panel-optimized .search-field{grid-column:1/-1}
}

@media(max-width:1500px){
  #page-admin .admin-billing-form .form-grid.four{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:980px){
  body.acx-landing-page main.page>.hero,
  body.acx-landing-page main.mc-editorial-page>.hero{padding:52px 28px!important;border-radius:30px!important}
  body.acx-landing-page .hero h1{font-size:clamp(3.5rem,10vw,6.2rem)!important}
  body.acx-landing-page .hero-card{animation:none}
  #app-view .sidebar{inset:0 auto 0 0;width:min(320px,88vw)!important;height:100dvh;border-radius:0 24px 24px 0}
  #app-view .workspace{margin-left:0!important}
  #app-view .page-container{padding:24px 20px 56px!important}
}

@media(max-width:720px){
  #landing-view.acx-homepage .mcv2-hero-shade{
    background:linear-gradient(90deg,rgba(4,5,8,.82),rgba(5,7,12,.28)),linear-gradient(0deg,rgba(3,4,7,.68),transparent 58%)!important;
  }
  #landing-view.acx-homepage .mcv2-platform-list a{border-radius:18px!important}
  #landing-view.acx-homepage .mcv2-before-card,
  #landing-view.acx-homepage .mcv2-after-card{border-radius:28px!important}
  body.acx-landing-page main.page>.section,
  body.acx-landing-page main.mc-editorial-page>.section{padding:64px 18px!important}
  body.acx-landing-page .grid>.card,
  body.acx-landing-page .grid>article,
  body.acx-landing-page .faq article{min-height:0;padding:23px!important;border-radius:18px!important}
  body.acx-landing-page .pricing-hero{min-height:auto}
  body.acx-landing-page.mc-pricing-page .seo-pricing-grid .price-card,
  body.acx-landing-page.mc-pricing-page .seo-pricing-grid .price-card.recommended{border-radius:18px!important}
  #login-view .login-panel{padding:28px 20px}
  #app-view .topbar{min-height:74px!important;padding:11px 14px!important}
  #app-view .page-container{padding:20px 14px 48px!important}
  #app-view .page-actions{align-items:flex-start;flex-direction:column}
  #app-view .page-actions .button-row{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  #app-view .page-actions .button{width:100%;min-width:0;white-space:normal}
  #app-view .panel{border-radius:18px!important}
  #app-view .panel-head{align-items:flex-start;padding:18px!important}
  #page-overview .mc-home-intro{margin-bottom:38px}
  #page-overview .mc-home-section{margin-bottom:32px}
  #page-overview .mc-template-carousel .quick-template{min-height:154px}
  #app-view .form-grid.two,
  #app-view .form-grid.four,
  #app-view .coupon-toggle-grid,
  #app-view .admin-stat-grid,
  #app-view .customer-filter-panel-optimized{grid-template-columns:1fr}
  #app-view .customer-filter-panel-optimized .search-field{grid-column:auto}
  #app-view .cms-toolbar,
  #app-view .cms-save-bar{align-items:stretch;flex-direction:column}
  #app-view .cms-toolbar .button-row,
  #app-view .cms-save-bar .button{width:100%}
  #app-view .dialog-card{border-radius:20px!important}
}

@media(max-width:760px){
  #page-inbox .inbox-shell{
    height:calc(100dvh - 115px)!important;
    min-height:0!important;
    max-height:calc(100dvh - 115px);
    overflow:hidden!important;
  }
  #page-inbox .conversation-pane{
    height:100%;
    min-height:0!important;
    overflow:hidden!important;
  }
  #page-inbox .conversation-list{
    height:100%!important;
    min-height:0!important;
    max-height:100%;
  }
}

@media(max-width:520px){
  body.acx-landing-page main.page>.hero,
  body.acx-landing-page main.mc-editorial-page>.hero,
  body.acx-landing-page .pricing-hero{width:calc(100% - 16px)!important;padding:40px 19px!important;border-radius:24px!important}
  body.acx-landing-page .hero h1,
  body.acx-landing-page .pricing-hero h1{font-size:clamp(3rem,13.5vw,4.7rem)!important;line-height:.89!important}
  body.acx-landing-page .hero .lead,
  body.acx-landing-page .hero>p:not(:first-child){font-size:1rem}
  body.acx-landing-page main.page>.cta,
  body.acx-landing-page main.mc-editorial-page>.cta{width:calc(100% - 16px);margin:38px auto;padding:34px 20px;border-radius:24px}
  #app-view .topbar-title h1{font-size:1.2rem!important}
  #app-view .topbar-actions>.icon-button{display:none}
  #app-view .page-container{padding-inline:12px!important}
  #app-view .page-actions .button-row{grid-template-columns:1fr}
  #app-view .stat-grid{grid-template-columns:1fr!important}
  #app-view .stat-card{min-height:104px}
  #app-view .filter-row{align-items:stretch;flex-direction:column}
  #app-view .filter-row select{width:100%}
  #app-view .dialog-head{padding:16px!important}
  #app-view .dialog-body{padding:16px!important}
  #app-view .dialog-foot{padding:13px 16px calc(13px + env(safe-area-inset-bottom))!important}
}

@keyframes acUiAmbientGrid{
  from{background-position:0 0,0 0,0 0,0 0}
  to{background-position:18px -12px,-20px 14px,20px 16px,20px 16px}
}
@keyframes acUiHeroCardFloat{
  0%,100%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(0,-8px,0)}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  body.acx-landing-page .hero-card{transform:none!important}
}

/* Overlay ownership: the viewport stays fixed while the active surface keeps
   its own scrolling. This is shared by dialogs, popovers and mobile drawers. */
html.overlay-scroll-locked,
body.overlay-scroll-locked{
  overflow:hidden!important;
  overscroll-behavior:none!important;
}
body.overlay-scroll-locked{
  position:fixed!important;
  width:100%!important;
}
body.overlay-scroll-locked .sidebar,
body.overlay-scroll-locked .public-nav-drawer,
body.overlay-scroll-locked .dialog-body{
  overscroll-behavior-y:contain;
  -webkit-overflow-scrolling:touch;
}

/* ManyChat-style automation template library. */
#app-view .template-dialog::backdrop{
  background:#2f2d34!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}
#app-view .template-dialog[open]{
  position:fixed!important;
  inset:0!important;
  width:min(560px,calc(100vw - 24px))!important;
  height:min(780px,calc(100dvh - 24px))!important;
  max-width:calc(100vw - 24px)!important;
  max-height:calc(100dvh - 24px)!important;
  margin:auto!important;
  padding:0!important;
  overflow:hidden!important;
  border-radius:20px!important;
}
#app-view .template-dialog-card{
  width:100%;
  height:100%;
  min-height:0;
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  overflow:hidden;
  border:1px solid #d8d8d4!important;
  border-radius:20px!important;
  background:#f7f7f5;
}
#app-view .template-dialog-head{background:#fff!important}
#app-view .template-dialog-head .eyebrow{display:none}
#app-view .template-dialog-head h2{font-size:1.45rem!important}
#app-view .template-body{
  min-height:0;
  max-height:none;
  align-content:start;
  gap:12px!important;
  overflow-y:auto;
  overscroll-behavior-y:contain;
  background:#f7f7f5;
  scrollbar-gutter:stable;
}
#app-view .template-choice-list{display:grid;gap:11px}
#app-view .template-library-card{
  min-height:142px;
  grid-template-columns:42px minmax(0,1fr) auto;
  align-items:start;
  gap:12px;
  padding:17px!important;
  border-color:#e1e1de!important;
  border-radius:12px!important;
  box-shadow:0 1px 0 rgba(20,20,20,.02);
}
#app-view .template-library-card:hover{border-color:#b8acef!important;background:#fff!important}
#app-view .template-library-card .template-icon{width:40px;height:40px;border-radius:12px;font-size:1rem}
#app-view .template-library-card>div{min-width:0;align-self:stretch;align-content:start}
#app-view .template-library-card strong{font-size:.98rem;line-height:1.25}
#app-view .template-library-card p{margin:7px 0 19px;color:#6f6f6b;font-size:.76rem;line-height:1.42}
#app-view .template-library-card small{margin-top:auto;color:#8a8a85;font-size:.65rem}
#app-view .template-library-card>b{align-self:end;padding:5px 7px;border-radius:4px;color:#fff;background:#bd5b00;font-size:.58rem;font-style:normal;text-transform:uppercase}
#app-view .template-library-card>i{align-self:center;color:#7657ef;font-size:1.05rem;font-style:normal}
/* The flow editor remains a modal surface on phones instead of becoming a
   second edge-to-edge page. Only its builder body scrolls. */
@media(max-width:900px){
  #app-view 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;
    padding:0!important;
    border-radius:20px!important;
    overflow:hidden!important;
  }
  #app-view .automation-dialog .builder-card{
    width:100%;
    height:100%;
    max-height:100%;
    border-radius:20px!important;
    overflow:hidden;
  }
  #app-view .automation-dialog .builder-layout{height:100%;min-height:0}
  #app-view .automation-dialog .builder-body{
    height:100%;
    min-height:0;
    overflow-y:auto!important;
    overscroll-behavior-y:contain;
    touch-action:pan-y;
  }
  #app-view .automation-dialog .dialog-head{padding-top:16px!important}
  #app-view .automation-dialog .dialog-foot{padding-bottom:max(13px,env(safe-area-inset-bottom))!important}
}

@media(max-width:520px){
  #app-view .template-dialog[open]{
    width:calc(100vw - 16px)!important;
    height:calc(100dvh - 16px)!important;
    max-width:calc(100vw - 16px)!important;
    max-height:calc(100dvh - 16px)!important;
    border-radius:16px!important;
  }
  #app-view .template-dialog-card{border-radius:16px!important}
  #app-view .template-body{padding:14px!important}
  #app-view .template-library-card{min-height:132px;padding:15px!important}
}
