:root{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;color:#263e4b;background:#f8f6f1;font-synthesis:none;--blue:#087baa;--muted:#7f8e91;--line:#e8e6df}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:default;opacity:.48}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #69bedd;outline-offset:3px}button{border:0;background:none;color:inherit}a{color:inherit;text-decoration:none}.topbar{height:88px;padding:0 4vw;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:20px}.brand{display:flex;gap:12px;font-size:19px;font-weight:700;align-items:center;min-width:186px}.bell{width:38px;height:38px;border-radius:50%;background:#ebbb55;color:#57421d;display:grid;place-items:center;font-size:12px;box-shadow:inset 0 -4px 0 #dca641;border:3px solid #f4ce79}.brand-sub{display:block;font-size:10px;font-weight:400;letter-spacing:2px;color:var(--muted);margin-top:4px}nav{display:flex;gap:8px}.nav{padding:13px 23px;border-radius:30px;font-size:14px}.nav.active{background:#e4eff1;color:#086f97;font-weight:600}.quiet{font-size:13px;color:#6b7c83;padding:10px 8px}.quiet:hover{color:var(--blue)}.small{font-size:12px;white-space:nowrap}main{max-width:1520px;margin:auto;padding:32px 4vw 0}.intro{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:25px;gap:16px}.eyebrow{font-size:10px;font-weight:600;letter-spacing:2.3px;color:#6d939f;margin:0 0 10px}h1{font-size:clamp(24px,2.4vw,34px);font-weight:600;letter-spacing:1px;margin:0}h2{font-size:26px;font-weight:600;margin:0;letter-spacing:.5px}.edition{font-size:11px;color:#788b8e;white-space:nowrap;padding-bottom:5px}.edition i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#69a795;margin-right:7px}.workspace{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(340px,1fr);gap:24px;align-items:stretch}.stage{min-width:0;position:relative;background:#f1ece3;border-radius:25px;overflow:hidden;display:flex;flex-direction:column;justify-content:center;min-height:570px;height:min(66vw,630px)}.stage-top,.stage-bottom{position:absolute;left:26px;right:26px;display:flex;align-items:center;justify-content:space-between;z-index:1}.stage-top{top:23px}.stage-label{font-size:12px;background:#ffffffc9;padding:8px 14px;border-radius:30px;backdrop-filter:blur(8px)}.stage-count{font-size:10px;letter-spacing:2px;color:#7f8c91;background:#fff9;padding:7px;border-radius:12px}.stage-bottom{bottom:24px;font-size:11px;color:#758689;gap:10px}.stage-bottom>span{background:#f8f6f1db;padding:7px 12px;border-radius:20px}.character-wrap{width:100%;height:100%;display:flex;align-items:center;justify-content:center;transition:transform .3s}.character-wrap img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;transition:opacity .2s}.character-wrap.scene img{object-fit:cover;mix-blend-mode:normal}.character-wrap.speaking{animation:speak-bob .8s ease-in-out infinite}.sound-wave{display:flex;align-items:center;gap:3px;height:20px;background:#f8f6f1db;padding:4px 10px;border-radius:20px}.sound-wave i{width:3px;height:4px;background:#6998a6;border-radius:3px}.sound-wave.playing i{animation:wave .7s ease-in-out infinite alternate}.sound-wave i:nth-child(2){animation-delay:.1s}.sound-wave i:nth-child(3){animation-delay:.3s}.sound-wave i:nth-child(4){animation-delay:.2s}.panel{background:#fffdf9;border:1px solid #ebe8e0;border-radius:25px;padding:26px;display:flex;flex-direction:column;min-width:0;height:min(66vw,630px);min-height:570px}.panel[hidden]{display:none}.panel-heading{display:flex;justify-content:space-between;align-items:center}.mode-switch{display:flex;background:#f0efea;border-radius:11px;margin:20px 0 14px;padding:4px}.mode-switch button{flex:1;padding:9px;font-size:12px;border-radius:8px}.mode-switch button.selected{background:white;color:#126f91;box-shadow:0 2px 6px #263e4b0c}.voice-row{display:flex;align-items:center;gap:8px}.voice-row label{font-size:11px;color:#7d898d;white-space:nowrap}.voice-row select{min-width:0;flex:1;background:transparent;border:0;font-size:12px;color:#486572;padding:6px 0}.micro-copy{font-size:10px;line-height:1.6;color:#929a9b;margin:6px 0 0}.messages{flex:1;min-height:75px;overflow-y:auto;margin:16px -4px 8px;padding:0 4px;scroll-behavior:smooth}.message{margin-bottom:14px;max-width:95%}.message p{font-size:14px;line-height:1.8;background:#edf3f3;border-radius:2px 16px 16px 16px;padding:12px 15px;margin:6px 0 0;white-space:pre-wrap;overflow-wrap:anywhere}.speaker{font-size:10px;color:#87a0a7;margin-left:3px}.message.user{margin-left:auto}.message.user .speaker{display:block;text-align:right}.message.user p{background:#f2eee5;border-radius:16px 2px 16px 16px}.status{font-size:11px;color:#72909b;min-height:22px;line-height:1.5}.status.error{color:#a05a37}.topics{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 12px}.topics button{font-size:11px;padding:7px 10px;border:1px solid #e4e8e7;border-radius:20px;background:#fff}.topics button:hover{border-color:#94c5d6;color:var(--blue)}.input-row{display:flex;background:#f5f5f0;border:1px solid #e7e9e3;border-radius:13px;padding:6px;gap:5px}.input-row input{flex:1;min-width:0;border:0;background:transparent;padding:8px;font-size:12px;color:#345564;outline:none}.input-row input::placeholder{color:#9ca5a3}.input-row button{background:#087fab;color:white;width:34px;height:34px;border-radius:9px;font-size:22px}.bottom-controls{display:flex;align-items:center;justify-content:space-between;margin-top:10px}.mic{flex:1;background:#e9f2f4;color:#117a9d;border-radius:10px;padding:11px;font-size:12px;margin-right:10px;touch-action:none;user-select:none}.mic.recording{background:#d3e9f0;box-shadow:0 0 0 3px #73bad677}.bottom-note{margin-top:5px}.description{font-size:13px;line-height:1.9;color:#869095;margin:16px 0}.catalog{overflow:auto}h3{font-size:12px;margin:12px 0;display:flex;justify-content:space-between;font-weight:600}h3 span{font-size:10px;font-weight:400;color:#a0aaa9}.emotion-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.thumb{padding:0;border:1px solid #e9e7e0;border-radius:12px;overflow:hidden;min-width:0;background:#f6f1e9;text-align:left}.thumb img{display:block;width:100%;aspect-ratio:1;object-fit:cover}.thumb span{display:block;padding:7px 9px;font-size:10px;color:#687c82;background:#fffdf9}.thumb.active{border-color:#368daa;box-shadow:0 0 0 1px #368daa}.scene-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.scene-grid .thumb img{aspect-ratio:1}.view-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.view-grid .thumb img{aspect-ratio:1.5;object-fit:contain}.material-tags{display:flex;gap:7px;margin:0 0 16px;flex-wrap:wrap}.material-tags span{padding:7px 11px;border-radius:20px;background:#f2eee4;color:#928467;font-size:11px}.detail-note{margin-top:20px;padding:15px;border-radius:13px;background:#f4f3ed;color:#809091}.detail-note strong{font-size:12px;font-weight:500}.detail-note p{font-size:11px;line-height:1.8;margin:6px 0 0}.download{display:block;margin-top:16px;font-size:12px;color:#137c9e;padding:6px 0}.emotion-strip{display:flex;gap:22px;align-items:center;padding:22px 0;border-bottom:1px solid var(--line)}.emotion-strip>span{font-size:11px;color:#8b9698;white-space:nowrap}.emotion-strip>div{display:flex;gap:7px;flex-wrap:wrap}.emotion-chip{border:1px solid transparent;border-radius:20px;padding:7px 15px;font-size:11px;color:#71868d}.emotion-chip.active{background:#e5eef0;color:#147e9e;border-color:#d4e5e8}footer{display:flex;justify-content:space-between;padding:17px 0 22px;font-size:10px;color:#a0a7a5;gap:10px}.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}@keyframes speak-bob{50%{transform:translateY(-3px) rotate(.3deg)}}@keyframes wave{to{height:14px}}@media(min-width:1600px){.stage,.panel{height:670px}}@media(max-width:1000px){main{padding:24px 24px 0}.topbar{padding:0 24px}.workspace{grid-template-columns:minmax(0,1fr) minmax(320px,1fr);gap:16px}.panel{padding:20px}.nav{padding:12px 15px}.edition{display:none}.stage,.panel{height:585px}.scene-grid{grid-template-columns:repeat(2,1fr)}.scene-grid .thumb img{aspect-ratio:1.9}.catalog .description{margin:12px 0}.emotion-strip{gap:12px}.emotion-chip{padding:7px 10px}}@media(max-width:720px){.topbar{height:auto;min-height:82px;padding:16px 18px;flex-wrap:wrap;gap:12px}.brand{font-size:16px}.brand-sub{font-size:9px}.topbar nav{order:3;width:100%;justify-content:center}.nav{flex:1;font-size:12px;padding:10px}.topbar>.quiet{font-size:11px}main{padding:22px 16px 0}h1{font-size:23px}.eyebrow{font-size:9px}.workspace{grid-template-columns:1fr}.stage{height:470px;min-height:0}.panel{height:600px;min-height:0}.catalog{height:auto;min-height:530px}.emotion-grid{gap:8px}.scene-grid{grid-template-columns:repeat(4,1fr)}.scene-grid .thumb img{aspect-ratio:1}.emotion-strip{align-items:flex-start}.emotion-strip>span{padding-top:8px}footer{flex-direction:column}.view-grid .thumb img{aspect-ratio:1.6}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;scroll-behavior:auto!important;transition:none!important}}
@media(min-width:721px) and (max-height:850px){.topbar{height:64px}main{padding-top:18px}.intro{margin-bottom:16px}.intro .eyebrow{margin-bottom:7px}h1{font-size:28px}.stage,.panel{height:calc(100svh - 241px);min-height:470px}.panel{padding:18px 22px}.panel-heading h2{font-size:23px}.panel-heading .eyebrow{display:none}.mode-switch{margin:12px 0 7px}.mode-switch button{padding:7px}.micro-copy{font-size:9px}.messages{min-height:50px;margin:10px -4px 5px}.message p{font-size:13px;padding:9px 12px}.topics{margin:4px 0 8px}.topics button{padding:6px 9px}.bottom-controls{margin-top:7px}.mic{padding:9px}.emotion-strip{padding:15px 0}footer{padding:11px 0;font-size:9px}.catalog h2{font-size:23px}.catalog .description{font-size:12px;margin:10px 0}.catalog h3{margin:9px 0}.catalog .detail-note{margin-top:10px;padding:10px}.catalog .material-tags{margin-bottom:7px}.catalog .view-grid .thumb img{aspect-ratio:1.9}.catalog .download{margin-top:9px}.catalog .scene-grid .thumb img{aspect-ratio:1.5}}
.stage-bottom>span{max-width:calc(100% - 54px);line-height:1.6}.character-wrap.scene img{object-fit:contain}.stage:has(.character-wrap.scene){background:#f1ece3}@media(min-width:721px) and (max-height:850px){.catalog .emotion-grid .thumb img{aspect-ratio:1.7;object-fit:contain}}