@font-face{font-family:'Outfit';src:url(/fonts/Outfit-Variable.ttf);font-weight:100 900;font-display:swap}
:root{--verde:#3f8a24;--verde2:#6fb74c;--azul:#0b2a3d;--teal:#14705f}

/* subida */
.drop{position:relative;border-radius:26px;padding:34px 28px;text-align:center;cursor:pointer;color:#fff;overflow:hidden;
  background:linear-gradient(120deg,#0b2a3d 0%,#0d3f4d 52%,#14705f 100%);box-shadow:var(--sh2);transition:transform .2s,box-shadow .2s}
.drop::before{content:"";position:absolute;inset:0;background:radial-gradient(520px 220px at 85% 0%,rgba(158,232,109,.32),transparent 70%),radial-gradient(420px 220px at 0% 100%,rgba(47,181,160,.3),transparent 70%)}
.drop::after{content:"";position:absolute;inset:10px;border:1.5px dashed rgba(255,255,255,.35);border-radius:19px;pointer-events:none;transition:.2s}
.drop.sobre{transform:scale(1.01)}.drop.sobre::after{border-color:#9ee86d;background:rgba(158,232,109,.1)}
.drop>*{position:relative}
.drop .nube{width:62px;height:62px;border-radius:20px;margin:0 auto 12px;display:grid;place-items:center;background:linear-gradient(135deg,#3f8a24,#6fb74c);box-shadow:0 14px 30px -12px rgba(111,183,76,.9)}
.drop .nube svg{width:30px;height:30px;stroke:#fff;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
body.app .drop h2{color:#fff;font-size:23px;font-weight:800}.drop p{margin:6px 0 0;color:rgba(255,255,255,.72)}
.drop .fmt{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;margin-top:14px}
.drop .fmt i{font-style:normal;font-size:11px;font-weight:600;letter-spacing:.04em;padding:3px 9px;border-radius:8px;background:rgba(255,255,255,.12);color:rgba(255,255,255,.85)}
.opc{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:14px 0 4px}
.opc label{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:13px;padding:6px 8px 6px 12px;font-size:12.5px;color:var(--ink3);font-weight:600}
.opc select{border:0;outline:0;background:none;font-weight:600;color:var(--ink);padding:3px 2px}
.stats{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0}
.stat{background:#fff;border:1px solid var(--line);border-radius:16px;padding:10px 16px;box-shadow:var(--sh);min-width:140px}
.stat b{display:block;font-size:22px;color:var(--ink);font-weight:800;line-height:1.1}.stat span{font-size:11.5px;color:var(--ink3);font-weight:600}
.stat.v{background:linear-gradient(135deg,#3f8a24,#6fb74c);border-color:transparent}.stat.v b,.stat.v span{color:#fff}

.chips{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px}
.chip{border:1px solid var(--line);background:#fff;border-radius:999px;padding:7px 14px;cursor:pointer;font-weight:600;font-size:13px;color:var(--ink2)}
.chip.on{background:linear-gradient(135deg,#0b2a3d,#12506a);color:#fff;border-color:transparent}.chip i{font-style:normal;opacity:.6;margin-left:5px;font-weight:500}
.chip.nueva{border-style:dashed;color:var(--ink3)}

.tr{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:13px 16px;box-shadow:var(--sh);transition:transform .15s,box-shadow .15s;cursor:pointer}
.tr:hover{transform:translateY(-2px);box-shadow:var(--sh2)}
.tr-l{display:flex;flex-direction:column;gap:10px}
.tr .doc-i{background:linear-gradient(135deg,#14705f,#2fb5a0)}
.tr.mic .doc-i{background:linear-gradient(135deg,#3f8a24,#6fb74c)}
.tr-t{flex:1;min-width:0}.tr-t b{display:block;color:var(--ink);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tr-t span{display:block;font-size:12.3px;color:var(--ink3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tr-t em{font-style:normal;color:var(--ink2);background:#fff7cc;border-radius:4px}
.prog{height:6px;border-radius:4px;background:#e3ebe5;overflow:hidden;margin-top:6px}.prog i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,#3f8a24,#6fb74c,#2fb5a0);background-size:200% 100%;animation:fluye 1.4s linear infinite;transition:width .5s}
@keyframes fluye{to{background-position:-200% 0}}
.badge.rojo{background:#fbe3df;color:#a3392b}.badge.ambar{background:#fff1d1;color:#8a5a00}
.mini{border:1px solid var(--line);background:#fff;border-radius:10px;padding:6px 10px;font-weight:600;font-size:12.5px;cursor:pointer}.mini:hover{border-color:#bfcfc4}

/* detalle */
.det{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:18px;align-items:start}
.reproductor{position:sticky;top:64px;z-index:10;background:linear-gradient(120deg,#0b2a3d,#0d3f4d 60%,#14705f);color:#fff;border-radius:20px;padding:14px 18px;margin-bottom:14px;box-shadow:var(--sh2)}
.rp-f{display:flex;align-items:center;gap:12px}
.rp-play{width:46px;height:46px;border-radius:15px;border:0;cursor:pointer;display:grid;place-items:center;background:linear-gradient(135deg,#3f8a24,#6fb74c);box-shadow:0 10px 22px -10px rgba(111,183,76,.9);flex:none}
.rp-play svg{width:20px;height:20px;fill:#fff;stroke:none}
.rp-btn{border:0;background:rgba(255,255,255,.12);color:#fff;border-radius:11px;padding:7px 10px;cursor:pointer;font-weight:600;font-size:12.5px}.rp-btn:hover{background:rgba(255,255,255,.22)}
.rp-btn.on{background:rgba(158,232,109,.35)}
.rp-t{font-variant-numeric:tabular-nums;font-size:12.5px;color:rgba(255,255,255,.75);min-width:92px;text-align:right}
.rp-barra{position:relative;flex:1;height:34px;display:flex;align-items:center;cursor:pointer}
.rp-barra .pista{position:absolute;left:0;right:0;height:6px;border-radius:4px;background:rgba(255,255,255,.2)}
.rp-barra .lleno{position:absolute;left:0;height:6px;border-radius:4px;background:linear-gradient(90deg,#6fb74c,#9ee86d)}
.rp-barra .punta{position:absolute;width:14px;height:14px;border-radius:5px;background:#fff;margin-left:-7px;box-shadow:0 2px 8px rgba(0,0,0,.4)}
.transc{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:8px 6px}
.tbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:8px 12px 12px;border-bottom:1px solid var(--line)}
.tbar .buscar{flex:1;min-width:170px;margin:0;padding:7px 12px;border-radius:12px}
.tg{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;color:var(--ink2);cursor:pointer;user-select:none}
.tg i{width:34px;height:20px;border-radius:12px;background:#d4ddd7;position:relative;transition:.2s}.tg i::after{content:"";position:absolute;left:2px;top:2px;width:16px;height:16px;border-radius:50%;background:#fff;transition:.2s;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.tg.on i{background:linear-gradient(135deg,#3f8a24,#6fb74c)}.tg.on i::after{left:16px}
.seg{display:grid;grid-template-columns:64px 1fr;gap:4px 10px;padding:10px 12px;border-radius:14px;margin:2px 4px;transition:background .15s}
.seg:hover{background:#f6faf6}.seg.act{background:linear-gradient(90deg,#eaf6df,#f3faee);box-shadow:inset 3px 0 0 #6fb74c}
.seg .ts{font-size:12px;font-weight:700;color:var(--verde);font-variant-numeric:tabular-nums;cursor:pointer;padding-top:3px;border:0;background:none;text-align:left}
.seg .ts:hover{text-decoration:underline}
.seg .hab{display:inline-block;font-size:11px;font-weight:700;padding:2px 9px;border-radius:8px;margin-bottom:3px;cursor:pointer;color:#fff;background:#6b7c72;border:0}
.seg .hab.vacio{background:#eef2ef;color:var(--ink3);opacity:0;transition:.15s}.seg:hover .hab.vacio{opacity:1}
.seg .txt{color:var(--ink);font-size:15.5px;line-height:1.65;outline:0}
.seg .txt span.w{border-radius:5px;cursor:pointer;transition:background .1s}.seg .txt span.w:hover{background:#dff1d1}
.seg .txt span.w.on{background:linear-gradient(135deg,#3f8a24,#6fb74c);color:#fff;box-shadow:0 0 0 2px #6fb74c}
.seg .txt[contenteditable=true]{background:#fff;box-shadow:0 0 0 2px rgba(111,183,76,.4);border-radius:8px;padding:2px 6px;margin:-2px -6px}
.seg mark{background:#fff0a3;border-radius:4px;color:inherit}
.vacio-t{padding:40px 20px;text-align:center;color:var(--ink3)}
.panel-d{position:sticky;top:64px;max-height:calc(100vh - 84px);overflow:auto}
.ptabs{display:flex;gap:4px;background:#eef2ef;border-radius:14px;padding:4px;margin-bottom:12px}
.ptabs button{flex:1;border:0;background:none;border-radius:11px;padding:8px 6px;font-weight:600;cursor:pointer;color:var(--ink3);font-size:13px}
.ptabs button.on{background:#fff;color:var(--ink);box-shadow:0 1px 4px rgba(12,22,18,.12)}
.dato{display:flex;gap:10px;align-items:flex-start;padding:8px 10px;border-radius:12px;cursor:pointer;font-size:13px;line-height:1.4}.dato:hover{background:#f3f8f1}
.dato b{flex:none;font-size:11.5px;color:var(--verde);font-variant-numeric:tabular-nums;padding-top:1px;min-width:34px}
.dato .v{display:inline-block;background:linear-gradient(135deg,#3f8a24,#6fb74c);color:#fff;border-radius:7px;padding:0 7px;font-weight:600;font-size:12px;margin-right:6px}
.grupo{font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--ink3);margin:14px 4px 4px;display:flex;justify-content:space-between}
.nube-p{display:flex;gap:6px;flex-wrap:wrap;padding:4px}.nube-p button{border:1px solid var(--line);background:#fff;border-radius:999px;padding:4px 11px;font-size:12.5px;cursor:pointer;font-weight:600}.nube-p button i{font-style:normal;color:var(--ink3);margin-left:4px}
.pl-g{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.pl-b{text-align:left;border:1px solid var(--line);background:#fff;border-radius:14px;padding:10px 12px;cursor:pointer;display:flex;flex-direction:column;gap:2px;transition:.15s}
.pl-b:hover{border-color:#6fb74c;transform:translateY(-1px)}.pl-b.on{background:linear-gradient(160deg,#fff 30%,#e7f5dc);border-color:#6fb74c}
.pl-b b{font-size:13px;color:var(--ink);font-weight:700}.pl-b span{font-size:11.5px;color:var(--ink3);line-height:1.3}.pl-b em{font-style:normal;font-size:10.5px;color:var(--verde);font-weight:700}
.salida{background:linear-gradient(160deg,#fff 50%,#f1f9ea);border:1px solid #cfe6bd;border-radius:16px;padding:14px 16px;margin-top:12px;font-size:13.5px;line-height:1.55;color:var(--ink)}
.salida h4{font-size:14px;margin:10px 0 4px}.salida ul{margin:4px 0 8px;padding-left:20px}.salida p{margin:0 0 8px}.salida b{font-weight:700}
.salida-a{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.pensando{display:flex;gap:6px;justify-content:center;padding:18px}.pensando i{width:9px;height:9px;border-radius:3px;background:#6fb74c;animation:salta 1s infinite ease-in-out}.pensando i:nth-child(2){animation-delay:.15s}.pensando i:nth-child(3){animation-delay:.3s}
@keyframes salta{0%,80%,100%{transform:translateY(0);opacity:.5}40%{transform:translateY(-7px);opacity:1}}
.preg{display:flex;gap:8px;margin-top:12px}.preg input{flex:1;border:1px solid var(--line);border-radius:12px;padding:9px 12px;background:#fbfdfb;outline:0;min-width:0}.preg input:focus{border-color:#6fb74c;box-shadow:0 0 0 3px rgba(111,183,76,.2)}
.nota-ia{background:#fff7e3;border:1px solid #f0dca0;border-radius:14px;padding:11px 13px;font-size:12.5px;color:#7a5a14;margin-bottom:12px}
.exp-g{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.exp-b{display:flex;gap:10px;align-items:center;border:1px solid var(--line);background:#fff;border-radius:14px;padding:10px 12px;cursor:pointer;text-align:left}.exp-b:hover{border-color:#6fb74c}
.exp-b .ex{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;color:#fff;font-weight:800;font-size:10.5px;letter-spacing:.03em;background:linear-gradient(135deg,#0b2a3d,#12506a);flex:none}
.exp-b:nth-child(2n) .ex{background:linear-gradient(135deg,#14705f,#2fb5a0)}.exp-b:nth-child(3n) .ex{background:linear-gradient(135deg,#3f8a24,#6fb74c)}
.exp-b b{display:block;font-size:13px;color:var(--ink)}.exp-b span{font-size:11.5px;color:var(--ink3)}
.exp-o{display:flex;flex-direction:column;gap:10px;margin:14px 2px 4px}

/* menús y grabadora */
.pop{position:fixed;z-index:80;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--sh2);padding:6px;min-width:190px}
.pop button{display:flex;width:100%;align-items:center;gap:8px;border:0;background:none;padding:8px 10px;border-radius:9px;cursor:pointer;text-align:left;font-weight:500}.pop button:hover{background:#f1f6f2}
.pop hr{border:0;border-top:1px solid var(--line);margin:4px 0}.pop i{width:10px;height:10px;border-radius:4px;flex:none}
.grab{text-align:center;padding:10px 0 4px}
.grab-v{display:flex;align-items:center;justify-content:center;gap:3px;height:84px;margin:6px 0 10px}
.grab-v i{width:5px;border-radius:3px;background:linear-gradient(180deg,#9ee86d,#3f8a24);height:6px;transition:height .08s}
.grab-t{font-size:40px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.grab-t.rec::before{content:"";display:inline-block;width:12px;height:12px;border-radius:4px;background:#c94b3a;margin-right:12px;vertical-align:5px;animation:parp 1s infinite}
@keyframes parp{50%{opacity:.25}}
.grab-b{display:flex;gap:10px;justify-content:center;margin-top:12px;flex-wrap:wrap}
.btn.rojo{background:linear-gradient(135deg,#a8322a,#d9584a);box-shadow:0 10px 20px -12px rgba(201,75,58,.9)}
.cola-u{position:fixed;right:20px;bottom:20px;z-index:70;width:320px;display:flex;flex-direction:column;gap:8px}
.cola-i{background:#fff;border:1px solid var(--line);border-radius:14px;padding:10px 13px;box-shadow:var(--sh2);font-size:12.5px}.cola-i b{display:block;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cola-i .prog{margin-top:6px}
.res-g{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;box-shadow:var(--sh);margin-bottom:12px}
.res-g h3{font-size:15px;margin-bottom:6px;cursor:pointer}.res-g .dato b{min-width:42px}
.glo{display:flex;gap:10px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:14px;padding:9px 14px}.glo b{color:var(--ink);flex:0 1 46%;min-width:0;overflow-wrap:anywhere}.glo span{flex:1;color:var(--ink3);font-size:12.5px;min-width:0}.glo .mini{flex:none}
.glo-l{display:grid;grid-template-columns:repeat(auto-fill,minmax(440px,1fr));gap:8px}
@media(max-width:520px){.glo-l{grid-template-columns:1fr}}
.form-glo{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px}.form-glo input{border:1px solid var(--line);border-radius:12px;padding:10px 13px;background:#fff;outline:0;flex:1;min-width:200px}.form-glo input:focus{border-color:#6fb74c}

@media(max-width:1000px){.det{grid-template-columns:1fr}.panel-d{position:static;max-height:none}.reproductor{top:56px}.cola-u{left:14px;right:14px;width:auto}}
@media(max-width:640px){.rp-f{flex-wrap:wrap}.rp-barra{order:5;flex-basis:100%}.seg{grid-template-columns:1fr}.drop{padding:26px 16px}.pl-g,.exp-g{grid-template-columns:1fr}}
@media(max-width:640px){.top{flex-wrap:wrap;row-gap:8px}.top nav{order:5;width:100%;margin:0;overflow-x:auto;gap:2px}.top nav a{white-space:nowrap;padding:7px 11px;font-size:13px}.quien{margin-left:auto}.marca-logo{height:32px!important}.cab h1{font-size:23px}}