/* ==========================================================
 * 游戏排行挂件 — 样式隔离版
 * 策略：
 *   1) 全部使用「双类名」选择器，特异性 (0,2,0)，覆盖绝大多数主题
 *      的单类名 / 元素选择器。
 *   2) 所有属性**显式写出**，不依赖 inherit / UA 默认。
 *   3) 根容器用 `all: revert;` 再重建基础样式，切断主题的全局
 *      继承（:root 变量、全局 a/li/ol 样式等）。
 *   4) 关键视觉项使用 !important，防止主题用高特异性覆盖（仅
 *      在不影响功能前提下合理使用）。
 * ========================================================== */

/* —— 根容器：切断继承 + 重建基础 —— */
.grw-box.grw-box {
    all: revert !important;
    box-sizing: border-box !important;
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid #eee !important;
    border-radius: 6px !important;
    background: #ffffff !important;
    color: #333333 !important;
    overflow: hidden !important;
    box-shadow: none !important;
    text-shadow: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    position: static !important;
    float: none !important;
    clear: none !important;
    z-index: auto !important;
    transform: none !important;
    font-family: "幼圆", "YouYuan", "Microsoft YaHei", "PingFang SC", "Helvetica Neue", Arial, sans-serif !important;
    font-size: 14px !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-stretch: normal !important;
    font-variant: normal !important;
    line-height: 1.5 !important;
    letter-spacing: normal !important;
    text-align: left !important;
    text-indent: 0 !important;
    text-transform: none !important;
    white-space: normal !important;
    word-spacing: normal !important;
}

/* 容器内所有元素：box-sizing 统一，不继承主题背景/边框 */
.grw-box.grw-box,
.grw-box.grw-box *,
.grw-box.grw-box *::before,
.grw-box.grw-box *::after {
    box-sizing: border-box;
}

.grw-box.grw-box *::before,
.grw-box.grw-box *::after {
    content: none !important;
}

/* —— 顶部标签栏 —— */
.grw-box.grw-box .grw-tabs.grw-tabs {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #fafafa !important;
    border: 0 !important;
    border-bottom: 1px solid #eee !important;
    list-style: none !important;
    box-sizing: border-box !important;
}

/* 单个标签 */
.grw-box.grw-box .grw-tab.grw-tab {
    flex: 1 1 0% !important;
    display: block !important;
    margin: 0 !important;
    padding: 10px 4px !important;
    text-align: center !important;
    color: #666666 !important;
    text-decoration: none !important;
    text-decoration-line: none !important;
    font-size: 14px !important;
    font-family: inherit !important;
    font-weight: normal !important;
    font-style: normal !important;
    line-height: 1.4 !important;
    cursor: pointer !important;
    background: transparent !important;
    border: 0 !important;
    border-right: 1px solid #eee !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
    user-select: none !important;
    -webkit-user-select: none !important;
    transition: color 0.2s ease, background-color 0.2s ease !important;
    -webkit-transition: color 0.2s ease, background-color 0.2s ease !important;
    height: auto !important;
    min-height: unset !important;
    max-height: none !important;
    min-width: unset !important;
    max-width: none !important;
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    float: none !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    word-spacing: normal !important;
}

.grw-box.grw-box .grw-tab.grw-tab:last-child {
    border-right: 0 !important;
}

.grw-box.grw-box .grw-tab.grw-tab:hover,
.grw-box.grw-box .grw-tab.grw-tab:focus {
    color: #FB7299 !important;
    background: #ffffff !important;
    text-decoration: none !important;
    outline: none !important;
}

.grw-box.grw-box .grw-tab.grw-tab.grw-active.grw-active {
    color: #ffffff !important;
    background: #FB7299 !important;
    font-weight: bold !important;
}

/* —— 列表（当日 / 本周 / 本月） —— */
.grw-box.grw-box .grw-list.grw-list {
    display: block !important;
    margin: 0 !important;
    padding: 6px 8px !important;
    list-style: none !important;
    list-style-type: none !important;
    list-style-image: none !important;
    list-style-position: outside !important;
    counter-reset: none !important;
    counter-increment: none !important;
    background: #ffffff !important;
    border: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* 空态 */
.grw-box.grw-box .grw-empty.grw-empty {
    display: block !important;
    text-align: center !important;
    color: #999999 !important;
    padding: 24px 0 !important;
    margin: 0 !important;
    list-style: none !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
    background: transparent !important;
    border: 0 !important;
}

/* —— 单条排行 —— */
.grw-box.grw-box .grw-item.grw-item {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 6px 4px !important;
    background: transparent !important;
    border: 0 !important;
    border-bottom: 1px dashed #f0f0f0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    position: static !important;
    float: none !important;
    list-style: none !important;
    list-style-type: none !important;
    box-sizing: border-box !important;
    text-align: left !important;
    font: inherit !important;
    vertical-align: baseline !important;
}

.grw-box.grw-box .grw-item.grw-item:last-child {
    border-bottom: 0 !important;
}

/* 排名编号圆形徽章 */
.grw-box.grw-box .grw-rank.grw-rank {
    flex: 0 0 22px !important;
    display: block !important;
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;
    line-height: 22px !important;
    text-align: center !important;
    margin: 0 8px 0 0 !important;
    padding: 0 !important;
    background: #cccccc !important;
    color: #ffffff !important;
    border: 0 !important;
    border-radius: 50% !important;
    font-size: 12px !important;
    font-weight: bold !important;
    font-family: inherit !important;
    box-sizing: border-box !important;
    position: static !important;
    float: none !important;
    text-indent: 0 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    vertical-align: middle !important;
    box-shadow: none !important;
}

/* 前三名徽章：主色 */
.grw-box.grw-box .grw-item.grw-item.grw-top.grw-top .grw-rank.grw-rank {
    background: #FB7299 !important;
}

/* —— 链接（图 + 标题） —— */
.grw-box.grw-box .grw-link.grw-link {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    text-decoration: none !important;
    text-decoration-line: none !important;
    color: #333333 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
    position: static !important;
    float: none !important;
    font: inherit !important;
    line-height: 1.4 !important;
    transition: none !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

.grw-box.grw-box .grw-link.grw-link:hover,
.grw-box.grw-box .grw-link.grw-link:focus,
.grw-box.grw-box .grw-link.grw-link:visited,
.grw-box.grw-box .grw-link.grw-link:active {
    color: #333333 !important;
    text-decoration: none !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: none !important;
}

/* 缩略图 */
.grw-box.grw-box .grw-thumb.grw-thumb {
    flex: 0 0 56px !important;
    display: block !important;
    width: 56px !important;
    height: 42px !important;
    min-width: 56px !important;
    max-width: 56px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    margin: 0 8px 0 0 !important;
    padding: 0 !important;
    object-fit: cover !important;
    -o-object-fit: cover !important;
    border: 0 !important;
    border-radius: 4px !important;
    background: #f2f2f2 !important;
    box-shadow: none !important;
    outline: none !important;
    position: static !important;
    float: none !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
    opacity: 1 !important;
}

/* 文章标题（两行省略） */
.grw-box.grw-box .grw-title.grw-title {
    flex: 1 1 auto !important;
    display: -webkit-box !important;
    display: box !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    -webkit-line-clamp: 2 !important;
    line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    box-orient: vertical !important;
    color: #333333 !important;
    font-size: 13px !important;
    font-family: inherit !important;
    font-weight: normal !important;
    font-style: normal !important;
    line-height: 1.4 !important;
    letter-spacing: normal !important;
    word-break: break-all !important;
    word-wrap: break-word !important;
    white-space: normal !important;
    text-align: left !important;
    text-decoration: none !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    text-indent: 0 !important;
    text-transform: none !important;
    vertical-align: baseline !important;
}

.grw-box.grw-box .grw-link.grw-link:hover .grw-title.grw-title,
.grw-box.grw-box .grw-link.grw-link:focus .grw-title.grw-title {
    color: #FB7299 !important;
    text-decoration: none !important;
}