/* =========================================================
   cfs_zockt · Full Website UI v3
   Global visual system for public website + Creator Suite.
   Loaded AFTER the existing page CSS on purpose.
   ========================================================= */

:root{
  --cfs-v3-bg:#05070a;
  --cfs-v3-bg-deep:#020305;
  --cfs-v3-panel:#080d13;
  --cfs-v3-panel-2:#0b1119;
  --cfs-v3-line:#233142;
  --cfs-v3-line-soft:#1a2633;
  --cfs-v3-text:#f7faff;
  --cfs-v3-muted:#8493a3;
  --cfs-v3-blue:#1677ff;
  --cfs-v3-blue-2:#168cff;
  --cfs-v3-cyan:#48bfff;
  --cfs-v3-green:#3dde92;
  --cfs-v3-yellow:#ffc75c;
  --cfs-v3-red:#ff7589;
  --cfs-v3-radius:12px;
  --cfs-v3-shadow:0 18px 48px rgba(0,0,0,.22);
}

html.cfs-ui-v3{background:var(--cfs-v3-bg-deep)}
body.cfs-ui-v3{
  background:
    radial-gradient(circle at 72% -10%,rgba(18,111,241,.14),transparent 33%),
    radial-gradient(circle at 4% 42%,rgba(40,207,255,.05),transparent 27%),
    linear-gradient(180deg,var(--cfs-v3-bg) 0%,#020914 48%,var(--cfs-v3-bg-deep) 100%);
  color:var(--cfs-v3-text);
}

body.cfs-ui-v3:before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    linear-gradient(132deg,transparent 0 31%,rgba(18,111,241,.055) 31.1% 31.25%,transparent 31.35% 100%),
    linear-gradient(326deg,transparent 0 67%,rgba(40,207,255,.028) 67.05% 67.2%,transparent 67.3% 100%);
}

body.cfs-ui-v3 .container{width:min(1280px,calc(100% - 34px))}
body.cfs-ui-v3 a{transition:color .17s ease,border-color .17s ease,background .17s ease,transform .17s ease}

/* ---------- Shared brand lockup ---------- */
.cfs-brand-lockup{
  display:flex!important;
  align-items:center;
  gap:10px;
  min-width:0;
  padding:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.cfs-brand-mark{
  position:relative;
  width:46px;
  height:46px;
  flex:0 0 auto;
  overflow:hidden;
  border-radius:50%;
  filter:drop-shadow(0 0 14px rgba(20,140,255,.34));
}
.cfs-brand-mark:after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:50%;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);
  pointer-events:none;
}
.cfs-brand-mark img{
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  object-fit:cover;
  border-radius:50%;
  transform:scale(1.08);
  /* The uploaded logo stays pixel-identical. Screen blending visually removes
     the dark square background against the navy site without modifying it. */
  mix-blend-mode:screen;
}
.cfs-brand-copy{display:flex;flex-direction:column;line-height:1;min-width:0}
.cfs-brand-copy strong{
  display:block;
  color:#fff;
  font-size:23px;
  font-weight:1000;
  font-style:italic;
  letter-spacing:-1.5px;
  white-space:nowrap;
  text-transform:lowercase;
}
.cfs-brand-copy .cfs-brand-prefix{color:#f7fbff}
.cfs-brand-copy .cfs-brand-name{color:#1d70ea}
.cfs-brand-copy small{
  margin-top:5px;
  color:#527da5;
  font-size:6.5px;
  font-weight:1000;
  letter-spacing:.25em;
  white-space:nowrap;
}

/* ---------- Global header ---------- */
body.cfs-ui-v3 .site-header{
  min-height:72px;
  border-bottom:1px solid rgba(37,115,178,.25);
  background:rgba(2,8,18,.93);
  box-shadow:0 10px 38px rgba(0,0,0,.22);
  backdrop-filter:blur(18px);
}
body.cfs-ui-v3 .header-inner{min-height:72px;gap:20px}
body.cfs-ui-v3 .brand-logo-link,
body.cfs-ui-v3 .creator-brand{width:auto;min-width:0}
body.cfs-ui-v3 .creator-brand>span:not(.cfs-brand-copy):not(.cfs-brand-wordmark){display:none!important}

body.cfs-ui-v3 .nav{gap:3px}
body.cfs-ui-v3 .nav a,
body.cfs-ui-v3 .nav button,
body.cfs-ui-v3 .creator-nav-more>summary{
  position:relative;
  min-height:38px;
  display:inline-flex;
  align-items:center;
  padding:0 10px;
  border:1px solid transparent;
  border-radius:9px;
  color:#9eb3c8;
  background:transparent;
  font-size:9.5px;
  font-weight:900;
  letter-spacing:.04em;
}
body.cfs-ui-v3 .nav a:hover,
body.cfs-ui-v3 .nav a.active,
body.cfs-ui-v3 .nav a[aria-current="page"],
body.cfs-ui-v3 .nav button:hover,
body.cfs-ui-v3 .creator-nav-more>summary:hover{
  color:#fff;
  border-color:rgba(28,104,160,.28);
  background:#061727;
}
body.cfs-ui-v3 .nav a.active:after,
body.cfs-ui-v3 .nav a[aria-current="page"]:after{
  content:"";
  position:absolute;
  left:10px;right:10px;bottom:2px;
  height:2px;
  border-radius:99px;
  background:linear-gradient(90deg,var(--cfs-v3-blue),var(--cfs-v3-cyan));
  box-shadow:0 0 12px rgba(40,207,255,.42);
}
body.cfs-ui-v3 .nav .cta,
body.cfs-ui-v3 .creator-logout{
  border-color:#1f79be!important;
  color:#fff!important;
  background:linear-gradient(135deg,#0a3f79,#07539f)!important;
}
body.cfs-ui-v3 .mobile-toggle{
  border-color:#1a5179;
  background:#061727;
}

/* ---------- Buttons, inputs, cards ---------- */
body.cfs-ui-v3 .btn{
  min-height:44px;
  border:1px solid #21547d;
  border-radius:10px;
  background:#061522;
  color:#dcecff;
  box-shadow:none;
}
body.cfs-ui-v3 .btn:hover{border-color:#248fd4;background:#08213a;transform:translateY(-1px)}
body.cfs-ui-v3 .btn.primary{
  border-color:#269cf2;
  background:linear-gradient(135deg,#096fe4,#118cff);
  box-shadow:0 12px 28px rgba(18,111,241,.19);
}
body.cfs-ui-v3 .btn.primary:hover{filter:brightness(1.08)}
body.cfs-ui-v3 input,
body.cfs-ui-v3 textarea,
body.cfs-ui-v3 select{
  border-color:#214c70;
  background:#04111e;
  color:#fff;
}
body.cfs-ui-v3 input:focus,
body.cfs-ui-v3 textarea:focus,
body.cfs-ui-v3 select:focus{
  border-color:#168cff;
  box-shadow:0 0 0 3px rgba(22,140,255,.10);
}
body.cfs-ui-v3 .card,
body.cfs-ui-v3 .panel,
body.cfs-ui-v3 .management-summary-card,
body.cfs-ui-v3 .management-overview-card,
body.cfs-ui-v3 .creator-tool-entry,
body.cfs-ui-v3 .internal-status-shell{
  border-color:var(--cfs-v3-line-soft);
  border-radius:var(--cfs-v3-radius);
  background:linear-gradient(145deg,rgba(7,25,42,.94),rgba(3,12,20,.97));
  box-shadow:var(--cfs-v3-shadow);
}
body.cfs-ui-v3 .notice{border-color:#215174;background:#061727;color:#9fc6e8}

/* ---------- PUBLIC WEBSITE ---------- */
body.cfs-ui-v3.public-marketing,
body.cfs-ui-v3.public-home{--brand-blue:#126ff1;--brand-cyan:#28cfff}

body.cfs-ui-v3 .public-site-header .cfs-brand-lockup{min-width:190px}
body.cfs-ui-v3 .public-footer-brand .cfs-footer-lockup{margin-bottom:12px}
.cfs-footer-lockup{display:flex;align-items:center;gap:10px}
.cfs-footer-lockup .cfs-brand-mark{width:38px;height:38px}
.cfs-footer-lockup .cfs-brand-copy strong{font-size:19px}
.cfs-footer-lockup .cfs-brand-copy small{font-size:5.5px}

body.cfs-ui-v3.public-home .brand-hero{
  min-height:620px;
  padding:78px 0 58px;
  border-bottom-color:#0d3552;
  background:
    radial-gradient(circle at 72% 28%,rgba(18,111,241,.17),transparent 27%),
    radial-gradient(circle at 12% 18%,rgba(40,207,255,.06),transparent 25%),
    linear-gradient(180deg,#020a16 0%,#020812 100%);
}
body.cfs-ui-v3.public-home .brand-hero-grid{grid-template-columns:minmax(0,1fr) minmax(430px,.92fr);gap:48px}
body.cfs-ui-v3.public-home .brand-hero-copy h1{
  max-width:770px;
  font-size:clamp(52px,5.8vw,88px);
  line-height:.9;
  letter-spacing:-4px;
  text-transform:none;
  font-style:normal;
}
body.cfs-ui-v3.public-home .brand-hero-copy h1 span{color:#1d70ea}
body.cfs-ui-v3.public-home .brand-hero-lead{color:#9db3c6;font-size:14px}
body.cfs-ui-v3.public-home .brand-hero-stage{
  min-height:440px;
  border-color:rgba(25,102,160,.42);
  border-radius:24px;
  background:
    radial-gradient(circle at 50% 42%,rgba(18,111,241,.18),transparent 43%),
    linear-gradient(155deg,rgba(5,22,38,.86),rgba(2,8,14,.92));
  box-shadow:0 28px 90px rgba(0,0,0,.30);
}
.cfs-hero-brand{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  width:100%;
  margin:92px auto 10px;
}
.cfs-hero-brand .cfs-brand-mark{width:132px;height:132px}
.cfs-hero-brand .cfs-brand-copy strong{font-size:44px;letter-spacing:-2.5px}
.cfs-hero-brand .cfs-brand-copy small{font-size:8px}
body.cfs-ui-v3.public-home .brand-stage-line{width:74%;margin-top:10px}

body.cfs-ui-v3 .brand-section,
body.cfs-ui-v3 .marketing-section{
  background:transparent;
}
body.cfs-ui-v3 .brand-community-grid article,
body.cfs-ui-v3 .brand-preview-card,
body.cfs-ui-v3 .brand-proof-grid article,
body.cfs-ui-v3 .auth-entry-trust article,
body.cfs-ui-v3 .auth-after-grid article{
  border-color:var(--cfs-v3-line-soft);
  background:linear-gradient(150deg,rgba(7,24,41,.92),rgba(3,12,20,.94));
  box-shadow:none;
}
body.cfs-ui-v3 .brand-community-grid article:hover,
body.cfs-ui-v3 .brand-preview-card:hover{border-color:#247fbe;transform:translateY(-2px)}

/* public content/auth/legal pages */
body.cfs-ui-v3.public-auth-page .auth-entry-hero,
body.cfs-ui-v3.public-auth-page .auth-entry-grid,
body.cfs-ui-v3.public-content-page main,
body.cfs-ui-v3.public-legal-page main,
body.cfs-ui-v3.public-plans-page main,
body.cfs-ui-v3.public-roadmap-page main{
  position:relative;
}
body.cfs-ui-v3.public-auth-page .auth-entry-panel{
  border-color:var(--cfs-v3-line);
  border-radius:18px;
  background:linear-gradient(145deg,rgba(7,25,42,.97),rgba(3,12,20,.98));
  box-shadow:0 22px 64px rgba(0,35,78,.16);
}
body.cfs-ui-v3.public-auth-page .auth-entry-panel-featured{border-color:#1d68a5}
body.cfs-ui-v3.public-auth-page .auth-entry-path,
body.cfs-ui-v3.public-auth-page .source-context{
  border-color:var(--cfs-v3-line-soft);
  background:rgba(6,21,35,.75);
}

body.cfs-ui-v3 .public-footer,
body.cfs-ui-v3 .brand-footer{
  border-top:1px solid #102c45;
  background:#01070d;
}

/* ---------- CREATOR SUITE ---------- */
body.cfs-ui-v3.creator-workspace{
  background:
    radial-gradient(circle at 76% -5%,rgba(18,111,241,.12),transparent 29%),
    linear-gradient(180deg,#020812,#020914 52%,#01060d);
}
body.cfs-ui-v3.creator-workspace main.container{
  padding-top:10px;
}
body.cfs-ui-v3.creator-workspace .beginner-hero,
body.cfs-ui-v3.creator-workspace .page-hero{
  padding-top:38px;
}
body.cfs-ui-v3.creator-workspace .beginner-hero h1,
body.cfs-ui-v3.creator-workspace .page-hero h1{
  letter-spacing:-2.8px;
}
body.cfs-ui-v3.creator-workspace .beginner-hero h1 span,
body.cfs-ui-v3.creator-workspace .page-hero h1 span{color:#1d70ea}
body.cfs-ui-v3.creator-workspace .beginner-status-item,
body.cfs-ui-v3.creator-workspace .beginner-system-summary,
body.cfs-ui-v3.creator-workspace .creator-next-step,
body.cfs-ui-v3.creator-workspace .creator-journey,
body.cfs-ui-v3.creator-workspace .management-hub,
body.cfs-ui-v3.creator-workspace .management-summary-card,
body.cfs-ui-v3.creator-workspace .management-overview-card{
  border-color:var(--cfs-v3-line-soft);
  background:linear-gradient(145deg,rgba(7,24,41,.92),rgba(3,12,20,.96));
  box-shadow:none;
}

/* injected general creator sidebar */
.cfs-global-sidebar{
  position:fixed;
  left:0;
  top:72px;
  z-index:32;
  width:216px;
  height:calc(100vh - 72px);
  padding:26px 12px 22px;
  overflow:auto;
  border-right:1px solid rgba(36,99,148,.24);
  background:linear-gradient(180deg,rgba(2,10,19,.92),rgba(1,7,13,.78));
  backdrop-filter:blur(14px);
}
.cfs-sidebar-label{
  margin:0 12px 13px;
  color:#7f9bb2;
  font-size:9px;
  font-weight:1000;
  letter-spacing:.13em;
}
.cfs-sidebar-link{
  width:100%;
  min-height:44px;
  display:flex;
  align-items:center;
  gap:11px;
  margin:4px 0;
  padding:0 12px;
  border:1px solid transparent;
  border-radius:10px;
  color:#809bb2;
  background:transparent;
  font:inherit;
  font-size:10.5px;
  font-weight:850;
  text-align:left;
  text-decoration:none;
  cursor:pointer;
}
.cfs-sidebar-link:hover{color:#fff;border-color:#174a70;background:#051625}
.cfs-sidebar-link.active{
  color:#fff;
  border-color:#138cf0;
  background:linear-gradient(90deg,#0b3760,#061f38);
  box-shadow:inset 0 0 0 1px rgba(40,207,255,.09),0 0 22px rgba(18,111,241,.12);
}
.cfs-sidebar-icon{
  width:27px;height:27px;
  display:grid;place-items:center;
  flex:0 0 auto;
  border:1px solid rgba(44,117,172,.22);
  border-radius:8px;
  color:#65c9f8;
  background:#071a2b;
}
.cfs-sidebar-divider{height:1px;margin:16px 10px;background:#102b43}

@media(min-width:981px){
  body.cfs-ui-v3.cfs-sidebar-ready main.container,
  body.cfs-ui-v3.cfs-sidebar-ready main.account-shell{
    width:min(1240px,calc(100% - 250px - 32px));
    margin-left:232px;
    margin-right:auto;
  }
  body.cfs-ui-v3.cfs-sidebar-ready .footer{margin-left:216px}
  body.cfs-ui-v3.cfs-sidebar-ready.account-professional .account-tabs{display:none}
  body.cfs-ui-v3.cfs-sidebar-ready.account-professional .account-hero{padding-top:36px}
}

/* Account harmonization on top of account-professional.css */
body.cfs-ui-v3.account-professional .account-shell{max-width:1240px}
body.cfs-ui-v3.account-professional .account-hero h1 span{color:#1d70ea}
body.cfs-ui-v3.account-professional .account-card,
body.cfs-ui-v3.account-professional .account-status-card,
body.cfs-ui-v3.account-professional .account-section-intro{
  border-color:var(--cfs-v3-line-soft);
  background:linear-gradient(145deg,rgba(7,25,42,.95),rgba(3,12,20,.97));
  box-shadow:none;
}
body.cfs-ui-v3.account-professional .account-status-grid{gap:12px}
body.cfs-ui-v3.account-professional .account-card-icon,
body.cfs-ui-v3.account-professional .account-status-icon{background:#071e34;border-color:#195381;color:#5cc7ff}
body.cfs-ui-v3.account-professional .account-danger-zone{border-color:#71313d;background:linear-gradient(145deg,rgba(51,10,19,.82),rgba(17,5,10,.96))}

/* specialized creator workspaces retain their full canvas but inherit brand/colors */
body.cfs-ui-v3.cfs-specialized-workspace .cfs-global-sidebar{display:none!important}
body.cfs-ui-v3.cfs-specialized-workspace main{margin-left:0!important}

/* ---------- Responsive ---------- */
@media(max-width:1100px){
  body.cfs-ui-v3.public-home .brand-hero-grid{grid-template-columns:1fr 1fr;gap:28px}
  .cfs-brand-copy strong{font-size:20px}
  .cfs-brand-mark{width:42px;height:42px}
}

@media(max-width:980px){
  .cfs-global-sidebar{
    position:sticky;
    top:62px;
    width:100%;
    height:auto;
    display:flex;
    gap:5px;
    padding:8px 12px;
    border-right:0;
    border-bottom:1px solid rgba(36,99,148,.24);
    overflow-x:auto;
  }
  .cfs-sidebar-label,.cfs-sidebar-divider{display:none}
  .cfs-sidebar-link{min-width:max-content;min-height:40px;margin:0;padding:0 12px}
  .cfs-sidebar-icon{display:none}
  body.cfs-ui-v3.cfs-sidebar-ready main.container,
  body.cfs-ui-v3.cfs-sidebar-ready main.account-shell{width:min(1240px,calc(100% - 32px));margin:auto}
  body.cfs-ui-v3.cfs-sidebar-ready .footer{margin-left:0}
  body.cfs-ui-v3.public-home .brand-hero-grid{grid-template-columns:1fr}
  .cfs-hero-brand{margin-top:65px}
}

@media(max-width:760px){
  .cfs-brand-mark{width:38px;height:38px}
  .cfs-brand-copy strong{font-size:18px;letter-spacing:-1px}
  .cfs-brand-copy small{font-size:5.5px}
  body.cfs-ui-v3 .nav{background:#03101c;border-color:#174b6c}
  body.cfs-ui-v3.public-home .brand-hero{padding-top:46px}
  body.cfs-ui-v3.public-home .brand-hero-copy h1{font-size:48px;letter-spacing:-2.7px}
  .cfs-hero-brand{gap:12px;margin-top:46px}
  .cfs-hero-brand .cfs-brand-mark{width:92px;height:92px}
  .cfs-hero-brand .cfs-brand-copy strong{font-size:30px}
}

/* ===== v24 CREATOR OS REDESIGN =====
   Logo + typography stay untouched.
   Visual language changes from card-heavy marketing to a calmer Creator OS.
   ========================================================= */

html.cfs-os-v24{background:#020305}

body.cfs-os-v24{
  --cfs-os-bg:#05070a;
  --cfs-os-surface:#080d13;
  --cfs-os-surface-2:#0b1119;
  --cfs-os-line:#1b2734;
  --cfs-os-line-strong:#29394b;
  --cfs-os-text:#f4f7fb;
  --cfs-os-muted:#7d8b9a;
  --cfs-os-blue:#1677ff;
  --cfs-os-blue-bright:#2b91ff;
  --cfs-os-cyan:#56c7ff;
  --cfs-os-green:#55d99a;
  --cfs-os-radius:10px;
  background:
    radial-gradient(circle at 72% -18%,rgba(22,119,255,.10),transparent 35%),
    linear-gradient(180deg,#05070a 0%,#040609 52%,#020305 100%);
  color:var(--cfs-os-text);
}

body.cfs-os-v24:before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(99,137,172,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(99,137,172,.025) 1px,transparent 1px);
  background-size:48px 48px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.72),transparent 70%);
}

body.cfs-os-v24 .container{width:min(1320px,calc(100% - 48px))}

/* Header */
body.cfs-os-v24 .site-header{
  min-height:64px;
  border-bottom:1px solid #151e28;
  background:rgba(4,7,11,.95);
  box-shadow:none;
  backdrop-filter:blur(18px);
}
body.cfs-os-v24 .header-inner{min-height:64px;gap:24px}
body.cfs-os-v24 .nav{gap:2px}

body.cfs-os-v24 .nav a,
body.cfs-os-v24 .nav button,
body.cfs-os-v24 .creator-nav-more>summary{
  min-height:34px;
  padding:0 10px;
  border:0;
  border-radius:7px;
  color:#8493a2;
  background:transparent;
  font-size:9px;
  letter-spacing:.035em;
}

body.cfs-os-v24 .nav a:hover,
body.cfs-os-v24 .nav a.active,
body.cfs-os-v24 .nav a[aria-current="page"],
body.cfs-os-v24 .nav button:hover,
body.cfs-os-v24 .creator-nav-more>summary:hover{
  color:#f5f8fb;
  border-color:transparent;
  background:#0b1118;
}

body.cfs-os-v24 .nav a.active:after,
body.cfs-os-v24 .nav a[aria-current="page"]:after{
  left:10px;right:10px;bottom:-1px;
  height:1px;
  background:#258cff;
  box-shadow:none;
}

body.cfs-os-v24 .nav .cta,
body.cfs-os-v24 .creator-logout{
  border:1px solid #31465c!important;
  border-radius:7px!important;
  color:#edf5fd!important;
  background:#0c141d!important;
  box-shadow:none!important;
}

/* Controls */
body.cfs-os-v24 .btn{
  min-height:42px;
  padding-inline:16px;
  border:1px solid #2a3949;
  border-radius:8px;
  color:#d9e4ee;
  background:#0a1017;
  box-shadow:none;
}
body.cfs-os-v24 .btn:hover{
  border-color:#3d5871;
  background:#0d151e;
  transform:translateY(-1px);
}
body.cfs-os-v24 .btn.primary{
  border-color:#1677ff;
  color:#fff;
  background:#1677ff;
  box-shadow:none;
}
body.cfs-os-v24 .btn.primary:hover{
  border-color:#3193ff;
  background:#2387ff;
  filter:none;
}
body.cfs-os-v24 input,
body.cfs-os-v24 textarea,
body.cfs-os-v24 select{
  border-color:#263646;
  border-radius:8px;
  background:#060a0f;
}
body.cfs-os-v24 input:focus,
body.cfs-os-v24 textarea:focus,
body.cfs-os-v24 select:focus{
  border-color:#287fc5;
  box-shadow:0 0 0 3px rgba(22,119,255,.09);
}

/* Flat surfaces */
body.cfs-os-v24 .card,
body.cfs-os-v24 .panel,
body.cfs-os-v24 .management-summary-card,
body.cfs-os-v24 .management-overview-card,
body.cfs-os-v24 .creator-tool-entry,
body.cfs-os-v24 .internal-status-shell,
body.cfs-os-v24 .beginner-status-item,
body.cfs-os-v24 .beginner-system-summary,
body.cfs-os-v24 .creator-next-step,
body.cfs-os-v24 .creator-journey,
body.cfs-os-v24 .management-hub,
body.cfs-os-v24 .account-card,
body.cfs-os-v24 .account-status-card,
body.cfs-os-v24 .account-section-intro{
  border-color:var(--cfs-os-line);
  border-radius:var(--cfs-os-radius);
  background:var(--cfs-os-surface);
  background-image:none;
  box-shadow:none;
}

/* Public landing */
body.cfs-os-v24.public-home .brand-hero{
  min-height:650px;
  padding:92px 0 72px;
  border-bottom:1px solid #141e29;
  background:transparent;
}
body.cfs-os-v24.public-home .brand-hero-grid{
  grid-template-columns:minmax(0,1.1fr) minmax(420px,.9fr);
  gap:clamp(48px,7vw,96px);
  align-items:center;
}
body.cfs-os-v24.public-home .brand-hero-copy{max-width:780px}
body.cfs-os-v24.public-home .brand-hero-copy h1{
  max-width:820px;
  font-size:clamp(54px,6.2vw,94px);
  line-height:.88;
  letter-spacing:-.064em;
}
body.cfs-os-v24.public-home .brand-hero-copy h1 span{color:#2084ff}
body.cfs-os-v24.public-home .brand-hero-lead{
  max-width:660px;
  color:#8997a5;
  font-size:clamp(15px,1.35vw,18px);
}
body.cfs-os-v24.public-home .brand-hero-stage{
  min-height:450px;
  border:1px solid #202e3d;
  border-radius:16px;
  background:#070b10;
  box-shadow:none;
}
body.cfs-os-v24 .brand-section,
body.cfs-os-v24 .marketing-section{
  padding-block:78px;
  background:transparent;
}
body.cfs-os-v24 .marketing-section-alt{
  border-block:1px solid #141e28;
  background:#05080c;
}

body.cfs-os-v24 .brand-community-grid article,
body.cfs-os-v24 .brand-preview-card,
body.cfs-os-v24 .brand-proof-grid article,
body.cfs-os-v24 .auth-entry-trust article,
body.cfs-os-v24 .auth-after-grid article,
body.cfs-os-v24 .marketing-hero-card,
body.cfs-os-v24 .marketing-mode-card,
body.cfs-os-v24 .marketing-state,
body.cfs-os-v24 .product-capability-grid article{
  border-color:var(--cfs-os-line);
  border-radius:10px;
  background:#080d13;
  background-image:none;
  box-shadow:none;
}
body.cfs-os-v24 .brand-community-grid article:hover,
body.cfs-os-v24 .brand-preview-card:hover{
  border-color:#31465a;
  transform:translateY(-1px);
}
body.cfs-os-v24 .public-footer,
body.cfs-os-v24 .brand-footer{
  border-top:1px solid #151e27;
  background:#020406;
}

/* Creator shell */
body.cfs-os-v24.creator-workspace{
  background:
    radial-gradient(circle at 72% -12%,rgba(22,119,255,.075),transparent 31%),
    linear-gradient(180deg,#05070a,#030507 62%,#020305);
}
body.cfs-os-v24.creator-workspace main.container{padding-top:22px}

body.cfs-os-v24 .cfs-global-sidebar{
  top:64px;
  width:194px;
  height:calc(100vh - 64px);
  padding:26px 10px 22px;
  border-right:1px solid #151f29;
  background:rgba(4,7,11,.96);
  backdrop-filter:blur(16px);
}
body.cfs-os-v24 .cfs-sidebar-label{
  margin:0 10px 18px;
  color:#5f6e7c;
  font-size:7.5px;
  letter-spacing:.16em;
}
body.cfs-os-v24 .cfs-sidebar-link{
  position:relative;
  min-height:39px;
  gap:8px;
  margin:2px 0;
  padding:0 10px;
  border:0;
  border-radius:6px;
  color:#748393;
  font-size:9.5px;
}
body.cfs-os-v24 .cfs-sidebar-link:hover{
  color:#e5edf5;
  border-color:transparent;
  background:#0a1017;
}
body.cfs-os-v24 .cfs-sidebar-link.active{
  color:#fff;
  border-color:transparent;
  background:#0b121a;
  box-shadow:none;
}
body.cfs-os-v24 .cfs-sidebar-link.active:before{
  content:"";
  position:absolute;
  left:-10px;top:9px;bottom:9px;
  width:2px;
  border-radius:2px;
  background:#258cff;
}
body.cfs-os-v24 .cfs-sidebar-icon{
  width:23px;height:23px;
  border:0;
  border-radius:5px;
  color:#6e8294;
  background:transparent;
}
body.cfs-os-v24 .cfs-sidebar-link.active .cfs-sidebar-icon{color:#65b9ff}
body.cfs-os-v24 .cfs-sidebar-divider{margin:17px 10px;background:#17212c}

@media(min-width:981px){
  body.cfs-os-v24.cfs-sidebar-ready main.container,
  body.cfs-os-v24.cfs-sidebar-ready main.account-shell{
    width:min(1320px,calc(100% - 226px - 44px));
    margin-left:214px;
  }
  body.cfs-os-v24.cfs-sidebar-ready .footer{margin-left:194px}
}

body.cfs-os-v24.creator-workspace .beginner-hero,
body.cfs-os-v24.creator-workspace .page-hero,
body.cfs-os-v24.account-professional .account-hero{
  padding-top:44px;
  padding-bottom:28px;
  border-bottom:1px solid #17212b;
}
body.cfs-os-v24.creator-workspace .beginner-hero h1,
body.cfs-os-v24.creator-workspace .page-hero h1,
body.cfs-os-v24.account-professional .account-hero h1{
  letter-spacing:-.045em;
}

body.cfs-os-v24.account-professional .account-card,
body.cfs-os-v24.account-professional .account-status-card,
body.cfs-os-v24.account-professional .account-section-intro{
  border-color:#1b2733;
  border-radius:10px;
  background:#080d13;
}

/* Specialized studios */
body.cfs-os-v24 .ws-page,
body.cfs-os-v24 .stream-studio-shell{background:transparent}
body.cfs-os-v24 .ws-panel,
body.cfs-os-v24 .ws-dashboard-card,
body.cfs-os-v24 .stream-panel,
body.cfs-os-v24 .stream-monitor,
body.cfs-os-v24 .stream-workspace-toolbar,
body.cfs-os-v24 .cfs-studio-hub{
  border-color:#1c2936!important;
  border-radius:9px!important;
  background:#080d13!important;
  background-image:none!important;
  box-shadow:none!important;
}

@media(max-width:980px){
  body.cfs-os-v24 .cfs-global-sidebar{
    top:64px;width:100%;height:auto;
    padding:7px 16px;
    border-right:0;
    border-bottom:1px solid #17212b;
    background:rgba(4,7,11,.97);
  }
  body.cfs-os-v24 .cfs-sidebar-link.active:before{
    left:10px;right:10px;top:auto;bottom:-7px;
    width:auto;height:1px;
  }
  body.cfs-os-v24.cfs-sidebar-ready main.container,
  body.cfs-os-v24.cfs-sidebar-ready main.account-shell{
    width:min(1320px,calc(100% - 32px));
    margin-inline:auto;
  }
  body.cfs-os-v24.public-home .brand-hero-grid{grid-template-columns:1fr}
}

@media(max-width:760px){
  body.cfs-os-v24 .container{width:min(100% - 28px,1320px)}
  body.cfs-os-v24.public-home .brand-hero{padding-top:58px}
  body.cfs-os-v24.public-home .brand-hero-copy h1{
    font-size:clamp(46px,15vw,66px);
    letter-spacing:-.055em;
  }
}

/* =========================================================
   cfs_zockt · Unified Creator Workspace v134
   One blue/white/cyan design language for all creator pages.
   ========================================================= */
body.creator-workspace{
  --cfs134-bg:#020914;
  --cfs134-bg-2:#03111f;
  --cfs134-panel:#06182a;
  --cfs134-panel-2:#081f36;
  --cfs134-line:rgba(17,145,214,.64);
  --cfs134-line-soft:rgba(18,172,238,.24);
  --cfs134-blue:#1186ff;
  --cfs134-cyan:#16ddff;
  --cfs134-white:#f7fbff;
  --cfs134-text:#d9e7f2;
  --cfs134-muted:#8ea9bd;
  --cfs134-dim:#6f879a;
  color:var(--cfs134-text)!important;
  background:
    radial-gradient(circle at 76% -8%,rgba(17,134,255,.16),transparent 30%),
    radial-gradient(circle at 8% 30%,rgba(22,221,255,.065),transparent 25%),
    linear-gradient(180deg,#020812 0%,#03101d 52%,#02070e 100%)!important;
}
body.creator-workspace:before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.4;
  background:
    linear-gradient(135deg,transparent 0 18%,rgba(0,192,255,.05) 18.05% 18.15%,transparent 18.2%),
    linear-gradient(315deg,transparent 0 9%,rgba(17,134,255,.045) 9.05% 9.15%,transparent 9.2%);
}
body.creator-workspace .creator-site-header{
  min-height:66px!important;
  border-bottom:1px solid rgba(20,187,242,.35)!important;
  background:rgba(1,8,18,.96)!important;
  box-shadow:0 10px 34px rgba(0,0,0,.28)!important;
  backdrop-filter:blur(18px);
}
body.creator-workspace .creator-header-inner{min-height:66px!important}
body.creator-workspace .creator-brand-logo{
  width:158px!important;max-height:46px!important;object-fit:contain!important;object-position:left center!important;
  filter:drop-shadow(0 0 14px rgba(17,145,255,.24));
}
body.creator-workspace .creator-brand>span{
  color:#8ddff4!important;font-size:7px!important;letter-spacing:.18em!important;text-transform:uppercase;
}
body.creator-workspace .creator-nav>a,
body.creator-workspace .creator-nav>button,
body.creator-workspace .creator-nav-more>summary{
  color:#dce9f3!important;font-weight:850!important;
}
body.creator-workspace .creator-nav>a:hover,
body.creator-workspace .creator-nav>button:hover,
body.creator-workspace .creator-nav-more>summary:hover{color:var(--cfs134-cyan)!important;background:rgba(9,36,58,.65)!important}
body.creator-workspace .creator-nav>a.active,
body.creator-workspace .creator-nav>a[aria-current="page"]{
  color:#fff!important;background:rgba(9,53,87,.82)!important;border-color:rgba(21,205,250,.44)!important;
  box-shadow:inset 0 -2px 0 var(--cfs134-cyan),0 0 18px rgba(15,151,255,.08)!important;
}

body.creator-workspace .cfs-global-sidebar{
  border-right:1px solid rgba(16,129,185,.42)!important;
  background:linear-gradient(180deg,rgba(3,14,25,.985),rgba(2,9,16,.985))!important;
  box-shadow:12px 0 34px rgba(0,0,0,.15)!important;
}
body.creator-workspace .cfs-sidebar-label{color:#62d8f6!important;letter-spacing:.16em!important}
body.creator-workspace .cfs-sidebar-link{color:#9bb0c1!important;border-radius:8px!important}
body.creator-workspace .cfs-sidebar-link:hover{color:#fff!important;background:#071c2e!important}
body.creator-workspace .cfs-sidebar-link.active{
  color:#fff!important;background:linear-gradient(90deg,#07365c,#08243c)!important;
  box-shadow:inset 0 0 0 1px rgba(18,183,239,.32),0 0 18px rgba(16,134,255,.10)!important;
}
body.creator-workspace .cfs-sidebar-link.active:before{background:linear-gradient(180deg,var(--cfs134-cyan),var(--cfs134-blue))!important;box-shadow:0 0 10px rgba(18,221,255,.52)}
body.creator-workspace .cfs-sidebar-icon{color:#58c9f2!important}
body.creator-workspace .cfs-sidebar-divider{background:rgba(18,129,181,.27)!important}

body.creator-workspace main.container,
body.creator-workspace main.account-shell{padding-top:28px!important;padding-bottom:72px!important}
body.creator-workspace .beginner-hero,
body.creator-workspace .page-hero,
body.creator-workspace .internal-module-hero,
body.creator-workspace.account-professional .account-hero{
  position:relative;padding:42px 0 30px!important;border-bottom:1px solid rgba(16,145,211,.32)!important;
}
body.creator-workspace .beginner-hero:after,
body.creator-workspace .page-hero:after,
body.creator-workspace .internal-module-hero:after,
body.creator-workspace.account-professional .account-hero:after{
  content:"";position:absolute;right:0;top:0;width:min(44vw,620px);height:100%;pointer-events:none;
  background:radial-gradient(circle at 70% 35%,rgba(15,134,255,.14),transparent 58%);
}
body.creator-workspace .eyebrow,
body.creator-workspace .page-kicker,
body.creator-workspace .internal-module-kicker,
body.creator-workspace .section-head .eyebrow{
  color:var(--cfs134-cyan)!important;font-weight:950!important;letter-spacing:.16em!important;
}
body.creator-workspace .beginner-hero h1,
body.creator-workspace .page-hero h1,
body.creator-workspace .internal-module-hero h1,
body.creator-workspace.account-professional .account-hero h1{
  color:var(--cfs134-white)!important;text-shadow:0 3px 0 #617f99,0 7px 20px rgba(0,0,0,.56)!important;
}
body.creator-workspace .beginner-hero h1 span,
body.creator-workspace .page-hero h1 span,
body.creator-workspace .internal-module-hero h1 span,
body.creator-workspace.account-professional .account-hero h1 span{color:#2499ff!important}
body.creator-workspace .beginner-hero p,
body.creator-workspace .page-hero p,
body.creator-workspace .internal-module-hero p{color:#a9bfd0!important}

body.creator-workspace .card,
body.creator-workspace .panel,
body.creator-workspace .beginner-status-item,
body.creator-workspace .beginner-system-summary,
body.creator-workspace .creator-next-step,
body.creator-workspace .creator-journey,
body.creator-workspace .creator-workspace-map,
body.creator-workspace .creator-tool-summary,
body.creator-workspace .creator-tool-entry,
body.creator-workspace .creator-operation-card,
body.creator-workspace .management-hub,
body.creator-workspace .management-summary-card,
body.creator-workspace .management-overview-card,
body.creator-workspace .internal-status-shell,
body.creator-workspace .account-card,
body.creator-workspace .account-status-card,
body.creator-workspace .account-section-intro,
body.creator-workspace .ws-panel,
body.creator-workspace .ws-dashboard-card,
body.creator-workspace .stream-panel,
body.creator-workspace .stream-monitor,
body.creator-workspace .stream-workspace-toolbar,
body.creator-workspace .cfs-studio-hub{
  border:1px solid rgba(12,118,171,.74)!important;
  border-radius:12px!important;
  background:linear-gradient(145deg,rgba(6,27,47,.96),rgba(3,14,25,.985))!important;
  background-image:linear-gradient(145deg,rgba(6,27,47,.96),rgba(3,14,25,.985))!important;
  box-shadow:inset 0 0 32px rgba(17,134,255,.035),0 12px 28px rgba(0,0,0,.16)!important;
}
body.creator-workspace .card:hover,
body.creator-workspace .creator-tool-entry:hover,
body.creator-workspace .creator-operation-card:hover{
  border-color:rgba(22,221,255,.62)!important;
}
body.creator-workspace .beginner-status-item.ready,
body.creator-workspace .creator-operation-card.ready,
body.creator-workspace .creator-journey-step.ready{
  border-color:rgba(30,199,164,.56)!important;background:linear-gradient(145deg,rgba(4,43,44,.78),rgba(3,22,30,.96))!important;
}
body.creator-workspace .beginner-status-item.wait,
body.creator-workspace .creator-operation-card.warn,
body.creator-workspace .creator-journey-step.wait{
  border-color:rgba(24,137,255,.58)!important;background:linear-gradient(145deg,rgba(6,31,54,.95),rgba(3,18,32,.98))!important;
}
body.creator-workspace .creator-workspace-map-head span,
body.creator-workspace .creator-journey-head span,
body.creator-workspace .creator-tool-entry>span,
body.creator-workspace .creator-operation-card>span{color:#69dafa!important}
body.creator-workspace h2,
body.creator-workspace h3,
body.creator-workspace strong{color:#f7fbff}
body.creator-workspace .creator-tool-entry p,
body.creator-workspace .creator-operation-card small,
body.creator-workspace .creator-workspace-map-grid p{color:#8fa9bd!important}

body.creator-workspace .btn,
body.creator-workspace button.btn,
body.creator-workspace a.btn{
  border:1px solid rgba(18,132,184,.88)!important;border-radius:9px!important;
  background:linear-gradient(180deg,#08223a,#061725)!important;color:#f7fbff!important;
  box-shadow:0 8px 22px rgba(0,0,0,.18)!important;
}
body.creator-workspace .btn:hover,
body.creator-workspace button.btn:hover,
body.creator-workspace a.btn:hover{border-color:var(--cfs134-cyan)!important;background:linear-gradient(180deg,#0a2c49,#071d31)!important}
body.creator-workspace .btn.primary,
body.creator-workspace button.btn.primary,
body.creator-workspace a.btn.primary{
  border-color:#19e3ff!important;background:linear-gradient(135deg,#19e0ff,#128fff 62%,#0878ff)!important;color:#00111e!important;
  box-shadow:0 0 20px rgba(13,192,255,.20),inset 0 1px 0 rgba(255,255,255,.30)!important;
}
body.creator-workspace input,
body.creator-workspace textarea,
body.creator-workspace select{
  border:1px solid rgba(20,101,142,.82)!important;border-radius:8px!important;background:#020c16!important;color:#f5fbff!important;
}
body.creator-workspace input:focus,
body.creator-workspace textarea:focus,
body.creator-workspace select:focus{outline:none!important;border-color:var(--cfs134-cyan)!important;box-shadow:0 0 0 3px rgba(18,221,255,.08)!important}
body.creator-workspace label{color:#9fd4e8!important}

body.creator-workspace .notice,
body.creator-workspace .ui-state,
body.creator-workspace .marketing-note{
  border-color:rgba(14,133,190,.62)!important;background:rgba(4,24,40,.88)!important;color:#a9c3d5!important;
}
body.creator-workspace .section-head{border-bottom-color:rgba(16,124,178,.26)!important}
body.creator-workspace .section-head p{color:#8da7ba!important}

@media(max-width:980px){
  body.creator-workspace .creator-brand-logo{width:146px!important}
  body.creator-workspace .cfs-global-sidebar{background:rgba(2,11,20,.985)!important}
}
@media(max-width:760px){
  body.creator-workspace main.container,
  body.creator-workspace main.account-shell{padding-top:18px!important;padding-bottom:48px!important}
  body.creator-workspace .beginner-hero,
  body.creator-workspace .page-hero,
  body.creator-workspace .internal-module-hero,
  body.creator-workspace.account-professional .account-hero{padding-top:28px!important}
}