/* NEUROFORGE V2.1 real shell — Background B translated from the preserved prototype.
   This file contains presentation only. Application data and actions remain server-backed. */
:root{
  --sidebar:224px;
  --nf-bg:#070b12;
  --nf-bg-secondary:#0b0e15;
  --nf-surface:#12161f;
  --nf-surface-raised:#161c27;
  --nf-border:#212736;
  --nf-border-soft:#1a1f2c;
  --nf-text:#eef1f7;
  --nf-text-secondary:#a6adbe;
  --nf-muted:#6c7488;
  --nf-blue:#4c8bff;
  --nf-blue-hover:#6aa0ff;
  --nf-violet:#9a7cff;
  --nf-green:#2fd897;
  --nf-amber:#f5a623;
  --nf-red:#ff5c7a;
  --radius:14px;
  --v21-card-shadow:0 1px 0 rgba(255,255,255,.025) inset,0 18px 42px -28px rgba(0,0,0,.9);
}

/* V2.1 correction: real exercise administration and recovered concept screens. */
.v21-create-exercise{width:min(760px,calc(100vw - 32px));max-height:calc(100vh - 32px);overflow:auto}
.v21-create-exercise>form>header,.v21-create-exercise>form>footer{display:flex;align-items:center;justify-content:space-between;gap:16px}
.v21-create-exercise>form>header{margin-bottom:18px}.v21-create-exercise>form>header p{margin:3px 0 0;color:var(--nf-muted)}
.v21-create-exercise>form>footer{margin-top:18px;justify-content:flex-end}.v21-create-exercise .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.v21-create-exercise label{display:grid;gap:6px;color:var(--nf-text-secondary);font-size:12px;font-weight:700}.v21-create-exercise .form-span{grid-column:1/-1}
.concept-banner{display:flex;gap:12px;align-items:center;padding:12px 14px;margin:0 0 16px;border:1px dashed rgba(154,124,255,.5);border-radius:10px;background:rgba(154,124,255,.08)}
.concept-banner strong{color:#c6b8ff;font-size:11px;letter-spacing:.06em}.concept-banner span{color:var(--nf-text-secondary);font-size:12px}
.v21-concept-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-bottom:16px}.v21-concept-kpis.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.v21-concept-kpis article{position:relative;min-height:90px;padding:14px;border:1px dashed var(--nf-border);border-radius:10px;background:var(--nf-bg-secondary);overflow:hidden}
.v21-concept-kpis article:after{display:none}
.v21-concept-kpis small{display:block;max-width:80%;color:var(--nf-muted)}.v21-concept-kpis strong{display:block;margin-top:10px;font-size:22px}
.concept-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.concept-chart{display:grid;place-items:center;min-height:160px;margin-top:12px;border:1px dashed var(--nf-border);border-radius:10px;background:repeating-linear-gradient(135deg,var(--nf-bg-secondary) 0 10px,rgba(18,22,31,.5) 10px 20px);color:var(--nf-muted);font-size:12px;text-align:center}
.concept-list>div{display:flex;justify-content:space-between;padding:11px 0;border-bottom:1px solid var(--nf-border-soft)}.concept-list dd{font-weight:800}.concept-funnel{display:grid;gap:9px;padding:0;list-style:none}.concept-funnel li{display:flex;justify-content:space-between;padding:11px 13px;border:1px solid var(--nf-border-soft);border-radius:8px;background:var(--nf-bg-secondary)}
.brand-concept-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:16px;align-items:start}.upload-concept{display:flex;flex-direction:column;gap:4px;padding:20px;margin-top:12px;border:1px dashed var(--nf-border);border-radius:10px;background:var(--nf-bg-secondary)}.upload-concept span{color:var(--nf-muted);font-size:11px}
.color-concept{display:flex;align-items:center;gap:10px}.color-concept i{width:34px;height:34px;border-radius:9px;border:1px solid var(--nf-border)}.brand-hierarchy-concept{display:grid;gap:8px;padding:0;list-style:none}.brand-hierarchy-concept li{display:flex;gap:10px;align-items:center;padding:10px;border:1px solid var(--nf-border-soft);border-radius:8px;background:var(--nf-bg-secondary)}.brand-hierarchy-concept b{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--nf-surface-raised)}
.login-concept-screen{display:grid;gap:10px;justify-items:center;padding:28px 18px 12px;border:1px solid var(--nf-border);border-radius:12px;background:var(--nf-bg-secondary)}.login-concept-mark{width:44px;height:44px;border-radius:12px;background:linear-gradient(135deg,var(--nf-blue),var(--nf-violet))}.login-concept-screen i{display:block;width:80%;height:34px;border:1px solid var(--nf-border);border-radius:8px;background:var(--nf-surface)}.login-concept-screen button{width:80%}.login-concept-screen small{width:100%;margin-top:18px;padding-top:10px;border-top:1px solid var(--nf-border-soft);text-align:center;color:var(--nf-muted)}
.fenrruco-mark{display:block;width:18px;height:18px}.nf-assistant-fab .fenrruco-mark{width:22px;height:22px}.v21-ai-mark .fenrruco-mark{width:16px;height:16px}
.exercise-create-media{border:1px solid var(--line,#ddd);border-radius:16px;padding:16px}.exercise-create-media legend{font-weight:800;padding:0 6px}.exercise-media-preview{display:grid;gap:10px;margin:12px 0}.exercise-media-item{display:flex;align-items:center;gap:12px;padding:10px;border:1px solid var(--line,#ddd);border-radius:12px}.exercise-media-item img{width:88px;height:64px;object-fit:cover;border-radius:8px}.table-subline{display:block;color:var(--muted,#666)}.v21-mobile-ai,.v21-ai-mark{font-size:10px;font-weight:800}
.v21-section-tabs{display:flex;gap:8px;margin:0 0 18px}.v21-section-tabs a,.supplement-categories a{padding:8px 13px;border:1px solid var(--border,#303642);border-radius:999px;color:var(--text-dim,#aab0bc);text-decoration:none}.v21-section-tabs a[aria-current=page],.supplement-categories a[aria-current=page]{background:var(--signal,#4c8bff);border-color:transparent;color:#fff}.supplement-toolbar{display:grid;gap:14px}.supplement-toolbar form{display:flex;gap:8px}.supplement-toolbar input{flex:1}.supplement-categories{display:flex;gap:7px;overflow:auto;padding-bottom:3px}.supplement-categories a{white-space:nowrap;font-size:12px}.supplement-product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:18px}.supplement-product-card{overflow:hidden;border:1px solid var(--border-soft,#2a303b);border-radius:18px;background:var(--surface,#12161f);box-shadow:0 14px 34px rgba(0,0,0,.14)}.supplement-product-card.is-hidden{opacity:.62}.supplement-product-image{position:relative;aspect-ratio:4/3;background:linear-gradient(145deg,#141a24,#232c3d)}.supplement-product-image>img{width:100%;height:100%;object-fit:cover}.supplement-product-image .status-badge{position:absolute;top:12px;right:12px}.supplement-product-body{display:grid;gap:8px;padding:16px}.supplement-product-body h2{font-size:18px;margin:0}.supplement-product-body p{margin:0}.supplement-category{color:var(--signal,#4c8bff);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.supplement-brand{color:var(--text-dim,#aab0bc);font-size:12px}.supplement-price{font-size:22px}.supplement-product-modal{width:min(720px,calc(100vw - 24px))}.product-image-field{border:1px solid var(--border-soft,#2a303b);border-radius:14px;padding:14px}.product-upload input{display:block;margin-top:8px}.product-image-preview{display:flex;align-items:center;gap:12px;min-height:100px;margin:12px 0;padding:10px;border:1px dashed var(--border,#303642);border-radius:12px}.product-image-preview img{width:120px;height:90px;object-fit:cover;border-radius:9px}.nf-assistant-fab{width:44px!important;height:44px!important;min-width:44px!important;padding:0!important;border-radius:50%!important}.nf-assistant-fab>.fenrruco-placeholder{width:12px;height:12px;border:2px solid currentColor;border-radius:50%;display:block}.v21-mobile-ai{width:34px!important;overflow:hidden;color:transparent!important;position:relative}.v21-mobile-ai:after{content:"";width:10px;height:10px;border:2px solid #9a7cff;border-radius:50%;position:absolute;inset:0;margin:auto}.v21-ai-mark{font-size:0!important}.v21-ai-mark:after{content:"";width:10px;height:10px;border:2px solid currentColor;border-radius:50%;display:block}
@media(max-width:900px){.supplement-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.supplement-product-grid{grid-template-columns:1fr}.supplement-toolbar form{display:grid}.v21-section-tabs{overflow:auto}}
.fenrruco-candidate-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.fenrruco-candidate{position:relative}.candidate-code{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#9a7cff;color:#100d1b;font-weight:900}.fenrruco-candidate img{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top;border-radius:12px;border:1px solid var(--border-soft,#2a303b)}.fenrruco-candidate dl div{margin-top:10px}.fenrruco-candidate dt{font-size:11px;color:var(--text-faint,#777)}.fenrruco-candidate dd{margin:3px 0;overflow-wrap:anywhere;font-size:11px}@media(max-width:900px){.fenrruco-candidate-grid{grid-template-columns:1fr}}
@media(max-width:900px){.v21-concept-kpis,.v21-concept-kpis.four{grid-template-columns:repeat(2,minmax(0,1fr))}.concept-grid,.brand-concept-layout{grid-template-columns:1fr}.v21-create-exercise .form-grid{grid-template-columns:1fr}.v21-create-exercise .form-span{grid-column:auto}}

html{background:var(--nf-bg)}
body.revision-shell{
  min-height:100vh;
  background:var(--nf-bg)!important;
  color:var(--nf-text);
  font-size:14px;
  line-height:1.5;
  letter-spacing:0;
  overflow-x:hidden;
}
.v21-atmosphere{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.v21-bg-glow,.v21-bg-grid,.v21-bg-lines{position:absolute;inset:0;width:100%;height:100%}
.v21-bg-glow{
  background:
    radial-gradient(60vw 46vw at 88% -6%,rgba(76,139,255,.19),transparent 62%),
    radial-gradient(52vw 42vw at -8% 22%,rgba(154,124,255,.17),transparent 58%),
    radial-gradient(36vw 30vw at 40% 96%,rgba(47,216,151,.055),transparent 60%);
}
.v21-bg-grid{
  opacity:.048;
  background-image:linear-gradient(rgba(160,180,220,.5) 1px,transparent 1px),linear-gradient(90deg,rgba(160,180,220,.5) 1px,transparent 1px);
  background-size:42px 42px;
  -webkit-mask-image:radial-gradient(120% 100% at 50% 0,#000 40%,transparent 92%);
  mask-image:radial-gradient(120% 100% at 50% 0,#000 40%,transparent 92%);
}

.revision-sidebar,.revision-main,.mobile-bar,.v21-menu-scrim{position:relative;z-index:2}
.revision-sidebar{
  position:fixed;
  inset:0 auto 0 0;
  width:var(--sidebar);
  padding:18px 12px 14px;
  background:linear-gradient(180deg,rgba(11,15,23,.97),rgba(7,11,18,.96));
  border-right:1px solid var(--nf-border-soft);
  box-shadow:20px 0 70px rgba(0,0,0,.18);
  backdrop-filter:blur(20px);
  display:flex;
  flex-direction:column;
  gap:0;
}
.revision-brand{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:6px;
  padding:4px 7px 11px;
  border-bottom:1px solid var(--nf-border-soft);
}
.revision-brand img{width:166px;filter:drop-shadow(0 0 16px rgba(76,139,255,.14))}
.revision-brand span{color:var(--nf-muted);font-size:9.5px;font-weight:650;letter-spacing:.08em;text-transform:uppercase}
.brand-claim{margin:10px 8px 15px;font-size:11px;line-height:1.5}
.brand-claim .claim-mind{color:#72a3ff}
.brand-claim .claim-muscle{color:#a6adbe}

.revision-nav{display:flex;flex-direction:column;gap:3px;overflow:auto;padding:1px 0 14px;scrollbar-width:thin}
.revision-nav svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none;opacity:.88}
.revision-nav .v21-nav-root,.v21-nav-module>summary{
  min-height:40px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 10px;
  border:1px solid transparent;
  border-radius:8px;
  color:var(--nf-text-secondary);
  background:transparent;
  font-size:13px;
  font-weight:560;
  cursor:pointer;
  list-style:none;
  position:relative;
}
.v21-nav-module>summary::-webkit-details-marker{display:none}
.v21-nav-module>summary:after{content:"";width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);margin-left:auto;opacity:.48;transition:transform .15s ease}
.v21-nav-module[open]>summary:after{transform:rotate(225deg);margin-top:4px}
.revision-nav .v21-nav-root:hover,.v21-nav-module>summary:hover{background:var(--nf-surface-raised);color:var(--nf-text)}
.revision-nav .v21-nav-root[aria-current=page],.v21-nav-module>summary[aria-current=page]{background:var(--nf-surface);border-color:var(--nf-border);color:var(--nf-text)}
.revision-nav .v21-nav-root[aria-current=page]:before,.v21-nav-module>summary[aria-current=page]:before{content:"";position:absolute;left:-12px;top:8px;bottom:8px;width:3px;border-radius:3px;background:linear-gradient(180deg,var(--nf-blue),var(--nf-violet))}
.v21-subnav{display:grid;gap:1px;margin:2px 0 5px;padding-left:27px}
.revision-nav .v21-subnav a,.v21-subnav button,.v21-nav-disabled{
  min-height:31px;
  display:flex;
  align-items:center;
  gap:7px;
  padding:5px 8px;
  border:0;
  border-radius:7px;
  background:transparent;
  color:var(--nf-muted);
  font-size:11.5px;
  line-height:1.25;
  text-align:left;
  box-shadow:none;
  transform:none;
}
.revision-nav .v21-subnav a:hover,.v21-subnav button:hover{background:rgba(76,139,255,.07);color:var(--nf-text-secondary);transform:none;border:0}
.revision-nav .v21-subnav a[aria-current=page]{background:rgba(76,139,255,.11);color:#dbe6ff;box-shadow:none;border:0}
.revision-nav .v21-subnav a[aria-current=page]:before{content:"";width:5px;height:5px;border-radius:50%;background:var(--nf-blue);box-shadow:0 0 12px rgba(76,139,255,.5)}
.v21-subnav small,.v21-nav-disabled small{margin-left:auto;color:#616a7d;font-size:8px;font-weight:750;letter-spacing:.03em;text-transform:uppercase}
.v21-nav-disabled{opacity:.68;cursor:not-allowed}

.profile-card{
  margin-top:auto;
  padding:12px 8px 2px;
  border:1px solid var(--nf-border-soft);
  border-radius:12px;
  background:rgba(11,14,21,.64);
}
.profile-line{gap:9px}.profile-line strong{font-size:12px}.profile-card small{font-size:10px}
.avatar{width:32px;height:32px;background:linear-gradient(145deg,rgba(76,139,255,.22),rgba(154,124,255,.18));border:1px solid rgba(76,139,255,.28);color:#dbe6ff;font-size:11px}
.link-button{font-size:10.5px;color:var(--nf-muted);padding:6px 0 2px;margin-top:4px}

.revision-main{margin-left:var(--sidebar);min-height:100vh;padding:0 0 68px;position:relative;z-index:1}
.v21-topbar{
  min-height:62px;
  position:sticky;
  top:0;
  z-index:22;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:10px clamp(18px,3vw,34px);
  border-bottom:1px solid var(--nf-border-soft);
  background:rgba(9,12,19,.84);
  backdrop-filter:blur(16px);
}
.v21-org-context,.v21-user-context{display:flex;align-items:center;gap:9px}
.v21-org-context strong,.v21-user-context strong{display:block;font-size:12px}
.v21-org-context small,.v21-user-context small{display:block;color:var(--nf-muted);font-size:9.5px;margin-top:1px}
.v21-org-mark{width:27px;height:27px;border-radius:8px;display:grid;place-items:center;background:linear-gradient(135deg,var(--nf-blue),var(--nf-violet));color:#070b12;font-weight:850;font-size:9px;letter-spacing:-.03em}
.v21-topbar-actions{display:flex;align-items:center;gap:9px}
.v21-ai-trigger,.v21-mobile-ai{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-height:34px;
  padding:7px 11px;
  border:1px solid rgba(154,124,255,.33);
  border-radius:999px;
  background:linear-gradient(135deg,rgba(76,139,255,.12),rgba(154,124,255,.13));
  color:#c7b9ff;
  font-size:11.5px;
  font-weight:750;
}
.v21-ai-trigger:hover,.v21-mobile-ai:hover{border-color:rgba(154,124,255,.6);background:linear-gradient(135deg,rgba(76,139,255,.18),rgba(154,124,255,.2))}
.v21-ai-trigger small{font-size:8px;border:1px solid rgba(154,124,255,.32);border-radius:999px;padding:1px 5px}
.v21-user-context{padding:3px 9px 3px 4px;border:1px solid var(--nf-border);border-radius:9px;background:var(--nf-surface)}
.v21-user-context .avatar{width:26px;height:26px}

.content-wrap{width:100%;max-width:1500px;margin:0 auto;padding:22px clamp(18px,3vw,34px)}
.v21-context-tabs{
  display:flex;
  align-items:center;
  gap:2px;
  margin:-22px clamp(-34px,-3vw,-18px) 22px;
  padding:0 clamp(18px,3vw,34px);
  border-bottom:1px solid var(--nf-border-soft);
  background:rgba(11,15,23,.82);
  overflow-x:auto;
  scrollbar-width:thin;
}
.v21-context-tabs a,.v21-context-tabs button,.v21-context-tabs span{flex:none;display:inline-flex;align-items:center;min-height:43px;padding:10px 12px;border:0;border-bottom:2px solid transparent;background:transparent;color:var(--nf-muted);font-size:11.5px;font-weight:650;white-space:nowrap}
.v21-context-tabs a:hover,.v21-context-tabs button:hover{color:var(--nf-text-secondary)}
.v21-context-tabs a[aria-current=page]{color:var(--nf-text);border-bottom-color:var(--nf-blue)}
.v21-context-tabs span{opacity:.6;cursor:not-allowed}

.page-header{align-items:flex-end;margin-bottom:20px}
.page-header h1{font-size:clamp(23px,2.1vw,31px);letter-spacing:-.035em}
.page-header p{font-size:12px;max-width:68ch;color:var(--nf-text-secondary)}
.nf-visual-header{
  min-height:auto;
  padding:0 0 2px;
  border:0;
  border-radius:0;
  background:none;
  box-shadow:none;
}
.nf-visual-header:after{display:none}
.page-isotipo{width:42px;height:42px;margin-right:4px;filter:drop-shadow(0 0 18px rgba(76,139,255,.22))}
.button{min-height:38px;padding:8px 13px;border-radius:8px;font-size:13px;background:linear-gradient(135deg,var(--nf-blue),#6e7cff);color:#070b12;font-weight:780}
.button:hover{background:linear-gradient(135deg,var(--nf-blue-hover),#877fff)}
.button.secondary{background:var(--nf-surface);border-color:var(--nf-border);color:var(--nf-text)}
.button.ghost{background:transparent;border-color:var(--nf-border);color:var(--nf-text-secondary)}
.button.small{min-height:32px;padding:6px 10px;font-size:11px}
.icon-button{border-color:var(--nf-border);background:var(--nf-surface);border-radius:8px}

.section-card,.metric-card,.routine-card,.person-card,.exercise-library-card,.media-card,.block-card,.day-card,.month-cell,.quick-day-card{
  background:linear-gradient(145deg,rgba(18,22,31,.96),rgba(11,14,21,.94));
  border-color:var(--nf-border-soft);
  border-radius:14px;
  box-shadow:var(--v21-card-shadow);
}
.section-card{padding:17px}.section-card+.section-card{margin-top:14px}
.section-heading{margin-bottom:13px}.section-heading h2{font-size:14px;letter-spacing:-.01em}.section-heading h3{font-size:13px}
.metrics-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:11px;margin-bottom:14px}
.metric-card{position:relative;overflow:hidden;padding:14px 15px;transition:transform .15s,border-color .15s}
.metric-card:before{content:"";position:absolute;inset:0 auto 0 0;width:2px;background:linear-gradient(var(--nf-blue),var(--nf-violet))}
.metric-card:hover{transform:translateY(-2px);border-color:rgba(76,139,255,.38)}
.metric-card span{font-size:10.5px;color:var(--nf-text-secondary)}
.metric-card strong{font-size:23px;margin-top:6px;letter-spacing:-.035em;font-variant-numeric:tabular-nums}
.dashboard-grid{grid-template-columns:minmax(0,1.35fr) minmax(300px,.8fr);gap:14px}
.list-item{padding:11px;border-radius:9px;background:var(--nf-bg-secondary)}
.quick-grid{gap:9px}.quick-grid a{min-height:72px;padding:13px;border-radius:10px;background:var(--nf-bg-secondary);border-color:var(--nf-border-soft)}
.quick-grid a strong{font-size:12px}.quick-grid a span{font-size:10.5px}
.data-table th{font-size:10px;text-transform:uppercase;letter-spacing:.05em;color:var(--nf-muted);padding:9px 10px}
.data-table td{padding:11px 10px;font-size:12px}
.routine-grid{gap:11px}.routine-card{padding:15px}.routine-card h3{font-size:15px}
input,select,textarea{min-height:40px;border-color:var(--nf-border);border-radius:8px;background:var(--nf-bg-secondary);font-size:13px;padding:8px 10px}
.form-field{gap:5px}.form-field label{font-size:11px}.help{font-size:10.5px}
.modal{background:#111620;border-color:var(--nf-border);border-radius:14px}
.designer-layout{grid-template-columns:210px minmax(0,1fr);gap:13px}.day-tab{min-height:43px}.block-card{padding:14px}.exercise-row{background:var(--nf-bg-secondary);border-color:var(--nf-border-soft);padding:10px}
.designer-bottom{background:rgba(18,22,31,.9);border-color:var(--nf-border);backdrop-filter:blur(14px)}
.effective-org-banner{border-radius:10px;margin-bottom:16px}

.nf-assistant-fab{width:48px;height:48px;right:22px;bottom:22px;border-radius:14px;background:linear-gradient(135deg,var(--nf-blue),var(--nf-violet));border:0;color:#070b12;font-size:18px;box-shadow:0 16px 38px rgba(76,139,255,.28)}
.nf-assistant-panel{right:20px;bottom:80px;width:min(410px,calc(100vw - 28px));max-height:min(680px,calc(100vh - 110px));border:1px solid var(--nf-border);border-radius:16px;background:#0b0f17;box-shadow:0 28px 80px rgba(0,0,0,.55)}
.nf-assistant-panel header{display:flex;align-items:center;gap:10px;padding:14px 15px;border-bottom:1px solid var(--nf-border-soft)}
.nf-assistant-panel header>span:nth-child(2){display:grid;gap:1px}.nf-assistant-panel header strong{font-size:12px}.nf-assistant-panel header strong small{font-size:8px;color:var(--nf-violet);border:1px solid rgba(154,124,255,.35);border-radius:999px;padding:1px 5px}.nf-assistant-panel header em{font-size:9.5px;color:var(--nf-muted);font-style:normal}.nf-assistant-panel header .icon-button{margin-left:auto;width:30px;height:30px}
.v21-ai-mark{width:29px;height:29px;display:grid;place-items:center;border-radius:9px;background:linear-gradient(135deg,var(--nf-blue),var(--nf-violet));color:#070b12;font-weight:900}
.nf-assistant-messages{padding:15px;background:#080b12}.nf-assistant-msg{font-size:12px;border-radius:11px}.nf-assistant-panel form{padding:12px;border-top:1px solid var(--nf-border-soft)}.nf-assistant-panel footer{padding:0 13px 12px;color:var(--nf-muted);font-size:9px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.v21-menu-scrim{display:none}.mobile-bar{display:none}.v21-mobile-ai{width:40px;height:40px;min-height:40px;padding:0}

@media(max-width:1240px){
  .metrics-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .dashboard-grid{grid-template-columns:1fr}
}
@media(max-width:1020px){
  .revision-sidebar{z-index:45;transform:translateX(-105%);transition:transform .18s ease;box-shadow:24px 0 70px rgba(0,0,0,.45)}
  .revision-sidebar.open{transform:none}
  .revision-main{margin-left:0;padding-top:60px}
  .mobile-bar{position:fixed;display:flex;inset:0 0 auto;min-height:60px;align-items:center;justify-content:space-between;padding:8px 13px;background:rgba(9,12,19,.94);border-bottom:1px solid var(--nf-border-soft);backdrop-filter:blur(16px);z-index:40}
  .mobile-bar img{width:148px}
  .mobile-bar .icon-button{width:40px;height:40px}
  .v21-menu-scrim{display:block;position:fixed;inset:0;z-index:44;border:0;background:rgba(3,5,9,.68);opacity:0;pointer-events:none;transition:opacity .18s ease}
  .v21-menu-scrim.open{opacity:1;pointer-events:auto}
  .v21-topbar{top:0;min-height:54px;padding:8px 14px}
  .content-wrap{padding:18px 14px}
  .v21-context-tabs{margin:-18px -14px 18px;padding:0 14px}
}
@media(max-width:720px){
  .v21-bg-grid{opacity:.03}.v21-bg-lines{display:none}
  .v21-user-context{display:none}
  .v21-topbar{min-height:52px}.v21-org-context small{display:none}
  .v21-ai-trigger{padding:7px 9px}.v21-ai-trigger small{display:none}
  .page-header{display:grid;gap:14px}.page-header h1{font-size:23px}.header-actions{width:100%}.header-actions .button{flex:1}
  .metrics-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .field-grid{grid-template-columns:1fr}
  .section-card{padding:14px}
  .data-table tr{background:linear-gradient(145deg,rgba(18,22,31,.96),rgba(11,14,21,.94));border-color:var(--nf-border-soft)}
  .designer-layout{grid-template-columns:1fr}
  .nf-assistant-panel{right:7px;bottom:70px;width:calc(100vw - 14px);max-height:calc(100vh - 84px)}
  .nf-assistant-fab{right:13px;bottom:13px}
}
@media(max-width:390px){
  .content-wrap{padding-left:10px;padding-right:10px}
  .v21-context-tabs{margin-left:-10px;margin-right:-10px;padding-left:10px;padding-right:10px}
  .metrics-grid{grid-template-columns:1fr 1fr;gap:8px}.metric-card{padding:12px}.metric-card strong{font-size:20px}
  .v21-org-context strong{max-width:145px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .mobile-bar{padding-left:9px;padding-right:9px}
}
@media(prefers-reduced-motion:reduce){.revision-sidebar,.v21-menu-scrim,.metric-card{transition:none!important}.v21-bg-lines{display:none}}

/* V2.1 productization: finance, retention, sales, branding and settings. */
.v21-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:0 0 18px}.v21-kpi-grid>article{min-width:0;padding:18px;border:1px solid var(--nf-border-soft);border-radius:15px;background:linear-gradient(145deg,rgba(13,18,29,.96),rgba(10,14,23,.88));box-shadow:0 14px 32px rgba(0,0,0,.12)}.v21-kpi-grid small,.v21-kpi-grid span{display:block;color:var(--nf-text-secondary)}.v21-kpi-grid strong{display:block;margin:7px 0 3px;font-size:clamp(22px,2.2vw,31px);line-height:1.15;overflow-wrap:anywhere}.v21-kpi-grid.secondary{margin-top:18px}.v21-kpi-grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}.productization-grid{display:grid;gap:16px;margin:18px 0}.productization-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.productization-grid.sales-layout{grid-template-columns:minmax(0,1.4fr) minmax(260px,.6fr)}.metric-list{display:grid;gap:9px}.metric-list>div{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:11px 12px;border:1px solid var(--nf-border-soft);border-radius:10px;background:rgba(8,11,18,.5)}.metric-list span{color:var(--nf-text-secondary)}.revenue-bars{display:grid;gap:11px}.revenue-bars>div{display:grid;grid-template-columns:74px minmax(30px,1fr) minmax(120px,auto);align-items:center;gap:12px}.revenue-bars i{height:9px;border-radius:999px;background:linear-gradient(90deg,var(--nf-blue),var(--nf-violet));opacity:.8}.revenue-bars strong{text-align:right}.sales-funnel{list-style:none;padding:0;margin:0;display:grid;gap:10px}.sales-funnel li{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-radius:10px;background:linear-gradient(90deg,rgba(76,139,255,.13),rgba(154,124,255,.04));border-left:3px solid var(--nf-blue)}.productization-modal{width:min(760px,calc(100vw - 24px));max-height:calc(100vh - 32px);overflow:auto}.productization-modal>form>header,.productization-modal>form>footer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px}.productization-modal>form>.form-grid,.productization-modal>form>p{margin:0 18px 18px}.big-number{display:block;font-size:42px;line-height:1}.integration-overview{grid-template-columns:1fr 260px}.brand-editor{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(340px,.9fr);gap:20px;align-items:start}.brand-live-preview{position:sticky;top:20px}.color-input{display:flex;align-items:center;gap:12px;margin-top:7px}.color-input input{width:64px;height:44px;padding:3px}.brand-preview-screen{position:relative;min-height:520px;border:1px solid var(--nf-border);border-radius:18px;overflow:hidden;background:linear-gradient(145deg,#070b12,#121928)}.brand-preview-cover{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.32}.brand-preview-cover:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,color-mix(in srgb,var(--preview-primary),transparent 65%),color-mix(in srgb,var(--preview-secondary),transparent 55%))}.brand-preview-card{position:relative;z-index:1;width:min(340px,calc(100% - 32px));margin:70px auto;padding:26px;border:1px solid rgba(255,255,255,.13);border-radius:18px;background:rgba(8,12,20,.9);backdrop-filter:blur(18px);display:grid;gap:13px}.brand-preview-card>img{max-width:190px;max-height:68px;object-fit:contain}.brand-preview-card>strong{font-size:22px}.brand-preview-card button{min-height:44px;border:0;border-radius:9px;background:var(--preview-primary);color:white;font-weight:800}.brand-preview-card small{text-align:center;color:var(--nf-muted)}.brand-hierarchy,.safe-action-flow{list-style:none;padding:0;margin:0;display:grid;gap:10px}.brand-hierarchy li,.safe-action-flow li{display:flex;align-items:center;gap:12px;padding:11px;border:1px solid var(--nf-border-soft);border-radius:11px}.brand-hierarchy b,.safe-action-flow b{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:rgba(76,139,255,.15);color:var(--nf-blue)}.feature-list{display:grid;gap:9px;padding-left:22px}.proposal-card{display:flex;justify-content:space-between;gap:18px;padding:16px;border:1px solid var(--nf-border-soft);border-radius:13px;background:rgba(8,11,18,.62)}.proposal-card h3{margin:10px 0 3px}.proposal-card pre{max-width:100%;overflow:auto;white-space:pre-wrap;padding:12px;border-radius:10px;background:#06090f;color:var(--nf-text-secondary)}.narrow-card{max-width:860px}.responsive-data td small{display:block}.status-paid:before,.status-healthy:before,.status-won:before,.status-confirmed:before{background:var(--nf-green)}.status-pending:before,.status-unchecked:before,.status-contacted:before,.status-trial_scheduled:before{background:var(--nf-amber)}.status-overdue:before,.status-error:before,.status-lost:before,.status-failed:before{background:var(--nf-red)}
@media(max-width:1050px){.v21-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.brand-editor{grid-template-columns:1fr}.brand-live-preview{position:static}.productization-grid.sales-layout{grid-template-columns:1fr}}
@media(max-width:760px){.v21-kpi-grid,.v21-kpi-grid.four,.productization-grid.two,.integration-overview{grid-template-columns:1fr}.revenue-bars>div{grid-template-columns:58px minmax(20px,1fr);gap:8px}.revenue-bars strong{grid-column:2}.proposal-card{display:grid}.responsive-data thead{display:none}.responsive-data,.responsive-data tbody,.responsive-data tr,.responsive-data td{display:block;width:100%}.responsive-data tr{padding:10px 0;border-bottom:1px solid var(--nf-border)}.responsive-data td{display:grid;grid-template-columns:minmax(105px,.42fr) minmax(0,1fr);gap:10px;border:0;padding:8px 10px;overflow-wrap:anywhere}.responsive-data td:before{content:attr(data-label);color:var(--nf-muted);font-size:12px;font-weight:700}.responsive-data td:last-child{display:flex;justify-content:flex-end}.brand-preview-screen{min-height:440px}.brand-preview-card{margin:36px auto}.productization-modal{width:calc(100vw - 12px);max-height:calc(100vh - 12px)}.productization-modal .form-grid{grid-template-columns:1fr}}

/* Scoped exercise catalog ownership. */
.exercise-scope-badge{margin-top:9px}.exercise-customization-card{border-color:color-mix(in srgb,var(--nf-blue),var(--nf-border) 62%)}.global-catalog-warning{padding:13px;border:1px solid color-mix(in srgb,var(--nf-amber),transparent 55%);border-radius:12px;background:color-mix(in srgb,var(--nf-amber),transparent 92%)}.global-catalog-warning label{display:flex;align-items:center;gap:8px;margin:7px 0}.global-catalog-warning input{width:auto}.scoped-restore-grid{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:18px;padding-top:16px;border-top:1px solid var(--nf-border-soft)}.scoped-restore-grid h3{flex-basis:100%;margin:0 0 4px}.exercise-media-item [data-scoped-media-delete],.exercise-media-item [data-scoped-media-primary]{margin-left:auto}@media(max-width:720px){.scoped-restore-grid form,.scoped-restore-grid button{width:100%}.exercise-customization-card .form-grid{grid-template-columns:1fr}.exercise-media-item{align-items:flex-start;flex-wrap:wrap}}

/* Barra de acciones fija (Quick/Designer) vs. burbuja de Fenrruco.
   La burbuja es position:fixed con z-index 60 y la barra no tenia
   z-index propio, asi que la burbuja se pintaba ENCIMA del boton
   "Guardar rutina" y le tapaba la ultima letra. Cuando hay una barra
   de acciones fija, la burbuja sube por encima de ella en vez de
   competir por el mismo lugar. */
body:has(.designer-bottom) .nf-assistant-fab { bottom: 84px; }
@media (max-width: 760px) {
  body:has(.designer-bottom) .nf-assistant-fab { bottom: 78px; }
}

/* .data-table-wrap: 12 plantillas ya envolvian sus tablas con esta clase
   pero NINGUN CSS la definia, asi que no hacia nada. Las tablas anchas
   (Alumnos, Membresias, Pagos, Ventas...) desbordaban el ancho de la
   pagina al achicar la ventana en vez de scrollear dentro de su propio
   contenedor. El scroll horizontal ahora queda contenido en la tabla y
   nunca en el body. */
.data-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.data-table-wrap > .data-table { min-width: 900px; }
@media (max-width: 760px) {
  /* Abajo de 760px .data-table ya se reapila como tarjetas (ver
     revision-ui.css), asi que ahi no hace falta ancho minimo ni scroll. */
  .data-table-wrap { overflow-x: visible; }
  .data-table-wrap > .data-table { min-width: 0; }
}
/* Cuatro pantallas (Alumnos, Detalle de alumno, Vinculos, Vinculos de
   nutricion) ponen la tabla directamente dentro de .section-card, sin el
   .data-table-wrap que usan las otras doce. Se cubren los dos patrones
   para que ninguna tabla ancha empuje el ancho de la pagina. */
.section-card:has(> .data-table) { overflow-x: auto; }
.section-card > .data-table { min-width: 900px; }
@media (max-width: 760px) {
  .section-card:has(> .data-table) { overflow-x: visible; }
  .section-card > .data-table { min-width: 0; }
}

/* .detail-grid: el <dl> de "Informacion general" del detalle de alumno la
   usaba pero NINGUN CSS la definia, asi que caia al estilo por defecto del
   navegador -- etiqueta y valor en renglones distintos con la sangria de
   <dd>, desalineado respecto del resto de la app. Se define igual que
   .exercise-facts, que tiene la misma estructura div>dt+dd y si estaba
   resuelta. */
.detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 20px; margin: 0; }
.detail-grid dt { color: var(--nf-muted); font-size: 12px; }
.detail-grid dd { margin: 3px 0 0; font-weight: 700; }
@media (max-width: 640px) { .detail-grid { grid-template-columns: 1fr; } }

/* Las acciones destructivas (Inactivar / Eliminar) quedaban en la misma
   fila y con el mismo peso que las de navegacion (Mediciones, Progreso).
   Se las empuja al final con un separador para que no se toquen por error. */
.inline-actions .button.danger { margin-left: auto; }

/* En el Designer, el nombre del ejercicio y su metadata salian pegados:
   "Press de banca con barrapecho - barra". El markup es
   <strong>nombre</strong><small>meta</small> sin separador y ambos
   quedaban display:inline. Se apilan como ya hace .person-cell en el
   resto de la app. */
.exercise-row strong, .exercise-row small { display: block; }
.exercise-row small { color: var(--nf-muted); margin-top: 2px; }

/* ---------------------------------------------------------------------
   Clases usadas por las plantillas que no tenian NINGUNA regla en ningun
   stylesheet. Se encontraron cruzando todas las class= de web/templates
   contra los cuatro CSS. Sin estas reglas cada una caia al default del
   navegador, que es lo que hacia ver esas pantallas "sin terminar".
   --------------------------------------------------------------------- */

/* Progreso ponia sus dos tarjetas ("Ultimas marcas" y "Evolucion de
   mediciones") en un .two-column que era display:block, asi que se
   apilaban a ancho completo en vez de ir lado a lado. */
.two-column { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
@media (max-width: 1050px) { .two-column { grid-template-columns: 1fr; } }

/* Filas de "Ultimas marcas": el nombre del ejercicio y su detalle salian
   pegados ("peso muerto smith87.5 kg") porque strong y small quedaban
   ambos inline. Mismo patron que .person-cell en el resto de la app. */
.activity-row { padding: 11px 0; border-bottom: 1px solid var(--nf-border-soft); }
.activity-row:last-child { border-bottom: 0; }
.activity-row strong, .activity-row small { display: block; }
.activity-row small { color: var(--nf-text-secondary); margin-top: 3px; }

/* Enlace de volver del detalle de sesion: quedaba como texto plano sin
   ninguna senal de que era navegable. */
.back-link { display: inline-flex; align-items: center; gap: 6px; color: var(--nf-text-secondary); font-size: 13px; margin-bottom: 10px; }
.back-link:hover { color: var(--nf-text); }

/* Texto de ayuda de formulario: existia .help con estilo propio y
   .field-help sin ninguno, segun la pantalla. Se igualan. */
.field-help { font-size: 13px; color: var(--nf-muted); }

/* <details> de informacion tecnica en el detalle de ejercicio. */
.technical-info { margin-top: 14px; border-top: 1px solid var(--nf-border-soft); padding-top: 12px; }
.technical-info > summary { cursor: pointer; color: var(--nf-text-secondary); font-size: 13px; }
.technical-info > summary:hover { color: var(--nf-text); }

/* Grilla de tarjetas del detalle de sesion y del calendario. */
.card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
.exercise-card { border: 1px solid var(--nf-border-soft); border-radius: 12px; background: var(--nf-surface); padding: 15px; display: grid; gap: 8px; }
.exercise-card strong, .exercise-card small { display: block; }
.exercise-card small { color: var(--nf-muted); }

/* ---------------------------------------------------------------------
   MEDIA WELL DE GIFS
   Los 1324 GIFs del catalogo son dibujos de linea con fondo BLANCO solido.
   Puestos con object-fit:contain sobre un marco casi negro (el
   background:#05070c anterior) se veian como recortes blancos pegados
   encima de una card oscura, como si fueran un asset mal integrado.
   No se toca ni un GIF: se construye un "well" claro y deliberado, con
   su propio borde y radio, para que el rectangulo claro se lea como
   parte del diseno -- el mismo recurso de una lamina o un lightbox.
   --------------------------------------------------------------------- */
:root { --nf-media-well: #eef1f5; --nf-media-well-edge: rgba(255,255,255,.10); }

.gif-frame:not(.expanded), .media-card:has(> img) {
  background: var(--nf-media-well);
  border: 1px solid var(--nf-media-well-edge);
  border-radius: 10px;
  padding: 8px;
  overflow: hidden;
}
.gif-frame:not(.expanded) > img, .media-card > img {
  height: 100%;
  background: transparent;
  border-radius: 6px;
  mix-blend-mode: normal;
}
/* La miniatura del constructor y del designer usa el mismo well, a escala. */
.exercise-thumb, .quick-row-thumb, .exercise-picker-item > img {
  background: var(--nf-media-well);
  border: 1px solid var(--nf-media-well-edge);
  border-radius: 8px;
  padding: 4px;
  object-fit: contain;
}