/* ورود با شماره و کد: خانه‌های مربعی که با تکمیل شدن سبز می‌شوند */
.ob{display:grid;grid-template-columns:repeat(var(--n,6),minmax(0,1fr));gap:6px;direction:ltr;margin:6px 0 10px;max-width:100%}
.ob-box{width:100%;min-width:0;aspect-ratio:1/1;max-height:52px;border:2px solid #d6dee9;border-radius:12px;background:#fff;text-align:center;font:inherit;font-size:clamp(16px,4.2vw,22px);font-weight:800;color:#0f172a;padding:0;transition:border-color .18s,background-color .18s,color .18s,transform .15s,box-shadow .18s;caret-color:transparent}
.ob-box:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 4px rgba(59,130,246,.18);transform:translateY(-1px)}
.ob-box.ok{background:#16a34a;border-color:#16a34a;color:#fff;animation:ob-pop .35s ease}
.ob.is-full .ob-box{box-shadow:0 4px 12px rgba(22,163,74,.25)}
@keyframes ob-pop{0%{transform:scale(.9)}60%{transform:scale(1.06)}100%{transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.ob-box,.ob-box.ok{transition:none;animation:none}}