/* =========================================================
   GolfTrack — style épuré (dernière feuille chargée)
   Peu d'aplats noirs, des filets plutôt que des boîtes, du texte fin.
   Sur le parcours, les boutons de saisie gardent 44 px de haut au minimum.
   ========================================================= */
:root {
  --canvas: #F5F6F2;
  --line: #DCE2DC;
  --saisie: #FFFFFF;
  --saisie-bord: #A8B8AC;
  --saisie-texte: #57340A;
}
body { background: var(--canvas); font-size: 13px; line-height: 1.45; -webkit-font-smoothing: antialiased; }
svg { stroke-width: 1.6; }
h1, h2, h3, h4 { font-weight: 500; letter-spacing: -0.01em; }
b, strong { font-weight: 500; }

/* Pas de zoom automatique de l'iPhone sur les champs, qui s'y déclenche sous 16 px */
html:not([data-device="desktop"]) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select, textarea) { font-size: 16px; }

/* ---------- Surfaces ---------- */
:is(.card, .hole-card, .recap-card, .profile-card, .feat, .round-item, .club-stat, .lobby-item, .viz-card) { border-color: var(--line); box-shadow: none; }
.eyebrow { font-weight: 500; font-size: 10px; letter-spacing: 0.08em; color: var(--muted); }
.muted, .small-note { font-weight: 400; }

/* ---------- Barres ---------- */
.appbar { box-shadow: none; }
.tabbar { border-top: 1px solid var(--line); box-shadow: none; }
.tabbar button { font-size: 10px; font-weight: 400; }
.tabbar button svg { width: 20px; height: 20px; stroke-width: 1.5; }
.tabbar button.on { font-weight: 500; }
html[data-device="desktop"] .tabbar button[data-tab] { font-size: 13px; }

/* ---------- Bloc sombre : des chiffres séparés par des filets, pas des boîtes ---------- */
.hud { padding: 14px; }
.hud-title { font-size: 18px; line-height: 23px; font-weight: 500; }
.hud-text { font-size: 12px; line-height: 17px; color: #C9D5CD; }
.hud-chip { font-size: 9px; font-weight: 500; padding: 2px 8px; letter-spacing: 0.08em; }
.pods { gap: 0; }
.pods.four { gap: 0; }
.pod, .pod.main { background: none; border: 0; border-left: 1px solid rgba(255, 255, 255, 0.14); border-radius: 0; padding: 2px 8px; min-height: 0; }
.pod:first-child { border-left: 0; }
.pod .k { font-size: 9px; font-weight: 400; letter-spacing: 0.06em; color: #A8B8AC; }
.pod .v, .pod.main .v, .pods.four .pod .v, .pods.four .pod.main .v { font-size: 18px; line-height: 24px; font-weight: 500; }
.pod .v small { font-size: 11px; font-weight: 400; }

/* ---------- Accueil ---------- */
.feat-play { background: var(--card); border: 1px solid var(--line); color: var(--ink); }
.feat-play .feat-icon { background: var(--chip); color: var(--ink); }
.feat-play .eyebrow { color: var(--muted); }
.feat-play .feat-desc { color: var(--muted); font-size: 12px; line-height: 17px; }
.feat-play h3 { font-size: 15px; line-height: 20px; }
.feat-play .feat-tags { display: none; }
.feat-play .btn-primary { background: var(--slate); color: #fff; }
.feat-play.live { border-color: var(--line); }
.mj-stat.good, .mj-stat.work { background: var(--chip); color: var(--ink); }
.mj-stat.good .mj-k, .mj-k { color: var(--muted); font-weight: 400; font-size: 9px; letter-spacing: 0.06em; opacity: 1; }
.mj-stat b { font-size: 13px; line-height: 17px; }
.mj-stat small { color: var(--muted); opacity: 1; font-size: 11px; }
.mj-v { color: var(--ink); font-size: 16px; line-height: 21px; font-weight: 500; }
.mj-v small { color: var(--muted); }
.mj-global { gap: 0; }
.mj-global > div { background: none; border-left: 1px solid var(--line); border-radius: 0; padding: 2px 4px; }
.mj-global > div:first-child { border-left: 0; }
.mj-global b { font-size: 15px; line-height: 20px; font-weight: 500; }

/* ---------- Avatars ---------- */
.avatar.big { width: 52px; height: 52px; font-size: 16px; font-weight: 500; }
.avatar-edit .avatar.big { width: 56px; height: 56px; }
.ae-badge { width: 22px; height: 22px; right: -2px; bottom: -2px; }
.ae-badge svg { width: 12px; height: 12px; }
.ob-photo .ae-badge { width: 30px; height: 30px; right: 2px; bottom: 2px; }
.ob-photo .ae-badge svg { width: 15px; height: 15px; }
.login-logo { width: 150px; }

/* ---------- Saisie : du jaune franc mais sans halo ---------- */
:is(.new-hole, .easy-panel, .shot-panel, .shot-panel.ready, .club-zone, .par-line.compact, #setup .setup-block) { border-width: 1px; box-shadow: none; }
.new-hole { animation: none; }
#btn-resume-hole { border-width: 1px; box-shadow: none; }
.new-hole .par-tiles button { box-shadow: none; }
.btn-secondary { border-width: 1px; }
:is(.btn-primary, .btn-secondary, .btn-danger, .ra-btn) { font-weight: 500; font-size: 13px; }

/* Sur le parcours : à toucher sans viser, même avec un gant */
.club { min-height: 46px; font-size: 13px; }
.club small { font-size: 10px; }
.dir-row button { min-height: 48px; }
.dir-row button small { font-size: 9px; }
.contact-row button { min-height: 44px; font-size: 12px; font-weight: 500; }
.par-mini button, .par-tiles button { min-height: 40px; }
.club.last { border-width: 1px; }
.club.last::after { position: absolute; top: -6px; right: auto; left: 6px; padding: 0 5px; border-radius: 4px; background: var(--slate); color: #fff !important; font-size: 8px; line-height: 12px; letter-spacing: 0.04em; }
.play-actions .ra-btn, #play-actions button { min-height: 46px; }

/* ---------- Mon sac : fin et compact ---------- */
#bag-in, #bag-out { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; }
.bag-tile { min-height: 36px; padding: 5px 7px; border-radius: 4px; border-width: 1px; }
.bag-tile small { display: none; }
.bag-tile b { font-size: 12px; font-weight: 500; }
.bag-tile i { width: 16px; height: 16px; font-size: 11px; }
.bag-tile.in { background: var(--card); border-color: var(--slate); color: var(--ink); }
.bag-tile.in i { background: var(--chip); color: var(--red-ink); }
html[data-device="desktop"] #bag-in, html[data-device="desktop"] #bag-out { grid-template-columns: repeat(5, minmax(0, 1fr)); }

/* ---------- Statistiques : on enlève les pictos et les bandeaux ---------- */
#stats-body .viz-card { border: 1px solid var(--line); border-top: 1px solid var(--line); padding: 12px; }
#stats-body .vc-ic { display: none; }
#stats-body .viz-card header h3 { font-size: 14px; line-height: 19px; font-weight: 500; }
#stats-body .viz-card header p { font-size: 11px; line-height: 15px; }
#stats-body .stats-h { font-size: 14px; font-weight: 500; margin-top: 8px; }
#stats-body .stats-h > :is(span, i):first-child:not(:only-child) { display: none; }
#stats-body .stat-tile { border: 1px solid var(--line); box-shadow: none; padding: 8px; }
#stats-body .viz-card .stat-tile { background: var(--canvas); border: 0; }
#stats-body .t-value { font-size: 17px; line-height: 23px; font-weight: 500; }
#stats-body .t-label { font-size: 10px; font-weight: 400; }
#stats-body .t-ic { display: none; }
#stats-body .tiles.kpi .stat-tile { background: var(--card); color: var(--ink); }
#stats-body .tiles.kpi :is(.t-label, .t-sub) { color: var(--muted); }
#stats-body .tiles.kpi .t-value { color: var(--ink); }
.stats-jump { background: var(--canvas); padding: 5px 0; }
.stats-jump button { min-height: 28px; padding: 0 10px; font-size: 12px; font-weight: 400; border-width: 1px; }
.data-table th { font-size: 9px; font-weight: 500; letter-spacing: 0.04em; }
.data-table td { font-size: 12px; font-weight: 400; }
.stats-filters { border: 1px solid var(--line); box-shadow: none; padding: 6px; gap: 4px; }
.sf-btn { padding: 5px 8px; border-width: 1px; }
.sf-k { font-size: 9px; font-weight: 500; letter-spacing: 0.06em; }
.sf-val { font-size: 12px; line-height: 17px; font-weight: 500; }
.sf.on .sf-btn { background: var(--chip); border-color: var(--slate); }
.cmp-verdict b { font-size: 15px; line-height: 20px; font-weight: 500; }
.cmp-vals b { font-size: 14px; font-weight: 500; }
.cmp-delta b { font-size: 13px; font-weight: 500; }
.cmp-label { font-size: 12px; font-weight: 400; }
.cmp-bar { height: 5px; }
.cmp-h { font-size: 13px; font-weight: 500; }

/* ---------- Carte de score : lignes fines ---------- */
.golf-card th, .golf-card td { font-weight: 400; }

/* ---------- Écran d'acceptation ---------- */
.consent-card { border-radius: 4px; padding: 18px 16px; gap: 10px; }
.consent-card h2 { font-size: 18px; line-height: 23px; font-weight: 500; }
.consent-card p, .consent-card ul { font-size: 12px; line-height: 18px; }
.consent-check { padding: 10px; border-radius: 4px; font-size: 12px; line-height: 17px; }
.consent-check input { width: 20px; height: 20px; }
.consent-ok { min-height: 44px; border-radius: 4px; font-size: 13px; font-weight: 500; }
.consent-refuse { min-height: 36px; font-size: 12px; }

/* ---------- Finitions ---------- */
#stats-body .tiles.kpi { background: none; border: 0; padding: 0; }
#stats-body .sh-ic { display: none; }
.data-table td, .data-table tbody th { font-size: 12px; font-weight: 400; letter-spacing: 0; }
.bag-item { border-width: 1px; font-weight: 400; font-size: 12px; background: var(--card); }
.bag-item.on { background: var(--card); border-color: var(--slate); color: var(--ink); font-weight: 500; }
.avatar { border-width: 1px; }
.ae-badge { background: #fff; color: var(--slate); }
.small-note a { color: inherit; }
html[data-device="desktop"] .stats-filters { top: 52px; }
html:not([data-device="desktop"]) .club.last::after { top: -6px; left: 6px; right: auto; font-size: 8px; text-align: left; }
.par-line.compact .par-mini { grid-template-columns: repeat(3, 40px); }
.par-line.compact .par-mini button { min-height: 40px; }

/* =========================================================
   Téléphone d'abord
   ========================================================= */
/* Des zones faciles à toucher, sans alourdir le dessin */
html:not([data-device="desktop"]) .hp-edit { width: 34px; height: 34px; }
html:not([data-device="desktop"]) .hc-ic { width: 36px; height: 36px; }
html:not([data-device="desktop"]) .sp-x { width: 40px; height: 40px; }
html:not([data-device="desktop"]) :is(.link-pill, .link-btn, .sf-reset) { min-height: 36px; }
html:not([data-device="desktop"]) .stats-jump button { min-height: 36px; padding: 0 12px; }
html:not([data-device="desktop"]) .range-clubs button { min-height: 36px; }
html:not([data-device="desktop"]) .shot-strip li button { min-height: 36px; }

/* Les noms s'affichent en entier */
.hole-title { white-space: normal; overflow: visible; overflow-wrap: anywhere; }
:is(#lobby-list, .pp-main) b { white-space: normal; overflow: visible; overflow-wrap: anywhere; }
.pod .k { white-space: normal; overflow: visible; text-overflow: clip; }

/* Écran de jeu : le choix du club d'abord, sans répéter ce que l'en-tête dit déjà */
html:not([data-device="desktop"]) #play .hud { padding: 10px 12px; gap: 8px; }
html:not([data-device="desktop"]) #play .hud-chip,
html:not([data-device="desktop"]) #play .hole-badge,
html:not([data-device="desktop"]) #play .strip-hint { display: none; }
html:not([data-device="desktop"]) #play .hole-title { font-size: 15px; line-height: 20px; }
html:not([data-device="desktop"]) #play .pod .v { font-size: 16px; line-height: 21px; }

/* Petits téléphones */
@media (max-width: 360px) {
  html:not([data-device="desktop"]) .par-line.compact > span { display: none; }
  html:not([data-device="desktop"]) .play-top { flex-wrap: nowrap; }
  html:not([data-device="desktop"]) .ra-btn svg { display: none; }
  html:not([data-device="desktop"]) .ra-btn { font-size: 11px; }
}
html:not([data-device="desktop"]) .hole-card .hc-ic { width: 36px !important; height: 36px !important; }
html:not([data-device="desktop"]) .hp-toggle { min-height: 34px; }
#round-title { white-space: normal; overflow: visible; }