/* PLATAFORMA · réplica del sistema de BlackBuckets (colores, riel, tarjetas y tipografía de app.blackbuckets.com).
   Sin degradados. */
.rd-plat{ position:relative; background:var(--rd-papel); padding:120px 0 110px; border-top:1px solid var(--rd-linea); overflow:hidden; }
.rd-plat .rd-lead{ max-width:34em; }
.rd-plat-cta2{ margin:28px 0 0; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:10px 18px; font-size:1.1rem; color:var(--rd-gris); text-align:center; }

.rd-app{
  --s-bg:#EEF0F5; --s-card:#fff; --s-borde:#E1E4EC; --s-tinta:#14213D; --s-gris:#5B6478; --s-gris2:#8A92A6;
  --s-navy:#1E3A6E; --s-verde:#4CB782; --s-verde-t:#E3F4EA; --s-nar:#E8892B; --s-rojo:#E5484D; --s-azul:#3B82F6;
  position:relative; margin-top:56px; border-radius:18px; overflow:hidden; background:var(--s-bg); border:1px solid #D9DDE8;
  font-family:'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; color:var(--s-tinta); text-align:left;
  box-shadow:0 2px 4px rgba(11,20,54,.05), 0 40px 80px -40px rgba(11,20,54,.55), 0 0 0 10px rgba(255,255,255,.55); }
.rd-app svg{ width:16px; height:16px; flex:none; }
.rd-app-bar{ display:flex; align-items:center; gap:14px; height:40px; padding:0 16px; background:#E4E7EF; border-bottom:1px solid #D9DDE8; }
.rd-app-bar .dots{ display:flex; gap:6px; } .rd-app-bar .dots i{ width:10px; height:10px; border-radius:50%; background:#C9CEDA; }
.rd-app-bar .url{ flex:1; max-width:420px; margin:0 auto; height:24px; border-radius:7px; background:#fff; display:flex; align-items:center; justify-content:center; font-size:12px; color:var(--s-gris); }
.rd-app-body{ display:grid; grid-template-columns:76px minmax(0,1fr); height:620px; }

/* riel de íconos, como el sistema */
.ap-rail{ display:grid; grid-template-rows:auto minmax(0,1fr) auto; border-right:1px solid var(--s-borde); background:var(--s-bg); min-height:0; }
.ap-rail-logo{ height:64px; display:grid; place-items:center; border-bottom:1px solid var(--s-borde); }
.ap-rail-logo img{ width:28px; display:block; }
.rd-app-side{ overflow-y:auto; scrollbar-width:none; padding:12px 0 16px; display:grid; align-content:start; gap:14px; }
.rd-app-side::-webkit-scrollbar{ display:none; }
.ap-rail-g{ display:grid; justify-items:center; gap:4px; }
.rd-app-mod, .rd-app-nuevo{ position:relative; display:grid; place-items:center; width:48px; height:46px; border:0; border-radius:14px; background:transparent; color:#3C4A66; cursor:pointer; text-decoration:none; transition:background .2s, color .2s; }
.rd-app-mod svg, .rd-app-nuevo svg{ width:22px; height:22px; stroke-width:1.7; }
.rd-app-mod span, .rd-app-nuevo span{ position:absolute; left:calc(100% + 10px); top:50%; transform:translate(-4px,-50%); z-index:6; white-space:nowrap; pointer-events:none;
  padding:6px 10px; border-radius:8px; background:var(--s-tinta); color:#fff; font-size:12px; font-weight:500; opacity:0; transition:opacity .15s, transform .15s; }
.rd-app-mod:hover span, .rd-app-mod.tip span, .rd-app-nuevo:hover span{ opacity:1; transform:translate(0,-50%); }
.rd-app-mod:hover{ background:#E2E6EF; }
.rd-app-mod[aria-pressed="true"]{ background:var(--s-navy); color:#fff; box-shadow:0 8px 16px -10px rgba(30,58,110,.9); }
.rd-app-nuevo{ justify-self:center; border:1.5px dashed #C3C9D6; width:44px; height:42px; color:var(--s-navy); }
.rd-app-nuevo:hover{ border-color:var(--s-navy); background:#E2E6EF; }
.ap-rail-mas{ display:grid; place-items:center; height:44px; color:#5B6478; font-size:18px; border-top:1px solid var(--s-borde); }

.rd-app-main{ display:grid; grid-template-rows:auto minmax(0,1fr); min-width:0; min-height:0; }
.ap-top{ display:flex; align-items:center; gap:18px; height:64px; padding:0 22px; border-bottom:1px solid var(--s-borde); }
.ap-search{ flex:1; max-width:560px; margin:0 auto; height:38px; display:flex; align-items:center; gap:10px; padding:0 8px 0 14px; border-radius:10px; background:#fff; border:1px solid #D5DAE5; font-size:13px; color:var(--s-gris2); }
.ap-search kbd{ margin-left:auto; padding:2px 6px; border:1px solid var(--s-borde); border-radius:5px; font:500 10px inherit; color:var(--s-gris); }
.ap-top-ic{ display:flex; gap:16px; color:#3C4A66; } .ap-top-ic svg{ width:18px; height:18px; }
.ap-user{ display:flex; align-items:center; gap:10px; } .ap-user i{ width:32px; height:32px; border-radius:50%; display:grid; place-items:center; background:var(--s-navy); color:#fff; font-style:normal; font-size:11px; font-weight:600; }
.ap-user b{ display:block; font-size:13px; font-weight:600; } .ap-user small{ display:inline-block; margin-top:2px; padding:1px 7px; border-radius:5px; background:#E2E6EF; font-size:10.5px; color:var(--s-gris); }

.ap-page{ min-height:0; overflow:hidden; padding:16px 26px 20px; }
.ap-crumb{ display:flex; align-items:center; gap:8px; font-size:13px; color:var(--s-tinta); } .ap-crumb svg{ width:15px; height:15px; color:var(--s-gris); } .ap-crumb u{ text-decoration:none; color:var(--s-gris2); }
.ap-head{ display:flex; align-items:center; justify-content:space-between; gap:16px; margin:12px 0 14px; }
.rd-app-title{ margin:0; font:700 25px/1.1 inherit; letter-spacing:-.015em; color:var(--s-tinta); font-family:inherit; }
.ap-head-act{ display:flex; align-items:center; gap:10px; font-size:13px; color:var(--s-gris); }
.ap-total{ color:var(--s-gris); }
.ap-dots{ letter-spacing:1px; color:var(--s-tinta); padding:0 4px; }
.ap-vistas{ display:flex; gap:2px; padding:3px; border-radius:10px; background:#E2E6EF; } .ap-vistas i{ display:grid; place-items:center; width:32px; height:28px; border-radius:8px; color:#3C4A66; }
.ap-vistas i.on{ background:var(--s-navy); color:#fff; }
.ap-crear{ display:inline-flex; align-items:center; gap:6px; height:34px; padding:0 14px; border-radius:10px; border:1.5px solid var(--s-navy); color:var(--s-navy); font-weight:600; background:transparent; }
.ap-crear.solido{ background:var(--s-navy); color:#fff; }
.ap-gear{ color:#3C4A66; display:grid; } .ap-gear svg{ width:18px; height:18px; }
.rd-app-view{ display:grid; gap:14px; align-content:start; min-width:0; }

/* filtros */
.ap-filtros{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.ap-buscar{ display:flex; align-items:center; gap:8px; width:220px; height:34px; padding:0 12px; border-radius:10px; background:#fff; border:1px solid #D5DAE5; font-size:12.5px; color:var(--s-gris2); }
.ap-f{ display:inline-flex; align-items:center; gap:6px; height:34px; padding:0 12px; border-radius:10px; background:#fff; border:1px solid #D5DAE5; font-size:12.5px; color:var(--s-tinta); }
.ap-f svg{ width:13px; height:13px; color:var(--s-gris); }
.ap-f.suelto{ justify-self:start; margin-top:-6px; }

/* kanban (To-do y Pipeline) */
.ap-kanban{ display:grid; grid-auto-flow:column; grid-auto-columns:minmax(232px,1fr); gap:14px; align-items:start; }
.ap-col{ display:grid; gap:10px; align-content:start; padding:10px; border-radius:16px; background:#E6E9F0; min-height:330px; }
.ap-col-h{ display:flex; align-items:center; gap:8px; padding:4px 6px 2px; font-size:14px; }
.ap-col-h i{ width:10px; height:10px; border-radius:50%; } .ap-col-h b{ font-weight:600; } .ap-col-h u{ margin-left:auto; text-decoration:none; color:var(--s-gris2); font-size:13px; }
.ap-task, .ap-lead{ position:relative; display:grid; gap:9px; padding:14px 14px 14px; border-radius:14px; background:#fff; border:1px solid var(--s-borde); box-shadow:0 6px 14px -12px rgba(11,20,54,.45); transition:box-shadow .2s, transform .2s; }
.ap-task b, .ap-lead b{ font-size:13.5px; font-weight:600; line-height:1.35; color:var(--s-tinta); }
.ap-meta{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; font-size:11.5px; color:var(--s-gris); }
.ap-meta span{ display:inline-flex; align-items:center; gap:4px; } .ap-meta svg{ width:13px; height:13px; }
.pr.alta{ color:var(--s-rojo); } .pr.media{ color:var(--s-nar); } .pr.baja{ color:#5B78A8; }
.pr i{ font-style:normal; font-weight:700; } .pr i.raya{ display:inline-block; width:10px; height:1.5px; background:currentColor; }
.tp.feat{ color:#2F9D6A; } .tp.bug{ color:var(--s-rojo); } .md{ color:#C2410C; }
.ap-av{ width:26px; height:26px; border-radius:50%; display:grid; place-items:center; background:var(--s-navy); color:#fff; font-style:normal; font-size:9.5px; font-weight:700; }
.ap-task .ap-av{ justify-self:start; }
.ap-task.agarrada, .ap-lead.agarrada{ z-index:4; transform:rotate(-3deg) scale(1.03); box-shadow:0 24px 36px -16px rgba(11,20,54,.55); }
.ap-lead-h{ display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }
.ap-lead-h em{ font-style:normal; font-size:11px; font-weight:600; padding:2px 7px; border-radius:6px; background:#FDF1E3; color:#B4630F; }
.ap-lead p{ display:flex; align-items:center; gap:6px; margin:0; font-size:12px; color:var(--s-gris); } .ap-lead p svg{ width:13px; height:13px; }
.ap-lead p.acc span{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .ap-lead p.acc u{ text-decoration:none; color:var(--s-tinta); font-size:11.5px; }
.ap-av.chico{ justify-self:end; width:24px; height:24px; font-size:9px; }

/* tarjetas genéricas, KPIs */
.ap-card{ background:#fff; border:1px solid var(--s-borde); border-radius:16px; padding:16px 18px; }
.ap-card-t{ display:flex; align-items:center; gap:8px; margin-bottom:12px; font-size:13.5px; font-weight:600; color:var(--s-tinta); }
.ap-kpis{ display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:12px; }
.ap-kpi{ background:#fff; border:1px solid var(--s-borde); border-radius:16px; padding:16px 18px; }
.ap-kpi small{ display:flex; align-items:center; gap:6px; font-size:12.5px; color:var(--s-gris); }
.ap-kpi b{ display:block; margin-top:8px; font-size:22px; font-weight:700; letter-spacing:-.01em; color:var(--s-tinta); }
.ap-kpi b.verde{ color:#3FA373; } .ap-kpi b.rojo{ color:var(--s-rojo); } .ap-kpi b.nar{ color:var(--s-nar); }
.ap-kpi span{ display:block; margin-top:6px; font-size:11.5px; color:var(--s-gris); }
.ap-bars{ display:flex; align-items:flex-end; gap:10px; height:150px; }
.ap-bars i{ flex:1; height:var(--h); border-radius:6px 6px 2px 2px; background:var(--s-verde); transform-origin:50% 100%; }
.ap-grid2{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.ap-grid3{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }

/* Finanzas */
.ap-tabs{ display:flex; gap:22px; border-bottom:1px solid var(--s-borde); font-size:13px; color:var(--s-gris); white-space:nowrap; overflow:hidden; }
.ap-tabs span{ padding:0 2px 10px; } .ap-tabs span.on{ color:var(--s-navy); font-weight:600; box-shadow:inset 0 -2px 0 var(--s-navy); }
.ap-pills{ display:flex; gap:8px; flex-wrap:wrap; }
.ap-pills span{ padding:7px 14px; border-radius:10px; background:#E2E6EF; font-size:12.5px; font-weight:500; color:var(--s-tinta); transition:background .2s, color .2s; }
.ap-pills span.on{ background:var(--s-navy); color:#fff; }
.ap-graf > svg{ width:100%; height:150px; display:block; overflow:hidden; }
.ap-graf{ overflow:hidden; }
@media (max-width: 900px){ .ap-graf{ display:none; } }
.ap-graf rect.i{ fill:var(--s-verde); } .ap-graf rect.g{ fill:#EF8C8F; }
.ap-graf polyline{ fill:none; stroke:var(--s-navy); stroke-width:2; vector-effect:non-scaling-stroke; }
.ap-meses{ display:grid; grid-template-columns:repeat(12,1fr); margin-top:6px; font-size:10.5px; color:var(--s-gris2); text-align:center; }

/* Agenda */
.ap-cal-h{ display:flex; align-items:center; gap:14px; padding:10px 14px; border-radius:14px; background:#fff; border:1px solid var(--s-borde); font-size:13px; }
.ap-cal-h .nav{ color:var(--s-gris); } .ap-cal-h b{ font-size:16px; font-weight:700; }
.ap-seg{ margin-left:auto; display:flex; gap:2px; padding:3px; border-radius:10px; background:#E2E6EF; } .ap-seg i{ font-style:normal; padding:5px 12px; border-radius:8px; font-size:12px; } .ap-seg i.on{ background:var(--s-navy); color:#fff; }
.ap-cal{ display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); border:1px solid var(--s-borde); border-radius:14px; overflow:hidden; background:#fff; }
.ap-dia-n{ padding:8px 0; text-align:center; font-size:11px; font-weight:600; letter-spacing:.06em; color:var(--s-gris); border-bottom:1px solid var(--s-borde); }
.ap-dia{ min-height:98px; padding:8px; border-right:1px solid var(--s-borde); border-bottom:1px solid var(--s-borde); display:grid; align-content:start; gap:6px; }
.ap-dia:nth-child(7n){ border-right:0; }
.ap-dia > span{ justify-self:end; font-size:13px; color:var(--s-tinta); } .ap-dia.fuera{ background:#F4F5F9; } .ap-dia.fuera > span{ color:#B3B9C8; }
.ap-dia.hoy{ background:#F2F4F9; } .ap-dia.hoy > span{ width:26px; height:26px; display:grid; place-items:center; border-radius:50%; background:var(--s-navy); color:#fff; font-weight:600; }
.ap-dia em{ font-style:normal; padding:4px 8px; border-radius:6px; background:#EEE9F8; border-left:3px solid #7C5CE0; font-size:11px; color:#3B2A75; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ap-dia em.recien{ background:#E3F4EA; border-left-color:var(--s-verde); color:#1F6E43; }

/* Clientes y Proyectos */
.ap-cli, .ap-proy{ display:grid; gap:4px; align-content:start; padding:16px 18px; border-radius:16px; background:#fff; border:1px solid var(--s-borde); }
.ap-cli-h{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; margin-bottom:10px; }
.ap-cli-h b{ display:block; font-size:15px; font-weight:600; } .ap-cli-h small{ display:block; margin-top:2px; font-size:12.5px; color:var(--s-gris); }
.ap-tag{ font-style:normal; padding:3px 10px; border-radius:999px; border:1px solid #CDD3E0; background:#F1F3F8; font-size:11.5px; color:var(--s-navy); white-space:nowrap; }
.ap-cli .plata{ font-size:20px; font-weight:700; color:#3FA373; } .ap-cli > small, .ap-proy > small{ font-size:12px; color:var(--s-gris); }
.ap-sub{ display:flex; align-items:center; gap:6px; margin:8px 0 2px; font-size:12px; color:var(--s-gris); }
.ap-cob{ margin-top:8px; font-weight:600; color:var(--s-tinta) !important; }
.ap-dos{ display:grid; grid-template-columns:1fr 1fr; margin-top:6px; padding-top:10px; border-top:1px solid var(--s-borde); text-align:center; }
.ap-dos span + span{ border-left:1px solid var(--s-borde); } .ap-dos small{ display:block; font-size:11.5px; color:var(--s-gris); } .ap-dos b{ font-size:14px; font-weight:600; }
.ap-dos b.nar, b.nar{ color:var(--s-nar); } b.verde{ color:#3FA373; }
.ap-est{ font-style:normal; padding:4px 10px; border-radius:8px; font-size:12px; font-weight:500; } .ap-est.ok{ background:var(--s-verde-t); color:#1F6E43; } .ap-est.curso{ background:#FDF1E3; color:#B4630F; }
.ap-prog{ display:flex; justify-content:space-between; margin-top:8px; font-size:11.5px; color:var(--s-gris); }
.ap-barra{ height:6px; border-radius:3px; background:#E6E9F0; overflow:hidden; } .ap-barra i{ display:block; height:100%; width:var(--w); background:var(--s-verde); border-radius:3px; transform-origin:0 50%; }
.ap-proy .valor{ margin-top:10px; font-size:19px; font-weight:700; }

/* resto de módulos */
.ap-tabla{ padding:4px 0; } .ap-row{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:10px; align-items:center; padding:11px 18px; font-size:13px; border-top:1px solid #EEF0F5; }
.ap-row.cab{ border-top:0; font-size:11px; font-weight:600; color:var(--s-gris2); text-transform:uppercase; letter-spacing:.06em; }
.ap-chip{ font-style:normal; justify-self:start; padding:3px 10px; border-radius:8px; font-size:11.5px; font-weight:500; background:#E2E6EF; color:var(--s-navy); }
.ap-chip.ok{ background:var(--s-verde-t); color:#1F6E43; } .ap-chip.w{ background:#FDF1E3; color:#B4630F; } .ap-chip.n{ background:#F1F2F6; color:#6B7390; }
.ap-check{ display:flex; align-items:center; gap:10px; padding:10px 0; font-size:13px; border-top:1px solid #EEF0F5; }
.ap-check i{ width:18px; height:18px; border-radius:6px; border:2px solid #C9D0E0; } .ap-check.hecho{ color:var(--s-gris2); text-decoration:line-through; } .ap-check.hecho i{ background:var(--s-navy); border-color:var(--s-navy); }
.ap-files{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.ap-file{ display:flex; align-items:center; gap:10px; background:#fff; border:1px solid var(--s-borde); border-radius:14px; padding:12px; font-size:12.5px; }
.ap-file i{ font-style:normal; width:34px; height:34px; border-radius:8px; display:grid; place-items:center; font-size:9.5px; font-weight:800; color:#fff; background:#7C84A0; }
.ap-file .t-pdf{ background:#D9534F; } .ap-file .t-xls{ background:#2F9D6A; } .ap-file .t-doc{ background:var(--s-navy); }
.ap-stock{ display:grid; grid-template-columns:150px minmax(0,1fr) 54px; align-items:center; gap:12px; padding:9px 0; font-size:13px; }
.ap-stock b{ height:8px; border-radius:4px; background:#EEF0F5; overflow:hidden; } .ap-stock b i{ display:block; height:100%; width:var(--w); border-radius:4px; background:var(--s-verde); transform-origin:0 50%; }
.ap-stock b i.bajo{ background:var(--s-rojo); } .ap-stock em{ font-style:normal; color:var(--s-gris); text-align:right; }
.ap-chat{ display:grid; gap:10px; max-width:460px; }
.ap-msg{ margin:0; max-width:78%; padding:10px 14px; border-radius:14px; font-size:13px; line-height:1.4; }
.ap-msg.in{ background:#F1F3F8; justify-self:start; border-bottom-left-radius:4px; } .ap-msg.out{ background:var(--s-navy); color:#fff; justify-self:end; border-bottom-right-radius:4px; }
.ap-team{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.ap-person{ display:grid; justify-items:center; gap:4px; background:#fff; border:1px solid var(--s-borde); border-radius:16px; padding:18px 10px; text-align:center; }
.ap-person i{ font-style:normal; width:46px; height:46px; border-radius:50%; display:grid; place-items:center; font-size:13px; font-weight:700; background:#E2E6EF; color:var(--s-navy); margin-bottom:6px; }
.ap-person b{ font-size:13px; } .ap-person span{ font-size:11.5px; color:var(--s-gris); }
.ap-posts{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.ap-post{ display:grid; gap:8px; background:#fff; border:1px solid var(--s-borde); border-radius:16px; padding:10px; }
.ap-post i{ aspect-ratio:1; border-radius:10px; background:var(--s-navy); } .ap-post i.p1{ background:#8FA7D6; } .ap-post i.p2{ background:#0E1F4D; } .ap-post i.p3{ background:#C9D3EA; }
.ap-post small{ font-size:11px; color:var(--s-gris); }
.ap-line{ display:flex; align-items:center; gap:12px; padding:11px 0; border-top:1px solid #EEF0F5; font-size:13px; }
.ap-line:first-child{ border-top:0; } .ap-line b{ font-weight:500; flex:1; } .ap-line span{ color:var(--s-gris); font-size:12px; }
.ap-line i{ font-style:normal; font-size:11px; font-weight:700; color:var(--s-gris); min-width:40px; } .ap-line i.z{ width:26px; height:26px; min-width:0; border-radius:50%; display:grid; place-items:center; background:#EEF0F5; color:var(--s-navy); }
.ap-ok{ font-style:normal; padding:6px 12px; border-radius:8px; font-size:12px; font-weight:600; background:var(--s-navy); color:#fff; transition:background .3s; } .ap-ok.hecho{ background:var(--s-verde-t); color:#1F6E43; }
.ap-flujo{ display:flex; align-items:center; padding:30px 18px; }
.ap-paso{ display:grid; justify-items:center; gap:8px; font-size:13px; font-weight:500; min-width:96px; }
.ap-paso i{ font-style:normal; width:42px; height:42px; border-radius:12px; display:grid; place-items:center; background:#fff; border:2px solid #C9D0E0; color:var(--s-gris); font-weight:700; }
.ap-paso.ok i{ background:var(--s-navy); border-color:var(--s-navy); color:#fff; } .ap-flujo u{ flex:1; height:3px; border-radius:2px; background:#C9D0E0; margin-bottom:26px; }
.ap-mapa{ position:relative; height:250px; border-radius:12px; background:#EEF0F5; overflow:hidden; }
.ap-mapa .r::before, .ap-mapa .r::after{ content:""; position:absolute; background:#DCE1EC; } .ap-mapa .r::before{ left:0; right:0; top:44%; height:14px; } .ap-mapa .r::after{ top:0; bottom:0; left:48%; width:14px; }
.ap-mapa .pin{ position:absolute; width:26px; height:26px; margin:-26px 0 0 -13px; border-radius:50% 50% 50% 0; transform:rotate(-45deg); background:var(--s-navy); color:#fff; display:grid; place-items:center; font-size:11px; }
.ap-mapa .camion{ position:absolute; width:16px; height:16px; margin:-8px 0 0 -8px; border-radius:50%; background:var(--s-nar); box-shadow:0 0 0 6px rgba(232,137,43,.2); left:10%; top:60%; }

.rd-cursor{ position:absolute; left:0; top:0; z-index:8; width:22px; height:22px; pointer-events:none; opacity:0; filter:drop-shadow(0 4px 6px rgba(11,20,54,.35)); }
.rd-cursor svg{ width:100%; height:100%; display:block; }

/* celular */
@media (max-width: 900px){
  .rd-plat{ padding:72px 0 80px; }
  .rd-app{ margin-top:32px; border-radius:16px; }
  .rd-app-body{ grid-template-columns:minmax(0,1fr); height:auto; }
  .ap-rail{ grid-template-rows:auto; border-right:0; border-bottom:1px solid var(--s-borde); }
  .ap-rail-logo, .ap-rail-mas{ display:none; }
  .rd-app-side{ display:flex; gap:6px; overflow-x:auto; overflow-y:hidden; padding:10px; }
  .ap-rail-g{ display:flex; gap:6px; }
  .rd-app-mod, .rd-app-nuevo{ display:flex; width:auto; height:36px; padding:0 12px; gap:8px; border-radius:10px; flex:none; }
  .rd-app-mod svg, .rd-app-nuevo svg{ width:17px; height:17px; }
  .rd-app-mod span, .rd-app-nuevo span{ position:static; transform:none; opacity:1; padding:0; background:none; color:inherit; font-size:13px; }
  .ap-top{ display:none; }
  .ap-page{ padding:14px 14px 16px; min-height:470px; }
  .ap-head-act .ap-dots, .ap-head-act .ap-vistas, .ap-head-act .ap-gear, .ap-total{ display:none; }
  .rd-app-title{ font-size:21px; }
  .ap-filtros{ flex-wrap:nowrap; overflow:hidden; } .ap-buscar{ width:150px; flex:none; } .ap-f{ flex:none; }
  .ap-kanban{ grid-auto-columns:78%; overflow:hidden; }
  .ap-grid2, .ap-grid3{ grid-template-columns:minmax(0,1fr); } .ap-grid3 > :nth-child(n+3){ display:none; }
  .ap-kpis{ grid-template-columns:repeat(2,minmax(0,1fr)); } .ap-kpi b{ font-size:17px; }
  .ap-dia{ min-height:62px; padding:4px; } .ap-dia em{ padding:2px 4px; font-size:9.5px; } .ap-cal-h .ap-seg{ display:none; }
  .ap-files, .ap-posts, .ap-team{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ap-stock{ grid-template-columns:96px minmax(0,1fr) 44px; }
  .ap-row{ grid-template-columns:1.3fr 1fr; } .ap-row span:nth-child(2){ display:none; }
  .rd-cursor{ display:none; }
}

/* Pipeline: todas las tarjetas del mismo alto, la fecha en su propia línea */
.ap-lead{ height:148px; grid-template-rows:auto auto auto 1fr; align-content:start; gap:7px; }
.ap-lead-h b{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ap-lead p.acc span{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ap-lead-pie{ display:flex; align-items:flex-end; justify-content:space-between; }
.ap-lead-pie u{ text-decoration:none; font-size:11.5px; color:var(--s-gris); }
.ap-lead .ap-av.chico{ justify-self:auto; }

/* Comunicaciones: lista de chats y conversación, como el módulo real */
.ap-conv{ display:grid; grid-template-columns:270px minmax(0,1fr); height:430px; border-radius:16px; overflow:hidden; background:#fff; border:1px solid var(--s-borde); }
.ap-conv-lista{ display:grid; align-content:start; gap:2px; padding:12px; border-right:1px solid var(--s-borde); background:#FAFBFD; }
.ap-conv-lista .ap-buscar{ width:auto; margin-bottom:8px; }
.ap-conv-it{ display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:10px; padding:10px; border-radius:12px; }
.ap-conv-it.on{ background:#E9EDF6; }
.ap-conv-it .ap-av{ width:36px; height:36px; font-size:11px; }
.ap-conv-it b{ display:block; font-size:13.5px; font-weight:600; } .ap-conv-it small{ display:block; font-size:12px; color:var(--s-gris); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ap-conv-it em{ font-style:normal; display:grid; justify-items:end; gap:4px; font-size:11px; color:var(--s-gris2); }
.ap-conv-it em i{ font-style:normal; min-width:18px; height:18px; padding:0 5px; border-radius:9px; display:grid; place-items:center; background:var(--s-verde); color:#fff; font-size:10.5px; font-weight:600; }
.ap-conv-chat{ display:grid; grid-template-rows:auto minmax(0,1fr) auto; min-width:0; }
.ap-conv-h{ display:flex; align-items:center; gap:12px; padding:12px 18px; border-bottom:1px solid var(--s-borde); }
.ap-conv-h .ap-av{ width:38px; height:38px; font-size:11px; } .ap-conv-h b{ display:block; font-size:14.5px; font-weight:600; } .ap-conv-h small{ font-size:12px; color:var(--s-gris); }
.ap-conv-msgs{ display:grid; align-content:end; gap:10px; padding:18px 22px; background:#F4F6FA; }
.ap-conv-msgs .ap-msg{ max-width:62%; font-size:14.5px; padding:11px 15px 9px; box-shadow:0 2px 4px rgba(11,20,54,.06); }
.ap-conv-msgs .ap-msg.in{ background:#fff; }
.ap-msg small{ display:block; margin-top:4px; font-size:10.5px; opacity:.6; text-align:right; }
.ap-conv-in{ display:flex; align-items:center; gap:10px; padding:12px 16px; border-top:1px solid var(--s-borde); }
.ap-conv-in span{ flex:1; height:38px; display:flex; align-items:center; padding:0 14px; border-radius:10px; background:#F1F3F8; font-size:13px; color:var(--s-gris2); }
.ap-conv-in i{ width:38px; height:38px; border-radius:10px; display:grid; place-items:center; background:var(--s-navy); color:#fff; }
@media (max-width: 900px){ .ap-conv{ grid-template-columns:minmax(0,1fr); height:auto; } .ap-conv-lista{ display:none; } .ap-conv-msgs .ap-msg{ max-width:82%; font-size:13.5px; } }

/* tooltip del riel: flota por encima de todo (antes quedaba cortado) */
.rd-app-mod span, .rd-app-nuevo span{ display:none; }
.ap-tip{ position:absolute; z-index:9; transform:translate(-4px,-50%); white-space:nowrap; pointer-events:none; padding:6px 10px; border-radius:8px;
  background:var(--s-tinta); color:#fff; font-size:12px; font-weight:500; opacity:0; transition:opacity .15s, transform .15s;
  box-shadow:0 8px 18px -8px rgba(11,20,54,.5); }
.ap-tip.on{ opacity:1; transform:translate(0,-50%); }
@media (max-width: 900px){ .rd-app-mod span, .rd-app-nuevo span{ display:inline; } .ap-tip{ display:none; } }

/* celular: la réplica tiene siempre el mismo alto, así la página no salta cuando cambia de módulo */
@media (max-width: 900px){
  .ap-page{ height:540px; min-height:0; overflow:hidden; }
  .rd-app-bar .url{ font-size:11px; }
  .ap-head{ margin:10px 0 12px; }
  .ap-crear{ height:32px; padding:0 12px; font-size:12.5px; }
}

/* celular: la réplica se ve como la app abierta en un teléfono */
@media (max-width: 900px){
  .rd-app{ max-width:370px; margin:32px auto 0; border-radius:46px; border:11px solid #14213D; background:var(--s-bg);
    box-shadow:0 2px 4px rgba(11,20,54,.06), 0 40px 70px -36px rgba(11,20,54,.6); }
  /* isla de la cámara y barra de inicio */
  .rd-app::before{ content:""; position:absolute; z-index:9; top:9px; left:50%; width:96px; height:26px; margin-left:-48px; border-radius:16px; background:#14213D; }
  .rd-app::after{ content:""; position:absolute; z-index:9; bottom:7px; left:50%; width:118px; height:5px; margin-left:-59px; border-radius:5px; background:#14213D; opacity:.85; }
  /* barra de estado del teléfono en lugar de la del navegador */
  .rd-app-bar{ height:46px; padding:0 26px; background:var(--s-bg); border-bottom:0; justify-content:space-between; }
  .rd-app-bar .dots, .rd-app-bar .url{ display:none; }
  .rd-app-bar::before{ content:"9:41"; font-size:14px; font-weight:600; color:var(--s-tinta); }
  .rd-app-bar::after{ content:""; width:26px; height:12px; border-radius:4px; border:1.5px solid var(--s-tinta); box-shadow:inset 0 0 0 2px var(--s-bg), inset 18px 0 0 0 var(--s-tinta); }
  /* encabezado de la app: logo y nombre, y abajo los módulos */
  .ap-rail{ grid-template-rows:auto auto; background:#fff; }
  .ap-rail-logo{ display:flex; justify-content:flex-start; gap:9px; height:50px; padding:0 16px; border-bottom:1px solid var(--s-borde); }
  .ap-rail-logo img{ width:22px; }
  .ap-rail-logo::after{ content:"BlackBuckets"; font-size:15px; font-weight:700; letter-spacing:-.01em; color:var(--s-tinta); }
  .rd-app-side{ background:var(--s-bg); }
  .ap-page{ height:520px; padding:14px 14px 26px; }
}