/* Accueil du golfeur, copie de la maquette (1024 px de large) : toutes les tailles sont des pixels de la maquette × --u */
:root{--u:calc(min(100vw, 560px) / 1024);--v:calc(max(var(--u), min(100vh, 1150px) / 1536));--f:calc((var(--u) + var(--v)) / 2)}
@supports(height:100dvh){:root{--v:calc(max(var(--u), min(100dvh, 1150px) / 1536))}}
:root[data-screen="home"] body{background:#0b2219}
:root[data-screen="home"] .topbar{display:none!important}
:root[data-screen="home"] .main{padding:0!important;max-width:none!important;background:#0b2219}
.hm{--gold:#e3c27e;--gold2:#c9a35a;--tx:#f5f1e8;--tx2:#cfd8d2;--line:rgba(214,196,150,.22);
  max-width:560px;min-height:100vh;margin:0 auto;padding:calc(env(safe-area-inset-top,0px) + 40 * var(--v)) calc(32 * var(--u)) calc(min(96px, 162 * var(--v)) + 30px);
  display:flex;flex-direction:column;color:var(--tx);font-family:'Plus Jakarta Sans',system-ui,sans-serif;
  background:radial-gradient(130% 55% at 50% 0,#163c2b 0,#0e2b1f 45%,#0b2219 100%)}
.hm a{color:inherit;text-decoration:none}
.hm img,.hm svg{max-width:none}

/* en-tête : avatar, drapeau, TEEBOX, réglages, recherche, cloche */
.hm-top{display:flex;align-items:center;height:calc(88 * var(--v));padding-left:calc(16 * var(--u))}
.hm-me{width:calc(72 * var(--f));height:calc(72 * var(--f));border-radius:50%;overflow:hidden;flex:none;display:grid;place-items:center;background:#3d9b5e;box-shadow:0 0 0 calc(2 * var(--f)) #0b2219}
.hm-me svg{width:100%;height:100%}
.hm-brand{display:flex;align-items:center;gap:calc(20 * var(--u));margin-left:calc(36 * var(--u));font:700 max(19px, calc(52 * var(--f)))/1 'Playfair Display',Georgia,serif;color:var(--gold)!important;letter-spacing:.01em}
.hm-flag{width:calc(54 * var(--f));height:calc(54 * var(--f));border-radius:50%;display:grid;place-items:center;background:#173a2a;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);color:var(--gold)}
.hm-flag svg{width:68%;height:68%}
.hm-acts{margin-left:auto;display:flex;align-items:center;gap:calc(48 * var(--u));padding-right:calc(14 * var(--u))}
.hm-acts a{position:relative;display:grid;place-items:center;width:calc(48 * var(--u));height:calc(48 * var(--v));color:#f2f2ee}
.hm-acts svg{width:max(21px, calc(46 * var(--f)));height:max(21px, calc(46 * var(--f)))}
.hm-bell .notif-dot{position:absolute;top:calc(-14 * var(--f));right:calc(-14 * var(--f));min-width:max(16px, calc(32 * var(--f)));height:max(16px, calc(32 * var(--f)));padding:0 3px;border-radius:99px;background:#e2463a;color:#fff;border:0;font:700 max(10px, calc(19 * var(--f)))/max(16px, calc(32 * var(--f))) 'Plus Jakarta Sans',sans-serif;text-align:center}

/* grande photo du haut */
.hm-hero{position:relative;margin-top:calc(20 * var(--v));height:calc(283 * var(--v));min-height:112px;border-radius:calc(24 * var(--u));overflow:hidden;
  padding:0 calc(46 * var(--u));display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:calc(20 * var(--v));box-shadow:0 0 0 1.5px rgba(222,206,160,.35),0 calc(16 * var(--u)) calc(40 * var(--u)) rgba(0,0,0,.35)}
.hm-hero-bg,.hm-prof-bg,.hm-ct-bg{position:absolute;inset:0;overflow:hidden}
.hm-hero-bg>*,.hm-prof-bg>*,.hm-ct-bg>*{width:100%!important;height:100%!important;object-fit:cover;display:block}
.hm-hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,22,14,.62) 0,rgba(6,22,14,.28) 45%,rgba(6,22,14,0) 70%),linear-gradient(0deg,rgba(6,22,14,.35),rgba(255,190,110,.08) 60%,rgba(6,22,14,.1))}
.hm-hero>:not(.hm-hero-bg){position:relative}
.hm-hero h1{margin:0;max-width:64%;font:700 max(26px, calc(76 * var(--u)))/1.02 'Playfair Display',Georgia,serif;color:#fff;letter-spacing:-.005em;text-shadow:0 2px 12px rgba(0,0,0,.4)}
.hm-hero p{margin:calc(18 * var(--v)) 0 0;font-weight:600;font-size:max(11.5px, calc(27 * var(--f)));color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.4)}
.hm-gold{display:block;width:calc(77 * var(--u));height:max(2px, calc(4 * var(--v)));border-radius:2px;background:var(--gold2);margin:calc(18 * var(--v)) 0 calc(20 * var(--v))}
.hm-search{display:flex;align-items:center;gap:calc(18 * var(--u));width:calc(560 * var(--u));max-width:100%;height:max(30px, calc(56 * var(--v)));margin-left:calc(-16 * var(--u));padding:0 calc(26 * var(--u));border-radius:999px;
  background:rgba(9,32,22,.82);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);color:#e9eee9!important;font-size:max(11px, calc(22 * var(--f)))}
.hm-search svg{flex:none;width:max(14px, calc(26 * var(--f)));height:max(14px, calc(26 * var(--f)))}
.hm-search span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hm-wx{position:absolute!important;top:calc(19 * var(--v));right:calc(17 * var(--u));max-width:40%;display:flex;align-items:center;gap:calc(16 * var(--u));padding:calc(12 * var(--v)) calc(22 * var(--u));border-radius:calc(16 * var(--u));
  background:rgba(20,40,32,.72);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);color:#f0c14b}
.hm-wx>svg{flex:none;width:max(16px, calc(38 * var(--f)));height:max(16px, calc(38 * var(--f)))}
.hm-wx>span{min-width:0;display:grid;gap:calc(4 * var(--v))}
.hm-wx b{color:#fff;font-size:max(11px, calc(22 * var(--f)));font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hm-wx small{display:flex;align-items:center;gap:calc(10 * var(--u));color:#e8ece9;font-size:max(9.5px, calc(16.5 * var(--f)));white-space:nowrap}
.hm-wx small i{width:1px;height:1em;background:currentColor;opacity:.7}

/* 5 raccourcis */
.hm-quick{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:calc(16 * var(--u));margin-top:calc(20 * var(--v))}
.hm-quick>*{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(16 * var(--v));min-height:calc(126 * var(--v));padding:calc(12 * var(--v)) calc(4 * var(--u));border:0;border-radius:calc(22 * var(--u));
  background:linear-gradient(180deg,#123628,#0f2e21);box-shadow:inset 0 0 0 1px var(--line);color:var(--gold)!important;font:inherit;cursor:pointer;text-align:center}
.hm-quick>* svg{width:max(19px, calc(44 * var(--f)));height:max(19px, calc(44 * var(--f)))}
.hm-quick>* span{color:#fff;font-weight:600;font-size:max(9.5px, calc(20 * var(--f)));line-height:1.15;hyphens:auto;-webkit-hyphens:auto}
.hm-quick .on{background:linear-gradient(180deg,#1a4733,#123a2a);box-shadow:inset 0 0 0 max(1.5px, calc(3 * var(--u))) #d2ae66}
.hm-quick>*:active{transform:scale(.97)}

/* cartes */
.hm-card{position:relative;overflow:hidden;margin-top:calc(24 * var(--v));border-radius:calc(22 * var(--u));background:linear-gradient(180deg,#113425,#0e2d20);box-shadow:inset 0 0 0 1px var(--line);padding:calc(22 * var(--v)) calc(24 * var(--u)) calc(22 * var(--v))}
.hm-prof{display:flex;align-items:center;min-height:calc(167 * var(--v));padding:calc(16 * var(--v)) calc(18 * var(--u)) calc(16 * var(--v)) calc(22 * var(--u));gap:calc(28 * var(--u))}
.hm-prof-bg{opacity:.32;-webkit-mask-image:linear-gradient(90deg,transparent 30%,#000 75%);mask-image:linear-gradient(90deg,transparent 30%,#000 75%)}
.hm-prof>:not(.hm-prof-bg){position:relative}
.hm-prof-av{width:calc(118 * var(--f));height:calc(118 * var(--f));flex:none;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:#3d9b5e;box-shadow:0 0 0 max(2px, calc(5 * var(--f))) #d2ae66}
.hm-prof-av svg{width:100%;height:100%}
.hm-prof-i{display:grid;gap:calc(8 * var(--v));min-width:0;flex:1}
.hm-prof-i b{font-size:max(13px, calc(30 * var(--f)));font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hm-lvl{color:var(--gold);font-size:max(10.5px, calc(22 * var(--f)));font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hm-lvl i{font-style:normal;margin:0 .35em}
.hm-xp{display:block;height:max(5px, calc(12 * var(--v)));width:calc(350 * var(--u));max-width:100%;margin-top:calc(6 * var(--v));border-radius:99px;background:rgba(255,255,255,.14);overflow:hidden}
.hm-xp i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#2c9a5f,#49bd78)}
.hm-prof-i small{color:#e7ece8;font-size:max(9.5px, calc(19 * var(--f)));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hm-pill{flex:none;display:flex;align-items:center;gap:calc(14 * var(--u));height:max(28px, calc(56 * var(--v)));padding:0 calc(22 * var(--u)) 0 calc(28 * var(--u));border-radius:999px;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.45);
  background:rgba(8,28,19,.35);font-size:max(10px, calc(19 * var(--f)));font-weight:600;white-space:nowrap}
.hm-pill svg,.hm-h a svg,.hm-comp>svg{transform:rotate(180deg)}
.hm-h{display:flex;align-items:center;gap:calc(22 * var(--u));margin:calc(6 * var(--v)) 0 calc(24 * var(--v)) calc(8 * var(--u));color:var(--gold)}
.hm-h>svg{flex:none;width:max(18px, calc(42 * var(--f)));height:max(18px, calc(42 * var(--f)))}
.hm .hm-h h2{margin:0;flex:1;min-width:0;color:#fff;font:700 max(13px, calc(32 * var(--f)))/1.15 'Plus Jakarta Sans',sans-serif!important;letter-spacing:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hm-h a{display:flex;align-items:center;gap:calc(12 * var(--u));color:var(--gold)!important;font-size:max(10px, calc(20 * var(--f)));font-weight:600;white-space:nowrap;margin-right:calc(4 * var(--u))}
.hm-h a svg{width:max(9px, calc(16 * var(--f)));height:max(9px, calc(16 * var(--f)))}

/* compétition à venir */
.hm-comp{display:flex;align-items:center;gap:calc(22 * var(--u));min-height:calc(168 * var(--v));padding:calc(22 * var(--v)) calc(22 * var(--u));border-radius:calc(20 * var(--u));background:rgba(8,26,18,.4);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.hm-date{flex:none;display:grid;justify-items:center;align-content:center;width:calc(116 * var(--f));height:calc(128 * var(--f));min-height:58px;border-radius:calc(16 * var(--f));background:#0b2419;color:#fff;line-height:1.05}
.hm-date small{font-size:max(9.5px, calc(19 * var(--f)))}.hm-date b{font-size:max(20px, calc(44 * var(--f)));font-weight:700;margin:calc(4 * var(--v)) 0}
.hm-ci{flex:1;min-width:0;display:grid;gap:calc(9 * var(--v));font-size:max(10px, calc(19 * var(--f)));color:#e6ebe7}
.hm-ci>b{color:#fff;font-size:max(12px, calc(25 * var(--f)));font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hm-ci>span{display:flex;align-items:center;gap:calc(12 * var(--u));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hm-ci>span svg{flex:none;width:max(11px, calc(22 * var(--f)));height:max(11px, calc(22 * var(--f)))}.hm-ci>span i{font-style:normal;margin:0 .3em}
.hm-ci em{justify-self:start;font-style:normal;font-size:max(9.5px, calc(18 * var(--f)));color:#5fc98c;background:rgba(54,160,100,.2);padding:calc(2 * var(--v)) calc(20 * var(--u));border-radius:99px}
.hm-ci em.go{color:var(--gold);background:rgba(201,163,90,.2)}
.hm-ph{flex:none;width:calc(204 * var(--u));height:calc(126 * var(--v));border-radius:calc(16 * var(--u));overflow:hidden;display:block}
.hm-ph>*{width:100%!important;height:100%!important;object-fit:cover;display:block}
.hm-comp>svg{flex:none;width:max(10px, calc(22 * var(--f)));height:max(10px, calc(22 * var(--f)));color:#fff}
.hm-empty{display:grid;gap:4px;padding:calc(24 * var(--u));border-radius:calc(20 * var(--u));background:rgba(8,26,18,.4);font-size:max(10.5px, calc(19 * var(--f)));color:#dfe6e1}.hm-empty b{color:#fff;font-size:max(12px, calc(24 * var(--f)))}

/* mon club */
.hm-club{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:calc(18 * var(--u))}
.hm-ct{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:calc(142 * var(--v));padding:calc(14 * var(--v)) calc(16 * var(--u)) calc(16 * var(--v)) calc(22 * var(--u));border-radius:calc(18 * var(--u));overflow:hidden;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.hm-ct-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,30,21,.35) 0,rgba(10,30,21,.62) 45%,rgba(8,24,17,.9) 100%)}
.hm-ct>:not(.hm-ct-bg){position:relative}
.hm-ct-ic{display:inline-flex;width:max-content;margin-bottom:calc(14 * var(--v));color:#fff}
.hm-ct-ic svg{width:max(14px, calc(36 * var(--f)));height:max(14px, calc(36 * var(--f)))}.hm-ct-ic .gold{color:#eac46c;display:inline-flex}
.hm-ct-ic i{position:absolute;top:calc(-14 * var(--f));right:calc(-18 * var(--f));min-width:max(14px, calc(28 * var(--f)));height:max(14px, calc(28 * var(--f)));padding:0 2px;border-radius:99px;background:#2e8f58;color:#fff;font:700 max(8.5px, calc(16 * var(--f)))/max(14px, calc(28 * var(--f))) sans-serif;text-align:center;font-style:normal}
.hm-ct b{color:#fff;font-size:max(9.5px, calc(18.5 * var(--f)));font-weight:700;line-height:1.2}
.hm-ct small{margin-top:calc(6 * var(--v));color:#e3e9e5;font-size:max(8.5px, calc(16 * var(--f)))}

/* barre du bas du golfeur (toutes les pages) */
:root .bottombar.is-player{transform:none!important;width:auto!important;max-width:none!important;display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;
  left:calc(8 * var(--u))!important;right:calc(8 * var(--u))!important;bottom:calc(env(safe-area-inset-bottom,0px) + 4px)!important;height:max(64px, min(96px, calc(162 * var(--v))))!important;padding:0 calc(16 * var(--u))!important;
  border-radius:calc(42 * var(--u))!important;background:linear-gradient(180deg,#143a2a,#0d2b1e)!important;border:0!important;box-shadow:inset 0 0 0 1px rgba(214,196,150,.2),0 -6px 30px rgba(0,0,0,.35)!important;align-items:center!important}
@media(min-width:561px){:root .bottombar.is-player{left:50%!important;right:auto!important;width:552px!important;margin-left:-276px}}
:root .bottombar.is-player a{height:auto!important;min-height:0!important;padding:0!important;background:none!important;color:#eef1ec!important;display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:calc(12 * var(--v))!important;position:relative;border-radius:0!important}
:root .bottombar.is-player a>span:not(.nav-av){display:block!important;font-size:max(10px, calc(21 * var(--f)))!important;font-weight:500;letter-spacing:0}
:root .bottombar.is-player a.on{color:#e3c27e!important}
:root .bottombar.is-player a.on>span:not(.nav-av){font-weight:700}
:root .bottombar.is-player a::after{display:none!important}
:root .bottombar.is-player a.on:not(.fab)::after{content:"";display:block!important;position:absolute;top:auto!important;bottom:calc(-22 * var(--v))!important;left:18%!important;right:18%!important;width:auto!important;height:max(2px, calc(5 * var(--v)))!important;border-radius:3px;background:#e3c27e!important}
:root .bottombar.is-player a>svg{width:max(22px, calc(46 * var(--f)))!important;height:max(22px, calc(46 * var(--f)))!important}
:root .bottombar.is-player a .nav-av{width:max(26px, calc(56 * var(--f)))!important;height:max(26px, calc(56 * var(--f)))!important;border-radius:50%;overflow:hidden;box-shadow:0 0 0 max(1.5px, calc(3 * var(--f))) #3d9b5e}
:root .bottombar.is-player .fab{height:auto!important;margin-top:calc(-34 * var(--v))!important;gap:calc(10 * var(--u))!important;background:none!important;border:0!important;box-shadow:none!important;border-radius:0!important;width:auto!important;overflow:visible}
:root .bottombar.is-player .fab>svg{width:max(54px, calc(124 * var(--f)))!important;height:max(54px, calc(124 * var(--f)))!important;padding:max(15px, calc(36 * var(--f)));border-radius:50%;
  background:radial-gradient(circle at 35% 30%,#e9cd8e,#c79b4f 55%,#9c7334);color:#fff;fill:none!important;box-shadow:0 0 0 max(3px, calc(6 * var(--f))) #0f2e21,0 0 0 max(4px, calc(8 * var(--f))) rgba(214,184,120,.55),0 8px 22px rgba(0,0,0,.45)}
:root .bottombar.is-player .fab span{display:block!important}
:root .bottombar.is-player .fab .unread-dot{top:0!important;right:calc(50% - max(27px, calc(62 * var(--u))))!important;bottom:auto!important;width:12px!important;height:12px!important}
@media(min-width:900px){.hm{padding-top:24px}}