/* Audio: voice-overs, sound effects (and the Music tab, music-studio.css) */
.au{padding:22px clamp(14px,3vw,36px) 60px}
.au-wrap{max-width:1240px;margin:0 auto}
.au-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-bottom:16px}
.au-head h1{margin:2px 0 4px;font:750 30px/1.15 var(--sans);letter-spacing:-.4px}
.au-head p{margin:0;color:#b8b4cf;max-width:62ch}
.au-kicker{font:700 11px var(--sans)!important;letter-spacing:.12em;text-transform:uppercase;color:#a9c8ff!important}
.au-tabs{display:inline-flex;gap:4px;padding:4px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid rgba(220,230,255,.14)}
.au-tabs a{padding:9px 16px;border-radius:10px;color:var(--muted,#aaa6c4);font:600 13.5px var(--sans);text-decoration:none;transition:color .2s,background .2s}
.au-tabs a:hover{color:var(--ink,#fff)}
.au-tabs a.on{color:var(--ink,#fff);background:linear-gradient(160deg,rgba(255,255,255,.2),rgba(255,255,255,.07));box-shadow:inset 0 1px 0 rgba(255,255,255,.2)}
.ms-autabs{max-width:1100px;margin:18px auto 0;padding:0 clamp(14px,3vw,36px)}

.au-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:16px;align-items:start}
.au-grid.one{grid-template-columns:minmax(0,760px)}
.au-make,.au-lib,.au-history{border-radius:22px;padding:18px;background:linear-gradient(160deg,rgba(255,255,255,.08),rgba(255,255,255,.025));border:1px solid rgba(220,230,255,.14);backdrop-filter:blur(14px)}
.au-make{display:grid;gap:12px;position:sticky;top:12px}
.au-script{position:relative;display:grid;gap:6px;font:600 13px var(--sans)}
.au-script textarea{width:100%;box-sizing:border-box;resize:vertical;min-height:96px;padding:14px 14px 28px;border-radius:14px;border:1px solid rgba(220,230,255,.16);background:rgba(4,6,16,.35);color:inherit;font:400 15.5px/1.55 var(--sans)}
.au-script textarea:focus{outline:2px solid #8fb4ff;outline-offset:1px}
.au-count{position:absolute;right:12px;bottom:9px;font:500 11px var(--sans);font-style:normal;color:#8d89a8}
.au-ideas{display:flex;flex-wrap:wrap;gap:6px}.au-ideas:empty{display:none}
.au-chip{padding:7px 12px;border-radius:99px;border:1px solid rgba(220,230,255,.16);background:rgba(255,255,255,.05);color:#d7d4ea;font:600 12px var(--sans);cursor:pointer}
.au-chip:hover{color:#fff;border-color:rgba(220,230,255,.32)}
.au-chip.on{background:rgba(130,170,255,.22);border-color:rgba(150,190,255,.5);color:#fff}
.au-chosen{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid rgba(220,230,255,.12)}
.au-chosen-l{font:700 10px var(--sans);letter-spacing:.1em;text-transform:uppercase;color:#a9a6c4}
.au-chosen>div{flex:1;min-width:0;display:flex;flex-direction:column}.au-chosen small{color:#aaa6c4;font-size:12px}
.au-settings summary{cursor:pointer;font:600 13px var(--sans);color:#d7d4ea;padding:4px 0}
#ausliders{display:grid;grid-template-columns:1fr 1fr;gap:12px 18px;margin:10px 0 6px}
.au-slider{display:grid;gap:4px;font-size:12.5px}
.au-slider span{display:flex;justify-content:space-between}.au-slider output{color:#a9c8ff;font-variant-numeric:tabular-nums}
.au-slider input{width:100%;accent-color:#8fb4ff}
.au-slider i{display:flex;justify-content:space-between;font-style:normal;font-size:10.5px;color:#8d89a8}.au-slider em{font-style:normal}
.au-link{border:0;background:none;color:#9fc4ff;font:600 12.5px var(--sans);cursor:pointer;padding:0}
.au-msg{margin:0;color:#ffb3b3;font-size:13px}.au-msg:empty{display:none}
.au-go{min-height:50px;font-size:15.5px}
.au-fine{margin:0;font-size:11.5px;color:#8d89a8;text-align:center}

.au-lib>header{display:grid;gap:10px;margin-bottom:10px}
.au-lib h2,.au-history h2{margin:0;font:700 17px var(--sans)}.au-lib h2 span{color:#8d89a8;font-weight:600;font-size:13px}
.au-lib input[type=search]{width:100%;box-sizing:border-box;padding:11px 14px;border-radius:12px;border:1px solid rgba(220,230,255,.16);background:rgba(4,6,16,.35);color:inherit;font:400 14px var(--sans)}
.au-filters{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding-bottom:4px;margin-bottom:6px}
.au-filters .au-chip{flex:none}
.au-voices{display:grid;gap:4px;max-height:min(62dvh,640px);overflow:auto;padding-right:4px}
.au-voice{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:14px;border:1px solid transparent;transition:background .2s,border-color .2s}
.au-voice:hover{background:rgba(255,255,255,.05)}
.au-voice.on{background:rgba(130,170,255,.12);border-color:rgba(150,190,255,.35)}
.au-vmeta{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.au-vmeta b{font-size:14px}.au-vmeta small{color:#aaa6c4;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.au-vmeta span{display:flex;gap:4px;margin-top:2px}.au-vmeta em{font-style:normal;font-size:10px;padding:1px 7px;border-radius:99px;background:rgba(255,255,255,.07);color:#c9c5e0}
.au-av{flex:none;display:inline-block;width:var(--s,40px);height:var(--s,40px);border-radius:50%;box-shadow:inset 0 -3px 8px rgba(0,0,0,.25),0 4px 12px rgba(0,0,0,.25)}
.au-sfx{--s:38px;display:grid;place-items:center;background:linear-gradient(140deg,#5f7cff,#b05cff);color:#fff;font-size:16px}
.au-play{flex:none;width:36px;height:36px;display:grid;place-items:center;border-radius:50%;border:1px solid rgba(220,230,255,.22);background:rgba(255,255,255,.08);color:#fff;cursor:pointer;transition:background .2s,transform .2s}
.au-play:hover{background:rgba(255,255,255,.16);transform:scale(1.05)}
.au-play[aria-pressed=true]{background:#8fb4ff;color:#0d1530;border-color:transparent;animation:aupulse 1.4s ease-in-out infinite}
.au-use{flex:none;min-height:34px;padding:0 14px;border-radius:10px;border:1px solid rgba(220,230,255,.2);background:rgba(255,255,255,.06);color:#fff;font:600 12.5px var(--sans);cursor:pointer}
.au-use[aria-pressed=true]{background:rgba(130,170,255,.25);border-color:rgba(150,190,255,.5)}
.au-empty{color:#8d89a8;font-size:13px;margin:10px 4px}

.au-history{margin-top:16px}
#aulist{display:grid;gap:8px;margin-top:10px}
.au-item{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(220px,320px) auto;align-items:center;gap:12px;padding:10px 12px;border-radius:16px;background:rgba(255,255,255,.04);border:1px solid rgba(220,230,255,.1)}
.au-imeta{min-width:0}.au-imeta b{font-size:14px}.au-imeta p{margin:2px 0 0;font-size:12.5px;color:#b8b4cf;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.au-item audio{width:100%;height:36px}
.au-iact{display:flex;align-items:center;gap:10px;font-size:11.5px;color:#8d89a8}
.au-dl{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:rgba(255,255,255,.07);color:#fff;text-decoration:none}
.au-note{grid-column:2/-1;color:#c9c5e0}
.au-item.is-live .au-step,.au-item.is-bad .au-step{grid-column:3/-1;color:#b8b4cf}
.au-item.is-bad .au-step{color:#ffb3b3}
.au-wave{display:flex;gap:3px;align-items:center;height:28px}.au-wave i{width:4px;border-radius:2px;background:#8fb4ff;animation:auwave 1s ease-in-out infinite}
.au-wave i:nth-child(2){animation-delay:.1s}.au-wave i:nth-child(3){animation-delay:.2s}.au-wave i:nth-child(4){animation-delay:.3s}.au-wave i:nth-child(5){animation-delay:.4s}
.au-item.is-live{grid-template-columns:auto minmax(0,1fr) auto auto}
@keyframes auwave{0%,100%{height:6px}50%{height:24px}}
@keyframes aupulse{50%{box-shadow:0 0 0 6px rgba(143,180,255,.18)}}
@media(max-width:900px){.au-grid{grid-template-columns:1fr}.au-make{position:static}.au-voices{max-height:none}
  .au-item{grid-template-columns:auto minmax(0,1fr) auto}.au-item audio{grid-column:1/-1}}
@media(max-width:560px){#ausliders{grid-template-columns:1fr}.au-head h1{font-size:25px}.au-tabs{width:100%}.au-tabs a{flex:1;text-align:center;padding:9px 6px}}
@media(prefers-reduced-motion:reduce){.au-wave i,.au-play[aria-pressed=true]{animation:none}}
/* clear the top bar like the music page; never wider than the screen */
.au{padding:92px clamp(14px,3vw,36px) calc(var(--dock,0px) + 48px);overflow-y:auto}
.au-grid>*{min-width:0}
@media(max-width:900px){.au-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:860px){.au{padding-top:72px}}
.au-voices{grid-template-columns:minmax(0,1fr)}.au-voice{min-width:0}#aulist{grid-template-columns:minmax(0,1fr)}
/* favourite voices */
.vx-star{flex:none;width:34px;height:34px;display:grid;place-items:center;border-radius:50%;border:1px solid rgba(220,230,255,.18);background:rgba(255,255,255,.05);color:#c9c5e0;cursor:pointer;transition:color .2s,background .2s,transform .15s}
.vx-star:hover{color:#ffe29a;transform:scale(1.06)}
.vx-star.on{color:#ffd76a;background:rgba(255,205,90,.14);border-color:rgba(255,210,110,.45)}
.vx-voice .vx-star{margin-left:auto}

/* ===== Audio, centred: one bubble like a chat, helpers under it ===== */
.au{padding:clamp(72px,12vh,140px) 16px calc(var(--dock,0px) + 60px)}
.au-center{max-width:760px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:14px}
.au-center>h1{margin:0;font:750 clamp(26px,4vw,38px)/1.15 var(--sans);letter-spacing:-.6px;text-align:center}
.au-center>.au-kicker{margin:0}
.au-center .au-tabs{margin:2px 0 6px}
.au-bubble{width:100%;box-sizing:border-box;padding:14px 14px 10px 18px;border-radius:30px;
  background:linear-gradient(160deg,rgba(255,255,255,.12),rgba(255,255,255,.04));border:1px solid rgba(220,230,255,.2);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 24px 60px rgba(0,0,0,.45);backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%)}
.au-bubble:focus-within{border-color:rgba(160,195,255,.5);box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 0 0 4px rgba(120,160,255,.12),0 24px 60px rgba(0,0,0,.45)}
.au-bubble textarea{display:block;width:100%;box-sizing:border-box;min-height:52px;max-height:320px;resize:none;border:0;outline:0;background:none;color:inherit;font:400 17px/1.55 var(--sans);padding:4px 2px}
.au-bar{display:flex;align-items:center;gap:8px;margin-top:6px}
.au-voicechip{display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 12px 0 6px;border-radius:99px;border:1px solid rgba(220,230,255,.18);background:rgba(255,255,255,.07);color:#fff;font:600 13px var(--sans);cursor:pointer}
.au-voicechip[hidden]{display:none}
.au-ico{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;border:1px solid rgba(220,230,255,.18);background:rgba(255,255,255,.07);color:#e6e9ff;cursor:pointer}
.au-ico[hidden]{display:none}
.au-ico[aria-expanded=true]{background:rgba(130,170,255,.22)}
.au-inst{display:inline-flex;align-items:center;gap:6px;font:600 12.5px var(--sans);color:#d7d4ea}.au-inst[hidden]{display:none}
.au-bar .au-count{position:static;margin-left:auto;font:500 11px var(--sans);font-style:normal;color:#8d89a8}
.au-send{flex:none;display:inline-flex;align-items:center;gap:6px;height:44px;min-width:44px;padding:0 14px;border:0;border-radius:99px;cursor:pointer;color:#0d1530;
  background:linear-gradient(140deg,#e1ebff,#8fb4ff);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 8px 22px rgba(120,160,255,.35);font:700 13px var(--sans)}
.au-send b:empty{display:none}
.au-send:disabled{opacity:.45;cursor:default}
.au-settings{margin-top:10px;padding-top:10px;border-top:1px solid rgba(220,230,255,.1)}
.au-settings #ausliders{display:grid;grid-template-columns:1fr 1fr;gap:12px 18px;margin:0 0 8px}
.au-helpers{width:100%;display:flex;justify-content:center}
.au-center .au-ideas{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.au-center .au-msg{margin:0}
.au-center .au-fine{margin:0;font-size:12px;color:#8d89a8;text-align:center}.au-center .au-fine a{color:#9fc4ff}
.au-favs{width:100%;margin-top:14px}
.au-favs[hidden]{display:none}
.au-favs>header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;font-size:14px}
.au-favrow{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px}
.au-favv{display:flex;align-items:center;gap:8px;padding:6px;border-radius:16px;background:rgba(255,255,255,.05);border:1px solid rgba(220,230,255,.12)}
.au-favv.on{border-color:rgba(150,190,255,.5);background:rgba(130,170,255,.12)}
.au-favuse{flex:1;min-width:0;display:flex;align-items:center;gap:8px;border:0;background:none;color:inherit;text-align:left;cursor:pointer;padding:0}
.au-favuse span{min-width:0;display:flex;flex-direction:column}.au-favuse b{font-size:13px}.au-favuse small{font-size:11px;color:#aaa6c4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.au-center .au-lib{width:100%;box-sizing:border-box}
.au-lib>header{display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px}
.au-lib>header input{grid-column:1/-1}
.au-center .au-voices{max-height:min(60dvh,560px)}
.au-center .au-history{width:100%;box-sizing:border-box;margin-top:6px}
.au-song .vxp{grid-column:1/-1}
.au-item.au-song{display:block}
@media(max-width:560px){.au{padding-top:70px}.au-bubble{border-radius:26px;padding:12px 12px 8px 14px}.au-settings #ausliders{grid-template-columns:1fr}.au-favrow{grid-template-columns:1fr}}

/* Enhance bar (every chat box) */
.vxe{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.vxe button{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 13px;border-radius:99px;border:1px solid rgba(220,230,255,.18);
  background:linear-gradient(160deg,rgba(255,255,255,.13),rgba(255,255,255,.04));box-shadow:inset 0 1px 0 rgba(255,255,255,.16);color:#e6e9ff;font:600 12.5px var(--sans);cursor:pointer;backdrop-filter:blur(14px)}
.vxe button:hover{border-color:rgba(220,230,255,.34);color:#fff}
.vxe .vxe-go{color:#cfe0ff}.vxe .vxe-go svg{color:#9fc4ff}
.vxe.busy .vxe-go{pointer-events:none;opacity:.7}.vxe.busy .vxe-go span::after{content:"…"}
.vxe .vxe-auto i{width:24px;height:14px;border-radius:99px;background:rgba(255,255,255,.18);position:relative;transition:background .2s}
.vxe .vxe-auto i::after{content:"";position:absolute;top:2px;left:2px;width:10px;height:10px;border-radius:50%;background:#fff;transition:transform .2s}
.vxe .vxe-auto[aria-checked=true] i{background:#8fb4ff}.vxe .vxe-auto[aria-checked=true] i::after{transform:translateX(10px)}
.vxe .vxe-undo{color:#ffd29e}
.vxe.compact button{height:30px;padding:0 10px;font-size:12px}

/* music: how to make it, which model, and the lyrics bubble (blank = instrumental) */
.au-song{display:flex;flex-direction:column;gap:10px;width:100%;margin:2px 0 4px}
.au-song[hidden],.au-lyricsbox[hidden]{display:none}
.au-pills,.au-models{display:flex;flex-wrap:wrap;gap:6px;padding:5px;border-radius:22px;background:rgba(255,255,255,.04);border:1px solid rgba(220,230,255,.1)}
.au-models{overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}.au-models::-webkit-scrollbar{display:none}
.au-pills button,.au-models button{flex:1 1 0;min-width:86px;display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 12px;border-radius:17px;border:1px solid transparent;
  background:transparent;color:#cbd3ea;cursor:pointer;font:inherit;white-space:nowrap;transition:background .18s,color .18s,transform .18s,box-shadow .18s}
.au-pills button b,.au-models button b{font:700 13.5px/1.1 var(--sans)}
.au-pills button small,.au-models button small{font:500 11px/1.2 var(--sans);color:#8c95ad}
.au-pills button:hover,.au-models button:hover{background:rgba(255,255,255,.07);transform:translateY(-1px)}
.au-pills button[aria-checked="true"],.au-models button[aria-checked="true"]{color:#fff;background:linear-gradient(135deg,rgba(124,196,255,.3),rgba(201,155,255,.3));border-color:rgba(255,255,255,.22);
  box-shadow:0 8px 22px -10px rgba(140,160,255,.7),inset 0 1px 0 rgba(255,255,255,.2)}
.au-pills button[aria-checked="true"] small,.au-models button[aria-checked="true"] small{color:#dbe4ff}
.au-pills.sm button{min-width:0;padding:6px 12px}
.au-lyricsbox{display:flex;flex-direction:column;gap:10px;width:100%}
.au-lyrics{padding:12px 16px 12px 18px}
.au-lyrhead{display:flex;align-items:center;gap:10px;margin-bottom:6px;font:500 12.5px var(--sans);color:#9aa4bd}
.au-lyrhead b{color:#fff;font-size:13.5px}.au-lyrhead .au-link{margin-left:auto}
.au-lyrics textarea{display:block;width:100%;box-sizing:border-box;min-height:140px;max-height:420px;resize:vertical;border:0;outline:0;background:none;color:inherit;font:400 15.5px/1.6 var(--sans);padding:2px}
.au-lyrics textarea::placeholder{color:#6f7891}
.au-songmeta{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:end}
.au-title{display:flex;flex-direction:column;gap:6px}.au-title span,.au-vocal>span{font:700 12px var(--sans);color:#c9d2ea}
.au-title input{min-height:44px;padding:0 16px;border-radius:999px;color:#fff;font:500 15px var(--sans);border:1.5px solid transparent;
  background:linear-gradient(rgba(12,14,26,.85),rgba(12,14,26,.85)) padding-box,linear-gradient(135deg,rgba(255,138,216,.35),rgba(124,196,255,.35)) border-box}
.au-title input:focus{outline:none;background:linear-gradient(rgba(14,16,30,.92),rgba(14,16,30,.92)) padding-box,linear-gradient(135deg,#ff8ad8,#c99bff 45%,#7cc4ff) border-box}
.au-vocal{display:flex;flex-direction:column;gap:6px;transition:opacity .2s}.au-vocal.off{opacity:.4;pointer-events:none}
@media(max-width:560px){.au-songmeta{grid-template-columns:1fr}.au-models button{min-width:96px}}

/* "Create a ___" with the word rolling through what Audio makes */
.au-rotor{white-space:nowrap}
.au-rotor .au-word{display:inline-block;background:linear-gradient(135deg,#ff8ad8,#c99bff 45%,#7cc4ff);-webkit-background-clip:text;background-clip:text;color:transparent;
  transition:transform .26s cubic-bezier(.2,.8,.2,1),opacity .26s,filter .26s;will-change:transform}
.au-rotor .au-word.out{transform:translateY(-40%);opacity:0;filter:blur(4px)}
.au-rotor .au-word.in{transform:translateY(40%);opacity:0;filter:blur(4px);transition:none}
@media(max-width:560px){.au-rotor{white-space:normal}}