/* =========================================================================
   NutriPro Clinical — acceso, portal del paciente, módulos nuevos
   y adaptación a móvil y tablet.
   Se carga después de app.css y reutiliza sus mismos tokens de color.
   ========================================================================= */

/* =========================================================================
   1. Pantalla de acceso
   ========================================================================= */
.acceso{
  position:fixed;inset:0;z-index:50;overflow-y:auto;
  background:
    radial-gradient(1200px 600px at 15% -10%, rgba(14,143,126,.30), transparent 60%),
    radial-gradient(900px 500px at 110% 110%, rgba(47,111,237,.20), transparent 55%),
    var(--sidebar);
  padding:env(safe-area-inset-top) 16px calc(24px + env(safe-area-inset-bottom));
}
.acc-caja{min-height:100%;display:grid;place-items:center;padding:28px 0}
.acc-panel{
  width:min(430px,100%);background:var(--bg-elev);border:1px solid var(--line);
  border-radius:var(--r-xl);box-shadow:var(--sh-3);padding:30px 28px 26px;
}
.acc-logo{
  width:54px;height:54px;border-radius:18px;display:grid;place-items:center;margin:0 auto 16px;
  background:linear-gradient(135deg,var(--brand) 0%,#16b39b 100%);
  color:#fff;font-weight:800;font-size:25px;box-shadow:0 8px 22px rgba(14,143,126,.4)
}
.acc-panel h1{font-size:21px;text-align:center;margin-bottom:6px}
.acc-sub{font-size:13px;color:var(--fg-mute);text-align:center;line-height:1.6;margin:0 0 22px}
.acc-f{display:block;margin-bottom:14px}
.acc-f>span{display:block;font-size:12px;font-weight:660;color:var(--fg-soft);margin-bottom:5px}
.acc-f>span i{font-weight:400;color:var(--fg-mute);font-style:normal}
.acc-f em{display:block;font-size:11px;color:var(--fg-mute);margin-top:5px;font-style:normal;line-height:1.45}
.acc-f .inp{font-size:16px;padding:11px 13px}   /* 16px evita el zoom de iOS */
.acc-error{
  background:var(--danger-soft);color:var(--danger);border:1px solid var(--danger);
  border-radius:9px;padding:10px 13px;font-size:12.8px;margin-top:6px;line-height:1.5
}
.acc-pie{font-size:11.5px;color:var(--fg-mute);text-align:center;margin:20px 0 0;line-height:1.6}
.acc-pie code{background:var(--bg-sunken);padding:1px 5px;border-radius:5px;font-family:var(--ff-mono)}

/* =========================================================================
   2. Estado de sincronización y bloque de usuario
   ========================================================================= */
.sync{
  display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:99px;
  font-size:11.5px;font-weight:600;border:1px solid var(--line);background:var(--bg-sunken);
  color:var(--fg-mute);white-space:nowrap
}
.sync.ok{color:var(--ok);border-color:color-mix(in srgb,var(--ok) 30%,transparent);background:var(--ok-soft)}
.sync.info{color:var(--info);border-color:color-mix(in srgb,var(--info) 30%,transparent);background:var(--info-soft)}
.sync.warn{color:var(--warn);border-color:color-mix(in srgb,var(--warn) 30%,transparent);background:var(--warn-soft)}
.sync.err{color:var(--danger);border-color:color-mix(in srgb,var(--danger) 30%,transparent);background:var(--danger-soft)}
.sync .ic{font-size:12px}

.usuario-caja{padding:8px 10px;border-top:1px solid rgba(255,255,255,.07)}
.usr{
  display:flex;align-items:center;gap:10px;width:100%;padding:8px;border:0;border-radius:10px;
  background:rgba(255,255,255,.05);color:var(--sidebar-fg);cursor:pointer;text-align:left;transition:.14s
}
.usr:hover{background:rgba(255,255,255,.13)}
.usr .ini{
  width:32px;height:32px;flex:0 0 32px;border-radius:11px;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--brand),#16b39b);color:#fff;font-weight:700;font-size:12.5px
}
.usr .dat{overflow:hidden;min-width:0}
.usr .dat b{display:block;color:#fff;font-size:12.8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.usr .dat span{font-size:10.5px;color:#7fa3b1;white-space:nowrap}
.app.collapsed .usr .dat{display:none}
.app.collapsed .usr{justify-content:center}

.nav-num{
  margin-left:auto;background:var(--danger);color:#fff;border-radius:99px;
  font-size:10.5px;font-weight:700;padding:1px 7px;line-height:1.5
}
.app.collapsed .nav-num{display:none}

/* =========================================================================
   3. Agenda
   ========================================================================= */
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.cal-h{
  text-align:center;font-size:10.5px;font-weight:700;color:var(--fg-mute);
  text-transform:uppercase;letter-spacing:.08em;padding:6px 0
}
.cal-c{
  aspect-ratio:1/.86;border:1px solid var(--line-soft);border-radius:9px;padding:5px 6px;
  cursor:pointer;transition:.12s;display:flex;flex-direction:column;background:var(--bg-elev);min-height:52px
}
.cal-c:hover{background:var(--bg-hover);border-color:var(--brand)}
.cal-c.fuera{border:0;background:transparent;cursor:default}
.cal-c.hoy{border-color:var(--brand);box-shadow:inset 0 0 0 1px var(--brand)}
.cal-c.sel{background:var(--brand-soft);border-color:var(--brand)}
.cal-c .n{font-size:12.5px;font-weight:640;color:var(--fg-soft)}
.cal-c.hoy .n{color:var(--brand);font-weight:800}
.cal-c .ev{display:flex;flex-wrap:wrap;gap:3px;margin-top:auto;align-items:center}
.cal-c .ev .pt{width:7px;height:7px;border-radius:50%;display:block}
.cal-c .ev .mas{font-size:9.5px;color:var(--fg-mute);font-weight:700}

.leyenda{display:flex;flex-wrap:wrap;gap:14px;font-size:11.5px;color:var(--fg-soft)}
.leyenda span{display:inline-flex;align-items:center;gap:6px}
.leyenda i{width:9px;height:9px;border-radius:50%;display:inline-block}

.hora-box{
  width:58px;flex:0 0 58px;text-align:center;border-left:3px solid var(--brand);
  padding-left:9px;line-height:1.25
}
.hora-box b{display:block;font-family:var(--ff-mono);font-size:13.5px}
.hora-box span{font-size:10.5px;color:var(--fg-mute)}

/* =========================================================================
   4. Mensajería
   ========================================================================= */
.msg-layout{display:grid;grid-template-columns:320px minmax(0,1fr);gap:16px;align-items:start}
.msg-lista{max-height:calc(100vh - 220px);display:flex;flex-direction:column}
.msg-lista .card-b{overflow-y:auto}
.msg-lista .list-row.activa{background:var(--brand-soft);box-shadow:inset 3px 0 0 var(--brand)}
.msg-hilo{display:flex;flex-direction:column;max-height:calc(100vh - 220px)}
.hilo-cuerpo{overflow-y:auto;flex:1;display:flex;flex-direction:column;gap:10px;background:var(--bg-sunken)}

.msg{max-width:76%;padding:10px 14px;border-radius:14px;font-size:13.2px;line-height:1.55;box-shadow:var(--sh-1)}
.msg p{margin:0}
.msg b{display:block;font-size:12px;margin-bottom:3px;opacity:.85}
.msg time{display:block;font-size:10.5px;opacity:.6;margin-top:5px}
.msg.entrante{background:var(--bg-elev);border:1px solid var(--line);align-self:flex-start;border-bottom-left-radius:5px}
.msg.saliente{background:var(--brand);color:#fff;align-self:flex-end;border-bottom-right-radius:5px}
.msg.saliente time{opacity:.8}

/* =========================================================================
   5. Usuarios y permisos
   ========================================================================= */
.perm-row{border-bottom:1px solid var(--line-soft);padding:9px 8px;align-items:flex-start}
.perm-row:last-child{border-bottom:0}
.perm-row .bdg{margin-left:6px;transform:translateY(-1px)}
.clave-caja{
  background:var(--bg-sunken);border:1px dashed var(--line);border-radius:12px;padding:14px 16px;margin:14px 0
}
.clave-caja>div{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:5px 0}
.clave-caja span{font-size:11.5px;color:var(--fg-mute);text-transform:uppercase;letter-spacing:.07em;font-weight:700}
.clave-caja b{font-size:16px;letter-spacing:.04em;user-select:all}
.pac-check{max-height:240px;overflow-y:auto;border:1px solid var(--line);border-radius:10px;padding:5px}
.ml2{margin-left:8px}

/* =========================================================================
   6. Portal del paciente
   ========================================================================= */
.portal{
  position:fixed;inset:0;z-index:40;display:flex;flex-direction:column;background:var(--bg);
  overflow:hidden
}
body.es-portal{overscroll-behavior-y:none}

.pt-cargando{display:grid;place-content:center;gap:12px;height:100%;text-align:center;color:var(--fg-mute);padding:24px}
.pt-spin{
  width:34px;height:34px;border-radius:50%;margin:0 auto;
  border:3px solid var(--line);border-top-color:var(--brand);animation:girar .8s linear infinite
}
@keyframes girar{to{transform:rotate(360deg)}}

.pt-top{
  display:flex;align-items:center;gap:12px;padding:calc(10px + env(safe-area-inset-top)) 16px 10px;
  background:var(--sidebar);color:#fff;flex:0 0 auto
}
.pt-marca{display:flex;align-items:center;gap:10px;min-width:0;flex:1}
.pt-logo{
  width:34px;height:34px;flex:0 0 34px;border-radius:12px;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--brand),#16b39b);font-weight:800;font-size:16px
}
.pt-marca b{display:block;font-size:14px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pt-marca span{font-size:11.5px;color:#8fb3c0}
.pt-top .btn{color:#fff}
.pt-top .btn:hover{background:rgba(255,255,255,.12)}

.pt-cuerpo{
  flex:1;overflow-y:auto;padding:16px 16px 26px;
  -webkit-overflow-scrolling:touch;scroll-behavior:smooth
}
.pt-cuerpo>*{max-width:720px;margin-left:auto;margin-right:auto}

.pt-nav{
  display:flex;background:var(--bg-elev);border-top:1px solid var(--line);
  padding-bottom:env(safe-area-inset-bottom);flex:0 0 auto
}
.pt-nav a{
  flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 2px 7px;
  color:var(--fg-mute);font-size:10.5px;text-decoration:none;position:relative;transition:.14s
}
.pt-nav a:hover{text-decoration:none;color:var(--fg-soft)}
.pt-nav a.on{color:var(--brand)}
.pt-nav a .i{font-size:20px;line-height:1;position:relative}
.pt-punto{
  position:absolute;top:-4px;right:-9px;background:var(--danger);color:#fff;border-radius:99px;
  font-size:9.5px;font-weight:700;padding:1px 5px;line-height:1.5;min-width:16px;text-align:center
}

.pt-hola{margin:4px 0 18px}
.pt-hola h1{font-size:23px;letter-spacing:-.02em}
.pt-hola p{color:var(--fg-mute);font-size:13px;margin:3px 0 0;text-transform:capitalize}

.pt-card{
  background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--sh-1);margin-bottom:14px;overflow:hidden
}
.pt-card-h{display:flex;align-items:center;gap:10px;padding:13px 16px 0}
.pt-card-h h2{font-size:13px;text-transform:uppercase;letter-spacing:.07em;color:var(--fg-mute);flex:1}
.pt-card-b{padding:12px 16px 16px}

.pt-aviso{
  display:flex;align-items:center;gap:12px;padding:13px 15px;margin-bottom:14px;
  background:var(--info-soft);border:1px solid color-mix(in srgb,var(--info) 30%,transparent);
  border-radius:var(--r-lg);color:var(--info);text-decoration:none
}
.pt-aviso:hover{text-decoration:none;filter:brightness(1.03)}
.pt-aviso>span{font-size:22px}
.pt-aviso b{display:block;font-size:13.5px}
.pt-aviso div>span{font-size:12px;opacity:.85}
.pt-aviso i{margin-left:auto;font-size:22px;font-style:normal;opacity:.6}

.pt-fechabox{
  width:56px;flex:0 0 56px;text-align:center;background:var(--brand);color:#fff;
  border-radius:12px;padding:7px 0 6px;line-height:1.1
}
.pt-fechabox b{display:block;font-size:21px;font-weight:750}
.pt-fechabox span{font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;opacity:.9}
.pt-fechabox.pasada{background:var(--bg-sunken);color:var(--fg-mute)}
.pt-cita-grande{display:flex;align-items:center;gap:14px}
.pt-cita-grande b{font-size:14.5px;text-transform:capitalize}

.pt-evo{display:flex;align-items:center;justify-content:space-between;gap:10px;text-align:center}
.pt-evo>div span{display:block;font-size:11px;color:var(--fg-mute);text-transform:uppercase;letter-spacing:.06em}
.pt-evo>div b{font-size:20px;font-family:var(--ff-mono)}
.pt-flecha{font-size:15px;font-weight:700;white-space:nowrap}

.pt-mat{
  display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--line);
  border-radius:13px;background:var(--bg-elev);margin-bottom:9px;cursor:pointer;transition:.13s
}
.pt-mat:hover{border-color:var(--brand);background:var(--bg-hover)}
.pt-mat .ic{font-size:22px;flex:0 0 auto}
.pt-mat div{flex:1;min-width:0}
.pt-mat b{display:block;font-size:13.8px;line-height:1.35}
.pt-mat span{display:block;font-size:12px;color:var(--fg-mute);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pt-mat i{font-style:normal;font-size:20px;color:var(--fg-mute)}

.pt-filtros{display:flex;gap:7px;overflow-x:auto;padding-bottom:10px;margin-bottom:6px}
.pt-filtros button{
  border:1px solid var(--line);background:var(--bg-elev);color:var(--fg-soft);
  padding:6px 13px;border-radius:99px;font-size:12.5px;cursor:pointer;white-space:nowrap
}
.pt-filtros button.on{background:var(--brand);border-color:var(--brand);color:#fff}

.pt-sel{margin-bottom:12px}
.pt-dias{display:flex;gap:7px;overflow-x:auto;padding-bottom:10px;margin-bottom:4px}
.pt-dias button{
  min-width:52px;border:1px solid var(--line);background:var(--bg-elev);border-radius:12px;
  padding:7px 4px;cursor:pointer;color:var(--fg-soft);transition:.13s
}
.pt-dias button b{display:block;font-size:9.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--fg-mute)}
.pt-dias button span{display:block;font-size:17px;font-weight:700}
.pt-dias button.on{background:var(--brand);border-color:var(--brand);color:#fff}
.pt-dias button.on b{color:rgba(255,255,255,.8)}

.pt-resumen-dia{
  display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:14px;
  background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--r-lg);padding:13px 10px;text-align:center
}
.pt-resumen-dia b{display:block;font-size:17px;font-family:var(--ff-mono);letter-spacing:-.02em}
.pt-resumen-dia span{font-size:10.5px;color:var(--fg-mute)}

.pt-comida{
  background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--r-lg);
  overflow:hidden;margin-bottom:11px
}
.pt-comida header{display:flex;align-items:center;gap:10px;padding:11px 15px;background:var(--bg-sunken)}
.pt-comida header .ic{font-size:17px}
.pt-comida header b{flex:1;font-size:14px}
.pt-comida header i{font-style:normal;font-size:11.5px;color:var(--fg-mute);font-family:var(--ff-mono)}
.pt-comida ul{list-style:none;margin:0;padding:0}
.pt-comida li{display:flex;gap:11px;padding:9px 15px;border-top:1px solid var(--line-soft);font-size:13.5px}
.pt-comida li .g{font-family:var(--ff-mono);font-size:12.5px;color:var(--brand-2);font-weight:700;min-width:56px;flex:0 0 auto}
.pt-comida li .n{flex:1}
.pt-comida li em{font-style:normal;color:var(--fg-mute);font-size:12px}

.pt-acciones{margin-top:18px}
.pt-legal{font-size:11.5px;color:var(--fg-mute);line-height:1.6;margin-top:16px;text-align:center}
.pt-sec{font-size:11.5px;text-transform:uppercase;letter-spacing:.09em;color:var(--fg-mute);margin:22px 0 9px}
.pt-grupo{font-size:11.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--brand-2);margin:16px 0 6px}
.pt-lista{list-style:none;margin:0;padding:0}
.pt-texto{line-height:1.7;font-size:14px;color:var(--fg-soft)}
.pt-texto p{margin:0 0 11px}
.pt-texto ul{margin:0 0 12px;padding-left:20px}
.pt-texto li{margin-bottom:4px}

.pt-cita{
  display:flex;align-items:center;gap:13px;padding:13px;border:1px solid var(--line);
  border-radius:var(--r-lg);background:var(--bg-elev);margin-bottom:9px
}
.pt-cita .cuerpo{flex:1;min-width:0}
.pt-cita .cuerpo>b{text-transform:capitalize;font-size:14px;display:block;margin-bottom:4px}

.pt-vacio{text-align:center;padding:46px 22px;color:var(--fg-mute)}
.pt-vacio .ic{font-size:44px;opacity:.35;margin-bottom:10px}
.pt-vacio h2{font-size:16px;color:var(--fg-soft);margin-bottom:6px}
.pt-vacio p{font-size:13px;line-height:1.6;max-width:330px;margin:0 auto}

.pt-chat{display:flex;flex-direction:column;gap:10px;padding-bottom:12px;min-height:180px}
.pt-msg{max-width:82%;padding:11px 14px;border-radius:15px;font-size:13.5px;line-height:1.55;box-shadow:var(--sh-1)}
.pt-msg p{margin:0}
.pt-msg b{display:block;font-size:11.5px;opacity:.8;margin-bottom:3px}
.pt-msg i{display:block;font-style:normal;font-weight:700;font-size:12.5px;margin-bottom:4px}
.pt-msg time{display:block;font-size:10.5px;opacity:.6;margin-top:5px}
.pt-msg.mio{background:var(--brand);color:#fff;align-self:flex-end;border-bottom-right-radius:5px}
.pt-msg.suyo{background:var(--bg-elev);border:1px solid var(--line);align-self:flex-start;border-bottom-left-radius:5px}

.pt-envio{display:flex;gap:8px;align-items:flex-end;position:sticky;bottom:0;background:var(--bg);padding:8px 0}
.pt-envio textarea{flex:1;font-size:16px;min-height:44px}
.pt-envio button{flex:0 0 auto;height:44px;width:52px;font-size:17px}

.pt-perfil{display:flex;flex-direction:column;gap:3px}
.pt-perfil b{font-size:16px}
.pt-pie{margin-top:22px}

/* =========================================================================
   7. Tablas que se apilan en pantallas estrechas
   ========================================================================= */
@media(max-width:760px){
  table.tbl.apilable thead{display:none}
  table.tbl.apilable tbody tr{
    display:block;border:1px solid var(--line);border-radius:12px;margin:0 10px 10px;
    padding:6px 4px;background:var(--bg-elev)
  }
  table.tbl.apilable tbody tr:hover{background:var(--bg-elev)}
  table.tbl.apilable td{
    display:flex;justify-content:space-between;gap:12px;align-items:center;
    border:0;border-bottom:1px solid var(--line-soft);padding:7px 11px;text-align:right
  }
  table.tbl.apilable td:last-child{border-bottom:0}
  table.tbl.apilable td::before{
    content:attr(data-col);flex:0 0 auto;font-size:10.5px;text-transform:uppercase;
    letter-spacing:.07em;color:var(--fg-mute);font-weight:700;text-align:left
  }
  table.tbl.apilable td:empty{display:none}
  table.tbl.apilable tfoot{display:none}
}

/* =========================================================================
   8. Móvil y tablet: cajón lateral, barra inferior y ajustes de tamaño
   ========================================================================= */
.solo-movil{display:none}
.velo{display:none}
.cerrar-cajon{display:none}
.nav-movil{display:none}

@media(max-width:900px){
  .app{grid-template-columns:1fr;position:relative}
  .app.collapsed{--sidebar-w:264px}

  .sidebar{
    position:fixed;top:0;bottom:0;left:0;width:280px;z-index:60;
    transform:translateX(-100%);transition:transform .22s cubic-bezier(.4,0,.2,1);
    box-shadow:var(--sh-3);padding-top:env(safe-area-inset-top)
  }
  .app.cajon-abierto .sidebar{transform:none}
  .app.collapsed .nav a span.lbl,
  .app.collapsed .brand .txt,
  .app.collapsed .usr .dat{display:block}
  .app.collapsed .nav a{justify-content:flex-start;padding:9px 11px}
  .app.collapsed .nav-group{opacity:1;height:auto;margin:14px 0 6px}

  .velo{
    display:block;position:fixed;inset:0;z-index:55;background:rgba(8,18,24,.5);
    opacity:0;pointer-events:none;transition:opacity .22s
  }
  .app.cajon-abierto .velo{opacity:1;pointer-events:auto}

  .cerrar-cajon{
    display:block;margin-left:auto;background:none;border:0;color:var(--sidebar-fg);
    font-size:24px;line-height:1;padding:2px 8px;cursor:pointer;border-radius:8px
  }

  .solo-movil{display:inline-flex}
  .topbar{
    padding:0 12px;height:56px;flex:0 0 56px;gap:9px;
    padding-top:env(safe-area-inset-top);height:calc(56px + env(safe-area-inset-top));
    flex-basis:calc(56px + env(safe-area-inset-top))
  }
  .topbar .titulos{min-width:0;overflow:hidden}
  .topbar h1{font-size:15.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .topbar .crumb{display:none}
  .sync .tx{display:none}
  .sync{padding:5px 8px}
  #topActions{gap:6px}
  #topActions .btn{padding:7px 10px;font-size:12.5px}

  .content{padding:13px 12px calc(74px + env(safe-area-inset-bottom))}

  .nav-movil{
    display:flex;position:fixed;left:0;right:0;bottom:0;z-index:30;
    background:var(--bg-elev);border-top:1px solid var(--line);
    padding-bottom:env(safe-area-inset-bottom)
  }
  .nav-movil a,.nav-movil .mas{
    flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:7px 2px 6px;
    color:var(--fg-mute);font-size:10px;text-decoration:none;background:none;border:0;cursor:pointer
  }
  .nav-movil a.on{color:var(--brand)}
  .nav-movil a:hover{text-decoration:none}
  .nav-movil .i{font-size:19px;line-height:1;position:relative}
  .nav-movil .t{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}

  /* Rejillas y formularios a una columna */
  .grid.g2,.grid.g3,.grid.g4,.grid.g5{grid-template-columns:repeat(2,minmax(0,1fr))}
  .frow.c2,.frow.c3,.frow.c4{grid-template-columns:1fr}
  .split-pane,.msg-layout{grid-template-columns:1fr}
  .msg-lista,.msg-hilo{max-height:none}
  .hilo-cuerpo{max-height:56vh}
  .msg{max-width:88%}

  /* El teclado de iOS hace zoom si la letra baja de 16px */
  .inp,select.inp,textarea.inp{font-size:16px;padding:10px 12px}
  .btn{padding:9px 14px}
  .btn.sm{padding:7px 11px}
  .check{padding:8px}
  .modal{max-height:92vh;width:100%;border-radius:18px 18px 0 0;margin-top:auto}
  .backdrop{padding:0;align-items:end}
  .modal-b{padding:18px 16px}
  .modal-h,.modal-f{padding:14px 16px}
  .toasts{left:12px;right:12px;bottom:calc(78px + env(safe-area-inset-bottom));max-width:none}
  .kpi .k-val{font-size:22px}
  .cal-c{min-height:44px;padding:3px 4px;border-radius:7px}
  .cal-c .n{font-size:11.5px}
  .week-grid{grid-template-columns:repeat(7,minmax(128px,1fr))}
}

@media(max-width:560px){
  .grid.g2,.grid.g3,.grid.g4,.grid.g5{grid-template-columns:1fr}
  .pt-resumen-dia{grid-template-columns:repeat(2,1fr);row-gap:12px}
  .acc-panel{padding:24px 20px 20px}
  .pt-hola h1{font-size:20px}
  .hora-box{width:50px;flex-basis:50px}
  .list-row{padding:10px 12px;gap:9px}
}

/* Pantallas grandes: el contenido no se estira sin límite */
@media(min-width:1700px){ .content>.wrap{max-width:1600px} }

/* En impresión no se ven ni la barra inferior ni el portal */
@media print{
  .nav-movil,.velo,.pt-nav,.pt-top,.sync,.usuario-caja{display:none !important}
  .portal{position:static;overflow:visible}
  .pt-cuerpo{overflow:visible;padding:0}
}

/* =========================================================================
   9. Ficha ordenada del paciente
   ========================================================================= */
.ficha-n{
  width:26px;height:26px;flex:0 0 26px;border-radius:8px;display:grid;place-items:center;
  background:var(--brand);color:#fff;font-weight:700;font-size:13px
}
.datos-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:2px 16px}
.dato{display:flex;justify-content:space-between;gap:12px;align-items:baseline;padding:7px 0;border-bottom:1px solid var(--line-soft)}
.dato>span{font-size:11.5px;color:var(--fg-mute);font-weight:600;flex:0 0 auto}
.dato>b{font-size:13.5px;text-align:right;min-width:0;word-break:break-word}
.dato>b i{font-weight:400;font-style:italic;font-size:12.5px}
.datos-grid.destacado .dato{border-bottom:0;background:var(--bg-sunken);border-radius:9px;padding:9px 12px;margin-bottom:4px}
.datos-grid.destacado .dato>b{font-size:15px;font-family:var(--ff-mono)}

.pat-lista{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:11px}
.pat-item{border:1px solid var(--line);border-left:3px solid var(--brand);border-radius:10px;padding:11px 13px;background:var(--bg-sunken)}
.pat-item b{display:block;font-size:13.8px;margin-bottom:3px}
.pat-item p{margin:6px 0 0;line-height:1.55}

.lista-simple{margin:0;padding-left:19px;font-size:13px;color:var(--fg-soft);line-height:1.7}
.ficha-acc{display:flex;flex-wrap:wrap;gap:8px;align-items:center}

/* =========================================================================
   10. Apartados — el patrón con el que se estructura toda la aplicación

   Cada bloque de contenido se presenta igual: un distintivo con su
   emoticono, un enunciado, una línea que explica para qué sirve y, si hace
   falta, sus acciones a la derecha. Así cualquier pantalla se lee igual.
   ========================================================================= */
.apart{
  background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--r-lg);
  margin-bottom:16px;overflow:hidden
}
.apart-h{display:flex;align-items:flex-start;gap:13px;padding:16px 18px 14px}
.apart.con-cuerpo .apart-h{border-bottom:1px solid var(--line-soft);padding-bottom:14px}
.apart-ic{
  /* min-width/min-height a 0: si no, el ancho mínimo del emoticono estira el
     distintivo y deja de ser cuadrado. */
  width:36px;height:36px;flex:0 0 36px;min-width:0;min-height:0;overflow:hidden;
  border-radius:12px;display:grid;place-items:center;
  background:var(--bg-sunken);font-size:18px;line-height:1;border:1px solid var(--line-soft);
  transition:transform .16s cubic-bezier(.2,.8,.2,1)
}
.apart-ic.tono-brand{background:linear-gradient(135deg,var(--brand-soft),color-mix(in srgb,var(--brand) 18%,var(--brand-soft)));border-color:transparent}
.apart-ic.tono-warn{background:linear-gradient(135deg,var(--warn-soft),color-mix(in srgb,var(--warn) 18%,var(--warn-soft)));border-color:transparent}
.apart-ic.tono-danger{background:linear-gradient(135deg,var(--danger-soft),color-mix(in srgb,var(--danger) 18%,var(--danger-soft)));border-color:transparent}
.apart-ic.tono-info{background:linear-gradient(135deg,var(--info-soft),color-mix(in srgb,var(--info) 18%,var(--info-soft)));border-color:transparent}
.apart-ic.tono-ok{background:linear-gradient(135deg,var(--ok-soft),color-mix(in srgb,var(--ok) 18%,var(--ok-soft)));border-color:transparent}
.apart-ic.tono-purple{background:linear-gradient(135deg,var(--purple-soft),color-mix(in srgb,var(--purple) 18%,var(--purple-soft)));border-color:transparent}
.apart:hover .apart-ic{transform:scale(1.06)}
.apart-t{flex:1;min-width:0;padding-top:1px}
.apart-t h2{font-size:15px;font-weight:650;letter-spacing:-.01em;line-height:1.3}
.apart-t p{font-size:12.5px;color:var(--fg-mute);margin:3px 0 0;line-height:1.5}
.apart-a{display:flex;gap:7px;flex-wrap:wrap;align-items:center;flex:0 0 auto}
.apart-b{padding:16px 18px 18px}
.apart-b.flush{padding:0}
.apart-b.tight{padding:12px}
.apart-f{padding:12px 18px;border-top:1px solid var(--line-soft);background:var(--bg-sunken)}

/* Rejilla de apartados */
.aparts{display:grid;gap:16px}
.aparts.dos{grid-template-columns:repeat(2,minmax(0,1fr))}
.aparts.dos .apart{margin-bottom:0}
@media(max-width:1000px){.aparts.dos{grid-template-columns:1fr}}

/* Encabezado de página con distintivo */
.pagina-h{display:flex;align-items:center;gap:12px;min-width:0}
.pagina-ic{
  width:38px;height:38px;flex:0 0 38px;min-width:0;min-height:0;overflow:hidden;
  border-radius:12px;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--brand-soft),color-mix(in srgb,var(--brand) 18%,var(--brand-soft)));font-size:19px;line-height:1
}
.pagina-t{min-width:0}
.pagina-t h1{font-size:17px;font-weight:660;letter-spacing:-.015em;line-height:1.25}
.pagina-t .crumb{font-size:11px;color:var(--fg-mute);letter-spacing:.06em;text-transform:uppercase;font-weight:660}

/* Enunciado suelto dentro de un apartado */
.enunciado{
  display:flex;align-items:center;gap:9px;font-size:11.5px;font-weight:700;
  text-transform:uppercase;letter-spacing:.09em;color:var(--fg-mute);
  margin:0 0 11px;padding-bottom:8px;border-bottom:1px solid var(--line-soft)
}
.enunciado .e{font-size:14px;letter-spacing:0}
.enunciado + .enunciado{margin-top:22px}
.enunciado .sp{flex:1}
.enunciado .lib{text-transform:none;letter-spacing:0;font-weight:500;font-size:11.5px}

/* Fichas de acceso rápido dentro de un apartado */
.accesos{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px}
.acceso-t{
  display:flex;align-items:center;gap:11px;padding:12px 13px;border:1px solid var(--line);
  border-radius:13px;background:var(--bg-elev);cursor:pointer;transition:.16s cubic-bezier(.2,.8,.2,1);text-align:left;
  color:inherit;font:inherit;width:100%
}
.acceso-t:hover{border-color:var(--brand);background:var(--bg-hover);text-decoration:none;transform:translateY(-2px);box-shadow:var(--sh-1)}
.acceso-t .e{font-size:19px;line-height:1;flex:0 0 auto}
.acceso-t b{display:block;font-size:13px;font-weight:620;line-height:1.3}
.acceso-t span{display:block;font-size:11.5px;color:var(--fg-mute);margin-top:1px}
.acceso-t .n{margin-left:auto;font-family:var(--ff-mono);font-size:14px;font-weight:700;color:var(--brand)}

/* Lista de tareas pendientes */
.tarea{
  display:flex;align-items:center;gap:12px;padding:12px 15px;
  border-bottom:1px solid var(--line-soft);transition:.12s
}
.tarea:last-child{border-bottom:0}
.tarea:hover{background:var(--bg-hover)}
.tarea .e{font-size:17px;flex:0 0 auto;width:22px;text-align:center}
.tarea .cuerpo{flex:1;min-width:0}
.tarea .cuerpo b{display:block;font-size:13.3px;font-weight:600}
.tarea .cuerpo span{display:block;font-size:12px;color:var(--fg-mute);margin-top:1px}

/* Cifras grandes de un informe */
.cifras{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1px;background:var(--line-soft);
  border:1px solid var(--line-soft);border-radius:11px;overflow:hidden}
.cifra{background:var(--bg-elev);padding:14px 15px}
.cifra .l{font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:var(--fg-mute);font-weight:680}
.cifra .v{font-size:23px;font-weight:700;letter-spacing:-.025em;margin-top:4px;line-height:1.1;font-variant-numeric:tabular-nums}
.cifra .v small{font-size:12.5px;font-weight:600;color:var(--fg-soft);letter-spacing:0}
.cifra .s{font-size:11.5px;color:var(--fg-mute);margin-top:3px}
.cifra .s.pos{color:var(--ok)} .cifra .s.neg{color:var(--danger)}

/* Barras horizontales de comparación */
.ranking{display:flex;flex-direction:column;gap:9px}
.rank{display:grid;grid-template-columns:minmax(90px,1.1fr) minmax(0,2fr) 52px;gap:11px;align-items:center;font-size:12.5px}
.rank .et{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--fg-soft)}
.rank .tr{height:7px;border-radius:99px;background:var(--bg-sunken);overflow:hidden}
.rank .tr>i{display:block;height:100%;border-radius:99px;background:var(--brand)}
.rank .nu{text-align:right;font-family:var(--ff-mono);font-size:12px;font-weight:650}

/* Calendario mensual de ingresos */
.meses{display:grid;grid-template-columns:repeat(auto-fit,minmax(74px,1fr));gap:6px;align-items:end;height:130px}
.mes-b{display:flex;flex-direction:column;justify-content:flex-end;height:100%;gap:5px;text-align:center}
.mes-b .bar-v{background:var(--brand);border-radius:5px 5px 0 0;min-height:3px;transition:height .4s}
.mes-b .bar-v.suave{background:var(--brand-soft)}
.mes-b .et{font-size:10.5px;color:var(--fg-mute);white-space:nowrap}
.mes-b .va{font-size:11px;font-weight:680;font-variant-numeric:tabular-nums}

/* Plantillas de mensaje */
.plantilla{
  border:1px solid var(--line);border-radius:11px;padding:13px 15px;background:var(--bg-elev);
  display:flex;flex-direction:column;gap:8px
}
.plantilla .cab{display:flex;align-items:center;gap:9px}
.plantilla .cab .e{font-size:17px}
.plantilla .cab b{flex:1;font-size:13.3px}
.plantilla .cuerpo{
  font-size:12.5px;color:var(--fg-soft);line-height:1.6;background:var(--bg-sunken);
  border-radius:8px;padding:10px 12px;white-space:pre-wrap;max-height:130px;overflow:auto
}
.variable{background:var(--brand-soft);color:var(--brand-2);border-radius:4px;padding:0 4px;font-weight:650}

@media(max-width:900px){
  .apart-h{padding:14px 14px 12px;gap:11px}
  .apart-b{padding:14px}
  .apart-ic{width:30px;height:30px;flex-basis:30px;font-size:15px;border-radius:9px}
  .apart-t h2{font-size:14px}
  .pagina-ic{width:32px;height:32px;flex-basis:32px;font-size:16px}
  .pagina-t .crumb{display:none}
  .cifras{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rank{grid-template-columns:minmax(70px,1fr) minmax(0,1.6fr) 44px}
}

/* Vista previa de un documento imprimible dentro del modal */
.doc{background:#fff;color:#111;padding:26px 30px;border-radius:10px;border:1px solid var(--line);
  font-size:13px;line-height:1.65;max-height:62vh;overflow-y:auto}
[data-theme="dark"] .doc{background:#f7f8f9}
.doc h1{font-size:17px;margin:0 0 3px}
.doc h2{font-size:13.5px;margin:19px 0 6px;padding-bottom:4px;border-bottom:1px solid #d8dde3;color:#0b3d36}
.doc p{margin:0 0 8px}
.doc ul,.doc ol{margin:0 0 10px;padding-left:20px}
.doc li{margin-bottom:4px}
.doc .cab{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;
  border-bottom:2px solid var(--brand);padding-bottom:11px;margin-bottom:18px}
.doc .cab .cli b{font-size:14.5px;display:block}
.doc .cab .cli span{font-size:11px;color:#555;display:block}
.doc .datos{width:100%;border-collapse:collapse;margin:11px 0 16px;font-size:12px}
.doc .datos td{padding:5px 8px;border:1px solid #dde2e8}
.doc .datos td:nth-child(odd){background:#f2f5f8;font-weight:600;width:22%}
.doc .firmas{display:flex;gap:34px;margin-top:34px}
.doc .firma{flex:1;border-top:1px solid #444;padding-top:6px;font-size:11px;color:#444}
.doc .pie{margin-top:24px;padding-top:9px;border-top:1px solid #dde2e8;font-size:10.5px;color:#666}
.doc .nota{background:#eef6f4;border-left:3px solid var(--brand);padding:9px 13px;margin:12px 0;font-size:12.5px}

/* Numeración de los apartados de la ficha del paciente */
.apart-n{
  display:inline-grid;place-items:center;width:19px;height:19px;border-radius:6px;
  background:var(--brand);color:#fff;font-size:11px;font-weight:750;margin-right:8px;
  vertical-align:1px
}

/* =========================================================================
   11. Textos legales
   ========================================================================= */
.doc-legal{font-size:13.6px;line-height:1.72;color:var(--fg-soft);max-width:820px}
.doc-legal h2{
  font-size:14.5px;margin:24px 0 9px;padding-bottom:6px;color:var(--fg);
  border-bottom:1px solid var(--line-soft)
}
.doc-legal h2:first-child{margin-top:0}
.doc-legal p{margin:0 0 11px}
.doc-legal ul,.doc-legal ol{margin:0 0 13px;padding-left:21px}
.doc-legal li{margin-bottom:6px}
.doc-legal strong,.doc-legal b{color:var(--fg);font-weight:650}
.doc-legal code{
  background:var(--bg-sunken);padding:1px 6px;border-radius:5px;
  font-family:var(--ff-mono);font-size:12px
}
.tabla-legal{width:100%;border-collapse:collapse;margin:12px 0;font-size:12.8px}
.tabla-legal th,.tabla-legal td{
  border:1px solid var(--line);padding:8px 11px;text-align:left;vertical-align:top
}
.tabla-legal th{background:var(--bg-sunken);font-weight:640;color:var(--fg);width:34%}
.tabla-legal tr:first-child th{width:auto}
.nota-legal{
  background:var(--brand-soft);border-left:3px solid var(--brand);
  border-radius:0 10px 10px 0;padding:12px 16px;margin:0 0 20px;
  font-size:13.4px;color:var(--fg-soft);line-height:1.65
}
.falta-dato{
  background:var(--danger-soft);color:var(--danger);padding:1px 6px;
  border-radius:4px;font-weight:650;font-size:12.5px;cursor:help
}
.pie-legal{margin-top:26px;padding-top:12px;border-top:1px solid var(--line-soft);
  font-size:11.5px;color:var(--fg-mute)}

/* Enlaces legales bajo el formulario de acceso */
.acc-legal{
  display:flex;justify-content:center;flex-wrap:wrap;gap:6px 16px;
  margin-top:16px;padding-top:14px;border-top:1px solid var(--line-soft)
}
.acc-legal a{font-size:11.5px;color:var(--fg-mute);text-decoration:none}
.acc-legal a:hover{color:var(--brand);text-decoration:underline}

/* =========================================================================
   12. Aviso informativo de almacenamiento (no es un muro de consentimiento:
   la aplicación solo usa almacenamiento técnico necesario)
   ========================================================================= */
.aviso-cookies{
  position:fixed;left:14px;right:14px;bottom:14px;z-index:150;
  background:var(--bg-elev);border:1px solid var(--line);border-radius:14px;
  box-shadow:var(--sh-3);padding:15px 17px;max-width:520px;margin:0 auto;
  display:flex;gap:13px;align-items:flex-start;
  animation:subir .28s cubic-bezier(.2,.9,.3,1.1)
}
@keyframes subir{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.aviso-cookies .e{font-size:22px;line-height:1;flex:0 0 auto}
.aviso-cookies .cuerpo{flex:1;min-width:0}
.aviso-cookies b{display:block;font-size:13.5px;margin-bottom:3px}
.aviso-cookies p{font-size:12.5px;color:var(--fg-mute);line-height:1.55;margin:0 0 10px}
.aviso-cookies .btn-row{gap:7px}
@media(max-width:900px){
  .aviso-cookies{bottom:calc(74px + env(safe-area-inset-bottom));left:10px;right:10px;padding:13px 14px}
}

/* Consentimiento del paciente al entrar por primera vez */
.consent-caja{
  background:var(--bg-sunken);border:1px solid var(--line);border-radius:12px;
  padding:14px 16px;margin:14px 0;font-size:13.3px;line-height:1.65;color:var(--fg-soft);
  white-space:pre-line
}

/* =========================================================================
   13. Asistente de la aplicación
   ========================================================================= */
#asistente{position:fixed;right:18px;bottom:18px;z-index:120;display:flex;flex-direction:column;
  align-items:flex-end;gap:10px;pointer-events:none}
#asistente>*{pointer-events:auto}

.as-burbuja{
  display:inline-flex;align-items:center;gap:8px;border:0;cursor:pointer;
  background:var(--brand);color:#fff;border-radius:99px;padding:11px 18px;
  font-size:13.5px;font-weight:620;box-shadow:0 6px 20px rgba(14,143,126,.35);
  transition:.16s
}
.as-burbuja:hover{background:var(--brand-2);transform:translateY(-1px)}
.as-burbuja .e{font-size:17px;line-height:1}
#asistente.abierto .as-burbuja{display:none}

.as-panel{
  width:min(390px,calc(100vw - 28px));height:min(560px,calc(100vh - 110px));
  background:var(--bg-elev);border:1px solid var(--line);border-radius:18px;
  box-shadow:var(--sh-3);display:flex;flex-direction:column;overflow:hidden;
  animation:subir .22s cubic-bezier(.2,.9,.3,1.1)
}
.as-panel[hidden]{display:none}

.as-cab{display:flex;align-items:center;gap:11px;padding:14px 16px;
  background:var(--sidebar);color:#fff;flex:0 0 auto}
.as-ic{width:34px;height:34px;flex:0 0 34px;border-radius:12px;display:grid;place-items:center;
  background:rgba(255,255,255,.12);font-size:17px}
.as-tit{flex:1;min-width:0}
.as-tit b{display:block;font-size:14px;line-height:1.25}
.as-tit span{font-size:11.5px;color:#8fb3c0}
.as-cab .x-btn{color:#8fb3c0;font-size:22px}
.as-cab .x-btn:hover{background:rgba(255,255,255,.12);color:#fff}

.as-hilo{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;
  gap:11px;background:var(--bg-sunken);-webkit-overflow-scrolling:touch}
.as-msg{max-width:92%;padding:11px 14px;border-radius:14px;font-size:13.3px;line-height:1.6}
.as-msg.bot{background:var(--bg-elev);border:1px solid var(--line);align-self:flex-start;
  border-bottom-left-radius:5px;color:var(--fg-soft)}
.as-msg.yo{background:var(--brand);color:#fff;align-self:flex-end;border-bottom-right-radius:5px}
.as-msg p{margin:0 0 8px}
.as-msg p:last-child{margin-bottom:0}
.as-msg b{color:var(--fg);font-weight:650}
.as-msg.yo b{color:#fff}
.as-msg ul,.as-msg ol{margin:0 0 8px;padding-left:19px}
.as-msg li{margin-bottom:4px}
.as-msg code{background:var(--bg-sunken);padding:1px 5px;border-radius:4px;
  font-family:var(--ff-mono);font-size:11.8px}
.as-mini{font-size:11.5px !important;color:var(--fg-mute);text-transform:uppercase;
  letter-spacing:.06em;font-weight:700;margin:11px 0 6px !important}

.as-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:4px}
.as-chip{
  border:1px solid var(--line);background:var(--bg-elev);color:var(--fg-soft);
  border-radius:99px;padding:6px 12px;font-size:12.2px;cursor:pointer;
  text-align:left;line-height:1.35;transition:.13s
}
.as-chip:hover{border-color:var(--brand);color:var(--brand-2);background:var(--brand-soft)}
.as-acc{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.as-area{font-size:13px;margin-top:6px}

.as-envio{display:flex;gap:8px;padding:11px 12px;border-top:1px solid var(--line);
  background:var(--bg-elev);flex:0 0 auto;padding-bottom:calc(11px + env(safe-area-inset-bottom))}
.as-envio .inp{flex:1;font-size:16px}
.as-envio button{flex:0 0 auto;width:46px;font-size:16px}

@media(max-width:900px){
  #asistente{right:12px;bottom:calc(74px + env(safe-area-inset-bottom))}
  body.es-portal #asistente{bottom:calc(70px + env(safe-area-inset-bottom))}
  .as-burbuja .tx{display:none}
  .as-burbuja{width:52px;height:52px;padding:0;border-radius:50%;justify-content:center}
  .as-panel{width:calc(100vw - 20px);height:min(72vh,540px)}
}
@media print{ #asistente{display:none !important} }

/* Puntos suspensivos mientras el asistente piensa */
.as-puntos{display:inline-flex;gap:4px;align-items:center;padding:2px 0}
.as-puntos i{width:6px;height:6px;border-radius:50%;background:var(--fg-mute);
  animation:latir 1.1s infinite ease-in-out}
.as-puntos i:nth-child(2){animation-delay:.16s}
.as-puntos i:nth-child(3){animation-delay:.32s}
@keyframes latir{0%,60%,100%{opacity:.28;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}

/* Acciones de una cita en el portal */
.pt-cita-acc{display:flex;flex-direction:column;gap:6px;align-items:flex-end;flex:0 0 auto}
@media(max-width:420px){
  .pt-cita{flex-wrap:wrap}
  .pt-cita-acc{flex-direction:row;width:100%;justify-content:flex-end;margin-top:8px}
}

/* =========================================================================
   14. Ajustes finos para iPhone y Android

   Corrigen cosas que solo se notan en un móvil real: la barra de Safari que
   aparece y desaparece, el destello gris al tocar, el retardo del toque y la
   selección de texto accidental al mantener pulsado.
   ========================================================================= */
html{
  -webkit-text-size-adjust:100%;    /* iOS no reescala el texto al girar */
  text-size-adjust:100%
}
body{
  -webkit-tap-highlight-color:transparent;
  overscroll-behavior-y:contain      /* sin rebote elástico que descoloca */
}

/* La barra de Safari cambia de alto al desplazarse: 100vh se queda corto y
   la barra inferior queda fuera de pantalla. `dvh` sigue la altura real. */
@supports (height:100dvh){
  .app{height:100dvh}
  .portal{height:100dvh}
  .as-panel{max-height:calc(100dvh - 110px)}
}

/* Sin retardo de 300 ms al tocar, y sin seleccionar texto sin querer */
button,.btn,a,.acceso-t,.as-chip,.cal-c,.tarea,.list-row,.pt-mat,.pt-dias button{
  touch-action:manipulation
}
.nav,.nav-movil,.pt-nav,.topbar,.sidebar,.tabs,.as-cab,.apart-h{
  -webkit-user-select:none;user-select:none
}
/* El contenido sí se puede seleccionar y copiar */
.content,.pt-cuerpo,.as-hilo,.doc-legal,.modal-b{-webkit-user-select:text;user-select:text}

/* En pantalla táctil no hay «hover»: la respuesta al toque la da :active */
@media(hover:none){
  .btn:hover{background:var(--bg-elev);border-color:var(--line)}
  .btn.primary:hover{background:var(--brand);border-color:var(--brand)}
  .btn:active{transform:scale(.97);opacity:.85}
  .acceso-t:active,.as-chip:active,.tarea:active,.list-row:active,.pt-mat:active{
    background:var(--bg-hover);transform:scale(.99)
  }
  .cal-c:hover{background:var(--bg-elev);border-color:var(--line-soft)}
  .cal-c:active{background:var(--brand-soft)}
  .food-row .acts{opacity:1}      /* las acciones no pueden depender del ratón */
}

/* Zonas de toque cómodas: 44 px es la referencia de Apple */
@media(max-width:900px){
  .btn.xs{padding:7px 11px;font-size:12px}
  .nav a{padding:12px 11px}
  .pt-nav a,.nav-movil a,.nav-movil .mas{min-height:52px}
  .tabs button{padding:12px 14px}
  .check{padding:10px 8px}
  .x-btn{padding:8px 12px;font-size:22px}
  .chip-pick label{padding:8px 14px}
  .list-row{min-height:52px}
}

/* iOS abre el teclado y empuja el diseño: el modal debe seguir siendo usable */
@media(max-width:900px){
  .backdrop{align-items:flex-end}
  .modal{max-height:88dvh}
  .modal-b{-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
}

/* Aviso para instalar la aplicación en el móvil */
.instalar-aviso{
  position:fixed;left:12px;right:12px;bottom:calc(74px + env(safe-area-inset-bottom));
  z-index:140;background:var(--bg-elev);border:1px solid var(--line);border-radius:14px;
  box-shadow:var(--sh-3);padding:14px 16px;max-width:480px;margin:0 auto;
  display:flex;gap:12px;align-items:flex-start;animation:subir .28s cubic-bezier(.2,.9,.3,1.1)
}
.instalar-aviso .e{font-size:22px;line-height:1}
.instalar-aviso .cuerpo{flex:1;min-width:0}
.instalar-aviso b{display:block;font-size:13.5px;margin-bottom:2px}
.instalar-aviso p{font-size:12.5px;color:var(--fg-mute);line-height:1.55;margin:0 0 10px}