/* BLCKStudio identity — black, navy, white and electric blue. */
:root{
  --blck-blue:#086bff;
  --blck-blue-strong:#0054df;
  --blck-blue-soft:#0b88ff;
  --blck-cyan:#46b3ff;
  --blck-bg:#02050b;
  --blck-bg-2:#040914;
  --blck-sidebar:#03060d;
  --blck-panel:#07101d;
  --blck-panel-2:#0a1423;
  --blck-panel-3:#0d192a;
  --blck-line:#172944;
  --blck-line-soft:rgba(120,163,224,.14);
  --blck-text:#f7f9fd;
  --blck-muted:#8d9ab0;
  --blck-muted-2:#65738b;
  --blck-green:#37d68a;
  --blck-red:#ff6d7a;
  --blck-shadow:0 22px 70px rgba(0,12,32,.38);
  --orange:var(--blck-blue);
  --orange-2:var(--blck-blue-strong);
  --blue:var(--blck-blue);
  --green:var(--blck-green);
  --red:var(--blck-red);
  --bg:var(--blck-bg);
  --panel:var(--blck-panel);
  --panel-2:var(--blck-panel-2);
  --line:var(--blck-line);
  --text:var(--blck-text);
  --muted:var(--blck-muted);
}

html{color-scheme:dark;background:var(--blck-bg)}
body.app-body{
  margin:0;
  min-height:100vh;
  background:var(--blck-bg);
  color:var(--blck-text);
  font-family:"Inter",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:13px;
  letter-spacing:-.006em;
}
body.app-body h1,
body.app-body .display-title{
  font-family:"Barlow Condensed","Inter",sans-serif;
  font-weight:800;
  letter-spacing:-.035em;
}
body.app-body h2,
body.app-body h3,
body.app-body .metric-copy strong,
body.app-body .billing-card strong,
body.app-body .plan-price strong{
  font-family:"Inter",ui-sans-serif,sans-serif;
  letter-spacing:-.025em;
}
body.app-body a{color:inherit;text-decoration:none}
body.app-body ::selection{background:rgba(8,107,255,.35);color:#fff}

body.app-body .app-shell{background:var(--blck-bg)}
body.app-body .sidebar{
  background:
    radial-gradient(circle at 15% -5%,rgba(8,107,255,.15),transparent 24%),
    linear-gradient(180deg,#050914 0%,#02050a 100%);
  border-right:1px solid rgba(74,122,194,.15);
  box-shadow:18px 0 70px rgba(0,0,0,.22);
}
body.app-body .sidebar-brand-row{padding:4px 6px 28px}
body.app-body .brand{display:flex;align-items:center;gap:12px;min-width:0}
body.app-body .brand-logo{
  width:112px;
  height:auto;
  display:block;
  object-fit:contain;
  filter:drop-shadow(0 8px 20px rgba(0,0,0,.24));
}
body.app-body .brand-product{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:24px;
  padding:0 8px;
  border:1px solid rgba(50,134,255,.34);
  border-radius:999px;
  background:rgba(8,107,255,.1);
  color:#8fc1ff;
  font-size:8px;
  font-weight:800;
  letter-spacing:.14em;
}
body.app-body .nav-label{color:#526078;font-size:8px;letter-spacing:.2em;margin-top:12px}
body.app-body .nav-list{gap:5px}
body.app-body .nav-list a{
  min-height:44px;
  color:#8996aa;
  border:1px solid transparent;
  border-radius:12px;
  font-size:11px;
  transition:background .18s,border-color .18s,color .18s,transform .18s;
}
body.app-body .nav-list a:hover{
  background:rgba(255,255,255,.035);
  border-color:rgba(103,147,211,.1);
  color:#f5f8ff;
  transform:translateX(1px);
}
body.app-body .nav-list a.is-active{
  color:#fff;
  background:linear-gradient(90deg,rgba(8,107,255,.23),rgba(8,107,255,.07));
  border-color:rgba(56,137,255,.22);
  box-shadow:inset 2px 0 0 var(--blck-blue),0 8px 28px rgba(0,71,190,.08);
}
body.app-body .nav-list a svg{color:#61718a}
body.app-body .nav-list a:hover svg,
body.app-body .nav-list a.is-active svg{color:#5ea4ff}
body.app-body .nav-list a em{
  color:#8fc1ff;
  border-color:rgba(63,145,255,.23);
  background:rgba(8,107,255,.08);
}
body.app-body .nav-live-dot{background:#3f9cff;box-shadow:0 0 12px rgba(63,156,255,.72)}
body.app-body .sidebar-user{
  background:rgba(255,255,255,.025);
  border-color:rgba(114,154,211,.13);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.015);
}
body.app-body .avatar{
  background:linear-gradient(145deg,#0d58cf,#0877ff);
  color:#fff;
  box-shadow:0 8px 24px rgba(8,107,255,.22);
}
body.app-body .sidebar-user-copy strong{color:#f8faff}
body.app-body .sidebar-user-copy small{color:#66758d}
body.app-body .sidebar-context{
  margin:0 0 10px;
  padding:10px 11px;
  border:1px solid rgba(65,145,255,.2);
  border-radius:12px;
  background:rgba(8,107,255,.07);
}
body.app-body .sidebar-context small{display:block;color:#6e9edc;font-size:8px;text-transform:uppercase;letter-spacing:.12em}
body.app-body .sidebar-context strong{display:block;color:#fff;font-size:10px;margin:4px 0 8px}
body.app-body .sidebar-context button{width:100%}

body.app-body .workspace{
  min-width:0;
  background:
    radial-gradient(circle at 78% -8%,rgba(8,107,255,.14),transparent 26%),
    radial-gradient(circle at 20% 110%,rgba(0,74,190,.09),transparent 30%),
    linear-gradient(180deg,#040914 0%,#02050b 100%);
}
body.app-body .workspace:before{
  content:"";
  position:fixed;
  inset:68px 0 0 272px;
  pointer-events:none;
  opacity:.16;
  background-image:linear-gradient(rgba(92,139,205,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(92,139,205,.06) 1px,transparent 1px);
  background-size:56px 56px;
  mask-image:linear-gradient(180deg,#000,transparent 82%);
}
body.app-body .topbar{
  background:rgba(3,7,15,.82);
  border-bottom:1px solid rgba(102,145,207,.13);
  backdrop-filter:blur(18px) saturate(130%);
}
body.app-body .topbar-title small{color:#56647a}
body.app-body .topbar-title strong{color:#f3f6fb;font-weight:650}
body.app-body .status-badge,
body.app-body .role-badge,
body.app-body .build-badge{
  background:rgba(255,255,255,.025);
  border-color:rgba(107,149,210,.14);
  color:#78869b;
}
body.app-body .status-badge i{background:var(--blck-green);box-shadow:0 0 10px rgba(55,214,138,.55)}
body.app-body .role-badge{color:#8fbeff;border-color:rgba(60,142,255,.2);background:rgba(8,107,255,.07)}
body.app-body .build-badge{color:#526078}
body.app-body .main{position:relative;z-index:1;max-width:1540px;padding:38px clamp(24px,3.5vw,58px) 70px}

body.app-body .page-hero{align-items:center;margin-bottom:25px}
body.app-body .hero-copy{max-width:820px}
body.app-body .kicker{color:#63a6ff;font-size:8px;letter-spacing:.2em}
body.app-body .kicker:before{background:linear-gradient(90deg,var(--blck-blue),transparent)}
body.app-body .hero-copy h1{
  margin:10px 0 11px;
  color:#fff;
  font-size:clamp(40px,4.6vw,68px);
  line-height:.92;
  text-transform:uppercase;
}
body.app-body .hero-copy h1 span{color:#1477ff}
body.app-body .hero-copy p{max-width:690px;color:#8996aa;font-size:12px;line-height:1.7}
body.app-body .hero-actions{align-items:center}
body.app-body .scope-note{
  color:#8d9ab0;
  border:1px solid rgba(101,148,215,.14);
  background:rgba(255,255,255,.02);
  border-radius:999px;
  padding:7px 10px;
}
body.app-body .scope-note i{background:#3e9cff;box-shadow:0 0 9px rgba(62,156,255,.65)}

body.app-body .btn{
  min-height:42px;
  border-radius:10px;
  font-size:9px;
  letter-spacing:.02em;
  box-shadow:none;
}
body.app-body .btn-primary{
  color:#fff;
  background:linear-gradient(135deg,#0a70ff,#0056df);
  border:1px solid rgba(103,174,255,.35);
  box-shadow:0 12px 30px rgba(0,87,225,.22),inset 0 1px 0 rgba(255,255,255,.18);
}
body.app-body .btn-primary:hover{transform:translateY(-1px);filter:brightness(1.08);box-shadow:0 16px 38px rgba(0,87,225,.3)}
body.app-body .btn-secondary{
  color:#dce6f5;
  background:rgba(255,255,255,.025);
  border:1px solid rgba(112,155,217,.17);
}
body.app-body .btn-secondary:hover{color:#fff;background:rgba(15,93,208,.12);border-color:rgba(70,151,255,.35)}
body.app-body .btn-danger{background:rgba(255,109,122,.08);color:#ff98a1;border-color:rgba(255,109,122,.2)}
body.app-body .ghost,
body.app-body .ghost-btn{
  color:#91a0b6;
  border:1px solid rgba(110,151,210,.15);
  background:rgba(255,255,255,.02);
}
body.app-body .ghost:hover,
body.app-body .ghost-btn:hover{color:#fff;border-color:rgba(72,150,255,.36);background:rgba(8,107,255,.09)}

body.app-body .panel,
body.app-body .metric,
body.app-body .billing-card,
body.app-body .card,
body.app-body .lead-card,
body.app-body .campaign-card,
body.app-body .wizard-main-card,
body.app-body .sources-card{
  color:var(--blck-text);
  background:linear-gradient(180deg,rgba(10,19,33,.96),rgba(6,13,24,.98))!important;
  border-color:rgba(104,149,214,.14)!important;
  box-shadow:var(--blck-shadow),inset 0 1px 0 rgba(255,255,255,.02);
}
body.app-body .panel{border-radius:18px}
body.app-body .panel-pad{padding:22px}
body.app-body .panel-head h2{color:#f5f8fd;font-weight:650}
body.app-body .panel-head p{color:#78869c}
body.app-body .panel-head>a{color:#7faeff}

body.app-body .metric-grid{gap:12px}
body.app-body .metric{
  min-height:108px;
  border-radius:16px;
  position:relative;
  overflow:hidden;
}
body.app-body .metric:after{
  content:"";
  position:absolute;
  inset:auto -10% -55% 35%;
  height:90px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(8,107,255,.12),transparent 68%);
}
body.app-body .metric:hover{transform:translateY(-2px);border-color:rgba(59,142,255,.3)!important;box-shadow:0 24px 65px rgba(0,27,73,.35)}
body.app-body .metric-icon{
  background:linear-gradient(145deg,rgba(8,107,255,.19),rgba(8,107,255,.07));
  color:#66a9ff;
  border:1px solid rgba(72,151,255,.2);
}
body.app-body .metric-copy span{color:#718098}
body.app-body .metric-copy strong{color:#fff;font-size:30px;font-weight:700}
body.app-body .metric-copy small{color:#56657b}

body.app-body .account-strip,
body.app-body .plan-banner{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  align-items:center;
  gap:18px;
  margin-bottom:14px;
  padding:16px 18px;
  color:#fff;
  border:1px solid rgba(57,137,255,.24);
  border-radius:17px;
  background:
    linear-gradient(100deg,rgba(8,107,255,.18),rgba(8,107,255,.045) 58%,rgba(4,10,19,.96)),
    #07101d;
  box-shadow:0 18px 50px rgba(0,25,70,.2);
}
body.app-body .plan-banner h3{color:#fff;font-size:12px}
body.app-body .plan-banner p{color:#7790b3}
body.app-body .plan-price strong{color:#fff}
body.app-body .plan-price small{color:#687a94}
body.app-body .usage-ring{background:conic-gradient(#1477ff calc(var(--p)*1%),#142238 0)}
body.app-body .usage-ring:after{background:#07101d}
body.app-body .usage-ring span{color:#fff}

body.app-body .track,
body.app-body .pipeline-track{background:#111e31}
body.app-body .track i,
body.app-body .pipeline-track i{background:linear-gradient(90deg,#005ce8,#1b8cff);box-shadow:0 0 14px rgba(20,119,255,.28)}
body.app-body .pipeline-row span{color:#7d8ba0}
body.app-body .pipeline-row strong{color:#eaf1fb}

body.app-body .integration-item,
body.app-body .recent-row,
body.app-body .permission-help>div,
body.app-body .source-note{
  color:#eaf1fb;
  background:rgba(255,255,255,.018);
  border-color:rgba(105,148,209,.1);
}
body.app-body .integration-item:hover,
body.app-body .recent-row:hover{background:rgba(8,107,255,.055);border-color:rgba(61,143,255,.2)}
body.app-body .integration-logo,
body.app-body .source-icon,
body.app-body .company-avatar{
  color:#73b1ff;
  background:rgba(8,107,255,.11);
  border:1px solid rgba(68,149,255,.18);
}
body.app-body .integration-copy strong,
body.app-body .recent-row strong,
body.app-body .user-main strong{color:#f2f6fc}
body.app-body .integration-copy small,
body.app-body .recent-row small,
body.app-body .user-main small{color:#65758d}
body.app-body .state.ok{color:#69e4a5;background:rgba(55,214,138,.08)}
body.app-body .state.warn{color:#8dbdff;background:rgba(8,107,255,.09)}
body.app-body .state.off{color:#718098;background:rgba(255,255,255,.035)}
body.app-body .empty{color:#fff}
body.app-body .empty p{color:#77869d}
body.app-body .empty-icon{color:#66a9ff;background:rgba(8,107,255,.08);border-color:rgba(67,149,255,.22)}
body.app-body .pill{color:#9ac7ff;background:rgba(8,107,255,.09);border:1px solid rgba(69,148,255,.17)}
body.app-body .score{color:#78b6ff;border-color:rgba(68,149,255,.25);background:rgba(8,107,255,.08)}

body.app-body .billing-grid{gap:10px}
body.app-body .billing-card{border-radius:15px}
body.app-body .billing-card.highlight{
  background:linear-gradient(145deg,rgba(8,107,255,.18),rgba(7,16,29,.98))!important;
  border-color:rgba(63,145,255,.26)!important;
}
body.app-body .billing-card span{color:#6e7d93}
body.app-body .billing-card strong{color:#fff;font-weight:700}
body.app-body .billing-card small{color:#596981}
body.app-body .progress-line{background:#122039}
body.app-body .progress-line i{background:linear-gradient(90deg,#005ce8,#1a8cff)}

body.app-body .team-insight-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:12px;margin-bottom:14px}
body.app-body .team-policy{
  display:flex;
  align-items:center;
  gap:14px;
  padding:16px;
  border:1px solid rgba(64,145,255,.18);
  border-radius:15px;
  background:rgba(8,107,255,.055);
}
body.app-body .team-policy-icon{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;color:#7cb9ff;background:rgba(8,107,255,.12);border:1px solid rgba(65,147,255,.2)}
body.app-body .team-policy strong{display:block;color:#f3f7fd;font-size:11px}
body.app-body .team-policy small{display:block;color:#728198;font-size:9px;line-height:1.55;margin-top:4px}

body.app-body .toolbar{gap:10px}
body.app-body .search-box{max-width:430px}
body.app-body .search-box input,
body.app-body .select-compact{
  color:#eaf0f8!important;
  background:#060d18!important;
  border-color:rgba(107,150,210,.16)!important;
}
body.app-body .search-box svg{color:#61728b}
body.app-body .table-wrap{border:1px solid rgba(100,145,210,.13);border-radius:14px;overflow:auto;background:rgba(4,10,19,.45)}
body.app-body .data-table{background:transparent;color:#dfe8f5}
body.app-body .data-table thead{background:rgba(255,255,255,.02)}
body.app-body .data-table th{color:#617089;border-color:rgba(99,142,204,.12)}
body.app-body .data-table td{color:#8e9bb0;border-color:rgba(99,142,204,.09)}
body.app-body .data-table tbody tr:hover td{background:rgba(8,107,255,.045)}
body.app-body .user-cell strong{color:#f2f6fc}
body.app-body .user-cell small{color:#66758c}
body.app-body .role-chip,
body.app-body .status-chip,
body.app-body .seat-chip{border:1px solid rgba(101,145,207,.13)}
body.app-body .role-chip{color:#93a2b8;background:rgba(255,255,255,.025)}
body.app-body .role-chip.admin,
body.app-body .role-chip.super_admin{color:#9fcaff;background:rgba(8,107,255,.1);border-color:rgba(64,145,255,.2)}
body.app-body .role-chip.manager{color:#9ed0ff;background:rgba(42,146,255,.08)}
body.app-body .role-chip.seller{color:#9aa9bd;background:rgba(255,255,255,.025)}
body.app-body .status-chip.active{color:#62dea0;background:rgba(55,214,138,.07)}
body.app-body .status-chip.inactive{color:#ff929c;background:rgba(255,109,122,.07)}
body.app-body .seat-chip{color:#91bfff;background:rgba(8,107,255,.055)}
body.app-body .lead-count-cell strong{display:block;color:#eaf2fc;font-size:11px}
body.app-body .lead-count-cell small{display:block;color:#607089;font-size:8px;margin-top:3px}

body.app-body input,
body.app-body textarea,
body.app-body select{
  color:#eaf1fb!important;
  background:#060d18!important;
  border-color:rgba(104,148,209,.17)!important;
  box-shadow:none!important;
}
body.app-body input::placeholder,
body.app-body textarea::placeholder{color:#4e5d73}
body.app-body input:focus,
body.app-body textarea:focus,
body.app-body select:focus{
  outline:none;
  border-color:rgba(52,136,255,.68)!important;
  box-shadow:0 0 0 4px rgba(8,107,255,.09)!important;
}
body.app-body label{color:#8190a6}
body.app-body .field small{color:#5f6e84}
body.app-body .field-error{color:#ff929c!important}

body.app-body .modal-backdrop{background:rgba(0,4,10,.78);backdrop-filter:blur(12px)}
body.app-body .modal{
  color:#eaf2fc;
  background:linear-gradient(180deg,#0b1422,#050b14);
  border-color:rgba(95,144,214,.2);
  box-shadow:0 38px 110px rgba(0,0,0,.62),inset 0 1px 0 rgba(255,255,255,.025);
}
body.app-body .modal-head,
body.app-body .modal-foot{border-color:rgba(104,148,210,.13)}
body.app-body .modal-head h2{color:#fff}
body.app-body .modal-head p{color:#728198}
body.app-body .modal-close{color:#8b99ad;background:rgba(255,255,255,.04)}
body.app-body .modal-close:hover{color:#fff;background:rgba(8,107,255,.14)}
body.app-body .plan-option{color:#eaf1fb;background:#07101c;border-color:rgba(102,146,209,.14)}
body.app-body .plan-option:has(input:checked){background:rgba(8,107,255,.11);border-color:rgba(61,143,255,.48);box-shadow:0 0 0 3px rgba(8,107,255,.08)}
body.app-body .plan-option b{color:#6eafff}
body.app-body .plan-option small{color:#66758c}
body.app-body .modal-section-title{font-size:8px;color:#72a9ef;letter-spacing:.16em;text-transform:uppercase;margin:3px 0 12px}
body.app-body .permission-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:15px}
body.app-body .permission-card{padding:11px;border-radius:11px;background:rgba(255,255,255,.022);border:1px solid rgba(100,145,208,.11)}
body.app-body .permission-card strong{display:block;color:#e8f0fb;font-size:9px}
body.app-body .permission-card small{display:block;color:#64738a;font-size:8px;line-height:1.5;margin-top:4px}

body.app-body .integration-overview{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:12px;margin-bottom:14px}
body.app-body .setup-progress{padding:20px;display:flex;align-items:center;justify-content:space-between;gap:20px}
body.app-body .setup-progress-copy strong{display:block;color:#fff;font-size:15px}
body.app-body .setup-progress-copy p{margin:5px 0 0;color:#728198;font-size:9px;line-height:1.6}
body.app-body .setup-progress-bar{width:min(320px,42%);height:8px;border-radius:999px;background:#111f34;overflow:hidden}
body.app-body .setup-progress-bar i{display:block;height:100%;background:linear-gradient(90deg,#005be8,#1687ff);border-radius:inherit}
body.app-body .security-note{padding:18px;display:flex;align-items:flex-start;gap:11px}
body.app-body .security-note svg{color:#66a9ff;flex:0 0 auto}
body.app-body .security-note strong{display:block;color:#f3f7fc;font-size:10px}
body.app-body .security-note small{display:block;color:#69788f;font-size:8px;line-height:1.55;margin-top:4px}
body.app-body .integration-grid{gap:12px}
body.app-body .integration-card{border-radius:16px}
body.app-body .integration-card:before{background:linear-gradient(90deg,transparent,rgba(30,126,255,.65),transparent)}
body.app-body .integration-card p{color:#748399}
body.app-body .phone-status{background:rgba(255,255,255,.02);border-color:rgba(100,145,208,.12)}
body.app-body .phone-status span{color:#8290a5}
body.app-body .qr-code-text{color:#72b2ff}

body.app-body .client-row{background:rgba(255,255,255,.018);border-color:rgba(103,146,208,.12)}
body.app-body .client-row:hover{background:rgba(8,107,255,.04);border-color:rgba(61,143,255,.22)}
body.app-body .mini-state{background:rgba(255,255,255,.03);color:#66758c}
body.app-body .mini-state.ok{color:#61dda0;background:rgba(55,214,138,.07)}
body.app-body .client-access{display:flex;justify-content:flex-end}

body.app-body .wizard-step{color:#718097}
body.app-body .wizard-step b{background:#07101d;border-color:rgba(105,149,211,.17);color:#728198}
body.app-body .wizard-step.active{color:#e8f1fc}
body.app-body .wizard-step.active b{color:#76b5ff;background:rgba(8,107,255,.11);border-color:rgba(62,144,255,.35)}
body.app-body .wizard-line{background:linear-gradient(90deg,rgba(25,123,255,.7),rgba(80,121,179,.15))}
body.app-body .section-label{color:#6caeff}
body.app-body .source-chip{border-color:rgba(102,146,208,.1)}
body.app-body .source-chip strong{color:#f0f5fc}
body.app-body .source-chip small{color:#6d7b91}
body.app-body .source-note{background:rgba(8,107,255,.045)}
body.app-body .source-note b{color:#a9cbf8}
body.app-body .source-note p{color:#6d7c92}

/* Keep the mining animation cinematic and aligned with the brand. */
body.app-body .mining-stage-card{
  border-color:rgba(61,143,255,.25);
  background:
    radial-gradient(circle at 24% 45%,rgba(8,107,255,.18),transparent 34%),
    linear-gradient(135deg,#020711,#081426);
  box-shadow:0 28px 80px rgba(0,25,75,.38);
}
body.app-body .mine-glow{background:radial-gradient(circle,rgba(8,107,255,.24),transparent 66%)}
body.app-body .mine-rock{border-color:#1c3557;background:linear-gradient(145deg,#132642,#06101e)}
body.app-body .mine-sparks i{background:#4fb2ff;box-shadow:0 0 15px #087bff}
body.app-body .scan-ring{border-color:rgba(58,151,255,.28)}
body.app-body .mining-status-dot{background:#278cff;box-shadow:0 0 12px #1477ff}
body.app-body .mining-progress-track{background:#0d1b2f;border-color:#173255}
body.app-body .mining-progress-bar{background:linear-gradient(90deg,#0059e5,#1a8eff);box-shadow:0 0 24px rgba(16,123,255,.34)}
body.app-body .mining-step{background:#06101d;border-color:#132844;color:#617189}
body.app-body .mining-step.active{background:rgba(8,107,255,.09);border-color:rgba(55,140,255,.38)}
body.app-body .mining-step.active b,
body.app-body .mining-step.active .step-state{color:#73b2ff}
body.app-body .mining-metrics article{background:#07101c;border-color:#142944}
body.app-body .lead-result-card{background:#07101c;border-color:#162c4a}

@media(max-width:1100px){
  body.app-body .team-insight-grid,
  body.app-body .integration-overview{grid-template-columns:1fr}
  body.app-body .setup-progress-bar{width:42%}
}
@media(max-width:850px){
  body.app-body .workspace:before{display:none}
  body.app-body .workspace{background:linear-gradient(180deg,#040914,#02050b)}
  body.app-body .topbar{background:rgba(3,7,15,.94)}
  body.app-body .main{padding:27px 17px 50px}
  body.app-body .page-hero{align-items:flex-start}
  body.app-body .hero-copy h1{font-size:48px}
  body.app-body .brand-logo{width:104px}
}
@media(max-width:700px){
  body.app-body .permission-cards{grid-template-columns:1fr}
  body.app-body .setup-progress{align-items:flex-start;flex-direction:column}
  body.app-body .setup-progress-bar{width:100%}
}
@media(max-width:600px){
  body.app-body .hero-copy h1{font-size:40px}
  body.app-body .panel-pad{padding:17px}
  body.app-body .account-strip,
  body.app-body .plan-banner{grid-template-columns:1fr;align-items:flex-start}
  body.app-body .plan-price{text-align:left}
}