/* Claude-style chat: no per-message avatars/labels, user bubbles right, one working orb */
#msgs .turn.mirae .avatar, #msgs .turn.user .avatar { display:none !important; }
#msgs .turn .who { display:none !important; }
#msgs .turn.user { display:flex; justify-content:flex-end; margin:14px 0; }
#msgs .turn.user .body { max-width:74%; }
#msgs .turn.user .text { background:var(--panel-2); border:1px solid var(--edge); border-radius:17px 17px 5px 17px; padding:11px 16px; color:var(--frost); }
#msgs .turn.mirae { display:flex; justify-content:flex-start; margin:14px 0; }
#msgs .turn.mirae .body { max-width:82%; }
#msgs .turn.mirae .text { padding:2px 0; line-height:1.55; color:var(--frost); }
/* the single working indicator keeps its orb + pulse */
#msgs .turn.thinking { display:flex !important; align-items:center; gap:12px; }
#msgs .turn.thinking .avatar { display:flex !important; height:34px; width:34px; }
#msgs .turn.thinking .text { color:var(--haze); }
@keyframes miraePulse { 0%,100%{opacity:.45} 50%{opacity:1} }
#msgs .turn.thinking .avatar { animation:miraePulse 1.3s ease-in-out infinite; }
/* Claude-style thinking: orange spinner + Thinking + timer */
#msgs .turn.thinking .avatar video { display:none !important; }
#msgs .turn.thinking .avatar { height:26px !important; width:26px !important; position:relative; animation:none !important; background:transparent !important; box-shadow:none !important; }
#msgs .turn.thinking .avatar::before { content:"\2733"; color:var(--orange); font-size:23px; line-height:26px; position:absolute; inset:0; text-align:center; animation:miraeSpin 1.05s linear infinite; }
@keyframes miraeSpin { to { transform:rotate(360deg); } }
#msgs .turn.thinking .text { color:var(--haze) !important; }
/* fix mic + caret sitting side by side */
.composer .micwrap { display:inline-flex !important; align-items:center; gap:1px; height:34px; }
.composer .micwrap #micbtn { flex:none; }
/* sophisticated hover states */
.nav a, .tab, .iconbtn, .queuebtn, .send, #history-wrap a, .metric, .plusmenu a, .menu a { transition: background .18s ease, border-color .18s ease, transform .16s ease, box-shadow .2s ease, color .16s ease; }
.nav a:hover { background: rgba(255,255,255,.06); }
.iconbtn:hover { background: var(--panel-2); border-color: var(--edge-strong); }
.queuebtn:hover { transform: translateY(-1px); box-shadow: 0 4px 14px rgba(0,0,0,.4); }
.tab:hover { background: rgba(255,255,255,.05); }
#history-wrap a:hover { transform: translateY(-2px) scale(1.04); box-shadow: 0 8px 22px rgba(0,0,0,.55); border-color: var(--edge-strong); z-index:2; }
.plusmenu a:hover, .menu a:hover { background: rgba(255,255,255,.06); }
.brand .mark { transition: filter .3s ease, transform .3s ease; }
.brand:hover .mark { transform: scale(1.06); filter: brightness(1.25); }
.studio-pane .gallery { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin-top:14px; }