/**
 * Accueil — composition « La période commande » (comp periode-commande).
 * Le segmenté 3/7 est le premier geste ; une carte météo, puis les cultures.
 *
 * Mobile d'abord : le maraîcher lit ça au champ, une main sur le téléphone.
 * Le desktop n'ajoute que de la TAILLE (les chiffres) et une ENTÊTE de colonnes
 * — jamais une information que le téléphone n'aurait pas.
 */

.mt-vh {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* ----- Segmenté 3 j / 7 j ---------------------------------------------- */

/* `align-items: flex-start` : sans lui, le stretch par défaut d'un conteneur
   flex en colonne étire le segmenté sur toute la largeur — c'est ce qui le
   rendait démesuré sur desktop. Pleine largeur seulement sous 640 px, où la
   cible tactile prime. */
.mt-accueil__head {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--mt-space-3, 12px);
    margin-bottom: var(--mt-space-4, 16px);
}

/* ----- Carte météo ------------------------------------------------------ */

.mt-accueil__dash {
    padding: var(--mt-space-5, 24px) var(--mt-space-4, 16px) var(--mt-space-4, 16px);
}

.mt-accueil__weather {
    display: flex;
    align-items: center;
    gap: var(--mt-space-3, 12px);
    margin-bottom: var(--mt-space-5, 24px);
}

.mt-accueil__weather[hidden] { display: none; }

.mt-accueil__icon {
    display: inline-flex;
    flex: 0 0 auto;
    padding-right: var(--mt-space-3, 12px);
    color: var(--mt-brand, #1a8781);
    border-right: 1px solid var(--mt-line, #e5dfd4);
}

.mt-accueil__icon svg {
    width: 36px;
    height: 36px;
}

/* Le lieu et les températures forment UNE ligne de station météo :
   « Rodez 25°/19° ». Le libellé J/N vivait en 12 px capitales à l'autre bout
   de la carte — il est passé en texte lecteur d'écran. */
.mt-accueil__station {
    display: flex;
    flex: 1 1 auto;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0 var(--mt-space-3, 12px);
    min-width: 0;
    margin: 0;
    font-size: var(--mt-fs-title, 18px);
    font-weight: 700;
    line-height: 1.25;
    color: var(--mt-brand, #1a8781);
}

.mt-accueil__place { min-width: 0; }

.mt-accueil__temps {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.mt-accueil__temps-sep {
    margin: 0 1px;
    font-weight: 400;
    color: var(--mt-brand, #1a8781);
    opacity: .55;
}

/* ----- Les deux chiffres ------------------------------------------------ */

.mt-accueil__figures {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
}

.mt-accueil__stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0 var(--mt-space-3, 12px);
    text-align: center;
}

.mt-accueil__stat + .mt-accueil__stat {
    border-left: 1px solid var(--mt-line, #e5dfd4);
}

.mt-accueil__stat-label {
    display: block;
    margin-bottom: 4px;
    font-size: var(--mt-fs-body, 16px);
    font-weight: 700;
    color: var(--mt-brand, #1a8781);
}

.mt-accueil__stat-unit {
    margin-top: 2px;
    font-size: var(--mt-fs-annex, 13.5px);
    color: var(--mt-muted, #6c7266);
}

.mt-accueil__etp,
.mt-accueil__rain {
    margin: 0;
    font-size: var(--mt-fs-display, 28px);
    font-weight: 700;
    line-height: 1.05;
    font-variant-numeric: tabular-nums;
    color: var(--mt-ink, #2b3128);
}

.mt-accueil__etp {
    color: var(--mt-brand, #1a8781);
}

/*
 * `.mt-app input[type=text|number]` (coquille) gagne sur `.mt-accueil__etp` :
 * 16 px / 400, padding de champ, filet. Sans reposer taille + graisse ICI,
 * ETP reste un mini-champ à côté du chiffre de la pluie.
 *
 * Le filet pointillé sous le nombre est la SEULE marque qu'il se modifie :
 * un champ plat au milieu d'un tableau de bord ne se signale plus.
 */
.mt-app input[type="text"].mt-accueil__etp,
.mt-app input[type="number"].mt-accueil__etp {
    display: block;
    width: 5.5ch;
    max-width: 100%;
    min-height: 0;
    height: auto;
    padding: 0 0 2px;
    margin: 0;
    font-family: inherit;
    font-size: var(--mt-fs-display, 28px);
    font-weight: 700;
    line-height: 1.05;
    font-variant-numeric: tabular-nums;
    text-align: center;
    color: var(--mt-brand, #1a8781);
    background: transparent;
    border: none;
    border-bottom: 2px dashed var(--mt-brand-tint, #e6f2f0);
    border-radius: 0;
    box-shadow: none;
    -moz-appearance: textfield;
    appearance: textfield;
}

.mt-app input[type="text"].mt-accueil__etp::placeholder,
.mt-app input[type="number"].mt-accueil__etp::placeholder {
    color: var(--mt-brand, #1a8781);
    font-weight: 700;
    opacity: 1;
}

.mt-app input[type="number"].mt-accueil__etp::-webkit-outer-spin-button,
.mt-app input[type="number"].mt-accueil__etp::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.mt-app input[type="text"].mt-accueil__etp:hover,
.mt-app input[type="text"].mt-accueil__etp:focus,
.mt-app input[type="text"].mt-accueil__etp:focus-visible,
.mt-app input[type="number"].mt-accueil__etp:hover,
.mt-app input[type="number"].mt-accueil__etp:focus,
.mt-app input[type="number"].mt-accueil__etp:focus-visible {
    color: var(--mt-brand-strong, #14655f);
    background: transparent;
    border-color: transparent;
    border-bottom: 2px solid var(--mt-brand, #1a8781);
    box-shadow: none;
    outline: none;
}

.mt-accueil__caption {
    margin: var(--mt-space-5, 24px) 0 0;
    text-align: center;
    font-size: var(--mt-fs-micro, 12px);
    line-height: 1.4;
    color: var(--mt-muted, #6c7266);
}

.mt-accueil__caption:empty { display: none; }

/* ----- Liste des cultures ----------------------------------------------
 * Les durées sont des COLONNES : une largeur unique (`--mt-time-col`) partagée
 * par l'entête et par chaque rangée, ancrées à droite. C'est ce qui permet à
 * l'entête de nommer le matériel sans table HTML — et de rester alignée quand
 * un nom de culture est long, puisque rien ne pousse depuis la gauche.
 * Le nom a un plancher `--mt-name-min` ; le surplus de colonnes défile dans
 * `.mt-accueil__crops`, sans barre visible.
 */

/* `position: relative` n'est PAS décoratif : sans lui, ce scroller reste un
   bloc statique, donc il n'est le bloc conteneur d'AUCUN descendant en
   `position: absolute` — et son `overflow-x` ne les clippe pas. Les `.mt-vh`
   (nom du matériel pour les lecteurs d'écran, un par colonne de durée)
   s'échappaient jusqu'au document et allongeaient sa largeur défilable : sur
   un téléphone étroit, toute la page glissait de ~24 px latéralement au lieu
   des seules colonnes. */
.mt-accueil__crops {
    position: relative;
    --mt-time-col: 108px;
    --mt-row-pad: 16px;   /* padding .mt-item (8) + padding .mt-crop-hit (8) */
    --mt-chev: 20px;
    --mt-name-min: 7ch;   /* 5 lettres + ellipsis (« Auber… ») */
    --mt-item-x: 16px;    /* padding horizontal .mt-item — le détail sticky s'y cale */
    margin-top: var(--mt-space-2, 8px);
    gap: var(--mt-space-2, 8px);
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    container-type: inline-size;
}

.mt-accueil__crops::-webkit-scrollbar {
    display: none;
}

.mt-accueil__crops[hidden],
.mt-table__wrap[hidden] { display: none; }

/* Taille et couleur viennent de `.mt-app h2` (headline 22 px). Ici, seulement
   la respiration : 8 px sous le titre collaient à l'entête de colonnes, qui
   remonte vers lui dès qu'un nom de matériel passe sur deux lignes. */
.mt-app .mt-accueil__crops-title {
    margin: var(--mt-space-5, 24px) 0 var(--mt-space-4, 16px);
}

.mt-accueil__crops-title[hidden] { display: none; }

.mt-accueil__crops-head {
    display: flex;
    align-items: flex-end;
    gap: var(--mt-space-3, 12px);
    min-width: min-content;
    padding: 0 calc(var(--mt-row-pad) + var(--mt-space-3, 12px) + var(--mt-chev)) 6px var(--mt-row-pad);
    border-bottom: 1px solid var(--mt-line, #e5dfd4);
}

.mt-accueil__crops-head-crop,
.mt-accueil__crops-head-cell {
    font-size: var(--mt-fs-body, 16px);
    font-weight: 700;
    line-height: 1.2;
    color: var(--mt-brand, #1a8781);
}

.mt-accueil__crops-head-crop {
    flex: 1 1 auto;
    min-width: var(--mt-name-min);
}

.mt-accueil__crops-head-cells {
    display: flex;
    flex: 0 0 auto;
    gap: var(--mt-space-3, 12px);
}

/* Un nom de matériel libre (« Goutte-à-goutte tunnel 3 ») tient rarement dans
   une colonne de durée : on borne la hauteur plutôt que la largeur — la colonne
   doit rester alignée sur les chiffres. Le nom entier reste lisible dans le
   bloc du détail et dans l'attribut `title`. */
.mt-accueil__crops-head-cell {
    display: -webkit-box;
    width: var(--mt-time-col);
    overflow: hidden;
    text-align: right;
    overflow-wrap: anywhere;
    color: var(--mt-brand, #1a8781);
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.mt-accueil__crops .mt-item {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    min-width: min-content;
    padding: 4px 8px;
    border: none;
    border-radius: var(--mt-radius-lg, 16px);
    transition: background-color .16s ease;
}

/* Le thème peint la page en BLANC : une rangée ouverte en blanc sans filet se
   dissout. Le filet + l'ombre sont ce qui la tient comme un panneau. */
.mt-accueil__crops .mt-item.is-open {
    background: var(--mt-surface, #fff);
    border: 1px solid var(--mt-line, #e5dfd4);
    box-shadow: var(--mt-shadow, 0 3px 12px rgba(43, 49, 40, .08));
}

.mt-accueil__crop-hit {
    display: grid;
    grid-template-columns: minmax(var(--mt-name-min), 1fr) auto auto;
    align-items: center;
    column-gap: var(--mt-space-3, 12px);
    width: 100%;
    min-width: min-content;
    margin: 0;
    padding: 8px;
    min-height: 44px;
    font: inherit;
    text-align: left;
    color: inherit;
    background: transparent;
    border: 0;
    border-radius: var(--mt-radius, 10px);
    cursor: pointer;
}

/* POST_MORTEM #7 : le thème peint `button:hover` en #404a3d/blanc — toujours
   redéclarer background ET color. */
.mt-accueil__crop-hit:hover,
.mt-accueil__crop-hit:focus {
    color: inherit;
    background: transparent;
}

.mt-accueil__crop-hit:focus-visible {
    outline: 2px solid var(--mt-brand, #1a8781);
    outline-offset: 2px;
}

.mt-accueil__crop-hit[aria-expanded="true"] .mt-irrig__chevron {
    transform: rotate(90deg);
}

.mt-accueil__crop-hit .mt-irrig__chevron {
    flex: 0 0 auto;
    width: var(--mt-chev);
    margin: 0;
    text-align: right;
}

.mt-accueil__crop-hit .mt-item__body {
    min-width: 0;
}

/* Une rangée ne déborde JAMAIS : c'est le nom qui cède, pas la colonne de
   durée — le chiffre est ce qu'on vient chercher. */
.mt-accueil__crop-hit .mt-item__name {
    font-size: var(--mt-fs-title, 18px);
    min-width: var(--mt-name-min);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Nom tronqué + rangée ouverte : le nom passe sous les durées, en entier.
   Les minutes restent dans la 2e piste — elles ne bougent pas. */
.mt-accueil__crop.is-open.is-name-truncated .mt-accueil__crop-hit {
    row-gap: var(--mt-space-2, 8px);
}

.mt-accueil__crop.is-open.is-name-truncated .mt-accueil__crop-hit .mt-item__body {
    grid-column: 1 / -1;
    grid-row: 2;
}

.mt-accueil__crop.is-open.is-name-truncated .mt-accueil__crop-hit .mt-item__name {
    overflow: visible;
    text-overflow: unset;
    white-space: normal;
    overflow-wrap: anywhere;
}

.mt-accueil__crop.is-open.is-name-truncated .mt-accueil__crop-hit .mt-accueil__crop-times {
    grid-column: 2;
    grid-row: 1;
}

.mt-accueil__crop.is-open.is-name-truncated .mt-accueil__crop-hit .mt-irrig__chevron {
    grid-column: 3;
    grid-row: 1;
}

.mt-accueil__crop-times {
    display: flex;
    flex: 0 0 auto;
    gap: var(--mt-space-3, 12px);
}

.mt-accueil__crop-time {
    display: inline-flex;
    align-items: baseline;
    justify-content: flex-end;
    width: var(--mt-time-col);
    font-variant-numeric: tabular-nums;
    color: var(--mt-brand, #1a8781);
    white-space: nowrap;
}

.mt-accueil__crop-time--empty { color: var(--mt-muted, #6c7266); }

.mt-accueil__crop-time-n {
    font-size: var(--mt-fs-title, 18px);
    font-weight: 700;
}

.mt-accueil__crop-time-u {
    font-size: var(--mt-fs-annex, 13.5px);
    font-weight: 700;
}

/* ----- Détail d'une culture --------------------------------------------
 * Ce n'était qu'une suite de <p> muets. C'est désormais : un pas-à-pas de
 * stade, le besoin, puis UN bloc par matériel — programme en évidence, chiffres
 * annexes en rangées label/valeur (`.mt-result`, signature du design system).
 */

.mt-accueil__crop-detail {
    position: sticky;
    left: 0;
    box-sizing: border-box;
    width: calc(100cqi - var(--mt-item-x));
    padding: var(--mt-space-3, 12px) 8px 8px;
    border-top: 1px solid var(--mt-line, #e5dfd4);
}

.mt-accueil__crop-detail[hidden] { display: none; }

/* Un seul objet éditable dans ce panneau : le stade. Il tient dans la MÊME
   rangée label/valeur que l'emplacement ou le besoin — aucun encadrement,
   aucune pilule. Ce sont les deux chevrons teal qui disent « ça se change » ;
   tout le reste autour n'était que du chrome. */

.mt-accueil__stade-hint {
    margin-left: 3px;
    font-weight: 400;
    color: var(--mt-muted, #6c7266);
    opacity: .8;
}

.mt-accueil__crop-detail .mt-accueil__stade-pick {
    display: inline-flex;
    align-items: center;
    gap: var(--mt-space-1, 4px);
    justify-content: flex-end;
    min-width: 0;
}

.mt-accueil__stade-val {
    min-width: 0;
    color: var(--mt-ink, #2b3128);
    overflow-wrap: anywhere;
}

/* Un bouton qui n'apparaît qu'au survol n'existe pas au doigt : le repos porte
   déjà le rond teal lavé. Le survol le remplit — pas l'inverse.
   POST_MORTEM #7 : le thème peint `button:hover` en #404a3d/blanc, donc chaque
   état redéclare background ET color. */
.mt-accueil__stade-btn {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    margin: 0;
    padding: 0;
    color: var(--mt-brand, #1a8781);
    background: var(--mt-brand-tint, #e6f2f0);
    border: 0;
    border-radius: 50%;
    cursor: pointer;
    transition: background-color .16s ease, color .16s ease;
}

.mt-accueil__stade-btn svg {
    display: block;
    width: 20px;
    height: 20px;
}

.mt-accueil__stade-btn:hover,
.mt-accueil__stade-btn:focus {
    color: #fff;
    background: var(--mt-brand, #1a8781);
}

.mt-accueil__stade-btn:focus-visible {
    outline: 2px solid var(--mt-brand, #1a8781);
    outline-offset: 2px;
}

.mt-accueil__stade-btn[disabled],
.mt-accueil__stade-btn[disabled]:hover,
.mt-accueil__stade-btn[disabled]:focus {
    color: var(--mt-muted, #6c7266);
    background: var(--mt-surface-warm, #f4efe7);
    opacity: .55;
    cursor: default;
}

.mt-accueil__crop-block {
    margin-top: var(--mt-space-4, 16px);
}

/* Le bandeau teal porte le matériel ET son programme : c'est une seule
   information (« avec ce matériel, voilà ce que tu fais »), et deux blocs
   séparés la faisaient lire comme deux. Il sert aussi de séparateur entre
   matériels — plus besoin de filet au-dessus du titre. */
.mt-accueil__crop-prog {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--mt-space-1, 4px) var(--mt-space-3, 12px);
    margin: 0;
    padding: 10px 14px;
    background: var(--mt-brand-tint, #e6f2f0);
    border-radius: var(--mt-radius, 10px);
}

.mt-app .mt-accueil__crop-inst {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

/* La pluviométrie qualifie le matériel : elle accompagne le nom sans le
   disputer — même taille, graisse normale, encre muette. */
.mt-accueil__crop-pluvio {
    margin-left: 2px;
    font-weight: 400;
    color: var(--mt-muted, #6c7266);
    font-variant-numeric: tabular-nums;
}

.mt-accueil__crop-plan {
    flex: 0 1 auto;
    margin: 0;
    font-size: var(--mt-fs-title, 18px);
    font-weight: 700;
    line-height: 1.3;
    font-variant-numeric: tabular-nums;
    color: var(--mt-brand-strong, #14655f);
}

.mt-accueil__crop-detail .mt-result {
    padding: 8px 0;
}

.mt-accueil__crop-detail .mt-result__label {
    font-size: var(--mt-fs-annex, 13.5px);
    color: var(--mt-muted, #6c7266);
}

/* Un programme (« 1 passage de 25 min tous les 3 jours ») est une PHRASE :
   le `white-space: nowrap` de `.mt-result__value` la ferait déborder. */
.mt-accueil__crop-detail .mt-result__value {
    font-size: var(--mt-fs-body, 16px);
    text-align: right;
    white-space: normal;
}

/* Le bloc matériel qui suit porte déjà son filet haut : sans ça, deux traits
   se collent à 16 px d'intervalle. */
.mt-accueil__crop-need { border-bottom: 0; }

.mt-accueil__crop-need .mt-result__value {
    font-size: var(--mt-fs-title, 18px);
    color: var(--mt-brand, #1a8781);
}

.mt-accueil__crop-detail .mt-alert {
    margin: 0;
}

/* Accueil en colonne : le bouton Info peut se pousser en pied (`margin-top:
 * auto`) sans quitter le flux. */
.mt-accueil {
    display: flex;
    flex-direction: column;
}

/* ----- Info calcul ------------------------------------------------------
 * Même geste que l'Aide du calcul dosage : bouton plein teal, modale à
 * sections. Dans le flux, pied de page — pas `position: fixed` (un toggle
 * phyto collé là recouvrait le dernier résultat).
 * La modale est sœur des panneaux (hors `.mt-accueil`) : ces règles ne
 * passent PAS par un ancêtre `.mt-accueil`.
 *
 * `margin-top: auto` ne pousse le bouton que si la colonne est plus haute
 * que son contenu. Deux hauteurs mini, parce que le document n'est pas
 * le même : autonome = chrome plugin seul ; dans le thème = en-tête +
 * titre de page + pied Agrikole.
 */

.mt-accueil__help {
    display: flex;
    justify-content: flex-end;
    margin-top: auto;
    padding-top: var(--mt-space-5, 24px);
}

.mt-accueil__help[hidden] { display: none; }

@media (max-width: 799px) {
    body.mt-standalone .mt-app--shell .mt-accueil {
        min-height: calc(100dvh - 92px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));
    }

    body:not(.mt-standalone) .mt-app--shell .mt-accueil {
        min-height: calc(100dvh - 16px);
    }
}

.mt-modal.mt-accueil-help .mt-modal__dialog {
    width: min(640px, 100%);
}

.mt-accueil-help__section h3 {
    margin: 0 0 6px;
    font-family: inherit;
    font-size: var(--mt-fs-body, 16px);
    font-weight: 700;
    color: var(--mt-brand, #1a8781);
}

.mt-accueil-help__section p,
.mt-accueil-help__section ul {
    margin: 4px 0;
    color: var(--mt-text, #3c4139);
    line-height: 1.55;
}

.mt-accueil-help__section ul {
    padding-left: 20px;
}

.mt-accueil-help__section li {
    margin-bottom: 4px;
}

/* ----- Adaptations ------------------------------------------------------ */

/* ≥ 641 px : la place existe, les deux chiffres du tableau de bord la prennent.
   C'est le seul apport du desktop. */
@media (min-width: 641px) {
    .mt-accueil__etp,
    .mt-accueil__rain,
    .mt-app input[type="text"].mt-accueil__etp,
    .mt-app input[type="number"].mt-accueil__etp {
        font-size: var(--mt-fs-display-md, 38px);
    }

    .mt-accueil__stat-label { font-size: var(--mt-fs-title, 18px); }
    .mt-accueil__station { font-size: var(--mt-fs-title-lg, 22px); }
    .mt-accueil__icon svg { width: 44px; height: 44px; }
}

@media (min-width: 1000px) {
    .mt-accueil__etp,
    .mt-accueil__rain,
    .mt-app input[type="text"].mt-accueil__etp,
    .mt-app input[type="number"].mt-accueil__etp {
        font-size: var(--mt-fs-display-lg, 46px);
    }

    .mt-accueil__stat-unit { font-size: var(--mt-fs-body, 16px); }
    .mt-accueil__crops { --mt-time-col: 124px; }
}

@media (max-width: 640px) {
    .mt-accueil__head { align-items: stretch; }
    .mt-accueil__head .mt-segmented { width: 100%; }
    .mt-accueil__head .mt-segmented__btn { flex: 1 1 0; }

    .mt-accueil__crops {
        --mt-time-col: 84px;
        --mt-row-pad: 12px;
        --mt-item-x: 8px;
    }

    /* Au champ, le nom du matériel est la seule étiquette de la colonne. */
    .mt-accueil__crops-head-cell { -webkit-line-clamp: 3; }


    .mt-accueil__crops .mt-item { padding: 2px 4px; }
    .mt-accueil__crop-hit { column-gap: var(--mt-space-2, 8px); padding: 8px; }
    .mt-accueil__crop-times { gap: var(--mt-space-2, 8px); }
    .mt-accueil__crops-head { gap: var(--mt-space-2, 8px); }
    .mt-accueil__crops-head-cells { gap: var(--mt-space-2, 8px); }
    .mt-accueil__crops-head {
        padding-right: calc(var(--mt-row-pad) + var(--mt-space-2, 8px) + var(--mt-chev));
    }

    /* Le libellé + son aide tiennent mal sur la même ligne que la valeur à
       390 px : les deux se coupent et les chevrons se détachent de ce qu'ils
       changent. La valeur passe dessous, toujours ancrée à droite. */
    .mt-accueil__stade { flex-wrap: wrap; }
    .mt-accueil__stade .mt-result__label { flex: 1 1 100%; }
    .mt-accueil__crop-detail .mt-accueil__stade-pick { margin-left: auto; }

    .mt-accueil__crop-detail { padding: var(--mt-space-3, 12px) 4px 6px; }
}

@media (max-width: 400px) {
    .mt-accueil__crops { --mt-time-col: 76px; }
    .mt-accueil__crops-head-crop,
    .mt-accueil__crops-head-cell { font-size: var(--mt-fs-annex, 13.5px); }
    .mt-accueil__station { gap: 0 var(--mt-space-2, 8px); }
    .mt-accueil__stat { padding: 0 var(--mt-space-2, 8px); }
}