/* ==========================================================================
   SACRED RO - global theme (modern nav + dark inner pages)
   Loaded site-wide from header.php. Landing page has its own scoped #sr CSS.
   ========================================================================== */
:root{
  --sr-base:#0b0912; --sr-surf:#141021; --sr-elev:#1d1730; --sr-elev2:#241d38;
  --sr-line:rgba(232,190,90,.16); --sr-line2:rgba(139,108,255,.22);
  --sr-gold:#e8be5a; --sr-gold2:#c99a34; --sr-gold-soft:#f3d585;
  --sr-royal:#3b5bdb; --sr-violet:#8b6cff;
  --sr-text:#ece7de; --sr-muted:#a99fb8; --sr-dim:#7d7391;
}
body{ background:#0b0912 !important; color:var(--sr-text); }

/* ===================== MODERN NAV ===================== */
#header{
  left:0 !important; right:0 !important; top:0 !important; width:auto !important; max-width:none !important; transform:none !important;
  height:70px !important; border-radius:0 !important;
  background:rgba(11,9,18,.72) !important;
  -webkit-backdrop-filter:blur(14px) saturate(1.1); backdrop-filter:blur(14px) saturate(1.1);
  border-bottom:1px solid rgba(232,190,90,.14) !important;
  box-shadow:0 6px 24px -14px rgba(0,0,0,.6);
  transition:background .3s ease, box-shadow .3s ease, border-color .3s ease, height .3s ease;
  z-index:900 !important;
}
/* more solid once scrolled */
#header.sr-scrolled{
  height:64px !important;
  background:rgba(11,9,18,.94) !important;
  border-bottom:1px solid rgba(232,190,90,.2) !important;
  box-shadow:0 12px 34px -14px rgba(0,0,0,.8);
}
/* solid bar on inner pages (no banner bleed-through) */
body.sr-inner #header{
  height:66px !important;
  background:linear-gradient(180deg,#131020,#0e0b18) !important;
  border-bottom:1px solid rgba(232,190,90,.16) !important;
  box-shadow:0 10px 34px -14px rgba(0,0,0,.8);
}
/* kill the theme's 40px top padding so nothing shows above the flush header */
body.sr-inner{ padding-top:0 !important; }

/* logo - clean Cinzel wordmark, no clip */
.header-logo{ position:absolute !important; left:36px !important; top:0 !important; height:100% !important;
  display:flex !important; align-items:center !important; transform:none !important; }
.header-logo a{
  display:inline-block !important;
  width:auto !important; height:auto !important; margin:0 !important; padding:0 !important;
  font-family:'Cinzel',serif !important; font-weight:700 !important;
  font-size:21px !important; line-height:1 !important; letter-spacing:.22em !important;
  text-transform:uppercase !important; white-space:nowrap !important;
  background:linear-gradient(180deg,#fff3d1 0%,#e8be5a 55%,#caa03a 100%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
  text-shadow:none !important; filter:drop-shadow(0 2px 14px rgba(232,190,90,.22));
  transition:filter .3s ease, transform .2s ease !important;
}
/* brand text glows on hover / while pressed (drop-shadow bloom, since the fill is
   transparent-clipped so text-shadow can't show) */
.header-logo a:hover{
  filter:drop-shadow(0 0 6px rgba(243,213,133,.55)) drop-shadow(0 0 20px rgba(232,190,90,.5)) !important;
}
.header-logo a:active{
  filter:drop-shadow(0 0 9px rgba(255,244,200,.85)) drop-shadow(0 0 30px rgba(232,190,90,.75)) !important;
  transform:scale(.985) !important;
}
/* never draw a focus box on the brand link (mouse, keyboard, or otherwise) */
.header-logo a:focus,
.header-logo a:focus-visible,
.header-logo a:active{ outline:none !important; box-shadow:none !important; }

/* nav links row (desktop only - on mobile the theme's hamburger slideToggle owns display) */
@media (min-width:769px){
  #header-nav-wrap{ height:100% !important; display:flex !important; align-items:center !important; justify-content:flex-end !important; }
  #header-nav-wrap .header-main-nav{ display:flex !important; align-items:center !important; gap:6px !important; margin:0 22px 0 0 !important; float:none !important; }
}
#header-nav-wrap .header-main-nav li{ margin:0 !important; float:none !important; }
#header-nav-wrap .header-main-nav li a,
#header-nav-wrap .header-main-nav li a:visited{
  position:relative; display:block; padding:10px 16px !important;
  font-family:'Inter',sans-serif !important; font-weight:600 !important;
  font-size:13px !important; letter-spacing:.14em !important; text-transform:uppercase !important;
  color:#c3bcd2 !important; border:0 !important; background:none !important; transition:color .2s ease;
}
#header-nav-wrap .header-main-nav li a::after{
  content:""; position:absolute; left:16px; right:16px; top:calc(50% + 10px); bottom:auto; height:2px; border-radius:2px;
  background:linear-gradient(90deg,var(--sr-gold),var(--sr-violet)); transform:scaleX(0); transform-origin:center; transition:transform .28s cubic-bezier(.2,.7,.2,1);
}
#header-nav-wrap .header-main-nav li a:hover{ color:var(--sr-gold-soft) !important; }
#header-nav-wrap .header-main-nav li a:hover::after{ transform:scaleX(1); }
/* no focus box on mouse click; keep a subtle gold ring only for keyboard nav */
#header-nav-wrap .header-main-nav li a:focus{ outline:none; }
#header-nav-wrap .header-main-nav li a:focus:not(:focus-visible){ outline:none; box-shadow:none; }
#header-nav-wrap .header-main-nav li a:focus-visible{ outline:2px solid var(--sr-gold); outline-offset:4px; border-radius:5px; }
#header-nav-wrap .header-main-nav li.current a,
#header-nav-wrap .header-main-nav li a.sr-active{ color:var(--sr-gold) !important; }
#header-nav-wrap .header-main-nav li.current a::after,
#header-nav-wrap .header-main-nav li a.sr-active::after{ transform:scaleX(1); }

/* live server-status pill in the nav */
.sr-status{ display:inline-flex; align-items:center; gap:8px; margin-right:16px; padding:0 15px; height:38px;
  border-radius:999px; background:rgba(255,255,255,.04); border:1px solid rgba(232,190,90,.16);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  font-family:'Inter',sans-serif; font-size:12.5px; font-weight:600; color:#c3bcd2; white-space:nowrap; }
.sr-status b{ color:#f3e4bd; font-weight:800; font-variant-numeric:tabular-nums; }
.sr-status .sr-status-dot{ width:8px; height:8px; border-radius:50%; background:#46d17f; box-shadow:0 0 0 0 rgba(70,209,127,.6); animation:srPulse 2.2s infinite; }
.sr-status.down{ color:#e6b3af; }
.sr-status.down .sr-status-dot{ background:#e0574f; animation:none; }
@keyframes srPulse{ 0%{box-shadow:0 0 0 0 rgba(70,209,127,.55)} 70%{box-shadow:0 0 0 7px rgba(70,209,127,0)} 100%{box-shadow:0 0 0 0 rgba(70,209,127,0)} }
@media (max-width:900px){ .sr-status{ display:none !important; } }

/* Control Panel button */
#header-nav-wrap .cta, #cpDropdown .dropdown-toggle{
  display:inline-flex !important; align-items:center !important; justify-content:center !important; gap:8px !important;
  font-family:'Inter',sans-serif !important; font-weight:700 !important; letter-spacing:.03em !important;
  font-size:13px !important; line-height:1 !important; text-align:center !important;
  padding:0 22px !important; height:40px !important; color:#241a06 !important;
  background:linear-gradient(180deg,#f3d585,#e8be5a 55%,#c99a34) !important;
  border:0 !important; border-radius:11px !important; text-decoration:none !important;
  box-shadow:0 10px 26px -12px rgba(232,190,90,.7) !important;
  transition:transform .18s ease, box-shadow .25s ease !important;
}
#header-nav-wrap .cta:hover, #header-nav-wrap .cta:focus,
#cpDropdown .dropdown-toggle:hover, #cpDropdown .dropdown-toggle:focus{ text-decoration:none !important; }
#header-nav-wrap .cta .caret, #cpDropdown .dropdown-toggle .caret{
  margin:0 !important; border-top-color:#241a06 !important; position:static !important;
}
#header-nav-wrap .cta:hover, #cpDropdown .dropdown-toggle:hover{ transform:translateY(-2px); box-shadow:0 16px 34px -12px rgba(232,190,90,.85) !important; }
#cpDropdown{ margin-left:4px; }
#cpDropdown .dropdown-menu{
  background:rgba(20,16,33,.98) !important; border:1px solid rgba(232,190,90,.2) !important;
  border-radius:13px !important; box-shadow:0 24px 56px -20px rgba(0,0,0,.85) !important;
  padding:8px !important; margin-top:10px !important; min-width:230px !important;
}
#cpDropdown .dropdown-menu li a{
  color:#d7d2e6 !important; font-family:'Inter',sans-serif !important; font-size:13.5px !important;
  font-weight:500 !important; letter-spacing:.02em !important; padding:11px 16px !important; border-radius:8px !important;
}
#cpDropdown .dropdown-menu li a:hover{ background:rgba(232,190,90,.1) !important; color:var(--sr-gold-soft) !important; }
#cpDropdown .dropdown-divider{ background:rgba(255,255,255,.08) !important; margin:6px 8px !important; }

/* ===== redesigned Control Panel account menu ===== */
#cpDropdown .cp-menu{ min-width:372px !important; padding:10px !important; max-height:82vh; overflow-y:auto; }
#cpDropdown .cp-menu::-webkit-scrollbar{ width:8px; }
#cpDropdown .cp-menu::-webkit-scrollbar-thumb{ background:rgba(232,190,90,.25); border-radius:8px; }
/* user header */
#cpDropdown .cp-head{ display:flex !important; align-items:center; gap:12px; padding:6px 10px 13px; margin:2px 2px 6px; border-bottom:1px solid rgba(232,190,90,.14); }
#cpDropdown .cp-avatar{ width:40px; height:40px; flex:0 0 40px; border-radius:12px; display:grid; place-items:center;
  font-family:'Cinzel',serif; font-weight:800; font-size:17px; color:#241a06;
  background:linear-gradient(180deg,#f3d585,#c99a34); box-shadow:0 7px 18px -7px rgba(232,190,90,.65), inset 0 1px 0 rgba(255,255,255,.4); }
#cpDropdown .cp-head-txt{ display:flex; flex-direction:column; line-height:1.25; min-width:0; }
#cpDropdown .cp-head-txt small{ font-size:10.5px; text-transform:uppercase; letter-spacing:.14em; color:var(--sr-dim); }
#cpDropdown .cp-head-txt b{ font-family:'Inter',sans-serif; font-size:14.5px; color:#f3e4bd; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
/* section labels */
#cpDropdown .cp-sec-label{ font-family:'Marcellus',serif; font-size:10.5px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--sr-gold); padding:10px 12px 5px; }
/* items */
#cpDropdown .cp-menu li a.cp-item, #cpDropdown .cp-grid a.cp-item{
  display:flex !important; align-items:center; gap:12px; padding:10px 12px !important; border-radius:10px !important;
  color:#d7d2e6 !important; font-family:'Inter',sans-serif !important; font-size:13.5px !important; font-weight:500 !important;
  letter-spacing:.01em !important; white-space:nowrap; overflow:hidden;
  transition:background .16s ease, color .16s ease !important; }
#cpDropdown .cp-item i{ width:20px; flex:0 0 20px; text-align:center; font-size:14px; color:var(--sr-gold); opacity:.85; transition:transform .16s ease; }
#cpDropdown .cp-item span{ overflow:hidden; text-overflow:ellipsis; }
#cpDropdown .cp-menu li a.cp-item:hover, #cpDropdown .cp-grid a.cp-item:hover{ background:rgba(232,190,90,.1) !important; color:#f3e4bd !important; }
#cpDropdown .cp-item:hover i{ transform:scale(1.14); opacity:1; }
/* staff-tools icon grid */
#cpDropdown .cp-grid{ display:grid !important; grid-template-columns:1fr 1fr; gap:2px; padding:2px 0 4px; }
#cpDropdown .cp-grid a.cp-item{ padding:9px 9px !important; gap:9px; }
#cpDropdown .cp-grid a.cp-item i{ width:18px; flex:0 0 18px; }
/* logout footer */
#cpDropdown .cp-foot{ margin-top:9px; padding-top:9px; border-top:1px solid rgba(232,190,90,.14); }
#cpDropdown .cp-foot .cp-logout{ display:flex !important; align-items:center; justify-content:center; gap:9px;
  padding:11px !important; border-radius:11px !important; color:#ffb3ad !important;
  background:rgba(224,87,79,.1) !important; border:1px solid rgba(224,87,79,.28) !important;
  font-family:'Inter',sans-serif !important; font-weight:700 !important; font-size:13px !important;
  transition:background .18s ease, color .18s ease !important; }
#cpDropdown .cp-foot .cp-logout i{ color:#ffb3ad; font-size:14px; }
#cpDropdown .cp-foot .cp-logout:hover{ background:rgba(224,87,79,.2) !important; color:#ffd6d2 !important; }
#cpDropdown .cp-foot .cp-logout:hover i{ color:#ffd6d2; }
@media (max-width:768px){ #cpDropdown .cp-menu{ min-width:100% !important; } #cpDropdown .cp-grid{ grid-template-columns:1fr; } }

/* hamburger */
.header-menu-toggle{ z-index:920 !important; }
.header-menu-toggle span,
.header-menu-toggle span::before,
.header-menu-toggle span::after{ background:var(--sr-gold) !important; }

@media (max-width:768px){
  .header-logo{ left:18px !important; }
  .header-logo a{ font-size:16px !important; letter-spacing:.1em !important; }
  /* mobile menu: hidden by default (slideToggle sets display), opens as a solid
     full-width dropdown BELOW the header - never overlapping the logo/hero. */
  #header-nav-wrap{ position:absolute !important; top:100% !important; left:0 !important; right:0 !important;
    width:100% !important; height:auto !important; padding:16px 22px 24px !important;
    background:rgba(9,7,15,.99) !important; -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px);
    border-top:1px solid rgba(232,190,90,.16) !important; box-shadow:0 26px 44px -22px rgba(0,0,0,.85) !important; }
  #header-nav-wrap .header-main-nav{ display:block !important; margin:0 0 14px !important; }
  #header-nav-wrap .header-main-nav li{ display:block !important; margin:0 !important; float:none !important;
    border-bottom:1px solid rgba(255,255,255,.05) !important; }
  #header-nav-wrap .header-main-nav li a{ display:block !important; padding:15px 4px !important; letter-spacing:.16em !important; }
  #header-nav-wrap .header-main-nav li a::after{ display:none !important; }
}

/* ===================== FIXED LEFT SOCIAL RAIL ===================== */
.sr-socialbar{ position:fixed; left:18px; top:50%; transform:translateY(-50%); z-index:80;
  display:flex; flex-direction:column; align-items:center; gap:12px; }
.sr-socialbar .sr-sb-line{ width:1px; height:38px; background:linear-gradient(180deg,transparent,rgba(232,190,90,.4),transparent); }
.sr-socialbar .sr-sb{ width:42px; height:42px; display:grid; place-items:center; border-radius:12px;
  background:rgba(20,16,33,.55); border:1px solid rgba(232,190,90,.16); color:#c9c2d6; font-size:17px; text-decoration:none;
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  transition:transform .2s ease, background .2s ease, color .2s ease, border-color .2s ease, box-shadow .2s ease; }
.sr-socialbar .sr-sb:hover{ transform:translateX(4px); color:#fff; }
.sr-socialbar .sr-sb.fb:hover{ background:#1877F2; border-color:#1877F2; box-shadow:0 10px 24px -10px rgba(24,119,242,.75); }
.sr-socialbar .sr-sb.dc:hover{ background:#5865F2; border-color:#5865F2; box-shadow:0 10px 24px -10px rgba(88,101,242,.75); }
.sr-socialbar .sr-sb.ig:hover{ background:linear-gradient(45deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888); border-color:#dc2743; box-shadow:0 10px 24px -10px rgba(220,39,67,.75); }
.sr-socialbar .sr-sb.tw:hover{ background:#1DA1F2; border-color:#1DA1F2; box-shadow:0 10px 24px -10px rgba(29,161,242,.75); }
.sr-socialbar .sr-sb svg{ width:19px; height:19px; fill:currentColor; }
@media (max-width:1200px){ .sr-socialbar{ display:none !important; } }

/* ===================== INTRO / OPENING TRANSITION ===================== */
/* kill the theme's white preloader flash on the dark skin (all pages) */
#preloader{ background:#0b0912 !important; }
.no-js #sr-intro{ display:none !important; }
html.sr-intro-lock, html.sr-intro-lock body{ overflow:hidden !important; }

#sr-intro{ position:fixed; inset:0; z-index:100000; display:flex; flex-direction:column; align-items:center; justify-content:center;
  background:radial-gradient(125% 95% at 50% 46%, #16122b 0%, #0b0912 58%, #050310 100%);
  overflow:hidden; transition:opacity .9s ease, visibility .9s; }
#sr-intro.sr-gone{ opacity:0; visibility:hidden; }

/* wide soft pool of light (no hard edges = no visible box) */
#sr-intro .sr-intro-halo{ position:absolute; left:50%; top:47%; width:min(1150px,155vw); height:min(1150px,155vw);
  transform:translate(-50%,-50%); pointer-events:none;
  background:radial-gradient(circle at 50% 50%, rgba(139,108,255,.20) 0%, rgba(232,190,90,.09) 32%, transparent 58%);
  animation:srIntroGlow 3s ease-in-out infinite; }
@keyframes srIntroGlow{ 0%,100%{ opacity:.6; transform:translate(-50%,-50%) scale(.96);} 50%{ opacity:1; transform:translate(-50%,-50%) scale(1.06);} }

/* angelic feathers drifting down */
#sr-intro .sr-feathers{ position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:1; }
/* feathers shot off the wings: fast launch up-and-out, then gravity yanks them straight down */
#sr-intro .sr-feather{ position:absolute; left:var(--ox,50%); top:var(--oy,44%); will-change:transform;
  animation:srShed var(--d,3.4s) var(--delay,0s) infinite; }
#sr-intro .sr-feather i{ display:block; line-height:0; opacity:var(--o,.8);
  filter:drop-shadow(0 0 8px rgba(232,190,90,.55));
  animation:srFlutter var(--s,3.4s) ease-in-out infinite alternate, srFade var(--d,3.4s) linear var(--delay,0s) infinite; }
#sr-intro .sr-feather svg{ display:block; width:var(--w,22px); height:auto; transform:rotate(var(--r,0deg)); }
/* launched from the wing (ease-out to a quick apex) then falls with gravity (ease-in, accelerating) */
@keyframes srShed{
  0%   { transform:translate(-50%,-50%) rotate(var(--r0,0deg)) scale(.5);
         animation-timing-function:cubic-bezier(.06,.7,.26,1); }
  17%  { transform:translate(calc(-50% + var(--mx,0px)), calc(-50% + var(--my,0px))) rotate(var(--rm,10deg)) scale(1);
         animation-timing-function:cubic-bezier(.5,0,.92,.55); }
  100% { transform:translate(calc(-50% + var(--tx,0px)), calc(-50% + var(--ty,0px))) rotate(var(--rt,22deg)) scale(1); }
}
/* quick fade-in on launch, hold, fade out as it drops away (synced to the shed cycle) */
@keyframes srFade{ 0%{ opacity:0;} 9%{ opacity:var(--o,.8);} 80%{ opacity:var(--o,.8);} 100%{ opacity:0;} }
/* subtle wing-flutter shimmer layered on top of the flight */
@keyframes srFlutter{ 0%{ transform:rotate(-7deg);} 100%{ transform:rotate(7deg);} }

/* logo scales with the viewport (larger on big screens, comfortable on mobile) */
#sr-intro .sr-intro-logo{ position:relative; z-index:2; width:clamp(280px,44vw,680px); height:auto; display:block; margin:0 auto;
  filter:drop-shadow(0 14px 40px rgba(0,0,0,.5)) drop-shadow(0 0 24px rgba(139,108,255,.32));
  animation:srIntroLogo 1.1s cubic-bezier(.22,.61,.36,1) both; }
@keyframes srIntroLogo{ 0%{ opacity:0; transform:scale(.86) translateY(12px);} 60%{ opacity:1;} 100%{ opacity:1; transform:scale(1) translateY(0);} }
#sr-intro .sr-intro-word{ position:relative; z-index:2; margin-top:clamp(18px,2.4vw,30px); font-family:'Marcellus',serif; text-transform:uppercase;
  letter-spacing:.44em; padding-left:.44em; font-size:clamp(12px,1.25vw,16px); color:#cbb978;
  opacity:0; animation:srIntroFade .8s ease .6s both; }
#sr-intro .sr-intro-bar{ position:relative; z-index:2; width:clamp(150px,16vw,240px); height:2px; margin:22px auto 0; border-radius:2px; overflow:hidden;
  background:rgba(232,190,90,.14); opacity:0; animation:srIntroFade .7s ease .72s both; }
#sr-intro .sr-intro-bar span{ display:block; height:100%; width:100%; transform:translateX(-100%);
  background:linear-gradient(90deg,#e8be5a,#8b6cff); animation:srIntroBar 1.7s cubic-bezier(.5,0,.2,1) .74s forwards; }
@keyframes srIntroFade{ from{ opacity:0; transform:translateY(8px);} to{ opacity:.9; transform:none;} }
@keyframes srIntroBar{ to{ transform:translateX(0);} }

/* ===================== INNER PAGE SHELL ===================== */
body.sr-inner{ background:
  radial-gradient(1100px 520px at 82% -8%, rgba(139,108,255,.14), transparent 60%),
  radial-gradient(900px 460px at -5% 4%, rgba(59,91,219,.12), transparent 55%),
  #0b0912 !important; }

.sr-inner-banner{ position:relative; padding:110px 0 26px; overflow:hidden;
  border-bottom:1px solid var(--sr-line);
  background:linear-gradient(180deg, rgba(29,23,48,.55), rgba(11,9,18,0)); }
.sr-inner-banner::before{ content:""; position:absolute; inset:0; z-index:0;
  background:radial-gradient(60% 160% at 50% -40%, rgba(232,190,90,.12), transparent 60%); }
.sr-inner-banner .srnav-inner{ position:relative; z-index:1; max-width:1160px; margin:0 auto; padding:0 24px; }
.sr-page-title{ font-family:'Cinzel',serif; font-weight:800; letter-spacing:.04em;
  font-size:clamp(26px,3.4vw,40px); color:var(--sr-text); margin:0; }
.sr-page-title .g{ color:var(--sr-gold); }
.sr-crumb{ font-family:'Inter',sans-serif; font-size:12.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--sr-gold); margin-bottom:12px; display:inline-block; }

.sr-inner{ padding:40px 0 90px; }
.sr-panel{ max-width:1160px; margin:0 auto; padding:34px 34px; position:relative;
  background:linear-gradient(180deg, rgba(20,16,33,.92), rgba(15,12,25,.94));
  border:1px solid var(--sr-line); border-radius:18px;
  box-shadow:0 30px 70px -34px rgba(0,0,0,.8);
  opacity:0; transform:translateY(16px); animation:srUp .6s cubic-bezier(.2,.7,.2,1) forwards; }
@keyframes srUp{ to{ opacity:1; transform:none; } }

/* headings + text + links inside panels */
.sr-panel h1,.sr-panel h2,.sr-panel h3,.sr-panel h4{ font-family:'Cinzel',serif !important; color:var(--sr-text) !important; letter-spacing:.03em; }
.sr-panel h1{ font-size:26px; } .sr-panel h2{ font-size:23px; margin:0 0 6px; } .sr-panel h3{ font-size:19px; }
.sr-panel p,.sr-panel li,.sr-panel label,.sr-panel td,.sr-panel dd,.sr-panel dt{ color:var(--sr-muted); }
.sr-panel strong{ color:var(--sr-text); }
.sr-panel a{ color:var(--sr-gold); transition:color .2s ease; }
.sr-panel a:hover{ color:var(--sr-gold-soft); }
.sr-panel hr{ border:0; border-top:1px solid var(--sr-line); margin:22px 0; }

/* sub-menu (Menu: Characters / Deaths / ...) */
.sr-panel .sub-menu,.sr-panel .sub-menu-2{ font-family:'Inter',sans-serif; font-size:13px; letter-spacing:.02em;
  padding:0 0 18px; margin:0 0 20px; border-bottom:1px solid var(--sr-line); color:var(--sr-dim); }
.sr-panel .sub-menu a{ color:#c3bcd2; padding:0 2px; }
.sr-panel .sub-menu a:hover,.sr-panel .sub-menu a.current-menu{ color:var(--sr-gold); }

/* tables */
.sr-panel table.horizontal-table,.sr-panel table.vertical-table,.sr-panel table{
  width:100%; border-collapse:separate; border-spacing:0; margin:6px 0 4px;
  background:transparent; border:1px solid var(--sr-line); border-radius:12px; overflow:hidden; }
.sr-panel table th{ background:rgba(232,190,90,.08) !important; color:var(--sr-gold-soft) !important;
  font-family:'Inter',sans-serif; font-weight:700; font-size:11.5px; letter-spacing:.1em; text-transform:uppercase;
  text-align:left; padding:13px 14px; border:0 !important; border-bottom:1px solid var(--sr-line) !important; }
.sr-panel table td{ padding:12px 14px; font-size:13.5px; color:var(--sr-muted) !important;
  border:0 !important; border-bottom:1px solid rgba(255,255,255,.05) !important; background:transparent !important; }
.sr-panel table tr:last-child td{ border-bottom:0 !important; }
.sr-panel table.horizontal-table tbody tr:hover td{ background:rgba(139,108,255,.06) !important; }
.sr-panel table .top-ranked td,.sr-panel table tr.top-ranked td{
  background:linear-gradient(90deg, rgba(232,190,90,.14), rgba(232,190,90,.05)) !important; color:var(--sr-text) !important; font-weight:600; }
.sr-panel table .not-applicable,.sr-panel .not-applicable{ color:var(--sr-dim) !important; font-style:italic; }
.sr-panel table td a,.sr-panel table th a{ color:var(--sr-gold); }
.sr-panel .empty-row td{ color:var(--sr-dim) !important; }

/* forms / inputs / selects / buttons */
.sr-panel input[type=text],.sr-panel input[type=password],.sr-panel input[type=email],
.sr-panel input[type=number],.sr-panel input[type=file],.sr-panel textarea,.sr-panel select{
  background:#0f0c1a !important; color:var(--sr-text) !important;
  border:1px solid rgba(232,190,90,.22) !important; border-radius:9px !important;
  padding:10px 12px !important; font-family:'Inter',sans-serif !important; font-size:14px !important; outline:none; }
.sr-panel input:focus,.sr-panel textarea:focus,.sr-panel select:focus{ border-color:var(--sr-gold) !important; box-shadow:0 0 0 3px rgba(232,190,90,.12) !important; }
/* the theme gives every form control a 3rem bottom margin, which misaligns
   inputs inside flex rows (share-link row) and double-spaces stacked fields.
   zero it and let the field wrapper own the vertical rhythm. */
.sr-panel input:not([type=submit]):not([type=button]):not([type=reset]),
.sr-panel select,.sr-panel textarea{ margin-top:0 !important; margin-bottom:0 !important; }
.sr-panel .form-group{ margin-bottom:18px; }
/* Neutralize the theme's fixed button height/line-height/margin (main.css sets
   height:5.4rem and margin:0 .3rem 1.2rem 0) so custom addon buttons size to
   their own padding and don't get shoved out of vertical alignment in flex rows. */
.sr-panel button{ height:auto !important; min-height:0 !important; line-height:1.15 !important; margin:0 !important; }
/* FluxCP form buttons only (.button / input) - NOT bare <button>, so custom
   addon buttons (Copy Link, toggles, etc.) keep their own compact styling. */
.sr-panel input[type=submit],.sr-panel input[type=button],
.sr-panel .button,.sr-panel .button-action{
  display:inline-flex !important; align-items:center !important; justify-content:center !important; white-space:nowrap;
  font-family:'Inter',sans-serif !important; font-weight:700 !important; font-size:14px !important; letter-spacing:.02em !important;
  height:auto !important; min-height:0 !important; line-height:1.1 !important; text-align:center !important; text-shadow:none !important;
  color:#241a06 !important; background:linear-gradient(180deg,#f3d585,#e8be5a 55%,#c99a34) !important;
  border:0 !important; border-radius:11px !important; padding:13px 22px !important; margin:0 !important; cursor:pointer;
  box-shadow:0 12px 26px -12px rgba(232,190,90,.6) !important; transition:transform .18s ease, box-shadow .25s ease !important; }
.sr-panel .button strong,.sr-panel input[type=submit] strong{ color:#241a06 !important; font-weight:700 !important; }
.sr-panel input[type=button]{ background:linear-gradient(180deg,#2a2340,#1d1730) !important; color:var(--sr-text) !important; border:1px solid var(--sr-line) !important; }
.sr-panel input[type=submit]:hover,.sr-panel .button:hover{ transform:translateY(-2px); }
.sr-panel .search-form2,.sr-panel form.search-form{ margin-bottom:18px; }

/* account forms (register / login / reset password / resend) - dark themed card */
.sr-panel form.generic-form{ background:linear-gradient(180deg,#171226,#120f1e) !important; border:1px solid rgba(232,190,90,.15) !important;
  border-radius:16px !important; padding:30px 28px !important; box-shadow:0 28px 58px -34px rgba(0,0,0,.75) !important; color:var(--sr-text) !important; }
.sr-panel form.generic-form .form-group{ margin-bottom:18px; }
.sr-panel form.generic-form label{ display:block !important; font-family:'Marcellus',serif !important; font-size:11px !important; font-weight:400 !important;
  color:#8a7f9c !important; text-transform:uppercase !important; letter-spacing:.16em !important; margin-bottom:9px !important; }
.sr-panel form.generic-form a{ color:var(--sr-gold-soft) !important; text-decoration:none; }
.sr-panel form.generic-form a:hover{ color:#fff5db !important; }
.sr-panel form.generic-form .form-control{ background:rgba(10,8,16,.72) !important; }
.sr-panel form.generic-form button.button-primary{ margin-top:6px; }

/* messages / notices / pagination */
.sr-panel .message,.sr-panel .notice,.sr-panel .error,.sr-panel .success{
  border-radius:10px; padding:13px 16px; font-size:13.5px; margin-bottom:18px; border:1px solid var(--sr-line); }
.sr-panel .message,.sr-panel .notice{ background:rgba(59,91,219,.12); color:#cdd7ff; border-color:rgba(88,101,242,.3); }
.sr-panel .error{ background:rgba(224,87,79,.12); color:#ffcdc9; border-color:rgba(224,87,79,.35); }
.sr-panel .success{ background:rgba(70,209,127,.12); color:#c9f6dd; border-color:rgba(70,209,127,.32); }
.sr-panel .pagination{ margin-top:20px; }
.sr-panel .pagination a,.sr-panel .pagination span{
  display:inline-block; padding:8px 13px; margin:0 3px; border-radius:8px; font-size:13px;
  border:1px solid var(--sr-line); color:var(--sr-muted); background:rgba(255,255,255,.02); }
.sr-panel .pagination a:hover{ border-color:var(--sr-gold); color:var(--sr-gold); }
.sr-panel .pagination .current,.sr-panel .pagination strong{ background:linear-gradient(180deg,#f3d585,#c99a34); color:#241a06; border:0; }

/* scroll reveal utility (site-wide) */
.sr-rv{ opacity:0; transform:translateY(22px); transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); }
.sr-rv.in{ opacity:1; transform:none; }

@media (prefers-reduced-motion:reduce){
  .sr-panel{ animation:none; opacity:1; transform:none; }
  .sr-rv{ opacity:1; transform:none; }
}
@media (max-width:700px){
  .sr-panel{ padding:22px 16px; border-radius:14px; }
  .sr-inner{ padding:26px 0 60px; }
  .sr-panel table{ display:block; overflow-x:auto; white-space:nowrap; }
}

/* ===================== RANKINGS (PvP / WoE / Castles) ===================== */
.rank-wrap{ font-family:'Inter',sans-serif; color:var(--sr-text); transition:opacity .16s ease; }
.rank-wrap.rank-loading{ opacity:0; }
.rank-lead{ color:var(--sr-muted); font-size:14.5px; line-height:1.7; margin:2px 0 22px; max-width:760px; }
.rank-lead b{ color:var(--sr-gold-soft); font-weight:600; }

/* tab bar linking the three ranking pages */
.rank-tabs{ display:flex; flex-wrap:wrap; gap:8px; margin:0 0 26px; padding:6px; border-radius:14px;
  background:rgba(255,255,255,.03); border:1px solid var(--sr-line); }
.rank-tabs a{ flex:1 1 auto; min-width:150px; text-align:center; text-decoration:none; padding:12px 16px; border-radius:10px;
  font-family:'Marcellus',serif; letter-spacing:.06em; font-size:14px; color:var(--sr-muted);
  transition:background .2s ease, color .2s ease, box-shadow .2s ease; }
.rank-tabs a i{ margin-right:8px; opacity:.85; }
.rank-tabs a:hover{ color:var(--sr-gold-soft); background:rgba(232,190,90,.07); }
.rank-tabs a.on{ color:#241a06; background:linear-gradient(180deg,var(--sr-gold-soft),var(--sr-gold2));
  box-shadow:0 10px 24px -12px rgba(232,190,90,.7); }

/* All-Time / This Week toggle (PvP board) */
.rank-toggle{ display:inline-flex; gap:4px; margin:0 0 20px; padding:4px; border-radius:11px;
  background:rgba(255,255,255,.03); border:1px solid var(--sr-line); }
.rank-toggle a{ text-decoration:none; padding:8px 20px; border-radius:8px; font-size:13px; font-family:'Inter',sans-serif;
  font-weight:600; letter-spacing:.01em; color:var(--sr-muted); transition:background .2s ease, color .2s ease; }
.rank-toggle a:hover{ color:var(--sr-gold-soft); }
.rank-toggle a.on{ color:#241a06; background:linear-gradient(180deg,var(--sr-gold-soft),var(--sr-gold2)); }

/* PvP board: sliding-indicator toggle + smooth (client-side) period swap */
.rank-toggle-slide{ position:relative; gap:0; }
.rank-toggle-slide .rtg-ind{ position:absolute; top:4px; left:4px; width:calc(50% - 4px); height:calc(100% - 8px);
  border-radius:8px; background:linear-gradient(180deg,var(--sr-gold-soft),var(--sr-gold2));
  box-shadow:0 6px 16px -9px rgba(232,190,90,.7); transition:transform .3s cubic-bezier(.34,1.15,.42,1); }
.rank-wrap[data-period="week"] .rtg-ind{ transform:translateX(100%); }
/* !important needed: .sr-panel button (form-button styling) would otherwise paint these gold */
.rank-toggle-slide .rtg-btn{ position:relative; z-index:1; flex:1 1 0; min-width:118px; box-sizing:border-box;
  -webkit-appearance:none; appearance:none; border:0 !important; margin:0; cursor:pointer;
  background:transparent !important; box-shadow:none !important;
  font-family:'Inter',sans-serif; font-weight:600 !important; font-size:13px !important; line-height:1; letter-spacing:.01em;
  padding:9px 20px !important; border-radius:8px !important; text-align:center; color:var(--sr-muted) !important; transition:color .25s ease !important; }
.rank-toggle-slide .rtg-btn:hover{ color:var(--sr-gold-soft) !important; transform:none !important; }
.rank-wrap[data-period="all"] .rtg-btn[data-period="all"],
.rank-wrap[data-period="week"] .rtg-btn[data-period="week"]{ color:#241a06 !important; }
.rp-bodies{ transition:opacity .18s ease; }
.rp-bodies.rp-fading{ opacity:0; }
.rank-wrap[data-period="all"] .rp-body.week{ display:none; }
.rank-wrap[data-period="week"] .rp-body.all{ display:none; }

.rank-section-h{ display:flex; align-items:center; gap:12px; margin:34px 0 16px; }
.rank-section-h:first-child{ margin-top:6px; }
.rank-section-h h2{ font-family:'Cinzel',serif; font-weight:700; font-size:20px; letter-spacing:.03em; color:var(--sr-text); margin:0; }
.rank-section-h .ln{ flex:1; height:1px; background:linear-gradient(90deg,var(--sr-line),transparent); }
.rank-section-h .sub{ font-size:12.5px; color:var(--sr-dim); font-family:'Inter'; }

/* podium (top 3) */
.rank-podium{ display:grid; grid-template-columns:1fr 1.15fr 1fr; gap:14px; align-items:end; margin:8px 0 30px; }
.pod{ position:relative; border-radius:16px; padding:22px 14px 18px; text-align:center;
  background:linear-gradient(180deg,var(--sr-elev),var(--sr-surf)); border:1px solid var(--sr-line); }
.pod .medal{ position:absolute; top:-14px; left:50%; transform:translateX(-50%); width:30px; height:30px; border-radius:50%;
  display:grid; place-items:center; font-weight:800; font-size:13px; color:#241a06; box-shadow:0 6px 16px -6px rgba(0,0,0,.6); font-family:'Inter'; }
.pod.p1{ transform:translateY(-14px); border-color:rgba(232,190,90,.45);
  background:linear-gradient(180deg,rgba(232,190,90,.16),var(--sr-surf)); box-shadow:0 24px 48px -26px rgba(232,190,90,.6); }
.pod.p1 .medal{ background:linear-gradient(180deg,#ffe9a8,#e8be5a); }
.pod.p2 .medal{ background:linear-gradient(180deg,#eef1f6,#c3cbd6); }
.pod.p3 .medal{ background:linear-gradient(180deg,#f3c99a,#cd8a4e); }
.pod.p1{ box-shadow:0 24px 48px -26px rgba(232,190,90,.6); }
.pod .av{ width:60px; height:60px; margin:6px auto 12px; border-radius:14px; display:grid; place-items:center;
  font-family:'Cinzel'; font-weight:700; font-size:24px; color:var(--sr-gold-soft);
  background:radial-gradient(circle at 50% 30%, rgba(139,108,255,.25), rgba(20,16,33,.9)); border:1px solid var(--sr-line); overflow:hidden; }
.pod.p1 .av{ width:72px; height:72px; font-size:28px; }
.pod .av img{ width:100%; height:100%; object-fit:contain; image-rendering:auto; }
.pod .nm{ font-family:'Cinzel',serif; font-weight:600; font-size:16px; color:var(--sr-text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pod.p1 .nm{ font-size:18px; color:var(--sr-gold-soft); }
.pod .gd{ font-size:12px; color:var(--sr-dim); margin-top:3px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pod .mv{ margin-top:12px; font-family:'Cinzel'; font-weight:800; font-size:22px;
  background:linear-gradient(180deg,#fff3d1,var(--sr-gold) 60%,var(--sr-gold2)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.pod .mvl{ font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--sr-dim); margin-top:2px; }
.pod .sm{ margin-top:8px; font-size:11.5px; color:var(--sr-muted); }
.pod .sm b{ color:var(--sr-text); }

/* leaderboard table */
.rank-table{ width:100%; border-collapse:separate; border-spacing:0 6px; }
.rank-table th{ text-align:left; font-family:'Marcellus',serif; font-weight:400; letter-spacing:.05em;
  font-size:11.5px; text-transform:uppercase; color:var(--sr-dim); padding:0 14px 6px; }
.rank-table th.r,.rank-table td.r{ text-align:right; }
.rank-table th.c,.rank-table td.c{ text-align:center; }
.rank-table td{ padding:13px 14px; background:rgba(255,255,255,.022); border-top:1px solid var(--sr-line);
  border-bottom:1px solid var(--sr-line); vertical-align:middle; }
.rank-table td:first-child{ border-left:1px solid var(--sr-line); border-radius:11px 0 0 11px; }
.rank-table td:last-child{ border-right:1px solid var(--sr-line); border-radius:0 11px 11px 0; }
.rank-table tbody tr:hover td{ background:rgba(139,108,255,.07); border-color:var(--sr-line2); }
.rank-table tbody tr.top td{ background:rgba(232,190,90,.06); }
.rk{ display:inline-grid; place-items:center; width:30px; height:30px; border-radius:9px; font-weight:800; font-size:13px;
  font-family:'Inter'; color:var(--sr-muted); background:rgba(255,255,255,.04); border:1px solid var(--sr-line); }
.rk.g1{ color:#241a06; background:linear-gradient(180deg,#ffe9a8,#e8be5a); border:0; }
.rk.g2{ color:#20242c; background:linear-gradient(180deg,#eef1f6,#c3cbd6); border:0; }
.rk.g3{ color:#2a1608; background:linear-gradient(180deg,#f3c99a,#cd8a4e); border:0; }
.rank-name{ display:flex; align-items:center; gap:11px; }
.rank-name .em{ width:30px; height:30px; border-radius:8px; object-fit:contain; background:rgba(20,16,33,.7); border:1px solid var(--sr-line); flex:none; }
.rank-name .pnm{ font-weight:600; font-size:14.5px; color:var(--sr-text); }
.rank-name .pnm a{ color:var(--sr-text); text-decoration:none; }
.rank-name .pnm a:hover{ color:var(--sr-gold-soft); }
.rank-name .psub{ font-size:11.5px; color:var(--sr-dim); }
.rank-metric{ font-family:'Cinzel'; font-weight:700; font-size:16px; color:var(--sr-gold-soft); }
.rank-num{ font-weight:600; color:var(--sr-text); }
.rank-num.dim{ color:var(--sr-muted); font-weight:500; }
.kd-pos{ color:var(--sr-online,#46d17f); font-weight:600; }
.pill{ display:inline-block; padding:3px 9px; border-radius:999px; font-size:11px; font-weight:600; letter-spacing:.02em;
  border:1px solid var(--sr-line); color:var(--sr-muted); }
.pill.brk{ color:#ffd9a1; border-color:rgba(232,190,90,.35); background:rgba(232,190,90,.08); }
.pill.se{ color:#cdd7ff; border-color:rgba(88,101,242,.35); background:rgba(59,91,219,.12); }
.pill.fe{ color:#c9f6dd; border-color:rgba(70,209,127,.32); background:rgba(70,209,127,.1); }

/* two-column layout (woe players + guilds/results) */
.rank-cols{ display:grid; grid-template-columns:1.5fr 1fr; gap:26px; align-items:start; }

/* recent WoE results list */
.woe-hist{ display:flex; flex-direction:column; gap:9px; }
.woe-row{ display:flex; align-items:center; gap:12px; padding:12px 14px; border-radius:12px;
  background:rgba(255,255,255,.022); border:1px solid var(--sr-line); }
.woe-row .em{ width:34px; height:34px; border-radius:8px; object-fit:contain; background:rgba(20,16,33,.7); border:1px solid var(--sr-line); flex:none; }
.woe-row .wr-main{ flex:1; min-width:0; }
.woe-row .wr-cas{ font-family:'Cinzel'; font-weight:600; font-size:14px; color:var(--sr-text); }
.woe-row .wr-win{ font-size:12px; color:var(--sr-muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.woe-row .wr-win b{ color:var(--sr-gold-soft); font-weight:600; }
.woe-row .wr-meta{ text-align:right; font-size:11px; color:var(--sr-dim); flex:none; }

/* castle grid */
.castle-realm{ margin-top:30px; }
.castle-realm:first-child{ margin-top:8px; }
.castle-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(232px,1fr)); gap:14px; }
.castle-card{ position:relative; border-radius:14px; padding:16px; overflow:hidden;
  background:linear-gradient(180deg,var(--sr-elev),var(--sr-surf)); border:1px solid var(--sr-line);
  transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.castle-card:hover{ transform:translateY(-3px); border-color:var(--sr-line2); box-shadow:0 18px 36px -22px rgba(139,108,255,.5); }
.castle-card.held{ border-color:rgba(232,190,90,.4); }
.castle-card .cc-top{ display:flex; align-items:center; gap:11px; margin-bottom:12px; }
.castle-card .cc-em{ width:42px; height:42px; border-radius:10px; object-fit:contain; background:rgba(20,16,33,.8); border:1px solid var(--sr-line); flex:none; }
.castle-card .cc-emx{ width:42px; height:42px; border-radius:10px; display:grid; place-items:center; flex:none;
  background:rgba(20,16,33,.6); border:1px dashed var(--sr-line); color:var(--sr-dim); font-size:16px; }
.castle-card .cc-name{ font-family:'Cinzel'; font-weight:700; font-size:15px; color:var(--sr-text); line-height:1.2; }
.castle-card .cc-map{ font-size:11px; color:var(--sr-dim); font-family:'Inter'; margin-top:2px; }
.castle-card .cc-owner{ font-size:12.5px; color:var(--sr-muted); margin-bottom:2px; }
.castle-card .cc-owner b{ color:var(--sr-gold-soft); font-weight:600; }
.castle-card .cc-badge{ position:absolute; top:13px; right:13px; font-size:9.5px; letter-spacing:.14em; text-transform:uppercase;
  padding:4px 8px; border-radius:999px; font-weight:700; }
.castle-card .cc-badge.h{ color:#241a06; background:linear-gradient(180deg,#ffe9a8,#e8be5a); }
.castle-card .cc-badge.v{ color:var(--sr-dim); background:rgba(255,255,255,.05); border:1px solid var(--sr-line); }
.castle-card .cc-stats{ display:flex; gap:16px; margin-top:12px; padding-top:12px; border-top:1px solid var(--sr-line); }
.castle-card .cc-st{ flex:1; }
.castle-card .cc-st .l{ font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--sr-dim); }
.castle-card .cc-st .bar{ height:5px; border-radius:3px; background:rgba(255,255,255,.06); margin-top:5px; overflow:hidden; }
.castle-card .cc-st .bar i{ display:block; height:100%; border-radius:3px; }
.castle-card .cc-st.e .bar i{ background:linear-gradient(90deg,var(--sr-gold),var(--sr-gold-soft)); }
.castle-card .cc-st.d .bar i{ background:linear-gradient(90deg,var(--sr-royal),var(--sr-violet)); }
.castle-card .cc-st .v{ font-size:11px; color:var(--sr-muted); margin-top:4px; font-weight:600; }

.rank-empty{ text-align:center; padding:40px 20px; color:var(--sr-dim); font-size:14px; }
.rank-empty i{ display:block; font-size:34px; color:var(--sr-line); margin-bottom:12px; }

@media (max-width:820px){
  .rank-cols{ grid-template-columns:1fr; }
  .rank-podium{ grid-template-columns:1fr; }
  .pod.p1{ transform:none; order:-1; }
}
@media (max-width:600px){
  .rank-table .hide-sm{ display:none; }
  .rank-tabs a{ min-width:0; font-size:12.5px; padding:10px 8px; }
  .rank-tabs a i{ margin-right:4px; }
}
