/* acct.css — บัญชีออนไลน์ อันดับ จดหมาย ข่าว (acct.js) · ตั๊บ 2026-11-09 · ขนาดคงที่ ไม่มีสกรอลล์ (รายการยาวใช้ ◀ ▶) */
/* stage.js FitModal ตั้งความกว้างเป็น inline style → ต้อง !important (อันดับใช้ 1000 ตามปกติ) */
html body .modal-box.acct-sm{width:620px!important}
html body .modal-box.acct-mail{width:760px!important}
.acct-box .modal-body{overflow:hidden}

/* ปุ่มหน้าแรก / แผนที่ */
.acct-title{display:contents}
.acct-btn.on{color:#ffe08a}
.acct-hud{display:inline-flex;gap:6px;align-items:center}
.acct-mailbtn{position:relative}
.acct-mailbtn[hidden]{display:none!important}
.acct-mailbtn:not([data-n=""])::after{content:attr(data-n);position:absolute;right:-4px;top:-4px;min-width:16px;height:16px;padding:0 4px;border-radius:8px;background:#e0453a;color:#fff;font:700 10px/16px sans-serif;box-shadow:0 0 0 2px #0a1523}
.acct-news{position:absolute;z-index:2;right:89px;bottom:64px;display:flex;align-items:center;gap:8px;max-width:460px;padding:7px 12px;border:1px solid #c9a35a55;border-radius:8px;background:#0b0712b3;color:#e8dcc4;font-size:13px;text-align:left;cursor:pointer}
.acct-news[hidden]{display:none}
.acct-news span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}

/* แท็บ (ใช้ .lab-tabs ของเกม แต่ปุ่มมีข้อความ) */
#stage .acct-tabs{justify-content:center;gap:6px;margin-bottom:10px}
#stage .acct-tabs button{width:auto!important;padding:0 14px!important;height:32px!important}

/* ฟอร์ม */
.acct-form{display:flex;flex-direction:column;gap:9px;max-width:380px;margin:0 auto}
.acct-form label{display:flex;flex-direction:column;gap:4px;color:#e8dcc4;font-size:13px}
.acct-form .name-input{width:100%;margin:0;box-sizing:border-box}
.acct-form .row{justify-content:center;margin-top:4px}
.acct-msg{min-height:18px;margin:0;color:#ffb48a;font-size:13px;text-align:center}
.acct-box .footer-note{text-align:center}

/* เทียบเซฟ */
.acct-cmp{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:10px 0}
.acct-cmp.one{grid-template-columns:1fr;max-width:300px;margin:10px auto}
.acct-cmp>div{display:flex;flex-direction:column;gap:4px;padding:12px;border-radius:8px;background:#0b071299;border:1px solid #c9a35a44}
.acct-cmp h4{margin:0 0 4px;color:#ffe9b0}
.acct-cmp b{color:#fff}.acct-cmp small{color:#c9b88f;font-size:12px}
.acct-cmp button{margin-top:8px}

/* เมนูบัญชี */
.acct-me{display:flex;flex-direction:column;align-items:center;gap:3px;margin-bottom:12px}
.acct-me b{font-size:20px;color:#ffe08a}.acct-me small{color:#c9b88f}
.acct-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.acct-link{display:flex;align-items:center;justify-content:center;min-height:38px;border-radius:8px;border:1px solid #c9a35a66;color:#ffe08a;text-decoration:none;background:#1a1208aa}

/* อันดับ */
.ar-desc{margin:-4px 0 8px;text-align:center;color:#a09080;font-size:12.5px}
.ar-head,.ar-row{display:grid;grid-template-columns:40px 38px minmax(0,1fr) 70px 80px 110px;align-items:center;column-gap:10px;padding:0 10px}
.ar-head{height:24px;color:#a09080;font-size:12px}
.ar-head em,.ar-head strong{font-style:normal;font-weight:400}
.ar-head strong,.ar-row strong{text-align:right}
.ar-list{display:flex;flex-direction:column;gap:3px;height:400px}
.ar-row{height:37px;border-radius:6px;background:#0b071299;border:1px solid #c9a35a33}
.ar-row.me{background:#3a2a0ccc;border-color:#ffd77a;box-shadow:0 0 10px #ffd77a44 inset}
.ar-row.none{grid-template-columns:40px minmax(0,1fr)}
.ar-row em{font-style:normal;color:#ffe08a;font-weight:800;text-align:center}
.ar-row:nth-child(-n+3) em{font-size:17px;text-shadow:0 0 8px #ffcc4499}
.ar-th{display:block;width:34px;height:34px;border-radius:50%;background:#1b2633 no-repeat;background-size:190%;background-position:50% 6%;border:1px solid #c9a35a66;overflow:hidden}
.ar-th.sa{background-size:cover}
.ar-th.none{display:flex;align-items:center;justify-content:center;color:#8a7a60;font-style:normal;font-size:14px}
.ar-nm{display:flex;flex-direction:column;min-width:0;line-height:1.2}
.ar-nm b{color:#fff;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.ar-nm small{color:#c9b88f;font-size:11.5px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.ar-on{display:inline-block;width:7px;height:7px;margin-left:6px;border-radius:50%;background:#5ee07a;vertical-align:middle;box-shadow:0 0 5px #5ee07a}
.ar-lv{color:#ffe9b0;font-weight:700}.ar-life{color:#c9b88f;font-size:12.5px}
.ar-row strong{color:#ffe08a}
.ar-wait{text-align:center;padding:40px 0}
.ar-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px;min-height:40px}
.ar-mine{flex:1;min-width:0}
.ar-mine .ar-row{margin:0}
.ar-pager{display:flex;align-items:center;gap:8px;color:#e8dcc4;font-size:13px}
#stage .ar-pager button{min-width:34px!important;padding:0 8px!important}

/* จดหมาย */
.am-list{display:flex;flex-direction:column;gap:6px;height:300px}
.am-it{display:flex;align-items:center;justify-content:space-between;gap:12px;height:66px;padding:0 14px;border-radius:8px;background:#0b071299;border:1px solid #c9a35a44}
.am-it>div{display:flex;flex-direction:column;gap:2px;min-width:0}
.am-it b{color:#fff;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.am-it small{color:#ffe08a}.am-it em{color:#8a7a60;font-style:normal;font-size:11.5px}

/* ข่าว */
.an-list{display:flex;flex-direction:column;gap:8px}
.an-it{padding:10px 14px;border-radius:8px;background:#0b071299;border:1px solid #c9a35a44}
.an-it em{color:#a09080;font-style:normal;font-size:12px}
.an-it p{margin:4px 0 0;color:#e8dcc4;white-space:pre-line;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}

/* แถวในหน้าตั้งค่า */
.acct-set .row{flex-wrap:nowrap;gap:6px}