/* Glass surfaces and audio cards.
   Sound gets a compact square card (art + waveform + player) instead of a
   video-shaped box; generation cards, the model picker and voice gallery use
   one frosted-glass recipe so they stop reading as flat dark slabs. */
:root{
  --glass-bg:linear-gradient(155deg,rgba(150,180,255,.16),rgba(120,140,220,.07) 45%,rgba(90,110,200,.05));
  --glass-bg-strong:linear-gradient(155deg,rgba(160,190,255,.2),rgba(110,130,230,.1) 50%,rgba(80,100,200,.08));
  --glass-edge:rgba(200,220,255,.2);
  --glass-hi:inset 0 1px 0 rgba(255,255,255,.18),inset 0 0 0 1px rgba(255,255,255,.04);
  --glass-shadow:0 24px 60px -28px rgba(0,0,0,.7);
  --glass-blur:blur(22px) saturate(160%);
}

/* ---- audio in the chat and in Creations ---- */
.ag-msg.run.is-audio .ag-res{width:min(100%,300px);aspect-ratio:auto;align-self:flex-start}
#agent.vw-enabled .ag-results .ag-msg.run.is-audio{max-width:340px}
#agent.vw-enabled .ag-results .ag-msg.run.is-audio .ag-res{width:100%;background:var(--glass-bg);border:1px solid var(--glass-edge);box-shadow:var(--glass-hi),var(--glass-shadow);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur)}
.ag-msg.run.is-audio .vaia-generating{aspect-ratio:1/1!important;width:100%!important;max-width:340px}
.ag-audio{display:flex;flex-direction:column;gap:12px;padding:16px}
.ag-audio-art{position:relative;display:grid;place-items:center;aspect-ratio:1/1;border-radius:16px;overflow:hidden;
  background:radial-gradient(circle at 50% 38%,rgba(120,170,255,.28),transparent 62%),linear-gradient(160deg,rgba(255,255,255,.08),rgba(255,255,255,.02))}
.ag-wave{position:absolute;left:12%;right:12%;bottom:14%;height:26%;display:flex;align-items:center;justify-content:space-between;gap:3px}
.ag-wave b{flex:1;border-radius:3px;background:linear-gradient(180deg,#9fd0ff,#6f8bff);opacity:.85;height:30%;animation:agwave 1.6s ease-in-out infinite}
.ag-wave b:nth-child(3n){animation-delay:-.4s}.ag-wave b:nth-child(3n+1){animation-delay:-.9s}.ag-wave b:nth-child(4n){animation-delay:-1.2s}
@keyframes agwave{0%,100%{height:22%}50%{height:100%}}
@media (prefers-reduced-motion:reduce){.ag-wave b{animation:none;height:60%}}
.ag-audio audio{width:100%;height:40px}
.ag-audio .ghost{align-self:flex-start}

/* ---- generation cards: frosted, not black ---- */
#agent.vw-enabled .ag-results .ag-res,
.sg-panel-run,.sg-item.is-bad{background:var(--glass-bg)!important;border:1px solid var(--glass-edge)!important;
  box-shadow:var(--glass-hi),var(--glass-shadow)!important;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur)}
.sg-panel-run .sgp-media{background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.02))!important;border-radius:16px}
.vaia-generating{background:radial-gradient(ellipse at 50% 40%,rgba(130,170,255,.2),transparent 70%),linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.015))!important}

/* ---- model picker (Studio) ---- */
.sc-dlgbox{background:var(--glass-bg-strong),rgba(18,22,40,.62)!important;border:1px solid var(--glass-edge)!important;
  box-shadow:var(--glass-hi),0 40px 100px -40px rgba(0,0,0,.85)!important;-webkit-backdrop-filter:blur(28px) saturate(170%);backdrop-filter:blur(28px) saturate(170%)}
.sc-mtabs{flex:none;display:flex;gap:6px;overflow-x:auto;padding:2px 2px 10px;margin:0 0 4px;scrollbar-width:none}
.sc-mtabs::-webkit-scrollbar{display:none}
.sc-mtabs button{flex:none;min-height:36px;padding:0 14px;border-radius:99px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);color:var(--muted,#b8c2d8);font:600 13px var(--sans,system-ui);white-space:nowrap;cursor:pointer}
.sc-mtabs button:hover{background:rgba(255,255,255,.1);color:#fff}
.sc-mtabs button[aria-selected="true"]{background:linear-gradient(160deg,rgba(255,255,255,.22),rgba(255,255,255,.08));color:#fff;border-color:rgba(255,255,255,.28);box-shadow:inset 0 1px 0 rgba(255,255,255,.25)}
.sc-mtabs button i{font-style:normal;opacity:.6;margin-left:6px;font-weight:500}

/* ---- voice gallery ---- */
.vx-voices{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px}
.vx-voice{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:16px;background:var(--glass-bg);border:1px solid var(--glass-edge);box-shadow:var(--glass-hi);text-align:left;color:inherit;cursor:pointer;min-width:0}
.vx-voice:hover{border-color:rgba(200,220,255,.36)}
.vx-voice.on{border-color:#7fb3ff;box-shadow:var(--glass-hi),0 0 0 2px rgba(127,179,255,.35)}
.vx-voice-play{flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;border:0;background:linear-gradient(160deg,#7cc4ff,#4d7bff);color:#fff;cursor:pointer}
.vx-voice-play[aria-pressed="true"]{background:linear-gradient(160deg,#ffb36b,#ff6f61)}
.vx-voice-play:disabled{opacity:.5;cursor:progress}
.vx-voice span{display:flex;flex-direction:column;min-width:0}
.vx-voice b{font:650 14px var(--sans,system-ui);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vx-voice small{font-size:12px;color:var(--muted,#aab4ca);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vx-voicebar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:8px 0 2px}
.vx-voicebar .ghost{min-height:34px;padding:0 12px;border-radius:12px;font-size:13px}
.vx-voicebar em{font-style:normal;color:var(--muted,#aab4ca);font-size:13px}
.vx-voicefilter{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 10px}
.vx-voicefilter input{flex:1;min-width:160px;min-height:38px;padding:0 12px;border-radius:12px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05);color:inherit;font:500 14px var(--sans,system-ui)}
.sc-dlg{background:rgba(6,8,18,.42)!important;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.sc-dlgbox .sc-mrow:hover,.sc-dlgbox .sc-mrow:focus-visible{background:rgba(255,255,255,.08)}
.sc-dlgbox .sc-mrow.on{background:linear-gradient(160deg,rgba(255,255,255,.16),rgba(255,255,255,.05));border-color:rgba(200,220,255,.3)}
.sc-dlgbox .sc-search{background:rgba(255,255,255,.06)!important;border-color:rgba(255,255,255,.14)!important}
.sc-dlgbox{min-width:0;max-width:100%;box-sizing:border-box}.sc-dlgbox>*{min-width:0;max-width:100%}

/* ---- the Vaia chat: frosted glass over the galaxy, not a dark slab ----
   One light-tinted pane, a bright rim and an inner highlight; everything on it
   (messages, plan cards, composer, chips, Creations) is a thinner layer of the
   same glass, so the aurora behind keeps showing through. */
#agent#agent.ag-inline,#agent#agent.vw-enabled,
#v-home.agent-workspace #cgchatpanel.vw-host #agent#agent.vw-enabled{
  background:linear-gradient(150deg,rgba(255,255,255,.13),rgba(190,205,255,.06) 40%,rgba(150,170,255,.05) 70%,rgba(255,255,255,.09))!important;
  border:1px solid rgba(220,230,255,.22)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),inset 0 0 0 1px rgba(255,255,255,.04),inset 0 -40px 80px -60px rgba(140,170,255,.25),0 40px 120px -50px rgba(10,6,40,.9)!important;
  -webkit-backdrop-filter:blur(30px) saturate(175%)!important;backdrop-filter:blur(30px) saturate(175%)!important}
#agent#agent.vw-enabled>.ag-results{background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.02))!important;border-left:1px solid rgba(220,230,255,.14)}
#agent#agent .ag-head{background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,0))!important;border-bottom-color:rgba(220,230,255,.12)!important}
#agent#agent .ag-comp,#v-home.agent-workspace #agent#agent.vw-enabled .ag-comp{background:linear-gradient(0deg,rgba(255,255,255,.06),rgba(255,255,255,0))!important;border-top:1px solid rgba(220,230,255,.1)!important}
/* the composer: a glass pill that keeps its coloured rim */
#agent#agent .ag-row{background:linear-gradient(160deg,rgba(255,255,255,.16),rgba(255,255,255,.06))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 12px 34px -18px rgba(0,0,0,.6)!important;-webkit-backdrop-filter:blur(16px) saturate(160%);backdrop-filter:blur(16px) saturate(160%)}
#agent#agent .ag-row textarea::placeholder{color:rgba(235,240,255,.62)}
/* messages */
#agent#agent .ag-msg.you p{background:linear-gradient(160deg,rgba(120,175,255,.42),rgba(80,120,255,.26))!important;border:1px solid rgba(190,215,255,.3);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 8px 22px -14px rgba(40,80,255,.7);color:#fff}
#agent#agent .ag-plan,#agent#agent .vaia-choice{background:linear-gradient(160deg,rgba(255,255,255,.13),rgba(255,255,255,.05))!important;border:1px solid rgba(220,230,255,.22)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 16px 36px -24px rgba(0,0,0,.7)!important}
/* chips and small buttons on the glass */
#agent#agent :is(.ag-head button:not(#agx):not(#agcontacts):not(#agmore),.ag-say,.ag-suggest,.ag-composer-tools>button,#agstrengthtoggle,#aglim,.ag-opt,.ag-plan .ghost,.vx-voicebar .ghost,.ag-res~.ghost,.ag-bub>.ghost){
  background:linear-gradient(160deg,rgba(255,255,255,.15),rgba(255,255,255,.06))!important;border:1px solid rgba(220,230,255,.2)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.2)!important;color:#eef2ff!important}
#agent#agent :is(.ag-head button:not(#agx):not(#agcontacts):not(#agmore),.ag-say,.ag-suggest,.ag-composer-tools>button,#agstrengthtoggle,#aglim,.ag-opt,.ag-plan .ghost,.vx-voicebar .ghost):hover{background:linear-gradient(160deg,rgba(255,255,255,.22),rgba(255,255,255,.1))!important}
#agent#agent .ag-opt.on{border-color:rgba(150,200,255,.6)!important}
/* popovers that open from the composer */
#agent#agent :is(#agstrengthpopover,#agbudget){background:linear-gradient(160deg,rgba(60,70,120,.72),rgba(30,34,70,.78))!important;border:1px solid rgba(220,230,255,.24)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 30px 70px -30px rgba(0,0,0,.8)!important;-webkit-backdrop-filter:blur(24px) saturate(170%);backdrop-filter:blur(24px) saturate(170%)}
/* text stays readable on the lighter glass */
#agent#agent .ag-msg.orb .ag-bub>p{color:#f4f6ff;text-shadow:0 1px 2px rgba(0,0,0,.25)}
#agent#agent :is(.ag-runmeta,.ag-head small,.ag-head .ag-sub){color:rgba(225,232,255,.72)!important}

/* phones: the pane stays translucent but skips the live blur (it costs too much there) */
@media (max-width:760px){
  #agent#agent.ag-inline,#agent#agent.vw-enabled,#v-home.agent-workspace #cgchatpanel.vw-host #agent#agent.vw-enabled{
    background:transparent!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}   /* the stars show through */
}
@media (prefers-reduced-transparency:reduce){
  #agent#agent.ag-inline,#agent#agent.vw-enabled{background:#262b45!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
}
@media (max-width:760px){
  /* phone header: frosted circles and a frosted Vaia pill */
  #v-home#v-home.agent-workspace #agent#agent .ag-head :is(#agcontacts,.ag-more),
  #v-home#v-home.agent-workspace #agent#agent .ag-head :is(.ag-avatar,.ag-ttl){
    background:linear-gradient(160deg,rgba(255,255,255,.2),rgba(255,255,255,.07))!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.3),inset 0 0 0 1px rgba(220,230,255,.16),0 10px 24px -14px rgba(0,0,0,.7)!important}
  #v-home#v-home.agent-workspace #agent#agent .ag-head .ag-avatar{box-shadow:inset 0 1px 0 rgba(255,255,255,.3),inset 1px 0 0 rgba(220,230,255,.16),inset 0 -1px 0 rgba(220,230,255,.1)!important}
  #v-home#v-home.agent-workspace #agent#agent .ag-head .ag-ttl{box-shadow:inset 0 1px 0 rgba(255,255,255,.3),inset -1px 0 0 rgba(220,230,255,.16),inset 0 -1px 0 rgba(220,230,255,.1)!important}
  #v-home#v-home.agent-workspace #agent#agent .ag-head .ag-head-menu{background:linear-gradient(160deg,rgba(70,80,130,.82),rgba(36,40,80,.88))!important;border:1px solid rgba(220,230,255,.22)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 24px 50px -20px #000d!important}
  #agent#agent.vw-enabled.vw-has-results:not(.vw-panel)>.ag-workspace-tabs{background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.02))!important}
  #agent#agent.vw-enabled .ag-workspace-tabs button{background:rgba(255,255,255,.07)!important;border:1px solid rgba(220,230,255,.12)!important}
  #agent#agent.vw-enabled .ag-workspace-tabs button[aria-pressed=true]{background:linear-gradient(160deg,rgba(255,255,255,.24),rgba(255,255,255,.09))!important;color:#fff!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.3)}
}
/* a crew card in the chat: faces overlapping in one row, then who's on it */
.ag-team.ag-crew{display:grid!important;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px}
.ag-team.ag-crew .ag-crew-faces{display:flex!important;flex-direction:row!important;align-items:center;width:auto!important}
.ag-team.ag-crew .ag-crew-faces .ag-team-face{width:34px;height:34px;display:grid;place-items:center;margin-left:-10px;border-radius:50%;background:rgba(255,255,255,.08);box-shadow:0 0 0 2px rgba(20,24,44,.8)}
.ag-team.ag-crew .ag-crew-faces .ag-team-face:first-child{margin-left:0}
.ag-team.ag-crew p{margin:3px 0 0;font-size:12.5px;color:rgba(225,232,255,.78)}
@media (max-width:560px){.ag-team.ag-crew{grid-template-columns:auto minmax(0,1fr)}.ag-team.ag-crew>button{grid-column:1/-1;justify-self:start}}

/* ---- a creation sits in a frame that fits it: the frame has the rounded
   corners and a little breathing room, the picture keeps its real shape and
   is never cropped. Tap it to see it full screen. ---- */
#agent#agent .ag-msg.run:not(.is-audio) .ag-bub{width:auto;max-width:100%;align-items:flex-start}
#agent#agent .ag-msg.run:not(.is-audio) .ag-res.done{display:inline-flex;width:auto!important;max-width:100%;aspect-ratio:auto!important;padding:8px;border-radius:20px!important;
  background:linear-gradient(160deg,rgba(255,255,255,.12),rgba(255,255,255,.04))!important;border:1px solid rgba(220,230,255,.2)!important;overflow:visible!important}
#agent#agent .ag-msg.run:not(.is-audio) .ag-res.done :is(img,video){display:block;width:auto!important;height:auto!important;max-width:100%;max-height:min(62dvh,640px)!important;
  object-fit:contain;border-radius:13px;cursor:zoom-in;background:transparent}
#agent.vw-enabled .ag-results .ag-msg.run:not(.is-audio){justify-content:center}
#agent.vw-enabled .ag-results .ag-msg.run:not(.is-audio) .ag-bub{align-items:center}
/* full-screen view */
.vx-lightbox{position:fixed;inset:0;z-index:500;display:grid;place-items:center;padding:24px;background:rgba(4,6,14,.86);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);cursor:zoom-out;animation:vxlb .18s ease}
.vx-lightbox :is(img,video){max-width:100%;max-height:100%;border-radius:16px;box-shadow:0 40px 120px -30px #000;cursor:default}
.vx-lightbox button{position:absolute;top:16px;right:16px;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.1);color:#fff;font-size:22px;cursor:pointer}
.vx-lightbox a{position:absolute;bottom:18px;right:18px;padding:10px 16px;border-radius:12px;background:rgba(255,255,255,.12);color:#fff;text-decoration:none;font:650 14px var(--sans,system-ui)}
@keyframes vxlb{from{opacity:0}to{opacity:1}}

/* ---- the crew, live in the chat ---- */
.crew-live{margin:-2px 0 12px;padding:14px;border-radius:18px;background:linear-gradient(160deg,rgba(255,255,255,.1),rgba(255,255,255,.03));border:1px solid rgba(220,230,255,.16);display:flex;flex-direction:column;gap:12px}
.crew-live:empty{display:none}
.cl-head{display:flex;align-items:center;gap:8px;font:700 13.5px var(--sans,system-ui);color:#eaf0ff}
.cl-head small{margin-left:auto;font-weight:500;color:rgba(225,232,255,.6)}
.cl-spin{width:14px;height:14px;border-radius:50%;border:2px solid rgba(160,200,255,.3);border-top-color:#9fd0ff;animation:clspin .8s linear infinite}
@keyframes clspin{to{transform:rotate(360deg)}}
.cl-join{display:flex;flex-wrap:wrap;gap:8px}
.cl-m{display:flex;align-items:center;gap:7px;padding:5px 10px 5px 5px;border-radius:99px;background:rgba(255,255,255,.07);border:1px solid rgba(220,230,255,.12);animation:cljoin .5s cubic-bezier(.2,1.4,.4,1) both;animation-delay:var(--d,0s)}
.cl-m b{font:650 12.5px var(--sans,system-ui)}.cl-m i{font-style:normal;font-size:11px;color:rgba(225,232,255,.6)}
.cl-m.on{border-color:rgba(140,200,255,.7);box-shadow:0 0 0 3px rgba(90,160,255,.18),0 0 18px rgba(90,160,255,.35)}
@keyframes cljoin{from{opacity:0;transform:translateY(8px) scale(.6)}to{opacity:1;transform:none}}
.cl-steps{display:flex;flex-wrap:wrap;gap:5px;margin:0;padding:0;list-style:none}
.cl-steps li{padding:4px 9px;border-radius:99px;font:600 11.5px var(--sans,system-ui);color:rgba(225,232,255,.55);background:rgba(255,255,255,.05)}
.cl-steps li.done{color:#9be7c0;background:rgba(80,200,140,.12)}.cl-steps li.done::before{content:'✓ '}
.cl-steps li.now{color:#fff;background:rgba(90,150,255,.3);animation:clpulse 1.4s ease-in-out infinite}
@keyframes clpulse{50%{background:rgba(90,150,255,.5)}}
.cl-feed{display:flex;flex-direction:column;gap:8px}
.cl-msg{display:flex;gap:9px;align-items:flex-start;animation:clmsg .35s ease both}
.cl-msg b{font:650 12.5px var(--sans,system-ui)}.cl-msg i{font-style:normal;font-size:11px;color:rgba(225,232,255,.55)}
.cl-msg p{margin:2px 0 0;font-size:13px;line-height:1.45;color:rgba(240,244,255,.88)}
.cl-msg.changes p{color:#ffd59a}
.cl-msg.typing p{display:flex;gap:4px;padding-top:4px}.cl-msg.typing p span{width:6px;height:6px;border-radius:50%;background:#cfe2ff;animation:cltype 1s ease-in-out infinite}
.cl-msg.typing p span:nth-child(2){animation-delay:.15s}.cl-msg.typing p span:nth-child(3){animation-delay:.3s}
@keyframes cltype{0%,100%{opacity:.25;transform:translateY(0)}50%{opacity:1;transform:translateY(-3px)}}
@keyframes clmsg{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.cl-approve{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border-radius:14px;background:rgba(90,140,255,.14);border:1px solid rgba(150,190,255,.3)}
.cl-approve .go{min-height:38px;padding:0 14px;border-radius:12px;border:0;background:linear-gradient(135deg,#59c6ff,#2f6bff);color:#fff;font-weight:750;cursor:pointer}
.cl-err{margin:0;color:#ffb0a3;font-size:12.5px}
@media (prefers-reduced-motion:reduce){.cl-m,.cl-msg,.cl-steps li.now,.cl-spin{animation:none}}
/* names on creations: #samuel */
.vxn-chips{display:flex;flex-wrap:wrap;align-items:center;gap:5px;margin:6px 0 2px}
.vxn-chips:empty{display:none}
.vxn-chip{display:inline-flex;align-items:center;gap:4px;padding:2px 9px;border-radius:99px;background:rgba(120,170,255,.16);border:1px solid rgba(150,190,255,.3);color:#cfe0ff;font:600 11.5px var(--sans)}
.vxn-chip button{border:0;background:none;color:inherit;padding:0 0 0 2px;cursor:pointer;font-size:13px;line-height:1}
.vxn-btn{font-weight:800}
.vxn-pop{position:fixed;z-index:600;width:min(300px,calc(100vw - 16px));padding:14px;border-radius:16px;background:rgba(20,22,36,.96);border:1px solid rgba(200,210,255,.22);box-shadow:0 18px 48px rgba(0,0,0,.5);backdrop-filter:blur(14px)}
.vxn-pop form{display:grid;gap:10px}.vxn-pop label{display:grid;gap:6px;font:600 13px var(--sans)}.vxn-pop label small{font-weight:500;color:#a9a6c3}
.vxn-pop label span{display:flex;align-items:center;gap:4px;padding:0 10px;border-radius:11px;background:rgba(255,255,255,.07);border:1px solid rgba(220,230,255,.18)}
.vxn-pop label b{color:#9fc4ff}.vxn-pop input{flex:1;min-width:0;border:0;background:none;color:inherit;font:500 15px var(--sans);padding:9px 0;outline:none}
.vxn-pop .vxn-have:empty,.vxn-pop .vxn-err:empty{display:none}.vxn-pop .vxn-err{margin:0;color:#ffb0b0;font-size:12px}
.vxn-suggest{position:fixed;z-index:600;display:grid;gap:2px;padding:5px;border-radius:14px;background:rgba(20,22,36,.97);border:1px solid rgba(200,210,255,.22);box-shadow:0 14px 40px rgba(0,0,0,.5)}
.vxn-suggest button{display:grid;grid-template-columns:34px 1fr;grid-template-rows:auto auto;column-gap:9px;align-items:center;text-align:left;padding:5px 8px;border:0;border-radius:10px;background:none;color:inherit;cursor:pointer}
.vxn-suggest button[aria-selected=true],.vxn-suggest button:hover{background:rgba(255,255,255,.09)}
.vxn-suggest img,.vxn-suggest .vxn-dot{grid-row:1/3;width:34px;height:34px;border-radius:8px;object-fit:cover;background:rgba(255,255,255,.08)}
.vxn-suggest b{font-size:13px;color:#cfe0ff}.vxn-suggest small{font-size:11px;color:#a9a6c3}
.ag-runby{margin:6px 0 0;font-size:12px;color:#c3c0da}.ag-runby b{color:#fff}
.cl-msg.typing i{display:inline;width:auto;height:auto;margin:0;padding:0;border-radius:0;background:none!important;animation:none;font-style:normal;font-size:11px;color:rgba(225,232,255,.6)}
/* what a Vaia shows when asked for something it made */
.ag-shows{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin:10px 0 4px}
.ag-show{margin:0;border-radius:14px;overflow:hidden;background:rgba(255,255,255,.05);border:1px solid rgba(220,230,255,.14)}
.ag-show img,.ag-show video{display:block;width:100%;height:auto;max-height:260px;object-fit:contain;background:repeating-conic-gradient(#ffffff0d 0 25%,transparent 0 50%) 0 0/16px 16px}
.ag-show img{cursor:zoom-in}
.ag-show.video,.ag-show.audio{grid-column:1/-1}
.ag-show figcaption{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:7px 9px;font-size:12px}
.ag-show.card{grid-column:1/-1;display:grid;gap:6px;padding:12px}
.ag-show.card b{font-size:14px}.ag-show.card small{color:#b8b4cf;font-size:12px}
.ag-show.card .ag-suggest{justify-self:start}
.ag-show.card video{border-radius:10px;max-height:320px}