:root{color-scheme:dark;--navy:#071c2a;--deep:#0b2b3c;--blue:#28617a;--orange:#ef7021;--paper:#f2f6f7;--ink:#10283a;--line:#c4d3da}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:"Microsoft YaHei","PingFang SC",system-ui,sans-serif;background:var(--navy);color:#fff}
button,input{font:inherit}
button{touch-action:manipulation}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.screen{height:100vh;min-height:720px;display:grid;grid-template-columns:minmax(0,1.48fr) minmax(520px,.82fr);overflow:hidden;background:var(--navy)}
.avatar-zone{position:relative;min-width:0;min-height:100%;overflow:hidden;background:radial-gradient(circle at 50% 28%,#497d8f 0,#28566a 28%,#103547 58%,#071c2a 86%)}
.avatar-zone:after{content:"";position:absolute;z-index:1;inset:0;background:linear-gradient(180deg,#06182408 0,#06182400 55%,#061824cc 100%);pointer-events:none}
.screen-brand{position:absolute;z-index:8;top:26px;left:32px;right:32px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.screen-brand img{display:block;width:min(350px,36vw);height:70px;object-fit:contain;object-position:left center;filter:drop-shadow(0 8px 16px #00101d66)}
.screen-meta{display:flex;align-items:center;gap:18px;color:#e7f2f6;font-variant-numeric:tabular-nums;letter-spacing:.06em}
.screen-meta time{font-size:clamp(18px,1.7vw,28px);font-weight:700}
.network-state{display:inline-flex;align-items:center;gap:8px;padding:8px 13px;border:1px solid #ffffff30;border-radius:999px;background:#082536b8;backdrop-filter:blur(8px)}
.network-state:before{content:"";width:9px;height:9px;border-radius:50%;background:#5dd49a;box-shadow:0 0 0 6px #5dd49a1c}
.network-state.offline:before{background:#ec6b5f;box-shadow:0 0 0 6px #ec6b5f1c}
.avatar{position:absolute!important;z-index:3;inset:0!important;overflow:hidden}
.avatar canvas{position:absolute;left:50%;top:50%;width:auto!important;height:100%!important;max-width:none!important;object-fit:contain;transform:translate(-50%,-50%);transform-origin:center center}
.avatar-compat-poster{position:absolute;z-index:2;left:50%;bottom:-3%;height:94%;width:auto;max-width:none;transform:translateX(-50%) scale(1.08);transform-origin:center bottom;object-fit:contain;opacity:1;transition:opacity .45s ease;pointer-events:none;filter:drop-shadow(0 22px 35px #00152266)}
.avatar-placeholder{position:absolute;z-index:2;inset:0;display:none;place-content:center;text-align:center;transition:opacity .45s ease;color:#fff}
.avatar-placeholder b{font-size:clamp(48px,7vw,112px);letter-spacing:.24em;color:#f6a45c;text-shadow:0 10px 30px #00152280}
.avatar-placeholder p{margin:18px 0 0;font-size:clamp(22px,2vw,34px);color:#d8e9ef;letter-spacing:.08em}
.avatar-frame-ready .avatar-placeholder{opacity:0}.avatar-compat-poster{opacity:1}
.avatar-compatibility-fallback .avatar-compat-poster{opacity:1}
.avatar-caption{position:absolute;z-index:8;left:6%;right:6%;bottom:5%;display:grid;justify-items:center;gap:12px;pointer-events:none}
.mode-badge{display:inline-flex;padding:8px 16px;border-radius:999px;background:#072536d9;border:1px solid #ffffff2a;color:#bfe5f2;font-size:clamp(14px,1.25vw,20px)}
.subtitle{width:100%;min-height:70px;margin:0;padding:16px 24px;border:1px solid #ffffff30;border-radius:16px;background:#061926d9;box-shadow:0 18px 46px #0006;backdrop-filter:blur(12px);text-align:center;font-size:clamp(18px,1.7vw,29px);line-height:1.65}
.service-zone{min-width:0;height:100vh;padding:clamp(24px,2.5vw,48px);display:flex;flex-direction:column;gap:clamp(14px,1.5vh,24px);overflow:auto;background:linear-gradient(145deg,#f8fbfc,#eaf1f4);color:var(--ink)}
.service-head>p{margin:0 0 8px;color:#2c6780;font-weight:800;letter-spacing:.22em}
.service-head h1{margin:0;font-family:"Noto Serif SC","Songti SC",serif;font-size:clamp(38px,3.6vw,64px);font-weight:600;line-height:1.2}
.status-row{margin-top:14px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.status-row span{display:inline-flex;padding:8px 15px;border-radius:999px;background:#d9e9ef;color:#225970;font-weight:800}
.status-row small{color:#66808d;font-size:15px}
.controls{display:grid;grid-template-columns:1.45fr repeat(4,1fr);gap:9px}
.controls[hidden]{display:none!important}
.controls button,.quick button,form button,.conversation-head button{min-height:50px;border:1px solid var(--line);border-radius:12px;background:#fff;color:#173749;padding:12px 15px;font-weight:750;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,background .18s ease}
.controls button:hover,.quick button:hover,form button:hover,.conversation-head button:hover{transform:translateY(-2px);box-shadow:0 9px 20px #19394b18}
.controls .primary,form button{background:var(--orange);border-color:var(--orange);color:#fff}
.controls .danger{color:#8d2d20;border-color:#dfb9b2;background:#fff7f4}
.controls .listening{background:#c92e2e;color:#fff;border-color:#c92e2e;animation:listening 1.25s ease-in-out infinite}
.quick{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.quick h2{grid-column:1/-1;margin:0 0 2px;font-family:"Noto Serif SC","Songti SC",serif;font-size:clamp(23px,1.8vw,32px)}
.quick button{text-align:left;font-weight:600;line-height:1.45;background:#fdfefe}
.conversation{min-height:0;display:flex;flex:1 1 250px;flex-direction:column;border:1px solid #cad8de;border-radius:16px;background:#ffffffb8;overflow:hidden}
.conversation-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-bottom:1px solid #d5e0e5}
.conversation-head h2{margin:0 auto 0 0;font-size:20px}
.conversation-state{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border-radius:999px;background:#e5f1f4;color:#2c6175;font-size:13px;font-weight:800;white-space:nowrap}
.conversation-state:before{content:"";width:8px;height:8px;border-radius:50%;background:#f0aa3d;box-shadow:0 0 0 5px #f0aa3d1c}
body.presence-active .conversation-state:before{background:#37ae75;box-shadow:0 0 0 5px #37ae751c}
.conversation-head button{min-height:auto;padding:7px 11px;background:transparent;color:#527181;font-size:14px}
.dialog{min-height:120px;max-height:100%;padding:14px;overflow:auto;display:grid;align-content:start;gap:9px;scroll-behavior:smooth}
.dialog p{max-width:92%;margin:0;padding:11px 14px;border-radius:13px;background:#fff;line-height:1.6;box-shadow:0 4px 12px #19394b0b}
.dialog .assistant{justify-self:start;background:#fff;color:#143447;white-space:pre-line}
.dialog .user{justify-self:end;margin-left:12%;background:#173f52;color:#fff}
.dialog .system{justify-self:start;background:#fff0e5;color:#843715}
.dialog .source{justify-self:start;background:transparent;color:#6c838e;font-size:13px;box-shadow:none;padding:2px 6px}
form{display:flex;gap:10px}
form input{flex:1;min-width:0;height:58px;border:1px solid #b9ccd5;border-radius:13px;padding:0 16px;background:#fff;color:#10283a;outline:none}
form input:focus{border-color:#39788f;box-shadow:0 0 0 4px #39788f1a}
form button{flex:0 0 110px}
nav{display:flex;justify-content:space-between;gap:14px}
nav a{color:#174a62;font-weight:800;text-decoration:none}
nav a:hover{text-decoration:underline}
@keyframes listening{50%{box-shadow:0 0 0 9px #c92e2e20}}
@media(max-aspect-ratio:6/5){.screen{height:auto;min-height:100vh;grid-template-columns:1fr;grid-template-rows:58vh auto;overflow:auto}.avatar-zone{min-height:58vh}.service-zone{height:auto;min-height:42vh;overflow:visible}.screen-brand img{width:min(330px,58vw)}.avatar-caption{bottom:3%}.controls{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.screen{min-height:100vh;grid-template-rows:52vh auto}.avatar-zone{min-height:52vh}.screen-brand{top:16px;left:18px;right:18px}.screen-brand img{height:48px}.network-state{display:none}.service-zone{padding:20px}.status-row{align-items:flex-start;flex-direction:column}.controls{grid-template-columns:1fr 1fr}.controls .primary{grid-column:1/-1}.quick{grid-template-columns:1fr}.quick h2{grid-column:auto}.subtitle{font-size:16px;min-height:58px;padding:12px 16px}nav{flex-direction:column}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
/* v1.94 big-screen voice system */
.file-open-warning{display:none}
.screen-meta{flex-wrap:wrap;justify-content:flex-end}
.microphone-state{display:inline-flex;align-items:center;gap:8px;padding:8px 13px;border:1px solid #ffffff30;border-radius:999px;background:#082536b8;color:#d8edf5;backdrop-filter:blur(8px)}
.microphone-state:before{content:"";width:9px;height:9px;border-radius:50%;background:#f3b45e;box-shadow:0 0 0 6px #f3b45e20}
.controls{grid-template-columns:1.4fr repeat(5,1fr)}
.controls button[aria-pressed="true"]{background:#dff1ea;border-color:#7cbba2;color:#17563f;box-shadow:0 0 0 3px #56b38d20}
.controls button.listening{background:#e7543f;border-color:#e7543f;color:#fff;animation:micPulse 1.15s ease-in-out infinite}
.device-panel{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:10px;border:1px solid #c9d7dc;border-radius:14px;background:#edf4f6}
.device-panel div{min-width:0;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 12px;border-radius:9px;background:#fff;color:#58717c;font-size:13px}
.device-panel b{color:#173749;white-space:nowrap}
.device-panel span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.voice-wave{position:absolute;z-index:9;left:50%;bottom:20%;display:flex;align-items:center;justify-content:center;gap:7px;height:54px;opacity:0;transform:translateX(-50%);transition:opacity .25s ease;pointer-events:none}
.voice-wave.active{opacity:1}
.voice-wave i{display:block;width:7px;height:15px;border-radius:999px;background:#f6a45c;box-shadow:0 0 18px #f6a45c80;animation:voiceWave .9s ease-in-out infinite}
.voice-wave i:nth-child(2),.voice-wave i:nth-child(4){animation-delay:.14s}.voice-wave i:nth-child(3){animation-delay:.28s}.voice-wave i:nth-child(5){animation-delay:.42s}
.avatar-voice-input{position:absolute;z-index:12;right:4%;bottom:18%;width:clamp(112px,12vw,174px);aspect-ratio:1;border:2px solid #ffffffd9;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;padding:14px;background:linear-gradient(145deg,#f47a22,#df4f1b);color:#fff;box-shadow:0 18px 42px #00152266,0 0 0 8px #ffffff1f;cursor:pointer;transition:transform .18s ease,filter .18s ease,box-shadow .18s ease;touch-action:none;user-select:none;-webkit-user-select:none}
.avatar-voice-input svg{width:42%;height:42%;fill:currentColor;filter:drop-shadow(0 4px 6px #7d230055)}
.avatar-voice-input span{font-size:clamp(16px,1.8vw,24px);font-weight:900;letter-spacing:.06em;white-space:nowrap}
.avatar-voice-input:hover{filter:brightness(1.06)}
.avatar-voice-input.pressed,.avatar-voice-input.listening{background:linear-gradient(145deg,#d8432d,#a92722);transform:scale(.95);box-shadow:0 10px 28px #00152270,0 0 0 13px #ffddd337;animation:micPulse 1.15s ease-in-out infinite}
.presence-camera,.presence-sampler{position:absolute;z-index:-1;width:1px;height:1px;opacity:0;pointer-events:none}
nav{align-items:center;flex-wrap:wrap}nav a{white-space:nowrap}nav span{color:#6f8792;font-size:12px;margin-left:auto;white-space:nowrap}
@keyframes micPulse{50%{box-shadow:0 0 0 8px #e7543f24}}
@keyframes voiceWave{0%,100%{height:14px}50%{height:48px}}
@media(max-width:1400px){.screen-meta{gap:9px}.microphone-state{display:none}.controls{grid-template-columns:1.35fr repeat(2,1fr)}.device-panel{display:none}nav span{display:none}nav a{font-size:13px}}
@media(max-width:980px){.controls{grid-template-columns:repeat(2,1fr)}.controls .primary{grid-column:1/-1}nav span{display:none}}
@media(max-width:760px){.screen-meta{flex-wrap:nowrap}.controls{grid-template-columns:1fr 1fr}.voice-wave{bottom:24%}}
/* 9:16 portrait digital-screen layout: avatar above, conversation below. */
@media (orientation:portrait), (max-aspect-ratio:3/4){
  html,body{height:100%;overflow:hidden}
  .screen{height:100dvh;min-height:100vh;grid-template-columns:1fr;grid-template-rows:minmax(0,2fr) minmax(0,1fr);overflow:hidden}
  .avatar-zone{min-height:0;height:auto}
  .screen-brand{top:clamp(16px,2vh,34px);left:clamp(18px,3vw,42px);right:clamp(18px,3vw,42px)}
  .screen-brand img{width:min(440px,58vw);height:clamp(52px,6vh,86px)}
  .avatar canvas{top:56%;height:230%!important;width:auto!important;max-width:none!important;transform:translate(-50%,-50%)}
  .avatar-caption{left:5%;right:5%;bottom:3%;gap:8px}
  .mode-badge{font-size:clamp(14px,1.7vw,22px)}
  .subtitle{min-height:62px;padding:12px 18px;font-size:clamp(17px,2vw,27px);line-height:1.55}
  .voice-wave{bottom:18%}
  .service-zone{height:auto;min-height:0;padding:clamp(14px,2vh,28px) clamp(20px,3.5vw,46px);gap:clamp(8px,1vh,14px);overflow:auto}
  .service-head{display:grid;grid-template-columns:1fr auto;column-gap:18px;align-items:end}
  .service-head>p{grid-column:1/-1;margin:0 0 2px;font-size:clamp(12px,1.5vw,18px)}
  .service-head h1{font-size:clamp(30px,4.6vw,52px)}
  .status-row{margin:0;justify-self:end;align-self:center;flex-direction:column;align-items:flex-end;gap:4px}
  .status-row span{padding:6px 12px}
  .controls{grid-template-columns:repeat(3,1fr);gap:8px}
  .controls button{min-height:44px;padding:9px 10px}
  .controls .primary{grid-column:auto}
  .device-panel{display:none}
  .quick{grid-template-columns:repeat(2,1fr);gap:7px}
  .quick h2{grid-column:1/-1;font-size:clamp(20px,2.8vw,28px)}
  .quick button{min-height:42px;padding:8px 11px}
  .conversation{flex:1 1 180px;min-height:150px}
  .dialog{min-height:90px;padding:10px;gap:7px}
  .dialog p{padding:9px 12px;line-height:1.5}
  form{gap:8px}
  form input{height:54px}
  form button{flex-basis:96px;min-height:54px;padding:8px 10px}
  nav{font-size:13px}
}

/* build:crm-dh-mobile-caption-hide-1.0.1-20260909
 * Portrait mobile: once the digital human is open, keep the avatar unobstructed.
 * Desktop and the three large-screen presentations are intentionally unchanged.
 */
@media (max-width: 1100px) {
  .avatar-caption {
    display: none !important;
  }
}
@media (orientation:portrait) and (max-width:760px){
  .screen{grid-template-rows:minmax(0,2fr) minmax(0,1fr)}
  .service-zone{padding:14px 16px;overflow:auto}
  .service-head{display:block}
  .status-row{margin-top:7px;align-items:flex-start}
  .controls{grid-template-columns:repeat(2,1fr)}
  .quick{grid-template-columns:1fr 1fr}
  form{display:grid;grid-template-columns:1fr auto}
  form input{grid-column:1/-1}
  form button{flex-basis:auto}
  nav{display:none}
}
/* v3.0: fixed portrait reception layout */
.screen{
  height:auto;
  min-height:100dvh;
  grid-template-columns:minmax(0,1fr);
  grid-template-rows:minmax(560px,66.667dvh) minmax(360px,auto);
  overflow:visible;
}
.avatar-zone{
  min-height:560px;
  height:66.667dvh;
}
.service-zone{
  height:auto;
  min-height:33.333dvh;
  padding:clamp(16px,2vh,28px) clamp(20px,3.2vw,48px);
  gap:clamp(9px,1.1vh,16px);
  overflow:visible;
}
.avatar canvas{
  top:56%;
  width:auto!important;
  height:230%!important;
  max-width:none!important;
  transform:translate(-50%,-50%);
}
.service-head{
  display:grid;
  grid-template-columns:1fr auto;
  column-gap:18px;
  align-items:end;
}
.service-head>p{grid-column:1/-1;margin:0 0 2px}
.service-head h1{font-size:clamp(30px,4vw,52px)}
.status-row{margin:0;justify-self:end;align-self:center}
.device-panel{display:none}
.quick{grid-template-columns:repeat(4,minmax(0,1fr))}
.quick h2{grid-column:1/-1}
.conversation{flex:1 1 260px;min-height:220px}
.dialog{min-height:150px}
@media(max-width:760px){
  .screen{grid-template-rows:minmax(500px,66.667dvh) minmax(360px,auto)}
  .avatar-zone{min-height:500px;height:66.667dvh}
  .service-zone{padding:14px 16px}
  .service-head{display:block}
  .status-row{margin-top:7px;align-items:flex-start}
  .quick{grid-template-columns:1fr 1fr}
  nav{display:none}
}

/* v3.4.6: compact heading and question-first reception flow. */
.service-head h1{font-size:clamp(15px,2vw,26px);line-height:1.15}
.screen-question-form{order:0;width:100%;margin:0 0 clamp(2px,.4vh,6px)}
.screen-question-form input{height:clamp(52px,6vh,64px);font-size:clamp(17px,1.45vw,24px)}
.screen-question-form button{min-height:clamp(52px,6vh,64px);font-size:clamp(17px,1.35vw,22px)}
.recording-save-bar{display:flex;align-items:center;gap:12px;margin:-1px 0 5px;padding:7px 12px;border:1px solid #c9d7dc;border-radius:10px;background:#edf4f6;color:#58717c;font-size:13px}.recording-save-bar b{color:#173749;white-space:nowrap}.recording-save-bar span{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.recording-save-bar button{border:1px solid #7b9aad;border-radius:7px;background:#fff;color:#17384b;padding:7px 14px;cursor:pointer;font:inherit;font-weight:700}.recording-save-bar button:hover{background:#fff4e9;border-color:#e77b2b}
@media(max-width:760px){.service-head h1{font-size:clamp(15px,4vw,24px)}}
/* build:crm-local-avatar-runtime-3.1.0-20260904 */
.avatar-compat-poster{animation:junda-screen-avatar-breathe 4.8s ease-in-out infinite}
.avatar-zone::before{content:"";position:absolute;z-index:7;left:41%;top:31%;width:18%;height:2%;border-top:clamp(2px,.22vw,4px) solid #5a382d;border-radius:50%;opacity:0;animation:junda-screen-avatar-blink 5.6s linear infinite;pointer-events:none}
@keyframes junda-screen-avatar-breathe{0%,100%{transform:translateX(-50%) scale(1.08)}45%,55%{transform:translateX(-50%) scale(1.095) translateY(-.45%)}}
@keyframes junda-screen-avatar-blink{0%,46%,49%,100%{opacity:0;transform:scaleY(0)}47%,48%{opacity:.38;transform:scaleY(1)}}
.avatar-frame-ready .avatar-compat-poster{opacity:0}

/* build:junda-dh-mobile-avatar-answer-welcome-3.7.1-20260910 */
@media (orientation:portrait), (max-width:760px){
  body.answering-with-avatar .avatar-zone{height:100dvh;min-height:100dvh}
  body.answering-with-avatar .avatar canvas{top:50%;height:185%!important}
  body.answering-with-avatar .service-zone{min-height:100dvh}
}