@import url("https://cdn.jsdelivr.net/gh/lipis/flag-icons@7.3.2/css/flag-icons.min.css");
#leaderboard-page{display:none}#desktop-design.leaderboard-open>.dp-body,#desktop-design.leaderboard-open>.dp-footer{display:none}#desktop-design.leaderboard-open>#leaderboard-page{display:flex}
#leaderboard-page{flex:1;min-height:0;flex-direction:column;gap:10px;padding:10px 26px 12px;color:#f4f7fb;font-family:Inter,Segoe UI,Arial,sans-serif;background:radial-gradient(circle at 48% 24%,#142330,#050b11 72%);overflow:auto;scrollbar-width:thin;scrollbar-color:#c6a800 #101923}#leaderboard-page *{box-sizing:border-box}#leaderboard-page h1,#leaderboard-page h2,#leaderboard-page p{margin:0}
.lb-hero{min-height:102px;display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border:1px solid #34434e;border-radius:12px;background:linear-gradient(90deg,#06101ae8,#06101a55,#06101ae8),url('../images/ludo-bg.jpg') center 48%/cover}.lb-hero h1{font-size:34px;line-height:1;margin:0 0 7px}.lb-hero p{color:#d2d8df}.lb-hero>strong{color:#ffdc24;line-height:1.5;letter-spacing:1.7px;font-family:Georgia,serif;font-style:italic}
.lb-overview{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.lb-overview article{min-height:82px;display:grid;grid-template-columns:72px minmax(0,1fr);align-items:center;gap:10px;padding:10px 12px;border:1px solid #253744;border-radius:10px;background:#091620d9}.lb-icon{width:56px;height:56px;display:flex;align-items:center;justify-content:center;justify-self:center;align-self:center;border-radius:10px;background:#0d2330;color:#19e69a;font-size:30px}.lb-icon.gold{color:#ffda00;background:#272510}.lb-icon.fire{color:#ff5b1d;background:#281e17}.lb-overview article>div{min-width:0;align-self:center}.lb-overview small,.lb-overview span{display:block;color:#aeb9c5}.lb-overview b{display:block;margin:4px 0;font-size:22px}
.lb-columns{display:grid;grid-template-columns:minmax(0,2.2fr) minmax(310px,.95fr);gap:10px;flex:1;min-width:0;min-height:0}.lb-panel{min-width:0;border:1px solid #293c49;border-radius:11px;background:linear-gradient(135deg,#0c1822e8,#06111ae8)}.lb-board{padding:12px;min-width:0;min-height:0;overflow:hidden;display:flex;flex-direction:column}.lb-board>header{display:flex;align-items:center;gap:12px}.lb-board h2{font-size:19px}.lb-board h2 small{font-size:8px;color:#8e9da9;text-transform:uppercase;border:1px solid #46545e;border-radius:4px;padding:2px 4px}.lb-tools{display:flex;min-width:0;gap:10px;margin-left:auto}.lb-tools input,.lb-tools select{height:35px;border:1px solid #415260;border-radius:7px;background:#0d1a24;color:#edf2f7;padding:7px 11px}.lb-tools input{width:230px}.lb-board>nav{display:flex;max-width:100%;gap:3px;width:330px;margin:10px 0}.lb-board>nav button{flex:1;height:32px;border:1px solid #354754;background:#101e28;color:#fff}.lb-board>nav button:first-child{border-radius:7px 0 0 7px}.lb-board>nav button:last-child{border-radius:0 7px 7px 0}.lb-board>nav .active{background:#ffda00;color:#151100;font-weight:800}
.lb-podium{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;align-items:end;margin:8px 0 12px}.lb-podium article{position:relative;display:grid;grid-template-columns:52px 1fr;align-items:center;gap:10px;min-height:112px;padding:14px;border:2px solid #667685;border-radius:10px;background:#17242dbd}.lb-podium .place-1{border-color:#ffda00;background:#3b2d09c7;transform:translateY(-4px)}.lb-podium .place-3{border-color:#b66a3b;background:#322015c7}.lb-podium article>i{position:absolute;left:10px;top:8px;font-style:normal;font-weight:800;color:#ffda00}.lb-podium article>span{width:48px;height:48px;display:grid;place-items:center;border:2px solid #e8c947;border-radius:50%;font-size:20px}.lb-podium article>div small{display:block;margin-top:6px;color:#b8c3cd}.lb-podium footer{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);text-align:center;border-top:1px solid #ffffff18;padding-top:9px}.lb-podium footer small{font-size:9px;color:#aeb9c3}.lb-podium footer b{font-size:14px}
.lb-table{width:100%;max-width:100%;min-width:0;min-height:0;overflow:auto;overscroll-behavior-inline:contain;scrollbar-width:thin;scrollbar-color:#c6a800 #101923}.lb-table-head,.lb-table [data-lb-rows]>article{display:grid;grid-template-columns:44px minmax(180px,2fr) repeat(4,minmax(65px,1fr)) 94px;align-items:center;gap:8px;min-width:730px}.lb-table-head{height:31px;padding:0 9px;background:#14242f;color:#ced6de}.lb-table [data-lb-rows]>article{min-height:36px;padding:4px 9px;border-bottom:1px solid #ffffff0d}.lb-person{display:flex;align-items:center;gap:8px;min-width:0}.lb-person>i{width:29px;height:29px;display:grid;place-items:center;border:2px solid #5dc69b;border-radius:50%;font-style:normal}.lb-person small{color:#aeb9c3;font-size:9px}.lb-table button{border:1px solid #687783;border-radius:6px;background:#0c1720;color:white;padding:6px}.lb-empty{padding:35px;text-align:center;color:#98a6b2}
.lb-side{display:flex;flex-direction:column;gap:10px}.lb-your,.lb-movers{padding:13px}.lb-your>header,.lb-movers>header{display:flex;align-items:center;justify-content:space-between}.lb-your>header>b{font-size:25px;color:#15e798}.lb-you{display:flex;align-items:center;gap:14px;padding:12px 5px}.lb-you>span{width:64px;height:64px;display:grid;place-items:center;border:2px solid #e4bd28;border-radius:50%;font-size:22px;background-size:cover;background-position:center}.lb-you div{display:grid;gap:5px}.lb-you strong{font-size:17px}.lb-you small{color:#b6c0cb}.lb-you em{padding:5px 8px;border-radius:5px;background:#45390d;color:#ffdd32;font-size:10px}.lb-your-stats{display:grid;grid-template-columns:repeat(4,1fr);padding:10px 0;border-top:1px solid #ffffff12;border-bottom:1px solid #ffffff12;text-align:center}.lb-your-stats div{border-right:1px solid #ffffff12}.lb-your-stats div:last-child{border:0}.lb-your-stats b,.lb-your-stats small{display:block}.lb-your-stats b{font-size:17px}.lb-your-stats small{font-size:9px;color:#a8b4be;margin-top:4px}.lb-your blockquote{margin:12px 0 0;padding:12px;text-align:center;border:1px solid #31434f;border-radius:8px;color:#ffda00;font:italic 14px Georgia,serif}.lb-movers{flex:1}.lb-movers header{margin-bottom:8px}.lb-movers p{display:grid;grid-template-columns:26px 1fr 55px 60px;align-items:center;gap:7px;margin:0;padding:7px;border-bottom:1px solid #ffffff0d}.lb-movers p em{color:#15df95}.lb-movers p small{text-align:right;color:#b7c0c8}
@media(max-width:843px){#leaderboard-page{padding:10px 12px calc(78px + env(safe-area-inset-bottom))}.lb-columns{grid-template-columns:1fr}.lb-board{min-height:600px}.lb-side{display:grid;grid-template-columns:1fr 1fr}.lb-hero>strong{display:none}}
@media(max-width:650px){.lb-hero{min-height:90px}.lb-hero h1{font-size:28px}.lb-overview{grid-template-columns:repeat(2,1fr)}.lb-overview article{min-height:70px;padding:8px;gap:8px}.lb-icon{width:42px;height:42px;font-size:23px}.lb-overview b{font-size:17px}.lb-overview span{font-size:9px}.lb-board>header{align-items:flex-start;flex-direction:column}.lb-tools{width:100%;margin:0}.lb-tools input{width:60%}.lb-tools select{width:40%}.lb-board>nav{width:100%}.lb-podium{grid-template-columns:1fr;align-items:stretch}.lb-podium article{min-height:82px}.lb-podium .place-1{order:-1;transform:none}.lb-board{min-height:0}.lb-table{max-height:360px}.lb-side{grid-template-columns:1fr}.lb-movers{min-height:250px}}

/* Detailed leaderboard artwork */
.lb-podium footer>div{border-right:1px solid #ffffff16}.lb-podium footer>div:last-child{border:0}.lb-podium footer small,.lb-podium footer b{display:block}.lb-podium footer small{margin-top:3px}
.lb-avatar-photo{display:block;width:100%;height:100%;border-radius:50%;background-position:center;background-size:cover;background-repeat:no-repeat;color:transparent;overflow:hidden}
.lb-person>.lb-avatar-photo{flex:0 0 auto;border:2px solid #5dc69b}
.lb-overview span.lb-icon{display:flex;align-items:center;justify-content:center}.lb-icon svg,.lb-icon .lucide{display:block;width:30px;height:30px;margin:0;position:static;transform:none}.lb-board h2>svg,.lb-your h2>svg,.lb-movers h2>svg{width:21px;height:21px;color:#ffda00;flex:none}.lb-movers h2>svg{color:#18df92}
.lb-flag{display:inline-block!important;width:20px;height:15px;margin-right:5px;border-radius:2px;vertical-align:-3px;box-shadow:0 1px 3px #0009;background-size:cover}
.lb-podium article:after{content:"";position:absolute;right:12px;top:12px;width:58px;height:58px;opacity:.07;background:radial-gradient(circle at 35% 35%,#fff 0 7%,transparent 8%),radial-gradient(circle at 65% 30%,#fff 0 7%,transparent 8%),radial-gradient(circle at 55% 65%,#fff 0 7%,transparent 8%);border:5px solid #fff;border-radius:50%;transform:rotate(-18deg)}
.lb-podium article>i{z-index:2;left:11px;top:8px;width:34px;height:40px;display:grid;place-items:center;border-radius:50% 50% 45% 45%;background:linear-gradient(#eef4f8,#82909b);border:2px solid #dbe4ea;color:#17212a;font-size:15px;box-shadow:0 3px 8px #0008}.lb-podium article>i:before,.lb-podium article>i:after{content:"";position:absolute;z-index:-1;bottom:-8px;width:12px;height:18px;background:#8997a2;clip-path:polygon(0 0,100% 0,75% 100%,50% 72%,25% 100%)}.lb-podium article>i:before{left:2px}.lb-podium article>i:after{right:2px}.lb-podium .place-1>i{background:linear-gradient(#fff071,#d69e00);border-color:#ffe55b;color:#6c4c00}.lb-podium .place-1>i:before,.lb-podium .place-1>i:after{background:#e4ad00}.lb-podium .place-1:before{content:"♛";position:absolute;z-index:3;left:50%;top:-27px;transform:translateX(-50%);color:#ffd51d;font-size:34px;text-shadow:0 3px 8px #000}.lb-podium .place-3>i{background:linear-gradient(#efa977,#9a4d28);border-color:#f2a16a;color:#572512}.lb-podium .place-3>i:before,.lb-podium .place-3>i:after{background:#b76438}
.lb-podium article{grid-template-columns:44px 54px minmax(0,1fr)}.lb-podium article>i{position:relative;left:auto;top:auto;grid-column:1;justify-self:center}.lb-podium article>span{grid-column:2;margin-left:0;justify-self:center;background:linear-gradient(145deg,#243745,#0d1821);box-shadow:inset 0 0 0 3px #ffffff08}.lb-podium article>div{grid-column:3;min-width:0}.lb-podium article>div strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lb-podium .place-1>span{border-color:#ffd51d;box-shadow:0 0 15px #ffd51d35}.lb-podium .place-3>span{border-color:#cf7a48}.lb-podium footer{grid-column:1/-1}
.lb-person small{display:inline-flex;align-items:center}.lb-streak{display:flex;align-items:center;gap:5px}.lb-streak svg{width:16px;height:16px;color:#ff642b;fill:#ff642b22}
.lb-movers p>span{display:flex;align-items:center;gap:8px}.lb-movers p>span>i{width:27px;height:27px;display:grid;place-items:center;border:2px solid #55a8e8;border-radius:50%;background:#244c75;font-style:normal}.lb-movers p:nth-of-type(2)>span>i{border-color:#e4c64d;background:#77601b}.lb-movers p:nth-of-type(3)>span>i{border-color:#e47575;background:#78353c}.lb-movers p:nth-of-type(4)>span>i{border-color:#49bfe9;background:#126c8b}.lb-movers p:nth-of-type(5)>span>i{border-color:#e49364;background:#834631}.lb-movers p>span>strong{font-weight:500}
@media(max-width:650px){.lb-podium .place-1:before{left:auto;right:14px;top:-16px}.lb-podium article>span{margin-left:0}.lb-flag{width:18px;height:13px}.lb-movers p{grid-template-columns:25px 1fr 52px 55px}}

/* Compact Leaderboard composition for the shared 1280 x 598 canvas. */
@media(min-width:844px){
  #desktop-design.leaderboard-open>#leaderboard-page{gap:8px;padding:6px 16px;overflow:hidden;scrollbar-gutter:auto}
  #desktop-design.leaderboard-open .lb-hero{min-height:82px;flex:0 0 82px;padding:10px 20px}
  #desktop-design.leaderboard-open .lb-hero h1{margin:0 0 5px;font-size:31px}
  #desktop-design.leaderboard-open .lb-hero p{font-size:14px}
  #desktop-design.leaderboard-open .lb-hero>strong{font-size:14px;line-height:1.4;text-align:right}
  #desktop-design.leaderboard-open .lb-overview{flex:0 0 76px;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
  #desktop-design.leaderboard-open .lb-overview article{min-height:76px;height:76px;grid-template-columns:54px minmax(0,1fr);gap:8px;padding:7px 10px;border-radius:8px}
  #desktop-design.leaderboard-open .lb-icon{width:46px;height:46px;font-size:24px}
  #desktop-design.leaderboard-open .lb-icon svg{width:25px;height:25px}
  #desktop-design.leaderboard-open .lb-overview small,#desktop-design.leaderboard-open .lb-overview span{font-size:11px}
  #desktop-design.leaderboard-open .lb-overview b{margin:2px 0;font-size:20px}
  #desktop-design.leaderboard-open .lb-columns{grid-template-columns:minmax(0,1fr) 390px;gap:8px;min-height:0}
  #desktop-design.leaderboard-open .lb-board{position:relative;padding:9px;overflow:hidden}
  #desktop-design.leaderboard-open .lb-board>header{height:34px;min-height:34px;gap:8px}
  #desktop-design.leaderboard-open .lb-board h2{flex:0 0 155px;font-size:17px}
  #desktop-design.leaderboard-open .lb-board h2 svg{width:19px;height:19px}
  #desktop-design.leaderboard-open .lb-tools{flex:1 1 auto;gap:8px;margin-left:150px}
  #desktop-design.leaderboard-open .lb-tools input,#desktop-design.leaderboard-open .lb-tools select{height:32px;padding:5px 9px;font-size:12px;cursor:pointer}
  #desktop-design.leaderboard-open .lb-tools input{min-width:0;width:auto;flex:1;cursor:text}
  #desktop-design.leaderboard-open .lb-tools select{flex:0 0 150px;width:150px}
  #desktop-design.leaderboard-open .lb-board>nav{position:absolute;z-index:2;top:9px;left:174px;width:145px;height:32px;margin:0}
  #desktop-design.leaderboard-open .lb-board>nav button{display:none}
  #desktop-design.leaderboard-open .lb-board>nav .active{display:flex;align-items:center;justify-content:center;gap:7px;height:32px;border-radius:6px;background:#0d1923;color:#eef2f6;font-weight:400;cursor:pointer}
  #desktop-design.leaderboard-open .lb-board>nav svg{width:16px;height:16px}
  #desktop-design.leaderboard-open .lb-podium{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;align-items:stretch;margin:7px 0 8px}
  #desktop-design.leaderboard-open .lb-podium article{min-height:88px;height:88px;grid-template-columns:30px 40px minmax(0,1fr);grid-template-rows:42px 32px;column-gap:7px;row-gap:0;padding:6px;border-width:1px;overflow:hidden}
  #desktop-design.leaderboard-open .lb-podium article>i{width:26px;height:30px;font-size:11px}
  #desktop-design.leaderboard-open .lb-podium article>span{width:38px;height:38px;font-size:13px}
  #desktop-design.leaderboard-open .lb-podium article>div strong{font-size:12px}
  #desktop-design.leaderboard-open .lb-podium article>div small{margin-top:3px;font-size:9px}
  #desktop-design.leaderboard-open .lb-podium article:after,#desktop-design.leaderboard-open .lb-podium .place-1:before{display:none}
  #desktop-design.leaderboard-open .lb-podium footer{height:32px;align-self:end;padding-top:4px}
  #desktop-design.leaderboard-open .lb-podium footer b{font-size:12px}
  #desktop-design.leaderboard-open .lb-podium footer small{font-size:8px}
  #desktop-design.leaderboard-open .lb-table{flex:1 1 auto;min-height:0;overflow:auto}
  #desktop-design.leaderboard-open .lb-table-head,#desktop-design.leaderboard-open .lb-table [data-lb-rows]>article{grid-template-columns:34px minmax(150px,2fr) repeat(4,minmax(54px,1fr)) 75px;min-width:650px;gap:5px}
  #desktop-design.leaderboard-open .lb-table-head{height:31px;font-size:11px}
  #desktop-design.leaderboard-open .lb-table [data-lb-rows]>article{min-height:38px;padding:4px 7px;font-size:11px}
  #desktop-design.leaderboard-open .lb-person{gap:5px}
  #desktop-design.leaderboard-open .lb-person>i,#desktop-design.leaderboard-open .lb-person>.lb-avatar-photo{width:26px;height:26px}
  #desktop-design.leaderboard-open .lb-person strong{font-size:11px}
  #desktop-design.leaderboard-open .lb-person small{font-size:8px}
  #desktop-design.leaderboard-open .lb-table button{padding:5px 10px;font-size:10px;cursor:pointer}
  #desktop-design.leaderboard-open .lb-side{display:grid;grid-template-columns:1fr;grid-template-rows:198px minmax(0,1fr);gap:8px;min-height:0}
  #desktop-design.leaderboard-open .lb-your,#desktop-design.leaderboard-open .lb-movers{min-height:0;padding:9px;overflow:hidden}
  #desktop-design.leaderboard-open .lb-your h2,#desktop-design.leaderboard-open .lb-movers h2{font-size:16px}
  #desktop-design.leaderboard-open .lb-your>header>b{font-size:22px}
  #desktop-design.leaderboard-open .lb-you{gap:9px;padding:6px 2px}
  #desktop-design.leaderboard-open .lb-you>span{width:54px;height:54px;font-size:18px}
  #desktop-design.leaderboard-open .lb-you div{gap:3px}
  #desktop-design.leaderboard-open .lb-you strong{font-size:14px}
  #desktop-design.leaderboard-open .lb-you small{font-size:10px}
  #desktop-design.leaderboard-open .lb-you em{padding:3px 6px;font-size:9px}
  #desktop-design.leaderboard-open .lb-your-stats{padding:6px 0}
  #desktop-design.leaderboard-open .lb-your-stats b{font-size:15px}
  #desktop-design.leaderboard-open .lb-your-stats small{font-size:8px;margin-top:2px}
  #desktop-design.leaderboard-open .lb-your blockquote{margin:6px 0 0;padding:5px;font-size:11px}
  #desktop-design.leaderboard-open .lb-movers{padding:7px 9px}
  #desktop-design.leaderboard-open .lb-movers>header{height:18px;margin-bottom:1px}
  #desktop-design.leaderboard-open .lb-guide-list{height:calc(100% - 19px);display:grid;grid-template-columns:1fr;align-content:center;overflow:hidden}
  #desktop-design.leaderboard-open .lb-guide-list p{display:grid!important;grid-template-columns:24px minmax(0,1fr)!important;align-items:center;gap:6px;margin:0;padding:4px 2px;border-bottom:1px solid #ffffff0d}
  #desktop-design.leaderboard-open .lb-guide-list p:last-child{border-bottom:0}
  #desktop-design.leaderboard-open .lb-guide-list>p>svg{width:17px;height:17px;align-self:center;color:#ffda00}
  #desktop-design.leaderboard-open .lb-guide-list p>span{display:block!important;min-width:0}
  #desktop-design.leaderboard-open .lb-guide-list strong{display:block;font-size:10px}
  #desktop-design.leaderboard-open .lb-guide-list small{display:block;margin-top:1px;color:#aeb9c5;font-size:8px;line-height:1.15}
}
