/* MegaBrain — Arqon tortish final mobile cleanup 2026-08-26 */
/* 1) Screenshotdagi yog'och/gorizontal rope elementini ko'rsatmaymiz. */
#pageOyin2.arqon-active .arqon-rope,
#pageOyin2.arqon-active .arqon-rope-marker{display:none !important; visibility:hidden !important; opacity:0 !important; pointer-events:none !important;}

/* Arena pastidagi dekor ham yo'q: faqat jamoalar va markaziy maydon qoladi. */
#pageOyin2.arqon-active .arqon-arena-bg:before,
#pageOyin2.arqon-active .arqon-arena-bg:after{display:none !important; content:none !important;}

/* Telefon keypad: faqat bizning virtual keypad ishlaydi, native klaviatura chiqmaydi. */
@media (max-width:700px){
  #pageOyin2.arqon-active .arqon-example-wrap{position:relative !important; min-height:0 !important;}
  #pageOyin2.arqon-active .o2-keypad-overlay{
    position:absolute !important; inset:0 !important; z-index:100 !important;
    display:flex !important; flex-direction:column !important; justify-content:center !important;
    box-sizing:border-box !important; padding:38px 10px 10px !important;
    border-radius:14px !important; background:rgba(248,250,255,.985) !important;
    border:1px solid rgba(79,70,229,.18) !important;
    box-shadow:0 12px 30px rgba(30,41,59,.18) !important;
    opacity:0 !important; visibility:hidden !important; pointer-events:none !important;
    transform:none !important;
  }
  #pageOyin2.arqon-active .o2-keypad-overlay.open{
    opacity:1 !important; visibility:visible !important; pointer-events:auto !important;
  }
  #pageOyin2.arqon-active .o2-kp-close{
    position:absolute !important; top:7px !important; right:7px !important;
    width:32px !important; height:32px !important; border-radius:50% !important;
    border:1px solid #c7d2fe !important; background:#fff !important; color:#4f46e5 !important;
    font-size:16px !important; font-weight:900 !important; z-index:5 !important;
  }
  #pageOyin2.arqon-active .o2-keypad{
    width:min(100%,330px) !important; margin:0 auto !important; padding:0 !important;
    display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:7px !important;
  }
  #pageOyin2.arqon-active .o2-key,
  #pageOyin2.arqon-active .o2-submit{
    min-width:0 !important; width:100% !important; height:clamp(44px,10vw,54px) !important;
    min-height:44px !important; border-radius:12px !important; font-weight:900 !important;
    touch-action:manipulation !important; -webkit-tap-highlight-color:transparent !important;
  }
  #pageOyin2.arqon-active .o2-key{border:1px solid #c7d2fe !important; background:linear-gradient(180deg,#fff,#eef2ff) !important; color:#3730a3 !important; font-size:20px !important;}
  #pageOyin2.arqon-active .o2-key-back{background:#fef2f2 !important; border-color:#fecaca !important; color:#dc2626 !important;}
  #pageOyin2.arqon-active .o2-submit{border:0 !important; background:linear-gradient(135deg,#4f46e5,#2563eb) !important; color:#fff !important; font-size:14px !important; box-shadow:0 6px 14px rgba(79,70,229,.22) !important;}
  #pageOyin2.arqon-active .o2-key:active,
  #pageOyin2.arqon-active .o2-submit:active{transform:scale(.97) !important;}
  #pageOyin2.arqon-active .arqon-answer{font-size:20px !important; min-height:42px !important; height:42px !important;}
}
@media (max-width:380px){
  #pageOyin2.arqon-active .o2-keypad{width:min(100%,285px) !important; gap:5px !important;}
  #pageOyin2.arqon-active .o2-key,
  #pageOyin2.arqon-active .o2-submit{height:42px !important; min-height:42px !important; border-radius:10px !important;}
  #pageOyin2.arqon-active .o2-key{font-size:18px !important;}
}
@media (max-width:700px) and (orientation:landscape){
  #pageOyin2.arqon-active .o2-keypad-overlay{padding:34px 8px 7px !important;}
  #pageOyin2.arqon-active .o2-keypad{width:min(100%,390px) !important; gap:5px !important;}
  #pageOyin2.arqon-active .o2-key,
  #pageOyin2.arqon-active .o2-submit{height:36px !important; min-height:36px !important;}
}

/* ================================================================
   ARQON TORTISH — telefonda faqat ALBOM (landscape) holatda ishlaydi.
   Portret holatda (kichik telefon ekranlarida) o'yin maydoni
   bloklanadi va "albom holatga o'giring" ko'rsatmasi chiqadi.
   Faqat #pageOyin2.arqon-active (arqon tortish rejimi) ga ta'sir
   qiladi — Poyga (race) rejimi bundan mustasno, o'zgarishsiz qoladi.
   ================================================================ */
#pageOyin2 .arqon-rotate-hint{display:none;}
@media (max-width:700px) and (orientation:portrait){
  #pageOyin2.arqon-active .arqon-scorebar,
  #pageOyin2.arqon-active .arqon-board,
  #pageOyin2.arqon-active .arqon-hint{
    display:none !important;
  }
  #pageOyin2.arqon-active .arqon-rotate-hint{
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:10px; text-align:center; width:100%; max-width:420px; margin:40px auto;
    padding:36px 22px; background:#ffffff; border:1px dashed #e5e7eb;
    border-radius:20px; color:#6b7280; font-weight:700;
  }
  #pageOyin2.arqon-active .arqon-rotate-icon{
    font-size:40px; animation:arqonRotateHintSpin 1.8s ease-in-out infinite;
  }
  #pageOyin2.arqon-active .arqon-rotate-sub{
    font-size:12px; font-weight:600; color:#6b7280; opacity:.8;
  }
}
@keyframes arqonRotateHintSpin{
  0%,100%{transform:rotate(0deg);}
  50%{transform:rotate(90deg);}
}