/* Tema claro funcional y tema oscuro principal de Neoverso Health. */
/* Tema y tokens Neoverso · Health es el acento índigo de la aplicación. */
:root, :root[data-theme="light"] {
  --bg:#F2F3FF; --surface:#FFFFFF; --line:#CDD1F5; --contour:rgba(79,87,234,.08);
  --fg:#0B1030; --muted:#4F5788; --neo:#2B47D9; --health:#4349D6; --train:#C2410C;
  --glass:rgba(242,243,255,.92);
  --f-display:"Big Shoulders Display","Barlow Condensed","Arial Narrow",sans-serif;
  --f-ui:"Schibsted Grotesk",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:"Spline Sans Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --t-press:140ms; --t-move:300ms; --t-big:460ms;
  --ease-out:cubic-bezier(.2,.8,.2,1); --ease-spring:cubic-bezier(.32,1.25,.6,1);
  --r-card:16px; --r-chip:999px;
  color-scheme:light;
  --danger:#B4232F; --median:#6B3FD0;
  --green-text:#0B7A55; --yellow-text:#7A5300; --red-text:#B4232F;
  --error-bg:#FDE8EC; --error-text:#B4232F;
  --now:#C2410C; --z-green:#0B7A55; --z-yellow:#9A6B00; --z-red:#B4232F;
  --indigo-fill:#4F57EA; --indigo-hi:#4F57EA;
}
:root[data-theme="dark"] {
  --bg:#070A1C; --surface:#0F1636; --line:#252F66; --contour:rgba(124,131,255,.10);
  --fg:#EEF0FF; --muted:#949DD8; --neo:#8A9CFF; --health:#7C83FF; --train:#FF7A45;
  --glass:rgba(11,16,48,.92); color-scheme:dark;
  --danger:#FF6B7F; --median:#C9B5FF;
  --green-text:#2FF2A6; --yellow-text:#FFD34D; --red-text:#FF5C72;
  --error-bg:#3A1830; --error-text:#FF8E9D;
  --now:#FF7A45; --z-green:#2FF2A6; --z-yellow:#FFD34D; --z-red:#FF5C72;
  --indigo-fill:#4F57EA; --indigo-hi:#B6BBFF;
}
@media (prefers-color-scheme: dark) { :root[data-theme="system"] {
  --bg:#070A1C; --surface:#0F1636; --line:#252F66; --contour:rgba(124,131,255,.10);
  --fg:#EEF0FF; --muted:#949DD8; --neo:#8A9CFF; --health:#7C83FF; --train:#FF7A45;
  --glass:rgba(11,16,48,.92); color-scheme:dark;
  --danger:#FF6B7F; --median:#C9B5FF;
  --green-text:#2FF2A6; --yellow-text:#FFD34D; --red-text:#FF5C72;
  --error-bg:#3A1830; --error-text:#FF8E9D;
  --now:#FF7A45; --z-green:#2FF2A6; --z-yellow:#FFD34D; --z-red:#FF5C72;
  --indigo-fill:#4F57EA; --indigo-hi:#B6BBFF;
} }
:root {
  font-family:var(--f-ui); font-synthesis:none; text-rendering:optimizeLegibility;
  --text:var(--fg); --subtle:var(--muted); --border:var(--line);
  --accent:var(--health); --accent-strong:var(--health); --button-text:var(--bg);
  --focus:var(--health); --training:var(--train);
  --surface-hover:color-mix(in srgb,var(--surface) 88%,var(--health));
  --badge-bg:color-mix(in srgb,var(--surface) 88%,var(--health));
  --training-bg:color-mix(in srgb,var(--surface) 88%,var(--train));
  --green-bg:color-mix(in srgb,var(--surface) 88%,var(--health));
  --yellow-bg:color-mix(in srgb,var(--surface) 88%,#F2C878);
  --red-bg:color-mix(in srgb,var(--surface) 88%,var(--danger));
  --shadow:none; --serif:var(--f-display);
}
@media (prefers-reduced-motion:reduce) {
  :root { --t-press:0ms; --t-move:120ms; --t-big:120ms; --ease-spring:linear; }
}
* { box-sizing: border-box; }
html { background: var(--bg); }
body { margin: 0; min-width: 320px; color: var(--text); background:var(--bg); }
a { color: var(--accent); }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.page { max-width: 1120px; margin: 1.4rem auto; padding: 0 1rem; min-height: calc(100vh - 170px); }
h1, h2, p { margin-top: 0; }
h1 { font-size: clamp(2rem, 4vw, 3rem); line-height: 1.05; letter-spacing: -.045em; margin-bottom: .5rem; }
h2 { font-size: 1.15rem; letter-spacing: -.02em; }
.page-heading { display: flex; justify-content: space-between; align-items: end; gap: 1rem; margin-bottom: 1.2rem; }



.eyebrow { text-transform: uppercase; font-size: .72rem; letter-spacing: .1em; font-weight: 700; color: var(--subtle); margin-bottom: .6rem; }
.muted { color: var(--muted); }
.cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; margin: 1.1rem 0; }

.card, .panel, .login-card, .empty-state, .filters {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: 14px; padding: 1.1rem; box-shadow: var(--shadow);
}
.card p:last-child, .panel p:last-child { margin-bottom: 0; }
.metric-card { min-width: 0; padding: .95rem; }
.metric-card .eyebrow { line-height: 1.25; min-height: 1.8em; margin-bottom: .3rem; }
.metric-card .muted { font-size: .85rem; line-height: 1.35; }
.metric { font-size: 2.25rem; font-weight: 750; letter-spacing: -.06em; margin: .3rem 0; line-height: 1.1; }
.metric span { font-size: 1rem; margin-left: .15rem; letter-spacing: 0; }
.metric.empty, .metric-pending { color: var(--subtle); }
.metric-card-pending .metric-pending { font-variant-numeric: tabular-nums; }
.metric-placeholder { font-size: 1.05rem; font-weight: 700; line-height: 1.2; margin: .55rem 0; }
.metric-detail { font-size: .85rem; font-weight: 650; margin: .4rem 0; }
.metric-caveat { font-size: .82rem; color: var(--muted); line-height: 1.35; margin: .6rem 0 0; }
.recovery-label { display: inline-block; border-radius: 999px; padding: .22rem .55rem; font-size: .78rem; font-weight: 700; }
.recovery-green { background: var(--green-bg); color: var(--green-text); }
.recovery-yellow { background: var(--yellow-bg); color: var(--yellow-text); }
.recovery-red { background: var(--red-bg); color: var(--red-text); }
.source-note { color: var(--muted); font-size: .85rem; margin: .65rem 0 1.2rem; }
.section-heading { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.section-heading h2 { margin-bottom: .35rem; }
.panel { margin: 1rem 0; }
.badge { font-size: .75rem; font-weight: 650; border: 1px solid var(--border); border-radius: 99px; color: var(--text); background: var(--badge-bg); padding: .35rem .65rem; white-space: nowrap; }
.entry-list, .exercise-list { padding-left: 1.2rem; }
.entry-list li { margin: .65rem 0; }
.entry-list span { margin-left: .5rem; }
.entry-list time, .workout-card time { display: block; font-size: .8rem; color: var(--muted); margin-top: .2rem; }
.filters { display: flex; align-items: end; gap: .8rem; flex-wrap: wrap; margin: 1rem 0 1.5rem; }
.filters label, .stack label { display: grid; gap: .35rem; font-size: .9rem; font-weight: 600; }
.filters input, .stack input, .classification-form input, .classification-form select {
  font: inherit; padding: .65rem .7rem; border: 1px solid var(--border);
  border-radius: 8px; background: var(--surface); color: var(--text); min-width: 0;
}
.filters button, button, .button { font: inherit; }
.primary, .secondary, .button.secondary, .filters button, .classification-form button {
  display: inline-flex; align-items: center; justify-content: center; min-height: 44px;
  border: 1px solid var(--border); border-radius: 9px; padding: .6rem 1rem;
  background: var(--surface); color: var(--text); text-decoration: none; cursor: pointer;
}
.primary { background: var(--accent); border-color: var(--accent); color: var(--button-text); font-weight: 700; }
.primary:hover { filter: brightness(.9); }
.secondary:hover, .button.secondary:hover, .filters button:hover, .classification-form button:hover { background: var(--surface-hover); }
.workout-card { margin: 1rem 0; }
.exercise-list li { padding: .25rem 0; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; text-align: left; font-variant-numeric: tabular-nums; }
th, td { padding: .75rem .65rem; border-bottom: 1px solid var(--border); vertical-align: top; }
th { font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.notice { border-radius: 9px; padding: .8rem; background: var(--surface-hover); color: var(--text); }
.error { background: var(--error-bg); color: var(--error-text); }
.login-card { max-width: 440px; margin: 4rem auto; padding: 2rem; }
.stack { display: grid; gap: .75rem; }
.stack .primary { margin-top: .5rem; }
.site-footer { max-width: 1120px; margin: 0 auto; padding: 1.3rem 1rem 2rem; color: var(--muted); font-size: .82rem; }
.empty-state { margin: 1rem 0; }
.filters .check-label { display: flex; align-items: center; gap: .5rem; }
.filters input[type="checkbox"] { min-width: 0; width: 1rem; height: 1rem; }
.classification-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); align-items: end; gap: .55rem; min-width: 560px; }
.classification-form label { display: grid; gap: .25rem; font-size: .8rem; }
.classification-form input, .classification-form select { padding: .45rem; }
.classification-form button { min-height: 38px; }
@media (max-width: 680px) {
  .page { margin-top: .9rem; padding-inline: 1.25rem; }
  .site-footer { padding-inline: 1.25rem; }
  .page-heading { align-items: start; flex-direction: column; }

  .metric-card { padding: .7rem; }
  .metric-card .eyebrow { font-size: .64rem; min-height: 1.6em; }
  .metric { font-size: 1.85rem; }
  .metric span { font-size: .82rem; }
  .metric-card .muted { font-size: .85rem; }
  .login-card { margin: 2.5rem auto; padding: 1.4rem; }
  .section-heading { align-items: start; flex-direction: column; }
  .filters label, .filters input { width: 100%; }
  .filters button { width: 100%; }
  .classification-form button { min-height: 44px; }
}
/* Salud uses dated reading rows so long histories stay scannable. */
.health-heading { margin-bottom: .8rem; }
.health-periods { display: flex; align-items: end; justify-content: space-between; gap: 1rem; flex-wrap: wrap; background: var(--surface); border: 1px solid var(--border); border-radius: 14px; padding: .8rem; }
.period-links, .period-custom { display: flex; gap: .45rem; align-items: end; flex-wrap: wrap; }
.period-link { display: inline-flex; align-items: center; min-height: 44px; padding: .65rem .85rem; border-radius: 8px; color: var(--text); text-decoration: none; border: 1px solid var(--border); }
.period-link.selected { background: var(--accent); color: var(--button-text); border-color: var(--accent); font-weight: 700; }
.period-custom label { display: grid; gap: .25rem; color: var(--muted); font-size: .78rem; }
.period-custom input { font: inherit; padding: .55rem; background: var(--surface); color: var(--text); border: 1px solid var(--border); border-radius: 8px; }
.period-custom button { min-height: 44px; padding: .55rem .8rem; background: var(--surface-hover); color: var(--text); border: 1px solid var(--border); border-radius: 8px; cursor: pointer; }
.health-body, .health-section { margin: 1.2rem 0; padding: 1.25rem; background: var(--surface); border: 1px solid var(--border); border-radius: 14px; }
.health-section-head { display: flex; align-items: start; justify-content: space-between; gap: 1.5rem; }
.health-section-head h2 { font-size: 1.45rem; margin: 0 0 .4rem; }
.health-section-head .eyebrow { margin-bottom: .25rem; }
.health-section-head .muted { font-size: .87rem; margin: 0 0 .8rem; }
.health-feature { display: grid; gap: .16rem; min-width: 11rem; text-align: right; }
.health-feature span, .health-feature time { color: var(--muted); font-size: .76rem; }
.health-feature strong { color: var(--accent); font-size: 1.45rem; font-variant-numeric: tabular-nums; }
.body-readings, .coverage-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin: .6rem 0 0; }
.body-readings div, .coverage-list div { border-top: 1px solid var(--border); padding-top: .8rem; }
.body-readings dt, .coverage-list dt { color: var(--muted); font-size: .83rem; }
.body-readings dd, .coverage-list dd { margin: .3rem 0; font-weight: 700; font-size: 1.25rem; font-variant-numeric: tabular-nums; }
.body-readings small { display: block; color: var(--muted); line-height: 1.4; }
.health-timeline { border-top: 1px solid var(--border); }
.health-reading { border-bottom: 1px solid var(--border); }
.health-reading summary { display: grid; grid-template-columns: minmax(8.5rem, 1fr) minmax(7rem, 1fr) minmax(8rem, 1fr) auto; gap: .8rem; align-items: center; cursor: pointer; padding: .88rem .25rem; list-style: none; }
.health-reading summary::-webkit-details-marker { display: none; }
.health-reading summary:hover { background: var(--surface-hover); }
.health-reading summary time { color: var(--muted); font-size: .84rem; font-variant-numeric: tabular-nums; }
.health-reading summary span { color: var(--muted); font-size: .8rem; }
.health-reading summary strong { font-size: 1.05rem; font-variant-numeric: tabular-nums; }
.health-reading summary .detail-action { color: var(--accent); text-align: right; }
.health-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 1rem; margin: 0; padding: .5rem .75rem 1rem; background: var(--bg); border-radius: 8px; }
.health-fields div { display: flex; justify-content: space-between; gap: .8rem; border-bottom: 1px solid var(--border); padding: .45rem 0; font-size: .82rem; }
.health-fields dt { color: var(--muted); }
.health-fields dd { margin: 0; text-align: right; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
@media (max-width: 680px) {
  .health-section-head { display: block; }
  .health-feature { text-align: left; margin-bottom: .8rem; }
  .body-readings, .coverage-list { grid-template-columns: 1fr; gap: .5rem; }
  .health-reading summary { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: .3rem .5rem; }
  .health-reading summary span:nth-child(2) { display: none; }
  .health-reading summary .detail-action { display: none; }
  .health-fields { grid-template-columns: 1fr; padding: .5rem; }
  .period-custom label { flex: 1 1 8rem; }
  .period-custom input { width: 100%; }
}

/* Neo Health: local system fonts, editorial hierarchy and quiet surfaces. */
body { line-height: 1.5; }
h1, h2, h3 { font-family: var(--serif); font-weight: 400; }
h1 { font-size: clamp(2.75rem, 6vw, 5rem); line-height: 1.06; }
h2 { font-size: 1.55rem; }
.eyebrow { font-family:var(--f-ui); font-size: .74rem; letter-spacing: .13em; font-weight: 600; }
.page { max-width: 1480px; margin: 2rem auto; padding: 0 1.5rem; }
.site-footer { max-width: 1480px; padding-inline: 1.5rem; border-top: 1px solid var(--border); }
.card, .panel, .login-card, .empty-state, .filters, .health-body, .health-section, .health-periods { border-radius: 3px; }
.primary, .secondary, .button.secondary, .filters button, input, select, textarea { border-radius: 4px; }






















.privacy-page { max-width: 55rem; margin-inline: auto; }
@media (max-width: 680px) {
  .page { padding-inline: 1.25rem; margin-top: 1.5rem; }








}

/* Full document navigation retains its origin and the two shared bars. */
@view-transition { navigation: auto; }
.topbar { view-transition-name: topbar; }
.tabbar { view-transition-name: tabbar; }
.tab-indicator { view-transition-name: tab-indicator; }
::view-transition-old(root), ::view-transition-new(root) {
  animation-duration: var(--t-move, 300ms);
  animation-timing-function: var(--ease-out, cubic-bezier(.2,.8,.2,1));
}
@media (prefers-reduced-motion: reduce) {
  @view-transition { navigation: none; }
  ::view-transition-old(root), ::view-transition-new(root) { animation: none; }
}

/* Cartografía: opaque reading surfaces, precise type, and restrained motion. */
body {
  color:var(--fg); font:400 16px/1.55 var(--f-ui);
  background:var(--bg);
}
h1,h2,h3,.metric,.health-renpho-value,.health-energy-value,.progress-weeks strong {
  font-family:var(--f-display); font-variant-numeric:tabular-nums;
}

h2,h3 { font-weight:700; }

.card,.panel,.login-card,.empty-state,.filters,.health-body,.health-section,.health-periods,
.health-renpho-overview,.health-energy-now,.health-hero,.health-energy-history,
.health-renpho-card,.progress-series-card,.progress-classification-card,


.metric { font-size:19px; }

/* Metric absence stays 24px/700; page paragraph rules must preserve this scale. */
.metric-empty { margin:.3rem 0 0; color:var(--muted); font:700 24px/1 var(--f-display); font-variant-numeric:tabular-nums; }
.metric-status { margin:.2rem 0 .55rem; color:var(--muted); font:400 14px/1.4 var(--f-ui); }














.source-note,.chip {
  display:inline-flex; max-width:100%; padding:4px 9px; border:1px solid var(--line);
  color:var(--muted); background:var(--surface);
  font:400 11px/1.45 var(--f-mono); letter-spacing:0;
}
.source-note,.chip { align-items:flex-start; gap:6px; border-radius:14px; }
.chip-dot { flex:none; width:5px; height:5px; border-radius:50%; margin-top:.45em; margin-top:calc((1lh - 5px)/2); background:var(--health); }
.chip-text { min-width:0; overflow-wrap:anywhere; }

.metric-card .muted,.health-delta { font:400 14px/1.4 var(--f-ui); color:var(--muted); }
.health-card-date { font:400 11px/1.5 var(--f-mono); }
.primary,.period-link.selected,.health-metric-tabs a.is-selected {
  background:var(--health); border-color:var(--health); color:var(--bg);
}
.secondary,.button.secondary { border-color:var(--line); color:var(--fg); background:var(--surface); }
.recovery-green { background:var(--green-bg); color:var(--green-text); }
.recovery-yellow { background:var(--yellow-bg); color:var(--yellow-text); }
.recovery-red { background:var(--red-bg); color:var(--red-text); }
.page { margin:22px auto; padding:0 20px 28px; }
.login-card { text-align:left; max-width:440px; margin:clamp(35px,7vw,85px) auto; padding:28px; }
.login-brand { display:flex; align-items:center; gap:10px; font:700 28px var(--f-display); margin-bottom:2px; }
.login-brand svg { width:40px; height:40px; }
.login-parent { margin:0 0 25px 50px; color:var(--muted); font:400 11px var(--f-mono); letter-spacing:.06em; text-transform:uppercase; }
.login-card h1 { font-size:40px; }
.login-card input { border-radius:12px; border-color:var(--line); }
.login-card input:focus-visible { outline:2px solid var(--health); outline-offset:2px; }
.period-links { position:relative; display:grid; grid-template-columns:1fr 1fr; padding:3px; border:1px solid var(--line); border-radius:12px; background:var(--surface); }
.period-link { position:relative; z-index:1; justify-content:center; border:0; border-radius:9px; min-width:74px; color:var(--muted); }
.period-link.selected { background:transparent; color:var(--fg); border-color:transparent; }
.period-pill { position:absolute; inset:3px auto 3px 3px; width:calc(50% - 3px); border:1px solid var(--line); border-radius:9px; background:var(--bg); view-transition-name:seg-pill; transition:transform var(--t-move) var(--ease-spring); }
.period-links.period-30 .period-pill { transform:translateX(100%); }
.health-feature strong { color:var(--health); }
:focus-visible { outline:2px solid var(--health); outline-offset:3px; }

@supports (animation-timeline:scroll()) {
  .page h1 { transform-origin:left bottom; animation:fold-title linear both; animation-timeline:scroll(root block); animation-range:0px 70px; }
  .compact-title { display:block; opacity:0; transform:translateY(6px); animation:show-compact linear both; animation-timeline:scroll(root block); animation-range:0px 70px; }
}
@keyframes fold-title { to { transform:scale(.75); opacity:0; } }
@keyframes show-compact { to { transform:none; opacity:1; } }
.tabbar,.more-sheet { display:none; }
@media (max-width:767px) {
  .page { padding:0 16px calc(108px + env(safe-area-inset-bottom)); margin-top:16px; }







  .tabbar {
    display:grid; grid-template-columns:repeat(5,minmax(0,1fr));
    position:fixed; z-index:30; left:10px; right:10px;
    bottom:calc(12px + env(safe-area-inset-bottom));
    padding:7px 4px; border:1px solid var(--line); border-radius:22px;
    background:var(--glass);

  }
  .tabbar a,.tabbar button { display:grid; justify-items:center; align-content:center; gap:3px; position:relative; z-index:1; min-width:0; min-height:50px; border:0; background:none; color:var(--muted); text-decoration:none; cursor:pointer; font:500 9.5px var(--f-ui); }
  .tabbar a[aria-current="page"],.tabbar button[aria-current="page"] { color:var(--health); font-weight:600; }
  .tabbar svg { width:20px; height:20px; }
  .tabbar a:active,.tabbar button:active { transform:scale(.92); }
  .tab-indicator { position:absolute; top:6px; bottom:6px; left:4px; width:calc((100% - 8px)/5); border-radius:15px; background:color-mix(in srgb,var(--health) 14%,transparent); transition:transform var(--t-move) var(--ease-spring); }
  .tabbar[data-tab-index="1"] .tab-indicator { transform:translateX(100%); }
  .tabbar[data-tab-index="2"] .tab-indicator { transform:translateX(200%); }
  .tabbar[data-tab-index="3"] .tab-indicator { transform:translateX(300%); }
  .tabbar[data-tab-index="4"] .tab-indicator { transform:translateX(400%); }
  .more-sheet { width:100%; max-width:none; margin:0; inset:auto 0 0; padding:12px 16px calc(22px + env(safe-area-inset-bottom)); border:1px solid var(--line); border-radius:24px 24px 0 0; background:var(--surface); color:var(--fg); opacity:0; transform:translateY(105%); transition:transform var(--t-big) var(--ease-spring),opacity var(--t-move) var(--ease-out),display var(--t-big) allow-discrete,overlay var(--t-big) allow-discrete; }
  .more-sheet:popover-open { display:grid; gap:6px; opacity:1; transform:none; }
  @starting-style { .more-sheet:popover-open { opacity:0; transform:translateY(105%); } }
  .more-sheet::backdrop { background:rgba(0,0,0,.38); }
  .sheet-grab { width:36px; height:4px; background:var(--line); border-radius:4px; justify-self:center; }
  .more-sheet > a { display:flex; align-items:center; gap:12px; min-height:50px; padding:10px; border-bottom:1px solid var(--line); color:var(--fg); text-decoration:none; }
  .more-sheet svg { width:20px; height:20px; }
  .sheet-theme { display:flex; flex-wrap:wrap; gap:4px; min-height:50px; padding:8px 10px; }
  .sheet-theme > span { margin-right:auto; }
  .site-footer { padding-bottom:calc(100px + env(safe-area-inset-bottom)); }
}
@supports not selector(:popover-open) { @media(max-width:767px) { .more-sheet { display:block; position:static; width:auto; margin:10px; opacity:1; transform:none; } } }
@media (prefers-reduced-motion:reduce) {
  .page h1 { animation:none; transform:none; }
  .period-pill,.tab-indicator { transition:opacity 120ms linear; }
  .more-sheet { transition:opacity 120ms linear,display 120ms allow-discrete,overlay 120ms allow-discrete; transform:none; }
  .more-sheet:popover-open { transform:none; }

}

/* The recovery figure leads; secondary readings close the desktop column. */















.health-periods { justify-content:flex-start; background:none; border:0; padding:0; }
.body-readings dd .metric-empty { display:block; color:var(--muted); font:700 24px/1 var(--f-display); }
.body-readings dd small,.body-readings dd .metric-status { display:block; margin:0; color:var(--muted); font:400 .8333rem/1.4 var(--f-ui); }








.metric-caveat summary { cursor:pointer; }
.metric-caveat p { margin:.4rem 0 0; }
@media (min-width:1000px) {



}

.sheet-theme { display:grid; width:100%; gap:10px; }
.sheet-theme .sheet-theme-label { display:flex; align-items:center; gap:12px; margin:0; color:var(--fg); font:400 16px/1.55 var(--f-ui); }
.sheet-theme-options { display:flex; width:100%; padding:3px; border:1px solid var(--line); border-radius:12px; }
.sheet-theme-options .theme-choice { flex:1; min-height:44px; }
.sheet-theme-options .theme-choice[aria-pressed="true"] { background:var(--bg); border-color:var(--line); }

/* Carcasa Neoverso compartida. */
:root { --button-text:#F2F3FF; }
:root[data-theme="dark"] { --button-text:#070A1C; }
@media (prefers-color-scheme:dark) { :root[data-theme="system"] { --button-text:#070A1C; } }
body { color:var(--fg); font:400 16px/1.5 var(--f-ui); background:var(--bg); }
.icon-sprite { position:absolute; width:0; height:0; overflow:hidden; }
.i { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; flex:none; }
.topbar {
  position:sticky; top:0; z-index:20; display:grid; align-items:center;
  grid-template-columns:1fr auto 1fr; gap:16px; min-height:64px;
  padding:10px max(20px,calc((100% - 1480px)/2));
  color:var(--fg); background:var(--surface); border-bottom:1px solid var(--line);
}
.brand { display:flex; align-items:center; gap:10px; color:var(--fg); text-decoration:none; white-space:nowrap; }
.brand-mark { width:30px; height:30px; flex:none; fill:none; stroke:var(--indigo-hi); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.brand-name { font:800 22px/1 var(--f-display); letter-spacing:.06em; }
.brand-sep { width:1px; height:18px; background:var(--line); }
.brand-sub { color:var(--muted); font:500 14px/1 var(--f-ui); }
.desktop-nav { grid-column:2; display:flex; justify-content:center; gap:clamp(4px,1vw,16px); min-width:0; overflow-x:auto; scrollbar-width:none; }
.desktop-nav a { position:relative; padding:12px 8px; color:var(--muted); text-decoration:none; white-space:nowrap; font:500 14px/1.2 var(--f-ui); }
.desktop-nav a:hover,.desktop-nav a[aria-current="page"] { color:var(--fg); }
.desktop-nav a[aria-current="page"]::after { position:absolute; content:""; bottom:1px; left:8px; right:8px; height:2px; background:var(--indigo-hi); border-radius:2px; }
.theme-control { display:inline-flex; align-items:center; gap:3px; color:var(--muted); }
.desktop-theme { flex:none; padding:3px; border:1px solid var(--line); border-radius:999px; background:var(--surface); }
.desktop-theme { grid-column:3; grid-row:1; justify-self:end; margin-right:58px; }
.theme-choice,.icon-button { display:grid; place-items:center; width:44px; height:44px; min-width:0; min-height:0; aspect-ratio:1; padding:0; border:0; border-radius:50%; color:var(--muted); background:transparent; cursor:pointer; }
.theme-choice:hover,.icon-button:hover { color:var(--fg); }
.theme-choice[aria-pressed="true"] { color:#fff; background:var(--indigo-fill); }
.logout-form { grid-column:3; grid-row:1; justify-self:end; margin:0; }
.icon-button { border:1px solid var(--line); }
.compact-title { display:none; font:700 15px var(--f-display); }
.page { max-width:1480px; margin:22px auto; padding:0 20px 28px; }
.site-footer { max-width:1480px; margin:0 auto; padding:20px; border-top:1px solid var(--line); color:var(--muted); font:400 12px/1.5 var(--f-mono); }
.card,.panel,.login-card,.empty-state,.filters,.health-body,.health-section,.health-periods { border-radius:var(--r-card); box-shadow:none; }
.primary,.period-link.selected,.health-metric-tabs a.is-selected { background:var(--health); border-color:var(--health); color:var(--button-text); }
:focus-visible { outline:2px solid var(--indigo-hi); outline-offset:3px; }
.tabbar,.more-sheet { display:none; }
.tabbar { view-transition-name:tabbar; }
.tab-indicator { view-transition-name:tab-indicator; }
::view-transition-group(tabbar) { animation:none; }
::view-transition-old(tabbar) { display:none; }
::view-transition-new(tabbar) { animation:none; }
@media (min-width:768px) and (max-width:1099px) {
  .desktop-nav { gap:2px; }
  .desktop-nav a { font-size:13px; padding-inline:6px; }
}
@media (min-width:768px) and (max-width:959px) {
  .topbar { grid-template-columns:1fr auto auto; grid-template-rows:auto auto; row-gap:4px; }
  .brand { grid-column:1; grid-row:1; }
  .desktop-theme { grid-column:2; grid-row:1; justify-self:end; margin-right:0; }
  .logout-form { grid-column:3; grid-row:1; }
  .desktop-nav { grid-column:1 / -1; grid-row:2; justify-self:stretch; justify-content:center; width:100%; overflow:visible; }
}
@media (max-width:767px) {
  .topbar { display:flex; min-height:58px; padding:8px 16px; gap:8px; }
  .brand-mark { width:26px; height:26px; }
  .brand-name { font-size:19px; }
  .brand-sub { font-size:13px; }
  .desktop-nav,.desktop-theme { display:none; }
  .compact-title { display:block; margin:auto; color:var(--fg); font:700 15px/1 var(--f-display); }
  .logout-form { margin-left:0; }
  .page { padding:0 16px calc(108px + env(safe-area-inset-bottom)); margin-top:16px; }
  .tabbar {
    display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:2px;
    position:fixed; z-index:30; left:12px; right:12px;
    bottom:calc(10px + env(safe-area-inset-bottom)); padding:6px;
    border:1px solid var(--line); border-radius:20px; background:var(--surface);
  }
  .tabbar a,.tabbar button { display:grid; justify-items:center; align-content:center; gap:3px; position:relative; z-index:1; min-width:0; min-height:50px; border:0; border-radius:14px; background:none; color:var(--muted); text-decoration:none; cursor:pointer; font:500 12px/1 var(--f-ui); }
  .tabbar a[aria-current="page"],.tabbar button[aria-current="page"] { color:#fff; background:var(--indigo-fill); }
  .tabbar svg { width:20px; height:20px; }
  .more-sheet { width:100%; max-width:none; margin:0; inset:auto 0 0; padding:12px 16px calc(22px + env(safe-area-inset-bottom)); border:1px solid var(--line); border-radius:24px 24px 0 0; background:var(--surface); color:var(--fg); }
  .more-sheet:popover-open { display:grid; gap:6px; }
  .more-sheet::backdrop { background:rgba(0,0,0,.38); }
  .sheet-grab { width:36px; height:4px; background:var(--line); border-radius:4px; justify-self:center; }
  .more-sheet > a { display:flex; align-items:center; min-height:50px; padding:10px; border-bottom:1px solid var(--line); color:var(--fg); text-decoration:none; }
  .sheet-theme { display:flex; justify-content:center; gap:8px; padding:8px; }
  .sheet-theme .theme-choice { width:48px; height:48px; min-height:0; border:1px solid var(--line); }
  .site-footer { padding-bottom:calc(100px + env(safe-area-inset-bottom)); }
}
@supports not selector(:popover-open) { @media(max-width:767px) { .more-sheet { display:block; position:static; width:auto; margin:10px; } } }
@media (prefers-reduced-motion:reduce) {
  @view-transition { navigation:none; }
  ::view-transition-old(root),::view-transition-new(root) { animation:none; }
  a:active,button:active,summary:active { transform:none; }
  .compact-title { animation:none; transform:none; }
}
body.is-hoy { overflow-x:clip; }
body.is-hoy .topbar { position:fixed; left:0; right:0; top:0; background:var(--bg); border-bottom:1px solid var(--line); }
body.is-hoy .site-footer { display:none; }
body.is-hoy .page { max-width:none; margin:0; padding:0; }
@media (hover:hover) and (pointer:fine) and (min-width:768px) {
  html:has(body.is-hoy) { scroll-snap-type:y proximity; }
}