/* =============================================================
   RAKLIONMU — DARK SKIN
   Drop-in replacement for assets/raklion/css/style.css
   Built from the play.muonline.eu "eu" stylesheet: every selector
   and every layout dimension is preserved, only the surface
   treatment changed. No Twig markup or JS class name was altered,
   so all AJAX widgets (rankings, guilds, events) keep working.
   ============================================================= */

:root{
  --ice:#6fd0f5;
  --ice-soft:#9fe2ff;
  --ice-deep:#2f8fb8;
  --gold:#e3bd72;
  --gold-hi:#f6dda6;
  --gold-dp:#a67f34;
  --panel:#111a24;
  --panel-2:#0c141d;
  --panel-3:#16202c;
  --line:rgba(126,178,214,.16);
  --line-str:rgba(126,178,214,.3);
  --txt:#c3d0dd;
  --txt-dim:#8496a8;
  --head:#eaf3fa;
  --red:#d8453f;
  --red-hi:#ec5f52;
}

ol, ul, li{ margin:0; padding:0; border:0; }
*{ -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }

body{
  width:100%;
  background:
    url(../images/rk-header.webp) center top no-repeat,
    url(../images/rk-bottom.jpg) center bottom no-repeat,
    url(../images/rk-repeat.jpg) center repeat-y;
  background-color:#131419;
  font-family:'Open Sans', sans-serif;
  font-weight:400;
  font-size:13px;
  color:var(--txt);
  line-height:1;
  min-height:100vh;
}
a{ transition:all .3s ease; color:var(--ice); text-decoration:none; }
a:hover, button:not(.btn):hover{ -webkit-filter:brightness(115%); filter:brightness(115%); text-decoration:none; }
p{ margin-bottom:15px; }
h1,h2,h3{ color:var(--head); margin-bottom:20px; line-height:1.2; text-transform:uppercase; font-weight:600; }
h1{ font-size:20px; }
h2{ font-size:18px; }
h3{ font-size:16px; }
caption{ margin-bottom:15px; color:var(--txt); }

input[type!='checkbox'], textarea{
  background:rgba(255,255,255,.045);
  border-radius:30px;
  border:1px solid var(--line-str);
  color:#eaf3fa;
  padding:8px 18px;
  position:relative;
}
input[type!='checkbox']:focus, textarea:focus{
  border-color:var(--ice);
  box-shadow:0 0 0 3px rgba(111,208,245,.14);
  background:rgba(255,255,255,.07);
}
button:not(.btn):not(.btn-close),
.button:not(.btn){
  transition:all .3s ease;
  cursor:pointer;
  background:linear-gradient(180deg,var(--gold-hi),var(--gold-dp));
  border-radius:30px;
  border:none;
  color:#2a1c05;
  font-size:11px;
  font-weight:700;
  position:relative;
  z-index:1;
  padding:12px 28px;
  text-transform:uppercase;
  letter-spacing:.06em;
  box-shadow:0 10px 22px -10px rgba(0,0,0,.9), inset 0 1px 0 rgba(255,255,255,.5);
  text-decoration:none !important;
}
button:not(.btn):not(.btn-close):hover, .button:not(.btn):hover{
  background:linear-gradient(180deg,#ffeec2,var(--gold-dp));
  color:#2a1c05;
}
.button-border:after{
  content:"";
  border-radius:30px;
  border:1px solid rgba(227,189,114,.28);
  left:-2px; top:-2px;
  height:100%; width:100%;
  position:absolute;
  padding:1px;
}
.button-small{ text-transform:none; padding:6px 12px; }
:focus{ outline:none; }
::-webkit-input-placeholder{ color:#6f8496; }
::-moz-placeholder{ color:#6f8496; }
:-moz-placeholder{ color:#6f8496; }
:-ms-input-placeholder{ color:#6f8496; }

/* Layout
-----------------------------------------------------------------------------*/
.wrapper_web{ width:1200px; margin:0 auto; position:relative; }
.container_web{
  min-height:1300px;
  display:flex;
  background-color:var(--panel-2);
  position:relative;
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 28px 70px -20px rgba(0,0,0,.85);
}
.container_web:before{
  content:"";
  position:absolute; inset:0;
  border-radius:14px;
  border:1px solid var(--line-str);
  pointer-events:none;
  width:auto; height:auto; left:0; top:0;
  background:none;
  z-index:5;
}
.flex{ display:flex; }
.flex-s{ display:flex; justify-content:space-between; }
.flex-s-c{ display:flex; justify-content:space-between; align-items:center; }
.flex-c-c{ display:flex; justify-content:center; align-items:center; }

/* Top menu
-----------------------------------------------------------------------------*/
.top-panel{
  width:100%;
  position:fixed;
  top:0;
  height:60px;
  border-bottom:1px solid transparent;
  z-index:10;
  transition:.4s;
}
.top-panel-fixed{
  background-color:rgba(11,15,21,.92);
  -webkit-backdrop-filter:blur(14px) saturate(150%);
  backdrop-filter:blur(14px) saturate(150%);
  border-bottom:1px solid var(--line-str);
  box-shadow:0 8px 30px -12px rgba(0,0,0,.9);
}
.menu{
  max-width:1200px;
  margin:0 auto;
  height:60px;
  display:flex;
  justify-content:center;
}
.menu li{ margin:0 4px; list-style-type:none; }
.menu a{
  color:#c9dbe9;
  font-size:13px;
  text-transform:uppercase;
  letter-spacing:.08em;
  padding:0 16px;
  font-weight:600;
  display:block;
  height:60px;
  line-height:60px;
  position:relative;
  text-shadow:0 2px 6px rgba(0,0,0,.9);
}
.menu a:hover{ color:#fff; }
.menu a:after{ content:""; transition:.3s; height:0; width:0; }
.menu a:hover:after{
  content:"";
  height:2px; width:70%;
  bottom:12px; left:15%;
  position:absolute;
  background:linear-gradient(90deg,transparent,var(--ice),transparent);
}
.menu .active a{ color:#fff; border-bottom:2px solid var(--ice); }

/* Header
-----------------------------------------------------------------------------*/
.header_web{ height:560px; position:relative; }
.logo a{ display:block; bottom:60px; padding-top:80px; text-align:center; }

.countdown-block{ position:absolute; bottom:150px; right:0; text-align:center; width:100%; }
.countdown-block-mobile{ display:none; }
.countdown-block h3{ color:var(--gold); font-size:14px; margin-bottom:12px; font-weight:700; letter-spacing:.14em; }
.countdown li{ margin:0 7px; position:relative; list-style-type:none; }
.countdown li:after{ content:":"; position:absolute; right:-12px; top:8px; font-size:38px; color:var(--ice-deep); }
.countdown li:last-child:after{ display:none; }
.countdown span{
  display:block;
  background:rgba(11,17,25,.8);
  border:1px solid var(--line-str);
  border-radius:8px;
  height:60px; width:60px;
  font-size:32px;
  color:#fff;
  text-align:center;
  line-height:58px;
  margin-bottom:7px;
  box-shadow:0 10px 26px -10px #000;
}
.countdown p{ font-size:12px; margin-bottom:0; font-weight:700; color:var(--ice); text-transform:uppercase; }

.start-game{ position:absolute; bottom:75px; width:100%; text-align:center; z-index:3; }
.start-game a{
  display:inline-block;
  background:linear-gradient(180deg,var(--gold-hi),var(--gold-dp));
  border-radius:30px;
  width:auto; height:auto;
  padding:16px 42px;
  margin:0 auto;
  text-transform:uppercase;
  font-size:15px;
  font-weight:700;
  letter-spacing:.1em;
  color:#2a1c05;
  box-shadow:0 14px 30px -12px #000, inset 0 1px 0 rgba(255,255,255,.5);
}

/* the sakura leaf animation belongs to the muonline art only */
.leaves, .leaves-1, .leaves-2, .leaves-3{ display:none !important; }

/* Left Sidebar
-----------------------------------------------------------------------------*/
.download-block{ padding:16px 20px 0; }
.download-block a{
  background:linear-gradient(135deg,#0f4a63,#1c86ad 55%,#0f4a63);
  height:80px;
  border-radius:10px;
  font-size:18px;
  font-weight:700;
  text-shadow:0 2px 4px rgba(0,0,0,.5);
  color:#fff;
  border:1px solid rgba(159,226,255,.35);
  box-shadow:0 12px 26px -12px #000, inset 0 1px 0 rgba(255,255,255,.22), 0 0 24px -8px rgba(111,208,245,.5);
}
.download-block a:hover{ transform:translateY(-2px); }
.download-block a span{ padding-left:0; text-align:center; }
.download-block a b{ font-weight:400; display:block; color:#bfe4f5; font-size:12px; margin-top:5px; }

.widget{ padding:20px; min-height:auto; border-bottom:1px solid var(--line); }
.widget:last-child{ border-bottom:0; }
.widget-title{
  text-transform:uppercase;
  font-weight:700;
  color:var(--gold);
  font-size:13px;
  letter-spacing:.14em;
  margin-bottom:15px;
  padding-left:18px;
  position:relative;
}
.widget-title a:hover{ text-decoration:underline; }
.widget-title span{ display:block; margin-top:7px; }
.widget-title:after{
  content:"";
  background:linear-gradient(135deg,var(--ice-soft),var(--ice-deep));
  width:9px; height:9px;
  transform:rotate(45deg);
  position:absolute;
  left:0; top:4px; right:auto;
  box-shadow:0 0 12px rgba(111,208,245,.7);
}
.widget-title span, .widget-title a{
  text-transform:none;
  font-size:11.5px;
  color:var(--ice);
  font-weight:400;
  letter-spacing:0;
}

/* login inputs — image sprites replaced by CSS */
.l-input{
  width:100%;
  height:auto;
  border:none;
  padding:0;
  margin-bottom:10px;
  position:relative;
  background:none !important;
}
.l-input input, .l-input select{
  background:rgba(255,255,255,.045) !important;
  border:1px solid var(--line-str);
  border-radius:30px;
  padding:0 40px 0 42px;
  height:44px;
  width:100%;
  color:#eaf3fa;
  font-size:13px;
  outline:none;
  transition:.25s;
  -webkit-appearance:none;
  appearance:none;
  text-overflow:ellipsis;
}
.l-input input:focus, .l-input select:focus{
  border-color:var(--ice);
  box-shadow:0 0 0 3px rgba(111,208,245,.14);
}
.l-input:before{
  content:"";
  position:absolute;
  left:16px; top:14px;
  width:16px; height:16px;
  background-repeat:no-repeat;
  background-size:16px 16px;
  opacity:.85;
  z-index:2;
  pointer-events:none;
}
.login:before{ background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%236fd0f5'><path d='M12 12a5 5 0 100-10 5 5 0 000 10zm0 2c-5 0-9 2.5-9 5.5V22h18v-2.5c0-3-4-5.5-9-5.5z'/></svg>"); }
.pass:before{ background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%236fd0f5'><path d='M17 9V7a5 5 0 10-10 0v2H5v12h14V9h-2zM9 7a3 3 0 116 0v2H9V7z'/></svg>"); }
.select-s:before, .select-s-page:before{ background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%236fd0f5'><path d='M4 5h16v4H4zm0 6h16v4H4zm0 6h16v2H4z'/></svg>"); }
.select-s, .select-s-page, .login, .pass{ background:none !important; }
.select-s select, .select-s-page select{
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23e3bd72'><path d='M7 10l5 5 5-5z'/></svg>") !important;
  background-repeat:no-repeat !important;
  background-position:right 14px center !important;
  background-size:20px !important;
}

.select-hidden{ display:none; visibility:hidden; }
.select{ cursor:pointer; display:block; position:relative; width:100%; height:44px; }
.select-styled{
  position:absolute; top:0; right:0; bottom:0; left:0;
  transition:all .2s ease-in;
  color:#eaf3fa;
  padding:13px 15px 13px 42px;
  width:100%;
}
.select-options{
  display:none;
  position:absolute;
  top:100%; right:0; left:0;
  z-index:999;
  margin:0; padding:0;
  list-style:none;
  background:#101a24;
  border:1px solid var(--line-str);
  border-radius:10px;
  overflow:hidden;
  width:100%;
  padding-left:0 !important;
  box-shadow:0 18px 40px -16px #000;
}
.select-options li{
  margin:0 !important;
  list-style:none !important;
  padding:10px 14px;
  border-bottom:1px solid var(--line);
  transition:all .15s ease-in;
  color:var(--txt);
}
.select-options li:hover{ background:rgba(111,208,245,.14); color:#fff; }
.select-options li[rel="hide"]{ display:none; }

.login-block p{ margin-bottom:5px; }
.login-block a:hover{ text-decoration:underline; }
.login-block .lost{ color:var(--txt-dim); font-size:12px; }
.login-block .widget-title:after{ display:block; }
.buttons{ margin-top:12px; }

/* ranking / event lists (markup generated by custom.js — classes preserved) */
.top-block{ width:100%; color:var(--txt); }
.top-block span{ display:block; padding-bottom:1px; }
.top-block .top-number{ width:35px !important; }
.top-block .top-flag{ width:25px; padding-top:2px; }
.top-block .top-name{ width:100px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.top-block .top-event-name{ width:120px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.top-block .top-drop-name{ width:200px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.top-block .top-lvl{ width:55px; color:var(--gold); }
.top-block .top-lvl sup{ font-size:10px; color:var(--ice); }
.top-block .top-event-time{ width:100px; color:var(--gold); }
.top-list{
  height:36px;
  display:flex;
  align-items:center;
  padding:0 10px;
  font-size:12px;
  border-bottom:1px solid var(--line);
  border-radius:8px;
  transition:.25s;
}
.top-list a{ color:var(--txt); }
.top-list:hover{
  background:linear-gradient(90deg,rgba(47,143,184,.3),rgba(47,143,184,.04));
  margin:-1px -20px 0 -20px;
  padding:0 30px;
  border-radius:0;
  box-shadow:inset 0 0 0 1px rgba(111,208,245,.18);
  height:37px;
  color:#fff;
}
.top-list:hover a{ color:#fff; }
.top-title{
  height:36px;
  display:flex;
  align-items:center;
  padding:0 10px !important;
  background:rgba(255,255,255,.04) !important;
  border-radius:8px;
  font-size:12.5px !important;
  border-bottom:1px solid var(--line) !important;
  cursor:pointer;
}
.top-title a, .top-title .top-number{ color:var(--gold) !important; font-weight:600; }
.no-reset{ text-align:right; margin-top:15px; }
.no-reset a{ color:var(--ice); font-size:12px; }

.gallery{ display:flex; justify-content:space-between; flex-wrap:wrap; }
.gallery li{ position:relative; list-style-type:none; }
.gallery li img{
  outline:1px solid var(--line);
  outline-offset:-1px;
  border-radius:8px;
  width:76px; height:56px;
  object-fit:cover;
}
.gallery li:first-child{ margin-bottom:8px; width:100%; }
.gallery li:first-child img{ width:100%; max-width:100%; height:130px; outline:1px solid var(--line-str); }
.gallery li:first-child a{ width:100%; height:130px; display:block; }
.gallery li:first-child a:after{
  content:"";
  background:linear-gradient(180deg,rgba(0,0,0,.1),rgba(0,0,0,.55));
  position:absolute; left:0; top:0;
  width:100%; height:100%;
  border-radius:8px;
  box-shadow:none;
}
.gallery li:first-child a:before{
  content:"";
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23e6f6ff'><path d='M12 2a10 10 0 100 20 10 10 0 000-20zm-2 14.5v-9l7 4.5-7 4.5z'/></svg>") no-repeat;
  background-size:44px 44px;
  position:absolute; left:50%; top:50%;
  margin-left:-22px; margin-top:-22px;
  width:44px; height:44px;
  z-index:2;
  filter:drop-shadow(0 4px 10px #000);
}
.gallery li a{ display:block; cursor:pointer; }

/* Middle
-----------------------------------------------------------------------------*/
.content{
  width:630px;
  line-height:1.4;
  background:
    radial-gradient(900px 340px at 50% 0%, rgba(47,143,184,.14), transparent 70%),
    linear-gradient(180deg,#121b26,#0d151e);
  padding-bottom:20px;
  border-left:1px solid var(--line);
  border-right:1px solid var(--line);
  color:var(--txt);
}
.content a{ text-decoration:none; color:var(--ice); }
.content a:hover{ text-decoration:underline; }
/* buttons inside the content column must keep their own colour */
.content a.button, .content a.button:hover,
.content .button, .content .button:hover,
.content a.btn, .content a.btn:hover{ color:#2a1c05; text-decoration:none; }
.content a.btn-primary, .content a.btn-danger, .content a.btn-danger-rounded,
.content a.btn-primary:hover, .content a.btn-danger:hover, .content a.btn-danger-rounded:hover{ color:#fff; }
.content a.btn-default, .content a.btn-default:hover, .content a.btn-inverse, .content a.btn-inverse:hover{ color:var(--txt); }
.content-page{ background:none; min-height:50px; padding:22px; }
.content-page img{ max-width:586px; border-radius:8px; }
.content-page ul{ padding-left:20px; margin-bottom:20px; }
.content-page ul li{ list-style:circle; margin:5px 0; }
.content-page h1, .content-page h2, .content-page h3{ color:var(--head); }

.sidebar{ width:285px; background:linear-gradient(180deg,#0c141d,#080d13); }

.slider{ overflow:hidden; position:relative; width:630px; height:290px; border-bottom:1px solid var(--line); }
.slider .slides{ position:relative; transition:1s; }
.slider .slides .slide{
  float:left; display:block; position:relative;
  background-repeat:no-repeat;
  background-position:center;
  background-size:cover;
  width:630px; height:290px;
  border:none;
}
.slider .slides .slide:before{
  content:"";
  position:absolute;
  width:100%; height:100%;
  top:0; left:0;
  background:linear-gradient(90deg,rgba(6,10,15,.92) 0%,rgba(6,10,15,.55) 46%,rgba(6,10,15,.1) 82%);
}
.slider .slides .slide-info{
  position:relative;
  padding:34px 30px 28px;
  width:100%; height:100%;
  opacity:0;
  z-index:4;
  display:flex;
  flex-wrap:wrap;
  align-items:flex-end;
}
.slider .slides .slide-info h2{
  font-size:24px;
  color:#fff;
  width:100%;
  margin-bottom:12px;
  text-shadow:0 3px 14px #000;
}
.slider .slides .slide-info .slide-text{
  background:none;
  color:#b6c6d4;
  line-height:1.65;
  padding:0;
  width:100%;
  max-width:420px;
  margin:0 0 14px;
  position:relative;
  font-size:13px;
}
.slider .slides .slide-info .slide-text:before{ display:none; }
.slider .slides .slide-info .slide-i{ width:100%; }
.slider .slides .slide-info p{ margin-bottom:0; }
.slider .slides .slide-info .slide-date{ font-size:14px; color:var(--gold); font-family:Candara, Arial, sans-serif; }
.slider .slides .slide-info .slide-date span{ color:var(--gold-hi); font-size:18px; }
.slider .slides .active .slide-info{ transition:all 2s ease; opacity:1; }
.slider .arrows{
  position:absolute;
  height:36px; width:36px;
  top:127px;
  z-index:10;
  cursor:pointer;
  opacity:0;
  border-radius:50%;
  background:rgba(11,17,25,.72);
  border:1px solid var(--line-str);
  background-repeat:no-repeat;
  background-position:center;
  background-size:16px;
}
.slider .next{
  right:12px;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23e6f6ff'><path d='M8 5l8 7-8 7z'/></svg>");
}
.slider .prev{
  left:12px;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23e6f6ff'><path d='M16 5l-8 7 8 7z'/></svg>");
}
.slider .navigation{
  position:absolute;
  bottom:18px; left:0;
  z-index:4;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  padding-right:26px;
  width:100%;
}
.slider .navigation .dot{ width:7px; height:7px; border-radius:50%; cursor:pointer; background-color:rgba(255,255,255,.35); margin:0 5px; }
.slider:hover .next, .slider:hover .prev{ opacity:1; transition:all .5s ease; }
.slider .navigation .active{
  border-radius:50%;
  width:7px; height:7px;
  margin:0 5px;
  background-color:var(--ice);
  position:relative;
}
.slider .navigation .active:after{
  content:"";
  position:absolute;
  left:-3px; top:-3px;
  width:100%; height:100%;
  border-radius:50%;
  padding:2px;
  border:1px solid rgba(111,208,245,.5);
  box-shadow:0 0 10px 0 rgba(111,208,245,.6);
}

.content-title, .title1{
  background:none;
  min-height:50px;
  display:flex;
  align-items:center;
  background-color:rgba(255,255,255,.03);
  border-bottom:1px solid var(--line);
  margin-bottom:1px;
}
.content-title h1, .content-title h2, .content-title h3,
.title1 h1, .title1 h2, .title1 h3{
  font-size:13px;
  color:var(--gold);
  text-transform:uppercase;
  letter-spacing:.14em;
  margin-bottom:0;
  font-weight:600;
  padding:0 25px;
}
.block{
  background:none;
  min-height:110px;
  background-color:transparent;
  padding:1px;
}

/* news
-----------------------------------------------------------------------------*/
.news-block{ box-shadow:none; margin-bottom:24px; padding:16px 22px 0; }
.news{
  position:relative;
  margin-bottom:14px;
  transition:.28s;
  display:flex;
  flex-wrap:wrap;
  background:var(--panel-3);
  border:1px solid var(--line);
  border-radius:10px;
  overflow:hidden;
  box-shadow:0 6px 16px -6px rgba(0,0,0,.6);
}
.news:hover{
  transform:translateY(-3px);
  box-shadow:0 14px 32px -12px rgba(0,0,0,.7), 0 0 0 1px rgba(111,208,245,.3);
  border-color:transparent;
}
.news .news-img{ width:100%; overflow:hidden; }
.news .news-img img{ display:block; width:100%; height:auto; transition:.5s; }
.news:hover .news-img img{ transform:scale(1.04); }
.news .news-info{ width:100%; padding:16px 20px 18px; }
.news .news-info h2{ font-size:16px; color:var(--head); margin-bottom:8px; text-transform:none; }
.news .news-info p{ line-height:1.65; margin-bottom:12px; color:var(--txt-dim); }
.news .news-info a:not(.button):not(.btn){ color:var(--ice); }
.news:hover .button{ background:linear-gradient(180deg,#ffeec2,var(--gold-dp)); }
.news-i{ padding-top:4px; border-top:1px solid var(--line); }
.news-date{ font-family:Candara, Arial, sans-serif; color:var(--gold); font-size:14px; }
.news-date b{ font-size:18px; font-weight:600; }

.top-news-block:before{ display:none; }
.top-news-block:after{ display:none; }
.top-news-block:hover{ margin:0 0 14px 0; }
.top-news-block .news-info{ padding:20px; position:relative; }
.top-news-block .news-info h2{
  border-bottom:1px solid var(--line);
  margin:0 -20px 18px -20px;
  padding:0 20px 16px 20px;
}
.top-news{ background-position:center; background-repeat:no-repeat; background-size:cover; min-height:280px; }
.top-news-img{ position:relative; }
.top-news-img .read-more{ position:absolute; bottom:40px; width:100%; text-align:center; }
.top-news-i{ margin-top:20px; }
.top-news-v{ color:var(--txt-dim); font-size:12px; }
.top-news-v a{ text-decoration:none; }
.br-t{ margin:0 15px; }

.pagination{ display:flex; justify-content:center; align-items:center; padding-bottom:24px; }
.pagination > li{ list-style:none; }
.pagination > li > a, .page-numbers{
  display:block;
  width:34px; height:34px;
  position:relative;
  text-align:center;
  line-height:32px;
  border:1px solid var(--line-str);
  border-radius:50%;
  text-decoration:none !important;
  color:var(--txt-dim);
  background:rgba(255,255,255,.03);
  font-size:12px;
  margin:0 5px;
}
.pagination > li > a:hover, .page-numbers:hover{ border-color:var(--ice); color:var(--ice); background:rgba(111,208,245,.1); }
.pagination > li.active > a, .page-numbers.active{
  background:linear-gradient(180deg,#2fa2c8,#155a76);
  border-color:transparent;
  color:#fff;
  box-shadow:0 0 18px -4px rgba(111,208,245,.7);
}
.page-numbers.prev, .page-numbers.next{ border:1px solid var(--line-str); box-shadow:none; font-size:0; }
.page-numbers.prev:hover, .page-numbers.next:hover{ background-color:rgba(111,208,245,.12); -webkit-filter:none; filter:none; }
.page-numbers.prev{ margin:0 20px 0 0; }
.page-numbers.next{ margin:0 0 0 20px; }
.page-numbers.prev:after{
  content:"";
  position:absolute;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%236fd0f5'><path d='M16 5l-8 7 8 7z'/></svg>") no-repeat center/14px;
  width:14px; height:14px;
  margin-left:-7px; margin-top:-7px;
  left:50%; top:50%;
  z-index:2;
}
.page-numbers.next:after{
  content:"";
  position:absolute;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%236fd0f5'><path d='M8 5l8 7-8 7z'/></svg>") no-repeat center/14px;
  width:14px; height:14px;
  margin-left:-7px; margin-top:-7px;
  left:50%; top:50%;
}
.page-numbers.prev:hover:after, .page-numbers.next:hover:after{ background-position:center; }

/* Right Sidebar
-----------------------------------------------------------------------------*/
.status-block{
  background:linear-gradient(160deg,rgba(27,63,84,.75),rgba(9,15,21,.9));
  border:1px solid var(--line-str);
  border-radius:10px;
  height:auto;
  margin:16px 20px 0;
  padding:16px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  gap:12px;
}
.server-x{
  background:linear-gradient(150deg,#1d6c8c,#0a1620);
  border-radius:11px;
  width:64px; height:52px;
  text-align:center;
  color:var(--ice-soft);
  font-weight:700;
  font-size:14px;
  line-height:52px;
  text-shadow:0 2px 3px rgba(0,0,0,.6);
  padding:0;
  flex:0 0 64px;
  box-shadow:inset 0 0 0 1px rgba(159,226,255,.45), 0 6px 16px -6px #000;
}
.server{ width:100%; flex:1 1 auto; min-width:0; font-size:12px; }
.server .server-name{ color:var(--gold); }
.server .status-online, .server .status-offline{
  color:#fff;
  font-size:15px;
  font-weight:700;
  line-height:1.25;
}
.server .status-online b{
  font-weight:400;
  font-size:11px;
  color:#5fdc7c;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.server .status-offline b{
  font-weight:400;
  font-size:11px;
  color:var(--red-hi);
  letter-spacing:.08em;
  text-transform:uppercase;
}
/* server load bar - "heat" style: green at low load, amber mid, red when busy,
   with tick marks and a glowing head at the current position */
.progress-barr{
  height:11px;
  background-color:rgba(0,0,0,.6);
  border-radius:6px;
  margin:9px 0 8px;
  position:relative;
  box-shadow:inset 0 1px 3px #000, 0 0 0 1px rgba(126,178,214,.2);
  overflow:visible;
}
.progress-barr:before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:6px;
  pointer-events:none;
  z-index:3;
  background:repeating-linear-gradient(90deg,transparent 0 24%,rgba(126,178,214,.3) 24% 24.7%);
}
.progress-barr:after{ display:none; }
.progress-barr span{
  height:11px;
  display:block;
  border-radius:6px;
  position:relative;
  background:linear-gradient(90deg,#3fbf52,#e3bd72 58%,#e2584d);
}
.progress-barr span:after{
  content:"";
  position:absolute;
  right:-4px;
  top:50%;
  transform:translateY(-50%);
  width:11px;
  height:11px;
  border-radius:50%;
  background:#fff;
  box-shadow:0 0 14px 4px rgba(255,255,255,.75);
}
.desc{ color:var(--gold); font-size:11px; text-decoration:none; }
.desc:hover{ text-decoration:underline; }
.weekly-countdown{ color:var(--gold) !important; }

.top-block.guild .top-number{ width:60px; }
.top-block.guild .top-number img{ margin-bottom:-2px; }
.top-block.guild .top-name{ width:105px; }
.top-block.guild .score{ width:60px; color:var(--gold); }

.events{ line-height:1.3; }
.events li{ border-bottom:1px solid var(--line); padding:13px 0; transition:.25s; }
.events li:hover{
  background:linear-gradient(90deg,rgba(47,143,184,.3),rgba(47,143,184,.04));
  margin:-1px -20px 0 -20px;
  padding:13px 20px;
  color:#fff;
}
.events li:hover a{ color:#fff; }
.events li:hover span{ color:var(--ice); }
.events li a{ display:block; margin-bottom:4px; color:var(--txt); }
.events li span{ color:var(--txt-dim); font-size:11px; }
.guides li{ padding:13px 0 12px; }
.guides li:hover{ margin:-3px -20px 0 -20px; }
.guides li a{ color:var(--txt); }
.banner-block{ min-height:auto; }
.banner-block img{ border:1px solid var(--line); border-radius:8px; }

#toTop{
  background:rgba(11,17,25,.8) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%236fd0f5'><path d='M12 6l7 8h-4v4h-6v-4H5z'/></svg>") no-repeat center/20px;
  border:1px solid var(--line-str);
  border-radius:50%;
  width:40px; height:40px;
  position:absolute;
  top:53px; right:20px;
  cursor:pointer;
  display:block;
  z-index:6;
}

/* widget surfaces — the two tints from the muonline theme, darkened */
.red-light{ background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012)); }
.red-dark{ background:linear-gradient(180deg,rgba(47,143,184,.09),rgba(255,255,255,.012)); background-color:transparent; }
.brown-widget{ background:linear-gradient(180deg,rgba(227,189,114,.08),rgba(255,255,255,.012)); min-height:auto; }

/* castle siege panel (styled in custom.css upstream, re-toned here) */
.panel-castle-siege{ color:var(--txt); padding:6px 0 0; }
.panel-castle-siege img{ box-shadow:0 8px 20px -8px #000; border-radius:10px; }
.panel-castle-siege a{ color:var(--ice); }
.panel-castle-siege .title-castle-owner,
.panel-castle-siege .title-guild-master{ font-weight:700; color:var(--gold); font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; }
.title-castle-battle{ color:var(--gold); }

.modalx-overlay{
  position:fixed; top:0; bottom:0; left:0; right:0;
  z-index:1000; cursor:pointer; overflow:auto; visibility:hidden;
  transition:background .25s linear;
}
.modal_window{
  z-index:9999; position:relative; cursor:auto; margin:0 auto; display:none;
  transition:all .25s linear;
  margin-bottom:20px;
  transform:scale(.4);
  width:1000px; height:540px;
  box-shadow:0 20px 70px 0 rgba(0,0,0,.8);
  background:#0c141d;
  border:1px solid var(--line-str);
  border-radius:12px;
}
.close-r{
  display:block; position:absolute;
  margin-top:-18px;
  width:44px; height:44px;
  right:-22px;
  border-radius:50%;
  background:#0c141d url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%236fd0f5'><path d='M18.3 5.7L12 12l6.3 6.3-1.4 1.4L10.6 13.4 4.3 19.7 2.9 18.3 9.2 12 2.9 5.7 4.3 4.3l6.3 6.3 6.3-6.3z'/></svg>") no-repeat center/18px;
  border:1px solid var(--line-str);
  filter:none; -webkit-filter:none;
}
.modal_window iframe{ border:0; }

.rank-list{ display:none; animation:rank .4s ease; }
.rank-list ul li{ display:flex; align-items:center; font-size:14px; transition:.4s; padding:9px 0; }
.rank-list ul li .rank-ava{ margin:0 15px; border-radius:50%; box-shadow:0 4px 12px 0 rgba(0,0,0,.5); transition:.5s; }
.rank-list ul li .rank-name{ color:var(--txt); }
.rank-list ul li .rank-name b{ color:var(--gold); }
.rank-list ul li a{ display:block; width:100%; color:var(--txt); margin-bottom:4px; }
.rank-list ul li:hover{ background:rgba(47,143,184,.16); margin:0 -20px; padding:9px 20px; }
.rank-list ul li:hover .rank-ava{ margin:0 25px 0 15px; }
.rank-list ul li:before{ display:none; }
.rank-list.active{ display:block; }
@keyframes rank{
  0%{ display:none; opacity:0; transform:scale(0); }
  1%{ display:block; opacity:0; transform:scale(0); }
  100%{ display:block; opacity:1; transform:scale(1); }
}

/* Footer
-----------------------------------------------------------------------------*/
.footer{
  background:url(../images/rk-bottom.jpg) center 20%/cover no-repeat, #0a0e14;
  height:auto;
  padding:56px 20px 26px;
  color:var(--txt);
  position:relative;
  margin-top:-14px;
}
.footer:before{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg,rgba(9,13,19,.72),rgba(9,13,19,.94));
}
.footer-content{
  position:relative;
  max-width:1200px;
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(50px, 1fr));
  gap:5px;
}
.footer-section{ padding:15px; text-align:center; }
.footer-title{
  color:var(--gold);
  font-size:13px;
  margin-bottom:20px;
  text-transform:uppercase;
  letter-spacing:.2em;
}
.footer-links{ list-style:none; padding:0; display:flex; flex-wrap:wrap; gap:6px; justify-content:center; }
.footer-links a{ color:var(--txt); text-decoration:none; transition:all .3s ease; padding:8px 16px; border-radius:999px; }
.footer-links a:hover{ color:#fff; background:rgba(111,208,245,.12); transform:translateY(-2px); }
.social-icons{ display:flex; justify-content:center; gap:12px; margin-top:20px; }
.social-icons a{
  width:42px; height:42px;
  border-radius:50%;
  background:rgba(255,255,255,.05);
  border:1px solid var(--line-str);
  color:#c3d6e4;
  display:flex; align-items:center; justify-content:center;
  transition:all .3s ease;
}
.social-icons a:hover{ transform:translateY(-3px); background:rgba(111,208,245,.14); border-color:var(--ice); color:#fff; }
.footer-bottom{ position:relative; text-align:center; margin-top:20px; padding-top:20px; border-top:1px solid var(--line); }
.copyright{ font-size:12px; color:var(--txt-dim); }
.copyright a{ color:var(--gold); }

/* mobile menu button */
.btn2{ display:none; -webkit-transition:.3s; transition:.3s; left:20px; cursor:pointer; }
.btn2 span{ width:30px; height:4px; display:block; margin:6px 0; background:var(--ice); transition:.3s; position:relative; }

/* Responsive
-----------------------------------------------------------------------------*/
@media (max-width:1200px){
  .wrapper_web{ width:100%; padding:0 15px; }
  .menu li a{ padding:0 14px; font-size:13px; }
}
@media (max-width:993px){
  body{
    background-image:url(../images/rk-bottom.jpg), url(../images/rk-repeat.jpg);
    background-position:center bottom, center;
    background-repeat:no-repeat, repeat-y;
    background-size:1200px auto, auto;
  }
  .container_web{ flex-direction:column; min-height:auto; }
  .header_web{ height:auto; padding:86px 0 18px; text-align:center; }
  .header_web:before{
    content:"";
    display:block;
    width:250px; max-width:72%;
    height:112px;
    margin:0 auto 6px;
    background:url(../images/rk-logo.png) center/contain no-repeat;
    filter:drop-shadow(0 10px 24px rgba(0,0,0,.8));
  }
  .content, .sidebar{ width:100%; }
  .content{ border-left:0; border-right:0; }
  .slider{ display:none; }
  .logo{ display:none; }
  .menu li a{ padding:0 10px; font-size:14px; }
  .sidebar{ width:100%; display:flex; flex-direction:column; align-items:center; padding:15px 0; }
  .sidebar > *{ width:285px !important; transform:none !important; }
  .download-block, .widget, .status-block{ width:285px !important; max-width:100%; margin-left:auto; margin-right:auto; }
  .gallery li:first-child a{ width:100% !important; }
  .countdown-block{ display:none; }
  .countdown-block-mobile{ display:block; text-align:center; height:150px; }
  .countdown-block-mobile h3{ color:var(--gold); }
  .countdown span{ background:rgba(11,17,25,.9); }
  .countdown p{ color:var(--ice); }
}
@media (max-width:769px){
  .topMenu-wrapper{
    display:none; position:fixed; width:300px; height:100%; top:0; left:-300px;
    background:#0a1119; z-index:3; padding-top:90px; transition:.3s;
    border-right:1px solid var(--line-str);
  }
  .topMenu-wrapper.active{ left:0; display:block; }
  .menu{ height:calc(100% - 50px); overflow-y:auto; display:block !important; }
  .menu li{ display:block; }
  .menu li a{ color:#dbe9f4; height:auto; line-height:1; padding:16px 22px; font-size:16px; }
  .menu a:hover:after{ display:none; }
  .btn2{ display:block; position:relative; z-index:14; margin-top:14px; }
  .btn2.active{ left:250px; }
  .btn2.active span:nth-child(1){ transform:rotate(45deg); bottom:-9px; }
  .btn2.active span:nth-child(2){ display:none; }
  .btn2.active span:nth-child(3){ transform:rotate(-45deg); }
  .footer{ padding:36px 15px 20px; }
  .footer-section{ padding:10px; }
  .footer-links{ flex-direction:column; gap:4px; }
  .footer-links a{ padding:10px; }
  .social-icons{ gap:12px; }
}
@media (max-width:480px){
  .widget{ padding:15px; }
  .status-block, .download-block{ margin-left:15px; margin-right:15px; }
}
@media (max-width:400px){
  .sidebar{ padding:15px; }
  .sidebar > *{ width:100% !important; max-width:285px; }
}

.accordion-body{ display:none; }
.accordion-item.active .accordion-body{ display:block; }
