/* Customer workspace v2. This layer owns layout at every breakpoint. */
:root{--studio-bg:#0d131a;--studio-panel:#151e28;--studio-line:#213041;--studio-muted:#98a1ac;--studio-accent:#bbcee8}
body{background:var(--studio-bg);color:#f1f4f7}
.customer-app{grid-template-columns:224px minmax(0,1fr);background:radial-gradient(ellipse at 85% 0,#202e3e44,transparent 40%),var(--studio-bg)}
.customer-app aside{width:auto;position:sticky;top:0;bottom:auto;height:100dvh;padding:28px 20px;background:#101820;border-right:1px solid #1e2b39;display:flex;flex-direction:column;z-index:30}
.customer-app .workspace-brand{display:flex;font-size:23px;letter-spacing:1px;gap:11px;padding:0 4px}
.customer-app .workspace-brand span{width:36px;height:36px;background:linear-gradient(145deg,#c8d8ec,#8eafda);color:#131d27;border-radius:12px}
.customer-app .workspace-brand b{display:block}
.customer-app .tenant{display:block;background:#151f29;border:1px solid #233243;border-radius:12px;margin:30px 0 23px;padding:14px}
.customer-app .tenant small{display:block;color:#858d97;font-size:10px}.customer-app .tenant b{display:block;overflow-wrap:anywhere;color:#dee2e8;font-size:12px}
.customer-app nav{display:grid!important;gap:7px;width:100%;overflow:visible;grid-template-columns:1fr;justify-content:stretch}
.customer-app nav button{display:flex;align-items:center;justify-content:flex-start;gap:12px;min-width:0;width:100%;font-size:14px!important;padding:13px 12px;border-radius:10px;color:#9fa8b3;border:1px solid transparent;background:transparent;box-shadow:none;min-height:45px;text-align:left;transition:background .2s,color .2s}
.customer-app nav button span{display:block;font-size:12px;margin:0;white-space:nowrap}
.customer-app nav button.active{border:1px solid #3a4c64;background:#212f3f;color:#dfe8f4;box-shadow:none}
.customer-app nav button:hover{background:#1c2936;color:#f3f6fb}
.customer-app .logout{display:flex;gap:10px;font-size:12px;padding:12px;border:1px solid #243547;color:#a6aeb8;border-radius:10px;margin-top:auto}
.customer-app main{padding:0 42px 65px;max-width:1600px;width:100%;margin:0 auto}
.customer-app header{min-height:105px;height:auto;padding:24px 0;align-items:center;border-bottom:1px solid #1f2d3c;margin-bottom:32px}
.customer-app header h1{font-size:22px;letter-spacing:-.02em;color:#e7ecf2}.customer-app header .eyebrow{font-size:9px;color:#92a1b5;letter-spacing:.14em}
.customer-app .workspace-account .account-chip{background:#16202a;border:1px solid #26374a;border-radius:12px;padding:9px 12px;gap:9px}
.customer-app .workspace-account .account-chip>span{background:#27394c;color:#c6d6ec;border-radius:9px;width:33px;height:33px;font-size:12px}
.customer-app .workspace-account .account-chip b{font-size:11px;color:#dde4ec}.customer-app .workspace-account .account-chip small{font-size:9px;color:#87919e}.customer-app .workspace-account .account-chip div{display:block}.customer-app .workspace-account .account-chip i{display:block;color:#94a0af}
.customer-app .account-actions{background:#1a2632;border-color:#334358;border-radius:13px;box-shadow:0 20px 65px #00000088;max-width:calc(100vw - 26px)}.customer-app .account-actions button:hover,.customer-app .account-actions a:hover{background:#253547}.customer-app .account-actions .workspace-motion-toggle{margin:0;border:0;border-radius:9px;font-size:12px;color:#aec5e4}
.customer-app .primary-action{background:#b9cde8;color:#162433;border:1px solid #b9cde8;border-radius:10px;padding:12px 17px;font-size:12px;font-weight:700;box-shadow:0 5px 24px #739bd018;cursor:pointer;transition:background .2s,transform .2s}
.customer-app .primary-action:hover{background:#cbdaee}.customer-app .secondary-action{background:#1c2937;border:1px solid #324257;color:#cfd9e7;border-radius:10px;padding:12px 17px;font-size:12px;cursor:pointer}
.customer-app .content-card{background:#151e28;border:1px solid #253649;border-radius:17px;padding:25px}.customer-app .content-card h2{font-size:19px;color:#ecf1f7}.customer-app .content-card p{color:#a7b0bb}.customer-app .content-card .eyebrow{color:#a2b8d4}.customer-app .channel-card{border-top:2px solid #80a0cb}.customer-app .channel-card:first-child{border-top-color:#7dae9c}
.customer-app input,.customer-app textarea,.customer-app select{background:#10171e;border-color:#283a4e;color:#ecf0f6;border-radius:9px;max-width:100%}.customer-app input:focus,.customer-app textarea:focus,.customer-app select:focus{outline:2px solid #84a7d4;outline-offset:1px}.customer-app input[type=file]::file-selector-button{font:inherit;border:0;background:#283b4f;color:#dbe5f3;padding:8px 12px;border-radius:7px;margin-right:12px;cursor:pointer}
.customer-app .payment-state{background:#1f2d3b;color:#95b3da}.customer-app .payment-state.ok{background:#20392f;color:#8ed6b4}.customer-app .payment-destination{background:#1b2733;border-color:#2a3e52}.customer-app .test-messages{background:#111820;border-color:#26384b;border-radius:13px}.customer-app .test-message{background:#1c2835}.customer-app .test-message.user{background:#35455b}.customer-app .test-message small{color:#b6cbe7}.customer-app .test-composer{padding-top:10px}.customer-app .doc-list article{border-color:#26374a}.customer-app .status-pill,.customer-app .channel-state.connected{background:#213c33;color:#99d2bc}
.customer-app button:focus-visible,.customer-app summary:focus-visible,.customer-app a:focus-visible{outline:2px solid #c4d5eb;outline-offset:3px}
.studio-dashboard svg{width:21px;height:21px;flex-shrink:0}.studio-kicker{font-size:9px;color:#a0b7d4;font-weight:700;letter-spacing:.16em}
.studio-intro{display:grid;grid-template-columns:1.2fr 1fr;gap:25px;align-items:center;padding:10px 0 30px;min-height:335px}.studio-intro h2{font-size:clamp(27px,2.7vw,40px);font-weight:650;letter-spacing:-.045em;line-height:1.5;margin:15px 0}.studio-intro h2 em{color:#b6cbe7;font-style:normal}.studio-intro>div>p{font-size:13px;line-height:1.95;color:#a0a9b5;max-width:430px;margin:0}.studio-intro-actions{display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin-top:25px}.studio-intro-actions button.primary-action{display:flex;align-items:center;gap:13px}.studio-text-link{background:none;border:0;padding:0;font:inherit;font-size:11px;color:#b3c1d4;cursor:pointer;text-align:left}.studio-text-link:hover{color:#ebf1f8;text-decoration:underline}
.studio-channel-line{display:flex;align-items:center;gap:7px;flex-wrap:wrap;color:#6c87ab;font-size:9px;margin-top:23px}.studio-line-dot,.studio-facebook-dot{width:5px;height:5px;display:block;border-radius:50%;background:#75b993}.studio-facebook-dot{background:#7fa2d0}.studio-divider{height:10px;width:1px;background:#2b3e53;margin:0 6px}
.studio-illustration{position:relative;min-height:300px;display:grid;place-items:center;background:radial-gradient(ellipse at center,#546f9338,transparent 70%);isolation:isolate;overflow:hidden}.studio-core{width:135px;height:135px;border:1px solid #59759a;border-radius:35px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:8px;background:linear-gradient(140deg,#3a4d66,#1c2835);box-shadow:0 0 65px #5b7eab25;z-index:1;transform:rotate(-5deg)}.studio-core svg{color:#d1def0;width:30px;height:30px}.studio-core b{font-size:20px;letter-spacing:1px}.studio-core>span{font-size:6px;letter-spacing:1px;color:#a9b7c9}.studio-orbit{position:absolute;border:1px solid #4d658544;border-radius:50%;width:230px;height:230px}.orbit-two{width:310px;height:310px;border-style:dashed;border-color:#59759a28;transform:rotate(25deg)}.studio-float{position:absolute;z-index:2;display:flex;align-items:center;gap:10px;padding:12px 16px;background:#1a2633;border:1px solid #35465c;border-radius:12px;box-shadow:0 15px 25px #00000033;color:#aec1d9;font-size:11px}.studio-float small{display:block;font-size:8px;color:#6985a9;margin-top:5px}.float-knowledge{top:38px;left:5px}.float-chat{right:0;bottom:32px}.studio-illustration-note{position:absolute;bottom:0;color:#536d90;font-size:8px}
.studio-new-note{display:flex;align-items:center;gap:12px;background:#17212c;border:1px solid #253649;border-radius:11px;padding:15px 18px;color:#87919f;font-size:11px;margin:0 0 28px}.studio-new-note svg{color:#8ba2bf;width:18px;height:18px}.studio-new-note b{font-weight:400;color:#abb7c7;margin-left:12px}
.studio-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));background:#16202a;border:1px solid #253649;border-radius:14px;padding:22px 0;margin-bottom:28px}.studio-stats>div{padding:0 22px;border-right:1px solid #26374a}.studio-stats>div:last-child{border:0}.studio-stats small{font-size:10px;color:#949eac}.studio-stats b{display:block;font-size:26px;font-weight:650;margin-top:9px}.studio-stats b span{font-size:9px;font-weight:400;color:#828d9b}
.studio-main-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:22px}.studio-plan,.studio-onboarding{background:#16202a;border:1px solid #26374a;border-radius:18px;padding:26px;min-width:0}.studio-plan{background:linear-gradient(140deg,#1e2c3a,#16202a 75%);border-color:#3a4d65}.studio-card-heading{display:flex;justify-content:space-between;align-items:center;gap:10px}.studio-plan-badge,.studio-state{font-size:9px;border:1px solid #3b4e67;border-radius:30px;padding:5px 9px;color:#a4b6cd;white-space:nowrap}.studio-state{border-color:#324257;color:#88a2c4;background:#1b2734}.studio-state.online{color:#97c6af;background:#22392e;border-color:#3b5a48}.studio-plan-title{display:flex;align-items:center;gap:13px;margin-top:23px}.studio-product-mark{width:43px;height:43px;display:grid;place-items:center;background:#3a4d65;border:1px solid #567296;border-radius:12px;color:#e0e9f5}.studio-plan h3{font-size:21px;letter-spacing:-.03em;margin:0}.studio-plan-title p{margin:4px 0 0;color:#98a5b7;font-size:11px}.studio-price{font-size:38px;font-weight:650;letter-spacing:-.05em;margin-top:24px}.studio-price span{font-size:11px;font-weight:400;letter-spacing:0;color:#94a1b1}.studio-allowance{font-size:12px;color:#b6c4d7;margin-top:3px}.studio-plan ul{list-style:none;padding:0;margin:23px 0;display:grid;gap:11px;font-size:11px;color:#abb7c6}.studio-plan li{display:flex;gap:9px;line-height:1.8}.studio-plan li:before{content:'✓';color:#90a8c8}.studio-plan-footer{border-top:1px solid #293b4f;padding-top:17px}.studio-plan-footer p{font-size:10px;color:#8c9eb5;margin:0 0 13px}.studio-plan-footer button{width:100%;display:flex;align-items:center;justify-content:space-between}.studio-plan-footer small{display:block;font-size:9px;color:#627fa4;text-align:center;line-height:1.8;margin-top:13px}
.studio-onboarding>h3{font-size:22px;margin:24px 0 7px;letter-spacing:-.03em}.studio-section-copy{font-size:11px;color:#939faf;line-height:1.9;margin:0}.studio-task-list{margin-top:21px}.studio-task-list button{display:flex;width:100%;gap:13px;align-items:center;padding:17px 0;text-align:left;border:0;border-bottom:1px solid #253649;background:transparent;color:#d2dce8;cursor:pointer}.studio-task-list button:hover{color:#e7eef7}.studio-task-list button>svg{width:16px;color:#6d88ab}.studio-task-icon{width:36px;height:36px;display:grid;place-items:center;border:1px solid #37485f;background:#1d2a38;border-radius:10px;color:#a2b5cd;flex-shrink:0}.studio-task-icon.done{color:#98ceb3;border-color:#425e4e;background:#23372b}.studio-task-list button>span:nth-child(2){flex:1}.studio-task-list small,.studio-task-list b,.studio-task-list em{display:block}.studio-task-list small{font-size:8px;color:#7e8c9f;margin-bottom:4px}.studio-task-list b{font-size:12px;font-weight:600}.studio-task-list em{font-style:normal;font-size:10px;color:#8f9cad;margin-top:4px;line-height:1.7}.studio-onboarding-footer{display:flex;align-items:flex-start;gap:10px;padding-top:22px;font-size:10px;color:#8d9caf;line-height:1.9}.studio-onboarding-footer svg{width:17px;height:17px;margin-top:2px}.studio-onboarding-footer button{display:block;margin-top:8px;font-size:10px}
.studio-value{padding:40px 0 32px}.studio-section-heading h3{font-size:24px;margin:13px 0 8px;line-height:1.5;font-weight:600;letter-spacing:-.03em}.studio-section-heading h3 em{font-style:normal;color:#a7b9d1}.studio-section-heading p{font-size:12px;color:#87919f;line-height:1.9;margin:0}.studio-feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin-top:29px}.studio-icon{display:grid;place-items:center;width:36px;height:36px;border:1px solid #2f3e51;border-radius:10px;background:#1a2532;color:#a7bdd9}.studio-feature h3{font-size:13px;font-weight:600;margin:14px 0 7px}.studio-feature p{font-size:11px;color:#8994a2;line-height:1.9;margin:0}
.studio-guide{display:grid;grid-template-columns:.8fr 1.2fr;gap:35px;border-top:1px solid #243445;padding-top:29px;margin-top:5px}.studio-guide h3{font-size:22px;line-height:1.6;margin:12px 0 10px;font-weight:600}.studio-guide>div>p{font-size:11px;color:#828f9f;line-height:1.8}.studio-guide-list details{border-bottom:1px solid #253547}.studio-guide-list summary{display:flex;gap:12px;align-items:center;justify-content:space-between;cursor:pointer;padding:17px 0;font-size:12px;list-style:none;color:#a9b6c8}.studio-guide-list summary::-webkit-details-marker{display:none}.studio-guide-list summary span{color:#849ab7;font-size:18px}.studio-guide-list details[open] summary span{transform:rotate(45deg)}.studio-guide-list details>p{font-size:11px;line-height:2;color:#8393a8;margin:0 0 18px}
.customer-app .workspace-loading{min-height:300px;color:#99a6b7}.customer-app .loading-brand{background:#86a2c6;color:#172330;box-shadow:0 0 40px #6d8cb526}.customer-app .loading-brand span{border-color:#7393be44}.customer-app .loading-skeleton i{background:#384a61}
@media(min-width:761px) and (max-width:1100px){.customer-app{grid-template-columns:210px minmax(0,1fr)}.customer-app aside{padding:25px 15px}.customer-app main{padding:0 25px 60px}.customer-app .workspace-brand b,.customer-app .tenant,.customer-app nav button span,.customer-app .logout span{display:block}.studio-intro{grid-template-columns:1.1fr .9fr}.studio-illustration{min-height:270px}.studio-core{width:110px;height:110px;border-radius:28px}.studio-float{font-size:10px;padding:10px}.float-knowledge{top:25px;left:0}.float-chat{right:0;bottom:25px}.studio-plan,.studio-onboarding{padding:21px}.studio-card-heading{flex-wrap:wrap}.studio-stats>div{padding:0 13px}.studio-main-grid{gap:15px}.studio-stats b{font-size:22px}}
@media(max-width:760px){.customer-app{display:block}.customer-app aside{position:fixed;bottom:0;top:auto;height:72px;width:100%;padding:8px 10px;border-top:1px solid #253649;border-right:0;background:#121b24f5;backdrop-filter:blur(16px);display:block}.customer-app .workspace-brand,.customer-app .tenant,.customer-app .logout{display:none}.customer-app nav{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;overflow:visible;width:100%}.customer-app nav button{display:flex;flex-direction:column;justify-content:center;gap:5px;min-width:0;padding:7px 3px;min-height:54px;font-size:15px!important;border-radius:10px;flex:none}.customer-app nav button span{font-size:9px;display:block;white-space:nowrap}.customer-app main{padding:0 20px 105px}.customer-app header{min-height:94px;padding:20px 0;margin-bottom:23px}.customer-app header h1{font-size:20px}.customer-app .workspace-account .account-chip div,.customer-app .workspace-account .account-chip i{display:none}.customer-app .workspace-account .account-chip{padding:7px}.studio-intro{grid-template-columns:1.2fr .8fr;gap:12px;min-height:290px;padding:0 0 26px}.studio-intro h2{font-size:27px}.studio-intro>div>p{font-size:12px}.studio-illustration{min-height:260px}.studio-float{padding:9px;font-size:9px;gap:6px}.studio-float small{font-size:7px}.studio-core{width:105px;height:105px;border-radius:27px}.studio-orbit{width:175px;height:175px}.orbit-two{width:235px;height:235px}.float-knowledge{top:25px;left:0}.float-chat{bottom:30px;right:0}.studio-new-note{margin-bottom:22px;align-items:flex-start}.studio-new-note b{display:block;margin:4px 0 0}.studio-main-grid{gap:17px}.studio-plan,.studio-onboarding{padding:22px}.studio-card-heading{flex-wrap:wrap}.studio-stats{grid-template-columns:repeat(2,minmax(0,1fr));padding:8px 0}.studio-stats>div{padding:15px 20px}.studio-stats>div:nth-child(2){border-right:0}.studio-stats b{font-size:25px}.studio-feature-grid{gap:18px}.studio-guide{gap:22px}.studio-guide h3{font-size:19px}}
@media(max-width:580px){.customer-app main{padding:0 18px 102px}.studio-intro{display:flex;flex-direction:column;align-items:stretch;padding-bottom:10px;gap:0}.studio-intro h2{font-size:30px}.studio-intro>div>p{max-width:none}.studio-intro-actions{gap:17px;margin-top:22px}.studio-illustration{min-height:220px;margin:14px 0 5px}.studio-core{width:110px;height:110px}.studio-orbit{width:175px;height:175px}.orbit-two{width:240px;height:240px}.float-knowledge{top:28px;left:8px}.float-chat{right:8px;bottom:25px}.studio-illustration-note{bottom:1px}.studio-main-grid{grid-template-columns:1fr}.studio-feature-grid{grid-template-columns:1fr;gap:0;margin-top:20px}.studio-feature{display:grid;grid-template-columns:36px 1fr;column-gap:13px;border-bottom:1px solid #202f3f;padding:17px 0}.studio-feature .studio-icon{grid-row:1/3}.studio-feature h3{margin:0 0 6px}.studio-feature p{grid-column:2}.studio-guide{grid-template-columns:1fr;gap:5px}.studio-value{padding-top:33px}.studio-section-heading h3{font-size:23px}.studio-guide-list summary{font-size:11px}.studio-new-note{font-size:10px;padding:13px 14px}.studio-intro-actions .primary-action{font-size:11px}.studio-channel-line{font-size:9px}.customer-app .content-card{padding:20px}.customer-app .test-composer{grid-template-columns:1fr}.customer-app .two-col{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){body:not(.customer-motion-on) .customer-app button{transition:none}}

.customer-app .workspace-brand{justify-content:flex-start}.customer-app nav button>svg{width:18px;height:18px;flex-shrink:0}

/* BIZ blue / mint identity, with quieter navigation and clear actions. */
:root{--studio-bg:#071019;--studio-panel:#0d1823;--studio-line:#213546;--studio-muted:#8497aa;--studio-accent:#758fff}
body{background:#071019}.customer-app{background:radial-gradient(ellipse at 85% 0,#102b3b88,transparent 45%),#071019}.customer-app aside{background:#08121b;border-color:#213546}
.customer-app .workspace-brand span{background:linear-gradient(140deg,#758fff,#51ddb9);color:#051017}
.customer-app nav button.active{border:1px solid #31576d;background:#152b3a;color:#d0fff2}
.customer-app nav button.active>svg{color:#67dec4}.customer-app nav button:hover{background:#112330}
.customer-app .primary-action{background:linear-gradient(110deg,#758fff,#35c9ba);border:0;color:#061b26;box-shadow:0 5px 24px #419cbb20}
.customer-app .primary-action:hover{background:linear-gradient(110deg,#92a5ff,#5bdbcd);transform:translateY(-1px)}
.customer-app .secondary-action:hover{border-color:#547f9a;background:#1b3143}
.studio-intro h2 em{background:linear-gradient(90deg,#92a4ff,#62e3cd);background-clip:text;color:transparent}
.studio-kicker{color:#6fcebd}.studio-plan{background:linear-gradient(140deg,#182b42,#101c28 75%);border-color:#355069}
.studio-core{background:linear-gradient(140deg,#30476b,#142a37);border-color:#4c779b;box-shadow:0 0 65px #45a9c425}
.studio-core svg{color:#82ddd1}.studio-illustration{background:radial-gradient(ellipse at center,#2b698038,transparent 70%)}
.studio-product-mark{background:linear-gradient(145deg,#536dd2,#2e8f9d);color:#ecffff;border-color:#638bad}
.studio-plan-badge{color:#a3c5e2}.studio-icon{color:#80d6cc}.studio-state{background:#30291f;border-color:#514638;color:#c4ac88}
.studio-plan li:before{color:#6ed8bb}.studio-task-icon.done{background:#153c34;color:#77e3c1;border-color:#315e51}

.studio-playbook{padding:28px 0 32px;border-top:1px solid #273d50}.studio-playbook-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:26px}.studio-playbook-grid article{border-left:2px solid #356c77;padding-left:18px}.studio-playbook-grid article>span{font-size:9px;color:#6fc5b6;letter-spacing:.04em}.studio-playbook-grid h4{font-size:13px;margin:12px 0 8px;font-weight:600}.studio-playbook-grid p{font-size:11px;color:#8da4bc;line-height:1.9;margin:0}.studio-playbook-action{display:flex;align-items:center;justify-content:space-between;gap:14px;border:1px solid #2c4558;background:#122330;padding:16px 18px;margin-top:25px;border-radius:11px}.studio-playbook-action>span{font-size:10px;color:#8da8bf}.studio-playbook-action button{font-size:11px}
@media(max-width:760px){.studio-playbook-grid{grid-template-columns:1fr;gap:23px}.studio-playbook-action{align-items:flex-start;flex-direction:column}.studio-playbook-action button{font-size:10px}}
