/* =====================================================================================================
   VYBEON ENTERPRISE 1.0 - one layer on top of 3.10.0 + Nova + Avava + Final + Last.
   1. Luna: one launcher, identical place and size in Dark and Light, never overlapping other controls.
   2. Luna chat + mini player (plays songs right inside the panel).
   3. Compact, enterprise-grade density (size is also scaled by enterprise.js).
   4. Loading screen (#en-splash) that matches the app icon.
   Kill switch: localStorage.entOff = '1'  (then reload).
   ===================================================================================================== */

/* ---------- retire the earlier Luna pieces (Last 1.0 chat, sidebar row) ---------- */
html[data-en] .lt-root, html[data-en] .lt-tip, html[data-en] .fn-lu-side, html[data-en] .fn-lu, html[data-en] #lunaBoot { display: none !important; }

/* ---------- loading screen ---------- */
#en-splash { position: fixed; inset: 0; z-index: 2147483000; display: grid; place-items: center; background: #0d0807; color: #f3e8dc;
  transition: opacity .5s ease, visibility .5s ease; animation: enSplashFail .01s linear 9s forwards; }
html[data-en-t=light] #en-splash { background: #efe5cf; color: #2a1d16; }
#en-splash .en-s-in { display: grid; justify-items: center; gap: 16px; padding: 24px; }
#en-splash svg { width: 92px; height: 92px; display: block; animation: enPulse 2.6s ease-in-out infinite; }
html[data-en-t=light] #en-splash svg .en-s-arc { stroke: #2a1d16; }
html[data-en-t=light] #en-splash svg .en-s-dot { fill: #2a1d16; }
#en-splash b { font: 800 15px/1 "Segoe UI", system-ui, sans-serif; letter-spacing: .44em; margin-right: -.44em; }
#en-splash small { font: 600 10px/1 ui-monospace, Menlo, Consolas, monospace; letter-spacing: .3em; margin-right: -.3em; opacity: .62; text-transform: uppercase; }
#en-splash i { display: block; width: 116px; height: 2px; border-radius: 2px; background: rgba(127,127,127,.25); overflow: hidden; margin-top: 4px; }
#en-splash i::after { content: ""; display: block; height: 100%; width: 42%; border-radius: 2px; background: linear-gradient(90deg, #ff8a4c, #e8481a); animation: enBar 1.25s ease-in-out infinite; }
#en-splash.done { opacity: 0; visibility: hidden; pointer-events: none; }
@keyframes enPulse { 0%, 100% { transform: scale(1); opacity: .94 } 50% { transform: scale(1.045); opacity: 1 } }
@keyframes enBar { 0% { transform: translateX(-110%) } 100% { transform: translateX(260%) } }
@keyframes enSplashFail { to { opacity: 0; visibility: hidden; pointer-events: none } }
@media (prefers-reduced-motion: reduce) { #en-splash svg, #en-splash i::after { animation: none } }

/* ---------- Luna: launcher ---------- */
.en-root { --en-ink: #2a1d16; --en-paper: #f3e8d2; --en-ember: #e8622a; --en-cy: #4de3ff; --en-vi: #9b7bff;
  position: fixed; right: calc(16px + env(safe-area-inset-right, 0px)); bottom: calc(var(--en-bottom, 14px) + env(safe-area-inset-bottom, 0px));
  z-index: 2147482000; font: 13px/1.4 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; color: inherit; }
.en-root *, .en-root *::before, .en-root *::after { box-sizing: border-box; }
.en-fab { all: unset; box-sizing: border-box; position: relative; display: block; width: 52px; height: 52px; border-radius: 50%; cursor: pointer;
  -webkit-tap-highlight-color: transparent; transition: transform .16s ease; }
.en-fab:hover { transform: translateY(-1px) scale(1.04); }
.en-fab:active { transform: scale(.96); }
.en-fab:focus-visible { outline: 3px solid var(--en-ember); outline-offset: 4px; }
.en-fab > img, .en-fab > .en-fallback { position: absolute; inset: 0; width: 100%; height: 100%; border-radius: 50%; object-fit: cover; display: block; pointer-events: none; user-select: none; }
.en-fallback { display: grid !important; place-items: center; font: 800 20px/1 system-ui; color: #fff; background: linear-gradient(135deg, #4de3ff, #9b7bff); }
.en-dot { position: absolute; right: 1px; bottom: 1px; width: 11px; height: 11px; border-radius: 50%; background: #3ddc84; border: 2px solid var(--en-dotbg, #0b1020); }
.en-eqbadge { position: absolute; left: -2px; top: -2px; display: none; gap: 2px; align-items: flex-end; height: 14px; padding: 3px 4px; border-radius: 8px; background: var(--en-badge, #0b1020); }
.en-eqbadge i { width: 2.5px; height: 40%; background: #3ddc84; border-radius: 2px; animation: enEq .9s ease-in-out infinite; }
.en-eqbadge i:nth-child(2) { animation-delay: -.3s } .en-eqbadge i:nth-child(3) { animation-delay: -.6s }
.en-fab[data-playing="1"] .en-eqbadge { display: flex; }
@keyframes enEq { 0%, 100% { height: 25% } 50% { height: 100% } }
.en-tip { position: absolute; right: 62px; top: 50%; transform: translateY(-50%); white-space: nowrap; padding: 7px 11px; border-radius: 12px 12px 4px 12px; font-weight: 600; font-size: 12px;
  pointer-events: none; opacity: 0; transition: opacity .25s; max-width: min(62vw, 280px); overflow: hidden; text-overflow: ellipsis; }
.en-root.en-hint .en-tip { opacity: 1; }
/* same size and place in both themes: only the ring colours change (rings are shadows, so layout never moves) */
html[data-en-t=dark] .en-fab { box-shadow: 0 0 0 2px #0b1020, 0 0 0 4px rgba(77,227,255,.75), 0 6px 18px rgba(0,0,0,.55), 0 0 22px rgba(120,110,255,.35); }
html[data-en-t=light] .en-fab { box-shadow: 0 0 0 2px var(--en-paper), 0 0 0 4px var(--en-ink), 0 6px 16px rgba(42,29,22,.3); }
html[data-en-t=dark] .en-root { --en-dotbg: #0b1020; --en-badge: #0b1020; }
html[data-en-t=light] .en-root { --en-dotbg: #f3e8d2; --en-badge: #f3e8d2; }
html[data-en-t=dark] .en-tip { background: #10162b; color: #dff6ff; border: 1px solid rgba(77,227,255,.4); }
html[data-en-t=light] .en-tip { background: var(--en-paper); color: var(--en-ink); border: 1.5px solid var(--en-ink); }

/* ---------- Luna: panel ---------- */
.en-panel { position: absolute; right: 0; bottom: 64px; width: min(340px, calc(100vw / var(--en-z, 1) - 32px));
  max-height: min(560px, calc(100vh / var(--en-z, 1) - var(--en-bottom, 14px) - 96px)); max-height: min(560px, calc(100dvh / var(--en-z, 1) - var(--en-bottom, 14px) - 96px));
  display: none; flex-direction: column; border-radius: 16px; overflow: hidden; }
.en-root.en-open .en-panel { display: flex; animation: enIn .16s ease-out; }
@keyframes enIn { from { opacity: 0; transform: translateY(8px) scale(.985) } to { opacity: 1; transform: none } }
.en-head { display: flex; align-items: center; gap: 9px; padding: 9px 10px 9px 12px; flex: none; }
.en-av { width: 32px; height: 32px; border-radius: 50%; flex: none; object-fit: cover; }
.en-who { min-width: 0; line-height: 1.2; }
.en-who b { display: block; font-size: 13.5px; }
.en-who small { display: block; font-size: 10.5px; opacity: .72; letter-spacing: .07em; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.en-ib { all: unset; box-sizing: border-box; cursor: pointer; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 8px; font: 700 11px/1 system-ui; flex: none; }
.en-ib:first-of-type { margin-left: auto; }
.en-ib:hover { background: rgba(127,127,127,.18); }
.en-ib:focus-visible, .en-chip:focus-visible, .en-row:focus-visible, .en-go:focus-visible, .en-ctl button:focus-visible { outline: 2px solid var(--en-ember); outline-offset: 1px; }
.en-ib svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }

.en-now { flex: none; padding: 10px 12px 8px; display: grid; gap: 8px; }
.en-now[hidden] { display: none; }
.en-media { display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 10px; align-items: center; }
.en-cover { width: 52px; height: 52px; border-radius: 10px; object-fit: cover; background: rgba(127,127,127,.25); display: block; }
.en-yt { display: none; grid-column: 1 / -1; width: 100%; height: 200px; border-radius: 10px; overflow: hidden; background: #000; }
.en-yt iframe { width: 100%; height: 100%; border: 0; display: block; }
.en-now.en-isyt .en-yt { display: block; }
.en-now.en-isyt .en-cover { display: none; }
.en-now.en-isyt .en-media { grid-template-columns: minmax(0, 1fr); }
.en-meta { min-width: 0; line-height: 1.25; }
.en-meta b { display: block; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.en-meta span { display: block; font-size: 12px; opacity: .8; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.en-meta em { display: block; font-style: normal; font-size: 10.5px; opacity: .62; letter-spacing: .05em; text-transform: uppercase; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.en-ctl { display: flex; align-items: center; justify-content: center; gap: 8px; }
.en-ctl button { all: unset; box-sizing: border-box; cursor: pointer; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; }
.en-ctl button:hover { background: rgba(127,127,127,.2); }
.en-ctl .en-pp { width: 38px; height: 38px; }
.en-ctl svg { width: 18px; height: 18px; fill: currentColor; }
.en-seek { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px; align-items: center; font-size: 11px; font-variant-numeric: tabular-nums; opacity: .9; }
.en-seek input { width: 100%; height: 16px; margin: 0; accent-color: var(--en-ember); }

.en-log { flex: 1 1 auto; min-height: 110px; overflow: auto; padding: 10px 12px; display: flex; flex-direction: column; gap: 7px; overscroll-behavior: contain; }
.en-m { max-width: 90%; padding: 7px 10px; border-radius: 13px; overflow-wrap: anywhere; font-size: 13px; }
.en-m.bot { align-self: flex-start; border-bottom-left-radius: 4px; }
.en-m.me { align-self: flex-end; border-bottom-right-radius: 4px; }
.en-m.en-list { max-width: 100%; width: 100%; padding: 4px; display: grid; gap: 2px; }
.en-row { all: unset; box-sizing: border-box; cursor: pointer; display: grid; grid-template-columns: 30px minmax(0, 1fr) 16px; gap: 8px; align-items: center; padding: 5px 6px; border-radius: 9px; }
.en-row:hover { background: rgba(127,127,127,.16); }
.en-row img { width: 30px; height: 30px; border-radius: 7px; object-fit: cover; background: rgba(127,127,127,.25); }
.en-row span { min-width: 0; line-height: 1.2; }
.en-row b { display: block; font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.en-row i { display: block; font-style: normal; font-size: 11px; opacity: .72; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.en-row svg { width: 14px; height: 14px; fill: currentColor; opacity: .65; }
.en-row.on { background: rgba(232,98,42,.18); }
.en-row.on b { color: var(--en-ember); }
.en-row.bad { opacity: .45; text-decoration: line-through; }
.en-typing { display: inline-flex; gap: 4px; padding: 3px 2px; }
.en-typing i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: .45; animation: enDot 1s infinite ease-in-out; }
.en-typing i:nth-child(2) { animation-delay: .15s } .en-typing i:nth-child(3) { animation-delay: .3s }
@keyframes enDot { 0%, 80%, 100% { transform: translateY(0); opacity: .35 } 40% { transform: translateY(-3px); opacity: 1 } }
.en-chips { flex: none; display: flex; flex-wrap: wrap; gap: 6px; padding: 0 12px 8px; max-height: 96px; overflow: auto; }
.en-chip { all: unset; box-sizing: border-box; cursor: pointer; padding: 5px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; white-space: nowrap; }
.en-form { flex: none; display: flex; gap: 6px; padding: 8px 10px; }
.en-in { flex: 1; min-width: 0; padding: 8px 11px; border-radius: 11px; font: inherit; font-size: 13px; outline: none; }
.en-go, .en-mic { all: unset; box-sizing: border-box; cursor: pointer; width: 34px; border-radius: 11px; display: grid; place-items: center; flex: none; }
.en-go svg, .en-mic svg { width: 17px; height: 17px; fill: currentColor; }
.en-mic.on { animation: enMic 1.1s infinite; }
@keyframes enMic { 50% { box-shadow: 0 0 0 5px rgba(232,98,42,.3) } }

/* dark */
html[data-en-t=dark] .en-panel { background: #0e1428; color: #e8f1ff; border: 1px solid rgba(77,227,255,.35); box-shadow: 0 18px 50px rgba(0,0,0,.6), 0 0 28px rgba(120,110,255,.22); }
html[data-en-t=dark] .en-head { background: linear-gradient(90deg, rgba(77,227,255,.13), rgba(155,123,255,.13)); border-bottom: 1px solid rgba(255,255,255,.08); }
html[data-en-t=dark] .en-now { background: #0b1124; border-bottom: 1px solid rgba(255,255,255,.07); }
html[data-en-t=dark] .en-m.bot { background: #1a2342; }
html[data-en-t=dark] .en-m.me { background: linear-gradient(135deg, #2a8cff, #7a5cff); color: #fff; }
html[data-en-t=dark] .en-m.en-list { background: #131b36; }
html[data-en-t=dark] .en-chip { background: #18223f; color: #bfe9ff; border: 1px solid rgba(77,227,255,.35); }
html[data-en-t=dark] .en-chip:hover { background: #1f2b50; }
html[data-en-t=dark] .en-form { border-top: 1px solid rgba(255,255,255,.08); }
html[data-en-t=dark] .en-in { background: #0a0f20; color: #fff; border: 1px solid rgba(255,255,255,.18); }
html[data-en-t=dark] .en-in::placeholder { color: #8b97b8; }
html[data-en-t=dark] .en-go { background: linear-gradient(135deg, #4de3ff, #9b7bff); color: #07101f; }
html[data-en-t=dark] .en-mic { background: #18223f; color: #bfe9ff; border: 1px solid rgba(77,227,255,.35); }
html[data-en-t=dark] .en-ctl .en-pp { background: linear-gradient(135deg, #4de3ff, #9b7bff); color: #07101f; }
/* light */
html[data-en-t=light] .en-panel { background: var(--en-paper); color: var(--en-ink); border: 1.5px solid var(--en-ink); box-shadow: 0 14px 34px rgba(42,29,22,.3); }
html[data-en-t=light] .en-head { background: #ead9b8; border-bottom: 1.5px solid var(--en-ink); }
html[data-en-t=light] .en-now { background: #f7eedb; border-bottom: 1.5px solid var(--en-ink); }
html[data-en-t=light] .en-m.bot { background: #fff7e6; border: 1.2px solid var(--en-ink); }
html[data-en-t=light] .en-m.me { background: var(--en-ember); color: #fff; border: 1.2px solid var(--en-ink); }
html[data-en-t=light] .en-m.en-list { background: #fff7e6; border: 1.2px solid var(--en-ink); }
html[data-en-t=light] .en-chip { background: #fff7e6; color: var(--en-ink); border: 1.2px solid var(--en-ink); }
html[data-en-t=light] .en-chip:hover { background: #fff; }
html[data-en-t=light] .en-form { border-top: 1.5px solid var(--en-ink); }
html[data-en-t=light] .en-in { background: #fffaf0; color: var(--en-ink); border: 1.2px solid var(--en-ink); }
html[data-en-t=light] .en-in::placeholder { color: #8a7560; }
html[data-en-t=light] .en-go { background: var(--en-ink); color: var(--en-paper); }
html[data-en-t=light] .en-mic { background: #fff7e6; color: var(--en-ink); border: 1.2px solid var(--en-ink); }
html[data-en-t=light] .en-ctl .en-pp { background: var(--en-ink); color: var(--en-paper); }

@media (max-width: 720px) {
  .en-root { right: calc(12px + env(safe-area-inset-right, 0px)); }
  .en-fab { width: 48px; height: 48px; }
  .en-panel { bottom: 60px; width: calc(100vw / var(--en-z, 1) - 24px); }
  .en-tip { right: 58px; }
}
@media (prefers-reduced-motion: reduce) { .en-fab, .en-root.en-open .en-panel, .en-tip, .en-eqbadge i, .en-typing i { transition: none; animation: none; } }

/* =====================================================================================================
   ENTERPRISE DENSITY - moderate sizes. enterprise.js also scales the whole page (zoom); these rules cap the
   few oversized headings so the hero and page titles read as a product, not a poster.
   ===================================================================================================== */
html[data-en]:not(#e) .hero h1 { font-size: clamp(26px, 3.4vw, 46px); line-height: 1.05; }
html[data-en]:not(#e) .hero:not(.live) { min-height: 232px; }
html[data-en]:not(#e) .hero-idle { padding: clamp(18px, 3vw, 34px); }
html[data-en]:not(#e) .hero p { font-size: 14px; margin-bottom: 16px; }
html[data-en]:not(#e) .page-head h1, html[data-en]:not(#e) .entity-head h1 { font-size: clamp(22px, 2.8vw, 36px); }
html[data-en]:not(#e) .page-head { margin: 4px 0 16px; }
html[data-en]:not(#e) .section { margin: 24px 0; }
html[data-en]:not(#e) .section h2 { font-size: 17px; }
html[data-en]:not(#e) .btn { padding: 8px 16px; font-size: 13px; }
html[data-en]:not(#e) .btn.sm { padding: 6px 12px; font-size: 12px; }
html[data-en]:not(#e) .menu a { padding: 9px 12px; }
html[data-en]:not(#e) .card h3 { font-size: 14px; }
html[data-en]:not(#e) .voice-text { font-size: clamp(22px, 4.6vw, 44px); }
html[data-en] .fn-support { font-size: 11px; }
html[data-en] #clock, html[data-en] .p-seek, html[data-en] .np-seek, html[data-en] .tdur { font-variant-numeric: tabular-nums; }
html[data-en] :focus-visible { outline-offset: 2px; }
html[data-en] main { scroll-padding-bottom: 90px; }
@media (max-width: 720px) {
  html[data-en]:not(#e) .hero h1 { font-size: clamp(26px, 8vw, 34px); }
  html[data-en]:not(#e) .page-head h1 { font-size: clamp(22px, 6.4vw, 30px); }
}

/* ---------- full-screen and spectrum screens: no search bar (see enterprise.js, section 3) ---------- */
html[data-en][data-en-immersive] .dsearch,
html[data-en][data-en-immersive] .searchwrap,
html[data-en][data-en-immersive] .searchbar,
html[data-en][data-en-immersive] .search-pill,
html[data-en][data-en-immersive] .search-tools,
html[data-en][data-en-immersive] [role="search"],
html[data-en][data-en-immersive] #sug,
html[data-en][data-en-immersive] .suggest { display: none !important; }
html[data-en] [data-en-nosearch] { display: none !important; }
/* Luna's message box, the voice-search screen and pop-up sheets always keep their inputs */
html[data-en] .en-root [role="search"], html[data-en] .voice .voice-pill, html[data-en] .modal .searchbar { display: revert !important; }

/* ---------- LUNA-PLAY 1.0: results are listed in the chat, songs play in the main player ---------- */
.en-root .en-playall { all: unset; box-sizing: border-box; display: flex; align-items: center; gap: 8px; width: 100%; padding: 9px 12px; margin: 0 0 6px; border-radius: 12px; cursor: pointer;
  font-weight: 700; font-size: 12.5px; line-height: 1.2; color: inherit; background: color-mix(in srgb, var(--en-ember) 20%, transparent); border: 1px solid color-mix(in srgb, var(--en-ember) 45%, transparent); }
.en-root .en-playall svg { width: 16px; height: 16px; fill: currentColor; flex: none; }
.en-root .en-playall:hover { background: color-mix(in srgb, var(--en-ember) 32%, transparent); }
.en-root .en-playall:focus-visible { outline: 3px solid var(--en-ember); outline-offset: 2px; }
/* Luna has no player and no video of her own any more */
.en-root .en-now, .en-root .en-yt { display: none !important; }