* { margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
  html,body { width:100%; height:100%; overflow:hidden; background:#8fd8f7; touch-action:none; overscroll-behavior:none;
    font-family:'Trebuchet MS','Comic Sans MS',system-ui,sans-serif; user-select:none; -webkit-user-select:none; }
  #c { position:fixed; inset:0; width:100%; height:100%; display:block; }
  .ov { position:fixed; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center;
    z-index:10; background:rgba(200,236,255,.45); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
    opacity:0; pointer-events:none; transition:opacity .25s; padding:20px; }
  .ov.show { opacity:1; pointer-events:auto; }
  .card { background:linear-gradient(160deg,rgba(255,255,255,.96),rgba(224,244,255,.97)); border:2px solid rgba(255,150,60,.55);
    border-radius:24px; padding:30px 30px 34px; max-width:420px; width:100%; text-align:center;
    box-shadow:0 20px 50px rgba(27,67,50,.22), inset 0 1px 0 rgba(255,255,255,.9); color:#1b4332; margin-top: -95px;}
	.cardFly {
	  text-align: center;
	  margin-top: -100px;
  }
  h1 { font-size:clamp(34px,9vw,54px); letter-spacing:2px; color:#ff8c3c;
    text-shadow:0 3px 0 #d96528, 0 6px 18px rgba(217,101,40,.25); margin-bottom:4px; font-style:italic; }
  .sub { color:#3d7a5c; font-size:14px; margin-bottom:22px; letter-spacing:1px; line-height:1.5; }
  .btn { display:block; width:100%; margin:8px 0; padding:14px 18px; border:none; border-radius:16px; cursor:pointer;
    font-family:inherit; font-size:18px; font-weight:bold; letter-spacing:1px; color:#3a2000;
    background:linear-gradient(180deg,#ffe27a,#ffb830); box-shadow:0 5px 0 #d97b28, 0 10px 24px rgba(217,123,40,.3);
    transition:transform .08s, box-shadow .08s; }
  .btn:active { transform:translateY(4px); box-shadow:0 1px 0 #d97b28; }
  .btn.ghostbtn { background:linear-gradient(180deg,#b7e4c7,#74c69d); color:#1b4332; box-shadow:0 5px 0 #40916c, 0 10px 24px rgba(64,145,108,.3); }
  .btn.ghostbtn:active { box-shadow:0 1px 0 #40916c; }
  input[type=text] { width:100%; padding:13px 16px; border-radius:14px; border:2px solid rgba(255,150,60,.55);
    background:rgba(255,255,255,.85); color:#1b4332; font-size:18px; text-align:center; font-family:inherit; outline:none; margin:6px 0 12px; }
  .stats { display:flex; gap:12px; justify-content:center; margin:18px 0 20px; }
  .stat { flex:1; background:rgba(45,106,79,.08); border-radius:14px; padding:14px 6px; }
  .stat b { display:block; font-size:26px; color:#ff8c3c; }
  .stat span { font-size:11px; color:#3d7a5c; letter-spacing:1px; }
  #lbList { text-align:left; max-height:46vh; overflow-y:auto; margin:10px 0; }
  .lbRow { display:flex; align-items:center; gap:10px; padding:8px 12px; border-radius:12px; margin:4px 0;
    background:rgba(45,106,79,.07); font-size:15px; }
  .lbRow.me { background:rgba(255,150,60,.16); border:1px solid rgba(255,150,60,.5); }
  .lbRow .rk { width:26px; font-weight:bold; color:#ff8c3c; }
  .lbRow .nm { flex:1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .lbRow .sc { font-weight:bold; }
  .tag { font-size:11px; background:rgba(64,145,108,.15); color:#2d6a4f; border-radius:8px; padding:2px 8px; margin-left:6px; }
  .lbRow .fl { font-size:17px; width:22px; text-align:center; }
  .lbRow .meta { font-size:11px; color:#6b8f7d; margin-left:6px; }
  .lbTabs { display:flex; gap:6px; justify-content:center; margin:8px 14px 4px; }
  .lbTab { flex:1; padding:7px 4px; border:none; border-radius:11px; cursor:pointer;
    background:rgba(45,106,79,.10); color:#2d6a4f; font-weight:bold; font-size:12.5px;
    font-family:inherit; transition:background .15s, color .15s; white-space:nowrap; }
  .lbTab.on { background:linear-gradient(90deg,#ff8c3c,#ffb26b); color:#fff; }
  .lbTab:active { transform:scale(.96); }
  #fireBtn { position:fixed; right:18px; bottom:calc(84px + env(safe-area-inset-bottom)); width:84px; height:84px; border-radius:50%;
    border:3px solid rgba(255,255,255,.55); background:radial-gradient(circle at 35% 30%, #ff9d3c, #e0341b 75%);
    box-shadow:0 6px 22px rgba(224,52,27,.45), inset 0 2px 6px rgba(255,255,255,.4); z-index:6;
    display:none; align-items:center; justify-content:center; font-size:34px; cursor:pointer; }
  #fireBtn:active { transform:scale(.92); }
  #fireBtn .ammo { position:absolute; top:-6px; right:-2px; background:#fff; color:#e0341b; font-weight:bold;
    border-radius:12px; min-width:26px; height:26px; line-height:26px; font-size:15px; box-shadow:0 2px 8px rgba(0,0,0,.25); }
  #muteBtn { position:fixed; top:max(12px, env(safe-area-inset-top)); right:14px; z-index:6; width:42px; height:42px;
    border-radius:12px; border:2px solid rgba(255,150,60,.4); background:rgba(255,255,255,.65); color:#2d6a4f; font-size:20px; cursor:pointer; }
  /* Bouton d'invitation / parrainage — haut à gauche, à côté des pièces. Visible seulement sur l'accueil. */
  #inviteBtn { position:fixed; top:max(75px, calc(env(safe-area-inset-top) + 46px)); left:20px; z-index:6;
    display:none; align-items:center; gap:6px; height:22px; padding:0px;
    border-radius:17px; border:2px solid rgba(255,190,70,.85);
    background:linear-gradient(180deg,#ffd257,#ff9d24); color:#5a2c00; font-size:17px; font-weight:bold;
    cursor:pointer; box-shadow:0 3px 0 #b96a00, 0 4px 10px rgba(0,0,0,.25);
    animation:invBob 2.6s ease-in-out infinite; }
  #inviteBtn:active { transform:translateY(2px); box-shadow:0 1px 0 #b96a00; }
  #inviteBtn .reward { font-size:12px; font-weight:bold; background:rgba(255,255,255,.55);
    color:#7a3b00; padding:1px 7px; border-radius:10px; line-height:1.4; }
  @keyframes invBob { 0%,100%{ transform:translateY(0) } 50%{ transform:translateY(-3px) } }
  .hint { font-size:12px; color:#5a8a72; margin-top:10px; line-height:1.5; }
  .avRow { display:flex; flex-wrap:wrap; gap:7px; justify-content:center; margin:14px 0 -10px; }
  .avCard {
    flex: 1 1 0;
    max-width: 50px;
    min-width: 50px;
    background: rgba(255, 255, 255, 0.4);
    border: 2px solid rgba(45, 106, 79, .15);
    border-radius: 10px;
    padding: 6px 0px 6px;
    cursor: pointer;
    transition: transform .08s, border-color .15s, background .15s, box-shadow .15s;
}
  .avCard:active { transform:scale(.94); }
  .avCard.sel { border-color:#ff8c3c; background: rgb(255 255 255 / 73%); box-shadow:0 0 18px rgba(255,150,60,.3); }
  .avCard img { width:40px; height:35px; object-fit:contain; }
  .avCard img { width:40px; height:35px; object-fit:contain; }
  .avCard .avName { font-size:10px; font-weight:bold; letter-spacing:.5px; margin-top:7px; color:#3d7a5c; }
  .avCard.sel .avName { color:#ff8c3c; }
  /* ---- oiseau verrouillé (achat en Stars) ---- */
  .avCard.locked { position:relative; }
  .avCard.locked { pointer-events: auto; cursor: pointer; }
  .avCard .lock, .avCard .price, .avCard img, .avCard .avName { pointer-events: none; }
  .avCard.locked img { filter:grayscale(1) brightness(1.05); opacity:.5; }
  .avCard.locked .avName { color:#9fb0bd; }
  .avCard .lock { position:absolute; top:3px; right:4px; font-size:11px; line-height:1;
    filter:drop-shadow(0 1px 1px rgba(0,0,0,.35)); }
  .avCard .price { display:block; margin-top:3px; font-size:9px; font-weight:bold; letter-spacing:.3px;
    color:#e08a1e; }
  .avCard.locked:active { transform:scale(.94); }
  ::-webkit-scrollbar{ width:6px } ::-webkit-scrollbar-thumb{ background:rgba(255,150,60,.5); border-radius:3px }
  /* ---- Écran d'accueil START ---- */
  #startOv { background:rgba(200,236,255,.35); backdrop-filter:blur(9px); -webkit-backdrop-filter:blur(9px); }
  #startOv .brand { font-size:clamp(48px,15vw,88px); letter-spacing:3px; color:#ff8c3c; font-style:italic;
    text-shadow:0 4px 0 #d96528, 0 10px 30px rgba(27,67,50,.3); margin-bottom:6px; }
  #startOv .tagline { color:#2d6a4f; font-size:15px; letter-spacing:2px; margin-bottom:40px; opacity:.9; }
  #startBtn { width:auto; min-width:220px; padding:18px 46px; font-size:24px; letter-spacing:3px;
    border-radius:20px; animation:pulseBtn 1.6s ease-in-out infinite; }
  @keyframes pulseBtn { 0%,100%{ transform:scale(1) } 50%{ transform:scale(1.06) } }
  /* ---- Barre de navigation du bas (toujours visible) ---- */
  #navBar { position:fixed; left:0; right:0; bottom:0; z-index:20; display:none;
    justify-content:space-around; align-items:center; gap:4px;
    padding:8px 10px calc(8px + env(safe-area-inset-bottom));
    background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(224,244,255,.97));
    border-top:0px solid rgba(255,150,60,.4); box-shadow:0 -6px 24px rgba(27,67,50,.18);
	width: 90%;
    margin: auto;
    border-radius: 18px;
    margin-bottom: 25px;
	}
  #navBar.show { display:flex; }
  .navItem { flex:1; max-width:110px; display:flex; flex-direction:column; align-items:center; gap:3px;
    padding:6px 2px; border-radius:14px; cursor:pointer; color:#6f9c84; transition:color .15s, background .15s; }
  .navItem .ic { font-size:24px; line-height:1; }
  .navItem .lb { font-size:10px; font-weight:bold; letter-spacing:.5px; }
  .navItem.on { color:#ff8c3c; background:rgba(255,150,60,.14); }
  .navItem:active { transform:scale(.94); }
  /* pastille "récompense dispo" sur l'onglet REWARD */
  .navItem { position:relative; }
  .navDot { position:absolute; top:4px; right:calc(50% - 22px); width:11px; height:11px; border-radius:50%;
    background:#ff5252; box-shadow:0 0 0 2px #fff, 0 0 10px rgba(255,82,82,.9); display:none;
    animation:dotPulse 1.2s ease-in-out infinite; }
  .navDot.on { display:block; }
  @keyframes dotPulse { 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.35); } }

  /* ---- DAILY REWARD ---- */
  #dailyOv .card { max-width:440px; margin-top:-56px; padding:22px 22px 24px; }
  #dailyOv h1 { margin-bottom:2px; }
  .dailyHead { color:#3d7a5c; font-size:12px; letter-spacing:.5px; margin:2px 0 10px; line-height:1.4; }
  .dailyGrid { display:grid; grid-template-columns:repeat(5,1fr); gap:6px; max-height:48vh; overflow-y:auto;
    padding:3px; margin-bottom:8px; }
  .dCell { position:relative; aspect-ratio:1/0.72; border-radius:11px; display:flex; flex-direction:column;
    align-items:center; justify-content:center; gap:1px; font-weight:bold; cursor:default;
    background:rgba(45,106,79,.09); border:2px solid transparent; transition:transform .1s; }
  .dCell .dDay { font-size:8px; letter-spacing:.3px; color:#3d7a5c; opacity:.75; line-height:1; }
  .dCell .dAmt { font-size:14px; color:#ff8c3c; line-height:1.05; }
  .dCell .dAmt small { font-size:9px; }
  /* déjà réclamé */
  .dCell.claimed { background:rgba(64,145,108,.16); border-color:rgba(64,145,108,.35); opacity:.72; }
  .dCell.claimed::after { content:'✓'; position:absolute; top:3px; right:5px; font-size:11px; color:#40916c; }
  .dCell.claimed .dAmt { color:#40916c; }
  /* jour du jour, réclamable */
  .dCell.today { cursor:pointer; background:linear-gradient(160deg,#ffe27a,#ffb830);
    border-color:#d97b28; box-shadow:0 4px 0 #d97b28, 0 8px 20px rgba(217,123,40,.4);
    animation:todayPulse 1.4s ease-in-out infinite; }
  .dCell.today .dDay, .dCell.today .dAmt { color:#3a2000; }
  .dCell.today:active { transform:translateY(3px); box-shadow:0 1px 0 #d97b28; }
  @keyframes todayPulse { 0%,100%{ box-shadow:0 4px 0 #d97b28, 0 8px 20px rgba(217,123,40,.4);} 50%{ box-shadow:0 4px 0 #d97b28, 0 8px 28px rgba(255,180,40,.85);} }
  /* verrouillé (futur) */
  .dCell.locked { opacity:.5; }
  /* case finale : l'oiseau (jour 30) — ancrée sous la grille, toujours visible */
  #dailyFinalWrap { margin-bottom:8px; }
  #dailyFinalWrap:empty { display:none; }
  .dCell.final { width:100%; aspect-ratio:auto; padding:10px 12px; flex-direction:row; gap:12px;
    background:linear-gradient(135deg,#fff6d6,#ffe27a,#ffcf4d); border:2px solid #d97b28;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.9), 0 6px 18px rgba(217,123,40,.3); }
  .dCell.final .dBirdIco { font-size:30px; filter:drop-shadow(0 2px 4px rgba(0,0,0,.2)); }
  .dCell.final .dFinalTxt { flex:1; text-align:left; }
  .dCell.final .dFinalTxt b { display:block; font-size:15px; color:#3a2000; line-height:1.15; }
  .dCell.final .dFinalTxt span { font-size:10px; color:#7a4a10; letter-spacing:.4px; }
  .dCell.final.claimed { background:linear-gradient(135deg,#e7f3ea,#c8ecd4); border-color:rgba(64,145,108,.5); }
  .dailyTimer { font-size:11px; color:#3d7a5c; margin-bottom:6px; min-height:0; }
  .dailyTimer:empty { margin:0; }
  .dailyTimer b { color:#ff8c3c; }
  /* couche d'animation par-dessus la carte (confettis/pièces) */
  #dailyFx { position:fixed; inset:0; width:100%; height:100%; pointer-events:none; z-index:30; display:none; }
  #dailyFx.on { display:block; }
  /* la case qui vient d'être réclamée : petit "pop" satisfaisant */
  .dCell.pop { animation:cellPop .55s cubic-bezier(.2,1.4,.4,1) both; z-index:2; }
  @keyframes cellPop {
    0%   { transform:scale(1); }
    35%  { transform:scale(1.28) rotate(-3deg); filter:brightness(1.5); }
    60%  { transform:scale(.94) rotate(2deg); }
    100% { transform:scale(1) rotate(0); filter:brightness(1); }
  }
  /* flash doré plein écran très bref au moment du gain */
  #dailyFlash { position:fixed; inset:0; z-index:29; pointer-events:none; opacity:0;
    background:radial-gradient(circle at 50% 45%, rgba(255,220,120,.55), rgba(255,180,40,0) 60%); }
  #dailyFlash.go { animation:dFlash .6s ease-out; }
  @keyframes dFlash { 0%{ opacity:0; } 20%{ opacity:1; } 100%{ opacity:0; } }
  /* montant de pièces qui monte en fondu (feedback central) */
  #dailyGain { position:fixed; left:50%; top:42%; transform:translate(-50%,-50%); z-index:31;
    font-size:38px; font-weight:bold; font-style:italic; color:#ff8c3c; pointer-events:none; opacity:0;
    text-shadow:0 3px 0 #d96528, 0 6px 18px rgba(217,101,40,.4); white-space:nowrap; }
  #dailyGain.go { animation:dGain 1.6s ease-out; }
  @keyframes dGain {
    0%   { opacity:0; transform:translate(-50%,-30%) scale(.5); }
    18%  { opacity:1; transform:translate(-50%,-50%) scale(1.15); }
    35%  { transform:translate(-50%,-50%) scale(1); }
    75%  { opacity:1; }
    100% { opacity:0; transform:translate(-50%,-90%) scale(1); }
  }
  /* ---- Onglet BIRD : fiche oiseau ---- */
  .birdTitle { font-size:22px; font-weight:bold; color:#2d3a45; letter-spacing:.5px; margin-bottom:0px;
    text-shadow:0 1px 0 rgba(255,255,255,.7); margin-top: -10px; }
  .birdTitle .birdLvl { font-size:16px; font-weight:bold; color:#9fb4c2; letter-spacing:1px; }
  .heroWrap { display:flex; align-items:center; justify-content:center; height:180px; margin:0px;
    background:radial-gradient(ellipse at 50% 45%, rgba(255,255,255,.9), rgba(224,244,255,0) 68%); }
  #heroCanvas { width:260px; height:245px; }
  .statList { display:flex; flex-direction:column; gap:9px; margin:4px 2px 10px; }
  .statBar { position:relative; height:22px; border-radius:12px; background:rgba(45,106,79,.10);
    overflow:hidden; box-shadow:inset 0 1px 2px rgba(27,67,50,.12); }
  .statBar .fill { position:absolute; inset:0 auto 0 0; border-radius:12px; width:0;
    transition:width .45s cubic-bezier(.2,.8,.2,1); box-shadow:inset 0 1px 0 rgba(255,255,255,.4); }
  .statBar .lb { position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
    font-size:11px; font-weight:bold; letter-spacing:1px; color:#fff; text-shadow:0 1px 2px rgba(0,0,0,.35); }
  .birdDesc { font-size:12px; color:#5a8a72; line-height:1.5; margin:2px 4px 14px; min-height:18px; }
  /* ---- Bandeau « lot du champion » (compétition) ---- */
  .prizeCard { display:flex; align-items:center; gap:2px; margin:12px 0px 14px; padding:11px 10px;
    border-radius:16px; position:relative; overflow:hidden;
    background:linear-gradient(135deg, #fff5d6 0%, #ffe6a8 48%, #ffd27a 100%);
    border:1.5px solid rgba(255,180,60,.55);
    box-shadow:0 6px 20px rgba(240,150,40,.28), inset 0 1px 0 rgba(255,255,255,.7); }
  .prizeCard::after { content:""; position:absolute; top:-60%; left:-20%; width:55%; height:220%;
    background:linear-gradient(100deg, transparent, rgba(255,255,255,.55), transparent);
    transform:rotate(18deg); animation:prizeShine 3.4s ease-in-out infinite; }
  @keyframes prizeShine { 0%,60% { left:-40%; } 100% { left:130%; } }
  .prizeGift { font-size:34px; line-height:1; filter:drop-shadow(0 2px 3px rgba(180,110,20,.35));
    animation:prizeBob 2.4s ease-in-out infinite; }
  @keyframes prizeBob { 0%,100% { transform:translateY(0) rotate(-4deg); } 50% { transform:translateY(-4px) rotate(4deg); } }
  .prizeInfo { flex:1; text-align:left; min-width:0; }
  .prizeLabel { font-size:9.5px; font-weight:800; letter-spacing:1.4px; color:#c47a12; }
  .prizeName { font-size:16px; font-weight:800; color:#7a4a08; letter-spacing:.3px; line-height:1.15;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .prizeValue { font-size:16px; font-weight:800; color:#fff; letter-spacing:.4px; white-space:nowrap;
    background:linear-gradient(180deg,#ff993c,#f0862b); padding:7px 6px; border-radius:12px;
    box-shadow:0 3px 0 #cf6a1a, 0 5px 10px rgba(200,100,20,.3); }


#adsBtn{
  position:fixed; left:20px; z-index:6;
  display:none; align-items:center; gap:6px; height:22px; padding:0px;
  border-radius:17px; border:2px solid rgba(255,190,70,.85);
  background:linear-gradient(180deg,#ffd257,#ff9d24); color:#5a2c00;
  font-size:17px; font-weight:bold;
  cursor:pointer; box-shadow:0 3px 0 #b96a00, 0 4px 10px rgba(0,0,0,.25);
  animation:invBob 2.6s ease-in-out infinite;
  -webkit-tap-highlight-color:transparent;
}
#adsBtn:active{ transform:translateY(2px); box-shadow:0 1px 0 #b96a00; }
#adsBtn .reward{
  font-size:12px; font-weight:bold; background:rgba(255,255,255,.55);
  color:#7a3b00; padding:1px 7px; border-radius:10px; line-height:1.4;
}
#adsBtn.busy{ opacity:.55; pointer-events:none; }

#inviteBtn .lbl, #adsBtn .lbl{
  font-size:12px; font-weight:bold; color:#5a2c00;
  padding-left:8px; letter-spacing:.2px; white-space:nowrap;
}