:root{
  --bg1:#fff6fb;
  --bg2:#f8eef8;
  --paper:#fffdfc;
  --paper-2:#fff9fb;
  --ink:#513744;
  --ink-soft:#7d6170;
  --line:#efd8e3;
  --line-strong:#ddb8c9;
  --rose:#c96f98;
  --rose-dark:#a94b78;
  --lavender:#8f78c4;
  --mint:#4f9f84;
  --gold:#b88a45;
  --danger:#be4f5c;
  --shadow:0 22px 50px rgba(140, 88, 115, .12);
}
*{box-sizing:border-box}
html,body{min-height:100%}
body{
  margin:0;
  font-family:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  color:var(--ink);
  background:
    radial-gradient(circle at top left, rgba(255,255,255,.95), transparent 28%),
    radial-gradient(circle at bottom right, rgba(255,255,255,.8), transparent 25%),
    linear-gradient(180deg,var(--bg1),var(--bg2));
}
.page-decor{position:fixed;z-index:0;pointer-events:none;opacity:.28;filter:blur(2px)}
.decor-left{left:-40px;top:80px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,#f6bfd4,transparent 65%)}
.decor-right{right:-30px;bottom:80px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,#dcc8ff,transparent 68%)}
.topbar{
  position:sticky;top:0;z-index:10;
  backdrop-filter:blur(10px);
  background:rgba(255,250,252,.85);
  border-bottom:1px solid rgba(221,184,201,.65);
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:16px max(22px,calc((100% - 1160px)/2));
}
.brand-wrap{display:flex;align-items:center;gap:14px}
.brand-mark{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,#f6cade,#eadbff);font-size:24px;box-shadow:var(--shadow)}
.brand-title{display:block;font-size:20px;letter-spacing:.2px}
.brand-subtitle{font-size:13px}
.topnav{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.nav-link{padding:10px 13px;border-radius:999px;text-decoration:none;color:var(--ink-soft);font-weight:700}
.nav-link:hover{background:rgba(201,111,152,.1);color:var(--rose-dark)}
.container{position:relative;z-index:1;max-width:1160px;margin:0 auto;padding:28px 20px 60px}
.muted{color:var(--ink-soft)}
.small{font-size:12px}
h1,h2,h3{margin:0 0 10px;font-family:"Georgia","Times New Roman",serif;color:#5b3649}
p{margin:0 0 12px;line-height:1.55}
.card{
  background:linear-gradient(180deg,var(--paper),var(--paper-2));
  border:1px solid var(--line);
  border-radius:24px;
  box-shadow:var(--shadow);
  padding:22px;
  margin-bottom:18px;
}
.soft-card{background:linear-gradient(180deg,#fffdfd,#fff8fb)}
.notebook-card{position:relative;overflow:hidden}
.notebook-card::before{
  content:"";position:absolute;left:28px;top:0;bottom:0;width:2px;
  background:linear-gradient(180deg,transparent,#f0cad8 7%,#f0cad8 93%,transparent);
}
.notebook-card::after{
  content:"";position:absolute;inset:0;
  background:repeating-linear-gradient(180deg,transparent 0 33px,rgba(220,184,201,.28) 33px 34px);
  pointer-events:none;
}
.notebook-card > *{position:relative;z-index:1}
.auth-shell{min-height:calc(100vh - 120px);display:grid;place-items:center}
.book-cover{max-width:560px;margin:0 auto;padding:34px 30px;background:linear-gradient(160deg,#fff8fb,#fffefc);border-radius:30px;position:relative;overflow:hidden}
.book-cover::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at top right,rgba(201,111,152,.16),transparent 32%),radial-gradient(circle at bottom left,rgba(143,120,196,.15),transparent 28%);pointer-events:none}
.cover-ribbon{display:inline-flex;padding:7px 12px;border-radius:999px;background:#f8dfe9;color:var(--rose-dark);font-weight:800;font-size:12px;margin-bottom:16px}
.lead{font-size:15px;max-width:48ch}
.feature-pills{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 22px}
.feature-pills span,.bookmark,.wa-state,.status-line{display:inline-flex;align-items:center;gap:8px;border-radius:999px;font-weight:800;font-size:12px;padding:8px 12px}
.feature-pills span{background:#fdf0f6;color:#975070;border:1px solid #efc6d8}
.auth-form{margin-top:8px}
.auth-note{margin-top:18px;padding:14px;border-radius:18px;background:#fff5f9;border:1px dashed #e6bfd0;color:var(--ink-soft)}
.otp-form input{text-align:center;font-size:26px;letter-spacing:.35em}
.hero{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:18px}
.book-hero{padding:14px 6px 6px}
.eyebrow{margin:0 0 8px;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--rose-dark);font-weight:800}
.hero-badges{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.wa-state.ok,.status-line.ok{background:#edf9f4;color:#2f7e64;border:1px solid #cce8dd}
.wa-state.off,.status-line.off{background:#fff4f7;color:#b15375;border:1px solid #f0c8d7}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:18px}
.ribbon-card{position:relative;padding-top:26px}
.ribbon-card::before{content:"";position:absolute;left:20px;top:0;width:82px;height:18px;border-radius:0 0 12px 12px;background:linear-gradient(180deg,#e9bfd0,#d991b0)}
.stat span{display:block;color:var(--ink-soft);font-size:13px;margin-bottom:8px}
.stat strong{font-size:34px;font-family:"Georgia","Times New Roman",serif}
.section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:10px}
.bookmark{background:linear-gradient(135deg,#f4d3e0,#eadfff);color:#714d70}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-grid.one{grid-template-columns:1fr}
.full{grid-column:1/-1}
label{display:grid;gap:8px;font-size:13px;font-weight:700;color:#724c61}
input,textarea{
  width:100%;background:rgba(255,255,255,.92);color:var(--ink);
  border:1px solid #e7c8d6;border-radius:16px;padding:12px 14px;
  font:inherit;box-shadow:inset 0 1px 0 rgba(255,255,255,.6);
}
input:focus,textarea:focus{outline:none;border-color:#cb80a1;box-shadow:0 0 0 4px rgba(201,111,152,.14)}
textarea{resize:vertical;min-height:90px}
.btn{
  border:1px solid #e7c8d6;background:#fff;color:var(--ink);
  border-radius:16px;padding:10px 15px;font-weight:800;cursor:pointer;
  text-decoration:none;display:inline-flex;align-items:center;justify-content:center;min-height:42px;
  transition:transform .15s ease, box-shadow .15s ease, background .2s ease;
}
.btn:hover{transform:translateY(-1px);box-shadow:0 12px 24px rgba(169,75,120,.12)}
.btn.primary{background:linear-gradient(135deg,var(--rose),var(--lavender));border-color:transparent;color:#fff}
.btn.success{background:linear-gradient(135deg,#67bf9e,var(--mint));border-color:transparent;color:#fff}
.btn.danger{border-color:#f2bcc8;color:var(--danger);background:#fff8fa}
.btn.ghost{border:1px solid #edd0dc;background:#fff8fb}
.btn.wide{width:100%}
.toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:24px 0 14px}
.tabs{display:flex;gap:8px;flex-wrap:wrap}
.tab{padding:10px 14px;border-radius:999px;text-decoration:none;color:var(--ink-soft);font-weight:700}
.tab.active{background:linear-gradient(135deg,#f4d3e0,#e6defe);color:#684c78;box-shadow:inset 0 0 0 1px #e5c8d7}
.search{display:flex;gap:8px;align-items:center}
.search input{min-width:260px}
.events{display:grid;gap:14px}
.event{display:grid;grid-template-columns:42px 1fr auto;gap:18px;align-items:flex-start}
.agenda-entry{background:linear-gradient(180deg,#fffdfd,#fffafc);position:relative;overflow:hidden}
.agenda-entry::after{content:"";position:absolute;left:0;right:0;top:54px;height:1px;background:rgba(224,190,205,.45);box-shadow:0 34px 0 rgba(224,190,205,.45),0 68px 0 rgba(224,190,205,.35);pointer-events:none}
.entry-side{display:flex;justify-content:center;padding-top:4px}
.entry-pin{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#f3c9d9,#efe4fd);font-size:16px}
.event.overdue{border-left:7px solid #e0a74f}
.event.done{opacity:.82}
.event-main{min-width:0}
.event-title-row{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:4px}
.event-title-row h3{margin-bottom:6px}
.event p{white-space:pre-wrap;color:#6e5562}
.meta{display:flex;gap:10px 18px;flex-wrap:wrap;color:var(--ink-soft);font-size:12px}
.badge{font-size:12px;border-radius:999px;padding:6px 10px;font-weight:800;white-space:nowrap}
.badge.pending{background:#f9e8ef;color:#ad5478}
.badge.overdue{background:#fff2df;color:#ad761d}
.badge.done{background:#e8f8f0;color:#2f7e64}
.actions{display:flex;flex-wrap:wrap;align-content:flex-start;justify-content:flex-end;gap:8px;max-width:420px}
.actions form{margin:0}
details{position:relative}
summary{list-style:none}
summary::-webkit-details-marker{display:none}
.mini-form{position:absolute;z-index:20;right:0;top:48px;width:310px;background:#fffdfa;border:1px solid var(--line);border-radius:20px;padding:16px;box-shadow:0 18px 45px rgba(89,60,76,.16);display:grid;gap:12px}
.mini-form.wider{width:380px}
.alert{border-radius:18px;padding:13px 15px;margin-bottom:14px;border:1px solid transparent;box-shadow:var(--shadow)}
.alert.success{background:#edf9f3;color:#2f7e64;border-color:#cae7d9}
.alert.warning{background:#fff5e4;color:#926017;border-color:#ecd7ad}
.alert.danger{background:#fff0f2;color:#9e3a50;border-color:#efc1cd}
.empty{text-align:center;color:var(--ink-soft)}
.wa-connect,.wa-connected{display:flex;gap:24px;align-items:center;justify-content:space-between}
.wa-connect-copy{min-width:0;flex:1}
.wa-connect-copy h2{margin-top:0}
.wa-qr-wrap,.qr-card{flex:0 0 auto;background:#fff;border:1px solid #ecd2dd;border-radius:20px;padding:12px;box-shadow:var(--shadow)}
.wa-qr{display:block;width:min(280px,72vw);height:auto}
.wa-error{color:#a54a63;font-weight:700;overflow-wrap:anywhere}
.security-grid{display:grid;grid-template-columns:1.3fr .9fr;gap:16px}
.security-setup{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:center}
.secret-code{display:block;padding:12px 14px;border-radius:16px;background:#fff7fa;border:1px dashed #e5bccd;color:#7d4662;overflow-wrap:anywhere;font-size:14px}
.lined-form textarea{background-image:linear-gradient(transparent 0 30px,rgba(224,190,205,.22) 30px 31px)}
@media(max-width:900px){
  .stats,.security-grid{grid-template-columns:1fr}
  .event{grid-template-columns:1fr}
  .entry-side{display:none}
  .actions{justify-content:flex-start;max-width:none}
}
@media(max-width:760px){
  .topbar,.hero,.toolbar,.wa-connect,.wa-connected,.security-setup{flex-direction:column;align-items:stretch}
  .topbar{padding:14px 16px}
  .container{padding:20px 14px 48px}
  .form-grid{grid-template-columns:1fr}
  .search{width:100%;flex-wrap:wrap}
  .search input{min-width:0;width:100%}
  .hero-badges{justify-content:flex-start}
  .mini-form,.mini-form.wider{position:fixed;left:16px;right:16px;top:auto;bottom:16px;width:auto}
  .book-cover{padding:26px 20px}
  .notebook-card::before{left:20px}
}

/* ===== Versión 4.1: agenda de libro + destinatarios ===== */
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background-image:
    radial-gradient(circle at 12% 18%, rgba(225,135,169,.12) 0 3px, transparent 4px),
    radial-gradient(circle at 88% 26%, rgba(156,126,202,.11) 0 4px, transparent 5px),
    radial-gradient(circle at 18% 82%, rgba(211,154,178,.10) 0 3px, transparent 4px);
  background-size:74px 74px,96px 96px,82px 82px;
}
.book-hero{
  position:relative;overflow:hidden;
  background:linear-gradient(120deg,rgba(255,255,255,.78),rgba(255,239,247,.9));
  border:1px solid #edceda;border-radius:28px;padding:24px 26px;margin-bottom:20px;
  box-shadow:0 18px 45px rgba(142,84,112,.11);
}
.book-hero::after{
  content:"✿  ❀  ✿";position:absolute;right:24px;bottom:-6px;
  font-size:48px;letter-spacing:8px;color:rgba(198,103,146,.10);transform:rotate(-8deg);
}
.recipients-card{
  position:relative;overflow:visible;
  border:1px solid #e9bfd0;
  background:linear-gradient(135deg,#fffdfd 0%,#fff5fa 55%,#faf5ff 100%);
}
.recipients-card::before{
  content:"";position:absolute;left:-8px;top:22px;bottom:22px;width:18px;
  background:repeating-linear-gradient(180deg,#d8afc2 0 7px,transparent 7px 18px);
  border-radius:12px;
}
.recipient-add{
  display:grid;grid-template-columns:1fr 1.2fr auto;gap:12px;align-items:end;
  padding:16px;border-radius:20px;background:rgba(255,255,255,.7);border:1px dashed #e5bfd0;
}
.recipient-help{margin:10px 2px 4px}
.recipient-list{display:grid;gap:10px;margin-top:14px}
.recipient-item{
  display:grid;grid-template-columns:48px minmax(0,1fr) auto auto;gap:12px;align-items:center;
  padding:13px 14px;border-radius:18px;background:#fff;border:1px solid #eed5df;
  box-shadow:0 9px 22px rgba(140,88,115,.07);
}
.recipient-item.inactive{opacity:.67;background:#fbf8fa}
.recipient-avatar{
  width:44px;height:44px;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(135deg,#f4cadb,#e5d9fb);color:#8f4d6d;font-family:Georgia,serif;font-size:20px;font-weight:700;
}
.recipient-info{min-width:0;display:grid;gap:3px}
.recipient-info strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.recipient-info span{color:var(--ink-soft);font-size:13px;letter-spacing:.03em}
.recipient-status{padding:6px 10px;border-radius:999px;font-size:11px;font-weight:900}
.recipient-status.on{background:#e9f8f1;color:#347b64}
.recipient-status.off{background:#f6edf1;color:#9b667a}
.recipient-actions{display:flex;flex-wrap:wrap;gap:7px;justify-content:flex-end}
.recipient-actions form{margin:0}
.recipient-edit-form{width:340px}
.recipient-empty{padding:18px;text-align:center;border-radius:16px;background:#fff8fb;color:var(--ink-soft);border:1px dashed #e8c3d3}
.book-stats .stat:nth-child(1){background:linear-gradient(160deg,#fff,#fff1f6)}
.book-stats .stat:nth-child(2){background:linear-gradient(160deg,#fff,#fff7e9)}
.book-stats .stat:nth-child(3){background:linear-gradient(160deg,#fff,#effaf5)}
.agenda-entry{
  border-left:10px solid #f2c9d9;
  background:
    linear-gradient(90deg,rgba(246,205,222,.20) 0 58px,transparent 58px),
    repeating-linear-gradient(180deg,#fffdfd 0 37px,#efdce5 38px,#fffdfd 39px);
}
.agenda-entry::before{
  content:"";position:absolute;left:44px;top:0;bottom:0;width:2px;background:#efb8cb;opacity:.75;
}
.book-cover{
  border:2px solid #eac1d2;
  box-shadow:0 28px 70px rgba(117,65,91,.18), inset 9px 0 0 rgba(229,178,200,.18);
}
.book-cover::after{
  content:"✿";position:absolute;right:28px;top:22px;font-size:74px;color:rgba(195,97,141,.10);font-family:serif;
}
@media(max-width:900px){
  .recipient-add{grid-template-columns:1fr 1fr}
  .recipient-add .btn{grid-column:1/-1}
  .recipient-item{grid-template-columns:44px 1fr auto}
  .recipient-actions{grid-column:1/-1;justify-content:flex-start;padding-left:56px}
}
@media(max-width:620px){
  .recipient-add{grid-template-columns:1fr}
  .recipient-add .btn{grid-column:auto}
  .recipient-item{grid-template-columns:42px 1fr}
  .recipient-status{justify-self:start;grid-column:2}
  .recipient-actions{padding-left:0;grid-column:1/-1}
}

/* ===== Versión 4.2: destinatarios en Seguridad + tareas legibles ===== */
.security-recipients{margin-top:18px}
.recipient-heading{align-items:flex-start}
.active-number-summary{
  display:grid;grid-template-columns:48px 1fr;gap:14px;align-items:flex-start;
  margin:16px 0;padding:16px 18px;border-radius:20px;
  background:linear-gradient(135deg,#f7fffB,#fff7fb);border:1px solid #d9e9e2;
}
.summary-icon{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:#e8f8f1;font-size:22px}
.active-number-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:9px}
.number-chip{display:inline-flex;align-items:center;padding:8px 11px;border-radius:999px;background:#fff;border:1px solid #e6cbd7;color:#69485a;font-size:13px;box-shadow:0 5px 14px rgba(117,65,91,.06)}
.no-margin{margin:5px 0 0}
.whatsapp-security-card{align-self:start}

.tasks-toolbar{align-items:end;margin-top:30px}
.tasks-toolbar .eyebrow{margin-bottom:10px}
.task-list{gap:18px}
.task-card{
  position:relative;display:grid;grid-template-columns:58px minmax(0,1fr);
  background:#fffdfd;border:1px solid #e7c5d3;border-radius:24px;
  box-shadow:0 16px 34px rgba(117,65,91,.10);overflow:visible;
  min-height:210px;
}
.task-card.overdue{border-left:7px solid #e6a84d}
.task-card.done{border-color:#cfe4da;background:#fbfffd;opacity:.92}
.task-accent{
  min-height:100%;border-right:1px solid #edc8d7;
  background:linear-gradient(180deg,#fff1f6,#fbf5ff);
  border-radius:22px 0 0 22px;display:flex;justify-content:center;padding-top:24px;
}
.task-accent span{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#f2d8e3;color:#a65479;font-size:17px}
.task-content{padding:22px 24px 20px;min-width:0}
.task-header{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;padding-bottom:14px;border-bottom:1px solid #efdce4}
.task-heading{min-width:0}
.task-kicker{display:block;color:#aa708a;font-size:11px;text-transform:uppercase;letter-spacing:.12em;font-weight:900;margin-bottom:5px}
.task-header h3{margin:0;font-size:23px;line-height:1.2;color:#533244;overflow-wrap:anywhere}
.task-description{
  margin:15px 0 16px;padding:14px 16px;border-radius:15px;
  background:#fff8fb;border:1px solid #f0dce5;color:#5f4653;
  font-size:15px;line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere;
}
.task-dates{display:grid;grid-template-columns:repeat(2,minmax(180px,1fr));gap:10px;margin-bottom:16px}
.date-box{padding:11px 13px;border-radius:14px;background:#faf6f8;border:1px solid #ead8e0;display:grid;gap:3px}
.date-box.due-box{background:#fff6ed;border-color:#efd8b7}
.task-card:not(.overdue) .date-box.due-box{background:#f7f3ff;border-color:#ddd2f0}
.date-label{font-size:11px;text-transform:uppercase;letter-spacing:.08em;font-weight:900;color:#997083}
.date-box strong{font-size:14px;color:#533b47}
.task-actions{
  display:flex;flex-wrap:wrap;gap:9px;align-items:center;
  padding-top:15px;border-top:1px dashed #e7cad6;
}
.task-actions form{margin:0}
.task-actions .btn{min-width:112px}
.task-actions details{position:relative}
.task-card .mini-form{top:50px;z-index:40}
.task-card.done .task-description{text-decoration:none;color:#657a70;background:#f5fbf8;border-color:#dcece4}
.task-card.done .task-accent{background:linear-gradient(180deg,#eef9f4,#f7fbfa);border-right-color:#d9e8e1}
.task-card.done .task-accent span{background:#dbf1e7;color:#3e836c}

@media(max-width:900px){
  .task-card{grid-template-columns:48px minmax(0,1fr)}
  .task-content{padding:19px 18px}
  .task-dates{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:680px){
  .task-card{grid-template-columns:1fr;min-height:0}
  .task-accent{display:none}
  .task-content{padding:18px}
  .task-header{flex-direction:column;gap:10px}
  .task-header h3{font-size:21px}
  .task-dates{grid-template-columns:1fr}
  .task-actions{display:grid;grid-template-columns:1fr 1fr}
  .task-actions form,.task-actions details{width:100%}
  .task-actions .btn{width:100%;min-width:0}
  .active-number-summary{grid-template-columns:1fr}
}
@media(max-width:430px){
  .task-actions{grid-template-columns:1fr}
}

/* ===== Versión 4.3: detalle individual de tareas ===== */
.task-title-link{color:inherit;text-decoration:none;border-bottom:1px dashed transparent}
.task-title-link:hover{color:var(--rose-dark);border-bottom-color:#dba7bc}
.task-head-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.task-view-btn{min-width:auto!important;padding:7px 11px;font-size:12px;background:#fff8fb;border-color:#e6c5d3;color:#8d4b6a}

.detail-topbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 0 16px}
.task-detail-card{
  position:relative;display:grid;grid-template-columns:68px minmax(0,1fr);
  background:linear-gradient(180deg,#fffdfd,#fff9fb);border:1px solid #e7c4d3;
  border-radius:28px;box-shadow:0 24px 60px rgba(117,65,91,.13);overflow:hidden;
}
.task-detail-card.overdue{border-left:8px solid #e5a64a}
.task-detail-card.done{border-color:#cde3d8;background:linear-gradient(180deg,#fdfffe,#f7fcf9)}
.detail-book-spine{
  background:linear-gradient(180deg,#fbeaf1,#f5edff);border-right:1px solid #eac3d3;
  display:flex;flex-direction:column;align-items:center;gap:28px;padding-top:34px;
}
.detail-book-spine span{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#f1d3df;color:#a95076}
.detail-content{padding:28px 30px 30px;min-width:0}
.detail-header{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;padding-bottom:18px;border-bottom:1px solid #ecd6df}
.detail-header h1{font-size:32px;line-height:1.15;overflow-wrap:anywhere;margin-bottom:0}
.detail-status{font-size:13px;padding:8px 12px}
.detail-note{margin:20px 0;padding:18px 20px;border-radius:18px;background:#fff7fa;border:1px solid #efd7e2}
.detail-note p{margin:7px 0 0;color:#604853;font-size:16px;white-space:pre-wrap;overflow-wrap:anywhere}
.detail-label{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.09em;font-weight:900;color:#a06f85}
.detail-info-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:22px}
.detail-info-box{display:grid;gap:5px;padding:14px 16px;border-radius:16px;background:#faf7f9;border:1px solid #ead9e0}
.detail-info-box.due{background:#f8f4ff;border-color:#dfd4f0}
.detail-info-box.due.is-overdue{background:#fff6e9;border-color:#ecd5ae}
.detail-info-box strong{font-size:14px;color:#563d49;overflow-wrap:anywhere}
.detail-actions-main{display:flex;justify-content:flex-start;padding:18px 0;border-top:1px dashed #e4c7d4}
.detail-edit-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:16px;margin-top:4px}
.detail-panel{padding:20px;border-radius:20px;background:#fff;border:1px solid #ead0dc;box-shadow:0 10px 24px rgba(117,65,91,.07)}
.postpone-panel{background:#fffaf5;border-color:#eedbc2}
.panel-heading{display:flex;gap:12px;align-items:flex-start;margin-bottom:16px}
.panel-heading h2{margin:0 0 3px;font-size:20px}
.panel-heading p{margin:0;font-size:13px}
.panel-icon{width:38px;height:38px;border-radius:13px;display:grid;place-items:center;background:#f6e1ea;color:#9d4f73;flex:0 0 auto}
.postpone-panel .panel-icon{background:#fff0d9;color:#a56b14}
.detail-danger-zone{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:20px;padding:16px 18px;border-radius:18px;background:#fff7f8;border:1px dashed #edbec9}
.detail-danger-zone p{margin:4px 0 0;font-size:13px}
@media(max-width:820px){
  .detail-edit-grid{grid-template-columns:1fr}
  .detail-info-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:680px){
  .task-head-actions{justify-content:flex-start}
  .task-detail-card{grid-template-columns:1fr}
  .detail-book-spine{display:none}
  .detail-content{padding:20px 17px}
  .detail-header,.detail-danger-zone,.detail-topbar{flex-direction:column;align-items:stretch}
  .detail-header h1{font-size:26px}
  .detail-info-grid{grid-template-columns:1fr}
  .detail-status{align-self:flex-start}
}


/* ===== Versión 4.4: acceso robusto a detalle de tarea ===== */
.task-card{isolation:isolate}
.task-content,.task-header,.task-heading,.task-head-actions,.task-view-form,.task-view-btn{position:relative;z-index:5}
.task-view-form{margin:0;display:inline-flex;pointer-events:auto}
.task-view-btn{pointer-events:auto!important;cursor:pointer!important;background:linear-gradient(135deg,#c96f98,#8f78c4)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 8px 18px rgba(169,75,120,.18)}
.task-view-btn:hover{transform:translateY(-1px);box-shadow:0 12px 24px rgba(169,75,120,.24)}
.task-header::after{content:"";position:absolute;inset:-8px;z-index:-1;pointer-events:none}
@media(max-width:680px){.task-view-form,.task-view-btn{width:100%}}

/* ===== Versión 4.5: agenda recurrente, vencidas y controles de seguridad ===== */
.topnav{flex-wrap:wrap}
.recurring-badge{background:#f3edff;color:#7255a8;border-color:#d9cbed}
.detail-status-group{display:flex;gap:8px;align-items:center;justify-content:flex-end;flex-wrap:wrap}
.recurring-date-box{background:#f6f1ff!important;border-color:#dcd0ef!important}
.recurring-occurrence-note{
  display:grid;grid-template-columns:44px minmax(0,1fr);gap:12px;align-items:start;
  margin:18px 0;padding:14px 16px;border-radius:17px;background:#faf6ff;border:1px solid #e1d5f0;
}
.recurring-occurrence-note>span{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;background:#eee4fb;font-size:20px}
.recurring-occurrence-note p{margin:4px 0 0;color:#6d5a72;font-size:13px;line-height:1.45}
.recurring-occurrence-note a{font-weight:800;color:#8d4b83}

.recurring-hero{margin-bottom:18px}
.recurring-create-card{margin-bottom:24px}
.recurring-form{grid-template-columns:1fr 1fr}
.weekday-fieldset{border:1px solid #ead3df;border-radius:18px;padding:14px 16px;background:#fffafb;min-width:0}
.weekday-fieldset legend{padding:0 7px;font-size:12px;text-transform:uppercase;letter-spacing:.08em;font-weight:900;color:#96647c}
.weekday-picker{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;margin:4px 0 6px}
.weekday-check{position:relative;display:block;cursor:pointer;min-width:0}
.weekday-check input{position:absolute;opacity:0;pointer-events:none}
.weekday-check span{
  min-height:44px;border:1px solid #e6ced9;border-radius:13px;background:#fff;display:grid;place-items:center;
  font-weight:850;color:#765262;transition:.16s ease;user-select:none;
}
.weekday-check input:checked+span{background:linear-gradient(135deg,#cf7da1,#8f79c5);color:#fff;border-color:transparent;box-shadow:0 7px 16px rgba(154,82,124,.18)}
.weekday-check input:focus-visible+span{outline:3px solid rgba(143,121,197,.23);outline-offset:2px}
.recurring-save-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.recurring-save-row .muted{max-width:560px}
.recurring-toolbar{margin-top:20px}
.recurring-toolbar h2{margin:0}
.recurring-list{display:grid;gap:18px;margin-bottom:34px}
.recurring-rule{padding:20px 22px;border:1px solid #e7cbd7;background:linear-gradient(180deg,#fffdfd,#fff9fb)}
.recurring-rule.inactive{opacity:.75;background:#faf8f9}
.recurring-rule-head{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:14px;align-items:start;padding-bottom:15px;border-bottom:1px solid #edd9e2}
.recurring-icon{width:44px;height:44px;border-radius:15px;display:grid;place-items:center;background:#f2e8ff;font-size:21px}
.recurring-title{min-width:0}
.recurring-title h3{margin:2px 0 5px;font-size:21px;color:#553747;overflow-wrap:anywhere}
.recurring-title p{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}
.recurring-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:16px 0}
.recurring-actions{display:flex;gap:9px;align-items:center;flex-wrap:wrap;padding-top:14px;border-top:1px dashed #e5cad6}
.recurring-actions form{margin:0}
.recurring-actions details{position:relative}
.recurring-edit-form{width:min(680px,88vw);grid-template-columns:1fr 1fr;z-index:80}
.recurring-edit-form .weekday-fieldset,.recurring-edit-form label:has(textarea),.recurring-edit-form>button{grid-column:1/-1}
.compact-weekdays{padding:10px 12px}
.warning-btn{background:#fff5e6;border-color:#eacb95;color:#8a5a14}

.security-control-card{position:relative;overflow:visible}
.security-card-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}
.security-card-heading h2{margin:0}
.security-qr-details{margin:14px 0}
.security-qr-details>summary{display:inline-flex}
.security-toggle-form{display:flex;align-items:end;gap:10px;flex-wrap:wrap;margin-top:16px;padding-top:15px;border-top:1px dashed #e5cad6}
.security-toggle-form label{min-width:210px}
.security-toggle-form input{width:100%}
.wa-account-box{display:grid;grid-template-columns:44px minmax(0,1fr);gap:12px;align-items:center;margin:14px 0;padding:13px 14px;background:#f5fcf8;border:1px solid #d9e9e1;border-radius:16px}
.wa-reconnect-box{display:grid;justify-items:center;gap:10px;margin:14px 0;padding:15px;border-radius:18px;background:#fffafc;border:1px solid #ecd7e0}

@media(max-width:900px){
  .recurring-summary-grid{grid-template-columns:1fr 1fr}
  .weekday-picker{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(max-width:680px){
  .recurring-form{grid-template-columns:1fr}
  .recurring-rule-head{grid-template-columns:44px minmax(0,1fr)}
  .recurring-rule-head>.recipient-status{grid-column:2;justify-self:start}
  .recurring-summary-grid{grid-template-columns:1fr}
  .recurring-actions{display:grid;grid-template-columns:1fr}
  .recurring-actions form,.recurring-actions details,.recurring-actions .btn{width:100%}
  .recurring-edit-form{grid-template-columns:1fr;width:min(92vw,520px)}
  .recurring-edit-form .weekday-fieldset,.recurring-edit-form label:has(textarea),.recurring-edit-form>button{grid-column:auto}
  .weekday-picker{grid-template-columns:repeat(4,minmax(0,1fr))}
  .security-card-heading,.security-toggle-form{align-items:stretch;flex-direction:column}
  .detail-status-group{justify-content:flex-start}
}
@media(max-width:430px){
  .weekday-picker{grid-template-columns:repeat(2,minmax(0,1fr))}
}