/*!
 =========================================================
 * WebEngine CMS - Theme Overrides
 * (Upgraded progress bar + Castle Siege card)
 =========================================================
*/

/* === your original imports kept === */
@import url('https://fonts.googleapis.com/css2?family=Special+Elite&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Luckiest+Guy&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Freckle+Face&display=swap');

*{padding:0;margin:0;position:relative;outline:none;list-style:none;outline:none}

/* Hide stray thin lines some modules print */
.panel hr,.modules_cont hr,.sidebar hr,.home-news-block hr{display:none!important;border:0!important;height:0!important}

.table>tbody>tr>td,.table>tbody>tr>th,.table>tfoot>tr>td,.table>tfoot>tr>th,.table>thead>tr>td,.table>thead>tr>th{border-top:none!important}
.table-striped>tbody>tr:nth-of-type(odd){background-color:#231E20!important}
.table{width:100%;max-width:100%;margin-bottom:0}

a:focus,a:hover{text-decoration:none!important}

.form-control{background:#fafafa;border:1px solid #e3e3e3;color:#666}
.form-control:focus{border:1px solid #ccc}

.nopadding{padding:0!important;margin:0!important}
.vcenter{display:inline-block;vertical-align:middle;float:none}

.thumbnail{background:#f1f1f1;border:1px solid #e3e3e3}
a.thumbnail:hover,a.thumbnail:focus,a.thumbnail.active{border-color:#ff0000}

.btn-primary{color:#8e867e;background:transparent;border-color:#55444e;transition:all .1s ease-in;border-radius:0}
.btn-primary:active,.btn-primary:focus,.btn-primary:hover{color:#fff!important;background:#1b1718!important;border-color:#734f63!important}

/* Navbar */
#navigation-top{width:100%;height:52px;background:url(../img/nav-bg.png) no-repeat top center;position:relative;z-index:100}
.navigation-top-in{max-width:1150px;height:52px;margin:0 auto;display:flex;justify-content:space-between}
#cssmenu,#cssmenu ul,#cssmenu ul li,#cssmenu ul li a,#cssmenu #menu-button{margin:0;padding:0;border:0;list-style:none;display:block;position:relative;box-sizing:border-box}
#cssmenu{font-family:"Georgia";font-variant:small-caps;margin:0 0 0 20px}
#cssmenu>ul>li{float:left}
#cssmenu>ul>li>a{padding:0 17px;font-size:15px;text-decoration:none;color:#ab9f9c;font-weight:400;height:52px;line-height:52px}
#cssmenu>ul>li>a:hover{color:#fff}
#cssmenu:after,#cssmenu>ul:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}
/* Container stays the same footprint */
.my-account{
  width:118px;
  height:48px;
  margin:0 -130px 0 0;   /* keep your current layout */
  position:relative;
}

/* Button */
.accPanel{
  display:block;
  width:100%;
  height:100%;
  line-height:51px;                 /* vertical centering for any label */
  text-align:center;
  text-decoration:none;
  font-family:"Georgia", serif;
  font-variant:small-caps;
  font-size:15px;
  color:#c4b9a0;

  /* HD button background */
  background-image:url("../img/myaccount.png");  /* 218×51 PNG (transparent) */
  background-repeat:no-repeat;
  background-position:center;
  background-size:100% 100%;

  /* polish */
  transition:filter .18s ease, transform .04s ease;
}

/* Hover/active without needing another PNG */
.accPanel:hover{
  filter:brightness(1.12) saturate(1.08) drop-shadow(0 2px 4px rgba(0,0,0,.35));
  color:#fff;
}
.accPanel:active{
  transform:translateY(1px);
}

/* Retina/HiDPI swap (serve a 436×102 PNG) */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi){
  .accPanel{
    background-image:url("../img/myaccount@2x.png");
  }
}

/* Optional: if you prefer using a single sprite (normal/hover stacked vertically)
   export myaccount-sprite@2x.png at 436×102 * 2 states = 436×204,
   then uncomment this block and remove the hover filter above. */
/*
.accPanel{
  background-image:url("../img/myaccount-sprite@1x.png");     // 218×51 * 2 states = 218×102
  background-size:100% 200%;
  background-position:center 0%;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi){
  .accPanel{
    background-image:url("../img/myaccount-hover.png");   // 436×102
  }
}
.accPanel:hover{ background-position:center 100%; }
*/
.languages{display:flex;align-items:stretch;margin:18px 40px 0 0;width:100px}
#ServerTime{color:#ab9f9c}

/* Language menu (kept) */
#langmenu,#langmenu ul,#langmenu ul li,#langmenu ul li a{margin:0;padding:0;border:0;list-style:none;display:block;position:relative;box-sizing:border-box}
#langmenu{font-variant:small-caps;margin:0 0 0 20px}
#langmenu>ul>li{float:left}
#langmenu>ul>li>a{display:inline-block;background:#333;padding:0 5px 2px 5px;border-radius:3px;color:#ab9f9c;text-decoration:none}
#langmenu>ul>li:hover>a{color:#fff}
#langmenu ul ul{position:absolute;left:-9999px}
#langmenu li:hover>ul{left:auto}
#langmenu ul ul li{height:0;transition:all .25s ease}
#langmenu li:hover>ul>li{height:35px}
#langmenu ul ul li a{border-bottom:1px solid rgba(150,150,150,.15);padding:13px 15px;width:80px;font-size:14px;text-decoration:none;color:#ab9f9c;background:url(../img/some-bg.jpg);font-family:"Times New Roman"}
#langmenu ul ul li:hover>a,#langmenu ul ul li a:hover{color:#fff}

/* Header sparks (kept) */
.sparks{position:absolute;width:1200px;left:50%;margin-left:-600px;bottom:0}
.sparks>div{position:absolute}
.sparks .spark_1{background:url(../img/efectos/spark_1.png) no-repeat;width:764px;height:313px;right:0;bottom:-320px;transform:scale(.6);animation:spark-1 4s linear infinite;animation-delay:1s}
.sparks .spark_2{background:url(../img/efectos/spark_2.png) no-repeat;width:179px;height:335px;right:230px;bottom:-320px;transform:scale(.6);animation:spark-1 4s linear infinite;animation-delay:2s}
.sparks .spark_3{background:url(../img/efectos/spark_3.png) no-repeat;width:128px;height:165px;right:280px;bottom:-140px;transform:scale(.6);animation:spark-3 4s linear infinite;animation-delay:2s}
.sparks .spark-big{background:url(../img/efectos/spark_4.png) no-repeat;width:794px;height:176px;right:0;bottom:-180px;transform:scale(.6);animation:spark-5 4s linear infinite}
.sparks .spark_5{animation-delay:2s;right:40px}
@keyframes spark-1{0%{bottom:-320px;transform:scale(.6);opacity:1}25%{bottom:-240px;transform:scale(.7);opacity:1}50%{bottom:-160px;transform:scale(.8);opacity:1}75%{bottom:-80px;transform:scale(.9);opacity:.5}100%{bottom:0;transform:scale(1);opacity:0}}
@keyframes spark-3{0%{bottom:-140px;transform:scale(.6);opacity:1}25%{bottom:-80px;transform:scale(.7);opacity:1}50%{bottom:-20px;transform:scale(.8);opacity:1}75%{bottom:40px;transform:scale(.9);opacity:.5}100%{bottom:100px;transform:scale(1);opacity:0}}
@keyframes spark-5{0%{bottom:-180px;transform:scale(.6);opacity:1}25%{bottom:-120px;transform:scale(.7);opacity:1}50%{bottom:-60px;transform:scale(.8);opacity:1}75%{bottom:0;transform:scale(.9);opacity:.5}100%{bottom:60px;transform:scale(1);opacity:0}}

#body{background-image:url(../img/efectos/smoke.png);background-position:left top 20px;background-repeat:repeat-x;animation:smoke 25s linear infinite;animation-fill-mode:forwards}
@keyframes smoke{0%{background-position:left -1920px top 200px}100%{background-position:left 1920px top 200px}}

/* Register strip (kept) */
.top-files-panel{height:58px;max-width:650px;width:auto;background:url(../img/files.png) no-repeat bottom right;bottom:-85px;position:absolute;padding:0 30px 0 0;z-index:7000;display:flex;text-align:initial}
.start-game a{display:block;width:256px;height:58px;background:url(../img/startgame.png) no-repeat bottom right;margin:0 0 0 -10px;line-height:65px;text-indent:60px;letter-spacing:.7px;color:#fff;text-decoration:none;font-family:"Georgia";font-variant:small-caps;font-size:15px;font-weight:100}
.start-game a:hover{background:url(../img/startgame-hover.png) no-repeat bottom right}
.panelDownBlock{display:flex}
.torrent,.cloud{margin:17px 10px 0 10px;padding:7px 10px 0 50px}
.torrent span,.cloud span{display:block;height:14px}
.torrent{background:url(../img/torrent.png?v4) no-repeat left center}
.download-title a{font-family:"Georgia";text-transform:uppercase;font-size:11px;font-weight:100;color:#ada0a2;text-decoration:none}
.download-title a:hover{color:#fff}
.file-title{font-size:10px;color:#746264}
.cloud{background:url(../img/cloud.png) no-repeat left center}

#header{max-width:1200px;position:relative}

/* Panel/sidebar misc (kept) */
.panel-sidebar .panel-title{font-size:13px;margin-top:5px}
.panel-sidebar .panel-body{color:#727272;font-family:"Times New Roman"}
.table>thead>tr>th{background:url(../img/hr.jpg) repeat-x bottom;border:0}
.table>tbody>tr>td,.table>tbody>tr>th,.table>tfoot>tr>td,.table>tfoot>tr>th,.table>thead>tr>td,.table>thead>tr>th{padding-top:5px;padding-bottom:5px}
.btnreg{background:url(../img/readmore-btn.png) no-repeat center;position:absolute;width:121px;height:27px;line-height:28px!important;text-align:center;color:#fff;display:block;text-decoration:none;font-size:12px;transition:.5s;border:0}
.btnreg:hover{background:url(../img/readmore-hover.png) no-repeat center;transition:.5s}

.sidebar{padding:0 5px;float:left}
.main_side{width:calc(100% - 292px - 292px);max-width:calc(100% - 292px - 292px);float:left}
.modules_cont{border:1px solid #211c1d;background:url(../img/some-bg.jpg);width:100%;float:left;border-radius:5px;padding:10px}
.modules_cont_full{border:1px solid #211c1d;background:url(../img/some-bg.jpg)}
#content{width:100%;overflow:auto;min-height:500px;padding:10px 0 0}

/* ===== SERVER STATUS – GAMER PROGRESS BAR ===== */
.server{margin:0 auto 15px auto;width:230px}
.server-info{display:flex;justify-content:space-between;padding:0 10px 6px 0;font-family:"Times New Roman"}
.server-info :first-child{color:#a9947b;font-size:13px;letter-spacing:.5px}
.server-info :last-child{color:#bebebe;font-size:13px;letter-spacing:.5px}
.on,.off{width:13px;height:12px;display:inline-block;margin:0 0 0 2px}
.on{background:url(../img/on.png) no-repeat center}

/* Track */
.server .box-1{
  width: 200px;
  height: 18px;
  position: relative;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(18,18,18,.85), rgba(10,10,10,.85));
  border: 1px solid rgba(255,255,255,.06);
  box-shadow: inset 0 2px 6px rgba(0,0,0,.85), 0 1px 0 rgba(255,255,255,.05);
  overflow:hidden;
}
/* Glare */
.server .box-1:before{
  content:"";
  position:absolute;inset:0;border-radius:inherit;
  background: radial-gradient(120% 100% at 50% -40%, rgba(255,255,255,.25) 0%, rgba(255,255,255,.05) 45%, rgba(0,0,0,0) 60%);
  pointer-events:none;
}
/* Segments/Ticks overlay */
.server .box-1:after{
  content:"";
  position:absolute;inset:1px;border-radius:inherit;
  background:
    repeating-linear-gradient(90deg, rgba(255,255,255,.05) 0 6px, rgba(255,255,255,0) 6px 20px);
  mix-blend-mode: overlay;opacity:.25;pointer-events:none;
}
/* Fill container */
.server .progress{position:absolute;left:2px;top:0;width:196px;height:100%;margin:0}

/* Fill bar (color via class added by JS) */
.server .progress .progress-1{
  height:100%;border-radius:999px;
  background: linear-gradient(180deg,#62f08a 0%,#2fbd64 60%,#1a8b44 100%); /* default green */
  box-shadow: inset 0 1px 0 rgba(255,255,255,.35), 0 0 18px rgba(56,255,145,.35), 0 0 3px rgba(0,0,0,.55);
  transition: width 300ms ease-in-out, filter 200ms, box-shadow 200ms;
}
/* Shimmer stripes */
.server .progress .progress-1:after{
  content:"";position:absolute;inset:0;border-radius:inherit;
  background: repeating-linear-gradient(-45deg, rgba(255,255,255,.12) 0 8px, rgba(255,255,255,0) 8px 16px);
  mix-blend-mode: screen;opacity:.35;animation:weBarStripes 3s linear infinite;pointer-events:none;
}
@keyframes weBarStripes{from{background-position:0 0}to{background-position:60px 0}}

/* Color states (class applied by JS in section 3) */
.we-bar-low  .progress-1{background:linear-gradient(180deg,#ff5757 0%,#cf2d2d 60%,#921c1c 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 0 18px rgba(255,56,56,.38),0 0 3px rgba(0,0,0,.55)}
.we-bar-mid  .progress-1{background:linear-gradient(180deg,#ffd95e 0%,#e2b82d 60%,#a87d1a 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 0 18px rgba(255,224,56,.35),0 0 3px rgba(0,0,0,.55)}
.we-bar-high .progress-1{background:linear-gradient(180deg,#62f08a 0%,#2fbd64 60%,#1a8b44 100%)}

/* ===== CASTLE SIEGE — PREMIUM CARD ===== */
.panel-cs{
  background: url(../img/some-bg.jpg), linear-gradient(180deg, rgba(20,18,18,.9), rgba(14,12,12,.9));
  border:1px solid rgba(255,255,255,.06);
  border-radius:6px;
  box-shadow: 0 8px 18px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.05);
  overflow:hidden;
}
.panel-cs .panel-heading{
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(0,0,0,0));
  border-bottom:1px solid rgba(255,255,255,.06);
}
.panel-cs .panel-title{letter-spacing:.5px}
.cs-wrap{display:flex;gap:16px;align-items:center}
.cs-emblem{
  width:92px;height:92px;flex:0 0 92px;
  display:flex;align-items:center;justify-content:center;
  background: radial-gradient(120% 120% at 50% 50%, rgba(255,255,255,.08), rgba(0,0,0,0));
  border-radius:8px;border:1px solid rgba(255,255,255,.06);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}
.cs-info{flex:1 1 auto;color:#cfcfcf;font-size:13px;line-height:1.35}
.cs-row{display:flex;gap:10px;align-items:center;margin-bottom:6px}
.cs-label{color:#9a8c7a;font-family:"Times New Roman"}
.cs-value a,.cs-value{color:#ffffff}
.cs-stage{
  display:inline-block;padding:2px 8px;border-radius:999px;
  font-size:11px;letter-spacing:.4px;text-transform:uppercase;
  background:linear-gradient(180deg,#2a2b30,#17181c);border:1px solid rgba(255,255,255,.08);color:#c8d2ff
}
.cs-count{
  font-family:'Special Elite',cursive;color:#fff;font-size:22px;letter-spacing:1px
}
.cs-actions{margin-top:10px}
.btn-cs{
  display:inline-block;padding:6px 12px;border-radius:6px;
  background:linear-gradient(180deg,#6aa1ff,#3467ff);
  color:#fff;border:1px solid rgba(255,255,255,.2);
  box-shadow:0 6px 14px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.25);
  text-transform:uppercase;font-size:11px;letter-spacing:.5px
}
.btn-cs:hover{filter:brightness(1.08)}
.btn-cs:active{transform:translateY(1px)}

/* Old banner styles kept (if used elsewhere) */
.castle-siege-banner{text-shadow:2px 2px #000;font-weight:bold;font-family:Arial;padding:14px;background:url(../img/banner_cs_bg.jpg) no-repeat;border-radius:5px;color:#f39c12;box-shadow:0 0 20px #000;overflow:auto;margin:0 auto 5px;width:100%;font-size:14px}
.castle-siege-banner .guild_owner,.castle-siege-banner .guild_owner a{color:#fff;font-size:30px;font-family:'Special Elite',cursive}
.castle-siege-banner .guild_master,.castle-siege-banner .guild_master a{color:#fff;font-size:16px}
.castle-siege-banner .guild_countdown{color:#fff;font-size:28px;font-family:'Special Elite',cursive}
.castle-siege-banner .guild_countdown span{color:#f39c12}
.cstitle1{line-height:25px;margin-bottom:5px}
.cstitle2{line-height:20px}

/* Events */
#events dt{display:block;height:42px;text-align:left;text-shadow:1px 1px 1px rgba(0,0,0,.45);font-size:14px;color:#a1998f}
#events .event_status{color:#727272}
#events .event_next{color:#727272}
#events .event_timeleft{color:#fff}
#events .rightfloat{float:right}
#events span{display:block;font-size:12px}
#events dt.eventActive{color:#009600}

/* === Castle Siege: centered emblem, 2 rows, own background, no bleed === */
.cs-card{ margin-bottom:14px; position:relative; z-index:2; }
.cs-card .panel-heading{ position:relative; } /* keep your native header art */

.cs-body{
  position:relative;
  z-index:2;
  padding-top:12px;
  /* Opaque body so "Events Time" header art can't show through */
  background: rgba(14,11,12,.92);
  border: 1px solid rgba(255,255,255,.05);
  border-top: none;             /* header already has its own border/art */
  border-radius: 0 0 6px 6px;
  box-shadow: inset 0 0 12px rgba(0,0,0,.45);
}

.cs-emblem-center{
  width:106px; height:106px; margin:2px auto 10px;
  display:flex; align-items:center; justify-content:center;
  background: radial-gradient(ellipse at center, rgba(35,29,31,.55), rgba(14,11,12,.95));
  border:1px solid rgba(255,255,255,.08);
  border-radius:6px;
  box-shadow: inset 0 0 10px rgba(0,0,0,.55), 0 0 8px rgba(0,0,0,.35);
}

.cs-rows{ margin:0 2px 6px; }
.cs-col{ padding:6px 8px; }
.cs-label{
  color:#a9947b; font-family:"Times New Roman"; font-size:13px; letter-spacing:.3px;
}
.cs-value, .cs-value a{ color:#e7ded4; font-size:13px; }

.cs-link-row{
  display:flex; justify-content:flex-end; align-items:center;
  padding:6px 8px 2px;
  border-top:1px solid rgba(255,255,255,.06);
  margin-top:2px;
}
.cs-more{
  font-size:11px; text-transform:uppercase; letter-spacing:.6px;
  color:#cbb8a2; opacity:.9;
}
.cs-more:hover{ opacity:1; text-decoration:underline; }


/* ====== NEWS STREAM LAYOUT (center column) ====== */

/* Make sure the middle column never overlaps sidebars */
.main_side { width: calc(100% - 292px - 292px); max-width: calc(100% - 292px - 292px); }
.modules_cont { padding: 12px 0 !important; background: transparent; border: 0; }

/* Wrapper with vertical "paper" strip effect (like your reference) */
.news-stream-wrap{
  position: relative;
  margin: 0 auto;
  padding: 0 10px 20px;
}
.news-stream-wrap:before{
  /* parchment-like strip in the middle (no asset) */
  content:"";
  position:absolute; left:50%; top:0; bottom:0;
  width: 720px; max-width: calc(100% - 20px);
  transform:translateX(-50%);
  background:
    radial-gradient(100% 60% at 50% 0, rgba(255,255,255,.08), rgba(0,0,0,0) 70%),
    linear-gradient(to bottom, rgba(238,220,200,.35), rgba(238,220,200,.18) 60%, rgba(238,220,200,.28)),
    radial-gradient(40% 100% at 0 50%, rgba(0,0,0,.40), rgba(0,0,0,0) 60%),
    radial-gradient(40% 100% at 100% 50%, rgba(0,0,0,.40), rgba(0,0,0,0) 60%);
  border-left: 1px solid rgba(33,28,29,.85);
  border-right: 1px solid rgba(33,28,29,.85);
  box-shadow: 0 0 20px rgba(0,0,0,.6) inset;
  pointer-events:none;
  z-index: 0;
}

/* Stream header */
.news-stream-head{
  position:relative; z-index:1;
  display:flex; align-items:flex-end; justify-content:space-between;
  margin: 6px auto 10px;
  width: 720px; max-width: calc(100% - 20px);
  padding: 10px 12px 6px;
  background: url(../img/some-bg.jpg);
  border: 1px solid #211c1d;
  border-radius: 6px 6px 0 0;
}
.news-stream-head h2{
  margin:0; font-size:16px; color:#e7ded4; letter-spacing:.5px;
  text-transform:uppercase;
}
.news-stream-sub{
  font-size:12px; color:#a9947b; font-family:"Times New Roman";
}

/* Stream body (card list) */
.news-stream{
  position:relative; z-index:1;
  width: 720px; max-width: calc(100% - 20px);
  margin: 0 auto 12px;
  padding: 12px 12px 2px;
  border: 1px solid #211c1d;
  border-top: 0;
  border-radius: 0 0 6px 6px;
  background: transparent;
}

/* Card */
.news-card{
  display:grid;
  grid-template-columns: 108px 1fr;
  gap: 12px;
  background: rgba(19,16,17,.92);
  border: 1px solid #2a2224;
  border-radius: 6px;
  box-shadow: 0 8px 18px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.03);
  padding: 10px;
  margin-bottom: 12px;
}
.news-card--focus{ outline: 1px solid #d1aa5b; box-shadow: 0 0 0 2px rgba(209,170,91,.25), 0 8px 18px rgba(0,0,0,.45); }

/* Thumb */
.news-thumb{ display:block; width: 108px; height: 108px; border-radius: 6px; overflow: hidden; border:1px solid #3a2f31; }
.news-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }

/* Main */
.news-main{ display:flex; flex-direction:column; min-width:0; }
.news-head{ margin-bottom:6px; }
.news-title{ margin:0 0 2px; font-size:15px; line-height:1.25; }
.news-title a{ color:#f0e7db; }
.news-title a:hover{ color:#ffffff; text-decoration:underline; }
.news-meta{ font-size:12px; color:#a9947b; font-family:"Times New Roman"; }

.news-excerpt{
  color:#d2c8be; line-height:1.35; font-size:13px;
}
.news-actions{
  margin-top:8px; display:flex; gap:8px; align-items:center;
}
.btn-news{
  display:inline-block; padding:6px 12px;
  font-size:12px; text-transform:uppercase; letter-spacing:.6px;
  color:#eee; background:linear-gradient(#6b3d2f,#49281f);
  border:1px solid #2b1a15; border-radius:4px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 0 0 1px rgba(0,0,0,.25);
}
.btn-news:hover{ filter: brightness(1.05); color:#fff; }

/* Empty */
.news-empty{
  color:#a9947b; font-style:italic; padding:8px 2px;
  text-align:center;
}

/* Responsive */
@media (max-width: 980px){
  .news-stream-wrap:before,
  .news-stream,
  .news-stream-head{ width: 100%; }
}
@media (max-width: 560px){
  .news-card{ grid-template-columns: 1fr; }
  .news-thumb{ width:100%; height: 180px; }
}

/* ===== Center News Panel (matches sidebar look) ===== */
.panel.panel-main{
  border: 1px solid #211c1d;
  background: url(../img/some-bg.jpg);
  border-radius: 5px;
  margin-bottom: 12px;
}
.panel-body--newslist{ padding: 10px 12px; }

/* Row list */
.news-row{
  display: grid;
  grid-template-columns: 110px 1fr 100px;
  gap: 8px;
  align-items: center;
  padding: 8px 6px;
  border-bottom: 1px solid rgba(255,255,255,.04);
}
.news-row:last-child{ border-bottom: 0; }
.news-row__type{ color:#a9947b; font-family:"Times New Roman"; font-size:13px; }
.news-row__title a{ color:#efe7db; }
.news-row__title a:hover{ color:#fff; text-decoration: underline; }
.news-row__date{ text-align:right; color:#a9947b; font-family:"Times New Roman"; font-size:12px; }

/* Optional preview on the listing page */
.news-row--withpreview .news-row__preview{
  margin-top: 3px;
  color:#cfc3b8;
  font-size: 13px;
  line-height: 1.35;
}
.readmore{ color:#e0c27b; }

/* Single article */
.news-article__title{ margin:0 0 4px; font-size:16px; color:#f0e7db; }
.news-article__meta{ color:#a9947b; font-family:"Times New Roman"; margin-bottom:8px; }
.news-article__body{ color:#e6ddd2; line-height:1.45; }

/* Keep center column boxed and never overlapping sidebars */
.main_side{ width: calc(100% - 292px - 292px); max-width: calc(100% - 292px - 292px); float:left; }
.modules_cont{ background: transparent; border:0; padding:0; }

/* ===== Center News Panel (match sidebar frame) ===== */
.panel.panel-main{
  border: 1px solid #211c1d;
  background: url(../img/some-bg.jpg);
  border-radius: 5px;
  margin: 0 0 12px 0;
}
.panel-body--newslist{ padding: 10px 12px; }

/* News rows */
.news-row{
  display: grid;
  grid-template-columns: 110px 1fr 100px;
  gap: 8px;
  align-items: center;
  padding: 8px 6px;
  border-bottom: 1px solid rgba(255,255,255,.05);
}
.news-row:last-child{ border-bottom: 0; }
.news-row__type{ color:#a9947b; font-family:"Times New Roman"; font-size:13px; }
.news-row__title a{ color:#efe7db; }
.news-row__title a:hover{ color:#fff; text-decoration: underline; }
.news-row__date{ text-align:right; color:#a9947b; font-family:"Times New Roman"; font-size:12px; }

/* Keep middle column boxed; no overlap with left/right sidebars */
.main_side{ width: calc(100% - 292px - 292px); max-width: calc(100% - 292px - 292px); float:left; }
.modules_cont{ background: transparent; border:0; padding:0; }

/* ===== Center column frame matches sidebars ===== */
.modules_cont{
  border: 1px solid #211c1d;
  background: url(../img/some-bg.jpg);
  border-radius: 5px;
  padding: 0;               /* the panel inside will handle its own padding */
  overflow: hidden;
}

/* The inner panel (header + rows) */
.panel.panel-main{ border:0; background: transparent; margin:0; }
.panel-body--newslist{ padding: 10px 12px; }

/* News rows */
.news-row{
  display: grid;
  grid-template-columns: 110px 1fr 100px;
  gap: 8px;
  align-items: center;
  padding: 8px 6px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.news-row:last-child{ border-bottom: none; }

.news-row__type{ color:#a9947b; font-family:"Times New Roman"; font-size:13px; }
.news-row__title a{ color:#efe7db; }
.news-row__title a:hover{ color:#fff; text-decoration: underline; }
.news-row__date{ text-align:right; color:#a9947b; font-family:"Times New Roman"; font-size:12px; }

/* Keep three-column layout widths */
.main_side{ width: calc(100% - 292px - 292px); max-width: calc(100% - 292px - 292px); float:left; }

/* Give the center column a minimum visual height; JS below will extend further */
.modules_cont{ min-height: 600px; }

/* Make the Latest News use the same panel header skin and keep the "More" link aligned */
.panel-news .panel-heading { /* your theme already skins .panel-heading; this keeps spacing tidy */
    padding: 10px 14px;
}
.panel-news .panel-title {
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: .3px;
    color: #c4b9a0; /* same tone as other panel titles */
    position: relative;
}
.panel-news .panel-title .panel-title-action {
    float: right;
    font-size: 12px;
    color: #a58f88;
}
.panel-news .panel-title .panel-title-action:hover {
    color: #fff;
}

/* Body look + height so it visually “fills” like other panels */
.home-news-list {
    background: url(../img/some-bg.jpg); /* same sheet your other panels use */
    min-height: 520px;                    /* adjust if you want it taller/shorter */
    padding: 8px 12px;
    border-radius: 4px;
}

/* News rows */
.home-news-row {
    padding: 10px 2px;
    border-bottom: 1px solid rgba(255,255,255,.05);
}
.home-news-row:last-child { border-bottom: 0; }

.home-news-title {
    color: #e6e0d6;
    text-decoration: none;
}
.home-news-title:hover { color: #ffffff; }

.home-news-date {
    color: #8f837f;
    font-size: 12px;
}

/* Latest News panel header: spacing + right-aligned action */
.panel-news .panel-heading {
  position: relative;
  padding: 10px 14px;
}
.panel-news .panel-title {
  margin: 0;
  display: flex;
  align-items: center;
  gap: 10px;
}
.panel-news .panel-title-text {
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: .3px;
  color: #c4b9a0; /* same tone as other panel titles */
}
/* right action */
.panel-news .panel-title-action {
  margin-left: auto;
  font-size: 12px;
  color: #a58f88;
  text-decoration: none;
}
.panel-news .panel-title-action:hover { color: #fff; }

/* small accent bar in the header (keeps the "colored strip" vibe) */
.panel-news .panel-heading::after {
  content: "";
  position: absolute;
  right: 12px;
  top: 8px;
  height: 28px;
  width: 140px;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(141,180,32,.7), rgba(20,20,20,0));
  mix-blend-mode: screen;
}

/* body look + ensures it isn’t a tiny stub */
.home-news-list {
  background: url(../img/some-bg.jpg);
  padding: 10px 12px;
  min-height: 520px;      /* increase/decrease to taste */
  border-radius: 4px;
}

/* rows: title left, date right, clean separators */
.home-news-row {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.home-news-row:last-child { border-bottom: 0; }

.home-news-title a {
  color: #e6e0d6;
  text-decoration: none;
}
.home-news-title a:hover { color: #ffffff; }

.home-news-date {
  color: #8f837f;
  font-size: 12px;
}

/* ========= LATEST NEWS: full-width, theme-matched header ========= */

/* Container fills the center column */
.news-box{
  width:100%;
  background: url(../img/some-bg.jpg);
  border:1px solid #211c1d;
  border-radius:5px;
  overflow:hidden;
  box-shadow: 0 1px 0 rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.03);
}

/* Header bar that spans the WHOLE width */
.news-headbar{
  position:relative;
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 14px;
  min-height:44px;
  /* wipe any inherited/sprite BG from theme boxes */
  background:none !important;
  z-index:0;
}

/* Paint the full header background */
.news-headbar::before{
  content:"";
  position:absolute; inset:0;
  z-index:-1;
  background:
    linear-gradient(180deg, rgba(28,25,26,.96), rgba(10,9,10,.98)),
    url(../img/some-bg.jpg);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}

/* Subtle green accent line (matches MU vibe) */
.news-headbar::after{
  content:"";
  position:absolute; left:0; right:0; bottom:0;
  height:3px;
  background: linear-gradient(90deg,#79c12e 0%,#4a7a20 60%,rgba(74,122,32,0) 100%);
  opacity:.95;
}

/* Title and More stay inside the bar, not overlapping */
.news-title{
  color:#c4b9a0;
  font-size:14px;
  letter-spacing:.3px;
  text-transform:uppercase;
  font-family:"Georgia";
}
.news-more{
  margin-left:auto;
  display:inline-block;
  padding:4px 10px 4px 10px;
  border-radius:3px;
  border:1px solid rgba(30,40,18,.85);
  background: linear-gradient(#79b81f, #598c15);
  color:#111;
  font-weight:700;
  font-size:12px;
  text-decoration:none;
  text-shadow:0 1px 0 rgba(255,255,255,.35);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 1px 2px rgba(0,0,0,.35);
}
.news-more:hover{ filter:brightness(1.08); }

/* Body pane — set height so it looks like a real panel, not “empty” */
.news-body{
  padding: 10px 14px;
  min-height: 820px;        /* adjust to fit your column “till end” */
  background: url(../img/some-bg.jpg);
}

/* Rows */
.news-row{
  display:grid;
  grid-template-columns: 1fr auto;
  align-items:center;
  gap:12px;
  padding:10px 0;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.news-row:last-child{ border-bottom:0; }

.news-row-title a{
  color:#e6e0d6; text-decoration:none;
}
.news-row-title a:hover{ color:#ffffff; }
.news-row-date{
  color:#8f837f; font-size:12px; white-space:nowrap;
}

/* Safety: kill any old theme header strips that might leak in */
.home-news-block,
.home-news-block-header,
.home-news-block-header::before,
.home-news-block-body{ background: none !important; }

/* ===== News hub (single wide column) ===== */
.we-news-wrap{ width:100%; }

/* Header bar — tight, aligned, and theme-consistent */
.news-headbar{
  position:relative; display:flex; align-items:center; gap:12px;
  padding:8px 12px 9px; min-height:40px;
  border:1px solid #211c1d; border-radius:6px 6px 0 0;
  margin-top:0;
  box-shadow: 0 1px 0 rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.03);
}
.news-headbar::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background: linear-gradient(180deg, rgba(28,25,26,.96), rgba(10,9,10,.98)),
              url(../img/some-bg.jpg);
}
.news-headbar::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:2px;
  background: linear-gradient(90deg,#79c12e 0%,#4a7a20 60%,rgba(74,122,32,0) 100%);
  opacity:.95;
}
.news-title{
  color:#c4b9a0; font-size:14px; text-transform:uppercase;
  letter-spacing:.3px; font-family:"Georgia";
}
.news-more-link{
  margin-left:auto; padding:0;
  color:#c4b9a0; font-size:12px; text-decoration:none; opacity:.9;
}
.news-more-link:hover{ color:#ffffff; opacity:1; }

/* ===== Card (wide, single column) ===== */
.we-card{ border:1px solid #211c1d; border-radius:6px; background:url(../img/some-bg.jpg); }
.we-card--wide{
  display:flex; gap:14px; padding:12px; margin-top:0; /* hug header */
  box-shadow: 0 1px 0 rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.03);
}
.we-news-wrap .we-card--wide + .we-card--wide{ margin-top:12px; }

.we-card-media{ flex:0 0 260px; display:block; overflow:hidden; border-radius:4px; position:relative; }
.we-card-media-bg{
  position:absolute; inset:0; background-size:cover; background-position:center;
  transform:scale(1.01); transition:transform .25s ease;
}
.we-card-media-fallback{
  background: radial-gradient(ellipse at 30% 40%, rgba(121,193,46,.35), rgba(43,69,16,.25)),
              linear-gradient(180deg,#2a2728,#171415);
}
.we-card:hover .we-card-media-bg{ transform:scale(1.06); }

.we-card-body{ flex:1; min-width:0; }
.we-card-title{ margin:2px 0 6px; font-size:18px; letter-spacing:.2px; line-height:1.2; }
.we-card-title a{ color:#e6e0d6; text-decoration:none; }
.we-card-title a:hover{ color:#ffffff; }
.we-card-meta{ color:#8f837f; font-size:12px; margin-bottom:8px; }
.we-card-text{ color:#c8c1b8; font-size:13px; line-height:1.45; }
.we-card-actions{ margin-top:10px; }
.btn-more{
  display:inline-block; padding:6px 12px; border-radius:3px; font-size:12px;
  color:#fff; text-decoration:none; border:1px solid #734f63;
  background:linear-gradient(#2e2729,#1b1718);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 1px 2px rgba(0,0,0,.35);
}
.btn-more:hover{ filter:brightness(1.06); }

/* Empty state */
.we-empty{ margin-top:12px; padding:16px; color:#9a8f86; background:url(../img/some-bg.jpg); border:1px solid #211c1d; border-radius:6px; }

/* ===== Single article hero ===== */
.we-news-hero{ position:relative; height:300px; border:1px solid #211c1d; border-radius:6px; overflow:hidden; margin-top:2px; }
.we-hero-bg{ position:absolute; inset:0; background-size:cover; background-position:center; filter:saturate(1.05) contrast(1.05); }
.we-hero-fallback{
  background: radial-gradient(ellipse at 50% 40%, rgba(121,193,46,.28), rgba(20,20,20,.5)), #1a1718;
}
.we-news-hero-shade{
  position:absolute; inset:0;
  background: radial-gradient(ellipse at center, rgba(0,0,0,0) 35%, rgba(0,0,0,.55) 75%),
              linear-gradient(180deg, rgba(0,0,0,.15), rgba(0,0,0,.65));
}
.we-news-hero-text{
  position:absolute; left:18px; right:18px; bottom:16px;
  text-shadow: 0 2px 6px rgba(0,0,0,.6);
}
.we-news-hero-text h1{ margin:0 0 3px; color:#fff; font-size:26px; letter-spacing:.3px; }
.we-news-meta{ color:#c4b9a0; font-size:13px; }

/* Article body */
.we-article{
  margin-top:12px; padding:14px; border:1px solid #211c1d; border-radius:6px;
  background:url(../img/some-bg.jpg);
  color:#ddd; line-height:1.6;
}
.we-article h1,.we-article h2,.we-article h3{ color:#fff; }
.we-article a{ color:#9AD65E; text-decoration:none; }
.we-article a:hover{ color:#B6F078; }

/* Back */
.we-news-actions{ margin-top:10px; }
.btn-ghost{
  display:inline-block; padding:6px 12px; font-size:12px; color:#c4b9a0; text-decoration:none;
  border:1px solid #44363a; background:linear-gradient(#241f20,#1a1617);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
.btn-ghost:hover{ filter:brightness(1.08); }
/* ===== Latest News: full-width header + right-aligned "More" ===== */
.panel-news{ border:0; background:none; margin-bottom:14px; }
.panel-news .panel-heading{
  position:relative;
  display:flex; align-items:center; gap:10px;
  min-height:44px; padding:10px 14px;
  /* neutralize old split sprites and make the bar span full width */
  background:none !important;
  border:1px solid #211c1d; border-radius:6px 6px 0 0;
  box-shadow:0 1px 0 rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.03);
}
.panel-news .panel-heading::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background: linear-gradient(180deg, rgba(28,25,26,.96), rgba(10,9,10,.98)), url(../img/some-bg.jpg);
}
.panel-news .panel-heading::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:2px;
  background: linear-gradient(90deg,#79c12e 0%,#4a7a20 60%,rgba(74,122,32,0) 100%);
  opacity:.95;
}
.panel-news .panel-title{
  margin:0; padding:0; height:auto; line-height:normal;
  color:#c4b9a0; font-size:14px; text-transform:uppercase; letter-spacing:.3px;
}
.panel-news .panel-title .news-more-link{
  margin-left:auto; font-size:12px; color:#c4b9a0; opacity:.9; text-decoration:none;
}
.panel-news .panel-title .news-more-link:hover{ color:#fff; opacity:1; }

/* Body keeps the same sheet and a tidy frame */
.panel-news .panel-body{
  background:url(../img/some-bg.jpg);
  border:1px solid #211c1d; border-top:0; border-radius:0 0 6px 6px;
  padding:12px;
}

/* ===== News Hero Slider (sits above the list) ===== */
.we-news-hero{
  position:relative; height:260px; margin:10px 0 0 0;
  border:1px solid #211c1d; border-radius:6px; overflow:hidden;
  background:url(../img/some-bg.jpg);
  box-shadow:0 1px 0 rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.03);
}
.we-hero-slide{ position:absolute; inset:0; opacity:0; transition:opacity .5s ease; }
.we-hero-slide.is-active{ opacity:1; }
.we-hero-bg{ position:absolute; inset:0; background-size:cover; background-position:center; filter:saturate(1.05) contrast(1.05); }
.we-hero-shade{ position:absolute; inset:0; background:
  radial-gradient(ellipse at 50% 40%, rgba(0,0,0,0) 35%, rgba(0,0,0,.55) 75%),
  linear-gradient(180deg, rgba(0,0,0,.15), rgba(0,0,0,.65)); }
.we-hero-text{ position:absolute; left:16px; right:16px; bottom:14px; }
.we-hero-title{ margin:0 0 3px; font-size:18px; color:#fff; }
.we-hero-meta{ font-size:12px; color:#c4b9a0; }

/* arrows + dots */
.we-hero-nav{
  position:absolute; inset:auto 10px 10px 10px; display:flex; justify-content:space-between; align-items:center; pointer-events:none;
}
.we-hero-arrow{
  pointer-events:auto; user-select:none; cursor:pointer;
  display:inline-block; padding:6px 10px; border:1px solid #44363a; border-radius:4px;
  background:linear-gradient(#241f20,#1a1617); color:#c4b9a0; font-size:13px;
}
.we-hero-dots{ display:flex; gap:6px; margin-left:auto; }
.we-hero-dot{ width:8px; height:8px; border-radius:999px; background:#695a5c; opacity:.7; }
.we-hero-dot.is-active{ background:#9ad65e; opacity:1; }




/* =========================
   GLASS TOP BUTTON (Log In)
   ========================= */
.glass-btn{
  position:relative; display:inline-block;
  padding:10px 18px; font-weight:700; letter-spacing:.4px; text-transform:uppercase;
  color:#e9e5d6 !important; text-decoration:none; border-radius:12px;
  background:linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12), 0 8px 26px rgba(0,0,0,.35);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  transition:transform .12s ease, box-shadow .18s ease, background .18s ease;
}
.glass-btn::after{
  content:""; position:absolute; left:12px; right:12px; top:7px; height:1px;
  background:linear-gradient(90deg, rgba(255,255,255,.25), rgba(255,255,255,0));
  pointer-events:none;
}
.my-account .accPanel{ background:none !important; height:auto !important; width:auto !important; line-height:1.2; }
.glass-btn:hover{ background:linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.04)); box-shadow:inset 0 1px 0 rgba(255,255,255,.16), 0 12px 36px rgba(0,0,0,.45); transform:translateY(-1px); }
.glass-btn:active{ transform:translateY(0); }
.navigation-top-in .my-account{ padding-top:6px; }

/* =========================
   MODAL BEHAVIOR / BACKDROP
   ========================= */
.modal{ position:fixed !important; top:0; right:0; bottom:0; left:0; overflow-x:hidden; overflow-y:auto; z-index:1060; }
body.modal-open{ overflow:auto !important; padding-right:0 !important; }
.modal-backdrop{ z-index:1050; background:#000; opacity:.6; pointer-events:none; backdrop-filter:blur(2px); -webkit-backdrop-filter:blur(2px); }

/* Center dialogs */
#loginQuickModal .modal-dialog,
#registerQuickModal .modal-dialog{
  position:fixed; top:60px; left:50%; transform:translateX(-50%);
  margin:0; width:520px; max-width:92%;
}
/* =========================
   GLASS MODAL SKIN
   ========================= */
.login-glass{
  background:rgba(18,17,19,.58);
  border:1px solid rgba(255,255,255,.16);
  border-radius:14px;
  color:#e9e9e9;
  box-shadow:0 28px 80px rgba(0,0,0,.65), inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.login-glass .modal-header{
  position:relative;
  border-bottom:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0));
  border-top-left-radius:14px;
  border-top-right-radius:14px;
  cursor:move; /* draggable affordance */
}
.login-glass .modal-title{
  margin:0;
  font-weight:700;
  letter-spacing:.3px;
  line-height:1.2;
}
.login-glass .close{
  position:absolute;
  right:10px; top:10px;
  width:28px; height:28px; line-height:28px;
  text-align:center; border-radius:6px;
  z-index:5; opacity:1; color:#d0d0d0;
  text-shadow:none; cursor:pointer;
}
.login-glass .close:hover{ background:rgba(255,255,255,.08); color:#fff; }
.login-glass .modal-body{ padding:18px; }
.login-glass .form-control{
  background:rgba(10,9,11,.65);
  border:1px solid rgba(255,255,255,.12);
  color:#f3f3f3; height:40px; border-radius:8px;
}
.login-glass .form-control:focus{
  border-color:rgba(154,214,94,.65);
  box-shadow:0 0 0 3px rgba(154,214,94,.16);
  outline:0;
}
.login-glass .modal-footer{
  border-top:1px solid rgba(255,255,255,.08);
  background:linear-gradient(0deg, rgba(255,255,255,.04), rgba(255,255,255,0));
  border-bottom-left-radius:14px; border-bottom-right-radius:14px;
  text-align:right;
}

/* CTA in modal (compact, glassy) */
.glass-cta{
  display:inline-block; padding:8px 14px;
  font-weight:700; text-transform:uppercase; letter-spacing:.35px; color:#e9e5d6;
  background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.18);
  border-radius:10px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14), 0 8px 24px rgba(0,0,0,.35);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  transition:transform .12s ease, box-shadow .18s ease, background .18s ease;
}
.glass-cta:hover{
  background:linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.06));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18), 0 12px 32px rgba(0,0,0,.45);
  transform:translateY(-1px);
}
.glass-cta:active{ transform:translateY(0); }

/* =========================
   HEADER GLASS ACTION STRIP (in the row, not in header)
   ========================= */
.header-info-container{ position:relative; z-index:5; }
.ui-row{
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:100px; max-width:1200px; margin:111 auto; padding:55 120px;
}
.ui-left{ flex:1 1 auto; min-width:520px; }
.ui-right{ flex:0 0 auto; }

/* Panel-style glass bar (match Online Users panel) */
.glass-strip{
  display:flex; align-items:center; gap:0;
  height:96px; padding:10 12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.18);
  /* top sheen + deep glass */
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0)) 0 0/100% 46% no-repeat,
    rgba(22,20,24,.58);
  box-shadow:55 16px 40px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
}

/* Equal chips, perfectly centered contents */
.glass-chip{
  box-sizing:border-box;
  flex:1 1 0; height:100%;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; color:#e9e5d6; text-decoration:none; border-radius:10px;
  background:transparent;
  transition:background .18s ease, transform .12s ease;
}
.glass-chip + .glass-chip{ position:relative; }
.glass-chip + .glass-chip:before{
  content:""; position:absolute; left:0; top:14px; bottom:14px; width:1px;
  background:rgba(255,255,255,.10);
  box-shadow:0 0 0 1px rgba(0,0,0,.15) inset; /* subtle divider like panel */
}
.glass-chip .chip-title{
  display:block; margin:0;
  font-weight:800; text-transform:uppercase;
  letter-spacing:.35px; line-height:1.1; font-size:15px; color:#faf8ef;
}
.glass-chip .chip-sub{
  display:block; margin:4px 0 0 0;
  font-size:11px; color:#cdc9bc; opacity:.95; line-height:1.2;
}
.glass-chip:hover{
  background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.04));
  transform:translateY(-1px);
}

/* Subtle accent only on Register */
.glass-chip.is-primary{
  background:linear-gradient(180deg, rgba(170,230,110,.16), rgba(255,255,255,.04));
  border:1px solid rgba(170,230,110,.28);
}
.glass-chip.is-primary:hover{
  background:linear-gradient(180deg, rgba(170,230,110,.22), rgba(255,255,255,.06));
}

/* Prevent header particles from blocking interactions */
.sparks, .sparks *{ pointer-events:none !important; }

/* Responsive stack */
@media (max-width:1024px){
  .ui-row{ flex-direction:column; align-items:stretch; gap:10px; }
  .ui-left{ min-width:0; }
  .glass-strip{ height:84px; }
}


/* ====== NEWS HERO: flush with panel border ====== */
/* Bootstrap panels add 15px padding in .panel-body; bleed the hero out so it touches the border */
.panel-news .we-news-hero{
  margin: -15px -15px 12px;          /* top/left/right negate body padding; keep a small bottom gap */
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  overflow: hidden;                   /* trims background at rounded corners */
}

/* If your panel has extra top padding, remove it */
.panel-news .panel-body{ padding-top: 0; }

/* Make sure the hero background fully covers the box */
.we-hero-slide,
.we-hero-bg{
  top: 0; left: 0; right: 0; bottom: 0;
  height: 100%;
  background-position: center;
  background-size: cover;
}

/* ====== Prevent title/date from interfering with the left arrow ====== */
.we-hero-text{
  position: absolute;
  left: 0; right: 0; bottom: 0;
  /* pad extra on the left so the text doesn't sit under the arrow */
  padding: 18px 22px 18px 72px;      /* <-- increase if your arrow is wider */
  z-index: 2;
  pointer-events: none;              /* text block itself doesn't steal clicks */
}
.we-hero-title a,
.we-hero-meta{ pointer-events: auto; } /* links remain clickable */

/* Make arrows sit above text and clearly clickable */
.we-hero-arrow{
  position: absolute;                /* if they aren’t already */
  bottom: 16px;                      /* align with baseline of text */
  left: 16px;                        /* for the “<” arrow specifically */
  z-index: 4;
}

/* If you have a right arrow too, ensure it’s clear of the text */
.we-hero-arrow[data-dir="1"]{
  left: auto;
  right: 16px;
}

/* Dots: keep them centered and above text if needed */
.we-hero-dots{
  position: absolute;
  left: 50%; transform: translateX(-50%);
  bottom: 16px;
  z-index: 3;
}
/* 1) Most themes add top padding inside the content panel (.modules_cont).
      This removes only the TOP padding so the hero can sit flush. */
.main_side .modules_cont{ padding-top:0; }

/* 2) In case your first row/box adds its own top margin/padding, cancel it. */
.main_side .modules_cont > .row:first-child{ margin-top:0; padding-top:0; }

/* 3) Make the hero truly “full-bleed” inside the panel:
      - cancel any residual padding from its immediate parent
      - clip to rounded corners
      - keep a small bottom gap before the 'Latest News' heading */
.panel-news .panel-body{ padding-top:0; }
.panel-news .we-news-hero{
  /* pull hero up to the very top; adjust the number if your theme differs */
  margin-top: -15px;               /* cancels typical .panel-body top padding */
  margin-left: -15px;
  margin-right: -15px;
  margin-bottom: 12px;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  overflow: hidden;
}

/* If your hero is not inside .panel-news, target the block you used: */
.home-news-block .we-news-hero{
  margin-top: -20px;               /* ← bump this to -24/-28px if you still see a gap */
  margin-left: -15px;
  margin-right: -15px;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  overflow: hidden;
}

/* Shift the header logo to the right */
:root { --logo-shift: 305px; }          /* tweak this value */

#header { position: relative; }
.webengine-mu-logo{
  display:block;
  margin:0 auto;                       /* keep it centered baseline */
  position: relative;                  /* allow a nudge */
  left: var(--logo-shift);             /* move to the right */
}

/* On smaller screens keep it centered */
@media (max-width: 992px){
  .webengine-mu-logo{ left: 0; }
}

/* ===== REGISTER MODAL LAYOUT ===== */

/* Grid: 2 columns on desktop, 1 column on mobile */
.reg-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px 20px;
}
@media (max-width: 992px){
  .reg-grid{ grid-template-columns: 1fr; }
}

/* left/right columns */
.reg-left, .reg-right{ min-width: 0; }

/* tighter spacing that matches your glass style */
.login-glass .form-group{ margin-bottom: 12px; }
.reg-check{ margin: 8px 0; }
.reg-check input{ margin-right: 6px; position: relative; top: 1px; }

/* rules box */
.reg-rules{
  margin-top: 10px;
  padding: 12px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 8px;
  background: rgba(18,17,19,.45);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}
.reg-rules-title{
  font-weight: 700;
  margin-bottom: 6px;
  opacity: .95;
}
.reg-rules-list{
  padding-left: 18px;
  margin: 0;
  line-height: 1.4;
  color: #e9e9e9;
  opacity: .92;
}

/* footer button = full width on mobile, compact on desktop */
.reg-footer{
  display: flex; justify-content: flex-end; gap: 10px;
  border-top: 1px solid rgba(255,255,255,.08);
}
.reg-submit{
  padding: 10px 18px;
  text-transform: uppercase;
  letter-spacing: .4px;
}
@media (max-width: 480px){
  .reg-footer{ justify-content: stretch; }
  .reg-submit{ width: 100%; }
}

/* logo under the left column inputs */
.reg-logo-wrap{
  margin-top: 14px;
  text-align: center;
}
.reg-logo{
  max-width: 240px;
  width: 100%;
  height: auto;
  opacity: .95;
  filter: drop-shadow(0 6px 20px rgba(0,0,0,.5));
}

/* keep the modal width consistent with the glass login */
#registerQuickModal .modal-dialog{ width: 900px; max-width: 95%; }


/* ===== News detail: hero + typography ===== */
.panel-news .we-hero--detail{
  /* full-bleed inside panel, trims to rounded corners */
  height: 260px;
  background-size: cover;
  background-position: center;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  /* pull over default .panel-body padding (15px) */
  margin: -1px -1px 0; /* snug to panel border; -1 to hide hairline gaps */
  overflow: hidden;
}
@media (max-width: 768px){
  .panel-news .we-hero--detail{ height: 200px; }
}

/* Trim top padding so hero touches the top of panel */
.panel-news .panel-body{ padding-top: 14px; }

/* Title + meta */
.we-article-title{
  margin: 6px 0 6px;
  font-size: 22px;
  line-height: 1.25;
  font-weight: 800;
  color: #faf7ee;
}
.we-article-meta{
  margin-bottom: 14px;
  color: #a9a6a0;
  font-size: 12px;
}
.we-article-back{ color:#d8c07a; text-decoration:none; }
.we-article-back:hover{ text-decoration:underline; }

/* Body typography (affects only the article body) */
.we-article-body{
  color:#e6e4de;
  line-height:1.65;
  font-size:14.5px;
}
.we-article-body p{ margin: 0 0 12px; }
.we-article-body h1,
.we-article-body h2,
.we-article-body h3{
  margin: 18px 0 8px;
  line-height:1.25;
  color:#fff;
  font-weight:800;
}
.we-article-body h1{ font-size:22px; }
.we-article-body h2{ font-size:20px; }
.we-article-body h3{ font-size:18px; }

/* Lists: comfortable spacing */
.we-article-body ul,
.we-article-body ol{ margin: 8px 0 12px 22px; }
.we-article-body li{ margin: 4px 0; }

/* Tables pasted from CMS */
.we-article-body table{
  width:100%;
  border-collapse: collapse;
  margin: 10px 0 14px;
  font-size: 14px;
}
.we-article-body th,
.we-article-body td{
  padding:8px 10px;
  border:1px solid rgba(255,255,255,.08);
}
.we-article-body th{ background:rgba(255,255,255,.04); font-weight:700; }

/* Images inside content */
.we-article-body img{ max-width:100%; height:auto; display:block; margin:8px auto; }
/* ===== UserCP Vector Glass Chips ===== */
.ucp-grid{
  display:grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap:14px;
  margin:6px 0;
}

.ucp-chip{
  position:relative;
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 14px;
  border-radius:12px;
  text-decoration:none;
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)),
    radial-gradient(120% 100% at 0% 0%, rgba(255,255,255,.06), transparent 60%);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 4px 18px rgba(0,0,0,.45);
  transition:transform .15s ease, box-shadow .2s ease, border-color .2s ease;
  color:#d9d3c2;
}

.ucp-chip::after{ /* subtle highlight line */
  content:"";
  position:absolute;
  left:12px; right:12px; top:8px;
  height:1px; opacity:.35;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.6), transparent);
  pointer-events:none;
}

.ucp-chip:hover{
  transform:translateY(-2px);
  border-color:rgba(255,255,255,.22);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 8px 28px rgba(0,0,0,.55),
    0 0 18px rgba(154,214,94,.22); /* soft emerald glow */
}

.ucp-icon{
  flex:0 0 40px;
  width:40px; height:40px;
  border-radius:10px;
  display:grid; place-items:center;
  background:
    linear-gradient(180deg, rgba(154,214,94,.18), rgba(154,214,94,.05));
  border:1px solid rgba(154,214,94,.35);
  box-shadow:
    inset 0 0 0 1px rgba(0,0,0,.35),
    0 0 10px rgba(154,214,94,.12);
}

.ucp-icon svg{
  display:block;
}

.ucp-label{
  font: 600 14px/1.2 "PT Sans","Tahoma",sans-serif;
  letter-spacing:.2px;
  color:#e7e2d6;
  text-shadow:0 1px 0 rgba(0,0,0,.35);
  /* keep labels to one line */
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

/* Reduce blur on dark backgrounds (subpixel rendering) */
@supports (backdrop-filter: blur(2px)) {
  .ucp-chip{ backdrop-filter: blur(2px) saturate(1.02); }
}

/* Tight mode on very narrow columns */
@media (max-width: 420px){
  .ucp-grid{ grid-template-columns: repeat(2, 1fr); }
  .ucp-label{ font-size:13px; }
}








/* ================================
   TOP MASTER RESETS (glass theme)
   ================================ */

/* Vars */
:root{
  --glass-bg: rgba(255,255,255,.06);
  --glass-brd: rgba(255,255,255,.18);
  --glass-txt: #ece9e1;
  --rr-tint: rgba(120,170,255,.45);   /* cool blue border */
  --mr-tint: rgba(255,195,105,.55);   /* warm amber border */
}

/* Table base */
.table.widget-top-gr{ margin:0; width:100%; border-collapse:separate; border-spacing:0; }
.widget-top-gr thead th{
  font-weight:600; color:#dcd7c9;
  border-bottom:1px solid rgba(255,255,255,.08);
  padding:8px 10px;
}
.widget-top-gr td, .widget-top-gr th{
  padding:10px; vertical-align:middle; font-size:13px; color:#ddd;
}
.widget-top-gr .col-rank{ width:30px; }
.widget-top-gr .col-class{ width:36px; }
.widget-top-gr .col-rr{ width:56px; } /* slimmer */
.widget-top-gr .col-mr{ width:56px; } /* slimmer */

/* Class icon + Player text */
.widget-top-gr .class-cell img.rankings-class-image{
  width:20px; height:20px; border-radius:6px;
  border:1px solid rgba(255,255,255,.14);
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.45);
  background: rgba(255,255,255,.02);
}
.widget-top-gr .name-cell span{
  color:#e9e5d8; display:inline-block; max-width:100%;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

/* -------- GLASS ROW EFFECT -------- */
.glass-list .glass-row{
  position:relative;
  border-bottom:1px solid rgba(255,255,255,.05);
  transition: transform .18s ease, box-shadow .22s ease, background .22s ease;
  will-change: transform, box-shadow, background;
}
.glass-list .glass-row:last-child{ border-bottom:0; }

/* table-wide shimmer on hover */
.glass-list .glass-row::after{
  content:""; position:absolute; inset:0;
  background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,.10) 25%, rgba(255,255,255,.16) 35%, transparent 60%);
  transform: translateX(-120%); opacity:0; pointer-events:none;
}
.glass-list .glass-row:hover{
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.03));
  backdrop-filter: blur(6px) saturate(120%);
  -webkit-backdrop-filter: blur(6px) saturate(120%);
  box-shadow: 0 10px 24px rgba(0,0,0,.28), inset 0 0 0 1px rgba(255,255,255,.08);
  transform: translateY(-1px);
}
.glass-list .glass-row:hover::after{
  transition: transform .55s ease, opacity .25s ease;
  transform: translateX(0%); opacity:1;
}

/* Left→Right sweep on Class + Player (staggered) */
.glass-list .glass-row .class-cell,
.glass-list .glass-row .name-cell{
  position: relative; overflow: hidden;
}
.glass-list .glass-row .class-cell::after,
.glass-list .glass-row .name-cell::after{
  content:""; position:absolute; top:-30%; bottom:-30%; left:-60%; right:-60%;
  background: linear-gradient(120deg, transparent 45%, rgba(255,255,255,.18) 50%, transparent 55%);
  transform: translateX(-120%); transition: transform .70s ease; pointer-events:none;
}
.glass-list .glass-row:hover .class-cell::after{ transform: translateX(120%); transition-delay: 0s; }
.glass-list .glass-row:hover .name-cell::after{  transform: translateX(120%); transition-delay: .06s; }
.glass-list .glass-row:hover .name-cell span{ color:#fff; transition: color .20s ease; }
.glass-list .glass-row:hover .class-cell img.rankings-class-image{ filter: brightness(1.15) contrast(1.05); transition: filter .25s ease; }

/* -------- CHIPS (slim glossy glass) -------- */
.widget-top-gr .badge-rr,
.widget-top-gr .badge-mr{
  display:inline-block; min-width:34px; padding:3px 8px;
  line-height:1; text-align:center; font-weight:700; font-size:12px; letter-spacing:.2px;
  color: var(--glass-txt);
  background:
    linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.04)),
    rgba(255,255,255,.03);
  border-radius:7px;
  border:1px solid var(--glass-brd);
  backdrop-filter: blur(4px) saturate(125%);
  -webkit-backdrop-filter: blur(4px) saturate(125%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.25),
    inset 0 -1px 0 rgba(0,0,0,.15),
    0 2px 10px rgba(0,0,0,.18);
  position:relative; overflow:hidden;
  transition: transform .18s ease, box-shadow .22s ease, border-color .22s ease, background .22s ease, color .22s ease;
}
/* thin prism edge */
.widget-top-gr .badge-rr::before,
.widget-top-gr .badge-mr::before{
  content:""; position:absolute; inset:0 auto 0 0; width:2px;
  border-radius:7px 0 0 7px;
  background: linear-gradient(180deg, rgba(255,255,255,.70), rgba(255,255,255,.18));
  opacity:.85; pointer-events:none;
}
/* moving sheen (syncs with row hover) */
.widget-top-gr .badge-rr::after,
.widget-top-gr .badge-mr::after{
  content:""; position:absolute; inset:-40% -60% -40% -60%;
  background: linear-gradient(120deg, transparent 45%, rgba(255,255,255,.22) 50%, transparent 55%);
  transform: translateX(-80%); transition: transform .60s ease; pointer-events:none;
}
.glass-list .glass-row:hover .badge-rr::after,
.glass-list .glass-row:hover .badge-mr::after{ transform: translateX(6%); }

/* tinting */
.widget-top-gr .badge-rr{ border-color: var(--rr-tint); }
.widget-top-gr .badge-mr{ border-color: var(--mr-tint); color:#ffefd0; }

/* chip hover polish (keeps your row effect) */
.glass-list .glass-row:hover .badge-rr,
.glass-list .glass-row:hover .badge-mr{
  transform: translateY(-0.5px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.32),
    inset 0 -1px 0 rgba(0,0,0,.18),
    0 6px 16px rgba(0,0,0,.24);
  border-color: rgba(255,255,255,.35);
}

/* Accessibility: reduce motion */
@media (prefers-reduced-motion: reduce){
  .glass-list .glass-row,
  .widget-top-gr .badge-rr,
  .widget-top-gr .badge-mr{ transition:none; }
  .glass-list .glass-row::after,
  .widget-top-gr .badge-rr::after,
  .widget-top-gr .badge-mr::after{ display:none; }
}
/* ===== FIX: stop lingering shimmer after hover ===== */

/* 1) Class + Player sweep — clip to cell and remove exit transition */
.glass-list .glass-row .class-cell,
.glass-list .glass-row .name-cell{
  position: relative;
  overflow: hidden; /* hard clip */
}

.glass-list .glass-row .class-cell::after,
.glass-list .glass-row .name-cell::after{
  /* keep the same gradient, but confine vertically to the cell */
  top: 0; bottom: 0;                /* was -30% / -30% */
  left: -60%; right: -60%;
  transition: none;                 /* no transition on mouseout -> instant reset */
}

.glass-list .glass-row:hover .class-cell::after{
  transform: translateX(120%);
  transition: transform .55s ease;  /* transition only on mouseover */
}
.glass-list .glass-row:hover .name-cell::after{
  transform: translateX(120%);
  transition: transform .55s ease .06s; /* staggered start; still no lingering */
}

/* 2) RR/MR chip sheen — also remove exit transition so it snaps back */
.widget-top-gr .badge-rr::after,
.widget-top-gr .badge-mr::after{
  transition: none;                 /* instant reset on mouseout */
}
.glass-list .glass-row:hover .badge-rr::after,
.glass-list .glass-row:hover .badge-mr::after{
  transition: transform .55s ease;  /* animate only while hovered */
}

/* (Optional) slightly shorter sweep so it finishes before you move away */
.glass-list .glass-row:hover .class-cell::after,
.glass-list .glass-row:hover .name-cell::after{
  /* adjust if you want it even snappier: .45s */
  transition-duration: .45s;
}

/* === Clip effects inside borders (no spill) === */

/* 1) RR/MR chips: keep sheen 100% inside the rounded border */
.widget-top-gr .badge-rr,
.widget-top-gr .badge-mr{
  position: relative;
  overflow: hidden;            /* hard clip to chip radius */
  border-radius: 7px;          /* ensure same radius for clipping */
  contain: paint;              /* avoid paint spill on some browsers */
}

.widget-top-gr .badge-rr::after,
.widget-top-gr .badge-mr::after{
  /* stay entirely inside the chip; no negative inset */
  top: 0; bottom: 0;
  left: -20%;                  /* start just inside */
  width: 140%;                 /* enough width to cross the chip */
  right: auto;                 /* ignore previous inset values */
  inset: auto;                 /* cancel older rules */
  transform: translateX(-20%); /* closer origin */
}

/* animate across but keep it inside due to overflow:hidden */
.glass-list .glass-row:hover .badge-rr::after,
.glass-list .glass-row:hover .badge-mr::after{
  transform: translateX(100%);
}

/* 2) Optional: also clip the row-wide shimmer to the row bounds */
.glass-list .glass-row{
  overflow: hidden;            /* clip shimmer band inside the row */
  border-radius: 6px;          /* subtle rounding so clip looks clean */
}

/* 3) Class/Player sweeps are already clipped, ensure no negative top/bottom */
.glass-list .glass-row .class-cell::after,
.glass-list .glass-row .name-cell::after{
  top: 0; bottom: 0;           /* no vertical bleed */
}

/* ==== GLOBAL BARRIER FOR SIDEBAR WIDGET EFFECTS ==== */
/* Clip any inner effects (row shimmer, chip sheen, blur) to the panel */
.panel.panel-sidebar,
.panel.panel-sidebar .panel-body{
  position: relative;
  overflow: hidden;        /* <- hard clip */
  isolation: isolate;      /* new stacking context so shines don't leak */
  contain: paint;          /* extra safety on some browsers */
  border-radius: 6px;      /* match your panel rounding so clipping is clean */
}

/* If a table adds its own effects, clip to the table area too */
.table.widget-top-gr.glass-list{
  position: relative;
  overflow: hidden;        /* clip table-wide shimmer band */
  isolation: isolate;
  contain: paint;
}

/* Keep chips strictly inside their rounded borders (reinforce) */
.widget-top-gr .badge-rr,
.widget-top-gr .badge-mr{
  overflow: hidden;
  border-radius: 7px;
  isolation: isolate;
  contain: paint;
}

/* === Top Guilds alignment + gold score chip === */
.widget-top-gr.is-guilds .col-rank{ width:28px; }
.widget-top-gr.is-guilds .col-logo{ width:34px; }
.widget-top-gr.is-guilds .col-score{ width:120px; }
.widget-top-gr.is-guilds .col-name{ /* header cell */ text-align:left; }
.widget-top-gr.is-guilds thead th:nth-child(3){ text-align:left; }

.widget-top-gr.is-guilds .name-cell{ text-align:left; }
.widget-top-gr.is-guilds .name-cell a{
  color:#e9e5d8; text-decoration:none;
  display:inline-block; max-width:100%;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.widget-top-gr.is-guilds .name-cell a:hover{ color:#fff; }

/* Gold chip for Score (matches your glass style) */
.badge-score{
  display:inline-block; min-width:64px; padding:4px 10px;
  line-height:1; text-align:center; font-weight:700; font-size:12px;
  color:#fff2cf;
  background:
    linear-gradient(180deg, rgba(255,230,150,.22), rgba(255,180,70,.14)),
    rgba(255,255,255,.03);
  border:1px solid rgba(255,195,105,.55);
  border-radius:7px;
  backdrop-filter: blur(4px) saturate(125%);
  -webkit-backdrop-filter: blur(4px) saturate(125%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.28),
    inset 0 -1px 0 rgba(0,0,0,.18),
    0 2px 10px rgba(0,0,0,.18);
  position:relative; overflow:hidden;
}

/* gold chip sheen (clipped inside) */
.badge-score::after{
  content:""; position:absolute; top:0; bottom:0; left:-20%; width:140%;
  background: linear-gradient(120deg, transparent 45%, rgba(255,255,255,.25) 50%, transparent 55%);
  transform: translateX(-20%);
  transition: none; pointer-events:none;
}
.glass-list.is-guilds .glass-row:hover .badge-score::after{
  transform: translateX(100%);
  transition: transform .40s ease;
}





/* ===============================
   Guild Profile — Glass (static)
   =============================== */
.guild-profile.glass-card{
  position:relative; padding:18px 18px 22px;
  border-radius:14px;
  background: linear-gradient(180deg, rgba(20,16,20,.55), rgba(16,10,14,.45));
  border:1px solid rgba(255,255,255,.12);
  box-shadow: 0 10px 30px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  color:#e8e5dd;
  overflow:hidden; isolation:isolate; contain:paint;
}

.guild-profile .gp-header{
  display:grid; grid-template-columns:160px 1fr; grid-gap:18px; align-items:center;
}
.guild-profile .gp-logo-wrap{
  width:150px;height:150px;border-radius:12px;
  background: rgba(0,0,0,.35);
  display:grid;place-items:center;overflow:hidden;
  box-shadow:0 6px 18px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.06);
}

.guild-profile .gp-name{
  margin:0 0 6px; font-size:28px; letter-spacing:.5px; color:#f6f2e8;
  text-shadow:0 1px 0 rgba(0,0,0,.45);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

/* Stats */
.guild-profile .gp-stats{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:8px;
}
.guild-profile .gp-stat{
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  border-radius:10px; padding:10px 12px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
  min-height:58px;
}
.guild-profile .gp-stat-label{ font-size:12px; opacity:.75; margin-bottom:4px; }
.guild-profile .gp-stat-value{ font-size:14px; display:flex; align-items:center; gap:8px; }

/* Gold score chip */
.badge-score{
  display:inline-block; padding:6px 10px; border-radius:999px;
  background: linear-gradient(180deg,#f8d36b,#d7a536);
  color:#3b2a05; font-weight:700; line-height:1;
  border:1px solid rgba(113,76,16,.4);
  box-shadow:0 2px 8px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.4);
}
.badge-count{
  display:inline-block; padding:6px 10px; border-radius:999px;
  background: linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.06));
  border:1px solid rgba(255,255,255,.15); font-weight:600; color:#f0ede6;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}

/* Divider */
.guild-profile .gp-divider{
  height:1px; background:linear-gradient(90deg,transparent,rgba(255,255,255,.12),transparent);
  margin:16px 0 10px;
}

/* Members grid (bigger boxes) */
.guild-profile .gp-members-title{
  font-size:18px; letter-spacing:.4px; margin:0 0 10px; color:#f6f2e8; text-align:center;
}
.guild-profile .gp-members-grid{
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px; list-style:none; margin:0; padding:0;
}
@media (max-width:1200px){ .guild-profile .gp-members-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:768px){
  .guild-profile .gp-header{ grid-template-columns:1fr; }
  .guild-profile .gp-members-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}

/* Member pill: name on top, RR/GR under it */
.guild-profile .gp-member{
  padding:12px 14px; border-radius:12px;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.08);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
  min-height:68px;
  display:flex; flex-direction:column; align-items:flex-start; gap:6px;
  transition: box-shadow .15s ease, transform .15s ease;
}
.guild-profile .gp-member:hover{
  transform: translateY(-2px);
  box-shadow:0 10px 18px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.05);
}
.guild-profile .gp-member-name{
  font-weight:700; color:#fff; max-width:100%;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.guild-profile .gp-member-meta{
  font-size:13px; opacity:.92; color:#e8e5dd;
}
.guild-profile .gp-member-meta .label{ opacity:.75; margin-right:4px; }
.guild-profile .gp-member-meta .val.rr{ font-weight:700; color:#a7c8ff; }
.guild-profile .gp-member-meta .val.gr{ font-weight:700; color:#ffd87a; }
.guild-profile .gp-member-meta .spacer{ opacity:.35; margin:0 8px; }

/* Hard-disable any previous moving/shine rules */
.guild-profile::before,
.guild-profile .gp-logo-wrap::before,
.guild-profile .gp-logo-wrap::after,
.guild-profile .gp-name::after,
.guild-profile .class-cell::after,
.guild-profile .name-cell::after { content:none !important; animation:none !important; }


/*******************************
 * My Account — Glass (fresh)
 *******************************/

/* Base glass card */
.glass{
  background: linear-gradient(180deg, rgba(17,14,18,.62), rgba(12,10,12,.52));
  border:1px solid rgba(255,255,255,.10);
  border-radius:14px;
  box-shadow:0 10px 26px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.06);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  color:#ece7de;
}

/* Layout: Overview full width; VIP + Wallet side by side */
.ua-grid-new{
  display:grid;
  grid-template-columns: 1fr 1fr;
  grid-template-areas:
    "overview overview"
    "vip      wallet";
  gap:18px;
  margin-bottom:18px;
}
.ua-overview{ grid-area:overview; padding:16px; }
.ua-vip{      grid-area:vip;      padding:16px; min-height:220px; }
.ua-wallet{   grid-area:wallet;   padding:16px; min-height:220px; }

@media (max-width: 900px){
  .ua-grid-new{
    grid-template-columns:1fr;
    grid-template-areas:
      "overview"
      "vip"
      "wallet";
  }
}

/* Section headings */
.ua-head{
  margin:0 0 12px;
  padding-bottom:8px;
  border-bottom:1px solid rgba(255,255,255,.08);
  color:#ffcc00;
  text-transform:uppercase;
  letter-spacing:.5px;
  font-size:15px;
}

/* Rows (left label + right value) */
.ua-row{
  display:grid;
  grid-template-columns:160px 1fr;
  align-items:center;
  gap:10px;
  padding:8px 0;
  border-bottom:1px dashed rgba(255,255,255,.06);
}
.ua-row:last-child{ border-bottom:0; }
.ua-row .k{ opacity:.82; white-space:nowrap; }
.ua-row .v{ font-weight:600; color:#fff; min-width:0; }

/* Value + action button */
.v-act{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:10px;
}

.btn-min{
  padding:6px 12px;
  border-radius:8px;
  background:rgba(255,255,255,.10);
  color:#fff;
  border:1px solid rgba(255,255,255,.12);
  font-weight:700;
  text-decoration:none;
  white-space:nowrap;
}
.btn-min.success{ background:#1f8a42; border-color:#1b7137; }
.right{ display:flex; justify-content:flex-end; margin-top:10px; }

/* Status pills (Account status / Online status) */
.ua-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:22px;
  line-height:22px;
  padding:0 10px;
  border-radius:999px;
  font-weight:800;
  font-size:12px;
  white-space:nowrap;
}
.ua-pill.dim{ background:rgba(255,255,255,.14); color:#fff; }
.ua-pill.ok { background:#2b7a39; color:#ddf7e6; }
.ua-pill.off{ background:#7a2b2b; color:#ffeaea; }

/* VIP badge: two separate padded pills, tidy spacing */
.vip-badge{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:12px;                 /* space between name & state */
  width:100%;
  padding:8px 12px;
  border-radius:10px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.10);
  box-sizing:border-box;
}
.vip-badge .vip-name{
  display:inline-flex;
  align-items:center; justify-content:center;
  padding:4px 12px;
  background:rgba(255,255,255,.10);
  border-radius:999px;
  font-weight:800;
  line-height:1;
  white-space:nowrap;
  color:#fff;
}
.vip-badge .vip-state{
  display:inline-flex;
  align-items:center; justify-content:center;
  padding:4px 12px;
  border-radius:999px;
  font-weight:800;
  font-size:12px;
  line-height:1;
  white-space:nowrap;
  color:#fff;
}
.vip-badge .vip-state.ok  { background:#2b7a39; color:#ddf7e6; }
.vip-badge .vip-state.off { background:#7a2b2b; color:#ffeaea; }

/* Optional color hint for VIP tiers */
.vip-badge.vip-bronze .vip-name{ color:#e2b08a; }
.vip-badge.vip-silver .vip-name{ color:#d2d8e4; }
.vip-badge.vip-gold   .vip-name{ color:#f6d36b; }

/* Keep Expires text inside VIP card */
.ua-row .v{
  display:flex;
  align-items:center;
  gap:8px;
  white-space:normal;           /* allow wrap if needed */
  overflow-wrap:break-word;
  word-break:break-word;
}

/* Wallet chips */
.wallet-line{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
}
.chip{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 12px;
  border-radius:10px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.10);
}
.chip .ck{ opacity:.75; }
.chip .cv{ font-weight:900; }
.chip .cv.wcoin{ color:#8abaff; }
.chip .cv.ruud { color:#ffd26f; }

/* Characters (compact 2 columns) */
.ua-chars{
  display:grid;
  grid-template-columns:repeat(2, minmax(280px, 1fr));
  gap:14px;
  margin-bottom:12px;
}
@media (max-width: 720px){
  .ua-chars{ grid-template-columns:1fr; }
}

.char{ padding:12px; border-radius:12px; }
.char .top{
  display:flex; justify-content:space-between; align-items:center; margin-bottom:6px;
}
.char .nm{
  font-weight:800; color:#fff; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.char .badges{ display:flex; align-items:center; gap:8px; }
.dot{ width:8px; height:8px; border-radius:50%; display:inline-block; }
.dot.ok{  background:#2fd26f; box-shadow:0 0 6px rgba(47,210,111,.6); }
.dot.off{ background:#aa3a3a; }
.lbl{ font-size:12px; opacity:.85; }
.lvl{
  background:rgba(255,255,255,.1);
  padding:2px 6px; border-radius:8px; font-weight:800; font-size:11px;
}
.lvl small{ opacity:.8; margin-right:4px; }

.char .body{ display:flex; align-items:center; gap:10px; }
.char .av img{ width:40px; height:40px; object-fit:contain; border-radius:8px; }
.char .loc{ font-size:12px; opacity:.9; }
.char .loc span{ opacity:.7; }