/* ═══════════════════════════════════════════════════════════════
   Tool: Move Calculator
   ═══════════════════════════════════════════════════════════════ */

        /* ─── Move Calculator Styles ─── */
        .mc-hero {
            max-width: var(--content-width);
            margin: 48px auto 0;
            padding: 0 24px;
            text-align: center;
        }
        .mc-hero h1 {
            font-family: 'DM Serif Display', serif;
            font-size: 40px;
            line-height: 1.2;
            margin-bottom: 16px;
            color: var(--text);
        }
        .mc-hero p {
            font-size: 17px;
            color: var(--text-light);
            max-width: 560px;
            margin: 0 auto 32px;
            line-height: 1.7;
        }

        /* ─── Input Section ─── */
        .mc-input-box {
            max-width: 640px;
            margin: 0 auto 48px;
            background: white;
            border-radius: 20px;
            padding: 40px 36px 36px;
            box-shadow: 0 2px 8px rgba(0,0,0,0.04), 0 8px 32px rgba(0,0,0,0.07);
        }
        .mc-input-row {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 20px;
            margin-bottom: 24px;
        }
        .mc-input-group label {
            display: block;
            font-size: 14px;
            font-weight: 600;
            color: var(--text);
            margin-bottom: 8px;
            text-align: left;
        }
        .mc-input-group input {
            width: 100%;
            padding: 16px 18px;
            border: 2px solid var(--cream);
            border-radius: 12px;
            font-size: 20px;
            font-family: inherit;
            letter-spacing: 0.04em;
            color: var(--text);
            background: var(--warm-bg);
            text-align: center;
            transition: border-color 0.2s ease;
            box-sizing: border-box;
        }
        .mc-input-group input:focus {
            outline: none;
            border-color: var(--accent);
        }
        .mc-input-group input::placeholder {
            color: var(--accent-light);
            letter-spacing: 0.01em;
        }
        .mc-vs {
            display: flex;
            align-items: flex-end;
            justify-content: center;
            padding-bottom: 20px;
            font-family: 'DM Serif Display', serif;
            font-size: 20px;
            color: var(--accent-light);
            display: none;
        }
        .mc-compare-btn {
            width: 100%;
            padding: 16px 24px;
            font-size: 17px;
            font-weight: 600;
            font-family: inherit;
            border: none;
            border-radius: 12px;
            background: var(--green);
            color: white;
            cursor: pointer;
            transition: background 0.2s ease, transform 0.1s ease;
        }
        .mc-compare-btn:hover { background: #4A6A4C; }
        .mc-compare-btn:active { transform: scale(0.985); }
        .mc-compare-btn:disabled {
            background: var(--cream);
            color: var(--text-light);
            cursor: not-allowed;
        }

        /* ─── Loading Skeleton ─── */
        .mc-loading {
            max-width: 900px;
            margin: 0 auto 40px;
            padding: 0 24px;
            display: none;
        }
        .mc-loading.visible { display: block; }
        .mc-skeleton-row {
            display: grid;
            grid-template-columns: 140px 1fr 1fr 80px;
            gap: 16px;
            padding: 20px 0;
            border-bottom: 1px solid var(--cream);
        }
        .mc-skeleton-bar {
            height: 24px;
            background: linear-gradient(90deg, var(--cream) 25%, #ede5da 50%, var(--cream) 75%);
            background-size: 200% 100%;
            border-radius: 8px;
            animation: shimmer 1.5s ease-in-out infinite;
        }
        @keyframes shimmer {
            0% { background-position: 200% 0; }
            100% { background-position: -200% 0; }
        }

        /* ─── Results Area ─── */
        .mc-results {
            max-width: 900px;
            margin: 0 auto;
            padding: 0 24px;
            display: none;
        }
        .mc-results.visible { display: block; }

        .mc-results-header {
            text-align: center;
            margin-bottom: 32px;
        }
        .mc-results-header h2 {
            font-family: 'DM Serif Display', serif;
            font-size: 28px;
            margin-bottom: 8px;
        }
        .mc-results-header p {
            font-size: 15px;
            color: var(--text-light);
            line-height: 1.6;
        }

        /* ─── Comparison Table ─── */
        .mc-table {
            background: white;
            border-radius: 16px;
            box-shadow: 0 4px 24px rgba(0,0,0,0.06);
            overflow: hidden;
            margin-bottom: 32px;
        }
        .mc-table-header {
            display: grid;
            grid-template-columns: 160px 1fr 1fr 90px;
            padding: 16px 24px;
            background: var(--cream);
            font-size: 13px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            color: var(--text-light);
        }
        .mc-table-header span:nth-child(2),
        .mc-table-header span:nth-child(3) {
            text-align: center;
        }
        .mc-table-header span:last-child {
            text-align: center;
        }

        .mc-row {
            display: grid;
            grid-template-columns: 160px 1fr 1fr 90px;
            padding: 20px 24px;
            border-bottom: 1px solid var(--cream);
            align-items: center;
            cursor: pointer;
            transition: background 0.15s ease;
        }
        .mc-row:hover { background: var(--warm-bg); }
        .mc-row:last-child { border-bottom: none; }

        .mc-row-category {
            font-weight: 600;
            font-size: 15px;
            color: var(--text);
            display: flex;
            align-items: center;
            gap: 10px;
        }
        .mc-row-category .mc-icon {
            width: 32px;
            height: 32px;
            border-radius: 8px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 16px;
            flex-shrink: 0;
        }
        .mc-icon.water { background: var(--blue-light); }
        .mc-icon.air { background: var(--coral-light); }
        .mc-icon.pollen { background: var(--yellow-light); }
        .mc-icon.uv { background: #FFF3E0; }

        .mc-row-value {
            text-align: center;
            font-size: 15px;
            color: var(--text);
        }
        .mc-row-value .mc-val-main {
            font-weight: 600;
            font-size: 16px;
        }
        .mc-row-value .mc-val-sub {
            font-size: 13px;
            color: var(--text-light);
            margin-top: 2px;
        }
        .mc-row-value.winner .mc-val-main {
            color: var(--green);
        }
        .mc-row-value.loser .mc-val-main {
            color: var(--coral);
        }

        .mc-row-winner {
            text-align: center;
        }
        .mc-winner-badge {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 28px;
            height: 28px;
            border-radius: 50%;
            font-size: 14px;
            font-weight: 700;
        }
        .mc-winner-badge.win {
            background: var(--green-light);
            color: var(--green);
        }
        .mc-winner-badge.lose {
            background: var(--coral-light);
            color: var(--coral);
        }
        .mc-winner-badge.tie {
            background: var(--yellow-light);
            color: var(--yellow);
        }

        .mc-expand-arrow {
            font-size: 12px;
            color: var(--text-light);
            transition: transform 0.2s ease;
            margin-left: 4px;
        }
        .mc-row.expanded .mc-expand-arrow {
            transform: rotate(180deg);
        }

        /* ─── Expandable Details ─── */
        .mc-details {
            display: none;
            grid-column: 1 / -1;
            padding: 0 24px 20px;
            background: var(--warm-bg);
        }
        .mc-details.visible { display: block; }
        .mc-details-inner {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 16px;
            padding: 20px;
            background: white;
            border-radius: 12px;
        }
        .mc-detail-col h4 {
            font-size: 13px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            color: var(--text-light);
            margin-bottom: 12px;
        }
        .mc-detail-item {
            display: flex;
            justify-content: space-between;
            padding: 6px 0;
            font-size: 14px;
            border-bottom: 1px solid var(--cream);
        }
        .mc-detail-item:last-child { border-bottom: none; }
        .mc-detail-item .label { color: var(--text-light); }
        .mc-detail-item .value { font-weight: 600; color: var(--text); }

        /* ─── Verdict ─── */
        .mc-verdict {
            background: white;
            border-radius: 16px;
            padding: 32px;
            box-shadow: 0 4px 24px rgba(0,0,0,0.06);
            text-align: center;
            margin-bottom: 40px;
        }
        .mc-verdict h3 {
            font-family: 'DM Serif Display', serif;
            font-size: 24px;
            margin-bottom: 12px;
        }
        .mc-verdict p {
            font-size: 15px;
            color: var(--text-light);
            line-height: 1.7;
            max-width: 600px;
            margin: 0 auto;
        }
        .mc-verdict-score {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            margin-top: 16px;
            padding: 10px 24px;
            border-radius: 24px;
            font-size: 15px;
            font-weight: 600;
        }
        .mc-verdict-score.good {
            background: var(--green-light);
            color: var(--green);
        }
        .mc-verdict-score.mixed {
            background: var(--yellow-light);
            color: var(--yellow);
        }
        .mc-verdict-score.bad {
            background: var(--coral-light);
            color: var(--coral);
        }

        /* ─── Share Section ─── */
        .mc-share {
            text-align: center;
            margin-bottom: 40px;
        }
        .mc-share-btn {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            padding: 12px 28px;
            border: 2px solid var(--cream);
            border-radius: 10px;
            background: white;
            color: var(--text);
            font-size: 15px;
            font-weight: 600;
            font-family: inherit;
            cursor: pointer;
            transition: all 0.2s;
        }
        .mc-share-btn:hover {
            border-color: var(--accent);
            color: var(--accent);
        }
        .mc-share-btn.copied {
            border-color: var(--green);
            color: var(--green);
            background: var(--green-light);
        }

        /* ─── Action Recommendations ─── */
        .mc-actions {
            max-width: 900px;
            margin: 0 auto 40px;
            padding: 0 24px;
            display: none;
        }
        .mc-actions.visible { display: block; }
        .mc-action-card {
            background: white;
            border-radius: 12px;
            padding: 24px 28px;
            box-shadow: 0 2px 12px rgba(0,0,0,0.04);
            margin-bottom: 16px;
            display: flex;
            align-items: flex-start;
            gap: 16px;
        }
        .mc-action-icon {
            width: 40px;
            height: 40px;
            border-radius: 10px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 18px;
            flex-shrink: 0;
        }
        .mc-action-icon.warn {
            background: var(--coral-light);
        }
        .mc-action-icon.ok {
            background: var(--green-light);
        }
        .mc-action-content h4 {
            font-size: 16px;
            font-weight: 600;
            margin-bottom: 6px;
            color: var(--text);
        }
        .mc-action-content p {
            font-size: 14px;
            color: var(--text-light);
            line-height: 1.6;
            margin: 0;
        }
        .mc-action-content a {
            color: var(--accent);
            font-weight: 600;
            text-decoration: underline;
            text-underline-offset: 2px;
        }

        /* ─── Error for individual ZIP ─── */
        .mc-zip-error {
            text-align: center;
            padding: 16px;
            background: var(--coral-light);
            border-radius: 10px;
            color: var(--coral);
            font-size: 14px;
            font-weight: 500;
        }

        /* ─── Mobile Responsive ─── */
        @media (max-width: 768px) {
            .mc-hero h1 { font-size: 30px; }
            .mc-input-row {
                grid-template-columns: 1fr;
                gap: 16px;
            }
            .mc-input-box { padding: 28px 20px 24px; margin-left: 16px; margin-right: 16px; }
            .mc-table-header {
                grid-template-columns: 100px 1fr 1fr 60px;
                padding: 12px 16px;
                font-size: 11px;
            }
            .mc-row {
                grid-template-columns: 100px 1fr 1fr 60px;
                padding: 16px;
            }
            .mc-row-category {
                font-size: 13px;
                flex-direction: column;
                gap: 4px;
                text-align: center;
            }
            .mc-row-value .mc-val-main { font-size: 14px; }
            .mc-row-value .mc-val-sub { font-size: 11px; }
            .mc-details-inner {
                grid-template-columns: 1fr;
            }
            .mc-skeleton-row {
                grid-template-columns: 80px 1fr 1fr 50px;
            }
            .mc-verdict { padding: 24px 20px; }
            .mc-action-card { flex-direction: column; }
        }


/* ═══════════════════════════════════════════════════════════════
   Tool: 30-Day Challenge
   ═══════════════════════════════════════════════════════════════ */

    /* ─── 30-Day Challenge Styles ─── */

    .challenge-hero {
        text-align: center;
        padding: 60px 24px 40px;
        max-width: var(--content-width);
        margin: 0 auto;
    }
    .challenge-hero h1 {
        font-family: 'DM Serif Display', serif;
        font-size: clamp(28px, 5vw, 42px);
        color: var(--text);
        margin-bottom: 16px;
        line-height: 1.2;
    }
    .challenge-hero .subtitle {
        font-size: 18px;
        color: var(--text-light);
        line-height: 1.7;
        max-width: 600px;
        margin: 0 auto 28px;
    }
    .challenge-hero .hero-status {
        font-size: 15px;
        color: var(--green);
        font-weight: 600;
        margin-bottom: 20px;
    }
    .btn-start {
        display: inline-block;
        background: var(--accent);
        color: #fff;
        font-size: 16px;
        font-weight: 600;
        padding: 14px 36px;
        border-radius: 8px;
        border: none;
        cursor: pointer;
        transition: background 0.2s, transform 0.15s;
        text-decoration: none;
    }
    .btn-start:hover {
        background: #7A6043;
        color: #fff;
        transform: translateY(-1px);
    }
    .btn-start:active {
        transform: translateY(0);
    }

    /* ─── Progress Section ─── */
    .progress-section {
        max-width: var(--content-width);
        margin: 0 auto 40px;
        padding: 0 24px;
        display: none;
    }
    .progress-section.visible {
        display: block;
    }
    .progress-bar-wrap {
        background: var(--cream);
        border-radius: 12px;
        height: 20px;
        overflow: hidden;
        margin-bottom: 12px;
        position: relative;
    }
    .progress-bar-fill {
        height: 100%;
        border-radius: 12px;
        background: linear-gradient(90deg, #C4A03E, #8BB85C, #5C7A5E);
        transition: width 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
        width: 0%;
        position: relative;
    }
    .progress-bar-fill::after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.15) 50%, transparent 100%);
        animation: shimmer-challenge 2s ease-in-out infinite;
    }
    @keyframes shimmer-challenge {
        0% { transform: translateX(-100%); }
        100% { transform: translateX(100%); }
    }
    .progress-stats {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        gap: 8px;
    }
    .progress-pct {
        font-size: 14px;
        font-weight: 600;
        color: var(--text);
    }
    .streak-badge {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        font-size: 13px;
        font-weight: 600;
        color: var(--accent);
        background: var(--cream);
        padding: 4px 14px;
        border-radius: 20px;
    }
    .streak-badge.fire {
        color: #C4756A;
        background: var(--coral-light);
    }

    /* ─── Stats Cards ─── */
    .stats-section {
        max-width: var(--content-width);
        margin: 0 auto 40px;
        padding: 0 24px;
        display: none;
    }
    .stats-section.visible {
        display: block;
    }
    .stats-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
        gap: 16px;
    }
    .stat-card {
        background: #fff;
        border-radius: 12px;
        padding: 20px;
        text-align: center;
        border: 1px solid rgba(0,0,0,0.06);
    }
    .stat-card .stat-number {
        font-family: 'DM Serif Display', serif;
        font-size: 28px;
        color: var(--text);
        margin-bottom: 4px;
    }
    .stat-card .stat-label {
        font-size: 12px;
        color: var(--text-light);
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    /* ─── Week Headers ─── */
    .week-header {
        max-width: var(--content-width);
        margin: 0 auto;
        padding: 40px 24px 16px;
    }
    .week-header h2 {
        font-family: 'DM Serif Display', serif;
        font-size: 24px;
        color: var(--text);
        margin-bottom: 4px;
    }
    .week-header .week-theme {
        font-size: 14px;
        color: var(--text-light);
    }

    /* ─── Day Cards ─── */
    .days-list {
        max-width: var(--content-width);
        margin: 0 auto;
        padding: 0 24px 16px;
        display: flex;
        flex-direction: column;
        gap: 12px;
    }
    .day-card {
        background: #fff;
        border-radius: 12px;
        border: 2px solid rgba(0,0,0,0.06);
        overflow: hidden;
        transition: border-color 0.3s, box-shadow 0.3s, opacity 0.3s;
    }
    .day-card.muted {
        opacity: 0.6;
    }
    .day-card.muted:hover {
        opacity: 0.85;
    }
    .day-card.current {
        border-color: var(--accent-light);
        box-shadow: 0 2px 16px rgba(139, 111, 78, 0.1);
    }
    .day-card.completed {
        border-color: var(--green-light);
        background: linear-gradient(135deg, #fff 0%, #f5faf5 100%);
        opacity: 1;
    }
    .day-card-header {
        display: flex;
        align-items: center;
        gap: 14px;
        padding: 16px 20px;
        cursor: pointer;
        user-select: none;
    }
    .day-card-header:hover {
        background: rgba(0,0,0,0.01);
    }

    /* Checkbox */
    .day-check {
        position: relative;
        width: 28px;
        height: 28px;
        flex-shrink: 0;
    }
    .day-check input {
        position: absolute;
        opacity: 0;
        width: 100%;
        height: 100%;
        cursor: pointer;
        z-index: 2;
        margin: 0;
    }
    .day-check .checkmark {
        position: absolute;
        top: 0;
        left: 0;
        width: 28px;
        height: 28px;
        border-radius: 50%;
        border: 2px solid #ccc;
        background: #fff;
        transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
    }
    .day-check input:checked ~ .checkmark {
        background: var(--green);
        border-color: var(--green);
    }
    .day-check .checkmark::after {
        content: '';
        position: absolute;
        top: 5px;
        left: 9px;
        width: 6px;
        height: 11px;
        border: solid #fff;
        border-width: 0 2.5px 2.5px 0;
        transform: rotate(45deg) scale(0);
        transition: transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
    }
    .day-check input:checked ~ .checkmark::after {
        transform: rotate(45deg) scale(1);
    }

    /* Pulse animation on check */
    @keyframes checkPulse {
        0% { box-shadow: 0 0 0 0 rgba(92, 122, 94, 0.4); }
        70% { box-shadow: 0 0 0 12px rgba(92, 122, 94, 0); }
        100% { box-shadow: 0 0 0 0 rgba(92, 122, 94, 0); }
    }
    .day-check.pulse .checkmark {
        animation: checkPulse 0.6s ease-out;
    }

    .day-number {
        font-family: 'DM Serif Display', serif;
        font-size: 14px;
        color: var(--text-light);
        min-width: 44px;
        flex-shrink: 0;
    }
    .day-card.completed .day-number {
        color: var(--green);
    }
    .day-title {
        flex: 1;
        font-weight: 600;
        font-size: 15px;
        color: var(--text);
        line-height: 1.4;
    }
    .day-card.completed .day-title {
        color: var(--green);
    }
    .day-meta {
        display: flex;
        align-items: center;
        gap: 10px;
        flex-shrink: 0;
    }
    .day-time {
        font-size: 12px;
        color: var(--text-light);
        background: var(--cream);
        padding: 2px 10px;
        border-radius: 20px;
        white-space: nowrap;
    }
    .day-cost {
        font-size: 12px;
        color: var(--yellow);
        font-weight: 600;
        white-space: nowrap;
    }
    .day-expand {
        width: 20px;
        height: 20px;
        color: var(--text-light);
        transition: transform 0.3s;
        flex-shrink: 0;
    }
    .day-card.expanded .day-expand {
        transform: rotate(180deg);
    }

    /* Expandable detail */
    .day-detail {
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.35s ease, padding 0.35s ease;
        padding: 0 20px;
    }
    .day-card.expanded .day-detail {
        max-height: 300px;
        padding: 0 20px 20px;
    }
    .day-detail-inner {
        font-size: 14px;
        color: var(--text-light);
        line-height: 1.7;
        padding-top: 4px;
        border-top: 1px solid rgba(0,0,0,0.05);
    }
    .day-detail-inner a {
        color: var(--accent);
        font-weight: 500;
        text-decoration: underline;
        text-decoration-color: rgba(139, 111, 78, 0.3);
        text-underline-offset: 2px;
    }
    .day-detail-inner a:hover {
        text-decoration-color: var(--accent);
    }

    /* ─── Share Section ─── */
    .share-section {
        max-width: var(--content-width);
        margin: 0 auto;
        padding: 40px 24px;
        text-align: center;
        display: none;
    }
    .share-section.visible {
        display: block;
    }
    .share-box {
        background: #fff;
        border-radius: 16px;
        padding: 32px;
        border: 1px solid rgba(0,0,0,0.06);
    }
    .share-box h3 {
        font-family: 'DM Serif Display', serif;
        font-size: 22px;
        margin-bottom: 12px;
    }
    .share-text {
        font-size: 14px;
        color: var(--text-light);
        line-height: 1.7;
        margin-bottom: 20px;
        max-width: 500px;
        margin-left: auto;
        margin-right: auto;
    }
    .share-preview {
        background: var(--cream);
        border-radius: 10px;
        padding: 16px 20px;
        font-size: 14px;
        color: var(--text);
        line-height: 1.6;
        margin-bottom: 20px;
        text-align: left;
        max-width: 460px;
        margin-left: auto;
        margin-right: auto;
    }
    .btn-share {
        display: inline-block;
        background: var(--blue);
        color: #fff;
        font-size: 14px;
        font-weight: 600;
        padding: 10px 24px;
        border-radius: 8px;
        border: none;
        cursor: pointer;
        transition: background 0.2s;
    }
    .btn-share:hover {
        background: #3d6a87;
        color: #fff;
    }
    .share-copied {
        display: none;
        font-size: 13px;
        color: var(--green);
        font-weight: 600;
        margin-top: 10px;
    }
    .share-copied.visible {
        display: block;
    }

    /* ─── Celebration Overlay ─── */
    .celebration-overlay {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0,0,0,0.5);
        z-index: 1000;
        justify-content: center;
        align-items: center;
    }
    .celebration-overlay.visible {
        display: flex;
    }
    .celebration-modal {
        background: #fff;
        border-radius: 20px;
        padding: 48px 40px;
        text-align: center;
        max-width: 480px;
        width: 90%;
        position: relative;
        animation: celebPop 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
    }
    @keyframes celebPop {
        0% { transform: scale(0.7); opacity: 0; }
        100% { transform: scale(1); opacity: 1; }
    }
    .celebration-emoji {
        font-size: 64px;
        margin-bottom: 16px;
        animation: celebBounce 1s ease-in-out infinite;
    }
    @keyframes celebBounce {
        0%, 100% { transform: translateY(0); }
        50% { transform: translateY(-10px); }
    }
    .celebration-modal h2 {
        font-family: 'DM Serif Display', serif;
        font-size: 28px;
        margin-bottom: 12px;
    }
    .celebration-modal p {
        font-size: 16px;
        color: var(--text-light);
        line-height: 1.7;
        margin-bottom: 24px;
    }
    .celebration-close {
        background: var(--accent);
        color: #fff;
        font-size: 14px;
        font-weight: 600;
        padding: 12px 28px;
        border-radius: 8px;
        border: none;
        cursor: pointer;
    }

    /* Confetti particles */
    .confetti-container {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        pointer-events: none;
        z-index: 1001;
        overflow: hidden;
    }
    .confetti-piece {
        position: absolute;
        width: 10px;
        height: 10px;
        top: -10px;
        animation: confettiFall 3s linear forwards;
    }
    @keyframes confettiFall {
        0% { transform: translateY(0) rotate(0deg); opacity: 1; }
        100% { transform: translateY(100vh) rotate(720deg); opacity: 0; }
    }

    /* ─── Responsive ─── */
    @media (max-width: 600px) {
        .challenge-hero {
            padding: 40px 20px 32px;
        }
        .challenge-hero .subtitle {
            font-size: 16px;
        }
        .day-card-header {
            padding: 14px 16px;
            gap: 10px;
        }
        .day-title {
            font-size: 14px;
        }
        .day-meta {
            display: none;
        }
        .day-card.expanded .day-detail {
            padding: 0 16px 16px;
        }
        .stats-grid {
            grid-template-columns: 1fr 1fr;
        }
        .celebration-modal {
            padding: 36px 24px;
        }
        .week-header h2 {
            font-size: 20px;
        }
        .share-box {
            padding: 24px 20px;
        }
    }


/* ═══════════════════════════════════════════════════════════════
   Tool: Baby Neuro
   ═══════════════════════════════════════════════════════════════ */

        /* ---- Risk colors ---- */
        .risk-high { background: #FEE8E5; color: #E63E11; }
        .risk-moderate { background: #FFF3E0; color: #EE8100; }
        .risk-low { background: #E8F5E9; color: #038141; }
        .risk-badge {
            display: inline-block;
            font-size: 12px;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            padding: 4px 12px;
            border-radius: 20px;
        }

        /* ---- Category grid ---- */
        .cat-grid {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
            gap: 16px;
            max-width: var(--max-width);
            margin: 0 auto 48px;
            padding: 0 24px;
        }
        .cat-card {
            background: white;
            border-radius: 12px;
            padding: 24px;
            box-shadow: 0 2px 12px rgba(0,0,0,0.04);
            cursor: pointer;
            transition: transform 0.15s, box-shadow 0.15s;
            display: flex;
            flex-direction: column;
            gap: 10px;
            border: 2px solid transparent;
        }
        .cat-card:hover {
            transform: translateY(-2px);
            box-shadow: 0 6px 24px rgba(0,0,0,0.08);
        }
        .cat-card.active {
            border-color: var(--accent);
        }
        .cat-card-top {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
        }
        .cat-icon {
            width: 44px;
            height: 44px;
            border-radius: 10px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 20px;
            flex-shrink: 0;
        }
        .cat-icon.risk-high { background: #FEE8E5; }
        .cat-icon.risk-moderate { background: #FFF3E0; }
        .cat-icon.risk-low { background: #E8F5E9; }
        .cat-card h3 {
            font-family: 'DM Serif Display', serif;
            font-size: 18px;
            line-height: 1.3;
        }
        .cat-card .cat-summary {
            font-size: 14px;
            color: var(--text-light);
            line-height: 1.6;
        }

        /* ---- Category detail ---- */
        .detail-overlay {
            display: none;
            max-width: var(--max-width);
            margin: 0 auto 48px;
            padding: 0 24px;
        }
        .detail-overlay.visible { display: block; }
        .detail-card {
            background: white;
            border-radius: 16px;
            padding: 32px;
            box-shadow: 0 4px 24px rgba(0,0,0,0.06);
        }
        .detail-header {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 16px;
            margin-bottom: 20px;
            flex-wrap: wrap;
        }
        .detail-header h2 {
            font-family: 'DM Serif Display', serif;
            font-size: 28px;
            line-height: 1.2;
        }
        .detail-summary {
            font-size: 16px;
            color: var(--text-light);
            line-height: 1.7;
            margin-bottom: 28px;
        }
        .detail-close {
            background: var(--cream);
            border: none;
            width: 36px;
            height: 36px;
            border-radius: 50%;
            font-size: 18px;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
            color: var(--text-light);
            transition: background 0.2s;
        }
        .detail-close:hover { background: #E8DFD2; }

        .detail-section { margin-bottom: 28px; }
        .detail-section-title {
            font-family: 'DM Serif Display', serif;
            font-size: 20px;
            margin-bottom: 14px;
        }

        /* Expandable concerns */
        .concern-item {
            background: var(--warm-bg);
            border-radius: 10px;
            margin-bottom: 8px;
            overflow: hidden;
        }
        .concern-header {
            padding: 16px 20px;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
            font-weight: 600;
            font-size: 15px;
            color: var(--text);
        }
        .concern-header:hover { background: rgba(0,0,0,0.02); }
        .concern-chevron {
            width: 18px;
            height: 18px;
            flex-shrink: 0;
            transition: transform 0.2s;
            color: var(--text-light);
        }
        .concern-item.open .concern-chevron { transform: rotate(180deg); }
        .concern-body {
            display: none;
            padding: 0 20px 16px;
        }
        .concern-item.open .concern-body { display: block; }
        .concern-detail {
            font-size: 14px;
            color: var(--text-light);
            line-height: 1.7;
            margin-bottom: 10px;
        }
        .concern-source {
            font-size: 13px;
            color: var(--accent);
        }
        .concern-source a { font-size: 13px; }

        /* Check/X lists */
        .check-list, .x-list {
            list-style: none;
            padding: 0;
        }
        .check-list li, .x-list li {
            font-size: 14px;
            line-height: 1.7;
            padding: 6px 0 6px 28px;
            position: relative;
            color: var(--text-light);
        }
        .check-list li::before {
            content: "\2713";
            position: absolute;
            left: 0;
            color: #038141;
            font-weight: 700;
            font-size: 15px;
        }
        .x-list li::before {
            content: "\2717";
            position: absolute;
            left: 0;
            color: #E63E11;
            font-weight: 700;
            font-size: 15px;
        }

        /* Recommended products/brands */
        .rec-mini-grid {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
            gap: 12px;
        }
        .rec-mini-card {
            background: var(--warm-bg);
            border-radius: 10px;
            padding: 18px;
        }
        .rec-mini-card h4 {
            font-size: 15px;
            font-weight: 600;
            margin-bottom: 6px;
        }
        .rec-mini-card p {
            font-size: 13px;
            color: var(--text-light);
            line-height: 1.6;
            margin-bottom: 8px;
        }
        .cert-badge {
            display: inline-block;
            background: #E8F5E9;
            color: #038141;
            font-size: 11px;
            font-weight: 600;
            padding: 3px 8px;
            border-radius: 4px;
            margin: 2px 4px 2px 0;
        }
        .price-tag {
            font-size: 13px;
            font-weight: 600;
            color: var(--accent);
        }

        /* Source citations */
        .source-list {
            list-style: none;
            padding: 0;
        }
        .source-list li {
            font-size: 13px;
            padding: 4px 0;
            color: var(--text-light);
        }
        .source-list li::before {
            content: "\1F4CE ";
        }
        .source-list a {
            font-size: 13px;
            word-break: break-word;
        }

        /* ---- Quick reference table ---- */
        .qr-section {
            max-width: var(--max-width);
            margin: 0 auto 48px;
            padding: 0 24px;
        }
        .qr-section h2 {
            font-family: 'DM Serif Display', serif;
            font-size: 28px;
            text-align: center;
            margin-bottom: 24px;
        }
        .qr-table-wrap {
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            border-radius: 12px;
            box-shadow: 0 2px 12px rgba(0,0,0,0.04);
        }
        .qr-table {
            width: 100%;
            border-collapse: collapse;
            background: white;
            font-size: 14px;
            min-width: 640px;
        }
        .qr-table th {
            text-align: left;
            padding: 14px 16px;
            font-weight: 600;
            font-size: 13px;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            color: var(--text-light);
            border-bottom: 2px solid var(--cream);
            white-space: nowrap;
        }
        .qr-table td {
            padding: 14px 16px;
            border-bottom: 1px solid #f5f0ec;
            color: var(--text);
            line-height: 1.5;
        }
        .qr-table tr:last-child td { border-bottom: none; }
        .qr-table tr:hover td { background: var(--warm-bg); }

        /* ---- Huberman section ---- */
        .huberman-section {
            max-width: var(--max-width);
            margin: 0 auto 48px;
            padding: 0 24px;
        }
        .huberman-section > h2 {
            font-family: 'DM Serif Display', serif;
            font-size: 28px;
            text-align: center;
            margin-bottom: 8px;
        }
        .huberman-subtitle {
            text-align: center;
            font-size: 15px;
            color: var(--text-light);
            margin-bottom: 24px;
        }
        .huberman-grid {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
            gap: 16px;
        }
        .huberman-card {
            background: white;
            border-radius: 12px;
            padding: 24px;
            box-shadow: 0 2px 12px rgba(0,0,0,0.04);
            border-left: 4px solid #7B1FA2;
        }
        .huberman-ep {
            display: inline-block;
            background: #F3E5F5;
            color: #7B1FA2;
            font-size: 12px;
            font-weight: 700;
            padding: 3px 10px;
            border-radius: 4px;
            margin-bottom: 10px;
        }
        .huberman-card h3 {
            font-family: 'DM Serif Display', serif;
            font-size: 17px;
            line-height: 1.3;
            margin-bottom: 8px;
        }
        .huberman-card .hub-relevance {
            font-size: 13px;
            color: var(--text-light);
            line-height: 1.6;
            margin-bottom: 12px;
        }
        .hub-topics {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
        }
        .hub-pill {
            display: inline-block;
            background: #F3E5F5;
            color: #7B1FA2;
            font-size: 11px;
            font-weight: 600;
            padding: 3px 10px;
            border-radius: 20px;
        }
        .hub-link {
            display: inline-block;
            margin-top: 12px;
            font-size: 13px;
            font-weight: 600;
            color: #7B1FA2;
        }
        .hub-link:hover { color: #5E157D; }

        /* ---- Studies section ---- */
        .studies-section {
            max-width: var(--content-width);
            margin: 0 auto 48px;
            padding: 0 24px;
        }
        .studies-section h2 {
            font-family: 'DM Serif Display', serif;
            font-size: 28px;
            text-align: center;
            margin-bottom: 24px;
        }
        .study-card {
            background: white;
            border-radius: 12px;
            padding: 20px 24px;
            margin-bottom: 12px;
            box-shadow: 0 2px 8px rgba(0,0,0,0.03);
        }
        .study-card h4 {
            font-size: 15px;
            font-weight: 600;
            margin-bottom: 4px;
            line-height: 1.4;
        }
        .study-meta {
            font-size: 13px;
            color: var(--text-light);
            margin-bottom: 8px;
        }
        .study-finding {
            font-size: 14px;
            color: var(--text-light);
            line-height: 1.6;
            margin-bottom: 6px;
        }
        .study-link {
            font-size: 13px;
            font-weight: 600;
        }

        /* ---- Certifications guide ---- */
        .cert-section {
            max-width: var(--max-width);
            margin: 0 auto 48px;
            padding: 0 24px;
        }
        .cert-section h2 {
            font-family: 'DM Serif Display', serif;
            font-size: 28px;
            text-align: center;
            margin-bottom: 24px;
        }
        .cert-grid {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
            gap: 16px;
        }
        .cert-card {
            background: white;
            border-radius: 12px;
            padding: 24px;
            box-shadow: 0 2px 12px rgba(0,0,0,0.04);
        }
        .cert-card h3 {
            font-family: 'DM Serif Display', serif;
            font-size: 17px;
            margin-bottom: 8px;
        }
        .cert-card p {
            font-size: 13px;
            color: var(--text-light);
            line-height: 1.6;
            margin-bottom: 10px;
        }
        .cert-card .cert-link {
            font-size: 13px;
            font-weight: 600;
        }
        .cert-tests-for {
            font-size: 12px;
            color: var(--text-light);
            background: var(--warm-bg);
            padding: 8px 12px;
            border-radius: 6px;
            margin-bottom: 10px;
            line-height: 1.5;
        }

        /* ---- Disclaimer ---- */
        .neuro-disclaimer {
            max-width: var(--content-width);
            margin: 0 auto 48px;
            padding: 20px 24px;
            background: var(--warm-bg);
            border-radius: 10px;
            font-size: 13px;
            color: var(--text-light);
            line-height: 1.7;
            text-align: center;
        }

        /* ---- Loading state ---- */
        .neuro-loading {
            text-align: center;
            padding: 60px 24px;
            display: none;
        }
        .neuro-loading.visible { display: block; }
        .neuro-loading .spinner {
            width: 36px;
            height: 36px;
            border: 3px solid var(--cream);
            border-top-color: var(--accent);
            border-radius: 50%;
            animation: spin 0.7s linear infinite;
            margin: 0 auto 16px;
        }
        @keyframes spin { to { transform: rotate(360deg); } }

        .neuro-error {
            text-align: center;
            padding: 40px 24px;
            display: none;
            color: #E63E11;
            font-size: 15px;
        }
        .neuro-error.visible { display: block; }

        /* ---- Section divider ---- */
        .section-divider {
            max-width: var(--max-width);
            margin: 0 auto;
            padding: 0 24px;
        }
        .section-divider hr {
            border: none;
            border-top: 1px solid var(--cream);
            margin-bottom: 48px;
        }

        /* ---- Responsive ---- */
        @media (max-width: 700px) {
            .cat-grid {
                grid-template-columns: 1fr;
                gap: 12px;
            }
            .detail-card { padding: 20px; }
            .detail-header h2 { font-size: 22px; }
            .rec-mini-grid { grid-template-columns: 1fr; }
            .huberman-grid { grid-template-columns: 1fr; }
            .cert-grid { grid-template-columns: 1fr; }
            .qr-section h2,
            .huberman-section > h2,
            .studies-section h2,
            .cert-section h2 { font-size: 24px; }
        }


/* ═══════════════════════════════════════════════════════════════
   Tool: Supplement Stack
   ═══════════════════════════════════════════════════════════════ */

        /* Stack input */
        .stack-input-area { max-width: 700px; margin: 0 auto 40px; }
        .stack-search-wrap { position: relative; margin-bottom: 16px; }
        .stack-search-wrap input {
            width: 100%; padding: 14px 18px; border: 2px solid #e8e4df; border-radius: 12px;
            font-size: 16px; font-family: 'Inter', sans-serif; background: #fff;
            transition: border-color 0.2s;
        }
        .stack-search-wrap input:focus { outline: none; border-color: var(--accent); }
        .stack-dropdown {
            position: absolute; top: 100%; left: 0; right: 0; background: #fff;
            border: 2px solid #e8e4df; border-top: none; border-radius: 0 0 12px 12px;
            max-height: 260px; overflow-y: auto; z-index: 50; display: none;
            box-shadow: 0 8px 24px rgba(0,0,0,0.08);
        }
        .stack-dropdown.open { display: block; }
        .stack-dropdown-item {
            padding: 12px 18px; cursor: pointer; font-size: 15px; color: var(--text);
            border-bottom: 1px solid #f4f1ed; display: flex; justify-content: space-between; align-items: center;
        }
        .stack-dropdown-item:last-child { border-bottom: none; }
        .stack-dropdown-item:hover { background: var(--warm-bg); }
        .stack-dropdown-item.selected { opacity: 0.45; pointer-events: none; }
        .stack-dropdown-form { font-size: 12px; color: var(--text-light); }

        /* Selected chips */
        .stack-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; min-height: 38px; }
        .stack-chip {
            display: inline-flex; align-items: center; gap: 6px;
            background: var(--warm-bg); border: 1px solid #e0dbd5; border-radius: 20px;
            padding: 6px 14px; font-size: 14px; font-weight: 500; color: var(--text);
            animation: chipIn 0.2s ease;
        }
        @keyframes chipIn { from { transform: scale(0.8); opacity: 0; } to { transform: scale(1); opacity: 1; } }
        .stack-chip button {
            background: none; border: none; cursor: pointer; color: var(--text-light);
            font-size: 16px; line-height: 1; padding: 0; display: flex;
        }
        .stack-chip button:hover { color: var(--coral); }
        .stack-check-btn { display: block; margin: 0 auto; min-width: 200px; }

        /* Results area */
        #results-area { display: none; max-width: 900px; margin: 0 auto 40px; }
        #results-area.visible { display: block; }

        /* Timing schedule */
        .timing-schedule { margin-bottom: 40px; }
        .timing-block {
            background: #fff; border-radius: 12px; padding: 20px 24px; margin-bottom: 12px;
            box-shadow: 0 2px 12px rgba(0,0,0,0.04); border-left: 5px solid #ccc;
        }
        .timing-block.time-morning { border-left-color: #F9D77E; background: linear-gradient(135deg, #FFFCF0, #fff); }
        .timing-block.time-midday { border-left-color: #FBB87A; background: linear-gradient(135deg, #FFF8F0, #fff); }
        .timing-block.time-afternoon { border-left-color: #F4A68C; background: linear-gradient(135deg, #FFF5F0, #fff); }
        .timing-block.time-evening { border-left-color: #9CB4D8; background: linear-gradient(135deg, #F0F4FB, #fff); }
        .timing-block.time-bedtime { border-left-color: #B39DDB; background: linear-gradient(135deg, #F5F0FF, #fff); }
        .timing-label {
            font-family: 'DM Serif Display', serif; font-size: 18px; color: var(--text);
            margin-bottom: 8px; display: flex; align-items: center; gap: 8px;
        }
        .timing-label .timing-icon { font-size: 20px; }
        .timing-supps { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 6px; }
        .timing-pill {
            background: rgba(255,255,255,0.7); border: 1px solid rgba(0,0,0,0.08);
            padding: 4px 12px; border-radius: 16px; font-size: 13px; font-weight: 500; color: var(--text);
        }
        .timing-note { font-size: 13px; color: var(--text-light); line-height: 1.5; margin-top: 6px; }

        /* Interactions */
        .interactions-section { margin-bottom: 40px; }
        .interaction-card {
            background: #fff; border-radius: 12px; padding: 20px 24px; margin-bottom: 12px;
            box-shadow: 0 2px 12px rgba(0,0,0,0.04); border-left: 5px solid #ccc;
        }
        .interaction-card.synergy { border-left-color: #038141; }
        .interaction-card.conflict { border-left-color: #EE8100; }
        .interaction-card.dangerous { border-left-color: #E63E11; background: #FFF5F3; }
        .interaction-pair {
            font-weight: 600; font-size: 16px; color: var(--text); margin-bottom: 4px;
            display: flex; align-items: center; gap: 8px;
        }
        .interaction-badge {
            font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px;
            padding: 2px 10px; border-radius: 10px; display: inline-block;
        }
        .badge-synergy { background: #E8F5E9; color: #038141; }
        .badge-conflict { background: #FFF3E0; color: #EE8100; }
        .badge-danger { background: #FFEBEE; color: #E63E11; }
        .interaction-effect { font-size: 14px; color: var(--text-light); line-height: 1.6; margin-bottom: 4px; }
        .interaction-rec { font-size: 14px; color: var(--text); font-weight: 500; }

        /* Danger box */
        .danger-box {
            background: #FFF5F3; border: 2px solid #E63E11; border-radius: 12px;
            padding: 24px; margin-bottom: 40px;
        }
        .danger-box h3 { color: #E63E11; margin-bottom: 12px; display: flex; align-items: center; gap: 8px; }

        /* Supplement cards */
        .supp-cards { display: grid; grid-template-columns: 1fr; gap: 16px; margin-bottom: 40px; }
        .supp-card {
            background: #fff; border-radius: 12px; padding: 24px; box-shadow: 0 2px 12px rgba(0,0,0,0.04);
        }
        .supp-card-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 12px; }
        .supp-card-name { font-family: 'DM Serif Display', serif; font-size: 22px; color: var(--text); }
        .supp-card-form { font-size: 13px; color: var(--accent); font-weight: 600; margin-top: 2px; }
        .supp-card-timing {
            background: var(--warm-bg); padding: 6px 12px; border-radius: 8px; font-size: 13px;
            color: var(--text); font-weight: 500; white-space: nowrap;
        }
        .supp-card-benefits { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
        .benefit-pill {
            padding: 3px 10px; border-radius: 12px; font-size: 12px; font-weight: 500;
            background: #E8F5E9; color: #2E7D32;
        }
        .benefit-pill:nth-child(2n) { background: #E3F2FD; color: #1565C0; }
        .benefit-pill:nth-child(3n) { background: #FFF3E0; color: #E65100; }
        .benefit-pill:nth-child(5n) { background: #F3E5F5; color: #6A1B9A; }
        .supp-card-dose { font-size: 14px; color: var(--text-light); line-height: 1.6; margin-bottom: 8px; }
        .supp-card-caution {
            background: #FFF8E1; border-radius: 8px; padding: 10px 14px;
            font-size: 13px; color: #8D6E00; line-height: 1.5;
        }
        .supp-card-caution strong { color: #6D5200; }

        /* Browse grid */
        .browse-grid {
            display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
            gap: 16px; margin-bottom: 40px;
        }
        .browse-card {
            background: #fff; border-radius: 12px; padding: 20px; cursor: pointer;
            box-shadow: 0 2px 12px rgba(0,0,0,0.04); transition: transform 0.15s, box-shadow 0.15s;
            border: 2px solid transparent;
        }
        .browse-card:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0,0,0,0.08); }
        .browse-card.is-selected { border-color: var(--accent); background: #FBF8F4; }
        .browse-card-name { font-family: 'DM Serif Display', serif; font-size: 18px; color: var(--text); margin-bottom: 4px; }
        .browse-card-form { font-size: 13px; color: var(--accent); font-weight: 500; margin-bottom: 8px; }
        .browse-card-timing { font-size: 12px; color: var(--text-light); display: flex; align-items: center; gap: 4px; }

        /* Expert tabs */
        .expert-tabs { display: flex; gap: 8px; margin-bottom: 20px; flex-wrap: wrap; }
        .expert-tab {
            padding: 10px 20px; border-radius: 20px; border: 2px solid #e0dbd5;
            background: #fff; cursor: pointer; font-size: 14px; font-weight: 600;
            color: var(--text-light); transition: all 0.2s;
        }
        .expert-tab.active { border-color: var(--accent); background: var(--warm-bg); color: var(--text); }
        .expert-panel { display: none; }
        .expert-panel.active { display: block; }
        .expert-panel-inner {
            background: #fff; border-radius: 12px; padding: 28px; box-shadow: 0 2px 12px rgba(0,0,0,0.04);
        }
        .expert-philosophy {
            font-size: 15px; color: var(--text-light); line-height: 1.7;
            border-left: 3px solid var(--accent); padding-left: 16px; margin-bottom: 20px;
            font-style: italic;
        }
        .expert-supp-list { list-style: none; padding: 0; }
        .expert-supp-list li {
            padding: 12px 0; border-bottom: 1px solid #f4f1ed;
            font-size: 14px; line-height: 1.6; color: var(--text);
        }
        .expert-supp-list li:last-child { border-bottom: none; }
        .expert-supp-list li strong { color: var(--text); }
        .expert-supp-list li .expert-dose { color: var(--text-light); font-size: 13px; }

        /* Brand tiers */
        .brand-tier { margin-bottom: 24px; }
        .brand-tier-header {
            font-family: 'DM Serif Display', serif; font-size: 20px; margin-bottom: 12px;
            display: flex; align-items: center; gap: 8px;
        }
        .brand-tier-header.tier-top { color: #038141; }
        .brand-tier-header.tier-good { color: #1565C0; }
        .brand-tier-header.tier-avoid { color: #E63E11; }
        .brand-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; }
        .brand-item {
            background: #fff; border-radius: 10px; padding: 16px; box-shadow: 0 2px 8px rgba(0,0,0,0.03);
        }
        .brand-item-name { font-weight: 600; font-size: 15px; color: var(--text); margin-bottom: 4px; }
        .brand-item-why { font-size: 13px; color: var(--text-light); line-height: 1.5; }
        .brand-item-certs { font-size: 12px; color: var(--accent); font-weight: 500; margin-top: 6px; }
        .cert-guide { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; margin-top: 20px; }
        .cert-item {
            background: #fff; border-radius: 10px; padding: 16px; box-shadow: 0 2px 8px rgba(0,0,0,0.03);
        }
        .cert-item-name { font-weight: 600; font-size: 14px; color: var(--text); margin-bottom: 4px; }
        .cert-item-what { font-size: 13px; color: var(--text-light); line-height: 1.5; }
        .cert-trust {
            display: inline-block; margin-top: 6px; font-size: 11px; font-weight: 600;
            text-transform: uppercase; letter-spacing: 0.5px; padding: 2px 8px; border-radius: 8px;
        }
        .cert-trust.gold { background: #FFF8E1; color: #8D6E00; }
        .cert-trust.high { background: #E3F2FD; color: #1565C0; }
        .cert-trust.baseline { background: #F5F5F5; color: #666; }

        /* Life stage accordion */
        .life-stage-item {
            background: #fff; border-radius: 12px; margin-bottom: 12px;
            box-shadow: 0 2px 12px rgba(0,0,0,0.04); overflow: hidden;
        }
        .life-stage-summary {
            padding: 20px 24px; cursor: pointer; font-size: 17px; font-weight: 600;
            color: var(--text); list-style: none; display: flex; justify-content: space-between; align-items: center;
        }
        .life-stage-summary::after {
            content: '+'; font-size: 22px; color: var(--text-light); transition: transform 0.2s;
        }
        .life-stage-item[open] .life-stage-summary::after { content: '-'; }
        .life-stage-body { padding: 0 24px 20px; }
        .life-stage-essential { margin-bottom: 16px; }
        .life-stage-label {
            font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px;
            color: #038141; margin-bottom: 8px;
        }
        .life-stage-label.optional-label { color: var(--text-light); }
        .ls-item { font-size: 14px; color: var(--text); line-height: 1.6; margin-bottom: 8px; }
        .ls-item strong { font-weight: 600; }
        .ls-item .ls-dose { color: var(--text-light); font-size: 13px; }

        /* Disclaimer */
        .medical-disclaimer {
            max-width: 700px; margin: 40px auto; padding: 20px 24px; background: #FFF8E1;
            border-radius: 12px; font-size: 13px; color: #6D5200; line-height: 1.6; text-align: center;
        }

        /* Section titles */
        .section-title-tool {
            font-family: 'DM Serif Display', serif; font-size: 28px; color: var(--text);
            margin-bottom: 8px;
        }
        .section-subtitle-tool {
            font-size: 15px; color: var(--text-light); line-height: 1.6; margin-bottom: 24px;
        }
        .section-block { max-width: 900px; margin: 0 auto 48px; padding: 0 20px; }

        /* Responsive */
        @media (max-width: 768px) {
            .browse-grid { grid-template-columns: 1fr 1fr; }
            .brand-list { grid-template-columns: 1fr; }
            .cert-guide { grid-template-columns: 1fr; }
            .supp-card-header { flex-direction: column; }
            .supp-card-timing { margin-top: 8px; }
        }
        @media (max-width: 480px) {
            .browse-grid { grid-template-columns: 1fr; }
            .expert-tabs { gap: 6px; }
            .expert-tab { padding: 8px 14px; font-size: 13px; }
        }


/* ═══════════════════════════════════════════════════════════════
   Tool: Baby Wellness
   ═══════════════════════════════════════════════════════════════ */

        /* Age dropdown selector */
        .age-dropdown-wrapper {
            max-width: 480px; margin: 0 auto 32px; padding: 0 20px; text-align: center;
        }
        .age-dropdown-label {
            font-family: 'DM Serif Display', serif; font-size: 22px; color: var(--text);
            margin-bottom: 16px; display: block;
        }
        .age-select-container {
            position: relative; display: inline-block; width: 100%; max-width: 340px;
        }
        .age-select {
            width: 100%; padding: 14px 48px 14px 20px; border: 2px solid var(--cream);
            border-radius: 12px; background: #fff; font-size: 16px; font-weight: 600;
            color: var(--text); font-family: 'Inter', -apple-system, sans-serif;
            cursor: pointer; transition: all 0.2s; appearance: none; -webkit-appearance: none;
            box-shadow: 0 2px 12px rgba(0,0,0,0.04);
        }
        .age-select:hover { border-color: var(--accent-light); }
        .age-select:focus { outline: none; border-color: var(--accent); box-shadow: 0 2px 12px rgba(139,111,78,0.12); }
        .age-select-arrow {
            position: absolute; right: 16px; top: 50%; transform: translateY(-50%);
            pointer-events: none; color: var(--accent); transition: transform 0.2s;
        }
        .age-select-container.open .age-select-arrow { transform: translateY(-50%) rotate(180deg); }

        /* Age subtitle */
        .age-subtitle {
            text-align: center; font-size: 15px; color: var(--text-light);
            margin: -16px auto 24px; max-width: 600px;
            opacity: 0; transform: translateY(-8px);
            transition: opacity 0.3s ease, transform 0.3s ease;
        }
        .age-subtitle.visible { opacity: 1; transform: translateY(0); }

        /* Content reveal wrapper - hidden by default */
        .bw-content-area {
            opacity: 0; transform: translateY(16px);
            transition: opacity 0.4s ease, transform 0.4s ease;
            pointer-events: none; max-height: 0; overflow: hidden;
        }
        .bw-content-area.revealed {
            opacity: 1; transform: translateY(0);
            pointer-events: auto; max-height: none; overflow: visible;
        }

        /* Category tabs */
        .cat-tabs {
            display: flex; gap: 0; justify-content: center; margin: 0 auto 32px;
            max-width: 700px; border-bottom: 2px solid #e8e4df;
        }
        .cat-tab {
            padding: 12px 20px; border: none; border-bottom: 3px solid transparent;
            background: none; cursor: pointer; font-size: 14px; font-weight: 600;
            color: var(--text-light); transition: all 0.2s; font-family: inherit;
            margin-bottom: -2px;
        }
        .cat-tab:hover { color: var(--text); }
        .cat-tab.active { color: var(--accent); border-bottom-color: var(--accent); }

        /* Expert filter pills */
        .expert-filter {
            display: flex; flex-wrap: wrap; gap: 8px; justify-content: center;
            margin: 0 auto 24px; max-width: 700px; padding: 0 20px;
        }
        .expert-pill {
            display: flex; align-items: center; gap: 6px;
            padding: 8px 16px; border-radius: 24px; border: 2px solid #e0dbd5;
            background: #fff; cursor: pointer; font-size: 13px; font-weight: 600;
            color: var(--text-light); transition: all 0.2s; font-family: inherit;
            white-space: nowrap;
        }
        .expert-pill:hover { border-color: var(--accent-light); color: var(--text); }
        .expert-pill.active { border-color: var(--accent); background: var(--accent); color: #fff; }
        .expert-pill .expert-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
        .expert-pill.active .expert-dot { background: #fff !important; }
        .expert-filter-label {
            width: 100%; text-align: center; font-size: 14px; color: var(--text-light);
            margin-bottom: 4px; font-weight: 500;
        }

        /* Perspective legend - hidden when expert filter is shown */
        .perspective-legend {
            display: none;
        }
        .legend-item { display: flex; align-items: center; gap: 6px; }
        .legend-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }

        /* Topic cards */
        .topic-cards { max-width: 900px; margin: 0 auto 40px; padding: 0 20px; }
        .topic-card {
            background: #fff; border-radius: 12px; padding: 28px 32px;
            box-shadow: 0 2px 12px rgba(0,0,0,0.04); margin-bottom: 20px;
        }
        .topic-card-header {
            font-family: 'DM Serif Display', serif; font-size: 24px; color: var(--text);
            margin-bottom: 12px;
        }

        /* Consensus bar */
        .consensus-bar {
            background: #E8F5E9; border-radius: 8px; padding: 12px 16px;
            font-size: 14px; color: #2E7D32; line-height: 1.6; margin-bottom: 20px;
            font-style: italic; border-left: 4px solid #4CAF50;
        }

        /* Perspective grid */
        .perspectives-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }
        .perspective-block {
            padding: 16px; border-radius: 10px; background: var(--warm-bg);
            border-left: 4px solid #ccc;
        }
        .perspective-name {
            font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.4px;
            margin-bottom: 8px; display: flex; align-items: center; gap: 6px;
        }
        .perspective-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
        .perspective-rec { font-size: 14px; color: var(--text); line-height: 1.6; margin-bottom: 8px; }
        .perspective-dose {
            font-size: 13px; color: var(--accent); font-weight: 600; margin-bottom: 6px;
        }
        .perspective-reasoning {
            font-size: 13px; color: var(--text-light); line-height: 1.5; margin-bottom: 6px;
        }
        .perspective-source {
            font-size: 11px; color: var(--accent-light); line-height: 1.4;
        }

        /* Warning strip */
        .warnings-strip {
            background: #FFF8E1; border-radius: 8px; padding: 12px 16px;
            margin-top: 16px; border-left: 4px solid #FFB300;
        }
        .warnings-strip-title {
            font-size: 13px; font-weight: 700; color: #8D6E00; margin-bottom: 6px;
            text-transform: uppercase; letter-spacing: 0.3px;
        }
        .warnings-strip ul {
            list-style: none; padding: 0; margin: 0;
        }
        .warnings-strip li {
            font-size: 13px; color: #6D5200; line-height: 1.5; margin-bottom: 4px;
            padding-left: 16px; position: relative;
        }
        .warnings-strip li::before {
            content: '\26A0'; position: absolute; left: 0; font-size: 11px;
        }

        /* Product pills */
        .product-recs { margin-top: 16px; }
        .product-recs-title {
            font-size: 13px; font-weight: 700; color: var(--green); margin-bottom: 8px;
            text-transform: uppercase; letter-spacing: 0.3px;
        }
        .product-pill-list { display: flex; flex-direction: column; gap: 8px; }
        .product-pill {
            background: #E8F5E9; border-radius: 8px; padding: 12px 16px;
            display: flex; justify-content: space-between; align-items: flex-start; gap: 12px;
        }
        .product-pill-info { flex: 1; min-width: 0; }
        .product-pill-name { font-size: 14px; font-weight: 600; color: var(--text); }
        .product-pill-dose { font-size: 12px; color: var(--text-light); margin-top: 2px; }
        .product-pill-why { font-size: 12px; color: var(--text-light); margin-top: 4px; line-height: 1.4; }
        .product-pill-link {
            flex-shrink: 0; align-self: center;
            font-size: 12px; font-weight: 600; color: #fff; background: var(--green);
            padding: 6px 14px; border-radius: 6px; text-decoration: none;
            transition: background 0.2s; white-space: nowrap;
        }
        .product-pill-link:hover { background: #4A6A4C; color: #fff; }

        /* Rice warning */
        .rice-warning-box {
            max-width: 900px; margin: 0 auto 32px; padding: 0 20px;
        }
        .rice-warning-card {
            background: #FFF5F3; border: 2px solid var(--coral); border-radius: 12px;
            padding: 28px 32px;
        }
        .rice-warning-card h3 {
            font-family: 'DM Serif Display', serif; font-size: 22px; color: var(--coral);
            margin-bottom: 12px;
        }
        .rice-warning-card ul {
            list-style: none; padding: 0; margin: 0 0 16px;
        }
        .rice-warning-card li {
            font-size: 14px; color: var(--text); line-height: 1.6; margin-bottom: 6px;
            padding-left: 20px; position: relative;
        }
        .rice-warning-card li::before {
            content: '\2716'; position: absolute; left: 0; color: var(--coral); font-size: 12px;
        }
        .rice-alts-title {
            font-size: 14px; font-weight: 700; color: var(--green); margin-bottom: 8px;
        }
        .rice-alts-list { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
        .rice-alt-chip {
            background: #E8F5E9; color: #2E7D32; padding: 4px 12px; border-radius: 14px;
            font-size: 13px; font-weight: 500;
        }
        .rice-sources { font-size: 11px; color: var(--text-light); line-height: 1.5; }
        .rice-sources a { color: var(--text-light); text-decoration: underline; }

        /* Medical disclaimer */
        .medical-disclaimer {
            max-width: 700px; margin: 40px auto; padding: 20px 24px; background: #FFF8E1;
            border-radius: 12px; font-size: 13px; color: #6D5200; line-height: 1.6; text-align: center;
        }

        /* Loading and empty states */
        .bw-loading { text-align: center; padding: 60px 20px; color: var(--text-light); font-size: 15px; }
        .bw-empty { text-align: center; padding: 40px 20px; color: var(--text-light); font-size: 15px; }

        /* Prompt text below dropdown before selection */
        .bw-prompt {
            text-align: center; max-width: 400px; margin: 0 auto 32px;
            padding: 32px 24px; color: var(--text-light); font-size: 15px; line-height: 1.6;
        }
        .bw-prompt-icon { font-size: 36px; margin-bottom: 12px; display: block; }

        /* Responsive */
        @media (max-width: 768px) {
            .perspectives-grid { grid-template-columns: 1fr; }
            .cat-tab { padding: 10px 14px; font-size: 13px; }
            .topic-card { padding: 20px; }
            .topic-card-header { font-size: 20px; }
            .perspective-legend { gap: 10px; font-size: 12px; }
            .age-dropdown-label { font-size: 20px; }
            .age-select { font-size: 16px; padding: 12px 44px 12px 16px; }
            .expert-pill { padding: 6px 12px; font-size: 12px; }
            .expert-filter-label { font-size: 13px; }
        }
        @media (max-width: 480px) {
            .cat-tabs { gap: 0; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
            .cat-tabs::-webkit-scrollbar { display: none; }
            .cat-tab { padding: 8px 12px; font-size: 12px; white-space: nowrap; flex-shrink: 0; }
            .product-pill { flex-direction: column; align-items: stretch; }
            .product-pill-link { align-self: flex-start; }
            .age-dropdown-label { font-size: 18px; }
            .expert-filter { gap: 6px; }
            .expert-pill { padding: 5px 10px; font-size: 11px; }
        }


/* ═══════════════════════════════════════════════════════════════
   Tool: Baby Food Safety
   ═══════════════════════════════════════════════════════════════ */

        .risk-badge {
            display: inline-block;
            font-size: 12px;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            padding: 4px 12px;
            border-radius: 12px;
        }
        .risk-badge.risk-high { background: #FEE8E5; color: #E63E11; }
        .risk-badge.risk-moderate { background: #FFF3E0; color: #EE8100; }
        .risk-badge.risk-low { background: #E8F5E9; color: #038141; }

        .metal-pill {
            display: inline-block;
            font-size: 11px;
            font-weight: 600;
            padding: 3px 10px;
            border-radius: 10px;
            color: white;
            margin: 2px 2px;
            cursor: pointer;
            transition: opacity 0.2s;
        }
        .metal-pill:hover { opacity: 0.85; }
        .metal-pill.metal-arsenic { background: #E63E11; }
        .metal-pill.metal-lead { background: #5C6BC0; }
        .metal-pill.metal-cadmium { background: #EE8100; }
        .metal-pill.metal-mercury { background: #7B1FA2; }

        .brand-grid-card {
            background: white;
            border-radius: 12px;
            padding: 24px;
            box-shadow: 0 2px 12px rgba(0,0,0,0.04);
            cursor: pointer;
            transition: all 0.2s;
        }
        .brand-grid-card:hover {
            box-shadow: 0 4px 20px rgba(0,0,0,0.08);
            transform: translateY(-2px);
        }
        .brand-grid-card h3 {
            font-size: 16px;
            font-weight: 600;
            margin: 8px 0 4px;
            color: var(--text);
        }
        .brand-grid-card .brand-manufacturer {
            font-size: 13px;
            color: var(--text-light);
            margin-bottom: 10px;
        }
        .brand-grid-card .brand-metals {
            margin-top: 8px;
        }

        .brand-detail-card {
            background: white;
            border-radius: 16px;
            padding: 36px;
            box-shadow: 0 4px 24px rgba(0,0,0,0.06);
        }
        .brand-detail-card h2 {
            font-family: 'DM Serif Display', serif;
            font-size: 28px;
            margin: 12px 0 4px;
        }
        .brand-detail-card .brand-detail-manufacturer {
            font-size: 15px;
            color: var(--text-light);
            margin-bottom: 20px;
        }
        .brand-detail-card .brand-detail-section {
            margin-bottom: 20px;
        }
        .brand-detail-card .brand-detail-section h4 {
            font-size: 14px;
            font-weight: 600;
            color: var(--text);
            margin-bottom: 6px;
            text-transform: uppercase;
            letter-spacing: 0.3px;
        }
        .brand-detail-card .brand-detail-section p,
        .brand-detail-card .brand-detail-section ul {
            font-size: 15px;
            color: var(--text-light);
            line-height: 1.7;
            margin: 0;
        }
        .brand-detail-card .brand-detail-section ul {
            padding-left: 20px;
        }
        .brand-detail-card .brand-detail-section li {
            margin-bottom: 4px;
        }
        .brand-detail-metals {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
            margin-top: 4px;
        }
        .brand-detail-year {
            font-size: 13px;
            color: var(--text-light);
            margin-top: 16px;
            padding-top: 16px;
            border-top: 1px solid var(--cream);
        }

        .metal-info-card {
            background: white;
            border-radius: 12px;
            padding: 24px;
            box-shadow: 0 2px 12px rgba(0,0,0,0.04);
        }
        .metal-info-card .metal-icon {
            font-size: 24px;
            margin-bottom: 8px;
        }
        .metal-info-card h3 {
            font-size: 16px;
            font-weight: 600;
            margin-bottom: 8px;
        }
        .metal-info-card .metal-limit {
            font-size: 13px;
            font-weight: 600;
            color: var(--accent);
            margin-bottom: 8px;
        }
        .metal-info-card p {
            font-size: 13px;
            color: var(--text-light);
            line-height: 1.6;
            margin-bottom: 6px;
        }
        .metal-info-card .metal-sources {
            font-size: 12px;
            color: var(--accent-light);
        }

        .ingredient-risk-item {
            display: flex;
            align-items: flex-start;
            gap: 16px;
            padding: 16px 20px;
            border-radius: 12px;
            margin-bottom: 12px;
        }
        .ingredient-risk-item.risk-bg-high { background: #FEE8E5; }
        .ingredient-risk-item.risk-bg-moderate { background: #FFF3E0; }
        .ingredient-risk-item.risk-bg-low-moderate { background: #FFF8E1; }
        .ingredient-risk-item.risk-bg-low { background: #E8F5E9; }
        .ingredient-risk-item .ingredient-risk-name {
            font-size: 16px;
            font-weight: 600;
            color: var(--text);
            margin-bottom: 4px;
        }
        .ingredient-risk-item .ingredient-risk-note {
            font-size: 14px;
            color: var(--text-light);
            line-height: 1.6;
        }
        .ingredient-risk-item .ingredient-risk-metals {
            margin-top: 6px;
        }

        .tip-item {
            display: flex;
            align-items: flex-start;
            gap: 12px;
            padding: 12px 0;
            border-bottom: 1px solid var(--cream);
        }
        .tip-item:last-child { border-bottom: none; }
        .tip-check {
            width: 24px;
            height: 24px;
            border-radius: 50%;
            background: var(--green-light);
            color: var(--green);
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
            font-size: 14px;
            font-weight: 700;
            margin-top: 2px;
        }
        .tip-text {
            font-size: 15px;
            color: var(--text-light);
            line-height: 1.7;
        }

        .metal-expand {
            display: none;
            margin-top: 8px;
            padding: 10px 14px;
            background: var(--warm-bg);
            border-radius: 8px;
            font-size: 13px;
            color: var(--text-light);
            line-height: 1.6;
        }
        .metal-expand.open { display: block; }

        @media (max-width: 768px) {
            .brand-detail-card { padding: 24px 20px; }
            .brand-detail-card h2 { font-size: 22px; }
        }


/* ═══════════════════════════════════════════════════════════════
   Tool: Pesticide Lookup
   ═══════════════════════════════════════════════════════════════ */

        @media (max-width: 600px) {
            .pesticide-grid {
                grid-template-columns: 1fr !important;
            }
        }
        .list-item {
            display: flex;
            align-items: center;
            gap: 12px;
            padding: 10px 0;
            border-bottom: 1px solid #f0eded;
            transition: background 0.2s;
        }
        .list-item:last-child {
            border-bottom: none;
        }
        .list-item.highlighted {
            background: #FFFDE7;
            margin: 0 -12px;
            padding: 10px 12px;
            border-radius: 8px;
        }
        .list-rank {
            width: 28px;
            height: 28px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 13px;
            font-weight: 600;
            flex-shrink: 0;
        }
        .list-rank-dirty {
            background: #FEE;
            color: #E63E11;
        }
        .list-rank-clean {
            background: #E8F5E9;
            color: #038141;
        }
        .list-name {
            flex: 1;
            font-size: 15px;
            font-weight: 500;
            color: var(--text);
        }
        .list-stat {
            font-size: 13px;
            color: var(--text-light);
            white-space: nowrap;
        }
        .tip-item {
            background: white;
            border-radius: 10px;
            padding: 16px 20px;
            margin-bottom: 12px;
            box-shadow: 0 2px 8px rgba(0,0,0,0.04);
            display: flex;
            align-items: flex-start;
            gap: 12px;
            font-size: 15px;
            line-height: 1.6;
            color: var(--text-light);
        }
        .tip-icon {
            flex-shrink: 0;
            width: 28px;
            height: 28px;
            border-radius: 50%;
            background: var(--warm-bg);
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 14px;
        }
        .pesticide-result { background: white; border-radius: 12px; padding: 28px; box-shadow: 0 2px 12px rgba(0,0,0,0.08); }
        .pesticide-result.dirty { border-left: 6px solid #E63E11; }
        .pesticide-result.clean { border-left: 6px solid #C4A03E; }
        .pesticide-result.not-found { border-left: 6px solid #C4A03E; }
        .pesticide-result .result-header { display: flex; align-items: center; gap: 16px; margin-bottom: 16px; }
        .pesticide-result .result-icon { width: 56px; height: 56px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 28px; }
        .pesticide-result .result-icon.dirty-icon { background: #FEE; }
        .pesticide-result .result-icon.clean-icon { background: #FFFDE7; }
        .pesticide-result h3 { margin: 0; font-size: 22px; }
        .pesticide-result .result-subtitle { font-size: 14px; font-weight: 600; margin-top: 2px; }
        .pesticide-result .result-subtitle.dirty-sub { color: #E63E11; }
        .pesticide-result .result-subtitle.clean-sub { color: #C4A03E; }
        .pesticide-result p { color: var(--text-light); line-height: 1.6; margin-bottom: 16px; }
        .pesticide-result .stats-row { display: flex; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
        .pesticide-result .stat-box { border-radius: 8px; padding: 12px 16px; flex: 1; text-align: center; min-width: 100px; }
        .pesticide-result .stat-box.dirty-stat { background: #FEE; }
        .pesticide-result .stat-box.clean-stat { background: #FFFDE7; }
        .pesticide-result .stat-value { font-size: 24px; font-weight: 700; }
        .pesticide-result .stat-value.dirty-val { color: #E63E11; }
        .pesticide-result .stat-value.clean-val { color: #C4A03E; }
        .pesticide-result .stat-label { font-size: 12px; color: var(--text-light); }
        .pesticide-tag { display: inline-block; font-size: 12px; background: #FEE; color: #E63E11; padding: 4px 10px; border-radius: 4px; font-weight: 500; margin: 0 6px 6px 0; }
        .pesticide-result .info-box { border-radius: 8px; padding: 14px 16px; margin-bottom: 12px; }
        .pesticide-result .info-box.health { background: #FFF8F6; }
        .pesticide-result .info-box.why-lower { background: #F1F8F3; }
        .pesticide-result .info-box.still-organic { background: #FFF8F6; }
        .pesticide-result .info-box.gmo { background: #FFF3E0; }
        .pesticide-result .info-box.not-found-tip { background: #FFFDE7; }
        .pesticide-result .info-box-title { font-size: 13px; font-weight: 600; margin-bottom: 4px; }
        .pesticide-result .info-box-title.health-title { color: #E63E11; }
        .pesticide-result .info-box-title.green-title { color: #038141; }
        .pesticide-result .info-box-title.warn-title { color: #EE8100; }
        .pesticide-result .info-box p { font-size: 14px; color: var(--text-light); line-height: 1.6; margin: 0; }
        .pesticide-result .cta-box { color: white; line-height: 1.6; font-size: 14px; padding: 12px 16px; border-radius: 8px; margin: 0; font-weight: 500; }
        .pesticide-result .cta-box.dirty-cta { background: #E63E11; }
        .pesticide-result .cta-box.clean-cta { background: #C4A03E; }
        .pesticide-result .pesticide-tags { margin-bottom: 16px; }
        .pesticide-result .pesticide-tags-label { font-size: 13px; font-weight: 600; color: var(--text); margin-bottom: 8px; }
        .pesticide-result .pesticide-tags-wrap { display: flex; flex-wrap: wrap; gap: 6px; }


/* ═══════════════════════════════════════════════════════════════
   Tool: Food Scanner
   ═══════════════════════════════════════════════════════════════ */

        .scan-results { max-width: 700px; margin: 0 auto; }
        .scan-verdict { text-align: center; margin-bottom: 24px; }
        .scan-verdict h2 { font-size: 24px; margin-bottom: 8px; }
        .scan-verdict p { color: var(--text-light); font-size: 15px; }
        .scan-verdict .verdict-icon { margin-bottom: 12px; }
        .scan-verdict .verdict-product { font-size: 14px; color: var(--text-light); margin-bottom: 4px; }
        .scan-verdict .verdict-desc { font-size: 15px; color: var(--text-light); line-height: 1.6; max-width: 500px; margin: 0 auto; }
        .scan-badges { display: flex; justify-content: center; gap: 24px; margin-top: 20px; flex-wrap: wrap; }
        .scan-badge-label { font-size: 12px; color: var(--text-light); margin-bottom: 4px; }
        .scan-stats { display: flex; justify-content: center; gap: 24px; margin-top: 20px; }
        .scan-stat { text-align: center; }
        .scan-stat-value { font-size: 24px; font-weight: 700; }
        .scan-stat-label { font-size: 12px; color: var(--text-light); }
        .flagged-item { background: var(--warm-bg); border-radius: 8px; padding: 16px; margin-bottom: 12px; }
        .flagged-item .flagged-header { display: flex; justify-content: space-between; align-items: center; }
        .flagged-item p { font-size: 14px; color: var(--text-light); margin-top: 6px; }
        .flagged-item .flagged-meta { font-size: 12px; color: var(--text-light); margin-top: 4px; }
        .flagged-item .flagged-match { font-size: 12px; color: var(--accent-light); margin-top: 4px; }
        .risk-tag { display: inline-block; padding: 2px 8px; border-radius: 4px; font-size: 12px; font-weight: 600; color: white; }
        .flagged-section-heading { font-size: 16px; font-weight: 600; margin-bottom: 12px; }
        .clean-ingredients { background: var(--warm-bg); border-radius: 8px; padding: 16px; cursor: pointer; }
        .clean-ingredients summary { font-size: 15px; font-weight: 600; color: var(--text); list-style: none; display: flex; justify-content: space-between; align-items: center; }
        .clean-ingredients .clean-tags { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 6px; }
        .clean-ingredients .clean-tag { font-size: 13px; background: white; border-radius: 4px; padding: 4px 10px; color: var(--text-light); }
        .nutri-score-row { display: flex; gap: 3px; align-items: center; }
        .nutri-grade { display: inline-flex; align-items: center; justify-content: center; border-radius: 4px; font-weight: 600; }
        .nutri-grade.active { width: 36px; height: 36px; border-radius: 6px; font-weight: 700; font-size: 16px; }
        .nutri-grade.inactive { width: 28px; height: 28px; opacity: 0.3; font-size: 12px; }
        .nova-badge { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; font-weight: 700; font-size: 18px; }
        .nova-label { font-size: 13px; color: var(--text-light); max-width: 160px; text-align: left; }
        .badge-group { text-align: center; }
        .badge-group-title { font-size: 13px; font-weight: 600; color: var(--text); margin-bottom: 6px; }
        .nova-row { display: flex; align-items: center; gap: 8px; }