/* Login and account entry (v0.9, ASBAB UI). */
.ax-login{min-height:100vh;display:flex;flex-direction:column}
body.ax>main.ax-auth{flex:1;display:flex;align-items:center;padding-block:clamp(16px,2.6vh,32px)}
.ax-auth-in{width:100%;max-width:1100px;margin-inline:auto;padding-inline:var(--ax-gut);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,460px);gap:clamp(24px,4vw,48px);align-items:stretch}
.ax-auth-side{position:relative;overflow:hidden;border-radius:24px;padding:clamp(24px,3vw,40px);align-self:center;color:#d9d6ee;background:radial-gradient(600px 360px at 90% -10%,#18abe340,transparent 60%),radial-gradient(500px 300px at 0% 110%,#80cc2830,transparent 60%),linear-gradient(160deg,var(--ax-navy),var(--ax-navy-2))}
.ax-auth-side .ax-eyebrow{background:#ffffff14;color:#bfe8f8}
body.ax .ax-auth-side h1{color:#fff;font-size:clamp(30px,3.6vw,46px);line-height:1.3;margin:16px 0 12px}
.ax-auth-side h1 em{font-style:normal;color:var(--ax-green)}
.ax-auth-side>p{margin:0 0 24px;font-size:17px;max-width:none}
.ax-auth-list{list-style:none;padding:0;margin:0 0 24px;display:grid;gap:10px}
.ax-auth-list li{display:grid;grid-template-columns:auto 1fr;column-gap:12px;align-items:center;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:16px;padding:12px 16px}
.ax-auth-list li::before{content:"";grid-row:span 2;width:36px;height:36px;border-radius:10px;background:#80cc2833 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2380cc28' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12 4 4 8-8'/%3E%3C/svg%3E") center/18px no-repeat}
.ax-auth-list b{color:#fff;font-size:16px;line-height:1.5}.ax-auth-list span{font-size:14px;color:#bdb8dc;line-height:1.6}
.ax-auth-note{font-size:14px!important;color:#bdb8dc;margin:0!important}
.ax-auth-card{background:#fff;border:1px solid var(--ax-line);border-radius:24px;padding:clamp(20px,2.4vw,30px) clamp(20px,2.6vw,34px);box-shadow:var(--ax-shadow-lg);min-width:0;scroll-margin-top:90px;align-self:center}
body.ax .ax-auth-card h2{font-size:26px;margin:0 0 4px}
.ax-auth-card .auth-intro{color:var(--ax-muted);margin:0 0 10px;font-size:15px;line-height:1.7;max-width:none}
.ax-auth-card #notice{font-size:13px;line-height:1.7;color:var(--ax-muted);background:var(--ax-soft);border-radius:12px;padding:8px 12px;margin:0 0 4px;max-width:none}
.ax-auth-card #notice.auth-notice{font-weight:600}
.ax-auth-card label{font-size:14.5px;font-weight:700;color:var(--ax-ink);margin:12px 0 0}
.ax-auth-card input{margin-top:5px;min-height:46px;border:1px solid #cfd8e4;border-radius:14px;padding:12px 14px;font-size:16px;transition:border-color .15s,box-shadow .15s}
.ax-auth-card input:focus{outline:0;border-color:var(--ax-blue);box-shadow:0 0 0 4px #18abe326}
.ax-auth-card .password-toggle{top:7px}
.ax-auth-card .muted{font-size:12.5px;margin:4px 0 0}
.ax-auth-card #challenge{margin-top:10px;min-height:0}
.ax-auth-card .actions{display:grid;grid-template-columns:1fr;gap:8px;margin-top:14px}
.ax-auth-card .actions button{min-height:46px;border-radius:14px;font-weight:700;font-size:16px;padding:12px 16px}
.ax-auth-card .actions button[value=login]{background:var(--ax-blue-d);color:#fff}
.ax-auth-card .actions button[value=login]:hover{background:var(--ax-navy);color:#fff}
.ax-auth-card .actions button[value=register]{background:#fff;border:1px solid var(--ax-line);color:var(--ax-ink)}
.ax-auth-card .actions button[value=register]:hover{border-color:var(--ax-green);background:#f3fbe9;color:var(--ax-ink)}
.ax-auth-card .actions button.text{grid-column:1/-1;background:transparent;color:var(--ax-blue-d);min-height:34px;padding:4px;font-size:14.5px}
.ax-auth-card .actions button.text:hover{background:var(--ax-soft);color:var(--ax-navy)}
.ax-auth-card .google-login{border-radius:14px;min-height:50px}
.ax-auth-card #tokenForm button{width:100%;min-height:50px;border-radius:14px;background:var(--ax-blue-d);color:#fff;margin-top:14px}
.ax-auth-foot{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;padding:20px;font-size:14px;color:var(--ax-muted);border:0;max-width:none!important}
.ax-auth-foot a:hover{color:var(--ax-blue-d)}
@media(max-width:900px){
 .ax-auth-in{grid-template-columns:1fr;max-width:560px}
 .ax-auth-card{order:-1}
 .ax-auth-side{padding:24px}.ax-auth-side>p{font-size:16px}
}
/* Google sign-in (inserted by google-login.js when enabled) */
.ax-auth-card .google-login{margin:10px 0 0;min-height:48px;border-radius:14px;border-color:#cfd8e4;font:700 15.5px/1.3 Tajawal,Arial,sans-serif;color:var(--ax-ink);gap:12px;box-shadow:0 1px 2px #19103d0d}
.ax-auth-card .google-login:hover,.ax-auth-card .google-login:focus-visible{background:#f4faff;border-color:var(--ax-blue);text-decoration:none;color:var(--ax-ink)}
.ax-auth-card .google-login+p.muted{display:flex;align-items:center;gap:12px;margin:12px 0 0;font-size:13.5px;color:var(--ax-muted);text-align:center}
.ax-auth-card .google-login+p.muted::before,.ax-auth-card .google-login+p.muted::after{content:"";flex:1;height:1px;background:var(--ax-line)}
.ax-auth-card .google-login+p.muted+#auth label:first-child{margin-top:8px}

@media(max-height:820px) and (min-width:901px){.ax-auth-side .ax-auth-list li{padding:9px 14px}.ax-auth-side>p{margin-bottom:16px}body.ax .ax-auth-side h1{font-size:34px;margin:12px 0 8px}}
@media(max-width:900px){.ax-auth-card{padding:20px}}
@media(max-height:780px) and (min-width:901px){.ax-auth-card .auth-intro,.ax-auth-card #notice:not(.auth-notice){display:none}body.ax .ax-auth-card h2{margin-bottom:6px}body.ax>header{padding-block:6px}body.ax>header .brand.tools-brand img{height:44px}.ax-auth-side .ax-auth-note{display:none}}