
/* Hany modern visual layer - presentation only */
:root{--hany-green:#174f3b;--hany-green-2:#2b8a5b;--hany-gold:#d8a847;--hany-cream:#f7f0df;--hany-ink:#26352d}
html,body{background:#dfe9df!important;color:var(--hany-ink)!important}
body{font-family:Tahoma,Arial,sans-serif!important}
#background{background:linear-gradient(180deg,#b9d8c3 0,#e7f0e2 42%,#d9e5d6 100%)!important;min-height:100vh}
#bodyWrapper{max-width:1240px!important;margin:0 auto!important;box-shadow:0 0 32px #173b2a2b!important;background:#edf4e9!important;border-radius:0 0 18px 18px!important}
#header{background:linear-gradient(135deg,#0d382b,#246f4b 58%,#173e31)!important;height:78px!important;border-bottom:3px solid var(--hany-gold)!important;box-shadow:0 5px 16px #102d2140!important;position:relative!important}
#header:after{content:"HANY WORLD  •  عالم استراتيجي عربي";position:absolute;right:26px;bottom:10px;color:#dcedd9cc;font-size:11px;letter-spacing:.2px}
#mtop{padding:0 22px!important}
#logo{filter:brightness(0) invert(1)!important;opacity:.96!important;transform:scale(.9);transform-origin:right center}
#center{padding:18px 18px 32px!important}
#sidebarBeforeContent{background:linear-gradient(180deg,#123c2f,#1d6246)!important;border-radius:14px!important;padding:8px!important;box-shadow:0 8px 20px #122f2440!important}
#sidebarBeforeContent .sidebarBox{background:transparent!important;border:0!important}
#sidebarBeforeContent .innerBox.content{background:transparent!important;padding:6px!important}
#sidebarBeforeContent li{margin:4px 0!important;border-radius:8px!important;overflow:hidden!important}
#sidebarBeforeContent li a,#sidebarBeforeContent li.active{display:block!important;padding:10px 12px!important;color:#f8f2df!important;background:#ffffff12!important;text-decoration:none!important}
#sidebarBeforeContent li.active,#sidebarBeforeContent li:hover{background:linear-gradient(90deg,#d8a847,#b77f31)!important;color:#fff!important}
#contentOuterContainer{background:transparent!important}
#contentContainer,#content{border-radius:16px!important}
.contentTitle{background:linear-gradient(135deg,#174f3b,#2b8a5b)!important;border:0!important;border-radius:14px 14px 0 0!important;color:#fff!important;box-shadow:0 5px 15px #173b2a22!important}
.titleInHeader{color:#fff!important;text-shadow:0 1px 2px #061a12!important}
#content{background:#fffdf7!important;border:1px solid #d8cda9!important;box-shadow:0 8px 24px #173b2a1c!important}
.contentNavi,.contentMenu{border-radius:10px!important}
#header a,#mtop a{color:#fff!important}
.green,.greenButton,.button-content{background:linear-gradient(180deg,#55b96d,#23764e)!important;border-color:#d8a847!important;color:#fff!important;border-radius:8px!important;text-shadow:0 1px 1px #173b2a!important}
input,select,textarea{border:1px solid #b9c99c!important;border-radius:7px!important;background:#fffef9!important;color:#26352d!important}
input:focus,select:focus,textarea:focus{outline:2px solid #d8a84755!important;border-color:#2b8a5b!important}
.box,.basicBox,.greenbox,.resourceBar,.production,.buildingBox{border-radius:12px!important}
table{border-collapse:separate!important;border-spacing:0!important;overflow:hidden!important;border-radius:10px!important}
th{background:#1d6246!important;color:#fff!important}
td{background:#fffdf7!important;border-color:#dfe5d0!important}
tr:nth-child(even) td{background:#f1f7ed!important}
a{color:#17664b}
@media(max-width:800px){#bodyWrapper{width:100%!important;border-radius:0!important}#header{height:64px!important}#header:after{right:14px;bottom:7px;font-size:9px}#mtop{padding:0 10px!important}#center{padding:10px 8px 24px!important}#sidebarBeforeContent{margin-bottom:10px!important}.contentTitle{border-radius:10px 10px 0 0!important}#content{overflow-x:auto!important}.logo{max-width:180px!important}}


/* Hany navigation cards */
#header{z-index:20!important}#navigation{position:absolute!important;left:22px!important;bottom:9px!important;display:flex!important;gap:7px!important;align-items:flex-end!important;margin:0!important;padding:0!important;z-index:5!important}#navigation li{list-style:none!important;position:relative!important;width:48px!important;height:48px!important;margin:0!important;border:1px solid #d8a84799!important;border-radius:10px!important;background:linear-gradient(145deg,#2b8a5b,#123c2f)!important;box-shadow:0 4px 10px #061a1255!important;transition:transform .2s ease,filter .2s ease!important}#navigation li:hover{transform:translateY(-3px)!important;filter:brightness(1.13)!important}#navigation li a{display:grid!important;place-items:center!important;width:100%!important;height:100%!important;background:none!important;border:0!important;text-decoration:none!important;color:#fff4cf!important;font-size:25px!important;line-height:1!important;opacity:1!important}#navigation li a:after{display:block!important}#n1 a:after{content:"⌂"}#n2 a:after{content:"🏰";font-size:22px}#n3 a:after{content:"🗺";font-size:22px}#n4 a:after{content:"🏆";font-size:21px}#n5 a:after{content:"⚔";font-size:22px}#n6 a:after{content:"✉";font-size:23px}#n7 a:after{content:"✦";font-size:25px;color:#ffe08b}#navigation li a.active{background:linear-gradient(145deg,#d8a847,#9b6727)!important;border-radius:9px!important}#navigation li:before{content:"";position:absolute;top:4px;right:5px;width:5px;height:5px;border-radius:50%;background:#79db88;box-shadow:0 0 7px #79db88;z-index:2}#navigation li#n5:has(.speechBubbleContainer):before,#navigation li#n6:has(.speechBubbleContainer):before{background:#ef6c5b;box-shadow:0 0 7px #ef6c5b}#logo{z-index:6!important}#header #logo:after{content:"";display:block}@media(max-width:800px){#navigation{left:8px!important;bottom:5px!important;gap:4px!important}#navigation li{width:38px!important;height:38px!important;border-radius:8px!important}#navigation li a{font-size:20px!important}#n2 a:after,#n3 a:after,#n4 a:after,#n5 a:after{font-size:17px!important}#n6 a:after,#n7 a:after{font-size:19px!important}}



/* Village dashboard */
#stockBar{display:flex!important;align-items:stretch!important;gap:7px!important;margin:0 auto 14px!important;padding:10px!important;background:linear-gradient(135deg,#123c2f,#1d6246)!important;border:1px solid #d8a847!important;border-radius:14px!important;box-shadow:0 8px 20px #173b2a33!important;direction:ltr!important}
#stockBar>li{position:relative!important;float:none!important;min-width:92px!important;height:48px!important;border:1px solid #d8a84766!important;border-radius:9px!important;background:#fffdf4!important;box-shadow:0 3px 8px #081a1222!important;overflow:hidden!important}
#stockBar>li .middle{height:100%!important;background:transparent!important;padding:5px 8px!important}
#stockBar>li .begin,#stockBar>li .end{display:none!important}
#stockBar>li .value{color:#173e30!important;font-weight:700!important;font-size:13px!important;text-shadow:none!important}
#stockBar>li .barBox{height:5px!important;background:#dfe8d5!important;border-radius:5px!important;overflow:hidden!important;margin-top:5px!important}
#stockBar>li .bar{height:100%!important;border-radius:5px!important;background:linear-gradient(90deg,#d8a847,#2b8a5b)!important}
#stockBar>li i{filter:saturate(1.25)!important;transform:scale(.9)!important}
#stockBar>li.stock:first-child,#stockBar>li#stockBarWarehouseWrapper,#stockBar>li#stockBarGranaryWrapper{background:linear-gradient(180deg,#fffdf6,#e8f1e2)!important}
#resourceFieldContainer{position:relative!important;margin:0 auto 18px!important;padding:14px!important;background:linear-gradient(145deg,#c7dfc5,#eaf3e5)!important;border:1px solid #82aa7f!important;border-radius:18px!important;box-shadow:inset 0 0 0 5px #ffffff55,0 10px 25px #173b2a22!important}
#resourceFieldContainer:before{content:"حقول الموارد";position:absolute!important;top:9px!important;right:16px!important;padding:4px 10px!important;color:#fff!important;background:#174f3b!important;border:1px solid #d8a847!important;border-radius:7px!important;font-size:12px!important;font-weight:700!important;z-index:2!important}
#village_map{filter:drop-shadow(0 10px 14px #173b2a33)!important;transition:transform .25s ease,filter .25s ease!important}
#village_map:hover{transform:translateY(-2px)!important;filter:drop-shadow(0 14px 18px #173b2a44)!important}
#village_map .level .labelLayer{font-weight:700!important;color:#fff!important;text-shadow:0 1px 3px #000!important}
#village_map .level.underConstruction{animation:hanyPulse 1.8s ease-in-out infinite!important}
@keyframes hanyPulse{0%,100%{filter:brightness(1)}50%{filter:brightness(1.18) saturate(1.15)}}
#production{border:1px solid #d8a847!important;background:#fffdf7!important;box-shadow:0 7px 16px #173b2a22!important}
#production th{background:linear-gradient(90deg,#174f3b,#2b8a5b)!important;color:#fff!important}
#production td{background:#fffdf7!important;color:#26352d!important}
#production tr:nth-child(even) td{background:#edf5e9!important}
.productionBoostButton{border-radius:8px!important}
@media(max-width:800px){#stockBar{overflow-x:auto!important;justify-content:flex-start!important;padding:7px!important;gap:5px!important}#stockBar>li{min-width:76px!important;height:44px!important}#stockBar>li .value{font-size:11px!important}#resourceFieldContainer{padding:7px!important;border-radius:13px!important}#resourceFieldContainer:before{top:5px!important;right:10px!important;font-size:10px!important}#village_map{transform:scale(.98)!important;transform-origin:center top!important}}



/* Layout overflow correction */
html,body{max-width:100%!important;overflow-x:hidden!important}
#bodyWrapper{max-width:1240px!important;width:100%!important;overflow:hidden!important}
#center{min-width:0!important;max-width:100%!important;box-sizing:border-box!important}
#contentOuterContainer,#contentContainer,#content{max-width:100%!important;box-sizing:border-box!important}
#stockBar{max-width:100%!important;box-sizing:border-box!important}
@media(max-width:800px){#bodyWrapper{width:100%!important;overflow:hidden!important}#center{padding-left:6px!important;padding-right:6px!important}#content{width:100%!important;overflow-x:hidden!important}}

