.gm-panel { margin: 4px 0 14px; padding: 14px; border-radius: 14px; color: #fff;
  background: linear-gradient(135deg,#1e3c72,#2a5298); font-family: "Khmer OS Battambang","Noto Sans Khmer",Arial,sans-serif; }
.gm-panel.hidden, #gmBoard.hidden { display: none; }
.gm-top { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.gm-lv b { display: block; font-size: 20px; } .gm-lv span { font-size: 14px; opacity: .9; }
.gm-streak { text-align: center; font-size: 22px; line-height: 1.1; }
.gm-streak b { font-size: 24px; } .gm-streak span { display: block; font-size: 11px; opacity: .9; }
.gm-bar { height: 10px; margin: 10px 0 4px; border-radius: 6px; background: rgba(255,255,255,.25); overflow: hidden; }
.gm-bar i { display: block; height: 100%; background: #facc15; border-radius: 6px; }
.gm-next { opacity: .85; font-size: 12px; }
.gm-panel h4 { margin: 12px 0 6px; font-size: 15px; }
.gm-quests { list-style: none; margin: 0; padding: 0; }
.gm-quests li { display: flex; align-items: center; gap: 8px; padding: 7px 9px; margin: 4px 0; border-radius: 9px;
  background: rgba(255,255,255,.12); font-size: 14px; }
.gm-quests li.done { background: rgba(34,197,94,.35); }
.gm-quests em { font-style: normal; opacity: .85; font-size: 12px; }
.gm-quests b { margin-left: auto; color: #facc15; }
.gm-badges { display: grid; grid-template-columns: repeat(5,1fr); gap: 6px; }
.gm-badge { text-align: center; font-size: 22px; padding: 6px 2px; border-radius: 9px; background: rgba(255,255,255,.1);
  filter: grayscale(1); opacity: .4; }
.gm-badge.on { filter: none; opacity: 1; background: rgba(250,204,21,.25); }
.gm-badge small { display: block; font-size: 9.5px; line-height: 1.3; margin-top: 2px; }
.gm-boardbtn { width: 100%; margin-top: 12px; background: #facc15 !important; color: #1e293b !important; font-weight: 800; }
.gm-tabs { display: flex; gap: 6px; margin-bottom: 8px; }
.gm-tabs button { flex: 1; padding: 9px; border: 1px solid #c3ccdb; border-radius: 8px; background: #f4f7fc; font: inherit; }
.gm-tabs button.on { background: #1e3c72; color: #fff; border-color: #1e3c72; }
.gm-rank { list-style: none; margin: 0; padding: 0; max-height: 55vh; overflow: auto; }
.gm-rank li { display: flex; align-items: center; gap: 10px; padding: 8px; border-bottom: 1px solid #e2e8f0; }
.gm-rank li.me { background: #fef9c3; border-radius: 8px; }
.gm-no { width: 30px; text-align: center; font-size: 18px; font-weight: 800; }
.gm-name { flex: 1; } .gm-name small { display: block; color: #64748b; font-size: 12px; }
.gm-wait { text-align: center; color: #475569; }
.gm-gain { margin: 12px 0; padding: 12px; border-radius: 12px; background: #eff6ff; border: 1px solid #bfdbfe; color: #1e293b; }
.gm-gain.muted, .gm-gain .muted { color: #64748b; }
.gm-plus { text-align: center; font-size: 28px; font-weight: 800; color: #1d4ed8; }
.gm-gain ul { list-style: none; padding: 0; margin: 6px 0; font-size: 14px; }
.gm-gain li { display: flex; justify-content: space-between; padding: 3px 0; border-bottom: 1px dashed #cbd5e1; }
.gm-gain li b { color: #16a34a; }
.gm-up { font-weight: 800; color: #b45309; margin: 6px 0; }
.gm-wallet { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 2px 8px;
  margin-top: 10px; padding: 8px 10px; border-radius: 10px; background: rgba(255,255,255,.14); }
.gm-wallet b { font-size: 18px; color: #facc15; } .gm-wallet small { width: 100%; font-size: 12px; opacity: .9; }
.gm-redeem { margin: 12px 0 4px; text-align: center; }
.gm-redeem button { width: 100%; padding: 13px; border: 0; border-radius: 11px; font: inherit; font-weight: 800;
  color: #1e293b; background: #facc15; cursor: pointer; }
.gm-redeem button:disabled { background: #e2e8f0; color: #64748b; cursor: not-allowed; }
.gm-redeem small { display: block; margin-top: 4px; color: #475569; }
.gm-or { margin-top: 8px; color: #94a3b8; font-size: 13px; }
