:root{--pad:clamp(12px,1.8vw,20px);--w:min(860px,88vw);--muted:rgba(210,240,255,.16);--line:rgba(190,230,255,.24);}
*{box-sizing:border-box}
html,body{height:100%;margin:0;color:#cfe7ff;background:
  radial-gradient(1200px 600px at 50% -20%,rgba(120,180,230,.12),transparent 60%),
  linear-gradient(180deg,#0a161d 0%,#0a1218 100%);
font:16px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI","Hiragino Sans","Noto Sans JP",sans-serif}
#app{min-height:100svh}
.nav{display:flex;align-items:center;justify-content:space-between;padding:var(--pad)}
.brand{margin:0;font-weight:600;opacity:.85;font-size:clamp(18px,2vw,22px);letter-spacing:.02em}
.chips button{padding:.45em .9em;margin-left:.5em;border:1px solid var(--muted);border-radius:999px;background:transparent;color:#cfe7ff;backdrop-filter:blur(4px)}
#stage{position:relative;display:grid;place-items:center;padding:min(8vh,80px) var(--pad)}
#core{position:absolute;width:min(420px,45vw);height:min(220px,24vw);border-radius:50% 50% 48% 52% / 40% 55% 45% 60%;
  background:radial-gradient(50% 65% at 50% 45%,rgba(180,220,255,.86),rgba(160,200,255,.22) 40%,rgba(40,70,120,0) 70%);
  filter:blur(10px) drop-shadow(0 12px 60px rgba(90,150,220,.25));animation:breathe 6s ease-in-out infinite;transform:translateY(-18px)}
@keyframes breathe{0%,100%{scale:1;opacity:.92}50%{scale:1.06;opacity:1}}
#voice{position:relative;margin-top:180px;width:var(--w);max-width:92vw;padding:.6em .9em;border-radius:12px;border:1px solid var(--line);
  background:rgba(150,210,255,.08);backdrop-filter:blur(8px);box-shadow:0 8px 30px rgba(30,80,120,.2)}
#chat{position:sticky;bottom:0;padding:12px var(--pad) 18px}
#f{display:flex;gap:.6em;width:var(--w);max-width:92vw;margin:0 auto}
#i{flex:1;padding:.7em 1em;border-radius:14px;border:1px solid var(--muted);background:rgba(130,200,255,.04);color:#dff}
#send{padding:.5em .8em;border-radius:12px;border:1px solid var(--muted);background:transparent;color:#dff}
.note{display:block;opacity:.4;font-size:12px;text-align:left;width:var(--w);max-width:92vw;margin:6px auto 0}
/* モバイルでコアと発話が重ならない調整 */
@media (max-width:640px){#voice{margin-top:140px}#core{width:min(70vw,380px);height:min(38vw,200px)}}