/* FaceX brand palette. Supplied transparent logos are displayed without recoloring. */
:root{
  --brand-ink:#06152b;
  --brand-primary:#173f69;
  --brand-primary-hover:#255681;
  --brand-tint:#edf3f8;
  --brand-selection-border:#8faac4;
  --brand-background:#f4f6f9;
  --brand-border:#dfe5ed;
  --brand-text:#24364d;
  --brand-secondary:#586a80;
  --brand-muted:#7b899c;
  --blue:var(--brand-primary);
  --ink:var(--brand-ink);
  --navy:var(--brand-ink);
  --line:var(--brand-border);
  --muted:var(--brand-muted);
  background:var(--brand-background);
  color:var(--brand-text);
}
body{background:var(--brand-background);color:var(--brand-text)}
.topbar{background:#fff;border-color:var(--brand-border)}
.brand img{width:100%;max-width:146px;height:auto;aspect-ratio:2381/516;object-fit:contain;mix-blend-mode:normal!important;background:transparent;border-radius:0}
.brand-product{font-size:23px;font-weight:600;letter-spacing:-.5px;margin-top:16px}
.nav-label{color:#7e92ad}
.nav-link.active{background:#1b3552}
.nav-link.active:before{background:#88b5c6}
.nav-link:hover{background:#142b44}
.nav-count{background:#243e5a}
.device-mini{border-color:#294058;background:#0d2037}
.device-mini p{color:#8b9db4}
.tag.blue{background:var(--brand-tint);color:var(--brand-primary)}
.btn.primary:hover{background:var(--brand-primary-hover);border-color:var(--brand-primary-hover)}
.avatar{background:#214365;color:#e1edf7}
input,select,textarea{color:var(--brand-text)}

/* Light application shell. */
.console-page{--c-blue:var(--brand-primary);--c-ink:var(--brand-ink);--c-muted:var(--brand-muted);--c-border:var(--brand-border);background:var(--brand-background)}
.c-brand{flex-direction:column;align-items:flex-start;gap:16px;padding:1px 12px 27px;color:var(--brand-ink)}
.c-brand img{width:146px;height:auto;aspect-ratio:2381/516;object-fit:contain;background:transparent;border-radius:0;mix-blend-mode:normal}
.c-brand strong{font-size:23px;line-height:1.1;letter-spacing:-.6px;font-weight:600}
.c-nav-item{color:var(--brand-secondary)}
.c-nav-item.selected{background:var(--brand-tint);color:var(--brand-primary)}
.c-nav-item:hover{background:#f1f5f9}
.c-nav-group>p{color:#7c899a}
.c-page-heading p,.c-card-heading p{color:var(--brand-secondary)}
.c-title-row h1{color:var(--brand-ink)}
.c-step{color:#64748a}
.c-step small{color:#73849a}
.c-step.current{background:var(--brand-tint)}
.c-step.current .c-step-number{box-shadow:0 2px 6px #173f6915}
.c-step.done .c-step-number{border-color:#d2e0ee;background:#f0f5f9;color:var(--brand-primary)}
.c-account-avatar{background:#eaf0f6;color:var(--brand-primary)}
.c-character.selected,.c-motion.selected{background:#f3f7fa;border-color:var(--brand-selection-border)}
.c-character-info small,.c-motion small{color:#65768c}
.c-character-info>span,.c-motion em{color:#77879a}
.c-persona p{color:var(--brand-secondary)}
.c-section-label{color:#75849a}
.c-info{background:#f3f6fa;border-color:#e1e8f0;color:#61748e}
.c-info .icon{color:#52799d}
.c-feature-icon{background:#edf3f8;color:#567fa0}
.c-expression-signal,.c-input-source{background:#f5f8fb;border-color:#e2eaf2}
.c-expression-signal .face,.c-mimic-signal .face{color:#6488a9}
.c-content-intro h3{color:#314d69}
.c-content-intro p,.c-preview-caption{color:#74849b}
.c-preview-caption{background:#f7f9fb}
.c-demo-launch{background:#fafbfd}
.c-device-visual{background:radial-gradient(circle at 50% 43%,#e7f0f6,#f6f9fc 72%)}
.c-device-icon{border-color:#d3e1ee;background:linear-gradient(145deg,#fff,#e9f0f6);box-shadow:0 15px 35px #173f6912}
.c-device-icon .icon{color:#496d90}
.c-device-visual h3{color:var(--brand-primary)}
.c-orbit,.c-orbit:after{border-color:#d1dfeb80}
.c-device-detail dd{color:#354b63}
.c-session-summary span{color:#60758c}
.c-metrics strong{color:#405c79}
.c-badge.success{color:#237f65}
.c-badge.success i{background:#319578}
.c-chat-message.user p{background:#e9f1f7;border-color:#d8e5f0;color:#2f5b7c}
.console-nav-collapsed .c-brand{padding:5px 0 27px;align-items:center;gap:0}
.console-nav-collapsed .c-brand img{width:48px;height:auto}
.console-nav-collapsed .c-brand strong{display:none}

/* Login uses the dark wordmark on its light brand canvas, including mobile. */
.auth-page{background:#fff;color:var(--brand-ink)}
.login-brand-panel{background:linear-gradient(145deg,#f1f5f9 0%,#e8eff5 60%,#e3ecf3 100%)}
.login-logo{width:164px;height:auto;aspect-ratio:2381/516;object-fit:contain;background:transparent;border-radius:0;mix-blend-mode:normal}
.login-edition{font-size:10px;color:#72859a;letter-spacing:2px}
.login-brand-copy h1{color:var(--brand-ink)}
.login-brand-copy>p{color:#304962}
.login-brand-caption,.login-overline{color:#657c94}
.login-panel-top,.login-welcome h2{color:var(--brand-ink)}
.login-welcome>p{color:#6c7d92}
.login-heading-icon{color:var(--brand-primary);background:#eff4f8;border-color:#dce6ef}
.login-input-wrap input{background:#fbfcfe;border-color:#d8e1eb;color:#243d58}
.login-input-wrap input:focus{border-color:var(--brand-selection-border);box-shadow:0 0 0 3px #173f6910}
.login-field>label{color:#415873}
.login-options>label{color:#657b94}
.login-password-toggle:hover{background:#edf3f8;color:var(--brand-primary)}
.login-submit{box-shadow:0 5px 12px #173f6919}
.login-demo-card{background:#f5f8fb;border-color:#e1e8f0}
.login-demo-icon{background:#e6eff6;color:#5c7d9a}
.login-demo-card strong{color:#526f8b}
.login-demo-card button{color:var(--brand-primary)}
.login-scope{color:#8190a3}
.login-footer{color:#7f8fa2}
.login-portrait-label{border-color:#ffffffd9;background:#ffffffcc}
.portrait-marker{border-color:#33828a;box-shadow:0 0 0 4px #33828a10}

@media(max-width:1150px) and (min-width:701px){
  .c-brand{padding-left:10px;padding-right:10px}
  .c-brand img{width:140px}
  .console-nav-collapsed .c-brand img{width:48px}
}
@media(max-width:760px){
  .login-panel-top:before{width:102px;height:25px;flex:none;background:transparent url('assets/facex-logo-dark.png') center/contain no-repeat;border-radius:0}
  .login-panel-top>span:first-of-type{font-size:17px;letter-spacing:-.4px}
  .login-panel-top{gap:13px}
}
@media(max-width:700px){
  .console-nav-collapsed .c-brand,.c-brand{padding:1px 12px 27px;align-items:flex-start;gap:16px}
  .console-nav-collapsed .c-brand img,.c-brand img{width:146px;height:auto}
  .console-nav-collapsed .c-brand strong{display:block}
  .c-mobile-close{right:6px;top:5px}
}

/* Morpho and its Chinese name share one baseline in each product wordmark. */
.brand-product,.c-brand strong,.login-panel-top .brand-wordmark{white-space:nowrap}
.brand-product{align-items:baseline;gap:10px}
.brand-product .brand-cn,.c-brand strong .brand-cn,.login-panel-top .brand-wordmark .brand-cn{
  display:inline-block;font-size:16px;font-weight:500;line-height:1.2;letter-spacing:1px;
  color:inherit;border:0;border-radius:0;padding:0;margin:0;vertical-align:baseline;
}
.c-brand strong .brand-cn{margin-left:10px}
.login-panel-top .brand-wordmark .brand-cn{font-size:13px;letter-spacing:.7px;margin-left:8px}
.login-brand-copy h1{display:flex;align-items:baseline;gap:18px;white-space:nowrap}
.login-brand-copy h1 .brand-cn{display:inline-block;font-size:.46em;font-weight:500;line-height:1.2;letter-spacing:.08em;color:inherit;vertical-align:baseline;margin:0}
@media(max-width:760px){
  .login-panel-top{flex-wrap:wrap;column-gap:10px;row-gap:10px}
  .login-panel-top .brand-wordmark{flex:none}
  .login-panel-top .login-env{margin-left:auto;white-space:nowrap}
}