/* Phone layout overrides. Desktop keeps the original game artwork and geometry. */
.phone-nav{display:none}
@media(max-width:760px){
 html,body{min-width:0!important;width:100%;margin:0;overflow-x:clip}
 body{font-size:15px!important;line-height:1.7!important}
 .wrapper,#mid,#header,#footer{min-width:0!important;max-width:100%!important;width:100%!important;box-sizing:border-box}
 .wrapper{overflow:visible!important}
 #dynamic_header{height:100px!important;min-width:0!important;background-position:center top!important}
 #header{height:auto!important;min-height:0!important;padding:8px!important}
 #mtop{display:none!important}
 .phone-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;direction:rtl;margin:0 0 10px}
 .phone-nav a{display:flex;align-items:center;justify-content:center;min-height:44px;background:#f3f6e9;border:1px solid #bdd291;border-radius:8px;color:#345414;font:bold 13px/1.4 Tahoma,Arial;text-align:center;padding:4px;text-decoration:none}
 .phone-nav a[aria-current=page]{background:#547d27;color:white}
 #mid{float:none!important;display:flex!important;flex-direction:column;margin:0!important}
 #side_navi{float:none!important;width:auto!important;height:auto!important;min-height:0!important;margin:6px 10px!important;padding:8px!important;left:auto!important;right:auto!important;background:#f6f7f1}
 #side_navi #logo{display:none!important}
 #side_navi p{display:flex;flex-wrap:wrap;gap:4px 12px;margin:4px 0!important}
 #side_navi a{display:inline-flex!important;align-items:center;min-height:38px}
 #content{float:none!important;left:0!important;right:0!important;width:100%!important;min-width:0!important;box-sizing:border-box;padding:12px!important;margin:0!important;min-height:300px!important;overflow-x:auto!important}
 #content h1{font-size:22px!important;white-space:normal;height:auto!important;overflow-wrap:anywhere}
 #build{width:auto!important;padding:8px 0!important}
 #side_info{float:none!important;position:static!important;width:auto!important;height:auto!important;min-height:0!important;margin:10px!important}
 #side_info.outgame{display:none!important}
 #res,#resWrap{position:static!important;float:none!important;left:auto!important;right:auto!important;top:auto!important;width:auto!important;height:auto!important;margin:0!important;padding:0!important;direction:rtl}
 #resWrap{overflow-x:auto;font-size:12px}
 #resWrap table{width:100%!important;min-width:0!important}
 #resWrap td{white-space:nowrap;font-size:12px!important;padding:3px!important}
 #ltimeWrap{display:none!important}
 #village_map{zoom:var(--phone-map-scale,1)}
 #content.village1{display:block!important}
 #content.village1 #map_details{width:100%!important;float:none!important;margin:12px 0!important}
 #map_details table{width:100%!important}
 #footer{position:static!important;height:auto!important;padding:16px 10px!important;overflow-wrap:anywhere}
 #footer .mfoot{position:static!important;width:auto!important;margin:0!important}
 input:not([type=checkbox]):not([type=radio]):not([type=image]),select,textarea{font-size:16px!important;max-width:100%;box-sizing:border-box;min-height:40px}
 button:not(.icon),.trav_buttons{min-height:40px;max-width:100%}
 textarea{width:100%!important}
 .textmenu{white-space:normal!important;line-height:2.4!important}
 #regwiz{max-width:100%!important;box-sizing:border-box}
 .rw-body{padding:12px!important}.rw-panel{height:auto!important;min-height:212px;box-sizing:border-box}
 .rw-map{max-width:100%;overflow:hidden}.rw-hdr{padding-inline:30px!important}
 #navigation{position:static!important;width:auto!important;height:auto!important;margin:0 12px!important}
 #navigation a.game-home-brand{position:static!important;width:100%!important;height:auto!important;font-size:23px!important}
 #navigation table.menu{width:100%!important;position:static!important;margin:8px 0!important}
 #navigation table.menu td{padding:4px!important;white-space:normal!important}
 #navigation table.menu a{display:block;min-height:44px;line-height:1.6!important}
 #register_now{position:static!important;width:auto!important;margin:16px!important}
 #content .grit,#content .infobox,#content .secondarybox{float:none!important;width:100%!important;margin:0!important;padding:0!important;box-sizing:border-box}
 #country_select{display:none!important}
 #content .container{max-width:100%;box-sizing:border-box}
 #screenshots{max-width:100%;overflow:hidden}
 #content.login table,#content.activate table{width:100%!important}
}
@media(max-width:760px){
 .rw-portrait{position:static!important;float:left;height:100px!important;width:auto!important;max-width:35%;margin:0 10px 8px 0}
 .rw-badge{display:none!important}
 .rw-info:has(.rw-badge)::before{content:'موصى بها للاعبين الجدد';display:block;color:#42651e;font-size:13px;margin-bottom:10px}
 .rw-name{font-size:22px!important;line-height:1.5!important;letter-spacing:0!important}
 .rw-lines{clear:both!important}.rw-lines li{font-size:14px!important;line-height:1.7!important}
 .rw-intro{font-size:14px!important;line-height:1.8!important}
 .rw-hdr span{font-size:20px!important;line-height:1.5!important;text-align:center!important}
 #player_counter,#what_is_travian,#about_the_game{width:auto!important;max-width:100%!important;box-sizing:border-box}
 #player_counter table{width:100%!important;margin:0!important}#player_counter{background:none!important;padding:12px!important}
}
@media(max-width:760px){
 html[lang="ar"] #side_navi{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center}
 html[lang="ar"] #side_navi p{display:contents!important}
 html[lang="ar"] #side_navi br{display:none}
 html[lang="ar"] #side_navi a{font-size:13px!important;min-height:36px}
 html[lang="ar"] #resWrap table,html[lang="ar"] #resWrap tbody{display:block!important}
 html[lang="ar"] #resWrap tr{display:grid;grid-template-columns:24px minmax(0,1fr) 24px minmax(0,1fr);align-items:center;gap:2px 5px}
 html[lang="ar"] #resWrap td{display:block;direction:ltr;text-align:center;font-size:13px!important}
 html[lang="ar"] #products{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:10px}
 html[lang="ar"] #products table.product{float:none!important;width:100%!important;margin:0!important}
 html[lang="ar"] #products>.clear{display:none}
}
@media(max-width:760px){
 html[lang="ar"] #content.village1 #village_map,html[lang="ar"] #content.village2 #village_map{display:block!important;float:none!important;margin:12px auto!important}
}