/* ============================================================
   DTR · Módulo INTRAENTRENO v3
   - Lista de estrategias (máx 10) con nombre personalizado
   - Sin sistema de favoritos
============================================================ */

/* ────────────────────────────────────────────
   DASHBOARD HERO + LISTA DE ESTRATEGIAS
──────────────────────────────────────────── */
.intra-hero {
  background:linear-gradient(135deg, #16304F, #0A1A2F);
  border-radius:18px; padding:24px 22px;
  color:#fff; margin-bottom:16px;
  border:1px solid rgba(255,255,255,.08);
  position:relative; overflow:hidden;
}
.intra-hero-h {
  font-size:11px; font-weight:600; letter-spacing:1.2px;
  text-transform:uppercase;
  color:rgba(255,255,255,.5);
  margin-bottom:10px;
  display:flex; align-items:center; gap:10px;
}
.intra-hero-title {
  font-size:22px; font-weight:700; color:#fff;
  letter-spacing:-.4px;
  line-height:1.2;
}
.intra-hero-meta {
  margin-top:12px; display:flex; flex-wrap:wrap; gap:8px;
}
.intra-meta-chip {
  font-size:11.5px; font-weight:600;
  padding:5px 11px; border-radius:99px;
  background:rgba(255,255,255,.08);
  color:rgba(255,255,255,.85);
}

.intra-empty {
  background:#fff; border:1.5px dashed var(--line);
  border-radius:18px; padding:36px 22px;
  text-align:center; margin-bottom:16px;
}
.intra-empty-ic { font-size:42px; margin-bottom:10px; }
.intra-empty-h { font-size:16px; font-weight:700; color:var(--navy); }
.intra-empty-d { font-size:13px; color:var(--text-2); margin-top:5px; max-width:340px; margin-left:auto; margin-right:auto; }

.intra-cta-btn {
  display:inline-flex; align-items:center; gap:8px;
  padding:13px 22px; font-size:14px; font-weight:600;
  background:var(--blue); color:#fff; border:none;
  border-radius:11px; cursor:pointer;
  box-shadow:0 6px 20px rgba(47,125,209,.32);
  transition:all .18s var(--ease);
  font-family:inherit;
}
.intra-cta-btn:hover { background:var(--blue-2); transform:translateY(-1px); }
.intra-cta-btn:active { transform:translateY(0); }

.intra-cta-btn.ghost {
  background:rgba(255,255,255,.08); color:#fff;
  box-shadow:none;
}
.intra-cta-btn.ghost:hover { background:rgba(255,255,255,.14); }

.intra-hero-metrics {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:10px; margin-top:18px;
}
.intra-hero-metric {
  background:rgba(255,255,255,.06);
  border-radius:12px; padding:12px 14px;
  text-align:center;
}
.intra-hero-metric-k {
  font-size:10.5px; font-weight:600;
  color:rgba(255,255,255,.5); text-transform:uppercase;
  letter-spacing:.5px;
}
.intra-hero-metric-v {
  font-size:16px; font-weight:700; color:#fff;
  margin-top:4px;
}

.intra-hero-actions {
  margin-top:18px; display:flex; gap:10px; flex-wrap:wrap;
}

/* ────────────────────────────────────────────
   LISTA DE ESTRATEGIAS
──────────────────────────────────────────── */
.strategy-list-card {
  background:#fff; border:1px solid var(--line);
  border-radius:18px; padding:18px;
  margin-bottom:16px;
}
.strategy-list-h {
  font-size:11px; font-weight:700; letter-spacing:.8px;
  color:var(--blue); text-transform:uppercase;
  margin-bottom:12px;
  display:flex; align-items:center; justify-content:space-between;
}
.strategy-list-count {
  font-size:11px; color:var(--text-2); font-weight:500;
  letter-spacing:0; text-transform:none;
}
.strategy-list {
  display:flex; flex-direction:column; gap:8px;
}
.strategy-item {
  display:flex; align-items:center; gap:12px;
  padding:12px 14px;
  background:#FBFCFD;
  border:1px solid var(--line);
  border-radius:12px;
  cursor:pointer;
  transition:all .15s var(--ease);
}
.strategy-item:hover {
  background:#fff;
  border-color:var(--blue-2);
  transform:translateY(-1px);
  box-shadow:0 6px 16px rgba(10,26,47,.05);
}
.strategy-item-ic {
  width:38px; height:38px; border-radius:10px;
  background:var(--blue-soft);
  color:var(--blue);
  display:flex; align-items:center; justify-content:center;
  font-size:18px;
  flex-shrink:0;
}
.strategy-item-info { flex:1; min-width:0; }
.strategy-item-name {
  font-size:14.5px; font-weight:600; color:var(--text);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.strategy-item-meta {
  font-size:12px; color:var(--text-2);
  margin-top:2px;
}
.strategy-item-action {
  flex-shrink:0;
  color:var(--text-2);
  font-size:18px;
}
.strategy-item-del {
  flex-shrink:0;
  width:32px; height:32px;
  background:transparent; border:none;
  color:#9AA7B5; cursor:pointer;
  font-size:14px;
  border-radius:8px;
  transition:all .15s;
}
.strategy-item-del:hover { background:#FDECEC; color:var(--bad); }

/* ────────────────────────────────────────────
   TASA DE SUDORACIÓN
──────────────────────────────────────────── */
.sweat-hero {
  background:linear-gradient(135deg, #1A3654, #0F2238);
  border-radius:18px; padding:24px 22px;
  color:#fff; margin-bottom:16px;
  border:1px solid rgba(255,255,255,.08);
}
.sweat-hero-h {
  font-size:11px; font-weight:600; letter-spacing:1.2px;
  text-transform:uppercase;
  color:rgba(255,255,255,.5);
  margin-bottom:10px;
}
.sweat-hero-val {
  font-size:42px; font-weight:700; letter-spacing:-1.5px;
  line-height:1;
}
.sweat-hero-unit {
  font-size:14px; font-weight:500;
  color:rgba(255,255,255,.55);
  margin-left:4px;
}
.sweat-hero-meta {
  margin-top:14px; display:flex; flex-wrap:wrap; gap:8px;
}
.sweat-meta-chip {
  font-size:11.5px; font-weight:600;
  padding:5px 11px; border-radius:99px;
  background:rgba(255,255,255,.08);
  color:rgba(255,255,255,.85);
}
.sweat-meta-chip.trend-up   { background:rgba(216,68,60,.2); color:#FFB8B4; }
.sweat-meta-chip.trend-down { background:rgba(30,158,90,.2); color:#9FE5BC; }
.sweat-meta-chip.trend-flat { background:rgba(255,255,255,.1); color:#fff; }

.sweat-empty {
  background:#fff; border:1.5px dashed var(--line);
  border-radius:18px; padding:36px 22px;
  text-align:center; margin-bottom:16px;
}
.sweat-empty-ic { font-size:42px; margin-bottom:10px; }
.sweat-empty-h { font-size:16px; font-weight:700; color:var(--navy); }
.sweat-empty-d { font-size:13px; color:var(--text-2); margin-top:5px; max-width:340px; margin-left:auto; margin-right:auto; }

.sweat-recos {
  display:grid; grid-template-columns:1fr 1fr;
  gap:10px; margin-top:14px;
}
.sweat-reco {
  background:rgba(255,255,255,.06);
  border-radius:12px; padding:13px 14px;
}
.sweat-reco-k {
  font-size:10.5px; font-weight:600;
  color:rgba(255,255,255,.5); text-transform:uppercase;
  letter-spacing:.5px;
}
.sweat-reco-v {
  font-size:15px; font-weight:700; color:#fff;
  margin-top:3px;
}

/* ────────────────────────────────────────────
   WIZARD
──────────────────────────────────────────── */
.intra-wizard-bg {
  position:fixed; inset:0;
  background:radial-gradient(120% 100% at 50% 0%, #16304F 0%, #0A1A2F 70%);
  z-index:250; display:none;
  flex-direction:column;
  animation:fade .3s var(--ease);
}
.intra-wizard-bg.open { display:flex; }

.intra-wizard-top {
  padding:18px 24px;
  display:flex; align-items:center; gap:14px;
  border-bottom:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  flex-shrink:0;
}
.intra-wizard-name {
  font-size:13px; font-weight:700; letter-spacing:.5px; color:#fff;
}
.intra-wizard-exit {
  margin-left:auto; font-size:13px;
  color:rgba(255,255,255,.5); cursor:pointer;
}
.intra-wizard-exit:hover { color:#fff; }

.intra-wizard-progress {
  height:3px; background:rgba(255,255,255,.1);
  flex-shrink:0;
}
.intra-wizard-progress-fill {
  height:100%;
  background:linear-gradient(90deg, var(--blue), var(--blue-2));
  width:0%; transition:width .5s var(--ease);
}

.intra-wizard-stage {
  flex:1;
  display:flex;
  justify-content:center;
  padding:32px 24px 60px;
  overflow-y:auto;
  align-items:flex-start;
}
.intra-wizard-card {
  width:100%; max-width:620px;
  animation:fade .35s var(--ease);
}
.intra-wizard-card.wide { max-width:740px; }
.intra-wizard-step {
  font-size:12px; font-weight:600;
  color:var(--blue-2); letter-spacing:.5px; margin-bottom:10px;
}
.intra-wizard-title {
  font-size:22px; font-weight:700; letter-spacing:-.4px;
  line-height:1.3; color:#fff;
}
.intra-wizard-help {
  font-size:14px; color:rgba(255,255,255,.55); margin-top:8px;
}
.intra-wizard-body { margin-top:24px; }

.intra-input-grid {
  display:grid; gap:14px;
  grid-template-columns:1fr 1fr;
}
.intra-input-grid.single { grid-template-columns:1fr; }

.intra-input-wrap label {
  display:block; font-size:11px;
  font-weight:600; color:rgba(255,255,255,.6);
  margin-bottom:6px; text-transform:uppercase; letter-spacing:.5px;
}
.intra-input {
  width:100%; padding:13px 15px; font-size:15px;
  background:#fff; border:1.5px solid transparent;
  border-radius:12px; color:var(--text);
  font-family:inherit; outline:none;
}
.intra-input:focus { border-color:var(--blue-2); }

.intra-chip-row {
  display:flex; flex-wrap:wrap; gap:8px;
}
.intra-chip {
  padding:11px 16px;
  border:1.5px solid rgba(255,255,255,.18);
  border-radius:99px;
  background:rgba(255,255,255,.04);
  cursor:pointer; font-size:13.5px;
  color:rgba(255,255,255,.7);
  font-family:inherit;
  transition:all .15s var(--ease);
}
.intra-chip:hover { border-color:rgba(255,255,255,.4); color:#fff; }
.intra-chip.sel {
  background:#fff; color:var(--navy);
  border-color:#fff; font-weight:600;
}

.intra-duration {
  display:flex; align-items:center; gap:10px;
  margin-top:6px;
}
.intra-duration input {
  width:80px; padding:13px 12px;
  background:#fff; border:1.5px solid transparent;
  border-radius:12px;
  font-family:inherit; font-size:15px; text-align:center;
  outline:none; color:var(--text);
}
.intra-duration input:focus { border-color:var(--blue-2); }
.intra-duration-lbl {
  font-size:12px; color:rgba(255,255,255,.6);
  font-weight:600; text-transform:uppercase; letter-spacing:.5px;
}

.intra-wizard-nav {
  margin-top:30px;
  display:flex; gap:12px; align-items:center;
}
.intra-wizard-back {
  padding:13px 22px; font-size:14px; font-weight:600;
  background:rgba(255,255,255,.06);
  border:1.5px solid rgba(255,255,255,.15);
  border-radius:11px; cursor:pointer;
  color:rgba(255,255,255,.7);
  transition:all .18s;
  font-family:inherit;
}
.intra-wizard-back:hover { border-color:rgba(255,255,255,.4); color:#fff; }
.intra-wizard-next {
  flex:1; padding:14px; font-size:15px; font-weight:600;
  background:var(--blue); color:#fff; border:none;
  border-radius:11px; cursor:pointer;
  transition:background .2s, opacity .2s;
  font-family:inherit;
}
.intra-wizard-next:hover { background:var(--blue-2); }
.intra-wizard-next:disabled { opacity:.3; cursor:not-allowed; }

/* Resultado wizard sudoración */
.sweat-result-big {
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.1);
  border-radius:18px; padding:26px 22px;
  text-align:center; margin-bottom:18px;
}
.sweat-result-k {
  font-size:11px; font-weight:600;
  color:rgba(255,255,255,.5);
  letter-spacing:1.2px; text-transform:uppercase;
}
.sweat-result-v {
  font-size:48px; font-weight:700; letter-spacing:-2px;
  color:#fff; margin-top:8px; line-height:1;
}
.sweat-result-unit {
  font-size:15px; color:rgba(255,255,255,.55);
}
.sweat-result-detail {
  font-size:13px; color:rgba(255,255,255,.55);
  margin-top:14px;
}
.sweat-result-reco {
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px; padding:16px;
  margin-top:14px;
}
.sweat-result-reco-h {
  font-size:11px; font-weight:700; color:rgba(255,255,255,.6);
  letter-spacing:.5px; text-transform:uppercase;
  margin-bottom:10px;
}
.sweat-result-reco-row {
  display:flex; justify-content:space-between; align-items:center;
  padding:6px 0; font-size:13.5px; color:#fff;
}
.sweat-result-reco-row b { color:var(--blue-2); }

/* ────────────────────────────────────────────
   PRODUCTOS DISPONIBLES
──────────────────────────────────────────── */
.product-list {
  display:flex; flex-direction:column; gap:10px;
}
.product-item {
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  padding:14px 16px;
  display:flex; align-items:center; gap:12px;
  transition:all .15s var(--ease);
}
.product-item.active {
  background:rgba(255,255,255,.1);
  border-color:rgba(79,158,232,.5);
}
.product-icon {
  width:38px; height:38px; border-radius:10px;
  background:rgba(255,255,255,.06);
  display:flex; align-items:center; justify-content:center;
  font-size:18px;
  flex-shrink:0;
}
.product-info { flex:1; min-width:0; }
.product-name {
  color:#fff; font-size:14.5px; font-weight:600;
}
.product-meta {
  color:rgba(255,255,255,.5); font-size:11.5px;
  margin-top:2px;
}
.product-qty {
  display:flex; align-items:center; gap:8px;
  flex-shrink:0;
}
.product-qty-btn {
  width:30px; height:30px; border-radius:8px;
  background:rgba(255,255,255,.08);
  border:none; color:#fff;
  font-size:18px; font-weight:600;
  cursor:pointer;
  transition:all .15s;
  font-family:inherit;
}
.product-qty-btn:hover { background:rgba(255,255,255,.15); }
.product-qty-btn:disabled { opacity:.25; cursor:not-allowed; }
.product-qty-val {
  width:32px; text-align:center;
  color:#fff; font-size:15px; font-weight:700;
}

.product-totals {
  background:rgba(47,125,209,.12);
  border:1px solid rgba(47,125,209,.3);
  border-radius:12px;
  padding:14px 16px;
  margin-top:16px;
  display:grid; grid-template-columns:1fr 1fr 1fr;
  gap:10px;
}
.product-total-cell { text-align:center; }
.product-total-k {
  font-size:10.5px; font-weight:600;
  color:rgba(255,255,255,.6);
  text-transform:uppercase; letter-spacing:.5px;
}
.product-total-v {
  font-size:18px; font-weight:700; color:#fff;
  margin-top:3px;
}

/* ────────────────────────────────────────────
   TIMELINE
──────────────────────────────────────────── */
.timeline-summary {
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.1);
  border-radius:18px; padding:22px;
  margin-bottom:18px;
}
.timeline-summary-row {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:12px;
}
.timeline-summary-cell { text-align:center; }
.timeline-summary-k {
  font-size:10.5px; font-weight:600;
  color:rgba(255,255,255,.55); letter-spacing:.5px;
  text-transform:uppercase;
}
.timeline-summary-v {
  font-size:22px; font-weight:700; color:#fff;
  margin-top:5px; letter-spacing:-.5px;
}

.timeline-list {
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px; padding:18px;
  position:relative;
}
.timeline-list-h {
  font-size:12px; font-weight:700;
  color:rgba(255,255,255,.6);
  letter-spacing:.6px; text-transform:uppercase;
  margin-bottom:14px;
}
.timeline-track {
  position:relative;
  padding-left:34px;
}
.timeline-track::before {
  content:''; position:absolute;
  left:13px; top:8px; bottom:8px; width:2px;
  background:linear-gradient(180deg, var(--blue-2), rgba(47,125,209,.2));
  border-radius:2px;
}
.timeline-stop {
  position:relative;
  padding:8px 0 12px;
  display:flex; align-items:flex-start; gap:14px;
}
.timeline-stop:last-child { padding-bottom:0; }
.timeline-stop::before {
  content:''; position:absolute;
  left:-27px; top:14px;
  width:12px; height:12px; border-radius:50%;
  background:#fff;
  border:3px solid var(--blue);
  box-shadow:0 0 0 3px #0A1A2F;
}
.timeline-stop.is-drink::before {
  border-color:#4F9EE8;
}
.timeline-stop.is-end::before {
  background:#FFD66E;
  border-color:#E0A726;
}
.timeline-time {
  font-size:13px; font-weight:700;
  color:var(--blue-2);
  min-width:48px;
}
.timeline-content { flex:1; min-width:0; }
.timeline-title {
  font-size:14px; font-weight:600; color:#fff;
}
.timeline-detail {
  font-size:12px; color:rgba(255,255,255,.55);
  margin-top:2px;
}

/* ────────────────────────────────────────────
   GUARDAR + NOMBRE
──────────────────────────────────────────── */
.save-form {
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.1);
  border-radius:14px;
  padding:18px;
  margin-top:18px;
}
.save-form-h {
  font-size:12px; font-weight:700;
  color:rgba(255,255,255,.7);
  letter-spacing:.5px; text-transform:uppercase;
  margin-bottom:10px;
}
.save-form-input {
  width:100%; padding:13px 15px; font-size:15px;
  background:#fff; border:1.5px solid transparent;
  border-radius:12px; color:var(--text);
  font-family:inherit; outline:none;
}
.save-form-input:focus { border-color:var(--blue-2); }
.save-form-actions {
  margin-top:12px;
  display:flex; gap:10px;
}
.save-form-actions button {
  flex:1; padding:13px; font-size:14px; font-weight:600;
  border-radius:11px; border:none; cursor:pointer;
  font-family:inherit; transition:all .18s;
}
.btn-save {
  background:var(--blue); color:#fff;
}
.btn-save:hover { background:var(--blue-2); }
.btn-save:disabled { opacity:.4; cursor:not-allowed; }

/* ────────────────────────────────────────────
   RESPONSIVE
──────────────────────────────────────────── */
@media(max-width:768px){
  .intra-hero { padding:20px 18px; border-radius:16px; }
  .intra-hero-title { font-size:18px; }
  .intra-hero-metrics { grid-template-columns:1fr; gap:8px; }
  .intra-hero-actions { flex-direction:column; }
  .intra-hero-actions button { width:100%; justify-content:center; }

  .sweat-hero { padding:20px 18px; border-radius:16px; }
  .sweat-hero-val { font-size:36px; }
  .sweat-recos { grid-template-columns:1fr; }

  .intra-wizard-stage { padding:24px 18px 80px; }
  .intra-wizard-title { font-size:20px; }
  .intra-wizard-help { font-size:13px; }
  .intra-input-grid { grid-template-columns:1fr; }
  .intra-input { font-size:16px !important; }
  .intra-chip { padding:10px 14px; font-size:13px; }
  .intra-duration input { font-size:16px !important; width:72px; }

  .product-totals { grid-template-columns:1fr; gap:8px; }
  .timeline-summary-row { grid-template-columns:1fr 1fr; }
  .timeline-summary-row .timeline-summary-cell:nth-child(3) { grid-column:1/-1; }
  .timeline-summary-v { font-size:18px; }

  .intra-wizard-back { padding:12px 18px; font-size:13px; }
  .intra-wizard-next { padding:13px; font-size:14px; }
  .sweat-result-v { font-size:40px; }

  .strategy-list-card { padding:14px; }
  .strategy-item { padding:11px 13px; }
  .save-form-input { font-size:16px !important; }
}

/* ────────────────────────────────────────────
   v3.1 (Entrega 3e) — Progreso CH + Used + Warnings
──────────────────────────────────────────── */

/* Barra de progreso vs objetivo (paso 3 del wizard) */
.product-progress {
  margin-top:14px;
  padding:0 2px;
}
.product-progress-bar {
  width:100%; height:8px;
  background:rgba(255,255,255,.08);
  border-radius:99px; overflow:hidden;
}
.product-progress-fill {
  height:100%;
  border-radius:99px;
  transition:width .3s var(--ease), background .25s var(--ease);
}
.product-progress-fill.short { background:linear-gradient(90deg, #d97a4a, #e09556); }
.product-progress-fill.ok    { background:linear-gradient(90deg, #4caf6e, #5fbf81); }
.product-progress-fill.over  { background:linear-gradient(90deg, #d18b2f, #e2a447); }

.product-progress-msg {
  margin-top:9px;
  font-size:12.5px; font-weight:500;
  text-align:center;
  color:rgba(255,255,255,.7);
  line-height:1.4;
}
.product-progress-msg.short { color:#e8a075; }
.product-progress-msg.ok    { color:#7fd99a; }
.product-progress-msg.over  { color:#e8b76a; }

/* Subtítulo dentro de los cells del summary del resultado */
.timeline-summary-sub {
  font-size:10.5px; font-weight:500;
  color:rgba(255,255,255,.45);
  margin-top:3px;
  letter-spacing:.2px;
}

/* Diff coloreado al lado del CH/h real */
.diff-ok   { color:#7fd99a; font-weight:600; font-size:13px; }
.diff-warn { color:#e8b76a; font-weight:600; font-size:13px; }

/* Resumen "Lo que vas a usar" en el resultado */
.timeline-used {
  margin-top:18px; padding:14px 16px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.07);
  border-radius:14px;
}
.timeline-used-h {
  font-size:11.5px; font-weight:600;
  letter-spacing:.6px; text-transform:uppercase;
  color:rgba(255,255,255,.55);
  margin-bottom:10px;
}
.timeline-used-list {
  display:flex; flex-wrap:wrap; gap:7px;
}
.timeline-used-chip {
  display:inline-flex; align-items:center; gap:4px;
  font-size:12.5px; font-weight:600;
  padding:6px 11px;
  border-radius:99px;
  background:rgba(47,125,209,.18);
  color:#bfd7f0;
  border:1px solid rgba(74,143,212,.25);
}

/* Aviso de déficit/exceso */
.timeline-warning {
  margin-top:14px; padding:12px 15px;
  background:rgba(232,176,106,.10);
  border:1px solid rgba(232,176,106,.28);
  border-radius:12px;
  font-size:13px; line-height:1.45;
  color:#e8b76a;
  font-weight:500;
}

/* ════════════════════════════════════════════════════════════
   v4 (Entrega 4a) — Estilos vista atleta + tab nutri
════════════════════════════════════════════════════════════ */

/* ─────────── Bloque "Pautado por tu nutri" (vista atleta) ─────────── */
.nutri-block {
  margin-bottom:24px;
}
.nutri-block-h {
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:12px;
  padding:0 4px;
}
.nutri-block-badge {
  display:inline-flex; align-items:center; gap:6px;
  font-size:12px; font-weight:700;
  padding:6px 12px; border-radius:99px;
  background:linear-gradient(135deg, #F5C046, #E2A547);
  color:#4A2E00;
  letter-spacing:.3px;
  box-shadow:0 4px 14px rgba(226,165,71,.35);
}
.nutri-block-count {
  font-size:11px; font-weight:600;
  color:var(--text-2);
  text-transform:uppercase; letter-spacing:.5px;
}

.intra-hero.premium {
  background:linear-gradient(135deg, #1E2D4D, #0E1B30);
  border:1.5px solid rgba(245,192,70,.35);
  box-shadow:0 18px 50px rgba(0,0,0,.35), inset 0 0 0 1px rgba(245,192,70,.08);
  position:relative;
}
.premium-corner {
  position:absolute; top:0; right:0;
  background:linear-gradient(135deg, #F5C046, #E2A547);
  color:#4A2E00;
  font-size:10.5px; font-weight:800; letter-spacing:.8px;
  padding:7px 14px;
  border-bottom-left-radius:12px;
}

.strategy-item.premium-item {
  background:#fff;
  border-color:rgba(245,192,70,.42);
  color:var(--navy);
  box-shadow:0 8px 22px rgba(10,26,47,.06);
}
.strategy-item.premium-item:hover {
  background:#fff;
  border-color:#E2A547;
  box-shadow:0 10px 26px rgba(10,26,47,.09);
}
.strategy-item.premium-item .strategy-item-ic {
  background:linear-gradient(135deg, #F5C046, #E2A547);
  color:#4A2E00;
}
.strategy-item.premium-item .strategy-item-name {
  color:var(--navy);
}
.strategy-item.premium-item .strategy-item-meta {
  color:#64748B;
}
.strategy-item.premium-item .strategy-item-action {
  color:#E2A547;
  font-weight:900;
}

/* ─────────── Notas del nutri (dentro de la card) ─────────── */
.nutri-note {
  margin-top:16px; padding:12px 14px;
  background:rgba(245,192,70,.08);
  border:1px solid rgba(245,192,70,.20);
  border-radius:12px;
}
.nutri-note-h {
  font-size:11px; font-weight:700;
  color:#F5C046; letter-spacing:.5px; text-transform:uppercase;
  margin-bottom:5px;
}
.nutri-note-body {
  font-size:13px; line-height:1.5;
  color:rgba(255,255,255,.88);
}

/* ─────────── Comentario del nutri en estrategias del atleta ─────────── */
.intra-hero.has-comment {
  border-left:3px solid var(--blue-2);
}
.nutri-comment {
  margin-top:16px; padding:12px 14px;
  background:rgba(47,125,209,.10);
  border:1px solid rgba(74,143,212,.25);
  border-radius:12px;
}
.nutri-comment-h {
  font-size:11px; font-weight:700;
  color:#7FB3E8; letter-spacing:.5px; text-transform:uppercase;
  margin-bottom:5px;
}
.nutri-comment-body {
  font-size:13px; line-height:1.5;
  color:rgba(255,255,255,.88);
}

.strategy-item.has-comment-item {
  background:linear-gradient(180deg, rgba(47,125,209,.06), transparent);
}
.strategy-comment-dot {
  display:inline-block; margin-left:6px;
  font-size:11px;
}

.athlete-block { margin-top:8px; }
.athlete-block-h {
  font-size:11.5px; font-weight:600;
  color:var(--text-2);
  text-transform:uppercase; letter-spacing:.8px;
  margin-bottom:12px;
  padding:0 4px;
}

/* ─────────── Vista detallada (intraViewStrategy) ─────────── */
.view-premium-badge {
  display:inline-block;
  font-size:11px; font-weight:700;
  padding:4px 10px; border-radius:99px;
  background:linear-gradient(135deg, #F5C046, #E2A547);
  color:#4A2E00;
  letter-spacing:.4px;
}
.view-recommended-badge {
  display:inline-block; margin-left:8px;
  font-size:10.5px; font-weight:800;
  padding:4px 9px; border-radius:6px;
  background:rgba(245,192,70,.20);
  color:#F5C046;
  letter-spacing:.6px;
}
.view-nutri-note,
.view-nutri-comment {
  margin-bottom:16px; padding:14px 16px;
  border-radius:14px;
}
.view-nutri-note {
  background:rgba(245,192,70,.08);
  border:1px solid rgba(245,192,70,.22);
}
.view-nutri-note-h {
  font-size:11.5px; font-weight:700;
  color:#F5C046; letter-spacing:.5px; text-transform:uppercase;
  margin-bottom:6px;
}
.view-nutri-note-body {
  font-size:13.5px; line-height:1.55;
  color:rgba(255,255,255,.92);
  white-space:pre-wrap;
}
.view-nutri-comment {
  background:rgba(47,125,209,.10);
  border:1px solid rgba(74,143,212,.28);
}
.view-nutri-comment-h {
  font-size:11.5px; font-weight:700;
  color:#7FB3E8; letter-spacing:.5px; text-transform:uppercase;
  margin-bottom:6px;
}
.view-nutri-comment-body {
  font-size:13.5px; line-height:1.55;
  color:rgba(255,255,255,.92);
  white-space:pre-wrap;
}

/* ════════════════════════════════════════════════════════════
   TAB INTRAENTRENO en la ficha del atleta (nutri)
════════════════════════════════════════════════════════════ */

#ad-intra {
  margin-top:18px;
}

.nutri-athlete-summary {
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px;
  padding:20px 22px;
  margin-bottom:20px;
}
.nutri-athlete-summary-row {
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:12px;
  margin-bottom:16px;
}
.nutri-athlete-card {
  background:#F7F9FC;
  border:1px solid var(--line);
  border-radius:12px;
  padding:14px 16px;
}
.nutri-athlete-card-k {
  font-size:10.5px; font-weight:600;
  color:var(--text-2);
  text-transform:uppercase; letter-spacing:.7px;
  margin-bottom:6px;
}
.nutri-athlete-card-v {
  font-size:18px; font-weight:700;
  color:var(--navy);
  line-height:1.2;
}
.nutri-athlete-card-sub {
  font-size:11.5px; color:var(--text-2);
  margin-top:4px;
}
.nutri-athlete-card .muted {
  color:var(--text-2);
  font-size:13px;
  font-weight:500;
}

.nutri-section {
  margin-bottom:24px;
}
.nutri-section-h {
  font-size:13px; font-weight:700;
  color:var(--navy);
  margin-bottom:10px;
  padding:0 4px;
}
.nutri-plans-list {
  background:#fff;
  border:1px solid var(--line);
  border-radius:14px;
  overflow:hidden;
}
.nutri-plan-row {
  display:flex; align-items:center;
  padding:14px 16px;
  border-bottom:1px solid var(--line);
  gap:12px;
  transition:background .15s var(--ease);
}
.nutri-plan-row:last-child { border-bottom:none; }
.nutri-plan-row:hover { background:#F7F9FC; }
.nutri-plan-row.is-recommended {
  background:linear-gradient(90deg, rgba(245,192,70,.07), transparent);
  border-left:3px solid #E2A547;
}
.nutri-plan-row-info {
  flex:1; min-width:0; cursor:pointer;
}
.nutri-plan-row-title {
  font-size:14.5px; font-weight:600;
  color:var(--navy);
  margin-bottom:3px;
  display:flex; align-items:center; gap:4px;
  flex-wrap:wrap;
}
.badge-rec {
  display:inline-block;
  font-size:9.5px; font-weight:800;
  padding:2px 7px; border-radius:5px;
  background:#E2A547; color:#fff;
  letter-spacing:.5px;
  margin-right:6px;
}
.nutri-plan-row-meta {
  font-size:12px; color:var(--text-2);
}
.nutri-plan-row-meta .muted { color:#9AA7B5; }
.nutri-plan-row-comment {
  margin-top:5px;
  font-size:12px; color:var(--blue);
  background:rgba(47,125,209,.08);
  padding:5px 9px; border-radius:7px;
  display:inline-block;
}
.nutri-plan-row-actions {
  display:flex; gap:6px;
  flex-shrink:0;
}
.nutri-plan-btn {
  border:1px solid var(--line);
  background:#fff;
  color:var(--text-2);
  width:36px; height:36px;
  border-radius:9px;
  font-size:15px;
  cursor:pointer;
  transition:all .15s var(--ease);
  display:inline-flex; align-items:center; justify-content:center;
  font-family:inherit;
}
.nutri-plan-btn:hover {
  background:var(--blue-soft);
  color:var(--blue);
  border-color:var(--blue);
}
.nutri-plan-btn.on {
  background:#E2A547;
  color:#fff;
  border-color:#E2A547;
}

/* ════════════════════════════════════════════════════════════
   WIZARD AVANZADO DEL NUTRI (overlay)
════════════════════════════════════════════════════════════ */

/* Reutiliza .intra-wizard-bg, .intra-wizard-card, .intra-input, etc.
   pero con algunos extras para los nuevos controles. */

/* Inputs duales (min - max) */
.dual-range {
  display:flex; align-items:center; gap:10px;
}
.dual-range input {
  flex:1;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14);
  border-radius:10px;
  color:#fff;
  padding:11px 14px;
  font-size:15px; font-weight:600;
  text-align:center;
  font-family:inherit;
  outline:none;
  transition:border-color .15s var(--ease);
  -moz-appearance:textfield;
}
.dual-range input::-webkit-outer-spin-button,
.dual-range input::-webkit-inner-spin-button {
  -webkit-appearance:none; margin:0;
}
.dual-range input:focus {
  border-color:var(--blue-2);
}
.dual-range-sep {
  color:rgba(255,255,255,.4);
  font-size:13px;
}
.dual-range-unit {
  color:rgba(255,255,255,.55);
  font-size:13px; font-weight:500;
  min-width:55px;
}

/* Input grande con +/- (CH target) */
.big-num-input {
  display:flex; align-items:center; gap:10px;
  justify-content:center;
  margin-top:6px;
}
.big-num-input input {
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.18);
  border-radius:14px;
  color:#fff;
  padding:18px 0;
  font-size:32px; font-weight:700;
  text-align:center;
  font-family:inherit;
  width:140px;
  outline:none;
  -moz-appearance:textfield;
}
.big-num-input input::-webkit-outer-spin-button,
.big-num-input input::-webkit-inner-spin-button {
  -webkit-appearance:none; margin:0;
}
.big-num-btn {
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.16);
  color:#fff;
  width:54px; height:54px;
  border-radius:13px;
  font-size:18px; font-weight:700;
  cursor:pointer;
  font-family:inherit;
  transition:all .15s var(--ease);
}
.big-num-btn:hover {
  background:var(--blue);
  border-color:var(--blue);
}
.big-num-helper {
  text-align:center;
  margin-top:8px;
  font-size:12.5px;
  color:rgba(255,255,255,.55);
}

/* Caja info cafeína */
.caffeine-info {
  margin-top:12px; padding:12px 14px;
  background:rgba(255,193,7,.07);
  border:1px solid rgba(255,193,7,.18);
  border-radius:11px;
}
.caffeine-info-h {
  font-size:11.5px; font-weight:700;
  color:#FFC107;
  text-transform:uppercase; letter-spacing:.5px;
  margin-bottom:6px;
}
.caffeine-info-body {
  font-size:13px; line-height:1.55;
  color:rgba(255,255,255,.85);
}

/* Grupos de productos en el catálogo (paso 5) */
.product-group-h {
  font-size:11.5px; font-weight:700;
  color:rgba(255,255,255,.45);
  text-transform:uppercase; letter-spacing:.7px;
  margin:14px 4px 8px;
  padding-bottom:4px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.product-group-h:first-child { margin-top:0; }

/* Controles ↑↓ del timeline editable */
.timeline-track.editable .timeline-stop {
  display:flex; align-items:center;
  padding:14px 16px;
  gap:14px;
}
.timeline-controls {
  display:flex; flex-direction:column; gap:4px;
  flex-shrink:0;
  margin-left:auto;
}
.tc-btn {
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.14);
  color:#fff;
  width:30px; height:24px;
  border-radius:6px;
  font-size:12px; font-weight:600;
  cursor:pointer;
  font-family:inherit;
  transition:all .12s var(--ease);
}
.tc-btn:hover:not(:disabled) {
  background:var(--blue);
  border-color:var(--blue);
}
.tc-btn:disabled {
  opacity:.3;
  cursor:not-allowed;
}

/* Responsive — móvil */
@media (max-width:760px) {
  .nutri-athlete-summary-row {
    grid-template-columns:1fr;
  }
  .big-num-input input { font-size:26px; width:110px; padding:14px 0; }
  .big-num-btn { width:46px; height:46px; }
}

/* ════════════════════════════════════════════════════════════
   v4b — Widget de estrategias + controles timeline
════════════════════════════════════════════════════════════ */

/* Grid de widgets */
.nutri-strat-widgets {
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(280px, 1fr));
  gap:12px;
}

/* Tarjeta widget */
.nutri-strat-widget {
  background:#fff;
  border:1px solid var(--line);
  border-radius:12px;
  padding:14px 16px;
  cursor:pointer;
  transition:all .15s var(--ease);
  display:flex; flex-direction:column; gap:6px;
}
.nutri-strat-widget:hover {
  border-color:var(--blue);
  box-shadow:0 4px 18px rgba(47,125,209,.12);
  transform:translateY(-1px);
}
.nutri-strat-widget.is-recommended {
  border-left:3px solid var(--orange);
  background:linear-gradient(180deg, rgba(245,192,70,.04), transparent);
}

.nutri-strat-widget-head {
  display:flex; align-items:flex-start; justify-content:space-between; gap:8px;
}
.nutri-strat-widget-title {
  font-size:13.5px; font-weight:600;
  color:var(--navy);
  flex:1; min-width:0;
}
.nutri-strat-widget-actions {
  display:flex; gap:4px; flex-shrink:0;
}
.nutri-strat-widget-meta {
  font-size:12px; color:var(--text-2);
}
.nutri-strat-widget-comment {
  font-size:11.5px; color:var(--blue);
  background:rgba(47,125,209,.07);
  padding:5px 9px; border-radius:7px;
  line-height:1.4;
}
.nutri-strat-widget-footer {
  font-size:11px; color:var(--blue);
  margin-top:2px;
}

/* Fila de añadir toma en el timeline */
.tl-add-row {
  display:flex; align-items:center; gap:10px;
  margin:14px 0 4px;
  padding:12px 14px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.1);
  border-radius:12px;
  flex-wrap:wrap;
}
.tl-add-select {
  flex:1; min-width:180px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.18);
  border-radius:9px;
  color:#fff;
  padding:9px 12px;
  font-size:13px;
  font-family:inherit;
  outline:none;
}
.tl-add-min-wrap {
  display:flex; align-items:center; gap:6px;
  flex-shrink:0;
}
.tl-add-min-label {
  font-size:12px; color:rgba(255,255,255,.6);
  font-weight:600;
}
.tl-add-min {
  width:65px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.18);
  border-radius:9px;
  color:#fff;
  padding:9px 10px;
  font-size:13px;
  text-align:center;
  font-family:inherit;
  outline:none;
  -moz-appearance:textfield;
}
.tl-add-min::-webkit-outer-spin-button,
.tl-add-min::-webkit-inner-spin-button { -webkit-appearance:none; }

/* Input de minuto editable en timeline */
.tl-min-edit {
  display:flex; align-items:center; gap:2px;
  min-width:54px;
}
.tl-min-input {
  width:44px;
  background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.2);
  border-radius:6px;
  color:#fff;
  padding:4px 6px;
  font-size:12px; font-weight:600;
  text-align:center;
  font-family:inherit;
  outline:none;
  -moz-appearance:textfield;
}
.tl-min-input::-webkit-outer-spin-button,
.tl-min-input::-webkit-inner-spin-button { -webkit-appearance:none; }
.tl-min-input:focus { border-color:var(--blue-2); }
.tl-min-sep {
  font-size:11px; color:rgba(255,255,255,.5);
}

/* Botón eliminar en los controles del timeline */
.tc-del {
  background:rgba(218,79,79,.15) !important;
  border-color:rgba(218,79,79,.3) !important;
  color:#f08080 !important;
}
.tc-del:hover:not(:disabled) {
  background:rgba(218,79,79,.3) !important;
  border-color:rgba(218,79,79,.5) !important;
  color:#fff !important;
}

/* Toma food vs drink distinción visual */
.timeline-stop.is-food { border-left:3px solid transparent; }
.timeline-stop.is-food:hover { border-left-color:var(--blue-2); }

/* Responsive widgets */
@media (max-width:760px) {
  .nutri-strat-widgets { grid-template-columns:1fr; }
  .tl-add-row { flex-direction:column; align-items:stretch; }
  .tl-add-select { width:100%; }
}

/* ════════════════════════════════════════════════════════════
   DTR · Intraentreno Nutri Premium Front v5
   Rediseño visual del tab admin/nutri sin tocar lógica ni Supabase
════════════════════════════════════════════════════════════ */
#ad-intra {
  margin-top:20px;
}

.nia-shell {
  display:flex;
  flex-direction:column;
  gap:16px;
  max-width:1180px;
}

.nia-hero-card,
.nia-metric-card,
.nia-featured-card,
.nia-toolbar-card,
.nia-list-section,
.nia-empty-state {
  box-sizing:border-box;
}

.nia-hero-card {
  position:relative;
  overflow:hidden;
  border-radius:22px;
  padding:1px;
  background:linear-gradient(135deg, rgba(79,158,232,.72), rgba(245,192,70,.34), rgba(255,255,255,.18));
  box-shadow:0 24px 70px rgba(2,10,22,.22);
}
.nia-hero-card::after {
  content:'';
  position:absolute;
  inset:1px;
  border-radius:21px;
  background:linear-gradient(135deg, #112944 0%, #0A1A2F 55%, #071524 100%);
  z-index:0;
}
.nia-hero-glow {
  position:absolute;
  width:360px;
  height:360px;
  right:-120px;
  top:-170px;
  background:radial-gradient(circle, rgba(79,158,232,.36), transparent 62%);
  z-index:1;
  pointer-events:none;
}
.nia-hero-content {
  position:relative;
  z-index:2;
  padding:22px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:22px;
}
.nia-kicker,
.nia-eyebrow {
  font-size:10.5px;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:1px;
}
.nia-kicker {
  color:rgba(255,255,255,.58);
  margin-bottom:8px;
}
.nia-hero-copy h3 {
  margin:0;
  color:#fff;
  font-size:24px;
  line-height:1.08;
  letter-spacing:-.75px;
}
.nia-hero-copy p {
  margin:9px 0 0;
  max-width:620px;
  color:rgba(255,255,255,.66);
  font-size:13px;
  line-height:1.5;
}
.nia-hero-actions {
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
  flex-shrink:0;
}

.nia-btn,
.nia-action-btn,
.nia-icon-btn,
.nia-clear-btn {
  font-family:inherit;
  border:0;
  cursor:pointer;
  transition:transform .16s var(--ease), box-shadow .16s var(--ease), border-color .16s var(--ease), background .16s var(--ease), color .16s var(--ease);
}
.nia-btn {
  min-height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:0 15px;
  border-radius:13px;
  font-size:13px;
  font-weight:850;
  white-space:nowrap;
}
.nia-btn-primary {
  background:linear-gradient(135deg, var(--blue), var(--blue-2));
  color:#fff;
  box-shadow:0 13px 30px rgba(47,125,209,.34);
}
.nia-btn-primary:hover { transform:translateY(-1px); box-shadow:0 17px 38px rgba(47,125,209,.42); }
.nia-btn-ghost {
  background:rgba(255,255,255,.08);
  color:#fff;
  border:1px solid rgba(255,255,255,.16);
}
.nia-btn-ghost:hover { background:rgba(255,255,255,.13); transform:translateY(-1px); }

.nia-metrics-grid {
  display:grid;
  grid-template-columns:1.15fr 1.35fr .8fr;
  gap:12px;
}
.nia-metric-card {
  background:#fff;
  border:1px solid rgba(221,227,234,.92);
  border-radius:18px;
  padding:17px 18px;
  min-height:116px;
  box-shadow:0 16px 42px rgba(4,16,32,.05);
}
.nia-metric-top {
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:11px;
}
.nia-metric-top span {
  width:27px;
  height:27px;
  border-radius:10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--blue-soft);
  color:var(--blue);
  font-size:14px;
}
.nia-metric-top small {
  font-size:10.5px;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.8px;
  color:var(--text-2);
}
.nia-metric-card strong {
  display:block;
  color:var(--navy);
  font-size:19px;
  font-weight:900;
  line-height:1.18;
  letter-spacing:-.35px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.nia-metric-card p {
  margin:7px 0 0;
  color:var(--text-2);
  font-size:12px;
  line-height:1.45;
}
.nia-metric-card.compact strong { font-size:26px; }

.nia-featured-card {
  position:relative;
  overflow:hidden;
  background:#fff;
  border:1px solid rgba(221,227,234,.92);
  border-radius:20px;
  padding:19px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  box-shadow:0 18px 46px rgba(4,16,32,.055);
  cursor:pointer;
}
.nia-featured-card.official {
  border-color:rgba(245,192,70,.48);
  background:linear-gradient(135deg, rgba(245,192,70,.10), #fff 45%, rgba(47,125,209,.035));
}
.nia-featured-card.athlete {
  border-color:rgba(47,125,209,.25);
  background:linear-gradient(135deg, rgba(47,125,209,.08), #fff 42%);
}
.nia-featured-card.empty {
  border-style:dashed;
  cursor:default;
}
.nia-featured-card:hover:not(.empty) {
  transform:translateY(-1px);
  border-color:var(--blue-2);
  box-shadow:0 22px 54px rgba(47,125,209,.13);
}
.nia-featured-ribbon {
  position:absolute;
  top:0;
  right:0;
  padding:7px 13px;
  border-bottom-left-radius:12px;
  font-size:10px;
  font-weight:900;
  letter-spacing:.7px;
  text-transform:uppercase;
  background:linear-gradient(135deg, #F5C046, #E2A547);
  color:#4A2E00;
}
.nia-featured-main {
  display:flex;
  align-items:flex-start;
  gap:14px;
  min-width:0;
  flex:1;
}
.nia-featured-icon {
  width:48px;
  height:48px;
  border-radius:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  background:#0A1A2F;
  color:#fff;
  box-shadow:0 12px 24px rgba(10,26,47,.18);
}
.nia-featured-copy { min-width:0; }
.nia-eyebrow {
  color:var(--blue);
  margin-bottom:6px;
}
.nia-featured-card.official .nia-eyebrow { color:#A66D00; }
.nia-featured-copy h4,
.nia-toolbar-head h4,
.nia-section-head h4,
.nia-empty-state h4 {
  margin:0;
  color:var(--navy);
  font-size:17px;
  line-height:1.2;
  letter-spacing:-.32px;
}
.nia-featured-copy p,
.nia-empty-state p {
  color:var(--text-2);
  font-size:13px;
  line-height:1.5;
  margin:4px 0 0;
}
.nia-chip-row {
  margin-top:9px;
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}
.nia-chip-row span,
.nia-pill {
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  font-size:11px;
  font-weight:850;
  line-height:1;
}
.nia-chip-row span {
  padding:6px 9px;
  background:#F1F5F9;
  color:#526173;
}
.nia-featured-note {
  margin-top:10px;
  display:inline-block;
  max-width:680px;
  background:rgba(47,125,209,.08);
  color:#245D9A;
  border:1px solid rgba(47,125,209,.15);
  padding:8px 10px;
  border-radius:11px;
  font-size:12px;
  line-height:1.45;
}
.nia-featured-actions {
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
  flex-shrink:0;
  padding-right:2px;
}
.nia-action-btn {
  min-height:34px;
  padding:0 11px;
  border-radius:10px;
  background:#fff;
  border:1px solid var(--line);
  color:var(--text-2);
  font-size:12px;
  font-weight:850;
}
.nia-action-btn:hover { border-color:var(--blue-2); color:var(--blue); background:var(--blue-soft); }
.nia-action-btn.primary { background:var(--navy); border-color:var(--navy); color:#fff; }
.nia-action-btn.primary:hover { background:var(--navy-2); color:#fff; }
.nia-action-btn.accent { background:rgba(245,192,70,.16); border-color:rgba(226,165,71,.35); color:#7B5200; }
.nia-action-btn.accent:hover { background:#E2A547; border-color:#E2A547; color:#fff; }

.nia-toolbar-card {
  background:#fff;
  border:1px solid rgba(221,227,234,.92);
  border-radius:18px;
  padding:16px;
  box-shadow:0 14px 38px rgba(4,16,32,.045);
}
.nia-toolbar-head {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin-bottom:14px;
}
.nia-clear-btn {
  min-height:32px;
  padding:0 11px;
  border-radius:10px;
  background:#F6F8FB;
  border:1px solid var(--line);
  color:var(--text-2);
  font-size:12px;
  font-weight:800;
}
.nia-clear-btn:hover { color:var(--blue); border-color:var(--blue-2); background:var(--blue-soft); }
.nia-filters-grid {
  display:grid;
  grid-template-columns:1.4fr .9fr .85fr .85fr;
  gap:10px;
}
.nia-filters-grid label {
  display:flex;
  flex-direction:column;
  gap:6px;
}
.nia-filters-grid label span {
  font-size:10px;
  font-weight:900;
  letter-spacing:.75px;
  text-transform:uppercase;
  color:var(--text-2);
}
.nia-filters-grid input,
.nia-filters-grid select {
  height:42px;
  width:100%;
  border:1.5px solid var(--line);
  border-radius:12px;
  background:#F8FAFC;
  color:var(--navy);
  padding:0 12px;
  outline:0;
  font-family:inherit;
  font-size:13px;
  font-weight:750;
}
.nia-filters-grid input:focus,
.nia-filters-grid select:focus {
  border-color:var(--blue);
  background:#fff;
  box-shadow:0 0 0 4px rgba(47,125,209,.08);
}

.nia-list-section {
  background:#fff;
  border:1px solid rgba(221,227,234,.92);
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 14px 38px rgba(4,16,32,.045);
}
.nia-section-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:16px 17px 13px;
  border-bottom:1px solid var(--line);
  background:linear-gradient(180deg, #fff, #FAFCFE);
}
.nia-section-head > span {
  font-size:11px;
  font-weight:900;
  color:var(--text-2);
  background:#F1F5F9;
  border-radius:999px;
  padding:6px 9px;
}
.nia-strategy-list {
  display:flex;
  flex-direction:column;
}
.nia-strategy-row {
  position:relative;
  display:grid;
  grid-template-columns:38px minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  padding:13px 15px;
  border-bottom:1px solid var(--line);
  cursor:pointer;
  background:#fff;
  transition:background .14s var(--ease), transform .14s var(--ease), box-shadow .14s var(--ease);
}
.nia-strategy-row:last-child { border-bottom:none; }
.nia-strategy-row:hover {
  background:#F9FBFE;
  box-shadow:inset 3px 0 0 var(--blue-2);
}
.nia-strategy-row.is-recommended {
  background:linear-gradient(90deg, rgba(245,192,70,.105), #fff 48%);
}
.nia-strategy-row.is-recommended:hover { box-shadow:inset 3px 0 0 #E2A547; }
.nia-row-badge {
  width:34px;
  height:34px;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#EEF3F8;
  color:var(--navy);
  font-size:12px;
  font-weight:900;
}
.nia-strategy-row.is-recommended .nia-row-badge {
  background:linear-gradient(135deg, #F5C046, #E2A547);
  color:#4A2E00;
}
.nia-row-main { min-width:0; }
.nia-row-title-line {
  display:flex;
  align-items:center;
  gap:7px;
  min-width:0;
}
.nia-row-title-line strong {
  min-width:0;
  color:var(--navy);
  font-size:13.5px;
  font-weight:900;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.nia-pill {
  flex-shrink:0;
  padding:5px 7px;
}
.nia-pill.gold { background:rgba(245,192,70,.18); color:#875A00; }
.nia-pill.blue { background:var(--blue-soft); color:var(--blue); }
.nia-pill.soft { background:#F1F5F9; color:#64748B; }
.nia-row-meta {
  margin-top:4px;
  color:var(--text-2);
  font-size:12px;
  line-height:1.35;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.nia-row-comment {
  display:inline-block;
  margin-top:7px;
  padding:6px 9px;
  border-radius:10px;
  background:rgba(47,125,209,.075);
  border:1px solid rgba(47,125,209,.12);
  color:#245D9A;
  font-size:11.5px;
  line-height:1.35;
}
.nia-row-actions {
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
  flex-shrink:0;
}
.nia-icon-btn {
  width:32px;
  height:32px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:10px;
  background:#fff;
  border:1px solid var(--line);
  color:#7C8998;
  font-size:13px;
  font-weight:900;
}
.nia-icon-btn:hover {
  background:var(--blue-soft);
  border-color:var(--blue-2);
  color:var(--blue);
  transform:translateY(-1px);
}
.nia-icon-btn.on {
  background:#E2A547;
  border-color:#E2A547;
  color:#fff;
}
.nia-icon-btn.comment {
  color:#7A5BB2;
  background:rgba(122,91,178,.07);
}
.nia-icon-btn.danger:hover {
  background:#FDECEC;
  border-color:#F5B6B6;
  color:var(--bad);
}

.nia-empty-state {
  background:#fff;
  border:1.5px dashed var(--line);
  border-radius:20px;
  padding:34px 20px;
  text-align:center;
  box-shadow:0 14px 38px rgba(4,16,32,.035);
}
.nia-empty-state.compact { padding:26px 20px; }
.nia-empty-icon {
  width:52px;
  height:52px;
  border-radius:18px;
  background:var(--blue-soft);
  color:var(--blue);
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 auto 12px;
  font-size:22px;
}
.nia-empty-state .nia-btn { margin-top:15px; }

@media (max-width:980px) {
  .nia-hero-content,
  .nia-featured-card {
    align-items:flex-start;
    flex-direction:column;
  }
  .nia-hero-actions,
  .nia-featured-actions {
    width:100%;
    justify-content:flex-start;
  }
  .nia-metrics-grid,
  .nia-filters-grid {
    grid-template-columns:1fr;
  }
  .nia-strategy-row {
    grid-template-columns:34px minmax(0,1fr);
  }
  .nia-row-actions {
    grid-column:1 / -1;
    justify-content:flex-start;
    padding-left:46px;
  }
}

@media (max-width:620px) {
  .nia-shell { gap:12px; }
  .nia-hero-content { padding:18px; }
  .nia-hero-copy h3 { font-size:21px; }
  .nia-featured-card,
  .nia-toolbar-card,
  .nia-metric-card { border-radius:16px; }
  .nia-section-head { align-items:flex-start; }
  .nia-row-title-line { flex-wrap:wrap; }
  .nia-row-meta { white-space:normal; }
}