@charset "UTF-8";
:root{--bg:#f8f7f4;--paper:#fff;--ink:#302b37;--muted:#8a8590;--line:#eae7ed;--plum:#594766;--lavender:#ece5f3;--pink:#f4d9e4;--blue:#dce7f7;--green:#557d65;font-family:Inter,"PingFang SC","Microsoft YaHei",system-ui,sans-serif;color:var(--ink);background:var(--bg);font-synthesis:none}
*{box-sizing:border-box}body{margin:0}button,input,textarea,select{font:inherit}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;transition:background .18s,transform .18s}button:disabled{cursor:not-allowed;opacity:.4}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #aa92bf;outline-offset:4px}button:not(:disabled):active{transform:translateY(1px)}a{color:inherit;text-decoration:none}svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}button svg{width:20px;height:20px;flex-shrink:0}[hidden]{display:none!important}
.topbar{height:100px;max-width:1320px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:0 48px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;font-size:20px;font-weight:650;letter-spacing:2px}.brand-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:linear-gradient(135deg,#d7dcf8,#f3d3e6);font-size:23px;color:#685477;font-weight:500}.brand small{display:block;font-size:10px;letter-spacing:2px;color:var(--muted);font-weight:400;margin-top:5px}.header-right{display:flex;align-items:center;gap:25px}.prototype-badge{color:#8b7b83;font-size:11px;border:1px solid #ded8dd;border-radius:6px;padding:5px 8px;letter-spacing:1px}.text-button{border:0;background:transparent;color:#84788d;font-size:12px;padding:8px 0}.text-button:hover{color:var(--ink)}.text-button span{margin-left:8px}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:72px;max-width:1160px;margin:54px auto 70px;padding:0 28px;align-items:start}.eyebrow{font-size:11px;font-weight:550;letter-spacing:2px;color:#958398;display:flex;align-items:center;gap:8px}.tiny-dot{width:5px;height:5px;display:inline-block;background:#bca5bf;border-radius:50%}h1{font-size:45px;line-height:1.32;letter-spacing:2px;font-weight:550;margin:20px 0 18px}h1 span{color:#9b849b}.intro{font-size:13px;line-height:1.9;color:#8b8590;margin:0}.subject-control{display:flex;gap:4px;margin:23px 0 18px;background:#eeecef;padding:4px;width:max-content;border-radius:8px}.subject{font-size:11px;padding:7px 14px;border:0;background:transparent;border-radius:5px;color:#938a96}.subject.active{background:#fff;color:#594766;box-shadow:0 1px 4px #34233c09}
.voice-card{background:linear-gradient(150deg,#fff 0%,#fcfafd 60%,#f9f5f9 100%);border:1px solid #e7e1e9;border-radius:19px;padding:18px 22px 0;box-shadow:0 10px 50px #533c5705;overflow:hidden}.voice-topline{display:flex;justify-content:space-between;align-items:center}.status-pill{font-size:10px;background:#f2edf5;color:#a18caa;border-radius:20px;padding:5px 9px;letter-spacing:.5px}.status-pill.live{color:#527862;background:#eaf2ec}.timer{font-size:11px;color:#aaa1ad;font-variant-numeric:tabular-nums}.orb-wrap{height:130px;display:flex;align-items:center;justify-content:center}.orb{width:91px;height:91px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(ellipse at 30% 20%,#faf4ff 0%,#d9d8f4 35%,#e8bfd8 68%,#d8d9ef 100%);box-shadow:inset -7px -5px 16px #b2a6cf38,inset 5px 4px 12px #fff8,0 0 0 14px #f2edf77a,0 0 0 28px #f8f4fb70;color:#fff}.orb svg{width:48px;height:48px;stroke-width:2;filter:drop-shadow(0 1px 1px #ab87ba)}.voice-card.listening .orb{box-shadow:inset -7px -5px 16px #b2a6cf38,0 0 0 15px #e5e2f580,0 0 0 28px #f2eefb80}.voice-card.speaking .orb{background:radial-gradient(ellipse at 30% 20%,#fef6ff,#c4d7f4 35%,#d9b8e6 72%,#d8d9ef)}.voice-state{text-align:center;font-size:14px;font-weight:500;letter-spacing:1px}.voice-hint{font-size:10px;text-align:center;color:#a298a7;line-height:1.8;min-height:18px;margin:9px 0 16px}.voice-controls{display:flex;justify-content:center;gap:8px}.primary{display:inline-flex;justify-content:center;align-items:center;gap:9px;border:1px solid #594766;background:#594766;color:#fff;border-radius:8px;padding:12px 20px;font-size:12px;font-weight:500}.primary:hover:not(:disabled){background:#493955}.primary svg{width:16px;height:16px;stroke-width:1.6}.secondary,.icon-button{border:1px solid #ded7e4;border-radius:8px;padding:11px 17px;background:white;color:var(--plum);font-size:12px}.danger-button{border:0;border-radius:8px;color:#a26779;background:#f4e8ed;padding:11px 15px;font-size:12px}.full{width:100%;display:flex;justify-content:center}.primary.full{justify-content:space-between}.primary.full span{opacity:.7}.demo-divider{display:flex;align-items:center;gap:12px;font-size:9px;color:#b0a7b5;margin:20px 0 0}.demo-divider span:first-child,.demo-divider span:last-child{height:1px;background:#eee7f0;flex:1}.example-actions{display:flex;justify-content:space-between;align-items:center;min-height:56px}.example-actions>button:first-child{border:0;background:transparent;font-size:11px;color:#928099;padding:12px 0;text-align:left}.example-actions>button:first-child span{margin-left:10px}.example-actions .text-button{font-size:10px;color:#aaa1ad}
.chat-heading{display:flex;justify-content:space-between;margin:26px 0 17px;font-size:11px;color:#736779}.subtle{color:#afa6b2;font-size:9px}.chat{max-height:288px;overflow-y:auto;padding-right:4px;scrollbar-width:thin;scrollbar-color:#ded5e3 transparent}.bubble-row{display:flex;align-items:flex-start;gap:9px;margin-bottom:16px}.chat-avatar{width:25px;height:25px;border-radius:8px;display:grid;place-items:center;background:#ece5f2;color:#a390ad;flex-shrink:0;font-size:12px}.bubble{font-size:12px;line-height:1.85;padding:12px 15px;background:#fff;border:1px solid #eae6ec;border-radius:0 12px 12px;max-width:87%;white-space:pre-wrap;overflow-wrap:anywhere}.bubble-row.user{flex-direction:row-reverse}.user .chat-avatar{display:none}.user .bubble{background:#ece6f0;border-color:#e6deec;border-radius:12px 0 12px 12px;color:#6e5c7a}.bubble-row.system{justify-content:center}.system .bubble{background:transparent;border:0;font-size:10px;color:#a193a9;padding:0;text-align:center}.bubble-row.system .chat-avatar{display:none}.composer{position:relative;margin-top:16px;background:white;border:1px solid #e8e2ec;border-radius:11px;padding:12px 48px 10px 14px}.composer:focus-within{border-color:#b3a0bf}.composer textarea{border:0;outline:0;width:100%;resize:vertical;min-height:36px;max-height:130px;font-size:11px;line-height:1.8;background:transparent;color:var(--ink)}.composer textarea::placeholder{color:#b1a7b6}.send-button{position:absolute;right:10px;bottom:11px;background:#eee8f3;border:0;border-radius:7px;color:#8d779e;font-size:23px;width:30px;height:30px;line-height:1}.footnote{color:#b1a7b3;font-size:9px;line-height:1.8;margin-top:11px}
.profile-panel{position:sticky;top:24px;background:#fff;border:1px solid #e5dfe8;border-radius:18px;padding:26px 25px 18px;margin-top:5px;box-shadow:0 12px 45px #49375904}.profile-heading{display:flex;justify-content:space-between;align-items:center;gap:8px}.profile-heading .eyebrow{font-size:9px;letter-spacing:1px}.profile-heading h2{font-size:20px;letter-spacing:1px;font-weight:550;margin:9px 0 0}.draft-label{font-size:9px;padding:5px 7px;background:#f7f4f8;color:#a18fa7;border-radius:5px;white-space:nowrap}.draft-label.saved{color:var(--green);background:#ecf4ee}.progress-caption{display:flex;justify-content:space-between;font-size:9px;color:#a99bb0;margin:25px 0 9px}.progress-track{height:4px;background:#f4eff6;border-radius:10px}.progress-track>div{width:0;height:100%;border-radius:10px;background:linear-gradient(90deg,#c8cff0,#d9afd0);transition:width .4s}.profile-tabs{display:flex;border-bottom:1px solid #eee8f1;gap:25px;margin:19px 0 8px}.profile-tabs button{font-size:11px;padding:12px 0;color:#b0a3b7;position:relative;border:0;background:transparent}.profile-tabs button.active{color:#655071}.profile-tabs button.active:after{content:"";position:absolute;height:2px;background:#b5a1c4;bottom:-1px;left:0;right:0}.field{display:grid;grid-template-columns:65px 1fr;align-items:start;gap:8px;border-bottom:1px solid #f5f1f7;padding:10px 0}.field label{font-size:10px;color:#9b8ea3;line-height:24px}.field input,.field textarea{border:1px solid transparent;background:transparent;outline:0;width:100%;padding:3px 5px;font-size:11px;line-height:18px;color:#685b73;border-radius:4px;resize:vertical;min-width:0}.field textarea{min-height:43px}.field input:hover,.field textarea:hover{background:#faf7fc}.field input:focus,.field textarea:focus{border-color:#d9cbe4;background:#fbf8fd}.field input::placeholder,.field textarea::placeholder{color:#cbc0d1}.field.updated{background:#f6f0fa;border-radius:5px}.source-note{display:flex;gap:9px;align-items:center;background:#faf7fc;border-radius:8px;padding:12px;margin-top:17px;font-size:9px;color:#b0a0b9;line-height:1.9;min-height:60px}.source-icon{font-size:22px;color:#bba8c7}.profile-actions{margin-top:19px}.profile-actions .primary{padding:13px 16px;font-size:11px}.profile-actions>.text-button{font-size:10px;margin-top:4px}.save-note{text-align:center;color:#b1a4b8;font-size:9px;line-height:1.8;margin:8px 0 0}.changes{border-top:1px solid #f0eaf3;margin-top:18px;padding-top:13px;font-size:10px;color:#aa9bb2}.changes summary{display:flex;justify-content:space-between;cursor:pointer;list-style:none}.changes summary:before{content:"⌄";margin-right:7px}.changes summary span{margin-left:auto}.change-item{font-size:10px;border-top:1px solid #f1ebf4;padding:10px 0;color:#94829f;line-height:1.8}.change-item small{display:block;font-size:9px;color:#b1a4b8;overflow-wrap:anywhere}.changes>div{padding-top:12px}
dialog{padding:0;border:1px solid #e6deeb;border-radius:18px;width:min(460px,calc(100% - 32px));max-height:88vh;box-shadow:0 35px 100px #26113125;color:var(--ink)}dialog::backdrop{background:#32243c40;backdrop-filter:blur(4px)}.modal{padding:32px;position:relative}.modal.wide{max-height:85vh;overflow:auto}.modal h2{font-size:22px;letter-spacing:1px;font-weight:550;margin:15px 0 10px}.modal>p{font-size:12px;line-height:1.9;color:#998aa3;margin-bottom:24px}.close-button{position:absolute;right:17px;top:14px;border:0;background:transparent;color:#b4a8bd;font-size:24px;width:25px;height:25px}.modal>label:not(.confirm-check){display:block;font-size:11px;color:#8f7f9a;margin-bottom:18px}.modal label>input:not([type=checkbox]),.modal label>select{width:100%;margin-top:8px;border:1px solid #e4dce9;border-radius:7px;padding:11px;font-size:11px;outline:0;background:#fdfbfe;color:var(--ink)}.modal label>input:focus{border-color:#b69ac7}.settings-model{font-size:10px;color:#a091aa;display:flex;justify-content:space-between;gap:8px;margin-bottom:17px}.settings-model strong{font-weight:450;font-size:10px}.modal>.inline-error{color:#af6978;margin:0 0 15px;font-size:11px}.modal .primary.full{justify-content:center}.modal>.save-note{font-size:10px;margin:15px 0 0}.preview-group{margin:20px 0}.preview-group h3{font-weight:500;color:#8d759b;font-size:12px;border-bottom:1px solid #eee7f2;padding-bottom:9px}.preview-row{display:flex;gap:16px;font-size:12px;line-height:1.9;padding:5px 0;overflow-wrap:anywhere}.preview-row>span:first-child{width:70px;flex-shrink:0;color:#a496ad}.confirm-check{display:flex;gap:8px;align-items:center;font-size:12px;color:#7e688c;margin:20px 0}.confirm-check input{accent-color:var(--plum)}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:25px}.toast{position:fixed;bottom:27px;left:50%;transform:translateX(-50%);z-index:10;background:#594766;color:white;border-radius:9px;padding:13px 20px;box-shadow:0 5px 25px #30203c20;font-size:12px;max-width:90%;text-align:center;line-height:1.8}.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}
@media(min-width:1400px){.layout{gap:95px;max-width:1240px;grid-template-columns:minmax(0,1fr) 420px;margin-top:65px}h1{font-size:50px}.voice-card{margin-top:23px}.orb-wrap{height:145px}}
@media(max-width:950px){.topbar{padding:0 28px;height:85px}.layout{gap:30px;grid-template-columns:minmax(0,1fr) 340px;margin-top:35px}h1{font-size:38px}.profile-panel{padding:22px 19px}.header-right{gap:15px}.field{grid-template-columns:61px 1fr}}
@media(max-width:720px){.topbar{height:77px;padding:0 22px}.brand{font-size:17px}.brand-mark{width:36px;height:36px}.brand small{font-size:8px}.header-right{gap:11px}.prototype-badge{font-size:9px;padding:4px}.header-right .text-button{font-size:10px}.layout{display:flex;flex-direction:column;margin:30px auto;padding:0 22px;gap:30px;max-width:560px}.conversation-panel,.profile-panel{width:100%}.profile-panel{position:static;margin:0}h1{font-size:37px;line-height:1.35;margin-top:18px}.intro{font-size:12px}.voice-card{padding:17px 17px 0}.chat{max-height:300px}.modal{padding:28px 24px}.desktop{display:none}.footnote{font-size:9px}.profile-fields{display:grid;grid-template-columns:1fr 1fr;gap:0 15px}.field{display:block;padding:9px 0}.field label{display:block;line-height:20px}.field input{padding-left:0}.field:has(textarea){grid-column:1/-1}.profile-heading h2{font-size:21px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
.realtime-error{margin-top:16px;padding:14px 16px;border:1px solid #dbc8cc;border-radius:14px;background:#fff8f7;color:#684449;font-size:12px}.realtime-error summary{cursor:pointer;font-weight:600}.realtime-error pre{white-space:pre-wrap;overflow-wrap:anywhere;max-height:260px;overflow:auto;line-height:1.7;font-size:11px}.realtime-error p{font-size:11px;line-height:1.6}
.usage-panel{margin-top:16px;border:1px solid #e6e0eb;background:#fbfafc;border-radius:16px;padding:15px 17px}.usage-heading{display:flex;justify-content:space-between;gap:10px;font-size:12px;color:#685773}.usage-heading span:last-child{font-size:10px;color:#93879b}.usage-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:15px 0}.usage-metrics div{display:flex;flex-direction:column;gap:7px}.usage-metrics span{font-size:10px;color:#8d8195}.usage-metrics strong{font-size:17px;color:#544060;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.usage-panel p{font-size:10px;color:#93879b;line-height:1.6;margin:5px 0}.usage-panel a{color:#79618c}@media(max-width:500px){.usage-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}

.login-screen { min-height: 100vh; display: grid; place-items: center; padding: 24px; }
.login-screen[hidden] { display: none; }
.login-screen .modal { width: min(440px, 100%); border-radius: 24px; background: #fff; box-shadow: 0 16px 60px #58456418; }
.login-screen h1 { font-size: 28px; line-height: 1.4; }