/* NEO Universe · capa de diseño 2026-10-28 (refinamiento visual, sin cambiar lo que hace).
   Se carga DESPUÉS de universe.css y solo corrige: encimados, recortes, espacio muerto, desbordes, contraste y compacidad.
   Cada bloque dice qué corrige; las referencias de cada decisión están en DISENO_NOTAS.md. */

/* ---------- 0 · barra superior: una sola línea también en el teléfono ---------- */
@media (max-width: 640px) {
  .top { flex-wrap: nowrap !important; gap: 8px !important; padding: 10px 16px !important; }
  .brand { gap: 8px; min-width: 0; } .brand img { width: 26px; height: 26px; } .brand span { font-size: 17px !important; white-space: nowrap; }
  .top-act { gap: 6px !important; min-width: 0; } .top-act .btn.s { padding: 7px 11px; font-size: 12.5px; white-space: nowrap; }
  .top:has(.top-act > :nth-child(3)) { flex-wrap: wrap !important; }   /* con más accesos (sesión, «Hazlo tú con NEO») bajan ordenados, no se enciman */
  .top-act:has(> :nth-child(3)) { flex-wrap: wrap; justify-content: flex-end; }
  .worldbar { top: 52px !important; padding: 6px 16px !important; } .worldbar a { padding: 7px 13px; font-size: 13.5px; }
}

/* ---------- 1 · aviso «Ejemplo»: alineado a la retícula, compacto, sin tocar los bordes ---------- */
.ex91-note { margin: 12px var(--gut, 32px) 0 !important; max-width: none !important; padding: 8px 14px !important; font-size: 13px !important; line-height: 1.45;
  color: #FFE7A8 !important; background: rgba(255, 210, 90, .09) !important; border-color: rgba(255, 210, 90, .3) !important; }
.ex91-note b { color: #FFD25A; }
.ex91-note::before { content: ""; display: inline-block; vertical-align: middle; width: 7px; height: 7px; margin: -2px 9px 0 0; border-radius: 50%; background: #FFD25A; }
@media (max-width: 640px) { .ex91-note { margin: 10px 16px 0 !important; font-size: 12.5px !important; } }

/* ---------- 2 · insignias: «Ejemplo» y el estado (Nuevo, Estreno…, Ver ahora) ya no se enciman ---------- */
.ex91-on:has(> .b34) > .ex91, .ex91-on:has(> .b49) > .ex91 { top: auto !important; bottom: 8px; right: 8px; }
.ex91-on:has(> .b34) > .ex91 { bottom: auto; top: 34px !important; left: 8px; right: auto !important; }
.b34:not(.b49) { max-width: calc(100% - 16px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; z-index: 2; }
.ex91 { box-shadow: 0 2px 8px rgba(0, 0, 0, .35); }

/* ---------- 3 · filas: cada forma de tarjeta con su ancho (sin traslapes en filas mixtas) y títulos de una línea ---------- */
.r34-track:has(> .t34) { grid-auto-columns: max-content !important; }
.r34-track > .t34 { width: 260px; } .r34-track > .t34-poster, .r34-track > .t34-tall { width: 180px; }
.r34-track > .t34-square, .r34-track > .t34-frame { width: 200px; } .r34-track > .t34-capsule { width: 300px; }
.t34-cv { width: 100% !important; overflow: hidden; }
/* fila mixta (Inicio: obras de varios mundos juntas): una sola forma para que títulos y creadores queden alineados */
.r34-track:has(> .t34-poster):has(> .t34:not(.t34-poster)) > .t34,
.r34-track:has(> .t34-tall):has(> .t34:not(.t34-tall)) > .t34,
.r34-track:has(> .t34-square):has(> .t34:not(.t34-square)) > .t34,
.r34-track:has(> .t34-frame):has(> .t34:not(.t34-frame)) > .t34,
.r34-track:has(> .t34-capsule):has(> .t34:not(.t34-capsule)) > .t34,
.r34-track:has(> .t34-wide):has(> .t34:not(.t34-wide)) > .t34 { width: 260px !important; }
.r34-track:has(> .t34-poster):has(> .t34:not(.t34-poster)) > .t34 > .t34-cv,
.r34-track:has(> .t34-tall):has(> .t34:not(.t34-tall)) > .t34 > .t34-cv,
.r34-track:has(> .t34-square):has(> .t34:not(.t34-square)) > .t34 > .t34-cv,
.r34-track:has(> .t34-frame):has(> .t34:not(.t34-frame)) > .t34 > .t34-cv,
.r34-track:has(> .t34-capsule):has(> .t34:not(.t34-capsule)) > .t34 > .t34-cv,
.r34-track:has(> .t34-wide):has(> .t34:not(.t34-wide)) > .t34 > .t34-cv { aspect-ratio: 16/9 !important; }
@media (max-width: 640px) { .r34-track:has(> .t34-poster):has(> .t34:not(.t34-poster)) > .t34, .r34-track:has(> .t34-tall):has(> .t34:not(.t34-tall)) > .t34, .r34-track:has(> .t34-square):has(> .t34:not(.t34-square)) > .t34, .r34-track:has(> .t34-frame):has(> .t34:not(.t34-frame)) > .t34, .r34-track:has(> .t34-capsule):has(> .t34:not(.t34-capsule)) > .t34, .r34-track:has(> .t34-wide):has(> .t34:not(.t34-wide)) > .t34 { width: 72vw !important; max-width: 280px; } }
.t34-t { -webkit-line-clamp: 1 !important; margin-top: 2px; }
.t34-who > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.r34-h { gap: 16px; } .r34-h h2 { min-width: 0; } .r34-h a { white-space: nowrap; flex: none; }
.r34 + .r34 { margin-top: 30px; }
@media (max-width: 640px) {
  .r34-track > .t34 { width: 72vw; max-width: 280px; } .r34-track > .t34-poster, .r34-track > .t34-tall { width: 42vw; max-width: 170px; }
  .r34-track > .t34-square, .r34-track > .t34-frame { width: 46vw; max-width: 190px; } .r34-track > .t34-capsule { width: 78vw; }
  .r34 + .r34 { margin-top: 24px; }
}

/* ---------- 4 · destacado (hero): el fondo se funde abajo para que el texto se lea limpio ---------- */
.h34 { background: linear-gradient(0deg, var(--bg-0, #0b0b0d) 0%, color-mix(in srgb, var(--bg-0, #0b0b0d) 88%, transparent) 28%, transparent 62%),
  linear-gradient(90deg, rgba(0, 0, 0, .9) 0%, rgba(0, 0, 0, .6) 42%, rgba(0, 0, 0, .06) 100%), var(--bg) center/cover no-repeat !important;
  min-height: min(62vh, 560px); }
.h34 h1 { text-wrap: balance; text-shadow: 0 2px 24px rgba(0, 0, 0, .45); } .h34 p { max-width: 52ch; }
.w34 > .h34 { min-height: min(58vh, 520px); }
@media (max-width: 640px) { .h34, .w34 > .h34 { min-height: 400px !important; } .h34 h1 { font-size: 36px !important; }
  .h34 { background: linear-gradient(0deg, var(--bg-0, #0b0b0d) 0%, color-mix(in srgb, var(--bg-0, #0b0b0d) 90%, transparent) 34%, transparent 72%),
    linear-gradient(90deg, rgba(0, 0, 0, .7), rgba(0, 0, 0, .2)), var(--bg) center/cover no-repeat !important; } }

/* ---------- 5 · Inicio · un bloque por mundo, más compacto y ordenado ---------- */
.wb49 { padding: 16px !important; } .wb49 header { margin-bottom: 12px; }
.wb49 header a { color: color-mix(in srgb, var(--wc) 62%, #fff) !important; font-size: 14px; white-space: nowrap; }
.wb49-in { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr) !important; align-items: stretch; }
.wb49-feat { min-height: 0 !important; aspect-ratio: auto; isolation: isolate; overflow: hidden; }
.wb49-feat::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit;
  background: linear-gradient(0deg, rgba(0, 0, 0, .94) 0%, rgba(0, 0, 0, .78) 24%, transparent 62%); }
.wb49-feat b { font-size: 28px !important; }
.wb49-list { gap: 4px !important; } .wb49-list a { grid-template-columns: 96px minmax(0, 1fr) auto !important; padding: 6px 8px !important; gap: 12px !important; }
.wb49-th { aspect-ratio: 16/10; } .wb49-list a > span:nth-child(2) b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wb49-list .b49 { grid-column: 3 !important; grid-row: 1; align-self: center; max-width: none; }
.wb49-list a > .wb49-th { grid-column: 1; grid-row: 1; } .wb49-list a > span:nth-child(2) { grid-column: 2; grid-row: 1; min-width: 0; }
.hm49-in > .wb49 + .wb49 { margin-top: 0; }
@media (max-width: 900px) { .wb49-in { grid-template-columns: minmax(0, 1fr) !important; } .wb49-feat { min-height: 220px !important; } }
@media (max-width: 640px) { .wb49 { margin: 0 16px !important; padding: 12px !important; } .wb49-list a { grid-template-columns: 84px minmax(0, 1fr) !important; }
  .wb49-list .b49 { grid-column: 2 !important; grid-row: 2 !important; justify-self: start; align-self: start; } .wb49-list .wb49-th { grid-row: 1 / 3; } .wb49-feat b { font-size: 24px !important; } }

/* ---------- 6 · tarjetas con imagen y texto encima: velo inferior para que el texto no choque con la imagen ---------- */
.mo35 { position: relative; isolation: isolate; overflow: hidden; }
.mo35::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(0, 0, 0, .92) 0%, rgba(0, 0, 0, .7) 38%, rgba(0, 0, 0, .1) 80%); }
.ucard::after { background: linear-gradient(180deg, rgba(0, 0, 0, .05) 10%, rgba(0, 0, 0, .6) 45%, rgba(0, 0, 0, .94) 78%) !important; }
.fd42-hero { max-width: none !important; isolation: isolate; }
.fd42-hero::before { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: linear-gradient(90deg, rgba(0, 0, 0, .86) 0%, rgba(0, 0, 0, .55) 50%, rgba(0, 0, 0, .1) 100%), linear-gradient(0deg, rgba(0, 0, 0, .7), transparent 45%); }

/* ---------- 7 · mundo · «Nuevos episodios» (Anime/Cine): tarjeta con su creador dentro, sin huecos ---------- */
.ne38 { grid-template-columns: repeat(auto-fill, minmax(380px, 1fr)) !important; gap: 8px 18px !important; }
.ne38-c { display: grid; grid-template-columns: 150px minmax(0, 1fr); grid-template-rows: auto 1fr; column-gap: 12px; padding: 6px; border-radius: 10px; transition: background .15s; }
.ne38-c:hover { background: rgba(255, 255, 255, .05); }
.ne38-c > .ne38-i { grid-column: 1 / -1; grid-row: 1 / -1; display: grid; grid-template-columns: subgrid; grid-template-rows: subgrid; }
.ne38-c .ne38-th { grid-row: 1 / -1; border-radius: 6px; } .ne38-c .ne38-b { grid-column: 2; grid-row: 1; padding-top: 2px; }
.ne38-c .ne38-b b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ne38-c > .t34-who { grid-column: 2; grid-row: 2; align-self: start; justify-self: start; margin-top: 6px; position: relative; z-index: 1; }
@media (max-width: 640px) { .ne38 { grid-template-columns: 1fr !important; } .ne38-c { grid-template-columns: 128px minmax(0, 1fr); } }

/* ---------- 8 · Marcas · ranking tipo lanzamientos (Product Hunt): número, imagen, nombre, creador y ♥ a la derecha ---------- */
.ph38 { max-width: 980px !important; gap: 2px !important; }
.ph38 li.ph38-r { grid-template-columns: 28px 72px minmax(0, 1fr) auto !important; grid-template-rows: auto auto; column-gap: 14px !important; row-gap: 2px !important; padding: 10px 12px !important; border-bottom: 1px solid var(--line, rgba(255, 255, 255, .08)); border-radius: 0 !important; }
.ph38 li.ph38-r:hover { background: rgba(255, 255, 255, .04); border-radius: 10px !important; }
.ph38 li.ph38-r > a.ph38-a { grid-column: 1 / 4; grid-row: 1 / -1; display: grid; grid-template-columns: subgrid; grid-template-rows: subgrid; align-items: center; }
.ph38-r .ph38-n, .ph38-r .ph38-cv { grid-row: 1 / -1; } .ph38-r .ph38-n { text-align: center; font-variant-numeric: tabular-nums; }
.ph38-r .ph38-b { grid-column: 3; grid-row: 1; align-self: end; } .ph38-r .ph38-b b { font-size: 16px; }
.ph38-r .ph38-b .small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ph38 li.ph38-r > a.t34-who { grid-column: 3; grid-row: 2; display: inline-flex !important; align-self: start; justify-self: start; position: relative; z-index: 1; margin-top: 2px; }
.ph38 li.ph38-r > .ht46 { grid-column: 4; grid-row: 1 / -1; align-self: center; flex-direction: column; gap: 2px; min-width: 62px; padding: 8px 10px; border-radius: 12px; }
.ph38 li.ph38-r > .ht46 .ht46-n { padding-left: 0; border-left: 0; font-size: 15px; }
.ph38 li.ph38-r > .ht46 .ht46-t { font-size: 11px; font-weight: 600; opacity: .85; }
@media (max-width: 640px) { .ph38 li.ph38-r { grid-template-columns: 20px 56px minmax(0, 1fr) auto !important; column-gap: 10px !important; padding: 10px 4px !important; } .ph38 li.ph38-r > .ht46 { min-width: 54px; padding: 6px 8px; } }

/* ---------- 9 · Business · fichas tipo alojamiento (Airbnb): foto, nombre, precio y creador debajo ---------- */
.ab38-c { display: grid; gap: 6px; align-content: start; } .ab38-c > .t34-who { justify-self: start; }

/* ---------- 10 · página del creador: secciones más juntas, el próximo estreno a todo lo ancho ---------- */
.zn45 { padding: 40px 0 34px !important; } .zn45:first-child { padding-top: 28px !important; }
.zn45-h { padding-bottom: 14px !important; max-width: none !important; }
.zn45 > section + section { margin-top: 22px !important; }
.zn45-tienda:has(.r34 > p:only-child) { padding-bottom: 28px !important; }
.cm39 { gap: 16px; }
@media (max-width: 640px) { .zn45 { padding: 28px 0 24px !important; } .fd42-hero { margin: 0 !important; } }

/* ---------- 11 · obra tipo serie (Crunchyroll): ficha legible en el teléfono ---------- */
.ep35g { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)) !important; }
.ep35c { min-width: 0; align-content: start; } .t34 { align-content: start; } .ep35-th { overflow: hidden; }
@media (max-width: 640px) {
  .cs46-in { grid-template-columns: minmax(0, 1fr) !important; gap: 16px !important; padding: 0 0 22px !important; }
  .cs46-po { aspect-ratio: 16/9 !important; width: 100%; box-shadow: none !important; -webkit-mask-image: linear-gradient(180deg, #000 70%, transparent); mask-image: linear-gradient(180deg, #000 70%, transparent); }
  .cs46-ban { background: linear-gradient(180deg, rgba(0, 0, 0, .35), rgba(0, 0, 0, .95) 38%), var(--bg) center/cover !important; }
  .cs46-meta { padding: 0 16px; gap: 8px !important; } .cs46-meta h1 { font-size: 28px !important; }
  .cs46-act { gap: 8px !important; } .cs46-btn { flex: 1 1 100%; text-align: center; padding: 12px 16px; font-size: 14px; }
  .ep35g { grid-template-columns: 1fr !important; }
}

/* ---------- 12 · obra tipo disco (Spotify): lista de canciones con encabezado y separadores ---------- */
.tl35 { position: relative; padding-top: 34px !important; }
.tl35::before, .tl35::after { position: absolute; top: 8px; font: 500 12px/1 var(--sans, inherit); letter-spacing: .08em; text-transform: uppercase; color: rgba(255, 255, 255, .62); }
.tl35::before { content: "#"; left: 12px; width: 32px; text-align: right; }
.tl35::after { content: "Título"; left: 58px; }
.tl35 { background: linear-gradient(rgba(255, 255, 255, .12), rgba(255, 255, 255, .12)) 0 26px / 100% 1px no-repeat; }
.tl35 a { padding: 8px 12px !important; } .tl35 .tt b { font-weight: 600; } .tl35 .d { min-width: 40px; text-align: right; }
.np49-list .tl35 { max-width: none; }

/* ---------- 13 · obra tipo juego (Steam): aire entre las cajas de compra y «Acerca de» ---------- */
.sg46-buy:last-of-type { margin-bottom: 34px; } .sg46-buy + .sg46-h { margin-top: 38px; }
.sg46-buy h3 { padding-right: 230px; }
@media (max-width: 640px) { .sg46 { padding: 18px 16px 10px !important; } .sg46 h1 { font-size: 26px; } .sg46-hero { padding: 8px; }
  .sg46-buy { padding: 14px 14px 56px; } .sg46-buy h3 { padding-right: 0; font-size: 17px; } .sg46-pb { right: 12px; bottom: -14px; }
  .sg46-ev { grid-template-columns: 1fr; gap: 4px; } }

/* ---------- 14 · ver (reproductor + Moments) en el teléfono: todo en una columna, nada se encima ---------- */
@media (max-width: 900px) {
  body .wv49 .wv49-body, body.tm66-on .wv49 .wv49-body, body .wv49 .wv49-body:has(#tm67box), body .wv49 .wv49-body:not(.viv69) { grid-template-columns: minmax(0, 1fr) !important; gap: 22px !important; padding: 18px 16px 48px !important; }
  .wv49-list { max-height: none !important; } .wv49-list a { grid-template-columns: 128px minmax(0, 1fr) !important; }
  .tw70 { grid-template-columns: minmax(0, 1fr) !important; } .tw70 > #tm67box { max-height: 56vh !important; border-left: 0 !important; border-top: 1px solid rgba(255, 255, 255, .08); }
}

/* ---------- 15 · Vivirlo junto a la obra (marcas, cómics, juegos…): en el teléfono la caja de Moments va debajo ---------- */
@media (max-width: 900px) {
  .wp35 .tw75, .reader .tw75, .tw75 { grid-template-columns: minmax(0, 1fr) !important; gap: 14px; }
  .tw75 > #tm75box { max-height: 60vh !important; margin: 0 16px; position: static !important; }
  .wp35 .tw75 > .h34 { min-height: 0 !important; padding-top: 72px; }
}
@media (max-width: 640px) {
  .h34-act { gap: 8px !important; } .h34-act .btn, .h34-act .ht46 { padding: 9px 14px !important; font-size: 14px !important; }
  .tm66 { justify-self: stretch !important; display: grid !important; } .tm66 > span:nth-child(2) { min-width: 0; }
}
.tm66-box { border-radius: 16px; }
.tw75 > #tm75box { margin-right: var(--gut, 32px); margin-top: 16px; margin-bottom: 16px; }
@media (max-width: 900px) { .tw75 > #tm75box { margin: 0 16px 8px !important; } }

/* ---------- 16 · contraste explícito ---------- */
.small.muted, .muted { color: rgba(246, 238, 228, .68); }
.t34-who { color: rgba(255, 255, 255, .7) !important; } .t34-who:hover { color: #fff !important; }
.r34-h a { color: rgba(255, 255, 255, .72) !important; } .r34-h a:hover { color: var(--amber) !important; }
.b34 { background: rgba(0, 0, 0, .82); } .b34.ok { background: rgba(0, 0, 0, .82); }
.foot .mono { color: rgba(246, 238, 228, .6); }
@media (max-width: 640px) { .foot { gap: 6px; } }

/* ---------- 17 · escenario del creador: el fondo se funde antes de los botones (texto limpio, misma presencia) ---------- */
.ch40-stage { background: linear-gradient(0deg, var(--bg-0, #0b0b0d) 4%, color-mix(in srgb, var(--bg-0, #0b0b0d) 82%, transparent) 30%, rgba(0, 0, 0, .45) 62%, rgba(0, 0, 0, .2) 100%), var(--bn) center/cover no-repeat !important; }
@media (max-width: 640px) { .ch40-stage { min-height: 420px !important; } .ch40-act .btn { padding: 8px 14px; font-size: 13.5px; } }

/* ---------- 18 · caja de Moments sin moments: una invitación en lugar del vacío (abre el mismo «Crea tu moment») ---------- */
.tm66-list li.tm75-empty { margin: auto 0; padding: 0; background: none; border: 0; animation: none; display: grid; place-items: center; }
.tm75-empty button { padding: 22px 14px; border: 0; background: none; cursor: pointer; text-align: center; font: 600 15px var(--sans, inherit); color: rgba(246, 238, 228, .68); }
.tm75-empty button:hover, .tm75-empty button:focus-visible { color: var(--amber); }

/* ---------- v92 · Mi estudio · «Colaboraciones para ti»: la mejor arriba, lista en un toque (mismas fichas, chips y botones del estudio) ---------- */
.cx92-h { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; } .cx92-h .st47-t { margin-bottom: 12px; }
.cx92-p { display: grid; gap: 6px; justify-items: start; padding: 14px 16px; margin-bottom: 10px; border-radius: 14px; background: rgba(255, 255, 255, .04); border: 1px solid var(--line2); }
.cx92-p > b { font: 400 22px/1.15 var(--serif); } .cx92-p > p { margin: 0; } .cx92-p .row { gap: 8px; margin-top: 4px; }
.cx92-x { font-size: 13px; color: var(--soft); } .cx92-x i { font-style: normal; color: var(--amber); margin: 0 5px; }
.cx92-wait { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: 0 0 10px; color: var(--soft); }
.cx92-g { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 12px; }
.cx92:not(.all) .cx92-c:nth-child(n+5) { display: none; }
.cx92-sent { grid-template-columns: minmax(0, 1fr) !important; grid-template-rows: none !important; } .cx92-sent .cx92-cv { display: none; } .cx92-sent .cx92-b p { margin: 4px 0 0; }
.cx92-c { display: grid; grid-template-rows: auto 1fr; min-width: 0; border-radius: 16px; overflow: hidden; background: rgba(255, 255, 255, .04); border: 1px solid var(--line2); }
.cx92-cv { display: block; aspect-ratio: 16/7; background: #15151b center/cover; }
.cx92-top { grid-column: 1 / -1; grid-template-columns: minmax(0, 340px) minmax(0, 1fr); grid-template-rows: none; border-color: color-mix(in srgb, var(--amber) 38%, transparent); }
.cx92-top .cx92-cv { aspect-ratio: auto; min-height: 100%; }
.cx92-b { display: grid; gap: 10px; align-content: start; min-width: 0; padding: 14px 16px 16px; }
.cx92-who { display: flex; gap: 10px; align-items: center; min-width: 0; } .cx92-who .av { width: 36px; height: 36px; }
.cx92-who > span { display: grid; gap: 2px; min-width: 0; } .cx92-who .small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cx92-n { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; } .cx92-n a { color: var(--ink); text-decoration: none; } .cx92-n a:hover { color: var(--amber); } .cx92-n b { font-size: 16px; }
.cx92-why { margin: 0; font-size: 14px; line-height: 1.45; color: rgba(246, 238, 228, .86); }
.cx92-opt { gap: 6px; align-items: center; } .cx92-opt .chip { padding: 4px 10px; font-size: 12px; } .cx92-opt i { width: 1px; height: 18px; background: var(--line2); margin: 0 4px; }
.cx92-also { display: grid; gap: 4px; } .cx92-also .chips { align-items: center; gap: 6px; } .cx92-also p { margin: 0; }
.cx92 .chip:disabled { opacity: .5; cursor: not-allowed; } .cx92 .chip:disabled:hover { background: transparent; color: var(--soft); border-color: var(--line2); }
.cx92-note summary { width: max-content; cursor: pointer; color: var(--soft); } .cx92-note summary:hover { color: var(--amber); } .cx92-note textarea { margin-top: 6px; }
.cx92-act { gap: 8px; } .cx92-act .btn[disabled] { opacity: .5; cursor: not-allowed; }
.cx92-more { margin-top: 12px; }
@media (min-width: 641px) { .cx92:not(:has(.cx92-c:nth-child(5))) .cx92-more { display: none; } }
.cx92-nudge { margin: 0 0 14px; padding: 10px 14px; border-radius: 12px; font-size: 14px; background: color-mix(in srgb, var(--amber) 9%, transparent); border: 1px solid color-mix(in srgb, var(--amber) 28%, transparent); }
.cx92-nudge .pill { margin: 0 2px; }
@media (max-width: 640px) {
  .cx92-g { grid-template-columns: minmax(0, 1fr); } .cx92-h { flex-wrap: wrap; }
  .cx92-top { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto 1fr; } .cx92-cv, .cx92-top .cx92-cv { aspect-ratio: 16/6; min-height: 0; }
  .cx92:not(.all) .cx92-c:nth-child(n+4) { display: none; }
}

/* vidrio 2026-10-29 (owner: «transparencia desenfocada»): only where one thing sits over another — the sticky bars over the page and the
   labels and bars over covers and video. Each keeps its shape, place, border and text; only its ground shows what passes beneath, blurred.
   The top bar is its world's --bg at 74% (its links stay AA over imagery); the labels keep their own grounds. Without backdrop-filter the
   top bar keeps its opaque ground; with reduced transparency everything is opaque. */
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .top { background: color-mix(in srgb, var(--bg) 74%, transparent); -webkit-backdrop-filter: blur(16px) saturate(140%); backdrop-filter: blur(16px) saturate(140%); }
  .worldbar, .corridor, .reader-top,
  .rp-bar, .heat, .room-always, .pc2-who, .b34, .ep35-th .d, .wv49-th i { -webkit-backdrop-filter: blur(16px) saturate(140%); backdrop-filter: blur(16px) saturate(140%); }
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .top { background: var(--bg); }
}
@media (prefers-reduced-transparency: reduce) {
  .top, .worldbar, body[data-world] .worldbar, .corridor, .reader-top { background: var(--bg); -webkit-backdrop-filter: none; backdrop-filter: none; }
  .rp-bar, .heat, .room-always, .pc2-who, .b34:not(.live):not(.new), .ep35-th .d, .wv49-th i { background: #0E0B09; -webkit-backdrop-filter: none; backdrop-filter: none; }
}
