/* 《收租人生》— 獨立品牌色票（不沿用 agentulife 橘，也不用課程藍圖色） */
:root{
  --bg:#0F1720; --panel:#18232F; --panel2:#1F2D3D; --line:#2B3B4E;
  --gold:#E8B84B; --gold-dim:#8A7534;
  --txt:#E6EDF3; --muted:#8A9BA8; --green:#3FBF7F; --gene:#7FD4E8;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0;background:var(--bg);color:var(--txt)}
body{
  font-family:"Noto Sans TC",-apple-system,"Segoe UI",system-ui,sans-serif;
  font-size:15px;line-height:1.5;
  max-width:520px;margin:0 auto;padding:0 12px 28px;
}
.mono{font-family:"Roboto Mono",ui-monospace,Menlo,Consolas,monospace}

/* ---------- 頂部 ---------- */
header{position:sticky;top:0;z-index:5;background:var(--bg);padding-top:12px}
.hero{
  background:linear-gradient(160deg,var(--panel2),var(--panel));
  border:1px solid var(--line);border-radius:14px;padding:14px 16px;
}
.stage{display:flex;align-items:baseline;gap:8px}
.stage b{font-size:20px;font-weight:900;letter-spacing:.5px}
.stage span{font-size:12px;color:var(--gold)}
.cash{font-size:30px;font-weight:900;margin:6px 0 0;letter-spacing:-.5px}
.cash::before{content:"$";font-size:18px;color:var(--gold);margin-right:3px;vertical-align:4px}
.persec{color:var(--green);font-size:13px;font-weight:700}

.track{height:4px;background:#0B1119;border-radius:99px;overflow:hidden;margin:10px 0 6px}
.track i{display:block;height:100%;background:linear-gradient(90deg,var(--gold-dim),var(--gold));transition:width .3s}
.nextline{font-size:11.5px;color:var(--muted);display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.nextline b{color:var(--txt)}
.nextline .pct{color:var(--gold);font-weight:700}
.nextline .need{margin-left:auto;opacity:.7}

/* ---------- 基因 / 進化 ---------- */
.gene{
  display:flex;align-items:center;gap:10px;margin-top:10px;
  background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:10px 12px;
}
.gene .lbl{font-size:11px;color:var(--muted)}
.gene .val{font-size:17px;font-weight:900;color:var(--gene)}
.gene .bonus{font-size:12px;color:var(--green);font-weight:700}
#prestigeBtn{
  margin-left:auto;border:0;border-radius:10px;padding:10px 14px;
  background:linear-gradient(135deg,#2E6E8E,#3E9BC4);color:#fff;
  font-family:inherit;font-size:13px;font-weight:700;cursor:pointer;
}
#prestigeBtn:disabled{background:#223140;color:#5C6E7E;cursor:not-allowed}
#prestigeBtn .dim{font-weight:400;font-size:11px;opacity:.8}

/* ---------- 買量切換 ---------- */
.buybar{display:flex;gap:6px;margin:14px 0 8px}
.buybar button{
  flex:1;border:1px solid var(--line);background:var(--panel);color:var(--muted);
  border-radius:9px;padding:7px 0;font-family:inherit;font-size:13px;font-weight:700;cursor:pointer;
}
.buybar button.on{background:var(--gold);border-color:var(--gold);color:#1A1205}

/* ---------- 物件列 ---------- */
#list{display:flex;flex-direction:column;gap:7px}
.row{
  display:flex;align-items:center;gap:11px;width:100%;text-align:left;
  background:var(--panel);border:1px solid var(--line);border-radius:12px;
  padding:10px 12px;color:var(--txt);font-family:inherit;cursor:pointer;
  transition:border-color .15s,transform .06s;
}
.row.afford{border-color:var(--gold-dim)}
.row.afford .cost{color:var(--gold)}
.row:active{transform:scale(.99)}
.row.locked{opacity:.45;cursor:not-allowed}
.row.flash{animation:fl .35s ease-out}
@keyframes fl{0%{background:#2D4232}100%{background:var(--panel)}}

.ico{font-size:25px;width:34px;text-align:center;flex-shrink:0}
.mid{flex:1;min-width:0}
.r1{display:flex;align-items:baseline;gap:7px}
.nm{font-weight:700;font-size:15px}
.cnt{font-size:12px;color:var(--gold);font-weight:700}
.r2{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bar{height:3px;background:#0B1119;border-radius:99px;overflow:hidden;margin-top:5px}
.bar i{display:block;height:100%;background:var(--gene);transition:width .25s}

.buy{text-align:right;flex-shrink:0}
.cost{font-weight:900;font-size:14px;color:var(--muted)}
.cost::before{content:"$";font-size:10px;opacity:.7;margin-right:1px}
.qty{font-size:10.5px;color:var(--muted);opacity:.75}

/* ---------- 離線彈窗 ---------- */
.modal{
  position:fixed;inset:0;background:rgba(6,10,14,.82);
  display:none;align-items:center;justify-content:center;padding:24px;z-index:50;
}
.modal.show{display:flex}
.card{
  background:var(--panel2);border:1px solid var(--line);border-radius:16px;
  padding:24px 22px;max-width:340px;width:100%;text-align:center;
}
.card h2{margin:0 0 4px;font-size:18px;font-weight:900}
.card .big{font-size:30px;font-weight:900;color:var(--gold);margin:12px 0 2px}
.card .big::before{content:"$";font-size:17px;margin-right:2px;vertical-align:3px}
.card p{margin:4px 0;font-size:12.5px;color:var(--muted)}
.card button{
  margin-top:16px;width:100%;border:0;border-radius:10px;padding:12px;
  background:var(--gold);color:#1A1205;font-family:inherit;font-size:15px;font-weight:900;cursor:pointer;
}

footer{margin-top:20px;text-align:center}
#resetBtn{background:none;border:0;color:#4A5C6D;font-family:inherit;font-size:11px;cursor:pointer;text-decoration:underline}

/* ---------- 手動上班 ---------- */
.work{
  position:relative;overflow:hidden;
  display:flex;align-items:center;justify-content:center;gap:10px;
  width:100%;margin-top:10px;border:0;border-radius:12px;padding:14px;
  background:linear-gradient(135deg,#C9A03C,#E8B84B);color:#1A1205;
  font-family:inherit;font-size:16px;font-weight:900;cursor:pointer;
  box-shadow:0 3px 0 #8A7534;transition:transform .05s,box-shadow .05s;
}
.work:active{transform:translateY(3px);box-shadow:0 0 0 #8A7534}
.work .wv{font-size:14px;opacity:.75}
.pop{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  pointer-events:none;font-weight:900;font-size:15px;color:#1A1205;
  animation:pop .7s ease-out forwards;
}
@keyframes pop{
  0%{opacity:1;transform:translate(-50%,-50%)}
  100%{opacity:0;transform:translate(-50%,-190%)}
}

/* ---------- 帳號列 ---------- */
.acct{
  display:flex;align-items:center;gap:10px;
  padding:9px 12px;margin:10px 0 0;
  background:var(--panel);border:1px solid var(--line);border-radius:11px;
  font-size:12px;
}
.acct-left{flex:1;min-width:0;color:var(--muted);line-height:1.45}
.acct-left b{color:var(--txt)}
.acct-left .bal{color:var(--gold);font-weight:900}
.loginBtn{
  border:0;border-radius:9px;padding:8px 13px;background:#06C755;color:#fff;
  font-family:inherit;font-size:12.5px;font-weight:900;cursor:pointer;white-space:nowrap;
}
.linkBtn{background:none;border:0;color:#5A6B82;font-family:inherit;font-size:11px;
  cursor:pointer;text-decoration:underline;white-space:nowrap}

/* ---------- 分頁 ---------- */
.tabs{display:flex;gap:6px;margin-top:12px}
.tabs button{
  flex:1;border:1px solid var(--line);background:var(--panel);color:var(--muted);
  border-radius:10px;padding:9px 0;font-family:inherit;font-size:14px;font-weight:700;cursor:pointer;
}
.tabs button.on{background:var(--panel2);border-color:var(--gold-dim);color:var(--txt)}

/* ---------- 抽卡 ---------- */
.gbox{
  background:var(--panel);border:1px solid var(--line);border-radius:13px;
  padding:14px;margin-top:12px;text-align:center;
}
.gicon{font-size:32px;margin-bottom:6px}
.gbox p{color:var(--muted);font-size:12.5px;margin:0 0 12px}
.grow{display:flex;gap:10px;text-align:left}
.grow>div{flex:1}
.grow .lbl{font-size:10.5px;color:var(--muted)}
.grow .val{font-size:18px;font-weight:900}
.grow .green{color:var(--green)}
.pity{margin:12px 0 4px;text-align:left}
.pity-t{font-size:11px;color:var(--muted);margin-bottom:4px}
.gbtns{display:flex;gap:8px;margin-top:12px}
.gbtns button{
  flex:1;border:1px solid var(--line);background:var(--panel2);color:var(--txt);
  border-radius:10px;padding:11px 0;font-family:inherit;font-size:14px;font-weight:900;cursor:pointer;
  display:flex;flex-direction:column;gap:2px;align-items:center;
}
.gbtns button span{font-size:11px;font-weight:400;color:var(--muted)}
.gbtns button span::before{content:"💎 "}
.gbtns .primary{background:linear-gradient(135deg,#C9A03C,#E8B84B);border:0;color:#1A1205}
.gbtns .primary span{color:#5C4A1E}
.gbtns button:disabled{opacity:.45;cursor:not-allowed}
.odds{display:inline-block;margin-top:11px;font-size:11.5px;color:var(--muted)}

.gh{font-size:13px;font-weight:900;margin:20px 0 8px;color:var(--muted)}
.cardgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}
.gcard{
  background:var(--panel);border:1px solid var(--line);border-radius:11px;
  padding:10px 6px;text-align:center;position:relative;overflow:hidden;
}
.gcard .e{font-size:26px;line-height:1.2}
.gcard .n{font-size:11.5px;font-weight:700;margin-top:3px}
.gcard .s{font-size:10px;color:var(--gold);letter-spacing:-1px}
.gcard .b{font-size:10px;color:var(--green);margin-top:2px}
.gcard .r{
  position:absolute;top:0;left:0;font-size:9px;font-weight:900;
  padding:1px 6px;border-bottom-right-radius:8px;color:#0F1720;
}
.gcard.ur{box-shadow:0 0 0 1px #E06A5B inset, 0 0 14px rgba(224,106,91,.35)}
.gcard.ssr{box-shadow:0 0 0 1px var(--gold) inset, 0 0 11px rgba(232,184,75,.28)}

/* 抽卡結果 */
.pulls{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px;margin-top:12px}
.pull-head{font-size:12px;color:var(--muted);margin-top:14px}
.gcard .new{position:absolute;top:0;right:0;font-size:9px;font-weight:900;
  background:var(--green);color:#06210F;padding:1px 6px;border-bottom-left-radius:8px}
@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.pulls .gcard{animation:rise .3s ease-out backwards}

/* ---------- footer / toast ---------- */
footer{margin-top:24px;text-align:center;font-size:11px;color:#4A5C6D}
footer a{color:#5A6B82}
footer .dot{margin:0 6px}
footer .disclaim{margin:10px 16px 0;line-height:1.6;font-size:10.5px;color:#3E4E5C}
#toast{
  position:fixed;left:50%;bottom:22px;transform:translateX(-50%);
  background:var(--panel2);border:1px solid var(--line);border-radius:10px;
  padding:10px 16px;font-size:13px;display:none;z-index:60;max-width:90vw;text-align:center;
}
#toast.show{display:block}
#toast.err{border-color:#E06A5B;color:#E06A5B}

/* ---------- 賽季通行證 ---------- */
.srow{display:flex;gap:10px;text-align:left}
.srow>div{flex:1}
.srow .lbl{font-size:10.5px;color:var(--muted)}
.srow .val{font-size:18px;font-weight:900}
.hint{font-size:11px;color:var(--muted);margin:10px 0 0!important}
.tracklegend{display:flex;gap:14px;font-size:10.5px;color:var(--muted);margin-bottom:6px;padding-left:44px}
.tracklegend .fr::before,.tracklegend .pd::before{
  content:"";display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:4px;vertical-align:-1px}
.tracklegend .fr::before{background:#3A4C5E}
.tracklegend .pd::before{background:var(--gold)}

.trow{display:flex;align-items:center;gap:7px;margin-bottom:6px}
.trow .lv{
  width:37px;flex:none;text-align:center;font-family:ui-monospace,monospace;
  font-size:12px;font-weight:900;color:var(--muted);
}
.trow.reached .lv{color:var(--gold)}
.cell{
  flex:1;display:flex;align-items:center;justify-content:center;gap:5px;
  border-radius:9px;padding:9px 6px;font-size:12px;font-weight:700;
  border:1px solid var(--line);background:var(--panel);color:var(--muted);
  cursor:default;font-family:inherit;
}
.cell.paid{border-color:var(--gold-dim)}
.cell.can{cursor:pointer;color:var(--txt);border-color:var(--green);background:#16301F}
.cell.can:active{transform:scale(.98)}
.cell.done{opacity:.5;color:var(--green)}
.cell.locked{opacity:.45}
.cell .ms{font-size:9px;color:var(--gold)}

/* ---------- 房貸 ---------- */
.loan{background:var(--panel);border:1px solid var(--line);border-radius:12px;
  padding:11px 13px;margin-top:10px}
.loan-head{display:flex;align-items:center;justify-content:space-between;font-size:13px}
.loan-head b{font-weight:900}
.loan-state{font-size:11.5px;color:var(--muted)}
.loan .track{margin:8px 0 2px}
.loan .track i{background:linear-gradient(90deg,#8A4B3C,#E06A5B)}
.loan-body{margin-top:8px}
.loan-row{display:flex;align-items:center;gap:9px;margin-top:7px}
.loan-row .mono{flex:1;font-size:13px;font-weight:900;color:var(--gold)}
.loan-row button{border:0;border-radius:9px;padding:8px 15px;background:var(--panel2);
  border:1px solid var(--gold-dim);color:var(--gold);
  font-family:inherit;font-size:13px;font-weight:900;cursor:pointer}
.loan-row button:disabled{opacity:.4;cursor:not-allowed;border-color:var(--line);color:var(--muted)}
.loan-note{font-size:10.5px;color:var(--muted);margin-top:6px;line-height:1.5}
input[type=range]{width:100%;accent-color:var(--gold);background:transparent}

/* ---------- 隔套裝潢 ---------- */
.reno{
  flex:none;border:1px solid var(--gene);background:transparent;color:var(--gene);
  border-radius:8px;padding:5px 8px;font-family:inherit;font-size:10.5px;font-weight:900;
  cursor:pointer;line-height:1.25;text-align:center;white-space:nowrap;
}
.reno:disabled{opacity:.3;cursor:not-allowed;border-color:var(--line);color:var(--muted)}
.reno small{display:block;font-size:9px;font-weight:400;opacity:.8}
.renoTag{font-size:10px;color:var(--gene);font-weight:700;margin-left:4px}

/* 頂部金額：完整數字模式下可能很長，允許換行、可點擊切換 */
.cash{cursor:pointer;word-break:break-all;line-height:1.15;user-select:none}
.persec{word-break:break-all}

/* 按鈕內文字每 0.1 秒會重畫。讓子元素不接收點擊，點擊一律落在按鈕本身，
   否則手指按在會被換掉的文字上，按下到放開之間元素消失，點擊就不會觸發 */
#prestigeBtn > *, .reno > *, .work > *, .gbtns button > * { pointer-events: none; }

/* ---------- 房市行情 ---------- */
.market{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:11px 13px;margin-top:10px}
.mk-sub{font-size:10px;color:var(--muted);font-weight:400}
.mk-idx{font-size:15px;font-weight:900}
#mkChart{display:block;width:100%;height:56px;margin-top:6px}

/* ---------- 法拍 ---------- */
.au-item{display:flex;gap:10px;align-items:center;margin-top:8px}
.au-emoji{font-size:28px}
.au-item b{font-size:14px}
.au-type{font-size:11px;color:var(--muted);margin-top:2px;line-height:1.5}
.au-tag{display:inline-block;font-size:10px;font-weight:900;padding:1px 7px;border-radius:99px;margin-right:5px;color:#0F1720}
.au-tag.ok{background:#3FBF7F}
.au-tag.warn{background:#E8B84B}
.au-grid{display:flex;gap:8px;margin:10px 0 6px}
.au-grid>div{flex:1;background:var(--panel2);border-radius:8px;padding:6px 8px}
.au-grid .lbl{font-size:10px;color:var(--muted)}
.au-grid .mono{font-size:13px;font-weight:900}
#auBtn{border:0;border-radius:9px;padding:8px 15px;background:linear-gradient(135deg,#C9A03C,#E8B84B);
  color:#1A1205;font-family:inherit;font-size:13px;font-weight:900;cursor:pointer}
#auBtn:disabled{background:var(--panel2);color:var(--muted);cursor:not-allowed}
#auChance{color:var(--gold)}

/* ---------- 土地合併 ---------- */
#mgFrom{width:100%;margin-top:8px;background:#0D141C;border:1px solid var(--line);border-radius:8px;
  padding:7px 9px;color:var(--txt);font-family:inherit;font-size:13px}
.mg-impact{font-size:11.5px!important;font-weight:700!important;color:var(--muted)!important;line-height:1.5}
#mgBtn{border:0;border-radius:9px;padding:8px 15px;background:linear-gradient(135deg,#2E6E8E,#3E9BC4);
  color:#fff;font-family:inherit;font-size:13px;font-weight:900;cursor:pointer}
#mgBtn:disabled{background:var(--panel2);color:var(--muted);cursor:not-allowed}
#mgBusy .track i{background:linear-gradient(90deg,#2E6E8E,#7FD4E8)}

/* ---------- 自建 ---------- */
#selfSlots{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.slot{background:var(--panel2);border-radius:10px;padding:9px 10px}
.sl-title{font-size:10.5px;color:var(--muted);margin-bottom:6px}
.sl-empty{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.sl-plan{border:1px solid var(--line);background:var(--panel);color:var(--txt);border-radius:9px;
  padding:7px 5px;font-family:inherit;font-size:11.5px;cursor:pointer;text-align:center;line-height:1.35}
.sl-plan:disabled{opacity:.4;cursor:not-allowed}
.sl-plan small{display:block;font-size:9.5px;color:var(--muted);margin-top:2px}
.sl-plan small.g, .slot small.g{color:#3FBF7F}
.sl-plan > *, .sl-rebuild > *{pointer-events:none}
.sl-cancel{grid-column:1/-1;background:none;border:0;color:var(--muted);font-family:inherit;font-size:11px;
  text-decoration:underline;cursor:pointer}
.sl-busy .sl-txt, .sl-done .sl-txt{font-size:12px;line-height:1.5}
.sl-busy .track{margin-top:6px}
.sl-busy .track i{background:linear-gradient(90deg,#8A7534,#E8B84B)}
.sl-done{display:flex;align-items:center;gap:8px}
.sl-done .sl-txt{flex:1}
.sl-rebuild{border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:8px;
  padding:5px 10px;font-family:inherit;font-size:11px;cursor:pointer}
@media (max-width:420px){ .sl-empty{grid-template-columns:1fr} }

/* 帶 hidden 屬性一律隱藏。否則元件自己的 display:flex/grid 會蓋掉瀏覽器預設，
   hidden 失效（自建空地多出「改建」按鈕就是這樣） */
[hidden]{display:none!important}

/* 通行證：一鍵領取與升級說明 */
.claimAll{display:block;width:100%;margin-top:12px;border:0;border-radius:11px;padding:12px;
  background:linear-gradient(135deg,#2C8A57,#3FBF7F);color:#06210F;
  font-family:inherit;font-size:14px;font-weight:900;cursor:pointer}
.claimAll:disabled{opacity:.5;cursor:wait}
.xpHow{text-align:left;line-height:1.7;border-top:1px solid var(--line);padding-top:9px}
.xpHow b{color:var(--txt)}

/* ---------- 包租代管 ---------- */
#mgmtReserve{flex:1;background:#0D141C;border:1px solid var(--line);border-radius:8px;
  padding:7px 9px;color:var(--txt);font-family:inherit;font-size:13px}
#mgmtBtn{flex:none;border:0;border-radius:9px;padding:8px 15px;background:var(--panel2);
  border:1px solid var(--gold-dim);color:var(--gold);font-family:inherit;font-size:13px;font-weight:900;cursor:pointer}
#mgmtBtn.on{background:linear-gradient(135deg,#2C8A57,#3FBF7F);border-color:transparent;color:#06210F}
.sub-list{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.sub-row{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:9px;padding:7px 9px}
.sub-txt{flex:1;font-size:12px;line-height:1.45;min-width:0}
.sub-txt small{display:block;color:var(--muted);font-size:10.5px}
.sub-btn{flex:none;min-width:96px}
.sub-btn > *, #cityBtn > *{pointer-events:none}
.ending-card{text-align:center}
.ending-moon{font-size:56px;line-height:1;margin:4px 0 8px;filter:drop-shadow(0 0 18px rgba(245,215,120,.55))}
.ending-stats{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:12px 0;text-align:left}
.ending-stats div{border:1px solid var(--line);border-radius:9px;padding:6px 9px;font-size:11px;color:var(--muted)}
.ending-stats b{display:block;font-size:14px;color:var(--txt)}
.ending-foot{font-size:11px;color:var(--muted)}
.mg-auto{margin:4px 0 8px}
.mg-auto .mk-sub{flex:1;font-size:11px}
#mgAutoBtn.on{background:#3FBF7F;color:#0b1a12;border-color:#3FBF7F}
#fbText{width:100%;box-sizing:border-box;background:var(--bg,#0E1620);color:var(--txt);border:1px solid var(--line);border-radius:9px;padding:9px 10px;font:inherit;font-size:13px;resize:vertical;margin:8px 0}
.fb-hint{font-size:11.5px;color:var(--muted)}
.fb-row{display:flex;gap:8px}
.fb-row button{flex:1}
#fbCancel{background:none;border:1px solid var(--line);color:var(--muted)}
#fbBtn{background:none;border:0;color:#8A9BA8;font-family:inherit;font-size:11px;cursor:pointer;padding:0}
.evt{background:linear-gradient(135deg,rgba(233,180,76,.13),rgba(233,180,76,.03));border:1px solid rgba(233,180,76,.55);border-radius:12px;padding:11px 13px;margin-bottom:10px;animation:evtIn .35s ease-out}
@keyframes evtIn{from{transform:translateY(-6px);opacity:0}to{transform:none;opacity:1}}
.evt-head{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--muted);margin-bottom:6px}
.evt-head b{color:var(--txt)}
.evt-timer{font-size:11px}
.evt-text{font-size:13.5px;line-height:1.6;white-space:pre-line;margin-bottom:9px}
.evt-choices{display:flex;flex-direction:column;gap:6px}
.evt-choices button,.evt-ok{background:var(--panel);color:var(--txt);border:1px solid var(--line);border-radius:9px;font-family:inherit;font-size:13px;font-weight:600;cursor:pointer}
.evt-choices button{text-align:left;padding:8px 11px;line-height:1.35}
.evt-choices button:hover,.evt-ok:hover{border-color:rgba(233,180,76,.7)}
.evt-ok{padding:8px}
.evt-choices button small{display:block;font-size:10.5px;opacity:.75;margin-top:2px;font-weight:400}
.evt-choices button > *, .evt-ok > *{pointer-events:none}
.evt-res{font-size:13.5px;line-height:1.6;margin-bottom:8px}
.evt-eff{font-size:12px;margin-bottom:9px}
.evt-eff .g{color:#3FBF7F}.evt-eff .r{color:#E06A5B}
.evt-ok{width:100%}
.buffline{font-size:11px;color:#E9B44C;margin-top:2px}
.buffline .neg{color:#E06A5B}
.dbox{text-align:left}
.dhead{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:10px;font-size:13.5px}
.dsub{font-size:11px;color:var(--muted)}
.signrow{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;margin-bottom:10px}
.sday{border:1px solid var(--line);border-radius:9px;padding:6px 2px;text-align:center;font-size:10px;color:var(--muted)}
.sday b{display:block;font-size:12px;color:var(--txt);margin-top:2px}
.sday.got{opacity:.45}
.sday.now{border-color:#E9B44C;box-shadow:0 0 0 1px #E9B44C inset}
.sday.card b{color:#B57BFF}
.dbtn{width:100%;padding:10px;border-radius:10px;border:0;font-family:inherit;font-weight:700;font-size:14px;cursor:pointer;background:linear-gradient(135deg,#C9A03C,#E8B84B);color:#1A1205}
.dbtn:disabled{background:var(--panel);color:var(--muted);border:1px solid var(--line);cursor:default}
.dbtn > *, .task button > *{pointer-events:none}
.task{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid var(--line)}
.task:first-child{border-top:0;padding-top:0}
.task .ti{font-size:20px;flex:none}
.task .tm{flex:1;min-width:0;font-size:12.5px}
.task .tm small{display:block;color:var(--muted);font-size:10.5px;margin-top:3px}
.task .track{height:4px;margin-top:5px}
.task button{flex:none;min-width:74px;padding:7px 8px;border-radius:9px;font-family:inherit;font-size:12px;font-weight:700;cursor:pointer;background:linear-gradient(135deg,#C9A03C,#E8B84B);color:#1A1205;border:0}
.task button:disabled{background:none;border:1px solid var(--line);color:var(--muted);cursor:default;font-weight:400}
.task.bonus{background:rgba(233,180,76,.06);border-radius:9px;padding:8px;margin-top:6px;border:1px dashed rgba(233,180,76,.4)}
.tabs button .tdot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#E06A5B;margin-left:5px;vertical-align:2px}
.rk{display:flex;align-items:center;gap:9px;padding:8px 4px;border-top:1px solid var(--line)}
.rk:first-child{border-top:0}
.rk .no{width:28px;text-align:center;font-weight:900;font-size:13px;color:var(--muted);flex:none}
.rk .no.m1{font-size:18px}.rk .no.m2{font-size:17px}.rk .no.m3{font-size:16px}
.rk img,.rk .ph{width:30px;height:30px;border-radius:50%;flex:none;object-fit:cover;background:var(--line)}
.rk .nm{flex:1;min-width:0;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rk .nm small{display:block;font-size:10.5px;color:var(--muted)}
.rk .sc{font-size:13px;font-weight:700;flex:none}
.rk.me{background:rgba(233,180,76,.09);border-radius:9px}
.rk-me{margin-bottom:8px}
.rk-me .rk{border:1px solid rgba(233,180,76,.5);border-radius:10px}
.tabs button{padding-left:4px;padding-right:4px}
.av{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:var(--line);overflow:hidden;flex:none;vertical-align:middle}
.av img{width:100%;height:100%;object-fit:cover}
.acct-left .av{width:22px;height:22px;font-size:14px;margin-right:6px}
.editBtn{background:none;border:0;color:var(--muted);cursor:pointer;font-size:12px;padding:0 4px;font-family:inherit}
.pf-card{text-align:left}
.pf-lbl{display:block;font-size:12px;color:var(--muted);margin:10px 0 6px}
.pf-lbl span{font-size:11px}
.pf-row{display:flex;gap:8px}
#pfName{flex:1;min-width:0;background:var(--bg,#0E1620);color:var(--txt);border:1px solid var(--line);border-radius:9px;padding:9px 10px;font:inherit;font-size:14px}
#pfNameBtn{flex:none;padding:0 16px}
.pf-hint{font-size:11px;color:var(--muted);margin:6px 0 0}
.pf-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.pf-grid button{aspect-ratio:1;border:1px solid var(--line);background:var(--panel);border-radius:10px;font-size:22px;cursor:pointer;padding:0;overflow:hidden}
.pf-grid button img{width:100%;height:100%;object-fit:cover;pointer-events:none}
.pf-grid button.on{border-color:#E9B44C;box-shadow:0 0 0 2px #E9B44C inset}
.pf-grid .line{font-size:10px;color:var(--muted)}
.pf-close{width:100%;margin-top:12px;background:none;border:1px solid var(--line);color:var(--muted)}
.rk .av{width:30px;height:30px;font-size:18px}
/* 彈窗的 .card button 預設是滿版金色大按鈕，名稱／頭像彈窗要個別覆蓋 */
.card #pfNameBtn{width:auto;margin-top:0;padding:0 14px;font-size:13px}
.card .pf-grid button{width:auto;margin-top:0;padding:0;background:var(--panel);border:1px solid var(--line);font-size:22px}
.card .pf-grid button.on{border-color:#E9B44C;box-shadow:0 0 0 2px #E9B44C inset}
.card .pf-close{background:none;border:1px solid var(--line);color:var(--muted);font-weight:400;font-size:13px;padding:10px}
/* ---------- 新手引導 ---------- */
.tut{display:flex;align-items:center;gap:10px;background:rgba(63,191,127,.1);border:1px solid rgba(63,191,127,.55);border-radius:12px;padding:10px 12px;margin-bottom:10px;animation:evtIn .35s ease-out}
.tut-txt{flex:1;font-size:13px;line-height:1.55}
.tut-skip{flex:none;background:none;border:0;color:var(--muted);font-size:11px;font-family:inherit;cursor:pointer;text-decoration:underline}
.tut-glow{animation:tutGlow 1.2s ease-in-out infinite;position:relative;z-index:1}
@keyframes tutGlow{0%,100%{box-shadow:0 0 0 0 rgba(63,191,127,.0)}50%{box-shadow:0 0 0 4px rgba(63,191,127,.75)}}
/* ---------- 晉升畫面 ---------- */
.su-card{text-align:center;animation:suIn .45s cubic-bezier(.2,1.4,.4,1)}
@keyframes suIn{from{transform:scale(.7);opacity:0}to{transform:none;opacity:1}}
.su-icon{font-size:52px;line-height:1;margin-bottom:6px}
.su-kicker{font-size:12px;color:var(--gold);letter-spacing:2px}
.su-unlock{display:inline-block;margin:10px 0 4px;padding:4px 12px;border-radius:99px;background:rgba(233,180,76,.15);color:var(--gold);font-size:13px;font-weight:700}
.card .su-ok{background:none;border:1px solid var(--line);color:var(--muted);font-weight:400;font-size:13px;padding:10px;margin-top:8px}
.confetti{position:fixed;top:-12px;width:8px;height:12px;z-index:60;pointer-events:none;animation:cf linear forwards}
@keyframes cf{to{transform:translateY(105vh) rotate(720deg)}}
/* ---------- 飄字 ---------- */
.floaty{position:fixed;z-index:55;pointer-events:none;font-size:13px;font-weight:800;color:#3FBF7F;text-shadow:0 1px 2px rgba(0,0,0,.6);animation:floaty .9s ease-out forwards;white-space:nowrap}
@keyframes floaty{from{transform:translate(-50%,0);opacity:1}to{transform:translate(-50%,-38px);opacity:0}}
#sfxBtn{background:none;border:0;color:#8A9BA8;font-family:inherit;font-size:11px;cursor:pointer;padding:0}
.oa{border-color:rgba(6,199,85,.5);background:linear-gradient(135deg,rgba(6,199,85,.10),rgba(6,199,85,.02))}
.oa-row{display:flex;gap:8px}
.oa-add,.oa-check{flex:1;text-align:center;padding:10px;border-radius:10px;font-family:inherit;font-size:13px;font-weight:700;cursor:pointer;text-decoration:none}
.oa-add{background:#06C755;color:#fff;border:0}
.oa-check{background:none;border:1px solid var(--line);color:var(--txt)}
.oa-check:disabled{opacity:.5;cursor:default}
.ach-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:6px}
.ach{border:1px solid var(--line);border-radius:10px;padding:7px 6px;text-align:center;background:var(--panel);font-family:inherit;color:var(--txt);cursor:pointer}
.ach > *{pointer-events:none}
.ach .ai{font-size:20px;line-height:1.2}
.ach .an{font-size:11.5px;font-weight:700;margin-top:2px}
.ach .ad{font-size:9.5px;color:var(--muted);margin-top:2px;line-height:1.3}
.ach.lock{opacity:.38;cursor:default;filter:grayscale(1)}
.ach.cur{border-color:#E9B44C;box-shadow:0 0 0 1px #E9B44C inset}
.rk .ttl{display:inline-block;font-size:9.5px;color:#E9B44C;border:1px solid rgba(233,180,76,.5);border-radius:99px;padding:0 6px;margin-left:5px;vertical-align:1px}
.sfx-top{margin-left:auto;align-self:center;background:none;border:1px solid var(--line);border-radius:99px;color:var(--muted);font-family:inherit;font-size:12px;padding:3px 10px;cursor:pointer;line-height:1.4}
.sfx-top.off{opacity:.6}
.rk-tabs{display:flex;gap:6px;margin-bottom:12px}
.rk-tabs button{flex:1;padding:8px;border-radius:9px;border:1px solid var(--line);background:none;color:var(--muted);font-family:inherit;font-size:13px;font-weight:700;cursor:pointer}
.rk-tabs button.on{background:rgba(233,180,76,.15);border-color:#E9B44C;color:var(--txt)}
.wk-rw{display:flex;flex-wrap:wrap;gap:4px;margin:6px 0 10px}
.wk-rw span{font-size:10.5px;border:1px solid var(--line);border-radius:99px;padding:2px 8px;color:var(--muted)}
.wk-rw b{color:var(--gold)}
.fr-card{border:1px solid var(--line);border-radius:11px;padding:10px 12px;margin-bottom:8px}
.fr-lbl{font-size:12px;color:var(--muted);margin-bottom:6px}
.fr-lbl b{color:var(--gold)}
.fr-code{font-size:26px;font-weight:900;letter-spacing:5px;color:var(--gold);margin-bottom:8px}
.fr-row{display:flex;gap:8px}
.fr-row input{flex:1;min-width:0;background:var(--bg,#0E1620);color:var(--txt);border:1px solid var(--line);border-radius:9px;padding:8px 10px;font:inherit;font-size:14px;letter-spacing:2px;text-transform:uppercase}
.fr-row button{flex:none;padding:8px 14px;border-radius:9px;border:0;background:var(--gold);color:#1A1205;font-family:inherit;font-weight:700;font-size:13px;cursor:pointer}
.fr-row button.ghost{background:none;border:1px solid var(--line);color:var(--txt);font-weight:400}
.fr-row button:disabled{opacity:.45;cursor:default}
.fr-gift .fr-row button{flex:1}
.rk .fb{flex:none;margin-left:6px;padding:5px 9px;border-radius:8px;border:1px solid var(--line);background:none;color:var(--txt);font-family:inherit;font-size:12px;cursor:pointer}
.rk .fb:disabled{opacity:.4;cursor:default}
/* ---------- 手機防溢出 ----------
   1. 輸入框字級 < 16px 時，iOS 聚焦會自動放大而且不縮回 → 看起來整頁溢出（viewport 也加了 maximum-scale=1）
   2. 快速連點「上班」會被當成點兩下放大；manipulation 只關雙擊縮放，保留捲動與兩指縮放
   ⚠️ 不要用 touch-action:pan-y：它連兩指縮小都擋掉，iOS 一旦被放大就縮不回來（2026-09-18 踩過） */
html,body{overflow-x:clip;touch-action:manipulation}   /* 用 clip 不用 hidden：hidden 會讓 body 變成捲動容器，頂部 sticky 會失效 */
button,a,.row{touch-action:manipulation}
input,textarea,select{font-size:16px!important}
.modal{overflow-y:auto;align-items:flex-start}
.modal .card{margin:auto 0;max-width:100%;box-sizing:border-box}
.acct-left .chunk{white-space:nowrap;display:inline-block}
.evt-choices button small{overflow-wrap:anywhere}
img{max-width:100%}
.ab-row{border:1px dashed var(--line);border-radius:9px;padding:7px 9px;margin:4px 0 8px}
.ab-top{display:flex;align-items:center;gap:8px}
.ab-top .mk-sub{flex:1;font-size:11px}
#abBtn.on{background:#3FBF7F;color:#0b1a12;border-color:#3FBF7F}
.ab-opts{display:flex;gap:8px;align-items:center;margin-top:6px}
.ab-opts select{flex:1;min-width:0}
.ab-chk{font-size:12px;color:var(--muted);white-space:nowrap}
/* 代標列跟代管／自動合併同一套外觀 */
#abLevel{background:#0D141C;border:1px solid var(--line);border-radius:8px;padding:7px 9px;color:var(--txt);font-family:inherit}
#abBtn,#mgAutoBtn{flex:none;border-radius:9px;padding:6px 13px;background:var(--panel2);border:1px solid var(--gold-dim);
  color:var(--gold);font-family:inherit;font-size:12.5px;font-weight:900;cursor:pointer}
#abBtn:disabled,#mgAutoBtn:disabled{opacity:.45;cursor:not-allowed;border-color:var(--line);color:var(--muted)}
#abBtn.on,#mgAutoBtn.on{background:linear-gradient(135deg,#2C8A57,#3FBF7F);border-color:transparent;color:#06210F}
.ab-chk input{accent-color:#3FBF7F;vertical-align:-2px}
.adpull{width:100%;margin-top:8px;padding:10px;border-radius:10px;border:1px dashed var(--gold-dim);background:none;color:var(--gold);font-family:inherit;font-size:13.5px;font-weight:700;cursor:pointer}
.adpull:disabled{opacity:.45;cursor:default;border-color:var(--line);color:var(--muted)}
.adpull > *{pointer-events:none}
/* ---------- 任務分頁版面 ---------- */
.pass-lv{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.pass-num{font-size:22px;font-weight:900;color:var(--gold);flex:none}
.pass-bar{flex:1;min-width:0}
.pass-bar .pity-t{font-size:11px;color:var(--muted);margin-bottom:4px}
.pass .tracklegend{padding-left:0;margin:4px 0 6px}
.trackstrip{display:flex;gap:6px;overflow-x:auto;padding-bottom:6px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
.tcol{flex:none;width:66px;display:flex;flex-direction:column;gap:4px;scroll-snap-align:start}
.tcol .lv{text-align:center;font-family:ui-monospace,monospace;font-size:11px;font-weight:900;color:var(--muted)}
.tcol.reached .lv{color:var(--gold)}
.tcol.cur .lv{background:var(--gold);color:#1A1205;border-radius:99px}
.tcol .cell{flex:none;padding:8px 2px;font-size:11px;flex-direction:column;gap:1px;min-height:44px}
.pass .claimAll{margin-top:8px}
.pass .gbtns{margin-top:8px}
details.xpHow{font-size:11px;color:var(--muted);margin-top:8px;border-top:1px solid var(--line);padding-top:8px;line-height:1.7}
details.xpHow summary{cursor:pointer;color:var(--txt);font-weight:700}
.ach-head{display:flex;align-items:baseline;gap:8px;width:100%;background:none;border:0;padding:0;color:var(--txt);font-family:inherit;font-size:13.5px;cursor:pointer;text-align:left}
.ach-head .dsub{flex:1}
.ach-arrow{color:var(--muted);font-size:12px}
.ach-latest{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:6px;margin-top:10px}
.ach-latest .al{border:1px solid var(--line);border-radius:9px;padding:6px 8px;font-size:11px;color:var(--muted);line-height:1.4}
.ach-latest .al b{display:block;color:var(--txt);font-size:12.5px}
.ach-latest .al.none b{color:var(--muted);font-weight:400}
/* 獎勵軌捲軸配合深色 */
.trackstrip{scrollbar-width:thin;scrollbar-color:#3A4C5E transparent}
.trackstrip::-webkit-scrollbar{height:6px}
.trackstrip::-webkit-scrollbar-track{background:transparent}
.trackstrip::-webkit-scrollbar-thumb{background:#3A4C5E;border-radius:99px}
.tcol.ttot{width:84px}
.tcol.ttot .lv{color:var(--txt)}
.cell.tsum{color:var(--gold);font-weight:900;background:rgba(233,180,76,.08)}
.cell.tsum small{display:block;font-size:9.5px;color:var(--muted);font-weight:400}
/* ---------- 儲值／累儲 ---------- */
.shop-note{font-size:11.5px;color:var(--muted);margin-bottom:8px}
.shop-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(98px,1fr));gap:6px}
.pk{border:1px solid var(--line);border-radius:10px;padding:8px 6px;text-align:center;position:relative}
.pk.starter{border-color:#E9B44C;background:rgba(233,180,76,.08)}
.pk .g{font-size:15px;font-weight:900;color:var(--gold)}
.pk .b{font-size:10px;color:var(--green);min-height:14px}
.pk .p{margin-top:4px;font-size:12.5px;font-weight:700;border:1px solid var(--line);border-radius:7px;padding:4px 0;color:var(--muted)}
.pk .tag{position:absolute;top:-7px;left:50%;transform:translateX(-50%);font-size:9.5px;background:#E06A5B;color:#fff;border-radius:99px;padding:0 6px;white-space:nowrap}
.shop-subs{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:8px}
.sub-c{border:1px dashed var(--gold-dim);border-radius:10px;padding:8px 10px;font-size:11.5px;color:var(--muted);line-height:1.5}
.sub-c b{display:block;color:var(--txt);font-size:13px}
.topup-list{display:flex;flex-direction:column;gap:5px}
.tp{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:9px;padding:6px 9px;font-size:12px}
.tp .t{flex:none;width:64px;font-weight:900}
.tp .r{flex:1;min-width:0;color:var(--muted)}
.tp .r b{color:var(--gold)}
.tp button{flex:none;min-width:64px;padding:5px 8px;border-radius:8px;border:0;background:var(--gold);color:#1A1205;font-family:inherit;font-weight:700;font-size:12px;cursor:pointer}
.tp button:disabled{background:none;border:1px solid var(--line);color:var(--muted);cursor:default;font-weight:400}
.tp.got{opacity:.55}
.tp .t small.rp{display:block;font-size:9.5px;color:var(--green);font-weight:400}
.tp.rep{border-style:dashed}
.tp-note{font-size:10.5px;color:var(--muted);padding:2px 2px 0;line-height:1.5}
.ach-sec{grid-column:1/-1;font-size:11.5px;font-weight:700;color:var(--muted);margin:6px 0 0}
.gbtns.bulk{margin-top:8px}
.gbtns.bulk button{padding:9px 0;font-size:13px}
.bulk-sum{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 10px}
.bulk-sum span{border-radius:99px;padding:3px 10px;font-size:12px;font-weight:700;color:#fff}
.bulk-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:5px}
.bulk-list .bl{border:1px solid var(--line);border-radius:9px;padding:5px 8px;font-size:12px;display:flex;align-items:center;gap:6px}
.bulk-list .bl b{margin-left:auto;color:var(--gold)}
.bulk-list .bl .nw{font-size:9.5px;color:#fff;background:#E06A5B;border-radius:99px;padding:0 5px}