:root {
    --navy: #0d2237;
    --navy-2: #183a59;
    --teal: #27c7b8;
    --orange: #ff9f2d;
    --bg: #07131f;
    --card: #10263a;
    --text: #f4f8fb;
    --muted: #9fb2c3;
    --line: rgba(255,255,255,.08);
    --green: #2bd67b;
    --yellow: #ffd04a;
    --red: #ff5f62;
}

/* V18.20 recipe library */
.recipe-rule { display:flex; flex-direction:column; gap:.35rem; border-left:4px solid var(--accent, #36c2a6); }
.recipe-rule span, .recipe-facts span { color:var(--muted, #6c7b88); }
.recipe-card { scroll-margin-top:1rem; }
.recipe-card .card-head > div { display:flex; flex-direction:column; gap:.2rem; }
.recipe-facts { display:flex; flex-wrap:wrap; gap:.55rem 1rem; margin:.8rem 0; }
.recipe-use-form { display:grid; grid-template-columns:minmax(145px,1fr) minmax(130px,1fr) 100px auto; gap:.6rem; align-items:end; margin-top:1rem; }
.recipe-actions { display:flex; flex-wrap:wrap; gap:.55rem; margin-top:.8rem; }
.recipe-actions form { margin:0; }
.recipe-instructions { margin-top:1rem; white-space:pre-line; }
.recipe-item-editor { padding:1rem; margin:.75rem 0; border:1px solid rgba(67,216,202,.28); border-radius:12px; background:#173852; }
.recipe-item-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.65rem; }
.recipe-item-grid label { display:flex; flex-direction:column; gap:.25rem; }
.recipe-item-grid label span { color:#9fb5c7; font-weight:700; }
.recipe-item-grid input { background:#234865; color:#fff; border-color:#3b607b; }
.recipe-item-grid input:focus { border-color:#2fc8bd; box-shadow:0 0 0 2px rgba(47,200,189,.18); }
.recipe-item-editor .danger-text { margin-top:.55rem; color:#ff7885; }
.recipe-item-grid label:first-child { grid-column:span 2; }
@media (max-width:760px) {
  .recipe-use-form { grid-template-columns:1fr 1fr; }
  .recipe-use-form .button { grid-column:1 / -1; }
  .recipe-item-grid { grid-template-columns:1fr 1fr; }
  .recipe-item-grid label:first-child { grid-column:1 / -1; }
}

* { box-sizing: border-box; }

html, body {
    margin: 0;
    min-height: 100%;
    background: linear-gradient(180deg, #081522 0%, #06111b 100%);
    color: var(--text);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body { padding-bottom: 86px; }

.app-shell {
    width: min(860px, 100%);
    margin: 0 auto;
    padding: 18px 14px 24px;
}

.app-shell.narrow {
    width: min(680px, 100%);
}

.hero { padding: 10px 4px 18px; }

.eyebrow {
    color: var(--teal);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .18em;
}

h1 {
    margin: 5px 0 4px;
    font-size: clamp(2rem, 8vw, 3.2rem);
    line-height: 1;
}

.motto {
    color: var(--orange);
    font-style: italic;
    font-weight: 800;
    letter-spacing: .08em;
    font-size: .85rem;
}

.quick-actions {
    display: flex;
    gap: 10px;
    margin: 0 0 14px;
}

.action-button,
.button {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    border: 0;
    border-radius: 14px;
    padding: 12px 16px;
    background: var(--teal);
    color: #04131d;
    font-weight: 850;
    cursor: pointer;
    font: inherit;
}

.action-button.secondary {
    background: var(--orange);
}

.button.ghost {
    background: transparent;
    color: var(--text);
    border: 1px solid var(--line);
}

.status-grid {
    display: grid;
    gap: 14px;
    margin-bottom: 14px;
}

.card {
    background: linear-gradient(145deg, rgba(24,58,89,.90), rgba(13,34,55,.96));
    border: 1px solid var(--line);
    border-radius: 20px;
    padding: 17px;
    box-shadow: 0 16px 36px rgba(0,0,0,.20);
}

.page-card { margin-bottom: 14px; }

.card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
    color: var(--teal);
    font-size: .78rem;
    font-weight: 850;
    letter-spacing: .09em;
}

.card-head small {
    color: var(--muted);
    font-size: .72rem;
    letter-spacing: 0;
    font-weight: 650;
}

.primary-value {
    font-size: 2.25rem;
    font-weight: 900;
    line-height: 1;
    margin: 6px 0 18px;
}

.primary-value small {
    font-size: 1rem;
    color: var(--muted);
}

.metric-row,
.macro-grid,
.training-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 10px;
}

.metric-row > div,
.macro-grid > div,
.training-summary > div {
    background: rgba(255,255,255,.045);
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 11px 12px;
}

.metric-row span,
.macro-grid span,
.training-summary span {
    display: block;
    color: var(--muted);
    font-size: .72rem;
    margin-bottom: 4px;
}

.status-line {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 4px 0 15px;
}

.status-dot {
    width: 13px;
    height: 13px;
    border-radius: 50%;
    background: var(--muted);
}

.status-dot.gruen { background: var(--green); }
.status-dot.gelb { background: var(--yellow); }
.status-dot.rot { background: var(--red); }

.exercise-list {
    margin-top: 14px;
    border-top: 1px solid var(--line);
}

.exercise-row {
    display: flex;
    justify-content: space-between;
    gap: 15px;
    padding: 10px 0;
    border-bottom: 1px solid var(--line);
    font-size: .88rem;
}

.exercise-row span { color: var(--muted); }
.exercise-row strong { text-align: right; }

.form-card {
    margin-bottom: 20px;
}

.form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 12px;
}

label.full {
    display: block;
    margin-top: 12px;
}

label span {
    display: block;
    color: var(--muted);
    font-size: .76rem;
    margin: 0 0 6px;
}

input,
select,
textarea {
    width: 100%;
    background: rgba(255,255,255,.06);
    color: var(--text);
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 12px;
    font: inherit;
    outline: none;
}

select option {
    color: #111;
}

textarea {
    resize: vertical;
}

.form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 16px;
}

.table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.data-table {
    width: 100%;
    min-width: 620px;
    border-collapse: collapse;
    font-size: .82rem;
}

.data-table th,
.data-table td {
    padding: 10px 8px;
    text-align: left;
    border-bottom: 1px solid var(--line);
}

.data-table th {
    color: var(--teal);
    font-size: .72rem;
    letter-spacing: .05em;
}

.muted { color: var(--muted); }

.bottom-nav {
    position: fixed;
    z-index: 20;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    width: min(860px, 100%);
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 2px;
    padding: 8px max(8px, env(safe-area-inset-left)) calc(8px + env(safe-area-inset-bottom));
    background: rgba(7,19,31,.93);
    backdrop-filter: blur(18px);
    border-top: 1px solid var(--line);
}

.bottom-nav a {
    text-decoration: none;
    color: var(--muted);
    font-size: .68rem;
    font-weight: 750;
    text-align: center;
    padding: 10px 3px;
    border-radius: 12px;
}

.bottom-nav a.active {
    color: var(--text);
    background: rgba(39,199,184,.14);
}

@media (max-width: 560px) {
    .form-grid {
        grid-template-columns: 1fr;
    }

    .quick-actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
}

@media (min-width: 720px) {
    .status-grid {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }

    .training-card {
        grid-column: 1 / -1;
    }

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


.section-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    margin: 22px 0 12px;
    padding-top: 18px;
    border-top: 1px solid var(--line);
}

.section-head > div:first-child span {
    display: block;
    color: var(--muted);
    font-size: .72rem;
    margin-top: 4px;
}

.mini-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}

.button.compact {
    padding: 8px 10px;
    font-size: .75rem;
}

.exercise-editor {
    background: rgba(255,255,255,.035);
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 12px;
    margin-bottom: 12px;
}

.exercise-editor-head {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-bottom: 10px;
}

.exercise-name {
    font-weight: 750;
}

.set-labels,
.set-row {
    display: grid;
    grid-template-columns: 1fr 1fr .8fr 34px;
    gap: 8px;
    align-items: center;
}

.set-labels {
    color: var(--muted);
    font-size: .68rem;
    padding: 0 4px 5px;
}

.set-row {
    margin-bottom: 8px;
}

.set-row input {
    min-width: 0;
}

.remove-set {
    border: 0;
    background: rgba(255,255,255,.07);
    color: var(--muted);
    border-radius: 10px;
    height: 42px;
    cursor: pointer;
    font-size: 1.2rem;
}

@media (max-width: 560px) {
    .section-head {
        display: block;
    }

    .mini-actions {
        justify-content: flex-start;
        margin-top: 10px;
    }

    .set-labels,
    .set-row {
        grid-template-columns: 1fr 1fr .8fr 32px;
        gap: 6px;
    }
}


.chart-card {
    margin-bottom: 14px;
}

.chart-canvas {
    width: 100%;
    display: block;
}


.exercise-filter {
    margin: 0 0 14px;
}

.exercise-filter label {
    max-width: 360px;
}

.exercise-progress-summary {
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin-bottom: 8px;
}

.exercise-progress-summary span {
    color: var(--muted);
    font-size: .74rem;
}


.table-action {
    color: var(--teal);
    text-decoration: none;
    font-weight: 800;
    white-space: nowrap;
}

.card-head-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.button.danger {
    background: rgba(255,95,98,.14);
    color: #ff8d8f;
    border: 1px solid rgba(255,95,98,.28);
}

.split-actions {
    justify-content: space-between;
    align-items: center;
}

.right-actions {
    display: flex;
    gap: 10px;
    margin-left: auto;
}

@media (max-width: 560px) {
    .split-actions {
        align-items: stretch;
    }

    .right-actions {
        margin-left: 0;
    }
}


.date-jump {
    max-width: 240px;
    margin-bottom: 14px;
}

.day-budget {
    margin-top: 12px;
    padding: 12px;
    border-radius: 14px;
    background: rgba(255,255,255,.045);
    border: 1px solid var(--line);
    display: flex;
    justify-content: space-between;
    gap: 16px;
}

.day-budget span,
.meal-total-line span,
.meal-item-row span,
.meal-note {
    color: var(--muted);
}

.meal-total-line {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
    margin-bottom: 10px;
}

.meal-items {
    border-top: 1px solid var(--line);
    margin-bottom: 12px;
}

.meal-item-row {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding: 10px 0;
    border-bottom: 1px solid var(--line);
}

.meal-item-row > div:last-child {
    text-align: right;
}

.meal-item-row span {
    display: block;
    font-size: .74rem;
    margin-top: 2px;
}

.meal-note {
    font-size: .82rem;
}

.final-card {
    border-color: rgba(39,199,184,.28);
}

.food-editor {
    padding: 13px;
    margin-bottom: 12px;
    border-radius: 16px;
    border: 1px solid var(--line);
    background: rgba(255,255,255,.035);
}

.food-editor-head {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-bottom: 12px;
}

.food-name {
    font-weight: 750;
}

.food-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 9px;
}

.food-result {
    color: var(--teal);
    font-size: .78rem;
    font-weight: 750;
    margin-top: 10px;
}

.meal-preview {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 8px;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid var(--line);
}

.meal-preview > div {
    padding: 10px;
    border-radius: 12px;
    background: rgba(255,255,255,.045);
    border: 1px solid var(--line);
}

.meal-preview span {
    display: block;
    color: var(--muted);
    font-size: .68rem;
    margin-bottom: 3px;
}

@media (max-width: 620px) {
    .food-grid {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }

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

    .meal-total-line {
        display: block;
    }

    .meal-total-line span {
        display: block;
        margin-top: 4px;
    }
}


.product-list {
    display: grid;
    gap: 8px;
}

.product-row {
    display: grid;
    grid-template-columns: minmax(180px, 1.6fr) minmax(220px, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 12px 0;
    border-bottom: 1px solid var(--line);
}

.product-main span {
    display: block;
    color: var(--muted);
    font-size: .7rem;
    margin-top: 3px;
}

.product-macros {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    color: var(--muted);
    font-size: .75rem;
}

.product-picker {
    display: block;
    margin-bottom: 10px;
}

@media (max-width: 660px) {
    .product-row {
        grid-template-columns: 1fr auto;
    }

    .product-macros {
        grid-column: 1 / -1;
        grid-row: 2;
    }
}


.phase-badge {
    display: inline-block;
    margin-top: 10px;
    padding: 5px 9px;
    border-radius: 999px;
    border: 1px solid rgba(39,199,184,.24);
    background: rgba(39,199,184,.08);
    color: var(--teal);
    font-size: .7rem;
    font-weight: 850;
    letter-spacing: .08em;
}

.compact-targets {
    padding-top: 14px;
    padding-bottom: 14px;
}


input[readonly] {
    opacity: .78;
    cursor: not-allowed;
}

.settings-check {
    margin-top: 18px;
    padding: 14px;
    border-radius: 16px;
    border: 1px solid var(--line);
    background: rgba(255,255,255,.035);
}

.settings-check > div:first-child {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: baseline;
}

.settings-check span {
    color: var(--muted);
    font-size: .72rem;
}

.settings-check p {
    color: var(--muted);
    font-size: .82rem;
    margin: 9px 0 12px;
}

.settings-check.valid {
    border-color: rgba(43,214,123,.28);
}

.settings-check.valid > div:first-child strong {
    color: var(--green);
}

.settings-check.invalid {
    border-color: rgba(255,95,98,.34);
}

.settings-check.invalid > div:first-child strong {
    color: var(--red);
}

.macro-derived-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 8px;
}

.macro-derived-grid > div {
    padding: 9px;
    border-radius: 12px;
    background: rgba(255,255,255,.04);
    border: 1px solid var(--line);
}

.macro-derived-grid span {
    display: block;
    margin-bottom: 3px;
}

button:disabled {
    opacity: .45;
    cursor: not-allowed;
}

@media (max-width: 560px) {
    .macro-derived-grid {
        grid-template-columns: 1fr;
    }
}


.weekly-section-title {
    margin: 22px 4px 10px;
    color: var(--orange);
    font-size: .74rem;
    font-weight: 900;
    letter-spacing: .14em;
}

.weekly-notes p {
    margin: 0;
    padding: 10px 0;
    border-bottom: 1px solid var(--line);
    color: var(--text);
    line-height: 1.45;
}

.weekly-notes p:last-child {
    border-bottom: 0;
}

.decision-card {
    margin-bottom: 14px;
    border-left: 4px solid var(--muted);
}

.decision-card strong {
    display: block;
    font-size: 1.05rem;
    line-height: 1.4;
}

.decision-card span {
    display: block;
    color: var(--muted);
    margin-top: 8px;
    font-size: .76rem;
}

.decision-card.good {
    border-left-color: var(--green);
}

.decision-card.warn {
    border-left-color: var(--yellow);
}


.camera-action {
    background: var(--teal);
}

.camera-card {
    margin-bottom: 14px;
}

.camera-help {
    color: var(--muted);
    line-height: 1.45;
    margin: 0 0 16px;
}

.camera-input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    pointer-events: none;
}

.camera-launch {
    min-height: 170px;
    border: 1px dashed rgba(39,199,184,.42);
    border-radius: 18px;
    background: rgba(39,199,184,.06);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    cursor: pointer;
    text-align: center;
    padding: 20px;
}

.camera-launch .camera-icon {
    font-size: 2.2rem;
    line-height: 1;
    margin-bottom: 5px;
}

.camera-launch strong {
    color: var(--text);
    font-size: 1.05rem;
}

.camera-launch span:last-child {
    color: var(--muted);
    font-size: .76rem;
}

.camera-preview-wrap {
    margin-top: 14px;
}

.camera-preview {
    display: block;
    width: 100%;
    max-height: 440px;
    object-fit: contain;
    border-radius: 16px;
    border: 1px solid var(--line);
    background: #02070c;
}

.camera-file-name {
    color: var(--muted);
    font-size: .7rem;
    margin-top: 6px;
    word-break: break-all;
}

.hidden {
    display: none !important;
}

.privacy-note {
    color: var(--muted);
    font-size: .72rem;
    line-height: 1.45;
    margin-top: 12px;
}

.scan-tips {
    display: grid;
    gap: 8px;
    color: var(--muted);
    font-size: .82rem;
}

.scan-result-banner {
    margin-bottom: 14px;
    border-radius: 16px;
    padding: 13px 15px;
    border: 1px solid var(--line);
    background: rgba(255,255,255,.035);
}

.scan-result-banner strong,
.scan-result-banner span {
    display: block;
}

.scan-result-banner span {
    color: var(--muted);
    font-size: .75rem;
    margin-top: 3px;
}

.scan-result-banner.good {
    border-color: rgba(43,214,123,.32);
}

.scan-result-banner.good strong {
    color: var(--green);
}

.scan-result-banner.warn {
    border-color: rgba(255,208,74,.32);
}

.scan-result-banner.warn strong {
    color: var(--yellow);
}

.scan-result-banner.bad {
    border-color: rgba(255,95,98,.36);
}

.scan-result-banner.bad strong {
    color: var(--red);
}

.warning-card p {
    color: var(--muted);
    line-height: 1.45;
    font-size: .82rem;
    padding: 8px 0;
    border-bottom: 1px solid var(--line);
    margin: 0;
}

.warning-card p:last-child {
    border-bottom: 0;
}

.ocr-details {
    margin-bottom: 18px;
}

.ocr-details summary {
    cursor: pointer;
    color: var(--teal);
    font-weight: 750;
}

.ocr-details pre {
    white-space: pre-wrap;
    word-break: break-word;
    color: var(--muted);
    font-size: .72rem;
    line-height: 1.4;
    margin: 14px 0 0;
}


.supplement-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:12px 0; }
.check-tile { display:flex; align-items:center; gap:9px; padding:11px; border:1px solid var(--line); border-radius:12px; background:rgba(255,255,255,.035); }
.check-tile input { width:auto; }
.check-tile span { margin:0; color:var(--text); }
.photo-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.photo-card { border:1px solid var(--line); border-radius:14px; overflow:hidden; background:rgba(255,255,255,.03); padding-bottom:8px; }
.photo-card img { width:100%; aspect-ratio:3/4; object-fit:cover; display:block; }
.photo-card > div { display:flex; justify-content:space-between; gap:8px; padding:8px 9px 2px; }
.photo-card span { color:var(--muted); font-size:.72rem; }
.link-button { border:0; background:none; font:inherit; font-size:.72rem; cursor:pointer; padding:4px 9px; }
.danger-text { color:#ff8d8f; }
.inline-template-form,.template-use { display:flex; gap:8px; align-items:center; margin:10px 0; }
.inline-template-form input,.template-use input { max-width:240px; }
.plan-launch-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.plan-launch { text-decoration:none; color:var(--text); padding:12px; border-radius:14px; border:1px solid var(--line); background:rgba(255,255,255,.04); }
.plan-launch span { display:block; color:var(--muted); font-size:.72rem; margin-top:4px; }
.card-actions { display:flex; gap:8px; align-items:center; justify-content:flex-end; margin-top:12px; }
.card-actions form { margin:0; }
.previous-performance { color:var(--muted); font-size:.74rem; margin:0 0 10px; padding:8px 10px; border-radius:10px; background:rgba(39,199,184,.06); }
.previous-performance strong { color:var(--teal); }
.plan-editor-row { display:grid; grid-template-columns:2fr .7fr .7fr .7fr .7fr 34px; gap:7px; margin-bottom:8px; align-items:center; }
@media(max-width:620px){.supplement-grid,.photo-grid,.plan-launch-grid{grid-template-columns:1fr}.plan-editor-row{grid-template-columns:1.8fr .7fr .7fr;}.plan-editor-row .plan-rir{grid-column:1}.plan-editor-row button{grid-column:3}.inline-template-form,.template-use{align-items:stretch;flex-direction:column}.inline-template-form input,.template-use input{max-width:none}}

/* V15 Daily Driver */
.daily-driver-card { margin-bottom:14px; border-color:rgba(39,199,184,.22); }
.daily-driver-grid { display:grid; gap:8px; }
.daily-driver-row { display:grid; grid-template-columns:34px 1fr; gap:10px; align-items:center; text-decoration:none; color:var(--text); padding:10px 11px; border:1px solid var(--line); border-radius:13px; background:rgba(255,255,255,.035); }
.daily-driver-row small { display:block; color:var(--muted); margin-top:2px; font-size:.72rem; }
.daily-driver-row.done { border-color:rgba(43,214,123,.25); background:rgba(43,214,123,.05); }
.daily-driver-row.started { border-color:rgba(255,208,74,.25); background:rgba(255,208,74,.04); }
.daily-icon { width:28px; height:28px; display:grid; place-items:center; border-radius:50%; background:rgba(255,255,255,.06); color:var(--teal); font-weight:900; }
.daily-plan-strip { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-top:12px; padding-top:12px; border-top:1px solid var(--line); color:var(--muted); font-size:.74rem; }
.daily-plan-strip a { color:var(--teal); text-decoration:none; font-weight:800; padding:5px 8px; border-radius:9px; background:rgba(39,199,184,.08); }

.compare-selectors { display:grid; grid-template-columns:1fr 1fr auto; gap:10px; align-items:end; margin-bottom:14px; }
.compare-metrics { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:14px; }
.photo-compare-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.photo-compare-grid img { width:100%; max-height:720px; object-fit:contain; background:#02070c; border-radius:14px; border:1px solid var(--line); }
.photo-placeholder { min-height:260px; display:grid; place-items:center; color:var(--muted); border:1px dashed var(--line); border-radius:14px; }

.template-quick-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.template-quick-grid form { margin:0; }
.template-quick-button { width:100%; text-align:left; border:1px solid var(--line); border-radius:13px; padding:11px; background:rgba(255,255,255,.035); color:var(--text); cursor:pointer; }
.template-quick-button strong,.template-quick-button span { display:block; }
.template-quick-button span { color:var(--muted); font-size:.7rem; margin-top:3px; }
.meal-day-projection { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:14px; padding-top:14px; border-top:1px solid var(--line); }
.meal-day-projection > div { padding:10px; border:1px solid var(--line); border-radius:12px; background:rgba(255,255,255,.035); }
.meal-day-projection span { display:block; color:var(--muted); font-size:.68rem; margin-bottom:3px; }
.over-budget { color:var(--red) !important; }

.exercise-row-progress > span { display:flex; flex-direction:column; gap:3px; }
.progress-signal { font-size:.66rem; font-weight:800; }
.progress-signal.up { color:var(--green); }
.progress-signal.stable { color:var(--teal); }
.progress-signal.down { color:var(--yellow); }
.progress-signal.new { color:var(--orange); }

.backup-list,.audit-list { display:grid; gap:7px; }
.backup-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; padding:11px 0; border-bottom:1px solid var(--line); }
.backup-row > div:first-child span { display:block; color:var(--muted); font-size:.72rem; margin-top:3px; }
.backup-actions { display:flex; align-items:flex-start; gap:8px; }
.backup-message { grid-column:1/-1; color:#ff8d8f; white-space:pre-wrap; }
.restore-details summary { color:var(--yellow); cursor:pointer; font-size:.72rem; font-weight:800; }
.restore-details form { position:absolute; right:14px; margin-top:7px; z-index:3; background:var(--card); border:1px solid var(--line); border-radius:12px; padding:10px; width:min(300px,80vw); box-shadow:0 14px 32px rgba(0,0,0,.35); }
.restore-details input { margin-bottom:8px; }
.audit-row { border:1px solid var(--line); border-radius:12px; padding:10px 12px; background:rgba(255,255,255,.025); }
.audit-row summary { display:flex; gap:10px; justify-content:space-between; cursor:pointer; }
.audit-row summary span { color:var(--muted); font-size:.72rem; }
.audit-meta { color:var(--muted); font-size:.72rem; margin:9px 0; }
.audit-row pre { white-space:pre-wrap; word-break:break-word; color:var(--muted); font-size:.7rem; }
code { color:var(--teal); }

@media(max-width:620px){
  .compare-selectors,.compare-metrics,.photo-compare-grid,.template-quick-grid,.meal-day-projection{grid-template-columns:1fr}
  .backup-row{grid-template-columns:1fr}.backup-actions{justify-content:flex-start}.restore-details form{position:static;width:100%}
}


.pf-install-button {
    position: fixed;
    right: 14px;
    bottom: calc(78px + env(safe-area-inset-bottom));
    z-index: 100;
    border: 1px solid rgba(39,199,184,.35);
    border-radius: 14px;
    background: var(--teal);
    color: #04131d;
    padding: 11px 14px;
    font: inherit;
    font-size: .78rem;
    font-weight: 850;
    box-shadow: 0 12px 30px rgba(0,0,0,.32);
    cursor: pointer;
}

.pf-connection-pill {
    position: fixed;
    left: 10px;
    bottom: calc(72px + env(safe-area-inset-bottom));
    z-index: 99;
    padding: 4px 7px;
    border-radius: 999px;
    font-size: .62rem;
    font-weight: 800;
    pointer-events: none;
    opacity: .72;
}

.pf-connection-pill.online {
    color: var(--green);
    background: rgba(43,214,123,.08);
    border: 1px solid rgba(43,214,123,.18);
}

.pf-connection-pill.offline {
    color: var(--red);
    background: rgba(255,95,98,.09);
    border: 1px solid rgba(255,95,98,.22);
}


/* V18 · GPT Sync visibility */
.sync-strip {
    display:flex; align-items:center; gap:10px; margin:0 0 14px; padding:11px 13px;
    color:var(--text); text-decoration:none; border:1px solid var(--line); border-radius:14px;
    background:rgba(255,255,255,.025);
}
.sync-strip > div { min-width:0; flex:1; }
.sync-strip strong { display:block; font-size:.82rem; }
.sync-strip small { display:block; color:var(--muted); font-size:.7rem; margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sync-arrow { color:var(--teal); font-size:1.35rem; line-height:1; }
.data-origin { color:var(--muted); font-size:.68rem; margin-top:10px; }
.sync-last { margin:10px 0 0; font-size:.72rem; }
.sync-table td { vertical-align:top; }
.event-id { display:block; color:var(--muted); font-size:.62rem; margin-top:3px; max-width:170px; overflow:hidden; text-overflow:ellipsis; }
.sync-status { display:inline-flex; border-radius:999px; padding:4px 8px; font-size:.68rem; font-weight:800; text-transform:uppercase; background:rgba(255,255,255,.07); }
.sync-status.imported { color:var(--green); background:rgba(43,214,123,.10); }
.sync-status.error { color:var(--red); background:rgba(255,95,98,.10); }
.sync-status.staged { color:var(--yellow); background:rgba(255,208,74,.10); }
.sync-status.ignored { color:var(--muted); }
.sync-error { color:var(--red); font-size:.72rem; }
@media (max-width: 650px) {
    .sync-table { min-width:760px; }
}

/* V18.4 · Activity + Daily Check */
.card-link { display:inline-block; margin-top:10px; color:var(--teal); text-decoration:none; font-weight:800; font-size:.76rem; }
.daily-feel-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.daily-feel-grid > div, .activity-hero-grid > div, .provenance-grid > div {
  background:rgba(255,255,255,.035); border:1px solid var(--line); border-radius:12px; padding:10px;
}
.daily-feel-grid span, .activity-hero-grid span, .provenance-grid span { display:block; color:var(--muted); font-size:.68rem; margin-bottom:4px; }
.daily-feel-grid strong, .activity-hero-grid strong, .provenance-grid strong { display:block; font-size:.9rem; overflow-wrap:anywhere; }
.daily-feel-grid small { display:block; color:var(--muted); font-size:.64rem; margin-top:3px; }
.activity-hero-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-top:8px; }
.activity-hero-grid strong { font-size:1.55rem; }
.activity-history { display:grid; gap:7px; }
.activity-history-row { display:grid; grid-template-columns:minmax(120px,1.4fr) 1fr 1fr; gap:8px; align-items:center; text-decoration:none; color:var(--text); padding:10px; border:1px solid var(--line); border-radius:12px; background:rgba(255,255,255,.025); }
.activity-history-row > div:first-child small { display:block; color:var(--muted); font-size:.62rem; margin-top:3px; overflow-wrap:anywhere; }
.activity-history-values { text-align:right; }
.activity-history-values strong { display:block; }
.activity-history-values span { color:var(--muted); font-size:.62rem; }
.date-jump { display:flex; gap:10px; align-items:end; margin-bottom:10px; }
.date-jump label { flex:1; }
.provenance-card { margin-bottom:12px; }
.provenance-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.provenance-grid strong { font-size:.74rem; }
.compact-note { margin:.65rem 0 0; font-size:.7rem; }
.field-origin { display:block; color:var(--teal); opacity:.82; font-size:.62rem; margin-top:5px; line-height:1.25; }
.supplement-state-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:10px 0 14px; }
.supplement-state-tile { display:block; padding:10px; border:1px solid var(--line); border-radius:12px; background:rgba(255,255,255,.025); }
.supplement-state-tile > span { display:block; font-weight:800; margin-bottom:7px; }
.supplement-state-tile select { width:100%; }
@media(max-width:620px){
  .daily-feel-grid,.provenance-grid,.supplement-state-grid{grid-template-columns:1fr;}
  .activity-history-row{grid-template-columns:1.3fr .8fr .8fr;}
}

/* V18.10 Dashboard redesign START */
.dashboard-shell { max-width: 860px; }
.dashboard-hero { padding: 10px 4px 14px; }
.dashboard-hero h1 {
    max-width: 760px;
    margin: 7px 0 8px;
    font-size: clamp(1.75rem, 6.8vw, 2.9rem);
    line-height: 1.04;
    letter-spacing: -.025em;
}
.dashboard-hero-meta { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.dashboard-hero .motto { font-size:.78rem; }
.dashboard-hero .phase-badge { margin:0; padding:4px 8px; font-size:.62rem; }

.dashboard-actions { margin-bottom:14px; }
.dashboard-actions .action-button { min-height:42px; padding:10px 13px; border-radius:12px; font-size:.78rem; }
.action-button.ghost { background:transparent; color:var(--text); border:1px solid var(--line); }
.dashboard-actions .system-action { color:var(--muted); }

.dashboard-flow { display:grid; gap:12px; }
.dashboard-card { padding:15px; border-radius:18px; box-shadow:0 12px 28px rgba(0,0,0,.17); }
.dashboard-card .card-head { margin-bottom:10px; font-size:.72rem; }

.recovery-focus-card { position:relative; overflow:hidden; }
.recovery-focus-card::before { content:""; position:absolute; inset:0 auto 0 0; width:3px; background:var(--muted); }
.recovery-focus-card.status-gruen::before { background:var(--green); }
.recovery-focus-card.status-gelb::before { background:var(--yellow); }
.recovery-focus-card.status-rot::before { background:var(--red); }
.recovery-focus { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:13px; }
.recovery-status-main { display:flex; align-items:center; gap:10px; }
.recovery-status-main .status-dot { width:15px; height:15px; }
.recovery-status-main strong { font-size:1.65rem; line-height:1; letter-spacing:.02em; }
.mini-link { color:var(--teal); text-decoration:none; font-size:.7rem; font-weight:800; white-space:nowrap; }
.recovery-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.recovery-metrics > div { min-width:0; padding:9px 8px; border:1px solid var(--line); border-radius:12px; background:rgba(255,255,255,.035); }
.recovery-metrics span,.recovery-metrics small { display:block; color:var(--muted); font-size:.61rem; }
.recovery-metrics strong { display:block; margin:3px 0 1px; font-size:1.02rem; overflow-wrap:anywhere; }

.dashboard-duo { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.compact-stat-card { min-width:0; }
.compact-primary { margin:3px 0 12px; font-size:clamp(1.65rem,7vw,2.15rem); line-height:1; font-weight:900; white-space:nowrap; }
.compact-primary small { color:var(--muted); font-size:.72rem; font-weight:750; }
.compact-subline { display:flex; justify-content:space-between; align-items:baseline; gap:8px; padding-top:9px; border-top:1px solid var(--line); }
.compact-subline span { color:var(--muted); font-size:.63rem; }
.compact-subline strong { font-size:.78rem; text-align:right; }
.compact-link { display:inline-block; margin-top:8px; }

.nutrition-dashboard-card { overflow:hidden; }
.nutrition-topline { display:flex; align-items:flex-end; justify-content:space-between; gap:12px; }
.nutrition-kcal { display:flex; align-items:baseline; gap:6px; }
.nutrition-kcal strong { font-size:2rem; line-height:1; }
.nutrition-kcal span { color:var(--muted); font-size:.74rem; font-weight:750; }
.nutrition-remaining { color:var(--teal); font-size:.78rem; font-weight:850; white-space:nowrap; }
.nutrition-progress { height:7px; margin:12px 0; overflow:hidden; border-radius:999px; background:rgba(255,255,255,.07); }
.nutrition-progress span { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--teal),#72e2d7); }
.dashboard-macro-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.dashboard-macro-grid > div { min-width:0; padding:9px; border:1px solid var(--line); border-radius:12px; background:rgba(255,255,255,.035); }
.dashboard-macro-grid span,.dashboard-macro-grid small { display:block; color:var(--muted); font-size:.61rem; }
.dashboard-macro-grid strong { display:block; margin:3px 0 1px; font-size:.9rem; }

.daily-check-compact-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.daily-check-compact-grid > div { min-width:0; padding:10px; border:1px solid var(--line); border-radius:12px; background:rgba(255,255,255,.035); }
.daily-check-compact-grid span,.daily-check-compact-grid small { display:block; color:var(--muted); font-size:.62rem; }
.daily-check-compact-grid strong { display:block; margin:4px 0 2px; font-size:.86rem; overflow-wrap:anywhere; }

.dashboard-exercise-head,.dashboard-exercise-row { display:grid; grid-template-columns:minmax(100px,1.25fr) 54px 82px minmax(100px,.95fr); gap:8px; align-items:center; }
.dashboard-exercise-head { padding:0 2px 7px; color:var(--muted); font-size:.59rem; font-weight:800; text-transform:uppercase; letter-spacing:.05em; }
.dashboard-exercise-list { border-top:1px solid var(--line); }
.dashboard-exercise-row { padding:9px 2px; border-bottom:1px solid var(--line); font-size:.74rem; }
.dashboard-exercise-row > * { min-width:0; }
.dashboard-exercise-row strong { font-size:.76rem; overflow-wrap:anywhere; }
.dashboard-exercise-row > span:not(.progress-signal) { color:var(--text); }
.dashboard-exercise-row .progress-signal { line-height:1.2; overflow-wrap:anywhere; }
.dashboard-plan-strip { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:12px; padding-top:11px; border-top:1px solid var(--line); }
.dashboard-plan-strip > span { color:var(--muted); font-size:.66rem; }
.dashboard-plan-strip > div { display:flex; gap:6px; flex-wrap:wrap; justify-content:flex-end; }
.dashboard-plan-strip a { padding:6px 8px; color:var(--teal); text-decoration:none; border-radius:9px; background:rgba(39,199,184,.08); font-size:.66rem; font-weight:800; }

.cardio-title { margin:0 0 10px; font-size:1rem; font-weight:850; }
.cardio-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.cardio-metrics > div { padding:9px; border:1px solid var(--line); border-radius:12px; background:rgba(255,255,255,.035); }
.cardio-metrics span,.cardio-metrics small { display:block; color:var(--muted); font-size:.61rem; }
.cardio-metrics strong { display:block; margin:3px 0 1px; font-size:.92rem; }

.sync-warning { border-color:rgba(255,208,74,.24); background:rgba(255,208,74,.045); }

@media (max-width:560px) {
    .dashboard-actions { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; }
    .dashboard-actions .action-button { padding:9px 4px; font-size:.64rem; }
    .dashboard-duo { gap:8px; }
    .dashboard-card { padding:13px; border-radius:16px; }
    .recovery-metrics { gap:6px; }
    .recovery-metrics > div { padding:8px 6px; }
    .recovery-metrics strong { font-size:.88rem; }
    .dashboard-macro-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .dashboard-exercise-head,.dashboard-exercise-row { grid-template-columns:minmax(82px,1.15fr) 44px 66px minmax(88px,.9fr); gap:5px; }
    .dashboard-exercise-row { font-size:.68rem; }
    .dashboard-exercise-row strong { font-size:.7rem; }
    .dashboard-exercise-row .progress-signal { font-size:.6rem; }
    .cardio-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width:390px) {
    .dashboard-hero h1 { font-size:1.65rem; }
    .recovery-status-main strong { font-size:1.45rem; }
    .compact-primary { font-size:1.55rem; }
    .compact-primary small { font-size:.64rem; }
    .compact-subline { display:block; }
    .compact-subline strong { display:block; margin-top:3px; text-align:left; }
    .daily-check-compact-grid { grid-template-columns:1fr 1fr; }
    .daily-check-compact-grid > div:last-child { grid-column:1/-1; }
    .dashboard-exercise-head { display:none; }
    .dashboard-exercise-row { grid-template-columns:minmax(90px,1fr) 42px 62px; }
    .dashboard-exercise-row .progress-signal { grid-column:1/-1; padding-top:1px; }
}
/* V18.10 Dashboard redesign END */


/* V18.10.1 Dashboard/navigation refinement */
.dashboard-hero h1 {
    text-transform: uppercase;
    letter-spacing: .005em;
}
@media (max-width: 430px) {
    .bottom-nav a {
        font-size: .61rem;
        padding-left: 1px;
        padding-right: 1px;
    }
    .dashboard-hero h1 {
        font-size: 1.55rem;
        line-height: 1.08;
    }
}


/* V18.10.2 one-line hero + dashboard order */
.dashboard-hero h1 {
    max-width: none;
    white-space: nowrap;
    font-size: clamp(1rem, 4.1vw, 2rem);
    line-height: 1.05;
    letter-spacing: -.035em;
}
@media (max-width: 430px) {
    .dashboard-hero h1 {
        font-size: clamp(.95rem, 4.15vw, 1.12rem);
        line-height: 1.08;
        letter-spacing: -.04em;
    }
}

/* ============================================================
   V18.11 · GLOBAL UI REFRESH
   Compact subpages aligned with the V18.10 dashboard language.
   ============================================================ */

.page-shell {
    width: min(860px, 100%);
    padding-top: 14px;
}

.page-hero {
    padding: 8px 4px 14px;
}

.page-hero h1 {
    margin: 5px 0 5px;
    font-size: clamp(2rem, 7vw, 2.75rem);
    line-height: .98;
    letter-spacing: -.025em;
}

.page-hero .motto {
    font-size: .76rem;
}

.page-actions {
    gap: 8px;
    margin-bottom: 12px;
    flex-wrap: wrap;
}

.page-actions .action-button,
.page-actions form .action-button {
    min-height: 42px;
    padding: 10px 13px;
    border-radius: 12px;
    font-size: .78rem;
}

.compact-section-card,
.history-card,
.training-session-card,
.compact-chart-card,
.exercise-progress-card {
    border-radius: 17px;
    padding: 14px;
    box-shadow: 0 10px 24px rgba(0,0,0,.16);
}

.compact-section-card .card-head,
.history-card .card-head,
.compact-chart-card .card-head,
.exercise-progress-card .card-head {
    margin-bottom: 10px;
}

.compact-metrics-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 8px;
}

.compact-metrics-grid > div {
    min-width: 0;
    padding: 9px 10px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: rgba(255,255,255,.035);
}

.compact-metrics-grid span {
    display: block;
    color: var(--muted);
    font-size: .64rem;
    margin-bottom: 3px;
}

.compact-metrics-grid strong {
    display: block;
    font-size: .84rem;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.compact-empty-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin: 0 0 12px;
    padding: 10px 13px;
    border: 1px dashed var(--line);
    border-radius: 13px;
    color: var(--muted);
    background: rgba(255,255,255,.018);
    font-size: .72rem;
}

.compact-empty-row > span {
    color: var(--teal);
    font-weight: 850;
    letter-spacing: .06em;
}

.compact-empty-row a {
    color: var(--teal);
    text-decoration: none;
    font-weight: 800;
}

.compact-table-wrap {
    margin: 0 -2px;
}

.compact-data-table {
    font-size: .75rem;
}

.compact-data-table th,
.compact-data-table td {
    padding: 8px 6px;
}

.compact-data-table th {
    font-size: .66rem;
}

.history-more,
.content-disclosure,
.training-session-details,
.system-disclosure {
    color: var(--text);
}

.history-more > summary,
.content-disclosure > summary {
    list-style: none;
    cursor: pointer;
    margin-top: 10px;
    padding: 10px 0 1px;
    border-top: 1px solid var(--line);
    color: var(--teal);
    font-size: .72rem;
    font-weight: 850;
}

.history-more > summary::-webkit-details-marker,
.content-disclosure > summary::-webkit-details-marker,
.training-session-details > summary::-webkit-details-marker,
.system-disclosure > summary::-webkit-details-marker {
    display: none;
}

.history-more[open] > summary,
.content-disclosure[open] > summary {
    margin-bottom: 8px;
}

.disclosure-body {
    padding-top: 3px;
}

/* BODY */
.body-current-card {
    border-radius: 18px;
    padding: 15px;
}

.body-current-layout {
    display: grid;
    grid-template-columns: minmax(170px,.72fr) minmax(0,1.65fr);
    gap: 12px;
    align-items: stretch;
}

.body-current-weight {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 6px 4px;
}

.body-current-weight > span {
    color: var(--muted);
    font-size: .65rem;
    margin-bottom: 5px;
}

.body-current-weight > strong {
    font-size: clamp(2rem,7vw,2.55rem);
    line-height: 1;
}

.body-current-weight small,
.seca-lead small {
    color: var(--muted);
    font-size: .8rem;
}

.body-current-metrics {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
}

.body-current-metrics > div {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: rgba(255,255,255,.035);
}

.body-current-metrics span {
    color: var(--muted);
    font-size: .64rem;
    margin-bottom: 4px;
}

.body-current-metrics strong {
    font-size: .88rem;
}

.body-measure-grid,
.seca-metrics-grid {
    grid-template-columns: repeat(4,minmax(0,1fr));
}

.seca-lead {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 10px;
}

.seca-lead > div span {
    display: block;
    color: var(--muted);
    font-size: .64rem;
    margin-bottom: 2px;
}

.seca-lead > div strong {
    font-size: 1.85rem;
    line-height: 1;
}

.seca-lead p {
    max-width: 420px;
    margin: 0;
    color: var(--muted);
    font-size: .7rem;
    line-height: 1.35;
    text-align: right;
}

.body-field-value {
    display: flex;
    align-items: center;
    gap: .28rem;
    white-space: nowrap;
}

.body-field-delete {
    margin: 0;
    display: inline;
}

.body-field-delete button {
    border: 0;
    background: transparent;
    color: #ff8a80;
    cursor: pointer;
    font-size: .95rem;
    line-height: 1;
    padding: .1rem .16rem;
    border-radius: .3rem;
}

.body-field-delete button:hover {
    background: rgba(255,138,128,.12);
}

.body-history-table {
    min-width: 650px;
}

/* NUTRITION */
.compact-template-grid {
    grid-template-columns: repeat(3,minmax(0,1fr));
}

.compact-template-grid .template-quick-button {
    padding: 9px 10px;
    border-radius: 11px;
}

.compact-template-grid .template-quick-button strong {
    font-size: .76rem;
}

.compact-template-grid .template-quick-button span {
    font-size: .63rem;
}

.nutrition-day-card {
    border-radius: 18px;
    padding: 15px;
}

.compact-date-jump {
    width: min(220px,100%);
    margin: -2px 0 11px;
}

.compact-date-jump label span {
    font-size: .64rem;
}

.compact-date-jump input {
    padding: 8px 10px;
    border-radius: 10px;
    font-size: .78rem;
}

.nutrition-page-topline {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
}

.nutrition-page-kcal {
    display: flex;
    align-items: baseline;
    gap: 6px;
}

.nutrition-page-kcal strong {
    font-size: 2.15rem;
    line-height: 1;
}

.nutrition-page-kcal span {
    color: var(--muted);
    font-size: .74rem;
    font-weight: 750;
}

.nutrition-page-rest {
    color: var(--teal);
    font-size: .76rem;
    font-weight: 850;
    white-space: nowrap;
}

.nutrition-page-rest.over-budget {
    color: var(--yellow);
}

.page-progress {
    margin: 10px 0 11px;
}

.nutrition-live-macros {
    grid-template-columns: repeat(4,minmax(0,1fr));
}

.nutrition-meta-line {
    display: flex;
    gap: 18px;
    flex-wrap: wrap;
    margin-top: 10px;
    padding-top: 9px;
    border-top: 1px solid var(--line);
    color: var(--muted);
    font-size: .66rem;
}

.nutrition-meta-line strong {
    color: var(--text);
    margin-left: 3px;
}

.meal-stack {
    display: grid;
    gap: 10px;
    margin-bottom: 12px;
}

.meal-compact-card {
    margin-bottom: 0;
    padding: 13px 14px;
    border-radius: 16px;
}

.meal-card-head {
    margin-bottom: 8px;
}

.meal-summary-line > div {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}

.meal-summary-line strong {
    font-size: .92rem;
}

.meal-summary-line span {
    color: var(--muted);
    font-size: .69rem;
    text-align: right;
}

.compact-meal-items {
    margin-top: 5px;
}

.compact-meal-items .meal-item-row {
    padding: 8px 0;
}

.compact-meal-note {
    padding: 9px 10px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: rgba(255,255,255,.02);
    line-height: 1.45;
}

.meal-management {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 8px;
}

.meal-management .inline-template-form {
    margin: 0;
    flex: 1 1 320px;
}

.compact-final-card {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    padding: 13px 14px;
    border-color: rgba(39,199,184,.25);
}

.compact-final-card > div strong,
.compact-final-card > div span {
    display: block;
}

.compact-final-card > div strong {
    font-size: .82rem;
    text-transform: uppercase;
    color: var(--teal);
    letter-spacing: .06em;
}

.compact-final-card > div span {
    margin-top: 3px;
    color: var(--muted);
    font-size: .68rem;
}

.week-budget-line {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
    margin-bottom: 10px;
}

.week-budget-line > div {
    display: flex;
    align-items: baseline;
    gap: 5px;
}

.week-budget-line > div strong {
    font-size: 1.65rem;
}

.week-budget-line > div span,
.week-budget-line > span {
    color: var(--muted);
    font-size: .68rem;
}

.week-budget-line > span {
    color: var(--teal);
    font-weight: 800;
}

.nutrition-week-grid {
    grid-template-columns: repeat(5,minmax(0,1fr));
}

.nutrition-history-table {
    min-width: 620px;
}

/* TRAINING */
.compact-plan-grid {
    gap: 8px;
}

.compact-plan-grid .plan-launch {
    padding: 10px 11px;
    border-radius: 12px;
}

.compact-plan-grid .plan-launch strong {
    font-size: .8rem;
}

.compact-plan-grid .plan-launch span {
    font-size: .66rem;
}

.week-stat-pair {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 8px;
}

.week-stat-pair > div {
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: rgba(255,255,255,.035);
}

.week-stat-pair span,
.week-stat-pair small {
    display: block;
    color: var(--muted);
    font-size: .64rem;
}

.week-stat-pair strong {
    display: inline-block;
    margin: 3px 4px 0 0;
    font-size: 1.05rem;
}

.training-session-stack {
    display: grid;
    gap: 10px;
}

.training-session-card {
    margin-bottom: 0;
    padding: 0;
    overflow: hidden;
}

.latest-session-card {
    border-color: rgba(39,199,184,.24);
}

.training-session-summary {
    list-style: none;
    cursor: pointer;
    display: grid;
    grid-template-columns: minmax(0,1.1fr) auto 20px;
    align-items: center;
    gap: 12px;
    padding: 13px 14px;
    user-select: none;
}

.session-title-block span,
.session-title-block strong {
    display: block;
}

.session-title-block span {
    color: var(--teal);
    font-size: .7rem;
    font-weight: 850;
    letter-spacing: .07em;
}

.session-title-block strong {
    margin-top: 3px;
    color: var(--muted);
    font-size: .68rem;
}

.session-summary-metrics {
    display: flex;
    gap: 7px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.session-summary-metrics span {
    padding: 5px 7px;
    border: 1px solid var(--line);
    border-radius: 8px;
    color: var(--muted);
    background: rgba(255,255,255,.025);
    font-size: .62rem;
    white-space: nowrap;
}

.disclosure-chevron {
    color: var(--teal);
    font-size: 1rem;
    text-align: center;
    transition: transform .18s ease;
}

.training-session-details[open] .disclosure-chevron {
    transform: rotate(180deg);
}

.training-session-body {
    padding: 0 14px 14px;
    border-top: 1px solid var(--line);
}

.session-actions-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    padding: 10px 0 8px;
}

.session-status-label {
    color: var(--muted);
    font-size: .66rem;
}

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

.training-exercise-table {
    margin-top: 11px;
}

.training-exercise-head,
.training-exercise-row {
    display: grid;
    grid-template-columns: minmax(120px,1.35fr) 70px 95px minmax(120px,1fr);
    gap: 8px;
    align-items: center;
}

.training-exercise-head {
    padding: 0 2px 7px;
    color: var(--muted);
    font-size: .59rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.training-exercise-list {
    border-top: 1px solid var(--line);
}

.training-exercise-row {
    padding: 8px 2px;
    border-bottom: 1px solid var(--line);
    font-size: .72rem;
}

.training-exercise-row strong {
    overflow-wrap: anywhere;
}

.training-exercise-row > span:not(.progress-signal) {
    color: var(--text);
}

.training-exercise-row .progress-signal {
    line-height: 1.2;
    overflow-wrap: anywhere;
}

/* PROGRESS */
.progress-overview-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-bottom: 10px;
}

.progress-count-grid {
    grid-template-columns: repeat(4,minmax(0,1fr));
}

.progress-weight-grid {
    grid-template-columns: repeat(3,minmax(0,1fr));
}

.progress-chart-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-bottom: 10px;
}

.compact-chart-card {
    margin-bottom: 0;
    min-width: 0;
}

.compact-chart-card .chart-canvas {
    min-height: 210px;
}

.exercise-progress-card {
    margin-bottom: 14px;
}

.exercise-progress-toolbar {
    display: grid;
    grid-template-columns: minmax(200px,.85fr) minmax(0,1.15fr);
    gap: 12px;
    align-items: end;
    margin-bottom: 4px;
}

.exercise-progress-toolbar .exercise-filter {
    margin: 0;
}

.exercise-progress-toolbar .exercise-progress-summary {
    margin: 0 0 3px;
}

/* SYSTEM */
.system-action-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    margin-bottom: 12px;
}

.system-action-grid form {
    margin: 0;
}

.system-action-card {
    width: 100%;
    min-height: 68px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 3px;
    padding: 11px 12px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: rgba(255,255,255,.025);
    color: var(--text);
    text-decoration: none;
    cursor: pointer;
    font: inherit;
    text-align: left;
}

.system-action-card.primary {
    border-color: rgba(39,199,184,.28);
    background: rgba(39,199,184,.08);
}

.system-action-card.secondary {
    border-color: rgba(255,159,45,.24);
    background: rgba(255,159,45,.07);
}

.system-action-card strong {
    font-size: .79rem;
}

.system-action-card span {
    color: var(--muted);
    font-size: .63rem;
}

.system-status-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-bottom: 10px;
}

.compact-status-line {
    margin: 2px 0 10px;
}

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

.system-disclosure {
    padding: 0;
    overflow: visible;
}

.system-disclosure-summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 13px 14px;
    color: var(--teal);
    font-size: .72rem;
    font-weight: 850;
    letter-spacing: .07em;
}

.system-disclosure-summary small {
    color: var(--muted);
    font-size: .65rem;
    letter-spacing: 0;
}

.system-disclosure-body {
    padding: 0 14px 14px;
    border-top: 1px solid var(--line);
}

.database-count-grid {
    grid-template-columns: repeat(4,minmax(0,1fr));
    padding-top: 11px;
}

.system-note {
    display: flex;
    gap: 12px;
    margin: 2px 0 10px;
    padding: 10px 12px;
    border: 1px dashed var(--line);
    border-radius: 12px;
    color: var(--muted);
    font-size: .67rem;
    line-height: 1.4;
}

.system-note strong {
    color: var(--teal);
    white-space: nowrap;
}

@media (max-width: 760px) {
    .progress-chart-grid {
        grid-template-columns: 1fr;
    }

    .progress-overview-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 620px) {
    .page-shell {
        padding-left: 10px;
        padding-right: 10px;
    }

    .page-hero {
        padding-bottom: 12px;
    }

    .page-hero h1 {
        font-size: 2rem;
    }

    .page-actions {
        display: grid;
        grid-template-columns: repeat(2,minmax(0,1fr));
        gap: 7px;
    }

    .page-actions .action-button {
        width: 100%;
        padding: 10px 8px;
        font-size: .7rem;
    }

    .body-actions .action-button:last-child,
    .nutrition-actions .action-button:last-child {
        grid-column: 1 / -1;
    }

    .compact-metrics-grid,
    .body-measure-grid,
    .seca-metrics-grid,
    .nutrition-week-grid,
    .database-count-grid {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .body-current-layout {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .body-current-weight {
        padding: 2px 2px 5px;
    }

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

    .seca-lead {
        align-items: flex-start;
    }

    .seca-lead p {
        max-width: 55%;
        text-align: right;
    }

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

    .nutrition-live-macros {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .meal-summary-line > div {
        align-items: flex-start;
        flex-direction: column;
        gap: 3px;
    }

    .meal-summary-line span {
        text-align: left;
    }

    .compact-final-card {
        align-items: stretch;
        flex-direction: column;
    }

    .compact-final-card .button {
        width: 100%;
    }

    .training-session-summary {
        grid-template-columns: minmax(0,1fr) 20px;
        gap: 8px;
    }

    .session-summary-metrics {
        grid-column: 1 / -1;
        grid-row: 2;
        justify-content: flex-start;
    }

    .disclosure-chevron {
        grid-column: 2;
        grid-row: 1;
    }

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

    .training-exercise-head,
    .training-exercise-row {
        grid-template-columns: minmax(90px,1.15fr) 48px 72px minmax(92px,.9fr);
        gap: 5px;
    }

    .training-exercise-row {
        font-size: .66rem;
    }

    .training-exercise-row strong {
        font-size: .68rem;
    }

    .training-exercise-row .progress-signal {
        font-size: .58rem;
    }

    .progress-overview-grid {
        grid-template-columns: 1fr;
    }

    .exercise-progress-toolbar {
        grid-template-columns: 1fr;
        gap: 7px;
    }

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

    .system-status-grid {
        grid-template-columns: 1fr;
    }

    .system-note {
        flex-direction: column;
        gap: 4px;
    }
}

@media (max-width: 390px) {
    .body-current-metrics {
        grid-template-columns: 1fr 1fr;
    }

    .body-current-metrics > div:last-child {
        grid-column: 1 / -1;
    }

    .training-exercise-head {
        display: none;
    }

    .training-exercise-row {
        grid-template-columns: minmax(90px,1fr) 42px 62px;
    }

    .training-exercise-row .progress-signal {
        grid-column: 1 / -1;
        padding-top: 1px;
    }

    .progress-count-grid,
    .progress-weight-grid {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}


/* V18.11.1 · BRAND HIERARCHY + PROGRESS SELECT UX */
.page-hero h1 {
    font-size: clamp(.95rem, 3vw, 1.6rem);
    line-height: 1.08;
    letter-spacing: -.018em;
}
.exercise-progress-card {
    scroll-margin-top: 12px;
}

/* === V18.14 SAFE DELETE === */
.session-actions-row form {
    margin: 0;
}

.danger-action {
    appearance: none;
    -webkit-appearance: none;
    background: transparent;
    border: 0;
    padding: 0;
    margin: 0;
    font: inherit;
    font-weight: 800;
    color: #c94b4b;
    cursor: pointer;
    white-space: nowrap;
}

.danger-action:hover,
.danger-action:focus-visible {
    color: #a93232;
    text-decoration: underline;
}


/* === V18.14 SAFE DELETE MODAL === */
.pf-delete-dialog {
    width: min(92vw, 430px);
    padding: 0;
    border: 0;
    border-radius: 16px;
    background: transparent;
}

.pf-delete-dialog::backdrop {
    background: rgba(0, 0, 0, .62);
}

.pf-delete-dialog-card {
    background: var(--card);
    color: var(--text);
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 20px;
    box-shadow: 0 18px 55px rgba(0, 0, 0, .30);
}

.pf-delete-dialog-card h2 {
    margin: 0 0 12px;
}

.pf-delete-dialog-description {
    margin: 0 0 12px;
    font-weight: 800;
}

.pf-delete-dialog-warning {
    margin: 0 0 20px;
    color: var(--muted);
    line-height: 1.45;
}

.pf-delete-dialog-actions {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
}

.pf-delete-cancel,
.pf-delete-confirm {
    min-height: 44px;
    border-radius: 10px;
    padding: 0 14px;
    font: inherit;
    font-weight: 800;
    cursor: pointer;
}

.pf-delete-cancel {
    border: 1px solid var(--line);
    background: transparent;
    color: var(--text);
}

.pf-delete-confirm {
    border: 1px solid #c94b4b;
    background: #c94b4b;
    color: #fff;
}

.pf-delete-confirm:disabled {
    opacity: .55;
    cursor: default;
}


/* === V19 ATHLETIC PERFORMANCE === */
.athletic-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}
.hero-system-link {
    color: var(--muted);
    text-decoration: none;
    font-size: 1.35rem;
    line-height: 1;
    padding: 8px;
}
.coaching-dashboard .dashboard-flow { gap: 12px; }
.coaching-recommendation { border-color: rgba(65, 207, 150, .35); }
.coaching-recommendation.is-stale { border-color: rgba(237, 174, 73, .45); }
.recommendation-text { font-size: 1.05rem; font-weight: 800; line-height: 1.45; margin: 8px 0; }
.recommendation-reason, .week-plan-summary { margin: 8px 0; color: var(--muted); line-height: 1.45; }
.data-freshness { display: flex; flex-wrap: wrap; gap: 6px 14px; color: var(--muted); font-size: .76rem; }
.missing-data { color: #d99b3d; font-size: .8rem; line-height: 1.4; margin: 10px 0 0; }
.empty-state { color: var(--muted); line-height: 1.5; margin: 8px 0; }
.week-performance-grid, .padel-metric-grid, .body-nutrition-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 10px;
}
.week-performance-grid > div, .padel-metric-grid > div, .body-nutrition-grid > div {
    min-width: 0;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: rgba(255,255,255,.025);
}
.week-performance-grid span, .padel-metric-grid span, .body-nutrition-grid span,
.week-performance-grid small, .padel-metric-grid small, .body-nutrition-grid small {
    display: block; color: var(--muted); font-size: .7rem;
}
.week-performance-grid strong, .padel-metric-grid strong, .body-nutrition-grid strong {
    display: block; margin: 3px 0; font-size: 1.05rem; overflow-wrap: anywhere;
}
.body-nutrition-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.coach-plan-list { display: grid; gap: 7px; margin-top: 12px; }
.coach-plan-item { display: grid; grid-template-columns: 76px minmax(0,1fr) auto; gap: 9px; align-items: center; padding: 9px 10px; border-left: 3px solid var(--line); border-radius: 8px; background: rgba(255,255,255,.025); }
.coach-plan-item time, .coach-plan-item small { color: var(--muted); font-size: .72rem; }
.coach-plan-item div small { display: block; margin-top: 2px; }
.coach-plan-item > span { font-size: .7rem; font-weight: 800; text-transform: uppercase; }
.coach-plan-item.status-completed { border-left-color: #41cf96; }
.coach-plan-item.status-cancelled { border-left-color: #c94b4b; opacity: .75; }
.week-review { border-top: 1px solid var(--line); margin-top: 12px; padding-top: 12px; }
.week-review p { margin: 5px 0; }
.padel-primary-line, .nutrition-compact-line { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; margin: 8px 0; }
.padel-primary-line span, .nutrition-compact-line span { color: var(--muted); }
.targets-line { margin: 10px 0 0; color: var(--muted); font-size: .8rem; }
.maintenance-tools { margin-bottom: 12px; }
.maintenance-tools summary { cursor: pointer; color: var(--muted); font-weight: 800; }
.maintenance-tools[open] summary { margin-bottom: 12px; }
.session-state { font-size: .72rem; font-weight: 800; text-transform: uppercase; }
.extended-set-row { display: grid; grid-template-columns: 1fr auto; gap: 8px; align-items: start; }
.extended-set-row .set-group { grid-column: 1; display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 6px; }
.extended-set-row .set-context-group { grid-template-columns: 1fr 1fr 1fr; }
.extended-set-row .set-group small { grid-column: 1 / -1; color: var(--muted); font-weight: 800; }
.extended-set-row .remove-set { grid-column: 2; grid-row: 1 / span 3; }
.training-exercise-row > span small { display: block; color: var(--muted); margin-top: 3px; }
.athletic-nav { grid-template-columns: repeat(6, minmax(0,1fr)) !important; }
.athletic-nav a[href="/padel"]::before {
    content: "P";
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    font-size: 15px;
    font-weight: 900;
    border: 2px solid currentColor;
    border-radius: 50%;
}
@media (max-width: 560px) {
    .week-performance-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
    .padel-metric-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .coach-plan-item { grid-template-columns: 66px minmax(0,1fr); }
    .coach-plan-item > span { grid-column: 2; }
    .extended-set-row .set-group { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .extended-set-row .set-context-group { grid-template-columns: 1fr; }
}
