/* Receta360 app visual layer. Kept in the theme so UI changes do not require plugin edits. */
body:has(.r360-app-shell) {
  background: #f8fbff;
  overflow-x: hidden;
}

body:has(.r360-app-shell) .r360-site-header,
body:has(.r360-app-shell) .r360-site-footer {
  display: none;
}

body:has(.r360-app-shell) .r360-site-main {
  min-height: 100vh;
}

.r360-app-sidebar__brand > img {
  display: block;
  width: 64px;
  height: 64px;
  object-fit: contain;
  object-position: center;
  mix-blend-mode: normal;
}

.r360-app-topbar__brand > img {
  display: block;
  width: 156px;
  height: 44px;
  object-fit: contain;
  object-position: left center;
  mix-blend-mode: multiply;
}

.r360-ajax-toast {
  position: fixed;
  z-index: 200;
  top: 1rem;
  left: 50%;
  width: min(430px, calc(100% - 2rem));
  padding: 0.95rem 1.2rem;
  border-radius: 14px;
  color: #fff;
  background: #187a45;
  box-shadow: 0 18px 48px rgba(17, 73, 43, 0.28);
  font-weight: 750;
  text-align: center;
  transform: translate(-50%, -150%);
  opacity: 0;
  transition: transform 180ms ease, opacity 180ms ease;
}

.r360-ajax-toast.is-visible { transform: translate(-50%, 0); opacity: 1; }
.r360-ajax-toast.is-error { background: #c8404b; }

.r360-nutrition-metric--over { border-color: rgba(212, 61, 72, 0.38); background: #fff5f5; }
.r360-nutrition-metric--over > svg,
.r360-nutrition-metric--over strong,
.r360-nutrition-metric--over em { color: #d33f4b; }
.r360-nutrition-metric--over i { background: #ffd9dc; }
.r360-nutrition-metric--over i b { width: 100% !important; background: linear-gradient(90deg, #ee5a62, #c82e3c); }

.r360-plan-video-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.3rem;
  min-height: 32px;
  padding: 0.35rem 0.56rem;
  border: 1px solid #bdddfb;
  border-radius: 8px;
  color: #0d5eac;
  background: #f4faff;
  font: inherit;
  font-size: 0.72rem;
  font-weight: 800;
  cursor: pointer;
}
.r360-plan-video-button svg { width: 16px; height: 16px; }
.r360-plan-video-button:hover { border-color: #1878d4; background: #e8f4ff; }

.r360-video-modal {
  width: min(780px, calc(100% - 2rem));
  padding: 0;
  border: 0;
  border-radius: 18px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 28px 90px rgba(5, 39, 83, 0.35);
}
.r360-video-modal::backdrop { background: rgba(5, 23, 49, 0.7); backdrop-filter: blur(4px); }
.r360-video-modal__shell > header { display: flex; align-items: center; justify-content: space-between; padding: 1rem 1.25rem; color: #173d72; }
.r360-video-modal__shell > header button { width: 34px; height: 34px; border: 0; border-radius: 50%; color: #355574; background: #edf4fa; font-size: 1.45rem; line-height: 1; cursor: pointer; }
.r360-video-modal__frame { aspect-ratio: 16 / 9; background: #071c36; }
.r360-video-modal iframe { display: block; width: 100%; height: 100%; border: 0; }

.r360-meal-photo-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.75rem;
  padding: 1rem;
  border: 1px solid #cfe5fb;
  border-radius: 14px;
  background: linear-gradient(135deg, #edf8ff, #f7fcff);
}
.r360-meal-photo-card > div:first-child { display: grid; grid-template-columns: 34px minmax(0, 1fr); column-gap: 0.6rem; }
.r360-meal-photo-card > div:first-child > span { grid-row: span 2; display: grid; width: 34px; height: 34px; place-items: center; border-radius: 10px; color: #fff; background: #1976ce; }
.r360-meal-photo-card strong { color: #164a80; font-size: 0.86rem; }
.r360-meal-photo-card small { color: #57728f; font-size: 0.75rem; line-height: 1.35; }
.r360-meal-photo-card__input input { position: absolute; inline-size: 1px; block-size: 1px; opacity: 0; }
.r360-meal-photo-card__input span,
.r360-meal-photo-card__analyze { display: inline-flex; align-items: center; justify-content: center; gap: 0.35rem; min-height: 38px; padding: 0.5rem 0.7rem; border: 1px solid #98c8ee; border-radius: 9px; color: #1468b9; background: #fff; font: inherit; font-size: 0.76rem; font-weight: 800; cursor: pointer; }
.r360-meal-photo-card__analyze { border-color: #176dbd; color: #fff; background: #176dbd; }
.r360-meal-photo-card__analyze:disabled { cursor: not-allowed; opacity: 0.5; }
.r360-meal-photo-card__preview { grid-column: 1 / -1; max-height: 160px; overflow: hidden; border-radius: 10px; }
.r360-meal-photo-card__preview img { display: block; width: 100%; max-height: 160px; object-fit: cover; }

.r360-ai-loader { position: fixed; z-index: 300; inset: 0; display: grid; place-items: center; padding: 1rem; background: rgba(3, 30, 63, 0.72); backdrop-filter: blur(8px); }
.r360-ai-loader[hidden] { display: none !important; }
.r360-ai-loader__card { display: grid; justify-items: center; width: min(360px, 100%); gap: 0.8rem; padding: 2rem; border: 1px solid rgba(255,255,255,.55); border-radius: 22px; color: #fff; background: linear-gradient(150deg, #126bc1, #174782); box-shadow: 0 28px 80px rgba(0,0,0,.32); text-align: center; }
.r360-ai-loader__orb { width: 58px; height: 58px; border: 5px solid rgba(255,255,255,.25); border-top-color: #9ce369; border-radius: 50%; animation: r360-spin 850ms linear infinite; }
.r360-ai-loader__card strong { font-size: 1.12rem; }.r360-ai-loader__card p { margin: 0.3rem 0 0; color: rgba(255,255,255,.8); font-size: .86rem; line-height: 1.45; }.r360-ai-loader__card small { color: #bde6ff; }
@keyframes r360-spin { to { transform: rotate(360deg); } }

.r360-account-page { max-width: 1120px; margin: 0 auto; padding: clamp(1.2rem, 3vw, 2.5rem); }
.r360-account-page__head { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.35rem; }.r360-account-page__head > span { display: grid; width: 54px; height: 54px; place-items: center; border-radius: 16px; color: #fff; background: linear-gradient(135deg, #1d7bd1, #154781); }.r360-account-page__head svg { width: 28px; height: 28px; }.r360-account-page__head p { margin: 0; color: #5980a3; font-size: .76rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }.r360-account-page__head h1 { margin: .16rem 0; color: #153d6f; font-size: clamp(1.55rem, 3vw, 2.2rem); }.r360-account-page__head small { color: #73869b; }
.r360-account-layout { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(280px, .8fr); gap: 1.15rem; }.r360-account-card { padding: 1.35rem; border: 1px solid #dce9f4; border-radius: 18px; background: #fff; box-shadow: 0 12px 34px rgba(31, 76, 122, .07); }.r360-account-card > header { display: flex; justify-content: space-between; gap: 1rem; margin-bottom: 1.15rem; }.r360-account-card h2 { margin: 0; color: #173d72; font-size: 1.12rem; }.r360-account-card p { margin: .35rem 0 0; color: #708499; font-size: .84rem; line-height: 1.4; }.r360-account-card > header > span { color: #2478ca; }.r360-account-card--password { align-self: start; }.r360-account-card--dui { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 1rem; max-width: 760px; }.r360-account-card__icon { display: grid; width: 48px; height: 48px; place-items: center; border-radius: 14px; color: #187144; background: #e6f7ed; }
.r360-account-form { display: grid; gap: .85rem; }.r360-account-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: .85rem; }.r360-account-form label { display: grid; gap: .38rem; color: #315b82; font-size: .76rem; font-weight: 800; }.r360-account-form input,.r360-account-form textarea { width: 100%; padding: .72rem .78rem; border: 1px solid #cbddea; border-radius: 9px; color: #173d72; background: #fff; font: inherit; font-size: .88rem; }.r360-account-form input[readonly] { color: #7a8b9b; background: #f5f8fb; cursor: not-allowed; }.r360-account-form__wide { grid-column: 1 / -1; }.r360-account-form button { justify-self: start; padding: .72rem 1rem; border: 0; border-radius: 9px; color: #fff; background: #1b70c5; font: inherit; font-size: .84rem; font-weight: 800; cursor: pointer; }.r360-account-form button:hover { background: #125da8; }

@media (max-width: 760px) { .r360-app-topbar__brand > img { width: 132px; } .r360-plan-video-button span { display: none; } .r360-meal-photo-card { grid-template-columns: 1fr; } .r360-account-layout, .r360-account-form__grid { grid-template-columns: 1fr; } .r360-account-card--dui { grid-template-columns: 1fr; } }

.r360-app {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 48%, #f4faf6 100%);
}

.r360-app-shell {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  min-height: 100vh;
}

.r360-app-sidebar {
  position: sticky;
  top: 0;
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 1.5rem;
  height: 100vh;
  padding: 1.9rem 0.7rem 1rem;
  color: #ffffff;
  background:
    linear-gradient(180deg, rgba(0, 56, 116, 0.96), rgba(0, 77, 145, 0.98)),
    #003f80;
  box-shadow: 10px 0 34px rgba(8, 46, 94, 0.16);
}

.r360-app-sidebar__brand,
.r360-app-sidebar__nav a,
.r360-app-icon-button,
.r360-app-profile-menu,
.r360-home-card__arrow {
  display: grid;
  place-items: center;
}

.r360-app-sidebar__brand {
  width: 58px;
  height: 58px;
  margin: 0 auto;
  border-radius: 8px;
  color: #ffffff;
  text-decoration: none;
}

.r360-app-sidebar__brand > img {
  width: 58px;
  height: 58px;
}

.r360-app-sidebar__brand span,
.r360-app-topbar__brand > span {
  position: relative;
  width: 42px;
  height: 42px;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 16px 32px rgba(0, 34, 87, 0.18);
}

.r360-app-sidebar__brand span::before,
.r360-app-topbar__brand > span::before {
  position: absolute;
  inset: 8px 17px;
  content: "";
  border-radius: 4px;
  background: #1f6fcb;
  box-shadow: 0 0 0 999px transparent;
}

.r360-app-sidebar__brand span::after,
.r360-app-topbar__brand > span::after {
  position: absolute;
  left: 8px;
  top: 17px;
  width: 26px;
  height: 10px;
  content: "";
  border-radius: 4px;
  background: #1f6fcb;
  box-shadow: 9px -10px 0 -3px #52ba55;
}

.r360-app-sidebar__nav {
  display: grid;
  align-content: start;
  gap: 0.45rem;
  min-width: 0;
}

.r360-app-sidebar__nav a {
  position: relative;
  gap: 0.35rem;
  min-height: 78px;
  padding: 0.5rem 0.35rem;
  border: 1px solid transparent;
  border-radius: 8px;
  color: rgba(255, 255, 255, 0.92);
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.1;
  text-align: center;
  text-decoration: none;
  transition: background 180ms ease, color 180ms ease, transform 180ms ease, border-color 180ms ease;
}

.r360-app-sidebar__nav a:hover,
.r360-app-sidebar__nav a:focus-visible,
.r360-app-sidebar__nav a.is-active {
  color: #ffffff;
  background: linear-gradient(135deg, #2176f0, #5a92ff);
  border-color: rgba(255, 255, 255, 0.22);
  outline: none;
  transform: translateY(-1px);
}

.r360-app-sidebar__nav svg {
  width: 25px;
  height: 25px;
  stroke-width: 1.9;
}

.r360-app-sidebar__nav em {
  position: absolute;
  right: 13px;
  top: 12px;
  display: grid;
  min-width: 22px;
  height: 22px;
  place-items: center;
  border-radius: 50%;
  color: #ffffff;
  background: #57bf55;
  font-size: 0.74rem;
  font-style: normal;
  font-weight: 900;
}

.r360-app-sidebar__nav--secondary {
  padding-top: 1rem;
  border-top: 1px solid rgba(255, 255, 255, 0.14);
}

.r360-app-main {
  display: grid;
  align-content: start;
  gap: 1.55rem;
  min-width: 0;
  padding: clamp(1.3rem, 3vw, 2.3rem) clamp(1rem, 3.7vw, 3.4rem);
}

.r360-app-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.85rem 1.25rem;
  margin-top: 0.45rem;
  padding: 1rem 0 0.1rem;
  border-top: 1px solid #dce8f1;
}

.r360-app-footer > small {
  color: #8495a7;
  font-size: 0.72rem;
}

.r360-app-footer .r360-partner-logo--minsal {
  width: 106px;
  height: 48px;
}

.r360-app-footer .r360-partner-logo--ihes-wrap {
  width: 106px;
  height: 56px;
}

.r360-app-footer .r360-partner-logo--ihes {
  width: 106px;
  transform: translateY(-18px);
}

.r360-app-topbar {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: clamp(1rem, 3vw, 2.2rem);
  align-items: center;
}

.r360-app-topbar__brand {
  display: inline-flex;
  align-items: center;
  gap: 0.85rem;
  color: var(--r360-blue-deep);
  font-size: 1.9rem;
  font-weight: 900;
  line-height: 1;
  text-decoration: none;
}

.r360-app-topbar__brand > span {
  width: 38px;
  height: 38px;
  box-shadow: 0 10px 24px rgba(39, 93, 168, 0.14);
}

.r360-app-topbar__brand strong {
  font-weight: 900;
}

.r360-app-topbar__brand strong span {
  color: #52ba55;
}

.r360-app-icon-button,
.r360-app-profile-menu {
  border: 0;
  color: #1c5fb7;
  background: transparent;
  cursor: pointer;
}

.r360-app-icon-button svg,
.r360-app-profile-menu svg {
  width: 24px;
  height: 24px;
  stroke-width: 2;
}

.r360-app-topbar__actions {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: end;
  gap: 0.9rem;
  min-width: 0;
  justify-self: end;
}

.r360-app-icon-button {
  position: relative;
  width: 42px;
  height: 42px;
  border-radius: 50%;
}

.r360-app-icon-button:hover,
.r360-app-icon-button:focus-visible,
.r360-app-profile-menu:hover,
.r360-app-profile-menu:focus-visible {
  background: rgba(39, 93, 168, 0.08);
  outline: none;
}

.r360-app-icon-button span {
  position: absolute;
  right: 0;
  top: 0;
  display: grid;
  min-width: 20px;
  height: 20px;
  place-items: center;
  border: 2px solid #ffffff;
  border-radius: 50%;
  color: #ffffff;
  background: #57bf55;
  font-size: 0.68rem;
  font-weight: 900;
}

.r360-app-topbar__divider {
  width: 1px;
  height: 38px;
  background: rgba(39, 93, 168, 0.14);
}

.r360-app-avatar {
  width: 48px;
  height: 48px;
  border: 2px solid #ffffff;
  border-radius: 50%;
  box-shadow: 0 10px 24px rgba(24, 48, 77, 0.13);
}

.r360-app-profile-trigger,
.r360-app-profile-summary {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  min-width: 0;
  padding: 0.22rem;
  border: 0;
  border-radius: 28px;
  color: inherit;
  background: transparent;
  font: inherit;
  text-align: left;
}

.r360-app-profile-trigger {
  cursor: pointer;
}

.r360-app-profile-summary {
  cursor: default;
}

.r360-app-profile-trigger:hover,
.r360-app-profile-trigger:focus-visible {
  background: rgba(39, 93, 168, 0.08);
  outline: none;
}

.r360-app-logout-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  gap: 0.42rem;
  min-height: 42px;
  padding: 0.58rem 0.76rem;
  border: 1px solid rgba(178, 55, 66, 0.18);
  border-radius: 8px;
  color: #b23742;
  background: #fff7f8;
  font-size: 0.84rem;
  font-weight: 850;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
}

.r360-app-logout-link:hover,
.r360-app-logout-link:focus-visible {
  border-color: rgba(178, 55, 66, 0.38);
  background: #fff0f2;
  outline: none;
}

.r360-app-logout-link svg {
  width: 18px;
  height: 18px;
  stroke-width: 2.1;
}

.r360-app-profile {
  display: grid;
  gap: 0.18rem;
  min-width: 0;
}

.r360-app-profile strong {
  color: var(--r360-blue-deep);
  font-size: 1rem;
  font-weight: 900;
  line-height: 1.1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.r360-app-profile small {
  color: #4e70a6;
  font-size: 0.86rem;
  font-weight: 700;
}

.r360-app-profile-menu {
  width: 34px;
  height: 34px;
  border-radius: 50%;
}

.r360-app-profile-dropdown {
  position: absolute;
  z-index: 30;
  right: 0;
  top: calc(100% + 0.75rem);
  min-width: 168px;
  padding: 0.4rem;
  border: 1px solid rgba(39, 93, 168, 0.14);
  border-radius: 11px;
  background: #ffffff;
  box-shadow: 0 16px 36px rgba(21, 61, 108, 0.16);
}

.r360-app-profile-dropdown a {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.7rem 0.78rem;
  border-radius: 8px;
  color: #b23742;
  font-size: 0.84rem;
  font-weight: 800;
  text-decoration: none;
}

.r360-app-profile-dropdown a:hover { background: #fff2f3; }
.r360-app-profile-dropdown svg { width: 18px; height: 18px; }

.r360-home {
  display: grid;
  gap: 1.25rem;
}

.r360-home-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 440px);
  gap: clamp(1rem, 3vw, 2rem);
  align-items: center;
}

.r360-home-welcome h1 {
  margin: 0;
  color: #0b3974;
  font-size: 3.2rem;
  font-weight: 930;
  line-height: 1.02;
  overflow-wrap: anywhere;
}

.r360-home-welcome p {
  max-width: 560px;
  margin: 0.6rem 0 0;
  color: #4c6596;
  font-size: 1.05rem;
  font-weight: 650;
  line-height: 1.55;
}

.r360-home-wellness {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 136px;
  gap: 1rem;
  align-items: center;
  min-height: 140px;
  padding: 1.2rem 1.35rem;
  overflow: hidden;
  border-radius: 8px;
  color: #ffffff;
  background:
    linear-gradient(135deg, rgba(18, 103, 229, 0.98), rgba(100, 190, 230, 0.95)),
    #2389df;
  box-shadow: 0 24px 48px rgba(27, 111, 208, 0.22);
}

.r360-home-wellness strong,
.r360-home-wellness span {
  display: block;
}

.r360-home-wellness > div {
  min-width: 0;
}

.r360-home-wellness strong {
  font-size: 1.1rem;
  font-weight: 900;
}

.r360-home-wellness span {
  margin-top: 0.7rem;
  color: rgba(255, 255, 255, 0.92);
  font-size: 0.96rem;
  font-weight: 650;
  line-height: 1.55;
}

.r360-home-wellness svg {
  width: 136px;
  height: 90px;
  opacity: 0.95;
  stroke: #ffffff;
  stroke-width: 5;
}

.r360-home-summary {
  display: grid;
  grid-template-columns: 1fr 1fr 1.05fr;
  overflow: hidden;
  border: 1px solid rgba(39, 93, 168, 0.15);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 18px 42px rgba(24, 48, 77, 0.07);
}

.r360-home-summary__item {
  display: grid;
  grid-template-columns: 74px minmax(0, 1fr) 26px;
  gap: 1rem;
  align-items: center;
  min-height: 108px;
  padding: 1rem 1.2rem;
  color: var(--r360-blue-deep);
  text-decoration: none;
}

.r360-home-summary__item + .r360-home-summary__item {
  border-left: 1px solid rgba(39, 93, 168, 0.12);
}

.r360-home-summary__item > svg,
.r360-home-card__arrow svg,
.r360-home-protection a svg {
  width: 22px;
  height: 22px;
}

.r360-home-summary__icon {
  display: grid;
  width: 62px;
  height: 62px;
  place-items: center;
  border: 1px solid rgba(39, 93, 168, 0.13);
  border-radius: 50%;
}

.r360-home-summary__icon svg {
  width: 32px;
  height: 32px;
}

.r360-home-summary__icon--blue {
  color: #176ee8;
  background: #eef6ff;
}

.r360-home-summary__icon--green {
  color: #17763f;
  background: #eff9ef;
}

.r360-home-summary__icon--shield {
  color: #176ee8;
  background: #f1f7ff;
}

.r360-home-summary__item strong,
.r360-home-summary__item small,
.r360-home-summary__item em {
  display: block;
}

.r360-home-summary__item strong {
  color: #103f83;
  font-size: 0.9rem;
  font-weight: 900;
}

.r360-home-summary__item small {
  margin-top: 0.45rem;
  color: #233a63;
  font-size: 0.92rem;
  font-weight: 760;
  line-height: 1.25;
}

.r360-home-summary__item em {
  margin-top: 0.35rem;
  color: #10843c;
  font-size: 0.84rem;
  font-style: normal;
  font-weight: 850;
}

.r360-home-summary__progress {
  grid-template-columns: 74px minmax(0, 1fr);
}

.r360-home-summary__progress em {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.8rem;
  align-items: center;
  color: #176ee8;
}

.r360-progress-bar {
  display: block;
  height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: #dfeced;
}

.r360-progress-bar span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #59bd63;
}

.r360-home-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.15rem;
}

.r360-home-card {
  position: relative;
  display: grid;
  grid-template-rows: auto 1fr;
  min-height: 0;
  overflow: hidden;
  border: 1px solid rgba(39, 93, 168, 0.13);
  border-radius: 8px;
  color: var(--r360-blue-deep);
  background: #ffffff;
  box-shadow: 0 18px 42px rgba(24, 48, 77, 0.07);
  text-decoration: none;
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.r360-home-card:hover,
.r360-home-card:focus-visible {
  border-color: rgba(31, 111, 203, 0.32);
  box-shadow: 0 22px 54px rgba(24, 48, 77, 0.12);
  outline: none;
  transform: translateY(-3px);
}

.r360-home-card__art {
  display: grid;
  place-items: center;
  width: 100%;
  min-height: 0;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #f7fbff;
}

.r360-home-card--recetas .r360-home-card__art {
  background: #f7fff8;
}

.r360-home-card--nutricion .r360-home-card__art {
  background: #fbfff5;
}

.r360-home-card--ejercicio .r360-home-card__art {
  background: #fbf8ff;
}

.r360-home-card--bienestar .r360-home-card__art {
  background: #fffaf0;
}

.r360-home-card img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

.r360-home-card__body {
  display: grid;
  gap: 0.45rem;
  min-width: 0;
  padding: 1rem 4.4rem 1.15rem 1.25rem;
  background: rgba(255, 255, 255, 0.9);
}

.r360-home-card__body strong {
  color: #0b4791;
  font-size: 1.08rem;
  font-weight: 930;
  line-height: 1.15;
}

.r360-home-card--recetas .r360-home-card__body strong,
.r360-home-card--nutricion .r360-home-card__body strong {
  color: #087532;
}

.r360-home-card--ejercicio .r360-home-card__body strong {
  color: #4a23b2;
}

.r360-home-card--bienestar .r360-home-card__body strong {
  color: #e17300;
}

.r360-home-card__body small {
  color: #536b98;
  font-size: 0.94rem;
  font-weight: 650;
  line-height: 1.38;
}

.r360-home-card__arrow {
  position: absolute;
  right: 1.1rem;
  bottom: 1.05rem;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  color: #176ee8;
  background: #eaf3ff;
}

.r360-home-card--recetas .r360-home-card__arrow,
.r360-home-card--nutricion .r360-home-card__arrow {
  color: #16783d;
  background: #e8f8e8;
}

.r360-home-card--ejercicio .r360-home-card__arrow {
  color: #6829d4;
  background: #f0e7ff;
}

.r360-home-card--bienestar .r360-home-card__arrow {
  color: #e17300;
  background: #fff0d5;
}

.r360-home-protection {
  display: grid;
  grid-template-columns: 50px minmax(0, 1fr) auto;
  gap: 0.95rem;
  align-items: center;
  min-height: 72px;
  padding: 0.9rem 1.15rem;
  border: 1px solid rgba(70, 169, 87, 0.16);
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(226, 247, 232, 0.82), rgba(255, 255, 255, 0.92)),
    #ffffff;
  box-shadow: 0 14px 34px rgba(24, 48, 77, 0.06);
}

.r360-home-protection > span {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 50%;
  color: #ffffff;
  background: linear-gradient(135deg, #42b8c6, #4ac06c);
}

.r360-home-protection > span svg {
  width: 25px;
  height: 25px;
}

.r360-home-protection strong,
.r360-home-protection small {
  display: block;
}

.r360-home-protection strong {
  color: #14723c;
  font-size: 0.98rem;
  font-weight: 900;
}

.r360-home-protection small {
  margin-top: 0.28rem;
  color: #536b98;
  font-size: 0.88rem;
  font-weight: 650;
  line-height: 1.35;
}

.r360-home-protection a {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  color: #176ee8;
  font-size: 0.92rem;
  font-weight: 850;
  text-decoration: none;
}

.r360-app-section-page {
  margin-top: 0;
}

.r360-app-notice {
  padding: 0.85rem 1rem;
  border: 1px solid rgba(39, 93, 168, 0.14);
  border-radius: 8px;
  background: #ffffff;
  color: var(--r360-blue-deep);
  font-weight: 800;
}

.r360-app-notice--success {
  color: #0b7a35;
  border-color: rgba(70, 169, 87, 0.32);
  background: #effaf1;
}

.r360-app-notice--error {
  color: #9b2530;
  border-color: rgba(216, 75, 86, 0.32);
  background: #fff1f2;
}

.r360-nutrition-page {
  display: grid;
  gap: 1.15rem;
  min-width: 0;
}

.r360-nutrition-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.r360-nutrition-head h1 {
  margin: 0;
  color: #073769;
  font-size: 2.1rem;
  font-weight: 930;
  line-height: 1.08;
}

.r360-nutrition-head > span {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  color: #164a85;
  font-size: 0.95rem;
  font-weight: 760;
}

.r360-nutrition-head svg {
  width: 24px;
  height: 24px;
}

/* Shared historic-summary control used across nutrition, prescriptions,
 * exercise and wellness.  It intentionally lives in the title row so a
 * patient always sees which date is being reviewed. */
.r360-app-date-control {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 0.45rem;
  color: #164a85;
}

.r360-app-date-control > span {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.9rem;
  font-weight: 800;
  white-space: nowrap;
}

.r360-app-date-control svg { width: 21px; height: 21px; }
.r360-app-date-control form { display: inline-flex; align-items: center; gap: 0.35rem; margin: 0; }
.r360-app-date-control input[type="date"] {
  min-height: 36px;
  max-width: 150px;
  padding: 0.35rem 0.48rem;
  border: 1px solid #c9ddf0;
  border-radius: 8px;
  color: #123f73;
  background: #ffffff;
  font: inherit;
  font-size: 0.8rem;
  font-weight: 760;
}
.r360-app-date-control button,
.r360-app-date-control > a {
  min-height: 36px;
  padding: 0.4rem 0.62rem;
  border: 1px solid #b9d7f4;
  border-radius: 8px;
  color: #126ed8;
  background: #f5faff;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 850;
  line-height: 1;
  text-decoration: none;
  cursor: pointer;
}
.r360-app-date-control button:hover,
.r360-app-date-control > a:hover { border-color: #1976e8; background: #eaf5ff; }
.r360-historical-note {
  margin: -0.45rem 0 0;
  padding: 0.65rem 0.85rem;
  border: 1px solid #f0d9a1;
  border-radius: 9px;
  color: #805a10;
  background: #fff9e9;
  font-size: 0.84rem;
  font-weight: 700;
}

.r360-nutrition-banner,
.r360-nutrition-metric,
.r360-meal-plan-card,
.r360-tip-card,
.r360-water-card,
.r360-nutrition-empty {
  border: 1px solid rgba(39, 93, 168, 0.13);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 16px 42px rgba(24, 48, 77, 0.06);
}

.r360-nutrition-banner {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr) auto;
  gap: 1.2rem;
  align-items: center;
  min-height: 122px;
  padding: 1.35rem;
  border-color: rgba(70, 169, 87, 0.22);
  background:
    linear-gradient(90deg, rgba(236, 250, 238, 0.9), rgba(255, 255, 255, 0.9)),
    #ffffff;
}

.r360-nutrition-banner > div {
  min-width: 0;
}

.r360-nutrition-banner__icon {
  display: grid;
  width: 58px;
  height: 58px;
  place-items: center;
  border: 1px solid rgba(70, 169, 87, 0.5);
  border-radius: 50%;
  color: #1a9f3b;
  background: rgba(255, 255, 255, 0.7);
}

.r360-nutrition-banner__icon svg {
  width: 32px;
  height: 32px;
}

.r360-nutrition-banner strong {
  display: block;
  color: #06822c;
  font-size: 1.02rem;
  font-weight: 900;
}

.r360-nutrition-banner p {
  max-width: 650px;
  margin: 0.7rem 0 0;
  color: #153d70;
  font-size: 0.95rem;
  font-weight: 640;
  line-height: 1.65;
  overflow-wrap: anywhere;
}

.r360-nutrition-download,
.r360-meal-register,
.r360-meal-quick-form button,
.r360-meal-submit,
.r360-meal-cancel {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-height: 42px;
  border: 1px solid rgba(26, 159, 59, 0.58);
  border-radius: 8px;
  color: #07852f;
  background: #ffffff;
  font: inherit;
  font-size: 0.9rem;
  font-weight: 850;
  cursor: pointer;
}

.r360-nutrition-download-form {
  margin: 0;
}

.r360-nutrition-download {
  min-width: 168px;
  padding: 0 1rem;
}

.r360-nutrition-download svg,
.r360-meal-register svg {
  width: 22px;
  height: 22px;
}

.r360-nutrition-section-title {
  margin-top: 0.35rem;
  color: #073769;
  font-size: 1.1rem;
  font-weight: 930;
}

.r360-nutrition-metrics {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.85rem;
}

.r360-nutrition-metric {
  display: grid;
  gap: 0.42rem;
  min-width: 0;
  min-height: 158px;
  padding: 1.1rem;
  color: #119b35;
}

.r360-nutrition-metric--blue {
  color: #126ed8;
}

.r360-nutrition-metric > svg {
  width: 28px;
  height: 28px;
}

.r360-nutrition-metric span {
  color: #073769;
  font-size: 0.9rem;
  font-weight: 880;
}

.r360-nutrition-metric strong {
  color: #073769;
  font-size: 1.45rem;
  font-weight: 930;
  line-height: 1;
}

.r360-nutrition-metric strong small {
  font-size: 0.82rem;
  font-weight: 760;
}

.r360-nutrition-metric em {
  color: #577098;
  font-size: 0.82rem;
  font-style: normal;
  font-weight: 650;
}

.r360-nutrition-metric i {
  display: block;
  height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: #dfece5;
}

.r360-nutrition-metric i b {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: currentColor;
}

.r360-nutrition-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.75fr) minmax(320px, 1fr);
  gap: 1.1rem;
  align-items: start;
}

.r360-meal-plan-card {
  min-width: 0;
  overflow: hidden;
}

.r360-meal-plan-card > header,
.r360-water-card header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.15rem 0.75rem;
}

.r360-meal-plan-card h2,
.r360-tip-card h2,
.r360-water-card h2 {
  margin: 0;
  color: #073769;
  font-size: 1.25rem;
  font-weight: 930;
}

.r360-meal-register {
  min-width: 166px;
  border-color: #1976e8;
  color: #126ed8;
}

.r360-meal-tabs {
  display: grid;
  grid-template-columns: repeat(8, minmax(86px, 1fr));
  margin: 0 1.15rem;
  overflow-x: auto;
  border: 1px solid rgba(39, 93, 168, 0.13);
  border-radius: 8px;
}

.r360-meal-tabs button {
  min-height: 44px;
  border: 0;
  border-right: 1px solid rgba(39, 93, 168, 0.1);
  color: #153d70;
  background: #ffffff;
  font: inherit;
  font-size: 0.84rem;
  font-weight: 760;
  cursor: pointer;
}

.r360-meal-tabs button:last-child {
  border-right: 0;
}

.r360-meal-tabs button.is-active {
  color: #079131;
  box-shadow: inset 0 -3px 0 #20af43;
}

.r360-meal-list {
  display: grid;
  padding-top: 0.75rem;
}

.r360-meal-day {
  display: none;
}

.r360-meal-day.is-active {
  display: grid;
}

.r360-meal-row {
  display: grid;
  grid-template-columns: 46px 150px minmax(150px, 1fr) 96px 84px 92px;
  gap: 0.85rem;
  align-items: center;
  min-height: 74px;
  padding: 0.75rem 1.15rem;
  border-top: 1px solid rgba(39, 93, 168, 0.1);
}

.r360-meal-row__icon {
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  color: #119b35;
}

.r360-meal-row__icon svg {
  width: 28px;
  height: 28px;
}

.r360-meal-row > div {
  min-width: 0;
}

.r360-meal-row strong {
  color: #073769;
  font-size: 0.95rem;
  font-weight: 900;
  overflow-wrap: anywhere;
}

.r360-meal-row small {
  display: block;
  margin-top: 0.22rem;
  color: #45618c;
  font-size: 0.78rem;
  font-weight: 650;
}

.r360-meal-row p {
  min-width: 0;
  margin: 0;
  color: #294a7d;
  font-size: 0.9rem;
  font-weight: 640;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.r360-meal-row em {
  color: #153d70;
  font-size: 0.86rem;
  font-style: normal;
  font-weight: 780;
  text-align: right;
}

.r360-meal-row.is-completed,
.r360-exercise-row-app.is-completed,
.r360-medication-row-app.is-taken,
.r360-wellness-row.is-completed {
  background: linear-gradient(90deg, rgba(232, 248, 237, 0.9), rgba(255, 255, 255, 0.94));
}

.r360-meal-row.is-completed strong,
.r360-meal-row.is-completed p,
.r360-exercise-row-app.is-completed strong,
.r360-exercise-row-app.is-completed p,
.r360-medication-row-app.is-taken strong,
.r360-medication-row-app.is-taken p,
.r360-wellness-row.is-completed strong,
.r360-wellness-row.is-completed small {
  color: #5d7b68;
  text-decoration: line-through;
  text-decoration-color: #20a654;
  text-decoration-thickness: 1.5px;
}

.r360-meal-row.is-completed em,
.r360-exercise-row-app.is-completed em,
.r360-medication-row-app.is-taken em,
.r360-wellness-row.is-completed em {
  opacity: 0.72;
}

.r360-meal-quick-form button:disabled,
.r360-exercise-quick-form button:disabled,
.r360-medication-quick-form button:disabled,
.r360-wellness-quick-form button:disabled {
  cursor: not-allowed;
  opacity: 1;
}

.r360-meal-quick-form button {
  min-height: 34px;
  padding: 0 0.7rem;
  border-color: rgba(25, 118, 232, 0.34);
  color: #126ed8;
  font-size: 0.78rem;
}

.r360-meal-reminder {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  gap: 0.75rem;
  align-items: center;
  margin: 0.8rem 1.15rem 1rem;
  padding: 0.9rem 1rem;
  border-radius: 8px;
  color: #126ed8;
  background: linear-gradient(90deg, #edf6ff, #f7fbff);
}

.r360-meal-reminder svg {
  width: 24px;
  height: 24px;
}

.r360-meal-reminder span {
  color: #153d70;
  font-size: 0.9rem;
  font-weight: 680;
}

.r360-meal-reminder strong {
  color: #126ed8;
  font-size: 0.9rem;
}

.r360-nutrition-side {
  display: grid;
  gap: 1rem;
}

.r360-tip-card {
  position: relative;
  min-width: 0;
  min-height: 225px;
  overflow: hidden;
  padding: 1.35rem;
  background: linear-gradient(135deg, rgba(240, 251, 242, 0.92), rgba(255, 255, 255, 0.98));
}

.r360-tip-card__tips {
  max-width: 260px;
  margin: 1.5rem 0 0;
}

.r360-tip-card__tips p {
  display: none;
  margin: 0;
  color: #4b6592;
  font-size: 0.92rem;
  line-height: 1.62;
}

.r360-tip-card__tips p.is-active {
  display: block;
}

.r360-tip-card > span {
  position: absolute;
  right: 2rem;
  bottom: 4rem;
  display: grid;
  width: 76px;
  height: 76px;
  place-items: center;
  border-radius: 8px;
  color: #22a848;
  background: rgba(255, 255, 255, 0.74);
}

.r360-tip-card > span svg {
  width: 46px;
  height: 46px;
}

.r360-tip-card__dots {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 1.1rem;
  display: flex;
  justify-content: center;
  gap: 0.6rem;
}

.r360-tip-card i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgba(70, 169, 87, 0.22);
}

.r360-tip-card i.is-active {
  background: #21a642;
}

.r360-water-card {
  min-width: 0;
  padding-bottom: 1.15rem;
}

.r360-water-card header a {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  color: #079131;
  font-size: 0.86rem;
  font-weight: 850;
  text-decoration: none;
}

.r360-water-content {
  display: grid;
  grid-template-columns: 128px minmax(0, 1fr);
  gap: 1.2rem;
  align-items: center;
  padding: 0.8rem 1.8rem 1rem;
}

.r360-water-ring {
  --r360-water: 0;
  display: grid;
  width: 112px;
  height: 112px;
  place-items: center;
  border-radius: 50%;
  color: #126ed8;
  background:
    radial-gradient(circle at center, #ffffff 0 58%, transparent 59%),
    conic-gradient(#50bc62 calc(var(--r360-water) * 1%), #e9edf0 0);
}

.r360-water-ring svg {
  width: 34px;
  height: 34px;
}

.r360-water-content strong,
.r360-water-content small,
.r360-water-content em {
  display: block;
}

.r360-water-content strong {
  color: #073769;
  font-size: 1.6rem;
  font-weight: 930;
}

.r360-water-content small {
  margin-top: 0.4rem;
  color: #4b6592;
  font-size: 1rem;
  font-weight: 680;
}

.r360-water-content em {
  margin-top: 0.45rem;
  color: #5a729a;
  font-size: 0.86rem;
  font-style: normal;
  font-weight: 650;
}

.r360-water-glasses {
  display: flex;
  justify-content: center;
  gap: 1.3rem;
  margin: 0;
  padding: 0 1rem;
}

.r360-water-glasses button {
  width: 18px;
  height: 30px;
  padding: 0;
  border: 2px solid #d7dde5;
  border-top-width: 3px;
  border-radius: 2px 2px 6px 6px;
  appearance: none;
  background: linear-gradient(180deg, transparent 44%, #1778e8 45%);
  cursor: pointer;
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.r360-water-glasses button:not(.is-filled) {
  background: #f7f9fb;
}

.r360-water-glasses button:hover,
.r360-water-glasses button:focus-visible {
  border-color: #1778e8;
  box-shadow: 0 6px 16px rgba(23, 120, 232, 0.18);
  outline: none;
  transform: translateY(-2px);
}

.r360-nutrition-empty {
  display: grid;
  justify-items: start;
  gap: 0.8rem;
  padding: 1.4rem;
}

.r360-nutrition-empty svg {
  width: 46px;
  height: 46px;
  color: #119b35;
}

.r360-nutrition-empty h2 {
  margin: 0;
  color: #073769;
}

.r360-nutrition-empty p {
  max-width: 720px;
  margin: 0;
  color: #536b98;
  line-height: 1.6;
}

.r360-meal-modal {
  width: min(620px, calc(100% - 2rem));
  max-height: calc(100vh - 2rem);
  padding: 0;
  border: 0;
  border-radius: 8px;
  box-shadow: 0 28px 90px rgba(10, 35, 70, 0.28);
}

.r360-meal-modal::backdrop {
  background: rgba(8, 27, 52, 0.48);
  backdrop-filter: blur(3px);
}

.r360-meal-modal__form {
  display: grid;
  gap: 1rem;
  padding: 1.1rem;
  color: #073769;
}

.r360-meal-modal header,
.r360-meal-modal footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.r360-meal-modal header strong {
  display: block;
  font-size: 1.25rem;
  font-weight: 930;
}

.r360-meal-modal header small {
  display: block;
  margin-top: 0.25rem;
  color: #536b98;
}

.r360-meal-modal header button {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 0;
  border-radius: 50%;
  color: #073769;
  background: #eef4fb;
  font-size: 1.35rem;
  cursor: pointer;
}

.r360-meal-source {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.r360-meal-source label {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  min-height: 46px;
  padding: 0.7rem;
  border: 1px solid rgba(39, 93, 168, 0.14);
  border-radius: 8px;
  background: #f8fbff;
  font-weight: 800;
}

.r360-meal-modal__group {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.8rem;
}

.r360-meal-modal__group[hidden] {
  display: none;
}

.r360-meal-modal__wide {
  grid-column: 1 / -1;
}

.r360-meal-modal label {
  display: grid;
  gap: 0.38rem;
  color: #073769;
  font-size: 0.86rem;
  font-weight: 850;
}

.r360-meal-modal input,
.r360-meal-modal select {
  width: 100%;
  min-height: 42px;
  padding: 0.65rem 0.75rem;
  border: 1px solid rgba(39, 93, 168, 0.16);
  border-radius: 8px;
  color: #18304d;
  background: #ffffff;
  font: inherit;
}

.r360-meal-cancel {
  border-color: rgba(39, 93, 168, 0.18);
  color: #536b98;
}

.r360-meal-submit {
  padding-inline: 1rem;
  color: #ffffff;
  background: #1476e8;
  border-color: #1476e8;
}

.r360-logged-meals-card {
  display: grid;
  gap: 0.9rem;
  margin-top: 1.15rem;
  overflow: hidden;
  border: 1px solid #d8e8f5;
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 12px 28px rgba(23, 71, 119, 0.06);
}
.r360-logged-meals-card > header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.15rem; border-bottom: 1px solid #e6eff7; background: linear-gradient(90deg, #f1f9ff, #f8fcff); }
.r360-logged-meals-card > header > div { display: flex; align-items: center; gap: 0.75rem; }
.r360-logged-meals-card > header > div > span { display: grid; width: 38px; height: 38px; place-items: center; border-radius: 11px; color: #1474c6; background: #dff1ff; }
.r360-logged-meals-card > header svg { width: 21px; height: 21px; }
.r360-logged-meals-card h2 { margin: 0; color: #123f73; font-size: 1rem; font-weight: 900; }
.r360-logged-meals-card p { margin: 0.15rem 0 0; color: #64809c; font-size: 0.78rem; }
.r360-logged-meals-card > header > strong { padding: 0.42rem 0.65rem; border-radius: 999px; color: #187342; background: #e6f7eb; font-size: 0.78rem; white-space: nowrap; }
.r360-logged-meals-card > header > strong b { font-size: 0.95rem; }
.r360-logged-meals-tabs { display: grid; grid-template-columns: repeat(7, minmax(74px, 1fr)); margin: 0 1.15rem; overflow-x: auto; border: 1px solid #d8e8f5; border-radius: 10px; }
.r360-logged-meals-tabs button { min-height: 40px; border: 0; border-right: 1px solid #e3eef7; color: #335a84; background: #ffffff; font: inherit; font-size: 0.77rem; font-weight: 850; cursor: pointer; }
.r360-logged-meals-tabs button:last-child { border-right: 0; }
.r360-logged-meals-tabs button.is-active { color: #087a36; background: #f0fbf3; box-shadow: inset 0 -3px 0 #20af43; }
.r360-logged-meals-day { display: none; }
.r360-logged-meals-day.is-active { display: block; }
.r360-logged-meals-card__list { display: grid; }
.r360-logged-meal { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto 80px; gap: 0.75rem; align-items: center; padding: 0.75rem 1.15rem; border-top: 1px solid #edf3f8; }
.r360-logged-meal:first-child { border-top: 0; }
.r360-logged-meal__icon { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 10px; color: #1374c8; background: #e5f4ff; font-weight: 900; }
.r360-logged-meal > div { min-width: 0; }
.r360-logged-meal strong, .r360-logged-meal small { display: block; }
.r360-logged-meal strong { color: #153f72; font-size: 0.87rem; font-weight: 900; }
.r360-logged-meal small { margin-top: 0.16rem; color: #647c98; font-size: 0.78rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.r360-logged-meal ul { display: flex; gap: 0.35rem; margin: 0; padding: 0; list-style: none; }
.r360-logged-meal li { padding: 0.28rem 0.38rem; border-radius: 6px; color: #3d658f; background: #f1f6fb; font-size: 0.7rem; font-weight: 800; }
.r360-logged-meal em { color: #15477f; font-size: 0.8rem; font-style: normal; font-weight: 900; text-align: right; }
.r360-logged-meals-card__empty { padding: 1.1rem 1.15rem; color: #70869d; font-size: 0.84rem; }

/* Meal log modal: the image workflow and manual fields need independent grids. */
.r360-meal-modal {
  width: min(700px, calc(100% - 2rem));
  max-height: min(840px, calc(100vh - 1.5rem));
  overflow: hidden;
  border-radius: 18px;
  background: #ffffff;
}

.r360-meal-modal__form {
  max-height: min(840px, calc(100vh - 1.5rem));
  overflow-y: auto;
  gap: 1.15rem;
  padding: clamp(1rem, 2.5vw, 1.45rem);
}

.r360-meal-modal header {
  align-items: flex-start;
  padding-bottom: 0.9rem;
  border-bottom: 1px solid #e5eef8;
}

.r360-meal-modal header strong { font-size: clamp(1.2rem, 3vw, 1.5rem); }
.r360-meal-modal header button { flex: 0 0 auto; }

.r360-meal-source { gap: 0.85rem; }
.r360-meal-source label {
  min-height: 62px;
  padding: 0.85rem 0.95rem;
  border-color: #d7e5f4;
  color: #143f72;
  transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}
.r360-meal-source label:has(input:checked) {
  border-color: #4f98e9;
  background: linear-gradient(135deg, #edf7ff, #f8fbff);
  box-shadow: inset 0 0 0 1px rgba(47, 126, 213, 0.08);
}
.r360-meal-source input[type="radio"] {
  width: 20px;
  min-width: 20px;
  min-height: 20px;
  height: 20px;
  margin: 0;
  padding: 0;
  accent-color: #1675e8;
}

.r360-meal-modal input:not([type="radio"]):not([type="file"]),
.r360-meal-modal select {
  min-height: 46px;
  border-color: #d4e2f2;
  background: #ffffff;
}
.r360-meal-modal input:not([type="radio"]):not([type="file"]):focus,
.r360-meal-modal select:focus {
  border-color: #4e93dc;
  outline: 3px solid rgba(63, 142, 224, 0.14);
}

.r360-meal-modal__group--custom { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
.r360-meal-custom-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.85rem; }
.r360-meal-custom-fields .r360-meal-modal__wide { grid-column: 1 / -1; }

.r360-meal-photo-card {
  grid-template-columns: minmax(0, 1fr) minmax(174px, 205px);
  grid-template-areas: "intro actions" "preview preview";
  gap: 1rem;
  align-items: center;
  padding: 1rem 1.1rem;
  border-color: #c9e0f5;
  background: linear-gradient(135deg, #ecf8ff, #f8fcff 58%, #eef9f0);
}
.r360-meal-photo-card__intro { grid-area: intro; }
.r360-meal-photo-card__intro > span { grid-row: span 2; }
.r360-meal-photo-card__actions { display: grid; grid-area: actions; gap: 0.55rem; }
.r360-meal-photo-card__input { display: block !important; }
.r360-meal-photo-card__input span,
.r360-meal-photo-card__analyze { width: 100%; min-height: 42px; }
.r360-meal-photo-card__preview { grid-area: preview; grid-column: auto; margin-top: 0.1rem; }

.r360-meal-modal footer {
  position: sticky;
  bottom: -1.45rem;
  margin: 0 -1.45rem -1.45rem;
  padding: 0.9rem 1.45rem;
  border-top: 1px solid #e5eef8;
  background: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(8px);
}

@media (max-width: 620px) {
  .r360-app-date-control { justify-content: flex-start; }
  .r360-app-date-control > span { width: 100%; }
  .r360-app-date-control input[type="date"] { max-width: none; }
  .r360-logged-meals-tabs { grid-template-columns: repeat(7, minmax(68px, 1fr)); margin-inline: 0.9rem; }
  .r360-meal-modal { width: min(calc(100% - 1rem), 540px); max-height: calc(100vh - 1rem); }
  .r360-meal-modal__form { max-height: calc(100vh - 1rem); }
  .r360-meal-source,
  .r360-meal-custom-fields { grid-template-columns: 1fr; }
  .r360-meal-photo-card { grid-template-columns: 1fr; grid-template-areas: "intro" "actions" "preview"; }
  .r360-meal-modal footer { bottom: -1rem; margin: 0 -1rem -1rem; padding: 0.8rem 1rem; }
  .r360-logged-meals-card > header { align-items: flex-start; flex-direction: column; }
  .r360-logged-meals-card > header > strong { align-self: flex-start; }
  .r360-logged-meal { grid-template-columns: 38px minmax(0, 1fr) auto; gap: 0.6rem; padding: 0.75rem 0.9rem; }
  .r360-logged-meal ul { grid-column: 2 / -1; grid-row: 2; }
  .r360-logged-meal em { grid-column: 3; grid-row: 1; }
}

@media (max-width: 420px) {
  .r360-logged-meal { grid-template-columns: 34px minmax(0, 1fr); }
  .r360-logged-meal em { grid-column: 2; grid-row: 3; justify-self: start; }
}

.r360-prescriptions-page {
  display: grid;
  gap: 1.15rem;
  min-width: 0;
}

.r360-prescriptions-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.r360-prescriptions-head h1 {
  margin: 0;
  color: #073769;
  font-size: 2.1rem;
  font-weight: 930;
  line-height: 1.08;
}

.r360-prescriptions-head > span {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  color: #164a85;
  font-size: 0.95rem;
  font-weight: 760;
}

.r360-prescriptions-head svg {
  width: 24px;
  height: 24px;
}

.r360-prescriptions-banner,
.r360-prescriptions-metric,
.r360-medication-plan-card,
.r360-prescriptions-tip-card,
.r360-next-medication-card,
.r360-medication-follow-card,
.r360-prescriptions-empty {
  border: 1px solid rgba(39, 93, 168, 0.13);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 16px 42px rgba(24, 48, 77, 0.06);
}

.r360-prescriptions-banner {
  display: grid;
  grid-template-columns: 92px minmax(320px, 1fr) minmax(280px, 340px) auto;
  gap: 1.2rem;
  align-items: center;
  min-height: 160px;
  padding: 1.1rem 1.25rem;
  border-color: rgba(70, 169, 87, 0.22);
  background: linear-gradient(90deg, rgba(236, 250, 238, 0.92), rgba(255, 255, 255, 0.96));
}

.r360-prescriptions-banner__icon {
  display: grid;
  width: 86px;
  height: 86px;
  place-items: center;
  border: 2px solid rgba(26, 159, 59, 0.45);
  border-radius: 8px;
  color: #119b35;
  background: rgba(255, 255, 255, 0.74);
}

.r360-prescriptions-banner__icon svg {
  width: 56px;
  height: 56px;
}

.r360-prescriptions-banner > div {
  min-width: 0;
}

.r360-prescriptions-banner strong {
  display: block;
  color: #079131;
  font-size: 1.2rem;
  font-weight: 930;
}

.r360-prescriptions-banner p {
  max-width: 680px;
  margin: 0.55rem 0 0;
  color: #153d70;
  font-size: 0.95rem;
  font-weight: 640;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

.r360-prescriptions-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin-top: 0.8rem;
}

.r360-prescriptions-tags em {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  min-height: 30px;
  padding: 0.25rem 0.65rem;
  border: 1px solid rgba(70, 169, 87, 0.18);
  border-radius: 999px;
  color: #164a85;
  background: rgba(255, 255, 255, 0.78);
  font-size: 0.82rem;
  font-style: normal;
  font-weight: 760;
}

.r360-prescriptions-tags svg {
  width: 17px;
  height: 17px;
  color: #1ba142;
}

.r360-prescriptions-illustration {
  display: flex;
  align-self: stretch;
  align-items: center;
  justify-content: center;
  min-width: 0;
}

.r360-prescriptions-illustration img {
  display: block;
  width: min(320px, 100%);
  max-height: 124px;
  height: auto;
  object-fit: contain;
  object-position: center right;
}

.r360-prescriptions-download,
.r360-prescriptions-register,
.r360-medication-submit,
.r360-medication-cancel {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-height: 42px;
  border: 1px solid rgba(26, 159, 59, 0.58);
  border-radius: 8px;
  color: #07852f;
  background: #ffffff;
  font: inherit;
  font-size: 0.9rem;
  font-weight: 850;
  cursor: pointer;
}

.r360-prescriptions-download-form {
  margin: 0;
  justify-self: end;
}

.r360-prescriptions-download {
  min-width: 184px;
  padding: 0 1rem;
}

.r360-prescriptions-download svg,
.r360-prescriptions-register svg {
  width: 22px;
  height: 22px;
}

.r360-prescriptions-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

.r360-prescriptions-metric {
  display: flex;
  min-width: 0;
  min-height: 162px;
  flex-direction: column;
  gap: 0.5rem;
  padding: 1rem 1.15rem;
  color: #119b35;
}

.r360-prescriptions-metric--blue {
  color: #126ed8;
}

.r360-prescriptions-metric--amber {
  color: #e6a700;
}

.r360-prescriptions-metric > svg {
  width: 34px;
  height: 34px;
}

.r360-prescriptions-metric span:not(.r360-prescriptions-ring) {
  color: #073769;
  font-size: 0.9rem;
  font-weight: 880;
}

.r360-prescriptions-metric strong {
  color: #073769;
  font-size: 1.75rem;
  font-weight: 930;
  line-height: 1;
}

.r360-prescriptions-metric strong small {
  font-size: 0.9rem;
  font-weight: 760;
}

.r360-prescriptions-metric em {
  color: #577098;
  font-size: 0.82rem;
  font-style: normal;
  font-weight: 650;
}

.r360-prescriptions-metric i {
  display: block;
  width: 100%;
  height: 7px;
  margin-top: auto;
  overflow: hidden;
  border-radius: 999px;
  background: #dfece5;
}

.r360-prescriptions-metric i b {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: currentColor;
}

.r360-prescriptions-metric--adherence {
  display: grid;
  grid-template-columns: 98px minmax(0, 1fr);
  align-items: center;
  column-gap: 1rem;
}

.r360-prescriptions-metric--adherence > span:not(.r360-prescriptions-ring),
.r360-prescriptions-metric--adherence strong,
.r360-prescriptions-metric--adherence em,
.r360-prescriptions-metric--adherence i {
  grid-column: 2;
}

.r360-prescriptions-ring {
  --r360-adherence: 0;
  grid-row: 1 / span 4;
  display: grid;
  width: 82px;
  height: 82px;
  place-items: center;
  border-radius: 50%;
  color: #119b35;
  background:
    radial-gradient(circle at center, #ffffff 0 56%, transparent 57%),
    conic-gradient(#55bf70 calc(var(--r360-adherence) * 1%), #e9edf0 0);
  font-size: 1.18rem;
  font-weight: 930;
}

.r360-prescriptions-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.75fr) minmax(320px, 1fr);
  gap: 1.1rem;
  align-items: start;
}

.r360-medication-plan-card {
  min-width: 0;
  overflow: hidden;
}

.r360-medication-plan-card > header,
.r360-next-medication-card header,
.r360-medication-follow-card header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.15rem 0.75rem;
}

.r360-medication-plan-card h2,
.r360-prescriptions-tip-card h2,
.r360-next-medication-card h2,
.r360-medication-follow-card h2 {
  margin: 0;
  color: #073769;
  font-size: 1.25rem;
  font-weight: 930;
}

.r360-prescriptions-register {
  min-width: 160px;
  border-color: #1976e8;
  color: #126ed8;
}

.r360-medication-tabs {
  display: grid;
  grid-template-columns: repeat(8, minmax(86px, 1fr));
  margin: 0 1.15rem;
  overflow-x: auto;
  border: 1px solid rgba(39, 93, 168, 0.13);
  border-radius: 8px;
}

.r360-medication-tabs button {
  min-height: 44px;
  border: 0;
  border-right: 1px solid rgba(39, 93, 168, 0.1);
  color: #153d70;
  background: #ffffff;
  font: inherit;
  font-size: 0.84rem;
  font-weight: 760;
  cursor: pointer;
}

.r360-medication-tabs button:last-child {
  border-right: 0;
}

.r360-medication-tabs button.is-active {
  color: #079131;
  box-shadow: inset 0 -3px 0 #20af43;
}

.r360-medication-list {
  display: grid;
  padding-top: 0.75rem;
}

.r360-medication-day {
  display: none;
}

.r360-medication-day.is-active {
  display: grid;
}

.r360-medication-row-app {
  display: grid;
  grid-template-columns: 46px minmax(135px, 0.75fr) minmax(0, 1fr) 36px;
  gap: 0.85rem;
  align-items: center;
  min-height: 68px;
  padding: 0.58rem 1.15rem;
  border-top: 1px solid rgba(39, 93, 168, 0.1);
}

.r360-medication-row-app__icon {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  color: #119b35;
}

.r360-medication-row-app__icon svg {
  width: 30px;
  height: 30px;
}

.r360-medication-row-app > div,
.r360-medication-row-app p {
  min-width: 0;
}

.r360-medication-row-app strong {
  color: #073769;
  font-size: 0.95rem;
  font-weight: 900;
  overflow-wrap: anywhere;
}

.r360-medication-row-app small,
.r360-medication-row-app p span {
  display: block;
  margin-top: 0.22rem;
  color: #45618c;
  font-size: 0.78rem;
  font-weight: 650;
}

.r360-medication-row-app p {
  margin: 0;
  color: #294a7d;
  font-size: 0.86rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.r360-medication-row-app.is-taken {
  background: rgba(237, 249, 240, 0.78);
}

.r360-medication-quick-form button {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 0;
  border-radius: 50%;
  color: #126ed8;
  background: #eef6ff;
  cursor: pointer;
}

.r360-medication-row-app.is-taken .r360-medication-quick-form button {
  color: #079131;
  background: #e8f8ed;
}

.r360-medication-quick-form svg {
  width: 20px;
  height: 20px;
}

.r360-medication-reminder {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  gap: 0.75rem;
  align-items: center;
  margin: 0.8rem 1.15rem 1rem;
  padding: 0.9rem 1rem;
  border-radius: 8px;
  color: #126ed8;
  background: linear-gradient(90deg, #edf6ff, #f7fbff);
}

.r360-medication-reminder svg {
  width: 24px;
  height: 24px;
}

.r360-medication-reminder span {
  color: #153d70;
  font-size: 0.88rem;
  font-weight: 680;
}

.r360-medication-reminder a {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  color: #126ed8;
  font-size: 0.88rem;
  font-weight: 850;
  text-decoration: none;
}

.r360-prescriptions-side {
  display: grid;
  gap: 1rem;
}

.r360-prescriptions-tip-card {
  position: relative;
  min-height: 245px;
  overflow: hidden;
  padding: 1.35rem;
  background: linear-gradient(135deg, rgba(240, 251, 242, 0.92), rgba(255, 255, 255, 0.98));
}

.r360-prescriptions-tip-card__tips {
  max-width: 300px;
  margin: 1.35rem 0 0;
}

.r360-prescriptions-tip-card__tips p {
  display: none;
  margin: 0;
  color: #294a7d;
  font-size: 0.92rem;
  line-height: 1.62;
}

.r360-prescriptions-tip-card__tips p.is-active {
  display: block;
}

.r360-prescriptions-tip-card > span {
  position: absolute;
  right: 1.55rem;
  bottom: 3.15rem;
  display: grid;
  width: 92px;
  height: 92px;
  place-items: center;
  border-radius: 8px;
  color: #22a848;
  background: rgba(255, 255, 255, 0.74);
}

.r360-prescriptions-tip-card > span svg {
  width: 64px;
  height: 64px;
}

.r360-prescriptions-tip-card__dots {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 1.1rem;
  display: flex;
  justify-content: center;
  gap: 0.6rem;
}

.r360-prescriptions-tip-card i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgba(70, 169, 87, 0.22);
}

.r360-prescriptions-tip-card i.is-active {
  background: #21a642;
}

.r360-next-medication-card {
  padding-bottom: 1.2rem;
}

.r360-next-medication-card header svg {
  width: 22px;
  height: 22px;
  color: #126ed8;
}

.r360-next-medication-card > div {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 1.1rem;
  align-items: center;
  padding: 0.75rem 1.15rem 0;
}

.r360-next-medication-card > div > span {
  display: grid;
  width: 82px;
  height: 82px;
  place-items: center;
  border-radius: 50%;
  color: #119b35;
  background: #eef8f0;
}

.r360-next-medication-card > div > span svg {
  width: 46px;
  height: 46px;
}

.r360-next-medication-card p {
  margin: 0;
}

.r360-next-medication-card strong,
.r360-next-medication-card em,
.r360-next-medication-card small,
.r360-next-medication-card b {
  display: block;
}

.r360-next-medication-card strong {
  color: #073769;
  font-size: 1.7rem;
  font-weight: 930;
}

.r360-next-medication-card em {
  margin-top: 0.3rem;
  color: #073769;
  font-style: normal;
  font-weight: 850;
}

.r360-next-medication-card small {
  margin-top: 0.25rem;
  color: #45618c;
  font-size: 0.86rem;
  font-weight: 650;
}

.r360-next-medication-card b {
  width: fit-content;
  margin-top: 0.6rem;
  padding: 0.32rem 0.65rem;
  border-radius: 999px;
  color: #079131;
  background: #e8f8ed;
  font-size: 0.82rem;
}

.r360-medication-follow-card {
  padding: 0 1.15rem 1.15rem;
}

.r360-medication-follow-card header {
  padding-inline: 0;
}

.r360-medication-follow-card header a {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  color: #079131;
  font-size: 0.86rem;
  font-weight: 850;
  text-decoration: none;
}

.r360-medication-follow-card > span {
  display: block;
  color: #294a7d;
  font-size: 0.9rem;
  font-weight: 700;
}

.r360-medication-follow-card > strong {
  display: block;
  margin-top: 0.35rem;
  color: #119b35;
  font-size: 2rem;
  font-weight: 930;
}

.r360-medication-bars {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 0.65rem;
  align-items: end;
  min-height: 82px;
  margin-top: 0.4rem;
  border-bottom: 1px solid rgba(39, 93, 168, 0.12);
}

.r360-medication-bars i {
  --r360-bar: 0;
  position: relative;
  display: block;
  height: max(12px, calc(var(--r360-bar) * 0.72px));
  min-height: 12px;
  border-radius: 4px 4px 0 0;
  background: #28a94f;
}

.r360-medication-bars i span {
  position: absolute;
  left: 50%;
  bottom: -1.25rem;
  color: #375987;
  font-size: 0.68rem;
  font-style: normal;
  font-weight: 800;
  transform: translateX(-50%);
}

.r360-prescriptions-empty {
  display: grid;
  justify-items: start;
  gap: 0.8rem;
  padding: 1.4rem;
}

.r360-prescriptions-empty svg {
  width: 46px;
  height: 46px;
  color: #119b35;
}

.r360-prescriptions-empty h2 {
  margin: 0;
  color: #073769;
}

.r360-prescriptions-empty p {
  max-width: 720px;
  margin: 0;
  color: #536b98;
  line-height: 1.6;
}

.r360-medication-modal {
  width: min(620px, calc(100% - 2rem));
  max-height: calc(100vh - 2rem);
  padding: 0;
  border: 0;
  border-radius: 8px;
  box-shadow: 0 28px 90px rgba(10, 35, 70, 0.28);
}

.r360-medication-modal::backdrop {
  background: rgba(8, 27, 52, 0.48);
  backdrop-filter: blur(3px);
}

.r360-medication-modal__form {
  display: grid;
  gap: 1rem;
  padding: 1.1rem;
  color: #073769;
}

.r360-medication-modal header,
.r360-medication-modal footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.r360-medication-modal header strong {
  display: block;
  font-size: 1.25rem;
  font-weight: 930;
}

.r360-medication-modal header small {
  display: block;
  margin-top: 0.25rem;
  color: #536b98;
}

.r360-medication-modal header button {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 0;
  border-radius: 50%;
  color: #073769;
  background: #eef4fb;
  font-size: 1.35rem;
  cursor: pointer;
}

.r360-medication-source,
.r360-medication-modal__group {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.r360-medication-source label {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  min-height: 46px;
  padding: 0.7rem;
  border: 1px solid rgba(39, 93, 168, 0.14);
  border-radius: 8px;
  background: #f8fbff;
  font-weight: 800;
}

.r360-medication-modal__group[hidden] {
  display: none;
}

.r360-medication-modal__wide {
  grid-column: 1 / -1;
}

.r360-medication-modal label {
  display: grid;
  gap: 0.38rem;
  color: #073769;
  font-size: 0.86rem;
  font-weight: 850;
}

.r360-medication-modal input,
.r360-medication-modal select {
  width: 100%;
  min-height: 42px;
  padding: 0.65rem 0.75rem;
  border: 1px solid rgba(39, 93, 168, 0.16);
  border-radius: 8px;
  color: #18304d;
  background: #ffffff;
  font: inherit;
}

.r360-medication-cancel {
  border-color: rgba(39, 93, 168, 0.18);
  color: #536b98;
}

.r360-medication-submit {
  padding-inline: 1rem;
  color: #ffffff;
  background: #1476e8;
  border-color: #1476e8;
}

.r360-exercise-page {
  display: grid;
  gap: 1.15rem;
  min-width: 0;
}

.r360-exercise-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.r360-exercise-head h1 {
  margin: 0;
  color: #073769;
  font-size: 2.1rem;
  font-weight: 930;
  line-height: 1.08;
}

.r360-exercise-head > span {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  color: #164a85;
  font-size: 0.95rem;
  font-weight: 760;
}

.r360-exercise-head svg {
  width: 24px;
  height: 24px;
}

.r360-exercise-banner,
.r360-exercise-metric,
.r360-exercise-plan-card,
.r360-exercise-tip-card,
.r360-week-card,
.r360-daily-goal-card,
.r360-exercise-empty {
  border: 1px solid rgba(39, 93, 168, 0.13);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 16px 42px rgba(24, 48, 77, 0.06);
}

.r360-exercise-banner {
  display: grid;
  grid-template-columns: 78px minmax(320px, 1fr) minmax(300px, 360px) auto;
  gap: 1.2rem;
  align-items: center;
  min-height: 150px;
  padding: 1.05rem 1.25rem;
  border-color: rgba(70, 169, 87, 0.22);
  background: linear-gradient(90deg, rgba(236, 250, 238, 0.9), rgba(255, 255, 255, 0.9));
}

.r360-exercise-banner__icon {
  display: grid;
  width: 78px;
  height: 78px;
  place-items: center;
  border: 2px solid rgba(26, 159, 59, 0.45);
  border-radius: 8px;
  color: #119b35;
  background: rgba(255, 255, 255, 0.72);
}

.r360-exercise-banner__icon svg {
  width: 46px;
  height: 46px;
}

.r360-exercise-banner > div {
  min-width: 0;
}

.r360-exercise-banner strong {
  display: block;
  color: #079131;
  font-size: 1.2rem;
  font-weight: 930;
}

.r360-exercise-banner p {
  max-width: 640px;
  margin: 0.55rem 0 0;
  color: #153d70;
  font-size: 0.95rem;
  font-weight: 640;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

.r360-exercise-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin-top: 0.8rem;
}

.r360-exercise-tags em {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  min-height: 30px;
  padding: 0.25rem 0.65rem;
  border: 1px solid rgba(70, 169, 87, 0.18);
  border-radius: 999px;
  color: #164a85;
  background: rgba(255, 255, 255, 0.78);
  font-size: 0.82rem;
  font-style: normal;
  font-weight: 760;
}

.r360-exercise-tags svg {
  width: 17px;
  height: 17px;
  color: #1ba142;
}

.r360-exercise-illustration {
  display: flex;
  align-self: stretch;
  align-items: center;
  justify-content: center;
  min-width: 0;
}

.r360-exercise-illustration img {
  display: block;
  width: min(320px, 100%);
  max-height: 124px;
  height: auto;
  object-fit: contain;
  object-position: center right;
}

.r360-exercise-download,
.r360-exercise-register,
.r360-exercise-submit,
.r360-exercise-cancel {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-height: 42px;
  border: 1px solid rgba(26, 159, 59, 0.58);
  border-radius: 8px;
  color: #07852f;
  background: #ffffff;
  font: inherit;
  font-size: 0.9rem;
  font-weight: 850;
  cursor: pointer;
}

.r360-exercise-download-form {
  margin: 0;
  justify-self: end;
}

.r360-exercise-download {
  min-width: 168px;
  padding: 0 1rem;
}

.r360-exercise-download svg,
.r360-exercise-register svg {
  width: 22px;
  height: 22px;
}

.r360-exercise-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

.r360-exercise-metric {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  min-width: 0;
  min-height: 154px;
  padding: 1rem 1.15rem;
  color: #119b35;
}

.r360-exercise-metric--blue {
  color: #126ed8;
}

.r360-exercise-metric > svg {
  width: 32px;
  height: 32px;
}

.r360-exercise-metric span {
  color: #073769;
  font-size: 0.9rem;
  font-weight: 880;
}

.r360-exercise-metric strong {
  color: #073769;
  font-size: 1.7rem;
  font-weight: 930;
  line-height: 1;
}

.r360-exercise-metric strong small {
  font-size: 0.86rem;
  font-weight: 760;
}

.r360-exercise-metric em {
  color: #577098;
  font-size: 0.82rem;
  font-style: normal;
  font-weight: 650;
}

.r360-exercise-metric i {
  display: block;
  align-self: end;
  flex: 0 0 auto;
  height: 7px;
  width: 100%;
  margin-top: auto;
  overflow: hidden;
  border-radius: 999px;
  background: #dfece5;
}

.r360-exercise-metric i b {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: currentColor;
}

.r360-exercise-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.75fr) minmax(320px, 1fr);
  gap: 1.1rem;
  align-items: start;
}

.r360-exercise-plan-card {
  min-width: 0;
  overflow: hidden;
}

.r360-exercise-plan-card > header,
.r360-week-card header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.15rem 0.75rem;
}

.r360-exercise-plan-card h2,
.r360-exercise-tip-card h2,
.r360-week-card h2,
.r360-daily-goal-card h2 {
  margin: 0;
  color: #073769;
  font-size: 1.25rem;
  font-weight: 930;
}

.r360-exercise-register {
  min-width: 170px;
  border-color: #1976e8;
  color: #126ed8;
}

.r360-exercise-tabs {
  display: grid;
  grid-template-columns: repeat(8, minmax(86px, 1fr));
  margin: 0 1.15rem;
  overflow-x: auto;
  border: 1px solid rgba(39, 93, 168, 0.13);
  border-radius: 8px;
}

.r360-exercise-tabs button {
  min-height: 44px;
  border: 0;
  border-right: 1px solid rgba(39, 93, 168, 0.1);
  color: #153d70;
  background: #ffffff;
  font: inherit;
  font-size: 0.84rem;
  font-weight: 760;
  cursor: pointer;
}

.r360-exercise-tabs button:last-child {
  border-right: 0;
}

.r360-exercise-tabs button.is-active {
  color: #079131;
  box-shadow: inset 0 -3px 0 #20af43;
}

.r360-exercise-list {
  display: grid;
  padding-top: 0.75rem;
}

.r360-exercise-day {
  display: none;
}

.r360-exercise-day.is-active {
  display: grid;
}

.r360-exercise-row-app {
  display: grid;
  grid-template-columns: 46px 150px minmax(150px, 1fr) 96px 122px 36px;
  gap: 0.85rem;
  align-items: center;
  min-height: 58px;
  padding: 0.58rem 1.15rem;
  border-top: 1px solid rgba(39, 93, 168, 0.1);
}

.r360-exercise-row-app__icon {
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  color: #119b35;
}

.r360-exercise-row-app__icon svg {
  width: 28px;
  height: 28px;
}

.r360-exercise-row-app > div,
.r360-exercise-row-app p {
  min-width: 0;
}

.r360-exercise-row-app strong {
  color: #073769;
  font-size: 0.95rem;
  font-weight: 900;
  overflow-wrap: anywhere;
}

.r360-exercise-row-app small {
  display: block;
  margin-top: 0.22rem;
  color: #45618c;
  font-size: 0.78rem;
  font-weight: 650;
}

.r360-exercise-row-app p {
  margin: 0;
  color: #294a7d;
  font-size: 0.86rem;
  font-weight: 640;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.r360-exercise-row-app em {
  display: grid;
  gap: 0.15rem;
  color: #153d70;
  font-size: 0.84rem;
  font-style: normal;
  font-weight: 780;
  text-align: right;
}

.r360-exercise-row-app em small {
  margin: 0;
}

.r360-exercise-row-app .r360-plan-video-button,
.r360-meal-row .r360-plan-video-button {
  width: 100%;
  min-width: 0;
  white-space: nowrap;
}

.r360-exercise-row-app.is-completed .r360-exercise-quick-form button,
.r360-wellness-row.is-completed .r360-wellness-quick-form button {
  border-color: #1fa455;
  color: #ffffff;
  background: #1fa455;
}

.r360-exercise-quick-form button {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 0;
  border-radius: 50%;
  color: #126ed8;
  background: #eef6ff;
  cursor: pointer;
}

.r360-exercise-quick-form svg {
  width: 20px;
  height: 20px;
}

.r360-exercise-reminder {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  gap: 0.75rem;
  align-items: center;
  margin: 0.8rem 1.15rem 1rem;
  padding: 0.9rem 1rem;
  border-radius: 8px;
  color: #126ed8;
  background: linear-gradient(90deg, #edf6ff, #f7fbff);
}

.r360-exercise-reminder svg {
  width: 24px;
  height: 24px;
}

.r360-exercise-reminder span {
  color: #153d70;
  font-size: 0.9rem;
  font-weight: 680;
}

.r360-exercise-reminder strong {
  color: #126ed8;
  font-size: 0.9rem;
}

.r360-exercise-side {
  display: grid;
  gap: 1rem;
}

.r360-exercise-tip-card {
  position: relative;
  min-height: 225px;
  overflow: hidden;
  padding: 1.35rem;
  background: linear-gradient(135deg, rgba(240, 251, 242, 0.92), rgba(255, 255, 255, 0.98));
}

.r360-exercise-tip-card__tips {
  max-width: 270px;
  margin: 1.35rem 0 0;
}

.r360-exercise-tip-card__tips p {
  display: none;
  margin: 0;
  color: #294a7d;
  font-size: 0.92rem;
  line-height: 1.62;
}

.r360-exercise-tip-card__tips p.is-active {
  display: block;
}

.r360-exercise-tip-card > span {
  position: absolute;
  right: 2rem;
  bottom: 3.2rem;
  display: grid;
  width: 82px;
  height: 82px;
  place-items: center;
  border-radius: 8px;
  color: #22a848;
  background: rgba(255, 255, 255, 0.74);
}

.r360-exercise-tip-card > span svg {
  width: 54px;
  height: 54px;
}

.r360-exercise-tip-card__dots {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 1.1rem;
  display: flex;
  justify-content: center;
  gap: 0.6rem;
}

.r360-exercise-tip-card i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgba(70, 169, 87, 0.22);
}

.r360-exercise-tip-card i.is-active {
  background: #21a642;
}

.r360-week-card,
.r360-daily-goal-card {
  padding-bottom: 1rem;
}

.r360-week-card header a {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  color: #079131;
  font-size: 0.86rem;
  font-weight: 850;
  text-decoration: none;
}

.r360-week-chart {
  display: block;
  width: calc(100% - 2rem);
  height: 150px;
  margin: 0.25rem auto 0;
  color: #24a94a;
}

.r360-week-chart path {
  fill: none;
  stroke: rgba(39, 93, 168, 0.12);
  stroke-width: 0.8;
}

.r360-week-chart polyline {
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
}

.r360-week-chart circle {
  fill: currentColor;
}

.r360-week-chart text {
  fill: #375987;
  font-size: 0.35rem;
  font-weight: 800;
  text-anchor: middle;
}

.r360-daily-goal-card {
  padding: 1.15rem;
}

.r360-daily-goal-card > div {
  display: grid;
  grid-template-columns: 128px minmax(0, 1fr);
  gap: 1.2rem;
  align-items: center;
  margin-top: 1rem;
}

.r360-daily-ring {
  --r360-daily: 0;
  display: grid;
  width: 112px;
  height: 112px;
  place-items: center;
  border-radius: 50%;
  color: #173d72;
  background:
    radial-gradient(circle at center, #ffffff 0 58%, transparent 59%),
    conic-gradient(#24a94a calc(var(--r360-daily) * 1%), #e9edf0 0);
}

.r360-daily-ring svg {
  width: 44px;
  height: 44px;
}

.r360-daily-goal-card p {
  margin: 0;
}

.r360-daily-goal-card strong,
.r360-daily-goal-card em,
.r360-daily-goal-card p span {
  display: block;
}

.r360-daily-goal-card strong {
  color: #073769;
  font-size: 1.7rem;
  font-weight: 930;
}

.r360-daily-goal-card strong small {
  font-size: 1rem;
  font-weight: 760;
}

.r360-daily-goal-card em {
  margin-top: 0.55rem;
  color: #079131;
  font-size: 0.92rem;
  font-style: normal;
  font-weight: 850;
}

.r360-daily-goal-card span {
  margin-top: 0.45rem;
  color: #5a729a;
  font-size: 1rem;
  font-weight: 760;
}

.r360-exercise-empty {
  display: grid;
  justify-items: start;
  gap: 0.8rem;
  padding: 1.4rem;
}

.r360-exercise-empty svg {
  width: 46px;
  height: 46px;
  color: #119b35;
}

.r360-exercise-empty h2 {
  margin: 0;
  color: #073769;
}

.r360-exercise-empty p {
  max-width: 720px;
  margin: 0;
  color: #536b98;
  line-height: 1.6;
}

.r360-exercise-modal {
  width: min(620px, calc(100% - 2rem));
  max-height: calc(100vh - 2rem);
  padding: 0;
  border: 0;
  border-radius: 8px;
  box-shadow: 0 28px 90px rgba(10, 35, 70, 0.28);
}

.r360-exercise-modal::backdrop {
  background: rgba(8, 27, 52, 0.48);
  backdrop-filter: blur(3px);
}

.r360-exercise-modal__form {
  display: grid;
  gap: 1rem;
  padding: 1.1rem;
  color: #073769;
}

.r360-exercise-modal header,
.r360-exercise-modal footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.r360-exercise-modal header strong {
  display: block;
  font-size: 1.25rem;
  font-weight: 930;
}

.r360-exercise-modal header small {
  display: block;
  margin-top: 0.25rem;
  color: #536b98;
}

.r360-exercise-modal header button {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 0;
  border-radius: 50%;
  color: #073769;
  background: #eef4fb;
  font-size: 1.35rem;
  cursor: pointer;
}

.r360-exercise-source,
.r360-exercise-modal__group {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.r360-exercise-source label {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  min-height: 46px;
  padding: 0.7rem;
  border: 1px solid rgba(39, 93, 168, 0.14);
  border-radius: 8px;
  background: #f8fbff;
  font-weight: 800;
}

.r360-exercise-modal__group[hidden] {
  display: none;
}

.r360-exercise-modal__wide {
  grid-column: 1 / -1;
}

.r360-exercise-modal label {
  display: grid;
  gap: 0.38rem;
  color: #073769;
  font-size: 0.86rem;
  font-weight: 850;
}

.r360-exercise-modal input,
.r360-exercise-modal select {
  width: 100%;
  min-height: 42px;
  padding: 0.65rem 0.75rem;
  border: 1px solid rgba(39, 93, 168, 0.16);
  border-radius: 8px;
  color: #18304d;
  background: #ffffff;
  font: inherit;
}

.r360-exercise-cancel {
  border-color: rgba(39, 93, 168, 0.18);
  color: #536b98;
}

.r360-exercise-submit {
  padding-inline: 1rem;
  color: #ffffff;
  background: #1476e8;
  border-color: #1476e8;
}

.r360-wellness-page {
  display: grid;
  gap: 1.15rem;
  min-width: 0;
  max-width: 100%;
  color: #073769;
}

.r360-wellness-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.r360-wellness-head h1 {
  margin: 0;
  color: #1030b3;
  font-size: 2.25rem;
  font-weight: 940;
  line-height: 1.06;
  overflow-wrap: anywhere;
}

.r360-wellness-head > span {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  color: #123f7b;
  font-size: 0.96rem;
  font-weight: 780;
}

.r360-wellness-head svg {
  width: 24px;
  height: 24px;
}

.r360-wellness-banner,
.r360-wellness-metric,
.r360-wellness-plan-card,
.r360-wellness-tip-card,
.r360-next-wellness-card,
.r360-emotional-card,
.r360-wellness-resources-card,
.r360-wellness-empty {
  border: 1px solid rgba(39, 93, 168, 0.13);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 16px 42px rgba(24, 48, 77, 0.06);
}

.r360-wellness-banner {
  display: grid;
  grid-template-columns: 88px minmax(280px, 1fr) minmax(240px, 360px) auto;
  gap: 1.2rem;
  align-items: center;
  min-height: 138px;
  padding: 1.05rem 1.25rem;
  border-color: rgba(70, 169, 87, 0.24);
  background: linear-gradient(90deg, rgba(239, 251, 241, 0.96), rgba(255, 255, 255, 0.98));
}

.r360-wellness-banner__icon {
  display: grid;
  width: 82px;
  height: 82px;
  place-items: center;
  border: 2px solid rgba(26, 159, 59, 0.48);
  border-radius: 50%;
  color: #10963a;
  background: rgba(255, 255, 255, 0.78);
}

.r360-wellness-banner__icon svg {
  width: 52px;
  height: 52px;
}

.r360-wellness-banner > div {
  min-width: 0;
}

.r360-wellness-banner strong {
  display: block;
  color: #078d31;
  font-size: 1.2rem;
  font-weight: 930;
  overflow-wrap: anywhere;
}

.r360-wellness-banner p {
  max-width: 620px;
  margin: 0.5rem 0 0;
  color: #153d70;
  font-size: 0.96rem;
  font-weight: 650;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

.r360-wellness-illustration {
  display: flex;
  align-self: stretch;
  align-items: center;
  justify-content: center;
  min-width: 0;
}

.r360-wellness-illustration img {
  display: block;
  width: min(300px, 100%);
  max-height: 126px;
  height: auto;
  object-fit: contain;
  object-position: center right;
}

.r360-wellness-register,
.r360-wellness-activity-register,
.r360-wellness-submit,
.r360-wellness-cancel {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-height: 42px;
  border: 1px solid rgba(26, 159, 59, 0.6);
  border-radius: 8px;
  color: #07852f;
  background: #ffffff;
  font: inherit;
  font-size: 0.9rem;
  font-weight: 870;
  cursor: pointer;
}

.r360-wellness-register {
  min-width: 245px;
  padding: 0 1rem;
  justify-self: end;
}

.r360-wellness-register svg {
  width: 22px;
  height: 22px;
}

.r360-wellness-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

.r360-wellness-metric {
  display: flex;
  flex-direction: column;
  gap: 0.48rem;
  min-width: 0;
  min-height: 152px;
  padding: 1rem 1.15rem;
  color: #119b35;
}

.r360-wellness-metric--blue {
  color: #126ed8;
}

.r360-wellness-metric > svg {
  width: 34px;
  height: 34px;
}

.r360-wellness-metric span {
  color: #1030b3;
  font-size: 0.88rem;
  font-weight: 880;
}

.r360-wellness-metric strong {
  color: #1030b3;
  font-size: 1.75rem;
  font-weight: 940;
  line-height: 1;
}

.r360-wellness-metric strong small {
  font-size: 0.9rem;
  font-weight: 760;
}

.r360-wellness-metric em {
  color: #577098;
  font-size: 0.82rem;
  font-style: normal;
  font-weight: 650;
}

.r360-wellness-metric > button {
  align-self: start;
  min-height: 28px;
  padding: 0.2rem 0.55rem;
  border: 1px solid rgba(26, 159, 59, 0.18);
  border-radius: 999px;
  color: #07852f;
  background: #f1fbf3;
  font: inherit;
  font-size: 0.76rem;
  font-weight: 850;
  cursor: pointer;
}

.r360-wellness-metric i {
  display: block;
  align-self: end;
  flex: 0 0 auto;
  width: 100%;
  height: 7px;
  margin-top: auto;
  overflow: hidden;
  border-radius: 999px;
  background: #dfece5;
}

.r360-wellness-metric i b {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: currentColor;
}

.r360-wellness-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(340px, 1fr);
  gap: 1.1rem;
  align-items: start;
}

.r360-wellness-plan-card {
  min-width: 0;
  overflow: hidden;
}

.r360-wellness-layout > *,
.r360-wellness-side,
.r360-wellness-tip-card,
.r360-next-wellness-card,
.r360-emotional-card,
.r360-wellness-resources-card {
  min-width: 0;
}

.r360-wellness-plan-card > header,
.r360-next-wellness-card header,
.r360-emotional-card header,
.r360-wellness-resources-card header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.15rem 0.75rem;
}

.r360-wellness-plan-card h2,
.r360-wellness-tip-card h2,
.r360-next-wellness-card h2,
.r360-emotional-card h2,
.r360-wellness-resources-card h2 {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  margin: 0;
  color: #1030b3;
  font-size: 1.18rem;
  font-weight: 930;
}

.r360-wellness-plan-card h2 svg,
.r360-wellness-tip-card h2 svg,
.r360-next-wellness-card h2 svg,
.r360-emotional-card h2 svg,
.r360-wellness-resources-card h2 svg {
  width: 23px;
  height: 23px;
  color: #126ed8;
}

.r360-wellness-activity-register {
  min-width: 160px;
  border-color: #119b35;
}

.r360-wellness-tabs {
  display: grid;
  grid-template-columns: repeat(8, minmax(76px, 1fr));
  min-width: 0;
  max-width: calc(100% - 2.3rem);
  margin: 0 1.15rem;
  overflow-x: auto;
  border: 1px solid rgba(39, 93, 168, 0.13);
  border-radius: 8px;
}

.r360-wellness-tabs button {
  min-height: 44px;
  border: 0;
  border-right: 1px solid rgba(39, 93, 168, 0.1);
  color: #153d70;
  background: #ffffff;
  font: inherit;
  font-size: 0.84rem;
  font-weight: 760;
  cursor: pointer;
}

.r360-wellness-tabs button:last-child {
  border-right: 0;
}

.r360-wellness-tabs button.is-active {
  color: #079131;
  box-shadow: inset 0 -3px 0 #20af43;
}

.r360-wellness-list {
  display: grid;
  padding-top: 0.8rem;
}

.r360-wellness-day {
  display: none;
}

.r360-wellness-day.is-active {
  display: grid;
}

.r360-wellness-day-title {
  padding: 0.15rem 1.15rem 0.7rem;
  color: #1030b3;
  font-size: 0.9rem;
  font-weight: 900;
}

.r360-wellness-row {
  display: grid;
  grid-template-columns: 86px 42px minmax(0, 1fr) 68px 36px;
  gap: 0.8rem;
  align-items: center;
  min-height: 64px;
  padding: 0.58rem 1.15rem;
  border-top: 1px solid rgba(39, 93, 168, 0.1);
}

.r360-wellness-row__time {
  color: #1030b3;
  font-size: 0.84rem;
  font-weight: 850;
}

.r360-wellness-row__icon {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  color: #119b35;
}

.r360-wellness-row__icon svg {
  width: 28px;
  height: 28px;
}

.r360-wellness-row > div {
  min-width: 0;
}

.r360-wellness-row strong {
  display: block;
  color: #1030b3;
  font-size: 0.93rem;
  font-weight: 910;
  overflow-wrap: anywhere;
}

.r360-wellness-row small {
  display: block;
  margin-top: 0.2rem;
  color: #45618c;
  font-size: 0.78rem;
  font-weight: 650;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.r360-wellness-row em {
  min-width: 58px;
  padding: 0.35rem 0.45rem;
  border-radius: 8px;
  color: #07852f;
  background: #e9f8ec;
  font-size: 0.78rem;
  font-style: normal;
  font-weight: 880;
  text-align: center;
}

.r360-wellness-quick-form {
  margin: 0;
}

.r360-wellness-quick-form button {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border: 1.8px solid rgba(16, 48, 179, 0.58);
  border-radius: 50%;
  background: #ffffff;
  cursor: pointer;
}

.r360-wellness-quick-form button:hover,
.r360-wellness-quick-form button:focus-visible {
  border-color: #20af43;
  background: radial-gradient(circle at center, #20af43 0 32%, #ffffff 34%);
  outline: none;
}

.r360-wellness-all {
  display: inline-flex;
  align-items: center;
  justify-self: center;
  gap: 0.4rem;
  margin: 1rem 1.15rem 1.15rem;
  color: #1237c4;
  font-size: 0.9rem;
  font-weight: 850;
  text-decoration: none;
}

.r360-wellness-all svg {
  width: 18px;
  height: 18px;
}

.r360-wellness-side {
  display: grid;
  gap: 1rem;
}

.r360-wellness-tip-card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(130px, 190px);
  gap: 1rem;
  min-height: 205px;
  overflow: hidden;
  padding: 1.25rem 1.25rem 2.3rem;
  background: linear-gradient(135deg, rgba(241, 251, 243, 0.94), rgba(255, 255, 255, 0.98));
}

.r360-wellness-tip-card__tips {
  display: grid;
  max-width: 310px;
  min-height: 74px;
  margin: 1rem 0 0;
}

.r360-wellness-tip-card__tips p {
  display: none;
  margin: 0;
  padding: 0.85rem 1rem;
  border-radius: 8px;
  color: #07852f;
  background: #e8f7e9;
  font-size: 0.92rem;
  font-weight: 760;
  line-height: 1.45;
}

.r360-wellness-tip-card__tips p.is-active {
  display: block;
}

.r360-wellness-tip-card small {
  display: block;
  margin-top: 0.8rem;
  color: #1237c4;
  font-size: 0.86rem;
  font-weight: 760;
}

.r360-wellness-tip-card img {
  align-self: center;
  justify-self: end;
  width: min(180px, 100%);
  max-height: 155px;
  object-fit: contain;
}

.r360-wellness-tip-card__dots {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 1rem;
  display: flex;
  justify-content: center;
  gap: 0.55rem;
}

.r360-wellness-tip-card__dots i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgba(70, 169, 87, 0.22);
}

.r360-wellness-tip-card__dots i.is-active {
  background: #21a642;
}

.r360-next-wellness-card,
.r360-emotional-card,
.r360-wellness-resources-card {
  overflow: hidden;
}

.r360-next-wellness-card header a,
.r360-emotional-card header a,
.r360-wellness-resources-card header button {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  border: 0;
  color: #079131;
  background: transparent;
  font: inherit;
  font-size: 0.84rem;
  font-weight: 850;
  text-decoration: none;
  cursor: pointer;
}

.r360-next-wellness-card header svg,
.r360-emotional-card header svg,
.r360-wellness-resources-card header svg {
  width: 18px;
  height: 18px;
}

.r360-next-wellness-card > div {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr) 132px;
  gap: 1rem;
  align-items: center;
  padding: 0.2rem 1.15rem 1.1rem;
}

.r360-next-wellness-card > div > span {
  display: grid;
  width: 70px;
  height: 70px;
  place-items: center;
  border-radius: 50%;
  color: #1030b3;
  background: #eef4ff;
}

.r360-next-wellness-card > div > span svg {
  width: 38px;
  height: 38px;
}

.r360-next-wellness-card p {
  min-width: 0;
  margin: 0;
}

.r360-next-wellness-card small,
.r360-next-wellness-card strong,
.r360-next-wellness-card em,
.r360-next-wellness-card b {
  display: block;
}

.r360-next-wellness-card small,
.r360-next-wellness-card b {
  color: #31537f;
  font-size: 0.83rem;
  font-weight: 720;
}

.r360-next-wellness-card strong {
  color: #1030b3;
  font-size: 1rem;
  font-weight: 930;
}

.r360-next-wellness-card em {
  color: #1030b3;
  font-style: normal;
  font-weight: 850;
}

.r360-next-wellness-card > div > div {
  display: grid;
  gap: 0.45rem;
}

.r360-next-wellness-card i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  min-height: 30px;
  padding: 0.25rem 0.55rem;
  border-radius: 8px;
  color: #07852f;
  background: #e8f7e9;
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 850;
}

.r360-next-wellness-card i.is-blue {
  color: #126ed8;
  background: #e8f1ff;
}

.r360-emotional-card > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 154px;
  gap: 1rem;
  padding: 0.2rem 1.15rem 1.15rem;
}

.r360-emotional-card span,
.r360-emotional-card p span {
  color: #1030b3;
  font-size: 0.8rem;
  font-weight: 820;
}

.r360-mood-chart {
  display: block;
  width: 100%;
  height: 110px;
  margin-top: 0.45rem;
  color: #22a848;
}

.r360-mood-chart path {
  fill: none;
  stroke: rgba(39, 93, 168, 0.12);
  stroke-width: 0.8;
}

.r360-mood-chart polyline {
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
}

.r360-mood-chart circle {
  fill: currentColor;
}

.r360-mood-chart text {
  fill: #375987;
  font-size: 0.35rem;
  font-weight: 800;
  text-anchor: middle;
}

.r360-emotional-card p {
  align-self: center;
  margin: 0;
  padding-left: 1rem;
  border-left: 1px solid rgba(39, 93, 168, 0.1);
}

.r360-emotional-card strong {
  display: block;
  margin-top: 0.5rem;
  color: #1030b3;
  font-size: 1.7rem;
  font-weight: 940;
}

.r360-emotional-card strong small {
  font-size: 0.95rem;
  font-weight: 760;
}

.r360-emotional-card em {
  display: inline-block;
  margin-top: 0.55rem;
  padding: 0.42rem 0.62rem;
  border-radius: 8px;
  color: #07852f;
  background: #e8f7e9;
  font-size: 0.78rem;
  font-style: normal;
  font-weight: 850;
}

.r360-wellness-resources-card > div {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
  padding: 0.1rem 1.15rem 1.15rem;
}

.r360-wellness-resources-card > div button {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 0.55rem;
  align-items: center;
  min-width: 0;
  min-height: 76px;
  padding: 0.7rem;
  border: 1px solid rgba(39, 93, 168, 0.12);
  border-radius: 8px;
  color: #1030b3;
  background: #ffffff;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.r360-wellness-resources-card > div button > svg {
  grid-row: 1 / span 2;
  width: 34px;
  height: 34px;
  color: #119b35;
}

.r360-wellness-resources-card strong {
  min-width: 0;
  color: #1030b3;
  font-size: 0.76rem;
  font-weight: 900;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.r360-wellness-resources-card span {
  display: inline-flex;
  align-self: start;
  justify-self: start;
  padding: 0.25rem 0.45rem;
  border-radius: 6px;
  color: #126ed8;
  background: #e8f1ff;
  font-size: 0.68rem;
  font-weight: 850;
}

.r360-wellness-empty {
  display: grid;
  justify-items: start;
  gap: 0.8rem;
  padding: 1.4rem;
}

.r360-wellness-empty svg {
  width: 58px;
  height: 58px;
  color: #119b35;
}

.r360-wellness-empty h2 {
  margin: 0;
  color: #1030b3;
  font-size: 1.55rem;
}

.r360-wellness-empty p {
  max-width: 720px;
  margin: 0;
  color: #536b98;
  line-height: 1.6;
}

.r360-wellness-modal {
  width: min(680px, calc(100% - 2rem));
  max-height: calc(100vh - 2rem);
  padding: 0;
  border: 0;
  border-radius: 8px;
  box-shadow: 0 28px 90px rgba(10, 35, 70, 0.28);
}

.r360-wellness-modal::backdrop {
  background: rgba(8, 27, 52, 0.48);
  backdrop-filter: blur(3px);
}

.r360-wellness-modal__form {
  display: grid;
  gap: 1rem;
  padding: 1.1rem;
  color: #073769;
}

.r360-wellness-modal header,
.r360-wellness-modal footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.r360-wellness-modal header strong {
  display: block;
  color: #1030b3;
  font-size: 1.25rem;
  font-weight: 930;
}

.r360-wellness-modal header small {
  display: block;
  margin-top: 0.25rem;
  color: #536b98;
}

.r360-wellness-modal header button {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 0;
  border-radius: 50%;
  color: #073769;
  background: #eef4fb;
  font-size: 1.35rem;
  cursor: pointer;
}

.r360-mood-scale {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.65rem;
}

.r360-mood-scale label {
  display: grid;
  justify-items: center;
  gap: 0.35rem;
  min-height: 112px;
  padding: 0.75rem 0.45rem;
  border: 1px solid rgba(39, 93, 168, 0.14);
  border-radius: 8px;
  color: #1030b3;
  background: #f8fbff;
  cursor: pointer;
}

.r360-mood-scale input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.r360-mood-scale span {
  display: grid;
  width: 46px;
  height: 46px;
  place-items: center;
  border-radius: 50%;
  color: #07852f;
  background: #e8f7e9;
  font-size: 1rem;
  font-weight: 930;
}

.r360-mood-scale em {
  color: #31537f;
  font-size: 0.78rem;
  font-style: normal;
  font-weight: 850;
  text-align: center;
}

.r360-mood-scale label:has(input:checked) {
  border-color: rgba(26, 159, 59, 0.46);
  background: #f0fbf2;
  box-shadow: inset 0 0 0 1px rgba(26, 159, 59, 0.16);
}

.r360-wellness-source,
.r360-wellness-modal__group {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.r360-wellness-source label {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  min-height: 46px;
  padding: 0.7rem;
  border: 1px solid rgba(39, 93, 168, 0.14);
  border-radius: 8px;
  background: #f8fbff;
  font-weight: 800;
}

.r360-wellness-modal__group[hidden] {
  display: none;
}

.r360-wellness-modal__wide {
  grid-column: 1 / -1;
}

.r360-wellness-modal label {
  display: grid;
  gap: 0.38rem;
  color: #073769;
  font-size: 0.86rem;
  font-weight: 850;
}

.r360-wellness-modal input,
.r360-wellness-modal select {
  width: 100%;
  min-height: 42px;
  padding: 0.65rem 0.75rem;
  border: 1px solid rgba(39, 93, 168, 0.16);
  border-radius: 8px;
  color: #18304d;
  background: #ffffff;
  font: inherit;
}

.r360-wellness-cancel {
  border-color: rgba(39, 93, 168, 0.18);
  color: #536b98;
}

.r360-wellness-submit {
  padding-inline: 1rem;
  color: #ffffff;
  background: #119b35;
  border-color: #119b35;
}

.r360-places-page {
  display: grid;
  gap: 1.15rem;
  min-width: 0;
  max-width: 100%;
  color: #0c2eb2;
}

.r360-places-page > * {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.r360-places-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.r360-places-head h1 {
  margin: 0;
  color: #1030b3;
  font-size: 2.25rem;
  font-weight: 940;
  line-height: 1.06;
  overflow-wrap: anywhere;
}

.r360-places-head > span {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  color: #123f7b;
  font-size: 0.96rem;
  font-weight: 780;
}

.r360-places-head svg {
  width: 24px;
  height: 24px;
}

.r360-places-banner,
.r360-places-metrics article,
.r360-places-filters,
.r360-places-map-card,
.r360-places-list-card,
.r360-places-warning {
  border: 1px solid rgba(39, 93, 168, 0.13);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 16px 42px rgba(24, 48, 77, 0.06);
}

.r360-places-banner {
  display: grid;
  grid-template-columns: minmax(190px, 255px) minmax(0, 1fr) auto;
  gap: 1.25rem;
  align-items: center;
  min-width: 0;
  min-height: 138px;
  padding: 0.9rem 1.25rem;
  border-color: rgba(70, 169, 87, 0.24);
  background: linear-gradient(90deg, rgba(239, 251, 241, 0.96), rgba(255, 255, 255, 0.98));
}

.r360-places-banner > * {
  min-width: 0;
}

.r360-places-banner__art {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  height: 118px;
}

.r360-places-banner__art img {
  display: block;
  width: min(255px, 100%);
  max-height: 118px;
  object-fit: contain;
  object-position: center left;
}

.r360-places-banner strong {
  display: block;
  color: #078d31;
  font-size: 1.25rem;
  font-weight: 930;
  overflow-wrap: anywhere;
}

.r360-places-banner p {
  max-width: 520px;
  margin: 0.48rem 0 0;
  color: #1237c4;
  font-size: 0.98rem;
  font-weight: 650;
  line-height: 1.52;
  overflow-wrap: anywhere;
}

.r360-places-full-map,
.r360-places-filters button,
.r360-places-more {
  display: inline-flex;
  box-sizing: border-box;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  min-height: 44px;
  border: 1px solid rgba(26, 159, 59, 0.58);
  border-radius: 8px;
  color: #07852f;
  background: #ffffff;
  font: inherit;
  font-size: 0.9rem;
  font-weight: 870;
  line-height: 1.15;
  overflow-wrap: anywhere;
  cursor: pointer;
}

.r360-places-full-map {
  min-width: 214px;
  max-width: 100%;
  padding: 0 1rem;
  justify-self: end;
}

.r360-places-full-map svg,
.r360-places-filters button svg,
.r360-places-more svg {
  width: 22px;
  height: 22px;
}

.r360-places-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

.r360-places-metrics article {
  display: grid;
  grid-template-columns: 70px minmax(0, 1fr);
  gap: 0.25rem 0.95rem;
  align-items: center;
  min-width: 0;
  min-height: 126px;
  padding: 1rem 1.15rem;
  color: #119b35;
}

.r360-places-metrics article > svg {
  grid-row: 1 / span 4;
  width: 58px;
  height: 58px;
  padding: 0.7rem;
  border-radius: 50%;
  background: #eaf7ed;
}

.r360-places-metric--blue {
  color: #126ed8;
}

.r360-places-metric--blue > svg {
  background: #eef4ff;
}

.r360-places-metrics span {
  color: #1030b3;
  font-size: 0.84rem;
  font-weight: 880;
}

.r360-places-metrics strong {
  color: #1030b3;
  font-size: 1.62rem;
  font-weight: 940;
  line-height: 1;
}

.r360-places-metrics strong b {
  font: inherit;
}

.r360-places-metrics em {
  color: #1237c4;
  font-size: 0.8rem;
  font-style: normal;
  font-weight: 650;
}

.r360-places-metrics i {
  display: block;
  width: 100%;
  height: 7px;
  margin-top: 0.35rem;
  overflow: hidden;
  border-radius: 999px;
  background: #dfece5;
}

.r360-places-metrics i b {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: currentColor;
}

.r360-places-filters {
  display: grid;
  grid-template-columns: minmax(260px, 1.35fr) minmax(180px, 0.65fr) minmax(190px, 0.65fr) auto;
  gap: 1rem;
  align-items: center;
  padding: 1rem;
}

.r360-places-filters label {
  box-sizing: border-box;
  min-width: 0;
}

.r360-places-search {
  display: grid;
  box-sizing: border-box;
  grid-template-columns: 34px minmax(0, 1fr);
  align-items: center;
  min-height: 54px;
  padding: 0 0.85rem;
  border: 1px solid rgba(39, 93, 168, 0.16);
  border-radius: 8px;
  color: #647196;
  background: #ffffff;
}

.r360-places-search svg {
  width: 22px;
  height: 22px;
}

.r360-places-filters input,
.r360-places-filters select {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 54px;
  border: 1px solid rgba(39, 93, 168, 0.16);
  border-radius: 8px;
  color: #1030b3;
  background: #ffffff;
  font: inherit;
  font-size: 0.96rem;
  font-weight: 650;
}

.r360-places-search input {
  min-height: 50px;
  border: 0;
  outline: none;
}

.r360-places-filters label:not(.r360-places-search) {
  display: grid;
  align-content: center;
  gap: 0.12rem;
  min-height: 54px;
  padding: 0.42rem 0.85rem 0.36rem;
  border: 1px solid rgba(39, 93, 168, 0.16);
  border-radius: 8px;
  background: #ffffff;
}

.r360-places-filters label:not(.r360-places-search) span {
  color: #1237c4;
  font-size: 0.76rem;
  font-weight: 850;
  line-height: 1;
}

.r360-places-filters select {
  min-height: 26px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  line-height: 1.15;
  outline: none;
}

.r360-places-filters button {
  min-width: 142px;
  max-width: 100%;
  padding: 0 0.9rem;
  color: #126ed8;
  border-color: rgba(18, 110, 216, 0.34);
}

.r360-places-warning {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.9rem 1rem;
  color: #8a5a00;
  background: #fff8e6;
}

.r360-places-warning svg {
  width: 24px;
  height: 24px;
  flex: 0 0 auto;
}

.r360-places-layout {
  display: grid;
  grid-template-columns: minmax(360px, 0.92fr) minmax(420px, 1.08fr);
  gap: 1.15rem;
  align-items: stretch;
}

.r360-places-layout > * {
  min-width: 0;
}

.r360-places-map-card {
  overflow: hidden;
  min-height: 520px;
}

.r360-places-map,
.r360-places-dialog__map {
  width: 100%;
  height: 100%;
  min-height: 520px;
  background: #eef4f0;
}

.r360-places-map-placeholder {
  display: grid;
  min-height: 520px;
  place-items: center;
  align-content: center;
  gap: 0.65rem;
  padding: 1.2rem;
  color: #119b35;
  text-align: center;
  background:
    linear-gradient(135deg, rgba(228, 242, 233, 0.74), rgba(255, 255, 255, 0.4)),
    repeating-linear-gradient(45deg, rgba(39, 93, 168, 0.08) 0 2px, transparent 2px 32px);
}

.r360-places-map-placeholder svg {
  width: 76px;
  height: 76px;
}

.r360-places-map-placeholder strong {
  color: #1030b3;
  font-size: 1.1rem;
  font-weight: 930;
}

.r360-places-map-placeholder span {
  max-width: 20rem;
  color: #536b98;
  font-weight: 700;
}

.r360-places-list-card {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  min-height: 520px;
  padding: 1.15rem 1.35rem;
}

.r360-places-list-card h2 {
  margin: 0 0 0.8rem;
  color: #1030b3;
  font-size: 1.25rem;
  font-weight: 930;
}

.r360-places-list {
  display: grid;
  align-content: start;
  min-height: 0;
  overflow: auto;
}

.r360-place-row {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) 72px 38px;
  gap: 0.85rem;
  align-items: center;
  min-height: 78px;
  padding: 0.8rem 0;
  border-top: 1px solid rgba(39, 93, 168, 0.12);
  transition: background 160ms ease;
}

.r360-place-row:first-child {
  border-top: 0;
}

.r360-place-row.is-highlighted {
  background: #f1fbf3;
}

.r360-place-row__icon {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
}

.r360-place-row__icon svg {
  width: 34px;
  height: 34px;
}

.r360-place-row strong {
  display: block;
  color: #1237c4;
  font-size: 0.96rem;
  font-weight: 910;
  overflow-wrap: anywhere;
}

.r360-place-row small {
  display: block;
  margin-top: 0.22rem;
  color: #536b98;
  font-size: 0.8rem;
  font-weight: 650;
  line-height: 1.35;
}

.r360-place-row em {
  color: #07852f;
  font-size: 0.92rem;
  font-style: normal;
  font-weight: 900;
  text-align: right;
}

.r360-place-row button {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 0;
  border-radius: 50%;
  color: #6672a0;
  background: transparent;
  cursor: pointer;
}

.r360-place-row button svg {
  width: 27px;
  height: 27px;
}

.r360-place-row button.is-favorite {
  color: #119b35;
  background: #e8f7e9;
}

.r360-places-empty {
  margin: 0;
  padding: 1rem 0;
  color: #536b98;
  font-weight: 700;
}

.r360-places-more {
  justify-self: center;
  margin-top: 0.9rem;
  border: 0;
  color: #1237c4;
}

.r360-places-dialog {
  width: min(1120px, calc(100% - 2rem));
  height: min(780px, calc(100vh - 2rem));
  padding: 0;
  border: 0;
  border-radius: 8px;
  box-shadow: 0 28px 90px rgba(10, 35, 70, 0.28);
}

.r360-places-dialog::backdrop {
  background: rgba(8, 27, 52, 0.48);
  backdrop-filter: blur(3px);
}

.r360-places-dialog__inner {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  height: 100%;
  background: #ffffff;
}

.r360-places-dialog header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.95rem 1rem;
  color: #1030b3;
  font-size: 1.12rem;
  font-weight: 930;
}

.r360-places-dialog header button {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 0;
  border-radius: 50%;
  color: #073769;
  background: #eef4fb;
  font: inherit;
  font-size: 1.35rem;
  cursor: pointer;
}

.r360-places-dialog__map {
  min-height: 0;
}

.r360-consultations-page {
  display: grid;
  gap: 1.35rem;
  color: #073568;
}

.r360-consultations-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.r360-consultations-head h1 {
  margin: 0;
  color: #073568;
  font-size: clamp(2.1rem, 3vw, 3.2rem);
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1;
}

.r360-consultations-head > span {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  color: #0a3d78;
  font-size: 0.92rem;
  font-weight: 850;
  white-space: nowrap;
}

.r360-consultations-head svg {
  width: 22px;
  height: 22px;
}

.r360-consultations-banner,
.r360-consultations-metric,
.r360-consultations-history-card,
.r360-upcoming-consultations-card,
.r360-consultations-tip-card,
.r360-consultation-prep-card,
.r360-consultations-empty {
  border: 1px solid rgba(20, 98, 176, 0.14);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 22px 54px rgba(19, 58, 105, 0.08);
}

.r360-consultations-banner {
  display: grid;
  grid-template-columns: 96px minmax(260px, 0.9fr) minmax(260px, 1fr) auto;
  align-items: center;
  gap: 1.35rem;
  min-height: 164px;
  padding: 1.45rem 1.55rem;
  overflow: hidden;
  background:
    linear-gradient(90deg, rgba(235, 250, 239, 0.94), rgba(255, 255, 255, 0.96) 58%, rgba(245, 252, 247, 0.94)),
    #ffffff;
}

.r360-consultations-banner__icon {
  display: grid;
  place-items: center;
  width: 82px;
  height: 82px;
  border: 2px solid rgba(22, 163, 74, 0.7);
  border-radius: 8px;
  color: #11983b;
  background: rgba(255, 255, 255, 0.82);
}

.r360-consultations-banner__icon svg {
  width: 52px;
  height: 52px;
}

.r360-consultations-banner > div {
  min-width: 0;
}

.r360-consultations-banner strong {
  display: block;
  margin-bottom: 0.55rem;
  color: #0b9f3a;
  font-size: 1.28rem;
  font-weight: 900;
  letter-spacing: 0;
}

.r360-consultations-banner p {
  max-width: 34rem;
  margin: 0;
  color: #0e3d78;
  font-size: 1rem;
  font-weight: 720;
  line-height: 1.55;
}

.r360-consultations-illustration {
  justify-self: center;
  width: min(100%, 420px);
  height: 128px;
  overflow: hidden;
}

.r360-consultations-illustration img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  mix-blend-mode: multiply;
}

.r360-consultations-history {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.65rem;
  min-width: 176px;
  min-height: 52px;
  padding: 0.75rem 1.15rem;
  border: 2px solid rgba(22, 163, 74, 0.78);
  border-radius: 8px;
  color: #0c9c38;
  font-weight: 900;
  text-decoration: none;
  background: rgba(255, 255, 255, 0.76);
}

.r360-consultations-history svg {
  width: 23px;
  height: 23px;
}

.r360-consultations-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

.r360-consultations-metric {
  display: grid;
  align-content: center;
  gap: 0.45rem;
  min-height: 176px;
  padding: 1.35rem;
}

.r360-consultations-metric--blue {
  --r360-metric-accent: #1478f2;
}

.r360-consultations-metric:not(.r360-consultations-metric--blue) {
  --r360-metric-accent: #18a64a;
}

.r360-consultations-metric > svg {
  width: 40px;
  height: 40px;
  color: var(--r360-metric-accent);
}

.r360-consultations-metric span:not(.r360-consultations-ring) {
  color: #073568;
  font-size: 0.9rem;
  font-weight: 900;
}

.r360-consultations-metric strong {
  color: #073568;
  font-size: 2rem;
  font-weight: 950;
  letter-spacing: 0;
  line-height: 1.05;
}

.r360-consultations-metric strong small {
  font-size: 0.92rem;
  font-weight: 800;
}

.r360-consultations-metric em {
  color: #4d6593;
  font-size: 0.86rem;
  font-style: normal;
  font-weight: 760;
}

.r360-consultations-metric i {
  display: block;
  height: 7px;
  margin-top: 0.45rem;
  overflow: hidden;
  border-radius: 999px;
  background: #dceee7;
}

.r360-consultations-metric i b {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--r360-metric-accent);
}

.r360-consultations-metric--compliance {
  grid-template-columns: 96px minmax(0, 1fr);
  align-items: center;
}

.r360-consultations-ring {
  display: grid;
  place-items: center;
  width: 92px;
  height: 92px;
  border-radius: 50%;
  color: #13a143;
  font-size: 1.25rem;
  font-weight: 950;
  background:
    radial-gradient(circle at center, #ffffff 0 55%, transparent 56%),
    conic-gradient(#19a64a calc(var(--r360-consultations-compliance, 0) * 1%), #dfeee7 0);
}

.r360-consultations-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(330px, 0.9fr);
  gap: 1rem;
  align-items: start;
}

.r360-consultations-history-card,
.r360-upcoming-consultations-card,
.r360-consultations-tip-card,
.r360-consultation-prep-card {
  overflow: hidden;
}

.r360-consultations-history-card > header,
.r360-upcoming-consultations-card header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.1rem 1.2rem;
  border-bottom: 1px solid rgba(20, 98, 176, 0.12);
}

.r360-consultations-history-card h2,
.r360-upcoming-consultations-card h2,
.r360-consultations-tip-card h2,
.r360-consultation-prep-card h2 {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  margin: 0;
  color: #073568;
  font-size: 1.25rem;
  font-weight: 950;
  letter-spacing: 0;
  line-height: 1.15;
}

.r360-consultations-history-card h2 svg,
.r360-upcoming-consultations-card h2 svg {
  width: 25px;
  height: 25px;
  color: #126fe5;
}

.r360-consultations-history-card header a,
.r360-upcoming-consultations-card header a {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  color: #1273eb;
  font-size: 0.83rem;
  font-weight: 900;
  text-decoration: none;
  white-space: nowrap;
}

.r360-consultations-history-card header a svg,
.r360-upcoming-consultations-card header a svg {
  width: 18px;
  height: 18px;
}

.r360-consultations-history-list {
  display: grid;
}

.r360-consultation-row {
  display: grid;
  grid-template-columns: 74px 54px minmax(128px, 0.9fr) minmax(190px, 1.3fr) minmax(146px, 0.85fr) 24px;
  align-items: center;
  gap: 1rem;
  min-height: 92px;
  padding: 0.8rem 1rem;
  border-bottom: 1px solid rgba(20, 98, 176, 0.11);
}

.r360-consultation-row:last-child {
  border-bottom: 0;
}

.r360-consultation-row time,
.r360-upcoming-consultation time {
  display: grid;
  place-items: center;
  align-content: center;
  width: 62px;
  min-height: 64px;
  padding: 0.35rem;
  border-radius: 8px;
  color: #0b2da3;
  background: #f2f7ff;
}

.r360-consultation-row time strong,
.r360-upcoming-consultation time strong {
  font-size: 1.05rem;
  font-weight: 950;
  line-height: 1;
}

.r360-consultation-row time span,
.r360-consultation-row time em,
.r360-upcoming-consultation time span {
  font-size: 0.69rem;
  font-style: normal;
  font-weight: 900;
  line-height: 1.1;
}

.r360-consultation-row__icon {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  color: #16a34a;
}

.r360-consultation-row__icon svg {
  width: 38px;
  height: 38px;
}

.r360-consultation-row__meta,
.r360-consultation-row p,
.r360-consultation-row__diagnosis {
  min-width: 0;
}

.r360-consultation-row__meta strong,
.r360-upcoming-consultation div span {
  display: block;
  color: #0a2d79;
  font-weight: 950;
  line-height: 1.25;
}

.r360-consultation-row__meta small,
.r360-upcoming-consultation div small {
  display: block;
  margin-top: 0.15rem;
  color: #103a79;
  font-size: 0.78rem;
  font-weight: 760;
}

.r360-consultation-row p {
  margin: 0;
  color: #123f7c;
  font-size: 0.86rem;
  font-weight: 740;
  line-height: 1.45;
}

.r360-consultation-row__diagnosis span {
  display: block;
  margin-bottom: 0.32rem;
  color: #0a2d79;
  font-size: 0.72rem;
  font-weight: 850;
}

.r360-consultation-row__diagnosis em {
  display: inline-flex;
  max-width: 100%;
  padding: 0.42rem 0.7rem;
  border-radius: 6px;
  color: #0a7c30;
  font-size: 0.78rem;
  font-style: normal;
  font-weight: 850;
  background: #e4f6e8;
}

.r360-consultation-row > a,
.r360-upcoming-consultation > a {
  display: grid;
  place-items: center;
  color: #0d5fe4;
}

.r360-consultation-row > a svg,
.r360-upcoming-consultation > a svg {
  width: 22px;
  height: 22px;
}

.r360-consultations-side {
  display: grid;
  gap: 1rem;
}

.r360-upcoming-consultations-list {
  display: grid;
}

.r360-upcoming-consultation {
  display: grid;
  grid-template-columns: 66px minmax(0, 1fr) auto 22px;
  align-items: center;
  gap: 0.85rem;
  min-height: 78px;
  padding: 0.72rem 0.92rem;
  border-bottom: 1px solid rgba(20, 98, 176, 0.11);
}

.r360-upcoming-consultation:first-child {
  background: linear-gradient(90deg, rgba(228, 248, 232, 0.9), rgba(255, 255, 255, 0.72));
}

.r360-upcoming-consultation:last-child {
  border-bottom: 0;
}

.r360-upcoming-consultation div strong {
  display: block;
  color: #0630af;
  font-size: 0.9rem;
  font-weight: 950;
}

.r360-consultation-mode {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  min-width: 118px;
  min-height: 32px;
  padding: 0.38rem 0.62rem;
  border-radius: 6px;
  color: #13933d;
  font-size: 0.72rem;
  font-style: normal;
  font-weight: 950;
  background: #e6f7e9;
}

.r360-consultation-mode--videollamada {
  color: #126fe5;
  background: #e7f1ff;
}

.r360-consultation-mode svg {
  width: 17px;
  height: 17px;
}

.r360-consultations-side-empty {
  margin: 0;
  padding: 1rem;
  color: #4d6593;
  font-weight: 780;
}

.r360-consultations-tip-card {
  position: relative;
  display: grid;
  min-height: 190px;
  padding: 1.45rem 1.5rem;
  overflow: hidden;
  background:
    linear-gradient(115deg, rgba(239, 252, 244, 0.96), rgba(255, 255, 255, 0.94)),
    #ffffff;
}

.r360-consultations-tip-card__tips {
  position: relative;
  z-index: 1;
  max-width: 72%;
  min-height: 72px;
  margin-top: 1rem;
}

.r360-consultations-tip-card__tips p {
  display: none;
  margin: 0;
  color: #244a83;
  font-size: 0.9rem;
  font-weight: 720;
  line-height: 1.58;
}

.r360-consultations-tip-card__tips p.is-active {
  display: block;
}

.r360-consultations-tip-card > span {
  position: absolute;
  right: 1.45rem;
  bottom: 2.6rem;
  display: grid;
  place-items: center;
  width: 72px;
  height: 72px;
  color: #19a64a;
  opacity: 0.96;
}

.r360-consultations-tip-card > span svg {
  width: 62px;
  height: 62px;
}

.r360-consultations-tip-card__dots {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: center;
  gap: 0.5rem;
  margin-top: 0.8rem;
}

.r360-consultations-tip-card i {
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: #ccead5;
}

.r360-consultations-tip-card i.is-active {
  background: #16a34a;
}

.r360-consultation-prep-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 112px;
  gap: 1rem;
  align-items: center;
  padding: 1.2rem 1.35rem;
}

.r360-consultation-prep-card h2 svg {
  width: 24px;
  height: 24px;
  color: #16a34a;
}

.r360-consultation-prep-card ul {
  display: grid;
  gap: 0.5rem;
  margin: 0.75rem 0 0;
  padding: 0;
  list-style: none;
}

.r360-consultation-prep-card li {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  gap: 0.45rem;
  align-items: start;
  color: #123f7c;
  font-size: 0.82rem;
  font-weight: 760;
  line-height: 1.35;
}

.r360-consultation-prep-card li svg {
  width: 17px;
  height: 17px;
  color: #19a64a;
}

.r360-consultation-prep-card > span {
  display: grid;
  place-items: center;
  width: 104px;
  height: 104px;
  color: #133ed0;
}

.r360-consultation-prep-card > span svg {
  width: 88px;
  height: 88px;
}

.r360-consultations-empty {
  display: grid;
  justify-items: center;
  gap: 0.7rem;
  padding: 3rem 1.25rem;
  text-align: center;
}

.r360-consultations-empty svg {
  width: 70px;
  height: 70px;
  color: #16a34a;
}

.r360-consultations-empty h2 {
  margin: 0;
  color: #073568;
  font-size: 1.55rem;
  font-weight: 950;
}

.r360-consultations-empty p {
  max-width: 34rem;
  margin: 0;
  color: #4b6594;
  font-weight: 740;
  line-height: 1.55;
}

.r360-consultations-empty a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  margin-top: 0.45rem;
  padding: 0.65rem 1rem;
  border-radius: 8px;
  color: #ffffff;
  font-weight: 900;
  text-decoration: none;
  background: #1478f2;
}

@media (max-width: 1180px) {
  .r360-app-shell {
    grid-template-columns: 92px minmax(0, 1fr);
  }

  .r360-app-sidebar {
    padding-inline: 0.5rem;
  }

  .r360-app-sidebar__nav a {
    min-height: 72px;
    font-size: 0.72rem;
  }

  .r360-app-topbar {
    grid-template-columns: auto minmax(240px, 1fr);
  }

  .r360-app-topbar__brand {
    font-size: 1.65rem;
  }

  .r360-app-topbar__actions {
    grid-column: 2;
  }

  .r360-home-hero,
  .r360-home-summary {
    grid-template-columns: 1fr;
  }

  .r360-home-summary__item + .r360-home-summary__item {
    border-left: 0;
    border-top: 1px solid rgba(39, 93, 168, 0.12);
  }

  .r360-home-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .r360-nutrition-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .r360-nutrition-layout {
    grid-template-columns: 1fr;
  }

  .r360-prescriptions-banner {
    grid-template-columns: 86px minmax(0, 1fr) auto;
  }

  .r360-prescriptions-illustration {
    display: none;
  }

  .r360-prescriptions-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .r360-prescriptions-layout {
    grid-template-columns: 1fr;
  }

  .r360-exercise-banner {
    grid-template-columns: 78px minmax(0, 1fr) auto;
  }

  .r360-exercise-illustration {
    display: none;
  }

  .r360-exercise-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .r360-exercise-layout {
    grid-template-columns: 1fr;
  }

  .r360-wellness-banner {
    grid-template-columns: 78px minmax(0, 1fr) auto;
  }

  .r360-wellness-illustration {
    display: none;
  }

  .r360-wellness-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .r360-wellness-layout {
    grid-template-columns: 1fr;
  }

  .r360-places-banner {
    grid-template-columns: minmax(168px, 210px) minmax(0, 1fr) auto;
  }

  .r360-places-banner__art {
    height: 104px;
  }

  .r360-places-banner__art img {
    max-height: 104px;
  }

  .r360-places-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .r360-places-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .r360-places-search {
    grid-column: 1 / -1;
  }

  .r360-places-layout {
    grid-template-columns: 1fr;
  }

  .r360-consultations-banner {
    grid-template-columns: 78px minmax(0, 1fr) auto;
  }

  .r360-consultations-illustration {
    display: none;
  }

  .r360-consultations-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .r360-consultations-layout {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .r360-app-shell {
    grid-template-columns: 1fr;
    max-width: 100vw;
    overflow-x: hidden;
  }

  .r360-app-sidebar {
    position: sticky;
    z-index: 30;
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-rows: auto;
    gap: 0.75rem;
    height: auto;
    min-width: 0;
    padding: 0.65rem 0.8rem;
  }

  .r360-app-sidebar__brand {
    width: 46px;
    height: 46px;
    margin: 0;
  }

  .r360-app-sidebar__brand > img {
    width: 44px;
    height: 44px;
  }

  .r360-app-sidebar__brand span {
    width: 36px;
    height: 36px;
  }

  .r360-app-sidebar__nav {
    display: flex;
    gap: 0.45rem;
    overflow-x: auto;
    padding-bottom: 0.1rem;
  }

  .r360-app-sidebar__nav a {
    flex: 0 0 72px;
    min-height: 62px;
    padding: 0.45rem;
    font-size: 0.69rem;
  }

  .r360-app-sidebar__nav--secondary {
    display: none;
  }

  .r360-app-main {
    overflow-x: hidden;
    padding: 1rem;
    max-width: 100vw;
  }

  .r360-app-topbar {
    grid-template-columns: 1fr;
    gap: 0.8rem;
  }

  .r360-app-topbar__brand {
    display: none;
  }

  .r360-app-topbar__actions {
    grid-column: auto;
    justify-content: space-between;
    gap: 0.65rem;
    width: 100%;
  }

  .r360-app-avatar,
  .r360-app-topbar__divider {
    display: none;
  }

  .r360-app-profile {
    flex: 1 1 auto;
  }

  .r360-app-profile-summary {
    flex: 1 1 auto;
    max-width: calc(100% - 132px);
  }

  .r360-home {
    gap: 1rem;
  }

  .r360-home-hero {
    gap: 0.9rem;
  }

  .r360-home-welcome h1 {
    font-size: 2.45rem;
  }

  .r360-home-welcome,
  .r360-home-wellness > div {
    max-width: 22rem;
  }

  .r360-home-wellness {
    grid-template-columns: 1fr;
    min-height: 124px;
    padding: 1rem;
  }

  .r360-home-wellness svg {
    width: 96px;
    height: 72px;
    justify-self: start;
  }

  .r360-home-summary__item,
  .r360-home-summary__progress {
    grid-template-columns: 56px minmax(0, 1fr) 22px;
    gap: 0.8rem;
    min-height: 96px;
    padding: 0.85rem;
  }

  .r360-home-summary__progress {
    grid-template-columns: 56px minmax(0, 1fr);
  }

  .r360-home-summary__icon {
    width: 50px;
    height: 50px;
  }

  .r360-home-summary__icon svg {
    width: 27px;
    height: 27px;
  }

  .r360-home-grid {
    grid-template-columns: 1fr;
  }

  .r360-home-card {
    grid-template-rows: auto 1fr;
    min-height: 0;
  }

  .r360-home-card__art {
    min-height: 0;
  }

  .r360-home-card img {
    height: 100%;
  }

  .r360-home-card__body {
    padding: 0.95rem 4rem 1rem 1rem;
  }

  .r360-home-protection {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .r360-home-protection a {
    grid-column: 2;
    justify-self: start;
  }

  .r360-nutrition-head,
  .r360-prescriptions-head,
  .r360-exercise-head,
  .r360-wellness-head,
  .r360-places-head,
  .r360-consultations-head,
  .r360-meal-plan-card > header,
  .r360-medication-plan-card > header,
  .r360-exercise-plan-card > header,
  .r360-wellness-plan-card > header,
  .r360-next-wellness-card header,
  .r360-emotional-card header,
  .r360-wellness-resources-card header,
  .r360-consultations-history-card > header,
  .r360-upcoming-consultations-card header,
  .r360-water-card header {
    align-items: stretch;
    flex-direction: column;
  }

  .r360-nutrition-banner {
    grid-template-columns: 52px minmax(0, 1fr);
  }

  .r360-nutrition-download-form,
  .r360-nutrition-download {
    grid-column: 1 / -1;
    width: 100%;
  }

  .r360-prescriptions-banner {
    grid-template-columns: 72px minmax(0, 1fr);
  }

  .r360-prescriptions-banner__icon {
    width: 72px;
    height: 72px;
  }

  .r360-prescriptions-download-form,
  .r360-prescriptions-download {
    grid-column: 1 / -1;
    width: 100%;
  }

  .r360-exercise-banner {
    grid-template-columns: 64px minmax(0, 1fr);
  }

  .r360-exercise-download-form,
  .r360-exercise-download {
    grid-column: 1 / -1;
    width: 100%;
  }

  .r360-wellness-banner {
    grid-template-columns: 64px minmax(0, 1fr);
  }

  .r360-wellness-banner__icon {
    width: 64px;
    height: 64px;
  }

  .r360-wellness-banner__icon svg {
    width: 42px;
    height: 42px;
  }

  .r360-wellness-register {
    grid-column: 1 / -1;
    width: 100%;
  }

  .r360-places-banner {
    grid-template-columns: 120px minmax(0, 1fr);
  }

  .r360-places-banner__art {
    height: 88px;
  }

  .r360-places-banner__art img {
    max-height: 88px;
    object-position: center;
  }

  .r360-places-full-map {
    grid-column: 1 / -1;
    width: 100%;
  }

  .r360-consultations-banner {
    grid-template-columns: 64px minmax(0, 1fr);
    padding: 1rem;
  }

  .r360-consultations-banner__icon {
    width: 64px;
    height: 64px;
  }

  .r360-consultations-banner__icon svg {
    width: 42px;
    height: 42px;
  }

  .r360-consultations-history {
    grid-column: 1 / -1;
    width: 100%;
  }

  .r360-nutrition-metrics {
    grid-template-columns: 1fr;
  }

  .r360-prescriptions-metrics {
    grid-template-columns: 1fr;
  }

  .r360-prescriptions-metric--adherence {
    grid-template-columns: 86px minmax(0, 1fr);
  }

  .r360-prescriptions-ring {
    width: 74px;
    height: 74px;
    font-size: 1rem;
  }

  .r360-exercise-metrics {
    grid-template-columns: 1fr;
  }

  .r360-wellness-metrics {
    grid-template-columns: 1fr;
  }

  .r360-places-metrics {
    grid-template-columns: 1fr;
  }

  .r360-places-metrics article {
    grid-template-columns: 58px minmax(0, 1fr);
  }

  .r360-places-metrics article > svg {
    width: 50px;
    height: 50px;
  }

  .r360-places-filters {
    grid-template-columns: 1fr;
  }

  .r360-places-filters button {
    width: 100%;
  }

  .r360-places-map-card,
  .r360-places-map,
  .r360-places-map-placeholder,
  .r360-places-list-card {
    min-height: 430px;
  }

  .r360-consultations-metrics {
    grid-template-columns: 1fr;
  }

  .r360-consultations-metric--compliance {
    grid-template-columns: 86px minmax(0, 1fr);
  }

  .r360-consultations-ring {
    width: 74px;
    height: 74px;
    font-size: 1rem;
  }

  .r360-meal-tabs {
    grid-template-columns: repeat(8, minmax(78px, 1fr));
  }

  .r360-medication-tabs {
    grid-template-columns: repeat(8, minmax(78px, 1fr));
  }

  .r360-exercise-tabs {
    grid-template-columns: repeat(8, minmax(78px, 1fr));
  }

  .r360-wellness-tabs {
    grid-template-columns: repeat(8, minmax(78px, 1fr));
  }

  .r360-meal-row {
    grid-template-columns: 42px minmax(0, 1fr) auto;
  }

  .r360-medication-row-app {
    grid-template-columns: 42px minmax(0, 1fr) auto;
    align-items: start;
  }

  .r360-exercise-row-app {
    grid-template-columns: 42px minmax(0, 1fr) auto;
    align-items: start;
  }

  .r360-wellness-row {
    grid-template-columns: 42px minmax(0, 1fr) 42px;
    align-items: start;
    min-width: 0;
  }

  .r360-wellness-row__time {
    grid-column: 2;
    grid-row: 2;
  }

  .r360-wellness-row__icon {
    grid-column: 1;
    grid-row: 1 / span 3;
  }

  .r360-wellness-row > div {
    grid-column: 2;
    grid-row: 1;
  }

  .r360-wellness-row em {
    grid-column: 2;
    grid-row: 3;
    justify-self: start;
    text-align: left;
  }

  .r360-wellness-quick-form {
    grid-column: 3;
    grid-row: 1;
    justify-self: end;
  }

  .r360-consultation-row {
    grid-template-columns: 58px minmax(0, 1fr) 24px;
    align-items: start;
    gap: 0.7rem;
    padding: 0.85rem;
  }

  .r360-consultation-row time {
    grid-row: 1 / span 3;
    width: 54px;
    min-height: 62px;
  }

  .r360-consultation-row__icon {
    display: none;
  }

  .r360-consultation-row__meta {
    grid-column: 2;
    grid-row: 1;
  }

  .r360-consultation-row p,
  .r360-consultation-row__diagnosis {
    grid-column: 2 / -1;
  }

  .r360-consultation-row p {
    grid-row: 2;
  }

  .r360-consultation-row__diagnosis {
    grid-row: 3;
  }

  .r360-consultation-row > a {
    grid-column: 3;
    grid-row: 1;
  }

  .r360-upcoming-consultation {
    grid-template-columns: 58px minmax(0, 1fr) 24px;
    align-items: start;
  }

  .r360-upcoming-consultation time {
    width: 54px;
    min-height: 62px;
  }

  .r360-consultation-mode {
    grid-column: 2 / -1;
    justify-self: start;
    min-width: 0;
  }

  .r360-upcoming-consultation > a {
    grid-column: 3;
    grid-row: 1;
  }

  .r360-meal-row p,
  .r360-meal-quick-form {
    grid-column: 2 / -1;
  }

  .r360-medication-row-app p,
  .r360-medication-quick-form {
    grid-column: 2 / -1;
  }

  .r360-medication-row-app__icon {
    grid-column: 1;
    grid-row: 1 / span 3;
  }

  .r360-medication-row-app > div {
    grid-column: 2;
    grid-row: 1;
  }

  .r360-medication-row-app p {
    grid-row: 2;
  }

  .r360-medication-quick-form {
    grid-column: 3;
    grid-row: 1;
    justify-self: end;
  }

  .r360-exercise-row-app p,
  .r360-exercise-quick-form {
    grid-column: 2 / -1;
  }

  .r360-exercise-row-app__icon {
    grid-column: 1;
    grid-row: 1 / span 3;
  }

  .r360-exercise-row-app > div {
    grid-column: 2;
    grid-row: 1;
  }

  .r360-exercise-row-app p {
    grid-row: 2;
  }

  .r360-meal-row .r360-plan-video-button {
    grid-column: 2;
    grid-row: 3;
    width: auto;
    justify-self: start;
  }

  .r360-meal-quick-form {
    grid-column: 3;
    grid-row: 3;
    justify-self: end;
  }

  .r360-meal-row em {
    text-align: right;
  }

  .r360-exercise-row-app em {
    grid-column: 3;
    grid-row: 1;
    text-align: right;
  }

  .r360-exercise-row-app .r360-plan-video-button {
    grid-column: 2;
    grid-row: 3;
    width: auto;
    justify-self: start;
  }

  .r360-exercise-quick-form {
    grid-column: 3;
    grid-row: 3;
    justify-self: end;
  }

  .r360-meal-reminder,
  .r360-medication-reminder,
  .r360-next-medication-card > div,
  .r360-water-content,
  .r360-exercise-reminder,
  .r360-daily-goal-card > div,
  .r360-next-wellness-card > div,
  .r360-emotional-card > div,
  .r360-wellness-tip-card,
  .r360-wellness-resources-card > div,
  .r360-places-layout,
  .r360-consultation-prep-card {
    grid-template-columns: 1fr;
  }

  .r360-wellness-tip-card img {
    justify-self: start;
    max-height: 120px;
  }

  .r360-wellness-resources-card > div {
    gap: 0.6rem;
  }

  .r360-consultations-tip-card__tips {
    max-width: 100%;
    padding-right: 4.8rem;
  }

  .r360-consultation-prep-card > span {
    justify-self: start;
    width: 82px;
    height: 82px;
  }

  .r360-consultation-prep-card > span svg {
    width: 72px;
    height: 72px;
  }

  .r360-water-glasses {
    gap: 0.85rem;
  }

  .r360-meal-modal__group,
  .r360-meal-source,
  .r360-medication-modal__group,
  .r360-medication-source,
  .r360-exercise-modal__group,
  .r360-exercise-source,
  .r360-wellness-modal__group,
  .r360-wellness-source,
  .r360-mood-scale {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 520px) {
  .r360-app-main {
    padding-inline: 0.75rem;
  }

  .r360-home-welcome h1 {
    font-size: 2.2rem;
  }

  .r360-home-summary__item,
  .r360-home-summary__progress {
    grid-template-columns: 50px minmax(0, 1fr);
  }

  .r360-home-summary__item > svg {
    display: none;
  }

  .r360-consultations-head h1 {
    font-size: 2.2rem;
  }

  .r360-wellness-head h1 {
    font-size: clamp(1.85rem, 8vw, 2.2rem);
  }

  .r360-places-head h1 {
    font-size: clamp(1.85rem, 8vw, 2.2rem);
  }

  .r360-wellness-banner {
    grid-template-columns: 1fr;
  }

  .r360-wellness-banner__icon {
    width: 58px;
    height: 58px;
  }

  .r360-wellness-plan-card > header {
    padding-inline: 0.9rem;
  }

  .r360-wellness-activity-register {
    width: 100%;
  }

  .r360-wellness-row {
    padding-inline: 0.9rem;
  }

  .r360-emotional-card p {
    padding-left: 0;
    border-left: 0;
  }

  .r360-places-banner {
    grid-template-columns: 1fr;
  }

  .r360-places-full-map {
    min-width: 0;
    width: 100%;
    justify-self: stretch;
  }

  .r360-places-banner__art {
    justify-content: start;
    height: 96px;
  }

  .r360-places-banner__art img {
    width: min(210px, 100%);
    max-height: 96px;
  }

  .r360-places-list-card {
    padding: 1rem;
  }

  .r360-place-row {
    grid-template-columns: 42px minmax(0, 1fr) 38px;
    gap: 0.7rem;
  }

  .r360-place-row em {
    grid-column: 2;
    justify-self: start;
    text-align: left;
  }

  .r360-place-row button {
    grid-column: 3;
    grid-row: 1;
  }

  .r360-places-dialog {
    width: calc(100% - 1rem);
    height: calc(100vh - 1rem);
  }

  .r360-consultations-banner {
    grid-template-columns: 1fr;
  }

  .r360-consultations-banner__icon {
    width: 58px;
    height: 58px;
  }

  .r360-consultation-row {
    grid-template-columns: 1fr 24px;
  }

  .r360-consultation-row time {
    grid-column: 1;
    grid-row: auto;
    justify-self: start;
  }

  .r360-consultation-row__meta,
  .r360-consultation-row p,
  .r360-consultation-row__diagnosis {
    grid-column: 1 / -1;
    grid-row: auto;
  }

  .r360-consultation-row > a {
    grid-column: 2;
    grid-row: 1;
  }
}

/* Keep the excess-calorie state visually distinct from the standard metric. */
.r360-nutrition-metric.r360-nutrition-metric--over {
  border-color: rgba(212, 61, 72, 0.38);
  background: #fff5f5;
}
.r360-nutrition-metric.r360-nutrition-metric--over > svg,
.r360-nutrition-metric.r360-nutrition-metric--over strong,
.r360-nutrition-metric.r360-nutrition-metric--over em { color: #d33f4b; }
.r360-nutrition-metric.r360-nutrition-metric--over i { background: #ffd9dc; }
.r360-nutrition-metric.r360-nutrition-metric--over i b { width: 100% !important; background: linear-gradient(90deg, #ee5a62, #c82e3c); }