/* =========================================================
   MuDragonLord / WebEngine CMS — PREMIUM MMORPG REBORN UI
   Visual layer only. No PHP logic/database changes.
   Compatible with Bootstrap 3 and PHP 7.4 hosting.
   ========================================================= */
:root{
  --mu-bg:#05070d;
  --mu-bg-2:#09101b;
  --mu-panel:#0d1422;
  --mu-panel-2:#111a2b;
  --mu-panel-3:#172236;
  --mu-gold:#d9b85a;
  --mu-gold-2:#ffda7a;
  --mu-gold-dark:#7d5b1f;
  --mu-blue:#2f75bb;
  --mu-blue-2:#70b7ff;
  --mu-red:#9b1c1f;
  --mu-red-2:#e14545;
  --mu-green:#3fda8d;
  --mu-silver:#d7e3f2;
  --mu-muted:#7f91aa;
  --mu-dim:#43546d;
  --mu-border:rgba(217,184,90,.28);
  --mu-border-blue:rgba(112,183,255,.20);
  --mu-glass:rgba(11,17,29,.76);
  --mu-shadow:0 18px 52px rgba(0,0,0,.52);
  --mu-glow-gold:0 0 24px rgba(217,184,90,.22);
  --mu-glow-blue:0 0 28px rgba(47,117,187,.24);
  --mu-radius:14px;
  --mu-radius-sm:9px;
  --mu-font-title:'Cinzel Decorative','Cinzel',serif;
  --mu-font-ui:'Cinzel',Arial,sans-serif;
}
html{scroll-behavior:smooth;background:#020306;}
body{
  color:var(--mu-silver)!important;
  background:
    radial-gradient(circle at 50% -10%, rgba(57,109,171,.28), transparent 35%),
    radial-gradient(circle at 15% 12%, rgba(217,184,90,.10), transparent 34%),
    radial-gradient(circle at 90% 30%, rgba(145,24,36,.13), transparent 32%),
    linear-gradient(180deg,#05070d 0%,#090d16 38%,#04060b 100%)!important;
  min-height:100vh;
  font-family:Arial,Helvetica,sans-serif;
  overflow-x:hidden;
}
body::before{
  content:'';position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:
    linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.014) 1px,transparent 1px);
  background-size:68px 68px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.8),transparent 82%);
}
body::after{
  content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(2px 2px at 12% 20%,rgba(255,218,122,.28),transparent 60%),
    radial-gradient(1px 1px at 78% 18%,rgba(112,183,255,.24),transparent 60%),
    radial-gradient(2px 2px at 42% 75%,rgba(255,218,122,.13),transparent 60%),
    linear-gradient(180deg,rgba(0,0,0,.15),rgba(0,0,0,.45));
  animation:muAurora 16s ease-in-out infinite alternate;
}
@keyframes muAurora{from{filter:hue-rotate(0deg) brightness(1)}to{filter:hue-rotate(-10deg) brightness(1.08)}}
::selection{background:rgba(217,184,90,.35);color:#fff;}
a{color:#8fc7ff;transition:color .2s ease,filter .2s ease,text-shadow .2s ease;}a:hover{color:var(--mu-gold-2);text-decoration:none;text-shadow:0 0 12px rgba(217,184,90,.25)}
#navbar{
  position:sticky!important;top:0;z-index:1050!important;
  background:linear-gradient(180deg,rgba(9,13,22,.96),rgba(4,6,10,.92))!important;
  border-bottom:1px solid rgba(217,184,90,.26)!important;
  box-shadow:0 12px 38px rgba(0,0,0,.58),inset 0 -1px 0 rgba(112,183,255,.12)!important;
  backdrop-filter:blur(10px);
}
#navbar::before{content:'';position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,var(--mu-blue-2),var(--mu-gold-2),var(--mu-blue-2),transparent);opacity:.55;}
.iv-navbar-inner{max-width:1240px!important;width:calc(100% - 30px)!important;min-height:58px;}
#navbar ul,#navbar .iv-navbar-inner>ul{gap:4px;}
#navbar ul li a,.iv-nav-auth,.iv-nav-register{
  min-height:38px!important;border-radius:10px!important;border:1px solid transparent!important;
  color:#a8b9d0!important;font-family:var(--mu-font-ui)!important;font-size:11px!important;letter-spacing:.11em!important;
  text-shadow:0 1px 0 #000!important;position:relative;overflow:hidden;
}
#navbar ul li a::after,.iv-nav-auth::after,.iv-nav-register::after{content:'';position:absolute;left:18%;right:18%;bottom:5px;height:1px;background:linear-gradient(90deg,transparent,var(--mu-gold),transparent);opacity:0;transform:scaleX(.35);transition:.25s ease;}
#navbar ul li a:hover,.iv-nav-auth:hover,.iv-nav-register:hover{background:rgba(112,183,255,.07)!important;border-color:rgba(112,183,255,.22)!important;color:#fff!important;box-shadow:var(--mu-glow-blue)!important;transform:translateY(-1px);}
#navbar ul li a:hover::after,.iv-nav-auth:hover::after,.iv-nav-register:hover::after{opacity:.9;transform:scaleX(1);}
#navbar ul li.active a,#navbar ul li a.active{color:var(--mu-gold-2)!important;background:rgba(217,184,90,.08)!important;border-color:rgba(217,184,90,.28)!important;}
.iv-nav-register,#navbar ul li a.iv-nav-buycredits{background:linear-gradient(180deg,rgba(217,184,90,.14),rgba(87,62,20,.12))!important;border-color:rgba(217,184,90,.45)!important;color:var(--mu-gold-2)!important;box-shadow:0 0 20px rgba(217,184,90,.12)!important;}
#header{min-height:220px!important;padding:42px 0 24px!important;position:relative;overflow:hidden;}
#header::before{content:'';position:absolute;left:50%;top:10px;width:900px;height:260px;transform:translateX(-50%);background:radial-gradient(ellipse at center,rgba(47,117,187,.28),rgba(217,184,90,.09) 34%,transparent 70%);filter:blur(2px);}
#header::after{content:'MU ONLINE';position:absolute;left:50%;top:22px;transform:translateX(-50%);font-family:var(--mu-font-title);font-size:92px;letter-spacing:.18em;font-weight:900;color:rgba(255,255,255,.025);white-space:nowrap;pointer-events:none;}
.webengine-mu-logo{position:relative;z-index:2;max-height:150px!important;filter:drop-shadow(0 0 18px rgba(217,184,90,.36)) drop-shadow(0 18px 24px rgba(0,0,0,.6));animation:muLogoFloat 4.2s ease-in-out infinite;}
@keyframes muLogoFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
#container{max-width:1240px!important;width:calc(100% - 30px)!important;margin:0 auto 40px!important;position:relative;}
#content{background:linear-gradient(180deg,rgba(8,13,22,.74),rgba(4,6,12,.62))!important;border:1px solid rgba(217,184,90,.16)!important;border-radius:22px!important;box-shadow:var(--mu-shadow),inset 0 1px 0 rgba(255,255,255,.04)!important;padding:22px!important;position:relative;overflow:visible!important;}
#content::before{content:'';position:absolute;inset:-1px;border-radius:22px;padding:1px;background:linear-gradient(135deg,rgba(217,184,90,.38),rgba(112,183,255,.14),rgba(145,28,31,.25),rgba(217,184,90,.22));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;}
.panel,.panel-sidebar,.panel-news,.iv-chat-wrap,.iv-castle-wrap,.iv-events-panel,.ranking-card,.streamer-card,.guide-card,.donation-card,.article-item,.download-item,.news-item,.well,.box,.module-content{
  background:linear-gradient(180deg,rgba(15,24,39,.92),rgba(8,12,22,.95))!important;border:1px solid rgba(217,184,90,.20)!important;border-radius:var(--mu-radius)!important;box-shadow:0 18px 45px rgba(0,0,0,.46),inset 0 1px 0 rgba(255,255,255,.04)!important;overflow:hidden;position:relative;
}
.panel::before,.panel-sidebar::before,.panel-news::before,.iv-chat-wrap::before,.iv-castle-wrap::before,.iv-events-panel::before,.ranking-card::before,.streamer-card::before,.guide-card::before,.donation-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--mu-blue-2),var(--mu-gold-2),var(--mu-blue-2),transparent);opacity:.85;z-index:2;}
.panel::after,.panel-sidebar::after,.panel-news::after{content:'';position:absolute;right:-80px;top:-80px;width:180px;height:180px;background:radial-gradient(circle,rgba(112,183,255,.08),transparent 66%);pointer-events:none;}
.panel-heading,.panel > .panel-heading,.panel-sidebar>.panel-heading,.panel-news>.panel-heading{
  background:linear-gradient(180deg,rgba(24,34,54,.92),rgba(8,12,20,.82))!important;border-bottom:1px solid rgba(217,184,90,.14)!important;padding:15px 19px!important;position:relative;
}
.panel-title,.panel-heading h3,.panel-heading .panel-title,h1,h2,h3,.page-header{
  font-family:var(--mu-font-title)!important;letter-spacing:.08em;color:#f4f0df!important;text-transform:uppercase;text-shadow:0 2px 8px rgba(0,0,0,.65),0 0 16px rgba(217,184,90,.12);}
.panel-title::before,.page-header::before{content:'✦';color:var(--mu-gold);margin-right:9px;font-family:serif;text-shadow:0 0 12px rgba(217,184,90,.5)}
.panel-body{color:#b9c7d8!important;background:linear-gradient(180deg,rgba(255,255,255,.018),rgba(0,0,0,.10))!important;}
#iv-slider{height:360px!important;max-height:360px!important;border-radius:22px!important;border-color:rgba(217,184,90,.35)!important;box-shadow:0 24px 60px rgba(0,0,0,.62),0 0 46px rgba(47,117,187,.14)!important;}
#iv-slider::before{content:'';position:absolute;inset:0;z-index:3;pointer-events:none;background:linear-gradient(90deg,rgba(0,0,0,.65),transparent 52%,rgba(0,0,0,.32)),linear-gradient(180deg,transparent 55%,rgba(0,0,0,.72));}
#iv-slider .carousel-inner,#iv-slider .item,#iv-slider .item img{height:360px!important;max-height:360px!important;}
#iv-slider .item img{filter:saturate(1.08) contrast(1.08);}
#iv-slider .carousel-caption{z-index:4!important;left:42px!important;right:auto!important;bottom:38px!important;text-align:left!important;max-width:620px;background:linear-gradient(90deg,rgba(4,7,13,.76),rgba(4,7,13,.36))!important;border:1px solid rgba(217,184,90,.22)!important;border-left:3px solid var(--mu-gold)!important;border-radius:16px!important;padding:22px 26px!important;box-shadow:0 16px 38px rgba(0,0,0,.38)!important;}
#iv-slider .carousel-caption h3{font-size:27px!important;line-height:1.1!important;margin-bottom:9px!important;}
#iv-slider .carousel-caption p{font-size:14px!important;color:#c2d0e4!important;line-height:1.55!important;}
#iv-slider .carousel-indicators li{width:28px;height:4px;border-radius:99px;border:0;background:rgba(255,255,255,.22);margin:0 4px;}.carousel-indicators .active{background:var(--mu-gold)!important;box-shadow:0 0 14px rgba(217,184,90,.55)!important;}
.btn,.btn-primary,.btn-success,.btn-info,.btn-warning,.btn-danger,button,input[type=submit],.button{
  border:1px solid rgba(217,184,90,.38)!important;border-radius:11px!important;background:linear-gradient(180deg,rgba(217,184,90,.28),rgba(96,70,20,.32))!important;color:#fff!important;font-family:var(--mu-font-ui)!important;font-weight:700!important;letter-spacing:.08em!important;text-transform:uppercase!important;text-shadow:0 1px 0 #000!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 10px 24px rgba(0,0,0,.30),0 0 18px rgba(217,184,90,.13)!important;transition:all .22s ease!important;position:relative;overflow:hidden;
}
.btn::before,button::before,input[type=submit]::before{content:'';position:absolute;top:0;bottom:0;left:-70%;width:50%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.20),transparent);transform:skewX(-18deg);transition:left .45s ease;}
.btn:hover::before,button:hover::before,input[type=submit]:hover::before{left:130%;}.btn:hover,button:hover,input[type=submit]:hover{transform:translateY(-2px);filter:brightness(1.13);box-shadow:0 15px 32px rgba(0,0,0,.35),0 0 28px rgba(217,184,90,.24)!important;}
.btn-xs,.btn-sm{border-radius:8px!important;}
.form-control,input[type=text],input[type=password],input[type=email],input[type=number],input[type=date],input[type=time],select,textarea{
  background:rgba(3,6,12,.72)!important;border:1px solid rgba(112,183,255,.18)!important;border-radius:11px!important;color:#dfeaff!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 0 0 0 rgba(112,183,255,0)!important;transition:border-color .2s ease,box-shadow .2s ease,background .2s ease!important;
}
.form-control:focus,input:focus,select:focus,textarea:focus{border-color:rgba(217,184,90,.55)!important;box-shadow:0 0 0 3px rgba(217,184,90,.10),0 0 22px rgba(112,183,255,.12)!important;background:rgba(7,12,23,.92)!important;outline:none!important;}
label{font-family:var(--mu-font-ui);letter-spacing:.05em;color:#aebdd3;font-weight:700;}
.table,table{background:rgba(4,7,13,.42)!important;border-radius:14px!important;overflow:hidden;border-collapse:separate!important;border-spacing:0!important;}
.table>thead>tr>th,table th{background:linear-gradient(180deg,rgba(23,35,55,.95),rgba(9,14,24,.94))!important;color:var(--mu-gold-2)!important;border-bottom:1px solid rgba(217,184,90,.22)!important;font-family:var(--mu-font-ui);font-size:11px;text-transform:uppercase;letter-spacing:.08em;}
.table>tbody>tr>td,table td{border-top:1px solid rgba(255,255,255,.045)!important;color:#b9c7dc!important;vertical-align:middle!important;}
.table>tbody>tr{transition:background .2s ease,transform .2s ease;}.table>tbody>tr:hover{background:rgba(112,183,255,.055)!important;}
.badge,.label,.status,.iv-chat-live,.iv-news-badge{border-radius:999px!important;letter-spacing:.08em;text-transform:uppercase;font-family:var(--mu-font-ui);font-weight:800;border:1px solid rgba(255,255,255,.10);box-shadow:0 0 16px rgba(0,0,0,.25);}
.label-success,.badge-success,.online{background:rgba(63,218,141,.16)!important;color:#7cffbc!important;border-color:rgba(63,218,141,.30)!important}.label-danger,.offline{background:rgba(225,69,69,.16)!important;color:#ff8a8a!important;border-color:rgba(225,69,69,.30)!important}.label-warning{background:rgba(217,184,90,.18)!important;color:#ffdc7a!important;border-color:rgba(217,184,90,.33)!important}
.iv-news-row{border-radius:12px!important;background:linear-gradient(90deg,rgba(255,255,255,.035),rgba(112,183,255,.025))!important;border-color:rgba(112,183,255,.13)!important;padding:14px 17px!important}.iv-news-row:hover{transform:translateX(6px) scale(1.005)!important;box-shadow:0 10px 26px rgba(0,0,0,.22)!important;}
.iv-events-panel,.iv-chat-wrap{border-radius:18px!important}.iv-ev-featured{background:radial-gradient(circle at 50% 0,rgba(217,184,90,.10),rgba(0,0,0,.26))!important;border-color:rgba(217,184,90,.20)!important;border-radius:17px!important}.iv-ev-digit{background:linear-gradient(180deg,#151f31,#060912)!important;border-color:rgba(217,184,90,.22)!important;color:#fff7d5!important;text-shadow:0 0 14px rgba(217,184,90,.24)}.iv-ev-mini{border-radius:12px!important}.iv-ev-mini:hover{transform:translateY(-2px)!important;}
.iv-castle-wrap{border-radius:22px!important;min-height:150px}.iv-castle-name{font-size:26px!important;color:#fff2c5!important;text-shadow:0 0 18px rgba(217,184,90,.30)!important;}
.panel-usercp,.panel-sidebar{margin-bottom:18px!important}.panel-usercp .panel-body a,.panel-sidebar .panel-body a{border-radius:10px;}
.iv-ucp-nav-panel{border-radius:18px!important;border-color:rgba(217,184,90,.16)!important}.iv-ucp-nav-item{border-radius:9px;margin:2px 8px}.iv-ucp-nav-item:hover{box-shadow:inset 0 0 0 1px rgba(112,183,255,.15)}
.iv-ft{background:linear-gradient(180deg,#06080e,#020306)!important}.iv-ft-body{max-width:1240px!important}.iv-ft-logo{font-size:28px!important;color:#fff0bd!important;text-shadow:0 0 24px rgba(217,184,90,.23)}
.alert{border-radius:14px!important;border:1px solid rgba(217,184,90,.20)!important;background:rgba(10,16,27,.92)!important;color:#d6e6ff!important;box-shadow:0 14px 35px rgba(0,0,0,.30)!important}.alert-success{border-color:rgba(63,218,141,.25)!important}.alert-danger{border-color:rgba(225,69,69,.25)!important}.alert-warning{border-color:rgba(217,184,90,.26)!important}
.pagination>li>a,.pagination>li>span{background:rgba(9,14,24,.92)!important;border-color:rgba(217,184,90,.18)!important;color:#b8c8df!important}.pagination>li>a:hover,.pagination>.active>a{background:rgba(217,184,90,.16)!important;color:#fff!important;border-color:rgba(217,184,90,.45)!important}
.modal-content{background:linear-gradient(180deg,#111a2b,#070b13)!important;border:1px solid rgba(217,184,90,.25)!important;border-radius:18px!important;color:#d6e3f5!important;box-shadow:0 30px 80px rgba(0,0,0,.72)!important}.modal-header,.modal-footer{border-color:rgba(217,184,90,.14)!important;}
.dropdown-menu{background:#0b1220!important;border:1px solid rgba(217,184,90,.22)!important;border-radius:12px!important;box-shadow:0 16px 40px rgba(0,0,0,.52)!important;padding:8px!important}.dropdown-menu>li>a{border-radius:8px!important;color:#bdcce0!important}.dropdown-menu>li>a:hover{background:rgba(217,184,90,.13)!important;color:#fff!important}
/* Donation / streamer / guide semantic upgrades */
[class*="donation"], [class*="streamer"], [class*="ranking"], [class*="guide"], [class*="download"]{scroll-margin-top:86px;}
.donation-package,.package-card,.payment-method,.streamer-profile,.streamer-apply,.rankings-table,.download-box{border-radius:18px!important;}
/* Mobile */
@media (max-width: 991px){.iv-navbar-inner{display:block!important;min-height:auto}.iv-navbar-inner>ul{flex-wrap:wrap!important;padding:8px 0!important}.iv-navbar-right{justify-content:center;padding-bottom:10px}.col-xs-8,.col-xs-4{width:100%!important;float:none!important}#container{width:calc(100% - 18px)!important}#content{padding:14px!important;border-radius:18px!important}#iv-slider,#iv-slider .carousel-inner,#iv-slider .item,#iv-slider .item img{height:270px!important}.iv-ft-body{grid-template-columns:1fr!important;gap:28px!important}.iv-ft-col2,.iv-ft-col3{border-left:0!important;padding-left:0!important}.webengine-mu-logo{max-height:112px!important}#header::after{font-size:48px}.iv-ev-grid{grid-template-columns:1fr!important}}
@media (max-width: 560px){#navbar ul li a,.iv-nav-auth,.iv-nav-register{font-size:9px!important;padding:7px 9px!important}.panel-heading{padding:12px 14px!important}.panel-title{font-size:12px!important}#iv-slider,#iv-slider .carousel-inner,#iv-slider .item,#iv-slider .item img{height:220px!important}#iv-slider .carousel-caption{left:12px!important;right:12px!important;bottom:18px!important;padding:14px!important}#iv-slider .carousel-caption h3{font-size:19px!important}.iv-news-row{display:block!important}.iv-news-date{margin-top:6px}.table-responsive{border:0!important}.iv-ft-bar-inner{display:block;text-align:center}.iv-ft-dev{justify-content:center;margin-top:8px}}
@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation:none!important;transition:none!important;}}
