:root{
  color-scheme:dark;
  --bg:#0d0f0e;--panel:#141715;--panel2:#1a1e1b;--line:#262b27;--line2:#323832;
  --text:#eef0ea;--muted:#8b938d;--dim:#5d655f;
  --accent:#d7fa78;--accent-ink:#17220a;--warn:#ffb86b;--danger:#ff7a6b;
  --r-lg:16px;--r:12px;--r-sm:8px;
  --font:"Manrope",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --side:84px;--ctrl:392px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--text);font:14px/1.5 var(--font);-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;border:0;background:none}
button:disabled{cursor:not-allowed;opacity:.5}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
svg.i{width:20px;height:20px;flex-shrink:0}
h1,h2,h3,p{margin:0}
.boot{height:100vh;display:grid;place-content:center;justify-items:center;gap:14px;color:var(--muted)}
.boot img{animation:pulse 1.4s ease-in-out infinite}
@keyframes pulse{50%{opacity:.4;transform:scale(.94)}}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ---------- Estructura ---------- */
.shell{display:grid;grid-template-columns:var(--side) minmax(0,1fr);height:100vh}
.side{border-right:1px solid var(--line);display:flex;flex-direction:column;align-items:center;padding:16px 8px;gap:4px;background:#0a0c0b}
/* 0.34.1: un solo scroll — la barra lateral se desplaza por dentro si no cabe */
.side{height:100vh;height:100dvh;overflow-y:auto;overflow-x:hidden;scrollbar-width:none;overscroll-behavior:contain}
.side::-webkit-scrollbar{display:none}
.side > *{flex-shrink:0}
.side .logo{width:40px;height:40px;margin-bottom:18px}
.nav{width:100%;display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 4px;border-radius:12px;color:var(--muted);font-size:11px;font-weight:600}
.nav:hover{color:var(--text);background:var(--panel)}
.nav.on{color:var(--accent);background:#d7fa7812}
.side-foot{margin-top:auto;display:flex;flex-direction:column;align-items:center;gap:10px;width:100%}
.avatar{width:36px;height:36px;border-radius:50%;background:var(--panel2);border:1px solid var(--line2);font-weight:700;display:grid;place-items:center}
.main{min-width:0;display:flex;flex-direction:column;height:100vh}
.top{display:flex;align-items:center;gap:12px;padding:14px 24px;border-bottom:1px solid var(--line);min-height:64px}
.top h1{font-size:18px;font-weight:700;letter-spacing:-.3px}
.top .sp{flex:1}
.credits{display:flex;align-items:center;gap:8px;padding:6px 6px 6px 12px;border:1px solid var(--line2);border-radius:999px;font-weight:600;font-size:13px}
.credits b{color:var(--accent)}
.credits .buy{background:var(--accent);color:var(--accent-ink);border-radius:999px;padding:4px 12px;font-weight:700;font-size:12px}
.tag{font-size:11px;font-weight:700;padding:3px 9px;border-radius:999px;background:#ffb86b1c;color:var(--warn)}
.body{flex:1;min-height:0;display:grid;grid-template-columns:var(--ctrl) minmax(0,1fr)}
.body.full{grid-template-columns:1fr}

/* ---------- Panel de control ---------- */
.ctrl{border-right:1px solid var(--line);overflow-y:auto;padding:18px 18px 110px;position:relative}
.ctrl-foot{position:sticky;bottom:-110px;margin:18px -18px -110px;padding:14px 18px 18px;background:linear-gradient(transparent,var(--bg) 22%)}
.seg{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:4px;gap:4px;margin-bottom:16px}
.seg button{padding:9px 6px;font-size:13px;white-space:nowrap;border-radius:9px;font-weight:600;color:var(--muted)}
.seg button.on{background:var(--panel2);color:var(--text);box-shadow:inset 0 0 0 1px var(--line2)}
.blk{margin-bottom:16px}
.lbl{display:flex;justify-content:space-between;align-items:baseline;font-size:12px;font-weight:600;color:var(--muted);margin-bottom:7px}
.lbl small{font-weight:500;color:var(--dim)}
.tpl-chip{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--r);background:var(--panel);border:1px solid var(--line2);margin-bottom:16px}
.tpl-chip .sw{width:30px;height:30px;border-radius:8px;flex-shrink:0}
.tpl-chip div{flex:1;min-width:0}
.tpl-chip strong{display:block;font-size:13px}
.tpl-chip span{font-size:12px;color:var(--muted)}
.x{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;color:var(--muted)}
.x:hover{background:var(--panel2);color:var(--text)}
.slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:8px}
.slot{aspect-ratio:1;border-radius:var(--r);border:1.5px dashed var(--line2);display:grid;place-items:center;text-align:center;color:var(--muted);font-size:11px;font-weight:600;position:relative;overflow:hidden;background:var(--panel)}
.slot:hover{border-color:var(--muted);color:var(--text)}
.slot.wide{aspect-ratio:auto;height:118px}
.slot.filled{border-style:solid;border-color:var(--line2)}
.slot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.slot .rm{position:absolute;top:6px;right:6px;background:#000a;border-radius:7px;width:24px;height:24px;display:grid;place-items:center;z-index:2}
.slot .busy{position:absolute;inset:0;background:#000a;display:grid;place-items:center;z-index:1}
.slot-pair{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.slot .hint{display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px}
.need{border-color:var(--warn)!important;color:var(--warn)}
textarea,.inp{width:100%;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;resize:vertical;outline:none;transition:border-color .15s}
textarea{min-height:120px;line-height:1.55}
textarea:focus,.inp:focus{border-color:var(--line2);box-shadow:0 0 0 3px #d7fa7814}
.pick{width:100%;display:flex;align-items:center;gap:12px;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:11px 12px;text-align:left}
.pick:hover{border-color:var(--line2)}
.pick .ico{width:34px;height:34px;border-radius:9px;background:var(--panel2);display:grid;place-items:center;color:var(--accent);flex-shrink:0;overflow:hidden}
.pick .ico img{width:100%;height:100%;object-fit:cover}
.pick div{flex:1;min-width:0}
.pick strong{display:block;font-size:13px}
.pick small{color:var(--muted);font-size:12px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.badge{font-size:10px;font-weight:700;padding:2px 7px;border-radius:6px;background:#d7fa781a;color:var(--accent);margin-left:6px;vertical-align:1px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{padding:7px 11px;border-radius:9px;background:var(--panel);border:1px solid var(--line);font-size:12px;font-weight:600;color:var(--muted);display:flex;align-items:center;gap:7px}
.chip:hover{color:var(--text)}
.chip.on{color:var(--text);border-color:var(--accent);background:#d7fa780d}
.ratio{display:inline-block;border:1.5px solid currentColor;border-radius:2px}
.range{display:flex;align-items:center;gap:12px}
.range input{flex:1;accent-color:var(--accent)}
.range output{min-width:38px;text-align:right;font-weight:700}
.toggle{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);font-weight:600;font-size:13px}
.sw-t{width:38px;height:22px;border-radius:999px;background:var(--line2);position:relative;transition:background .15s}
.sw-t::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .15s}
.toggle.on .sw-t{background:var(--accent)}
.toggle.on .sw-t::after{transform:translateX(16px);background:var(--accent-ink)}
.params{display:grid;gap:14px}
.go{width:100%;display:flex;align-items:center;justify-content:center;gap:10px;padding:15px;border-radius:14px;background:var(--accent);color:var(--accent-ink);font-weight:800;font-size:15px;box-shadow:0 8px 30px -10px #d7fa7866}
.go:hover:not(:disabled){filter:brightness(1.05)}
.go .cost{font-weight:600;opacity:.75;font-size:13px}
.foot-note{text-align:center;color:var(--muted);font-size:12px;margin-top:8px}
.foot-note a{color:var(--accent);font-weight:600}
.tip{font-size:12px;color:var(--dim);margin-top:6px}

/* ---------- Galería ---------- */
.feed{overflow-y:auto;padding:20px 24px 60px}
.feed-head{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.feed-head h2{font-size:15px;font-weight:700}
.banner{border:1px solid #ffb86b44;background:#ffb86b10;color:#ffd9b0;border-radius:var(--r);padding:12px 14px;margin-bottom:16px;display:flex;gap:12px;align-items:center}
.banner a{color:var(--warn);font-weight:700;margin-left:auto;white-space:nowrap}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.card{position:relative;border-radius:var(--r);overflow:hidden;background:var(--panel);border:1px solid var(--line);aspect-ratio:4/5;text-align:left;padding:0;width:100%}
.card.v{aspect-ratio:16/10}
.card img,.card video{width:100%;height:100%;object-fit:cover;display:block}
.card .meta{position:absolute;left:0;right:0;bottom:0;padding:28px 12px 10px;background:linear-gradient(transparent,#000c);font-size:12px;opacity:0;transition:opacity .15s}
.card:hover .meta,.card:focus-visible .meta{opacity:1}
.card .meta p{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card .more{position:absolute;top:8px;right:8px;background:#000b;padding:2px 8px;border-radius:7px;font-size:11px;font-weight:700}
.card .kind{position:absolute;top:8px;left:8px;background:#000b;border-radius:7px;width:26px;height:26px;display:grid;place-items:center}
.card .kind svg{width:14px;height:14px}
.pending{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:10px;text-align:center;padding:16px;background:radial-gradient(circle at 30% 20%,#d7fa7818,transparent 55%),var(--panel)}
.pending::before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,#ffffff0d 50%,transparent 70%);background-size:220% 100%;animation:sheen 1.8s linear infinite}
@keyframes sheen{from{background-position:120% 0}to{background-position:-120% 0}}
.pending strong{font-size:13px}
.pending small{color:var(--muted)}
.spin{width:26px;height:26px;border-radius:50%;border:2.5px solid var(--line2);border-top-color:var(--accent);animation:rot 0.9s linear infinite}
@keyframes rot{to{transform:rotate(360deg)}}
.failed{position:absolute;inset:0;display:grid;place-content:center;gap:6px;padding:18px;text-align:center;color:var(--muted);font-size:12px}
.failed strong{color:var(--danger);font-size:13px}
.empty{border:1.5px dashed var(--line2);border-radius:var(--r-lg);padding:48px 24px;text-align:center;color:var(--muted);display:grid;justify-items:center;gap:10px}
.empty h3{color:var(--text);font-size:16px}
.empty .row{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:6px}
.btn{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:10px;background:var(--panel2);border:1px solid var(--line2);font-weight:600;font-size:13px}
.btn:hover{border-color:var(--muted)}
.btn.pri{background:var(--accent);color:var(--accent-ink);border-color:transparent}
.btn.dng{color:var(--danger)}
.btn svg{width:16px;height:16px}
.loadmore{display:block;margin:20px auto 0}

/* ---------- Plantillas ---------- */
.page{overflow-y:auto;padding:22px 24px 80px}
.page-intro{max-width:620px;color:var(--muted);margin-bottom:18px}
.cats{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:18px}
.tgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.tcard{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;text-align:left;display:flex;flex-direction:column;padding:0}
.tcard:hover{border-color:var(--line2)}
.tcard:hover .art{transform:scale(1.03)}
.art-wrap{overflow:hidden;aspect-ratio:16/10;position:relative}
.art{position:absolute;inset:0;transition:transform .35s ease}
.art::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(115deg,#ffffff0a 0 2px,transparent 2px 14px);mix-blend-mode:overlay}
.art-ico{position:absolute;right:10px;bottom:10px;width:30px;height:30px;border-radius:9px;background:#000a;display:grid;place-items:center}
.art-ico svg{width:16px;height:16px}
.tcard .tx{padding:12px 14px 14px;display:grid;gap:4px}
.tcard strong{font-size:14px}
.tcard p{color:var(--muted);font-size:12.5px;line-height:1.45}
.tcard .info{font-size:11px;color:var(--dim);font-weight:600;margin-top:4px}

/* ---------- Modales ---------- */
.ov{position:fixed;inset:0;background:#000c;z-index:50;display:grid;place-items:center;padding:20px;animation:fade .15s ease}
@keyframes fade{from{opacity:0}}
.modal{background:var(--panel);border:1px solid var(--line2);border-radius:var(--r-lg);width:min(560px,100%);max-height:calc(100vh - 40px);overflow:auto;padding:20px}
.modal.wide{width:min(1180px,100%);padding:0;display:grid;grid-template-columns:1fr 340px}
.modal-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.modal-h h3{font-size:16px}
.mlist{display:grid;gap:8px}
.mopt{display:flex;gap:12px;align-items:flex-start;padding:12px;border-radius:var(--r);border:1px solid var(--line);text-align:left}
.mopt:hover{border-color:var(--line2);background:var(--panel2)}
.mopt.on{border-color:var(--accent)}
.mopt strong{display:block}
.mopt small{color:var(--muted);font-size:12.5px}
.sgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px}
.sopt{border-radius:var(--r);overflow:hidden;border:2px solid transparent;background:var(--panel2);text-align:left;padding:0}
.sopt.on{border-color:var(--accent)}
.sopt img{width:100%;aspect-ratio:3/4;object-fit:cover;display:block;background:var(--line)}
.sopt span{display:block;padding:7px 8px;font-size:12px;font-weight:600}
.stage{background:#000;display:grid;place-items:center;position:relative;min-height:420px;max-height:calc(100vh - 40px)}
.stage img,.stage video{max-width:100%;max-height:calc(100vh - 40px);display:block}
.stage .nav-arr{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;background:#000a;display:grid;place-items:center}
.stage .l{left:12px}.stage .r{right:12px}
.stage .cnt{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);background:#000a;padding:3px 10px;border-radius:999px;font-size:12px}
.detail{padding:20px;overflow-y:auto;display:flex;flex-direction:column;gap:14px;max-height:calc(100vh - 40px)}
.detail .prompt{background:var(--panel2);border-radius:var(--r);padding:12px;font-size:13px;color:#d5d9d1;white-space:pre-wrap;max-height:180px;overflow:auto}
.kv{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;font-size:12.5px}
.kv dt{color:var(--muted)}.kv dd{margin:0;font-weight:600}
.acts{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.acts .btn{justify-content:center}
.acts .full{grid-column:1/-1}
.hero-prev{border-radius:var(--r);overflow:hidden;position:relative;aspect-ratio:16/8;background:#000;margin-bottom:14px}
.hero-prev video,.hero-prev img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-prev .shade{position:absolute;inset:0}
.hero-prev .in{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;gap:6px;padding:0 6%;color:#fff}
.hero-prev h4{margin:0;font-size:22px;line-height:1.1}
.hero-prev p{font-size:12px;opacity:.9;max-width:40ch}
.hero-prev .b{align-self:inherit;background:#fff;color:#111;padding:5px 12px;border-radius:99px;font-size:11px;font-weight:700;width:max-content}
.form2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.form2 .full{grid-column:1/-1}
.form2 label{display:grid;gap:5px;font-size:12px;font-weight:600;color:var(--muted)}
.code{background:#000;border:1px solid var(--line);border-radius:var(--r);padding:12px;font:12px/1.5 ui-monospace,monospace;word-break:break-all;color:#cfe8a0;margin:12px 0}
.toasts{position:fixed;bottom:20px;right:20px;display:grid;gap:8px;z-index:80}
.toast{background:var(--panel2);border:1px solid var(--line2);padding:11px 16px;border-radius:12px;box-shadow:0 10px 30px #0008;font-weight:600;animation:up .2s ease;max-width:360px}
.toast.err{border-color:#ff7a6b66;color:#ffc2ba}
.toast.ok{border-color:#d7fa7855}
@keyframes up{from{transform:translateY(8px);opacity:0}}
.menu{position:fixed;left:calc(var(--side) + 8px);bottom:16px;background:var(--panel2);border:1px solid var(--line2);border-radius:12px;padding:6px;z-index:60;min-width:190px;box-shadow:0 10px 30px #0009}
.menu a,.menu button{display:block;width:100%;text-align:left;padding:9px 12px;border-radius:8px;font-weight:600;font-size:13px}
.menu a:hover,.menu button:hover{background:var(--panel)}
.menu .who{padding:8px 12px 10px;color:var(--muted);font-size:12px;border-bottom:1px solid var(--line);margin-bottom:4px}

/* ---------- Móvil ---------- */
@media (max-width:900px){
  .shell{grid-template-columns:minmax(0,1fr);height:auto;min-height:100vh}
  .side{overflow:visible;position:fixed;bottom:0;left:0;right:0;top:auto;flex-direction:row;height:calc(64px + env(safe-area-inset-bottom));padding:6px 8px env(safe-area-inset-bottom);border-right:0;border-top:1px solid var(--line);z-index:40;justify-content:space-around}
  .side .logo{display:none}
  .nav{width:auto;flex:1;padding:6px 2px}
  .side-foot{margin:0;width:auto;flex-direction:row}
  .main{height:auto;min-height:100vh;padding-bottom:70px}
  .top{padding:12px 16px}
  .body{grid-template-columns:minmax(0,1fr)}
  .main,.ctrl,.feed,.page{min-width:0;max-width:100vw}
  .chips{flex-wrap:wrap}
  .ctrl{border-right:0;border-bottom:1px solid var(--line);overflow:visible;padding-bottom:18px}
  .ctrl-foot{position:static;margin:14px 0 0;padding:0;background:none}
  .feed,.page{overflow:visible;padding:16px}
  .grid{grid-template-columns:repeat(2,1fr);gap:8px}
  .tgrid{grid-template-columns:repeat(2,1fr);gap:10px}
  .modal.wide{grid-template-columns:1fr}
  .stage{min-height:260px}
  .menu{left:auto;right:8px;bottom:78px}
  .toasts{bottom:80px;right:12px;left:12px}
}
@media (max-width:420px){.tgrid{grid-template-columns:1fr}}
.fx-recast .ph.a{animation:qRecast 3.4s ease-in-out infinite}
.fx-recast .tstage{animation:qFloat 6s ease-in-out infinite}
@keyframes qRecast{0%,20%{clip-path:inset(0 0 0 0);filter:none}45%{clip-path:inset(0 0 0 42%);filter:saturate(1.4)}70%,100%{clip-path:inset(0 0 0 100%)}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition:none!important}}
.card .play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:44px;height:44px;border-radius:50%;background:#000a;display:grid;place-items:center;pointer-events:none;transition:opacity .2s}
.card .play .i{width:20px;height:20px;fill:#fff;stroke:none}
.card:hover .play{opacity:0}
.card.v{background:linear-gradient(135deg,#1b1d1a,#101110)}

/* ---- acciones rápidas sobre la tarjeta ---- */
.card{cursor:pointer}
.cacts{position:absolute;top:8px;left:8px;right:8px;display:flex;gap:6px;flex-wrap:wrap;opacity:0;transform:translateY(-4px);transition:opacity .15s,transform .15s;pointer-events:none}
.card:hover .cacts,.card:focus-within .cacts,.card:focus-visible .cacts{opacity:1;transform:none;pointer-events:auto}
.cact{width:32px;height:32px;border-radius:9px;background:#000b;border:1px solid #ffffff26;color:#fff;display:grid;place-items:center;backdrop-filter:blur(6px);padding:0}
.cact:hover{background:var(--accent);color:#0c0d0c;border-color:transparent}
.cact[data-dng]:hover{background:#e0574f;color:#fff}
.cact .i{width:16px;height:16px}
@media (hover:none){.cacts{opacity:1;transform:none;pointer-events:auto}}
.cats-lbl{font-size:12px;color:var(--muted);align-self:center;margin-right:2px}
.cats .chip .ratio{margin-right:6px}

/* ---- vista previa animada de plantillas (mini escena 3D, estilo minimalista) ---- */
.art-wrap .scene{position:absolute;inset:0;opacity:0;transition:opacity .3s ease;display:grid;place-items:center;perspective:620px;pointer-events:none}
.tcard:hover .scene,.tcard:focus-visible .scene{opacity:1}
.art-wrap .tstage{position:relative;width:62%;aspect-ratio:16/10;transform-style:preserve-3d;filter:drop-shadow(0 14px 18px #0009)}
.art-wrap .ph{position:absolute;inset:0;border-radius:9px;overflow:hidden;border:1px solid #ffffff4d;background:linear-gradient(160deg,var(--c1),var(--c2));box-shadow:inset 0 0 0 1px #ffffff1a}
.art-wrap .ph i{position:absolute;display:block}
.art-wrap .ph .sky{inset:0;background:linear-gradient(#ffffff26,transparent 55%)}
.art-wrap .ph .sun{left:22%;top:20%;width:14%;aspect-ratio:1;border-radius:50%;background:#fff;opacity:.85;box-shadow:0 0 16px #fff9}
.art-wrap .ph .hill{left:-6%;right:34%;bottom:0;height:58%;background:#0b0f0ecc;clip-path:polygon(0 100%,0 52%,46% 4%,100% 74%,100% 100%)}
.art-wrap .ph .hill.b{left:30%;right:-8%;height:46%;background:#0b0f0e99;clip-path:polygon(0 100%,0 62%,52% 10%,100% 66%,100% 100%)}
.art-wrap .ph.b{transform:translateZ(-1px)}
.art-wrap .frags{position:absolute;inset:0}
.art-wrap .frag{border:0;border-radius:0;box-shadow:none}
.art-wrap .shadow{position:absolute;left:12%;right:12%;bottom:-14px;height:10px;border-radius:50%;background:#0009;filter:blur(6px)}
.art-wrap .glow{position:absolute;width:70%;aspect-ratio:1;border-radius:50%;filter:blur(20px);opacity:.6}
.art-wrap .glow.a{left:-18%;top:-24%;background:#ff3cac}
.art-wrap .glow.b{right:-18%;bottom:-24%;background:#37d0ff}
.art-wrap .haze{position:absolute;inset:-10%;background:radial-gradient(ellipse at 50% 80%,#ffffff38,transparent 65%);filter:blur(6px)}
.art-wrap .flare{position:absolute;left:-30%;top:50%;width:60%;height:3px;background:linear-gradient(90deg,transparent,#fff,transparent);box-shadow:0 0 26px 10px #ffffffb3}
.art-wrap .swipe{position:absolute;left:-60%;top:-10%;width:42%;height:120%;background:linear-gradient(90deg,#0000,#0f1413,#0f1413,#0000);border-radius:6px}
.art-wrap .scan{position:absolute;inset:0;background:repeating-linear-gradient(0deg,#ffffff1a 0 1px,transparent 1px 4px);opacity:0}
.art-wrap .stars{position:absolute;inset:0;opacity:0;background:radial-gradient(1.5px 1.5px at 20% 22%,#fff,transparent),radial-gradient(1.5px 1.5px at 62% 15%,#fff,transparent),radial-gradient(1.5px 1.5px at 80% 34%,#fff,transparent),radial-gradient(1.5px 1.5px at 38% 40%,#fff,transparent)}

.art-wrap .art,.art-wrap .scene *{animation-play-state:paused}
.tcard:hover .art-wrap .art,.tcard:hover .scene *,.tcard:focus-visible .art-wrap .art,.tcard:focus-visible .scene *{animation-play-state:running}

/* movimientos de cámara simples */
.fx-drift .tstage{animation:qDrift 6s ease-in-out infinite alternate}
.fx-pan .tstage{animation:qPan 5s ease-in-out infinite alternate}
.fx-city .tstage{animation:qCity 7s ease-in-out infinite alternate}
.fx-city .ph .sun{animation:qCityLights 2.4s ease-in-out infinite}
.fx-shine .tstage{animation:qTilt 4s ease-in-out infinite}
.fx-shine .ph.a:after{content:'';position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,#ffffff8c 50%,transparent 65%);transform:translateX(-120%);animation:qShine 2.8s ease-in-out infinite}
.fx-reel .tstage{width:34%;aspect-ratio:9/16;animation:qFloat 3.6s ease-in-out infinite}
.fx-float .tstage{animation:qFloat 3.4s ease-in-out infinite}
.fx-float .shadow{animation:qShadow 3.4s ease-in-out infinite}
.fx-orbit .tstage{animation:qOrbit 3.6s linear infinite}
.fx-crash .tstage{animation:qCrash 2.8s cubic-bezier(.7,0,.3,1) infinite}
.fx-crash .ph.b{animation:qCrashB 2.8s cubic-bezier(.7,0,.3,1) infinite}
.fx-steam .tstage{animation:qFloat 5s ease-in-out infinite}
.fx-steam .frags i{position:absolute;left:46%;bottom:58%;width:14px;height:14px;border-radius:50%;background:#fff6;filter:blur(5px);animation:qSteam 3.2s ease-out infinite}
.fx-steam .frags i:nth-child(2){left:56%;animation-delay:.7s}
.fx-steam .frags i:nth-child(3){left:40%;animation-delay:1.4s}
.fx-steam .frags i:nth-child(4){left:62%;animation-delay:2.1s}
.fx-neon .glow.a{animation:qNeonA 2.4s ease-in-out infinite}
.fx-neon .glow.b{animation:qNeonB 2.8s ease-in-out infinite}
.fx-neon .tstage{animation:qFloat 5s ease-in-out infinite}
.fx-daynight .ph.a{animation:qNightPhoto 5s ease-in-out infinite}
.fx-daynight .ph .sun{animation:qSunSet 5s ease-in-out infinite}
.fx-daynight .stars{animation:qStars 5s ease-in-out infinite}

/* desintegración y explosión: la foto se parte en piezas reales */
.fx-dust .ph.a,.fx-burst .ph.a{animation:qHidePhoto 3.2s ease-in-out infinite}
.fx-dust .frag{animation:qDustFrag 3.2s ease-in infinite;animation-delay:var(--d)}
.fx-burst .frag{animation:qBurstFrag 2.6s cubic-bezier(.2,.6,.3,1) infinite;animation-delay:var(--d)}
.fx-dust .ph.b{animation:qRevealB 3.2s ease-in-out infinite}

/* transiciones entre dos fotos */
.fx-wipe .ph.a{animation:qWipe 3.2s cubic-bezier(.6,0,.2,1) infinite}
.fx-morph .ph.a{animation:qMorph 3.4s ease-in-out infinite}
.fx-morph .ph.b{animation:qMorphB 3.4s ease-in-out infinite}
.fx-spin .tstage{animation:qSpin 3.2s cubic-bezier(.6,0,.3,1) infinite}
.fx-spin .ph.a{backface-visibility:hidden}
.fx-spin .ph.b{transform:rotateY(180deg);backface-visibility:hidden}
.fx-whip .tstage{animation:qWhip 2.6s cubic-bezier(.7,0,.3,1) infinite}
.fx-whip .ph.a{animation:qWhipA 2.6s cubic-bezier(.7,0,.3,1) infinite}
.fx-flash .flare{animation:qFlare 3s ease-in-out infinite}
.fx-flash .ph.a{animation:qFlashA 3s ease-in-out infinite}
.fx-glitch .ph.a{animation:qGlitch 2.8s steps(1,end) infinite}
.fx-glitch .scan{animation:qScan 2.8s steps(1,end) infinite}
.fx-mask .swipe{animation:qSwipe 3s cubic-bezier(.6,0,.3,1) infinite}
.fx-mask .ph.a{animation:qMaskA 3s cubic-bezier(.6,0,.3,1) infinite}
.fx-pullback .tstage{animation:qPullback 4s ease-in-out infinite}
.fx-pullback .ph.a{animation:qHideLate 4s ease-in-out infinite}
.fx-mirror .tstage{animation:qMirror 3.4s ease-in-out infinite}
.fx-mirror .ph.a{animation:qMirrorA 3.4s ease-in-out infinite}

@keyframes qDrift{from{transform:scale(1.02) rotateY(-6deg) rotateX(3deg)}to{transform:scale(1.06) rotateY(6deg) rotateX(-2deg)}}
@keyframes qPan{from{transform:translateX(-7%) scale(1.05)}to{transform:translateX(7%) scale(1.05)}}
@keyframes qCity{from{transform:perspective(600px) rotateX(9deg) translateY(4px) scale(1.02)}to{transform:perspective(600px) rotateX(3deg) translateY(-4px) scale(1.06)}}
@keyframes qCityLights{0%,100%{opacity:.35}50%{opacity:1}}
@keyframes qTilt{0%,100%{transform:rotateY(-9deg) rotateX(4deg)}50%{transform:rotateY(9deg) rotateX(-3deg)}}
@keyframes qShine{0%{transform:translateX(-120%)}55%,100%{transform:translateX(120%)}}
@keyframes qFloat{0%,100%{transform:translateY(7px) rotateX(6deg) rotateY(-4deg)}50%{transform:translateY(-9px) rotateX(-2deg) rotateY(4deg)}}
@keyframes qShadow{0%,100%{transform:scale(1);opacity:.55}50%{transform:scale(.8);opacity:.3}}
@keyframes qOrbit{from{transform:rotateY(0) rotateX(6deg)}to{transform:rotateY(360deg) rotateX(6deg)}}
@keyframes qCrash{0%{transform:scale(.72)}45%{transform:scale(1.45)}55%{transform:scale(1.5)}100%{transform:scale(.72)}}
@keyframes qCrashB{0%,48%{opacity:0}56%,100%{opacity:1}}
@keyframes qSteam{0%{opacity:0;transform:translateY(0) scale(.5)}25%{opacity:.7}100%{opacity:0;transform:translateY(-46px) translateX(8px) scale(2)}}
@keyframes qNeonA{0%,100%{opacity:.25;transform:translate(0,0)}50%{opacity:.9;transform:translate(18px,12px)}}
@keyframes qNeonB{0%,100%{opacity:.85;transform:translate(0,0)}50%{opacity:.25;transform:translate(-16px,-12px)}}
@keyframes qNightPhoto{0%,12%{filter:none}55%,72%{filter:brightness(.4) saturate(.6) hue-rotate(200deg)}100%{filter:none}}
@keyframes qSunSet{0%{transform:translate(0,0);opacity:.9}50%{transform:translate(150%,120%);opacity:0}100%{transform:translate(0,0);opacity:.9}}
@keyframes qStars{0%,25%{opacity:0}55%,75%{opacity:.9}100%{opacity:0}}
@keyframes qHidePhoto{0%,18%{opacity:1}28%,100%{opacity:0}}
@keyframes qRevealB{0%,72%{opacity:0}92%,100%{opacity:1}}
@keyframes qDustFrag{0%,18%{opacity:0;transform:none;filter:none}30%{opacity:1}75%{opacity:0;transform:translate(calc(var(--dx) * 2.4),calc(var(--dy) * .5)) rotate(12deg) scale(.5);filter:blur(2px)}100%{opacity:0}}
@keyframes qBurstFrag{0%,15%{opacity:0;transform:none}25%{opacity:1;transform:none}70%{opacity:0;transform:translate(calc(var(--dx) * 2.6),calc(var(--dy) * 2.6)) rotate(25deg) scale(.4)}100%{opacity:0}}
@keyframes qWipe{0%,20%{clip-path:inset(0 0 0 0)}70%,100%{clip-path:inset(0 0 0 100%)}}
@keyframes qMorph{0%,15%{opacity:1;filter:none;transform:none}50%{opacity:.25;filter:blur(7px);transform:scale(1.06) skewX(6deg)}80%,100%{opacity:0;filter:blur(10px)}}
@keyframes qMorphB{0%,25%{filter:blur(8px);transform:scale(1.06) skewX(-6deg)}70%,100%{filter:none;transform:none}}
@keyframes qSpin{0%,12%{transform:rotateY(0) rotateX(5deg)}60%,100%{transform:rotateY(180deg) rotateX(5deg)}}
@keyframes qWhip{0%,25%{transform:translateX(0)}45%{transform:translateX(-45%)}55%{transform:translateX(45%)}75%,100%{transform:translateX(0)}}
@keyframes qWhipA{0%,42%{opacity:1;filter:none}46%{opacity:.4;filter:blur(9px)}54%{opacity:0;filter:blur(9px)}100%{opacity:0}}
@keyframes qFlare{0%,20%{transform:translateX(0) rotate(-12deg);opacity:0}45%{opacity:1}55%{transform:translateX(220%) rotate(-12deg);opacity:1}75%,100%{transform:translateX(320%);opacity:0}}
@keyframes qFlashA{0%,45%{opacity:1}55%,100%{opacity:0}}
@keyframes qGlitch{0%,30%{opacity:1;transform:none;filter:none}35%{transform:translateX(-5px);filter:drop-shadow(4px 0 #f0f) drop-shadow(-4px 0 #0ff)}40%{transform:translateX(6px) skewX(4deg);filter:drop-shadow(-5px 0 #f0f)}45%{opacity:1;transform:none}50%,100%{opacity:0}}
@keyframes qScan{0%,32%{opacity:0}34%,48%{opacity:.8}50%,100%{opacity:0}}
@keyframes qSwipe{0%,15%{transform:translateX(0)}60%,100%{transform:translateX(330%)}}
@keyframes qMaskA{0%,38%{opacity:1}42%,100%{opacity:0}}
@keyframes qPullback{0%,10%{transform:scale(1.25) translateY(6%)}45%{transform:scale(.62) translateY(-16%) rotateX(22deg)}85%,100%{transform:scale(1.25) translateY(6%)}}
@keyframes qHideLate{0%,45%{opacity:1}60%,100%{opacity:0}}
@keyframes qMirror{0%,12%{transform:scale(1)}50%{transform:scale(1.6)}88%,100%{transform:scale(1)}}
@keyframes qMirrorA{0%,35%{opacity:1;filter:none}55%{opacity:.2;filter:blur(6px) saturate(1.6)}70%,100%{opacity:0}}
.fx-recast .ph.a{animation:qRecast 3.4s ease-in-out infinite}
.fx-recast .tstage{animation:qFloat 6s ease-in-out infinite}
@keyframes qRecast{0%,20%{clip-path:inset(0 0 0 0);filter:none}45%{clip-path:inset(0 0 0 42%);filter:saturate(1.4)}70%,100%{clip-path:inset(0 0 0 100%)}}
@media (prefers-reduced-motion:reduce){.art-wrap .art,.art-wrap .scene *{animation:none!important}}

/* etiquetas del menú de la tarjeta */
.cact{position:relative}
.cact .tip{position:absolute;top:calc(100% + 6px);left:50%;transform:translateX(-50%) translateY(-3px);background:#000d;color:#fff;font-size:11px;font-style:normal;white-space:nowrap;padding:4px 8px;border-radius:7px;border:1px solid #ffffff26;opacity:0;pointer-events:none;transition:opacity .12s,transform .12s;z-index:5}
.cact:hover .tip,.cact:focus-visible .tip{opacity:1;transform:translateX(-50%)}
.cacts>*:nth-last-child(-n+2) .tip{left:auto;right:0;transform:translateY(-3px)}
.cacts>*:nth-last-child(-n+2):hover .tip{transform:none}
/* selector de imagen: creaciones, Biblioteca de Medios o archivo */
.modal.wide2{width:min(900px,94vw);padding:16px}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:8px;max-height:52vh;overflow:auto;padding:2px;margin-top:10px}
.pgrid .pitem{padding:0;border-radius:10px;overflow:hidden;border:1px solid var(--line);background:var(--panel2);aspect-ratio:1;width:100%}
.pgrid .pitem img{width:100%;height:100%;object-fit:cover;display:block}
.pgrid .pitem:hover{border-color:var(--accent)}

/* video de referencia en el panel */
.slot.vid video{width:100%;height:100%;object-fit:cover;display:block}
.slot.vid .play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:34px;height:34px;border-radius:50%;background:#000a;display:grid;place-items:center;pointer-events:none}
.slot.vid .play .i{width:15px;height:15px;fill:#fff;stroke:none}
.slot.vid .secs{position:absolute;left:8px;bottom:8px;background:#000b;font-size:11px;font-weight:700;padding:2px 7px;border-radius:7px}

/* ---------------- asistente ---------------- */
.body.full .chat{display:flex;flex-direction:column;height:100%;max-width:820px;width:100%;margin:0 auto;padding:0 20px}
.chat-log{flex:1;overflow:auto;padding:24px 4px 12px;display:flex;flex-direction:column;gap:18px}
.chat-hello{margin:auto;text-align:center;max-width:520px;padding:24px 0}
.chat-hello h2{font-size:26px;margin:14px 0 6px;letter-spacing:-.02em}
.chat-hello p{color:var(--muted);margin:0 0 20px}
.chips-row{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.chips-row .chip{white-space:normal;text-align:left}
.msg{display:flex;gap:10px;align-items:flex-start}
.msg.me{justify-content:flex-end}
.msg.me p{background:var(--panel2);border:1px solid var(--line);padding:10px 14px;border-radius:16px 16px 4px 16px;margin:0;max-width:78%;white-space:pre-wrap}
.msg.bot .who{flex-shrink:0;margin-top:2px}
.msg.bot .bubble{max-width:86%;min-width:0}
.msg.bot .bubble > p{margin:4px 0 0;line-height:1.55}
.typing{display:flex;gap:5px;padding:14px 4px}
.typing i{width:7px;height:7px;border-radius:50%;background:var(--muted);animation:qTyping 1s infinite ease-in-out}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes qTyping{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
.prop{margin-top:12px;border:1px solid var(--line2);border-radius:16px;padding:14px;background:var(--panel)}
.prop-h{display:flex;gap:10px;align-items:center}
.prop-h strong{display:block;font-size:15px}
.prop-h small{color:var(--muted);font-size:12px}
.prop-k{width:34px;height:34px;border-radius:10px;background:var(--panel2);display:grid;place-items:center;color:var(--accent);flex-shrink:0}
.prop-why{color:var(--muted);font-size:14px;margin:10px 0 0}
.prop-need{font-size:13px;margin:8px 0 0;color:var(--accent)}
.prop-acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.prop-job{margin-top:12px;max-width:320px}
.chat-in{display:flex;gap:8px;align-items:flex-end;background:var(--panel);border:1px solid var(--line2);border-radius:18px;padding:8px 8px 8px 16px;margin-top:6px}
.chat-in:focus-within{border-color:var(--accent)}
.chat-in textarea{flex:1;background:none;border:0;color:var(--text);resize:none;font:inherit;font-size:15px;line-height:1.45;padding:8px 0;max-height:160px;outline:none}
.chat-in .send{width:42px;height:42px;border-radius:12px;background:var(--accent);color:#0c0d0c;display:grid;place-items:center;border:0;flex-shrink:0}
.chat-in .send:disabled{opacity:.4}
.chat-note{color:var(--muted);font-size:12px;text-align:center;margin:10px 0 16px}
.linkish{background:none;border:0;color:var(--accent);text-decoration:underline;font-size:12px;padding:0;cursor:pointer}
/* perrito robot */
.pup .pup-head{fill:#2a2e32;stroke:#454b50;stroke-width:1.5}
.pup .pup-face{fill:#0f1112}
.pup .pup-eye{fill:var(--accent);transform-box:fill-box;transform-origin:center;animation:qBlink 5s infinite}
.pup .pup-ear{fill:#3a4046}
.pup .pup-ant{stroke:#454b50;stroke-width:3;stroke-linecap:round}
.pup .pup-led{fill:var(--accent);animation:qLed 2.4s infinite ease-in-out}
.pup .pup-mouth{fill:none;stroke:var(--accent);stroke-width:2.5;stroke-linecap:round;opacity:.8}
.pup .pup-ear.l{transform-origin:30px 46px;animation:qEar 6s infinite ease-in-out}
@keyframes qBlink{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.1)}}
@keyframes qLed{0%,100%{opacity:.45}50%{opacity:1}}
@keyframes qEar{0%,85%,100%{transform:rotate(0)}90%{transform:rotate(-12deg)}95%{transform:rotate(4deg)}}
@media (prefers-reduced-motion:reduce){.pup *{animation:none!important}}
@media (max-width:760px){.body.full .chat{padding:0 12px}.msg.bot .bubble,.msg.me p{max-width:100%}}
.body.full > .chat{height:calc(100vh - 70px);height:calc(100dvh - 70px)}
.chat-log{min-height:0}
.prop-job{max-width:240px}
@media (max-width:860px){.body.full > .chat{height:calc(100dvh - 70px - 64px)}}
.chat-in textarea{min-height:0!important;height:40px;border:0!important;background:transparent!important;box-shadow:none!important;padding:9px 0!important;border-radius:0!important}

/* ayudante siempre disponible en el Studio clásico */
.asst-fab{position:fixed;right:22px;bottom:22px;z-index:60;width:60px;height:60px;border-radius:20px;border:1px solid var(--line2);background:var(--panel);box-shadow:0 12px 30px #0009,0 0 0 6px #d4f36b12;display:grid;place-items:center;padding:4px;cursor:pointer;transition:transform .2s}
.asst-fab:hover{transform:translateY(-3px) rotate(-4deg)}
.asst-fab.on{box-shadow:0 12px 30px #0009,0 0 0 2px var(--accent)}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(440px,100vw);z-index:70;background:var(--bg);border-left:1px solid var(--line2);box-shadow:-24px 0 60px #0009;display:flex;flex-direction:column;animation:qDrawer .22s ease-out}
@keyframes qDrawer{from{transform:translateX(24px);opacity:0}to{transform:none;opacity:1}}
.drawer-h{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line)}
.drawer-h strong{font-size:15px}
.drawer .chat{flex:1;min-height:0;display:flex;flex-direction:column;padding:0 14px;height:auto}
.drawer .chat-log{flex:1;overflow:auto}
.drawer .msg.bot .bubble,.drawer .msg.me p{max-width:100%}
.drawer .chat-hello h2{font-size:21px}
@media (max-width:860px){.asst-fab{bottom:80px;right:14px;width:54px;height:54px}.drawer{width:100vw}}


/* cerebro de Bit */
.brain-wrap{position:relative;display:flex;justify-content:center;margin-top:8px}
.brain-btn{background:var(--panel);border:1px solid var(--line2);border-radius:999px;padding:7px 14px;font-size:13px;color:var(--text);cursor:pointer}
.brain-btn b{color:var(--accent)}
.brain-btn span{color:var(--muted)}
.brain-btn:hover{border-color:var(--accent)}
.brain-menu{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);width:min(380px,92vw);background:var(--panel);border:1px solid var(--line2);border-radius:18px;padding:10px;box-shadow:0 24px 60px #000b;z-index:20}
.brain-menu > p{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:4px 8px 8px}
.brain-opt{display:grid;grid-template-columns:1fr auto;gap:2px 10px;width:100%;text-align:left;background:none;border:1px solid transparent;border-radius:12px;padding:10px 12px;color:var(--text);cursor:pointer}
.brain-opt:hover{background:var(--panel2)}
.brain-opt.on{border-color:var(--accent);background:#d4f36b0d}
.brain-opt strong{font-size:15px}
.brain-opt small{grid-column:1/2;color:var(--muted);font-size:12.5px}
.brain-opt em{grid-row:1/3;grid-column:2;align-self:center;font-style:normal;font-size:12px;font-weight:700;color:var(--accent);white-space:nowrap}
.msg-cost{display:block;color:var(--muted);font-size:11.5px;margin-top:8px}

/* adjuntos del chat */
.chat-in .chat-plus{width:42px;height:42px;border-radius:12px;border:1px solid var(--line2);background:var(--panel2);color:var(--text);display:grid;place-items:center;flex-shrink:0;cursor:pointer;transition:border-color .15s,color .15s}
.chat-in .chat-plus:hover{border-color:var(--accent);color:var(--accent)}
.chat-in .chat-plus .i{width:18px;height:18px}
.chat-in{padding-left:8px!important}
.chat-files{display:flex;flex-wrap:wrap;gap:8px;padding:10px 4px 2px}
.chat-files[hidden]{display:none}
.cf{position:relative;width:58px;height:58px;border-radius:12px;overflow:hidden;border:1px solid var(--line2);background:var(--panel2);flex-shrink:0}
.cf img,.cf video{width:100%;height:100%;object-fit:cover;display:block}
.cf-pdf{position:absolute;inset:0;display:grid;place-items:center;font-size:12px;font-weight:800;color:#ff8a80;letter-spacing:.06em}
.cf.busy img,.cf.busy video{opacity:.45}
.cf-spin{position:absolute;left:50%;top:50%;width:18px;height:18px;margin:-9px 0 0 -9px;border-radius:50%;border:2px solid #fff4;border-top-color:var(--accent);animation:qSpinCf .8s linear infinite}
@keyframes qSpinCf{to{transform:rotate(360deg)}}
.cf-x{position:absolute;top:3px;right:3px;width:20px;height:20px;border-radius:50%;background:#000c;border:0;color:#fff;display:grid;place-items:center;cursor:pointer;padding:0}
.cf-x .i{width:11px;height:11px}
.msg.me{flex-direction:column;align-items:flex-end;gap:6px}
.me-files{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.me-files .cf{width:72px;height:72px}

/* ---------- Motion graphics ---------- */
.page.mg{padding:22px 24px 90px}
.mg-hero{display:flex;gap:24px;align-items:flex-end;justify-content:space-between;padding:24px;border:1px solid var(--line);border-radius:var(--r-lg);margin-bottom:18px;background:radial-gradient(120% 140% at 0% 0%,#d7fa7814,transparent 55%),radial-gradient(90% 120% at 100% 100%,#6ee7ff10,transparent 60%),var(--panel)}
.mg-hero h2{font-size:clamp(20px,2.4vw,28px);line-height:1.15;margin:6px 0 8px;letter-spacing:-.02em;max-width:30ch;text-wrap:balance}
.mg-hero p{color:var(--muted);max-width:62ch;margin:0}
.mg-kicker{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
.mg-price{min-width:220px;text-align:right;display:grid;gap:4px}
.mg-price b{font-size:22px;color:var(--text)}
.mg-price small{color:var(--muted);font-size:12px;line-height:1.4}
.mg-tabs{margin-bottom:14px}
.mg-lead{color:var(--muted);margin:0 0 14px}
.mg-h3{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:22px 0 10px}
.mg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}
.mg-grid.sty{grid-template-columns:repeat(auto-fill,minmax(170px,1fr))}
.mg-card{display:flex;flex-direction:column;gap:3px;text-align:left;padding:8px 8px 12px;border-radius:var(--r-lg);background:var(--panel);border:1px solid var(--line);transition:transform .2s,border-color .2s;min-width:0}
.mg-card:hover{transform:translateY(-2px);border-color:var(--line2)}
.mg-card.on{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.mg-card strong{font-size:14px;padding:6px 4px 0}
.mg-card small{color:var(--muted);font-size:12px;padding:0 4px;line-height:1.4}
.mg-card em{font-style:normal;color:var(--dim);font-size:11px;padding:2px 4px 0}
.mg-pv{position:relative;border-radius:12px;overflow:hidden;background:#000;display:block;width:100%;padding:0;border:0}
.mg-pv canvas{display:block;width:100%;height:100%}
.mg-pv.r916{aspect-ratio:4/5}.mg-pv.r45{aspect-ratio:4/5}.mg-pv.r11{aspect-ratio:4/5}.mg-pv.r169{aspect-ratio:4/5}
.mg-fmt{position:absolute;left:8px;bottom:8px;display:flex;align-items:center;gap:6px;font-size:11px;font-weight:700;padding:3px 8px;border-radius:999px;background:#000b;color:#fff;backdrop-filter:blur(4px)}
.mg-st{position:absolute;top:8px;left:8px;font-size:11px;font-weight:800;padding:3px 8px;border-radius:999px;background:var(--accent);color:var(--accent-ink)}
.mg-st.failed{background:var(--danger);color:#fff}
.mg-mine-acts{display:flex;justify-content:space-between;align-items:center;padding:6px 4px 0}
.page.mg.ed{padding:0;overflow:hidden}
.mg-ed{display:grid;grid-template-columns:var(--ctrl) minmax(0,1fr);height:100%;min-height:0}
.mg-ed .mg-side{overflow-y:auto}
.mg-side{padding-top:14px}
.mg-back{color:var(--muted);font-weight:700;font-size:13px;margin-bottom:10px}
.mg-back:hover{color:var(--text)}
.mg-tt{margin-bottom:14px}
.mg-tt strong{display:block;font-size:17px}
.mg-tt span{color:var(--muted);font-size:13px}
.mg-live{font-size:12px;color:var(--accent);background:#d7fa780f;border:1px solid #d7fa7833;border-radius:10px;padding:8px 10px;margin:0 0 12px}
.mg-f{margin-bottom:14px}
.mg-f textarea{min-height:96px}
.mg-f .req{color:var(--accent)}
.mg-slot{height:110px}
.mg-slot img{object-fit:contain!important;background:repeating-conic-gradient(#222 0 25%,#1a1a1a 0 50%) 0 0/16px 16px}
.mg-slot .hint{width:100%;height:100%;justify-content:center}
.mg-color>div{display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:8px 10px}
.mg-color input[type=color]{width:34px;height:34px;border:0;padding:0;background:none;border-radius:8px;cursor:pointer}
.mg-color span{flex:1;font-size:13px;color:var(--muted)}
.mg-brand{border:1px solid var(--line);border-radius:var(--r);padding:10px 12px;margin:4px 0 16px;background:#ffffff04}
.mg-brand summary{cursor:pointer;font-weight:700;font-size:13px;color:var(--muted)}
.mg-brand[open] summary{margin-bottom:12px;color:var(--text)}
.mg-ico{width:44px!important;height:44px!important;background:#000!important}
.mg-ico canvas{width:100%;height:100%;display:block}
.pick:disabled{opacity:.75;cursor:default}
.chip:disabled{opacity:.5;cursor:default}
.mg-again{width:100%;justify-content:center}
.mg-stagewrap{padding:22px 24px 60px;display:flex;flex-direction:column;align-items:center;gap:14px;min-width:0;overflow-y:auto;background:radial-gradient(80% 60% at 50% 0%,#ffffff08,transparent)}
.mg-stagewrap .banner{width:min(100%,720px)}
.mg-frame{position:relative;flex-shrink:0;width:auto;height:min(68vh,760px);max-width:100%;border-radius:16px;overflow:hidden;background:#000;box-shadow:0 30px 80px -30px #000,0 0 0 1px var(--line2)}
.mg-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.mg-frame.demo canvas{width:100%;height:100%;display:block}
.mg-demo-tag{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);font-size:11px;font-weight:700;background:#000c;color:#fff;border-radius:999px;padding:4px 10px;white-space:nowrap}
.mg-err{position:absolute;inset:0;background:#0d0f0ee6;display:grid;place-content:center;justify-items:center;gap:8px;padding:24px;text-align:center}
.mg-err[hidden]{display:none}
.mg-err span{color:var(--muted);font-size:12px;max-width:40ch}
.mg-wait{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:12px;text-align:center;padding:24px;background:radial-gradient(circle at 50% 40%,#d7fa7818,transparent 60%),#0b0d0c}
.mg-wait strong{font-size:16px}
.mg-wait span{color:var(--muted);font-size:12px;max-width:34ch}
.mg-orbit{width:84px;height:84px;position:relative;animation:mgspin 2.4s linear infinite}
.mg-orbit i{position:absolute;width:16px;height:16px;border-radius:50%;background:var(--accent);left:34px;top:0}
.mg-orbit i:nth-child(2){background:#6ee7ff;transform:rotate(120deg);transform-origin:8px 42px}
.mg-orbit i:nth-child(3){background:#b69cff;transform:rotate(240deg);transform-origin:8px 42px}
@keyframes mgspin{to{transform:rotate(360deg)}}
.mg-bar{display:flex;align-items:center;gap:12px;width:min(100%,560px)}
.mg-bar input{flex:1;accent-color:var(--accent)}
.mg-bar span{font-variant-numeric:tabular-nums;color:var(--muted);font-size:12px;min-width:78px;text-align:right}
.mg-play{width:40px;height:40px;border-radius:50%;background:var(--accent);color:var(--accent-ink);font-weight:900;font-size:13px;flex-shrink:0}
.mg-acts{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.mg-prog{width:min(100%,420px);height:30px;border-radius:999px;background:var(--panel2);position:relative;overflow:hidden;display:grid;place-items:center}
.mg-prog[hidden]{display:none}
.mg-prog i{position:absolute;left:0;top:0;bottom:0;width:0;background:#d7fa7840;transition:width .2s}
.mg-prog span{position:relative;font-size:12px;font-weight:700}
.mg-notes{width:min(100%,560px);background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:10px 12px;font-size:13px;color:var(--muted)}
.mg-notes b{color:var(--text)}
.mg-change{width:min(100%,560px)}
.mg-change textarea{min-height:80px;margin-bottom:10px}
.modal.mg-wide{width:min(1100px,100%)}
.mg-modal{max-height:70vh;overflow:auto}
@media (max-width:900px){
  .mg-hero{flex-direction:column;align-items:flex-start}
  .mg-price{text-align:left}
  .mg-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .mg-grid.sty{grid-template-columns:repeat(2,minmax(0,1fr))}
  .page.mg.ed{overflow:visible}
  .mg-ed{grid-template-columns:minmax(0,1fr);height:auto}
  .mg-ed .mg-side{overflow:visible}
  .mg-frame.demo{max-height:34vh}
  .mg-stagewrap{order:-1;padding:14px 12px 20px;overflow:visible}
  .mg-frame{height:auto;width:100%;max-height:62vh}
  .mg-frame[style*="1080 / 1920"]{width:auto;height:62vh}
  .page.mg{padding:16px 16px 90px}
}
.mg-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.mg-col{display:flex;align-items:center;gap:8px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:7px 8px;min-width:0;cursor:pointer}
.mg-col input[type=color]{width:30px;height:30px;border:0;padding:0;background:none;border-radius:8px;cursor:pointer;flex-shrink:0}
.mg-col span{display:flex;flex-direction:column;min-width:0}
.mg-col b{font-size:11px;color:var(--muted);font-weight:700}
.mg-hex{width:100%;background:none;border:0;color:var(--text);font:600 12px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;padding:0;outline:0;text-transform:uppercase}
.mg-lint{width:min(100%,560px);display:grid;gap:6px;justify-items:start;padding:12px 14px;border-radius:12px;border:1px solid #ffb86b55;background:#ffb86b12;color:#ffd9b0}
.mg-lint[hidden]{display:none}
.mg-lint span{font-size:13px;color:var(--muted)}
.mg-cancel{margin-top:6px}.mg-cancel[hidden]{display:none}
.mg-fonts{display:grid;gap:8px}
.mg-font{display:grid;gap:6px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:9px 10px}
.mg-font b{font-size:11px;color:var(--muted);font-weight:700}
.mg-font select{width:100%;background:var(--panel2);color:var(--text);border:1px solid var(--line2);border-radius:9px;padding:8px 10px;font:inherit;font-size:13px}
.mg-fontcustom[hidden]{display:none}
.mg-check{display:flex;align-items:center;gap:8px;margin-top:12px;font-size:13px;font-weight:600;color:var(--text);cursor:pointer}
.mg-check input{accent-color:var(--accent);width:16px;height:16px}
.mg-snd{width:40px;height:40px;border-radius:50%;background:var(--panel2);border:1px solid var(--line2);font-size:17px;flex-shrink:0}
.mg-snd[hidden]{display:none}
#mgdurhint b{color:var(--accent)}
.mg-songbtn{width:100%;justify-content:center}
.mg-song{display:grid;gap:10px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px}
.mg-song b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mg-song label{display:grid;gap:6px;font-size:12px;color:var(--muted);font-weight:600}
.mg-song .mg-check{display:flex;color:var(--text)}
/* 0.78 · Copia este estilo: video de referencia */
.mg-ref{display:flex;align-items:center;gap:12px;width:100%;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px;margin-bottom:14px;text-align:left;color:var(--text)}
.mg-ref.empty{border-style:dashed;border-color:var(--line2);cursor:pointer;transition:border-color .2s,background .2s}
.mg-ref.empty:hover{border-color:var(--accent);background:var(--panel2)}
.mg-ref div,.mg-ref>span:last-child{display:grid;gap:3px;min-width:0;flex:1}
.mg-ref b{font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mg-ref.empty b{white-space:normal}
.mg-ref small{font-size:12px;color:var(--muted);line-height:1.4}
.mg-ref video{width:54px;height:72px;object-fit:cover;border-radius:8px;background:#000;flex-shrink:0}
.mg-refic{font-size:24px;width:44px;height:44px;border-radius:10px;display:grid;place-items:center;background:var(--panel2);flex-shrink:0}
.mg-refbar{display:block;height:4px;border-radius:4px;background:var(--line2);overflow:hidden;margin-top:6px}
.mg-refbar i{display:block;height:100%;background:var(--accent);transition:width .3s}
.mg-song input[type=range]{accent-color:var(--accent)}
.mg-num{width:110px;padding:8px 10px}
.mg-cols.four{grid-template-columns:repeat(2,minmax(0,1fr))}
.mg-paste{display:grid;gap:4px;margin-bottom:8px}
.mg-paste small{font-size:11px;color:var(--dim)}
.mg-kits{display:flex;flex-wrap:wrap;gap:6px}
.mg-kit{display:inline-flex;align-items:center;border:1px solid var(--line2);border-radius:10px;background:var(--panel);overflow:hidden}
.mg-kit > button:first-child{display:flex;align-items:center;gap:6px;padding:7px 8px 7px 10px;font-size:12px;font-weight:700}
.mg-kit i{width:12px;height:12px;border-radius:50%;border:1px solid #0003;margin-right:-3px}
.mg-kit i:nth-child(3){margin-right:4px}
.mg-kit .x{width:24px;height:28px}
.mg-pack{display:grid;gap:6px;margin-top:12px;font-size:12px;color:var(--muted);font-weight:600}
.mg-pack select{background:var(--panel2);color:var(--text);border:1px solid var(--line2);border-radius:9px;padding:8px 10px;font:inherit;font-size:13px}
.seg button{white-space:normal;line-height:1.2}
/* Bit como agente */
.chat-top{display:flex;justify-content:flex-end;padding:6px 14px 0}
.ask{margin-top:8px}
.ask-q{font-weight:700;margin:0 0 8px}
.ask .chips-row{display:flex;flex-wrap:wrap;gap:6px}
.chip.ghost{background:transparent;border-style:dashed}
.chip[disabled]{opacity:.5;pointer-events:none}
.prop-sum{margin:8px 0 4px;padding-left:18px;font-size:13px;line-height:1.45}
.prop-sum li{margin:2px 0}
.prop-tech{margin:6px 0;font-size:12px;color:var(--muted)}
.prop-tech summary{cursor:pointer}
.prop-tech p{margin:6px 0 0;padding:8px 10px;border-radius:8px;background:var(--panel);border:1px solid var(--line);white-space:pre-wrap}
.prop-next{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:8px}
.prop-next small{color:var(--muted);margin-right:4px}
.msg-read{display:block;color:var(--muted);font-size:12px;margin:2px 0 6px}
#prompt.flash{box-shadow:0 0 0 3px var(--accent);transition:box-shadow .3s}
/* selector de estilos (Motion) */
.modal.mg-picker{width:min(980px,100%);padding:0;display:flex;flex-direction:column;max-height:min(86vh,860px);overflow:hidden}
.mgp-h{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:18px 20px 10px}
.mgp-h h3{font-size:18px;margin:0 0 3px}
.mgp-h small{color:var(--muted);font-size:12px}
.mgp-h small b{color:var(--text)}
.mgp-h .x{flex-shrink:0;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;font-size:18px}
.mgp-cats{display:flex;gap:6px;padding:0 20px 12px;overflow-x:auto;scrollbar-width:none;border-bottom:1px solid var(--line)}
.mgp-cats .chip{white-space:nowrap;flex-shrink:0}
.mgp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;padding:16px 20px 22px;overflow:auto}
.mgp-card{display:flex;flex-direction:column;gap:3px;text-align:left;padding:0;background:none;border:0;color:var(--text);cursor:pointer}
.mgp-pv{position:relative;aspect-ratio:4/5;border-radius:12px;overflow:hidden;border:2px solid var(--line);background:#111;transition:transform .15s,border-color .15s}
.mgp-pv canvas{width:100%;height:100%;display:block}
.mgp-card:hover .mgp-pv{transform:translateY(-2px);border-color:var(--line2)}
.mgp-card.on .mgp-pv{border-color:var(--accent);box-shadow:0 0 0 3px #d7fa7826}
.mgp-ok{position:absolute;top:8px;right:8px;width:24px;height:24px;border-radius:50%;background:var(--accent);color:#0a0d18;font-weight:800;font-size:13px;display:grid;place-items:center}
.mgp-card strong{font-size:13px;margin-top:6px;line-height:1.25}
.mgp-card small{font-size:11px;color:var(--muted);line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
@media (max-width:600px){.mgp-grid{grid-template-columns:repeat(2,1fr);gap:10px;padding:12px 14px 18px}.mgp-h,.mgp-cats{padding-left:14px;padding-right:14px}}
/* volver al inicio + pestañas de video en una línea */
.home-btn{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 12px 0 10px;border-radius:999px;border:1px solid var(--line2);color:var(--muted);font-size:13px;font-weight:600;text-decoration:none;flex-shrink:0}
.home-btn:hover{color:var(--text);border-color:var(--text)}
@media (max-width:760px){.home-btn span{display:none}.home-btn{width:34px;padding:0;justify-content:center}}
.seg.seg4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.seg.seg4 button{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12.5px;padding:9px 4px}
/* tipografías de marca */
.mg-fonts{grid-template-columns:1fr 1fr}
.mg-fslot{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:0;text-align:left;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:10px 12px;color:var(--text);cursor:pointer;transition:border-color .15s}
.mg-fslot:hover{border-color:var(--accent)}
.mg-fslot small{font-size:11px;color:var(--muted);font-weight:700}
.mg-fslot span{font-size:21px;line-height:1.25;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mg-fslot em{font-style:normal;font-size:11.5px;color:var(--accent);font-weight:700}
.mgf-body{overflow:auto;padding:16px 20px 22px;min-height:260px}
.mgf-up{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.mgf-up span{font-size:12px;color:var(--muted);flex:1;min-width:200px}
.mgf-list{display:grid;gap:8px}
.mgf-row{display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:6px 8px 6px 6px}
.mgf-row.on{border-color:var(--accent)}
.mgf-pick{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:8px 10px;background:none;border:0;color:var(--text);text-align:left;cursor:pointer;border-radius:9px}
.mgf-pick:hover{background:var(--panel2)}
.mgf-pv{font-size:28px;line-height:1.3;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mgf-pick small{font-size:11.5px;color:var(--muted)}
.mgf-sc{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);white-space:nowrap;cursor:pointer}
.mgf-empty{color:var(--muted);font-size:13px;padding:10px 2px}
.mgf-search{position:sticky;top:-16px;background:var(--panel);padding:2px 0 10px;z-index:2}
.mgf-search .inp{width:100%}
.mgf-cats{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.mgf-res{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;margin-top:6px}
.mgf-g{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:0;padding:14px;background:var(--panel2);border:1px solid var(--line);border-radius:12px;color:var(--text);cursor:pointer;text-align:left}
.mgf-g:hover{border-color:var(--line2)}
.mgf-g.on{border-color:var(--accent)}
.mgf-g span{font-size:26px;line-height:1.3;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mgf-g small{font-size:11.5px;color:var(--muted)}
@media (max-width:600px){.mg-fonts{grid-template-columns:1fr}.mgf-body{padding:12px 14px 18px}.mgf-res{grid-template-columns:1fr 1fr}.mgf-g span{font-size:20px}}
/* ---------- Marcas ---------- */
.br-sel{position:relative;margin-right:10px}
.br-btn{display:flex;align-items:center;gap:8px;height:34px;padding:0 12px;border-radius:999px;border:1px solid var(--line2);background:var(--panel);color:var(--text);font-size:13px;font-weight:600;max-width:220px}
.br-btn .br-lbl{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.br-dots{display:inline-flex;flex-shrink:0}
.br-dots i{width:12px;height:12px;border-radius:50%;margin-left:-4px;box-shadow:0 0 0 1.5px var(--panel)}
.br-dots i:first-child{margin-left:0}
.br-dots.big i{width:22px;height:22px;margin-left:-6px}
.br-menu{position:fixed;z-index:200;width:260px;background:var(--panel);border:1px solid var(--line2);border-radius:14px;padding:8px;box-shadow:0 20px 50px #0008}
.br-menu p{font-size:11px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.06em;margin:4px 8px 6px}
.br-menu button{display:flex;align-items:center;gap:10px;width:100%;padding:9px 10px;border-radius:9px;background:none;border:0;color:var(--text);font-size:13.5px;text-align:left;cursor:pointer}
.br-menu button:hover,.br-menu button.on{background:var(--panel2)}
.br-menu button.on::after{content:"✓";margin-left:auto;color:var(--accent)}
.br-menu hr{border:0;border-top:1px solid var(--line);margin:6px 0}
.br-page{display:grid;grid-template-columns:250px 1fr;gap:20px;align-items:start}
.br-list{position:sticky;top:0;display:flex;flex-direction:column;gap:6px;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:12px}
.br-list-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.br-list-h .btn{padding:6px 10px;font-size:12.5px}
.br-item{display:flex;align-items:center;gap:10px;padding:10px;border-radius:10px;background:none;border:1px solid transparent;color:var(--text);text-align:left;cursor:pointer;font-size:14px}
.br-item:hover{background:var(--panel2)}
.br-item.on{border-color:var(--accent);background:var(--panel2)}
.br-item em{margin-left:auto;font-style:normal;font-size:10.5px;color:var(--accent);font-weight:700}
.br-imp{margin-top:10px;padding-top:12px;border-top:1px solid var(--line)}
.br-imp p{font-size:12px;color:var(--muted);margin:0 0 8px}
.br-imp .btn{width:100%}
.br-ed{display:flex;flex-direction:column;gap:14px;min-width:0}
.br-empty{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:28px}
.br-empty h2{margin:0 0 8px}
.br-empty p{color:var(--muted);max-width:560px}
.br-ed-h{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:space-between}
.br-name{font:inherit;font-size:24px;font-weight:800;background:none;border:0;border-bottom:1px dashed var(--line2);color:var(--text);padding:4px 2px;min-width:200px;flex:1}
.br-on{font-size:13px;color:var(--accent);font-weight:700;align-self:center}
.br-sec{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:16px}
.br-sec h3{font-size:14px;margin:0 0 10px}
.br-sec h3 small{font-weight:500;color:var(--muted);font-size:12px}
.br-2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.br-2 label,.st-f label.lbl{display:flex;flex-direction:column;gap:6px;font-size:12px;color:var(--muted)}
.br-2 select,.br-2 .inp{width:100%}
.br-2 select{background:var(--panel2);color:var(--text);border:1px solid var(--line2);border-radius:9px;padding:9px 10px;font:inherit;font-size:13px}
.br-sec textarea.inp{width:100%;resize:vertical}
.br-logos{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}
.br-logo{position:relative;width:160px;height:90px;border-radius:12px;background:#fff;border:1px solid var(--line);display:grid;place-items:center;overflow:hidden}
.br-logo.dark{background:#15171a}
.br-logo img{max-width:85%;max-height:75%;object-fit:contain}
.br-logo .x,.br-photo .x{position:absolute;top:5px;right:5px;background:#000a;color:#fff;border-radius:50%;width:24px;height:24px;display:grid;place-items:center}
.br-up{width:100%;height:100%;border:1px dashed var(--line2);border-radius:12px;background:none;color:var(--muted);font-size:12.5px;cursor:pointer}
.br-logo .br-up{border:0}
.br-cols{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:10px}
.br-col{display:flex;align-items:center;gap:8px;background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:8px}
.br-col input{width:30px;height:30px;border:0;padding:0;background:none;border-radius:6px;cursor:pointer}
.br-col span{display:flex;flex-direction:column;font-size:11px;color:var(--muted)}
.br-col b{font-size:12px;color:var(--text);font-family:ui-monospace,monospace}
.br-photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px}
.br-photo{position:relative;display:flex;flex-direction:column;gap:5px}
.br-photo img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px}
.br-photo select,.br-photo .inp{font-size:12px;padding:6px 8px;background:var(--panel2);color:var(--text);border:1px solid var(--line2);border-radius:8px}
.br-photo-add{aspect-ratio:1;height:auto}
.br-li{list-style:none;margin:0 0 8px;padding:0;display:flex;flex-direction:column;gap:6px}
.br-li li{display:flex;align-items:center;gap:8px;background:var(--panel2);border-radius:9px;padding:8px 8px 8px 12px;font-size:13.5px}
.br-li li span{flex:1}
.br-add{display:flex;gap:8px}
.br-add .inp{flex:1}
.br-favs{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.br-fav{display:flex;flex-direction:column;gap:4px;background:var(--panel2);border-radius:12px;padding:8px}
.br-fav img,.br-fav-ph{width:100%;aspect-ratio:1;object-fit:cover;border-radius:8px;background:var(--panel);display:grid;place-items:center;font-size:28px;color:var(--muted)}
.br-fav strong{font-size:12.5px}
.br-fav small{font-size:11px;color:var(--muted)}
.br-fav .row{display:flex;gap:6px;align-items:center}
.br-fav .btn{flex:1;padding:6px;font-size:12px}
.br-danger{display:flex;justify-content:flex-end}
.br-form .br-chips{display:flex;flex-wrap:wrap;gap:6px}
.br-ph{display:flex;gap:6px;overflow-x:auto;margin-top:8px;padding-bottom:2px}
.br-ph button{flex-shrink:0;display:flex;flex-direction:column;align-items:center;gap:3px;background:none;border:0;padding:0;cursor:pointer;color:var(--muted);font-size:10.5px;width:58px}
.br-ph img{width:58px;height:58px;object-fit:cover;border-radius:9px;border:1px solid var(--line2);background:#fff}
.br-ph button:hover img{border-color:var(--accent)}
.br-ph span{max-width:58px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.btn.star{border-color:#f5c518;color:#f5c518}
.modal.st-modal{width:min(820px,100%);padding:20px}
.st-body{display:grid;grid-template-columns:1fr 1.1fr;gap:18px}
.st-pv img,.st-pv video{width:100%;border-radius:12px;max-height:60vh;object-fit:contain;background:#000}
.st-f{display:flex;flex-direction:column;gap:10px}
.st-f select.inp{width:100%}
.st-ck{display:flex;align-items:center;gap:8px;font-size:13.5px;cursor:pointer}
.st-cols{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.st-cols label{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:11px;color:var(--muted)}
.st-cols input{width:100%;height:32px;border:0;padding:0;background:none;border-radius:8px;cursor:pointer}
.mem{margin-top:10px;padding:10px 12px;border-radius:12px;background:var(--panel2);border:1px solid var(--line2);font-size:13px;display:flex;flex-direction:column;gap:6px}
.mem.done{opacity:.7}
.mem q{font-style:italic;color:var(--text)}
.mem .row{display:flex;gap:6px}
.mem .btn{padding:6px 12px;font-size:12.5px}
.chat-brand{font-size:13px;color:var(--muted);margin:6px 0 10px}
@media (max-width:900px){.br-page{grid-template-columns:1fr}.br-list{position:static}.st-body{grid-template-columns:1fr}.br-2,.br-cols{grid-template-columns:1fr 1fr}}
@media (max-width:760px){.br-sel{margin-right:6px}.br-btn{max-width:140px;padding:0 10px}.top h1{font-size:16px}}
/* conector MCP */
.mcp p{color:var(--muted);line-height:1.5}
.mcp em{color:var(--text)}
.mcp-url{display:flex;gap:8px;align-items:center;margin:6px 0 16px}
.mcp-url code{flex:1;background:var(--panel2);border:1px solid var(--line2);border-radius:10px;padding:11px 12px;font-size:13px;overflow:auto;white-space:nowrap}
.mcp-steps{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px}
.mcp-steps>div{background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.mcp-steps h4,.mcp h4{margin:0 0 8px;font-size:14px}
.mcp-steps ol{margin:0;padding-left:18px;font-size:13px;line-height:1.55}
.mcp-steps small{display:block;color:var(--muted);font-size:11.5px;margin-top:8px}
.mcp-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.mcp-list li{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--panel2);border-radius:10px;padding:10px 12px}
.mcp-list small{display:block;color:var(--muted);font-size:12px}
@media (max-width:700px){.mcp-steps{grid-template-columns:1fr}}
/* editor de logo */
.modal.lg-modal{width:min(1000px,96vw)}
.lg-body{display:grid;grid-template-columns:1.4fr 1fr;gap:18px;align-items:start}
.lg-stage{background:#0b0b0b;border-radius:12px;display:grid;place-items:center;padding:10px}
.lg-wrap{position:relative;display:inline-block;max-width:100%}
.lg-wrap>img:first-child{display:block;max-width:100%;max-height:68vh;border-radius:6px}
.lg-logo{position:absolute;height:auto;pointer-events:none}
.lg-ctrl{display:flex;flex-direction:column;gap:8px}
.lg-ctrl input[type=range]{width:100%}
.lg-grid{display:grid;grid-template-columns:repeat(3,38px);gap:6px}
.lg-grid button{width:38px;height:38px;border-radius:8px;border:1px solid var(--line2);background:var(--panel2);cursor:pointer}
.lg-grid button.on{background:var(--accent);border-color:var(--accent)}
@media (max-width:760px){.lg-body{grid-template-columns:1fr}}

/* ---- plantillas con portada real (0.15) ---- */
.tcard{transition:border-color .25s,transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.tcard:hover{transform:translateY(-3px);box-shadow:0 22px 44px -22px #000,0 0 0 1px #d4f36b33;border-color:#d4f36b55}
.art-wrap.has-img{background:#0b0c0d}
.art-wrap.has-img .art{background:var(--img) center/cover no-repeat;transition:transform .9s cubic-bezier(.2,.8,.2,1),filter .5s ease}
.art-wrap.has-img .art::after{background:linear-gradient(180deg,transparent 45%,#000a);mix-blend-mode:normal}
.tcard:hover .art-wrap.has-img .art,.tcard:focus-visible .art-wrap.has-img .art{transform:scale(1.12);filter:blur(9px) brightness(.42) saturate(1.2)}
.art-wrap.has-img .scene{transition:opacity .35s ease}
.art-wrap.has-img .tstage{width:80%;transform-origin:50% 55%}
.art-wrap.has-img.fx-reel .tstage{width:36%}
.tcard:hover .art-wrap.has-img .scene{animation:qSceneIn .45s cubic-bezier(.2,.8,.2,1) both}
@keyframes qSceneIn{from{transform:scale(.9) translateY(8px)}to{transform:none}}
.art-wrap.has-img .ph{background:var(--img) center/cover no-repeat;border-color:#ffffff38;border-radius:10px}
.art-wrap.has-img .ph.b{background-image:var(--img2)}
.art-wrap.has-img .ph i{display:none}
.art-wrap.has-img .frag{border-radius:0}
.art-wrap.has-img .tstage{filter:drop-shadow(0 18px 24px #000c)}
.art-wrap.has-img .art-shine{position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 30%,#ffffff2e 48%,transparent 62%);transform:translateX(-120%);z-index:1}
.tcard:hover .art-wrap.has-img .art-shine{animation:qShine 1.1s ease-out 1 both}
.art-wrap.has-img .art-ico{z-index:2;background:#000000a6;backdrop-filter:blur(6px);border:1px solid #ffffff1f}
@media (hover:none){
  .art-wrap.has-img .art{animation:qKen 14s ease-in-out infinite alternate;animation-play-state:running}
}
@keyframes qKen{from{transform:scale(1.02)}to{transform:scale(1.1) translate(-2%,-1%)}}
@media (prefers-reduced-motion:reduce){.art-wrap.has-img .art,.art-wrap.has-img .art-shine{animation:none!important;transition:none!important}}

/* ---- publicación para redes (0.16) ---- */
.modal.wide.post{grid-template-columns:minmax(0,1fr) 420px}
.post-stage{background:radial-gradient(circle at 50% 30%,#1c2024,#0b0c0d 70%);padding:28px;overflow:auto;align-items:start}
.igm{width:min(420px,100%);background:#fff;color:#111;border-radius:14px;overflow:hidden;box-shadow:0 30px 70px #000a;font:14px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;margin:0 auto}
.igm-h{display:flex;align-items:center;gap:10px;padding:10px 12px}
.igm-h b{font-size:13.5px}
.igm-av{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:13px;color:#fff;background:linear-gradient(135deg,#feda75,#d62976 55%,#4f5bd5);box-shadow:0 0 0 2px #fff,0 0 0 3.5px #d62976}
.igm-dots{margin-left:auto;color:#555;letter-spacing:1px}
.igm-media{background:#000;aspect-ratio:4/5;display:grid;place-items:center;overflow:hidden}
.igm-media img,.igm-media video{width:100%;height:100%;object-fit:cover;display:block}
.igm-ic{display:flex;gap:14px;padding:10px 12px 4px;font-size:20px;line-height:1}
.igm-ic .r{margin-left:auto}
.igm-cap{padding:4px 12px 14px;font-size:13.5px;word-wrap:break-word}
.igm-cap b{margin-right:4px}
.igm-tags{color:#00376b;margin:8px 0 0}
.igm-cap .ph-l{display:block;height:10px;border-radius:5px;background:#eee;margin-top:8px;width:92%}
.igm-cap .ph-l.s{width:60%}
.post-d{gap:16px}
.post-d .lbl{display:block;font-size:12.5px;font-weight:700;color:var(--muted);margin-bottom:8px}
.post-d .lbl small{font-weight:500;opacity:.7;margin-left:4px}
.seg-chips{display:flex;flex-wrap:wrap;gap:6px}
.post-brand{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:var(--panel2)}
.post-brand .br-dot{width:14px;height:14px;border-radius:50%;flex:0 0 14px;box-shadow:0 0 0 3px #ffffff14}
.post-brand div{flex:1;min-width:0}
.post-brand b{display:block;font-size:14px}
.post-brand small{display:block;color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.post-ask{display:flex;gap:10px;align-items:flex-start;padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--panel2)}
.post-ask p{margin:2px 0 10px;font-size:14px}
.post-ask .who{flex:0 0 auto}
.post-ask>div{flex:1;min-width:0}
.post-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.post-grid .inp{font-size:13px;padding:9px 10px}
.post-save{display:flex;gap:8px;align-items:flex-start;font-size:12.5px;color:var(--muted);margin-top:10px;cursor:pointer}
.post-save input{margin-top:2px;accent-color:var(--accent)}
.post-out{display:flex;flex-direction:column;gap:12px;padding-top:14px;border-top:1px solid var(--line)}
.post-out textarea{font-size:14px;line-height:1.5;resize:vertical;min-height:160px}
.post-tags{display:flex;flex-wrap:wrap;gap:6px}
.post-tags .chip{font-size:12px;padding:5px 9px;color:#8fb4ff}
.post-tags .chip:hover{text-decoration:line-through;opacity:.7}
.post-story{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;padding:10px 12px;border-radius:12px;background:var(--panel2);border:1px dashed var(--line2);margin:0}
.post-story small{width:100%;color:var(--muted);font-size:11.5px}
.post-story b{font-size:15px}
.post-acts{display:flex;flex-wrap:wrap;gap:8px}
.post-tw{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.post-tw small{color:var(--muted);font-size:12px;margin-right:2px}
.spin.sm{width:14px;height:14px;border-width:2px;display:inline-block;vertical-align:-2px;margin-right:6px}
/* tarjeta de publicación en el chat */
.cpost{margin-top:12px;border:1px solid var(--line2);border-radius:16px;overflow:hidden;background:var(--panel)}
.cpost-h{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--line);font-size:13px;font-weight:700}
.cpost-h small{color:var(--muted);font-weight:500;margin-left:auto}
.cpost-b{padding:12px 14px;white-space:pre-wrap;font-size:14px;line-height:1.5}
.cpost-t{padding:0 14px 12px;color:#8fb4ff;font-size:13px}
.cpost-s{margin:0 14px 12px;padding:8px 10px;border-radius:10px;background:var(--panel2);font-size:13px}
.cpost-a{display:flex;gap:8px;flex-wrap:wrap;padding:0 14px 14px}
@media (max-width:900px){.modal.wide.post{grid-template-columns:1fr}.post-stage{padding:16px;min-height:0}.igm{width:min(340px,100%)}.post-grid{grid-template-columns:1fr}}
body:has(.ov) .asst-fab{display:none}
@media (max-width:900px){.modal.wide.post .post-d{order:-1;max-height:none}.modal.wide.post .post-stage{max-height:none}.modal.wide.post .igm{width:min(300px,100%)}}

/* =====================================================================
   0.17 · Estudio tipo app: inicio, cuenta, ingreso, restyle y móvil
   ===================================================================== */
.btn.sm{padding:7px 12px;font-size:12.5px;border-radius:999px}
.btn.lg{padding:14px 18px;font-size:15px;border-radius:14px;justify-content:center}
.btn.full{width:100%;justify-content:center}
.nav{position:relative}
.nav .new{position:absolute;top:4px;right:2px;font-style:normal;font-size:8.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;padding:2px 5px;border-radius:6px;background:var(--accent);color:var(--accent-ink)}
.avatar.on{box-shadow:0 0 0 2px var(--accent)}
.side-logo{display:block}
.top .home-btn{width:36px;height:36px;padding:0;border-radius:12px;display:grid;place-items:center;border:1px solid var(--line2);background:var(--panel);color:var(--muted)}
.top .home-btn:hover{color:var(--text)}
.top .home-btn span{display:none}
.m-logo,.m-avatar,.tabbar{display:none}
.cchip{display:inline-flex;align-items:center;gap:7px;height:36px;padding:0 14px 0 12px;border-radius:999px;border:1px solid var(--line2);background:var(--panel);font-size:13px;font-weight:600;color:var(--muted);white-space:nowrap}
.cchip i{width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px var(--accent)}
.cchip b{color:var(--text);font-weight:800}
.cchip:hover{border-color:var(--accent)}

/* ---------- Inicio ---------- */
.page.home{padding:0;overflow-y:auto}
.hm{max-width:1180px;margin:0 auto;padding:28px 28px 120px}
.hm-hero{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:18px;align-items:stretch;margin-bottom:18px}
.hm-hi{position:relative;overflow:hidden;border-radius:24px;padding:30px;border:1px solid var(--line);background:radial-gradient(600px 300px at 90% -20%,#d7fa7822,transparent 60%),radial-gradient(500px 280px at -10% 120%,#62dfff14,transparent 60%),var(--panel)}
.hm-k{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.hm-hi h2{font-size:clamp(28px,3.4vw,44px);line-height:1.05;letter-spacing:-.035em;font-weight:800;margin:10px 0 20px}
.hm-hi h2 span{color:var(--muted);font-weight:700}
.hm-ask{display:flex;align-items:center;gap:10px;padding:8px 8px 8px 10px;border-radius:18px;background:#0b0d0c;border:1px solid var(--line2);transition:border-color .2s,box-shadow .2s}
.hm-ask:focus-within{border-color:var(--accent);box-shadow:0 0 0 4px #d7fa7814}
.hm-bot{flex:0 0 auto;display:grid;place-items:center}
.hm-ask input{flex:1;min-width:0;background:none;border:0;outline:0;font-size:15px;padding:10px 4px;color:var(--text)}
.hm-send{width:44px;height:44px;border-radius:13px;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;flex:0 0 auto}
.hm-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.hm-chips .chip{border-radius:999px;padding:8px 13px;font-size:12.5px}
.hm-chips .chip:hover{color:var(--text);border-color:var(--line2)}
.hm-bal{border-radius:24px;padding:24px;border:1px solid var(--line);background:linear-gradient(160deg,#d7fa781a,#d7fa7805 50%,var(--panel));display:flex;flex-direction:column}
.hm-bal small{font-size:12px;color:var(--muted);font-weight:700}
.hm-bal b{font-size:44px;font-weight:800;letter-spacing:-.04em;line-height:1.1;margin:6px 0 4px}
.hm-bal p{color:var(--muted);font-size:13px;margin-bottom:16px}
.hm-bal .row{margin-top:auto;display:flex;gap:8px;flex-wrap:wrap}
.hm-bal.guest b{font-size:34px}
.hm-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}
.ht{position:relative;overflow:hidden;border-radius:22px;min-height:230px;text-align:left;border:1px solid var(--line);background:var(--panel);display:flex;align-items:flex-end;padding:0;isolation:isolate;transition:transform .35s cubic-bezier(.2,.8,.2,1),border-color .25s,box-shadow .35s}
.ht.w2{grid-column:span 2}
.ht:hover{transform:translateY(-3px);border-color:#d7fa7866;box-shadow:0 24px 50px -24px #000}
.ht-img{position:absolute;inset:0;background-size:cover;background-position:center;z-index:-2;transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.ht:hover .ht-img{transform:scale(1.06)}
.ht-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 25%,#000000d9 100%)}
.ht-tx{display:flex;flex-direction:column;gap:3px;padding:20px;max-width:88%}
.ht-tx small{font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.ht-tx strong{font-size:21px;letter-spacing:-.02em;font-weight:800;line-height:1.15;color:#fff}
.ht-tx em{font-style:normal;font-size:13px;color:#d6dbd3;line-height:1.4}
.ht-go{position:absolute;top:16px;right:16px;width:34px;height:34px;border-radius:12px;display:grid;place-items:center;background:#0008;backdrop-filter:blur(8px);border:1px solid #ffffff22;color:#fff;transition:background .2s,color .2s}
.ht:hover .ht-go{background:var(--accent);color:var(--accent-ink)}
.ht-badge{position:absolute;top:16px;left:16px;padding:5px 10px;border-radius:999px;background:var(--accent);color:var(--accent-ink);font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.t-mg{background:radial-gradient(circle at 70% 30%,#ff5c8a33,transparent 55%),radial-gradient(circle at 20% 80%,#d7fa7826,transparent 50%),#121514}
.ht-kin{position:absolute;inset:0;z-index:-1;display:flex;flex-direction:column;justify-content:center;padding:0 22px 70px;gap:2px}
.ht-kin b{font-size:42px;font-weight:900;letter-spacing:-.05em;line-height:.95;color:#fff;opacity:0;animation:kin 3.6s cubic-bezier(.2,.8,.2,1) infinite}
.ht-kin b:nth-child(2){color:var(--accent);animation-delay:.25s;font-size:56px}
.ht-kin b:nth-child(3){animation-delay:.5s}
@keyframes kin{0%{opacity:0;transform:translateX(-30px) skewX(-8deg)}15%,70%{opacity:1;transform:none}85%,100%{opacity:0;transform:translateX(30px)}}
.t-tpl{background:#121514}
.ht-col{position:absolute;inset:12px 12px 90px;z-index:-1;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ht-col i{border-radius:12px;background-size:cover;background-position:center;transition:transform .5s}
.ht:hover .ht-col i:nth-child(1){transform:rotate(-2deg) scale(1.03)}
.ht:hover .ht-col i:nth-child(4){transform:rotate(2deg) scale(1.03)}
.hm-rec{margin-top:30px}
.hm-h{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:12px}
.hm-h h3{font-size:17px;font-weight:800;letter-spacing:-.01em}
.hm-strip{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px;scrollbar-width:none}
.hm-strip::-webkit-scrollbar{display:none}
.hm-it{position:relative;flex:0 0 150px;aspect-ratio:4/5;border-radius:16px;overflow:hidden;border:1px solid var(--line);scroll-snap-align:start;padding:0;background:#000}
.hm-it img,.hm-it video{width:100%;height:100%;object-fit:cover;display:block}
.hm-it .pl{position:absolute;right:8px;bottom:8px;width:26px;height:26px;border-radius:50%;background:#000a;display:grid;place-items:center}
.hm-it .pl .i{width:12px;height:12px}
.hm-more{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:30px}
.hm-row{display:flex;align-items:center;gap:14px;padding:16px;border-radius:18px;border:1px solid var(--line);background:var(--panel);text-align:left;transition:border-color .2s}
.hm-row:hover{border-color:var(--line2)}
.hm-row .ic{width:42px;height:42px;border-radius:13px;background:var(--panel2);display:grid;place-items:center;font-size:18px;flex:0 0 auto;color:var(--accent)}
.hm-row>span:nth-child(2){flex:1;min-width:0}
.hm-row strong{display:block;font-size:14px}
.hm-row small{display:block;color:var(--muted);font-size:12.5px;line-height:1.4}
.hm-row>svg{color:var(--dim)}

/* ---------- Cuenta ---------- */
.page.acc{overflow-y:auto;padding:0}
.acc-w{max-width:880px;margin:0 auto;padding:28px 24px 120px}
.acc-load{display:grid;place-items:center;padding:80px}
.acc-hero{display:flex;align-items:center;gap:16px;margin-bottom:20px}
.acc-av{width:64px;height:64px;border-radius:22px;display:grid;place-items:center;font-size:26px;font-weight:800;color:var(--accent-ink);background:linear-gradient(135deg,var(--accent),#9fd84a)}
.acc-hero h2{font-size:24px;font-weight:800;letter-spacing:-.02em}
.acc-hero p{color:var(--muted);font-size:13px}
.acc-cards{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:12px;margin-bottom:26px}
.acc-bal{border-radius:22px;padding:22px;border:1px solid var(--line);background:linear-gradient(160deg,#d7fa781a,#d7fa7805 55%,var(--panel));display:flex;flex-direction:column}
.acc-bal small,.acc-stat small{font-size:12px;font-weight:700;color:var(--muted)}
.acc-bal b{font-size:42px;font-weight:800;letter-spacing:-.04em;line-height:1.1;margin:6px 0}
.acc-bal b.sm{font-size:22px;letter-spacing:-.01em}
.acc-bal p{color:var(--muted);font-size:13px;margin-bottom:14px}
.acc-bal .row{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto}
.acc-stat{border-radius:22px;padding:22px;border:1px solid var(--line);background:var(--panel);text-align:left;display:flex;flex-direction:column;transition:border-color .2s}
.acc-stat:hover{border-color:var(--line2)}
.acc-stat b{font-size:34px;font-weight:800;letter-spacing:-.03em;margin:4px 0 auto}
.acc-stat span{display:flex;align-items:center;gap:4px;color:var(--muted);font-size:12.5px;margin-top:12px}
.acc-stat span .i{width:14px;height:14px}
.acc-sec{margin-bottom:26px}
.acc-sec h3{font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.acc-list{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:var(--panel)}
.acc-list li{border-bottom:1px solid var(--line)}
.acc-list li:last-child{border-bottom:0}
.acc-list li,.acc-list li a{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 16px}
.acc-list li a{padding:0;width:100%}
.acc-list li:has(a){padding:13px 16px}
.acc-list strong{display:block;font-size:14px;font-weight:600}
.acc-list small{display:block;color:var(--muted);font-size:12px}
.acc-list b{font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}
.acc-list b.up{color:var(--accent)}
.acc-links{border:1px solid var(--line);border-radius:18px;overflow:hidden;background:var(--panel)}
.acc-links>*{display:flex;align-items:center;gap:12px;width:100%;padding:15px 16px;border-bottom:1px solid var(--line);text-align:left;font-size:14px;font-weight:600}
.acc-links>*:last-child{border-bottom:0}
.acc-links>* span{flex:1}
.acc-links>*:hover{background:var(--panel2)}
.acc-links .out{color:var(--danger)}

/* ---------- Visitantes e ingreso ---------- */
.gw{display:grid;place-items:center;min-height:60vh;padding:30px 20px}
.gw-card{max-width:440px;text-align:center;padding:34px 28px;border-radius:26px;border:1px solid var(--line);background:radial-gradient(400px 220px at 50% -20%,#d7fa781f,transparent 70%),var(--panel)}
.gw-bot{display:inline-grid;margin-bottom:8px}
.gw-card h2{font-size:26px;font-weight:800;letter-spacing:-.02em;margin-bottom:8px}
.gw-card p{color:var(--muted)}
.gw-gift{margin-top:12px;color:var(--text)!important}
.gw-card .row{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:20px}
.modal.auth{width:min(860px,100%);padding:0;overflow:hidden;border-radius:26px}
.au{display:grid;grid-template-columns:1fr 1.1fr;min-height:520px}
.au-art{position:relative;padding:36px 30px;background:radial-gradient(420px 300px at 20% 0%,#d7fa7830,transparent 60%),radial-gradient(400px 300px at 100% 100%,#62dfff1f,transparent 60%),#0b0d0c;display:flex;flex-direction:column;justify-content:flex-end;gap:10px;border-right:1px solid var(--line)}
.au-bot{position:absolute;top:30px;left:28px;animation:bob 4s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(-8px)}}
.au-art h3{font-size:26px;font-weight:800;letter-spacing:-.02em}
.au-art p{color:var(--muted)}
.au-art ul{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:8px;font-size:13.5px;color:#d6dbd3}
.au-f{position:relative;padding:34px 30px;display:flex;flex-direction:column;justify-content:center}
.au-x{position:absolute;top:14px;right:14px}
.au-why{font-size:13.5px;color:var(--accent);margin-bottom:14px;padding:10px 12px;border-radius:12px;background:#d7fa7810;border:1px solid #d7fa7833}
.au-tabs{display:grid;grid-template-columns:1fr 1fr;padding:4px;border-radius:14px;background:var(--panel2);border:1px solid var(--line);margin-bottom:20px}
.au-tabs button{padding:10px;border-radius:11px;font-weight:700;color:var(--muted)}
.au-tabs button.on{background:var(--panel);color:var(--text);box-shadow:inset 0 0 0 1px var(--line2)}
.au-form{display:grid;gap:14px}
.au-form label{display:grid;gap:6px;font-size:12.5px;font-weight:700;color:var(--muted)}
.au-form .inp{padding:13px 14px;font-size:15px;border-radius:12px}
.au-note{font-size:12.5px;color:var(--muted);text-align:center;display:block}
.au-note a,a.au-note{color:var(--accent);text-decoration:underline}

/* ---------- Hoja "Crear" ---------- */
.modal.sheet-m{width:min(460px,100%);padding:10px 10px 14px;border-radius:24px}
.sheet{display:grid;gap:4px}
.sheet-grip{display:none}
.sheet h3{font-size:16px;font-weight:800;padding:10px 12px 8px}
.sheet-it{display:flex;align-items:center;gap:14px;padding:12px;border-radius:16px;text-align:left}
.sheet-it:hover{background:var(--panel2)}
.sheet-it .ic{width:46px;height:46px;border-radius:14px;background:var(--panel2);border:1px solid var(--line2);display:grid;place-items:center;color:var(--accent);flex:0 0 auto}
.sheet-it>span:nth-child(2){flex:1}
.sheet-it strong{display:block;font-size:15px}
.sheet-it small{display:block;color:var(--muted);font-size:12.5px}

/* ---------- Restyle ---------- */
.rs-intro{padding:16px;border-radius:16px;margin-bottom:16px;border:1px solid var(--line);background:radial-gradient(300px 160px at 100% 0%,#d7fa781c,transparent 70%),var(--panel)}
.rs-intro strong{font-size:16px;letter-spacing:-.01em}
.rs-intro p{color:var(--muted);font-size:13px;margin-top:4px}
.rs-sel{color:var(--accent)!important;font-weight:700!important}
.rs-cats{display:flex;gap:6px;overflow-x:auto;margin-bottom:10px;scrollbar-width:none}
.rs-cats .chip{white-space:nowrap;border-radius:999px}
.rs-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.rs-st{position:relative;aspect-ratio:3/4;border-radius:14px;overflow:hidden;padding:0;border:1px solid var(--line);background:var(--panel2);transition:transform .2s,border-color .2s}
.rs-st img,.rs-st video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.rs-st video{opacity:0;transition:opacity .25s}
.rs-st:hover video{opacity:1}
.rs-st::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,#000c)}
.rs-n{position:absolute;left:8px;right:8px;bottom:7px;z-index:1;font-size:11.5px;font-weight:700;line-height:1.2;color:#fff;text-align:left}
.rs-ok{position:absolute;top:7px;right:7px;z-index:1;width:22px;height:22px;border-radius:50%;background:var(--accent);color:var(--accent-ink);font-style:normal;font-weight:900;font-size:12px;display:grid;place-items:center;transform:scale(0);transition:transform .25s cubic-bezier(.2,1.6,.4,1)}
.rs-st.on{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent)}
.rs-st.on .rs-ok{transform:scale(1)}
.rs-st:hover{transform:translateY(-2px)}
.rs-ph{position:absolute;inset:0;background:linear-gradient(135deg,#2a2f2b,#151816)}
.rs-sk{aspect-ratio:3/4;border-radius:14px;background:linear-gradient(90deg,var(--panel) 0%,var(--panel2) 50%,var(--panel) 100%);background-size:200% 100%;animation:sk 1.2s linear infinite}
@keyframes sk{to{background-position:-200% 0}}
.rs-more{border:1px solid var(--line);border-radius:14px;padding:12px 14px;background:var(--panel)}
.rs-more summary{cursor:pointer;font-size:13px;font-weight:700;color:var(--muted);list-style:none}
.rs-more summary::-webkit-details-marker{display:none}
.rs-more summary::after{content:" +";color:var(--dim)}
.rs-more[open] summary::after{content:" –"}
.rs-more textarea{width:100%;background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:10px 12px;color:var(--text);resize:vertical}
.tip.warn{color:var(--warn)}
.rs-empty .rs-demo{display:flex;gap:10px;justify-content:center;margin-bottom:14px}
.rs-empty .rs-demo span{width:120px;aspect-ratio:3/4;border-radius:16px;background-size:cover;background-position:center;border:1px solid var(--line2)}
.rs-empty .rs-demo span:first-child{transform:rotate(-4deg)}
.rs-empty .rs-demo span:last-child{transform:rotate(4deg);filter:saturate(1.4) hue-rotate(-20deg)}

/* ---------- Móvil: experiencia de app ---------- */
@media (max-width:900px){
  .side{display:none!important}
  .main{padding-bottom:calc(84px + env(safe-area-inset-bottom))}
  .top{position:sticky;top:0;z-index:30;gap:10px;padding:10px 14px;padding-top:calc(10px + env(safe-area-inset-top));min-height:58px;background:#0d0f0ee6;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
  .m-logo{display:block;flex:0 0 auto}
  .m-logo img{width:30px;height:30px;display:block}
  .top .home-btn{display:none}
  .top h1{font-size:17px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
  .top .credits{display:none}
  .m-avatar{display:grid;place-items:center;width:34px;height:34px;border-radius:12px;background:linear-gradient(135deg,var(--accent),#9fd84a);color:var(--accent-ink);font-weight:800;font-size:14px;flex:0 0 auto}
  .cchip{height:34px;padding:0 11px;font-size:12.5px}
  .cchip span{display:none}
  .br-sel{margin-right:0}
  .br-btn{max-width:none;width:34px;height:34px;padding:0;justify-content:center;border-radius:12px}
  .br-btn .br-lbl{display:none}
  .br-btn{font-size:0}
  .br-btn .br-dots{font-size:13px}
  .asst-fab{display:none!important}
  .drawer{display:none}
  .tabbar{display:flex;position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:45;height:66px;padding:0 6px;border-radius:24px;align-items:center;justify-content:space-around;background:#141715eb;border:1px solid var(--line2);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 18px 40px #000a}
  .tb{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 2px;color:var(--dim);font-size:10.5px;font-weight:700;border-radius:16px}
  .tb .i{width:22px;height:22px}
  .tb.on{color:var(--accent)}
  .tb.bit{position:relative;top:-14px;color:var(--muted)}
  .tb.bit .bitb{width:58px;height:58px;border-radius:20px;display:grid;place-items:center;background:var(--panel);border:1px solid var(--line2);box-shadow:0 10px 26px #000b,0 0 0 5px #0d0f0e}
  .tb.bit.on .bitb{box-shadow:0 10px 26px #000b,0 0 0 5px #0d0f0e,0 0 0 7px var(--accent)}
  .tb.bit span:last-child{margin-top:2px}
  .toasts{bottom:calc(92px + env(safe-area-inset-bottom))}
  .menu{bottom:auto;top:64px}
  /* inicio */
  .hm{padding:16px 14px 30px}
  .hm-hero{grid-template-columns:1fr;gap:12px}
  .hm-hi{padding:22px 18px;border-radius:22px}
  .hm-hi h2{font-size:28px;margin:8px 0 16px}
  .hm-hi h2 span{display:block}
  .hm-chips{flex-wrap:nowrap;overflow-x:auto;margin-right:-18px;padding-right:18px;scrollbar-width:none}
  .hm-chips .chip{white-space:nowrap}
  .hm-bal{padding:18px;border-radius:20px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:2px 12px}
  .hm-bal b{font-size:30px;margin:0;grid-row:2}
  .hm-bal small{grid-column:1}
  .hm-bal p{display:none}
  .hm-bal .row{grid-column:2;grid-row:1/3;margin:0}
  .hm-bal.guest{grid-template-columns:1fr}
  .hm-bal.guest .row{grid-column:1;grid-row:auto;margin-top:12px}
  .hm-bal.guest b{font-size:26px}
  .hm-grid{grid-template-columns:1fr 1fr;gap:10px}
  .ht.w2{grid-column:span 1}
  .ht{min-height:190px;border-radius:20px}
  .ht:first-child{grid-column:span 2;min-height:210px}
  .ht-tx{padding:14px;max-width:100%}
  .ht-tx strong{font-size:16px}
  .ht-tx em{display:none}
  .ht:first-child .ht-tx em{display:block}
  .ht-go{top:10px;right:10px;width:30px;height:30px;border-radius:10px}
  .ht-badge{top:10px;left:10px;font-size:9.5px;padding:4px 8px}
  .ht-kin b{font-size:28px}.ht-kin b:nth-child(2){font-size:36px}
  .ht-kin{padding:0 14px 60px}
  .ht-col{inset:10px 10px 70px;gap:6px}
  .hm-it{flex-basis:118px;border-radius:14px}
  .hm-more{grid-template-columns:1fr;gap:8px;margin-top:22px}
  /* cuenta */
  .acc-w{padding:18px 14px 30px}
  .acc-cards{grid-template-columns:1fr 1fr}
  .acc-bal{grid-column:span 2}
  .acc-bal b{font-size:36px}
  /* ingreso como hoja inferior */
  .ov:has(.modal.auth),.ov:has(.modal.sheet-m){align-items:end;padding:0}
  .modal.auth,.modal.sheet-m{width:100%;max-height:88vh;max-height:88dvh;border-radius:26px 26px 0 0;padding-bottom:env(safe-area-inset-bottom);animation:up .3s cubic-bezier(.2,.8,.2,1)}
  @keyframes up{from{transform:translateY(40px);opacity:0}}
  .au{grid-template-columns:1fr;min-height:0}
  .au-art{display:none}
  .au-f{padding:26px 18px 24px}
  .sheet-grip{display:block;width:40px;height:4px;border-radius:4px;background:var(--line2);margin:6px auto 4px}
  /* restyle */
  .rs-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .seg.seg4 button{font-size:12px}
}
@media (max-width:380px){.rs-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tb{font-size:9.5px}}
/* ajustes finos 0.17 */
.nav .new{font-size:0;width:8px;height:8px;padding:0;border-radius:50%;top:9px;right:calc(50% - 16px);box-shadow:0 0 0 3px #0a0c0b,0 0 10px var(--accent)}
.ht-kin{justify-content:flex-start;padding:22px 70px 0 22px}
.ht-kin b{font-size:34px}
.ht-kin b:nth-child(2){font-size:46px}
#ctrl .rs-intro ~ .blk > .slot.wide{width:100%;min-height:130px}
#ctrl .rs-intro ~ .blk > .slot.filled.wide{aspect-ratio:16/9;min-height:0}
@media (max-width:900px){.ht-kin{padding:14px 50px 0 14px}.ht-kin b{font-size:24px}.ht-kin b:nth-child(2){font-size:32px}}
.ht-kin b{font-size:30px;line-height:.92}.ht-kin b:nth-child(2){font-size:40px}

/* ---------- 0.18.1 chat limpio ---------- */
.chat-top{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 0 0}
.chat-top .brain-wrap{margin:0;justify-content:flex-start}
.brain-btn{padding:6px 12px;font-size:12.5px;display:inline-flex;align-items:center;gap:6px;color:var(--muted)}
.brain-btn b{color:var(--text);font-weight:700}
.brain-btn .brain-car{font-size:10px;opacity:.7}
.chat-top .brain-menu{bottom:auto;top:calc(100% + 8px);left:0;transform:none}
.chat-new{font-size:12.5px;font-weight:700;color:var(--muted);padding:6px 10px;border-radius:999px;border:1px solid var(--line)}
.chat-new:hover{color:var(--text);border-color:var(--line2)}
.chat-in textarea::placeholder{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ask .chips-row{justify-content:flex-start}
.chip.ghost{border-color:var(--line);color:var(--dim)}
.br-none{color:var(--muted)}
.chat-in{margin-bottom:14px}
@media (max-width:900px){
  .chat-top{padding:6px 2px 0}
  .ask-q{font-size:15px}
  .ask .chips-row{gap:6px}
  .ask .chip{padding:8px 12px;font-size:13px;border-radius:12px}
  .msg.bot .who{flex:0 0 28px}
  .msg.bot .who svg{width:28px;height:28px}
  .chat-in{border-radius:16px;padding:6px!important;margin-bottom:10px}
  .chat-in textarea{font-size:15px;height:42px}
  .chat-in .chat-plus,.chat-in .send{width:40px;height:40px}
  .chat-note{margin:0 0 8px}
}
@media (max-width:900px){.body.full > .chat{padding-bottom:20px}}

/* 0.20.2: los modales hacen scroll propio en el celular (no el fondo) */
.ov{overscroll-behavior:contain}
.modal{max-height:calc(100dvh - 40px);overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y}
html.qbp-lock,html.qbp-lock body{overflow:hidden!important}

/* 0.21 submenú de Express (barra lateral) */
.nav .nav-more{position:absolute;right:3px;top:50%;width:5px;height:5px;border-right:1.5px solid currentColor;border-top:1.5px solid currentColor;transform:translateY(-50%) rotate(45deg);opacity:.45}
.nav.open{background:var(--panel2);color:var(--text)}
.xfly{position:fixed;left:var(--side);top:0;bottom:0;width:300px;z-index:45;background:#0d100e;border-right:1px solid var(--line2);box-shadow:24px 0 60px -20px #000c;display:flex;flex-direction:column;animation:xflyin .18s ease}
@keyframes xflyin{from{opacity:0;transform:translateX(-12px)}}
.xfly-h{display:grid;grid-template-columns:1fr auto;padding:18px 14px 12px 18px;border-bottom:1px solid var(--line)}
.xfly-h strong{font-size:16px}
.xfly-h small{grid-column:1;color:var(--muted);font-size:12px}
.xfly-h .x{grid-row:1/span 2;grid-column:2;align-self:center}
.xfly-l,.xm-list{overflow:auto;padding:8px 10px 20px;overscroll-behavior:contain}
.xm-all{width:100%;display:flex;align-items:center;gap:12px;padding:10px;border-radius:14px;text-align:left;background:#d7fa780d;border:1px solid #d7fa7833;margin-bottom:4px;color:var(--text)}
.xm-all>.i:first-child{width:36px;height:36px;padding:8px;border-radius:11px;background:var(--accent);color:var(--accent-ink);flex:0 0 auto}
.xm-all span{flex:1}
.xm-all strong{display:block;font-size:14px}
.xm-all small{display:block;color:var(--muted);font-size:12px}
.xm-cat{font-size:10.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--dim,#7d857f);padding:14px 8px 6px}
.xm-it{width:100%;display:flex;align-items:center;gap:12px;padding:7px 8px;border-radius:14px;text-align:left;color:var(--text)}
.xm-it:hover,.xm-it:focus-visible{background:var(--panel2)}
.xm-it.on{background:var(--panel2);box-shadow:inset 0 0 0 1px var(--accent)}
.xm-th{flex:0 0 auto;width:44px;height:44px;border-radius:12px;background-size:cover;background-position:center;display:grid;place-items:center;font-size:22px;border:1px solid var(--line2)}
.xm-tx{min-width:0;flex:1}
.xm-tx strong{display:block;font-size:13.5px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.xm-tx em{display:block;font-style:normal;font-size:11.5px;color:var(--muted)}
.xm-tx em.free{color:var(--accent);font-weight:700}
/* hoja Crear, segundo nivel */
.sheet-h2{display:flex;align-items:center;gap:6px;padding:4px 4px 2px}
.sheet-h2 h3{padding:8px 4px}
.sheet-back{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:var(--panel2);border:1px solid var(--line2)}
.sheet .xm-list{padding:4px 2px 8px;overflow:visible}
.sheet .xm-th{width:48px;height:48px}
.sheet .xm-tx strong{font-size:15px}
@media (max-width:900px){.xfly{display:none}}

/* 0.22 idioma */
.lang-btn{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 11px;border-radius:999px;border:1px solid var(--line2);background:var(--panel);font-size:12px;font-weight:800;color:var(--text)}
.lang-btn span{font-size:16px;line-height:1}
.lang-btn:hover{border-color:var(--accent)}
.lp-ov{position:fixed;inset:0;z-index:100;background:radial-gradient(circle at 50% 30%,#1a2414 0,#070908 70%);display:grid;place-items:center;padding:20px;animation:fade .25s ease}
.lp-ov.go{opacity:.6;pointer-events:none}
.lp{width:min(420px,100%);text-align:center;color:var(--text);font-family:var(--font)}
.lp-dog{position:relative;display:inline-block;margin-bottom:14px;animation:lpbob 3s ease-in-out infinite}
.lp-dog svg,.lp-dog img{display:block;filter:drop-shadow(0 18px 30px #000a)}
.lp-bub{position:absolute;left:78%;top:-6px;white-space:nowrap;background:#fff;color:#111;font-weight:800;font-size:13px;padding:6px 11px;border-radius:14px 14px 14px 4px;box-shadow:0 8px 20px #0006}
@keyframes lpbob{50%{transform:translateY(-6px)}}
.lp h2{font-size:28px;font-weight:800;letter-spacing:-.02em}
.lp>p{color:var(--muted);font-size:17px;margin:2px 0 22px}
.lp-opts{display:grid;gap:10px}
.lp-o{position:relative;display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:18px;border:1.5px solid var(--line2);background:var(--panel);text-align:left;color:var(--text);transition:border-color .15s,transform .15s}
.lp-o:hover,.lp-o:focus-visible{border-color:var(--accent);transform:translateY(-1px)}
.lp-o.sug{border-color:#d7fa7866;background:#d7fa780a}
.lp-f{font-size:34px;line-height:1}
.lp-o strong{display:block;font-size:17px}
.lp-o small{display:block;color:var(--muted);font-size:12.5px}
.lp-o i{margin-left:auto;font-style:normal;width:24px;height:24px;border-radius:50%;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;font-weight:900;font-size:13px}
.lp-x{margin-top:16px;color:var(--muted);font-size:13px;background:none;border:0}
@media (max-width:900px){.lang-btn{height:34px;padding:0 9px}.lang-btn b{display:none}}

/* 0.23 celular: las tarjetas no se llenan de íconos; al tocarlas se abren con todas las acciones */
@media (hover:none) and (max-width:900px){.card .cacts{display:none}}

.mg-rate{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:10px 0;font-size:13px;color:var(--muted)}

/* 0.23 skills de Bit */
.sk-list{display:grid;gap:8px}
.sk-row{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:12px;border-radius:14px;background:var(--panel2);border:1px solid var(--line2)}
.sk-row.off{opacity:.6}
.sk-tx{min-width:0}
.sk-tx strong{font-size:14px;margin-right:6px}
.sk-tx small{display:block;color:var(--muted);font-size:12px;margin-top:2px}
.sk-acts{display:flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.chip.dng{color:var(--danger)}
@media (max-width:640px){.sk-row{flex-direction:column;align-items:flex-start}.sk-acts{justify-content:flex-start}}
.brain-ai{font-style:normal;font-weight:500;color:var(--muted);font-size:.85em}

/* ================= Organizador (0.27.0) ================= */
.pl-page{padding:24px clamp(16px,3vw,32px) 120px}
.pl{max-width:1100px;margin:0 auto}
.pl-head{display:flex;gap:16px;align-items:flex-end;justify-content:space-between;flex-wrap:wrap;margin-bottom:18px}
.pl-head h2{font-size:22px;margin:0 0 4px}
.pl-head .mg-lead{margin:0;color:var(--muted)}
.pl-tools{display:flex;gap:8px;flex-wrap:wrap}
.pl-tools .pup,.pl-ra .pup,.pl-fa .pup{width:18px;height:18px}
.pl-today{background:var(--panel);border:1px solid var(--line2);border-radius:var(--r-lg);padding:16px;margin-bottom:18px}
.pl-today h3{font-size:15px;margin:0 0 10px}
.pl-today h4,.pl-ld{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin:16px 0 8px}
.pl-ld{text-transform:none;letter-spacing:0;font-size:13px;color:var(--text)}
.pl-row{display:flex;gap:12px;align-items:flex-start;padding:10px 12px;border:1px solid var(--line);border-left:3px solid var(--nc);border-radius:12px;background:var(--panel2);margin-bottom:8px}
.pl-row.st-publicado{opacity:.6}
.pl-k{font-size:20px;line-height:1.2}
.pl-rt{flex:1;min-width:0}
.pl-rt strong{display:block;font-size:14px}
.pl-rt small{color:var(--muted);font-size:12px}
.pl-rt p{margin:4px 0 0;font-size:12.5px;color:var(--muted)}
.pl-ra{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.pl-row.st-listo .pl-rt small::before{content:"● ";color:var(--accent)}
.pl-seg{max-width:360px}
.pl-mnav{display:flex;align-items:center;gap:10px;margin:4px 0 10px}
.pl-mnav strong{font-size:16px;text-transform:capitalize;min-width:150px;text-align:center}
.pl-mnav .x{font-size:20px;width:34px;height:34px;border:1px solid var(--line2)}
.pl-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.pl-dn{font-size:11px;font-weight:700;color:var(--dim);text-align:center;padding:4px 0}
.pl-cell{min-height:104px;border:1px solid var(--line);border-radius:10px;background:var(--panel);padding:6px;display:flex;flex-direction:column;gap:3px;cursor:pointer;text-align:left;min-width:0}
.pl-cell:hover{border-color:var(--line2)}
.pl-cell.out{opacity:.45}
.pl-cell.past .pl-n{color:var(--dim)}
.pl-cell.today{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
.pl-n{font-size:12px;font-weight:700;color:var(--muted)}
.pl-cell.today .pl-n{color:var(--accent)}
.pl-chip{display:flex;gap:4px;align-items:center;font-size:11px;font-weight:600;padding:3px 6px;border-radius:7px;background:var(--panel2);border-left:3px solid var(--nc);text-align:left;min-width:0;color:var(--text)}
.pl-chip span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.pl-chip i{font-style:normal}
.pl-chip.st-publicado{opacity:.5;text-decoration:line-through}
.pl-chip.st-listo{box-shadow:inset 0 0 0 1px #d7fa7840}
.pl-more{font-size:10.5px;color:var(--muted)}
.pl-form .pl-2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pl-form .lbl{display:flex;flex-direction:column;align-items:stretch;gap:6px;margin-bottom:12px;color:var(--muted)}
.pl-form .inp{padding:10px 12px;color:var(--text)}
.pl-fa{flex-wrap:wrap}
.pl-note{position:fixed;right:20px;top:76px;z-index:60;display:flex;gap:12px;align-items:flex-start;width:min(400px,calc(100vw - 32px));background:var(--panel2);border:1px solid var(--accent);border-radius:16px;padding:14px;box-shadow:0 18px 50px #000a;animation:plin .35s ease-out}
.pl-note strong{display:block;font-size:14px}
.pl-note p{margin:2px 0 10px;font-size:13px;color:var(--muted)}
.pl-note .row{display:flex;gap:6px;flex-wrap:wrap}
@keyframes plin{from{transform:translateY(16px);opacity:0}to{transform:none;opacity:1}}
@media (max-width:900px){
  .pl-note{right:16px;top:68px}
  .pl-grid{gap:2px}
  .pl-cell{min-height:58px;padding:4px;border-radius:8px}
  .pl-chip{padding:0;border-left:0;background:none;font-size:13px}
  .pl-chip span,.pl-more{display:none}
  .pl-cell{flex-direction:row;flex-wrap:wrap;align-content:flex-start;gap:1px}
  .pl-n{width:100%}
  .pl-row{flex-wrap:wrap}
  .pl-ra{width:100%;justify-content:flex-start}
}

/* ================= Ficha del reel y reel completo (0.27.0) ================= */
.rb-g{margin-top:14px}
.rb-l{display:block;font-size:12px;font-weight:700;color:var(--muted);margin-bottom:7px}
.rb-l small{font-weight:500;color:var(--dim);margin-left:6px}
.rb-in{margin-top:8px;padding:9px 12px;font-size:13px}
.rb-ph{display:flex;gap:8px;flex-wrap:wrap}
.rb-ph button{width:64px;height:64px;border-radius:10px;overflow:hidden;border:2px solid var(--accent);padding:0;position:relative;background:var(--panel2)}
.rb-ph button img{width:100%;height:100%;object-fit:cover;display:block}
.rb-ph button.off{border-color:var(--line);opacity:.35}
.rb-ph button.on::after{content:"✓";position:absolute;right:3px;top:3px;width:16px;height:16px;border-radius:50%;background:var(--accent);color:var(--accent-ink);font-size:10px;font-weight:800;display:grid;place-items:center}
.rb-models{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px}
.rb-m{text-align:left;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:var(--panel2);display:flex;flex-direction:column;gap:2px}
.rb-m.on{border-color:var(--accent);background:#d7fa780d}
.rb-m strong{font-size:13px}
.rb-m strong i{font-style:normal;font-weight:600;font-size:11px;color:var(--accent)}
.rb-m small{font-size:11.5px;color:var(--muted)}
.rb-m em{font-style:normal;font-size:12px;font-weight:700;color:var(--text);margin-top:4px}
.rb-note{margin-top:14px;font-size:13px;padding:10px 12px}
.rb-tip{font-size:12px;color:var(--dim);margin:8px 0 0;width:100%}
.prop.rb.done{opacity:.85}
.rr-ph{display:flex;align-items:center;gap:6px;margin:10px 0 0;flex-wrap:wrap}
.rr-ph small{color:var(--muted);font-size:12px;margin-right:4px}
.rr-ph img{width:36px;height:36px;border-radius:8px;object-fit:cover;border:1px solid var(--line2)}
.rr-shots{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:8px}
.rs{display:flex;gap:12px;align-items:flex-start}
.rs-m{flex:0 0 auto;width:74px;border-radius:10px;overflow:hidden;background:var(--panel2);border:1px solid var(--line2);position:relative;display:grid;place-items:center}
.rs-m.r916{aspect-ratio:9/16}.rs-m.r11{aspect-ratio:1}.rs-m.r169{aspect-ratio:16/9;width:120px}
.rs-m img,.rs-m video{width:100%;height:100%;object-fit:cover;display:block;position:absolute;inset:0}
.rs-m[data-act]{cursor:pointer}
.rs-m .rs-n{position:static;font-size:18px;font-weight:800;color:var(--dim)}
.rs-m .rs-st{position:absolute;inset:0;display:grid;place-items:center;background:#0008;aspect-ratio:auto;border:0;border-radius:0}
.rs-m .rs-st .spin{width:20px;height:20px}
.rs-m .rs-st.bad{color:var(--danger);font-weight:800}
.rs-t{display:flex;flex-direction:column;gap:2px;min-width:0;font-size:13px}
.rs-t b{font-size:12px;color:var(--muted)}
.rs-t em{font-style:normal;color:var(--accent);font-weight:700;font-size:12.5px}
.rs-a{display:flex;gap:12px;flex-wrap:wrap;margin-top:2px}
.rr-x{display:flex;gap:10px;align-items:flex-start;margin-top:12px;padding:10px 12px;border-radius:12px;background:var(--panel2);border:1px solid var(--line)}
.rr-x>span{font-size:18px}
.rr-x>div{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.rr-x b{font-size:13px}
.rr-x q,.rr-x small{font-size:12.5px;color:var(--muted)}
.rr-x audio{width:100%;height:36px}
.rr-x .btn{align-self:flex-start}
.rr-acts{flex-wrap:wrap}
.fb{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:12px;padding-top:10px;border-top:1px solid var(--line)}
.fb small{color:var(--muted);font-size:12px}
.fb .chips{width:100%}
.fbb{width:36px;height:36px;border-radius:50%;border:1px solid var(--line2);background:var(--panel2);font-size:16px}
.fbb:hover{border-color:var(--accent)}
.plc-l{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:6px;max-height:340px;overflow:auto}
.plc-l li{display:flex;gap:10px;font-size:13px;padding:8px 10px;border-radius:10px;background:var(--panel2)}
.plc-l li b{}
.plc-l li small{display:block;color:var(--muted);font-size:12px}

/* ================= Revisión de fotos y referencia de escena (0.28.0) ================= */
.qa{font-size:12.5px;margin:6px 0 0;color:var(--muted);display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.qa .spin{width:14px;height:14px;border-width:2px}
.qa.good{color:var(--accent);font-weight:700}
.qa.bad{display:block;padding:8px 10px;border-radius:10px;border:1px solid #ffb86b55;background:#ffb86b12;color:var(--text)}
.qa.bad p{margin:0 0 8px}
.qa.bad .row{display:flex;gap:6px;flex-wrap:wrap}
.prop .qa.bad{margin-top:10px}
.rb-sc{position:relative;width:64px;height:64px;border-radius:10px;overflow:hidden;border:2px solid var(--line2)}
.rb-sc img{width:100%;height:100%;object-fit:cover;display:block}
.rb-sc button{position:absolute;top:3px;right:3px;width:20px;height:20px;border-radius:50%;background:#000a;color:#fff;font-size:11px;display:grid;place-items:center}
.rb-add{width:64px;height:64px;border-radius:10px;border:1.5px dashed var(--line2);font-size:22px;color:var(--muted);display:grid;place-items:center}
.rb-add:hover{border-color:var(--accent);color:var(--accent)}
.rb-add .spin{width:20px;height:20px}
/* 0.34 · locutor + video en el chat */
.vcard-v{width:100%;max-height:420px;border-radius:12px;background:#000;margin:8px 0 4px}
.vcard-mix{display:grid;gap:6px;margin:10px 0 4px}
.vcard-mix small{color:var(--dim);font-size:12px}
.vcard-mix .pp-bar{height:8px;border-radius:99px;background:#ffffff14;overflow:hidden}
.vcard-mix .pp-bar i{display:block;height:100%;background:var(--accent);border-radius:99px;transition:width .3s}
.vcard-err{color:#ff9b9b;font-size:12.5px;margin:6px 0}
.at-pop{position:fixed;z-index:9999;max-height:240px;overflow:auto;min-width:220px;background:var(--panel);border:1px solid var(--line2);border-radius:14px;box-shadow:0 12px 36px #000a;padding:6px}
.at-pop button{display:flex;flex-direction:column;align-items:flex-start;width:100%;text-align:left;background:none;border:0;color:var(--text);padding:7px 10px;border-radius:9px;font:600 13px Manrope,sans-serif}
.at-pop button small{color:var(--dim);font-weight:500;font-size:11px}
.at-pop button.on,.at-pop button:hover{background:#ffffff12}
.at-pop .at-h{font-size:11px;color:var(--dim);padding:4px 10px 6px;font-weight:700}

/* ===== Bit ejecuta en el chat (prefijo bx-) ===== */
.chat-log{position:relative}
#chat-msgs{display:flex;flex-direction:column;gap:18px}
#bx-layer{position:absolute;left:0;top:0;width:0;height:0}
.bx-pl{position:absolute;z-index:2;border-radius:14px;overflow:hidden;background:#000;box-shadow:0 8px 28px rgba(0,0,0,.35)}
.bx-frame{position:relative;width:100%}
.bx-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.bx-err{position:absolute;left:8px;right:8px;bottom:8px;background:rgba(0,0,0,.8);color:#fff;font-size:12px;padding:8px;border-radius:8px}
.bx-bar{height:40px;display:flex;align-items:center;gap:8px;padding:0 10px;background:#111;color:#fff}
.bx-bar button{background:none;border:0;color:#fff;font-size:15px;cursor:pointer;min-width:28px;height:32px}
.bx-bar input{flex:1;min-width:0;accent-color:var(--accent)}
.bx-tm{font-size:11px;opacity:.8;white-space:nowrap}
.bx-slot{margin-top:12px;max-width:100%}
.bx-barsp{height:40px}
.bx-note{color:var(--muted);font-size:13px;margin:10px 0 0}
.bx-wait{display:flex;gap:12px;align-items:center;margin-top:12px;padding:12px;border-radius:12px;background:var(--panel2)}
.bx-wait strong{display:block;font-size:14px}
.bx-wait small{color:var(--muted);font-size:12px}
.bx-cost{display:block;color:var(--muted);font-size:12.5px;margin:10px 0 0}
.bx-full{width:100%;justify-content:center;margin-top:12px}
.bx-idea{margin-top:12px;border:1px solid var(--line);border-radius:14px;padding:12px}
.bx-ih{display:flex;gap:10px;align-items:center}
.bx-ih .pp-n{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--accent);color:#0d0f0e;font-weight:800;flex-shrink:0}
.bx-ih small{display:block;color:var(--muted);font-size:12px}
.bx-rec{font-style:normal;font-size:11px;background:var(--panel2);border-radius:999px;padding:2px 8px;margin-left:4px}
.bx-idea>p{margin:8px 0;font-size:14px;line-height:1.45}
.bx-board{list-style:none;margin:0 0 10px;padding:0;display:flex;gap:6px;overflow-x:auto;scrollbar-width:thin}
.bx-board li{flex:0 0 auto;max-width:150px;background:var(--panel2);border-radius:10px;padding:6px 8px;font-size:11.5px;display:flex;flex-direction:column;gap:2px}
.bx-board li span{color:var(--muted)}
.bx-board li em{font-style:normal;color:var(--text)}
.bx-ph{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.bx-ph img{width:64px;height:64px;object-fit:cover;border-radius:10px}
.bx-add{width:64px;height:64px;border-radius:10px;border:1px dashed var(--line2);background:none;color:var(--text);display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:18px;cursor:pointer;gap:2px}
.bx-add small{font-size:9.5px;line-height:1.1;text-align:center;padding:0 3px}
.bx-add.need{border-color:var(--accent);color:var(--accent)}
.bx-prog{margin-top:8px;height:28px;border-radius:8px;background:var(--panel2);position:relative;overflow:hidden;font-size:12px;display:flex;align-items:center;padding:0 10px}
.bx-prog i{position:absolute;left:0;top:0;bottom:0;background:var(--accent);opacity:.3}
.bx-prog span{position:relative}
.bx-vid{width:min(100%,280px);border-radius:12px;margin-top:10px;display:block;background:#000}
.bx-rs{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:8px;margin-top:10px}
.bx-rst{border:2px solid transparent;border-radius:12px;background:var(--panel2);padding:0;overflow:hidden;cursor:pointer;color:var(--text);text-align:left}
.bx-rst img,.bx-rst i{display:block;width:100%;aspect-ratio:1;object-fit:cover}
.bx-rst span{display:block;font-size:11.5px;padding:4px 6px}
.bx-rst.on{border-color:var(--accent)}
.bx-res{margin-top:10px}
.bx-prog[hidden]{display:none}

/* ---- 0.35: entrada al Studio (Bit grande + accesos rápidos animados) ---- */
.hm-hero2{grid-template-columns:1fr}
.hm-hero2 .hm-hi{padding:26px 30px 28px;min-height:0}
.hm-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.hm-balc{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.hm-balc > span{display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border-radius:999px;border:1px solid var(--line2);background:#0b0d0c;font-size:13px;color:var(--muted)}
.hm-balc > span i{width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px var(--accent)}
.hm-balc > span b{color:var(--text);font-size:14px}
.hm-main{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:center}
.hm-hero2 .hm-hi h2{margin:12px 0 8px}
.hm-lead{color:var(--muted);font-size:15px;line-height:1.5;margin:0 0 18px;max-width:600px}
.hm-guest{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin-top:16px}
.hm-guest b{font-size:18px;letter-spacing:-.01em;width:100%}
.hm-guest span{color:var(--muted);font-size:13px;width:100%;margin:-4px 0 4px}
.hm-bitw{position:relative;display:grid;place-items:center;align-self:stretch;min-height:250px}
.hm-bit3d{width:100%;max-width:280px;height:auto;filter:drop-shadow(0 26px 30px #000a);animation:hmBob 4s ease-in-out infinite;transform-origin:50% 90%}
.hm-shadow{position:absolute;bottom:4px;left:50%;width:46%;height:16px;border-radius:50%;background:radial-gradient(#000c,transparent 70%);transform:translateX(-50%);animation:hmShadow 4s ease-in-out infinite}
.hm-bub{position:absolute;top:0;left:-24%;z-index:2;background:var(--accent);color:var(--accent-ink);font-weight:800;font-size:13.5px;padding:9px 14px;border-radius:16px 16px 16px 4px;white-space:nowrap;box-shadow:0 10px 24px #0007;animation:hmBub 4s ease-in-out infinite}
@keyframes hmBob{0%,100%{transform:translateY(0) rotate(-1.5deg)}50%{transform:translateY(-10px) rotate(1.5deg)}}
@keyframes hmShadow{0%,100%{transform:translateX(-50%) scale(1);opacity:.9}50%{transform:translateX(-50%) scale(.82);opacity:.6}}
@keyframes hmBub{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
.pc-homecard:empty{display:none}
.hm-qa{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0 0 18px}
.hq{position:relative;display:flex;flex-direction:column;text-align:left;border-radius:20px;border:1px solid var(--line);background:var(--panel);overflow:hidden;padding:0;color:var(--text);transition:transform .35s cubic-bezier(.22,.9,.3,1),border-color .25s,box-shadow .35s;cursor:pointer}
.hq:hover,.hq:focus-visible{transform:translateY(-4px);border-color:#d7fa7866;box-shadow:0 18px 40px -18px #000c}
.hq-art{position:relative;display:block;height:118px;overflow:hidden;background:radial-gradient(160px 90px at 50% 40%,#d7fa7814,transparent 70%),#0f1211}
.hq-tx{display:flex;flex-direction:column;gap:2px;padding:11px 13px 13px}
.hq-tx strong{font-size:14.5px;letter-spacing:-.01em}
.hq-tx small{font-size:12px;color:var(--muted);line-height:1.35}
/* 1 reel: teléfono con historia */
.hq-phone{position:absolute;left:50%;top:12px;width:62px;height:112px;margin-left:-31px;border-radius:12px;background:#050606;padding:3px;box-shadow:0 10px 24px #000c,0 0 0 1px #ffffff22 inset;animation:hqTilt 5s ease-in-out infinite}
.hq-phone i{display:block;width:100%;height:100%;border-radius:9px;background-size:cover;background-position:center;animation:hqKen 5s ease-in-out infinite alternate}
.hq-phone b{position:absolute;left:7px;right:7px;top:7px;display:flex;gap:2px}
.hq-phone em{flex:1;height:2px;border-radius:2px;background:#ffffff55;overflow:hidden;position:relative}
.hq-phone em::after{content:"";position:absolute;inset:0;background:#fff;transform:scaleX(0);transform-origin:left;animation:hqBar 3s linear infinite}
.hq-phone em:nth-child(2)::after{animation-delay:1s}.hq-phone em:nth-child(3)::after{animation-delay:2s}
.hq-phone u{position:absolute;right:6px;bottom:14px;text-decoration:none;color:#ff4d8d;font-size:13px;animation:hqHeart 1.5s ease-in-out infinite}
@keyframes hqTilt{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(3deg) translateY(-3px)}}
@keyframes hqKen{to{transform:scale(1.15)}}
@keyframes hqBar{0%{transform:scaleX(0)}33%,100%{transform:scaleX(1)}}
@keyframes hqHeart{0%,100%{transform:scale(1)}40%{transform:scale(1.45)}}
/* 2 promo: storyboard que pasa */
.hq-board{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.hq-board i{position:absolute;width:62px;height:88px;border-radius:10px;background-size:cover;background-position:center;border:2px solid #fff2;box-shadow:0 10px 20px #000a;animation:hqDeal 4.5s cubic-bezier(.3,.8,.3,1) infinite;animation-delay:calc(var(--i) * 1.5s);opacity:0}
@keyframes hqDeal{0%{opacity:0;transform:translateX(70px) rotate(10deg) scale(.8)}12%,30%{opacity:1;transform:translateX(0) rotate(0) scale(1)}45%,100%{opacity:0;transform:translateX(-70px) rotate(-10deg) scale(.8)}}
/* 3 motion: palabras que golpean */
.hq-kin{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:0}
.hq-kin b{font-size:22px;font-weight:900;letter-spacing:-.04em;line-height:.95;color:#fff;opacity:0;animation:kin 3.6s cubic-bezier(.2,.8,.2,1) infinite}
.hq-kin b:nth-child(2){color:var(--accent);font-size:30px;animation-delay:.25s}.hq-kin b:nth-child(3){animation-delay:.5s}
/* 4 flyer */
.hq-fly{position:absolute;inset:10px 28%;border-radius:10px;background-size:cover;background-position:center;box-shadow:0 10px 22px #000b;overflow:hidden}
.hq-fly b{position:absolute;left:0;right:0;top:18%;text-align:center;font-size:30px;font-weight:900;color:#fff;text-shadow:0 3px 10px #000a;animation:hqSlam 3s cubic-bezier(.2,.9,.3,1.3) infinite}
.hq-fly em{position:absolute;left:50%;bottom:12%;transform:translateX(-50%);font-style:normal;font-size:10px;font-weight:800;background:var(--accent);color:var(--accent-ink);padding:3px 8px;border-radius:999px;white-space:nowrap;animation:hqPop 3s ease-out infinite}
@keyframes hqSlam{0%{transform:scale(2.4);opacity:0}12%{transform:scale(1);opacity:1}85%{transform:scale(1);opacity:1}100%{opacity:0}}
@keyframes hqPop{0%,20%{opacity:0;transform:translateX(-50%) scale(.6)}30%,85%{opacity:1;transform:translateX(-50%) scale(1)}100%{opacity:0}}
/* 5 foto de producto: antes / después */
.hq-ba{position:absolute;inset:0}
.hq-ba i{position:absolute;inset:0;background-size:cover;background-position:center}
.hq-ba i.af{clip-path:inset(0 0 0 100%);animation:hqWipe 4s ease-in-out infinite}
.hq-ba s{position:absolute;top:0;bottom:0;width:3px;background:var(--accent);box-shadow:0 0 12px var(--accent);animation:hqLine 4s ease-in-out infinite}
@keyframes hqWipe{0%,10%{clip-path:inset(0 0 0 100%)}45%,80%{clip-path:inset(0 0 0 0)}100%{clip-path:inset(0 0 0 100%)}}
@keyframes hqLine{0%,10%{left:100%}45%,80%{left:0}100%{left:100%}}
/* 6 moda: modelos que cambian */
.hq-moda{position:absolute;inset:0}
.hq-moda i{position:absolute;inset:0;background-size:cover;background-position:center 25%;opacity:0;animation:hqFade 6s infinite;animation-delay:calc(var(--i) * 2s)}
.hq-moda b{position:absolute;right:10px;bottom:8px;font-size:22px;animation:hqHeart 2s ease-in-out infinite}
@keyframes hqFade{0%{opacity:0}8%,33%{opacity:1}41%,100%{opacity:0}}
/* 7 lyrics: letra que salta + ecualizador */
.hq-ly{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:6px;padding-bottom:22px;background:linear-gradient(160deg,#2a1640,#0e0f1a)}
.hq-ly b{font-size:21px;font-weight:900;color:#fff;animation:hqHop 1.2s ease-in-out infinite}
.hq-ly b:nth-child(2){color:#ff66c4;animation-delay:.2s}.hq-ly b:nth-child(3){color:#6be4ff;animation-delay:.4s}
.hq-ly i{position:absolute;bottom:10px;width:6px;border-radius:3px;background:var(--accent);animation:hqEq .9s ease-in-out infinite alternate}
.hq-ly i:nth-of-type(1){left:calc(50% - 26px);height:10px}.hq-ly i:nth-of-type(2){left:calc(50% - 15px);height:18px;animation-delay:.2s}.hq-ly i:nth-of-type(3){left:calc(50% - 4px);height:14px;animation-delay:.4s}.hq-ly i:nth-of-type(4){left:calc(50% + 7px);height:20px;animation-delay:.1s}.hq-ly i:nth-of-type(5){left:calc(50% + 18px);height:12px;animation-delay:.3s}
@keyframes hqHop{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes hqEq{to{transform:scaleY(.35)}}
/* 8 planificar: semana que se completa */
.hq-cal{position:absolute;inset:22px 14px;display:grid;grid-template-columns:repeat(7,1fr);gap:5px;align-content:center}
.hq-cal i{position:relative;aspect-ratio:1;border-radius:8px;border:1px solid var(--line2);background:#0b0d0c;display:grid;place-items:center;font-style:normal;font-size:10px;font-weight:800;color:var(--muted)}
.hq-cal i::after{content:"✓";position:absolute;inset:0;border-radius:8px;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;font-size:13px;opacity:0;transform:scale(.5);animation:hqTick 7s ease-out infinite;animation-delay:calc(var(--i) * .5s)}
@keyframes hqTick{0%{opacity:0;transform:scale(.5)}6%,70%{opacity:1;transform:scale(1)}80%,100%{opacity:0}}
@media (max-width:1100px){.hm-qa{grid-template-columns:repeat(2,minmax(0,1fr))}.hm-main{grid-template-columns:minmax(0,1fr) 220px}}
@media (max-width:760px){
  .hm-hero2 .hm-hi{padding:18px 16px 20px}
  .hm-main{grid-template-columns:minmax(0,1fr);gap:6px}
  .hm-txt{min-width:0}
  .hm-bitw{order:-1;min-height:0;height:150px;margin-top:4px}
  .hm-bit3d{max-width:150px}
  .hm-bub{display:none}
  .hm-lead{font-size:13.5px;margin-bottom:14px}
  .hm-qa{gap:10px}
  .hq-art{height:96px}
  .hq-phone{top:6px;width:52px;height:94px;margin-left:-26px}
  .hq-tx{padding:9px 11px 11px}.hq-tx strong{font-size:13.5px}.hq-tx small{font-size:11.5px}
}
@media (prefers-reduced-motion:reduce){.hm-hero2 *,.hm-qa *{animation:none!important}}

/* Creaciones: motion graphics y presentaciones (0.35.2) */
.cr-strip{margin:4px 0 22px}
.cr-strip-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:10px}
.cr-strip-h h3,.cr-sub{font-size:16px;font-weight:800;letter-spacing:-.01em}
.cr-sub{margin:4px 0 12px}
.cr-strip-h .lnk{color:var(--accent);font-weight:700;font-size:13px}
.cr-row{display:flex;gap:12px;overflow-x:auto;scrollbar-width:thin;padding-bottom:6px;scroll-snap-type:x proximity}
.cr-row>.card{flex:0 0 auto;height:230px;width:auto;scroll-snap-align:start}
.cr-row>.cr-deck{height:150px}
.cr-pj{cursor:pointer;position:relative;overflow:hidden}
.cr-pj img,.cr-pj video{width:100%;height:100%;object-fit:cover;display:block}
.cr-ph{position:absolute;inset:0;display:grid;place-items:center;padding:14px;text-align:center}
.cr-ph b{font-size:15px;font-weight:900;color:#fff;text-shadow:0 2px 12px #0009;line-height:1.15}
.cr-cap{position:absolute;left:0;right:0;bottom:0;padding:22px 10px 8px;background:linear-gradient(transparent,#000c);color:#fff;font-size:12px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}
.cr-deck img{position:absolute;inset:0;opacity:.35}
.cr-dk{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;gap:6px;padding:8% 9% 18%}
.cr-dk i{width:34px;height:4px;border-radius:3px}
.cr-dk b{font-size:clamp(14px,1.6vw,19px);line-height:1.15;font-weight:800;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.cr-dk small{font-size:11px;opacity:.75;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.grid.cr-decks{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
@media (max-width:640px){.cr-row>.card{height:190px}.cr-row>.cr-deck{height:120px}}
.cr-ph canvas{position:absolute;inset:0;width:100%;height:100%}
.cr-deck .cr-dk{padding:12% 9% 26%}.cr-deck .cr-dk b{-webkit-line-clamp:2}
.grid.cr-mg{grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}

/* ---------------- celular (0.35.3): filtros en una sola fila deslizable ---------------- */
@media (max-width:760px){
  .cats{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-left:-16px;margin-right:-16px;padding:0 16px 2px;margin-bottom:12px;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 16px,#000 calc(100% - 24px),transparent);mask-image:linear-gradient(90deg,transparent 0,#000 16px,#000 calc(100% - 24px),transparent)}
  .cats::-webkit-scrollbar{display:none}
  .cats>*{flex:0 0 auto;white-space:nowrap}
  .cats-lbl{align-self:center}
}
/* encabezado del celular: que el título se lea completo en pantallas angostas */
@media (max-width:420px){
  .top{gap:6px;padding-left:12px;padding-right:12px}
  .top h1{font-size:15.5px;letter-spacing:-.2px}
  .top .lang-btn{height:32px;padding:0 7px}
  .top .br-btn{padding:0 8px}
  .top .m-avatar{width:32px;height:32px}
  .top .fy-hbtn{padding:0 8px}
  .top .home-btn{display:none}
}

/* ---------------- Bit (0.35.5): bienvenida con identidad del perfil ---------------- */
.chat{--b1:#d7fa78;--b2:#62dfff;--bink:#0c0d0c}
.chat-hello{position:relative}
.ch-badges{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:6px}
.ch-bot{display:grid;place-items:center;filter:drop-shadow(0 12px 22px #0008)}
.ch-x{color:var(--dim);font-weight:300;font-size:22px}
.ch-logo{width:64px;height:64px;border-radius:20px;display:grid;place-items:center;overflow:hidden;border:1px solid #ffffff1f;box-shadow:0 14px 30px #0009,0 0 0 4px color-mix(in srgb,var(--b1) 22%,transparent)}
.ch-logo img{max-width:78%;max-height:78%;object-fit:contain}
.ch-logo.lt{background:#fff}.ch-logo.dk{background:#121513}
.ch-logo.ini{background:linear-gradient(135deg,var(--b1),var(--b2))}
.ch-logo.ini b{font-size:22px;font-weight:900;color:var(--bink);letter-spacing:-.02em}
.chat-hello h2 span{display:block;font-size:.72em;font-weight:700;margin-top:4px;background:linear-gradient(90deg,var(--b1),var(--b2));-webkit-background-clip:text;background-clip:text;color:transparent}
.chat-sugg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:12px 0 14px}
.chat-sugg[hidden]{display:none}
.ch-s{display:flex;align-items:center;gap:10px;text-align:left;padding:11px 13px;border-radius:14px;background:var(--panel);border:1px solid var(--line);color:var(--muted);font-size:13px;line-height:1.3;transition:border-color .2s,color .2s,transform .2s}
.ch-s span{flex:0 0 auto;width:30px;height:30px;border-radius:10px;display:grid;place-items:center;background:color-mix(in srgb,var(--b1) 14%,transparent);font-size:15px}
.ch-s b{font-weight:600;min-width:0}
.ch-s:hover{color:var(--text);border-color:color-mix(in srgb,var(--b1) 55%,transparent);transform:translateY(-1px)}
.chat .chat-in:focus-within{border-color:color-mix(in srgb,var(--b1) 70%,transparent)}
.chat .chat-in .send{background:var(--b1);color:var(--bink)}
.drawer .chat-sugg{grid-template-columns:1fr}
.drawer .ch-logo{width:48px;height:48px;border-radius:15px}
@media (min-width:861px){
  /* sin mensajes: saludo, caja para escribir y sugerencias, todo al centro */
  .body.full > .chat{position:relative;isolation:isolate}
  .body.full > .chat.chat-empty .chat-log{flex:0 0 auto;margin-top:auto;overflow:visible;padding-bottom:18px}
  .body.full > .chat.chat-empty .chat-sugg{margin-bottom:auto;padding-bottom:6vh}
  .body.full > .chat.chat-empty .chat-hello{margin:0 auto;max-width:640px;padding:0}
  .body.full > .chat.chat-empty .chat-hello h2{font-size:32px;line-height:1.1}
  .body.full > .chat.chat-empty .chat-hello p{font-size:15px;max-width:540px;margin:10px auto 0}
  .body.full > .chat.chat-empty::before{content:"";position:absolute;inset:8% -10% 20%;z-index:-1;pointer-events:none;background:radial-gradient(420px 260px at 35% 40%,color-mix(in srgb,var(--b1) 16%,transparent),transparent 70%),radial-gradient(380px 240px at 70% 55%,color-mix(in srgb,var(--b2) 13%,transparent),transparent 70%);filter:blur(10px)}
  .body.full > .chat.chat-empty .chat-in{padding:10px 10px 10px 10px!important;border-radius:22px;border-color:color-mix(in srgb,var(--b1) 40%,var(--line2));box-shadow:0 24px 60px #0008,0 0 0 6px color-mix(in srgb,var(--b1) 7%,transparent)}
  .body.full > .chat.chat-empty .chat-in textarea{font-size:16px;height:46px}
  .body.full > .chat.chat-empty .chat-in .send,.body.full > .chat.chat-empty .chat-in .chat-plus{width:46px;height:46px;border-radius:14px}
  .body.full > .chat .chat-sugg{max-width:100%}
}
@media (max-width:860px){
  .chat-sugg{grid-template-columns:1fr;max-height:34vh;overflow:auto;margin:6px 0 10px}
  .body.full > .chat.chat-empty .chat-log{justify-content:center}
  .ch-s{padding:9px 11px;font-size:12.5px}
}
@media (max-width:860px){
  .body.full > .chat.chat-empty .chat-hello{padding:8px 0 4px;margin:auto 0}
  .body.full > .chat.chat-empty .ch-bot svg{width:46px;height:46px}
  .body.full > .chat.chat-empty .ch-logo{width:46px;height:46px;border-radius:15px}
  .body.full > .chat.chat-empty .ch-logo.ini b{font-size:16px}
  .body.full > .chat.chat-empty .chat-hello h2{font-size:21px;margin:8px 0 6px}
  .body.full > .chat.chat-empty .chat-hello p{font-size:12.5px;line-height:1.45;margin:0 0 4px}
  .chat-sugg{max-height:29vh}
}
@media (max-width:860px) and (max-height:720px){.body.full > .chat.chat-empty .chat-hello p{display:none}}

/* ---------- 0.37: "+" del chat (subir o adjuntar de Mis creaciones) ---------- */
.chat-in{position:relative}
.cplus-menu{position:absolute;left:8px;bottom:calc(100% + 8px);width:min(320px,calc(100vw - 40px));background:var(--panel);border:1px solid var(--line2);border-radius:16px;padding:6px;box-shadow:0 24px 60px #000b;z-index:30;display:grid;gap:2px;animation:cpIn .14s ease-out}
.cplus-menu button{display:flex;align-items:center;gap:12px;padding:10px;border-radius:11px;text-align:left;width:100%}
.cplus-menu button:hover,.cplus-menu button:focus-visible{background:var(--panel2)}
.cplus-menu strong{display:block;font-size:13.5px}
.cplus-menu small{display:block;color:var(--muted);font-size:12px}
.cp-ic{width:36px;height:36px;border-radius:10px;background:var(--panel2);display:grid;place-items:center;font-size:17px;flex:0 0 auto}
@keyframes cpIn{from{opacity:0;transform:translateY(6px)}}
.crp-grid .pitem{position:relative}
.crp-grid .pitem video{width:100%;height:100%;object-fit:cover;display:block}
.crp-grid .pitem .pl{position:absolute;right:6px;bottom:6px;width:22px;height:22px;border-radius:50%;background:#000a;display:grid;place-items:center}
.crp-grid .pitem .pl .i{width:11px;height:11px}
.crp-grid .pitem.on{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent) inset}
.crp-ck{position:absolute;top:6px;left:6px;width:22px;height:22px;border-radius:50%;border:2px solid #fff;background:#0006;font-style:normal;font-size:11px;font-weight:800;display:grid;place-items:center;color:var(--accent-ink)}
.crp.on .crp-ck{background:var(--accent);border-color:var(--accent)}
.crp-more{display:flex;justify-content:center;margin-top:10px}
.crp-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.crp-foot small{color:var(--muted)}
.cf .cf-job{position:absolute;left:3px;bottom:3px;font-size:9px;font-weight:800;padding:1px 4px;border-radius:4px;background:#000b;color:var(--accent)}
.hm-aud{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:10px;background:linear-gradient(160deg,#1b2a2f,#0e1214)}
.hm-aud b{font-size:30px}
.hm-aud i{display:flex;align-items:center;gap:2px;height:30px}
.hm-aud i{width:96px}
.hm-aud i i{flex:1;border-radius:2px;background:#90e0efb3;min-height:3px}

/* ---------- Restyle: Estándar / Premium ---------- */
.rs-tiers{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:14px}
.rs-tier{display:grid;gap:2px;text-align:left;padding:12px 14px;border-radius:14px;border:1px solid var(--line2);background:var(--panel2);transition:border-color .15s,background .15s}
.rs-tier b{font-size:15px}
.rs-tier span{font-size:12px;font-weight:700;color:var(--accent)}
.rs-tier small{font-size:11.5px;color:var(--muted);line-height:1.35;margin-top:2px}
.rs-tier.on{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 9%,var(--panel2))}
.rs-tier:hover{border-color:var(--accent)}

/* ---------- Inicio: novedades (plantillas virales y estilos) ---------- */
.hm-new{margin:6px 0 22px}
.hm-new-h{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:12px}
.hm-new-h small{display:block;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
.hm-new-h h3{font-size:20px;font-weight:800;letter-spacing:-.02em;margin-top:4px}
.hm-new-h p{color:var(--muted);font-size:13px;margin-top:2px}
.hm-strip2{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(150px,170px);gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px;scrollbar-width:thin}
.hm-strip2>*{scroll-snap-align:start}
.hm-strip2 .vr-card .vr-tx small{-webkit-line-clamp:2}
.hm-ws{position:relative;display:block;aspect-ratio:3/4;border-radius:16px;overflow:hidden;border:1px solid var(--line);background:var(--panel2);padding:0;text-align:left;transition:transform .3s cubic-bezier(.2,.8,.2,1),border-color .2s}
.hm-ws:hover{transform:translateY(-3px);border-color:#d7fa7866}
.hm-ws img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hm-ws::after{content:"";position:absolute;inset:50% 0 0;background:linear-gradient(transparent,#000c)}
.hm-ws span{position:absolute;left:10px;right:10px;bottom:10px;z-index:1;color:#fff;font-weight:800;font-size:14px;line-height:1.2}
.hm-ws em{position:absolute;left:8px;top:8px;z-index:1;font-style:normal;font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:4px 8px;border-radius:999px;background:#000a;color:#fff}
@media (max-width:760px){.hm-strip2{grid-auto-columns:minmax(132px,148px);gap:10px}.hm-new-h h3{font-size:17px}}
.bprop-logo{display:flex;align-items:center;gap:12px;margin:10px 0;padding:10px;border-radius:14px;background:repeating-conic-gradient(#ffffff10 0 25%,transparent 0 50%) 0 0/16px 16px,var(--panel2);border:1px solid var(--line)}
.bprop-logo img{width:84px;height:84px;object-fit:contain}
.bprop-logo small{color:var(--muted);font-size:12px}
.hm-new-h .linkish{white-space:nowrap}
/* 0.44 · audios en el chat y video con voz en off */
.cf-aud{display:grid;place-items:center;align-content:center;gap:1px;font-size:18px;background:linear-gradient(135deg,#2a2350,#183a33)}
.cf-aud small{font-size:9.5px;color:#fff;font-weight:700;letter-spacing:.02em}
.nr-strip{display:flex;gap:6px;overflow-x:auto;padding:2px 0 6px;scrollbar-width:thin}
.nr-strip figure{margin:0;flex:0 0 76px;display:grid;gap:3px}
.nr-strip img,.nr-strip figure>span{width:76px;height:96px;object-fit:cover;border-radius:10px;border:1px solid var(--line);background:var(--panel2);display:block}
.nr-strip figcaption{font-size:10.5px;color:var(--dim);line-height:1.25;display:grid}
.nr-strip figcaption i{font-style:normal;color:var(--text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cf-html{display:grid;place-items:center;align-content:center;gap:1px;font-size:15px;font-weight:800;color:#fff;background:linear-gradient(135deg,#1d2b4a,#3a1d4a)}
.cf-html small{font-size:9.5px;font-weight:700;letter-spacing:.04em}
.html-pre,.code-pre{margin:8px 0;max-height:220px;overflow:auto;background:#0b0d0c;border:1px solid var(--line);border-radius:10px;padding:10px 12px;font:11.5px/1.45 ui-monospace,SFMono-Regular,Menlo,monospace;color:#cfd6d0;white-space:pre-wrap;word-break:break-word}
.html-xc .html-pre{max-height:140px}
/* Descargar motion: elegir calidad */
.bxq{display:grid;gap:12px;padding:4px}
.bxq-g{display:grid;gap:8px}
.bxq-o{display:grid;gap:2px;text-align:left;padding:12px 14px;border:1px solid var(--line2);border-radius:12px;background:var(--panel2)}
.bxq-o b{font-size:14px}
.bxq-o small{color:var(--muted);font-size:12px}
.bxq-o.on{border-color:var(--accent);background:#d7fa780f}
.bxq-o:hover{border-color:var(--accent)}
.bxq .prop-acts{justify-content:flex-end}
.chat-stuck{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:10px 0 0 46px;padding:10px 12px;border:1px solid #ffb86b55;background:#ffb86b12;border-radius:12px;font-size:13px;color:#ffd7a6}

/* =====================================================================
   0.49 · Marco del Studio (escritorio ancho): Crear a la izquierda, Producir a la derecha,
   Tu estudio abajo. Los tres quedan fijos; solo el centro se desplaza.
   ===================================================================== */
.fr-rail,.fr-dock{display:none}
@media (min-width:1280px){
  .shell.framed{--fl:224px;--fr:236px;--side:var(--fl);grid-template-columns:var(--fl) minmax(0,1fr) var(--fr)}
  .shell.framed.fr-compact{--fl:76px;--fr:76px}
  .shell.framed > .side{display:none}
  .fr-rail{display:flex;flex-direction:column;gap:6px;height:100vh;height:100dvh;overflow-y:auto;overflow-x:hidden;scrollbar-width:none;overscroll-behavior:contain;padding:16px 12px;background:#0a0c0b}
  .fr-rail::-webkit-scrollbar{display:none}
  .fr-l{border-right:1px solid var(--line)}
  .fr-r{border-left:1px solid var(--line);padding-top:24px}
  .fr-logo{display:flex;align-items:center;gap:10px;padding:2px 6px 14px;font-weight:800;font-size:15px;letter-spacing:-.3px;white-space:nowrap;overflow:hidden}
  .fr-logo img{width:34px;height:34px;flex-shrink:0}
  .fr-g{display:flex;flex-direction:column;gap:3px}
  .fr-h{font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);padding:6px 8px 6px;white-space:nowrap}
  .fr-it{position:relative;display:flex;align-items:center;gap:11px;width:100%;padding:8px;border-radius:13px;color:var(--muted);text-align:left;border:1px solid transparent;transition:background .15s,color .15s,border-color .15s}
  .fr-it:hover{background:var(--panel);color:var(--text)}
  .fr-it.on{background:linear-gradient(135deg,#d7fa7816,#d7fa7806);border-color:#d7fa7840;color:var(--text)}
  .fr-it.on .fr-ic{background:var(--accent);color:var(--accent-ink);border-color:transparent}
  .fr-ic{width:36px;height:36px;flex-shrink:0;border-radius:11px;display:grid;place-items:center;background:var(--panel);border:1px solid var(--line);overflow:hidden}
  .fr-ic svg{width:18px;height:18px}
  .fr-ic .pup{width:28px;height:28px}
  .fr-av{font-weight:800;color:var(--text)}
  .fr-tx{display:flex;flex-direction:column;min-width:0;line-height:1.2}
  .fr-tx b{font-size:13.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .fr-tx small{font-size:11px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  /* 0.59 · la etiqueta va junto al nombre (si no cabe, baja a la línea siguiente): nunca tapa texto */
  .fr-tx b.has-new{white-space:normal;overflow:visible}
  .fr-it .new{display:inline-block;vertical-align:1px;margin-left:2px;font-style:normal;font-size:8px;line-height:1.3;font-weight:800;letter-spacing:.05em;text-transform:uppercase;padding:1px 5px;border-radius:6px;background:var(--accent);color:var(--accent-ink);white-space:nowrap}
  .fr-foot{margin-top:auto;display:flex;flex-direction:column;gap:6px;padding-top:12px;border-top:1px solid var(--line)}
  .fr-mini{align-self:flex-end;width:30px;height:30px;border-radius:9px;border:1px solid var(--line2);color:var(--muted);font-size:15px;font-weight:800}
  .fr-mini:hover{color:var(--text);border-color:var(--muted)}
  .fr-bit{margin-top:auto;display:flex;align-items:center;gap:10px;padding:12px;border-radius:16px;text-align:left;background:radial-gradient(120% 120% at 0% 0%,#d7fa7826,transparent 60%),var(--panel);border:1px solid #d7fa7838;transition:transform .2s,border-color .2s}
  .fr-bit:hover{transform:translateY(-2px);border-color:var(--accent)}
  .fr-bit .fr-tx b{color:var(--text)}
  /* dock inferior: dentro de la columna central, siempre visible */
  .fr-dock{display:flex;align-items:center;gap:6px;flex-shrink:0;padding:8px 14px;border-top:1px solid var(--line);background:#0a0c0bf2;backdrop-filter:blur(12px);overflow-x:auto;scrollbar-width:none}
  .fr-dock::-webkit-scrollbar{display:none}
  .fr-dock .fr-h{padding:0 8px 0 2px}
  .fr-d{display:inline-flex;align-items:center;gap:7px;padding:8px 12px;border-radius:11px;color:var(--muted);font-size:12.5px;font-weight:700;white-space:nowrap;border:1px solid transparent}
  .fr-d svg{width:16px;height:16px}
  .fr-d:hover{background:var(--panel);color:var(--text)}
  .fr-d.on{color:var(--text);background:#d7fa7812;border-color:#d7fa7840}
  .fr-d.on svg{color:var(--accent)}
  .shell.framed .main{height:100vh;height:100dvh}
  .shell.framed .body{grid-template-rows:minmax(0,1fr)}
  .shell.framed .body.full > .chat{height:100%;min-height:0}
  /* compacto (editores o a pedido): solo íconos */
  .fr-compact .fr-rail{padding:14px 10px;align-items:center}
  .fr-compact .fr-tx,.fr-compact .fr-h,.fr-compact .fr-logo span,.fr-compact .fr-it .new{display:none}
  .fr-compact .fr-it{justify-content:center;padding:6px;width:auto}
  .fr-compact .fr-g{align-items:center;padding-bottom:8px;border-bottom:1px solid var(--line)}
  .fr-compact .fr-logo{padding:2px 0 10px}
  .fr-compact .fr-bit{padding:6px;justify-content:center}
  .fr-compact .fr-mini{align-self:center}
  .fr-compact .fr-dock{padding:5px 12px}
  .fr-compact .fr-d{padding:6px 10px;font-size:12px}
}
@media (min-width:1280px) and (max-width:1439px){.shell.framed:not(.fr-compact){--fl:206px;--fr:214px}}
@media (min-width:1280px){
  .shell.framed ~ .asst-fab,.shell.framed .asst-fab{display:none}
  .fr-bit.on{border-color:var(--accent)}
  .shell.framed:not(.fr-compact) .fr-d{padding:8px 10px}
}
/* texto del Studio para buscadores (se ve solo mientras carga) */
.boot-seo{max-width:640px;padding:0 20px;text-align:center;color:var(--dim);font-size:13px}
.boot-seo h1{font-size:15px;color:var(--muted);margin:8px 0 6px}
.boot-seo nav{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 12px;margin-top:10px}
.boot-seo a{color:var(--dim);text-decoration:none}

/* ---------- 0.50.1 · Rieles a lo alto, flecha de Express y Bit 3D en el Inicio ---------- */
@media (min-width:1280px){
  .fr-l .fr-g,.fr-r .fr-g{flex:1 1 auto;display:flex;flex-direction:column;gap:3px;min-height:0}
  .fr-g .fr-h{flex:none}
  .fr-g .fr-it{flex:1 1 0;min-height:40px;max-height:74px}
  .fr-r .fr-bit{flex:none;margin-top:10px}
  .fr-l .fr-foot{flex:none}
  .fr-chev{margin-left:auto;display:grid;place-items:center;color:var(--dim);transition:transform .2s,color .2s}
  .fr-chev svg.i{width:16px;height:16px}
  .fr-it:hover .fr-chev,.fr-it.open .fr-chev{color:var(--text)}
  .fr-it.open .fr-chev{transform:translateX(3px)}
  .fr-compact .fr-chev{position:absolute;right:2px;top:50%;transform:translateY(-50%)}
  .fr-compact .fr-chev svg.i{width:12px;height:12px}
}
.hm-stage3d{position:relative;width:100%;height:100%;min-height:250px;display:grid;place-items:center}
.hm-stage3d canvas{position:absolute;inset:0;width:100%!important;height:100%!important;display:block;z-index:1;cursor:pointer}
.hm-stage3d.on3d .hm-bit3d,.hm-stage3d.on3d .hm-shadow{display:none}
.hm-bit3d{filter:drop-shadow(0 12px 14px rgba(0,0,0,.28))}
.hm-shadow{height:12px;background:radial-gradient(rgba(0,0,0,.35),transparent 70%)}
.hm-bub.pop{animation:hmPop .45s cubic-bezier(.2,1.4,.4,1)}
@keyframes hmPop{from{transform:scale(.8)}to{transform:none}}
.hm-board-l,.hm-pen,.hm-note,.hm-sw,.hm-sel i,.hm-sel-tag{display:none}

/* ---------- 0.50.2 · Tarjetas del Inicio con animación propia (hx) ----------
   Arriba un escenario oscuro con la animación de la función; abajo el texto sobre fondo liso. */
.ht.hx{flex-direction:column;align-items:stretch;min-height:340px;background:var(--panel)}
.ht.hx .ht-shade{display:none}
.hx-art{position:relative;display:block;height:206px;flex:none;overflow:hidden;background:radial-gradient(120% 90% at 50% 0%,#1c2230 0%,#0d0f12 70%);border-bottom:1px solid var(--line)}
.hx-art::after{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:24px 24px}
.hx-b{display:flex;flex-direction:column;gap:4px;padding:16px 20px 20px;flex:1}
.hx-b small{font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--acc,var(--accent))}
.hx-b strong{font-size:20px;letter-spacing:-.02em;font-weight:800;line-height:1.15;color:var(--text)}
.hx-b em{font-style:normal;font-size:13.5px;line-height:1.45;color:var(--muted)}
.ht.hx .ht-badge{z-index:3}
.ht.hx .ht-go{z-index:3}
.ht.hx:hover .hx-art{filter:saturate(1.15)}
.hx *{box-sizing:border-box}

/* 1 · Influencers: celular en vivo, subtítulos palabra por palabra, onda de voz y producto */
.hx-if .hx-art{background:radial-gradient(90% 90% at 70% 10%,#7b3cff 0%,#2a1060 45%,#100a1c 100%)}
.hx-phone{position:absolute;left:50%;top:18px;width:104px;height:178px;margin-left:-70px;border-radius:18px;background:#000;border:3px solid #23202b;overflow:hidden;box-shadow:0 20px 40px -10px #000c;animation:hxFloat 6s ease-in-out infinite}
.hx-face{position:absolute;inset:0;background-size:cover;background-position:center 20%;animation:hxKen 9s ease-in-out infinite alternate}
.hx-live{position:absolute;left:6px;top:6px;font:800 8px/1 var(--font);color:#fff;background:#ff2e5b;padding:3px 5px;border-radius:4px;letter-spacing:.06em}
.hx-sub{position:absolute;left:6px;right:6px;bottom:30px;text-align:center;font:800 10px/1.25 var(--font);color:#fff;text-shadow:0 1px 3px #000}
.hx-sub b{opacity:.25;animation:hxWord 5.6s infinite}
.hx-sub b:nth-child(2){animation-delay:.4s}.hx-sub b:nth-child(3){animation-delay:.8s}.hx-sub b:nth-child(4){animation-delay:1.2s}.hx-sub b:nth-child(5){animation-delay:1.6s}.hx-sub b:nth-child(6){animation-delay:2s}.hx-sub b:nth-child(7){animation-delay:2.4s}
@keyframes hxWord{0%{opacity:.25;color:#fff}6%{opacity:1;color:#D4F36B}14%,70%{opacity:1;color:#fff}85%,100%{opacity:.25}}
.hx-wave{position:absolute;left:10px;right:10px;bottom:10px;height:14px;display:flex;align-items:center;gap:2px}
.hx-wave i{flex:1;height:30%;border-radius:2px;background:#D4F36B;animation:hxWave .9s ease-in-out infinite}
.hx-wave i:nth-child(3n){animation-delay:.2s}.hx-wave i:nth-child(3n+1){animation-delay:.45s}.hx-wave i:nth-child(4n){animation-duration:.7s}
@keyframes hxWave{0%,100%{height:25%}50%{height:100%}}
.hx-prod{position:absolute;right:16%;top:46%;display:flex;align-items:center;gap:7px;padding:5px 10px 5px 5px;border-radius:12px;background:#fff;color:#15171A;font:800 11px/1 var(--font);box-shadow:0 12px 26px -8px #000a;animation:hxProd 5.6s cubic-bezier(.2,.9,.3,1.2) infinite}
.hx-prod i{width:28px;height:28px;border-radius:8px;background-size:cover;background-position:center}
@keyframes hxProd{0%,30%{opacity:0;transform:translateX(30px) scale(.8)}38%,85%{opacity:1;transform:none}95%,100%{opacity:0;transform:translateY(-8px)}}
.hx-heart{position:absolute;left:calc(50% + 30px);bottom:20px;color:#ff4d8d;font-size:16px;opacity:0;animation:hxHeart 3s ease-out infinite}
.hx-heart.h2{animation-delay:1.4s;color:#D4F36B;left:calc(50% + 40px)}
@keyframes hxHeart{0%{opacity:0;transform:translateY(0) scale(.6)}20%{opacity:1}100%{opacity:0;transform:translateY(-90px) scale(1.2) rotate(15deg)}}
@keyframes hxFloat{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-6px) rotate(1deg)}}
@keyframes hxKen{from{transform:scale(1.05)}to{transform:scale(1.18) translateY(-4%)}}

/* 2 · Lyrics: karaoke palabra por palabra, ecualizador y barra de canción */
.hx-ly .hx-art{background:radial-gradient(80% 80% at 20% 0%,#ff3e9a55,transparent 60%),radial-gradient(80% 80% at 90% 100%,#29e5ff44,transparent 60%),#0c0a14}
.hx-lines{position:absolute;left:0;right:0;top:26px;display:flex;flex-direction:column;align-items:center;gap:2px;font:800 26px/1.05 "Bricolage Grotesque",var(--font);letter-spacing:-.03em}
.hx-lines span{white-space:nowrap}
.hx-lines b{display:inline-block;color:rgba(255,255,255,.18);animation:hxKara 6s infinite}
.hx-lines .l1 b:nth-child(1){animation-delay:0s}.hx-lines .l1 b:nth-child(2){animation-delay:.35s}.hx-lines .l1 b:nth-child(3){animation-delay:.7s}
.hx-lines .l2 b:nth-child(1){animation-delay:1.3s}.hx-lines .l2 b:nth-child(2){animation-delay:1.65s}
.hx-lines .l3 b:nth-child(1){animation-delay:2.3s}.hx-lines .l3 b:nth-child(2){animation-delay:2.65s;font-size:1.25em}
@keyframes hxKara{0%{color:rgba(255,255,255,.18);transform:none}4%{color:#D4F36B;transform:translateY(-4px) scale(1.08);text-shadow:0 0 18px #D4F36B88}12%,70%{color:#fff;transform:none;text-shadow:none}80%,100%{color:rgba(255,255,255,.18)}}
.hx-eq{position:absolute;left:18px;right:18px;bottom:30px;height:36px;display:flex;align-items:flex-end;gap:3px}
.hx-eq i{flex:1;border-radius:2px 2px 0 0;background:linear-gradient(#ff3e9a,#7a3cff);animation:hxEq 1.1s ease-in-out infinite;height:20%}
.hx-eq i:nth-child(2n){animation-delay:.15s;animation-duration:.8s}.hx-eq i:nth-child(3n){animation-delay:.35s;background:linear-gradient(#29e5ff,#7a3cff)}.hx-eq i:nth-child(5n){animation-duration:1.4s}
@keyframes hxEq{0%,100%{height:15%}50%{height:100%}}
.hx-bar{position:absolute;left:18px;right:70px;bottom:14px;height:4px;border-radius:2px;background:rgba(255,255,255,.15);overflow:hidden}
.hx-bar i{position:absolute;inset:0;background:#D4F36B;transform-origin:left;animation:hxProg 6s linear infinite}
@keyframes hxProg{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.hx-time{position:absolute;right:16px;bottom:9px;font:700 10px/1 "Space Mono",ui-monospace,monospace;color:rgba(255,255,255,.7)}

/* 3 · Grabador: ventana con cursor que hace clic, recorte automático, cámara y reloj REC */
.hx-gs .hx-art{background:linear-gradient(160deg,#1a1f27,#0e1014)}
.hx-win{position:absolute;left:22px;right:62px;top:22px;bottom:22px;border-radius:10px;background:#f5f3ee;overflow:hidden;box-shadow:0 18px 40px -14px #000}
.hx-chrome{display:flex;align-items:center;gap:4px;height:18px;padding:0 7px;background:#e3ddd0}
.hx-chrome i{width:6px;height:6px;border-radius:50%;background:#ff5f57}.hx-chrome i:nth-child(2){background:#febc2e}.hx-chrome i:nth-child(3){background:#28c840}
.hx-chrome em{margin-left:8px;font:600 8px/1 var(--font);font-style:normal;color:#63625b;background:#fff;padding:2px 8px;border-radius:5px}
.hx-page{position:absolute;inset:26px 10px 10px;display:flex;flex-direction:column;gap:5px}
.hx-page > i{display:block;height:6px;border-radius:3px;background:#d8d2c4}.hx-page > i.h{height:12px;width:55%;background:#15171A}.hx-page > i.s{width:40%}
.hx-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-top:4px;flex:1}
.hx-cards i{border-radius:5px;background:linear-gradient(135deg,#ff4d8d,#7a3cff)}.hx-cards i:nth-child(2){background:linear-gradient(135deg,#2F6BFF,#12B8E0)}.hx-cards i:nth-child(3){background:linear-gradient(135deg,#D4F36B,#7CB518)}
.hx-crop{position:absolute;inset:6px;border:2px dashed #D4F36B;border-radius:6px;animation:hxCrop 6s ease-in-out infinite}
.hx-crop i{position:absolute;width:8px;height:8px;background:#D4F36B;border-radius:2px}
.hx-crop i:nth-child(1){left:-5px;top:-5px}.hx-crop i:nth-child(2){right:-5px;top:-5px}.hx-crop i:nth-child(3){left:-5px;bottom:-5px}.hx-crop i:nth-child(4){right:-5px;bottom:-5px}
@keyframes hxCrop{0%,35%{inset:6px;opacity:0}45%{opacity:1}60%,90%{inset:24px 8px 8px 8px;opacity:1}100%{opacity:0}}
.hx-cur{position:absolute;left:20%;top:30%;width:16px;height:16px;animation:hxCur 6s ease-in-out infinite}
.hx-cur svg{width:16px;height:16px;fill:#fff;stroke:#15171A;stroke-width:1.6;stroke-linejoin:round;position:relative;z-index:2}
.hx-cur .rip{position:absolute;left:-6px;top:-6px;width:16px;height:16px;border-radius:50%;border:2px solid #2F6BFF;opacity:0;animation:hxRip 6s ease-out infinite}
@keyframes hxCur{0%{transform:translate(0,0)}25%{transform:translate(60px,40px)}30%{transform:translate(60px,40px) scale(.85)}34%{transform:translate(60px,40px)}60%{transform:translate(120px,10px)}100%{transform:translate(0,0)}}
@keyframes hxRip{0%,28%{opacity:0;transform:scale(.4)}30%{opacity:1}42%,100%{opacity:0;transform:scale(2.4)}}
.hx-cam{position:absolute;right:16px;bottom:20px;width:62px;height:62px;border-radius:50%;background-color:#15171A;background-size:78%;background-position:center;background-repeat:no-repeat;border:3px solid #D4F36B;box-shadow:0 10px 24px -6px #000c;animation:hxCam 4s ease-in-out infinite}
@keyframes hxCam{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
.hx-rec{position:absolute;right:14px;top:22px;display:flex;align-items:center;gap:6px;padding:5px 8px;border-radius:8px;background:#000a;font:700 10px/1 "Space Mono",ui-monospace,monospace;color:#fff}
.hx-rec > i{width:8px;height:8px;border-radius:50%;background:#ff3b3b;animation:hxBlink 1s steps(2) infinite}
@keyframes hxBlink{50%{opacity:.2}}
.hx-clock b{font-weight:700;display:inline-flex}
.hx-clock .d{display:inline-block;height:10px;overflow:hidden;vertical-align:top}
.hx-clock .d em{display:block;font-style:normal;height:10px;line-height:10px;animation:hxDigits 9s steps(9) infinite}
@keyframes hxDigits{from{transform:translateY(0)}to{transform:translateY(-90px)}}

/* 4 · Estudio: tarjeta que se da vuelta, cuestionario y nota */
.hx-st .hx-art{background:radial-gradient(90% 90% at 20% 0%,#12b8e044,transparent 60%),radial-gradient(70% 70% at 100% 100%,#D4F36B33,transparent 60%),#0d1418;perspective:700px}
.hx-card3d{position:absolute;left:22px;top:24px;width:58%;height:118px;transform-style:preserve-3d;animation:hxFlip 7s cubic-bezier(.6,0,.3,1) infinite}
.hx-card3d > span{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;gap:6px;padding:14px;border-radius:14px;backface-visibility:hidden;-webkit-backface-visibility:hidden;font:800 15px/1.2 "Bricolage Grotesque",var(--font);letter-spacing:-.01em}
.hx-card3d small{font:700 9px/1 var(--font);letter-spacing:.1em;text-transform:uppercase;opacity:.6}
.hx-card3d .f{background:#fff;color:#15171A;box-shadow:0 18px 30px -12px #000c}
.hx-card3d .b{background:#D4F36B;color:#172006;transform:rotateY(180deg);font-size:13px;box-shadow:0 18px 30px -12px #000c}
@keyframes hxFlip{0%,35%{transform:rotateY(0)}45%,85%{transform:rotateY(180deg)}95%,100%{transform:rotateY(360deg)}}
.hx-quiz{position:absolute;left:22px;bottom:30px;display:flex;gap:6px}
.hx-quiz i{width:24px;height:24px;border-radius:7px;display:grid;place-items:center;font:900 12px/1 var(--font);font-style:normal;opacity:0;transform:scale(.5);animation:hxQ 7s infinite}
.hx-quiz i.ok{background:#D4F36B;color:#172006}.hx-quiz i.no{background:#ff5a5a;color:#fff}
.hx-quiz i:nth-child(2){animation-delay:.25s}.hx-quiz i:nth-child(3){animation-delay:.5s}.hx-quiz i:nth-child(4){animation-delay:.75s}.hx-quiz i:nth-child(5){animation-delay:1s}
@keyframes hxQ{0%,8%{opacity:0;transform:scale(.5)}12%,88%{opacity:1;transform:none}96%,100%{opacity:0}}
.hx-grade{position:absolute;right:20px;top:34px;width:76px;height:76px;border-radius:50%;display:grid;place-content:center;text-align:center;background:#fff;color:#15171A;font:900 26px/1 "Bricolage Grotesque",var(--font);letter-spacing:-.03em;box-shadow:0 0 0 6px #ffffff22,0 16px 30px -10px #000c;animation:hxGrade 7s cubic-bezier(.2,1.5,.4,1) infinite}
.hx-grade small{font:800 9px/1 var(--font);letter-spacing:.12em;text-transform:uppercase;color:#63625b;margin-bottom:3px}
@keyframes hxGrade{0%,50%{transform:scale(0) rotate(-30deg)}58%,90%{transform:none}100%{transform:scale(0)}}
.hx-prog{position:absolute;left:22px;right:22px;bottom:16px;height:4px;border-radius:2px;background:rgba(255,255,255,.12);overflow:hidden}
.hx-prog i{position:absolute;inset:0;background:linear-gradient(90deg,#12b8e0,#D4F36B);transform-origin:left;animation:hxProg 7s ease-in-out infinite}

/* 5 · Modo Cine: película que corre con escenas, claqueta que se cierra y franjas de cine */
.hx-cn .hx-art{background:#0b0b0d}
.hx-strip{position:absolute;left:0;right:0;top:50%;height:112px;margin-top:-46px;background:#151515;border-top:9px dashed #2c2c2c;border-bottom:9px dashed #2c2c2c;overflow:hidden;transform:rotate(-4deg) scale(1.08)}
.hx-reel{position:absolute;left:0;top:6px;bottom:6px;display:flex;gap:8px;animation:hxReel 12s linear infinite}
.hx-reel i{position:relative;flex:none;width:130px;border-radius:4px;background-size:cover;background-position:center}
.hx-reel em{position:absolute;left:6px;bottom:5px;font:700 9px/1 "Space Mono",ui-monospace,monospace;font-style:normal;color:#fff;background:#000a;padding:3px 5px;border-radius:3px}
@keyframes hxReel{from{transform:translateX(0)}to{transform:translateX(-552px)}}
.hx-clap{position:absolute;left:18px;top:18px;width:96px;transform-origin:left bottom;z-index:2;filter:drop-shadow(0 10px 16px #000c)}
.hx-clap .top{display:block;height:16px;border-radius:3px 3px 0 0;background:repeating-linear-gradient(-55deg,#fff 0 10px,#15171A 10px 20px);transform-origin:4px 16px;animation:hxClap 3s ease-in infinite}
.hx-clap .body{display:flex;flex-direction:column;gap:2px;padding:7px 8px;background:#15171A;border:2px solid #fff;border-top:0;border-radius:0 0 4px 4px;font:700 9px/1.1 "Space Mono",ui-monospace,monospace;color:#fff}
@keyframes hxClap{0%,60%{transform:rotate(-24deg)}68%{transform:rotate(0)}72%{transform:rotate(-6deg)}76%,100%{transform:rotate(0)}}
.hx-lb{position:absolute;inset:0;pointer-events:none;background:linear-gradient(#000 0 8%,transparent 8% 92%,#000 92%)}

/* 6 · Revelado 3D: objeto que se desarma en capas con sus nombres */
.hx-rv .hx-art{background:radial-gradient(70% 80% at 50% 40%,#2b2f38,#0d0f12)}
.hx-iso{position:absolute;left:50%;top:50%;width:0;height:0;perspective:800px}
.hx-obj{position:absolute;left:-55px;top:-10px;width:110px;height:110px;transform-style:preserve-3d;transform:rotateX(62deg) rotateZ(-38deg);animation:hxSpin 10s linear infinite}
.hx-obj i{position:absolute;inset:0;border-radius:50%;transform-style:preserve-3d;animation:hxExplode 5s cubic-bezier(.6,0,.3,1) infinite}
.hx-obj .p1{background:radial-gradient(circle at 35% 30%,#ffffff,#cfcac0);box-shadow:inset 0 0 0 3px #e9e4d8,0 0 0 2px #00000030;--z:66px;--zz:22px}
.hx-obj .p2{background:radial-gradient(circle at 35% 30%,#8f8a7f,#5c574d);inset:6px;--z:38px;--zz:14px}
.hx-obj .p3{background:radial-gradient(circle at 35% 30%,#d68a4c,#8a4b1d);box-shadow:inset 0 0 0 4px #b26a33;--z:6px;--zz:6px}
.hx-obj .p4{background:radial-gradient(circle at 35% 30%,#efeae0,#bdb7aa);inset:-4px;--z:-30px;--zz:-2px}
@keyframes hxExplode{0%,15%{transform:translateZ(var(--zz))}45%,75%{transform:translateZ(var(--z))}100%{transform:translateZ(var(--zz))}}
@keyframes hxSpin{from{transform:rotateX(62deg) rotateZ(-38deg)}to{transform:rotateX(62deg) rotateZ(322deg)}}
.hx-obj em{position:absolute;left:100%;top:50%;margin-left:30px;white-space:nowrap;font:700 9px/1 "Space Mono",ui-monospace,monospace;font-style:normal;color:#D4F36B;transform:rotateZ(38deg) rotateX(-62deg);opacity:0;animation:hxLbl 5s infinite}
@keyframes hxLbl{0%,35%{opacity:0}48%,72%{opacity:1}85%,100%{opacity:0}}
.hx-dim{position:absolute;left:18px;bottom:16px;font:700 10px/1 "Space Mono",ui-monospace,monospace;color:rgba(255,255,255,.65);padding-left:22px;background:linear-gradient(#D4F36B,#D4F36B) 0 50%/16px 1px no-repeat}
.hx-fig{position:absolute;right:16px;bottom:16px;font:700 9px/1 "Space Mono",ui-monospace,monospace;letter-spacing:.08em;color:rgba(255,255,255,.45)}

/* 7 · Presentaciones: láminas que se apilan, gráfico que crece y formatos */
.hx-sl .hx-art{background:radial-gradient(90% 90% at 80% 0%,#2F6BFF55,transparent 60%),#0d1120}
.hx-deck{position:absolute;left:50%;top:22px;width:220px;height:140px;margin-left:-120px}
.hx-deck .s{position:absolute;inset:0;display:flex;flex-direction:column;gap:7px;padding:14px 16px;border-radius:10px;background:#fff;color:#15171A;box-shadow:0 20px 40px -14px #000d;animation:hxSlide 9s cubic-bezier(.6,0,.3,1) infinite}
.hx-deck .s b{font:800 14px/1.1 "Bricolage Grotesque",var(--font);letter-spacing:-.02em}
.hx-deck .s1 > i{display:block;height:6px;border-radius:3px;background:#e3ddd0}.hx-deck .s1 > i.w{width:60%}
.hx-deck .s1::after{content:"";position:absolute;left:16px;bottom:14px;width:46px;height:6px;border-radius:3px;background:#2F6BFF}
.hx-deck .s2{animation-delay:3s;background:#F6F3EC}
.hx-deck .s3{animation-delay:6s;background:#D4F36B}
.hx-deck .s3 em{font:700 11px/1.2 var(--font);font-style:normal;color:#172006}
.hx-deck .ch{flex:1;display:flex;align-items:flex-end;gap:8px;padding:0 4px;border-bottom:1.5px solid #15171A}
.hx-deck .ch i{flex:1;height:var(--h);border-radius:3px 3px 0 0;background:#2F6BFF;transform-origin:bottom;animation:hxGrow 9s ease-out infinite;animation-delay:3s}
.hx-deck .ch i:nth-child(4){background:#15171A}
@keyframes hxGrow{0%{transform:scaleY(0)}8%,30%{transform:scaleY(1)}34%,100%{transform:scaleY(0)}}
@keyframes hxSlide{0%{transform:translate(40px,30px) rotate(6deg);opacity:0;z-index:1}6%{transform:none;opacity:1;z-index:3}30%{transform:none;opacity:1;z-index:3}36%{transform:translate(-26px,-12px) rotate(-6deg) scale(.92);opacity:.6;z-index:2}62%{transform:translate(-40px,-18px) rotate(-8deg) scale(.86);opacity:0;z-index:1}100%{opacity:0}}
.hx-fmt{position:absolute;right:16px;bottom:16px;display:flex;gap:6px}
.hx-fmt b{font:800 10px/1 var(--font);letter-spacing:.06em;padding:5px 8px;border-radius:6px;background:#ffffff1f;color:#fff;border:1px solid #ffffff33}
.hx-fmt b:first-child{background:#ff5a5a;border-color:#ff5a5a}.hx-fmt b:last-child{background:#d04423;border-color:#d04423}

/* 8 · Motion: tipografía cinética que golpea, fondo que cambia y línea de tiempo */
.hx-mg .hx-art{animation:hxBg 6s steps(1) infinite;background:#15171A}
@keyframes hxBg{0%{background:#15171A}33%{background:#D4F36B}66%{background:#2F6BFF}}
.hx-kin{position:absolute;inset:0 0 34px;display:grid;place-items:center}
.hx-kin b{grid-area:1/1;font:900 46px/1 "Bricolage Grotesque",var(--font);letter-spacing:-.05em;opacity:0}
.hx-kin .k1{color:#fff;animation:hxK1 6s infinite}
.hx-kin .k2{color:#15171A;font-size:76px;animation:hxK2 6s infinite}
.hx-kin .k3{color:#fff;font-size:40px;animation:hxK3 6s infinite}
@keyframes hxK1{0%{opacity:0;transform:scale(2.4);filter:blur(6px)}5%,26%{opacity:1;transform:none;filter:none}32%,100%{opacity:0;transform:translateY(-30px)}}
@keyframes hxK2{0%,33%{opacity:0;transform:scale(.2) rotate(-12deg)}38%{opacity:1;transform:scale(1.15) rotate(3deg)}42%,60%{opacity:1;transform:none}65%,100%{opacity:0;transform:scale(1.6)}}
@keyframes hxK3{0%,66%{opacity:0;transform:translateX(-120%) skewX(-12deg)}71%,93%{opacity:1;transform:none}98%,100%{opacity:0;transform:translateX(120%)}}
.hx-tlk{position:absolute;left:16px;right:16px;bottom:12px;height:20px;border-radius:6px;background:#000000aa;display:flex;align-items:center;gap:0;padding:0 8px}
.hx-tlk i{flex:1;height:2px;background:#ffffff33;position:relative}
.hx-tlk i::after{content:"";position:absolute;right:-4px;top:-3px;width:8px;height:8px;background:#D4F36B;transform:rotate(45deg)}
.hx-tlk b{position:absolute;top:2px;bottom:2px;left:8px;width:2px;background:#ff4d8d;animation:hxPlay 6s linear infinite}
@keyframes hxPlay{from{left:8px}to{left:calc(100% - 10px)}}

/* 9 · Plantillas: cuatro recetas que se acomodan */
.hx-grid4{position:absolute;inset:14px;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.hx-grid4 i{border-radius:10px;background-size:cover;background-position:center;box-shadow:0 10px 20px -10px #000;animation:hxTile 8s ease-in-out infinite;animation-delay:calc(var(--k) * .4s)}
@keyframes hxTile{0%,100%{transform:none}12%{transform:scale(1.05) rotate(var(--r,-1deg))}24%{transform:none}}
.hx-grid4 i:nth-child(2n){--r:1.5deg}

@media (max-width:760px){
  .ht.hx{min-height:0}
  .hx-art{height:150px}
  .hx-b{padding:12px 14px 14px}
  .hx-b strong{font-size:16px}
  .hx-b em{font-size:12px}
  .hx-phone{transform:scale(.75);top:0}
  .hx-lines{font-size:18px;top:16px}
  .hx-eq{height:22px;bottom:24px}
  .hx-win{left:12px;right:46px;top:14px;bottom:14px}
  .hx-cam{width:44px;height:44px;right:8px;bottom:12px}
  .hx-card3d{left:12px;top:14px;width:62%;height:86px}.hx-card3d > span{font-size:12px;padding:10px}.hx-card3d .b{font-size:10.5px}
  .hx-grade{width:54px;height:54px;font-size:18px;right:10px;top:22px}
  .hx-quiz{left:12px;bottom:22px}.hx-quiz i{width:18px;height:18px;font-size:10px}
  .hx-strip{height:84px;margin-top:-34px}.hx-reel i{width:96px}
  .hx-clap{transform:scale(.75);transform-origin:left top}
  .hx-obj{transform:rotateX(62deg) rotateZ(-38deg) scale(.7)}
  .hx-obj em{display:none}
  .hx-deck{transform:scale(.68);transform-origin:center top;top:12px}
  .hx-kin b{font-size:30px}.hx-kin .k2{font-size:48px}.hx-kin .k3{font-size:26px}
}
@media (prefers-reduced-motion:reduce){.hx *{animation:none!important}}
/* hx: el contenido arranca bajo la fila de "Nuevo" y la flecha */
.hx-phone{top:30px;height:168px;margin-left:-34px}
.hx-prod{right:auto;left:14px;top:auto;bottom:22px}
.hx-heart{left:calc(50% + 80px)}.hx-heart.h2{left:calc(50% + 90px)}
.hx-lines{top:50px;font-size:24px}
.hx-eq{height:28px;bottom:28px}
.hx-win{top:52px;bottom:14px}
.hx-rec{top:auto;bottom:86px;right:12px}
.hx-card3d{top:52px;height:96px}
.hx-card3d > span{font-size:14px}
.hx-quiz{bottom:22px;left:auto;right:22px}
.hx-grade{top:auto;bottom:44px;right:auto;left:calc(58% + 34px);width:64px;height:64px;font-size:22px}
.hx-prog{bottom:10px}
.hx-clap{top:auto;bottom:12px;left:14px}
.hx-strip{margin-top:-56px}
.hx-deck{top:50px;height:120px;width:200px;margin-left:-110px}
@media (max-width:760px){
  .hx-phone{top:4px}
  .hx-prod{display:none}
  .hx-lines{top:40px;font-size:17px}
  .hx-eq{height:18px;bottom:22px}
  .hx-time{display:none}.hx-bar{right:14px;left:14px;bottom:10px}
  .hx-win{top:42px}
  .hx-rec{display:none}
  .hx-card3d{top:42px;height:72px}
  .hx-grade{display:none}
  .hx-quiz{right:12px}
  .hx-deck{top:40px}
  .hx-iso{transform:scale(.6)}
  .hx-fig{display:none}
}
.hx-clap{left:auto;right:16px;bottom:16px;width:84px}
.hx-clap .top{height:14px}

/* ---------- 0.50.3 · Pantalla completa por sección ---------- */
.fs-btn{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:12px;border:1px solid var(--line2);background:var(--panel);color:var(--text);transition:border-color .2s,transform .15s}
.fs-btn:hover{border-color:var(--text);transform:translateY(-1px)}
.fs-btn svg.i{width:18px;height:18px}
html.qbp-full .fr-rail,html.qbp-full .fr-dock,html.qbp-full .side,html.qbp-full .mnav,html.qbp-full .tabbar{display:none!important}
html.qbp-full .shell,html.qbp-full .shell.framed{grid-template-columns:minmax(0,1fr)!important;--side:0px}
html.qbp-full .xfly{left:0!important}
@media (max-width:760px){.fs-btn{display:none}}

/* ---------- 0.50.4 · Logo al centro de la barra superior (rieles simétricos) ---------- */
.top{position:relative}
.top-logo{display:none}
@media (min-width:1280px){
  .top-logo{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:9px;font-weight:800;font-size:15px;letter-spacing:-.3px;white-space:nowrap;color:var(--text)}
  .top-logo img{width:30px;height:30px}
  .fr-l{padding-top:22px}
}

/* ---------- 0.50.6 · Perros sin sombra (el contorno ya los separa del fondo) ---------- */
img[src*="bit3d"],svg.pup,.ch-bot,.cn-hero-dir,.vh2-bit,.lp-dog svg,.lp-dog img,.hm-bit3d,.sx-bit,.sx-wbit,.sx-hbit,.fr-bit svg,.hx-cam{filter:none!important}
.hm-shadow{display:none!important}
.cn-hero-dir.full{width:200px;align-self:flex-end;margin-bottom:-6px}
.cn-hero-dir.full img{display:block;width:100%;height:auto;animation:cnBob 4s ease-in-out infinite;transform-origin:50% 90%}
@keyframes cnBob{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-8px) rotate(1deg)}}
@media (max-width:760px){.cn-hero-dir.full{width:130px;margin:0 auto}}
@media (prefers-reduced-motion:reduce){.cn-hero-dir.full img{animation:none}}
/* 0.56 · tarjeta de inicio: Explicativo técnico */
.hx-tcart{position:absolute;inset:0;background:radial-gradient(70% 70% at 60% 50%,#2a2310,#0b0b0c);overflow:hidden;color:#f5f4f0}
.hx-tc-k{position:absolute;bottom:16px;left:14px;font:700 9.5px/1 ui-monospace,Menlo,monospace;letter-spacing:2px;color:#ffc20e}
.hx-tc-tube{position:absolute;left:22%;top:34px;width:34px;height:calc(100% - 52px);max-height:150px;border-radius:5px;background:linear-gradient(90deg,#4f4b44,#d8d1c3 30%,#958d7f 60%,#3a3731);padding:4px;display:flex;flex-direction:column;gap:2px}
.hx-tc-tube i{display:block;border-radius:2px}
.hx-tc-tube .g{flex:1;background:linear-gradient(90deg,#14181d,#2c3946,#12161a)}
.hx-tc-tube .p{height:6px;background:#e9e3d6;box-shadow:inset 0 -2px 0 #c0392b;animation:hxtcp 2.6s ease-in-out infinite}
.hx-tc-tube .o{flex:2;background:linear-gradient(90deg,#5a3c00,#c98a00,#4f3500)}
@keyframes hxtcp{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.hx-tc-n{position:absolute;right:12%;top:30%;font:800 46px/1 system-ui,sans-serif;color:#ffc20e}
.hx-tc-n small{font-size:14px;color:#a8a49b;margin-left:3px}
.hx-tc-c{position:absolute;right:10%;bottom:14px;font:700 10px system-ui;letter-spacing:1px;padding:5px 10px;border-radius:99px;border:1px solid #ffc20e55;background:#ffc20e14;color:#ffe9a6}
@media (prefers-reduced-motion:reduce){.hx-tc-tube .p{animation:none}}
/* 0.59 · estilo del perfil en casilla aparte */
.br-style{margin-top:8px;border:1px solid var(--line2);border-radius:12px;padding:8px 10px 6px;background:var(--panel2)}
.br-style-h{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px}
.br-style-h label{font-size:12.5px;font-weight:700;color:var(--text)}
.br-style-h .x{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;color:var(--muted);border:1px solid var(--line2);background:var(--panel)}
.br-style-h .x:hover{color:var(--text)}
.br-style textarea{width:100%;min-height:64px;resize:vertical;font-size:13px;line-height:1.4}
.br-style .tip{margin:4px 0 0}
/* 0.59 · Contacto y feedback + WhatsApp */
.top .wa-btn{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:#25d366;color:#fff;flex-shrink:0}
.top .wa-btn:hover{filter:brightness(1.06)}
@media (max-width:760px){.top .wa-btn{display:none}}
@media (min-width:1280px){.shell.framed .top .wa-btn{display:none}} /* con rieles: está en «Contacto» del riel izquierdo */
.modal.ct-m{max-width:520px;width:100%}
.ct{display:grid;gap:12px}
.ct-wa{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:16px;background:#25d366;color:#fff;text-decoration:none}
.ct-wa svg{width:28px;height:28px;flex-shrink:0}
.ct-wa span{display:flex;flex-direction:column;flex:1;min-width:0}
.ct-wa b{font-size:15px}.ct-wa small{opacity:.9;font-size:12.5px}
.ct-wa > svg:last-child{width:18px;height:18px}
.ct-or{display:flex;align-items:center;gap:10px;color:var(--dim);font-size:12px}
.ct-or::before,.ct-or::after{content:"";flex:1;height:1px;background:var(--line2)}
.ct-f{display:grid;gap:10px}
.ct-types{display:flex;flex-wrap:wrap;gap:6px}
.ct-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ct-row .lbl{display:grid;gap:5px}
.ct-f textarea{width:100%;resize:vertical;min-height:110px}
.ct-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}
.ct-st{margin:0;font-size:13px;font-weight:600;min-height:1em}
.ct-st.err{color:var(--danger)}.ct-st.ok{color:var(--text)}
.ct-done{display:grid;justify-items:center;gap:6px;text-align:center;padding:14px 4px}
.ct-done span{font-size:34px}.ct-done small{color:var(--muted)}
.ct-done .btn{margin-top:8px}
@media (max-width:520px){.ct-row{grid-template-columns:1fr}}

/* ---------- 0.60 · Botón Maximizar con texto (escritorio y celular) ---------- */
.fs-btn{width:auto;display:inline-flex;align-items:center;gap:6px;padding:0 12px;font:600 13px/1 var(--font);white-space:nowrap}
.fs-btn span{display:inline}
@media (max-width:760px){
  .fs-btn{display:inline-flex;height:34px;padding:0 9px;font-size:12px;border-radius:10px;gap:4px}
  .fs-btn svg.i{width:15px;height:15px}
}
@media (max-width:380px){.fs-btn{padding:0 7px;font-size:11px}}

/* ---------- 0.60 · Chats con Bit (archivo de conversaciones) ---------- */
.chl{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.chl-it{display:flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--panel);border-radius:14px;padding:6px 8px 6px 6px}
.chl-it.on{border-color:var(--accent)}
.chl-main{flex:1;min-width:0;display:flex;align-items:center;gap:10px;text-align:left;background:none;border:0;color:var(--text);padding:6px;cursor:pointer;border-radius:10px}
.chl-main:hover{background:var(--panel2)}
.chl-ic{font-size:22px;flex:none}
.chl-tx{display:flex;flex-direction:column;min-width:0}
.chl-tx b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chl-tx small{color:var(--muted);font-size:12px;margin-top:2px}

/* ---------- 0.60 · Mis archivos ---------- */
.uf-grid{grid-template-columns:repeat(auto-fill,minmax(170px,1fr))}
.uf-it{border:1px solid var(--line);background:var(--panel);border-radius:14px;overflow:hidden;display:flex;flex-direction:column}
.uf-th{position:relative;aspect-ratio:1;background:var(--panel2);display:grid;place-items:center}
.uf-th img,.uf-th video{width:100%;height:100%;object-fit:cover;display:block}
.uf-k{position:absolute;left:8px;bottom:8px;background:rgba(0,0,0,.65);color:#fff;font-size:11px;padding:3px 7px;border-radius:8px}
.uf-aud{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:30px}
.uf-aud small{font-size:12px;color:var(--muted)}
.uf-b{padding:8px 10px 10px;display:flex;flex-direction:column;gap:8px}
.uf-b b{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.uf-b .row{display:flex;gap:6px}
.uf-b .row .pri{flex:1}
.uf-pick .uf-p{position:relative;display:grid;place-items:center}
.uf-pick .uf-p video{width:100%;height:100%;object-fit:cover;display:block}

/* 0.62 · Cadenas de acciones en el chat de Bit */
.msg.sys{display:flex;justify-content:center;margin:6px 0}
.msg.sys small{font-size:12px;color:var(--muted);background:var(--panel2);border:1px solid var(--line);border-radius:999px;padding:5px 12px;max-width:90%;text-align:center}
.prop.chain{border-color:var(--accent)}
.ch-steps{list-style:none;padding:0;margin:8px 0;display:grid;gap:6px}
.ch-steps li{display:grid;grid-template-columns:28px 1fr;gap:8px;align-items:start;padding:7px 9px;border-radius:12px;background:var(--panel2);border:1px solid var(--line)}
.ch-steps li>span{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--panel);font-size:13px}
.ch-steps li b{display:block;font-size:13px}
.ch-steps li small{display:block;color:var(--muted);font-size:11.5px;margin-top:2px}
.ch-steps li.ch-done>span{background:var(--accent);color:var(--accent-ink);font-weight:800}
.ch-steps li.cur{border-color:var(--accent)}
.ch-steps li.ch-done b{opacity:.75}
.prop.chain .prop-acts{flex-wrap:wrap;align-items:center}
.ch-tail{display:flex;gap:10px;align-items:center;margin:6px 0 10px 44px;padding:9px 12px;border-radius:14px;border:1px solid var(--line2);background:var(--panel);max-width:560px;font-size:13px}
.ch-tail>div{flex:1;display:grid;gap:2px;min-width:0}
.ch-tail small{color:var(--muted);font-size:12px}
.ch-tail.wait{border-color:var(--accent,#c8ef4a)}
@media (max-width:600px){.ch-tail{margin-left:0}}

/* ---------- 0.62.3 · Barra superior: título a la izquierda · logo al medio del espacio libre · botones a la derecha (nunca se montan) ---------- */
.top-l,.top-r{display:contents}
@media (min-width:1280px){
  .top{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:16px}
  .top-l{display:flex;align-items:center;gap:12px;grid-column:1}
  .top-l h1{white-space:nowrap}
  .top-l .sp{display:none}
  .top-r{display:flex;align-items:center;justify-content:flex-end;gap:12px;grid-column:3}
  .top-logo{position:static;transform:none;grid-column:2;min-width:0;width:100%;justify-content:center;overflow:hidden;container-type:inline-size;container-name:qlogo}
  .top-logo img{flex:0 0 30px}
}
/* si el nombre no cabe completo, queda solo el ícono (nunca cortado) */
@container qlogo (max-width:185px){.top-logo span{display:none}}
/* 0.62.4 · rubro o giro del perfil */
.pf-rub{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 12px}
.pf-rub .chip{font-size:12.5px}
.pf-rub .chip em{font-style:normal;font-size:10px;font-weight:700;opacity:.7;margin-left:3px}
.pf-req{color:#d9534f;font-weight:700}

/* 0.64.1 · caja del chat minimalista: sin el recuadro negro al escribir, esquinas suaves y botones livianos */
.chat-in textarea:focus,.chat-in textarea:focus-visible,.hm-ask input:focus,.hm-ask input:focus-visible{outline:none!important;box-shadow:none!important;border:0!important}
.chat-in{border-radius:26px!important;border:1px solid var(--line2)!important;padding:6px 6px 6px 8px!important;gap:4px!important;align-items:center!important;box-shadow:0 1px 2px rgba(0,0,0,.04),0 10px 30px -18px rgba(0,0,0,.25);transition:border-color .2s,box-shadow .2s}
.chat-in:focus-within{border-color:color-mix(in srgb,var(--accent) 55%,var(--line2))!important;box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 14%,transparent),0 10px 30px -18px rgba(0,0,0,.25)!important}
.chat-in textarea{padding:10px 6px!important;font-size:15.5px}
.chat-in .chat-plus,.chat-in .mic-btn,.chat-in .talk-btn{width:40px!important;height:40px!important;border-radius:50%!important;border:0!important;background:transparent!important;color:var(--muted)}
.chat-in .chat-plus:hover,.chat-in .mic-btn:hover,.chat-in .talk-btn:hover{background:color-mix(in srgb,var(--text) 6%,transparent)!important;color:var(--text)}
.chat-in .talk-btn.on{background:color-mix(in srgb,var(--accent) 18%,transparent)!important}
.chat-in .mic-btn.rec{background:#e5383b!important;color:#fff}
.chat-in .send{width:42px!important;height:42px!important;border-radius:50%!important}
.chat-in .chat-plus:focus-visible,.chat-in .mic-btn:focus-visible,.chat-in .talk-btn:focus-visible,.chat-in .send:focus-visible{outline:2px solid color-mix(in srgb,var(--accent) 60%,transparent)!important;outline-offset:2px}
.mic-live{border-radius:22px!important}
.mic-live .ml-x{border-radius:50%!important;border:0!important;background:color-mix(in srgb,var(--text) 6%,transparent)}
.mic-live .ml-go{border-radius:50%!important}
.hm-ask{border-radius:26px}
@media (max-width:760px){.chat-in .chat-plus,.chat-in .mic-btn,.chat-in .talk-btn{width:36px!important;height:36px!important}.chat-in .send{width:40px!important;height:40px!important}.chat-in{border-radius:24px!important}}

/* 0.65 · menú de la tarjeta: arriba lo rápido, abajo lo creativo; los textos ya no se cortan */
.card .cacts{z-index:3}
.card .cacts.cbot{top:auto;bottom:8px;transform:translateY(4px);gap:5px}
.card:hover .cacts.cbot,.card:focus-within .cacts.cbot,.card:focus-visible .cacts.cbot{transform:none}
.card .cacts .cact{position:static;backdrop-filter:none;-webkit-backdrop-filter:none;background:#000c}
.card .cacts .cact:hover{background:var(--accent)}
.card .cacts .cact[data-dng]:hover{background:#e0574f}
.cacts-sp{flex:1 1 auto}
.card .cacts.cbot .cact{width:30px;height:30px;border-radius:8px}
.card .cacts .cact .tip,.card .cacts>*:nth-last-child(-n+2) .tip{top:calc(100% + 6px);bottom:auto;left:0;right:auto;max-width:100%;white-space:normal;line-height:1.3;transform:translateY(-3px)}
.card .cacts.cbot .cact .tip,.card .cacts.cbot>*:nth-last-child(-n+2) .tip{top:auto;bottom:calc(100% + 6px);transform:translateY(3px)}
.card .cacts .cact:hover .tip,.card .cacts .cact:focus-visible .tip,.card .cacts>*:nth-last-child(-n+2):hover .tip{opacity:1;transform:none}
.card:has(.cbot) .meta{padding-bottom:50px}
.card:has(.cbot) .meta p{text-shadow:0 1px 2px #000}
@media (hover:none){.card .cacts.cbot{transform:none}}

/* 0.65 · presets de cámara */
.cam-blk .lbl{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.cam-blk .lbl .i{width:15px;height:15px;color:var(--accent)}
.cam-blk .lbl small{flex:1 1 auto}
.cam-x{background:none;border:0;color:var(--accent);font-weight:700;font-size:12px;padding:0;cursor:pointer}
.cam-g-l{font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--dim);font-weight:700;margin:10px 0 6px}
.cam-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(82px,1fr));gap:6px}
.cam{display:flex;flex-direction:column;align-items:stretch;gap:5px;padding:5px;border-radius:10px;background:var(--panel);border:1px solid var(--line);color:var(--muted);cursor:pointer;text-align:center;transition:border-color .12s,background .12s}
.cam:hover{border-color:var(--line2,#ffffff33);color:var(--text,#fff)}
.cam.on{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,var(--panel));color:var(--text,#fff)}
.cam-n{font-size:11px;font-weight:600;line-height:1.2}
.cam-pv{position:relative;display:block;height:40px;border-radius:7px;overflow:hidden;background:linear-gradient(180deg,#2c3a44 0%,#1d2629 58%,#232b22 58%,#1a2019 100%);perspective:120px}
.cam-pv .cam-s{position:absolute;left:50%;top:50%;width:14px;height:18px;margin:-11px 0 0 -7px;border-radius:4px 4px 2px 2px;background:var(--accent);box-shadow:0 0 0 2px #0004}
.cam-pv .cam-g{position:absolute;left:-30%;right:-30%;bottom:0;height:42%;background:repeating-linear-gradient(90deg,#ffffff14 0 2px,transparent 2px 12px)}
.cam-pv i{transform-origin:50% 50%}
.cam:hover .cam-pv i,.cam.on .cam-pv i,.cam:focus-visible .cam-pv i{animation-duration:2.2s;animation-iteration-count:infinite;animation-timing-function:ease-in-out;animation-direction:alternate}
.cam-zin .cam-s,.cam-push .cam-s,.cam-din .cam-s{animation-name:camZin}
.cam:hover .cam-push i,.cam.on .cam-push i,.cam:focus-visible .cam-push i{animation-duration:3.4s!important}
.cam-din .cam-g{animation-name:camZin}
.cam-zout .cam-s,.cam-dout .cam-s,.cam-dout .cam-g{animation-name:camZout}
.cam-crash .cam-s{animation-name:camCrash}
.cam:hover .cam-crash i,.cam.on .cam-crash i,.cam:focus-visible .cam-crash i{animation-duration:1s!important;animation-direction:normal!important}
.cam-vert .cam-g{animation-name:camVert}
.cam-track .cam-g,.cam-panl .cam-g,.cam-panl .cam-s{animation-name:camPanL}
.cam-panr .cam-g,.cam-panr .cam-s{animation-name:camPanR}
.cam-drone .cam-g{animation-name:camDrone}
.cam-drone .cam-s{animation-name:camDroneS}
.cam-rise .cam-s,.cam-rise .cam-g,.cam-cup .cam-s,.cam-cup .cam-g,.cam-tdown .cam-s,.cam-tdown .cam-g{animation-name:camRise}
.cam-cdown .cam-s,.cam-cdown .cam-g,.cam-tup .cam-s,.cam-tup .cam-g{animation-name:camFall}
.cam-fpv .cam-s,.cam-fpv .cam-g{animation-name:camFpv}
.cam:hover .cam-fpv i,.cam.on .cam-fpv i,.cam:focus-visible .cam-fpv i{animation-duration:1.2s!important}
.cam-top .cam-s{animation-name:camSpin;border-radius:50%;width:16px;height:16px;margin:-8px 0 0 -8px}
.cam-top .cam-g{display:none}
.cam-orbit .cam-s,.cam-arc .cam-s{animation-name:camOrbit}
.cam-orbit .cam-g{animation-name:camPanL}
.cam-arc .cam-g{animation-name:camPanR}
.cam-hand .cam-s,.cam-hand .cam-g{animation-name:camShake}
.cam:hover .cam-hand i,.cam.on .cam-hand i,.cam:focus-visible .cam-hand i{animation-duration:.5s!important;animation-timing-function:steps(3)!important}
.cam-low .cam-s{animation-name:camLow}
.cam-static .cam-s{box-shadow:0 0 0 2px #0004,0 0 0 1px var(--accent)}
@keyframes camZin{from{transform:scale(1)}to{transform:scale(1.9)}}
@keyframes camZout{from{transform:scale(1.9)}to{transform:scale(.8)}}
@keyframes camCrash{0%,55%{transform:scale(1)}75%,100%{transform:scale(2.4)}}
@keyframes camVert{from{transform:scale(1)}to{transform:scale(1.8,1.2)}}
@keyframes camPanL{from{transform:translateX(14px)}to{transform:translateX(-14px)}}
@keyframes camPanR{from{transform:translateX(-14px)}to{transform:translateX(14px)}}
@keyframes camDrone{from{transform:translateY(0) scaleY(1)}to{transform:translateY(-4px) scaleY(1.5)}}
@keyframes camDroneS{from{transform:translateY(-6px) scale(.7)}to{transform:translateY(4px) scale(1)}}
@keyframes camRise{from{transform:translateY(-8px)}to{transform:translateY(10px)}}
@keyframes camFall{from{transform:translateY(10px)}to{transform:translateY(-8px)}}
@keyframes camFpv{0%{transform:translateX(-8px) rotate(-8deg) scale(.9)}100%{transform:translateX(8px) rotate(8deg) scale(1.4)}}
@keyframes camSpin{from{transform:rotate(0)}to{transform:rotate(180deg)}}
@keyframes camOrbit{from{transform:rotateY(-70deg)}to{transform:rotateY(70deg)}}
@keyframes camShake{0%{transform:translate(1px,-1px)}50%{transform:translate(-1.5px,1px)}100%{transform:translate(1px,1.5px)}}
@keyframes camLow{from{transform:scale(1,1)}to{transform:scale(1.25,1.45) translateY(-2px)}}
@media (prefers-reduced-motion:reduce){.cam-pv i{animation:none!important}}

/* 0.67.2 · varias creaciones en una tarjeta Express del chat */
.bx-multi{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin:8px 0}.bx-multi .prop-job{margin:0}
/* 0.68 · tarjetas de Inicio: Subtítulos y Conversor */
.hx-sbart{position:absolute;inset:0;background:radial-gradient(80% 80% at 30% 30%,#33415a,#0d1118);display:grid;place-items:center;overflow:hidden}
.hx-sb-ph{position:relative;width:46%;max-width:120px;aspect-ratio:9/16;border-radius:12px;background:linear-gradient(180deg,#8fa7c2,#d9c7b2 55%,#6f8466);box-shadow:0 0 0 3px #ffffff22,0 14px 30px #0008;overflow:hidden}
.hx-sb-a,.hx-sb-b{position:absolute;left:6px;right:6px;bottom:22%;text-align:center;font:800 9.5px/1.25 Montserrat,Arial,sans-serif;color:#fff;text-shadow:0 1px 3px #000c}
.hx-sb-a{animation:hxsbA 4s infinite;color:#ffffffcc;text-decoration:line-through #ff4d6d 2px}
.hx-sb-b{opacity:0;animation:hxsbB 4s infinite}
@keyframes hxsbA{0%,40%{opacity:1}48%,100%{opacity:0}}
@keyframes hxsbB{0%,45%{opacity:0;transform:translateY(5px)}55%,94%{opacity:1;transform:none}100%{opacity:0}}
.hx-cvart{position:absolute;inset:0;background:radial-gradient(80% 80% at 70% 30%,#1d3046,#0b0f16);display:grid;place-content:center;gap:9px}
.hx-cv-r{display:flex;align-items:center;gap:8px;font:800 12px/1 ui-monospace,Menlo,monospace;color:#cfe3ff;opacity:0;animation:hxcv 4.5s infinite}
.hx-cv-r:nth-child(2){animation-delay:.35s}.hx-cv-r:nth-child(3){animation-delay:.7s}
.hx-cv-r b{padding:6px 9px;border-radius:7px;background:#ffffff14;border:1px solid #ffffff2a;min-width:44px;text-align:center}
.hx-cv-r b.o{background:#d7fa78;color:#0d0f0e;border-color:#d7fa78}
.hx-cv-r i{font-style:normal;color:#7cc4ff}
@keyframes hxcv{0%{opacity:0;transform:translateX(-8px)}12%,85%{opacity:1;transform:none}100%{opacity:0}}
/* 0.68.2 · riel izquierdo: con muchas secciones los botones ya no se aplastan ni se montan sobre Contacto / Mi cuenta.
   Cada botón mide lo que su texto necesita, el riel hace scroll si no cabe y el pie queda siempre abajo, separado. */
@media (min-width:1280px){
  .fr-l .fr-g,.fr-r .fr-g{flex:0 0 auto}
  .fr-g .fr-it{flex:0 0 auto;min-height:52px;max-height:none}
  .fr-l .fr-foot{flex:none;margin-top:auto;padding-top:12px;background:inherit}
}
.fr-l .fr-foot{position:relative;z-index:1}
.fr-tx b.has-new{display:flex;flex-wrap:wrap;align-items:center;column-gap:6px;row-gap:2px}
/* 0.68.3 · Bit al centro de la barra de abajo (escritorio), como en el celular pero con su nombre */
@media (min-width:1280px){
  .fr-dock.has-bit{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:14px;overflow:visible;position:relative;z-index:5}
  .fr-dl,.fr-dr{display:flex;align-items:center;gap:6px;min-width:0;overflow-x:auto;scrollbar-width:none}
  .fr-dl::-webkit-scrollbar,.fr-dr::-webkit-scrollbar{display:none}
  .fr-dl{justify-content:flex-end}
  .fr-dr{justify-content:flex-start}
  .fr-dl .fr-h{margin-right:auto}
  .fr-dbit{position:relative;top:-16px;margin-bottom:-16px;display:flex;align-items:center;gap:10px;padding:6px 18px 6px 6px;border-radius:999px;cursor:pointer;color:var(--text);text-align:left;white-space:nowrap;
    background:radial-gradient(120% 140% at 0% 0%,#d7fa7840,transparent 60%),var(--panel);border:1px solid var(--accent);box-shadow:0 12px 28px #0008;transition:transform .15s,box-shadow .15s}
  .fr-dbit:hover{transform:translateY(-2px)}
  .fr-dbit.on{box-shadow:0 12px 28px #0008,0 0 0 3px var(--accent)}
  .fr-dbit-ic{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:var(--panel2);overflow:hidden;flex:none}
  .fr-dbit-tx{display:grid;gap:1px}
  .fr-dbit-tx b{font-size:14px;font-weight:800}
  .fr-dbit-tx small{font-size:11px;color:var(--muted)}
  .fr-compact .fr-dbit-tx small{display:none}
}
@media (min-width:1280px) and (max-width:1600px){ .fr-dbit-tx small{display:none} .fr-dock.has-bit{gap:8px} .fr-dock.has-bit .fr-d{padding:6px 7px;gap:5px;font-size:11.5px} .fr-dock.has-bit .fr-d svg.i{width:15px;height:15px} .fr-dl .fr-h{display:none} }
html.qbp-light .fr-dbit{background:radial-gradient(120% 140% at 0% 0%,#EAF8C6,transparent 70%),#FFFFFF;border:1.5px solid var(--ink);box-shadow:4px 4px 0 var(--ink)}
html.qbp-light .fr-dbit:hover{transform:translate(-1px,-3px);box-shadow:5px 6px 0 var(--ink)}
html.qbp-light .fr-dbit.on{box-shadow:4px 4px 0 var(--ink),0 0 0 3px var(--accent)}
html.qbp-light .fr-dbit-ic{background:#F4FBDF;border:1.5px solid var(--ink)}
/* 0.68.4 · Bit de la barra sin el círculo extra, Mi cuenta a la derecha y la rayita del menú Crear que cierra */
.fr-dbit-ic,html.qbp-light .fr-dbit-ic{background:none!important;border:0!important;border-radius:0;width:44px;height:44px;overflow:visible}
.fr-dbit{padding:4px 18px 4px 8px}
@media (min-width:1280px){
  .fr-r .fr-foot{flex:none;margin-top:auto;padding-top:12px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:6px}
  .menu.menu-r{left:auto;right:16px;bottom:90px}
}
button.sheet-grip{border:0;padding:10px 40px;margin:0 auto;background:var(--line2);background-clip:content-box;width:120px;height:24px;box-sizing:border-box;cursor:pointer;-webkit-tap-highlight-color:transparent}

/* ===== 0.69 · Motion graphics: una sola sección (Inicio, Estilos Pro, Promo Pro, Explicativo) ===== */
.mgx-nav{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 16px 0;max-width:1200px;margin:0 auto;width:100%;box-sizing:border-box}
.mgx-nav-h{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--muted)}
.mgx-nav-h svg{width:16px;height:16px}
.mgx-nav-h b{color:var(--text)}
.mgx-nav .cats{margin:0}
.mgx-hero{margin-bottom:14px}
.mgx-bit{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--panel);padding:14px 16px;margin-bottom:20px;display:flex;flex-direction:column;gap:10px}
.mgx-bit-h{display:flex;gap:10px;align-items:center}
.mgx-bit-h svg{flex:none}
.mgx-bit-h strong{display:block;font-size:15px}
.mgx-bit-h small{color:var(--muted)}
.mgx-bit-in{display:flex;gap:10px;align-items:stretch}
.mgx-bit-in textarea{flex:1;min-width:0;resize:vertical;min-height:52px;padding:10px 12px;border-radius:12px;border:1px solid var(--line2);background:var(--bg);color:var(--text);font:inherit}
.mgx-bit-in .btn{align-self:flex-end;white-space:nowrap}
.mgx-orient{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.mgx-orient small{color:var(--muted);width:100%}
.mgx-ways{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px;margin-bottom:22px}
.mgx-way{display:flex;gap:12px;align-items:flex-start;text-align:left;padding:14px;border-radius:var(--r-lg);border:1px solid var(--line);background:var(--panel);color:inherit;font:inherit;cursor:pointer;transition:transform .2s,border-color .2s}
.mgx-way:hover{transform:translateY(-2px);border-color:var(--accent)}
.mgx-ic{font-size:24px;line-height:1;flex:none;width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:var(--panel2)}
.mgx-tx{display:flex;flex-direction:column;gap:3px;min-width:0}
.mgx-tx strong{font-size:15px}
.mgx-tx small{color:var(--muted);line-height:1.35}
.mgx-new{font-style:normal;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--accent-ink);background:var(--accent);border-radius:999px;padding:2px 8px;align-self:flex-start;margin-top:4px}
.mgx-recs{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}
.mgx-recs i{font-style:normal;font-size:12px;padding:3px 9px;border-radius:999px;border:1px solid var(--line2);background:var(--bg)}
.mgx-recs i:hover{border-color:var(--accent)}
.mgx-sec{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.mgx-sec .linkish{margin-left:auto}
.mgx-ab{font-size:12px;color:var(--muted)}
.mgx-pro .mg-pv{position:relative}
.mgx-tag{position:absolute;right:8px;top:8px;font-size:10px;font-weight:800;letter-spacing:.04em;padding:3px 8px;border-radius:999px;background:#000b;color:#fff}
.mgx-pro em{color:var(--muted);font-weight:700}
.mgx-pro em::before{content:'✓ ';color:#16a34a}
.mgx-brand{padding:10px 14px;border-radius:12px;border:1px dashed var(--line2);color:var(--muted);margin-bottom:12px;font-size:14px}
.mgx-brand.on{border-style:solid;border-color:var(--accent);color:var(--text)}
.mgx-ly{display:flex;gap:12px;align-items:center;width:100%;margin-top:22px;padding:14px 16px;border-radius:var(--r-lg);border:1px solid var(--line);background:var(--panel);color:inherit;font:inherit;text-align:left;cursor:pointer}
.mgx-ly>span:first-child{font-size:24px}
.mgx-ly strong{display:block}
.mgx-ly small{color:var(--muted)}
.mgx-ly b{margin-left:auto;white-space:nowrap;color:var(--text);text-decoration:underline;text-underline-offset:3px}
@media (max-width:640px){
  .mgx-bit-in{flex-direction:column}
  .mgx-bit-in .btn{align-self:stretch}
  .mgx-ly{flex-wrap:wrap}
  .mgx-ly b{margin-left:0}
  .mgx-nav{padding:8px 12px 0}
  .mgx-nav .cats{flex-wrap:nowrap;overflow-x:auto;max-width:100%}
}
/* 0.69.2 · La barra de Motion graphics arriba de Promo Pro y Explicativo: fila propia, la página no la tapa */
.body.full:has(> .mgx-nav){grid-template-rows:auto minmax(0,1fr)}
.body.full > .mgx-nav{position:relative;z-index:3;align-self:start}

/* 0.70 · Pincel de zona (Ideogram · Edición precisa) */
.mk-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:10px}
.mk-row small{color:var(--muted)}
.mk-thumb{width:52px;height:52px;object-fit:cover;border-radius:8px;border:1px solid var(--line)}
.mk-stage{position:relative;display:flex;justify-content:center;background:#111;border-radius:12px;overflow:hidden;max-height:62vh}
.mk-stage img{max-width:100%;max-height:62vh;display:block;user-select:none;-webkit-user-drag:none}
.mk-stage canvas{position:absolute;top:0;left:50%;transform:translateX(-50%);touch-action:none;cursor:crosshair}
.mk-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:12px}
.mk-tools .sp{flex:1}
.mk-tools .btn.on{border-color:var(--accent);background:var(--accent);color:var(--accent-ink)}

/* ===== 0.70 · Vectores ===== */
.vx{max-width:1180px;margin:0 auto;padding:22px 24px 120px}
.vx-hero{display:flex;gap:24px;align-items:center;justify-content:space-between;padding:24px 26px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--panel);margin-bottom:16px}
.vx-hero h2{font-size:clamp(22px,2.6vw,30px);margin:6px 0 8px;letter-spacing:-.02em}
.vx-hero p{color:var(--muted);margin:0;max-width:64ch}
.vx-k{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:color-mix(in srgb,var(--accent) 40%,var(--text))}
.vx-hero-art{width:120px;flex:none;color:var(--text);opacity:.85}
.vx-hero-art circle{fill:var(--accent)}
.vx-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:16px;align-items:start}
.vx-card{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--panel);padding:18px}
.vx-drop{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:100%;min-height:200px;border:2px dashed var(--line2);border-radius:16px;background:repeating-conic-gradient(#0000000a 0 25%,transparent 0 50%) 0 0/18px 18px;color:var(--muted);font:inherit;cursor:pointer}
.vx-drop b{font-size:26px;color:var(--text)}
.vx-drop span{color:var(--text);font-weight:600}
.vx-drop.filled{border-style:solid;cursor:default;padding:12px}
.vx-drop img{max-width:100%;max-height:280px;object-fit:contain}
.vx-drop .x,.vx-ref .x{position:absolute;top:6px;right:6px}
.vx-modes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.vx-mode{display:flex;flex-direction:column;gap:3px;text-align:left;padding:12px;border-radius:12px;border:1px solid var(--line2);background:var(--bg);color:inherit;font:inherit;cursor:pointer}
.vx-mode small{color:var(--muted);line-height:1.3}
.vx-mode.on{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.vx-ta{width:100%;box-sizing:border-box;border-radius:12px;border:1px solid var(--line2);background:var(--bg);color:var(--text);font:inherit;padding:12px;resize:vertical}
.vx-refs{display:flex;gap:8px;flex-wrap:wrap}
.vx-ref{position:relative;width:72px;height:72px;border-radius:12px;overflow:hidden;border:1px solid var(--line2);background:var(--bg)}
.vx-ref img{width:100%;height:100%;object-fit:cover}
.vx-ref.add{display:grid;place-items:center;font-size:24px;color:var(--muted);cursor:pointer;font-family:inherit}
.vx-row{display:flex;gap:22px;flex-wrap:wrap;margin-top:14px}
.vx-row .cats{margin:6px 0 0}
.vx-go{margin-top:18px}
.vx-gobtn{width:100%;justify-content:center;padding:14px;font-size:15px}
.vx-tips{border:1px dashed var(--line2);border-radius:var(--r-lg);padding:16px 18px;font-size:14px}
.vx-tips ul{margin:8px 0 0;padding-left:18px;color:var(--muted)}
.vx-tips li{margin-bottom:6px}
.vx-tips b{color:var(--text)}
.vx-note{font-size:12px;color:var(--muted);margin:10px 0 0;padding-top:10px;border-top:1px solid var(--line)}
.vx-h3{margin:26px 0 12px;font-size:15px}
.vx-results{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.vx-res{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--panel);overflow:hidden}
.vx-res.err{opacity:.8}
.vx-prev{aspect-ratio:1;display:grid;place-items:center;padding:16px;background:repeating-conic-gradient(#0000000d 0 25%,#fff 0 50%) 0 0/20px 20px}
.vx-prev img{max-width:100%;max-height:100%;object-fit:contain}
.vx-prev.wait{gap:8px;color:#555;text-align:center}
.vx-meta{padding:12px 14px 14px;display:flex;flex-direction:column;gap:6px}
.vx-meta small{color:var(--muted)}
.vx-cols{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.vx-cols small{width:100%}
.vx-sw{position:relative;width:26px;height:26px;border-radius:8px;border:1px solid var(--line2);cursor:pointer;overflow:hidden}
.vx-sw input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.vx-dl{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
@media (max-width:860px){.vx-grid{grid-template-columns:1fr}.vx-hero-art{display:none}.vx{padding:14px 14px 120px}.vx-modes{grid-template-columns:1fr}}

/* 0.71 · tarjetas nuevas del inicio */
.hx-ieart{position:absolute;inset:0;overflow:hidden;background:#111}
.hx-ieart i{position:absolute;inset:0;background-size:cover;background-position:center}
.hx-ieart i.b{filter:hue-rotate(150deg) saturate(1.3);clip-path:inset(0 0 0 100%);animation:hxIe 4.5s ease-in-out infinite}
.hx-ieart b{position:absolute;top:0;bottom:0;width:3px;background:#fff;box-shadow:0 0 14px #fff;left:100%;animation:hxIeL 4.5s ease-in-out infinite}
.hx-ieart em{position:absolute;left:12px;bottom:12px;font-style:normal;font-size:12px;font-weight:800;padding:5px 10px;border-radius:999px;background:#000b;color:#fff}
@keyframes hxIe{0%,15%{clip-path:inset(0 0 0 100%)}45%,70%{clip-path:inset(0 0 0 0)}100%{clip-path:inset(0 0 0 100%)}}
@keyframes hxIeL{0%,15%{left:100%}45%,70%{left:0}100%{left:100%}}
.hx-vxart{position:absolute;inset:0;display:grid;place-items:center;background:repeating-conic-gradient(#ffffff0d 0 25%,transparent 0 50%) 0 0/22px 22px,radial-gradient(80% 80% at 50% 40%,#1b2433,#0b0f16)}
.hx-vxart svg{width:78%;max-width:300px;overflow:visible}
.hx-vxart .cv{fill:none;stroke:#d7fa78;stroke-width:5;stroke-linecap:round;stroke-dasharray:260;stroke-dashoffset:260;animation:hxVx 3.6s ease-in-out infinite}
.hx-vxart .hd{stroke:#ffffff80;stroke-width:1.5;stroke-dasharray:4 4}
.hx-vxart .nd{fill:#0b0f16;stroke:#fff;stroke-width:2}
.hx-vxart .hn{fill:#4cc9f0;animation:hxVxN 3.6s ease-in-out infinite}
.hx-vxart b{position:absolute;right:12px;bottom:12px;font-size:12px;padding:5px 10px;border-radius:999px;background:#d7fa78;color:#111}
@keyframes hxVx{0%{stroke-dashoffset:260}50%,80%{stroke-dashoffset:0}100%{stroke-dashoffset:-260}}
@keyframes hxVxN{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.hx-flart{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:0;background:radial-gradient(90% 90% at 50% 40%,#1f2a1f,#0b0f0b);padding:0 14px}
.hx-flart i{font-style:normal;font-size:24px;width:52px;height:52px;flex:none;display:grid;place-items:center;border-radius:14px;background:#ffffff14;border:1px solid #ffffff2a;animation:hxFl 3.2s ease-in-out infinite;animation-delay:calc(var(--i) * .6s)}
.hx-flart b{position:relative;flex:1;max-width:46px;height:2px;background:#ffffff33}
.hx-flart b::after{content:'';position:absolute;top:-3px;left:0;width:8px;height:8px;border-radius:50%;background:#d7fa78;box-shadow:0 0 10px #d7fa78;animation:hxFlD 1.2s linear infinite}
.hx-flart em{position:absolute;right:12px;bottom:12px;font-style:normal;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#d7fa78;color:#111;font-size:14px}
@keyframes hxFl{0%,100%{transform:scale(1);background:#ffffff14}12%{transform:scale(1.12);background:#d7fa7840;border-color:#d7fa78}}
@keyframes hxFlD{0%{left:0}100%{left:calc(100% - 8px)}}
@media (prefers-reduced-motion:reduce){.hx-ieart i.b,.hx-ieart b,.hx-vxart .cv,.hx-vxart .hn,.hx-flart i,.hx-flart b::after{animation:none}.hx-vxart .cv{stroke-dashoffset:0}}
/* 0.72 · Bit flotante en todo el Studio (se puede arrastrar) */
.asst-fab{touch-action:none;user-select:none;-webkit-user-select:none}
.asst-fab.dragging{transition:none;cursor:grabbing;transform:scale(1.06)}
.drawer-tt{display:flex;flex-direction:column;min-width:0}
.drawer-tt small{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:280px}
/* 0.72.2 · Botones de las tarjetas (Mis creaciones, chat de Bit, feeds): círculos claros con íconos grandes.
   En la 0.72 la regla era más débil que la antigua «.card .cacts .cact{background:#000c}» y quedaban cuadrados negros con el ícono oscuro encima. */
.card .cacts .cact,.card .cacts.cbot .cact{width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.95);color:#15171a;border:0;box-shadow:0 2px 10px rgba(0,0,0,.3)}
.card .cacts.cbot .cact{width:34px;height:34px}
.card .cacts .cact svg.i{width:19px;height:19px;stroke-width:2.1;fill:none;stroke:currentColor;display:block}
.card .cacts .cact svg.i path{fill:none;stroke:currentColor}
.card .cacts .cact:hover,.card .cacts .cact:focus-visible{background:var(--accent);color:#0c0d0c}
.card .cacts .cact[data-dng]{color:#c62828}
.card .cacts .cact[data-dng]:hover,.card .cacts .cact[data-dng]:focus-visible{background:#e0574f;color:#fff}
.card .cacts .cact.dl{background:var(--accent);color:#0c0d0c}
.card .cacts .cact .tip{color:#fff}
html.qbp-light .card .cacts .cact{border:0}
/* el texto del prompt (abajo) ya no queda debajo de los botones de abajo: sube sobre ellos */
.card.hasbot .meta{padding-bottom:54px}
.card.hasbot:hover .meta,.card.hasbot:focus-within .meta{opacity:1}
/* paneles con scroll: lo de adentro no se aplasta (el prompt del visor se veía cortado) */
.detail>*,.fr-rail>*,.mg-stagewrap>*{flex-shrink:0}
/* 0.73.1 · etiqueta del tipo (video / imagen / audio / motion) en la esquina de las tarjetas:
   antes cuadrado negro con el ícono oscuro (en el tema claro no se veía) */
.card .kind{top:10px;left:10px;width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.95);color:#15171a;box-shadow:0 2px 8px rgba(0,0,0,.28);z-index:2;transition:opacity .15s}
.card .kind svg.i{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2}
.card .kind svg.i path{fill:none;stroke:currentColor}
html.qbp-light .card .kind{background:rgba(255,255,255,.95);color:#15171a}
/* al pasar el mouse aparecen los botones (Descargar va en la misma esquina): la etiqueta se esconde */
.card:hover .kind,.card:focus-within .kind{opacity:0}

/* 0.73.1 · ícono blanco en los botones oscuros (en el tema claro el ícono heredaba tinta oscura y no se veía) */
html.qbp-light .slot .rm,html.qbp-light .art-ico,html.qbp-light .stage .nav-arr,html.qbp-light .card .play,html.qbp-light .slot.vid .play,html.qbp-light .hm-it .pl,html.qbp-light .crp-grid .pitem .pl,.slot .rm,.art-ico,.stage .nav-arr,.card .play,.slot.vid .play,.hm-it .pl,.crp-grid .pitem .pl{color:#fff}
.slot .rm svg.i,.art-ico svg.i,.stage .nav-arr svg.i{stroke:currentColor}

/* 0.74 · Planes: etiquetas del menú y aviso Premium */
.pl-tag{font-style:normal;font-size:9.5px;font-weight:800;letter-spacing:.02em;padding:2px 6px;border-radius:999px;margin-left:5px;vertical-align:1px;background:var(--panel2);color:var(--muted);text-transform:uppercase}
.pl-tag.pro{background:linear-gradient(135deg,#f6d77a,#e0a93a);color:#2a1c00}
.pm-modal .modal-b,.pm-modal{max-width:440px}
.pm-box{position:relative;padding:26px 24px 20px;text-align:center;overflow:hidden}
.pm-glow{position:absolute;inset:-40% -20% auto;height:220px;background:radial-gradient(closest-side,color-mix(in srgb,var(--accent) 45%,transparent),transparent);opacity:.55;pointer-events:none}
.pm-badge{position:relative;display:inline-block;padding:5px 12px;border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;background:linear-gradient(135deg,#f6d77a,#e0a93a);color:#2a1c00}
.pm-box h3{position:relative;margin:12px 0 6px;font-size:21px;letter-spacing:-.02em}
.pm-why{position:relative;color:var(--muted);font-size:14px;margin:0 0 14px}
.pm-list{position:relative;list-style:none;padding:0;margin:0 auto 18px;max-width:320px;text-align:left;display:grid;gap:8px}
.pm-list li{padding-left:24px;position:relative;font-size:13.5px}
.pm-list li::before{content:'';position:absolute;left:0;top:3px;width:15px;height:15px;border-radius:50%;background:var(--accent)}
.pm-list li::after{content:'';position:absolute;left:5px;top:6px;width:4px;height:7px;border:solid #0c0d0c;border-width:0 2px 2px 0;transform:rotate(45deg)}
.pm-acts{position:relative;display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.pm-soon{font-size:13px;color:var(--muted);align-self:center}
.pm-note{position:relative;display:block;margin-top:12px;color:var(--muted);font-size:11.5px}
/* 0.74 · Modo app (Android): Google no permite enlaces para pagar en la web dentro de la app */
html.qbp-app a[href*="tienda"],html.qbp-app a[href*="/shop"],html.qbp-app a[href*="checkout"],html.qbp-app a[href*="carrito"],html.qbp-app a[href*="/cart"],html.qbp-app a[href*="producto"],html.qbp-app a[href*="/product"],html.qbp-app .pm-buy-web{display:none!important}
.msg.bot .bubble{position:relative}
.msg-rep{position:absolute;right:6px;bottom:4px;font-size:11px;color:var(--muted);opacity:0;transition:opacity .15s;padding:2px 4px;border-radius:6px}
.msg.bot:hover .msg-rep,.msg-rep:focus-visible{opacity:.8}
@media (hover:none){.msg-rep{opacity:.5}}
.rp-opts{display:grid;gap:8px;text-align:left;max-width:320px;margin:0 auto;font-size:13.5px}

/* =====================================================================
   0.75 · Cerebro Automático, Tu propia IA y Conecta tu IA
   ===================================================================== */
.brain-menu{max-height:min(74vh,620px);overflow:auto;overscroll-behavior:contain}
.brain-opt strong{display:flex;align-items:center;flex-wrap:wrap;gap:6px}
.brain-spark{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:7px;background:var(--accent);color:var(--accent-ink);font-size:11px;animation:brSpark 3.2s ease-in-out infinite}
@keyframes brSpark{0%,100%{transform:rotate(0) scale(1)}50%{transform:rotate(90deg) scale(1.08)}}
.brain-key{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:7px;border:1px solid var(--line2);color:var(--text)}
.brain-key .i{width:13px;height:13px}
.brain-rec{font-style:normal;font-size:9.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:2px 7px;border-radius:999px;background:var(--accent);color:var(--accent-ink)}
.brain-opt.rec:not(.on){background:linear-gradient(90deg,#d4f36b14,transparent 70%)}
.brain-sep{display:flex;align-items:center;gap:10px;margin:10px 8px 6px;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.brain-sep::before,.brain-sep::after{content:"";flex:1;height:1px;background:var(--line)}
.brain-manage{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;margin-top:4px;padding:9px 12px;border-radius:12px;border:1px dashed var(--line2);background:none;color:var(--muted);font-size:12.5px;font-weight:700;cursor:pointer;transition:color .15s,border-color .15s}
.brain-manage:hover{color:var(--text);border-color:var(--text)}
.brain-manage .i{width:14px;height:14px}
.msg-brain{display:inline-flex;align-items:center;gap:4px;margin-top:8px;padding:3px 9px;border-radius:999px;font-size:11px;font-weight:700;color:var(--muted);background:var(--panel2);border:1px solid var(--line)}

/* ventana Tu propia IA / Conecta tu IA */
.own-lead{color:var(--muted);margin:0 0 14px;line-height:1.5}
.own-two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.own-two.rev .own-card.mcpc{order:-1}
.own-card{position:relative;display:flex;flex-direction:column;gap:8px;padding:18px;border-radius:18px;background:var(--panel2);border:1px solid var(--line2)}
.own-card > small{font-size:10.5px;font-weight:800;letter-spacing:.12em;color:var(--muted)}
.own-card h4{margin:0;font-size:18px;letter-spacing:-.02em;font-family:var(--disp,inherit)}
.own-card p{margin:0;color:var(--muted);font-size:13.5px;line-height:1.5}
.own-card p b{color:var(--text)}
.own-card .lbl{margin-top:4px;font-size:12px;font-weight:700}
.own-card .row{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.own-card .tip{font-size:12px}
.own-card.is-on{border-color:var(--acc-line,var(--accent))}
.own-st{display:flex;align-items:center;gap:8px;font-size:13px;padding:8px 12px;border-radius:12px;background:var(--panel);border:1px solid var(--line)}
.own-dot{width:9px;height:9px;border-radius:50%;background:#7CB518;box-shadow:0 0 0 0 #7cb51866;animation:ownPulse 2s infinite}
@keyframes ownPulse{0%{box-shadow:0 0 0 0 #7cb51877}70%{box-shadow:0 0 0 9px #7cb51800}100%{box-shadow:0 0 0 0 #7cb51800}}
.own-li{margin:2px 0 6px;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px;font-size:13px}
.own-li li{display:flex;align-items:center;gap:8px}
.own-li li::before{content:"✓";display:grid;place-items:center;width:18px;height:18px;border-radius:6px;background:var(--accent);color:var(--accent-ink);font-size:11px;font-weight:900}
.own-card.mcpc .btn{margin-top:auto;align-self:flex-start}
@media (max-width:760px){.own-two{grid-template-columns:1fr}}

/* costado: Conecta tu IA destacado + contacto compacto */
.fr-it.fr-ai{position:relative;border:1px solid var(--line2);background:radial-gradient(120% 140% at 0% 0%,#d4f36b2e,transparent 60%),var(--panel);border-radius:14px}
.fr-it.fr-ai:hover{border-color:var(--text)}
.fr-rail .fr-it.fr-ai .fr-ic{position:relative;overflow:visible;background:var(--accent);border:1.5px solid var(--ink,transparent);color:var(--accent-ink)}
.fr-ai-dot{position:absolute;top:-3px;right:-3px;width:9px;height:9px;border-radius:50%;background:#7CB518;border:2px solid var(--panel);animation:ownPulse 2.2s infinite}
.fr-foot-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.fr-ct{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 11px;border-radius:9px;border:1px solid var(--line2);background:none;color:var(--muted);font-size:12px;font-weight:700;cursor:pointer}
.fr-ct:hover{color:var(--text);border-color:var(--muted)}
.fr-ct .i{width:14px;height:14px}
.fr-compact .fr-ct span{display:none}
.fr-compact .fr-foot-row{flex-direction:column}

/* Inicio: tarjeta Conecta tu IA (animada) */
.hm-ai{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:22px;align-items:center;margin:6px 0 24px;padding:22px 24px;border-radius:22px;background:radial-gradient(90% 140% at 100% 0%,#d4f36b30,transparent 55%),var(--panel);border:1px solid var(--line2);overflow:hidden}
.hm-ai-t small{display:block;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--acc,var(--accent))}
.hm-ai-t h3{font-size:clamp(20px,2.2vw,26px);font-weight:800;letter-spacing:-.025em;margin:6px 0 6px;font-family:var(--disp,inherit)}
.hm-ai-t p{color:var(--muted);font-size:13.5px;line-height:1.55;max-width:52ch}
.hm-ai-opts{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}
.hm-ai-opts span{display:inline-flex;align-items:baseline;gap:6px;padding:6px 11px;border-radius:999px;border:1px solid var(--line2);background:var(--panel2);font-size:12px;color:var(--muted)}
.hm-ai-opts b{color:var(--text);font-size:12.5px}
.hm-ai-cta{display:flex;gap:8px;flex-wrap:wrap}
.hm-ai-cta .i{width:15px;height:15px}
.hm-ai-art{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 54px 118px;align-items:center;min-height:190px}
.hm-ai-chat{position:relative;padding:12px;border-radius:16px;background:#15171A;color:#fff;box-shadow:0 18px 40px #15171a33;animation:hmFloat 6s ease-in-out infinite}
.hm-ai-top{display:flex;gap:4px;margin-bottom:9px}
.hm-ai-top i{width:7px;height:7px;border-radius:50%;background:#ffffff40}
.hm-ai-chat p{margin:0;font-size:12px;line-height:1.4}
.hm-ai-chat .u{margin-left:auto;max-width:92%;padding:8px 10px;border-radius:12px 12px 4px 12px;background:#ffffff1f;animation:hmIn 6s ease-in-out infinite}
.hm-ai-chat .a{display:flex;align-items:center;gap:8px;margin-top:8px;padding:8px 10px;border-radius:12px 12px 12px 4px;background:#D4F36B;color:#172006;font-weight:700;width:max-content;max-width:100%;animation:hmIn2 6s ease-in-out infinite}
.hm-ai-typ{display:inline-flex;gap:3px}
.hm-ai-typ i{width:5px;height:5px;border-radius:50%;background:#172006;animation:hmTyp 1.1s infinite}
.hm-ai-typ i:nth-child(2){animation-delay:.15s}.hm-ai-typ i:nth-child(3){animation-delay:.3s}
.hm-ai-wire{width:100%;height:60px;overflow:visible}
.hm-ai-wire path{fill:none;stroke:var(--line2);stroke-width:2;stroke-dasharray:4 5}
.hm-ai-wire circle{fill:#7CB518}
.hm-ai-wire circle.d2{fill:var(--text)}
.hm-ai-out{position:relative;justify-self:center;width:118px;aspect-ratio:9/16;border-radius:14px;overflow:hidden;border:1px solid var(--line2);background:var(--panel2);box-shadow:0 16px 34px #15171a24;animation:hmFloat 6s ease-in-out infinite reverse}
.hm-ai-img{position:absolute;inset:0;background:radial-gradient(60% 45% at 50% 38%,#F8D7A3,transparent 70%),linear-gradient(160deg,#6B3E1F,#C98B4F 55%,#2B1A10);animation:hmReveal 6s ease-in-out infinite}
.hm-ai-img::after{content:"";position:absolute;left:30%;right:30%;top:42%;height:26%;border-radius:0 0 40% 40%;background:#F3EDE2;box-shadow:inset 0 -6px 0 #d9cdb9}
.hm-ai-lbl{position:absolute;left:7px;right:7px;bottom:7px;display:flex;justify-content:space-between;align-items:center;gap:4px;padding:5px 7px;border-radius:9px;background:#ffffffeb;font-size:10px;color:#15171A;white-space:nowrap}
.hm-ai-out::before{content:"9:16";position:absolute;z-index:2;top:7px;left:7px;padding:2px 6px;border-radius:6px;background:#15171acc;color:#fff;font-size:9px;font-weight:800;letter-spacing:.04em}
.hm-ai-out::after{content:"";position:absolute;z-index:2;left:44%;top:18%;width:12%;height:22%;border-radius:50%;background:radial-gradient(closest-side,#ffffff80,transparent);filter:blur(3px);animation:hmSteam 3s ease-in-out infinite}
@keyframes hmSteam{0%{transform:translateY(8px) scaleX(.8);opacity:0}40%{opacity:.9}100%{transform:translateY(-14px) scaleX(1.3);opacity:0}}
.hm-ai-lbl i{font-style:normal;font-weight:800;color:#3F6A00}
@keyframes hmFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes hmIn{0%,5%{opacity:0;transform:translateY(6px)}12%,93%{opacity:1;transform:none}100%{opacity:0}}
@keyframes hmIn2{0%,24%{opacity:0;transform:translateY(6px)}32%,93%{opacity:1;transform:none}100%{opacity:0}}
@keyframes hmTyp{0%,100%{opacity:.25}50%{opacity:1}}
@keyframes hmReveal{0%,36%{clip-path:inset(100% 0 0 0);filter:blur(8px) saturate(.6)}54%{clip-path:inset(0 0 0 0);filter:none}93%{opacity:1}100%{clip-path:inset(0 0 0 0);filter:none;opacity:0}}
@media (prefers-reduced-motion:reduce){.hm-ai *,.hm-ai-chat,.hm-ai-out{animation:none!important}}
.hm-ai,.hm-ai>*{min-width:0}
@media (max-width:760px){.hm-ai{grid-template-columns:minmax(0,1fr);padding:18px;max-width:100%}.hm-ai-art{min-height:170px;grid-template-columns:minmax(0,1fr) 26px 96px}.hm-ai-out{width:96px}.hm-ai-chat p{font-size:11.5px}}

/* tema claro: borde de tinta y sombra corrida, como las tarjetas de la Home */
html.qbp-light .hm-ai{border:1.5px solid var(--ink);box-shadow:5px 5px 0 var(--ink)}
html.qbp-light .fr-it.fr-ai{border-color:var(--ink);box-shadow:3px 3px 0 var(--ink)}
html.qbp-light .fr-it.fr-ai:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--ink)}
html.qbp-light .own-card.is-on{box-shadow:4px 4px 0 var(--ink);border-color:var(--ink)}
html.qbp-light .brain-opt.rec.on{background:#EEF9D2}

/* 0.75.1 · qué paga la clave propia y qué se paga con créditos + guía para sacar la clave */
.own-split{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:2px 0}
.own-split span{display:flex;flex-direction:column;gap:2px;padding:9px 11px;border-radius:12px;font-size:12px;line-height:1.35;color:var(--muted);background:var(--panel);border:1px solid var(--line)}
.own-split b{font-size:12px;color:var(--text)}
.own-split .y b::before{content:"🔑 "}.own-split .n b::before{content:"🪙 "}
.own-split .y{border-color:#7cb51866}
.own-hint{display:block;min-height:16px;font-size:12px;color:var(--muted)}
.own-hint.ok{color:var(--acc,#3F6A00);font-weight:700}.own-hint.bad{color:var(--danger)}
.own-howbtn{display:flex;align-items:center;gap:10px;width:100%;margin-top:4px;padding:11px 12px;border-radius:14px;border:1.5px dashed var(--acc-line,var(--accent));background:var(--panel);color:var(--text);text-align:left;cursor:pointer;transition:transform .15s,background .15s}
.own-howbtn:hover{transform:translateY(-1px);background:#d4f36b1f}
.own-howbtn>.i:first-child{width:30px;height:30px;padding:6px;border-radius:10px;background:var(--accent);color:var(--accent-ink);flex-shrink:0}
.own-howbtn span{flex:1;display:flex;flex-direction:column}
.own-howbtn b{font-size:13.5px}.own-howbtn small{font-size:11.5px;color:var(--muted)}
.own-howbtn[aria-expanded="true"]>.i:last-child{transform:rotate(90deg)}
.kg{margin:0 0 14px;padding:16px;border-radius:18px;background:var(--panel);border:1px solid var(--line2);animation:kgIn .35s ease}
@keyframes kgIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.kg-h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.kg-h b{font-size:14px}
.kg-dots{display:flex;gap:6px}
.kg-dots button{width:28px;height:28px;border-radius:50%;border:1px solid var(--line2);background:var(--panel2);color:var(--muted);font-size:12px;font-weight:800;cursor:pointer}
.kg-dots button.on{background:var(--accent);color:var(--accent-ink);border-color:var(--ink,transparent)}
.kg-dots button.ok{background:#7CB518;color:#fff;border-color:transparent}
.kg-b{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:18px;align-items:center}
.kg-t small{font-size:10.5px;font-weight:800;letter-spacing:.12em;color:var(--muted)}
.kg-t h4{margin:4px 0 6px;font-size:18px;letter-spacing:-.02em;font-family:var(--disp,inherit)}
.kg-t p{margin:0 0 8px;font-size:13.5px;line-height:1.5;color:var(--muted)}
.kg-t p b{color:var(--text)}
.kg-t code{font-size:12px;padding:1px 5px;border-radius:5px;background:var(--panel2);border:1px solid var(--line)}
.kg-w{padding:8px 10px;border-radius:10px;background:#d4f36b26;color:var(--text)!important;font-size:12.5px!important}
.kg-nav{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
/* animaciones de cada paso (mini pantallas de la Consola) */
.kg-art{position:relative;height:190px;border-radius:14px;background:#FAF9F5;border:1px solid #E3DDD0;overflow:hidden;color:#15171A;font-size:11px}
.kg-bar{display:flex;align-items:center;gap:4px;padding:7px 9px;background:#EFEBE2;border-bottom:1px solid #E3DDD0}
.kg-bar i{width:7px;height:7px;border-radius:50%;background:#CFC7B6}
.kg-bar span{margin-left:8px;flex:1;padding:3px 8px;border-radius:6px;background:#fff;font-size:10.5px;color:#63625B;overflow:hidden;white-space:nowrap;animation:kgType 4s steps(20) infinite}
@keyframes kgType{0%{max-width:0}40%,100%{max-width:100%}}
.kg-login{position:absolute;left:50%;top:58%;transform:translate(-50%,-50%);display:grid;gap:7px;width:62%;padding:12px;border-radius:12px;background:#fff;box-shadow:0 10px 24px #15171a1a;text-align:center}
.kg-in{display:block;padding:6px 8px;border-radius:7px;border:1px solid #CFC7B6;text-align:left;color:#63625B;overflow:hidden;white-space:nowrap}
.kg-go{display:inline-block;justify-self:center;padding:6px 12px;border-radius:8px;background:#D97757;color:#fff;font-weight:800;animation:kgPress 4s infinite}
.kg-go.sm{padding:4px 8px;font-size:10px}
@keyframes kgPress{0%,62%{transform:none;box-shadow:0 0 0 0 #d9775700}70%{transform:scale(.94);box-shadow:0 0 0 6px #d9775733}80%,100%{transform:none}}
.kg-cur{position:absolute;width:14px;height:14px;border-radius:50% 50% 50% 0;background:#15171A;transform:rotate(-45deg);left:20%;top:20%;animation:kgCur 4s ease-in-out infinite}
@keyframes kgCur{0%{left:18%;top:20%}55%,75%{left:52%;top:78%}100%{left:52%;top:78%;opacity:0}}
.kg-side{position:absolute;left:0;top:0;bottom:0;width:30%;display:flex;flex-direction:column;gap:6px;padding:12px 8px;background:#EFEBE2}
.kg-side i{height:16px;border-radius:5px;background:#E3DDD0;font-style:normal;font-size:10px;font-weight:700;padding:1px 6px}
.kg-side i.on{background:#fff;border:1px solid #D97757;color:#15171A}
.kg-pay{position:absolute;left:34%;right:6%;top:12px;display:grid;gap:8px}
.kg-pay>b{font-size:12px}
.kg-amt{display:flex;gap:5px}.kg-amt span{flex:1;text-align:center;padding:6px 0;border-radius:7px;border:1px solid #CFC7B6;font-weight:800}
.kg-amt span.on{border-color:#D97757;background:#fbeee8;animation:kgPick 4s infinite}
@keyframes kgPick{0%,20%{background:#fff}30%,100%{background:#fbeee8}}
.kg-cc{display:grid;grid-template-columns:2fr 1fr;gap:5px}.kg-cc i{height:20px;border-radius:6px;border:1px solid #CFC7B6;background:repeating-linear-gradient(90deg,#CFC7B6 0 6px,transparent 6px 10px) 8px 50%/60% 2px no-repeat,#fff}
.kg-card .kg-go,.kg-keys .kg-modal .kg-go{justify-self:start}
.kg-card .kg-cur{animation-name:kgCur2}
@keyframes kgCur2{0%{left:40%;top:30%}25%{left:40%;top:34%}60%,78%{left:42%;top:84%}100%{opacity:0;left:42%;top:84%}}
.kg-row{display:flex;justify-content:space-between;align-items:center}
.kg-modal{display:grid;gap:5px;padding:10px;border-radius:10px;background:#fff;box-shadow:0 10px 24px #15171a1f;animation:kgModal 4s infinite}
@keyframes kgModal{0%,22%{opacity:0;transform:translateY(8px)}32%,100%{opacity:1;transform:none}}
.kg-modal small{font-weight:700;color:#63625B}
.kg-type{animation:kgType2 4s steps(17) infinite;max-width:100%}
@keyframes kgType2{0%,32%{max-width:0;padding-right:0}64%,100%{max-width:100%}}
.kg-keys .kg-cur{animation-name:kgCur3}
@keyframes kgCur3{0%{left:84%;top:16%}20%{left:84%;top:18%}55%,78%{left:44%;top:86%}100%{opacity:0;left:44%;top:86%}}
.kg-paste{display:grid;align-content:center;gap:10px;padding:14px}
.kg-k{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 10px;border-radius:10px;background:#15171A;color:#D4F36B}
.kg-k code{font-size:10.5px;background:none;border:0;color:#D4F36B;overflow:hidden;white-space:nowrap}
.kg-fly{height:22px;position:relative}
.kg-fly::before{content:"📋";position:absolute;left:70%;top:-6px;font-size:18px;animation:kgFly 4s ease-in-out infinite}
@keyframes kgFly{0%,15%{left:78%;top:-10px;opacity:0}25%{opacity:1}60%{left:20%;top:22px;opacity:1}70%,100%{left:20%;top:22px;opacity:0}}
.kg-field{display:grid;gap:5px;padding:10px;border-radius:10px;background:#fff;border:1px solid #E3DDD0}
.kg-field small{font-weight:700;color:#63625B}
.kg-type2{animation:kgType3 4s steps(12) infinite}
@keyframes kgType3{0%,58%{max-width:0}66%,100%{max-width:100%}}
.kg-ok{justify-self:start;padding:3px 8px;border-radius:999px;background:#7CB518;color:#fff;font-weight:800;font-size:10.5px;animation:kgOk 4s infinite}
@keyframes kgOk{0%,74%{opacity:0;transform:scale(.8)}82%,100%{opacity:1;transform:none}}
@media (max-width:760px){.kg-b{grid-template-columns:1fr}.kg-art{height:170px}.own-split{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.kg *{animation:none!important}}

/* =====================================================================
   0.75.2 · Prolijidad: barra del chat, menú de cerebros y pies fijos de los costados
   ===================================================================== */
/* barra superior del chat: separada del chat, nunca encima de los mensajes */
.chat-top{position:relative;z-index:8;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);flex:none}
.chat:not(.chat-empty) .chat-log{-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 22px);mask-image:linear-gradient(to bottom,transparent 0,#000 22px);padding-top:26px}
.chat-top .brain-wrap{margin:0}
.chat-top .brain-btn{height:38px;padding:0 14px 0 12px;border-radius:999px;border:1px solid var(--line2);background:var(--panel);font-size:13px;gap:7px;transition:border-color .15s,box-shadow .15s}
.chat-top .brain-btn .brain-ic{display:grid;place-items:center;width:22px;height:22px;border-radius:8px;background:var(--accent);color:var(--accent-ink);font-size:11px}
.chat-top .brain-btn[aria-expanded="true"]{border-color:var(--text)}
.chat-tools{display:inline-flex;align-items:center;gap:2px;padding:3px;border-radius:999px;background:var(--panel);border:1px solid var(--line2);min-width:0}
.chat-tools .chat-new{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border:0;border-radius:999px;background:none;color:var(--muted);font-size:12.5px;font-weight:700;white-space:nowrap;cursor:pointer;transition:background .15s,color .15s}
.chat-tools .chat-new:hover{background:var(--panel2);color:var(--text)}
.chat-tools .chat-new.pri{background:var(--accent);color:var(--accent-ink)}
.chat-tools .chat-new.pri:hover{filter:brightness(.97)}
.chat-tools .chat-new:disabled{opacity:.5;cursor:default}
@media (max-width:900px){.chat-tools .chat-new span{display:none}.chat-tools .chat-new{padding:0 10px}}
html.qbp-light .chat-top .brain-btn{border-color:var(--ink);box-shadow:2px 2px 0 var(--ink)}
html.qbp-light .chat-top .brain-btn:hover,html.qbp-light .chat-top .brain-btn[aria-expanded="true"]{box-shadow:3px 3px 0 var(--ink)}
html.qbp-light .chat-tools{border-color:var(--line2);background:#FFFFFF}

/* menú de cerebros: título fijo, lista con su propio scroll, sin cortes raros */
.brain-menu{display:flex;flex-direction:column;overflow:hidden;padding:0;max-height:min(72vh,620px)}
.chat-top .brain-menu{top:calc(100% + 10px);left:0;width:min(430px,calc(100vw - 32px));border-radius:20px}
.brain-menu > p{flex:none;margin:0;padding:14px 18px 11px;border-bottom:1px solid var(--line);background:var(--panel)}
.brain-list{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:8px;scroll-padding:8px;scrollbar-width:thin;scrollbar-color:var(--line2) transparent}
.brain-list::-webkit-scrollbar{width:6px}.brain-list::-webkit-scrollbar-thumb{background:var(--line2);border-radius:6px}
.brain-list .brain-opt{grid-template-columns:1fr auto;grid-template-areas:"t c" "d d";gap:4px 12px;padding:11px 13px;margin:0 0 2px;border-radius:14px}
.brain-list .brain-opt strong{grid-area:t;font-size:14.5px}
.brain-list .brain-opt small{grid-area:d;grid-column:1/-1;font-size:12.5px;line-height:1.45}
.brain-list .brain-opt em{grid-area:c;grid-row:1;grid-column:2;align-self:center;padding:3px 9px;border-radius:999px;background:var(--panel2);border:1px solid var(--line);font-size:11px}
.brain-list .brain-opt.on em{background:var(--panel)}
.brain-list .brain-sep{margin:12px 6px 8px}
.brain-list .brain-manage{margin-top:6px}
html.qbp-light .chat-top .brain-menu{border:1.5px solid var(--ink);box-shadow:6px 6px 0 var(--ink)}

/* pies de los costados: fijos abajo y simétricos (solo las secciones hacen scroll) */
@media (min-width:1280px){
  .fr-rail{--frbg:#0a0c0b}
  html.qbp-light .fr-rail{--frbg:#FFFFFF}
  .fr-rail .fr-foot.fr-pin{position:sticky;bottom:-16px;z-index:4;flex:none;margin:auto 0 -16px;padding:12px 0 16px;display:flex;flex-direction:column;gap:8px;background:var(--frbg);border-top:1px solid var(--line)}
  .fr-rail .fr-foot.fr-pin::before{content:"";position:absolute;left:-12px;right:-12px;top:-29px;height:28px;background:linear-gradient(to top,var(--frbg),transparent);pointer-events:none}
  .fr-foot-row{min-height:30px}
  .fr-ghost{visibility:hidden;width:1px;padding:0;border:0}
}
/* tarjetas del pie: el mismo diseño a cada lado */
.fr-rail .fr-it.fr-card{position:relative;flex:none;min-height:58px;border:1px solid var(--line2);border-radius:14px;background:radial-gradient(120% 140% at 0% 0%,#d4f36b2e,transparent 60%),var(--panel);color:var(--text)}
.fr-rail .fr-it.fr-card:hover{border-color:var(--text)}
.fr-rail .fr-it.fr-card .fr-tx b{color:var(--text)}
.fr-rail .fr-it.fr-acc .fr-ic{background:#15171A;color:#D4F36B;border:1.5px solid var(--ink,#15171A);font-weight:800}
.fr-rail .fr-it.fr-acc.on{background:radial-gradient(120% 140% at 0% 0%,#d4f36b45,transparent 60%),var(--panel)}
html.qbp-light .fr-rail .fr-it.fr-card{border:1.5px solid var(--ink);box-shadow:3px 3px 0 var(--ink)}
html.qbp-light .fr-rail .fr-it.fr-card:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--ink)}
.fr-compact .fr-rail .fr-it.fr-card{min-height:52px;justify-content:center}
/* 0.75.2 · final de la lista del menú: se desvanece en vez de cortarse */
.brain-list{padding-bottom:18px}
.brain-list::after{content:"";position:sticky;bottom:-18px;display:block;height:26px;margin:-8px -8px -18px;background:linear-gradient(to bottom,transparent,var(--panel));pointer-events:none}
.chat-top .brain-menu{max-height:min(620px,calc(100vh - 230px));max-height:min(620px,calc(100dvh - 230px))}
.fr-rail .fr-it.fr-card .fr-tx small{white-space:nowrap}
.brain-list::before{content:"";position:sticky;top:-8px;z-index:1;display:block;height:16px;margin:-8px -8px -8px;background:linear-gradient(to top,transparent,var(--panel));pointer-events:none}
/* 0.75.2 · Bit flotante (panel angosto): herramientas solo con ícono y el menú a lo ancho del panel */
.drawer .chat-tools .chat-new span{display:none}
.drawer .chat-tools .chat-new{padding:0 10px}
.drawer .chat-top{gap:8px}
.drawer .chat-top .brain-menu{width:auto;right:0}
.drawer .chat-top .brain-wrap{position:static}
.drawer .chat-top{position:relative}
/* 0.77 · ¿Cuál quedó mejor? (comparar GPT Image 2.6 con Ideogram 4.5) */
.cmp-box{display:flex;flex-direction:column;gap:6px;padding:12px;margin:0 0 4px;border:1px solid var(--accent);border-radius:var(--r);background:var(--panel2)}
.cmp-box strong{color:var(--text)}
.cmp-box small{color:var(--muted);line-height:1.4}
.cmp-btns{display:flex;gap:6px;flex-wrap:wrap;margin-top:4px}
.p-hint{display:block;margin-top:4px;color:var(--muted);font-size:12px;line-height:1.35}

/* 0.81 · Producto 3D (tarjeta del Inicio): un producto girando bajo el foco de estudio que se separa y se vuelve a armar */
.hx-p3a{position:absolute;inset:0;background:radial-gradient(60% 70% at 62% 20%,#1d2a40,#05070b 72%);overflow:hidden;color:#e9eef7}
.hx-p3a-spot{position:absolute;left:62%;top:-25%;width:60%;height:110%;translate:-50% 0;background:radial-gradient(50% 60% at 50% 0%,#ffffff2b,transparent 70%)}
.hx-p3a-floor{position:absolute;left:62%;bottom:9%;width:34%;height:8%;translate:-50% 0;border-radius:50%;background:radial-gradient(closest-side,#000d,transparent)}
.hx-p3a-obj{position:absolute;left:62%;top:12%;bottom:16%;width:22%;translate:-50% 0;animation:hxp3turn 6s ease-in-out infinite}
.hx-p3a-obj i{position:absolute;left:50%;translate:-50% 0;animation:hxp3sep 4.8s cubic-bezier(.3,.8,.2,1) infinite}
.hx-p3a-obj .a{top:0;width:70%;height:14%;border-radius:10px 10px 4px 4px;background:linear-gradient(90deg,#0b2f86,#2f6bff 45%,#0a2366);--d:-10px}
.hx-p3a-obj .b{top:15%;width:80%;height:52%;border-radius:6px;background:linear-gradient(90deg,#5d6269,#f3f5f8 36%,#b7bcc4 56%,#4f545b)}
.hx-p3a-obj .c{top:68%;width:16%;height:30%;border-radius:3px;background:linear-gradient(90deg,#8c9199,#fff 45%,#80858d);--d:10px}
.hx-p3a-k{position:absolute;left:18px;bottom:14px;font:600 10.5px/1 ui-monospace,Menlo,monospace;letter-spacing:.08em;color:#9fb6da}
@keyframes hxp3sep{0%,30%,100%{transform:translateY(0)}46%,74%{transform:translateY(var(--d,0))}}
@keyframes hxp3turn{0%,100%{transform:scaleX(1)}50%{transform:scaleX(.86)}}
@media (prefers-reduced-motion:reduce){.hx-p3a-obj,.hx-p3a-obj i{animation:none}}