/* Panel de socios: ancho completo, tipografía legible y navegación adaptable. */
html:has(body[data-view="panel"]) { background:#111210; color-scheme:dark; }
body[data-view="panel"] { background:#111210; color:#f4f4ed; }
body[data-view="panel"] #canvas { width:100%; max-width:none; overflow:visible; container-type:inline-size; transition:none; }
body[data-view="panel"] #canvas.mobile { max-width:390px; }
.evolve {
  --sidebar-width:260px; --space:clamp(24px,3vw,56px); --gap:24px;
  display:grid; grid-template-columns:var(--sidebar-width) minmax(0,1fr);
  min-height:100vh; min-height:100svh; background:linear-gradient(to right,#080907 var(--sidebar-width),#111210 var(--sidebar-width)); color:#f4f4ed;
  font-size:16px; line-height:1.55;
}
.evolve .sidebar {
  position:sticky; top:0; align-self:start; height:100vh; height:100svh;
  min-height:580px; padding:24px 20px; display:flex; flex-direction:column; gap:18px;
  background:#080907; border-right:1px solid #ffffff13; z-index:5;
}
.evolve .sidebar-brand-slot { height:114px; flex:0 0 114px; margin-bottom:12px; }
.evolve .panel-brand {
  position:absolute; left:22px; top:18px; width:280px; display:block;
  line-height:0; background:transparent; filter:drop-shadow(0 5px 12px #0006);
}
.evolve .panel-brand img { display:block; width:100%; height:auto; }
.evolve .sidebar>.eyebrow { color:#a3a797; padding:0 14px; font-size:11px; }
.evolve .side-nav { display:grid; gap:10px; }
.evolve .side-nav button {
  display:flex; align-items:center; gap:16px; width:100%; min-height:60px;
  padding:16px; border:1px solid transparent; border-radius:8px;
  background:transparent; color:#b1b5a7; text-align:left; font-size:18px; line-height:1.4;
}
.evolve .side-nav button:hover { background:#ffffff06; color:#f4f4ed; }
.evolve .side-nav button.active { background:#f39a361b; color:#ffb660; border-color:#f39a3640; }
.evolve .side-nav i { font-style:normal; font-size:24px; width:26px; flex:0 0 26px; text-align:center; }
.evolve .sidebar-foot { margin-top:auto; border-top:1px solid #ffffff20; padding:20px 10px 0; font-size:12px; line-height:1.8; color:#a8ae9a; }
.evolve .sidebar-foot a { text-decoration:underline; text-underline-offset:3px; }
.evolve .workspace { min-width:0; padding:0 var(--space) 40px; }
.evolve .app-top { min-height:104px; display:flex; align-items:center; justify-content:space-between; gap:20px; border-bottom:1px solid #ffffff16; }
.evolve .breadcrumb { margin-left:30px; font-size:15px; color:#afb49f; }
.evolve .mobile-brand { display:none; }
.evolve .user { display:flex; gap:14px; align-items:center; flex-shrink:0; }
.evolve .avatar { width:44px; height:44px; display:grid; place-items:center; flex-shrink:0; border:1px solid #80603a; border-radius:50%; background:#3c3325; color:#ffb863; font-size:14px; }
.evolve .demo-tag { padding:7px 11px; font-size:11px; line-height:1.4; white-space:nowrap; }
.evolve .greeting { display:flex; align-items:center; justify-content:space-between; padding:40px 0 32px; gap:24px; }
.evolve .eyebrow { font-size:12px; letter-spacing:2.2px; }
.evolve .greeting .eyebrow { color:#abb09c; }
.evolve .greeting h1 { font-size:clamp(32px,2.5cqw,46px); font-weight:500; letter-spacing:-1.2px; line-height:1.18; margin:12px 0; }
.evolve .greeting p { color:#aeb59f; font-size:17px; margin:0; }
.evolve .app-grid, .evolve .below { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(290px,1fr); gap:var(--gap); }
.evolve .app-grid>*, .evolve .below>* { min-width:0; }
.evolve .today { position:relative; min-height:420px; padding:clamp(28px,2.4cqw,40px); border-radius:12px; background:#22231d; overflow:hidden; }
.evolve .today::before { content:''; position:absolute; inset:0; background:linear-gradient(90deg,#15170ff0,#11150d88),url("assets/entrenamiento-referencia.822283241441.jpg") center/cover; filter:grayscale(1); }
.evolve .today>* { position:relative; }
.evolve .today .eyebrow { color:#ffb65d; }
.evolve .today h2 { font-family:'Barlow Condensed',Impact,sans-serif; font-size:clamp(56px,4.5cqw,84px); line-height:.98; text-transform:uppercase; margin:34px 0 22px; }
.evolve .today p { font-size:17px; color:#d0d3c5; margin:0 0 10px; }
.evolve .btn { min-height:52px; padding:15px 23px; gap:16px; font-size:16px; line-height:1.4; border-radius:5px; }
.evolve .today .btn { margin-top:18px; }
.evolve .tiny { font-size:13px; line-height:1.6; }
.evolve h3 { font-size:22px; font-weight:500; line-height:1.3; margin:0; }
.evolve .week { display:block; padding:28px; border:1px solid #ffffff22; border-radius:12px; background:#191b16; }
.evolve .week-num { font-size:72px; line-height:1.2; letter-spacing:-2px; margin:26px 0 18px; }
.evolve .week-num span { font-size:24px; letter-spacing:0; color:#a8af97; }
.evolve .week p { color:#afb79f; font-size:16px; }
.evolve .days { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:clamp(4px,.5cqw,10px); margin:24px 0; }
.evolve .days div { text-align:center; font-size:12px; color:#a9b195; }
.evolve .days b { display:grid; place-items:center; width:100%; min-height:36px; aspect-ratio:1.1; border:1px solid #ffffff20; border-radius:6px; font-size:16px; margin-top:10px; }
.evolve .days .done b { background:var(--orange); color:#181b11; border-color:var(--orange); }
.evolve .days .rest b { color:#7b8469; }
.evolve .week small { color:#b4bca5; font-size:14px; }
.evolve .stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--gap); margin:24px 0 32px; }
.evolve .stat { min-width:0; padding:26px; border:1px solid #ffffff20; border-radius:10px; background:#191b16; }
.evolve .stat small { display:block; font-size:12px; color:#b7bea8; letter-spacing:.3px; }
.evolve .stat b { display:block; margin:12px 0; font-size:44px; line-height:1.2; font-weight:500; }
.evolve .stat>span { color:#e6ad67; font-size:14px; }
.evolve .stat-unit { font-size:.65em; }
.evolve .exercise-list { padding:28px; border:1px solid #ffffff20; border-radius:12px; }
.evolve .table-top { display:flex; flex-wrap:wrap; gap:12px; justify-content:space-between; align-items:center; margin-bottom:20px; }
.evolve .table-top small { color:#a8af98; font-size:13px; }
.evolve .exercise { display:grid; grid-template-columns:32px minmax(0,1fr) auto; gap:14px; align-items:center; padding:20px 0; border-top:1px solid #ffffff16; }
.evolve .exercise-n { color:#d4a367; font-size:15px; }
.evolve .exercise b { display:block; font-size:16px; font-weight:500; }
.evolve .exercise small { display:block; font-size:13px; color:#a7b096; margin-top:6px; }
.evolve .exercise>span:last-child { color:#b6bfa5; font-size:14px; white-space:nowrap; }
.evolve .presence { padding:28px; border:1px solid #5b69414d; border-radius:12px; background:#25291d; }
.evolve .status-dot { display:inline-block; width:10px; height:10px; margin-right:8px; border-radius:50%; background:#ffb258; }
.evolve .presence h3 { margin:22px 0 14px; font-size:26px; }
.evolve .presence p { font-size:16px; line-height:1.75; color:#bec6ae; }
.evolve .presence .btn { width:100%; margin-top:15px; color:#f1f3e7; background:transparent; border-color:#7d8868; font-size:14px; }
.evolve .app-note { margin:30px 0 0; color:#aeb79c; font-size:13px; line-height:1.7; }
.evolve :is(a,button):focus-visible, .mobile-app-nav a:focus-visible { outline:3px solid #ffb65d; outline-offset:4px; }
body>.mobile-app-nav { display:none; }
body[data-view="panel"] dialog { background:#191b16; color:#f4f4ed; border:1px solid #ffffff25; width:min(520px,calc(100% - 32px)); max-width:520px; padding:32px; }
body[data-view="panel"] dialog p { font-size:16px; color:#b8bfac; }
body[data-view="panel"] dialog .btn { min-height:48px; font-size:16px; }
body[data-view="panel"] #close-dialog { color:#f4f4ed; min-width:44px; min-height:44px; }
@container (max-width:1200px) {
  .evolve { --sidebar-width:224px; --space:28px; --gap:20px; }
  .evolve .sidebar { padding-inline:14px; }
  .evolve .panel-brand { left:18px; width:250px; }
  .evolve .breadcrumb { margin-left:30px; }
  .evolve .week, .evolve .stat, .evolve .presence, .evolve .exercise-list { padding:24px; }
}
@container (max-width:1100px) {
  .evolve .app-grid, .evolve .below { grid-template-columns:1fr; }
  .evolve .greeting { flex-wrap:wrap; }
  .evolve .today { min-height:390px; }
  .evolve .days b { max-height:52px; aspect-ratio:auto; min-height:44px; }
  .evolve .stat { padding:20px; }
  .evolve .stat b { font-size:36px; }
}
@container (max-width:960px) {
  .evolve { display:block; --space:24px; background:#111210; }
  .evolve .sidebar { display:none; }
  .evolve .workspace { padding-bottom:calc(108px + env(safe-area-inset-bottom,0px)); }
  .evolve .app-top { min-height:96px; gap:16px; }
  .evolve .breadcrumb { display:none; }
  .evolve .mobile-brand { display:block; width:210px; max-width:calc(100% - 180px); height:auto; background:transparent; }
  .evolve .greeting { padding:30px 0; }
  .evolve .greeting h1 { font-size:clamp(28px,4.5cqw,38px); }
  .evolve .today h2 { font-size:clamp(54px,8cqw,72px); }
}
@container (max-width:600px) {
  .evolve { --space:18px; --gap:18px; }
  .evolve .greeting { display:block; }
  .evolve .greeting>.demo-tag { margin-top:18px; }
  .evolve .greeting p { font-size:16px; }
  .evolve .eyebrow { font-size:11px; letter-spacing:1.8px; }
  .evolve .today { padding:26px; min-height:390px; }
  .evolve .today h2 { font-size:clamp(48px,12cqw,64px); margin:30px 0 22px; }
  .evolve .today p { font-size:15px; }
  .evolve .today .btn { width:100%; padding-inline:12px; }
  .evolve .week, .evolve .exercise-list, .evolve .presence { padding:22px; }
  .evolve .week-num { font-size:64px; }
  .evolve .week-num span { font-size:22px; }
  .evolve .stats { grid-template-columns:1fr; gap:12px; }
  .evolve .stat { display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:16px; align-items:center; padding:20px; }
  .evolve .stat small { grid-column:1; }
  .evolve .stat b { grid-column:2; grid-row:1 / span 2; margin:0; font-size:38px; }
  .evolve .stat>span { grid-column:1; font-size:13px; margin-top:5px; }
  .evolve .exercise { grid-template-columns:22px minmax(0,1fr) auto; gap:10px; }
}
@container (max-width:480px) {
  .evolve .mobile-brand { width:185px; max-width:calc(100% - 65px); }
  .evolve .user .demo-tag { display:none; }
}
/* En escritorio, el resumen inicial responde también a la altura disponible.
   Se compacta el espacio y el titular; los controles y textos siguen legibles.
   Sin alturas fijas ni recortes: zoom y contenido adicional pueden crecer. */
@container (min-width:1101px) {
  .evolve .app-top { min-height:clamp(64px,9svh,96px); }
  .evolve .greeting { padding:clamp(12px,2svh,24px) 0 clamp(12px,2svh,20px); }
  .evolve .greeting h1 { font-size:clamp(30px,min(2.5cqw,4.6svh),46px); margin:8px 0; }
  .evolve .today { min-height:clamp(300px,42svh,420px); padding:clamp(20px,3svh,36px); }
  .evolve .today h2 { font-size:clamp(44px,min(4.5cqw,7.3svh),80px); margin:clamp(12px,2.4svh,24px) 0 clamp(12px,2svh,20px); }
  .evolve .today .btn { margin-top:10px; min-height:48px; padding:12px 20px; }
  .evolve .week { padding:clamp(20px,3svh,28px); }
  .evolve .week-num { font-size:clamp(48px,7.5svh,72px); margin:clamp(12px,2svh,20px) 0 12px; }
  .evolve .week p { margin:12px 0; }
  .evolve .days { margin:16px 0; }
  .evolve .days b { aspect-ratio:auto; height:clamp(36px,5.8svh,52px); }
  .evolve .stats { margin:clamp(12px,2svh,24px) 0 24px; }
  .evolve .stat { padding:clamp(16px,2.4svh,24px); }
  .evolve .stat b { font-size:clamp(32px,4.4svh,44px); margin:6px 0; }
}
/* La navegación queda fuera del contenedor de tamaño para fijarse al viewport. */
body>.mobile-app-nav { position:fixed; z-index:20; bottom:0; left:0; width:100%; grid-template-columns:repeat(4,minmax(0,1fr)); gap:4px; padding:8px 8px calc(8px + env(safe-area-inset-bottom,0px)); border-top:1px solid #ffffff25; background:#080907f5; backdrop-filter:blur(16px); color:#b6bea9; }
body>.mobile-app-nav a { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; min-height:54px; border-radius:8px; font-size:14px; line-height:1.3; }
body>.mobile-app-nav .nav-icon { font-size:22px; line-height:1; }
body>.mobile-app-nav a[aria-current] { color:#ffb65f; background:#f39a3614; }
@media(max-width:960px) { body[data-view="panel"]>.mobile-app-nav { display:grid; } }
body[data-view="panel"]:has(#canvas.mobile)>.mobile-app-nav { display:grid; width:min(100%,390px); left:50%; transform:translateX(-50%); }
@media(prefers-reduced-motion:reduce) { body[data-view="panel"] * { scroll-behavior:auto; transition:none; } }