/* A compact life meter and a gentle refill dialog in the card palette. */
.life-heart { display:block; width:29px; height:29px; flex:0 0 auto; overflow:visible; }
.lives-button { display:inline-flex; align-items:center; justify-content:center; gap:6px; flex:0 0 auto; min-height:43px; padding:5px 9px 5px 7px; border:1px solid #d9bdbb; border-radius:15px; color:#5c6553; background:linear-gradient(145deg,#fffaf1,#f8e9e3); box-shadow:inset 0 1px #ffffffc9,0 3px 0 #c7cdb9,0 5px 12px #5b725019; font:inherit; cursor:pointer; touch-action:manipulation; -webkit-tap-highlight-color:transparent; }
.lives-button-copy { display:flex; min-width:32px; flex-direction:column; align-items:center; justify-content:center; gap:2px; }
.lives-button .global-lives-count { color:#785261; font-size:14px; font-weight:700; line-height:1; letter-spacing:.015em; font-variant-numeric:tabular-nums; }
.lives-button .global-lives-timer { color:#867463; max-width:68px; font-size:9px; font-weight:600; line-height:1.1; white-space:nowrap; font-variant-numeric:tabular-nums; }
.lives-plus { display:grid; place-items:center; width:17px; height:18px; margin-left:1px; border:1px solid #d3ddc4; border-radius:6px; color:#63836b; background:#edf5e5; font-size:15px; line-height:1; }
.lives-button:active { transform:translateY(2px); box-shadow:inset 0 1px #ffffffa0,0 1px 0 #c7cdb9; }
.lives-button:focus-visible { outline:3px solid #559d83; outline-offset:3px; }
.lives-button:disabled { opacity:.55; cursor:wait; }
.lives-empty .lives-button,.lives-button.lives-empty { border-color:#d9a8ad; background:linear-gradient(145deg,#fff8ef,#f9dddc); }
.lives-empty .lives-button .global-lives-count,.lives-button.lives-empty .global-lives-count { color:#aa5369; }
body.lives-exempt [data-lives-exempt-hide],#app.lives-exempt [data-lives-exempt-hide],body.training-mode #gameLives { display:none!important; }
.home-bar #homeLives { margin-left:auto; }
.home-bar #homeSettings { margin-left:2px; }
#mapScreen>.screen-bar { gap:9px; }
#mapLives { min-height:42px; padding:4px 7px; gap:4px; }
#mapLives .lives-plus { display:none; }
#mapLives .life-heart { width:25px; height:27px; }
#app .topbar>.lives-button { min-width:64px; height:35px; min-height:35px; padding:3px 5px; gap:4px; border-radius:10px; box-shadow:inset 0 1px #ffffffb0,0 2px 0 #c7cdb9; }
#app .lives-button .life-heart { width:24px; height:26px; }
#app .lives-button .global-lives-count { font-size:12px; }
#app .lives-button .global-lives-timer { max-width:55px; font-size:8px; }
#app .lives-button-copy { gap:1px; min-width:28px; }

#livesModal { padding:max(14px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left)); }
#livesModal .lives-modal { position:relative; width:min(100%,390px); max-height:100%; overflow:auto; overscroll-behavior:contain; padding:25px 24px 20px; border:2px solid #e3eed9; border-radius:29px; color:#315f50; background:radial-gradient(ellipse at 50% 0,#d4eee1 0,transparent 57%),linear-gradient(155deg,#fffff6,#edf6e7); box-shadow:0 25px 70px #254a3e55,inset 0 0 0 4px #ffffff75; text-align:center; }
#livesModal .modal-close { top:11px; right:11px; width:37px; height:37px; border:1px solid #bfd9c7; border-radius:50%; color:#648674; background:#f9fff4; box-shadow:0 2px 0 #c0d7bb; }
.lives-emblem { position:relative; display:grid; place-items:center; width:92px; height:88px; margin:3px auto 12px; isolation:isolate; }
.lives-emblem::before { content:""; position:absolute; z-index:-1; left:-15px; right:-15px; top:0; bottom:3px; border:1px solid #e5edd8; border-radius:50%; background:#fafff057; transform:rotate(-13deg); }
.lives-emblem>.life-heart { width:86px; height:81px; filter:drop-shadow(0 5px 5px #7f8d6740); }
.lives-emblem>.global-lives-count { position:absolute; top:30px; left:8px; right:8px; color:#fff7e8; font-size:23px; font-weight:750; line-height:1; letter-spacing:.025em; text-shadow:0 1px 1px #a9556c; font-variant-numeric:tabular-nums; }
#livesTitle { margin:5px 15px 10px; color:#386d59; font-size:clamp(25px,6vw,30px); line-height:1.15; letter-spacing:-.035em; }
#livesModal #livesSummary { margin:0; color:#6b846e; font-size:13px; line-height:1.55; }
.lives-refill-row { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:9px; margin:15px 0 0; padding:10px 13px; border:1px solid #dbe6ca; border-radius:13px; color:#78906e; background:#f8fbeccb; font-size:12px; }
.lives-refill-row[hidden],.lives-refill-row.hidden { display:none!important; }
.lives-refill-row .life-refill-timer { color:#567d59; font-size:17px; line-height:1.1; letter-spacing:.05em; font-variant-numeric:tabular-nums; }
.lives-options { display:grid; gap:10px; margin:18px 0 13px; }
#livesModal .primary-button { display:flex; align-items:center; justify-content:center; gap:9px; width:100%; min-height:51px; margin:0; padding:11px 13px; border-radius:15px; font:inherit; font-size:13px; font-weight:650; line-height:1.25; letter-spacing:-.01em; cursor:pointer; }
#livesModal .primary-button>span:not(.life-video-icon) { min-width:0; overflow-wrap:anywhere; }
#lifeAdButton { color:#326651; border:1px solid #b5d4b9; background:linear-gradient(145deg,#f5ffe9,#dcedd3); box-shadow:inset 0 1px #fffdf2,0 3px 0 #acc7a4; }
.life-video-icon { display:grid; flex:0 0 25px; place-items:center; width:25px; height:25px; border:1px solid #a9c9b2; border-radius:8px; background:#e1f1d9; color:#638b68; font-size:11px; }
.life-reward-badge { display:inline-flex; flex:0 0 auto; align-items:center; gap:2px; padding:2px 6px; margin-left:auto; border:1px solid #e1c7b9; border-radius:9px; color:#8b5965; background:#fff5e9; font-size:13px; }
.life-reward-badge .life-heart { width:20px; height:23px; }
#livesModal #lifeCoinsButton { color:#736735; border:1px solid #dfd19c; background:linear-gradient(145deg,#fffadd,#efebbc); box-shadow:inset 0 1px #fffef0,0 3px 0 #c5c69e; }
#lifeCoinsButton>.coin-price { display:inline-flex; flex:0 0 auto; align-items:center; gap:4px; padding:2px 7px 2px 4px; margin-left:auto; border:1px solid #e2cf8f; border-radius:10px; color:#8d6d2b; background:linear-gradient(135deg,#fffde8,#f6e6b5); box-shadow:inset 0 1px #ffffef; font-size:15px; font-variant-numeric:tabular-nums; }
#lifeCoinsButton .coin-mark { width:23px; height:25px; }
#livesModal #lifePlayButton { min-height:48px; color:#fffbed; border:1px solid #5fa88e; background:linear-gradient(145deg,#89c9ab,#499e8a); box-shadow:inset 0 1px #d9f4d0a0,0 3px 0 #4b8870; font-size:15px; }
#livesModal .primary-button:disabled { opacity:.48; cursor:default; box-shadow:none; transform:none; filter:none; }
#livesModal .primary-button:focus-visible,#livesModal .modal-close:focus-visible { outline:3px solid #56997f; outline-offset:3px; }
#livesModal #livesStatus { margin:13px 0 0; padding:9px 11px; border:1px solid #dfd6af; border-radius:11px; color:#807342; background:#fff9e4; font-size:12px; line-height:1.5; }
#livesModal #livesStatus:empty { display:none; }

@media(max-width:440px) {
  #app .topbar { gap:4px; }
  #app .topbar .brand #brandText { display:none; }
  #app .topbar .brand-emblem { width:30px; height:29px; }
  #app .topbar .icon-button { width:30px; flex-basis:30px; }
  #mapScreen>.screen-bar { gap:6px; padding-inline:max(11px,env(safe-area-inset-left)) max(11px,env(safe-area-inset-right)); }
  #mapScreen>.screen-bar h1 { font-size:19px; }
  #mapScreen>.screen-bar .round-nav { width:37px; height:39px; }
  #mapCoins { padding:7px; gap:4px; font-size:12px; }
  #mapLives { min-width:65px; padding:4px 5px; gap:3px; }
  #mapLives .global-lives-count { font-size:12px; }
  #mapLives .global-lives-timer { font-size:8px; max-width:46px; }
}
@media(max-width:350px) {
  .home-bar { gap:8px; }
  .home-bar .currency-pill { min-width:90px; }
  #homeLives { padding-inline:5px; gap:3px; }
  #homeLives .lives-plus { display:none; }
  #app .currency-pill { min-width:65px; gap:2px; }
  #app .currency-pill .pill-plus { display:none; }
  #app .topbar>.lives-button { min-width:60px; padding-inline:3px; }
  #app .topbar .brand-emblem { width:25px; height:28px; }
  #mapScreen>.screen-bar h1 { font-size:16px; }
  #livesModal .lives-modal { padding:21px 17px 17px; }
}
#app[data-fit-orientation="landscape"] .topbar { gap:4px; }
#app[data-fit-orientation="landscape"] .topbar .brand #brandText { display:none; }
#app[data-fit-orientation="landscape"] .topbar .brand-emblem { width:28px; height:29px; }
#app[data-fit-orientation="landscape"] .topbar>.lives-button { min-width:59px; height:32px; min-height:32px; padding:2px 3px; }
@media(orientation:landscape) and (max-height:480px) {
  #livesModal .lives-modal { width:min(100%,650px); display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:9px 19px; align-items:center; padding:28px 21px 18px; }
  #livesModal .lives-emblem { width:70px; height:65px; margin:0 auto; grid-column:1; grid-row:1 / span 2; }
  #livesModal .lives-emblem>.life-heart { width:66px; height:63px; }
  #livesModal .lives-emblem>.global-lives-count { top:24px; font-size:18px; }
  #livesTitle { grid-column:1; font-size:22px; margin:0; }
  #livesModal #livesSummary { grid-column:1; font-size:12px; }
  #livesModal .lives-refill-row { grid-column:1; margin:0; padding:7px; }
  #livesModal .lives-options { grid-column:2; grid-row:1 / span 4; margin:0; }
  #livesModal #lifePlayButton { grid-column:2; min-height:43px; }
  #livesModal #livesStatus { grid-column:1 / -1; margin:0; }
}
@media(prefers-reduced-motion:reduce) { .lives-button { transition:none; } }