/* หน้าต่างลอย เข้าสู่ระบบ/สมัครสมาชิก — แนวนอน 2 ฝั่ง (ซ้าย: แบรนด์+แท็บ+Discord · ขวา: ฟอร์ม) เพื่อไม่ต้องเลื่อนจอ
   ต่อยอดจาก .cdlg (อนิเมชั่นเปิด/ปิด + ปุ่มปิด) ใน style.css · สไตล์กระจก (glass) · จอแคบ (<720px) ซ้อนเป็นแนวตั้ง */
.adlg{width:min(94vw,738px);max-width:738px;padding:0;text-align:left;
  background:color-mix(in srgb,var(--panel) 80%,transparent);
  -webkit-backdrop-filter:blur(20px) saturate(140%);backdrop-filter:blur(20px) saturate(140%)}
.adlg .cdlg-x{z-index:2}
.adlg-grid{display:grid;grid-template-columns:252px minmax(0,1fr)}

/* ---- ฝั่งซ้าย ---- */
.adlg-side{display:flex;flex-direction:column;justify-content:center;gap:0;padding:25px 20px;
  border-right:1px solid var(--line);background:color-mix(in srgb,var(--primary) 9%,transparent)}
.adlg-logo{display:block;width:58px;height:58px;margin:0 auto 7px;object-fit:contain;filter:drop-shadow(0 0 16px var(--glow))}
.adlg-title{margin:0;text-align:center;font-size:1.17rem;font-weight:800}
.adlg-sub{margin:2px 0 14px;text-align:center;color:var(--muted);font-size:0.792rem}

.adlg-tabs{display:grid;grid-template-columns:1fr;gap:4px;padding:4px;border:1px solid var(--line);border-radius:calc(var(--r) + 2px);background:var(--field)}
.adlg-tabs button{padding:8px 7px;border:0;border-radius:var(--r);background:transparent;color:var(--muted);font:inherit;font-weight:600;cursor:pointer;transition:background .15s,color .15s}
.adlg-tabs button[aria-selected=true]{background:var(--primary);color:#fff}
.adlg-tabs button:not([aria-selected=true]):hover{color:var(--text);background:var(--card)}
.adlg-tabs button:focus-visible,.adlg-eye:focus-visible{outline:2px solid var(--primary);outline-offset:2px}

.adlg-or{display:flex;align-items:center;gap:9px;margin:13px 0 7px;color:var(--muted);font-size:0.738rem}
.adlg-or::before,.adlg-or::after{content:"";flex:1;height:1px;background:var(--line)}
.adlg-discord.btn.btn{--btn:#5865f2;margin:0}

/* ---- ฝั่งขวา: ฟอร์ม 2 คอลัมน์ ---- */
.adlg-main{display:flex;flex-direction:column;justify-content:center;padding:27px 25px 22px}
.adlg-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px 13px}
.adlg-form[hidden]{display:none}
.adlg-f label{margin:0 0 4px}
.adlg-pw{position:relative}.adlg-pw input{padding-right:40px}
.adlg-eye{position:absolute;top:50%;right:5px;transform:translateY(-50%);display:grid;place-items:center;width:31px;height:31px;padding:0;border:0;border-radius:8px;background:transparent;color:var(--muted);cursor:pointer}
.adlg-eye:hover,.adlg-eye[aria-pressed=true]{color:var(--text)}.adlg-eye .ic{width:16px;height:16px}

.adlg-ts,.adlg-err,.adlg-submit{grid-column:1/-1}
.adlg-ts{display:flex;justify-content:center;min-height:58px}      /* จองที่ไว้ กันหน้าต่างกระตุกตอน widget โหลดเสร็จ */
.adlg-err{margin:0;padding:8px 11px;border:1px solid #ef4444;border-radius:var(--r);background:rgba(239,68,68,.12);color:#fca5a5;font-size:0.792rem}
.adlg-err[hidden]{display:none}
.adlg-submit{margin:0}
.adlg-submit[disabled]{opacity:.65;cursor:progress}

/* ---- จอแคบ: ซ้อนแนวตั้ง ---- */
@media(max-width:719px){
  .adlg-grid{grid-template-columns:1fr}
  .adlg-side{padding:20px 16px 14px;border-right:0;border-bottom:1px solid var(--line)}
  .adlg-tabs{grid-template-columns:1fr 1fr}
  .adlg-logo,.adlg-sub{display:none}.adlg-title{margin-bottom:11px;text-align:left}
  .adlg-main{padding:16px 16px 18px}
}
@media(max-width:479px){.adlg-form{grid-template-columns:1fr}}
/* จอเตี้ย (มือถือแนวนอน): ลดช่องไฟ เพื่อให้ยังพอดีโดยไม่เลื่อน */
@media(max-height:520px){
  .adlg-side{padding:14px 16px}.adlg-main{padding:16px 20px 13px}
  .adlg-logo{width:40px;height:40px}.adlg-sub{margin-bottom:9px}.adlg-form{gap:9px 13px}.adlg-ts{min-height:58px}
}
@media(prefers-reduced-motion:reduce){.adlg-tabs button{transition:none}}

/* ---- ปุ่มตา: อนิเมชั่นตอนกดแสดง/ซ่อนรหัสผ่าน ----
   ซ่อน (ปกติ) = ตาเปิด · แสดงรหัส (aria-pressed=true) = มีเส้นขีดเฉียงลากทับ + ลูกตากระพริบ */
.adlg-eye{transition:color .2s,background .2s,transform .15s}
.adlg-eye:active{transform:translateY(-50%) scale(.88)}
.eye-svg{overflow:visible}
.eye-lid{transform-box:fill-box;transform-origin:center;transition:transform .25s cubic-bezier(.4,0,.2,1)}
.eye-pupil{transform-box:fill-box;transform-origin:center;transition:transform .25s cubic-bezier(.34,1.56,.64,1),opacity .2s}
.eye-slash{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset .3s cubic-bezier(.4,0,.2,1)}
.adlg-eye[aria-pressed=true] .eye-slash{stroke-dashoffset:0}
.adlg-eye[aria-pressed=true] .eye-pupil{transform:scale(.45);opacity:.55}
.adlg-eye[aria-pressed=true] .eye-lid{transform:scaleY(.8)}
.adlg-eye.is-blink .eye-lid{animation:adlg-blink .32s ease}
@keyframes adlg-blink{0%,100%{transform:scaleY(1)}45%{transform:scaleY(.08)}}
@media(prefers-reduced-motion:reduce){.adlg-eye,.eye-lid,.eye-pupil,.eye-slash{transition:none}.adlg-eye.is-blink .eye-lid{animation:none}}