.dark .guessing .rankList .on, .dark .guessing .rankList .userBox:hover, .dark .hotmatchs .matchItem:hover, .dark .gsRecord .R-rate {background: #2c2f31;}
.dark .gsRecord .R-rate {border-color: #363a3c;}
.guessing #left {width: 650px !important;}
.guessing #right {width: 400px !important;}
.guessing {position: relative;}

/* 排行 */
.guessing .Second-nav {color:var(--textcolor-1);font-size:16px;font-weight:600;line-height:30px;width:100%;padding-bottom:8px;margin:0;}
.guessing .datebox {/*background: var(--bgcolor-3);*/color: var(--textcolor-1);font-size: 14px;padding: 1px;border-radius: 5px;float: right;}
.guessing .datebox .icon {background: var(--bgcolor-2);color: var(--textcolor-1) !important;width: 30px;font-size: 16px;text-align: center;border-radius: 4px;padding: 5px 0;transform: rotate(-90deg);vertical-align: -1px;display: inline-block;cursor: pointer;}
.guessing .datebox .icon.ago {transform: rotate(90deg);}
.guessing .datebox .icon.off {color: var(--textcolor-3) !important;}
.guessing .datebox span {padding: 0 4px;}
.guessing .rankList .userBox {align-items: center;padding: 10px 0;border-bottom: 1px solid var(--border-2);cursor: pointer;}
.guessing .rankList .on,.guessing .rankList .userBox:hover, .hotmatchs .matchItem:hover {background: #edf2f6;}
.guessing .rankList .rankNum {color: var(--text-primary);font-size: 18px;font-weight: bold;font-family: "Sofascore Sans Condensed", sans-serif;}
.guessing .userName {font-size: 14px;font-weight: bold;line-height: 40px;flex: 1;margin-left: 5px;}
.guessing .userBox .R-rate {flex: 0 0 16%;font-weight: normal;line-height: 22px;}
.guessing .userBox .R-rate.big {font-size: 16px;font-weight: bold;}
.guessing .Litem {flex: 0 0 8%;text-align: center;}
.guessing .tag,.guessing .letnum {background: var(--primary-color);color: var(--text-white);font-size: 12px;line-height: 16px;font-weight: normal;text-align: center;font-style: normal;height: 16px;padding: 0 10px;border-radius: 20px;display: inline-block;}
.guessing .tag {background: var(--red40);text-transform: uppercase;padding: 0 5px;margin-left: 5px;}
.guessing .gobtn {color: var(--textcolor-3);font-size: 24px;text-align: center;height: 40px;line-height: 40px;padding: 0 4px 0 15px;}
.guessing .gobtn:before {transform: rotate(90deg);}
.guessing .on .gobtn {color: var(--textcolor-1) !important;font-weight: bold;}

/* 右侧 */
.guessing .rewardbox {background:linear-gradient(45deg,#fff095,#ffb98a,#a7d4ae);padding:12px !important;position:relative;overflow: initial;}
.rewardbox .rewardpic {width: 100px;height: auto;max-height: initial;position: absolute;top: -12px;left: -2px;;}
.rewardbox .icon {background: var(--white10);color: var(--yellow60) !important;font-size: 26px;width: 40px;height: 40px;line-height: 40px;text-align: center;vertical-align: 7px;border-radius: 50%;display: inline-block;}
.rewardbox .jackpot {color: #8f3100;font-size: 18px;font-weight: bold;margin-left: 90px;display: inline-block;}
.rewardbox .jackpot span {font-size: 12px;font-weight: normal;margin-top: 3px;display: block;}

.hotmatchs {padding-top: 10px;}
.hotmatchs .matchItem {border-color: var(--border-2);cursor: pointer;}
.hotmatchs .matchItem:hover {border-radius: 5px;}
.hotmatchs .teamIcon {width: 30px;height: 30px;flex: 0 0 30px !important;}
.hotmatchs .teamName {font-size: 12px;}
.hotmatchs .vs {color: var(--textcolor-3);flex: 0 0 10%;}

/* 规则*/
.guessing .rulebox {padding: 10px;}
.guessing .rulebox .ruletit {font-size: 15px;font-weight: bold;margin-bottom: 6px;}
.guessing .rulebox .ruletit::before {content:"";background: var(--primary-color);width: 3px;height: 12px;margin-right: 8px;border-radius: 3px;vertical-align: -1px;display: inline-block;}
.guessing .rulebox p {font-size: 14px;line-height: 22px;}
.guessing .rulebox a {color: var(--blue40);font-weight: bold;text-decoration: none;}
.guessing .rulebox a:hover {color: var(--thirdly-color);text-decoration: underline;} 
#ruleContent b span{ font-weight: bold !important; }
#ruleContent ol , #ruleContent ul{ margin-left:15px; }
#ruleContent ul li{ list-style: disc; }

/* 记录 */
.close {width: 15px;height: 15px;border-radius: 50%;margin: 6px;display: inline-block;float: right;position: relative;cursor: pointer;transition: all 0.2s linear;}
.close::before,.close::after {content:"";background: var(--textcolor-3);width: 100%;height: 1px;position: absolute;top: 50%;left: 0;transform: translateY(-50%) rotate(45deg);}
.close::after {transform: translateY(-50%) rotate(-45deg);}
.close:hover {transform: rotate(90deg);}
.right-title {line-height: 30px;}
.gsRecord {width: 400px !important;max-height: calc(100vh - 180px);position: fixed;overflow-y: auto;}
.gsRecord::-webkit-scrollbar {width: 6px;height: 100%;background: var(--bgcolor-2);border-radius: 5px;overflow: hidden;}
.gsRecord::-webkit-scrollbar-thumb {background: var(--bgcolor-4);border-radius: 5px}
.gsRecord .userBox {margin: 10px 3px;}
.gsRecord .datebox {background: var(--bgcolor-2);float: none;margin: 0 3px 10px 3px;}
/* .gsRecord .datebox .icon {background: var(--bgcolor-1);} */
.gsRecord .datebox span {width: calc(100% - 70px);text-align: center;display: inline-block;}
.gsRecord .count {display: flex;margin: 10px 0;}
.gsRecord .R-rate {background: #edf2f6;border: 1px solid #d8e6f1;font-size:14px;font-weight:bold;text-align:center;padding: 5px;margin: 0 3px;border-radius: 5px;flex:1;}
.gsRecord .R-exp {color:var(--textcolor-3);font-size:12px;font-weight:normal;line-height:normal;display:block;}
.gsRecord .matchItem {float: none;border: none;padding: 10px;}
.gsRecord .timetip {color: var(--textcolor-3);font-size: 12px;text-align: center;line-height: 22px;}
.gsRecord .recordlis {background: var(--bgcolor-2);border-radius: 5px;margin-bottom: 8px;}
.gsRecord .mini .home,.gsRecord .mini .guest {text-align: left;flex-direction: row;align-items: center;overflow: hidden;}
.gsRecord .mini .guest {text-align: right;}
.gsRecord .mini .teamName {font-weight:bold;margin: 0 5px;flex:1;word-break:keep-all;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;}
.gsRecord .mini .teamIcon {/*background: var(--bgcolor-1);*/width:20px;height:20px;flex:0 0 20px !important;margin:0 ;/*border-radius: 5px;*/}
.gsRecord .mini .vs {color: var(--textcolor-3);flex: 0 0 18%;}
.gsRecord .mini .vs.score {color: var(--textcolor-1);font-size: 14px;font-weight: bold;}
.gsRecord .guesstip {color: var(--textcolor-2);line-height: 16px;padding: 8px 12px;border-top: 1px solid var(--black05);}
.gsRecord .guesstip::after {content:"";clear: both;display: block;}
.guesstip .hit {color: #5ab463;font-weight: bold;float: right;}
.guesstip .error {color: #ff5d5d;font-weight: bold;float: right;}
.icon-cancel,.icon-hit,.icon-error {background: #ff8c40;width: 16px;height: 16px;border-radius: 50%;margin: 0 0 0 5px;float: right;display: inline-block;position: relative;}
.icon-hit {background: #5ab463;}
.icon-error {background: #ff5d5d;}
.icon-hit::before,.icon-cancel::before,.icon-error::before,.icon-error::after {content:"";background: var(--white);width: 10px;height: 2px;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}
.icon-error::before  {transform: translate(-50%,-50%) rotate(45deg);}
.icon-error::after {transform: translate(-50%,-50%) rotate(-45deg);}
.icon-hit::before {width: 8px;height: 4px;margin-top: -1px;background: none;border: 2px solid var(--white);border-top: none;border-right: none;transform: translate(-50%,-50%) rotate(-45deg);}