/* =====================================================================
   QuizPoL · cabecera principal (botones redondos) + tour guiado "?"
   Se carga desde header.php, así que vale para todas las pantallas.
   ===================================================================== */
:root{--qp-ease:cubic-bezier(.22,1,.36,1);--qp-nav-bg:#f0f2f5;--qp-card:#fff;--qp-ink:#1f2a44;--qp-ink2:#5b6478;--qp-soft:#eef1f6}
body.dark-version{--qp-nav-bg:#1a2035;--qp-card:#202940;--qp-ink:#fff;--qp-ink2:rgba(255,255,255,.66);--qp-soft:#1a2035}

/* ---------- móvil/tablet: la barra no se sale por la derecha (examen-comun.css le añadía margen con ancho 100%) ---------- */
@media (max-width:991.98px){
  html body #navbarBlur.navbar-main{margin-left:0!important;margin-right:0!important}
  html body #navbarBlur #navbarInner{padding-left:16px!important;padding-right:16px!important}
}

/* ---------- fila de botones ---------- */
#navbarBlur .navbar-nav.qp-hnav{flex-direction:row;align-items:center;gap:12px}
#navbarBlur .navbar-nav.qp-hnav>li{padding-left:0!important;padding-right:0!important}
#navbarBlur .qp-oculto{display:none!important}

#navbarBlur .qp-hb{position:relative;display:inline-flex!important;align-items:center;justify-content:center;gap:7px;
  height:32px;min-width:32px;padding:0!important;margin:0!important;border:0;border-radius:999px;cursor:pointer;text-decoration:none;
  background:linear-gradient(135deg,#01a1df,#144684);color:#fff!important;font-size:.8rem;font-weight:700;line-height:1;
  box-shadow:0 6px 14px -8px rgba(20,70,132,.85);transition:transform .25s var(--qp-ease),box-shadow .25s,background .25s}
#navbarBlur .qp-hb i{margin:0!important;color:inherit!important;font-size:.85rem;line-height:1}
#navbarBlur .qp-hb span:not(.qp-hb-badge){color:inherit!important}
#navbarBlur .qp-hb:hover,#navbarBlur .qp-hb:focus-visible{transform:translateY(-1px) scale(1.08);outline:0;
  background:linear-gradient(135deg,#feac02,#f57c00);color:#1f1300!important;box-shadow:0 8px 18px -8px rgba(245,124,0,.9)}
#navbarBlur .qp-hb:hover i{animation:qp-hb-meneo .5s var(--qp-ease)}
@keyframes qp-hb-meneo{30%{transform:rotate(-14deg)}65%{transform:rotate(10deg)}}

/* Perfil: píldora con texto (en móvil, solo el círculo) */
#navbarBlur .qp-hb-pill{padding:0 14px 0 12px!important}
@media (max-width:575.98px){ #navbarBlur .qp-hb-pill{padding:0!important;width:32px} }

/* contadores */
#navbarBlur .qp-hb-badge{position:absolute;top:-6px;right:-8px;min-width:19px;height:19px;padding:0 5px;border-radius:10px;
  font:800 .62rem/15px system-ui,sans-serif;text-align:center;color:#fff;background:#e53935;border:2px solid var(--qp-nav-bg);
  box-shadow:0 3px 8px -3px rgba(0,0,0,.4);animation:qp-hb-pop .5s cubic-bezier(.34,1.56,.64,1) both}
#navbarBlur .qp-hb-badge.qp-warn{background:#feac02;color:#1f1300}
#navbarBlur .qp-hb-badge.qp-ok{background:#2e9e5b}
#navbarBlur .qp-hb-badge.qp-cero{background:#9aa3b5;animation:none}
@keyframes qp-hb-pop{from{transform:scale(0)}to{transform:scale(1)}}

/* "?" con pulso para que se vea */
#navbarBlur .qp-hb-tour{animation:qp-hb-pulso 2.6s ease-in-out infinite}
#navbarBlur .qp-hb-tour i{font-size:.9rem}
@keyframes qp-hb-pulso{0%,100%{box-shadow:0 0 0 0 rgba(254,172,2,.55)}50%{box-shadow:0 0 0 9px rgba(254,172,2,0)}}

/* menú hamburguesa (móvil/tablet) */
#navbarBlur .qp-hb .sidenav-toggler-inner{width:14px;height:auto;margin:0;display:flex;flex-direction:column;gap:3px}
#navbarBlur .qp-hb .sidenav-toggler-line{background-color:#fff!important;width:14px!important;height:2px;margin:0!important;border-radius:2px;transform:none!important}
#navbarBlur .qp-hb:hover .sidenav-toggler-line{background-color:#1f1300!important}

/* ---------- tour guiado ---------- */
.qp-tour{position:fixed;inset:0;z-index:10070;animation:qp-tin .35s ease both}
.qp-tour.qp-fuera{opacity:0;transition:opacity .3s}
@keyframes qp-tin{from{opacity:0}to{opacity:1}}
.qp-tour-foco{position:fixed;border-radius:18px;pointer-events:none;box-shadow:0 0 0 9999px rgba(1,20,32,.74);
  transition:top .5s var(--qp-ease),left .5s var(--qp-ease),width .5s var(--qp-ease),height .5s var(--qp-ease)}
.qp-tour-foco::before{content:"";position:absolute;inset:-4px;border-radius:22px;padding:3px;
  background:conic-gradient(from var(--qp-ang,0deg),#3dad02,#01a1df,#f61831,#feac02,#3dad02);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:qp-giro 3s linear infinite}
@property --qp-ang{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes qp-giro{to{--qp-ang:360deg}}
.qp-tour-foco.qp-pulso::after{content:"";position:absolute;inset:-4px;border-radius:22px;animation:qp-tpulso 1.2s ease-out}
@keyframes qp-tpulso{from{box-shadow:0 0 0 0 rgba(254,172,2,.8)}to{box-shadow:0 0 0 22px rgba(254,172,2,0)}}
.qp-tour-caja{position:fixed;width:360px;max-width:calc(100vw - 24px);background:var(--qp-card);color:var(--qp-ink);border-radius:20px;padding:16px 16px 14px;
  font-family:inherit;box-shadow:0 30px 60px -20px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.06);transition:top .45s var(--qp-ease),left .45s var(--qp-ease);overflow:hidden}
.qp-tour-caja::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,var(--c1),var(--c2))}
.qp-tour-caja.qp-in{animation:qp-tcaja .5s cubic-bezier(.34,1.56,.64,1) both}
@keyframes qp-tcaja{from{opacity:0;transform:translateY(14px) scale(.92)}to{opacity:1;transform:none}}
.qp-tour-caja.abajo{left:12px!important;right:12px;bottom:12px;top:auto!important;width:auto}
.qp-tour-top{display:flex;align-items:center;gap:12px}
.qp-tour-ic{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;flex-shrink:0;color:#fff;font-size:1.25rem;
  background:linear-gradient(135deg,var(--c1),var(--c2));box-shadow:0 10px 20px -10px var(--c2);animation:qp-tbote .7s cubic-bezier(.34,1.56,.64,1) .1s both}
@keyframes qp-tbote{from{transform:scale(.3) rotate(-25deg);opacity:0}to{transform:none;opacity:1}}
.qp-tour-top div{flex:1;min-width:0;display:flex;flex-direction:column}
.qp-tour-top small{font-size:.66rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--c2)}
body.dark-version .qp-tour-top small{color:var(--c1)}
.qp-tour-top b{font-size:1.05rem;font-weight:900;color:var(--qp-ink);line-height:1.2}
.qp-tour-x{border:0;background:var(--qp-soft);color:var(--qp-ink2);width:30px;height:30px;border-radius:50%;font-size:1.2rem;line-height:1;cursor:pointer;flex-shrink:0}
.qp-tour-caja p{margin:12px 2px!important;font-size:.88rem;line-height:1.55;color:var(--qp-ink2);text-align:left}
.qp-tour-prog{height:6px;border-radius:99px;background:var(--qp-soft);overflow:hidden;margin-bottom:12px}
.qp-tour-prog i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#3dad02,#01a1df,#f61831,#feac02);transition:width .5s var(--qp-ease)}
.qp-tour-nav{display:flex;align-items:center;gap:8px}
.qp-tour-nav span{flex:1}
.qp-tour-nav button{border:0;border-radius:12px;font:inherit;font-weight:800;font-size:.8rem;cursor:pointer;padding:9px 14px;transition:transform .2s var(--qp-ease)}
.qp-tour-nav button:hover{transform:translateY(-2px)}
.qp-tour-skip{background:none!important;color:var(--qp-ink2);padding:9px 6px!important}
.qp-tour-prev{background:var(--qp-soft);color:var(--qp-ink)}
.qp-tour-next{background:linear-gradient(135deg,var(--c1),var(--c2));color:#fff;box-shadow:0 8px 16px -8px var(--c2)}
.qp-tour-confeti{position:fixed;inset:0;z-index:10080;pointer-events:none}
@media (prefers-reduced-motion:reduce){ .qp-tour *,#navbarBlur .qp-hb,#navbarBlur .qp-hb *{animation:none!important;transition:none!important} }

/* =====================================================================
   Novedades · tarjeta de la campana (js/qp-novedades.js)
   ===================================================================== */
#navbarBlur .qp-nov-ring i{animation:qp-nov-campana 1.1s ease-in-out 2}
@keyframes qp-nov-campana{0%,100%{transform:rotate(0)}15%{transform:rotate(18deg)}30%{transform:rotate(-15deg)}45%{transform:rotate(10deg)}60%{transform:rotate(-6deg)}75%{transform:rotate(3deg)}}
#navbarBlur #qpNovBtn[aria-expanded="true"]{background:linear-gradient(135deg,#feac02,#f57c00);color:#1f1300!important}

.qp-nov{--qp-line:rgba(20,40,80,.09);position:fixed;z-index:10060;display:flex;flex-direction:column;background:var(--qp-card);color:var(--qp-ink);
  border-radius:22px;box-shadow:0 30px 70px -24px rgba(1,20,50,.55),0 0 0 1px var(--qp-line);font-size:.86rem;
  opacity:0;visibility:hidden;transform:translateY(-10px) scale(.96);transform-origin:calc(100% - 50px) -10px;
  transition:opacity .22s ease,transform .32s cubic-bezier(.34,1.56,.64,1),visibility 0s .32s}
body.dark-version .qp-nov{--qp-line:rgba(255,255,255,.08);box-shadow:0 30px 70px -20px rgba(0,0,0,.8),0 0 0 1px var(--qp-line)}
.qp-nov.abierta{opacity:1;visibility:visible;transform:none;transition:opacity .22s ease,transform .38s cubic-bezier(.34,1.56,.64,1),visibility 0s}
/* franja de colores de arriba: sigue la curva de las esquinas (antes se salía por los lados) */
.qp-nov::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:2;
  background:linear-gradient(90deg,#3dad02,#01a1df,#f61831,#feac02) top left/100% 4px no-repeat}
/* la flecha, del color de la franja en su sitio (lo pone qp-novedades.js en --qp-fl) */
.qp-nov-flecha{position:absolute;top:-7px;width:16px;height:16px;background:var(--qp-fl,#feac02);transform:rotate(45deg);border-radius:3px 0 0 0;z-index:1;
  clip-path:polygon(0 0,100% 0,0 100%)}   /* solo el pico de arriba: la mitad de abajo pintaría encima de la tarjeta */

.qp-nov-head{display:flex;align-items:center;gap:10px;padding:18px 16px 12px}
.qp-nov-hic{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#01a1df,#144684);
  box-shadow:0 8px 16px -8px #144684;flex-shrink:0}
.qp-nov.abierta .qp-nov-hic i{animation:qp-nov-campana 1s ease-in-out .15s}
.qp-nov-head b{font-size:1.08rem;font-weight:900;color:var(--qp-ink)}
.qp-nov-num{min-width:24px;height:22px;padding:0 7px;border-radius:11px;display:grid;place-items:center;font-weight:800;font-size:.72rem;color:#fff;
  background:linear-gradient(135deg,#f61831,#c2102a);box-shadow:0 4px 10px -4px #f61831;transition:background .3s,transform .3s}
.qp-nov-num.qp-cero{background:var(--qp-soft);color:var(--qp-ink2);box-shadow:none}
.qp-nov-esp{flex:1}
.qp-nov-todas{border:1.5px solid rgba(1,161,223,.45);background:rgba(1,161,223,.08);color:#0180b2;border-radius:12px;padding:6px 11px;font:inherit;font-size:.75rem;
  font-weight:800;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:all .25s}
body.dark-version .qp-nov-todas{color:#5cc9f5}
.qp-nov-todas:hover:not(:disabled){background:#01a1df;color:#fff;border-color:#01a1df;transform:translateY(-1px)}
.qp-nov-todas:disabled{opacity:.45;cursor:default}
.qp-nov-todas.ok{background:#3dad02;border-color:#3dad02;color:#fff;animation:qp-nov-ok .5s cubic-bezier(.34,1.56,.64,1)}
@keyframes qp-nov-ok{40%{transform:scale(1.12)}}
.qp-nov-x{border:0;background:var(--qp-soft);color:var(--qp-ink2);width:32px;height:32px;border-radius:50%;font-size:1.25rem;line-height:1;cursor:pointer;flex-shrink:0;transition:transform .25s}
.qp-nov-x:hover{transform:rotate(90deg)}

.qp-nov-filtros{display:flex;gap:6px;padding:0 16px 12px;overflow-x:auto;scrollbar-width:none;border-bottom:1px solid var(--qp-line)}
.qp-nov-filtros::-webkit-scrollbar{display:none}
.qp-nov-chip{border:0;border-radius:999px;padding:6px 12px;font:inherit;font-size:.74rem;font-weight:800;cursor:pointer;background:var(--qp-soft);color:var(--qp-ink2);
  display:inline-flex;align-items:center;gap:6px;white-space:nowrap;transition:all .25s}
.qp-nov-chip em{font-style:normal;min-width:18px;height:18px;border-radius:9px;padding:0 5px;display:grid;place-items:center;background:#f61831;color:#fff;font-size:.62rem}
.qp-nov-chip.on{background:linear-gradient(135deg,#01a1df,#144684);color:#fff;box-shadow:0 6px 14px -8px #144684}
.qp-nov-chip.on em{background:#fff;color:#144684}

.qp-nov-admin{display:flex;align-items:center;gap:12px;margin:12px 16px 0;padding:12px 14px;border-radius:16px;text-decoration:none!important;color:#1f1300!important;
  background:linear-gradient(135deg,#ffd166,#feac02);box-shadow:0 10px 20px -12px #f57c00;transition:transform .25s}
.qp-nov-admin:hover{transform:translateY(-2px)}
.qp-nov-admin>span{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:rgba(255,255,255,.45)}
.qp-nov-admin div{flex:1;display:flex;flex-direction:column}
.qp-nov-admin b{font-weight:900}
.qp-nov-admin small{font-size:.72rem;opacity:.8}

.qp-nov-lista{flex:1;min-height:120px;overflow-y:auto;overscroll-behavior:contain;padding:4px 8px 8px;scrollbar-width:thin}
.qp-nov-sec{font-size:.66rem;font-weight:900;letter-spacing:.09em;text-transform:uppercase;color:var(--qp-ink2);padding:14px 10px 6px}
.qp-nov-item{position:relative;display:flex;gap:12px;padding:12px 38px 12px 10px;border-radius:16px;cursor:pointer;outline:0;
  transition:background .25s,transform .25s,opacity .3s,max-height .3s;animation:qp-nov-in .45s cubic-bezier(.22,1,.36,1) both;animation-delay:var(--d,0ms)}
@keyframes qp-nov-in{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}
.qp-nov-item+.qp-nov-item::before{content:"";position:absolute;left:58px;right:12px;top:0;border-top:1px solid var(--qp-line)}
.qp-nov-item:hover,.qp-nov-item:focus-visible{background:var(--qp-soft)}
.qp-nov-item:hover::before,.qp-nov-item:hover+.qp-nov-item::before{opacity:0}
.qp-nov-item.nueva{background:linear-gradient(90deg,rgba(1,161,223,.07),transparent 70%)}
.qp-nov-item.fuera{opacity:0;transform:translateX(40px)}
.qp-nov-iic{--c1:#01a1df;--c2:#144684;width:40px;height:40px;border-radius:13px;flex-shrink:0;display:grid;place-items:center;color:#fff;font-size:.95rem;
  background:linear-gradient(135deg,var(--c1),var(--c2));box-shadow:0 8px 16px -9px var(--c2);transition:transform .3s cubic-bezier(.34,1.56,.64,1)}
.qp-nov-item:hover .qp-nov-iic{transform:rotate(-8deg) scale(1.08)}
.t-aviso .qp-nov-iic{--c1:#ff5a6a;--c2:#d90f25}
.t-rep .qp-nov-iic{--c1:#ffc53d;--c2:#e08a00}
.t-repok .qp-nov-iic{--c1:#56d11a;--c2:#2b8a00}
.t-prof .qp-nov-iic{--c1:#b57bff;--c2:#6d28d9}
.t-fis .qp-nov-iic{--c1:#15b5b2;--c2:#0c7c8b} .t-fishoy .qp-nov-iic{--c1:#ffc53d;--c2:#f07b00} .t-fisex .qp-nov-iic{--c1:#ff5a6a;--c2:#d90f25}
.t-mem .qp-nov-iic,.t-mem .qp-nov-ir{--c1:#a855f7;--c2:#5b21b6}
.t-mem .qp-nov-tag{color:#6d28d9} body.dark-version .t-mem .qp-nov-tag{color:#c4b5fd}
.t-fis .qp-nov-tag{color:#0c8b8b} .t-fishoy .qp-nov-tag{color:#d46a00} .t-fisex .qp-nov-tag{color:#d90f25}
body.dark-version .t-fis .qp-nov-tag{color:#4fd8d4} body.dark-version .t-fishoy .qp-nov-tag{color:#ffc53d} body.dark-version .t-fisex .qp-nov-tag{color:#ff7b88}
.t-fis .qp-nov-ir{--c1:#15b5b2;--c2:#0c7c8b} .t-fishoy .qp-nov-ir{--c1:#ffc53d;--c2:#f07b00} .t-fisex .qp-nov-ir{--c1:#ff5a6a;--c2:#d90f25}
.qp-nov-chip[hidden]{display:none}
.qp-nov-cuerpo{flex:1;min-width:0}
.qp-nov-l1{display:flex;align-items:center;gap:7px}
.qp-nov-l1 b{font-weight:800;color:var(--qp-ink);font-size:.9rem;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.qp-nov-punto{width:8px;height:8px;border-radius:50%;background:#feac02;flex-shrink:0;opacity:0;transform:scale(0);transition:all .3s}
.nueva .qp-nov-punto{opacity:1;transform:none;animation:qp-nov-latido 1.8s ease-in-out infinite}
@keyframes qp-nov-latido{0%,100%{box-shadow:0 0 0 0 rgba(254,172,2,.6)}50%{box-shadow:0 0 0 5px rgba(254,172,2,0)}}
.qp-nov-l2{margin-top:3px;color:var(--qp-ink2);font-size:.8rem;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.qp-nov-tag{font-weight:800;color:#0180b2}
body.dark-version .qp-nov-tag{color:#5cc9f5}
.t-aviso .qp-nov-tag{color:#d90f25} .t-rep .qp-nov-tag{color:#c47600} .t-repok .qp-nov-tag{color:#2b8a00} .t-prof .qp-nov-tag{color:#7c3aed}
body.dark-version .t-aviso .qp-nov-tag{color:#ff7b88} body.dark-version .t-rep .qp-nov-tag{color:#ffc53d} body.dark-version .t-repok .qp-nov-tag{color:#7ee04a} body.dark-version .t-prof .qp-nov-tag{color:#c9a2ff}
.qp-nov-l3{display:flex;align-items:center;gap:12px;margin-top:5px;font-size:.72rem;color:var(--qp-ink2);opacity:.85}
.qp-nov-mas{font-weight:800;display:inline-flex;align-items:center;gap:4px}
.qp-nov-mas i{font-size:.6rem;transition:transform .3s}
.qp-nov-item.abierta .qp-nov-mas i{transform:rotate(180deg)}
.qp-nov-item.abierta .qp-nov-l2{-webkit-line-clamp:unset;display:none}
.qp-nov-exp{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s cubic-bezier(.22,1,.36,1)}
.qp-nov-exp>div{overflow:hidden;min-height:0}
.qp-nov-item.abierta .qp-nov-exp{grid-template-rows:1fr}
.qp-nov-exp img{display:block;width:100%;max-height:150px;object-fit:cover;border-radius:12px;margin-top:10px}
.qp-nov-exp p{margin:10px 0 0!important;font-size:.82rem;line-height:1.55;color:var(--qp-ink);white-space:normal;word-break:break-word}
.qp-nov-ir{display:inline-flex;align-items:center;gap:7px;margin-top:10px;padding:8px 13px;border-radius:11px;font-weight:800;font-size:.76rem;color:#fff!important;
  text-decoration:none!important;background:linear-gradient(135deg,var(--c1,#01a1df),var(--c2,#144684));box-shadow:0 8px 16px -9px #144684;transition:transform .2s}
.t-aviso .qp-nov-ir{--c1:#ff5a6a;--c2:#d90f25} .t-rep .qp-nov-ir{--c1:#ffc53d;--c2:#e08a00} .t-repok .qp-nov-ir{--c1:#56d11a;--c2:#2b8a00} .t-prof .qp-nov-ir{--c1:#b57bff;--c2:#6d28d9}
.qp-nov-ir:hover{transform:translateX(3px)}
.qp-nov-quitar{position:absolute;top:10px;right:8px;width:26px;height:26px;border-radius:50%;border:0;background:none;color:var(--qp-ink2);font-size:1.15rem;line-height:1;
  cursor:pointer;opacity:.55;transition:all .2s}
.qp-nov-quitar:hover{opacity:1;background:rgba(246,24,49,.12);color:#f61831;transform:rotate(90deg)}

.qp-nov-vacio{text-align:center;padding:34px 20px 30px;animation:qp-nov-in .5s cubic-bezier(.22,1,.36,1) both}
.qp-nov-vacio span{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;margin:0 auto 12px;font-size:1.5rem;color:#fff;
  background:linear-gradient(135deg,#56d11a,#2b8a00);box-shadow:0 14px 26px -12px #2b8a00;animation:qp-tbote .7s cubic-bezier(.34,1.56,.64,1) both}
.qp-nov-vacio.err span{background:linear-gradient(135deg,#ff5a6a,#d90f25)}
.qp-nov-vacio b{display:block;font-size:1rem;font-weight:900;color:var(--qp-ink)}
.qp-nov-vacio p{margin:6px auto 0!important;max-width:280px;color:var(--qp-ink2);font-size:.8rem;line-height:1.5}
.qp-nov-carga{padding:8px}
.qp-nov-carga i{display:block;height:58px;border-radius:14px;margin:8px 0;background:linear-gradient(90deg,var(--qp-soft) 25%,rgba(1,161,223,.10) 50%,var(--qp-soft) 75%);
  background-size:200% 100%;animation:qp-nov-brillo 1.2s linear infinite}
@keyframes qp-nov-brillo{to{background-position:-200% 0}}

.qp-nov-pie{display:flex;border-top:1px solid var(--qp-line)}
.qp-nov-pie a{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;padding:13px 6px;font-weight:800;font-size:.74rem;color:var(--qp-ink2)!important;
  text-decoration:none!important;transition:color .2s,background .2s}
.qp-nov-pie a+a{border-left:1px solid var(--qp-line)}
.qp-nov-pie a:hover{color:#01a1df!important;background:var(--qp-soft)}
.qp-nov-pie a:last-child{border-radius:0 0 22px 0} .qp-nov-pie a:first-child{border-radius:0 0 0 22px}
@media (max-width:575.98px){ .qp-nov-todas span{display:none} .qp-nov-pie a{font-size:.7rem} }
@media (prefers-reduced-motion:reduce){ .qp-nov,.qp-nov *{animation:none!important;transition:none!important} }
/* con muchas novedades la lista no debe aplastar la cabecera, los filtros ni el pie */
.qp-nov-head,.qp-nov-filtros,.qp-nov-admin-hueco,.qp-nov-pie{flex-shrink:0}
.qp-nov-lista{min-height:0}
.qp-nov-chip{flex-shrink:0;line-height:1.2}
/* admin: botón "ver bienvenida" en el inicio */
#navbarBlur .qp-hb-bienv{background:linear-gradient(135deg,#56d11a,#2b8a00)}

/* 01/10/2026 · Formato del MENSAJE de las actualizaciones (ventana «+» del muro): párrafos con espacio natural, títulos, listas y citas.
   Los mismos estilos que el editor de css/actualizaciones-admin.css (lo que se escribe es lo que se ve). */
.modal-alerta-mensaje p{margin:0 0 .8em}
.modal-alerta-mensaje h2{font-size:1.3rem;font-weight:900;line-height:1.25;margin:1.1em 0 .45em;color:#012a3c}
.modal-alerta-mensaje h3{font-size:1.1rem;font-weight:800;line-height:1.3;margin:1em 0 .4em;color:#012a3c}
.modal-alerta-mensaje h4{font-size:.95rem;font-weight:800;line-height:1.3;margin:.9em 0 .35em;color:#1e4ea8}
.modal-alerta-mensaje ul,.modal-alerta-mensaje ol{margin:0 0 .8em;padding-left:1.3em}
.modal-alerta-mensaje li{margin:.25em 0}
.modal-alerta-mensaje blockquote{margin:0 0 .8em;padding:.6em .9em;border-left:4px solid #38bdf8;background:#f0f9ff;border-radius:0 10px 10px 0;color:#334155}
.modal-alerta-mensaje a{color:#1e4ea8;font-weight:700;text-decoration:underline}
.modal-alerta-mensaje img{max-width:100%;height:auto;border-radius:10px}
.modal-alerta-mensaje table{width:100%;border-collapse:collapse;margin:0 0 .8em;font-size:.88em}
.modal-alerta-mensaje td,.modal-alerta-mensaje th{border:1px solid #e2e8f0;padding:6px 8px}
.modal-alerta-mensaje>:first-child{margin-top:0}.modal-alerta-mensaje>:last-child{margin-bottom:0}
body.dark-version .modal-alerta-mensaje h2,body.dark-version .modal-alerta-mensaje h3{color:#fff}
body.dark-version .modal-alerta-mensaje h4,body.dark-version .modal-alerta-mensaje a{color:#7dd3fc}
body.dark-version .modal-alerta-mensaje blockquote{background:rgba(56,189,248,.1);color:#e2e8f0}

/* 02/10/2026 · NOTIFICACIONES: las nuevas resaltadas (franja azul) y las leídas más suaves con la marca «✔✔ Leída» (estaba en local desde el 28/09) */
.qp-nov::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(90deg,#3dad02,#01a1df,#f61831,#feac02) top/100% 4px no-repeat}
.qp-nov-item.nueva{background:rgba(1,161,223,.10);box-shadow:inset 4px 0 0 #01a1df}
.qp-nov-item.nueva:hover,.qp-nov-item.nueva:focus-visible{background:rgba(1,161,223,.16)}
.qp-nov-item.nueva::before,.qp-nov-item.nueva+.qp-nov-item::before{opacity:0}
body.dark-version .qp-nov-item.nueva{background:rgba(92,201,245,.13);box-shadow:inset 4px 0 0 #5cc9f5}
body.dark-version .qp-nov-item.nueva:hover{background:rgba(92,201,245,.19)}
.qp-nov-item:not(.nueva) .qp-nov-l1 b{font-weight:700;color:var(--qp-ink2)}
.qp-nov-item:not(.nueva) .qp-nov-iic{opacity:.72;filter:saturate(.8)}
.qp-nov-leida{display:none;align-items:center;gap:4px;font-weight:800;color:#2b8a00}
.qp-nov-item:not(.nueva) .qp-nov-leida{display:inline-flex}
body.dark-version .qp-nov-leida{color:#7ee04a}

/* =====================================================================
   BOTONES DE LA CABECERA · OPCIÓN F elegida por el dueño (02/10/2026): una sola barra blanca agrupada,
   iconos con los colores del puzle del logo (A verde, B azul, C rojo, D amarillo) y «Perfil» en azul marino QuizPoL.
   Va al final para mandar sobre los botones redondos azules de arriba.
   ===================================================================== */
#navbarBlur .navbar-nav.qp-hnav{flex:0 0 auto;width:fit-content;max-width:100%;margin-left:auto!important;gap:4px;padding:4px 6px;background:var(--qp-card);border:1px solid #dde3ec;border-radius:999px;
  box-shadow:0 6px 18px -12px rgba(20,70,132,.45)}
body.dark-version #navbarBlur .navbar-nav.qp-hnav{border-color:rgba(255,255,255,.08);box-shadow:0 6px 18px -12px rgba(0,0,0,.8)}
#navbarBlur .qp-hb{--qp-c:#144684;background:transparent;color:var(--qp-c)!important;box-shadow:none}
#navbarBlur .qp-hb:hover,#navbarBlur .qp-hb:focus-visible{background:color-mix(in srgb,var(--qp-c) 13%,transparent);color:var(--qp-c)!important;box-shadow:none;transform:scale(1.08)}
#navbarBlur .qp-hb[title="Incidencias"]{--qp-c:#e09a00}
#navbarBlur #qpNovBtn{--qp-c:#e5202e}
#navbarBlur .qp-hb-bienv{--qp-c:#1a8fd8}
#navbarBlur .qp-hb-tour{--qp-c:#2db34a;animation:qp-hb-pulso-v 2.6s ease-in-out infinite}
@keyframes qp-hb-pulso-v{0%,100%{box-shadow:0 0 0 0 rgba(45,179,74,.5)}50%{box-shadow:0 0 0 8px rgba(45,179,74,0)}}
#navbarBlur #darkModeToggle,#navbarBlur #iconNavbarSidenav{--qp-c:#1f2433}
body.dark-version #navbarBlur #darkModeToggle,body.dark-version #navbarBlur #iconNavbarSidenav{--qp-c:#e8edf7}
body.dark-version #navbarBlur .qp-hb[title="Incidencias"]{--qp-c:#ffc53d}
body.dark-version #navbarBlur #qpNovBtn{--qp-c:#ff6b74}
body.dark-version #navbarBlur .qp-hb-tour{--qp-c:#4fd36b}
#navbarBlur .qp-hb .sidenav-toggler-line,#navbarBlur .qp-hb:hover .sidenav-toggler-line{background-color:var(--qp-c)!important}
/* Perfil: la única píldora rellena (azul marino QuizPoL) */
#navbarBlur .qp-hb.qp-hb-pill{background:#144684;color:#fff!important}
#navbarBlur .qp-hb.qp-hb-pill:hover,#navbarBlur .qp-hb.qp-hb-pill:focus-visible{background:#01a1df;color:#fff!important}
/* contadores: el borde del color de la barra */
#navbarBlur .qp-hb-badge{border-color:var(--qp-card);top:-5px;right:-6px}

/* MÓVIL (04/10): sin el nombre de la página arriba (no ocupa espacio); los botones de la cabecera quedan solos, a la derecha */
@media (max-width:575.98px){
  #navbarBlur nav[aria-label="breadcrumb"]{display:none!important}
  #navbarBlur #navbarInner{justify-content:flex-end!important}
}

/* iPad / iPhone (04/10): en Safari «100vh» es MÁS ALTO que lo que se ve (cuenta como si no hubiera barras del navegador) y la página
   (que se desplaza dentro de <main>, limitado a 100vh) se salía por abajo: los botones «pegados abajo» (Guardar cambios, Comenzar, LISTO
   de las ventanas…) quedaban medio ocultos. Con «100dvh» la altura es la que se ve de verdad. No cambia nada en el ordenador. */
@supports (height:100dvh){
  main.main-content.max-height-vh-100{max-height:100dvh!important}
  body:has(#qg){min-height:100dvh!important}
  .rf-modal-box,.es-modal-box{max-height:calc(100dvh - 32px)!important}
  .qg-pop-c{max-height:calc((100dvh - 40px) / var(--qp-letra,1))!important}
  .hj-body,.inv-body{min-height:100dvh!important}
}

/* Botones redondos de CERRAR (✕) en iPad/iPhone (04/10): Safari les añadía su relleno y salían ovalados y con la ✕ desplazada.
   Tours, novedades, ventanas de exámenes, generador, estadísticas… siempre un círculo con la ✕ centrada. */
.qp-tour-x,.qp-nov-x,.qps-x,.qz-ed-x,.es-pod-x,.rf-mx,.qg-x{-webkit-appearance:none;appearance:none;box-sizing:border-box;padding:0!important;
  display:inline-grid!important;place-items:center;line-height:1!important;aspect-ratio:1/1;flex-shrink:0}
.qp-tour-x{min-width:30px;min-height:30px}
