@import"https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;600;700&family=Nunito:wght@600;700;800&display=swap";:root{--bg-top: #f7efe5;--bg-bottom: #dbe9f6;--surface: rgba(13, 21, 34, .65);--surface-line: rgba(255, 255, 255, .28);--text: #f8fbff;--muted-text: rgba(238, 244, 255, .75);--warning: #ffd27d;--error: #ff9ba8;--success: #a9efc4;font-family:Nunito,Noto Sans JP,Hiragino Sans,sans-serif;line-height:1.45;font-weight:400;color:var(--text);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}*:before,*:after{box-sizing:border-box}html,body,#root{margin:0;width:100%;min-height:100%}body{min-width:320px;min-height:100svh;overflow:hidden;background:radial-gradient(circle at 20% 10%,#fff6db 0%,transparent 42%),linear-gradient(160deg,var(--bg-top),var(--bg-bottom));background-image:url(/img/bg-02.webp);background-position:center;background-size:cover;background-repeat:no-repeat}body:before{content:"";position:fixed;inset:0;pointer-events:none;background-image:url(/img/noise.png);background-size:300px 300px;opacity:.06;animation:grain 1.8s steps(8) infinite;z-index:1}@keyframes grain{0%{background-position:0 0}to{background-position:100% 100%}}#root{isolation:isolate;position:relative;min-height:100svh}button,input{border:none;font:inherit;color:inherit}button{cursor:pointer}button:hover:not(:disabled){filter:brightness(1.08)}button:disabled{opacity:.45;cursor:not-allowed}code{background:#080a1180;border:1px solid rgba(255,255,255,.14);border-radius:6px;padding:.05rem .35rem}img{max-width:100%}p,dl,dd,h1,h2,h3,h4{margin:0}.app-shell{position:relative;min-height:100svh;color:var(--text)}.character-stage{position:fixed;inset:0;z-index:0;overflow:hidden}.character-view{width:100%;height:100%;position:relative}.character-view .character-canvas{width:100%;height:100%;display:block}.character-error-banner{position:absolute;top:1rem;left:1rem;right:1rem;padding:.6rem .8rem;border:1px solid #ff8f98;border-radius:10px;background:#560c1cb8;color:#ffd2d2;font-weight:700;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.top-bar{position:fixed;left:clamp(.6rem,2vw,1rem);right:clamp(.6rem,2vw,1rem);top:0;z-index:3;padding:.85rem clamp(.9rem,2vw,1.25rem);pointer-events:none;display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:.6rem}.top-title,.top-status-group{pointer-events:auto}.top-title{display:grid;gap:.15rem}.top-title .eyebrow{font-size:.68rem;letter-spacing:.24em;font-weight:800;opacity:.75}.top-title h1{font-size:clamp(1rem,2vw,1.2rem);margin:0;font-weight:800;white-space:nowrap}.top-status-group{display:flex;gap:.45rem;flex-wrap:wrap;justify-content:flex-end}.top-status{margin:0;padding:.35rem .7rem;border-radius:999px;font-size:.75rem;font-weight:700;border:1px solid transparent;background:#0a0e1aa6}.top-status.connected{border-color:#7affc380;color:#9dffe0}.top-status.connecting{border-color:#ffda8c8f;color:#ffd96f}.top-status.disconnected{border-color:#ff9fb58f;color:#ffd4de}.top-status-ready,.top-status.error{border-color:#ffffff4d}.menu-button{pointer-events:auto;background:#0b1220a6;color:#fff;border-radius:999px;padding:.45rem .85rem;border:1px solid rgba(255,255,255,.28);font-weight:700;white-space:nowrap;justify-self:end}.loading-overlay{position:fixed;inset:0;display:grid;place-items:center;background:linear-gradient(180deg,#060b146b,#060b149e);z-index:20;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.loading-panel{width:min(320px,calc(100% - 2rem));border-radius:14px;background:#111826b8;border:1px solid rgba(255,255,255,.22);padding:1.15rem;display:grid;justify-items:center;gap:.75rem;box-shadow:0 24px 50px #00000059}.loading-ring{width:44px;height:44px;border-radius:50%;border:4px solid rgba(255,255,255,.2);border-top-color:#ff7f91;animation:spin .85s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.start-popup{position:fixed;inset:0;z-index:25;display:grid;place-items:center;padding:1rem;background:#070a1280;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.start-popup-card{width:min(420px,calc(100% - 2rem));text-align:center;background:#ffffffed;color:#1d2939;border-radius:18px;padding:1.35rem 1.2rem 1.2rem;box-shadow:0 18px 45px #00000059}.start-popup-card h2{margin-bottom:.5rem;color:#5a2e8f}.start-popup-card p{margin:.35rem 0 1rem;color:#38445a}.start-popup-card button{width:100%;border:none;border-radius:999px;background:linear-gradient(120deg,#ff6d87,#ff5bc3 90%);color:#fff;font-weight:700;padding:.85rem 1rem}.chat-dock{position:fixed;left:0;right:0;bottom:max(.7rem,env(safe-area-inset-bottom));width:min(760px,calc(100% - .8rem));margin-inline:auto;z-index:4;display:grid;gap:.55rem;background:#080e1985;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);border:1px solid rgba(255,255,255,.18);border-radius:16px;padding:.75rem;box-shadow:0 12px 34px #04081361}.subtitle-overlay{position:fixed;left:50%;transform:translate(-50%);bottom:calc(max(.7rem,env(safe-area-inset-bottom)) + 132px);width:min(760px,calc(100% - .8rem));z-index:3;display:grid;justify-items:center;pointer-events:none}.subtitle-text{margin:0;padding:.55rem .85rem;border-radius:12px;border:none;background:none;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;text-shadow:0 1px 1px rgba(0,0,0,.2);color:#f7f8ff;max-width:100%;text-align:center;font-size:clamp(.94rem,2vw,1.1rem);line-height:1.45;font-weight:700;overflow-wrap:anywhere}.control-area{display:grid;gap:.55rem}.microphone-control{display:flex;flex-wrap:wrap;gap:.55rem;align-items:center}.microphone-action{width:42px;height:42px;border-radius:999px;padding:0;display:inline-grid;place-items:center;background:linear-gradient(110deg,#3d4b6d,#55638a);color:#fff;font-weight:700}.microphone-action.starting{background:linear-gradient(110deg,#6b7396,#8196bb)}.microphone-action.on{background:linear-gradient(110deg,#ff5f7a,#ff9a79)}.microphone-action-icon{width:22px;height:22px;fill:none;stroke:currentColor}.microphone-action.starting .microphone-action-icon{animation:spin .9s linear infinite}.microphone-state{margin:0;font-size:.82rem;opacity:.9}.text-form{display:flex;gap:.55rem;align-items:stretch}.text-form input{flex:1;padding:.62rem .75rem;border-radius:10px;border:1px solid rgba(255,255,255,.22);background:#fffffff2;color:#111827}.text-form button{border-radius:12px;min-width:84px;background:#fff;color:#3a4665;font-weight:700}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;white-space:nowrap}.menu-backdrop{position:fixed;inset:0;z-index:15;border:0;background:#06091073}.slide-menu{position:fixed;z-index:16;top:0;right:0;width:min(360px,86vw);height:100svh;overflow-y:auto;padding:.9rem;background:linear-gradient(180deg,#fcfffffa,#eff4ffeb);color:#20294a;display:grid;gap:.65rem}.menu-head,.menu-section{border:1px solid #edf0f7;border-radius:12px;padding:.7rem;background:#ffffffd1}.menu-head{display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:1}.menu-close{border-radius:999px;border:1px solid #dce3f3;padding:.45rem .72rem;background:#fff}.menu-section h3{margin-bottom:.55rem;padding-bottom:.42rem;border-bottom:1px solid #e8e8f2}.menu-user{display:grid;gap:.4rem}.menu-avatar{width:52px;height:52px;border-radius:50%;border:2px solid #fff;box-shadow:0 6px 18px #2b35543d}.menu-user-name,.menu-user-email{margin:0;overflow-wrap:anywhere}.menu-user-name{font-weight:800;font-size:.98rem}.menu-user-email{color:#52607f;font-size:.86rem}.menu-section button{margin-top:.4rem;border-radius:10px;padding:.55rem .8rem;border:1px solid #dce2f2;background:#fff}.menu-section button+button{margin-top:.45rem}.menu-field{display:grid;gap:.35rem;margin-bottom:.5rem;font-weight:700;font-size:.84rem}.menu-field input{width:100%;border:1px solid #dce2f2;border-radius:10px;padding:.52rem .64rem;background:#fff;color:#1b2a4a}.connection-status{margin-top:.52rem;margin-bottom:.52rem;display:inline-block;border:1px solid #dce2f2;padding:.4rem .55rem;border-radius:999px;background:#f4f7ff}.connection-status.connecting{color:#7a5f00}.connection-status.connected{color:#0b8f56}.connection-status.disconnected{color:#8a1430}.session-box{margin-top:.4rem;border:1px solid #eceff7;border-radius:10px;padding:.5rem;background:#f7f8fc;display:grid;gap:.3rem;font-size:.74rem}.session-box p{margin:0;overflow-wrap:anywhere}.session-json{max-height:90px;overflow:auto;padding:.45rem;border-radius:8px;background:#101828;color:#f2f4ff;font-size:.7rem}.menu-list{max-height:250px;overflow:auto;display:grid;gap:.45rem}.menu-list p{margin:0;padding:.45rem .55rem;border:1px solid #edf0f7;border-radius:8px;display:grid;gap:.22rem;background:#fff;overflow-wrap:anywhere}.menu-message,.menu-log,.menu-queue-item{font-size:.76rem}.menu-message.user,.menu-log.user{border-color:#a7cbffc2;background:#eff6ff}.menu-message.assistant,.menu-log.assistant{border-color:#f2bcd6d9;background:#fff1f8}.menu-log.error{border-color:#ffbac5;background:#fff4f8}.menu-empty{margin:0;color:#66718c}.queue-mini{display:grid;gap:.35rem}.menu-queue-item{display:flex;gap:.45rem;align-items:baseline}.menu-queue-item span:first-child{min-width:4.3rem;font-weight:800}.menu-queue-item.downloading,.menu-queue-item.ready,.menu-queue-item.playing,.menu-queue-item.completed,.menu-queue-item.error{border-left:4px solid #a2c9ff}.menu-queue-item.playing{border-left-color:#ff7f9a}.menu-queue-item.completed{border-left-color:#73d69b}.menu-queue-item.error{border-left-color:#ff4f66}@media(max-width:760px){.top-bar{grid-template-columns:1fr auto;row-gap:.35rem;column-gap:.4rem}.top-status-group{display:none}.chat-dock{width:calc(100% - .8rem);bottom:.55rem}.subtitle-overlay{bottom:calc(max(.55rem,env(safe-area-inset-bottom)) + 132px)}.slide-menu{width:100%}.microphone-control{justify-content:space-between}.text-form{display:grid;grid-template-columns:1fr auto}}@media(min-width:1200px){.menu-section{border-radius:14px}.chat-dock{width:min(780px,58vw);bottom:1rem}}
