/* TrinoTime Cloud v1.2.0 — Brand Studio / White Label */
:root{--brand-studio-ink:#172033;--brand-studio-muted:#758196;--brand-studio-line:#dfe5ec}
.brand-studio-v110{width:min(620px,100%);padding:28px 28px 34px;top:0;background:linear-gradient(180deg,rgba(255,255,255,.985),rgba(248,250,253,.99));}
.brand-studio-head{align-items:flex-start;position:sticky;top:-28px;margin:-28px -28px 18px;padding:26px 28px 18px;background:rgba(255,255,255,.94);backdrop-filter:blur(18px);border-bottom:1px solid #edf0f4;z-index:3}
.brand-studio-head>div>small{font-size:11px}.brand-studio-head h2{font-size:28px;margin:4px 0 6px}.brand-plan-chip{display:inline-flex;align-items:center;min-height:26px;padding:4px 10px;border-radius:999px;background:#fff3d4;border:1px solid #efd99b;color:#7c5b19;font-size:11px;font-weight:800}
.brand-studio-v110>p#brandIntro{font-size:13px;line-height:1.55;color:#647187;margin:0 0 16px}
.brand-preview-shell{border:1px solid #dfe6ef;border-radius:20px;padding:12px;background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(241,245,250,.94));box-shadow:0 18px 50px rgba(25,39,62,.08);margin-bottom:18px}
.brand-preview-top{display:flex;align-items:center;justify-content:space-between;padding:3px 4px 10px;font-size:10px;letter-spacing:.11em;color:#758196;font-weight:800}.brand-preview-top span{display:flex;align-items:center;gap:6px}.brand-preview-top i{width:7px;height:7px;border-radius:50%;background:#35cba3;box-shadow:0 0 0 4px rgba(53,203,163,.12)}.brand-preview-top b{letter-spacing:0;font-size:10px;color:#8f6a1d}
.brand-preview{--preview-primary:#d7ad58;--preview-accent:#5f78ff;display:grid;grid-template-columns:150px 1fr;min-height:230px;border-radius:15px;overflow:hidden;border:1px solid rgba(30,43,65,.08);background:#f7f9fc}
.brand-preview>aside{padding:18px 14px;background:linear-gradient(180deg,color-mix(in srgb,var(--preview-primary) 11%,#fff),#fff);border-right:1px solid #e5e9ef;display:flex;flex-direction:column}.brand-preview-lockup{display:flex;align-items:center;gap:8px;min-width:0}.brand-preview-logo{width:31px;height:31px;flex:0 0 31px;border-radius:10px;background:linear-gradient(145deg,var(--preview-primary),color-mix(in srgb,var(--preview-primary) 70%,#fff));display:grid;place-items:center;color:#1d2432;font-size:11px;font-weight:900;overflow:hidden}.brand-preview-logo img{width:100%;height:100%;object-fit:cover}.brand-preview-lockup strong{font-size:11px;line-height:1.1;color:#1a2230;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.brand-preview>aside>small{font-size:8px;color:#8994a6;margin:10px 0 12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.brand-preview nav{display:flex;flex-direction:column;gap:5px}.brand-preview nav>*{font-style:normal;font-size:8px;padding:6px 7px;border-radius:7px;color:#718095}.brand-preview nav b{background:color-mix(in srgb,var(--preview-primary) 17%,#fff);color:#4e3b14}.brand-preview>aside>em{margin-top:auto;font-style:normal;font-size:7px;color:#9aa4b3}
.brand-preview>main{padding:28px 24px;background:radial-gradient(circle at 85% 15%,color-mix(in srgb,var(--preview-accent) 12%,transparent),transparent 34%),linear-gradient(145deg,#fff,#f6f8fc)}.brand-preview>main>span{font-size:8px;letter-spacing:.14em;color:var(--preview-accent);font-weight:800}.brand-preview h3{font:800 22px/1.08 Manrope,sans-serif;letter-spacing:-.04em;color:#172033;margin:9px 0 7px}.brand-preview p{font-size:9px;line-height:1.5;color:#758196;margin:0;max-width:260px}.brand-preview-card{margin-top:24px;width:145px;border:1px solid #e1e6ed;border-radius:12px;padding:12px;background:rgba(255,255,255,.86);box-shadow:0 9px 24px rgba(26,36,54,.06)}.brand-preview-card small{display:block;font-size:7px;color:#8b95a4}.brand-preview-card strong{display:block;font:800 20px Manrope,sans-serif;color:#172033;margin-top:3px}
.brand-section{border:1px solid #e2e7ee;border-radius:18px;background:rgba(255,255,255,.9);padding:17px 18px 19px;margin:12px 0;box-shadow:0 10px 32px rgba(26,37,56,.035)}.brand-section-title{display:flex;align-items:center;gap:10px;margin-bottom:4px}.brand-section-title>span{width:30px;height:30px;border-radius:9px;background:#fff5de;color:#966817;display:grid;place-items:center;font-size:10px;font-weight:900}.brand-section-title>div{display:flex;flex-direction:column}.brand-section-title strong{font-size:15px;color:#1f2938}.brand-section-title small{font-size:11px;color:#8792a4;margin-top:2px}.brand-studio-v110 .brand-section label{font-size:12.5px;margin-top:12px;gap:7px;color:#556176}.brand-studio-v110 .brand-section input,.brand-studio-v110 .brand-section textarea{width:100%;border:1px solid #dbe1e9;border-radius:11px;padding:11px 12px;background:#fff;color:#172033;font-size:14px;line-height:1.35;outline:none;resize:vertical}.brand-studio-v110 .brand-section input:focus,.brand-studio-v110 .brand-section textarea:focus{border-color:var(--tenant-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--tenant-accent) 11%,transparent)}.brand-studio-v110 input[type=color]{height:48px;padding:5px}.brand-studio-v110 input[readonly]{background:#f6f8fb;color:#667286}.brand-studio-v110 input:disabled,.brand-studio-v110 textarea:disabled{background:#f3f5f8;color:#9aa4b2;cursor:not-allowed}.brand-studio-v110 [data-brand-locked="1"]{opacity:.73}.brand-entitlement{float:right;font-size:10px;padding:2px 7px;border-radius:999px;background:#f0f3f7;color:#6f7a8b;font-weight:800}.brand-help{font-size:11px!important;line-height:1.5!important;color:#8b95a5!important;margin:10px 0 0!important}.brand-two-col{display:grid;grid-template-columns:1fr 1fr;gap:10px}.brand-login-link{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:end}.brand-login-link label{min-width:0}.brand-login-link button{height:42px;margin-bottom:0;white-space:nowrap}.brand-studio-v110 .switch-row{font-size:12px!important;padding:13px 14px;background:#f6f8fb;border:1px solid #e4e8ef}.brand-studio-v110 .switch-row strong{font-size:12.5px}.brand-studio-v110 .switch-row small{font-size:10.5px}.domain-readiness{margin-top:12px;padding:12px;border-radius:11px;background:#f7f9fc;border:1px dashed #d7dee8;display:flex;flex-direction:column;gap:4px}.domain-readiness b{font-size:10px;color:#59667b}.domain-readiness span{font-size:9px;line-height:1.45;color:#8792a4}.domain-readiness.ready{background:#eefaf6;border-color:#bfe9d9}.domain-readiness.pending{background:#fff8e8;border-color:#eed798}.brand-studio-actions{position:sticky;bottom:-34px;margin:18px -28px -34px;padding:16px 28px 22px;background:rgba(255,255,255,.96);backdrop-filter:blur(18px);border-top:1px solid #e7ebf0;z-index:3}.brand-studio-actions .primary-btn{font-size:11px}
.auth-workspace-badge{display:inline-flex;margin-top:18px;border-radius:999px;padding:8px 12px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);font-size:11px;font-weight:700;color:#fff}.auth-layout.brand-entry .gate-brand-panel{background:radial-gradient(circle at 85% 8%,color-mix(in srgb,var(--tenant-accent) 25%,transparent),transparent 35%),linear-gradient(145deg,color-mix(in srgb,var(--tenant-primary) 13%,#0f192b),#101827)}.auth-layout.brand-entry .gate-brand-panel .gate-eyebrow{color:color-mix(in srgb,var(--tenant-primary) 80%,#fff)}
.app-brand.custom-brand img{border-radius:10px;object-fit:contain;background:#fff;padding:2px;box-shadow:0 3px 12px rgba(19,28,45,.08)}.app-brand.custom-brand span{letter-spacing:-.02em;text-transform:none}.app-brand.custom-brand em{display:none}
@media(max-width:720px){.brand-studio-v110{padding:22px 18px}.brand-studio-head{margin:-22px -18px 14px;top:-22px;padding:20px 18px 15px}.brand-preview{grid-template-columns:112px 1fr}.brand-preview>aside{padding:14px 10px}.brand-preview>main{padding:22px 16px}.brand-preview h3{font-size:18px}.brand-two-col,.color-row{grid-template-columns:1fr}.brand-login-link{grid-template-columns:1fr}.brand-studio-actions{margin:16px -18px -22px;padding:14px 18px 18px}}

/* Tenant color application with contrast-aware ink. This layer loads after Signature Standard. */
:root{--tenant-primary-ink:#172033;--tenant-accent-ink:#fffdf7}
#appShell .primary-btn,#appShell .billing-plan-card.current button{
  background:linear-gradient(145deg,color-mix(in srgb,var(--tenant-primary) 91%,#fff),color-mix(in srgb,var(--tenant-primary) 88%,#111827))!important;
  border-color:color-mix(in srgb,var(--tenant-primary) 72%,#4b5563)!important;
  color:var(--tenant-primary-ink)!important;
  box-shadow:0 9px 22px color-mix(in srgb,var(--tenant-primary) 22%,transparent),inset 0 1px 0 rgba(255,255,255,.28)!important
}
#appShell .side-nav button.active{background:color-mix(in srgb,var(--tenant-primary) 12%,#fff)!important;color:#2b3442!important;box-shadow:inset 3px 0 var(--tenant-primary)!important}
#appShell .side-nav button.active svg{color:color-mix(in srgb,var(--tenant-primary) 78%,#75520c)!important}
#appShell .workspace-avatar{background:linear-gradient(145deg,color-mix(in srgb,var(--tenant-primary) 58%,#fff),var(--tenant-primary))!important;color:var(--tenant-primary-ink)!important}
#appShell .metric-icon{color:color-mix(in srgb,var(--tenant-accent) 78%,#374151)!important;background:color-mix(in srgb,var(--tenant-accent) 9%,#fff)!important}
.auth-layout.brand-entry .primary-btn{background:linear-gradient(145deg,color-mix(in srgb,var(--tenant-primary) 91%,#fff),color-mix(in srgb,var(--tenant-primary) 87%,#111827))!important;border-color:color-mix(in srgb,var(--tenant-primary) 70%,#4b5563)!important;color:var(--tenant-primary-ink)!important}

/* v1.1.3 hotfix — keep the Brand Studio drawer above its blur backdrop.
   This file loads after the shared signature layers, so these selectors are
   intentionally explicit and isolated to the Brand Studio elements. */
#brandBackdrop.drawer-backdrop{z-index:var(--tt-layer-drawer,760)!important}
#brandDrawer.brand-drawer{z-index:calc(var(--tt-layer-drawer,760) + 10)!important}

/* v1.1.3 — Brand Studio UX & Preview Upgrade */
.brand-studio-v112{width:min(760px,100%);padding-bottom:96px}
.brand-head-chips{display:flex;gap:7px;flex-wrap:wrap;align-items:center}.brand-state-chip{display:inline-flex;align-items:center;min-height:26px;padding:4px 10px;border-radius:999px;background:#eef8f4;border:1px solid #cceadd;color:#28785e;font-size:11px;font-weight:800}.brand-state-chip.draft{background:#fff7e7;border-color:#f0d79d;color:#8c6315}.brand-state-chip.demo{background:#f0ecff;border-color:#d9cffd;color:#6954b3}
.brand-demo-banner{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 14px;margin:0 0 16px;border-radius:14px;background:linear-gradient(145deg,#f2edff,#fff7fb);border:1px solid #ded4ff}.brand-demo-banner>div{display:flex;flex-direction:column;gap:3px}.brand-demo-banner b{font-size:11px;letter-spacing:.12em;color:#6b54b9}.brand-demo-banner span{font-size:11px;line-height:1.45;color:#6d7588}.brand-demo-banner button{flex:0 0 auto;height:38px;padding:0 12px}
.brand-preview-tabs{display:flex;gap:6px;overflow:auto;padding:0 2px 10px;scrollbar-width:none}.brand-preview-tabs::-webkit-scrollbar{display:none}.brand-preview-tabs button{border:1px solid #dde4ec;background:#f7f9fc;color:#68758a;border-radius:999px;padding:7px 11px;font-size:10px;font-weight:800;white-space:nowrap;cursor:pointer}.brand-preview-tabs button.active{background:#172033;color:#fff;border-color:#172033;box-shadow:0 6px 16px rgba(23,32,51,.12)}
.brand-preview-stage{border-radius:15px;overflow:hidden}.brand-preview-view{display:none}.brand-preview-view.active{display:block}.brand-preview-view .brand-preview{border-radius:15px}.brand-preview-stage[data-preset="executive"]{background:#111a2c}.brand-preview-stage[data-preset="liquid"]{background:radial-gradient(circle at 15% 10%,rgba(255,188,217,.34),transparent 34%),linear-gradient(145deg,#fff8fc,#f7f4ff)}
.brand-login-preview{min-height:250px;display:grid;grid-template-columns:1.1fr .9fr;border:1px solid #e2e7ef;border-radius:15px;overflow:hidden;background:#fff}.brand-login-visual{padding:28px 24px;background:radial-gradient(circle at 86% 14%,color-mix(in srgb,var(--preview-accent,#5f78ff) 30%,transparent),transparent 34%),linear-gradient(145deg,color-mix(in srgb,var(--preview-primary,#d7ad58) 15%,#101827),#101827);color:#fff;display:flex;flex-direction:column;align-items:flex-start}.brand-login-preview-logo{width:42px;height:42px;border-radius:13px;background:linear-gradient(145deg,var(--preview-primary,#d7ad58),color-mix(in srgb,var(--preview-primary,#d7ad58) 70%,#fff));display:grid;place-items:center;font-weight:900;color:#172033;overflow:hidden}.brand-login-preview-logo img{width:100%;height:100%;object-fit:cover}.brand-login-visual>small{font-size:8px;letter-spacing:.13em;margin:28px 0 7px;color:color-mix(in srgb,var(--preview-primary,#d7ad58) 82%,#fff);font-weight:800}.brand-login-visual h3{font:800 23px/1.08 Manrope,sans-serif;letter-spacing:-.04em;margin:0 0 8px;color:#fff}.brand-login-visual p{font-size:9px;line-height:1.55;color:#c9d1df;max-width:270px}.brand-login-form-preview{padding:28px 22px;display:flex;flex-direction:column;gap:8px;background:#fff}.brand-login-form-preview strong{font-size:18px;color:#172033;margin-bottom:7px}.brand-login-form-preview span{font-size:8px;color:#7b8699}.brand-login-form-preview i{height:30px;border:1px solid #e1e6ed;border-radius:8px;background:#fbfcfe}.brand-login-form-preview button{height:34px;border:0;border-radius:9px;background:var(--preview-primary,#d7ad58);color:var(--preview-primary-ink,#172033);font-size:9px;font-weight:800;margin-top:6px}
.brand-sidebar-preview{min-height:250px;display:grid;grid-template-columns:190px 1fr;border:1px solid #e1e6ee;border-radius:15px;overflow:hidden;background:#f7f9fc}.brand-sidebar-card{padding:20px 16px;display:flex;flex-direction:column;background:linear-gradient(180deg,color-mix(in srgb,var(--preview-primary,#d7ad58) 12%,#fff),#fff);border-right:1px solid #e3e8ef}.brand-sidebar-card>small{font-size:8px;color:#8692a4;margin:12px 0}.brand-sidebar-card nav{display:flex;flex-direction:column;gap:5px}.brand-sidebar-card nav>*{padding:7px 8px;border-radius:8px;font-size:8px;color:#718095}.brand-sidebar-card nav b{background:color-mix(in srgb,var(--preview-primary,#d7ad58) 17%,#fff);color:#3d321d;box-shadow:inset 2px 0 var(--preview-primary,#d7ad58)}.brand-sidebar-card em{margin-top:auto;font-style:normal;font-size:7px;color:#9aa4b3}.brand-sidebar-preview-note{padding:44px 32px;display:flex;flex-direction:column;justify-content:center}.brand-sidebar-preview-note small{font-size:8px;letter-spacing:.13em;color:var(--preview-accent,#5f78ff);font-weight:800}.brand-sidebar-preview-note strong{font:800 22px/1.15 Manrope,sans-serif;color:#172033;margin:8px 0}.brand-sidebar-preview-note p{font-size:10px;line-height:1.55;color:#778397;max-width:260px}
.brand-email-preview{max-width:520px;margin:0 auto;border:1px solid #e1e6ee;border-radius:15px;background:#fff;overflow:hidden;box-shadow:0 16px 35px rgba(28,38,58,.07)}.brand-email-chrome{display:flex;gap:5px;padding:10px 12px;background:#f1f4f8}.brand-email-chrome span{width:7px;height:7px;border-radius:50%;background:#d3d9e2}.brand-email-body{padding:24px}.brand-email-lockup{display:flex;gap:10px;align-items:center}.brand-email-lockup>div{display:flex;flex-direction:column}.brand-email-lockup small{font-size:7px;color:#929cad}.brand-email-lockup strong{font-size:11px;color:#202a39}.brand-email-body h3{font:800 20px/1.15 Manrope,sans-serif;color:#172033;margin:22px 0 8px}.brand-email-body p{font-size:10px;color:#758196;line-height:1.5}.brand-email-body button{border:0;border-radius:9px;background:var(--preview-primary,#d7ad58);color:var(--preview-primary-ink,#172033);font-size:9px;font-weight:800;padding:10px 14px;margin:8px 0 20px}.brand-email-body>small{display:block;border-top:1px solid #edf0f4;padding-top:12px;font-size:8px;line-height:1.45;color:#949eae}
.brand-mobile-preview{min-height:270px;display:grid;place-items:center;background:radial-gradient(circle at 50% 15%,color-mix(in srgb,var(--preview-accent,#5f78ff) 10%,transparent),transparent 42%),#f4f7fb;border:1px solid #e1e6ed;border-radius:15px}.brand-phone{width:190px;height:330px;max-height:250px;border:6px solid #172033;border-radius:27px;background:#fff;padding:16px 12px 12px;box-shadow:0 18px 40px rgba(28,39,58,.14);position:relative;overflow:hidden}.brand-phone:before{content:"";position:absolute;width:62px;height:11px;border-radius:0 0 10px 10px;background:#172033;top:0;left:50%;transform:translateX(-50%)}.brand-phone-top{display:flex;align-items:center;gap:7px;margin-top:6px}.brand-phone-top .brand-preview-logo{width:25px;height:25px;flex-basis:25px}.brand-phone-top strong{font-size:9px;color:#172033}.brand-phone>small{display:block;font-size:7px;color:#8d97a8;margin:16px 0 3px}.brand-phone h3{font:800 18px Manrope,sans-serif;margin:0;color:#172033}.brand-mobile-metric{margin-top:16px;border:1px solid #e3e8ef;border-radius:11px;padding:12px;background:linear-gradient(145deg,#fff,color-mix(in srgb,var(--preview-primary,#d7ad58) 7%,#fff))}.brand-mobile-metric span{display:block;font-size:7px;color:#818da0}.brand-mobile-metric strong{font:800 20px Manrope,sans-serif;color:#172033}.brand-phone nav{position:absolute;left:10px;right:10px;bottom:10px;border-top:1px solid #edf0f4;padding-top:9px;display:flex;justify-content:space-around;color:#8b95a6;font-size:11px}.brand-phone nav b{color:var(--preview-accent,#5f78ff)}
.brand-health{border:1px solid #dfe5ec;border-radius:18px;padding:16px 18px;margin:14px 0;background:linear-gradient(145deg,#fff,#f8fafc)}.brand-health-head{display:flex;justify-content:space-between;gap:14px;align-items:center}.brand-health-head>div{display:flex;flex-direction:column}.brand-health-head small{font-size:9px;letter-spacing:.12em;color:#8994a6;font-weight:800}.brand-health-head strong{font-size:15px;color:#1f2938;margin-top:2px}.brand-health-head button{height:36px;padding:0 11px;font-size:10px}.brand-health-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}.brand-health-item{display:flex;align-items:center;gap:8px;padding:9px 10px;border:1px solid #e7ebf0;border-radius:10px;background:#fff}.brand-health-item i{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:10px;font-weight:900}.brand-health-item.good i{background:#e8f8f2;color:#258161}.brand-health-item.warn i{background:#fff4d9;color:#946817}.brand-health-item.locked i{background:#f0f2f6;color:#7b8595}.brand-health-item>span{display:flex;flex-direction:column}.brand-health-item b{font-size:10px;color:#354052}.brand-health-item small{font-size:8px;color:#8b95a5;margin-top:1px}
.brand-presets{border:1px solid #e2e7ee;border-radius:18px;background:#fff;padding:17px 18px 18px;margin:12px 0}.brand-preset-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:12px}.brand-preset-grid button{border:1px solid #dfe5ec;border-radius:12px;background:#fafbfd;padding:11px 12px;text-align:left;display:flex;flex-direction:column;gap:2px;cursor:pointer}.brand-preset-grid button b{font-size:10.5px;color:#2a3444}.brand-preset-grid button span{font-size:8.5px;color:#8a95a6}.brand-preset-grid button.active{border-color:color-mix(in srgb,var(--tenant-accent) 45%,#dfe5ec);box-shadow:0 0 0 3px color-mix(in srgb,var(--tenant-accent) 9%,transparent);background:#fff}.brand-preset-grid button.custom{background:linear-gradient(145deg,#f7f8fb,#fff)}
.brand-contrast-note{margin-top:10px;padding:10px 11px;border-radius:10px;background:#f7f9fc;border:1px solid #e4e9ef;font-size:9px;line-height:1.45;color:#7d8899}.brand-contrast-note.warn{background:#fff8e9;border-color:#eed8a2;color:#7f601c}.brand-contrast-note.good{background:#eef9f5;border-color:#c5e8db;color:#2e725d}
.brand-entitlement{cursor:pointer;user-select:none}.brand-studio-v112 [data-brand-locked="1"]{position:relative}.brand-studio-v112 [data-brand-locked="1"] .brand-entitlement{background:#fff0d9;color:#8d641a}.brand-studio-v112 [data-brand-locked="1"] input,.brand-studio-v112 [data-brand-locked="1"] textarea{border-style:dashed}.brand-studio-v112 [data-brand-locked="1"]:after{content:"Upgrade in Billing";display:block;margin-top:6px;font-size:9px;color:#9b711f;font-weight:700}
.brand-history-section{border:1px solid #e2e7ee;border-radius:18px;background:#fff;padding:17px 18px 18px;margin:12px 0}.brand-history-list{display:flex;flex-direction:column;gap:8px;margin-top:12px}.brand-history-list>p{font-size:10px;color:#8d97a7;margin:0}.brand-history-item{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;padding:10px 11px;border:1px solid #e5e9ef;border-radius:11px;background:#fafbfd}.brand-history-item>div{display:flex;flex-direction:column}.brand-history-item strong{font-size:10.5px;color:#354052}.brand-history-item small{font-size:8.5px;color:#8b95a5;margin-top:2px}.brand-history-item button{height:32px;padding:0 10px;font-size:9px}
.brand-studio-actions{display:grid;grid-template-columns:auto 1fr 1.25fr;gap:9px}.brand-studio-actions button{min-width:0}.brand-studio-actions #saveBrandDraft{border-color:#d9e0e8;background:#f7f9fc}.brand-studio-actions .primary-btn{font-size:11px}
.brand-unsaved-modal{max-width:500px}.brand-unsaved-modal>p{font-size:13px;line-height:1.55;color:#717d90}.brand-unsaved-modal .modal-actions{display:grid;grid-template-columns:1fr 1fr 1.2fr;gap:8px}
body.brand-demo-active #runtimeBanner{background:linear-gradient(90deg,#efe8ff,#fff3f8);color:#6954b3;border-bottom-color:#ded4ff}body.brand-demo-active #runtimeBanner:before{content:"DEMO MODE · ";font-weight:900}
@media(max-width:720px){.brand-studio-v112{width:100%}.brand-login-preview{grid-template-columns:1fr}.brand-login-visual{min-height:190px}.brand-sidebar-preview{grid-template-columns:145px 1fr}.brand-sidebar-preview-note{padding:28px 20px}.brand-health-grid,.brand-preset-grid{grid-template-columns:1fr}.brand-studio-actions{grid-template-columns:1fr 1fr}.brand-studio-actions #brandCloseSecondary{grid-column:1/-1}.brand-unsaved-modal .modal-actions{grid-template-columns:1fr}.brand-demo-banner{align-items:flex-start;flex-direction:column}}
.brand-head-actions{display:flex;align-items:center;gap:8px}.brand-head-actions #brandFullScreenToggle{height:36px;padding:0 12px;font-size:9px;white-space:nowrap}.brand-head-actions #brandClose{flex:0 0 auto}
body.brand-studio-fullscreen #brandDrawer.brand-drawer{left:20px!important;right:20px!important;top:20px!important;bottom:20px!important;width:auto!important;max-width:none!important;height:auto!important;border-radius:24px!important;padding-left:clamp(24px,4vw,56px)!important;padding-right:clamp(24px,4vw,56px)!important;box-shadow:0 30px 90px rgba(20,30,48,.22)!important}body.brand-studio-fullscreen #brandDrawer .brand-studio-head{margin-left:clamp(-56px,-4vw,-24px);margin-right:clamp(-56px,-4vw,-24px);padding-left:clamp(24px,4vw,56px);padding-right:clamp(24px,4vw,56px)}body.brand-studio-fullscreen #brandDrawer .brand-preview-shell,body.brand-studio-fullscreen #brandDrawer .brand-health,body.brand-studio-fullscreen #brandDrawer .brand-presets,body.brand-studio-fullscreen #brandDrawer .brand-section,body.brand-studio-fullscreen #brandDrawer .brand-history-section{max-width:1120px;margin-left:auto;margin-right:auto}body.brand-studio-fullscreen #brandDrawer .brand-preview-stage{min-height:320px}body.brand-studio-fullscreen #brandDrawer .brand-preview{min-height:310px}body.brand-studio-fullscreen #brandDrawer .brand-studio-actions{padding-left:clamp(24px,4vw,56px);padding-right:clamp(24px,4vw,56px)}
@media(max-width:720px){.brand-head-actions #brandFullScreenToggle{display:none}body.brand-studio-fullscreen #brandDrawer.brand-drawer{inset:0!important;border-radius:0!important}}
#brandPreviewStage[data-preset="liquid"] .brand-preview,#brandPreviewStage[data-preset="liquid"] .brand-login-preview,#brandPreviewStage[data-preset="liquid"] .brand-sidebar-preview,#brandPreviewStage[data-preset="liquid"] .brand-email-preview{background:linear-gradient(145deg,rgba(255,255,255,.76),rgba(250,245,255,.66));box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 18px 45px rgba(139,92,170,.12);backdrop-filter:blur(22px) saturate(135%)}#brandPreviewStage[data-preset="liquid"] .brand-preview>main,#brandPreviewStage[data-preset="liquid"] .brand-login-form-preview{background:linear-gradient(145deg,rgba(255,255,255,.72),rgba(252,248,255,.58))}#brandPreviewStage[data-preset="executive"] .brand-preview>main,#brandPreviewStage[data-preset="executive"] .brand-sidebar-preview-note{background:#111a2c}#brandPreviewStage[data-preset="executive"] .brand-preview h3,#brandPreviewStage[data-preset="executive"] .brand-sidebar-preview-note strong{color:#f7f5ef}#brandPreviewStage[data-preset="executive"] .brand-preview p,#brandPreviewStage[data-preset="executive"] .brand-sidebar-preview-note p{color:#aeb9ca}
.brand-studio-v112 .switch-row{display:grid!important;grid-template-columns:1fr auto auto!important;column-gap:10px!important}.brand-studio-v112 .switch-row>.brand-entitlement{float:none;align-self:center}.brand-studio-v112 .switch-row>input{width:18px!important;height:18px!important;padding:0!important;margin:0!important}


/* v1.1.3 — Brand Studio header-action layout hotfix.
   The base .drawer-head button rule gives every header button a fixed 30px width.
   Brand Studio's text action must opt out of that generic sizing contract. */
#brandDrawer.brand-drawer{scrollbar-gutter:stable}
#brandDrawer .brand-studio-head{
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  gap:20px!important;
  padding-right:40px!important;
  z-index:6
}
#brandDrawer .brand-studio-head>.brand-head-copy{
  flex:1 1 auto;
  min-width:0
}
#brandDrawer .brand-head-actions{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:10px!important;
  flex:0 0 auto!important;
  min-width:max-content;
  margin-left:auto;
  white-space:nowrap
}
#brandDrawer .brand-head-actions #brandFullScreenToggle{
  width:auto!important;
  min-width:132px!important;
  max-width:none!important;
  height:42px!important;
  padding:0 14px!important;
  margin:0!important;
  border:1px solid #dfe5ec!important;
  border-radius:12px!important;
  background:#f7f9fc!important;
  color:#59667a!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  flex:0 0 auto!important;
  font-size:12px!important;
  font-weight:800!important;
  line-height:1!important;
  overflow:visible!important;
  white-space:nowrap!important
}
#brandDrawer .brand-head-actions #brandFullScreenToggle:hover{
  background:#fff!important;
  border-color:#cfd7e2!important;
  box-shadow:0 8px 20px rgba(23,32,51,.08)!important
}
#brandDrawer .brand-fullscreen-icon{
  display:inline-grid;
  place-items:center;
  width:18px;
  height:18px;
  flex:0 0 18px;
  font-size:15px;
  line-height:1
}
#brandDrawer .brand-fullscreen-label{display:inline-block;white-space:nowrap}
#brandDrawer .brand-head-actions #brandClose{
  width:42px!important;
  min-width:42px!important;
  max-width:42px!important;
  height:42px!important;
  min-height:42px!important;
  padding:0!important;
  margin:0!important;
  border:1px solid #e2e7ee!important;
  border-radius:12px!important;
  background:#f3f5f8!important;
  color:#6f7b8e!important;
  display:grid!important;
  place-items:center!important;
  flex:0 0 42px!important;
  font-size:20px!important;
  font-weight:500!important;
  line-height:1!important
}
#brandDrawer .brand-head-actions #brandClose:hover{
  background:#fff!important;
  color:#252e3d!important;
  border-color:#cfd7e2!important
}
body.brand-studio-fullscreen #brandDrawer .brand-studio-head{
  padding-right:clamp(36px,4vw,64px)!important
}
@media(max-width:900px){
  #brandDrawer .brand-studio-head{gap:12px!important;padding-right:28px!important}
  #brandDrawer .brand-head-actions #brandFullScreenToggle{
    width:42px!important;
    min-width:42px!important;
    max-width:42px!important;
    padding:0!important
  }
  #brandDrawer .brand-fullscreen-label{display:none}
}
@media(max-width:720px){
  #brandDrawer .brand-studio-head{padding-right:24px!important}
  #brandDrawer .brand-head-actions #brandFullScreenToggle{display:inline-flex!important}
}
@media(max-width:480px){
  #brandDrawer .brand-studio-head{gap:8px!important;padding-right:20px!important}
  #brandDrawer .brand-head-actions{gap:7px!important}
  #brandDrawer .brand-head-actions #brandFullScreenToggle,
  #brandDrawer .brand-head-actions #brandClose{
    width:38px!important;min-width:38px!important;max-width:38px!important;height:38px!important;min-height:38px!important
  }
}

/* v1.1.3 — authenticated brand assets + custom-domain infrastructure */
.brand-asset-control{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center}
.brand-asset-control .brand-upload-btn{height:42px;min-width:92px;padding:0 13px;white-space:nowrap}
.brand-file-input{display:none!important}
.brand-asset-status{display:block;margin-top:6px;font-size:9.5px;line-height:1.45;color:#8792a4}
.brand-asset-status[data-state="busy"]{color:#6e5a22}
.brand-asset-status[data-state="good"]{color:#2e725d}
.brand-asset-status[data-state="error"]{color:#a14949}
.domain-status-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.domain-status-head #brandDomainRefreshBtn{height:32px;padding:0 10px;font-size:9px;white-space:nowrap}
.domain-readiness.error{background:#fff2f2;border-color:#e8bbbb}
.domain-readiness.error b,.domain-readiness.error span{color:#934646}
.domain-dns-records{display:flex;flex-direction:column;gap:7px;margin-top:8px;padding-top:9px;border-top:1px solid rgba(119,132,151,.16)}
.domain-dns-row{display:grid;grid-template-columns:52px minmax(90px,.8fr) minmax(0,1.3fr);gap:7px;align-items:start}
.domain-dns-row b{font-size:8.5px!important;letter-spacing:.06em;color:#6f7a8b!important}
.domain-dns-row span,.domain-dns-row code{min-width:0;font-size:8.5px!important;line-height:1.4!important;overflow-wrap:anywhere;color:#697689!important}
.domain-dns-row code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;background:rgba(255,255,255,.72);border:1px solid rgba(126,139,157,.16);border-radius:6px;padding:3px 5px}
@media(max-width:720px){.brand-asset-control{grid-template-columns:1fr}.brand-asset-control .brand-upload-btn{width:100%}.domain-status-head{align-items:flex-start}.domain-dns-row{grid-template-columns:46px 1fr}.domain-dns-row code{grid-column:1/-1}}

/* v1.1.3.1 — Full Studio floating action bar position hotfix.
   Keep the compact drawer/mobile behavior unchanged; on desktop Full Studio,
   let the sticky action rail sit closer to the lower edge of the viewport. */
@media(min-width:721px){
  body.brand-studio-fullscreen #brandDrawer .brand-studio-actions{
    bottom:-82px!important;
  }
}

/* v1.1.3.2 — Brand Studio editing comfort hotfix.
   Reduce header dominance, give form controls more room, and replace the
   oversized desktop Full Studio footer-like rail with a compact bottom control. */
#brandDrawer .brand-studio-head h2{
  font-size:24px!important;
  line-height:1.08!important;
  letter-spacing:-.035em!important;
  margin-top:4px!important;
  margin-bottom:6px!important
}

@media(min-width:721px){
  #brandDrawer.brand-studio-v112{
    width:min(840px,100%);
    scroll-padding-bottom:108px
  }
  #brandDrawer .brand-section{
    padding:20px 22px 23px;
    margin-top:15px;
    margin-bottom:15px
  }
  #brandDrawer .brand-section-title{
    margin-bottom:7px
  }
  #brandDrawer.brand-studio-v112 .brand-section label{
    margin-top:14px;
    gap:8px
  }
  #brandDrawer.brand-studio-v112 .brand-section input,
  #brandDrawer.brand-studio-v112 .brand-section textarea{
    min-height:46px;
    padding:12px 14px;
    border-radius:12px
  }
  #brandDrawer.brand-studio-v112 .brand-section textarea{
    min-height:92px
  }
  #brandDrawer .brand-two-col{
    gap:14px
  }
  #brandDrawer .brand-login-link,
  #brandDrawer .brand-asset-control{
    gap:11px
  }

  /* Keep the quick drawer rail compact without changing its sticky behavior. */
  #brandDrawer .brand-studio-actions{
    gap:8px;
    padding-top:10px;
    padding-bottom:12px
  }
  #brandDrawer .brand-studio-actions button{
    min-height:40px;
    height:40px;
    padding-top:0;
    padding-bottom:0
  }

  /* Full Studio gets a wider editing canvas and more deliberate field spacing. */
  body.brand-studio-fullscreen #brandDrawer .brand-preview-shell,
  body.brand-studio-fullscreen #brandDrawer .brand-health,
  body.brand-studio-fullscreen #brandDrawer .brand-presets,
  body.brand-studio-fullscreen #brandDrawer .brand-section,
  body.brand-studio-fullscreen #brandDrawer .brand-history-section{
    max-width:1240px
  }
  body.brand-studio-fullscreen #brandDrawer .brand-section{
    padding:24px 28px 28px;
    margin-top:18px;
    margin-bottom:18px
  }
  body.brand-studio-fullscreen #brandDrawer .brand-health,
  body.brand-studio-fullscreen #brandDrawer .brand-presets,
  body.brand-studio-fullscreen #brandDrawer .brand-history-section{
    margin-top:18px;
    margin-bottom:18px
  }
  body.brand-studio-fullscreen #brandDrawer .brand-preview-shell{
    margin-bottom:22px
  }
  body.brand-studio-fullscreen #brandDrawer.brand-studio-v112 .brand-section label{
    margin-top:16px
  }
  body.brand-studio-fullscreen #brandDrawer .brand-two-col{
    gap:18px
  }
  body.brand-studio-fullscreen #brandDrawer .brand-login-link,
  body.brand-studio-fullscreen #brandDrawer .brand-asset-control{
    gap:14px
  }
  body.brand-studio-fullscreen #brandDrawer.brand-studio-v112{
    padding-bottom:122px;
    scroll-padding-bottom:112px
  }

  /* Compact floating rail: anchor it to the actual Full Studio viewport
     instead of relying on sticky placement in document flow. This keeps the
     rail at the bottom while the preview and input sections scroll behind it. */
  body.brand-studio-fullscreen #brandDrawer .brand-studio-actions{
    position:fixed!important;
    left:50%;
    bottom:16px!important;
    transform:translateX(-50%);
    width:min(620px,calc(100% - 96px));
    grid-template-columns:auto auto minmax(190px,1fr);
    gap:6px;
    margin:0!important;
    padding:6px 8px!important;
    border:1px solid rgba(216,223,232,.9);
    border-radius:14px;
    background:rgba(255,255,255,.94);
    box-shadow:0 12px 30px rgba(23,32,51,.13),0 2px 7px rgba(23,32,51,.06);
    overflow:hidden;
    z-index:12
  }
  body.brand-studio-fullscreen #brandDrawer .brand-studio-actions button{
    height:36px;
    min-height:36px;
    padding:0 13px;
    border-radius:9px
  }
  body.brand-studio-fullscreen #brandDrawer .brand-studio-actions #brandCloseSecondary{
    min-width:76px
  }
  body.brand-studio-fullscreen #brandDrawer .brand-studio-actions #saveBrandDraft{
    min-width:106px
  }
  body.brand-studio-fullscreen #brandDrawer .brand-studio-actions .primary-btn{
    min-width:190px;
    font-size:10.5px
  }
}

/* v1.1.3.3 — Full Studio action-bar anchoring hotfix.
   The v1.1.3.2 rail was compact but still used sticky positioning, so at some
   scroll positions it could remain in the middle of the canvas. Desktop Full
   Studio now fixes the compact rail to the drawer viewport bottom. */


/* v1.1.3.4 — Full Studio viewport anchoring correction.
   A transformed drawer creates a containing block for fixed descendants.
   Remove that transform only while Full Studio is open so the compact action
   rail is truly viewport-fixed instead of scrolling with the drawer content. */
@media(min-width:721px){
  body.brand-studio-fullscreen #brandDrawer.brand-drawer.open{
    transform:none!important
  }
  body.brand-studio-fullscreen #brandDrawer .brand-studio-actions{
    bottom:28px!important
  }
}

@media(max-width:720px){
  #brandDrawer .brand-studio-head h2{
    font-size:22px!important
  }
}

/* v1.2.0 — Branded transactional email controls and preview polish. */
.brand-studio-v110 .brand-section select{
  width:100%;
  min-height:44px;
  border:1px solid #dbe1e9;
  border-radius:11px;
  padding:10px 36px 10px 12px;
  background:#fff;
  color:#172033;
  font-size:14px;
  line-height:1.35;
  outline:none
}
.brand-studio-v110 .brand-section select:focus{
  border-color:var(--tenant-accent);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--tenant-accent) 11%,transparent)
}
.brand-studio-v110 .brand-section select:disabled{background:#f3f5f8;color:#9aa4b2;cursor:not-allowed}
.brand-studio-v112 [data-brand-locked="1"] select{border-style:dashed}
.brand-email-lockup em{font-size:7px;line-height:1.35;color:#8d97a7;font-style:normal;margin-top:2px}
.brand-email-preview-eyebrow{display:block!important;border:0!important;padding:0!important;margin:20px 0 0!important;font-size:7px!important;letter-spacing:.12em;color:var(--preview-accent,#5f78ff)!important;font-weight:900}
.brand-email-test-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center;margin-top:14px;padding:13px 14px;border:1px solid #e3e8ef;border-radius:12px;background:#f8fafc}
.brand-email-test-row>div{display:flex;flex-direction:column;min-width:0}.brand-email-test-row strong{font-size:11px;color:#344055}.brand-email-test-row small{font-size:9px;line-height:1.45;color:#7f8a9b;margin-top:3px}.brand-email-test-row small[data-state="busy"]{color:#7b6320}.brand-email-test-row small[data-state="good"]{color:#2f765f}.brand-email-test-row small[data-state="warn"]{color:#8a681c}.brand-email-test-row small[data-state="error"]{color:#a14949}.brand-email-test-row button{height:36px;padding:0 12px;font-size:9.5px;white-space:nowrap}.brand-email-test-row[data-brand-locked="1"] button{pointer-events:none}
.brand-help code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.92em;background:#f1f3f7;border-radius:5px;padding:1px 4px;color:#596579}
@media(min-width:721px){#brandDrawer.brand-studio-v112 .brand-section select{min-height:46px;padding:12px 38px 12px 14px;border-radius:12px}}
@media(max-width:720px){.brand-email-test-row{grid-template-columns:1fr}.brand-email-test-row button{width:100%}}
.brand-email-meta{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:12px 16px;background:#fff;border-bottom:1px solid #edf0f4}.brand-email-meta>div{display:flex;flex-direction:column;min-width:0}.brand-email-meta small{font-size:7px;color:#929cad}.brand-email-meta strong{font-size:10px;color:#202a39;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.brand-email-meta em{font-size:7px;line-height:1.35;color:#8d97a7;font-style:normal;margin-top:2px}.brand-email-meta>b{font-size:7px;letter-spacing:.11em;color:#98a2b1;white-space:nowrap;margin-top:2px}
.brand-email-render-head{padding:22px 24px 20px;background:linear-gradient(135deg,var(--preview-primary,#d7ad58),var(--preview-accent,#5f78ff));color:var(--preview-primary-ink,#172033)}.brand-email-render-head .brand-preview-logo{width:42px;height:42px;border-radius:12px;background:rgba(255,255,255,.78);box-shadow:0 5px 14px rgba(25,34,51,.10)}.brand-email-render-head .brand-preview-logo img{width:100%;height:100%;object-fit:contain}.brand-email-render-head .brand-email-preview-eyebrow{margin:14px 0 0!important;color:inherit!important;opacity:.88}.brand-email-render-head h3{font:800 20px/1.15 Manrope,sans-serif;color:inherit;margin:6px 0 0;letter-spacing:-.02em}.brand-email-body{padding:20px 24px 22px}.brand-email-body p{margin:0 0 10px}.brand-email-body button{margin:7px 0 18px}.brand-email-body>small{margin-top:2px}