body {
  margin: 0px;
  padding:  0px;
  background-color: #051122;
}

img {
	border: none;
}

#ArtworkHelper {
  text-align: center;
  background-position: top center;
  background-attachment: scroll;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  min-width: 1000px;
}

/* helper div */
.HelperDivIndicator {
  position: relative;
  cursor: help;
}
.OptionContainer {
    text-align: center;
}

#HelperDivContainer {
  display: none;
  position: absolute;
  width: 225px;
  z-index: 1000;
  color: #5a2800;
  font-family:
    Verdana,
    Arial,
    Times New Roman,
    sans-serif;
  font-size: 9pt;
  text-align: left;
  padding: 10px;
  border: 1px double #5a2800;
  margin-left: 8px;
}

#HelperDivContainer .HelperDivArrow {
  position: absolute;
  top: -1px;
  left: -8px;
  width: 8px;
  height: 13px;
}

#HelperDivContainer #HelperDivHeadline {
  font-size: 12pt;
  font-weight: bold;
}

#HelperDivContainer #HelperDivHeadline {
  position: relative;
  white-space: normal;
  text-align: center;
  margin-top: 0;
  margin-bottom: 15px;
}

#HelperDivContainer .Ornament {
  width: 220px;
}

#HelperDivContainer #HelperDivText {
  text-align: center;
}

#HelperDivContainer #HelperDivText ul {
  padding-left: 20px;
}

/* container to implement min/max width */
#Bodycontainer {
  text-align: left;
  min-width: 1000px;
  max-width: 1280px;
  width: 100%;
  height: 100%;
  margin: 0px;
  margin-left: auto;
  margin-right: auto;
  padding: 0px;
  display: table;
  width: expression(document.body.clientWidth > 1200? '1200px': '100%');
}
#LoginCreateAccountBox p {
    margin: 0;
    padding: 0;
    font-size: 12pt;
}
#LoginFormButtonCell {
    width: 145px;
    vertical-align: top;
    padding-right: 0;
}

#ContentRow {
  position: relative;
  top: 155px;
}

/* "star-HTML-hack" to correct the position of the content row */
* html #ContentRow {
  display: inline-block;
}

#MenuColumn {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 180px;
  margin-right: 15px;
  margin-left: 15px;
  padding: 0px;
  font-family:  Arial, sans-serif;
  font-size: 10pt;
  font-weight: bold;
  line-height: 12pt;
}

#ContentColumn {
  position: relative;
  margin: 0px;
  margin-left: 205px;
  margin-right: 205px;
}

#ThemeboxesColumn {
  text-align:  center;
  position: absolute;
  top: 0px;
  right: 0px;
  width: 180px;
  margin: 0px;
  margin-right: 15px;
  margin-left: 25px;
}

#Footer {
  font-family:
    Verdana,
    Arial,
    Times New Roman,
    sans-serif;
  font-size: 7pt;
  font-weight: normal;
  text-align: center;
  position: relative;
  width: 100%;
  padding-bottom: 20px;
  color: white;
}
* html #Footer {
  padding-bottom: 120px;
  margin-bottom: 50px;
}

/* Footer linkes */
#Footer a:link {
  color: white;
  text-decoration: none;
}
#Footer a:visited {
  color: white;
  text-decoration: none;
}
#Footer a:focus {
  color: white;
  text-decoration: none;
}
#Footer a:active {
  color: white;
  text-decoration: underline;
}
#Footer a:hover {
  color: white;
  text-decoration: underline;
}

/** -------------------------------
 *  Stylesheet declarations for the
 *  HEADER AREA
 *  -------------------------------
 */

#LeftArtwork {
  position: absolute;
  height: 140px;
  width: 166px;
  top: -140px;
  left: 4px;
  background-repeat: no-repeat;
  z-index:5;
}

#LeftArtwork #TibiaLogoArtworkTop {
  position: absolute;
  top: -17px;
  left: -14px;
  height: 158px;
  width: 196px;
  z-index: 5;
  cursor: pointer;
  border: 0px;
}

#LeftArtwork #TibiaLogoArtworkBottom {
  position: absolute;
  top: 102px;
  left: 0px;
  height: 43px;
  width: 166px;
  z-index: 5;
}

#LeftArtwork #Statue_1{
  position: absolute;
  top: 0px;
  left: 5px;
  height: 30px;
  width: 32px;
  z-index:10;
}

#LeftArtwork #Statue_2 {
  position: absolute;
  top: 0px;
  right: 25px;
  height: 30px;
  width: 32px;
  z-index:10;
}

.SmallMenuBox#DownloadBox {
    top: 4px;
}
.SmallMenuBox {
    position: relative;
    left: 5px;
    top: 8px;
    width: 100%;
    margin-bottom: 38px;
    background-repeat: no-repeat;
}
.SmallMenuBox#DownloadBox {
    top: 4px;
}
.SmallMenuBox .SmallBoxTop {
    position: absolute;
    left: -5px;
    top: -12px;
    height: 12px;
    width: 180px;
    background-repeat: no-repeat;
}
.SmallMenuBox#DownloadBox .SmallBoxBorder {
    height: 39px;
}
.SmallMenuBox .SmallBoxBorder {
    position: absolute;
    top: 0;
    height: 52px;
    width: 8px;
    background-repeat: repeat-y;
    z-index: 10;
}
.SmallMenuBox .SmallBoxButtonContainer {
    position: relative;
	height: 39px;
    width: 160px;
    left: 5px;
    background-repeat: repeat-y;
    z-index: 1;
}
#PlayNowContainer {
    position: absolute;
    width: 150px;
    height: 37px;
    top: 1px;
    left: 5px;
    z-index: 99;
}
.SmallMenuBox .BorderRight {
    right: 9px;
}
.SmallMenuBox#DownloadBox .SmallBoxBottom {
    top: 39px;
}
.SmallMenuBox .SmallBoxBottom {
    position: absolute;
    top: 52px;
    left: -5px;
    height: 12px;
    width: 180px;
    background-repeat: no-repeat;
}

.CaptionContainer .RightArea {
	float: right;
	font-weight: 400;
	margin-right: 5px;
}

.DoNotBreak {
	white-space: nowrap;
}

#LeftArtwork #LogoLink {
  position: absolute;
  bottom: 14px;
  left: 58px;
  height: 14px;
  width: 50px;
  z-index: 99;
  cursor: pointer;
}

#RightArtwork {
  text-align: left;
  position: absolute;
  top: 38px;
  right: 24px;
  width: 132px;
  background-repeat: no-repeat;
  z-index: 90;
}

#RightArtwork #Creature {
  position: absolute;
  height: 64px;
  width: 64px;
  top: -136px;
  left: -15px;
  z-index: 15;
  cursor: pointer;
}

#RightArtwork #Boss {
  position: absolute;
  height: 64px;
  width: 64px;
  top: -136px;
  left: 40px;
  z-index: 15;
  cursor: pointer;
}

#PedestalAndOnline {
  position: absolute;
  left: -15px;
  top: -121px;
  width: 161px;
  height: 85px;
}
#Pedestal {
    position: absolute;
    left: -15px;
    top: -121px;
    width: 161px;
    height: 85px;
}

#RightArtwork #PlayersOnline {
  font-family:
    Verdana,
    Arial,
    Times New Roman,
    sans-serif;
  font-size: 7pt;
  line-height: 8pt;
  text-align: center;
  position: absolute;
  width: 92px;
  bottom: 11px;
  left: 21px;
  color: #cfa600;
  border-bottom: 1px solid #010101;
  cursor: pointer;
}

/** -------------------------------
 *  Stylesheet declarations for the
 *  LOGINBOX
 *  -------------------------------
 */

#Loginbox {
  position: relative;
  left: 5px;
  top: 8px;
  width: 100%;
  margin-bottom: 38px;
  background-repeat: no-repeat;
}

#Loginbox #LoginTop {
  position: absolute;
  left: -5px;
  top: -12px;
  height: 12px;
  width: 180px;
  background-repeat: no-repeat;
}

#Loginbox #LoginBottom {
  position: absolute;
  top: 52px;
  left: -5px;
  height: 12px;
  width: 180px;
  background-repeat: no-repeat;
}

#Loginbox .LoginBorder {
  position: absolute;
  top: 0px;
  height: 52px;
  width: 8px;
  background-repeat: repeat-y;
  z-index: 10;
}

#Loginbox #BorderRight {
  right: 9px;
}

#Loginbox .Loginstatus {
  position: relative;
  top: 0px;
  left: 5px;
  height: 13px;
  width: 160px;
}

#Loginbox .LoginstatusText {
  position: absolute;
  top: 1px;
  left: 18px;
  width: 124px;
  height: 11px;
  cursor: pointer;
}

#Loginbox #LoginstatusText_1 {
  top: 2px;
  cursor: default;
}

#Loginbox #LoginstatusText_2_1 {
  visibility: visible;
}

#Loginbox #LoginstatusText_2_2 {
  visibility: hidden;
}

#LoginBox #LoginButtonContainer {
  margin-left: 5px;
  height: 39px;
  width: 160px;
  background-repeat: repeat-y;
}

#Loginbox #LoginButton {
  position: relative;
  top: 0px;
  left: 5px;
  height: 37px;
  width: 150px;
}

#Loginbox #LoginButton .Button {
  position: relative;
  top: 0px;
  left: 0px;
  width: 150px;
  height: 37px;
  visibility: hidden;
}

#Loginbox #LoginButton #ButtonText {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 37px;
  width: 150px;
  z-index: 15;
  cursor: pointer;
}

/** -------------------------------
 *  Stylesheet declarations for the
 *  MENU
 *  -------------------------------
 */

#Menu {
  position: relative;
  left: 5px;
  background-repeat: no-repeat;
}

#MenuTop {
  position: absolute;
  left: -5px;
  top: -12px;
  height: 12px;
  width: 180px;
  background-repeat: no-repeat;
}

#MenuBottom {
  position: relative;
  left: -5px;
  bottom: 0px;
  height: 12px;
  width: 180px;
  background-repeat: no-repeat;
}

/* Menuitems */

.MenuButton {
  position: relative;
  height: 32px;
  width: 170px;
  display: block;
  cursor: pointer;
}

.Button {
  position: relative;
  height: 32px;
  /*width: 150px;*/
  visibility: hidden;
  display: block;
}

.Extend {
  position: absolute;
  top: 20px;
  right: -2px;
  height: 12px;
  width: 12px;
  background-repeat: no-repeat;
}

.Lights {
  visibility: hidden;
}

.Light_lu {
  position: absolute;
  top: 2px;
  left: 3px;
  height: 2px;
  width: 2px;
  background-repeat: no-repeat;
}

.Light_ru {
  position: absolute;
  top: 2px;
  right: 3px;
  height: 2px;
  width: 2px;
  background-repeat: no-repeat;
}

.Light_ld {
  position: absolute;
  height: 2px;
  width: 2px;
  top: 28px;
  left: 3px;
}

.Icon {
  position: absolute;
  height: 32px;
  width: 32px;
  top: 0px;
  left: 8px;
}

.Label {
  position: absolute;
  height: 22px;
  width: 116px;
  top: 6px;
  left: 42px;
}

/* Submenus(items) */

.LeftChain {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 33px;
  width: 7px;
  background-repeat: repeat-y;
}

.RightChain {
  position: absolute;
  top: 0px;
  right: 0px;
  height: 33px;
  width: 7px;
  background-repeat: repeat-y;
}

.Submenu {
  position: relative;
  margin-left: 0px;
  margin-right: 5px;
  background-color: #0d2e2b;
  width: 170px;
}

.Submenuitem {
  position: relative;
  margin: 0px;
  padding: 0px;
}

.ActiveSubmenuItemIcon {
  position: absolute;
  top: 5px;
  left: 8px;
  width: 10px;
  height: 10px;
  background-repeat: no-repeat;
  visibility: hidden;
}

.SubmenuitemLabel {
  margin: 0px;
  border-top: 0;
  padding-top: 2px;
  padding-bottom: 2px;
  padding-left: 22px;
  border-bottom: 1px solid #4b7874;
  overflow: hidden;
}

/* Submenu links */
.Submenu a:link {
  color: #d7d7d7;
  text-decoration: none;
}
.Submenu a:visited {
  color: #d7d7d7;
  text-decoration: none;
}
.Submenu a:focus {
  color: #d7d7d7;
  text-decoration: none;
}
.Submenu a:active {
  color: white;
  text-decoration: none;
}
.Submenu a:hover {
  color: white;
  text-decoration: none;
}

/** -------------------------------
 *  Stylesheet declarations for the
 *  CONTENT AREA
 *  -------------------------------
 */

.Content .BoxContent {
  padding: 10px;
}

/* "tanhack" for correction of IE bug */
* html .Content {
  top: -5px;
}

.Content {
  position: relative;
  top: 0px;
  width: 100%;
}

/* "star-HTML-hack" to correct the position of the content area */
* html .Content {
  position: relative;
  top: 796px;
  margin: 20px;
  border: 0px dashed #051122;
  border-right-width: 550px;
}

#ContentHelper {
  position: relative;
}

.InfoBar {
  position: relative;
  height: 28px;
  top: 6px;
  margin-left: 5px;
  margin-right: 5px;
  font-size: 10px;
  color: #fff;
  font-family:
    Verdana,
    Arial,
    Times New Roman,
    sans-serif;
}
.InfoBar a {
  border: 0;
}
.InfoBarBlock {
  margin-right: 15px;
  border: 0;
}
.InfoBarBigLogo {
  margin-bottom: 0;
  border: 0;
}
.InfoBarSmallElement {
  margin-left: 5px;
  border: 0;
}
.InfoBarNumbers {
  top: -4px;
  position: relative;
}
.InfoBar a {
  font-family:
    Verdana,
    Arial,
    Times New Roman,
    sans-serif;
  font-size: 7pt;
  font-weight: 400;
  color: #fff;
}
.InfoBar a:link {
  color: #fff;
  font-weight: 400;
  text-decoration: none;
}
.InfoBar a:visited {
  color: #fff;
  font-weight: 400;
  text-decoration: none;
}
.InfoBar a:focus {
  color: #fff;
  font-weight: 400;
  text-decoration: none;
}
.InfoBar a:active {
  color: #fff;
  font-weight: 400;
  text-decoration: underline;
}
.InfoBar a:hover {
	color:#fff !important;
	font-weight:400 !important;
	text-decoration: underline!important;
}
.InfoBarLinks {
	text-decoration: none;
	font-size: 10px;
}
.InfoBarLinks a:hover {
	text-decoration: none;
	font-size: 10px;
}

/* "star-HTML-hack" to to implement min-width in IE */
* html #ContentHelper {
  display: inline-block;
  position: relative;
  top: -800px;
  margin: -20px;
  margin-right: -570px;
}

.Content .Box {
  font-size: 0pt;
  position: relative;
  margin: 5px;
  margin-bottom: 18px;
  color: #5a2800;
  border-left: 2px solid #3a3738;
  border-right: 2px solid #3a3738;
  background-color: #debb9d;
  background-repeat: no-repeat;
  overflow: visible;
}

.Content .BoxContent {
  font-family:
    Verdana,
    Arial,
    Times New Roman,
    sans-serif;
  font-size: 9pt;
  background-color: #fff2db;
  color: #5a2800;
  min-height: 367px;
  height: auto !important;
  height: 387px;
}

/* "star-HTML-hack" to correct Box width in IE */
* html .Content .Box {
  width: 100%;
}
/* "star-HTML-hack" to correct BoxContent width in IE */
* html .Content .BoxContent {
  width: 100%;
}

.Content th {
  font-family:
    Verdana,
    Arial,
    Times New Roman,
    sans-serif;
  font-size: 10pt;
  font-weight: bold;
  text-align: left;
  color: white;
  background-color: #505050;
}

.Content .BoxContent td {
  font-family:
    Verdana,
    Arial,
    Times New Roman,
    sans-serif;
  font-size: 10pt;
  color: #5a2800;
 }

/* Content Links */

.Content a {
  font-family:
    Verdana,
    Arial,
    Times New Roman,
    sans-serif;
  font-weight: bold;
  color: #004294;
  text-decoration: none;
}
.Content a:hover {
  font-family:
    Verdana,
    Arial,
    Times New Roman,
    sans-serif;
  font-weight: bold;
  text-decoration: underline;
  color: #0063dc;
}
.Content .HelpLink {
  font-size: 7pt;
  cursor: pointer;
}

/* Corners */

.Content .Corner-tl {
  position: absolute;
  top: -4px;
  left: -5px;
  width: 17px;
  height: 17px;
  z-index: 50;
}

.Content .Corner-tr {
  position: absolute;
  top: -4px;
  right: -5px;
  width: 17px;
  height: 17px;
  z-index: 50;
}

.Content .BottomCornersHelper {
  position: absolute;
  width: 100%;
}

.Content .CornerWrapper-b {
  position: absolute;
  width:100%;
}

.Content .Corner-bl {
  position: absolute;
  bottom: -4px;
  left: -6px;
  width: 17px;
  height: 17px;
  z-index: 50;
}

.Content .Corner-br {
  position: absolute;
  bottom: -4px;
  right: -6px;
  width: 17px;
  height: 17px;
  z-index: 50;
}

.SecretAchievementIcon {
	position: absolute;
	width: 44px;
	height: 20px;
	margin-left: 12px;
	margin-top: -2px;
	right: 5px;
}

/* Borders */

.Content .Border_1 {
  position: relative;
  height: 6px;
  width: 100%;
  background-repeat: repeat-x;
}

.Content .BorderTitleText {
  position: relative;
  height: 24px;
  background-repeat: repeat-x;
}

.Content .Title {
  position: absolute;
  top: 6px;
  left: 5px;
}

.Content .Border_2 {
  margin: 4px;
  padding: 0px;
  background-color: #793d03;
}

.Content .Border_3 {
  margin: 1px;
  border-top: 1px solid #793d03;
  border-bottom: 1px solid #793d03;
}

/** -------------------------------
 *  Stylesheet declarations for the
 *  THEMEBOXES of the Tibia
 *  website
 *  -------------------------------
 */

.Themebox {
  position: relative;
  margin-bottom: 10px;
  top: -4px;
  width: 180px;
  height: 154px;
}
#Themeboxes div {
  font-size: 10pt;
  background-repeat: no-repeat;
}
#Themeboxes .ThemeboxButton {
  position: absolute;
  bottom: 20px;
  left: 22px;
  height: 25px;
  width: 135px;
  cursor: pointer;
}
#Themeboxes .Bottom {
  position: absolute;
  bottom: 0px;
  left: 0px;
  height: 12px;
  width: 180px;
}
/* "star-HTML-hack" to correct the position of the bottom element */
* html #Themeboxes .Bottom {
  bottom: -3px;
}
#Themeboxes #NewcomerBox .ThemeboxButton {
  bottom: 15px;
}

#PremiumBox {
    position: relative;
    height: 204px;
}
#PremiumBoxDecor {
    margin: 0;
    position: absolute;
    top: -28px;
    left: 5px;
    width: 64px;
    height: 64px;
}
#PremiumBoxBg {
    margin: 0;
    position: absolute;
    top: 34px;
    left: 10px;
    width: 160px;
    height: 126px;
}
#PremiumBoxOverlay {
    margin: 0;
    position: absolute;
    top: 34px;
    left: 10px;
    width: 163px;
    height: 26px;
}
#PremiumBoxOverlayText {
    color: #fff;
    font-family: Verdana, sans-serif;
    margin-top: 3px;
    text-align: center;
    font-size: 11px;
}
#PremiumBoxButtonDecor {
    position: absolute;
    width: 114px;
    height: 26px;
    left: 33px;
    bottom: 34px;
    z-index: 25;
}
#PremiumBoxButton {
    position: absolute;
    bottom: 9px;
    left: 18px;
    text-align: center;
}

#Themeboxes #JobBox {
  height: 164px;
}
#Themeboxes #GalleryBox #GalleryContent {
  position: relative;
  height: 111px;
  width: 170px;
  top: 31px;
  left: 0px;
  margin-left: 5px;
  margin-right: 5px;
  border: 0;
  cursor: pointer;
}
#Themeboxes #CurrentPollBox #CurrentPollText {
  font-family: Verdana, Arial, sans-serif;
  font-weight: bold;
  line-height: 11pt;
  color: #5a2800;
  position: absolute;
  height: 70px;
  width: 150px;
  top: 37px;
  left: 15px;
  padding-top: 5px;
  overflow: hidden;
}
#Themeboxes #SkyscraperBanner {
  border: 0;
}

#Themeboxes #NetworksBox {
  position: relative;
  height: 204px;
}
#Themeboxes #NetworksBox #FacebookBlock {
  position: relative;
  top: 32px;
  height: 113px;
}
#Themeboxes #NetworksBox #FacebookLikeBox {
  position: relative;
  left: 27px;
  top: 3px;
  height: 60px;
  width: 115px;
  overflow: hidden;
}
#Themeboxes #NetworksBox #FacebookLikeBox div {
  position: relative;
  left: -1px;
  top: -1px;
}
#Themeboxes #NetworksBox #FacebookSendBox {
  position: absolute;
  left: 92px;
  top: 14px;
  width: 50px;
}
#Themeboxes #NetworksBox #FacebookLikes {
  position: relative;
  left: 14px;
  top: 10px;
  width: 155px;
  left: 13px;
  overflow: hidden;
}
#Themeboxes #NetworksBox #FacebookLikes div {
  position: relative;
  left: -69px;
}
#Themeboxes #NetworksBox #TwitterBlock {
  position: relative;
  top: 42px;
  text-align: center;
}

/** -------------------------------
 *  OLD Stylesheet declarations for
 *  the CONTENT AREA
 *  -------------------------------
 */

.Content .BoxContent td .white {
  color: #efefef;
  visibility: visible;
}

.Content .BoxContent td .whites {
  color: #efefef;
  visibility: visible;
  font-size: 9pt;
}

.Content .BoxContent .white {
  color: #efefef;
  visibility: visible;
}

.Content .BoxContent td .green {
  color: #00bf00;
}

.Content .BoxContent td .yellow {
  color: #ffbb05;
}

.Content .BoxContent td .red {
  color: #ef0000;
}

.Content .BoxContent td .grey {
  color: #808080;
}

.Content .BoxContent td .orange {
  color: #ff9712;
}

/** -------------------------------
 *  OLD Stylesheet declarations for
 *  the CONTENT AREA (forum)
 *  -------------------------------
 */

.Content .BoxContent .ff_info {
  font-family:
    Verdana,
    Arial,
    Times New Roman,
    sans-serif;
  font-size : 10pt;
  color: #5a2800;
  visibility : visible;
}

.Content .ff_white a {
  color: #ffffff;
}

.Content .BoxContent .ff_white {
  font-family:
    Verdana,
    Arial,
    Times New Roman,
    sans-serif;
  color: #efefef;
  visibility : visible;
  font-size : 7pt;
  font-weight: bold;
}

.Content .BoxContent .ff_red {
  font-family:
    Verdana,
    Arial,
    Times New Roman,
    sans-serif;
  color: #ef0000;
  visibility : visible;
  font-size : 8pt;
  font-weight: bold;
}

.Content .BoxContent .ff_whitelarge {
  font-family:
    Verdana,
    Arial,
    Times New Roman,
    sans-serif;
  color: #efefef;
  visibility : visible;
  font-size : 9pt;
  font-weight: bold;
}

.Content .BoxContent .ff_info {
  font-family:
    Verdana,
    Arial,
    Times New Roman,
    sans-serif;
  font-size : 8pt;
  color: #5a2800;
  visibility : visible;
}

.Content .BoxContent .ff_infotext {
  font-family:
    Verdana,
    Arial,
    Times New Roman,
    sans-serif;
  font-size : 8pt;
  color: #5a2800;
  visibility : visible;
  line-height: 12pt;
}

.Content .BoxContent .ff_smallinfo {
  font-family:
    Verdana,
    Arial,
    Times New Roman,
    sans-serif;
  font-size : 7pt;
  color: #5a2800;
  visibility : visible;
}

.Content .BoxContent .ff_large {
  font-family:
    Verdana,
    Arial,
    Times New Roman,
    sans-serif;
  font-size : 12pt;
  color: #5a2800;
  visibility : visible;
}

.Content .BoxContent .ff_pagetext {
  font-family:
    Verdana,
    Arial,
    Times New Roman,
    sans-serif;
  font-size : 9pt;
  color: #5a2800;
  visibility : visible;
  line-height: 13pt;
}

.Content .BoxContent .ff_pagetextgrey {
  font-family:
    Verdana,
    Arial,
    Times New Roman,
    sans-serif;
  font-size : 9pt;
  color : #505050;
  visibility : visible;
  line-height: 13pt;
}

.Content .BoxContent .ff_pagetextred {
  font-family:
    Verdana,
    Arial,
    Times New Roman,
    sans-serif;
  font-size : 9pt;
  color: #f00;
  visibility : visible;
  line-height: 13pt;
}

.Content .BoxContent .ff_correct {
  font-family:
    Verdana,
    Arial,
    Times New Roman,
    sans-serif;
  font-size : 11pt;
  color: #ff0000;
  visibility : visible;
  font-weight: bold;
}

.FormFieldError {
  font-size: 8pt;
  color: red;
}
.SmallBox {
  position: relative;
  font-size: 1px;
}
.SmallBox .ErrorMessage {
  font-size: 8pt;
  position: relative;
  color: red;
  height: 100%;
  background-color: #d4c0a1;
  padding: 5px;
  padding-left: 43px;
}
.SmallBox .Message {
  font-size: 10pt;
  position: relative;
  height: 100%;
  background-color: #d4c0a1;
  padding: 10px;
}
.SmallBox .ErrorMessage ul {
  padding-left: 15px;
}
.SmallBox .BoxFrameHorizontal {
  position: relative;
  height: 4px;
}
.SmallBox .BoxFrameVerticalRight {
  position: absolute;
  right: 0px;
  top: 0px;
  width: 3px;
  background-repeat: repeat-y;
  height: 100%;
}
.SmallBox .BoxFrameVerticalLeft {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 3px;
  background-repeat: repeat-y;
  height: 100%;
}
.SmallBox .MessageContainer {
  position: relative;
  height: 100%;
}
.SmallBox .BoxFrameEdgeLeftTop {
  position: absolute;
  left: -1px;
  top: -1px;
  width: 5px;
  height: 5px;
}
.SmallBox .BoxFrameEdgeLeftBottom {
  position: absolute;
  left: -1px;
  bottom: -1px;
  width: 5px;
  height: 5px;
}
.SmallBox .BoxFrameEdgeRightTop {
  position: absolute;
  right: -1px;
  top: -1px;
  width: 5px;
  height: 5px;
}
.SmallBox .BoxFrameEdgeRightBottom {
  position: absolute;
  right: -1px;
  bottom: -1px;
  width: 5px;
  height: 5px;
}
.SmallBox .AttentionSign {
  position: absolute;
  top: 3px;
  left: 8px;
  width: 30px;
  height: 26px;
}

/** ----------------
 *  new process bars
 *  ----------------
 */

#ProgressBar #Headline {
  text-align: center;
  font-size: 14pt;
  font-weight: bold;
  margin-bottom: 5px;
}
#ProgressBar #MainContainer {
  position: relative;
  top: 10px;
  height: 50px;
  margin-bottom: 25px;
}
#ProgressBar #BackgroundContainer {
  position: relative;
  width: 100%;
}

#ProgressBar #BackgroundContainerLeftEnd {
  position: absolute;
  float: left;
}
#ProgressBar #BackgroundContainerCenter {
  position: absolute;
  left: 0px;
  top: 0px;
  height: 17px;
  width: 100%;
}
#ProgressBar #BackgroundContainerCenterImage {
  position: relative;
  margin-left: 25px;
  margin-right: 25px;
  height: 17px;
}
#ProgressBar #BackgroundContainerRightEnd {
  position: absolute;
  right: 0px;
  top: 0px;
  float: right;
}
#ProgressBar #TubeLeftEnd {
  position: absolute;
  left: 25px;
  top: 4px;
}
#ProgressBar #TubeRightEnd {
  position: absolute;
  right: 25px;
  top: 4px;
  z-index: 0;
}
#ProgressBar .Steps {
  position: relative;
  height: 39px;
  font-size: 9px;
  float: left;
  top: -11px;
  margin-left: -1px;
}
#ProgressBar #StepsContainer1 {
  text-align: right;
  margin-left: 92px;
  margin-right: 40px;
  height: 10px;
}
#ProgressBar #StepsContainer2 {
  width: 100%;
  height: 10px;
}
#ProgressBar .TubeContainer {
  position: relative;
  padding-right: 47px;
}
#ProgressBar .Tube {
  position: relative;
  top: 16px;
  left: 0px;
  width: 100%;
  height: 7px;
  background: #ffffff none repeat scroll 0%;
}
* html #ProgressBar .Tube {
  top: 13px;
}
#ProgressBar .SingleStepContainer {
  position: absolute;
  top: 0px;
  width: 47px;
  height: 30px;
  right: 0px;
  text-align: center;
}
#ProgressBar #FirstStep .SingleStepContainer {
  left: 45px;
  width: 47px;
  position: absolute;
}
#ProgressBar .StepIcon {
  position: absolute;
  right: 0px;
}
* html #ProgressBar .StepIcon {
  right: -1px;
}
#ProgressBar #FirstStep .StepIcon {
  top: 0px;
  left: 0px;
}
#ProgressBar .StepText {
  top: 40px;
  position: absolute;
  width: 200px;
  right: -77px;
}

/** -------------------------------
 *  Stylesheet declarations for the
 *  NEW TABLES
 *  -------------------------------
 */

.TableContainer {
  border: 1px solid black;
  position: relative;
  width: 100%;
  font-size: 1px;
}
.TableContainer .Odd {
  background-color: #f1e0c6;
}
.TableContainer .Even {
  background-color: #d5c0a1;
}
.Text {
	margin-top: 3px;
	margin-left: 4px;
	margin-bottom: 2px;
	padding: 3px;
	padding-top: 3px;
}

/* TABLEHEADER DECORATION */
.TableContainer .CaptionContainer {
  position: relative;
  font-size: 1pt;
  background-color: #5f4d41 !important;
  height: 100%;
  width: 100%;
  text-align: left;
}
.TableContainer .CaptionContainer .CaptionInnerContainer {
	position: relative;
  background-color: #5f4d41;
  width: 100%;
  height: 100%;
  padding-top: 3px;
  padding-bottom: 4px;
}
.TableContainer .CaptionContainer .Text {
  font-family:
    Verdana,
    Arial,
    Times New Roman,
    sans-serif;
  font-size: 10pt;
  font-weight: bold;
  text-align: left;
  color: white;
  padding-left: 10px;
  padding-top: 0px;
  padding-bottom: 0px;
}
.TableContainer .CaptionContainer .CaptionEdgeLeftTop {
	position: absolute;
  width: 5px;
  height: 5px;
	top: -2px;
  left: -2px;
  z-index: 50;
}
.TableContainer .CaptionContainer .CaptionEdgeRightTop {
	position: absolute;
  width: 5px;
  height: 5px;
	top: -2px;
  right: -2px;
  z-index: 50;
}
.TableContainer .CaptionContainer .CaptionEdgeLeftBottom {
	position: absolute;
  width: 5px;
  height: 5px;
	left: -2px;
	bottom: -3px;
  z-index: 50;
}
.TableContainer .CaptionContainer .CaptionEdgeRightBottom {
	position: absolute;
  width: 5px;
  height: 5px;
	right: -2px;
	bottom: -3px;
  z-index: 50;
}
.TableContainer .CaptionContainer .CaptionBorderTop {
  position: absolute;
  width: 100%;
  height: 4px;
  left: 0px;
  top: -1px;
}
.TableContainer .CaptionContainer .CaptionBorderBottom {
  position: absolute;
  width: 100%;
  height: 4px;
  left: 0px;
  bottom: -2px;
}
.TableContainer .CaptionContainer .CaptionVerticalLeft {
  position: absolute;
  height: 100%;
  width: 3px;
  left: -1px;
  top: 0px;
}
.TableContainer .CaptionContainer .CaptionVerticalRight {
  position: absolute;
  height: 100%;
  width: 3px;
  right: -1px;
  top: 0px;
}
* html .TableContainer .CaptionContainer .CaptionEdgeRightTop {
  right: -3px;
}
* html .TableContainer .CaptionContainer .CaptionEdgeLeftBottom {
  bottom: -4px;
}
* html .TableContainer .CaptionContainer .CaptionEdgeRightBottom {
  right: -3px;
  bottom: -4px;
}
* html .TableContainer .CaptionContainer .CaptionBorderBottom {
  bottom: -3;
}
* html .TableContainer .CaptionContainer .CaptionVerticalRight {
  right: -2px;
}
/* TABLE CONTENT */
.TableContentContainer {
  border: 1px solid #5f4d41;
  position: relative;
  margin-right: 4px;
  height: 100%;
  background-color: #d4c0a1;
  padding: 0px;
}
.TableContent {
  width: 100%;
  border-collapse: collapse;
}
.TableContent td {
  padding-left: 5px;
  padding-top: 2px;
  padding-right: 5px;
  padding-bottom: 2px;
}
/* INNERLYOUT 1 */
.TableContainer .Table1 {
  width: 100%;
  background-color: #d4c0a1;
  border: 2px solid #55636c;
}
.TableContainer .Table1 .InnerTableContainer {
  padding: 5px;
}
/* INNERLYOUT 2 */
.TableContainer .Table2 {
  width: 100%;
  border: 2px solid #55636c;
  background-color: #f1e0c5;
  padding: 0px;
  margin: 0px;
  border-collapse: collapse;
}
.TableContainer .Table2 td {
  padding: 0px;
  margin: 0px;
}
.TableContainer .Table2 .InnerTableContainer {
  margin-top: 1px;
}
.TableContainer .Table2 .InnerTableContainer table {
  border-collapse: collapse;
}
.TableContainer .Table2 .InnerTableContainer td {
  padding-top: 2px;
  padding-left: 5px;
  padding-bottom: 2px;
  padding-right: 5px;
  border: 1px solid #faf0d7;
}
/* INNERLYOUT 3 */
.TableContainer .Table3 {
  width: 100%;
  border: 2px solid #55636c;
  background-color: #f1e0c5;
}
.TableContainer .Table3 .InnerTableContainer {
  width: 100%;
  position: relative;
  margin-top: 5px;
  margin-left: 3px;
}
.TableContainer .Table3 .TableContentAndRightShadow td {
  border: 1px solid #faf0d7;
}
/* INNERLYOUT 4 */
.TableContainer .Table4 {
  width: 100%;
  border: 2px solid #55636c;
  background-color: #f1e0c5;
}
.TableContainer .Table4 .InnerTableContainer {
  width: 100%;
  position: relative;
  margin-top: 3px;
}
.TableContainer .Table4 .TableContentAndRightShadow .TableContent td {
  padding-left: 4px;
  padding-top: 2px;
  padding-bottom: 2px;
}
/* INNERLYOUT 5 */
.TableContainer .Table5 {
  width: 100%;
  border: 2px solid #55636c;
  background-color: #f1e0c5;
}
.TableContainer .Table5 .InnerTableContainer {
  width: 100%;
  position: relative;
  margin-top: 5px;
  margin-left: 3px;
}
.TableContainer .Table5 .TableContentAndRightShadow .TableContent td {
  padding-left: 4px;
  padding-top: 2px;
  padding-bottom: 2px;
}
/* SHADOWS */
.TableShadowContainerRightTop {
  position: relative;
  top: 0px;
  right: 3px;
  margin-right: 0px;
  font-size: 1px;
  float: right;
  z-index: 99;
}
.TableShadowRightTop {
  position: absolute;
  top: 0px;
  right: 0px;
  width: 4px;
  height: 5px;
  z-index: 99;
}
.TableContentAndRightShadow {
  position: relative;
  background-repeat: repeat-y;
  background-position: top right;
  margin-right: 3px;
  font-size: 1px;
  /*box-shadow: 3px 3px 2px #875f3e;*/
}
.TableShadowContainer {
  position: relative;
  margin-right: 5px;
}
.TableBottomShadow {
  position: relative;
  font-size: 1px;
  height: 5px;
  width: 100%;
  padding: 0px;
  margin: 0px;
}
.TableBottomLeftShadow {
  position: relative;
  height: 5px;
  width: 4px;
  float: left;
  padding: 0px;
  margin: 0px;
}
.TableBottomRightShadow {
  position: relative;
  float: right;
  right: -2px;
  top: 0px;
  height: 5px;
  width: 4px;
}
/* HEADLESS CONTENT TABLE */
.HeadlessTable {
  border: 0px;
  border-style: solid;
  border-color: #656565;
  border-top-width: 1px;
  border-top-color: white;
  border-left-width: 1px;
  border-left-color: white;
  border-bottom-width: 1px;
  border-right-width: 1px;
  border-right-color: #656565;
  margin-left: 15px;
}
/* LABELS */
.InnerTableContainer .TableContentContainer {
    box-shadow: 3px 3px 2px #875f3e;
}
.TableContentContainer {
    border: 1px solid #5f4d41;
    position: relative;
    margin-right: 7px;
    margin-bottom: 5px;
    height: 100%;
    background-color: #d4c0a1;
    padding: 0;
}
.TableContainer .Table3 .TableContent td {
    border: 1px solid #faf0d7;
}

.TableContainer .GreedyCell {
    width: 80%;
}
.LabelV80{
	font-weight:700;
	padding-right:10px;
	white-space:nowrap;
	vertical-align:top;
	width:80px;
}
.LabelV100{
	font-weight:700;
	padding-right:10px;
	white-space:nowrap;
	vertical-align:top;
	width:100px;
}
.LabelV120{
	font-weight:700;
	padding-right:10px;
	white-space:nowrap;
	vertical-align:top;
	width:120px;
}
.LabelV150{
	font-weight:700;
	padding-right:10px;
	white-space:nowrap;
	vertical-align:top;
	width:150px;
}
.LabelV175{
	font-weight:700;
	padding-right:10px;
	white-space:nowrap;
	vertical-align:top;
	width:175px;
}
.LabelV200{
	font-weight:700;
	padding-right:10px;
	white-space:nowrap;
	vertical-align:top;
	width:200px;
}
.LabelV250{
	font-weight:700;
	padding-right:10px;
	white-space:nowrap;
	vertical-align:top;
	width:250px;
}

.LabelV {
  font-weight: bold;
  padding-right: 10px;
  white-space: nowrap;
  vertical-align: top;
}
.LabelH {
  font-weight: bold;
  padding-right: 10px;
  white-space: nowrap;
  background-color: #d5c0a1;
}
.LabelH td {
  background-color: #d5c0a1;
  padding-left: 5px;
  padding-top: 2px;
  padding-right: 5px;
  padding-bottom: 2px;
}

/* BUTTONS */
.InnerTableButtonRow {
  width: 100%;
  padding-left: 1px;
  padding-right: 0px;
  padding-bottom: 4px;
  border: 0px;
}
.InnerTableButtonRow td {
  padding-right: 4px;
}
.BigButton {
  position: relative;
  width: 135px;
  height: 25px;
  z-index: 10;
}
.BigButtonOver {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 137px;
  height: 25px;
  visibility: hidden;
  z-index: 15;
}
.ButtonText {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 25px;
  width: 135px;
  z-index: 20;
}
.BigButtonText {
    position: absolute;
    top: 0;
    left: 0;
    width: 135px;
    height: 25px;
    margin: 0;
    padding: 0;
    cursor: pointer;
    background: 0 0;
    border: none;
    text-align: center;
    color: #ffd18c;
  font-family:
    Verdana,
    Arial,
    Times New Roman,
    sans-serif;
    font-size: 12px;
    font-weight: 400;
    z-index: 20;
  text-shadow:
    -1px -1px 0 #000,
    0 -1px 0 #000,
    1px -1px 0 #000,
    1px 0 0 #000,
    1px 1px 0 #000,
    0 1px 0 #000,
    -1px 1px 0 #000,
    -1px 0 0 #000;
}
.BigButtonText:hover{
	top:1px;
	left:1px;
}
.TopButtonContainer {
  position: relative;
  right: 4px;
  top: 4px;
  z-index: 60;
}
* html .TopButtonContainer {
  right: 27px;
}
.TopButtonContainer .TopButton {
  position: absolute;
  right: 0;
  z-index: 55;
  cursor: pointer;
}

.Content .BoxContent .Odd {
  background-color: #d4c0a1;
  padding: 2px;
}

.Content .BoxContent .Even {
  background-color: #f1e0c6;
  padding: 2px;
}

.Content .NewsCategoryIconSmall {
  position: absolute;
  top: 1px;
  left: 1px;
  height: 16px;
  width: 16px;
  background-repeat: no-repeat;
}

/* News Ticker */

.Content #NewsTicker .BoxContent {
  padding: 5px;
  min-height: 90px;
  height: auto !important;
  height: 100px;
}

.Content #NewsTicker .BoxContent .Row {
  position: relative;
  width: 100%;
}

.Content #NewsTicker .NewsTickerIcon {
  position: absolute;
  top: 1px;
  left: 1px;
  height: 16px;
  width: 16px;
  background-repeat: no-repeat;
}

.Content #NewsTicker .NewsTickerText {
  font-size: 9pt;
  position: relative;
  margin-left: 20px;
}

.Content #NewsTicker .NewsTickerDate {
  font-size: 7pt;
  position: absolute;
  top: 0px;
  float: left;
}

.Content #NewsTicker .NewsTickerShortText {
  margin-left: 85px;
  height: 14px;
}

.Content #NewsTicker .NewsTickerFullText {
  margin-left: 85px;
  margin-right: 20px;
  display: none;
}

.Content #NewsTicker .NewsTickerExtend {
  position: relative;
  right: 0px;
  top: 1px;
  right: 1px;
  height: 12px;
  width: 12px;
  background-repeat: no-repeat;
  float: right;
  cursor: pointer;
  z-index: 10;
}

/* Featured Article */

.Content #FeaturedArticle .BoxContent {
  position:relative;
  height: 100px;
  padding: 5px;
  padding-left: 10px;
  min-height: 100px;
  height: auto !important;
  height: 110px;
  line-height: 10.5pt;
}
.Content #FeaturedArticle .NewsHeadline {
  margin-top: 5px;
}

.Content #FeaturedArticle #TeaserThumbnail {
  position: relative;
  top: 0px;
  right: 0px;
  height: 100px;
  width: 150px;
  margin-left: 10px;
  background-color: black;
  z-index: 90;
  float: right;
}

#ContentHelper #FeaturedArticle:first-child .BoxContent {
  padding: 10px;
}

.Content #FeaturedArticle #TeaserText {
  height: 100px;
  overflow: hidden;
  z-index: 0;
}

.Content #FeaturedArticle #Link {
  position: absolute;
  top: 0px;
  right: 0px;
  margin: 89 165 0 0;
  z-index: 99;
}

.Content #FeaturedArticle .NewsHeadlineBackground {
  position: relative;
  height: 28px;
  margin-bottom: 5px;
  background-repeat: repeat-x;
  border-left: 1px solid #000000;
  border-right: 1px solid #000000;
}

.Content #FeaturedArticle .NewsHeadlineIcon {
  position: absolute;
  top: -1px;
  left: 0px;
  margin-left: 5px;
  margin-right: 5px;
  float:left;
}

.Content #FeaturedArticle .NewsHeadlineDate {
  font-size: 7pt;
  position: absolute;
  top: 9px;
  left: 50px;
  width: 85px;
  color: white;
}

.Content #FeaturedArticle .NewsHeadlineText {
  position: relative;
  top: 8px;
  left: 135px;
  font-size: 10pt;
  font-weight: bold;
  color: white;
}

/* News */

.Content #News .BoxContent {
  min-height: 100px;
  height: auto !important;
  height: 110px;
}

.Content #News .NewsHeadlineBackground {
  position: relative;
  height: 28px;
  margin-bottom: 5px;
  background-repeat: repeat-x;
  border-left: 1px solid #000000;
  border-right: 1px solid #000000;
}

.Content #News .NewsHeadlineIcon {
  position: absolute;
  top: -1px;
  left: 0px;
  margin-left: 5px;
  margin-right: 5px;
}

.Content #News .NewsHeadlineDate {
  font-size: 7pt;
  position: absolute;
  top: 10px;
  left: 50px;
  width: 85px;
  color: white;
}

.Content #News .NewsHeadlineText {
  position: relative;
  top: 7px;
  left: 135px;
  font-size: 10pt;
  font-weight: bold;
  color: white;
}

/* News Archive */

.Content #NewsArchive .NewsHeadlineBackground {
  position: relative;
  height: 28px;
  margin-bottom: 5px;
  background-repeat: repeat-x;
  border-left: 1px solid #000000;
  border-right: 1px solid #000000;
}

.Content #NewsArchive .NewsHeadlineIcon {
  position: absolute;
  top: -1px;
  left: 0px;
  margin-left: 5px;
  margin-right: 5px;
}

.Content #NewsArchive .NewsHeadlineDate {
  font-size: 7pt;
  position: absolute;
  top: 9px;
  left: 50px;
  width: 85px;
  color: white;
}

.Content #NewsArchive .NewsHeadlineText {
  position: relative;
  top: 7px;
  left: 135px;
  font-size: 10pt;
  font-weight: bold;
  color: white;
}

.Content #News .NewsHeadlineAuthor {
  position: absolute;
  top: 7px;
  right: 10px;
  font-size: 10pt;
  color: white;
}

/* BUTTONS */
.MediumButtonText {
  position: absolute;
  top: 0;
  left: 0;
  height: 37px;
  width: 150px;
  z-index: 20;
}
.MediumButtonBackground {
  position: relative;
  top: 0;
  left: 0;
  width: 150px;
  height: 37px;
  z-index: 10;
}
.MediumButtonOver {
  position: relative;
  top: 0;
  left: 0;
  width: 150px;
  height: 37px;
  visibility: hidden;
  z-index: 15;
}
.MediumButtonForm {
  margin: 0;
  padding: 0;
}

.moduleRow {
}

.moduleRowOver {
  background-color: #d4c0a1;
	cursor: pointer;
	cursor: hand;
}

/* Grimhold Phase 1 visual foundation */
@font-face {
  font-family: "Grimhold Martel";
  src: url("martel.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  --grimhold-void: #090705;
  --grimhold-night: #14100d;
  --grimhold-panel: #21170f;
  --grimhold-panel-soft: #302013;
  --grimhold-bronze: #8a5426;
  --grimhold-bronze-bright: #b97534;
  --grimhold-gold: #d9a441;
  --grimhold-gold-pale: #f0d28a;
  --grimhold-ember: #d46a1f;
  --grimhold-text: #ead6b0;
  --grimhold-muted: #b99b73;
  --grimhold-line: #5b351a;
  --grimhold-shadow: rgba(0, 0, 0, 0.72);
}

html {
  background: var(--grimhold-void);
}

body {
  color: var(--grimhold-text);
  background-color: var(--grimhold-void) !important;
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-rendering: optimizeLegibility;
}

body.grimhold-inner {
  height: auto !important;
  background:
    url("images/branding/Background.png") center top / cover fixed no-repeat !important;
}

/* Suppress the fixed dark-brown gradient overlay on internal pages.
   !important needed: both rules have same !important weight from body::before,
   specificity (0,1,2) wins but we lock it explicitly. */
body.grimhold-inner::before {
  content: none !important;
  display: none !important;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;
  background:
    radial-gradient(circle at 50% 4%, rgba(216, 111, 31, 0.28), transparent 30%),
    radial-gradient(circle at 16% 32%, rgba(187, 113, 43, 0.18), transparent 26%),
    linear-gradient(180deg, rgba(4, 3, 2, 0.08), rgba(6, 4, 3, 0.82) 62%, #050403 100%);
}

/* Ensure the html canvas also shows the background on internal pages,
   preventing the html { background: #090705 } from bleeding around the body. */
html:has(body.grimhold-inner) {
  background:
    url("images/branding/Background.png") center top / cover fixed no-repeat;
}

#ArtworkHelper {
  background-color: rgba(8, 6, 4, 0.42);
  box-shadow: inset 0 120px 120px rgba(0, 0, 0, 0.28), inset 0 -180px 170px rgba(0, 0, 0, 0.62);
}

body.grimhold-inner #ArtworkHelper {
  height: auto !important;
  background: rgba(0, 0, 0, 0.20) !important;
  box-shadow: none !important;
}

body.grimhold-inner #Bodycontainer {
  background: transparent !important;
  box-shadow: none !important;
  min-width: 1140px;
  max-width: 1420px;
}

body.grimhold-inner #ThemeboxesColumn {
  width: 320px !important;
  text-align: left !important;
}

body.grimhold-inner #ContentColumn {
  margin-right: 345px !important;
}

#Bodycontainer {
  filter: drop-shadow(0 24px 42px rgba(0, 0, 0, 0.58));
}

#Footer,
#Footer a:link,
#Footer a:visited,
#Footer a:focus {
  color: var(--grimhold-muted);
}

#Footer a:hover,
#Footer a:active {
  color: var(--grimhold-gold-pale);
}

#LeftArtwork #TibiaLogoArtworkTop {
  filter: drop-shadow(0 0 16px rgba(220, 122, 35, 0.56)) drop-shadow(0 8px 18px rgba(0, 0, 0, 0.76));
}

#RightArtwork #PlayersOnline {
  color: var(--grimhold-gold-pale);
  text-shadow: 0 1px 2px #000, 0 0 10px rgba(214, 105, 31, 0.55);
}

#Loginbox,
.SmallMenuBox,
#Menu,
.Themebox {
  filter: drop-shadow(0 8px 16px rgba(0, 0, 0, 0.5));
}

.MenuButton {
  background-color: #24160d;
  box-shadow: inset 0 0 0 1px rgba(225, 154, 65, 0.14), inset 0 -12px 20px rgba(74, 34, 10, 0.42);
}

.MenuButton:hover {
  box-shadow: inset 0 0 0 1px rgba(245, 190, 93, 0.42), inset 0 -12px 22px rgba(150, 72, 22, 0.38), 0 0 14px rgba(212, 106, 31, 0.32);
}

.Icon {
  filter: sepia(0.28) saturate(1.18) brightness(0.95) drop-shadow(0 0 5px rgba(210, 109, 33, 0.4));
}

.Label {
  filter: sepia(0.32) saturate(1.22) brightness(1.04) drop-shadow(0 1px 1px rgba(0, 0, 0, 0.8));
}

.Submenu {
  background: linear-gradient(180deg, #21150d 0%, #140d09 100%) !important;
  box-shadow: inset 0 0 0 1px rgba(185, 117, 47, 0.22), inset 0 0 22px rgba(0, 0, 0, 0.52);
}

.Submenuitem {
  background-color: rgba(28, 18, 11, 0.92) !important;
}

.Submenuitem:hover {
  background: linear-gradient(90deg, rgba(103, 53, 20, 0.96), rgba(36, 21, 12, 0.96)) !important;
}

.SubmenuitemLabel {
  color: var(--grimhold-text) !important;
  border-bottom-color: rgba(174, 105, 39, 0.45);
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  font-size: 12px;
  letter-spacing: 0;
  text-shadow: 0 1px 1px #000;
}

.Submenu a:link,
.Submenu a:visited,
.Submenu a:focus {
  color: var(--grimhold-text);
}

.Submenu a:hover,
.Submenu a:active {
  color: var(--grimhold-gold-pale);
}

.Content .Box {
  color: var(--grimhold-text);
  border-left-color: var(--grimhold-line);
  border-right-color: var(--grimhold-line);
  background: linear-gradient(180deg, #3a2514 0%, #1a100a 100%);
  box-shadow: 0 16px 28px var(--grimhold-shadow), inset 0 0 0 1px rgba(224, 157, 67, 0.2);
}

.Content .BoxContent {
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  font-size: 10pt;
  line-height: 1.45;
  color: var(--grimhold-text);
  background:
    linear-gradient(180deg, rgba(50, 32, 18, 0.97), rgba(25, 16, 11, 0.98)),
    radial-gradient(circle at 50% 0%, rgba(209, 114, 34, 0.18), transparent 46%);
  border: 1px solid rgba(219, 156, 67, 0.28);
}

.Content .BoxContent td,
.Content .BoxContent .ff_info,
.Content .BoxContent .ff_infotext,
.Content .BoxContent .ff_smallinfo,
.Content .BoxContent .ff_large,
.Content .BoxContent .ff_pagetext,
.Content .BoxContent .ff_pagetextgrey {
  color: var(--grimhold-text);
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
}

.Content th,
.TableContainer .CaptionContainer,
.TableContainer .CaptionContainer .CaptionInnerContainer {
  background: linear-gradient(180deg, #6e3e19 0%, #331b0c 100%) !important;
  color: var(--grimhold-gold-pale);
}

.TableContainer .CaptionContainer .Text {
  color: var(--grimhold-gold-pale);
  font-family: "Grimhold Martel", Georgia, "Times New Roman", serif;
  font-size: 11pt;
  letter-spacing: 0;
  text-shadow: 0 2px 2px rgba(0, 0, 0, 0.85);
}

.TableContentContainer,
.TableContainer .Table1,
.TableContainer .Table2,
.SmallBox .Message,
.SmallBox .ErrorMessage {
  background: #24170e;
  border-color: var(--grimhold-line);
  color: var(--grimhold-text);
}

.TableContainer .Odd,
.TableContent tr:nth-child(odd),
tr.Odd {
  background-color: #2f2013 !important;
}

.TableContainer .Even,
.TableContent tr:nth-child(even),
tr.Even {
  background-color: #24170e !important;
}

.TableContent td,
.TableContent th {
  border-color: rgba(175, 105, 41, 0.26) !important;
}

.Content a,
.Content a:link,
.Content a:visited,
.Content .BoxContent a,
.Content .BoxContent a:link,
.Content .BoxContent a:visited {
  color: var(--grimhold-gold);
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-decoration: none;
}

.Content a:hover,
.Content .BoxContent a:hover {
  color: var(--grimhold-gold-pale);
  text-decoration: none;
  text-shadow: 0 0 9px rgba(214, 106, 31, 0.55);
}

.InfoBar {
  color: var(--grimhold-gold-pale);
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-shadow: 0 1px 2px #000;
}

.InfoBar a,
.InfoBar a:link,
.InfoBar a:visited,
.InfoBar a:focus {
  color: var(--grimhold-gold-pale);
}

.InfoBar a:hover {
  color: #fff4c9 !important;
}

#statusbar,
#statusbar table,
#statusbar td,
.collapse {
  background-color: #21150d !important;
  color: var(--grimhold-text);
}

input[type="submit"],
input[type="button"],
button,
.ButtonText,
.BigButton input,
.MediumButton input,
.SmallButton input {
  color: #231006 !important;
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif !important;
  font-weight: 700 !important;
  background: linear-gradient(180deg, #f0c46b 0%, #c77b2c 48%, #7c3d18 100%) !important;
  border: 1px solid #f3cf7b !important;
  box-shadow: inset 0 1px 0 rgba(255, 244, 196, 0.55), 0 3px 8px rgba(0, 0, 0, 0.45) !important;
  text-shadow: 0 1px 0 rgba(255, 230, 153, 0.45) !important;
}

input[type="submit"]:hover,
input[type="button"]:hover,
button:hover,
.BigButton input:hover,
.MediumButton input:hover,
.SmallButton input:hover {
  background: linear-gradient(180deg, #ffe09a 0%, #df8c34 50%, #8f4319 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255, 248, 213, 0.68), 0 0 15px rgba(224, 112, 31, 0.5) !important;
}

input,
select,
textarea {
  color: var(--grimhold-text);
  background-color: #160f0a;
  border: 1px solid var(--grimhold-line);
  box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6);
}

input:focus,
select:focus,
textarea:focus {
  outline: 1px solid var(--grimhold-gold);
  border-color: var(--grimhold-gold);
}

#Themeboxes #CurrentPollBox #CurrentPollText,
#PremiumBoxOverlayText {
  color: var(--grimhold-gold-pale);
  text-shadow: 0 1px 2px #000;
}

.FormFieldError,
.Content .BoxContent td .red,
.Content .BoxContent .ff_red {
  color: #ff6f3d;
}

.Content .BoxContent td .green {
  color: #9fd36b;
}

.Content .BoxContent td .yellow,
.Content .BoxContent td .orange {
  color: var(--grimhold-gold-pale);
}

hr {
  border-color: rgba(190, 116, 45, 0.35);
}

/* Grimhold Phase 2 homepage modernization */
.grimhold-hero,
.grimhold-status-grid,
.grimhold-feature-grid {
  box-sizing: border-box;
  margin: 5px 5px 18px;
}

.grimhold-hero *,
.grimhold-status-grid *,
.grimhold-feature-grid * {
  box-sizing: border-box;
}

.grimhold-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 160px;
  gap: 22px;
  min-height: 310px;
  overflow: hidden;
  padding: 34px 34px 30px;
  color: var(--grimhold-text);
  background:
    linear-gradient(90deg, rgba(8, 5, 3, 0.96) 0%, rgba(24, 13, 7, 0.86) 48%, rgba(8, 5, 3, 0.5) 100%),
    radial-gradient(circle at 80% 20%, rgba(220, 122, 35, 0.38), transparent 32%),
    url("images/header/background-artwork.jpg") center / cover no-repeat;
  border: 1px solid rgba(224, 157, 67, 0.34);
  box-shadow: 0 18px 34px rgba(0, 0, 0, 0.66), inset 0 0 0 1px rgba(255, 216, 128, 0.08);
}

.grimhold-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(255, 199, 86, 0.08), transparent 34%),
    radial-gradient(circle at 28% 110%, rgba(202, 89, 24, 0.24), transparent 42%);
}

.grimhold-hero__content,
.grimhold-hero__sigil {
  position: relative;
  z-index: 1;
}

.grimhold-hero__eyebrow {
  display: inline-block;
  margin-bottom: 12px;
  padding: 5px 10px;
  color: var(--grimhold-gold-pale);
  font: 700 11px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-transform: uppercase;
  letter-spacing: 0;
  background: rgba(85, 44, 16, 0.72);
  border: 1px solid rgba(231, 174, 82, 0.4);
}

.grimhold-hero h1 {
  margin: 0 0 12px;
  color: #ffe6a6;
  font-family: "Grimhold Martel", Georgia, "Times New Roman", serif;
  font-size: 46px;
  line-height: 1;
  font-weight: 400;
  letter-spacing: 0;
  text-shadow: 0 4px 12px rgba(0, 0, 0, 0.9), 0 0 18px rgba(225, 126, 36, 0.46);
}

.grimhold-hero p {
  max-width: 560px;
  margin: 0 0 22px;
  color: #e8cfa5;
  font: 16px/1.5 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-shadow: 0 2px 4px #000;
}

.grimhold-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.grimhold-cta,
.grimhold-cta:link,
.grimhold-cta:visited {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0 18px;
  color: #f9e5b1 !important;
  font: 700 13px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif !important;
  text-decoration: none !important;
  background: linear-gradient(180deg, #7a3c17 0%, #3a1c0b 100%);
  border: 1px solid rgba(231, 174, 82, 0.52);
  box-shadow: inset 0 1px 0 rgba(255, 224, 151, 0.18), 0 8px 18px rgba(0, 0, 0, 0.45);
  text-shadow: 0 1px 2px #000;
}

.grimhold-cta--primary,
.grimhold-cta--primary:link,
.grimhold-cta--primary:visited {
  color: #241006 !important;
  background: linear-gradient(180deg, #ffe09a 0%, #d88931 48%, #8a3f18 100%);
  border-color: #f7d184;
  text-shadow: 0 1px 0 rgba(255, 236, 173, 0.55);
}

.grimhold-cta--ghost,
.grimhold-cta--ghost:link,
.grimhold-cta--ghost:visited {
  background: rgba(9, 6, 4, 0.58);
}

.grimhold-cta:hover {
  color: #fff7d2 !important;
  text-shadow: 0 0 10px rgba(255, 190, 76, 0.78);
  box-shadow: inset 0 1px 0 rgba(255, 224, 151, 0.24), 0 0 18px rgba(222, 111, 31, 0.5);
}

.grimhold-cta--primary:hover {
  color: #1a0c04 !important;
}

.grimhold-hero__sigil {
  display: flex;
  align-items: center;
  justify-content: center;
}

.grimhold-hero__sigil img {
  max-width: 150px;
  height: auto;
  filter: drop-shadow(0 0 20px rgba(232, 142, 42, 0.58)) drop-shadow(0 16px 26px rgba(0, 0, 0, 0.82));
}

.grimhold-status-grid,
.grimhold-feature-grid {
  display: grid;
  gap: 12px;
}

.grimhold-status-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.grimhold-feature-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-bottom: 22px;
}

.grimhold-status-card,
.grimhold-feature-card,
.grimhold-status-card:link,
.grimhold-feature-card:link,
.grimhold-status-card:visited,
.grimhold-feature-card:visited {
  display: block;
  min-width: 0;
  color: var(--grimhold-text) !important;
  text-decoration: none !important;
  background: linear-gradient(180deg, rgba(48, 31, 18, 0.98), rgba(24, 15, 9, 0.98));
  border: 1px solid rgba(198, 119, 42, 0.34);
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.44), inset 0 1px 0 rgba(255, 216, 128, 0.08);
}

.grimhold-status-card {
  padding: 16px;
}

.grimhold-status-card span,
.grimhold-feature-card span {
  display: block;
  color: var(--grimhold-muted);
  font: 700 11px/1.2 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-transform: uppercase;
  letter-spacing: 0;
}

.grimhold-status-card strong {
  display: block;
  margin-top: 8px;
  color: var(--grimhold-gold-pale);
  font: 400 27px/1 "Grimhold Martel", Georgia, "Times New Roman", serif;
  letter-spacing: 0;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.85);
}

.grimhold-status-card em {
  display: block;
  margin-top: 7px;
  color: #d2b990;
  font: normal 12px/1.35 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
}

.grimhold-feature-card {
  min-height: 160px;
  padding: 18px;
}

.grimhold-feature-card img {
  width: 36px;
  height: 36px;
  margin-bottom: 12px;
  object-fit: contain;
  filter: drop-shadow(0 0 10px rgba(218, 126, 37, 0.42));
}

.grimhold-feature-card span {
  color: var(--grimhold-gold-pale);
  font-size: 13px;
}

.grimhold-feature-card p {
  margin: 8px 0 0;
  color: #cfb28a;
  font: 13px/1.45 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
}

.grimhold-status-card:hover,
.grimhold-feature-card:hover {
  border-color: rgba(240, 184, 88, 0.68);
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.5), 0 0 18px rgba(214, 106, 31, 0.28), inset 0 1px 0 rgba(255, 216, 128, 0.14);
}

/* Grimhold Phase 2.1 homepage layout rebuild */
#ContentHelper > .grimhold-hero:first-child {
  margin-top: 0;
}

.grimhold-hero {
  grid-template-columns: minmax(0, 1fr) 190px;
  align-items: stretch;
  min-height: 390px;
  padding: 46px 42px 42px;
  margin: 0 5px 16px;
  background:
    linear-gradient(90deg, rgba(7, 4, 3, 0.97) 0%, rgba(24, 12, 6, 0.9) 50%, rgba(8, 5, 3, 0.72) 100%),
    radial-gradient(circle at 82% 25%, rgba(231, 135, 39, 0.42), transparent 34%),
    radial-gradient(circle at 40% 110%, rgba(155, 63, 20, 0.32), transparent 48%),
    url("images/header/bgs/10.jpg") center / cover no-repeat;
  border-color: rgba(242, 180, 80, 0.46);
  box-shadow: 0 26px 48px rgba(0, 0, 0, 0.72), inset 0 0 0 1px rgba(255, 218, 132, 0.12);
}

.grimhold-hero::after {
  content: "";
  position: absolute;
  inset: 14px;
  pointer-events: none;
  border: 1px solid rgba(238, 173, 78, 0.16);
}

.grimhold-hero__content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 290px;
}

.grimhold-hero__eyebrow {
  align-self: flex-start;
  margin-bottom: 18px;
  padding: 7px 12px;
  background: rgba(35, 18, 8, 0.84);
  box-shadow: 0 0 18px rgba(211, 99, 26, 0.18);
}

.grimhold-hero h1 {
  max-width: 560px;
  margin-bottom: 16px;
  font-size: 62px;
  line-height: 0.95;
}

.grimhold-hero p {
  max-width: 600px;
  margin-bottom: 28px;
  font-size: 18px;
  line-height: 1.55;
}

.grimhold-hero__actions {
  gap: 12px;
}

.grimhold-cta,
.grimhold-cta:link,
.grimhold-cta:visited {
  min-height: 44px;
  padding: 0 22px;
  font-size: 14px !important;
}

.grimhold-hero__sigil {
  display: none;
}

.grimhold-hero__wordmark {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100%;
  border-left: 1px solid rgba(229, 160, 66, 0.22);
}

.grimhold-hero__wordmark span {
  display: block;
  color: rgba(255, 230, 166, 0.92);
  font-family: "Grimhold Martel", Georgia, "Times New Roman", serif;
  font-size: 32px;
  line-height: 1;
  letter-spacing: 0;
  text-align: center;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  text-shadow: 0 4px 18px rgba(0, 0, 0, 0.95), 0 0 24px rgba(226, 119, 34, 0.58);
}

.grimhold-status-grid {
  margin: 0 5px 14px;
}

.grimhold-feature-grid {
  margin: 0 5px 24px;
}

.grimhold-status-card {
  min-height: 118px;
  padding: 18px 18px 16px;
}

.grimhold-status-card strong {
  margin-top: 10px;
  font-size: 31px;
}

.grimhold-feature-card {
  min-height: 188px;
  padding: 22px 20px;
}

.grimhold-feature-card img {
  width: 42px;
  height: 42px;
  margin-bottom: 16px;
}

.grimhold-feature-card span {
  font-size: 14px;
}

.grimhold-feature-card p {
  margin-top: 10px;
  font-size: 13px;
  line-height: 1.55;
}

#ContentHelper > .NewsTicker,
#ContentHelper > #NewsTicker,
#ContentHelper > .Ticker,
#ContentHelper > #Ticker {
  margin-top: 4px;
}

#ContentHelper > .grimhold-feature-grid + .Box,
#ContentHelper > .grimhold-feature-grid + script + .Box {
  margin-top: 18px;
}

/* Grimhold Phase 3 brand identity cleanup */
#LeftArtwork {
  height: 150px;
}

#LeftArtwork #TibiaLogoArtworkTop,
#LeftArtwork #TibiaLogoArtworkBottom,
#LeftArtwork #LogoLink {
  display: none !important;
}

#GrimholdLeftWordmark {
  position: absolute;
  top: -22px;
  left: -4px;
  width: 176px;
  min-height: 96px;
  z-index: 80;
  cursor: pointer;
  text-align: center;
  padding: 22px 8px 12px;
  color: var(--grimhold-gold-pale);
  background:
    radial-gradient(circle at 50% 0%, rgba(226, 126, 36, 0.3), transparent 58%),
    linear-gradient(180deg, rgba(45, 26, 12, 0.92), rgba(12, 8, 5, 0.9));
  border: 1px solid rgba(224, 157, 67, 0.32);
  box-shadow: 0 16px 28px rgba(0, 0, 0, 0.68), inset 0 0 0 1px rgba(255, 226, 154, 0.07);
}

#GrimholdLeftWordmark::before,
#GrimholdLeftWordmark::after {
  content: "";
  position: absolute;
  left: 18px;
  right: 18px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(240, 193, 97, 0.7), transparent);
}

#GrimholdLeftWordmark::before {
  top: 12px;
}

#GrimholdLeftWordmark::after {
  bottom: 11px;
}

.GrimholdLeftWordmark-main {
  display: block;
  color: #ffe6a6;
  font-family: "Grimhold Martel", Georgia, "Times New Roman", serif;
  font-size: 30px;
  line-height: 1;
  letter-spacing: 0;
  text-shadow: 0 3px 12px rgba(0, 0, 0, 0.95), 0 0 18px rgba(218, 112, 31, 0.58);
}

.GrimholdLeftWordmark-sub {
  display: block;
  margin-top: 8px;
  color: #cfae78;
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  font-size: 10px;
  line-height: 1.2;
  text-transform: uppercase;
  letter-spacing: 0;
  text-shadow: 0 1px 2px #000;
}

#GrimholdLeftWordmark:hover {
  border-color: rgba(247, 202, 112, 0.6);
  box-shadow: 0 16px 30px rgba(0, 0, 0, 0.72), 0 0 22px rgba(218, 112, 31, 0.38), inset 0 0 0 1px rgba(255, 226, 154, 0.1);
}

#GrimholdLeftContact,
#GrimholdLeftContact:link,
#GrimholdLeftContact:visited {
  position: absolute;
  top: 92px;
  left: 41px;
  z-index: 90;
  width: 86px;
  color: var(--grimhold-muted);
  font: 700 10px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0;
  text-shadow: 0 1px 2px #000;
}

#GrimholdLeftContact:hover {
  color: var(--grimhold-gold-pale);
  text-decoration: none;
}

/* Grimhold Phase 4 stage 1: homepage-only high impact layout */
.grimhold-homepage #Bodycontainer {
  max-width: 1480px;
}

.grimhold-homepage #ContentRow {
  top: 142px;
}

.grimhold-homepage #ContentColumn {
  margin-left: 160px;
  margin-right: 160px;
}

.grimhold-homepage #MenuColumn {
  transform: scale(0.9);
  transform-origin: top left;
  opacity: 0.78;
  transition: opacity 160ms ease, filter 160ms ease;
  filter: saturate(0.82) brightness(0.82);
}

.grimhold-homepage #MenuColumn:hover {
  opacity: 1;
  filter: saturate(1) brightness(1);
}

.grimhold-homepage #ThemeboxesColumn {
  transform: scale(0.9);
  transform-origin: top right;
  opacity: 0.72;
  transition: opacity 160ms ease, filter 160ms ease;
  filter: saturate(0.82) brightness(0.84);
}

.grimhold-homepage #ThemeboxesColumn:hover {
  opacity: 1;
  filter: saturate(1) brightness(1);
}

.grimhold-homepage .GrimholdStatusBarBox {
  display: none;
}

.grimhold-homepage #ContentHelper {
  padding-top: 0;
}

.grimhold-homepage .grimhold-hero,
.grimhold-homepage .grimhold-status-grid,
.grimhold-homepage .grimhold-feature-grid {
  margin-left: 0;
  margin-right: 0;
}

.grimhold-homepage .grimhold-hero {
  min-height: 520px;
  grid-template-columns: minmax(0, 1fr) 230px;
  padding: 64px 58px 56px;
  border-color: rgba(246, 193, 94, 0.56);
  background:
    linear-gradient(90deg, rgba(5, 3, 2, 0.98) 0%, rgba(22, 10, 5, 0.92) 48%, rgba(7, 4, 3, 0.7) 100%),
    radial-gradient(circle at 75% 22%, rgba(234, 144, 43, 0.46), transparent 34%),
    radial-gradient(circle at 30% 112%, rgba(189, 72, 20, 0.36), transparent 48%),
    url("images/header/bgs/10.jpg") center / cover no-repeat;
  box-shadow: 0 34px 62px rgba(0, 0, 0, 0.78), inset 0 0 0 1px rgba(255, 226, 154, 0.14);
}

.grimhold-homepage .grimhold-hero__content {
  min-height: 390px;
}

.grimhold-homepage .grimhold-hero__eyebrow {
  margin-bottom: 22px;
  padding: 8px 14px;
  font-size: 12px;
}

.grimhold-homepage .grimhold-hero h1 {
  max-width: 720px;
  font-size: 76px;
  line-height: 0.92;
  margin-bottom: 20px;
}

.grimhold-homepage .grimhold-hero p {
  max-width: 700px;
  font-size: 20px;
  line-height: 1.58;
  margin-bottom: 34px;
}

.grimhold-homepage .grimhold-hero__actions {
  gap: 14px;
}

.grimhold-homepage .grimhold-cta,
.grimhold-homepage .grimhold-cta:link,
.grimhold-homepage .grimhold-cta:visited {
  min-height: 48px;
  padding: 0 26px;
  font-size: 15px !important;
}

.grimhold-homepage .grimhold-hero__wordmark {
  border-left-color: rgba(240, 183, 82, 0.28);
}

.grimhold-homepage .grimhold-hero__wordmark span {
  font-size: 42px;
  text-shadow: 0 5px 22px rgba(0, 0, 0, 0.98), 0 0 34px rgba(229, 126, 36, 0.7);
}

.grimhold-homepage .grimhold-status-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 18px;
  margin-bottom: 18px;
}

.grimhold-homepage .grimhold-status-card {
  min-height: 136px;
  padding: 22px 22px 18px;
}

.grimhold-homepage .grimhold-status-card strong {
  font-size: 36px;
}

.grimhold-homepage .grimhold-feature-grid {
  gap: 16px;
  margin-bottom: 30px;
}

.grimhold-homepage .grimhold-feature-card {
  min-height: 220px;
  padding: 26px 24px;
}

.grimhold-homepage .grimhold-feature-card img {
  width: 48px;
  height: 48px;
}

.grimhold-homepage .grimhold-feature-card span {
  font-size: 15px;
}

.grimhold-homepage .grimhold-feature-card p {
  font-size: 14px;
}

.grimhold-homepage #News.Box {
  margin-top: 24px;
  opacity: 0.96;
}

@media (max-width: 1180px) {
  .grimhold-homepage #Bodycontainer {
    max-width: 1280px;
  }

  .grimhold-homepage #ContentColumn {
    margin-left: 188px;
    margin-right: 188px;
  }

  .grimhold-homepage #MenuColumn,
  .grimhold-homepage #ThemeboxesColumn {
    transform: none;
    opacity: 0.9;
  }

  .grimhold-homepage .grimhold-hero {
    min-height: 430px;
    grid-template-columns: minmax(0, 1fr) 150px;
    padding: 44px 34px 38px;
  }

  .grimhold-homepage .grimhold-hero h1 {
    font-size: 58px;
  }

  .grimhold-homepage .grimhold-hero p {
    font-size: 17px;
  }
}

/* Grimhold Phase 5: homepage structural modernization */
.grimhold-homepage #Bodycontainer {
  max-width: 1560px;
}

.grimhold-homepage #ContentColumn {
  margin-left: 148px;
  margin-right: 28px;
}

.grimhold-homepage #ThemeboxesColumn {
  display: none;
}

.grimhold-homepage #MenuColumn {
  opacity: 0.62;
  transform: scale(0.86);
  filter: saturate(0.68) brightness(0.72);
}

.grimhold-homepage #MenuColumn:hover {
  opacity: 0.96;
  filter: saturate(0.96) brightness(0.92);
}

.grimhold-homepage .grimhold-hero {
  min-height: 610px;
  grid-template-columns: minmax(0, 1fr) 250px;
  padding: 78px 72px 68px;
  margin-bottom: 28px;
  background:
    linear-gradient(90deg, rgba(4, 3, 2, 0.99) 0%, rgba(18, 8, 4, 0.94) 45%, rgba(6, 4, 3, 0.68) 100%),
    radial-gradient(circle at 76% 18%, rgba(246, 155, 48, 0.5), transparent 34%),
    radial-gradient(circle at 32% 112%, rgba(176, 63, 18, 0.42), transparent 52%),
    url("images/header/bgs/10.jpg") center / cover no-repeat;
}

.grimhold-homepage .grimhold-hero h1 {
  font-size: 88px;
  max-width: 820px;
}

.grimhold-homepage .grimhold-hero p {
  max-width: 760px;
  font-size: 21px;
}

.grimhold-homepage .grimhold-hero__content {
  min-height: 450px;
}

.grimhold-homepage .grimhold-hero__wordmark span {
  font-size: 48px;
}

.grimhold-modern-section {
  margin: 0 0 28px;
}

.grimhold-section-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
  margin: 0 0 14px;
  padding: 0 2px 10px;
  border-bottom: 1px solid rgba(214, 130, 45, 0.34);
}

.grimhold-section-heading span {
  color: var(--grimhold-muted);
  font: 700 11px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-transform: uppercase;
  letter-spacing: 0;
}

.grimhold-section-heading strong {
  color: var(--grimhold-gold-pale);
  font: 400 28px/1 "Grimhold Martel", Georgia, "Times New Roman", serif;
  letter-spacing: 0;
  text-align: right;
  text-shadow: 0 2px 9px rgba(0, 0, 0, 0.9);
}

.grimhold-modern-grid {
  display: grid;
  gap: 16px;
}

.grimhold-modern-grid--four {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.grimhold-modern-card,
.grimhold-modern-card:link,
.grimhold-modern-card:visited {
  display: block;
  min-width: 0;
  min-height: 148px;
  padding: 22px;
  color: var(--grimhold-text) !important;
  text-decoration: none !important;
  background:
    linear-gradient(180deg, rgba(45, 28, 15, 0.98), rgba(18, 11, 7, 0.98)),
    radial-gradient(circle at 100% 0%, rgba(218, 116, 31, 0.16), transparent 40%);
  border: 1px solid rgba(201, 123, 43, 0.42);
  box-shadow: 0 16px 28px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 218, 132, 0.1);
}

.grimhold-modern-card--compact {
  min-height: 128px;
}

.grimhold-modern-card span {
  display: block;
  color: var(--grimhold-muted);
  font: 700 11px/1.2 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-transform: uppercase;
  letter-spacing: 0;
}

.grimhold-modern-card strong {
  display: block;
  margin-top: 10px;
  color: var(--grimhold-gold-pale);
  font: 400 29px/1 "Grimhold Martel", Georgia, "Times New Roman", serif;
  letter-spacing: 0;
  overflow-wrap: anywhere;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.88);
}

.grimhold-modern-card em {
  display: block;
  margin-top: 10px;
  color: #d0b38a;
  font: normal 13px/1.4 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
}

.grimhold-modern-card:hover {
  border-color: rgba(246, 194, 92, 0.72);
  box-shadow: 0 18px 34px rgba(0, 0, 0, 0.58), 0 0 22px rgba(218, 112, 31, 0.3), inset 0 1px 0 rgba(255, 218, 132, 0.14);
}

.grimhold-player-list {
  display: grid;
  gap: 10px;
}

.grimhold-player-row,
.grimhold-player-row:link,
.grimhold-player-row:visited {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  min-height: 58px;
  padding: 10px 16px;
  color: var(--grimhold-text) !important;
  text-decoration: none !important;
  background: linear-gradient(90deg, rgba(45, 28, 15, 0.96), rgba(19, 12, 8, 0.96));
  border: 1px solid rgba(201, 123, 43, 0.32);
  box-shadow: 0 10px 18px rgba(0, 0, 0, 0.34);
}

.grimhold-player-row span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  color: #221006;
  font-weight: 800;
  background: linear-gradient(180deg, #f1c878, #b86b28);
  border: 1px solid rgba(255, 226, 154, 0.48);
}

.grimhold-player-row strong {
  color: var(--grimhold-gold-pale);
  font: 700 15px/1.2 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.grimhold-player-row em {
  color: var(--grimhold-muted);
  font-style: normal;
  white-space: nowrap;
}

.grimhold-player-row:hover {
  border-color: rgba(246, 194, 92, 0.66);
}

.grimhold-latest-news {
  padding-top: 8px;
}

.grimhold-homepage .grimhold-latest-news #News.Box {
  margin-left: 0;
  margin-right: 0;
  background: none;
  border-left: 0;
  border-right: 0;
  box-shadow: none;
}

.grimhold-homepage .grimhold-latest-news #News > .Corner-tl,
.grimhold-homepage .grimhold-latest-news #News > .Corner-tr,
.grimhold-homepage .grimhold-latest-news #News > .CornerWrapper-b,
.grimhold-homepage .grimhold-latest-news #News > .Border_1,
.grimhold-homepage .grimhold-latest-news #News > .BorderTitleText,
.grimhold-homepage .grimhold-latest-news #News > .Title {
  display: none !important;
}

.grimhold-homepage .grimhold-latest-news #News .Border_2,
.grimhold-homepage .grimhold-latest-news #News .Border_3 {
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
}

.grimhold-homepage .grimhold-latest-news #News .BoxContent {
  min-height: 0;
  padding: 24px;
  background:
    linear-gradient(180deg, rgba(45, 28, 15, 0.96), rgba(18, 11, 7, 0.98)),
    radial-gradient(circle at 100% 0%, rgba(218, 116, 31, 0.14), transparent 42%) !important;
  border: 1px solid rgba(201, 123, 43, 0.34);
  box-shadow: 0 16px 28px rgba(0, 0, 0, 0.45);
}

@media (max-width: 1180px) {
  .grimhold-homepage #ContentColumn {
    margin-left: 188px;
    margin-right: 24px;
  }

  .grimhold-modern-grid--four {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .grimhold-homepage .grimhold-hero {
    min-height: 500px;
  }
}

/* Grimhold Phase 6: homepage navigation and news card modernization */
.grimhold-homepage #MenuColumn {
  display: none;
}

.grimhold-homepage #ContentColumn {
  margin-left: 28px;
  margin-right: 28px;
}

.grimhold-homepage .grimhold-hero {
  min-height: 650px;
  padding: 92px 84px 76px;
  grid-template-columns: minmax(0, 1fr) 280px;
  background:
    linear-gradient(90deg, rgba(3, 2, 1, 0.99) 0%, rgba(15, 7, 4, 0.94) 43%, rgba(6, 4, 3, 0.62) 100%),
    radial-gradient(circle at 72% 16%, rgba(255, 165, 52, 0.54), transparent 34%),
    radial-gradient(circle at 30% 118%, rgba(184, 61, 16, 0.48), transparent 54%),
    url("images/header/bgs/12.jpg") center / cover no-repeat;
}

.grimhold-homepage .grimhold-hero__content {
  min-height: 500px;
}

.grimhold-homepage .grimhold-hero h1 {
  font-size: 98px;
  max-width: 900px;
}

.grimhold-homepage .grimhold-hero p {
  max-width: 820px;
  font-size: 23px;
}

.grimhold-homepage .grimhold-home-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: center;
  margin: -8px 0 30px;
  padding: 14px;
  background: linear-gradient(180deg, rgba(38, 23, 13, 0.92), rgba(13, 8, 5, 0.94));
  border: 1px solid rgba(217, 144, 55, 0.38);
  box-shadow: 0 18px 30px rgba(0, 0, 0, 0.48), inset 0 1px 0 rgba(255, 224, 151, 0.08);
}

.grimhold-homepage .grimhold-home-nav a,
.grimhold-homepage .grimhold-home-nav a:link,
.grimhold-homepage .grimhold-home-nav a:visited {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0 16px;
  color: var(--grimhold-gold-pale) !important;
  font: 700 12px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif !important;
  text-decoration: none !important;
  text-transform: uppercase;
  letter-spacing: 0;
  background: rgba(12, 8, 5, 0.58);
  border: 1px solid rgba(196, 118, 42, 0.34);
  text-shadow: 0 1px 2px #000;
}

.grimhold-homepage .grimhold-home-nav a:hover {
  color: #fff3c4 !important;
  border-color: rgba(246, 194, 92, 0.7);
  box-shadow: 0 0 16px rgba(218, 112, 31, 0.3);
}

.grimhold-homepage .grimhold-latest-news #newsticker.Box,
.grimhold-homepage .grimhold-latest-news #FeaturedArticle.Box {
  margin: 0 0 18px;
  color: var(--grimhold-text);
  background: none;
  border-left: 0;
  border-right: 0;
  box-shadow: none;
}

.grimhold-homepage .grimhold-latest-news #newsticker > .Corner-tl,
.grimhold-homepage .grimhold-latest-news #newsticker > .Corner-tr,
.grimhold-homepage .grimhold-latest-news #newsticker > .CornerWrapper-b,
.grimhold-homepage .grimhold-latest-news #newsticker > .Border_1,
.grimhold-homepage .grimhold-latest-news #newsticker > .BorderTitleText,
.grimhold-homepage .grimhold-latest-news #newsticker > .Title,
.grimhold-homepage .grimhold-latest-news #FeaturedArticle > .Corner-tl,
.grimhold-homepage .grimhold-latest-news #FeaturedArticle > .Corner-tr,
.grimhold-homepage .grimhold-latest-news #FeaturedArticle > .CornerWrapper-b,
.grimhold-homepage .grimhold-latest-news #FeaturedArticle > .Border_1,
.grimhold-homepage .grimhold-latest-news #FeaturedArticle > .BorderTitleText,
.grimhold-homepage .grimhold-latest-news #FeaturedArticle > .Title {
  display: none !important;
}

.grimhold-homepage .grimhold-latest-news #newsticker .Border_2,
.grimhold-homepage .grimhold-latest-news #newsticker .Border_3,
.grimhold-homepage .grimhold-latest-news #FeaturedArticle .Border_2,
.grimhold-homepage .grimhold-latest-news #FeaturedArticle .Border_3 {
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
}

.grimhold-homepage .grimhold-latest-news #newsticker .BoxContent,
.grimhold-homepage .grimhold-latest-news #FeaturedArticle .BoxContent {
  min-height: 0;
  padding: 0;
  background: transparent !important;
  border: 0;
}

.grimhold-homepage .grimhold-latest-news #TickerEntry-0,
.grimhold-homepage .grimhold-latest-news #newsticker .Row,
.grimhold-homepage .grimhold-latest-news .NewsHeadline,
.grimhold-homepage .grimhold-latest-news #FeaturedArticle #TeaserText {
  display: block;
  margin: 0 0 12px;
  padding: 18px 20px;
  color: var(--grimhold-text);
  background:
    linear-gradient(180deg, rgba(45, 28, 15, 0.96), rgba(18, 11, 7, 0.98)),
    radial-gradient(circle at 100% 0%, rgba(218, 116, 31, 0.12), transparent 38%);
  border: 1px solid rgba(201, 123, 43, 0.34);
  box-shadow: 0 14px 24px rgba(0, 0, 0, 0.42);
}

.grimhold-homepage .grimhold-latest-news #newsticker .Odd,
.grimhold-homepage .grimhold-latest-news #newsticker .Even {
  background: transparent !important;
}

.grimhold-homepage .grimhold-latest-news .NewsHeadlineBackground {
  min-height: 0;
  background: none !important;
}

.grimhold-homepage .grimhold-latest-news .NewsHeadlineText,
.grimhold-homepage .grimhold-latest-news .NewsTickerDate {
  color: var(--grimhold-gold-pale);
  font-weight: 700;
}

.grimhold-homepage .grimhold-latest-news .NewsHeadlineDate,
.grimhold-homepage .grimhold-latest-news .NewsHeadlineAuthor,
.grimhold-homepage .grimhold-latest-news .NewsTickerText {
  color: #d2b990;
}

.grimhold-homepage .grimhold-latest-news .NewsHeadlineIcon,
.grimhold-homepage .grimhold-latest-news .NewsTickerIcon {
  filter: sepia(0.45) saturate(1.1) brightness(0.9) drop-shadow(0 0 8px rgba(218, 112, 31, 0.28));
}

@media (max-width: 1180px) {
  .grimhold-homepage #ContentColumn {
    margin-left: 24px;
    margin-right: 24px;
  }

  .grimhold-homepage .grimhold-hero {
    min-height: 540px;
    grid-template-columns: minmax(0, 1fr) 150px;
    padding: 54px 36px 44px;
  }

  .grimhold-homepage .grimhold-hero h1 {
    font-size: 64px;
  }

  .grimhold-homepage .grimhold-hero p {
    font-size: 18px;
  }
}

/* Grimhold Phase 7A: homepage branding foundation */
.grimhold-homepage .grimhold-hero {
  min-height: 690px;
  padding: 104px 92px 82px;
  background:
    linear-gradient(90deg, rgba(3, 2, 1, 0.99) 0%, rgba(13, 6, 3, 0.96) 38%, rgba(16, 8, 4, 0.70) 68%, rgba(5, 3, 2, 0.46) 100%),
    radial-gradient(circle at 76% 18%, rgba(246, 168, 58, 0.46), transparent 31%),
    radial-gradient(circle at 34% 116%, rgba(158, 42, 15, 0.55), transparent 50%),
    linear-gradient(180deg, rgba(0, 0, 0, 0.10), rgba(0, 0, 0, 0.70)),
    url("images/header/bgs/12.jpg") center / cover no-repeat;
  border-color: rgba(226, 145, 51, 0.52);
  box-shadow: 0 32px 70px rgba(0, 0, 0, 0.66), inset 0 1px 0 rgba(255, 226, 150, 0.13);
}

.grimhold-homepage .grimhold-hero::before {
  background:
    linear-gradient(180deg, rgba(255, 202, 112, 0.12), transparent 28%),
    radial-gradient(circle at 74% 22%, rgba(255, 209, 112, 0.19), transparent 30%);
}

.grimhold-homepage .grimhold-hero__content {
  max-width: 900px;
  min-height: 530px;
  justify-content: center;
}

.grimhold-homepage .grimhold-hero h1 {
  margin-bottom: 12px;
  font-size: 108px;
  line-height: 0.9;
  text-shadow: 0 4px 0 rgba(57, 23, 6, 0.82), 0 18px 42px rgba(0, 0, 0, 0.86), 0 0 28px rgba(218, 118, 31, 0.32);
}

.grimhold-homepage .grimhold-hero__tagline {
  width: fit-content;
  margin: 0 0 22px;
  padding: 8px 14px;
  color: #ffd88c;
  font: 800 15px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-transform: uppercase;
  letter-spacing: 0;
  background: rgba(10, 6, 3, 0.58);
  border: 1px solid rgba(227, 154, 59, 0.42);
  box-shadow: inset 0 1px 0 rgba(255, 235, 175, 0.09), 0 10px 22px rgba(0, 0, 0, 0.36);
}

.grimhold-homepage .grimhold-hero p {
  max-width: 780px;
  color: #ead5ad;
  font-size: 24px;
  line-height: 1.55;
}

.grimhold-homepage .grimhold-modern-card--discord {
  background:
    linear-gradient(180deg, rgba(65, 38, 17, 0.98), rgba(19, 10, 5, 0.98)),
    radial-gradient(circle at 100% 0%, rgba(255, 176, 67, 0.24), transparent 42%);
  border-color: rgba(245, 178, 77, 0.58);
}

.grimhold-homepage .grimhold-modern-card--discord strong {
  font-size: 24px;
}

.grimhold-homepage .grimhold-roadmap {
  margin-top: 10px;
}

.grimhold-homepage .grimhold-roadmap-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 10px;
}

.grimhold-homepage .grimhold-roadmap-item {
  position: relative;
  min-height: 118px;
  padding: 18px 14px;
  color: #c9ad7e;
  background:
    linear-gradient(180deg, rgba(31, 20, 12, 0.94), rgba(12, 8, 5, 0.98)),
    radial-gradient(circle at 100% 0%, rgba(120, 71, 25, 0.18), transparent 45%);
  border: 1px solid rgba(133, 84, 37, 0.42);
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.38), inset 0 1px 0 rgba(255, 224, 151, 0.06);
}

.grimhold-homepage .grimhold-roadmap-item span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  margin-bottom: 14px;
  color: #9f8051;
  font: 900 19px/1 Arial, sans-serif;
  background: rgba(8, 5, 3, 0.62);
  border: 1px solid rgba(132, 87, 40, 0.42);
}

.grimhold-homepage .grimhold-roadmap-item strong {
  display: block;
  color: #e4c58c;
  font: 800 14px/1.25 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-transform: uppercase;
  letter-spacing: 0;
}

.grimhold-homepage .grimhold-roadmap-item--done {
  color: #f0c97d;
  border-color: rgba(228, 153, 54, 0.58);
  background:
    linear-gradient(180deg, rgba(57, 34, 15, 0.98), rgba(17, 10, 5, 0.98)),
    radial-gradient(circle at 100% 0%, rgba(255, 180, 61, 0.25), transparent 45%);
}

.grimhold-homepage .grimhold-roadmap-item--done span {
  color: #211105;
  background: linear-gradient(180deg, #ffd987, #c27627);
  border-color: rgba(255, 224, 151, 0.58);
}

.grimhold-homepage .grimhold-feature-panel {
  display: flex;
  min-height: 250px;
  flex-direction: column;
  justify-content: flex-end;
  padding: 30px;
  color: var(--grimhold-text);
  text-decoration: none !important;
  background:
    linear-gradient(180deg, rgba(16, 10, 6, 0.25), rgba(11, 7, 4, 0.96)),
    radial-gradient(circle at 80% 12%, rgba(230, 137, 41, 0.22), transparent 40%),
    linear-gradient(135deg, rgba(65, 39, 18, 0.98), rgba(13, 8, 5, 0.98));
  border: 1px solid rgba(214, 133, 44, 0.42);
  box-shadow: 0 20px 42px rgba(0, 0, 0, 0.48), inset 0 1px 0 rgba(255, 224, 151, 0.08);
}

.grimhold-homepage .grimhold-founder-grid {
  display: grid;
  grid-template-columns: 1.1fr 1.1fr 0.9fr;
  gap: 18px;
}

.grimhold-homepage .grimhold-feature-panel span {
  margin-bottom: 10px;
  color: var(--grimhold-bronze);
  font: 800 12px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-transform: uppercase;
  letter-spacing: 0;
}

.grimhold-homepage .grimhold-feature-panel strong {
  display: block;
  margin-bottom: 14px;
  color: var(--grimhold-gold-pale);
  font: 800 28px/1.05 Georgia, "Times New Roman", serif;
}

.grimhold-homepage .grimhold-feature-panel p {
  max-width: 560px;
  margin: 0 0 20px;
  color: #d7c09b;
  font: 15px/1.6 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
}

.grimhold-homepage .grimhold-feature-panel a,
.grimhold-homepage a.grimhold-feature-panel {
  color: var(--grimhold-text) !important;
}

.grimhold-homepage .grimhold-feature-panel > a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  min-height: 38px;
  padding: 0 16px;
  color: #211005 !important;
  font: 800 12px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-transform: uppercase;
  text-decoration: none !important;
  background: linear-gradient(180deg, #f3cd7c, #b96825);
  border: 1px solid rgba(255, 224, 151, 0.56);
}

.grimhold-homepage .grimhold-feature-panel--community {
  background:
    linear-gradient(180deg, rgba(27, 15, 7, 0.55), rgba(8, 5, 3, 0.98)),
    radial-gradient(circle at 100% 0%, rgba(255, 187, 77, 0.32), transparent 45%),
    linear-gradient(135deg, rgba(57, 32, 13, 0.98), rgba(11, 7, 4, 0.98));
}

@media (max-width: 1180px) {
  .grimhold-homepage .grimhold-hero {
    min-height: 580px;
    padding: 62px 40px 48px;
  }

  .grimhold-homepage .grimhold-hero h1 {
    font-size: 72px;
  }

  .grimhold-homepage .grimhold-hero p {
    font-size: 19px;
  }

  .grimhold-homepage .grimhold-roadmap-grid,
  .grimhold-homepage .grimhold-founder-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .grimhold-homepage .grimhold-roadmap-grid,
  .grimhold-homepage .grimhold-founder-grid {
    grid-template-columns: 1fr;
  }
}

/* Grimhold Phase 7B: homepage visual polish and logo integration */
.grimhold-homepage #ContentHelper {
  background:
    linear-gradient(180deg, rgba(0, 0, 0, 0.24), transparent 280px),
    radial-gradient(circle at 50% 0%, rgba(215, 130, 39, 0.10), transparent 420px);
}

.grimhold-homepage .grimhold-modern-section {
  margin-bottom: 34px;
}

.grimhold-homepage .grimhold-hero {
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  min-height: 720px;
  padding: 92px 96px 88px;
  overflow: hidden;
  background:
    linear-gradient(90deg, rgba(2, 1, 1, 0.99) 0%, rgba(8, 4, 2, 0.97) 31%, rgba(16, 8, 4, 0.78) 62%, rgba(4, 3, 2, 0.42) 100%),
    radial-gradient(circle at 58% 22%, rgba(255, 180, 72, 0.24), transparent 30%),
    radial-gradient(circle at 82% 12%, rgba(236, 135, 39, 0.42), transparent 28%),
    radial-gradient(circle at 24% 92%, rgba(131, 28, 12, 0.50), transparent 44%),
    linear-gradient(180deg, rgba(0, 0, 0, 0.04), rgba(0, 0, 0, 0.78)),
    url("images/header/bgs/12.jpg") center / cover no-repeat;
  border: 1px solid rgba(241, 168, 63, 0.54);
  box-shadow: 0 38px 86px rgba(0, 0, 0, 0.74), inset 0 1px 0 rgba(255, 235, 170, 0.14), inset 0 -1px 0 rgba(123, 49, 13, 0.35);
}

.grimhold-homepage .grimhold-hero::before {
  background:
    linear-gradient(180deg, rgba(255, 221, 140, 0.11), transparent 22%, rgba(0, 0, 0, 0.12)),
    radial-gradient(circle at 55% 30%, rgba(255, 211, 118, 0.16), transparent 30%),
    linear-gradient(90deg, rgba(0, 0, 0, 0.62), transparent 46%, rgba(0, 0, 0, 0.20));
}

.grimhold-homepage .grimhold-hero::after {
  background:
    linear-gradient(90deg, rgba(220, 135, 42, 0.0), rgba(220, 135, 42, 0.45), rgba(220, 135, 42, 0.0));
  bottom: 0;
  content: "";
  height: 1px;
  left: 44px;
  position: absolute;
  right: 44px;
  z-index: 1;
}

.grimhold-homepage .grimhold-hero__content {
  max-width: 880px;
  min-height: 540px;
  justify-content: center;
  position: relative;
  z-index: 2;
}

.grimhold-homepage .grimhold-hero__eyebrow {
  margin-bottom: 16px;
  color: #f1b45d;
  text-shadow: 0 0 18px rgba(221, 126, 30, 0.38);
}

.grimhold-homepage .grimhold-hero h1,
.grimhold-homepage .grimhold-hero__wordmark {
  display: none !important;
}

.grimhold-homepage .grimhold-hero__logo {
  width: min(620px, 72vw);
  margin: 0 0 16px -18px;
  position: relative;
}

.grimhold-homepage .grimhold-hero__logo::before {
  background: radial-gradient(ellipse at center, rgba(255, 180, 75, 0.30), rgba(133, 45, 11, 0.15) 35%, transparent 68%);
  content: "";
  filter: blur(16px);
  inset: 8% 3% -4%;
  position: absolute;
  z-index: -1;
}

.grimhold-homepage .grimhold-hero__logo img {
  display: block;
  height: auto;
  max-width: 100%;
  object-fit: contain;
  filter: drop-shadow(0 10px 14px rgba(0, 0, 0, 0.86)) drop-shadow(0 0 22px rgba(230, 137, 41, 0.34));
}

.grimhold-homepage .grimhold-hero__tagline {
  margin-bottom: 20px;
  padding: 9px 16px;
  color: #ffe0a0;
  background: linear-gradient(90deg, rgba(22, 12, 5, 0.82), rgba(78, 40, 13, 0.46), rgba(22, 12, 5, 0.18));
  border-color: rgba(248, 182, 75, 0.52);
}

.grimhold-homepage .grimhold-hero p {
  max-width: 720px;
  margin-bottom: 34px;
  color: #f0ddbb;
  text-shadow: 0 2px 14px rgba(0, 0, 0, 0.72);
}

.grimhold-homepage .grimhold-hero__actions {
  gap: 14px;
}

.grimhold-homepage .grimhold-cta,
.grimhold-homepage .grimhold-cta:link,
.grimhold-homepage .grimhold-cta:visited {
  min-height: 50px;
  padding: 0 24px;
  border-radius: 0;
  box-shadow: 0 14px 24px rgba(0, 0, 0, 0.42), inset 0 1px 0 rgba(255, 238, 181, 0.13);
}

.grimhold-homepage .grimhold-cta--primary {
  background: linear-gradient(180deg, #ffe19a 0%, #d38a35 48%, #843713 100%) !important;
  border-color: rgba(255, 227, 151, 0.78) !important;
  box-shadow: 0 16px 34px rgba(206, 95, 24, 0.38), 0 4px 0 rgba(50, 18, 5, 0.82), inset 0 1px 0 rgba(255, 247, 210, 0.42) !important;
}

.grimhold-homepage .grimhold-cta:hover {
  transform: translateY(-1px);
  box-shadow: 0 18px 34px rgba(221, 119, 31, 0.34), inset 0 1px 0 rgba(255, 238, 181, 0.18);
}

.grimhold-homepage .grimhold-home-nav {
  justify-content: space-between;
  gap: 0;
  margin: -14px 0 40px;
  padding: 0 18px;
  min-height: 70px;
  background:
    linear-gradient(90deg, rgba(12, 7, 4, 0.95), rgba(43, 24, 11, 0.90), rgba(12, 7, 4, 0.95)),
    radial-gradient(circle at 50% 0%, rgba(245, 168, 57, 0.18), transparent 48%);
  border-color: rgba(232, 151, 53, 0.48);
  box-shadow: 0 22px 42px rgba(0, 0, 0, 0.50), inset 0 1px 0 rgba(255, 224, 151, 0.10);
}

.grimhold-homepage .grimhold-home-nav a,
.grimhold-homepage .grimhold-home-nav a:link,
.grimhold-homepage .grimhold-home-nav a:visited {
  min-height: 70px;
  padding: 0 14px;
  background: transparent;
  border: 0;
  color: #e8c485 !important;
  position: relative;
}

.grimhold-homepage .grimhold-home-nav a::after {
  background: linear-gradient(90deg, transparent, rgba(246, 194, 92, 0.88), transparent);
  bottom: 14px;
  content: "";
  height: 1px;
  left: 16px;
  opacity: 0;
  position: absolute;
  right: 16px;
  transition: opacity 160ms ease;
}

.grimhold-homepage .grimhold-home-nav a:hover {
  color: #fff1c4 !important;
  box-shadow: none;
}

.grimhold-homepage .grimhold-home-nav a:hover::after {
  opacity: 1;
}

.grimhold-homepage .grimhold-section-heading {
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(182, 111, 37, 0.28);
}

.grimhold-homepage .grimhold-section-heading span {
  color: #e19a45;
}

.grimhold-homepage .grimhold-section-heading strong {
  color: #ffe0a0;
  text-shadow: 0 10px 24px rgba(0, 0, 0, 0.56);
}

.grimhold-homepage .grimhold-world-status {
  padding: 28px;
  background: linear-gradient(180deg, rgba(14, 18, 17, 0.78), rgba(9, 8, 6, 0.22));
  border: 1px solid rgba(153, 105, 45, 0.30);
}

.grimhold-homepage .grimhold-world-status .grimhold-modern-card {
  background:
    linear-gradient(180deg, rgba(20, 30, 27, 0.96), rgba(8, 10, 9, 0.98)),
    radial-gradient(circle at 80% 0%, rgba(221, 139, 46, 0.18), transparent 40%);
}

.grimhold-homepage .grimhold-roadmap {
  padding: 28px;
  background:
    linear-gradient(180deg, rgba(24, 14, 8, 0.46), rgba(7, 5, 4, 0.18)),
    radial-gradient(circle at 10% 0%, rgba(221, 112, 31, 0.14), transparent 38%);
  border-top: 1px solid rgba(222, 141, 46, 0.30);
  border-bottom: 1px solid rgba(118, 67, 25, 0.26);
}

.grimhold-homepage .grimhold-roadmap-item {
  background:
    linear-gradient(180deg, rgba(19, 15, 12, 0.96), rgba(8, 7, 6, 0.98)),
    radial-gradient(circle at 100% 0%, rgba(120, 71, 25, 0.16), transparent 45%);
}

.grimhold-homepage .grimhold-roadmap-item--done {
  background:
    linear-gradient(180deg, rgba(50, 36, 19, 0.98), rgba(13, 10, 7, 0.98)),
    radial-gradient(circle at 100% 0%, rgba(255, 180, 61, 0.24), transparent 45%);
}

.grimhold-homepage .grimhold-feature-panel--founder {
  background:
    linear-gradient(180deg, rgba(18, 10, 4, 0.18), rgba(8, 5, 3, 0.96)),
    radial-gradient(circle at 18% 12%, rgba(255, 197, 92, 0.24), transparent 36%),
    linear-gradient(135deg, rgba(82, 42, 14, 0.96), rgba(13, 8, 5, 0.98));
}

.grimhold-homepage .grimhold-feature-panel--hall {
  background:
    linear-gradient(180deg, rgba(6, 8, 9, 0.12), rgba(7, 5, 4, 0.96)),
    radial-gradient(circle at 74% 10%, rgba(177, 124, 56, 0.26), transparent 42%),
    linear-gradient(135deg, rgba(24, 27, 26, 0.98), rgba(39, 24, 11, 0.98));
}

.grimhold-homepage .grimhold-feature-panel--community {
  background:
    linear-gradient(180deg, rgba(11, 8, 5, 0.16), rgba(8, 5, 3, 0.96)),
    radial-gradient(circle at 100% 0%, rgba(255, 187, 77, 0.32), transparent 45%),
    linear-gradient(135deg, rgba(48, 25, 10, 0.98), rgba(15, 12, 11, 0.98));
}

.grimhold-homepage .grimhold-top-players {
  padding: 28px;
  background: linear-gradient(180deg, rgba(13, 15, 16, 0.72), rgba(6, 5, 4, 0.18));
  border-left: 1px solid rgba(151, 98, 42, 0.24);
}

.grimhold-homepage .grimhold-player-row {
  background: linear-gradient(90deg, rgba(21, 17, 13, 0.96), rgba(10, 9, 8, 0.98));
}

.grimhold-homepage .grimhold-home-widgets {
  padding: 28px;
  background:
    radial-gradient(circle at 0% 0%, rgba(202, 119, 31, 0.12), transparent 36%),
    linear-gradient(180deg, rgba(31, 22, 13, 0.42), rgba(8, 6, 4, 0.18));
  border-right: 1px solid rgba(151, 98, 42, 0.24);
}

.grimhold-homepage .grimhold-home-widgets .grimhold-modern-card {
  background:
    linear-gradient(180deg, rgba(28, 19, 11, 0.96), rgba(11, 8, 5, 0.98)),
    radial-gradient(circle at 0% 0%, rgba(235, 145, 43, 0.14), transparent 38%);
}

.grimhold-homepage .grimhold-latest-news {
  padding: 30px 28px 12px;
  background:
    linear-gradient(180deg, rgba(10, 8, 6, 0.28), rgba(8, 6, 4, 0.10)),
    radial-gradient(circle at 50% 0%, rgba(216, 127, 34, 0.12), transparent 44%);
  border-top: 1px solid rgba(194, 118, 40, 0.28);
}

.grimhold-homepage .grimhold-latest-news #TickerEntry-0,
.grimhold-homepage .grimhold-latest-news #newsticker .Row,
.grimhold-homepage .grimhold-latest-news .NewsHeadline,
.grimhold-homepage .grimhold-latest-news #FeaturedArticle #TeaserText,
.grimhold-homepage .grimhold-latest-news #News .BoxContent {
  background:
    linear-gradient(180deg, rgba(19, 17, 14, 0.97), rgba(8, 7, 6, 0.99)),
    radial-gradient(circle at 100% 0%, rgba(196, 118, 42, 0.16), transparent 38%) !important;
  border-color: rgba(170, 106, 41, 0.36);
}

@media (max-width: 1180px) {
  .grimhold-homepage .grimhold-hero {
    min-height: 610px;
    padding: 64px 42px 54px;
  }

  .grimhold-homepage .grimhold-hero__logo {
    width: min(520px, 78vw);
    margin-left: -10px;
  }

  .grimhold-homepage .grimhold-home-nav {
    justify-content: center;
    gap: 6px;
    padding: 10px;
  }

  .grimhold-homepage .grimhold-home-nav a,
  .grimhold-homepage .grimhold-home-nav a:link,
  .grimhold-homepage .grimhold-home-nav a:visited {
    min-height: 42px;
  }
}

@media (max-width: 760px) {
  .grimhold-homepage .grimhold-hero {
    min-height: 560px;
    padding: 50px 24px 42px;
  }

  .grimhold-homepage .grimhold-hero__logo {
    width: min(430px, 86vw);
    margin-left: -6px;
  }

  .grimhold-homepage .grimhold-hero__actions {
    align-items: stretch;
    flex-direction: column;
  }
}

/* Grimhold Phase 7C: homepage scale and desktop composition */
.grimhold-homepage #ContentColumn {
  margin-left: clamp(24px, 3.2vw, 64px);
  margin-right: clamp(24px, 3.2vw, 64px);
}

.grimhold-homepage #ContentHelper {
  max-width: 1680px;
  margin-left: auto;
  margin-right: auto;
  padding-left: clamp(16px, 2vw, 34px);
  padding-right: clamp(16px, 2vw, 34px);
}

.grimhold-homepage .grimhold-modern-section {
  margin-bottom: 42px;
}

.grimhold-homepage .grimhold-hero {
  min-height: clamp(600px, 34vw, 660px);
  padding: clamp(58px, 5vw, 82px) clamp(58px, 5.4vw, 104px) clamp(54px, 4.4vw, 78px);
  background-position: center center;
}

.grimhold-homepage .grimhold-hero__content {
  max-width: 980px;
  min-height: 0;
}

.grimhold-homepage .grimhold-hero__logo {
  width: min(760px, 52vw);
  margin: 0 0 12px -24px;
}

.grimhold-homepage .grimhold-hero__tagline {
  margin-bottom: 16px;
  font-size: 17px;
}

.grimhold-homepage .grimhold-hero p {
  max-width: 850px;
  margin-bottom: 28px;
  font-size: 25px;
  line-height: 1.48;
}

.grimhold-homepage .grimhold-hero__actions {
  gap: 16px;
}

.grimhold-homepage .grimhold-cta,
.grimhold-homepage .grimhold-cta:link,
.grimhold-homepage .grimhold-cta:visited {
  min-height: 56px;
  padding-left: 28px;
  padding-right: 28px;
  font-size: 14px !important;
}

.grimhold-homepage .grimhold-home-nav {
  min-height: 76px;
  margin-bottom: 46px;
  padding-left: clamp(18px, 2vw, 32px);
  padding-right: clamp(18px, 2vw, 32px);
}

.grimhold-homepage .grimhold-home-nav a,
.grimhold-homepage .grimhold-home-nav a:link,
.grimhold-homepage .grimhold-home-nav a:visited {
  min-height: 76px;
  padding-left: clamp(12px, 1.1vw, 22px);
  padding-right: clamp(12px, 1.1vw, 22px);
  font-size: 13px !important;
}

.grimhold-homepage .grimhold-section-heading {
  margin-bottom: 24px;
}

.grimhold-homepage .grimhold-section-heading span {
  font-size: 13px;
}

.grimhold-homepage .grimhold-section-heading strong {
  font-size: 34px;
}

.grimhold-homepage .grimhold-world-status,
.grimhold-homepage .grimhold-roadmap,
.grimhold-homepage .grimhold-top-players,
.grimhold-homepage .grimhold-home-widgets,
.grimhold-homepage .grimhold-latest-news {
  padding: clamp(30px, 2.6vw, 46px);
}

.grimhold-homepage .grimhold-modern-grid {
  gap: 22px;
}

.grimhold-homepage .grimhold-modern-card,
.grimhold-homepage .grimhold-modern-card:link,
.grimhold-homepage .grimhold-modern-card:visited {
  min-height: 188px;
  padding: 28px;
}

.grimhold-homepage .grimhold-modern-card span {
  font-size: 13px;
}

.grimhold-homepage .grimhold-modern-card strong {
  font-size: 32px;
}

.grimhold-homepage .grimhold-modern-card em {
  font-size: 15px;
  line-height: 1.45;
}

.grimhold-homepage .grimhold-roadmap-grid {
  gap: 16px;
}

.grimhold-homepage .grimhold-roadmap-item {
  min-height: 146px;
  padding: 24px 18px;
}

.grimhold-homepage .grimhold-roadmap-item span {
  width: 40px;
  height: 40px;
  margin-bottom: 18px;
  font-size: 21px;
}

.grimhold-homepage .grimhold-roadmap-item strong {
  font-size: 15px;
  line-height: 1.32;
}

.grimhold-homepage .grimhold-founder-grid {
  gap: 24px;
}

.grimhold-homepage .grimhold-feature-panel {
  min-height: 310px;
  padding: 38px;
}

.grimhold-homepage .grimhold-feature-panel strong {
  font-size: 34px;
}

.grimhold-homepage .grimhold-feature-panel p {
  font-size: 16px;
  line-height: 1.65;
}

.grimhold-homepage .grimhold-feature-panel > a {
  min-height: 44px;
  padding-left: 18px;
  padding-right: 18px;
}

.grimhold-homepage .grimhold-player-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.grimhold-homepage .grimhold-player-row,
.grimhold-homepage .grimhold-player-row:link,
.grimhold-homepage .grimhold-player-row:visited {
  min-height: 66px;
  padding: 14px 18px;
}

.grimhold-homepage .grimhold-player-row span {
  width: 38px;
  height: 38px;
}

.grimhold-homepage .grimhold-player-row strong {
  font-size: 17px;
}

.grimhold-homepage .grimhold-player-row em {
  font-size: 14px;
}

.grimhold-homepage .grimhold-latest-news #TickerEntry-0,
.grimhold-homepage .grimhold-latest-news #newsticker .Row,
.grimhold-homepage .grimhold-latest-news .NewsHeadline,
.grimhold-homepage .grimhold-latest-news #FeaturedArticle #TeaserText {
  padding: 22px 24px;
}

.grimhold-homepage .grimhold-latest-news #News .BoxContent {
  padding: 30px !important;
}

@media (min-width: 1500px) {
  .grimhold-homepage .grimhold-modern-grid--four {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .grimhold-homepage .grimhold-roadmap-grid {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
}

@media (max-width: 1180px) {
  .grimhold-homepage #ContentHelper {
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
  }

  .grimhold-homepage .grimhold-hero {
    min-height: 570px;
    padding: 54px 34px 44px;
  }

  .grimhold-homepage .grimhold-hero__logo {
    width: min(560px, 78vw);
    margin-left: -10px;
  }

  .grimhold-homepage .grimhold-player-list {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .grimhold-homepage #ContentColumn {
    margin-left: 14px;
    margin-right: 14px;
  }

  .grimhold-homepage .grimhold-hero {
    min-height: 520px;
    padding: 42px 22px 36px;
  }

  .grimhold-homepage .grimhold-hero__logo {
    width: min(430px, 88vw);
  }

  .grimhold-homepage .grimhold-hero p {
    font-size: 18px;
  }
}

/* Grimhold Phase 8: homepage layout reconstruction */
.grimhold-homepage #ContentColumn {
  margin-left: clamp(20px, 2.8vw, 54px);
  margin-right: clamp(20px, 2.8vw, 54px);
}

.grimhold-homepage #ContentHelper {
  max-width: 1760px;
  margin: 0 auto;
  padding: 0 clamp(14px, 1.6vw, 28px);
}

.grimhold-phase8-shell,
.grimhold-phase8-shell * {
  box-sizing: border-box;
}

.grimhold-phase8-shell {
  display: grid;
  gap: 18px;
}

.grimhold-phase8-nav {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr) 150px;
  align-items: center;
  min-height: 72px;
  padding: 10px 18px;
  background: rgba(13, 8, 5, 0.86);
  border: 1px solid rgba(201, 123, 43, 0.32);
}

.grimhold-phase8-nav__brand {
  display: inline-flex;
  align-items: center;
  min-width: 0;
}

.grimhold-phase8-nav__brand img {
  display: block;
  width: 180px;
  max-width: 100%;
  height: auto;
}

.grimhold-phase8-nav__links {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(16px, 2vw, 34px);
  min-width: 0;
}

.grimhold-phase8-nav__links a,
.grimhold-phase8-nav__links a:link,
.grimhold-phase8-nav__links a:visited {
  color: #e8c485 !important;
  font: 800 13px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif !important;
  text-decoration: none !important;
  text-transform: uppercase;
  white-space: nowrap;
}

.grimhold-phase8-nav__play,
.grimhold-phase8-nav__play:link,
.grimhold-phase8-nav__play:visited {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  color: #221005 !important;
  font: 900 13px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif !important;
  text-decoration: none !important;
  text-transform: uppercase;
  background: linear-gradient(180deg, #f0c978, #b86724);
  border: 1px solid rgba(255, 224, 151, 0.58);
}

.grimhold-phase8-main {
  display: grid;
  grid-template-columns: minmax(340px, 0.92fr) minmax(420px, 1.18fr) minmax(310px, 0.72fr);
  gap: 22px;
  min-height: 430px;
}

.grimhold-phase8-intro,
.grimhold-phase8-feature,
.grimhold-phase8-login,
.grimhold-phase8-stats > a,
.grimhold-phase8-news-events {
  background: rgba(18, 11, 7, 0.84);
  border: 1px solid rgba(201, 123, 43, 0.32);
}

.grimhold-phase8-intro {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(34px, 3vw, 54px);
}

.grimhold-phase8-intro span,
.grimhold-phase8-feature__body span,
.grimhold-phase8-login > span,
.grimhold-phase8-stats span,
.grimhold-phase8-explore__grid span {
  color: #d58e3e;
  font: 800 12px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-transform: uppercase;
}

.grimhold-phase8-intro h1 {
  margin: 14px 0 18px;
  color: #f4d395;
  font: 800 clamp(44px, 4.2vw, 76px)/0.95 Georgia, "Times New Roman", serif;
  letter-spacing: 0;
}

.grimhold-phase8-intro p {
  max-width: 620px;
  margin: 0 0 28px;
  color: #e0c9a4;
  font: 18px/1.55 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
}

.grimhold-phase8-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.grimhold-phase8-feature {
  display: grid;
  grid-template-rows: minmax(230px, 1fr) auto;
  min-width: 0;
  overflow: hidden;
}

.grimhold-phase8-feature__media {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 30px;
  background:
    linear-gradient(180deg, rgba(6, 4, 3, 0.15), rgba(6, 4, 3, 0.78)),
    url("images/header/bgs/12.jpg") center / cover no-repeat;
}

.grimhold-phase8-feature__media img {
  display: block;
  width: min(520px, 82%);
  height: auto;
}

.grimhold-phase8-feature__body {
  padding: 24px 28px 28px;
}

.grimhold-phase8-feature__body strong,
.grimhold-phase8-login strong,
.grimhold-phase8-explore__grid strong {
  display: block;
  margin-top: 10px;
  color: #f0d08e;
  font: 800 28px/1.1 Georgia, "Times New Roman", serif;
}

.grimhold-phase8-feature__body p,
.grimhold-phase8-login p {
  margin: 12px 0 0;
  color: #d9c19b;
  font: 15px/1.5 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
}

.grimhold-phase8-login {
  padding: 28px;
}

.grimhold-phase8-login form {
  display: grid;
  gap: 12px;
  margin-top: 18px;
}

.grimhold-phase8-login label {
  display: grid;
  gap: 6px;
  color: #d7b981;
  font: 800 12px/1.2 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-transform: uppercase;
}

.grimhold-phase8-login input[type="text"],
.grimhold-phase8-login input[type="password"] {
  width: 100%;
  min-height: 40px;
  padding: 0 11px;
  color: #f4e1bd;
  background: rgba(7, 5, 4, 0.86);
  border: 1px solid rgba(178, 111, 43, 0.42);
}

.grimhold-phase8-login__remember {
  display: flex !important;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 8px !important;
  text-transform: none !important;
}

.grimhold-phase8-login__submit,
.grimhold-phase8-login__submit:link,
.grimhold-phase8-login__submit:visited {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  width: 100%;
  color: #221005 !important;
  font: 900 13px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif !important;
  text-decoration: none !important;
  text-transform: uppercase;
  background: linear-gradient(180deg, #f0c978, #b86724);
  border: 1px solid rgba(255, 224, 151, 0.58);
  cursor: pointer;
}

.grimhold-phase8-login__links {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-top: 14px;
}

.grimhold-phase8-login__links a,
.grimhold-phase8-login__links a:link,
.grimhold-phase8-login__links a:visited {
  color: #d9b776 !important;
  font-size: 12px;
  text-decoration: none !important;
}

.grimhold-phase8-stats {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
}

.grimhold-phase8-stats > a,
.grimhold-phase8-stats > a:link,
.grimhold-phase8-stats > a:visited {
  display: grid;
  align-content: center;
  min-height: 92px;
  padding: 18px 20px;
  color: #d9c19b !important;
  text-decoration: none !important;
}

.grimhold-phase8-stats strong {
  display: block;
  margin-top: 8px;
  color: #f0d08e;
  font: 800 24px/1.1 Georgia, "Times New Roman", serif;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.grimhold-phase8-news-events,
.grimhold-news-section,
.grimhold-phase8-explore {
  padding: 24px 28px;
}

.grimhold-phase8-news-events .grimhold-section-heading,
.grimhold-news-section .grimhold-section-heading {
  margin-bottom: 0;
  padding-bottom: 0;
}

.grimhold-news-section .grimhold-section-heading {
  border-bottom: none;
  justify-content: center;
  align-items: center;
}

.grimhold-news-section .grimhold-section-heading span {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 20px;
  color: #c8a96e;
  font: 900 18px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  text-shadow:
    0 1px 3px rgba(0, 0, 0, 0.92),
    0 0 18px rgba(184, 134, 52, 0.18);
}

.grimhold-news-section .grimhold-section-heading span::before,
.grimhold-news-section .grimhold-section-heading span::after {
  content: "";
  display: block;
  width: clamp(48px, 7vw, 140px);
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(184, 132, 50, 0.60) 40%,
    rgba(220, 175, 90, 0.90)
  );
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.60);
}

.grimhold-news-section .grimhold-section-heading span::after {
  background: linear-gradient(
    90deg,
    rgba(220, 175, 90, 0.90),
    rgba(184, 132, 50, 0.60) 60%,
    transparent
  );
}

.grimhold-home-news-row {
  display: flex;
  gap: 18px;
  align-items: stretch;
  min-width: 0;
}

.grimhold-news-section {
  flex: 1;
  min-width: 0;
}

.grimhold-news-section__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(139, 100, 40, 0.28);
}

.grimhold-phase8-explore .grimhold-section-heading {
  margin-bottom: 16px;
  padding-bottom: 10px;
}

.grimhold-phase8-news-events__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(139, 100, 40, 0.28);
}

.grimhold-news-view-all {
  display: inline-flex;
  align-items: center;
  padding: 5px 14px;
  color: #c8a96e;
  font: 600 10px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-decoration: none;
  border: 1px solid rgba(200, 169, 110, 0.45);
  background: rgba(200, 169, 110, 0.06);
  transition: color 150ms ease, background 150ms ease, border-color 150ms ease;
  white-space: nowrap;
}

.grimhold-news-view-all:hover,
.grimhold-news-view-all:focus-visible {
  color: #f0d28f;
  background: rgba(200, 169, 110, 0.14);
  border-color: rgba(200, 169, 110, 0.70);
  text-decoration: none;
}

.grimhold-news-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.grimhold-news-card,
.grimhold-news-card:link,
.grimhold-news-card:visited {
  display: flex;
  flex-direction: column;
  min-height: 320px;
  background: linear-gradient(135deg, rgba(18, 14, 8, 0.95), rgba(28, 20, 10, 0.90));
  border: 1px solid rgba(139, 100, 40, 0.46);
  box-shadow:
    0 8px 22px rgba(0, 0, 0, 0.52),
    inset 0 1px 0 rgba(255, 229, 169, 0.05);
  overflow: hidden;
  cursor: pointer;
  text-decoration: none;
  color: inherit;
  transition: transform 220ms ease, border-color 220ms ease, box-shadow 220ms ease;
}

.grimhold-news-card:hover {
  transform: translateY(-4px);
  border-color: rgba(200, 152, 58, 0.64);
  box-shadow:
    0 16px 36px rgba(0, 0, 0, 0.64),
    inset 0 1px 0 rgba(255, 229, 169, 0.09),
    0 0 0 1px rgba(190, 140, 50, 0.20);
}

.grimhold-news-card__thumb {
  position: relative;
  width: 100%;
  height: 190px;
  background-size: cover;
  background-position: center 25%;
  background-repeat: no-repeat;
}

.grimhold-news-card__thumb::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      to bottom,
      rgba(4, 2, 1, 0.06) 0%,
      rgba(4, 2, 1, 0.22) 40%,
      rgba(4, 2, 1, 0.78) 80%,
      rgba(3, 2, 1, 0.96) 100%
    ),
    linear-gradient(
      135deg,
      rgba(168, 96, 22, 0.10) 0%,
      transparent 48%
    );
}

.grimhold-news-card__date {
  position: absolute;
  bottom: 8px;
  left: 10px;
  z-index: 1;
  color: #c8a96e;
  font: 700 10px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.95);
}

.grimhold-news-card__body {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
  min-width: 0;
  padding: 14px 16px 18px;
}

.grimhold-news-card__title {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  max-width: 100%;
  margin: 0 0 4px;
  color: #f0d68a;
  font: 800 clamp(14px, 1.1vw, 18px) / 1.2 Georgia, "Times New Roman", serif;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  text-shadow:
    0 2px 6px rgba(0, 0, 0, 0.94),
    0 1px 2px rgba(0, 0, 0, 0.86);
}

.grimhold-news-card__desc {
  flex: 1;
  margin: 0;
  color: #c6b89e;
  font: 400 clamp(10.5px, 0.76vw, 12.5px) / 1.44 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.92);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.grimhold-news-card__btn {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  padding: 5px 14px;
  color: #c8a96e;
  font: 600 10px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-decoration: none;
  border: 1px solid rgba(200, 169, 110, 0.45);
  background: rgba(200, 169, 110, 0.06);
  transition: color 150ms ease, background 150ms ease, border-color 150ms ease;
  white-space: nowrap;
}

.grimhold-news-card__btn:hover,
.grimhold-news-card__btn:focus-visible {
  color: #1a1005;
  background: rgba(200, 169, 110, 0.88);
  border-color: rgba(200, 169, 110, 0.90);
  text-decoration: none;
}

.grimhold-phase8-explore__grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
}

.grimhold-phase8-explore__grid a,
.grimhold-phase8-explore__grid a:link,
.grimhold-phase8-explore__grid a:visited {
  display: grid;
  align-content: center;
  min-height: 112px;
  padding: 20px;
  color: #d9c19b !important;
  text-decoration: none !important;
  background: rgba(11, 8, 5, 0.72);
  border: 1px solid rgba(170, 106, 41, 0.30);
}

.grimhold-phase8-explore__grid strong {
  font-size: 24px;
}

.grimhold-homepage .grimhold-phase8-news-events #newsticker.Box,
.grimhold-homepage .grimhold-phase8-news-events #FeaturedArticle.Box {
  margin-bottom: 12px;
}

@media (max-width: 1280px) {
  .grimhold-phase8-nav {
    grid-template-columns: 180px 1fr 130px;
  }

  .grimhold-phase8-main {
    grid-template-columns: 1fr 1fr;
  }

  .grimhold-phase8-login {
    grid-column: 1 / -1;
  }

  .grimhold-phase8-stats,
  .grimhold-phase8-explore__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 860px) {
  .grimhold-phase8-nav,
  .grimhold-phase8-main,
  .grimhold-phase8-stats,
  .grimhold-phase8-explore__grid {
    grid-template-columns: 1fr;
  }

  .grimhold-phase8-nav__links {
    flex-wrap: wrap;
    justify-content: flex-start;
  }

  .grimhold-phase8-main {
    min-height: 0;
  }
}

/* Grimhold Phase 8B: Astera mockup visual alignment */
.grimhold-homepage #ContentHelper {
  max-width: 1780px;
}

.grimhold-phase8-shell {
  gap: 16px;
}

.grimhold-phase8-nav {
  grid-template-columns: 260px minmax(0, 1fr) 180px;
  min-height: 92px;
  padding: 14px 22px;
  background:
    linear-gradient(90deg, rgba(8, 5, 3, 0.96), rgba(36, 20, 9, 0.92), rgba(8, 5, 3, 0.96)),
    radial-gradient(circle at 0% 0%, rgba(232, 151, 53, 0.16), transparent 34%);
  border-color: rgba(236, 164, 64, 0.44);
  box-shadow: 0 18px 38px rgba(0, 0, 0, 0.52), inset 0 1px 0 rgba(255, 229, 169, 0.12);
}

.grimhold-phase8-nav__brand img {
  width: 230px;
  filter: drop-shadow(0 8px 12px rgba(0, 0, 0, 0.76)) drop-shadow(0 0 16px rgba(220, 129, 35, 0.24));
}

.grimhold-phase8-nav__links {
  gap: clamp(22px, 2.3vw, 44px);
}

.grimhold-phase8-nav__links a,
.grimhold-phase8-nav__links a:link,
.grimhold-phase8-nav__links a:visited {
  position: relative;
  padding: 20px 0;
  color: #e9c889 !important;
  font-size: 14px !important;
}

.grimhold-phase8-nav__links a::after {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 10px;
  height: 2px;
  content: "";
  opacity: 0;
  background: linear-gradient(90deg, transparent, #e7a44d, transparent);
}

.grimhold-phase8-nav__links a:hover::after {
  opacity: 1;
}

.grimhold-phase8-nav__play,
.grimhold-phase8-nav__play:link,
.grimhold-phase8-nav__play:visited {
  min-height: 54px;
  font-size: 15px !important;
  background: linear-gradient(180deg, #ffe19a 0%, #d08631 52%, #7f3514 100%);
  border-color: rgba(255, 229, 163, 0.78);
  box-shadow: 0 14px 28px rgba(210, 99, 24, 0.32), inset 0 1px 0 rgba(255, 246, 207, 0.36);
}

.grimhold-phase8-main {
  grid-template-columns: minmax(390px, 0.95fr) minmax(500px, 1.2fr) minmax(340px, 0.72fr);
  gap: 18px;
  min-height: 410px;
}

.grimhold-phase8-intro,
.grimhold-phase8-feature,
.grimhold-phase8-login,
.grimhold-phase8-stats > a,
.grimhold-phase8-news-events {
  background:
    linear-gradient(180deg, rgba(25, 15, 8, 0.93), rgba(9, 6, 4, 0.97)),
    radial-gradient(circle at 100% 0%, rgba(211, 127, 37, 0.12), transparent 38%);
  border-color: rgba(214, 134, 45, 0.42);
  box-shadow: 0 18px 36px rgba(0, 0, 0, 0.42), inset 0 1px 0 rgba(255, 229, 169, 0.08);
}

.grimhold-news-section,
.grimhold-phase8-explore {
  background: linear-gradient(180deg, rgba(14, 18, 17, 0.78), rgba(9, 8, 6, 0.22));
  border: 1px solid rgba(153, 105, 45, 0.30);
  box-shadow:
    0 18px 36px rgba(0, 0, 0, 0.46),
    inset 0 1px 0 rgba(239, 200, 120, 0.08),
    inset 0 -1px 0 rgba(0, 0, 0, 0.72);
}

.grimhold-phase8-intro {
  padding: clamp(38px, 3.2vw, 60px);
  background:
    linear-gradient(90deg, rgba(28, 14, 6, 0.96), rgba(12, 7, 4, 0.94)),
    radial-gradient(circle at 0% 20%, rgba(230, 142, 43, 0.20), transparent 42%);
}

.grimhold-phase8-intro h1 {
  margin-top: 16px;
  margin-bottom: 16px;
  font-size: clamp(58px, 4.8vw, 86px);
}

.grimhold-phase8-intro p {
  max-width: 680px;
  margin-bottom: 24px;
  font-size: 19px;
}

.grimhold-phase8-actions .grimhold-cta,
.grimhold-phase8-actions .grimhold-cta:link,
.grimhold-phase8-actions .grimhold-cta:visited {
  min-height: 52px;
  padding-left: 28px;
  padding-right: 28px;
}

.grimhold-phase8-feature {
  position: relative;
  grid-template-rows: minmax(255px, 1fr) auto;
  background:
    linear-gradient(180deg, rgba(12, 8, 5, 0.96), rgba(7, 5, 4, 0.98)),
    radial-gradient(circle at 50% 0%, rgba(232, 151, 53, 0.18), transparent 42%);
}

.grimhold-phase8-feature::after {
  position: absolute;
  right: 24px;
  bottom: 112px;
  width: 74px;
  height: 10px;
  content: "";
  background:
    radial-gradient(circle at 5px 5px, #f2ca78 0 4px, transparent 5px),
    radial-gradient(circle at 37px 5px, rgba(242, 202, 120, 0.52) 0 4px, transparent 5px),
    radial-gradient(circle at 69px 5px, rgba(242, 202, 120, 0.30) 0 4px, transparent 5px);
}

.grimhold-phase8-feature__media {
  min-height: 280px;
  background:
    linear-gradient(180deg, rgba(2, 1, 1, 0.04), rgba(4, 3, 2, 0.84)),
    radial-gradient(circle at 50% 28%, rgba(255, 192, 88, 0.20), transparent 34%),
    url("images/header/bgs/12.jpg") center / cover no-repeat;
}

.grimhold-phase8-feature__media img {
  width: min(600px, 88%);
}

.grimhold-phase8-feature__body {
  display: grid;
  min-height: 112px;
  align-content: center;
  padding: 22px 32px 26px;
  border-top: 1px solid rgba(219, 139, 45, 0.30);
}

.grimhold-phase8-feature__body strong,
.grimhold-phase8-login strong,
.grimhold-phase8-explore__grid strong {
  font-size: 31px;
}

.grimhold-phase8-login {
  padding: 32px;
  background:
    linear-gradient(180deg, rgba(20, 13, 8, 0.98), rgba(8, 6, 4, 0.98)),
    radial-gradient(circle at 50% 0%, rgba(219, 139, 45, 0.18), transparent 45%);
}

.grimhold-phase8-login form {
  gap: 14px;
}

.grimhold-phase8-login input[type="text"],
.grimhold-phase8-login input[type="password"] {
  min-height: 46px;
  border-color: rgba(207, 128, 43, 0.50);
  box-shadow: inset 0 1px 0 rgba(255, 231, 167, 0.05);
}

.grimhold-phase8-login__submit,
.grimhold-phase8-login__submit:link,
.grimhold-phase8-login__submit:visited {
  min-height: 48px;
  margin-top: 4px;
}

.grimhold-phase8-stats {
  gap: 12px;
}

.grimhold-phase8-stats > a,
.grimhold-phase8-stats > a:link,
.grimhold-phase8-stats > a:visited {
  position: relative;
  grid-template-columns: 54px minmax(0, 1fr);
  column-gap: 14px;
  min-height: 104px;
  align-content: center;
  align-items: center;
  padding: 18px 18px;
  overflow: hidden;
}

.grimhold-phase8-stats > a::before {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  grid-row: 1 / span 2;
  color: #221005;
  font: 900 22px/1 Arial, sans-serif;
  background: linear-gradient(180deg, #f1c979, #b96b27);
  border: 1px solid rgba(255, 230, 166, 0.54);
  box-shadow: 0 10px 18px rgba(0, 0, 0, 0.32);
}

.grimhold-phase8-stats > a:nth-child(1)::before { content: "P"; }
.grimhold-phase8-stats > a:nth-child(2)::before { content: "A"; }
.grimhold-phase8-stats > a:nth-child(3)::before { content: "C"; }
.grimhold-phase8-stats > a:nth-child(4)::before { content: "G"; }
.grimhold-phase8-stats > a:nth-child(5)::before { content: "B"; }

.grimhold-phase8-stats span {
  font-size: 12px;
}

.grimhold-phase8-stats strong {
  margin-top: 6px;
  font-size: 31px;
}

.grimhold-phase8-news-events,
.grimhold-news-section {
  padding: 26px 30px 30px;
}

.grimhold-phase8-news-events__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 290px;
  gap: 18px;
  align-items: stretch;
}

.grimhold-phase8-news-list {
  min-width: 0;
}

.grimhold-phase8-event-card,
.grimhold-phase8-event-card:link,
.grimhold-phase8-event-card:visited {
  display: grid;
  align-content: end;
  min-height: 190px;
  padding: 24px;
  color: #dcc399 !important;
  text-decoration: none !important;
  background:
    linear-gradient(180deg, rgba(24, 17, 11, 0.22), rgba(8, 6, 4, 0.96)),
    radial-gradient(circle at 100% 0%, rgba(238, 154, 55, 0.28), transparent 46%),
    url("images/header/bgs/12.jpg") center / cover no-repeat;
  border: 1px solid rgba(225, 146, 51, 0.44);
}

.grimhold-phase8-event-card span {
  color: #e39a44;
  font: 800 12px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-transform: uppercase;
}

.grimhold-phase8-event-card strong {
  display: block;
  margin-top: 10px;
  color: #f0d08e;
  font: 800 30px/1.08 Georgia, "Times New Roman", serif;
}

.grimhold-phase8-event-card em {
  display: block;
  margin-top: 12px;
  color: #dcc399;
  font: 14px/1.45 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
}

.grimhold-homepage .grimhold-phase8-news-list #newsticker .Row,
.grimhold-homepage .grimhold-phase8-news-list #TickerEntry-0,
.grimhold-homepage .grimhold-phase8-news-list .NewsHeadline,
.grimhold-homepage .grimhold-phase8-news-list #FeaturedArticle #TeaserText {
  min-height: 72px;
  padding: 20px 22px;
  background:
    linear-gradient(180deg, rgba(26, 20, 14, 0.98), rgba(9, 7, 5, 0.98)),
    radial-gradient(circle at 100% 0%, rgba(219, 139, 45, 0.18), transparent 38%) !important;
  border-color: rgba(211, 132, 44, 0.40);
}

.grimhold-phase8-explore {
  padding: 26px 30px 30px;
}

.grimhold-phase8-explore__grid {
  gap: 16px;
}

.grimhold-phase8-explore__grid a,
.grimhold-phase8-explore__grid a:link,
.grimhold-phase8-explore__grid a:visited {
  position: relative;
  min-height: 138px;
  padding: 24px 22px;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(28, 18, 10, 0.96), rgba(9, 7, 5, 0.98)),
    radial-gradient(circle at 100% 0%, rgba(221, 139, 45, 0.18), transparent 42%);
  border-color: rgba(214, 134, 45, 0.40);
}

.grimhold-phase8-explore__grid a::before {
  position: absolute;
  right: 18px;
  top: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  color: rgba(34, 16, 5, 0.88);
  font: 900 18px/1 Arial, sans-serif;
  background: linear-gradient(180deg, rgba(241, 201, 121, 0.92), rgba(185, 107, 39, 0.92));
  border: 1px solid rgba(255, 230, 166, 0.40);
}

.grimhold-phase8-explore__grid a:nth-child(1)::before { content: "D"; }
.grimhold-phase8-explore__grid a:nth-child(2)::before { content: "H"; }
.grimhold-phase8-explore__grid a:nth-child(3)::before { content: "C"; }
.grimhold-phase8-explore__grid a:nth-child(4)::before { content: "S"; }
.grimhold-phase8-explore__grid a:nth-child(5)::before { content: "M"; }

.grimhold-phase8-explore__grid strong {
  max-width: calc(100% - 48px);
  font-size: 27px;
}

@media (max-width: 1280px) {
  .grimhold-phase8-nav {
    grid-template-columns: 220px 1fr 150px;
  }

  .grimhold-phase8-main {
    grid-template-columns: 1fr 1fr;
  }

  .grimhold-phase8-news-events__grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 860px) {
  .grimhold-phase8-nav {
    min-height: 0;
  }

  .grimhold-phase8-nav__brand img {
    width: 200px;
  }

  .grimhold-phase8-stats > a,
  .grimhold-phase8-stats > a:link,
  .grimhold-phase8-stats > a:visited {
    grid-template-columns: 48px 1fr;
  }
}

/* Grimhold Phase 8C: Astera layout correction */
.grimhold-homepage #Bodycontainer {
  max-width: none;
  width: 100%;
}

.grimhold-homepage #ContentRow {
  top: 34px;
}

.grimhold-homepage #ContentColumn {
  margin-left: clamp(10px, 1.25vw, 24px);
  margin-right: clamp(10px, 1.25vw, 24px);
}

.grimhold-homepage #ContentHelper {
  max-width: 1880px;
  padding-left: clamp(8px, 1vw, 20px);
  padding-right: clamp(8px, 1vw, 20px);
}

.grimhold-phase8-shell {
  gap: 14px;
}

.grimhold-phase8-nav {
  min-height: 86px;
  grid-template-columns: 255px minmax(0, 1fr) 190px;
  padding: 10px 22px;
}

.grimhold-phase8-nav__brand img {
  width: 225px;
}

.grimhold-phase8-nav__play,
.grimhold-phase8-nav__play:link,
.grimhold-phase8-nav__play:visited {
  min-height: 56px;
}

.grimhold-phase8-main {
  min-height: 390px;
  grid-template-columns: minmax(390px, 0.92fr) minmax(520px, 1.22fr) minmax(340px, 0.70fr);
  gap: 16px;
}

.grimhold-phase8-intro {
  padding: clamp(32px, 2.6vw, 50px);
}

.grimhold-phase8-intro h1 {
  max-width: 650px;
  margin: 12px 0 16px;
  font-size: clamp(42px, 3.5vw, 64px);
  line-height: 1.02;
}

.grimhold-phase8-intro p {
  max-width: 660px;
  margin-bottom: 24px;
  font-size: 18px;
  line-height: 1.5;
}

.grimhold-phase8-actions {
  align-items: center;
  gap: 12px;
}

.grimhold-phase8-actions .grimhold-cta,
.grimhold-phase8-actions .grimhold-cta:link,
.grimhold-phase8-actions .grimhold-cta:visited {
  min-width: 178px;
  min-height: 50px;
}

.grimhold-phase8-feature__media {
  position: relative;
  min-height: 250px;
  padding-left: 74px;
  padding-right: 74px;
}

.grimhold-phase8-carousel-arrow {
  position: absolute;
  top: 50%;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 58px;
  padding: 0;
  color: #f1d08d;
  font: 700 42px/1 Georgia, "Times New Roman", serif;
  background: rgba(10, 7, 4, 0.78);
  border: 1px solid rgba(223, 145, 51, 0.56);
  cursor: default;
  transform: translateY(-50%);
}

.grimhold-phase8-carousel-arrow--prev {
  left: 20px;
}

.grimhold-phase8-carousel-arrow--next {
  right: 20px;
}

.grimhold-phase8-stats {
  gap: 0;
  background: rgba(13, 8, 5, 0.92);
  border: 1px solid rgba(214, 134, 45, 0.44);
  box-shadow: 0 18px 34px rgba(0, 0, 0, 0.44), inset 0 1px 0 rgba(255, 229, 169, 0.08);
}

.grimhold-phase8-stats > a,
.grimhold-phase8-stats > a:link,
.grimhold-phase8-stats > a:visited {
  min-height: 100px;
  background: transparent;
  border: 0;
  border-right: 1px solid rgba(214, 134, 45, 0.34);
  box-shadow: none;
}

.grimhold-phase8-stats > a:last-child {
  border-right: 0;
}

.grimhold-phase8-stats > a::before {
  width: 50px;
  height: 50px;
}

.grimhold-phase8-stats strong {
  font-size: 30px;
}

.grimhold-phase8-news-events__grid {
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.34fr);
}

.grimhold-phase8-news-list {
  min-height: 190px;
}

.grimhold-homepage .grimhold-phase8-news-list > #newsticker,
.grimhold-homepage .grimhold-phase8-news-list > .NewsTicker,
.grimhold-homepage .grimhold-phase8-news-list > #NewsTicker,
.grimhold-homepage .grimhold-phase8-news-list > .Ticker,
.grimhold-homepage .grimhold-phase8-news-list > #Ticker {
  display: none !important;
}

.grimhold-homepage .grimhold-phase8-news-list .Box,
.grimhold-homepage .grimhold-phase8-news-list #News {
  margin: 0;
  background: transparent !important;
  border: 0;
  box-shadow: none;
}

.grimhold-homepage .grimhold-phase8-news-list .Corner-tl,
.grimhold-homepage .grimhold-phase8-news-list .Corner-tr,
.grimhold-homepage .grimhold-phase8-news-list .CornerWrapper-b,
.grimhold-homepage .grimhold-phase8-news-list .Border_1,
.grimhold-homepage .grimhold-phase8-news-list .BorderTitleText,
.grimhold-homepage .grimhold-phase8-news-list .Title {
  display: none !important;
}

.grimhold-homepage .grimhold-phase8-news-list .Border_2,
.grimhold-homepage .grimhold-phase8-news-list .Border_3,
.grimhold-homepage .grimhold-phase8-news-list .BoxContent {
  margin: 0;
  padding: 0 !important;
  background: transparent !important;
  border: 0;
}

.grimhold-homepage .grimhold-phase8-news-list .NewsHeadline,
.grimhold-homepage .grimhold-phase8-news-list .TableContainer,
.grimhold-homepage .grimhold-phase8-news-list article,
.grimhold-homepage .grimhold-phase8-news-list .news-entry {
  display: block;
  margin: 0 0 12px;
  padding: 18px 20px;
  background:
    linear-gradient(180deg, rgba(26, 20, 14, 0.98), rgba(9, 7, 5, 0.99)),
    radial-gradient(circle at 100% 0%, rgba(219, 139, 45, 0.16), transparent 38%) !important;
  border: 1px solid rgba(211, 132, 44, 0.40);
}

.grimhold-phase8-event-card,
.grimhold-phase8-event-card:link,
.grimhold-phase8-event-card:visited {
  min-height: 100%;
}

@media (max-width: 1280px) {
  .grimhold-homepage #ContentRow {
    top: 26px;
  }

  .grimhold-phase8-main {
    grid-template-columns: 1fr 1fr;
  }

  .grimhold-phase8-news-events__grid {
    grid-template-columns: 1fr;
  }
}

/* Carousel overflow fix: 3-column minimum (1282px) exceeds container at 1281-1342px viewport.
   Bumping breakpoint to 1380px ensures container (~1318px) is always wider than the minimum. */
@media (max-width: 1380px) {
  .grimhold-phase8-main {
    grid-template-columns: 1fr 1fr;
  }

  .grimhold-phase8-login {
    grid-column: 1 / -1;
  }

  .grimhold-phase8-news-events__grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 1100px) {
  .grimhold-home-news-row {
    flex-direction: column;
  }

  .grimhold-community-activity {
    width: 100%;
  }

  .grimhold-news-cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 860px) {
  .grimhold-homepage #ContentRow {
    top: 18px;
  }

  .grimhold-home-news-row {
    flex-direction: column;
  }

  .grimhold-community-activity {
    width: 100%;
  }

  .grimhold-news-cards {
    grid-template-columns: 1fr;
  }

  .grimhold-phase8-nav,
  .grimhold-phase8-main,
  .grimhold-phase8-stats,
  .grimhold-phase8-news-events__grid {
    grid-template-columns: 1fr;
  }

  .grimhold-phase8-stats > a,
  .grimhold-phase8-stats > a:link,
  .grimhold-phase8-stats > a:visited {
    border-right: 0;
    border-bottom: 1px solid rgba(214, 134, 45, 0.30);
  }

  .grimhold-phase8-stats > a:last-child {
    border-bottom: 0;
  }
}

/* Grimhold Phase 8D: homepage top navigation match */
.grimhold-homepage .grimhold-phase8-nav {
  grid-template-columns: 260px minmax(0, 1fr) 215px;
  min-height: 96px;
  padding: 0 18px 0 24px;
  background:
    linear-gradient(180deg, rgba(18, 19, 20, 0.98), rgba(5, 6, 7, 0.98)),
    radial-gradient(circle at 50% 0%, rgba(216, 160, 73, 0.10), transparent 46%);
  border: 1px solid rgba(214, 164, 82, 0.36);
  border-bottom-color: rgba(229, 174, 88, 0.54);
  box-shadow: 0 18px 38px rgba(0, 0, 0, 0.62), inset 0 1px 0 rgba(255, 229, 169, 0.08);
}

.grimhold-homepage .grimhold-phase8-nav__brand {
  height: 96px;
  align-items: center;
}

.grimhold-homepage .grimhold-phase8-nav__brand img {
  width: 224px;
  max-height: 82px;
  object-fit: contain;
  filter: drop-shadow(0 8px 14px rgba(0, 0, 0, 0.86)) drop-shadow(0 0 12px rgba(220, 169, 87, 0.18));
}

.grimhold-homepage .grimhold-phase8-nav__links {
  height: 96px;
  gap: 0;
  justify-content: center;
}

.grimhold-homepage .grimhold-phase8-nav__links a,
.grimhold-homepage .grimhold-phase8-nav__links a:link,
.grimhold-homepage .grimhold-phase8-nav__links a:visited {
  display: grid;
  grid-template-rows: 30px 18px;
  align-content: center;
  justify-items: center;
  min-width: clamp(78px, 5.8vw, 112px);
  height: 96px;
  padding: 16px 8px 13px;
  color: #aeb4b8 !important;
  font: 800 12px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif !important;
  text-align: center;
  text-decoration: none !important;
  text-transform: uppercase;
  border-left: 1px solid rgba(255, 255, 255, 0.035);
  border-right: 1px solid rgba(0, 0, 0, 0.40);
}

.grimhold-homepage .grimhold-phase8-nav__links a::after {
  bottom: 0;
  left: 16px;
  right: 16px;
  height: 3px;
  background: linear-gradient(90deg, transparent, rgba(232, 178, 88, 0.96), transparent);
}

.grimhold-homepage .grimhold-phase8-nav__links a:hover,
.grimhold-homepage .grimhold-phase8-nav__links a.is-active {
  color: #f0d08e !important;
  background:
    linear-gradient(180deg, rgba(230, 178, 88, 0.10), rgba(230, 178, 88, 0.02)),
    rgba(255, 255, 255, 0.015);
}

.grimhold-homepage .grimhold-phase8-nav__links a:hover::after,
.grimhold-homepage .grimhold-phase8-nav__links a.is-active::after {
  opacity: 1;
}

.grimhold-homepage .grimhold-phase8-nav__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  color: #d8a24c;
  font: 900 22px/1 Georgia, "Times New Roman", serif;
  text-shadow: 0 0 12px rgba(220, 169, 87, 0.28);
}

.grimhold-homepage .grimhold-phase8-nav__links a > span:last-child {
  display: block;
  letter-spacing: 0;
}

.grimhold-homepage .grimhold-phase8-nav__play,
.grimhold-homepage .grimhold-phase8-nav__play:link,
.grimhold-homepage .grimhold-phase8-nav__play:visited {
  position: relative;
  display: grid;
  grid-template-rows: auto auto;
  align-content: center;
  justify-items: center;
  min-height: 62px;
  padding: 0 18px 0 42px;
  color: #ffe0a0 !important;
  background:
    linear-gradient(180deg, rgba(93, 20, 18, 0.98), rgba(42, 8, 9, 0.98)),
    radial-gradient(circle at 50% 0%, rgba(226, 90, 47, 0.25), transparent 52%);
  border: 1px solid rgba(230, 179, 91, 0.76);
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.48), inset 0 1px 0 rgba(255, 223, 151, 0.18);
}

.grimhold-homepage .grimhold-phase8-nav__play::before {
  position: absolute;
  left: 18px;
  top: 50%;
  content: "⚔";
  color: #e5b45d;
  font: 900 20px/1 Georgia, "Times New Roman", serif;
  transform: translateY(-50%);
  text-shadow: 0 0 10px rgba(229, 180, 93, 0.30);
}

.grimhold-homepage .grimhold-phase8-nav__play span {
  display: block;
  color: #ffe0a0;
  font: 900 16px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-transform: uppercase;
}

.grimhold-homepage .grimhold-phase8-nav__play em {
  display: block;
  margin-top: 5px;
  color: #d8a24c;
  font: 800 10px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  font-style: normal;
  text-transform: uppercase;
}

.grimhold-homepage .grimhold-phase8-nav__play:hover {
  border-color: rgba(255, 220, 139, 0.95);
  box-shadow: 0 16px 32px rgba(82, 12, 10, 0.50), 0 0 18px rgba(224, 161, 72, 0.18), inset 0 1px 0 rgba(255, 223, 151, 0.24);
}

@media (max-width: 1280px) {
  .grimhold-homepage .grimhold-phase8-nav {
    grid-template-columns: 220px minmax(0, 1fr) 190px;
  }

  .grimhold-homepage .grimhold-phase8-nav__brand img {
    width: 200px;
  }

  .grimhold-homepage .grimhold-phase8-nav__links a,
  .grimhold-homepage .grimhold-phase8-nav__links a:link,
  .grimhold-homepage .grimhold-phase8-nav__links a:visited {
    min-width: 70px;
    font-size: 11px !important;
  }
}

@media (max-width: 860px) {
  .grimhold-homepage .grimhold-phase8-nav {
    grid-template-columns: 1fr;
    gap: 10px;
    padding: 14px;
  }

  .grimhold-homepage .grimhold-phase8-nav__brand,
  .grimhold-homepage .grimhold-phase8-nav__links {
    height: auto;
  }

  .grimhold-homepage .grimhold-phase8-nav__links {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .grimhold-homepage .grimhold-phase8-nav__links a,
  .grimhold-homepage .grimhold-phase8-nav__links a:link,
  .grimhold-homepage .grimhold-phase8-nav__links a:visited {
    height: 70px;
    min-width: 0;
  }
}

/* Grimhold Phase 8E: homepage top navigation logo fix */
.grimhold-homepage .grimhold-phase8-nav {
  grid-template-columns: 330px minmax(0, 1fr) 215px;
}

.grimhold-homepage .grimhold-phase8-nav__brand {
  position: relative;
  min-width: 0;
  height: 96px;
  overflow: visible;
}

.grimhold-homepage .grimhold-phase8-nav__brand::before {
  position: absolute;
  left: -26px;
  top: 50%;
  width: 350px;
  height: 118px;
  content: "";
  pointer-events: none;
  background:
    radial-gradient(ellipse at 45% 50%, rgba(241, 197, 108, 0.24), rgba(186, 112, 35, 0.11) 40%, transparent 72%);
  filter: blur(10px);
  transform: translateY(-50%);
  z-index: 0;
}

.grimhold-homepage .grimhold-phase8-nav__brand img {
  position: relative;
  z-index: 1;
  width: 310px;
  max-width: 100%;
  max-height: 104px;
  object-fit: contain;
  filter:
    brightness(1.18)
    contrast(1.12)
    saturate(1.10)
    drop-shadow(0 10px 16px rgba(0, 0, 0, 0.92))
    drop-shadow(0 0 18px rgba(233, 179, 83, 0.34));
}

@media (max-width: 1280px) {
  .grimhold-homepage .grimhold-phase8-nav {
    grid-template-columns: 270px minmax(0, 1fr) 190px;
  }

  .grimhold-homepage .grimhold-phase8-nav__brand::before {
    width: 290px;
  }

  .grimhold-homepage .grimhold-phase8-nav__brand img {
    width: 255px;
    max-height: 94px;
  }
}

@media (max-width: 860px) {
  .grimhold-homepage .grimhold-phase8-nav {
    grid-template-columns: 1fr;
  }

  .grimhold-homepage .grimhold-phase8-nav__brand {
    justify-content: center;
  }

  .grimhold-homepage .grimhold-phase8-nav__brand::before {
    left: 50%;
    width: min(340px, 92vw);
    transform: translate(-50%, -50%);
  }

  .grimhold-homepage .grimhold-phase8-nav__brand img {
    width: min(300px, 82vw);
  }
}

/* Grimhold Phase 8F: homepage top logo overlay placement */
.grimhold-homepage .grimhold-phase8-nav {
  position: relative;
  grid-template-columns: 390px minmax(0, 1fr) 215px;
  min-height: 88px;
  overflow: visible;
  padding-left: 26px;
}

.grimhold-homepage .grimhold-phase8-nav__brand {
  position: relative;
  z-index: 4;
  align-self: stretch;
  width: 390px;
  height: 88px;
  overflow: visible;
  transform: translateY(-26px);
}

.grimhold-homepage .grimhold-phase8-nav__brand::before {
  left: -42px;
  top: 50%;
  width: 430px;
  height: 160px;
  background:
    radial-gradient(ellipse at 48% 50%, rgba(244, 205, 118, 0.28), rgba(188, 115, 38, 0.13) 38%, rgba(0, 0, 0, 0.18) 62%, transparent 76%);
  filter: blur(12px);
}

.grimhold-homepage .grimhold-phase8-nav__brand::after {
  position: absolute;
  left: -18px;
  top: 50%;
  width: 350px;
  height: 112px;
  content: "";
  pointer-events: none;
  background: linear-gradient(180deg, rgba(4, 5, 6, 0.72), rgba(4, 5, 6, 0.18));
  border: 1px solid rgba(218, 166, 82, 0.18);
  transform: translateY(-50%);
  z-index: 0;
}

.grimhold-homepage .grimhold-phase8-nav__brand img {
  position: relative;
  z-index: 2;
  width: 370px;
  max-width: none;
  max-height: 138px;
  transform: translateY(4px);
  filter:
    brightness(1.24)
    contrast(1.16)
    saturate(1.12)
    drop-shadow(0 16px 20px rgba(0, 0, 0, 0.96))
    drop-shadow(0 0 24px rgba(235, 184, 88, 0.42));
}

.grimhold-homepage .grimhold-phase8-nav__links {
  position: relative;
  z-index: 2;
}

.grimhold-homepage .grimhold-phase8-nav__play {
  position: relative;
  z-index: 2;
}

@media (max-width: 1280px) {
  .grimhold-homepage .grimhold-phase8-nav {
    grid-template-columns: 310px minmax(0, 1fr) 190px;
  }

  .grimhold-homepage .grimhold-phase8-nav__brand {
    width: 310px;
    transform: translateY(-18px);
  }

  .grimhold-homepage .grimhold-phase8-nav__brand::before {
    width: 350px;
    height: 138px;
  }

  .grimhold-homepage .grimhold-phase8-nav__brand::after {
    width: 290px;
    height: 96px;
  }

  .grimhold-homepage .grimhold-phase8-nav__brand img {
    width: 300px;
    max-height: 118px;
  }
}

@media (max-width: 860px) {
  .grimhold-homepage .grimhold-phase8-nav {
    grid-template-columns: 1fr;
    padding-left: 14px;
    padding-top: 22px;
  }

  .grimhold-homepage .grimhold-phase8-nav__brand {
    justify-content: center;
    width: 100%;
    height: 96px;
    transform: translateY(-12px);
  }

  .grimhold-homepage .grimhold-phase8-nav__brand::before {
    left: 50%;
    width: min(390px, 96vw);
    height: 140px;
    transform: translate(-50%, -50%);
  }

  .grimhold-homepage .grimhold-phase8-nav__brand::after {
    left: 50%;
    width: min(320px, 88vw);
    transform: translate(-50%, -50%);
  }

  .grimhold-homepage .grimhold-phase8-nav__brand img {
    width: min(340px, 88vw);
    max-height: 126px;
  }
}

/* Grimhold header logo placement fix: remove boxed logo backplate */
.grimhold-homepage .grimhold-phase8-nav {
  align-items: center;
}

.grimhold-homepage .grimhold-phase8-nav__brand {
  align-items: center;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.grimhold-homepage .grimhold-phase8-nav__brand::before {
  left: -34px;
  top: 50%;
  width: 410px;
  height: 150px;
  background: radial-gradient(ellipse at 48% 50%, rgba(244, 205, 118, 0.30), rgba(188, 115, 38, 0.12) 34%, transparent 68%);
  filter: blur(14px);
  border: 0 !important;
  box-shadow: none !important;
}

.grimhold-homepage .grimhold-phase8-nav__brand::after {
  display: none !important;
  content: none !important;
}

.grimhold-homepage .grimhold-phase8-nav__brand img {
  transform: translateY(2px);
  filter:
    brightness(1.24)
    contrast(1.16)
    saturate(1.12)
    drop-shadow(0 16px 20px rgba(0, 0, 0, 0.96))
    drop-shadow(0 0 26px rgba(235, 184, 88, 0.44));
}

.grimhold-homepage .grimhold-phase8-nav__links,
.grimhold-homepage .grimhold-phase8-nav__play {
  align-self: center;
}

@media (max-width: 1280px) {
  .grimhold-homepage .grimhold-phase8-nav__brand::before {
    left: -26px;
    width: 340px;
    height: 132px;
  }
}

@media (max-width: 860px) {
  .grimhold-homepage .grimhold-phase8-nav__brand::before {
    left: 50%;
    width: min(380px, 94vw);
    height: 138px;
    transform: translate(-50%, -50%);
  }
}

/* Grimhold header logo alignment correction */
.grimhold-homepage .grimhold-phase8-nav {
  grid-template-columns: 380px minmax(0, 1fr) 215px;
  min-height: 104px;
  align-items: center;
  overflow: hidden;
}

.grimhold-homepage .grimhold-phase8-nav__brand {
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  width: 380px;
  height: 104px;
  transform: none !important;
  overflow: visible;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.grimhold-homepage .grimhold-phase8-nav__brand::before {
  left: 50%;
  top: 50%;
  width: 360px;
  height: 92px;
  background: radial-gradient(ellipse at center, rgba(244, 205, 118, 0.24), rgba(188, 115, 38, 0.10) 36%, transparent 70%);
  border: 0 !important;
  box-shadow: none !important;
  filter: blur(12px);
  transform: translate(-50%, -50%);
}

.grimhold-homepage .grimhold-phase8-nav__brand::after {
  display: none !important;
  content: none !important;
}

.grimhold-homepage .grimhold-phase8-nav__brand img {
  width: 350px;
  max-width: 100%;
  max-height: 96px;
  object-fit: contain;
  transform: none !important;
  filter:
    brightness(1.22)
    contrast(1.14)
    saturate(1.10)
    drop-shadow(0 10px 16px rgba(0, 0, 0, 0.88))
    drop-shadow(0 0 22px rgba(235, 184, 88, 0.36));
}

@media (max-width: 1280px) {
  .grimhold-homepage .grimhold-phase8-nav {
    grid-template-columns: 300px minmax(0, 1fr) 190px;
    min-height: 98px;
  }

  .grimhold-homepage .grimhold-phase8-nav__brand {
    width: 300px;
    height: 98px;
  }

  .grimhold-homepage .grimhold-phase8-nav__brand::before {
    width: 290px;
    height: 86px;
  }

  .grimhold-homepage .grimhold-phase8-nav__brand img {
    width: 285px;
    max-height: 90px;
  }
}

@media (max-width: 860px) {
  .grimhold-homepage .grimhold-phase8-nav {
    grid-template-columns: 1fr;
    min-height: 0;
    overflow: visible;
  }

  .grimhold-homepage .grimhold-phase8-nav__brand {
    width: 100%;
    height: 98px;
  }

  .grimhold-homepage .grimhold-phase8-nav__brand::before {
    width: min(330px, 88vw);
    height: 88px;
  }

  .grimhold-homepage .grimhold-phase8-nav__brand img {
    width: min(320px, 84vw);
    max-height: 92px;
  }
}

/* Grimhold header logo top-anchored overlay correction */
.grimhold-homepage .grimhold-phase8-nav {
  position: relative;
  grid-template-columns: 420px minmax(0, 1fr) 215px;
  min-height: 104px;
  align-items: stretch;
  overflow: visible !important;
}

.grimhold-homepage .grimhold-phase8-nav__brand {
  position: relative;
  z-index: 5;
  display: block;
  align-self: start;
  width: 420px;
  height: 104px;
  overflow: visible !important;
  transform: none !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.grimhold-homepage .grimhold-phase8-nav__brand::before {
  position: absolute;
  left: 50%;
  top: 64px;
  width: 430px;
  height: 150px;
  content: "";
  pointer-events: none;
  background: radial-gradient(ellipse at center, rgba(244, 205, 118, 0.24), rgba(188, 115, 38, 0.10) 36%, transparent 70%);
  border: 0 !important;
  box-shadow: none !important;
  filter: blur(14px);
  transform: translate(-50%, -50%);
  z-index: 0;
}

.grimhold-homepage .grimhold-phase8-nav__brand::after {
  display: none !important;
  content: none !important;
}

.grimhold-homepage .grimhold-phase8-nav__brand img {
  position: absolute;
  left: 50%;
  top: 0;
  z-index: 2;
  width: 400px;
  max-width: none;
  max-height: none !important;
  height: auto;
  object-fit: contain;
  transform: translateX(-50%) !important;
  filter:
    brightness(1.22)
    contrast(1.14)
    saturate(1.10)
    drop-shadow(0 12px 18px rgba(0, 0, 0, 0.92))
    drop-shadow(0 0 24px rgba(235, 184, 88, 0.38));
}

.grimhold-homepage .grimhold-phase8-nav__links,
.grimhold-homepage .grimhold-phase8-nav__play {
  align-self: center;
}

@media (max-width: 1280px) {
  .grimhold-homepage .grimhold-phase8-nav {
    grid-template-columns: 330px minmax(0, 1fr) 190px;
    overflow: visible !important;
  }

  .grimhold-homepage .grimhold-phase8-nav__brand {
    width: 330px;
    height: 98px;
  }

  .grimhold-homepage .grimhold-phase8-nav__brand::before {
    top: 58px;
    width: 340px;
    height: 130px;
  }

  .grimhold-homepage .grimhold-phase8-nav__brand img {
    width: 320px;
    max-height: none !important;
  }
}

@media (max-width: 860px) {
  .grimhold-homepage .grimhold-phase8-nav {
    grid-template-columns: 1fr;
    overflow: visible !important;
  }

  .grimhold-homepage .grimhold-phase8-nav__brand {
    width: 100%;
    height: 110px;
  }

  .grimhold-homepage .grimhold-phase8-nav__brand::before {
    top: 62px;
    width: min(390px, 94vw);
    height: 140px;
  }

  .grimhold-homepage .grimhold-phase8-nav__brand img {
    width: min(370px, 90vw);
    max-height: none !important;
  }
}

/* Grimhold logo vertical position adjustment */
.grimhold-homepage .grimhold-phase8-nav__brand img {
  top: -8px;
}

/* Grimhold logo vertical position adjustment 2 */
.grimhold-homepage .grimhold-phase8-nav__brand img {
  top: -44px;
}

/* Grimhold logo vertical position adjustment 3 */
.grimhold-homepage .grimhold-phase8-nav__brand img {
  top: -56px;
}

/* Grimhold logo glow reduction */
.grimhold-homepage .grimhold-phase8-nav__brand::before {
  background: radial-gradient(ellipse at center, rgba(244, 205, 118, 0.06), rgba(188, 115, 38, 0.025) 34%, transparent 68%);
  filter: blur(10px);
}

.grimhold-homepage .grimhold-phase8-nav__brand img {
  filter:
    brightness(1.16)
    contrast(1.10)
    saturate(1.06)
    drop-shadow(0 12px 18px rgba(0, 0, 0, 0.92))
    drop-shadow(0 0 8px rgba(235, 184, 88, 0.10));
}

/* Grimhold homepage fixed background.
   All three layers use fixed attachment so they stay anchored to the viewport
   while content scrolls — prevents progressive darkening on scroll. */
body.grimhold-homepage {
  background:
    linear-gradient(180deg, rgba(2, 2, 3, 0.48), rgba(2, 2, 3, 0.70)) fixed,
    radial-gradient(circle at 50% 42%, rgba(120, 22, 12, 0.16), transparent 46%) fixed,
    url("images/branding/Background.png") center center / cover fixed no-repeat !important;
}

/* Suppress the global body::before dark-gradient overlay on the homepage. */
body.grimhold-homepage::before {
  content: none !important;
  display: none !important;
}

.grimhold-homepage #ArtworkHelper,
.grimhold-homepage #Bodycontainer {
  background: transparent !important;
  box-shadow: none !important;
}

/* Cover the html canvas with the same background so #090705 doesn't bleed through. */
html:has(body.grimhold-homepage) {
  background:
    linear-gradient(180deg, rgba(2, 2, 3, 0.48), rgba(2, 2, 3, 0.70)) fixed,
    url("images/branding/Background.png") center center / cover fixed no-repeat;
}

.grimhold-homepage #ContentHelper {
  background:
    linear-gradient(180deg, rgba(0, 0, 0, 0.18), transparent 280px),
    radial-gradient(circle at 50% 0%, rgba(0, 0, 0, 0.24), transparent 420px) !important;
}

/* Grimhold homepage Font Awesome navigation icons */
.grimhold-homepage .grimhold-phase8-nav__links .grimhold-phase8-nav__icon {
  color: #d8a64a;
  font-size: 21px;
  line-height: 1;
}

.grimhold-homepage .grimhold-phase8-nav__links a:hover .grimhold-phase8-nav__icon,
.grimhold-homepage .grimhold-phase8-nav__links a.is-active .grimhold-phase8-nav__icon {
  color: #e7bd66;
}

/* Grimhold homepage inline SVG navigation icons */
.grimhold-homepage .grimhold-phase8-nav__links svg.grimhold-phase8-nav__icon {
  width: 24px;
  height: 24px;
  color: #d6a24a;
  fill: currentColor;
  stroke: none;
}

.grimhold-homepage .grimhold-phase8-nav__links a:hover svg.grimhold-phase8-nav__icon,
.grimhold-homepage .grimhold-phase8-nav__links a.is-active svg.grimhold-phase8-nav__icon {
  color: #e7bd66;
}

/* Grimhold homepage SVG navigation icon rendering refinement */
.grimhold-homepage .grimhold-phase8-nav__links svg.grimhold-phase8-nav__icon {
  width: 30px;
  height: 30px;
  vector-effect: non-scaling-stroke;
  shape-rendering: geometricPrecision;
}

/* Wiki and Discord use fill-based SVGs — override stroke defaults */
.grimhold-homepage .grimhold-phase8-nav__links a.grimhold-nav--fill svg.grimhold-phase8-nav__icon {
  fill: currentColor;
  stroke: none;
  stroke-width: 0;
}

/* Grimhold homepage top navigation dark metal background refinement */
.grimhold-homepage .grimhold-phase8-nav {
  background-color: #080909;
  background-image:
    linear-gradient(180deg, rgba(255, 244, 208, 0.035) 0%, rgba(255, 244, 208, 0.010) 18%, rgba(0, 0, 0, 0.18) 100%),
    radial-gradient(circle at 48% 0%, rgba(184, 135, 53, 0.075), transparent 38%),
    linear-gradient(90deg, rgba(0, 0, 0, 0.34), rgba(22, 19, 16, 0.62) 24%, rgba(16, 16, 16, 0.86) 52%, rgba(10, 11, 11, 0.96)),
    repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.018) 0 1px, transparent 1px 5px),
    linear-gradient(180deg, #161310 0%, #0d0e0e 48%, #050606 100%);
  border-top: 1px solid rgba(184, 135, 53, 0.36);
  border-bottom: 1px solid rgba(138, 100, 40, 0.62);
  border-left-color: rgba(138, 100, 40, 0.22);
  border-right-color: rgba(138, 100, 40, 0.22);
  box-shadow:
    inset 0 1px 0 rgba(255, 239, 188, 0.055),
    inset 0 -16px 26px rgba(0, 0, 0, 0.38),
    inset 0 0 36px rgba(0, 0, 0, 0.26),
    0 18px 34px rgba(0, 0, 0, 0.58);
}

.grimhold-homepage .grimhold-phase8-nav__links a,
.grimhold-homepage .grimhold-phase8-nav__links a:link,
.grimhold-homepage .grimhold-phase8-nav__links a:visited {
  border-left-color: rgba(184, 135, 53, 0.055);
  border-right-color: rgba(0, 0, 0, 0.52);
}


/* Grimhold top navigation Wiki dropdown */
.grimhold-homepage .grimhold-phase8-nav__dropdown {
  position: relative;
  display: flex;
  align-self: stretch;
  min-width: 0;
}

.grimhold-homepage .grimhold-phase8-nav__dropdown-toggle,
.grimhold-homepage .grimhold-phase8-nav__dropdown-toggle:link,
.grimhold-homepage .grimhold-phase8-nav__dropdown-toggle:visited {
  width: 100%;
}

.grimhold-homepage .grimhold-phase8-nav__dropdown-arrow {
  display: block;
  margin-top: -3px;
  color: currentColor;
  font-size: 13px;
  line-height: 1;
  opacity: 0.78;
}

.grimhold-homepage .grimhold-phase8-nav__dropdown-menu {
  position: absolute;
  top: calc(100% - 1px);
  left: 50%;
  z-index: 120;
  display: grid;
  min-width: 200px;
  max-width: 220px;
  padding: 6px 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate(-50%, -4px);
  background:
    linear-gradient(180deg, rgba(13, 13, 12, 0.98), rgba(5, 5, 5, 0.98)),
    url("images/branding/navbar-texture-dark.png") center / cover repeat;
  border: 1px solid rgba(139, 100, 40, 0.68);
  box-shadow:
    0 12px 22px rgba(0, 0, 0, 0.52),
    inset 0 1px 0 rgba(239, 200, 120, 0.08);
  transition: opacity 120ms ease, transform 120ms ease, visibility 120ms ease;
}

.grimhold-homepage .grimhold-phase8-nav__dropdown::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  height: 8px;
  z-index: 119;
}

.grimhold-homepage .grimhold-phase8-nav__dropdown:hover .grimhold-phase8-nav__dropdown-menu,
.grimhold-homepage .grimhold-phase8-nav__dropdown:focus-within .grimhold-phase8-nav__dropdown-menu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate(-50%, 0);
}

.grimhold-homepage .grimhold-phase8-nav__links .grimhold-phase8-nav__dropdown-menu a,
.grimhold-homepage .grimhold-phase8-nav__links .grimhold-phase8-nav__dropdown-menu a:link,
.grimhold-homepage .grimhold-phase8-nav__links .grimhold-phase8-nav__dropdown-menu a:visited {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: auto;
  min-width: 0;
  min-height: 0;
  height: auto;
  padding: 9px 14px;
  color: #d8c39a;
  font: 800 12px/1.2 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.045em;
  text-align: left;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  border: 0;
  border-bottom: 1px solid rgba(139, 100, 40, 0.12);
  background: transparent;
  box-shadow: none;
}

.grimhold-homepage .grimhold-phase8-nav__links .grimhold-phase8-nav__dropdown-menu a:last-child {
  border-bottom: 0;
}

.grimhold-homepage .grimhold-phase8-nav__links .grimhold-phase8-nav__dropdown-menu a:hover,
.grimhold-homepage .grimhold-phase8-nav__links .grimhold-phase8-nav__dropdown-menu a:focus {
  color: #f0d28f;
  background: linear-gradient(90deg, rgba(216, 166, 74, 0.13), rgba(0, 0, 0, 0.04));
  outline: none;
}

@media (max-width: 1100px) {
  .grimhold-homepage .grimhold-phase8-nav__dropdown {
    align-self: auto;
  }

  .grimhold-homepage .grimhold-phase8-nav__dropdown-menu {
    left: 0;
    transform: translateY(-4px);
  }

  .grimhold-homepage .grimhold-phase8-nav__dropdown:hover .grimhold-phase8-nav__dropdown-menu,
  .grimhold-homepage .grimhold-phase8-nav__dropdown:focus-within .grimhold-phase8-nav__dropdown-menu {
    transform: translateY(0);
  }
}

/* Grimhold homepage navbar texture asset */
.grimhold-homepage .grimhold-phase8-nav {
  background-color: #070808;
  background-image:
    linear-gradient(180deg, rgba(0, 0, 0, 0.10), rgba(0, 0, 0, 0.34)),
    url("images/branding/navbar-texture-dark.png") !important;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  border-top: 1px solid rgba(150, 114, 55, 0.34);
  border-bottom: 1px solid rgba(117, 83, 35, 0.58);
  border-left-color: rgba(117, 83, 35, 0.18);
  border-right-color: rgba(117, 83, 35, 0.18);
  box-shadow:
    inset 0 1px 0 rgba(221, 179, 100, 0.035),
    inset 0 -12px 20px rgba(0, 0, 0, 0.36),
    0 18px 34px rgba(0, 0, 0, 0.58);
}

/* Grimhold homepage Play Now texture surface */
.grimhold-homepage .grimhold-phase8-nav__play,
.grimhold-homepage .grimhold-phase8-nav__play:link,
.grimhold-homepage .grimhold-phase8-nav__play:visited {
  background-color: #3b0d0d;
  background-image:
    linear-gradient(180deg, rgba(0, 0, 0, 0.04), rgba(0, 0, 0, 0.30)),
    url("images/branding/texture-red.png") !important;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  border-color: rgba(174, 126, 58, 0.68);
  box-shadow:
    inset 0 1px 0 rgba(255, 221, 156, 0.10),
    inset 0 -10px 18px rgba(0, 0, 0, 0.28),
    0 12px 24px rgba(0, 0, 0, 0.42);
}

.grimhold-homepage .grimhold-phase8-nav__play:hover {
  background-image:
    linear-gradient(180deg, rgba(255, 255, 255, 0.025), rgba(0, 0, 0, 0.24)),
    url("images/branding/texture-red.png") !important;
  border-color: rgba(190, 143, 70, 0.78);
  box-shadow:
    inset 0 1px 0 rgba(255, 221, 156, 0.13),
    inset 0 -10px 18px rgba(0, 0, 0, 0.26),
    0 14px 26px rgba(0, 0, 0, 0.46);
}

/* Grimhold homepage Play Now internal frame refinement */
.grimhold-homepage .grimhold-phase8-nav__play,
.grimhold-homepage .grimhold-phase8-nav__play:link,
.grimhold-homepage .grimhold-phase8-nav__play:visited {
  color: #f1d28d !important;
  background-color: #3b0d0d;
  background-image:
    linear-gradient(180deg, rgba(255, 220, 150, 0.035), rgba(0, 0, 0, 0.18) 52%, rgba(0, 0, 0, 0.34)),
    url("images/branding/texture-red.png") !important;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  border: 1px solid rgba(78, 31, 23, 0.55);
  box-shadow:
    inset 0 0 0 1px rgba(218, 165, 82, 0.34),
    inset 0 0 0 2px rgba(20, 6, 5, 0.46),
    inset 0 1px 0 rgba(255, 226, 163, 0.11),
    inset 0 -12px 18px rgba(0, 0, 0, 0.34),
    inset 10px 0 18px rgba(0, 0, 0, 0.18),
    inset -10px 0 18px rgba(0, 0, 0, 0.18),
    0 10px 18px rgba(0, 0, 0, 0.34);
}

.grimhold-homepage .grimhold-phase8-nav__play::before {
  color: #f1d28d;
  font-size: 19px;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.84);
}

.grimhold-homepage .grimhold-phase8-nav__play span {
  color: #f2d28f;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 18px;
  font-weight: 800;
  letter-spacing: 0;
  text-shadow: 0 2px 2px rgba(0, 0, 0, 0.86), 0 0 8px rgba(0, 0, 0, 0.42);
}

.grimhold-homepage .grimhold-phase8-nav__play em {
  color: #c89b58;
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.84);
}

.grimhold-homepage .grimhold-phase8-nav__play:hover {
  background-image:
    linear-gradient(180deg, rgba(255, 220, 150, 0.055), rgba(0, 0, 0, 0.15) 52%, rgba(0, 0, 0, 0.30)),
    url("images/branding/texture-red.png") !important;
  border-color: rgba(92, 36, 25, 0.62);
  box-shadow:
    inset 0 0 0 1px rgba(226, 174, 91, 0.42),
    inset 0 0 0 2px rgba(20, 6, 5, 0.42),
    inset 0 1px 0 rgba(255, 226, 163, 0.13),
    inset 0 -12px 18px rgba(0, 0, 0, 0.31),
    inset 10px 0 18px rgba(0, 0, 0, 0.16),
    inset -10px 0 18px rgba(0, 0, 0, 0.16),
    0 10px 18px rgba(0, 0, 0, 0.36);
}

/* Grimhold homepage Play Now complete asset background */
.grimhold-homepage .grimhold-phase8-nav__play,
.grimhold-homepage .grimhold-phase8-nav__play:link,
.grimhold-homepage .grimhold-phase8-nav__play:visited {
  background-color: transparent;
  background-image: url("images/branding/play-now-texture-red.png") !important;
  background-position: center center;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  border-color: transparent;
  box-shadow: none;
}

.grimhold-homepage .grimhold-phase8-nav__play:hover {
  background-image: url("images/branding/play-now-texture-red.png") !important;
  background-position: center center;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  border-color: transparent;
  box-shadow: none;
}

.grimhold-homepage .grimhold-phase8-nav__play::before,
.grimhold-homepage .grimhold-phase8-nav__play span,
.grimhold-homepage .grimhold-phase8-nav__play em {
  position: relative;
  z-index: 1;
}

/* Grimhold homepage Play Now final asset integration */
.grimhold-homepage .grimhold-phase8-nav__play,
.grimhold-homepage .grimhold-phase8-nav__play:link,
.grimhold-homepage .grimhold-phase8-nav__play:visited {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  grid-template-rows: auto auto;
  column-gap: 8px;
  align-content: center;
  align-items: center;
  justify-items: start;
  width: 214px;
  min-height: 76px;
  padding: 0 22px 0 28px;
  color: #f0d08e !important;
  background-color: transparent;
  background-image: url("images/branding/play-now-bg.png") !important;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  border: 0;
  box-shadow: none;
}

.grimhold-homepage .grimhold-phase8-nav__play::before {
  position: relative;
  left: auto;
  top: auto;
  grid-column: 1;
  grid-row: 1 / span 2;
  justify-self: center;
  align-self: center;
  color: #f0d08e;
  font-size: 21px;
  transform: none;
  text-shadow: 0 2px 2px rgba(0, 0, 0, 0.86);
}

.grimhold-homepage .grimhold-phase8-nav__play span {
  grid-column: 2;
  grid-row: 1;
  align-self: end;
  color: #f2d28f;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 20px;
  font-weight: 800;
  line-height: 1;
  text-align: left;
  text-shadow: 0 2px 2px rgba(0, 0, 0, 0.88);
}

.grimhold-homepage .grimhold-phase8-nav__play em {
  grid-column: 2;
  grid-row: 2;
  align-self: start;
  margin-top: 5px;
  color: #c99c58;
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
  text-align: left;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.86);
}

.grimhold-homepage .grimhold-phase8-nav__play:hover {
  background-image: url("images/branding/play-now-bg.png") !important;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  border: 0;
  box-shadow: none;
}

/* Grimhold homepage Play Now content composition fix */
.grimhold-homepage .grimhold-phase8-nav__play,
.grimhold-homepage .grimhold-phase8-nav__play:link,
.grimhold-homepage .grimhold-phase8-nav__play:visited {
  grid-template-columns: 30px max-content;
  column-gap: 8px;
  justify-content: center;
  justify-items: start;
  padding: 0 12px 0 14px;
}

.grimhold-homepage .grimhold-phase8-nav__play::before {
  justify-self: center;
  align-self: center;
  font-size: 19px;
}

.grimhold-homepage .grimhold-phase8-nav__play span {
  white-space: nowrap;
  font-size: 18px;
  line-height: 1;
}

.grimhold-homepage .grimhold-phase8-nav__play em {
  white-space: nowrap;
  font-size: 9px;
  line-height: 1;
  margin-top: 4px;
}

/* Grimhold homepage Play Now content alignment tune */
.grimhold-homepage .grimhold-phase8-nav__play,
.grimhold-homepage .grimhold-phase8-nav__play:link,
.grimhold-homepage .grimhold-phase8-nav__play:visited {
  grid-template-columns: 28px max-content;
  column-gap: 5px;
  align-content: center;
  align-items: center;
}

.grimhold-homepage .grimhold-phase8-nav__play::before {
  transform: translateY(-3px);
  font-size: 18px;
}

.grimhold-homepage .grimhold-phase8-nav__play span {
  transform: translateY(2px);
  font-size: 18px;
  font-weight: 900;
  line-height: 0.95;
}

.grimhold-homepage .grimhold-phase8-nav__play em {
  transform: translateY(2px);
  margin-top: 5px;
  font-size: 9px;
  font-weight: 900;
  line-height: 0.95;
}

/* Grimhold homepage Play Now horizontal content offset */
.grimhold-homepage .grimhold-phase8-nav__play,
.grimhold-homepage .grimhold-phase8-nav__play:link,
.grimhold-homepage .grimhold-phase8-nav__play:visited {
  padding-left: 4px;
  padding-right: 22px;
}

/* Grimhold homepage Play Now subtle hover interaction */
.grimhold-homepage .grimhold-phase8-nav__play,
.grimhold-homepage .grimhold-phase8-nav__play:link,
.grimhold-homepage .grimhold-phase8-nav__play:visited {
  transition: transform 140ms ease, filter 140ms ease, box-shadow 140ms ease;
}

.grimhold-homepage .grimhold-phase8-nav__play:hover {
  filter: brightness(1.07) saturate(1.08);
  transform: translateY(-1px);
  box-shadow: inset 0 0 18px rgba(120, 24, 18, 0.22), 0 10px 18px rgba(0, 0, 0, 0.30);
}

.grimhold-homepage .grimhold-phase8-nav__play:hover::before,
.grimhold-homepage .grimhold-phase8-nav__play:hover span {
  color: #f6d99a;
}

.grimhold-homepage .grimhold-phase8-nav__play:hover em {
  color: #d5aa66;
}

/* Grimhold homepage Play Now hover silhouette correction */
.grimhold-homepage .grimhold-phase8-nav__play:hover {
  filter: brightness(1.07) saturate(1.08);
  transform: translateY(-1px);
  box-shadow: none !important;
}

/* Grimhold account creation success next step */
.grimhold-account-created-next-step {
  margin: 18px auto 14px;
  padding: 18px 20px;
  max-width: 560px;
  text-align: center;
  color: #ead6ad;
  background: linear-gradient(180deg, rgba(31, 18, 10, 0.96), rgba(10, 7, 5, 0.98));
  border: 1px solid rgba(199, 124, 45, 0.38);
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 224, 151, 0.08);
}

.grimhold-account-created-next-step p {
  margin: 0 0 14px;
  color: #dfc49a;
  font: 14px/1.5 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
}

.grimhold-account-created-next-step a,
.grimhold-account-created-next-step a:link,
.grimhold-account-created-next-step a:visited {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 24px;
  color: #211005 !important;
  font: 900 13px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-decoration: none !important;
  background: linear-gradient(180deg, #f1cd7e, #b86b27);
  border: 1px solid rgba(255, 224, 151, 0.58);
  box-shadow: 0 10px 18px rgba(0, 0, 0, 0.32), inset 0 1px 0 rgba(255, 245, 204, 0.24);
}

.grimhold-account-created-next-step a:hover {
  color: #120704 !important;
  filter: brightness(1.05);
}

/* Grimhold homepage showcase intro Astera alignment */
.grimhold-homepage .grimhold-phase8-intro {
  padding: clamp(18px, 2vw, 34px) clamp(8px, 1.4vw, 22px);
  color: #eadab7;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

.grimhold-homepage .grimhold-phase8-intro::before,
.grimhold-homepage .grimhold-phase8-intro::after {
  display: none !important;
  content: none !important;
}

.grimhold-homepage .grimhold-phase8-intro h1 {
  max-width: 620px;
  margin: 0 0 14px;
  color: #f1d18c;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(36px, 3vw, 54px);
  font-weight: 900;
  line-height: 1.04;
  letter-spacing: 0;
  text-shadow: 0 3px 3px rgba(0, 0, 0, 0.92), 0 0 18px rgba(105, 55, 18, 0.34);
}

.grimhold-homepage .grimhold-phase8-intro p {
  max-width: 590px;
  margin: 0 0 22px;
  color: #dcc8a2;
  font: 17px/1.55 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-shadow: 0 2px 3px rgba(0, 0, 0, 0.86);
}

.grimhold-homepage .grimhold-phase8-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-phase8-intro-cta,
.grimhold-homepage .grimhold-phase8-actions .grimhold-phase8-intro-cta:link,
.grimhold-homepage .grimhold-phase8-actions .grimhold-phase8-intro-cta:visited {
  position: relative;
  display: inline-grid;
  grid-template-columns: 28px max-content;
  column-gap: 7px;
  align-content: center;
  align-items: center;
  justify-content: center;
  width: 214px;
  min-width: 214px;
  min-height: 76px;
  padding: 0 20px 0 12px;
  color: #f0d08e !important;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 17px;
  font-weight: 900;
  line-height: 1;
  text-align: left;
  text-decoration: none !important;
  text-transform: uppercase;
  white-space: nowrap;
  background-color: transparent !important;
  background-image: url("images/branding/play-now-bg.png") !important;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  border: 0 !important;
  box-shadow: none !important;
  text-shadow: 0 2px 2px rgba(0, 0, 0, 0.88);
  transition: transform 140ms ease, filter 140ms ease, color 140ms ease;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-phase8-intro-cta::before {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #f0d08e;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 18px;
  line-height: 1;
  text-shadow: 0 2px 2px rgba(0, 0, 0, 0.86);
  transform: translateY(-1px);
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-phase8-intro-cta--play::before {
  content: "†";
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-phase8-intro-cta--download::before {
  content: "↓";
  font-size: 20px;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-phase8-intro-cta:hover {
  color: #f6d99a !important;
  filter: brightness(1.07) saturate(1.08);
  transform: translateY(-1px);
  box-shadow: none !important;
}

/* Grimhold homepage showcase left intro typography polish */
.grimhold-homepage .grimhold-phase8-intro h1 {
  max-width: 600px;
  margin: 0 0 12px;
  color: #f3dfb4;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(34px, 2.75vw, 50px);
  font-weight: 760;
  line-height: 1.11;
  letter-spacing: 0;
  text-shadow: 0 2px 2px rgba(0, 0, 0, 0.82), 0 0 12px rgba(113, 67, 26, 0.22);
}

.grimhold-homepage .grimhold-phase8-intro p {
  max-width: 570px;
  margin: 0 0 20px;
  color: #e1d4bf;
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.68;
  text-shadow: 0 2px 2px rgba(0, 0, 0, 0.78);
}

.grimhold-homepage .grimhold-phase8-actions {
  gap: 10px;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-phase8-intro-cta,
.grimhold-homepage .grimhold-phase8-actions .grimhold-phase8-intro-cta:link,
.grimhold-homepage .grimhold-phase8-actions .grimhold-phase8-intro-cta:visited {
  grid-template-columns: 24px max-content;
  column-gap: 6px;
  width: 190px;
  min-width: 190px;
  min-height: 66px;
  padding: 0 18px 0 10px;
  color: #efd39a !important;
  font-size: 15px;
  font-weight: 820;
  line-height: 1;
  background-size: 100% 100%;
  text-shadow: 0 2px 2px rgba(0, 0, 0, 0.86);
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-phase8-intro-cta::before {
  font-size: 16px;
  transform: translateY(-2px);
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-phase8-intro-cta--download::before {
  font-size: 18px;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-phase8-intro-cta:hover {
  color: #f6dfa8 !important;
  filter: brightness(1.055) saturate(1.05);
}

/* Grimhold homepage showcase buttons: exact navbar Play Now style reuse */
.grimhold-homepage .grimhold-phase8-actions .grimhold-phase8-intro-cta,
.grimhold-homepage .grimhold-phase8-actions .grimhold-phase8-intro-cta:link,
.grimhold-homepage .grimhold-phase8-actions .grimhold-phase8-intro-cta:visited {
  display: grid;
  grid-template-columns: 28px max-content;
  grid-template-rows: auto auto;
  column-gap: 5px;
  align-content: center;
  align-items: center;
  justify-content: center;
  justify-items: start;
  width: 214px;
  min-width: 214px;
  min-height: 76px;
  padding: 0 22px 0 4px;
  color: #f0d08e !important;
  background-color: transparent !important;
  background-image: url("images/branding/play-now-bg.png") !important;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  border: 0 !important;
  box-shadow: none !important;
  text-decoration: none !important;
  text-transform: none;
  transition: transform 140ms ease, filter 140ms ease, box-shadow 140ms ease;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-phase8-intro-cta::before {
  position: relative;
  left: auto;
  top: auto;
  grid-column: 1;
  grid-row: 1 / span 2;
  justify-self: center;
  align-self: center;
  color: #f0d08e;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 18px;
  line-height: 1;
  text-shadow: 0 2px 2px rgba(0, 0, 0, 0.86);
  transform: translateY(-3px);
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-phase8-intro-cta--play::before {
  content: "⚔";
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-phase8-intro-cta--download::before {
  content: "↓";
  font-size: 18px;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-phase8-intro-cta span {
  grid-column: 2;
  grid-row: 1;
  align-self: end;
  color: #f2d28f;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 18px;
  font-weight: 900;
  line-height: 0.95;
  text-align: left;
  white-space: nowrap;
  text-shadow: 0 2px 2px rgba(0, 0, 0, 0.88);
  transform: translateY(2px);
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-phase8-intro-cta em {
  grid-column: 2;
  grid-row: 2;
  align-self: start;
  margin-top: 5px;
  color: #c99c58;
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  font-size: 9px;
  font-style: italic;
  font-weight: 900;
  line-height: 0.95;
  text-align: left;
  white-space: nowrap;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.86);
  transform: translateY(2px);
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-phase8-intro-cta:hover {
  color: #f0d08e !important;
  background-image: url("images/branding/play-now-bg.png") !important;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  border: 0 !important;
  filter: brightness(1.07) saturate(1.08);
  transform: translateY(-1px);
  box-shadow: none !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-phase8-intro-cta:hover::before,
.grimhold-homepage .grimhold-phase8-actions .grimhold-phase8-intro-cta:hover span {
  color: #f6d99a;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-phase8-intro-cta:hover em {
  color: #d5aa66;
}

/* Grimhold shared red CTA: extracted from top navbar Play Now */
.grimhold-homepage .grimhold-red-cta,
.grimhold-homepage .grimhold-red-cta:link,
.grimhold-homepage .grimhold-red-cta:visited {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 28px max-content !important;
  grid-template-rows: auto auto !important;
  column-gap: 5px !important;
  align-content: center !important;
  align-items: center !important;
  justify-content: center !important;
  justify-items: start !important;
  width: 214px !important;
  min-width: 214px !important;
  min-height: 76px !important;
  padding: 0 22px 0 4px !important;
  color: #f0d08e !important;
  background-color: transparent !important;
  background-image: url("images/branding/play-now-bg.png") !important;
  background-position: center center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  border: 0 !important;
  box-shadow: none !important;
  text-align: left !important;
  text-decoration: none !important;
  text-transform: none !important;
  white-space: normal !important;
  overflow: visible !important;
  transition: transform 140ms ease, filter 140ms ease, box-shadow 140ms ease !important;
}

.grimhold-homepage .grimhold-red-cta::before {
  content: "⚔" !important;
  position: relative !important;
  left: auto !important;
  top: auto !important;
  display: inline-flex !important;
  grid-column: 1 !important;
  grid-row: 1 / span 2 !important;
  align-self: center !important;
  justify-self: center !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  height: auto !important;
  color: #f0d08e !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  text-shadow: 0 2px 2px rgba(0, 0, 0, 0.86) !important;
  transform: translateY(-3px) !important;
}

.grimhold-homepage .grimhold-red-cta--download::before {
  content: "↓" !important;
  font-size: 18px !important;
}

.grimhold-homepage .grimhold-red-cta span {
  display: block !important;
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: end !important;
  color: #f2d28f !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  line-height: 0.95 !important;
  text-align: left !important;
  white-space: nowrap !important;
  text-shadow: 0 2px 2px rgba(0, 0, 0, 0.88) !important;
  transform: translateY(2px) !important;
}

.grimhold-homepage .grimhold-red-cta em {
  display: block !important;
  grid-column: 2 !important;
  grid-row: 2 !important;
  align-self: start !important;
  margin-top: 5px !important;
  color: #c99c58 !important;
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif !important;
  font-size: 9px !important;
  font-style: italic !important;
  font-weight: 900 !important;
  line-height: 0.95 !important;
  text-align: left !important;
  white-space: nowrap !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.86) !important;
  transform: translateY(2px) !important;
}

.grimhold-homepage .grimhold-red-cta:hover {
  color: #f0d08e !important;
  background-color: transparent !important;
  background-image: url("images/branding/play-now-bg.png") !important;
  background-position: center center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  border: 0 !important;
  filter: brightness(1.07) saturate(1.08) !important;
  transform: translateY(-1px) !important;
  box-shadow: none !important;
}

.grimhold-homepage .grimhold-red-cta:hover::before,
.grimhold-homepage .grimhold-red-cta:hover span {
  color: #f6d99a !important;
}

.grimhold-homepage .grimhold-red-cta:hover em {
  color: #d5aa66 !important;
}

/* Grimhold showcase Download Client secondary dark CTA */
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:link,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:visited {
  color: #ead2a0 !important;
  background-color: #090909 !important;
  background-image:
    linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(0, 0, 0, 0.20)),
    url("images/branding/navbar-texture-dark.png") !important;
  background-position: center center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  border: 0 !important;
  box-shadow:
    inset 0 0 0 1px rgba(186, 132, 58, 0.38),
    inset 0 0 0 2px rgba(0, 0, 0, 0.58),
    inset 0 11px 20px rgba(255, 230, 164, 0.035),
    inset 0 -14px 22px rgba(0, 0, 0, 0.46) !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download::before {
  content: "↓" !important;
  color: #e7c783 !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download span {
  color: #efd39a !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download em {
  color: #b99154 !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:hover {
  background-color: #0c0c0b !important;
  background-image:
    linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(0, 0, 0, 0.18)),
    url("images/branding/navbar-texture-dark.png") !important;
  filter: brightness(1.06) saturate(1.02) !important;
  box-shadow:
    inset 0 0 0 1px rgba(205, 154, 75, 0.48),
    inset 0 0 0 2px rgba(0, 0, 0, 0.55),
    inset 0 11px 20px rgba(255, 230, 164, 0.045),
    inset 0 -14px 22px rgba(0, 0, 0, 0.42) !important;
}

/* Grimhold showcase Download Client asset background */
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:link,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:visited {
  width: 214px !important;
  min-width: 214px !important;
  min-height: 76px !important;
  color: #f0d08e !important;
  background-color: transparent !important;
  background-image: url("images/branding/download-bg.png") !important;
  background-position: center center !important;
  background-size: 100% 100% !important;
  background-repeat: no-repeat !important;
  border: 0 !important;
  box-shadow: none !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download::before {
  content: "↓" !important;
  color: #f0d08e !important;
  font-size: 18px !important;
  text-shadow: 0 2px 2px rgba(0, 0, 0, 0.86) !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download span {
  color: #f2d28f !important;
  text-shadow: 0 2px 2px rgba(0, 0, 0, 0.88) !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download em {
  color: #c99c58 !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.86) !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:hover {
  background-color: transparent !important;
  background-image: url("images/branding/download-bg.png") !important;
  background-position: center center !important;
  background-size: 100% 100% !important;
  background-repeat: no-repeat !important;
  border: 0 !important;
  box-shadow: none !important;
  filter: brightness(1.06) saturate(1.04) !important;
}

/* Grimhold showcase Download Client contrast tune */
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:link,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:visited {
  filter: brightness(1.14) contrast(1.08) saturate(1.02) !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download::before {
  color: #f5d58f !important;
  text-shadow: 0 2px 2px rgba(0, 0, 0, 0.92), 0 0 7px rgba(214, 162, 74, 0.22) !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download span {
  color: #f7dfaa !important;
  font-weight: 950 !important;
  text-shadow: 0 2px 2px rgba(0, 0, 0, 0.94), 0 0 8px rgba(214, 162, 74, 0.18) !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download em {
  color: #d9b06a !important;
  font-weight: 950 !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.9) !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:hover {
  filter: brightness(1.20) contrast(1.1) saturate(1.04) !important;
}

/* Grimhold showcase CTA layout refinement */
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta:link,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta:visited {
  grid-template-columns: 32px max-content !important;
  column-gap: 9px !important;
  min-height: 76px !important;
  padding: 0 22px 0 20px !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--play,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--play:link,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--play:visited {
  width: 228px !important;
  min-width: 228px !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:link,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:visited {
  width: 258px !important;
  min-width: 258px !important;
  background-size: cover !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta::before {
  font-size: 19px !important;
  transform: translateY(-1px) !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download::before {
  font-size: 20px !important;
  transform: translateY(0) !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta span {
  font-size: 18px !important;
  font-weight: 830 !important;
  line-height: 1 !important;
  transform: translateY(1px) !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta em {
  margin-top: 5px !important;
  font-size: 10.5px !important;
  font-weight: 820 !important;
  line-height: 1 !important;
  transform: translateY(1px) !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:hover {
  background-size: cover !important;
}

/* Grimhold showcase Download Client SVG composition */
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:link,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:visited {
  grid-template-columns: 30px max-content !important;
  column-gap: 7px !important;
  width: 282px !important;
  min-width: 282px !important;
  min-height: 76px !important;
  padding: 0 22px 0 20px !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download::before {
  display: none !important;
  content: none !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download .grimhold-red-cta__icon {
  grid-column: 1 !important;
  grid-row: 1 / span 2 !important;
  align-self: center !important;
  justify-self: center !important;
  width: 24px !important;
  height: 24px !important;
  color: #f5d58f !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.4 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  vector-effect: non-scaling-stroke !important;
  filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.9)) !important;
  transform: translateY(-1px) !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download span,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download em {
  grid-column: 2 !important;
}

/* Grimhold showcase Download Client proportion tune */
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:link,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:visited {
  grid-template-columns: 30px minmax(0, max-content) !important;
  column-gap: 8px !important;
  width: 246px !important;
  min-width: 246px !important;
  padding-left: 22px !important;
  padding-right: 22px !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download span {
  font-size: 16px !important;
  font-weight: 800 !important;
  line-height: 1.02 !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download em {
  font-size: 10.5px !important;
  font-weight: 760 !important;
  margin-top: 6px !important;
}

/* Grimhold showcase Download Client containment fix */
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:link,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:visited {
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr) !important;
  grid-template-rows: auto auto !important;
  column-gap: 6px !important;
  align-content: center !important;
  align-items: center !important;
  justify-content: center !important;
  justify-items: start !important;
  width: 246px !important;
  min-width: 246px !important;
  max-width: 246px !important;
  min-height: 76px !important;
  padding: 0 18px !important;
  overflow: hidden !important;
  white-space: nowrap !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download .grimhold-red-cta__icon {
  box-sizing: border-box !important;
  grid-column: 1 !important;
  grid-row: 1 / span 2 !important;
  align-self: center !important;
  justify-self: center !important;
  width: 20px !important;
  height: 20px !important;
  max-width: 20px !important;
  max-height: 20px !important;
  overflow: visible !important;
  transform: none !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download span {
  box-sizing: border-box !important;
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: end !important;
  max-width: 100% !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  color: #f7dfaa !important;
  font-size: 14.5px !important;
  font-weight: 760 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-overflow: clip !important;
  transform: none !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download em {
  box-sizing: border-box !important;
  grid-column: 2 !important;
  grid-row: 2 !important;
  align-self: start !important;
  max-width: 100% !important;
  margin-top: 5px !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  color: #d9b06a !important;
  font-size: 10px !important;
  font-weight: 740 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-overflow: clip !important;
  transform: none !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download::before {
  display: none !important;
  content: none !important;
}

/* Grimhold showcase Download Client text-only final CTA */
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:link,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:visited {
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 286px !important;
  min-width: 286px !important;
  max-width: 286px !important;
  min-height: 76px !important;
  padding: 0 28px !important;
  text-align: center !important;
  background-color: transparent !important;
  background-image: url("images/branding/download-bg.png") !important;
  background-position: center center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: hidden !important;
  white-space: normal !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download::before,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download .grimhold-red-cta__icon {
  display: none !important;
  content: none !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download span {
  display: block !important;
  max-width: 100% !important;
  margin: 0 !important;
  color: #f7dfaa !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 17.5px !important;
  font-weight: 820 !important;
  line-height: 1.05 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
  text-shadow: 0 2px 2px rgba(0, 0, 0, 0.94), 0 0 8px rgba(214, 162, 74, 0.16) !important;
  transform: none !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download em {
  display: block !important;
  max-width: 100% !important;
  margin: 5px 0 0 !important;
  color: #d9b06a !important;
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif !important;
  font-size: 10.8px !important;
  font-style: italic !important;
  font-weight: 760 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.9) !important;
  transform: none !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:hover {
  background-image: url("images/branding/download-bg.png") !important;
  background-size: cover !important;
  box-shadow: none !important;
}

/* Grimhold showcase Download Client sibling sizing with Play Now */
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:link,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:visited {
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 228px !important;
  min-width: 228px !important;
  max-width: 228px !important;
  min-height: 76px !important;
  padding: 0 22px !important;
  text-align: center !important;
  background-color: transparent !important;
  background-image: url("images/branding/download-bg.png") !important;
  background-position: center center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
  white-space: normal !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download::before,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download .grimhold-red-cta__icon {
  display: none !important;
  content: none !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download span {
  display: block !important;
  max-width: 100% !important;
  margin: 0 !important;
  color: #f7dfaa !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 14.5px !important;
  font-weight: 780 !important;
  line-height: 1.05 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
  text-shadow: 0 2px 2px rgba(0, 0, 0, 0.94), 0 0 7px rgba(214, 162, 74, 0.14) !important;
  transform: none !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download em {
  display: block !important;
  max-width: 100% !important;
  margin: 5px 0 0 !important;
  color: #d9b06a !important;
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif !important;
  font-size: 9.8px !important;
  font-style: italic !important;
  font-weight: 740 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.9) !important;
  transform: none !important;
}

/* Grimhold showcase Download Client final row composition */
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:link,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:visited {
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  width: 272px !important;
  min-width: 272px !important;
  max-width: 272px !important;
  height: 76px !important;
  min-height: 76px !important;
  max-height: 76px !important;
  padding: 0 22px !important;
  text-align: left !important;
  background-color: transparent !important;
  background-image: url("images/branding/download-bg.png") !important;
  background-position: center center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: hidden !important;
  white-space: nowrap !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download::before,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download .grimhold-red-cta__icon {
  display: none !important;
  content: none !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download .grimhold-download-cta__icon {
  display: block !important;
  flex: 0 0 18px !important;
  width: 18px !important;
  height: 18px !important;
  color: #f5d58f !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.35 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  transform: none !important;
  filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.88)) !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download .grimhold-download-cta__text {
  box-sizing: border-box !important;
  display: flex !important;
  flex: 0 1 auto !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
  min-width: 0 !important;
  max-width: calc(100% - 26px) !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  text-align: left !important;
  white-space: nowrap !important;
  transform: none !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download .grimhold-download-cta__label {
  display: block !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #f7dfaa !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 14px !important;
  font-weight: 780 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
  text-shadow: 0 2px 2px rgba(0, 0, 0, 0.94), 0 0 7px rgba(214, 162, 74, 0.14) !important;
  transform: none !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download .grimhold-download-cta__text em {
  display: block !important;
  max-width: 100% !important;
  position: static !important;
  margin: 3px 0 0 !important;
  padding: 0 !important;
  color: #d9b06a !important;
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif !important;
  font-size: 9.5px !important;
  font-style: italic !important;
  font-weight: 740 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.9) !important;
  transform: none !important;
}

/* Grimhold showcase Download Client alignment tune */
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:link,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:visited {
  padding-left: 20px !important;
  padding-right: 28px !important;
  align-items: center !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download .grimhold-download-cta__icon {
  transform: translateY(-2px) !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download .grimhold-download-cta__text {
  transform: translateY(-2px) !important;
}

/* Grimhold showcase Download Client centered text alignment */
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download .grimhold-download-cta__text {
  align-items: center !important;
  text-align: center !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download .grimhold-download-cta__label,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download .grimhold-download-cta__text em {
  text-align: center !important;
}

/* Grimhold showcase Download Client text vertical lift */
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download .grimhold-download-cta__text {
  transform: translateY(-5px) !important;
}

/* Grimhold showcase Download Client icon/text row alignment */
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download {
  align-items: center !important;
  gap: 8px !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download .grimhold-download-cta__icon {
  align-self: center !important;
  transform: translateY(-1px) !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download .grimhold-download-cta__text {
  align-self: center !important;
  align-items: flex-start !important;
  justify-content: center !important;
  text-align: left !important;
  transform: translateY(-1px) !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download .grimhold-download-cta__label,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download .grimhold-download-cta__text em {
  text-align: left !important;
}

/* Grimhold showcase Download Client height trim */
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:link,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:visited {
  height: 70px !important;
  min-height: 70px !important;
  max-height: 70px !important;
}

/* Grimhold showcase Download Client further height trim */
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:link,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:visited {
  height: 62px !important;
  min-height: 62px !important;
  max-height: 62px !important;
}

/* Grimhold showcase Download Client height restore for frame */
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:link,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:visited {
  height: 68px !important;
  min-height: 68px !important;
  max-height: 68px !important;
}

/* Grimhold showcase Download Client preserve full frame */
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:link,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:visited,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:hover {
  background-size: 100% 100% !important;
  background-position: center center !important;
}

/* Grimhold showcase Download Client revert height experiment */
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:link,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:visited {
  height: 76px !important;
  min-height: 76px !important;
  max-height: 76px !important;
  background-size: cover !important;
  background-position: center center !important;
}

.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:hover {
  background-size: cover !important;
  background-position: center center !important;
}

/* Grimhold showcase CTA equal height alignment */
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta:link,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta:visited {
  height: 76px !important;
  min-height: 76px !important;
  max-height: 76px !important;
  align-self: center !important;
}

/* Grimhold showcase Play Now visual frame height match */
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--play,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--play:link,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--play:visited,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--play:hover {
  background-size: 100% 114% !important;
  background-position: center center !important;
}

/* Grimhold showcase Play Now visual frame scale revert */
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--play,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--play:link,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--play:visited,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--play:hover {
  background-size: cover !important;
  background-position: center center !important;
}

/* Grimhold showcase Download Client adjusted asset */
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:link,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:visited,
.grimhold-homepage .grimhold-phase8-actions .grimhold-red-cta--download:hover {
  background-image: url("images/branding/download-bg-adjusted.png") !important;
  background-size: cover !important;
  background-position: center center !important;
  height: 76px !important;
  min-height: 76px !important;
  max-height: 76px !important;
}

/* Grimhold homepage featured carousel Astera pass */
.grimhold-homepage .grimhold-phase8-feature {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  max-width: 720px !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}

.grimhold-homepage .grimhold-phase8-feature::after {
  display: none !important;
  content: none !important;
}

.grimhold-homepage .grimhold-phase8-feature__media {
  position: relative !important;
  width: 100% !important;
  max-width: 720px !important;
  min-height: 0 !important;
  aspect-ratio: 16 / 8 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #070605 !important;
  border: 1px solid rgba(194, 132, 54, 0.70) !important;
  border-radius: 2px !important;
  box-shadow:
    0 18px 34px rgba(0, 0, 0, 0.46),
    inset 0 0 0 1px rgba(255, 222, 142, 0.09),
    inset 0 0 0 3px rgba(0, 0, 0, 0.54) !important;
}

.grimhold-homepage .grimhold-phase8-carousel-track,
.grimhold-homepage .grimhold-phase8-slide {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
}

.grimhold-homepage .grimhold-phase8-slide {
  display: none !important;
  overflow: hidden !important;
  background: #090706 !important;
}

.grimhold-homepage .grimhold-phase8-slide--active {
  display: block !important;
}

.grimhold-homepage .grimhold-phase8-slide img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  opacity: 0.94 !important;
  filter: saturate(0.92) contrast(1.04) brightness(0.82) !important;
}

.grimhold-homepage .grimhold-phase8-feature__caption {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  z-index: 2 !important;
  display: block !important;
  min-height: 86px !important;
  padding: 18px 88px 18px 28px !important;
  background:
    linear-gradient(90deg, rgba(4, 4, 4, 0.88), rgba(8, 6, 4, 0.74) 56%, rgba(8, 6, 4, 0.20)),
    linear-gradient(180deg, rgba(0, 0, 0, 0.10), rgba(0, 0, 0, 0.58)) !important;
  border-top: 1px solid rgba(205, 146, 65, 0.40) !important;
  box-sizing: border-box !important;
}

.grimhold-homepage .grimhold-phase8-feature__caption span {
  display: block !important;
  margin: 0 0 4px !important;
  color: #c79951 !important;
  font: 800 10px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif !important;
  text-transform: uppercase !important;
  letter-spacing: 0 !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.86) !important;
}

.grimhold-homepage .grimhold-phase8-feature__caption strong {
  display: block !important;
  margin: 0 0 5px !important;
  color: #f2d79b !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: clamp(20px, 1.55vw, 27px) !important;
  font-weight: 830 !important;
  line-height: 1.05 !important;
  text-shadow: 0 2px 2px rgba(0, 0, 0, 0.9) !important;
}

.grimhold-homepage .grimhold-phase8-feature__caption p {
  max-width: 500px !important;
  margin: 0 !important;
  color: #d3c2a3 !important;
  font: 400 13px/1.35 "Trebuchet MS", "Segoe UI", Arial, sans-serif !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.86) !important;
}

.grimhold-homepage .grimhold-phase8-carousel-arrow {
  position: absolute !important;
  top: 50% !important;
  z-index: 4 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 38px !important;
  height: 38px !important;
  padding: 0 !important;
  color: #e7c47a !important;
  font: 700 28px/1 Georgia, "Times New Roman", serif !important;
  background:
    linear-gradient(180deg, rgba(24, 20, 15, 0.94), rgba(5, 5, 5, 0.96)) !important;
  border: 1px solid rgba(199, 139, 59, 0.70) !important;
  border-radius: 50% !important;
  box-shadow:
    0 8px 16px rgba(0, 0, 0, 0.45),
    inset 0 1px 0 rgba(255, 230, 160, 0.12) !important;
  cursor: default !important;
  transform: translateY(-50%) !important;
  text-shadow: 0 2px 2px rgba(0, 0, 0, 0.86) !important;
}

.grimhold-homepage .grimhold-phase8-carousel-arrow--prev {
  left: 14px !important;
}

.grimhold-homepage .grimhold-phase8-carousel-arrow--next {
  right: 14px !important;
}

.grimhold-homepage .grimhold-phase8-carousel-arrow:hover {
  color: #f3d895 !important;
  filter: brightness(1.08) !important;
}

/* Grimhold homepage carousel reference refinements */
.grimhold-homepage .grimhold-phase8-feature__media {
  border: 2px solid rgba(199, 139, 59, 0.86) !important;
  box-shadow:
    0 20px 36px rgba(0, 0, 0, 0.52),
    inset 0 0 0 1px rgba(255, 224, 151, 0.16),
    inset 0 0 0 5px rgba(0, 0, 0, 0.62),
    inset 0 0 32px rgba(0, 0, 0, 0.46) !important;
}

.grimhold-homepage .grimhold-phase8-slide img {
  opacity: 0.98 !important;
  filter: saturate(0.98) contrast(1.06) brightness(0.88) !important;
}

.grimhold-homepage .grimhold-phase8-feature__caption {
  min-height: 50px !important;
  padding: 9px 76px 9px 22px !important;
  background:
    linear-gradient(90deg, rgba(3, 3, 3, 0.82), rgba(7, 6, 5, 0.64) 58%, rgba(7, 6, 5, 0.14)),
    linear-gradient(180deg, rgba(0, 0, 0, 0.04), rgba(0, 0, 0, 0.44)) !important;
  border-top: 1px solid rgba(205, 146, 65, 0.32) !important;
}

.grimhold-homepage .grimhold-phase8-feature__caption span {
  margin-bottom: 2px !important;
  font-size: 9px !important;
  line-height: 1 !important;
}

.grimhold-homepage .grimhold-phase8-feature__caption strong {
  margin-bottom: 3px !important;
  font-size: clamp(16px, 1.15vw, 20px) !important;
  font-weight: 780 !important;
  line-height: 1 !important;
}

.grimhold-homepage .grimhold-phase8-feature__caption p {
  max-width: 460px !important;
  font-size: 11.5px !important;
  line-height: 1.25 !important;
}

.grimhold-homepage .grimhold-phase8-carousel-arrow {
  width: 34px !important;
  height: 34px !important;
  color: #edcf8a !important;
  font-size: 24px !important;
  background:
    radial-gradient(circle at 50% 35%, rgba(58, 45, 29, 0.96), rgba(8, 8, 7, 0.98) 68%) !important;
  border: 1px solid rgba(211, 154, 73, 0.78) !important;
  box-shadow:
    0 8px 14px rgba(0, 0, 0, 0.48),
    inset 0 0 0 1px rgba(255, 232, 164, 0.10),
    inset 0 -8px 14px rgba(0, 0, 0, 0.38) !important;
}

.grimhold-homepage .grimhold-phase8-carousel-arrow--prev {
  left: 10px !important;
}

.grimhold-homepage .grimhold-phase8-carousel-arrow--next {
  right: 10px !important;
}

.grimhold-homepage .grimhold-phase8-carousel-dots {
  position: absolute !important;
  left: 50% !important;
  bottom: 10px !important;
  z-index: 5 !important;
  display: flex !important;
  gap: 7px !important;
  align-items: center !important;
  justify-content: center !important;
  transform: translateX(-50%) !important;
}

.grimhold-homepage .grimhold-phase8-carousel-dots span {
  display: block !important;
  width: 7px !important;
  height: 7px !important;
  background: rgba(151, 111, 54, 0.62) !important;
  border: 1px solid rgba(232, 191, 111, 0.46) !important;
  border-radius: 50% !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.72) !important;
}

.grimhold-homepage .grimhold-phase8-carousel-dots span.is-active {
  width: 9px !important;
  height: 9px !important;
  background: #e8c16d !important;
  border-color: rgba(255, 232, 164, 0.82) !important;
}

/* Grimhold homepage carousel caption/dots spacing refinement */
.grimhold-homepage .grimhold-phase8-feature__caption {
  min-height: 46px !important;
  padding: 8px 76px 18px 22px !important;
}

.grimhold-homepage .grimhold-phase8-feature__caption strong {
  font-size: clamp(14px, 0.98vw, 17px) !important;
}

.grimhold-homepage .grimhold-phase8-feature__caption p {
  margin-bottom: 10px !important;
}

.grimhold-homepage .grimhold-phase8-carousel-dots {
  bottom: 6px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
}

/* Grimhold homepage carousel final interaction and frame arrows */
.grimhold-homepage .grimhold-phase8-slide__link,
.grimhold-homepage .grimhold-phase8-slide__link:link,
.grimhold-homepage .grimhold-phase8-slide__link:visited {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  color: inherit !important;
  text-decoration: none !important;
  cursor: pointer !important;
}

.grimhold-homepage .grimhold-phase8-feature__media {
  overflow: visible !important;
}

.grimhold-homepage .grimhold-phase8-carousel-track {
  overflow: hidden !important;
  border-radius: 1px !important;
}

.grimhold-homepage .grimhold-phase8-carousel-arrow {
  width: 28px !important;
  height: 54px !important;
  color: #cfa66a !important;
  font-size: 25px !important;
  line-height: 1 !important;
  background:
    linear-gradient(180deg, rgba(23, 21, 18, 0.98), rgba(7, 7, 6, 0.98)) !important;
  border: 1px solid rgba(145, 103, 51, 0.82) !important;
  border-radius: 2px !important;
  box-shadow:
    0 8px 14px rgba(0, 0, 0, 0.40),
    inset 0 1px 0 rgba(230, 190, 116, 0.10),
    inset 0 -10px 16px rgba(0, 0, 0, 0.38) !important;
  filter: none !important;
  cursor: pointer !important;
}

.grimhold-homepage .grimhold-phase8-carousel-arrow--prev {
  left: -9px !important;
  border-left-color: rgba(72, 50, 27, 0.96) !important;
}

.grimhold-homepage .grimhold-phase8-carousel-arrow--next {
  right: -9px !important;
  border-right-color: rgba(72, 50, 27, 0.96) !important;
}

.grimhold-homepage .grimhold-phase8-carousel-arrow:hover {
  color: #dfbf7f !important;
  background:
    linear-gradient(180deg, rgba(28, 25, 21, 0.98), rgba(9, 9, 8, 0.98)) !important;
  filter: none !important;
}

/* Grimhold homepage logged-out account panel polish */
.grimhold-phase8-login--logged-out {
  padding: 30px 30px 28px;
  background:
    linear-gradient(180deg, rgba(15, 12, 10, 0.98), rgba(6, 5, 5, 0.98)),
    url('images/branding/navbar-texture-dark.png') center/cover repeat;
  border-color: rgba(138, 100, 40, 0.42);
  box-shadow:
    inset 0 1px 0 rgba(215, 166, 74, 0.10),
    inset 0 -1px 0 rgba(0, 0, 0, 0.65);
}

.grimhold-phase8-login--logged-out .grimhold-phase8-login__heading {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin: 0 0 18px;
  color: #e0b765;
  font: 800 15px/1.1 Georgia, "Times New Roman", serif;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.8);
}

.grimhold-phase8-login--logged-out .grimhold-phase8-login__heading svg,
.grimhold-phase8-login--logged-out .grimhold-phase8-login__field svg,
.grimhold-phase8-login--logged-out .grimhold-phase8-login__submit svg {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.15;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.grimhold-phase8-login--logged-out form {
  display: grid;
  gap: 12px;
  margin-top: 0;
}

.grimhold-phase8-login--logged-out .grimhold-phase8-login__field {
  display: flex;
  align-items: center;
  min-height: 46px;
  padding: 0 13px;
  color: #b98b44;
  background:
    linear-gradient(180deg, rgba(8, 8, 8, 0.94), rgba(15, 11, 9, 0.94));
  border: 1px solid rgba(120, 87, 42, 0.70);
  box-shadow:
    inset 0 2px 6px rgba(0, 0, 0, 0.72),
    inset 0 1px 0 rgba(255, 229, 166, 0.04);
}

.grimhold-phase8-login--logged-out .grimhold-phase8-login__field input[type="text"],
.grimhold-phase8-login--logged-out .grimhold-phase8-login__field input[type="password"] {
  min-height: 44px;
  width: 100%;
  padding: 0 0 0 11px;
  color: #f1dfbf;
  font: 600 13px/1.2 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  background: transparent;
  border: 0;
  box-shadow: none;
  outline: none;
}

.grimhold-phase8-login--logged-out .grimhold-phase8-login__field input::placeholder {
  color: rgba(218, 196, 156, 0.62);
  opacity: 1;
}

.grimhold-phase8-login--logged-out .grimhold-phase8-login__field:focus-within {
  border-color: rgba(214, 162, 74, 0.82);
  box-shadow:
    inset 0 2px 6px rgba(0, 0, 0, 0.74),
    0 0 0 1px rgba(214, 162, 74, 0.10);
}

.grimhold-phase8-login--logged-out .grimhold-phase8-login__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: 1px 0 2px;
}

.grimhold-phase8-login--logged-out .grimhold-phase8-login__remember {
  display: inline-flex !important;
  align-items: center;
  gap: 7px !important;
  color: #cbb48a;
  font: 600 12px/1.2 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-transform: none !important;
}

.grimhold-phase8-login--logged-out .grimhold-phase8-login__remember input {
  accent-color: #a9412e;
}

.grimhold-phase8-login--logged-out .grimhold-phase8-login__row a,
.grimhold-phase8-login--logged-out .grimhold-phase8-login__row a:link,
.grimhold-phase8-login--logged-out .grimhold-phase8-login__row a:visited,
.grimhold-phase8-login--logged-out .grimhold-phase8-login__links a,
.grimhold-phase8-login--logged-out .grimhold-phase8-login__links a:link,
.grimhold-phase8-login--logged-out .grimhold-phase8-login__links a:visited {
  color: #c99b4a !important;
  font: 700 12px/1.2 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-decoration: none !important;
}

.grimhold-phase8-login--logged-out .grimhold-phase8-login__row a:hover,
.grimhold-phase8-login--logged-out .grimhold-phase8-login__links a:hover {
  color: #efd08a !important;
}

.grimhold-phase8-login--logged-out .grimhold-phase8-login__submit {
  min-height: 48px;
  margin-top: 3px;
  gap: 9px;
  color: #f3dca7 !important;
  font: 850 14px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif !important;
  letter-spacing: 0.04em;
  background:
    linear-gradient(180deg, rgba(115, 28, 22, 0.96), rgba(57, 12, 10, 0.98)),
    url('images/branding/texture-red.png') center/cover repeat;
  border: 1px solid rgba(151, 83, 46, 0.74);
  box-shadow:
    inset 0 1px 0 rgba(255, 214, 151, 0.14),
    inset 0 -2px 6px rgba(0, 0, 0, 0.54);
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.85);
}

.grimhold-phase8-login--logged-out .grimhold-phase8-login__submit:hover {
  filter: brightness(1.06) saturate(1.04);
  color: #ffe4aa !important;
}

.grimhold-phase8-login--logged-out .grimhold-phase8-login__submit svg {
  width: 16px;
  height: 16px;
  color: #e1ba6c;
}

.grimhold-phase8-login--logged-out .grimhold-phase8-login__links {
  display: flex;
  justify-content: center;
  margin-top: 14px;
}

/* Keep Chrome autofill dark inside the Grimhold homepage login panel */
.grimhold-phase8-login--logged-out .grimhold-phase8-login__field input:-webkit-autofill,
.grimhold-phase8-login--logged-out .grimhold-phase8-login__field input:-webkit-autofill:hover,
.grimhold-phase8-login--logged-out .grimhold-phase8-login__field input:-webkit-autofill:focus,
.grimhold-phase8-login--logged-out .grimhold-phase8-login__field input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 1000px #0b0907 inset !important;
  -webkit-text-fill-color: #ead9b0 !important;
  caret-color: #ead9b0;
  border: 0;
  transition: background-color 9999s ease-in-out 0s;
}

/* Homepage login panel inline error state */
.grimhold-phase8-login--logged-out .grimhold-phase8-login__error {
  margin: 0 0 13px;
  padding: 10px 12px;
  color: #f1d1bd;
  font: 700 12px/1.35 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  background: linear-gradient(180deg, rgba(84, 20, 16, 0.82), rgba(31, 9, 8, 0.90));
  border: 1px solid rgba(179, 73, 49, 0.62);
  box-shadow: inset 0 1px 0 rgba(255, 219, 173, 0.06);
}

.grimhold-phase8-login--logged-out .grimhold-phase8-login__error[hidden] {
  display: none !important;
}



/* Grimhold lower homepage two-column layout */
.grimhold-home-lower {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 24px;
  align-items: start;
  min-width: 0;
}

.grimhold-home-lower__main,
.grimhold-home-lower__sidebar {
  display: grid;
  gap: 18px;
  min-width: 0;
}

.grimhold-top-players-panel {
  display: grid;
  gap: 16px;
  min-width: 0;
  padding: 18px;
  color: #dac39a;
  background:
    linear-gradient(180deg, rgba(10, 10, 10, 0.92), rgba(5, 5, 5, 0.96)),
    url("images/branding/navbar-texture-dark.png") center / cover repeat;
  border: 1px solid rgba(139, 100, 40, 0.58);
  box-shadow:
    0 18px 36px rgba(0, 0, 0, 0.46),
    inset 0 1px 0 rgba(239, 200, 120, 0.08),
    inset 0 -1px 0 rgba(0, 0, 0, 0.72);
}

.grimhold-top-players-panel__head {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  padding-bottom: 13px;
  border-bottom: 1px solid rgba(139, 100, 40, 0.40);
}

.grimhold-top-players-panel__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  flex: 0 0 auto;
  color: #d6a24a;
  background: radial-gradient(circle, rgba(216, 162, 74, 0.13), rgba(12, 10, 8, 0.74) 68%);
  border: 1px solid rgba(150, 108, 44, 0.54);
  box-shadow: inset 0 1px 0 rgba(255, 229, 169, 0.06);
}

.grimhold-top-players-panel__icon svg {
  display: block;
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.grimhold-top-players-panel__head strong {
  display: block;
  min-width: 0;
  color: #e0b05f;
  font: 900 14px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.90);
}

.grimhold-top-players-panel__list {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  min-width: 0;
}

.grimhold-top-players-panel__list li {
  display: grid;
  grid-template-columns: 31px 52px minmax(0, 1fr) auto;
  align-items: center;
  column-gap: 4px;
  row-gap: 0;
  min-width: 0;
  padding: 10px 0;
  overflow: visible;
  border-bottom: 1px solid rgba(139, 100, 40, 0.25);
}

.grimhold-top-players-panel__list li:last-child {
  border-bottom: 0;
}

.grimhold-top-players-panel__list li.is-first {
  margin: 0 -8px;
  padding-left: 8px;
  padding-right: 8px;
  background: linear-gradient(90deg, rgba(216, 166, 74, 0.10), rgba(0, 0, 0, 0.04));
  border: 1px solid rgba(171, 121, 48, 0.25);
}

.grimhold-top-players-panel__rank {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  min-height: 30px;
  color: #d6a24a;
  font: 900 12px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  background: rgba(12, 10, 8, 0.62);
  border: 1px solid rgba(150, 108, 44, 0.45);
}

.grimhold-top-players-panel__list li.is-first .grimhold-top-players-panel__rank {
  color: #f0d28f;
  border-color: rgba(216, 166, 74, 0.68);
}

.grimhold-top-players-panel__outfit {
  display: inline-flex;
  align-items: flex-start;
  justify-content: center;
  width: 64px;
  height: 54px;
  min-width: 0;
  overflow: visible;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.grimhold-top-players-panel__outfit img {
  display: block;
  max-width: 70px;
  max-height: 68px;
  object-fit: contain;
  image-rendering: pixelated;
  image-rendering: crisp-edges;
  filter: drop-shadow(0 3px 4px rgba(0, 0, 0, 0.35));
  transform: translate(-12px, -42px) scale(1.5);
  transform-origin: center top;
}

.grimhold-top-players-panel__outfit.is-empty::before {
  content: "";
  width: 18px;
  height: 18px;
  border: 1px solid rgba(214, 162, 74, 0.34);
  transform: rotate(45deg);
  opacity: 0.32;
}

.grimhold-top-players-panel__identity {
  display: grid;
  gap: 3px;
  min-width: 0;
  align-content: center;
  margin-left: 16px;
}

.grimhold-top-players-panel__name,
.grimhold-top-players-panel__name:link,
.grimhold-top-players-panel__name:visited {
  display: block;
  min-width: 0;
  color: #ead9b0;
  font: 850 13px/1.15 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-decoration: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.grimhold-top-players-panel__name:hover {
  color: #f2d58f;
  text-decoration: none;
}

.grimhold-top-players-panel__vocation {
  display: block;
  min-width: 0;
  color: #b9a27c;
  font: 700 10.5px/1.1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.grimhold-top-players-panel__level {
  align-self: center;
  color: #b98b45;
  font: 800 11px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  white-space: nowrap;
}

.grimhold-top-players-panel__empty {
  margin: 0;
  padding: 16px 0;
  color: #b9aa8f;
  font: 700 13px/1.45 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-align: center;
}

.grimhold-top-players-panel__button,
.grimhold-top-players-panel__button:link,
.grimhold-top-players-panel__button:visited {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 14px;
  color: #f0d28f;
  font: 900 11px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-decoration: none;
  background: linear-gradient(180deg, rgba(46, 35, 22, 0.88), rgba(14, 12, 10, 0.96));
  border: 1px solid rgba(150, 108, 44, 0.58);
  box-shadow: inset 0 1px 0 rgba(255, 229, 169, 0.08);
}

.grimhold-top-players-panel__button:hover {
  color: #ffe0a0;
  filter: brightness(1.05);
  text-decoration: none;
}

.grimhold-discord-panel {
  margin-top: 24px;
}

.grimhold-discord-panel__head {
  padding-bottom: 15px;
  border-bottom-color: rgba(184, 132, 54, 0.52);
  box-shadow: 0 1px 0 rgba(216, 162, 74, 0.10), 0 8px 16px -15px rgba(216, 162, 74, 0.52);
}

.grimhold-discord-panel__head strong {
  color: #f0c978;
  font-size: 15px;
  letter-spacing: 0.17em;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.92), 0 0 12px rgba(216, 162, 74, 0.16);
}

.grimhold-discord-panel__icon {
  color: #c3d0ff;
  background:
    radial-gradient(circle at 36% 24%, rgba(173, 142, 255, 0.30), transparent 34%),
    linear-gradient(145deg, rgba(75, 91, 210, 0.62), rgba(39, 48, 116, 0.82) 48%, rgba(13, 15, 31, 0.90));
  border-color: rgba(126, 117, 226, 0.62);
  box-shadow:
    0 0 14px rgba(92, 106, 224, 0.16),
    inset 0 1px 0 rgba(228, 218, 255, 0.12),
    inset 0 -1px 0 rgba(0, 0, 0, 0.44);
}

.grimhold-discord-panel__icon svg {
  width: 25px;
  height: 25px;
}

.grimhold-discord-panel__text {
  margin: 2px 0 0;
  color: #c9bda3;
  font: 700 13px/1.48 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.78);
}

.grimhold-discord-panel__button,
.grimhold-discord-panel__button:link,
.grimhold-discord-panel__button:visited {
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 100%;
  min-height: 46px;
  padding: 0 16px;
  color: #dbe7ff !important;
  font: 900 12px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.13em;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none;
  background:
    linear-gradient(180deg, rgba(35, 59, 106, 0.90), rgba(9, 16, 35, 0.98)),
    radial-gradient(circle at 50% 0%, rgba(96, 140, 215, 0.22), transparent 56%);
  border: 1px solid rgba(92, 129, 194, 0.62);
  border-radius: 7px;
  box-shadow:
    0 0 14px rgba(55, 99, 184, 0.18),
    inset 0 1px 0 rgba(221, 234, 255, 0.12),
    inset 0 -1px 0 rgba(0, 0, 0, 0.56);
  transition: transform 160ms ease, filter 160ms ease, color 160ms ease, box-shadow 160ms ease;
}

.grimhold-discord-panel__button:hover,
.grimhold-discord-panel__button:focus-visible {
  color: #f2f6ff;
  filter: brightness(1.10) saturate(1.12);
  text-decoration: none;
  transform: translateY(-1px);
  box-shadow:
    0 0 22px rgba(88, 127, 220, 0.34),
    0 0 8px rgba(122, 99, 210, 0.16),
    inset 0 1px 0 rgba(235, 243, 255, 0.18),
    inset 0 -1px 0 rgba(0, 0, 0, 0.58);
}

.grimhold-community-panel {
  margin-top: 24px;
}

.grimhold-community-panel__nav {
  display: grid;
  margin: -4px 0 0;
  min-width: 0;
}

.grimhold-community-panel__nav a,
.grimhold-community-panel__nav a:link,
.grimhold-community-panel__nav a:visited {
  display: flex;
  align-items: center;
  gap: 11px;
  min-width: 0;
  min-height: 42px;
  padding: 0 2px;
  color: #d8c39e;
  text-decoration: none;
  border-bottom: 1px solid rgba(139, 100, 40, 0.28);
  transition: color 150ms ease, background 150ms ease, padding-left 150ms ease;
}

.grimhold-community-panel__nav a:last-child {
  border-bottom: 0;
}

.grimhold-community-panel__nav a span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  flex: 0 0 auto;
  color: #d6a24a;
  font: 900 13px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  background: rgba(15, 12, 9, 0.62);
  border: 1px solid rgba(150, 108, 44, 0.42);
  box-shadow: inset 0 1px 0 rgba(255, 229, 169, 0.06);
}

.grimhold-community-panel__nav a strong {
  display: block;
  min-width: 0;
  color: inherit;
  font: 850 12.5px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.grimhold-community-panel__nav a:hover,
.grimhold-community-panel__nav a:focus-visible {
  color: #f0d28f;
  padding-left: 6px;
  background: linear-gradient(90deg, rgba(216, 162, 74, 0.08), transparent 72%);
  text-decoration: none;
}

@media (max-width: 1100px) {
  .grimhold-home-lower {
    grid-template-columns: 1fr;
  }

  .grimhold-home-lower__sidebar {
    order: 2;
  }
}

@media (max-width: 720px) {
  .grimhold-home-lower {
    gap: 18px;
  }

  .grimhold-top-players-panel {
    padding: 14px;
  }
}

/* Grimhold World Status row */
.grimhold-world-status {
  display: grid;
  gap: 16px;
  margin: 0;
  padding: 18px;
  background:
    linear-gradient(180deg, rgba(10, 10, 10, 0.90), rgba(5, 5, 5, 0.94)),
    url("images/branding/navbar-texture-dark.png") center / cover repeat;
  border: 1px solid rgba(139, 100, 40, 0.58);
  box-shadow:
    0 18px 36px rgba(0, 0, 0, 0.46),
    inset 0 1px 0 rgba(239, 200, 120, 0.08),
    inset 0 -1px 0 rgba(0, 0, 0, 0.72);
}

.grimhold-world-status__head {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
}

.grimhold-world-status__eyebrow {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 20px;
  color: #c8a96e;
  font: 900 18px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  text-shadow:
    0 1px 3px rgba(0, 0, 0, 0.92),
    0 0 18px rgba(184, 134, 52, 0.18);
}

.grimhold-world-status__eyebrow::before,
.grimhold-world-status__eyebrow::after {
  content: "";
  display: block;
  width: clamp(48px, 7vw, 140px);
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(184, 132, 50, 0.60) 40%,
    rgba(220, 175, 90, 0.90)
  );
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.60);
}

.grimhold-world-status__eyebrow::after {
  background: linear-gradient(
    90deg,
    rgba(220, 175, 90, 0.90),
    rgba(184, 132, 50, 0.60) 60%,
    transparent
  );
}

.grimhold-world-status__grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0;
  min-width: 0;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(25, 23, 20, 0.88), rgba(8, 8, 8, 0.94)),
    radial-gradient(circle at 50% 0%, rgba(154, 103, 37, 0.12), transparent 58%);
  border: 1px solid rgba(124, 88, 37, 0.74);
  box-shadow:
    inset 0 1px 0 rgba(247, 213, 143, 0.09),
    inset 0 -10px 24px rgba(0, 0, 0, 0.32),
    0 14px 28px rgba(0, 0, 0, 0.34);
}

.grimhold-world-status__card,
.grimhold-world-status__card:link,
.grimhold-world-status__card:visited {
  position: relative;
  display: grid;
  grid-template-rows: auto auto auto auto;
  justify-items: center;
  align-content: center;
  min-width: 0;
  min-height: 146px;
  padding: 18px 14px 17px;
  color: #dac39a !important;
  text-align: center;
  text-decoration: none !important;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(255, 231, 178, 0.025), rgba(0, 0, 0, 0.09));
  border: 0;
  border-right: 1px solid rgba(139, 100, 40, 0.38);
  box-shadow:
    inset 1px 0 0 rgba(255, 229, 169, 0.025),
    inset -1px 0 0 rgba(0, 0, 0, 0.42);
  cursor: default;
  transition: transform 160ms ease, border-color 160ms ease, filter 160ms ease, box-shadow 160ms ease;
}

.grimhold-world-status__card::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(247, 213, 143, 0.035), transparent 35%, rgba(0, 0, 0, 0.12));
  opacity: 0.84;
}

.grimhold-world-status__card:last-child {
  border-right: 0;
  box-shadow: inset 1px 0 0 rgba(255, 229, 169, 0.025);
}

.grimhold-world-status__card--link {
  cursor: pointer;
}

.grimhold-world-status__card--link:hover {
  transform: translateY(-2px);
  filter: brightness(1.045);
  background:
    linear-gradient(180deg, rgba(216, 166, 74, 0.075), rgba(0, 0, 0, 0.10));
  box-shadow:
    inset 1px 0 0 rgba(255, 229, 169, 0.04),
    inset -1px 0 0 rgba(0, 0, 0, 0.38),
    inset 0 0 0 1px rgba(194, 139, 55, 0.18),
    0 10px 18px rgba(0, 0, 0, 0.24);
}

.grimhold-world-status__icon,
.grimhold-world-status__sprite {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  margin-bottom: 11px;
  color: #d6a24a;
  background: radial-gradient(circle, rgba(216, 162, 74, 0.13), rgba(12, 10, 8, 0.72) 68%);
  border: 1px solid rgba(150, 108, 44, 0.56);
  box-shadow: inset 0 1px 0 rgba(255, 229, 169, 0.06);
}

.grimhold-world-status__icon svg {
  display: block;
  width: 28px;
  height: 28px;
  fill: currentColor;
  stroke: none;
}

.grimhold-world-status__sprite {
  width: 76px;
  height: 66px;
  margin-bottom: 9px;
  padding: 5px;
  box-sizing: border-box;
}

.grimhold-world-status__sprite img {
  display: block;
  max-width: 64px;
  max-height: 56px;
  object-fit: contain;
  image-rendering: pixelated;
  image-rendering: crisp-edges;
  filter: drop-shadow(0 6px 7px rgba(0, 0, 0, 0.60));
}

.grimhold-world-status__sprite.is-empty::before {
  content: "";
  width: 28px;
  height: 28px;
  background:
    linear-gradient(135deg, transparent 42%, rgba(214, 162, 74, 0.82) 43%, rgba(214, 162, 74, 0.82) 57%, transparent 58%),
    linear-gradient(45deg, transparent 42%, rgba(214, 162, 74, 0.82) 43%, rgba(214, 162, 74, 0.82) 57%, transparent 58%);
  opacity: 0.58;
}

.grimhold-world-status__label {
  display: block;
  max-width: 100%;
  color: #b98b45;
  font: 850 11px/1.15 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.grimhold-world-status__value {
  display: block;
  max-width: 100%;
  margin-top: 8px;
  color: #f0d28f;
  font: 850 clamp(20px, 1.55vw, 30px)/1.05 Georgia, "Times New Roman", serif;
  letter-spacing: 0;
  text-shadow: 0 2px 5px rgba(0, 0, 0, 0.82);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.grimhold-world-status__card--boosted .grimhold-world-status__value {
  font-size: clamp(17px, 1.18vw, 23px);
}

.grimhold-world-status__subtitle {
  display: block;
  max-width: 100%;
  margin-top: 7px;
  color: #b9aa8f;
  font: 700 12px/1.25 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  font-style: normal;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.grimhold-world-status__subtitle--state {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.grimhold-world-status__dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  flex: 0 0 auto;
  border-radius: 50%;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.52);
}

.grimhold-world-status__dot.is-online {
  background: #4c9f50;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.14), 0 0 7px rgba(76, 159, 80, 0.22), 0 0 0 1px rgba(0, 0, 0, 0.56);
}

.grimhold-world-status__dot.is-offline {
  background: #9b312b;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.12), 0 0 7px rgba(155, 49, 43, 0.20), 0 0 0 1px rgba(0, 0, 0, 0.56);
}

@media (max-width: 1280px) {
  .grimhold-world-status__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .grimhold-world-status__card:nth-child(3n) {
    border-right: 0;
  }

  .grimhold-world-status__card:nth-child(n+4) {
    border-top: 1px solid rgba(139, 100, 40, 0.34);
  }
}

@media (max-width: 720px) {
  .grimhold-world-status {
    padding: 14px;
  }

  .grimhold-world-status__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .grimhold-world-status__card:nth-child(n) {
    border-right: 1px solid rgba(139, 100, 40, 0.34);
    border-top: 1px solid rgba(139, 100, 40, 0.30);
  }

  .grimhold-world-status__card:nth-child(odd) {
    border-left: 0;
  }

  .grimhold-world-status__card:nth-child(even),
  .grimhold-world-status__card:last-child {
    border-right: 0;
  }

  .grimhold-world-status__card:nth-child(-n+2) {
    border-top: 0;
  }

  .grimhold-world-status__card,
  .grimhold-world-status__card:link,
  .grimhold-world-status__card:visited {
    min-height: 136px;
    padding: 16px 10px;
  }

  .grimhold-world-status__label {
    font-size: 10px;
  }
}

@media (max-width: 420px) {
  .grimhold-world-status__grid {
    grid-template-columns: 1fr;
  }

  .grimhold-world-status__card:nth-child(n) {
    border-right: 0;
    border-top: 1px solid rgba(139, 100, 40, 0.30);
  }

  .grimhold-world-status__card:first-child {
    border-top: 0;
  }
}

/* ── World Status: clickable card indicator ↗ ─────────────────────────────── */
.grimhold-world-status__card--link::before {
  content: "↗";
  position: absolute;
  top: 8px;
  right: 10px;
  font-size: 10px;
  line-height: 1;
  color: #c8a96e;
  opacity: 0.38;
  z-index: 2;
  pointer-events: none;
  transition: opacity 160ms ease;
}
.grimhold-world-status__card--link:hover::before {
  opacity: 0.72;
}

/* ── World Status: icon glow on hover (link cards) ─────────────────────────── */
.grimhold-world-status__card--link:hover .grimhold-world-status__icon {
  filter: brightness(1.22);
  border-color: rgba(200, 169, 110, 0.58);
}

/* ── World Status: Daily Leader name uses smaller font to fit longer names ──── */
.grimhold-world-status__value--leader {
  font-size: clamp(16px, 1.25vw, 22px) !important;
}

/* ============================================================
   Grimhold Explore section — heading + marketing cards
   ============================================================ */

/* Centered premium MMORPG divider heading */
.grimhold-explore-heading {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 18px;
}

.grimhold-explore-heading span {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 20px;
  color: #c8a96e;
  font: 900 18px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  text-shadow:
    0 1px 3px rgba(0, 0, 0, 0.92),
    0 0 18px rgba(184, 134, 52, 0.18);
}

/* Left decorative line */
.grimhold-explore-heading span::before {
  content: "";
  display: block;
  width: clamp(48px, 7vw, 140px);
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(184, 132, 50, 0.60) 40%,
    rgba(220, 175, 90, 0.90)
  );
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.60);
}

/* Right decorative line (mirror) */
.grimhold-explore-heading span::after {
  content: "";
  display: block;
  width: clamp(48px, 7vw, 140px);
  height: 1px;
  background: linear-gradient(
    90deg,
    rgba(220, 175, 90, 0.90),
    rgba(184, 132, 50, 0.60) 60%,
    transparent
  );
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.60);
}

.grimhold-phase8-explore__grid {
  gap: 10px;
}

.grimhold-explore-card {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 252px;
  overflow: hidden;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  border: 1px solid rgba(139, 100, 40, 0.46);
  box-shadow:
    0 8px 22px rgba(0, 0, 0, 0.52),
    inset 0 1px 0 rgba(255, 229, 169, 0.05);
  transition: transform 220ms ease, border-color 220ms ease, box-shadow 220ms ease;
}

/* Vignette: clear top to reveal the image, heavy bottom for text legibility */
.grimhold-explore-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(
      to bottom,
      rgba(4, 2, 1, 0.06) 0%,
      rgba(4, 2, 1, 0.18) 38%,
      rgba(4, 2, 1, 0.82) 70%,
      rgba(3, 2, 1, 0.97) 100%
    ),
    linear-gradient(
      135deg,
      rgba(168, 96, 22, 0.10) 0%,
      transparent 48%
    );
}

/* Subtle golden border glow on hover */
.grimhold-explore-card:hover {
  transform: translateY(-4px);
  border-color: rgba(200, 152, 58, 0.64);
  box-shadow:
    0 16px 36px rgba(0, 0, 0, 0.64),
    inset 0 1px 0 rgba(255, 229, 169, 0.09),
    0 0 0 1px rgba(190, 140, 50, 0.20);
}

.grimhold-explore-card__content {
  position: relative;
  z-index: 2;
  padding: 15px 16px 18px;
}

/* Specificity 0-2-0 beats legacy .grimhold-phase8-explore__grid strong (0-1-1) */
.grimhold-phase8-explore__grid .grimhold-explore-card__title {
  display: block;
  max-width: 100%;
  margin: 0 0 6px;
  color: #f0d68a;
  font: 800 clamp(13px, 1.05vw, 17px) / 1.15 Georgia, "Times New Roman", serif;
  letter-spacing: 0.01em;
  text-shadow:
    0 2px 6px rgba(0, 0, 0, 0.94),
    0 1px 2px rgba(0, 0, 0, 0.86);
}

.grimhold-phase8-explore__grid .grimhold-explore-card__desc {
  margin: 0;
  color: #c6b89e;
  font: 400 clamp(10.5px, 0.76vw, 12.5px) / 1.44 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.92);
}

/* 2 columns on small/tablet (override the legacy 1fr rule) */
@media (max-width: 860px) {
  .grimhold-phase8-explore__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .grimhold-explore-card {
    min-height: 210px;
  }
}

/* Single column on phones */
@media (max-width: 480px) {
  .grimhold-phase8-explore__grid {
    grid-template-columns: 1fr;
  }

  .grimhold-explore-card {
    min-height: 180px;
  }
}

/* ============================================================
   News section — Community panel (replaces event card)
   ============================================================ */

.grimhold-news-community-panel {
  display: flex;
  flex-direction: column;
  min-height: 190px;
  background:
    linear-gradient(180deg, rgba(10, 10, 10, 0.94), rgba(5, 5, 5, 0.98)),
    url("images/branding/navbar-texture-dark.png") center / cover repeat;
  border: 1px solid rgba(139, 100, 40, 0.58);
  box-shadow:
    0 18px 36px rgba(0, 0, 0, 0.46),
    inset 0 1px 0 rgba(239, 200, 120, 0.08),
    inset 0 -1px 0 rgba(0, 0, 0, 0.72);
}

.grimhold-news-community-panel__head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px 12px;
  border-bottom: 1px solid rgba(139, 100, 40, 0.38);
}

.grimhold-news-community-panel__headicon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  flex: 0 0 auto;
  color: #d6a24a;
  background: radial-gradient(circle, rgba(216, 162, 74, 0.13), rgba(12, 10, 8, 0.74) 68%);
  border: 1px solid rgba(150, 108, 44, 0.54);
  box-shadow: inset 0 1px 0 rgba(255, 229, 169, 0.06);
}

.grimhold-news-community-panel__headicon svg {
  display: block;
  width: 18px;
  height: 18px;
  fill: currentColor;
}

.grimhold-news-community-panel__head strong {
  color: #e0b05f;
  font: 900 13px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.90);
}

.grimhold-news-community-panel__list {
  display: flex;
  flex-direction: column;
  flex: 1;
  margin: 0;
  padding: 0;
  list-style: none;
}

.grimhold-news-community-panel__item {
  display: flex;
  flex: 1;
  border-bottom: 1px solid rgba(139, 100, 40, 0.22);
}

.grimhold-news-community-panel__item--last,
.grimhold-news-community-panel__item:last-child {
  border-bottom: 0;
}

.grimhold-news-community-panel__link,
.grimhold-news-community-panel__link:link,
.grimhold-news-community-panel__link:visited {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1;
  min-width: 0;
  padding: 10px 16px;
  color: #d8c39e;
  text-decoration: none;
  transition: color 150ms ease, background 150ms ease, padding-left 150ms ease;
}

.grimhold-news-community-panel__link:hover,
.grimhold-news-community-panel__link:focus-visible {
  color: #f0d28f;
  padding-left: 20px;
  background: linear-gradient(90deg, rgba(216, 162, 74, 0.08), transparent 80%);
  text-decoration: none;
}

.grimhold-news-community-panel__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  flex: 0 0 auto;
  color: #c8973e;
  background: rgba(15, 12, 9, 0.64);
  border: 1px solid rgba(150, 108, 44, 0.40);
  box-shadow: inset 0 1px 0 rgba(255, 229, 169, 0.05);
}

.grimhold-news-community-panel__badge svg {
  display: block;
  width: 15px;
  height: 15px;
  fill: currentColor;
  stroke: none;
}

.grimhold-news-community-panel__info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.grimhold-news-community-panel__label {
  display: block;
  color: #7a6a50;
  font: 600 9.5px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.grimhold-news-community-panel__value {
  display: block;
  min-width: 0;
  color: inherit;
  font: 700 12.5px/1.2 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.grimhold-news-community-panel__sub {
  font-style: normal;
  font-weight: 400;
  font-size: 11px;
  color: #9a8a6e;
}

.grimhold-news-community-panel__time {
  flex-shrink: 0;
  color: #6e5e42;
  font: 400 10px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
}

/* ============================================================
   Community Activity — right column of News and Events grid
   ============================================================ */

.grimhold-community-activity {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  width: 330px;
  min-width: 0;
}

.grimhold-community-activity__panel {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: linear-gradient(180deg, rgba(14, 18, 17, 0.78), rgba(9, 8, 6, 0.22));
  border: 1px solid rgba(153, 105, 45, 0.30);
  box-shadow:
    0 18px 36px rgba(0, 0, 0, 0.46),
    inset 0 1px 0 rgba(239, 200, 120, 0.08),
    inset 0 -1px 0 rgba(0, 0, 0, 0.72);
}

.grimhold-community-activity__head {
  padding: 13px 16px 12px;
  border-bottom: 1px solid rgba(139, 100, 40, 0.38);
}

.grimhold-community-activity__head strong {
  color: #e0b05f;
  font: 900 11px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.90);
}

.grimhold-community-activity__grid {
  display: flex;
  flex-direction: column;
  flex: 1;
}

.grimhold-community-activity__card {
  display: flex;
  flex: 1;
  border-bottom: 1px solid rgba(139, 100, 40, 0.22);
}

.grimhold-community-activity__card--last,
.grimhold-community-activity__card:last-child {
  border-bottom: 0;
}

.grimhold-community-activity__link,
.grimhold-community-activity__link:link,
.grimhold-community-activity__link:visited {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 12px;
  flex: 1;
  min-width: 0;
  padding: 14px 16px;
  color: #d8c39e;
  text-decoration: none;
  transition: color 150ms ease, background 150ms ease, padding-left 150ms ease;
}

.grimhold-community-activity__link:hover,
.grimhold-community-activity__link:focus-visible {
  color: #f0d28f;
  padding-left: 20px;
  background: linear-gradient(90deg, rgba(216, 162, 74, 0.08), transparent 80%);
  text-decoration: none;
}

.grimhold-community-activity__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 52px;
  height: 52px;
  margin-top: 1px;
  color: #e0b05f;
  background: rgba(15, 12, 9, 0.64);
  border: 1px solid rgba(150, 108, 44, 0.40);
  box-shadow: inset 0 1px 0 rgba(255, 229, 169, 0.05);
}

.grimhold-community-activity__badge svg {
  display: block;
  width: 40px;
  height: 40px;
  fill: currentColor;
  stroke: none;
}

.grimhold-community-activity__body {
  display: flex;
  flex-direction: column;
  gap: 3px;
  flex: 1;
  min-width: 0;
}

.grimhold-community-activity__label {
  display: block;
  color: #c8a96e;
  font: 600 13px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.10em;
  text-transform: uppercase;
}

.grimhold-community-activity__value {
  display: block;
  min-width: 0;
  color: #e8d4a8;
  font: 700 12.5px/1.2 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.80);
}

.grimhold-community-activity__sub {
  display: block;
  min-width: 0;
  color: #9a8a6a;
  font: 400 10.5px/1.3 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.grimhold-community-activity__time {
  display: block;
  margin-top: 1px;
  color: #6a5a3e;
  font: 400 10px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
}

/* ============================================================
   PHASE 2 — .grimhold-inner — TableContainer modernization
   Sprint 1 | 2026-06-11
   ============================================================ */

/* Panel wrapper */
.grimhold-inner .TableContainer {
  background: linear-gradient(180deg, #0e1211, #090806);
  border: 1px solid rgba(153,105,45,0.30) !important;
  box-shadow:
    0 18px 36px rgba(0,0,0,0.46),
    inset 0 1px 0 rgba(239,200,120,0.08),
    inset 0 -1px 0 rgba(0,0,0,0.72);
  font-size: 13px;
  margin-bottom: 16px;
  overflow: hidden;
}

/* GIF frame elements — all use inline style="background-image:..." */
.grimhold-inner .CaptionEdgeLeftTop,
.grimhold-inner .CaptionEdgeRightTop,
.grimhold-inner .CaptionEdgeLeftBottom,
.grimhold-inner .CaptionEdgeRightBottom,
.grimhold-inner .CaptionBorderTop,
.grimhold-inner .CaptionBorderBottom,
.grimhold-inner .CaptionVerticalLeft,
.grimhold-inner .CaptionVerticalRight,
.grimhold-inner .TableShadowContainerRightTop,
.grimhold-inner .TableShadowRightTop,
.grimhold-inner .TableBottomShadow,
.grimhold-inner .TableBottomLeftShadow,
.grimhold-inner .TableBottomRightShadow {
  display: none !important;
}

/* Caption header bar */
.grimhold-inner .TableContainer .CaptionContainer,
.grimhold-inner .TableContainer .CaptionContainer .CaptionInnerContainer {
  background: rgba(8,5,2,0.65) !important;
  height: auto !important;
}

.grimhold-inner .TableContainer .CaptionContainer {
  border-bottom: 1px solid rgba(153,105,45,0.35);
  border-left: 3px solid rgba(200,169,110,0.70);
}

.grimhold-inner .TableContainer .CaptionContainer .CaptionInnerContainer {
  padding: 10px 16px;
}

/* Caption title text */
.grimhold-inner .TableContainer .CaptionContainer .Text {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #c8a96e !important;
  font: 700 11px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif !important;
  letter-spacing: 0.20em;
  text-transform: uppercase;
  text-shadow: 0 1px 3px rgba(0,0,0,0.90), 0 0 16px rgba(184,134,52,0.14);
  padding: 0;
}

/* RightArea inside caption (e.g. "Last Update: ...") */
.grimhold-inner .CaptionContainer .RightArea {
  float: none;
  margin-right: 0;
  color: #7a6a4a;
  font: 400 10px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.04em;
  text-transform: none;
  text-shadow: none;
}

/* Strip old beige/brown from all Table layout variants */
.grimhold-inner .TableContainer .Table1,
.grimhold-inner .TableContainer .Table2,
.grimhold-inner .TableContainer .Table3,
.grimhold-inner .TableContainer .Table4,
.grimhold-inner .TableContainer .Table5 {
  background: transparent !important;
  border: none !important;
  width: 100%;
}

/* Shadow container — background-repeat: repeat-y repeats a shadow GIF */
.grimhold-inner .TableContentAndRightShadow {
  background-image: none !important;
  background-repeat: no-repeat;
  margin-right: 0;
  font-size: inherit;
}

/* InnerTableContainer — remove box-shadow and spacing */
.grimhold-inner .TableContainer .InnerTableContainer,
.grimhold-inner .InnerTableContainer .TableContentContainer {
  box-shadow: none;
  margin: 0 !important;
  padding: 0;
}

/* TableContentContainer */
.grimhold-inner .TableContentContainer {
  background: transparent !important;
  border: none !important;
  margin: 0 !important;
}

/* The actual <table> element */
.grimhold-inner .TableContent {
  width: 100%;
  border-collapse: collapse;
  border: none !important;
  color: #ead6b0;
  font: 13px/1.5 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
}

.grimhold-inner .TableContent td,
.grimhold-inner .TableContent th {
  padding: 8px 12px !important;
  border: none !important;
  border-bottom: 1px solid rgba(153,105,45,0.15) !important;
  color: #ead6b0;
  vertical-align: middle;
}

/* Column header rows (.LabelH is a class on <tr>) */
.grimhold-inner .TableContent tr.LabelH > td,
.grimhold-inner .TableContent tr.LabelH > th,
.grimhold-inner .LabelH > td,
.grimhold-inner .LabelH > th {
  background: rgba(139,100,40,0.20) !important;
  color: #c8a96e !important;
  font: 700 10.5px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif !important;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  border-bottom: 1px solid rgba(153,105,45,0.38) !important;
  padding: 9px 12px !important;
}

/* Row alternation */
.grimhold-inner .TableContainer .Odd,
.grimhold-inner .TableContent tr:nth-child(odd),
.grimhold-inner tr.Odd {
  background-color: rgba(255,255,255,0.025) !important;
}

.grimhold-inner .TableContainer .Even,
.grimhold-inner .TableContent tr:nth-child(even),
.grimhold-inner tr.Even {
  background-color: transparent !important;
}

/* Row hover — skip header rows */
.grimhold-inner .TableContent tr:not(.LabelH):hover > td {
  background-color: rgba(200,169,110,0.055) !important;
}

/* Links inside table content */
.grimhold-inner .TableContent a,
.grimhold-inner .TableContent a:link,
.grimhold-inner .TableContent a:visited {
  color: #c8a96e;
  text-decoration: none;
  transition: color 140ms ease;
}

.grimhold-inner .TableContent a:hover {
  color: #f0d68a;
}

.grimhold-inner .myaac-table tbody tr:nth-child(odd),
.grimhold-inner .myaac-table tbody tr:nth-child(even) {
  background: transparent !important;
}

/* ── Phase 2 hotfix: clear legacy Box/BoxContent parchment backgrounds ──
   Root cause: .Content .BoxContent had background-color:#fff2db which bled
   through the .TableContainer gradient and transparent .TableContentContainer,
   making both appear light grey instead of dark. */
.grimhold-inner .Content .Box {
  background: transparent !important;
  border-color: transparent !important;
}

.grimhold-inner .Content .BoxContent {
  background-color: rgba(5, 3, 1, 0.85) !important;
  background-image: none !important;
  color: #ead6b0 !important;
  min-height: unset;
}

.grimhold-inner .Content .BoxContent td {
  color: #ead6b0;
}

.grimhold-inner .Content .Border_2 {
  background: transparent !important;
}

.grimhold-inner .Content .Border_3 {
  border-top-color: transparent !important;
  border-bottom-color: transparent !important;
}

.grimhold-inner #statusbar {
  background-color: rgba(10,8,8,0.85) !important;
}

.grimhold-inner .Content a,
.grimhold-inner .Content a:link,
.grimhold-inner .Content a:visited {
  color: #c8a96e;
}

.grimhold-inner .Content a:hover {
  color: #f0d68a;
  text-decoration: none;
}

/* ── Phase 2 — Semantic red/green softening ──────────────────────────────────
   Replaces harsh CSS-keyword primaries (#ff0000, #008000) with Grimhold-themed
   danger/success tones. Semantic meaning is preserved — red stays danger/offline,
   green stays success/online. Only saturation and brightness are adjusted.
   Source: red/green color audit 2026-06-11.
   ──────────────────────────────────────────────────────────────────────────── */

/* CSS-class-based: missing from bootstrap-myaac.css override pass */
.grimhold-inner .SmallBox .ErrorMessage {
  color: #e05252 !important;
}

.grimhold-inner .Content .BoxContent .ff_correct {
  color: #e05252 !important;
}

/* Inline-style override via attribute selector —
   covers PHP-rendered and Twig-rendered style="color: red/green" */
.grimhold-inner [style*="color: red"],
.grimhold-inner [style*="color:red"] {
  color: #e05252 !important;
}

.grimhold-inner [style*="color: green"],
.grimhold-inner [style*="color:green"] {
  color: #6db872 !important;
}

/* ── Phase 3 Step 1 — Remove GIF frame chrome from #News.Box ────────────────
   Corner GIFs (Corner-tl/tr/bl/br) and Border_1 strips are purely decorative
   GIF elements that make up the Tibia.com-style box frame. Hiding them leaves
   the BorderTitleText (green bar) and .Title img intact per user instructions.
   Uses direct child selector (>) to avoid touching Border_1 inside Border_2.
   ─────────────────────────────────────────────────────────────────────────── */
.grimhold-inner #News > .Corner-tl,
.grimhold-inner #News > .Corner-tr,
.grimhold-inner #News > .Border_1,
.grimhold-inner #News > .CornerWrapper-b {
  display: none;
}

/* ── Phase 3 Step 2 — Remove GIF frame chrome from GrimholdStatusBarBox ─────
   Hides the decorative GIF corners and border strips around the status bar.
   Replaces the newsheadline_background.gif red bar with a dark semi-transparent
   strip. InfoBar content (Download Client, Discord, Players Online) is preserved
   inside the restyled BorderTitleText container. #statusbar collapse is kept.
   ─────────────────────────────────────────────────────────────────────────── */
.grimhold-inner .GrimholdStatusBarBox > .Corner-tl,
.grimhold-inner .GrimholdStatusBarBox > .Corner-tr,
.grimhold-inner .GrimholdStatusBarBox > .Border_1,
.grimhold-inner .GrimholdStatusBarBox > .CornerWrapper-b {
  display: none;
}

.grimhold-inner .GrimholdStatusBarBox .BorderTitleText {
  background-image: none !important;
  background-color: rgba(10, 5, 2, 0.92) !important;
  border-top: 1px solid rgba(153, 105, 45, 0.18) !important;
  border-bottom: 1px solid rgba(153, 105, 45, 0.18) !important;
  height: auto !important;
  padding: 5px 10px !important;
}

/* ── Phase 3 Step 3 — Modernize #News.Box header bar on internal pages ────────
   Replaces title-background-green.gif with a Grimhold dark bar.
   .Title img is transparent PNG with gold text (headline.php rgb(240,209,164))
   or static GIFs — both read cleanly on the dark background unchanged.
   Direct-child (>) targets only the top-level box header, never nested elements.
   .Title is position:absolute relative to #News.Box (position:relative), so only
   top/left need adjusting to re-centre in the new 40px bar height.
   ─────────────────────────────────────────────────────────────────────────── */
.grimhold-inner #News > .BorderTitleText {
  background-image: none !important;
  background-color: rgba(6, 4, 2, 0.88) !important;
  border-left: 3px solid rgba(200, 169, 110, 0.65) !important;
  border-bottom: 1px solid rgba(153, 105, 45, 0.35) !important;
  height: 40px !important;
}

/* Hide legacy headline image on internal pages */
.grimhold-inner #News > .Title {
  display: none !important;
}

/* Modern Grimhold page title — replaces .Title img */
.grimhold-inner #News > .grimhold-page-title {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 40px;
  display: flex;
  align-items: center;
  padding: 0 16px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 22px;
  font-weight: 700;
  font-style: normal;
  color: #e8c87a;
  text-shadow:
    0 1px 4px rgba(0, 0, 0, 0.90),
    0 0 12px rgba(0, 0, 0, 0.60);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  line-height: 1;
  pointer-events: none;
}

/* ── Step 0 — Global Internal Navbar (grimhold-inner-nav-active) ─────────────
   All rules below are gated by body.grimhold-inner-nav-active, which is only
   added when GRIMHOLD_INNER_NAV_ENABLED = true AND PAGE !== 'news'.
   Homepage (.grimhold-homepage) is completely isolated — zero intersection.
   ─────────────────────────────────────────────────────────────────────────── */

/* ── Group A: Layout offset correction ──────────────────────────────────────
   #ContentRow has position:relative; top:155px — a legacy offset for the
   #LeftArtwork logo slot above the 3-column layout.
   When the internal nav renders before #ContentRow, this 155px offset would
   create a blank gap between the nav bottom and the content start.
   #LeftArtwork { top: -140px } would also float up into the navbar area.
   Both are neutralised here, gated by the nav-active body class.
   ─────────────────────────────────────────────────────────────────────────── */
body.grimhold-inner-nav-active #ContentRow {
  top: 0 !important;
}

body.grimhold-inner-nav-active #LeftArtwork {
  display: none;
}

body.grimhold-inner-nav-active #MenuColumn {
  top: 92px !important;
}

body.grimhold-inner-nav-active #ThemeboxesColumn {
  top: 92px !important;
}

body.grimhold-inner-nav-active #ContentColumn {
  padding-top: 92px !important;
}

body.grimhold-inner-nav-active #RightArtwork {
  display: none;
}

/* ── Group B: Internal nav container ────────────────────────────────────────
   .grimhold-inner-nav is the extra class added only to the internal nav element.
   Targets it without touching .grimhold-homepage nav rules at all.
   ─────────────────────────────────────────────────────────────────────────── */
.grimhold-inner-nav-active .grimhold-inner-nav {
  position: relative;
  z-index: 200;
  overflow: visible;
  grid-template-columns: 250px minmax(0, 1fr) 178px;
  min-height: 92px;
  padding: 10px 18px;
  background-color: #070808;
  background-image:
    linear-gradient(180deg, rgba(0, 0, 0, 0.10), rgba(0, 0, 0, 0.34)),
    url("images/branding/navbar-texture-dark.png");
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  border-left: 0;
  border-right: 0;
  border-top: 0;
  border-bottom: 1px solid rgba(236, 164, 64, 0.44);
  box-shadow: 0 18px 38px rgba(0, 0, 0, 0.52), inset 0 1px 0 rgba(255, 229, 169, 0.12);
}

/* Brand logo: containing block for absolute-positioned img, top-anchored so logo overflows below nav */
.grimhold-inner-nav-active .grimhold-inner-nav .grimhold-phase8-nav__brand {
  position: relative;
  display: block;
  align-self: start;
  height: 92px;
  overflow: visible;
}


.grimhold-inner-nav-active .grimhold-inner-nav .grimhold-phase8-nav__brand img {
  position: absolute;
  left: 50%;
  top: -24px;
  z-index: 1;
  width: 260px;
  height: auto;
  max-width: none;
  transform: translateX(-50%);
  filter: drop-shadow(0 8px 14px rgba(0, 0, 0, 0.88));
}

/* Nav link row */
.grimhold-inner-nav-active .grimhold-inner-nav .grimhold-phase8-nav__links {
  height: 92px;
  gap: 0;
  justify-content: center;
}

.grimhold-inner-nav-active .grimhold-inner-nav .grimhold-phase8-nav__links a,
.grimhold-inner-nav-active .grimhold-inner-nav .grimhold-phase8-nav__links a:link,
.grimhold-inner-nav-active .grimhold-inner-nav .grimhold-phase8-nav__links a:visited {
  display: grid;
  grid-template-rows: 28px 16px;
  align-content: center;
  justify-items: center;
  min-width: clamp(68px, 5vw, 100px);
  height: 92px;
  padding: 14px 10px 12px;
  color: #a8b0b6 !important;
  font: 800 11px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif !important;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none !important;
  white-space: nowrap;
  border-left: 1px solid rgba(255, 255, 255, 0.03);
  border-right: 1px solid rgba(0, 0, 0, 0.35);
  position: relative;
}

.grimhold-inner-nav-active .grimhold-inner-nav .grimhold-phase8-nav__links a::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 10px;
  right: 10px;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(232, 178, 88, 0.92), transparent);
  opacity: 0;
  transition: opacity 140ms ease;
}

.grimhold-inner-nav-active .grimhold-inner-nav .grimhold-phase8-nav__links a:hover,
.grimhold-inner-nav-active .grimhold-inner-nav .grimhold-phase8-nav__links a.is-active {
  color: #f0d08e !important;
  background: linear-gradient(180deg, rgba(230, 178, 88, 0.09), rgba(230, 178, 88, 0.02));
}

.grimhold-inner-nav-active .grimhold-inner-nav .grimhold-phase8-nav__links a:hover::after,
.grimhold-inner-nav-active .grimhold-inner-nav .grimhold-phase8-nav__links a.is-active::after {
  opacity: 1;
}

/* SVG nav icons */
.grimhold-inner-nav-active .grimhold-inner-nav .grimhold-phase8-nav__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 26px;
  height: 26px;
  color: #c8a050;
}

/* Dropdown container */
.grimhold-inner-nav-active .grimhold-inner-nav .grimhold-phase8-nav__dropdown {
  position: relative;
  display: inline-flex;
}

.grimhold-inner-nav-active .grimhold-inner-nav .grimhold-phase8-nav__dropdown-menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 600;
  min-width: 160px;
  padding: 4px 0;
  background: rgba(10, 6, 3, 0.97);
  border: 1px solid rgba(200, 150, 50, 0.28);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.62);
}

.grimhold-inner-nav-active .grimhold-inner-nav .grimhold-phase8-nav__dropdown:hover
  .grimhold-phase8-nav__dropdown-menu {
  display: block;
}

.grimhold-inner-nav-active .grimhold-inner-nav .grimhold-phase8-nav__dropdown-menu a,
.grimhold-inner-nav-active .grimhold-inner-nav .grimhold-phase8-nav__dropdown-menu a:link,
.grimhold-inner-nav-active .grimhold-inner-nav .grimhold-phase8-nav__dropdown-menu a:visited {
  display: block !important;
  height: auto !important;
  padding: 8px 14px !important;
  color: #c8a96e !important;
  font: 700 11px/1 "Trebuchet MS", Arial, sans-serif !important;
  text-transform: uppercase;
  text-decoration: none !important;
  border: 0 !important;
  box-shadow: none !important;
  position: static !important;
}

.grimhold-inner-nav-active .grimhold-inner-nav .grimhold-phase8-nav__dropdown-menu a:hover {
  color: #f0d08e !important;
  background: rgba(200, 150, 50, 0.10);
}

.grimhold-inner-nav-active .grimhold-inner-nav .grimhold-phase8-nav__dropdown-menu a::after {
  display: none !important;
}

/* CTA button — compact 2-col grid for internal navbar */
.grimhold-inner-nav-active .grimhold-inner-nav .grimhold-phase8-nav__play,
.grimhold-inner-nav-active .grimhold-inner-nav .grimhold-phase8-nav__play:link,
.grimhold-inner-nav-active .grimhold-inner-nav .grimhold-phase8-nav__play:visited {
  display: grid !important;
  grid-template-columns: 22px max-content;
  grid-template-rows: auto auto;
  column-gap: 5px;
  align-content: center;
  align-items: center;
  justify-items: start;
  width: 166px;
  min-height: 62px;
  padding: 0 14px 0 4px;
  color: #f0d08e !important;
  background-color: transparent;
  background-image: url("images/branding/play-now-bg.png");
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  border: 0 !important;
  box-shadow: none;
  text-decoration: none !important;
  text-transform: uppercase;
  transition: transform 140ms ease, filter 140ms ease;
}

.grimhold-inner-nav-active .grimhold-inner-nav .grimhold-phase8-nav__play::before {
  content: "⚔";
  position: relative;
  left: auto;
  top: auto;
  grid-column: 1;
  grid-row: 1 / span 2;
  justify-self: center;
  align-self: center;
  font-size: 15px;
  color: #f0d08e;
  transform: translateY(-3px);
}

.grimhold-inner-nav-active .grimhold-inner-nav .grimhold-phase8-nav__play span {
  display: block;
  grid-column: 2;
  grid-row: 1;
  color: #f0d08e;
  font-family: Georgia, serif;
  font-size: 14px;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
  transform: translateY(2px);
}

.grimhold-inner-nav-active .grimhold-inner-nav .grimhold-phase8-nav__play em {
  display: block;
  grid-column: 2;
  grid-row: 2;
  margin-top: 5px;
  color: #d8a24c;
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  font-size: 8px;
  font-weight: 900;
  font-style: normal;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
  transform: translateY(2px);
}

.grimhold-inner-nav-active .grimhold-inner-nav .grimhold-phase8-nav__play:hover {
  filter: brightness(1.14);
}

/* ── Group C: Compact status strip ──────────────────────────────────────────
   Rendered only when GRIMHOLD_INNER_NAV_ENABLED = true, PAGE !== 'news'.
   Selector uses the plain class (no body prefix) since the element only
   exists in the DOM when the nav-active flag is on.
   ─────────────────────────────────────────────────────────────────────────── */
.grimhold-inner-topbar {
  position: relative;
  z-index: 199;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 18px;
  height: 30px;
  background: rgba(6, 4, 2, 0.94);
  border-bottom: 1px solid rgba(153, 105, 45, 0.20);
  font: 700 10px/1 "Trebuchet MS", Arial, sans-serif;
  color: var(--grimhold-gold-pale, #c8a96e);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  box-sizing: border-box;
}

.grimhold-inner-topbar__dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex-shrink: 0;
  vertical-align: middle;
}

.grimhold-inner-topbar__dot.is-online {
  background: #5db86b;
  box-shadow: 0 0 5px rgba(93, 184, 107, 0.70);
}

.grimhold-inner-topbar__dot.is-offline {
  background: #c04040;
  box-shadow: 0 0 5px rgba(192, 64, 64, 0.70);
}

.grimhold-inner-topbar__status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.grimhold-inner-topbar__sep {
  color: rgba(153, 105, 45, 0.40);
  font-weight: 400;
}

.grimhold-inner-topbar__save {
  margin-left: auto;
}

.grimhold-inner-topbar__countdown {
  font-variant-numeric: tabular-nums;
  color: #e0c070;
  letter-spacing: 0.04em;
}

/* ── InfoBar server status (internal pages with navbar) ──────────────────────
   Replaces Download/Discord links with the server status strip inside
   GrimholdStatusBarBox. Gated by body class so homepage is unaffected.
   ─────────────────────────────────────────────────────────────────────────── */

/* Increase BorderTitleText height to match the ACCOUNT STATUS bar weight */
body.grimhold-inner-nav-active .GrimholdStatusBarBox .BorderTitleText {
  padding: 10px 14px !important;
}

/* InfoBar container: full-width flex, left/right groups */
body.grimhold-inner-nav-active .GrimholdStatusBarBox .InfoBar.grimhold-infobar-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: auto;
  top: 0;
  margin: 0;
  font: 700 11px/1 "Trebuchet MS", Arial, sans-serif;
  color: var(--grimhold-gold-pale, #c8a96e);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

/* Left group: SERVER SAVE IN countdown */
body.grimhold-inner-nav-active .GrimholdStatusBarBox .grimhold-infobar-left {
  display: flex;
  align-items: center;
  gap: 5px;
  color: var(--grimhold-gold-pale, #c8a96e);
}

/* Right group: dot + status + sep + icon + players link */
body.grimhold-inner-nav-active .GrimholdStatusBarBox .grimhold-infobar-right {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--grimhold-gold-pale, #c8a96e);
}

/* Separator dots and pipes */
body.grimhold-inner-nav-active .GrimholdStatusBarBox .grimhold-infobar-sep {
  color: rgba(200, 169, 110, 0.35);
}

/* Players online link */
body.grimhold-inner-nav-active .GrimholdStatusBarBox .grimhold-infobar-players-link {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--grimhold-gold-pale, #c8a96e);
  text-decoration: none;
  border: 0;
}

body.grimhold-inner-nav-active .GrimholdStatusBarBox .grimhold-infobar-players-link:hover {
  color: #fff;
  text-decoration: underline;
}

/* Players SVG icon */
.grimhold-statusbar__players-icon {
  width: 13px;
  height: 13px;
  flex-shrink: 0;
  vertical-align: middle;
}

/* Countdown span */
body.grimhold-inner-nav-active .GrimholdStatusBarBox .js-grimhold-countdown {
  font-variant-numeric: tabular-nums;
  color: #e8c880;
}

/* ── Sidebar: Boosted Today panel (internal pages only) ─────── */
body.grimhold-inner #ThemeboxesColumn .grimhold-sidebar-boosted__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(20, 18, 14, 0.92), rgba(8, 8, 8, 0.96));
  border: 1px solid rgba(124, 88, 37, 0.74);
  box-shadow:
    inset 0 1px 0 rgba(247, 213, 143, 0.09),
    inset 0 -10px 24px rgba(0, 0, 0, 0.32),
    0 14px 28px rgba(0, 0, 0, 0.34);
}

body.grimhold-inner #ThemeboxesColumn .grimhold-sidebar-boosted .grimhold-world-status__card,
body.grimhold-inner #ThemeboxesColumn .grimhold-sidebar-boosted .grimhold-world-status__card:link,
body.grimhold-inner #ThemeboxesColumn .grimhold-sidebar-boosted .grimhold-world-status__card:visited {
  min-height: 0;
  padding: 14px 14px 12px;
  border-right: 0;
  border-bottom: none;
  background: transparent;
}

body.grimhold-inner #ThemeboxesColumn .grimhold-sidebar-boosted .grimhold-world-status__card:last-child {
  border-bottom: 0;
  box-shadow: none;
}

/* Ornamental divider: in-flow ::before on second card — diamond ◆ over faded gold line */
body.grimhold-inner #ThemeboxesColumn .grimhold-sidebar-boosted .grimhold-world-status__card:last-child::before {
  content: "◆";
  display: block;
  width: 88%;
  margin: 0 auto 6px;
  height: 16px;
  color: rgba(210, 178, 110, 0.88);
  font-size: 9px;
  line-height: 16px;
  text-align: center;
  background:
    linear-gradient(90deg, transparent 0%, rgba(200, 169, 110, 0.72) 18%, rgba(200, 169, 110, 0.72) 82%, transparent 100%)
    center / 100% 1px no-repeat;
  pointer-events: none;
}

/* Sprite container: no glow, clean background */
body.grimhold-inner #ThemeboxesColumn .grimhold-sidebar-boosted .grimhold-world-status__sprite {
  width: 100px;
  height: 100px;
  padding: 0;
  margin-bottom: 7px;
  border: 0;
  box-shadow: none;
  background: none;
}

body.grimhold-inner #ThemeboxesColumn .grimhold-sidebar-boosted .grimhold-world-status__sprite img {
  width: 96px;
  height: 96px;
  max-width: 100%;
  max-height: none;
  object-fit: contain;
  filter: drop-shadow(0 6px 10px rgba(0, 0, 0, 0.75));
}

/* Tighter label-to-sprite gap */
body.grimhold-inner #ThemeboxesColumn .grimhold-sidebar-boosted .grimhold-world-status__label {
  margin-top: 0;
}

/* Creature/boss name */
body.grimhold-inner #ThemeboxesColumn .grimhold-sidebar-boosted .grimhold-world-status__value {
  font-size: 20px;
  margin-top: 3px;
}

body.grimhold-inner #ThemeboxesColumn .grimhold-sidebar-boosted .grimhold-world-status__subtitle {
  margin-top: 3px;
}

/* icon: override global fill:none so fill-based SVG renders correctly */
.grimhold-sidebar-boosted .grimhold-top-players-panel__icon svg {
  fill: currentColor;
  stroke: none;
}

/* ── Sidebar: Server Save panel ─────────────────────────── */
.grimhold-sidebar-server-save__content {
  padding: 8px 0 6px;
  text-align: center;
}

.grimhold-sidebar-server-save__label {
  display: block;
  margin-bottom: 12px;
  color: #b98b45;
  font: 850 11px/1.15 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.10em;
  text-transform: uppercase;
}

.grimhold-sidebar-server-save__timer {
  display: block;
  color: #f0d28f;
  font: 700 26px/1 Georgia, "Times New Roman", serif;
  letter-spacing: 0.06em;
  text-shadow:
    0 2px 8px rgba(0, 0, 0, 0.72),
    0 0 22px rgba(184, 134, 52, 0.20);
  font-variant-numeric: tabular-nums;
}

/* ── Sidebar: Search Character panel ────────────────────── */
.grimhold-sidebar-character-search__content {
  padding: 4px 0 2px;
}

.grimhold-sidebar-character-search__text {
  margin: 0 0 12px;
  color: #b9aa8f;
  font: 700 12px/1.4 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-align: center;
}

.grimhold-sidebar-character-search__form {
  margin: 0;
}

.grimhold-sidebar-character-search__input {
  display: block;
  box-sizing: border-box;
  width: 100%;
  padding: 9px 12px;
  margin-bottom: 8px;
  color: #e8d4a8;
  font: 400 13px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  background: rgba(8, 5, 2, 0.72);
  border: 1px solid rgba(139, 100, 40, 0.54);
  border-radius: 5px;
  outline: none;
  transition: border-color 160ms ease, box-shadow 160ms ease;
}

.grimhold-sidebar-character-search__input::placeholder {
  color: rgba(184, 148, 80, 0.44);
}

.grimhold-sidebar-character-search__input:focus {
  border-color: rgba(200, 169, 110, 0.76);
  box-shadow: 0 0 0 2px rgba(200, 169, 110, 0.12);
}

.grimhold-sidebar-character-search__button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  box-sizing: border-box;
  width: 100%;
  min-height: 38px;
  padding: 0 14px;
  color: #1a0f00;
  font: 900 11px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  background: linear-gradient(180deg, #d4a040 0%, #a07020 100%);
  border: 1px solid rgba(180, 120, 30, 0.80);
  border-radius: 5px;
  cursor: pointer;
  box-shadow:
    0 2px 6px rgba(0, 0, 0, 0.50),
    inset 0 1px 0 rgba(255, 220, 130, 0.28);
  transition: filter 140ms ease, transform 120ms ease;
}

.grimhold-sidebar-character-search__button:hover {
  filter: brightness(1.10);
  transform: translateY(-1px);
}

.grimhold-sidebar-character-search__button:active {
  transform: translateY(0);
  filter: brightness(0.94);
}

.grimhold-sidebar-character-search__button svg {
  width: 13px;
  height: 13px;
  flex-shrink: 0;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.8;
  stroke-linecap: round;
}

/* ── Sidebar: Get Coins panel ───────────────────────────── */
.grimhold-sidebar-get-coins__content {
  padding: 4px 0 2px;
  text-align: center;
}

.grimhold-sidebar-get-coins__image-wrap {
  display: flex;
  justify-content: center;
  margin-bottom: 12px;
  overflow: hidden;
}

.grimhold-sidebar-get-coins__image {
  display: block;
  max-width: 100%;
  max-height: 120px;
  width: auto;
  height: auto;
  object-fit: contain;
}

.grimhold-sidebar-get-coins__text {
  margin: 0 0 14px;
  color: #b9aa8f;
  font: 700 12px/1.5 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-align: center;
}

/* icon: override global fill:none so fill-based SVG renders correctly */
.grimhold-sidebar-get-coins .grimhold-top-players-panel__icon svg {
  fill: currentColor;
  stroke: none;
}


/* ═══════════════════════════════════════════════════════════════════
   Grimhold Inner — Left Sidebar (MenuColumn) Phase 1 Modernization
   CSS-only. All rules scoped to body.grimhold-inner #MenuColumn.
   Homepage untouched. No PHP / Twig / JS changes.
   ═══════════════════════════════════════════════════════════════════ */

/* ── 1. Hide all legacy GIF decorations ──────────────────────────── */
body.grimhold-inner #MenuColumn #MenuTop,
body.grimhold-inner #MenuColumn #MenuBottom,
body.grimhold-inner #MenuColumn #LoginTop,
body.grimhold-inner #MenuColumn #LoginBottom,
body.grimhold-inner #MenuColumn .LoginBorder,
body.grimhold-inner #MenuColumn .LeftChain,
body.grimhold-inner #MenuColumn .RightChain,
body.grimhold-inner #MenuColumn .Lights,
body.grimhold-inner #MenuColumn .Extend,
body.grimhold-inner #MenuColumn .SmallBoxTop,
body.grimhold-inner #MenuColumn .SmallBoxBottom,
body.grimhold-inner #MenuColumn .SmallBoxBorder {
  display: none !important;
}

/* Hide JS-managed hover GIF overlay — CSS :hover handles it instead */
body.grimhold-inner #MenuColumn .Button {
  display: none !important;
}

/* Hide the MediumButton hover overlay in the download box */
body.grimhold-inner #MenuColumn .MediumButtonOver {
  display: none !important;
}

/* ── 2. Login box ─────────────────────────────────────────────────── */
body.grimhold-inner #MenuColumn #Loginbox {
  position: relative;
  left: 0;
  top: 0;
  width: 100%;
  margin-bottom: 10px;
  padding: 10px 10px 8px;
  box-sizing: border-box;
  background: linear-gradient(180deg, rgba(28, 20, 12, 0.96), rgba(10, 8, 5, 0.98));
  border: 1px solid rgba(124, 88, 37, 0.68);
  box-shadow:
    inset 0 1px 0 rgba(247, 213, 143, 0.07),
    0 8px 18px rgba(0, 0, 0, 0.4);
}

/* Remove GIF backgrounds from all login box interior elements */
body.grimhold-inner #MenuColumn #LoginButtonContainer,
body.grimhold-inner #MenuColumn #LoginButton,
body.grimhold-inner #MenuColumn #LoginButton > div {
  background-image: none !important;
  background-color: transparent !important;
}

body.grimhold-inner #MenuColumn #LoginButtonContainer {
  position: relative;
  left: 0;
  width: 100%;
  height: auto;
}

body.grimhold-inner #MenuColumn #LoginButton {
  position: relative;
  left: 0;
  width: 100%;
  height: 34px;
  margin-bottom: 7px;
  background: linear-gradient(180deg, rgba(96, 54, 18, 0.94), rgba(52, 28, 8, 0.97)) !important;
  border: 1px solid rgba(175, 116, 46, 0.54);
  box-shadow: inset 0 1px 0 rgba(255, 220, 140, 0.09);
  cursor: pointer;
  transition: border-color 140ms ease, box-shadow 140ms ease;
}

body.grimhold-inner #MenuColumn #LoginButton:hover {
  border-color: rgba(218, 155, 65, 0.8);
  box-shadow: inset 0 1px 0 rgba(255, 220, 140, 0.16), 0 0 10px rgba(180, 100, 30, 0.22);
}

/* PNG text label (mediumbutton_login.png / mediumbutton_myaccount.png) */
body.grimhold-inner #MenuColumn #ButtonText {
  position: absolute;
  inset: 0;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: auto !important;
  background-color: transparent !important;
  cursor: pointer;
  z-index: 2;
}

/* Status text area ("Create Account" / "Logout" GIF) */
body.grimhold-inner #MenuColumn #Loginbox .Loginstatus {
  position: relative;
  left: 0;
  width: 100%;
  height: 16px;
  background-image: none !important;
  background-color: transparent !important;
  display: flex;
  align-items: center;
  justify-content: center;
}

body.grimhold-inner #MenuColumn #LoginstatusText_2 {
  position: relative;
  width: 100%;
  height: 14px;
  cursor: pointer;
}

body.grimhold-inner #MenuColumn .LoginstatusText {
  position: absolute;
  inset: 0;
  width: auto !important;
  height: 100% !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: auto !important;
  opacity: 0.78;
  transition: opacity 120ms ease;
}

body.grimhold-inner #MenuColumn #LoginstatusText_2:hover .LoginstatusText {
  opacity: 1;
}

/* ── 3. Download box ──────────────────────────────────────────────── */
body.grimhold-inner #MenuColumn .SmallMenuBox {
  position: relative;
  left: 0;
  top: 0;
  width: 100%;
  margin-bottom: 10px;
  padding: 10px 10px 8px;
  box-sizing: border-box;
  background: linear-gradient(180deg, rgba(28, 20, 12, 0.96), rgba(10, 8, 5, 0.98));
  border: 1px solid rgba(124, 88, 37, 0.68);
  box-shadow:
    inset 0 1px 0 rgba(247, 213, 143, 0.07),
    0 8px 18px rgba(0, 0, 0, 0.4);
}

body.grimhold-inner #MenuColumn .SmallBoxButtonContainer {
  position: relative;
  left: 0;
  width: 100%;
  height: auto;
  background-image: none !important;
  background-color: transparent !important;
}

body.grimhold-inner #MenuColumn #PlayNowContainer {
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  height: 34px;
}

body.grimhold-inner #MenuColumn .MediumButtonBackground {
  position: relative;
  width: 100%;
  height: 34px;
  background-image: none !important;
  background: linear-gradient(180deg, rgba(96, 54, 18, 0.94), rgba(52, 28, 8, 0.97)) !important;
  border: 1px solid rgba(175, 116, 46, 0.54);
  box-shadow: inset 0 1px 0 rgba(255, 220, 140, 0.09);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: border-color 140ms ease, box-shadow 140ms ease;
}

body.grimhold-inner #MenuColumn .MediumButtonBackground:hover {
  border-color: rgba(218, 155, 65, 0.8);
  box-shadow: inset 0 1px 0 rgba(255, 220, 140, 0.16), 0 0 10px rgba(180, 100, 30, 0.22);
}

/* PNG text label (mediumbutton_download.png) */
body.grimhold-inner #MenuColumn .MediumButtonText {
  display: block;
  position: relative;
  z-index: 2;
  pointer-events: none;
}

/* ── 4. Menu container ────────────────────────────────────────────── */
body.grimhold-inner #MenuColumn #Menu {
  position: relative;
  left: 0;
  background: none;
}

/* ── 5. MenuButton ────────────────────────────────────────────────── */
body.grimhold-inner #MenuColumn .MenuButton {
  background-image: none !important;
  background: linear-gradient(180deg, rgba(34, 22, 12, 0.97), rgba(14, 9, 4, 0.99)) !important;
  border: 1px solid rgba(118, 80, 32, 0.52);
  border-bottom-color: rgba(64, 42, 16, 0.4);
  box-shadow: inset 0 1px 0 rgba(255, 220, 140, 0.05), 0 2px 5px rgba(0, 0, 0, 0.3);
  margin-bottom: 2px;
  transition: border-color 140ms ease, box-shadow 140ms ease, background 140ms ease;
}

body.grimhold-inner #MenuColumn .MenuButton:hover {
  background: linear-gradient(180deg, rgba(56, 34, 14, 0.98), rgba(22, 13, 5, 0.99)) !important;
  border-color: rgba(198, 138, 54, 0.72) !important;
  border-bottom-color: rgba(140, 92, 34, 0.55) !important;
  box-shadow: inset 0 1px 0 rgba(255, 220, 140, 0.11), 0 0 12px rgba(180, 100, 30, 0.18) !important;
}

/* Keep category icons and labels (GIFs) visible but apply dark-fantasy filter */
body.grimhold-inner #MenuColumn .Icon {
  filter: sepia(0.35) saturate(1.25) brightness(0.92) drop-shadow(0 0 4px rgba(200, 108, 30, 0.38));
}

body.grimhold-inner #MenuColumn .Label {
  filter: sepia(0.38) saturate(1.28) brightness(1.05) drop-shadow(0 1px 1px rgba(0, 0, 0, 0.85));
}

/* ── 6. Submenu ───────────────────────────────────────────────────── */
body.grimhold-inner #MenuColumn .Submenu {
  background: linear-gradient(180deg, rgba(14, 10, 6, 0.99), rgba(7, 5, 2, 0.99)) !important;
  border: 1px solid rgba(118, 80, 32, 0.42) !important;
  border-top: none !important;
  box-shadow:
    inset 0 0 0 1px rgba(185, 117, 47, 0.08),
    0 8px 16px rgba(0, 0, 0, 0.36) !important;
  width: 100%;
  margin: 0;
  margin-right: 0 !important;
}

body.grimhold-inner #MenuColumn .Submenuitem {
  background-color: transparent !important;
  border-bottom: 1px solid rgba(88, 56, 20, 0.26) !important;
}

body.grimhold-inner #MenuColumn .Submenuitem:last-child {
  border-bottom: none !important;
}

body.grimhold-inner #MenuColumn .Submenuitem:hover {
  background: linear-gradient(90deg, rgba(88, 48, 14, 0.9), rgba(22, 13, 5, 0.9)) !important;
}

body.grimhold-inner #MenuColumn .SubmenuitemLabel {
  color: #cbb98a !important;
  border-bottom: none !important;
  padding: 8px 10px 8px 14px;
  font: 400 12px/1.3 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.82);
  transition: color 120ms ease;
}

body.grimhold-inner #MenuColumn .Submenu a:link,
body.grimhold-inner #MenuColumn .Submenu a:visited,
body.grimhold-inner #MenuColumn .Submenu a:focus {
  color: #cbb98a;
  text-decoration: none;
}

body.grimhold-inner #MenuColumn .Submenu a:hover,
body.grimhold-inner #MenuColumn .Submenu a:active {
  color: #f0d28f;
  text-decoration: none;
}

body.grimhold-inner #MenuColumn .Submenu a:hover .SubmenuitemLabel,
body.grimhold-inner #MenuColumn .Submenu a:active .SubmenuitemLabel {
  color: #f0d28f !important;
}

/* ActiveSubmenuItemIcon: hidden — active state detected via :has() in Phase 4 */
body.grimhold-inner #MenuColumn .ActiveSubmenuItemIcon {
  visibility: hidden !important;
}

/* ── Phase 2: Menu label text replacement (internal pages only) ─── */

/* Hide GIF label — text span takes its place */
body.grimhold-inner #MenuColumn .Label {
  display: none !important;
}

/* Modern text label replacing the GIF */
body.grimhold-inner #MenuColumn .grimhold-menu-label {
  position: absolute;
  top: 7px;
  left: 42px;
  display: block;
  width: 116px;
  color: #d4a55c;
  font: 700 12px/1.2 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.9);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  pointer-events: none;
}

body.grimhold-inner #MenuColumn .MenuButton:hover .grimhold-menu-label {
  color: #f0cc78;
}

/* ── Phase 3: Login box + Download box — modern UI ───────────────── */

/* Login box — main button (Login / My Account) */
body.grimhold-inner #MenuColumn .grimhold-loginbox__main,
body.grimhold-inner #MenuColumn .grimhold-loginbox__main:link,
body.grimhold-inner #MenuColumn .grimhold-loginbox__main:visited {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  width: 100%;
  padding: 10px 12px;
  box-sizing: border-box;
  margin-bottom: 7px;
  background: linear-gradient(180deg,
    rgba(112, 62, 18, 0.97) 0%,
    rgba(76, 42, 10, 0.99) 55%,
    rgba(44, 24, 6, 1) 100%);
  border: 1px solid rgba(185, 128, 52, 0.68);
  border-top-color: rgba(215, 162, 72, 0.84);
  border-bottom-color: rgba(118, 68, 18, 0.55);
  box-shadow:
    inset 0 1px 0 rgba(255, 232, 140, 0.15),
    inset 0 -2px 5px rgba(0, 0, 0, 0.45),
    inset 0 0 14px rgba(160, 88, 22, 0.11),
    0 2px 6px rgba(0, 0, 0, 0.55),
    0 0 0 1px rgba(60, 32, 6, 0.7);
  color: #e2bf74;
  font: 700 13px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-decoration: none;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.92), 0 0 8px rgba(170, 90, 14, 0.28);
  transition: border-color 150ms ease, box-shadow 150ms ease, color 150ms ease, background 150ms ease;
}

body.grimhold-inner #MenuColumn .grimhold-loginbox__main:hover,
body.grimhold-inner #MenuColumn .grimhold-loginbox__main:active {
  background: linear-gradient(180deg,
    rgba(132, 74, 20, 0.99) 0%,
    rgba(90, 52, 13, 1) 55%,
    rgba(54, 30, 8, 1) 100%);
  border-color: rgba(228, 168, 74, 0.88);
  border-top-color: rgba(248, 200, 102, 0.96);
  box-shadow:
    inset 0 1px 0 rgba(255, 244, 168, 0.22),
    inset 0 -2px 5px rgba(0, 0, 0, 0.38),
    inset 0 0 18px rgba(182, 102, 26, 0.2),
    0 2px 8px rgba(0, 0, 0, 0.52),
    0 0 14px rgba(180, 100, 28, 0.26),
    0 0 0 1px rgba(60, 32, 6, 0.7);
  color: #f8e098;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9), 0 0 12px rgba(220, 140, 28, 0.44);
  text-decoration: none;
}

body.grimhold-inner #MenuColumn .grimhold-loginbox__main svg {
  flex-shrink: 0;
  opacity: 0.82;
  transition: opacity 150ms ease;
}

body.grimhold-inner #MenuColumn .grimhold-loginbox__main:hover svg {
  opacity: 1;
}

/* Login box — secondary link (Create Account / Logout) */
body.grimhold-inner #MenuColumn .grimhold-loginbox__secondary,
body.grimhold-inner #MenuColumn .grimhold-loginbox__secondary:link,
body.grimhold-inner #MenuColumn .grimhold-loginbox__secondary:visited {
  display: block;
  text-align: center;
  color: #8a7654;
  font: 400 11px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.03em;
  text-decoration: none;
  padding: 3px 0 2px;
  transition: color 120ms ease;
}

body.grimhold-inner #MenuColumn .grimhold-loginbox__secondary:hover,
body.grimhold-inner #MenuColumn .grimhold-loginbox__secondary:active {
  color: #c8a96e;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* Download box — main button */
body.grimhold-inner #MenuColumn .grimhold-downloadbox__btn,
body.grimhold-inner #MenuColumn .grimhold-downloadbox__btn:link,
body.grimhold-inner #MenuColumn .grimhold-downloadbox__btn:visited {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  width: 100%;
  padding: 10px 12px;
  box-sizing: border-box;
  background: linear-gradient(180deg,
    rgba(112, 62, 18, 0.97) 0%,
    rgba(76, 42, 10, 0.99) 55%,
    rgba(44, 24, 6, 1) 100%);
  border: 1px solid rgba(185, 128, 52, 0.68);
  border-top-color: rgba(215, 162, 72, 0.84);
  border-bottom-color: rgba(118, 68, 18, 0.55);
  box-shadow:
    inset 0 1px 0 rgba(255, 232, 140, 0.15),
    inset 0 -2px 5px rgba(0, 0, 0, 0.45),
    inset 0 0 14px rgba(160, 88, 22, 0.11),
    0 2px 6px rgba(0, 0, 0, 0.55),
    0 0 0 1px rgba(60, 32, 6, 0.7);
  color: #e2bf74;
  font: 700 13px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-decoration: none;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.92), 0 0 8px rgba(170, 90, 14, 0.28);
  transition: border-color 150ms ease, box-shadow 150ms ease, color 150ms ease, background 150ms ease;
}

body.grimhold-inner #MenuColumn .grimhold-downloadbox__btn:hover,
body.grimhold-inner #MenuColumn .grimhold-downloadbox__btn:active {
  background: linear-gradient(180deg,
    rgba(132, 74, 20, 0.99) 0%,
    rgba(90, 52, 13, 1) 55%,
    rgba(54, 30, 8, 1) 100%);
  border-color: rgba(228, 168, 74, 0.88);
  border-top-color: rgba(248, 200, 102, 0.96);
  box-shadow:
    inset 0 1px 0 rgba(255, 244, 168, 0.22),
    inset 0 -2px 5px rgba(0, 0, 0, 0.38),
    inset 0 0 18px rgba(182, 102, 26, 0.2),
    0 2px 8px rgba(0, 0, 0, 0.52),
    0 0 14px rgba(180, 100, 28, 0.26),
    0 0 0 1px rgba(60, 32, 6, 0.7);
  color: #f8e098;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9), 0 0 12px rgba(220, 140, 28, 0.44);
  text-decoration: none;
}

body.grimhold-inner #MenuColumn .grimhold-downloadbox__btn svg {
  flex-shrink: 0;
  opacity: 0.82;
  transition: opacity 150ms ease;
}

body.grimhold-inner #MenuColumn .grimhold-downloadbox__btn:hover svg {
  opacity: 1;
}

/* ═══════════════════════════════════════════════════════════════════
   Grimhold Inner — Left Sidebar Phase 4: Groups + Submenu Polish
   Scoped to body.grimhold-inner #MenuColumn. CSS-only.
   ═══════════════════════════════════════════════════════════════════ */

/* ── 1. MenuButton — taller, left accent bar ──────────────────────── */
body.grimhold-inner #MenuColumn .MenuButton {
  height: 36px;
  border-left: 2px solid rgba(140, 82, 28, 0.52);
}

body.grimhold-inner #MenuColumn .MenuButton:hover {
  border-left-color: rgba(210, 150, 60, 0.9) !important;
}

/* ── 2. Icon — recentered for 36px button height ──────────────────── */
body.grimhold-inner #MenuColumn .Icon {
  top: 2px;
}

/* ── 3. Label — recentered + slightly wider gap from icon ─────────── */
body.grimhold-inner #MenuColumn .grimhold-menu-label {
  top: 12px;
  left: 46px;
  width: 112px;
}

/* ── 4. Category spacing — separate groups visually ───────────────── */
body.grimhold-inner #MenuColumn .menuitem {
  margin-bottom: 3px;
}

/* ── 5. Open category header — reinforce gold accent ─────────────── */
body.grimhold-inner #MenuColumn .menuitem:has(.Submenu[style*="display: block"]) .MenuButton,
body.grimhold-inner #MenuColumn .menuitem:has(.Submenu[style*="display:block"]) .MenuButton {
  border-left-color: rgba(200, 140, 50, 0.88);
  background: linear-gradient(180deg, rgba(48, 28, 10, 0.98), rgba(16, 10, 4, 0.99)) !important;
}

/* ── 6. Submenu panel — top/bottom breathing room ─────────────────── */
body.grimhold-inner #MenuColumn .Submenu {
  padding: 4px 0 5px;
}

/* ── 7. Submenuitem — left accent bar via ::before ────────────────── */
body.grimhold-inner #MenuColumn .Submenuitem::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 2px;
  background: transparent;
  transition: background 140ms ease;
  pointer-events: none;
}

body.grimhold-inner #MenuColumn .Submenuitem:hover::before {
  background: rgba(200, 169, 110, 0.6);
}

/* ── 8. SubmenuitemLabel — more padding, aligns after accent bar ───── */
body.grimhold-inner #MenuColumn .SubmenuitemLabel {
  padding: 9px 12px 9px 18px;
}

/* ── 9. Active submenu item — gold bar + bright text ─────────────── */
body.grimhold-inner #MenuColumn .Submenuitem:has(.ActiveSubmenuItemIcon[style*="visible"]) {
  background: linear-gradient(90deg, rgba(72, 40, 12, 0.96), rgba(18, 11, 4, 0.96)) !important;
}

body.grimhold-inner #MenuColumn .Submenuitem:has(.ActiveSubmenuItemIcon[style*="visible"])::before {
  background: rgba(200, 169, 110, 0.88) !important;
}

body.grimhold-inner #MenuColumn .Submenuitem:has(.ActiveSubmenuItemIcon[style*="visible"]) .SubmenuitemLabel {
  color: #f0e2b0 !important;
  font-weight: 600;
  letter-spacing: 0.02em;
}

/* ══════════════════════════════════════════════════════════════════════
   News Archive Page — grimhold-news-archive
   Scope: body.grimhold-inner only. Homepage (.grimhold-homepage) untouched.
   ══════════════════════════════════════════════════════════════════════ */

body.grimhold-inner .grimhold-news-archive {
  padding: 4px 0 16px;
}

/* ── Subtitle ────────────────────────────────────────────────────── */
body.grimhold-inner .grimhold-news-archive__subtitle {
  margin: 0 0 18px;
  color: #9a8a70;
  font: 400 12px/1.5 "Trebuchet MS", sans-serif;
  font-style: italic;
  letter-spacing: 0.02em;
}

/* ── Empty state ─────────────────────────────────────────────────── */
body.grimhold-inner .grimhold-news-archive__empty {
  color: rgba(200, 169, 110, 0.48);
  font-style: italic;
  font-size: 14px;
  text-align: center;
  padding: 36px 0;
}

/* ── List ────────────────────────────────────────────────────────── */
body.grimhold-inner .grimhold-news-archive__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* ── Card item ───────────────────────────────────────────────────── */
body.grimhold-inner .grimhold-news-archive__item {
  background: #01070a;
  border: 1px solid rgba(200, 169, 110, 0.26);
  border-left: 3px solid rgba(200, 169, 110, 0.44);
  border-radius: 3px;
  padding: 14px 18px 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  transition:
    border-color 160ms ease,
    border-left-color 160ms ease,
    background 160ms ease,
    box-shadow 160ms ease;
}

body.grimhold-inner .grimhold-news-archive__item:hover {
  background: #071013;
  border-color: rgba(200, 169, 110, 0.34);
  border-left-color: rgba(200, 169, 110, 0.62);
  box-shadow:
    0 2px 10px rgba(0, 0, 0, 0.40),
    inset 0 0 16px rgba(200, 169, 110, 0.02);
}

/* ── Date ────────────────────────────────────────────────────────── */
body.grimhold-inner .grimhold-news-archive__date {
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #9a8660;
  line-height: 1;
}

/* ── Title ───────────────────────────────────────────────────────── */
body.grimhold-inner .grimhold-news-archive__title {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
}

body.grimhold-inner .grimhold-news-archive__title a,
body.grimhold-inner .grimhold-news-archive__title a:link,
body.grimhold-inner .grimhold-news-archive__title a:visited {
  color: #e8d49a;
  text-decoration: none;
  transition: color 140ms ease, text-shadow 140ms ease;
}

body.grimhold-inner .grimhold-news-archive__title a:hover {
  color: #f4e8c0;
  text-shadow: 0 0 14px rgba(200, 169, 110, 0.28);
}

/* ── Read More button ────────────────────────────────────────────── */
body.grimhold-inner .grimhold-news-archive__button,
body.grimhold-inner .grimhold-news-archive__button:link,
body.grimhold-inner .grimhold-news-archive__button:visited {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 6px;
  padding: 7px 18px;
  background: #01070a;
  border: 1px solid rgba(200, 169, 110, 0.28);
  border-radius: 2px;
  color: #c8a96e;
  font: 700 11px/1.3 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background 140ms ease, border-color 140ms ease, color 140ms ease;
}
body.grimhold-inner .grimhold-news-archive__button::after {
  content: "→";
  font-size: 12px;
  line-height: 1;
  transition: transform 140ms ease;
}
body.grimhold-inner .grimhold-news-archive__button:hover {
  background: #0b1114;
  border-color: rgba(200, 169, 110, 0.68);
  color: #f0d88a;
  text-decoration: none;
}
body.grimhold-inner .grimhold-news-archive__button:hover::after {
  transform: translateX(3px);
}

/* ══════════════════════════════════════════════════════════════════════
   News Article (individual) — grimhold-news-article
   Scope: body.grimhold-inner only. Homepage (.grimhold-homepage) untouched.
   ══════════════════════════════════════════════════════════════════════ */

/* ── Wrapper ─────────────────────────────────────────────────────── */
body.grimhold-inner .grimhold-news-article {
  display: flex;
  flex-direction: column;
  gap: 0;
}

/* ── Header ──────────────────────────────────────────────────────── */
body.grimhold-inner .grimhold-news-article__header {
  background: linear-gradient(180deg,
    rgba(30, 18, 6, 0.98) 0%,
    rgba(18, 11, 4, 0.99) 100%
  );
  border-bottom: 1px solid rgba(200, 140, 50, 0.30);
  padding: 16px 20px 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

body.grimhold-inner .grimhold-news-article__date {
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(200, 140, 50, 0.68);
  line-height: 1;
}

body.grimhold-inner .grimhold-news-article__title {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.25;
  color: #e8d49a;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.7);
  letter-spacing: 0.01em;
}

body.grimhold-inner .grimhold-news-article__author {
  margin: 0;
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  font-size: 11px;
  color: rgba(180, 140, 80, 0.65);
  letter-spacing: 0.04em;
}

body.grimhold-inner .grimhold-news-article__author span {
  color: rgba(200, 160, 90, 0.85);
  font-style: italic;
}

/* ── Body — news content ─────────────────────────────────────────── */
body.grimhold-inner .grimhold-news-article__body {
  background: rgba(12, 8, 3, 0.60);
  padding: 18px 20px;
  color: #c8b99a;
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  font-size: 13px;
  line-height: 1.65;
}

body.grimhold-inner .grimhold-news-article__body p {
  margin: 0 0 10px;
}

body.grimhold-inner .grimhold-news-article__body a {
  color: #c8a96e;
  text-decoration: underline;
  text-underline-offset: 2px;
}

body.grimhold-inner .grimhold-news-article__body a:hover {
  color: #f0d88a;
}

/* Drop-cap letter GIF from MyAAC — float left, no extra gap needed */
body.grimhold-inner .grimhold-news-article__body > img:first-child {
  float: left;
  margin: 0 4px 0 0;
  vertical-align: bottom;
}

/* ── Comments link ───────────────────────────────────────────────── */
body.grimhold-inner .grimhold-news-article__comments {
  padding: 8px 20px 12px;
  background: rgba(12, 8, 3, 0.60);
  border-top: 1px solid rgba(200, 140, 50, 0.14);
  text-align: right;
}

body.grimhold-inner .grimhold-news-article__comments-link,
body.grimhold-inner .grimhold-news-article__comments-link:link,
body.grimhold-inner .grimhold-news-article__comments-link:visited {
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  font-size: 11px;
  color: rgba(180, 140, 70, 0.70);
  text-decoration: none;
  letter-spacing: 0.04em;
  transition: color 140ms ease;
}

body.grimhold-inner .grimhold-news-article__comments-link:hover {
  color: #c8a96e;
}

/* ── Back button ─────────────────────────────────────────────────── */
body.grimhold-inner .grimhold-news-article__back {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 14px 20px 4px;
}

body.grimhold-inner .grimhold-news-article__back-btn,
body.grimhold-inner .grimhold-news-article__back-btn:link,
body.grimhold-inner .grimhold-news-article__back-btn:visited {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 16px;
  background: rgba(50, 30, 8, 0.70);
  border: 1px solid rgba(175, 118, 38, 0.40);
  border-radius: 2px;
  color: #c8a96e;
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background 140ms ease, border-color 140ms ease, color 140ms ease;
}

body.grimhold-inner .grimhold-news-article__back-btn:hover {
  background: rgba(80, 48, 14, 0.85);
  border-color: rgba(210, 158, 58, 0.65);
  color: #f0d88a;
}

/* ─── Grimhold Homepage Feature Cards — CMS cursor + lightbox modal ─────── */
.grimhold-homepage .grimhold-explore-card--cms {
  cursor: pointer;
}
.grimhold-homepage .grimhold-explore-card--cms:focus-visible {
  outline: 2px solid #c8a96e;
  outline-offset: 2px;
}

.grimhold-homepage .grimhold-feature-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9100;
  align-items: center;
  justify-content: center;
  padding: 24px;
  box-sizing: border-box;
}
.grimhold-homepage .grimhold-feature-modal.is-active {
  display: flex;
}
.grimhold-homepage .grimhold-feature-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.88);
  cursor: pointer;
}
.grimhold-homepage .grimhold-feature-modal__box {
  position: relative;
  z-index: 1;
  width: min(1000px, calc(100vw - 48px));
  max-height: calc(100vh - 48px);
  overflow: hidden;
  background: #161009;
  border: 1px solid rgba(200, 169, 110, 0.35);
  border-radius: 6px;
  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.85);
  display: flex;
  flex-direction: column;
}
.grimhold-homepage .grimhold-feature-modal__close {
  position: absolute;
  top: 10px;
  right: 12px;
  z-index: 5;
  background: rgba(0, 0, 0, 0.65);
  border: 1px solid rgba(200, 169, 110, 0.4);
  border-radius: 3px;
  color: #c8a96e;
  font-size: 16px;
  line-height: 1;
  width: 30px;
  height: 30px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s, color 0.15s;
}
.grimhold-homepage .grimhold-feature-modal__close:hover {
  background: rgba(139, 26, 26, 0.80);
  color: #fff;
}
.grimhold-homepage .grimhold-feature-modal__img {
  width: 100%;
  height: auto;
  max-height: calc(100vh - 220px);
  object-fit: contain;
  background: #0a0806;
  display: block;
  flex: 0 1 auto;
}
.grimhold-homepage .grimhold-feature-modal__title {
  display: block;
  padding: 14px 18px 4px;
  font: 700 18px / 1.3 Georgia, "Times New Roman", serif;
  color: #e8d4a0;
  letter-spacing: 0.03em;
  flex: 0 0 auto;
}
.grimhold-homepage .grimhold-feature-modal__desc {
  margin: 0;
  padding: 0 18px 18px;
  font: 400 13.5px / 1.55 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  color: #b0a080;
  flex: 0 0 auto;
}

/* ─── Account Management Phase 1 — Welcome / Download / Premium ────────── */
body.grimhold-inner .grimhold-account-welcome {
  padding: 22px 12px 14px;
  text-align: center;
  border-bottom: 1px solid rgba(200, 169, 110, 0.18);
  margin-bottom: 2px;
}
body.grimhold-inner .grimhold-account-welcome__title {
  margin: 0 0 4px;
  font: 700 22px / 1.2 Georgia, "Times New Roman", serif;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #c8a96e;
  text-shadow: 0 0 18px rgba(200, 169, 110, 0.35);
}
body.grimhold-inner .grimhold-account-welcome__sub {
  margin: 0;
  font: 400 12px / 1.4 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(200, 169, 110, 0.55);
}

body.grimhold-inner .grimhold-download-eyebrow {
  margin: 0 0 4px;
  font: 400 11px / 1.3 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(200, 169, 110, 0.55);
}
body.grimhold-inner .grimhold-download-tagline {
  margin: 0 0 14px;
  font: 400 13px / 1.5 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  color: #a09070;
}

body.grimhold-inner .grimhold-account-download-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 9px 22px;
  font: 700 13px / 1 Georgia, "Times New Roman", serif;
  letter-spacing: 0.08em;
  text-decoration: none;
  white-space: nowrap;
}

/* ── Login page — New Player block ── */
body.grimhold-inner .grimhold-login-new {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 20px 18px;
}
body.grimhold-inner .grimhold-login-new__body {
  flex: 1 1 0;
  min-width: 0;
}
body.grimhold-inner .grimhold-login-new__title {
  margin: 0 0 10px;
  font: 700 17px / 1.2 Georgia, "Times New Roman", serif;
  color: #c8a96e;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-shadow: 0 0 14px rgba(200, 169, 110, 0.28);
}
body.grimhold-inner .grimhold-login-new__text {
  margin: 0 0 8px;
  font: 400 13px / 1.55 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  color: #b8a68a;
}
body.grimhold-inner .grimhold-login-new__text:last-of-type {
  margin-bottom: 0;
}
body.grimhold-inner .grimhold-login-new__text--closing {
  font-style: italic;
  color: rgba(200, 169, 110, 0.68);
}
body.grimhold-inner .grimhold-login-new__cta-wrap {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
}
body.grimhold-inner .grimhold-login-new__cta.grimhold-cta {
  min-width: 150px;
  padding: 12px 22px;
  font: 700 13px / 1 Georgia, "Times New Roman", serif !important;
  letter-spacing: 0.1em;
  white-space: nowrap;
  text-align: center;
}
@media (max-width: 600px) {
  body.grimhold-inner .grimhold-login-new {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  body.grimhold-inner .grimhold-login-new__cta-wrap {
    align-self: stretch;
  }
  body.grimhold-inner .grimhold-login-new__cta.grimhold-cta {
    width: 100%;
    justify-content: center;
  }
}

/* ── Create Character — Name input ── */
body.grimhold-inner #character_name {
  width: 360px;
  max-width: 100%;
  height: 40px;
  padding: 0 14px;
  font: 400 14px / 1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  color: #e8d5a8;
  background-color: #130e09;
  border: 1px solid rgba(200, 169, 110, 0.42);
  box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.5);
  box-sizing: border-box;
  transition: border-color 0.2s, box-shadow 0.2s;
  vertical-align: middle;
}
body.grimhold-inner #character_name:focus {
  outline: none;
  border-color: #c8a96e;
  box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.4), 0 0 0 3px rgba(200, 169, 110, 0.14);
}

/* ── Create Character — choice rows (vocation + gender) ── */
body.grimhold-inner .grimhold-choice-cell {
  padding: 4px 0;
  vertical-align: middle;
}
body.grimhold-inner .grimhold-choice-row {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 6px 10px;
  margin: 0 0 3px;
  cursor: pointer;
  border: 1px solid transparent;
  border-radius: 3px;
  transition: background 0.15s, border-color 0.15s;
  user-select: none;
}
body.grimhold-inner .grimhold-choice-row:hover {
  background: rgba(200, 169, 110, 0.07);
  border-color: rgba(200, 169, 110, 0.22);
}
body.grimhold-inner .grimhold-choice-row:has(input:checked) {
  background: rgba(200, 169, 110, 0.1);
  border-color: rgba(200, 169, 110, 0.45);
}
body.grimhold-inner .grimhold-choice-row input[type="radio"] {
  accent-color: #5fe08c;
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  cursor: pointer;
  margin: 0;
}
body.grimhold-inner .grimhold-voc-sprite {
  display: block;
  width: 32px;
  height: 32px;
  object-fit: contain;
  image-rendering: pixelated;
  image-rendering: crisp-edges;
  flex-shrink: 0;
}
body.grimhold-inner .grimhold-choice-label {
  font: 400 13px / 1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  color: var(--grimhold-text);
  line-height: 1.4;
}
body.grimhold-inner .grimhold-gender-icon {
  flex-shrink: 0;
  display: block;
}
body.grimhold-inner .grimhold-gender-icon--male {
  color: #6db0e8;
}
body.grimhold-inner .grimhold-gender-icon--female {
  color: #e88fa8;
}
@media (max-width: 600px) {
  body.grimhold-inner .grimhold-choice-row {
    padding: 8px 8px;
    gap: 8px;
  }
}

/* ── Create Account — enlarged input fields ── */
body.grimhold-inner .grimhold-create-input {
  width: 360px;
  max-width: 100%;
  height: 40px;
  padding: 0 14px;
  font: 400 14px / 1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  color: #e8d5a8;
  background-color: #130e09;
  border: 1px solid rgba(200, 169, 110, 0.42);
  box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.5);
  box-sizing: border-box;
  transition: border-color 0.2s, box-shadow 0.2s;
  vertical-align: middle;
}
body.grimhold-inner .grimhold-create-input:focus {
  outline: none;
  border-color: #c8a96e;
  box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.4), 0 0 0 3px rgba(200, 169, 110, 0.14);
}
body.grimhold-inner .grimhold-create-input::placeholder {
  color: rgba(200, 169, 110, 0.38);
  font-style: italic;
}
body.grimhold-inner select.grimhold-create-input {
  height: 40px;
  padding: 0 10px;
  cursor: pointer;
  appearance: auto;
}
/* Rules checkbox — consistent accent color */
body.grimhold-inner #accept_rules {
  accent-color: #5fe08c;
  width: 14px;
  height: 14px;
  vertical-align: middle;
  cursor: pointer;
  margin-right: 4px;
}
/* Country flag */
body.grimhold-inner #account_country_img {
  width: 22px;
  height: auto;
  margin-left: 8px;
  vertical-align: middle;
}

/* ── Rules page ── */
body.grimhold-inner .grimhold-rules {
  max-width: 720px;
  margin: 0 auto;
  padding: 4px 0 16px;
}
body.grimhold-inner .grimhold-rules__intro {
  font: 400 14px/1.7 "Trebuchet MS", sans-serif;
  color: #c4a97a;
  margin: 0 0 24px;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(200,169,110,0.2);
}
body.grimhold-inner .grimhold-rules__section {
  margin: 0 0 20px;
}
body.grimhold-inner .grimhold-rules__section-title {
  font: 700 13px/1.2 Georgia, serif;
  color: #c8a96e;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin: 0 0 10px;
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(200,169,110,0.18);
}
body.grimhold-inner .grimhold-rules__list {
  margin: 0;
  padding: 0 0 0 18px;
  list-style: none;
}
body.grimhold-inner .grimhold-rules__list li {
  position: relative;
  padding: 3px 0 3px 14px;
  font: 400 13px/1.6 "Trebuchet MS", sans-serif;
  color: #b8a68a;
}
body.grimhold-inner .grimhold-rules__list li::before {
  content: "•";
  position: absolute;
  left: 0;
  color: rgba(200,169,110,0.55);
}
body.grimhold-inner .grimhold-rules__divider {
  height: 1px;
  background: rgba(200,169,110,0.12);
  margin: 4px 0 24px;
}
body.grimhold-inner .grimhold-rules__callout {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 12px 16px;
  margin: 16px 0;
  border-radius: 3px;
  border-left: 3px solid;
  font: 400 13px/1.6 "Trebuchet MS", sans-serif;
}
body.grimhold-inner .grimhold-rules__callout strong {
  display: block;
  margin-bottom: 2px;
  font: 700 13px/1 Georgia, serif;
  letter-spacing: 0.04em;
}
body.grimhold-inner .grimhold-rules__callout--info {
  background: rgba(61,120,180,0.1);
  border-color: rgba(100,160,220,0.55);
  color: #9ec8ec;
}
body.grimhold-inner .grimhold-rules__callout--info strong {
  color: #7eb8e8;
}
body.grimhold-inner .grimhold-rules__callout--warning {
  background: rgba(139,26,26,0.18);
  border-color: rgba(200,60,60,0.5);
  color: #d4907a;
}
body.grimhold-inner .grimhold-rules__callout--warning strong {
  color: #e07060;
}
@media (max-width: 600px) {
  body.grimhold-inner .grimhold-rules {
    padding: 4px 0 8px;
  }
  body.grimhold-inner .grimhold-rules__list {
    padding-left: 8px;
  }
}

/* ── Character view — status badges ── */
body.grimhold-inner .grimhold-char-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 3px;
  font: 700 11px/1.4 "Trebuchet MS", sans-serif;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  vertical-align: middle;
}
body.grimhold-inner .grimhold-char-badge--online {
  background: rgba(60,160,80,0.15);
  border: 1px solid rgba(70,200,90,0.38);
  color: #5de08a;
}
body.grimhold-inner .grimhold-char-badge--offline {
  background: rgba(100,20,20,0.28);
  border: 1px solid rgba(255,90,90,0.45);
  color: #ff6b6b;
}
body.grimhold-inner .grimhold-char-badge--premium {
  background: rgba(30,90,50,0.22);
  border: 1px solid rgba(95,224,140,0.45);
  color: #5fe08c;
}
/* Character Information table — row spacing and contrast */
body.grimhold-inner table.grimhold-char-info-table td {
  padding: 6px 10px;
  font-size: 13px;
}
body.grimhold-inner table.grimhold-char-info-table td.LabelV175 {
  padding: 6px 10px 6px 8px;
  color: #9a8870;
  font-weight: 600;
  white-space: nowrap;
}

/* ── Character Details — section polish ── */

/* Outfit */
body.grimhold-inner .grimhold-outfit-label {
  font: 600 10px/1 "Trebuchet MS", sans-serif;
  color: #7a6a50;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 8px;
}
body.grimhold-inner .grimhold-outfit-viewport {
  width: 64px;
  height: 64px;
  margin: 0 auto;
  overflow: hidden;
  position: relative;
}

/* Inventory slots */
body.grimhold-inner .grimhold-inv-grid table {
  background: #0b1114 !important;
}
body.grimhold-inner .grimhold-inv-grid > tbody > tr > td {
  padding: 2px 4px !important;
}
body.grimhold-inner .grimhold-inv-grid table td {
  border-color: #1c2e3a !important;
  background: #0e1518;
  padding: 2px !important;
}
body.grimhold-inner .grimhold-inv-grid table td[style*="color: #fff"] {
  background: #0b1114;
  color: #607080 !important;
  padding: 3px 0 4px !important;
}

/* Progress bars — shared reset */
body.grimhold-inner .grimhold-char-details .progress {
  height: 10px;
  background: #080c0e;
  border: 1px solid #1c2a32;
  border-radius: 2px;
  overflow: hidden;
  margin-top: 5px;
  box-shadow: inset 0 1px 3px rgba(0,0,0,0.6);
}
body.grimhold-inner .grimhold-char-details .progress-bar {
  height: 100%;
  border-radius: 0;
  transition: width 0.3s ease;
}
/* Health */
body.grimhold-inner .grimhold-char-details .bg-danger {
  background: linear-gradient(to right, #961c1c, #c42828) !important;
}
/* Mana */
body.grimhold-inner .grimhold-char-details .bg-default {
  background: linear-gradient(to right, #1e3260, #2e52a0) !important;
}
/* Experience */
body.grimhold-inner .grimhold-char-details .bg-success {
  background: linear-gradient(to right, #1e6030, #2e9a48) !important;
}

/* Bar labels (Health / Mana / Experience / Percent) */
body.grimhold-inner .grimhold-char-details td[style*="text-align: right"] b {
  color: #c8a96e;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
/* Bar values (5905/5905, 100%, etc.) */
body.grimhold-inner .grimhold-char-details td[style*="text-align: center"] {
  font-size: 12px;
  color: #e8d8b0;
}

/* Skills table — cell spacing; values (plain text) */
body.grimhold-inner .grimhold-char-details .TableContent tr[style*="text-align: center"] td {
  padding: 5px 4px;
  font-size: 12px;
  color: #f0dfb8;
}
/* Skill labels (Level / ML / Fist / etc.) */
body.grimhold-inner .grimhold-char-details .TableContent tr[style*="text-align: center"] b {
  color: #d6bd82;
}
body.grimhold-inner .grimhold-char-details .TableContent tr[style*="text-align: center"] td img {
  display: block;
  margin: 0 auto;
  image-rendering: pixelated;
}

/* ── Grimhold Accordion ── */
body.grimhold-inner .grimhold-accordion__header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px;
  background: #0b1114;
  border: 1px solid rgba(200,169,110,0.30);
  color: #c8a96e;
  font: 700 11px/1.3 "Trebuchet MS", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.09em;
  cursor: pointer;
  user-select: none;
  transition: background 0.15s, border-color 0.15s;
}
body.grimhold-inner .grimhold-accordion__header:hover {
  background: #10181c;
  border-color: rgba(200,169,110,0.52);
}
body.grimhold-inner .grimhold-accordion__header.is-open {
  border-bottom: 1px solid rgba(200,169,110,0.16);
}
body.grimhold-inner .grimhold-accordion__arrow {
  font-size: 17px;
  line-height: 1;
  flex-shrink: 0;
  color: #c8a96e;
}
/* Deaths header row — dark Grimhold palette, scoped to accordion only */
body.grimhold-inner .grimhold-accordion .TableContent tr.LabelH > td,
body.grimhold-inner .grimhold-accordion .TableContent tr.LabelH > th {
  background: rgba(200,160,80,0.04) !important;
  border-bottom: 1px solid rgba(200,160,80,0.18) !important;
}
body.grimhold-inner .grimhold-accordion__empty {
  padding: 14px 16px;
  color: #7a6a50;
  font: 400 12px/1.5 "Trebuchet MS", sans-serif;
  font-style: italic;
}
/* Account Characters — row hover */
body.grimhold-inner .grimhold-account-chars tr:hover > td {
  background: rgba(200,169,110,0.06) !important;
  transition: background 0.12s;
}
/* Search Character form */
body.grimhold-inner .grimhold-search-form {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 14px 16px;
  background: #0e1518;
  border: 1px solid rgba(200,169,110,0.22);
}
body.grimhold-inner .grimhold-search-form input[type="text"] {
  flex: 1;
  min-width: 220px;
  padding: 7px 12px;
  background: #080c0e;
  border: 1px solid rgba(200,169,110,0.28);
  color: #e8d8b0;
  font: 400 13px/1.4 "Trebuchet MS", sans-serif;
  outline: none;
  transition: border-color 0.15s;
}
body.grimhold-inner .grimhold-search-form input[type="text"]::placeholder {
  color: #5a4e38;
}
body.grimhold-inner .grimhold-search-form input[type="text"]:focus {
  border-color: rgba(200,169,110,0.55);
}
body.grimhold-inner .grimhold-search-form button[type="submit"] {
  padding: 7px 18px;
  background: linear-gradient(to bottom, #2a1a08, #1a0e04);
  border: 1px solid rgba(200,169,110,0.45);
  color: #c8a96e;
  font: 700 12px/1.3 "Trebuchet MS", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
  white-space: nowrap;
}
body.grimhold-inner .grimhold-search-form button[type="submit"]:hover {
  background: linear-gradient(to bottom, #3a2510, #251508);
  border-color: rgba(200,169,110,0.72);
}

/* ===== Downloads Page ===== */
body.grimhold-inner .grimhold-downloads-hero {
  background: #0e1518;
  border: 1px solid rgba(200,169,110,0.28);
  padding: 24px 24px 22px;   /* reduced from 36/28 */
  text-align: center;
  margin-bottom: 0;
}
body.grimhold-inner .grimhold-downloads-hero__icon {
  margin-bottom: 10px;
}
body.grimhold-inner .grimhold-downloads-hero__icon svg {
  width: 44px;
  height: 44px;
  color: #c8a96e;
  stroke: #c8a96e;
  opacity: 0.85;
}
body.grimhold-inner .grimhold-downloads-hero__name {
  font: 700 17px/1.2 "Trebuchet MS", sans-serif;
  color: #c8a96e;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  margin-bottom: 16px;
}
body.grimhold-inner .grimhold-downloads-hero__meta {
  margin: 0 auto 20px;
  border-collapse: collapse;
}
body.grimhold-inner .grimhold-downloads-hero__meta-label {
  color: #7a6a50;
  font: 400 11px/1.65 "Trebuchet MS", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  text-align: right;
  padding-right: 10px;
  white-space: nowrap;
}
body.grimhold-inner .grimhold-downloads-hero__meta-sep {
  color: rgba(200,169,110,0.22);
  padding: 0 8px;
  font-size: 12px;
}
body.grimhold-inner .grimhold-downloads-hero__meta-value {
  color: #e8d8b0;
  font: 600 12px/1.65 "Trebuchet MS", sans-serif;
  text-align: left;
  white-space: nowrap;
}
body.grimhold-inner .grimhold-downloads-hero__actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
/* Main download button — wider, taller, stronger hover */
body.grimhold-inner .grimhold-downloads-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 14px 48px;
  background: linear-gradient(to bottom, #3d2010, #1e0e04);
  border: 1px solid rgba(200,169,110,0.60);
  color: #c8a96e;
  font: 700 13px/1.3 "Trebuchet MS", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  text-decoration: none;
  box-shadow: 0 0 12px rgba(200,169,110,0.08);
  transition: background 0.18s, border-color 0.18s, color 0.18s, box-shadow 0.18s;
}
body.grimhold-inner .grimhold-downloads-btn:hover {
  background: linear-gradient(to bottom, #5a3018, #301508);
  border-color: rgba(200,169,110,1);
  color: #f0e0b0;
  box-shadow: 0 0 20px rgba(200,169,110,0.22);
  text-decoration: none;
}
/* Secondary links (Minimap, IP Changer) — small pill-style */
body.grimhold-inner .grimhold-downloads-hero__extras {
  display: flex;
  justify-content: center;
  gap: 10px;
}
body.grimhold-inner .grimhold-downloads-extra-link {
  display: inline-block;
  padding: 4px 14px;
  background: rgba(200,169,110,0.06);
  border: 1px solid rgba(200,169,110,0.22);
  color: #9a8660;
  font: 400 11px/1.5 "Trebuchet MS", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  text-decoration: none;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
}
body.grimhold-inner .grimhold-downloads-extra-link:hover {
  background: rgba(200,169,110,0.12);
  border-color: rgba(200,169,110,0.50);
  color: #c8a96e;
  text-decoration: none;
}
/* Accordion spacing for downloads page */
body.grimhold-inner .grimhold-downloads-acc {
  margin-top: 10px;
}
/* Body content inside downloads accordions */
body.grimhold-inner .grimhold-downloads-body {
  padding: 14px 20px !important;
  color: #a09070;
  font: 400 12px/1.7 "Trebuchet MS", sans-serif;
}
body.grimhold-inner .grimhold-downloads-body b {
  display: block;
  color: #c8a96e;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  margin-bottom: 4px;
}
body.grimhold-inner .grimhold-downloads-body ul,
body.grimhold-inner .grimhold-downloads-body ol {
  padding-left: 22px;
  margin: 4px 0 10px;
}
body.grimhold-inner .grimhold-downloads-body li {
  margin-bottom: 3px;
}
body.grimhold-inner .grimhold-downloads-body--muted {
  color: #7a6a50;
  font-style: italic;
}

/* ===== Highscores Page ===== */

/* Update cadence notice */
body.grimhold-inner .grimhold-hs-note {
  padding: 8px 14px 8px 16px;
  margin-bottom: 10px;
  background: rgba(200,169,110,0.05);
  border: 1px solid rgba(200,169,110,0.18);
  border-left: 3px solid rgba(200,169,110,0.52);
  color: #9a8660;
  font: 400 11px/1.5 "Trebuchet MS", sans-serif;
}

/* Filter box — custom body, replaces Table1/InnerTableContainer nested tables */
body.grimhold-inner .grimhold-hs-filter-body {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  padding: 14px 18px;
}
body.grimhold-inner .grimhold-hs-filter-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-right: 28px;
  margin-right: 28px;
  border-right: 1px solid rgba(200,169,110,0.12);
}
body.grimhold-inner .grimhold-hs-filter-row:last-child {
  padding-right: 0;
  margin-right: 0;
  border-right: none;
}
body.grimhold-inner .grimhold-hs-filter-label {
  color: #a08850;
  font: 700 10px/1 "Trebuchet MS", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.10em;
  white-space: nowrap;
  min-width: 52px;
}
body.grimhold-inner .grimhold-hs-filter-select {
  height: 40px;
  padding: 0 36px 0 12px;
  background: #0e1518;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='7' viewBox='0 0 11 7'%3E%3Cpath d='M1 1l4.5 4.5L10 1' stroke='%23c8a96e' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  border: 1px solid rgba(200,169,110,0.48);
  color: #e0c884;
  font: 600 12px/1 "Trebuchet MS", sans-serif;
  cursor: pointer;
  outline: none;
  min-width: 152px;
  box-shadow: inset 0 1px 4px rgba(0,0,0,0.45), 0 1px 0 rgba(200,169,110,0.06);
  transition: border-color 0.18s, box-shadow 0.18s;
  -webkit-appearance: none;
  appearance: none;
}
body.grimhold-inner .grimhold-hs-filter-select:hover {
  border-color: rgba(200,169,110,0.72);
  box-shadow: inset 0 1px 4px rgba(0,0,0,0.45), 0 0 10px rgba(200,169,110,0.10);
}
body.grimhold-inner .grimhold-hs-filter-select:focus {
  border-color: rgba(200,169,110,0.85);
  box-shadow: inset 0 1px 4px rgba(0,0,0,0.45), 0 0 14px rgba(200,169,110,0.15);
}
body.grimhold-inner .grimhold-hs-filter-select option {
  background: #0e1518;
  color: #c8a96e;
  font-weight: 400;
}

/* Skills note between filter box and table */
body.grimhold-inner p.grimhold-hs-skills-note {
  margin: 4px 0 8px;
  color: #5a4e38;
  font: 400 11px/1.4 "Trebuchet MS", sans-serif;
}

/* Pagination row */
body.grimhold-inner .TableContent td.grimhold-hs-pagination {
  padding: 8px 12px !important;
  border-bottom: 1px solid rgba(153,105,45,0.18) !important;
  background: rgba(8,5,2,0.35) !important;
}
body.grimhold-inner .grimhold-hs-pagination__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
body.grimhold-inner .grimhold-hs-pagination__pages {
  display: flex;
  align-items: center;
  gap: 3px;
}
body.grimhold-inner a.grimhold-hs-pagination__link,
body.grimhold-inner span.grimhold-hs-pagination__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 26px;
  height: 24px;
  padding: 0 7px;
  background: rgba(200,169,110,0.06);
  border: 1px solid rgba(200,169,110,0.18);
  color: #9a8660;
  font: 400 11px/1 "Trebuchet MS", sans-serif;
  text-decoration: none;
  transition: background 0.12s, border-color 0.12s, color 0.12s;
}
body.grimhold-inner a.grimhold-hs-pagination__link:hover {
  background: rgba(200,169,110,0.12);
  border-color: rgba(200,169,110,0.40);
  color: #c8a96e;
  text-decoration: none;
}
body.grimhold-inner .grimhold-hs-pagination__link--current {
  background: rgba(200,169,110,0.13) !important;
  border-color: rgba(200,169,110,0.42) !important;
  color: #c8a96e !important;
  font-weight: 700;
}
body.grimhold-inner .grimhold-hs-pagination__count {
  color: #6a5a3a;
  font: 400 10px/1 "Trebuchet MS", sans-serif;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

/* Top 3 rank badges */
body.grimhold-inner .grimhold-hs-rank {
  display: inline-block;
  padding: 2px 7px;
  font: 700 10px/1.4 "Trebuchet MS", sans-serif;
  letter-spacing: 0.06em;
  border-radius: 2px;
  white-space: nowrap;
}
body.grimhold-inner .grimhold-hs-rank--gold {
  background: rgba(200,169,110,0.14);
  border: 1px solid rgba(200,169,110,0.48);
  color: #d4aa40;
}
body.grimhold-inner .grimhold-hs-rank--silver {
  background: rgba(155,165,175,0.09);
  border: 1px solid rgba(155,165,175,0.36);
  color: #9aaabb;
}
body.grimhold-inner .grimhold-hs-rank--bronze {
  background: rgba(160,88,40,0.11);
  border: 1px solid rgba(176,110,55,0.36);
  color: #b06c38;
}
body.grimhold-inner .grimhold-hs-rank-plain {
  color: #7a6a50;
  font: 400 12px/1 "Trebuchet MS", sans-serif;
}
/* Empty state */
body.grimhold-inner td.grimhold-hs-empty {
  padding: 20px 16px !important;
  color: #6a5a3a;
  font-style: italic;
}

/* ══════════════════════════════════════════════════════════════════════
   Players Online Page — grimhold-online-*
   Scope: body.grimhold-inner only. Does not affect any other page.
   ══════════════════════════════════════════════════════════════════════ */

/* ── Top row (World Info + Frags side by side) ─────────────────────── */
body.grimhold-inner .grimhold-online-top-row {
  display: flex;
  gap: 10px;
  margin-bottom: 10px;
}
body.grimhold-inner .grimhold-online-panel--half {
  flex: 1;
  min-width: 0;
}

/* ── World Information ──────────────────────────────────────────────── */
body.grimhold-inner .grimhold-online-world-info {
  padding: 4px 14px 10px;
  background: #01070a;
}
body.grimhold-inner .grimhold-online-world-row {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 7px 0;
  border-bottom: 1px solid rgba(200, 169, 110, 0.07);
}
body.grimhold-inner .grimhold-online-world-row:last-child {
  border-bottom: none;
}
body.grimhold-inner .grimhold-online-world-label {
  color: #9a8660;
  font: 700 10px/1.6 "Trebuchet MS", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  min-width: 120px;
  flex-shrink: 0;
}
body.grimhold-inner .grimhold-online-world-value {
  color: #c8b88a;
  font: 13px/1.5 "Trebuchet MS", sans-serif;
}
body.grimhold-inner .grimhold-online-world-value--online {
  color: #5aaa6a;
  font-weight: 700;
}
body.grimhold-inner .grimhold-online-world-value small {
  display: block;
  color: #7a6a4a;
  font-size: 11px;
  margin-top: 2px;
}
body.grimhold-inner .grimhold-online-offline {
  padding: 16px 14px;
  color: #9a8660;
  text-align: center;
  font: italic 13px "Trebuchet MS", sans-serif;
  background: #01070a;
}

/* ── Frags ──────────────────────────────────────────────────────────── */
body.grimhold-inner .grimhold-online-frag-list {
  padding: 8px 14px 12px;
  background: #01070a;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
body.grimhold-inner .grimhold-online-frag-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 0;
  border-bottom: 1px solid rgba(200, 169, 110, 0.06);
  color: #c8b88a;
  font: 12px/1.4 "Trebuchet MS", sans-serif;
}
body.grimhold-inner .grimhold-online-frag-item:last-child {
  border-bottom: none;
}
body.grimhold-inner .grimhold-online-frag-item img {
  flex-shrink: 0;
  border: 0;
}

/* ── Vocations Status ────────────────────────────────────────────────── */
body.grimhold-inner .grimhold-online-voc-section {
  margin-bottom: 10px;
}
body.grimhold-inner .grimhold-online-voc-grid {
  display: flex;
  background: #01070a;
}
body.grimhold-inner .grimhold-online-voc-card {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 18px 8px;
  border-right: 1px solid rgba(200, 169, 110, 0.10);
  transition: background 140ms ease;
}
body.grimhold-inner .grimhold-online-voc-card:last-child {
  border-right: none;
}
body.grimhold-inner .grimhold-online-voc-card:hover {
  background: #0b1114;
}
body.grimhold-inner .grimhold-online-voc-name {
  color: #9a8660;
  font: 700 9px/1 "Trebuchet MS", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.10em;
}
body.grimhold-inner .grimhold-online-voc-count {
  color: #c8a96e;
  font: 700 24px/1 "Georgia", serif;
}

/* ── Players Online table ────────────────────────────────────────────── */
body.grimhold-inner .grimhold-online-players-section {
  margin-bottom: 10px;
}
body.grimhold-inner .grimhold-online-players-table {
  background: #01070a;
  border-collapse: collapse;
}
/* Header row */
body.grimhold-inner .grimhold-online-players-table .grimhold-online-players-header td {
  background: #0e1518;
  color: #c8a96e;
  font: 700 10px/1 "Trebuchet MS", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 9px 10px;
  border-bottom: 1px solid rgba(200, 169, 110, 0.22);
}
/* Data rows */
body.grimhold-inner .grimhold-online-players-table .grimhold-online-players-row {
  transition: background 120ms ease;
}
body.grimhold-inner .grimhold-online-players-table .grimhold-online-players-row:hover {
  background: #0b1114 !important;
}
body.grimhold-inner .grimhold-online-players-table .grimhold-online-players-row td {
  background: transparent !important;
  padding: 2px 10px;
  color: #c8b88a;
  font-size: 13px;
  border-bottom: 1px solid rgba(200, 169, 110, 0.05);
  vertical-align: middle;
}
body.grimhold-inner .grimhold-online-players-table .grimhold-online-players-row td a {
  color: #c8b88a;
  text-decoration: none;
}
body.grimhold-inner .grimhold-online-players-table .grimhold-online-players-row td a:hover {
  color: #e8d8a0;
  text-decoration: underline;
}
/* Empty state */
body.grimhold-inner .grimhold-online-empty {
  padding: 24px 16px;
  text-align: center;
  color: #7a6a4a;
  font: italic 13px "Trebuchet MS", sans-serif;
  background: #01070a;
}

/* ══════════════════════════════════════════════════════════════════════
   Server Info Page (ots-info) — grimhold-si-*
   Scope: body.grimhold-inner only. No effect on any other page.
   ══════════════════════════════════════════════════════════════════════ */

/* ── Header ─────────────────────────────────────────────────────────── */
body.grimhold-inner .grimhold-si-header {
  text-align: center;
  padding: 8px 0 18px;
}
body.grimhold-inner .grimhold-si-servername {
  color: #c8a96e;
  font: 700 20px/1.2 "Georgia", serif;
  letter-spacing: 0.05em;
  margin: 0 0 10px;
}
body.grimhold-inner .grimhold-si-links {
  display: flex;
  justify-content: center;
  gap: 8px;
  flex-wrap: wrap;
}
body.grimhold-inner .grimhold-si-link,
body.grimhold-inner .grimhold-si-link:link,
body.grimhold-inner .grimhold-si-link:visited {
  display: inline-block;
  padding: 5px 14px;
  background: #0e1518;
  border: 1px solid rgba(200, 169, 110, 0.28);
  border-radius: 2px;
  color: #c8a96e;
  font: 700 10px/1.4 "Trebuchet MS", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.09em;
  text-decoration: none;
  transition: background 140ms ease, border-color 140ms ease, color 140ms ease;
}
body.grimhold-inner .grimhold-si-link:hover {
  background: #0b1114;
  border-color: rgba(200, 169, 110, 0.62);
  color: #e8d890;
}

/* ── Layout rows ─────────────────────────────────────────────────────── */
body.grimhold-inner .grimhold-si-row {
  display: flex;
  gap: 10px;
  margin-bottom: 10px;
  align-items: flex-start;
}
body.grimhold-inner .grimhold-si-col {
  min-width: 0;
}
body.grimhold-inner .grimhold-si-col--save  { flex: 0 0 42%; display: flex; flex-direction: column; gap: 10px; }
body.grimhold-inner .grimhold-si-col--info  { flex: 1; }
body.grimhold-inner .grimhold-si-col--rates { flex: 1; }
body.grimhold-inner .grimhold-si-col--frags { flex: 0 0 40%; }
/* Frags panel inside left col: fills remaining height */
body.grimhold-inner .grimhold-si-frags-panel { flex: 1; }
/* Full-width sections below the top row */
body.grimhold-inner .grimhold-si-full-section { margin-bottom: 10px; }

/* ── Server Save panel ───────────────────────────────────────────────── */
body.grimhold-inner .grimhold-si-save-panel {
  background: #01070a;
  border: 1px solid rgba(200, 169, 110, 0.22);
  border-radius: 2px;
  padding: 22px 14px 20px;
  text-align: center;
}
body.grimhold-inner .grimhold-si-save-title {
  color: #c8a96e;
  font: 700 12px/1.2 "Georgia", serif;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  margin-bottom: 4px;
}
body.grimhold-inner .grimhold-si-save-subtitle {
  color: #7a6a4a;
  font: 11px/1.4 "Trebuchet MS", sans-serif;
  margin-bottom: 18px;
}
body.grimhold-inner .grimhold-si-save-grid {
  display: flex;
  justify-content: center;
  gap: 6px;
}
body.grimhold-inner .grimhold-si-save-card {
  flex: 1;
  max-width: 76px;
  background: #0b1114;
  border: 1px solid rgba(200, 169, 110, 0.20);
  border-radius: 2px;
  padding: 10px 6px 8px;
  transition: border-color 160ms ease;
}
body.grimhold-inner .grimhold-si-save-card:hover {
  border-color: rgba(200, 169, 110, 0.40);
}
body.grimhold-inner .grimhold-si-save-label {
  color: #7a6a4a;
  font: 700 8px/1 "Trebuchet MS", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 7px;
}
body.grimhold-inner .grimhold-si-save-value {
  color: #c8a96e;
  font: 700 20px/1.1 "Georgia", serif;
  min-height: 22px;
}

/* ── Info/Frags definition list ──────────────────────────────────────── */
body.grimhold-inner .grimhold-si-infolist {
  background: #01070a;
  padding: 4px 0;
}
body.grimhold-inner .grimhold-si-inforow {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 6px 14px;
  border-bottom: 1px solid rgba(200, 169, 110, 0.06);
}
body.grimhold-inner .grimhold-si-inforow:last-child {
  border-bottom: none;
}
body.grimhold-inner .grimhold-si-label {
  color: #9a8660;
  font: 700 10px/1.6 "Trebuchet MS", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  min-width: 130px;
  flex-shrink: 0;
}
body.grimhold-inner .grimhold-si-val {
  color: #c8b88a;
  font: 13px/1.5 "Trebuchet MS", sans-serif;
}
body.grimhold-inner .grimhold-si-val small {
  display: block;
  color: #7a6a4a;
  font-size: 11px;
  margin-top: 1px;
}

/* ── Stage-based accordion spacing ──────────────────────────────────── */
body.grimhold-inner .grimhold-si-acc {
  margin-bottom: 6px;
}

/* ── Rates tables (inside accordions and flat) ───────────────────────── */
body.grimhold-inner .grimhold-si-rates-table {
  background: #01070a;
  border-collapse: collapse;
  width: 100%;
}
body.grimhold-inner .grimhold-si-rates-table .grimhold-si-rates-header th {
  background: #0e1518;
  color: #c8a96e;
  font: 700 10px/1 "Trebuchet MS", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 8px 12px;
  text-align: left;
  border-bottom: 1px solid rgba(200, 169, 110, 0.22);
}
body.grimhold-inner .grimhold-si-rates-table .grimhold-si-rates-row td {
  padding: 5px 12px;
  color: #c8b88a;
  font: 12px/1.4 "Trebuchet MS", sans-serif;
  border-bottom: 1px solid rgba(200, 169, 110, 0.05);
  background: transparent !important;
}
body.grimhold-inner .grimhold-si-rates-table .grimhold-si-rates-row:hover td {
  background: #0b1114 !important;
}
body.grimhold-inner .grimhold-si-rates-table .grimhold-si-rates-row:last-child td {
  border-bottom: none;
}

/* ── Bottom notice ──────────────────────────────────────────────────── */
body.grimhold-inner .grimhold-si-notice {
  text-align: center;
  padding: 10px 0 4px;
  color: #7a6a4a;
  font: italic 11px "Trebuchet MS", sans-serif;
}

/* ── Last Kills (lastkills.html.twig) ───────────────────────────── */
body.grimhold-inner .grimhold-lastkills-icon {
  color: rgba(200, 169, 110, 0.75);
  font-size: 15px;
  margin-right: 4px;
  vertical-align: middle;
}
body.grimhold-inner .grimhold-lastkills-empty {
  text-align: center;
  padding: 18px 0;
  color: #7a6a4a;
  font: italic 11px "Trebuchet MS", sans-serif;
}

/* ── Account / Character Created — success page polish ─────────── */

/* Green success banner */
.grimhold-success-banner {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 0 0 10px;
  padding: 14px 18px;
  background: rgba(20, 60, 30, 0.45);
  border: 1px solid rgba(90, 170, 106, 0.45);
  border-radius: 2px;
}
.grimhold-success-icon {
  flex-shrink: 0;
  width: 34px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #9fd3a7;
  font-size: 20px;
  font-weight: 700;
  border: 1px solid rgba(90, 170, 106, 0.50);
  border-radius: 50%;
}
.grimhold-success-banner-title {
  color: #9fd3a7;
  font: 700 11px/1.2 "Trebuchet MS", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}
.grimhold-success-banner-sub {
  color: rgba(159, 211, 167, 0.65);
  font: 11px/1.4 "Trebuchet MS", sans-serif;
  margin-top: 3px;
}

/* Account info label/value rows */
.grimhold-success-infolist {
  background: #01070a;
  padding: 4px 0;
}
.grimhold-success-inforow {
  display: flex;
  flex-direction: column;
  padding: 10px 16px;
  border-bottom: 1px solid rgba(200, 169, 110, 0.06);
}
.grimhold-success-inforow:last-child {
  border-bottom: none;
}
.grimhold-success-label {
  color: rgba(200, 169, 110, 0.55);
  font: 700 9px/1 "Trebuchet MS", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  margin-bottom: 4px;
}
.grimhold-success-val {
  color: #e8dcc8;
  font: 13px/1.4 "Trebuchet MS", sans-serif;
}

/* Security note */
.grimhold-success-security {
  background: #01070a;
  color: rgba(200, 169, 110, 0.50);
  font: italic 11px/1.6 "Trebuchet MS", sans-serif;
  padding: 10px 16px 12px;
  border-top: 1px solid rgba(200, 169, 110, 0.06);
}

/* Character created section */
.grimhold-success-char-section {
  background: #01070a;
  text-align: center;
  padding: 22px 16px 18px;
}
.grimhold-success-char-label {
  color: rgba(200, 169, 110, 0.55);
  font: 700 9px/1 "Trebuchet MS", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  margin-bottom: 10px;
}
.grimhold-success-char-name {
  color: #e8dcc8;
  font: 700 22px/1.2 "Georgia", serif;
  letter-spacing: 0.04em;
  margin-bottom: 10px;
}
.grimhold-success-char-sub {
  color: rgba(200, 169, 110, 0.55);
  font: italic 11px/1.5 "Trebuchet MS", sans-serif;
}

/* "Your legend starts here." gold footer */
.grimhold-success-legend {
  background: #01070a;
  text-align: center;
  color: #c8a96e;
  font: italic 700 13px/1 "Georgia", serif;
  letter-spacing: 0.06em;
  padding: 10px 16px 14px;
  border-top: 1px solid rgba(200, 169, 110, 0.08);
}

/* Next step header label */
.grimhold-next-step-header {
  color: rgba(200, 169, 110, 0.65) !important;
  font: 700 9px/1 "Trebuchet MS", sans-serif !important;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  margin: 0 0 6px !important;
}

/* ── Success page: Next Step (sem card marrom) ──────────────────── */
.grimhold-success-nextstep {
  margin: 14px auto 10px;
  max-width: 560px;
  text-align: center;
}
.grimhold-success-nextstep .grimhold-next-step-desc {
  color: #dfc49a;
  font: 13px/1.6 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  margin: 0 0 14px;
}
.grimhold-next-step-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 24px;
  color: #211005 !important;
  font: 900 13px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-decoration: none !important;
  background: linear-gradient(180deg, #f1cd7e, #b86b27);
  border: 1px solid rgba(255, 224, 151, 0.58);
  box-shadow: 0 10px 18px rgba(0, 0, 0, 0.32), inset 0 1px 0 rgba(255, 245, 204, 0.24);
}
.grimhold-next-step-btn:hover {
  color: #120704 !important;
  filter: brightness(1.05);
}

/* ── Success page: LOGIN TO YOUR ACCOUNT button width fix ───────── */
.grimhold-success-login-btn .BigButton,
.grimhold-success-login-btn .BigButtonOver {
  width: 220px;
}
.grimhold-success-login-btn .BigButtonText {
  width: 220px;
  white-space: nowrap;
}

/* ── Wiki Hub page ── */
.grimhold-modern-card.grimhold-wiki-card,
.grimhold-modern-card.grimhold-wiki-card:link,
.grimhold-modern-card.grimhold-wiki-card:visited {
  background:
    linear-gradient(180deg, rgba(17, 19, 21, 0.97), rgba(10, 10, 10, 0.99)),
    radial-gradient(circle at 100% 0%, rgba(212, 175, 55, 0.06), transparent 45%);
  border: 1px solid rgba(184, 134, 11, 0.35);
  box-shadow: 0 16px 28px rgba(0, 0, 0, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.03);
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
.grimhold-modern-card.grimhold-wiki-card:hover {
  border-color: rgba(212, 175, 55, 0.55);
  box-shadow: 0 20px 32px rgba(0, 0, 0, 0.6), 0 0 18px rgba(212, 175, 55, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.04);
  transform: translateY(-2px);
}
.grimhold-modern-card.grimhold-wiki-card .grimhold-wiki-card__icon {
  display: block;
  margin-bottom: 10px;
  color: var(--grimhold-gold-pale);
}
.grimhold-modern-card.grimhold-wiki-card .grimhold-wiki-card__cta {
  display: block;
  margin-top: 14px;
  color: var(--grimhold-gold) !important;
  font-weight: 700;
}
.grimhold-wiki-notice {
  margin: 8px 0 0;
  color: var(--grimhold-muted);
  font: 400 13px/1.5 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
}

.grimhold-wiki-badge {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin: 16px 0 18px;
  padding: 6px 14px;
  color: var(--grimhold-gold-pale);
  font: 700 11px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  background: rgba(15, 12, 9, 0.55);
  border: 1px solid rgba(184, 134, 11, 0.35);
  border-radius: 999px;
  box-shadow: inset 0 1px 0 rgba(255, 229, 169, 0.06);
}

.grimhold-wiki-badge__dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--grimhold-gold);
  box-shadow: 0 0 6px rgba(217, 164, 65, 0.7);
}

@media (max-width: 600px) {
  .grimhold-wiki-grid {
    grid-template-columns: 1fr;
  }
}

/* ── Commands page ── */
.grimhold-commands-list {
  margin-top: 6px;
}
.grimhold-commands-group {
  margin: 0 0 32px;
}
.grimhold-commands-group__title {
  margin: 0 0 14px;
  padding-bottom: 8px;
  color: var(--grimhold-gold-pale);
  font: 700 16px/1.2 Georgia, "Times New Roman", serif;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border-bottom: 1px solid rgba(184, 134, 11, 0.25);
}
.grimhold-commands-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.grimhold-command-card {
  padding: 16px 18px;
  background:
    linear-gradient(180deg, rgba(17, 19, 21, 0.97), rgba(10, 10, 10, 0.99)),
    radial-gradient(circle at 100% 0%, rgba(212, 175, 55, 0.05), transparent 45%);
  border: 1px solid rgba(184, 134, 11, 0.30);
  box-shadow: 0 12px 22px rgba(0, 0, 0, 0.45);
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
.grimhold-command-card:hover {
  border-color: rgba(212, 175, 55, 0.55);
  box-shadow: 0 16px 28px rgba(0, 0, 0, 0.5), 0 0 14px rgba(212, 175, 55, 0.14);
  transform: translateY(-1px);
}
.grimhold-command-card__name {
  margin-bottom: 10px;
  color: var(--grimhold-gold-pale);
  font: 700 16px/1.2 "Consolas", "Courier New", monospace;
  letter-spacing: 0.01em;
}
.grimhold-command-card__row {
  margin-top: 8px;
}
.grimhold-command-card__row span {
  display: block;
  margin-bottom: 3px;
  color: var(--grimhold-muted);
  font: 700 10px/1.2 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.grimhold-command-card__row p {
  margin: 0;
  color: var(--grimhold-text);
  font: 400 13px/1.5 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
}
.grimhold-command-card__row code {
  display: inline-block;
  padding: 3px 8px;
  color: #f0d28a;
  font: 400 12.5px/1.4 "Consolas", "Courier New", monospace;
  background: rgba(217, 164, 65, 0.08);
  border: 1px solid rgba(184, 134, 11, 0.22);
  border-radius: 4px;
  word-break: break-word;
}
@media (max-width: 760px) {
  .grimhold-commands-grid {
    grid-template-columns: 1fr;
  }
}

/* ─── Lost Account buttons ──────────────────────────────────────── */
.grimhold-lost-btn,
.grimhold-lost-btn:link,
.grimhold-lost-btn:visited {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 110px; padding: 0 18px; height: 30px;
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  font-size: 12px; font-weight: 700; cursor: pointer; border-radius: 2px;
  border: 1px solid rgba(200,155,50,0.80);
  background: linear-gradient(180deg, #c8a25c 0%, #9a6820 52%, #5a3008 100%);
  color: #1a0c02 !important; text-decoration: none; white-space: nowrap;
  text-shadow: 0 1px 0 rgba(255,210,100,0.30);
  box-shadow: 0 2px 6px rgba(0,0,0,0.50), inset 0 1px 0 rgba(255,230,130,0.40);
  transition: background 0.14s ease, box-shadow 0.14s ease;
}
.grimhold-lost-btn:hover, .grimhold-lost-btn:focus-visible {
  background: linear-gradient(180deg, #dfb968 0%, #b57a28 52%, #6a3810 100%);
  box-shadow: 0 3px 10px rgba(0,0,0,0.60), 0 0 12px rgba(200,155,60,0.25);
  color: #1a0c02 !important; text-decoration: none;
}
.grimhold-lost-btn--back,
.grimhold-lost-btn--back:link,
.grimhold-lost-btn--back:visited {
  background: linear-gradient(180deg, #8a7040 0%, #6a5020 52%, #3a2808 100%);
  border-color: rgba(160,120,40,0.70);
  color: #e8d0a0 !important;
}
.grimhold-lost-btn--back:hover, .grimhold-lost-btn--back:focus-visible {
  background: linear-gradient(180deg, #a08048 0%, #7a5e28 52%, #4a3010 100%);
  color: #f0dab8 !important;
}

/* ─── Lost Account page layout classes ─────────────────────────── */

.grimhold-lost-panel {
  background: linear-gradient(180deg, #0e1211, #090806);
  border: 1px solid rgba(153, 105, 45, 0.30);
  box-shadow: 0 14px 28px rgba(0,0,0,0.42), inset 0 1px 0 rgba(239,200,120,0.06);
  margin-bottom: 14px;
  overflow: hidden;
}
.grimhold-lost-panel__title {
  background: rgba(8, 5, 2, 0.65);
  border-bottom: 1px solid rgba(153, 105, 45, 0.35);
  border-left: 3px solid rgba(200, 169, 110, 0.70);
  padding: 10px 16px;
  color: #c8a96e;
  font: 700 11px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.20em;
  text-transform: uppercase;
  text-shadow: 0 1px 3px rgba(0,0,0,0.90);
}
.grimhold-lost-panel__body {
  padding: 16px 20px;
}

/* Field row: label + input side by side */
.grimhold-lost-field {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
}
.grimhold-lost-field label {
  min-width: 150px;
  flex-shrink: 0;
  color: rgba(200, 169, 110, 0.75);
  font: 400 12px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.04em;
}
.grimhold-lost-field input {
  flex: 1 1 0;
  min-width: 0;
}

/* Radio group */
.grimhold-lost-radio-group {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.grimhold-lost-radio-option {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  cursor: pointer;
  color: var(--grimhold-text);
  font: 400 13px/1.45 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
}
.grimhold-lost-radio-option input[type="radio"] {
  flex-shrink: 0;
  margin-top: 2px;
  width: 14px;
  height: 14px;
  accent-color: #c8a96e;
}

/* Buttons row */
.grimhold-lost-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 0 2px;
}

/* Message states */
.grimhold-lost-error {
  background: rgba(130, 25, 25, 0.18);
  border-left: 3px solid rgba(180, 50, 50, 0.60);
  color: #e88080;
  padding: 10px 14px;
  margin-bottom: 12px;
  font: 400 13px/1.5 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
}
.grimhold-lost-error strong {
  color: #f0a0a0;
}
.grimhold-lost-error--small {
  font-size: 11px;
  padding: 7px 12px;
  margin-top: 8px;
  margin-bottom: 0;
}

.grimhold-lost-success {
  background: rgba(30, 80, 20, 0.20);
  border-left: 3px solid rgba(70, 160, 50, 0.55);
  color: #90c870;
  padding: 10px 14px;
  margin-bottom: 12px;
  font: 400 13px/1.5 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
}
.grimhold-lost-success--banner {
  padding: 12px 16px;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.grimhold-lost-info-text {
  color: rgba(200, 169, 110, 0.65);
  font: 400 12px/1.5 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  margin-bottom: 10px;
}
.grimhold-lost-info-text--small {
  font-size: 11px;
  margin-top: 10px;
  margin-bottom: 0;
}

/* Display rows (account name / password reveal on success) */
.grimhold-lost-display {
  display: flex;
  align-items: baseline;
  gap: 12px;
  padding: 5px 0;
  border-bottom: 1px solid rgba(153, 105, 45, 0.12);
}
.grimhold-lost-display:last-child {
  border-bottom: none;
}
.grimhold-lost-display__label {
  min-width: 150px;
  flex-shrink: 0;
  color: rgba(200, 169, 110, 0.55);
  font: 400 11px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.grimhold-lost-display__value {
  color: #e8d8b0;
  font: 700 13px/1 "Trebuchet MS", "Segoe UI", Arial, sans-serif;
}

/* Responsive */
@media (max-width: 600px) {
  .grimhold-lost-field {
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
  }
  .grimhold-lost-field label {
    min-width: 0;
  }
  .grimhold-lost-field input {
    width: 100%;
  }
  .grimhold-lost-display {
    flex-direction: column;
    gap: 3px;
  }
}

/* ══════════════════════════════════════════════════════════════════════
   Experience Competition Page — .grimhold-xp-comp
   Scope: body.grimhold-inner only. Isolated namespace, no global side-effects.
   ══════════════════════════════════════════════════════════════════════ */

/* ── Hero / intro ─────────────────────────────────────────────────────── */
body.grimhold-inner .grimhold-xp-comp {
  max-width: 900px;
  margin: 0 auto;
}
body.grimhold-inner .grimhold-xp-comp__hero {
  padding: 22px 0 18px;
  border-bottom: 1px solid rgba(200,169,110,0.20);
  margin-bottom: 20px;
}
body.grimhold-inner .grimhold-xp-comp__subtitle {
  font-size: 13px;
  color: #a89e90;
  line-height: 1.75;
  margin: 0 0 16px;
}
body.grimhold-inner .grimhold-xp-comp__subtitle em {
  color: #8a8278;
  font-style: italic;
}

/* ── Reset-time pills ─────────────────────────────────────────────────── */
body.grimhold-inner .grimhold-xp-comp__resets {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
body.grimhold-inner .grimhold-xp-comp__reset-item {
  display: flex;
  align-items: center;
  gap: 7px;
  background: rgba(200,169,110,0.07);
  border: 1px solid rgba(200,169,110,0.24);
  border-radius: 3px;
  padding: 5px 12px;
}
body.grimhold-inner .grimhold-xp-comp__reset-label {
  font-size: 11px;
  font-weight: 700;
  color: #9a9080;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
body.grimhold-inner .grimhold-xp-comp__reset-value {
  font-size: 12px;
  color: #c8a96e;
}

/* Info bar below reset pills */
body.grimhold-inner .grimhold-xp-comp__infobar {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-top: 14px;
  padding: 10px 14px;
  background: rgba(26,28,30,0.92);
  border: 1px solid rgba(155,170,185,0.20);
  border-radius: 3px;
}
body.grimhold-inner .grimhold-xp-comp__infobar-icon {
  flex-shrink: 0;
  width: 15px;
  height: 15px;
  color: rgba(155,175,200,0.72);
  margin-top: 2px;
}
body.grimhold-inner .grimhold-xp-comp__infobar span {
  font-size: 12px;
  color: #a0a8b0;
  line-height: 1.65;
}

/* ── Tabs ─────────────────────────────────────────────────────────────── */
body.grimhold-inner .grimhold-xp-comp__tabs {
  display: flex;
  gap: 0;
  border-bottom: 1px solid rgba(200,169,110,0.22);
  margin-bottom: 0;
}
body.grimhold-inner .grimhold-xp-comp__tab {
  padding: 10px 22px;
  font-family: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: #8a8478;
  text-decoration: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  transition: color 0.15s, border-color 0.15s;
  letter-spacing: 0.04em;
}
body.grimhold-inner .grimhold-xp-comp__tab:hover {
  color: #b8a868;
  text-decoration: none;
}
body.grimhold-inner .grimhold-xp-comp__tab.is-active {
  color: #c8a96e;
  border-bottom-color: #c8a96e;
}

/* ── Ranking card ─────────────────────────────────────────────────────── */
body.grimhold-inner .grimhold-xp-comp__card {
  background: rgba(20,18,16,0.88);
  border: 1px solid rgba(200,169,110,0.22);
  border-top: none;
  border-radius: 0 0 4px 4px;
}
body.grimhold-inner .grimhold-xp-comp__card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 18px;
  border-bottom: 1px solid rgba(200,169,110,0.16);
}
body.grimhold-inner .grimhold-xp-comp__card-title {
  font-family: Georgia, serif;
  font-size: 14px;
  font-weight: 700;
  color: #c8a96e;
  letter-spacing: 0.04em;
}
body.grimhold-inner .grimhold-xp-comp__card-meta {
  font-size: 11px;
  color: #7a7470;
}

/* ── Empty state ──────────────────────────────────────────────────────── */
body.grimhold-inner .grimhold-xp-comp__empty {
  padding: 48px 24px;
  text-align: center;
  color: #9a9488;
}
body.grimhold-inner .grimhold-xp-comp__empty-icon {
  width: 38px;
  height: 38px;
  color: rgba(200,169,110,0.38);
  margin-bottom: 14px;
}
body.grimhold-inner .grimhold-xp-comp__empty p {
  margin: 5px 0;
  font-size: 14px;
}
body.grimhold-inner .grimhold-xp-comp__empty-hint {
  font-size: 12px !important;
  color: #7a7470;
  margin-top: 10px !important;
}

/* ── Table ────────────────────────────────────────────────────────────── */
body.grimhold-inner .grimhold-xp-comp__table {
  width: 100%;
  border-collapse: collapse;
}
body.grimhold-inner .grimhold-xp-comp__head-row,
body.grimhold-inner .grimhold-xp-comp__table thead tr {
  background: #11161a !important;
  border-bottom: 1px solid rgba(200,169,110,0.20);
}
/* High-specificity override: .Content th sets brown linear-gradient !important (line 2517).
   ID selector (#News) beats class selector (.Content) unconditionally. */
body.grimhold-inner #News .grimhold-xp-comp__table thead th,
body.grimhold-inner #News .grimhold-xp-comp__table .grimhold-xp-comp__th {
  background-color: #11161a !important;
  background-image: none !important;
}
body.grimhold-inner .grimhold-xp-comp__th {
  padding: 10px 14px;
  font-family: "Trebuchet MS", Arial, sans-serif;
  font-size: 11px;
  font-weight: 700;
  color: #c8bfa8;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  white-space: nowrap;
  text-align: left;
}
body.grimhold-inner .grimhold-xp-comp__th--rank   { width: 60px; text-align: center; }
body.grimhold-inner .grimhold-xp-comp__th--outfit { width: 62px; text-align: center; }
body.grimhold-inner .grimhold-xp-comp__th--name   { width: 100%; }
body.grimhold-inner .grimhold-xp-comp__th--voc    { text-align: right; white-space: nowrap; }
body.grimhold-inner .grimhold-xp-comp__th--lvl    { text-align: right; white-space: nowrap; }
body.grimhold-inner .grimhold-xp-comp__th--xp     { text-align: right; white-space: nowrap; }

/* Row base */
body.grimhold-inner .grimhold-xp-comp__row {
  border-bottom: 1px solid rgba(200,169,110,0.09);
  height: 54px;
  transition: background 0.12s;
}
body.grimhold-inner .grimhold-xp-comp__row:last-child {
  border-bottom: none;
}
body.grimhold-inner .grimhold-xp-comp__row:hover {
  background: rgba(200,169,110,0.06);
}

/* Top-3 row highlights */
body.grimhold-inner .grimhold-xp-comp__row--top1 {
  background: rgba(200,169,110,0.09);
}
body.grimhold-inner .grimhold-xp-comp__row--top2 {
  background: rgba(185,195,210,0.06);
}
body.grimhold-inner .grimhold-xp-comp__row--top3 {
  background: rgba(165,110,65,0.06);
}
body.grimhold-inner .grimhold-xp-comp__row--top1:hover { background: rgba(200,169,110,0.15); }
body.grimhold-inner .grimhold-xp-comp__row--top2:hover { background: rgba(185,195,210,0.12); }
body.grimhold-inner .grimhold-xp-comp__row--top3:hover { background: rgba(165,110,65,0.11); }

/* Cells */
body.grimhold-inner .grimhold-xp-comp__td {
  padding: 0 14px;
  font-size: 13px;
  color: #ccc4b6;
  vertical-align: middle;
  line-height: 1.4;
}
body.grimhold-inner .grimhold-xp-comp__td--rank   { text-align: center; }
body.grimhold-inner .grimhold-xp-comp__td--outfit { padding: 0; width: 62px; text-align: center; vertical-align: middle; }
body.grimhold-inner .grimhold-xp-comp__td--name   { }
body.grimhold-inner .grimhold-xp-comp__td--voc    { text-align: right; color: #9a9080; font-size: 12px; }
body.grimhold-inner .grimhold-xp-comp__td--lvl    { text-align: right; }
body.grimhold-inner .grimhold-xp-comp__td--xp     { text-align: right; padding-right: 16px; }

/* Rank badges */
body.grimhold-inner .grimhold-xp-comp__badge {
  display: inline-block;
  padding: 3px 8px;
  font: 700 11px/1.4 "Trebuchet MS", sans-serif;
  letter-spacing: 0.06em;
  border-radius: 2px;
  white-space: nowrap;
}
body.grimhold-inner .grimhold-xp-comp__badge--gold {
  background: rgba(200,169,110,0.18);
  border: 1px solid rgba(200,169,110,0.58);
  color: #e8c85a;
}
body.grimhold-inner .grimhold-xp-comp__badge--silver {
  background: rgba(185,195,210,0.12);
  border: 1px solid rgba(185,195,210,0.50);
  color: #c0cdd8;
}
body.grimhold-inner .grimhold-xp-comp__badge--bronze {
  background: rgba(180,130,80,0.13);
  border: 1px solid rgba(180,130,80,0.44);
  color: #d4a060;
}
body.grimhold-inner .grimhold-xp-comp__rank-plain {
  color: #7a7470;
  font: 400 12px/1 "Trebuchet MS", sans-serif;
}

/* Name link */
body.grimhold-inner .grimhold-xp-comp__name-link {
  color: #d4b87e;
  text-decoration: none;
  font-weight: 600;
}
body.grimhold-inner .grimhold-xp-comp__name-link:hover {
  color: #ecd090;
  text-decoration: underline;
}

/* Outfit cell */
body.grimhold-inner .grimhold-xp-comp__outfit-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  overflow: visible;
  vertical-align: middle;
}
body.grimhold-inner .grimhold-xp-comp__outfit-wrap img {
  display: block;
  width: 64px;
  height: 64px;
  object-fit: contain;
  image-rendering: pixelated;
  image-rendering: crisp-edges;
  filter: drop-shadow(0 2px 3px rgba(0,0,0,0.30));
  transform: translateY(-11px);
}

/* XP gained value */
body.grimhold-inner .grimhold-xp-comp__xp-value {
  font-family: "Trebuchet MS", Arial, sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: #b0b8a0;
  letter-spacing: 0.02em;
}
body.grimhold-inner .grimhold-xp-comp__xp-value--top {
  color: #e8c85a;
}

/* Footer counter */
body.grimhold-inner .grimhold-xp-comp__footer {
  padding: 10px 18px;
  border-top: 1px solid rgba(200,169,110,0.12);
  font-size: 11px;
  color: #7a7470;
  text-align: right;
}

/* ── Responsive ───────────────────────────────────────────────────────── */
@media (max-width: 680px) {
  body.grimhold-inner .grimhold-xp-comp__resets {
    flex-direction: column;
    gap: 5px;
  }
  body.grimhold-inner .grimhold-xp-comp__tabs {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  body.grimhold-inner .grimhold-xp-comp__th--voc,
  body.grimhold-inner .grimhold-xp-comp__td--voc {
    display: none;
  }
  body.grimhold-inner .grimhold-xp-comp__card-meta {
    display: none;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   Grimhold — Form Submit Loading State
   Prevents double-submit; shows spinner + status message during processing.
   ═══════════════════════════════════════════════════════════════════════ */

/* Dim the BigButton GIF wrapper while loading */
.BigButton.grimhold-submit-loading {
  opacity: 0.45;
  pointer-events: none;
  cursor: not-allowed;
}

/* Dim standalone input[type=submit] and button[type=submit] */
input.grimhold-submit-loading[type="submit"],
input.grimhold-submit-loading[type="image"],
button.grimhold-submit-loading[type="submit"] {
  opacity: 0.45;
  pointer-events: none;
  cursor: not-allowed !important;
}

/* Extra overrides for the grimhold-lost-btn style when loading */
button.grimhold-submit-loading.grimhold-lost-btn {
  background: #2a1e0e !important;
  border-color: rgba(200,169,110,0.18) !important;
  color: #6a5a3a !important;
  box-shadow: none !important;
}

/* Processing status message — dark fantasy panel with gold text */
.grimhold-submit-status {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-top: 12px;
  padding: 9px 14px;
  background: #131009;
  border: 1px solid rgba(200,169,110,0.28);
  border-radius: 4px;
  color: #c8a96e;
  font-size: 12px;
  font-family: 'Trebuchet MS', Verdana, Arial, sans-serif;
  letter-spacing: 0.4px;
  line-height: 1.4;
}

/* Spinning loader before the message text */
.grimhold-submit-status::before {
  content: '';
  flex-shrink: 0;
  width: 11px;
  height: 11px;
  border: 2px solid rgba(200,169,110,0.22);
  border-top-color: #c8a96e;
  border-radius: 50%;
  animation: grimhold-spin 0.75s linear infinite;
}

@keyframes grimhold-spin {
  to { transform: rotate(360deg); }
}