/* ===== جيم جواب: ضبط الموبايل (بيتحمّل آخر شي، فبيغلب الطبقات القديمة) =====
   1) كل أجهزة اللمس: أهداف لمس مريحة، خطوط مقروءة، بدون تكبير عفوي، مناطق آمنة (النوتش)
   2) الجوال بالوضع الأفقي (ارتفاع قصير): الصفحة الرئيسية بتنعرض كاملة بالشاشة الأولى */
:root{--tap:44px}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
@media (pointer:coarse){
  a,button,[role=button],[data-a],select,summary,label.chip,.chip{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
  input,select,textarea{font-size:max(16px,1em)}
  /* أهداف لمس: بنوسّع منطقة اللمس بدون ما نغيّر الشكل */
  html body header nav a.nl,html body footer a,html body .legal a{position:relative}
  html body header nav a.nl::before,html body footer a::before{content:"";position:absolute;inset:-10px -6px}
  html body footer a,html body .legal a{display:inline-block;padding:8px 4px}
}
@media (pointer:coarse) and (orientation:landscape){
  html body header .wrap,html body .hero .wrap,html body footer .wrap{padding-left:max(var(--pad,16px),env(safe-area-inset-left))!important;padding-right:max(var(--pad,16px),env(safe-area-inset-right))!important}
}
/* ---- جوال أفقي: شريط علوي رفيع + صفحة رئيسية كاملة بدون تمرير ---- */
@media (orientation:landscape) and (max-height:520px) and (pointer:coarse){
  html body header .wrap{height:56px!important;min-height:0!important;padding-top:0!important;padding-bottom:0!important;gap:12px!important;box-sizing:border-box}
  html body header .logo{font-size:1.9rem!important}
  html body header nav{gap:14px!important}
  html body header nav a.nl{font-size:.95rem!important;padding:12px 2px!important;line-height:1!important}
  html body header .buyb{height:38px!important;min-height:38px!important;font-size:.85rem!important}
  html body .hero#top{min-height:calc(100dvh - 56px)!important;display:flex!important;flex-direction:column!important;justify-content:center!important;padding-top:6px!important;padding-bottom:10px!important;box-sizing:border-box}
  html body .hero#top .hc{margin:0!important;padding-top:0!important;padding-bottom:0!important}
  html body .hero#top h1.wm{width:clamp(56px,22vh,96px)!important;height:clamp(56px,22vh,96px)!important;margin:0 auto 2px!important}
  html body .hero#top p.wel{font-size:clamp(.8rem,3.6vh,1rem)!important;margin:2px 0!important;line-height:1.35!important}
  html body .hero#top p.meta{font-size:clamp(.7rem,3.1vh,.85rem)!important;margin:0!important;line-height:1.3!important}
  html body .hero .wrap.tiles{--b:clamp(52px,min(10.5vw,19.5vh),140px)!important;--w:clamp(52px,min(13.6vw,25.5vh),200px)!important;margin-top:calc(var(--s) + 14px)!important;padding-bottom:calc(var(--s) + 4px)!important}
  html body .hero .tiles .tile .soon{font-size:.62rem!important;padding:1px 7px!important}
}
@media (orientation:landscape) and (max-height:520px) and (pointer:coarse){
  /* صفحة اللعبة: هيرو مضغوط، الفئات بتظهر بدون تمرير طويل */
  html body #pickscreen #phero#phero{min-height:0!important;padding:8px 0 4px!important}
  html body #pickscreen #phero .hc{margin:0!important}
  html body #pickscreen #phero .phtitle{font-size:clamp(1.2rem,6vh,1.7rem)!important;margin:0!important;line-height:1.2!important;height:auto!important;min-height:0!important;padding:0!important}
  html body #pickscreen #phero .phsub{font-size:clamp(.78rem,3.4vh,.95rem)!important;margin:2px 0 0!important}
  html body #pickscreen #phero .wrap.tiles{--b:clamp(52px,min(10vw,17vh),112px)!important;--w:clamp(52px,min(13vw,23vh),176px)!important;margin-top:calc(var(--s) + 6px)!important;padding-bottom:calc(var(--s) + 2px)!important}
  html body #pickscreen #phero .wvx{height:120px!important}
  html body #pickscreen #phero .tile{width:clamp(56px,11.5vw,104px)!important;height:clamp(84px,25vh,118px)!important}
  html body #pickscreen #phero .t-play{width:clamp(62px,13vw,118px)!important;height:clamp(96px,28vh,132px)!important}
  html body #pickscreen #phero .tile b{font-size:clamp(.7rem,3vh,.95rem)!important}
}
@media (pointer:coarse){
  /* أيقونة المعلومات على بلاطة الفئة: مساحة لمس أكبر بدون تغيير الشكل */
  .cinfo{position:relative}
  .cinfo::before{content:"";position:absolute;inset:-12px}
  .cn{font-size:max(.7rem,11px)!important}
  .soon{font-size:max(.62rem,10px)!important}
}
@media (pointer:coarse){
  /* شاشة اللعب: أزرار الشريط العلوي والعدادات والمؤقّت: لمس مريح */
  html body #gh .gb{min-height:40px;padding-inline:10px;font-size:max(.72rem,11.5px)}
  .pm,#tpause,#trest{position:relative}
  .pm::before,#tpause::before,#trest::before{content:"";position:absolute;inset:-10px}
  html body #qview .btn,html body #qrow .btn{min-height:40px}
  #qtag{font-size:max(.7rem,11px)!important}
  .gturn .tl,.gturn .tnm{font-size:max(.72rem,11.5px)!important}
}
/* ---- مافيا (شاشة المضيف) بجوال أفقي: كل شي بالشاشة الأولى ---- */
@media (orientation:landscape) and (max-height:520px) and (pointer:coarse){
  html body .wrap{padding-top:6px!important;padding-bottom:8px!important}
  html body .wrap>.bar{margin:0!important;padding:0!important;gap:8px!important}
  html body .bar .tools{gap:6px!important;flex-wrap:nowrap!important}
  html body .bar .ib,html body .bar .mbuy{font-size:.78rem!important;padding:4px 9px!important;white-space:nowrap}
  html body .bar img{height:34px!important;width:auto!important}
  html body .stage .setup>.row.c .btn{min-height:40px!important;padding:6px 18px!important;font-size:.95rem!important}
  html body .stage .setup>.row.c{margin:0!important}
  html body .stage .hero.sm h1{font-size:clamp(2.2rem,15vh,3.4rem)!important;line-height:1.15!important;margin:0!important}
  html body .stage .hero.sm p{font-size:clamp(.9rem,4.4vh,1.1rem)!important;margin:2px 0 0!important}
  html body .stage .setup{gap:8px!important;margin-top:6px!important}
  html body .stage .setup .bigbtn{min-height:0!important;padding:10px 40px!important;font-size:clamp(1.3rem,6.5vh,1.8rem)!important}
  html body .stage .setup .ib2{min-height:40px!important}
  html body .stage .setup .steps3{display:none!important}
}
@media (pointer:coarse){
  html body .homeb,html body .ib,html body .ib2,html body .mbuy{min-height:40px}
  html body .bdrop,html body #bdrop{max-height:calc(100dvh - var(--hh,80px) - 22px)!important;overscroll-behavior:contain}
}
@media (orientation:landscape) and (max-height:380px) and (pointer:coarse){
  html body .stage .hero.sm h1{font-size:2.1rem!important}
  html body .stage .hero.sm p{display:none!important}
  html body .bar .tools{flex-wrap:wrap!important}
  html body .stage .setup{gap:6px!important;margin-top:2px!important}
  html body .stage .setup .bigbtn{padding:6px 34px!important;font-size:1.25rem!important}
  html body .stage .setup .ib2{min-height:36px!important;font-size:.8rem!important;padding:2px 12px!important}
  html body .bar img{display:none!important}
}
@media (pointer:coarse){
  /* كيدز + صفحات القانون + لاعب المافيا (جوال عمودي) */
  html body .pill,html body .hbtns .pill{min-height:40px}
  html body .nav a{display:inline-block;padding:10px 6px}
  html body .homeb,html body .ib{min-height:40px}
  html body .pl .wh{font-size:max(.72rem,12px)}
}
@media (max-width:620px) and (orientation:portrait){
  html body .wrap{padding-top:max(16px,env(safe-area-inset-top))}
}
@media (pointer:coarse){
  html body .hero .tiles .tile .soon,html body #pickscreen #phero .tile .soon{font-size:10px!important;line-height:1.5!important}
  html body #pickscreen header#phdr nav a.nl,html body #pickscreen header#phdr nav a.mg{padding-top:12px!important;padding-bottom:12px!important}
}
