nav#right-nav>a{
    font-weight: 800;
}
#rightaside,
#leftaside{
    font-size: 13px;
}
#rightaside>div,
nav.leftnav{
   overflow: hidden;
   height: 98%;
   overflow-y: auto;
   -ms-overflow-style: none; /* IE 和 Edge */
   scrollbar-width: none; /* Firefox */
}
/*---------left side scroll---------------------*/
h3#rightStic,
aside#leftaside h3#leftStic{
    top: 0;
    z-index: 1;
    position: sticky;
    box-shadow: 0 0 .4rem .4rem #ffffff;
    background: #ffffff;
    overflow: hidden;
    padding-left: 0.6rem;
    text-overflow: ellipsis;
    line-height: 1.5;
}
header{
    background-color: #000000de; /* 示例主色调，根据你的项目实际 primary 色值替换！ */
    color: #ffffff;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    /* fixed → 固定定位（相对于浏览器窗口，不随滚动移动） */
    position: fixed;
    /* top-0 left-0 right-0 → 顶部、左侧、右侧贴边（宽度铺满窗口） */
    top: 0;
    left: 0;
    right: 0;
    /* z-50 → 层级优先级：50（高于普通元素，避免被遮挡） */
    z-index: 50;
    /* shadow-md → 中等阴影（Tailwind 预设阴影效果，柔和不刺眼） */
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}
header div.headerdiv{
    /* w-6 → 宽度：1.5rem（24px，6×0.25rem=1.5rem） */
    width: 1.5rem;
    /* h-3 → 高度：0.75rem（12px，3×0.25rem=0.75rem） */
    height: 0.75rem;
    /* bg-white → 背景色：纯白（#FFFFFF） */
    background-color: #ffffff;
    /* rounded-md → 中等圆角：0.375rem（6px，Tailwind 预设 rounded-md 对应值） */
    border-radius: 0.375rem;
    /* flex → 弹性布局（用于子元素居中） */
    display: flex;
    /* items-center → 垂直居中（子元素在交叉轴居中） */
    align-items: center;
    /* justify-center → 水平居中（子元素在主轴居中） */
    justify-content: center;
    /* mr-3 → 右侧外边距：0.75rem（12px，3×0.25rem=0.75rem） */
    margin-right: 0.75rem;
}
#rightaside,
#leftaside
{
    line-height: 1;
}
/* 等价于 fixed top-16 left-0 bottom-0 w-64 bg-white border-r border-neutral-dark overflow-y-auto scrollbar-thin p-4 z-40 */
#leftaside {
    /* fixed → 固定定位（相对于浏览器窗口） */
    position: fixed;
    /* top-16 → 距离顶部：4rem（64px，16×0.25rem=4rem） */
    top: 4rem;
    /* left-0 → 距离左侧：0 */
    left: 0;
    /* bottom-0 → 距离底部：0（高度铺满窗口剩余垂直空间） */
    bottom: 0;
    /* w-64 → 宽度：16rem（256px，64×0.25rem=16rem） */
    width: 16rem;
    /* bg-white → 背景色：纯白（#FFFFFF） */
    background-color: #ffffff;
    overflow-y: auto;
    /* scrollbar-thin → 细滚动条（Tailwind 自定义滚动条样式，适配 Chrome/Safari） */
    scrollbar-width: none; /* Firefox 支持：细滚动条 */
    /* p-4 → 内边距：1rem（16px，4×0.25rem=1rem），上下左右均为 1rem */
    padding: 1rem;
    /* z-40 → 层级优先级：40（低于 z-50，避免遮挡顶部导航等更高层级元素） */
    z-index: 40;
}

/* 补充 Chrome/Safari 细滚动条样式（scrollbar-thin 完整效果） */
#leftaside::-webkit-scrollbar {
    width: 6px; /* 滚动条宽度（细滚动条核心） */
}

#leftaside::-webkit-scrollbar-track {
    background: transparent; /* 滚动条轨道透明，不突兀 */
}

#leftaside::-webkit-scrollbar-thumb {
    background-color: rgba(156, 163, 175, 0.5); /* 滚动条滑块颜色（gray-400 半透明） */
    border-radius: 3px; /* 滚动条滑块圆角，与整体风格统一 */
}
/* 等价于 ml-4 mt-1 space-y-1 border-l-2 border-neutral-dark pl-3 */
#div#countrynav {
    /* ml-4 → 左侧外边距：1rem（16px，4×0.25rem=1rem） */
    margin-left: 1rem;
    /* mt-1 → 顶部外边距：0.25rem（4px，1×0.25rem=0.25rem） */
    margin-top: 0.25rem;
    /* space-y-1 → 子元素垂直间距：0.25rem（4px），仅作用于直接子元素 */
    --space-y: 0.25rem;
}

/* space-y-1 核心：给直接子元素添加底部外边距（最后一个子元素除外） */
#div#countrynav > * {
    margin-top: var(--space-y);
}

#div#countrynav > *:first-child {
    margin-top: 0; /* 移除第一个子元素的顶部间距，避免多余空白 */
}

/* 以下为原类名其他样式 */
#div#countrynav {
    padding-left: 0.75rem;
}
main{
    /* ml-64 → 左侧外边距：16rem（256px，64×0.25rem=16rem） */
    margin-left: 16rem;
    /* mr-64 → 右侧外边距：16rem（256px，64×0.25rem=16rem） */
    margin-right: 16rem;
    /* pt-24 → 顶部内边距：6rem（96px，24×0.25rem=6rem） */
    padding-top: 6rem;
    /* pb-16 → 底部内边距：4rem（64px，16×0.25rem=4rem） */
    padding-bottom: 4rem;
    /* px-10 → 左右内边距：2.5rem（40px，10×0.25rem=2.5rem） */
    padding-left: 2.5rem;
    padding-right: 2.5rem;
}
main div#country-container{
    font-size: 14px;
    line-height: 1.3;
}
main div#country-container > h2{
    color: #1f2937;
    /* mb-4 → 底部外边距：1rem（16px，Tailwind 间距单位：1rem=16px，4=1rem） */
    margin-bottom: 1rem;
    text-align: center;
}
/* 等价于 fixed top-16 right-0 bottom-0 w-64 bg-white border-l border-neutral-dark overflow-y-auto scrollbar-thin p-4 z-40 */
#rightaside {
    /* fixed → 固定定位（相对于浏览器窗口，不随滚动移动） */
    position: fixed;
    /* top-16 → 距离顶部：4rem（64px，16×0.25rem=4rem），适配顶部导航高度 */
    top: 3rem;
    /* right-0 → 距离右侧：0（右侧贴边） */
    right: 0;
    /* bottom-0 → 距离底部：0（高度铺满窗口剩余垂直空间） */
    bottom: 0;
    /* w-64 → 宽度：16rem（256px，64×0.25rem=16rem），固定右侧边栏宽度 */
    width: 20rem;
    /* bg-white → 背景色：纯白（#FFFFFF），与主内容区区分 */
    background-color: #ffffff;
    padding-top: 50px;
    overflow-y: auto;
    /* scrollbar-thin → 细滚动条（适配 Chrome/Safari/Firefox） */
    scrollbar-width: none; /* Firefox 专属：细滚动条 */
    /* z-40 → 层级优先级：40（低于顶部导航常用的 z-50，避免遮挡） */
    z-index: 40;
}
/* 补充 Chrome/Safari/Edge 细滚动条样式（还原 scrollbar-thin 完整效果） */
/*#rightaside::-webkit-scrollbar {*/
/*    width: 6px; !* 滚动条宽度（细滚动条核心，与 Firefox 一致） *!*/
/*}*/
/*#rightaside::-webkit-scrollbar-track {*/
/*    background: transparent; !* 滚动条轨道透明，不突兀 *!*/
/*}*/
/*#rightaside::-webkit-scrollbar-thumb {*/
/*    background-color: rgba(156, 163, 175, 0.5); !* 滚动条滑块：gray-400 半透明 *!*/
/*    border-radius: 3px; !* 滑块圆角，与边栏圆角风格统一 *!*/
/*}*/
#rightaside span{
    font-size: 15px;
    font-weight: 700;
    line-height: 2.5;
}
table {
    min-width: 90%;
    background-color: #ffffff;
    border-radius: 0.5rem;
    overflow: hidden;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    border-collapse: separate;
    border-spacing: 0;
}
tbody {
    border-top: 1px solid #E2E8F0;
}
tbody tr:not(:last-child) {
    border-bottom: 1px solid #E2E8F0; /* 模拟 divide-y */
}
thead {
    /* 对应 @apply bg-gray-50 → Tailwind 浅灰色背景 */
    background-color: #f9fafb;
    /* 对应 @apply border-b → 底部边框 */
    border-bottom: 1px solid;
    /* 对应 @apply border-neutral-dark → 边框颜色（用你定义的 #E2E8F0） */
    border-color: #E2E8F0;
}
table th, td {
    padding: 1rem 1.5rem; /* px-6 py-4 等价（1.5rem=24px？不对，Tailwind px-6 是 1.5rem=24px？哦之前记错了！） */
    border: 1px solid #e5e7eb;
    text-align: left;
}
table tr:hover{
    background-color: #f1f1f1; /* text-gray-600 等价色 */
}
table th {
    font-weight: 500; /* font-medium */
    color: #4b5563; /* text-gray-600 等价色 */
    background-color: #f1f1f1; /* 表头浅灰色背景 */
    padding: 10px;
}
div.highlight{
    background-color: #f5f5f5; /* 浅绿色（Tailwind bg-emerald-50） */
    padding: 0.5rem 1rem;
    border-radius: 0.375rem;
}
div.highlight span.p{
    color: #94a3b8; /* 中性灰蓝色（标点专用色，不刺眼） */
}
div.highlight span.w{
    white-space: pre; /* 保留空格宽度，确保缩进对齐 */
}
div.highlight span.nt{
    color: #2563eb; /* 蓝色（突出属性名/关键字） */
    font-weight: 500; /* 轻微加粗 */
}
div.highlight span.s2{
    color: #10b981; /* 清新绿色（字符串专用色，区分文本值） */
}
div.highlight span.mf{
    color: #d52a2a; /* 橙色（数值专用色，突出小数） */
    font-weight: 500; /* 轻微加粗，增强辨识度 */
}
div.highlight span.kd{
    color: #7c3aed; /* 紫色（突出声明类关键字，视觉醒目） */
    font-weight: 600; /* 半粗体，增强辨识度 */
}
div.highlight span.kt{
    color: #0ea5e9; /* 天蓝色（区分类型与普通关键字） */
    font-weight: 500; /* 轻微加粗，不突兀 */
}
div.dropdown-group {
    width: 200px; /* 可根据需求调整宽度 */
}
/* 触发区域（含小尖角） */
div.dropdown-trigger {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 12px;
    cursor: pointer;
}
/* 小尖角样式 */
span.dropdown-arrow {
    transition: transform 0.3s; /* 旋转动画过渡 */
    /*transform: rotate(0);*/
    transform: rotate(180deg);
}
/* 内容区域（默认隐藏） */
div#countrynav {
    display: block;
    padding: 8px 12px;
}
a{
    white-space: normal !important;
    word-break: break-all !important;
    word-wrap: break-word !important; /* 强制长单词换行 */
    overflow-wrap: break-word; /* 更现代的换行方式，兼容主流浏览器 */
    display: block; /* 导航项通常为块级，占满宽度 */
    padding: 8px 12px; /* 内边距，增加点击区域 */
    color: #6b7280; /* 默认文字色（浅灰，未选中） */
    text-decoration: none; /* 移除链接下划线 */
    font-size: 14px; /* 适中字体大小 */
    /*border-radius: 4px; !* 轻微圆角，视觉更柔和 *!*/
    margin-bottom: 4px; /* 项之间的间距 */
}
/* 鼠标悬停样式（非激活状态） */
a:hover:not(.right-nav-active) {
    color: #ABABAB; /* 悬停时文字变主色 */
    background-color: #FFFFFF; /* 背景色（示例：蓝色，可替换为项目主色调） */
}
/* 激活状态样式（right-nav-active） */
.right-nav-active {
    color: #2563eb; /* 文字变白，突出显示 */
    /*background-color: #2563eb; !* 背景色（示例：蓝色，可替换为项目主色调） *!*/
    font-weight: 500; /* 轻微加粗，增强辨识度 */
    /* 可选：添加左侧边框，强化激活视觉 */
    /*border-left: 3px solid #1d4ed8; !* 比背景色深一点的边框色 *!*/
    padding-left: 9px; /* 左侧边框会占用空间，微调内边距保持对齐 */
}
div#secondNavRight{
    padding-left: 12px;
}
/* 语言切换按钮样式 */
.lang-switch {
    margin-left: auto;
}
.lang-btn {
    padding: 6px 12px;
    margin: 0 5px;
    cursor: pointer;
}
.lang-btn.active {
    background: #2196F3;
    color: white;
    border: 1px solid #2196F3;
}