/* Tableau de bord membre : les données et actions restent celles du compte réel. */
body:not(.account-popup):has(#account-member:not([hidden])) { background: #e9eadf; }
body:not(.account-popup):has(#account-member:not([hidden])) .account {
  width: min(1400px, 100%); max-width: none; box-sizing: border-box;
  padding: 38px 26px 75px; color: #193823;
}
.account #account-member:not([hidden]) { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 22px; align-items: start; }
.account-member-sidebar { padding: 24px 14px 18px; background: #f1ecdf; border: 1px solid #ddd4c0; border-radius: 18px; box-shadow: 0 5px 16px #493d1a10; }
.account-member-avatar { width: 86px; height: 86px; margin: 0 auto 20px; overflow: hidden; border: 2px solid #e4d790; border-radius: 50%; background: #e4efc4; }
.account-member-avatar img { display: block; width: 120%; height: 120%; object-fit: cover; object-position: center 24%; transform: translate(-8%, -5%); filter: saturate(.8) brightness(.93); }
.account-member-nav { display: grid; gap: 3px; }
.account .account-member-nav a { display: flex; align-items: center; gap: 11px; min-height: 42px; padding: 0 12px; border-radius: 9px; color: #364836; font: 700 14px/1.2 Arial, sans-serif; text-decoration: none; }
.account .account-member-nav a:hover { background: #eef3df; }
.account .account-member-nav a[aria-current] { background: #285b21; color: #fffbe8; }
.account-member-nav svg, .account-sidebar-logout svg { width: 19px; height: 19px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.account :is(button.account-sidebar-logout, button.account-sidebar-logout:hover) { display: flex; justify-content: flex-start; gap: 11px; width: 100%; min-height: 43px; margin-top: 14px; padding: 10px 12px; border: 0; border-top: 1px solid #e8dfca; border-radius: 0; background: transparent; color: #405640; font: 700 14px/1.2 Arial, sans-serif; }
.account button.account-sidebar-logout:hover { color: #164b2e; text-decoration: underline; }
.account button.account-sidebar-logout::before { content: none; }
.account-member-main { min-width: 0; }
.account-member-main .account-greeting { position: relative; min-height: 125px; box-sizing: border-box; padding: 22px 28px; border: 1px solid #ded5c2; border-radius: 16px; overflow: hidden; background: linear-gradient(90deg, #f2ecdf 2%, #f2ecdfed 30%, #d6d4c14a 72%, #45503d29), url('../img/compte/ferme-banniere.webp') center 53% / cover no-repeat; }
.account-member-main .account-greeting > div { position: relative; }
.account-member-main .account-greeting .account-kicker { margin: 0; color: #31513a; letter-spacing: 0; text-transform: none; font: 700 16px/1.4 Georgia, serif; }
.account-member-main .account-greeting h2 { margin: 3px 0 0; color: #164a2b; font: 700 clamp(26px, 3vw, 38px)/1.1 Georgia, serif; }
body:not(.account-popup) .account-member-main #account-logout { display: none; }
.account-member-main > .account-status, .account-member-main > .account-notice, .account-member-main > #account-member-google-slot:not(:empty) { margin: 12px 0; }
.account-member-main .account-paper { margin: 14px 0; padding: 20px 25px; border: 1px solid #ded5c2; border-radius: 14px; background: #f2ecdf; box-shadow: 0 3px 10px #493d1a0d; }
.account-member-main #account-progress { background: linear-gradient(110deg, #f2ecdc, #eee5d1); }
.account-member-main #account-progress > h3, .account-member-main .account-resume h3 { margin: 0 0 10px; font: 700 20px/1.25 Georgia, serif; color: #214d2e; }
.account-progress-content { display: flex; align-items: center; gap: 16px; }
.account-medal { display: grid; flex: 0 0 56px; width: 56px; height: 56px; place-items: center; border: 3px solid #b58738; border-radius: 50%; background: #e2c584; color: #8a6429; box-shadow: inset 0 0 0 4px #f7e8bd, 0 2px 4px #69480930; }
.account-medal svg { width: 31px; height: 31px; fill: #fff2b0; stroke: currentColor; stroke-width: 1.7; stroke-linejoin: round; }
.account-progress-body { flex: 1; min-width: 0; }
.account-progress-heading { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; color: #273f29; font: 14px/1.4 Arial, sans-serif; }
.account-progress-heading strong { font-size: 17px; }
.account #account-level-bar { display: block; width: 100%; height: 13px; margin: 7px 0 0; accent-color: #428a29; }
.account-member-main #account-discoveries { margin: 12px 0 2px; color: #526753; font: 13px/1.5 Arial, sans-serif; }
.account-member-main #account-progress > .account-fine { margin: 7px 0 0; font-size: 12px; }
.account-member-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.account .account-member-actions a { display: flex; min-height: 118px; box-sizing: border-box; flex-direction: column; justify-content: center; align-items: center; gap: 7px; padding: 12px; border: 1px solid #ded2ba; border-radius: 14px; background: #eee6d8; box-shadow: 0 3px 8px #463a1510; color: #28422b; text-align: center; text-decoration: none; font: 700 16px/1.2 Arial, sans-serif; transition: transform .18s ease, box-shadow .18s ease; }
.account .account-member-actions a:first-child { background: #dce6d1; border-color: #c7d5bb; }
.account .account-member-actions a:last-child { background: #f0e6ce; }
.account .account-member-actions a:hover { transform: translateY(-2px); box-shadow: 0 6px 14px #463a1525; }
.account-member-actions svg { width: 38px; height: 38px; fill: #dfc27d; stroke: #876632; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.account-member-actions a:first-child svg { fill: #afc28d; stroke: #557044; }
.account-member-main .account-resume { padding: 18px 22px; }
.account #account-routes { margin: 0; }
.account #account-routes .account-route, .account #account-routes .account-route-empty { margin: 0; padding: 11px 14px; border: 1px solid #ded6c4; border-radius: 9px; background: #f8f3e9; font: 14px/1.45 Arial, sans-serif; }
.account #account-routes .account-route + .account-route { margin-top: 6px; }
.account .account-resume-link { display: inline-flex; align-items: center; gap: 8px; margin-top: 12px; color: #225b31; font: 700 14px/1.35 Arial, sans-serif; }
.account .account-resume-link span { display: grid; width: 25px; height: 25px; place-items: center; border-radius: 50%; background: #599b2b; color: white; font-size: 18px; }
.account-resume > p { margin: 0; }
.account-member-main .account-orders-panel h3, .account-member-main .account-settings summary { color: #214d2e; }
.account-popup #account-member:not([hidden]) { display: block; }
.account-popup .account-member-sidebar, .account-popup .account-member-main :is(.account-progress, .account-member-actions, .account-resume, .account-orders-panel, .account-settings) { display: none !important; }
.account-popup .account-member-main .account-greeting { min-height: 0; padding: 15px; background: #fffaf0; }
.account-popup .account-member-main .account-greeting h2 { font-size: 24px; }
@media (max-width: 760px) {
  body:not(.account-popup):has(#account-member:not([hidden])) .account { padding: 22px 15px 50px; }
  .account #account-member:not([hidden]) { grid-template-columns: 1fr; gap: 12px; }
  .account-member-sidebar { padding: 10px; }
  .account-member-avatar { display: none; }
  .account-member-nav { display: flex; flex-wrap: wrap; gap: 3px; }
  .account .account-member-nav a { min-height: 40px; padding: 0 9px; font-size: 13px; }
  .account :is(button.account-sidebar-logout, button.account-sidebar-logout:hover) { width: auto; margin: 5px 0 0; border: 0; }
  .account-member-main .account-greeting { min-height: 106px; padding: 18px; }
  .account-member-main .account-paper { padding: 18px; }
  .account .account-member-actions a { min-height: 104px; font-size: 14px; }
  .account-member-actions svg { width: 32px; height: 32px; }
}
@media (max-width: 420px) {
  .account-member-actions { gap: 7px; }
  .account .account-member-actions a { padding: 8px 4px; font-size: 13px; }
  .account-progress-heading { flex-direction: column; gap: 1px; }
  .account-member-main .account-greeting { background-position: 60% center; }
}
@media (prefers-reduced-motion: reduce) { .account .account-member-actions a { transition: none; } }


/* Navigation latérale disponible pendant la lecture sur grand écran. */
@media (min-width: 801px) {
  body:not(.account-popup) .account-member-sidebar {
    position: sticky;
    top: calc(var(--bp-header-height, 70px) + 16px);
    align-self: start;
    box-sizing: border-box;
    max-height: calc(100vh - var(--bp-header-height, 70px) - 32px);
    max-height: calc(100dvh - var(--bp-header-height, 70px) - 32px);
    overflow-y: auto;
    scrollbar-width: thin;
  }
  body:not(.account-popup) .account :is(#account-member, #account-routes-section, #account-progress, #account-orders-section, #account-settings) {
    scroll-margin-top: calc(var(--bp-header-height, 70px) + 16px);
  }
}
