/* ---------- Listas por proyectos (20-sep-2026) ---------- */
.card.flush{padding:0;overflow:hidden}
.lp-row{display:flex;align-items:center;gap:14px;cursor:pointer;background:var(--surface);
  border:1px solid var(--border-soft);border-radius:var(--radius);box-shadow:var(--shadow);
  padding:12px 16px 12px 12px;margin-bottom:10px;transition:transform .12s}
.lp-row:active{transform:scale(.99)}
.lp-mono{width:46px;height:46px;border-radius:13px;flex:0 0 auto;overflow:hidden;
  display:grid;place-items:center;font-family:var(--font-head);font-weight:700;
  font-size:19px;letter-spacing:-.02em}
.lp-mono img{width:100%;height:100%;object-fit:cover;display:block}
.lp-nm{flex:1;min-width:0;font-family:var(--font-head);font-weight:700;font-size:18px;letter-spacing:-.015em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lp-chev{color:var(--faint);font-size:17px;flex:0 0 auto}
/* 2.8.11: crear proyectos desde la portada. El botón (como .ib-edit de Información) va a ras del borde
   derecho de las tarjetas: .hoy-head deja 2px a cada lado, de ahí el margin-right:0 */
.lp-portada-head{display:flex;align-items:center;gap:8px;margin-right:0}
.lp-portada-head .hoy-hi{flex:1;min-width:0}
.lp-add{border:1px solid var(--border);background:var(--surface);color:var(--muted);border-radius:9px;width:32px;height:32px;
  display:grid;place-items:center;cursor:pointer;flex:0 0 auto;padding:0;transition:color .15s,border-color .15s}
.lp-add .glyph{font-size:16px}
.lp-add:hover,.lp-add.on{color:var(--olive);border-color:var(--olive-soft)}
.lp-nueva{cursor:default;border-color:var(--olive-soft)}
.lp-nueva-inp{flex:1;min-width:0;border:0;background:transparent;padding:0;margin:0;height:auto;box-shadow:none;
  font-family:var(--font-head);font-weight:700;font-size:18px;letter-spacing:-.015em;color:var(--text)}
.lp-nueva-inp:focus-visible{outline:none}
.lp-nueva-inp::placeholder{color:var(--faint);font-weight:500}
.lp-nueva-ok{border:0;background:var(--olive-soft);color:#fff;border-radius:9px;width:32px;height:32px;
  display:grid;place-items:center;cursor:pointer;padding:0;flex:0 0 auto}
.lp-nueva-ok .glyph{font-size:15px;stroke-width:2.6}
.lp-nueva-ok:active{transform:scale(.92)}
.lp-recien{animation:lpRecien 1.4s ease}
@keyframes lpRecien{0%{border-color:var(--olive-soft);box-shadow:0 0 0 3px var(--olive-bg)}100%{}}
/* miniatura del proyecto en Ajustes */
.proj-foto{width:34px;height:34px;border-radius:10px;flex:0 0 auto;overflow:hidden;border:1px solid var(--border);
  background:var(--surface);display:grid;place-items:center;color:var(--muted);cursor:pointer;padding:0}
.proj-foto img{width:100%;height:100%;object-fit:cover;display:block}
.lp-back{display:inline-flex;align-items:center;gap:5px;color:var(--muted);font-size:13px;font-weight:700;cursor:pointer;padding:0 2px 10px}
.lp-back .glyph{font-size:15px}
.lp-head{display:flex;align-items:center;gap:10px;padding:0 2px 18px}
.lp-head h1{font-family:var(--font-head);font-weight:700;font-size:25px;letter-spacing:-.02em;margin:0;min-width:0;overflow:hidden;text-overflow:ellipsis}
.lp-dot{width:11px;height:11px;border-radius:50%;flex:0 0 auto}
/* objetivo desplegable */
.lo{border-top:1px solid var(--border-soft)}
.lo:first-child{border-top:0}
.lo-top{display:flex;align-items:center;gap:11px;padding:14px;cursor:pointer}
.lo-chev{color:var(--faint);font-size:16px;flex:0 0 auto;transition:transform .2s ease}
.lo.open .lo-chev{transform:rotate(90deg)}
.lo-mid{flex:1;min-width:0}
.lo-mid .bar{height:5px;margin-top:8px}
.lo-nm{font-weight:700;font-size:15px;letter-spacing:-.005em}
.lo-nm.done{color:var(--muted);text-decoration:line-through}
.lo-why{font-size:12.5px;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lo-pct{font-family:var(--font-head);font-weight:700;font-size:13.5px;color:var(--muted);min-width:36px;text-align:right}
.lo-body{display:none;padding:0 14px 13px 38px}
.lo.open .lo-body{display:block}
.lo-sec{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--faint);font-weight:700;padding:9px 0 3px}
.lo-acts{padding-top:11px}
/* la barra de añadir, dentro de una tarjeta a sangre, pone su propio margen */
.card.flush > .addbar{margin:0;padding:11px 12px;border-top:1px solid var(--border-soft)}
/* 2.8.7: arriba de la lista. La raya la pone la fila de debajo (.lo, .idea-row); el aviso de vacío no tiene */
.card.flush > .addbar.arriba{border-top:0}
.card.flush > .addbar.arriba + .empty{border-top:1px solid var(--border-soft)}
.card.pad-s > .addbar.arriba{margin:0 0 4px}
/* 2.8.7 (Juan): en Objetivos, Tareas e Ideas, el aire que dejaba el rótulo «Ideas» (ya quitado) entre las pestañas y la caja */
#lpane.con-hueco{padding-top:28px}
/* ideas */
.idea-row{display:flex;align-items:flex-start;gap:10px;padding:13px 14px;cursor:pointer;border-top:1px solid var(--border-soft)}
.idea-row:first-child{border-top:0}
.idea-row:active{background:var(--olive-bg)}
.idea-g{color:var(--olive);font-size:16px;flex:0 0 auto;margin-top:1px;display:flex}
.idea-t{flex:1;min-width:0;font-size:14.5px}
/* archivadas: en qué se convirtió, con el glifo de su destino */
.idea-marca{display:inline-flex;align-items:center;gap:5px;flex:0 0 auto;font-size:12.5px;
  font-weight:600;color:var(--muted);white-space:nowrap}
.idea-marca .glyph{color:var(--olive);font-size:15px}
.idea-row .note-back{flex:0 0 auto;margin:-2px -4px 0 2px}
/* el motivo con el que se archivo: debajo del texto en la lista, y a tamaño normal en su ficha */
.idea-grp{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--faint);font-weight:700;padding:10px 2px 5px}
.idea-motivo{display:block;font-size:12.5px;color:var(--faint);margin-top:3px;line-height:1.4}
/* la pantalla de una idea archivada: se lee y se toca, sin cuadro ni botonazo */
.idea-txt{font-size:16.5px;font-weight:600;line-height:1.4;padding:0 2px 9px}
.idea-motivo.grande{display:block;font-size:13.5px;color:var(--muted);padding:0 2px 10px;margin-top:-4px}
.idea-linea{display:flex;align-items:center;gap:12px;padding:0 2px 4px;flex-wrap:wrap}
.idea-link{border:none;background:none;color:var(--olive);font-family:var(--font-body);font-weight:700;
  font-size:13.5px;cursor:pointer;display:inline-flex;align-items:center;gap:6px;padding:6px 0}
.idea-link .glyph{font-size:15px}
@media(max-width:430px){.seg button{font-size:11.5px;padding:8px 4px}}

/* ---------- addbar ---------- */
.addbar{display:flex;gap:8px;margin-top:13px}
.addbar input{flex:1;min-width:0;border:1px solid var(--border);border-radius:11px;padding:10px 12px;font-size:16px;background:var(--surface);color:var(--text)}
.addbar input:focus{outline:none;border-color:var(--olive-soft)}
.add-go{flex:0 0 auto;background:var(--olive);color:#fff;border:none;border-radius:11px;width:44px;font-weight:700;font-size:19px;cursor:pointer;transition:.12s}
:root[data-theme="dark"] .add-go{color:#17191A}
.add-go:active{transform:scale(.92)}
/* 2.8.7 (Juan, 6-oct-2026): caja de añadir de Objetivos, Tareas, Ideas y ficha del objetivo (cajaAdd).
   Vacía: tono crema y un + a la izquierda. Con texto: se aclara, borde oliva, y el + cruza la caja,
   gira y se vuelve la flecha de añadir (hacia abajo, a la lista) sobre oliva. Sin JS: :placeholder-shown dice si hay texto. */
.caja-add{position:relative;flex:1;min-width:0}
.caja-add input{width:100%;border-color:transparent;background:var(--surface-2);padding-left:40px;
  transition:padding .2s ease,background-color .18s,border-color .18s}
.caja-add input::placeholder{color:var(--faint)}
.caja-add input:not(:placeholder-shown){background:var(--surface);border-color:var(--olive-soft);padding-left:12px;padding-right:46px}
/* un solo borde, como en el mockup: el foco lo marca el borde oliva en vez del anillo de accesibilidad.css */
.addbar .caja-add input:focus-visible{outline:none;border-color:var(--olive)}
.ca-btn{position:absolute;top:50%;left:6px;width:30px;height:30px;margin-top:-15px;border:none;border-radius:9px;padding:0;
  background:transparent;color:var(--olive);cursor:text;
  transition:left .28s cubic-bezier(.5,0,.2,1),background-color .2s .08s,color .2s .08s}
.caja-add input:not(:placeholder-shown) + .ca-btn{left:calc(100% - 36px);background:var(--olive);color:#fff;cursor:pointer}
:root[data-theme="dark"] .caja-add input:not(:placeholder-shown) + .ca-btn{color:#17191A}
.ca-btn .glyph{position:absolute;left:50%;top:50%;width:17px;height:17px;margin:-8.5px 0 0 -8.5px;
  transition:opacity .2s,transform .28s cubic-bezier(.5,0,.2,1)}
.ca-btn .ca-fl{opacity:0;transform:rotate(-90deg);stroke-width:2.4}
.caja-add input:not(:placeholder-shown) + .ca-btn .ca-mas{opacity:0;transform:rotate(90deg)}
.caja-add input:not(:placeholder-shown) + .ca-btn .ca-fl{opacity:1;transform:none}