:root{--navy:#113e49;--teal:#087980;--mid:#60818a;--edge:#d8e8e3;--shadow:0 16px 45px rgba(10,65,69,.14)}
*{box-sizing:border-box}html{color-scheme:light}body{margin:0;min-height:100vh;color:var(--navy);font-family:system-ui,-apple-system,'Segoe UI',Arial,sans-serif;background:radial-gradient(circle at 12% 8%,#c5f3e7 0,transparent 32%),radial-gradient(circle at 93% 81%,#d7eafa 0,transparent 36%),linear-gradient(150deg,#ecfaf5,#fff9ed 70%)}button,input{font:inherit}button{cursor:pointer;border:0;font-weight:750}button:disabled{cursor:not-allowed;opacity:.44}button:focus-visible,input:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #e6ad42;outline-offset:3px}a{color:#007881;text-underline-offset:3px}.shell{max-width:1270px;margin:0 auto;padding:24px 24px 15px}.topbar{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:23px}.brand{display:flex;align-items:center;gap:12px}.flower{display:grid;place-items:center;flex-shrink:0;width:48px;height:48px;background:#057d81;color:#ffe5a8;border-radius:17px;font-size:34px}.brandname{font-size:14px;font-weight:850;letter-spacing:.11em}.brandname span{font-size:15px}.tagline{font-size:12px;color:var(--mid);margin-top:3px}.version{font-size:10px;color:#9d662e;border-radius:40px;padding:9px 13px;letter-spacing:.06em;background:#fff7dc;border:1px solid #ead7a9;font-weight:850;white-space:nowrap}.layout{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,1fr);align-items:start;gap:27px}.avatar-side{min-width:0}.portrait{position:relative;overflow:hidden;border-radius:25px;aspect-ratio:1;background:#5aa7ba;box-shadow:var(--shadow);isolation:isolate}.portrait-inner{width:100%;height:100%;position:relative;animation:idleSway 11s ease-in-out infinite alternate}.portrait-base{display:block;width:100%;height:100%;object-fit:cover}.mouth{position:absolute;pointer-events:none;left:43.70016%;top:31.41946%;width:15.62998%;height:10.36683%}.name-chip,.portrait-status{position:absolute;z-index:3;backdrop-filter:blur(12px);font-size:13px;padding:9px 12px;color:white;border-radius:40px;border:1px solid #ffffff60;box-shadow:0 6px 15px #094b6040}.name-chip{bottom:17px;left:18px;background:#073e48ca;font-weight:750}.portrait-status{top:17px;right:17px;background:#07545dcf;font-size:11px;display:flex;align-items:center;gap:7px}.badge-dot{width:7px;height:7px;border-radius:50%;background:#fee3a3}.portrait.is-live .badge-dot{background:#7dffb5;box-shadow:0 0 0 3px #7dffb51f}.portrait.is-speaking .portrait-status{background:#027e83e0}.portrait.is-speaking .badge-dot{animation:pulse 1s ease-in-out infinite alternate}@keyframes pulse{to{box-shadow:0 0 0 5px #74ffad22}}.blink-eye{position:absolute;z-index:1;transform:scaleY(0);transform-origin:center;opacity:0;transition:transform 65ms ease-in,opacity 65ms ease-in;pointer-events:none;border-radius:48% 48% 45% 45%;background:linear-gradient(180deg,#aa6653 2%,#e4a17d 55%,#d78e70 90%);border-bottom:2px solid #56352750}.blink-eye-left{left:45.5%;top:22.5%;width:5.5%;height:2.2%;transform:rotate(-9deg) scaleY(0)}.blink-eye-right{left:56.6%;top:23.8%;width:6.9%;height:2.3%;transform:rotate(-5deg) scaleY(0)}.portrait-inner.is-blinking .blink-eye{opacity:1}.portrait-inner.is-blinking .blink-eye-left{transform:rotate(-9deg) scaleY(1.12)}.portrait-inner.is-blinking .blink-eye-right{transform:rotate(-5deg) scaleY(1.12)}.portrait-inner.no-idle{animation:none}.portrait-inner.no-idle .blink-eye{display:none}@keyframes idleSway{0%{transform:scale(1)}100%{transform:scale(1.007) translateY(-.15%)}}.audio-meter{background:#fff;border:1px solid var(--edge);border-radius:15px;margin-top:16px;padding:15px 18px;box-shadow:0 5px 17px #1747530c}.meter-top{display:flex;justify-content:space-between;gap:10px;align-items:center;color:#527580;font-size:12px;font-weight:650}.meter-icon{color:#0a9a86;font-size:16px;margin-right:4px}.meter-track{margin-top:11px;width:100%;height:8px;background:#edf3f1;border-radius:80px;overflow:hidden}.meter-fill{height:100%;width:0%;border-radius:80px;background:linear-gradient(90deg,#2cafa4,#f0c46c);transition:width .08s linear}.portrait-caption{font-size:12px;color:#60818a;line-height:1.6;text-align:center;padding:0 16px}.main-card{background:#fff;border:1px solid #ffffffed;border-radius:25px;padding:29px 31px;box-shadow:var(--shadow)}.eyebrow{font-size:11px;letter-spacing:.14em;font-weight:850;color:#18858c;margin-bottom:10px}h1{font-weight:800;letter-spacing:-.045em;line-height:1.09;font-size:clamp(32px,3.8vw,46px);margin:0}h1 em{font-style:normal;color:#13868a}.intro{margin:14px 0 20px;color:#5e7a82;font-size:14px;line-height:1.63}.connection-card{background:#f4fbf8;border:1px solid #d9eae4;border-radius:17px;padding:17px}.connection-heading{display:flex;align-items:center;gap:10px}.connection-symbol{font-size:24px;width:44px;height:44px;border-radius:13px;background:#e0f3ec;display:grid;place-items:center}.connection-heading strong{display:block;font-size:15px}.connection-heading span:not(.connection-symbol){font-size:11px;color:#6f8889;display:block;margin-top:3px}.primary-actions{display:flex;gap:9px;margin-top:17px;flex-wrap:wrap}.primary-button,.secondary-button,.outline-button{padding:12px 15px;border-radius:11px;transition:background .15s,transform .15s}.primary-button{flex:1;min-width:190px;background:#078288;color:white;box-shadow:0 4px 11px #07828829}.primary-button:hover:not(:disabled){background:#006f76}.secondary-button{background:#e5f0eb;color:#376b73}.secondary-button:hover:not(:disabled){background:#d4e8e0}.connection-note{color:#557880;font-size:12px;line-height:1.55;margin:14px 0 0}.status{margin-top:12px;border-radius:10px;background:white;border:1px solid #e0e9e5;display:flex;align-items:center;gap:10px;padding:11px 12px;color:#4d7375;font-size:12px;line-height:1.5}.status-dot{width:8px;height:8px;flex-shrink:0;border-radius:50%;background:#a8b9b5}.status.is-live .status-dot{background:#25a783}.status.is-error{background:#fff1e8;color:#95543e;border-color:#f6d6c3}.status.is-error .status-dot{background:#d37458}.quick-steps{margin:21px 0 18px;display:flex;flex-direction:column;gap:14px}.step{display:flex;gap:12px;align-items:flex-start;color:#536f78;font-size:13px;line-height:1.52}.step strong{color:#214d59}.step-number{width:26px;height:26px;border-radius:50%;background:#e4f5ef;color:#087d79;font-weight:800;display:grid;place-items:center;flex-shrink:0;font-size:12px}.preview-bar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;background:#fff9eb;border:1px solid #f4e6c5;border-radius:15px;padding:14px 16px}.preview-bar strong{display:block;font-size:13px}.preview-bar span{display:block;font-size:11px;color:#877860;margin-top:3px}.outline-button{color:#9b6b2e;background:white;border:1px solid #ecd4a8;font-size:12px;white-space:nowrap}.outline-button:hover{background:#ffefcf}.customize,.help{margin-top:17px;border-top:1px solid #e3ebea;padding-top:14px}.customize summary,.help summary{font-size:13px;display:flex;align-items:center;justify-content:space-between;font-weight:800;cursor:pointer;list-style:none}.customize summary::-webkit-details-marker,.help summary::-webkit-details-marker{display:none}.customize summary span,.help summary span{color:#6d9b99}.setting{margin-top:18px}.setting label{font-size:12px;font-weight:700;display:flex;justify-content:space-between}.setting input[type=range]{width:100%;accent-color:#0c8185;margin:10px 0}.setting p{font-size:11px;line-height:1.4;color:#7a9294;margin:0}.setting .checklabel{display:flex;justify-content:start;align-items:center;gap:9px}.checklabel input{width:16px;height:16px;accent-color:#078288}.help-content p{font-size:12px;color:#5f7c83;line-height:1.55;margin:13px 0 0}.privacy{font-size:11px;color:#7a9396;line-height:1.65;margin:20px 0 0}.privacy strong{color:#426a70}footer{text-align:center;color:#77969a;font-size:12px;padding:26px 0 6px}@media(max-width:900px){.shell{padding:14px 13px}.layout{grid-template-columns:1fr;max-width:590px;margin:0 auto;gap:17px}.topbar{max-width:590px;margin:0 auto 18px}.main-card{padding:24px}}@media(max-width:450px){.main-card{padding:22px 17px}.version{font-size:9px;padding:7px 9px}.brandname{font-size:11px}.tagline{font-size:10px}.flower{width:39px;height:39px;font-size:27px}.preview-bar{flex-direction:column;align-items:stretch}.outline-button{width:100%}.portrait-status{font-size:10px}}@media(prefers-reduced-motion:reduce){.portrait-inner{animation:none}.badge-dot{animation:none}}