.bottom{
position:fixed;
bottom:15px;
left:15px;
right:15px;
height:70px;
background:#171717;
border-radius:25px;
display:flex;
justify-content:space-around;
align-items:center;
box-shadow:0 0 30px rgba(0,0,0,.5);
z-index:999;
}

.bottom div{
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
font-size:12px;
color:#9e9e9e;
gap:5px;
transition:.3s;
}

.bottom div i{
font-size:20px;
}

.bottom div:hover{
color:#c026ff;
}

.middle{
width:65px !important;
height:65px;
border-radius:50%;
background:linear-gradient(135deg,#d946ef,#7e22ce);
margin-top:-40px;
display:flex !important;
justify-content:center;
align-items:center;
box-shadow:0 0 25px rgba(217,70,239,.6);
color:#fff !important;
}

.middle i{
font-size:28px !important;
}

.banner{
box-shadow:0 15px 40px rgba(217,70,239,.3);
}

.box{
border:1px solid #222;
}

.box:hover{
border-color:#d946ef;
box-shadow:0 0 20px rgba(217,70,239,.3);
}

@media(max-width:480px){

.logo h2{
font-size:20px;
}

.banner h1{
font-size:20px;
}

.category{
grid-template-columns:repeat(2,1fr);
}

.box{
padding:22px 10px;
}

}*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:'Vazirmatn',sans-serif;
}

body{
background:#0b0b0b;
color:#fff;
padding-bottom:90px;
}

header{
display:flex;
justify-content:space-between;
align-items:center;
padding:18px;
}

.menu,.profile{
width:45px;
height:45px;
background:#171717;
border-radius:14px;
display:flex;
align-items:center;
justify-content:center;
font-size:20px;
color:#c026ff;
}

.logo{
text-align:center;
}

.logo h2{
font-size:22px;
font-weight:700;
}

.logo span{
color:#888;
font-size:13px;
}

.search{
margin:15px;
background:#171717;
border-radius:18px;
padding:14px;
display:flex;
align-items:center;
gap:10px;
}

.search i{
color:#c026ff;
}

.search input{
background:none;
border:none;
outline:none;
color:white;
width:100%;
font-size:15px;
}

.banner{
margin:15px;
border-radius:25px;
padding:30px 20px;
background:linear-gradient(135deg,#b026ff,#4c1d95);
text-align:center;
}

.banner h1{
font-size:24px;
margin-bottom:10px;
}

.banner p{
opacity:.9;
}

.category{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:15px;
padding:15px;
}

.box{
background:#171717;
border-radius:22px;
padding:30px 10px;
text-align:center;
transition:.3s;
}

.box:hover{
transform:translateY(-5px);
background:#1f1f1f;
}

.box i{
font-size:34px;
color:#c026ff;
margin-bottom:12px;
}

.box p{
font-size:15px;
}
header{
display:flex;
align-items:center;
justify-content:space-between;
padding:20px;
}

.logo{
order:2;
text-align:right;
flex:1;
padding-right:15px;
}

.logo h2{
font-size:18px;
color:#8e96b7;
font-weight:700;
}

.logo span{
display:none;
}

.menu{
order:1;
width:58px;
height:58px;
border-radius:18px;
background:#1a1e27;
color:#c026ff;
font-size:26px;
}

.profile{
order:3;
width:auto;
height:58px;
padding:0 22px;
border-radius:18px;
background:linear-gradient(90deg,#d946ef,#7c3aed);
color:#fff;
font-size:17px;
font-weight:bold;
}

.profile i{
display:none;
}

.profile::before{
content:"حساب کاربری";
}
.search{
margin:18px;
height:64px;
background:#1b1f28;
border:1px solid #313646;
border-radius:22px;
display:flex;
align-items:center;
padding:0 22px;
}

.search input{
width:100%;
background:none;
border:none;
outline:none;
color:#fff;
font-size:22px;
text-align:right;
}

.search input::placeholder{
color:#7f8597;
}

.banner{
margin:18px;
height:220px;
border-radius:24px;
overflow:hidden;
background:url("https://images.unsplash.com/photo-1611605698335-8b1569810432?w=1200") center center;
background-size:cover;
position:relative;
display:flex;
align-items:flex-end;
padding:25px;
}

.banner::before{
content:"";
position:absolute;
inset:0;
background:linear-gradient(to top,rgba(0,0,0,.65),rgba(0,0,0,.1));
}

.banner h1,
.banner p,
.banner button{
position:relative;
z-index:2;
}

.banner h1{
font-size:34px;
margin-bottom:8px;
}

.banner p{
font-size:17px;
margin-bottom:15px;
}

.banner button{
background:#c026ff;
border:none;
color:#fff;
padding:12px 22px;
border-radius:14px;
font-size:17px;
font-weight:bold;
}
.apps{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:16px;
padding:18px;
}

.app{
text-align:center;
}

.icon{
width:74px;
height:74px;
margin:auto;
border-radius:22px;
display:flex;
align-items:center;
justify-content:center;
font-size:30px;
color:white;
margin-bottom:10px;
transition:.25s;
}

.icon:hover{
transform:scale(1.08);
}

.telegram{
background:#2AABEE;
}

.discord{
background:#5865F2;
}

.game{
background:#ff9800;
}

.phone{
background:#20c997;
}

.app span{
font-size:14px;
color:#d7d7d7;
font-weight:600;
}

/* Enhanced overrides */
body{background:linear-gradient(180deg,#12141f 0%,#0f1017 100%)!important;}
.search{background:rgba(30,32,50,.45)!important;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.12)!important;box-shadow:0 0 25px rgba(192,38,255,.18)!important;}
.menu{background:#12182d!important;color:#ff3dff!important;box-shadow:none!important;}
.profile{background:#b000ff!important;box-shadow:none!important;}
.logo h2{color:#fff!important;text-shadow:0 0 10px rgba(192,38,255,.9),0 0 25px rgba(192,38,255,.7)!important;}
.banner{box-shadow:0 0 25px rgba(192,38,255,.45),0 0 80px rgba(192,38,255,.3)!important;}
.banner button{background:#b000ff!important;box-shadow:0 0 18px #c026ff,0 0 45px rgba(192,38,255,.5)!important;}
.telegram{background:#0088ff!important}.discord{background:#5865F2!important}.game{background:#ff3b00!important}.phone{background:#00b140!important}
.middle{background:#b000ff!important;box-shadow:0 0 30px #c026ff,0 0 70px rgba(192,38,255,.7)!important;}
