/* UI v4 round 5 — /validate-account in the site's design (validate-account.php). Tokens only
   (nx-tokens.css); logical properties for /ar/; the game dropdown is the site-wide nx-select. */
.nxv{padding-block:var(--nx-sp-6) var(--nx-sp-14)}
.nxv-wrap{max-width:1080px;margin-inline:auto;padding-inline:var(--nx-gutter-v4)}
@media (min-width:768px){.nxv-wrap{padding-inline:24px}}
.nxv-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0 0 var(--nx-sp-5);color:var(--nx-text-3);font-size:var(--nx-fs-13)}
.nxv-crumbs a{display:inline-flex;align-items:center;min-height:24px;color:var(--nx-text-2);text-decoration:none}
@media (pointer:coarse){.nxv-crumbs a{min-height:44px;min-width:44px}}
.nxv-crumbs a:hover{color:var(--nx-signal)}
.nxv-hero{margin:0 0 var(--nx-sp-6)}
.nxv-kicker{display:inline-flex;align-items:center;gap:6px;margin:0 0 var(--nx-sp-3);padding:4px 10px;border:1px solid rgba(69,248,130,.3);border-radius:999px;background:var(--nx-signal-tint);color:var(--nx-signal);font:600 var(--nx-fs-12)/var(--nx-lh-12) var(--nx-font)}
.nxv-kicker .nx-i{width:14px;height:14px}
.nxv-hero h1{margin:0 0 var(--nx-sp-2);color:var(--nx-text);font-size:var(--nx-fs-30);line-height:var(--nx-lh-30)}
@media (min-width:768px){.nxv-hero h1{font-size:var(--nx-fs-36);line-height:var(--nx-lh-36)}}
.nxv-lead{max-width:62ch;margin:0 0 var(--nx-sp-4);color:var(--nx-text-2);font-size:var(--nx-fs-16);line-height:var(--nx-lh-16)}
.nxv-facts{display:flex;flex-wrap:wrap;gap:var(--nx-sp-2) var(--nx-sp-5);margin:0;padding:0;list-style:none}
.nxv-facts li{display:inline-flex;align-items:center;gap:6px;color:var(--nx-text-2);font-size:var(--nx-fs-13)}
.nxv-facts .nx-i{width:16px;height:16px;color:var(--nx-signal)}

.nxv-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--nx-sp-5);align-items:start}
@media (min-width:992px){.nxv-grid{grid-template-columns:minmax(0,1fr) 320px;gap:var(--nx-sp-8)}}

.nxv-card{display:flex;flex-direction:column;gap:var(--nx-sp-5);margin:0;padding:var(--nx-sp-5);border:1px solid var(--nx-panel-line);border-radius:var(--nx-r-card);background:var(--nx-panel)}
@media (min-width:768px){.nxv-card{padding:var(--nx-sp-6)}}
.nxv-field{display:flex;flex-direction:column;gap:var(--nx-sp-2);min-width:0}
.nxv-label{display:flex;align-items:center;gap:10px;margin:0;color:var(--nx-text);font:700 var(--nx-fs-14)/var(--nx-lh-14) var(--nx-font)}
.nxv-step{display:grid;place-items:center;width:24px;height:24px;flex:none;border:1px solid rgba(69,248,130,.45);border-radius:999px;background:var(--nx-signal-tint);color:var(--nx-signal);font-size:12px;font-weight:700}
.nxv-idgroup{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--nx-sp-2)}
.nxv-has-zone .nxv-idgroup{grid-template-columns:minmax(0,1fr) 120px}
.nxv-in{display:flex;flex-direction:column;gap:4px;min-width:0}
.nxv-in[hidden]{display:none}
.nxv-in label{margin:0;color:var(--nx-text-3);font:600 var(--nx-fs-12)/var(--nx-lh-12) var(--nx-font)}
.nxv-in input{width:100%;min-height:48px;padding:0 var(--nx-sp-4);border:1px solid var(--nx-field-line);border-radius:var(--nx-r-control);background:var(--nx-field);color:var(--nx-text);font:500 var(--nx-fs-16)/1 var(--nx-font-mono);letter-spacing:.02em;text-align:start}
.nxv-in input::placeholder{color:var(--nx-text-3)}
.nxv-in input:focus{outline:0;border-color:var(--nx-signal);box-shadow:0 0 0 3px rgba(69,248,130,.15)}
.nxv-in input[aria-invalid="true"]{border-color:var(--nx-danger);box-shadow:0 0 0 3px var(--nx-danger-tint)}
.nxv-err{display:flex;align-items:flex-start;gap:6px;margin:0;color:var(--nx-danger);font-size:var(--nx-fs-13);line-height:var(--nx-lh-13)}
.nxv-err[hidden]{display:none}
.nxv-err .nx-i{flex:none;width:16px;height:16px;margin-top:1px}
.nxv-help{display:flex;align-items:flex-start;gap:8px;margin:0;padding:var(--nx-sp-3);border:1px solid var(--nx-line);border-radius:var(--nx-r-control);background:var(--nx-s2);color:var(--nx-text-2);font-size:var(--nx-fs-13);line-height:var(--nx-lh-13)}
.nxv-help[hidden]{display:none}
.nxv-help .nx-i{flex:none;width:16px;height:16px;margin-top:1px;color:var(--nx-info)}

.nxv-submit{width:100%;min-height:52px;font-size:var(--nx-fs-16)}
.nxv-submit[disabled]{opacity:.85;pointer-events:none}
.nxv-spin{display:none;width:16px;height:16px;border:2px solid rgba(4,20,10,.35);border-top-color:var(--nx-on-signal);border-radius:50%}
.nxv-card.is-busy .nxv-spin{display:inline-block;animation:nxv-spin .8s linear infinite}
@keyframes nxv-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.nxv-card.is-busy .nxv-spin{animation:none}}

.nxv-result{padding:var(--nx-sp-4);border:1px solid var(--nx-line-strong);border-radius:var(--nx-r-card);background:var(--nx-s2);animation:nxv-in var(--nx-t-menu) var(--nx-ease-in)}
.nxv-result[hidden]{display:none}
.nxv-result.is-ok{border-color:rgba(69,248,130,.45);background:linear-gradient(180deg,rgba(69,248,130,.08),rgba(69,248,130,.02)) var(--nx-s2)}
.nxv-result.is-bad{border-color:rgba(255,92,108,.4);background:var(--nx-danger-tint)}
@keyframes nxv-in{from{opacity:0;transform:translateY(6px)}}
.nxv-res-head{display:flex;align-items:center;gap:var(--nx-sp-3)}
.nxv-res-av{display:grid;place-items:center;width:48px;height:48px;flex:none;border-radius:999px;background:var(--nx-signal);color:var(--nx-on-signal);font:700 20px/1 var(--nx-font)}
.nxv-res-av--bad{background:var(--nx-danger-tint);color:var(--nx-danger);border:1px solid rgba(255,92,108,.4)}
.nxv-res-av .nx-i{width:22px;height:22px}
.nxv-res-who{display:flex;flex-direction:column;gap:2px;min-width:0}
.nxv-res-tag{display:inline-flex;align-items:center;gap:6px;color:var(--nx-signal);font:600 var(--nx-fs-12)/var(--nx-lh-12) var(--nx-font)}
.nxv-res-tag .nx-i{width:14px;height:14px}
.nxv-res-name{color:var(--nx-text);font:700 var(--nx-fs-20)/var(--nx-lh-20) var(--nx-font);overflow-wrap:anywhere}
.nxv-res-title{color:var(--nx-text);font:700 var(--nx-fs-16)/var(--nx-lh-16) var(--nx-font)}
.nxv-res-meta{color:var(--nx-text-3);font:500 var(--nx-fs-12)/var(--nx-lh-12) var(--nx-font-mono);text-align:start}
.nxv-res-msg{margin:var(--nx-sp-3) 0 0;color:var(--nx-text-2);font-size:var(--nx-fs-14);line-height:var(--nx-lh-14)}
.nxv-res-head .nxv-res-msg{margin:2px 0 0}
.nxv-res-actions{display:flex;flex-wrap:wrap;gap:var(--nx-sp-2);margin-top:var(--nx-sp-4)}
.nxv-res-actions .nx5-btn{gap:8px}
@media (max-width:575.98px){.nxv-res-actions .nx5-btn{flex:1 1 100%}}

.nxv-side{padding:var(--nx-sp-5);border:1px solid var(--nx-line);border-radius:var(--nx-r-card);background:var(--nx-s1)}
.nxv-side h2{margin:0 0 var(--nx-sp-4);padding-inline-start:10px;border-inline-start:3px solid var(--nx-signal);color:var(--nx-text);font:700 var(--nx-fs-16)/22px var(--nx-font);letter-spacing:0}
.nxv-steps{display:flex;flex-direction:column;gap:var(--nx-sp-3);margin:0 0 var(--nx-sp-4);padding:0;list-style:none;counter-reset:nxv}
.nxv-steps li{position:relative;display:flex;flex-direction:column;gap:2px;padding-inline-start:36px;counter-increment:nxv}
.nxv-steps li::before{content:counter(nxv);position:absolute;inset-inline-start:0;top:0;display:grid;place-items:center;width:24px;height:24px;border:1px solid var(--nx-line-strong);border-radius:999px;background:var(--nx-s3);color:var(--nx-text);font-size:12px;font-weight:700}
.nxv-steps b{color:var(--nx-text);font-size:var(--nx-fs-14);font-weight:600}
.nxv-steps span{color:var(--nx-text-2);font-size:var(--nx-fs-13);line-height:var(--nx-lh-13)}
.nxv-note{display:flex;gap:8px;margin:0 0 var(--nx-sp-4);color:var(--nx-text-3);font-size:var(--nx-fs-12);line-height:var(--nx-lh-12)}
.nxv-note .nx-i{flex:none;width:16px;height:16px;color:var(--nx-signal)}
.nxv-hub{display:inline-flex;align-items:center;gap:6px;min-height:44px;color:var(--nx-signal);font:600 var(--nx-fs-14)/var(--nx-lh-14) var(--nx-font);text-decoration:none}
.nxv-hub:hover{color:var(--nx-signal-hover)}
.nxv-hub .nx-i{width:16px;height:16px}
[lang="ar"] .nxv-res-meta{text-align:end}