/* ==============================================
1. 通用清除浮动工具类
作用：解决父容器因子元素浮动导致的高度塌陷问题
适用场景：所有需要清除浮动的容器（如.paipan-result .-col、.-horizontal等）
============================================== */
.clear::after {
    display: block; /* 转换为块级元素，确保独占一行 */
    clear: both; /* 清除左右两侧浮动影响 */
    content: ""; /* 伪元素必须有content属性（空值也可），否则不生效 */
}

.yinggan {
    color: #888;
    font-size: 0.8em;
    line-height: 1; /* 确保上下排列紧凑 */
}
/* ==============================================
3. 响应式适配（移动端屏幕适配）
按屏幕宽度从大到小适配：平板（768px）→ 小手机（410px）
============================================== */
/* 3.1 平板端适配（屏幕宽度≤768px，如iPad mini、大尺寸手机） */
@media (max-width: 768px) {
    /* 调整“弹性布局容器”字体大小和间距（如旬首、遁局、节气行） */
    .paipan-result .-flex {
        font-size: 0.88em; /* 字体缩小（原字体的88%），适配小屏幕 */
        gap: 0.2em; /* 子元素间距缩小，节省空间 */
        margin-bottom: 0.7em; /* 与下方元素间距缩小 */
    }
    /* 调整节气占位容器宽度（确保节气文字不溢出） */
    .paipan-result .jieqi-placeholder {
        width: 2.9em !important; /* !important强制覆盖其他样式，确保宽度生效 */
    }
}

/* 3.2 小手机端适配（屏幕宽度≤410px，如iPhone SE、小屏安卓机） */
@media (max-width: 410px) {
    /* 进一步缩小“弹性布局容器”字体和间距 */
    .paipan-result .-flex {
        font-size: 0.85em; /* 字体更小（原字体的85%） */
        gap: 0.15em; /* 间距进一步缩小 */
        margin-bottom: 0.6em; /* 垂直间距缩小 */
        padding-bottom: 3px; /* 底部内边距，避免内容贴底 */
    }
    /* 进一步缩小节气占位容器宽度 */
    .paipan-result .jieqi-placeholder {
        width: 2.6em !important; /* 小屏专用宽度，确保与其他元素对齐 */
    }
    /* 调整节气文字布局（取消换行，让图标和文字同行显示） */
    .paipan-result .jie-qi i, /* 节气后的括号/图标 */
    .paipan-result .jie-qi span { /* 节气文字 */
        display: inline; /* 行内显示，避免换行 */
        margin: 0; /* 清除外边距 */
        padding: 0; /* 清除内边距 */
    }
}

/* ==============================================
4. 原有基础样式（排盘核心区域样式，不轻易修改）
对应PHP中.paipan-result容器及内部核心元素（九宫、地支、神煞等）
============================================== */
/* 4.1 排盘结果外层容器（整个排盘模块的根容器） */
.paipan-result {
    position: relative; /* 相对定位，为内部绝对定位元素提供参考 */
    max-width: 360px; /* 最大宽度限制，避免大屏下内容过宽 */
    margin: 0 auto; /* 水平居中，让排盘模块在页面中间显示 */
    padding: 20px 0 40px; /* 上下内边距（顶部20px，底部40px），左右无 padding */
    font-size: 16px; /* 基础字体大小，控制整个排盘区域文字尺寸 */
    line-height: 25px; /* 行高，确保文字垂直间距舒适 */
    font-weight: bold; /* 全局字体加粗，突出排盘内容 */
}

/* 4.2 列容器（控制九宫、地支的列布局） */
.paipan-result .-col {
    position: relative; /* 相对定位，用于内部元素定位 */
    text-align: center; /* 子元素居中对齐 */
}
/* 清除列容器内的浮动（避免高度塌陷） */
.paipan-result .-col::after {
    display: block;
    clear: both;
    content: "";
}
/* 第二个列容器特殊样式（上下内边距5px，调整垂直位置） */
.paipan-result .-col:nth-child(2) {
    padding: 5px 0;
}

/* 4.3 水平布局容器（如地支、神煞的横向排列） */
.paipan-result .-horizontal {
    text-align: center; /* 子元素居中 */
}
/* 清除水平容器内的浮动 */
.paipan-result .-horizontal::after {
    display: block;
    clear: both;
    content: "";
}
/* 水平容器内的行内元素（如地支文字、神煞标识） */
.paipan-result .-horizontal span {
    display: inline-block; /* 行内块级，可设置宽高和间距 */
    line-height: 1; /* 行高重置为1，避免继承父元素的25px行高导致垂直偏移 */
    vertical-align: super; /* 垂直上标对齐，调整文字位置 */
}
/* 月将在水平容器中的特殊定位（微调顶部位置） */
.paipan-result .-horizontal .yuejiang {
    position: relative;
    top: 0px; /* 可根据需要微调上下位置 */
}

/* 4.4 行容器（控制九宫、地支的行布局，横向排列子元素） */
.paipan-result .-row {
    display: flex; /* 弹性布局，让子元素横向排列 */
    position: relative; /* 相对定位，为内部元素提供参考 */
}

/* 4.5 边框样式（控制九宫、元素的边框显示） */
.paipan-result .-line {
    border-width: 0; /* 默认无边框 */
    border-style: solid; /* 边框样式为实线 */
    border-color: var(--tb--gray); /* 边框颜色：使用全局灰色变量（需提前定义） */
}

/* 4.6 文本对齐方式（左/中/右对齐） */
.paipan-result .-al-r {
    text-align: right; /* 文本右对齐（如左侧地支文字） */
}
.paipan-result .-al-c {
    text-align: center; /* 文本居中对齐（如九宫内容、纳音项） */
}
/* 居中容器内的“龙诀”元素（左浮动，与右侧“建星”对称） */
.paipan-result .-al-c .longjue {
    float: left;
}
/* 居中容器内的“建星”元素（右浮动，与左侧“龙诀”对称） */
.paipan-result .-al-c .jianxing {
    float: right;
}

/* 4.7 边框方向控制（单独控制某一侧边框显示） */
.paipan-result .-l {
    border-left-width: 1px; /* 显示左边框 */
}
.paipan-result .-r {
    border-right-width: 1px; /* 显示右边框 */
}
.paipan-result .-b {
    border-bottom-width: 1px; /* 显示下边框 */
}
.paipan-result .-t {
    border-top-width: 1px; /* 显示上边框 */
}

/* 4.8 内边距控制（不同方向/大小的内边距，调整元素内部间距） */
.paipan-result .-pd-t {
    padding-top: 12px; /* 顶部内边距12px */
}
.paipan-result .-pd-t10 {
    padding-top: 8px; /* 顶部内边距8px（命名为t10是历史习惯，实际为8px） */
}
.paipan-result .-pd-b {
    padding-bottom: 8px; /* 底部内边距8px */
}
.paipan-result .-pd-b1 {
    padding-bottom: 1px; /* 底部内边距1px（微调） */
}
.paipan-result .-pd-l {
    padding-left: 8px; /* 左侧内边距8px */
}
.paipan-result .-pd-r {
    padding-right: 8px; /* 右侧内边距8px */
}
.paipan-result .-pd-t6 {
    padding-top: 5px; /* 顶部内边距5px（命名为t6是历史习惯，实际为5px） */
}
.paipan-result .-pd-b6 {
    padding-bottom: 5px; /* 底部内边距5px */
}
.paipan-result .-pd-l6 {
    padding-left: 5px; /* 左侧内边距5px */
}
.paipan-result .-pd-r6 {
    padding-right: 5px; /* 右侧内边距5px */
}
/* 4.9 马星样式（显示“马”字的容器） */
.paipan-result .maxing {
    flex: 0 0 25px; /* 弹性布局：不放大、不缩小、固定宽度25px */
    font-size: 21px; /* 马星字体比基础字体大，突出显示 */
    line-height: 28px; /* 行高适配字体大小，确保垂直居中 */
}
/* 特定地支（申、巳）的马星行高调整（避免文字溢出） */
.paipan-result .maxing.shen,
.paipan-result .maxing.si {
    line-height: 1;
}
/* 空亡相关的标记样式（使用 `-kw` 前缀，可能是 "kong wang" 的缩写） */
.paipan-result .-kw{position:relative}
.paipan-result .-kw::after{
    position:absolute;
    content:"";
    width:19px;
    height:19px;
    border-radius:50%; /* 圆形效果 */
    background:var(--tb--white);
    border:1px solid var(--tb--gray);
    z-index:2
}
/* 空亡标记在左上角 */
.paipan-result .-kw-tl::after{top:-10px;left:-10px}
/* 空亡标记在右下角 */
.paipan-result .-kw-br::after{bottom:-10px;right:-10px}
/* 特定地支（亥、寅）的马星顶部内边距（微调垂直位置） */
.paipan-result .maxing.hai,
.paipan-result .maxing.yin {
    padding-top: 5px;
}

/* 4.10 地支容器（显示12地支的容器，如“子”“丑”） */
.paipan-result .dizhi {
    flex: 0 0 calc(33.33% - 17px); /* 固定宽度：父容器1/3宽度减去17px（适配九宫布局） */
}

/* 4.11 月将相关样式（月将文字及定位） */
.paipan-result .yuejiang {
    position: relative; /* 相对定位，用于微调位置 */
}
/* 天将（绝对定位，基于父容器显示） */
.paipan-result .tianJiang {
    position: absolute; /* 绝对定位，可自由放置 */
    color: var(--tb--base); /* 天将颜色：使用全局基础色变量 */
}

/* 4.12 龙诀相关样式（龙诀文字及定位） */
.paipan-result .longjue {
    position: relative; /* 相对定位 */
}
/* 太阳（绝对定位，基于龙诀容器显示） */
.paipan-result .taiYang {
    position: absolute;
    color: var(--tb--base); /* 使用全局基础色 */
}

/* 4.13 建星相关样式（建星文字及定位） */
.paipan-result .jianxing {
    position: relative; /* 相对定位 */
}
/* 五福（绝对定位，基于建星容器显示） */
.paipan-result .wuFu {
    position: absolute;
    color: var(--tb--base); /* 使用全局基础色 */
}

/* 4.14 垂直布局容器（如侧边地支的垂直排列） */
.paipan-result .-vertical {
    flex: 1; /* 占满父容器剩余宽度，自适应布局 */
}
/* 垂直容器内的元素（如地支文字） */
.paipan-result .-vertical span {
    display: block; /* 块级显示，让元素垂直排列 */
}
/* 垂直容器内的月将（上下内边距4px，调整垂直间距） */
.paipan-result .-vertical .yuejiang {
    padding: 4px 0;
}

/* 4.15 九宫容器（排盘核心的九宫格，如1宫、2宫...9宫） */
.paipan-result .jiuGong {
    position: relative; /* 相对定位，为内部绝对定位元素提供参考 */
    flex: 0 0 calc(33.33% - 17px); /* 固定宽度：父容器1/3宽度减去17px（与地支容器宽度一致） */
    padding-top: calc(33.33% - 17px); /* 顶部内边距=宽度，让九宫容器保持正方形 */
}
/* 4.16 地耳相关样式（左浮动，显示地耳文字） */
.paipan-result .dier {
    float: left;
}
/* 地耳文字颜色（使用全局基础色） */
.paipan-result .dier span {
    color: var(--tb--base);
}

/* 4.17 天目相关样式（左浮动，显示天目文字） */
.paipan-result .tianmu {
    float: left;
}
/* 天目文字颜色（使用全局基础色） */
.paipan-result .tianmu span {
    color: var(--tb--base);
}

/* 4.18 八神相关样式（左浮动，显示八神文字） */
.paipan-result .bashen {
    float: left;
}

/* 4.19 遁支样式（显示九宫遁支文字，如“子”“丑”） */
.paipan-result .dunzhi {
    color: var(--tb--gray); /* 灰色，与其他文字区分 */
    font-size: 12px; /* 字体缩小，作为辅助信息 */
    font-weight: normal; /* 取消加粗，突出其他核心内容 */
}

/* 4.20 天元/金口/玉符相关样式（右浮动，显示对应文字） */
.paipan-result .tianyuan {
    float: right;
}
.paipan-result .jinkou {
    float: right;
}
.paipan-result .yufu {
    float: right;
}
/* 中宫（5宫）特殊处理：天元/金口/玉符不浮动，居中显示 */
.paipan-result .gong5 .tianyuan,
.paipan-result .gong5 .jinkou,
.paipan-result .gong5 .yufu {
    float: unset; /* 取消浮动 */
}
/* 中宫（5宫）遁支定位：绝对定位到右侧中间 */
.paipan-result .gong5 .dunzhi {
    position: absolute;
    right: 0; /* 靠右对齐 */
    top: 50%; /* 垂直居中 */
    transform: translateY(-50%); /* 精确垂直居中（向上移动自身50%高度） */
}

/* 4.21 颜色控制（红色/绿色文字，用于标记特殊状态） */
.paipan-result .-red {
    color: #a43c34; /* 深红色：用于标记“击刑”“门迫”等凶性状态 */
}
.paipan-result .-green {
    color: #629469; /* 深绿色：用于标记“入墓”等中性/特殊状态 */
}


/* ==============================================
5. 特定页面模板样式（仅“遁甲奇门”页面生效）
对应PHP中page-template-dzqi-men-php模板页面
============================================== */
/* 5.1 页面内容容器（整个页面的内容区域） */
.page-template-dzqi-men-php .pagecontent {
    position: relative; /* 相对定位，为内部密码表单定位 */
    min-height: 600px; /* 最小高度600px，避免内容过少时页面过短 */
}
/* 5.2 页面标题样式（“遁甲奇门”标题） */
.page-template-dzqi-men-php .article-header h1 {
    font-size: 32px; /* 标题字体大小 */
    text-align: center; /* 标题居中 */
}
/* 5.3 密码表单样式（页面加密时显示的密码输入框） */
.page-template-dzqi-men-php .post-password-form {
    position: absolute; /* 绝对定位，让表单垂直居中 */
    top: 50%; /* 顶部距离父容器50% */
    width: 100%; /* 占满父容器宽度 */
    padding: 0 15px; /* 左右内边距，避免输入框贴边 */
    transform: translateY(-50%); /* 向上移动自身50%高度，实现垂直居中 */
}
/* 密码表单段落（文字居中） */
.page-template-dzqi-men-php .post-password-form p {
    text-align: center;
}
/* 密码输入框样式 */
.page-template-dzqi-men-php .post-password-form input[type=password] {
    display: inline-block; /* 行内块级，与提交按钮同行 */
    width: 200px; /* 固定宽度 */
    height: 39px; /* 高度与提交按钮一致 */
    font-weight: normal; /* 取消加粗，作为输入框默认样式 */
    padding: 8px 15px; /* 内边距，让文字不贴边 */
    font-size: 14px; /* 输入框字体大小 */
    line-height: 1.5; /* 行高，适配字体 */
    border-radius: 6px 0 0 6px; /* 左半圆角（与提交按钮右半圆角配合） */
    color: var(--tb--base); /* 文字颜色：全局基础色 */
    background-color: #fff; /* 白色背景 */
    background-clip: padding-box; /* 背景裁剪到内边距，避免边框覆盖背景 */
    border: 1px solid #ddd; /* 灰色边框 */
    border-right: 0; /* 取消右边框（与提交按钮合并） */
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out; /* 边框/阴影过渡动画 */
    outline: none; /* 取消默认聚焦外边框 */
}
/* 密码输入框聚焦样式（边框变色，提示聚焦状态） */
.page-template-dzqi-men-php .post-password-form input[type=password]:focus {
    border-color: var(--tb--main); /* 边框颜色：全局主色 */
}
/* 密码表单提交按钮样式 */
.page-template-dzqi-men-php .post-password-form input[type=submit] {
    margin-left: -8px; /* 向左偏移，与输入框无缝衔接 */
    color: #fff; /* 白色文字 */
    border: none; /* 取消边框 */
    background: var(--tb--main); /* 背景色：全局主色 */
    height: 39px; /* 与输入框高度一致 */
    padding: 0 12px; /* 左右内边距 */
    border-radius: 0 6px 6px 0; /* 右半圆角（与输入框左半圆角配合） */
    width: 62px; /* 固定宽度 */
    cursor: pointer; /* 鼠标悬停时显示“手”形，提示可点击 */
}

/* 5.4 排盘包装容器（排盘模块的外层包装） */
.pp-wrapper {
    position: relative; /* 相对定位，为“正时”按钮定位 */
    text-align: center; /* 子元素居中 */
    padding: 20px 0; /* 上下内边距，与其他元素保持间距 */
}

/* 5.5 “正时”按钮样式（右上角的操作按钮） */
.btn-cishi {
    position: absolute; /* 绝对定位，靠右显示 */
    right: 0; /* 靠右对齐 */
    top: 50px; /* 顶部距离父容器50px */
}

/* 5.6 排盘选择器容器（日期、时间选择区域） */
.pp-select {
    display: flex; /* 弹性布局，让选择项横向排列 */
    padding-right: 80px; /* 右侧内边距，为“正时”按钮预留空间 */
}
/* 选择器子容器（每个选择项，如“年”“月”“日”） */
.pp-select>div {
    flex: 1; /* 平均分配宽度 */
    margin-bottom: 24px; /* 底部外边距，与下方排盘区域间距 */
    margin-right: 30px; /* 右侧外边距，与其他选择项间距 */
    text-align: left; /* 文字左对齐，符合选择器习惯 */
}
/* 正时与分之间的距离，选择器最后一个子容器（取消右侧外边距，避免溢出） */
.pp-select>div:last-child {
    margin-right: 60px;
}
/* 选择器标签（如“年：”“月：”） */
.pp-select .-label {
    display: inline-block; /* 行内块级，可设置间距 */
    margin-bottom: 12px; /* 底部外边距，与输入框间距 */
    line-height: 1; /* 行高重置为1 */
    font-size: 15px; /* 标签字体大小 */
}
/* 选择器输入框容器（右侧内边距，避免文字贴边） */
.pp-select .ipt {
    padding-right: 20px;
}

/* 5.7 自定义按钮颜色（绿色/红色按钮） */
.dz-btn-green {
    background-color: #2ba642 !important; /* 绿色背景（确认/成功按钮） */
}
.dz-btn-danger {
    background-color: #f04444 !important; /* 红色背景（取消/删除按钮） */
}

/* 5.8 天将/太阳/五福定位样式（不同方向的绝对定位） */
/* 顶部定位（如“天将”在元素上方显示） */
.-tjt .tianJiang,
.-tjt .taiYang,
.-tjt .wuFu {
    top: calc(-100% - 3px); /* 顶部距离父容器100%+3px（在父容器上方） */
    left: 0; /* 靠左对齐 */
}
/* 左侧定位（如“天将”在元素左侧显示） */
.-tjl .tianJiang,
.-tjl .taiYang,
.-tjl .wuFu {
    top: 50%; /* 垂直居中 */
    transform: translateY(-50%); /* 精确垂直居中 */
    left: calc(-100% - 2px); /* 左侧距离父容器100%+2px（在父容器左侧） */
}
/* 右侧定位（如“天将”在元素右侧显示） */
.-tjr .tianJiang,
.-tjr .taiYang,
.-tjr .wuFu {
    top: 50%; /* 垂直居中 */
    transform: translateY(-50%); /* 精确垂直居中 */
    right: calc(-100% - 2px); /* 右侧距离父容器100%+2px（在父容器右侧） */
}
/* 底部定位（如“天将”在元素下方显示） */
.-tjb .tianJiang,
.-tjb .taiYang,
.-tjb .wuFu {
    left: 0; /* 靠左对齐 */
    bottom: calc(-100% - 5px); /* 底部距离父容器100%+5px（在父容器下方） */
}

/* 5.9 九宫内部容器（九宫格内的内容区域，控制内边距） */
.jiuGong .-inner {
    position: absolute; /* 绝对定位，铺满九宫容器 */
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 8px; /* 内边距，让内容不贴边 */
}

/* 5.10 背景定位容器（备用背景元素，默认隐藏） */
.bgdw {
    position: absolute; /* 绝对定位 */
    z-index: 0; /* 层级0，在其他内容下方 */
    top: 19px; /* 顶部距离父容器19px */
    display: none; /* 默认隐藏，需通过JS控制显示 */
}

/* 5.11 排盘基础信息容器（显示公历、阴历、四柱等基础信息） */
.paipan-base {
    position: relative; /* 相对定位 */
    z-index: 1; /* 层级1，在背景上方 */
    width: 318px; /* 固定宽度 */
    margin: 0 auto 50px auto; /* 水平居中，底部外边距50px */
    line-height: 1; /* 行高重置为1 */
}
/* 排盘基础信息的行容器（弹性布局，横向排列） */
.paipan-base>div {
    display: flex;
    margin-bottom: 16px; /* 底部外边距，行与行之间间距 */
}
/* 排盘基础信息的弹性容器（两端对齐，如“旬首”和“遁局”分居两侧） */
.paipan-base .-flex {
    justify-content: space-between; /* 两端对齐 */
}
/* 节气时间字体大小 */
.paipan-base .-flex i {
    font-size: 10px; /* 小字体 */
    font-style: normal; /* 取消斜体，作为普通文字 */
}
/* 四柱标签（如“四柱：”） */
.paipan-base .sizhu-label {
    display: inline-block; /* 行内块级，可设置宽度 */
    width: 51px; /* 固定宽度，确保标签对齐 */
}
/* 四柱内容（如“甲”“子”） */
.paipan-base .zhu {
    padding-right: 18px; /* 右侧内边距，与其他柱间距 */
}

/* 5.12 奇门标签页（排盘不同模块的切换标签，如“九宫”“地支”） */
.qimen-tabs {
    display: flex; /* 弹性布局，横向排列标签 */
    align-items: center; /* 垂直居中 */
    max-width: 400px; /* 最大宽度限制 */
    overflow: hidden; /* 隐藏溢出内容 */
    text-align: center; /* 标签文字居中 */
    border-radius: 6px; /* 圆角，提升美观度 */
    margin: 0 auto; /* 水平居中 */
}
/* 单个标签样式 */
.qimen-tabs>div {
    flex: 1; /* 平均分配宽度 */
    background-color: var(--tb--bdbg); /* 背景色：全局边框背景色 */
    line-height: 36px; /* 行高，控制标签高度 */
    position: relative; /* 相对定位 */
    cursor: pointer; /* 鼠标悬停显示“手”形，提示可点击 */
    transition: all .25s; /* 所有属性过渡动画（如背景色、颜色） */
    color: var(--tb--main); /* 文字颜色：全局主色 */
    font-weight: bold; /* 字体加粗 */
}
/* 标签页“上一个”按钮的图标（旋转180度，显示为“左箭头”） */
.qimen-tabs .-prev i {
    transform: rotate(180deg); /* 旋转180度 */
    display: inline-block; /* 行内块级，可设置垂直对齐 */
    vertical-align: bottom; /* 垂直底部对齐，调整图标位置 */
}
/* 禁用状态的标签（如无更多内容时） */
.qimen-tabs .disabled {
    color: var(--tb--gray) !important; /* 文字灰色，提示禁用 */
    background-color: var(--tb--bdbg) !important; /* 背景色不变，避免混淆 */
}

/* ==============================================
6. 页面模板的响应式适配（仅“遁甲奇门”页面）
按屏幕宽度从大到小适配：平板（1024px）→ 手机（768px）→ 小手机（600px/410px）
============================================== */
/* 6.1 平板端适配（屏幕宽度≤1024px） */
@media(max-width: 1024px) {
    /* 缩小页面标题字体 */
    .page-template-dzqi-men-php .article-header h1 {
        font-size: 25px;
    }
    /* 调整“正时”按钮定位（从绝对定位改为相对定位，避免遮挡） */
    .btn-cishi {
        position: relative; /* 相对定位 */
        width: 106px; /* 固定宽度 */
        right: 0; /* 取消右对齐 */
        top: 0; /* 取消顶部偏移 */
        margin-right: 16px; /* 右侧外边距，与其他元素间距 */
    }
    /* 调整排盘选择器（取消右侧内边距，适配小屏） */
    .pp-select {
        padding-right: 0;
    }
    /* 缩小选择器子容器的右侧外边距 */
    .pp-select>div {
        margin-right: 20px;
    }
}

/* 6.2 手机端适配（屏幕宽度≤768px） */
@media(max-width: 768px) {
    /* 缩小页面内容容器最小高度 */
    .page-template-dzqi-men-php .pagecontent {
        min-height: 300px;
    }
    /* 排盘选择器换行显示（避免横向溢出） */
    .pp-select {
        flex-wrap: wrap; /* 允许换行 */
    }
    /* 选择器子容器占满宽度（每行一个选择项） */
    .pp-select>div {
        flex: 0 0 100%; /* 不放大、不缩小、占满宽度 */
        margin-right: 0; /* 取消右侧外边距 */
    }
    /* 隐藏选择器标签（节省空间） */
    .pp-select .-label {
        display: none;
    }
    /* 增加排盘基础信息容器的底部外边距 */
    .paipan-base {
        margin-bottom: 60px;
    }
}

/* 6.3 小手机端适配（屏幕宽度≤600px） */
@media(max-width: 600px) {
    /* 页面内容容器取消左右内边距 */
    .page-template-dzqi-men-php .pagecontent {
        padding-left: 0;
        padding-right: 0;
    }
    /* 页面标题容器居中 */
    .page-template-dzqi-men-php .article-header {
        text-align: center;
    }
    /* 进一步缩小页面标题字体 */
    .page-template-dzqi-men-php .article-header h1 {
        font-size: 20px;
    }
    /* 排盘选择器添加左右内边距 */
    .pp-select {
        padding: 0 15px;
    }
    /* 奇门标签页适配小屏（宽度=屏幕宽度-30px，高度增加） */
    .qimen-tabs {
        width: calc(100% - 30px); /* 占满屏幕宽度，减去30px内边距 */
        max-width: 100%; /* 取消最大宽度限制 */
        line-height: 40px; /* 行高增加，提升点击区域 */
    }
}

/* 6.4 超小手机端适配（屏幕宽度≤410px） */
@media(max-width: 410px) {
    /* 缩小排盘结果区域基础字体 */
    .paipan-result {
        font-size: 15px;
    }
    /* 调整排盘行容器宽度（占满屏幕宽度-48px，避免贴边） */
    .paipan-result .-row {
        width: calc(100% - 48px);
        margin: 0 auto; /* 水平居中 */
    }
    /* 缩小第二个列容器的上下内边距 */
    .paipan-result .-col:nth-child(2) {
        padding: 4px 0;
    }
    /* 缩小垂直容器内月将的上下内边距 */
    .paipan-result .-vertical .yuejiang {
        padding: 3px 0;
    }
    /* 缩小水平容器内月将的左右内边距 */
    .paipan-result .-horizontal .yuejiang {
        padding: 0 2px;
    }
    /* 调整顶部内边距（从8px改为5px） */
    .paipan-result .-pd-t10 {
        padding-top: 5px;
    }
    /* 取消底部内边距 */
    .paipan-result .-pd-b {
        padding-bottom: 0;
    }
    /* 缩小马星字体 */
    .paipan-result .maxing {
        font-size: 16px;
    }
    /* 调整左右内边距（微调位置） */
    .paipan-result .-pd-l6 {
        padding-left: 7px;
    }
    .paipan-result .-pd-r6 {
        padding-right: 6px;
    }
    /* 调整天将/太阳/五福的定位（小屏专用居中逻辑） */
    /* 顶部/底部定位改为水平居中 */
    .-tjb .tianJiang,
    .-tjt .tianJiang,
    .-tjb .taiYang,
    .-tjt .taiYang,
    .-tjb .wuFu,
    .-tjt .wuFu {
        left: 50%; /* 水平居中 */
        transform: translateX(-50%); /* 精确水平居中 */
    }
    /* 左侧/右侧定位保持垂直居中 */
    .-tjr .tianJiang,
    .-tjl .tianJiang,
    .-tjr .taiYang,
    .-tjl .taiYang,
    .-tjr .wuFu,
    .-tjl .wuFu {
        top: 50%;
        transform: translateY(-50%);
    }
    /* 缩小九宫内部容器的内边距 */
    .jiuGong .-inner {
        padding: 4px 8px 0; /* 顶部4px，左右8px，底部0 */
    }
    /* 缩小排盘基础信息容器宽度 */
    .paipan-base {
        width: 270px;
        font-size: 16px; /* 基础字体大小 */
    }
    
    
    .flex-container {
        position: relative; /* 开启相对定位 */
    text-indent: -10px; /* 仅对文本生效，向左缩进50px */
    width: 100%; /* 确保容器占满可用宽度，否则两端对齐不明显 */
    margin: 8px 0;
    top: 5px; /* 向上移动10px（负值上移，正值下移） */
}

.nayin {
    font-size: 10px;/* 直接修改此值调节字体大小 */
    margin-left: 10px; /* 左间距 */
    margin-right: 0px; /* 右间距 */
}
}