/* ==== PWR Momentum (no charts/bars/numbers) ==== */
.pwr-momentum {
  --bg:#0A0C10; --text:#E9EEF5; --muted:#9FB0C3;
  --electric:#FFFFFF; --halo:rgba(165,207,255,0.25);
  --ring-size-min: 200px; --ring-size-max: 280px;
  --ring-stroke-min: 4px; --ring-stroke-max: 12px;
  --spin-fast: 2s; --spin-medium: 5s; --spin-slow: 10s;

  color:var(--text);
  background:var(--bg);
  max-width:720px; margin:0 auto; padding:16px 16px 96px;
}

/* Hero */
.pwr-momentum .momentum-hero { position:relative; display:grid; place-items:center; margin:8px auto 18px; width:100%; }
.pwr-momentum .pod-halo {
  position:absolute; width:100%; max-width:420px; aspect-ratio:1/1; border-radius:999px;
  background: radial-gradient(60% 60% at 50% 50%, var(--halo), transparent 70%);
  filter: blur(10px); opacity:.0; pointer-events:none; transition: opacity .4s ease;
}
/* toggled by JS */
.pwr-momentum .pod-halo.is-active{ opacity:.5; }
.pwr-momentum .pod-halo.is-risk{ animation: pwrHaloFlicker 1.4s ease infinite; }
@keyframes pwrHaloFlicker { 0%,100%{opacity:.35;} 50%{opacity:.1;} }

.pwr-momentum .momentum-ring { width: clamp(var(--ring-size-min), 68vw, var(--ring-size-max)); height:auto; filter: drop-shadow(0 0 18px rgba(165,207,255,0.26)); display:block; }
.pwr-momentum .ring-svg { width:100%; height:100%; display:block; transform-origin:50% 50%; will-change:transform; animation: ringPulse 5s ease-in-out infinite }
.pwr-momentum .ring-track {
  fill:none; stroke: rgba(255,255,255,0.08); stroke-width: 8;
}
.pwr-momentum .ring-live {
  fill:none; stroke: var(--electric);
  stroke-opacity: .85;
  stroke-width: 10; stroke-linecap: round;
  filter: url(#ringGlow);
  transform-origin: 100px 100px;
  /* animated via JS by setting inline styles: stroke-opacity, stroke-width, animation-duration */
  animation-name: pwrSpin;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}
/* Plasma flow layers (rotate together for cohesive motion) */
.pwr-momentum .ring-plasma { fill:none; stroke-linecap:round; filter:url(#ringGlow); transform-origin:100px 100px; will-change: transform; shape-rendering:geometricPrecision }
.pwr-momentum .ring-plasma--a { stroke:#ffffff; stroke-opacity:.9; stroke-width:8; stroke-dasharray:70 430; animation: plasmaSpin var(--plasmaSpeed,6s) linear infinite, pwrThick 5s ease-in-out infinite }
.pwr-momentum .ring-plasma--b { stroke:rgba(170,210,255,.8); stroke-width:6; stroke-dasharray:36 464; animation: plasmaSpinReverse var(--plasmaSpeed,6s) linear infinite }
.pwr-momentum .ring-plasma--c { stroke:rgba(200,230,255,.55); stroke-width:5; stroke-dasharray:18 482; animation: plasmaSpin calc(var(--plasmaSpeed,6s)*0.85) linear infinite }
.pwr-momentum .ring-plasma--d { stroke:rgba(150,200,255,.35); stroke-width:4; stroke-dasharray:10 490; animation: plasmaSpinReverse calc(var(--plasmaSpeed,6s)*1.6) linear infinite }
/* fifth layer; medium width and opacity, clockwise */
.pwr-momentum .ring-plasma--e { stroke:rgba(210,240,255,.7); stroke-width:7; stroke-dasharray:40 460; animation: plasmaSpin calc(var(--plasmaSpeed,6s)*1.2) linear infinite }
@keyframes plasmaSpin { to { transform: rotate(360deg); } }
@keyframes plasmaSpinReverse { to { transform: rotate(-360deg); } }
@keyframes pwrThick { 0%,100%{ stroke-width:8 } 50%{ stroke-width:12 } }
@keyframes pwrSpin { to { transform: rotate(360deg); } }

/* Pulse the whole ring subtly; amplitude set via --ringPulse */
@keyframes ringPulse { 0%,100%{ transform: scale(1) } 50%{ transform: scale(calc(1 + var(--ringPulse, 0.02))) } }

/* State label inside the ring */
.pwr-momentum .ring-state { position:absolute; inset:0; display:grid; place-items:center; pointer-events:none; }
.pwr-momentum .state-label {
  background: rgba(16,22,29,.6); border:1px solid #273549; padding:6px 12px; border-radius:999px;
  font-weight:700; font-size:13px; color:#cfe8ff; backdrop-filter: blur(6px);
}

/* Orbits removed */
.pwr-momentum .orbits, .pwr-momentum .orb { display:none !important; }

/* Builders */
.pwr-momentum .builders { margin-top: 12px; }
.pwr-momentum .builders-title { font-size:18px; margin:2px 2px 10px; }
.pwr-momentum .builder-list { display:flex; gap:12px; overflow:auto; scroll-snap-type:x mandatory; padding:0 8px 10px 0; }
.pwr-momentum .builder-card {
  min-width:300px; scroll-snap-align:start; flex:0 0 auto; display:flex; flex-direction:column;
  background: linear-gradient(180deg,#0f1620,#0c1218);
  border: 1px solid #2a3b4e; border-radius:16px; padding:14px;
  box-shadow: 0 8px 24px rgba(0,0,0,.24);
}
.pwr-momentum .builder-title { word-break: normal; overflow-wrap: anywhere; }
.pwr-momentum .builder-actions { flex-wrap: wrap; row-gap:6px; }
.pwr-momentum .builder-title { font-weight:700; }
.pwr-momentum .builder-chips { display:flex; flex-wrap:wrap; gap:6px; margin:6px 0; }
.pwr-momentum .builder-chip { background:#0f1318; border:1px solid #1c2530; color:#9fb0c3; padding:2px 8px; border-radius:999px; font-size:12px; }
.pwr-momentum .builder-actions { display:flex; align-items:center; gap:8px; margin-top:8px; }
.pwr-momentum .btn { padding:8px 12px; border-radius:10px; border:1px solid #223140; background:#10161d; color:var(--text); cursor:pointer; }
.pwr-momentum .btn.primary { background:#ffffff; color:#0f1115; border-color:#ffffff; font-weight:800; }
.pwr-momentum .impact-pill { margin-left:auto; background:#0a1e12; color:#7ff5a5; border:1px solid #1b6137; padding:2px 8px; border-radius:999px; font-weight:800; font-size:12px; }

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .pwr-momentum .ring-live { animation: none !important; }
  .pwr-momentum .ring-plasma { animation: none !important; }
  .pwr-momentum .ring-svg { animation: none !important; }
}

/* ==== Hydration Card ==== */
.pwr-card{background:linear-gradient(180deg,#0f1620,#0c1218);border:1px solid #2a3b4e;border-radius:16px;padding:12px;box-shadow:0 8px 24px rgba(0,0,0,.24);margin:10px 0 14px}
.pwr-card__head{display:grid;gap:4px;margin-bottom:8px}
.pwr-card__title{font-weight:800;font-size:16px}
.pwr-card__subtitle{color:#9fb0c3;font-size:13px}
.pwr-card__row{display:grid;grid-template-columns:110px 1fr;align-items:end;gap:10px}
.pwr-card__metric{display:grid;gap:2px}
.pwr-metric__label{font-size:12px;color:#9fb0c3}
.pwr-metric__value{font-size:18px;font-weight:800;letter-spacing:.2px}
.pwr-card__spark{width:100%;height:auto !important;margin:0}
.pwr-card__actions{display:flex;align-items:center;gap:8px;margin-top:10px}
.pwr-card .btn,.pwr-card .btn.primary{min-height:44px}
.pwr-card--hydration .impact-pill{margin-left:auto;background:#0a1e12;color:#7ff5a5;border:1px solid #1b6137;padding:2px 8px;border-radius:999px;font-weight:800;font-size:12px}

/* Accessibility helper */
.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}
/* Hydration details */
.pwr-card__details{margin-top:10px;border-top:1px solid #223140;padding-top:10px}
.pwr-detail__row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.pwr-detail__col{display:grid;gap:8px}
.pwr-detail__insight{color:#cfe0f7;font-size:13px;margin-top:8px}
#hydration-details-toggle{margin-top:6px}
.pwr-chip-row{display:flex;flex-wrap:wrap;gap:6px}
.pwr-chip{background:#0f1318;border:1px solid #1c2530;color:#9fb0c3;padding:2px 8px;border-radius:999px;font-size:12px}

/* ===== Hydration World-Class ===== */
.pwr-card--hydration { margin-top: 12px; }
.pwr-hyd__top { display:grid; grid-template-columns: 140px 100px 1fr; gap:12px; align-items:center; }
.pwr-hyd__stats { display:flex; flex-wrap:wrap; gap:6px; }

.pwr-donut { position:relative; display:grid; place-items:center; }
.pwr-donut__svg { display:block; position:relative; z-index:1; }
.pwr-donut__caption { position:absolute; display:grid; place-items:center; text-align:center; z-index:2; }
.pwr-donut__caption { inset:0 !important; pointer-events:none; }
.pwr-donut__value { font-size:22px !important; font-weight:900 !important; line-height:1.1 !important; color:#e9eef5 !important; font-variant-numeric: tabular-nums; text-shadow:0 1px 2px rgba(0,0,0,.35); }
.pwr-donut__sub { font-size:12px !important; color:#9fb0c3 !important; line-height:1.1 !important; }

/* Hard center captions regardless of Elementor wrappers */
.pwr-card--hydration .pwr-donut { width:auto; height:auto; }
.pwr-card--hydration .pwr-donut--today { width:120px !important; height:120px !important; }
.pwr-card--hydration .pwr-donut--adherence,
.pwr-card--hydration .pwr-donut--pod { width:80px !important; height:80px !important; }
.pwr-card--hydration .pwr-donut--today .pwr-donut__svg { width:120px !important; height:120px !important; }
.pwr-card--hydration .pwr-donut--adherence .pwr-donut__svg,
.pwr-card--hydration .pwr-donut--pod .pwr-donut__svg { width:80px !important; height:80px !important; }
.pwr-card--hydration .pwr-donut__caption { inset:auto !important; left:50% !important; top:50% !important; transform: translate(-50%,-50%) !important; display:flex !important; flex-direction:column; align-items:center; justify-content:center; gap:2px; width:100%; }
/* Smaller values for mini donuts so they fit cleanly */
.pwr-card--hydration .pwr-donut--adherence .pwr-donut__value,
.pwr-card--hydration .pwr-donut--pod .pwr-donut__value { font-size:16px !important; font-weight:900 !important; }

/* Hydration card header size */
.pwr-card--hydration .pwr-card__title { font-size:25px !important; line-height:1.2 !important; }

.pwr-card__spark { margin-top: 12px; margin-bottom:10px; position:relative; z-index:3; overflow:visible !important; }
.pwr-card__spark svg { overflow:visible !important; display:block; width:100% !important; max-width:100% !important; height:72px !important; }
/* Guard against Elementor containers clipping SVG */
.pwr-card--hydration figure, .pwr-card--hydration svg { overflow: visible !important; }
/* Ensure the sparkline section grows to contain annotations */
.pwr-card--hydration .pwr-card__spark { --spark-bleed: 22px; padding-bottom: var(--spark-bleed) !important; min-height: calc(72px + var(--spark-bleed)) !important; margin-bottom: calc(10px + var(--spark-bleed)) !important; }
.pwr-spark__band { fill: rgba(165,207,255,.10); }
.pwr-spark__line { stroke: rgba(255,255,255,.9); stroke-width:2; fill:none; }
.pwr-spark__dot--hit { fill:#7ff5a5; }
.pwr-spark__dot--late { fill:#ff9b9b; }
.pwr-spark__axis { stroke: rgba(255,255,255,.08); stroke-width:1; }

.pwr-hyd__corr { display:grid; grid-template-columns: repeat(3,1fr); gap:10px; margin-top:10px; }
.pwr-corr-tile { background: linear-gradient(180deg,#0f1620,#0c1218); border:1px solid #2a3b4e; border-radius:12px; padding:10px; }
.pwr-corr-title { font-size:12px; color:#cfe0f7; }
.pwr-corr-bar { height:8px; background:#0f1318; border:1px solid #1c2530; border-radius:999px; margin-top:6px; overflow:hidden; }
.pwr-corr-bar span { display:block; height:100%; width:0%; background:#ffffff; opacity:.85; transition: width .6s cubic-bezier(.2,.7,0,1); }
.pwr-corr-meta { font-size:12px; color:#9fb0c3; margin-top:4px; }

.pwr-hyd__pod { display:grid; grid-template-columns: 80px 1fr; gap:12px; align-items:center; margin-top:10px; }
.pwr-hyd__podtext { color:#cfe0f7; font-size:13px; }
/* Fallback to ensure mini donut numbers are readable even if class missing */
.pwr-donut--adherence #hyd-adherence-val,
.pwr-donut--pod #hyd-pod-val { color:#e9eef5 !important; font-weight:800 !important; text-shadow:0 1px 2px rgba(0,0,0,.35); }

.tooltip { position:absolute; background:#0b1016; color:#e9eef5; border:1px solid #2a3b4e; padding:6px 8px; border-radius:8px; font-size:12px; pointer-events:none; transform: translate(-50%,-120%); white-space:nowrap; box-shadow:0 8px 24px rgba(0,0,0,.24); }

@media (max-width: 420px){
  .pwr-hyd__top { grid-template-columns: 120px 80px 1fr; }
  .pwr-hyd__corr { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce){
  .pwr-corr-bar span { transition: none; }
}

/* Actions: make button text smaller so three fit */
.pwr-card--hydration .pwr-card__actions { gap:8px; flex-wrap:nowrap; align-items:center; margin-top:16px !important; }
.pwr-card--hydration .pwr-card__actions .btn { font-size:14px !important; padding:6px 10px !important; min-height:36px !important; line-height:1.1 !important; }
.pwr-card--hydration .pwr-card__actions .btn.primary { padding:6px 12px !important; font-weight:800; }
.pwr-card--hydration .impact-pill { font-size:12px !important; padding:2px 10px !important; }

@media (max-width: 480px){
  .pwr-card--hydration .pwr-card__actions .btn,
  .pwr-card--recovery .pwr-card__actions .btn { font-size:13px !important; padding:6px 8px !important; }
  .pwr-card--hydration .impact-pill,
  .pwr-card--recovery .impact-pill { padding:2px 8px !important; }
}

/* ===== Recovery World-Class ===== */
.pwr-card--recovery { margin-top: 12px; }
.pwr-rec__top { display:grid; grid-template-columns: repeat(3,100px); gap:12px; align-items:center; }
.pwr-card--recovery .pwr-donut { width:100px !important; height:100px !important; }
.pwr-card--recovery .pwr-donut__svg { width:100px !important; height:100px !important; position:relative; z-index:1; }
.pwr-card--recovery .pwr-donut__caption { inset:auto !important; left:50% !important; top:50% !important; transform: translate(-50%,-50%) !important; display:flex !important; flex-direction:column; align-items:center; justify-content:center; gap:2px; width:100%; z-index:2; }
.pwr-card--recovery .pwr-donut__value { font-size:18px !important; font-weight:900 !important; color:#e9eef5 !important; }
.pwr-rec__corr { display:grid; grid-template-columns: repeat(3,1fr); gap:10px; margin-top:10px; }
.pwr-rec__details { display:grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap:8px 14px; margin-top:8px; border-top:1px solid #223140; padding-top:10px; }
.pwr-rec__kv { display:flex; gap:8px; align-items:baseline; font-size:13px; color:#cfe0f7; }
.pwr-rec__kv span:first-child { color:#9fb0c3; width:96px; }

.pwr-card--recovery .pwr-card__spark { margin-top: 12px; margin-bottom:10px; position:relative; z-index:3; overflow:visible !important; }
.pwr-card--recovery .pwr-card__spark svg { overflow:visible !important; display:block; width:100% !important; max-width:100% !important; height:72px !important; }
.pwr-card--recovery figure, .pwr-card--recovery svg { overflow: visible !important; }
.pwr-card--recovery .pwr-card__spark { --spark-bleed: 22px; padding-bottom: var(--spark-bleed) !important; min-height: calc(72px + var(--spark-bleed)) !important; margin-bottom: calc(10px + var(--spark-bleed)) !important; }

/* Recovery card header size */
.pwr-card--recovery .pwr-card__title { font-size:25px !important; line-height:1.2 !important; }

/* ===== Breath & Nervous System World-Class ===== */
.pwr-card--breath { margin-top: 12px; }
.pwr-br__top { display:grid; grid-template-columns: repeat(3,100px); gap:12px; align-items:center; }
.pwr-card--breath .pwr-donut { width:100px !important; height:100px !important; }
.pwr-card--breath .pwr-donut__svg { width:100px !important; height:100px !important; position:relative; z-index:1; }
.pwr-card--breath .pwr-donut__caption { inset:auto !important; left:50% !important; top:50% !important; transform: translate(-50%,-50%) !important; display:flex !important; flex-direction:column; align-items:center; justify-content:center; gap:2px; width:100%; z-index:2; }
.pwr-card--breath .pwr-donut__value { font-size:18px !important; font-weight:900 !important; color:#e9eef5 !important; }
.pwr-card--breath .pwr-card__spark { margin-top: 12px; margin-bottom:10px; position:relative; z-index:3; overflow:visible !important; }
.pwr-card--breath .pwr-card__spark svg { overflow:visible !important; display:block; width:100% !important; max-width:100% !important; height:72px !important; }
.pwr-card--breath figure, .pwr-card--breath svg { overflow: visible !important; }
.pwr-card--breath .pwr-card__spark { --spark-bleed: 22px; padding-bottom: var(--spark-bleed) !important; min-height: calc(72px + var(--spark-bleed)) !important; margin-bottom: calc(10px + var(--spark-bleed)) !important; }
.pwr-br__corr { display:grid; grid-template-columns: 1fr; gap:10px; margin-top:10px; }
.pwr-br__details { display:grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap:8px 14px; margin-top:8px; border-top:1px solid #223140; padding-top:10px; }
.pwr-br__pod { display:grid; grid-template-columns: 80px 1fr; gap:24px; align-items:center; margin-top:10px; }
.pwr-card--breath .pwr-hyd__podtext { padding-left:2px; }
.pwr-card--breath .pwr-card__title { font-size:25px !important; line-height:1.2 !important; }

/* Share compact action sizing */
.pwr-card--breath .pwr-card__actions { gap:8px; flex-wrap:nowrap; align-items:center; margin-top:16px !important; }
.pwr-card--breath .pwr-card__actions .btn { font-size:14px !important; padding:6px 10px !important; min-height:36px !important; line-height:1.1 !important; }
.pwr-card--breath .pwr-card__actions .btn.primary { padding:6px 12px !important; font-weight:800; }
.pwr-card--breath .impact-pill { font-size:12px !important; padding:2px 10px !important; }

@media (max-width: 480px){
  .pwr-card--breath .pwr-card__actions .btn { font-size:13px !important; padding:6px 8px !important; }
  .pwr-card--breath .impact-pill { padding:2px 8px !important; }
}

@media (max-width: 420px){
  .pwr-rec__top { grid-template-columns: repeat(3, 1fr); }
  .pwr-rec__corr { grid-template-columns: 1fr; }
}
