/* ============================================================
   NEXUS — Asistente multimedia de formación IYC
   Estilos del widget · aislados bajo .iyc-nexus / .cc-* / .nx-*
   ------------------------------------------------------------
   · Convive en la misma página con local_ichat (widget.css usa las
     mismas clases .cc-* pero scopeadas bajo .iyc-chat). Aquí TODO
     va scopeado bajo .iyc-nexus para no pisar los estilos de iChat.
   · No depende de colors_and_type.css externo: las fuentes de marca
     se declaran aquí mismo desde ./fonts/.
   ============================================================ */

@font-face { font-family:"DM Sans"; src:url("fonts/DMSans-Variable.ttf") format("truetype-variations"); font-weight:100 1000; font-style:normal; font-display:swap; }
@font-face { font-family:"DM Sans"; src:url("fonts/DMSans-Italic-Variable.ttf") format("truetype-variations"); font-weight:100 1000; font-style:italic; font-display:swap; }
@font-face { font-family:"Darker Grotesque"; src:url("fonts/DarkerGrotesque-Light.ttf")     format("truetype"); font-weight:300; font-display:swap; }
@font-face { font-family:"Darker Grotesque"; src:url("fonts/DarkerGrotesque-Regular.ttf")   format("truetype"); font-weight:400; font-display:swap; }
@font-face { font-family:"Darker Grotesque"; src:url("fonts/DarkerGrotesque-Medium.ttf")    format("truetype"); font-weight:500; font-display:swap; }
@font-face { font-family:"Darker Grotesque"; src:url("fonts/DarkerGrotesque-SemiBold.ttf")  format("truetype"); font-weight:600; font-display:swap; }
@font-face { font-family:"Darker Grotesque"; src:url("fonts/DarkerGrotesque-Bold.ttf")      format("truetype"); font-weight:700; font-display:swap; }
@font-face { font-family:"Darker Grotesque"; src:url("fonts/DarkerGrotesque-ExtraBold.ttf") format("truetype"); font-weight:800; font-display:swap; }
@font-face { font-family:"Darker Grotesque"; src:url("fonts/DarkerGrotesque-Black.ttf")     format("truetype"); font-weight:900; font-display:swap; }

.iyc-nexus, .iyc-nexus *{ box-sizing:border-box; }

.iyc-nexus{
  --w-ink:#001C55; --w-ink2:#3a4a78; --w-ink3:#7e89ab;
  --w-line:rgba(0,28,85,0.12); --w-line2:rgba(0,28,85,0.07);
  --w-soft:#f3f5fb;
  --grad:linear-gradient(135deg,#110AEE 0%,#F72585 100%);
  --ok:#18b368; --alert:#FF2D55;
  --elev:0 28px 70px -26px rgba(0,0,0,0.55), 0 6px 18px -8px rgba(0,0,0,0.35);
  --eo:cubic-bezier(.16,1,.3,1);
  --cc-sans:"DM Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --cc-display:"Darker Grotesque", "DM Sans", system-ui, sans-serif;

  /* z-index deliberadamente por DEBAJO del de iChat (9999). iChat no se va a
     tocar, asi que Nexus se garantiza el orden correcto por su propio lado:
     en reposo (cerrado) siempre pierde el empate frente a iChat -> iChat
     jamas queda tapado por el lanzador de Nexus. Cuando Nexus se abre, sube
     a 10010 (ver mas abajo) y pasa por encima sin depender de iChat. */
  position:fixed; left:20px; bottom:20px; z-index:9997;
  font-family:var(--cc-sans);
}
/* Si iChat también está activo en la página, Nexus se desplaza para no solaparse. */
.iyc-nexus--offset{ left:106px; }
.iyc-nexus--right{ left:auto; right:20px; }

/* ---- launcher cerrado ---- */
.iyc-nexus .cc-launcher{
  position:relative; width:66px; height:66px; border-radius:50%; cursor:pointer; border:0;
  background:var(--grad); box-shadow:0 16px 40px -12px rgba(17,10,238,0.55), inset 0 1px 0 rgba(255,255,255,0.25);
  display:grid; place-items:center; color:#fff;
  transition:transform .26s var(--eo), box-shadow .26s;
}
.iyc-nexus .cc-launcher::before{ content:""; position:absolute; inset:-3px; border-radius:50%; z-index:-1;
  background:conic-gradient(from 120deg,#110AEE,#F72585,#110AEE); opacity:.6; filter:blur(6px); }
.iyc-nexus .cc-launcher:hover{ transform:translateY(-2px) scale(1.04); box-shadow:0 22px 50px -12px rgba(247,37,133,0.6); }
.iyc-nexus .cc-name{ font:800 15px/1 var(--cc-display); letter-spacing:-0.01em; color:#fff; text-shadow:0 1px 8px rgba(0,28,85,0.35); }

.iyc-nexus .cc-badge{
  position:absolute; top:-2px; right:-2px; min-width:22px; height:22px; padding:0 6px; border-radius:999px;
  background:var(--alert); color:#fff; border:2.5px solid #fff; font:700 12px/1 var(--cc-sans);
  display:grid; place-items:center; transform:scale(0); transition:transform .34s var(--eo); z-index:2;
}
.iyc-nexus .cc-ping{ position:absolute; inset:-7px; border-radius:50%; border:2px solid var(--alert); opacity:0; pointer-events:none; }

/* backdrop (solo modo expandido) */
.nx-backdrop{ position:fixed; inset:0; z-index:9990; background:rgba(0,16,50,0.55); backdrop-filter:blur(4px); opacity:0; pointer-events:none; transition:opacity .34s var(--eo); }
body.nx-expanded .nx-backdrop{ opacity:1; pointer-events:auto; }

/* ---- panel (open) ---- */
.iyc-nexus .cc-panel{
  position:absolute; left:0; bottom:0; width:400px; max-height:min(600px, calc(100vh - 40px));
  background:#fff; color:var(--w-ink); border-radius:22px; overflow:hidden;
  box-shadow:var(--elev); border:1px solid rgba(255,255,255,0.5);
  display:flex; flex-direction:column;
  transform-origin:bottom left; transform:translateY(20px) scale(.92); opacity:0; pointer-events:none;
  transition:transform .42s var(--eo), opacity .3s, width .42s var(--eo), height .42s var(--eo), max-height .42s var(--eo);
}
.iyc-nexus .cc-header{ position:relative; display:flex; align-items:center; gap:13px; padding:16px 16px 14px; border-bottom:1px solid var(--w-line2); overflow:hidden;
  background:linear-gradient(120deg, rgba(17,10,238,0.09), rgba(247,37,133,0.09)); }
.iyc-nexus .cc-header::after{ content:""; position:absolute; inset:0; pointer-events:none; opacity:.5;
  background:repeating-linear-gradient(115deg, transparent 0 9px, rgba(17,10,238,0.04) 9px 10px); }
.iyc-nexus .cc-mark{ position:relative; width:42px; height:42px; flex:0 0 42px; border-radius:12px; background:var(--grad); display:grid; place-items:center; color:#fff; box-shadow:0 10px 24px -10px rgba(17,10,238,0.65); }
.iyc-nexus .cc-mark svg{ width:24px; height:24px; }
.iyc-nexus .cc-id{ flex:1; min-width:0; position:relative; }
.iyc-nexus .cc-id .nm{ font:800 18px/1.05 var(--cc-display); letter-spacing:-0.01em; }
.iyc-nexus .cc-id .rl{ font:500 12.5px/1.3 var(--cc-sans); color:var(--w-ink2); margin-top:1px; }
.iyc-nexus .cc-hbtn{ position:relative; width:36px; height:36px; border-radius:50%; border:1px solid var(--w-line); background:#fff; color:var(--w-ink2); display:grid; place-items:center; cursor:pointer; transition:background .2s, transform .2s, color .2s; }
.iyc-nexus .cc-hbtn:hover{ background:var(--w-soft); color:var(--w-ink); }
.iyc-nexus .cc-hbtn svg{ width:18px; height:18px; }
.iyc-nexus .cc-x:hover{ transform:rotate(90deg); }
.iyc-nexus .cc-expand svg .ic-collapse{ display:none; }
body.nx-expanded .iyc-nexus .cc-expand svg .ic-expand{ display:none; }
body.nx-expanded .iyc-nexus .cc-expand svg .ic-collapse{ display:inline; }

/* scroll area */
.iyc-nexus .cc-scroll{ flex:1; overflow-y:auto; overflow-x:hidden; padding:16px 15px 6px; display:flex; flex-direction:column; gap:12px; scroll-behavior:smooth; }
.iyc-nexus .cc-scroll::-webkit-scrollbar{ width:7px; } .iyc-nexus .cc-scroll::-webkit-scrollbar-thumb{ background:rgba(0,28,85,0.16); border-radius:8px; }

/* editorial greeting */
.iyc-nexus .cc-greet h2{ font:800 24px/1.08 var(--cc-display); letter-spacing:-0.01em; margin:0; }
.iyc-nexus .cc-greet h2 .pk{ background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
.iyc-nexus .cc-greet p{ font:400 13.5px/1.5 var(--cc-sans); color:var(--w-ink2); margin:8px 0 0; }

/* option pills */
.iyc-nexus .cc-opts{ display:flex; flex-direction:column; gap:9px; }
.iyc-nexus .cc-opt{
  display:flex; align-items:center; gap:12px; width:100%; text-align:left; cursor:pointer;
  font:500 14.5px/1.3 var(--cc-sans); border-radius:16px; padding:13px 15px;
  background:#fff; color:var(--w-ink); border:1px solid var(--w-line);
  transition:box-shadow .24s, border-color .24s, background .24s, transform .18s var(--eo);
}
.iyc-nexus .cc-opt .ico{ width:34px; height:34px; flex:0 0 34px; border-radius:10px; display:grid; place-items:center; background:rgba(17,10,238,0.08); color:#110AEE; transition:background .24s, color .24s; }
.iyc-nexus .cc-opt .ico svg{ width:18px; height:18px; }
.iyc-nexus .cc-opt .lbl{ flex:1; }
.iyc-nexus .cc-opt .arr{ width:24px; height:24px; flex:0 0 24px; border-radius:50%; border:1px solid var(--w-line); color:var(--w-ink3); display:grid; place-items:center; transition:transform .3s var(--eo), background .24s, color .24s, border-color .24s; }
.iyc-nexus .cc-opt .arr svg{ width:13px; height:13px; }
.iyc-nexus .cc-opt:hover{ border-color:rgba(247,37,133,0.5); box-shadow:0 10px 26px -14px rgba(247,37,133,0.5); }
.iyc-nexus .cc-opt:hover .arr{ transform:rotate(-45deg); }
.iyc-nexus .cc-opt--primary{ background:var(--grad); color:#fff; border-color:transparent; }
.iyc-nexus .cc-opt--primary .ico{ background:rgba(255,255,255,0.18); color:#fff; }
.iyc-nexus .cc-opt--primary .arr{ border-color:rgba(255,255,255,0.5); color:#fff; }
.iyc-nexus .cc-opt--primary:hover{ box-shadow:0 12px 30px -12px rgba(247,37,133,0.6); }
.iyc-nexus .cc-opt--primary:hover .arr{ transform:rotate(-45deg); background:rgba(255,255,255,0.18); }

/* chat message bubbles */
.iyc-nexus .cc-msg{ max-width:88%; font:400 14.5px/1.5 var(--cc-sans); padding:12px 15px; border-radius:18px; animation:nx-cc-rise .4s var(--eo) both; }
@keyframes nx-cc-rise{ from{ transform:translateY(10px); opacity:0; } to{ transform:none; opacity:1; } }
@keyframes nx-cc-fade-up{ from{ opacity:0; transform:translateY(12px); } to{ opacity:1; transform:none; } }
.iyc-nexus .cc-msg--bot{ align-self:flex-start; background:var(--w-soft); border:1px solid var(--w-line2); border-bottom-left-radius:6px; color:var(--w-ink); }
.iyc-nexus .cc-msg--user{ align-self:flex-end; background:var(--grad); color:#fff; border-bottom-right-radius:6px; }
.iyc-nexus .cc-row-av{ display:flex; gap:8px; align-items:flex-end; align-self:flex-start; max-width:92%; }
.iyc-nexus .cc-row-av .mini{ width:26px; height:26px; flex:0 0 26px; border-radius:8px; background:var(--grad); display:grid; place-items:center; color:#fff; margin-bottom:2px; }
.iyc-nexus .cc-row-av .mini svg{ width:15px; height:15px; }
.iyc-nexus .cc-row-av .cc-msg--bot{ border-bottom-left-radius:6px; }

/* full-width media block (bajo un mensaje del bot) */
.iyc-nexus .cc-media{ align-self:flex-start; width:100%; margin-left:34px; max-width:calc(100% - 34px); animation:nx-cc-rise .44s var(--eo) both; }

/* --- AUDIO player --- */
.iyc-nexus .nx-audio{ display:flex; align-items:center; gap:12px; padding:12px 14px; border-radius:16px; border:1px solid var(--w-line); background:#fff; box-shadow:0 10px 28px -18px rgba(0,28,85,0.4); }
.iyc-nexus .nx-audio-play{ width:44px; height:44px; flex:0 0 44px; border-radius:50%; border:0; background:var(--grad); color:#fff; display:grid; place-items:center; cursor:pointer; transition:transform .2s var(--eo); }
.iyc-nexus .nx-audio-play:hover{ transform:scale(1.05); }
.iyc-nexus .nx-audio-play:active{ transform:scale(.93); }
.iyc-nexus .nx-audio-play svg{ width:19px; height:19px; }
.iyc-nexus .nx-audio-play .ic-pause{ display:none; }
.iyc-nexus .nx-audio.playing .ic-play{ display:none; }
.iyc-nexus .nx-audio.playing .ic-pause{ display:inline; }
.iyc-nexus .nx-audio-mid{ flex:1; min-width:0; }
.iyc-nexus .nx-audio-title{ font:600 12.5px/1.2 var(--cc-sans); color:var(--w-ink); margin-bottom:7px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.iyc-nexus .nx-wave{ display:flex; align-items:center; gap:2.5px; height:26px; cursor:pointer; }
.iyc-nexus .nx-wave i{ flex:1; border-radius:2px; background:rgba(0,28,85,0.16); transition:background .15s; }
.iyc-nexus .nx-wave i.on{ background:#F72585; }
.iyc-nexus .nx-audio-foot{ display:flex; align-items:center; justify-content:space-between; margin-top:6px; }
.iyc-nexus .nx-audio-time{ font:600 11.5px/1 var(--cc-sans); color:var(--w-ink3); font-variant-numeric:tabular-nums; }
.iyc-nexus .nx-audio-rate{ border:1px solid var(--w-line); background:#fff; color:var(--w-ink2); font:700 11px/1 var(--cc-sans); border-radius:999px; padding:5px 9px; cursor:pointer; transition:background .2s, color .2s; }
.iyc-nexus .nx-audio-rate:hover{ background:var(--w-soft); color:var(--w-ink); }

/* --- CARD SLIDER --- */
.iyc-nexus .nx-slider{ position:relative; }
.iyc-nexus .nx-track{ display:flex; gap:11px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth; padding:2px 2px 12px; -ms-overflow-style:none; scrollbar-width:none; }
.iyc-nexus .nx-track::-webkit-scrollbar{ display:none; }
.iyc-nexus .nx-slide{ scroll-snap-align:start; flex:0 0 84%; border-radius:16px; overflow:hidden; border:1px solid var(--w-line); background:#fff; box-shadow:0 10px 26px -18px rgba(0,28,85,0.4); }
.iyc-nexus .nx-slide-top{ height:96px; display:grid; place-items:center; color:#fff; position:relative; }
.iyc-nexus .nx-slide-top svg{ width:38px; height:38px; opacity:.95; }
.iyc-nexus .nx-slide-top .num{ position:absolute; top:10px; left:12px; font:800 13px/1 var(--cc-display); color:rgba(255,255,255,0.85); }
.iyc-nexus .nx-slide-body{ padding:12px 14px 15px; }
.iyc-nexus .nx-slide-body h4{ font:700 15px/1.2 var(--cc-display); color:var(--w-ink); margin:0 0 5px; }
.iyc-nexus .nx-slide-body p{ font:400 13px/1.5 var(--cc-sans); color:var(--w-ink2); margin:0; }
.iyc-nexus .nx-nav{ position:absolute; top:38px; width:34px; height:34px; border-radius:50%; border:1px solid var(--w-line); background:#fff; color:var(--w-ink); display:grid; place-items:center; cursor:pointer; box-shadow:0 8px 20px -8px rgba(0,28,85,0.4); z-index:2; transition:transform .2s, background .2s; }
.iyc-nexus .nx-nav:hover{ background:var(--w-soft); }
.iyc-nexus .nx-nav:active{ transform:scale(.9); }
.iyc-nexus .nx-nav svg{ width:16px; height:16px; }
.iyc-nexus .nx-nav.prev{ left:-6px; } .iyc-nexus .nx-nav.next{ right:-6px; }
.iyc-nexus .nx-nav[disabled]{ opacity:.3; pointer-events:none; }
.iyc-nexus .nx-dots{ display:flex; gap:6px; justify-content:center; }
.iyc-nexus .nx-dots i{ width:6px; height:6px; border-radius:50%; background:rgba(0,28,85,0.18); transition:width .24s var(--eo), background .24s; }
.iyc-nexus .nx-dots i.on{ width:18px; border-radius:4px; background:var(--grad); }

/* --- ACCORDION --- */
.iyc-nexus .nx-acc{ display:flex; flex-direction:column; gap:8px; }
.iyc-nexus .nx-acc-item{ border:1px solid var(--w-line); border-radius:14px; overflow:hidden; background:#fff; }
.iyc-nexus .nx-acc-item.open{ border-color:rgba(247,37,133,0.4); box-shadow:0 10px 26px -18px rgba(247,37,133,0.5); }
.iyc-nexus .nx-acc-head{ width:100%; display:flex; align-items:center; gap:11px; text-align:left; background:#fff; border:0; cursor:pointer; padding:13px 14px; font:600 14px/1.3 var(--cc-sans); color:var(--w-ink); }
.iyc-nexus .nx-acc-head .n{ width:26px; height:26px; flex:0 0 26px; border-radius:8px; display:grid; place-items:center; background:rgba(17,10,238,0.08); color:#110AEE; font:800 12px/1 var(--cc-display); transition:background .24s, color .24s; }
.iyc-nexus .nx-acc-item.open .nx-acc-head .n{ background:var(--grad); color:#fff; }
.iyc-nexus .nx-acc-head .t{ flex:1; }
.iyc-nexus .nx-acc-head .chev{ width:20px; height:20px; flex:0 0 20px; color:var(--w-ink3); transition:transform .3s var(--eo); }
.iyc-nexus .nx-acc-item.open .nx-acc-head .chev{ transform:rotate(180deg); }
.iyc-nexus .nx-acc-body{ max-height:0; overflow:hidden; transition:max-height .34s var(--eo); }
.iyc-nexus .nx-acc-inner{ padding:0 14px 14px 51px; font:400 13px/1.55 var(--cc-sans); color:var(--w-ink2); }

/* --- FIGURE (imagen generada) --- */
.iyc-nexus .nx-fig{ margin:0; border-radius:16px; overflow:hidden; border:1px solid var(--w-line); background:#fff; box-shadow:0 10px 28px -18px rgba(0,28,85,0.4); }
.iyc-nexus .nx-fig-frame{ position:relative; }
.iyc-nexus .nx-fig-frame img{ display:block; width:100%; height:auto; }
.iyc-nexus .nx-fig-tools{ position:absolute; top:9px; right:9px; display:flex; gap:7px; }
.iyc-nexus .nx-tool{ width:34px; height:34px; border-radius:10px; border:0; background:rgba(255,255,255,0.94); color:var(--w-ink); display:grid; place-items:center; cursor:pointer; box-shadow:0 6px 16px -6px rgba(0,28,85,0.5); transition:transform .18s var(--eo), background .2s; }
.iyc-nexus .nx-tool:hover{ transform:translateY(-1px); background:#fff; }
.iyc-nexus .nx-tool:active{ transform:scale(.9); }
.iyc-nexus .nx-tool svg{ width:17px; height:17px; }
.iyc-nexus .nx-fig figcaption{ display:flex; align-items:center; gap:7px; padding:10px 13px; font:600 12px/1.3 var(--cc-sans); color:var(--w-ink2); }
.iyc-nexus .nx-fig figcaption svg{ width:15px; height:15px; color:#F72585; }

/* lightbox (fuera de .iyc-nexus a propósito: cubre toda la pantalla) */
.nx-lightbox{ position:fixed; inset:0; z-index:10050; background:rgba(0,12,40,0.82); backdrop-filter:blur(6px); display:grid; place-items:center; padding:clamp(16px,4vw,48px); opacity:0; pointer-events:none; transition:opacity .3s var(--eo, cubic-bezier(.16,1,.3,1)); font-family:"DM Sans", system-ui, sans-serif; }
.nx-lightbox.on{ opacity:1; pointer-events:auto; }
.nx-lightbox img{ max-width:100%; max-height:88vh; border-radius:14px; box-shadow:0 40px 90px -30px rgba(0,0,0,0.7); transform:scale(.96); transition:transform .34s cubic-bezier(.16,1,.3,1); }
.nx-lightbox.on img{ transform:scale(1); }
.nx-lb-close{ position:absolute; top:20px; right:20px; width:46px; height:46px; border-radius:50%; border:1px solid rgba(255,255,255,0.25); background:rgba(255,255,255,0.1); color:#fff; display:grid; place-items:center; cursor:pointer; transition:background .2s, transform .2s; }
.nx-lb-close:hover{ background:rgba(255,255,255,0.2); transform:rotate(90deg); }
.nx-lb-close svg{ width:22px; height:22px; }
.nx-lb-dl{ position:absolute; bottom:24px; left:50%; transform:translateX(-50%); display:flex; align-items:center; gap:9px; padding:11px 18px; border-radius:999px; border:0; background:linear-gradient(135deg,#110AEE 0%,#F72585 100%); color:#fff; font:600 13.5px/1 "DM Sans", sans-serif; cursor:pointer; box-shadow:0 16px 36px -14px rgba(247,37,133,0.6); }
.nx-lb-dl svg{ width:16px; height:16px; }

/* --- TRANSCRIPT sincronizada --- */
.iyc-nexus .nx-trans{ border:1px solid var(--w-line); border-radius:16px; background:#fff; overflow:hidden; box-shadow:0 10px 28px -18px rgba(0,28,85,0.4); }
.iyc-nexus .nx-trans-head{ display:flex; align-items:center; gap:11px; padding:11px 13px; border-bottom:1px solid var(--w-line2); background:linear-gradient(120deg, rgba(17,10,238,0.06), rgba(247,37,133,0.06)); }
.iyc-nexus .nx-trans-play{ width:38px; height:38px; flex:0 0 38px; border-radius:50%; border:0; background:var(--grad); color:#fff; display:grid; place-items:center; cursor:pointer; transition:transform .2s var(--eo); }
.iyc-nexus .nx-trans-play:active{ transform:scale(.92); }
.iyc-nexus .nx-trans-play svg{ width:16px; height:16px; }
.iyc-nexus .nx-trans-play .ic-pause{ display:none; } .iyc-nexus .nx-trans.playing .ic-play{ display:none; } .iyc-nexus .nx-trans.playing .ic-pause{ display:inline; }
.iyc-nexus .nx-trans-meta{ flex:1; min-width:0; }
.iyc-nexus .nx-trans-meta .tt{ font:600 12.5px/1.2 var(--cc-sans); color:var(--w-ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.iyc-nexus .nx-trans-meta .tm{ font:600 11px/1 var(--cc-sans); color:var(--w-ink3); margin-top:3px; font-variant-numeric:tabular-nums; }
.iyc-nexus .nx-trans-lines{ max-height:196px; overflow-y:auto; padding:6px 4px; }
.iyc-nexus .nx-trans-lines::-webkit-scrollbar{ width:6px; } .iyc-nexus .nx-trans-lines::-webkit-scrollbar-thumb{ background:rgba(0,28,85,0.16); border-radius:8px; }
.iyc-nexus .nx-trans-lines p{ margin:0; padding:8px 11px; border-radius:10px; font:400 13.5px/1.5 var(--cc-sans); color:var(--w-ink3); cursor:pointer; display:flex; gap:9px; transition:background .2s, color .2s; }
.iyc-nexus .nx-trans-lines p .ts{ flex:0 0 32px; font:600 11px/1.55 var(--cc-sans); color:var(--w-ink3); font-variant-numeric:tabular-nums; }
.iyc-nexus .nx-trans-lines p:hover{ background:var(--w-soft); }
.iyc-nexus .nx-trans-lines p.on{ background:rgba(247,37,133,0.09); color:var(--w-ink); font-weight:500; }
.iyc-nexus .nx-trans-lines p.on .ts{ color:#F72585; }

/* --- QUIZ inline --- */
.iyc-nexus .nx-quiz{ border:1px solid var(--w-line); border-radius:16px; background:#fff; padding:14px; box-shadow:0 10px 28px -18px rgba(0,28,85,0.4); }
.iyc-nexus .nx-quiz-top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:11px; }
.iyc-nexus .nx-quiz-step{ font:700 10.5px/1 var(--cc-sans); letter-spacing:.09em; text-transform:uppercase; color:#F72585; }
.iyc-nexus .nx-quiz-prog{ display:flex; gap:5px; }
.iyc-nexus .nx-quiz-prog i{ width:20px; height:5px; border-radius:3px; background:rgba(0,28,85,0.14); transition:background .3s; }
.iyc-nexus .nx-quiz-prog i.on{ background:var(--grad); }
.iyc-nexus .nx-quiz-q{ font:700 15.5px/1.35 var(--cc-display); color:var(--w-ink); margin-bottom:12px; }
.iyc-nexus .nx-quiz-opts{ display:flex; flex-direction:column; gap:8px; }
.iyc-nexus .nx-quiz-a{ text-align:left; border:1px solid var(--w-line); background:#fff; border-radius:12px; padding:11px 13px; font:500 13.5px/1.35 var(--cc-sans); color:var(--w-ink); cursor:pointer; display:flex; align-items:center; gap:10px; transition:border-color .2s, background .2s; }
.iyc-nexus .nx-quiz-a .mk{ width:20px; height:20px; flex:0 0 20px; border-radius:50%; border:1.5px solid var(--w-line); display:grid; place-items:center; color:#fff; }
.iyc-nexus .nx-quiz-a .mk svg{ width:12px; height:12px; opacity:0; }
.iyc-nexus .nx-quiz-a:hover{ border-color:rgba(247,37,133,0.5); }
.iyc-nexus .nx-quiz-a.correct{ border-color:var(--ok); background:rgba(24,179,104,0.09); }
.iyc-nexus .nx-quiz-a.correct .mk{ background:var(--ok); border-color:var(--ok); }
.iyc-nexus .nx-quiz-a.correct .mk svg{ opacity:1; }
.iyc-nexus .nx-quiz-a.wrong{ border-color:var(--alert); background:rgba(255,45,85,0.07); }
.iyc-nexus .nx-quiz-a.wrong .mk{ background:var(--alert); border-color:var(--alert); }
.iyc-nexus .nx-quiz-a.wrong .mk svg{ opacity:1; }
.iyc-nexus .nx-quiz-a[disabled]{ cursor:default; }
.iyc-nexus .nx-quiz-fb{ margin-top:11px; font:400 13px/1.5 var(--cc-sans); color:var(--w-ink2); padding:11px 13px; border-radius:12px; background:var(--w-soft); border:1px solid var(--w-line2); animation:nx-cc-rise .3s var(--eo) both; }
.iyc-nexus .nx-quiz-fb b{ color:var(--w-ink); }
.iyc-nexus .nx-quiz-next{ margin-top:11px; width:100%; border:0; border-radius:12px; padding:12px; font:600 13.5px/1 var(--cc-sans); color:#fff; background:var(--grad); cursor:pointer; transition:transform .18s var(--eo); }
.iyc-nexus .nx-quiz-next:active{ transform:scale(.98); }
.iyc-nexus .nx-quiz-done{ text-align:center; padding:10px 4px; }
.iyc-nexus .nx-quiz-done .sc{ font:800 42px/1 var(--cc-display); background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
.iyc-nexus .nx-quiz-done .lb{ font:500 13.5px/1.45 var(--cc-sans); color:var(--w-ink2); margin-top:8px; }

/* --- CHECKLIST --- */
.iyc-nexus .nx-check{ border:1px solid var(--w-line); border-radius:16px; background:#fff; overflow:hidden; box-shadow:0 10px 28px -18px rgba(0,28,85,0.4); }
.iyc-nexus .nx-check-head{ padding:13px 14px; border-bottom:1px solid var(--w-line2); }
.iyc-nexus .nx-check-head .tt{ font:700 13.5px/1.2 var(--cc-display); color:var(--w-ink); }
.iyc-nexus .nx-check-bar{ margin-top:9px; height:6px; border-radius:4px; background:rgba(0,28,85,0.1); overflow:hidden; }
.iyc-nexus .nx-check-fill{ height:100%; width:0; border-radius:4px; background:var(--grad); transition:width .35s var(--eo); }
.iyc-nexus .nx-check-count{ font:600 11px/1 var(--cc-sans); color:var(--w-ink3); margin-top:7px; }
.iyc-nexus .nx-check-list{ padding:6px; display:flex; flex-direction:column; }
.iyc-nexus .nx-check-item{ display:flex; align-items:center; gap:11px; padding:11px 10px; border-radius:11px; cursor:pointer; font:500 13.5px/1.4 var(--cc-sans); color:var(--w-ink); transition:background .18s; }
.iyc-nexus .nx-check-item:hover{ background:var(--w-soft); }
.iyc-nexus .nx-check-item .bx{ width:22px; height:22px; flex:0 0 22px; border-radius:7px; border:1.5px solid var(--w-line); display:grid; place-items:center; color:#fff; transition:background .2s, border-color .2s; }
.iyc-nexus .nx-check-item .bx svg{ width:13px; height:13px; opacity:0; transition:opacity .2s; }
.iyc-nexus .nx-check-item.done .bx{ background:var(--grad); border-color:transparent; }
.iyc-nexus .nx-check-item.done .bx svg{ opacity:1; }
.iyc-nexus .nx-check-item.done .tx{ color:var(--w-ink3); text-decoration:line-through; }

/* --- FLASHCARDS (voltear) --- */
.iyc-nexus .nx-flash{ display:flex; flex-direction:column; gap:12px; align-items:center; }
.iyc-nexus .nx-flash-card{ width:100%; height:186px; perspective:1200px; cursor:pointer; }
.iyc-nexus .nx-flash-inner{ position:relative; width:100%; height:100%; transition:transform .5s var(--eo); transform-style:preserve-3d; }
.iyc-nexus .nx-flash-card.flip .nx-flash-inner{ transform:rotateY(180deg); }
.iyc-nexus .nx-flash-face{ position:absolute; inset:0; -webkit-backface-visibility:hidden; backface-visibility:hidden; border-radius:16px; padding:22px; display:flex; flex-direction:column; justify-content:center; text-align:center; box-shadow:0 12px 30px -18px rgba(0,28,85,0.5); }
.iyc-nexus .nx-flash-front{ background:#fff; border:1px solid var(--w-line); }
.iyc-nexus .nx-flash-front .k{ font:700 10px/1 var(--cc-sans); letter-spacing:.14em; text-transform:uppercase; color:#F72585; margin-bottom:11px; }
.iyc-nexus .nx-flash-front .q{ font:700 18px/1.3 var(--cc-display); color:var(--w-ink); }
.iyc-nexus .nx-flash-back{ background:var(--grad); color:#fff; transform:rotateY(180deg); }
.iyc-nexus .nx-flash-back .k{ font:700 10px/1 var(--cc-sans); letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,0.78); margin-bottom:11px; }
.iyc-nexus .nx-flash-back .a{ font:500 15px/1.5 var(--cc-sans); }
.iyc-nexus .nx-flash-nav{ display:flex; align-items:center; gap:14px; }
.iyc-nexus .nx-flash-nav button{ width:34px; height:34px; border-radius:50%; border:1px solid var(--w-line); background:#fff; color:var(--w-ink); display:grid; place-items:center; cursor:pointer; transition:background .2s; }
.iyc-nexus .nx-flash-nav button:hover{ background:var(--w-soft); }
.iyc-nexus .nx-flash-nav button svg{ width:15px; height:15px; }
.iyc-nexus .nx-flash-nav .pos{ font:600 12.5px/1 var(--cc-sans); color:var(--w-ink2); font-variant-numeric:tabular-nums; min-width:46px; text-align:center; }
.iyc-nexus .nx-flash-hint{ font:500 11px/1 var(--cc-sans); color:var(--w-ink3); }

/* typing indicator */
.iyc-nexus .cc-typing{ align-self:flex-start; display:flex; gap:4px; background:var(--w-soft); border:1px solid var(--w-line2); padding:13px 15px; border-radius:18px 18px 18px 6px; margin-left:34px; }
.iyc-nexus .cc-typing i{ width:7px; height:7px; border-radius:50%; background:var(--w-ink3); animation:nx-cc-blink 1.2s infinite ease-in-out; }
.iyc-nexus .cc-typing i:nth-child(2){ animation-delay:.18s; } .iyc-nexus .cc-typing i:nth-child(3){ animation-delay:.36s; }
@keyframes nx-cc-blink{ 0%,80%,100%{ opacity:.3; transform:translateY(0); } 40%{ opacity:1; transform:translateY(-3px); } }

/* input bar */
.iyc-nexus .cc-input{ display:flex; align-items:center; gap:9px; padding:12px 14px calc(14px + env(safe-area-inset-bottom)); border-top:1px solid var(--w-line2); }
.iyc-nexus .cc-input input{ flex:1; height:46px; border-radius:999px; border:1px solid var(--w-line); background:#fff; padding:0 18px; font:400 14.5px/1 var(--cc-sans); color:var(--w-ink); outline:none; transition:border-color .2s, box-shadow .2s; }
.iyc-nexus .cc-input input::placeholder{ color:var(--w-ink3); }
.iyc-nexus .cc-input input:focus{ border-color:rgba(247,37,133,0.5); box-shadow:0 0 0 3px rgba(247,37,133,0.14); }
.iyc-nexus .cc-send{ width:46px; height:46px; flex:0 0 46px; border-radius:50%; border:0; background:var(--grad); color:#fff; display:grid; place-items:center; cursor:pointer; transition:transform .2s var(--eo), box-shadow .24s; }
.iyc-nexus .cc-send:hover{ transform:translateY(-1px); box-shadow:0 12px 28px -10px rgba(247,37,133,0.6); }
.iyc-nexus .cc-send:active{ transform:scale(.94); }
.iyc-nexus .cc-send svg{ width:20px; height:20px; }
.iyc-nexus .cc-footer{ text-align:center; font:500 11px/1 var(--cc-sans); color:var(--w-ink3); padding:0 0 12px; }
.iyc-nexus .cc-footer b{ color:var(--w-ink2); font-weight:600; }

/* ---- open state toggles ---- */
.iyc-nexus[data-open="true"] .cc-panel{ transform:none; opacity:1; pointer-events:auto; }
.iyc-nexus[data-open="true"] .cc-launcher{ transform:scale(.9); opacity:0; pointer-events:none; }
/* El panel abierto debe pintarse SIEMPRE por encima del lanzador de cualquier
   widget vecino (p.ej. iChat), sin depender de qué widget se monto ultimo en
   el DOM. Antes ambos widgets compartian el mismo z-index (9999) y ganaba el
   que cargara despues; con esto gana siempre el que esta realmente abierto. */
.iyc-nexus[data-open="true"]{ z-index:10010; }

/* ---- expanded (modal centrado) ---- */
body.nx-expanded .iyc-nexus[data-open="true"] .cc-panel{
  position:fixed; left:50%; top:50%; bottom:auto;
  width:min(720px, calc(100vw - 48px)); height:min(760px, calc(100vh - 64px)); max-height:calc(100vh - 64px);
  transform:translate(-50%,-50%); transform-origin:center;
}
body.nx-expanded .iyc-nexus[data-open="true"] .cc-media{ max-width:calc(100% - 34px); }

/* entrance */
.iyc-nexus[data-open="true"] .cc-greet{ animation:nx-cc-fade-up .5s var(--eo) both; animation-delay:.10s; }
.iyc-nexus[data-open="true"] .cc-opts .cc-opt{ animation:nx-cc-fade-up .5s var(--eo) both; }
.iyc-nexus[data-open="true"] .cc-opts .cc-opt:nth-child(1){ animation-delay:.18s; }
.iyc-nexus[data-open="true"] .cc-opts .cc-opt:nth-child(2){ animation-delay:.26s; }
.iyc-nexus[data-open="true"] .cc-opts .cc-opt:nth-child(3){ animation-delay:.34s; }
.iyc-nexus[data-alert="true"] .cc-badge{ transform:scale(1); }
.iyc-nexus[data-alert="true"] .cc-ping{ animation:nx-cc-ping 2.4s var(--eo) infinite; }
@keyframes nx-cc-ping{ 0%{ transform:scale(.8); opacity:.6; } 70%,100%{ transform:scale(1.5); opacity:0; } }

@media (prefers-reduced-motion: reduce){
  .iyc-nexus, .iyc-nexus *{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
}

/* ============ MOBILE: full viewport ============ */
@media (max-width:560px){
  .iyc-nexus{ left:16px; bottom:16px; }
  .iyc-nexus--offset{ left:94px; }
  .iyc-nexus .cc-panel{
    position:fixed; inset:0; width:100vw; height:100dvh; max-height:none; border-radius:0; border:0;
    transform:translateY(100%); transform-origin:center;
  }
  .iyc-nexus[data-open="true"] .cc-panel{ transform:none; }
  body.nx-expanded .iyc-nexus[data-open="true"] .cc-panel{ position:fixed; inset:0; left:0; top:0; width:100vw; height:100dvh; max-height:none; transform:none; }
  .iyc-nexus .cc-header{ padding-top:max(16px, env(safe-area-inset-top)); }
  .iyc-nexus .cc-greet h2{ font-size:32px; }
  .iyc-nexus .cc-scroll{ padding-left:18px; padding-right:18px; }
  .iyc-nexus .nx-slide{ flex:0 0 78%; }
}