:root{
  --bg:#0f241d;
  --bg-grad1:#153528;
  --bg-grad2:#0c1714;
  --shell:#163425ee;
  --card:#1d3e2c;
  --card-2:#244733;
  --text:#f4ffe9;
  --muted:#c8d5bc;
  --border:#365a45;
  --accent:#ffd35a;
  --accent-2:#ffbc2e;
  --green:#88d158;
  --green-2:#3b7e45;
  --shadow:0 10px 24px rgba(0,0,0,.22);
  --nav:#163224f0;
}
:root[data-theme='light']{
  --bg:#e4f1d4;
  --bg-grad1:#f5f3cf;
  --bg-grad2:#d9efc8;
  --shell:#f8fff0ee;
  --card:#ffffff;
  --card-2:#f7fbef;
  --text:#1d3d27;
  --muted:#6d7b63;
  --border:#d8e7c8;
  --accent:#ffd95f;
  --accent-2:#f7bb2c;
  --green:#5ea450;
  --green-2:#3c7b44;
  --shadow:0 10px 24px rgba(72,112,55,.14);
  --nav:#fffdf5ed;
}
*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:linear-gradient(180deg,var(--bg-grad1),var(--bg) 35%,var(--bg-grad2));color:var(--text);min-height:100vh}
button{font:inherit}a{color:inherit}
#app-shell{width:min(100%,510px);margin:0 auto;min-height:100vh;padding-bottom:92px;background:var(--shell);backdrop-filter:blur(15px);box-shadow:0 0 0 1px rgba(255,255,255,.05)}
.app-bar{display:flex;justify-content:space-between;align-items:center;padding:14px 16px 10px;gap:8px;position:sticky;top:0;z-index:10;background:linear-gradient(180deg,rgba(0,0,0,.12),transparent)}
.brand{display:flex;gap:10px;align-items:center}.brand-badge{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(180deg,#ffe58e,#ffca58);box-shadow:var(--shadow);font-size:26px}.brand strong{display:block;font-size:20px;line-height:1;font-weight:1000;letter-spacing:.6px}.brand small{display:block;margin-top:5px;font-size:9px;letter-spacing:1.5px;color:var(--muted);font-weight:900}
.profile-wrap{display:flex;align-items:center;gap:8px}.theme-toggle{width:36px;height:36px;border:1px solid var(--border);border-radius:12px;background:var(--card);color:var(--text);box-shadow:var(--shadow)}.profile{display:flex;align-items:center;gap:7px;font-size:11px;font-weight:900;color:var(--muted)}.profile>span:nth-child(2){max-width:78px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.online-dot,.alive-dot{width:7px;height:7px;background:#74c94a;border-radius:50%;display:inline-block;box-shadow:0 0 0 3px rgba(148,222,118,.15)}.avatar{width:35px;height:35px;border-radius:100%;background:#f9d998;display:grid;place-items:center;font-size:20px;border:2px solid rgba(255,255,255,.85)}
.main{padding:0 14px}.top-banner{text-align:center;padding:16px 2px 14px}.greeting{font-weight:1000;font-size:19px;letter-spacing:-.4px}.caption-top{font-size:11px;font-weight:700;color:var(--muted);margin-top:4px}
.wallet-row{display:grid;grid-template-columns:1fr 1.25fr 1.15fr;gap:7px;margin-bottom:13px}.wallet{border:1px solid var(--border);background:var(--card);border-radius:16px;box-shadow:var(--shadow);padding:9px 6px;display:flex;align-items:center;gap:5px;min-width:0}.wallet-icon{width:31px;height:31px;border-radius:10px;flex-shrink:0;display:grid;place-items:center;font-size:18px}.wallet-icon.gold{background:#7c5a17}.wallet-icon.egg{background:#8b6830}.wallet-icon.feed{background:#466e2f}.wallet small{font-size:8px;font-weight:900;display:block;white-space:nowrap;color:var(--muted);letter-spacing:.2px}.wallet b{font-size:15px;font-weight:1000;line-height:1.4;display:block;color:var(--text)}.wallet em{font-weight:700;font-size:10px;color:var(--muted);font-style:normal}
:root[data-theme='light'] .wallet-icon.gold{background:#fff0c5}:root[data-theme='light'] .wallet-icon.egg{background:#fce5b2}:root[data-theme='light'] .wallet-icon.feed{background:#e3f0c9}
.farm-scene{height:318px;position:relative;border:5px solid rgba(255,247,215,.9);border-radius:23px;overflow:hidden;background:#80c6ed url('farm-hero.webp') center 54% / cover no-repeat;box-shadow:0 7px 0 rgba(181,200,149,.7),0 15px 22px rgba(0,0,0,.22)}.farm-scene::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,76,84,.1),transparent 30%,transparent 65%,rgba(36,63,22,.66));pointer-events:none}.sky-hud{position:absolute;inset:13px 12px auto;display:flex;justify-content:space-between;align-items:center}.weather,.level-chip{background:rgba(255,253,234,.9);border-radius:20px;padding:7px 10px;font-size:11px;font-weight:900;box-shadow:0 3px 7px rgba(95,109,56,.3);color:#466534}.level-chip{background:rgba(255,240,178,.93);color:#9a6521}.scene-badge{position:absolute;left:12px;bottom:17px;letter-spacing:1px;font-weight:900;font-size:10px;color:white;display:flex;align-items:center;gap:8px}.scene-stats{position:absolute;bottom:12px;right:10px;display:flex;gap:7px}.scene-stats>div{background:rgba(255,255,255,.92);border-radius:11px;padding:7px 8px;font-size:11px;box-shadow:0 3px 6px rgba(24,74,40,.3);color:#345e31}.scene-stats strong{font-size:14px}.scene-stats small{font-weight:800;color:#728267}
.page-section{padding-top:18px}.wood-board,.secondary-board{border-radius:18px;background:linear-gradient(110deg,var(--green-2),#2f6b3e);box-shadow:0 6px 0 #234c2b,0 12px 16px rgba(0,0,0,.22);border:1px solid rgba(141,209,115,.55);display:flex;align-items:center;justify-content:space-between;padding:14px 11px 14px 14px;gap:10px;color:white}.secondary-board{margin-top:12px;background:linear-gradient(110deg,#3f5e36,#314d2a)}.wood-board strong,.secondary-board strong{font-size:14px;display:block;font-weight:900}.wood-board small,.secondary-board small{display:block;font-size:10px;color:#e3f3cb;font-weight:700;margin-top:5px;line-height:1.35;max-width:210px}.board-meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}.board-meta span{font-size:9px;font-weight:900;padding:5px 8px;border-radius:999px;background:rgba(255,255,255,.12);color:#f9ffd9}
.action{border:0;border-radius:12px;padding:11px 12px;font-weight:1000;font-size:11px;white-space:nowrap;box-shadow:0 4px 0 rgba(0,0,0,.17);transition:transform .1s,filter .1s;cursor:pointer}.action:active{transform:translateY(3px);box-shadow:0 1px 0 rgba(0,0,0,.2)}.action.primary{background:linear-gradient(var(--accent),var(--accent-2));color:#7b4b18}.action.sell,.task-btn{background:#dff1ce;color:#2f6335}.action:disabled,.buy-upgrade:disabled,.quick-card:disabled,.nav-btn:disabled{opacity:.52;filter:grayscale(.25);cursor:not-allowed}
.section-head{display:flex;justify-content:space-between;align-items:center;margin:24px 2px 12px;gap:5px}.section-head h2{font-size:16px;margin:0;line-height:1.2;font-weight:1000}.mini-live{font-size:9px;font-weight:1000;color:#7fd46e}
.mining-grid,.production-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.production-grid{grid-template-columns:1fr 1fr}.mining-card,.production-card{background:var(--card);padding:14px 12px 12px;border:1px solid var(--border);border-radius:17px;box-shadow:var(--shadow)}.mining-card small,.production-card small{font-size:10px;font-weight:800;color:var(--muted);display:block}.mining-card strong{display:block;font-size:24px;font-weight:1000;margin:10px 0 2px;letter-spacing:-.7px}.mining-card span{font-size:10px;font-weight:900;color:#9fd18e}.production-card{display:grid;grid-template-columns:41px 1fr;align-items:center;column-gap:7px}.p-icon{width:41px;height:41px;border-radius:12px;background:rgba(151,203,112,.14);display:grid;place-items:center;font-size:26px}.production-card strong{font-size:18px;font-weight:1000;letter-spacing:-.6px}.tiny-caption{grid-column:1/-1;font-size:9px;color:var(--muted);margin-top:9px;border-top:1px dashed rgba(255,255,255,.12);padding-top:7px;font-weight:800}
.text-link{color:#9cd38a;text-decoration:none;font-size:11px;font-weight:900}.quick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.quick-card{border:1px solid var(--border);background:var(--card);border-radius:17px;padding:13px 4px;display:flex;flex-direction:column;gap:4px;align-items:center;box-shadow:var(--shadow);color:var(--text);min-width:0;cursor:pointer}.quick-icon{font-size:27px;background:rgba(151,203,112,.14);border-radius:13px;width:46px;height:46px;display:grid;place-items:center;margin-bottom:3px}.quick-card strong{font-size:11px;font-weight:900}.quick-card small{font-size:10px;color:var(--muted);font-weight:800}
.hidden{display:none!important}.secondary-label{font-weight:800;font-size:11px;color:var(--muted)}.upgrade-list{display:grid;gap:12px}.upgrade-card{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--border);padding:13px 10px;border-radius:17px;box-shadow:var(--shadow)}.upgrade-emoji{font-size:30px;width:52px;height:52px;display:grid;place-items:center;border-radius:13px;background:rgba(151,203,112,.14);flex-shrink:0}.upgrade-info{flex:1;min-width:0}.upgrade-info strong{font-size:13px;display:block;font-weight:1000}.upgrade-info small{display:block;font-size:10px;color:var(--muted);line-height:1.35;margin-top:3px}.upgrade-info .upgrade-level{display:inline-block;margin-top:6px;font-size:9px;font-weight:900;background:rgba(151,203,112,.14);color:#9ed780;padding:4px 7px;border-radius:12px}.buy-upgrade{border:0;border-radius:10px;background:var(--accent);color:#684b12;padding:10px 9px;font-weight:1000;font-size:11px;min-width:87px;box-shadow:0 3px 0 #dfa43c}
.task-card{background:var(--card);border:1px solid var(--border);border-radius:16px;display:flex;align-items:center;gap:10px;padding:14px 10px;margin-bottom:12px;box-shadow:var(--shadow)}.task-icon{font-size:29px;width:50px;height:50px;background:rgba(255,217,95,.17);border-radius:13px;display:grid;place-items:center;flex-shrink:0}.task-copy{min-width:0;flex:1}.task-copy strong{display:block;font-size:12px;font-weight:1000}.task-copy small{font-size:10px;font-weight:750;color:var(--muted);line-height:1.3;display:block;margin-top:4px}
.info-note{padding:16px;font-size:11px;font-weight:800;line-height:1.65;border-radius:15px;border:1px solid var(--border);background:var(--card);color:var(--muted);margin:16px 0}.account-card{background:var(--card);text-align:center;padding:24px 16px 15px;border:1px solid var(--border);border-radius:22px;box-shadow:var(--shadow)}.account-symbol{height:82px;width:82px;border-radius:50%;display:grid;place-items:center;margin:0 auto;background:#fff1bc;font-size:45px;border:4px solid #ffdf7e}.account-card h2{margin:10px 0 0}.account-card>span{font-size:11px;color:var(--muted);font-weight:800}.account-stat{border-top:1px solid rgba(255,255,255,.08);margin-top:18px;padding-top:18px;display:flex;justify-content:center;gap:50px}.account-stat div{display:flex;flex-direction:column}.account-stat strong{font-size:21px}.account-stat small{color:var(--muted);font-size:10px;font-weight:800}
.bottom-nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,510px);display:grid;grid-template-columns:repeat(4,1fr);height:calc(73px + env(safe-area-inset-bottom,0px));padding:8px 11px calc(8px + env(safe-area-inset-bottom,0px));background:var(--nav);backdrop-filter:blur(15px);border-top:1px solid var(--border);z-index:20;box-shadow:0 -5px 18px rgba(0,0,0,.16)}.nav-btn{border:none;background:transparent;color:#8ea298;border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;cursor:pointer}.nav-btn span{font-size:23px}.nav-btn small{font-size:9px;font-weight:1000}.nav-btn.selected{background:rgba(151,203,112,.14);color:var(--text)}
.auth-mask{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(11,27,22,.96);z-index:50;padding:20px}.auth-panel{width:min(100%,370px);padding:30px 23px;text-align:center;background:var(--card);border:1px solid var(--border);border-radius:24px;box-shadow:0 20px 50px rgba(0,0,0,.35)}.auth-chick{font-size:60px}.auth-panel h2{font-size:20px}.auth-panel p{font-size:13px;color:var(--muted);font-weight:800;line-height:1.6}.preview-link{display:inline-block;margin-top:10px;text-decoration:none;font-size:13px;font-weight:900;background:var(--accent);color:#715019;padding:11px 17px;border-radius:11px}.toast{position:fixed;z-index:80;bottom:90px;left:50%;transform:translateX(-50%) translateY(20px);border-radius:13px;padding:12px 18px;background:#315e3c;color:white;font-size:12px;font-weight:900;box-shadow:0 9px 24px rgba(29,74,39,.4);opacity:0;transition:.2s;max-width:calc(100% - 30px);text-align:center;pointer-events:none}.toast.show{transform:translateX(-50%) translateY(0);opacity:1}
@media(min-width:600px){#app-shell{min-height:calc(100vh - 30px);margin-top:15px;border-radius:25px 25px 0 0}.farm-scene{height:370px}}@media(max-width:420px){.mining-grid{grid-template-columns:1fr 1fr 1fr}.wallet-row{gap:5px}.wallet{padding:8px 5px}.wallet b{font-size:13px}.farm-scene{height:292px}.wood-board,.secondary-board{padding:13px 10px 13px 12px}.board-meta{gap:5px}.action{padding:10px 10px;font-size:10px}}
@media(max-width:370px){.wallet small{font-size:7px}.wallet-icon{width:24px;height:28px;font-size:14px}.quick-grid{grid-template-columns:1fr}.mining-grid,.production-grid{grid-template-columns:1fr}}


/* ===== FIX MENU DUOI CO DINH SAT DAY MAN HINH ===== */
html, body {
    min-height: 100vh !important;
}

body {
    margin: 0 !important;
    padding: 0 !important;
}

#app-shell {
    min-height: 100vh !important;
    padding-bottom: 95px !important;
    position: relative !important;
}

.main {
    padding-bottom: 18px !important;
}

.bottom-nav {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    transform: none !important;
    width: 100% !important;
    max-width: 510px !important;
    margin: 0 auto !important;
    z-index: 99999 !important;
    height: 76px !important;
    padding: 8px 10px calc(8px + env(safe-area-inset-bottom, 0px)) !important;
    background: rgba(18, 44, 31, 0.98) !important;
    backdrop-filter: blur(14px) !important;
    border-top: 1px solid rgba(255,255,255,.08) !important;
    box-shadow: 0 -8px 24px rgba(0,0,0,.28) !important;
}

:root[data-theme='light'] .bottom-nav {
    background: rgba(255, 253, 245, 0.98) !important;
}

.nav-btn {
    min-height: 56px !important;
}
/* ===== END FIX MENU DUOI ===== */


/* ===== ACCOUNT DASHBOARD V2 ===== */
.account-dashboard{
  display:grid;
  gap:14px;
}
.account-hero{
  display:flex;
  align-items:center;
  gap:14px;
  padding:16px;
  border-radius:20px;
  border:1px solid var(--border);
  background:linear-gradient(135deg, rgba(255,255,255,.03), rgba(255,255,255,.01));
  box-shadow:var(--shadow);
}
.account-avatar{
  width:72px;
  height:72px;
  border-radius:20px;
  display:grid;
  place-items:center;
  font-size:34px;
  background:linear-gradient(180deg,#ffe489,#ffd45d);
  color:#6c4b08;
  flex-shrink:0;
}
.account-hero-copy{
  min-width:0;
}
.account-hero-copy small{
  display:block;
  font-size:10px;
  font-weight:900;
  letter-spacing:1.4px;
  color:var(--muted);
}
.account-hero-copy h2{
  margin:6px 0 4px;
  font-size:25px;
  line-height:1.15;
  font-weight:1000;
  word-break:break-word;
}
.account-hero-copy p{
  margin:0;
  font-size:12px;
  color:var(--muted);
  font-weight:800;
}
.account-balance-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.account-balance-card{
  padding:16px;
  border-radius:18px;
  border:1px solid var(--border);
  background:var(--card);
  box-shadow:var(--shadow);
}
.account-balance-card span{
  display:block;
  font-size:11px;
  font-weight:900;
  color:var(--muted);
  margin-bottom:10px;
}
.account-balance-card strong{
  display:block;
  font-size:30px;
  font-weight:1000;
  line-height:1;
  margin-bottom:8px;
}
.account-balance-card small{
  display:block;
  font-size:10px;
  color:var(--muted);
  font-weight:800;
  line-height:1.4;
}
.account-balance-card.eggs{
  background:linear-gradient(135deg, rgba(255,213,93,.08), rgba(255,255,255,.01));
}
.account-stat-line{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.account-stat-box{
  padding:14px 16px;
  border-radius:16px;
  border:1px solid var(--border);
  background:var(--card);
  box-shadow:var(--shadow);
}
.account-stat-box span{
  display:block;
  font-size:10px;
  color:var(--muted);
  font-weight:900;
  margin-bottom:6px;
}
.account-stat-box strong{
  display:block;
  font-size:24px;
  font-weight:1000;
}
.account-service-panel{
  border:1px solid var(--border);
  background:var(--card);
  border-radius:20px;
  overflow:hidden;
  box-shadow:var(--shadow);
}
.account-service-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  padding:16px 16px 12px;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.account-service-head strong{
  font-size:17px;
  font-weight:1000;
}
.account-service-head span{
  font-size:10px;
  font-weight:900;
  color:var(--muted);
  letter-spacing:.6px;
}
.account-service-item{
  width:100%;
  display:grid;
  grid-template-columns:32px 1fr 20px;
  align-items:center;
  gap:10px;
  padding:16px;
  border:0;
  border-top:1px solid rgba(255,255,255,.06);
  background:transparent;
  color:var(--text);
  text-align:left;
  cursor:pointer;
}
.account-service-item:hover{
  background:rgba(255,255,255,.03);
}
.account-service-item em{
  font-style:normal;
  font-size:10px;
  font-weight:1000;
  color:#ff9d47;
  letter-spacing:1px;
}
.account-service-item span{
  font-size:14px;
  font-weight:900;
}
.account-service-item b{
  text-align:right;
  color:#ffb45b;
  font-size:16px;
}
@media(max-width:420px){
  .account-balance-grid,
  .account-stat-line{
    grid-template-columns:1fr;
  }
  .account-hero{
    align-items:flex-start;
  }
  .account-hero-copy h2{
    font-size:21px;
  }
}
/* ===== END ACCOUNT DASHBOARD V2 ===== */

/* ACCOUNT ONLY - HIDE FARM HEADER */
body.gv-account-hide-farm .top-banner,
body.gv-account-hide-farm .wallet-row,
body.gv-account-hide-farm .farm-scene {
    display: none !important;
}
/* END ACCOUNT ONLY */

/* ===== ACCOUNT CLEAN REDESIGN ===== */
.account-head-clean{
  margin-top: 8px;
}
.account-clean{
  display:grid;
  gap:14px;
}
.account-profile-strip{
  display:flex;
  align-items:center;
  gap:14px;
  padding:16px;
  border:1px solid var(--border);
  border-radius:20px;
  background:linear-gradient(135deg, rgba(255,255,255,.03), rgba(255,255,255,.01));
  box-shadow:var(--shadow);
}
.account-profile-avatar-wrap{
  width:70px;
  height:70px;
  position:relative;
  flex-shrink:0;
}
.account-profile-avatar,
.account-profile-fallback{
  width:70px;
  height:70px;
  border-radius:18px;
  display:grid;
  place-items:center;
}
.account-profile-avatar{
  object-fit:cover;
  border:2px solid rgba(255,255,255,.15);
}
.account-profile-fallback{
  background:linear-gradient(180deg,#ffe489,#ffd55f);
  color:#6d4c0f;
  font-size:33px;
  font-weight:1000;
}
.account-profile-meta{
  min-width:0;
}
.account-profile-meta small{
  display:block;
  font-size:10px;
  font-weight:900;
  letter-spacing:1.3px;
  color:var(--muted);
}
.account-profile-meta h3{
  margin:5px 0 4px;
  font-size:24px;
  line-height:1.15;
  font-weight:1000;
  word-break:break-word;
}
.account-profile-meta p{
  margin:0;
  font-size:12px;
  color:var(--muted);
  font-weight:800;
}
.account-main-metrics{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.metric-tile{
  padding:16px 18px;
  border-radius:18px;
  border:1px solid var(--border);
  background:var(--card);
  box-shadow:var(--shadow);
}
.metric-tile span{
  display:block;
  font-size:11px;
  color:var(--muted);
  font-weight:900;
  margin-bottom:10px;
}
.metric-tile strong{
  display:block;
  font-size:34px;
  line-height:1;
  font-weight:1000;
}
.account-mini-stats{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.mini-stat{
  padding:14px 16px;
  border-radius:16px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.02);
}
.mini-stat span{
  display:block;
  font-size:10px;
  color:var(--muted);
  font-weight:900;
  margin-bottom:7px;
}
.mini-stat strong{
  display:block;
  font-size:24px;
  font-weight:1000;
}
.account-service-list-wrap{
  border:1px solid var(--border);
  border-radius:20px;
  overflow:hidden;
  background:var(--card);
  box-shadow:var(--shadow);
}
.account-service-list-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  padding:16px;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.account-service-list-head strong{
  font-size:18px;
  font-weight:1000;
}
.account-service-list-head span{
  font-size:10px;
  color:var(--muted);
  font-weight:900;
}
.account-line-item{
  width:100%;
  border:0;
  border-top:1px solid rgba(255,255,255,.06);
  background:transparent;
  color:var(--text);
  display:grid;
  grid-template-columns:34px 1fr 16px;
  align-items:center;
  gap:10px;
  padding:16px;
  text-align:left;
  cursor:pointer;
}
.account-line-item:hover{
  background:rgba(255,255,255,.03);
}
.account-line-item em{
  font-style:normal;
  font-size:10px;
  font-weight:1000;
  color:#ff9d47;
  letter-spacing:1px;
}
.account-line-item span{
  font-size:15px;
  font-weight:900;
}
.account-line-item b{
  font-size:16px;
  color:#ffb457;
  text-align:right;
}
@media(max-width:420px){
  .account-main-metrics,
  .account-mini-stats{
    grid-template-columns:1fr 1fr;
    gap:10px;
  }
  .account-profile-meta h3{
    font-size:21px;
  }
  .metric-tile{
    padding:14px;
  }
  .metric-tile strong{
    font-size:29px;
  }
}
/* ===== END ACCOUNT CLEAN REDESIGN ===== */

/* ===== FIX STICKY HEADER BACKGROUND V1 ===== */
.app-bar{
  position: sticky !important;
  top: 0 !important;
  z-index: 9999 !important;
  background: linear-gradient(180deg, rgba(10,46,31,.96), rgba(13,55,36,.92)) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: 0 8px 20px rgba(0,0,0,.18) !important;
}

:root[data-theme='light'] .app-bar{
  background: linear-gradient(180deg, rgba(248,255,240,.96), rgba(236,248,225,.92)) !important;
  border-bottom: 1px solid rgba(36,77,45,.08) !important;
  box-shadow: 0 8px 18px rgba(75,110,70,.10) !important;
}

.app-bar::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 1px;
  background: rgba(255,255,255,.06);
  pointer-events: none;
}

:root[data-theme='light'] .app-bar::after{
  background: rgba(40,70,45,.08);
}

.brand{
  position: relative;
  z-index: 2;
}

.profile-wrap{
  position: relative;
  z-index: 2;
}
/* ===== END FIX STICKY HEADER BACKGROUND V1 ===== */







/* ===== GV_UPGRADE_FARM_STYLE_V1 ===== */

/* 1) AN KHUNG ANH/BANNER O TAB NANG CAP */
[data-page="upgrade"] .farm-scene,
[data-page="upgrade"] .hero-scene,
[data-page="upgrade"] .scene-card,
[data-page="upgrade"] .farm-banner,
[data-page="upgrade"] .farm-hero,
[data-page="upgrade"] .upgrade-hero,
[data-page="upgrade"] .page-hero,
[data-page="upgrade"] .top-banner {
  display: none !important;
}

/* 2) TAB NANG CAP GIONG PHONG CACH TRANG TRAI */
[data-page="upgrade"] {
  display: grid !important;
  gap: 12px !important;
  padding-bottom: 96px !important;
}

[data-page="upgrade"] .section-head,
[data-page="upgrade"] .page-head,
[data-page="upgrade"] .block-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  margin-bottom: 8px !important;
}

[data-page="upgrade"] .section-head h2,
[data-page="upgrade"] .page-head h2,
[data-page="upgrade"] .block-head h2 {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 38px !important;
  padding: 0 16px !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #8b5328 0%, #623214 100%) !important;
  color: #fff5d8 !important;
  font-size: 18px !important;
  font-weight: 1000 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 5px 12px rgba(0,0,0,.18) !important;
}

[data-page="upgrade"] .section-head .secondary-label,
[data-page="upgrade"] .page-head .secondary-label,
[data-page="upgrade"] .block-head .secondary-label {
  min-height: 34px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #2b8a2f 0%, #1d651f 100%) !important;
  color: #d8ffd1 !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  display: inline-flex !important;
  align-items: center !important;
}

/* 3) KHUNG CHUNG CUA KHU NANG CAP */
[data-page="upgrade"] .upgrade-list,
[data-page="upgrade"] .upgrade-wrap,
[data-page="upgrade"] .upgrade-panel,
[data-page="upgrade"] .page-body,
[data-page="upgrade"] .upgrade-page {
  display: grid !important;
  gap: 12px !important;
}

/* 4) CARD NANG CAP */
[data-page="upgrade"] .upgrade-card,
[data-page="upgrade"] .card-upgrade,
[data-page="upgrade"] .shop-card,
[data-page="upgrade"] .upgrade-item {
  display: grid !important;
  grid-template-columns: 64px 1fr auto !important;
  align-items: center !important;
  gap: 12px !important;
  min-height: 108px !important;
  padding: 14px !important;
  border-radius: 24px !important;
  background: linear-gradient(180deg, #1e6a31 0%, #114220 100%) !important;
  border: 2px solid rgba(223,255,158,.10) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 8px 20px rgba(0,0,0,.18) !important;
  position: relative !important;
  overflow: hidden !important;
}

[data-page="upgrade"] .upgrade-card::before,
[data-page="upgrade"] .card-upgrade::before,
[data-page="upgrade"] .shop-card::before,
[data-page="upgrade"] .upgrade-item::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background:
    radial-gradient(circle at 10px 10px, #ddff83 0 4px, transparent 5px),
    radial-gradient(circle at calc(100% - 14px) 12px, #76c738 0 5px, transparent 6px),
    radial-gradient(circle at 12px calc(100% - 14px), #5eae30 0 6px, transparent 7px),
    radial-gradient(circle at calc(100% - 14px) calc(100% - 14px), #ddff83 0 4px, transparent 5px);
  opacity: .65 !important;
}

[data-page="upgrade"] .upgrade-card .icon,
[data-page="upgrade"] .card-upgrade .icon,
[data-page="upgrade"] .shop-card .icon,
[data-page="upgrade"] .upgrade-item .icon,
[data-page="upgrade"] .upgrade-card .thumb,
[data-page="upgrade"] .card-upgrade .thumb,
[data-page="upgrade"] .shop-card .thumb,
[data-page="upgrade"] .upgrade-item .thumb {
  width: 56px !important;
  height: 56px !important;
  min-width: 56px !important;
  min-height: 56px !important;
  border-radius: 16px !important;
  display: grid !important;
  place-items: center !important;
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 4px 10px rgba(0,0,0,.15) !important;
  font-size: 28px !important;
}

[data-page="upgrade"] .upgrade-card h3,
[data-page="upgrade"] .card-upgrade h3,
[data-page="upgrade"] .shop-card h3,
[data-page="upgrade"] .upgrade-item h3 {
  margin: 0 0 4px 0 !important;
  font-size: 18px !important;
  line-height: 1.15 !important;
  font-weight: 1000 !important;
  color: #fff8e3 !important;
}

[data-page="upgrade"] .upgrade-card p,
[data-page="upgrade"] .card-upgrade p,
[data-page="upgrade"] .shop-card p,
[data-page="upgrade"] .upgrade-item p,
[data-page="upgrade"] .upgrade-card .desc,
[data-page="upgrade"] .card-upgrade .desc,
[data-page="upgrade"] .shop-card .desc,
[data-page="upgrade"] .upgrade-item .desc {
  margin: 0 !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
  color: #eef7df !important;
}

[data-page="upgrade"] .upgrade-card .level,
[data-page="upgrade"] .card-upgrade .level,
[data-page="upgrade"] .shop-card .level,
[data-page="upgrade"] .upgrade-item .level,
[data-page="upgrade"] .upgrade-card .badge,
[data-page="upgrade"] .card-upgrade .badge,
[data-page="upgrade"] .shop-card .badge,
[data-page="upgrade"] .upgrade-item .badge {
  margin-top: 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  min-height: 28px !important;
  padding: 0 10px !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #4f9c38 0%, #2e7123 100%) !important;
  color: #f4ffe6 !important;
  font-size: 12px !important;
  font-weight: 900 !important;
}

/* 5) NUT GIA VANG GIONG TRANG TRAI */
[data-page="upgrade"] .upgrade-card .btn,
[data-page="upgrade"] .card-upgrade .btn,
[data-page="upgrade"] .shop-card .btn,
[data-page="upgrade"] .upgrade-item .btn,
[data-page="upgrade"] .upgrade-card button,
[data-page="upgrade"] .card-upgrade button,
[data-page="upgrade"] .shop-card button,
[data-page="upgrade"] .upgrade-item button,
[data-page="upgrade"] .upgrade-card .price,
[data-page="upgrade"] .card-upgrade .price,
[data-page="upgrade"] .shop-card .price,
[data-page="upgrade"] .upgrade-item .price {
  min-width: 112px !important;
  min-height: 48px !important;
  padding: 0 16px !important;
  border-radius: 16px !important;
  border: 0 !important;
  background: linear-gradient(180deg, #ffd94f 0%, #f2b60e 100%) !important;
  color: #4c2a00 !important;
  font-size: 14px !important;
  font-weight: 1000 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow:
    inset 0 2px 0 rgba(255,255,255,.35),
    0 5px 14px rgba(0,0,0,.15) !important;
}

/* 6) TRANG THAI DAY/MAX */
[data-page="upgrade"] .upgrade-card .btn[disabled],
[data-page="upgrade"] .card-upgrade .btn[disabled],
[data-page="upgrade"] .shop-card .btn[disabled],
[data-page="upgrade"] .upgrade-item .btn[disabled],
[data-page="upgrade"] .upgrade-card button[disabled],
[data-page="upgrade"] .card-upgrade button[disabled],
[data-page="upgrade"] .shop-card button[disabled],
[data-page="upgrade"] .upgrade-item button[disabled] {
  background: linear-gradient(180deg, #b8a66d 0%, #927b43 100%) !important;
  color: rgba(49,31,10,.88) !important;
  opacity: 1 !important;
}

/* 7) MOBILE */
@media (max-width: 430px) {
  [data-page="upgrade"] .upgrade-card,
  [data-page="upgrade"] .card-upgrade,
  [data-page="upgrade"] .shop-card,
  [data-page="upgrade"] .upgrade-item {
    grid-template-columns: 56px 1fr auto !important;
    gap: 10px !important;
    min-height: 100px !important;
    padding: 12px !important;
  }

  [data-page="upgrade"] .upgrade-card .icon,
  [data-page="upgrade"] .card-upgrade .icon,
  [data-page="upgrade"] .shop-card .icon,
  [data-page="upgrade"] .upgrade-item .icon,
  [data-page="upgrade"] .upgrade-card .thumb,
  [data-page="upgrade"] .card-upgrade .thumb,
  [data-page="upgrade"] .shop-card .thumb,
  [data-page="upgrade"] .upgrade-item .thumb {
    width: 50px !important;
    height: 50px !important;
    min-width: 50px !important;
    min-height: 50px !important;
  }

  [data-page="upgrade"] .upgrade-card h3,
  [data-page="upgrade"] .card-upgrade h3,
  [data-page="upgrade"] .shop-card h3,
  [data-page="upgrade"] .upgrade-item h3 {
    font-size: 17px !important;
  }

  [data-page="upgrade"] .upgrade-card .btn,
  [data-page="upgrade"] .card-upgrade .btn,
  [data-page="upgrade"] .shop-card .btn,
  [data-page="upgrade"] .upgrade-item .btn,
  [data-page="upgrade"] .upgrade-card button,
  [data-page="upgrade"] .card-upgrade button,
  [data-page="upgrade"] .shop-card button,
  [data-page="upgrade"] .upgrade-item button,
  [data-page="upgrade"] .upgrade-card .price,
  [data-page="upgrade"] .card-upgrade .price,
  [data-page="upgrade"] .shop-card .price,
  [data-page="upgrade"] .upgrade-item .price {
    min-width: 96px !important;
    min-height: 44px !important;
    font-size: 13px !important;
  }
}

/* ===== END GV_UPGRADE_FARM_STYLE_V1 ===== */



/* ===== GV_UPGRADE_RESTYLE_V1 ===== */

/* CHI AP DUNG CHO TAB NANG CAP */
[data-page="upgrade"],
.page-section[data-page="upgrade"]{
  display:grid !important;
  gap:12px !important;
  padding-bottom:100px !important;
}

/* XOA CAC KHOI HINH LON/SCENE O TAB NANG CAP */
[data-page="upgrade"] .farm-scene,
[data-page="upgrade"] .hero-scene,
[data-page="upgrade"] .scene-card,
[data-page="upgrade"] .farm-hero,
[data-page="upgrade"] .farm-banner,
[data-page="upgrade"] .top-banner,
[data-page="upgrade"] .banner-card{
  display:none !important;
}

/* KHUNG CHUNG KIEU TRANG TRAI */
[data-page="upgrade"] .upgrade-section,
[data-page="upgrade"] .quick-section,
[data-page="upgrade"] .upgrade-panel,
[data-page="upgrade"] .upgrade-wrap,
[data-page="upgrade"] .page-block,
[data-page="upgrade"] .section-block{
  position:relative !important;
  overflow:hidden !important;
  border-radius:26px !important;
  padding:12px !important;
  background:linear-gradient(180deg,#1f5c2b 0%, #103c1f 100%) !important;
  border:2px solid rgba(223,196,109,.28) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 10px 24px rgba(0,0,0,.20) !important;
}

[data-page="upgrade"] .upgrade-section::before,
[data-page="upgrade"] .quick-section::before,
[data-page="upgrade"] .upgrade-panel::before,
[data-page="upgrade"] .upgrade-wrap::before,
[data-page="upgrade"] .page-block::before,
[data-page="upgrade"] .section-block::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  pointer-events:none !important;
  background:
    radial-gradient(circle at 14px 14px, #e8ff9f 0 4px, transparent 5px),
    radial-gradient(circle at calc(100% - 14px) 14px, #93db46 0 5px, transparent 6px),
    radial-gradient(circle at 16px calc(100% - 16px), #72c03b 0 5px, transparent 6px),
    radial-gradient(circle at calc(100% - 16px) calc(100% - 16px), #e8ff9f 0 4px, transparent 5px);
  opacity:.82 !important;
}

/* TIEU DE KIEU BANG GO */
[data-page="upgrade"] .section-head,
[data-page="upgrade"] .block-head,
[data-page="upgrade"] .panel-head{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:8px !important;
  margin-bottom:10px !important;
}

[data-page="upgrade"] .section-head h2,
[data-page="upgrade"] .block-head h2,
[data-page="upgrade"] .panel-head h2,
[data-page="upgrade"] .section-title,
[data-page="upgrade"] .block-title{
  display:inline-flex !important;
  align-items:center !important;
  min-height:38px !important;
  padding:0 16px !important;
  border-radius:14px !important;
  font-size:18px !important;
  font-weight:1000 !important;
  line-height:1 !important;
  color:#fff6de !important;
  background:linear-gradient(180deg,#8f5728 0%, #603417 100%) !important;
  border:2px solid rgba(255,221,149,.18) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    0 4px 10px rgba(0,0,0,.16) !important;
}

[data-page="upgrade"] .section-head .secondary-label,
[data-page="upgrade"] .block-head .secondary-label,
[data-page="upgrade"] .panel-head .secondary-label{
  font-size:13px !important;
  font-weight:900 !important;
  color:#bff59b !important;
}

/* GRID CAC O NANG CAP */
[data-page="upgrade"] .upgrade-grid,
[data-page="upgrade"] .quick-grid,
[data-page="upgrade"] .fast-upgrade-grid,
[data-page="upgrade"] .card-grid{
  display:grid !important;
  grid-template-columns:repeat(2, minmax(0,1fr)) !important;
  gap:12px !important;
}

@media (max-width:430px){
  [data-page="upgrade"] .upgrade-grid,
  [data-page="upgrade"] .quick-grid,
  [data-page="upgrade"] .fast-upgrade-grid,
  [data-page="upgrade"] .card-grid{
    grid-template-columns:1fr !important;
  }
}

/* THE NANG CAP KIEU DEP GIONG TRANG TRAI */
[data-page="upgrade"] .upgrade-card,
[data-page="upgrade"] .quick-card,
[data-page="upgrade"] .shop-card,
[data-page="upgrade"] .feature-card,
[data-page="upgrade"] .upgrade-grid > *,
[data-page="upgrade"] .quick-grid > *,
[data-page="upgrade"] .fast-upgrade-grid > *{
  position:relative !important;
  overflow:hidden !important;
  min-height:128px !important;
  padding:14px !important;
  border-radius:22px !important;
  background:linear-gradient(180deg,#1f6a31 0%, #124624 100%) !important;
  border:1px solid rgba(212,255,148,.22) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 6px 14px rgba(0,0,0,.12) !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:space-between !important;
  gap:10px !important;
}

[data-page="upgrade"] .upgrade-card::before,
[data-page="upgrade"] .quick-card::before,
[data-page="upgrade"] .shop-card::before,
[data-page="upgrade"] .feature-card::before,
[data-page="upgrade"] .upgrade-grid > *::before,
[data-page="upgrade"] .quick-grid > *::before,
[data-page="upgrade"] .fast-upgrade-grid > *::before{
  content:"" !important;
  position:absolute !important;
  width:28px !important;
  height:28px !important;
  right:-4px !important;
  top:-4px !important;
  border-radius:50% !important;
  background:
    radial-gradient(circle at 30% 30%, #dbff73 0 22%, transparent 23% 100%),
    radial-gradient(circle at 72% 60%, #6fba37 0 26%, transparent 27% 100%);
  opacity:.70 !important;
}

/* ICON */
[data-page="upgrade"] .icon-box,
[data-page="upgrade"] .upgrade-icon,
[data-page="upgrade"] .feature-icon{
  width:54px !important;
  height:54px !important;
  border-radius:16px !important;
  background:linear-gradient(180deg,#2a7d3a 0%, #1a5b2c 100%) !important;
  display:grid !important;
  place-items:center !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08) !important;
}

/* TEXT */
[data-page="upgrade"] h3,
[data-page="upgrade"] .card-title{
  font-size:18px !important;
  line-height:1.18 !important;
  margin:0 !important;
  font-weight:1000 !important;
  color:#fffef5 !important;
}

[data-page="upgrade"] p,
[data-page="upgrade"] .card-desc,
[data-page="upgrade"] .desc{
  margin:0 !important;
  font-size:13px !important;
  line-height:1.35 !important;
  color:#e9f4e6 !important;
}

/* NUT GIA / BUTTON */
[data-page="upgrade"] .btn,
[data-page="upgrade"] button,
[data-page="upgrade"] .buy-btn,
[data-page="upgrade"] .action-btn,
[data-page="upgrade"] .upgrade-btn{
  min-height:42px !important;
  border-radius:999px !important;
  padding:0 16px !important;
  font-size:14px !important;
  font-weight:1000 !important;
  border:0 !important;
  color:#402300 !important;
  background:linear-gradient(180deg,#ffd84d 0%, #f0b40a 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.35),
    0 4px 10px rgba(0,0,0,.12) !important;
}

[data-page="upgrade"] .btn:disabled,
[data-page="upgrade"] button:disabled,
[data-page="upgrade"] .buy-btn:disabled,
[data-page="upgrade"] .action-btn:disabled,
[data-page="upgrade"] .upgrade-btn:disabled{
  color:#7d744e !important;
  background:linear-gradient(180deg,#cfc28a 0%, #a99a65 100%) !important;
  opacity:1 !important;
}

/* GIA NHO / CHIP */
[data-page="upgrade"] .price,
[data-page="upgrade"] .price-chip,
[data-page="upgrade"] .cost-chip,
[data-page="upgrade"] .level-chip{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:28px !important;
  padding:0 10px !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.10) !important;
  color:#effdde !important;
  font-size:12px !important;
  font-weight:900 !important;
}

/* THEM KHOANG TRANG DE NHIN GON */
[data-page="upgrade"] .row,
[data-page="upgrade"] .card-body,
[data-page="upgrade"] .card-meta{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:8px !important;
  align-items:center !important;
}

/* ===== END GV_UPGRADE_RESTYLE_V1 ===== */