:root{
  --pink:#e255b4; --pink2:#f58ad0; --violet:#9b6bff; --ink:#f3ecf8; --muted:#a79bb8; --ok:#5ed1c4;
  --bg:#0d0813; --surf:rgba(255,255,255,.055); --surf2:rgba(255,255,255,.09);
  --card:rgba(30,18,44,.62); --line:rgba(226,85,180,.22);
  --shadow:0 20px 44px -22px rgba(0,0,0,.8), 0 0 0 1px rgba(255,255,255,.07) inset, 0 1px 0 rgba(255,255,255,.12) inset;
  --glow:0 0 26px -6px rgba(226,85,180,.65);
}
*{box-sizing:border-box;margin:0;-webkit-tap-highlight-color:transparent}
[hidden]{display:none!important}
body{
  font-family:Poppins,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);min-height:100vh;
  background:
    radial-gradient(620px 480px at 6% 4%,rgba(226,85,180,.30),transparent 70%),
    radial-gradient(640px 520px at 98% 10%,rgba(155,107,255,.26),transparent 70%),
    radial-gradient(760px 560px at 55% 108%,rgba(226,85,180,.24),transparent 70%),
    var(--bg);
  background-attachment:fixed;
}
button,input,select,textarea{font:inherit;color:inherit}
.app{display:grid;grid-template-columns:250px 1fr;gap:26px;max-width:none;margin:0;padding:24px 34px}
aside{background:var(--card);backdrop-filter:blur(14px);border-radius:28px;padding:22px 16px;box-shadow:var(--shadow);height:calc(100vh - 56px);position:sticky;top:28px;display:flex;flex-direction:column}
.logo{display:flex;align-items:center;gap:10px;font-weight:700;font-size:19px;padding:0 8px 22px}
.dot{width:26px;height:26px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ffc0e0,var(--pink))}
nav{display:flex;flex-direction:column;gap:6px}
nav small{font-size:10px;letter-spacing:.14em;color:var(--muted);padding:8px 10px 2px}
nav button{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:16px;font-size:14px;font-weight:500;color:var(--muted)}
nav button.on{background:linear-gradient(135deg,rgba(226,85,180,.34),rgba(155,107,255,.20));color:#fff;box-shadow:var(--glow),0 0 0 1px rgba(226,85,180,.45) inset}
nav .badge{margin-left:auto;background:var(--pink);color:#fff;border-radius:99px;font-size:11px;padding:1px 8px}
.pro{margin-top:auto;border-radius:22px;padding:18px;background:linear-gradient(160deg,rgba(226,85,180,.16),rgba(155,107,255,.10));text-align:center;box-shadow:var(--shadow)}
.pro b{display:block;font-size:14px;margin-bottom:4px}
.pro p{font-size:12px;color:var(--muted);line-height:1.4}
header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px;flex-wrap:wrap}
h1{font-size:28px;font-weight:600}
.sub{color:var(--muted);font-size:14px;margin-bottom:18px}
.pill{display:inline-flex;align-items:center;gap:8px;background:var(--card);border-radius:99px;padding:8px 16px;font-size:13px;font-weight:500;box-shadow:var(--shadow)}
.pill i{width:9px;height:9px;border-radius:50%;background:var(--ok)}
.pill.prod i{background:var(--pink)}
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}
.card{background:var(--card);backdrop-filter:blur(14px);border-radius:28px;padding:22px;box-shadow:var(--shadow);position:relative;min-width:0}
.card h3{font-size:15px;font-weight:600;margin-bottom:4px}
.hint{font-size:12px;color:var(--muted);line-height:1.45}
.c12{grid-column:1/-1}.c8{grid-column:span 8}.c7{grid-column:span 7}.c6{grid-column:span 6}.c5{grid-column:span 5}.c4{grid-column:span 4}
.hero{display:grid;grid-template-columns:1fr 230px;gap:22px;align-items:center;min-height:300px}
.eyebrow{font-size:11px;letter-spacing:.16em;color:var(--pink);font-weight:600;display:flex;align-items:center;gap:8px}
.tag{display:inline-block;width:9px;height:9px;border-radius:50%}
.task{font-size:27px;line-height:1.2;font-weight:600;margin:10px 0 8px}
.why{font-size:13px;color:var(--muted);margin-bottom:22px;line-height:1.5}
.btns{display:flex;gap:10px;flex-wrap:wrap}
.btn{all:unset;box-sizing:border-box;cursor:pointer;padding:14px 26px;border-radius:99px;font-weight:600;font-size:15px;background:linear-gradient(135deg,var(--pink2),var(--pink));color:#fff;box-shadow:0 14px 26px -12px rgba(226,85,180,.8);text-align:center}
.btn.soft{background:var(--surf2);color:#f9c4e8;box-shadow:0 8px 18px -12px rgba(226,85,180,.5)}
.btn.mini{padding:8px 16px;font-size:13px}
.btn.gris{background:var(--surf);color:var(--muted);box-shadow:0 6px 14px -10px rgba(0,0,0,.35)}
.btn:active{transform:scale(.97)}.btn[disabled]{opacity:.5;pointer-events:none}
.link{all:unset;cursor:pointer;font-size:12px;color:var(--muted);text-decoration:underline;margin-top:14px;display:inline-block;margin-right:14px}
.timer{position:relative;width:210px;height:210px;justify-self:center}
.timer svg{transform:rotate(-90deg)}
.timer .t{position:absolute;inset:0;display:grid;place-content:center;text-align:center}
.timer b{font-size:40px;font-weight:600;font-variant-numeric:tabular-nums}
.timer span{font-size:12px;color:var(--muted)}
.jefa{background:linear-gradient(150deg,var(--pink2),var(--pink));color:#fff;display:flex;flex-direction:column;justify-content:space-between}
.jefa .hint{color:rgba(255,255,255,.82)}
.jefa p{font-size:18px;line-height:1.38;font-weight:500;margin:14px 0}
.switch{display:flex;align-items:center;gap:12px;background:rgba(255,255,255,.22);border-radius:18px;padding:12px 14px;cursor:pointer;font-size:13px}
.switch i{width:42px;height:24px;border-radius:99px;background:rgba(255,255,255,.4);position:relative;flex:none;transition:.2s}
.switch i:after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:var(--surf);transition:.2s}
.switch.on i{background:var(--surf)}.switch.on i:after{left:21px;background:var(--pink)}
.switch.oscuro{background:var(--surf)}.switch.oscuro i{background:rgba(255,255,255,.18)}.switch.oscuro.on i{background:var(--pink)}.switch.oscuro.on i:after{background:var(--surf)}
.donut{position:relative;width:150px;height:150px;margin:8px auto 4px}
.donut svg{transform:rotate(-90deg)}
.donut b{position:absolute;inset:0;display:grid;place-content:center;font-size:30px;font-weight:600}
.opts{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}
.opts button{all:unset;box-sizing:border-box;cursor:pointer;padding:10px 16px;border-radius:99px;background:var(--surf);font-size:13px;font-weight:500;box-shadow:0 6px 14px -10px rgba(0,0,0,.4)}
.opts button.on{background:linear-gradient(135deg,var(--pink2),var(--pink));color:#fff}
.list{display:flex;flex-direction:column;gap:8px;margin-top:12px;font-size:13px}
.fila{background:var(--surf);border-radius:16px;padding:11px 14px;box-shadow:0 6px 14px -12px rgba(0,0,0,.4);display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.fila .grow{flex:1;min-width:140px}
.fila.hecho{opacity:.6;text-decoration:line-through}.fila.actual{outline:2px solid var(--pink2)}
.fila .hora{font-variant-numeric:tabular-nums;color:var(--muted);font-size:12px;min-width:42px}
.fila.fijo{background:rgba(255,255,255,.035)}
.ok{color:var(--pink);font-weight:700}
.empty{color:var(--muted);font-size:13px;padding:8px 2px}
.campo{display:flex;flex-direction:column;gap:6px;margin:12px 0}
.campo label{font-size:12px;font-weight:500;color:var(--muted)}
input,select,textarea{border:0;background:var(--surf);border-radius:16px;padding:12px 16px;font-size:14px;outline:2px solid transparent;box-shadow:0 6px 14px -10px rgba(0,0,0,.4);width:100%}
textarea{min-height:110px;resize:vertical;line-height:1.5}
input:focus,select:focus,textarea:focus{outline-color:var(--pink2)}
.dos{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fila input,.fila select{padding:8px 12px;font-size:13px;width:auto}
.dias{display:flex;gap:6px;flex-wrap:wrap}
.dias label{cursor:pointer}.dias input{display:none}
.dias span{display:inline-grid;place-content:center;width:34px;height:34px;border-radius:50%;background:var(--surf);font-size:12px;font-weight:600;color:var(--muted);box-shadow:0 4px 10px -8px rgba(0,0,0,.4)}
.dias input:checked+span{background:var(--pink);color:#fff}
.chat{display:flex;flex-direction:column;gap:10px;max-height:52vh;overflow:auto;padding:4px 2px}
.burbuja{max-width:85%;padding:12px 16px;border-radius:20px;font-size:14px;line-height:1.5;white-space:pre-wrap}
.burbuja.igor{background:var(--surf);border-bottom-left-radius:6px;box-shadow:0 6px 14px -12px rgba(0,0,0,.4)}
.burbuja.yo{background:linear-gradient(135deg,var(--pink2),var(--pink));color:#fff;align-self:flex-end;border-bottom-right-radius:6px}
.envio{display:flex;gap:8px;margin-top:12px}
.envio input{flex:1}
.mic{all:unset;box-sizing:border-box;cursor:pointer;width:46px;height:46px;border-radius:50%;background:var(--surf);display:grid;place-content:center;font-size:18px;flex:none;box-shadow:0 6px 14px -10px rgba(0,0,0,.4)}
.mic.on{background:var(--pink);color:#fff;animation:late 1.2s infinite}
@keyframes late{50%{transform:scale(1.08)}}
.fb{background:var(--surf);border-radius:20px;padding:16px 18px;margin-top:14px;font-size:14px;line-height:1.55}
.fb h4{font-size:12px;letter-spacing:.1em;color:var(--pink);margin:10px 0 4px}
.fb ul{padding-left:18px}
.aviso{background:rgba(240,195,107,.14);color:#f0d9a3;border-radius:16px;padding:12px 14px;font-size:13px;line-height:1.5;margin-top:12px}
.sec{margin-top:26px}
.sec>h2{font-size:17px;font-weight:600;margin-bottom:2px}
.toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,40px);background:#2a1840;color:#fff;border:1px solid var(--line);padding:13px 22px;border-radius:99px;font-size:14px;opacity:0;transition:.3s;z-index:20;max-width:90vw;pointer-events:none;text-align:center}
.toast.show{opacity:1;transform:translate(-50%,0)}
.tabbar{display:none}
#login{min-height:100vh;display:grid;place-items:center;padding:20px}
#login .card{width:min(380px,100%);text-align:center}
#login h1{font-size:24px;margin:10px 0 4px}
.err{color:#ff8fb8;font-size:13px;margin-top:10px;min-height:18px}
@media (max-width:860px){
  .app{grid-template-columns:1fr;padding:16px 14px 100px}
  aside{display:none}
  h1{font-size:23px}
  .c8,.c7,.c6,.c5,.c4{grid-column:1/-1}
  .hero{grid-template-columns:1fr;text-align:center}
  .hero .eyebrow{justify-content:center}
  .btns{justify-content:center}.task{font-size:23px}
  .dos{grid-template-columns:1fr}
  .tabbar{display:flex;position:fixed;left:12px;right:12px;bottom:calc(10px + env(safe-area-inset-bottom));background:var(--card);backdrop-filter:blur(16px);border-radius:99px;padding:6px;box-shadow:var(--shadow);justify-content:space-between;z-index:8}
  .tabbar button{all:unset;box-sizing:border-box;padding:10px 0;flex:1;text-align:center;border-radius:99px;font-size:12px;font-weight:500;color:var(--muted);cursor:pointer}
  .tabbar button.on{background:var(--surf);color:var(--pink)}
}

/* ---- Igor, el conejo ---- */
.conejo{all:unset;box-sizing:border-box;position:fixed;right:18px;bottom:22px;width:84px;height:84px;border-radius:50%;background:linear-gradient(160deg,#2a1840,#150c22);box-shadow:0 16px 30px -12px rgba(226,85,180,.5),0 2px 0 rgba(255,255,255,.12) inset;cursor:pointer;z-index:12;display:grid;place-items:center;transition:transform .2s}
.conejo:hover{transform:translateY(-3px)}
.conejo.oculto{display:none}
.conejo-svg{width:100%;height:100%;display:block}
.conejo .conejo-svg{width:80%;height:80%;margin-top:6px}
.ojos{animation:parpadeo 5s infinite;transform-origin:center;transform-box:fill-box}
@keyframes parpadeo{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.1)}}
.oreja{transform-box:fill-box;transform-origin:50% 100%}
.conejo.salta{animation:salto .7s 2}
.conejo.salta .oreja.i{animation:oreja .35s 4}.conejo.salta .oreja.d{animation:oreja .35s 4 reverse}
@keyframes salto{40%{transform:translateY(-18px)}}
@keyframes oreja{50%{transform:rotate(-9deg)}}
.bocadillo{position:fixed;right:112px;bottom:46px;max-width:min(300px,60vw);background:var(--surf);border-radius:20px 20px 4px 20px;padding:12px 16px;font-size:13px;line-height:1.45;box-shadow:0 14px 30px -14px rgba(226,85,180,.4);z-index:12;cursor:pointer;opacity:0;transform:translateY(8px) scale(.96);pointer-events:none;transition:.25s}
.bocadillo.ver{opacity:1;transform:none;pointer-events:auto}
.chatpanel{position:fixed;right:18px;bottom:22px;width:390px;max-height:min(640px,calc(100vh - 44px));border-radius:28px;box-shadow:0 30px 60px -20px rgba(226,85,180,.5),0 2px 0 rgba(255,255,255,.12) inset;padding:18px;z-index:30;display:flex;flex-direction:column;background:rgba(22,12,34,.94);backdrop-filter:blur(22px);border:1px solid var(--line)}
.chatpanel .chat{max-height:none;flex:1;min-height:200px;overflow:auto;margin:12px 0 4px}
.cp-head{display:flex;align-items:center;gap:12px}
.cp-head .grow{flex:1}
.cerrar{all:unset;cursor:pointer;width:34px;height:34px;border-radius:50%;background:var(--surf);text-align:center;line-height:32px;font-size:22px;color:var(--muted);box-shadow:0 4px 10px -8px rgba(0,0,0,.4)}
.av{display:inline-block;width:48px;height:48px;border-radius:50%;background:linear-gradient(160deg,#2a1840,#150c22);flex:none;overflow:hidden;box-shadow:0 6px 14px -8px rgba(226,85,180,.5)}
.av .conejo-svg{margin-top:5px}
.igor-cab{display:flex;align-items:center;gap:12px}
.jefa .av{background:rgba(255,255,255,.95)}
.nota{font-size:12px;color:var(--ok);align-self:flex-start;margin:-4px 0 0 6px}
@media (max-width:860px){
  .conejo{right:12px;bottom:calc(76px + env(safe-area-inset-bottom));width:70px;height:70px}
  .bocadillo{right:92px;bottom:calc(92px + env(safe-area-inset-bottom));max-width:62vw}
  .chatpanel{left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));width:auto;max-height:78vh}
}

/* ---- Mi mes ---- */
.cal-cab{display:flex;align-items:center;gap:10px;margin-bottom:14px}.cal-cab h3{flex:1;text-align:center;font-size:17px}
.cal-sem{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;text-align:center;font-size:11px;color:var(--muted);margin-bottom:6px;font-weight:500}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.dia{all:unset;box-sizing:border-box;cursor:pointer;min-height:74px;border-radius:16px;background:var(--surf);padding:8px;display:flex;flex-direction:column;gap:4px;position:relative;box-shadow:0 6px 14px -12px rgba(0,0,0,.4)}
.dia b{font-size:14px;font-weight:600}
.dia.fuera{opacity:.4}.dia.prod{background:linear-gradient(160deg,rgba(226,85,180,.22),rgba(155,107,255,.12))}
.dia.hoy b{color:#fff;background:var(--pink);border-radius:50%;width:24px;height:24px;display:grid;place-content:center;font-size:12px}
.dia.sel{outline:2px solid var(--pink2)}
.dia .ev{position:absolute;right:8px;top:8px;font-style:normal;color:var(--pink);font-size:13px}
.dia .pts{display:flex;gap:3px;flex-wrap:wrap;margin-top:auto}
@media (max-width:860px){.dia{min-height:54px;padding:6px;border-radius:12px}.dia b{font-size:12px}.cal,.cal-sem{gap:4px}}

/* ---- escribiendo… ---- */
.burbuja.escribe{color:var(--muted);font-size:13px}
.burbuja.escribe span{animation:punto 1.2s infinite;display:inline-block;font-weight:700}
.burbuja.escribe span:nth-child(2){animation-delay:.2s}.burbuja.escribe span:nth-child(3){animation-delay:.4s}
@keyframes punto{0%,60%,100%{transform:translateY(0);opacity:.3}30%{transform:translateY(-4px);opacity:1}}
.conejo.pensando .oreja.i{animation:oreja .5s infinite}.conejo.pensando .oreja.d{animation:oreja .5s infinite reverse}

.hora-viva{font-variant-numeric:tabular-nums;color:var(--pink);font-weight:600;letter-spacing:.02em}

/* ---- animaciones ---- */
#vista.anim .card{animation:aparece .6s cubic-bezier(.2,.8,.2,1) both}
#vista.anim .card:nth-child(2){animation-delay:.07s}#vista.anim .card:nth-child(3){animation-delay:.14s}
#vista.anim .card:nth-child(4){animation-delay:.21s}#vista.anim .card:nth-child(5){animation-delay:.28s}
#vista.anim .card:nth-child(n+6){animation-delay:.34s}
@keyframes aparece{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:none}}
#vista.anim .list>*{animation:fila .45s cubic-bezier(.2,.8,.2,1) both}
#vista.anim .list>*:nth-child(2){animation-delay:.05s}#vista.anim .list>*:nth-child(3){animation-delay:.1s}
#vista.anim .list>*:nth-child(4){animation-delay:.15s}#vista.anim .list>*:nth-child(n+5){animation-delay:.2s}
@keyframes fila{from{opacity:0;transform:translateX(-12px)}to{opacity:1;transform:none}}
.card{transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s}
@media (hover:hover){.card:hover{transform:translateY(-3px)}}
.btn,.opts button,.mic,.tabbar button,nav button,.dia{position:relative;overflow:hidden;transition:transform .15s,box-shadow .2s,background .2s}
.btn:hover{transform:translateY(-2px);box-shadow:0 18px 30px -12px rgba(226,85,180,.85)}
.btn:active{transform:scale(.95)}
.onda{position:absolute;border-radius:50%;background:rgba(255,255,255,.6);transform:scale(0);animation:onda .7s ease-out;pointer-events:none}
.btn.soft .onda,.btn.gris .onda,.opts button .onda,.mic .onda,.tabbar button .onda,nav button .onda,.dia .onda{background:rgba(226,85,180,.28)}
@keyframes onda{to{transform:scale(1);opacity:0}}
.conf{position:fixed;z-index:60;pointer-events:none}
.donut circle:last-of-type{transition:stroke-dashoffset 1.2s cubic-bezier(.2,.8,.2,1)}
#anillo{transition:stroke-dashoffset 1s linear}
.timer{border-radius:50%}
.timer.corre:before{content:"";position:absolute;inset:6px;border-radius:50%;animation:respira 2.6s ease-out infinite;pointer-events:none}
@keyframes respira{0%{box-shadow:0 0 0 0 rgba(226,85,180,.38)}70%{box-shadow:0 0 0 26px rgba(226,85,180,0)}100%{box-shadow:0 0 0 0 rgba(226,85,180,0)}}
.hero > div:first-child.cambia{animation:cambia .55s cubic-bezier(.2,.9,.3,1)}
.timer.cambia{animation:giro .7s cubic-bezier(.2,.9,.3,1.2)}
@keyframes cambia{from{opacity:0;transform:translateX(28px)}to{opacity:1;transform:none}}
@keyframes giro{from{transform:scale(.88) rotate(-12deg);opacity:.4}to{transform:none;opacity:1}}
.conejo{animation:flota 4.5s ease-in-out infinite}
@keyframes flota{50%{transform:translateY(-5px)}}
.chatpanel{animation:panel .38s cubic-bezier(.2,.9,.3,1.1)}
@keyframes panel{from{opacity:0;transform:translateY(24px) scale(.93)}to{opacity:1;transform:none}}
.chat .burbuja:last-child,.chat .nota:last-child{animation:burbuja .35s cubic-bezier(.2,.9,.3,1.25)}
@keyframes burbuja{from{opacity:0;transform:translateY(10px) scale(.88)}to{opacity:1;transform:none}}
.toast{transition:opacity .3s,transform .45s cubic-bezier(.2,1.3,.3,1)}
.pill i{animation:latido 2.4s ease-in-out infinite}
@keyframes latido{50%{transform:scale(1.35);opacity:.6}}
@media (prefers-reduced-motion:reduce){*,*:before{animation:none!important;transition:none!important}}

.barra{height:14px;border-radius:99px;background:rgba(255,255,255,.09);overflow:hidden}
.barra i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--violet),var(--pink));transition:width 1.2s cubic-bezier(.2,.8,.2,1)}

/* ---- chat vivo: stickers, bandeja de emojis, burbujas con dirección ---- */
.chat .burbuja.igor:last-child,.chat .nota:last-child{animation:sale-izq .4s cubic-bezier(.2,.9,.3,1.25)}
.chat .burbuja.yo:last-child{animation:sale-der .4s cubic-bezier(.2,.9,.3,1.25)}
@keyframes sale-izq{from{opacity:0;transform:translate(-18px,8px) scale(.9)}to{opacity:1;transform:none}}
@keyframes sale-der{from{opacity:0;transform:translate(18px,8px) scale(.9)}to{opacity:1;transform:none}}
.sticker{width:132px;align-self:flex-start;animation:pegatina .7s cubic-bezier(.2,.9,.3,1.4) both;animation-delay:.35s}
.sticker.yo{align-self:flex-end;animation-delay:0s}
.sticker-svg{width:100%;height:auto;display:block;filter:drop-shadow(0 10px 14px rgba(226,85,180,.45));animation:bambolea 3.6s ease-in-out 1.2s infinite}
@keyframes pegatina{0%{opacity:0;transform:scale(.2) rotate(-18deg)}60%{opacity:1;transform:scale(1.12) rotate(5deg)}100%{opacity:1;transform:scale(1) rotate(0)}}
@keyframes bambolea{50%{transform:rotate(-2.5deg) translateY(-2px)}}
.stickband{background:var(--surf);border-radius:20px;padding:10px;margin-top:10px;box-shadow:0 10px 24px -14px rgba(226,85,180,.4);animation:panel .25s cubic-bezier(.2,.9,.3,1.1)}
.stickband .emojis{display:flex;gap:4px;flex-wrap:wrap;justify-content:center;margin-bottom:8px}
.stickband .emojis button{all:unset;cursor:pointer;font-size:22px;padding:4px 6px;border-radius:12px;transition:transform .15s,background .15s}
.stickband .emojis button:hover{background:rgba(226,85,180,.22);transform:scale(1.2)}
.stickband .stickers{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.stickband .stickers button{all:unset;cursor:pointer;border-radius:16px;transition:transform .15s}
.stickband .stickers button:hover{transform:scale(1.08) rotate(-2deg)}
.stickband .stickers button .sticker-svg{animation:none;filter:none}
.chatpanel .envio{align-items:center}.chatpanel .envio .mic{width:42px;height:42px;font-size:18px}
.stickband .stickers{max-height:132px;overflow:auto;padding:2px}
.chatpanel .chat{min-height:110px}
.chatpanel{display:flex;flex-direction:column}
.chatpanel .envio{flex:none}.chatpanel .opts{flex:none}
@media (max-width:860px){.stickband .stickers{max-height:112px}.stickband .emojis button{font-size:20px}}
.stickband .stickers{grid-template-columns:repeat(auto-fill,minmax(64px,1fr));max-height:148px}
@media (max-width:860px){.stickband .stickers{max-height:148px}}


/* ---- tema oscuro cristal ---- */
::selection{background:rgba(226,85,180,.45)}
input,select,textarea{border:1px solid rgba(255,255,255,.10);color:var(--ink)}
input::placeholder,textarea::placeholder{color:#7d7190}
select option{background:#1b1028;color:var(--ink)}
.card,aside,.pill,.tabbar{border:1px solid rgba(255,255,255,.07)}
.card:hover{box-shadow:var(--shadow),var(--glow)}
.logo{font-weight:600;letter-spacing:.02em}
.logo svg{width:34px;height:34px;flex:none;filter:drop-shadow(0 0 8px rgba(226,85,180,.6))}
nav button:hover{background:var(--surf);color:#fff}
.btn{box-shadow:0 14px 28px -12px rgba(226,85,180,.85),0 0 0 1px rgba(255,255,255,.18) inset}
.jefa{background:linear-gradient(150deg,rgba(226,85,180,.40),rgba(155,107,255,.30));border:1px solid rgba(226,85,180,.35)}
.jefa .av{background:#1b1028}
.switch{background:rgba(255,255,255,.10)}
.switch.oscuro{background:var(--surf)}
.switch.on i{background:#fff}
.opts button.on{box-shadow:var(--glow)}
.fila.actual{outline:1px solid var(--pink2);box-shadow:var(--glow)}
.dia.sel{outline:1px solid var(--pink2)}
.dia.hoy b{box-shadow:var(--glow)}
.burbuja.igor{border:1px solid rgba(255,255,255,.08)}
.chatpanel .cerrar,.cerrar{background:var(--surf2);color:var(--ink)}
.stickband .stickers button:hover,.stickband .emojis button:hover{background:rgba(226,85,180,.22)}
.fb{border:1px solid rgba(255,255,255,.07)}
.timer .t span,.donut span{color:var(--muted)}
.mariposa{position:fixed;pointer-events:none;z-index:0;opacity:.55;filter:blur(.4px) drop-shadow(0 0 22px rgba(226,85,180,.7));animation:vuela 9s ease-in-out infinite}
.mariposa.m1{right:-26px;top:70px;width:170px;transform:rotate(14deg)}
.mariposa.m2{left:-34px;bottom:30px;width:210px;transform:rotate(-18deg);animation-delay:-4s}
@keyframes vuela{50%{translate:0 -14px}}
.app,main,aside,#login{position:relative;z-index:1}
@media (max-width:860px){.mariposa.m1{width:110px;top:40px}.mariposa.m2{width:130px;bottom:90px}}

/* ---- campana y hoja de avisos ---- */
#campana{font-size:13px;font-weight:500;color:var(--ink)}
.hojaAv{position:fixed;inset:0;background:rgba(42,34,48,.38);backdrop-filter:blur(5px);display:grid;place-items:center;z-index:50;animation:aparece .25s ease both}
.hojaAv-caja{background:#fff;border-radius:28px;padding:22px;width:min(340px,92vw);box-shadow:0 30px 60px -20px rgba(190,60,130,.55);animation:panel .3s cubic-bezier(.2,.9,.3,1.1)}
.hojaAv-caja .btn{display:block;width:100%;margin:8px 0}

/* ---- chat más amplio ---- */
.chatpanel{width:min(580px,calc(100vw - 36px));height:min(780px,calc(100vh - 44px));max-height:none}
.chatpanel .chat{flex:1;min-height:0;margin:14px 0 6px;max-height:none}
.chatpanel .burbuja{font-size:15px;max-width:88%}
@media (max-width:860px){.chatpanel{left:8px;right:8px;width:auto;height:90vh;max-height:none;bottom:calc(8px + env(safe-area-inset-bottom))}}

/* ---- trayecto de cada vídeo ---- */
.camino{display:flex;align-items:center;overflow-x:auto;padding:4px 2px 12px;scrollbar-width:thin}
.paso-v{all:unset;box-sizing:border-box;cursor:pointer;flex:none;padding:8px 13px;border-radius:99px;font-size:12px;font-weight:500;background:#f1e8ee;color:var(--muted);display:inline-flex;gap:6px;align-items:center;transition:transform .15s,box-shadow .2s;white-space:nowrap}
.paso-v:hover{transform:translateY(-2px)}
.paso-v.hecho{background:var(--ok);color:#fff}
.paso-v.sig{background:linear-gradient(135deg,var(--pink2),var(--pink));color:#fff;box-shadow:0 10px 18px -8px rgba(236,63,147,.85);animation:latido-p 2.2s ease-in-out infinite}
.paso-v.libre{background:#fff;color:var(--ink);box-shadow:inset 0 0 0 2px var(--pink2)}
.paso-v.igor{background:#efe4fb;color:var(--violet)}
.paso-v.bloq{opacity:.5}
@keyframes latido-p{50%{transform:scale(1.06)}}
.uni{flex:none;width:12px;height:2px;background:#e6d5df}
.v-cab{display:flex;align-items:center;gap:12px}.v-cab .grow{flex:1;min-width:0}.v-pct{font-weight:600;color:var(--pink);font-size:18px}

.bat{display:inline-block;font-size:12px;font-weight:500;color:var(--violet);background:#efe4fb;border-radius:99px;padding:5px 12px;margin:-8px 0 16px}

/* ---- llamada con Igor ---- */
.llamada{position:fixed;inset:0;z-index:70;background:radial-gradient(900px 600px at 50% 20%,rgba(255,116,184,.9),rgba(155,93,229,.92) 70%);backdrop-filter:blur(10px);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;text-align:center;animation:aparece .3s ease both}
.ll-av{position:relative;width:150px;height:150px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 20px 50px -14px rgba(0,0,0,.4)}
.ll-av .conejo-svg{width:84%;height:84%;margin-top:8px}
.ll-onda{position:absolute;inset:0;border-radius:50%;border:3px solid rgba(255,255,255,.7);opacity:0;pointer-events:none}
.llamada[data-est="escucha"] .ll-onda{animation:ll-onda 1.8s ease-out infinite}.llamada[data-est="escucha"] .ll-2{animation-delay:.9s}
.llamada[data-est="habla"] .ll-av{animation:ll-habla .8s ease-in-out infinite}
.llamada[data-est="piensa"] .oreja.i{animation:oreja .5s infinite}.llamada[data-est="piensa"] .oreja.d{animation:oreja .5s infinite reverse}
@keyframes ll-onda{0%{transform:scale(1);opacity:.8}100%{transform:scale(1.9);opacity:0}}
@keyframes ll-habla{50%{transform:scale(1.06)}}
.ll-nombre{font-size:26px;font-weight:600;margin-top:22px}.ll-estado{font-size:14px;opacity:.85;margin-top:4px}
.ll-igor{margin-top:22px;font-size:18px;line-height:1.4;max-width:520px;min-height:50px}
.ll-tu{margin-top:14px;font-size:15px;opacity:.8;max-width:520px;min-height:22px;font-style:italic}

.dia.destello{animation:destello-dia 1.5s ease 3}
@keyframes destello-dia{0%,100%{box-shadow:0 0 0 0 rgba(236,63,147,0)}50%{box-shadow:0 0 0 9px rgba(236,63,147,.45)}}

#negocio{height:calc(100vh - 150px);min-height:480px}
#llamadas iframe{width:100%;height:calc(100vh - 210px);min-height:480px;border:1px solid rgba(255,255,255,.08);border-radius:22px;background:#0d0813;display:block}
body.v-llamadas .conejo{right:auto;left:18px}
#negocio iframe{width:100%;height:100%;border:1px solid rgba(255,255,255,.08);border-radius:22px;background:#0d0813;display:block}
body.v-negocio .conejo{right:auto;left:18px}
@media (max-width:860px){#negocio{height:calc(100dvh - 230px)}#llamadas iframe{height:calc(100dvh - 290px)}body.v-negocio .conejo,body.v-llamadas .conejo{left:12px;right:auto}}