/* [INPUT]: 保留的明月设计系统与模式状态。
 * [OUTPUT]: 双模式、手机、登录与本人个案侧栏布局。
 * [POS]: 产品样式；不含开发调试界面。
 * [PROTOCOL]: 变更后检查 app/AGENTS.md。
 */

:root{color-scheme:light;--bg:#f7f6f2;--ink:#333c36;--muted:#777d76;--line:#364c401a;--panel:#fbfaf7;--soft:#eeeee7;--button:#354c3e;--on-button:#fffdf6;--focus:#819a80;--ease:cubic-bezier(.22,1,.36,1);font-family:-apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-size:14px;transition:background-color .65s ease,color .45s ease}body[data-mode=case]{color-scheme:dark;--bg:#20242c;--ink:#eee7dc;--muted:#a6a3a3;--line:#e4d9c81b;--panel:#292d35;--soft:#34363d;--button:#e7d7bf;--on-button:#302e2c;--focus:#cbbca4}button,textarea,select{font:inherit;color:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer;border:0;background:none}button:disabled{cursor:default}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--focus);outline-offset:5px}button:disabled{opacity:.35}.hidden,[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.app{height:var(--app-height,100svh);min-height:580px;display:grid;grid-template-rows:100px minmax(0,1fr);isolation:isolate}.topbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 48px;z-index:2}.brand{display:inline-flex;align-items:center;gap:11px;justify-self:start;white-space:nowrap}.brand svg{width:21px;height:21px;stroke:currentColor;fill:none;stroke-width:1}.brand span{font:24px/1 "Songti SC","STSong",serif;letter-spacing:5px}.modes{display:flex;position:relative;gap:4px;padding:4px;background:var(--soft);border-radius:30px;transition:background-color .5s}.modes:before{content:"";position:absolute;inset:4px auto 4px 4px;width:112px;border-radius:24px;background:var(--panel);box-shadow:0 1px 4px #00000006;transform:translateX(0);transition:transform .48s var(--ease),background-color .5s}.case .modes:before{transform:translateX(116px)}.mode-card{position:relative;width:112px;height:38px;padding:0;font-size:12px;letter-spacing:.3px;border-radius:24px;color:var(--muted);transition:color .3s}.mode-card[aria-pressed=true]{color:var(--ink)}.mode-card:disabled{opacity:.5}.mode-card[aria-pressed=true]:disabled{opacity:1}.icon-button{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;color:var(--muted);transition:background-color .2s,color .2s}.icon-button:hover{background:var(--soft);color:var(--ink)}.icon-button svg{width:20px;height:20px;stroke:currentColor;stroke-width:1.4;fill:none;stroke-linecap:round;stroke-linejoin:round}#settings-open{justify-self:end}
main{min-height:0;position:relative;display:flex;flex-direction:column;align-items:center;padding:0 24px 32px}.welcome{flex:1;min-height:0;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding-bottom:40px}.presence{position:relative;width:280px;height:240px;flex:none;display:grid;place-items:center;margin:0 auto 31px;transition:width .7s var(--ease),height .7s var(--ease),margin .7s var(--ease);contain:layout style}.aura{position:absolute;inset:0;background:radial-gradient(ellipse,#d9dcbd40,transparent 64%);filter:blur(21px);transition:opacity .6s;opacity:.8}.light{width:136px;height:142px;border-radius:48% 52% 49% 51% / 46% 48% 52% 54%;position:relative;background:radial-gradient(ellipse at 34% 29%,#fffcdf 2%,#e6e2bd 25%,#bed0b867 66%,#9ebbb654 87%);box-shadow:inset -13px -10px 20px #789b8c2b,0 0 31px #bbc9b53b;filter:blur(3.5px);animation:presence 9s ease-in-out infinite;transition:width .7s var(--ease),height .7s var(--ease),filter .7s}.light:after{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(ellipse at 39% 35%,#fff4d8 3%,#e8c7a365 45%,#b5a1b744 80%);box-shadow:0 0 42px 16px #e5bd9830;opacity:0;transition:opacity .7s}.case .light:after{opacity:1}.case .light{filter:blur(5px)}.case .aura{background:radial-gradient(ellipse,#b9a4be27,transparent 67%)}@keyframes presence{0%,100%{transform:translateY(3px) scale(.97) rotate(-3deg)}50%{transform:translateY(-4px) scale(1.04) rotate(3deg)}}
h1{font:400 35px/1.5 "Songti SC","STSong","Noto Serif CJK SC",serif;letter-spacing:2px;margin:0;text-align:center}.entry-actions{display:flex;flex-direction:column;align-items:center;gap:12px;margin-top:35px}.primary{min-width:160px;height:50px;padding:0 30px;border-radius:28px;color:var(--on-button);background:var(--button);font-size:13px;letter-spacing:1px;transition:background-color .5s,transform .25s var(--ease),opacity .2s}.primary:hover:not(:disabled){transform:translateY(-2px)}.primary:active:not(:disabled){transform:translateY(0) scale(.98)}.primary:disabled{opacity:.5}.text-button{min-height:44px;padding:9px 15px;font-size:12px;color:var(--muted);border-radius:22px;transition:color .2s,background .2s}.text-button:hover:not(:disabled){color:var(--ink);background:var(--soft)}.status-line{position:absolute;bottom:24px;left:24px;right:24px;text-align:center;pointer-events:none;font-size:12px;line-height:1.8;color:var(--muted)}body:not(.live):not(.connecting):not(.ended):not(.failed) .status-line{visibility:hidden}.connecting #start{color:var(--muted);background:var(--soft)}.connecting .light{animation-duration:3s}.connecting #start:before{content:"";display:inline-block;width:11px;height:11px;border:1px solid currentColor;border-right-color:transparent;border-radius:50%;margin-right:9px;vertical-align:-1px;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
.composer{width:100%;max-width:580px;display:flex;align-items:flex-end;gap:12px;padding:14px 14px 14px 21px;border:1px solid var(--line);border-radius:25px;background:var(--panel);transition:border-color .2s,box-shadow .2s;flex:none}.composer:focus-within{border-color:var(--focus);box-shadow:0 0 0 3px color-mix(in srgb,var(--focus) 8%,transparent)}.composer textarea{flex:1;min-width:0;width:100%;min-height:26px;max-height:144px;resize:none;border:0;background:none;outline:none!important;padding:3px 0;font-size:14px;line-height:1.6;overflow-y:auto}.composer textarea::placeholder{color:var(--muted)}#send{flex:none;width:34px;height:34px;display:grid;place-items:center;background:var(--button);color:var(--on-button);border-radius:50%;transition:opacity .2s,transform .2s}#send svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}#send:hover:not(:disabled){transform:translateY(-1px)}#send:disabled{opacity:.23}body:not(.live)[data-input=voice] .composer{display:none}body:not(.live)[data-input=text] .welcome{padding-bottom:0;flex:0;justify-content:end;margin-top:auto}body:not(.live)[data-input=text] .entry-actions{margin-top:24px}body:not(.live)[data-input=text] #start{display:none}body:not(.live)[data-input=text] .composer{margin:20px 0 auto;order:1}body:not(.live)[data-input=text] .entry-actions{order:1}body:not(.live)[data-input=text] .presence{height:210px;margin-bottom:24px}.input-toggle-voice{display:none}body[data-input=text] .input-toggle-voice{display:inline}body[data-input=text] .input-toggle-text{display:none}
.conversation{width:100%;max-width:620px;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--line) transparent;scroll-behavior:smooth;flex:1;padding:14px 20px 24px;mask-image:linear-gradient(transparent,#000 12px,#000 calc(100% - 8px),transparent)}.conversation:empty{display:none}.bubble{font-size:15px;line-height:1.95;margin:0 0 28px;white-space:pre-wrap;overflow-wrap:anywhere;max-width:94%}.bubble small{display:block;color:var(--muted);font-size:10px;letter-spacing:1px;margin-bottom:6px}.bubble.user{margin-left:auto;width:fit-content;max-width:85%;background:var(--soft);padding:12px 18px;border-radius:19px 19px 5px 19px}.bubble.user small{display:none}.bubble.assistant{padding:0 4px}.bubble.enter{animation:message-in .35s var(--ease)}@keyframes message-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}.session-tools{display:none;align-items:center;justify-content:center;gap:8px;flex:none;margin-top:12px}.live .session-tools{display:flex}.live .app{min-height:0}.live main{padding-bottom:18px}.live .welcome{flex:none;padding:0;justify-content:start}.live .presence{height:92px;width:110px;margin:0 auto 6px}.live .light{width:46px;height:49px;filter:blur(2px)}.live .aura{inset:0}.live h1,.live .entry-actions{display:none}.live .status-line{position:static;min-height:25px;font-size:11px;margin:0 0 10px;flex:none}.live .composer{max-width:620px;margin-top:8px}.live[data-agent-state=speaking] .light{animation-duration:2.8s}.live[data-agent-state=thinking] .light{animation-duration:4s}.live .conversation:empty{display:block}.ended .welcome{flex:0 0 auto;min-height:auto;padding:12px 0 20px}.ended .presence{height:90px;width:110px;margin-bottom:8px}.ended .light{width:48px;height:51px}.ended h1{font-size:24px}.ended .entry-actions{margin-top:18px;gap:3px}.ended .status-line{display:none}.ended .conversation{flex:1}.ended .composer{display:none!important}body.ended:not(.live)[data-input=text] .welcome{margin:0;flex:0 0 auto;justify-content:start;padding:12px 0 20px}body.ended:not(.live)[data-input=text] #start{display:block}.ended[data-input=text] .presence{height:90px;margin-bottom:8px}.ended #input-toggle{display:none}
#error:empty{display:none}#error{position:static;flex:none;margin:10px auto 0;max-width:620px;width:100%;padding:14px 20px;border:1px solid var(--line);border-radius:15px;background:var(--panel);color:var(--ink);font-size:12px;line-height:1.7;text-align:center}dialog{margin:auto;border:1px solid var(--line);border-radius:24px;padding:0;background:var(--panel);color:var(--ink);max-width:calc(100vw - 32px);box-shadow:0 24px 100px #00000020}dialog[open]{animation:dialog-in .25s var(--ease)}dialog::backdrop{background:#12171255;backdrop-filter:blur(5px)}@keyframes dialog-in{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}.dialog-head{display:flex;align-items:center;justify-content:space-between;padding:16px 20px 12px;gap:18px}.dialog-head h2{font-size:15px;font-weight:500;margin:0}.dialog-body{padding:4px 24px 24px}#settings-panel{width:390px}.setting-link{width:100%;display:flex;align-items:center;justify-content:space-between;min-height:52px;font-size:13px;text-align:left;padding:0 1px;border-bottom:1px solid var(--line)}.setting-link span{color:var(--muted)}details{margin-top:22px}summary{font-size:12px;color:var(--muted);cursor:pointer;padding:8px 0;list-style:none}summary:after{content:'＋';float:right}details[open] summary:after{content:'−'}.pickers{display:grid;gap:15px;margin-top:18px}.pickers label{font-size:11px;color:var(--muted)}select{display:block;margin-top:7px;width:100%;padding:10px 12px;background:var(--bg);border:1px solid var(--line);border-radius:9px;font-size:13px}#version-note{font-size:11px;line-height:1.8;color:var(--muted);margin:18px 0 0}#recommended-case{padding:12px 0 0;font-size:11px;text-decoration:underline;text-underline-offset:4px;color:var(--muted)}#trace-panel{width:920px;height:calc(100dvh - 64px);max-height:900px}#trace-panel[open]{display:flex;flex-direction:column}#trace{flex:1;min-height:0;border:0;width:100%;background:#f5f6f1}.trace-placeholder{position:absolute;inset:70px 0 0;background:var(--panel);display:grid;place-content:center;text-align:center;color:var(--muted);font-size:13px;line-height:2}.trace-placeholder p{margin:4px 24px}
@media(min-width:1600px){.welcome{padding-bottom:70px}.presence{height:280px;margin-bottom:40px}.light{width:154px;height:160px}h1{font-size:39px}}
@media(max-width:650px){.app{grid-template-rows:90px minmax(0,1fr);min-height:540px}.topbar{padding:0 20px;grid-template-columns:auto 1fr auto;gap:8px}.brand{gap:6px}.brand svg{width:17px;height:17px}.brand span{font-size:21px;letter-spacing:2px}.modes{justify-self:center;padding:3px;gap:2px}.modes:before{inset:3px auto 3px 3px;width:86px}.case .modes:before{transform:translateX(88px)}.mode-card{width:86px;height:36px;font-size:11px}#settings-open{width:44px;height:44px}main{padding:0 24px 28px}.welcome{padding-bottom:34px}.presence{width:230px;height:210px;margin-bottom:26px}.light{width:122px;height:128px}h1{font-size:28px;letter-spacing:1px}.entry-actions{margin-top:30px;gap:8px}.primary{height:49px;min-width:154px}.live .topbar{padding-top:0}.live .presence{height:75px}.live main{padding:0 18px 12px}.live .status-line{margin-bottom:3px}.conversation{padding:12px 3px 20px}.bubble{font-size:14px;max-width:97%;margin-bottom:24px}.bubble.user{max-width:88%}.composer{padding:12px 12px 12px 17px;border-radius:23px}.composer textarea{font-size:16px}.session-tools{margin-top:6px}.text-button{font-size:12px}.status-line{bottom:20px}.dialog-head{padding:13px 16px}.dialog-body{padding:0 22px 24px}#trace-panel{height:calc(100dvh - 24px);max-width:calc(100vw - 16px);border-radius:20px}.ended .presence{height:64px}.ended .entry-actions{margin-top:12px}.ended .welcome{padding-top:0}.ended h1{font-size:23px}}
@media(max-width:360px){.topbar{padding:0 13px;gap:3px}.brand svg{display:none}.brand span{font-size:20px}.mode-card{width:82px}.modes:before{width:82px}.case .modes:before{transform:translateX(84px)}h1{font-size:26px}}
@media(max-height:650px){.app{grid-template-rows:74px minmax(0,1fr);min-height:450px}.presence{height:145px;margin-bottom:18px}.light{width:100px;height:104px}.welcome{padding-bottom:20px}.entry-actions{margin-top:22px}.live .presence{height:50px}.live .light{width:31px;height:34px}body:not(.live)[data-input=text] .presence{height:145px}.session-tools{margin-top:3px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.voice-choice{width:220px;margin:0 auto 18px;text-align:center}.voice-choice label,.voice-choice small{font-size:11px;color:var(--muted)}.voice-choice select{margin:6px 0;background:transparent;padding:8px 12px}.live .voice-choice{display:none}
#case-history{position:absolute;left:25px;top:110px;width:180px;max-height:calc(100svh - 140px);overflow:auto;z-index:3;padding:15px;border:1px solid var(--line);border-radius:18px;background:var(--panel)}#case-history h2{font-size:13px;font-weight:500;margin-top:0}#case-list button{display:block;width:100%;text-align:left;padding:12px 0;border-bottom:1px solid var(--line);font-size:12px;color:var(--muted)}#new-case{margin-top:12px}body[data-mode=case] main{padding-left:220px}#login-panel{width:390px}#login-form{padding-top:24px}#login-form h2{font:24px "Songti SC",serif}#beta-code{display:block;width:100%;margin:12px 0;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink);font:inherit}#login-error{font-size:12px;color:var(--muted);min-height:18px}.history-view .composer{display:none!important}@media(max-width:1000px){#case-history{position:static;width:auto;max-height:145px;margin:0 18px 12px}body[data-mode=case] .app{grid-template-rows:90px auto minmax(0,1fr)}body[data-mode=case] main{padding-left:24px}}
