:root {
    /* --- COLOR PALETTE: Oura/Fitness+ Vibes --- */
    --bg-body: #000000;
    --bg-surface: #1C1C1E;
    --bg-surface-elevated: #2C2C2E;
    --bg-glass: rgba(28, 28, 30, 0.75);
    
    --text-primary: #FFFFFF;
    --text-secondary: #E5E5EA; /* Very light grey, near white */
    --text-tertiary: #D1D1D6;  /* Light grey */
    
    /* Neon Accents */
    --accent-lime: #CEF24E;   /* The "Nano Banana" signature color */
    --accent-cyan: #64D2FF;
    --accent-pink: #BF5AF2;
    --accent-orange: #FF9F0A;
    --accent-red: #FF453A;
    
    /* Functional Colors */
    --score-high: #30D158;
    --score-med: #FF9F0A;
    --score-low: #FF453A;
    
    /* Borders & Lines */
    --border-subtle: rgba(255, 255, 255, 0.1);
    --border-focus: rgba(206, 242, 78, 0.5);

    /* --- TYPOGRAPHY --- */
    --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --font-mono: 'JetBrains Mono', monospace;
    
    /* --- SPACING & SIZING --- */
    --sidebar-width: 260px;
    --mobile-nav-height: 60px;
    --header-height: 70px;
    --radius-l: 24px;
    --radius-m: 16px;
    --radius-s: 12px;
}

/* --- RESET & BASE --- */
* { box-sizing: border-box; margin: 0; padding: 0; }

body {
    background-color: var(--bg-body);
    color: var(--text-primary);
    font-family: var(--font-sans);
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
    position: relative;
}

/* --- BACKGROUND DEPTH --- */
body::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: 
        radial-gradient(circle at 0% 0%, rgba(206, 242, 78, 0.08) 0%, transparent 50%),
        radial-gradient(circle at 100% 100%, rgba(191, 90, 242, 0.08) 0%, transparent 50%),
        radial-gradient(circle at 50% 50%, rgba(100, 210, 255, 0.03) 0%, transparent 60%);
    z-index: -2;
}

/* Mesh Background Patterns */
.mesh-bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: 
        radial-gradient(at 40% 20%, rgba(206, 242, 78, 0.05) 0px, transparent 50%),
        radial-gradient(at 80% 0%, rgba(100, 210, 255, 0.05) 0px, transparent 50%),
        radial-gradient(at 0% 50%, rgba(191, 90, 242, 0.05) 0px, transparent 50%);
    z-index: -3;
}

/* Ambient Animated Lights */
.ambient-light {
    position: fixed;
    width: 60vw;
    height: 60vw;
    background: radial-gradient(circle, rgba(206, 242, 78, 0.03) 0%, transparent 70%);
    filter: blur(80px);
    z-index: -1;
    pointer-events: none;
    animation: moveLight 20s infinite alternate;
}

.light-2 {
    background: radial-gradient(circle, rgba(191, 90, 242, 0.03) 0%, transparent 70%);
    animation-delay: -10s;
    right: -10%;
    bottom: -10%;
}

@keyframes moveLight {
    from { transform: translate(-10%, -10%) scale(1); }
    to { transform: translate(10%, 10%) scale(1.2); }
}

/* Noise Overlay */
.noise-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url('https://grainy-gradients.vercel.app/noise.svg');
    opacity: 0.15;
    pointer-events: none;
    z-index: 1000;
    mix-blend-mode: overlay;
}

a { text-decoration: none; color: inherit; transition: color 0.2s; }
ul { list-style: none; }

/* --- APP LAYOUT (Desktop) --- */
.app-layout {
    display: flex;
    min-height: 100vh;
    position: relative;
    z-index: 1;
}

/* Sidebar */
.app-sidebar {
    width: var(--sidebar-width);
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(20px);
    border-right: 1px solid var(--border-subtle);
    display: flex;
    flex-direction: column;
    position: fixed;
    height: 100vh;
    z-index: 100;
    padding: 1.5rem;
}

.sidebar-header {
    margin-bottom: 3rem;
    padding-left: 0.5rem;
}

.brand-link {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: var(--text-primary);
    font-weight: 800;
    font-size: 1.25rem;
    letter-spacing: -0.02em;
}

.brand-icon {
    color: var(--accent-lime);
    filter: drop-shadow(0 0 10px rgba(206, 242, 78, 0.4));
}

.sidebar-nav {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,0.08) transparent;
}
.sidebar-nav::-webkit-scrollbar { width: 3px; }
.sidebar-nav::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.08); border-radius: 2px; }

.nav-item {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.75rem 1rem;
    border-radius: var(--radius-s);
    color: var(--text-secondary);
    font-weight: 500;
    font-size: 0.95rem;
    transition: all 0.2s ease;
}

.nav-item:hover {
    background: rgba(255, 255, 255, 0.05);
    color: var(--text-primary);
}

.nav-item.active {
    background: rgba(206, 242, 78, 0.1);
    color: var(--accent-lime);
    box-shadow: inset 0 0 0 1px rgba(206, 242, 78, 0.2);
}

.nav-item i { width: 20px; text-align: center; font-size: 1.1em; }

.nav-item--admin { color: var(--text-tertiary); font-size: 0.88rem; }
.nav-item--admin i { color: rgba(206, 242, 78, 0.45); }
.nav-item--admin:hover { color: var(--accent-lime); }
.nav-item--admin:hover i { color: var(--accent-lime); }
.nav-item--admin.active { color: var(--accent-lime); }

/* Collapsible Nav Groups (Log, Admin) */
.nav-group { display: flex; flex-direction: column; }

.nav-group__trigger {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.75rem 1rem;
    border-radius: var(--radius-s);
    color: var(--text-secondary);
    font-weight: 500;
    font-size: 0.95rem;
    transition: all 0.2s ease;
    background: none;
    border: none;
    width: 100%;
    cursor: pointer;
    text-align: left;
    font-family: var(--font-sans);
}
.nav-group__trigger:hover { background: rgba(255, 255, 255, 0.05); color: var(--text-primary); }
.nav-group__trigger.active { color: var(--accent-lime); }
.nav-group__trigger i:first-child { width: 20px; text-align: center; font-size: 1.1em; flex-shrink: 0; }

.nav-group__arrow {
    margin-left: auto;
    font-size: 0.65rem !important;
    width: auto !important;
    transition: transform 0.2s ease;
    opacity: 0.45;
    flex-shrink: 0;
}
.nav-group.open .nav-group__arrow { transform: rotate(180deg); }

.nav-group__items {
    display: none;
    flex-direction: column;
    gap: 0.15rem;
    padding-left: 0.75rem;
    padding-top: 0.25rem;
}
.nav-group.open .nav-group__items { display: flex; }

.nav-sub-item {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.6rem 1rem;
    border-radius: var(--radius-s);
    color: var(--text-tertiary);
    font-weight: 500;
    font-size: 0.9rem;
    transition: all 0.2s ease;
}
.nav-sub-item:hover { background: rgba(255, 255, 255, 0.04); color: var(--text-secondary); }
.nav-sub-item.active { background: rgba(206, 242, 78, 0.08); color: var(--accent-lime); box-shadow: inset 0 0 0 1px rgba(206, 242, 78, 0.15); }
.nav-sub-item i { width: 20px; text-align: center; font-size: 0.95em; flex-shrink: 0; }

/* Admin nav group variant */
.nav-group__trigger--admin { font-size: 0.88rem; color: var(--text-tertiary); }
.nav-group__trigger--admin i:first-child { color: rgba(206, 242, 78, 0.45); }
.nav-group__trigger--admin:hover { color: var(--accent-lime); }
.nav-group__trigger--admin:hover i:first-child { color: var(--accent-lime); }
.nav-group__trigger--admin.active { color: var(--accent-lime); }
.nav-sub-item--admin { font-size: 0.85rem; }
.nav-sub-item--admin i { color: rgba(206, 242, 78, 0.45); }
.nav-sub-item--admin:hover i, .nav-sub-item--admin.active i { color: var(--accent-lime); }

/* Main Content */
.app-main {
    flex: 1;
    margin-left: var(--sidebar-width);
    padding: 2rem;
    width: calc(100% - var(--sidebar-width));
}

/* --- MOBILE LAYOUT --- */
.mobile-nav { display: none; }

@media (max-width: 768px) {
    .app-sidebar { display: none; }
    .app-main { margin-left: 0; width: 100%; padding: 1rem 1rem 5rem; }
    
    .mobile-nav {
        display: flex;
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        height: var(--mobile-nav-height);
        background: rgba(28, 28, 30, 0.85);
        backdrop-filter: blur(30px);
        border-top: 1px solid var(--border-subtle);
        justify-content: space-around;
        align-items: center;
        z-index: 1000;
        padding-bottom: env(safe-area-inset-bottom);
    }
    
    .mobile-item {
        color: var(--text-secondary);
        font-size: 1.1rem;
        padding: 0.4rem 0.25rem;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        flex: 1;
        min-width: 0;
        transition: color 0.15s ease;
    }

    .mobile-item.active { color: var(--accent-lime); }

    .mobile-item .highlight {
        color: var(--accent-lime);
        font-size: 2.2rem;
        filter: drop-shadow(0 0 12px rgba(206, 242, 78, 0.5));
        margin-top: -1.25rem;
        background: var(--bg-body);
        border-radius: 50%;
    }

    button.mobile-item {
        background: none;
        border: none;
        cursor: pointer;
    }
}

/* Log Picker Bottom Sheet (mobile) */
.log-picker-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(6px);
    z-index: 2000;
    align-items: flex-end;
}
.log-picker-overlay.active { display: flex; }

.log-picker-sheet {
    width: 100%;
    background: var(--bg-surface);
    border-top: 1px solid var(--border-subtle);
    border-radius: var(--radius-l) var(--radius-l) 0 0;
    padding: 1.5rem 1.5rem calc(1.5rem + env(safe-area-inset-bottom));
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    animation: logPickerSlideUp 0.22s cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes logPickerSlideUp {
    from { transform: translateY(100%); opacity: 0; }
    to   { transform: translateY(0);    opacity: 1; }
}

.log-picker-title {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-tertiary);
    margin-bottom: 0.5rem;
    font-family: var(--font-sans);
}

.log-picker-item {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.25rem;
    border-radius: var(--radius-s);
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid var(--border-subtle);
    color: var(--text-primary);
    font-weight: 500;
    font-size: 1rem;
    transition: background 0.15s ease, color 0.15s ease;
    font-family: var(--font-sans);
}
.log-picker-item:hover, .log-picker-item:active {
    background: rgba(206, 242, 78, 0.08);
    color: var(--accent-lime);
    border-color: rgba(206, 242, 78, 0.2);
}
.log-picker-item i {
    width: 20px;
    text-align: center;
    color: var(--accent-lime);
    font-size: 1.1em;
}
.log-picker-item--logout { color: var(--text-tertiary); }
.log-picker-item--logout i { color: var(--accent-red); opacity: 0.7; }
.log-picker-item--logout:hover, .log-picker-item--logout:active {
    background: rgba(255, 69, 58, 0.06);
    color: var(--accent-red);
    border-color: rgba(255, 69, 58, 0.15);
}
.log-picker-item--logout:hover i, .log-picker-item--logout:active i { opacity: 1; }

/* ============================================================
   LOG HEALTH — Weight hero + optional section toggles
   ============================================================ */

/* Weight hero — instrument readout, not a generic input */
.hl-weight-hero {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 2rem 1rem 1.5rem;
    margin: 0.5rem 0 0;
    border-radius: var(--radius-s);
    background: rgba(191, 90, 242, 0.04);
    border: 1px solid rgba(191, 90, 242, 0.12);
}

.hl-weight-input-wrap {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

.hl-weight-input {
    background: none;
    border: none;
    border-bottom: 2px solid rgba(191, 90, 242, 0.4);
    color: var(--text-primary);
    font-family: var(--font-mono);
    font-size: 3.5rem;
    font-weight: 600;
    letter-spacing: -0.04em;
    width: 7rem;
    text-align: center;
    padding: 0 0 0.25rem;
    outline: none;
    transition: border-color 0.2s ease;
    -moz-appearance: textfield;
}
.hl-weight-input::-webkit-inner-spin-button,
.hl-weight-input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.hl-weight-input:focus { border-bottom-color: var(--accent-pink); }
.hl-weight-input::placeholder { color: rgba(255,255,255,0.15); }

.hl-weight-unit-toggle {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.hl-unit-btn {
    background: none;
    border: 1px solid var(--border-subtle);
    color: var(--text-tertiary);
    font-family: var(--font-sans);
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    padding: 0.2rem 0.5rem;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.15s ease;
}
.hl-unit-btn.active {
    background: rgba(191, 90, 242, 0.15);
    border-color: rgba(191, 90, 242, 0.4);
    color: var(--accent-pink);
}
.hl-unit-btn:hover:not(.active) { border-color: rgba(255,255,255,0.2); color: var(--text-secondary); }

.hl-weight-label {
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    color: var(--text-tertiary);
    margin-bottom: 0.4rem;
}

.hl-weight-delta {
    font-size: 0.8rem;
    font-family: var(--font-mono);
    min-height: 1.1em;
    transition: color 0.2s ease;
}
.hl-weight-delta--down { color: var(--status-on-track, #30D158); }
.hl-weight-delta--up   { color: var(--accent-orange); }
.hl-weight-delta--flat { color: var(--text-tertiary); }

/* Optional sections */
.hl-optional-sections {
    margin-top: 1rem;
    display: flex;
    flex-direction: column;
    border-top: 1px solid var(--border-subtle);
}

.hl-section-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.85rem 0;
    cursor: pointer;
    border-bottom: 1px solid var(--border-subtle);
    transition: opacity 0.15s ease;
    user-select: none;
}
.hl-section-toggle:hover { opacity: 0.8; }
.hl-section-toggle:last-of-type { border-bottom: none; }

.hl-section-toggle__left {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--text-secondary);
}
.hl-section-toggle__left i { width: 18px; text-align: center; font-size: 0.95em; }

.hl-section-toggle__icon {
    font-size: 0.75rem;
    color: var(--text-tertiary);
    transition: transform 0.2s ease, color 0.15s ease;
}
.hl-section-toggle:hover .hl-section-toggle__icon { color: var(--accent-pink); }

/* Collapsible section body */
.hl-section-fields {
    display: none;
    padding: 1rem 0 0.5rem;
    border-bottom: 1px solid var(--border-subtle);
    margin-bottom: 0.25rem;
}
.hl-section-fields.open { display: block; }

/* Blood pressure inline layout */
.hl-bp-wrap {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}
.hl-bp-wrap .form-input { flex: 1; min-width: 0; }
.hl-bp-sep { font-size: 1.2rem; color: var(--text-tertiary); font-family: var(--font-mono); }
.hl-bp-unit { font-size: 0.75rem; color: var(--text-tertiary); white-space: nowrap; }

/* Hydration inline layout */
.hl-hydration-wrap { display: flex; gap: 0.5rem; }
.hl-hydration-wrap .form-input { flex: 1; min-width: 0; }
.hl-unit-select { width: auto !important; flex-shrink: 0; padding-right: 1.5rem !important; }

/* Rating sliders */
.hl-rating-wrap {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding-top: 0.5rem;
}
.hl-rating-slider {
    flex: 1;
    -webkit-appearance: none;
    height: 4px;
    border-radius: 2px;
    background: rgba(191, 90, 242, 0.2);
    outline: none;
    cursor: pointer;
}
.hl-rating-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--accent-pink);
    box-shadow: 0 0 8px rgba(191, 90, 242, 0.5);
    cursor: pointer;
}
.hl-rating-slider::-moz-range-thumb {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--accent-pink);
    border: none;
    cursor: pointer;
}
.hl-rating-val {
    font-family: var(--font-mono);
    font-size: 1rem;
    font-weight: 600;
    color: var(--accent-pink);
    min-width: 1.5rem;
    text-align: center;
}

/* Form label hint */
.form-label-hint {
    font-weight: 400;
    color: var(--text-tertiary);
    font-size: 0.8em;
}

/* Body composition breakdown (derived from weight + body fat %) */
.hl-composition-breakdown {
    margin: 1rem 0 0.25rem;
    padding: 1rem;
    border-radius: var(--radius-s);
    background: rgba(191, 90, 242, 0.04);
    border: 1px solid rgba(191, 90, 242, 0.12);
}

.hl-comp-bar-wrap {
    display: flex;
    height: 8px;
    border-radius: 4px;
    overflow: hidden;
    margin-bottom: 0.75rem;
    gap: 2px;
}

.hl-comp-bar-fat {
    background: var(--accent-orange);
    border-radius: 4px 0 0 4px;
    transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.hl-comp-bar-lean {
    background: var(--accent-pink);
    border-radius: 0 4px 4px 0;
    flex: 1;
    transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.hl-comp-labels {
    display: flex;
    gap: 1.5rem;
}

.hl-comp-label {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.hl-comp-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}
.hl-comp-dot--fat  { background: var(--accent-orange); }
.hl-comp-dot--lean { background: var(--accent-pink); }

.hl-comp-name {
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: var(--text-tertiary);
}

.hl-comp-value {
    font-family: var(--font-mono);
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--text-primary);
}

/* Structured measurements sub-header */
.hl-measurements-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 1.25rem 0 0.75rem;
    padding-top: 1rem;
    border-top: 1px solid var(--border-subtle);
}

.hl-measurements-title {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    color: var(--text-tertiary);
    text-transform: uppercase;
}

.hl-measure-unit-toggle {
    display: flex;
    gap: 2px;
    background: rgba(255,255,255,0.04);
    border: 1px solid var(--border-subtle);
    border-radius: 8px;
    padding: 2px;
}

.hl-measure-unit-btn {
    background: none;
    border: none;
    padding: 3px 10px;
    border-radius: 6px;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--text-tertiary);
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}
.hl-measure-unit-btn.active {
    background: var(--accent-pink);
    color: #fff;
}

/* Zozo / measurement screenshot upload zone */
.hl-zozo-zone {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 1rem;
    padding: 0.65rem 1rem;
    border: 1px dashed rgba(191, 90, 242, 0.25);
    border-radius: var(--radius-s);
    background: rgba(191, 90, 242, 0.03);
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s;
    text-decoration: none;
}
.hl-zozo-zone:hover {
    border-color: rgba(191, 90, 242, 0.5);
    background: rgba(191, 90, 242, 0.07);
}
.hl-zozo-zone--loading {
    border-color: rgba(191, 90, 242, 0.35);
    opacity: 0.7;
    pointer-events: none;
}
.hl-zozo-icon {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: rgba(191, 90, 242, 0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: var(--accent-pink);
    font-size: 0.9rem;
}
.hl-zozo-text { flex: 1; }
.hl-zozo-label {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--text-secondary);
    display: block;
}
.hl-zozo-hint {
    font-size: 0.7rem;
    color: var(--text-tertiary);
    margin-top: 1px;
}

/* --- UI COMPONENTS --- */

/* Cards */
.glass-panel, .card {
    background: rgba(28, 28, 30, 0.6);
    backdrop-filter: blur(16px);
    border-radius: var(--radius-l);
    padding: 1.5rem;
    border: 1px solid var(--border-subtle);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
    position: relative;
    overflow: hidden;
}

.glass-panel::after, .card::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.1), transparent);
}

.card-title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 0.5rem;
}

/* Buttons */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.7rem 1.5rem;
    border-radius: 100px; /* Pill shape */
    font-weight: 600;
    font-size: 0.9rem;
    cursor: pointer;
    border: none;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.btn:active { transform: scale(0.95); }

.btn-primary {
    background: var(--accent-lime);
    color: #000;
}

.btn-primary:hover {
    box-shadow: 0 0 20px rgba(206, 242, 78, 0.6);
    transform: translateY(-2px);
}

.btn-ghost {
    background: rgba(255, 255, 255, 0.08);
    color: var(--text-primary);
    border: 1px solid var(--border-subtle);
}

.btn-ghost:hover { 
    background: rgba(255, 255, 255, 0.12);
    transform: translateY(-1px);
}

/* Toasts */
.toast-overlay {
    position: fixed;
    top: 1rem;
    right: 1rem;
    z-index: 2000;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.app-toast {
    background: rgba(44, 44, 46, 0.8);
    backdrop-filter: blur(12px);
    border: 1px solid var(--border-subtle);
    padding: 0.75rem 1rem;
    border-radius: var(--radius-m);
    font-size: 0.9rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    animation: slideInRight 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(0,0,0,0.3);
}

.toast-success { border-left: 3px solid var(--score-high); color: var(--score-high); }
.toast-error { border-left: 3px solid var(--score-low); color: var(--score-low); }

/* Animations */
@keyframes slideInRight {
    from { transform: translateX(100%); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
}

/* --- DASHBOARD SPECIFIC --- */

/* Status colors — used by score ring + progress dots */
:root {
    --status-on-track: #30D158;
    --status-behind: #FF9F0A;
    --status-at-risk: #FF453A;
    --score: #FFAB40;

    /* Domain accent map */
    --training: var(--accent-lime);
    --nutrition: var(--accent-cyan);
    --health: var(--accent-pink);
    --cycle: var(--accent-orange);
    --plan: var(--accent-lime);
    --pipeline: var(--text-tertiary);
}

.dash-container {
    max-width: 1400px;
    margin: 0 auto;
}

.dash-header-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 2rem;
}

.dash-greeting {
    font-size: 2.5rem;
    font-weight: 800;
    letter-spacing: -0.04em;
    line-height: 1.1;
}

.dash-greeting span {
    color: var(--accent-lime);
    text-shadow: 0 0 20px rgba(206, 242, 78, 0.3);
}

.date-badge {
    font-size: 0.75rem;
    color: var(--text-secondary);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 0.25rem;
}

.dash-row { margin-bottom: 1.5rem; }

/* Grid System */
.grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }

@media (max-width: 1024px) {
    .grid-3, .grid-4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
    .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
    .dash-greeting { font-size: 1.75rem; }
}

/* --- Card Structure --- */
.card__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.card__label {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-secondary);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.card__body { min-height: 80px; }

/* Progress card — cap height so verbose agent summaries never blow out the card */
#progress-content {
    max-height: 320px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.12) transparent;
}

#progress-content::-webkit-scrollbar { width: 3px; }
#progress-content::-webkit-scrollbar-track { background: transparent; }
#progress-content::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.15);
    border-radius: 2px;
}
#progress-content::-webkit-scrollbar-thumb:hover { background: rgba(255, 255, 255, 0.28); }

/* Fade at the bottom hints there's more content to scroll */
#progress-section { position: relative; }
#progress-section .scroll-fade {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 48px;
    background: linear-gradient(to bottom, transparent, rgba(28, 28, 30, 0.85));
    pointer-events: none;
    border-radius: 0 0 var(--radius-l) var(--radius-l);
    transition: opacity 0.2s ease;
}
#progress-section.at-bottom .scroll-fade { opacity: 0; }

/* Button variants */
.btn--sm {
    padding: 0.4rem 0.75rem;
    font-size: 0.75rem;
    gap: 0.35rem;
}

.btn--icon {
    width: 40px;
    height: 40px;
    padding: 0;
    border-radius: var(--radius-s);
}

.btn i { pointer-events: none; }

/* --- SCORE HERO --- */
.card--hero {
    background: radial-gradient(ellipse at 20% 50%, rgba(206, 242, 78, 0.08) 0%, transparent 60%),
                rgba(28, 28, 30, 0.6);
}

.score-hero-layout {
    display: flex;
    align-items: flex-start;
    gap: 2rem;
}

.score-ring-wrap {
    position: relative;
    width: 160px;
    height: 160px;
    flex-shrink: 0;
}

.score-ring { width: 100%; height: 100%; }

.score-ring-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
}

.score-value {
    font-family: var(--font-mono);
    font-size: 3rem;
    font-weight: 900;
    line-height: 1;
    letter-spacing: -0.04em;
    color: var(--text-primary);
}

.score-details { flex: 1; min-width: 0; }

.score-feedback {
    color: var(--text-secondary);
    font-size: 0.9rem;
    line-height: 1.5;
    margin-bottom: 1rem;
    max-width: 340px;
}

/* Subscores */
.subscores { display: flex; flex-direction: column; gap: 0.5rem; }

.subscore__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.subscore__label {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.subscore__val {
    font-family: var(--font-mono);
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--text-secondary);
}

.subscore__bar {
    height: 4px;
    background: rgba(255, 255, 255, 0.06);
    border-radius: 2px;
    overflow: hidden;
    margin-top: 2px;
}

.subscore__fill {
    height: 100%;
    border-radius: 2px;
    transition: width 0.8s cubic-bezier(0.4, 0, 0.2, 1);
    width: 0;
}

.subscore__fill--lime { background: var(--accent-lime); }
.subscore__fill--cyan { background: var(--accent-cyan); }
.subscore__fill--pink { background: var(--accent-pink); }

/* Sparkline */
.sparkline-wrap {
    margin-top: 0.75rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.sparkline-label {
    font-size: 0.65rem;
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    white-space: nowrap;
}

#score-sparkline {
    flex: 1;
    height: 32px;
}

@media (max-width: 768px) {
    .score-hero-layout { flex-direction: column; align-items: center; text-align: center; }
    .score-ring-wrap { width: 120px; height: 120px; }
    .score-value { font-size: 2.25rem; }
    .score-feedback { max-width: none; }
}

/* --- PROGRESS SNAPSHOT --- */
.progress-domain {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.6rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

.progress-domain:last-child { border-bottom: none; }

.status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.status-dot--on-track { background: var(--status-on-track); box-shadow: 0 0 6px rgba(48, 209, 88, 0.5); }
.status-dot--behind { background: var(--status-behind); box-shadow: 0 0 6px rgba(255, 159, 10, 0.5); }
.status-dot--at-risk { background: var(--status-at-risk); box-shadow: 0 0 6px rgba(255, 69, 58, 0.5); }
.status-dot--unknown { background: var(--text-tertiary); }

.progress-domain-name {
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--text-primary);
    text-transform: capitalize;
    flex: 1;
}

.progress-domain-status {
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--text-secondary);
    text-transform: capitalize;
}

.progress-priority {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 0;
}

.progress-steps {
    margin: 0.5rem 0 0;
    padding: 0 0 0 1.25rem;
    list-style: none;
}

.progress-steps li {
    position: relative;
    font-size: 0.78rem;
    color: var(--text-secondary);
    line-height: 1.5;
    padding: 0.2rem 0;
}

.progress-steps li::before {
    content: '\2022';
    color: var(--text-tertiary);
    position: absolute;
    left: -1rem;
}

/* --- TREND ARROWS & ENRICHED METRICS --- */
.trend-arrow {
    font-size: 0.7rem;
    font-weight: 700;
    margin-left: 2px;
    vertical-align: middle;
}

.trend-up-good { color: var(--status-on-track); }
.trend-down-good { color: var(--status-on-track); }
.trend-up-bad { color: var(--status-at-risk); }
.trend-down-bad { color: var(--status-at-risk); }
.trend-flat { color: var(--text-tertiary); }

.consistency-badge {
    display: inline-block;
    font-size: 0.6rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    padding: 0.1rem 0.4rem;
    border-radius: 100px;
    background: rgba(255, 255, 255, 0.06);
    color: var(--text-tertiary);
    margin-left: 4px;
    vertical-align: middle;
}

.consistency-badge--high { color: var(--status-on-track); background: rgba(48, 209, 88, 0.1); }
.consistency-badge--med { color: var(--status-behind); background: rgba(255, 159, 10, 0.1); }
.consistency-badge--low { color: var(--status-at-risk); background: rgba(255, 69, 58, 0.1); }

.domain-insight-line {
    font-size: 0.75rem;
    color: var(--text-secondary);
    border-top: 1px solid rgba(255, 255, 255, 0.04);
    padding-top: 0.5rem;
    margin-top: 0.5rem;
}

/* Macro split mini-bar */
.macro-bar {
    display: flex;
    height: 4px;
    border-radius: 2px;
    overflow: hidden;
    margin-top: 0.35rem;
    gap: 1px;
}

.macro-bar__seg {
    height: 100%;
    border-radius: 1px;
}

.macro-bar__seg--protein { background: var(--accent-cyan); }
.macro-bar__seg--carbs { background: var(--accent-lime); }
.macro-bar__seg--fat { background: var(--accent-orange); }

/* Cycle phase rows (dashboard compact view) */
.cycle-phase-rows {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.cycle-phase-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
    font-size: 0.8rem;
}

.cycle-phase-row:last-child { border-bottom: none; }

.cycle-phase-domain {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: capitalize;
    min-width: 60px;
    color: var(--text-primary);
}

.cycle-phase-type {
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.1rem 0.45rem;
    border-radius: 100px;
    background: rgba(255, 255, 255, 0.06);
    color: var(--text-tertiary);
    flex: 1;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 140px;
}

.cycle-phase-score {
    font-family: var(--font-mono);
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--text-primary);
    min-width: 30px;
    text-align: right;
}

.cycle-phase-rec {
    font-size: 0.6rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.1rem 0.4rem;
    border-radius: 100px;
    color: var(--accent-cyan);
    background: rgba(100, 210, 255, 0.1);
    flex-shrink: 0;
}

/* Plan key-target line */
.plan-target {
    font-size: 0.75rem;
    color: var(--text-secondary);
    padding-left: 0;
    margin-top: 2px;
    line-height: 1.4;
}

.plan-target-line {
    font-family: var(--font-mono);
    font-size: 0.7rem;
    color: var(--text-tertiary);
}

.plan-freshness {
    font-family: var(--font-mono);
    font-size: 0.6rem;
    color: var(--text-tertiary);
    flex-shrink: 0;
}

/* --- DOMAIN CARDS --- */
.card--domain { border-top: 2px solid transparent; }
.card--domain-training { border-top-color: var(--accent-lime); }
.card--domain-nutrition { border-top-color: var(--accent-cyan); }
.card--domain-health { border-top-color: var(--accent-pink); }

.domain-icon {
    font-size: 0.85rem;
}

.domain-icon--training { color: var(--accent-lime); }
.domain-icon--nutrition { color: var(--accent-cyan); }
.domain-icon--health { color: var(--accent-pink); }
.domain-icon--cycle { color: var(--accent-orange); }
.domain-icon--plan { color: var(--accent-lime); }
.domain-icon--pipeline { color: var(--text-tertiary); }

.domain-metrics {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

/* Health card: stacked layout instead of 3-column grid */
.domain-metrics--health {
    display: flex;
    flex-direction: column;
}

.metric {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.metric-value {
    font-family: var(--font-mono);
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--text-primary);
    line-height: 1;
}

.metric-label {
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-tertiary);
}

.domain-insight {
    font-size: 0.8rem;
    color: var(--text-secondary);
    line-height: 1.5;
    border-top: 1px solid rgba(255, 255, 255, 0.04);
    padding-top: 0.75rem;
}

/* --- CYCLE --- */
.cycle-type-badge {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--accent-orange);
    background: rgba(255, 159, 10, 0.1);
    padding: 0.25rem 0.75rem;
    border-radius: 100px;
    margin-bottom: 0.75rem;
}

.cycle-progress-bar {
    height: 6px;
    background: rgba(255, 255, 255, 0.06);
    border-radius: 3px;
    overflow: hidden;
    margin-bottom: 0.75rem;
}

.cycle-progress-fill {
    height: 100%;
    background: var(--accent-orange);
    border-radius: 3px;
    transition: width 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.cycle-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
    font-size: 0.75rem;
    color: var(--text-secondary);
}

.cycle-meta strong {
    color: var(--text-primary);
    font-weight: 600;
}

/* --- PLANS --- */
.plan-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.6rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

.plan-item:last-child { border-bottom: none; }

.plan-domain {
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--accent-lime);
    background: rgba(206, 242, 78, 0.1);
    padding: 0.15rem 0.5rem;
    border-radius: 100px;
    flex-shrink: 0;
}

.plan-title {
    font-size: 0.85rem;
    color: var(--text-primary);
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.plan-next {
    font-size: 0.7rem;
    color: var(--text-tertiary);
    flex-shrink: 0;
}

.plan-status {
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--text-tertiary);
    flex-shrink: 0;
}

/* --- PIPELINE (async task tracker) --- */
.card--pipeline {
    border-top: 2px solid rgba(255, 255, 255, 0.06);
}

.pipeline-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
    font-size: 0.8rem;
}

.pipeline-row:last-child { border-bottom: none; }

.pipeline-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.pipeline-dot--queued { background: var(--text-tertiary); }
.pipeline-dot--processing { background: var(--accent-cyan); box-shadow: 0 0 6px rgba(100, 210, 255, 0.5); animation: pulse 1.5s infinite; }
.pipeline-dot--complete { background: var(--status-on-track); }
.pipeline-dot--failed { background: var(--status-at-risk); }

@keyframes pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.4; }
}

.pipeline-domain {
    font-weight: 600;
    color: var(--text-primary);
    text-transform: capitalize;
    min-width: 60px;
}

.pipeline-action {
    color: var(--text-secondary);
    flex: 1;
}

.pipeline-elapsed {
    font-family: var(--font-mono);
    font-size: 0.7rem;
    color: var(--text-tertiary);
    min-width: 28px;
    text-align: right;
}

.pipeline-status {
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--text-tertiary);
    min-width: 56px;
    text-align: right;
}

/* --- QUICK ACTIONS --- */
.dash-actions {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.dash-actions .btn {
    gap: 0.5rem;
}

/* --- EMPTY & LOADING STATES --- */
.empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 1.5rem 1rem;
    min-height: 80px;
}

.empty-state p {
    font-size: 0.85rem;
    color: var(--text-tertiary);
    margin-bottom: 0.75rem;
}

.empty-state .btn {
    font-size: 0.75rem;
    padding: 0.4rem 1rem;
}

.empty-state.error p {
    color: var(--accent-red);
}

/* Loading skeleton shimmer */
.loading {
    position: relative;
    pointer-events: none;
}

.loading .card__body,
.loading .domain-card-content {
    position: relative;
}

.loading .card__body::after,
.loading .domain-card-content::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(255, 255, 255, 0.03) 40%,
        rgba(255, 255, 255, 0.06) 50%,
        rgba(255, 255, 255, 0.03) 60%,
        transparent 100%
    );
    background-size: 200% 100%;
    animation: shimmer 1.8s infinite;
    border-radius: var(--radius-m);
    z-index: 1;
}

@keyframes shimmer {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* Dashboard toast (from dashboard.js) */
.dash-toast {
    padding: 0.6rem 1rem;
    border-radius: var(--radius-s);
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--text-primary);
    background: rgba(44, 44, 46, 0.9);
    backdrop-filter: blur(12px);
    border: 1px solid var(--border-subtle);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
    transform: translateX(120%);
    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275),
                opacity 0.3s;
    opacity: 0;
    z-index: 2001;
}

.dash-toast.show {
    transform: translateX(0);
    opacity: 1;
}

.dash-toast--success { border-left: 3px solid var(--status-on-track); }
.dash-toast--error { border-left: 3px solid var(--status-at-risk); }
.dash-toast--info { border-left: 3px solid var(--accent-cyan); }

/* Chart Container (preserved) */
.chart-container {
    position: relative;
    height: 220px;
    width: 100%;
}

@keyframes float {
    0%, 100% { transform: translateY(0) rotate(0deg); }
    50% { transform: translateY(-15px) rotate(5deg); }
}

/* --- SETTINGS DOMAIN --- */
.card--domain-settings { border-top-color: var(--score); }
.domain-icon--settings { color: var(--score); }

/* --- PROFILE-SPECIFIC (everything else reuses dashboard components) --- */

/* 4-column variant of domain-metrics for body stats */
.domain-metrics--4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 600px) { .domain-metrics--4 { grid-template-columns: repeat(2, 1fr); } }

/* Identity card layout (mirrors score-hero-layout) */
.prof-id-layout {
    display: flex;
    align-items: center;
    gap: 1.25rem;
}

.prof-avatar {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: rgba(206, 242, 78, 0.1);
    border: 2px solid rgba(206, 242, 78, 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.prof-avatar__letter {
    font-family: var(--font-mono);
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--accent-lime);
    line-height: 1;
}

.prof-id-details { flex: 1; min-width: 0; }

.prof-id-name {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--text-primary);
    line-height: 1.2;
}

.prof-id-meta {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.35rem;
}

.prof-id-years {
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--text-secondary);
}

/* Level badge (same scale as plan-domain pills) */
.prof-level-badge {
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.15rem 0.5rem;
    border-radius: 100px;
    background: rgba(255, 255, 255, 0.06);
    color: var(--text-tertiary);
}

.prof-level-badge--beginner      { color: var(--accent-cyan); background: rgba(100, 210, 255, 0.1); }
.prof-level-badge--intermediate  { color: var(--accent-lime); background: rgba(206, 242, 78, 0.1); }
.prof-level-badge--advanced      { color: var(--accent-orange); background: rgba(255, 159, 10, 0.1); }

/* Tags (same scale as plan-domain) */
.prof-tag {
    display: inline-block;
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.15rem 0.5rem;
    border-radius: 100px;
    background: rgba(255, 255, 255, 0.06);
    color: var(--text-tertiary);
    margin: 0.1rem;
}

.prof-tag--lime   { color: var(--accent-lime); background: rgba(206, 242, 78, 0.1); }
.prof-tag--cyan   { color: var(--accent-cyan); background: rgba(100, 210, 255, 0.1); }
.prof-tag--pink   { color: var(--accent-pink); background: rgba(191, 90, 242, 0.1); }
.prof-tag--active { color: var(--status-on-track); background: rgba(48, 209, 88, 0.1); }

/* Week strip (training schedule — unique to profile) */
.prof-week-strip {
    display: flex;
    gap: 0.35rem;
}

.prof-week-day {
    width: 28px;
    height: 28px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--text-tertiary);
    background: rgba(255, 255, 255, 0.04);
}

.prof-week-day--active {
    color: var(--accent-lime);
    background: rgba(206, 242, 78, 0.1);
    box-shadow: inset 0 0 0 1px rgba(206, 242, 78, 0.2);
}

/* Notification indicators (unique to profile) */
.prof-notif-row {
    display: flex;
    gap: 0.4rem;
    flex-wrap: wrap;
}

.prof-notif {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--text-tertiary);
    padding: 0.3rem 0.6rem;
    border-radius: 100px;
    background: rgba(255, 255, 255, 0.04);
}

.prof-notif i { font-size: 0.65rem; }

.prof-notif--on {
    color: var(--accent-lime);
    background: rgba(206, 242, 78, 0.08);
    box-shadow: inset 0 0 0 1px rgba(206, 242, 78, 0.15);
}

/* metric-value small unit suffix */
.metric-value small {
    font-size: 0.6rem;
    color: var(--text-tertiary);
    font-weight: 500;
    margin-left: 1px;
}

/* Edit profile container */
.prof-container--narrow { max-width: 800px; }

/* Save Bar (edit profile) */
.prof-save-bar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.75rem;
}

.prof-save-feedback {
    font-size: 0.8rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.prof-save-feedback--success { color: var(--status-on-track); }
.prof-save-feedback--saving  { color: var(--text-secondary); }

/* --- FORMS (shared across edit profile, goals, etc.) --- */
.form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}

.form-field--full { grid-column: 1 / -1; }

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

.form-label {
    display: block;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--text-secondary);
    margin-bottom: 0.3rem;
}

.form-input {
    width: 100%;
    padding: 0.55rem 0.75rem;
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-s);
    color: var(--text-primary);
    font-family: var(--font-sans);
    font-size: 0.85rem;
    transition: border-color 0.2s, background 0.2s;
    appearance: none;
    -webkit-appearance: none;
}

.form-input:focus {
    outline: none;
    border-color: rgba(255, 255, 255, 0.2);
    background: var(--bg-surface-elevated);
}

.form-input::placeholder {
    color: var(--text-tertiary);
}

select.form-input {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='rgba(255,255,255,0.4)' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-color: var(--bg-surface);
    padding-right: 2rem;
}

.form-input[type="date"],
.form-input[type="time"] {
    color-scheme: dark;
}

/* Checkbox Grid */
.form-checks {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
}

.form-check {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    cursor: pointer;
    font-size: 0.8rem;
    color: var(--text-secondary);
}

.form-check input[type="checkbox"] {
    width: 14px;
    height: 14px;
    accent-color: var(--accent-lime);
    cursor: pointer;
}

.form-check span { user-select: none; }

/* --- HELPERS --- */
.text-white { color: #ffffff !important; }
.text-white-70 { color: rgba(255, 255, 255, 0.7) !important; }
.text-secondary { color: var(--text-secondary) !important; }
.text-tertiary { color: var(--text-tertiary) !important; }
.text-lime { color: var(--accent-lime); }
.text-cyan { color: var(--accent-cyan); }
.text-pink { color: var(--accent-pink); }
.text-orange { color: var(--accent-orange); }
.text-red { color: var(--accent-red); }
.text-muted { color: var(--text-tertiary) !important; }

/* --- MODERN FORM CONTROLS (v2) --- */
.form-control-modern {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid var(--border-subtle) !important;
    color: white !important;
    padding: 0.75rem 1.25rem !important;
    border-radius: var(--radius-s) !important;
    transition: all 0.2s !important;
}

.form-control-modern:focus {
    background: rgba(255, 255, 255, 0.08) !important;
    border-color: var(--accent-lime) !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(206, 242, 78, 0.1) !important;
}

/* Modal styling refinement */
.modal-content {
    background: var(--bg-surface-elevated) !important;
    border: 1px solid var(--border-subtle) !important;
    backdrop-filter: blur(20px);
}

.form-select.bg-dark {
    background-color: var(--bg-body) !important;
    border-color: var(--border-subtle) !important;
}

/* --- DOMAIN CARD DRILL-DOWN (clickable cards) --- */
.card--domain-link {
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.card--domain-link:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5);
}

.card--domain-link .card__header .drill-arrow {
    opacity: 0;
    transition: opacity 0.2s, transform 0.2s;
    font-size: 0.75rem;
    color: var(--text-tertiary);
}

.card--domain-link:hover .card__header .drill-arrow {
    opacity: 1;
    transform: translateX(2px);
}

/* --- DOMAIN DETAIL (sub-dashboard) --- */

.detail-container { max-width: 1400px; margin: 0 auto; }

.detail-header {
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
}

.detail-header__left {
    display: flex;
    align-items: flex-end;
    gap: 1rem;
}

.detail-header__right {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-left: auto;
}

.detail-back {
    flex-shrink: 0;
    margin-bottom: 0.25rem;
}

.detail-title {
    font-size: 2rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.detail-title .domain-icon {
    font-size: 1.5rem;
}

/* Date range pills */
.detail-range-pills {
    display: flex;
    gap: 2px;
    background: rgba(255, 255, 255, 0.04);
    border-radius: 100px;
    padding: 3px;
    border: 1px solid var(--border-subtle);
}

.range-pill {
    background: transparent;
    border: none;
    color: var(--text-tertiary);
    font-family: var(--font-mono);
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.3rem 0.7rem;
    border-radius: 100px;
    cursor: pointer;
    transition: all 0.2s ease;
    letter-spacing: 0.02em;
}

.range-pill:hover {
    color: var(--text-primary);
    background: rgba(255, 255, 255, 0.06);
}

.range-pill.active {
    color: #000;
    background: var(--accent-lime);
}

/* Domain-specific active pill colors */
[data-accent="cyan"] .range-pill.active { background: var(--accent-cyan); }
[data-accent="pink"] .range-pill.active { background: var(--accent-pink); }

/* Header-embedded score gauge (health domain) */
.header-score {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.35rem 1rem 0.35rem 0.35rem;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid var(--border-subtle);
    border-radius: 100px;
}

.header-score__ring {
    position: relative;
    width: 48px;
    height: 48px;
    flex-shrink: 0;
}

.header-score__ring .score-ring {
    width: 100%;
    height: 100%;
}

.header-score__val {
    font-family: var(--font-mono);
    font-size: 1.1rem;
    font-weight: 800;
    line-height: 1;
    color: var(--text-primary);
}

.header-score__meta {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
}

.header-score__label {
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-tertiary);
    line-height: 1;
}

.header-score__feedback {
    font-size: 0.7rem;
    color: var(--text-secondary);
    line-height: 1.2;
    margin: 0;
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.header-score__actions {
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.header-score__actions .btn--sm {
    padding: 0.15rem 0.35rem;
    font-size: 0.65rem;
}

.header-score__actions .detail-score-trend {
    font-size: 0.75rem;
}

/* Score section in detail */
.detail-score-layout {
    display: flex;
    align-items: flex-start;
    gap: 1.5rem;
}

.detail-score-ring-wrap {
    position: relative;
    width: 120px;
    height: 120px;
    flex-shrink: 0;
}

.detail-score-meta {
    flex: 1;
    min-width: 0;
}

.detail-score-stats {
    display: flex;
    gap: 1.5rem;
    margin-top: 0.75rem;
}

.detail-score-stat {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.detail-score-stat .metric-value {
    font-size: 0.9rem;
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.detail-score-stat .metric-value i {
    font-size: 0.7rem;
}

.card__header-right {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.detail-score-trend {
    font-size: 1rem;
}

.detail-date-range {
    font-family: var(--font-mono);
    font-size: 0.65rem;
    color: var(--text-tertiary);
    font-weight: 500;
}

.detail-chart-period {
    font-family: var(--font-mono);
    font-size: 0.65rem;
    color: var(--text-tertiary);
    font-weight: 500;
}

/* Chart containers */
.detail-chart-wrap {
    position: relative;
    height: 240px;
    width: 100%;
}

/* AI Summary styles */
#detail-summary-content {
    max-height: 400px;
    overflow-y: auto;
}

/* ── Coach Widget (Health floating AI Insight) ── */

.coach-fab {
    position: fixed;
    bottom: 24px;
    right: 24px;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: rgba(28, 28, 30, 0.8);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid var(--border-subtle);
    cursor: pointer;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
    padding: 0;
}

.coach-fab:hover {
    transform: translateY(-2px);
    border-color: rgba(255, 255, 255, 0.2);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
}

.coach-fab__icon {
    width: 24px;
    height: 24px;
    color: var(--accent-pink);
}

.coach-fab__badge {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--accent-pink);
    display: none;
}

.coach-fab__badge--active {
    display: block;
    animation: coach-pulse 1.5s infinite;
}

@keyframes coach-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.4; }
}

.coach-panel {
    position: fixed;
    bottom: 92px;
    right: 24px;
    width: 480px;
    max-width: calc(100vw - 48px);
    max-height: 600px;
    background: rgba(28, 28, 30, 0.85);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-l);
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.5);
    z-index: 999;
    display: flex;
    flex-direction: column;
    opacity: 0;
    transform: translateY(16px) scale(0.96);
    pointer-events: none;
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.coach-panel--open {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto;
}

.coach-panel__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    flex-shrink: 0;
}

.coach-panel__label {
    font-size: 0.875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-primary);
}

.coach-panel__label i {
    font-size: 1rem;
    color: var(--accent-pink);
    margin-right: 0.5rem;
}

.coach-panel__actions {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.coach-panel__body {
    flex: 1;
    overflow-y: auto;
    padding: 1.25rem;
    min-height: 0;
}

.coach-panel__empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 2rem 1rem;
    color: var(--text-tertiary);
    text-align: center;
}

.coach-panel__empty i {
    font-size: 1.5rem;
    opacity: 0.5;
}

.coach-panel__empty p {
    font-size: 0.8rem;
    margin: 0;
}

/* Mobile: coach panel goes full width */
@media (max-width: 768px) {
    .coach-panel {
        left: 12px;
        right: 12px;
        width: auto;
        max-width: none;
        max-height: 60vh;
        bottom: 80px;
    }
}

.detail-summary-text {
    font-size: 0.85rem;
    color: var(--text-secondary);
    line-height: 1.6;
    margin-bottom: 1rem;
}

.detail-summary-reasoning {
    border-top: 1px solid rgba(255, 255, 255, 0.04);
    padding-top: 0.75rem;
    margin-bottom: 0.75rem;
}

.detail-summary-reasoning p {
    font-size: 0.8rem;
    color: var(--text-secondary);
    line-height: 1.5;
}

.detail-summary-adjustments {
    border-top: 1px solid rgba(255, 255, 255, 0.04);
    padding-top: 0.75rem;
}

.detail-summary-adjustments ul {
    list-style: none;
    padding: 0;
}

.detail-summary-adjustments li {
    font-size: 0.8rem;
    color: var(--text-secondary);
    padding: 0.3rem 0;
    padding-left: 1rem;
    position: relative;
}

.detail-summary-adjustments li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--accent-lime);
    transform: translateY(-50%);
}

[data-accent="cyan"] .detail-summary-adjustments li::before { background: var(--accent-cyan); }
[data-accent="pink"] .detail-summary-adjustments li::before { background: var(--accent-pink); }

.detail-summary-label {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-tertiary);
    display: block;
    margin-bottom: 0.4rem;
}

/* Log list */
.detail-log-list {
    display: flex;
    flex-direction: column;
}

.detail-log-row {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.65rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

.detail-log-row:last-child { border-bottom: none; }

.detail-log-date {
    font-family: var(--font-mono);
    font-size: 0.7rem;
    font-weight: 500;
    color: var(--text-tertiary);
    min-width: 80px;
    flex-shrink: 0;
}

.detail-log-name {
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--text-primary);
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.detail-log-meta {
    font-size: 0.75rem;
    color: var(--text-secondary);
    flex-shrink: 0;
}

.detail-log-stat {
    font-family: var(--font-mono);
    font-size: 0.7rem;
    color: var(--text-tertiary);
    flex-shrink: 0;
    min-width: 60px;
    text-align: right;
}

.detail-log-count {
    font-family: var(--font-mono);
    font-size: 0.65rem;
    color: var(--text-tertiary);
    font-weight: 500;
}

@media (max-width: 768px) {
    .detail-header__left { flex-direction: row; align-items: center; }
    .detail-title { font-size: 1.5rem; }
    .detail-header__right { width: 100%; justify-content: space-between; }
    .header-score { order: -1; width: 100%; border-radius: var(--radius-s); }
    .header-score__feedback { max-width: none; }
    .detail-score-layout { flex-direction: column; align-items: center; text-align: center; }
    .detail-score-ring-wrap { width: 100px; height: 100px; }
    .detail-score-stats { justify-content: center; }
    .detail-chart-wrap { height: 200px; }
    .detail-log-row { flex-wrap: wrap; gap: 0.25rem 0.5rem; }
    .detail-log-meta, .detail-log-stat { flex-basis: auto; }
}

@media (max-width: 600px) {
    .detail-range-pills { gap: 1px; }
    .range-pill { padding: 0.25rem 0.5rem; font-size: 0.65rem; }
}

/* ===================================================================
   CYCLE DETAIL (sub-dashboard)
   =================================================================== */

/* Cycle hero card — orange ambient glow */
.cycle-hero {
    background: radial-gradient(ellipse at 20% 50%, rgba(255, 159, 10, 0.06) 0%, transparent 60%),
                rgba(28, 28, 30, 0.6);
}

/* Cycle status badge */
.cycle-status-badge {
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.15rem 0.5rem;
    border-radius: 100px;
    color: var(--accent-orange);
    background: rgba(255, 159, 10, 0.1);
}

.cycle-status-badge--active { color: var(--status-on-track); background: rgba(48, 209, 88, 0.1); }
.cycle-status-badge--archived { color: var(--text-tertiary); background: rgba(255, 255, 255, 0.06); }

/* Cycle overview metrics grid */
.cycle-overview-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    margin-bottom: 1rem;
}

@media (max-width: 600px) {
    .cycle-overview-grid { grid-template-columns: repeat(2, 1fr); }
}

/* Cycle recommendation / analysis text */
.cycle-recommendation {
    border-top: 1px solid rgba(255, 255, 255, 0.04);
    padding-top: 0.75rem;
    margin-top: 0.75rem;
}

/* Cycle intelligence grid */
.cycle-intel-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.cycle-intel-item {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.cycle-intel-label {
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-tertiary);
}

.cycle-intel-value {
    font-family: var(--font-mono);
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--text-primary);
}

/* Adherence band colors */
.cycle-band--elite    { color: var(--status-on-track); }
.cycle-band--strong   { color: var(--accent-lime); }
.cycle-band--moderate { color: var(--accent-orange); }
.cycle-band--low      { color: var(--status-at-risk); }

/* --- PHASE CARDS --- */

/* Phase type row (badge + week + status) */
.phase-type-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
    flex-wrap: wrap;
}

.phase-type-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.2rem 0.6rem;
    border-radius: 100px;
    color: var(--text-tertiary);
    background: rgba(255, 255, 255, 0.06);
}

.phase-type-badge i { font-size: 0.6rem; }

.phase-type-badge--training { color: var(--accent-lime); background: rgba(206, 242, 78, 0.1); }
.phase-type-badge--nutrition { color: var(--accent-cyan); background: rgba(100, 210, 255, 0.1); }
.phase-type-badge--health { color: var(--accent-pink); background: rgba(191, 90, 242, 0.1); }

.phase-week-badge {
    font-family: var(--font-mono);
    font-size: 0.65rem;
    font-weight: 600;
    color: var(--text-secondary);
    background: rgba(255, 255, 255, 0.04);
    padding: 0.15rem 0.5rem;
    border-radius: 100px;
}

.phase-status-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--text-tertiary);
}

.phase-status-dot--active { background: var(--status-on-track); box-shadow: 0 0 6px rgba(48, 209, 88, 0.5); }
.phase-status-dot--inactive { background: var(--text-tertiary); }

/* Phase score */
.phase-score-row {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.phase-score-label {
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-tertiary);
}

.phase-score-value {
    font-family: var(--font-mono);
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--text-primary);
}

.phase-score-value small {
    font-size: 0.7rem;
    color: var(--text-tertiary);
    font-weight: 500;
}

/* Phase recommendation badge */
.phase-rec { margin-bottom: 0.5rem; }

.phase-rec-badge {
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--accent-cyan);
    background: rgba(100, 210, 255, 0.1);
    padding: 0.15rem 0.5rem;
    border-radius: 100px;
}

/* Phase goals list */
.phase-goals { margin-top: 0.5rem; }

.phase-goals-list {
    list-style: none;
    padding: 0;
}

.phase-goals-list li {
    font-size: 0.8rem;
    color: var(--text-secondary);
    padding: 0.2rem 0;
    padding-left: 0.85rem;
    position: relative;
}

.phase-goals-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--accent-orange);
    transform: translateY(-50%);
}

/* Phase adjustment count */
.phase-adj-count {
    font-size: 0.7rem;
    color: var(--text-tertiary);
    margin-top: 0.5rem;
}

.phase-adj-count i { font-size: 0.65rem; margin-right: 0.2rem; }

/* --- CYCLE GOALS --- */
.cycle-goals-list { display: flex; flex-direction: column; gap: 0.25rem; }

.cycle-goal-row {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.5rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
    font-size: 0.8rem;
}

.cycle-goal-row:last-child { border-bottom: none; }

.cycle-goal-row i { font-size: 0.75rem; flex-shrink: 0; }

.cycle-goal--achieved i { color: var(--status-on-track); }
.cycle-goal--pending i { color: var(--text-tertiary); }

.cycle-goal-text { flex: 1; color: var(--text-secondary); }
.cycle-goal-current {
    font-family: var(--font-mono);
    font-size: 0.7rem;
    color: var(--text-tertiary);
    flex-shrink: 0;
}

/* --- MICRO-ADJUSTMENTS LIST --- */
.cycle-adj-list { display: flex; flex-direction: column; }
.cycle-adj-count {
    font-family: var(--font-mono);
    font-size: 0.65rem;
    color: var(--text-tertiary);
    font-weight: 500;
}

.cycle-adj-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
    font-size: 0.8rem;
}

.cycle-adj-row:last-child { border-bottom: none; }

.cycle-adj--active { opacity: 1; }
.cycle-adj--inactive { opacity: 0.5; }

.cycle-adj-domain {
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    min-width: 50px;
}

.cycle-adj-domain--training { color: var(--accent-lime); }
.cycle-adj-domain--nutrition { color: var(--accent-cyan); }
.cycle-adj-domain--health { color: var(--accent-pink); }

.cycle-adj-type {
    font-weight: 600;
    color: var(--text-primary);
    text-transform: capitalize;
    flex: 1;
}

.cycle-adj-reason {
    font-size: 0.75rem;
    color: var(--text-secondary);
    flex: 2;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cycle-adj-date {
    font-family: var(--font-mono);
    font-size: 0.7rem;
    color: var(--text-tertiary);
    flex-shrink: 0;
}

/* --- CYCLE HISTORY TIMELINE --- */
.cycle-timeline {
    display: flex;
    flex-direction: column;
    position: relative;
    padding-left: 1.25rem;
}

.cycle-timeline::before {
    content: "";
    position: absolute;
    left: 3px;
    top: 8px;
    bottom: 8px;
    width: 1px;
    background: rgba(255, 255, 255, 0.08);
}

.cycle-timeline-item {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.4rem 0;
    position: relative;
}

.cycle-timeline-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--accent-orange);
    flex-shrink: 0;
    margin-top: 4px;
    position: absolute;
    left: -1.25rem;
    transform: translateX(-0.5px);
}

.cycle-timeline-body {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

.cycle-timeline-event {
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--text-primary);
    text-transform: capitalize;
}

.cycle-timeline-detail {
    font-size: 0.75rem;
    color: var(--text-secondary);
    text-transform: capitalize;
}

.cycle-timeline-ts {
    font-family: var(--font-mono);
    font-size: 0.65rem;
    color: var(--text-tertiary);
}

/* ===================================================================
   PLAN DETAIL (sub-dashboard)
   =================================================================== */

/* Plan hero card — lime ambient glow */
.plan-hero {
    background: radial-gradient(ellipse at 20% 50%, rgba(206, 242, 78, 0.06) 0%, transparent 60%),
                rgba(28, 28, 30, 0.6);
}

/* Plan coverage grid */
.plan-coverage-grid {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.plan-coverage-item { display: flex; flex-direction: column; gap: 3px; }

.plan-coverage-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.plan-coverage-domain {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.plan-coverage-count {
    font-family: var(--font-mono);
    font-size: 0.7rem;
    color: var(--text-tertiary);
}

/* Plan scores section */
.plan-scores-grid {
    display: flex;
    justify-content: center;
    gap: 2rem;
    margin-bottom: 1rem;
}

.plan-score-gauge {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.35rem;
}

.plan-gauge-ring { line-height: 0; }

.plan-gauge-label {
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-tertiary);
}

/* Risk flags */
.plan-risk-flags {
    margin-top: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.plan-risk-badge {
    display: inline-block;
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--accent-red);
    background: rgba(255, 69, 58, 0.1);
    padding: 0.15rem 0.5rem;
    border-radius: 100px;
    margin-right: 0.25rem;
}

/* Plan timeframe badge */
.plan-timeframe-badge {
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-tertiary);
    background: rgba(255, 255, 255, 0.06);
    padding: 0.15rem 0.5rem;
    border-radius: 100px;
}

/* Plan sessions list (training plan card) */
.plan-sessions-list {
    display: flex;
    flex-direction: column;
}

.plan-more-indicator {
    font-size: 0.7rem;
    color: var(--text-tertiary);
    text-align: center;
    padding: 0.35rem 0;
}

/* Plan log summary */
.plan-log-summary {
    border-top: 1px solid rgba(255, 255, 255, 0.04);
    padding-top: 0.5rem;
    margin-top: 0.5rem;
}

.plan-log-latest {
    font-size: 0.75rem;
    color: var(--text-secondary);
    display: block;
    margin-top: 0.15rem;
}

/* Plan outcome flags */
.plan-outcome-flags { display: flex; flex-direction: column; gap: 0.35rem; }

.plan-flags-wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
}

.plan-flag-badge {
    font-size: 0.6rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--text-secondary);
    background: rgba(255, 255, 255, 0.06);
    padding: 0.15rem 0.5rem;
    border-radius: 100px;
}

.plan-flag-badge strong {
    font-family: var(--font-mono);
    color: var(--text-primary);
    margin-left: 0.2rem;
}

/* Domain filter pill — orange active for cycle page */
[data-accent="orange"] .range-pill.active { background: var(--accent-orange); color: #000; }

/* Plan domain filter uses lime */
[data-accent="lime"] .range-pill.active { background: var(--accent-lime); color: #000; }

/* ── Training Plan Detail (L3) ── */
.trn-plan-session {
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    padding: 1rem 0;
}
.trn-plan-session:first-child { padding-top: 0; }
.trn-plan-session:last-child { border-bottom: none; padding-bottom: 0; }

.trn-plan-session__header {
    display: flex;
    align-items: baseline;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-bottom: 0.5rem;
}

.trn-plan-session__date {
    font-family: var(--font-mono);
    font-size: 0.75rem;
    color: var(--text-secondary);
    white-space: nowrap;
    flex-shrink: 0;
}

.trn-plan-session__focus {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--text-primary);
    flex: 1;
}

.trn-plan-session__scores {
    display: flex;
    gap: 0.5rem;
    margin-left: auto;
    flex-shrink: 0;
}

.trn-plan-session__adh {
    font-family: var(--font-mono);
    font-size: 0.7rem;
    color: var(--accent-lime);
}

.trn-plan-session__dev {
    font-family: var(--font-mono);
    font-size: 0.7rem;
    color: var(--accent-orange);
}

.trn-plan-session__exercises {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    padding-left: 0.75rem;
    border-left: 2px solid rgba(206, 242, 78, 0.15);
}

.trn-plan-exercise {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.25rem;
}

.trn-plan-exercise__name {
    font-size: 0.8rem;
    color: var(--text-primary);
    flex: 1;
}

.trn-plan-exercise__meta {
    display: block;
    font-family: var(--font-mono);
    font-size: 0.7rem;
    color: var(--text-tertiary);
    letter-spacing: 0.02em;
}

.trn-plan-session__notes {
    font-size: 0.75rem;
    color: var(--text-secondary);
    margin: 0.5rem 0 0;
    padding-top: 0.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.04);
    line-height: 1.5;
}

@media (max-width: 768px) {
    .cycle-overview-grid { grid-template-columns: repeat(2, 1fr); }
    .cycle-intel-grid { grid-template-columns: 1fr; }
    .plan-scores-grid { gap: 1.5rem; }
    .cycle-adj-reason { display: none; }
}

@media (max-width: 600px) {
    .phase-type-row { flex-wrap: wrap; }
    .cycle-adj-row { flex-wrap: wrap; gap: 0.25rem; }
}

/* ===================================
   WORKOUT LOGGING STYLES
   =================================== */

/* Autocomplete */
.autocomplete-wrapper {
    position: relative;
}

.autocomplete-suggestions {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--bg-surface-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-s);
    margin-top: 4px;
    max-height: 300px;
    overflow-y: auto;
    z-index: 1000;
    display: none;
}

.autocomplete-suggestions.active {
    display: block;
}

.suggestion-item {
    padding: 12px 16px;
    cursor: pointer;
    transition: background 0.2s;
    border-bottom: 1px solid var(--border-subtle);
}

.suggestion-item:last-child {
    border-bottom: none;
}

.suggestion-item:hover {
    background: rgba(206, 242, 78, 0.1);
}

.suggestion-name {
    font-weight: 500;
    color: var(--text-primary);
    margin-bottom: 4px;
}

.suggestion-meta {
    font-size: 0.875rem;
    color: var(--text-tertiary);
}

.suggestion-empty {
    padding: 16px;
    text-align: center;
    color: var(--text-tertiary);
}

/* Exercise Blocks */
.exercises-list {
    margin: 24px 0;
}

/*
.exercise-block {
    background: var(--bg-surface-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-m);
    padding: 20px;
    margin-bottom: 16px;
}
*/

.exercise-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 16px;
}

.exercise-name {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 4px;
}

.exercise-muscles {
    font-size: 0.875rem;
    color: var(--text-tertiary);
}

.exercise-pr {
    font-size: 0.875rem;
    color: var(--accent-lime);
    margin-top: 4px;
    display: flex;
    align-items: center;
    gap: 4px;
}

.exercise-pr::before {
    content: '🏆';
}

/* Sets */
.sets-list {
    margin-bottom: 12px;
}

.set-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
    padding: 0.75rem;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: var(--radius-s);
}

.set-number {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-surface-elevated);
    border-radius: 50%;
    font-weight: 600;
    font-size: 0.875rem;
    color: var(--text-secondary);
    flex-shrink: 0;
}

.set-inputs {
    display: flex;
    gap: 8px;
    flex: 1;
    flex-wrap: wrap;
}

.set-inputs input,
.set-inputs select {
    flex: 1;
    min-width: 80px;
}

.set-inputs input[type="text"] {
    flex: 2;
    min-width: 120px;
}

/* Form Elements */
.form-section {
    margin-bottom: 20px;
}

.form-label {
    display: block;
    font-weight: 500;
    color: var(--text-secondary);
    margin-bottom: 8px;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/*
.form-input {
    width: 100%;
    padding: 12px 16px;
    background: var(--bg-surface-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-s);
    color: var(--text-primary);
    font-family: var(--font-sans);
    font-size: 1rem;
    transition: border-color 0.2s, background 0.2s;
}
*/

.form-input:focus {
    outline: none;
    border-color: var(--border-focus);
    background: var(--bg-surface);
}

.form-input--sm {
    padding: 8px 12px;
    font-size: 0.875rem;
}

.form-input::placeholder {
    color: var(--text-tertiary);
}

textarea.form-input {
    resize: vertical;
    min-height: 80px;
}

.form-actions {
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    margin-top: 32px;
    padding-top: 20px;
    border-top: 1px solid var(--border-subtle);
}

/* Modal */
.modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.8);
    backdrop-filter: blur(8px);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 2000;
    padding: 20px;
}

.modal.active {
    display: flex;
}

.modal-content {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-l);
    max-width: 500px;
    width: 100%;
    max-height: 90vh;
    overflow-y: auto;
}

.modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px;
    border-bottom: 1px solid var(--border-subtle);
}

.modal-header h3 {
    font-size: 1.25rem;
    font-weight: 600;
}

.modal-body {
    padding: 24px;
}

/* Timer */
.timer-display {
    text-align: center;
}

.timer-countdown {
    font-size: 4rem;
    font-weight: 700;
    font-family: var(--font-mono);
    color: var(--accent-lime);
    margin-bottom: 32px;
}

.timer-controls {
    display: flex;
    gap: 8px;
    justify-content: center;
    margin-bottom: 24px;
    flex-wrap: wrap;
}

.timer-actions {
    display: flex;
    gap: 12px;
    justify-content: center;
}

/* Personal Records */
.prs-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 12px;
}

.pr-item {
    padding: 12px 16px;
    background: var(--bg-surface-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-s);
}

.pr-exercise {
    font-weight: 500;
    color: var(--text-primary);
    margin-bottom: 4px;
    font-size: 0.875rem;
}

.pr-value {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--accent-lime);
    font-family: var(--font-mono);
}

/* Toast Notifications */
.toast-overlay {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 3000;
    display: flex;
    flex-direction: column;
    gap: 12px;
    pointer-events: none;
}

.toast {
    background: var(--bg-surface-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-m);
    padding: 16px 20px;
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 300px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
    animation: toastSlideIn 0.3s ease;
    pointer-events: auto;
}

.toast--success {
    border-left: 4px solid var(--score-high);
}

.toast--error {
    border-left: 4px solid var(--score-low);
}

.toast--info {
    border-left: 4px solid var(--accent-cyan);
}

.toast i {
    font-size: 1.25rem;
}

.toast--success i {
    color: var(--score-high);
}

.toast--error i {
    color: var(--score-low);
}

.toast--info i {
    color: var(--accent-cyan);
}

.toast--fade-out {
    animation: toastFadeOut 0.3s ease forwards;
}

@keyframes toastSlideIn {
    from {
        transform: translateX(400px);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes toastFadeOut {
    to {
        transform: translateX(400px);
        opacity: 0;
    }
}

/* Header Actions */
.header-actions {
    display: flex;
    gap: 8px;
}

/* Mobile Responsiveness */
@media (max-width: 768px) {
    .set-inputs {
        flex-direction: column;
    }

    .set-inputs input,
    .set-inputs select {
        width: 100%;
        min-width: unset;
    }

    .form-actions {
        flex-direction: column;
    }

    .form-actions button {
        width: 100%;
    }

    .timer-countdown {
        font-size: 3rem;
    }

    .prs-list {
        grid-template-columns: 1fr;
    }

    .toast {
        min-width: unset;
        width: calc(100vw - 40px);
    }

    .toast-overlay {
        right: 20px;
        left: 20px;
    }
}

/* ===================================
   WORKOUT HISTORY STYLES
   =================================== */

/* Filters */
.history-filters {
    display: flex;
    gap: 12px;
    align-items: flex-end;
    flex-wrap: wrap;
}

.filter-group {
    flex: 1;
    min-width: 150px;
}

/* Workout List */
.workouts-list {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.workout-date-group {
    margin-bottom: 24px;
}

.workout-date-header {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 16px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--border-subtle);
}

.workout-card {
    background: var(--bg-surface-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-m);
    padding: 20px;
    margin-bottom: 12px;
    cursor: pointer;
    transition: all 0.2s;
}

.workout-card:hover {
    border-color: var(--accent-lime);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(206, 242, 78, 0.1);
}

.workout-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.workout-card-title {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--text-primary);
}

.workout-card-time {
    font-size: 0.875rem;
    color: var(--text-tertiary);
}

.workout-card-stats {
    display: flex;
    gap: 20px;
    margin-bottom: 12px;
    flex-wrap: wrap;
}

.workout-stat {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.875rem;
    color: var(--text-secondary);
}

.workout-stat i {
    color: var(--accent-lime);
}

.workout-card-notes {
    font-size: 0.875rem;
    color: var(--text-tertiary);
    font-style: italic;
    padding-top: 12px;
    border-top: 1px solid var(--border-subtle);
}

/* Workout Detail Modal */
.modal-content--large {
    max-width: 800px;
}

.workout-detail {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.workout-detail-meta {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 16px;
    padding: 16px;
    background: var(--bg-surface-elevated);
    border-radius: var(--radius-s);
}

.meta-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.meta-label {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--text-tertiary);
}

.meta-value {
    font-size: 1rem;
    font-weight: 600;
    color: var(--text-primary);
}

.section-title {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 16px;
}

.workout-detail-exercises {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.exercise-detail {
    padding: 16px;
    background: var(--bg-surface-elevated);
    border-radius: var(--radius-m);
}

.exercise-detail-name {
    font-size: 1rem;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 12px;
}

.sets-table {
    width: 100%;
    border-collapse: collapse;
}

.sets-table th {
    text-align: left;
    padding: 8px 12px;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--text-tertiary);
    border-bottom: 1px solid var(--border-subtle);
}

.sets-table td {
    padding: 12px;
    color: var(--text-secondary);
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.sets-table tr:last-child td {
    border-bottom: none;
}

.sets-table tr:hover {
    background: rgba(206, 242, 78, 0.05);
}

.workout-detail-notes {
    padding: 16px;
    background: var(--bg-surface-elevated);
    border-radius: var(--radius-m);
}

.workout-detail-notes p {
    color: var(--text-secondary);
    line-height: 1.6;
}

.modal-actions {
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    padding-top: 20px;
    border-top: 1px solid var(--border-subtle);
    margin-top: 24px;
}

.badge {
    display: inline-block;
    padding: 4px 12px;
    background: var(--bg-surface-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--text-secondary);
}

.error-state p {
    color: var(--score-low);
}

/* Button variants */
.btn-secondary {
    background: var(--bg-surface-elevated);
    color: var(--text-primary);
    border: 1px solid var(--border-subtle);
}

.btn-secondary:hover {
    background: var(--bg-surface);
    border-color: var(--accent-cyan);
}

.btn-danger {
    background: var(--score-low);
    color: white;
    border: 1px solid var(--score-low);
}

.btn-danger:hover {
    background: #cc3630;
    border-color: #cc3630;
}

/* Mobile Responsiveness */
@media (max-width: 768px) {
    .history-filters {
        flex-direction: column;
        align-items: stretch;
    }

    .filter-group {
        width: 100%;
    }

    .workout-card-stats {
        flex-direction: column;
        gap: 8px;
    }

    .workout-detail-meta {
        grid-template-columns: 1fr;
    }

    .sets-table {
        font-size: 0.875rem;
    }

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

    .modal-actions {
        flex-direction: column;
    }

    .modal-actions button {
        width: 100%;
    }
}

/* ===================================
   NUTRITION LOGGING STYLES
   =================================== */

/* Macro Grid (Daily Totals) */
.card--compact {
    margin-bottom: 20px;
}

.macro-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 16px;
}

.macro-item {
    text-align: center;
    padding: 16px;
    background: var(--bg-surface-elevated);
    border-radius: var(--radius-s);
}

.macro-label {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--text-tertiary);
    margin-bottom: 8px;
}

.macro-value {
    font-size: 1.5rem;
    font-weight: 700;
    font-family: var(--font-mono);
    color: var(--text-primary);
    margin-bottom: 8px;
}

.macro-bar {
    height: 6px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 3px;
    overflow: hidden;
}

.macro-bar-fill {
    height: 100%;
    background: var(--accent-lime);
    transition: width 0.3s ease;
}

.macro-item--calories .macro-bar-fill {
    background: var(--accent-orange);
}

.macro-item--protein .macro-bar-fill {
    background: var(--accent-cyan);
}

.macro-item--carbs .macro-bar-fill {
    background: var(--accent-lime);
}

.macro-item--fat .macro-bar-fill {
    background: var(--accent-pink);
}

/* Search Mode Toggle */
.search-mode-toggle {
    display: flex;
    gap: 8px;
}

.search-mode-toggle .btn {
    flex: 1;
    opacity: 0.6;
    transition: opacity 0.2s;
}

.search-mode-toggle .btn.active {
    opacity: 1;
    border-color: var(--accent-lime);
}

/* AI Estimate */
.ai-estimate-input-row {
    display: flex;
    gap: 8px;
    margin-bottom: 6px;
}

.ai-estimate-input-row .form-input {
    flex: 1;
}

.ai-estimate-hint {
    margin: 0 0 1rem;
    font-size: 0.8125rem;
    color: var(--text-tertiary);
}

.ai-estimate-loading {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 1rem 0;
    font-size: 0.875rem;
    color: var(--text-tertiary);
}

.spinner {
    width: 24px;
    height: 24px;
    border: 3px solid rgba(255, 255, 255, 0.1);
    border-top-color: var(--accent-lime);
    border-radius: 50%;
    animation: spin 0.7s linear infinite;
}

.spinner--sm {
    width: 18px;
    height: 18px;
    border-width: 2px;
}

.ai-estimate-error {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0.75rem 1rem;
    margin-top: 0.75rem;
    border-radius: var(--radius-s);
    background: rgba(239, 68, 68, 0.08);
    border: 1px solid rgba(239, 68, 68, 0.2);
    color: #ef4444;
    font-size: 0.875rem;
}

.ai-estimate-result {
    margin-top: 1rem;
    padding: 1.25rem;
    border-radius: var(--radius-m);
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(8px);
    animation: aiResultFadeIn 0.3s ease;
}

@keyframes aiResultFadeIn {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

.ai-confidence-badge {
    display: inline-block;
    padding: 2px 10px;
    border-radius: var(--radius-s);
    font-size: 0.75rem;
    font-family: var(--font-mono);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.ai-confidence-badge--high {
    background: rgba(34, 197, 94, 0.12);
    color: var(--score-high);
    border: 1px solid rgba(34, 197, 94, 0.25);
}

.ai-confidence-badge--medium {
    background: rgba(234, 179, 8, 0.12);
    color: var(--score-med);
    border: 1px solid rgba(234, 179, 8, 0.25);
}

.ai-confidence-badge--low {
    background: rgba(239, 68, 68, 0.12);
    color: var(--score-low);
    border: 1px solid rgba(239, 68, 68, 0.25);
}

.ai-result-actions {
    display: flex;
    gap: 8px;
    margin-top: 1rem;
}

.ai-result-actions .btn {
    min-height: 44px;
}

@media (max-width: 600px) {
    .ai-estimate-input-row {
        flex-direction: column;
    }

    .ai-result-actions {
        flex-direction: column;
    }
}

/* Manual Entry Grid */
.manual-entry-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.manual-entry-grid .form-group:first-child {
    grid-column: 1 / -1;
}

.manual-entry-grid .form-group:last-child {
    grid-column: 1 / -1;
}

.form-group {
    display: flex;
    flex-direction: column;
}

/* Foods List */
.foods-list {
    margin: 24px 0;
}

.food-item {
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: var(--radius-m);
    padding: 1rem;
    margin-bottom: 0.75rem;
}

.food-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 12px;
}

.food-name {
    font-size: 1rem;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 4px;
}

.food-macros {
    font-size: 0.875rem;
    color: var(--text-tertiary);
}

.food-controls {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.form-label-inline {
    font-size: 0.875rem;
    color: var(--text-secondary);
    margin: 0;
}

.serving-buttons {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.serving-custom {
    width: 80px;
}

/* Frequent Foods */
.frequent-foods-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 12px;
}

.frequent-food-item {
    padding: 12px 16px;
    background: var(--bg-surface-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-s);
    cursor: pointer;
    transition: all 0.2s;
}

.frequent-food-item:hover {
    border-color: var(--accent-cyan);
    transform: translateY(-2px);
}

.frequent-food-name {
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 4px;
}

.frequent-food-meta {
    font-size: 0.875rem;
    color: var(--text-tertiary);
    margin-bottom: 4px;
}

.frequent-food-count {
    font-size: 0.75rem;
    color: var(--accent-cyan);
}

/* Meal Cards (History) */
.meals-list {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.meal-date-group {
    margin-bottom: 24px;
}

.meal-date-header {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 16px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--border-subtle);
}

.meal-card {
    background: var(--bg-surface-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-m);
    padding: 20px;
    margin-bottom: 12px;
    cursor: pointer;
    transition: all 0.2s;
}

.meal-card:hover {
    border-color: var(--accent-cyan);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(100, 210, 255, 0.1);
}

.meal-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.meal-card-title {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--text-primary);
}

.meal-card-time {
    font-size: 0.875rem;
    color: var(--text-tertiary);
}

.meal-card-macros {
    display: flex;
    gap: 8px;
    margin-bottom: 12px;
    flex-wrap: wrap;
}

.macro-badge {
    padding: 4px 12px;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 12px;
    font-size: 0.875rem;
    font-family: var(--font-mono);
}

.macro-badge--calories {
    color: var(--accent-orange);
}

.macro-badge--protein {
    color: var(--accent-cyan);
}

.macro-badge--carbs {
    color: var(--accent-lime);
}

.macro-badge--fat {
    color: var(--accent-pink);
}

.meal-card-foods {
    font-size: 0.875rem;
    color: var(--text-secondary);
    margin-bottom: 8px;
}

.meal-card-notes {
    font-size: 0.875rem;
    color: var(--text-tertiary);
    font-style: italic;
    padding-top: 12px;
    border-top: 1px solid var(--border-subtle);
}

/* Meal Detail */
.meal-detail {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.macro-grid-detail {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}

.macro-detail-item {
    text-align: center;
    padding: 16px;
    background: var(--bg-surface-elevated);
    border-radius: var(--radius-s);
}

.macro-detail-label {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--text-tertiary);
    margin-bottom: 8px;
}

.macro-detail-value {
    font-size: 1.75rem;
    font-weight: 700;
    font-family: var(--font-mono);
    color: var(--accent-cyan);
}

.foods-table {
    width: 100%;
    border-collapse: collapse;
}

.foods-table th {
    text-align: left;
    padding: 8px 12px;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--text-tertiary);
    border-bottom: 1px solid var(--border-subtle);
}

.foods-table td {
    padding: 12px;
    color: var(--text-secondary);
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.foods-table tr:last-child td {
    border-bottom: none;
}

.foods-table tr:hover {
    background: rgba(100, 210, 255, 0.05);
}

/* Mobile Responsiveness */
@media (max-width: 768px) {
    .macro-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .manual-entry-grid {
        grid-template-columns: 1fr;
    }

    .macro-grid-detail {
        grid-template-columns: repeat(2, 1fr);
    }

    .food-controls {
        flex-direction: column;
        align-items: flex-start;
    }

    .serving-buttons {
        width: 100%;
    }

    .serving-custom {
        width: 100%;
    }

    .frequent-foods-list {
        grid-template-columns: 1fr;
    }

    .meal-card-macros {
        flex-direction: column;
        gap: 4px;
    }

    .foods-table {
        font-size: 0.875rem;
    }

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

/* ===================================
   UNIFIED LOG HISTORY STYLES
   =================================== */

/* Log Filters */
.log-filters {
    display: flex;
    gap: 12px;
    align-items: flex-end;
    flex-wrap: wrap;
}

/* Log Stats */
.log-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 16px;
}

.log-stat-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 20px;
    background: var(--bg-surface-elevated);
    border-radius: var(--radius-m);
    text-align: center;
}

.log-stat-item i {
    font-size: 2rem;
    margin-bottom: 12px;
    opacity: 0.5;
}

.log-stat-item--training i {
    color: var(--accent-lime);
}

.log-stat-item--nutrition i {
    color: var(--accent-cyan);
}

.log-stat-item--health i {
    color: var(--accent-pink);
}

.log-stat-value {
    font-size: 2rem;
    font-weight: 700;
    font-family: var(--font-mono);
    color: var(--text-primary);
    margin-bottom: 4px;
}

.log-stat-label {
    font-size: 0.875rem;
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Logs List */
.logs-list {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.log-date-group {
    margin-bottom: 24px;
}

.log-date-header {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 16px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--border-subtle);
}

/* Log Cards */
.log-card {
    display: flex;
    align-items: center;
    gap: 16px;
    background: var(--bg-surface-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-m);
    padding: 16px;
    margin-bottom: 12px;
    cursor: pointer;
    transition: all 0.2s;
}

.log-card:hover {
    transform: translateX(4px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.log-card--training {
    border-left: 4px solid var(--accent-lime);
}

.log-card--training:hover {
    border-left-color: var(--accent-lime);
    box-shadow: 0 4px 12px rgba(206, 242, 78, 0.2);
}

.log-card--nutrition {
    border-left: 4px solid var(--accent-cyan);
}

.log-card--nutrition:hover {
    border-left-color: var(--accent-cyan);
    box-shadow: 0 4px 12px rgba(100, 210, 255, 0.2);
}

.log-card--health {
    border-left: 4px solid var(--accent-pink);
}

.log-card--health:hover {
    border-left-color: var(--accent-pink);
    box-shadow: 0 4px 12px rgba(191, 90, 242, 0.2);
}

.log-card-icon {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.05);
    border-radius: var(--radius-s);
}

.log-card-icon i {
    font-size: 1.5rem;
}

.log-card--training .log-card-icon i {
    color: var(--accent-lime);
}

.log-card--nutrition .log-card-icon i {
    color: var(--accent-cyan);
}

.log-card--health .log-card-icon i {
    color: var(--accent-pink);
}

.log-card-content {
    flex: 1;
    min-width: 0;
}

.log-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.log-card-title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--text-primary);
}

.log-card-time {
    font-size: 0.875rem;
    color: var(--text-tertiary);
}

.log-card-stats {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    font-size: 0.875rem;
    color: var(--text-secondary);
}

.log-stat {
    display: flex;
    align-items: center;
    gap: 4px;
}

.log-stat i {
    font-size: 0.75rem;
    opacity: 0.6;
}

.log-card-notes {
    font-size: 0.875rem;
    color: var(--text-tertiary);
    font-style: italic;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.log-card-arrow {
    flex-shrink: 0;
    color: var(--text-tertiary);
    opacity: 0.4;
    transition: opacity 0.2s;
}

.log-card:hover .log-card-arrow {
    opacity: 1;
}

/* Mobile Responsiveness */
@media (max-width: 768px) {
    .log-stats {
        grid-template-columns: repeat(2, 1fr);
    }

    .log-card {
        flex-direction: column;
        align-items: flex-start;
    }

    .log-card-icon {
        width: 40px;
        height: 40px;
    }

    .log-card-stats {
        flex-direction: column;
        gap: 4px;
    }

    .log-card-arrow {
        display: none;
    }
}

/* =================================================================
   ENHANCED LOGGING FORMS (Progressive Disclosure)
   ================================================================= */

/* Log Section Headers */
.log-section {
    margin-bottom: 2rem;
}

.log-section__header {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.log-section__header i {
    color: var(--accent-lime);
    font-size: 1.1rem;
}

.log-section__label {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-secondary);
}

/* Form Grids */
.form-grid {
    display: grid;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

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

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

.form-grid--4 {
    grid-template-columns: repeat(4, 1fr);
}

@media (max-width: 768px) {
    .form-grid--2,
    .form-grid--3,
    .form-grid--4 {
        grid-template-columns: 1fr;
    }
}

/* Form Fields */
.form-field {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.form-field--full {
    grid-column: 1 / -1;
}

.form-label {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--text-secondary);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.form-label i {
    font-size: 0.875rem;
    color: var(--text-tertiary);
}

.form-input {
    background: var(--bg-surface-elevated);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: var(--radius-s);
    padding: 0.75rem 1rem;
    font-size: 0.9rem;
    color: var(--text-primary);
    font-family: 'Inter', sans-serif;
    transition: all 0.2s ease;
}

.form-input:focus {
    outline: none;
    border-color: var(--accent-lime);
    box-shadow: 0 0 0 3px rgba(206, 242, 78, 0.1);
}

.form-input::placeholder {
    color: var(--text-tertiary);
}

.form-input--mono {
    font-family: 'JetBrains Mono', monospace;
    font-weight: 500;
}

select.form-input {
    cursor: pointer;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%238E8E93' d='M6 8L2 4h8z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    padding-right: 2.5rem;
}

textarea.form-input {
    resize: vertical;
    min-height: 80px;
    font-family: 'Inter', sans-serif;
    line-height: 1.6;
}

/* Advanced Fields Toggle */
.advanced-field {
    display: none;
    opacity: 0;
    transform: translateY(-10px);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.advanced-mode .advanced-field {
    display: flex;
}

.advanced-mode .form-grid--3.advanced-field,
.advanced-mode .form-grid--2.advanced-field {
    display: grid;
}

.advanced-mode .advanced-field {
    opacity: 1;
    transform: translateY(0);
}

#advanced-toggle {
    position: relative;
}

#advanced-toggle i {
    transition: transform 0.3s ease;
}

.advanced-mode #advanced-toggle i {
    transform: rotate(180deg);
}

.advanced-mode #advanced-label::after {
    content: " ✓";
    color: var(--accent-lime);
}

/* Exercise/Set Block Enhancements */
.exercise-block {
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: var(--radius-m);
    padding: 1.5rem;
    margin-bottom: 1.5rem;
    position: relative;
}

.exercise-block::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, var(--accent-lime), transparent);
    border-radius: var(--radius-m) var(--radius-m) 0 0;
}

.exercise-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

.exercise-name {
    font-size: 1rem;
    font-weight: 600;
    color: var(--text-primary);
}

.exercise-actions {
    display: flex;
    gap: 0.5rem;
}

/*
.set-row {
    display: grid;
    grid-template-columns: 40px 1fr 1fr 1fr 1fr auto;
    gap: 0.75rem;
    align-items: center;
    margin-bottom: 0.75rem;
    padding: 0.75rem;
    background: rgba(255, 255, 255, 0.02);
    border-radius: var(--radius-s);
    transition: background 0.2s ease;
}
*/

.set-row:hover {
    background: rgba(255, 255, 255, 0.04);
}

.set-row.advanced-mode {
    grid-template-columns: 40px repeat(6, 1fr) auto;
}

.set-number {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--text-tertiary);
    text-align: center;
}

.set-input {
    background: var(--bg-surface);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 8px;
    padding: 0.5rem;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.875rem;
    color: var(--text-primary);
    text-align: center;
    transition: all 0.2s ease;
}

.set-input:focus {
    outline: none;
    border-color: var(--accent-lime);
    box-shadow: 0 0 0 2px rgba(206, 242, 78, 0.1);
}

.set-input::placeholder {
    color: var(--text-tertiary);
}

.set-input--small {
    padding: 0.4rem;
    font-size: 0.8rem;
}

/* Form Actions */
.form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    margin-top: 2rem;
    padding-top: 2rem;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}

/* Per-Exercise Advanced Fields */
.exercise-advanced {
    display: none;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    margin-top: 1rem;
    padding: 1rem;
    background: rgba(255, 255, 255, 0.02);
    border-radius: var(--radius-s);
    border: 1px dashed rgba(255, 255, 255, 0.06);
}

.advanced-mode .exercise-advanced {
    display: grid;
}

.exercise-advanced .form-field {
    margin: 0;
}

.exercise-advanced .form-label {
    font-size: 0.75rem;
}

.exercise-advanced .form-input {
    padding: 0.5rem 0.75rem;
    font-size: 0.85rem;
}

/* Meal/Food Section for Nutrition */
.meal-section {
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: var(--radius-m);
    padding: 1.5rem;
    margin-bottom: 1.5rem;
}

.meal-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, var(--accent-cyan), transparent);
    border-radius: var(--radius-m) var(--radius-m) 0 0;
}

.meal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.meal-time {
    font-size: 1rem;
    font-weight: 600;
    color: var(--text-primary);
}

/*
.food-item {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr 1fr 1fr auto;
    gap: 0.75rem;
    align-items: center;
    padding: 0.75rem;
    background: rgba(255, 255, 255, 0.02);
    border-radius: var(--radius-s);
    margin-bottom: 0.75rem;
}
*/

.food-item.advanced-mode {
    grid-template-columns: 2fr repeat(6, 1fr) auto;
}

.food-name {
    font-size: 0.875rem;
    color: var(--text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.food-brand {
    font-size: 0.75rem;
    color: var(--text-tertiary);
    margin-left: 0.5rem;
}

/* Macro Totals Panel */
.macro-totals {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
    padding: 1.5rem;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: var(--radius-m);
    margin-top: 1.5rem;
}

.macro-total {
    text-align: center;
}

.macro-total__value {
    font-family: 'JetBrains Mono', monospace;
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 0.25rem;
}

.macro-total__label {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-tertiary);
}

.macro-total--calories .macro-total__value { color: var(--accent-orange); }
.macro-total--protein .macro-total__value { color: var(--accent-lime); }
.macro-total--carbs .macro-total__value { color: var(--accent-cyan); }
.macro-total--fat .macro-total__value { color: var(--accent-pink); }

@media (max-width: 768px) {
    .macro-totals {
        grid-template-columns: repeat(2, 1fr);
    }

    .set-row {
        grid-template-columns: 40px 1fr 1fr auto;
        gap: 0.5rem;
    }

    .food-item {
        grid-template-columns: 2fr 1fr 1fr auto;
    }
}

/* Loading State for Forms */
.form-loading {
    pointer-events: none;
    opacity: 0.6;
}

.form-loading::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 32px;
    height: 32px;
    margin: -16px 0 0 -16px;
    border: 3px solid rgba(206, 242, 78, 0.2);
    border-top-color: var(--accent-lime);
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

/* Serving Size Modal */
.modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.8);
    backdrop-filter: blur(4px);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 1rem;
}

.modal-content {
    background: var(--card-bg);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    max-width: 500px;
    width: 100%;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}

.modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.modal-header h3 {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
}

.modal-body {
    padding: 1.5rem;
}

.modal-footer {
    display: flex;
    gap: 0.75rem;
    justify-content: flex-end;
    padding: 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.serving-controls {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.serving-preview {
    margin-top: 1.5rem;
    padding: 1rem;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 8px;
}

.macro-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
}

.macro-item {
    text-align: center;
}

.macro-item__value {
    font-family: 'JetBrains Mono', monospace;
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--accent-cyan);
    margin-bottom: 0.25rem;
}

.macro-item__label {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: rgba(255, 255, 255, 0.5);
}

@media (max-width: 640px) {
    .macro-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* ==================== HEALTH DASHBOARD ENHANCEMENTS ==================== */

/* Health Hero Row - Readiness ring + primary metrics */
.health-hero-row {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    margin-bottom: 0.75rem;
}

/* Weight Hero — value header + 15-day trendline */
.health-weight-hero {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    width: 100%;
    margin-bottom: 0.75rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.health-weight-header {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.health-weight-label {
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-tertiary);
}

.health-weight-row {
    display: flex;
    align-items: baseline;
    gap: 0.75rem;
}

.health-weight-value {
    font-family: var(--font-mono);
    font-size: 1.6rem;
    font-weight: 900;
    line-height: 1;
    color: var(--accent-pink);
    letter-spacing: -0.02em;
    white-space: nowrap;
}

.health-weight-unit {
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--text-secondary);
    margin-left: 0.15rem;
}

.health-weight-delta {
    font-family: var(--font-mono);
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
}

.health-weight-delta--down {
    color: var(--status-on-track);
}

.health-weight-delta--up {
    color: var(--accent-orange);
}

.health-weight-delta--flat {
    color: var(--text-tertiary);
}

/* 15-day trendline — the key visual */
.health-weight-trendline {
    width: 100%;
    height: 64px;
}

.health-weight-trendline svg {
    width: 100%;
    height: 100%;
    display: block;
}

/* Readiness Ring (Mini) - DEPRECATED, replaced by weight hero */
.health-readiness-ring-wrap {
    position: relative;
    width: 60px;
    height: 60px;
    flex-shrink: 0;
}

.health-readiness-ring {
    width: 60px;
    height: 60px;
    transform: rotate(0deg);
}

.health-readiness-value {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-family: var(--font-mono);
    font-size: 1rem;
    font-weight: 700;
    color: var(--accent-pink);
    line-height: 1;
}

/* Primary Health Metrics — 4 columns, no wrap */
.health-primary-metrics {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.5rem;
    flex: 1;
}

.health-primary-metrics .metric-value {
    font-size: 1rem;
    white-space: nowrap;
}

.health-primary-metrics .metric-label {
    white-space: nowrap;
}

/* Secondary Biometrics Row */
.health-biometrics {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    padding: 0.5rem 0;
    margin-bottom: 0.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.04);
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

.health-bio-item {
    font-size: 0.75rem;
    color: var(--text-tertiary);
    font-weight: 500;
}

.health-bio-item strong {
    font-family: var(--font-mono);
    color: var(--text-secondary);
    font-weight: 600;
    margin-left: 0.25rem;
}

/* Sleep Architecture Strip */
.sleep-architecture {
    margin-top: 0.5rem;
}

.sleep-arch-bar {
    display: flex;
    height: 8px;
    border-radius: 4px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.03);
    margin-bottom: 0.5rem;
}

.sleep-arch-seg {
    height: 100%;
    transition: flex 0.3s ease;
    position: relative;
    cursor: help;
}

.sleep-arch-seg--deep {
    background: linear-gradient(90deg, #6B46C1 0%, #7C3AED 100%);
}

.sleep-arch-seg--rem {
    background: linear-gradient(90deg, #BF5AF2 0%, #D946EF 100%);
}

.sleep-arch-seg--light {
    background: linear-gradient(90deg, #C084FC 0%, #E9D5FF 100%);
}

.sleep-arch-seg--awake {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.05) 100%);
}

.sleep-arch-labels {
    display: flex;
    justify-content: space-between;
    gap: 0.5rem;
}

.sleep-arch-label {
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--text-tertiary);
    flex: 1;
    text-align: center;
}

.sleep-arch-label:nth-child(1) { color: #7C3AED; }
.sleep-arch-label:nth-child(2) { color: var(--accent-pink); }
.sleep-arch-label:nth-child(3) { color: #C084FC; }
.sleep-arch-label:nth-child(4) { color: rgba(255, 255, 255, 0.3); }

/* Responsive adjustments */
@media (max-width: 768px) {
    .health-hero-row {
        flex-direction: column;
        align-items: center;
    }

    .health-readiness-ring-wrap {
        margin-bottom: 0.5rem;
    }

    .health-primary-metrics {
        width: 100%;
        grid-template-columns: repeat(2, 1fr);
    }

    .health-biometrics {
        justify-content: center;
    }
}

/* ==================== TRAINING L1 CARD ENHANCEMENTS ==================== */

/* Training card: stacked layout like health */
.domain-metrics--training {
    display: flex;
    flex-direction: column;
}

/* Volume Hero — value header + sparkline */
.trn-volume-hero {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    width: 100%;
    margin-bottom: 0.75rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.trn-volume-header {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.trn-volume-label {
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-tertiary);
}

.trn-volume-row {
    display: flex;
    align-items: baseline;
    gap: 0.75rem;
}

.trn-volume-value {
    font-family: var(--font-mono);
    font-size: 1.6rem;
    font-weight: 900;
    line-height: 1;
    color: var(--accent-lime);
    letter-spacing: -0.02em;
    white-space: nowrap;
}

.trn-volume-unit {
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--text-secondary);
    margin-left: 0.15rem;
}

.trn-volume-delta {
    font-family: var(--font-mono);
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
}

.trn-volume-delta--up   { color: var(--status-on-track); }
.trn-volume-delta--down { color: var(--accent-orange); }
.trn-volume-delta--flat { color: var(--text-tertiary); }

.trn-volume-sparkline {
    width: 100%;
    height: 48px;
}

.trn-volume-sparkline svg {
    width: 100%;
    height: 100%;
    display: block;
}

/* Primary Training Metrics — 3 columns */
.trn-primary-metrics {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.trn-primary-metrics .metric-value {
    font-size: 1rem;
    white-space: nowrap;
}

.trn-primary-metrics .metric-label {
    white-space: nowrap;
}

/* Top Exercises Strip */
.trn-top-exercises-strip {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    padding: 0.5rem 0;
    border-top: 1px solid rgba(255, 255, 255, 0.04);
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
    margin-bottom: 0.5rem;
}

.trn-top-label {
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-tertiary);
}

.trn-top-exercises {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.trn-top-exercise {
    font-size: 0.75rem;
    color: var(--text-secondary);
    font-weight: 500;
}

.trn-top-exercise strong {
    font-family: var(--font-mono);
    color: var(--accent-lime);
    font-weight: 600;
    margin-left: 0.2rem;
}

.trn-top-loading {
    font-size: 0.7rem;
    color: var(--text-tertiary);
    font-style: italic;
}

/* Activity Strip — 14-day dot grid */
.trn-activity-strip {
    padding-top: 0.5rem;
}

.trn-activity-dots {
    display: flex;
    gap: 3px;
    margin-bottom: 0.4rem;
}

.trn-activity-dot {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}

.trn-activity-dot::before {
    content: '';
    display: block;
    width: 100%;
    height: 6px;
    border-radius: 3px;
    background: rgba(255, 255, 255, 0.06);
    transition: background 0.2s;
}

.trn-activity-dot--active::before {
    background: var(--accent-lime);
    box-shadow: 0 0 6px rgba(206, 242, 78, 0.3);
}

.trn-activity-day {
    font-size: 0.5rem;
    font-weight: 600;
    color: var(--text-tertiary);
    text-transform: uppercase;
}

.trn-activity-dot--active .trn-activity-day {
    color: var(--accent-lime);
}

.trn-activity-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.trn-activity-label {
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--text-tertiary);
}

/* ==================== NUTRITION L1 CARD ENHANCEMENTS ==================== */

/* Nutrition card: stacked layout like health */
.domain-metrics--nutrition {
    display: flex;
    flex-direction: column;
}

/* Calorie Hero — value header + sparkline */
.nutr-calorie-hero {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    width: 100%;
    margin-bottom: 0.75rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.nutr-calorie-header {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.nutr-calorie-label {
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-tertiary);
}

.nutr-calorie-row {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
}

.nutr-calorie-value {
    font-family: var(--font-mono);
    font-size: 1.6rem;
    font-weight: 900;
    line-height: 1;
    color: var(--accent-cyan);
    letter-spacing: -0.02em;
    white-space: nowrap;
}

.nutr-calorie-unit {
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--text-secondary);
    margin-left: 0.15rem;
}

.nutr-calorie-sparkline {
    width: 100%;
    height: 48px;
}

.nutr-calorie-sparkline svg {
    width: 100%;
    height: 100%;
    display: block;
}

/* Primary Nutrition Metrics — 3 columns */
.nutr-primary-metrics {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.nutr-primary-metrics .metric-value {
    font-size: 1rem;
    white-space: nowrap;
}

.nutr-primary-metrics .metric-label {
    white-space: nowrap;
}

/* Secondary Stats: Logged Days + Protein Trend */
.nutr-secondary-stats {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    padding: 0.5rem 0;
    margin-bottom: 0.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.04);
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

.nutr-logged-days {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex-shrink: 0;
}

.nutr-logged-label {
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-tertiary);
}

.nutr-logged-value {
    font-family: var(--font-mono);
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--accent-cyan);
    line-height: 1;
}

.nutr-logged-total {
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--text-tertiary);
}

.nutr-protein-trend {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1;
    min-width: 0;
}

.nutr-protein-trend-label {
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-tertiary);
}

.nutr-protein-sparkline {
    width: 100%;
    height: 28px;
}

.nutr-protein-sparkline svg {
    width: 100%;
    height: 100%;
    display: block;
}

/* Enhanced Macro Split Bar */
.nutr-macro-strip {
    padding-top: 0.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.04);
}

.nutr-macro-bar-enhanced {
    display: flex;
    height: 8px;
    border-radius: 4px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.03);
    margin-bottom: 0.4rem;
}

.nutr-macro-seg {
    height: 100%;
    transition: flex 0.3s ease;
}

.nutr-macro-seg--protein { background: var(--accent-cyan); }
.nutr-macro-seg--carbs   { background: var(--accent-lime); }
.nutr-macro-seg--fat     { background: var(--accent-orange); }

.nutr-macro-labels {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.nutr-macro-label {
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.nutr-macro-label--protein { color: var(--accent-cyan); }
.nutr-macro-label--carbs   { color: var(--accent-lime); }
.nutr-macro-label--fat     { color: var(--accent-orange); }

.nutr-macro-label-consistency {
    margin-left: auto;
}

/* Responsive adjustments for Training & Nutrition L1 */
@media (max-width: 768px) {
    .trn-primary-metrics,
    .nutr-primary-metrics {
        grid-template-columns: repeat(3, 1fr);
        gap: 0.35rem;
    }

    .trn-volume-value,
    .nutr-calorie-value {
        font-size: 1.3rem;
    }

    .trn-activity-day {
        font-size: 0.45rem;
    }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   HEALTH DETAIL PAGE (3-LAYER COCKPIT)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* Layer container - stacks 3 layers vertically */
.health-detail-layers {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* ── Layer 1: Hero (Readiness Ring + Primary Metrics) ── */
.health-detail-hero {
    display: flex;
    gap: 1.5rem;
    align-items: flex-start;
}

.health-detail-readiness-wrap {
    position: relative;
    width: 100px;
    height: 100px;
    flex-shrink: 0;
}

.health-detail-readiness-ring {
    width: 100%;
    height: 100%;
}

.health-detail-readiness-value {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-family: var(--font-mono);
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--accent-pink);
    line-height: 1;
}

.health-detail-readiness-label {
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--text-tertiary);
    margin-top: 0.25rem;
}

.health-detail-primary {
    flex: 1;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
    gap: 1rem;
}

.health-detail-primary-metric {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.health-detail-primary-metric .metric-value {
    font-family: var(--font-mono);
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1;
}

.health-detail-primary-metric .metric-value small {
    font-size: 0.65rem;
    font-weight: 600;
    color: var(--text-tertiary);
    margin-left: 0.2rem;
}

.health-detail-primary-metric .metric-label {
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--text-tertiary);
}

/* ── Layer 2: Biometrics ── */
.health-detail-biometrics {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.health-detail-bio-item {
    flex: 1;
    min-width: 120px;
    padding: 0.75rem 1rem;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.04);
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.health-detail-bio-item .metric-value {
    font-family: var(--font-mono);
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1;
}

.health-detail-bio-item .metric-value small {
    font-size: 0.6rem;
    font-weight: 600;
    color: var(--text-tertiary);
    margin-left: 0.2rem;
}

.health-detail-bio-item .metric-label {
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--text-tertiary);
}

/* ── Layer 3: Sleep Architecture ── */
.health-detail-sleep {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.health-detail-sleep-header {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
}

.health-detail-sleep-title {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--text-secondary);
}

.health-detail-sleep-total {
    font-family: var(--font-mono);
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--text-tertiary);
}

.health-detail-sleep-bar {
    display: flex;
    height: 32px;
    border-radius: 6px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.02);
}

.health-detail-sleep-seg {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.65rem;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.9);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
    min-width: 24px;
    transition: filter 0.2s;
}

.health-detail-sleep-seg:hover {
    filter: brightness(1.2);
}

.health-detail-sleep-seg--deep {
    background: linear-gradient(90deg, #6B46C1 0%, #7C3AED 100%);
}

.health-detail-sleep-seg--rem {
    background: linear-gradient(90deg, #BF5AF2 0%, #D946EF 100%);
}

.health-detail-sleep-seg--light {
    background: linear-gradient(90deg, #C084FC 0%, #E9D5FF 100%);
}

.health-detail-sleep-seg--awake {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.12) 0%, rgba(255, 255, 255, 0.06) 100%);
}

.health-detail-sleep-legend {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}

.health-detail-sleep-legend-item {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.65rem;
    font-weight: 600;
    color: var(--text-tertiary);
}

.health-detail-sleep-legend-dot {
    width: 10px;
    height: 10px;
    border-radius: 2px;
}

.health-detail-sleep-legend-dot--deep {
    background: #7C3AED;
}

.health-detail-sleep-legend-dot--rem {
    background: var(--accent-pink);
}

.health-detail-sleep-legend-dot--light {
    background: #C084FC;
}

.health-detail-sleep-legend-dot--awake {
    background: rgba(255, 255, 255, 0.1);
}

/* ── Layer 2B: Activity Card ── */
.health-detail-activity {
    padding: 1rem;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-left: 3px solid var(--accent-lime);
    border-radius: 8px;
}

.health-detail-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.75rem;
}

.health-detail-card-title {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-secondary);
}

.health-detail-card-balance {
    font-size: 0.65rem;
    font-weight: 600;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
}

.balance-good {
    color: var(--status-on-track);
    background: rgba(48, 209, 88, 0.1);
}

.balance-warning {
    color: var(--accent-orange);
    background: rgba(255, 159, 10, 0.1);
}

.balance-neutral {
    color: var(--text-tertiary);
    background: rgba(255, 255, 255, 0.05);
}

.health-detail-activity-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
    gap: 1rem;
}

.health-detail-activity-metric {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.metric-value-large {
    font-family: var(--font-mono);
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1;
}

.metric-value-large small {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--text-tertiary);
    margin-left: 0.25rem;
}

/* ── Layer 2C: Recovery & Stress Card ── */
.health-detail-recovery {
    padding: 1rem;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-left: 3px solid var(--accent-pink);
    border-radius: 8px;
}

.health-detail-recovery-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 1rem;
}

.health-detail-recovery-metric {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

/* Responsive */
@media (max-width: 768px) {
    .health-detail-hero {
        flex-direction: column;
        align-items: center;
    }

    .health-detail-readiness-wrap {
        margin-bottom: 0.5rem;
    }

    .health-detail-primary {
        width: 100%;
        grid-template-columns: repeat(2, 1fr);
    }

    .health-detail-biometrics {
        flex-direction: column;
    }

    .health-detail-bio-item {
        min-width: 100%;
    }
}

/* ================================================================
   Health Subdashboard Enhancements
   ================================================================ */

/* Drill-down card hover state */
.card--domain-link {
    cursor: pointer;
    position: relative;
    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.card--domain-link:hover {
    transform: translateY(-4px);
}

.card--domain-link .card__drill-arrow {
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    opacity: 0;
    transform: translateX(-8px);
    transition: opacity 0.3s ease, transform 0.3s ease;
    color: var(--accent-pink);
    font-size: 1.25rem;
}

.card--domain-link:hover .card__drill-arrow {
    opacity: 1;
    transform: translateX(0);
}

/* Weight Panel */
.weight-hero {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.weight-current {
    display: flex;
    align-items: baseline;
    gap: 0.75rem;
    margin-bottom: 0.5rem;
}

.weight-value {
    font-family: var(--font-mono);
    font-size: 3rem;
    font-weight: 900;
    letter-spacing: -0.04em;
    color: var(--text-primary);
    line-height: 1;
}

.weight-unit {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--text-secondary);
}

.weight-delta {
    font-family: var(--font-mono);
    font-size: 0.9rem;
    font-weight: 600;
    padding: 0.35rem 0.65rem;
    border-radius: 100px;
}

.weight-delta--down {
    color: var(--status-on-track);
    background: rgba(48, 209, 88, 0.1);
}

.weight-delta--up {
    color: var(--accent-orange);
    background: rgba(255, 159, 10, 0.1);
}

.weight-delta--stable {
    color: var(--text-tertiary);
    background: rgba(255, 255, 255, 0.05);
}

.weight-trend-chart {
    width: 100%;
    height: 80px;
    margin: 1rem 0;
}

.weight-guidance {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 1rem;
    border-radius: var(--radius-m);
    background: rgba(191, 90, 242, 0.06);
    border: 1px solid rgba(191, 90, 242, 0.15);
}

.weight-phase-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 0.35rem 0.75rem;
    border-radius: 100px;
}

.weight-phase-badge--cut {
    color: var(--accent-cyan);
    background: rgba(100, 210, 255, 0.1);
}

.weight-phase-badge--maintenance {
    color: var(--accent-orange);
    background: rgba(255, 159, 10, 0.1);
}

.weight-phase-badge--reverse {
    color: var(--accent-lime);
    background: rgba(206, 242, 78, 0.1);
}

.weight-guidance__text {
    font-size: 0.9rem;
    line-height: 1.5;
    color: var(--text-secondary);
}

.weight-guidance__text strong {
    color: var(--text-primary);
}

.weight-stats-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.weight-stat {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.weight-stat__label {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-tertiary);
}

.weight-stat__value {
    font-family: var(--font-mono);
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--text-primary);
}

/* Log Detail Modal */
.log-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.85);
    backdrop-filter: blur(8px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.log-modal.active {
    opacity: 1;
    visibility: visible;
}

.log-modal__content {
    background: var(--bg-surface);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: var(--radius-l);
    width: 90%;
    max-width: 600px;
    max-height: 85vh;
    overflow-y: auto;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
    transform: scale(0.9);
    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.log-modal.active .log-modal__content {
    transform: scale(1);
}

.log-modal__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.log-modal__title {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0;
}

.log-modal__body {
    padding: 1.5rem;
}

.log-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
}

.log-detail-item {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.log-detail-item__label {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-tertiary);
}

.log-detail-item__value {
    font-family: var(--font-mono);
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--text-primary);
}

.log-detail-item--full {
    grid-column: 1 / -1;
}

/* Clickable Log Rows */
.detail-log-row {
    cursor: pointer;
    transition: all 0.2s ease;
    padding: 0.75rem;
    margin: 0 -0.75rem;
    border-radius: var(--radius-s);
}

.detail-log-row:hover {
    background: rgba(255, 255, 255, 0.05);
    transform: translateX(4px);
}

/* Recovery Metrics Layout */
.recovery-metrics-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
}

.recovery-metric {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.recovery-metric__label {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-tertiary);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.recovery-metric__value {
    font-family: var(--font-mono);
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1;
}

.recovery-metric__trend {
    font-size: 0.8rem;
    font-weight: 600;
    margin-top: 0.25rem;
}

.recovery-metric__trend--up {
    color: var(--status-on-track);
}

.recovery-metric__trend--down {
    color: var(--accent-red);
}

.recovery-metric__trend--stable {
    color: var(--text-tertiary);
}

/* Mini readiness ring for recovery card */
.recovery-ring-mini {
    width: 48px;
    height: 48px;
}

.recovery-ring-mini circle {
    stroke-width: 6;
}

/* Responsive */
@media (max-width: 768px) {
    .weight-stats-grid {
        grid-template-columns: 1fr;
    }
    
    .log-detail-grid {
        grid-template-columns: 1fr;
    }
    
    .recovery-metrics-grid {
        grid-template-columns: 1fr;
    }
    
    .weight-value {
        font-size: 2.25rem;
    }
}


/* ========================================
   SLEEP ARCHITECTURE
   ======================================== */
.sleep-arch-bars {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.sleep-arch-row {
    display: flex;
    align-items: center;
    gap: 12px;
}

.sleep-arch-row .sleep-arch-label {
    min-width: 100px;
    font-size: 0.875rem;
    color: var(--text-secondary);
}

.sleep-arch-bar-container {
    flex: 1;
    height: 24px;
    background: rgba(255, 255, 255, 0.03);
    border-radius: 4px;
    overflow: hidden;
}

/* Removed duplicate .sleep-arch-bar rule that was conflicting with the main one at line ~4326 */

.sleep-arch-row .sleep-arch-bar-container .sleep-arch-bar {
    height: 100%;
    border-radius: 4px;
    transition: width 0.5s ease;
}

.sleep-arch-row .sleep-arch-bar--deep {
    background: var(--accent-pink);
}

.sleep-arch-row .sleep-arch-bar--rem {
    background: var(--accent-cyan);
}

.sleep-arch-row .sleep-arch-bar--light {
    background: rgba(255, 255, 255, 0.2);
}

.sleep-arch-value {
    font-family: var(--font-mono);
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--text-primary);
    min-width: 40px;
    text-align: right;
}

.sleep-arch-date {
    margin-top: 16px;
    font-size: 0.8125rem;
    color: var(--text-muted);
    text-align: center;
}

/* ========================================
   SLEEP DETAIL PAGE
   ======================================== */
.sleep-hero-layout {
    display: flex;
    gap: 32px;
    align-items: center;
}

.sleep-hero-score {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

.sleep-score-value {
    font-family: var(--font-mono);
    font-size: 3rem;
    font-weight: 900;
    color: var(--text-primary);
    line-height: 1;
}

.sleep-score-value small {
    font-size: 1.5rem;
    color: var(--text-secondary);
    font-weight: 600;
}

.sleep-score-label {
    font-size: 0.875rem;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.sleep-score-delta {
    font-size: 0.8125rem;
    font-weight: 600;
    margin-top: 4px;
}

.sleep-hero-sparkline {
    flex: 1;
    min-width: 300px;
}

.biometric-card-content {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.biometric-value {
    font-family: var(--font-mono);
    font-size: 2rem;
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1;
}

.biometric-value small {
    font-size: 1rem;
    color: var(--text-secondary);
    margin-left: 4px;
}

.biometric-range {
    display: flex;
    gap: 8px;
    font-size: 0.8125rem;
    color: var(--text-tertiary);
}

.biometric-range .range-value {
    color: var(--text-secondary);
}

.biometric-sparkline {
    margin-top: 8px;
}

.sleep-arch-note {
    color: var(--text-secondary);
    text-align: center;
    padding: 24px;
}


/* ========================================
   WEIGHT DETAIL (Level 3)
   ======================================== */

/* Taller chart wrap for trend chart */
.detail-chart-wrap--tall {
    height: 320px;
}

/* ── Hero ── */
.wt-hero {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.wt-hero__current {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
}

.wt-hero__value {
    font-family: var(--font-mono);
    font-size: 3rem;
    font-weight: 900;
    letter-spacing: -0.04em;
    color: var(--text-primary);
    line-height: 1;
}

.wt-hero__unit {
    font-family: var(--font-mono);
    font-size: 1.1rem;
    color: var(--text-tertiary);
    font-weight: 500;
}

.wt-hero__deltas {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.wt-delta {
    font-family: var(--font-mono);
    font-size: 0.85rem;
    font-weight: 600;
    padding: 0.25rem 0.6rem;
    border-radius: 100px;
    background: rgba(255, 255, 255, 0.04);
}

.wt-delta small {
    font-weight: 400;
    opacity: 0.6;
    margin-left: 0.25rem;
}

.wt-delta--down { color: var(--score-high); }
.wt-delta--up { color: var(--accent-orange); }
.wt-delta--flat { color: var(--text-tertiary); }

.wt-delta--sm {
    font-size: 0.7rem;
    padding: 0.15rem 0.4rem;
}

.wt-hero__sparkline {
    width: 100%;
    max-width: 300px;
}

/* ── Phase ── */
.wt-phase {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.wt-phase__badge {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    border: 1px solid;
    border-radius: 100px;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    width: fit-content;
}

.wt-phase__label {
    color: var(--text-primary);
}

.wt-phase__metrics {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
}

.wt-phase__metric {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.wt-phase__metric .metric-value {
    font-family: var(--font-mono);
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--text-primary);
}

.wt-phase__metric .metric-value small {
    font-size: 0.65rem;
    color: var(--text-secondary);
    margin-left: 0.2rem;
}

.wt-phase__metric .metric-label {
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-tertiary);
}

.wt-phase__warn {
    font-size: 0.8rem;
    color: var(--accent-orange);
    padding: 0.6rem 0.75rem;
    background: rgba(255, 159, 10, 0.08);
    border-radius: var(--radius-s);
    border-left: 3px solid var(--accent-orange);
}

.wt-phase__warn i {
    margin-right: 0.4rem;
}

.wt-phase__guidance {
    font-size: 0.8rem;
    color: var(--text-secondary);
    line-height: 1.5;
}

/* ── Projection ── */
.wt-projection {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.wt-projection__confidence {
    font-size: 0.8rem;
    color: var(--text-secondary);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.wt-proj-badge {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 0.2rem 0.5rem;
    border-radius: 100px;
}

.wt-proj-badge--high { background: rgba(48, 209, 88, 0.15); color: var(--score-high); }
.wt-proj-badge--med { background: rgba(255, 159, 10, 0.15); color: var(--accent-orange); }
.wt-proj-badge--low { background: rgba(255, 69, 58, 0.15); color: var(--accent-red); }

.wt-projection__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
}

.wt-proj-metric {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    text-align: center;
}

.wt-proj-metric .metric-value {
    font-family: var(--font-mono);
    font-size: 1rem;
    font-weight: 600;
    color: var(--text-primary);
}

.wt-proj-metric .metric-label {
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-tertiary);
}

.wt-projection__milestones {
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    padding-top: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.wt-projection__milestones-label {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-tertiary);
}

.wt-milestone {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.35rem 0;
}

.wt-milestone__weight {
    font-family: var(--font-mono);
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--text-primary);
}

.wt-milestone__eta {
    font-size: 0.75rem;
    color: var(--text-secondary);
}

/* ── Statistics ── */
.wt-stats-grid {
    display: flex;
    flex-direction: column;
}

.wt-stat-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.4rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

.wt-stat-row:last-child {
    border-bottom: none;
}

.wt-stat-row__label {
    font-size: 0.8rem;
    color: var(--text-secondary);
}

.wt-stat-row__value {
    font-family: var(--font-mono);
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--text-primary);
}

.wt-stats__note {
    margin-top: 0.75rem;
    font-size: 0.75rem;
    color: var(--text-tertiary);
    line-height: 1.5;
    padding-top: 0.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.04);
}

/* ── Daily Log ── */
.wt-log-list {
    display: flex;
    flex-direction: column;
    max-height: 400px;
    overflow-y: auto;
}

.wt-log-entry {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.4rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

.wt-log-entry:last-child {
    border-bottom: none;
}

.wt-log-entry__date {
    font-size: 0.75rem;
    color: var(--text-tertiary);
    min-width: 110px;
}

.wt-log-entry__value {
    font-family: var(--font-mono);
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--text-primary);
}

.wt-log-entry__delta {
    font-family: var(--font-mono);
    font-size: 0.75rem;
    font-weight: 500;
    margin-left: auto;
}

.wt-log-count {
    font-family: var(--font-mono);
    font-size: 0.7rem;
    color: var(--text-tertiary);
}

/* Chart subtitle */
.wt-chart-subtitle {
    font-size: 0.7rem;
    color: var(--text-tertiary);
    font-style: italic;
}

/* ── Mobile ── */
@media (max-width: 768px) {
    .wt-hero__value {
        font-size: 2.25rem;
    }

    .wt-phase__metrics {
        grid-template-columns: repeat(3, 1fr);
        gap: 0.5rem;
    }

    .wt-projection__grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 0.5rem;
    }

    .detail-chart-wrap--tall {
        height: 240px;
    }
}

/* ==================== NUTRITION SUB-DASHBOARD ==================== */

/* Coach FAB accent variant */
.coach-fab--cyan .coach-fab__icon { color: var(--accent-cyan); }
.coach-fab--cyan:hover { border-color: rgba(100, 210, 255, 0.3); }
.coach-fab__badge--active.coach-fab--cyan + .coach-fab__badge { background: var(--accent-cyan); }

/* ── Nutrition Level 2: Macros Card ── */

.nutr-macros-hero {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.nutr-cal-current {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.nutr-cal-value {
    font-family: 'JetBrains Mono', monospace;
    font-size: 2.2rem;
    font-weight: 700;
    color: var(--text-primary);
    letter-spacing: -0.03em;
}

.nutr-cal-unit {
    font-family: 'Inter', sans-serif;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.nutr-cal-delta {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.75rem;
    font-weight: 500;
    padding: 0.2rem 0.5rem;
    border-radius: 100px;
    white-space: nowrap;
}

.nutr-cal-delta--down {
    color: var(--status-on-track);
    background: rgba(48, 209, 88, 0.12);
}

.nutr-cal-delta--up {
    color: var(--accent-orange);
    background: rgba(255, 159, 10, 0.12);
}

.nutr-cal-delta--stable {
    color: var(--text-tertiary);
    background: rgba(255, 255, 255, 0.06);
}

/* ── Macro Split Bar (proportional P/C/F) ── */

.nutr-macro-split {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.nutr-macro-bar {
    display: flex;
    height: 28px;
    border-radius: 6px;
    overflow: hidden;
    gap: 2px;
}

.nutr-macro-seg {
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.65rem;
    font-weight: 600;
    color: rgba(0, 0, 0, 0.8);
    transition: filter 0.2s;
    min-width: 0;
}

.nutr-macro-seg:hover {
    filter: brightness(1.15);
}

.nutr-macro-seg--protein {
    background: linear-gradient(135deg, #64D2FF, #4FC3F7);
}

.nutr-macro-seg--carbs {
    background: linear-gradient(135deg, #CEF24E, #B8E038);
}

.nutr-macro-seg--fat {
    background: linear-gradient(135deg, #FF9F0A, #FFB74D);
}

.nutr-macro-legend {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.nutr-macro-legend-item {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.7rem;
    font-weight: 500;
    color: var(--text-secondary);
}

.nutr-macro-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.nutr-macro-dot--protein { background: #64D2FF; }
.nutr-macro-dot--carbs { background: #CEF24E; }
.nutr-macro-dot--fat { background: #FF9F0A; }

/* ── Nutrition Level 2: Meals Card ── */

.nutr-meals-summary {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.nutr-meals-hero-row {
    display: flex;
    gap: 1.5rem;
    align-items: flex-end;
}

.nutr-meals-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.15rem;
}

.nutr-meals-stat__value {
    font-family: 'JetBrains Mono', monospace;
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--text-primary);
}

.nutr-meals-stat__label {
    font-family: 'Inter', sans-serif;
    font-size: 0.65rem;
    font-weight: 600;
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

/* ── Meal Timing Bar (like sleep architecture) ── */

.nutr-timing-bar {
    display: flex;
    height: 24px;
    border-radius: 6px;
    overflow: hidden;
    gap: 2px;
}

.nutr-timing-seg {
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.6rem;
    font-weight: 600;
    color: rgba(0, 0, 0, 0.8);
    transition: filter 0.2s;
    min-width: 0;
}

.nutr-timing-seg:hover {
    filter: brightness(1.15);
}

.nutr-timing-seg--breakfast { background: linear-gradient(135deg, #FFD54F, #FFC107); }
.nutr-timing-seg--lunch { background: linear-gradient(135deg, #64D2FF, #4FC3F7); }
.nutr-timing-seg--dinner { background: linear-gradient(135deg, #BF5AF2, #AB47BC); }
.nutr-timing-seg--snacks { background: linear-gradient(135deg, #CEF24E, #B8E038); }
.nutr-timing-seg--snack { background: linear-gradient(135deg, #CEF24E, #B8E038); }
.nutr-timing-seg--preworkout { background: linear-gradient(135deg, #FF9F0A, #FFB74D); }
.nutr-timing-seg--postworkout { background: linear-gradient(135deg, #30D158, #66BB6A); }
.nutr-timing-seg--other { background: linear-gradient(135deg, #FF6B9D, #F06292); color: white; }

.nutr-timing-legend {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.nutr-timing-legend-item {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    font-family: 'Inter', sans-serif;
    font-size: 0.65rem;
    font-weight: 500;
    color: var(--text-tertiary);
}

.nutr-timing-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.nutr-timing-dot--breakfast { background: #FFD54F; }
.nutr-timing-dot--lunch { background: #64D2FF; }
.nutr-timing-dot--dinner { background: #BF5AF2; }
.nutr-timing-dot--snacks { background: #CEF24E; }
.nutr-timing-dot--snack { background: #CEF24E; }
.nutr-timing-dot--preworkout { background: #FF9F0A; }
.nutr-timing-dot--postworkout { background: #30D158; }
.nutr-timing-dot--other { background: #FF6B9D; }

/* ==================== NUTRITION MACROS DETAIL (Level 3) ==================== */

/* ── Macro Hero ── */

.macro-hero {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.macro-hero__current {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
}

.macro-hero__value {
    font-family: 'JetBrains Mono', monospace;
    font-size: 2.8rem;
    font-weight: 700;
    color: var(--text-primary);
    letter-spacing: -0.04em;
    line-height: 1;
}

.macro-hero__unit {
    font-family: 'Inter', sans-serif;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.macro-hero__deltas {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.macro-delta {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.75rem;
    font-weight: 500;
    padding: 0.2rem 0.5rem;
    border-radius: 100px;
    white-space: nowrap;
}

.macro-delta small {
    font-size: 0.65rem;
    opacity: 0.7;
    margin-left: 0.2rem;
}

.macro-delta--down { color: var(--status-on-track); background: rgba(48, 209, 88, 0.12); }
.macro-delta--up { color: var(--accent-orange); background: rgba(255, 159, 10, 0.12); }
.macro-delta--flat { color: var(--text-tertiary); background: rgba(255, 255, 255, 0.06); }

.macro-hero__sparkline {
    width: 100%;
    overflow: hidden;
    border-radius: 4px;
}

.macro-hero__sparkline svg {
    display: block;
    width: 100%;
    height: auto;
}

/* ── Macro Balance Card ── */

.macro-balance {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.macro-balance__gauges {
    display: flex;
    justify-content: space-around;
    gap: 0.5rem;
}

.macro-gauge {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    position: relative;
}

.macro-gauge__ring {
    width: 70px;
    height: 70px;
}

.macro-gauge__text {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.1rem;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -70%);
}

.macro-gauge__value {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1;
}

.macro-gauge__value small {
    font-size: 0.55rem;
    color: var(--text-secondary);
    margin-left: 1px;
}

.macro-gauge__label {
    font-family: 'Inter', sans-serif;
    font-size: 0.6rem;
    font-weight: 600;
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-top: 32px;
}

.macro-gauge__pct {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.55rem;
    color: var(--text-secondary);
}

.macro-balance__bar {
    display: flex;
    height: 20px;
    border-radius: 4px;
    overflow: hidden;
    gap: 2px;
}

.macro-balance__breakdown {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.macro-balance__item {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-family: 'Inter', sans-serif;
    font-size: 0.7rem;
    color: var(--text-secondary);
}

/* ── Macro Chart Subtitle ── */

.macro-chart-subtitle {
    font-family: 'Inter', sans-serif;
    font-size: 0.7rem;
    color: var(--text-tertiary);
}

/* ── Macro Statistics ── */

.macro-stats-grid {
    display: flex;
    flex-direction: column;
}

.macro-stats-divider {
    height: 1px;
    background: rgba(255, 255, 255, 0.06);
    margin: 0.5rem 0;
}

.macro-stat-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.4rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

.macro-stat-row:last-child {
    border-bottom: none;
}

.macro-stat-row__label {
    font-family: 'Inter', sans-serif;
    font-size: 0.75rem;
    color: var(--text-secondary);
}

.macro-stat-row__value {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--text-primary);
}

.macro-stats__note {
    margin-top: 0.75rem;
    padding: 0.5rem 0.75rem;
    font-size: 0.7rem;
    color: var(--text-tertiary);
    border-left: 2px solid rgba(100, 210, 255, 0.3);
    font-style: italic;
}

/* ── Macro Daily Log ── */

.macro-log-list {
    max-height: 400px;
    overflow-y: auto;
}

.macro-log-entry {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

.macro-log-entry:last-child {
    border-bottom: none;
}

.macro-log-entry__date {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.7rem;
    color: var(--text-secondary);
    min-width: 90px;
    flex-shrink: 0;
}

.macro-log-entry__value {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--text-primary);
    min-width: 50px;
}

.macro-log-entry__macros {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.65rem;
    color: var(--text-tertiary);
    flex: 1;
}

.macro-log-entry__delta {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.65rem;
    font-weight: 500;
    min-width: 50px;
    text-align: right;
}

.macro-log-count {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.7rem;
    color: var(--text-tertiary);
}

/* ==================== NUTRITION MEALS DETAIL (Level 3) ==================== */

/* ── Meals Hero ── */

.meals-hero-layout {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.meals-hero-stats {
    display: flex;
    gap: 1.5rem;
    flex-wrap: wrap;
}

.meals-hero-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.1rem;
}

.meals-hero-stat__value {
    font-family: 'JetBrains Mono', monospace;
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1.1;
}

.meals-hero-stat__label {
    font-family: 'Inter', sans-serif;
    font-size: 0.6rem;
    font-weight: 600;
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.meals-hero-today {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 0.75rem;
    background: rgba(100, 210, 255, 0.06);
    border-radius: 8px;
    border: 1px solid rgba(100, 210, 255, 0.12);
}

.meals-hero-today__label {
    font-family: 'Inter', sans-serif;
    font-size: 0.65rem;
    font-weight: 600;
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.meals-hero-today__value {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--accent-cyan);
}

.meals-hero-today__detail {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.7rem;
    color: var(--text-secondary);
}

/* ── Meal Timing Distribution (Sleep Architecture style) ── */

.meals-timing-arch {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.meals-timing-bars {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.meals-timing-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.meals-timing-label {
    font-family: 'Inter', sans-serif;
    font-size: 0.7rem;
    font-weight: 500;
    color: var(--text-secondary);
    min-width: 90px;
    flex-shrink: 0;
}

.meals-timing-bar-container {
    flex: 1;
    height: 16px;
    background: rgba(255, 255, 255, 0.04);
    border-radius: 3px;
    overflow: hidden;
}

.meals-timing-bar {
    height: 100%;
    border-radius: 3px;
    transition: width 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.meals-timing-bar--breakfast { background: linear-gradient(90deg, #FFD54F, #FFC107); }
.meals-timing-bar--lunch { background: linear-gradient(90deg, #64D2FF, #4FC3F7); }
.meals-timing-bar--dinner { background: linear-gradient(90deg, #BF5AF2, #AB47BC); }
.meals-timing-bar--snacks { background: linear-gradient(90deg, #CEF24E, #B8E038); }
.meals-timing-bar--preworkout { background: linear-gradient(90deg, #FF9F0A, #FFB74D); }
.meals-timing-bar--postworkout { background: linear-gradient(90deg, #30D158, #66BB6A); }
.meals-timing-bar--other { background: linear-gradient(90deg, rgba(255,255,255,0.15), rgba(255,255,255,0.08)); }

.meals-timing-value {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--text-primary);
    min-width: 55px;
    text-align: right;
    flex-shrink: 0;
}

.meals-timing-value small {
    font-size: 0.6rem;
    color: var(--text-tertiary);
}

.meals-timing-cal-summary {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    padding-top: 0.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.meals-timing-cal-item {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    font-family: 'Inter', sans-serif;
    font-size: 0.65rem;
    color: var(--text-tertiary);
}

.meals-timing-cal-item strong {
    font-family: 'JetBrains Mono', monospace;
    font-weight: 600;
    color: var(--text-secondary);
}

/* ── Top Foods ── */

.meals-topfoods {
    display: flex;
    flex-direction: column;
}

.meals-topfood-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.45rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

.meals-topfood-row:last-child {
    border-bottom: none;
}

.meals-topfood-rank {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.65rem;
    font-weight: 600;
    color: var(--text-tertiary);
    min-width: 20px;
    text-align: center;
}

.meals-topfood-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
}

.meals-topfood-name {
    font-family: 'Inter', sans-serif;
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.meals-topfood-bar-container {
    height: 4px;
    background: rgba(255, 255, 255, 0.04);
    border-radius: 2px;
    overflow: hidden;
}

.meals-topfood-bar {
    height: 100%;
    background: linear-gradient(90deg, rgba(100, 210, 255, 0.6), rgba(100, 210, 255, 0.3));
    border-radius: 2px;
    transition: width 0.6s ease;
}

.meals-topfood-count {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--accent-cyan);
    min-width: 30px;
    text-align: right;
}

.meals-topfood-cal {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.6rem;
    color: var(--text-tertiary);
    min-width: 55px;
    text-align: right;
}

/* ── Mobile Responsiveness ── */

@media (max-width: 768px) {
    .nutr-cal-value {
        font-size: 1.8rem;
    }

    .nutr-meals-hero-row {
        gap: 1rem;
    }

    .nutr-meals-stat__value {
        font-size: 1.3rem;
    }

    .macro-hero__value {
        font-size: 2rem;
    }

    .macro-balance__gauges {
        gap: 0.25rem;
    }

    .macro-gauge__ring {
        width: 56px;
        height: 56px;
    }

    .meals-hero-stats {
        gap: 1rem;
    }

    .meals-hero-stat__value {
        font-size: 1.4rem;
    }

    .meals-timing-label {
        min-width: 70px;
        font-size: 0.65rem;
    }
}

/* ==================== TRAINING SUB-DASHBOARD ==================== */

/* Coach FAB lime accent variant */
.coach-fab--lime .coach-fab__icon { color: var(--accent-lime); }
.coach-fab--lime:hover { border-color: rgba(206, 242, 78, 0.3); }
[data-accent="lime"] .coach-fab__badge--active { background: var(--accent-lime); }

/* Range pill lime active state */
[data-accent="lime"] .range-pill.active {
    background: var(--accent-lime);
    color: #000;
}

/* ── Training Level 2: Volume Card ── */

.trn-vol-hero {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.trn-vol-current {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.trn-vol-value {
    font-family: 'JetBrains Mono', monospace;
    font-size: 2.2rem;
    font-weight: 700;
    color: var(--text-primary);
    letter-spacing: -0.02em;
}

.trn-vol-unit {
    font-family: 'Inter', sans-serif;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.trn-vol-delta {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.2rem 0.5rem;
    border-radius: 100px;
    margin-left: 0.25rem;
}

.trn-vol-delta--up { color: var(--score-high); background: rgba(48, 209, 88, 0.12); }
.trn-vol-delta--down { color: var(--accent-orange); background: rgba(255, 159, 10, 0.12); }
.trn-vol-delta--stable { color: var(--text-tertiary); background: rgba(255, 255, 255, 0.06); }

.trn-vol-stats {
    display: flex;
    gap: 1.5rem;
}

.trn-vol-stat {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.trn-vol-stat__value {
    font-family: 'JetBrains Mono', monospace;
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--text-primary);
}

.trn-vol-stat__value small {
    font-size: 0.65rem;
    color: var(--text-secondary);
    margin-left: 0.15rem;
}

.trn-vol-stat__label {
    font-family: 'Inter', sans-serif;
    font-size: 0.65rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

/* Volume distribution bar */
.trn-vol-dist {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-top: 0.25rem;
}

.trn-vol-dist-bar {
    display: flex;
    height: 6px;
    border-radius: 3px;
    overflow: hidden;
    gap: 2px;
}

.trn-vol-dist-seg {
    border-radius: 3px;
    font-size: 0.55rem;
    font-family: 'JetBrains Mono', monospace;
    color: #000;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    transition: flex 0.6s ease;
}

.trn-vol-dist-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.trn-vol-dist-item {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.6rem;
    font-weight: 500;
    color: var(--text-secondary);
}

.trn-vol-dist-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    flex-shrink: 0;
}

/* ── Training Level 2: Consistency Card ── */

.trn-con-summary {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.trn-con-hero-row {
    display: flex;
    gap: 1.5rem;
}

.trn-con-stat {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.trn-con-stat__value {
    font-family: 'JetBrains Mono', monospace;
    font-size: 1.3rem;
    font-weight: 600;
    color: var(--text-primary);
}

.trn-con-stat__value small {
    font-size: 0.65rem;
    color: var(--text-secondary);
    margin-left: 0.15rem;
}

.trn-con-stat__label {
    font-family: 'Inter', sans-serif;
    font-size: 0.65rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

/* Day-of-week mini bars */
.trn-con-days {
    display: flex;
    gap: 6px;
    align-items: flex-end;
    height: 40px;
}

.trn-con-day {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    flex: 1;
}

.trn-con-day-bar {
    width: 100%;
    min-height: 2px;
    background: var(--accent-lime);
    border-radius: 2px;
    opacity: 0.6;
    transition: height 0.6s ease;
}

.trn-con-day-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.55rem;
    color: var(--text-tertiary);
    font-weight: 500;
}

/* ==================== TRAINING LEVEL 3: VOLUME DETAIL ==================== */

/* Volume hero */
.vol-hero {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.vol-hero__current {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.vol-hero__value {
    font-family: 'JetBrains Mono', monospace;
    font-size: 2.4rem;
    font-weight: 700;
    color: var(--text-primary);
    letter-spacing: -0.03em;
}

.vol-hero__unit {
    font-family: 'Inter', sans-serif;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.vol-hero__deltas {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.vol-delta {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.2rem 0.5rem;
    border-radius: 100px;
}

.vol-delta small {
    font-weight: 400;
    opacity: 0.7;
    margin-left: 0.15rem;
}

.vol-delta--up { color: var(--score-high); background: rgba(48, 209, 88, 0.12); }
.vol-delta--down { color: var(--accent-orange); background: rgba(255, 159, 10, 0.12); }
.vol-delta--flat { color: var(--text-tertiary); background: rgba(255, 255, 255, 0.06); }

.vol-hero__sparkline {
    width: 100%;
    height: 56px;
}

.vol-hero__sparkline svg {
    width: 100%;
    height: 100%;
}

/* Exercise balance gauges */
.vol-balance {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.vol-balance__gauges {
    display: flex;
    justify-content: space-around;
    gap: 0.5rem;
}

.vol-gauge {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    position: relative;
}

.vol-gauge__ring {
    width: 70px;
    height: 70px;
}

.vol-gauge__text {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 70px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.vol-gauge__value {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--text-primary);
}

.vol-gauge__value small {
    font-size: 0.55rem;
    color: var(--text-secondary);
}

.vol-gauge__label {
    font-family: 'Inter', sans-serif;
    font-size: 0.6rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    text-align: center;
    margin-top: 4px;
}

/* Exercise breakdown bars */
.vol-breakdown {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.vol-exercise-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.vol-exercise-rank {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.65rem;
    color: var(--text-tertiary);
    min-width: 18px;
    text-align: right;
}

.vol-exercise-info {
    flex: 1;
    min-width: 0;
}

.vol-exercise-name {
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
}

.vol-exercise-bar-container {
    height: 4px;
    background: rgba(255, 255, 255, 0.04);
    border-radius: 2px;
    margin-top: 4px;
}

.vol-exercise-bar {
    height: 100%;
    background: linear-gradient(90deg, rgba(206, 242, 78, 0.7), rgba(206, 242, 78, 0.3));
    border-radius: 2px;
    transition: width 0.6s ease;
}

.vol-exercise-count {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.65rem;
    color: var(--accent-lime);
    min-width: 30px;
    text-align: right;
}

/* Volume stats */
.vol-stats-grid {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.vol-stat-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

.vol-stat-row:last-child {
    border-bottom: none;
}

.vol-stat-row__label {
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--text-secondary);
}

.vol-stat-row__value {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--text-primary);
}

.vol-stats__note {
    font-size: 0.7rem;
    color: var(--text-tertiary);
    padding-top: 0.75rem;
    margin-top: 0.25rem;
    border-top: 1px solid rgba(255, 255, 255, 0.04);
    line-height: 1.4;
}

/* Volume log entries */
.vol-log-list {
    max-height: 400px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,0.1) transparent;
}

.vol-log-entry {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

.vol-log-entry:last-child {
    border-bottom: none;
}

.vol-log-entry__date {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.7rem;
    color: var(--text-tertiary);
    min-width: 90px;
}

.vol-log-entry__name {
    flex: 1;
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.vol-log-entry__sets {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--accent-lime);
    min-width: 50px;
    text-align: right;
}

.vol-log-entry__dur {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.65rem;
    color: var(--text-secondary);
    min-width: 45px;
    text-align: right;
}

/* ==================== TRAINING LEVEL 3: CONSISTENCY DETAIL ==================== */

/* Consistency hero */
.con-hero-layout {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.con-hero-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}

.con-hero-stat {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.con-hero-stat__value {
    font-family: 'JetBrains Mono', monospace;
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--text-primary);
}

.con-hero-stat__value small {
    font-size: 0.65rem;
    color: var(--text-secondary);
    margin-left: 0.15rem;
}

.con-hero-stat__label {
    font-family: 'Inter', sans-serif;
    font-size: 0.65rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

/* Consistency today summary */
.con-hero-today {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.5rem 0.75rem;
    background: rgba(206, 242, 78, 0.06);
    border-radius: var(--radius-s);
    border: 1px solid rgba(206, 242, 78, 0.12);
}

.con-hero-today__label {
    font-size: 0.65rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.con-hero-today__value {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--accent-lime);
}

/* Day-of-week distribution (L3 version — taller) */
.con-days-dist {
    display: flex;
    gap: 8px;
    align-items: flex-end;
    height: 60px;
}

.con-day-col {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    flex: 1;
}

.con-day-bar {
    width: 100%;
    min-height: 3px;
    background: var(--accent-lime);
    border-radius: 3px;
    opacity: 0.65;
    transition: height 0.6s ease;
}

.con-day-bar--active {
    opacity: 1;
}

.con-day-name {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.6rem;
    color: var(--text-tertiary);
    font-weight: 500;
}

.con-day-count {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.55rem;
    color: var(--text-tertiary);
}

/* ── Mobile Responsiveness (Training) ── */

@media (max-width: 768px) {
    .trn-vol-value {
        font-size: 1.8rem;
    }

    .trn-vol-stats {
        gap: 1rem;
    }

    .trn-con-hero-row {
        gap: 1rem;
    }

    .trn-con-stat__value {
        font-size: 1.1rem;
    }

    .vol-hero__value {
        font-size: 2rem;
    }

    .vol-balance__gauges {
        gap: 0.25rem;
    }

    .vol-gauge__ring {
        width: 56px;
        height: 56px;
    }

    .con-hero-stats {
        grid-template-columns: repeat(2, 1fr);
    }

    .con-hero-stat__value {
        font-size: 1.3rem;
    }
}

/* ═══════════════════════════════════════════════════════════════════
   Training Intelligence Components
   ═══════════════════════════════════════════════════════════════════ */

/* ── Intelligence Panel (L2 Domain Detail) ── */

.trn-intel-panels {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

.trn-intel-section-title {
    font-family: 'Inter', sans-serif;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-tertiary);
    margin-bottom: 0.75rem;
}

/* Strength highlights — lift list */
.trn-intel-lifts {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.trn-intel-lift {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.trn-intel-lift-name {
    font-family: 'Inter', sans-serif;
    font-size: 0.75rem;
    color: var(--text-secondary);
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.trn-intel-lift-e1rm {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--accent-lime);
}

/* Badges — PR and Plateau */
.trn-intel-badge {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.55rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    padding: 0.15rem 0.4rem;
    border-radius: 4px;
    text-transform: uppercase;
}

.trn-intel-badge--pr {
    background: rgba(206, 242, 78, 0.2);
    color: var(--accent-lime);
    border: 1px solid rgba(206, 242, 78, 0.3);
}

.trn-intel-badge--plateau {
    background: rgba(255, 159, 10, 0.15);
    color: var(--status-behind);
    border: 1px solid rgba(255, 159, 10, 0.25);
}

/* Muscle group bars */
.trn-intel-muscle-bars {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.trn-intel-muscle-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.trn-intel-muscle-row--neglected .trn-intel-muscle-name {
    color: var(--status-behind);
}

.trn-intel-muscle-row--neglected .trn-intel-muscle-bar {
    background: rgba(255, 159, 10, 0.4);
}

.trn-intel-muscle-name {
    font-family: 'Inter', sans-serif;
    font-size: 0.65rem;
    color: var(--text-tertiary);
    width: 80px;
    flex-shrink: 0;
    text-transform: capitalize;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.trn-intel-muscle-bar-wrap {
    flex: 1;
    height: 8px;
    background: rgba(255, 255, 255, 0.04);
    border-radius: 4px;
    overflow: hidden;
}

.trn-intel-muscle-bar {
    height: 100%;
    background: var(--accent-lime);
    border-radius: 4px;
    opacity: 0.7;
    transition: width 0.6s ease;
}

.trn-intel-muscle-vol {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.65rem;
    color: var(--text-tertiary);
    width: 30px;
    text-align: right;
}

.trn-intel-neglected {
    font-size: 0.65rem;
    color: var(--status-behind);
    margin-top: 0.5rem;
    padding: 0.4rem 0.6rem;
    background: rgba(255, 159, 10, 0.06);
    border-radius: 6px;
    border-left: 2px solid rgba(255, 159, 10, 0.3);
}

/* Flags, warnings, notes */
.trn-intel-flags {
    grid-column: 1 / -1;
}

.trn-intel-warning {
    font-size: 0.7rem;
    color: var(--status-behind);
    padding: 0.4rem 0.6rem;
    background: rgba(255, 159, 10, 0.06);
    border-radius: 6px;
    border-left: 2px solid rgba(255, 159, 10, 0.3);
    margin-bottom: 0.35rem;
}

.trn-intel-note {
    font-size: 0.7rem;
    color: var(--text-secondary);
    padding: 0.4rem 0.6rem;
    background: rgba(206, 242, 78, 0.04);
    border-radius: 6px;
    border-left: 2px solid rgba(206, 242, 78, 0.2);
    margin-bottom: 0.35rem;
}

.trn-intel-alerts {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

/* ── Strength Progress Table (L3 Volume Detail) ── */

.trn-strength-table {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.trn-strength-header {
    display: flex;
    align-items: center;
    padding: 0 0 0.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    margin-bottom: 0.25rem;
}

.trn-strength-header span {
    font-family: 'Inter', sans-serif;
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-tertiary);
}

.trn-strength-row {
    display: flex;
    align-items: center;
    padding: 0.4rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.03);
}

.trn-strength-col-name {
    flex: 2;
    font-family: 'Inter', sans-serif;
    font-size: 0.75rem;
    color: var(--text-secondary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.trn-strength-col-e1rm {
    flex: 1;
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--accent-lime);
}

.trn-strength-col-trend {
    flex: 1;
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.7rem;
}

.trn-strength-trend--up { color: var(--status-on-track); }
.trn-strength-trend--down { color: var(--status-at-risk); }
.trn-strength-trend--flat { color: var(--text-tertiary); }

.trn-strength-col-status {
    flex: 1;
    display: flex;
    justify-content: flex-end;
    gap: 0.25rem;
}

/* ── Muscle Group Distribution (reuses .trn-intel-muscle-* from above) ── */

.trn-muscle-distribution {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

/* ── Logging Quality Card (L3 Consistency Detail) ── */

.trn-quality-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
    gap: 1rem;
}

.trn-quality-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    padding: 0.75rem 0.5rem;
    background: rgba(206, 242, 78, 0.03);
    border-radius: 8px;
    border: 1px solid rgba(206, 242, 78, 0.08);
}

.trn-quality-stat__value {
    font-family: 'JetBrains Mono', monospace;
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--accent-lime);
}

.trn-quality-stat__label {
    font-family: 'Inter', sans-serif;
    font-size: 0.6rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-tertiary);
}

/* ── Mobile Responsiveness (Training Intelligence) ── */

@media (max-width: 768px) {
    .trn-intel-panels {
        grid-template-columns: 1fr;
    }

    .trn-intel-flags {
        grid-column: 1;
    }

    .trn-intel-muscle-name {
        width: 60px;
    }

    .trn-quality-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* ═══════════════════════════════════════════════════════════════════
   NUTRITION INTELLIGENCE (.nutr-intel-*)
   ═══════════════════════════════════════════════════════════════════ */

.nutr-intel-panels {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

.nutr-intel-section-title {
    font-family: 'Inter', sans-serif;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-tertiary);
    margin-bottom: 0.75rem;
}

/* Nutrient trend table */
.nutr-intel-trend-table {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.nutr-intel-trend-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

.nutr-intel-trend-row:last-child {
    border-bottom: none;
}

.nutr-intel-trend-name {
    font-family: 'Inter', sans-serif;
    font-size: 0.75rem;
    color: var(--text-secondary);
    flex: 1;
    min-width: 0;
}

.nutr-intel-trend-avg {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--accent-cyan);
    min-width: 40px;
    text-align: right;
}

.nutr-intel-trend-arrow {
    font-size: 0.65rem;
    width: 16px;
    text-align: center;
}

.nutr-intel-trend--up { color: var(--status-on-track); }
.nutr-intel-trend--down { color: var(--status-behind); }
.nutr-intel-trend--flat { color: var(--text-tertiary); }

/* Badges */
.nutr-intel-badge {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.55rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    padding: 0.15rem 0.4rem;
    border-radius: 4px;
}

.nutr-intel-badge--good {
    background: rgba(100, 210, 255, 0.15);
    color: var(--accent-cyan);
    border: 1px solid rgba(100, 210, 255, 0.25);
}

.nutr-intel-badge--warning {
    background: rgba(255, 159, 10, 0.15);
    color: var(--status-behind);
    border: 1px solid rgba(255, 159, 10, 0.25);
}

/* Macro proportional bar */
.nutr-intel-macro-bar {
    display: flex;
    height: 8px;
    border-radius: 4px;
    overflow: hidden;
    margin-bottom: 0.75rem;
    background: rgba(255, 255, 255, 0.04);
}

.nutr-intel-macro-segment {
    height: 100%;
    opacity: 0.75;
    transition: width 0.6s ease;
}

.nutr-intel-macro-segment:first-child { border-radius: 4px 0 0 4px; }
.nutr-intel-macro-segment:last-child { border-radius: 0 4px 4px 0; }

/* Macro ratio labels */
.nutr-intel-macro-ratios {
    display: flex;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

.nutr-intel-macro-item {
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.nutr-intel-macro-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    flex-shrink: 0;
}

.nutr-intel-macro-name {
    font-family: 'Inter', sans-serif;
    font-size: 0.6rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-tertiary);
}

.nutr-intel-macro-pct {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--text-secondary);
}

.nutr-intel-balance-score {
    font-size: 0.7rem;
    color: var(--text-secondary);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Quality grid */
.nutr-intel-quality-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}

.nutr-intel-quality-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.2rem;
}

.nutr-intel-quality-value {
    font-family: 'JetBrains Mono', monospace;
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--accent-cyan);
}

.nutr-intel-quality-label {
    font-family: 'Inter', sans-serif;
    font-size: 0.6rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-tertiary);
}

/* Quality threshold coloring */
.nutr-intel-quality-value--good { color: var(--status-on-track); }
.nutr-intel-quality-value--warning { color: var(--status-behind); }

/* Flags */
.nutr-intel-flag-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-bottom: 0.75rem;
}

.nutr-intel-flag {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.55rem;
    font-weight: 600;
    padding: 0.2rem 0.5rem;
    border-radius: 4px;
    background: rgba(100, 210, 255, 0.1);
    color: var(--accent-cyan);
    border: 1px solid rgba(100, 210, 255, 0.2);
}

.nutr-intel-note {
    font-size: 0.7rem;
    color: var(--text-secondary);
    padding: 0.4rem 0.6rem;
    background: rgba(100, 210, 255, 0.04);
    border-radius: 6px;
    border-left: 2px solid rgba(100, 210, 255, 0.2);
    margin-bottom: 0.35rem;
}

.nutr-intel-flags {
    grid-column: 1 / -1;
}

/* Adherence grid */
.nutr-intel-adherence-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}

.nutr-intel-adherence-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.3rem;
}

.nutr-intel-adherence-value {
    font-family: 'JetBrains Mono', monospace;
    font-size: 1.1rem;
    font-weight: 700;
    padding: 0.3rem 0.6rem;
    border-radius: 6px;
}

.nutr-intel-adherence-bar {
    width: 100%;
    height: 6px;
    background: rgba(255, 255, 255, 0.04);
    border-radius: 3px;
    overflow: hidden;
}

.nutr-intel-adherence-fill {
    height: 100%;
    border-radius: 3px;
    transition: width 0.6s ease;
}

.nutr-intel-adherence-fill--good { background: var(--accent-cyan); opacity: 0.6; }
.nutr-intel-adherence-fill--warning { background: var(--status-behind); opacity: 0.6; }

.nutr-intel-adherence-label {
    font-family: 'Inter', sans-serif;
    font-size: 0.6rem;
    color: var(--text-tertiary);
}

.nutr-intel-opportunities {
    margin-top: 0.5rem;
}

/* Meal pattern frequency bars */
.nutr-intel-meal-bars {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.nutr-intel-meal-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.nutr-intel-meal-name {
    font-family: 'Inter', sans-serif;
    font-size: 0.65rem;
    color: var(--text-tertiary);
    width: 80px;
    flex-shrink: 0;
    text-transform: capitalize;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nutr-intel-meal-bar-wrap {
    flex: 1;
    height: 8px;
    background: rgba(255, 255, 255, 0.04);
    border-radius: 4px;
    overflow: hidden;
}

.nutr-intel-meal-bar {
    height: 100%;
    background: var(--accent-cyan);
    border-radius: 4px;
    opacity: 0.7;
    transition: width 0.6s ease;
}

.nutr-intel-meal-count {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.65rem;
    color: var(--accent-cyan);
    width: 28px;
    text-align: right;
}

.nutr-intel-meal-cal {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.6rem;
    color: var(--text-tertiary);
    width: 55px;
    text-align: right;
}

/* ═══════════════════════════════════════════════════════════════════
   HEALTH INTELLIGENCE (.hlth-intel-*)
   ═══════════════════════════════════════════════════════════════════ */

.hlth-intel-panels {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

.hlth-intel-section-title {
    font-family: 'Inter', sans-serif;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-tertiary);
    margin-bottom: 0.75rem;
}

/* Biomarker cards */
.hlth-intel-biomarker-cards {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.75rem;
}

.hlth-intel-biomarker-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.3rem;
    padding: 0.6rem 0.5rem;
    background: rgba(255, 255, 255, 0.03);
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.06);
}

.hlth-intel-biomarker-header {
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.hlth-intel-biomarker-icon {
    font-size: 0.55rem;
    color: var(--accent-pink);
    opacity: 0.6;
}

.hlth-intel-biomarker-name {
    font-family: 'Inter', sans-serif;
    font-size: 0.6rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-tertiary);
}

.hlth-intel-biomarker-score {
    font-family: 'JetBrains Mono', monospace;
    font-size: 1.1rem;
    font-weight: 700;
}

.hlth-intel-biomarker-score--good { color: var(--status-on-track); }
.hlth-intel-biomarker-score--concern { color: var(--accent-pink); }

.hlth-intel-biomarker-trend {
    font-size: 0.55rem;
}

.hlth-intel-trend--up { color: var(--status-on-track); }
.hlth-intel-trend--down { color: var(--status-behind); }
.hlth-intel-trend--flat { color: var(--text-tertiary); }

/* Badges */
.hlth-intel-badge {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.55rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    padding: 0.15rem 0.4rem;
    border-radius: 4px;
}

.hlth-intel-badge--good {
    background: rgba(48, 209, 88, 0.15);
    color: var(--status-on-track);
    border: 1px solid rgba(48, 209, 88, 0.25);
}

.hlth-intel-badge--concern {
    background: rgba(191, 90, 242, 0.15);
    color: var(--accent-pink);
    border: 1px solid rgba(191, 90, 242, 0.25);
}

.hlth-intel-badge--warning {
    background: rgba(255, 159, 10, 0.15);
    color: var(--status-behind);
    border: 1px solid rgba(255, 159, 10, 0.25);
}

/* Metric grid (shared: sleep, weight, biomarkers) */
.hlth-intel-metric-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));
    gap: 0.75rem;
}

.hlth-intel-metric-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.2rem;
}

.hlth-intel-metric-value {
    font-family: 'JetBrains Mono', monospace;
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--accent-pink);
}

.hlth-intel-metric-label {
    font-family: 'Inter', sans-serif;
    font-size: 0.6rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-tertiary);
}

/* Severity-colored metric value (sleep debt high, weight concern) */
.hlth-intel-metric-value--alert {
    color: var(--accent-red);
    text-shadow: 0 0 12px rgba(255, 69, 58, 0.3);
}

.hlth-intel-debt-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}

/* Indicators */
.hlth-intel-indicator-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-bottom: 0.5rem;
}

.hlth-intel-indicator {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.55rem;
    font-weight: 600;
    padding: 0.2rem 0.5rem;
    border-radius: 4px;
}

.hlth-intel-indicator--concern {
    background: rgba(191, 90, 242, 0.1);
    color: var(--accent-pink);
    border: 1px solid rgba(191, 90, 242, 0.2);
}

.hlth-intel-indicator--positive {
    background: rgba(48, 209, 88, 0.1);
    color: var(--status-on-track);
    border: 1px solid rgba(48, 209, 88, 0.2);
}

/* Notes */
.hlth-intel-note {
    font-size: 0.7rem;
    color: var(--text-secondary);
    padding: 0.4rem 0.6rem;
    background: rgba(191, 90, 242, 0.04);
    border-radius: 6px;
    border-left: 2px solid rgba(191, 90, 242, 0.2);
    margin-bottom: 0.35rem;
}

.hlth-intel-notes {
    margin-top: 0.5rem;
}

.hlth-intel-correlation {
    margin-bottom: 0.75rem;
}

.hlth-intel-indicators {
    grid-column: 1 / -1;
}

/* Responsive */
@media (max-width: 768px) {
    .nutr-intel-panels,
    .hlth-intel-panels {
        grid-template-columns: 1fr;
    }

    .nutr-intel-quality-grid,
    .nutr-intel-adherence-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .hlth-intel-biomarker-cards {
        grid-template-columns: repeat(2, 1fr);
    }

    .nutr-intel-meal-name {
        width: 60px;
    }

    .nutr-intel-flags,
    .hlth-intel-indicators {
        grid-column: 1;
    }
}

/* ============================================
   AGENT SUMMARY STYLING (Nutrition, Training, Health)
   ============================================ */

/* --- NUTRITION SUMMARY --- */
.nutrition-summary {
    font-family: var(--font-sans);
    max-width: 100%;
    color: var(--text-primary);
    line-height: 1.6;
}

.nutrition-summary__section {
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.nutrition-summary__section:last-child {
    border-bottom: none;
}

.nutrition-summary__heading {
    font-size: 1rem;
    font-weight: 700;
    color: var(--accent-cyan);
    margin: 0 0 1rem 0;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid rgba(100, 210, 255, 0.2);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.nutrition-summary__table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1rem;
    font-size: 0.875rem;
}

.nutrition-summary__table thead {
    background: rgba(255, 255, 255, 0.03);
}

.nutrition-summary__table th {
    text-align: left;
    padding: 0.75rem;
    font-weight: 600;
    color: var(--text-secondary);
    border: 1px solid rgba(255, 255, 255, 0.08);
    font-size: 0.8125rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.nutrition-summary__table td {
    padding: 0.75rem;
    border: 1px solid rgba(255, 255, 255, 0.05);
    color: var(--text-secondary);
}

.nutrition-summary__table tbody tr:hover {
    background: rgba(255, 255, 255, 0.02);
}

.nutrition-summary__deviation-label {
    color: var(--accent-cyan);
    font-weight: 600;
    margin: 1rem 0 0.5rem 0;
}

.nutrition-summary__list {
    margin: 0.5rem 0;
    padding-left: 1.25rem;
    color: var(--text-tertiary);
}

.nutrition-summary__list li {
    margin-bottom: 0.5rem;
    line-height: 1.5;
}

.nutrition-summary__list strong {
    color: var(--text-secondary);
}

.nutrition-summary__text {
    color: var(--text-tertiary);
    margin: 0.75rem 0;
    line-height: 1.6;
}

.nutrition-summary__highlight {
    color: var(--accent-cyan);
    font-weight: 600;
}

.nutrition-summary__warning {
    color: var(--accent-orange);
}

.nutrition-summary__danger {
    color: var(--accent-red);
    font-weight: 600;
}

.nutrition-summary__success {
    color: var(--score-high);
}

.nutrition-summary__motivational {
    font-size: 1rem;
    color: var(--accent-cyan);
    margin: 1rem 0;
    line-height: 1.7;
}

.nutrition-summary__motivational strong {
    color: var(--accent-cyan);
    font-weight: 700;
}

/* --- TRAINING SUMMARY --- */
.training-summary {
    font-family: var(--font-sans);
    max-width: 100%;
    color: var(--text-primary);
    line-height: 1.6;
}

.training-summary__section {
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.training-summary__section:last-child {
    border-bottom: none;
}

.training-summary__heading {
    font-size: 1rem;
    font-weight: 700;
    color: var(--accent-lime);
    margin: 0 0 1rem 0;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid rgba(206, 242, 78, 0.2);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.training-summary__table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1rem;
    font-size: 0.875rem;
}

.training-summary__table thead {
    background: rgba(255, 255, 255, 0.03);
}

.training-summary__table th {
    text-align: left;
    padding: 0.75rem;
    font-weight: 600;
    color: var(--text-secondary);
    border: 1px solid rgba(255, 255, 255, 0.08);
    font-size: 0.8125rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.training-summary__table td {
    padding: 0.75rem;
    border: 1px solid rgba(255, 255, 255, 0.05);
    color: var(--text-secondary);
}

.training-summary__table tbody tr:hover {
    background: rgba(255, 255, 255, 0.02);
}

.training-summary__deviation-label {
    color: var(--accent-lime);
    font-weight: 600;
    margin: 1rem 0 0.5rem 0;
}

.training-summary__list {
    margin: 0.5rem 0;
    padding-left: 1.25rem;
    color: var(--text-tertiary);
}

.training-summary__list li {
    margin-bottom: 0.5rem;
    line-height: 1.5;
}

.training-summary__list strong {
    color: var(--text-secondary);
}

.training-summary__text {
    color: var(--text-tertiary);
    margin: 0.75rem 0;
    line-height: 1.6;
}

.training-summary__highlight {
    color: var(--accent-lime);
    font-weight: 600;
}

.training-summary__warning {
    color: var(--accent-orange);
}

.training-summary__danger {
    color: var(--accent-red);
    font-weight: 600;
}

.training-summary__success {
    color: var(--score-high);
}

.training-summary__motivational {
    font-size: 1rem;
    color: var(--accent-lime);
    margin: 1rem 0;
    line-height: 1.7;
}

.training-summary__motivational strong {
    color: var(--accent-lime);
    font-weight: 700;
}

/* --- PROGRESS SUMMARY --- */
.progress-summary {
    font-family: var(--font-sans);
    max-width: 100%;
    color: var(--text-primary);
    line-height: 1.6;
}

.progress-summary__section {
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.progress-summary__section:last-child {
    border-bottom: none;
}

.progress-summary__heading {
    font-size: 1rem;
    font-weight: 700;
    color: var(--accent-cyan);
    margin: 0 0 1rem 0;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid rgba(100, 210, 255, 0.2);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.progress-summary__subheading {
    color: var(--accent-cyan);
    font-weight: 600;
    margin: 1rem 0 0.5rem 0;
}

.progress-summary__table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1rem;
    font-size: 0.875rem;
}

.progress-summary__table thead {
    background: rgba(255, 255, 255, 0.03);
}

.progress-summary__table th {
    text-align: left;
    padding: 0.75rem;
    font-weight: 600;
    color: var(--text-secondary);
    border: 1px solid rgba(255, 255, 255, 0.08);
    font-size: 0.8125rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.progress-summary__table td {
    padding: 0.75rem;
    border: 1px solid rgba(255, 255, 255, 0.05);
    color: var(--text-secondary);
}

.progress-summary__table tbody tr:hover {
    background: rgba(255, 255, 255, 0.02);
}

.progress-summary__list {
    margin: 0.5rem 0;
    padding-left: 1.25rem;
    color: var(--text-tertiary);
}

.progress-summary__list li {
    margin-bottom: 0.5rem;
    line-height: 1.5;
}

.progress-summary__list strong {
    color: var(--text-secondary);
}

.progress-summary__text {
    color: var(--text-tertiary);
    margin: 0.75rem 0;
    line-height: 1.6;
}

.progress-summary__highlight {
    color: var(--accent-cyan);
    font-weight: 600;
}

.progress-summary__warning {
    color: var(--accent-orange);
}

.progress-summary__danger {
    color: var(--accent-red);
    font-weight: 600;
}

.progress-summary__success {
    color: var(--score-high);
}

.progress-summary__motivational {
    font-size: 1rem;
    color: var(--accent-cyan);
    margin: 1rem 0;
    line-height: 1.7;
}

.progress-summary__motivational strong {
    color: var(--accent-cyan);
    font-weight: 700;
}

/* --- HEALTH SUMMARY --- */
.health-summary {
    font-family: var(--font-sans);
    max-width: 100%;
    color: var(--text-primary);
    line-height: 1.6;
}

.health-summary__section {
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.health-summary__section:last-child {
    border-bottom: none;
}

.health-summary__heading {
    font-size: 1rem;
    font-weight: 700;
    color: var(--accent-pink);
    margin: 0 0 1rem 0;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid rgba(191, 90, 242, 0.2);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.health-summary__table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1rem;
    font-size: 0.875rem;
}

.health-summary__table thead {
    background: rgba(255, 255, 255, 0.03);
}

.health-summary__table th {
    text-align: left;
    padding: 0.75rem;
    font-weight: 600;
    color: var(--text-secondary);
    border: 1px solid rgba(255, 255, 255, 0.08);
    font-size: 0.8125rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.health-summary__table td {
    padding: 0.75rem;
    border: 1px solid rgba(255, 255, 255, 0.05);
    color: var(--text-secondary);
}

.health-summary__table tbody tr:hover {
    background: rgba(255, 255, 255, 0.02);
}

.health-summary__deviation-label {
    color: var(--accent-pink);
    font-weight: 600;
    margin: 1rem 0 0.5rem 0;
}

.health-summary__list {
    margin: 0.5rem 0;
    padding-left: 1.25rem;
    color: var(--text-tertiary);
}

.health-summary__list li {
    margin-bottom: 0.5rem;
    line-height: 1.5;
}

.health-summary__list strong {
    color: var(--text-secondary);
}

.health-summary__text {
    color: var(--text-tertiary);
    margin: 0.75rem 0;
    line-height: 1.6;
}

.health-summary__highlight {
    color: var(--accent-pink);
    font-weight: 600;
}

.health-summary__warning {
    color: var(--accent-orange);
}

.health-summary__danger {
    color: var(--accent-red);
    font-weight: 600;
}

.health-summary__success {
    color: var(--score-high);
}

.health-summary__motivational {
    font-size: 1rem;
    color: var(--accent-pink);
    margin: 1rem 0;
    line-height: 1.7;
}

.health-summary__motivational strong {
    color: var(--accent-pink);
    font-weight: 700;
}

/* ============================================
   OVERVIEW PAGE (TL;DR Landing)
   ============================================ */

/* Coach Hero Card */
.card--coach {
    background: radial-gradient(circle at 20% 50%, rgba(206, 242, 78, 0.08) 0%, rgba(28, 28, 30, 0.6) 50%);
}

.coach-hero-layout {
    display: flex;
    gap: 1.5rem;
    align-items: center;
}

.coach-hero-icon {
    flex-shrink: 0;
}

.coach-hero-icon img {
    filter: drop-shadow(0 0 12px rgba(206, 242, 78, 0.3));
}

.coach-hero-content {
    flex: 1;
}

.coach-hero-title {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0 0 0.25rem 0;
}

.coach-hero-subtitle {
    font-size: 0.9rem;
    color: var(--text-secondary);
    margin: 0 0 1rem 0;
}

.coach-hero-actions {
    display: flex;
    gap: 1rem;
    align-items: center;
    flex-wrap: wrap;
}

.coach-quick-questions {
    flex: 1;
    min-width: 200px;
}

/* Recap Card (Yesterday) */
.card--recap {
    border-top: 2px solid rgba(255, 255, 255, 0.15);
}

.recap-date {
    font-family: var(--font-mono);
    font-size: 0.7rem;
    color: var(--text-tertiary);
    text-transform: uppercase;
}

.recap-adherence {
    margin-bottom: 1.5rem;
}

.recap-adherence-label {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-secondary);
    margin-bottom: 0.75rem;
}

.recap-adherence-scores {
    display: flex;
    gap: 1rem;
    justify-content: space-around;
}

.recap-score {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
}

.recap-score-icon {
    font-size: 1.2rem;
}

.recap-score-val {
    font-family: var(--font-mono);
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--text-primary);
}

.recap-insights {
    margin-bottom: 1rem;
}

.recap-insight-label {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-secondary);
    margin-bottom: 0.5rem;
}

.recap-insight-item {
    font-size: 0.85rem;
    color: var(--text-tertiary);
    margin-bottom: 0.5rem;
    padding-left: 1rem;
    border-left: 2px solid rgba(255, 255, 255, 0.1);
    line-height: 1.5;
}

.recap-flags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.recap-flag {
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    padding: 0.35rem 0.75rem;
    border-radius: 100px;
    letter-spacing: 0.05em;
}

.recap-flag--win {
    background: rgba(48, 209, 88, 0.15);
    color: var(--score-high);
    border: 1px solid rgba(48, 209, 88, 0.3);
}

.recap-flag--warning {
    background: rgba(255, 159, 10, 0.15);
    color: var(--accent-orange);
    border: 1px solid rgba(255, 159, 10, 0.3);
}

.recap-flag--alert {
    background: rgba(255, 69, 58, 0.15);
    color: var(--accent-red);
    border: 1px solid rgba(255, 69, 58, 0.3);
}

/* Today's Plan Card */
.card--plan {
    border-top: 2px solid rgba(206, 242, 78, 0.3);
}

.today-goals {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.today-goal-section {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.today-goal-domain {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.today-goal-item {
    padding-left: 1.5rem;
    border-left: 2px solid rgba(255, 255, 255, 0.1);
}

.today-goal-text {
    font-size: 0.85rem;
    color: var(--text-secondary);
    line-height: 1.5;
}

.today-goal-metric {
    font-family: var(--font-mono);
    font-size: 0.9rem;
    color: var(--text-primary);
    margin-top: 0.25rem;
}

/* Quick Stats Cards */
.card--stat {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem;
}

.stat-icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    flex-shrink: 0;
}

.stat-icon--lime {
    background: rgba(206, 242, 78, 0.12);
    color: var(--accent-lime);
}

.stat-icon--cyan {
    background: rgba(100, 210, 255, 0.12);
    color: var(--accent-cyan);
}

.stat-icon--pink {
    background: rgba(191, 90, 242, 0.12);
    color: var(--accent-pink);
}

.stat-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.stat-label {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    color: var(--text-tertiary);
    letter-spacing: 0.05em;
}

.stat-value {
    font-family: var(--font-mono);
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--text-primary);
}

.stat-delta {
    font-size: 0.75rem;
    color: var(--text-tertiary);
}

.stat-delta--up {
    color: var(--score-high);
}

.stat-delta--down {
    color: var(--accent-orange);
}

/* Empty State Mini (for overview cards) */
.empty-state-mini {
    font-size: 0.8rem;
    color: var(--text-tertiary);
    font-style: italic;
}

/* Mobile Adjustments */
@media (max-width: 768px) {
    .coach-hero-layout {
        flex-direction: column;
        text-align: center;
    }

    .coach-hero-actions {
        flex-direction: column;
        width: 100%;
    }

    .coach-hero-actions .btn {
        width: 100%;
    }

    .recap-adherence-scores {
        gap: 0.5rem;
    }

    .recap-score-val {
        font-size: 1.3rem;
    }

    .card--stat {
        padding: 1rem;
    }
}

/* Progress Summary (expandable) */
.recap-progress-summary {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.progress-summary-content {
    margin-top: 1rem;
}

.progress-summary-pre {
    background: rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: var(--radius-s);
    padding: 1rem;
    font-size: 0.8rem;
    line-height: 1.6;
    color: var(--text-secondary);
    overflow-x: auto;
    white-space: pre-wrap;
    word-wrap: break-word;
    max-height: 400px;
    overflow-y: auto;
}

/* Agent Summaries Section */
.recap-agent-summaries {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}

/* Attributed Insights Stack */
.insight-stack {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-top: 0.75rem;
}

/* Section labels */
.insight-section-label {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-tertiary);
    margin-bottom: 0.5rem;
}

/* Simple insight items (non-card) */
.insight-item {
    font-size: 0.85rem;
    line-height: 1.5;
    color: var(--text-secondary);
    padding: 0.5rem 0;
    border-left: 2px solid rgba(147, 112, 219, 0.3);
    padding-left: 0.75rem;
    margin-bottom: 0.5rem;
}

/* Insight Card - Attributed with inline expansion */
.insight-card {
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: var(--radius-s);
    cursor: pointer;
    transition: all 0.2s ease;
    overflow: hidden;
}

.insight-card:hover {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.1);
}

.insight-card.expanded {
    background: rgba(255, 255, 255, 0.05);
}

/* Card Header - Badge + Text + Chevron */
.insight-card-header {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
}

.insight-card--compact .insight-card-header {
    padding: 0.5rem 0.75rem;
}

/* Agent Badge - Single letter indicator */
.insight-badge {
    flex-shrink: 0;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-mono);
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.12);
}

/* Badge colors - Domain agents */
.insight-badge--training {
    background: rgba(190, 242, 100, 0.12);
    border-color: rgba(190, 242, 100, 0.3);
    color: var(--accent-lime);
}

.insight-badge--nutrition {
    background: rgba(103, 232, 249, 0.12);
    border-color: rgba(103, 232, 249, 0.3);
    color: var(--accent-cyan);
}

.insight-badge--health {
    background: rgba(249, 168, 212, 0.12);
    border-color: rgba(249, 168, 212, 0.3);
    color: var(--accent-pink);
}

/* Badge colors - Meta agents */
.insight-badge--meta {
    background: rgba(147, 112, 219, 0.12);
    border-color: rgba(147, 112, 219, 0.3);
    color: rgba(147, 112, 219, 1);
}

/* Insight Text */
.insight-text {
    flex: 1;
    font-size: 0.85rem;
    line-height: 1.4;
    color: var(--text-primary);
}

.insight-card--compact .insight-text {
    font-size: 0.8rem;
    color: var(--text-secondary);
}

/* Chevron indicator */
.insight-chevron {
    flex-shrink: 0;
    font-size: 0.7rem;
    color: var(--text-tertiary);
    transition: transform 0.2s ease;
}

.insight-card.expanded .insight-chevron {
    transform: rotate(180deg);
}

/* Expansion Panel */
.insight-expand {
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    background: rgba(0, 0, 0, 0.2);
}

.insight-expand:empty {
    display: none;
}

.insight-expand-loading,
.insight-expand-error {
    padding: 1rem;
    font-size: 0.75rem;
    color: var(--text-tertiary);
    text-align: center;
}

.insight-expand-error {
    color: rgba(248, 113, 113, 0.8);
}

.insight-expand-content {
    padding: 1rem;
    font-family: var(--font-mono);
    font-size: 0.75rem;
    line-height: 1.6;
    color: var(--text-secondary);
    white-space: pre-wrap;
    word-wrap: break-word;
    overflow-x: auto;
    margin: 0;
    background: transparent;
    border: none;
}

.insight-expand-html {
    padding: 1rem;
    font-size: 0.85rem;
    line-height: 1.6;
    color: var(--text-secondary);
}

.insight-expand-html h1,
.insight-expand-html h2,
.insight-expand-html h3 {
    color: var(--text-primary);
    margin-top: 1rem;
    margin-bottom: 0.5rem;
}

.insight-expand-html h1 { font-size: 1.1rem; }
.insight-expand-html h2 { font-size: 1rem; }
.insight-expand-html h3 { font-size: 0.9rem; }

.insight-expand-html ul,
.insight-expand-html ol {
    padding-left: 1.5rem;
    margin: 0.5rem 0;
}

.insight-expand-html li {
    margin: 0.25rem 0;
}

.insight-expand-html p {
    margin: 0.5rem 0;
}

.insight-expand-html strong {
    color: var(--text-primary);
    font-weight: 600;
}

.insight-expand-html code {
    font-family: var(--font-mono);
    font-size: 0.8em;
    background: rgba(255, 255, 255, 0.05);
    padding: 0.1em 0.3em;
    border-radius: 3px;
}

/* Progress Summary Styles (for Progress meta-agent HTML) */
.progress-summary {
    font-size: 0.85rem;
    line-height: 1.7;
    color: var(--text-secondary);
}

.progress-summary__section {
    margin-bottom: 1.5rem;
}

.progress-summary__heading {
    color: var(--text-primary);
    font-size: 1rem;
    font-weight: 600;
    margin: 1.25rem 0 0.75rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    padding-bottom: 0.5rem;
}

.progress-summary__subheading {
    color: var(--text-primary);
    font-weight: 600;
    font-size: 0.9rem;
    margin: 0.75rem 0 0.5rem 0;
}

.progress-summary__text {
    margin: 0.5rem 0;
    color: var(--text-secondary);
}

.progress-summary__list {
    padding-left: 1.5rem;
    margin: 0.5rem 0;
}

.progress-summary__list li {
    margin: 0.4rem 0;
    color: var(--text-secondary);
}

.progress-summary__highlight {
    color: var(--text-primary);
    font-weight: 600;
}

.progress-summary__warning {
    color: rgba(251, 191, 36, 1);
    font-weight: 600;
}

.progress-summary__danger {
    color: rgba(248, 113, 113, 1);
    font-weight: 600;
}

.progress-summary__success {
    color: var(--accent-lime);
    font-weight: 600;
}

.progress-summary__motivational {
    font-style: italic;
    color: var(--text-tertiary);
    margin: 1.25rem 0;
    padding: 1rem;
    background: rgba(255, 255, 255, 0.02);
    border-left: 3px solid rgba(147, 112, 219, 0.5);
    border-radius: var(--radius-s);
}

.progress-summary__table {
    width: 100%;
    border-collapse: collapse;
    margin: 1rem 0;
    font-size: 0.8rem;
}

.progress-summary__table th {
    text-align: left;
    padding: 0.75rem;
    border-bottom: 2px solid rgba(255, 255, 255, 0.1);
    color: var(--text-primary);
    font-weight: 600;
}

.progress-summary__table td {
    padding: 0.75rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    color: var(--text-secondary);
}

.progress-summary__table tr:hover {
    background: rgba(255, 255, 255, 0.02);
}

/* Status dots for progress table */
.status-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-right: 0.5rem;
}

.status-dot--on-track {
    background: var(--accent-lime);
}

.status-dot--behind {
    background: rgba(251, 191, 36, 1);
}

.status-dot--at-risk {
    background: rgba(248, 113, 113, 1);
}

/* Plain text formatting (Progress, text-only agents) */
.insight-expand-text {
    padding: 1rem;
    font-size: 0.85rem;
    line-height: 1.7;
    color: var(--text-secondary);
}

.insight-expand-text p {
    margin: 0.75rem 0;
}

.insight-expand-text ul {
    padding-left: 1.5rem;
    margin: 0.5rem 0;
    list-style: none;
}

.insight-expand-text li {
    position: relative;
    margin: 0.4rem 0;
    padding-left: 0.5rem;
}

.insight-expand-text li::before {
    content: "•";
    position: absolute;
    left: -1rem;
    color: var(--text-tertiary);
}

.insight-expand-text .text-section-header {
    font-weight: 600;
    color: var(--text-primary);
    margin-top: 1rem;
    margin-bottom: 0.5rem;
    font-size: 0.9rem;
}

.insight-expand-text strong {
    color: var(--text-primary);
    font-weight: 600;
}

/* JSON fallback (Plan, Cycle, agents without HTML) */
.insight-expand-json {
    padding: 1rem;
}

.insight-expand-json-label {
    font-size: 0.75rem;
    color: var(--text-tertiary);
    margin-bottom: 0.5rem;
    font-style: italic;
}

.insight-expand-json .insight-expand-content {
    background: rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: var(--radius-s);
    padding: 0.75rem;
    max-height: 300px;
    overflow-y: auto;
    font-size: 0.7rem;
}

/* Border accent on hover - subtle domain color hint */
.insight-card--training:hover {
    border-left-color: rgba(190, 242, 100, 0.3);
}

.insight-card--nutrition:hover {
    border-left-color: rgba(103, 232, 249, 0.3);
}

.insight-card--health:hover {
    border-left-color: rgba(249, 168, 212, 0.3);
}

.insight-card--meta:hover {
    border-left-color: rgba(147, 112, 219, 0.3);
}

/* ══════════════════════════════════════════════════════════════════════════
   PLAN DASHBOARD ENHANCEMENTS
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Plan Health Icons (Header) ── */
.plan-health-icons {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-right: 1rem;
}

.plan-health-icon {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-s);
    transition: all 0.2s ease;
}

.plan-health-icon i {
    font-size: 0.9rem;
    color: var(--text-tertiary);
}

.plan-health-value {
    font-family: var(--font-mono);
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--text-primary);
}

.plan-health-icon--good {
    border-color: rgba(48, 209, 88, 0.3);
    background: rgba(48, 209, 88, 0.08);
}

.plan-health-icon--good i {
    color: var(--status-on-track);
}

.plan-health-icon--warn {
    border-color: rgba(255, 159, 10, 0.3);
    background: rgba(255, 159, 10, 0.08);
}

.plan-health-icon--warn i {
    color: var(--status-behind);
}

.plan-health-icon--bad {
    border-color: rgba(255, 69, 58, 0.3);
    background: rgba(255, 69, 58, 0.08);
}

.plan-health-icon--bad i {
    color: var(--status-at-risk);
}

/* ── Card Header Actions ── */
.card__header-actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* ── Plan Status Badge ── */
.plan-status-badge {
    font-family: var(--font-mono);
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.25rem 0.6rem;
    border-radius: 100px;
    background: rgba(255, 255, 255, 0.06);
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.plan-status-badge--active {
    background: rgba(48, 209, 88, 0.1);
    color: var(--status-on-track);
    border: 1px solid rgba(48, 209, 88, 0.2);
}

.plan-status-badge--stale {
    background: rgba(255, 159, 10, 0.1);
    color: var(--status-behind);
    border: 1px solid rgba(255, 159, 10, 0.2);
}

/* ── Button Size Variant ── */
.btn--xs {
    padding: 0.4rem 0.6rem;
    font-size: 0.75rem;
}

.btn--icon.btn--xs {
    width: 28px;
    height: 28px;
    padding: 0;
}

/* ── Plan Section Header ── */
.plan-section-header {
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: 0.75rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--border-subtle);
}

/* ── Nutrition Phase Banner ── */
.plan-phase-banner {
    background: rgba(100, 210, 255, 0.08);
    border: 1px solid rgba(100, 210, 255, 0.2);
    border-radius: var(--radius-m);
    padding: 1rem;
    margin-bottom: 1.25rem;
}

.plan-phase-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.5rem;
}

.plan-phase-type {
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--accent-cyan);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.plan-phase-duration {
    font-family: var(--font-mono);
    font-size: 0.75rem;
    color: var(--text-tertiary);
    background: rgba(255, 255, 255, 0.06);
    padding: 0.25rem 0.6rem;
    border-radius: 100px;
}

.plan-phase-goal {
    font-size: 0.85rem;
    line-height: 1.5;
    color: var(--text-secondary);
    margin: 0;
}

/* ── Macro Ratios ── */
.plan-macro-ratios {
    margin-top: 0.75rem;
}

.plan-macro-ratio-bar {
    display: flex;
    height: 8px;
    border-radius: 100px;
    overflow: hidden;
    margin-bottom: 0.5rem;
    background: rgba(255, 255, 255, 0.04);
}

.plan-macro-seg {
    transition: width 0.4s ease;
}

.plan-macro-seg--protein {
    background: var(--accent-cyan);
}

.plan-macro-seg--carbs {
    background: var(--accent-lime);
}

.plan-macro-seg--fat {
    background: var(--accent-pink);
}

.plan-macro-ratio-labels {
    display: flex;
    gap: 1rem;
}

.plan-macro-label {
    font-family: var(--font-mono);
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--text-tertiary);
    letter-spacing: 0.05em;
}

/* ── Weight Guidelines ── */
.plan-weight-guidelines {
    background: rgba(191, 90, 242, 0.06);
    border: 1px solid rgba(191, 90, 242, 0.15);
    border-radius: var(--radius-m);
    padding: 1rem;
    margin-bottom: 1.25rem;
}

.plan-weight-goal {
    margin-bottom: 0.75rem;
}

.plan-weight-values {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
    margin-bottom: 0.5rem;
}

.plan-weight-current,
.plan-weight-target {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
}

.plan-weight-label {
    font-size: 0.7rem;
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 600;
}

.plan-weight-value {
    font-family: var(--font-mono);
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--accent-pink);
}

.plan-weight-arrow {
    color: var(--text-tertiary);
    font-size: 1rem;
}

.plan-weight-delta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    font-size: 0.8rem;
    color: var(--text-secondary);
}

.plan-weight-delta-label {
    font-weight: 600;
    text-transform: capitalize;
}

.plan-weight-delta-value {
    font-family: var(--font-mono);
    font-weight: 700;
    color: var(--accent-pink);
}

.plan-weight-eta {
    font-size: 0.75rem;
    color: var(--text-tertiary);
}

.plan-weight-rate,
.plan-weight-range {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.5rem;
    font-size: 0.8rem;
}

.plan-weight-rate-label,
.plan-weight-range-label {
    color: var(--text-tertiary);
    font-weight: 600;
}

.plan-weight-rate-value,
.plan-weight-range-value {
    font-family: var(--font-mono);
    font-weight: 600;
    color: var(--text-primary);
}

/* ── Plan Guidance Text ── */
.plan-guidance-text {
    font-size: 0.85rem;
    line-height: 1.6;
    color: var(--text-secondary);
    background: rgba(255, 255, 255, 0.03);
    border-left: 2px solid var(--border-subtle);
    padding: 0.75rem 1rem;
    border-radius: var(--radius-s);
    margin: 0;
}

/* ── Plan Guidance Accordion ── */
.plan-guidance-accordion {
    margin-top: 0.75rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: var(--radius-s);
    overflow: hidden;
}

.plan-guidance-toggle {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.45rem 0.75rem;
    background: rgba(255, 255, 255, 0.03);
    border: none;
    cursor: pointer;
    color: var(--text-tertiary);
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    transition: background 0.15s;
}

.plan-guidance-toggle:hover {
    background: rgba(255, 255, 255, 0.06);
    color: var(--text-secondary);
}

.plan-guidance-toggle-label {
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.plan-guidance-chevron {
    transition: transform 0.2s ease;
    font-size: 0.65rem;
    opacity: 0.5;
}

.plan-guidance-accordion.open .plan-guidance-chevron {
    transform: rotate(180deg);
}

.plan-guidance-panel {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.25s ease;
}

.plan-guidance-accordion.open .plan-guidance-panel {
    max-height: 800px;
}

.plan-guidance-panel .plan-guidance-text {
    margin: 0;
    border-left: none;
    border-radius: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}

/* ── Training Exercise Enhancements ── */
.trn-plan-exercise__main {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.trn-plan-exercise__weight {
    font-family: var(--font-mono);
    font-size: 0.73rem;
    font-weight: 600;
    color: var(--accent-lime);
    flex-shrink: 0;
    letter-spacing: 0.01em;
}

.trn-plan-exercise__stats {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    flex-shrink: 0;
}

.trn-plan-exercise__rpe {
    font-size: 0.62rem;
    font-weight: 700;
    padding: 0.1rem 0.35rem;
    background: rgba(206, 242, 78, 0.08);
    color: var(--accent-lime);
    border-radius: 4px;
    border: 1px solid rgba(206, 242, 78, 0.18);
    font-family: 'JetBrains Mono', monospace;
    letter-spacing: 0.02em;
}

.trn-plan-exercise__rec,
.trn-plan-exercise__overload,
.trn-plan-exercise__note {
    display: block;
    font-size: 0.7rem;
    color: var(--text-tertiary);
    margin-top: 0.18rem;
    padding-left: 0.75rem;
    border-left: 1px solid rgba(255, 255, 255, 0.08);
    line-height: 1.4;
}

.trn-plan-exercise__rec {
    color: rgba(206, 242, 78, 0.65);
}

.trn-plan-exercise__overload {
    color: rgba(255, 159, 10, 0.7);
}

.trn-plan-session__volume {
    font-size: 0.65rem;
    font-family: 'JetBrains Mono', monospace;
    color: var(--text-tertiary);
    background: rgba(255, 255, 255, 0.05);
    padding: 0.1rem 0.4rem;
    border-radius: 4px;
    letter-spacing: 0.03em;
}

/* ── Health Plan Weight Chart ── */
.hp-weight-chart-wrap {
    height: 140px;
}

/* ── Nutrition Daily Logs Table ── */
.detail-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.78rem;
}
.detail-table th {
    text-align: left;
    padding: 0.25rem 0.5rem 0.5rem;
    font-size: 0.62rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-tertiary);
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
    white-space: nowrap;
}
.detail-table td {
    padding: 0.35rem 0.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
    color: var(--text-secondary);
    vertical-align: middle;
}
.detail-table tr:last-child td {
    border-bottom: none;
}
.detail-table__date {
    color: var(--text-tertiary);
    font-size: 0.72rem;
    white-space: nowrap;
}
.detail-table__number {
    font-family: var(--font-mono);
    font-size: 0.72rem;
    color: var(--text-primary);
    text-align: right;
}
.detail-table__score {
    font-family: var(--font-mono);
    font-size: 0.72rem;
    text-align: right;
    white-space: nowrap;
}
.detail-table__score--good { color: #30D158; }
.detail-table__score--warn { color: #FF9F0A; }
.detail-table__score--bad  { color: #FF453A; }

/* ── Mobile Responsiveness ── */
@media (max-width: 768px) {
    .plan-health-icons {
        display: none;
    }

    .plan-weight-values {
        flex-direction: column;
        gap: 0.75rem;
    }

    .plan-weight-arrow {
        transform: rotate(90deg);
    }
}

/* ── Score Status Classes ── */
/* Used to distinguish between unscored (future) and missed (past 0) scores */

.score-unscored {
    color: var(--text-tertiary) !important;
    opacity: 0.6;
}

.score-missed {
    color: var(--accent-red) !important;
}

.score-low {
    color: var(--score-low) !important;
}

.score-medium {
    color: var(--score-med) !important;
}

.score-high {
    color: var(--score-high) !important;
}

/* Score value with status indicator */
.score-value-wrapper {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

.score-status-badge {
    font-size: 0.7rem;
    padding: 0.125rem 0.375rem;
    border-radius: 4px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.score-status-badge.unscored {
    background: rgba(255, 255, 255, 0.05);
    color: var(--text-tertiary);
}

.score-status-badge.missed {
    background: rgba(255, 69, 58, 0.15);
    color: var(--accent-red);
}

/* ========================================================================
   L2 Plan Dashboard Enhancements - Cockpit Aesthetic
   ======================================================================== */

/* Phase Badge - Prominent nutrition phase indicator */
.plan-phase-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    background: rgba(100, 210, 255, 0.1);
    border: 1px solid rgba(100, 210, 255, 0.3);
    border-radius: 100px;
    font-family: var(--font-sans);
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--accent-cyan);
    margin-bottom: 0.75rem;
}

.plan-phase-badge i {
    font-size: 0.7rem;
    opacity: 0.8;
}

.plan-phase-name {
    flex: 1;
}

.plan-phase-weeks {
    font-family: var(--font-mono);
    font-size: 0.7rem;
    opacity: 0.7;
}

/* Phase-specific badge colors */
.plan-phase-badge--cut,
.plan-phase-badge--mini-cut {
    background: rgba(255, 69, 58, 0.1);
    border-color: rgba(255, 69, 58, 0.3);
    color: var(--accent-red);
}

.plan-phase-badge--reverse-diet,
.plan-phase-badge--recovery {
    background: rgba(255, 171, 64, 0.1);
    border-color: rgba(255, 171, 64, 0.3);
    color: var(--score);
}

.plan-phase-badge--bulk {
    background: rgba(206, 242, 78, 0.1);
    border-color: rgba(206, 242, 78, 0.3);
    color: var(--accent-lime);
}

.plan-phase-badge--maintenance,
.plan-phase-badge--stabilization {
    background: rgba(100, 210, 255, 0.1);
    border-color: rgba(100, 210, 255, 0.3);
    color: var(--accent-cyan);
}

.plan-phase-goal {
    font-size: 0.75rem;
    color: var(--text-secondary);
    margin-bottom: 0.75rem;
    line-height: 1.4;
}

/* Adherence Section */
.plan-adherence-section {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

/* Score Bar - Progress bar for adherence/deviance */
.plan-score-bar {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.plan-score-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.plan-score-label {
    font-family: var(--font-sans);
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-secondary);
}

.plan-score-value {
    font-family: var(--font-mono);
    font-size: 0.9rem;
    font-weight: 600;
}

.plan-score-value--good {
    color: var(--status-on-track);
}

.plan-score-value--warn {
    color: var(--status-behind);
}

.plan-score-value--bad {
    color: var(--status-at-risk);
}

/* Progress Track */
.plan-progress-track {
    height: 4px;
    background: rgba(255, 255, 255, 0.06);
    border-radius: 2px;
    overflow: hidden;
    position: relative;
}

.plan-progress-fill {
    height: 100%;
    border-radius: 2px;
    transition: width 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.plan-progress-fill--good {
    background: var(--status-on-track);
}

.plan-progress-fill--warn {
    background: var(--status-behind);
}

.plan-progress-fill--bad {
    background: var(--status-at-risk);
}

/* Deviance track (centered, can go negative visually) */
.plan-progress-track--deviance {
    background: rgba(255, 255, 255, 0.04);
}

/* Week Indicator */
.plan-week-indicator {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.375rem 0;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.plan-week-label {
    font-family: var(--font-sans);
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-tertiary);
}

.plan-week-value {
    font-family: var(--font-mono);
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--text-primary);
}

/* Enhanced timeframe badge (now shows date ranges) */
.plan-timeframe-badge {
    font-family: var(--font-mono);
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.25rem 0.5rem;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: var(--radius-s);
    color: var(--text-secondary);
    cursor: help;
}

.plan-timeframe-badge:hover {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.15);
}

/* ── Training Plan Regen Hint ── */
.trn-plan-regen-note {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 1rem;
    padding: 0.4rem 0.75rem;
    font-size: 0.7rem;
    color: var(--text-tertiary);
    background: rgba(206, 242, 78, 0.04);
    border-left: 2px solid rgba(206, 242, 78, 0.25);
    border-radius: 0 4px 4px 0;
    line-height: 1.4;
}

.trn-plan-regen-note i {
    color: rgba(206, 242, 78, 0.4);
    font-size: 0.65rem;
    flex-shrink: 0;
}

/* ── Today's Session Card (Training L3) ── */
.trn-today-session {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.trn-today-header {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    flex-wrap: wrap;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.trn-today-day {
    font-family: var(--font-mono);
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--accent-lime);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    flex-shrink: 0;
}

.trn-today-focus {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--text-primary);
    flex: 1;
}

.trn-today-exercises {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.trn-today-exercise {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    padding: 0.45rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}
.trn-today-exercise:first-child { padding-top: 0; }
.trn-today-exercise:last-child { border-bottom: none; padding-bottom: 0; }

.trn-today-ex-main {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.trn-today-ex-name {
    font-size: 0.83rem;
    font-weight: 500;
    color: var(--text-primary);
    flex: 1;
}

.trn-today-ex-weight {
    font-family: var(--font-mono);
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--accent-lime);
    flex-shrink: 0;
    letter-spacing: 0.01em;
}

.trn-today-ex-sub {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.trn-today-ex-sets {
    font-family: var(--font-mono);
    font-size: 0.68rem;
    color: var(--text-tertiary);
    letter-spacing: 0.02em;
}

.trn-today-ex-1rm {
    font-size: 0.67rem;
    color: rgba(206, 242, 78, 0.5);
    letter-spacing: 0.01em;
}

.trn-today-ex-overload {
    font-size: 0.67rem;
    color: rgba(255, 159, 10, 0.65);
    line-height: 1.4;
    padding-left: 0.5rem;
    border-left: 1px solid rgba(255, 159, 10, 0.2);
    margin-top: 0.1rem;
}

.trn-today-meta {
    padding-top: 0.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    font-size: 0.68rem;
    color: var(--text-tertiary);
    font-family: var(--font-mono);
    letter-spacing: 0.02em;
}

.trn-today-rest {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    padding: 1.5rem 0;
    text-align: center;
}

.trn-today-rest__icon {
    font-size: 1.4rem;
    color: var(--text-tertiary);
    line-height: 1;
    opacity: 0.5;
}

.trn-today-rest__label {
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--text-secondary);
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.trn-today-rest__note {
    font-size: 0.72rem;
    color: var(--text-tertiary);
}

/* ── AI Insights Panel (L3 Plan Detail pages) ── */

.intel-insight {
    padding: 0.75rem 1rem;
    margin-bottom: 0.75rem;
    border-left: 3px solid rgba(100, 210, 255, 0.4);
    background: rgba(100, 210, 255, 0.05);
    border-radius: 0 var(--radius-s) var(--radius-s) 0;
    color: var(--text-primary);
    font-size: 0.875rem;
    line-height: 1.6;
}

.intel-insight p {
    color: var(--text-primary);
    margin: 0;
}

.intel-insight--secondary {
    border-left-color: rgba(255, 255, 255, 0.15);
    background: rgba(255, 255, 255, 0.03);
}

.intel-insight--secondary p {
    color: var(--text-secondary);
}

.intel-insight strong {
    display: block;
    color: var(--text-tertiary);
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.4rem;
}

.intel-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0;
    margin: 0;
}

.intel-list li {
    color: var(--text-primary);
    font-size: 0.875rem;
    line-height: 1.5;
    border-left: 2px solid rgba(100, 210, 255, 0.3);
    padding: 0.4rem 0 0.4rem 0.75rem;
}

/* ═══════════════════════════════════════════════════════════════════
   NUTRITION PLAN DETAIL (.np-*)
   L3 page: plan targets, weekly adherence, meal structure
   ═══════════════════════════════════════════════════════════════════ */

/* Header score ring */
.np-header-score {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.3rem 0.75rem;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 100px;
}

.np-score-ring { flex-shrink: 0; }

.np-score-val {
    font-family: var(--font-mono);
    font-size: 1rem;
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1;
}

/* ── Plan Targets card ── */
.np-targets {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.np-calorie-hero {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
}

.np-calorie-val {
    font-family: var(--font-mono);
    font-size: 2.2rem;
    font-weight: 700;
    color: var(--accent-cyan);
    line-height: 1;
    letter-spacing: -0.03em;
}

.np-calorie-unit {
    font-size: 0.75rem;
    color: var(--text-tertiary);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.np-macro-bar {
    display: flex;
    height: 8px;
    border-radius: 4px;
    overflow: hidden;
    gap: 2px;
}

.np-macro-seg { border-radius: 2px; }
.np-macro-seg--protein { background: #64D2FF; opacity: 0.8; }
.np-macro-seg--carbs   { background: #CEF24E; opacity: 0.8; }
.np-macro-seg--fat     { background: #FF9F0A; opacity: 0.8; }

.np-macro-labels {
    display: flex;
    gap: 1.25rem;
}

.np-macro-label {
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--text-secondary);
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

.np-macro-label strong { font-family: var(--font-mono); color: var(--text-primary); }

.np-macro-label--protein strong { color: #64D2FF; }
.np-macro-label--carbs   strong { color: #CEF24E; }
.np-macro-label--fat     strong { color: #FF9F0A; }

.np-macro-pct {
    font-family: var(--font-mono);
    font-size: 0.65rem;
    color: var(--text-tertiary);
    opacity: 0.7;
}

.np-secondary-targets {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
    padding-top: 0.25rem;
    border-top: 1px solid rgba(255,255,255,0.06);
}

.np-secondary-item {
    font-size: 0.75rem;
    color: var(--text-tertiary);
}

.np-secondary-item strong {
    font-family: var(--font-mono);
    color: var(--text-secondary);
    font-weight: 500;
}

/* ── Week Performance strip ── */
.np-week-strip {
    display: flex;
    gap: 0.5rem;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.np-day-cell {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.3rem;
}

.np-day-label {
    font-family: var(--font-mono);
    font-size: 0.6rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--text-tertiary);
}

.np-day-bar-wrap {
    width: 100%;
    height: 60px;
    background: rgba(255,255,255,0.04);
    border-radius: 3px;
    display: flex;
    align-items: flex-end;
    overflow: hidden;
}

.np-day-bar {
    width: 100%;
    border-radius: 3px 3px 0 0;
    transition: height 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    min-height: 3px;
}

.np-day-score {
    font-family: var(--font-mono);
    font-size: 0.65rem;
    font-weight: 700;
    line-height: 1;
}

.np-week-avg {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 0.75rem;
    border-top: 1px solid rgba(255,255,255,0.06);
}

.np-week-avg-label {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-tertiary);
}

.np-week-avg-val {
    font-family: var(--font-mono);
    font-size: 1.3rem;
    font-weight: 700;
    line-height: 1;
}

/* ── Meal Plan Structure ── */
.np-meals-list {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-bottom: 0.5rem;
}

.np-meal-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 0;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}

.np-meal-row:last-child { border-bottom: none; }
.np-meal-row--gap { opacity: 0.5; }

.np-meal-icon {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,0.04);
    border-radius: var(--radius-s);
    font-size: 0.8rem;
}

.np-meal-info {
    flex: 1;
    min-width: 0;
}

.np-meal-name {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--text-primary);
    line-height: 1.3;
}

.np-meal-macros {
    font-family: var(--font-mono);
    font-size: 0.7rem;
    color: var(--text-tertiary);
    margin-top: 0.15rem;
}

.np-meal-supps {
    font-size: 0.65rem;
    color: rgba(100, 210, 255, 0.6);
    margin-top: 0.2rem;
    font-style: italic;
}

.np-meal-right {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.2rem;
    min-width: 80px;
}

.np-meal-cal {
    font-family: var(--font-mono);
    font-size: 1rem;
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1;
}

.np-meal-cal-unit {
    font-size: 0.6rem;
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-top: -0.1rem;
}

.np-meal-bar {
    display: flex;
    height: 4px;
    width: 80px;
    border-radius: 2px;
    overflow: hidden;
    gap: 1px;
}

.np-meals-footer {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding-top: 0.75rem;
    border-top: 1px solid rgba(255,255,255,0.08);
}

.np-meals-totals {
    display: flex;
    align-items: center;
    gap: 1rem;
    justify-content: space-between;
}

.np-meals-total-label {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-tertiary);
}

.np-meals-macros-summary {
    font-family: var(--font-mono);
    font-size: 0.72rem;
    color: var(--text-tertiary);
}

.np-meals-total-cal {
    font-family: var(--font-mono);
    font-size: 1rem;
    font-weight: 700;
    color: var(--accent-cyan);
}

.np-rest-note,
.np-hydration-note {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.75rem;
    color: var(--text-tertiary);
}

.np-rest-note i,
.np-hydration-note i { flex-shrink: 0; width: 14px; }

.np-rest-note strong,
.np-hydration-note strong { color: var(--text-secondary); font-family: var(--font-mono); }

/* Responsive */
@media (max-width: 600px) {
    .np-calorie-val { font-size: 1.8rem; }
    .np-week-strip  { gap: 0.25rem; }
    .np-day-bar-wrap { height: 48px; }
    .np-meals-totals { flex-wrap: wrap; gap: 0.5rem; }
}

/* ============================================
   OVERVIEW PAGE — REDESIGN
   3-col layout: Yesterday | Today | Coach
   ============================================ */

/* Main 3-column grid */
.overview-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1.2fr;
    gap: 1.5rem;
    align-items: stretch;
}

/* Yesterday card — flex column so stats footer sits at the bottom */
.overview-yesterday {
    display: flex;
    flex-direction: column;
}
.overview-yesterday .card__body {
    flex: 1;
}

/* Big 3-score display */
.overview-scores {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    margin-bottom: 1rem;
}
.overview-score {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.3rem;
    padding: 0.85rem 0.5rem;
    border-radius: var(--radius-s);
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.05);
}
.overview-score-num {
    font-family: var(--font-mono);
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
}
.overview-score i { font-size: 0.85rem; }
.overview-score-label {
    font-size: 0.62rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-tertiary);
}
.overview-score--training .overview-score-num,
.overview-score--training i { color: var(--accent-lime); }
.overview-score--nutrition .overview-score-num,
.overview-score--nutrition i { color: var(--accent-cyan); }
.overview-score--health .overview-score-num,
.overview-score--health i { color: var(--accent-pink); }

/* Stats footer inside Yesterday card */
.overview-stats-footer {
    display: flex;
    align-items: center;
    padding-top: 1rem;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.overview-stat-mini {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 1;
    min-width: 0;
}
.overview-stat-mini i { font-size: 0.85rem; flex-shrink: 0; }
.overview-stat-mini-val {
    font-family: var(--font-mono);
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--text-primary);
    white-space: nowrap;
}
.overview-stat-mini-delta {
    font-size: 0.65rem;
    color: var(--text-tertiary);
    white-space: nowrap;
}
.overview-stat-divider {
    width: 1px;
    height: 20px;
    background: rgba(255, 255, 255, 0.08);
    margin: 0 0.75rem;
    flex-shrink: 0;
}

/* Coach column — lime left accent border */
.overview-coach {
    border-left: 2px solid rgba(206, 242, 78, 0.22);
    display: flex;
    flex-direction: column;
}

/* Compact coach header: logo + title + chips on one row */
.coach-header {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    margin-bottom: 0.75rem;
    flex-wrap: wrap;
}
.coach-header-title {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--text-primary);
}
.coach-intel-chips {
    display: flex;
    gap: 0.4rem;
    flex-wrap: wrap;
}
.coach-chip {
    font-size: 0.68rem;
    font-weight: 500;
    padding: 0.18rem 0.55rem;
    border-radius: 12px;
    white-space: nowrap;
}
.coach-chip--lime {
    background: rgba(206, 242, 78, 0.1);
    color: var(--accent-lime);
    border: 1px solid rgba(206, 242, 78, 0.2);
}
.coach-chip--warn {
    background: rgba(255, 159, 10, 0.1);
    color: var(--accent-orange);
    border: 1px solid rgba(255, 159, 10, 0.2);
}

/* Coach subtitle */
.coach-subtitle {
    font-size: 0.85rem;
    color: var(--text-secondary);
    margin: 0 0 1rem 0;
    line-height: 1.5;
}

/* Question pills — stacked vertically in coach column */
.coach-questions {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    margin-bottom: 1rem;
}
.coach-q-btn {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: var(--text-secondary);
    font-size: 0.78rem;
    padding: 0.4rem 0.85rem;
    border-radius: var(--radius-s);
    cursor: pointer;
    font-family: var(--font-sans);
    transition: background 0.15s, border-color 0.15s, color 0.15s;
    text-decoration: none;
    display: block;
    width: 100%;
    text-align: left;
}
.coach-q-btn:hover {
    background: rgba(206, 242, 78, 0.07);
    border-color: rgba(206, 242, 78, 0.22);
    color: var(--text-primary);
}

/* Full-width Start Conversation CTA */
.coach-cta {
    width: 100%;
    justify-content: center;
    margin-bottom: 1.25rem;
}

/* Agent analysis section below CTA */
.coach-analysis {
    flex: 1;
    padding-top: 1rem;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}

/* Responsive: at 1100px collapse coach to full width */
@media (max-width: 1100px) {
    .overview-grid {
        grid-template-columns: 1fr 1fr;
    }
    .overview-coach {
        grid-column: 1 / -1;
        border-left: none;
        border-top: 2px solid rgba(206, 242, 78, 0.22);
    }
    .coach-questions {
        flex-direction: row;
        flex-wrap: wrap;
    }
    .coach-q-btn {
        display: inline-block;
        width: auto;
    }
}

/* Responsive: single column on mobile */
@media (max-width: 640px) {
    .overview-grid {
        grid-template-columns: 1fr;
    }
    .overview-coach {
        grid-column: 1;
    }
    .overview-score-num {
        font-size: 1.6rem;
    }
}

/* ============================================
   COACH WIDGET — Live AI Chat Entry Point
   ============================================ */

/* Card background: deeper lime glow from avatar position (top-left) */
.overview-coach {
    background:
        radial-gradient(ellipse at 12% 18%, rgba(206, 242, 78, 0.13) 0%, transparent 52%),
        rgba(28, 28, 30, 0.6);
    border-left: 2px solid rgba(206, 242, 78, 0.28);
    display: flex;
    flex-direction: column;
}

/* ── Identity bar ── */
.coach-identity {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.coach-avatar-wrap {
    position: relative;
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgba(206, 242, 78, 0.08);
    border: 1px solid rgba(206, 242, 78, 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
}

.coach-avatar-wrap img {
    filter: drop-shadow(0 0 8px rgba(206, 242, 78, 0.5));
}

/* Pulsing online indicator */
.coach-online-dot {
    position: absolute;
    bottom: 1px;
    right: 1px;
    width: 10px;
    height: 10px;
    background: #22c55e;
    border-radius: 50%;
    border: 2px solid rgba(28, 28, 30, 0.95);
    animation: coach-pulse 2.5s ease-in-out infinite;
}

@keyframes coach-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.45); }
    60%       { box-shadow: 0 0 0 5px rgba(34, 197, 94, 0); }
}

.coach-identity-meta {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.coach-name {
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1;
}

/* Intel chips next to the name */
.coach-intel-chips {
    display: flex;
    gap: 0.35rem;
    flex-wrap: wrap;
}

.coach-chip {
    font-size: 0.67rem;
    font-weight: 600;
    padding: 0.15rem 0.5rem;
    border-radius: 100px;
    white-space: nowrap;
    letter-spacing: 0.01em;
}

.coach-chip--lime {
    background: rgba(206, 242, 78, 0.1);
    color: var(--accent-lime);
    border: 1px solid rgba(206, 242, 78, 0.22);
}

.coach-chip--warn {
    background: rgba(255, 159, 10, 0.1);
    color: var(--accent-orange);
    border: 1px solid rgba(255, 159, 10, 0.22);
}

/* ── Message bubble ── */
.coach-bubble {
    background: rgba(206, 242, 78, 0.04);
    border: 1px solid rgba(206, 242, 78, 0.14);
    border-left: 3px solid rgba(206, 242, 78, 0.55);
    border-radius: 0 var(--radius-s) var(--radius-s) var(--radius-s);
    padding: 0.9rem 1rem;
    margin-bottom: 1rem;
    min-height: 58px;
    display: flex;
    align-items: center;
}

/* Three-dot typing indicator */
.coach-typing {
    display: flex;
    gap: 5px;
    align-items: center;
    padding: 2px 0;
}

.coach-typing span {
    width: 7px;
    height: 7px;
    background: rgba(206, 242, 78, 0.55);
    border-radius: 50%;
    animation: coach-dot-bounce 1.3s ease-in-out infinite;
}

.coach-typing span:nth-child(2) { animation-delay: 0.18s; }
.coach-typing span:nth-child(3) { animation-delay: 0.36s; }

@keyframes coach-dot-bounce {
    0%, 60%, 100% { transform: translateY(0);    opacity: 0.4; }
    30%            { transform: translateY(-7px); opacity: 1;   }
}

/* Coach message text — fades in when populated */
.coach-bubble-text {
    font-size: 0.9rem;
    line-height: 1.65;
    color: var(--text-primary);
    margin: 0;
    opacity: 0;
    transform: translateY(4px);
    transition: opacity 0.35s ease, transform 0.35s ease;
}

.coach-bubble-text.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* ── Quick-reply chips ── */
.coach-replies {
    display: flex;
    flex-direction: column;
    gap: 0.38rem;
    margin-bottom: 1rem;
}

.coach-reply-chip {
    display: block;
    font-size: 0.78rem;
    padding: 0.42rem 0.85rem;
    border-radius: var(--radius-s);
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.09);
    color: var(--text-secondary);
    text-decoration: none;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.coach-reply-chip:hover {
    background: rgba(206, 242, 78, 0.08);
    border-color: rgba(206, 242, 78, 0.28);
    color: var(--accent-lime);
}

/* ── Input-bar CTA ── */
.coach-input-bar {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    background: rgba(0, 0, 0, 0.28);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 100px;
    padding: 0.5rem 0.5rem 0.5rem 1.1rem;
    cursor: pointer;
    text-decoration: none;
    min-height: 46px;
    transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
    margin-bottom: 1.25rem;
}

.coach-input-bar:hover {
    border-color: rgba(206, 242, 78, 0.4);
    background: rgba(206, 242, 78, 0.03);
    box-shadow: 0 0 0 3px rgba(206, 242, 78, 0.06);
}

.coach-input-placeholder {
    flex: 1;
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.28);
    font-family: var(--font-sans);
    pointer-events: none;
    user-select: none;
}

.coach-send-btn {
    width: 34px;
    height: 34px;
    background: var(--accent-lime);
    color: #0a0a0a;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    flex-shrink: 0;
    transition: background 0.15s ease, transform 0.15s ease;
}

.coach-input-bar:hover .coach-send-btn {
    background: #d6f54a;
    transform: translateX(2px);
}

/* ── Agent analysis section ── */
.coach-analysis {
    flex: 1;
    padding-top: 1rem;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}

/* ── Responsive overrides ── */
@media (max-width: 1100px) {
    .overview-coach {
        grid-column: 1 / -1;
        border-left: none;
        border-top: 2px solid rgba(206, 242, 78, 0.28);
        background:
            radial-gradient(ellipse at 5% 30%, rgba(206, 242, 78, 0.11) 0%, transparent 50%),
            rgba(28, 28, 30, 0.6);
    }
    .coach-replies {
        flex-direction: row;
        flex-wrap: wrap;
    }
    .coach-reply-chip {
        width: auto;
        display: inline-block;
    }
}

@media (max-width: 640px) {
    .overview-coach {
        grid-column: 1;
    }
    .coach-bubble-text { font-size: 0.85rem; }
}

/* Respect prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
    .coach-online-dot      { animation: none; }
    .coach-typing span     { animation: none; opacity: 0.6; }
    .coach-bubble-text     { transition: none; }
    .coach-send-btn        { transition: none; }
    .coach-input-bar       { transition: none; }
}

/* ── App Footer ── */
.app-footer {
    padding: 2rem 1.5rem 1.5rem;
    margin-top: 3rem;
    text-align: center;
    border-top: 1px solid var(--border-subtle);
}
.footer-links {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    font-size: 0.8rem;
}
.footer-links a {
    color: var(--text-tertiary);
    text-decoration: none;
    transition: color 0.2s;
}
.footer-links a:hover {
    color: var(--accent-lime);
}
.footer-sep {
    color: var(--text-tertiary);
    opacity: 0.4;
}
.footer-copy {
    color: var(--text-tertiary);
    opacity: 0.6;
}
@media (max-width: 768px) {
    .app-footer {
        padding-bottom: calc(1.5rem + 60px); /* clear mobile nav */
    }
}