/* Profile choices, ordered goals and personal daily limits. */
.personalization .list-row .grow { min-width: 0; overflow-wrap: anywhere; }
.personalization .list-row .v { font-size: 1rem; line-height: 1.55; margin-top: 5px; }
.personalization [data-body] { min-width: 0; }
.personalization .options { margin-top: 12px; }
.personalization .option[aria-checked='true'] .check { background: var(--accent-gradient-diag); border: 0; }
.goal-priorities { list-style: none; padding: 0; margin: 16px 0 20px; display: grid; gap: 10px; }
.goal-priorities:empty { display: none; }
.goal-priorities li { display: flex; align-items: center; gap: 8px; padding: 10px; border-radius: 18px; background: var(--accent-soft); }
.goal-priorities .grow { flex: 1; min-width: 0; font-size: 0.9375rem; font-weight: 800; overflow-wrap: anywhere; }
.goal-priorities small { display: block; font-size: 0.75rem; color: var(--text-2); margin-top: 3px; }
.goal-rank { width: 26px; height: 26px; flex: none; display: grid; place-items: center; border-radius: 50%; background: var(--surface); font-weight: 800; }
.goal-priorities .icon-btn { width: 44px; height: 44px; flex: none; background: var(--surface); font-size: 24px; }
.goal-priorities button:disabled { opacity: .3; }
.limit-fields { display: grid; gap: 24px; }
.limit-field { display: grid; gap: 8px; min-width: 0; }
.limit-field label, .limit-field > span { font-weight: 800; font-size: 1.0625rem; }
.limit-field .caption { font-size: 0.8125rem; }
.field-error { color: var(--danger-text, #9b1c1c); font-size: 0.875rem; }
.field[aria-invalid='true'] { outline: 2px solid var(--danger-text, #9b1c1c); }
.personal-goal-checks ul,.personal-limits ul { list-style:none; margin:0; padding:0; }
.personal-goal-checks li+li,.personal-limit-row+li { margin-top:8px; }
.personal-goal-checks li { font-size: 0.9375rem; line-height:1.5; }
.personal-limit-row { display:flex; flex-direction:column; gap:4px; padding:12px; border-radius:14px; background:var(--chip); overflow-wrap:anywhere; }
.personal-limit-row>span:nth-child(2) { font-size: 0.8125rem; color:var(--text-2); }
.personal-limit-note { font-size: 0.8125rem; color:var(--warn-text); }

/* Mobile summary: a compact overview, with explanations only when requested. */
.profile-summary .topbar { margin-bottom: 16px; }
.summary-intro { color: var(--text-2); font-size: 0.9375rem; margin: 6px 0 20px; }
.summary-settings { border-radius: 22px; background: var(--surface); border: 1px solid var(--line, #e9e8ee); overflow: hidden; }
.summary-setting + .summary-setting { border-top: 1px solid var(--line, #e9e8ee); }
.summary-setting summary, .summary-history summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 12px; padding: 16px; min-height: 72px; }
.summary-setting summary::-webkit-details-marker, .summary-history summary::-webkit-details-marker { display: none; }
.summary-setting-text { min-width: 0; flex: 1; }
.summary-setting-label { display: block; font-size: 1rem; font-weight: 750; line-height: 1.35; }
.summary-setting-value { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: var(--text-2); font-size: 0.875rem; line-height: 1.45; margin-top: 4px; overflow-wrap: anywhere; }
.summary-chevron { color: var(--text-2); font-size: 1.375rem; flex: none; transition: transform .15s; }
.profile-summary details[open] > summary .summary-chevron { transform: rotate(180deg); }
.profile-summary details[open] > summary .summary-setting-value { display: block; }
.summary-setting-body { padding: 0 16px 12px; overflow-wrap: anywhere; }
.summary-setting-body p { line-height: 1.5; margin: 8px 0; }
.summary-setting-body ol { margin: 0; padding-left: 22px; }
.summary-setting-body li + li { margin-top: 12px; }
.summary-edit { display: inline-flex; align-items: center; gap: 8px; min-height: 48px; font-size: 0.9375rem; font-weight: 750; color: var(--accent, #7560da); text-decoration: none; }
.summary-history { border-radius: 20px; background: var(--accent-soft); }
.summary-history summary { min-height: 80px; }
.summary-history-number { font-size: 2rem; font-weight: 800; line-height: 1; min-width: 36px; }
.summary-history b { font-size: 0.9375rem; }
.summary-counts > div { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; font-size: 0.9375rem; border-bottom: 1px solid rgba(0,0,0,.06); }
.summary-section-title { font-size: 1.25rem; font-weight: 800; margin: 24px 0 6px; }
.summary-hint { font-size: 0.8125rem; color: var(--text-2); line-height: 1.45; margin: 0 0 12px; }
.summary-recommendation { padding: 16px 0; border-bottom: 1px solid var(--line, #e9e8ee); overflow-wrap: anywhere; }
.summary-recommendation .h3 { font-size: 1.0625rem; margin-bottom: 8px; }
.summary-recommendation > .link { display: inline-flex; align-items: center; min-height: 48px; font-size: 0.875rem; }
.profile-summary summary:focus-visible, .summary-edit:focus-visible { outline: 2px solid var(--accent, #7560da); outline-offset: -3px; border-radius: 12px; }

/* Overall assessment, verdict details and additives (rules on the server decide; the screen only shows). */
.verdict-details { margin: 8px 0 0; padding-left: 18px; font-size: 0.9375rem; line-height: 1.5; }
.verdict-details li + li { margin-top: 4px; }
.additives { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.additives li { display: grid; gap: 2px; overflow-wrap: anywhere; }

/* Keep goal names readable when text grows; reorder controls get their own row. */
.goal-priorities li { display:grid; grid-template-columns:auto minmax(0,1fr) 44px 44px; }
.goal-priorities .grow { grid-column:2 / -1; }
.goal-rank { width:1.75rem; height:1.75rem; font-size:.875rem; }
.goal-priorities .icon-btn:first-of-type { grid-column:3; }
.goal-priorities .icon-btn:last-of-type { grid-column:4; }
.personalization header h1 { min-width:0; overflow-wrap:anywhere; }
.summary-setting-label { overflow-wrap:anywhere; }
.summary-counts > div > span { min-width:0; overflow-wrap:anywhere; }

.summary-recommendation-actions { display: grid; gap: 4px; margin-top: 12px; }
.summary-recommendation-actions > a { display: flex; align-items: center; gap: 6px; min-height: 44px; font-size: .875rem; line-height: 1.4; overflow-wrap: anywhere; }
.summary-recommendation-actions > .summary-edit { margin: 0; }

/* Overall verdict card: a coloured head with the rules' verdict, then reasons against and for. */
.overall { border-radius:20px; background:var(--surface); border:1px solid var(--line); overflow:hidden; }
.overall-head { display:flex; align-items:center; gap:10px; padding:14px 16px; font-size:1.0625rem; }
.overall-dot { width:12px; height:12px; border-radius:50%; flex:none; background:currentColor; }
.overall-tone-ok .overall-head { background:var(--ok-bg); color:var(--ok-text); }
.overall-tone-warn .overall-head { background:var(--warn-bg); color:var(--warn-text); }
.overall-tone-danger .overall-head { background:var(--danger-bg); color:var(--danger-strong); }
.overall-tone-neutral .overall-head { background:var(--neutral-bg); color:var(--neutral-text); }
.overall-list { padding:12px 16px 4px; }
.overall-list + .overall-list { border-top:1px solid var(--line); }
.overall-list:last-child { padding-bottom:14px; }
.overall-list h3 { margin:0 0 6px; font-size:.875rem; font-weight:600; color:var(--text-2); }
.overall-list ul { list-style:none; margin:0; padding:0; display:grid; gap:6px; }
.overall-list li { position:relative; padding-left:18px; font-size:.9375rem; line-height:1.35; color:var(--text-body); }
.overall-list li::first-letter { text-transform:uppercase; }
.overall-list li::before { content:''; position:absolute; left:2px; top:.45em; width:8px; height:8px; border-radius:50%; }
.overall-minus li::before { background:var(--warn-strong); }
.overall-plus li::before { background:var(--ok-text); }

/* Secondary goal detail stays available without repeating the summary on first view. */
.goal-breakdown { border-bottom:1px solid var(--line); }
.goal-breakdown summary { display:flex; align-items:center; justify-content:space-between; gap:12px; cursor:pointer; list-style:none; padding:14px 0; font-size:.9375rem; font-weight:600; color:var(--text-2); }
.goal-breakdown summary::-webkit-details-marker { display:none; }
.goal-breakdown summary>span { font-size:20px; font-weight:400; }
.goal-breakdown[open] summary>span { transform:rotate(45deg); }
.goal-breakdown ul { list-style:none; padding:0 0 16px; margin:0; display:grid; gap:16px; }
.goal-breakdown li { font-size:.9375rem; line-height:1.55; color:var(--text-body); }
.goal-check-label { display:block; font-weight:600; margin-bottom:4px; color:var(--text); }
.overall-list { padding-top:16px; }
.overall-list ul { gap:10px; }
.overall-list li { line-height:1.5; }

/* Verdict facts: labels on the left, comparable amounts on the right. */
.result .headline-caution { color:var(--warn-text); }
.result .headline-value { color:var(--accent-text); }
.overall-head { padding:12px 16px; font-size:.9375rem; }
.overall-list { padding:10px 16px 4px; }
.overall-list h3 { margin-bottom:4px; font-size:.8125rem; font-weight:500; }
.overall-list ul { gap:0; }
.overall-list li { display:flex; justify-content:space-between; align-items:baseline; gap:18px; padding:6px 0; font-size:.875rem; }
.overall-list li+li { border-top:0; }
.overall-list li::before { content:none; }
.overall-fact-label { min-width:0; }
.overall-fact-label::first-letter { text-transform:uppercase; }
.overall-fact-value { flex-shrink:0; text-align:right; font-weight:500; color:var(--text-body); font-variant-numeric:tabular-nums; max-width:55%; }
.overall-fact-value small { display:inline; margin-left:5px; font-size:.75rem; line-height:1.5; color:var(--text-2); font-weight:400; }
.overall-minus .overall-fact-value { color:var(--text-body); }
.overall-plus .overall-fact-value { color:var(--text-body); }
@media(max-width:350px) { .overall-list li { gap:10px; font-size:.875rem; } }

.overall-tone-neutral .overall-head, .overall-tone-ok .overall-head { background:transparent; color:var(--text-body); }
.overall-dot { width:6px; height:6px; }
.overall-list + .overall-list { border-top:0; }

/* Other goals are visible supporting text, without a separate card or disclosure. */
.goal-breakdown { border:0; padding:2px 0 4px; }
.goal-breakdown h2 { margin:0 0 12px; font-size:.9375rem; line-height:1.5; font-weight:600; color:var(--text-body); }
.goal-breakdown ul { gap:14px; padding:0; }
.goal-breakdown li { font-size:.9375rem; line-height:1.55; color:var(--text-body); border-left:2px solid var(--accent-soft); padding:2px 0 2px 12px; }
.goal-check-label { display:block; font-size:inherit; font-weight:600; color:var(--accent-text); margin:0 0 4px; }


/* Each goal has a distinct, restrained visual container. */
.result .goal-breakdown ul { gap:10px; }
.result .goal-breakdown li { margin:0; padding:14px 16px; border:1px solid var(--line); border-left:3px solid var(--accent); border-radius:4px 14px 14px 4px; background:var(--surface); }
.result .goal-check-label { font-size:.9375rem; font-weight:700; margin-bottom:6px; color:var(--text); }
.result .goal-check-copy { display:block; color:var(--text-2); font-size:.875rem; line-height:1.65; }
.result .goal-check-copy strong { font-weight:600; color:var(--accent-text); white-space:nowrap; }

.overall .composition-key { font-weight:600; color:var(--text); }
.overall-list .overall-fact-label { line-height:1.6; }

.composition-section { padding:16px; }
.composition-heading { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; margin-bottom:8px; }
.composition-heading h3 { margin:0; font-size:.875rem; color:var(--text-body); font-weight:600; }
.composition-status { display:inline-flex; align-items:center; gap:5px; padding:4px 8px; border-radius:7px; font-size:.75rem; font-weight:600; background:var(--surface-2); color:var(--text-2); }
.overall-minus .composition-status { background:var(--warn-bg); color:var(--warn-text); }
.overall-plus .composition-status { background:var(--ok-bg); color:var(--ok-text); }
.overall-list li.composition-additives { display:grid; gap:10px; padding:8px 0; }
.composition-count { font-size:.8125rem; color:var(--text-2); }
.composition-types { display:grid; gap:6px; }
.composition-types>span { border-left:2px solid var(--line); padding:3px 0 3px 10px; font-size:.9375rem; color:var(--text-body); }
.composition-types>span::first-letter { text-transform:uppercase; }
.composition-explanation { font-size:.8125rem; line-height:1.5; color:var(--text-2); margin:6px 0 2px; }

/* Ingredient note: concrete names and roles, no score badges or decorative counters. */
.overall .composition-section { padding:16px 18px; }
.composition-section h3 { font-size:.8125rem; font-weight:500; color:var(--text-2); margin:0 0 12px; }
.overall-list li.composition-item { display:block; padding:10px 0; }
.overall-list li.composition-item+li.composition-item { border-top:1px solid var(--line); }
.composition-item-top { display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.composition-name { font-size:.9375rem; font-weight:600; color:var(--text-body); }
.composition-name::first-letter { text-transform:uppercase; }
.composition-code { font-size:.75rem; color:var(--text-2); flex-shrink:0; font-variant-numeric:tabular-nums; }
.composition-purpose { display:block; margin-top:4px; font-size:.8125rem; line-height:1.5; color:var(--text-2); }

/* Further goals as a checklist under the sugar/salt/fat plaques: one card, rows with a target icon and a verdict tag */
.personal-goal-checks .goal-rows { list-style:none; margin:8px 0 0; padding:4px 14px; background:var(--surface); border:1px solid var(--line); border-radius:18px; }
.goal-row { display:grid; grid-template-columns:32px minmax(0,1fr) auto; align-items:center; gap:12px; padding:10px 0; }
.goal-row + .goal-row { border-top:1px solid var(--line); }
.goal-icon { display:grid; place-items:center; width:32px; height:32px; border-radius:50%; background:var(--accent-soft); color:var(--accent-text); }
.goal-icon svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; }
.goal-main { display:grid; gap:1px; min-width:0; }
.goal-name { font-size:.9375rem; font-weight:700; color:var(--text); }
.goal-num { font-size:.875rem; color:var(--text-2); }
.goal-text { font-size:.875rem; line-height:1.35; color:var(--text-2); }
.goal-tag { padding:4px 10px; border-radius:var(--r-pill, 999px); font-size:.8125rem; font-weight:700; white-space:nowrap; max-width:9rem; overflow:hidden; text-overflow:ellipsis; }
.goal-tone-ok .goal-tag { background:var(--ok-bg); color:var(--ok-text); }
.goal-tone-warn .goal-tag { background:var(--warn-bg); color:var(--warn-text); }
.goal-tone-none .goal-icon { background:var(--chip, var(--surface-2)); color:var(--text-2); }
