/* Calmer look: the same colours, without the «AI app» effects (rainbow rings, glows, gradient fills and text).
   The product card (.result) keeps its own look, so the tokens are restored there. */
:root {
  --accent-gradient-fx: linear-gradient(90deg, #7C5CFF 0%, #3B82F6 100%);
  --accent-gradient-diag-fx: linear-gradient(135deg, #7C5CFF 0%, #3B82F6 100%);
  --glow-gradient-fx: linear-gradient(90deg, #7C5CFF 0%, #22D3EE 55%, #EC4899 100%);
  --shadow-accent-fx: 0 12px 28px -8px rgba(110, 92, 255, .55);

  --accent-gradient: var(--accent);
  --accent-gradient-diag: var(--accent);
  --glow-gradient: var(--accent);
  --shadow-accent: none;
  --ring-gradient: var(--line);
  --ai-badge: var(--accent);
}
.result {
  --accent-gradient: var(--accent-gradient-fx);
  --accent-gradient-diag: var(--accent-gradient-diag-fx);
  --glow-gradient: var(--glow-gradient-fx);
  --shadow-accent: var(--shadow-accent-fx);
  --ai-badge: linear-gradient(135deg, #7C5CFF 0%, #22D3EE 100%);
}

/* Night theme: a faint tint at the top instead of a violet glow */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .screen:not(.result) { background-image: radial-gradient(120% 320px at 50% -160px, rgba(91, 66, 210, .18) 0%, transparent 100%); }
}
:root[data-theme="dark"] .screen:not(.result) { background-image: radial-gradient(120% 320px at 50% -160px, rgba(91, 66, 210, .18) 0%, transparent 100%); }

/* Gradient text becomes plain accent text */
.screen:not(.result) .accent-text { background: none; color: var(--accent-text); }

/* Cards that were outlined with a rainbow border */
.screen:not(.result) .gradient-card { background: var(--surface); border: 1.5px solid var(--accent); }

/* Welcome: no orb, no feature pills */
.welcome::before { display: none; }
.welcome .brand-word { margin-top: auto; }

/* Onboarding: the question first, the explanation under it as plain text */
.onboarding .h1 { margin-top: 8px; }
.onboarding-lead { margin: 10px 0 0; font-size: 1.0625rem; color: var(--text-2); }
.onboarding .option > span:first-child::first-letter, .onboarding .goal-priorities .grow::first-letter { text-transform: uppercase; }

/* Profile: a plain avatar */
.avatar { padding: 0; background: var(--accent-soft); }
.avatar > div { background: var(--accent-soft); color: var(--accent-text); }
.avatar > div svg { width: 30px; height: 30px; }

/* Empty states: a quiet icon tile instead of the AI badge */
.empty-icon { display: grid; place-items: center; width: 56px; height: 56px; margin: 0 auto 16px; border-radius: 16px; background: var(--accent-soft); color: var(--accent-text); }
.empty-icon svg { width: 26px; height: 26px; }

/* Chat: answers without the sparkle avatar, one bullet colour */
.chat .msg-ai { grid-template-columns: minmax(0, 1fr); }
.msg-ai .body li::before, .msg-ai .body li:nth-child(2n)::before { background: var(--accent-text); }

/* Scanner: a white shutter without the rainbow ring, a plain spinner while reading */
.shutter { background: rgba(255, 255, 255, .28); box-shadow: none; }
.busy-overlay .orb { width: 44px; height: 44px; padding: 0; background: none; border: 3px solid rgba(255, 255, 255, .2); border-top-color: #fff; animation: spin .9s linear infinite; }

/* Sentence case instead of letter-spaced capitals */
.cmp-verdict-kicker, .day-meal { text-transform: none; letter-spacing: 0; font-size: .875rem; }
.cmp-verdict::before { display: none; }

/* «Мой день»: one header row, the app's own accent instead of teal links and red calories, plain labels */
.day .topbar .title { font-size: 1.25rem; }
.day .topbar .day-date { margin: 0; display: block; }
.day .topbar .day-date select { width: auto; min-height: 40px; padding: 6px 10px; font-size: .9375rem; font-weight: 600; border-radius: 12px; }
.day { --diary-ink: var(--accent-text); --diary-soft: var(--accent-soft); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .day { --diary-ink: var(--accent-text); --diary-soft: var(--accent-soft); } }
:root[data-theme="dark"] .day { --diary-ink: var(--accent-text); --diary-soft: var(--accent-soft); }
.day .day-hero { padding-top: 16px; }
.day .day-goals { text-align: center; }
.day .watch-main-name, .day .watch-tile-name { text-transform: none; letter-spacing: 0; font-size: .8125rem; }
.day .watch-main-sub { font-size: .9375rem; }
.day .watch-tiles { gap: 8px; }
.day .watch-tile { padding: 12px 6px 10px; }
.day .day-kcal-line { margin: 14px 0 0; padding-top: 12px; border-top: 1px solid var(--line); text-align: center; font-size: .9375rem; color: var(--text-2); }
.day .day-kcal-line b { color: var(--text); font-variant-numeric: tabular-nums; }
.day .day-entry-kcal { color: var(--text-2); font-weight: 600; }
.day .day-entry-actions button, .day .day-entry-actions button:last-child { color: var(--text-2); font-weight: 500; }
.day .day-tip-action { text-decoration: none; font-weight: 600; }
.day .day-all summary { cursor: pointer; display: flex; align-items: center; justify-content: space-between; min-height: 32px; list-style: none; }
.day .day-all summary::-webkit-details-marker { display: none; }
.day .day-all summary::after { content: ''; width: 8px; height: 8px; margin-right: 4px; border-right: 2px solid var(--text-2); border-bottom: 2px solid var(--text-2); transform: rotate(45deg); transition: transform .2s; }
.day .day-all[open] summary::after { transform: rotate(-135deg); }
.day .day-totals { display: block; margin-top: 8px; }
.day .day-total { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: 2px 12px; padding: 10px 0; background: none; border-radius: 0; border-top: 1px solid var(--line); }
.day .day-total dt, .day .day-total-protein dt, .day .day-total-sugar dt, .day .day-total-salt dt, .day .day-total-saturated_fat dt { color: var(--text-2); font-weight: 500; font-size: .9375rem; }
.day .day-total dd, .day .day-total-energy dd { margin: 0; font-size: .9375rem; font-weight: 700; color: var(--text); letter-spacing: 0; }
.day .day-total .day-total-note { grid-column: 1 / -1; }
.day .week-lines li:first-child { border-top: 0; }
.day .day-goals-edit { text-decoration: none; }
.day .topbar { padding-right: 4px; }
/* Welcome: the words in the middle of the screen, the buttons at the bottom with room above them */
.welcome .lead { margin-bottom: auto; padding-bottom: 28px; }
/* «Другие цели» on the product card: a long verdict wraps instead of being cut to «умеренно для це…» */
.goal-tag { white-space: normal; max-width: 11rem; text-align: right; line-height: 1.25; border-radius: 12px; }
/* Chat: a long product name takes two lines in the header, not four */
.chat .product-pill > span:last-child { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; white-space: normal; overflow: hidden; }
/* Additive names come lower-case from the rules («пектины»): shown with a capital */
.additives li > b { display: inline-block; }
.additives li > b::first-letter { text-transform: uppercase; }
/* «Ввести вручную»: the group titles fit one line on a narrow phone («…на 100 г» did not) */
@media (max-width: 380px) { .manual-group legend { font-size: 1rem; } }
/* Goal order in the survey: the arrows stay on the goal's row (a second row only for very large text) */
.goal-priorities .grow { grid-column: 2; }
@media (max-width: 300px) { .goal-priorities .grow { grid-column: 2 / -1; } }
/* Profile card: «Мой профиль» fits one line on a narrow phone */
@media (max-width: 380px) { .profile-hero-name { font-size: 1.125rem; } .profile-hero { gap: 12px; } .profile-hero .avatar { width: 52px; height: 52px; } }
/* «Другие цели»: the verdict tag goes under the goal's number instead of squeezing the name */
.goal-row { grid-template-columns: 32px minmax(0, 1fr); row-gap: 6px; }
.goal-row .goal-tag { grid-column: 2; justify-self: start; max-width: 100%; text-align: left; }
/* Scanner: the status pill stays on one line */
[data-pill].glass-pill { white-space: nowrap; }
/* Product actions on a 320 px phone: «Поделиться» fits its tile */
@media (max-width: 340px) { .result-action { gap: 8px; padding: 10px 8px; font-size: .8125rem; } .result-action-icon { width: 34px; height: 34px; } }
