/* ══════════════════════════════════════════════════════════
   app.css — Extracted from index.html
   CapiEBAU main application styles
══════════════════════════════════════════════════════════ */

/* ── Style block 1 ── */
:root{
  --p:#7c3aed;--p2:#a855f7;--p3:#f472b6;
  --c:#06b6d4;--y:#fbbf24;
  --bg:linear-gradient(160deg,#faf5ff,#f0f9ff,#fff7ed);
  --card:#fff;--border:#e5e7eb;--text:#1f2937;--muted:#6b7280;
  --radius:16px;--shadow:0 4px 24px rgba(124,58,237,.12);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scrollbar-width:thin;scrollbar-color:var(--border) transparent;}
body{font-family:'Nunito',sans-serif;background:var(--bg);color:var(--text);min-height:100vh;display:flex;flex-direction:column;overflow-x:hidden;}

/* ══ HEADER ══ */
header{
  background:linear-gradient(135deg,#4c1d95,#7c3aed,#a855f7);
  padding:0 1rem;min-height:56px;position:sticky;top:0;z-index:200;
  display:flex;align-items:center;gap:.5rem;
  box-shadow:0 4px 20px rgba(124,58,237,.4);
}
.hdr-left{display:flex;align-items:center;gap:.5rem;flex-shrink:0;}
.hdr-center{display:flex;align-items:center;justify-content:center;gap:.4rem;flex:1;}
.hdr-right{display:flex;align-items:center;gap:.4rem;flex-shrink:0;}
.hdr-logo-img{width:34px;height:34px;border-radius:50%;object-fit:cover;}
.hdr-xp-img{width:14px;height:14px;border-radius:50%;object-fit:cover;vertical-align:middle;}
.hdr-icon-btn{background:rgba(255,255,255,.12);border:1.5px solid rgba(255,255,255,.2);
  color:#fff;width:34px;height:34px;border-radius:10px;cursor:pointer;font-size:.9rem;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative;
  transition:background .15s;}
.hdr-icon-btn:hover{background:rgba(255,255,255,.22);}
.notif-dot{position:absolute;top:-3px;right:-3px;width:8px;height:8px;
  background:#ef4444;border-radius:50%;border:1.5px solid #7c3aed;}
.hdr-register-btn{background:linear-gradient(135deg,#f472b6,#a855f7);
  border:none;color:#fff;font-family:'Nunito',sans-serif;font-weight:900;
  font-size:.72rem;padding:.32rem .85rem;border-radius:20px;cursor:pointer;
  white-space:nowrap;flex-shrink:0;box-shadow:0 2px 8px rgba(244,114,182,.4);
  transition:transform .15s,box-shadow .15s;}
.hdr-register-btn:hover{transform:translateY(-1px);box-shadow:0 4px 14px rgba(244,114,182,.6);}
.hamburger{
  width:34px;height:34px;background:rgba(255,255,255,.12);border:1.5px solid rgba(255,255,255,.2);
  border-radius:9px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  cursor:pointer;flex-shrink:0;transition:all .2s;
}
.hamburger:hover{background:rgba(255,255,255,.22);}
.hamburger span{display:block;width:15px;height:2px;background:#fff;border-radius:1px;transition:all .3s;}
.hamburger.open span:nth-child(1){transform:translateY(6px) rotate(45deg);}
.hamburger.open span:nth-child(2){opacity:0;}
.hamburger.open span:nth-child(3){transform:translateY(-6px) rotate(-45deg);}
.logo-area{display:flex;align-items:center;gap:.5rem;}
.logo-capy{line-height:1;cursor:pointer;transition:transform .2s;user-select:none;}
.logo-capy:hover{transform:scale(1.12) rotate(-5deg);}
.logo-text{font-size:.95rem;font-weight:900;color:#fff;letter-spacing:-.01em;white-space:nowrap;}
.logo-text small{display:block;font-size:.55rem;font-weight:700;color:rgba(255,255,255,.65);letter-spacing:.08em;text-transform:uppercase;}
.xp-badge{display:flex;align-items:center;gap:.3rem;background:rgba(251,191,36,.15);
  border:1.5px solid rgba(251,191,36,.35);border-radius:20px;padding:.22rem .65rem;
  font-size:.7rem;font-weight:900;color:#fbbf24;white-space:nowrap;}
.usage-badge{font-size:.65rem;font-weight:800;padding:.22rem .6rem;border-radius:10px;
  border:1.5px solid rgba(255,255,255,.25);background:rgba(255,255,255,.12);
  color:rgba(255,255,255,.85);cursor:pointer;white-space:nowrap;transition:all .15s;}
.usage-badge:hover{background:rgba(255,255,255,.2);}
.usage-badge.pro{background:rgba(167,139,250,.3);border-color:rgba(167,139,250,.6);color:#c4b5fd;}
.usage-badge.familia{background:rgba(6,182,212,.2);border-color:rgba(6,182,212,.4);color:#67e8f9;}

/* ── CLASES PARTICULARES ──────────────────────────────────── */
.hdr-clases-btn{background:linear-gradient(135deg,#f59e0b,#d97706);border:none;color:#fff;font-size:.68rem;font-weight:900;padding:.25rem .65rem;border-radius:12px;cursor:pointer;font-family:'Nunito',sans-serif;letter-spacing:.02em;transition:opacity .15s;white-space:nowrap;}
.hdr-clases-btn:hover{opacity:.85;}

.clases-bg{display:none;position:fixed;inset:0;z-index:750;background:rgba(10,5,25,.85);backdrop-filter:blur(12px);align-items:center;justify-content:center;}
.clases-bg.show{display:flex;}
.clases-modal{background:#0f0a1e;border:1px solid rgba(167,139,250,.25);border-radius:24px;width:100%;max-width:780px;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 32px 80px rgba(0,0,0,.6);animation:slideUpModal .3s cubic-bezier(.4,0,.2,1) both;}
@keyframes slideUpModal{from{opacity:0;transform:translateY(24px);}to{opacity:1;transform:translateY(0);}}

.clases-head{background:linear-gradient(135deg,#1a0a3e,#2d1060);padding:1.4rem 1.8rem 1rem;flex-shrink:0;}
.clases-head-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:.4rem;}
.clases-head-title{font-size:1.2rem;font-weight:900;color:#fff;letter-spacing:-.01em;}
.clases-head-sub{font-size:.75rem;color:rgba(196,181,253,.7);font-weight:600;}
.clases-head-close{background:rgba(255,255,255,.1);border:none;color:#fff;width:32px;height:32px;border-radius:50%;cursor:pointer;font-size:1rem;display:flex;align-items:center;justify-content:center;}
.clases-head-close:hover{background:rgba(255,255,255,.2);}

.clases-steps{display:flex;align-items:center;gap:.5rem;padding:.8rem 1.8rem;background:rgba(255,255,255,.03);border-bottom:1px solid rgba(255,255,255,.06);flex-shrink:0;}
.clases-step{display:flex;align-items:center;gap:.35rem;font-size:.72rem;font-weight:700;color:rgba(255,255,255,.35);transition:color .2s;}
.clases-step.active{color:#a78bfa;}
.clases-step.done{color:#34d399;}
.clases-step-num{width:20px;height:20px;border-radius:50%;border:1.5px solid currentColor;display:flex;align-items:center;justify-content:center;font-size:.65rem;font-weight:900;flex-shrink:0;}
.clases-step-sep{flex:1;height:1px;background:rgba(255,255,255,.08);}

.clases-body{flex:1;overflow-y:auto;padding:1.4rem 1.8rem;}
.clases-body::-webkit-scrollbar{width:4px;}
.clases-body::-webkit-scrollbar-thumb{background:rgba(167,139,250,.3);border-radius:4px;}

/* Profesor cards */
.prof-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.9rem;margin-bottom:1rem;}
.prof-card{background:rgba(255,255,255,.05);border:1.5px solid rgba(255,255,255,.08);border-radius:16px;padding:1rem;cursor:pointer;transition:all .2s;position:relative;}
.prof-card:hover{background:rgba(167,139,250,.1);border-color:rgba(167,139,250,.4);transform:translateY(-2px);}
.prof-card.selected{background:rgba(167,139,250,.15);border-color:#a78bfa;box-shadow:0 0 0 3px rgba(167,139,250,.2);}
.prof-avatar{width:52px;height:52px;border-radius:50%;background:linear-gradient(135deg,#7c3aed,#a855f7);display:flex;align-items:center;justify-content:center;font-size:1.4rem;margin:0 auto .7rem;}
.prof-name{font-size:.88rem;font-weight:900;color:#fff;text-align:center;margin-bottom:.25rem;}
.prof-materias{display:flex;flex-wrap:wrap;gap:.25rem;justify-content:center;margin-bottom:.5rem;}
.prof-mat-tag{font-size:.6rem;font-weight:800;background:rgba(167,139,250,.2);color:#c4b5fd;border-radius:6px;padding:.1rem .4rem;}
.prof-rating{text-align:center;font-size:.75rem;color:rgba(255,255,255,.5);}
.prof-rating strong{color:#f59e0b;}
.prof-precio{text-align:center;font-size:1rem;font-weight:900;color:#34d399;margin-top:.4rem;}
.prof-precio span{font-size:.65rem;color:rgba(255,255,255,.4);font-weight:600;}
.prof-bio{font-size:.72rem;color:rgba(255,255,255,.5);text-align:center;margin-top:.35rem;line-height:1.4;}

/* Slots calendario */
.slots-fecha-grupo{margin-bottom:1.2rem;}
.slots-fecha-label{font-size:.72rem;font-weight:800;color:rgba(167,139,250,.8);text-transform:uppercase;letter-spacing:.08em;margin-bottom:.5rem;}
.slots-grid{display:flex;flex-wrap:wrap;gap:.4rem;}
.slot-btn{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);color:rgba(255,255,255,.7);font-size:.78rem;font-weight:700;padding:.35rem .75rem;border-radius:10px;cursor:pointer;transition:all .15s;font-family:'Nunito',sans-serif;}
.slot-btn:hover{background:rgba(167,139,250,.15);border-color:#a78bfa;color:#c4b5fd;}
.slot-btn.selected{background:rgba(167,139,250,.25);border-color:#a78bfa;color:#fff;box-shadow:0 0 0 2px rgba(167,139,250,.3);}

/* Confirmación */
.confirm-box{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:1.2rem 1.4rem;margin-bottom:1rem;}
.confirm-row{display:flex;justify-content:space-between;align-items:center;padding:.45rem 0;border-bottom:1px solid rgba(255,255,255,.05);}
.confirm-row:last-child{border-bottom:none;}
.confirm-label{font-size:.78rem;color:rgba(255,255,255,.5);font-weight:600;}
.confirm-val{font-size:.85rem;font-weight:800;color:#fff;}
.confirm-val.green{color:#34d399;}
.confirm-val.amber{color:#f59e0b;}
.clases-pro-gate{text-align:center;padding:2.5rem 1rem;}
.clases-pro-gate h3{font-size:1.1rem;font-weight:900;color:#fff;margin-bottom:.6rem;}
.clases-pro-gate p{font-size:.85rem;color:rgba(255,255,255,.55);line-height:1.6;margin-bottom:1.2rem;}
.clases-action-btn{width:100%;background:linear-gradient(135deg,#7c3aed,#a855f7);border:none;color:#fff;font-size:.95rem;font-weight:900;padding:.85rem;border-radius:14px;cursor:pointer;font-family:'Nunito',sans-serif;transition:opacity .15s;margin-top:.8rem;}
.clases-action-btn:hover{opacity:.88;}
.clases-action-btn:disabled{opacity:.4;cursor:not-allowed;}
.clases-action-btn.amber{background:linear-gradient(135deg,#d97706,#f59e0b);}
.clases-loading{text-align:center;padding:3rem;color:rgba(255,255,255,.4);font-size:.88rem;}

/* Sala videollamada */
.sala-info{background:linear-gradient(135deg,rgba(52,211,153,.1),rgba(16,185,129,.05));border:1px solid rgba(52,211,153,.2);border-radius:16px;padding:1.4rem;text-align:center;margin-bottom:1rem;}
.sala-icon{font-size:2.5rem;margin-bottom:.6rem;}
.sala-title{font-size:1rem;font-weight:900;color:#34d399;margin-bottom:.3rem;}
.sala-sub{font-size:.8rem;color:rgba(255,255,255,.5);line-height:1.5;}
.sala-url-btn{display:inline-flex;align-items:center;gap:.5rem;background:#34d399;color:#064e3b;font-size:.9rem;font-weight:900;padding:.7rem 1.5rem;border-radius:12px;border:none;cursor:pointer;font-family:'Nunito',sans-serif;margin-top:1rem;transition:opacity .15s;text-decoration:none;}
.sala-url-btn:hover{opacity:.85;}
.briefing-box{background:rgba(251,191,36,.06);border:1px solid rgba(251,191,36,.15);border-radius:14px;padding:1rem 1.2rem;}
.briefing-title{font-size:.72rem;font-weight:900;color:#fbbf24;letter-spacing:.06em;text-transform:uppercase;margin-bottom:.6rem;}
.briefing-item{font-size:.78rem;color:rgba(255,255,255,.65);padding:.2rem 0;border-bottom:1px solid rgba(255,255,255,.04);}
.briefing-item:last-child{border-bottom:none;}
.mode-pill{font-size:.63rem;font-weight:800;padding:.2rem .55rem;border-radius:8px;
  background:rgba(255,255,255,.1);color:rgba(255,255,255,.7);letter-spacing:.04em;white-space:nowrap;}
/* Ocultar elementos secundarios en móvil pequeño */
@media(max-width:400px){
  .logo-text small{display:none;}
  .xp-badge{display:none;}
  .mode-pill{display:none;}
}
@media(max-width:520px){
  .mode-pill{display:none;}
  header{padding:0 .6rem;gap:.35rem;}
}

/* ══ DRAWER ══ */
.drawer-overlay{display:none;position:fixed;inset:0;background:rgba(15,10,30,.6);backdrop-filter:blur(4px);z-index:300;}
.drawer-overlay.show{display:block;}
.drawer{
  position:fixed;top:0;left:0;bottom:0;width:300px;
  background:linear-gradient(160deg,#1e0a3c,#2d1058,#1e1b4b);
  z-index:400;transform:translateX(-300px);transition:transform .3s cubic-bezier(.4,0,.2,1);
  display:flex;flex-direction:column;box-shadow:8px 0 40px rgba(0,0,0,.5);
}
.drawer.open{transform:translateX(0);}
.drawer-head{
  background:linear-gradient(135deg,rgba(251,146,60,.9),rgba(245,101,13,.85));
  padding:1rem 1.2rem;display:flex;align-items:center;justify-content:space-between;flex-shrink:0;
}
.drawer-head-title{font-size:.95rem;font-weight:900;color:#fff;display:flex;align-items:center;gap:.5rem;}
.drawer-close{background:rgba(0,0,0,.2);border:none;color:#fff;width:28px;height:28px;border-radius:50%;cursor:pointer;font-size:.9rem;}
.drawer-body{flex:1;overflow-y:auto;padding:.5rem 0 1.2rem;}
.drawer-body::-webkit-scrollbar{width:3px;}
.drawer-body::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15);border-radius:2px;}
/* Collapsible drawer sections */
.d-collapse-hdr{display:flex;align-items:center;justify-content:space-between;padding:.38rem .9rem .35rem;cursor:pointer;user-select:none;transition:background .15s;}
.d-collapse-hdr:hover{background:rgba(255,255,255,.04);}
.d-collapse-hdr .d-sec-title{margin:0;padding:0;}
.d-collapse-arrow{font-size:.62rem;color:rgba(196,181,253,.45);transition:transform .22s ease;flex-shrink:0;margin-left:.3rem;}
.d-collapse-hdr.open .d-collapse-arrow{transform:rotate(180deg);}
.d-collapse-body{overflow:hidden;max-height:0;transition:max-height .3s ease;}
.d-collapse-body.open{max-height:800px;}
/* Logout */
.d-item.logout-btn{color:rgba(248,113,113,.85) !important;border-left-color:#f87171 !important;}
.d-item.logout-btn:hover{background:rgba(248,113,113,.08) !important;}
/* Collapsible sections */
.d-sec-toggle{display:flex;align-items:center;justify-content:space-between;cursor:pointer;padding:.35rem .9rem .3rem;margin:0;user-select:none;}
.d-sec-toggle .d-sec-title{margin:0;padding:0;}
.d-sec-arrow{font-size:.7rem;color:rgba(255,255,255,.35);transition:transform .22s;flex-shrink:0;}
.d-sec-toggle.open .d-sec-arrow{transform:rotate(180deg);}
.d-sec-body{overflow:hidden;max-height:0;transition:max-height .28s ease;}
.d-sec-body.open{max-height:600px;}
/* Logout item */
.d-item.logout{color:rgba(248,113,113,.9);border-left-color:#f87171;margin-top:.2rem;}
.d-sec{padding:.75rem 1.1rem .3rem;}
.d-sec-title{font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(196,181,253,.6);margin-bottom:.4rem;font-family:'JetBrains Mono',monospace;display:flex;align-items:center;gap:.35rem;}
.d-item{display:flex;align-items:center;gap:.7rem;padding:.55rem 1.1rem;cursor:pointer;color:rgba(255,255,255,.78);font-size:.83rem;font-weight:700;transition:all .15s;border-left:3px solid transparent;user-select:none;}
.d-item:hover{background:rgba(255,255,255,.07);border-left-color:var(--y);color:#fff;}
.d-item.active{background:rgba(251,191,36,.12);border-left-color:var(--y);color:#fde68a;}
.d-item.danger{color:rgba(252,165,165,.7);}
.d-item.danger:hover{background:rgba(239,68,68,.15);border-left-color:#ef4444;color:#fca5a5;}
.d-item .di{font-size:1rem;width:20px;text-align:center;flex-shrink:0;}
.d-item .dl{flex:1;line-height:1.25;}
.d-item .dl small{display:block;font-size:.68rem;font-weight:600;opacity:.5;margin-top:1px;}
.d-badge{font-size:.58rem;background:var(--p3);color:#fff;padding:.1rem .32rem;border-radius:4px;font-family:'JetBrains Mono',monospace;font-weight:700;}
.d-upload{display:flex;align-items:center;gap:.7rem;padding:.55rem 1.1rem;cursor:pointer;color:rgba(252,165,165,.8);font-size:.83rem;font-weight:700;transition:all .15s;border-left:3px solid transparent;position:relative;overflow:hidden;}
.d-upload:hover{background:rgba(239,68,68,.15);border-left-color:#f87171;color:#fca5a5;}
.d-upload input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%;}
.d-div{height:1px;background:rgba(255,255,255,.06);margin:.3rem 1.1rem;}
.d-chips{padding:.2rem 1.1rem .5rem;display:flex;flex-wrap:wrap;gap:.28rem;}
.d-chip{font-size:.7rem;font-weight:700;border:1px solid rgba(255,255,255,.15);padding:.2rem .52rem;border-radius:6px;cursor:pointer;color:rgba(255,255,255,.6);transition:all .15s;}
.d-chip:hover{background:var(--y);border-color:var(--y);color:#1f2937;}

/* ══ CHAT ══ */
.chat-wrapper{min-width:0;min-height:0;display:flex;flex-direction:column;overflow:hidden;}
.chat-msgs{flex:1;overflow-y:auto;padding:1.5rem;display:flex;flex-direction:column;gap:1.2rem;scroll-behavior:smooth;}
.chat-msgs::-webkit-scrollbar{width:4px;}
.chat-msgs::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px;}

/* Welcome */
.welcome{text-align:center;padding:2.5rem 1.5rem;animation:fadeUp .5s ease both;}
.capy-big{font-size:5rem;display:inline-block;cursor:pointer;animation:float 3s ease-in-out infinite;filter:drop-shadow(0 8px 16px rgba(124,58,237,.3));transition:transform .2s;}
.capy-big:hover{animation:none;transform:scale(1.1) rotate(-5deg);}
.welcome h2{font-size:1.4rem;font-weight:900;color:var(--p);margin:.5rem 0 .4rem;}
.welcome p{color:var(--muted);font-size:.9rem;max-width:400px;margin:0 auto 1.5rem;line-height:1.6;}
.wc-grid{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;max-width:420px;margin:0 auto;}
.wc-card{border-radius:12px;padding:.8rem 1rem;cursor:pointer;font-size:.8rem;font-weight:800;transition:all .2s;display:flex;align-items:center;gap:.5rem;border:2px solid transparent;}
.wc-card:hover{transform:translateY(-2px);box-shadow:var(--shadow);}
.wc-purple{background:linear-gradient(135deg,#ede9fe,#ddd6fe);color:#5b21b6;border-color:#c4b5fd;}
.wc-orange{background:linear-gradient(135deg,#fff7ed,#fed7aa);color:#c2410c;border-color:#fdba74;}
.wc-cyan{background:linear-gradient(135deg,#ecfeff,#a5f3fc);color:#0e7490;border-color:#67e8f9;}
.wc-pink{background:linear-gradient(135deg,#fdf2f8,#fbcfe8);color:#9d174d;border-color:#f9a8d4;}

/* ─── LANDING ──────────────────────────────────────────── */
.landing{text-align:center;padding:2rem 1rem 1.5rem;animation:fadeUp .5s ease both;max-width:720px;margin:0 auto;}
.landing-badge{display:inline-flex;align-items:center;gap:.4rem;background:linear-gradient(135deg,#ede9fe,#ddd6fe);color:#5b21b6;font-size:.72rem;font-weight:900;padding:.3rem .9rem;border-radius:20px;margin-bottom:.8rem;letter-spacing:.04em;}
.landing h1{font-size:1.9rem;font-weight:900;color:var(--text);line-height:1.25;margin-bottom:.6rem;}
.landing h1 span{background:linear-gradient(135deg,var(--p),var(--p2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.landing-sub{color:var(--muted);font-size:.9rem;max-width:480px;margin:0 auto 1.5rem;line-height:1.6;}
.landing-features{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;margin-bottom:1.5rem;}
.lf-chip{background:#fff;border:1.5px solid var(--border);border-radius:20px;padding:.3rem .75rem;font-size:.75rem;font-weight:700;color:var(--text);display:flex;align-items:center;gap:.3rem;}
.landing-cta{display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap;margin-bottom:1.8rem;}
.lc-btn-main{background:linear-gradient(135deg,var(--p),var(--p2));color:#fff;border:none;border-radius:12px;padding:.65rem 1.5rem;font-size:.9rem;font-weight:900;cursor:pointer;font-family:inherit;box-shadow:0 4px 0 #6d28d9;transition:all .2s;}
.lc-btn-main:hover{transform:translateY(-2px);box-shadow:0 6px 0 #6d28d9;}
.lc-btn-sec{background:#fff;color:var(--p);border:2px solid var(--p);border-radius:12px;padding:.65rem 1.2rem;font-size:.9rem;font-weight:900;cursor:pointer;font-family:inherit;transition:all .2s;}
.lc-btn-sec:hover{background:#faf5ff;}
.landing-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem;margin-bottom:.8rem;}
.lp-card{background:#fff;border:2px solid var(--border);border-radius:14px;padding:.8rem .7rem;text-align:left;cursor:pointer;transition:all .2s;}
.lp-card:hover{border-color:var(--p);transform:translateY(-2px);box-shadow:0 8px 20px rgba(124,58,237,.1);}
.lp-card.featured{border-color:var(--p);background:linear-gradient(135deg,#faf5ff,#f0f0ff);}
.lp-badge{font-size:.6rem;font-weight:900;padding:.15rem .5rem;border-radius:8px;background:var(--p);color:#fff;margin-bottom:.4rem;display:inline-block;}
.lp-name{font-size:.8rem;font-weight:900;color:var(--text);margin-bottom:.2rem;}
.lp-price{font-size:1.1rem;font-weight:900;color:var(--p);line-height:1;}
.lp-price small{font-size:.65rem;font-weight:600;color:var(--muted);}
.lp-feats{margin-top:.5rem;display:flex;flex-direction:column;gap:.2rem;}
.lp-feat{font-size:.65rem;color:var(--muted);display:flex;gap:.3rem;align-items:baseline;}
.lp-feat.ok{color:#059669;}
.landing-packs{background:linear-gradient(135deg,#f5f3ff,#ede9fe);border:1.5px solid #c4b5fd;border-radius:14px;padding:.8rem 1rem;display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem;margin-bottom:.5rem;}
.lpack{text-align:center;}
.lpack-name{font-size:.68rem;font-weight:900;color:#5b21b6;margin-bottom:.15rem;}
.lpack-price{font-size:.95rem;font-weight:900;color:#4c1d95;}
.lpack-sub{font-size:.6rem;color:#7c3aed;}
.landing-trust{font-size:.72rem;color:var(--muted);display:flex;align-items:center;justify-content:center;gap:.8rem;flex-wrap:wrap;padding-top:.4rem;}
@media(max-width:480px){.landing-plans{grid-template-columns:1fr;}.landing h1{font-size:1.5rem;}.landing-packs{grid-template-columns:1fr;}}

/* Messages */
.msg{display:flex;gap:.8rem;animation:fadeUp .3s ease both;}
.msg.user{flex-direction:row-reverse;align-self:flex-end;max-width:600px;}
.msg.assistant{align-self:flex-start;max-width:100%;width:100%;}
.msg-av{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.85rem;flex-shrink:0;margin-top:2px;}
.msg.user .msg-av{background:linear-gradient(135deg,var(--p),var(--p2));}
.msg.assistant .msg-av{background:linear-gradient(135deg,#f59e0b,#fbbf24);}
.msg-bub{padding:.85rem 1.1rem;border-radius:var(--radius);font-size:.88rem;line-height:1.75;}
.msg.user .msg-bub{background:linear-gradient(135deg,var(--p),var(--p2));color:#fff;border-radius:var(--radius) var(--radius) 4px var(--radius);}
.msg.assistant .msg-bub{background:#fff;border:1px solid var(--border);color:var(--text);border-radius:4px var(--radius) var(--radius) var(--radius);box-shadow:0 2px 12px rgba(0,0,0,.06);max-width:700px;}
.msg-img-thumb{max-width:240px;max-height:180px;border-radius:8px;margin-bottom:.4rem;display:block;object-fit:contain;}
.share-row{display:flex;gap:.4rem;margin-top:.5rem;padding-top:.5rem;border-top:1px solid var(--border);}
.share-btn{font-size:.68rem;font-weight:800;padding:.25rem .6rem;border-radius:8px;border:1.5px solid var(--border);background:transparent;color:var(--muted);cursor:pointer;transition:all .15s;}
.share-btn:hover{border-color:var(--p);color:var(--p);background:#faf5ff;}
.share-btn.gp-share{color:#059669;border-color:#6ee7b7;}
.share-btn.gp-share:hover{background:#ecfdf5;border-color:#059669;}
.share-btn.gp-share.sent{color:#9ca3af;border-color:var(--border);pointer-events:none;}
.gp-share-toast{position:fixed;bottom:90px;left:50%;transform:translateX(-50%);background:#059669;color:#fff;font-size:.75rem;font-weight:800;padding:.4rem 1rem;border-radius:20px;opacity:0;transition:opacity .3s;pointer-events:none;z-index:9998;}
.gp-share-toast.show{opacity:1;}
.invite-banner{position:fixed;top:0;left:0;right:0;z-index:9999;background:linear-gradient(135deg,#7c3aed,#a855f7);color:#fff;padding:.7rem 1.2rem;display:flex;align-items:center;gap:.8rem;font-size:.82rem;font-weight:700;animation:slideDown .4s ease both;box-shadow:0 4px 20px rgba(124,58,237,.4);}
@keyframes slideDown{from{transform:translateY(-100%)}to{transform:translateY(0)}}
.invite-banner-code{background:rgba(255,255,255,.25);padding:.2rem .6rem;border-radius:8px;font-family:monospace;font-size:.9rem;letter-spacing:.1em;font-weight:900;}
.invite-banner-btn{margin-left:auto;background:#fff;color:#7c3aed;border:none;border-radius:8px;padding:.3rem .8rem;font-size:.78rem;font-weight:900;cursor:pointer;font-family:inherit;white-space:nowrap;}

/* ── Coupon pop-up card ─────────────────────────────────────── */
.coupon-bg{display:none;position:fixed;inset:0;z-index:750;background:rgba(15,10,30,.75);backdrop-filter:blur(8px);align-items:flex-end;justify-content:center;padding:0 0 1rem;}
.coupon-bg.show{display:flex;animation:fadeIn .25s ease;}
.coupon-card{background:#fff;border-radius:22px;width:100%;max-width:420px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.45);animation:slideUp .35s cubic-bezier(.34,1.4,.64,1) both;}
.coupon-hdr{padding:1rem 1.2rem .6rem;display:flex;align-items:center;gap:.7rem;background:linear-gradient(135deg,#1e1b4b,#2d1b69);}
.coupon-hdr-icon{width:40px;height:40px;border-radius:50%;object-fit:cover;flex-shrink:0;background:#fff;}
.coupon-hdr-text{flex:1;}
.coupon-hdr-text strong{display:block;font-size:.88rem;font-weight:900;color:#fff;}
.coupon-hdr-text span{font-size:.72rem;color:rgba(196,181,253,.8);}
.coupon-hdr-close{background:rgba(255,255,255,.12);border:none;color:#fff;width:28px;height:28px;border-radius:50%;cursor:pointer;font-size:.85rem;flex-shrink:0;}
.coupon-body{padding:1rem 1.2rem;}
.coupon-code-row{background:linear-gradient(135deg,#fef3c7,#fde68a);border:2px dashed #d97706;border-radius:14px;padding:.75rem 1rem;display:flex;align-items:center;justify-content:space-between;margin:.5rem 0 .7rem;}
.coupon-code{font-family:'JetBrains Mono',monospace;font-size:1.2rem;font-weight:900;color:#92400e;letter-spacing:.12em;}
.coupon-copy-btn{background:#d97706;border:none;color:#fff;font-size:.7rem;font-weight:900;padding:.3rem .7rem;border-radius:8px;cursor:pointer;font-family:Nunito,sans-serif;}
.coupon-copy-btn:active{transform:scale(.95);}
.coupon-desc{font-size:.82rem;color:#374151;line-height:1.45;margin-bottom:.8rem;}
.coupon-cta{display:block;width:100%;padding:.75rem;background:linear-gradient(135deg,#7c3aed,#a855f7);border:none;border-radius:14px;color:#fff;font-weight:900;font-size:.9rem;font-family:Nunito,sans-serif;cursor:pointer;text-align:center;transition:opacity .15s;}
.coupon-cta:hover{opacity:.9;}
.coupon-footer{font-size:.65rem;color:#9ca3af;text-align:center;padding:.5rem 1.2rem .8rem;line-height:1.4;}
.coupon-label{display:inline-block;font-size:.65rem;font-weight:900;padding:.15rem .5rem;border-radius:20px;margin-bottom:.4rem;}
.coupon-label.desc{background:#d1fae5;color:#065f46;}
.coupon-label.partner{background:#dbeafe;color:#1e40af;}

/* ── Shop modal ────────────────────────────────────────────── */
.shop-bg{display:none;position:fixed;inset:0;z-index:750;background:rgba(15,10,30,.82);backdrop-filter:blur(10px);align-items:flex-end;justify-content:center;}
.shop-bg.show{display:flex;animation:fadeIn .25s ease;}
.shop-modal{background:#f9fafb;border-radius:24px 24px 0 0;width:100%;max-width:480px;max-height:82vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 -8px 40px rgba(0,0,0,.4);animation:slideUp .35s cubic-bezier(.34,1.4,.64,1) both;}
.shop-modal-hdr{padding:1rem 1.2rem .7rem;background:#fff;display:flex;align-items:center;gap:.7rem;border-bottom:1px solid #e5e7eb;}
.shop-modal-hdr h3{flex:1;font-size:.95rem;font-weight:900;color:#1f2937;margin:0;}
.shop-modal-close{background:transparent;border:none;font-size:1.1rem;cursor:pointer;color:#6b7280;padding:.2rem;}
.shop-modal-tabs{display:flex;gap:.3rem;padding:.6rem 1rem .2rem;background:#fff;overflow-x:auto;}
.shop-tab{font-size:.73rem;font-weight:800;padding:.35rem .75rem;border-radius:20px;border:1.5px solid #e5e7eb;background:#fff;color:#6b7280;cursor:pointer;white-space:nowrap;font-family:Nunito,sans-serif;transition:all .15s;}
.shop-tab.active{background:linear-gradient(135deg,#7c3aed,#a855f7);border-color:transparent;color:#fff;}
.shop-grid{flex:1;overflow-y:auto;padding:.8rem;display:grid;grid-template-columns:1fr 1fr;gap:.7rem;}
.shop-grid::-webkit-scrollbar{width:3px;}
.shop-grid::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:2px;}
.shop-item{background:#fff;border-radius:16px;border:1.5px solid #e5e7eb;overflow:hidden;display:flex;flex-direction:column;cursor:pointer;transition:box-shadow .15s,transform .12s;}
.shop-item:hover{box-shadow:0 4px 16px rgba(124,58,237,.18);transform:translateY(-2px);}
.shop-item-img{width:100%;aspect-ratio:1;object-fit:cover;background:#f3f4f6;display:flex;align-items:center;justify-content:center;font-size:2.2rem;}
.shop-item-body{padding:.55rem .65rem .6rem;}
.shop-item-name{font-size:.75rem;font-weight:800;color:#1f2937;line-height:1.3;margin-bottom:.2rem;}
.shop-item-brand{font-size:.65rem;color:#6b7280;margin-bottom:.3rem;}
.shop-item-price{font-size:.82rem;font-weight:900;color:#7c3aed;}
.shop-item-price s{color:#9ca3af;font-size:.72rem;font-weight:400;}
.shop-item-cta{display:block;width:100%;margin-top:.4rem;padding:.45rem;background:linear-gradient(135deg,#7c3aed,#a855f7);border:none;border-radius:10px;color:#fff;font-size:.72rem;font-weight:900;font-family:Nunito,sans-serif;cursor:pointer;text-align:center;}
.shop-item-badge{font-size:.58rem;font-weight:900;padding:.1rem .4rem;border-radius:8px;display:inline-block;margin-bottom:.2rem;}
.shop-item-badge.new{background:#d1fae5;color:#065f46;}
.shop-item-badge.hot{background:#fee2e2;color:#991b1b;}
.shop-item-badge.offer{background:#fef3c7;color:#92400e;}

/* ── Inline shop card in chat ───────────────────────────────── */
.shop-inline{display:flex;align-items:center;gap:.7rem;background:linear-gradient(135deg,#eff6ff,#dbeafe);border:1.5px solid #bfdbfe;border-radius:14px;padding:.65rem .9rem;margin-top:.6rem;cursor:pointer;}
.shop-inline:hover{background:linear-gradient(135deg,#dbeafe,#bfdbfe);}
.shop-inline-icon{font-size:1.5rem;flex-shrink:0;}
.shop-inline-text{flex:1;}
.shop-inline-text strong{display:block;font-size:.78rem;font-weight:900;color:#1e40af;}
.shop-inline-text span{font-size:.68rem;color:#2563eb;}
.shop-inline-caret{font-size:.75rem;color:#93c5fd;}

/* Correction panel */
.corr-wrapper{flex:1;min-width:0;}
.corr-panel{display:grid;grid-template-columns:1fr 1fr;border:2px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);}
.corr-col{display:flex;flex-direction:column;}
.corr-hdr{padding:.5rem 1rem;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;font-family:'JetBrains Mono',monospace;}
.corr-hdr.orig{background:linear-gradient(135deg,#1e0a3c,#2d1058);color:#c4b5fd;}
.corr-hdr.fix{background:linear-gradient(135deg,#7f1d1d,#991b1b);color:#fca5a5;}
.corr-body{flex:1;overflow-y:auto;}
.orig-body{background:#fff;display:flex;align-items:flex-start;justify-content:center;padding:.5rem;border-right:1px solid var(--border);min-height:280px;max-height:520px;}
.orig-body img{width:100%;height:auto;max-height:500px;object-fit:contain;}
.fix-body{background:#fff9f7;padding:1rem 1.2rem;font-size:.84rem;line-height:1.75;max-height:520px;}
.ann-list{border-top:1px solid var(--border);background:#f9fafb;padding:.6rem 1rem;max-height:160px;overflow-y:auto;}
.ann-item{display:flex;gap:.35rem;align-items:flex-start;font-size:.76rem;margin-bottom:.3rem;line-height:1.4;}
.ann-tag{font-size:.6rem;padding:.08rem .3rem;border-radius:4px;font-family:'JetBrains Mono',monospace;white-space:nowrap;flex-shrink:0;margin-top:1px;}
.ann-err{background:#dc2626;color:#fff;}
.ann-tip{background:#d97706;color:#fff;}

/* Markdown */
.msg-bub strong,.fix-body strong{color:#4c1d95;font-weight:800;}
.msg-bub em,.fix-body em{color:#be123c;font-style:italic;}
.section-title{display:block;font-size:.78rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em;color:var(--p);margin:1rem 0 .3rem;padding-bottom:.25rem;border-bottom:2px solid #ede9fe;}
.nota-badge{display:inline-block;background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#78350f;font-family:'JetBrains Mono',monospace;font-size:1rem;font-weight:900;padding:.3rem .9rem;border-radius:10px;margin-top:.4rem;}
.msg-bub blockquote,.fix-body blockquote{border-left:3px solid var(--p2);padding:.4rem .8rem;background:#faf5ff;margin:.4rem 0;font-style:italic;border-radius:0 8px 8px 0;}
.msg-link{color:var(--p);text-decoration:underline;text-decoration-color:rgba(124,58,237,.3);}
.msg-link:hover{text-decoration-color:var(--p);}
.msg-bub code,.fix-body code{font-family:'JetBrains Mono',monospace;background:#f3f4f6;padding:.1em .3em;border-radius:4px;font-size:.82em;color:#7c3aed;}
.msg-bub ul,.fix-body ul{padding-left:1.2rem;margin:.3rem 0;}
.msg-bub li,.fix-body li{margin:.2rem 0;}
/* ─── OBRA CARD — componente inline dentro de msg-bub ─────── */
.obra-card{
  display:flex;gap:0;
  margin-top:.85rem;
  border-radius:12px;
  overflow:hidden;
  border:1px solid rgba(124,58,237,.18);
  background:linear-gradient(135deg,#1a1030 0%,#120d22 100%);
  cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  text-decoration:none;
  /* reserva altura mínima para evitar CLS */
  min-height:90px;
}
.obra-card:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 28px rgba(124,58,237,.22);
  border-color:rgba(167,139,250,.4);
}
.obra-card:active{transform:translateY(0);}
/* Imagen: columna izquierda, tamaño fijo, sin CLS */
.obra-card-img-wrap{
  width:90px;flex-shrink:0;
  background:#0d0a1a;
  overflow:hidden;
  position:relative;
}
/* Placeholder de aspect-ratio para CLS-free loading */
.obra-card-img-wrap::before{
  content:'';display:block;padding-top:100%;
}
.obra-card-img{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;
  transition:transform .3s ease;
}
.obra-card:hover .obra-card-img{transform:scale(1.05);}
/* Contenido: columna derecha */
.obra-card-body{
  flex:1;min-width:0;
  padding:.65rem .8rem;
  display:flex;flex-direction:column;
  justify-content:space-between;
  gap:.35rem;
}
.obra-card-meta{
  display:flex;align-items:center;gap:.4rem;
  font-size:.6rem;font-weight:700;
  color:#a78bfa;text-transform:uppercase;letter-spacing:.07em;
  font-family:system-ui,sans-serif;
}
.obra-card-dot{width:5px;height:5px;border-radius:50%;background:#a78bfa;flex-shrink:0;}
.obra-card-title{
  font-size:.84rem;font-weight:800;
  color:#f3f4f6;line-height:1.25;
  margin:0;font-family:'Georgia',serif;
  /* truncar si es muy largo */
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.obra-card-autor{
  font-size:.7rem;color:#9ca3af;
  font-family:system-ui,sans-serif;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.obra-card-desc{
  font-size:.72rem;color:#c4b5fd;line-height:1.4;
  font-family:system-ui,sans-serif;
  /* 1 línea máximo */
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.obra-card-cta{
  display:inline-flex;align-items:center;gap:.35rem;
  font-size:.68rem;font-weight:800;
  color:#fff;background:linear-gradient(135deg,#7c3aed,#6d28d9);
  border:none;border-radius:6px;padding:.22rem .6rem;
  font-family:system-ui,sans-serif;letter-spacing:.02em;
  align-self:flex-start;
  pointer-events:none;/* el click lo maneja la card entera */
}
/* Móvil: imagen más pequeña */
@media(max-width:600px){
  .obra-card-img-wrap{width:70px;}
  .obra-card-title{font-size:.78rem;}
}
/* ── CSS GRID LAYOUT: header + appShell (chat | artPanel) ─── */
/* body es flex-column: header fijo arriba, appShell llena el resto */
body{height:100vh;overflow:hidden;flex-direction:column;}
/* appShell: grid 1 col por defecto, 2 cols cuando hay obra */
#appShell{
  flex:1;min-height:0;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  overflow:hidden;
}
#appShell.art-active{
  grid-template-columns:minmax(0,1fr) 420px;
}
/* ArtPanel — segunda columna del grid, scroll propio */
#artPanel{
  min-width:0;min-height:0;
  overflow-y:auto;overflow-x:hidden;
  background:#080808;
  border-left:1px solid rgba(255,255,255,.07);
  display:flex;flex-direction:column;
}
#artPanel.art-panel-hidden{display:none;}
#artPanelInner{flex:1;display:flex;flex-direction:column;}
/* Scrollbar del artPanel */
#artPanel::-webkit-scrollbar{width:4px;}
#artPanel::-webkit-scrollbar-thumb{background:rgba(167,139,250,.3);border-radius:2px;}
/* ── ARTVIEWER COMPONENTS ─────────────────────────────────── */
.av-wrap{font-family:'Georgia',serif;color:#e5e7eb;display:flex;flex-direction:column;height:100%;}
/* Topbar */
.av-topbar{display:flex;align-items:center;justify-content:space-between;padding:.55rem .9rem;background:rgba(255,255,255,.03);border-bottom:1px solid rgba(255,255,255,.06);flex-shrink:0;}
.av-topbar-left{display:flex;align-items:center;gap:.5rem;}
.av-dot{width:7px;height:7px;border-radius:50%;background:#a78bfa;animation:avDotPulse 3s infinite;}
@keyframes avDotPulse{0%,100%{opacity:.7;}50%{opacity:1;}}
.av-label-obra{font-size:.6rem;font-weight:700;color:#9ca3af;letter-spacing:.1em;text-transform:uppercase;font-family:system-ui,sans-serif;}
.av-topbar-right{display:flex;align-items:center;gap:.5rem;}
.av-status-badge{font-size:.63rem;font-weight:700;background:rgba(167,139,250,.12);color:#a78bfa;border:1px solid rgba(167,139,250,.2);border-radius:20px;padding:.12rem .5rem;font-family:system-ui,sans-serif;}
.av-close-btn{background:none;border:none;color:rgba(255,255,255,.25);font-size:.9rem;cursor:pointer;padding:.1rem .25rem;transition:color .15s;}
.av-close-btn:hover{color:#fff;}
/* Zona imagen — sin CLS: placeholder de aspect-ratio */
.av-img-zone{
  width:100%;position:relative;flex-shrink:0;
  background:#0d0d0d;
  /* Placeholder: evita layout shift al cargar imagen */
  min-height:200px;
}
.av-img-zone::before{
  content:'';display:block;width:100%;padding-top:75%;
  /* 4:3 aspect ratio placeholder */
}
.av-img{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:contain;
  display:block;
  cursor:zoom-in;
}
/* Hotspots — coordenadas % sobre imagen */
.av-hotspot{position:absolute;cursor:pointer;z-index:5;}
.av-hotspot-ring{
  position:absolute;top:50%;left:50%;
  transform:translate(-50%,-50%);
  width:18px;height:18px;border-radius:50%;
  border:2px solid rgba(167,139,250,.8);
  background:rgba(167,139,250,.2);
  animation:avPulse 2.5s infinite;
}
@keyframes avPulse{
  0%,100%{transform:translate(-50%,-50%) scale(1);opacity:.7;}
  50%{transform:translate(-50%,-50%) scale(1.5);opacity:1;}
}
.av-hotspot:hover .av-hotspot-ring,.av-hotspot-active .av-hotspot-ring{
  animation:none;background:rgba(167,139,250,.45);border-color:#c4b5fd;
}
.av-tooltip{
  display:none;position:absolute;
  bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);
  background:#1a1a2e;border:1px solid rgba(167,139,250,.3);
  border-radius:8px;padding:.45rem .65rem;
  font-size:.68rem;color:#e5e7eb;line-height:1.4;
  width:170px;z-index:20;
  box-shadow:0 4px 20px rgba(0,0,0,.6);
  font-family:system-ui,sans-serif;pointer-events:none;
}
.av-hotspot:hover .av-tooltip{display:block;}
/* Tour bar */
.av-tour-bar{
  background:#0f0f1e;border-top:1px solid rgba(167,139,250,.12);
  padding:.55rem .9rem;font-family:system-ui,sans-serif;flex-shrink:0;
}
.av-tour-step-text{font-size:.75rem;color:#d1d5db;line-height:1.5;margin-bottom:.4rem;}
.av-tour-controls{display:flex;align-items:center;gap:.35rem;}
.av-tour-btn{
  background:rgba(167,139,250,.1);border:1px solid rgba(167,139,250,.18);
  color:#a78bfa;border-radius:6px;padding:.18rem .5rem;
  cursor:pointer;font-size:.72rem;font-family:inherit;transition:background .15s;
}
.av-tour-btn:hover{background:rgba(167,139,250,.22);}
.av-tour-btn-close{margin-left:auto;color:#9ca3af;border-color:rgba(255,255,255,.08);}
.av-tour-counter{font-size:.65rem;color:#6b7280;margin:0 .15rem;}
/* Título obra */
.av-img-title{
  font-size:.8rem;color:#6b7280;
  padding:.4rem .9rem;text-align:center;
  font-style:italic;border-top:1px solid rgba(255,255,255,.04);
  font-family:system-ui,sans-serif;flex-shrink:0;
}
/* Ficha técnica */
.av-ficha{padding:.75rem .9rem;border-bottom:1px solid rgba(255,255,255,.05);flex-shrink:0;}
.av-ficha-titulo{font-size:.88rem;font-weight:700;color:#f3f4f6;margin-bottom:.5rem;line-height:1.3;}
.av-field{display:grid;grid-template-columns:68px 1fr;gap:.15rem;margin-bottom:.28rem;font-size:.69rem;font-family:system-ui,sans-serif;}
.av-fl{color:#6b7280;font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:.6rem;padding-top:.1rem;}
.av-fv{color:#d1d5db;line-height:1.4;}
/* Controles */
.av-controls{padding:.65rem .9rem;display:flex;flex-direction:column;gap:.35rem;font-family:system-ui,sans-serif;flex-shrink:0;border-bottom:1px solid rgba(255,255,255,.05);}
.av-btn{
  display:block;width:100%;padding:.4rem .65rem;
  border-radius:8px;font-size:.72rem;font-weight:700;
  cursor:pointer;border:none;text-align:center;text-decoration:none;
  transition:all .15s;font-family:inherit;
}
.av-btn-primary{background:linear-gradient(135deg,#7c3aed,#6d28d9);color:#fff;}
.av-btn-primary:hover{filter:brightness(1.1);}
.av-btn-secondary{background:rgba(255,255,255,.05);color:#d1d5db;border:1px solid rgba(255,255,255,.1);}
.av-btn-secondary:hover{background:rgba(255,255,255,.09);}
.av-btn-link{background:none;color:#a78bfa;border:1px solid rgba(167,139,250,.25);}
.av-btn-link:hover{background:rgba(167,139,250,.08);}
/* Área de práctica */
.av-practica{padding:.65rem .9rem;font-family:system-ui,sans-serif;flex:1;}
.av-pq-label{font-size:.58rem;font-weight:800;color:#a78bfa;text-transform:uppercase;letter-spacing:.08em;margin-bottom:.3rem;}
.av-pq-text{font-size:.74rem;color:#e5e7eb;line-height:1.5;margin-bottom:.4rem;}
.av-pq-input{
  width:100%;background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.1);border-radius:8px;
  padding:.38rem .5rem;font-size:.71rem;color:#e5e7eb;
  resize:vertical;font-family:inherit;outline:none;
  box-sizing:border-box;min-height:60px;
}
.av-pq-input:focus{border-color:rgba(167,139,250,.4);}
.av-pq-actions{display:flex;gap:.35rem;margin:.35rem 0;}
.av-pq-score{font-size:.78rem;font-weight:800;margin-bottom:.2rem;}
.av-pq-hint{font-size:.69rem;color:#9ca3af;line-height:1.4;}
/* LIGHTBOX fullscreen */
#obraLightbox{
  position:fixed;inset:0;z-index:99999;
  background:rgba(0,0,0,.97);
  display:none;flex-direction:column;
  align-items:center;justify-content:center;padding:1rem;
}
#obraLightbox.open{display:flex;animation:lbFade .2s ease;}
@keyframes lbFade{from{opacity:0}to{opacity:1}}
.lb-topbar{width:100%;max-width:1000px;display:flex;align-items:center;justify-content:space-between;margin-bottom:.75rem;}
.lb-title{font-size:.85rem;font-weight:700;color:#e5e7eb;font-family:'Georgia',serif;}
.lb-close{background:rgba(255,255,255,.1);border:none;color:#fff;font-size:1.1rem;width:36px;height:36px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.lb-close:hover{background:rgba(255,255,255,.2);}
#lbImg{max-width:100%;max-height:calc(100vh - 130px);object-fit:contain;border-radius:3px;}
.lb-caption{margin-top:.6rem;font-size:.72rem;color:rgba(255,255,255,.35);text-align:center;font-family:system-ui,sans-serif;}
/* MÓVIL: grid → stack vertical, artPanel como bottom sheet */
@media(max-width:768px){
  body{height:auto;overflow:auto;}
  #appShell,#appShell.art-active{
    display:flex;flex-direction:column;
    grid-template-columns:unset;
    height:auto;overflow:visible;
  }
  .chat-wrapper{min-height:50vh;overflow:visible;}
  #artPanel{
    height:50vh;min-height:0;
    border-left:none;border-top:2px solid rgba(167,139,250,.2);
  }
  .av-img-zone::before{padding-top:56.25%;}
}
/* ── FACTCHECK MODAL ─────────────────────────────────────── */
.fc-bg{display:none;position:fixed;inset:0;z-index:800;background:rgba(0,0,0,.6);backdrop-filter:blur(6px);align-items:center;justify-content:center;padding:1rem;}
.fc-bg.show{display:flex;}
.fc-modal{background:#fff;border-radius:20px;width:100%;max-width:700px;max-height:92vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.18);}
.fc-header{background:linear-gradient(135deg,#0f172a,#1e293b);padding:1.1rem 1.4rem;display:flex;align-items:center;justify-content:space-between;flex-shrink:0;}
.fc-header-left{display:flex;align-items:center;gap:.7rem;}
.fc-header-icon{width:38px;height:38px;border-radius:10px;background:rgba(239,68,68,.15);border:1.5px solid rgba(239,68,68,.3);display:flex;align-items:center;justify-content:center;font-size:1.2rem;}
.fc-header-title{font-size:.95rem;font-weight:900;color:#f8fafc;}
.fc-header-sub{font-size:.68rem;color:#94a3b8;margin-top:.1rem;}
.fc-close{background:rgba(255,255,255,.08);border:none;color:#94a3b8;width:32px;height:32px;border-radius:50%;cursor:pointer;font-size:1rem;display:flex;align-items:center;justify-content:center;transition:all .15s;}
.fc-close:hover{background:rgba(255,255,255,.15);color:#fff;}
.fc-body{flex:1;overflow-y:auto;padding:1.2rem 1.4rem;display:flex;flex-direction:column;gap:.9rem;}
.fc-body::-webkit-scrollbar{width:4px;}
.fc-body::-webkit-scrollbar-thumb{background:#e2e8f0;border-radius:2px;}
.fc-input-area{display:flex;flex-direction:column;gap:.55rem;}
.fc-label{font-size:.72rem;font-weight:800;color:#64748b;text-transform:uppercase;letter-spacing:.06em;}
.fc-textarea{width:100%;min-height:90px;resize:vertical;border:2px solid #e2e8f0;border-radius:12px;padding:.75rem .9rem;font-size:.84rem;font-family:inherit;color:#1e293b;outline:none;transition:border-color .15s;box-sizing:border-box;line-height:1.5;}
.fc-textarea:focus{border-color:#3b82f6;}
.fc-textarea::placeholder{color:#94a3b8;}
.fc-cta{display:flex;align-items:center;justify-content:space-between;gap:.8rem;}
.fc-btn{background:linear-gradient(135deg,#1d4ed8,#2563eb);color:#fff;border:none;border-radius:10px;padding:.55rem 1.1rem;font-size:.82rem;font-weight:800;cursor:pointer;font-family:inherit;transition:all .15s;display:flex;align-items:center;gap:.4rem;}
.fc-btn:hover:not(:disabled){filter:brightness(1.1);}
.fc-btn:disabled{opacity:.5;cursor:not-allowed;}
.fc-hint{font-size:.68rem;color:#94a3b8;flex:1;}
.fc-loading{display:none;align-items:center;gap:.7rem;padding:.8rem 1rem;background:#f8fafc;border-radius:12px;border:1px solid #e2e8f0;}
.fc-loading.show{display:flex;}
.fc-spinner{width:20px;height:20px;border:2.5px solid #e2e8f0;border-top-color:#3b82f6;border-radius:50%;animation:fcSpin .8s linear infinite;flex-shrink:0;}
@keyframes fcSpin{to{transform:rotate(360deg)}}
.fc-loading-text{font-size:.78rem;color:#64748b;font-weight:600;}
.fc-result{display:none;flex-direction:column;gap:.8rem;}
.fc-result.show{display:flex;}
.fc-veredicto-wrap{display:flex;align-items:flex-start;gap:.8rem;padding:1rem 1.1rem;border-radius:14px;border:2px solid;}
.fc-veredicto-wrap.fc-verde{background:#f0fdf4;border-color:#86efac;}
.fc-veredicto-wrap.fc-amarillo{background:#fefce8;border-color:#fde68a;}
.fc-veredicto-wrap.fc-naranja{background:#fff7ed;border-color:#fed7aa;}
.fc-veredicto-wrap.fc-rojo{background:#fef2f2;border-color:#fca5a5;}
.fc-veredicto-wrap.fc-gris{background:#f8fafc;border-color:#e2e8f0;}
.fc-veredicto-emoji{font-size:1.6rem;flex-shrink:0;}
.fc-veredicto-content{flex:1;}
.fc-veredicto-label{font-size:.6rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:#64748b;margin-bottom:.2rem;}
.fc-veredicto-text{font-size:.9rem;font-weight:900;color:#1e293b;margin-bottom:.3rem;}
.fc-veredicto-desc{font-size:.78rem;color:#475569;line-height:1.5;}
.fc-confianza{display:inline-flex;align-items:center;gap:.3rem;font-size:.65rem;font-weight:700;padding:.15rem .5rem;border-radius:20px;margin-top:.3rem;}
.fc-confianza.alto{background:#dcfce7;color:#166534;}
.fc-confianza.medio{background:#fef9c3;color:#854d0e;}
.fc-confianza.bajo{background:#fee2e2;color:#991b1b;}
.fc-section{border:1px solid #e2e8f0;border-radius:12px;overflow:hidden;}
.fc-section-header{padding:.55rem .85rem;background:#f8fafc;border-bottom:1px solid #e2e8f0;display:flex;align-items:center;gap:.5rem;}
.fc-section-icon{font-size:.9rem;}
.fc-section-title{font-size:.72rem;font-weight:800;color:#374151;text-transform:uppercase;letter-spacing:.05em;}
.fc-section-body{padding:.7rem .85rem;display:flex;flex-direction:column;gap:.4rem;}
.fc-tags{display:flex;flex-wrap:wrap;gap:.3rem;}
.fc-tag{font-size:.67rem;font-weight:700;padding:.18rem .55rem;border-radius:20px;background:#f1f5f9;color:#475569;border:1px solid #e2e8f0;}
.fc-tag.alerta{background:#fef2f2;color:#991b1b;border-color:#fca5a5;}
.fc-tag.ok{background:#f0fdf4;color:#166534;border-color:#86efac;}
.fc-tag.marco{background:#eff6ff;color:#1d4ed8;border-color:#bfdbfe;}
.fc-row{font-size:.78rem;color:#374151;line-height:1.5;display:flex;gap:.5rem;}
.fc-row::before{content:'→';color:#94a3b8;flex-shrink:0;}
.fc-conclusion{background:linear-gradient(135deg,#0f172a,#1e293b);border-radius:12px;padding:.9rem 1.1rem;}
.fc-conclusion-title{font-size:.68rem;font-weight:800;color:#94a3b8;text-transform:uppercase;letter-spacing:.07em;margin-bottom:.35rem;}
.fc-conclusion-text{font-size:.82rem;color:#e2e8f0;line-height:1.55;margin-bottom:.5rem;}
.fc-conclusion-rec{font-size:.75rem;color:#7dd3fc;line-height:1.5;}
@media(max-width:600px){.fc-modal{max-height:100vh;border-radius:16px 16px 0 0;}.fc-bg{align-items:flex-end;padding:0;}}
/* ── SALA DE IDEAS MODAL ──────────────────────────────── */
.si-bg{display:none;position:fixed;inset:0;z-index:810;background:rgba(0,0,0,.55);backdrop-filter:blur(6px);align-items:flex-end;justify-content:center;padding:0;}
.si-bg.show{display:flex;animation:siFadeIn .2s ease;}
@keyframes siFadeIn{from{opacity:0}to{opacity:1}}
.si-sheet{background:linear-gradient(180deg,#0f0a1e 0%,#130c24 100%);width:100%;max-width:560px;border-radius:20px 20px 0 0;padding:1.4rem 1.5rem 2rem;box-shadow:0 -8px 40px rgba(124,58,237,.18);position:relative;}
@media(min-height:700px){.si-bg{align-items:center;}.si-sheet{border-radius:20px;max-height:85vh;overflow-y:auto;}}
.si-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.1rem;}
.si-title{display:flex;align-items:center;gap:.6rem;}
.si-icon{font-size:1.4rem;}
.si-name{font-size:1rem;font-weight:900;color:#f3f4f6;}
.si-badge{font-size:.58rem;font-weight:800;background:rgba(167,139,250,.15);color:#a78bfa;border:1px solid rgba(167,139,250,.25);border-radius:20px;padding:.12rem .5rem;letter-spacing:.06em;text-transform:uppercase;}
.si-close{background:rgba(255,255,255,.08);border:none;color:#9ca3af;width:30px;height:30px;border-radius:50%;cursor:pointer;font-size:.9rem;display:flex;align-items:center;justify-content:center;transition:all .15s;}
.si-close:hover{background:rgba(255,255,255,.15);color:#fff;}
.si-desc{font-size:.8rem;color:#9ca3af;line-height:1.6;margin-bottom:1.1rem;}
.si-desc strong{color:#e5e7eb;}
.si-phases{display:flex;gap:.5rem;margin-bottom:1.2rem;}
.si-phase{flex:1;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);border-radius:10px;padding:.5rem .6rem;text-align:center;}
.si-phase-icon{font-size:.9rem;display:block;margin-bottom:.2rem;}
.si-phase-label{font-size:.62rem;font-weight:700;color:#6b7280;text-transform:uppercase;letter-spacing:.05em;display:block;}
.si-phase-name{font-size:.72rem;color:#d1d5db;font-weight:600;}
.si-start-btn{width:100%;padding:.75rem;background:linear-gradient(135deg,#7c3aed,#6d28d9);border:none;border-radius:12px;color:#fff;font-size:.9rem;font-weight:800;cursor:pointer;font-family:inherit;transition:all .15s;letter-spacing:.02em;}
.si-start-btn:hover{filter:brightness(1.1);transform:translateY(-1px);}
/* Timer banner — aparece en el chat cuando la sesión está activa */
#salaIdeasBanner{display:none;background:linear-gradient(135deg,rgba(124,58,237,.12),rgba(109,40,217,.08));border:1px solid rgba(167,139,250,.2);border-radius:12px;padding:.5rem .9rem;margin:.3rem 0 .5rem;align-items:center;justify-content:space-between;gap:.5rem;flex-shrink:0;}
#salaIdeasBanner.show{display:flex;}
.si-banner-left{display:flex;align-items:center;gap:.5rem;}
.si-banner-icon{font-size:.9rem;}
.si-banner-label{font-size:.72rem;font-weight:700;color:#a78bfa;}
.si-timer{font-size:.72rem;font-weight:900;color:#c4b5fd;font-variant-numeric:tabular-nums;background:rgba(124,58,237,.15);padding:.1rem .4rem;border-radius:6px;}
.si-banner-close{background:none;border:none;color:#6b7280;cursor:pointer;font-size:.85rem;padding:.1rem .3rem;transition:color .15s;}
.si-banner-close:hover{color:#fff;}
/* Sala de Ideas — modo inmersivo (sesión activa) */
#chatMsgs.si-running .msg,
#chatMsgs.si-running #welcomeScreen,
#chatMsgs.si-running .obra-card,
#chatMsgs.si-running .yt-auto-results { display:none !important; }
/* ── SALA DE IDEAS — Neural Network Overlay ── */
#siLiveOverlay{
  display:none;flex-direction:column;align-items:center;justify-content:center;
  flex:1;min-height:0;position:relative;overflow:hidden;background:#050510;
}
#siLiveOverlay.show{display:flex;}
#siCanvas{display:block;width:100%;height:100%;position:absolute;inset:0;}
/* HUD elements above the canvas */
.si-hud{
  position:relative;z-index:10;
  display:flex;flex-direction:column;align-items:center;gap:.7rem;
  pointer-events:none;
}
.si-state-label{
  font-family:'Courier New',monospace;
  font-size:.65rem;font-weight:700;letter-spacing:.25em;text-transform:uppercase;
  color:rgba(100,200,255,.7);
  border:1px solid rgba(100,200,255,.2);
  padding:.2rem .7rem;border-radius:2px;
  background:rgba(0,10,30,.6);
  transition:color .4s,border-color .4s;
}
.si-state-label.thinking{color:rgba(255,180,40,.9);border-color:rgba(255,180,40,.35);}
.si-state-label.speaking{color:rgba(40,255,180,.9);border-color:rgba(40,255,180,.35);}
.si-last-heard{
  font-family:'Courier New',monospace;
  font-size:.72rem;color:rgba(150,180,255,.65);font-style:normal;
  text-align:center;max-width:320px;line-height:1.6;
  background:rgba(0,5,20,.7);border:1px solid rgba(100,150,255,.12);
  padding:.35rem .8rem;border-radius:3px;
  min-height:2.2em;letter-spacing:.02em;
  transition:opacity .3s;
}
.si-timer-hud{
  font-family:'Courier New',monospace;
  font-size:.6rem;color:rgba(100,180,255,.45);letter-spacing:.15em;
}
.video-card{display:flex;align-items:center;gap:.75rem;background:linear-gradient(135deg,#fff5f5,#fff);border:1.5px solid #fca5a5;border-left:4px solid #ef4444;border-radius:12px;padding:.6rem .9rem;margin:.5rem 0;cursor:pointer;transition:all .2s;}
.video-card:hover{border-color:#ef4444;box-shadow:0 4px 16px rgba(239,68,68,.12);transform:translateY(-1px);}
.vc-play{width:36px;height:36px;min-width:36px;background:#ef4444;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:.85rem;}
.vc-body{flex:1;min-width:0;}
.vc-label{font-size:.6rem;font-weight:900;color:#ef4444;letter-spacing:.05em;text-transform:uppercase;margin-bottom:.1rem;}
.vc-desc{font-size:.75rem;font-weight:800;color:var(--text);line-height:1.4;}
.vc-why{font-size:.68rem;color:var(--muted);margin-top:.15rem;line-height:1.4;}
.vc-actions{display:flex;flex-direction:column;gap:.3rem;flex-shrink:0;}
.vc-btn-yt{font-size:.64rem;font-weight:800;background:#ef4444;color:#fff;padding:.25rem .6rem;border-radius:6px;text-decoration:none;white-space:nowrap;text-align:center;display:block;}
.vc-btn-here{font-size:.64rem;font-weight:800;background:transparent;color:#ef4444;border:1.5px solid #ef4444;padding:.22rem .58rem;border-radius:6px;cursor:pointer;white-space:nowrap;font-family:inherit;display:block;text-align:center;}
.vc-btn-here:hover{background:#fef2f2;}
/* ─── VIDEO MODAL ─────────────────────────────────── */
#videoBg{position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:9999;display:none;align-items:center;justify-content:center;padding:1rem;}
#videoBg.show{display:flex;}
.vm-box{background:#fff;border-radius:16px;overflow:hidden;width:100%;max-width:660px;display:flex;flex-direction:column;animation:fadeUp .25s ease both;}
.vm-head{display:flex;align-items:center;gap:.6rem;padding:.7rem 1rem;background:#fef2f2;border-bottom:1px solid #fecaca;}
.vm-logo{width:32px;height:32px;background:#ef4444;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:.9rem;flex-shrink:0;}
.vm-title-wrap{flex:1;min-width:0;}
.vm-ttitle{font-size:.75rem;font-weight:900;color:#1f2937;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.vm-channel{font-size:.65rem;color:#6b7280;font-weight:600;}
.vm-close{background:none;border:none;cursor:pointer;color:#9ca3af;font-size:1.2rem;padding:.2rem .4rem;flex-shrink:0;}
.vm-player{position:relative;background:#000;}
.vm-player iframe{display:block;width:100%;aspect-ratio:16/9;border:none;}
.vm-fallback{padding:2rem 1.5rem;text-align:center;display:none;}
.vm-fallback p{font-size:.8rem;color:#6b7280;margin-bottom:.6rem;}
.vm-search-box{background:#f9fafb;border:1.5px solid #e5e7eb;border-radius:10px;padding:.6rem 1rem;font-size:.8rem;color:#374151;font-style:italic;margin-bottom:1.2rem;}
.vm-yt-btn{display:inline-flex;align-items:center;gap:.5rem;background:#ef4444;color:#fff;padding:.65rem 1.4rem;border-radius:12px;text-decoration:none;font-weight:900;font-size:.85rem;box-shadow:0 4px 0 #b91c1c;transition:all .2s;}
.vm-yt-btn:hover{transform:translateY(-2px);box-shadow:0 6px 0 #b91c1c;}
.vm-footer{padding:.6rem 1rem;border-top:1px solid #f3f4f6;font-size:.65rem;color:#9ca3af;display:flex;justify-content:space-between;align-items:center;}

/* Typing */
.typing{display:flex;gap:5px;align-items:center;padding:.5rem .6rem;}
.typing span{width:7px;height:7px;border-radius:50%;background:var(--p2);animation:bonce 1.2s infinite;}
.typing span:nth-child(2){animation-delay:.2s;}
.typing span:nth-child(3){animation-delay:.4s;}

/* Image strip */
.img-strip{display:none;align-items:center;gap:.7rem;margin-bottom:.5rem;background:#faf5ff;border:1.5px solid #c4b5fd;padding:.5rem .8rem;border-radius:10px;}
.img-strip.show{display:flex;}
.img-strip-thumb{width:48px;height:48px;object-fit:cover;border-radius:8px;border:2px solid var(--p2);}
.img-strip-info{flex:1;}
.img-strip-info strong{display:block;font-size:.8rem;color:var(--p);font-weight:800;}
.img-strip-info span{font-size:.7rem;color:var(--muted);}
.img-strip-rm{background:transparent;border:1.5px solid #c4b5fd;color:var(--p);width:24px;height:24px;border-radius:50%;cursor:pointer;font-size:.75rem;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .15s;}
.img-strip-rm:hover{background:var(--p);color:#fff;}

/* Input area */
.input-area{border-top:1px solid var(--border);background:rgba(255,255,255,.95);backdrop-filter:blur(10px);padding:.9rem 1.2rem;}
.paywall-banner{display:none;background:linear-gradient(135deg,#fef3c7,#fde68a);border:2px solid #fbbf24;border-radius:10px;padding:.6rem 1rem;margin-bottom:.6rem;font-size:.78rem;font-weight:800;color:#92400e;text-align:center;cursor:pointer;}
.paywall-banner.show{display:block;}
.mode-bar{display:flex;gap:.35rem;margin-bottom:.6rem;overflow-x:auto;scrollbar-width:none;}
.mode-bar::-webkit-scrollbar{display:none;}
.mbar-btn{font-size:.7rem;font-weight:800;padding:.28rem .7rem;border-radius:8px;border:1.5px solid var(--border);background:transparent;color:var(--muted);cursor:pointer;white-space:nowrap;transition:all .15s;flex-shrink:0;}
.mbar-btn:hover{border-color:var(--p2);color:var(--p);}
.mbar-btn.active{background:linear-gradient(135deg,var(--p),var(--p2));border-color:transparent;color:#fff;box-shadow:0 2px 8px rgba(124,58,237,.4);}
.subject-bar{display:flex;align-items:center;gap:.4rem;margin-bottom:.4rem;overflow-x:auto;scrollbar-width:none;}
.subject-bar::-webkit-scrollbar{display:none;}
.subj-btn{font-size:.68rem;font-weight:800;padding:.22rem .6rem;border-radius:6px;border:1.5px solid var(--border);background:transparent;color:var(--muted);cursor:pointer;white-space:nowrap;transition:all .15s;flex-shrink:0;font-family:inherit;}
.subj-btn:hover{border-color:#7c3aed;color:#7c3aed;}
.subj-btn.active{background:#7c3aed;border-color:#7c3aed;color:#fff;}
.subj-btn.stem{border-color:#059669;color:#059669;}
.subj-btn.stem.active{background:#059669;border-color:#059669;color:#fff;}
.katex-hint{font-size:.65rem;color:var(--muted);opacity:.7;margin-left:auto;white-space:nowrap;flex-shrink:0;}
.input-row{display:flex;gap:.5rem;align-items:flex-end;}
.upload-btn{width:44px;height:44px;background:#faf5ff;border:1.5px solid #c4b5fd;border-radius:10px;color:var(--p);font-size:1.1rem;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative;overflow:hidden;}
.upload-btn:hover{background:var(--p);color:#fff;border-color:var(--p);}
.upload-btn input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%;}
textarea{flex:1;font-family:'Nunito',sans-serif;font-size:.9rem;color:var(--text);background:#fff;border:1.5px solid var(--border);border-radius:12px;padding:.7rem 1rem;resize:none;min-height:44px;max-height:160px;transition:border-color .2s;line-height:1.5;}
textarea:focus{outline:none;border-color:var(--p2);box-shadow:0 0 0 3px rgba(167,139,250,.2);}
textarea::placeholder{color:#9ca3af;}
.send-btn{width:44px;height:44px;background:linear-gradient(135deg,var(--p),var(--p2));border:none;border-radius:10px;color:#fff;font-size:1.1rem;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 3px 0 #6d28d9;}
.send-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 5px 0 #6d28d9;}
.send-btn:active:not(:disabled){transform:translateY(1px);box-shadow:0 2px 0 #6d28d9;}
.send-btn:disabled{opacity:.4;cursor:not-allowed;transform:none;box-shadow:none;}
.voice-btn{width:44px;height:44px;background:#fff;border:1.5px solid #c4b5fd;border-radius:10px;color:#7c3aed;font-size:1.1rem;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.voice-btn:hover{background:#f5f3ff;border-color:#7c3aed;}
.voice-btn.listening{background:#7c3aed;color:#fff;border-color:#7c3aed;animation:voicePulse .8s ease-in-out infinite;}
.voice-btn.speaking{background:#059669;color:#fff;border-color:#059669;}
.voice-btn.hidden-plan{display:none;}
@keyframes voicePulse{0%,100%{box-shadow:0 0 0 0 rgba(124,58,237,.4);}50%{box-shadow:0 0 0 8px rgba(124,58,237,0);}}

/* Drop overlay */
.drop-ov{display:none;position:fixed;inset:0;z-index:600;background:rgba(76,29,149,.88);backdrop-filter:blur(8px);align-items:center;justify-content:center;}
.drop-ov.on{display:flex;}
.drop-box{border:3px dashed rgba(167,139,250,.7);padding:3rem 5rem;border-radius:20px;color:#fff;text-align:center;animation:dropPulse .8s ease infinite alternate;}
.drop-box .drop-icon{font-size:3rem;display:block;margin-bottom:.8rem;}

/* Toast */
.toast{position:fixed;bottom:2rem;left:50%;transform:translateX(-50%) translateY(80px);background:#1f2937;color:#fff;padding:.75rem 1.5rem;border-radius:20px;font-size:.82rem;font-weight:800;z-index:900;opacity:0;transition:all .4s;pointer-events:none;white-space:nowrap;}
.toast.show{transform:translateX(-50%) translateY(0);opacity:1;}

/* ══ SHARE CARD ══ */
canvas#shareCanvas{display:none;}
.share-modal-bg{display:none;position:fixed;inset:0;z-index:700;background:rgba(15,10,30,.85);backdrop-filter:blur(10px);align-items:flex-end;justify-content:center;}
.modal-bg{display:none;position:fixed;inset:0;z-index:2000;background:rgba(0,0,0,.75);backdrop-filter:blur(6px);justify-content:center;overflow-y:auto;}
.share-modal-bg.show{display:flex;}
.share-modal{background:#fff;border-radius:24px 24px 0 0;padding:1.5rem;width:100%;max-width:480px;animation:slideUp .35s ease both;}
.share-modal h4{font-size:1rem;font-weight:900;color:#1f2937;text-align:center;margin-bottom:1rem;}
.share-preview{width:100%;aspect-ratio:9/16;border-radius:12px;overflow:hidden;margin-bottom:1rem;cursor:pointer;max-height:300px;object-fit:contain;}
.share-btns{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;}
.share-action{padding:.7rem;border-radius:12px;border:2px solid var(--border);background:#f9fafb;cursor:pointer;font-size:.78rem;font-weight:800;color:#374151;transition:all .15s;text-align:center;}
.share-action:hover{border-color:var(--p2);background:#faf5ff;color:var(--p);}
.share-close{margin-top:.6rem;width:100%;padding:.6rem;border-radius:12px;border:none;background:#f3f4f6;font-family:'Nunito',sans-serif;font-size:.82rem;font-weight:800;color:var(--muted);cursor:pointer;}

/* ══ CHECKOUT MODAL ══ */
.checkout-bg{display:none;position:fixed;inset:0;z-index:700;background:rgba(15,10,30,.85);backdrop-filter:blur(10px);align-items:center;justify-content:center;padding:1rem;}
.checkout-bg.show{display:flex;}
.checkout-box{background:#fff;border-radius:24px;max-width:400px;width:100%;overflow:hidden;box-shadow:0 32px 80px rgba(0,0,0,.5);animation:popUp .4s cubic-bezier(.34,1.56,.64,1) both;}
.co-head{padding:1.8rem 1.5rem 1.4rem;text-align:center;}
.co-head .co-icon{font-size:2.8rem;display:block;margin-bottom:.4rem;}
.co-head h3{font-size:1.1rem;font-weight:900;color:#fff;margin-bottom:.2rem;}
.co-head .co-sub{color:rgba(255,255,255,.8);font-size:.8rem;font-weight:700;}
.co-head .co-price-tag{display:inline-block;background:rgba(0,0,0,.2);border-radius:20px;padding:.3rem .9rem;color:#fff;font-size:.85rem;font-weight:900;margin-top:.4rem;}

/* Steps */
.co-steps{display:flex;padding:1rem 1.5rem .5rem;gap:0;}
.co-step-dot{flex:1;text-align:center;font-size:.65rem;font-weight:900;color:#d1d5db;padding-bottom:.5rem;border-bottom:3px solid #e5e7eb;transition:all .3s;}
.co-step-dot.active{color:var(--p);border-color:var(--p);}
.co-step-dot.done{color:#10b981;border-color:#10b981;}

.co-body{padding:.8rem 1.5rem 1.2rem;}
.co-step{display:none;}
.co-step.active{display:block;}

/* Step 1 - register */
.co-field{margin-bottom:.85rem;}
.co-field label{display:block;font-size:.68rem;font-weight:900;color:#374151;text-transform:uppercase;letter-spacing:.06em;margin-bottom:.35rem;}
.co-input{width:100%;border:2px solid #e5e7eb;border-radius:10px;padding:.6rem .9rem;font-family:'Nunito',sans-serif;font-size:.9rem;font-weight:700;color:#1f2937;transition:border-color .2s;}
.co-input:focus{outline:none;border-color:var(--p);box-shadow:0 0 0 3px rgba(124,58,237,.15);}
.co-phone-row{display:flex;gap:.5rem;}
.co-phone-prefix{width:70px;flex-shrink:0;}

/* Step 2 - payment info */
.ls-embed-container{min-height:280px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:1rem;text-align:center;}
.ls-logo{font-size:2.5rem;display:block;}
.ls-text{font-size:.85rem;font-weight:700;color:#374151;line-height:1.6;}
.ls-email-confirm{background:#f0fdf4;border:1.5px solid #86efac;border-radius:10px;padding:.6rem .9rem;font-size:.8rem;font-weight:800;color:#166534;margin-bottom:.8rem;text-align:center;}

/* Step 3 - success */
.co-success{text-align:center;padding:1rem 0 .5rem;}
.co-success .cs-icon{font-size:4rem;display:block;margin-bottom:.5rem;}
.co-success h4{font-size:1.1rem;font-weight:900;color:#1f2937;margin-bottom:.35rem;}
.co-success p{font-size:.82rem;font-weight:600;color:var(--muted);line-height:1.6;}

/* Buttons */
.co-btn{width:100%;background:linear-gradient(135deg,var(--p),var(--p2));border:none;border-radius:12px;color:#fff;font-family:'Nunito',sans-serif;font-weight:900;font-size:.92rem;padding:.75rem;cursor:pointer;transition:all .2s;box-shadow:0 4px 0 #6d28d9;display:flex;align-items:center;justify-content:center;gap:.5rem;margin-top:.4rem;}
.co-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 0 #6d28d9;}
.co-btn:active:not(:disabled){transform:translateY(1px);box-shadow:0 2px 0 #6d28d9;}
.co-btn:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none;}
.co-btn.familia-btn{background:linear-gradient(135deg,#0891b2,#06b6d4);box-shadow:0 4px 0 #0e7490;}
.co-btn.familia-btn:hover:not(:disabled){box-shadow:0 6px 0 #0e7490;}
.co-btn-ghost{width:100%;background:transparent;border:2px solid #e5e7eb;border-radius:12px;color:var(--muted);font-family:'Nunito',sans-serif;font-weight:800;font-size:.82rem;padding:.6rem;cursor:pointer;transition:all .2s;margin-top:.5rem;}
.co-btn-ghost:hover{border-color:var(--border);color:#374151;}
.co-status{font-size:.76rem;font-weight:800;min-height:1.2em;margin:.4rem 0;color:#dc2626;}
.co-status.ok{color:#16a34a;}
.co-terms{font-size:.65rem;font-weight:600;color:#9ca3af;text-align:center;margin-top:.6rem;line-height:1.5;}
.co-terms a{color:var(--p);}
.co-trust{display:flex;justify-content:center;gap:1rem;padding:.6rem 1.5rem 1rem;border-top:1px solid #f3f4f6;}
.co-trust-item{font-size:.65rem;font-weight:800;color:#9ca3af;display:flex;align-items:center;gap:.25rem;}
.co-spinner{display:inline-block;width:16px;height:16px;border:2.5px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite;}

/* ══ PRICING MODAL ══ */
.pricing-bg{display:none;position:fixed;inset:0;z-index:700;background:rgba(15,10,30,.85);backdrop-filter:blur(10px);align-items:center;justify-content:center;padding:1rem;overflow-y:auto;}
.pricing-bg.show{display:flex;}
.pricing-modal{background:#fff;border-radius:24px;width:100%;max-width:640px;overflow:hidden;animation:popUp .4s cubic-bezier(.34,1.56,.64,1) both;margin:auto;}
.pm-head{background:linear-gradient(135deg,#4c1d95,#7c3aed,#a855f7,#f472b6);padding:1.8rem 1.5rem 1.4rem;text-align:center;position:relative;}
.pm-head h2{font-size:1.2rem;font-weight:900;color:#fff;margin-bottom:.3rem;}
.pm-head p{font-size:.8rem;color:rgba(255,255,255,.8);font-weight:700;}
.pm-close{position:absolute;top:.9rem;right:.9rem;background:rgba(255,255,255,.15);border:none;color:#fff;width:30px;height:30px;border-radius:50%;cursor:pointer;font-size:.9rem;}
.billing-toggle{display:flex;align-items:center;justify-content:center;gap:.8rem;padding:1rem 1.5rem .6rem;}
.billing-label{font-size:.8rem;font-weight:800;color:var(--muted);}
.billing-label.active{color:var(--p);}
.toggle-sw{width:44px;height:24px;background:#e5e7eb;border-radius:12px;border:none;cursor:pointer;position:relative;transition:background .2s;}
.toggle-sw.yearly{background:var(--p);}
.toggle-knob{width:20px;height:20px;background:#fff;border-radius:50%;position:absolute;top:2px;left:2px;transition:transform .2s;box-shadow:0 1px 4px rgba(0,0,0,.2);}
.toggle-sw.yearly .toggle-knob{transform:translateX(20px);}
.save-pill{background:#dcfce7;color:#166534;font-size:.65rem;font-weight:900;padding:.2rem .6rem;border-radius:10px;}
.plans-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;padding:0 1.2rem 1.2rem;}
.plan-card{border:2px solid var(--border);border-radius:16px;padding:1rem;position:relative;transition:all .2s;}
.plan-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);}
.plan-card.popular{border-color:var(--p2);box-shadow:0 4px 20px rgba(167,139,250,.3);}
.popular-tag{position:absolute;top:-.6rem;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,var(--p),var(--p2));color:#fff;font-size:.6rem;font-weight:900;padding:.2rem .7rem;border-radius:8px;white-space:nowrap;}
.plan-icon{font-size:1.8rem;display:block;margin-bottom:.4rem;}
.plan-name{font-size:.88rem;font-weight:900;color:#1f2937;margin-bottom:.15rem;}
.plan-desc{font-size:.68rem;font-weight:700;color:var(--muted);margin-bottom:.6rem;line-height:1.4;}
/* ── Redesigned price block ── */
.plan-price{margin-bottom:.7rem;}
.plan-price-row{display:flex;align-items:baseline;gap:.2rem;}
.plan-price .og{font-size:.72rem;color:#9ca3af;text-decoration:line-through;display:block;margin-bottom:.1rem;}
.plan-price .amt{font-size:1.3rem;font-weight:900;color:var(--p);}
.plan-price .per{font-size:.7rem;font-weight:700;color:var(--muted);}
.plan-price .billing-note{display:block;font-size:.62rem;font-weight:800;color:#9ca3af;margin-top:.15rem;line-height:1.3;}
.plan-price .billing-note.saving{color:#16a34a;font-weight:900;}
.plan-price-both{display:flex;flex-direction:column;gap:.3rem;}
.pricetag{display:flex;align-items:center;justify-content:space-between;padding:.32rem .6rem;border-radius:8px;border:1.5px solid #e5e7eb;cursor:pointer;transition:all .2s;}
.pricetag.active{border-color:var(--p2);background:#faf5ff;}
.pricetag.active-annual{border-color:#16a34a;background:#f0fdf4;}
.pricetag-left{display:flex;align-items:center;gap:.4rem;}
.pricetag-radio{width:12px;height:12px;border-radius:50%;border:2px solid #d1d5db;flex-shrink:0;transition:all .2s;}
.pricetag.active .pricetag-radio{border-color:var(--p);background:var(--p);}
.pricetag.active-annual .pricetag-radio{border-color:#16a34a;background:#16a34a;}
.pricetag-label{font-size:.72rem;font-weight:800;color:#374151;}
.pricetag-label small{display:block;font-size:.6rem;font-weight:700;color:#9ca3af;line-height:1.3;}
.pricetag-price{text-align:right;flex-shrink:0;}
.pricetag-price strong{display:block;font-size:.88rem;font-weight:900;color:#1f2937;}
.pricetag-price span{font-size:.6rem;font-weight:800;color:#16a34a;}
.plan-feats{font-size:.72rem;font-weight:700;color:#374151;display:flex;flex-direction:column;gap:.3rem;margin-bottom:.8rem;}
.plan-feat{display:flex;align-items:center;gap:.4rem;}
.plan-feat.locked{color:#9ca3af;}
.plan-btn{width:100%;padding:.6rem;border-radius:10px;border:none;font-family:'Nunito',sans-serif;font-weight:900;font-size:.78rem;cursor:pointer;transition:all .2s;}
.plan-btn.free-btn{background:#f3f4f6;color:#374151;}
.plan-btn.free-btn:hover{background:#e5e7eb;}
.plan-btn.pro-btn{background:linear-gradient(135deg,var(--p),var(--p2));color:#fff;box-shadow:0 3px 0 #6d28d9;}
.plan-btn.pro-btn:hover{transform:translateY(-1px);box-shadow:0 5px 0 #6d28d9;}
.plan-btn.fam-btn{background:linear-gradient(135deg,#0891b2,#06b6d4);color:#fff;box-shadow:0 3px 0 #0e7490;}
.plan-btn.fam-btn:hover{transform:translateY(-1px);box-shadow:0 5px 0 #0e7490;}
.pm-footer{text-align:center;padding:.4rem 1.2rem 1rem;font-size:.68rem;font-weight:700;color:#9ca3af;}
@media(max-width:500px){.plans-grid{grid-template-columns:1fr;}}

/* ══ PARENT PANEL ══ */
.pin-bg{display:none;position:fixed;inset:0;z-index:800;background:rgba(0,0,0,.7);backdrop-filter:blur(8px);align-items:center;justify-content:center;}
.pin-bg.show{display:flex;}
.pin-box{background:#1e293b;border-radius:20px;padding:1.5rem;max-width:320px;width:100%;animation:popUp .3s ease both;}
.pin-box h3{color:#fff;font-size:1rem;font-weight:900;text-align:center;margin-bottom:.3rem;}
.pin-box p{color:#94a3b8;font-size:.75rem;text-align:center;margin-bottom:1rem;}
.pin-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem;margin-bottom:.8rem;}
.pin-key{height:52px;background:#334155;border:none;border-radius:10px;color:#fff;font-size:1.2rem;font-weight:900;cursor:pointer;transition:all .15s;font-family:'Nunito',sans-serif;}
.pin-key:hover{background:#475569;}
.pin-key:active{transform:scale(.95);}
.pin-key.del{background:#450a0a;color:#fca5a5;}
.pin-display{text-align:center;font-size:1.4rem;letter-spacing:.4em;color:#c4b5fd;margin-bottom:.8rem;min-height:1.8rem;}
.pin-status{font-size:.75rem;text-align:center;color:#f87171;min-height:1.2em;margin-bottom:.4rem;}
.pin-cancel{width:100%;background:transparent;border:1px solid #334155;border-radius:10px;color:#64748b;font-family:'Nunito',sans-serif;font-size:.8rem;font-weight:800;padding:.6rem;cursor:pointer;}

.parent-bg{display:none;position:fixed;inset:0;z-index:800;background:rgba(0,0,0,.75);backdrop-filter:blur(8px);align-items:center;justify-content:center;padding:1rem;}
.parent-bg.show{display:flex;}
.parent-box{background:#0f172a;border-radius:20px;max-width:440px;width:100%;overflow:hidden;animation:popUp .3s ease both;}
.parent-head{background:linear-gradient(135deg,#1e3a5f,#1e40af);padding:1.2rem 1.5rem;display:flex;justify-content:space-between;align-items:center;}
.parent-head h3{color:#fff;font-size:.95rem;font-weight:900;}
.parent-head button{background:transparent;border:none;color:#94a3b8;cursor:pointer;font-size:1rem;}
.parent-body{padding:1.2rem 1.5rem;}
.pp-field{margin-bottom:.8rem;}
.pp-field label{display:block;font-size:.65rem;font-weight:900;text-transform:uppercase;letter-spacing:.06em;color:#64748b;margin-bottom:.3rem;}
.pp-input{width:100%;background:#1e293b;border:1.5px solid #334155;border-radius:8px;padding:.55rem .9rem;color:#e2e8f0;font-family:'Nunito',sans-serif;font-size:.85rem;font-weight:700;}
.pp-input:focus{outline:none;border-color:#3b82f6;}
.pp-small{font-size:.65rem;color:#475569;margin-top:.25rem;line-height:1.4;}
.pp-div{height:1px;background:#1e293b;margin:.7rem 0;}
.pp-info{background:#0c1a2e;border-radius:10px;padding:.7rem .9rem;font-size:.72rem;color:#64748b;line-height:1.5;margin-bottom:.8rem;}
.pp-status{font-size:.75rem;min-height:1.2em;text-align:center;font-weight:800;}
.pp-save{width:100%;background:linear-gradient(135deg,#1d4ed8,#3b82f6);border:none;border-radius:10px;color:#fff;font-family:'Nunito',sans-serif;font-weight:900;font-size:.85rem;padding:.7rem;cursor:pointer;transition:all .2s;margin-bottom:.4rem;}
.pp-close{width:100%;background:transparent;border:1px solid #1e293b;border-radius:10px;color:#475569;font-family:'Nunito',sans-serif;font-size:.8rem;font-weight:800;padding:.6rem;cursor:pointer;}

/* Secret trigger */
.secret-trigger{position:fixed;bottom:0;right:0;width:44px;height:44px;z-index:1000;cursor:default;}

/* ══ PROFILE CARD IN DRAWER ══ */
.drawer-profile{
  margin:.6rem .8rem .2rem;
  background:linear-gradient(135deg,rgba(124,58,237,.25),rgba(168,85,247,.15));
  border:1.5px solid rgba(167,139,250,.3);
  border-radius:14px;padding:.85rem 1rem;cursor:pointer;transition:all .2s;
}
.drawer-profile:hover{background:linear-gradient(135deg,rgba(124,58,237,.35),rgba(168,85,247,.25));}
.dp-row{display:flex;align-items:center;gap:.7rem;}
.dp-avatar{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,#7c3aed,#f472b6);
  display:flex;align-items:center;justify-content:center;font-size:.9rem;font-weight:900;color:#fff;
  flex-shrink:0;border:2px solid rgba(196,181,253,.4);}
.dp-info{flex:1;min-width:0;}
.dp-name{font-size:.82rem;font-weight:900;color:#e9d5ff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.dp-sub{font-size:.65rem;font-weight:700;color:rgba(196,181,253,.6);margin-top:.1rem;}
.dp-nota{text-align:right;flex-shrink:0;}
.dp-nota-val{font-family:'JetBrains Mono',monospace;font-size:1.1rem;font-weight:900;color:#fbbf24;line-height:1;}
.dp-nota-lbl{font-size:.58rem;font-weight:800;color:rgba(251,191,36,.6);text-transform:uppercase;letter-spacing:.06em;}
.dp-stats{display:flex;gap:.5rem;margin-top:.6rem;padding-top:.5rem;border-top:1px solid rgba(255,255,255,.08);}
.dp-stat{flex:1;text-align:center;}
.dp-stat strong{display:block;font-size:.82rem;font-weight:900;color:#c4b5fd;}
.dp-stat span{font-size:.58rem;font-weight:700;color:rgba(196,181,253,.5);text-transform:uppercase;letter-spacing:.04em;}

/* ══ EXAM WIZARD MODAL ══ */
.exam-bg{display:none;position:fixed;inset:0;z-index:700;background:rgba(15,10,30,.9);
  backdrop-filter:blur(12px);align-items:center;justify-content:center;padding:1rem;}
.exam-bg.show{display:flex;}
.exam-box{background:#fff;border-radius:24px;width:100%;max-width:460px;overflow:hidden;
  box-shadow:0 32px 80px rgba(0,0,0,.5);animation:popUp .4s cubic-bezier(.34,1.56,.64,1) both;
  max-height:92vh;display:flex;flex-direction:column;}
.exam-head{background:linear-gradient(135deg,#1e0a3c,#3b0764,#7c3aed);
  padding:1.4rem 1.5rem 1rem;flex-shrink:0;}
.exam-head h3{font-size:1.05rem;font-weight:900;color:#fff;display:flex;align-items:center;gap:.5rem;}
.exam-head p{font-size:.75rem;color:rgba(255,255,255,.65);margin-top:.25rem;font-weight:700;}
.exam-progress{display:flex;gap:.3rem;margin-top:.9rem;}
.exam-dot{flex:1;height:3px;border-radius:2px;background:rgba(255,255,255,.2);transition:background .3s;}
.exam-dot.done{background:#fbbf24;}
.exam-dot.active{background:#f472b6;}
.exam-body{flex:1;overflow-y:auto;padding:1.3rem 1.5rem;}
.exam-body::-webkit-scrollbar{width:3px;}
.exam-body::-webkit-scrollbar-thumb{background:#e5e7eb;}
.exam-step{display:none;}
.exam-step.active{display:block;}
.exam-q{font-size:.82rem;font-weight:900;color:#374151;margin-bottom:.65rem;
  display:flex;align-items:center;gap:.5rem;}
.exam-opts{display:flex;flex-direction:column;gap:.4rem;}
.exam-opt{padding:.65rem .9rem;border:2px solid #e5e7eb;border-radius:12px;
  font-size:.83rem;font-weight:700;color:#374151;cursor:pointer;
  transition:all .15s;display:flex;align-items:center;gap:.65rem;user-select:none;}
.exam-opt:hover{border-color:#c4b5fd;background:#faf5ff;color:#5b21b6;}
.exam-opt.selected{border-color:#7c3aed;background:linear-gradient(135deg,#ede9fe,#faf5ff);color:#4c1d95;}
.exam-opt .eo-icon{font-size:1.1rem;flex-shrink:0;}
.exam-opt .eo-label{flex:1;line-height:1.3;}
.exam-opt .eo-sub{display:block;font-size:.67rem;font-weight:600;color:#9ca3af;margin-top:.1rem;}
.exam-opt.selected .eo-sub{color:#7c3aed;}
.exam-sub-grid{display:grid;grid-template-columns:1fr 1fr;gap:.4rem;}
.exam-opt-sm{padding:.5rem .7rem;border:2px solid #e5e7eb;border-radius:10px;
  font-size:.78rem;font-weight:800;color:#374151;cursor:pointer;transition:all .15s;
  text-align:center;user-select:none;}
.exam-opt-sm:hover{border-color:#c4b5fd;background:#faf5ff;}
.exam-opt-sm.selected{border-color:#7c3aed;background:#ede9fe;color:#4c1d95;}
.exam-select{width:100%;border:2px solid #e5e7eb;border-radius:10px;
  padding:.65rem .9rem;font-family:'Nunito',sans-serif;font-size:.88rem;
  font-weight:700;color:#374151;appearance:none;background:#f9fafb url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%236b7280' viewBox='0 0 16 16'%3E%3Cpath d='M7.247 11.14L2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3E%3C/svg%3E") no-repeat right .9rem center;}
.exam-select:focus{outline:none;border-color:#7c3aed;}
.exam-summary{background:linear-gradient(135deg,#faf5ff,#f0f9ff);border:2px solid #e0d7ff;
  border-radius:14px;padding:1rem 1.2rem;}
.exam-summary-row{display:flex;justify-content:space-between;align-items:center;
  padding:.3rem 0;font-size:.8rem;font-weight:700;color:#374151;border-bottom:1px solid #ede9fe;}
.exam-summary-row:last-child{border-bottom:none;}
.exam-summary-row span:last-child{font-weight:900;color:#4c1d95;}
.exam-footer{padding:1rem 1.5rem 1.3rem;display:flex;gap:.6rem;flex-shrink:0;
  border-top:1px solid #f3f4f6;}
.exam-btn-back{flex:1;background:transparent;border:2px solid #e5e7eb;border-radius:12px;
  font-family:'Nunito',sans-serif;font-weight:800;font-size:.85rem;color:#6b7280;
  padding:.65rem;cursor:pointer;transition:all .2s;}
.exam-btn-back:hover{border-color:#d1d5db;color:#374151;}
.exam-btn-next{flex:2;background:linear-gradient(135deg,#7c3aed,#a855f7);border:none;
  border-radius:12px;color:#fff;font-family:'Nunito',sans-serif;font-weight:900;
  font-size:.88rem;padding:.65rem;cursor:pointer;transition:all .2s;
  box-shadow:0 4px 0 #6d28d9;display:flex;align-items:center;justify-content:center;gap:.4rem;}
.exam-btn-next:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 0 #6d28d9;}
.exam-btn-next:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none;}

/* ══ GRADES HISTORY PANEL ══ */
.grades-bg{display:none;position:fixed;inset:0;z-index:700;background:rgba(15,10,30,.88);
  backdrop-filter:blur(10px);align-items:flex-end;justify-content:center;}
.grades-bg.show{display:flex;}
.grades-box{background:#fff;border-radius:24px 24px 0 0;width:100%;max-width:520px;
  max-height:88vh;display:flex;flex-direction:column;animation:slideUp .35s ease both;}
.grades-head{padding:1.2rem 1.5rem .8rem;border-bottom:1px solid #f3f4f6;flex-shrink:0;}
.grades-head h3{font-size:1rem;font-weight:900;color:#1f2937;display:flex;align-items:center;gap:.5rem;}
.grades-head p{font-size:.75rem;font-weight:600;color:#9ca3af;margin-top:.2rem;}
.grades-nota-big{display:flex;align-items:center;justify-content:center;gap:1.5rem;
  padding:.8rem 1.5rem;background:linear-gradient(135deg,#faf5ff,#fff7ed);
  border-bottom:1px solid #f3f4f6;flex-shrink:0;}
.gnb-circle{width:72px;height:72px;border-radius:50%;
  background:linear-gradient(135deg,#fbbf24,#f59e0b);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  box-shadow:0 4px 16px rgba(251,191,36,.4);}
.gnb-val{font-family:'JetBrains Mono',monospace;font-size:1.5rem;font-weight:900;color:#78350f;line-height:1;}
.gnb-den{font-size:.65rem;font-weight:800;color:#92400e;}
.gnb-stats{display:flex;flex-direction:column;gap:.4rem;}
.gnb-stat{display:flex;align-items:center;gap:.5rem;font-size:.78rem;font-weight:700;color:#374151;}
.gnb-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;}
.grades-list{flex:1;overflow-y:auto;padding:.8rem 1.5rem;}
.grade-item{display:flex;align-items:center;gap:.8rem;padding:.55rem 0;
  border-bottom:1px solid #f9fafb;}
.grade-item:last-child{border-bottom:none;}
.gi-type-tag{font-size:.6rem;font-weight:900;padding:.2rem .5rem;border-radius:6px;
  text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;flex-shrink:0;}
.gi-correccion{background:#fee2e2;color:#991b1b;}
.gi-test{background:#e0f2fe;color:#0c4a6e;}
.gi-escrito{background:#ede9fe;color:#5b21b6;}
.gi-comentario{background:#fef3c7;color:#92400e;}
.gi-label{flex:1;font-size:.78rem;font-weight:700;color:#374151;min-width:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.gi-nota{font-family:'JetBrains Mono',monospace;font-size:.88rem;font-weight:900;
  color:#7c3aed;flex-shrink:0;}
.gi-date{font-size:.65rem;font-weight:600;color:#d1d5db;flex-shrink:0;}
.grades-empty{text-align:center;padding:2.5rem 1rem;color:#9ca3af;font-size:.85rem;font-weight:700;}
.grades-empty span{display:block;font-size:2.5rem;margin-bottom:.5rem;}
.grades-close{padding:.8rem 1.5rem;border-top:1px solid #f3f4f6;flex-shrink:0;}
.grades-close button{width:100%;background:#f3f4f6;border:none;border-radius:12px;
  font-family:'Nunito',sans-serif;font-weight:800;font-size:.85rem;color:#6b7280;
  padding:.7rem;cursor:pointer;}
/* ── tabs perfil ── */
.grades-tabs{display:flex;gap:0;border-bottom:2px solid #f3f4f6;flex-shrink:0;}
.gtab{flex:1;padding:.6rem .4rem;font-size:.72rem;font-weight:800;color:#9ca3af;
  background:none;border:none;cursor:pointer;font-family:'Nunito',sans-serif;
  border-bottom:2px solid transparent;margin-bottom:-2px;transition:all .2s;}
.gtab.active{color:#7c3aed;border-bottom-color:#7c3aed;}
.gtab-panel{display:none;flex:1;overflow-y:auto;padding:.8rem 1.5rem;}
.gtab-panel.active{display:block;}
/* score chart */
.ct-chart-wrap{margin:.5rem 0 1rem;}
.ct-chart-title{font-size:.7rem;font-weight:800;color:#6b7280;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.5rem;}
.ct-chart-svg{width:100%;height:140px;}
.ct-score-big{text-align:center;padding:1rem 0 .5rem;}
.ct-score-num{font-family:'JetBrains Mono',monospace;font-size:3rem;font-weight:900;
  background:linear-gradient(135deg,#7c3aed,#a855f7);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.ct-score-level{font-size:.75rem;font-weight:800;color:#8b5cf6;text-transform:uppercase;letter-spacing:.08em;}
.ct-score-sub{font-size:.68rem;color:#9ca3af;font-weight:600;margin-top:.2rem;}
/* indicadores */
.ct-indicators{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin:1rem 0;}
.ct-ind{background:#faf5ff;border-radius:10px;padding:.5rem .7rem;}
.ct-ind-name{font-size:.65rem;font-weight:800;color:#6b7280;margin-bottom:.3rem;}
.ct-ind-bar{height:5px;background:#e9d5ff;border-radius:3px;overflow:hidden;}
.ct-ind-fill{height:100%;border-radius:3px;background:linear-gradient(90deg,#7c3aed,#a855f7);transition:width .6s ease;}
.ct-ind-val{font-size:.68rem;font-weight:900;color:#7c3aed;float:right;margin-top:-.1rem;}
/* argumentos */
.arg-item{padding:.6rem 0;border-bottom:1px solid #f3f4f6;}
.arg-item:last-child{border-bottom:none;}
.arg-header{display:flex;align-items:center;gap:.5rem;margin-bottom:.25rem;}
.arg-quality{font-size:.6rem;font-weight:900;padding:.15rem .4rem;border-radius:5px;flex-shrink:0;}
.arg-q1{background:#fee2e2;color:#991b1b;}
.arg-q2{background:#fef3c7;color:#92400e;}
.arg-q3{background:#dcfce7;color:#166534;}
.arg-q4{background:#ede9fe;color:#5b21b6;}
.arg-sesgo{font-size:.6rem;font-weight:700;color:#f59e0b;background:#fff7ed;padding:.15rem .4rem;border-radius:5px;}
.arg-text{font-size:.75rem;color:#374151;font-weight:600;line-height:1.4;font-style:italic;}
.arg-meta{font-size:.62rem;color:#d1d5db;font-weight:600;margin-top:.2rem;}
.ct-empty{text-align:center;padding:2rem 1rem;color:#9ca3af;font-size:.8rem;font-weight:700;}
.ct-empty span{display:block;font-size:2rem;margin-bottom:.4rem;}
/* estilo cognitivo card */
.ct-estilo-card{border-radius:14px;padding:1rem 1.1rem;margin:.5rem 0 1.2rem;
  display:flex;align-items:flex-start;gap:.9rem;border:2px solid transparent;}
.ct-estilo-icon{font-size:2rem;flex-shrink:0;line-height:1;}
.ct-estilo-body{flex:1;min-width:0;}
.ct-estilo-label{font-size:.62rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;opacity:.7;margin-bottom:.15rem;}
.ct-estilo-name{font-size:1rem;font-weight:900;margin-bottom:.3rem;}
.ct-estilo-desc{font-size:.75rem;font-weight:600;line-height:1.45;opacity:.85;}
.ct-estilo-conf{font-size:.62rem;font-weight:800;opacity:.5;margin-top:.4rem;}
.ct-estilo-analitico  {background:#eff6ff;border-color:#bfdbfe;color:#1e40af;}
.ct-estilo-intuitivo  {background:#fdf4ff;border-color:#e9d5ff;color:#6b21a8;}
.ct-estilo-creativo   {background:#fff7ed;border-color:#fed7aa;color:#9a3412;}
.ct-estilo-reflexivo  {background:#f0fdf4;border-color:#bbf7d0;color:#166534;}
.ct-estilo-asertivo   {background:#fff1f2;border-color:#fecdd3;color:#9f1239;}
.ct-estilo-exploratorio{background:#fefce8;border-color:#fef08a;color:#713f12;}
/* radar chart */
.ct-radar-wrap{display:flex;flex-direction:column;align-items:center;margin:.5rem 0 1.2rem;}
.ct-radar-svg{width:220px;height:220px;overflow:visible;}
.ct-radar-legend{display:grid;grid-template-columns:1fr 1fr;gap:.25rem .8rem;margin-top:.7rem;width:100%;}
.ct-radar-leg-item{display:flex;align-items:center;gap:.35rem;font-size:.6rem;font-weight:700;color:#6b7280;}
.ct-radar-leg-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;}
/* informe btn */
.ct-report-bar{padding:.8rem 1.5rem;border-top:1px solid #f3f4f6;display:flex;gap:.6rem;flex-shrink:0;}
.ct-report-btn{flex:1;padding:.65rem .5rem;border-radius:12px;border:none;cursor:pointer;
  font-family:'Nunito',sans-serif;font-weight:900;font-size:.78rem;display:flex;align-items:center;justify-content:center;gap:.4rem;}
.ct-report-dl{background:linear-gradient(135deg,#7c3aed,#a855f7);color:#fff;}
.ct-report-mail{background:#f3f4f6;color:#374151;}
.ct-report-mail:hover{background:#e5e7eb;}
.ct-report-dl:hover{filter:brightness(1.08);}
/* nivel razonamiento */
.ct-nivel-wrap{display:flex;align-items:center;gap:.7rem;background:#f8f7ff;border-radius:12px;padding:.7rem 1rem;margin:.5rem 0 1rem;}
.ct-nivel-steps{display:flex;gap:4px;flex:1;}
.ct-nivel-step{flex:1;height:8px;border-radius:4px;background:#e9d5ff;transition:background .4s;}
.ct-nivel-step.active{background:linear-gradient(90deg,#7c3aed,#a855f7);}
.ct-nivel-label{font-size:.72rem;font-weight:900;color:#7c3aed;white-space:nowrap;}
.ct-nivel-sub{font-size:.62rem;font-weight:600;color:#9ca3af;margin-top:.1rem;}
/* ══ HISTORIAL PANEL ══ */
.hist-bg{display:none;position:fixed;inset:0;z-index:700;background:rgba(15,10,30,.88);backdrop-filter:blur(10px);align-items:stretch;justify-content:flex-end;}
.hist-bg.show{display:flex;}
.hist-panel{width:100%;max-width:400px;background:#fff;display:flex;flex-direction:column;animation:slideRight .3s cubic-bezier(.4,0,.2,1) both;box-shadow:-8px 0 40px rgba(0,0,0,.4);}
.hist-head{background:linear-gradient(135deg,#4c1d95,#7c3aed,#a855f7);padding:1.2rem 1.5rem;display:flex;align-items:center;gap:.8rem;flex-shrink:0;}
.hist-head-icon{font-size:1.8rem;}
.hist-head-info{flex:1;}
.hist-head-info h3{font-size:1rem;font-weight:900;color:#fff;margin-bottom:.1rem;}
.hist-head-info p{font-size:.72rem;color:rgba(255,255,255,.75);font-weight:700;}
.hist-head-close{background:rgba(0,0,0,.2);border:none;color:#fff;width:30px;height:30px;border-radius:50%;cursor:pointer;font-size:.95rem;}
.hist-search{padding:.8rem 1rem;border-bottom:1px solid #f3f4f6;flex-shrink:0;}
.hist-search input{width:100%;padding:.5rem .8rem;border:1.5px solid #e9d5ff;border-radius:10px;font-family:'Nunito',sans-serif;font-size:.82rem;font-weight:700;color:#374151;outline:none;}
.hist-search input:focus{border-color:#7c3aed;}
.hist-list{flex:1;overflow-y:auto;padding:.5rem 0;}
.hist-item{padding:.75rem 1.2rem;cursor:pointer;border-left:3px solid transparent;transition:all .15s;display:flex;align-items:flex-start;gap:.7rem;}
.hist-item:hover{background:#faf5ff;border-left-color:#a855f7;}
.hist-item.active{background:#faf5ff;border-left-color:#7c3aed;}
.hist-item-icon{font-size:1.1rem;flex-shrink:0;margin-top:.1rem;}
.hist-item-body{flex:1;min-width:0;}
.hist-item-title{font-size:.82rem;font-weight:800;color:#1f2937;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:.15rem;}
.hist-item-meta{font-size:.67rem;color:#9ca3af;font-weight:700;display:flex;gap:.5rem;}
.hist-item-del{background:none;border:none;color:#fca5a5;cursor:pointer;font-size:.8rem;padding:.2rem .3rem;border-radius:5px;opacity:0;transition:opacity .15s;}
.hist-item:hover .hist-item-del{opacity:1;}
.hist-empty{text-align:center;padding:3rem 1rem;color:#9ca3af;}
.hist-empty span{display:block;font-size:2.5rem;margin-bottom:.5rem;}
.hist-footer{padding:.8rem 1rem;border-top:1px solid #f3f4f6;flex-shrink:0;}
.hist-new-btn{width:100%;padding:.65rem;border-radius:12px;border:none;background:linear-gradient(135deg,#7c3aed,#a855f7);color:#fff;font-family:'Nunito',sans-serif;font-weight:900;font-size:.85rem;cursor:pointer;}
.hist-new-btn:hover{filter:brightness(1.08);}
.hist-loading{text-align:center;padding:2rem;color:#a78bfa;font-size:.82rem;font-weight:700;}

.grupo-bg{display:none;position:fixed;inset:0;z-index:700;background:rgba(15,10,30,.88);backdrop-filter:blur(10px);align-items:stretch;justify-content:flex-end;}
.grupo-bg.show{display:flex;}
.grupo-panel{
  width:100%;max-width:420px;background:#fff;display:flex;flex-direction:column;
  animation:slideRight .35s cubic-bezier(.4,0,.2,1) both;
  box-shadow:-8px 0 40px rgba(0,0,0,.4);
}
@keyframes slideRight{from{transform:translateX(100%);}to{transform:translateX(0);}}
.gp-head{
  background:linear-gradient(135deg,#065f46,#059669,#34d399);
  padding:1.2rem 1.5rem;display:flex;align-items:center;gap:.8rem;flex-shrink:0;
}
.gp-head-icon{font-size:1.8rem;}
.gp-head-info{flex:1;}
.gp-head-info h3{font-size:1rem;font-weight:900;color:#fff;margin-bottom:.1rem;}
.gp-head-info p{font-size:.72rem;color:rgba(255,255,255,.8);font-weight:700;}
.gp-head-close{background:rgba(0,0,0,.2);border:none;color:#fff;width:30px;height:30px;border-radius:50%;cursor:pointer;font-size:.95rem;}

/* Tabs */
.gp-tabs{display:flex;border-bottom:2px solid #f3f4f6;flex-shrink:0;}
.gp-tab{flex:1;padding:.7rem;font-size:.75rem;font-weight:900;text-align:center;cursor:pointer;color:#9ca3af;border-bottom:3px solid transparent;margin-bottom:-2px;transition:all .2s;}
.gp-tab.active{color:#059669;border-bottom-color:#059669;}

/* Body */
.gp-body{flex:1;overflow-y:auto;padding:1.2rem;}
.gp-body::-webkit-scrollbar{width:3px;}
.gp-body::-webkit-scrollbar-thumb{background:#e5e7eb;border-radius:2px;}

/* Join/Create screen */
.gp-join-screen{text-align:center;padding:.5rem 0;}
.gp-join-screen .gp-emoji{font-size:3rem;display:block;margin-bottom:.6rem;}
.gp-join-screen h4{font-size:1rem;font-weight:900;color:#1f2937;margin-bottom:.3rem;}
.gp-join-screen p{font-size:.8rem;font-weight:600;color:#6b7280;line-height:1.6;margin-bottom:1.2rem;}
.gp-field{margin-bottom:.85rem;text-align:left;}
.gp-field label{display:block;font-size:.65rem;font-weight:900;text-transform:uppercase;letter-spacing:.06em;color:#374151;margin-bottom:.35rem;}
.gp-input{width:100%;border:2px solid #e5e7eb;border-radius:10px;padding:.6rem .9rem;font-family:'Nunito',sans-serif;font-size:.9rem;font-weight:700;color:#1f2937;transition:border-color .2s;}
.gp-input:focus{outline:none;border-color:#059669;box-shadow:0 0 0 3px rgba(5,150,105,.15);}
.gp-input.code-input{font-family:'JetBrains Mono',monospace;text-transform:uppercase;letter-spacing:.1em;font-size:1rem;text-align:center;}
.gp-btn{width:100%;background:linear-gradient(135deg,#065f46,#059669);border:none;border-radius:12px;color:#fff;font-family:'Nunito',sans-serif;font-weight:900;font-size:.9rem;padding:.75rem;cursor:pointer;transition:all .2s;box-shadow:0 4px 0 #047857;display:flex;align-items:center;justify-content:center;gap:.5rem;margin-bottom:.5rem;}
.gp-btn:hover{transform:translateY(-2px);box-shadow:0 6px 0 #047857;}
.gp-btn:active{transform:translateY(1px);box-shadow:0 2px 0 #047857;}
.gp-btn:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none;}
.gp-btn-ghost{width:100%;background:transparent;border:2px solid #e5e7eb;border-radius:12px;color:#6b7280;font-family:'Nunito',sans-serif;font-weight:800;font-size:.85rem;padding:.6rem;cursor:pointer;transition:all .2s;}
.gp-btn-ghost:hover{border-color:#d1d5db;color:#374151;}
.gp-divider-or{display:flex;align-items:center;gap:.6rem;margin:.9rem 0;font-size:.72rem;font-weight:800;color:#d1d5db;}
.gp-divider-or::before,.gp-divider-or::after{content:'';flex:1;height:1px;background:#f3f4f6;}
.gp-status{font-size:.75rem;font-weight:800;min-height:1.2em;margin:.4rem 0;text-align:center;}
.gp-status.ok{color:#059669;}
.gp-status.err{color:#dc2626;}

/* Group info bar */
.gp-info-bar{background:#f0fdf4;border:2px solid #a7f3d0;border-radius:12px;padding:.8rem 1rem;margin-bottom:1rem;display:flex;align-items:center;gap:.8rem;}
.gp-info-bar .gp-code{font-family:'JetBrains Mono',monospace;font-size:1.1rem;font-weight:900;color:#059669;flex:1;}
.gp-info-bar .gp-copy-code{background:#059669;border:none;color:#fff;font-size:.7rem;font-weight:900;padding:.3rem .7rem;border-radius:8px;cursor:pointer;}
.gp-members-row{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1rem;}
.gp-member-tag{background:#ecfdf5;border:1.5px solid #a7f3d0;border-radius:20px;padding:.2rem .65rem;font-size:.72rem;font-weight:800;color:#065f46;display:flex;align-items:center;gap:.3rem;}
.gp-member-tag.me{background:#d1fae5;border-color:#6ee7b7;}
.gp-member-tag .mt-dot{width:6px;height:6px;border-radius:50%;background:#34d399;}

/* Feed */
.gp-feed{display:flex;flex-direction:column;gap:.8rem;}
.gp-post{background:#fff;border:2px solid #f3f4f6;border-radius:14px;overflow:hidden;transition:border-color .2s;}
.gp-post:hover{border-color:#a7f3d0;}
.gp-post-head{display:flex;align-items:center;gap:.6rem;padding:.65rem .9rem;background:#f9fafb;border-bottom:1px solid #f3f4f6;}
.gp-post-av{width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,#059669,#34d399);display:flex;align-items:center;justify-content:center;font-size:.75rem;color:#fff;font-weight:900;flex-shrink:0;}
.gp-post-meta{flex:1;}
.gp-post-meta strong{display:block;font-size:.75rem;font-weight:900;color:#1f2937;}
.gp-post-meta span{font-size:.65rem;font-weight:600;color:#9ca3af;}
.gp-post-type{font-size:.6rem;font-weight:900;padding:.15rem .45rem;border-radius:6px;text-transform:uppercase;letter-spacing:.05em;}
.gp-post-type.duda{background:#fef3c7;color:#92400e;}
.gp-post-type.correccion{background:#fee2e2;color:#991b1b;}
.gp-post-type.resumen{background:#ede9fe;color:#5b21b6;}
.gp-post-type.esquema{background:#e0f2fe;color:#0c4a6e;}
.gp-post-type.respuesta{background:#dcfce7;color:#166534;}
.gp-post-body{padding:.7rem .9rem;font-size:.82rem;font-weight:600;color:#374151;line-height:1.65;max-height:180px;overflow-y:auto;}
.gp-post-body img{max-width:100%;border-radius:8px;margin-top:.4rem;}
.gp-post-footer{display:flex;gap:.4rem;padding:.5rem .9rem;border-top:1px solid #f3f4f6;background:#fafafa;}
.gp-react-btn{font-size:.75rem;font-weight:800;color:#6b7280;background:transparent;border:1px solid #e5e7eb;border-radius:8px;padding:.2rem .55rem;cursor:pointer;transition:all .15s;}
.gp-react-btn:hover{border-color:#a7f3d0;color:#059669;}
.gp-post-count{font-size:.65rem;font-weight:700;color:#9ca3af;margin-left:auto;display:flex;align-items:center;}
.gp-empty{text-align:center;padding:2rem 1rem;color:#9ca3af;font-size:.85rem;font-weight:700;}
.gp-empty span{display:block;font-size:2.5rem;margin-bottom:.5rem;}

/* Share to group input */
.gp-share-bar{border-top:2px solid #f3f4f6;padding:.9rem 1rem;flex-shrink:0;background:#fff;}
.gp-share-type-row{display:flex;gap:.3rem;margin-bottom:.6rem;overflow-x:auto;scrollbar-width:none;}
.gp-share-type-row::-webkit-scrollbar{display:none;}
.gp-type-btn{font-size:.68rem;font-weight:900;padding:.28rem .65rem;border-radius:8px;border:1.5px solid #e5e7eb;background:#f9fafb;color:#6b7280;cursor:pointer;white-space:nowrap;transition:all .15s;flex-shrink:0;}
.gp-type-btn.active{border-color:#059669;background:#ecfdf5;color:#059669;}
.gp-share-row{display:flex;gap:.5rem;align-items:flex-end;}
.gp-share-textarea{flex:1;font-family:'Nunito',sans-serif;font-size:.83rem;color:#1f2937;background:#f9fafb;border:1.5px solid #e5e7eb;border-radius:10px;padding:.55rem .8rem;resize:none;min-height:40px;max-height:100px;transition:border-color .2s;line-height:1.45;}
.gp-share-textarea:focus{outline:none;border-color:#059669;background:#fff;}
.gp-send-btn{width:40px;height:40px;background:linear-gradient(135deg,#059669,#34d399);border:none;border-radius:10px;color:#fff;font-size:1rem;cursor:pointer;flex-shrink:0;transition:all .2s;display:flex;align-items:center;justify-content:center;}
.gp-send-btn:hover{transform:translateY(-1px);}
.gp-send-btn:disabled{opacity:.4;cursor:not-allowed;}

/* Limit badge */
.gp-limit-bar{background:#f0fdf4;border-top:1px solid #a7f3d0;padding:.4rem 1rem;text-align:center;font-size:.68rem;font-weight:800;color:#059669;flex-shrink:0;}
.gp-member-count{font-size:.7rem;font-weight:800;color:rgba(255,255,255,.7);background:rgba(0,0,0,.15);border-radius:10px;padding:.15rem .5rem;}

/* Animations */
@keyframes fadeUp{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:translateY(0);}}
@keyframes popUp{from{opacity:0;transform:scale(.9);}to{opacity:1;transform:scale(1);}}
@keyframes slideUp{from{transform:translateY(100%);}to{transform:translateY(0);}}
@keyframes float{0%,100%{transform:translateY(0);}50%{transform:translateY(-8px);}}
@keyframes bonce{0%,60%,100%{transform:translateY(0);}30%{transform:translateY(-5px);}}
@keyframes dropPulse{from{box-shadow:0 0 0 0 rgba(167,139,250,.4);}to{box-shadow:0 0 0 16px rgba(167,139,250,0);}}
@keyframes spin{to{transform:rotate(360deg);}}
@keyframes bounce2{0%,100%{transform:scale(1);}50%{transform:scale(1.15);}}

/* ══ RANKING SEMANAL ══ */
.ranking-bg{display:none;position:fixed;inset:0;z-index:700;background:rgba(15,10,30,.88);
  backdrop-filter:blur(12px);align-items:flex-end;justify-content:center;}
.ranking-bg.show{display:flex;}
.ranking-box{background:#fff;border-radius:24px 24px 0 0;width:100%;max-width:540px;
  max-height:92vh;display:flex;flex-direction:column;animation:slideUp .35s ease both;}
.rk-head{background:linear-gradient(135deg,#1e0a3c,#4c1d95,#7c3aed,#f472b6);
  padding:1.2rem 1.5rem .9rem;flex-shrink:0;}
.rk-head-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:.6rem;}
.rk-head h3{font-size:1rem;font-weight:900;color:#fff;display:flex;align-items:center;gap:.5rem;}
.rk-head-close{background:rgba(255,255,255,.15);border:none;color:#fff;width:28px;height:28px;
  border-radius:50%;cursor:pointer;font-size:.8rem;}
.rk-xp-hero{display:flex;align-items:center;gap:.9rem;}
.rk-level-circle{width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.15);
  border:2px solid rgba(255,255,255,.3);display:flex;align-items:center;justify-content:center;
  font-size:1.4rem;flex-shrink:0;}
.rk-hero-info{flex:1;}
.rk-hero-name{font-size:.9rem;font-weight:900;color:#fff;}
.rk-hero-sub{font-size:.67rem;color:rgba(255,255,255,.65);font-weight:700;margin-top:.05rem;}
.rk-hero-bar-wrap{height:5px;background:rgba(255,255,255,.2);border-radius:3px;margin-top:.5rem;overflow:hidden;}
.rk-hero-bar{height:100%;background:linear-gradient(90deg,#fbbf24,#f472b6);border-radius:3px;transition:width .8s cubic-bezier(.34,1.56,.64,1);}
.rk-hero-xp{font-size:.62rem;font-weight:800;color:rgba(255,255,255,.6);margin-top:.25rem;}
.rk-xp-total{background:rgba(251,191,36,.2);border:1.5px solid rgba(251,191,36,.4);
  border-radius:12px;padding:.4rem .8rem;text-align:right;flex-shrink:0;}
.rk-xp-total strong{display:block;font-family:'JetBrains Mono',monospace;font-size:1.1rem;font-weight:900;color:#fbbf24;}
.rk-xp-total span{font-size:.58rem;font-weight:800;color:rgba(251,191,36,.7);text-transform:uppercase;letter-spacing:.06em;}

/* Tabs */
.rk-tabs{display:flex;border-bottom:2px solid #f3f4f6;flex-shrink:0;background:#fff;}
.rk-tab{flex:1;padding:.65rem .4rem;font-size:.72rem;font-weight:900;text-align:center;
  cursor:pointer;color:#9ca3af;border-bottom:3px solid transparent;margin-bottom:-2px;
  transition:all .2s;white-space:nowrap;}
.rk-tab.active{color:#7c3aed;border-bottom-color:#7c3aed;}

.rk-body{flex:1;overflow-y:auto;padding:.8rem 1.5rem 1rem;}
.rk-body::-webkit-scrollbar{width:3px;}
.rk-body::-webkit-scrollbar-thumb{background:#e5e7eb;}
.rk-tab-panel{display:none;}
.rk-tab-panel.active{display:block;}

/* Week selector */
.rk-week-row{display:flex;align-items:center;gap:.6rem;margin-bottom:.8rem;
  background:#f9fafb;border-radius:10px;padding:.5rem .7rem;}
.rk-week-nav{background:transparent;border:1.5px solid #e5e7eb;border-radius:8px;
  width:28px;height:28px;cursor:pointer;font-size:.8rem;color:#6b7280;
  display:flex;align-items:center;justify-content:center;transition:all .15s;flex-shrink:0;}
.rk-week-nav:hover{border-color:#c4b5fd;color:#7c3aed;}
.rk-week-label{flex:1;text-align:center;font-size:.8rem;font-weight:900;color:#374151;}
.rk-week-badge{font-size:.6rem;font-weight:900;background:#ede9fe;color:#5b21b6;
  padding:.12rem .45rem;border-radius:7px;flex-shrink:0;}

/* Stats grid */
.rk-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;margin-bottom:.8rem;}
.rk-stat-card{background:#f9fafb;border:1.5px solid #f3f4f6;border-radius:12px;
  padding:.6rem .3rem;text-align:center;}
.rk-stat-val{font-family:'JetBrains Mono',monospace;font-size:1rem;font-weight:900;color:#4c1d95;}
.rk-stat-lbl{font-size:.55rem;font-weight:800;color:#9ca3af;text-transform:uppercase;
  letter-spacing:.05em;margin-top:.1rem;}
.rk-stat-delta{font-size:.6rem;font-weight:800;margin-top:.08rem;}
.rk-stat-delta.up{color:#16a34a;}
.rk-stat-delta.dn{color:#dc2626;}
.rk-stat-delta.eq{color:#d1d5db;}

/* Racha */
.rk-streak{background:linear-gradient(135deg,#fff7ed,#fef3c7);
  border:2px solid #fcd34d;border-radius:14px;padding:.7rem 1rem;
  display:flex;align-items:center;gap:.8rem;margin-bottom:.8rem;}
.rk-streak-fire{font-size:1.8rem;}
.rk-streak-info{flex:1;}
.rk-streak-val{font-size:1.1rem;font-weight:900;color:#92400e;}
.rk-streak-lbl{font-size:.68rem;font-weight:700;color:#b45309;}
.rk-streak-days{display:flex;gap:.3rem;margin-top:.4rem;}
.rk-day-dot{width:22px;height:22px;border-radius:50%;border:2px solid #fcd34d;
  display:flex;align-items:center;justify-content:center;font-size:.58rem;font-weight:900;}
.rk-day-dot.done{background:#fbbf24;color:#78350f;border-color:#f59e0b;}
.rk-day-dot.today{background:#f59e0b;color:#fff;box-shadow:0 0 0 3px rgba(251,191,36,.35);border-color:#f59e0b;}
.rk-day-dot.miss{background:#f9fafb;color:#d1d5db;border-color:#e5e7eb;}
.rk-streak-max{font-size:.68rem;font-weight:800;color:#b45309;background:rgba(251,191,36,.15);
  padding:.2rem .55rem;border-radius:8px;white-space:nowrap;flex-shrink:0;}

/* Chart */
.rk-chart-wrap{margin-bottom:.8rem;}
.rk-chart-title{font-size:.65rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em;
  color:#9ca3af;margin-bottom:.5rem;}
.rk-chart{display:flex;align-items:flex-end;gap:.35rem;height:72px;}
.rk-bar-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:.25rem;}
.rk-bar{width:100%;border-radius:5px 5px 0 0;min-height:4px;
  transition:height .6s cubic-bezier(.34,1.56,.64,1);position:relative;cursor:pointer;}
.rk-bar.current{box-shadow:0 0 0 2px #7c3aed,0 3px 10px rgba(124,58,237,.3);}
.rk-bar-lbl{font-size:.55rem;font-weight:800;color:#9ca3af;}
.rk-bar-val{position:absolute;top:-16px;left:50%;transform:translateX(-50%);
  font-size:.58rem;font-weight:900;color:#4c1d95;white-space:nowrap;}

/* Logros */
.rk-sec-title{font-size:.65rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em;
  color:#9ca3af;margin-bottom:.6rem;display:flex;align-items:center;justify-content:space-between;}
.rk-logros-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;margin-bottom:.8rem;}
.rk-logro{background:#f9fafb;border:1.5px solid #f3f4f6;border-radius:12px;
  padding:.6rem .4rem;text-align:center;transition:all .2s;cursor:default;}
.rk-logro.earned{background:linear-gradient(135deg,#ede9fe,#faf5ff);
  border-color:#c4b5fd;box-shadow:0 2px 8px rgba(124,58,237,.12);}
.rk-logro.new{animation:logro-pop .5s cubic-bezier(.34,1.56,.64,1);}
@keyframes logro-pop{from{transform:scale(0.5);opacity:0;}to{transform:scale(1);opacity:1;}}
.rk-logro-icon{font-size:1.3rem;display:block;margin-bottom:.2rem;filter:grayscale(1);opacity:.35;}
.rk-logro.earned .rk-logro-icon{filter:none;opacity:1;}
.rk-logro-name{font-size:.58rem;font-weight:800;color:#9ca3af;line-height:1.2;}
.rk-logro.earned .rk-logro-name{color:#5b21b6;}

/* Liga / Leaderboard */
.rk-liga-header{background:linear-gradient(135deg,#fef3c7,#fff7ed);border:2px solid #fcd34d;
  border-radius:12px;padding:.7rem 1rem;margin-bottom:.8rem;display:flex;align-items:center;gap:.8rem;}
.rk-liga-icon{font-size:1.6rem;}
.rk-liga-info strong{display:block;font-size:.85rem;font-weight:900;color:#92400e;}
.rk-liga-info span{font-size:.7rem;font-weight:700;color:#b45309;}
.rk-board{display:flex;flex-direction:column;gap:.4rem;margin-bottom:.8rem;}
.rk-board-item{display:flex;align-items:center;gap:.7rem;padding:.55rem .8rem;
  border-radius:12px;border:1.5px solid #f3f4f6;background:#fafafa;transition:all .2s;}
.rk-board-item.me{background:linear-gradient(135deg,#faf5ff,#ede9fe);border-color:#c4b5fd;}
.rk-board-item.gold{background:linear-gradient(135deg,#fef9c3,#fef3c7);border-color:#fcd34d;}
.rk-board-item.silver{background:linear-gradient(135deg,#f8fafc,#f1f5f9);border-color:#cbd5e1;}
.rk-board-item.bronze{background:linear-gradient(135deg,#fff7ed,#fef3c7);border-color:#fed7aa;}
.rk-board-pos{font-family:'JetBrains Mono',monospace;font-size:.82rem;font-weight:900;
  width:24px;text-align:center;color:#9ca3af;flex-shrink:0;}
.rk-board-pos.top{color:#f59e0b;}
.rk-board-av{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,#7c3aed,#f472b6);
  display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:900;
  color:#fff;flex-shrink:0;}
.rk-board-nick{flex:1;font-size:.82rem;font-weight:800;color:#374151;}
.rk-board-nick small{display:block;font-size:.62rem;font-weight:600;color:#9ca3af;}
.rk-board-xp{font-family:'JetBrains Mono',monospace;font-size:.82rem;font-weight:900;color:#7c3aed;flex-shrink:0;}
.rk-board-medal{font-size:.9rem;flex-shrink:0;}
.rk-board-sep{text-align:center;font-size:.68rem;font-weight:800;color:#d1d5db;padding:.2rem;}
.rk-liga-empty{text-align:center;padding:1.5rem;color:#9ca3af;font-size:.82rem;font-weight:700;}
.rk-liga-empty span{display:block;font-size:2rem;margin-bottom:.4rem;}

/* Desafíos */
.rk-challenge{border:1.5px solid #f3f4f6;border-radius:14px;padding:.75rem .9rem;
  margin-bottom:.5rem;transition:all .2s;}
.rk-challenge.done{border-color:#a7f3d0;background:#f0fdf4;}
.rk-challenge-head{display:flex;align-items:center;gap:.6rem;margin-bottom:.4rem;}
.rk-ch-icon{font-size:1.2rem;flex-shrink:0;}
.rk-ch-info{flex:1;}
.rk-ch-title{font-size:.82rem;font-weight:900;color:#1f2937;}
.rk-ch-sub{font-size:.68rem;font-weight:700;color:#9ca3af;}
.rk-ch-reward{font-size:.68rem;font-weight:900;color:#059669;background:#dcfce7;
  padding:.15rem .45rem;border-radius:6px;flex-shrink:0;}
.rk-challenge.done .rk-ch-reward{background:#d1fae5;color:#065f46;}
.rk-ch-bar-wrap{height:6px;background:#f3f4f6;border-radius:3px;overflow:hidden;}
.rk-ch-bar{height:100%;background:linear-gradient(90deg,#7c3aed,#f472b6);border-radius:3px;transition:width .6s ease;}
.rk-challenge.done .rk-ch-bar{background:linear-gradient(90deg,#059669,#34d399);}
.rk-ch-prog{font-size:.65rem;font-weight:800;color:#6b7280;margin-top:.25rem;display:flex;justify-content:space-between;}
.rk-ch-prog .done-label{color:#059669;font-weight:900;}
.rk-challenges-reset{font-size:.68rem;font-weight:700;color:#9ca3af;text-align:center;margin-top:.6rem;}

.rk-close{padding:.7rem 1.5rem 1.1rem;flex-shrink:0;border-top:1px solid #f3f4f6;}
.rk-close button{width:100%;background:#f3f4f6;border:none;border-radius:12px;
  font-family:'Nunito',sans-serif;font-weight:800;font-size:.85rem;color:#6b7280;
  padding:.65rem;cursor:pointer;}
.rk-close button:hover{background:#e5e7eb;}

/* ══ PRINT / SCHEMA VIEWER ══ */
.print-bg{display:none;position:fixed;inset:0;z-index:900;background:#1a1a2e;
  flex-direction:column;}
.print-bg.show{display:flex;}
.print-toolbar{background:#0f0f1a;border-bottom:1px solid rgba(255,255,255,.1);
  padding:.6rem 1rem;display:flex;align-items:center;gap:.7rem;flex-shrink:0;}
.print-toolbar h4{flex:1;font-size:.88rem;font-weight:900;color:#e9d5ff;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ptb-btn{background:rgba(124,58,237,.25);border:1.5px solid rgba(167,139,250,.4);
  color:#c4b5fd;font-family:'Nunito',sans-serif;font-weight:800;font-size:.75rem;
  padding:.4rem .85rem;border-radius:10px;cursor:pointer;white-space:nowrap;
  transition:all .2s;display:flex;align-items:center;gap:.3rem;}
.ptb-btn:hover{background:rgba(124,58,237,.45);color:#fff;}
.ptb-btn.primary{background:linear-gradient(135deg,#7c3aed,#a855f7);
  border-color:#7c3aed;color:#fff;box-shadow:0 3px 0 #5b21b6;}
.ptb-btn.primary:hover{transform:translateY(-1px);box-shadow:0 5px 0 #5b21b6;}
.ptb-btn.danger{background:rgba(220,38,38,.15);border-color:rgba(239,68,68,.4);color:#fca5a5;}
.print-scroll{flex:1;overflow-y:auto;padding:1.5rem 1rem;
  display:flex;align-items:flex-start;justify-content:center;}
.print-page{background:#fff;border-radius:12px;width:100%;max-width:740px;
  padding:2rem 2.2rem;box-shadow:0 8px 40px rgba(0,0,0,.4);
  font-family:'Nunito',sans-serif;}

/* Rich schema content styles */
.sp-title{font-size:1.5rem;font-weight:900;color:#1e0a3c;text-align:center;
  margin-bottom:.3rem;line-height:1.3;}
.sp-subtitle{font-size:.88rem;font-weight:700;color:#6b7280;text-align:center;
  margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:2px solid #ede9fe;}
.sp-meta{display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap;margin-bottom:1.2rem;}
.sp-meta-tag{font-size:.65rem;font-weight:900;padding:.2rem .65rem;border-radius:20px;
  text-transform:uppercase;letter-spacing:.05em;}

/* Section blocks */
.sp-section{margin-bottom:1.4rem;}
.sp-section-head{font-size:1rem;font-weight:900;color:#fff;padding:.45rem .9rem;
  border-radius:10px 10px 0 0;display:flex;align-items:center;gap:.5rem;margin-bottom:0;}
.sp-section-body{padding:.9rem 1rem;border-radius:0 0 10px 10px;
  border:2px solid;border-top:none;}

/* Color palette for sections */
.sp-purple .sp-section-head{background:linear-gradient(135deg,#7c3aed,#a855f7);}
.sp-purple .sp-section-body{border-color:#c4b5fd;background:#faf5ff;}
.sp-blue   .sp-section-head{background:linear-gradient(135deg,#1d4ed8,#3b82f6);}
.sp-blue   .sp-section-body{border-color:#93c5fd;background:#eff6ff;}
.sp-green  .sp-section-head{background:linear-gradient(135deg,#059669,#34d399);}
.sp-green  .sp-section-body{border-color:#a7f3d0;background:#ecfdf5;}
.sp-orange .sp-section-head{background:linear-gradient(135deg,#d97706,#fbbf24);}
.sp-orange .sp-section-body{border-color:#fcd34d;background:#fffbeb;}
.sp-red    .sp-section-head{background:linear-gradient(135deg,#dc2626,#f87171);}
.sp-red    .sp-section-body{border-color:#fca5a5;background:#fff1f2;}
.sp-cyan   .sp-section-head{background:linear-gradient(135deg,#0891b2,#22d3ee);}
.sp-cyan   .sp-section-body{border-color:#a5f3fc;background:#ecfeff;}
.sp-pink   .sp-section-head{background:linear-gradient(135deg,#be185d,#f472b6);}
.sp-pink   .sp-section-body{border-color:#f9a8d4;background:#fdf2f8;}
.sp-dark   .sp-section-head{background:linear-gradient(135deg,#111827,#374151);}
.sp-dark   .sp-section-body{border-color:#d1d5db;background:#f9fafb;}

.sp-section-body p{font-size:.88rem;font-weight:700;color:#374151;line-height:1.7;margin:.2rem 0;}
.sp-section-body ul{padding-left:1.1rem;margin:.3rem 0;}
.sp-section-body li{font-size:.85rem;font-weight:700;color:#374151;margin:.25rem 0;line-height:1.5;}
.sp-section-body strong{font-weight:900;color:#1f2937;}
.sp-section-body em{font-style:italic;color:#5b21b6;}

/* Highlight box */
.sp-highlight{background:linear-gradient(135deg,#fef9c3,#fef3c7);
  border:2px solid #fcd34d;border-radius:10px;padding:.7rem .9rem;margin:.6rem 0;
  font-size:.85rem;font-weight:800;color:#78350f;display:flex;gap:.5rem;align-items:flex-start;}
.sp-highlight::before{content:'⚡';flex-shrink:0;font-size:1rem;}

/* Info box */
.sp-info{background:#eff6ff;border:2px solid #93c5fd;border-radius:10px;
  padding:.7rem .9rem;margin:.6rem 0;font-size:.85rem;font-weight:700;color:#1e40af;
  display:flex;gap:.5rem;align-items:flex-start;}
.sp-info::before{content:'💡';flex-shrink:0;}

/* Warning box */
.sp-warn{background:#fff7ed;border:2px solid #fed7aa;border-radius:10px;
  padding:.7rem .9rem;margin:.6rem 0;font-size:.85rem;font-weight:700;color:#9a3412;
  display:flex;gap:.5rem;align-items:flex-start;}
.sp-warn::before{content:'⚠️';flex-shrink:0;}

/* Tables */
.sp-table{width:100%;border-collapse:collapse;margin:.6rem 0;font-size:.82rem;}
.sp-table th{background:linear-gradient(135deg,#4c1d95,#7c3aed);color:#fff;
  font-weight:900;padding:.5rem .8rem;text-align:left;font-size:.78rem;}
.sp-table th:first-child{border-radius:8px 0 0 0;}
.sp-table th:last-child{border-radius:0 8px 0 0;}
.sp-table td{padding:.45rem .8rem;font-weight:700;color:#374151;
  border-bottom:1px solid #f3f4f6;}
.sp-table tr:nth-child(even) td{background:#f9fafb;}
.sp-table tr:last-child td{border-bottom:none;}
.sp-table td strong{color:#4c1d95;}

/* Timeline */
.sp-tl-wrapper{width:100%;overflow-x:auto;padding-bottom:.5rem;}
/* Horizontal timeline rail */
.sp-timeline{display:flex;flex-direction:column;gap:0;position:relative;padding:.4rem 0;}
/* ── Horizontal rail ── */
.sp-tl-track{position:relative;display:flex;align-items:flex-start;min-width:100%;}
.sp-tl-track::before{content:'';position:absolute;top:calc(100% - 22px - 7px);left:0;right:0;
  height:3px;background:linear-gradient(90deg,#7c3aed,#a855f7,#f472b6);z-index:0;}
/* Top track: card on top, dot at bottom */
.sp-tl-track.top::before{top:auto;bottom:22px;}
/* Alt track (below rail): dot on top, card below */
.sp-tl-track.alt{align-items:flex-start;margin-top:0;}
.sp-tl-track.alt::before{top:22px;bottom:auto;}
/* Each event item */
.sp-tl-item{position:relative;display:flex;flex-direction:column;align-items:center;
  flex:1;min-width:130px;max-width:200px;padding:.3rem .4rem;z-index:1;}
.sp-tl-track.top .sp-tl-item{flex-direction:column;}   /* card → connector → dot */
.sp-tl-track.alt .sp-tl-item{flex-direction:column-reverse;} /* dot → connector → card */
/* Dot — color set inline per category */
.sp-tl-dot{width:15px;height:15px;border-radius:50%;background:#7c3aed;
  border:2.5px solid #fff;box-shadow:0 0 0 3px var(--dot-color,#7c3aed);
  flex-shrink:0;z-index:2;transition:transform .2s;}
.sp-tl-dot:hover{transform:scale(1.3);}
/* Connector line — matches dot color */
.sp-tl-connector{width:2px;height:24px;background:var(--dot-color,#a855f7);opacity:.5;flex-shrink:0;}
/* Card — left accent border matches category color */
.sp-tl-card{background:#fff;border:1.5px solid #e9d5ff;
  border-left:4px solid var(--dot-color,#7c3aed);
  border-radius:8px;padding:.4rem .55rem;text-align:left;
  box-shadow:0 2px 8px rgba(0,0,0,.08);min-width:110px;}
.sp-tl-date{font-size:.6rem;font-weight:900;color:var(--dot-color,#7c3aed);
  text-transform:uppercase;letter-spacing:.05em;margin-bottom:.12rem;}
.sp-tl-title{font-size:.72rem;font-weight:900;color:#1f2937;margin-bottom:.12rem;line-height:1.3;}
.sp-tl-desc{font-size:.64rem;font-weight:600;color:#6b7280;line-height:1.45;}
/* ── Wrapper horizontal scroll ── */
.sp-tl-wrapper{width:100%;overflow-x:auto;overflow-y:visible;padding-bottom:.4rem;}
.sp-tl-wrapper::-webkit-scrollbar{height:5px;}
.sp-tl-wrapper::-webkit-scrollbar-thumb{background:#c4b5fd;border-radius:4px;}
/* Print overrides */
@media print{
  .print-bg{position:static!important;background:#fff!important;}
  #printPage{padding:.5cm 1cm!important;}
  .sp-tl-wrapper{overflow:visible!important;width:auto!important;}
  .sp-tl-track{flex-wrap:nowrap!important;}
  .sp-tl-item{min-width:100px!important;}
}

/* 2-column concept grid */
.sp-concepts{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin:.4rem 0;}
.sp-concept{background:#fff;border:1.5px solid #e9d5ff;border-radius:10px;padding:.6rem .8rem;}
.sp-concept-term{font-size:.78rem;font-weight:900;color:#4c1d95;margin-bottom:.2rem;}
.sp-concept-def{font-size:.75rem;font-weight:700;color:#374151;line-height:1.5;}

/* Legend */
.sp-legend{display:flex;flex-wrap:wrap;gap:.5rem;margin:.5rem 0;padding:.6rem .8rem;
  background:#f9fafb;border-radius:10px;border:1px solid #f3f4f6;}
.sp-legend-item{display:flex;align-items:center;gap:.35rem;font-size:.72rem;font-weight:800;color:#374151;}
.sp-legend-dot{width:10px;height:10px;border-radius:3px;flex-shrink:0;}

/* Footer */
.sp-footer{margin-top:1.5rem;padding-top:.8rem;border-top:2px solid #ede9fe;
  display:flex;justify-content:space-between;align-items:center;}
.sp-footer-brand{font-size:.7rem;font-weight:900;color:#7c3aed;
  display:flex;align-items:center;gap:.3rem;}
.sp-footer-date{font-size:.65rem;font-weight:700;color:#9ca3af;}

/* Print-specific overrides */
@media print{
  .print-bg{position:static!important;background:#fff!important;}
  .print-toolbar{display:none!important;}
  .print-scroll{padding:0!important;overflow:visible!important;}
  .print-page{box-shadow:none!important;max-width:100%!important;border-radius:0!important;}
  body > *:not(.print-bg){display:none!important;}
  .print-bg.show{display:block!important;}
}

/* Loading spinner in print panel */
.print-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;
  flex:1;gap:1rem;color:#c4b5fd;}
.print-loading .pl-spin{width:40px;height:40px;border:3px solid rgba(196,181,253,.3);
  border-top-color:#a855f7;border-radius:50%;animation:spin .8s linear infinite;}
.print-loading p{font-size:.85rem;font-weight:800;opacity:.7;}
@keyframes spin{to{transform:rotate(360deg);}}

/* ══ CRÉDITOS LIBRE ══ */
.credits-bar{display:flex;align-items:center;gap:.4rem;background:rgba(6,182,212,.12);
  border:1.5px solid rgba(6,182,212,.35);border-radius:20px;padding:.22rem .65rem;
  font-size:.68rem;font-weight:900;color:#22d3ee;cursor:pointer;transition:all .2s;flex-shrink:0;}
.credits-bar:hover{background:rgba(6,182,212,.22);}
.credits-bar.low{background:rgba(251,191,36,.12);border-color:rgba(251,191,36,.4);color:#fbbf24;}
.credits-bar.empty{background:rgba(156,163,175,.1);border-color:rgba(156,163,175,.3);color:#9ca3af;}
.credits-bar .cb-fire{font-size:.85rem;}

/* Credits modal */
.credits-bg{display:none;position:fixed;inset:0;z-index:800;background:rgba(15,10,30,.9);
  backdrop-filter:blur(10px);align-items:flex-end;justify-content:center;}
.credits-bg.show{display:flex;}
.credits-box{background:#fff;border-radius:24px 24px 0 0;width:100%;max-width:480px;
  animation:slideUp .35s ease both;overflow:hidden;}
.credits-head{background:linear-gradient(135deg,#0c4a6e,#0891b2,#06b6d4,#22d3ee);
  padding:1.4rem 1.5rem 1.1rem;}
.credits-head h3{font-size:1.05rem;font-weight:900;color:#fff;
  display:flex;align-items:center;gap:.5rem;margin-bottom:.2rem;}
.credits-head p{font-size:.75rem;color:rgba(255,255,255,.7);font-weight:700;}
.credits-counter{display:flex;align-items:center;gap:1rem;background:rgba(255,255,255,.15);
  border-radius:14px;padding:.8rem 1rem;margin-top:.8rem;}
.cc-circle{width:56px;height:56px;border-radius:50%;background:rgba(255,255,255,.2);
  border:2px solid rgba(255,255,255,.4);display:flex;flex-direction:column;
  align-items:center;justify-content:center;flex-shrink:0;}
.cc-val{font-family:'JetBrains Mono',monospace;font-size:1.4rem;font-weight:900;color:#fff;line-height:1;}
.cc-lbl{font-size:.5rem;font-weight:900;color:rgba(255,255,255,.6);text-transform:uppercase;letter-spacing:.06em;}
.cc-info{flex:1;}
.cc-status{font-size:.88rem;font-weight:900;color:#fff;}
.cc-sub{font-size:.68rem;color:rgba(255,255,255,.65);font-weight:700;margin-top:.15rem;line-height:1.4;}
.credits-body{padding:1.2rem 1.5rem 1.4rem;}
.credits-how-title{font-size:.65rem;font-weight:900;text-transform:uppercase;
  letter-spacing:.08em;color:#9ca3af;margin-bottom:.7rem;}
.credits-ways{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.1rem;}
.cw-item{display:flex;align-items:center;gap:.7rem;padding:.55rem .8rem;
  background:#f9fafb;border:1.5px solid #f3f4f6;border-radius:12px;}
.cw-icon{font-size:1.1rem;flex-shrink:0;}
.cw-info{flex:1;}
.cw-label{font-size:.82rem;font-weight:800;color:#374151;}
.cw-sub{font-size:.65rem;font-weight:700;color:#9ca3af;margin-top:.05rem;}
.cw-xp{font-size:.72rem;font-weight:900;color:#059669;background:#dcfce7;
  padding:.15rem .5rem;border-radius:8px;flex-shrink:0;}
.credits-unlock-list{background:linear-gradient(135deg,#ecfeff,#e0f2fe);
  border:2px solid #a5f3fc;border-radius:14px;padding:.9rem 1rem;margin-bottom:1rem;}
.credits-unlock-title{font-size:.68rem;font-weight:900;color:#0e7490;
  text-transform:uppercase;letter-spacing:.06em;margin-bottom:.5rem;
  display:flex;align-items:center;gap:.35rem;}
.credits-unlock-items{display:flex;flex-wrap:wrap;gap:.3rem;}
.credits-unlock-tag{font-size:.7rem;font-weight:800;padding:.2rem .55rem;
  background:rgba(8,145,178,.12);border:1px solid rgba(8,145,178,.3);
  color:#0891b2;border-radius:20px;}
.credits-close-btn{width:100%;background:#f3f4f6;border:none;border-radius:12px;
  font-family:'Nunito',sans-serif;font-weight:800;font-size:.85rem;color:#6b7280;
  padding:.7rem;cursor:pointer;}

/* No-credits inline card in chat */
.libre-locked-card{background:linear-gradient(135deg,#fef9c3,#fff7ed);
  border:2px solid #fcd34d;border-radius:14px;padding:.85rem 1rem;margin-top:.6rem;
  display:flex;gap:.7rem;align-items:flex-start;}
.llc-icon{font-size:1.5rem;flex-shrink:0;margin-top:.1rem;}
.llc-body{flex:1;}
.llc-title{font-size:.85rem;font-weight:900;color:#92400e;margin-bottom:.2rem;}
.llc-desc{font-size:.78rem;font-weight:700;color:#b45309;line-height:1.5;}
.llc-actions{display:flex;gap:.4rem;margin-top:.6rem;flex-wrap:wrap;}
.llc-btn{font-size:.72rem;font-weight:900;padding:.3rem .75rem;border-radius:8px;
  border:none;cursor:pointer;font-family:'Nunito',sans-serif;transition:all .15s;}
.llc-btn.primary{background:linear-gradient(135deg,#d97706,#fbbf24);color:#fff;
  box-shadow:0 2px 0 #b45309;}
.llc-btn.ghost{background:transparent;border:1.5px solid #fcd34d;color:#92400e;}

/* Credits used confirmation (tiny) */
.libre-used-badge{display:inline-flex;align-items:center;gap:.3rem;
  font-size:.62rem;font-weight:800;color:#0891b2;background:#ecfeff;
  border:1px solid #a5f3fc;border-radius:8px;padding:.1rem .45rem;
  margin-left:.4rem;vertical-align:middle;}

/* Drawer profile credit row */
.dp-credits-row{display:flex;align-items:center;justify-content:space-between;
  margin-top:.5rem;padding-top:.45rem;border-top:1px solid rgba(255,255,255,.08);}
.dp-credits-label{font-size:.6rem;font-weight:800;color:rgba(196,181,253,.5);
  text-transform:uppercase;letter-spacing:.05em;}
.dp-credits-val{font-size:.78rem;font-weight:900;color:#22d3ee;
  display:flex;align-items:center;gap:.25rem;}

/* ══════════════════════════════════════════════
   MOBILE RESPONSIVE — iPhone & Android
══════════════════════════════════════════════ */
@media(max-width:768px){

  /* Header compacto */
  header { padding:0 .5rem; min-height:50px; gap:.3rem; }
  .hdr-left { gap:.3rem; }
  .hdr-right { gap:.3rem; }
  .hdr-center { gap:.3rem; }
  .hdr-logo-img { width:28px; height:28px; }
  .logo-text { font-size:.8rem; }
  .logo-text small { display:none; }
  .xp-badge { padding:.18rem .4rem; font-size:.62rem; gap:.2rem; }
  .hdr-icon-btn { width:30px; height:30px; font-size:.82rem; }
  .usage-badge { font-size:.58rem; padding:.18rem .4rem; }
  .hdr-register-btn { font-size:.68rem; padding:.25rem .6rem; }

  /* Chat area */
  #chatArea { padding:.5rem .4rem 1rem; }
  .msg.user { max-width:88%; }
  .msg.assistant { max-width:100%; }
  .msg-bub { font-size:.9rem; padding:.7rem .9rem; }

  /* Input bar */
  .input-bar { padding:.5rem .5rem; gap:.4rem; }
  #userInput { font-size:.9rem; padding:.55rem .7rem; }
  #sendBtn { width:40px; height:40px; font-size:1rem; flex-shrink:0; }

  /* Mode bar */
  .mbar { padding:.4rem .4rem; gap:.3rem; overflow-x:auto; -webkit-overflow-scrolling:touch; flex-wrap:nowrap; }
  .mbar-btn { font-size:.7rem; padding:.35rem .55rem; white-space:nowrap; flex-shrink:0; }

  /* Welcome card */
  .welcome { padding:1.5rem 1rem; }
  .welcome h1 { font-size:1.3rem; }
  .wc-grid { grid-template-columns:1fr 1fr; gap:.4rem; }
  .wc-card { padding:.7rem; font-size:.8rem; }

  /* Modals full screen en móvil */
  .checkout-box,
  .pricing-modal,
  .exam-box,
  .grades-box,
  .parent-box,
  .group-box { 
    width:100% !important; 
    max-width:100% !important; 
    border-radius:20px 20px 0 0 !important;
    position:fixed !important;
    bottom:0 !important;
    left:0 !important;
    right:0 !important;
    max-height:90vh !important;
    overflow-y:auto !important;
  }
  .modal-bg, #checkoutBg, #pricingBg, #examBg, #gradesBg, #parentBg, #groupBg {
    align-items:flex-end !important;
  }

  /* Drawer */
  #drawer { width:85vw; max-width:300px; }

  /* Register modal */
  #registerModal { 
    width:100% !important; 
    max-width:100% !important; 
    border-radius:20px 20px 0 0 !important;
    margin:0 !important;
    position:fixed !important;
    bottom:0 !important;
  }
  #registerBg { align-items:flex-end !important; }

  /* Ranking tabs */
  .rk-tabs { gap:.3rem; flex-wrap:wrap; }
  .rk-tab { font-size:.72rem; padding:.35rem .6rem; }

  /* Print/schema */
  #printPage { padding:1rem; }

  /* ── PERFIL MODAL — MOBILE OPTIMIZADO ── */
  .grades-box {
    max-height:95vh !important;
    border-radius:16px 16px 0 0 !important;
  }
  .grades-head { padding:.8rem 1rem .5rem; }
  .grades-head h3 { font-size:.95rem; }
  .grades-tabs { overflow-x:auto; -webkit-overflow-scrolling:touch; gap:0; flex-wrap:nowrap; }
  .gtab { 
    font-size:.68rem; padding:.55rem .5rem; flex-shrink:0; min-width:0;
    white-space:nowrap;
  }
  .gtab-panel { padding:.6rem .8rem; }
  /* Formulario cuenta: single column en móvil */
  #gpanel-cuenta [style*="grid-template-columns:1fr 1fr"] {
    grid-template-columns:1fr !important;
  }
  #gpanel-cuenta input, #gpanel-cuenta select {
    font-size:16px !important; /* evita zoom en iOS */
    padding:.6rem .8rem !important;
  }
  #gpanel-cuenta button {
    font-size:1rem !important;
    padding:.8rem !important;
  }
  /* Radar chart responsive */
  .ct-radar-wrap { flex-direction:column; }
  .ct-radar-svg { max-width:280px; margin:0 auto; }
  /* Nota media circle más pequeña */
  .gnb-circle { width:60px; height:60px; }
  .gnb-val { font-size:1.2rem; }
  /* Aura responsive */
  #gpanel-aura [style*="grid-template-columns"] {
    grid-template-columns:1fr !important;
  }
  /* Grades close button bigger for touch */
  .grades-close button { padding:.9rem; font-size:.95rem; min-height:48px; }

  /* Ocultar elementos secundarios en móvil pequeño */
  .corr-panel-header .share-btns { flex-wrap:wrap; gap:.3rem; }
}

@media(max-width:380px){
  .logo-text { display:none; }
  .wc-grid { grid-template-columns:1fr; }
  header { gap:.3rem; }
}

/* iOS safe area (notch/home bar) */
@supports(padding-bottom:env(safe-area-inset-bottom)){
  .input-bar { 
    padding-bottom:calc(.5rem + env(safe-area-inset-bottom));
  }
  header {
    padding-top:env(safe-area-inset-top);
  }
}

/* Touch improvements */
@media(hover:none){
  button, .mbar-btn, .wc-card, .rk-tab { 
    -webkit-tap-highlight-color:transparent;
    cursor:pointer;
  }
  #userInput { font-size:16px; } /* Evitar zoom en iOS al hacer focus */
}


/* ── TABLET (768–1024px) ─────────────────────────────── */
@media(min-width:769px) and (max-width:1024px){
  header { padding:0 .8rem; gap:.5rem; }
  .hdr-logo-img { width:34px; height:34px; }
  .logo-text small { display:none; }
  .hdr-credits { display:none; }
  .mode-pill { display:none; }
  .hdr-register-btn { font-size:.7rem; padding:.28rem .7rem; }
}

/* ── Style block 2 ── */
.exam-header{font-family:'Helvetica Neue',Arial,sans-serif;border:2.5px solid #1a1a2e;border-radius:4px;padding:0;margin-bottom:1.8rem;page-break-inside:avoid;background:#fff;}
      .eh-top{display:flex;align-items:stretch;border-bottom:2px solid #1a1a2e;}
      .eh-logo{padding:.8rem 1rem;border-right:2px solid #1a1a2e;min-width:120px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.3rem;}
      .eh-logo-name{font-size:1rem;font-weight:900;color:#1a1a2e;letter-spacing:-.5px;}
      .eh-logo-sub{font-size:.52rem;font-weight:700;color:#6b7280;text-transform:uppercase;letter-spacing:.1em;}
      .eh-main{flex:1;padding:.8rem 1rem;}
      .eh-exam-title{font-size:1.05rem;font-weight:900;color:#1a1a2e;margin-bottom:.2rem;line-height:1.2;}
      .eh-exam-materia{font-size:.78rem;font-weight:700;color:#4b5563;text-transform:uppercase;letter-spacing:.08em;}
      .eh-meta{display:flex;gap:1.5rem;margin-top:.6rem;padding-top:.6rem;border-top:1px solid #e5e7eb;}
      .eh-meta-item{font-size:.68rem;color:#6b7280;font-weight:600;}
      .eh-meta-item strong{color:#1a1a2e;font-weight:900;}
      .eh-fields{display:grid;grid-template-columns:1fr 1fr 1fr;gap:0;border-top:2px solid #1a1a2e;}
      .eh-field{padding:.5rem .9rem;border-right:1px solid #d1d5db;border-bottom:1px solid #d1d5db;display:flex;flex-direction:column;gap:.18rem;}
      .eh-field:nth-child(3n){border-right:none;}
      .eh-wide{grid-column:span 2;}
      .eh-label{font-size:.55rem;font-weight:900;color:#9ca3af;text-transform:uppercase;letter-spacing:.1em;}
      .eh-val{font-size:.78rem;font-weight:700;color:#1a1a2e;line-height:1.3;}
      .eh-blank{display:block;border-bottom:1.5px solid #9ca3af;margin-top:.45rem;min-height:.1rem;}
      .eh-instructions{background:#f9fafb;border-top:2px solid #1a1a2e;padding:.65rem 1rem;}
      .eh-instr-title{font-size:.62rem;font-weight:900;color:#374151;text-transform:uppercase;letter-spacing:.1em;margin-bottom:.35rem;}
      .eh-instr-list{margin:0;padding-left:1.1rem;font-size:.7rem;color:#374151;font-weight:600;line-height:1.8;}
      .eh-code{padding:.45rem 1rem;border-top:1.5px solid #e5e7eb;display:flex;justify-content:space-between;align-items:center;font-size:.6rem;color:#9ca3af;font-family:monospace;}
      .eh-code strong{color:#1a1a2e;font-size:.65rem;}

/* ── Style block 3 ── */
.news-filter {
  background:#f8f9fa;border:1px solid #e5e7eb;border-radius:20px;
  padding:.3rem .8rem;font-size:.75rem;font-weight:700;cursor:pointer;
  font-family:inherit;color:#374151;white-space:nowrap;transition:all .15s;
}
.news-filter.active,.news-filter:hover {
  background:#7c3aed;color:#fff;border-color:#7c3aed;
}
.news-card {
  padding:1rem;border-bottom:1px solid #f3f4f6;cursor:pointer;
  transition:background .15s;display:flex;gap:.8rem;align-items:flex-start;
}
.news-card:hover { background:#fafafa; }
.news-card:last-child { border-bottom:none; }

/* ── Style block 4 ── */
.cultura-card { border:1.5px solid #e5e7eb; border-radius:14px; padding:1rem 1.1rem; margin-bottom:.8rem; transition:border-color .15s; }
.cultura-card:hover { border-color:#7c3aed; }
.cultura-badge { display:inline-block; background:#f3f4f6; border-radius:6px; padding:.15rem .5rem; font-size:.68rem; font-weight:700; color:#374151; margin:.15rem .1rem; }
.cultura-badge.ebau { background:#ede9fe; color:#4c1d95; }
.cultura-badge.nivel-Facil { background:#dcfce7; color:#166534; }
.cultura-badge.nivel-Medio { background:#fef3c7; color:#92400e; }
.cultura-badge.nivel-Exigente { background:#fce7f3; color:#9d174d; }

/* ── Style block 5 ── */
@keyframes sbLoad { 0%,100%{transform:translateX(-100%)} 50%{transform:translateX(100%)} }