/* ══════════ qol-pack.css ══════════ */

/* ── ป๊อปอัปล่างจอทั่วไป (ตัวจับเวลา / ที่มาของดาเมจ) ── */
.qolp-modal{position:fixed;inset:0;z-index:1150;display:none;align-items:flex-end;justify-content:center;background:rgba(0,0,0,.55);padding:0 12px calc(12px + env(safe-area-inset-bottom))}
.qolp-sheet{width:100%;max-width:420px;max-height:72vh;overflow-y:auto;background:var(--surface-raised);border:1px solid var(--border-soft);border-radius:16px;padding:12px 12px 14px;box-shadow:0 12px 40px rgba(0,0,0,.45)}
.qolp-sheet-h{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--text-primary);margin-bottom:10px}
.qolp-x{margin-left:auto;border:none;background:var(--surface-page-2);color:var(--text-mute);font-size:11px;border-radius:8px;padding:5px 11px;cursor:pointer}
.qolp-empty{font-size:11px;color:var(--text-mute);padding:14px 4px;text-align:center}

/* ── ชิป ── */
.qolp-chip{display:inline-flex;align-items:center;font-size:10px;font-weight:600;padding:3px 9px;border-radius:20px;background:var(--surface-page-2);color:var(--text-mute);white-space:nowrap}
.qolp-chip.g{background:rgba(74,222,128,.12);color:var(--t-4ade80)}
.qolp-chip.y{background:rgba(251,191,36,.13);color:var(--t-fbbf24)}

/* ── QoL 11 ประวัติตีบวก ── */
.qolp-eh{margin:10px 2px 2px;padding:7px 9px;border-radius:9px;background:var(--surface-page-2);font-size:10.5px;line-height:1.55;color:var(--text-mute)}
.qolp-eh b{color:var(--text-primary);font-weight:700}

/* ── QoL 13 ตัวจับเวลา ── */
#qolp-timer{display:flex;align-items:center;gap:6px;width:100%;margin:6px 0 0;border:1px solid var(--border-soft);background:var(--surface-raised);color:var(--text-primary);font-size:11px;border-radius:10px;padding:8px 11px;cursor:pointer;text-align:left}
#qolp-timer span{flex:1}
#qolp-timer i{font-style:normal;font-size:10px;color:var(--text-mute)}
#qolp-timer i.qolp-tm-done{color:var(--t-4ade80);font-weight:700}
.qolp-tm-row{display:flex;align-items:center;gap:8px;padding:8px 4px;border-bottom:1px solid var(--border-soft);font-size:11px}
.qolp-tm-row:last-child{border-bottom:none}
.qolp-tm-row.go{cursor:pointer}
.qolp-tm-ic{width:20px;text-align:center;color:var(--text-mute)}
.qolp-tm-nm{flex:1;min-width:0;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.qolp-tm-left{font-variant-numeric:tabular-nums;color:var(--text-mute);white-space:nowrap}
.qolp-tm-row.done .qolp-tm-left{color:var(--t-4ade80);font-weight:700}

/* ── QoL 16 + หน้า 2 หัวตำหนักศิษย์ ── */
.qolp-dh{display:flex;align-items:center;gap:6px;margin-bottom:9px}
.qolp-dh-t{flex:1;min-width:0}
.qolp-dh-t b{display:block;font-size:13px;color:var(--text-primary)}
.qolp-dh-t i{display:block;font-style:normal;font-size:10px;color:var(--text-mute);margin-top:1px}

/* ── QoL 17 เทียบก่อน→หลัง (อยู่ในกล่องยืนยันเดิม) ── */
.qolp-cmp{text-align:left;min-width:220px}
.qolp-cmp-h{font-size:12.5px;font-weight:700;color:var(--text-primary);margin-bottom:8px}
.qolp-cmp-r{display:grid;grid-template-columns:1fr auto 14px auto 56px;gap:6px;align-items:center;font-size:11px;padding:4px 0;color:var(--text-mute);font-variant-numeric:tabular-nums}
.qolp-cmp-r b{color:var(--text-primary)}
.qolp-cmp-r i{font-style:normal;text-align:right;font-size:10px}
.qolp-cmp-r.up i{color:var(--t-4ade80);font-weight:700}
.qolp-cmp-n{font-size:10px;color:var(--text-mute);margin-top:7px}

/* ── QoL 19 ที่มาของดาเมจ ── */
#clog p.qolp-hbt{cursor:pointer}
#clog p.qolp-hbt:active{background:var(--surface-page-2)}
.qolp-hb-v{color:var(--t-fbbf24);font-variant-numeric:tabular-nums}
.qolp-hb-base{font-size:11px;color:var(--text-mute);margin-bottom:8px}
.qolp-hb-base b{color:var(--text-primary)}
.qolp-hb-r{display:grid;grid-template-columns:96px 1fr 52px;gap:8px;align-items:center;font-size:11px;padding:4px 0;color:var(--text-primary)}
.qolp-hb-r i{display:block;height:6px;border-radius:3px;background:var(--surface-page-2);overflow:hidden}
.qolp-hb-r s{display:block;height:100%;border-radius:3px;background:var(--t-fbbf24);text-decoration:none}
.qolp-hb-r.down s{background:var(--t-f87171)}
.qolp-hb-r b{text-align:right;font-variant-numeric:tabular-nums}
.qolp-hb-abs{font-size:10.5px;color:var(--t-60a5fa);margin-top:6px}
.qolp-hb-n{font-size:9.5px;color:var(--text-mute);margin-top:8px}

/* ── QoL 20 โหมดประหยัด — ปิดการวาดเท่านั้น ── */
.qolp-saver #fxp-layer{display:none!important}
.qolp-saver .ho-stage::before,.qolp-saver .ho-stage::after{animation:none!important;opacity:0!important}
.qolp-saver .bt-stage,.qolp-saver .bt-stage *{animation:none!important;transition:none!important}
.qolp-saver .dom-veil,.qolp-saver .dom-veil *{animation:none!important}
.qolp-saver #clog p{animation:none!important}

/* ── QoL 29 ระบบที่ยังไม่เคยเปิด — สีคนละสีกับ "มีของรอ" ── */
#more-menu .more-item{position:relative}
.qolp-new{position:absolute;top:8px;right:8px;width:7px;height:7px;border-radius:50%;background:var(--t-5eead4);box-shadow:0 0 0 2px var(--surface-raised);pointer-events:none}

/* ── หน้า 4 ร้านค้า ── */
.qolp-shopchips{display:flex;gap:6px;margin-bottom:8px;flex-wrap:wrap}
.qolp-dim{opacity:.72}

/* ── หน้า 6 คลังหยก ── */
.qolp-bkq{display:flex;gap:6px;margin-bottom:6px}
.qolp-bkq-b{flex:1;border:1px solid var(--border-soft);background:var(--surface-page-2);color:var(--text-primary);font-size:11px;font-weight:600;border-radius:8px;padding:7px 4px;cursor:pointer}
.qolp-bkp{display:flex;flex-direction:column;gap:2px;font-size:10px;color:var(--text-mute);margin:-2px 0 8px;font-variant-numeric:tabular-nums}
.qolp-bkp b{color:var(--t-fbbf24)}
.qolp-bkp i{font-style:normal;color:var(--t-4ade80)}
.qolp-bkp em{font-style:normal;color:var(--t-f87171)}

/* ── หน้า 8 ตั้งค่า ── */
.qolp-sgrp{margin-bottom:14px}
.qolp-sgrp-h{font-size:10px;font-weight:700;letter-spacing:.6px;color:var(--text-mute);margin:0 2px 6px}
.qolp-sgrp .card{margin-bottom:6px}
.qolp-sdesc{font-size:11px;color:var(--text-mute);margin-bottom:8px;line-height:1.6}
.qolp-slbl{font-size:10px;color:var(--text-mute);margin:8px 0 4px}
.qolp-row{display:flex;gap:6px;flex-wrap:wrap}
.qolp-row .btn{flex:1;min-width:0}